:root {
  color-scheme: dark;
  --background: #000;
  --sidebar: #050505;
  --surface: #0a0a0b;
  --surface-raised: #111013;
  --surface-hover: #1b171f;
  --text: #f7f3f8;
  --muted: #aaa3ae;
  --subtle: #716b75;
  --line: #29252c;
  --purple: #9b36ff;
  --orange: #ff6a00;
  --coral: #ff3f81;
  --field: #111013;
  --selected: #17121d;
  --heat-empty: #151417;
  --focus-surface: #080809;
  --danger: #ffb09a;
  --gradient: linear-gradient(110deg, var(--orange), var(--coral) 45%, var(--purple));
  font-family: Manrope, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: 16px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; min-width: 320px; background: var(--background); color: var(--text); }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
button, input, select, textarea { font: inherit; }
button, a, input, select, textarea { -webkit-tap-highlight-color: transparent; }
button, a { outline-offset: 3px; }
button { cursor: pointer; }
button:disabled { cursor: not-allowed; opacity: .45; }
a { color: inherit; }
h1, h2, h3, p { margin-top: 0; }
h1 { margin-bottom: .55rem; font-size: clamp(2.4rem, 5.4vw, 4.9rem); line-height: .98; letter-spacing: -.065em; font-weight: 500; }
h1 em { font-family: "Instrument Serif", Georgia, serif; font-size: 1.08em; font-weight: 400; background: var(--gradient); color: transparent; background-clip: text; -webkit-background-clip: text; }
h2 { margin-bottom: .5rem; font-size: clamp(1.4rem, 2.5vw, 2rem); line-height: 1.25; letter-spacing: -.035em; font-weight: 500; }
h3 { font-size: 1rem; font-weight: 500; }
p { color: var(--muted); line-height: 1.6; }
small { color: var(--muted); }
[hidden] { display: none !important; }

