/* StarClock's observatory skin. Layout remains in style.css; this layer owns the atmosphere. */
:root {
  --ink:#202847;
  --muted:#65718d;
  --panel:rgba(255,255,255,.79);
  --line:#dfe5f8;
  --violet:#6255b9;
  --shadow:0 18px 48px rgba(54,62,123,.12),0 2px 7px rgba(54,62,123,.06);
  --shine:#ffdda1;
  font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC",sans-serif;
}
html { scroll-behavior:smooth; }
body {
  overflow-x:hidden;
  background:#e9ebfb;
  background-image:radial-gradient(ellipse 54% 48% at 87% 3%,#c2baf4 0,transparent 75%),radial-gradient(ellipse 42% 40% at 15% 78%,#d8e7ff 0,transparent 82%),linear-gradient(146deg,#f2f3ff 0%,#e2e6fa 51%,#d8def3 100%);
  background-attachment:fixed;
}
body::before {
  background:radial-gradient(ellipse 36% 24% at 18% 12%,#ffffff56,transparent 76%),radial-gradient(ellipse 43% 29% at 82% 78%,#b4a9ef30,transparent 78%);
  opacity:.5;
}
body::after {
  content:"";position:fixed;inset:-30%;z-index:0;pointer-events:none;
  background:radial-gradient(ellipse 34% 25% at 75% 22%,#d9aaff30,transparent 75%),radial-gradient(ellipse 28% 27% at 22% 74%,#90d2ff2b,transparent 80%);
  animation:sky-breathe 20s ease-in-out infinite alternate;
}
#phase-backdrop,.skyfield { position:fixed;inset:0;width:100%;height:100%;z-index:0;pointer-events:none; }
#phase-backdrop > i { position:absolute;inset:0;opacity:0;transition:opacity 1s ease-in-out; }
#phase-backdrop > i.active { opacity:1; }
.skyfield { opacity:0;transition:opacity 1s ease-in-out; }
.skyfield.active { opacity:1; }
#phase-backdrop > i[data-theme="light"][data-phase="idle"] { background:radial-gradient(ellipse 58% 48% at 87% 12%,#eff0ffbb,transparent 74%),linear-gradient(145deg,#e1e5fa 0%,#c3c9eb 52%,#a9b2d9 100%); }
#phase-backdrop > i[data-theme="light"][data-phase="focus"] { background:radial-gradient(ellipse 60% 52% at 88% 8%,#ffe9f3b8,transparent 72%),linear-gradient(145deg,#fbd0e6 0%,#d6a3e8 54%,#8e86d0 100%); }
#phase-backdrop > i[data-theme="light"][data-phase="break"] { background:radial-gradient(ellipse 53% 49% at 77% 8%,#fff7c8b3,transparent 74%),linear-gradient(150deg,#c0eaff 0%,#86cce9 54%,#dccf9e 100%); }
#phase-backdrop > i[data-theme="light"][data-phase="paused"] { background:radial-gradient(ellipse 57% 47% at 86% 8%,#e5dcffbd,transparent 74%),linear-gradient(145deg,#d9dcfa 0%,#b5aadf 55%,#858cbe 100%); }
#phase-backdrop > i[data-theme="dark"][data-phase="idle"] { background:radial-gradient(ellipse 49% 43% at 80% 0%,#34315b 0,transparent 72%),linear-gradient(145deg,#11132f,#181738 58%,#1c193d); }
#phase-backdrop > i[data-theme="dark"][data-phase="focus"] { background:radial-gradient(ellipse 49% 42% at 78% 3%,#64305d 0,transparent 72%),linear-gradient(145deg,#321730,#241734 58%,#14132e); }
#phase-backdrop > i[data-theme="dark"][data-phase="break"] { background:radial-gradient(ellipse 47% 40% at 78% 5%,#195969 0,transparent 72%),linear-gradient(145deg,#0c2a38,#103b45 58%,#102b3a); }
#phase-backdrop > i[data-theme="dark"][data-phase="paused"] { background:radial-gradient(ellipse 48% 43% at 80% 0%,#444171 0,transparent 72%),linear-gradient(145deg,#191a3d,#272344 57%,#1d2546); }
.app-shell,.auth-screen { position:relative;z-index:1; }
::selection { background:#ac9df1;color:#191c3a; }
button,input,select,textarea { -webkit-tap-highlight-color:transparent; }
button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible {
  outline:3px solid #b996ff;outline-offset:3px;
}

/* Navigation feels like a control deck floating above the sky. */
.sidebar {
  position:sticky;top:0;height:100vh;
  background:radial-gradient(circle at 20% 0%,#374680 0,transparent 48%),linear-gradient(174deg,#202849 0%,#171e3b 56%,#131a35 100%);
  border-right:1px solid #aab6ff4a;
  box-shadow:12px 0 45px #1a245328;
  color:#eef0ff;
}
.sidebar::before {
  content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(ellipse 95% 36% at 8% 7%,#a49bec19,transparent 76%),radial-gradient(ellipse 75% 26% at 99% 85%,#7894df13,transparent 80%);opacity:1;
  mask-image:linear-gradient(#000 0%,transparent 70%);
}
.sidebar > * { position:relative;z-index:1; }
.side-brand { margin:4px 0 13px;font-size:22px;letter-spacing:.02em;color:#fff;text-shadow:0 0 24px #f6d6ff6b; }
.side-brand img { width:41px;height:41px;border-radius:12px;box-shadow:0 0 0 1px #fff6,0 0 22px #c279ff99; }
.side-heading { color:#9faad3;letter-spacing:.18em; }
.side-item { color:#c4cce9;transition:transform .2s,background .2s,color .2s,box-shadow .2s; }
.side-item:hover:not(.active) { color:#fff;background:#ffffff14;transform:translateX(4px); }
.side-item.active {
  color:#fff;background:linear-gradient(100deg,#736cd4,#534da8);
  box-shadow:0 6px 20px #12183755,inset 0 1px #ffffff48;
}
.side-item .symbol { color:#d7d1ff;filter:drop-shadow(0 0 6px #b09cff55); }
.side-star { color:#d5dcf4;border:1px solid transparent; }
.side-star:hover:not(.active) { color:#fff;background:#ffffff12; }
.side-star.active { color:#fff;background:linear-gradient(105deg,#324e9a,#665bba);border-color:#bdc4ff66;box-shadow:0 8px 20px #060d2f55; }
.side-bottom { border-color:#c4ccff2b; }
.side-bottom .avatar { background:linear-gradient(135deg,#a88bdf,#d3b7ef);color:#251e53;box-shadow:0 0 15px #b99afe66; }
.account-row button { color:#b9c2e4; }

.workspace { padding-top:27px; }
.topbar { position:relative;z-index:3;margin-bottom:29px; }
.topnav {
  border:1px solid #ffffffc7;background:#fff9;
  box-shadow:0 10px 30px #6d70a326,inset 0 1px #fff;
  backdrop-filter:blur(24px) saturate(145%);
}
.topnav button { transition:background .2s,box-shadow .2s,color .2s,transform .2s; }
.topnav button:hover:not(.active) { transform:translateY(-1px);background:#e9e9fb;color:#554d9a; }
.topnav button.active { color:#43377f;background:linear-gradient(135deg,#e5dcff,#dfe6ff);box-shadow:0 3px 10px #55529b28,inset 0 1px #fff; }
.top-actions .button { border-radius:13px; }
.top-actions .button.primary { box-shadow:0 6px 20px #7167c944; }
.page-header { margin-bottom:24px; }
.page-header h1 { font-size:clamp(29px,3vw,42px);line-height:1.13;letter-spacing:-.045em; }
.page-header .eyebrow,.eyebrow { color:#7663ba;letter-spacing:.21em; }
.page-header p { font-size:15px; }

/* Frosted surfaces pick up a soft spotlight without moving the content. */
.panel,.goal-card,.auth-card {
  border:1px solid #ffffffd9;
  background:linear-gradient(142deg,#ffffffed,#f8f8ffcf 58%,#f1f0ffbf);
  box-shadow:var(--shadow),inset 0 1px #fff;
  backdrop-filter:blur(22px) saturate(150%);
}
.panel { position:relative;border-radius:23px;padding:22px;animation:rise-in .38s cubic-bezier(.2,.75,.2,1) both;transition:transform .25s,box-shadow .25s,border-color .25s; }
.panel::before {
  content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;opacity:0;
  background:radial-gradient(250px circle at var(--spot-x,50%) var(--spot-y,0%),#a99bff35,transparent 72%);
  transition:opacity .25s;
}
.panel:hover:not(.hero) { border-color:#d6d1ff;box-shadow:0 23px 50px #555ea522,0 2px 7px #555ea510; }
.panel:hover::before { opacity:1; }
.panel h2 { font-size:18px;letter-spacing:-.025em; }
.panel h3 { letter-spacing:-.01em; }
.stack > .panel:nth-child(2) { animation-delay:.06s; }
.stack > .panel:nth-child(3) { animation-delay:.12s; }
.stack > .panel:nth-child(4) { animation-delay:.18s; }
.stack > .panel:nth-child(5) { animation-delay:.24s; }
.grid > .panel:nth-child(2) { animation-delay:.09s; }
.grid > .panel:nth-child(3) { animation-delay:.15s; }

.hero {
  min-height:353px;padding:29px 32px;gap:24px;
  color:#fff;overflow:hidden;isolation:isolate;
  border-color:#c5a8ff7a;
  background:radial-gradient(circle at 15% 29%,#735bb967 0,transparent 35%),radial-gradient(ellipse at 84% 8%,#8956b665,transparent 43%),linear-gradient(132deg,#25244e 3%,#33295f 51%,#1c2b51 100%);
  box-shadow:0 23px 55px #42408954,inset 0 1px #ffffff5b,0 0 0 1px #ffffff20;
}
.hero::before {
  content:"";position:absolute;inset:-45%;z-index:0;pointer-events:none;opacity:.9;
  background:radial-gradient(ellipse 23% 27% at 31% 54%,#e69fd35a,transparent 72%),radial-gradient(ellipse 22% 30% at 80% 32%,#8584ff50,transparent 75%);
  animation:nebula-drift 17s ease-in-out infinite alternate;
}
.hero::after { content:none; }
.hero-stars { position:absolute;inset:0;width:100%;height:100%;z-index:1;pointer-events:none; }
body[data-phase="focus"] .hero { background:radial-gradient(circle at 21% 27%,#9c4f8b8a,transparent 37%),radial-gradient(circle at 86% 10%,#7e4c9e80,transparent 43%),linear-gradient(135deg,#382047,#4a265a 47%,#26264e); }
body[data-phase="break"] .hero { background:radial-gradient(circle at 24% 24%,#5bc1d390,transparent 38%),radial-gradient(circle at 88% 6%,#82c8da69,transparent 39%),linear-gradient(130deg,#15384d,#1a4c5e 53%,#243959); }
body[data-phase="paused"] .hero { background:radial-gradient(circle at 21% 25%,#8d83d176,transparent 39%),linear-gradient(132deg,#272a52,#3a335e 54%,#252951); }
.hero .eyebrow { color:#ffda9f;text-shadow:0 0 15px #ffbe89b0; }
.hero h1 { color:#fff;font-size:clamp(27px,2.65vw,38px);line-height:1.14;letter-spacing:-.04em;text-shadow:0 4px 22px #1116388c; }
.hero h1 .hero-phase-suffix { display:block;margin-top:8px;font-size:.56em;line-height:1.2;letter-spacing:.04em;opacity:.8; }
.hero p,.hero .subtle { color:#dce1f8; }
.hero .hero-content { position:relative;z-index:3; }
.hero .metric { background:#ffffff16;border-color:#ffffff28;box-shadow:inset 0 1px #ffffff20;backdrop-filter:blur(8px); }
.hero .metric strong { color:#fff;font-size:23px;text-shadow:0 0 15px #f2d7ff55; }
.hero .metric span { color:#cbd2f0; }
.hero .button { background:#ffffff19;border-color:#ffffff4e;color:#fff;box-shadow:0 5px 14px #13143b35; }
.hero .button:hover:not(:disabled) { background:#ffffff34; }
.hero .button.primary { background:linear-gradient(115deg,#ffdf9f,#f2afca);color:#3e2b50;border-color:#ffe3b8;box-shadow:0 8px 23px #efafba4c,inset 0 1px #fff8; }
.hero .button.primary:hover:not(:disabled) { background:linear-gradient(115deg,#ffeabb,#f8c2d5);box-shadow:0 11px 28px #efafba77; }

/* A layered dial with minute marks, glass, orbiting stars and a live progress halo. */
.clock {
  --phase-glow:#d3b8ff;--phase-accent:#ffd38d;--readout-surface:#faf8ff;
  width:min(270px,100%);z-index:3;border:9px solid #ede7fb;
  background:radial-gradient(circle at 39% 31%,#fff 0 24%,#f5f1ff 64%,#d7d0ed 100%);
  box-shadow:0 0 0 1px #fff9,0 0 0 5px #b7a5e64a,0 0 0 11px #dac8fa29,0 0 48px #d4b5ff78,0 18px 40px #0d113d80,inset 0 0 0 3px #aaa0c9,inset 0 0 22px #8d80af6a;
  animation:clock-float 6s ease-in-out infinite;
}
.clock::before { inset:7px;border:1px solid #b7add0;z-index:3;box-shadow:inset 0 0 0 1px #fff9,inset 0 0 13px #b1a2d04d; }
.clock::after {
  content:"";position:absolute;inset:6px;border-radius:50%;pointer-events:none;z-index:1;
  background:conic-gradient(from 0deg,#7162b3 0,var(--phase-accent) var(--progress,8%),#a69abf3d var(--progress,8%) 100%);
  mask:radial-gradient(farthest-side,transparent calc(100% - 15px),#000 calc(100% - 14px));
  filter:drop-shadow(0 0 5px var(--phase-glow));
}
.clock .dial-face { position:absolute;inset:16px;z-index:0;border-radius:50%;background:radial-gradient(circle at 38% 24%,#fff 0%,#fffdfd 35%,#f4f1fc 79%,#e5dff1 100%);box-shadow:inset 0 3px 9px #fff,inset 0 -10px 22px #afa2c04d,0 0 0 1px #c8bfd5a6; }
.clock .dial-face::after { content:"";position:absolute;inset:24%;border:1px solid #b8accb31;border-radius:50%;box-shadow:0 0 0 14px #fff7,inset 0 0 20px #d2c5e637; }
.clock .clock-stars { position:absolute;inset:16%;width:68%;height:68%;z-index:1;pointer-events:none; }
.clock .ticks { inset:9px;z-index:2; }
.clock .tick::before { left:calc(50% - .5px);top:6px;width:1px;height:6px;background:#aa9fc2a9;box-shadow:none; }
.clock .tick.major::before { left:calc(50% - 1px);top:4px;width:2px;height:12px;background:#8476a4; }
.clock .tick.quarter::before { left:calc(50% - 1.5px);top:2px;width:3px;height:19px;background:#574c83;box-shadow:0 0 5px #7d6d9b33; }
.clock .hand { z-index:3;width:5px;left:calc(50% - 2.5px);height:31%;border:1px solid #55487b;background:linear-gradient(#72589f,#3b316f);box-shadow:0 0 7px #8269b0ad,1px 1px 2px #fff9;transform:rotate(var(--hand-angle,0deg));transition:transform .9s linear; }
.clock .hand::after { content:"";position:absolute;top:3px;left:1px;width:1px;height:68%;background:#fff9;border-radius:2px; }
.clock .center { z-index:4;width:19px;height:19px;left:calc(50% - 9.5px);top:calc(50% - 9.5px);background:radial-gradient(circle at 33% 27%,#fff7d0 0,#f9d384 35%,#d99f4c 100%);box-shadow:0 0 0 4px #ffdb8a4d,0 0 18px #f6bc65,0 2px 4px #916f4e70; }
.clock .readout { z-index:4;top:68%;left:50%;width:max-content;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:5px;padding:7px 14px;border-radius:50%;background:radial-gradient(ellipse,var(--readout-surface) 0 40%,transparent 79%);line-height:1;color:#363750;font-size:21px;letter-spacing:-.035em;text-shadow:0 1px #fff; }
.clock .phase { margin:0;color:#686b88;font-size:11px;line-height:1.2;letter-spacing:.02em; }
.clock.break .readout { top:59%; }
.clock-local-time { position:absolute;z-index:4;bottom:14px;left:50%;transform:translateX(-50%);padding:3px 8px;border:1px solid #fff;border-radius:999px;background:#ffffffc9;box-shadow:0 2px 10px #5b7b9433;color:#3f5c72;font-size:12px;font-weight:800;letter-spacing:.01em;white-space:nowrap; }
.clock.focus { --phase-glow:#fc91ca;--phase-accent:#ffd280;--readout-surface:#fff6fc;border-color:#f7ddec;background:radial-gradient(circle,#fff 0 30%,#fff2fa 69%,#e8cde5);box-shadow:0 0 0 1px #fff9,0 0 0 5px #e9aedb55,0 0 0 11px #f5aed92b,0 0 52px #ec91d47c,0 18px 38px #160b2e7a,inset 0 0 0 3px #d6a9cc,inset 0 0 23px #cb9fc67a; }
.clock.break { --phase-glow:#77e6ed;--phase-accent:#9ee9f5;--readout-surface:#f3fdff;border-color:#d8f4f9;background:radial-gradient(circle,#fff 0 30%,#effcff 69%,#caeff5);box-shadow:0 0 0 1px #fff9,0 0 0 5px #a6e7f455,0 0 0 11px #a6e7f42b,0 0 52px #72dcea7a,0 18px 38px #0a2a3975,inset 0 0 0 3px #a7d8e4,inset 0 0 23px #a1d6de7a; }
.clock.paused { --phase-glow:#b9a9ff;--phase-accent:#c7bdfd;--readout-surface:#f8f6ff;border-color:#e7e2f6;background:radial-gradient(circle at 40% 30%,#fff 0 28%,#f3f0ff 68%,#d9d4ed);box-shadow:0 0 0 1px #fff9,0 0 0 5px #afa4d63f,0 0 0 11px #c3b9e424,0 0 24px #a89cc848,0 18px 38px #17193350,inset 0 0 0 3px #afa5ce,inset 0 0 22px #9389b15c;filter:none;animation-play-state:paused; }

.button { position:relative;overflow:hidden;border-radius:12px;transition:transform .2s,background .2s,box-shadow .2s,border-color .2s; }
.button:hover:not(:disabled) { transform:translateY(-2px);box-shadow:0 9px 20px #5c5b9e2c; }
.button:active:not(:disabled) { transform:translateY(0) scale(.98); }
.button.primary { background:linear-gradient(125deg,#7465c9,#4f5fae);border-color:#7868c8;box-shadow:0 6px 16px #7664bd42; }
.button.primary:hover:not(:disabled) { background:linear-gradient(125deg,#8775da,#5b69bf); }
.button.gold { background:linear-gradient(125deg,#fff5d7,#ffe8b4);border-color:#efd39a; }
.button.danger { background:#fff4f6; }
.item,.goal-card,.subtask,.task-row,.metric { transition:background .2s,border-color .2s,transform .2s,box-shadow .2s; }
.item { border-radius:15px;border-color:#e1e1f4;background:#ffffffa6; }
.item:hover { border-color:#c8c2ed;background:#fff; }
.item.selected { border-color:#eed29b;background:linear-gradient(130deg,#fffaf0,#ffeddb);box-shadow:0 4px 16px #d7ad5a25; }
.blocked-actions { display:grid;grid-template-columns:repeat(2,minmax(0,1fr)); }
.blocked-actions .button { width:100%;min-height:38px;justify-content:center;line-height:1.2;white-space:normal; }
.task-row { border:1px solid #edf0fa;background:#f8f8ffb8;border-radius:10px; }
.task-row:hover { background:#fff;border-color:#d8d3f5; }
.metric { border-color:#e7e9fa;background:#fafaffc9; }
.metric strong { color:#4a498c; }
.status-chip { background:#eeeafb;color:#6457a9; }
.status-chip.gold { background:#fff1cc;color:#886429; }
.empty { background:radial-gradient(circle at 50% 3%,#f4eeff,#ffffff78 66%);border-color:#cfc9e9; }
.empty .emoji { color:#a488e0;text-shadow:0 0 18px #b490ec88;animation:star-pulse 4s ease-in-out infinite; }
.goal-card { border-radius:22px;padding:22px;box-shadow:var(--shadow); }
.goal-top h2 { font-size:24px;letter-spacing:-.025em; }
.progress { height:10px;background:#e9e8f8;box-shadow:inset 0 1px 3px #69609d20; }
.progress span { background:linear-gradient(90deg,#e9b960,#d492ce 48%,#7776d5);box-shadow:0 0 12px #dba6b18c; }
.forecast { background:linear-gradient(120deg,#f4f0ff,#ecf1ff);border:1px solid #e5e2fa; }
.target { border-left-color:#b6a7e9; }
.subtask { background:#f5f3ff; }
.goal-date-range { margin-top:3px; }
.plan-draft-summary { display:flex;justify-content:space-between;align-items:baseline;gap:10px;padding:3px 2px;color:var(--ink); }
.plan-draft-summary span { color:var(--muted);font-size:12px;font-weight:700; }
.plan-draft-guidance { margin:5px 2px 14px; }
.plan-draft-entry { padding:14px;border:1px solid rgba(255,255,255,.85);border-radius:17px;background:linear-gradient(135deg,rgba(255,255,255,.82),rgba(239,236,255,.75));box-shadow:0 7px 22px rgba(73,65,135,.08),inset 0 1px rgba(255,255,255,.92); }
.plan-draft-head { display:flex;align-items:flex-start;gap:10px; }
.plan-draft-star { display:grid;place-items:center;flex:none;width:28px;height:28px;border-radius:10px;color:#8661b9;background:linear-gradient(135deg,#f9e3fa,#e7e3ff); }
.plan-draft-copy { display:grid;gap:3px;min-width:0;flex:1; }
.plan-draft-copy strong { overflow-wrap:anywhere; }
.plan-draft-copy small,.plan-draft-detail { color:var(--muted);font-size:11px; }
.plan-draft-actions { display:flex;gap:4px;flex:none; }
.plan-draft-actions .button { width:28px;height:28px;padding:0;box-shadow:none; }
.plan-draft-detail { margin:8px 0 0 38px; }
.plan-draft-reasons { display:flex;flex-wrap:wrap;align-items:center;gap:5px;margin:10px 0 0 38px;color:var(--muted);font-size:11px; }
.plan-draft-reason { padding:4px 7px;border:1px solid rgba(151,134,213,.2);border-radius:20px;color:#665396;background:rgba(231,221,255,.55);font-weight:700; }
.modal:has(.relationship-header) { width:min(720px,100%); }
.relationship-header { padding:20px;border:1px solid rgba(255,255,255,.72);border-radius:20px;background:linear-gradient(135deg,rgba(255,255,255,.78),rgba(231,228,255,.61));box-shadow:inset 0 1px rgba(255,255,255,.9); }
.risk-headline { padding:13px 15px;border:1px solid rgba(190,168,232,.32);border-radius:15px;background:linear-gradient(125deg,rgba(232,221,255,.63),rgba(255,243,220,.55));font-weight:700; }
.risk-headline strong { color:#7653a6;font-size:1.22em; }
.risk-metrics { margin:16px 0; }
.risk-metrics .metric { min-width:0; }
.risk-bottleneck { margin:10px 0 17px;color:var(--muted);line-height:1.6;overflow-wrap:anywhere; }
.risk-bottleneck strong { color:var(--ink); }
.risk-adjustments { margin-top:17px; }
body.dark .risk-headline { border-color:rgba(210,185,255,.27);background:linear-gradient(125deg,rgba(116,93,167,.28),rgba(147,113,114,.19)); }
body.dark .risk-headline strong { color:#ebd5ff; }
.relationship-header h2 { margin:4px 0 6px;overflow-wrap:anywhere; }
.relationship-header p { margin:0 0 9px;color:var(--muted);font-size:12px; }
.relationship-id { display:flex;flex-wrap:wrap;gap:4px;color:var(--muted);font-size:11px; }
.relationship-id code { overflow-wrap:anywhere;user-select:text;color:var(--ink);font-size:11px; }
.relationship-progress { height:7px;margin-top:14px;border-radius:20px;background:rgba(129,119,182,.18);overflow:hidden; }
.relationship-progress span { display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#e7b968,#bb8ed5,#7779d4);box-shadow:0 0 12px rgba(180,145,218,.54); }
.relationship-metrics { display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin:14px 0 10px; }
.relationship-metric { display:grid;gap:4px;padding:12px;border:1px solid rgba(255,255,255,.72);border-radius:14px;background:rgba(255,255,255,.54); }
.relationship-metric span { color:var(--muted);font-size:11px;font-weight:700; }
.relationship-metric strong { color:var(--ink);font-size:20px; }
.relationship-counts { display:flex;flex-wrap:wrap;gap:6px; }
.relationship-count { padding:5px 9px;border:1px solid rgba(148,139,201,.22);border-radius:20px;background:rgba(240,235,255,.62);color:var(--muted);font-size:11px; }
.relationship-count strong { color:var(--ink); }
.relationship-section { margin-top:19px; }
.relationship-section h3 { margin:0 0 10px;font-size:15px; }
.relationship-list { display:grid;gap:9px; }
.relationship-entry,.relationship-session { min-width:0;padding:14px;border:1px solid rgba(255,255,255,.76);border-radius:16px;background:linear-gradient(135deg,rgba(255,255,255,.75),rgba(239,237,255,.56));box-shadow:inset 0 1px rgba(255,255,255,.75); }
.relationship-entry-head { display:flex;align-items:flex-start;justify-content:space-between;gap:10px; }
.relationship-entry-head strong { min-width:0;overflow-wrap:anywhere; }
.relationship-entry-head .status-chip { flex:none; }
.relationship-entry-head .subtle { text-align:right;font-size:11px; }
.relationship-details { display:flex;flex-wrap:wrap;gap:5px 14px;margin-top:9px;color:var(--muted);font-size:11px; }
.relationship-note { margin-top:8px;color:var(--muted);font-size:11px; }
.relationship-tags { display:flex;flex-wrap:wrap;gap:5px;margin-top:9px; }
.relationship-tags span { padding:3px 7px;border-radius:20px;background:rgba(226,214,252,.65);color:#6b509b;font-size:11px;font-weight:700; }
body.dark .relationship-header,body.dark .relationship-entry,body.dark .relationship-session { border-color:rgba(222,213,255,.22);background:linear-gradient(135deg,rgba(102,101,157,.35),rgba(46,53,96,.55));box-shadow:inset 0 1px rgba(255,255,255,.14); }
body.dark .relationship-metric { border-color:rgba(222,213,255,.2);background:rgba(157,149,217,.12); }
body.dark .relationship-count { border-color:rgba(214,205,255,.2);background:rgba(143,132,193,.16); }
body.dark .relationship-tags span { background:rgba(152,125,205,.28);color:#e9d4ff; }
@media (max-width:540px) { .relationship-metrics { grid-template-columns:repeat(2,minmax(0,1fr)); }.relationship-entry-head { flex-wrap:wrap; }.relationship-entry-head .subtle { text-align:left; } }
body.dark .plan-draft-entry { border-color:rgba(212,199,255,.28);background:linear-gradient(135deg,rgba(84,82,143,.58),rgba(44,52,96,.78));box-shadow:0 9px 25px rgba(4,7,27,.28),inset 0 1px rgba(255,255,255,.2); }
body.dark .plan-draft-star { color:#f3d6ff;background:linear-gradient(135deg,rgba(157,120,208,.55),rgba(107,108,177,.4)); }
body.dark .plan-draft-reason { border-color:rgba(204,180,255,.22);color:#eee1ff;background:rgba(155,124,209,.22); }
@media(max-width:520px) { .plan-draft-summary { align-items:start;flex-direction:column;gap:2px; }.plan-draft-head { flex-wrap:wrap; }.plan-draft-actions { margin-left:38px; }.plan-draft-detail,.plan-draft-reasons { margin-left:0; } }
.calendar .day { transition:transform .16s,box-shadow .16s,filter .16s; }
.archive-overview-grid { align-items:start; }
.calendar .day:hover { transform:scale(1.14);z-index:1;box-shadow:0 3px 10px #5b54a74d;filter:saturate(1.35); }
.calendar .day[data-archived="true"] { position:relative; }
.calendar .day[data-archived="true"]::after { content:"";position:absolute;right:2px;bottom:2px;width:4px;height:4px;border-radius:50%;background:#c88858;box-shadow:0 0 0 1px #ffffffab,0 0 6px #d69a70a6; }
.calendar .day[aria-current="date"] { position:relative;z-index:2;outline:2px solid #7254b7;outline-offset:2px;box-shadow:0 0 0 4px #e9e2fb; }
body.dark .calendar .day[aria-current="date"] { outline-color:#f6d28f;box-shadow:0 0 0 4px #232744; }
.calendar-detail { position:fixed;z-index:9;width:min(340px,calc(100vw - 24px));max-height:calc(100vh - 24px);overflow:auto;padding:16px;border:1px solid rgba(255,255,255,.82);border-radius:20px;color:var(--ink);background:linear-gradient(145deg,rgba(255,255,255,.94),rgba(240,237,255,.88));box-shadow:0 20px 55px rgba(28,28,82,.27),inset 0 1px #fff;-webkit-backdrop-filter:blur(26px) saturate(170%);backdrop-filter:blur(26px) saturate(170%);animation:modal-enter .18s ease-out both; }
.calendar-detail[hidden] { display:none; }
.calendar-detail-head { display:flex;align-items:flex-start;justify-content:space-between;gap:10px; }
.calendar-detail-head h3 { margin:2px 0 13px;font-size:16px;letter-spacing:-.015em; }
.calendar-detail-close { display:grid;place-items:center;flex:none;width:27px;height:27px;border:1px solid var(--glass-rim);border-radius:9px;color:var(--muted);background:rgba(255,255,255,.62);font-size:18px;line-height:1; }
.calendar-detail-close:hover { color:var(--ink);background:rgba(255,255,255,.88); }
.calendar-detail-metrics { display:grid;grid-template-columns:1fr 1fr;gap:9px;padding-bottom:12px;border-bottom:1px solid var(--line); }
.calendar-detail-metrics > div { display:grid;gap:3px;padding:10px;border-radius:12px;background:linear-gradient(145deg,rgba(239,233,255,.86),rgba(255,255,255,.55)); }
.calendar-detail-metrics span,.calendar-detail-task small { color:var(--muted);font-size:11px; }
.calendar-detail-metrics strong { font-size:14px; }
.calendar-detail-list h4 { margin:13px 0 8px;color:var(--muted);font-size:11px;letter-spacing:.06em; }
.calendar-detail-list > p { margin:8px 0 2px;color:var(--muted);font-size:12px; }
.calendar-detail-task { display:grid;grid-template-columns:15px minmax(0,1fr) auto;align-items:start;gap:8px;padding:8px 1px;border-top:1px solid var(--line); }
.calendar-detail-task > span { color:#a782d3;font-size:13px; }
.calendar-detail-task > div { display:grid;gap:2px;min-width:0; }
.calendar-detail-task strong { overflow-wrap:anywhere;font-size:12px; }
.calendar-detail-task b { white-space:nowrap;color:var(--violet);font-size:11px; }
body.dark .calendar-detail { border-color:rgba(221,209,255,.35);background:linear-gradient(145deg,rgba(62,66,113,.94),rgba(31,39,75,.94));box-shadow:0 24px 60px rgba(2,5,28,.63),inset 0 1px rgba(255,255,255,.28); }
body.dark .calendar-detail-close { background:rgba(104,103,161,.32); }
body.dark .calendar-detail-close:hover { background:rgba(130,118,184,.48); }
body.dark .calendar-detail-metrics > div { background:linear-gradient(145deg,rgba(126,110,171,.32),rgba(68,75,135,.28)); }
body.dark .calendar-detail-task b { color:#e6c9ff; }
.archive-day-row { background:linear-gradient(120deg,rgba(255,255,255,.73),rgba(247,244,255,.52));box-shadow:inset 0 1px rgba(255,255,255,.72); }
.archive-session-controls { display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin:0 0 14px;padding:10px 12px;border:1px solid rgba(181,177,225,.45);border-radius:14px;background:linear-gradient(125deg,rgba(255,255,255,.67),rgba(236,234,255,.39));box-shadow:inset 0 1px rgba(255,255,255,.76);color:var(--muted);font-size:12px; }
.archive-session-controls .button-row { gap:7px; }
.archive-session-controls label { display:flex;align-items:center;gap:7px;white-space:nowrap;color:var(--muted); }
.archive-session-controls select { width:auto;min-width:64px;margin:0;padding:5px 24px 5px 9px;border-radius:10px;font-size:12px; }
body.dark .archive-session-controls { border-color:rgba(208,203,255,.22);background:linear-gradient(125deg,rgba(116,111,172,.24),rgba(54,64,115,.31));box-shadow:inset 0 1px rgba(255,255,255,.13); }
.archive-session-cards { display:none; }
@media (max-width:600px) {
  .archive-session-table { display:none; }
  .archive-session-cards { display:grid;gap:9px; }
  .archive-session-card { min-width:0;padding:12px 13px;border:1px solid var(--glass-rim);border-radius:15px;background:linear-gradient(135deg,rgba(255,255,255,.77),rgba(241,239,255,.56));box-shadow:inset 0 1px var(--glass-shine),0 8px 19px rgba(44,39,91,.08); }
  .archive-session-card > strong { display:block;overflow-wrap:anywhere;color:var(--ink);font-size:13px; }
  .archive-session-card > p { margin:5px 0 10px;overflow-wrap:anywhere;color:var(--muted);font-size:11px; }
  .archive-session-card dl { display:grid;gap:6px;margin:0;padding-top:9px;border-top:1px solid var(--line); }
  .archive-session-card dl > div { display:flex;justify-content:space-between;gap:12px; }
  .archive-session-card dt { color:var(--muted);font-size:11px; }
  .archive-session-card dd { margin:0;color:var(--ink);font-size:11px;font-weight:700;text-align:right; }
  body.dark .archive-session-card { background:linear-gradient(135deg,rgba(99,94,155,.44),rgba(54,62,116,.42)); }
}
@media (max-width:480px) { .archive-session-controls { align-items:flex-start;flex-direction:column; }.archive-session-controls .button-row { width:100%;justify-content:space-between; } }
@media (max-width:360px) { .archive-session-controls .button-row { flex-wrap:nowrap; }.archive-session-controls label { gap:0;font-size:0; }.archive-session-controls select { font-size:12px; }.archive-day-list { overflow-x:hidden; }.archive-day-row { flex-direction:column;gap:6px; }.archive-day-total { justify-items:start; } }
body.dark .archive-day-row { background:linear-gradient(120deg,rgba(76,78,132,.67),rgba(53,61,109,.55));box-shadow:inset 0 1px rgba(255,255,255,.16); }
body.dark .archive-day-tasks > span { background:rgba(119,112,176,.28); }
.archive-day-tasks > .archive-day-group { background:rgba(221,173,124,.24);color:var(--ink); }
body.dark .archive-day-tasks > .archive-day-group { background:rgba(238,187,131,.18);color:#f6dfbd; }
body.dark .archive-day-total strong { color:#e6c9ff; }
.calendar .day[data-level="1"] { background:#d9cbf5; }
.calendar .day[data-level="2"] { background:#ae98df; }
.calendar .day[data-level="3"] { background:#8d70cc; }
.calendar .day[data-level="4"] { background:#6650a9; }
.chart-bars div { background:linear-gradient(#ffe2a6,#c692de 54%,#756ec3);box-shadow:0 0 7px #bb9be388;transition:height .5s; }
.setting-row { border-color:#e8e8f5; }
.shortcut-list { display:grid;gap:8px;margin:2px 0 16px; }
.shortcut-row { display:flex;align-items:center;justify-content:space-between;gap:10px;min-width:0;padding:9px 10px;border:1px solid var(--line);border-radius:12px;background:rgba(255,255,255,.27); }
.shortcut-row span { min-width:0;color:var(--muted);font-size:13px;font-weight:700; }
.shortcut-row kbd { flex:none;padding:5px 8px;border:1px solid var(--line);border-radius:8px;background:rgba(255,255,255,.5);box-shadow:0 2px 7px rgba(57,55,103,.1);color:var(--ink);font:700 11px/1.2 -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;white-space:nowrap; }
body.dark .shortcut-row { background:rgba(157,148,223,.12); }
body.dark .shortcut-row kbd { background:rgba(205,194,255,.12); }
.archive-group-head { display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap; }
.archive-group-head strong { min-width:0;overflow-wrap:anywhere; }
.disclosure summary:hover { color:#6650b4; }
.modal-backdrop { background:#111b40a8;backdrop-filter:blur(15px) saturate(125%); }
.modal { border-radius:25px;background:linear-gradient(145deg,#fff,#f7f4ff);box-shadow:0 28px 95px #090f326e,0 0 0 1px #ffffff8a;animation:modal-enter .25s cubic-bezier(.2,.8,.2,1) both; }
.modal h2 { letter-spacing:-.025em; }
input,select,textarea { border-color:#d3d5ed;background:#fcfcff;transition:border-color .2s,box-shadow .2s,background .2s; }
input:hover,select:hover,textarea:hover { border-color:#b6b0df; }
input:focus,select:focus,textarea:focus { border-color:#8d7dd1;box-shadow:0 0 0 4px #ad9fe536; }
#toast { border:1px solid #d0baff72;background:linear-gradient(115deg,#383268,#54549d);box-shadow:0 12px 30px #12183e73,0 0 25px #aa8fef4d; }

/* Night mode gives panels depth while preserving bright controls and legible data. */
body.dark {
  --ink:#f0f0ff;--muted:#b7bddb;--line:#4a4b78;--panel:#252848dd;--shadow:0 20px 55px #05091e75,0 2px 7px #080e2670;
  background:#11172e;background-image:radial-gradient(ellipse 49% 43% at 80% 0%,#40366b 0,transparent 72%),radial-gradient(ellipse 46% 39% at 8% 83%,#143657 0,transparent 74%),linear-gradient(145deg,#171b38,#101b35 60%,#17132f);
}
body.dark::before { opacity:.26; }
body.dark::after { opacity:.7; }
body.dark .sidebar { background:radial-gradient(circle at 19% 0%,#354176,transparent 46%),linear-gradient(174deg,#1b2547,#121b37 61%,#10172e); }
body.dark .panel,body.dark .goal-card,body.dark .auth-card {
  background:linear-gradient(145deg,#2b2f51df,#222846e8 67%,#292448e3);
  border-color:#9e95d13b;box-shadow:var(--shadow),inset 0 1px #ffffff18;
}
body.dark .panel:hover:not(.hero) { border-color:#b9a4ec77;box-shadow:0 23px 57px #050a257f,0 0 25px #9e72ec16; }
body.dark .hero { border-color:#c7a7ff70;background:radial-gradient(circle at 17% 25%,#7d5eb275,transparent 35%),radial-gradient(circle at 89% 8%,#6a4e9a82,transparent 42%),linear-gradient(132deg,#2b2555,#352a63 52%,#1e2c53); }
body.dark[data-phase="focus"] .hero { background:radial-gradient(circle at 16% 26%,#a0508f85,transparent 39%),linear-gradient(135deg,#392248,#462856 50%,#252751); }
body.dark[data-phase="break"] .hero { background:radial-gradient(circle at 16% 24%,#3a9db48c,transparent 38%),linear-gradient(130deg,#17384d,#1a485a 55%,#1f344f); }
body.dark[data-phase="paused"] .hero { background:radial-gradient(circle at 18% 25%,#7775c97b,transparent 38%),linear-gradient(132deg,#27294d,#342e58 55%,#202849); }
body.dark .topnav { background:#323655b9;border-color:#b7b6ec4a;box-shadow:0 8px 22px #070b1e71,inset 0 1px #ffffff24; }
body.dark .topnav button.active { color:#fff;background:linear-gradient(130deg,#7771c1,#605da2);box-shadow:0 3px 13px #11163c66; }
body.dark .topnav button:hover:not(.active) { color:#fff;background:#ffffff1c; }
body.dark .item,body.dark .task-row,body.dark .metric,body.dark .subtask { background:#353956b8;border-color:#8f8fb238; }
body.dark .item:hover,body.dark .task-row:hover { background:#3b4163;border-color:#b4a7dc81; }
body.dark .item.selected { background:linear-gradient(130deg,#4b415a,#54475f);border-color:#e1bf8099; }
body.dark .forecast { background:#414162;border-color:#8278aa75; }
body.dark .empty { background:radial-gradient(circle at 50% 0%,#474268,#2e34538c 70%);border-color:#827caf; }
body.dark .metric strong { color:#fff; }
body.dark .status-chip { background:#585276;color:#f4eaff; }
body.dark .status-chip.gold { background:#6f5a3d;color:#ffe6ad; }
body.dark .status-chip.red { background:#70475d;color:#ffdeeb; }
body.dark .setting-row,body.dark .disclosure { border-color:#777ba261; }
body.dark .disclosure summary { color:#d6c9ff; }
body.dark .disclosure summary:hover { color:#fff; }
body.dark .message { background:#414569;color:#e9e9ff; }
body.dark .button { background:#363b60;border-color:#696e9c;color:#f0eeff; }
body.dark .button:hover:not(:disabled) { background:#484c76;box-shadow:0 8px 22px #0a103687; }
body.dark .button.primary { background:linear-gradient(125deg,#8173d9,#5c6abd);border-color:#8b81db;color:#fff; }
body.dark .button.gold { background:linear-gradient(125deg,#67563c,#80664a);border-color:#aa8558;color:#ffe5ab; }
body.dark .button.danger { background:#50374e;border-color:#875772;color:#ffd3e3; }
body.dark .hero .button { background:#ffffff1c;border-color:#ffffff4d;color:#fff; }
body.dark .hero .button.primary { background:linear-gradient(115deg,#ffdf9f,#f2afca);color:#3e2b50;border-color:#ffe3b8; }
body.dark input,body.dark select,body.dark textarea { background:#2b3154;border-color:#656b9a;color:#f3f2ff; }
body.dark input:focus,body.dark select:focus,body.dark textarea:focus { border-color:#b1a0f0;box-shadow:0 0 0 4px #a28ee642; }
body.dark .modal { background:linear-gradient(145deg,#303253,#222845);border-color:#b7a9e263; }
body.dark .calendar .day[data-level="1"] { background:#6e5e9f; }
body.dark .calendar .day[data-level="2"] { background:#9473bf; }
body.dark .calendar .day[data-level="3"] { background:#c498d7;color:#222040; }
body.dark .calendar .day[data-level="4"] { background:#f6d28f;color:#2c2844; }
body.dark .calendar .day[data-level="0"] { background:#4c5577;color:#e2e5f6;border:1px solid #a4a5c137; }

/* Each timer phase follows the desktop app's own scene: constellation, focus sky, island. */
body:not(.dark)[data-phase="idle"] {
  background-image:radial-gradient(ellipse 58% 48% at 87% 12%,#eff0ffbb,transparent 74%),linear-gradient(145deg,#e1e5fa 0%,#c3c9eb 52%,#a9b2d9 100%);
}
body:not(.dark)[data-phase="focus"] {
  background-image:radial-gradient(ellipse 60% 52% at 88% 8%,#ffe9f3b8,transparent 72%),linear-gradient(145deg,#fbd0e6 0%,#d6a3e8 54%,#8e86d0 100%);
}
body:not(.dark)[data-phase="break"] {
  background-image:radial-gradient(ellipse 53% 49% at 77% 8%,#fff7c8b3,transparent 74%),linear-gradient(150deg,#c0eaff 0%,#86cce9 54%,#dccf9e 100%);
}
body:not(.dark)[data-phase="paused"] {
  background-image:radial-gradient(ellipse 57% 47% at 86% 8%,#e5dcffbd,transparent 74%),linear-gradient(145deg,#d9dcfa 0%,#b5aadf 55%,#858cbe 100%);
}
body.dark[data-phase="idle"] {
  background-image:radial-gradient(ellipse 49% 43% at 80% 0%,#34315b 0,transparent 72%),linear-gradient(145deg,#11132f,#181738 58%,#1c193d);
}
body.dark[data-phase="focus"] {
  background-image:radial-gradient(ellipse 49% 42% at 78% 3%,#64305d 0,transparent 72%),linear-gradient(145deg,#321730,#241734 58%,#14132e);
}
body.dark[data-phase="break"] {
  background-image:radial-gradient(ellipse 47% 40% at 78% 5%,#195969 0,transparent 72%),linear-gradient(145deg,#0c2a38,#103b45 58%,#102b3a);
}
body.dark[data-phase="paused"] {
  background-image:radial-gradient(ellipse 48% 43% at 80% 0%,#444171 0,transparent 72%),linear-gradient(145deg,#191a3d,#272344 57%,#1d2546);
}
body[data-phase="break"]::after {
  background:radial-gradient(ellipse 37% 30% at 72% 19%,#fff9cb55,transparent 75%),radial-gradient(ellipse 40% 29% at 15% 82%,#f6f1d03b,transparent 80%);
}
body[data-phase="focus"]::after {
  background:radial-gradient(ellipse 34% 27% at 75% 22%,#ffe0e254,transparent 75%),radial-gradient(ellipse 38% 28% at 22% 72%,#e8aaff3b,transparent 80%);
}
body:not(.dark) .hero {
  color:#34334f;
  border-color:#ffffffc9;
  background:radial-gradient(circle at 82% 12%,#ffffff79,transparent 47%),linear-gradient(135deg,#f5f5ffeb,#e4e7f9db 60%,#dce4f4d9);
  box-shadow:0 20px 50px #535e9640,inset 0 1px #fff;
}
body:not(.dark)[data-phase="focus"] .hero {
  background:radial-gradient(circle at 82% 12%,#fff0f9ac,transparent 47%),linear-gradient(135deg,#fff2f9ec,#f4d9f2df 58%,#e4daf5dc);
  box-shadow:0 20px 50px #755d9e45,inset 0 1px #fff;
}
body:not(.dark)[data-phase="break"] .hero {
  background:radial-gradient(circle at 83% 10%,#fff9d5a6,transparent 48%),linear-gradient(135deg,#f0fcffec,#d7f2f5e8 58%,#ccebeee0);
  box-shadow:0 20px 50px #3d83934a,inset 0 1px #fff;
}
body:not(.dark)[data-phase="paused"] .hero {
  background:radial-gradient(circle at 81% 12%,#f5eaff9c,transparent 47%),linear-gradient(135deg,#f4f2ffeb,#e5def7e3 60%,#d8def4d9);
}
body:not(.dark) .hero::before { opacity:.42;background:radial-gradient(ellipse 24% 28% at 80% 30%,#ffffff96,transparent 74%);animation:none; }
body:not(.dark) .hero .eyebrow { color:#916e41;text-shadow:none; }
body:not(.dark)[data-phase="focus"] .hero .eyebrow { color:#9a5687; }
body:not(.dark)[data-phase="break"] .hero .eyebrow { color:#3d8792; }
body:not(.dark) .hero h1 { color:#32344f;text-shadow:none; }
body:not(.dark) .hero p,body:not(.dark) .hero .subtle { color:#69718c; }
body:not(.dark) .hero .metric { background:#ffffff86;border-color:#ffffffab;box-shadow:inset 0 1px #fff; }
body:not(.dark) .hero .metric strong { color:#343950;text-shadow:none; }
body:not(.dark) .hero .metric span { color:#6a738d; }
body:not(.dark) .hero .button { background:#ffffff93;border-color:#ffffffdb;color:#414665;box-shadow:0 4px 12px #51597b1b; }
body:not(.dark) .hero .button:hover:not(:disabled) { background:#fff; }
body:not(.dark) .hero .button.primary { background:linear-gradient(120deg,#8e83d5,#6d77c1);border-color:#8684cd;color:#fff;box-shadow:0 7px 20px #7576ba46; }
body:not(.dark)[data-phase="focus"] .hero .button.primary { background:linear-gradient(120deg,#c176b9,#9d72c9);border-color:#bb83c5; }
body:not(.dark)[data-phase="break"] .hero .button.primary { background:linear-gradient(120deg,#54aaba,#438fa7);border-color:#58a6b4; }
body.dark[data-phase="break"] .hero::before { background:radial-gradient(ellipse 27% 31% at 83% 26%,#9feafa38,transparent 75%); }
body.dark[data-phase="focus"] .hero::before { background:radial-gradient(ellipse 27% 31% at 83% 26%,#ffb4e14c,transparent 75%); }

/* Frosted surfaces mirror the desktop app's layered material and glass controls. */
body {
  --glass-rim:rgba(255,255,255,.72);
  --glass-shine:rgba(255,255,255,.75);
  --glass-depth:rgba(62,70,137,.16);
}
body.dark {
  --glass-rim:rgba(224,222,255,.32);
  --glass-shine:rgba(255,255,255,.33);
  --glass-depth:rgba(3,7,31,.45);
}
.panel,.goal-card,.auth-card,.modal,.topnav,.button,.item,.metric,.task-row,.subtask,.side-item.active,.side-star.active {
  -webkit-backdrop-filter:blur(19px) saturate(170%);
  backdrop-filter:blur(19px) saturate(170%);
}
.item-title { display:flex;align-items:center;flex-wrap:wrap;gap:6px; }
.queue-number { display:inline-grid;place-items:center;flex:none;width:25px;height:25px;border:1px solid #9f9dd16b;border-radius:50%;background:linear-gradient(145deg,#ffffffb0,#cac9f17d);box-shadow:inset 0 1px #fff9,0 3px 8px #393f7926;color:#545485;font-size:11px;font-weight:800; }
.queue-name { min-width:0;overflow-wrap:anywhere; }
.user-text { overflow-wrap:anywhere; }
.favorite-mark { color:#e7aa3f;font-size:14px;text-shadow:0 0 12px #ffd26b80; }
body.dark .queue-number { color:#f4eaff;border-color:#e1c9ff65;background:linear-gradient(145deg,#c4b4ff5a,#72659e65);box-shadow:inset 0 1px #fff5,0 3px 9px #080b2c54; }
body.dark .favorite-mark { color:#ffcf79;text-shadow:0 0 12px #ffbd5788; }
@media (max-width:480px) {
  .item[data-location="today"] > .item-head { flex-wrap:wrap; }
  .item[data-location="today"] > .item-head > .item-title { flex:1 1 100%; }
  .item[data-location="today"] > .item-head > .item-actions { margin-left:auto; }
}
.panel,.goal-card,.auth-card {
  border-color:var(--glass-rim);
  background:linear-gradient(143deg,rgba(255,255,255,.75),rgba(255,255,255,.53) 54%,rgba(239,239,255,.58));
  box-shadow:0 19px 48px var(--glass-depth),inset 0 1px var(--glass-shine),inset 1px 0 rgba(255,255,255,.28),inset 0 -1px rgba(109,105,164,.12);
  -webkit-backdrop-filter:blur(28px) saturate(175%) brightness(1.04);
  backdrop-filter:blur(28px) saturate(175%) brightness(1.04);
}
.panel { isolation:isolate; }
.panel:not(.hero) > * { position:relative;z-index:1; }
.panel::after,.hero::after {
  content:"";position:absolute;inset:1px;z-index:0;border-radius:inherit;pointer-events:none;
  background:linear-gradient(155deg,rgba(255,255,255,.56),rgba(255,255,255,.12) 20%,transparent 43%),linear-gradient(90deg,rgba(255,255,255,.24),transparent 8%);
  mask-image:linear-gradient(#000,transparent 42%);
  opacity:.6;transition:opacity .28s ease;
}
.panel:hover::after { opacity:.85; }
body.dark .panel,body.dark .goal-card,body.dark .auth-card {
  border-color:var(--glass-rim);
  background:linear-gradient(145deg,rgba(73,71,116,.66),rgba(33,38,76,.63) 60%,rgba(46,44,85,.69));
  box-shadow:0 22px 54px var(--glass-depth),inset 0 1px var(--glass-shine),inset 1px 0 rgba(218,213,255,.09),inset 0 -1px rgba(5,8,35,.3);
}
.hero,body.dark .hero {
  border-color:var(--glass-rim);
  -webkit-backdrop-filter:blur(30px) saturate(180%);
  backdrop-filter:blur(30px) saturate(180%);
  box-shadow:0 25px 55px var(--glass-depth),inset 0 1px var(--glass-shine),inset 1px 0 rgba(255,255,255,.18),inset 0 -1px rgba(40,37,97,.16);
}
body:not(.dark)[data-phase="idle"] .hero { background:linear-gradient(135deg,rgba(255,255,255,.71),rgba(238,238,255,.54) 62%,rgba(230,238,255,.57)); }
body:not(.dark)[data-phase="focus"] .hero { background:linear-gradient(135deg,rgba(255,245,253,.75),rgba(248,221,244,.58) 62%,rgba(235,224,251,.58)); }
body:not(.dark)[data-phase="break"] .hero { background:linear-gradient(135deg,rgba(246,254,255,.77),rgba(217,246,249,.58) 62%,rgba(212,240,242,.58)); }
body:not(.dark)[data-phase="paused"] .hero { background:linear-gradient(135deg,rgba(249,247,255,.75),rgba(231,226,250,.58) 62%,rgba(220,230,250,.6)); }
body.dark[data-phase="idle"] .hero { background:linear-gradient(135deg,rgba(70,69,120,.70),rgba(37,40,82,.68) 62%,rgba(36,47,91,.67)); }
body.dark[data-phase="focus"] .hero { background:linear-gradient(135deg,rgba(102,51,99,.70),rgba(67,38,89,.70) 58%,rgba(43,39,83,.68)); }
body.dark[data-phase="break"] .hero { background:linear-gradient(135deg,rgba(34,99,119,.69),rgba(26,73,95,.70) 59%,rgba(31,61,84,.68)); }
body.dark[data-phase="paused"] .hero { background:linear-gradient(135deg,rgba(73,70,124,.71),rgba(44,43,89,.70) 60%,rgba(36,48,89,.70)); }
.hero .metric {
  border-color:rgba(255,255,255,.34);
  background:linear-gradient(135deg,rgba(255,255,255,.19),rgba(255,255,255,.08));
  box-shadow:inset 0 1px rgba(255,255,255,.36),0 3px 10px rgba(31,31,72,.08);
  -webkit-backdrop-filter:blur(13px) saturate(160%);
  backdrop-filter:blur(13px) saturate(160%);
}
body:not(.dark) .hero .metric { background:linear-gradient(135deg,rgba(255,255,255,.68),rgba(255,255,255,.38));border-color:rgba(255,255,255,.76); }
.topnav {
  border-color:var(--glass-rim);
  background:linear-gradient(135deg,rgba(255,255,255,.67),rgba(246,244,255,.48));
  box-shadow:0 10px 28px var(--glass-depth),inset 0 1px var(--glass-shine),inset 0 -1px rgba(123,116,186,.12);
  -webkit-backdrop-filter:blur(27px) saturate(180%);
  backdrop-filter:blur(27px) saturate(180%);
}
body.dark .topnav { border-color:var(--glass-rim);background:linear-gradient(135deg,rgba(83,81,132,.57),rgba(34,40,82,.58));box-shadow:0 10px 28px var(--glass-depth),inset 0 1px var(--glass-shine); }
.topnav button.active { background:linear-gradient(135deg,rgba(236,229,255,.8),rgba(215,223,255,.58));box-shadow:inset 0 1px rgba(255,255,255,.85),0 4px 12px rgba(72,65,141,.16); }
body.dark .topnav button.active { background:linear-gradient(135deg,rgba(151,139,216,.65),rgba(112,113,185,.52));box-shadow:inset 0 1px rgba(255,255,255,.32),0 4px 12px rgba(8,9,40,.25); }
.button { border-color:rgba(255,255,255,.68);background:linear-gradient(145deg,rgba(255,255,255,.76),rgba(244,243,255,.48));box-shadow:inset 0 1px rgba(255,255,255,.82),0 4px 13px rgba(72,67,128,.12); }
.button:hover:not(:disabled) { border-color:rgba(255,255,255,.92);box-shadow:inset 0 1px #fff,0 8px 22px rgba(76,68,146,.25); }
body.dark .button { border-color:rgba(231,223,255,.33);background:linear-gradient(145deg,rgba(116,114,169,.34),rgba(67,73,128,.25));box-shadow:inset 0 1px rgba(255,255,255,.27),0 4px 13px rgba(5,6,28,.24); }
body.dark .button:hover:not(:disabled) { border-color:rgba(242,236,255,.54);background:linear-gradient(145deg,rgba(151,143,205,.43),rgba(86,91,151,.35)); }
.button.primary,body.dark .button.primary { box-shadow:inset 0 1px rgba(255,255,255,.56),0 7px 18px rgba(79,70,151,.25); }
.hero .button,body.dark .hero .button { border-color:rgba(255,255,255,.48);box-shadow:inset 0 1px rgba(255,255,255,.45),0 6px 15px rgba(22,23,69,.19); }
body:not(.dark) .hero .button { background:linear-gradient(145deg,rgba(255,255,255,.77),rgba(255,255,255,.42));border-color:rgba(255,255,255,.79); }
body:not(.dark) .hero .button.primary,body.dark .hero .button.primary { box-shadow:inset 0 1px rgba(255,255,255,.58),0 8px 23px rgba(73,63,129,.25); }
.item,.task-row,.metric,.subtask { background:linear-gradient(135deg,rgba(255,255,255,.69),rgba(255,255,255,.40));border-color:rgba(255,255,255,.72);box-shadow:inset 0 1px rgba(255,255,255,.59); }
body.dark .item,body.dark .task-row,body.dark .metric,body.dark .subtask { background:linear-gradient(135deg,rgba(136,134,185,.19),rgba(92,96,153,.13));border-color:rgba(227,219,255,.18);box-shadow:inset 0 1px rgba(255,255,255,.16); }
.modal { border-color:var(--glass-rim);background:linear-gradient(145deg,rgba(255,255,255,.86),rgba(242,240,255,.78));box-shadow:0 30px 90px rgba(23,24,70,.38),inset 0 1px #fff;-webkit-backdrop-filter:blur(36px) saturate(180%);backdrop-filter:blur(36px) saturate(180%); }
body.dark .modal { border-color:var(--glass-rim);background:linear-gradient(145deg,rgba(68,70,119,.86),rgba(36,42,80,.82));box-shadow:0 30px 90px rgba(2,3,23,.62),inset 0 1px rgba(255,255,255,.29); }
.modal-backdrop { -webkit-backdrop-filter:blur(14px) saturate(125%);backdrop-filter:blur(14px) saturate(125%); }
.confirm-backdrop { position:fixed;inset:0;z-index:50;display:grid;place-items:center;padding:20px;background:rgba(12,18,47,.65);-webkit-backdrop-filter:blur(18px) saturate(135%);backdrop-filter:blur(18px) saturate(135%); }
.confirm-dialog { position:relative;width:min(410px,100%);overflow:hidden;padding:28px;border:1px solid rgba(255,255,255,.83);border-radius:28px;color:var(--ink);background:linear-gradient(145deg,rgba(255,255,255,.94),rgba(238,234,255,.85));box-shadow:0 34px 100px rgba(14,16,55,.46),inset 0 1px #fff;-webkit-backdrop-filter:blur(36px) saturate(180%);backdrop-filter:blur(36px) saturate(180%);animation:modal-enter .24s cubic-bezier(.2,.8,.2,1) both; }
.confirm-dialog::before { content:"";position:absolute;inset:-80px auto auto -70px;width:245px;height:245px;border-radius:50%;background:radial-gradient(circle,rgba(222,167,206,.30),transparent 68%);pointer-events:none; }
.confirm-dialog > * { position:relative; }
.confirm-emblem { display:grid;place-items:center;width:52px;height:52px;margin-bottom:20px;border:1px solid rgba(255,255,255,.92);border-radius:17px;color:#a44f80;font-size:29px;background:linear-gradient(145deg,rgba(255,242,250,.94),rgba(241,210,229,.80));box-shadow:inset 0 1px #fff,0 8px 25px rgba(149,70,118,.22);text-shadow:0 0 12px rgba(238,135,200,.55); }
.confirm-emblem.gold { color:#9b6d29;background:linear-gradient(145deg,#fff8df,#f2e1b0);box-shadow:inset 0 1px #fff,0 8px 25px rgba(144,104,42,.20); }
.confirm-eyebrow { display:block;margin-bottom:5px;color:#816c9d;font-size:11px;font-weight:800;letter-spacing:.18em; }
.confirm-dialog h2 { margin:0 0 12px;font-size:24px;letter-spacing:-.035em;line-height:1.25; }
.confirm-dialog p { margin:12px 0 0;color:var(--muted);font-size:14px;line-height:1.65; }
.confirm-dialog p.confirm-impact { padding:9px 11px;border:1px solid rgba(176,93,131,.22);border-radius:11px;background:rgba(255,223,234,.66);color:#813e64;font-weight:750; }
.confirm-subject { display:inline-block;max-width:100%;overflow-wrap:anywhere;padding:7px 12px;border:1px solid rgba(150,130,194,.19);border-radius:11px;background:rgba(255,255,255,.44);font-weight:700; }
.confirm-actions { display:flex;justify-content:flex-end;gap:10px;margin-top:26px; }
.confirm-actions .button { min-width:105px;min-height:44px;border-radius:13px; }
.confirm-actions .button.danger { color:#fff;border-color:rgba(167,68,105,.72);background:linear-gradient(145deg,#bc7097,#914f7c);box-shadow:inset 0 1px rgba(255,255,255,.28),0 8px 18px rgba(131,55,98,.25); }
.confirm-actions .button.danger:hover { background:linear-gradient(145deg,#c67da2,#9d5785); }
.confirm-actions .button.gold { color:#684d24;border-color:#dfc98f;background:linear-gradient(145deg,#fff0bc,#e8cf84);box-shadow:inset 0 1px rgba(255,255,255,.7),0 8px 18px rgba(131,101,43,.20); }
.confirm-actions .button:focus-visible { outline:3px solid #9181d6;outline-offset:3px; }
body.dark .confirm-dialog { border-color:rgba(223,216,255,.38);background:linear-gradient(145deg,rgba(75,69,120,.94),rgba(36,41,78,.91));box-shadow:0 35px 100px rgba(1,3,24,.7),inset 0 1px rgba(255,255,255,.28); }
body.dark .confirm-dialog p.confirm-impact { border-color:rgba(242,172,202,.3);background:rgba(152,83,127,.24);color:#ffe4ef; }
body.dark .confirm-dialog::before { background:radial-gradient(circle,rgba(182,104,162,.25),transparent 68%); }
body.dark .confirm-eyebrow { color:#d6bae7; }
body.dark .confirm-subject { border-color:rgba(237,220,255,.20);background:rgba(232,211,255,.11); }
body.dark .confirm-actions .button.soft { color:#f1ecff;border-color:rgba(230,222,255,.25);background:rgba(238,232,255,.12); }
body.dark .confirm-actions .button.danger { color:#fff;border-color:rgba(229,167,202,.42);background:linear-gradient(145deg,#ad6892,#874e7e);box-shadow:inset 0 1px rgba(255,255,255,.27),0 9px 22px rgba(10,6,36,.31); }
body.dark .confirm-actions .button.gold { color:#604922;border-color:#eddbaf;background:linear-gradient(145deg,#fff1c5,#e9d18f); }
@media (max-width:480px) { .confirm-backdrop { padding:16px; }.confirm-dialog { padding:24px;border-radius:24px; }.confirm-actions .button { flex:1; } }
@media (max-width:360px) { .confirm-actions .button { padding:9px 7px;font-size:13px;white-space:nowrap; } }
.modal input,.modal select,.modal textarea,.setting-row select {
  background:linear-gradient(145deg,rgba(255,255,255,.75),rgba(247,245,255,.52));
  border-color:rgba(255,255,255,.79);
  box-shadow:inset 0 1px rgba(255,255,255,.78),0 3px 10px rgba(82,76,144,.09);
  -webkit-backdrop-filter:blur(12px) saturate(150%);
  backdrop-filter:blur(12px) saturate(150%);
}
body.dark .modal input,body.dark .modal select,body.dark .modal textarea,body.dark .setting-row select {
  background:linear-gradient(145deg,rgba(94,98,151,.44),rgba(49,56,105,.46));
  border-color:rgba(223,218,255,.28);
  box-shadow:inset 0 1px rgba(255,255,255,.19);
}
#toast { border-color:rgba(244,229,255,.4);background:linear-gradient(120deg,rgba(66,55,114,.85),rgba(76,81,158,.8));box-shadow:0 12px 30px rgba(16,16,54,.38),inset 0 1px rgba(255,255,255,.32);-webkit-backdrop-filter:blur(16px) saturate(165%);backdrop-filter:blur(16px) saturate(165%); }
@media (max-width:760px) { #toast { bottom:calc(92px + env(safe-area-inset-bottom));width:max-content;max-width:calc(100vw - 24px);text-align:center;white-space:normal; } }
.sidebar { -webkit-backdrop-filter:blur(28px) saturate(155%);backdrop-filter:blur(28px) saturate(155%); }
body.dark .sidebar { background:linear-gradient(170deg,rgba(34,45,88,.86),rgba(19,29,61,.85) 62%,rgba(16,25,54,.87)); }
.side-item.active,.side-star.active { box-shadow:inset 0 1px rgba(255,255,255,.36),0 7px 18px rgba(8,13,47,.27); }
@media (max-width:760px) {
  .topnav { background:linear-gradient(145deg,rgba(255,255,255,.81),rgba(250,249,255,.69)); }
  body.dark .topnav { background:linear-gradient(145deg,rgba(55,61,108,.78),rgba(30,39,81,.81)); }
}
@supports not ((-webkit-backdrop-filter:blur(1px)) or (backdrop-filter:blur(1px))) {
  .panel,.goal-card,.auth-card,.modal,.topnav { background-color:rgba(249,249,255,.94); }
  body.dark .panel,body.dark .goal-card,body.dark .auth-card,body.dark .modal,body.dark .topnav { background-color:rgba(38,43,79,.95); }
}

@keyframes rise-in { from { opacity:.58;transform:translateY(8px) scale(.996); } to { opacity:1;transform:translateY(0) scale(1); } }
@keyframes modal-enter { from { opacity:0;transform:translateY(15px) scale(.97); } to { opacity:1;transform:translateY(0) scale(1); } }
@keyframes clock-float { 0%,100% { transform:translateY(0); } 50% { transform:translateY(-6px); } }
@keyframes nebula-drift { 0% { transform:translate(-2%,1%) rotate(-2deg); } 100% { transform:translate(3%,-2%) rotate(2deg); } }
@keyframes sky-breathe { 0% { transform:translate(-1%,-1%) scale(1); } 100% { transform:translate(2%,1%) scale(1.08); } }
@keyframes star-pulse { 0%,100% { opacity:.55;transform:scale(.9) rotate(0); } 50% { opacity:1;transform:scale(1.15) rotate(12deg); } }
@keyframes burst-out { 0% { opacity:0;transform:translate(-50%,-50%) scale(.25) rotate(0); } 15% { opacity:1; } 100% { opacity:0;transform:translate(calc(-50% + var(--dx)),calc(-50% + var(--dy))) scale(.2) rotate(135deg); } }
.star-burst { position:fixed;z-index:40;pointer-events:none;color:#ffe3a5;text-shadow:0 0 10px #fff4bd,0 0 25px #ef92dc;font-size:var(--size,18px);animation:burst-out 1.15s cubic-bezier(.16,.72,.28,1) forwards;animation-delay:var(--delay,0ms); }
.assistant-item-form .form-grid { margin-top:12px; }
.assistant-item-form .modal-footer { margin-top:12px; }
.assistant-choice { display:flex;align-items:center;gap:8px;margin:9px 0; }
.assistant-choice input { width:auto;margin:0; }

@media (min-width:1101px) {
  .app-shell { display:block; }
  .sidebar { display:none; }
  .topbar { position:relative;justify-content:center; }
  .top-actions { position:absolute;right:0;top:0; }
  .focus-layout > .hero { min-height:380px;grid-template-columns:minmax(280px,.6fr) minmax(0,1fr);gap:clamp(24px,4vw,64px);padding:30px clamp(30px,5vw,64px); }
  .focus-layout > .hero .clock { width:min(330px,100%); }
  .focus-layout > .hero .hero-content { max-width:680px; }
  .focus-layout > .hero .metric-row { grid-template-columns:repeat(4,minmax(0,1fr)); }
}
@media (min-width:761px) and (max-width:1100px) {
  .topnav { display:none; }
  .topbar { justify-content:flex-end; }
}
@media (max-width:1100px) {
  .sidebar { width:205px; }
  .hero { min-height:330px; }
}
@media (min-width:761px) and (max-width:960px) {
  .grid.two,.settings-grid { grid-template-columns:1fr; }
}
@media (max-width:1100px) {
  .data-columns { grid-template-columns:1fr; }
  .data-columns > .stack { display:contents; }
}
@media (min-width:761px) and (max-width:860px) {
  .hero { grid-template-columns:1fr; }
  .hero-content { text-align:center; }
  .hero-content .button-row { justify-content:center; }
}
@media (max-width:760px) {
  .assistant-footer { display:grid;grid-template-columns:repeat(2,minmax(0,1fr)); }
  .assistant-footer [data-action="assistantUndo"] { grid-column:1 / -1; }
  .assistant-footer .button { min-width:0;white-space:normal;overflow-wrap:anywhere; }
  .workspace { padding:16px 13px 85px; }
  .topbar { margin-bottom:18px; }
  .topnav { border-radius:20px 20px 0 0;background:#fffdf3;box-shadow:0 -8px 30px #45407830;backdrop-filter:blur(25px) saturate(160%); }
  .topnav button { transform:none!important; }
  .topnav button.active { background:linear-gradient(130deg,#e5ddff,#e1e7ff); }
  .hero { padding:30px 20px 23px;gap:23px;min-height:0;border-radius:27px; }
  .hero .clock { width:215px; }
  .hero .clock .readout { top:66%; }
  .hero h1 { font-size:29px; }
  .hero h1 .user-text,.hero .hero-content > p { display:-webkit-box;-webkit-box-orient:vertical;overflow:hidden;overflow-wrap:anywhere; }
  .hero h1 .user-text { -webkit-line-clamp:3; }
  .hero .hero-content > p { -webkit-line-clamp:3; }
  .hero .hero-content { max-width:100%; }
  .panel { border-radius:21px;padding:19px; }
  .panel:hover:not(.hero) { transform:none; }
  .metric strong { font-size:19px; }
  .goal-card { padding:18px;border-radius:20px; }
  body.dark .topnav { background:#272d50ef; }
}
@media (max-width:480px) {
  .assistant-footer { grid-template-columns:1fr; }
  .assistant-footer [data-action="assistantUndo"] { grid-column:auto; }
}
@media (max-width:390px) {
  .topnav button { min-width:50px;font-size:9px; }
  .hero .clock { width:200px; }
  .hero .clock.break .readout { top:56%; }
  .clock-local-time { bottom:10px;font-size:10px;padding:2px 6px; }
  .hero h1 { font-size:26px; }
  .hero .button-row { gap:6px; }
  .hero .button { font-size:12px;padding:8px 10px; }
}
@media (prefers-reduced-motion:reduce) {
  *,*::before,*::after { animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.01ms!important; }
}

/* Compact glass marker for the selected mobile destination. */
@media (max-width:760px) {
  .topnav {
    gap:2px;
    min-height:70px;
    padding:6px max(8px,env(safe-area-inset-right)) calc(5px + env(safe-area-inset-bottom)) max(8px,env(safe-area-inset-left));
    border-radius:22px 22px 0 0;
    border-top-color:rgba(255,255,255,.7);
    box-shadow:0 -7px 29px rgba(52,51,115,.16),inset 0 1px rgba(255,255,255,.72);
  }
  body.dark .topnav {
    background:linear-gradient(145deg,rgba(55,61,108,.82),rgba(30,39,81,.84));
    border-top-color:rgba(220,218,255,.29);
    box-shadow:0 -8px 31px rgba(3,5,30,.4),inset 0 1px rgba(255,255,255,.26);
  }
  .topnav button,body.dark .topnav button {
    flex:1;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:2px;
    min-width:0;
    min-height:55px;
    padding:3px 1px 2px;
    border-radius:13px;
    background:transparent;
    box-shadow:none;
    color:#777d9b;
    line-height:1;
    transition:color .22s ease;
  }
  body.dark .topnav button { color:#b5bedb; }
  .topnav button .nav-icon {
    display:grid;
    place-items:center;
    width:38px;
    height:31px;
    margin:0;
    border:1px solid transparent;
    border-radius:11px;
    font-size:18px;
    line-height:1;
    transition:background .24s ease,border-color .24s ease,box-shadow .24s ease,transform .24s ease,color .24s ease;
  }
  .topnav button .nav-label { display:block;font-size:10px;font-weight:650;letter-spacing:.01em;line-height:1.05;white-space:nowrap; }
  .topnav button:hover:not(.active),body.dark .topnav button:hover:not(.active) { background:transparent;color:#6158a2; }
  body.dark .topnav button:hover:not(.active) { color:#f0ecff; }
  .topnav button:hover:not(.active) .nav-icon { background:rgba(124,108,189,.11); }
  body.dark .topnav button:hover:not(.active) .nav-icon { background:rgba(210,198,255,.11); }
  .topnav button.active,body.dark .topnav button.active {
    background:transparent;
    box-shadow:none;
    color:#514788;
  }
  body.dark .topnav button.active { color:#f4eeff; }
  .topnav button.active .nav-icon {
    position:relative;
    color:#57478f;
    border-color:rgba(255,255,255,.85);
    background:linear-gradient(145deg,rgba(236,226,255,.92),rgba(217,219,255,.7));
    box-shadow:inset 0 1px rgba(255,255,255,.95),0 3px 9px rgba(93,76,160,.2);
    transform:translateY(-2px);
  }
  body.dark .topnav button.active .nav-icon {
    color:#fff;
    border-color:rgba(226,215,255,.55);
    background:linear-gradient(145deg,rgba(146,127,218,.77),rgba(99,103,181,.66));
    box-shadow:inset 0 1px rgba(255,255,255,.42),0 3px 11px rgba(12,12,50,.37);
  }
  .topnav button.active .nav-icon::after {
    content:"";
    position:absolute;
    bottom:-6px;
    left:50%;
    width:13px;
    height:2px;
    border-radius:5px;
    background:#8a77c7;
    box-shadow:0 0 7px rgba(140,110,220,.43);
    transform:translateX(-50%);
  }
  body.dark .topnav button.active .nav-icon::after { background:#d9c5ff;box-shadow:0 0 7px rgba(194,161,255,.7); }
  .topnav button.active .nav-label { font-weight:780; }
}
/* Data safety mirrors the native readiness checklist while keeping unsupported Web surfaces visible. */
.safety-summary { display:flex;align-items:center;justify-content:space-between;gap:12px;margin:16px 0 10px;padding:13px 15px;border:1px solid var(--glass-rim);border-radius:15px;background:linear-gradient(135deg,rgba(239,235,255,.78),rgba(255,255,255,.45));box-shadow:inset 0 1px var(--glass-shine); }
.safety-summary > strong { flex:none;color:var(--violet);font-size:14px; }
.safety-summary p { margin:3px 0 0;font-size:12px; }
.safety-list { display:grid;gap:8px;margin-bottom:14px; }
.safety-row { display:grid;grid-template-columns:30px minmax(0,1fr) auto;align-items:start;gap:10px;padding:11px;border:1px solid var(--line);border-radius:13px;background:linear-gradient(135deg,rgba(255,255,255,.64),rgba(243,241,255,.43)); }
.safety-row > div { min-width:0; }
.safety-row strong { font-size:13px; }
.safety-row p { margin:3px 0 0;font-size:12px;line-height:1.45;overflow-wrap:anywhere; }
.safety-row .status-chip { margin-top:2px;white-space:nowrap; }
.search-hit { outline:3px solid #b78ce7;outline-offset:3px;box-shadow:0 0 0 8px rgba(171,130,228,.19),var(--shadow)!important; }
body.dark .search-hit { outline-color:#d6b5ff;box-shadow:0 0 0 8px rgba(177,132,233,.22),var(--shadow)!important; }
.search-results { display:grid;gap:9px;max-height:min(48vh,380px);overflow:auto;margin-top:14px;padding:3px 5px 8px 3px; }
.search-result { display:grid;grid-template-columns:38px minmax(0,1fr) auto;align-items:center;gap:11px;width:100%;min-width:0;padding:11px 12px;text-align:left;color:var(--ink);border:1px solid var(--glass-rim);border-radius:15px;background:linear-gradient(120deg,rgba(255,255,255,.72),rgba(243,239,255,.53));box-shadow:inset 0 1px var(--glass-shine);cursor:pointer;transition:transform .18s,border-color .18s,background .18s,box-shadow .18s; }
.search-result:hover,.search-result:focus-visible { transform:translateY(-2px);border-color:rgba(145,115,213,.57);background:linear-gradient(120deg,rgba(255,255,255,.94),rgba(239,231,255,.76));box-shadow:0 10px 25px rgba(75,54,133,.13),inset 0 1px #fff;outline:none; }
.search-symbol { display:grid;place-items:center;width:38px;height:38px;border-radius:12px;color:#755ab7;background:linear-gradient(145deg,#f9f3ff,#eae2ff);box-shadow:inset 0 1px #fff,0 3px 10px rgba(112,85,181,.13);font-size:18px; }
.search-result-copy { display:grid;gap:2px;min-width:0; }
.search-result-title { overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:750;font-size:14px; }
.search-result-subtitle { overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--muted);font-size:12px; }
.search-result-kind { padding:5px 8px;border-radius:999px;background:rgba(114,91,171,.10);color:#6b539f;white-space:nowrap;font-size:11px;font-weight:700; }
.search-empty { padding:20px 10px;text-align:center; }
body.dark .search-result { background:linear-gradient(120deg,rgba(100,98,152,.31),rgba(58,68,123,.22));border-color:rgba(221,209,255,.20); }
body.dark .search-result:hover,body.dark .search-result:focus-visible { border-color:rgba(210,182,255,.60);background:linear-gradient(120deg,rgba(111,105,164,.46),rgba(65,75,137,.38));box-shadow:0 10px 25px rgba(6,8,33,.25),inset 0 1px rgba(255,255,255,.24); }
body.dark .search-symbol { color:#edddff;background:linear-gradient(145deg,#72649b,#514d7b);box-shadow:inset 0 1px rgba(255,255,255,.28),0 4px 12px rgba(10,8,38,.22); }
body.dark .search-result-kind { background:rgba(214,187,255,.14);color:#e9d6ff; }
.closeout-guidance { margin:-3px 0 15px;color:var(--muted);font-weight:650;line-height:1.55; }
.closeout-metrics { margin:0 0 19px; }
.closeout-metrics .metric { padding:12px 10px;border-radius:15px; }
.closeout-metrics .metric strong { font-size:23px;line-height:1.2; }
.closeout-section-heading { display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 0 9px; }
.closeout-section-heading h3 { margin:0;font-size:14px; }
.closeout-section-heading span { color:var(--muted);font-size:12px;font-weight:750; }
.closeout-list { display:grid;gap:8px; }
.closeout-list > .subtle { margin:0;padding:14px;border:1px dashed var(--line);border-radius:14px;line-height:1.5; }
.closeout-star { display:grid;gap:11px;padding:12px;border:1px solid var(--glass-rim);border-radius:16px;background:linear-gradient(135deg,rgba(255,255,255,.68),rgba(239,235,255,.47));box-shadow:inset 0 1px var(--glass-shine); }
.closeout-star-main { display:flex;align-items:flex-start;gap:11px;min-width:0; }
.closeout-star-symbol { display:grid;place-items:center;flex:none;width:31px;height:31px;border-radius:10px;background:linear-gradient(145deg,#fff4da,#f0e6ff);color:#8f68ad;font-size:19px; }
.closeout-star-copy { display:grid;gap:3px;min-width:0; }
.closeout-star-copy strong { overflow-wrap:anywhere;font-size:14px; }
.closeout-star-copy > span { overflow-wrap:anywhere;color:var(--muted);font-size:12px; }
.closeout-badges { display:flex;flex-wrap:wrap;gap:5px;margin-top:3px; }
.closeout-badges span { padding:3px 7px;border:1px solid var(--line);border-radius:99px;background:rgba(255,255,255,.4);color:var(--muted);font-size:11px;font-weight:700; }
.closeout-star-actions { display:flex;justify-content:flex-end;align-items:center;gap:7px;flex-wrap:wrap; }
.closeout-plan { display:grid;grid-template-columns:34px minmax(0,1fr);gap:10px;margin-top:15px;padding:14px;border:1px solid var(--glass-rim);border-radius:17px;background:linear-gradient(125deg,rgba(234,221,255,.67),rgba(247,242,255,.43));box-shadow:inset 0 1px var(--glass-shine); }
.closeout-plan-icon { display:grid;place-items:center;width:32px;height:32px;border-radius:11px;background:linear-gradient(140deg,#fff5d8,#ffe0ad);color:#9c6832; }
.closeout-plan strong { display:block;font-size:14px; }
.closeout-plan p { margin:4px 0 0;color:var(--muted);font-size:12px;line-height:1.5; }
.closeout-plan > .button { grid-column:2;justify-self:start; }
body.dark .closeout-star { background:linear-gradient(135deg,rgba(135,124,192,.25),rgba(75,80,137,.17)); }
body.dark .closeout-star-symbol { color:#f5dbff;background:linear-gradient(145deg,#725d88,#625382); }
body.dark .closeout-badges span { background:rgba(195,182,248,.09); }
body.dark .closeout-plan { background:linear-gradient(125deg,rgba(117,98,166,.36),rgba(73,73,130,.21)); }
body.dark .closeout-plan-icon { background:linear-gradient(140deg,#7b6389,#9d7f7b);color:#ffe1ac; }
@media (max-width:360px) {
  .closeout-plan > .button { grid-column:1/-1;justify-self:stretch;white-space:normal; }
}
@media (max-width:480px) {
  .search-result { grid-template-columns:36px minmax(0,1fr);gap:8px 10px;padding:10px; }
  .search-symbol { width:36px;height:36px;grid-row:1/3; }
  .search-result-kind { grid-column:2;justify-self:start;padding:3px 7px; }
}
.safety-mark { display:grid;place-items:center;width:26px;height:26px;border-radius:9px;font-size:14px;font-weight:900; }
.safety-mark.good { background:#dfefe6;color:#267357; }
.safety-mark.pending { background:#fff0d6;color:#8d632c; }
.health-issues { margin:-2px 0 14px;border:1px solid var(--line);border-radius:13px;background:rgba(255,255,255,.28); }
.health-issues summary { cursor:pointer;padding:11px 13px;font-size:13px;font-weight:700; }
.health-issue-list { display:grid;gap:7px;max-height:330px;overflow:auto;padding:0 9px 9px; }
.health-issue { display:grid;grid-template-columns:minmax(0,1fr) auto;gap:3px 10px;padding:9px 10px;border:1px solid var(--line);border-radius:10px;background:rgba(255,255,255,.48);font-size:12px; }
.health-issue strong { min-width:0;font-size:12px; }
.health-issue span { color:#33715a;white-space:nowrap; }
.health-issue.error span { color:#9b5555; }
.health-issue p { grid-column:1/-1;margin:0;line-height:1.5;overflow-wrap:anywhere; }
body.dark .safety-summary { background:linear-gradient(135deg,rgba(115,107,174,.35),rgba(58,66,113,.32)); }
body.dark .safety-summary > strong { color:#d8c7ff; }
body.dark .safety-row { border-color:rgba(222,214,255,.24);background:linear-gradient(135deg,rgba(130,124,181,.22),rgba(67,75,130,.17)); }
body.dark .safety-mark.good { background:#315f5b;color:#c2f6dc; }
body.dark .safety-mark.pending { background:#61523c;color:#ffe3aa; }
body.dark .health-issues { background:rgba(65,70,126,.2); }
body.dark .health-issue { background:rgba(92,99,151,.2); }
body.dark .health-issue span { color:#b6efd4; }
body.dark .health-issue.error span { color:#ffd4ca; }
.recommendation-row { display:grid;grid-template-columns:38px minmax(0,1fr) auto;gap:11px;align-items:center;padding:13px;border:1px solid var(--glass-rim);border-radius:16px;background:linear-gradient(135deg,rgba(255,255,255,.69),rgba(236,231,255,.48));box-shadow:inset 0 1px var(--glass-shine); }
.recommendation-count { display:grid;place-items:center;gap:0;width:38px;height:44px;border-radius:12px;background:linear-gradient(145deg,#fff3dc,#f0ddff);color:#855a9b;font-size:15px;line-height:1; }
.recommendation-count strong { font-size:11px; }
.recommendation-copy { display:grid;gap:5px;min-width:0; }
.recommendation-copy > strong { overflow-wrap:anywhere;font-size:14px; }
.recommendation-copy .subtle { overflow-wrap:anywhere; }
.recommendation-badges { display:flex;gap:5px;flex-wrap:wrap; }
.recommendation-badges span { padding:3px 7px;border:1px solid var(--line);border-radius:99px;background:rgba(255,255,255,.46);color:var(--muted);font-size:11px;font-weight:700; }
.recommendation-actions { display:grid;gap:6px; }
.recommendation-actions .button { white-space:nowrap;box-shadow:none; }
body.dark .recommendation-row { background:linear-gradient(135deg,rgba(129,117,183,.28),rgba(65,73,128,.21)); }
body.dark .recommendation-count { background:linear-gradient(145deg,#796491,#645381);color:#ffe2bd; }
body.dark .recommendation-badges span { background:rgba(188,176,239,.10); }
@media (max-width:520px) { .recommendation-row { grid-template-columns:38px minmax(0,1fr); }.recommendation-actions { grid-column:1/-1;display:flex; }.recommendation-actions .button { flex:1 1 0; } }
.routine-row { display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:12px;margin-top:9px;padding:12px;border:1px solid var(--glass-rim);border-radius:16px;background:linear-gradient(135deg,rgba(255,255,255,.64),rgba(237,232,255,.42));box-shadow:inset 0 1px var(--glass-shine); }
.routine-copy { display:grid;gap:4px;min-width:0; }
.routine-copy strong { overflow-wrap:anywhere;font-size:14px; }
.routine-copy .subtle { line-height:1.4; }
.routine-actions { display:flex;align-items:center;justify-content:flex-end;gap:6px;flex-wrap:wrap; }
.routine-actions .button { box-shadow:none;white-space:nowrap; }
.routine-auto.active { border-color:rgba(141,113,202,.42);background:rgba(218,200,252,.35);color:#655091; }
body.dark .routine-row { background:linear-gradient(135deg,rgba(130,119,184,.28),rgba(60,69,123,.19)); }
body.dark .routine-auto.active { background:rgba(169,143,224,.29);border-color:rgba(214,188,255,.44);color:#f1e1ff; }
@media (max-width:520px) { .routine-row { grid-template-columns:1fr; }.routine-actions { justify-content:flex-start; }.routine-actions .button { flex:1 1 auto; } }
@media (max-width:480px) {
  .safety-summary { align-items:flex-start;flex-direction:column; }
  .safety-row { grid-template-columns:26px minmax(0,1fr); }
  .safety-row .status-chip { grid-column:2;justify-self:start;margin-top:0; }
}
.offline-status{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:8px 24px 0;padding:10px 14px;border:1px solid rgba(255,255,255,.42);border-radius:16px;background:rgba(255,248,219,.72);color:#5e4a64;box-shadow:0 10px 25px rgba(40,36,76,.08);backdrop-filter:blur(18px)}
.drag-grip{display:inline-grid;place-items:center;width:20px;height:24px;margin-right:6px;vertical-align:middle;border-radius:7px;color:var(--muted);font-size:15px;font-weight:800;letter-spacing:-.17em;cursor:grab;user-select:none;touch-action:none;transition:background .16s,color .16s,transform .16s}
.drag-grip:hover{color:var(--ink);background:rgba(147,145,210,.18);transform:translateY(-1px)}
.drag-grip:active{cursor:grabbing}
.drag-grip.dragging{opacity:.4}
.plan-heading{display:flex;justify-content:space-between;gap:12px;align-items:baseline;margin-bottom:12px;color:var(--muted);font-size:13px}.plan-heading span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.plan-heading strong{color:var(--ink);white-space:nowrap}
.plan-stage-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.plan-stage{display:flex;align-items:center;gap:9px;min-width:0;padding:11px;border:1px solid var(--line);border-radius:15px;background:rgba(255,255,255,.16);box-shadow:inset 0 1px rgba(255,255,255,.36)}.plan-stage.current{border-color:rgba(191,160,242,.7);background:linear-gradient(135deg,rgba(235,211,255,.3),rgba(255,255,255,.13));box-shadow:0 0 0 3px rgba(167,132,231,.08),inset 0 1px rgba(255,255,255,.5)}.plan-stage-icon{display:grid;place-items:center;flex:none;width:29px;height:29px;border-radius:50%;background:rgba(175,148,237,.19);color:#8265c7;font-size:15px}.plan-stage-copy{display:grid;gap:2px;min-width:0;flex:1}.plan-eyebrow,.plan-stage-copy small{color:var(--muted);font-size:10px;font-weight:700}.plan-stage-copy strong,.plan-stage-copy small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.plan-stage-copy strong{font-size:12px;color:var(--ink)}.plan-stage time{flex:none;color:var(--ink);font-variant-numeric:tabular-nums;font-size:11px;font-weight:800}.plan-later{grid-column:1/-1;display:flex;align-items:center;gap:8px;padding:7px 11px;border-radius:11px;background:rgba(171,151,225,.11);color:var(--muted);font-size:11px;font-weight:750}.plan-later span{color:#9b78d5;font-size:20px;line-height:8px}
.plan-disclosure{margin-top:12px}.plan-disclosure>summary{display:flex;justify-content:space-between;gap:10px;align-items:center}.plan-count{color:var(--muted);font-size:11px}.plan-steps{gap:7px}.plan-step{display:grid;grid-template-columns:24px 18px minmax(0,1fr) auto 29px;gap:7px;align-items:center;min-width:0;padding:8px;border:1px solid var(--line);border-radius:13px;background:rgba(255,255,255,.17)}.plan-step.current{border-color:rgba(191,160,242,.7);background:rgba(196,166,245,.17)}.plan-step-number{display:grid;place-items:center;width:24px;height:24px;border-radius:50%;background:rgba(168,143,231,.2);color:var(--ink);font-size:11px;font-weight:800}.plan-step-icon{color:#a078d4}.plan-step-copy{display:grid;gap:1px;min-width:0}.plan-step-copy strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--ink);font-size:12px}.plan-step-copy span{color:var(--muted);font-size:10px}.plan-step time{color:var(--ink);font-size:11px;font-weight:800;font-variant-numeric:tabular-nums}.plan-step-menu{position:relative}.plan-step-menu>summary{display:grid;place-items:center;width:29px;height:29px;border:1px solid var(--line);border-radius:9px;background:rgba(255,255,255,.22);color:var(--ink);font-size:11px;list-style:none}.plan-step-menu>summary::-webkit-details-marker{display:none}.plan-step-actions{position:absolute;z-index:12;right:0;top:33px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;width:min(270px,calc(100vw - 55px));padding:9px;border:1px solid var(--line);border-radius:13px;background:var(--surface,#f9f7ff);box-shadow:0 14px 35px rgba(37,28,78,.24);backdrop-filter:blur(20px)}.plan-step-actions .button{min-width:0;padding:7px 5px;font-size:11px}
body.dark .plan-stage,body.dark .plan-step{background:rgba(173,162,233,.12)}body.dark .plan-stage.current,body.dark .plan-step.current{background:rgba(167,138,233,.23)}body.dark .plan-step-actions{background:rgba(45,42,88,.96)}
#execution-plan-panel{container-type:inline-size}.plan-step-toggle{display:grid;place-items:center;width:29px;height:29px;padding:0;border:1px solid var(--line);border-radius:9px;background:rgba(255,255,255,.22);color:var(--ink);cursor:pointer;font-size:11px}.plan-step-toggle[aria-expanded="true"]{background:rgba(170,139,230,.29)}.plan-step-actions{position:static;grid-column:1/-1;width:auto;padding:8px;margin-top:2px;box-shadow:none;background:rgba(255,255,255,.13)}.plan-step-actions[hidden]{display:none}@container (max-width:470px){.plan-stage-list{grid-template-columns:1fr}.plan-later{grid-column:1}.plan-stage-copy strong,.plan-stage-copy small{white-space:normal}.plan-stage time{font-size:13px}}
@media(max-width:520px){.plan-stage-list{grid-template-columns:1fr}.plan-stage{padding:10px}.plan-stage time{font-size:13px}.plan-later{grid-column:1}.plan-step{grid-template-columns:24px 18px minmax(0,1fr) auto 29px}}
.drag-floating{position:fixed;z-index:90;max-width:min(250px,60vw);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;pointer-events:none;padding:8px 13px;border:1px solid rgba(255,255,255,.68);border-radius:13px;background:rgba(84,77,152,.86);color:#fff;font-size:12px;font-weight:750;box-shadow:0 12px 30px rgba(21,17,63,.3);backdrop-filter:blur(16px)}
.drop-ready{outline:2px dashed var(--phase-glow,#9e92dd);outline-offset:3px;box-shadow:0 0 0 6px rgba(164,145,226,.12),var(--shadow)}
.backpack-task-list{display:grid;gap:5px;margin:10px 0}
.backpack-task{display:flex;align-items:center;gap:5px;min-width:0;padding:5px 7px;border:1px solid var(--line);border-radius:10px;background:rgba(255,255,255,.18);font-size:13px}
.backpack-task.skipped{border-style:dashed;background:rgba(255,255,255,.08)}
.backpack-task-name{flex:1;min-width:0;overflow-wrap:anywhere}
.backpack-task-duration{flex:none;color:var(--muted);font-size:11px;white-space:nowrap}
.backpack-task .button{flex:none}
@media (pointer:coarse){.drag-grip{width:28px;height:30px}}
.offline-status-copy{display:flex;align-items:center;gap:8px;min-width:0}.offline-status-copy strong{display:block}.offline-status-copy small{display:block;margin-top:2px;opacity:.8}.offline-status .button{white-space:nowrap}
body.dark .offline-status{border-color:rgba(251,226,189,.2);background:rgba(80,64,83,.68);color:#fff0d3}
@media(max-width:600px){.offline-status{flex-direction:column;align-items:stretch;margin:8px 14px 0;padding:10px 12px;font-size:.85rem}.offline-status .button-row{display:grid;grid-template-columns:1fr 1fr;gap:8px}.offline-status .button{min-width:0}}
.download-status{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:8px 0 14px;padding:13px 16px;border:1px solid var(--glass-rim);border-radius:16px;background:var(--panel);box-shadow:0 12px 28px #20275018;backdrop-filter:blur(18px)}.download-status strong,.download-status small{display:block}.download-status small{margin-top:3px;color:var(--muted)}.download-status a.button{display:inline-flex;align-items:center;justify-content:center;text-decoration:none}.download-status .button-row{flex-shrink:0}

.settings-grid > .membership-panel{grid-column:1/-1;overflow:hidden;background:radial-gradient(circle at 95% 0%,rgba(255,214,150,.34),transparent 31%),linear-gradient(135deg,rgba(255,255,255,.84),rgba(245,239,255,.73) 63%,rgba(234,235,255,.67))}
.membership-panel .section-heading h2{font-size:clamp(22px,2.4vw,28px)}
.membership-panel .membership-subtitle{margin:0 0 16px;font-size:14px}
.membership-status{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:17px}
.membership-status .status-chip{padding:6px 11px;font-size:12px}
.membership-expiry{color:var(--muted);font-size:13px}
.membership-tiers{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.membership-tier{min-width:0;padding:17px 18px;border:1px solid rgba(160,148,205,.24);border-radius:18px;background:rgba(255,255,255,.4);box-shadow:inset 0 1px rgba(255,255,255,.72)}
.membership-tier.pro{border-color:rgba(231,184,105,.4);background:linear-gradient(145deg,rgba(255,244,218,.6),rgba(255,255,255,.33) 65%)}
.membership-tier h3{margin:0 0 13px;font-size:15px}
.membership-tier ul{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 14px;margin:0;padding:0;list-style:none}
.membership-tier li{display:flex;align-items:baseline;gap:8px;min-width:0;color:var(--ink);font-size:13px;line-height:1.4;overflow-wrap:anywhere}
.membership-tier li span{flex:none;color:#a186d6;text-shadow:0 0 10px rgba(179,145,236,.32)}
.membership-tier.pro li span{color:#c18b43;text-shadow:0 0 10px rgba(231,183,96,.34)}
.membership-footer{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:17px}
.membership-footer .subtle{font-size:12px}
body.dark .settings-grid > .membership-panel{background:radial-gradient(circle at 95% 0%,rgba(181,132,86,.2),transparent 36%),linear-gradient(140deg,rgba(67,62,111,.82),rgba(38,44,85,.78) 66%,rgba(34,41,75,.82))}
body.dark .membership-tier{border-color:rgba(212,201,255,.18);background:rgba(223,216,255,.07);box-shadow:inset 0 1px rgba(255,255,255,.1)}
body.dark .membership-tier.pro{border-color:rgba(237,205,151,.25);background:linear-gradient(145deg,rgba(191,148,84,.14),rgba(223,216,255,.05) 70%)}
@media (max-width:1100px){.membership-tiers{grid-template-columns:1fr}}
@media (max-width:760px){.membership-tier ul{grid-template-columns:1fr}.membership-panel .membership-subtitle{line-height:1.5}}
@media(max-width:600px){.download-status{flex-direction:column;align-items:stretch}.download-status .button-row{display:grid;grid-template-columns:minmax(0,1fr) auto}.download-status a.button{white-space:normal;text-align:center}}

.planning-detail-root:empty{display:none}
.planning-detail-root:not(:empty){margin-top:18px;padding-top:18px;border-top:1px solid var(--line)}
.planning-detail{min-width:0;padding:17px;border:1px solid var(--glass-rim);border-radius:19px;background:linear-gradient(145deg,rgba(255,255,255,.68),rgba(238,231,255,.42));box-shadow:inset 0 1px var(--glass-shine),0 16px 35px rgba(56,41,99,.09);-webkit-backdrop-filter:blur(20px) saturate(150%);backdrop-filter:blur(20px) saturate(150%);animation:planning-detail-enter .28s cubic-bezier(.2,.8,.2,1) both}
.planning-detail-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px;color:var(--muted)}
.planning-detail-top>span{display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:rgba(156,126,216,.18);color:#8c68cc}
.planning-detail h2{margin:0 0 12px;font-size:17px}
.planning-detail .modal-footer{flex-wrap:wrap}
.planning-detail>.modal-footer{display:none}
.planning-detail .message{margin-bottom:12px}
.time-block-form{display:flex;align-items:end;flex-wrap:wrap;gap:10px;margin-bottom:14px}
.time-block-form .field{flex:1 1 170px;margin:0}
.time-block-form .button{flex:0 0 auto;margin-bottom:1px}
.time-block-list{display:grid;gap:8px}
.time-block-list>.subtle{margin:0;padding:11px 13px;line-height:1.5}
.time-block-row{display:grid;grid-template-columns:74px minmax(0,1fr) auto;align-items:center;gap:11px;padding:11px 13px;border:1px solid rgba(255,255,255,.76);border-radius:13px;background:linear-gradient(120deg,rgba(255,255,255,.75),rgba(239,235,255,.48));box-shadow:inset 0 1px rgba(255,255,255,.72)}
.time-block-row time{font-variant-numeric:tabular-nums;font-size:12px;font-weight:800;color:#7754b4}
.time-block-row strong{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:12px}
.time-block-row>span{font-size:11px;color:var(--muted);white-space:nowrap}
body.dark .time-block-row{border-color:rgba(227,219,255,.2);background:linear-gradient(120deg,rgba(119,105,171,.28),rgba(49,56,105,.36));box-shadow:inset 0 1px rgba(255,255,255,.16)}
body.dark .time-block-row time{color:#e3c8ff}
body.dark .planning-detail{background:linear-gradient(145deg,rgba(119,105,171,.27),rgba(48,54,103,.38));box-shadow:inset 0 1px rgba(255,255,255,.22),0 16px 35px rgba(6,8,35,.2)}
@keyframes planning-detail-enter{from{opacity:0;transform:translateY(-7px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:480px){.planning-detail{padding:13px;border-radius:16px}.planning-detail .button-row .button{max-width:100%}}
@media(max-width:380px){.time-block-row{grid-template-columns:62px minmax(0,1fr);gap:5px 8px}.time-block-row>span{grid-column:2}}
@media(prefers-reduced-motion:reduce){.planning-detail{animation:none}}
@media(max-width:360px){
  .topnav{min-height:80px}
  .topnav button,body.dark .topnav button{min-height:65px;gap:3px}
  .topnav button .nav-icon{width:34px;height:29px}
  .topnav button .nav-label{max-width:100%;white-space:normal;overflow-wrap:normal;text-align:center;font-size:9px;line-height:1.08}
}
