*{box-sizing:border-box}html,body{margin:0;padding:0;background:var(--bg-solid);color:var(--text);font-family:var(--font-body);-webkit-font-smoothing:antialiased}.page{min-height:100vh;width:100%;display:flex;justify-content:center;background:var(--bg);position:relative}.page:before{content:"";position:fixed;top:0;right:0;bottom:0;left:0;background-image:var(--page-texture, none);background-size:var(--page-texture-size, 22px 22px);pointer-events:none}.app{width:100%;max-width:480px;min-height:100vh;padding:24px 20px 40px;display:flex;flex-direction:column;gap:18px;position:relative;z-index:1}button{font:inherit}.t-display{font-family:var(--font-display);font-weight:var(--display-weight, 700);letter-spacing:var(--display-tracking, -.02em);line-height:1.05}.t-mono{font-family:var(--font-mono);letter-spacing:0}.t-eyebrow{font-family:var(--font-mono);text-transform:var(--eyebrow-transform, uppercase);letter-spacing:var(--eyebrow-spacing, .18em);font-size:10px;font-weight:500;color:var(--text-muted)}.muted{color:var(--text-muted)}.dim{color:var(--text-dim)}.brand{display:flex;align-items:center;gap:10px}.brand-mark{width:32px;height:32px;border-radius:var(--radius-btn, 10px);background:var(--brand-mark-bg, linear-gradient(135deg, var(--accent), var(--accent-2)));color:var(--on-accent);display:grid;place-items:center;font-family:var(--font-mono);font-weight:800;font-size:14px;box-shadow:var(--glow, none)}.brand-name{font-weight:700;letter-spacing:-.01em;font-size:16px}.brand-sub{font-family:var(--font-mono);font-size:9px;color:var(--text-muted);text-transform:var(--eyebrow-transform, uppercase);letter-spacing:.18em}.card{background:var(--surface);border:1px solid var(--surface-border, var(--border));border-radius:var(--radius-card, 20px);padding:18px;backdrop-filter:blur(var(--card-blur, 0px));-webkit-backdrop-filter:blur(var(--card-blur, 0px));box-shadow:var(--card-shadow, none)}.card-hero{background:var(--hero-bg, var(--surface));border:1px solid var(--border-strong)}.btn{font-family:var(--font-display);font-weight:600;font-size:14px;letter-spacing:-.01em;padding:14px 18px;border-radius:var(--radius-btn, 14px);border:1px solid var(--border-strong);background:var(--btn-bg, color-mix(in oklab, var(--text) 5%, transparent));color:var(--text);cursor:pointer;transition:transform .1s,box-shadow .15s,background .15s;display:inline-flex;align-items:center;gap:8px;justify-content:center}.btn:hover{background:color-mix(in oklab,var(--text) 8%,transparent)}.btn:active{transform:scale(.98)}.btn:disabled{opacity:.4;cursor:not-allowed}.btn-primary{background:var(--btn-primary-bg, linear-gradient(135deg, var(--accent), var(--accent-2)));border:0;box-shadow:var(--glow, none);color:var(--on-accent)}.btn-block{width:100%}.years-grid{display:grid;grid-template-columns:repeat(10,1fr);gap:6px}.year-cell{aspect-ratio:1 / 1;border-radius:var(--radius-cell, 4px);font-family:var(--font-mono);font-size:11px;font-weight:500;display:grid;place-items:center;transition:transform .12s;min-width:0}.year-cell.past{background:var(--grid-past);color:var(--grid-past-text, var(--on-accent))}.year-cell.now{background:var(--grid-now);color:var(--grid-now-text, var(--on-accent));font-weight:700;box-shadow:var(--grid-now-shadow, none);animation:pulse-cell 1.6s ease-in-out infinite;position:relative;z-index:2}.year-cell.future{background:var(--grid-future);color:var(--text-dim);border:1px solid var(--future-border, color-mix(in oklab, var(--text) 5%, transparent))}.years-grid.compact{gap:4px}.years-grid.compact .year-cell{aspect-ratio:1.5 / 1;font-size:9px}.months-compact-grid{display:grid;grid-template-columns:repeat(24,1fr);gap:2px}.mcell{aspect-ratio:1 / 1;border-radius:var(--radius-cell, 2px);min-width:0}.mcell.past{background:var(--grid-past)}.mcell.future{background:var(--grid-future)}.mcell.now{background:var(--grid-now);box-shadow:var(--grid-now-shadow, none);animation:pulse-cell 1.6s ease-in-out infinite;position:relative;z-index:2}.months-compact-grid.compact{gap:1px}.months-compact-grid.compact .mcell{aspect-ratio:1.7 / 1}.weeks-grid{display:grid;grid-template-columns:repeat(52,1fr);gap:1.5px}.wcell{aspect-ratio:1 / 1;border-radius:var(--radius-cell, 1px);min-width:0}.wcell.past{background:var(--grid-past)}.wcell.future{background:var(--grid-future)}.wcell.now{background:var(--grid-now);box-shadow:var(--grid-now-shadow, none);animation:pulse-cell 1.6s ease-in-out infinite;position:relative;z-index:2}.weeks-grid.compact{gap:1px}.weeks-grid.compact .wcell{aspect-ratio:1.6 / 1}@keyframes pulse-cell{0%,to{transform:scale(1)}50%{transform:scale(1.3)}}.chip{display:inline-flex;align-items:center;gap:6px;padding:5px 10px;border-radius:var(--radius-pill, 999px);font-size:11px;font-family:var(--font-mono);text-transform:uppercase;letter-spacing:.08em;background:color-mix(in oklab,var(--text) 5%,transparent);border:1px solid var(--border);color:var(--text-soft)}.chip-lived{color:var(--grid-past);background:color-mix(in oklab,var(--grid-past) 16%,transparent);border-color:color-mix(in oklab,var(--grid-past) 32%,transparent)}.chip-now{color:var(--grid-now);background:color-mix(in oklab,var(--grid-now) 16%,transparent);border-color:color-mix(in oklab,var(--grid-now) 32%,transparent)}.chip-future{color:var(--text-muted)}.xp-bar{height:8px;background:var(--xp-track, color-mix(in oklab, var(--text) 10%, transparent));border-radius:var(--radius-pill, 999px);overflow:hidden;position:relative}.xp-fill{height:100%;background:var(--xp-fill, linear-gradient(90deg, var(--accent), var(--accent-2), var(--info)));border-radius:var(--radius-pill, 999px);position:relative;transition:width .6s cubic-bezier(.2,.7,.2,1)}.xp-fill:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(90deg,transparent,var(--xp-shimmer, rgba(255,255,255,.4)),transparent);animation:shimmer 2.5s linear infinite}@keyframes shimmer{0%{transform:translate(-100%)}to{transform:translate(100%)}}@keyframes fade-up{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.fade-up{animation:fade-up .4s ease-out both}@keyframes q-pop{0%{transform:translateY(8px) scale(.985)}to{transform:none}}.q-pop{animation:q-pop .35s ease-out}.quiz-nudge{font-family:var(--font-display);color:var(--text);transition:transform .15s ease,box-shadow .15s ease;animation:fade-up .4s ease-out .06s both,nudge-glow 3s ease-in-out 1.2s infinite}.quiz-nudge:hover{transform:translateY(-1px);box-shadow:0 6px 22px color-mix(in oklab,var(--gold) 26%,transparent)}@keyframes nudge-glow{0%,to{box-shadow:0 0 0 0 transparent}50%{box-shadow:0 6px 26px color-mix(in oklab,var(--gold) 24%,transparent)}}.badge-mini{position:relative;width:44px;height:44px;border-radius:50%;flex-shrink:0;display:grid;place-items:center;font-size:22px;background:var(--badge-bg, radial-gradient(circle at 30% 30%, color-mix(in oklab, var(--on-accent) 22%, transparent), transparent 60%), linear-gradient(135deg, var(--accent-2), var(--accent)));box-shadow:inset 0 0 0 1px color-mix(in oklab,var(--on-accent) 18%,transparent),var(--glow-2, none)}.badge-mini.locked{background:color-mix(in oklab,var(--text) 3%,transparent);box-shadow:inset 0 0 0 1px var(--border);filter:grayscale(1);opacity:.45}.overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:color-mix(in oklab,var(--bg-solid) 78%,transparent);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);z-index:50;display:grid;place-items:center;padding:20px;animation:fade-up .25s ease-out}.confetti-piece{position:fixed;width:8px;height:12px;pointer-events:none;z-index:100;animation:confetti-fall 1.8s linear forwards}@keyframes confetti-fall{0%{transform:translateY(-20px) rotate(0);opacity:1}to{transform:translateY(110vh) rotate(540deg);opacity:0}}.input{width:100%;min-width:0;background:color-mix(in oklab,var(--text) 5%,transparent);border:1.5px solid var(--border-strong);border-radius:var(--radius-btn, 14px);padding:14px 16px;font-size:18px;color:var(--text);font-family:var(--font-display);outline:none;transition:border-color .15s,box-shadow .15s}.input::placeholder{color:var(--text-dim)}.input:focus{border-color:var(--accent);box-shadow:0 0 0 3px color-mix(in oklab,var(--accent) 15%,transparent)}.settings-menu{position:relative;display:inline-flex}.btn-icon{padding:8px 11px;font-size:15px;line-height:1}.settings-panel{position:absolute;top:calc(100% + 10px);right:0;z-index:50;width:280px;max-width:calc(100vw - 32px);max-height:calc(100vh - 140px);overflow-y:auto;background:linear-gradient(var(--surface),var(--surface)),var(--bg-solid);border:1px solid var(--border-strong);border-radius:var(--radius-card, 18px);padding:16px;display:flex;flex-direction:column;gap:18px;box-shadow:0 20px 60px #00000073;backdrop-filter:blur(var(--card-blur, 0px));-webkit-backdrop-filter:blur(var(--card-blur, 0px));animation:fade-up .2s ease-out}.settings-row{display:flex;flex-direction:column;gap:10px}.theme-list{display:grid;gap:8px}.theme-opt{display:flex;align-items:center;gap:10px;padding:8px;width:100%;text-align:left;cursor:pointer;border-radius:var(--radius-btn, 10px);border:1px solid var(--border);background:color-mix(in oklab,var(--text) 4%,transparent);color:var(--text);transition:border-color .12s,transform .12s}.theme-opt:hover{transform:translateY(-1px)}.theme-opt[data-on="1"]{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent)}.theme-swatch{display:flex;width:34px;height:34px;border-radius:8px;overflow:hidden;flex-shrink:0;border:1px solid var(--border)}.theme-swatch i{flex:1}.theme-opt-name{font-weight:700;font-size:13px;line-height:1.1}.theme-opt-blurb{font-size:11px;color:var(--text-muted);margin-top:2px}.settings-swatches{display:flex;gap:10px}.settings-range{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:100%;height:5px;border-radius:999px;margin:4px 0;background:color-mix(in oklab,var(--text) 14%,transparent);outline:none}.settings-range::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:18px;height:18px;border-radius:50%;background:var(--accent);box-shadow:var(--glow, none);cursor:pointer}.settings-range::-moz-range-thumb{width:18px;height:18px;border-radius:50%;border:0;background:var(--accent);box-shadow:var(--glow, none);cursor:pointer}.row{display:flex;align-items:center;gap:8px}.col{display:flex;flex-direction:column;gap:8px}.between{justify-content:space-between}.spacer{flex:1}.center{display:grid;place-items:center}:root,[data-theme=editorial]{--bg-solid: #f4efe3;--bg: radial-gradient(ellipse 90% 60% at 50% -10%, #fbf8f0, transparent 60%), linear-gradient(180deg, #f7f3ea 0%, #efe8d8 100%);--surface: #fffdf7;--surface-2: #f3ecdc;--surface-border: rgba(60, 48, 33, .12);--hero-bg: linear-gradient(180deg, #fffdf8 0%, #f5efe1 100%);--border: rgba(60, 48, 33, .12);--border-strong: rgba(60, 48, 33, .2);--card-blur: 0px;--card-shadow: 0 1px 2px rgba(60, 48, 33, .05), 0 10px 30px rgba(60, 48, 33, .06);--text: #221d16;--text-soft: #463d30;--text-muted: #897c67;--text-dim: #b6a88f;--accent: #8c2f2f;--accent-2: #b5573b;--info: #3f6657;--gold: #9a7b1f;--pos: #3f6657;--neg: #8c2f2f;--on-accent: #fdf7ec;--glow: none;--glow-2: none;--glow-gold: none;--grid-past: rgba(40, 32, 22, .62);--grid-past-text: rgba(247, 243, 234, .92);--grid-now: #8c2f2f;--grid-now-text: #fdf7ec;--grid-future: rgba(40, 32, 22, .1);--grid-now-shadow: none;--font-display: "Fraunces", Georgia, serif;--font-body: "Plus Jakarta Sans", system-ui, sans-serif;--font-mono: "JetBrains Mono", monospace;--display-weight: 600;--display-tracking: -.01em;--eyebrow-transform: uppercase;--eyebrow-spacing: .18em;--radius-card: 14px;--radius-btn: 10px;--radius-pill: 999px;--radius-cell: 2px;--page-texture: radial-gradient(circle at 1px 1px, rgba(60, 48, 33, .05) 1px, transparent 0);--page-texture-size: 20px 20px;--xp-shimmer: rgba(255, 255, 255, .5)}[data-theme=cosmic]{--bg-solid: #080b18;--bg: radial-gradient(ellipse 80% 60% at 50% -10%, rgba(120, 140, 255, .18), transparent 60%), radial-gradient(ellipse 60% 50% at 90% 20%, rgba(217, 179, 92, .1), transparent 60%), linear-gradient(180deg, #0c1126 0%, #070a16 100%);--surface: rgba(26, 34, 66, .55);--surface-2: rgba(34, 44, 84, .6);--surface-border: rgba(180, 200, 255, .14);--hero-bg: radial-gradient(ellipse at 30% 0%, rgba(217, 179, 92, .18), transparent 60%), radial-gradient(ellipse at 100% 100%, rgba(185, 140, 255, .16), transparent 60%), linear-gradient(180deg, #141b3a 0%, #0e1430 100%);--border: rgba(180, 200, 255, .14);--border-strong: rgba(180, 200, 255, .22);--card-blur: 12px;--card-shadow: 0 20px 60px rgba(0, 0, 0, .5);--text: #eef1ff;--text-soft: #c4ccec;--text-muted: #8b94c0;--text-dim: #565f86;--accent: #d9b35c;--accent-2: #b98cff;--info: #7fb6e0;--gold: #e7c873;--pos: #7fd6a8;--neg: #e08aa0;--on-accent: #0a0e1f;--glow: 0 0 14px rgba(217, 179, 92, .5), 0 0 30px rgba(217, 179, 92, .22);--glow-2: 0 0 14px rgba(185, 140, 255, .45), 0 0 30px rgba(185, 140, 255, .2);--glow-gold: 0 0 12px rgba(231, 200, 115, .5);--grid-past: rgba(185, 140, 255, .6);--grid-past-text: #0a0e1f;--grid-now: #d9b35c;--grid-now-text: #0a0e1f;--grid-future: rgba(180, 200, 255, .1);--grid-now-shadow: 0 0 10px rgba(217, 179, 92, .85), 0 0 22px rgba(217, 179, 92, .4);--font-display: "Fraunces", Georgia, serif;--font-body: "Plus Jakarta Sans", system-ui, sans-serif;--font-mono: "JetBrains Mono", monospace;--display-weight: 500;--display-tracking: 0;--eyebrow-transform: uppercase;--eyebrow-spacing: .2em;--radius-card: 18px;--radius-btn: 12px;--radius-pill: 999px;--radius-cell: 4px;--page-texture: radial-gradient(circle at 20% 30%, rgba(255, 255, 255, .5) .5px, transparent 1px), radial-gradient(circle at 75% 60%, rgba(255, 255, 255, .35) .5px, transparent 1px), radial-gradient(circle at 50% 85%, rgba(255, 255, 255, .4) .5px, transparent 1px);--page-texture-size: 120px 120px, 90px 90px, 70px 70px}[data-theme=arcade]{--bg-solid: #08051a;--bg: radial-gradient(ellipse 60% 40% at 50% 0%, oklch(70% .22 305 / .2), transparent 60%), radial-gradient(ellipse 50% 40% at 100% 30%, oklch(72% .22 350 / .15), transparent 60%), radial-gradient(ellipse 60% 40% at 0% 80%, oklch(82% .16 200 / .1), transparent 60%), linear-gradient(180deg, #0e0828 0%, #08051a 100%);--surface: rgba(40, 26, 88, .55);--surface-2: rgba(50, 32, 100, .6);--surface-border: rgba(255, 255, 255, .08);--hero-bg: radial-gradient(ellipse at 30% 0%, oklch(72% .22 350 / .25), transparent 60%), radial-gradient(ellipse at 100% 100%, oklch(70% .22 305 / .2), transparent 60%), linear-gradient(180deg, #1a0e3f 0%, #160a35 100%);--border: rgba(255, 255, 255, .08);--border-strong: rgba(255, 255, 255, .14);--card-blur: 12px;--card-shadow: none;--text: #fefbff;--text-soft: #d4cce8;--text-muted: #8b80b3;--text-dim: #5a527a;--accent: oklch(72% .22 350);--accent-2: oklch(70% .22 305);--info: oklch(82% .16 200);--gold: oklch(88% .18 95);--pos: oklch(82% .2 145);--neg: oklch(72% .22 350);--on-accent: #ffffff;--glow: 0 0 12px oklch(72% .22 350 / .55), 0 0 28px oklch(72% .22 350 / .25);--glow-2: 0 0 12px oklch(70% .22 305 / .55), 0 0 28px oklch(70% .22 305 / .25);--glow-gold: 0 0 10px oklch(88% .18 95 / .55), 0 0 22px oklch(88% .18 95 / .25);--grid-past: oklch(70% .22 305 / .85);--grid-past-text: rgba(255, 255, 255, .78);--grid-now: oklch(72% .22 350);--grid-now-text: #ffffff;--grid-future: rgba(255, 255, 255, .07);--grid-now-shadow: 0 0 8px oklch(72% .22 350 / .9), 0 0 18px oklch(72% .22 350 / .5);--font-display: "Space Grotesk", system-ui, sans-serif;--font-body: "Space Grotesk", system-ui, sans-serif;--font-mono: "JetBrains Mono", monospace;--display-weight: 700;--display-tracking: -.02em;--eyebrow-transform: uppercase;--eyebrow-spacing: .18em;--radius-card: 20px;--radius-btn: 14px;--radius-pill: 999px;--radius-cell: 3px;--page-texture: radial-gradient(circle at 1px 1px, rgba(255, 255, 255, .035) 1px, transparent 0);--page-texture-size: 22px 22px}[data-theme=pastel]{--bg-solid: #fbf5f6;--bg: radial-gradient(ellipse 70% 50% at 50% 0%, #fde7ef, transparent 60%), radial-gradient(ellipse 60% 50% at 100% 25%, #e9ecfd, transparent 60%), radial-gradient(ellipse 60% 50% at 0% 80%, #e3f6f2, transparent 60%), linear-gradient(180deg, #fdfafb 0%, #f6eef2 100%);--surface: #fffdfe;--surface-2: #f6eef3;--surface-border: rgba(120, 90, 110, .12);--hero-bg: linear-gradient(135deg, #fde7ef 0%, #e9ecfd 100%);--border: rgba(120, 90, 110, .12);--border-strong: rgba(120, 90, 110, .18);--card-blur: 0px;--card-shadow: 0 10px 30px rgba(120, 90, 110, .1);--text: #3a2f3a;--text-soft: #6a5d6a;--text-muted: #9b8fa0;--text-dim: #c3b8c5;--accent: #e57ba3;--accent-2: #9aa6ef;--info: #5bb8b2;--gold: #e0a94f;--pos: #5cbf8f;--neg: #ef8fa0;--on-accent: #ffffff;--glow: 0 8px 22px rgba(229, 123, 163, .3);--glow-2: 0 8px 22px rgba(154, 166, 239, .28);--glow-gold: 0 8px 20px rgba(224, 169, 79, .28);--grid-past: #b9a3e6;--grid-past-text: #ffffff;--grid-now: #e57ba3;--grid-now-text: #ffffff;--grid-future: rgba(120, 90, 110, .12);--grid-now-shadow: 0 4px 12px rgba(229, 123, 163, .5);--font-display: "Plus Jakarta Sans", system-ui, sans-serif;--font-body: "Plus Jakarta Sans", system-ui, sans-serif;--font-mono: "Plus Jakarta Sans", system-ui, sans-serif;--display-weight: 800;--display-tracking: -.02em;--eyebrow-transform: uppercase;--eyebrow-spacing: .14em;--radius-card: 24px;--radius-btn: 16px;--radius-pill: 999px;--radius-cell: 4px;--page-texture: none;--page-texture-size: 0;--xp-shimmer: rgba(255, 255, 255, .6)}[data-theme=terminal]{--bg-solid: #07070a;--bg: #07070a;--surface: #0d0d12;--surface-2: #131319;--surface-border: #2a2a33;--hero-bg: #0d0d12;--border: #23232b;--border-strong: #3a3a45;--card-blur: 0px;--card-shadow: none;--text: #e8e6cf;--text-soft: #c9c7a8;--text-muted: #8a8a72;--text-dim: #57574a;--accent: #ffb000;--accent-2: #ff7a1a;--info: #6fe0b0;--gold: #ffcf4d;--pos: #3fe07a;--neg: #ff5555;--on-accent: #07070a;--glow: 0 0 8px rgba(255, 176, 0, .35);--glow-2: 0 0 8px rgba(255, 122, 26, .3);--glow-gold: 0 0 8px rgba(255, 207, 77, .35);--grid-past: rgba(255, 176, 0, .55);--grid-past-text: #07070a;--grid-now: #ffcf4d;--grid-now-text: #07070a;--grid-future: #17171d;--grid-now-shadow: 0 0 6px rgba(255, 207, 77, .85);--font-display: "JetBrains Mono", monospace;--font-body: "JetBrains Mono", monospace;--font-mono: "JetBrains Mono", monospace;--display-weight: 700;--display-tracking: 0;--eyebrow-transform: uppercase;--eyebrow-spacing: .12em;--radius-card: 0px;--radius-btn: 0px;--radius-pill: 0px;--radius-cell: 0px;--page-texture: repeating-linear-gradient(0deg, rgba(255, 255, 255, .025) 0 1px, transparent 1px 3px);--page-texture-size: auto;--future-border: #1c1c24;--xp-shimmer: rgba(255, 176, 0, .35)}