.app-shell { min-height: 100vh; display: grid; grid-template-columns: 230px minmax(0, 1fr); }
.sidebar { position: sticky; top: 0; height: 100vh; padding: 28px 20px 22px; display: flex; flex-direction: column; background: var(--sidebar); border-right: 1px solid #171518; }
.brand { display: flex; gap: 8px; align-items: center; text-decoration: none; font-size: .92rem; line-height: 1.12; font-weight: 700; letter-spacing: -.02em; }
.brand-name { display: block; font-weight: 700; }
/* Frame the colored symbol, not the PNG's transparent padding. Two lines = 2.24em. */
.brand-symbol { --brand-height: 2.24em; position: relative; flex: none; width: calc(var(--brand-height) * .905); height: var(--brand-height); overflow: hidden; background: transparent; }
.brand-symbol img { position: absolute; width: 193.3%; max-width: none; height: auto; left: -46.7%; top: -37.1%; background: transparent; }
.navigation { display: grid; gap: 6px; margin-top: 48px; }
.navigation a { min-height: 44px; display: flex; align-items: center; gap: 12px; padding: 0 13px; border-radius: 10px; color: var(--muted); text-decoration: none; font-size: .9rem; }
.navigation a:hover { background: #201c23; color: var(--text); }
.navigation a[aria-current="page"] { color: var(--text); background: var(--selected); }
.nav-icon { width: 22px; display: inline-grid; place-items: center; font-size: 18px; flex-shrink: 0; }
.footer-navigation { margin: 0 0 18px; }
.profile { text-decoration: none; min-height: 44px; }
.account-form { display:flex; align-items:flex-end; flex-wrap:wrap; gap:14px; margin:20px 0; }
.account-form label { display:grid; gap:8px; flex:1; min-width:180px; max-width:380px; }
.connection-actions { margin-top:20px; }
#account-error, #outlook-error { overflow-wrap:anywhere; }
html[data-theme="light"] .eyebrow,html[data-theme="light"] .session-kicker { color:#7436a1; }
html[data-theme="light"] .dialog { background:var(--focus-surface); }
html[data-theme="light"] .form-grid label,html[data-theme="light"] .session-editor label,html[data-theme="light"] .notes-field,html[data-theme="light"] .session-meta { color:var(--text); }
html[data-theme="light"] .text-button,html[data-theme="light"] .section-heading > a,html[data-theme="light"] .add-day summary { color:#712da6; }
html[data-theme="light"] .integration-note { background:var(--surface-raised); }
html[data-theme="light"] .priority-list button[aria-pressed="true"] { color:var(--text); background:#e9ddf2; }
html[data-theme="light"] .step-indicator [aria-current="step"] { color:#712da6; }
html[data-theme="light"] .error-message { background:#fff0e9; }
.sidebar-foot { margin-top: auto; }
.connection-status { display: flex; align-items: center; gap: 8px; margin-bottom: 20px; font-size: .72rem; }
.connection-status > span { width: 6px; height: 6px; border-radius: 50%; background: var(--orange); }
.profile { display: flex; gap: 10px; align-items: center; }
.profile > span:last-child { display: grid; gap: 2px; }
.profile strong { font-size: .85rem; font-weight: 500; }
.profile small { font-size: .7rem; }
.avatar { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 50%; background: #33283f; color: #e2c9fb; font-size: .8rem; }
.mobile-header { display: none; }

main { min-width: 0; padding: clamp(42px, 7vw, 84px) clamp(24px, 7vw, 92px); background:var(--background); }
.view { max-width: 1120px; margin: 0 auto; }
.page-heading { display: flex; justify-content: space-between; gap: 28px; align-items: flex-end; margin-bottom: 44px; }
.page-heading > div { max-width: 820px; }
.page-heading p:last-child { margin: 0; }
.eyebrow { margin-bottom: 14px; color: #ce9dff; font-size: .66rem; letter-spacing: .18em; }
.button { min-height: 44px; padding: 0 18px; border-radius: 10px; border: 1px solid #4b4054; background: transparent; color: var(--text); font-weight: 500; white-space: nowrap; }
.button:hover { background: var(--surface-hover); }
.button.primary { border: 0; background: var(--gradient); color: #130811; box-shadow: 0 0 28px rgba(255,106,0,.12); font-weight:700; }
.button.primary:hover { filter: brightness(1.08); }
.button.secondary { background: #211d26; }
.text-button { min-height: 44px; padding: 6px 4px; border: 0; background: transparent; color: #d8b7f6; }
.text-button:hover { color: var(--text); }
.icon-button { min-height: 44px; border: 0; background: transparent; color: var(--text); }

.next-session { position: relative; isolation:isolate; overflow: hidden; min-height:320px; padding: clamp(32px, 6vw, 68px); padding-right:44%; border: 1px solid #241e28; border-radius: 2px 28px 2px 28px; background:#09090a; }
/* The artwork lives in its own quiet area, never underneath the session controls. */
.next-session::before { content: ""; position: absolute; z-index:-1; pointer-events:none; right:0; bottom:0; width:43%; height:100%; background:url("design/assets/learning-path.svg") no-repeat right bottom / contain; }
.next-session.empty { display: grid; align-content:center; justify-items:start; gap:24px; }
.next-session.empty h2 { margin-bottom:0; }
.session-kicker { display: flex; align-items: center; gap: 8px; margin-bottom: 22px; color: #d9c0e5; font-size: .7rem; letter-spacing: .12em; }
.session-kicker::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--orange); }
.next-session h2 { max-width: 680px; margin-bottom: 10px; font-size: clamp(1.9rem, 4.3vw, 3.5rem); overflow-wrap:anywhere; }
.next-session .question { max-width: 650px; margin-bottom: 26px; font-size: 1.05rem; overflow-wrap:anywhere; }
.session-meta { display: flex; flex-wrap: wrap; gap: 12px 25px; margin-bottom: 28px; color: #d1c7d6; font-size: .82rem; }
.session-actions { display: flex; gap: 14px; align-items: center; flex-wrap: wrap; }

.metric-row { display: grid; grid-template-columns: 1.2fr .9fr .9fr; margin: 56px 0 70px; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.metric-row article { min-width: 0; padding: 27px 30px 27px 0; }
.metric-row article + article { padding-left: 30px; border-left: 1px solid var(--line); }
.metric-row span, .metric-row small { display: block; font-size: .75rem; color: var(--muted); }
.metric-row strong { display: block; margin: 7px 0 4px; font-family:"Instrument Serif",Georgia,serif; font-size: 2.15rem; font-weight: 400; letter-spacing: -.035em; }
.progress-track { height: 3px; margin-top: 15px; overflow: hidden; border-radius: 2px; background: #332c38; }
.progress-track > span { display: block; height: 100%; background: var(--gradient); transition: width .35s ease; }
.progress-track.large { height: 5px; }

.home-lower { display: grid; grid-template-columns: minmax(0, 1.7fr) minmax(260px, .8fr); gap: clamp(35px, 7vw, 85px); }
.section-heading { display: flex; justify-content: space-between; gap: 20px; align-items: flex-end; margin-bottom: 24px; }
.section-heading p, .section-heading h2 { margin-bottom: 0; }
.section-heading > a { color: #d4b0f5; font-size: .8rem; }
.continuation { padding-left: 30px; border-left: 1px solid var(--line); }
.continuation blockquote { margin: 24px 0 18px; font-size: 1.2rem; line-height: 1.55; letter-spacing: -.02em; }
.continuation small { line-height: 1.5; }

.heatmap { display: grid; grid-auto-flow: column; grid-template-rows: repeat(7, 1fr); gap: 6px; width: max-content; max-width: 100%; }
.heatmap-cell { position: relative; width: 20px; aspect-ratio: 1; overflow: hidden; border: 0; border-radius: 7px; background: var(--heat-empty); }
.heatmap-cell.has-time { background: #221424; }
.heatmap-cell::after { content: ""; position: absolute; inset: auto 0 0; height: var(--fill, 0%); border-radius: inherit; background: linear-gradient(to top, rgba(255,153,67,var(--light,.9)), rgba(196,91,166,var(--light,.76)) 58%, rgba(133,69,236,var(--light,.65))); box-shadow: 0 0 calc(var(--light, .5) * 12px) rgba(255,143,64,.22); }
.heatmap-cell[aria-pressed="true"] { outline: 2px solid #f4d9ff; outline-offset: 2px; }
.heatmap.compact .heatmap-cell { width: clamp(13px, 2.1vw, 19px); }
.heatmap.full { gap: 7px; }
.heatmap.full .heatmap-cell { width: clamp(15px, 2.2vw, 23px); }
.legend { display: flex; align-items: center; gap: 5px; color: var(--muted); font-size: .7rem; }
.legend i { width: 11px; height: 11px; border-radius: 3px; background: #2b2730; }
.legend i:nth-of-type(2) { background: #643b74; }
.legend i:nth-of-type(3) { background: #a85878; }
.legend i:nth-of-type(4) { background: #ff9844; }

.summary-strip, .insights-summary { display: grid; grid-template-columns: repeat(3, 1fr); margin-bottom: 42px; padding: 22px 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.summary-strip > span, .insights-summary article { display: grid; gap: 7px; padding-right: 25px; }
.summary-strip > span + span, .insights-summary article + article { padding-left: 25px; border-left: 1px solid var(--line); }
.summary-strip small, .insights-summary small { color: var(--muted); }
.summary-strip strong, .insights-summary strong { font-size: 1.4rem; font-weight: 400; }
.quiet-value { color: var(--muted); }
.schedule-list { display: grid; }
.schedule-day { display: grid; grid-template-columns: 150px minmax(0, 1fr) auto; gap: 24px; padding: 24px 0; border-bottom: 1px solid var(--line); align-items: center; }
.schedule-day time { color: var(--muted); font-size: .8rem; }
.schedule-day h3 { margin: 0 0 6px; }
.schedule-day p { margin: 0; font-size: .82rem; }
.schedule-day .day-name { display: grid; gap: 4px; }
.schedule-day .day-name strong { font-weight: 500; }
.schedule-empty { padding: 50px 0; color: var(--muted); text-align: center; }

.insights-panel, .area-section, .journal-section { margin-top: 48px; padding-top: 35px; border-top: 1px solid var(--line); }
.heatmap-note { margin-top: 20px; font-size: .75rem; }
.heatmap-detail { margin-top:24px; min-height:44px; padding-top:18px; border-top:1px solid var(--line); }
.heatmap-detail > p { margin:0; font-size:.8rem; }
.heatmap-detail article { display:grid; grid-template-columns:140px 1fr auto; gap:16px; padding:12px 0; align-items:start; }
.heatmap-detail article + article { border-top:1px solid var(--line); }
.heatmap-detail strong { font-weight:500; }
.heatmap-detail small { line-height:1.5; }
.area-row { display: grid; grid-template-columns: 180px 1fr 70px; gap: 18px; align-items: center; padding: 13px 0; }
.area-row strong { font-weight: 500; }
.area-bar { height: 5px; border-radius: 3px; background: #302a35; overflow: hidden; }
.area-bar span { display: block; height: 100%; background: var(--gradient); }
.area-row time { text-align: right; color: var(--muted); }
.empty-copy { padding: 25px 0; color: var(--muted); }
.reflection { display: grid; grid-template-columns: 150px 1fr; gap: 24px; padding: 22px 0; border-bottom: 1px solid var(--line); }
.reflection time { color: var(--muted); font-size: .8rem; }
.reflection p { margin-bottom: 5px; color: var(--text); }

.dialog { width: min(760px, calc(100% - 28px)); max-height: calc(100vh - 28px); padding: 0; border: 1px solid #302735; border-radius: 2px 26px 2px 26px; background: #080809; color: var(--text); box-shadow: 0 28px 90px #000; }
.dialog::backdrop { background: #08070ac7; backdrop-filter: blur(4px); }
.dialog-frame, .focus-frame { padding: clamp(22px, 5vw, 38px); }
.dialog-top { display: flex; justify-content: space-between; align-items: center; gap: 15px; margin-bottom: 23px; color: var(--muted); font-size: .75rem; }
.step-indicator { display: flex; flex-wrap: wrap; gap: 16px; margin-bottom: 34px; color: #7e7584; font-size: .7rem; }
.step-indicator [aria-current="step"] { color: #e6c6fb; }
.planner-step > p { max-width: 600px; }
.priority-list { display: grid; gap: 10px; margin-top: 25px; }
.priority-list button { min-height: 70px; display: flex; justify-content: space-between; align-items: center; gap: 15px; padding: 14px 17px; border: 1px solid transparent; border-radius: 4px 14px 4px 14px; background: var(--surface-raised); color: var(--text); text-align: left; }
.priority-list button:hover { background: var(--surface-hover); }
.priority-list button[aria-pressed="true"] { border-color: #76548d; background: #30273a; }
.priority-list button span { display: grid; gap: 4px; }
.priority-list button strong { font-weight: 500; }
.priority-list button small { font-size: .73rem; }
.priority-list button b { width: 28px; height: 28px; display: grid; flex: 0 0 auto; place-items: center; border-radius: 50%; background: #38303e; color: #eeddfb; font-size: .8rem; font-weight: 400; }
.form-note { margin: 15px 0 0; font-size: .76rem; }
.dialog-actions { display: flex; justify-content: space-between; gap: 16px; align-items: center; margin-top: 30px; padding-top: 24px; border-top: 1px solid var(--line); }
.dialog-actions > span { color: var(--muted); font-size: .74rem; }
.form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; margin-top: 25px; }
.form-grid label, .session-editor label, .notes-field { display: grid; gap: 7px; color: #ddd5e2; font-size: .8rem; }
.form-grid label > span small, .notes-field small { margin-left: 5px; }
.full-field { grid-column: 1 / -1; }
input, select, textarea { width: 100%; min-height: 44px; padding: 10px 12px; border: 1px solid #4a4053; border-radius: 9px; background: var(--field); color: var(--text); font-size: 1rem; }
textarea { min-height: 84px; resize: vertical; }
.field-suffix { display: flex; align-items: center; border: 1px solid #4a4053; border-radius: 9px; background: var(--field); }
.field-suffix:focus-within { outline: 2px solid Highlight; outline-offset: 2px; }
.field-suffix input { border: 0; background: transparent; outline: 0; }
.field-suffix span { padding-right: 12px; color: var(--muted); }
.planner-days { display: grid; margin-top: 22px; }
.planner-day-nav { display:flex; flex-wrap:wrap; gap:6px; margin-bottom:24px; }
.planner-day-nav button { display:flex; gap:7px; align-items:center; justify-content:center; min-width:58px; min-height:40px; padding:8px 10px; border:1px solid var(--line); border-radius:10px; background:transparent; color:var(--muted); font-size:.78rem; }
.planner-day-nav button[aria-current="step"] { color:var(--text); border-color:var(--purple); background:var(--selected); font-weight:700; }
.planner-day-nav button:disabled { opacity:.65; cursor:default; }
.planner-day-nav button span { width:6px; }
.planner-day-position { margin-bottom:8px; color:var(--muted); font-size:.68rem; letter-spacing:.1em; }
.planner-day-date { margin-bottom:22px; font-size:.85rem; }
.planner-day-choice { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.planner-day-choice button { display:flex; justify-content:center; align-items:center; gap:9px; min-height:48px; padding:12px; border:1px solid var(--line); border-radius:12px; background:transparent; color:var(--text); font-size:.84rem; }
.planner-day-choice button[aria-pressed="true"] { background:var(--selected); border-color:var(--purple); font-weight:600; }
.planner-day-choice button span { color:var(--orange); font-size:1.1rem; }
.planner-free-message { margin-top:22px; padding:26px; border-radius:16px; background:var(--surface-raised); }
.planner-free-message strong { color:var(--text); font-weight:600; }
.planner-free-message p { margin:8px 0 0; font-size:.85rem; }
.planner-day-actions { position:sticky; bottom:0; z-index:2; padding:16px 0 0; background:var(--focus-surface); }
.planner-day-actions .button { white-space:normal; }
.session-editor { padding: 0; background: transparent; }
.session-editor-head { display: flex; justify-content: space-between; gap: 16px; margin-bottom: 15px; }
.session-editor-head strong { font-weight: 500; }
.session-editor-head label { display: flex; gap: 8px; align-items: center; }
.session-editor-head input { width: 18px; min-height: 18px; }
.session-editor-fields { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 16px; }
.session-editor-fields label, .session-editor-fields input { min-width:0; }
.session-editor-fields .area-field { grid-column:1 / -1; }
.session-editor-fields .topic-field { grid-column: 1 / -1; }
.session-editor .suggestion-copy { margin: 12px 0 0; font-size: .72rem; }
.add-day { margin-top: 15px; }
.add-day summary { min-height: 44px; padding: 12px 0; color: #d3acf4; cursor: pointer; }
.extra-days { display: flex; flex-wrap: wrap; gap: 10px; }
.extra-days label { min-height: 44px; display: flex; align-items: center; gap: 8px; padding: 0 13px; border: 1px solid #4b4054; border-radius: 9px; }
.extra-days input { width: 18px; min-height: 18px; }
.error-message { margin: 15px 0 0; padding: 11px 13px; border-radius: 9px; background: #3b292b; color: var(--danger); font-size: .8rem; }
.review-total { display: flex; justify-content: space-between; align-items: center; gap: 20px; margin-top: 28px; }
.review-total strong { font-size: 1.6rem; font-weight: 400; }
.planner-review { margin-top: 22px; }
.planner-review-row { display: grid; grid-template-columns: 100px 1fr auto; gap: 15px; padding: 17px 0; border-bottom: 1px solid var(--line); }
.planner-review-row strong { font-weight: 500; }
.planner-review-row p { margin: 4px 0 0; font-size: .78rem; }
.planner-review-row.is-free div strong { color:var(--muted); font-weight:400; }
.planner-review-row > div { min-width:0; overflow-wrap:anywhere; }
.integration-note { margin: 24px 0 0; padding: 14px 16px; border-radius: 10px; background: #242029; font-size: .76rem; }
.integration-note strong { color: var(--text); font-weight: 500; }

.focus-dialog { width: min(920px, calc(100% - 28px)); background:var(--focus-surface); }
.focus-frame { min-height: min(650px, calc(100vh - 30px)); display: flex; flex-direction: column; }
#focus-active, #focus-review { margin: auto 0; }
#focus-question { max-width: 650px; }
.timer-orbit { width:min(300px,76vw); aspect-ratio:1; display:grid; place-items:center; margin:clamp(18px,3vh,28px) auto 14px; border-radius:50%; background:conic-gradient(from 210deg,var(--orange),var(--coral),var(--purple) var(--timer-progress),#211d25 var(--timer-progress)); padding:6px; box-shadow:0 0 70px rgba(143,42,255,.11); transition:background .35s ease; }
.timer-core { width:100%; height:100%; display:flex; flex-direction:column; justify-content:center; align-items:center; border-radius:50%; background:var(--focus-surface); box-shadow:inset 0 0 0 1px #2e2733; }
#timer-display { display: block; font-family:"Instrument Serif",Georgia,serif; font-size: clamp(2.65rem, 9vw, 4.7rem); line-height: .9; letter-spacing: -.045em; font-variant-numeric: tabular-nums; background:var(--gradient); color:transparent; background-clip:text; -webkit-background-clip:text; }
#timer-plan { margin-top:16px; color:var(--muted); font-size:.72rem; }
.timer-state { margin:0 0 30px; text-align:center; font-size: .8rem; }
.notes-field { max-width: 700px; }
.notes-field textarea { min-height: 84px; }
.focus-actions { display: flex; gap: 12px; align-items: center; flex-wrap: wrap; margin-top: 25px; }
.timer-controls { justify-content:center; gap:22px; }
.timer-control { min-width:86px; display:grid; justify-items:center; gap:8px; padding:0; border:0; background:transparent; color:var(--muted); }
.control-symbol { width:58px; height:58px; display:grid; place-items:center; border:1px solid #4d4255; border-radius:50%; background:var(--surface-raised); color:var(--text); transition:transform .15s ease,background .15s ease; }
.control-symbol svg { width:22px; height:22px; fill:currentColor; }
.timer-control:hover .control-symbol { transform:translateY(-2px); background:var(--surface-hover); }
.timer-control.primary-control { color:var(--text); }
.timer-control.primary-control .control-symbol { border:0; background:var(--gradient); color:#100711; box-shadow:0 0 35px rgba(255,91,25,.18); }
.timer-control > span:last-child { font-size:.74rem; }
.review-fields { max-width: 700px; }
.toast { position: fixed; right: 24px; bottom: 24px; z-index: 20; max-width: min(360px, calc(100% - 48px)); padding: 14px 18px; border: 1px solid #533f5e; border-radius: 11px; background: #28212f; box-shadow: 0 12px 40px #0008; color: var(--text); }

.settings-section { padding:32px 0 42px; border-top:1px solid var(--line); }
.theme-options { display:grid; grid-template-columns:repeat(2,minmax(0,300px)); gap:16px; margin:0; padding:0; border:0; }
.theme-option { position:relative; min-height:150px; display:grid; align-content:space-between; gap:20px; padding:18px; border:1px solid var(--line); border-radius:4px 18px 4px 18px; cursor:pointer; }
.theme-option:has(input:checked) { border-color:var(--purple); box-shadow:inset 0 0 0 1px var(--purple); }
.theme-option input { position:absolute; right:14px; top:14px; width:18px; min-height:18px; accent-color:var(--purple); }
.theme-option > span:last-child { display:grid; gap:4px; }
.theme-option strong { font-weight:500; }
.theme-option small { font-size:.72rem; }
.theme-swatch { width:105px; height:54px; display:grid; grid-template-columns:repeat(3,1fr); align-items:end; gap:6px; padding:10px; border-radius:8px; }
.theme-swatch i { display:block; border-radius:3px; }
.theme-swatch i:nth-child(1) { height:22px; }
.theme-swatch i:nth-child(2) { height:34px; }
.theme-swatch i:nth-child(3) { height:17px; background:linear-gradient(135deg,#ff6a00,#9b36ff)!important; }
.dark-preview { background:#09090a; color:#f7f3f8; }
.dark-preview small { color:#bcb4c3; }
.dark-preview .theme-swatch { background:#151318; }
.dark-preview .theme-swatch i { background:#49404e; }
.light-preview { background:#fff; color:#111; }
.light-preview small { color:#5f5b62; }
.light-preview .theme-swatch { background:#f0edef; }
.light-preview .theme-swatch i { background:#afa8b0; }
.settings-note { margin:18px 0 0; font-size:.76rem; }
.settings-row { display:flex; justify-content:space-between; align-items:center; gap:20px; padding:18px 0; }
.settings-row > span:first-child { display:grid; gap:5px; }
.settings-row strong { font-weight:500; }
.settings-row small { font-size:.75rem; }
.status-label { color:var(--muted); font-size:.78rem; }
#signed-in-controls { display:grid; gap:28px; margin-top:24px; }
#profile-form { margin:0; gap:12px 16px; }
#profile-form label { min-width:min(180px,100%); }
.account-tools { display:grid; justify-items:start; gap:20px; padding-top:4px; }
.account-tools > .text-button { text-align:left; }
.account-actions { width:100%; gap:12px 24px; border-top:1px solid var(--line); padding-top:20px; }
.account-actions .text-button { white-space:normal; text-align:left; }
.big-three-settings { padding:24px; border:1px solid var(--line); border-radius:20px; background:var(--surface); max-width:760px; }
.big-three-settings-heading { display:flex; justify-content:space-between; align-items:center; gap:20px; }
.big-three-settings-heading h3 { margin:0 0 5px; font-size:1.2rem; font-weight:600; letter-spacing:-.03em; }
.big-three-settings-heading p { margin:0; font-size:.88rem; }
.big-three-emblem { display:grid; place-items:center; width:42px; height:42px; border-radius:12px; background:var(--selected); color:var(--muted); }
.big-three-settings svg, .big-three-dialog svg { width:22px; height:22px; fill:none; stroke:currentColor; stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round; flex-shrink:0; }
.big-three-summary { list-style:none; display:flex; flex-wrap:wrap; gap:10px; padding:0; margin:24px 0; }
.big-three-summary li { display:flex; align-items:center; gap:9px; padding:10px 12px; border-radius:10px; background:var(--surface-raised); font-size:.86rem; overflow-wrap:anywhere; }
.big-three-summary .summary-rank { color:var(--muted); font-size:.74rem; }
.big-three-summary svg { width:18px; height:18px; color:var(--muted); }
.big-three-edit { display:inline-flex; align-items:center; justify-content:center; gap:10px; font-weight:600; background:var(--selected); color:var(--text); border-color:var(--line); white-space:normal; padding:11px 16px; }
.big-three-edit svg { width:18px; height:18px; }
.big-three-edit > span:last-child { margin-left:12px; color:var(--muted); }
.big-three-dialog { width:min(940px,calc(100% - 32px)); max-height:calc(100dvh - 32px); border-radius:24px; background:var(--focus-surface); overflow:hidden; }
.big-three-frame { display:grid; grid-template-rows:auto minmax(0,1fr) auto; max-height:calc(100dvh - 34px); }
.big-three-top { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:12px 32px; border-bottom:1px solid var(--line); }
.big-three-wordmark { display:flex; align-items:center; gap:10px; font-size:.9rem; font-weight:600; }
.big-three-wordmark > span { color:var(--orange); font-size:1.2rem; }
.big-three-top .text-button { color:var(--muted); }
.big-three-scroll { overflow-y:auto; overscroll-behavior:contain; padding:28px 32px; scrollbar-gutter:stable; }
.big-three-welcome { max-width:540px; margin:10px auto 26px; }
.big-three-step-note { display:block; color:var(--muted); font-size:.8rem; margin-bottom:12px; }
.big-three-dialog h2 { font-size:clamp(1.55rem,3vw,2rem); font-weight:500; letter-spacing:-.035em; line-height:1.25; }
.big-three-heading > p, .big-three-welcome > p { font-size:.9rem; margin-bottom:24px; }
.big-three-welcome .notes-field { color:var(--text); margin-top:28px; }
.big-three-workspace { display:grid; grid-template-columns:minmax(0,1fr) 245px; gap:28px; align-items:start; }
.big-three-selection { grid-column:2; grid-row:1; padding:20px; border-radius:16px; background:var(--surface-raised); position:sticky; top:0; }
.big-three-selection-heading { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:14px; }
.big-three-selection h3 { margin:0; font-size:.92rem; font-weight:600; }
#big-three-count { color:var(--muted); font-size:.8rem; font-variant-numeric:tabular-nums; }
#big-three-selected { list-style:none; display:grid; gap:10px; padding:0; margin:0; }
.big-three-slot { border-bottom:1px solid var(--line); padding-bottom:10px; }
.big-three-slot:last-child { border:0; padding-bottom:0; }
.big-three-slot-label { display:flex; align-items:center; gap:10px; font-size:.86rem; overflow-wrap:anywhere; }
.big-three-slot-label > span:first-child { display:grid; place-items:center; width:25px; height:25px; flex:0 0 25px; border-radius:8px; background:var(--selected); color:var(--muted); font-size:.75rem; }
.big-three-slot.empty { min-height:56px; display:flex; align-items:center; color:var(--muted); }
.big-three-slot-actions { display:flex; justify-content:flex-end; margin-top:4px; }
.big-three-slot-actions button { display:grid; place-items:center; min-width:36px; min-height:40px; border:0; border-radius:8px; background:transparent; color:var(--muted); }
.big-three-slot-actions button:hover { background:var(--surface-hover); color:var(--text); }
.big-three-slot-actions svg { width:17px; height:17px; }
.big-three-help { font-size:.78rem; line-height:1.5; color:var(--muted); margin:14px 0 0; }
.big-three-discovery { grid-column:1; grid-row:1; min-width:0; }
.big-three-search { display:flex; align-items:center; gap:10px; border:1px solid var(--line); border-radius:12px; padding:0 13px; background:var(--field); color:var(--muted); }
.big-three-search:focus-within { outline:2px solid var(--purple); outline-offset:2px; }
.big-three-search input { border:0!important; background:transparent; min-width:0; padding:12px 0; outline:0; font-size:.88rem; }
.big-three-library { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; margin-top:14px; }
.big-three-choice { min-width:0; min-height:64px; display:flex; align-items:center; gap:10px; padding:12px; border:1px solid transparent; border-radius:12px; background:var(--surface); color:var(--text); text-align:left; transition:background .15s ease,border-color .15s ease; }
.big-three-choice:hover { background:var(--surface-hover); border-color:var(--line); }
.big-three-choice[aria-pressed="true"] { background:var(--selected); border-color:#aa70cd; }
.big-three-choice > span:nth-child(2) { min-width:0; flex:1; font-size:.82rem; font-weight:500; line-height:1.4; overflow-wrap:anywhere; }
.big-three-choice b { width:20px; height:20px; display:grid; place-items:center; flex:0 0 20px; border-radius:50%; border:1px solid var(--line); color:var(--muted); font-size:.7rem; font-weight:600; }
.big-three-choice[aria-pressed="true"] b { background:var(--text); color:var(--background); border-color:transparent; }
.big-three-icon { display:grid; place-items:center; flex:0 0 22px; color:var(--muted); }
.big-three-create { display:flex; align-items:center; gap:10px; min-height:48px; width:100%; margin-top:12px; padding:10px 12px; border:1px dashed var(--line); border-radius:12px; background:transparent; color:var(--text); text-align:left; font-size:.85rem; }
.big-three-create:hover { background:var(--surface); }
.big-three-create > span { font-size:1.2rem; }
.custom-area { display:flex; flex-wrap:wrap; align-items:end; gap:12px; padding:16px; border-radius:12px; background:var(--surface-raised); margin-top:12px; }
.custom-area label { display:grid; flex:1 1 180px; min-width:0; gap:8px; color:var(--text); font-size:.82rem; }
.custom-area input { font-size:.9rem; }
.custom-area > .error-message { width:100%; margin:0; }
.big-three-footer { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:12px 20px; padding:18px 32px; border-top:1px solid var(--line); background:var(--focus-surface); }
#big-three-message { flex:1 1 180px; margin:0; font-size:.8rem; line-height:1.5; }
.big-three-footer-actions { display:flex; flex-wrap:wrap; align-items:center; gap:8px 20px; }
.big-three-footer .button { padding:12px 20px; font-size:.9rem; font-weight:600; white-space:normal; box-shadow:none; }
.big-three-footer .text-button { font-size:.85rem; }
.big-three-settings :focus-visible, .big-three-dialog :focus-visible { outline:2px solid var(--purple); outline-offset:3px; }
.big-three-dialog h2:focus { outline:0; }
.toggle-field { grid-column:1 / -1; display:grid!important; grid-template-columns:auto 1fr; align-items:center; gap:9px!important; padding-top:5px; }
.toggle-field input { width:18px; min-height:18px; accent-color:var(--purple); }
.toggle-field small { grid-column:2; }
.auth-gate { min-height:100vh; position:relative; isolation:isolate; overflow:hidden; display:flex; flex-direction:column; padding:clamp(24px,4vw,52px); background:#000; color:#f7f3f8; }
.auth-gate::before { content:""; position:absolute; z-index:-1; width:min(780px,82vw); aspect-ratio:1; right:-17%; bottom:-55%; border-radius:50%; background:radial-gradient(circle at 35% 35%,#ff9b26 0 4%,#ff5a18 22%,#dc2e91 48%,#7728ff 67%,transparent 69%); filter:blur(8px); opacity:.85; }
.auth-brand { display:flex; align-items:center; gap:8px; font-size:.94rem; line-height:1.12; font-weight:700; }
.auth-layout { width:min(1160px,100%); flex:1; display:grid; grid-template-columns:minmax(0,1.25fr) minmax(320px,.75fr); gap:clamp(50px,10vw,140px); align-items:center; margin:auto; padding:70px 0; }
.auth-intro { max-width:650px; }
.auth-intro h1 { max-width:620px; font-size:clamp(3.4rem,7vw,7rem); }
.auth-intro > p:last-child { max-width:470px; font-size:1.05rem; }
.auth-card { padding:clamp(26px,4vw,42px); border:1px solid #302b33; border-radius:4px 24px 4px 24px; background:#0c0b0de8; box-shadow:0 26px 80px #0009; }
.auth-card h2 { margin-bottom:10px; font-size:clamp(1.7rem,3vw,2.35rem); }
.auth-card > p { font-size:.82rem; }
.auth-card label { display:grid; gap:8px; margin-top:26px; color:#ddd5e2; font-size:.78rem; }
.auth-submit { width:100%; margin-top:14px; }
.auth-step { color:#ca8cff!important; font-size:.64rem!important; letter-spacing:.16em; }
.auth-foot { margin:0; color:#837c86; font-size:.7rem; }
html[data-theme="light"] .auth-gate { background:#fff; color:#111012; }
html[data-theme="light"] .auth-gate::before { opacity:.22; }
html[data-theme="light"] .auth-card { border-color:#ddd8df; background:#fffffff2; box-shadow:0 25px 70px #47334a1c; }
html[data-theme="light"] .auth-card label { color:#302a32; }

html[data-theme="light"] {
  color-scheme:light;
  --background:#fff;
  --sidebar:#f7f6f4;
  --surface:#f5f3f2;
  --surface-raised:#f2eff2;
  --surface-hover:#e9e4eb;
  --text:#111012;
  --muted:#625d65;
  --subtle:#807a82;
  --line:#ddd8df;
  --field:#fff;
  --selected:#eae3ef;
  --heat-empty:#e9e6e9;
  --focus-surface:#fff;
  --danger:#8a2710;
}
html[data-theme="light"] .sidebar { border-right-color:#e6e1e6; }
html[data-theme="light"] .navigation a:hover { background:#eee9ef; }
html[data-theme="light"] .mobile-header { background:#fffffff0; border-color:#e4dfe5; }
html[data-theme="light"] .next-session { background:#f8f6f7; border-color:#ddd6df; }
html[data-theme="light"] .button.secondary { background:#f4f0f4; }
html[data-theme="light"] .progress-track,html[data-theme="light"] .area-bar { background:#e6e0e8; }
html[data-theme="light"] .heatmap-cell.has-time { background:#e5d9e6; }
html[data-theme="light"] .legend i { background:#e5e1e6; }
html[data-theme="light"] input,html[data-theme="light"] select,html[data-theme="light"] textarea,html[data-theme="light"] .field-suffix { border-color:#bcb5bf; }
html[data-theme="light"] .dialog { border-color:#d2cad4; box-shadow:0 28px 90px #362e3d3d; }
html[data-theme="light"] .dialog::backdrop { background:#2f27384d; }
html[data-theme="light"] .timer-orbit { background:conic-gradient(from 210deg,var(--orange),var(--coral),var(--purple) var(--timer-progress),#e6e0e8 var(--timer-progress)); }
html[data-theme="light"] .timer-core { box-shadow:inset 0 0 0 1px #ded8e0; }
html[data-theme="light"] .toast { background:#fff; border-color:#ba9dcc; box-shadow:0 12px 40px #3020372e; }

@media (min-width: 851px) and (max-width: 1100px) {
  .next-session { padding:40px 36px 230px; }
  .next-session::before { width:210px; height:210px; }
}

@media (max-width: 850px) {
  .app-shell { display: block; }
  .sidebar { position: fixed; inset: 64px auto 0 0; z-index: 15; width: 250px; height: calc(100vh - 64px); transform: translateX(-105%); transition: transform .2s ease; box-shadow: 20px 0 50px #0008; }
  .sidebar.open { transform: translateX(0); }
  .brand { display: none; }
  .navigation { margin-top: 10px; }
  .mobile-header { position: sticky; top: 0; z-index: 14; height: 64px; display: flex; justify-content: space-between; align-items: center; padding: 0 20px; border-bottom: 1px solid #29242d; background: #121015ed; backdrop-filter: blur(10px); }
  .mobile-brand { display: flex; align-items: center; gap: 8px; text-decoration: none; font-size: .82rem; line-height: 1.3; font-weight: 700; }
  .mobile-brand .brand-symbol { --brand-height: 1.3em; }
  main { padding-top: 45px; }
}

@media (max-width: 680px) {
  main { padding-left: 20px; padding-right: 20px; }
  .page-heading { display: grid; align-items: start; margin-bottom: 30px; }
  .page-heading .button { justify-self: start; }
  .next-session { padding:32px 28px 200px; min-height:0; }
  .next-session::before { width:180px; height:180px; right:4px; }
  .next-session.empty { display: grid; }
  .metric-row { grid-template-columns: 1fr; }
  .metric-row article, .metric-row article + article { padding: 21px 0; border-left: 0; }
  .metric-row article + article { border-top: 1px solid var(--line); }
  .home-lower { grid-template-columns: 1fr; }
  .continuation { padding: 30px 0 0; border-left: 0; border-top: 1px solid var(--line); }
  .summary-strip, .insights-summary { grid-template-columns: 1fr; }
  .summary-strip > span, .insights-summary article { padding: 13px 0; }
  .summary-strip > span + span, .insights-summary article + article { padding-left: 0; border-left: 0; border-top: 1px solid var(--line); }
  .schedule-day { grid-template-columns: 1fr auto; gap: 12px; }
  .schedule-day > div:nth-child(2) { grid-column: 1 / -1; grid-row: 2; }
  .form-grid { grid-template-columns: 1fr; }
  .big-three-settings { padding:20px; }
  .big-three-summary { display:grid; gap:8px; margin:20px 0; }
  .big-three-edit { width:100%; }
  .big-three-dialog { width:calc(100% - 20px); max-height:calc(100dvh - 20px); border-radius:18px; }
  .big-three-frame { max-height:calc(100dvh - 22px); }
  .big-three-top { padding:10px 20px; }
  .big-three-scroll { padding:20px; scrollbar-gutter:auto; }
  .big-three-workspace { display:flex; flex-direction:column; gap:20px; }
  .big-three-selection { position:static; width:100%; padding:16px; }
  .big-three-discovery { width:100%; }
  .big-three-slot { display:flex; align-items:center; justify-content:space-between; gap:8px; padding-bottom:6px; }
  .big-three-slot-label { min-width:0; }
  .big-three-slot-actions { flex-shrink:0; margin:0; }
  .big-three-slot.empty { min-height:42px; }
  .big-three-choice { gap:8px; padding:10px; }
  .big-three-library { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .big-three-footer { padding:14px 20px; gap:10px; }
  #big-three-message { flex-basis:100%; }
  .big-three-footer-actions { justify-content:space-between; width:100%; }
  .big-three-footer-actions .button { margin-left:auto; }
  .auth-layout { grid-template-columns:1fr; gap:38px; padding:45px 0; }
  .auth-intro h1 { font-size:clamp(3rem,15vw,5rem); }
  .full-field { grid-column: auto; }
  .session-editor-fields { grid-template-columns: minmax(0,1fr) minmax(0,1fr); }
  .session-editor-fields .area-field, .session-editor-fields .topic-field { grid-column: 1 / -1; }
  .planner-review-row { grid-template-columns: 80px 1fr; }
  .planner-review-row > :last-child { grid-column: 2; }
  .dialog-actions { align-items: flex-end; }
  .heatmap { gap: 4px; }
  .heatmap.full .heatmap-cell { width: clamp(10px, 2.8vw, 16px); border-radius: 4px; }
  .area-row { grid-template-columns: 120px 1fr 54px; font-size: .8rem; }
  .reflection { grid-template-columns: 1fr; gap: 7px; }
  .heatmap-detail article { grid-template-columns:1fr; gap:5px; }
  .theme-options { grid-template-columns:1fr; }
}

@media (max-width: 390px) {
  .planner-day-choice { grid-template-columns:1fr; }
  .planner-day-nav { gap:4px; }
  .planner-day-nav button { min-width:51px; padding:8px; }
  .planner-day-actions { gap:10px; }
  .planner-day-actions > button { max-width:60%; font-size:.82rem; }
  .big-three-library { grid-template-columns:1fr; }
  .big-three-slot { display:block; }
  .big-three-slot-actions { margin-top:2px; }
  .big-three-slot-label { line-height:1.5; }
  .account-actions { display:grid; justify-items:start; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; }
}