:root {
  color-scheme: dark;
  --bg: #050103;
  --text: #eed4d7;
  --muted: #b98289;
  --control-text: #c37f88;
  --button-text: #c7848d;
  --placeholder: rgba(183, 112, 121, 0.68);
  --line: rgba(126, 26, 41, 0.28);
  --line-strong: rgba(117, 22, 35, 0.08);
  --surface: rgba(23, 3, 7, 0.56);
  --field: rgba(12, 1, 3, 0.58);
  --field-strong: rgba(34, 3, 9, 0.66);
  --accent: #73101d;
  --accent-soft: #a13a46;
  --accent-dark: #2b040a;
  --shadow: 0 20px 46px rgba(0, 0, 0, 0.38), 0 4px 14px rgba(31, 2, 8, 0.2);
  --inner-light: inset 0 1px 0 rgba(111, 21, 34, 0.08), inset 0 -18px 36px rgba(0, 0, 0, 0.18);
  --radius-soft: 28px;
  --radius-field: 22px;
  --radius-pill: 999px;
  --focus: rgba(126, 20, 34, 0.28);
  --hero-overlay:
    radial-gradient(circle at 10% 8%, rgba(115, 16, 29, 0.2), transparent 30%),
    radial-gradient(circle at 88% 68%, rgba(74, 5, 17, 0.17), transparent 34%),
    linear-gradient(180deg, #080103 0%, #100307 48%, #040102 100%);
  --glass-edge:
    linear-gradient(145deg, rgba(76, 8, 18, 0.16), rgba(25, 2, 7, 0.16) 42%, rgba(0, 0, 0, 0.14) 100%);
  --title-gradient: linear-gradient(110deg, #d19aa1 0%, #7e1727 32%, #e1b7bc 55%, #68101e 78%, #bf747e 100%);
  --button-gradient: linear-gradient(145deg, rgba(72, 6, 16, 0.5) 0%, rgba(24, 2, 6, 0.58) 58%, rgba(3, 0, 1, 0.72) 100%);
  --toggle-gradient: linear-gradient(145deg, rgba(58, 5, 14, 0.48), rgba(20, 2, 6, 0.58) 60%, rgba(2, 0, 1, 0.66));
}

:root[data-theme="dark"],
html.dark-theme,
body.dark-theme {
  color-scheme: dark;
  --bg: #050103;
  --text: #eed4d7;
  --muted: #b98289;
  --control-text: #c37f88;
  --button-text: #c7848d;
  --placeholder: rgba(183, 112, 121, 0.68);
  --line: rgba(126, 26, 41, 0.28);
  --line-strong: rgba(117, 22, 35, 0.08);
  --surface: rgba(23, 3, 7, 0.56);
  --field: rgba(12, 1, 3, 0.58);
  --field-strong: rgba(34, 3, 9, 0.66);
  --accent: #73101d;
  --accent-soft: #a13a46;
  --accent-dark: #2b040a;
  --shadow: 0 20px 46px rgba(0, 0, 0, 0.38), 0 4px 14px rgba(31, 2, 8, 0.2);
  --inner-light: inset 0 1px 0 rgba(111, 21, 34, 0.08), inset 0 -18px 36px rgba(0, 0, 0, 0.18);
  --focus: rgba(126, 20, 34, 0.28);
  --hero-overlay:
    radial-gradient(circle at 10% 8%, rgba(115, 16, 29, 0.2), transparent 30%),
    radial-gradient(circle at 88% 68%, rgba(74, 5, 17, 0.17), transparent 34%),
    linear-gradient(180deg, #080103 0%, #100307 48%, #040102 100%);
  --glass-edge:
    linear-gradient(145deg, rgba(76, 8, 18, 0.16), rgba(25, 2, 7, 0.16) 42%, rgba(0, 0, 0, 0.14) 100%);
  --title-gradient: linear-gradient(110deg, #d19aa1 0%, #7e1727 32%, #e1b7bc 55%, #68101e 78%, #bf747e 100%);
  --button-gradient: linear-gradient(145deg, rgba(72, 6, 16, 0.5) 0%, rgba(24, 2, 6, 0.58) 58%, rgba(3, 0, 1, 0.72) 100%);
  --toggle-gradient: linear-gradient(145deg, rgba(58, 5, 14, 0.48), rgba(20, 2, 6, 0.58) 60%, rgba(2, 0, 1, 0.66));
}

* {
  box-sizing: border-box;
  -webkit-tap-highlight-color: transparent;
}

html,
body {
  width: 100%;
  max-width: 100%;
  min-height: 100%;
  overflow-x: hidden;
  background: var(--bg);
  scrollbar-width: none;
  -ms-overflow-style: none;
}

html::-webkit-scrollbar,
body::-webkit-scrollbar {
  width: 0;
  height: 0;
  display: none;
}

body {
  margin: 0;
  min-height: 100vh;
  background: var(--hero-overlay);
  color: var(--text);
  font-family: "Manrope", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: 15px;
  transition: background 260ms ease, color 260ms ease;
  background-size: 140% 140%;
  animation: ambient-field 20s ease-in-out infinite alternate;
}

body::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  background:
    radial-gradient(circle at 18% 22%, rgba(92, 3, 18, 0.2), transparent 18%),
    radial-gradient(circle at 76% 28%, rgba(151, 10, 31, 0.16), transparent 16%),
    radial-gradient(circle at 64% 78%, rgba(91, 0, 15, 0.12), transparent 24%);
  filter: blur(30px);
  opacity: 0.72;
  animation: blood-drift-a 18s ease-in-out infinite alternate;
}

body::after {
  content: "";
  position: fixed;
  inset: auto -14% -18% -14%;
  height: 42vh;
  pointer-events: none;
  background:
    radial-gradient(ellipse at 20% 40%, rgba(96, 0, 17, 0.22), transparent 36%),
    radial-gradient(ellipse at 78% 60%, rgba(143, 6, 28, 0.2), transparent 34%);
  filter: blur(22px);
  opacity: 0.76;
  animation: blood-drift-b 22s ease-in-out infinite alternate;
}

html.dark-theme body::before,
body.dark-theme::before {
  background:
    linear-gradient(94deg, transparent 0%, rgba(130, 25, 38, 0.14) 19%, transparent 42%),
    linear-gradient(158deg, transparent 8%, rgba(38, 2, 8, 0.46) 50%, transparent 76%);
  opacity: 0.5;
}

html.dark-theme body::after,
body.dark-theme::after {
  display: none;
}

button,
input,
select,
textarea {
  font: inherit;
  max-width: 100%;
  min-width: 0;
}

input[type="hidden"] {
  display: none;
}

button:focus,
input:focus,
select:focus,
textarea:focus {
  outline: none;
  -webkit-focus-ring-color: transparent;
}

.app-shell {
  position: relative;
  width: min(100%, 680px);
  min-height: 100vh;
  margin: 0 auto;
  padding: max(16px, env(safe-area-inset-top)) 16px calc(104px + env(safe-area-inset-bottom));
}

.app-header { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 8px 0 16px; }
.app-header h1 { margin: 0; font-family: "Cormorant Garamond", Georgia, serif; font-size: 34px; line-height: 1; font-style: normal; background: var(--title-gradient); background-size: 220% 100%; -webkit-background-clip: text; background-clip: text; color: transparent; animation: title-blood-flow 9s ease-in-out infinite alternate; }
.icon-action, .back-action { width: 46px; height: 46px; flex: 0 0 auto; display: grid; place-items: center; border: 1px solid var(--line); border-radius: 16px; background: linear-gradient(145deg, rgba(74,8,20,.62), rgba(16,1,5,.74)); color: #d9aeb4; box-shadow: var(--inner-light), 0 12px 28px rgba(0,0,0,.25); }
.icon-action svg, .back-action svg { width: 20px; height: 20px; }
.app-view { animation: view-enter 240ms cubic-bezier(.16,1,.3,1) both; }
@keyframes view-enter { from { opacity: 0; transform: translateY(7px); } to { opacity: 1; transform: translateY(0); } }

.pulse-strip { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); margin-bottom: 12px; padding: 14px 4px; border: 1px solid var(--line); border-radius: 20px; background: rgba(13,1,4,.52); backdrop-filter: blur(22px); }
.pulse-strip div { min-width: 0; padding: 0 10px; border-right: 1px solid rgba(126,26,41,.2); }
.pulse-strip div:last-child { border-right: 0; }
.pulse-strip strong { display: block; overflow: hidden; color: #dfbcc1; font-size: 18px; line-height: 1.1; text-overflow: ellipsis; white-space: nowrap; }
.pulse-strip span { display: block; margin-top: 5px; color: rgba(185,130,137,.65); font-size: 9px; }

.next-event { --event-accent:#8d2639; position: relative; min-height: 154px; display: grid; grid-template-columns: 1fr auto; align-items: end; gap: 20px; overflow: hidden; margin-bottom: 12px; padding: 22px; border: 1px solid color-mix(in srgb, var(--event-accent) 40%, transparent); border-radius: 26px; background: radial-gradient(circle at 82% 18%, color-mix(in srgb, var(--event-accent) 28%, transparent), transparent 38%), linear-gradient(145deg, rgba(45,4,12,.82), rgba(7,1,3,.84)); box-shadow: 0 22px 50px rgba(0,0,0,.35), inset 0 1px rgba(173,65,81,.1); cursor: pointer; }
.next-event::after { content:""; position:absolute; inset:0; pointer-events:none; background:linear-gradient(115deg,transparent 15%,rgba(184,73,88,.07) 48%,transparent 72%); transform:translateX(-100%); animation:spotlight-sheen 8s ease-in-out infinite; }
@keyframes spotlight-sheen { 0%,55%{transform:translateX(-100%)} 82%,100%{transform:translateX(100%)} }
.next-event-copy { position: relative; z-index: 2; min-width: 0; }
.next-event-copy span { color: #b77b84; font-size: 10px; }
.next-event-copy h2 { margin: 7px 0 5px; overflow: hidden; color: #eed7da; font-size: 20px; text-overflow: ellipsis; white-space: nowrap; }
.next-event-copy p { margin: 0; display: -webkit-box; overflow: hidden; color: #aa747c; font-size: 11px; line-height: 1.45; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.next-event-date { position: relative; z-index: 2; width: 62px; height: 72px; display: grid; place-items: center; align-content: center; border: 1px solid rgba(185,75,91,.25); border-radius: 20px; background: rgba(8,1,3,.45); }
.next-event-date strong { color: #e5c0c5; font-size: 24px; line-height: 1; }
.next-event-date span { margin-top: 5px; color: #9f6971; font-size: 10px; text-transform: uppercase; }
.next-event-orbit { position:absolute; width:120px; height:120px; right:22px; top:-50px; border:1px solid rgba(145,40,56,.14); border-radius:50%; animation:orbit-turn 18s linear infinite; }
.next-event-orbit i { position:absolute; width:5px; height:5px; border-radius:50%; background:var(--event-accent); box-shadow:0 0 12px var(--event-accent); }
.next-event-orbit i:nth-child(1){top:10px;left:36px}.next-event-orbit i:nth-child(2){right:8px;top:54px}.next-event-orbit i:nth-child(3){bottom:5px;left:46px}
@keyframes orbit-turn { to { transform:rotate(360deg); } }

.calendar-workspace, .selected-events, .settings-panel, .settings-intro, .account-panel { margin-bottom:12px; padding:18px; border:1px solid var(--line); border-radius:26px; background:var(--glass-edge),linear-gradient(160deg,rgba(27,3,8,.72),rgba(7,1,3,.72)); box-shadow:var(--shadow),var(--inner-light); backdrop-filter:blur(25px) saturate(1.14); }
.workspace-header, .section-heading, .setting-heading { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.workspace-header > div:first-child span, .section-heading span, .view-title span, .setting-heading span, .account-panel span { color:var(--muted); font-size:10px; }
.workspace-header h2, .section-heading h2, .view-title h2 { margin:5px 0 0; color:var(--text); font-size:18px; text-transform:capitalize; }
.period-actions { display:flex; gap:5px; }
.period-actions button { min-width:38px; height:38px; display:grid; place-items:center; border:1px solid var(--line); border-radius:12px; background:rgba(12,1,4,.56); color:var(--control-text); font-size:10px; }
.period-actions button:first-child { padding:0 10px; }
.period-actions svg { width:16px; height:16px; }
.calendar-modes { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:4px; margin:16px 0 14px; padding:4px; border-radius:14px; background:rgba(7,0,2,.48); }
.calendar-modes button { min-height:36px; border:0; border-radius:10px; background:transparent; color:#94636a; font-size:10px; }
.calendar-modes button.active { background:rgba(102,17,31,.62); color:#e2bcc1; box-shadow:inset 0 1px rgba(203,91,106,.12); }
.calendar-canvas { min-height:280px; }
.month-weekdays, .month-grid { display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); }
.month-weekdays { margin-bottom:5px; color:rgba(185,130,137,.48); font-size:9px; text-align:center; }
.month-grid { gap:3px; }
.month-day { position:relative; min-width:0; height:62px; display:flex; flex-direction:column; align-items:flex-start; gap:5px; overflow:hidden; padding:7px 5px; border:1px solid transparent; border-radius:11px; background:rgba(8,1,3,.3); color:#b77f87; text-align:left; }
.month-day strong { font-size:11px; line-height:1; }
.month-day.outside { opacity:.3; }.month-day.today{border-color:rgba(157,43,59,.48)}.month-day.selected{background:rgba(91,14,27,.62);border-color:rgba(185,69,86,.35)}
.month-event.single { width:100%; overflow:hidden; padding-left:5px; border-left:2px solid var(--event-color); color:#d0a8ad; font-size:8px; line-height:1.25; text-overflow:ellipsis; white-space:nowrap; }
.month-events { position:relative; width:100%; min-height:0; display:grid; gap:2px; margin-top:auto; }
.month-events.has-more { padding-right:12px; }
.month-event.compact { width:100%; overflow:hidden; padding-left:3px; border-left:2px solid var(--event-color); color:#d0a8ad; font-size:7px; line-height:1.15; text-overflow:ellipsis; white-space:nowrap; }
.month-more { position:absolute; right:0; bottom:-1px; min-width:11px; padding:1px 2px; border-radius:5px; background:color-mix(in srgb,var(--event-color,#8f3448) 10%,transparent); color:#c99ba2; font-size:6px; font-weight:650; line-height:1.15; text-align:center; }
.event-stack { width:100%; display:flex; align-items:center; gap:2px; margin-top:auto; }
.event-stack i { height:3px; flex:1; border-radius:3px; background:var(--event-color); }
.event-stack b { margin-left:2px; color:#c99ba2; font-size:8px; }

.timeline-scroll { overflow-x:auto; scrollbar-width:none; }.timeline-scroll::-webkit-scrollbar{display:none}
.timeline-head { min-width:700px; display:grid; grid-template-columns:44px repeat(7,1fr); position:sticky; top:0; z-index:3; background:rgba(12,1,4,.9); }
.timeline-head > i { border-right:1px solid rgba(126,26,41,.16); }.timeline-head button{min-height:50px;border:0;border-right:1px solid rgba(126,26,41,.16);background:transparent;color:#b47b83}.timeline-head span{display:block;font-size:9px}.timeline-head strong{display:block;margin-top:4px;font-size:13px}
.timeline-body { min-width:700px; height:1242px; display:grid; grid-template-columns:44px 1fr; }
.timeline-hours { display:grid; grid-template-rows:repeat(18,69px); color:rgba(185,130,137,.45); font-size:8px; }.timeline-hours span{border-top:1px solid rgba(126,26,41,.12);padding-top:3px}
.timeline-columns { display:grid; grid-template-columns:repeat(7,1fr); background:repeating-linear-gradient(to bottom,transparent 0 68px,rgba(126,26,41,.12) 68px 69px); }
.timeline-column { position:relative; border-left:1px solid rgba(126,26,41,.12); }
.timeline-event { position:absolute; left:3px; right:3px; min-height:48px; overflow:hidden; padding:6px; border:1px solid color-mix(in srgb,var(--event-color) 45%,transparent); border-radius:9px; background:color-mix(in srgb,var(--event-color) 24%,rgba(10,1,3,.82)); color:#e6c8cc;text-align:left;box-shadow:0 8px 18px rgba(0,0,0,.2)}
.timeline-event time{display:block;color:#c78f98;font-size:8px}.timeline-event b{display:block;margin-top:3px;font-size:9px;line-height:1.25}
.timeline-scroll.single-day .timeline-head,.timeline-scroll.single-day .timeline-body{min-width:100%;}.timeline-scroll.single-day .timeline-head{grid-template-columns:44px 1fr}.timeline-scroll.single-day .timeline-columns{grid-template-columns:1fr}.timeline-scroll.single-day .timeline-event{min-height:56px;padding:9px}.timeline-scroll.single-day .timeline-event b{font-size:12px}

.event-search { min-height:44px; display:flex; align-items:center; gap:9px; margin-bottom:14px; padding:0 13px; border:1px solid var(--line); border-radius:14px; background:rgba(8,1,3,.48); }.event-search svg{width:16px;color:#95646b}.event-search input{width:100%;border:0;background:transparent;color:var(--text);font-size:12px}
.agenda-list{display:grid;gap:16px}.agenda-group header{display:flex;justify-content:space-between;margin-bottom:6px;color:#c99ea4;font-size:11px;text-transform:capitalize}.agenda-group header span{color:#8f5b63}.agenda-item{width:100%;display:grid;grid-template-columns:42px 1fr 16px;gap:10px;align-items:center;padding:12px 0;border:0;border-top:1px solid rgba(126,26,41,.15);background:transparent;color:var(--text);text-align:left}.agenda-item time{color:var(--event-color);font-size:11px;font-weight:700}.agenda-item b{display:block;font-size:12px}.agenda-item span{display:block;margin-top:4px;overflow:hidden;color:var(--muted);font-size:10px;text-overflow:ellipsis;white-space:nowrap}.agenda-item svg{width:14px;color:#81545b}
.text-action { min-height:36px;padding:0 12px;border:1px solid var(--line);border-radius:12px;background:rgba(69,8,19,.42);color:#c9959d;font-size:10px; }
.selected-events .event-list{margin-top:14px}
.event-item{position:relative}.event-item::before{content:"";position:absolute;left:0;top:12px;bottom:12px;width:2px;border-radius:2px;background:var(--event-color)}

.view-title { display:flex;align-items:center;gap:12px;margin:2px 0 14px; }.view-title h2{font-size:22px}.back-action{width:42px;height:42px;border-radius:14px}
.settings-intro { display:grid;grid-template-columns:42px 1fr;gap:13px;align-items:center; }.settings-intro>svg{width:42px;height:42px;padding:10px;border-radius:14px;background:rgba(108,18,33,.46);color:#ce939c}.settings-intro h3,.account-panel h3{margin:0;color:#dfbec3;font-size:15px}.settings-intro p,.account-panel p{margin:5px 0 0;color:var(--muted);font-size:11px;line-height:1.5}
.setting-heading strong{color:#c89098;font-size:10px}.offset-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:16px 0}.offset-options button{min-height:46px;border:1px solid var(--line);border-radius:14px;background:rgba(9,1,3,.5);color:#9d6870;font-size:11px}.offset-options button.active{border-color:rgba(164,52,69,.46);background:linear-gradient(145deg,rgba(104,16,31,.68),rgba(27,2,7,.76));color:#e0b8be;box-shadow:inset 0 1px rgba(217,106,120,.12)}
.settings-actions{display:grid;grid-template-columns:1fr 1.15fr;gap:8px}.secondary-action{min-height:52px;display:flex;align-items:center;justify-content:center;gap:8px;border:1px solid var(--line);border-radius:16px;background:rgba(8,1,3,.48);color:#ad777f;font-size:11px}.secondary-action svg{width:16px}.primary-action.compact{min-height:52px;margin:0;font-size:11px}.settings-status{min-height:18px;margin:12px 0 0;color:#a8747c;font-size:10px;text-align:center}.account-panel{display:grid;grid-template-columns:1fr 30px}.account-panel>svg{width:24px;color:#a66b74}.account-panel p{grid-column:1/-1}

.bottom-nav { position:fixed; z-index:20; left:50%; bottom:max(10px,env(safe-area-inset-bottom)); width:min(calc(100% - 24px),650px); display:grid;grid-template-columns:repeat(3,1fr);gap:4px;padding:5px;border:1px solid rgba(126,26,41,.32);border-radius:21px;background:rgba(9,1,3,.86);box-shadow:0 18px 50px rgba(0,0,0,.5),inset 0 1px rgba(132,36,51,.1);backdrop-filter:blur(28px) saturate(1.2);transform:translateX(-50%)}
.bottom-nav button{min-height:54px;display:flex;align-items:center;justify-content:center;gap:7px;border:0;border-radius:16px;background:transparent;color:#85565d;font-size:10px}.bottom-nav button.active{background:linear-gradient(145deg,rgba(91,14,27,.7),rgba(25,2,7,.78));color:#d9adb3}.bottom-nav svg{width:18px;height:18px}

.hero {
  display: grid;
  gap: 13px;
  padding: 12px 0 12px;
}

[hidden] { display: none !important; }

.view-tabs {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 4px;
  margin-bottom: 12px;
  padding: 4px;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: rgba(12, 1, 4, .5);
  backdrop-filter: blur(22px) saturate(1.15);
  -webkit-backdrop-filter: blur(22px) saturate(1.15);
}

.view-tab {
  min-height: 44px;
  border: 0;
  border-radius: 14px;
  background: transparent;
  color: var(--muted);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  font-weight: 500;
  transition: background 180ms ease, color 180ms ease, transform 160ms ease;
}

.view-tab svg { width: 17px; height: 17px; }
.view-tab.active { color: #e7c3c7; background: linear-gradient(145deg, rgba(91, 11, 24, .66), rgba(28, 2, 7, .78)); box-shadow: inset 0 1px rgba(188, 77, 92, .12), 0 8px 20px rgba(0, 0, 0, .2); }

.hero-toolbar {
  display: flex;
  justify-content: flex-end;
}

.theme-toggle,
.primary-action,
input,
select,
textarea,
.panel,
.success-dialog > div {
  backdrop-filter: blur(24px) saturate(1.18);
  -webkit-backdrop-filter: blur(24px) saturate(1.18);
}

.theme-toggle {
  position: relative;
  min-width: 118px;
  min-height: 42px;
  padding: 5px 13px 5px 5px;
  border: 1px solid var(--line);
  border-radius: var(--radius-pill);
  background: var(--toggle-gradient), var(--surface);
  color: var(--control-text);
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-size: 13px;
  font-weight: 500;
  box-shadow: var(--inner-light), 0 12px 26px rgba(84, 16, 27, 0.1);
  overflow: hidden;
  transition: transform 160ms cubic-bezier(0.25, 1, 0.5, 1), border-color 220ms ease, background 260ms ease;
  background-size: 180% 180%;
  animation: glass-flow 12s ease-in-out infinite alternate;
}

.theme-toggle::before,
.primary-action::before,
.panel::before,
input::before,
select::before {
  content: "";
  position: absolute;
  inset: 1px;
  border-radius: inherit;
  pointer-events: none;
}

.theme-toggle::before,
.primary-action::before,
.panel::before {
  background: linear-gradient(128deg, rgba(255, 255, 255, 0.36), transparent 34%, rgba(255, 255, 255, 0.08) 72%, transparent);
  mix-blend-mode: screen;
  opacity: 0.26;
}

html.dark-theme .theme-toggle::before,
html.dark-theme .primary-action::before,
html.dark-theme .panel::before,
body.dark-theme .theme-toggle::before,
body.dark-theme .primary-action::before,
body.dark-theme .panel::before {
  background: linear-gradient(128deg, rgba(84, 11, 23, 0.16), transparent 36%, rgba(45, 4, 11, 0.12) 72%, transparent);
  mix-blend-mode: normal;
  opacity: 0.18;
}

.theme-toggle-track {
  width: 32px;
  height: 32px;
  padding: 3px;
  border-radius: var(--radius-pill);
  background: rgba(116, 13, 29, 0.16);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-shadow: inset 0 0 0 1px var(--line-strong), inset 0 -8px 16px rgba(98, 26, 38, 0.08);
}

.theme-toggle-thumb {
  width: 26px;
  height: 26px;
  border-radius: var(--radius-pill);
  background: linear-gradient(145deg, rgba(150, 36, 50, 0.42), rgba(71, 10, 19, 0.36) 58%, rgba(18, 2, 5, 0.24));
  color: var(--button-text);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.24), 0 6px 14px rgba(71, 10, 19, 0.18);
}

html.dark-theme .theme-toggle-track,
body.dark-theme .theme-toggle-track {
  background: rgba(11, 1, 3, 0.58);
  box-shadow: inset 0 0 0 1px rgba(108, 18, 31, 0.14), inset 0 -8px 16px rgba(0, 0, 0, 0.24);
}

html.dark-theme .theme-toggle-thumb,
body.dark-theme .theme-toggle-thumb {
  background: linear-gradient(145deg, rgba(62, 5, 14, 0.76), rgba(23, 2, 6, 0.82) 58%, rgba(3, 0, 1, 0.9));
  box-shadow: inset 0 1px 0 rgba(91, 16, 28, 0.1), 0 6px 14px rgba(0, 0, 0, 0.34);
}

.theme-toggle svg {
  width: 14px;
  height: 14px;
  stroke-width: 2.1;
}

.theme-toggle-text {
  color: var(--control-text);
}

.hero-copy {
  display: grid;
  min-width: 0;
}

h1,
h2,
p {
  margin: 0;
}

.hero h1 {
  width: 100%;
  max-width: 100%;
  font-family: "Cormorant Garamond", Georgia, serif;
  font-size: 36px;
  font-weight: 700;
  line-height: 1.18;
  letter-spacing: 0;
  white-space: nowrap;
  padding-bottom: 0.12em;
  background: var(--title-gradient);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  text-shadow: 0 10px 24px rgba(86, 18, 28, 0.16);
  font-style: normal;
  font-variation-settings: normal;
  transform: translateY(1px);
  background-size: 240% 100%;
  animation: title-blood-flow 9s ease-in-out infinite alternate;
}

@media (max-width: 380px) {
  .hero h1 {
    font-size: 31px;
  }
}

.panel {
  --glass-x: 26%;
  --glass-y: 12%;
  position: relative;
  width: 100%;
  max-width: 100%;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: var(--radius-soft);
  background:
    var(--glass-edge),
    linear-gradient(180deg, var(--surface), rgba(255, 255, 255, 0.08));
  box-shadow: var(--shadow), var(--inner-light);
  padding: 18px;
  isolation: isolate;
  background-size: 180% 180%;
  animation: glass-flow 16s ease-in-out infinite alternate-reverse;
}

.panel::after {
  content: "";
  position: absolute;
  inset: 1px;
  z-index: 0;
  border-radius: inherit;
  pointer-events: none;
  background:
    radial-gradient(circle at var(--glass-x) var(--glass-y), rgba(255, 255, 255, 0.16), transparent 18%),
    radial-gradient(circle at calc(100% - var(--glass-x)) calc(100% - var(--glass-y)), rgba(118, 6, 25, 0.12), transparent 24%);
  opacity: 0.42;
  transition: background-position 180ms cubic-bezier(0.25, 1, 0.5, 1), opacity 220ms ease;
  mix-blend-mode: soft-light;
}

html.dark-theme .panel::after,
body.dark-theme .panel::after {
  background:
    radial-gradient(circle at var(--glass-x) var(--glass-y), rgba(112, 19, 34, 0.13), transparent 18%),
    radial-gradient(circle at calc(100% - var(--glass-x)) calc(100% - var(--glass-y)), rgba(28, 1, 7, 0.32), transparent 26%);
  opacity: 0.5;
  mix-blend-mode: normal;
}

:root[data-theme="porcelain"] .panel {
  border-color: rgba(96, 0, 18, 0.36);
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.54) 42%, rgba(104, 0, 19, 0.14)),
    rgba(255, 255, 255, 0.6);
  box-shadow:
    0 26px 62px rgba(78, 2, 17, 0.22),
    0 0 0 1px rgba(255, 255, 255, 0.72),
    inset 0 1px 0 rgba(255, 255, 255, 0.92),
    inset 0 -20px 36px rgba(92, 4, 17, 0.055);
}

html.dark-theme .panel,
body.dark-theme .panel {
  background:
    var(--glass-edge),
    linear-gradient(160deg, rgba(37, 5, 11, 0.54), var(--surface) 44%, rgba(4, 0, 1, 0.48));
  border-color: var(--line);
  box-shadow: var(--shadow), inset 0 1px 0 rgba(161, 49, 66, 0.08);
}

.reminder-form {
  position: relative;
  z-index: 1;
  display: grid;
  gap: 14px;
}

.access-denied {
  margin: 0;
  color: var(--muted);
  font-size: 16px;
  font-weight: 500;
  line-height: 1.45;
}

label {
  display: grid;
  min-width: 0;
  gap: 8px;
  color: var(--muted);
  font-size: 13px;
  font-weight: 500;
}

input,
select,
textarea {
  display: block;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  min-height: 60px;
  border: 1px solid var(--line);
  border-radius: var(--radius-field);
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.12), transparent 46%, rgba(100, 20, 31, 0.025)),
    var(--field);
  color: var(--control-text);
  box-shadow: inset 0 1px 0 var(--line-strong), inset 0 -8px 20px rgba(52, 5, 12, 0.025);
  padding: 2px 17px 0;
  font-size: 16px;
  font-weight: 500;
  line-height: 1.35;
  letter-spacing: 0;
  appearance: none;
  -webkit-appearance: none;
  transition: border-color 180ms ease, box-shadow 220ms cubic-bezier(0.25, 1, 0.5, 1), background 260ms ease, transform 160ms cubic-bezier(0.25, 1, 0.5, 1);
  background-size: 190% 190%;
  animation: glass-flow 14s ease-in-out infinite alternate;
}

:root[data-theme="porcelain"] input,
:root[data-theme="porcelain"] select,
:root[data-theme="porcelain"] textarea {
  border-color: rgba(101, 0, 19, 0.25);
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.84), transparent 48%, rgba(117, 0, 22, 0.08)),
    rgba(255, 255, 255, 0.68);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.86),
    inset 0 -10px 24px rgba(78, 3, 16, 0.055),
    0 8px 22px rgba(78, 3, 16, 0.035);
}

textarea {
  min-height: 84px;
  resize: none;
  overflow: hidden;
  line-height: 1.45;
  padding-top: 14px;
  padding-bottom: 14px;
}

.time-shell {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 10px;
}

.time-shell select {
  padding-left: 18px;
  padding-right: 34px;
}

.time-shell svg {
  right: 15px;
}

html.dark-theme input,
html.dark-theme select,
html.dark-theme textarea,
body.dark-theme input,
body.dark-theme select,
body.dark-theme textarea {
  background:
    linear-gradient(135deg, rgba(119, 25, 40, 0.11), transparent 40%, rgba(0, 0, 0, 0.2)),
    var(--field);
  border-color: rgba(126, 26, 41, 0.24);
  box-shadow: inset 0 1px 0 rgba(132, 32, 48, 0.1), inset 0 -10px 22px rgba(0, 0, 0, 0.16);
}

html.dark-theme .select-shell select,
html.dark-theme .time-shell select,
body.dark-theme .select-shell select,
body.dark-theme .time-shell select {
  background:
    linear-gradient(135deg, rgba(119, 25, 40, 0.1), transparent 42%, rgba(0, 0, 0, 0.22)),
    var(--field);
  color: var(--control-text);
}

select {
  text-align: center;
  text-align-last: center;
  padding-left: 46px;
  padding-right: 46px;
  line-height: 1.35;
  color: var(--control-text);
}

select.is-empty,
input::placeholder,
textarea::placeholder {
  color: var(--placeholder);
  font-weight: 500;
}

input:focus,
select:focus,
textarea:focus {
  border-color: rgba(141, 24, 40, 0.44);
  box-shadow:
    inset 0 1px 0 var(--line-strong),
    0 0 0 4px var(--focus),
    0 12px 28px rgba(94, 13, 26, 0.12);
}

.date-shell,
.time-shell,
.select-shell {
  position: relative;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  overflow: hidden;
  border-radius: var(--radius-field);
}

.time-shell {
  overflow: visible;
}

.date-shell input {
  color: transparent;
  caret-color: transparent;
  position: relative;
  z-index: 1;
}

.date-shell input:focus,
.date-shell input:focus-visible,
.date-shell input:active {
  outline: none;
  border-color: var(--line);
  box-shadow: inset 0 1px 0 var(--line-strong), inset 0 -10px 24px rgba(52, 5, 12, 0.035);
  -webkit-focus-ring-color: transparent;
}

.date-shell input::-webkit-datetime-edit,
.date-shell input::-webkit-date-and-time-value,
.date-shell input::-webkit-datetime-edit-fields-wrapper,
.date-shell input::-webkit-datetime-edit-text,
.date-shell input::-webkit-datetime-edit-month-field,
.date-shell input::-webkit-datetime-edit-day-field,
.date-shell input::-webkit-datetime-edit-year-field {
  color: transparent;
  background: transparent;
}

.date-shell input::-webkit-calendar-picker-indicator {
  position: absolute;
  inset: 0;
  width: auto;
  height: auto;
  margin: 0;
  opacity: 0;
  cursor: pointer;
}

.date-shell.has-value input {
  color: transparent;
}

.date-placeholder {
  position: absolute;
  left: 16px;
  right: 46px;
  top: 50%;
  transform: translateY(-50%);
  pointer-events: none;
  z-index: 2;
  color: var(--placeholder);
  font-size: 16px;
  font-weight: 500;
  line-height: 1.35;
  padding-top: 1px;
}

.date-shell.has-value .date-placeholder {
  color: var(--control-text);
}

.date-shell svg,
.time-shell svg,
.select-shell svg {
  position: absolute;
  right: 15px;
  top: 50%;
  width: 18px;
  height: 18px;
  transform: translateY(-50%);
  color: var(--control-text);
  pointer-events: none;
  z-index: 2;
  opacity: 0.78;
}

.time-shell select,
.select-shell select {
  position: relative;
  z-index: 1;
}

.primary-action {
  position: relative;
  min-height: 56px;
  border: 1px solid var(--line);
  border-radius: var(--radius-pill);
  background: var(--button-gradient), var(--field-strong);
  color: var(--button-text);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  font-size: 15px;
  font-weight: 600;
  box-shadow: var(--inner-light), 0 18px 36px rgba(65, 7, 17, 0.14);
  overflow: hidden;
  transition: transform 140ms cubic-bezier(0.25, 1, 0.5, 1), box-shadow 220ms ease, opacity 180ms ease;
  background-size: 220% 220%;
  animation: action-blood-flow 8s ease-in-out infinite alternate;
}

.theme-toggle:active,
.primary-action:active,
.theme-toggle.is-pressed,
.primary-action.is-pressed {
  transform: scale(0.975);
}

input.is-pressed,
textarea.is-pressed,
select.is-pressed {
  transform: scale(0.996);
}

.primary-action.is-saving::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(105deg, transparent 22%, rgba(255, 224, 228, 0.12) 46%, transparent 70%);
  transform: translateX(-115%);
  animation: saving-sheen 900ms cubic-bezier(0.25, 1, 0.5, 1) infinite;
}

:root[data-theme="porcelain"] .primary-action {
  border-color: rgba(74, 2, 15, 0.3);
  background:
    linear-gradient(145deg, rgba(150, 7, 30, 0.48), rgba(76, 2, 15, 0.34) 58%, rgba(255, 255, 255, 0.22)),
    rgba(255, 255, 255, 0.42);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.62),
    0 18px 38px rgba(80, 3, 17, 0.22);
}

html.dark-theme .primary-action,
body.dark-theme .primary-action {
  color: var(--button-text);
  text-shadow: none;
  box-shadow: inset 0 1px 0 rgba(72, 10, 21, 0.12), 0 18px 36px rgba(0, 0, 0, 0.34);
}

.primary-action:disabled {
  opacity: 0.62;
}

.primary-action svg {
  width: 18px;
  height: 18px;
  stroke-width: 2;
}

.success-dialog {
  width: min(360px, calc(100vw - 32px));
  border: 0;
  border-radius: var(--radius-soft);
  padding: 0;
  background: transparent;
  color: var(--text);
}

.success-dialog::backdrop {
  background: rgba(8, 2, 4, 0.52);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}

.success-dialog > div {
  display: grid;
  gap: 14px;
  padding: 22px;
  border: 1px solid var(--line);
  border-radius: var(--radius-soft);
  background:
    var(--glass-edge),
    linear-gradient(180deg, var(--surface), var(--field));
  box-shadow: var(--shadow), var(--inner-light);
  animation: dialog-arrive 300ms cubic-bezier(0.16, 1, 0.3, 1) both;
}

@keyframes blood-drift-a {
  from { transform: translate3d(-1.5%, -1%, 0) scale(1.02); }
  to { transform: translate3d(2%, 1.5%, 0) scale(1.08); }
}

@keyframes ambient-field {
  from { background-position: 0% 0%; }
  to { background-position: 100% 72%; }
}

@keyframes glass-flow {
  from { background-position: 0% 20%; }
  to { background-position: 100% 78%; }
}

@keyframes title-blood-flow {
  from { background-position: 0% 50%; filter: saturate(0.9); }
  to { background-position: 100% 50%; filter: saturate(1.16); }
}

@keyframes action-blood-flow {
  from { background-position: 0% 20%; }
  to { background-position: 100% 80%; }
}

@keyframes blood-drift-b {
  from { transform: translate3d(1%, 2%, 0) scale(1.04); }
  to { transform: translate3d(-2%, -1%, 0) scale(1.1); }
}

@keyframes saving-sheen {
  to { transform: translateX(115%); }
}

@keyframes dialog-arrive {
  from { opacity: 0; transform: translateY(8px) scale(0.985); filter: blur(5px); }
  to { opacity: 1; transform: translateY(0) scale(1); filter: blur(0); }
}

@media (hover: hover) and (pointer: fine) {
  .theme-toggle:hover,
  .primary-action:hover {
    transform: translateY(-1px);
  }
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}

/* Interaction pass: selected controls are material states, not text-only tints. */
:root[data-theme] :is(.offset-options button.active, .mini-offsets button.active) {
  border-color: color-mix(in srgb, var(--ui-accent-bright) 44%, var(--active-border));
  background-image:
    radial-gradient(circle at 18% 0%, color-mix(in srgb, var(--ui-accent-bright) 16%, transparent), transparent 46%),
    var(--active-bg);
  color: var(--ui-active-ink);
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--ui-accent-bright) 12%, transparent), inset 0 1px 0 var(--well-highlight);
}

:root[data-theme] .create-field-options input:checked + span {
  border-color: color-mix(in srgb, var(--ui-accent-bright) 38%, var(--active-border));
  background-image:
    radial-gradient(circle at 12% 0%, color-mix(in srgb, var(--ui-accent-bright) 13%, transparent), transparent 44%),
    var(--active-bg);
  color: var(--ui-active-ink);
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--ui-accent-bright) 10%, transparent), inset 0 1px 0 var(--well-highlight);
}

:root[data-theme="blxxdy"] :is(.offset-options button.active, .mini-offsets button.active, .create-field-options input:checked + span) {
  border-color: rgba(187, 72, 94, .34);
  background-image: radial-gradient(circle at 16% 0%, rgba(177, 53, 78, .18), transparent 45%), linear-gradient(148deg, rgba(72, 12, 27, .98), rgba(16, 1, 6, .995));
  color: #ecd2d8;
}

:root[data-theme="porcelain"] :is(.offset-options button.active, .mini-offsets button.active, .create-field-options input:checked + span) {
  border-color: rgba(117, 22, 44, .28);
  background-image: linear-gradient(145deg, rgba(139, 30, 55, .16), rgba(255, 255, 255, .98));
  color: #641529;
  box-shadow: inset 0 1px 0 #fff, inset 0 0 0 1px rgba(116, 22, 44, .06);
}

/* Every rounded surface clips its own material so square pseudo-layer corners never leak. */
:is(
  .calendar-workspace, .next-event, .expense-overview, .week-load, .selected-events,
  .schedule-board, .schedule-tools, .schedule-insights article, .event-editor-panel,
  .template-strip, .subscription-panel, .create-fields-panel, .appearance-panel,
  .settings-intro, .settings-panel, .navigation-settings, .data-panel, .spaces-panel,
  .account-panel, .event-dialog-card, .schedule-dialog-card, .schedule-preferences-card,
  .schedule-import-card
) {
  overflow: hidden;
  background-clip: padding-box;
  isolation: isolate;
}
:is(
  .calendar-workspace, .next-event, .expense-overview, .week-load, .selected-events,
  .schedule-board, .schedule-tools, .event-editor-panel, .template-strip,
  .subscription-panel, .create-fields-panel, .appearance-panel, .settings-intro,
  .settings-panel, .navigation-settings, .data-panel, .spaces-panel, .account-panel
)::before,
:is(
  .calendar-workspace, .next-event, .expense-overview, .week-load, .selected-events,
  .schedule-board, .schedule-tools, .event-editor-panel, .template-strip,
  .subscription-panel, .create-fields-panel, .appearance-panel, .settings-intro,
  .settings-panel, .navigation-settings, .data-panel, .spaces-panel, .account-panel
)::after { border-radius: inherit; }

:root[data-theme="porcelain"] .selected-events {
  background-image: linear-gradient(148deg, rgba(255,255,255,.995), rgba(248,240,244,.98));
}
:root[data-theme="porcelain"] .selected-events :is(.events-empty, .event-item) {
  border-color: rgba(112,22,43,.11);
  background: rgba(255,255,255,.9);
  color: #5f2634;
  box-shadow: inset 0 1px 0 #fff;
}

/* Archive behaves like a physical bottom sheet with gesture-coupled backdrop. */
.cabinet-archive::backdrop {
  opacity: var(--archive-backdrop, 0);
  transition: opacity 220ms ease, backdrop-filter 220ms ease, -webkit-backdrop-filter 220ms ease;
}
.cabinet-archive.is-presented::backdrop { opacity: var(--archive-backdrop, 1); }
.cabinet-archive.is-closing::backdrop {
  opacity: 0;
  backdrop-filter: blur(0);
  -webkit-backdrop-filter: blur(0);
}
dialog.cabinet-archive[open] > .cabinet-archive-card {
  animation: none !important;
  transform: translate3d(0, calc(28px + var(--archive-drag-y, 0px)), 0);
  opacity: .72;
  transition: transform 280ms cubic-bezier(.22,1,.36,1), opacity 220ms ease;
  will-change: transform;
}
dialog.cabinet-archive.is-presented[open] > .cabinet-archive-card {
  transform: translate3d(0, var(--archive-drag-y, 0px), 0);
  opacity: 1;
}
dialog.cabinet-archive.is-dragging[open] > .cabinet-archive-card { transition: none; }
dialog.cabinet-archive.is-closing[open] > .cabinet-archive-card {
  transition: transform 240ms cubic-bezier(.4,0,1,1), opacity 190ms ease;
  opacity: .82;
}
.cabinet-archive-card { touch-action: pan-y; }
.cabinet-archive-handle,
.cabinet-archive .section-heading { cursor: grab; touch-action: none; user-select: none; }
.cabinet-archive.is-dragging :is(.cabinet-archive-handle, .section-heading) { cursor: grabbing; }

@media (prefers-reduced-motion: reduce) {
  dialog.cabinet-archive[open] > .cabinet-archive-card,
  .cabinet-archive::backdrop { transition-duration: 1ms !important; }
}

/* Personal categories and event cost. */
.category-create-trigger {
  width: 100%;
  min-height: 42px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  margin-top: 8px;
  border: 1px solid var(--well-border);
  border-radius: 15px;
  background: var(--tray-bg);
  color: var(--ui-faint);
  font-size: 9px;
  box-shadow: inset 0 1px 0 var(--well-highlight);
  transition: transform 160ms var(--ease-out-premium), color 180ms ease, background 180ms ease;
}
.category-create-trigger svg { width: 15px; }
.category-create-trigger.active { color: var(--ui-text); background: var(--well-bg); }
.category-create-trigger:active { transform: scale(.985); }
.category-creator[hidden] { display: none !important; }
.category-creator {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
  margin-top: 8px;
  padding: 11px;
  border: 1px solid var(--well-border);
  border-radius: 18px;
  background: var(--well-bg);
  box-shadow: inset 0 1px 0 var(--well-highlight), inset 0 -1px 0 var(--well-lowlight);
  animation: category-creator-in 240ms var(--ease-out-premium) both;
}
@keyframes category-creator-in { from { opacity: 0; transform: translateY(-5px) scale(.985); } }
.category-creator > input { min-width: 0; min-height: 44px; padding: 0 12px; border-radius: 14px; font-size: 10px; }
.category-color-options { grid-column: 1 / -1; display: flex; justify-content: space-between; gap: 8px; padding: 2px 1px; }
.category-color-options button {
  width: 30px;
  height: 30px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: var(--choice-color);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.16), 0 5px 12px color-mix(in srgb, var(--choice-color) 25%, transparent);
  transition: transform 180ms var(--ease-out-premium), box-shadow 180ms ease;
}
.category-color-options button.active { transform: scale(.78); box-shadow: 0 0 0 3px var(--ui-page-start), 0 0 0 5px color-mix(in srgb, var(--choice-color) 68%, var(--ui-muted)); }
.category-create-save { min-width: 92px; min-height: 44px; display: flex; align-items: center; justify-content: center; gap: 6px; padding: 0 12px; border: 1px solid var(--active-border); border-radius: 14px; background: var(--active-bg); color: var(--ui-active-ink); font-size: 8px; }
.category-create-save svg { width: 14px; }
.category-creator > p { grid-column: 1 / -1; min-height: 0; margin: 0; color: var(--ui-accent-bright); font-size: 8px; text-align: center; }
.schedule-category-trigger { margin-top: -2px; }
.schedule-category-creator { margin-top: -2px; }
.category-picker button:nth-child(7) { grid-column: auto; width: auto; justify-self: stretch; }

.expense-input-shell { display: grid; grid-template-columns: minmax(0, 1fr) 108px; gap: 8px; }
.expense-input-shell input,
.expense-input-shell select { min-width: 0; }
.reminder-form label[data-create-field="cost"] > small { margin: -4px 3px 0; color: var(--ui-faint); font-size: 8px; font-weight: 400; line-height: 1.45; }

/* Planned spending in the overview. Mixed currencies stay separate. */
.expense-overview {
  margin-bottom: 12px;
  padding: 18px;
  border: 1px solid var(--plate-border);
  border-radius: var(--plate-radius);
  background: var(--plate-bg);
  box-shadow: inset 0 1px 0 var(--plate-highlight), inset 0 -1px 0 var(--plate-lowlight), var(--plate-shadow);
}
.expense-heading { align-items: flex-start; gap: 12px; }
.expense-heading > div:first-child { min-width: 0; }
.expense-periods { display: flex; flex: 0 0 auto; gap: 3px; padding: 3px; border-radius: 13px; background: var(--tray-bg); box-shadow: inset 0 1px 0 var(--well-highlight); }
.expense-periods button { min-height: 29px; padding: 0 9px; border: 0; border-radius: 10px; background: transparent; color: var(--ui-faint); font-size: 7px; transition: background 180ms ease, color 180ms ease, transform 160ms var(--ease-out-premium); }
.expense-periods button.active { background: var(--active-bg); color: var(--ui-active-ink); }
.expense-periods button:active { transform: scale(.95); }
.expense-summary { min-height: 96px; display: grid; align-items: center; margin-top: 14px; padding: 16px; border-radius: 20px; background: var(--well-bg); box-shadow: inset 0 1px 0 var(--well-highlight), inset 0 -1px 0 var(--well-lowlight); }
.expense-total-copy { min-width: 0; }
.expense-summary:has(.expense-total-copy) { grid-template-columns: minmax(0, 1fr) 32px; gap: 12px; }
.expense-summary > svg { width: 25px; color: var(--ui-accent-bright); opacity: .78; }
.expense-total-copy span,.expense-total-copy strong,.expense-total-copy small { display: block; }
.expense-total-copy span { color: var(--ui-faint); font-size: 8px; }
.expense-total-copy strong { margin-top: 6px; color: var(--ui-ink); font-size: clamp(18px, 5.8vw, 27px); font-weight: 600; line-height: 1.2; overflow-wrap: anywhere; }
.expense-total-copy small { margin-top: 6px; color: var(--ui-muted); font-size: 8px; }
.expense-empty { display: grid; grid-template-columns: 34px minmax(0, 1fr); align-items: center; gap: 12px; }
.expense-empty > svg { width: 23px; color: var(--ui-accent-bright); }
.expense-empty b,.expense-empty span { display: block; }
.expense-empty b { color: var(--ui-text); font-size: 10px; }
.expense-empty span { margin-top: 4px; color: var(--ui-faint); font-size: 8px; line-height: 1.45; }
.expense-breakdown { display: grid; gap: 7px; margin-top: 9px; }
.expense-row { position: relative; min-height: 48px; display: grid; grid-template-columns: 4px minmax(0, 1fr) auto; align-items: center; gap: 10px; overflow: hidden; padding: 8px 11px; border-radius: 15px; background: var(--tray-bg); box-shadow: inset 0 1px 0 var(--well-highlight); animation: glass-reveal 280ms var(--ease-out-premium) both; }
.expense-row::before { position: absolute; inset: auto 0 0; height: 2px; background: linear-gradient(90deg, var(--expense-color) calc(var(--expense-share) * 100%), transparent 0); opacity: .62; content: ""; }
.expense-row > i { width: 4px; height: 23px; border-radius: 4px; background: var(--expense-color); }
.expense-row span b,.expense-row span small { display: block; }
.expense-row span b { color: var(--ui-text); font-size: 9px; font-weight: 500; }
.expense-row span small { margin-top: 3px; color: var(--ui-faint); font-size: 7px; }
.expense-row > strong { color: var(--ui-muted); font-size: 9px; font-weight: 500; }

/* In blxxdy, every account surface uses the subscription card's deep material. */
:root[data-theme="blxxdy"] [data-app-view="settings"] > :is(.stats-grid, section) {
  --account-bloom: rgba(111, 18, 39, .085);
}
:root[data-theme="blxxdy"] [data-app-view="settings"] > section:not(.subscription-panel),
:root[data-theme="blxxdy"] .stats-grid > :is(article, button) {
  border-color: rgba(171, 70, 89, .16);
  background:
    radial-gradient(circle at 14% -6%, var(--account-bloom, rgba(111, 18, 39, .085)), transparent 42%),
    linear-gradient(150deg, rgba(19, 3, 8, .975), rgba(4, 0, 2, .992));
  box-shadow: inset 0 1px 0 rgba(255, 218, 225, .028), inset 0 -1px 0 rgba(0, 0, 0, .32), 0 15px 32px rgba(2, 0, 1, .3);
}
:root[data-theme="blxxdy"] [data-app-view="settings"] :is(.create-field-options label > span, .navigation-visibility label, .navigation-priority .select-shell, .data-actions button, .export-date-shell, .range-presets, .theme-picker button, .offset-options button, .default-view select, .space-create input, .spaces-list article) {
  border-color: rgba(155, 61, 78, .13);
  background: linear-gradient(148deg, rgba(22, 4, 10, .92), rgba(6, 0, 3, .97));
  box-shadow: inset 0 1px 0 rgba(255, 218, 225, .022), inset 0 -1px 0 rgba(0, 0, 0, .28);
}

@media (max-width: 390px) {
  .expense-heading { display: grid; }
  .expense-periods { width: 100%; }
  .expense-periods button { flex: 1; }
  .category-color-options { gap: 6px; }
  .category-color-options button { width: 27px; height: 27px; }
}

@media (prefers-reduced-transparency: reduce) {
  .theme-toggle,
  .panel,
  input,
  select,
  textarea,
  .primary-action,
  .success-dialog > div {
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
    background-color: var(--bg);
  }
}

.success-dialog h2 {
  font-size: 20px;
}

.success-dialog p {
  color: var(--muted);
  line-height: 1.45;
}

.success-dialog > div > svg {
  width: 34px;
  height: 34px;
  color: var(--control-text);
}

.events-view { display: grid; gap: 12px; }
.calendar-panel, .day-events {
  --glass-x: 26%;
  --glass-y: 12%;
  position: relative;
  overflow: hidden;
  padding: 18px;
  border: 1px solid var(--line);
  border-radius: var(--radius-soft);
  background: var(--glass-edge), linear-gradient(160deg, rgba(28, 3, 8, .74), rgba(8, 1, 3, .68));
  box-shadow: var(--shadow), var(--inner-light);
  backdrop-filter: blur(26px) saturate(1.16);
  -webkit-backdrop-filter: blur(26px) saturate(1.16);
}
.calendar-header { display: flex; align-items: center; justify-content: space-between; gap: 14px; margin-bottom: 18px; }
.calendar-header span, .day-events-heading span { display: block; margin-bottom: 5px; color: var(--muted); font-size: 11px; }
.calendar-header h2, .day-events-heading h2 { margin: 0; color: var(--text); font-size: 18px; line-height: 1.25; text-transform: capitalize; }
.month-controls { display: flex; gap: 6px; }
.month-controls button { width: 40px; height: 40px; display: grid; place-items: center; border: 1px solid var(--line); border-radius: 13px; background: rgba(14, 1, 4, .6); color: var(--control-text); }
.month-controls svg { width: 18px; height: 18px; }
.weekdays, .calendar-grid { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); }
.weekdays { margin-bottom: 6px; color: rgba(185, 130, 137, .62); font-size: 10px; text-align: center; }
.calendar-grid { gap: 4px; }
.calendar-day { position: relative; aspect-ratio: 1; min-width: 0; border: 1px solid transparent; border-radius: 12px; background: transparent; color: #c99da3; display: grid; place-items: center; padding: 0; font-size: 12px; }
.calendar-day.outside { color: rgba(154, 103, 110, .32); }
.calendar-day.today { border-color: rgba(157, 43, 59, .48); color: #e8c8cc; }
.calendar-day.selected { background: linear-gradient(145deg, #7b1426, #31050d); border-color: rgba(197, 82, 98, .34); color: #f2dce0; box-shadow: 0 8px 18px rgba(64, 2, 13, .32); }
.calendar-day i { position: absolute; left: 50%; bottom: 5px; width: 4px; height: 4px; border-radius: 50%; background: #b73a4e; transform: translateX(-50%); box-shadow: 0 0 8px rgba(183, 58, 78, .58); }
.calendar-day.selected i { background: #f0b7c0; }
.day-events-heading { margin-bottom: 14px; }
.event-list { display: grid; gap: 8px; }
.event-item { display: grid; grid-template-columns: 52px 1fr; gap: 12px; padding: 14px; border: 1px solid rgba(126, 26, 41, .22); border-radius: 17px; background: rgba(10, 1, 3, .46); }
.event-item time { color: #d0929b; font-size: 13px; font-weight: 600; }
.event-item h3 { margin: 0; color: #e6c8cc; font-size: 14px; font-weight: 600; line-height: 1.35; }
.event-item p { margin: 5px 0 0; color: var(--muted); font-size: 12px; line-height: 1.5; white-space: pre-wrap; overflow-wrap: anywhere; }
.event-item span { display: inline-block; margin-top: 8px; color: rgba(185, 130, 137, .68); font-size: 10px; }
.events-empty { min-height: 112px; display: grid; place-items: center; align-content: center; gap: 9px; color: var(--muted); text-align: center; }
.events-empty svg { width: 24px; height: 24px; stroke-width: 1.5; }
.events-empty p { margin: 0; max-width: 260px; font-size: 12px; line-height: 1.5; }
.events-empty.loading svg { animation: calendar-spin 1s linear infinite; }
@keyframes calendar-spin { to { transform: rotate(360deg); } }

@media (max-width: 420px) {
  .app-shell {
    padding-left: 14px;
    padding-right: 14px;
  }

  .panel {
    padding: 16px;
  }

  .calendar-panel, .day-events { padding: 15px; border-radius: 24px; }
  .calendar-grid { gap: 2px; }
  .calendar-day { border-radius: 10px; }

}

/* Premium interaction layer */
.app-view { animation: none; transform-origin: 50% 24%; }
.app-view.view-exit { pointer-events: none; animation: premium-view-out 150ms cubic-bezier(.4,0,1,1) both; }
.app-view.view-enter { opacity: 0; transform: translateY(14px) scale(.985); filter: blur(7px); }
.app-view.view-enter.view-enter-active { opacity: 1; transform: translateY(0) scale(1); filter: blur(0); transition: opacity 300ms cubic-bezier(.16,1,.3,1), transform 380ms cubic-bezier(.16,1,.3,1), filter 260ms ease-out; }
@keyframes premium-view-out { to { opacity: 0; transform: translateY(-7px) scale(.992); filter: blur(4px); } }

.calendar-canvas { transition: opacity 130ms ease-in, transform 130ms ease-in, filter 130ms ease-in; transform-origin: 50% 10%; }
.calendar-canvas.canvas-exit { opacity: 0; transform: translateY(5px) scale(.993); filter: blur(3px); }
.calendar-canvas.canvas-enter { opacity: 0; transform: translateY(-5px) scale(.993); filter: blur(4px); }
.calendar-canvas.canvas-enter.canvas-enter-active { opacity: 1; transform: none; filter: none; transition: opacity 230ms ease-out, transform 300ms cubic-bezier(.16,1,.3,1), filter 220ms ease-out; }
.card-reveal { opacity: 0; animation: card-materialize 360ms cubic-bezier(.16,1,.3,1) forwards; animation-delay: var(--reveal-delay); }
@keyframes card-materialize { from { opacity: 0; transform: translateY(8px) scale(.985); filter: blur(4px); } to { opacity: 1; transform: none; filter: none; } }

button { touch-action: manipulation; }
button:active, .agenda-item:active, .event-item:active { transform: scale(.975); transition-duration: 80ms; }
.premium-surface { position: relative; isolation: isolate; overflow: hidden; }
.premium-surface::after { content:""; position:absolute; z-index:-1; inset:-80% -30%; pointer-events:none; background:conic-gradient(from 120deg at 50% 50%,transparent 0 38%,rgba(145,38,55,.055) 46%,transparent 54% 100%); animation:surface-refraction 22s linear infinite; }
@keyframes surface-refraction { to { transform:rotate(360deg); } }

.calendar-filters { display:flex; gap:6px; overflow-x:auto; margin:0 -2px 12px; padding:2px 2px 5px; scrollbar-width:none; }
.calendar-filters::-webkit-scrollbar{display:none}
.calendar-filters button { min-height:32px; flex:0 0 auto; display:inline-flex; align-items:center; gap:5px; padding:0 11px; border:1px solid rgba(126,26,41,.2); border-radius:999px; background:rgba(7,1,3,.38); color:#86565e; font-size:9px; white-space:nowrap; transition:color 180ms ease,background 220ms ease,border-color 220ms ease,transform 120ms ease; }
.calendar-filters button.active { border-color:rgba(166,52,70,.42); background:rgba(99,17,31,.6); color:#ddb5bb; box-shadow:0 7px 18px rgba(0,0,0,.18); }
.calendar-filters svg{width:12px;height:12px}
.calendar-hint { margin:11px 0 0; color:rgba(185,130,137,.48); font-size:9px; line-height:1.45; text-align:center; }
.month-day.drop-target { border-color:#b94b5e; background:rgba(130,24,42,.56); box-shadow:inset 0 0 18px rgba(156,38,57,.2); transform:scale(1.025); }
.month-event[draggable=true],.timeline-event[draggable=true]{cursor:grab}.month-event[draggable=true]:active,.timeline-event[draggable=true]:active{cursor:grabbing}

.week-load { padding-bottom:16px; }
.week-load .section-heading>strong { color:#a9737b; font-size:9px; }
.load-bars { height:112px; display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); gap:8px; margin-top:14px; }
.load-bars button { min-width:0; display:grid; grid-template-rows:1fr auto auto; gap:4px; place-items:center; border:0; background:transparent; color:#8f5d65; }
.load-track { width:100%; height:74px; display:flex; align-items:flex-end; padding:3px; border-radius:10px; background:rgba(7,1,3,.42); overflow:hidden; }
.load-track i { width:100%; height:max(5px,calc(var(--load) * 100%)); border-radius:7px; background:linear-gradient(180deg,#9d3044,#48101c); box-shadow:0 0 18px rgba(133,28,46,.25); transform-origin:bottom; animation:load-rise 520ms cubic-bezier(.16,1,.3,1) both; animation-delay:var(--delay); }
@keyframes load-rise { from { transform:scaleY(0); opacity:0; } }
.load-bars b{font-size:9px;color:#b47e86}.load-bars small{font-size:8px;text-transform:capitalize}

.event-item { grid-template-columns:48px 1fr 16px; align-items:center; }
.event-item>button { min-width:0; padding:0; border:0; background:transparent; color:inherit; text-align:left; }
.event-item>button h3 { display:flex; align-items:center; gap:6px; }
.event-item>button h3 svg { width:12px; height:12px; color:var(--event-color); }
.event-item>svg { width:14px; color:#754950; }
.events-empty.actionable { width:100%; border:0; border-radius:16px; background:rgba(8,1,3,.28); }

.quick-create,.template-strip { margin-bottom:12px; padding:14px; border:1px solid var(--line); border-radius:22px; background:var(--glass-edge),rgba(18,2,6,.62); box-shadow:var(--inner-light); }
.quick-create label { min-height:50px; display:grid; grid-template-columns:18px 1fr auto; gap:9px; align-items:center; padding:0 7px 0 13px; border:1px solid rgba(126,26,41,.24); border-radius:16px; background:rgba(7,1,3,.5); }
.quick-create label>svg{width:17px;color:#a86e78}.quick-create input{width:100%;border:0;background:transparent;color:var(--text);font-size:11px}.quick-create button{min-height:36px;padding:0 12px;border:1px solid rgba(149,43,60,.34);border-radius:12px;background:rgba(93,15,29,.62);color:#dab0b7;font-size:9px}.quick-create p{margin:9px 5px 0;color:#89575f;font-size:9px;line-height:1.5}
.template-strip .section-heading{margin-bottom:11px}.template-list{display:flex;gap:7px;overflow-x:auto;padding-bottom:3px;scrollbar-width:none}.template-list::-webkit-scrollbar{display:none}.template-chip,.template-empty{position:relative;min-width:132px;min-height:56px;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:4px;padding:9px 31px 9px 12px;border:1px solid rgba(126,26,41,.22);border-radius:15px;background:linear-gradient(145deg,color-mix(in srgb,var(--template-color) 18%,rgba(9,1,3,.76)),rgba(7,1,3,.72));color:#c998a0;text-align:left}.template-chip::before{content:"";position:absolute;left:0;top:10px;bottom:10px;width:2px;border-radius:2px;background:var(--template-color)}.template-chip b{max-width:100%;overflow:hidden;font-size:10px;text-overflow:ellipsis;white-space:nowrap}.template-chip span{color:#83535b;font-size:8px}.template-chip svg{position:absolute;right:9px;top:9px;width:13px}.template-empty{min-width:100%;display:grid;grid-template-columns:18px 1fr;justify-content:start;padding:12px}.template-empty svg{width:16px}

.form-grid.two { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
.input-shell{position:relative}.input-shell input{width:100%;padding-right:48px}.input-shell>svg{position:absolute;right:17px;top:50%;width:19px;color:var(--control-text);transform:translateY(-50%);pointer-events:none}
.event-colors { display:flex; align-items:center; justify-content:space-between; gap:9px; padding:9px 12px; border:1px solid var(--line); border-radius:18px; background:var(--field); }
.event-colors button { position:relative; width:32px; height:32px; flex:0 0 auto; border:0; border-radius:50%; background:var(--swatch); opacity:.64; box-shadow:inset 0 1px rgba(255,255,255,.08); transition:opacity 180ms ease,transform 220ms cubic-bezier(.16,1,.3,1),box-shadow 220ms ease; }
.event-colors button.active{opacity:1;transform:scale(1.12);box-shadow:0 0 0 3px rgba(9,1,3,.8),0 0 0 4px color-mix(in srgb,var(--swatch) 65%,transparent),0 8px 18px color-mix(in srgb,var(--swatch) 22%,transparent)}
.advanced-settings { border:1px solid var(--line);border-radius:18px;background:rgba(8,1,3,.32);overflow:hidden }.advanced-settings summary{min-height:50px;display:flex;align-items:center;justify-content:space-between;padding:0 15px;color:#b57c85;font-size:11px;list-style:none}.advanced-settings summary::-webkit-details-marker{display:none}.advanced-settings summary svg{width:16px;transition:transform 220ms ease}.advanced-settings[open] summary svg{transform:rotate(180deg)}.advanced-settings>p{margin:0;padding:0 15px;color:#7e4d55;font-size:8px}.mini-offsets{display:flex;flex-wrap:wrap;gap:6px;padding:12px 15px 15px}.mini-offsets button{min-height:30px;padding:0 9px;border:1px solid rgba(126,26,41,.22);border-radius:999px;background:transparent;color:#89565e;font-size:8px}.mini-offsets button.active{background:rgba(104,17,31,.62);color:#d9adb4;border-color:rgba(161,51,68,.4)}
.form-toggles{display:grid;gap:7px}.toggle-row{min-height:58px;display:grid!important;grid-template-columns:42px 1fr;align-items:center;padding:0 14px;border:1px solid var(--line);border-radius:18px;background:rgba(8,1,3,.34)}.toggle-row input{appearance:none;width:38px;height:23px;border:1px solid rgba(126,26,41,.35);border-radius:999px;background:#170308;position:relative;transition:background 220ms ease}.toggle-row input::after{content:"";position:absolute;left:3px;top:3px;width:15px;height:15px;border-radius:50%;background:#794651;transition:transform 260ms cubic-bezier(.16,1,.3,1),background 220ms ease}.toggle-row input:checked{background:#681224}.toggle-row input:checked::after{transform:translateX(15px);background:#d4a4ac}.toggle-row b,.toggle-row small{display:block}.toggle-row b{color:#bb858e;font-size:10px;font-weight:500}.toggle-row small{margin-top:3px;color:#72444c;font-size:8px}
.danger-action{min-height:50px;display:flex;align-items:center;justify-content:center;gap:8px;border:1px solid rgba(136,26,42,.28);border-radius:17px;background:rgba(54,5,14,.34);color:#a35e68;font-size:10px}.danger-action svg{width:16px}

.stats-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-bottom:12px}.stats-grid article{min-height:82px;display:flex;flex-direction:column;justify-content:center;padding:13px;border:1px solid var(--line);border-radius:19px;background:linear-gradient(150deg,rgba(30,3,9,.7),rgba(7,1,3,.62));box-shadow:var(--inner-light)}.stats-grid span{color:#84525a;font-size:8px}.stats-grid strong{margin-top:8px;color:#d5aab1;font-size:20px}
.quiet-hours{display:grid;gap:10px;margin:16px 0;padding:14px;border:1px solid rgba(126,26,41,.2);border-radius:17px;background:rgba(7,1,3,.32)}.quiet-hours span,.default-view>span{display:block;color:#b77c85;font-size:10px}.quiet-hours small{display:block;margin-top:4px;color:#72444b;font-size:8px}.quiet-hours>div:last-child{display:grid;grid-template-columns:1fr 1fr;gap:8px}.quiet-hours label{color:#7e4f57;font-size:8px}.quiet-hours input{width:100%;min-height:40px;margin-top:5px;padding:0 10px;border-radius:12px}
.default-view{display:grid;grid-template-columns:1fr 140px;align-items:center;gap:12px;margin-bottom:16px}.default-view select{min-height:44px;border-radius:14px}
.data-panel,.spaces-panel{margin-bottom:12px;padding:18px;border:1px solid var(--line);border-radius:26px;background:var(--glass-edge),linear-gradient(160deg,rgba(27,3,8,.72),rgba(7,1,3,.72));box-shadow:var(--shadow),var(--inner-light)}.data-panel>p{margin:10px 0 14px;color:#825159;font-size:9px;line-height:1.5}.export-range{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:8px}.export-range input{min-height:43px;border-radius:14px;padding:0 10px}.data-actions{display:grid;grid-template-columns:repeat(3,1fr);gap:7px}.data-actions button{min-height:66px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;border:1px solid rgba(126,26,41,.22);border-radius:15px;background:rgba(8,1,3,.38);color:#9e6871;font-size:8px}.data-actions svg{width:18px}.feed-result{display:grid;grid-template-columns:1fr auto;gap:7px;margin-top:9px}.feed-result input{min-height:40px;border-radius:12px;padding:0 10px;font-size:8px}.feed-result button,.space-create button{border:1px solid rgba(155,44,62,.34);border-radius:12px;background:rgba(97,15,29,.56);color:#c48d96;font-size:8px}
.space-create{display:grid;grid-template-columns:1fr 78px;gap:7px;margin:14px 0}.space-create input{min-height:44px;border-radius:14px;padding:0 12px}.spaces-list{display:grid;gap:7px}.spaces-list article{display:grid;grid-template-columns:1fr 38px;align-items:center;padding:12px 13px;border:1px solid rgba(126,26,41,.2);border-radius:15px;background:rgba(7,1,3,.34)}.spaces-list b,.spaces-list span{display:block}.spaces-list b{color:#bc858e;font-size:10px}.spaces-list span,.space-empty{margin-top:4px;color:#74464e;font-size:8px}.spaces-list button{width:36px;height:36px;display:grid;place-items:center;border:1px solid rgba(126,26,41,.22);border-radius:12px;background:rgba(72,10,21,.38);color:#a66e77}.spaces-list svg{width:15px}

.event-dialog{width:min(calc(100% - 24px),520px);border:0;padding:0;background:transparent;color:var(--text)}.event-dialog::backdrop{background:rgba(2,0,1,.72);backdrop-filter:blur(14px);animation:backdrop-in 220ms ease-out both}@keyframes backdrop-in{from{opacity:0}}.event-dialog-card{--event-color:#9f3044;position:relative;overflow:hidden;padding:24px;border:1px solid color-mix(in srgb,var(--event-color) 42%,transparent);border-radius:28px;background:radial-gradient(circle at 86% 4%,color-mix(in srgb,var(--event-color) 25%,transparent),transparent 32%),linear-gradient(155deg,rgba(34,3,10,.96),rgba(7,1,3,.97));box-shadow:0 32px 90px rgba(0,0,0,.62);animation:event-dialog-in 380ms cubic-bezier(.16,1,.3,1) both}@keyframes event-dialog-in{from{opacity:0;transform:translateY(18px) scale(.94);filter:blur(8px)}}.dialog-close{position:absolute;right:15px;top:15px;width:38px;height:38px;display:grid;place-items:center;border:1px solid rgba(126,26,41,.24);border-radius:13px;background:rgba(7,1,3,.5);color:#a56c75}.dialog-close svg{width:17px}.dialog-category{display:block;padding-right:44px;color:var(--event-color);font-size:9px;text-transform:uppercase}.event-dialog h2{margin:10px 42px 7px 0;color:#ead0d4;font-size:23px;line-height:1.2}.event-dialog-card>p{margin:0;color:#9e6870;font-size:11px;line-height:1.55;white-space:pre-wrap}.dialog-meta{display:grid;gap:9px;margin:18px 0}.dialog-meta span{display:flex;align-items:center;gap:9px;color:#a36d75;font-size:9px}.dialog-meta svg{width:15px;color:var(--event-color)}.dialog-actions{display:grid;grid-template-columns:1fr 1fr;gap:7px}.dialog-actions button{min-height:50px;display:flex;align-items:center;justify-content:center;gap:7px;border:1px solid rgba(126,26,41,.22);border-radius:15px;background:rgba(10,1,4,.48);color:#ad747d;font-size:9px}.dialog-actions button.danger{color:#a65f69;background:rgba(62,6,16,.34)}.dialog-actions svg{width:15px}

@media (max-width:420px){
  .app-header h1{font-size:32px}.calendar-workspace{padding:15px}.calendar-filters{margin-left:-1px;margin-right:-1px}.month-day{height:60px;padding:6px 4px}.month-event.single{font-size:7px}.form-grid.two{grid-template-columns:1fr}.event-colors{gap:7px;padding:9px}.event-colors button{width:29px;height:29px}.data-actions{grid-template-columns:1fr 1fr}.data-actions button:last-child{grid-column:1/-1;min-height:54px;flex-direction:row}.default-view{grid-template-columns:1fr 130px}.event-dialog-card{padding:21px}.quick-create label{grid-template-columns:17px 1fr}.quick-create label button{grid-column:1/-1;width:100%;margin-bottom:7px}.stats-grid article{padding:10px}.stats-grid strong{font-size:18px}
}

/* 2026-08 calendar and editor refinement */
:root {
  --ease-glass: cubic-bezier(.32, .72, 0, 1);
  --ease-out-premium: cubic-bezier(.23, 1, .32, 1);
}

button,
.calendar-workspace,
.month-grid,
.month-day {
  touch-action: manipulation;
}

button {
  -webkit-user-select: none;
  user-select: none;
}

.calendar-workspace {
  width: calc(100% + 24px);
  max-width: none;
  margin-right: -12px;
  margin-left: -12px;
  padding: 18px 11px;
  background:
    radial-gradient(circle at 82% 2%, rgba(121, 25, 41, .16), transparent 29%),
    linear-gradient(142deg, rgba(63, 8, 18, .14), transparent 38%),
    rgba(10, 1, 4, .64);
  box-shadow: inset 0 1px 0 rgba(143, 45, 61, .11), inset 0 -20px 44px rgba(0, 0, 0, .24), 0 14px 34px rgba(0, 0, 0, .28);
  backdrop-filter: blur(30px) saturate(1.18);
  -webkit-backdrop-filter: blur(30px) saturate(1.18);
}

.bottom-nav {
  isolation: isolate;
  overflow: hidden;
}

.bottom-nav-lens {
  position: absolute;
  z-index: 0;
  top: 0;
  left: 0;
  opacity: 0;
  pointer-events: none;
  border: 1px solid rgba(151, 46, 63, .22);
  border-radius: 16px;
  background:
    radial-gradient(circle at 26% 10%, rgba(174, 61, 78, .15), transparent 38%),
    linear-gradient(145deg, rgba(88, 13, 27, .72), rgba(22, 2, 7, .78));
  box-shadow: inset 0 1px 0 rgba(187, 74, 90, .09);
  will-change: transform;
}

.bottom-nav button {
  position: relative;
  z-index: 1;
  transition: color 190ms ease, transform 110ms var(--ease-out-premium);
}

.bottom-nav button.active {
  background: transparent;
}

.workspace-header {
  padding: 0 5px;
}

.calendar-modes {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  border: 1px solid rgba(126, 26, 41, .18);
  background: rgba(4, 0, 2, .4);
  box-shadow: inset 0 1px 0 rgba(116, 26, 41, .06);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
}

.calendar-mode-lens {
  position: absolute;
  z-index: 0;
  top: 0;
  left: 0;
  opacity: 0;
  pointer-events: none;
  border: 1px solid rgba(165, 57, 74, .23);
  border-radius: 10px;
  background:
    radial-gradient(circle at 28% 12%, rgba(173, 70, 85, .19), transparent 36%),
    linear-gradient(145deg, rgba(101, 17, 31, .68), rgba(24, 2, 7, .78));
  box-shadow: inset 0 1px 0 rgba(197, 82, 98, .1), 0 7px 16px rgba(0, 0, 0, .18);
  will-change: transform;
}

.calendar-modes button {
  position: relative;
  z-index: 1;
  min-height: 38px;
  transition: color 190ms ease, transform 110ms var(--ease-out-premium);
}

.calendar-modes button.active {
  background: transparent;
  box-shadow: none;
}

.calendar-filters {
  margin-right: -3px;
  margin-left: -3px;
  padding-right: 3px;
  padding-left: 3px;
}

.calendar-filters button[data-category-filter]:not([data-category-filter="all"])::before {
  width: 6px;
  height: 6px;
  flex: 0 0 auto;
  border-radius: 50%;
  background: var(--filter-color);
  box-shadow: 0 0 10px color-mix(in srgb, var(--filter-color) 30%, transparent);
  content: "";
}

.calendar-filters [data-category-filter="personal"] { --filter-color: #9f3044; }
.calendar-filters [data-category-filter="work"] { --filter-color: #6d394f; }
.calendar-filters [data-category-filter="health"] { --filter-color: #7f2437; }
.calendar-filters [data-category-filter="payments"] { --filter-color: #8b5361; }
.calendar-filters [data-category-filter="family"] { --filter-color: #a04b58; }

.calendar-canvas {
  min-height: 286px;
  padding: 0;
}

.month-grid {
  position: relative;
  isolation: isolate;
  gap: 3px;
}

.month-selection-lens {
  position: absolute;
  z-index: 0;
  top: 0;
  left: 0;
  opacity: 0;
  pointer-events: none;
  border: 1px solid rgba(180, 66, 84, .33);
  border-radius: 12px;
  background:
    radial-gradient(circle at 28% 15%, rgba(192, 81, 97, .2), transparent 34%),
    linear-gradient(145deg, rgba(113, 18, 34, .7), rgba(33, 3, 9, .82));
  box-shadow: inset 0 1px 0 rgba(220, 121, 134, .12), 0 8px 18px rgba(33, 0, 7, .27);
  backdrop-filter: blur(15px) saturate(1.25);
  -webkit-backdrop-filter: blur(15px) saturate(1.25);
  will-change: transform;
}

.month-day {
  z-index: 1;
  height: 64px;
  border-radius: 12px;
  background: rgba(5, 0, 2, .22);
  transition: color 180ms ease, border-color 180ms ease, transform 110ms var(--ease-out-premium), background 180ms ease;
}

.month-day:active {
  transform: scale(.96);
}

.month-day.selected {
  border-color: transparent;
  background: transparent;
  box-shadow: none;
  color: #f0d8dc;
}

.month-day.selected .month-event.single,
.month-day.selected .month-events,
.month-day.selected .event-stack {
  filter: saturate(1.12) brightness(1.12);
}

.month-day strong,
.month-event,
.month-events,
.event-stack {
  position: relative;
  z-index: 2;
}

.event-editor-panel {
  --editor-accent: #9f3044;
  background:
    radial-gradient(circle at 88% -2%, color-mix(in srgb, var(--editor-accent) 23%, transparent), transparent 30%),
    linear-gradient(150deg, rgba(48, 6, 14, .48), rgba(6, 0, 2, .58));
  box-shadow: inset 0 1px 0 color-mix(in srgb, var(--editor-accent) 18%, transparent), 0 18px 40px rgba(0, 0, 0, .34);
  transition: border-color 240ms ease, box-shadow 260ms ease;
}

.event-editor-panel input,
.event-editor-panel select,
.event-editor-panel textarea,
.export-date-shell input {
  animation: none;
  background:
    radial-gradient(circle at 16% 0%, rgba(113, 24, 38, .09), transparent 40%),
    rgba(7, 0, 2, .54);
  backdrop-filter: blur(20px) saturate(1.1);
  -webkit-backdrop-filter: blur(20px) saturate(1.1);
}

.category-field {
  min-width: 0;
  margin: 0;
  padding: 0;
  border: 0;
}

.category-field legend {
  margin-bottom: 8px;
  color: var(--muted);
  font-size: 13px;
  font-weight: 500;
}

.category-picker {
  display: flex;
  gap: 6px;
  overflow-x: auto;
  padding: 6px;
  border: 1px solid var(--line);
  border-radius: 20px;
  background: rgba(6, 0, 2, .47);
  box-shadow: inset 0 1px 0 rgba(133, 34, 49, .07);
  scrollbar-width: none;
  scroll-snap-type: x proximity;
  backdrop-filter: blur(22px);
  -webkit-backdrop-filter: blur(22px);
}

.category-picker::-webkit-scrollbar { display: none; }

.category-picker button {
  position: relative;
  min-width: 106px;
  min-height: 48px;
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 8px;
  padding: 0 12px;
  border: 1px solid transparent;
  border-radius: 15px;
  background: transparent;
  color: #85545c;
  font-size: 10px;
  scroll-snap-align: start;
  transition: color 190ms ease, border-color 220ms ease, background 240ms ease, transform 110ms var(--ease-out-premium);
}

.category-picker button svg {
  width: 16px;
  height: 16px;
  flex: 0 0 auto;
  color: var(--category-color);
  opacity: .72;
  transition: opacity 190ms ease, transform 240ms var(--ease-out-premium);
}

.category-picker button.active {
  border-color: color-mix(in srgb, var(--category-color) 48%, transparent);
  background:
    radial-gradient(circle at 20% 0%, color-mix(in srgb, var(--category-color) 26%, transparent), transparent 42%),
    color-mix(in srgb, var(--category-color) 15%, rgba(9, 1, 3, .72));
  color: #d9b2b8;
  box-shadow: inset 0 1px 0 color-mix(in srgb, var(--category-color) 24%, transparent);
}

.category-picker button.active svg {
  opacity: 1;
  transform: scale(1.08);
}

.disclosure {
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 20px;
  background:
    radial-gradient(circle at 12% 0%, rgba(115, 25, 40, .1), transparent 32%),
    rgba(6, 0, 2, .42);
  transition: border-color 220ms ease, background 260ms ease, box-shadow 260ms ease;
  backdrop-filter: blur(22px);
  -webkit-backdrop-filter: blur(22px);
}

.disclosure.is-open {
  border-color: rgba(151, 43, 60, .34);
  background: rgba(11, 1, 4, .54);
  box-shadow: inset 0 1px 0 rgba(156, 54, 69, .08);
}

.disclosure-trigger {
  width: 100%;
  min-height: 54px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 15px;
  border: 0;
  background: transparent;
  color: #b57d85;
  font-size: 11px;
}

.disclosure-trigger > span {
  display: inline-flex;
  align-items: center;
  gap: 10px;
}

.disclosure-trigger svg {
  width: 17px;
  height: 17px;
  color: #a06770;
}

.disclosure-trigger > svg:last-child {
  transition: transform 260ms var(--ease-glass);
}

.disclosure.is-open .disclosure-trigger > svg:last-child {
  transform: rotate(180deg);
}

.disclosure-content {
  display: grid;
  grid-template-rows: 0fr;
  opacity: .35;
  transition: grid-template-rows 290ms var(--ease-glass), opacity 180ms ease;
}

.disclosure.is-open .disclosure-content {
  grid-template-rows: 1fr;
  opacity: 1;
}

.disclosure-inner {
  min-height: 0;
  overflow: hidden;
}

.disclosure-inner > p {
  margin: 0;
  padding: 0 15px;
  color: #805159;
  font-size: 9px;
  line-height: 1.5;
}

.disclosure .mini-offsets {
  padding: 12px 15px 15px;
}

.disclosure .mini-offsets button {
  transform: translateY(-3px);
  opacity: .62;
  transition: color 180ms ease, background 200ms ease, border-color 200ms ease, transform 240ms var(--ease-out-premium), opacity 200ms ease;
}

.disclosure.is-open .mini-offsets button {
  transform: translateY(0);
  opacity: 1;
}

.disclosure.is-open .mini-offsets button:nth-child(2) { transition-delay: 22ms; }
.disclosure.is-open .mini-offsets button:nth-child(3) { transition-delay: 44ms; }
.disclosure.is-open .mini-offsets button:nth-child(4) { transition-delay: 66ms; }
.disclosure.is-open .mini-offsets button:nth-child(5) { transition-delay: 88ms; }
.disclosure.is-open .mini-offsets button:nth-child(6) { transition-delay: 110ms; }
.disclosure.is-open .mini-offsets button:nth-child(7) { transition-delay: 132ms; }

.form-options {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.option-toggle {
  position: relative;
  min-height: 54px;
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 0 11px;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: rgba(6, 0, 2, .4);
  color: #8d5a62;
  font-size: 10px;
  cursor: pointer;
  transition: color 190ms ease, border-color 220ms ease, background 240ms ease, transform 110ms var(--ease-out-premium);
}

.option-toggle:has(input:checked) {
  border-color: rgba(157, 47, 64, .38);
  background: linear-gradient(145deg, rgba(91, 14, 28, .58), rgba(15, 1, 5, .62));
  color: #d4aab1;
}

.option-toggle input {
  position: absolute;
  width: 1px;
  height: 1px;
  min-height: 0;
  opacity: 0;
  pointer-events: none;
}

.option-toggle-icon {
  width: 30px;
  height: 30px;
  flex: 0 0 auto;
  display: grid;
  place-items: center;
  border: 1px solid rgba(126, 26, 41, .22);
  border-radius: 11px;
  background: rgba(8, 1, 3, .52);
  transition: transform 240ms var(--ease-glass), background 220ms ease, border-color 220ms ease;
}

.option-toggle-icon svg {
  width: 15px;
  height: 15px;
}

.option-toggle input:checked + .option-toggle-icon {
  border-color: rgba(179, 69, 85, .4);
  background: rgba(111, 18, 33, .72);
  transform: rotate(-4deg) scale(1.05);
}

.option-toggle input:focus-visible + .option-toggle-icon {
  box-shadow: 0 0 0 3px var(--focus);
}

.template-strip {
  margin-top: 12px;
  padding: 16px;
  border-radius: 24px;
  background:
    radial-gradient(circle at 84% 0%, rgba(115, 25, 40, .11), transparent 31%),
    rgba(10, 1, 4, .56);
  backdrop-filter: blur(24px) saturate(1.12);
  -webkit-backdrop-filter: blur(24px) saturate(1.12);
}

.template-chip,
.template-empty {
  min-height: 62px;
  border-radius: 17px;
}

.template-chip {
  transition: transform 120ms var(--ease-out-premium), border-color 190ms ease, filter 190ms ease;
}

.template-chip:active { transform: scale(.97); }

.default-view {
  margin-top: 17px;
}

.default-view select {
  padding-right: 10px;
  padding-left: 10px;
}

.range-presets {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 4px;
  margin-bottom: 12px;
  padding: 4px;
  border: 1px solid rgba(126, 26, 41, .19);
  border-radius: 15px;
  background: rgba(5, 0, 2, .42);
}

.range-presets button {
  min-height: 38px;
  padding: 0 5px;
  border: 0;
  border-radius: 11px;
  background: transparent;
  color: #805159;
  font-size: 9px;
  transition: color 180ms ease, background 220ms ease, transform 110ms var(--ease-out-premium);
}

.range-presets button.active {
  background: linear-gradient(145deg, rgba(97, 15, 29, .66), rgba(22, 2, 7, .74));
  color: #d3aab0;
  box-shadow: inset 0 1px 0 rgba(179, 67, 83, .1);
}

.export-range {
  gap: 9px;
  margin-bottom: 10px;
}

.export-range label {
  gap: 6px;
  color: #8d5961;
  font-size: 9px;
}

.export-date-shell input {
  min-height: 50px;
  padding: 0;
}

.export-date-shell .date-placeholder {
  left: 13px;
  right: 38px;
  font-size: 11px;
}

.export-date-shell svg {
  right: 12px;
  width: 16px;
  height: 16px;
}

.data-actions button,
.feed-result,
.spaces-list article {
  transition: transform 120ms var(--ease-out-premium), border-color 210ms ease, background 240ms ease, opacity 180ms ease;
}

.feed-result:not([hidden]) {
  animation: glass-reveal 260ms var(--ease-out-premium) both;
}

.event-dialog-card {
  animation: event-dialog-in-refined 290ms var(--ease-glass) both;
}

.event-dialog.is-closing .event-dialog-card {
  animation: event-dialog-out-refined 170ms cubic-bezier(.4, 0, 1, 1) both;
}

.event-dialog.is-closing::backdrop,
.success-dialog.is-closing::backdrop {
  animation: backdrop-out-refined 170ms ease-in both;
}

.success-dialog.is-closing > div {
  animation: event-dialog-out-refined 170ms cubic-bezier(.4, 0, 1, 1) both;
}

@keyframes event-dialog-in-refined {
  from { opacity: 0; transform: translateY(18px) scale(.965); filter: blur(8px); }
  to { opacity: 1; transform: translateY(0) scale(1); filter: blur(0); }
}

@keyframes event-dialog-out-refined {
  to { opacity: 0; transform: translateY(9px) scale(.982); filter: blur(4px); }
}

@keyframes backdrop-out-refined { to { opacity: 0; } }

@keyframes glass-reveal {
  from { opacity: 0; transform: translateY(-5px) scale(.99); filter: blur(4px); }
}

@media (max-width: 420px) {
  .calendar-workspace {
    padding: 16px 9px;
  }

  .month-day {
    height: 61px;
    padding: 6px 4px;
  }

  .category-picker button {
    min-width: 102px;
  }
}

@media (max-width: 350px) {
  .calendar-workspace {
    width: calc(100% + 28px);
    margin-right: -14px;
    margin-left: -14px;
    padding-right: 7px;
    padding-left: 7px;
  }

  .month-grid { gap: 2px; }
  .month-day { height: 56px; }
  .form-options { grid-template-columns: 1fr; }
  .range-presets { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* Schedule, navigation and motion suite */
html,
body {
  overscroll-behavior-y: none;
}

html.telegram-mini-app .app-shell {
  padding-top: calc(max(16px, env(safe-area-inset-top), var(--tg-content-safe-area-inset-top, 0px)) + 8px);
}

.app-header {
  padding-top: 12px;
}

.calendar-workspace + .pulse-strip {
  margin-top: 12px;
}

.timeline-scroll {
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
  touch-action: pan-x pan-y;
}

.app-view.view-enter {
  opacity: 0;
  transform: translateY(12px);
  filter: blur(6px);
}

.app-view.view-enter.view-enter-active {
  opacity: 1;
  transform: translateY(0);
  filter: blur(0);
  transition: opacity 250ms var(--ease-out-premium), transform 320ms var(--ease-glass), filter 220ms ease-out;
}

@keyframes premium-view-out {
  to { opacity: 0; transform: translateY(-7px); filter: blur(3px); }
}

@keyframes card-materialize {
  from { opacity: 0; transform: translateY(9px); filter: blur(4px); }
  to { opacity: 1; transform: translateY(0); filter: blur(0); }
}

.reveal-observed {
  opacity: 0;
  transform: translateY(18px);
  filter: blur(7px);
  clip-path: inset(0 0 9% 0 round 18px);
  transition:
    opacity 420ms var(--ease-out-premium),
    transform 520ms var(--ease-glass),
    filter 360ms ease-out,
    clip-path 500ms var(--ease-glass);
  transition-delay: calc(var(--reveal-index, 0) * 22ms);
}

.reveal-observed.is-revealed {
  opacity: 1;
  transform: translateY(0);
  filter: blur(0);
  clip-path: inset(0 0 0 0 round 0);
}

.bottom-nav {
  grid-template-columns: repeat(var(--nav-count, 4), minmax(0, 1fr));
}

.bottom-nav[data-count="4"] button {
  min-height: 56px;
  flex-direction: column;
  gap: 3px;
  font-size: 8px;
}

.bottom-nav[data-count="4"] button svg {
  width: 17px;
  height: 17px;
}

.simple-mode-action,
.schedule-add-action {
  min-height: 42px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  padding: 0 13px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: rgba(9, 1, 3, .48);
  color: #9b656d;
  font-size: 9px;
  transition: color 180ms ease, background 220ms ease, border-color 220ms ease, transform 110ms var(--ease-out-premium);
}

.simple-mode-action svg,
.schedule-add-action svg {
  width: 16px;
  height: 16px;
}

.simple-mode-action.active {
  border-color: rgba(165, 55, 72, .37);
  background: linear-gradient(145deg, rgba(93, 14, 28, .66), rgba(22, 2, 7, .72));
  color: #d5aeb4;
}

.editor-view-title {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
}

.simple-editor .advanced-only[hidden] { display: none !important; }

.simple-editor .editor-repeat-grid {
  grid-template-columns: 1fr;
}

.simple-editor .event-editor-panel {
  min-height: 0;
}

.schedule-view-title {
  justify-content: space-between;
}

.schedule-now {
  --schedule-color: #9f3044;
  position: relative;
  min-height: 148px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: end;
  gap: 16px;
  overflow: hidden;
  margin-bottom: 12px;
  padding: 21px;
  border: 1px solid color-mix(in srgb, var(--schedule-color) 43%, transparent);
  border-radius: 26px;
  background:
    radial-gradient(circle at 84% 12%, color-mix(in srgb, var(--schedule-color) 27%, transparent), transparent 37%),
    linear-gradient(150deg, rgba(38, 4, 11, .8), rgba(6, 0, 2, .84));
  box-shadow: inset 0 1px 0 color-mix(in srgb, var(--schedule-color) 18%, transparent), 0 18px 40px rgba(0, 0, 0, .31);
  backdrop-filter: blur(28px) saturate(1.16);
  -webkit-backdrop-filter: blur(28px) saturate(1.16);
  cursor: pointer;
  transition: border-color 240ms ease, background 300ms ease, transform 110ms var(--ease-out-premium);
}

.schedule-now::after {
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(108deg, transparent 12%, color-mix(in srgb, var(--schedule-color) 9%, transparent) 48%, transparent 75%);
  transform: translateX(-110%);
  animation: spotlight-sheen 8s ease-in-out infinite;
  content: "";
}

.schedule-now-copy,
.schedule-now-time {
  position: relative;
  z-index: 1;
}

.schedule-now-copy > span {
  color: color-mix(in srgb, var(--schedule-color) 72%, #d7aeb4);
  font-size: 10px;
}

.schedule-now-copy h2 {
  margin: 7px 0 5px;
  overflow: hidden;
  color: #ecd2d6;
  font-size: 20px;
  line-height: 1.2;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.schedule-now-copy p {
  overflow: hidden;
  color: #a87078;
  font-size: 10px;
  line-height: 1.45;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.schedule-now-time {
  min-width: 72px;
  min-height: 76px;
  display: grid;
  place-items: center;
  align-content: center;
  border: 1px solid color-mix(in srgb, var(--schedule-color) 35%, transparent);
  border-radius: 20px;
  background: rgba(5, 0, 2, .46);
  backdrop-filter: blur(16px);
}

.schedule-now-time strong {
  color: #e6c2c7;
  font-size: 20px;
}

.schedule-now-time span {
  margin-top: 5px;
  color: #8d5961;
  font-size: 8px;
}

.schedule-board,
.schedule-tools,
.navigation-settings {
  margin-bottom: 12px;
  padding: 18px;
  border: 1px solid var(--line);
  border-radius: 26px;
  background:
    radial-gradient(circle at 83% 0%, rgba(111, 22, 37, .1), transparent 30%),
    linear-gradient(155deg, rgba(25, 3, 8, .7), rgba(6, 0, 2, .72));
  box-shadow: var(--inner-light), 0 15px 36px rgba(0, 0, 0, .3);
  backdrop-filter: blur(26px) saturate(1.13);
  -webkit-backdrop-filter: blur(26px) saturate(1.13);
}

.schedule-board-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.schedule-board-header span {
  color: #87555d;
  font-size: 9px;
}

.schedule-board-header h2 {
  margin: 5px 0 0;
  color: #dec0c5;
  font-size: 17px;
  text-transform: capitalize;
}

.schedule-week-actions {
  display: flex;
  gap: 5px;
}

.schedule-week-actions button {
  min-width: 38px;
  height: 38px;
  display: grid;
  place-items: center;
  padding: 0 9px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: rgba(7, 0, 2, .46);
  color: #a36b74;
  font-size: 9px;
}

.schedule-week-actions svg { width: 15px; }

.schedule-week-strip {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 4px;
  margin: 17px -2px 16px;
}

.schedule-week-strip button {
  position: relative;
  min-width: 0;
  min-height: 66px;
  display: grid;
  place-items: center;
  align-content: center;
  gap: 5px;
  padding: 5px 1px;
  border: 1px solid transparent;
  border-radius: 15px;
  background: rgba(5, 0, 2, .3);
  color: #84535b;
  transition: color 180ms ease, border-color 210ms ease, background 240ms ease, transform 110ms var(--ease-out-premium);
}

.schedule-week-strip button span { font-size: 8px; }
.schedule-week-strip button strong { font-size: 13px; }
.schedule-week-strip button i { min-height: 8px; color: #76444d; font-size: 7px; font-style: normal; }
.schedule-week-strip button.today { border-color: rgba(137, 38, 54, .25); }
.schedule-week-strip button.active {
  border-color: rgba(175, 62, 80, .39);
  background:
    radial-gradient(circle at 25% 0%, rgba(171, 58, 76, .2), transparent 40%),
    linear-gradient(145deg, rgba(100, 15, 30, .68), rgba(22, 2, 7, .78));
  color: #e4c3c8;
  box-shadow: inset 0 1px 0 rgba(196, 83, 99, .11);
}

.schedule-day-timeline {
  display: grid;
}

.schedule-entry-card {
  --schedule-color: #9f3044;
  width: 100%;
  min-height: 92px;
  display: grid;
  grid-template-columns: 50px minmax(0, 1fr) 16px;
  align-items: center;
  gap: 12px;
  padding: 13px;
  border: 1px solid color-mix(in srgb, var(--schedule-color) 28%, transparent);
  border-radius: 19px;
  background:
    radial-gradient(circle at 4% 0%, color-mix(in srgb, var(--schedule-color) 14%, transparent), transparent 35%),
    rgba(6, 0, 2, .47);
  color: #d9b5bb;
  text-align: left;
  opacity: 0;
  transform: translateY(9px);
  animation: schedule-entry-arrive 360ms var(--ease-out-premium) forwards;
  animation-delay: calc(var(--entry-index) * 42ms);
  transition: transform 110ms var(--ease-out-premium), border-color 200ms ease, background 240ms ease;
}

@keyframes schedule-entry-arrive {
  to { opacity: 1; transform: translateY(0); }
}

.schedule-entry-time {
  display: grid;
  justify-items: center;
  gap: 4px;
  color: color-mix(in srgb, var(--schedule-color) 72%, #dab3b9);
}

.schedule-entry-time b { font-size: 10px; font-weight: 600; }
.schedule-entry-time i { width: 1px; height: 13px; background: color-mix(in srgb, var(--schedule-color) 50%, transparent); }
.schedule-entry-copy { min-width: 0; }
.schedule-entry-copy small { display: block; color: color-mix(in srgb, var(--schedule-color) 68%, #8f5a63); font-size: 8px; }
.schedule-entry-copy strong { display: block; margin-top: 5px; overflow: hidden; color: #dfc1c6; font-size: 13px; text-overflow: ellipsis; white-space: nowrap; }
.schedule-entry-copy > span { display: block; margin-top: 5px; overflow: hidden; color: #9a656d; font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.schedule-entry-copy em { display: -webkit-box; margin-top: 6px; overflow: hidden; color: #754850; font-size: 8px; font-style: normal; line-height: 1.4; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.schedule-entry-card > svg { width: 14px; color: #71434b; }

.schedule-break {
  min-height: 38px;
  display: flex;
  align-items: center;
  gap: 9px;
  padding-left: 24px;
  color: #70434b;
  font-size: 8px;
}

.schedule-break i {
  width: 1px;
  height: 22px;
  background: linear-gradient(transparent, rgba(126, 26, 41, .42), transparent);
}

.schedule-empty {
  width: 100%;
  min-height: 150px;
  display: grid;
  place-items: center;
  align-content: center;
  gap: 8px;
  border: 1px dashed rgba(126, 26, 41, .29);
  border-radius: 20px;
  background: rgba(5, 0, 2, .28);
  color: #8f5b63;
}

.schedule-empty svg { width: 23px; }
.schedule-empty b { color: #bb858d; font-size: 11px; }
.schedule-empty span { font-size: 8px; }

.schedule-insights {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  margin-bottom: 12px;
}

.schedule-insights article {
  min-width: 0;
  min-height: 92px;
  display: grid;
  align-content: center;
  gap: 5px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 19px;
  background: rgba(9, 1, 3, .5);
  box-shadow: inset 0 1px 0 rgba(125, 31, 46, .06);
}

.schedule-insights svg { width: 15px; color: #965f68; }
.schedule-insights span { overflow: hidden; color: #75474f; font-size: 7px; text-overflow: ellipsis; white-space: nowrap; }
.schedule-insights strong { overflow: hidden; color: #d3aeb4; font-size: 15px; text-overflow: ellipsis; white-space: nowrap; }

.schedule-digest-toggle {
  min-height: 66px;
  display: grid;
  grid-template-columns: 1px 34px minmax(0, 1fr);
  align-items: center;
  gap: 10px;
  margin-top: 15px;
  padding: 0 13px;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: rgba(6, 0, 2, .4);
}

.schedule-digest-toggle input {
  width: 1px;
  height: 1px;
  min-height: 0;
  opacity: 0;
}

.schedule-digest-toggle b,
.schedule-digest-toggle small { display: block; }
.schedule-digest-toggle b { color: #bb838c; font-size: 10px; font-weight: 500; }
.schedule-digest-toggle small { margin-top: 4px; color: #71434b; font-size: 8px; line-height: 1.35; }
.schedule-digest-toggle input:checked + .option-toggle-icon { border-color: rgba(174, 60, 78, .4); background: rgba(103, 16, 30, .69); transform: scale(1.05); }

.schedule-digest-time {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 116px;
  align-items: center;
  gap: 12px;
  margin: 10px 0;
  color: #a46a73;
  font-size: 10px;
}

.schedule-digest-time .native-time-shell { min-height: 48px; border-radius: 15px; }

.schedule-copy-day {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: end;
  gap: 8px;
  padding-top: 11px;
  border-top: 1px solid rgba(126, 26, 41, .15);
}

.schedule-copy-day label { gap: 6px; font-size: 9px; }
.schedule-copy-day select { min-height: 46px; border-radius: 14px; font-size: 10px; }
.schedule-copy-day button {
  min-height: 46px;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 0 12px;
  border: 1px solid rgba(154, 44, 61, .32);
  border-radius: 14px;
  background: rgba(89, 13, 26, .52);
  color: #bd858e;
  font-size: 9px;
}
.schedule-copy-day svg { width: 15px; }

.schedule-dialog {
  width: min(calc(100% - 18px), 560px);
  max-height: calc(100dvh - 20px);
  overflow: auto;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--text);
  scrollbar-width: none;
}

.schedule-dialog::-webkit-scrollbar { display: none; }
.schedule-dialog::backdrop { background: rgba(2, 0, 1, .75); backdrop-filter: blur(14px); animation: backdrop-in 200ms ease-out both; }
.schedule-dialog-card {
  position: relative;
  display: grid;
  gap: 13px;
  padding: 24px;
  border: 1px solid rgba(143, 40, 57, .36);
  border-radius: 28px;
  background:
    radial-gradient(circle at 86% 0%, rgba(125, 27, 43, .2), transparent 30%),
    linear-gradient(155deg, rgba(32, 3, 9, .98), rgba(5, 0, 2, .98));
  box-shadow: 0 30px 80px rgba(0, 0, 0, .58);
  animation: event-dialog-in-refined 290ms var(--ease-glass) both;
}
.schedule-dialog.is-closing .schedule-dialog-card { animation: event-dialog-out-refined 170ms cubic-bezier(.4, 0, 1, 1) both; }
.schedule-dialog h2 { margin: 7px 42px 3px 0; color: #e7c9ce; font-size: 21px; }
.schedule-dialog label > span { font-size: 11px; }
.schedule-dialog input,
.schedule-dialog select { min-height: 52px; border-radius: 17px; }
.schedule-dialog textarea { min-height: 76px; }

.navigation-settings > p {
  margin: 9px 0 14px;
  color: #805058;
  font-size: 9px;
  line-height: 1.5;
}
.navigation-visibility { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.navigation-priority { margin-top: 12px; }
.navigation-priority select { min-height: 50px; border-radius: 17px; }
.navigation-status:empty { display: none; }
.navigation-settings:has(.navigation-status:empty) { padding-bottom: 18px; }

.export-result {
  grid-template-columns: 32px minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  margin-top: 9px;
  padding: 10px;
  border: 1px solid rgba(149, 43, 60, .28);
  border-radius: 15px;
  background: rgba(7, 0, 2, .45);
  animation: glass-reveal 260ms var(--ease-out-premium) both;
}
.export-result:not([hidden]) { display: grid; }
.export-result > svg { width: 18px; color: #a86c75; justify-self: center; }
.export-result b,
.export-result span { display: block; }
.export-result b { color: #c9949c; font-size: 9px; }
.export-result span { margin-top: 3px; color: #74464e; font-size: 7px; }
.export-result a { padding: 9px 11px; border-radius: 11px; background: rgba(101, 16, 30, .64); color: #d2a5ad; font-size: 8px; text-decoration: none; }

@media (max-width: 420px) {
  html.telegram-mini-app .app-shell { padding-top: calc(max(16px, env(safe-area-inset-top), var(--tg-content-safe-area-inset-top, 0px)) + 8px); }
  .editor-view-title { grid-template-columns: auto minmax(0, 1fr); }
  .editor-view-title .simple-mode-action { grid-column: 2; justify-self: start; margin-top: -2px; }
  .schedule-board,
  .schedule-tools { padding: 15px; }
  .schedule-week-strip { gap: 2px; }
  .schedule-week-strip button { min-height: 62px; border-radius: 13px; }
  .schedule-copy-day { grid-template-columns: 1fr; }
  .schedule-copy-day button { justify-content: center; }
  .schedule-dialog-card { padding: 21px; }
}

@media (max-width: 350px) {
  .schedule-now { padding: 17px; }
  .schedule-now-time { min-width: 62px; }
  .schedule-week-actions button { min-width: 34px; padding: 0 7px; }
  .schedule-week-actions button:nth-child(2) { display: none; }
  .schedule-entry-card { grid-template-columns: 43px minmax(0, 1fr) 14px; gap: 9px; padding: 11px; }
  .schedule-insights article { padding: 9px; }
  .schedule-insights strong { font-size: 13px; }
  .navigation-visibility { grid-template-columns: 1fr; }
}

/* 2026-08 theme, editor and viewport refinement */
:root[data-theme="blxxdy"] {
  color-scheme: dark;
  --theme-page: #080103;
  --theme-panel: linear-gradient(155deg, rgba(31, 4, 10, .78), rgba(7, 0, 2, .76));
  --theme-panel-soft: rgba(10, 1, 4, .58);
  --theme-field-bg: rgba(8, 0, 3, .66);
  --theme-nav-bg: rgba(9, 1, 3, .86);
  --theme-active-bg: linear-gradient(145deg, rgba(99, 16, 31, .72), rgba(24, 2, 7, .84));
  --theme-strong: #ead0d4;
  --theme-soft: #a96f78;
  --theme-faint: #754850;
  --theme-border: rgba(126, 26, 41, .28);
  --theme-shadow: 0 12px 32px rgba(0, 0, 0, .3);
}

:root[data-theme="wine"] {
  color-scheme: dark;
  --bg: #070407;
  --text: #eee5ea;
  --muted: #a999a2;
  --control-text: #ddd1d7;
  --button-text: #eee2e8;
  --placeholder: rgba(181, 164, 173, .7);
  --line: rgba(151, 107, 128, .25);
  --line-strong: rgba(238, 209, 222, .055);
  --surface: rgba(15, 8, 14, .94);
  --field: rgba(29, 17, 27, .94);
  --field-strong: rgba(35, 20, 32, .97);
  --accent: #85465e;
  --accent-soft: #bd7890;
  --accent-dark: #351621;
  --shadow: 0 8px 18px rgba(0, 0, 0, .34);
  --inner-light: inset 0 1px 0 rgba(220, 174, 194, .045), inset 0 -12px 24px rgba(0, 0, 0, .18);
  --focus: rgba(189, 120, 144, .22);
  --title-gradient: linear-gradient(110deg, #efd9e3 0%, #b66d86 34%, #e8cbd8 58%, #7f4962 79%, #c78aa0 100%);
  --button-gradient: linear-gradient(145deg, rgba(52, 22, 36, .94), rgba(22, 10, 18, .97) 58%, rgba(8, 4, 7, .99));
  --toggle-gradient: linear-gradient(145deg, rgba(44, 20, 32, .9), rgba(19, 10, 17, .96) 60%, rgba(7, 4, 7, .99));
  --theme-page: #070407;
  --theme-panel: linear-gradient(150deg, rgba(22, 11, 20, .96), rgba(11, 6, 10, .97) 48%, rgba(7, 4, 7, .98));
  --theme-panel-soft: rgba(18, 10, 17, .92);
  --theme-field-bg: linear-gradient(150deg, rgba(34, 20, 31, .96), rgba(24, 13, 22, .98));
  --theme-nav-bg: rgba(10, 6, 9, .96);
  --theme-active-bg: linear-gradient(145deg, rgba(72, 35, 50, .92), rgba(31, 15, 25, .97));
  --theme-strong: #eee5ea;
  --theme-soft: #ae9ea7;
  --theme-faint: #806f78;
  --theme-border: rgba(137, 95, 115, .25);
  --theme-shadow: 0 8px 18px rgba(0, 0, 0, .32);
  --glass-edge: linear-gradient(145deg, rgba(211, 156, 181, .035), rgba(73, 35, 52, .025));
}

:root[data-theme="porcelain"] {
  color-scheme: light;
  --bg: #f8f6f7;
  --text: #35151c;
  --muted: #764b54;
  --control-text: #5d333c;
  --button-text: #fff8fa;
  --placeholder: rgba(92, 52, 62, .64);
  --line: rgba(93, 18, 36, .17);
  --line-strong: rgba(255, 255, 255, .78);
  --surface: rgba(255, 255, 255, .72);
  --field: rgba(255, 255, 255, .78);
  --field-strong: rgba(255, 255, 255, .92);
  --accent: #7d1428;
  --accent-soft: #a93850;
  --accent-dark: #4d0917;
  --shadow: 0 10px 28px rgba(72, 13, 28, .08);
  --inner-light: inset 0 1px 0 rgba(255, 255, 255, .9);
  --focus: rgba(126, 20, 43, .19);
  --title-gradient: linear-gradient(110deg, #46101d 0%, #a62c47 37%, #5e0c20 69%, #c05268 100%);
  --theme-page: #f8f6f7;
  --theme-panel: linear-gradient(155deg, rgba(255, 255, 255, .9), rgba(249, 244, 246, .76));
  --theme-panel-soft: rgba(255, 255, 255, .68);
  --theme-field-bg: rgba(255, 255, 255, .8);
  --theme-nav-bg: rgba(252, 249, 250, .9);
  --theme-active-bg: linear-gradient(145deg, rgba(126, 20, 43, .94), rgba(79, 8, 23, .96));
  --theme-strong: #35151c;
  --theme-soft: #764b54;
  --theme-faint: #986f77;
  --theme-border: rgba(93, 18, 36, .17);
  --theme-shadow: 0 10px 28px rgba(72, 13, 28, .08);
  --glass-edge: linear-gradient(145deg, rgba(255, 255, 255, .78), rgba(124, 17, 39, .045));
}

:root[data-theme="graphite"] {
  color-scheme: dark;
  --bg: #050607;
  --text: #e3dfe1;
  --muted: #948b8f;
  --control-text: #c4bdc0;
  --button-text: #d8d1d4;
  --placeholder: rgba(171, 162, 166, .66);
  --line: rgba(185, 171, 177, .13);
  --line-strong: rgba(255, 255, 255, .025);
  --surface: rgba(12, 13, 15, .96);
  --field: rgba(18, 19, 22, .97);
  --field-strong: rgba(23, 24, 28, .98);
  --accent: #65202d;
  --accent-soft: #9d5361;
  --accent-dark: #241016;
  --shadow: 0 8px 18px rgba(0, 0, 0, .34);
  --inner-light: inset 0 1px 0 rgba(255, 255, 255, .025), inset 0 -12px 24px rgba(0, 0, 0, .18);
  --focus: rgba(157, 83, 97, .2);
  --title-gradient: linear-gradient(110deg, #d4c5ca 0%, #8f4a58 38%, #eee7e9 64%, #78404b 100%);
  --theme-page: #050607;
  --theme-panel: linear-gradient(155deg, rgba(20, 21, 24, .97), rgba(8, 9, 11, .98));
  --theme-panel-soft: rgba(14, 15, 18, .95);
  --theme-field-bg: linear-gradient(150deg, rgba(23, 24, 28, .98), rgba(15, 16, 19, .99));
  --theme-nav-bg: rgba(8, 9, 11, .97);
  --theme-active-bg: linear-gradient(145deg, rgba(50, 39, 43, .94), rgba(18, 19, 22, .99));
  --theme-strong: #e4dde0;
  --theme-soft: #a9999e;
  --theme-faint: #756a6e;
  --theme-border: rgba(222, 209, 214, .1);
  --theme-shadow: 0 8px 18px rgba(0, 0, 0, .34);
  --glass-edge: linear-gradient(145deg, rgba(255, 255, 255, .018), rgba(101, 39, 52, .018));
}

html,
body {
  overscroll-behavior-y: auto;
}

body {
  -webkit-overflow-scrolling: touch;
  background: var(--hero-overlay, var(--theme-page));
}

:root[data-theme="porcelain"] body {
  background:
    radial-gradient(circle at 14% 17%, rgba(137, 18, 44, .13), transparent 23%),
    radial-gradient(circle at 88% 64%, rgba(86, 8, 28, .08), transparent 27%),
    linear-gradient(180deg, #fcfbfc, #f7f3f5 52%, #fbfafb);
}

:root[data-theme="porcelain"] body::before {
  background:
    radial-gradient(ellipse at 11% 28%, rgba(117, 8, 34, .18), transparent 25%),
    radial-gradient(ellipse at 83% 12%, rgba(166, 44, 69, .12), transparent 21%),
    radial-gradient(ellipse at 68% 78%, rgba(102, 8, 31, .09), transparent 29%);
  filter: blur(34px);
  opacity: .72;
}

:root[data-theme="porcelain"] body::after {
  display: block;
  background:
    radial-gradient(ellipse at 20% 40%, rgba(105, 7, 29, .11), transparent 34%),
    radial-gradient(ellipse at 76% 65%, rgba(151, 31, 57, .1), transparent 31%);
  opacity: .68;
}

:root[data-theme="wine"] body {
  background:
    radial-gradient(circle at 50% -12%, rgba(73, 29, 49, .14), transparent 42%),
    linear-gradient(180deg, #070407, #0b060a 52%, #060306);
}

:root[data-theme="wine"] body::before {
  background: linear-gradient(116deg, transparent 18%, rgba(142, 69, 95, .025) 50%, transparent 78%);
  filter: none;
  opacity: .7;
}

:root[data-theme="wine"] body::after {
  display: none;
}

:root[data-theme="graphite"] body {
  background: linear-gradient(180deg, #07080a, #040506 58%, #08090b);
}

:root[data-theme="graphite"] body::before {
  display: none;
}

:root[data-theme="graphite"] body::after { display: none; }

.app-header {
  padding-top: 13px;
  padding-bottom: 17px;
}

html.telegram-mini-app .app-header {
  padding-top: 32px;
}

.app-header h1 {
  text-wrap: nowrap;
}

.calendar-hint {
  min-height: 22px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  margin-top: 5px;
  padding: 0 5px;
}

.calendar-hint svg {
  width: 13px;
  height: 13px;
  flex: 0 0 auto;
}

.editor-view-title {
  grid-template-columns: 46px minmax(0, 1fr) auto;
  grid-template-rows: auto auto;
  align-items: start;
}

.editor-view-title > .back-action { grid-column: 1; grid-row: 1 / 3; }
.editor-view-title > div { display: contents; }
.editor-view-title > div > span { grid-column: 2; grid-row: 1; align-self: center; }
.editor-view-title > div > h2 { grid-column: 2 / 4; grid-row: 2; margin-top: 7px; padding-right: 4px; }
.editor-view-title .simple-mode-action { grid-column: 3; grid-row: 1; margin-top: -7px; }

.category-picker {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 6px;
  overflow: hidden;
  padding: 6px;
  scroll-snap-type: none;
}

.category-picker button {
  width: 100%;
  min-width: 0;
  min-height: 50px;
  padding: 0 8px;
  justify-content: center;
  gap: 6px;
  overflow: hidden;
  white-space: nowrap;
}

.category-picker button:nth-child(7) { grid-column: 2; }
.category-picker button span { overflow: hidden; text-overflow: ellipsis; }
.category-picker button::after {
  position: absolute;
  inset: 6px;
  border-radius: 11px;
  background: radial-gradient(circle at 30% 0%, color-mix(in srgb, var(--category-color) 18%, transparent), transparent 66%);
  opacity: 0;
  transform: scale(.94);
  transition: opacity 200ms ease, transform 240ms var(--ease-out-premium);
  content: "";
  pointer-events: none;
}

.category-picker button > * { position: relative; z-index: 1; }
.category-picker button.active::after { opacity: 1; transform: scale(1); }
.category-picker.selection-moving button.active svg { animation: category-settle 260ms var(--ease-out-premium); }

@keyframes category-settle {
  0% { transform: translateY(2px) scale(.88); opacity: .45; }
  58% { transform: translateY(-1px) scale(1.1); opacity: 1; }
  100% { transform: translateY(0) scale(1.08); opacity: 1; }
}

.appearance-panel {
  margin-bottom: 12px;
  padding: 18px;
  border: 1px solid var(--theme-border);
  border-radius: 26px;
  background: var(--theme-panel);
  box-shadow: var(--inner-light);
}

.theme-picker {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 7px;
  margin-top: 15px;
}

.theme-picker button {
  position: relative;
  min-width: 0;
  min-height: 104px;
  display: grid;
  justify-items: center;
  align-content: center;
  gap: 8px;
  padding: 10px 5px;
  border: 1px solid var(--theme-border);
  border-radius: 18px;
  background: var(--theme-panel-soft);
  color: var(--theme-soft);
  transition: transform 120ms var(--ease-out-premium), border-color 200ms ease, background 240ms ease, color 200ms ease;
}

.theme-picker button > i {
  width: 42px;
  height: 30px;
  display: flex;
  overflow: hidden;
  border: 1px solid rgba(120, 40, 56, .18);
  border-radius: 11px;
  background: #160309;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08);
}

.theme-picker button > i b { flex: 1; }
.theme-picker [data-theme-choice="blxxdy"] > i b:nth-child(1) { background: #140208; }
.theme-picker [data-theme-choice="blxxdy"] > i b:nth-child(2) { background: #661426; }
.theme-picker [data-theme-choice="blxxdy"] > i b:nth-child(3) { background: #b04f65; }
.theme-picker [data-theme-choice="wine"] > i b:nth-child(1) { background: #070407; }
.theme-picker [data-theme-choice="wine"] > i b:nth-child(2) { background: #24121f; }
.theme-picker [data-theme-choice="wine"] > i b:nth-child(3) { background: #85465e; }
.theme-picker [data-theme-choice="porcelain"] > i { background: #fff; }
.theme-picker [data-theme-choice="porcelain"] > i b:nth-child(1) { background: #fff; }
.theme-picker [data-theme-choice="porcelain"] > i b:nth-child(2) { background: #e9cdd4; }
.theme-picker [data-theme-choice="porcelain"] > i b:nth-child(3) { background: #8e1832; }
.theme-picker [data-theme-choice="graphite"] > i b:nth-child(1) { background: #050607; }
.theme-picker [data-theme-choice="graphite"] > i b:nth-child(2) { background: #17181b; }
.theme-picker [data-theme-choice="graphite"] > i b:nth-child(3) { background: #65202d; }
.theme-picker button > span,
.theme-picker button strong,
.theme-picker button small { display: block; min-width: 0; }
.theme-picker button strong { color: var(--theme-strong); font-size: 10px; font-weight: 600; }
.theme-picker button small { margin-top: 3px; color: var(--theme-faint); font-size: 7px; line-height: 1.25; }
.theme-picker button > svg { position: absolute; top: 8px; right: 8px; width: 13px; height: 13px; opacity: 0; color: var(--accent-soft); transform: scale(.8); transition: opacity 180ms ease, transform 220ms var(--ease-out-premium); }
.theme-picker button.active { border-color: color-mix(in srgb, var(--accent-soft) 50%, transparent); background: color-mix(in srgb, var(--accent) 12%, var(--theme-panel-soft)); color: var(--theme-strong); }
.theme-picker button.active > svg { opacity: 1; transform: scale(1); }

:root.theme-changing .app-shell { animation:none; }
:root.theme-changing .app-header,
:root.theme-changing .app-view:not([hidden]) {
  animation:theme-materialize 400ms var(--ease-out-premium) both;
}
:root.theme-changing .bottom-nav,
:root.theme-changing .bottom-nav * {
  opacity:1;
  filter:none;
  animation:none!important;
}

@keyframes theme-materialize {
  from { opacity: .78; filter: blur(4px); }
  to { opacity: 1; filter: blur(0); }
}

:root[data-theme] .calendar-workspace,
:root[data-theme] .selected-events,
:root[data-theme] .settings-panel,
:root[data-theme] .settings-intro,
:root[data-theme] .account-panel,
:root[data-theme] .data-panel,
:root[data-theme] .spaces-panel,
:root[data-theme] .appearance-panel,
:root[data-theme] .navigation-settings,
:root[data-theme] .schedule-board,
:root[data-theme] .schedule-tools,
:root[data-theme] .panel {
  border-color: var(--theme-border);
  background: var(--theme-panel);
  box-shadow: var(--inner-light), var(--theme-shadow);
}

:root[data-theme] input,
:root[data-theme] select,
:root[data-theme] textarea,
:root[data-theme] .event-editor-panel input,
:root[data-theme] .event-editor-panel select,
:root[data-theme] .event-editor-panel textarea,
:root[data-theme] .export-date-shell input {
  border-color: var(--theme-border);
  background: var(--theme-field-bg);
  color: var(--control-text);
  box-shadow: inset 0 1px 0 var(--line-strong);
}

:root[data-theme] .bottom-nav {
  border-color: var(--theme-border);
  background: var(--theme-nav-bg);
  box-shadow: var(--inner-light);
}

:root[data-theme] .bottom-nav-lens,
:root[data-theme] .calendar-mode-lens {
  background: var(--theme-active-bg);
}

:root[data-theme] .pulse-strip,
:root[data-theme] .schedule-insights article,
:root[data-theme] .stats-grid article,
:root[data-theme] .option-toggle,
:root[data-theme] .disclosure,
:root[data-theme] .schedule-digest-toggle,
:root[data-theme] .category-picker {
  border-color: var(--theme-border);
  background: var(--theme-panel-soft);
  box-shadow: var(--inner-light);
}

:root[data-theme] .calendar-modes,
:root[data-theme] .calendar-filters button,
:root[data-theme] .period-actions button,
:root[data-theme] .schedule-week-actions button,
:root[data-theme] .schedule-week-strip button,
:root[data-theme] .data-actions button,
:root[data-theme] .offset-options button,
:root[data-theme] .range-presets,
:root[data-theme] .schedule-entry-card,
:root[data-theme] .schedule-empty {
  border-color: var(--theme-border);
  background-color: color-mix(in srgb, var(--theme-panel-soft) 88%, transparent);
}

:root[data-theme] .workspace-header h2,
:root[data-theme] .section-heading h2,
:root[data-theme] .view-title h2,
:root[data-theme] .schedule-board-header h2,
:root[data-theme] .schedule-now-copy h2,
:root[data-theme] .schedule-entry-copy strong,
:root[data-theme] .stats-grid strong,
:root[data-theme] .schedule-insights strong {
  color: var(--theme-strong);
}

:root[data-theme] .workspace-header span,
:root[data-theme] .section-heading span,
:root[data-theme] .view-title span,
:root[data-theme] .schedule-board-header span,
:root[data-theme] .schedule-now-copy p,
:root[data-theme] .schedule-entry-copy > span,
:root[data-theme] .schedule-insights span,
:root[data-theme] .stats-grid span,
:root[data-theme] .navigation-settings > p,
:root[data-theme] .data-panel > p {
  color: var(--theme-soft);
}

:root[data-theme="porcelain"] .month-day,
:root[data-theme="porcelain"] .calendar-modes,
:root[data-theme="porcelain"] .calendar-filters button,
:root[data-theme="porcelain"] .period-actions button,
:root[data-theme="porcelain"] .schedule-week-actions button,
:root[data-theme="porcelain"] .schedule-week-strip button,
:root[data-theme="porcelain"] .data-actions button,
:root[data-theme="porcelain"] .offset-options button,
:root[data-theme="porcelain"] .range-presets,
:root[data-theme="porcelain"] .schedule-entry-card,
:root[data-theme="porcelain"] .schedule-empty {
  color: #68414a;
}

:root[data-theme="porcelain"] .month-day {
  border-color: transparent;
  background: rgba(255, 255, 255, .34);
}

:root[data-theme="porcelain"] .month-day.today {
  border-color: rgba(126, 20, 43, .26);
}

:root[data-theme="porcelain"] .month-day.selected,
:root[data-theme="porcelain"] .schedule-week-strip button.active,
:root[data-theme="porcelain"] .calendar-filters button.active,
:root[data-theme="porcelain"] .offset-options button.active,
:root[data-theme="porcelain"] .range-presets button.active {
  color: #fff8fa;
  background: var(--theme-active-bg);
}

:root[data-theme="porcelain"] .month-day.selected {
  border-color: transparent;
  background: transparent;
}

:root[data-theme="porcelain"] .month-selection-lens {
  border-color: rgba(91, 11, 30, .24);
  background: var(--theme-active-bg);
  box-shadow: 0 7px 14px rgba(92, 13, 32, .13);
}

:root[data-theme="porcelain"] .calendar-filters button.active,
:root[data-theme="porcelain"] .schedule-week-strip button.active,
:root[data-theme="porcelain"] .offset-options button.active,
:root[data-theme="porcelain"] .range-presets button.active {
  border-color: rgba(91, 11, 30, .22);
  background: var(--theme-active-bg);
}

:root[data-theme="porcelain"] .pulse-strip strong {
  color: #441923;
}

:root[data-theme="porcelain"] .pulse-strip span,
:root[data-theme="porcelain"] .calendar-hint {
  color: #875e67;
}

:root[data-theme="porcelain"] .settings-intro h3,
:root[data-theme="porcelain"] .account-panel h3 {
  color: #35151c;
}

:root[data-theme="porcelain"] .settings-intro > svg {
  background: rgba(126, 20, 43, .12);
  color: #7d1428;
}

:root[data-theme="porcelain"] .option-toggle:has(input:checked) {
  border-color: rgba(91, 11, 30, .2);
  background: rgba(126, 20, 43, .1);
  color: #4f202b;
}

:root[data-theme="porcelain"] .option-toggle-icon {
  background: rgba(255, 255, 255, .72);
}

:root[data-theme="porcelain"] .option-toggle input:checked + .option-toggle-icon {
  background: #7d1428;
  color: #fff8fa;
}

:root[data-theme="porcelain"] .category-picker button.active {
  border-color: color-mix(in srgb, var(--category-color) 72%, transparent);
  background: linear-gradient(145deg, color-mix(in srgb, var(--category-color) 88%, #511020), color-mix(in srgb, var(--category-color) 58%, #2f0a14));
  color: #fff8fa;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .14);
}

:root[data-theme="porcelain"] .category-picker button.active svg {
  color: #fff8fa;
}

:root[data-theme="porcelain"] .next-event,
:root[data-theme="porcelain"] .schedule-now {
  background:
    radial-gradient(circle at 84% 12%, color-mix(in srgb, var(--event-accent, var(--schedule-color, #8d2639)) 17%, transparent), transparent 38%),
    linear-gradient(150deg, rgba(255, 255, 255, .9), rgba(246, 235, 239, .8));
  box-shadow: var(--theme-shadow);
}

:root[data-theme="porcelain"] .next-event-copy h2,
:root[data-theme="porcelain"] .next-event-date strong,
:root[data-theme="porcelain"] .schedule-now-copy h2,
:root[data-theme="porcelain"] .schedule-now-time strong,
:root[data-theme="porcelain"] .schedule-entry-copy strong {
  color: #35151c;
}

:root[data-theme="porcelain"] .next-event-copy p,
:root[data-theme="porcelain"] .next-event-copy span,
:root[data-theme="porcelain"] .schedule-now-copy p,
:root[data-theme="porcelain"] .schedule-now-time span,
:root[data-theme="porcelain"] .schedule-entry-copy > span,
:root[data-theme="porcelain"] .schedule-entry-copy em {
  color: #764b54;
}

:root[data-theme="porcelain"] .schedule-now-time {
  border-color: rgba(126, 20, 43, .2);
  background: rgba(126, 20, 43, .09);
}

:root[data-theme="porcelain"] .schedule-now-time strong {
  color: #6d1025;
}

:root[data-theme="porcelain"] .schedule-now-time span {
  color: #875e67;
}

:root[data-theme="porcelain"] .primary-action {
  border-color: rgba(91, 11, 30, .22);
  background: linear-gradient(145deg, #861a31, #510a1b);
  color: #fff8fa;
  box-shadow: 0 7px 14px rgba(92, 13, 32, .14);
}

:root[data-theme="porcelain"] .simple-mode-action,
:root[data-theme="porcelain"] .schedule-add-action,
:root[data-theme="porcelain"] .back-action {
  background: rgba(255, 255, 255, .72);
  color: #6f2838;
  box-shadow: var(--inner-light);
}

:root[data-theme="graphite"] .primary-action {
  border-color: rgba(157, 83, 97, .16);
  background: linear-gradient(145deg, rgba(28, 29, 33, .98), rgba(10, 11, 13, .99));
  color: #ded8db;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .025), 0 6px 12px rgba(0, 0, 0, .28);
}

:root[data-theme="blxxdy"] .primary-action {
  border-color: rgba(137, 33, 50, .3);
  background: linear-gradient(145deg, rgba(102, 15, 31, .92), rgba(29, 2, 8, .96));
  color: #d8aeb5;
  box-shadow: inset 0 1px 0 rgba(143, 37, 54, .1), 0 8px 14px rgba(0, 0, 0, .24);
}

:root[data-theme="blxxdy"] .primary-action::before,
:root[data-theme="graphite"] .primary-action::before {
  background: linear-gradient(128deg, rgba(129, 31, 48, .12), transparent 38%, rgba(45, 5, 13, .08) 72%, transparent);
  mix-blend-mode: normal;
  opacity: .5;
}

:root[data-theme="wine"] .primary-action {
  border-color: rgba(151, 107, 128, .3);
  background: linear-gradient(145deg, rgba(56, 24, 39, .98), rgba(19, 8, 15, .99));
  color: #eee2e8;
  box-shadow: inset 0 1px 0 rgba(232, 190, 209, .045), 0 6px 12px rgba(0, 0, 0, .28);
}

:root[data-theme="wine"] .primary-action::before {
  background: linear-gradient(128deg, rgba(211, 146, 174, .045), transparent 38%, rgba(74, 30, 49, .04) 72%, transparent);
  mix-blend-mode: normal;
  opacity: .45;
}

:root[data-theme="wine"] .month-selection-lens,
:root[data-theme="wine"] .calendar-filters button.active,
:root[data-theme="wine"] .schedule-week-strip button.active,
:root[data-theme="wine"] .offset-options button.active,
:root[data-theme="wine"] .range-presets button.active,
:root[data-theme="wine"] .mini-offsets button.active,
:root[data-theme="wine"] .simple-mode-action.active {
  border-color: rgba(151, 107, 128, .28);
  background: var(--theme-active-bg);
  color: #e6d8df;
  box-shadow: inset 0 1px 0 rgba(229, 181, 203, .035), 0 5px 10px rgba(0, 0, 0, .22);
}

:root[data-theme="wine"] .settings-intro > svg {
  border: 1px solid rgba(151, 107, 128, .22);
  background: rgba(45, 19, 33, .94);
  color: #c28299;
}

:root[data-theme="wine"] .option-toggle:has(input:checked),
:root[data-theme="wine"] .schedule-digest-toggle:has(input:checked) {
  border-color: rgba(151, 107, 128, .22);
  background: rgba(49, 23, 37, .38);
  color: #d7c7cf;
}

:root[data-theme="wine"] .option-toggle input:checked + .option-toggle-icon,
:root[data-theme="wine"] .schedule-digest-toggle input:checked + .option-toggle-icon {
  border-color: rgba(151, 107, 128, .28);
  background: linear-gradient(145deg, rgba(66, 31, 46, .96), rgba(24, 12, 20, .99));
  color: #eadce3;
}

:root[data-theme="wine"] .category-picker button.active {
  border-color: color-mix(in srgb, var(--category-color) 32%, rgba(151, 107, 128, .2));
  background: linear-gradient(145deg, rgba(52, 25, 39, .97), rgba(18, 9, 15, .99));
  color: #e4d5dc;
}

:root[data-theme="wine"] .next-event,
:root[data-theme="wine"] .schedule-now {
  background: linear-gradient(150deg, rgba(31, 15, 27, .98), rgba(8, 4, 7, .99));
  box-shadow: var(--theme-shadow);
}

:root[data-theme="graphite"] .primary-action::before {
  background: none;
  opacity: 0;
}

:root[data-theme="graphite"] .month-selection-lens,
:root[data-theme="graphite"] .calendar-filters button.active,
:root[data-theme="graphite"] .schedule-week-strip button.active,
:root[data-theme="graphite"] .offset-options button.active,
:root[data-theme="graphite"] .range-presets button.active,
:root[data-theme="graphite"] .mini-offsets button.active,
:root[data-theme="graphite"] .simple-mode-action.active {
  border-color: rgba(157, 83, 97, .18);
  background: var(--theme-active-bg);
  color: #ddd3d7;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .025), 0 6px 14px rgba(0, 0, 0, .2);
}

:root[data-theme="graphite"] .category-picker button.active {
  border-color: color-mix(in srgb, var(--category-color) 34%, rgba(220, 209, 214, .1));
  background: linear-gradient(145deg, rgba(31, 29, 32, .97), rgba(13, 14, 16, .99));
  color: #ddd3d7;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .03);
}

:root[data-theme="graphite"] .category-picker button.active svg {
  color: color-mix(in srgb, var(--category-color) 58%, #d5cdd0);
}

:root[data-theme="graphite"] .option-toggle:has(input:checked),
:root[data-theme="graphite"] .schedule-digest-toggle:has(input:checked) {
  border-color: rgba(157, 83, 97, .15);
  background: rgba(91, 56, 66, .1);
  color: #c9bec2;
}

:root[data-theme="graphite"] .settings-intro > svg {
  border: 1px solid rgba(157, 83, 97, .14);
  background: rgba(35, 26, 30, .82);
  color: #b9828c;
}

:root[data-theme="graphite"] .option-toggle input:checked + .option-toggle-icon,
:root[data-theme="graphite"] .schedule-digest-toggle input:checked + .option-toggle-icon {
  border-color: rgba(157, 83, 97, .2);
  background: linear-gradient(145deg, rgba(49, 35, 40, .96), rgba(18, 18, 21, .99));
  color: #e2d9dc;
}

:root[data-theme="graphite"] .next-event,
:root[data-theme="graphite"] .schedule-now {
  background: linear-gradient(150deg, rgba(23, 24, 27, .98), rgba(8, 9, 11, .99));
  box-shadow: var(--theme-shadow);
}

@media (max-width: 420px) {
  .calendar-workspace { padding: 13px 9px 11px; }
  .month-day { height: 53px; }
  .calendar-hint { margin-top: 2px; font-size: 8px; }
  .editor-view-title { grid-template-columns: 44px minmax(0, 1fr) auto; }
  .editor-view-title .simple-mode-action { grid-column: 3; grid-row: 1; justify-self: end; margin-top: -6px; }
  .editor-view-title > div > h2 { font-size: 17px; }
  .simple-mode-action { min-height: 38px; padding: 0 10px; }
}

@media (max-width: 350px) {
  .calendar-workspace { padding: 10px 7px 8px; }
  .calendar-modes { margin-top: 10px; margin-bottom: 8px; }
  .calendar-modes button { min-height: 34px; }
  .calendar-filters { margin-bottom: 7px; padding-bottom: 2px; }
  .calendar-filters button { min-height: 30px; }
  .month-day { height: 45px; }
  .calendar-hint { min-height: 18px; margin-top: 0; }
  .category-picker { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .category-picker button:nth-child(7) { grid-column: 1 / 3; width: calc(50% - 3px); justify-self: center; }
  .theme-picker button { min-height: 96px; padding-right: 3px; padding-left: 3px; }
  .theme-picker button > i { width: 36px; }
  .theme-picker button small { font-size: 6px; }
}

/* Recurring calendar and create editor polish */
[data-app-view="create"] {
  margin-top: -7px;
}

.editor-view-title {
  row-gap: 1px;
  margin-top: 0;
  margin-bottom: 8px;
}

.editor-view-title > div > span {
  padding-left: 1px;
  font-size: 9px;
}

.editor-view-title > div > h2 {
  margin-top: 3px;
  font-size: 19px;
  line-height: 1.18;
}

.editor-view-title .simple-mode-action {
  margin-top: -3px;
}

:root[data-theme] .event-editor-panel {
  overflow: hidden;
  padding: 17px;
  border-color: color-mix(in srgb, var(--editor-accent) 25%, var(--theme-border));
  border-radius: 26px;
  background:
    linear-gradient(132deg, color-mix(in srgb, var(--editor-accent) 9%, transparent), transparent 34%),
    var(--theme-panel);
  box-shadow:
    inset 0 1px 0 color-mix(in srgb, var(--editor-accent) 10%, transparent),
    0 16px 38px rgba(0, 0, 0, .3);
}

:root[data-theme] .event-editor-panel::before {
  background: linear-gradient(118deg, color-mix(in srgb, var(--editor-accent) 8%, transparent), transparent 33% 76%, color-mix(in srgb, var(--editor-accent) 4%, transparent));
  mix-blend-mode: normal;
  opacity: .5;
}

:root[data-theme] .event-editor-panel::after {
  background:
    radial-gradient(circle at 92% 2%, color-mix(in srgb, var(--editor-accent) 13%, transparent), transparent 28%),
    radial-gradient(circle at 5% 100%, color-mix(in srgb, var(--editor-accent) 6%, transparent), transparent 30%);
  mix-blend-mode: normal;
  opacity: .62;
}

.event-editor-panel .reminder-form {
  gap: 13px;
}

.event-editor-panel .reminder-form > label,
.event-editor-panel .category-field {
  gap: 7px;
}

.event-editor-panel .reminder-form > label > span,
.event-editor-panel .category-field legend {
  margin: 0 0 0 3px;
  color: var(--theme-soft);
  font-size: 11px;
  font-weight: 500;
}

:root[data-theme] .event-editor-panel input,
:root[data-theme] .event-editor-panel select,
:root[data-theme] .event-editor-panel textarea {
  min-height: 56px;
  border-color: color-mix(in srgb, var(--editor-accent) 11%, var(--theme-border));
  border-radius: 19px;
  background:
    linear-gradient(145deg, color-mix(in srgb, var(--editor-accent) 4%, transparent), transparent 38%),
    var(--theme-field-bg);
  box-shadow:
    inset 0 1px 0 color-mix(in srgb, var(--theme-strong) 3%, transparent),
    inset 0 -10px 24px rgba(0, 0, 0, .08);
}

:root[data-theme] .event-editor-panel input:focus,
:root[data-theme] .event-editor-panel select:focus,
:root[data-theme] .event-editor-panel textarea:focus {
  border-color: color-mix(in srgb, var(--editor-accent) 48%, var(--theme-border));
  box-shadow:
    inset 0 1px 0 color-mix(in srgb, var(--theme-strong) 4%, transparent),
    0 0 0 3px color-mix(in srgb, var(--editor-accent) 12%, transparent);
}

.event-editor-panel textarea {
  min-height: 78px;
  padding-top: 13px;
  padding-bottom: 13px;
}

:root[data-theme] .event-editor-panel .category-picker {
  gap: 5px;
  padding: 5px;
  border-color: color-mix(in srgb, var(--editor-accent) 10%, var(--theme-border));
  border-radius: 18px;
  background: color-mix(in srgb, var(--theme-panel-soft) 88%, transparent);
  box-shadow: inset 0 1px 0 color-mix(in srgb, var(--theme-strong) 3%, transparent);
}

.event-editor-panel .category-picker button {
  min-height: 47px;
  border-radius: 13px;
  color: var(--theme-faint);
  font-size: 9px;
}

:root[data-theme] .event-editor-panel .category-picker button.active {
  border-color: color-mix(in srgb, var(--category-color) 38%, var(--theme-border));
  background:
    linear-gradient(145deg, color-mix(in srgb, var(--category-color) 18%, var(--theme-panel-soft)), var(--theme-panel-soft));
  color: var(--theme-strong);
  box-shadow: inset 0 1px 0 color-mix(in srgb, var(--category-color) 15%, transparent);
}

.category-picker.selection-moving button.active svg {
  animation: category-focus 230ms var(--ease-out-premium);
}

@keyframes category-focus {
  from { transform: translateY(2px) scale(.96); opacity: .55; }
  to { transform: translateY(0) scale(1.08); opacity: 1; }
}

:root[data-theme] .event-editor-panel .disclosure,
:root[data-theme] .event-editor-panel .option-toggle {
  border-color: color-mix(in srgb, var(--editor-accent) 10%, var(--theme-border));
  border-radius: 18px;
  background: color-mix(in srgb, var(--theme-panel-soft) 86%, transparent);
  box-shadow: inset 0 1px 0 color-mix(in srgb, var(--theme-strong) 3%, transparent);
}

.event-editor-panel .disclosure-trigger {
  min-height: 52px;
}

.event-editor-panel .form-options {
  gap: 7px;
}

.event-editor-panel .option-toggle {
  min-height: 52px;
}

.event-editor-panel .option-toggle > span:last-child { min-width: 0; }
.event-editor-panel .option-toggle b,
.event-editor-panel .option-toggle small { display: block; }
.event-editor-panel .option-toggle b { color: currentColor; font-size: 9px; font-weight: 500; }
.event-editor-panel .option-toggle small { margin-top: 3px; color: var(--ui-faint); font-size: 7px; line-height: 1.25; }

.event-editor-panel .primary-action {
  margin-top: 1px;
}

@media (max-width: 420px) {
  [data-app-view="create"] { margin-top: -8px; }
  .editor-view-title { margin-bottom: 7px; }
  .editor-view-title .simple-mode-action { margin-top: -3px; }
  :root[data-theme] .event-editor-panel { padding: 15px; border-radius: 24px; }
}

/* LA Beauty surface system: one geometry, four adapted materials */
:root[data-theme="blxxdy"] {
  --plate-bg: radial-gradient(circle at 86% 4%, rgba(154, 37, 60, .13), transparent 38%), linear-gradient(145deg, rgba(43, 8, 16, .72), rgba(12, 1, 4, .62));
  --plate-soft-bg: linear-gradient(145deg, rgba(37, 7, 14, .62), rgba(12, 1, 4, .54));
  --plate-border: rgba(205, 104, 120, .17);
  --plate-highlight: rgba(255, 196, 205, .055);
  --plate-lowlight: rgba(3, 0, 1, .16);
  --plate-shadow: 0 24px 64px rgba(4, 0, 1, .22);
  --well-bg: linear-gradient(145deg, rgba(255, 240, 244, .028), rgba(155, 43, 62, .018) 46%, rgba(9, 0, 3, .1)), rgba(31, 5, 11, .58);
  --well-border: rgba(205, 104, 120, .16);
  --well-highlight: rgba(255, 214, 221, .05);
  --well-lowlight: rgba(0, 0, 0, .11);
  --tray-bg: rgba(17, 2, 7, .62);
  --active-bg: linear-gradient(145deg, rgba(105, 20, 35, .76), rgba(34, 3, 10, .82));
  --active-border: rgba(197, 81, 99, .3);
  --surface-sheen: rgba(183, 73, 91, .04);
}

:root[data-theme="wine"] {
  --plate-bg: radial-gradient(circle at 86% 4%, rgba(142, 66, 96, .11), transparent 38%), linear-gradient(145deg, rgba(35, 18, 29, .66), rgba(14, 9, 14, .54));
  --plate-soft-bg: linear-gradient(145deg, rgba(35, 18, 29, .58), rgba(14, 9, 14, .48));
  --plate-border: rgba(230, 199, 211, .11);
  --plate-highlight: rgba(255, 255, 255, .055);
  --plate-lowlight: rgba(4, 1, 3, .12);
  --plate-shadow: 0 24px 64px rgba(4, 1, 3, .18);
  --well-bg: linear-gradient(145deg, rgba(255, 246, 249, .034), rgba(223, 146, 173, .016) 46%, rgba(14, 10, 13, .1)), rgba(31, 22, 30, .54);
  --well-border: rgba(230, 199, 211, .11);
  --well-highlight: rgba(255, 246, 249, .055);
  --well-lowlight: rgba(8, 6, 8, .11);
  --tray-bg: rgba(21, 13, 20, .56);
  --active-bg: linear-gradient(145deg, rgba(82, 41, 60, .72), rgba(27, 14, 23, .78));
  --active-border: rgba(208, 150, 173, .22);
  --surface-sheen: rgba(223, 174, 194, .03);
}

:root[data-theme="porcelain"] {
  --plate-bg: radial-gradient(circle at 86% 4%, rgba(151, 51, 76, .08), transparent 38%), linear-gradient(145deg, rgba(255, 255, 255, .9), rgba(249, 240, 244, .72));
  --plate-soft-bg: linear-gradient(145deg, rgba(255, 255, 255, .88), rgba(248, 238, 242, .68));
  --plate-border: rgba(112, 22, 43, .16);
  --plate-highlight: rgba(255, 255, 255, .92);
  --plate-lowlight: rgba(105, 17, 38, .035);
  --plate-shadow: 0 24px 64px rgba(82, 14, 31, .08);
  --well-bg: linear-gradient(145deg, rgba(255, 255, 255, .72), rgba(157, 44, 70, .025)), rgba(255, 249, 251, .62);
  --well-border: rgba(112, 22, 43, .15);
  --well-highlight: rgba(255, 255, 255, .92);
  --well-lowlight: rgba(100, 15, 35, .035);
  --tray-bg: rgba(255, 250, 252, .66);
  --active-bg: linear-gradient(145deg, #861a33, #52091b);
  --active-border: rgba(82, 9, 27, .26);
  --surface-sheen: rgba(124, 25, 47, .035);
}

:root[data-theme="graphite"] {
  --plate-bg: radial-gradient(circle at 86% 4%, rgba(128, 59, 75, .07), transparent 38%), linear-gradient(145deg, rgba(31, 32, 36, .7), rgba(12, 13, 15, .58));
  --plate-soft-bg: linear-gradient(145deg, rgba(29, 30, 34, .62), rgba(12, 13, 15, .52));
  --plate-border: rgba(230, 220, 224, .1);
  --plate-highlight: rgba(255, 255, 255, .045);
  --plate-lowlight: rgba(0, 0, 0, .18);
  --plate-shadow: 0 24px 64px rgba(0, 0, 0, .3);
  --well-bg: linear-gradient(145deg, rgba(255, 255, 255, .025), rgba(135, 62, 78, .015)), rgba(25, 26, 30, .58);
  --well-border: rgba(230, 220, 224, .095);
  --well-highlight: rgba(255, 255, 255, .04);
  --well-lowlight: rgba(0, 0, 0, .16);
  --tray-bg: rgba(15, 16, 18, .62);
  --active-bg: linear-gradient(145deg, rgba(52, 37, 43, .76), rgba(20, 20, 23, .82));
  --active-border: rgba(157, 83, 97, .24);
  --surface-sheen: rgba(131, 69, 82, .025);
}

:root[data-theme] {
  --plate-radius: 22px;
  --well-radius: 17px;
  --nested-radius: 14px;
}

:root[data-theme] :is(
  .calendar-workspace,
  .selected-events,
  .schedule-board,
  .schedule-now,
  .schedule-tools,
  .appearance-panel,
  .settings-intro,
  .settings-panel,
  .navigation-settings,
  .data-panel,
  .spaces-panel,
  .account-panel,
  .template-strip,
  .event-editor-panel
) {
  overflow: hidden;
  border: 1px solid var(--plate-border);
  border-radius: var(--plate-radius);
  background: var(--plate-bg);
  background-size: 125% 125%;
  box-shadow:
    inset 0 1px 0 var(--plate-highlight),
    inset 0 -1px 0 var(--plate-lowlight),
    var(--plate-shadow);
  backdrop-filter: blur(24px) saturate(1.18);
  -webkit-backdrop-filter: blur(24px) saturate(1.18);
  animation: plate-breathe 16s ease-in-out infinite alternate;
}

:root[data-theme] .week-load {
  overflow: visible;
  margin-bottom: 12px;
  padding: 10px 3px 14px;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  animation: none;
}

:root[data-theme] .week-load::after {
  display: none;
}

.week-load .section-heading h2 {
  text-transform: none;
}

@keyframes plate-breathe {
  from { background-position: 0% 0%; }
  to { background-position: 100% 72%; }
}

:root[data-theme] :is(.premium-surface, .event-editor-panel)::after {
  inset: 1px;
  border-radius: inherit;
  background: linear-gradient(112deg, transparent 18%, var(--surface-sheen) 48%, transparent 76%);
  background-size: 220% 100%;
  opacity: .42;
  mix-blend-mode: normal;
  animation: matte-refraction 18s ease-in-out infinite;
}

@keyframes matte-refraction {
  0%, 42% { background-position: 180% 0; }
  72%, 100% { background-position: -80% 0; }
}

:root[data-theme] .event-editor-panel {
  padding: 19px;
}

:root[data-theme] .event-editor-panel::before {
  background: linear-gradient(125deg, var(--surface-sheen), transparent 34% 78%, var(--surface-sheen));
  opacity: .45;
  mix-blend-mode: normal;
}

.event-editor-panel .reminder-form {
  gap: 15px;
}

.event-editor-panel .reminder-form > label,
.event-editor-panel .category-field {
  gap: 8px;
}

.event-editor-panel .reminder-form > label > span,
.event-editor-panel .category-field legend {
  margin-left: 2px;
  color: var(--theme-soft);
  font-size: 12px;
  font-weight: 500;
}

:root[data-theme] :is(
  input,
  select,
  textarea,
  .event-editor-panel input,
  .event-editor-panel select,
  .event-editor-panel textarea,
  .export-date-shell input
) {
  border: 1px solid var(--well-border);
  border-radius: var(--well-radius);
  background: var(--well-bg);
  color: var(--control-text);
  box-shadow:
    inset 0 1px 0 var(--well-highlight),
    inset 0 0 0 1px color-mix(in srgb, var(--well-highlight) 32%, transparent),
    0 12px 24px var(--well-lowlight);
  animation: none;
}

:root[data-theme] :is(
  .event-editor-panel input,
  .event-editor-panel select,
  .event-editor-panel textarea
) {
  min-height: 59px;
  font-size: 15px;
}

:root[data-theme] :is(
  .event-editor-panel .option-toggle input,
  .schedule-digest-toggle input
) {
  width: 1px;
  height: 1px;
  min-height: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
}

.event-editor-panel textarea {
  min-height: 82px;
  padding-top: 14px;
  padding-bottom: 14px;
}

:root[data-theme] :is(input, select, textarea):focus {
  border-color: color-mix(in srgb, var(--accent-soft) 46%, var(--well-border));
  box-shadow:
    inset 0 1px 0 var(--well-highlight),
    0 0 0 3px color-mix(in srgb, var(--accent) 13%, transparent);
}

/* A composite field has one border owner. This prevents doubled iOS outlines. */
:root[data-theme] :is(.select-shell, .date-shell) {
  overflow: hidden;
  border: 1px solid var(--well-border);
  border-radius: var(--well-radius);
  background: var(--well-bg);
  box-shadow:
    inset 0 1px 0 var(--well-highlight),
    inset 0 0 0 1px color-mix(in srgb, var(--well-highlight) 32%, transparent),
    0 12px 24px var(--well-lowlight);
  transition: border-color 180ms ease, box-shadow 220ms ease, background 220ms ease;
}

:root[data-theme] .event-editor-panel :is(.select-shell, .date-shell) {
  min-height: 59px;
}

:root[data-theme] :is(
  .select-shell select,
  .date-shell input,
  .export-date-shell input
) {
  width: 100%;
  min-height: 100%;
  border: 0 !important;
  border-radius: inherit;
  background: transparent !important;
  box-shadow: none !important;
}

:root[data-theme] .event-editor-panel :is(.select-shell select, .date-shell input) {
  height: 57px;
  min-height: 57px;
}

:root[data-theme] :is(.select-shell, .date-shell):focus-within {
  border-color: color-mix(in srgb, var(--accent-soft) 48%, var(--well-border));
  box-shadow:
    inset 0 1px 0 var(--well-highlight),
    inset 0 0 0 1px color-mix(in srgb, var(--accent-soft) 18%, transparent),
    0 0 0 3px color-mix(in srgb, var(--accent) 11%, transparent);
}

:root[data-theme] :is(.select-shell, .date-shell) svg {
  color: var(--theme-soft);
  opacity: .82;
}

:root[data-theme] :is(
  .pulse-strip,
  .stats-grid article,
  .schedule-insights article,
  .option-toggle,
  .schedule-digest-toggle,
  .disclosure,
  .schedule-entry-card,
  .schedule-empty,
  .event-item,
  .template-chip,
  .template-empty,
  .spaces-list article,
  .export-result
) {
  overflow: hidden;
  border: 1px solid var(--well-border);
  background: var(--plate-soft-bg);
  box-shadow:
    inset 0 1px 0 var(--well-highlight),
    inset 0 -10px 22px var(--well-lowlight);
}

:root[data-theme] .pulse-strip {
  border-radius: 20px;
}

:root[data-theme] :is(.stats-grid article, .schedule-insights article) {
  border-radius: 18px;
}

:root[data-theme] :is(
  .next-event,
  .schedule-now,
  .event-dialog-card,
  .schedule-dialog-card,
  .success-dialog > div
) {
  overflow: hidden;
  border-color: color-mix(in srgb, var(--event-accent, var(--schedule-color, var(--accent))) 35%, var(--plate-border));
  background:
    linear-gradient(140deg, color-mix(in srgb, var(--event-accent, var(--schedule-color, var(--accent))) 9%, transparent), transparent 38%),
    var(--plate-bg);
  box-shadow:
    inset 0 1px 0 var(--plate-highlight),
    inset 0 -20px 36px var(--plate-lowlight),
    var(--plate-shadow);
}

/* Segmented controls are clipped trays; selection outlines stay inside. */
:root[data-theme] :is(
  .calendar-modes,
  .category-picker,
  .range-presets,
  .schedule-week-strip,
  .bottom-nav
) {
  isolation: isolate;
  overflow: hidden;
  padding: 5px;
  border: 1px solid var(--well-border);
  background: var(--tray-bg);
  box-shadow: inset 0 1px 0 var(--well-highlight);
}

:root[data-theme] .calendar-modes {
  border-radius: 18px;
}

:root[data-theme] .category-picker {
  gap: 6px;
  border-radius: 20px;
}

:root[data-theme] .range-presets {
  border-radius: 17px;
}

:root[data-theme] .schedule-week-strip {
  gap: 3px;
  margin-right: 0;
  margin-left: 0;
  border-radius: 19px;
}

:root[data-theme] .bottom-nav {
  border-radius: 22px;
  background: color-mix(in srgb, var(--tray-bg) 94%, transparent);
  box-shadow:
    inset 0 1px 0 var(--well-highlight),
    0 18px 44px rgba(0, 0, 0, .38);
}

:root[data-theme] :is(
  .calendar-modes button,
  .category-picker button,
  .range-presets button,
  .schedule-week-strip button,
  .bottom-nav button
) {
  min-width: 0;
  max-width: 100%;
  border: 0;
  border-radius: var(--nested-radius);
  background: transparent;
  box-shadow: none;
}

:root[data-theme] :is(
  .calendar-mode-lens,
  .bottom-nav-lens
) {
  border: 0;
  border-radius: var(--nested-radius);
  background: var(--active-bg);
  box-shadow:
    inset 0 0 0 1px var(--active-border),
    inset 0 1px 0 var(--plate-highlight);
}

:root[data-theme] :is(
  .category-picker button.active,
  .range-presets button.active,
  .schedule-week-strip button.active
) {
  border: 0;
  background: var(--active-bg);
  color: var(--theme-strong);
  box-shadow:
    inset 0 0 0 1px color-mix(in srgb, var(--category-color, var(--active-border)) 45%, var(--active-border)),
    inset 0 1px 0 var(--plate-highlight);
}

:root[data-theme] .event-editor-panel .category-picker button.active {
  border: 0;
  background: var(--active-bg);
  color: var(--theme-strong);
  box-shadow:
    inset 0 0 0 1px color-mix(in srgb, var(--category-color) 45%, var(--active-border)),
    inset 0 1px 0 var(--plate-highlight);
}

:root[data-theme] .category-picker button {
  min-height: 49px;
  padding: 0 8px;
  color: var(--theme-faint);
  font-size: 10px;
}

:root[data-theme] .category-picker button::after {
  inset: 5px;
  border-radius: 10px;
  opacity: 0;
}

:root[data-theme] :is(
  .period-actions button,
  .calendar-filters button,
  .schedule-week-actions button,
  .offset-options button,
  .mini-offsets button,
  .data-actions button,
  .secondary-action,
  .simple-mode-action,
  .schedule-add-action,
  .back-action,
  .text-action,
  .dialog-close,
  .dialog-actions button,
  .space-create button,
  .spaces-list button
) {
  overflow: hidden;
  border: 1px solid var(--well-border);
  background: var(--well-bg);
  color: var(--theme-soft);
  box-shadow: inset 0 1px 0 var(--well-highlight);
}

:root[data-theme] :is(
  .offset-options button.active,
  .mini-offsets button.active,
  .simple-mode-action.active,
  .calendar-filters button.active
) {
  border-color: transparent;
  background: var(--active-bg);
  color: var(--theme-strong);
  box-shadow:
    inset 0 0 0 1px var(--active-border),
    inset 0 1px 0 var(--plate-highlight);
}

:root[data-theme] :is(.option-toggle, .schedule-digest-toggle, .disclosure) {
  border-radius: 18px;
}

:root[data-theme] :is(.option-toggle:has(input:checked), .schedule-digest-toggle:has(input:checked)) {
  border-color: transparent;
  background: color-mix(in srgb, var(--active-bg) 76%, var(--plate-soft-bg));
  color: var(--theme-strong);
  box-shadow:
    inset 0 0 0 1px var(--active-border),
    inset 0 1px 0 var(--plate-highlight);
}

:root[data-theme] .theme-picker {
  gap: 8px;
}

:root[data-theme] .theme-picker button {
  overflow: hidden;
  border: 1px solid var(--well-border);
  border-radius: 18px;
  background: var(--well-bg);
  color: var(--theme-soft);
  box-shadow: inset 0 1px 0 var(--well-highlight);
}

:root[data-theme] .theme-picker button.active {
  border-color: transparent;
  background: var(--active-bg);
  color: var(--theme-strong);
  box-shadow:
    inset 0 0 0 1px var(--active-border),
    inset 0 1px 0 var(--plate-highlight);
}

:root[data-theme="porcelain"] :is(
  .category-picker button.active,
  .range-presets button.active,
  .schedule-week-strip button.active,
  .offset-options button.active,
  .mini-offsets button.active,
  .simple-mode-action.active,
  .calendar-filters button.active,
  .theme-picker button.active
) {
  color: #fff9fb;
}

:root[data-theme="porcelain"] .event-editor-panel .category-picker button.active {
  color: #fff9fb;
}

[data-app-view="create"] {
  margin-top: -4px;
}

.editor-view-title {
  margin-bottom: 10px;
}

.editor-view-title > div > h2 {
  margin-top: 4px;
  font-size: 20px;
}

.editor-view-title .simple-mode-action {
  margin-top: -2px;
}

@media (max-width: 420px) {
  :root[data-theme] { --plate-radius: 22px; --well-radius: 17px; --nested-radius: 13px; }
  :root[data-theme] .event-editor-panel { padding: 17px; }
  :root[data-theme] :is(.event-editor-panel input, .event-editor-panel select, .event-editor-panel textarea) { min-height: 57px; }
  .event-editor-panel textarea { min-height: 78px; }
  .schedule-week-strip { padding: 4px; }
}

/* Complete theme color system: every component follows its theme palette. */
:root[data-theme="blxxdy"] {
  --ui-ink: #f1dce1;
  --ui-text: #d1aeb6;
  --ui-muted: #a96f78;
  --ui-faint: #74464f;
  --ui-accent: #a8344c;
  --ui-accent-deep: #671426;
  --ui-accent-bright: #c65f73;
  --ui-active-ink: #f3d7dd;
  --ui-focus: rgba(168, 52, 76, .18);
  --ui-line: rgba(214, 113, 130, .16);
  --ui-danger: #c65f73;
  --ui-page-a: rgba(126, 18, 39, .24);
  --ui-page-b: rgba(74, 6, 21, .2);
  --ui-page-start: #070103;
  --ui-page-mid: #100206;
  --ui-page-end: #030001;
  --ui-primary: linear-gradient(145deg, #74172b, #31040d 62%, #130105);
  --ui-bar: linear-gradient(180deg, #b74c63, #5b1021);
}

:root[data-theme="wine"] {
  --ui-ink: #f8f0f3;
  --ui-text: #f8f0f3;
  --ui-muted: #c0b2ba;
  --ui-faint: rgba(192, 178, 186, .78);
  --ui-accent: #c77a94;
  --ui-accent-deep: #7b4056;
  --ui-accent-bright: #e8b2c5;
  --ui-active-ink: #f8f0f3;
  --ui-focus: rgba(199, 122, 148, .055);
  --ui-line: rgba(245, 235, 240, .065);
  --ui-danger: #c77a94;
  --ui-page-a: rgba(96, 43, 64, .18);
  --ui-page-b: rgba(139, 86, 103, .105);
  --ui-page-start: #0d0b0e;
  --ui-page-mid: #1a1320;
  --ui-page-end: #0f0c10;
  --ui-primary: linear-gradient(145deg, #b66d86, #7b4056);
  --ui-bar: linear-gradient(180deg, #c77a94, #7b4056);
}

:root[data-theme="porcelain"] {
  --ui-ink: #35151c;
  --ui-text: #5c2a35;
  --ui-muted: #764b54;
  --ui-faint: #9a747c;
  --ui-accent: #861a33;
  --ui-accent-deep: #52091b;
  --ui-accent-bright: #ae435a;
  --ui-active-ink: #fff9fb;
  --ui-focus: rgba(134, 26, 51, .15);
  --ui-line: rgba(112, 22, 43, .15);
  --ui-danger: #9b263f;
  --ui-page-a: rgba(134, 26, 51, .11);
  --ui-page-b: rgba(184, 83, 105, .08);
  --ui-page-start: #fffefe;
  --ui-page-mid: #fbf6f8;
  --ui-page-end: #f7f0f3;
  --ui-primary: linear-gradient(145deg, #861a33, #52091b);
  --ui-bar: linear-gradient(180deg, #a83a52, #641126);
}

:root[data-theme="graphite"] {
  --ui-ink: #e4dde0;
  --ui-text: #c4bdc0;
  --ui-muted: #948b8f;
  --ui-faint: #686266;
  --ui-accent: #8f4a58;
  --ui-accent-deep: #4c202a;
  --ui-accent-bright: #b2707d;
  --ui-active-ink: #ebe4e7;
  --ui-focus: rgba(143, 74, 88, .16);
  --ui-line: rgba(230, 220, 224, .095);
  --ui-danger: #aa5d6b;
  --ui-page-a: rgba(93, 39, 51, .13);
  --ui-page-b: rgba(62, 57, 62, .12);
  --ui-page-start: #07080a;
  --ui-page-mid: #0b0c0f;
  --ui-page-end: #050607;
  --ui-primary: linear-gradient(145deg, #30272b, #17171a 58%, #0b0c0e);
  --ui-bar: linear-gradient(180deg, #9a5b68, #4c202a);
}

:root[data-theme] {
  --text: var(--ui-ink);
  --muted: var(--ui-muted);
  --control-text: var(--ui-text);
  --button-text: var(--ui-text);
  --placeholder: color-mix(in srgb, var(--ui-muted) 78%, transparent);
  --line: var(--ui-line);
  --accent: var(--ui-accent);
  --accent-soft: var(--ui-accent-bright);
  --accent-dark: var(--ui-accent-deep);
  --focus: var(--ui-focus);
  --theme-strong: var(--ui-ink);
  --theme-soft: var(--ui-muted);
  --theme-faint: var(--ui-faint);
  --theme-border: var(--ui-line);
}

:root[data-theme] body {
  background:
    radial-gradient(circle at 78% 8%, var(--ui-page-a), transparent 30%),
    radial-gradient(circle at 8% 54%, var(--ui-page-b), transparent 34%),
    linear-gradient(180deg, var(--ui-page-start) 0%, var(--ui-page-mid) 48%, var(--ui-page-end) 100%);
  color: var(--ui-ink);
}

:root[data-theme] body::before {
  display: block;
  background:
    radial-gradient(circle at 20% 22%, color-mix(in srgb, var(--ui-accent) 18%, transparent), transparent 22%),
    radial-gradient(circle at 78% 31%, color-mix(in srgb, var(--ui-accent-bright) 12%, transparent), transparent 20%),
    linear-gradient(155deg, transparent 18%, color-mix(in srgb, var(--ui-accent-deep) 12%, transparent) 52%, transparent 78%);
  opacity: .62;
}

:root[data-theme] body::after,
:root[data-theme].dark-theme body::after {
  display: block;
  background:
    radial-gradient(ellipse at 20% 40%, color-mix(in srgb, var(--ui-accent-deep) 16%, transparent), transparent 36%),
    radial-gradient(ellipse at 78% 60%, color-mix(in srgb, var(--ui-accent) 13%, transparent), transparent 34%);
  opacity: .5;
}

:root[data-theme] .app-header h1 {
  background-image: linear-gradient(110deg, var(--ui-text) 0%, var(--ui-accent) 34%, var(--ui-ink) 57%, var(--ui-accent-deep) 79%, var(--ui-accent-bright) 100%);
}

:root[data-theme] :is(
  .workspace-header h2, .section-heading h2, .view-title h2, .setting-heading strong,
  .pulse-strip strong, .next-event-copy h2, .next-event-date strong,
  .month-day strong, .agenda-group strong, .agenda-item b, .event-item h3,
  .schedule-board-header h2, .schedule-now-copy h2, .schedule-now-time strong,
  .schedule-entry-copy strong, .schedule-empty b, .schedule-insights strong,
  .settings-intro h3, .account-panel h3, .stats-grid strong,
  .template-chip b, .dialog-actions b, .event-dialog h2, .schedule-dialog h2,
  .success-dialog h2, .export-result b, .spaces-list b
) {
  color: var(--ui-ink);
}

:root[data-theme] :is(
  .workspace-header span, .section-heading span, .view-title span, .setting-heading span,
  .pulse-strip span, .next-event-copy p, .next-event-date span, .calendar-hint,
  .month-weekdays, .agenda-item span, .event-item p, .event-item span,
  .schedule-board-header span, .schedule-now-copy p, .schedule-now-time span,
  .schedule-entry-copy > span, .schedule-entry-copy em, .schedule-break,
  .schedule-empty span, .schedule-insights span, .schedule-digest-toggle small,
  .settings-intro p, .account-panel p, .stats-grid span, .navigation-settings > p,
  .data-panel > p, .settings-status, .template-chip span, .export-result span,
  .spaces-list span, .dialog-meta, .event-dialog p, .success-dialog p
) {
  color: var(--ui-muted);
}

:root[data-theme] :is(
  label > span, legend, .schedule-digest-toggle b, .schedule-digest-time,
  .default-view > span, .navigation-priority > span
) {
  color: var(--ui-text);
}

:root[data-theme] :is(input, select, textarea) {
  color: var(--ui-text);
  caret-color: var(--ui-accent-bright);
}

:root[data-theme] :is(input, textarea)::placeholder,
:root[data-theme] .date-placeholder {
  color: color-mix(in srgb, var(--ui-muted) 76%, transparent);
}

:root[data-theme] :is(input, select, textarea):focus,
:root[data-theme] :is(.select-shell, .date-shell):focus-within {
  border-color: color-mix(in srgb, var(--ui-accent-bright) 48%, var(--well-border));
  box-shadow: inset 0 1px 0 var(--well-highlight), 0 0 0 3px var(--ui-focus);
}

:root[data-theme] :is(.select-shell, .date-shell, .time-shell) > svg,
:root[data-theme] :is(.icon-action, .back-action, .period-actions button, .schedule-week-actions button) {
  color: var(--ui-muted);
}

:root[data-theme] .pulse-strip div {
  border-color: color-mix(in srgb, var(--ui-line) 82%, transparent);
}

:root[data-theme] :is(.period-actions button, .calendar-filters button, .schedule-week-actions button, .text-action, .secondary-action, .simple-mode-action, .schedule-add-action, .data-actions button, .offset-options button, .mini-offsets button) {
  color: var(--ui-muted);
}

:root[data-theme] :is(.calendar-modes button, .schedule-week-strip button, .bottom-nav button, .category-picker button, .range-presets button, .theme-picker button) {
  color: var(--ui-faint);
}

:root[data-theme] :is(
  .calendar-modes button.active, .schedule-week-strip button.active, .bottom-nav button.active,
  .calendar-filters button.active, .category-picker button.active, .range-presets button.active,
  .offset-options button.active, .mini-offsets button.active, .simple-mode-action.active,
  .theme-picker button.active
) {
  color: var(--ui-active-ink);
}

:root[data-theme="blxxdy"] {
  --calendar-cell-bg:
    radial-gradient(circle at 18% 0%, rgba(169, 41, 66, .12), transparent 42%),
    linear-gradient(145deg, rgba(35, 6, 15, .92), rgba(9, 1, 4, .95));
  --calendar-cell-border: rgba(198, 95, 115, .14);
  --calendar-cell-highlight: rgba(255, 225, 231, .035);
  --calendar-cell-shadow: rgba(3, 0, 1, .13);
}

:root[data-theme="wine"] {
  --calendar-cell-bg:
    radial-gradient(circle at 18% 0%, rgba(109, 47, 76, .11), transparent 42%),
    linear-gradient(145deg, rgba(38, 13, 29, .9), rgba(12, 3, 9, .94));
  --calendar-cell-border: rgba(199, 122, 148, .15);
  --calendar-cell-highlight: rgba(255, 226, 237, .035);
  --calendar-cell-shadow: rgba(8, 2, 6, .11);
}

:root[data-theme="graphite"] {
  --calendar-cell-bg:
    radial-gradient(circle at 18% 0%, rgba(215, 219, 225, .045), transparent 42%),
    linear-gradient(145deg, rgba(30, 31, 35, .92), rgba(11, 12, 14, .95));
  --calendar-cell-border: rgba(218, 221, 226, .1);
  --calendar-cell-highlight: rgba(255, 255, 255, .03);
  --calendar-cell-shadow: rgba(0, 0, 0, .16);
}

:root[data-theme="porcelain"] {
  --calendar-cell-bg:
    radial-gradient(circle at 18% 0%, rgba(134, 26, 51, .065), transparent 42%),
    linear-gradient(145deg, rgba(255, 255, 255, .98), rgba(241, 225, 232, .9));
  --calendar-cell-border: rgba(112, 22, 43, .13);
  --calendar-cell-highlight: rgba(255, 255, 255, .96);
  --calendar-cell-shadow: rgba(82, 9, 27, .065);
}

:root[data-theme] .month-day {
  border: 1px solid transparent;
  background: var(--calendar-cell-bg);
  color: var(--ui-text);
  box-shadow:
    inset 0 1px 0 var(--calendar-cell-highlight),
    inset 0 -8px 16px var(--calendar-cell-shadow),
    0 3px 8px var(--calendar-cell-shadow);
}

:root[data-theme] .month-day.outside {
  opacity: .52;
}

:root[data-theme] .month-day.today {
  border-color: transparent;
  background:
    radial-gradient(circle at 78% 18%, color-mix(in srgb, var(--ui-accent-bright) 18%, transparent), transparent 25%),
    var(--calendar-cell-bg);
}

:root[data-theme] .month-day.selected {
  color: var(--ui-active-ink);
  background: transparent;
  border-color: transparent;
  box-shadow: none;
}

:root[data-theme] .month-selection-lens {
  border-color: transparent;
  background: var(--active-bg);
  box-shadow:
    inset 0 1px 0 var(--plate-highlight),
    inset 0 -10px 18px var(--plate-lowlight),
    0 8px 18px color-mix(in srgb, var(--ui-accent-deep) 24%, transparent);
}

:root[data-theme] .month-event.single { color: var(--ui-text); }
:root[data-theme] .month-event.compact { color:var(--ui-text); }
:root[data-theme] .month-more { background:color-mix(in srgb,var(--ui-accent) 13%,var(--tray-bg));color:var(--ui-muted); }
:root[data-theme] .event-stack b { color: var(--ui-muted); }
:root[data-theme] .calendar-hint svg { color: var(--ui-accent-bright); }
:root[data-theme] .timeline-head { background: color-mix(in srgb, var(--tray-bg) 94%, transparent); }
:root[data-theme] :is(.timeline-head button, .timeline-hours, .agenda-group header, .event-search svg) { color: var(--ui-muted); }
:root[data-theme] :is(.timeline-head > i, .timeline-head button, .timeline-hours span, .timeline-column, .agenda-item) { border-color: var(--ui-line); }
:root[data-theme] .timeline-columns { background-image: repeating-linear-gradient(to bottom, transparent 0 68px, var(--ui-line) 68px 69px); }
:root[data-theme] .timeline-event { color: var(--ui-active-ink); }

:root[data-theme] .week-load .section-heading > strong,
:root[data-theme] .load-bars b { color: var(--ui-text); }
:root[data-theme] .load-bars small { color: var(--ui-muted); }
:root[data-theme] .load-track { background: color-mix(in srgb, var(--well-bg) 78%, transparent); }
:root[data-theme] .load-track i { background: var(--ui-bar); box-shadow: 0 0 18px color-mix(in srgb, var(--ui-accent) 24%, transparent); }

:root[data-theme] .next-event-copy > span,
:root[data-theme] .schedule-now-copy > span,
:root[data-theme] .schedule-entry-copy small,
:root[data-theme] .schedule-entry-time {
  color: color-mix(in srgb, var(--event-accent, var(--schedule-color, var(--ui-accent))) 62%, var(--ui-text));
}

:root[data-theme] :is(.next-event-date, .schedule-now-time) {
  border-color: color-mix(in srgb, var(--event-accent, var(--schedule-color, var(--ui-accent))) 34%, var(--ui-line));
  background: color-mix(in srgb, var(--tray-bg) 82%, transparent);
}

:root[data-theme] :is(.schedule-insights svg, .settings-intro > svg, .account-panel > svg, .export-result > svg) {
  color: var(--ui-accent-bright);
}

:root[data-theme] :is(.option-toggle-icon, .settings-intro > svg) {
  border-color: color-mix(in srgb, var(--ui-accent-bright) 25%, var(--ui-line));
  background: color-mix(in srgb, var(--ui-accent) 13%, var(--well-bg));
}

:root[data-theme] :is(.option-toggle input:checked + .option-toggle-icon, .schedule-digest-toggle input:checked + .option-toggle-icon) {
  border-color: color-mix(in srgb, var(--ui-accent-bright) 38%, var(--ui-line));
  background: var(--active-bg);
  color: var(--ui-active-ink);
}

:root[data-theme] :is(.primary-action, .export-result a) {
  border-color: color-mix(in srgb, var(--ui-accent-bright) 28%, var(--ui-line));
  background: var(--ui-primary);
  color: var(--ui-active-ink);
  box-shadow: inset 0 1px 0 color-mix(in srgb, var(--ui-accent-bright) 10%, transparent), 0 10px 24px color-mix(in srgb, var(--ui-accent-deep) 22%, transparent);
}

:root[data-theme] :is(.danger-action, .dialog-actions .danger) {
  border-color: color-mix(in srgb, var(--ui-danger) 34%, transparent);
  color: var(--ui-danger);
  background: color-mix(in srgb, var(--ui-danger) 8%, var(--well-bg));
}

:root[data-theme] .bottom-nav button.active svg,
:root[data-theme] .calendar-modes button.active,
:root[data-theme] .theme-picker button.active > svg {
  color: var(--ui-accent-bright);
}

:root[data-theme] :is(.event-dialog-card, .schedule-dialog-card, .success-dialog > div) {
  color: var(--ui-text);
  border-color: var(--plate-border);
  background: var(--plate-bg);
  box-shadow: inset 0 1px 0 var(--plate-highlight), var(--plate-shadow);
}

:root[data-theme] :is(.event-dialog, .schedule-dialog)::backdrop,
:root[data-theme] .success-dialog::backdrop {
  background: color-mix(in srgb, var(--ui-page-end) 78%, transparent);
}

:root[data-theme] .navigation-status {
  margin-bottom: 0;
  color: var(--ui-accent-bright);
}

/* Category accents are theme-specific, including calendar filters and saved-event previews. */
:root[data-theme="blxxdy"] { --cat-personal:#a8344c; --cat-work:#743449; --cat-health:#91283e; --cat-payments:#864657; --cat-shopping:#57243b; --cat-family:#aa4e60; --cat-other:#713744; }
:root[data-theme="wine"] { --cat-personal:#c77a94; --cat-work:#a58d9a; --cat-health:#d092a8; --cat-payments:#b27b8e; --cat-shopping:#8f7183; --cat-family:#d0a0b0; --cat-other:#9d8290; }
:root[data-theme="porcelain"] { --cat-personal:#861a33; --cat-work:#72404d; --cat-health:#a23c53; --cat-payments:#8a5260; --cat-shopping:#613544; --cat-family:#a54d61; --cat-other:#79505a; }
:root[data-theme="graphite"] { --cat-personal:#8f4a58; --cat-work:#65565e; --cat-health:#9b5c68; --cat-payments:#755a62; --cat-shopping:#554951; --cat-family:#9d6972; --cat-other:#6d6065; }

:root[data-theme] [data-category-choice="personal"] { --category-color: var(--cat-personal) !important; }
:root[data-theme] [data-category-choice="work"] { --category-color: var(--cat-work) !important; }
:root[data-theme] [data-category-choice="health"] { --category-color: var(--cat-health) !important; }
:root[data-theme] [data-category-choice="payments"] { --category-color: var(--cat-payments) !important; }
:root[data-theme] [data-category-choice="shopping"] { --category-color: var(--cat-shopping) !important; }
:root[data-theme] [data-category-choice="family"] { --category-color: var(--cat-family) !important; }
:root[data-theme] [data-category-choice="other"] { --category-color: var(--cat-other) !important; }
:root[data-theme] [data-category-filter="personal"] { --filter-color: var(--cat-personal); }
:root[data-theme] [data-category-filter="work"] { --filter-color: var(--cat-work); }
:root[data-theme] [data-category-filter="health"] { --filter-color: var(--cat-health); }
:root[data-theme] [data-category-filter="payments"] { --filter-color: var(--cat-payments); }
:root[data-theme] [data-category-filter="family"] { --filter-color: var(--cat-family); }

:root[data-theme="porcelain"] :is(.calendar-modes button.active, .schedule-week-strip button.active, .bottom-nav button.active, .calendar-filters button.active, .category-picker button.active, .range-presets button.active, .offset-options button.active, .mini-offsets button.active, .simple-mode-action.active, .theme-picker button.active),
:root[data-theme="porcelain"] .event-editor-panel .category-picker button.active {
  color: var(--ui-active-ink);
}

/* LA Beauty plate recipe: ink-dark cards, lifted wells, restrained edge light. */
:root[data-theme="wine"] {
  --plate-bg:
    radial-gradient(circle at 12% 0%, rgba(91, 31, 59, .2), transparent 37%),
    linear-gradient(145deg, rgba(27, 8, 21, .94), rgba(11, 2, 9, .96));
  --plate-soft-bg:
    radial-gradient(circle at 14% 0%, rgba(88, 29, 56, .16), transparent 40%),
    linear-gradient(145deg, rgba(25, 8, 20, .9), rgba(12, 3, 10, .94));
  --plate-border: rgba(199, 122, 148, .2);
  --plate-highlight: rgba(248, 240, 243, .055);
  --plate-lowlight: rgba(5, 1, 4, .2);
  --plate-shadow: 0 14px 28px rgba(5, 4, 6, .18);
  --well-bg:
    radial-gradient(circle at 15% 0%, rgba(109, 47, 76, .16), transparent 42%),
    linear-gradient(145deg, rgba(52, 22, 39, .92), rgba(25, 9, 18, .95));
  --well-border: rgba(199, 122, 148, .24);
  --well-highlight: rgba(255, 226, 237, .06);
  --well-lowlight: rgba(8, 2, 6, .15);
  --tray-bg: linear-gradient(145deg, rgba(17, 4, 13, .96), rgba(8, 1, 6, .97));
  --active-bg:
    radial-gradient(circle at 18% 0%, rgba(199, 122, 148, .18), transparent 44%),
    linear-gradient(145deg, rgba(62, 25, 45, .92), rgba(24, 7, 17, .95));
  --active-border: rgba(199, 122, 148, .34);
  --surface-sheen: rgba(199, 122, 148, .018);
}

:root[data-theme="blxxdy"] {
  --plate-bg:
    radial-gradient(circle at 14% 0%, rgba(168, 34, 62, .22), transparent 38%),
    radial-gradient(circle at 90% 92%, rgba(84, 5, 22, .12), transparent 42%),
    linear-gradient(145deg, rgba(29, 6, 13, .96), rgba(7, 1, 4, .98));
  --plate-soft-bg:
    radial-gradient(circle at 14% 0%, rgba(146, 25, 50, .16), transparent 40%),
    linear-gradient(145deg, rgba(24, 4, 10, .94), rgba(7, 1, 3, .97));
  --plate-border: rgba(198, 95, 115, .22);
  --plate-highlight: rgba(255, 220, 226, .05);
  --plate-lowlight: rgba(3, 0, 1, .24);
  --plate-shadow: 0 14px 28px rgba(3, 0, 1, .26);
  --well-bg:
    radial-gradient(circle at 15% 0%, rgba(180, 43, 69, .17), transparent 42%),
    linear-gradient(145deg, rgba(58, 13, 27, .93), rgba(22, 3, 10, .96));
  --well-border: rgba(198, 95, 115, .23);
  --well-highlight: rgba(255, 226, 232, .055);
  --well-lowlight: rgba(3, 0, 1, .18);
  --tray-bg: linear-gradient(145deg, rgba(13, 1, 5, .97), rgba(5, 0, 2, .98));
  --active-bg:
    radial-gradient(circle at 18% 0%, rgba(198, 95, 115, .19), transparent 44%),
    linear-gradient(145deg, rgba(78, 13, 31, .93), rgba(25, 2, 10, .97));
  --active-border: rgba(198, 95, 115, .36);
  --surface-sheen: rgba(214, 84, 106, .05);
}

:root[data-theme="graphite"] {
  --plate-bg:
    radial-gradient(circle at 12% 0%, rgba(205, 210, 216, .075), transparent 36%),
    radial-gradient(circle at 90% 100%, rgba(111, 42, 56, .075), transparent 42%),
    linear-gradient(145deg, rgba(25, 26, 30, .96), rgba(7, 8, 10, .98));
  --plate-soft-bg:
    radial-gradient(circle at 15% 0%, rgba(197, 201, 207, .055), transparent 40%),
    linear-gradient(145deg, rgba(21, 22, 25, .94), rgba(8, 9, 11, .97));
  --plate-border: rgba(218, 221, 226, .14);
  --plate-highlight: rgba(255, 255, 255, .045);
  --plate-lowlight: rgba(0, 0, 0, .27);
  --plate-shadow: 0 14px 28px rgba(0, 0, 0, .3);
  --well-bg:
    radial-gradient(circle at 15% 0%, rgba(218, 221, 226, .07), transparent 42%),
    linear-gradient(145deg, rgba(42, 43, 48, .94), rgba(18, 19, 22, .97));
  --well-border: rgba(218, 221, 226, .13);
  --well-highlight: rgba(255, 255, 255, .05);
  --well-lowlight: rgba(0, 0, 0, .21);
  --tray-bg: linear-gradient(145deg, rgba(12, 13, 15, .97), rgba(6, 7, 9, .98));
  --active-bg:
    radial-gradient(circle at 18% 0%, rgba(143, 74, 88, .12), transparent 44%),
    linear-gradient(145deg, rgba(49, 42, 46, .94), rgba(20, 20, 23, .97));
  --active-border: rgba(178, 112, 125, .26);
  --surface-sheen: rgba(220, 224, 230, .035);
}

:root[data-theme="porcelain"] {
  --plate-bg:
    radial-gradient(circle at 12% 0%, rgba(134, 26, 51, .075), transparent 37%),
    radial-gradient(circle at 90% 100%, rgba(177, 76, 101, .055), transparent 42%),
    linear-gradient(145deg, rgba(255, 254, 254, .98), rgba(243, 231, 236, .96));
  --plate-soft-bg:
    radial-gradient(circle at 14% 0%, rgba(134, 26, 51, .055), transparent 40%),
    linear-gradient(145deg, rgba(255, 251, 252, .97), rgba(242, 226, 232, .94));
  --plate-border: rgba(112, 22, 43, .15);
  --plate-highlight: rgba(255, 255, 255, .95);
  --plate-lowlight: rgba(82, 9, 27, .07);
  --plate-shadow: 0 16px 34px rgba(82, 9, 27, .1);
  --well-bg:
    radial-gradient(circle at 15% 0%, rgba(157, 44, 70, .065), transparent 42%),
    linear-gradient(145deg, rgba(255, 255, 255, .98), rgba(244, 229, 235, .96));
  --well-border: rgba(112, 22, 43, .16);
  --well-highlight: rgba(255, 255, 255, .98);
  --well-lowlight: rgba(82, 9, 27, .07);
  --tray-bg: linear-gradient(145deg, rgba(255, 251, 252, .97), rgba(239, 222, 229, .96));
  --active-bg:
    radial-gradient(circle at 18% 0%, rgba(156, 47, 72, .2), transparent 44%),
    linear-gradient(145deg, rgba(112, 22, 43, .96), rgba(66, 7, 22, .98));
  --active-border: rgba(82, 9, 27, .24);
  --surface-sheen: rgba(134, 26, 51, .045);
}

:root[data-theme] .event-editor-panel {
  background: var(--plate-bg);
  border-color: var(--plate-border);
  box-shadow:
    inset 0 1px 0 var(--plate-highlight),
    inset 0 -1px 0 var(--plate-lowlight),
    var(--plate-shadow);
}

:root[data-theme] .event-editor-panel::before {
  background: linear-gradient(125deg, var(--surface-sheen), transparent 34% 78%, var(--surface-sheen));
  opacity: .32;
}

/* Wine is source-locked to the current LA Beauty dark theme. */
:root[data-theme="wine"] body {
  background:
    radial-gradient(circle at 20% 82%, rgba(54, 16, 39, .08), transparent 44%),
    linear-gradient(180deg, #0b070c 0%, #0e080e 34%, #160e15 68%, #0f0a0f 100%);
}

:root[data-theme="wine"] body::before,
:root[data-theme="wine"] body::after {
  display: none;
}

:root[data-theme="blxxdy"] body {
  background:
    radial-gradient(circle at 15% 16%, rgba(120, 12, 35, .14), transparent 28%),
    radial-gradient(circle at 84% 66%, rgba(82, 4, 22, .11), transparent 34%),
    linear-gradient(180deg, #050102 0%, #0a0205 38%, #110308 70%, #040102 100%);
}

:root[data-theme="blxxdy"] body::before {
  background:
    radial-gradient(circle at 18% 22%, rgba(168, 34, 62, .12), transparent 24%),
    linear-gradient(155deg, transparent 18%, rgba(103, 20, 38, .08) 52%, transparent 78%);
  opacity: .68;
}

:root[data-theme="blxxdy"] body::after {
  background:
    radial-gradient(ellipse at 78% 60%, rgba(126, 18, 39, .1), transparent 36%);
  opacity: .54;
}

:root[data-theme="graphite"] body {
  background:
    radial-gradient(circle at 18% 18%, rgba(183, 188, 196, .045), transparent 30%),
    radial-gradient(circle at 82% 72%, rgba(104, 38, 52, .055), transparent 34%),
    linear-gradient(180deg, #050607 0%, #090a0c 38%, #0f1013 70%, #060709 100%);
}

:root[data-theme="graphite"] body::before {
  background:
    radial-gradient(circle at 20% 22%, rgba(220, 224, 230, .045), transparent 24%),
    linear-gradient(155deg, transparent 18%, rgba(143, 74, 88, .045) 52%, transparent 78%);
  opacity: .64;
}

:root[data-theme="graphite"] body::after {
  background:
    radial-gradient(ellipse at 78% 60%, rgba(205, 210, 216, .035), transparent 36%);
  opacity: .48;
}

:root[data-theme="porcelain"] body {
  background:
    radial-gradient(circle at 14% 16%, rgba(134, 26, 51, .09), transparent 29%),
    radial-gradient(circle at 84% 68%, rgba(177, 76, 101, .07), transparent 35%),
    linear-gradient(180deg, #fffefe 0%, #fbf5f7 40%, #f6eaef 72%, #fffafa 100%);
}

:root[data-theme="porcelain"] body::before {
  background:
    radial-gradient(circle at 18% 22%, rgba(134, 26, 51, .06), transparent 24%),
    linear-gradient(155deg, transparent 18%, rgba(174, 67, 90, .045) 52%, transparent 78%);
  opacity: .7;
}

:root[data-theme="porcelain"] body::after {
  background:
    radial-gradient(ellipse at 78% 60%, rgba(134, 26, 51, .05), transparent 36%);
  opacity: .55;
}

:root[data-theme="wine"] :is(.primary-action, .export-result a) {
  border-color: transparent;
  background: linear-gradient(145deg, #b66d86, #7b4056);
  color: #f8f0f3;
  box-shadow: 0 14px 28px rgba(5, 4, 6, .24);
}

:root[data-theme="wine"] :is(
  label > span, legend, .schedule-digest-toggle b, .schedule-digest-time,
  .default-view > span, .navigation-priority > span
) {
  color: #c0b2ba;
}

/* Subscription is an account state, not a storefront: one dense premium surface. */
.subscription-panel {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  margin-bottom: 12px;
  padding: 19px;
  border: 1px solid var(--plate-border);
  border-radius: var(--plate-radius);
  background: var(--plate-bg);
  background-size: 125% 125%;
  box-shadow:
    inset 0 1px 0 var(--plate-highlight),
    inset 0 -1px 0 var(--plate-lowlight),
    var(--plate-shadow);
  backdrop-filter: blur(24px) saturate(1.18);
  -webkit-backdrop-filter: blur(24px) saturate(1.18);
}

.subscription-heading {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: 42px 1fr auto;
  gap: 12px;
  align-items: center;
}

.subscription-mark {
  display: grid;
  width: 42px;
  height: 42px;
  place-items: center;
  border: 1px solid var(--active-border);
  border-radius: 15px;
  background: var(--active-bg);
  color: var(--ui-active-ink);
  box-shadow: inset 0 1px 0 var(--plate-highlight);
}

.subscription-mark svg { width: 19px; height: 19px; }
.subscription-heading div > span { display: block; color: var(--ui-muted); font-size: 9px; }
.subscription-heading h2 { margin: 2px 0 0; color: var(--ui-ink); font-size: 19px; }

.subscription-heading > strong {
  min-width: 43px;
  padding: 7px 9px;
  border-radius: 11px;
  background: color-mix(in srgb, var(--active-bg) 76%, var(--plate-soft-bg));
  color: var(--ui-active-ink);
  font-size: 9px;
  text-align: center;
}

.subscription-copy {
  position: relative;
  z-index: 2;
  margin: 15px 0 13px;
  color: var(--ui-muted);
  font-size: 11px;
  line-height: 1.55;
}

.subscription-usage {
  position: relative;
  z-index: 2;
  display: grid;
  gap: 8px;
}

.subscription-usage > span { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.subscription-usage b { color: var(--ui-text); font-size: 10px; font-weight: 500; }
.subscription-usage strong { color: var(--ui-ink); font-size: 10px; }
.subscription-usage > div { overflow: hidden; height: 5px; border-radius: 3px; background: var(--tray-bg); }
.subscription-usage > div i {
  display: block;
  width: 0;
  height: 100%;
  border-radius: inherit;
  background: var(--ui-bar);
  transition: width 620ms var(--ease-out-premium);
}

.subscription-features {
  position: relative;
  z-index: 2;
  display: flex;
  flex-wrap: wrap;
  gap: 8px 13px;
  margin: 15px 0;
  padding: 13px 0;
  border-top: 1px solid var(--ui-line);
  border-bottom: 1px solid var(--ui-line);
}

.subscription-features span { display: inline-flex; align-items: center; gap: 5px; color: var(--ui-muted); font-size: 9px; }
.subscription-features svg { width: 13px; height: 13px; color: var(--ui-accent-bright); }
.subscription-actions { position: relative; z-index: 2; display: grid; gap: 8px; }
.subscription-actions .primary-action { margin: 0; }
.subscription-actions .secondary-action { width: 100%; }
.subscription-actions.owner-actions-hidden { display: none; }
.subscription-panel:has(.owner-actions-hidden) .subscription-status,
.subscription-panel:has(.owner-actions-hidden) .subscription-legal { display: none; }
.subscription-yearly { min-height: 48px; border-color: var(--active-border); background: var(--well-bg); color: var(--ui-text); }
.subscription-status { min-height: 15px; margin: 9px 0 0; color: var(--ui-accent-bright); font-size: 9px; text-align: center; }
.subscription-legal { margin: 8px 0 0; color: var(--ui-faint); font-size: 8px; line-height: 1.5; text-align: center; }
.subscription-legal b { color: var(--ui-muted); font-weight: 500; }

.subscription-orbit {
  position: absolute;
  z-index: 0;
  top: -64px;
  right: -48px;
  width: 160px;
  height: 160px;
  border: 1px solid color-mix(in srgb, var(--ui-accent) 18%, transparent);
  border-radius: 50%;
  opacity: .56;
  pointer-events: none;
  animation: subscription-orbit-drift 14s ease-in-out infinite alternate;
}

.subscription-orbit i { position: absolute; border-radius: 50%; background: var(--ui-accent-bright); opacity: .55; }
.subscription-orbit i:nth-child(1) { top: 90px; left: 7px; width: 5px; height: 5px; }
.subscription-orbit i:nth-child(2) { top: 134px; left: 58px; width: 4px; height: 4px; }
.subscription-orbit i:nth-child(3) { top: 108px; right: 8px; width: 3px; height: 3px; }

@keyframes subscription-orbit-drift {
  from { transform: translate3d(0, 0, 0) rotate(-4deg); }
  to { transform: translate3d(-8px, 7px, 0) rotate(8deg); }
}

.pro-dialog .primary-action { display: flex; align-items: center; justify-content: center; gap: 8px; }
.pro-dialog .primary-action svg { width: 17px; height: 17px; }
.pro-dialog .secondary-action { width: 100%; margin-top: 8px; }

:root[data-theme="porcelain"] .subscription-heading > strong {
  background: var(--active-bg);
}

@media (max-width: 360px) {
  .subscription-panel { padding: 16px; }
  .subscription-heading { grid-template-columns: 38px 1fr auto; gap: 9px; }
  .subscription-mark { width: 38px; height: 38px; border-radius: 13px; }
  .subscription-heading h2 { font-size: 17px; }
  .subscription-features { gap: 7px 10px; }
}

@media (prefers-reduced-motion: reduce) {
  .subscription-orbit { animation: none; }
  .subscription-usage > div i { transition: none; }
}

/* Pro photo import keeps OCR review inside the schedule workspace. */
.schedule-title-actions {
  display: flex;
  align-items: center;
  gap: 7px;
}

.schedule-photo-action {
  position: relative;
  min-height: 42px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  padding: 0 11px;
  border: 1px solid var(--well-border);
  border-radius: 14px;
  background: var(--tray-bg);
  color: var(--ui-muted);
  font-size: 9px;
  box-shadow: inset 0 1px 0 var(--well-highlight);
  transition: transform 120ms var(--ease-out-premium), border-color 200ms ease, color 200ms ease;
}

.schedule-photo-action svg { width: 16px; height: 16px; color: var(--ui-accent-bright); }
.schedule-photo-action b {
  padding: 3px 4px;
  border-radius: 6px;
  background: var(--active-bg);
  color: var(--ui-active-ink);
  font-size: 6px;
  letter-spacing: 0;
}

.schedule-photo-action:active { transform: scale(.97); }

.schedule-parameters-action {
  min-height: 42px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  padding: 0 11px;
  border: 1px solid var(--well-border);
  border-radius: 14px;
  background: var(--well-bg);
  color: var(--ui-muted);
  font-size: 9px;
  box-shadow: inset 0 1px 0 var(--well-highlight), inset 0 -1px 0 var(--well-lowlight);
  transition: transform 120ms var(--ease-out-premium), color 200ms ease;
}

.schedule-parameters-action svg { width: 16px; height: 16px; color: var(--ui-accent-bright); }
.schedule-parameters-action:active { transform: scale(.97); }

.schedule-preferences-dialog {
  width: min(calc(100% - 16px), 560px);
  max-height: calc(100dvh - 16px);
  overflow: auto;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--ui-text);
  scrollbar-width: none;
}

.schedule-preferences-dialog::-webkit-scrollbar { display: none; }
.schedule-preferences-dialog::backdrop {
  background: color-mix(in srgb, var(--ui-page-end) 82%, transparent);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  animation: backdrop-in 200ms ease-out both;
}

.schedule-preferences-card {
  position: relative;
  display: grid;
  gap: 14px;
  padding: 23px;
  border: 1px solid var(--plate-border);
  border-radius: var(--plate-radius);
  background: var(--plate-bg);
  box-shadow: inset 0 1px 0 var(--plate-highlight), var(--plate-shadow);
  backdrop-filter: blur(28px) saturate(1.16);
  -webkit-backdrop-filter: blur(28px) saturate(1.16);
  animation: event-dialog-in-refined 290ms var(--ease-glass) both;
}

.schedule-preferences-dialog.is-closing .schedule-preferences-card { animation: event-dialog-out-refined 170ms cubic-bezier(.4, 0, 1, 1) both; }
.schedule-preferences-card > h2 { margin: 7px 42px 2px 0; color: var(--ui-ink); font-size: 21px; }
.schedule-pattern-field { min-width: 0; margin: 0; padding: 0; border: 0; }
.schedule-pattern-field legend { margin-bottom: 8px; color: var(--ui-muted); font-size: 9px; }
.schedule-pattern-options { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 7px; }
.schedule-pattern-options button {
  min-width: 0;
  min-height: 54px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  padding: 0 8px;
  border: 1px solid var(--well-border);
  border-radius: 16px;
  background: var(--tray-bg);
  color: var(--ui-faint);
  font-size: 8px;
  box-shadow: inset 0 1px 0 var(--well-highlight);
  transition: transform 140ms var(--ease-out-premium), background 220ms ease, color 220ms ease;
}
.schedule-pattern-options button svg { width: 15px; height: 15px; flex: 0 0 auto; }
.schedule-pattern-options button.active { background: var(--active-bg); color: var(--ui-active-ink); }
.schedule-pattern-options button.active svg { color: var(--ui-accent-bright); }
.schedule-pattern-options button:active { transform: scale(.97); }
.schedule-preferences-range { gap: 8px; }
.schedule-preferences-range label { min-width: 0; }
.schedule-preferences-range label > span { font-size: 9px; }
.schedule-preferences-range .date-shell { min-width: 0; }
.schedule-apply-existing { margin-top: 1px; }
.schedule-preferences-card > .primary-action { margin: 0; }

@media (max-width: 420px) {
  .schedule-title-actions { gap: 5px; }
  .schedule-title-actions :is(.schedule-parameters-action, .schedule-photo-action) { padding: 0 9px; }
  .schedule-title-actions :is(.schedule-parameters-action, .schedule-photo-action) > span { display: none; }
  .schedule-preferences-card { padding: 20px; }
}

@media (max-width: 350px) {
  .schedule-title-actions button { width: 40px; padding: 0; }
  .schedule-title-actions button > span,
  .schedule-title-actions .schedule-photo-action > b { display: none; }
  .schedule-pattern-options { grid-template-columns: 1fr; }
}

.schedule-import-dialog {
  width: min(calc(100% - 16px), 620px);
  max-height: calc(100dvh - 16px);
  overflow: auto;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--ui-text);
  scrollbar-width: none;
}

.schedule-import-dialog::-webkit-scrollbar { display: none; }
.schedule-import-dialog::backdrop {
  background: color-mix(in srgb, var(--ui-page-end) 82%, transparent);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  animation: backdrop-in 200ms ease-out both;
}

.schedule-import-card {
  position: relative;
  display: grid;
  gap: 13px;
  padding: 23px;
  border: 1px solid var(--plate-border);
  border-radius: var(--plate-radius);
  background: var(--plate-bg);
  box-shadow: inset 0 1px 0 var(--plate-highlight), var(--plate-shadow);
  backdrop-filter: blur(28px) saturate(1.16);
  -webkit-backdrop-filter: blur(28px) saturate(1.16);
  animation: event-dialog-in-refined 290ms var(--ease-glass) both;
}

.schedule-import-dialog.is-closing .schedule-import-card { animation: event-dialog-out-refined 170ms cubic-bezier(.4, 0, 1, 1) both; }
.schedule-import-card > h2 { margin: 7px 42px 1px 0; color: var(--ui-ink); font-size: 21px; }
.schedule-import-hint { margin: 0; color: var(--ui-muted); font-size: 9px; line-height: 1.55; }

.schedule-import-preview {
  display: grid;
  grid-template-columns: 82px minmax(0, 1fr);
  align-items: center;
  gap: 13px;
  min-height: 104px;
  padding: 10px;
  overflow: hidden;
  border: 1px solid var(--well-border);
  border-radius: 20px;
  background: var(--well-bg);
  box-shadow: inset 0 1px 0 var(--well-highlight), inset 0 -1px 0 var(--well-lowlight);
}

.schedule-import-preview img {
  width: 82px;
  height: 82px;
  object-fit: cover;
  border-radius: 15px;
  background: var(--tray-bg);
  filter: saturate(.74) contrast(1.05);
}

.schedule-import-preview > div { min-width: 0; }
.schedule-import-preview span,
.schedule-import-preview strong { display: block; }
.schedule-import-preview span { color: var(--ui-faint); font-size: 8px; }
.schedule-import-preview strong { margin-top: 6px; color: var(--ui-text); font-size: 11px; line-height: 1.4; }
.schedule-import-preview > div > i {
  position: relative;
  display: block;
  height: 3px;
  margin-top: 12px;
  overflow: hidden;
  border-radius: 3px;
  background: var(--tray-bg);
}

.schedule-import-preview > div > i::after {
  position: absolute;
  inset: 0;
  width: 45%;
  border-radius: inherit;
  background: var(--ui-bar);
  animation: schedule-ocr-progress 1.35s ease-in-out infinite alternate;
  content: "";
}

@keyframes schedule-ocr-progress {
  from { transform: translateX(-8%); opacity: .58; }
  to { transform: translateX(130%); opacity: 1; }
}

.schedule-import-list { display: grid; gap: 9px; }

.schedule-import-entry {
  display: grid;
  gap: 10px;
  padding: 13px;
  border: 1px solid var(--well-border);
  border-radius: 20px;
  background: var(--well-bg);
  box-shadow: inset 0 1px 0 var(--well-highlight), inset 0 -1px 0 var(--well-lowlight);
  animation: glass-reveal 280ms var(--ease-out-premium) both;
}

.schedule-import-entry.is-duplicate { opacity: .57; }
.schedule-import-entry > header { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.schedule-import-entry > header label { display: inline-flex; align-items: center; gap: 7px; color: var(--ui-muted); font-size: 8px; }
.schedule-import-entry > header input { position: absolute; width: 1px; height: 1px; min-height: 0; opacity: 0; }
.schedule-import-entry > header label i {
  width: 18px;
  height: 18px;
  display: grid;
  place-items: center;
  border: 1px solid var(--well-border);
  border-radius: 7px;
  background: var(--tray-bg);
}
.schedule-import-entry > header input:checked + i { border-color: var(--active-border); background: var(--active-bg); }
.schedule-import-entry > header input:checked + i::after { width: 5px; height: 9px; border: solid var(--ui-active-ink); border-width: 0 2px 2px 0; transform: rotate(45deg) translate(-1px, -1px); content: ""; }
.schedule-import-entry > header b { color: var(--ui-faint); font-size: 7px; font-weight: 500; }
.schedule-import-entry label > span { color: var(--ui-muted); font-size: 8px; }
.schedule-import-entry input,
.schedule-import-entry select { min-height: 46px; border-radius: 14px; font-size: 10px; }
.schedule-import-title { gap: 6px; }
.schedule-import-fields { display: grid; grid-template-columns: 1.35fr 1fr 1fr; gap: 7px; }
.schedule-import-fields label { min-width: 0; gap: 6px; }
.schedule-import-fields input { padding: 0 7px; text-align: center; }
.schedule-import-fields select { padding: 0 8px; }

.schedule-import-scanning,
.schedule-import-empty {
  min-height: 150px;
  display: grid;
  place-items: center;
  align-content: center;
  gap: 9px;
  padding: 20px;
  border: 1px dashed var(--well-border);
  border-radius: 20px;
  background: color-mix(in srgb, var(--well-bg) 72%, transparent);
  color: var(--ui-muted);
  text-align: center;
}

.schedule-import-scanning svg,
.schedule-import-empty svg { width: 25px; color: var(--ui-accent-bright); }
.schedule-import-scanning b,
.schedule-import-empty b { color: var(--ui-text); font-size: 10px; }
.schedule-import-empty span { max-width: 250px; color: var(--ui-faint); font-size: 8px; line-height: 1.5; }
.schedule-import-scanning span { width: 74px; height: 2px; overflow: hidden; border-radius: 2px; background: var(--tray-bg); }
.schedule-import-scanning span::after { display: block; width: 26px; height: 100%; background: var(--ui-bar); animation: schedule-scan-line 1s ease-in-out infinite alternate; content: ""; }

@keyframes schedule-scan-line { to { transform: translateX(48px); } }

.schedule-import-card > .primary-action { margin: 1px 0 0; }
.schedule-import-card > .secondary-action { width: 100%; }

@media (max-width: 420px) {
  .schedule-import-card { padding: 20px; }
  .schedule-import-fields { grid-template-columns: 1fr 1fr; }
  .schedule-import-fields label:first-child { grid-column: 1 / -1; }
}

@media (max-width: 350px) {
  .schedule-title-actions { gap: 5px; }
  .schedule-title-actions button { padding: 0 9px; }
  .schedule-title-actions button > span { display: none; }
  .schedule-import-card { padding: 17px; }
  .schedule-import-preview { grid-template-columns: 66px minmax(0, 1fr); }
  .schedule-import-preview img { width: 66px; height: 66px; border-radius: 13px; }
}

@media (prefers-reduced-motion: reduce) {
  .schedule-import-preview > div > i::after,
  .schedule-import-scanning span::after { animation: none; }
}

/* Cabinet archive, Pro form composition and streamlined schedule slots. */
[data-create-field][hidden] { display: none !important; }

.editor-view-title > div { align-self: center; }
.editor-view-title #editorKicker { font-size: 12px; }

.stats-grid > :is(article, button) {
  position: relative;
  min-width: 0;
  min-height: 82px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 13px;
  border: 1px solid var(--plate-border);
  border-radius: 19px;
  background: var(--plate-soft-bg);
  color: inherit;
  text-align: left;
  box-shadow: inset 0 1px 0 var(--plate-highlight), inset 0 -1px 0 var(--plate-lowlight);
}

.stats-grid > button > svg {
  position: absolute;
  right: 10px;
  bottom: 12px;
  width: 14px;
  color: var(--ui-faint);
  transition: transform 220ms var(--ease-out-premium), color 180ms ease;
}

.stats-grid > button[aria-expanded="true"] > svg { transform: rotate(180deg); color: var(--ui-accent-bright); }
.stats-grid > button:active { transform: scale(.975); }

.cabinet-archive,
.create-fields-panel {
  margin-bottom: 12px;
  padding: 18px;
}

.cabinet-archive:not([hidden]) { animation: cabinet-section-in 280ms var(--ease-out-premium) both; }

@keyframes cabinet-section-in {
  from { opacity: 0; transform: translateY(-8px); clip-path: inset(0 0 24% 0 round 20px); }
  to { opacity: 1; transform: translateY(0); clip-path: inset(0 round 20px); }
}

.icon-action {
  width: 38px;
  height: 38px;
  display: grid;
  place-items: center;
  border: 1px solid var(--well-border);
  border-radius: 13px;
  background: var(--tray-bg);
  color: var(--ui-muted);
}

.icon-action svg { width: 16px; }
.archive-event-list { display: grid; gap: 7px; margin-top: 14px; }
.archive-event {
  min-height: 58px;
  display: grid;
  grid-template-columns: 4px minmax(0, 1fr) 18px;
  align-items: center;
  gap: 11px;
  padding: 10px 12px;
  border: 0;
  border-radius: 16px;
  background: var(--well-bg);
  color: var(--ui-text);
  text-align: left;
  box-shadow: inset 0 1px 0 var(--well-highlight), inset 0 -1px 0 var(--well-lowlight);
  animation: archive-item-in 260ms var(--ease-out-premium) both;
}

.archive-event > i:first-child { width: 4px; height: 26px; border-radius: 3px; background: var(--event-color); }
.archive-event span,
.archive-event b,
.archive-event small { min-width: 0; display: block; }
.archive-event b { overflow: hidden; color: var(--ui-ink); font-size: 10px; font-weight: 500; text-overflow: ellipsis; white-space: nowrap; }
.archive-event small { margin-top: 4px; color: var(--ui-faint); font-size: 8px; }
.archive-event > svg { width: 15px; color: var(--ui-faint); }
.archive-event:active { transform: scale(.985); }

@keyframes archive-item-in { from { opacity: 0; transform: translateY(5px); } }

.archive-empty {
  min-height: 112px;
  display: grid;
  place-items: center;
  align-content: center;
  gap: 8px;
  color: var(--ui-faint);
  text-align: center;
}
.archive-empty svg { width: 22px; }
.archive-empty p { margin: 0; font-size: 9px; }

.create-fields-panel > p {
  margin: 9px 0 14px;
  color: var(--ui-faint);
  font-size: 9px;
  line-height: 1.55;
}

.feature-badge {
  padding: 6px 8px;
  border-radius: 9px;
  background: var(--active-bg);
  color: var(--ui-active-ink);
  font-size: 7px;
}

.create-field-options {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 7px;
}

.create-field-options label { min-width: 0; }
.create-field-options input { position: absolute; opacity: 0; pointer-events: none; }
.create-field-options label > span {
  min-height: 48px;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 0 11px;
  border: 1px solid var(--well-border);
  border-radius: 15px;
  background: var(--tray-bg);
  color: var(--ui-faint);
  transition: background 180ms ease, color 180ms ease, transform 180ms var(--ease-out-premium);
}
.create-field-options svg { width: 15px; flex: 0 0 auto; }
.create-field-options b { overflow: hidden; font-size: 8px; font-weight: 500; text-overflow: ellipsis; white-space: nowrap; }
.create-field-options input:checked + span { background: var(--well-bg); color: var(--ui-text); box-shadow: inset 0 1px 0 var(--well-highlight); }
.create-field-options input:checked + span svg { color: var(--ui-accent-bright); }
.create-field-options label:active > span { transform: scale(.98); }
.create-fields-save { width: 100%; margin-top: 10px; }
.create-fields-panel.is-locked .create-field-options { opacity: .48; }
.create-fields-panel.is-locked .create-fields-save { border-color: var(--active-border); color: var(--ui-muted); }

.schedule-dialog-card { gap: 11px; }
.schedule-core-grid,
.schedule-time-grid { gap: 8px; }
.schedule-duration-presets { display: grid; grid-template-columns: repeat(4, 1fr); gap: 6px; }
.schedule-duration-presets button {
  min-width: 0;
  min-height: 38px;
  padding: 0 6px;
  border: 0;
  border-radius: 12px;
  background: var(--tray-bg);
  color: var(--ui-faint);
  font-size: 8px;
  box-shadow: inset 0 1px 0 var(--well-highlight);
  transition: background 180ms ease, color 180ms ease, transform 180ms var(--ease-out-premium);
}
.schedule-duration-presets button.active { background: var(--active-bg); color: var(--ui-active-ink); }
.schedule-duration-presets button:active { transform: scale(.96); }
.schedule-details { border-color: var(--well-border); border-radius: 17px; background: var(--tray-bg); }
.schedule-details .disclosure-trigger { min-height: 48px; }
.schedule-details .disclosure-inner { display: grid; gap: 11px; padding-top: 3px; }
.schedule-form-status { min-height: 14px; margin: -2px 2px 0; color: var(--ui-accent-bright); font-size: 8px; text-align: center; }

/* The blxxdy account and editor surfaces stay blood-toned without the bright red wash. */
:root[data-theme="blxxdy"] .event-editor-panel {
  background:
    radial-gradient(circle at 16% -8%, rgba(111, 18, 39, .12), transparent 38%),
    linear-gradient(148deg, rgba(22, 3, 9, .98), rgba(5, 0, 3, .99));
  border-color: rgba(171, 70, 89, .18);
  box-shadow: inset 0 1px 0 rgba(255, 210, 219, .035), inset 0 -1px 0 rgba(0, 0, 0, .25), 0 14px 28px rgba(3, 0, 1, .28);
}

:root[data-theme="blxxdy"] :is(.subscription-panel, .create-fields-panel, .cabinet-archive) {
  background:
    radial-gradient(circle at 12% 0%, rgba(111, 18, 39, .1), transparent 40%),
    linear-gradient(148deg, rgba(20, 3, 8, .97), rgba(5, 0, 2, .99));
  border-color: rgba(171, 70, 89, .17);
  box-shadow: inset 0 1px 0 rgba(255, 210, 219, .03), inset 0 -1px 0 rgba(0, 0, 0, .24), 0 12px 24px rgba(3, 0, 1, .24);
}

:root[data-theme="blxxdy"] .stats-grid > :is(article, button) {
  background:
    radial-gradient(circle at 14% 0%, rgba(105, 16, 35, .09), transparent 44%),
    linear-gradient(148deg, rgba(18, 2, 7, .96), rgba(5, 0, 2, .98));
  border-color: rgba(164, 66, 84, .16);
}

:root[data-theme="blxxdy"] :is(.subscription-actions .primary-action, .create-fields-save, .settings-actions .primary-action) {
  border-color: rgba(156, 62, 81, .18);
  background: linear-gradient(145deg, rgba(74, 11, 27, .95), rgba(25, 2, 9, .98));
  color: #c58b96;
  box-shadow: inset 0 1px 0 rgba(255, 211, 220, .035), 0 6px 8px rgba(2, 0, 1, .2);
}

:root[data-theme="blxxdy"] {
  --well-bg:
    radial-gradient(circle at 15% 0%, rgba(116, 20, 42, .1), transparent 43%),
    linear-gradient(145deg, rgba(35, 7, 17, .96), rgba(13, 1, 6, .98));
  --active-bg:
    radial-gradient(circle at 18% 0%, rgba(145, 36, 58, .12), transparent 44%),
    linear-gradient(145deg, rgba(57, 9, 23, .95), rgba(18, 1, 7, .98));
}

@media (max-width: 360px) {
  .create-field-options { grid-template-columns: 1fr; }
  .schedule-dialog-card { padding: 18px; }
  .schedule-duration-presets { gap: 5px; }
  .form-grid.two.schedule-core-grid { grid-template-columns: 1fr; }
}

@media (max-width: 420px) {
  .form-grid.two.schedule-core-grid,
  .form-grid.two.schedule-time-grid { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 360px) {
  .form-grid.two.schedule-core-grid { grid-template-columns: 1fr; }
}

@media (prefers-reduced-motion: reduce) {
  .cabinet-archive:not([hidden]),
  .archive-event { animation: none; }
}

/* Stable account geometry, a bottom-sheet archive and compact native date/time controls. */
[data-app-view="settings"],
[data-app-view="settings"] > :is(section, .stats-grid) {
  width: 100%;
  min-width: 0;
}

.subscription-panel { width: 100%; }
.subscription-heading { grid-template-columns: 42px minmax(0, 1fr) auto; }
.subscription-heading > div { min-width: 0; }
.subscription-heading h2 { overflow-wrap: anywhere; }

.cabinet-archive {
  inset: auto 0 0;
  width: min(100%, 680px);
  max-width: 100%;
  max-height: min(78dvh, 680px);
  margin: auto auto 0;
  overflow: visible;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--ui-text);
  animation: none !important;
}

.cabinet-archive::backdrop {
  background: rgba(2, 0, 1, .34);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  animation: backdrop-in 200ms ease-out both;
}

.cabinet-archive-card {
  max-height: min(78dvh, 680px);
  overflow: auto;
  padding: 10px 18px calc(22px + env(safe-area-inset-bottom));
  border: 1px solid var(--plate-border);
  border-bottom: 0;
  border-radius: 28px 28px 0 0;
  background: var(--plate-bg);
  box-shadow: inset 0 1px 0 var(--plate-highlight), 0 -22px 60px rgba(0, 0, 0, .42);
  backdrop-filter: blur(30px) saturate(1.14);
  -webkit-backdrop-filter: blur(30px) saturate(1.14);
  scrollbar-width: none;
  animation: archive-sheet-in 340ms var(--ease-glass) both;
}
.cabinet-archive-card::-webkit-scrollbar { display: none; }
.cabinet-archive.is-closing .cabinet-archive-card { animation: archive-sheet-out 180ms cubic-bezier(.4, 0, 1, 1) both; }
.cabinet-archive-handle { width: 38px; height: 4px; margin: 0 auto 14px; border-radius: 3px; background: var(--ui-line); }
.cabinet-archive .section-heading { position: sticky; z-index: 2; top: -10px; margin: 0 -2px; padding: 8px 2px 10px; background: color-mix(in srgb, var(--plate-bg) 92%, transparent); backdrop-filter: blur(18px); }
.cabinet-archive .archive-event-list { max-height: calc(78dvh - 118px); overflow: auto; padding-bottom: 2px; scrollbar-width: none; }
.cabinet-archive .archive-event-list::-webkit-scrollbar { display: none; }

@keyframes archive-sheet-in { from { opacity: 0; transform: translateY(32px); } }
@keyframes archive-sheet-out { to { opacity: 0; transform: translateY(28px); } }

.schedule-dialog .form-grid > label,
.schedule-preferences-range > label { min-width: 0; }
.schedule-dialog select {
  width: 100%;
  padding-right: 36px;
  padding-left: 14px;
  text-align: left;
  text-align-last: left;
}
.schedule-dialog input[type="time"] {
  width: 100%;
  min-width: 0;
  padding: 0 12px;
  text-align: center;
  appearance: none;
  -webkit-appearance: none;
}
.schedule-dialog input[type="time"]::-webkit-date-and-time-value {
  min-height: 1.35em;
  margin: 0;
  text-align: center;
}
.schedule-dialog input[type="time"]::-webkit-calendar-picker-indicator { margin: 0; opacity: .62; }

/* Keep native iOS time pickers clickable while rendering their values on a stable center line. */
.native-time-shell {
  position: relative;
  width: 100%;
  min-width: 0;
  min-height: 52px;
  display: grid;
  place-items: center;
  overflow: hidden;
  border: 1px solid var(--well-border);
  border-radius: 17px;
  background: var(--well-bg);
  box-shadow: inset 0 1px 0 var(--well-highlight);
  transition: border-color 180ms ease, box-shadow 220ms ease, transform 160ms var(--ease-out-premium);
}

.native-time-shell input[type="time"],
.schedule-dialog .native-time-shell input[type="time"] {
  position: absolute;
  z-index: 2;
  inset: 0;
  width: 100%;
  height: 100%;
  min-height: 0;
  padding: 0;
  border: 0;
  border-radius: inherit;
  background: transparent;
  color: transparent;
  opacity: .001;
  cursor: pointer;
}

/* WebKit can otherwise leave only a tiny invisible time-picker hit area. */
.native-time-shell input[type="time"]::-webkit-calendar-picker-indicator {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  margin: 0;
  opacity: 0;
  cursor: pointer;
}

.native-time-shell output {
  position: relative;
  z-index: 1;
  display: block;
  padding-right: 18px;
  color: var(--ui-text);
  font-size: 14px;
  font-weight: 500;
  line-height: 1;
  text-align: center;
  pointer-events: none;
}

.native-time-shell > svg {
  position: absolute;
  z-index: 1;
  top: 50%;
  right: 12px;
  width: 16px;
  height: 16px;
  color: var(--ui-muted);
  transform: translateY(-50%);
  pointer-events: none;
}

.native-time-shell:focus-within {
  border-color: color-mix(in srgb, var(--ui-accent-bright) 42%, var(--well-border));
  box-shadow: inset 0 1px 0 var(--well-highlight), 0 0 0 3px var(--ui-focus);
}

.navigation-priority .select-shell {
  min-height: 50px;
}

.navigation-priority .select-shell select {
  height: 50px;
  min-height: 50px;
}

/* Modal surfaces own their scroll; the page behind them stays completely still. */
html.dialog-open,
body.dialog-open {
  width: 100%;
  overflow: hidden;
  overscroll-behavior: none;
}

body.dialog-open {
  position: fixed;
  inset: var(--dialog-scroll-y, 0) 0 auto;
}

dialog[open] {
  overflow: hidden !important;
  overscroll-behavior: contain;
  touch-action: none;
}

dialog[open] > :is(
  .event-dialog-card,
  .schedule-dialog-card,
  .schedule-preferences-card,
  .schedule-import-card,
  .cabinet-archive-card,
  div
) {
  max-height: calc(100dvh - max(24px, env(safe-area-inset-top)) - max(24px, env(safe-area-inset-bottom)));
  overflow-x: hidden;
  overflow-y: auto !important;
  overscroll-behavior: contain;
  touch-action: pan-y;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
}

dialog[open] > :is(
  .event-dialog-card,
  .schedule-dialog-card,
  .schedule-preferences-card,
  .schedule-import-card,
  .cabinet-archive-card,
  div
)::-webkit-scrollbar {
  display: none;
}

/* iOS zooms focused controls below 16px even inside a Telegram webview. */
@supports (-webkit-touch-callout: none) {
  input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]),
  select,
  textarea {
    font-size: 16px !important;
  }
}
.schedule-preferences-range .date-shell { min-height: 52px; }
.schedule-preferences-range .date-shell input { height: 50px; min-height: 50px; }
.schedule-preferences-range .date-placeholder { left: 12px; right: 32px; overflow: hidden; font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.schedule-preferences-range .date-shell svg { right: 11px; width: 15px; height: 15px; }

/* Calendar view selector uses the same deep materials as the rest of each dark theme. */
:root:not([data-theme="porcelain"]) .calendar-modes {
  border-color: color-mix(in srgb, var(--ui-accent) 16%, transparent);
  background:
    radial-gradient(circle at 18% -20%, color-mix(in srgb, var(--ui-accent-deep) 12%, transparent), transparent 45%),
    linear-gradient(145deg, rgba(12, 2, 6, .96), rgba(3, 1, 2, .98));
  box-shadow: inset 0 1px 0 rgba(255, 220, 226, .025), inset 0 -1px 0 rgba(0, 0, 0, .34);
}
:root[data-theme="graphite"] .calendar-modes {
  background:
    radial-gradient(circle at 18% -20%, rgba(118, 55, 68, .08), transparent 46%),
    linear-gradient(145deg, rgba(13, 14, 16, .98), rgba(3, 4, 5, .99));
}
:root:not([data-theme="porcelain"]) .calendar-mode-lens {
  background:
    radial-gradient(circle at 20% 0%, color-mix(in srgb, var(--ui-accent) 10%, transparent), transparent 48%),
    linear-gradient(145deg, color-mix(in srgb, var(--ui-accent-deep) 27%, #130208), rgba(5, 1, 3, .98));
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--ui-accent) 12%, transparent), inset 0 1px 0 rgba(255, 220, 226, .025);
}
:root[data-theme="graphite"] .calendar-mode-lens {
  background: linear-gradient(145deg, rgba(38, 29, 33, .94), rgba(7, 8, 10, .99));
}
:root:not([data-theme="porcelain"]) .calendar-modes button.active { color: var(--ui-text); }

@media (max-width: 420px) {
  .subscription-heading { grid-template-columns: 38px minmax(0, 1fr) auto; }
  .schedule-dialog-card { padding: 19px; }
  .schedule-dialog input[type="time"] { padding: 0 8px; font-size: 10px; }
}

@media (max-width: 350px) {
  .subscription-heading { grid-template-columns: 36px minmax(0, 1fr); }
  .subscription-heading > strong { grid-column: 2; justify-self: start; margin-top: 3px; }
  .schedule-dialog-card { padding: 16px; }
  .schedule-time-grid { gap: 6px; }
}

@media (prefers-reduced-motion: reduce) {
  .cabinet-archive-card { animation: none; }
}

/* Final cascade for the finance/category additions and the deep blxxdy cabinet. */
.event-editor-panel .category-picker button:nth-child(7),
.event-editor-panel .category-picker button[data-custom-category] {
  grid-column: auto;
  width: auto;
  justify-self: stretch;
}

:root[data-theme="blxxdy"] [data-app-view="settings"] > section:not(.subscription-panel),
:root[data-theme="blxxdy"] [data-app-view="settings"] .stats-grid > :is(article, button) {
  border-color: rgba(160, 58, 77, .15);
  background:
    radial-gradient(circle at 13% -8%, rgba(105, 16, 36, .08), transparent 42%),
    linear-gradient(150deg, rgba(18, 3, 8, .985), rgba(4, 0, 2, .995));
  box-shadow: inset 0 1px 0 rgba(255, 218, 225, .026), inset 0 -1px 0 rgba(0, 0, 0, .34), 0 15px 32px rgba(2, 0, 1, .3);
}

:root[data-theme="blxxdy"] [data-app-view="settings"] :is(
  .create-field-options label > span,
  .navigation-visibility label,
  .navigation-priority .select-shell,
  .data-actions button,
  .export-date-shell,
  .range-presets,
  .theme-picker button,
  .offset-options button,
  .default-view select,
  .space-create input,
  .spaces-list article
) {
  border-color: rgba(148, 53, 71, .12);
  background: linear-gradient(148deg, rgba(21, 4, 10, .94), rgba(5, 0, 3, .98));
  box-shadow: inset 0 1px 0 rgba(255, 218, 225, .02), inset 0 -1px 0 rgba(0, 0, 0, .3);
}

/* Account material pass: every cabinet plate follows the subscription surface recipe. */
[data-app-view="settings"] > section:not(.subscription-panel):not(.stats-grid) {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  border-color: var(--plate-border);
  background-image: var(--plate-bg);
  background-size: 128% 128%;
  box-shadow:
    inset 0 1px 0 var(--plate-highlight),
    inset 0 -1px 0 var(--plate-lowlight),
    var(--plate-shadow);
  backdrop-filter: blur(24px) saturate(1.16);
  -webkit-backdrop-filter: blur(24px) saturate(1.16);
}

[data-app-view="settings"] .stats-grid > :is(article, button) {
  border-color: var(--plate-border);
  background-image: var(--plate-bg);
  background-size: 132% 132%;
  box-shadow:
    inset 0 1px 0 var(--plate-highlight),
    inset 0 -1px 0 var(--plate-lowlight),
    var(--plate-shadow);
}

:root[data-theme] [data-app-view="settings"] .stats-grid > :is(article, button) {
  border-color: var(--plate-border);
  background-image: var(--plate-bg);
  box-shadow:
    inset 0 1px 0 var(--plate-highlight),
    inset 0 -1px 0 var(--plate-lowlight),
    var(--plate-shadow);
}

/* Non-blood themes deliberately lift the Pro form composer above adjacent panels. */
:root[data-theme="wine"] [data-app-view="settings"] > .create-fields-panel {
  border-color: rgba(196, 124, 149, .27);
  background-image:
    radial-gradient(circle at 10% -12%, rgba(139, 64, 96, .2), transparent 38%),
    radial-gradient(circle at 92% 108%, rgba(67, 24, 48, .16), transparent 42%),
    linear-gradient(148deg, rgba(25, 7, 19, .99), rgba(7, 1, 6, .995));
  box-shadow: inset 0 1px 0 rgba(255, 228, 238, .055), inset 0 -1px 0 rgba(0, 0, 0, .34), 0 18px 40px rgba(3, 0, 2, .34);
}

:root[data-theme="graphite"] [data-app-view="settings"] > .create-fields-panel {
  border-color: rgba(176, 118, 131, .21);
  background-image:
    radial-gradient(circle at 10% -12%, rgba(118, 66, 78, .16), transparent 38%),
    radial-gradient(circle at 92% 108%, rgba(36, 40, 47, .18), transparent 42%),
    linear-gradient(148deg, rgba(17, 18, 22, .99), rgba(3, 4, 6, .995));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .045), inset 0 -1px 0 rgba(0, 0, 0, .4), 0 18px 40px rgba(0, 0, 0, .4);
}

:root[data-theme="porcelain"] [data-app-view="settings"] > .create-fields-panel {
  border-color: rgba(111, 20, 42, .22);
  background-image:
    radial-gradient(circle at 9% -10%, rgba(131, 24, 50, .105), transparent 40%),
    radial-gradient(circle at 94% 108%, rgba(168, 73, 96, .08), transparent 43%),
    linear-gradient(148deg, rgba(255, 254, 254, .995), rgba(240, 223, 230, .98));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .98), inset 0 -1px 0 rgba(84, 8, 27, .08), 0 18px 38px rgba(83, 10, 29, .13);
}

/* Wine stays LA Beauty-deep: near-black plum with low, restrained rose reflections. */
:root[data-theme="wine"] {
  --plate-bg:
    radial-gradient(circle at 11% -8%, rgba(91, 35, 63, .15), transparent 39%),
    linear-gradient(148deg, rgba(19, 6, 15, .985), rgba(6, 1, 5, .995));
  --plate-soft-bg:
    radial-gradient(circle at 13% -8%, rgba(83, 31, 58, .12), transparent 41%),
    linear-gradient(148deg, rgba(16, 5, 13, .98), rgba(5, 1, 4, .99));
  --plate-border: rgba(190, 121, 145, .17);
  --plate-highlight: rgba(255, 232, 240, .038);
  --plate-lowlight: rgba(0, 0, 0, .38);
  --plate-shadow: 0 17px 38px rgba(2, 0, 2, .34);
  --well-bg:
    radial-gradient(circle at 13% -5%, rgba(101, 43, 70, .13), transparent 42%),
    linear-gradient(148deg, rgba(30, 12, 24, .97), rgba(10, 2, 8, .99));
  --well-border: rgba(190, 121, 145, .18);
  --well-highlight: rgba(255, 231, 240, .04);
  --well-lowlight: rgba(0, 0, 0, .34);
  --tray-bg: linear-gradient(148deg, rgba(13, 3, 10, .99), rgba(4, 0, 3, .995));
  --active-bg:
    radial-gradient(circle at 15% -7%, rgba(133, 58, 88, .15), transparent 44%),
    linear-gradient(148deg, rgba(42, 15, 31, .97), rgba(12, 2, 9, .99));
  --active-border: rgba(199, 128, 151, .26);
}

:root[data-theme="wine"] body {
  background:
    radial-gradient(circle at 18% 18%, rgba(83, 26, 56, .07), transparent 31%),
    radial-gradient(circle at 84% 72%, rgba(54, 15, 37, .07), transparent 38%),
    linear-gradient(180deg, #060306 0%, #0a0509 42%, #0f080d 72%, #050205 100%);
}

/* Graphite is black mineral glass with a quiet iron-red undertone, never smoky grey. */
:root[data-theme="graphite"] {
  --plate-bg:
    radial-gradient(circle at 11% -8%, rgba(153, 158, 166, .055), transparent 39%),
    radial-gradient(circle at 92% 108%, rgba(95, 42, 54, .07), transparent 43%),
    linear-gradient(148deg, rgba(15, 16, 19, .99), rgba(3, 4, 5, .997));
  --plate-soft-bg:
    radial-gradient(circle at 13% -8%, rgba(145, 150, 158, .04), transparent 41%),
    linear-gradient(148deg, rgba(13, 14, 17, .985), rgba(3, 4, 5, .995));
  --plate-border: rgba(198, 202, 209, .105);
  --plate-highlight: rgba(255, 255, 255, .032);
  --plate-lowlight: rgba(0, 0, 0, .44);
  --plate-shadow: 0 17px 38px rgba(0, 0, 0, .42);
  --well-bg:
    radial-gradient(circle at 13% -5%, rgba(183, 188, 196, .05), transparent 42%),
    linear-gradient(148deg, rgba(26, 27, 31, .98), rgba(8, 9, 11, .995));
  --well-border: rgba(203, 207, 214, .105);
  --well-highlight: rgba(255, 255, 255, .035);
  --well-lowlight: rgba(0, 0, 0, .4);
  --tray-bg: linear-gradient(148deg, rgba(9, 10, 12, .995), rgba(2, 3, 4, .998));
  --active-bg:
    radial-gradient(circle at 15% -7%, rgba(127, 67, 79, .115), transparent 44%),
    linear-gradient(148deg, rgba(31, 27, 30, .985), rgba(8, 8, 10, .997));
  --active-border: rgba(164, 106, 118, .2);
}

:root[data-theme="graphite"] body {
  background:
    radial-gradient(circle at 17% 18%, rgba(171, 176, 184, .035), transparent 30%),
    radial-gradient(circle at 84% 72%, rgba(92, 39, 50, .04), transparent 36%),
    linear-gradient(180deg, #020304 0%, #050608 42%, #08090b 72%, #020304 100%);
}

:root[data-theme="wine"] :is(.primary-action, .export-result a),
:root[data-theme="graphite"] :is(.primary-action, .export-result a) {
  border: 1px solid var(--active-border);
  background: var(--active-bg);
  color: var(--ui-active-ink);
  box-shadow: inset 0 1px 0 var(--well-highlight), inset 0 -1px 0 var(--well-lowlight), 0 11px 24px rgba(0, 0, 0, .3);
}

:root[data-theme="wine"] :is(
  .secondary-action, .text-action, .icon-action, .simple-mode-action,
  .calendar-modes, .calendar-filters button, .period-actions button,
  .schedule-week-actions button, .schedule-duration-presets button,
  .schedule-photo-action, .schedule-add-action, .schedule-parameters-action,
  .data-actions button, .range-presets, .offset-options button,
  .theme-picker button, .navigation-visibility label, .create-field-options label > span
),
:root[data-theme="graphite"] :is(
  .secondary-action, .text-action, .icon-action, .simple-mode-action,
  .calendar-modes, .calendar-filters button, .period-actions button,
  .schedule-week-actions button, .schedule-duration-presets button,
  .schedule-photo-action, .schedule-add-action, .schedule-parameters-action,
  .data-actions button, .range-presets, .offset-options button,
  .theme-picker button, .navigation-visibility label, .create-field-options label > span
) {
  border-color: var(--well-border);
  background: var(--tray-bg);
  box-shadow: inset 0 1px 0 var(--well-highlight), inset 0 -1px 0 var(--well-lowlight), 0 7px 18px rgba(0, 0, 0, .18);
}

:root[data-theme="wine"] :is(.theme-picker button.active, .offset-options button.active, .range-presets button.active, .calendar-filters button.active, .simple-mode-action.active, .create-field-options input:checked + span),
:root[data-theme="graphite"] :is(.theme-picker button.active, .offset-options button.active, .range-presets button.active, .calendar-filters button.active, .simple-mode-action.active, .create-field-options input:checked + span) {
  border-color: var(--active-border);
  background: var(--active-bg);
  box-shadow: inset 0 1px 0 var(--well-highlight), inset 0 -1px 0 var(--well-lowlight), 0 9px 22px rgba(0, 0, 0, .24);
}

/* Archive is a modal cabinet surface, never a pale sheet in dark themes. */
:root[data-theme="wine"] .cabinet-archive-card {
  border-color: rgba(190, 121, 145, .18);
  background:
    radial-gradient(circle at 12% -7%, rgba(91, 35, 63, .14), transparent 40%),
    linear-gradient(155deg, rgba(18, 5, 14, .998), rgba(4, 0, 3, .998));
  box-shadow: inset 0 1px 0 rgba(255, 232, 240, .035), 0 -24px 68px rgba(2, 0, 2, .58);
}

:root[data-theme="graphite"] .cabinet-archive-card {
  border-color: rgba(198, 202, 209, .105);
  background:
    radial-gradient(circle at 12% -7%, rgba(161, 166, 174, .045), transparent 40%),
    radial-gradient(circle at 90% 105%, rgba(94, 40, 52, .055), transparent 42%),
    linear-gradient(155deg, rgba(13, 14, 17, .999), rgba(2, 3, 4, .999));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .03), 0 -24px 68px rgba(0, 0, 0, .62);
}

:root[data-theme="wine"] .cabinet-archive .section-heading { background: rgba(13, 3, 10, .94); }
:root[data-theme="graphite"] .cabinet-archive .section-heading { background: rgba(8, 9, 11, .95); }

:root[data-theme="wine"] .archive-event {
  background: linear-gradient(148deg, rgba(29, 10, 23, .985), rgba(8, 1, 6, .995));
  box-shadow: inset 0 1px 0 rgba(255, 230, 239, .035), inset 0 -1px 0 rgba(0, 0, 0, .34), 0 8px 18px rgba(2, 0, 2, .22);
}

:root[data-theme="graphite"] .archive-event {
  background: linear-gradient(148deg, rgba(23, 24, 28, .99), rgba(6, 7, 8, .997));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .03), inset 0 -1px 0 rgba(0, 0, 0, .4), 0 8px 18px rgba(0, 0, 0, .3);
}

:root[data-theme="wine"] .archive-empty,
:root[data-theme="graphite"] .archive-empty {
  min-height: 132px;
  border: 1px solid var(--well-border);
  border-radius: 18px;
  background: var(--tray-bg);
  box-shadow: inset 0 1px 0 var(--well-highlight), inset 0 -1px 0 var(--well-lowlight);
}

/* Final interaction and geometry polish. */
.pulse-strip { grid-template-columns: minmax(0, .92fr) minmax(0, .92fr) minmax(0, 1.16fr); }
.pulse-strip div { padding-inline: 8px; }
.pulse-strip div:last-child { padding-inline: 7px; }
.pulse-strip strong { width: 100%; font-size: clamp(14px, 4.4vw, 18px); }
.pulse-strip span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.stats-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.stats-grid > :is(article, button) { border-radius: 20px; }
.stats-archive-action.active,
.stats-archive-action[aria-expanded="true"] {
  border-color: var(--plate-border);
  background-image: var(--plate-bg);
  box-shadow: inset 0 1px 0 var(--plate-highlight), inset 0 -1px 0 var(--plate-lowlight), var(--plate-shadow);
}
.cabinet-archive .section-heading,
:root[data-theme="wine"] .cabinet-archive .section-heading,
:root[data-theme="graphite"] .cabinet-archive .section-heading {
  position: relative;
  top: auto;
  background: transparent;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}

.create-fields-panel::before {
  position: absolute;
  z-index: 4;
  inset: 0;
  border-radius: inherit;
  box-shadow: inset 0 0 0 1px var(--active-border), inset 0 2px 0 color-mix(in srgb, var(--ui-accent-bright) 24%, transparent);
  opacity: .72;
  pointer-events: none;
  content: "";
}
.create-fields-panel::after {
  inset: 0;
  background: linear-gradient(90deg, color-mix(in srgb, var(--ui-accent-deep) 8%, transparent), color-mix(in srgb, var(--ui-accent) 9%, transparent), color-mix(in srgb, var(--ui-accent-deep) 8%, transparent));
  animation: none;
}

.simple-mode-action.is-switching svg { animation: simple-mode-icon 260ms cubic-bezier(.23,1,.32,1) both; }
@keyframes simple-mode-icon { 50% { opacity: .35; transform: rotate(-18deg) scale(.9); filter: blur(2px); } }

.default-view { display: grid; grid-template-columns: 1fr; gap: 9px; margin: 17px 0 16px; }
.default-view-options {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 4px;
  padding: 4px;
  border: 1px solid var(--well-border);
  border-radius: 17px;
  background: var(--tray-bg);
  box-shadow: inset 0 1px 0 var(--well-highlight);
}
.default-view-options button {
  min-width: 0;
  min-height: 48px;
  display: grid;
  place-items: center;
  align-content: center;
  gap: 4px;
  padding: 4px 2px;
  border: 0;
  border-radius: 13px;
  background: transparent;
  color: var(--ui-faint);
  transition: color 180ms ease, background 220ms ease, box-shadow 220ms ease, transform 100ms var(--ease-out-premium);
}
.default-view-options button svg { width: 14px; height: 14px; }
.default-view-options button b { overflow: hidden; width: 100%; font-size: 7px; font-weight: 500; text-align: center; text-overflow: ellipsis; white-space: nowrap; }
.default-view-options button.active { background: var(--active-bg); color: var(--ui-active-ink); box-shadow: inset 0 0 0 1px var(--active-border), inset 0 1px 0 var(--plate-highlight); }
.default-view-options button:active { transform: scale(.96); }
.default-view-native { position: absolute !important; width: 1px !important; height: 1px !important; min-height: 0 !important; opacity: 0; pointer-events: none; }

.schedule-core-grid select {
  min-width: 0;
  padding-right: 30px;
  padding-left: 12px;
  overflow: hidden;
  font-size: 13px !important;
  font-weight: 500;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.schedule-core-grid label > span { font-size: 9px; }

@media (max-width: 360px) {
  .pulse-strip div { padding-inline: 6px; }
  .pulse-strip span { font-size: 8px; }
  .default-view-options button b { font-size: 6.5px; }
  .schedule-core-grid select { font-size: 12px !important; }
}

@media (prefers-reduced-motion: reduce) {
  .simple-mode-action.is-switching svg { animation: none; }
}

/* Telegram's iOS webview is paint-bound: preserve the material while avoiding
   full-screen blur recomposition and off-screen layout work on every frame. */
.performance-mode body,
.performance-mode body::before,
.performance-mode body::after,
.performance-mode .premium-surface::after,
.performance-mode .next-event::after,
.performance-mode .next-event-orbit,
.performance-mode .subscription-orbit {
  animation: none !important;
}

.performance-mode :is(
  .calendar-workspace, .selected-events, .settings-panel, .settings-intro,
  .account-panel, .data-panel, .spaces-panel, .expense-overview,
  .week-load, .next-event, .schedule-board, .schedule-insights,
  .create-fields-panel, .subscription-card
) {
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

.performance-mode .app-view > section:not(:first-child) {
  content-visibility: auto;
  contain-intrinsic-size: auto 280px;
}

.performance-mode .app-view.view-enter,
.performance-mode .app-view.view-enter.view-enter-active,
.performance-mode .calendar-canvas.canvas-exit,
.performance-mode .calendar-canvas.canvas-enter,
.performance-mode .calendar-canvas.canvas-enter.canvas-enter-active,
.performance-mode .card-reveal {
  filter: none !important;
}

.performance-mode .bottom-nav {
  -webkit-backdrop-filter: blur(12px) saturate(1.08);
  backdrop-filter: blur(12px) saturate(1.08);
}

.app-paused *,
.app-paused *::before,
.app-paused *::after {
  animation-play-state: paused !important;
}

/* Account composition: one continuous stats tray and an edge-to-edge form. */
[data-app-view="settings"] > .stats-grid {
  gap: 0;
  padding: 4px;
  border: 1px solid var(--plate-border);
  border-radius: 24px;
  background-image: var(--plate-bg);
  box-shadow: inset 0 1px 0 var(--plate-highlight), inset 0 -1px 0 var(--plate-lowlight), var(--plate-shadow);
}
:root[data-theme] [data-app-view="settings"] .stats-grid > :is(article, button) {
  border: 0;
  background: transparent;
  box-shadow: none;
}
[data-app-view="settings"] .stats-grid > button::before {
  position: absolute;
  inset: 14px auto 14px 0;
  width: 1px;
  background: var(--well-border);
  content: "";
}

[data-app-view="settings"] > .create-fields-panel {
  width: calc(100% + 32px);
  margin-inline: -16px;
  padding-inline: 34px;
  border-right: 0;
  border-left: 0;
  border-radius: 30px;
}
[data-app-view="settings"] > .create-fields-panel::before {
  background: linear-gradient(var(--active-border), var(--active-border)) top / 100% 1px no-repeat,
              linear-gradient(var(--active-border), var(--active-border)) bottom / 100% 1px no-repeat;
  box-shadow: none;
}

/* Final state, sheet and motion system. */
.cabinet-archive {
  overflow: hidden !important;
  border-radius: 30px 30px 0 0;
  background: transparent !important;
}
.cabinet-archive-card {
  overflow: hidden auto;
  border-radius: 30px 30px 0 0;
  background-clip: padding-box;
  clip-path: inset(0 round 30px 30px 0 0);
}
.cabinet-archive::backdrop {
  background: rgba(2, 0, 1, .22);
  -webkit-backdrop-filter: blur(3px);
  backdrop-filter: blur(3px);
}

.pulse-strip {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.pulse-strip div,
.pulse-strip div:last-child {
  min-width: 0;
  padding-inline: 7px;
}
.pulse-strip strong { font-size: clamp(13px, 4vw, 18px); }
.pulse-strip span {
  min-height: 2.3em;
  overflow: visible;
  line-height: 1.15;
  text-overflow: clip;
  white-space: normal;
}

:root[data-theme] :is(
  .calendar-filters button.active, .offset-options button.active,
  .mini-offsets button.active, .range-presets button.active,
  .schedule-week-strip button.active, .schedule-duration-presets button.active,
  .schedule-pattern-options button.active, .simple-mode-action.active,
  .category-picker button.active, .theme-picker button.active,
  .default-view-options button.active
) {
  border-color: color-mix(in srgb, var(--ui-accent-bright) 34%, var(--active-border));
  background: var(--active-bg);
  color: var(--ui-active-ink);
  box-shadow:
    inset 0 0 0 1px color-mix(in srgb, var(--ui-accent-bright) 13%, transparent),
    inset 0 1px 0 color-mix(in srgb, var(--ui-accent-bright) 15%, transparent),
    0 6px 14px color-mix(in srgb, var(--ui-accent-deep) 18%, transparent);
}
:root[data-theme="blxxdy"] :is(
  .calendar-filters button.active, .offset-options button.active,
  .mini-offsets button.active, .range-presets button.active,
  .schedule-week-strip button.active, .schedule-duration-presets button.active,
  .schedule-pattern-options button.active, .simple-mode-action.active,
  .category-picker button.active, .theme-picker button.active,
  .default-view-options button.active
) {
  background:
    radial-gradient(circle at 22% 0%, rgba(151, 47, 67, .2), transparent 46%),
    linear-gradient(145deg, rgba(83, 14, 29, .92), rgba(24, 2, 8, .98));
  color: #efd4da;
}

:root[data-theme="porcelain"] .bottom-nav {
  border-color: rgba(112, 22, 43, .13);
  background: rgba(255, 255, 255, .94);
  box-shadow: inset 0 1px 0 #fff, 0 12px 28px rgba(82, 9, 27, .1);
}
:root[data-theme="porcelain"] .bottom-nav-lens {
  border-color: rgba(112, 22, 43, .14);
  background: linear-gradient(145deg, rgba(134, 26, 51, .13), rgba(134, 26, 51, .07));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .8);
}
:root[data-theme="porcelain"] .bottom-nav button { color: #8b6971; }
:root[data-theme="porcelain"] .bottom-nav button.active { color: #5f1427; }

dialog[open] > :is(
  .event-dialog-card, .schedule-dialog-card, .schedule-preferences-card,
  .schedule-import-card, .cabinet-archive-card, div
) {
  transform-origin: 50% 100%;
  animation: modal-materialize 280ms cubic-bezier(.32,.72,0,1) both;
}
@keyframes modal-materialize {
  from { opacity: 0; transform: translateY(14px) scale(.975); filter: blur(5px); }
  to { opacity: 1; transform: translateY(0) scale(1); filter: blur(0); }
}
.event-editor-panel.editor-materialize {
  animation: editor-materialize 300ms cubic-bezier(.23,1,.32,1) both;
}
@keyframes editor-materialize {
  from { opacity: .35; transform: translateY(10px) scale(.987); filter: blur(5px); }
  to { opacity: 1; transform: translateY(0) scale(1); filter: blur(0); }
}

@media (prefers-reduced-motion: reduce) {
  dialog[open] > :is(.event-dialog-card, .schedule-dialog-card, .schedule-preferences-card, .schedule-import-card, .cabinet-archive-card, div),
  .event-editor-panel.editor-materialize { animation: none !important; }
}

/* Final mobile state layer. Keep this last: legacy theme rules must not flatten selection. */
:root[data-theme] :is(.offset-options button.active, .mini-offsets button.active) {
  border-color: color-mix(in srgb, var(--ui-accent-bright) 44%, var(--active-border));
  background-image: radial-gradient(circle at 18% 0%, color-mix(in srgb, var(--ui-accent-bright) 16%, transparent), transparent 46%), var(--active-bg);
  color: var(--ui-active-ink);
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--ui-accent-bright) 12%, transparent), inset 0 1px 0 var(--well-highlight);
}
:root[data-theme] .create-field-options input:checked + span {
  border-color: color-mix(in srgb, var(--ui-accent-bright) 38%, var(--active-border));
  background-image: radial-gradient(circle at 12% 0%, color-mix(in srgb, var(--ui-accent-bright) 13%, transparent), transparent 44%), var(--active-bg);
  color: var(--ui-active-ink);
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--ui-accent-bright) 10%, transparent), inset 0 1px 0 var(--well-highlight);
}
:root[data-theme="blxxdy"] :is(.offset-options button.active, .mini-offsets button.active, .create-field-options input:checked + span) {
  border-color: rgba(199,83,105,.42);
  background-image: radial-gradient(circle at 16% 0%, rgba(189,63,88,.24), transparent 45%), linear-gradient(148deg, rgba(96,18,39,.99), rgba(24,2,9,.995));
  color: #ecd2d8;
  box-shadow: inset 0 1px 0 rgba(231,124,145,.14), 0 7px 16px rgba(27,0,7,.28);
}
:root[data-theme="porcelain"] :is(.offset-options button.active, .mini-offsets button.active, .create-field-options input:checked + span) {
  border-color: rgba(102,14,35,.42);
  background-image: radial-gradient(circle at 20% 0%, rgba(181,69,94,.34), transparent 48%), linear-gradient(145deg, #7b1d35, #4f1022);
  color: #fff7f9;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.22), 0 6px 15px rgba(87,13,31,.14);
}
:root[data-theme="wine"] :is(.offset-options button.active, .mini-offsets button.active, .create-field-options input:checked + span) {
  border-color: rgba(190,126,153,.28);
  background-image: radial-gradient(circle at 18% 0%, rgba(196,116,148,.16), transparent 48%), linear-gradient(148deg, rgba(62,29,49,.98), rgba(18,7,15,.995));
  color: #f0dbe4;
}
:root[data-theme="graphite"] :is(.offset-options button.active, .mini-offsets button.active, .create-field-options input:checked + span) {
  border-color: rgba(143,74,88,.3);
  background-image: radial-gradient(circle at 18% 0%, rgba(139,67,82,.15), transparent 48%), linear-gradient(148deg, rgba(42,40,44,.99), rgba(11,11,13,.995));
  color: #eee9eb;
}
:root[data-theme] .create-field-options input:checked + span svg,
:root[data-theme] .create-field-options input:checked + span b { color: inherit; }

:is(.calendar-workspace,.next-event,.expense-overview,.week-load,.selected-events,.schedule-board,.schedule-tools,.schedule-insights article,.event-editor-panel,.template-strip,.subscription-panel,.create-fields-panel,.appearance-panel,.settings-intro,.settings-panel,.navigation-settings,.data-panel,.spaces-panel,.account-panel,.event-dialog-card,.schedule-dialog-card,.schedule-preferences-card,.schedule-import-card) {
  overflow: hidden;
  background-clip: padding-box;
  isolation: isolate;
}
:is(.calendar-workspace,.next-event,.expense-overview,.week-load,.selected-events,.schedule-board,.schedule-tools,.event-editor-panel,.template-strip,.subscription-panel,.create-fields-panel,.appearance-panel,.settings-intro,.settings-panel,.navigation-settings,.data-panel,.spaces-panel,.account-panel)::before,
:is(.calendar-workspace,.next-event,.expense-overview,.week-load,.selected-events,.schedule-board,.schedule-tools,.event-editor-panel,.template-strip,.subscription-panel,.create-fields-panel,.appearance-panel,.settings-intro,.settings-panel,.navigation-settings,.data-panel,.spaces-panel,.account-panel)::after { border-radius: inherit; }

:root[data-theme="porcelain"] .selected-events { background-image: linear-gradient(148deg, rgba(255,255,255,.995), rgba(248,240,244,.98)); }
:root[data-theme="porcelain"] .selected-events :is(.events-empty,.event-item) {
  border-color: rgba(112,22,43,.11);
  background: rgba(255,255,255,.92);
  color: #5f2634;
  box-shadow: inset 0 1px 0 #fff;
}

.cabinet-archive::backdrop {
  opacity: var(--archive-backdrop,0);
  transition: opacity 220ms ease, backdrop-filter 220ms ease, -webkit-backdrop-filter 220ms ease;
}
.cabinet-archive.is-presented::backdrop { opacity: var(--archive-backdrop,1); }
.cabinet-archive.is-closing::backdrop { opacity:0; backdrop-filter:blur(0); -webkit-backdrop-filter:blur(0); }
dialog.cabinet-archive[open] > .cabinet-archive-card {
  animation: none !important;
  transform: translate3d(0,calc(28px + var(--archive-drag-y,0px)),0);
  opacity:.72;
  transition: transform 280ms cubic-bezier(.22,1,.36,1), opacity 220ms ease;
  will-change: transform;
}
dialog.cabinet-archive.is-presented[open] > .cabinet-archive-card { transform:translate3d(0,var(--archive-drag-y,0px),0); opacity:1; }
dialog.cabinet-archive.is-dragging[open] > .cabinet-archive-card { transition:none; }
dialog.cabinet-archive.is-closing[open] > .cabinet-archive-card { transition:transform 240ms cubic-bezier(.4,0,1,1),opacity 190ms ease; opacity:.82; }
.cabinet-archive-card { touch-action:pan-y; }
.cabinet-archive-handle,.cabinet-archive .section-heading { cursor:grab; touch-action:none; user-select:none; }
.cabinet-archive.is-dragging :is(.cabinet-archive-handle,.section-heading) { cursor:grabbing; }

/* Compact timetable: one continuous chronological rail, editing only when armed. */
.schedule-title-actions { gap:5px; }
.schedule-edit-action {
  min-height:42px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  padding:0 11px;
  border:1px solid var(--well-border);
  border-radius:14px;
  background:var(--tray-bg);
  color:var(--ui-muted);
  font-size:9px;
  box-shadow:inset 0 1px 0 var(--well-highlight);
}
.schedule-edit-action svg { width:15px; height:15px; }
.schedule-edit-action.active { border-color:var(--active-border); background:var(--active-bg); color:var(--ui-active-ink); }
.schedule-board { padding-bottom:14px; }
.schedule-day-timeline { gap:2px; overflow:hidden; border-radius:15px; background:color-mix(in srgb,var(--tray-bg) 74%,transparent); }
.schedule-entry-card {
  min-height:64px;
  grid-template-columns:52px 3px minmax(0,1fr) 28px;
  gap:11px;
  padding:9px 11px;
  border:0;
  border-radius:4px;
  background:color-mix(in srgb,var(--well-bg) 88%,transparent);
  box-shadow:none;
  opacity:1;
  transform:none;
  animation:schedule-entry-fade 220ms ease-out both;
  animation-delay:calc(var(--entry-index) * 24ms);
  cursor:default;
}
.schedule-entry-card:first-child { border-radius:15px 15px 4px 4px; }
.schedule-entry-card:last-child { border-radius:4px 4px 15px 15px; }
.schedule-entry-card:only-child { border-radius:15px; }
.schedule-entry-card:disabled { opacity:1; color:inherit; }
.schedule-entry-card.is-editable { cursor:pointer; }
.schedule-entry-card.is-editable:active { transform:scale(.992); }
@keyframes schedule-entry-fade { from { opacity:0; clip-path:inset(0 0 18% 0); } to { opacity:1; clip-path:inset(0); } }
.schedule-entry-time { justify-items:end; gap:3px; color:var(--ui-text); }
.schedule-entry-time b { font-size:10px; font-weight:500; line-height:1.1; }
.schedule-entry-time b:last-child { color:var(--ui-muted); }
.schedule-entry-rail { align-self:stretch; width:3px; min-height:34px; border-radius:999px; background:var(--schedule-color); box-shadow:0 0 10px color-mix(in srgb,var(--schedule-color) 22%,transparent); }
.schedule-entry-copy strong { margin:0; font-size:12px; font-weight:600; }
.schedule-entry-copy > span { margin-top:3px; font-size:8px; }
.schedule-entry-copy em { margin-top:3px; font-size:8px; -webkit-line-clamp:1; }
.schedule-entry-edit { width:28px; height:28px; display:grid; place-items:center; border-radius:10px; color:transparent; background:transparent; transition:color 160ms ease,background 180ms ease,transform 180ms ease; }
.schedule-entry-edit svg { width:13px; height:13px; }
.schedule-entry-card.is-editable .schedule-entry-edit { color:var(--ui-accent-bright); background:color-mix(in srgb,var(--schedule-color) 11%,var(--tray-bg)); }
.schedule-insights { grid-template-columns:repeat(2,minmax(0,1fr)); }
.schedule-insights article { min-height:70px; }
.schedule-dialog[open] { inset:0; margin:auto; }
.schedule-dialog-card { width:100%; margin:auto; }
[data-app-view="schedule"].view-exit .schedule-entry-card { animation:none; }

@media (max-width:420px) {
  .schedule-title-actions :is(.schedule-edit-action,.schedule-parameters-action,.schedule-photo-action,.schedule-add-action) { width:38px; min-width:38px; padding:0; }
  .schedule-title-actions :is(.schedule-edit-action,.schedule-parameters-action,.schedule-photo-action,.schedule-add-action) > span,
  .schedule-title-actions .schedule-photo-action > b { display:none; }
}

@media (prefers-reduced-motion:reduce) {
  dialog.cabinet-archive[open] > .cabinet-archive-card,.cabinet-archive::backdrop,.schedule-entry-card { animation:none!important; transition-duration:1ms!important; }
}

/* 2026-08-22 final geometry and motion pass. */
:root[data-theme] :is(
  .calendar-workspace,.next-event,.expense-overview,.selected-events,
  .schedule-board,.schedule-tools,.schedule-insights article,.event-editor-panel,
  .template-strip,.subscription-panel,.create-fields-panel,.appearance-panel,
  .settings-intro,.settings-panel,.navigation-settings,.data-panel,.spaces-panel,
  .account-panel,.event-dialog-card,.schedule-dialog-card,.schedule-preferences-card,
  .schedule-import-card,.pulse-strip,.stats-grid,.cabinet-archive-card
) {
  contain: paint;
  background-clip: padding-box;
}
:root[data-theme] :is(
  .calendar-workspace,.next-event,.expense-overview,.selected-events,
  .schedule-board,.schedule-tools,.event-editor-panel,.template-strip,
  .subscription-panel,.create-fields-panel,.appearance-panel,.settings-intro,
  .settings-panel,.navigation-settings,.data-panel,.spaces-panel,.account-panel
)::before,
:root[data-theme] :is(
  .calendar-workspace,.next-event,.expense-overview,.selected-events,
  .schedule-board,.schedule-tools,.event-editor-panel,.template-strip,
  .subscription-panel,.create-fields-panel,.appearance-panel,.settings-intro,
  .settings-panel,.navigation-settings,.data-panel,.spaces-panel,.account-panel
)::after {
  overflow: hidden;
  border-radius: inherit;
  background-clip: padding-box;
}
:root[data-theme] :is(button,input,select,textarea,.select-shell,.date-shell,.native-time-shell,.feed-result,.export-result) {
  background-clip: padding-box;
}

/* Sections enter through opacity and movement, never through a hard clipping edge. */
.reveal-observed {
  clip-path: none;
  opacity: 0;
  transform: translateY(16px);
  filter: none;
  transition: opacity 360ms cubic-bezier(.16,1,.3,1), transform 480ms cubic-bezier(.16,1,.3,1);
}
.reveal-observed.is-revealed { clip-path:none; opacity:1; transform:translateY(0); }
.performance-mode [data-app-view="overview"] > section,
.performance-mode [data-app-view="schedule"] > section {
  content-visibility: visible;
  contain-intrinsic-size: none;
}

/* The active calendar mode remains legible even while its moving lens is recalculated. */
.calendar-mode-lens { z-index:0; }
.calendar-modes button { position:relative; z-index:1; }
:root[data-theme] .calendar-modes button.active {
  color: var(--ui-active-ink);
  background: color-mix(in srgb, var(--ui-accent-deep) 24%, transparent);
}
:root[data-theme="porcelain"] .calendar-modes button.active {
  color:#fff9fb;
  background:rgba(112,22,43,.78);
}
:root[data-theme="porcelain"] .month-day.selected strong { color:#fff; }

/* White is clean white glass with deliberate blood-red commands. */
:root[data-theme="porcelain"] .event-search {
  border-color:rgba(112,22,43,.13);
  background:#fff;
  box-shadow:inset 0 1px 0 #fff,0 8px 20px rgba(82,9,27,.055);
}
:root[data-theme="porcelain"] .event-search input { color:#421923; }
:root[data-theme="porcelain"] .event-search input::placeholder { color:#9a7780; }
:root[data-theme="porcelain"] .event-search svg { color:#7b263b; }
:root[data-theme="porcelain"] .theme-picker button[data-theme-choice="porcelain"].active :is(strong,small,svg) { color:#fff9fb; }
:root[data-theme="porcelain"] :is(.space-create button,.feed-result button,.create-fields-save) {
  border-color:rgba(91,11,30,.32);
  background:linear-gradient(145deg,#861a33,#4f091b);
  color:#fff9fb;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.18),0 8px 18px rgba(82,9,27,.13);
}

/* Apple feeds use the current theme instead of inheriting the blood CTA. */
.data-actions { grid-template-columns:repeat(2,minmax(0,1fr)); }
.data-actions button { min-height:58px; }
.feed-results { display:grid; gap:7px; margin-top:9px; }
.feed-result {
  grid-template-columns:auto minmax(0,1fr) auto;
  align-items:center;
  gap:7px;
  margin-top:0;
  padding:7px;
  border:1px solid var(--well-border);
  border-radius:15px;
  background:var(--tray-bg);
  box-shadow:inset 0 1px 0 var(--well-highlight);
}
.feed-result:not([hidden]) { display:grid; }
.feed-result > span { padding-left:3px; color:var(--ui-muted); font-size:8px; }
.feed-result input { min-height:38px; }
.feed-result button { min-height:38px; padding:0 11px; }
:root[data-theme="wine"] .feed-result button {
  border-color:rgba(190,121,145,.2);
  background:linear-gradient(148deg,rgba(42,15,31,.98),rgba(11,2,8,.995));
  color:#eadce3;
  box-shadow:inset 0 1px 0 rgba(255,231,240,.04);
}
:root[data-theme="graphite"] .feed-result button {
  border-color:rgba(198,202,209,.12);
  background:linear-gradient(148deg,rgba(29,30,34,.99),rgba(7,8,10,.998));
  color:#e5e1e3;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.035);
}

/* Schedule owns its first viewport; supporting cards reveal below it. */
[data-app-view="schedule"] .schedule-board {
  min-height:calc(100svh - 176px);
  display:flex;
  flex-direction:column;
}
[data-app-view="schedule"] .schedule-day-timeline { flex:1; align-content:start; }
[data-app-view="schedule"] .schedule-empty { min-height:clamp(190px,38svh,330px); }
.schedule-entry-card {
  min-height:52px;
  padding-block:7px;
  align-items:center;
}
.schedule-entry-card.has-details { min-height:64px; padding-block:9px; }
.schedule-entry-copy { align-self:center; }
.schedule-entry-copy strong { margin:0; line-height:1.2; }
.schedule-entry-copy > span,.schedule-entry-copy em { line-height:1.25; }

/* One coherent editor material with a protected Telegram header zone. */
.schedule-dialog[open] {
  width:100%;
  height:100%;
  max-height:100dvh;
  display:grid;
  align-items:start;
  margin:0;
  padding:max(88px,calc(env(safe-area-inset-top) + 66px)) 9px max(16px,env(safe-area-inset-bottom));
}
.schedule-dialog[open] > .schedule-dialog-card {
  width:min(100%,560px);
  max-height:calc(100dvh - max(112px,calc(env(safe-area-inset-top) + 88px)));
  margin:0 auto;
  gap:11px;
  padding:20px;
  border-radius:25px;
}
.schedule-dialog-card > :is(label,.form-grid,.schedule-duration-presets,.schedule-details,.category-create-trigger,.category-creator) {
  min-width:0;
}
.schedule-dialog-card :is(.select-shell,.native-time-shell,input:not([type="hidden"]),textarea,.schedule-details,.category-create-trigger,.category-creator) {
  border-color:var(--well-border);
  border-radius:16px;
  background:var(--well-bg);
  box-shadow:inset 0 1px 0 var(--well-highlight),inset 0 -1px 0 var(--well-lowlight);
}
.schedule-dialog-card .schedule-duration-presets {
  padding:4px;
  border:1px solid var(--well-border);
  border-radius:16px;
  background:var(--tray-bg);
  box-shadow:inset 0 1px 0 var(--well-highlight);
}
.schedule-dialog-card .schedule-duration-presets button { border-radius:12px; }
.schedule-dialog-card .dialog-close { top:17px; right:17px; }
.schedule-dialog-card > h2 { min-height:1.3em; margin-right:48px; }

@media (max-width:420px) {
  .feed-result { grid-template-columns:1fr auto; }
  .feed-result > span { grid-column:1/-1; }
  [data-app-view="schedule"] .schedule-board { min-height:calc(100svh - 166px); }
}

@media (prefers-reduced-motion:reduce) {
  .reveal-observed,.reveal-observed.is-revealed { opacity:1; transform:none; transition:none; }
}

/* A selected date always owns a soft theme-colored tile, even between lens frames. */
:root[data-theme] .month-day.selected {
  border-color:transparent;
  background:linear-gradient(145deg,color-mix(in srgb,var(--ui-accent) 38%,var(--tray-bg)),color-mix(in srgb,var(--ui-accent-deep) 44%,var(--tray-bg)));
  box-shadow:inset 0 1px 0 color-mix(in srgb,var(--ui-ink) 8%,transparent),0 7px 14px color-mix(in srgb,var(--ui-accent-deep) 13%,transparent);
}
:root[data-theme="blxxdy"] .month-day.selected {
  background:linear-gradient(145deg,rgba(90,17,35,.84),rgba(28,3,11,.95));
}
:root[data-theme="wine"] .month-day.selected {
  background:linear-gradient(145deg,rgba(83,44,62,.86),rgba(28,12,22,.96));
}
:root[data-theme="graphite"] .month-day.selected {
  background:linear-gradient(145deg,rgba(64,48,55,.88),rgba(18,17,20,.97));
}
:root[data-theme="porcelain"] .month-day.selected {
  background:linear-gradient(145deg,#86223b,#540d21);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.16),0 7px 14px rgba(87,12,31,.14);
}
:root[data-theme] .month-day.selected strong,
:root[data-theme="porcelain"] .month-day.selected strong { color:var(--ui-active-ink); }
:root[data-theme="porcelain"] .month-day.selected strong { color:#fff; }

/* Owner access ends naturally after its feature list; no placeholder action area. */
.subscription-panel:has(.owner-actions-hidden) .subscription-features { margin-bottom:0; border-bottom:0; padding-bottom:0; }

/* 2026-08-22 subscription, schedule and Apple feed refinement. */
.subscription-status:empty { display:none; }
.subscription-status:not(:empty) { margin:8px 0 0; min-height:0; }
.subscription-actions + .subscription-status:empty + .subscription-legal { margin-top:9px; }
.subscription-legal { margin-bottom:0; }

/* Overview category chips dissolve at the viewport edge instead of being cut. */
[data-app-view="overview"] .calendar-filters {
  padding-inline:10px;
  margin-inline:-10px;
  -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 13px,#000 calc(100% - 18px),transparent 100%);
  mask-image:linear-gradient(90deg,transparent 0,#000 13px,#000 calc(100% - 18px),transparent 100%);
}

/* Schedule has the same full-bleed geometry as the main calendar, with natural content height. */
[data-app-view="schedule"] .schedule-board {
  display:block;
  width:calc(100% + 24px);
  min-height:0;
  margin-right:-12px;
  margin-left:-12px;
  padding:18px 11px;
}
[data-app-view="schedule"] .schedule-day-timeline { display:grid; min-height:0; }
[data-app-view="schedule"] .schedule-empty { min-height:176px; }

/* Apple actions are explicit, full-width commands; only one result is shown. */
.data-actions { grid-template-columns:repeat(2,minmax(0,1fr)); }
.data-actions button { min-height:54px; }
.apple-feed-actions { display:grid; gap:7px; margin-top:8px; }
.apple-feed-actions button {
  display:grid;
  grid-template-columns:24px minmax(0,1fr) 16px;
  align-items:center;
  min-height:54px;
  padding:0 15px;
  border:1px solid var(--well-border);
  border-radius:16px;
  background:var(--well-bg);
  color:var(--ui-text);
  text-align:left;
  box-shadow:inset 0 1px 0 var(--well-highlight),inset 0 -1px 0 var(--well-lowlight),0 8px 18px color-mix(in srgb,var(--ui-accent-deep) 10%,transparent);
  transition:transform 160ms var(--ease-out-premium),background 220ms ease;
}
.apple-feed-actions button:active { transform:scale(.985); }
.apple-feed-actions button > svg:first-child { width:18px; color:var(--ui-accent-bright); }
.apple-feed-actions button > svg:last-child { width:15px; color:var(--ui-muted); }
.apple-feed-actions button span { overflow:hidden; font-size:10px; text-overflow:ellipsis; white-space:nowrap; }

#feedResult {
  grid-template-columns:34px minmax(0,1fr);
  gap:10px;
  margin-top:8px;
  padding:11px;
  border:1px solid var(--well-border);
  border-radius:18px;
  background:var(--plate-bg);
  box-shadow:inset 0 1px 0 var(--plate-highlight),var(--plate-shadow);
}
#feedResult:not([hidden]) { display:grid; }
#feedResult > svg { align-self:center; width:18px; color:var(--ui-accent-bright); }
#feedResult > div:nth-of-type(1) { min-width:0; align-self:center; }
#feedResult b,#feedResult span { display:block; }
#feedResult b { overflow:hidden; color:var(--ui-ink); font-size:9px; text-overflow:ellipsis; white-space:nowrap; }
#feedResult div > span { margin-top:3px; color:var(--ui-muted); font-size:7px; }
#feedResult > div:last-child { grid-column:1/-1; display:grid; grid-template-columns:1fr 1fr; gap:7px; }
#feedResult button {
  display:flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  min-height:40px;
  border:1px solid var(--well-border);
  border-radius:13px;
  background:var(--tray-bg);
  color:var(--ui-text);
}
#feedResult button svg { width:14px; }
#feedResult button span { margin:0; font-size:8px; }

.feed-confirm-dialog[open] > div { animation:event-dialog-in-refined 320ms cubic-bezier(.16,1,.3,1) both; }
.feed-confirm-dialog.is-closing > div { animation:event-dialog-out-refined 170ms cubic-bezier(.4,0,1,1) both; }
.schedule-photo-picker label.primary-action { display:flex; align-items:center; justify-content:center; gap:8px; cursor:pointer; }
.schedule-photo-picker label.primary-action svg { width:17px; }

/* Schedule editor stays centered and its optional area reads as one coherent disclosure. */
.schedule-dialog[open] { justify-items:center; }
.schedule-dialog[open] > .schedule-dialog-card {
  justify-self:center;
  margin-right:auto;
  margin-left:auto;
  transform-origin:50% 12%;
}
.schedule-details {
  overflow:visible;
  border:0;
  border-radius:17px;
  background:transparent;
  box-shadow:none;
}
.schedule-details .disclosure-trigger {
  min-height:48px;
  border:1px solid var(--well-border);
  border-radius:16px;
  background:var(--well-bg);
  box-shadow:inset 0 1px 0 var(--well-highlight),inset 0 -1px 0 var(--well-lowlight);
}
.schedule-details.is-open .disclosure-trigger { background:var(--active-bg); color:var(--ui-active-ink); }
.schedule-details .disclosure-content { transform:translateY(-5px); transition:grid-template-rows 300ms var(--ease-glass),opacity 220ms ease,transform 300ms var(--ease-glass); }
.schedule-details.is-open .disclosure-content { transform:translateY(0); }
.schedule-details .disclosure-inner {
  display:grid;
  gap:11px;
  margin-top:7px;
  padding:12px;
  border:1px solid var(--well-border);
  border-radius:17px;
  background:var(--tray-bg);
  box-shadow:inset 0 1px 0 var(--well-highlight);
}

/* Rich cells in wine and graphite keep the dimensionality of blxxdy. */
:root[data-theme="wine"] {
  --calendar-cell-bg:radial-gradient(circle at 20% -4%,rgba(167,82,116,.2),transparent 42%),linear-gradient(145deg,rgba(47,16,35,.96),rgba(10,2,8,.99));
  --calendar-cell-highlight:rgba(255,229,239,.06);
  --calendar-cell-shadow:rgba(2,0,2,.27);
}
:root[data-theme="graphite"] {
  --calendar-cell-bg:radial-gradient(circle at 20% -4%,rgba(195,199,207,.09),transparent 42%),radial-gradient(circle at 90% 100%,rgba(105,36,51,.08),transparent 46%),linear-gradient(145deg,rgba(35,36,41,.97),rgba(7,8,10,.995));
  --calendar-cell-highlight:rgba(255,255,255,.055);
  --calendar-cell-shadow:rgba(0,0,0,.34);
}
:root[data-theme="wine"] .month-day,
:root[data-theme="graphite"] .month-day {
  box-shadow:inset 0 1px 0 var(--calendar-cell-highlight),inset 0 -10px 18px var(--calendar-cell-shadow),0 5px 12px var(--calendar-cell-shadow);
}

/* Selected controls in blxxdy change material, not only text color. */
:root[data-theme="blxxdy"] .create-field-options input:checked + span,
:root[data-theme="blxxdy"] .offset-options button.active,
:root[data-theme="blxxdy"] .mini-offsets button.active {
  border-color:rgba(174,61,82,.28);
  background:radial-gradient(circle at 18% 0%,rgba(164,38,64,.18),transparent 44%),linear-gradient(145deg,rgba(73,10,27,.96),rgba(19,1,7,.99));
  color:#d5a8b1;
  box-shadow:inset 0 1px 0 rgba(255,218,226,.06),inset 0 -1px 0 rgba(0,0,0,.32),0 7px 16px rgba(4,0,1,.3);
}

:root[data-theme="blxxdy"] .theme-picker button[data-theme-choice="blxxdy"].active {
  border-color:rgba(203,91,112,.42);
  background:radial-gradient(circle at 18% -4%,rgba(190,47,76,.3),transparent 46%),linear-gradient(145deg,rgba(91,13,34,.985),rgba(18,1,7,.998));
  color:#d9aab3;
  box-shadow:inset 0 0 0 1px rgba(225,112,133,.14),inset 0 1px 0 rgba(255,220,228,.09),inset 0 -12px 24px rgba(7,0,2,.4),0 9px 20px rgba(4,0,1,.34);
}
:root[data-theme="blxxdy"] .theme-picker button[data-theme-choice="blxxdy"].active :is(strong,small,svg) { color:#d9aab3; }
:root[data-theme="blxxdy"] .theme-picker button[data-theme-choice="blxxdy"].active > i {
  border-color:rgba(230,127,146,.34);
  box-shadow:inset 0 1px 0 rgba(255,235,239,.11),0 0 0 3px rgba(151,31,56,.1);
}
:root[data-theme="blxxdy"] .theme-picker button[data-theme-choice="blxxdy"].active > svg {
  top:7px;
  right:7px;
  width:20px;
  height:20px;
  padding:4px;
  border:1px solid rgba(225,117,138,.27);
  border-radius:50%;
  background:linear-gradient(145deg,rgba(126,25,49,.94),rgba(45,5,16,.98));
  color:#f0c7cf;
  box-shadow:inset 0 1px 0 rgba(255,235,239,.12),0 4px 9px rgba(4,0,1,.3);
}

@media (max-width:420px) {
  [data-app-view="schedule"] .schedule-board { width:calc(100% + 24px); margin-inline:-12px; padding-inline:9px; }
}

/* Export actions remain a balanced pair on every viewport. */
.data-actions {
  grid-template-columns:repeat(2,minmax(0,1fr));
  align-items:stretch;
  grid-auto-rows:54px;
}
.data-actions button,
.data-actions button:last-child {
  grid-column:auto;
  width:100%;
  height:54px;
  min-height:54px;
  margin:0;
  flex-direction:column;
  align-self:stretch;
}

/* Schedule slots open a compact details surface before editing. */
.schedule-entry-card { cursor:pointer; }
.schedule-entry-card:not(.is-editable):active { transform:scale(.994); }
.schedule-entry-card:not(.is-editable) .schedule-entry-edit { color:var(--ui-muted); }
.schedule-entry-dialog {
  width:min(calc(100% - 20px),520px);
  max-height:calc(100dvh - 20px);
  overflow:visible;
  padding:0;
  border:0;
  background:transparent;
  color:var(--ui-text);
}
.schedule-entry-dialog::backdrop {
  background:color-mix(in srgb,var(--ui-page-end) 82%,transparent);
  -webkit-backdrop-filter:blur(16px);
  backdrop-filter:blur(16px);
  animation:backdrop-in 200ms ease-out both;
}
.schedule-entry-detail-card {
  position:relative;
  overflow:hidden;
  display:grid;
  gap:13px;
  padding:22px;
  border:1px solid color-mix(in srgb,var(--schedule-color) 34%,var(--plate-border));
  border-radius:var(--plate-radius);
  background:radial-gradient(circle at 88% 2%,color-mix(in srgb,var(--schedule-color) 17%,transparent),transparent 35%),var(--plate-bg);
  box-shadow:inset 0 1px 0 var(--plate-highlight),var(--plate-shadow);
  animation:event-dialog-in-refined 290ms var(--ease-glass) both;
}
.schedule-entry-dialog.is-closing .schedule-entry-detail-card { animation:event-dialog-out-refined 170ms cubic-bezier(.4,0,1,1) both; }
.schedule-entry-dialog.is-closing::backdrop { animation:backdrop-out-refined 170ms ease-in both; }
.schedule-entry-detail-card > .dialog-category { color:var(--schedule-color); }
.schedule-entry-detail-card > h2 { margin:3px 44px 2px 0; color:var(--ui-ink); font-size:21px; line-height:1.2; }
.schedule-detail-primary { display:grid; grid-template-columns:1fr 1fr; gap:7px; }
.schedule-detail-primary > div {
  min-width:0;
  min-height:62px;
  display:grid;
  grid-template-columns:28px minmax(0,1fr);
  align-items:center;
  gap:8px;
  padding:10px;
  border-radius:15px;
  background:var(--well-bg);
  box-shadow:inset 0 1px 0 var(--well-highlight),inset 0 -1px 0 var(--well-lowlight);
}
.schedule-detail-primary svg { width:17px; color:var(--schedule-color); }
.schedule-detail-primary b,.schedule-detail-primary small { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.schedule-detail-primary b { color:var(--ui-text); font-size:10px; font-weight:600; }
.schedule-detail-primary small { margin-top:4px; color:var(--ui-muted); font-size:7px; }
.schedule-detail-meta { display:flex; flex-wrap:wrap; gap:7px; }
.schedule-detail-meta:empty { display:none; }
.schedule-detail-meta span { display:flex; align-items:center; gap:6px; min-height:34px; padding:0 10px; border-radius:12px; background:var(--tray-bg); color:var(--ui-muted); font-size:8px; }
.schedule-detail-meta svg { width:13px; color:var(--schedule-color); }
.schedule-detail-notes { margin:0; padding:12px; border-radius:14px; background:var(--tray-bg); color:var(--ui-muted); font-size:9px; line-height:1.55; white-space:pre-wrap; }
.schedule-entry-detail-card > .primary-action { margin:2px 0 0; }

/* In blxxdy a selection changes the material, while staying dark and restrained. */
:root[data-theme="blxxdy"] .create-field-options input:checked + span {
  border-color:rgba(190,87,107,.36) !important;
  background:radial-gradient(circle at 15% 0%,rgba(157,55,78,.19),transparent 48%),linear-gradient(145deg,rgba(57,17,31,.99),rgba(25,5,12,.998)) !important;
  color:#e2bdc5 !important;
  box-shadow:inset 0 0 0 1px rgba(220,115,136,.08),inset 0 1px 0 rgba(255,225,232,.07) !important;
}
:root[data-theme="blxxdy"] .create-field-options input:checked + span::after {
  width:7px;
  height:7px;
  flex:0 0 auto;
  margin-left:auto;
  border-radius:50%;
  background:#a43d55;
  box-shadow:0 0 0 3px rgba(164,61,85,.11);
  content:"";
}
:root[data-theme="blxxdy"] :is(.offset-options button.active,.mini-offsets button.active) {
  border-color:rgba(190,87,107,.38) !important;
  background:radial-gradient(circle at 20% 0%,rgba(157,55,78,.2),transparent 50%),linear-gradient(145deg,rgba(60,18,32,.99),rgba(26,5,12,.998)) !important;
  color:#e2bdc5 !important;
  box-shadow:inset 0 0 0 1px rgba(220,115,136,.09),inset 0 1px 0 rgba(255,225,232,.07) !important;
}

/* Alternate overview modes retain the same deep material as the month grid. */
:root[data-theme="blxxdy"] .calendar-canvas:is([data-calendar-mode="week"],[data-calendar-mode="day"],[data-calendar-mode="list"]) {
  overflow:hidden;
  padding:10px;
  border-radius:18px;
  background:radial-gradient(circle at 16% -6%,rgba(117,31,51,.1),transparent 42%),linear-gradient(148deg,rgba(21,4,10,.985),rgba(5,0,3,.998));
  box-shadow:inset 0 1px 0 rgba(255,222,229,.035),inset 0 -1px 0 rgba(0,0,0,.34);
}
:root[data-theme="blxxdy"] .calendar-canvas[data-calendar-mode="list"] .event-search {
  border-color:rgba(151,58,77,.15);
  background:linear-gradient(145deg,rgba(27,6,13,.98),rgba(9,1,5,.995));
  box-shadow:inset 0 1px 0 rgba(255,225,232,.035);
}
:root[data-theme="blxxdy"] .calendar-canvas:is([data-calendar-mode="week"],[data-calendar-mode="day"]) .timeline-head {
  background:linear-gradient(180deg,rgba(23,4,10,.99),rgba(9,1,5,.985));
}

@media (prefers-reduced-motion:reduce) {
  .schedule-entry-detail-card { animation:none !important; }
}

/* 2026-08-22 schedule geometry, responsive selection materials and fast motion. */
.schedule-dialog[open] {
  box-sizing:border-box;
  inset:0;
  width:100%;
  max-width:none;
  height:100dvh;
  max-height:100dvh;
  place-items:start center;
  margin:0;
  padding-top:max(88px,calc(env(safe-area-inset-top) + 66px));
  padding-right:max(10px,env(safe-area-inset-right));
  padding-bottom:max(16px,env(safe-area-inset-bottom));
  padding-left:max(10px,env(safe-area-inset-left));
}
.schedule-dialog[open] > .schedule-dialog-card {
  box-sizing:border-box;
  width:min(560px,100%);
  max-width:100%;
  justify-self:center;
  margin:0;
}

.schedule-details .disclosure-content {
  overflow:hidden;
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transform:translateY(-4px);
  transition:grid-template-rows 260ms var(--ease-glass),opacity 150ms ease,transform 260ms var(--ease-glass),visibility 0s linear 260ms;
}
.schedule-details.is-open .disclosure-content {
  opacity:1;
  visibility:visible;
  pointer-events:auto;
  transform:translateY(0);
  transition-delay:0s;
}
.schedule-details:not(.is-open) .disclosure-inner {
  min-height:0;
  margin-top:0;
  padding-top:0;
  padding-bottom:0;
  border-width:0;
  border-color:transparent;
  box-shadow:none;
}
.schedule-details {
  border:0 !important;
  background:transparent !important;
  box-shadow:none !important;
}
.schedule-dialog[open] > .schedule-dialog-card:focus { outline:none; }

[data-app-view="schedule"] .schedule-day-timeline {
  gap:3px;
  margin-inline:4px;
  overflow:hidden;
  border-radius:17px;
}
.schedule-entry-card,
.schedule-entry-card.has-details {
  width:auto;
  min-height:68px;
  grid-template-columns:54px 3px minmax(0,1fr) 30px;
  gap:12px;
  padding:10px 13px;
  animation:schedule-entry-arrive-fast 180ms var(--ease-out-premium) both;
  animation-delay:calc(var(--entry-index) * 16ms);
}
.schedule-entry-card.has-details { min-height:76px; padding-block:11px; }
.schedule-entry-card:first-child { border-radius:17px 17px 5px 5px; }
.schedule-entry-card:last-child { border-radius:5px 5px 17px 17px; }
.schedule-entry-card:only-child { border-radius:17px; }
.schedule-entry-copy strong { font-size:12.5px; }
.schedule-entry-copy > span,.schedule-entry-copy em { margin-top:4px; }
@keyframes schedule-entry-arrive-fast {
  from { opacity:.28; transform:translateY(5px); }
  to { opacity:1; transform:translateY(0); }
}

.schedule-tools { padding-bottom:16px; }
.schedule-tools .schedule-digest-time { margin-bottom:0; }
.schedule-tools .settings-status:empty { display:none; }
.schedule-tools .settings-status:not(:empty) { min-height:0; margin:9px 0 0; }

/* Selected controls stay unmistakable without bright, flat fills. */
:root[data-theme="blxxdy"] :is(
  .create-field-options input:checked + span,
  .offset-options button.active,.mini-offsets button.active,
  .default-view-options button.active,.schedule-duration-presets button.active,
  .schedule-pattern-options button.active,.simple-mode-action.active
) {
  border-color:rgba(164,62,82,.24) !important;
  background:radial-gradient(circle at 16% -8%,rgba(137,36,58,.13),transparent 48%),linear-gradient(145deg,rgba(45,9,21,.99),rgba(14,1,5,.999)) !important;
  color:#d3a8b1 !important;
  box-shadow:inset 0 1px 0 rgba(255,224,231,.045),inset 0 -1px 0 rgba(0,0,0,.38),0 6px 14px rgba(3,0,1,.24) !important;
}
:root[data-theme="blxxdy"] .create-field-options input:checked + span::after { content:none !important; }

:root[data-theme="graphite"] :is(
  .create-field-options input:checked + span,
  .offset-options button.active,.mini-offsets button.active,
  .default-view-options button.active,.schedule-duration-presets button.active,
  .schedule-pattern-options button.active,.simple-mode-action.active
) {
  border-color:rgba(190,193,200,.14) !important;
  background:radial-gradient(circle at 18% -8%,rgba(189,192,198,.075),transparent 47%),radial-gradient(circle at 92% 110%,rgba(103,50,61,.06),transparent 43%),linear-gradient(145deg,rgba(38,39,44,.995),rgba(11,12,14,.999)) !important;
  color:#e5e2e4 !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.055),inset 0 -1px 0 rgba(0,0,0,.45),0 7px 16px rgba(0,0,0,.25) !important;
}

:root[data-theme="porcelain"] :is(
  .create-field-options input:checked + span,
  .offset-options button.active,.mini-offsets button.active,
  .default-view-options button.active,.schedule-duration-presets button.active,
  .schedule-pattern-options button.active,.simple-mode-action.active
) {
  border-color:rgba(105,19,41,.25) !important;
  background:radial-gradient(circle at 12% -12%,rgba(131,27,52,.17),transparent 49%),linear-gradient(145deg,#fff,#f7edf0) !important;
  color:#68172b !important;
  box-shadow:inset 0 1px 0 #fff,inset 0 -1px 0 rgba(109,20,42,.06),0 7px 16px rgba(83,9,27,.09) !important;
}

/* Frequent navigation is immediate; motion only confirms continuity. */
.app-view { animation:none; }
.app-view.view-enter {
  opacity:.74;
  transform:translateY(3px);
  filter:none;
  will-change:opacity,transform;
}
.app-view.view-enter.view-enter-active {
  opacity:1;
  transform:translateY(0);
  filter:none;
  transition:opacity 135ms ease-out,transform 165ms cubic-bezier(.16,1,.3,1);
}
.reveal-observed {
  transform:translateY(8px);
  transition:opacity 190ms ease-out,transform 240ms cubic-bezier(.16,1,.3,1);
}

@media (prefers-reduced-motion:no-preference) {
  :where(button,[role="button"],.option-toggle,.category-create-trigger) {
    transition-property:scale,transform,background-color,border-color,color,opacity,box-shadow;
    transition-duration:120ms,180ms,180ms,180ms,150ms,150ms,180ms;
    transition-timing-function:ease-out,var(--ease-out-premium),ease,ease,ease,ease,ease;
  }
  :where(button,[role="button"],.option-toggle,.category-create-trigger):not(:disabled):active { scale:.975; }
}

.performance-mode :is(
  .premium-surface,.event-editor-panel,.template-strip,.appearance-panel,
  .schedule-tools,.navigation-settings,.bottom-nav,
  .event-dialog-card,.schedule-dialog-card,.schedule-entry-detail-card
) {
  -webkit-backdrop-filter:none !important;
  backdrop-filter:none !important;
}
.performance-mode .app-view > section {
  content-visibility:auto !important;
  contain-intrinsic-size:auto 300px !important;
}
.performance-mode .app-view > section:first-child { content-visibility:visible !important; contain-intrinsic-size:none !important; }

@media (max-width:420px) {
  .schedule-dialog[open] {
    padding-right:max(8px,env(safe-area-inset-right));
    padding-left:max(8px,env(safe-area-inset-left));
  }
  .schedule-dialog[open] > .schedule-dialog-card { padding:18px; }
  [data-app-view="schedule"] .schedule-day-timeline { margin-inline:2px; }
  .schedule-entry-card,.schedule-entry-card.has-details {
    grid-template-columns:50px 3px minmax(0,1fr) 28px;
    gap:9px;
    padding-inline:10px;
  }
}

/* One product, four palettes: shared geometry and material hierarchy. */
:root[data-theme] {
  --product-plate-radius:22px;
  --product-well-radius:17px;
  --product-action-radius:14px;
  --product-control-bg:var(--well-bg);
  --product-control-border:var(--well-border);
  --product-control-shadow:inset 0 1px 0 var(--well-highlight),inset 0 -1px 0 var(--well-lowlight);
}
:root[data-theme="blxxdy"] {
  --selection-bg:radial-gradient(circle at 16% -8%,rgba(137,36,58,.13),transparent 48%),linear-gradient(145deg,rgba(45,9,21,.99),rgba(14,1,5,.999));
  --selection-border:rgba(164,62,82,.24);
  --selection-ink:#d3a8b1;
  --selection-shadow:inset 0 1px 0 rgba(255,224,231,.045),inset 0 -1px 0 rgba(0,0,0,.38),0 6px 14px rgba(3,0,1,.24);
  --product-focus-ring:rgba(164,62,82,.52);
}
:root[data-theme="wine"] {
  --selection-bg:radial-gradient(circle at 16% -8%,rgba(172,102,132,.12),transparent 48%),linear-gradient(145deg,rgba(53,25,42,.99),rgba(17,6,13,.999));
  --selection-border:rgba(190,126,153,.24);
  --selection-ink:#eadbe2;
  --selection-shadow:inset 0 1px 0 rgba(255,233,242,.05),inset 0 -1px 0 rgba(2,0,2,.4),0 7px 16px rgba(2,0,2,.25);
  --product-focus-ring:rgba(190,126,153,.48);
}
:root[data-theme="graphite"] {
  --selection-bg:radial-gradient(circle at 18% -8%,rgba(210,213,219,.08),transparent 47%),radial-gradient(circle at 92% 110%,rgba(104,65,73,.035),transparent 43%),linear-gradient(145deg,rgba(38,39,44,.995),rgba(11,12,14,.999));
  --selection-border:rgba(205,208,214,.17);
  --selection-ink:#e5e2e4;
  --selection-shadow:inset 0 1px 0 rgba(255,255,255,.055),inset 0 -1px 0 rgba(0,0,0,.45),0 7px 16px rgba(0,0,0,.25);
  --product-focus-ring:rgba(202,205,211,.38);
}
:root[data-theme="porcelain"] {
  --selection-bg:radial-gradient(circle at 12% -12%,rgba(131,27,52,.24),transparent 50%),linear-gradient(145deg,#fff,#f3e1e7);
  --selection-border:rgba(105,19,41,.31);
  --selection-ink:#5f1024;
  --selection-shadow:inset 0 1px 0 #fff,inset 0 -1px 0 rgba(109,20,42,.08),0 8px 18px rgba(83,9,27,.105);
  --product-focus-ring:rgba(105,19,41,.4);
}

:root[data-theme] :is(
  .calendar-workspace,.next-event,.expense-overview,.selected-events,
  .schedule-board,.schedule-tools,.event-editor-panel,.template-strip,
  .subscription-panel,.create-fields-panel,.appearance-panel,.settings-intro,
  .settings-panel,.navigation-settings,.data-panel,.spaces-panel,.account-panel,
  .cabinet-archive-card,.event-dialog-card,.schedule-dialog-card,
  .schedule-preferences-card,.schedule-import-card,.schedule-entry-detail-card
) {
  overflow:hidden;
  border-width:1px;
  border-style:solid;
  border-color:var(--plate-border);
  border-radius:var(--product-plate-radius);
  background-clip:padding-box;
  box-shadow:inset 0 1px 0 var(--plate-highlight),inset 0 -1px 0 var(--plate-lowlight),var(--plate-shadow);
}

:root[data-theme] :is(
  input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]),select,textarea,
  .select-shell,.date-shell,.native-time-shell,
  .pulse-strip,.stats-grid article,.schedule-insights article,
  .option-toggle,.schedule-digest-toggle,.disclosure-trigger,
  .template-chip,.template-empty,.event-item,.spaces-list article,
  .export-result,.feed-result,.schedule-detail-primary > div,
  .schedule-detail-meta span,.schedule-detail-notes
) {
  border-color:var(--product-control-border);
  border-radius:var(--product-well-radius);
  background-clip:padding-box;
  box-shadow:var(--product-control-shadow);
}

:root[data-theme] :is(
  .period-actions button,.calendar-filters button,.schedule-week-actions button,
  .offset-options button,.mini-offsets button,.data-actions button,
  .secondary-action,.simple-mode-action,.schedule-add-action,.schedule-edit-action,
  .schedule-photo-action,.schedule-parameters-action,.back-action,.icon-action,
  .text-action,.dialog-close,.dialog-actions button,.space-create button,
  .spaces-list button,.category-create-trigger,.category-create-save,
  .schedule-duration-presets button,.schedule-pattern-options button,
  .default-view-options button,.apple-feed-actions button,#feedResult button
) {
  border-width:1px;
  border-style:solid;
  border-color:var(--product-control-border);
  border-radius:var(--product-action-radius);
  background-clip:padding-box;
  box-shadow:inset 0 1px 0 var(--well-highlight);
}

:root[data-theme] :is(
  .create-field-options input:checked + span,
  .offset-options button.active,.mini-offsets button.active,
  .default-view-options button.active,.schedule-duration-presets button.active,
  .schedule-pattern-options button.active,.simple-mode-action.active,
  .theme-picker button.active,.calendar-filters button.active,
  .range-presets button.active,.expense-periods button.active,
  .schedule-edit-action.active,
  .option-toggle:has(input:checked),.schedule-digest-toggle:has(input:checked)
) {
  border-color:var(--selection-border) !important;
  background:var(--selection-bg) !important;
  color:var(--selection-ink) !important;
  box-shadow:var(--selection-shadow) !important;
}
:root[data-theme] :is(
  .create-field-options input:checked + span,
  .theme-picker button.active,
  .option-toggle:has(input:checked),.schedule-digest-toggle:has(input:checked)
) :is(b,strong,small,svg) { color:inherit; }

:root[data-theme] :is(button,input,select,textarea,[role="button"]):focus-visible {
  outline:2px solid var(--product-focus-ring);
  outline-offset:2px;
}
:root[data-theme] :is(button,input,select,textarea):disabled { opacity:.48; cursor:not-allowed; }

:root[data-theme] .theme-picker button.active > svg {
  top:10px !important;
  right:10px !important;
  width:14px !important;
  height:14px !important;
  padding:0 !important;
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  color:var(--selection-ink) !important;
  box-shadow:none !important;
}
:root[data-theme="porcelain"] .appearance-panel .theme-picker button[data-theme-choice="porcelain"].active {
  border-color:rgba(105,19,41,.3) !important;
  background:radial-gradient(circle at 18% -8%,rgba(180,67,93,.24),transparent 48%),linear-gradient(145deg,#7a1931,#4e0a1c) !important;
  color:#fff8fa !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.18),inset 0 -1px 0 rgba(43,2,13,.32),0 8px 18px rgba(83,9,27,.14) !important;
}
:root[data-theme="porcelain"] .appearance-panel .theme-picker button[data-theme-choice="porcelain"].active :is(strong,small,svg) { color:#fff8fa !important; }

html,body,.app-shell,.app-view { max-width:100%; }
html,body,.app-shell { overflow-x:clip; }

@media (max-width:560px) {
  .schedule-view-title {
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    align-items:center;
    gap:8px;
  }
  .schedule-view-title > div:first-child { min-width:0; }
  .schedule-view-title h2 { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  .schedule-title-actions {
    display:grid;
    grid-template-columns:repeat(4,38px);
    gap:4px;
    width:max-content;
    max-width:100%;
  }
  .schedule-title-actions :is(.schedule-edit-action,.schedule-parameters-action,.schedule-photo-action,.schedule-add-action) {
    width:38px;
    min-width:38px;
    padding:0;
  }
  .schedule-title-actions :is(.schedule-edit-action,.schedule-parameters-action,.schedule-photo-action,.schedule-add-action) > span,
  .schedule-title-actions .schedule-photo-action > b { display:none; }
  [data-app-view="schedule"] .schedule-board { max-width:calc(100vw - 8px); }
}

@media (max-width:360px) {
  .schedule-view-title { grid-template-columns:1fr; }
  .schedule-title-actions {
    grid-column:1;
    grid-row:2;
    grid-template-columns:repeat(4,minmax(0,1fr));
    width:100%;
  }
  .schedule-title-actions :is(.schedule-edit-action,.schedule-parameters-action,.schedule-photo-action,.schedule-add-action) {
    width:100%;
    min-width:0;
  }
}

/* The bottom tray uses an explicit material. A gradient cannot be passed to
   color-mix(), which previously made the whole tray transparent in WebKit. */
:root[data-theme="blxxdy"] {
  --nav-surface:
    radial-gradient(circle at 16% -18%,rgba(105,25,43,.11),transparent 45%),
    linear-gradient(148deg,rgba(20,3,8,.99),rgba(5,0,2,.998));
  --nav-lens-bg:
    radial-gradient(circle at 15% -10%,rgba(133,36,57,.12),transparent 45%),
    linear-gradient(148deg,rgba(42,8,17,.99),rgba(12,1,4,.998));
  --nav-lens-border:rgba(164,62,82,.21);
  --nav-active-ink:#d4aab3;
}
:root[data-theme="wine"] {
  --nav-surface:
    radial-gradient(circle at 16% -18%,rgba(103,45,72,.1),transparent 46%),
    linear-gradient(148deg,rgba(23,8,18,.992),rgba(6,1,5,.998));
  --nav-lens-bg:
    radial-gradient(circle at 15% -10%,rgba(166,91,121,.11),transparent 45%),
    linear-gradient(148deg,rgba(48,19,36,.99),rgba(13,3,10,.998));
  --nav-lens-border:rgba(190,126,153,.22);
  --nav-active-ink:#eadbe2;
}
:root[data-theme="graphite"] {
  --nav-surface:
    radial-gradient(circle at 16% -18%,rgba(210,214,221,.035),transparent 46%),
    linear-gradient(148deg,rgba(20,21,24,.995),rgba(5,6,8,.999));
  --nav-lens-bg:
    radial-gradient(circle at 15% -10%,rgba(218,221,226,.065),transparent 45%),
    linear-gradient(148deg,rgba(42,43,48,.995),rgba(14,15,18,.999));
  --nav-lens-border:rgba(211,214,220,.14);
  --nav-active-ink:#e2e3e6;
}
:root[data-theme="porcelain"] {
  --nav-surface:
    radial-gradient(circle at 16% -18%,rgba(128,28,52,.075),transparent 46%),
    linear-gradient(148deg,rgba(255,255,255,.99),rgba(244,231,237,.99));
  --nav-lens-bg:
    radial-gradient(circle at 15% -10%,rgba(143,34,61,.13),transparent 45%),
    linear-gradient(148deg,#fff,#f0dce3);
  --nav-lens-border:rgba(105,19,41,.2);
  --nav-active-ink:#5f1427;
}

:root[data-theme] .bottom-nav {
  border-color:var(--well-border) !important;
  background:var(--nav-surface) !important;
  box-shadow:inset 0 1px 0 var(--well-highlight),0 18px 44px rgba(0,0,0,.38) !important;
}
:root[data-theme] .bottom-nav-lens {
  border:0 !important;
  background:var(--nav-lens-bg) !important;
  box-shadow:inset 0 0 0 1px var(--nav-lens-border),inset 0 1px 0 var(--plate-highlight) !important;
}
:root[data-theme] .bottom-nav button.active,
:root[data-theme] .bottom-nav button.active svg {
  color:var(--nav-active-ink) !important;
}

/* Nutrition and full-page editors */
body[data-view="create"] .bottom-nav,
body[data-view="schedule-create"] .bottom-nav,
body[data-view="nutrition-create"] .bottom-nav {
  opacity:0;
  pointer-events:none;
  transform:translate3d(-50%,18px,0);
}
.schedule-editor-page {
  width:min(calc(100% - 24px),650px);
  margin:0 auto;
  padding:0 0 calc(30px + env(safe-area-inset-bottom));
}
.schedule-editor-page .schedule-dialog-card {
  width:100%;
  max-height:none;
  margin:0;
  box-shadow:inset 0 1px 0 var(--plate-highlight),var(--plate-shadow);
  animation:none;
}
.schedule-editor-page .schedule-dialog-card > h2 { margin:5px 0 3px;font-size:20px;color:var(--theme-strong); }
.schedule-editor-page .schedule-dialog-card label > span { font-size:10px; }
.schedule-editor-page .schedule-dialog-card :is(input,select) { min-height:52px; }
.nutrition-view { padding-bottom:0; }
.nutrition-editor-page { padding-bottom:calc(104px + env(safe-area-inset-bottom)); }
.nutrition-view-title,.nutrition-hero > header { display:flex;align-items:center;justify-content:space-between;gap:12px; }
.nutrition-add-action,.nutrition-hero header button,.nutrition-goal button {
  min-height:42px;display:inline-flex;align-items:center;justify-content:center;gap:7px;padding:0 13px;
  border:1px solid var(--product-control-border);border-radius:var(--product-action-radius);
  background:var(--well-bg);color:var(--theme-strong);box-shadow:inset 0 1px 0 var(--well-highlight);
}
.nutrition-add-action svg,.nutrition-hero header button svg,.nutrition-goal button svg { width:15px;height:15px; }
.nutrition-hero,.nutrition-meals,.nutrition-week,.nutrition-goal { margin-bottom:12px;padding:18px; }
.nutrition-hero > header > div { text-align:center; }
.nutrition-hero > header span { color:var(--ui-muted);font-size:9px; }
.nutrition-hero > header h2 { margin:3px 0 0;color:var(--theme-strong);font-size:15px; }
.nutrition-hero header button { width:42px;padding:0; }
.nutrition-progress { position:relative;width:156px;height:156px;display:grid;place-items:center;margin:17px auto 13px; }
.nutrition-progress > div { position:absolute;z-index:1;display:grid;text-align:center; }
.nutrition-progress strong { color:var(--theme-strong);font-size:34px;font-weight:600;line-height:1; }
.nutrition-progress span { margin-top:7px;color:var(--ui-muted);font-size:9px; }
.nutrition-progress svg { width:156px;height:156px;transform:rotate(-90deg); }
.nutrition-progress circle { fill:none;stroke:var(--well-border);stroke-width:7; }
.nutrition-progress circle:last-child { stroke:var(--selection-ink);stroke-linecap:round;stroke-dasharray:320.44;stroke-dashoffset:320.44;transition:stroke-dashoffset 420ms cubic-bezier(.22,1,.36,1); }
.nutrition-macros { display:grid;grid-template-columns:repeat(3,1fr);gap:6px; }
.nutrition-macros > span { min-width:0;display:grid;grid-template-columns:6px 1fr;gap:2px 7px;padding:11px;border-radius:15px;background:var(--well-bg); }
.nutrition-macros i { grid-row:1/3;width:5px;height:28px;border-radius:4px;background:#8f3046; }
.nutrition-macros span:nth-child(2) i { background:#76515d; }.nutrition-macros span:nth-child(3) i { background:#715232; }
.nutrition-macros b { overflow:hidden;color:var(--theme-strong);font-size:11px;text-overflow:ellipsis;white-space:nowrap; }
.nutrition-macros small { color:var(--ui-muted);font-size:8px; }
.nutrition-meal-list { display:grid;gap:6px; }
.nutrition-meal { width:100%;min-height:66px;display:grid;grid-template-columns:43px minmax(0,1fr) auto 14px;align-items:center;gap:10px;padding:9px 11px;border:0;border-radius:15px;background:var(--well-bg);color:var(--theme-soft);text-align:left; }
.nutrition-meal time { color:var(--ui-muted);font-size:9px; }.nutrition-meal div { min-width:0;display:grid;gap:4px; }
.nutrition-meal b { overflow:hidden;color:var(--theme-strong);font-size:11px;text-overflow:ellipsis;white-space:nowrap; }.nutrition-meal span { color:var(--ui-muted);font-size:8px; }
.nutrition-meal strong { color:var(--theme-soft);font-size:12px; }.nutrition-meal > svg { width:13px;height:13px;color:var(--ui-muted); }
.nutrition-empty { min-height:132px;display:grid;place-items:center;align-content:center;gap:7px;text-align:center;color:var(--ui-muted); }
.nutrition-empty svg { width:23px;height:23px; }.nutrition-empty b { color:var(--theme-strong);font-size:11px; }.nutrition-empty span { max-width:230px;font-size:9px;line-height:1.55; }
.nutrition-week-bars { height:120px;display:grid;grid-template-columns:repeat(7,1fr);align-items:end;gap:6px;padding-top:8px; }
.nutrition-week-bars span { height:100%;display:grid;grid-template-rows:1fr auto auto;gap:4px;text-align:center; }
.nutrition-week-bars i { width:100%;height:var(--bar);align-self:end;border-radius:8px 8px 4px 4px;background:var(--selection-bg);box-shadow:inset 0 1px 0 var(--well-highlight);transition:height 260ms cubic-bezier(.22,1,.36,1); }
.nutrition-week-bars b,.nutrition-week-bars small { color:var(--ui-muted);font-size:7px; }.nutrition-week-bars small { text-transform:uppercase; }
.nutrition-goal { display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:10px; }
.nutrition-goal label { display:grid;grid-template-columns:minmax(0,1fr) 82px auto;align-items:center;gap:8px; }
.nutrition-goal label > span { display:grid;gap:3px; }.nutrition-goal b { color:var(--theme-strong);font-size:11px; }.nutrition-goal small,.nutrition-goal em { color:var(--ui-muted);font-size:8px;font-style:normal; }
.nutrition-goal input { min-height:44px!important;padding:0 8px!important;text-align:center; }.nutrition-goal p { grid-column:1/-1;margin:0;color:var(--ui-muted);font-size:9px; }
.nutrition-editor-panel { margin-top:0; }.nutrition-macro-inputs { grid-template-columns:repeat(3,minmax(0,1fr)); }
.nutrition-editor-panel .date-shell,.nutrition-editor-panel .native-time-shell { min-height:54px; }
@media (max-width:420px) {
  .nutrition-hero,.nutrition-meals,.nutrition-week,.nutrition-goal { padding:15px; }
  .nutrition-goal { grid-template-columns:1fr; }.nutrition-goal button { width:100%; }.nutrition-macro-inputs { gap:6px; }
  .nutrition-editor-panel .form-grid.two { grid-template-columns:1fr 1fr; }
}
@media (prefers-reduced-motion:reduce) { .nutrition-progress circle:last-child,.nutrition-week-bars i { transition:none; } }

/* Final Telegram performance layer. Keep this last so later visual work cannot
   re-enable continuous paint or blur costs inside the mini app. */
.performance-mode :is(
  .app-header h1,.premium-surface,.event-editor-panel,.subscription-panel,
  .calendar-workspace,.selected-events,.schedule-board,.schedule-tools,
  .appearance-panel,.settings-panel,.navigation-settings,.data-panel,
  .spaces-panel,.account-panel,.template-strip,.next-event,.schedule-now
) {
  animation:none !important;
  background-position:50% 50% !important;
}
.performance-mode :is(.premium-surface,.event-editor-panel,.next-event,.subscription-panel)::after {
  display:none !important;
  animation:none !important;
}
.performance-mode :is(
  .premium-surface,.event-editor-panel,.subscription-panel,.calendar-workspace,
  .selected-events,.schedule-board,.schedule-tools,.appearance-panel,
  .settings-intro,.settings-panel,.navigation-settings,.data-panel,
  .spaces-panel,.account-panel,.template-strip,.bottom-nav,
  .event-dialog-card,.schedule-dialog-card,.schedule-preferences-card,
  .schedule-import-card,.schedule-entry-detail-card,.cabinet-archive-card
) {
  -webkit-backdrop-filter:none !important;
  backdrop-filter:none !important;
}
.performance-mode dialog::backdrop,
.performance-mode .cabinet-archive .section-heading {
  -webkit-backdrop-filter:none !important;
  backdrop-filter:none !important;
}
.performance-mode.theme-changing :is(.app-header,.app-view:not([hidden])) { filter:none !important; }
.performance-mode dialog[open]:not(.is-closing):not(.cabinet-archive) > :is(
  .event-dialog-card,.schedule-dialog-card,.schedule-preferences-card,
  .schedule-import-card,.schedule-entry-detail-card,div
) {
  animation:performance-dialog-in 190ms cubic-bezier(.16,1,.3,1) both !important;
}
.performance-mode dialog.is-closing:not(.cabinet-archive) > :is(
  .event-dialog-card,.schedule-dialog-card,.schedule-preferences-card,
  .schedule-import-card,.schedule-entry-detail-card,div
) {
  animation:performance-dialog-out 130ms ease-in both !important;
}
@keyframes performance-dialog-in {
  from { opacity:.42; transform:translateY(8px) scale(.986); }
  to { opacity:1; transform:translateY(0) scale(1); }
}
@keyframes performance-dialog-out {
  to { opacity:0; transform:translateY(5px) scale(.992); }
}
.performance-mode .app-view > section {
  content-visibility:auto !important;
  contain-intrinsic-size:auto 300px !important;
}
.performance-mode .app-view > section:first-child {
  content-visibility:visible !important;
  contain-intrinsic-size:none !important;
}
:where(button,[role="button"],input,select,textarea) {
  -webkit-tap-highlight-color:transparent;
  touch-action:manipulation;
}
.calendar-canvas,.schedule-day-timeline { contain:layout style; }

.agenda-past-section {
  overflow:hidden;
  padding:5px;
  border:1px solid var(--well-border);
  border-radius:19px;
  background:var(--tray-bg);
  box-shadow:inset 0 1px 0 var(--well-highlight);
}
.agenda-past-toggle {
  width:100%;
  min-height:50px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:0 14px;
  border:0;
  border-radius:14px;
  background:transparent;
  color:var(--theme-soft);
}
.agenda-past-toggle > span { display:flex;align-items:center;gap:9px;min-width:0; }
.agenda-past-toggle svg { width:16px;height:16px;transition:transform 190ms cubic-bezier(.22,1,.36,1); }
.agenda-past-toggle > svg { color:var(--ui-muted); }
.agenda-past-toggle b { color:var(--theme-strong);font-size:11px;font-weight:600; }
.agenda-past-toggle small { min-width:24px;padding:3px 7px;border-radius:9px;background:var(--well-bg);color:var(--ui-muted);font-size:8px;text-align:center; }
.agenda-past-toggle[aria-expanded="true"] > svg { transform:rotate(180deg); }
.agenda-past-panel {
  display:grid;
  grid-template-rows:0fr;
  opacity:0;
  transform:translateY(-4px);
  transition:grid-template-rows 220ms cubic-bezier(.22,1,.36,1),opacity 150ms ease-out,transform 200ms cubic-bezier(.22,1,.36,1);
}
.agenda-past-panel > div { min-height:0;overflow:hidden;padding:0 10px; }
.agenda-past-panel.open { grid-template-rows:1fr;opacity:1;transform:translateY(0); }
.agenda-past-panel.open > div { padding-top:7px;padding-bottom:10px; }
.agenda-current-empty { min-height:68px;display:flex;align-items:center;justify-content:center;gap:9px;color:var(--ui-muted);font-size:10px; }
.agenda-current-empty svg { width:17px;height:17px; }

@media (prefers-reduced-motion:reduce) {
  .agenda-past-panel,.agenda-past-toggle svg { transition:none !important; }
}

/* Final compositor seal: the fixed tray and the short page confirmation stay
   on transform/opacity paths and do not repaint the document behind them. */
.performance-mode .bottom-nav {
  contain:layout paint style;
  transform:translate3d(-50%,0,0);
}
.performance-mode .bottom-nav-lens,
.performance-mode .app-view.view-enter,
.performance-mode .app-view.view-enter.view-enter-active {
  -webkit-backface-visibility:hidden;
  backface-visibility:hidden;
}

/* One transform-only ambient cue remains on the actual next event. */
.performance-mode .next-event.has-event .next-event-orbit {
  animation:orbit-turn 24s linear infinite !important;
  -webkit-backface-visibility:hidden;
  backface-visibility:hidden;
}

/* 2026-08-25: effortless nutrition and reorderable primary sections. */
.editor-view-title > div > h2,
.nutrition-editor-title h2,
.schedule-editor-title h2 {
  margin:0;
  color:var(--theme-strong);
  font-size:24px;
  font-weight:700;
  line-height:1.08;
  letter-spacing:0;
  text-transform:none;
}
#editorKicker,
#scheduleDialogTitle {
  font-size:28px !important;
  font-weight:750 !important;
  line-height:1.05 !important;
  text-transform:none !important;
}
#nutritionEditorKicker { font-size:26px !important;font-weight:720 !important;text-transform:none !important; }
.nutrition-view-title h2,
.nutrition-meals .section-heading h2,
.nutrition-week .section-heading h2 { text-transform:none; }
.nutrition-editor-title,
.schedule-editor-title { margin:5px 0 13px; }

/* Editor titles share one calm baseline with the back action. */
.editor-view-title,
.nutrition-editor-title,
.schedule-editor-title {
  grid-template-columns:44px minmax(0,1fr) auto;
  grid-template-rows:44px;
  align-items:center;
  column-gap:11px;
}
.editor-view-title > .back-action,
.nutrition-editor-title > .back-action,
.schedule-editor-title > .back-action {
  grid-column:1;
  grid-row:1;
}
.editor-view-title > div,
.nutrition-editor-title > div,
.schedule-editor-title > div {
  display:block;
  grid-column:2;
  grid-row:1;
  min-width:0;
  align-self:center;
}
.editor-view-title > div > h2,
#editorKicker,
#scheduleDialogTitle,
#nutritionEditorKicker {
  margin:0 !important;
  padding:0 !important;
  font-size:18px !important;
  font-weight:650 !important;
  line-height:1.2 !important;
}
.editor-view-title .simple-mode-action {
  grid-column:3;
  grid-row:1;
  align-self:center;
  margin:0;
}
.nutrition-editor-title,
.schedule-editor-title {
  grid-template-columns:44px minmax(0,1fr) 44px;
}
.nutrition-editor-title > div,
.schedule-editor-title > div { text-align:center; }

[data-app-view="create"] > .event-editor-panel,
.nutrition-editor-page > .event-editor-panel,
.schedule-editor-page {
  width:calc(100% + 24px);
  max-width:none;
  margin-right:-12px;
  margin-left:-12px;
}
.schedule-editor-page { padding:0 0 calc(30px + env(safe-area-inset-bottom)); }
.schedule-editor-page > .editor-view-title { width:calc(100% - 24px);margin-right:auto;margin-left:auto; }
.schedule-editor-page .schedule-dialog-card,
[data-app-view="create"] > .event-editor-panel,
.nutrition-editor-page > .event-editor-panel {
  border-right:0;
  border-left:0;
  border-radius:26px;
}
.schedule-editor-page .schedule-dialog-card { padding:20px 23px; }

.nutrition-view-title { margin-bottom:12px; }
.nutrition-view-title h2 { font-size:23px;font-weight:700; }
.nutrition-hero {
  width:calc(100% + 24px);
  margin-right:-12px;
  margin-left:-12px;
  padding:19px 21px 22px;
  border-right:0;
  border-left:0;
  border-radius:26px;
  background:
    radial-gradient(circle at 78% 12%,color-mix(in srgb,var(--ui-accent) 11%,transparent),transparent 34%),
    var(--plate-bg);
}
.nutrition-progress {
  width:100%;
  height:auto;
  grid-template-columns:150px minmax(0,1fr);
  justify-items:center;
  gap:17px;
  margin:18px auto 0;
}
.nutrition-progress > div { position:absolute;left:75px;transform:translateX(-50%); }
.nutrition-progress > div span { margin:0 0 4px;color:var(--ui-muted);font-size:9px; }
.nutrition-progress > div strong { font-size:35px; }
.nutrition-progress > div small { margin-top:3px;color:var(--ui-muted);font-size:8px; }
.nutrition-progress svg { grid-column:1;width:142px;height:142px; }
.nutrition-progress aside {
  width:100%;
  display:grid;
  align-content:center;
  gap:5px;
  padding:17px 0 17px 18px;
  border-left:1px solid var(--well-border);
}
.nutrition-progress aside span { color:var(--ui-muted);font-size:9px; }
.nutrition-progress aside b,.nutrition-progress aside strong { color:var(--theme-strong);font-size:14px;font-style:normal; }
.nutrition-progress aside em { font-style:normal; }
.nutrition-progress aside strong { margin-bottom:9px;color:var(--selection-ink);font-size:16px; }
.nutrition-meals,.nutrition-week,.nutrition-goal { background:var(--plate-bg); }
.nutrition-meals .section-heading h2,.nutrition-week .section-heading h2 { font-size:18px;font-weight:650; }
.nutrition-meal {
  min-height:70px;
  grid-template-columns:38px minmax(0,1fr) auto 14px;
  padding:10px 12px;
  background:var(--well-bg);
  box-shadow:inset 0 1px 0 var(--well-highlight),inset 0 -1px 0 var(--well-lowlight);
  transition:transform 120ms cubic-bezier(.22,1,.36,1),background 160ms cubic-bezier(.22,1,.36,1);
}
.nutrition-meal-mark { width:36px;height:36px;display:grid;place-items:center;border-radius:12px;background:var(--selection-bg);color:var(--selection-ink); }
.nutrition-meal-mark svg { width:16px;height:16px; }
.nutrition-meal b { font-size:12px; }
.nutrition-meal span { font-size:8px; }
.nutrition-meal strong { display:flex;align-items:baseline;gap:3px;color:var(--theme-strong);font-size:13px;white-space:nowrap; }
.nutrition-meal strong small { color:var(--ui-muted);font-size:7px;font-weight:500; }
.nutrition-empty { min-height:150px; }

.nutrition-editor-panel .reminder-form { gap:14px; }
.nutrition-natural-input textarea {
  min-height:128px !important;
  resize:none;
  padding:18px !important;
  font-size:17px !important;
  line-height:1.42;
}
.nutrition-natural-input small { margin:1px 4px 0;color:var(--ui-muted);font-size:9px;line-height:1.5; }
.nutrition-examples { display:flex;gap:7px;overflow-x:auto;padding:1px 1px 4px;scrollbar-width:none; }
.nutrition-examples::-webkit-scrollbar { display:none; }
.nutrition-examples button {
  min-height:36px;
  flex:0 0 auto;
  padding:0 12px;
  border:0;
  border-radius:12px;
  background:var(--well-bg);
  color:var(--theme-soft);
  box-shadow:inset 0 1px 0 var(--well-highlight),inset 0 -1px 0 var(--well-lowlight);
  font-size:9px;
}

.section-order-list { display:grid;gap:7px;margin-top:14px;contain:layout style; }
.section-order-item {
  position:relative;
  display:grid;
  grid-template-columns:minmax(0,1fr) 44px;
  min-height:66px;
  overflow:hidden;
  border-radius:17px;
  background:var(--well-bg);
  box-shadow:inset 0 1px 0 var(--well-highlight),inset 0 -1px 0 var(--well-lowlight);
  transition:opacity 150ms cubic-bezier(.22,1,.36,1),filter 150ms cubic-bezier(.22,1,.36,1),transform 180ms cubic-bezier(.22,1,.36,1);
  contain:layout paint;
}
.section-order-item > button { border:0;background:transparent;color:var(--theme-soft); }
.section-order-item > [data-toggle-section] {
  min-width:0;
  display:grid;
  grid-template-columns:34px minmax(0,1fr) auto;
  align-items:center;
  gap:10px;
  padding:10px 8px 10px 13px;
  text-align:left;
}
.section-order-item > [data-toggle-section] > svg { width:17px;height:17px;color:var(--selection-ink); }
.section-order-item > [data-toggle-section] span { min-width:0;display:grid;gap:3px; }
.section-order-item > [data-toggle-section] b { color:var(--theme-strong);font-size:11px;font-weight:600; }
.section-order-item > [data-toggle-section] small { overflow:hidden;color:var(--ui-muted);font-size:8px;text-overflow:ellipsis;white-space:nowrap; }
.section-order-item > [data-toggle-section] em {
  padding:5px 8px;
  border-radius:999px;
  background:var(--selection-bg);
  color:var(--selection-ink);
  font-size:7px;
  font-style:normal;
}
.section-drag-handle { display:grid;place-items:center;border-left:1px solid var(--well-border) !important;touch-action:none;cursor:grab; }
.section-drag-handle:active { cursor:grabbing; }
.section-drag-handle svg { width:18px;height:18px;color:var(--ui-muted); }
.section-order-item.disabled { opacity:.46;filter:saturate(.45); }
.section-order-item.disabled > [data-toggle-section] em { background:transparent;color:var(--ui-muted);box-shadow:inset 0 0 0 1px var(--well-border); }
.section-order-list.is-reordering { user-select:none;-webkit-user-select:none;touch-action:none; }
.section-order-list.is-reordering .section-order-item { will-change:transform; }
.section-order-item.drag-placeholder {
  opacity:.16;
  filter:saturate(.5);
  background:color-mix(in srgb,var(--active-bg) 32%,transparent);
  box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--active-border) 54%,transparent);
}
.section-drag-ghost {
  position:fixed !important;
  z-index:70;
  margin:0 !important;
  pointer-events:none;
  opacity:1 !important;
  filter:none !important;
  transform-origin:center;
  transition:none !important;
  box-shadow:0 8px 18px rgba(0,0,0,.3),inset 0 1px 0 var(--well-highlight),inset 0 -1px 0 var(--well-lowlight);
  will-change:transform;
}

@media (max-width:420px) {
  .nutrition-progress { grid-template-columns:136px minmax(0,1fr);gap:12px; }
  .nutrition-progress > div { left:68px; }
  .nutrition-progress svg { width:132px;height:132px; }
  .nutrition-progress aside { padding-left:14px; }
  .schedule-editor-page .schedule-dialog-card { padding-right:18px;padding-left:18px; }
}
@media (prefers-reduced-motion:reduce) {
  .section-order-item,.nutrition-meal { transition:none !important; }
}

/* Nutrition follows the same LA Beauty plate system as overview and cabinet. */
:root[data-theme] .nutrition-view > :is(.nutrition-hero,.nutrition-meals,.nutrition-week,.nutrition-goal) {
  position:relative;
  isolation:isolate;
  overflow:hidden;
  border:1px solid var(--plate-border);
  border-radius:var(--plate-radius);
  background:var(--plate-bg);
  background-size:125% 125%;
  box-shadow:
    inset 0 1px 0 var(--plate-highlight),
    inset 0 -1px 0 var(--plate-lowlight),
    var(--plate-shadow);
  backdrop-filter:blur(24px) saturate(1.18);
  -webkit-backdrop-filter:blur(24px) saturate(1.18);
}

.nutrition-view-title { align-items:end; }
.nutrition-view-title > div { display:grid;gap:4px; }
.nutrition-view-title > div > span { font-size:9px; }
.nutrition-add-action {
  min-height:43px;
  padding:0 14px;
  border:1px solid var(--well-border);
  border-radius:14px;
  background:var(--well-bg);
  color:var(--ui-text);
  box-shadow:inset 0 1px 0 var(--well-highlight),inset 0 -1px 0 var(--well-lowlight);
  transition:transform 140ms cubic-bezier(.22,1,.36,1),filter 160ms ease;
}
.nutrition-add-action:active { transform:scale(.975);filter:brightness(1.08); }

:root[data-theme] .nutrition-hero {
  padding:18px 20px 20px;
  border-right:0;
  border-left:0;
  border-radius:26px;
  background:
    radial-gradient(circle at 11% -8%,color-mix(in srgb,var(--ui-accent) 17%,transparent),transparent 38%),
    radial-gradient(circle at 92% 108%,color-mix(in srgb,var(--ui-accent-deep) 10%,transparent),transparent 42%),
    var(--plate-bg);
}
.nutrition-hero > header {
  min-height:47px;
  padding-bottom:14px;
  border-bottom:1px solid color-mix(in srgb,var(--plate-border) 76%,transparent);
}
.nutrition-hero > header > div { display:grid;gap:3px; }
.nutrition-hero > header span { margin:0; }
.nutrition-hero > header h2 { margin:0;font-size:16px;font-weight:650; }
.nutrition-hero header button {
  width:42px;
  min-width:42px;
  min-height:42px;
  border:1px solid var(--well-border);
  border-radius:14px;
  background:var(--well-bg);
  box-shadow:inset 0 1px 0 var(--well-highlight),inset 0 -1px 0 var(--well-lowlight);
  transition:transform 140ms cubic-bezier(.22,1,.36,1),background 160ms ease;
}
.nutrition-hero header button:active { transform:scale(.96); }

.nutrition-progress {
  position:relative;
  width:100%;
  height:auto;
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(118px,.72fr);
  align-items:stretch;
  justify-items:stretch;
  gap:0;
  margin:14px 0 0;
  padding:0;
}
.nutrition-progress > .nutrition-total {
  position:static;
  display:grid;
  align-content:center;
  gap:8px;
  min-width:0;
  padding:14px 17px 15px;
  border:1px solid var(--well-border);
  border-right:0;
  border-radius:17px 0 0 17px;
  background:var(--well-bg);
  box-shadow:inset 0 1px 0 var(--well-highlight),inset 0 -1px 0 var(--well-lowlight);
  text-align:left;
  transform:none;
}
.nutrition-total > span { margin:0;color:var(--ui-muted);font-size:9px; }
.nutrition-total > p { display:flex;align-items:baseline;gap:7px;margin:0; }
.nutrition-total > p strong { color:var(--ui-ink);font-size:38px;font-weight:650;line-height:.95; }
.nutrition-total > p small { color:var(--ui-muted);font-size:9px; }
.nutrition-meter {
  position:relative;
  overflow:hidden;
  width:100%;
  height:6px;
  border-radius:6px;
  background:var(--tray-bg);
  box-shadow:inset 0 1px 2px var(--plate-lowlight);
}
.nutrition-meter i {
  display:block;
  width:0;
  height:100%;
  border-radius:inherit;
  background:var(--ui-bar);
  box-shadow:0 0 12px color-mix(in srgb,var(--ui-accent) 23%,transparent);
  transition:width 420ms cubic-bezier(.22,1,.36,1);
}
.nutrition-progress aside {
  width:auto;
  display:grid;
  align-content:stretch;
  gap:0;
  padding:0;
  border:1px solid var(--well-border);
  border-left:1px solid color-mix(in srgb,var(--well-border) 76%,transparent);
  border-radius:0 17px 17px 0;
  background:color-mix(in srgb,var(--well-bg) 88%,transparent);
  box-shadow:inset 0 1px 0 var(--well-highlight),inset 0 -1px 0 var(--well-lowlight);
}
.nutrition-progress aside > span {
  display:grid;
  align-content:center;
  gap:4px;
  min-height:59px;
  padding:10px 13px;
}
.nutrition-progress aside > span + span { border-top:1px solid color-mix(in srgb,var(--well-border) 74%,transparent); }
.nutrition-progress aside small { color:var(--ui-muted);font-size:8px; }
.nutrition-progress aside b,.nutrition-progress aside strong {
  margin:0;
  color:var(--ui-ink);
  font-size:12px;
  font-weight:600;
  white-space:nowrap;
}
.nutrition-progress aside em { font-style:normal; }
.nutrition-progress aside strong { color:var(--ui-active-ink); }

:root[data-theme] :is(.nutrition-meals,.nutrition-week,.nutrition-goal) { padding:17px; }
.nutrition-meals .section-heading,.nutrition-week .section-heading { margin-bottom:14px; }
.nutrition-meals .section-heading > strong,.nutrition-week .section-heading > strong {
  align-self:center;
  color:var(--ui-text);
  font-size:10px;
  font-weight:600;
}
.nutrition-meals .section-heading h2,.nutrition-week .section-heading h2 { margin-top:3px;font-size:18px;font-weight:650; }
.nutrition-meal-list { gap:7px; }
.nutrition-meal {
  min-height:68px;
  border:1px solid var(--well-border);
  border-radius:var(--well-radius);
  background:var(--well-bg);
  box-shadow:inset 0 1px 0 var(--well-highlight),inset 0 -1px 0 var(--well-lowlight);
}
.nutrition-meal-mark {
  border:1px solid color-mix(in srgb,var(--active-border) 80%,transparent);
  border-radius:12px;
  background:var(--active-bg);
  color:var(--ui-active-ink);
  box-shadow:inset 0 1px 0 var(--well-highlight);
}
.nutrition-meal:active { transform:scale(.986);background:var(--active-bg); }
.nutrition-empty {
  min-height:122px;
  padding:18px;
  border:1px solid var(--well-border);
  border-radius:var(--well-radius);
  background:var(--well-bg);
  box-shadow:inset 0 1px 0 var(--well-highlight),inset 0 -1px 0 var(--well-lowlight);
}
.nutrition-empty > svg {
  width:38px;
  height:38px;
  padding:10px;
  border:1px solid var(--active-border);
  border-radius:13px;
  background:var(--active-bg);
  color:var(--ui-active-ink);
}

.nutrition-week-bars {
  height:126px;
  gap:7px;
  padding:13px 10px 9px;
  border:1px solid var(--well-border);
  border-radius:var(--well-radius);
  background:var(--well-bg);
  box-shadow:inset 0 1px 0 var(--well-highlight),inset 0 -1px 0 var(--well-lowlight);
}
.nutrition-week-bars span { gap:5px; }
.nutrition-week-bars i {
  min-height:4px;
  border-radius:7px 7px 3px 3px;
  background:var(--ui-bar);
  box-shadow:inset 0 1px 0 var(--well-highlight);
}
.nutrition-week-bars b { color:var(--ui-text);font-size:8px; }
.nutrition-week-bars small { color:var(--ui-muted);font-size:7px; }

.nutrition-goal {
  grid-template-columns:minmax(0,1fr) 92px;
  align-items:center;
  gap:9px;
}
.nutrition-goal label {
  min-height:58px;
  grid-template-columns:minmax(0,1fr) 70px auto;
  padding:8px 11px 8px 14px;
  border:1px solid var(--well-border);
  border-radius:var(--well-radius);
  background:var(--well-bg);
  box-shadow:inset 0 1px 0 var(--well-highlight),inset 0 -1px 0 var(--well-lowlight);
}
.nutrition-goal label > span { gap:4px; }
.nutrition-goal input {
  min-height:40px!important;
  border:0!important;
  border-radius:12px!important;
  background:var(--tray-bg)!important;
  box-shadow:inset 0 1px 2px var(--plate-lowlight)!important;
}
.nutrition-goal button { min-height:58px;border-radius:var(--well-radius); }

:root[data-theme="porcelain"] .nutrition-progress aside strong { color:#72172d; }
:root[data-theme="porcelain"] .nutrition-empty { background:var(--well-bg); }

@media (max-width:420px) {
  .nutrition-progress { grid-template-columns:minmax(0,1fr) 122px;gap:0; }
  .nutrition-progress > .nutrition-total { position:static;padding:13px 15px 14px;transform:none; }
  .nutrition-total > p strong { font-size:35px; }
  .nutrition-progress aside { padding:0; }
  .nutrition-goal { grid-template-columns:1fr; }
  .nutrition-goal button { width:100%; }
}

@media (max-width:350px) {
  .nutrition-progress { grid-template-columns:1fr; }
  .nutrition-progress > .nutrition-total { border-right:1px solid var(--well-border);border-radius:17px 17px 0 0; }
  .nutrition-progress aside { grid-template-columns:1fr 1fr;border-top:0;border-left:1px solid var(--well-border);border-radius:0 0 17px 17px; }
  .nutrition-progress aside > span + span { border-top:0;border-left:1px solid var(--well-border); }
}

@media (prefers-reduced-motion:reduce) {
  .nutrition-meter i,.nutrition-add-action,.nutrition-hero header button { transition:none!important; }
}

/* 2026-08-25: body profile and daily nutrition intelligence. */
body[data-view="nutrition-profile"] .bottom-nav {
  opacity:0;
  pointer-events:none;
  transform:translate3d(-50%,18px,0);
}
.nutrition-view-title > .nutrition-title-actions { display:flex;align-items:center;gap:7px; }
.nutrition-profile-action,
.nutrition-insight-settings {
  min-height:42px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  padding:0 12px;
  border:1px solid var(--product-control-border);
  border-radius:var(--product-action-radius);
  background:var(--well-bg);
  color:var(--theme-soft);
  box-shadow:inset 0 1px 0 var(--well-highlight),inset 0 -1px 0 var(--well-lowlight);
}
.nutrition-profile-action svg,.nutrition-insight-settings svg { width:15px;height:15px; }
.nutrition-insight {
  margin-bottom:12px;
  padding:17px;
  background:
    radial-gradient(circle at 88% 2%,color-mix(in srgb,var(--ui-accent) 9%,transparent),transparent 38%),
    var(--plate-bg);
}
.nutrition-insight .section-heading { margin-bottom:14px; }
.nutrition-insight .section-heading h2 { margin-top:3px;font-size:18px;font-weight:650;text-transform:none; }
.nutrition-insight-settings { width:42px;padding:0; }
.nutrition-profile-empty {
  min-height:92px;
  display:grid;
  grid-template-columns:42px minmax(0,1fr) auto;
  align-items:center;
  gap:11px;
  padding:13px;
  border:1px solid var(--well-border);
  border-radius:var(--well-radius);
  background:var(--well-bg);
  box-shadow:inset 0 1px 0 var(--well-highlight),inset 0 -1px 0 var(--well-lowlight);
}
.nutrition-profile-empty > span { width:40px;height:40px;display:grid;place-items:center;border-radius:13px;background:var(--active-bg);color:var(--ui-active-ink); }
.nutrition-profile-empty svg { width:18px;height:18px; }
.nutrition-profile-empty div { min-width:0; }
.nutrition-profile-empty b { display:block;color:var(--theme-strong);font-size:11px;line-height:1.35; }
.nutrition-profile-empty p { margin:4px 0 0;color:var(--ui-muted);font-size:8px;line-height:1.5; }
.nutrition-profile-empty button { min-height:38px;padding:0 11px;border:1px solid var(--active-border);border-radius:12px;background:var(--active-bg);color:var(--ui-active-ink);font-size:9px;font-weight:650; }
.nutrition-analysis { display:grid;gap:8px; }
.nutrition-balance,.nutrition-ranges,.nutrition-target-preview {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  overflow:hidden;
  border:1px solid var(--well-border);
  border-radius:var(--well-radius);
  background:var(--well-bg);
  box-shadow:inset 0 1px 0 var(--well-highlight),inset 0 -1px 0 var(--well-lowlight);
}
.nutrition-balance > span,.nutrition-ranges > span,.nutrition-target-preview > span { min-width:0;display:grid;gap:5px;padding:13px 11px; }
.nutrition-balance > span + span,.nutrition-ranges > span + span,.nutrition-target-preview > span + span { border-left:1px solid var(--well-border); }
.nutrition-balance small,.nutrition-ranges small,.nutrition-target-preview small { color:var(--ui-muted);font-size:7px; }
.nutrition-balance strong,.nutrition-ranges b,.nutrition-target-preview strong { overflow:hidden;color:var(--theme-strong);font-size:10px;font-weight:650;text-overflow:ellipsis;white-space:nowrap; }
.nutrition-balance > span:first-child strong { color:var(--ui-active-ink); }
.nutrition-macro-progress { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px; }
.nutrition-macro-progress > span { min-width:0;display:grid;grid-template-columns:1fr auto;gap:6px;padding:11px;border:1px solid var(--well-border);border-radius:15px;background:var(--well-bg);box-shadow:inset 0 1px 0 var(--well-highlight); }
.nutrition-macro-progress i { grid-column:1/-1;height:4px;overflow:hidden;border-radius:4px;background:linear-gradient(90deg,var(--ui-bar) 0 var(--macro-progress),var(--tray-bg) var(--macro-progress) 100%);transition:background 220ms cubic-bezier(.22,1,.36,1); }
.nutrition-macro-progress small { color:var(--ui-muted);font-size:7px; }
.nutrition-macro-progress b { color:var(--theme-soft);font-size:8px;font-weight:600;white-space:nowrap; }
.nutrition-ranges > span { padding:11px; }
.nutrition-ranges b { font-size:8px; }
.nutrition-estimate-note { margin:1px 3px 0;color:var(--ui-muted);font-size:7px;line-height:1.5; }

.nutrition-profile-page { width:min(100%,650px);margin:0 auto;padding-bottom:calc(36px + env(safe-area-inset-bottom)); }
.nutrition-profile-title { grid-template-columns:44px minmax(0,1fr) 44px;margin:5px 0 13px; }
.nutrition-profile-title > div { text-align:center; }
.nutrition-profile-title h2 { margin:0!important;padding:0!important;font-size:18px!important;font-weight:650!important;line-height:1.2!important;text-transform:none!important; }
.nutrition-profile-panel {
  width:calc(100% + 24px);
  margin-right:-12px;
  margin-left:-12px;
  padding:20px 23px 24px;
  border-right:0;
  border-left:0;
  border-radius:26px;
  background:
    radial-gradient(circle at 90% 0,color-mix(in srgb,var(--ui-accent) 10%,transparent),transparent 38%),
    var(--plate-bg);
}
.nutrition-profile-intro { display:grid;grid-template-columns:44px minmax(0,1fr);align-items:center;gap:12px;margin-bottom:18px;padding:13px;border:1px solid var(--well-border);border-radius:var(--well-radius);background:var(--well-bg);box-shadow:inset 0 1px 0 var(--well-highlight); }
.nutrition-profile-intro > span { width:42px;height:42px;display:grid;place-items:center;border-radius:14px;background:var(--active-bg);color:var(--ui-active-ink); }
.nutrition-profile-intro svg { width:19px;height:19px; }
.nutrition-profile-intro b { display:block;color:var(--theme-strong);font-size:11px; }
.nutrition-profile-intro p { margin:4px 0 0;color:var(--ui-muted);font-size:8px;line-height:1.5; }
.nutrition-profile-form { gap:14px; }
.nutrition-profile-form label > span:first-child { color:var(--theme-soft);font-size:9px; }
.nutrition-profile-form :is(input,.select-shell) { min-height:54px; }
.nutrition-profile-form input { width:100%; }
.nutrition-digest-toggle { min-height:70px; }
.nutrition-digest-toggle > span:last-child { min-width:0; }
.nutrition-digest-toggle b { display:block;color:var(--theme-strong);font-size:10px; }
.nutrition-digest-toggle small { display:block;margin-top:4px;color:var(--ui-muted);font-size:8px;line-height:1.45; }
.nutrition-target-preview { margin-top:1px; }
.nutrition-target-preview[hidden] { display:none; }
.nutrition-medical-note { margin:0 4px;color:var(--ui-muted);font-size:7px;line-height:1.55;text-align:center; }

@media (max-width:420px) {
  .nutrition-profile-action span { display:none; }
  .nutrition-profile-action { width:42px;padding:0; }
  .nutrition-profile-empty { grid-template-columns:38px minmax(0,1fr); }
  .nutrition-profile-empty > button { grid-column:1/-1;width:100%; }
  .nutrition-balance > span,.nutrition-ranges > span { padding:11px 8px; }
  .nutrition-profile-panel { padding:18px 20px 22px; }
}
@media (max-width:350px) {
  .nutrition-macro-progress { grid-template-columns:1fr; }
  .nutrition-profile-form .form-grid.two { grid-template-columns:1fr; }
}
@media (prefers-reduced-motion:reduce) {
  .nutrition-macro-progress i { transition:none; }
}

/* 2026-08-30: room-first schedule cards; instructor stays in event details. */
.schedule-entry-copy > .schedule-entry-room {
  display:flex;
  align-items:center;
  gap:4px;
  width:max-content;
  max-width:100%;
  margin-top:5px;
  color:var(--ui-text);
  font-size:10px;
  font-weight:600;
}
.schedule-entry-room svg {
  width:12px;
  height:12px;
  flex:0 0 auto;
  color:var(--schedule-color);
}

/* iOS-style tab scrubbing: the glass lens tracks horizontal intent, then settles. */
.bottom-nav {
  touch-action:none;
  -webkit-user-select:none;
  user-select:none;
}
.bottom-nav-lens {
  transition:filter 160ms cubic-bezier(.22,1,.36,1),box-shadow 160ms cubic-bezier(.22,1,.36,1);
}
.bottom-nav.is-scrubbing .bottom-nav-lens {
  filter:brightness(1.08) saturate(1.05);
  box-shadow:inset 0 0 0 1px var(--nav-lens-border),inset 0 1px 0 var(--plate-highlight),0 8px 22px rgba(0,0,0,.18) !important;
}
:root[data-theme] .bottom-nav button.is-preview,
:root[data-theme] .bottom-nav button.is-preview svg {
  color:var(--nav-active-ink) !important;
}
.bottom-nav.is-scrubbing button.active:not(.is-preview),
.bottom-nav.is-scrubbing button.active:not(.is-preview) svg {
  color:var(--ui-muted) !important;
}
@media (prefers-reduced-motion:reduce) {
  .bottom-nav-lens,
  .bottom-nav button {
    transition:none !important;
  }
}

/* 2026-09-01: a floating Telegram-style Liquid Glass tab bar. */
:root[data-theme="blxxdy"] {
  --nav-glass-base:linear-gradient(155deg,rgba(31,5,12,.88),rgba(4,0,2,.84));
  --nav-glass-edge:rgba(196,70,94,.19);
  --nav-glass-highlight:rgba(255,166,183,.13);
  --nav-glass-lowlight:rgba(0,0,0,.34);
  --nav-glass-shadow:rgba(0,0,0,.56);
  --nav-lens-glass:linear-gradient(150deg,rgba(104,24,42,.62),rgba(35,5,13,.49));
  --nav-lens-edge:rgba(226,112,132,.24);
  --nav-lens-glint:rgba(255,192,203,.20);
}
:root[data-theme="wine"] {
  --nav-glass-base:linear-gradient(155deg,rgba(40,16,31,.87),rgba(7,2,6,.83));
  --nav-glass-edge:rgba(211,151,177,.18);
  --nav-glass-highlight:rgba(255,222,235,.13);
  --nav-glass-lowlight:rgba(0,0,0,.30);
  --nav-glass-shadow:rgba(0,0,0,.52);
  --nav-lens-glass:linear-gradient(150deg,rgba(101,48,72,.58),rgba(37,14,29,.48));
  --nav-lens-edge:rgba(239,190,211,.23);
  --nav-lens-glint:rgba(255,232,242,.20);
}
:root[data-theme="graphite"] {
  --nav-glass-base:linear-gradient(155deg,rgba(37,39,44,.87),rgba(7,8,10,.84));
  --nav-glass-edge:rgba(225,228,234,.15);
  --nav-glass-highlight:rgba(255,255,255,.12);
  --nav-glass-lowlight:rgba(0,0,0,.34);
  --nav-glass-shadow:rgba(0,0,0,.55);
  --nav-lens-glass:linear-gradient(150deg,rgba(81,83,91,.55),rgba(29,30,35,.48));
  --nav-lens-edge:rgba(240,242,247,.20);
  --nav-lens-glint:rgba(255,255,255,.18);
}
:root[data-theme="porcelain"] {
  --nav-glass-base:linear-gradient(155deg,rgba(255,255,255,.92),rgba(244,225,232,.84));
  --nav-glass-edge:rgba(255,255,255,.82);
  --nav-glass-highlight:rgba(255,255,255,.92);
  --nav-glass-lowlight:rgba(92,20,39,.09);
  --nav-glass-shadow:rgba(78,12,29,.17);
  --nav-lens-glass:linear-gradient(150deg,rgba(255,255,255,.79),rgba(224,180,194,.49));
  --nav-lens-edge:rgba(112,22,43,.18);
  --nav-lens-glint:rgba(255,255,255,.92);
}

:root[data-theme] .bottom-nav {
  --nav-glint-x:50%;
  width:min(calc(100% - 32px),626px);
  gap:2px;
  padding:3px;
  overflow:hidden;
  border:1px solid var(--nav-glass-edge) !important;
  border-radius:25px;
  background:var(--nav-glass-base) !important;
  box-shadow:
    inset 0 1px 0 var(--nav-glass-highlight),
    inset 0 -1px 0 var(--nav-glass-lowlight),
    0 2px 4px color-mix(in srgb,var(--nav-glass-shadow) 42%,transparent),
    0 18px 42px var(--nav-glass-shadow) !important;
  -webkit-backdrop-filter:blur(30px) saturate(1.48) brightness(.94);
  backdrop-filter:blur(30px) saturate(1.48) brightness(.94);
}
:root[data-theme] .bottom-nav::before,
:root[data-theme] .bottom-nav::after {
  content:"";
  position:absolute;
  z-index:0;
  inset:0;
  border-radius:inherit;
  pointer-events:none;
}
:root[data-theme] .bottom-nav::before {
  background:radial-gradient(120px 34px at var(--nav-glint-x) -5%,var(--nav-glass-highlight),transparent 72%);
  opacity:.78;
  transition:opacity 160ms ease-out;
}
:root[data-theme] .bottom-nav::after {
  background:linear-gradient(180deg,transparent 42%,var(--nav-glass-lowlight) 130%);
  opacity:.62;
}
:root[data-theme] .bottom-nav-lens {
  --lens-glint-x:50%;
  z-index:1;
  overflow:hidden;
  scale:1;
  transform-origin:50% 50%;
  border:1px solid var(--nav-lens-edge) !important;
  border-radius:19px;
  background:var(--nav-lens-glass) !important;
  box-shadow:
    inset 0 1px 0 var(--nav-glass-highlight),
    inset 0 -1px 0 var(--nav-glass-lowlight),
    0 7px 18px color-mix(in srgb,var(--nav-glass-shadow) 54%,transparent) !important;
  filter:saturate(1.04);
  transition:
    scale 190ms cubic-bezier(.32,.72,0,1),
    filter 150ms cubic-bezier(.22,1,.36,1),
    box-shadow 180ms cubic-bezier(.22,1,.36,1);
}
:root[data-theme] .bottom-nav-lens::before {
  content:"";
  position:absolute;
  inset:0;
  border-radius:inherit;
  background:
    radial-gradient(52px 28px at var(--lens-glint-x) -4%,var(--nav-lens-glint),transparent 78%),
    linear-gradient(100deg,transparent 12%,color-mix(in srgb,var(--nav-lens-glint) 38%,transparent) 48%,transparent 82%);
  opacity:.72;
  pointer-events:none;
}
:root[data-theme] .bottom-nav button {
  z-index:2;
  min-height:52px;
  border-radius:19px;
  font-weight:520;
  opacity:.76;
  transition:color 150ms ease-out,opacity 150ms ease-out,transform 140ms cubic-bezier(.2,.8,.2,1);
}
:root[data-theme] .bottom-nav button svg {
  transition:transform 180ms cubic-bezier(.2,.8,.2,1),color 150ms ease-out;
}
:root[data-theme] .bottom-nav button:is(.active,.is-preview) {
  opacity:1;
  font-weight:620;
}
:root[data-theme] .bottom-nav button:is(.active,.is-preview) svg { transform:translateY(-1px) scale(1.055); }
:root[data-theme] .bottom-nav button:active { transform:scale(.965); }
:root[data-theme] .bottom-nav.is-touching::before { opacity:1; }
:root[data-theme] .bottom-nav.is-touching .bottom-nav-lens {
  scale:1.09 1.145;
}
:root[data-theme] .bottom-nav.is-scrubbing .bottom-nav-lens {
  scale:1.105 1.16;
  filter:brightness(1.055) saturate(1.08);
  box-shadow:
    inset 0 1px 0 var(--nav-glass-highlight),
    inset 0 -1px 0 var(--nav-glass-lowlight),
    0 10px 24px color-mix(in srgb,var(--nav-glass-shadow) 63%,transparent) !important;
}
.performance-mode .bottom-nav { contain:layout style; }

@supports not ((-webkit-backdrop-filter:blur(2px)) or (backdrop-filter:blur(2px))) {
  :root[data-theme] .bottom-nav { background:var(--nav-surface) !important; }
}
@media (prefers-reduced-transparency:reduce) {
  :root[data-theme] .bottom-nav { background:var(--nav-surface) !important; }
  :root[data-theme] .bottom-nav::before { display:none; }
}
@media (prefers-reduced-motion:reduce) {
  :root[data-theme] .bottom-nav::before,
  :root[data-theme] .bottom-nav button,
  :root[data-theme] .bottom-nav button svg,
  :root[data-theme] .bottom-nav-lens { transition:none !important; }
}

/* Shared horizontal gesture surface; only the selection layer moves. */
:root[data-theme] .scrub-segments { position:relative; isolation:isolate; touch-action:pan-y; user-select:none; }
:root[data-theme] .scrub-segments .calendar-mode-lens { transition:scale 160ms cubic-bezier(.32,.72,0,1); }
:root[data-theme] .scrub-segments.segment-held .calendar-mode-lens { scale:1 1.06; }
:root[data-theme] .scrub-segments button { position:relative; z-index:1; }
:root[data-theme] .schedule-week-strip.scrub-segments button.active {
  background:transparent; box-shadow:none; border-color:transparent;
}
:root[data-theme] .schedule-day-lens { border-radius:13px; }
:root[data-theme] .scrub-segments.segment-held button.is-preview { color:var(--text); }
/* One field scale and material throughout the schedule editor. */
:root[data-theme] #scheduleForm { display:grid; gap:16px; }
:root[data-theme] #scheduleForm > * { min-width:0; margin-top:0; margin-bottom:0; }
:root[data-theme] #scheduleForm label { display:grid; gap:8px; min-width:0; }
:root[data-theme] #scheduleForm label > span:not(.native-time-shell) { font-size:12px; line-height:1.4; }
:root[data-theme] #scheduleForm :is(.select-shell,.native-time-shell) {
  display:block; position:relative; width:100%; height:54px; min-height:54px;
  border-radius:18px; background:var(--theme-panel-soft); border:1px solid var(--theme-border);
  box-shadow:var(--inner-light); overflow:hidden;
}
:root[data-theme] #scheduleForm .select-shell select {
  position:relative; width:100%; height:54px; min-height:54px; padding:0 38px 0 14px;
  font-size:16px; line-height:normal; border:0; background:transparent; box-shadow:none;
}
:root[data-theme] #scheduleForm :is(input[type="text"],textarea) {
  width:100%; border-radius:18px; background:var(--theme-panel-soft); border:1px solid var(--theme-border);
  box-shadow:var(--inner-light); font-size:16px; padding:14px;
}
:root[data-theme] #scheduleForm .form-grid { gap:12px; }
:root[data-theme] #scheduleForm .native-time-shell output {
  position:absolute; inset:0; display:flex; align-items:center; justify-content:center;
  margin:0; padding:0 32px 0 12px; font-size:16px; line-height:1; pointer-events:none;
}
:root[data-theme] #scheduleForm .schedule-duration-presets { padding:4px; gap:5px; border-radius:16px; }
:root[data-theme] #scheduleForm .schedule-duration-presets button { min-height:40px; font-size:12px; }
:root[data-theme] #scheduleForm .category-create-trigger { min-height:42px; font-size:12px; border-radius:16px; }
:root[data-theme] #scheduleForm .disclosure-trigger { min-height:50px; font-size:13px; }
:root[data-theme] #scheduleForm .schedule-form-status:empty { display:none; }
:root[data-theme] #scheduleForm .primary-action { margin-top:2px; min-height:54px; }
:root[data-theme] [data-app-view="schedule"] .view-title button { transition:transform 140ms cubic-bezier(.2,.8,.2,1),background 160ms ease; }
:root[data-theme] [data-app-view="schedule"] .view-title button:active { transform:scale(.94); }
:is(#schedulePreferencesDialog,#schedulePhotoPickerDialog,#scheduleImportDialog)::backdrop { animation:schedule-backdrop-in 200ms ease both; }
:is(#schedulePreferencesDialog,#schedulePhotoPickerDialog,#scheduleImportDialog).is-closing::backdrop { animation:schedule-backdrop-out 170ms ease both; }
@keyframes schedule-backdrop-in { from {opacity:0} to {opacity:1} }
@keyframes schedule-backdrop-out { from {opacity:1} to {opacity:0} }
@media (prefers-reduced-motion:reduce) {
  :root[data-theme] [data-app-view="schedule"] .view-title button { transition:none; }
  :is(#schedulePreferencesDialog,#schedulePhotoPickerDialog,#scheduleImportDialog)::backdrop { animation:none!important; }
}
@media (prefers-reduced-motion:reduce) {
  :root[data-theme] .scrub-segments .calendar-mode-lens,
  :root[data-theme] .scrub-segments.segment-held .calendar-mode-lens { transition:none; scale:1; }
}