:root{--font-base: ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;--font-rounded: ui-rounded, "SF Pro Rounded", "Nunito", "Segoe UI", var(--font-base);--font: var(--font-base);--font-display: var(--font-rounded);--radius-s: 10px;--radius: 16px;--radius-l: 24px;--gap: 16px;--tap: 48px;--bg: #f7f5ef;--surface: #ffffff;--surface-2: #f1efe7;--ink: #1d2422;--ink-2: #4b5653;--ink-3: #566260;--line: #e3dfd3;--brand: #0f766e;--brand-ink: #ffffff;--brand-soft: #d6f1ec;--accent: #f59e0b;--accent-soft: #fdf0d5;--good: #15803d;--good-soft: #dcfce7;--warn: #b45309;--warn-soft: #fef3c7;--info: #1d4ed8;--info-soft: #dbeafe;--shadow: 0 1px 2px rgb(20 30 28 / 6%), 0 8px 24px rgb(20 30 28 / 6%);--sky-a: #9be7dc;--sky-b: #fef3c7;--sky-ink: #12312d;--focus: 0 0 0 3px #f59e0b;--ease: cubic-bezier(.2, .8, .2, 1);color-scheme:light}@media(prefers-color-scheme:dark){:root:not([data-scheme=light]){--bg: #0d1513;--surface: #15201e;--surface-2: #1c2926;--ink: #eef4f2;--ink-2: #c3cfcc;--ink-3: #93a19d;--line: #2a3936;--brand: #2dd4bf;--brand-ink: #062320;--brand-soft: #123a35;--accent-soft: #3a2a0c;--good-soft: #10301d;--warn-soft: #3a2a0c;--info-soft: #172554;--shadow: 0 1px 2px rgb(0 0 0 / 30%), 0 8px 24px rgb(0 0 0 / 25%);--sky-a: #134e48;--sky-b: #1f2937;--sky-ink: #ecfdf5;color-scheme:dark}}[data-mode=playful]{--radius: 20px;--radius-l: 28px;--font: var(--font-rounded);--brand: #7c3aed;--brand-soft: #ede9fe;--sky-a: #c4b5fd;--sky-b: #fde68a}[data-mode=sophisticated]{--font-display: var(--font-base);--radius: 12px;--radius-l: 18px;--brand: #1f3a5f;--brand-soft: #e3eaf3;--sky-a: #cbd5e1;--sky-b: #f1f5f9}@media(prefers-color-scheme:dark){:root:not([data-scheme=light])[data-mode=playful]{--brand: #c4b5fd;--brand-ink: #1e1236;--brand-soft: #2e1f52;--sky-a: #3b2a6b}:root:not([data-scheme=light])[data-mode=sophisticated]{--brand: #93c5fd;--brand-ink: #0b1a2e;--brand-soft: #1b2a40;--sky-a: #1e293b}}[data-period=dawn]{--sky-a: #fecaca;--sky-b: #fde68a}[data-period=dusk]{--sky-a: #fdba74;--sky-b: #c4b5fd}[data-period=night]{--sky-a: #1e1b4b;--sky-b: #0f766e;--sky-ink: #f8fafc}[data-theme=halloween]{--sky-a: #3b0764;--sky-b: #ea580c;--sky-ink: #fff7ed;--accent: #ea580c}[data-theme=deepavali]{--sky-a: #7c2d12;--sky-b: #f59e0b;--sky-ink: #fffbeb;--accent: #db2777}[data-theme=chinese_new_year]{--sky-a: #b91c1c;--sky-b: #f59e0b;--sky-ink: #fffbeb;--accent: #dc2626}[data-theme=hari_raya_aidilfitri]{--sky-a: #166534;--sky-b: #facc15;--sky-ink: #f7fee7;--accent: #ca8a04}[data-theme=merdeka],[data-theme=malaysia_day]{--sky-a: #1e3a8a;--sky-b: #dc2626;--sky-ink: #fefce8;--accent: #facc15}[data-theme=christmas]{--sky-a: #14532d;--sky-b: #b91c1c;--sky-ink: #f0fdf4;--accent: #dc2626}[data-theme=new_year]{--sky-a: #312e81;--sky-b: #db2777;--sky-ink: #fdf4ff}[data-theme=birthday]{--sky-a: #fda4af;--sky-b: #fde68a;--sky-ink: #3f0d1a;--accent: #e11d48}*{box-sizing:border-box}html,body{margin:0}body{background:var(--bg);color:var(--ink);font:16px/1.5 var(--font);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}h1,h2,h3{font-family:var(--font-display);line-height:1.2;margin:0 0 8px;letter-spacing:-.01em}h1{font-size:1.6rem}h2{font-size:1.2rem}h3{font-size:1.02rem}p{margin:0 0 8px}a{color:var(--brand)}button,input,select,textarea{font:inherit;color:inherit}:focus-visible{outline:none;box-shadow:var(--focus);border-radius:8px}img{max-width:100%;display:block}.skip{position:absolute;left:-999px;top:8px;background:var(--surface);padding:8px 12px;z-index:100}.skip:focus{left:8px}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}.app{min-height:100dvh;display:flex;flex-direction:column}.main{flex:1;width:100%;max-width:720px;margin:0 auto;padding:0 16px calc(96px + env(safe-area-inset-bottom))}.sky{position:relative;overflow:hidden;color:var(--sky-ink);background:linear-gradient(135deg,var(--sky-a),var(--sky-b));padding:calc(18px + env(safe-area-inset-top)) 16px 28px;border-radius:0 0 var(--radius-l) var(--radius-l);margin:0 -16px 16px}.sky-inner{max-width:688px;margin:0 auto;position:relative;z-index:1}.sky .eyebrow{opacity:.85;font-size:.85rem;font-weight:600;letter-spacing:.02em}.sky h1{color:inherit;margin-top:4px}.sky-deco{position:absolute;inset:0;pointer-events:none;opacity:.55}.sky-deco span{position:absolute;font-size:28px;animation:float 6s var(--ease) infinite alternate}@keyframes float{0%{transform:translateY(0) rotate(-4deg)}to{transform:translateY(-8px) rotate(4deg)}}.topbar{display:flex;align-items:center;justify-content:space-between;gap:12px}.icon-btn{min-width:var(--tap);min-height:var(--tap);border-radius:999px;border:0;background:#ffffff38;color:inherit;display:inline-grid;place-items:center;cursor:pointer;position:relative}.badge-dot{position:absolute;top:8px;right:8px;min-width:18px;height:18px;border-radius:9px;background:var(--accent);color:#1a1205;font-size:11px;font-weight:700;display:grid;place-items:center;padding:0 4px}.nav{position:fixed;left:0;right:0;bottom:0;z-index:20;background:color-mix(in srgb,var(--surface) 92%,transparent);backdrop-filter:saturate(1.4) blur(12px);border-top:1px solid var(--line);padding:6px 8px calc(6px + env(safe-area-inset-bottom))}.nav ul{list-style:none;margin:0 auto;padding:0;display:grid;grid-template-columns:repeat(5,1fr);max-width:720px}.nav a{display:flex;flex-direction:column;align-items:center;gap:2px;min-height:52px;justify-content:center;text-decoration:none;color:var(--ink-3);font-size:.72rem;font-weight:600;border-radius:14px}.nav a[aria-current=page]{color:var(--brand);background:var(--brand-soft)}.nav svg{width:24px;height:24px}.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:16px;box-shadow:var(--shadow);margin-bottom:12px}.card.soft{background:var(--surface-2);box-shadow:none}.card.hero{background:linear-gradient(180deg,var(--brand-soft),var(--surface))}.card-head{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:8px}.section-title{display:flex;align-items:baseline;justify-content:space-between;margin:20px 0 8px}.section-title h2{margin:0}.muted{color:var(--ink-3)}.small{font-size:.86rem}.row{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.stack{display:grid;gap:10px}.grid2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.btn{min-height:var(--tap);padding:0 18px;border-radius:999px;border:1px solid transparent;cursor:pointer;font-weight:650;display:inline-flex;align-items:center;justify-content:center;gap:8px;text-decoration:none;transition:transform .12s var(--ease),background .2s}.btn:active{transform:scale(.97)}.btn-primary{background:var(--brand);color:var(--brand-ink)}.btn-secondary{background:var(--surface);color:var(--ink);border-color:var(--line)}.btn-ghost{background:transparent;color:var(--brand)}.btn-block{width:100%}.btn[disabled]{opacity:.55;cursor:not-allowed}.chip{display:inline-flex;align-items:center;gap:6px;padding:4px 10px;border-radius:999px;font-size:.78rem;font-weight:650;background:var(--surface-2);color:var(--ink-2)}.chip.good{background:var(--good-soft);color:var(--good)}.chip.warn{background:var(--warn-soft);color:var(--warn)}.chip.info{background:var(--info-soft);color:var(--info)}.chip.brand{background:var(--brand-soft);color:var(--brand)}.field{display:grid;gap:6px;margin-bottom:12px}.field label{font-weight:600;font-size:.9rem}.input,.select,.textarea{width:100%;min-height:var(--tap);padding:10px 14px;border-radius:var(--radius-s);border:1px solid var(--line);background:var(--surface);color:var(--ink)}.textarea{min-height:96px;resize:vertical}.hint{font-size:.82rem;color:var(--ink-3)}.error-text{color:#b91c1c;font-size:.86rem}@media(prefers-color-scheme:dark){.error-text{color:#fca5a5}}.task{display:grid;grid-template-columns:auto 1fr auto;gap:12px;align-items:center;padding:12px 4px;border-bottom:1px solid var(--line)}.task:last-child{border-bottom:0}.check{width:36px;height:36px;border-radius:50%;border:2px solid var(--brand);background:transparent;cursor:pointer;display:grid;place-items:center;color:var(--brand-ink)}.check.done{background:var(--good);border-color:var(--good)}.check.review{border-style:dashed;border-color:var(--warn)}.task-title{font-weight:650}.task-meta{font-size:.8rem;color:var(--ink-3)}.progress{height:10px;border-radius:999px;background:var(--surface-2);overflow:hidden}.progress>i{display:block;height:100%;background:linear-gradient(90deg,var(--brand),var(--accent));border-radius:inherit;transition:width .6s var(--ease)}.avatar{width:48px;height:48px;border-radius:50%;display:grid;place-items:center;font-size:24px;flex:none}.avatar.lg{width:72px;height:72px;font-size:36px}.avatar.sm{width:32px;height:32px;font-size:16px}.wallet{display:flex;align-items:baseline;gap:6px}.wallet strong{font-size:2.2rem;font-family:var(--font-display);line-height:1}.tabs{display:flex;gap:6px;overflow-x:auto;padding-bottom:4px;margin-bottom:12px;scrollbar-width:none}.tabs button{flex:none;min-height:40px;padding:0 14px;border-radius:999px;border:1px solid var(--line);background:var(--surface);cursor:pointer;font-weight:600;color:var(--ink-2)}.tabs button[aria-selected=true],.tabs button[aria-checked=true]{background:var(--ink);color:var(--bg);border-color:var(--ink)}.bubble{max-width:82%;padding:10px 14px;border-radius:18px;background:var(--surface);border:1px solid var(--line)}.bubble.me{margin-left:auto;background:var(--brand);color:var(--brand-ink);border-color:transparent}.bubble .who{font-size:.75rem;font-weight:700;opacity:.8}.chat{display:grid;gap:8px;padding:8px 0 72px}.composer{position:fixed;left:0;right:0;bottom:calc(66px + env(safe-area-inset-bottom));padding:8px 16px;background:var(--bg);z-index:15}.composer form{max-width:688px;margin:0 auto;display:flex;gap:8px}.skeleton{background:linear-gradient(90deg,var(--surface-2),var(--line),var(--surface-2));background-size:200% 100%;animation:shimmer 1.2s infinite;border-radius:var(--radius-s);min-height:18px}@keyframes shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}.empty{text-align:center;padding:28px 12px;color:var(--ink-3)}.empty .art{font-size:40px;margin-bottom:6px}.toast-region{position:fixed;left:0;right:0;bottom:calc(80px + env(safe-area-inset-bottom));display:grid;place-items:center;z-index:50;pointer-events:none}.toast{background:var(--ink);color:var(--bg);padding:12px 18px;border-radius:999px;box-shadow:var(--shadow);font-weight:600;max-width:92vw;animation:pop .25s var(--ease)}@keyframes pop{0%{transform:translateY(8px);opacity:0}to{transform:none;opacity:1}}.banner{display:flex;gap:10px;align-items:flex-start;padding:12px 14px;border-radius:var(--radius);margin-bottom:12px;background:var(--info-soft);color:var(--ink)}.banner.warn{background:var(--warn-soft)}.banner.offline{background:var(--surface-2)}.sheet-backdrop{position:fixed;inset:0;background:#0006;z-index:60;display:flex;align-items:flex-end;justify-content:center}.sheet{background:var(--surface);width:100%;max-width:720px;max-height:92dvh;overflow:auto;border-radius:var(--radius-l) var(--radius-l) 0 0;padding:20px 16px calc(20px + env(safe-area-inset-bottom));animation:rise .25s var(--ease)}@keyframes rise{0%{transform:translateY(24px);opacity:.6}to{transform:none;opacity:1}}.story-fact{display:flex;gap:10px;padding:8px 0;border-bottom:1px dashed var(--line)}.story-fact:last-child{border-bottom:0}.cite{font-size:.72rem;font-weight:700;color:var(--brand);white-space:nowrap}.cite a{display:inline-block;min-width:24px;min-height:24px;line-height:24px;text-align:center}.label-ai{font-size:.72rem;font-weight:700;color:var(--info);text-transform:uppercase;letter-spacing:.04em}.list-plain{list-style:none;padding:0;margin:0}.list-plain li{padding:10px 0;border-bottom:1px solid var(--line)}.list-plain li:last-child{border-bottom:0}.auth-wrap{min-height:100dvh;display:grid;place-items:center;padding:24px 16px;background:linear-gradient(160deg,var(--sky-a),var(--bg) 55%)}.auth-card{width:100%;max-width:420px}.brand-mark{display:flex;align-items:center;gap:10px;margin-bottom:16px}.brand-mark img{width:44px;height:44px;border-radius:12px}.toggle{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:var(--tap)}.toggle input{width:22px;height:22px;accent-color:var(--brand)}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}[data-motion=reduced] *,[data-motion=reduced] *:before,[data-motion=reduced] *:after{animation:none!important;transition:none!important}[data-bandwidth=low] .sky-deco{display:none}@media(min-width:720px){.main{padding-top:8px}.sky{margin:0 0 16px;border-radius:var(--radius-l)}}:root{--grape: #7c3aed;--grape-soft: #ede9fe;--sun: #b45309;--sun-soft: #fef3c7;--mint: #0f766e;--mint-soft: #ccfbf1;--sky: #1d4ed8;--sky-soft: #dbeafe;--coral: #be123c;--coral-soft: #ffe4e6;--leaf: #15803d;--leaf-soft: #dcfce7}@media(prefers-color-scheme:dark){:root:not([data-scheme=light]){--grape-soft: #2e1f52;--sun-soft: #3a2a0c;--mint-soft: #0f302c;--sky-soft: #172554;--coral-soft: #3b0d19;--leaf-soft: #10301d;--grape: #c4b5fd;--sun: #fcd34d;--mint: #5eead4;--sky: #93c5fd;--coral: #fda4af;--leaf: #86efac}}.hero-row{align-items:center;gap:14px}.level-chip{display:inline-flex;align-items:center;gap:6px;margin-top:6px;padding:4px 12px 4px 4px;border-radius:999px;background:#ffffff40;color:inherit;text-decoration:none;font-weight:800;font-size:.85rem;min-height:40px}.ring{position:relative;width:84px;height:84px;flex:none}.ring svg{width:100%;height:100%;transform:rotate(-90deg)}.ring circle{fill:none;stroke-width:9}.ring-track{stroke:#ffffff4d}.ring-fill{stroke:#fff;stroke-linecap:round;transition:stroke-dashoffset .8s var(--ease)}.ring-label{position:absolute;inset:0;display:grid;place-content:center;text-align:center;line-height:1}.ring-label b{font-size:1.6rem;font-family:var(--font-display)}.ring-label span{font-size:.8rem;opacity:.85}.stars{display:block;font-size:1.35rem;letter-spacing:2px}.stars span{opacity:.35}.stars span.on{opacity:1;color:#fde047;text-shadow:0 1px 0 rgb(0 0 0 / 15%)}.buddy{display:flex;align-items:flex-end;gap:10px;margin:0 0 14px}.buddy-pip{position:relative;width:58px;height:58px;flex:none;border-radius:50%;background:radial-gradient(circle at 35% 30%,#bbf7d0,#4ade80);display:grid;place-items:center;box-shadow:0 6px 16px #16a34a4d;animation:bob 3s ease-in-out infinite}.buddy-leaf{position:absolute;top:-14px;font-size:22px;transform:rotate(-12deg)}.buddy-face{font-size:30px}.buddy-bubble{position:relative;margin:0;padding:12px 14px;border-radius:18px 18px 18px 4px;background:var(--surface);border:2px solid var(--brand-soft);font-weight:600;box-shadow:var(--shadow);flex:1}@keyframes bob{0%,to{transform:translateY(0)}50%{transform:translateY(-5px)}}.next-up{display:flex;align-items:center;gap:12px;padding:14px 16px;margin-bottom:14px;border-radius:var(--radius-l);background:var(--brand);color:var(--brand-ink);text-decoration:none;box-shadow:0 10px 24px color-mix(in srgb,var(--brand) 35%,transparent);transition:transform .15s var(--ease)}.next-up:active{transform:scale(.98)}.next-up b{display:block;font-size:1.15rem;font-family:var(--font-display)}.next-up .small{display:block}.next-up-emoji{font-size:30px}.next-up-go{font-weight:800;background:#00000047;color:#fff;padding:8px 12px;border-radius:999px;white-space:nowrap}.tiles-wrap{margin-bottom:8px}.tiles-title{font-size:1.1rem;margin:6px 2px 10px}.tiles{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.tile{position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:2px;min-height:104px;padding:12px;border-radius:var(--radius-l);text-decoration:none;color:var(--ink);border:2px solid transparent;transition:transform .15s var(--ease),box-shadow .2s}.tile:hover{box-shadow:var(--shadow)}.tile:active{transform:scale(.95) rotate(-1deg)}.tile-emoji{font-size:34px;line-height:1.1;margin-bottom:4px;transition:transform .2s var(--ease)}.tile:hover .tile-emoji,.tile:focus-visible .tile-emoji{transform:scale(1.15) rotate(-6deg)}.tile-label{font-weight:800;font-family:var(--font-display);line-height:1.15}.tile-hint{font-size:.75rem;color:var(--ink-2);line-height:1.2;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%}.tile-badge{position:absolute;top:8px;right:8px;min-width:22px;height:22px;padding:0 6px;border-radius:11px;background:var(--coral);color:#fff;font-size:.75rem;font-weight:800;display:grid;place-items:center}.tone-grape{background:var(--grape-soft);border-color:color-mix(in srgb,var(--grape) 25%,transparent)}.tone-sun{background:var(--sun-soft);border-color:color-mix(in srgb,var(--sun) 25%,transparent)}.tone-mint{background:var(--mint-soft);border-color:color-mix(in srgb,var(--mint) 25%,transparent)}.tone-sky{background:var(--sky-soft);border-color:color-mix(in srgb,var(--sky) 25%,transparent)}.tone-coral{background:var(--coral-soft);border-color:color-mix(in srgb,var(--coral) 25%,transparent)}.tone-leaf{background:var(--leaf-soft);border-color:color-mix(in srgb,var(--leaf) 25%,transparent)}@media(max-width:340px){.tiles{grid-template-columns:repeat(2,minmax(0,1fr))}}.nav-icon{display:grid;place-items:center;width:44px;height:30px;border-radius:999px;transition:background .2s,transform .25s var(--ease)}.nav a[aria-current=page]{background:transparent}.nav a[aria-current=page] .nav-icon{background:var(--brand-soft);transform:translateY(-2px) scale(1.08)}.nav-label{font-size:.74rem}.confetti{position:fixed;inset:0;pointer-events:none;z-index:70;overflow:hidden}.confetti span{position:absolute;top:-30px;font-size:22px;animation:confetti-fall 1.4s cubic-bezier(.2,.6,.4,1) forwards}@keyframes confetti-fall{0%{transform:translate(0) rotate(0);opacity:1}to{transform:translate(var(--drift),105vh) rotate(var(--spin));opacity:.2}}.badges{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.badge{display:flex;flex-direction:column;align-items:center;text-align:center;gap:4px;padding:14px 10px;border-radius:var(--radius-l);background:var(--surface);border:2px solid var(--line)}.badge-art{font-size:40px;width:64px;height:64px;border-radius:50%;display:grid;place-items:center;background:var(--surface-2)}.badge.earned{border-color:color-mix(in srgb,var(--accent) 50%,transparent);background:linear-gradient(180deg,var(--accent-soft),var(--surface))}.badge.earned .badge-art{background:radial-gradient(circle,#fde68a,#f59e0b);box-shadow:0 6px 16px #f59e0b59}.badge .small{color:var(--ink-2)}.rhythm{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(7,1fr);gap:6px}.rhythm li{display:grid;place-items:center;gap:2px;padding:6px 0;border-radius:12px;background:var(--surface-2);font-size:18px}.rhythm li.on{background:var(--accent-soft)}.rhythm small{font-size:.68rem;color:var(--ink-3)}.progress.xp>i{background:#fff}.powered{display:flex;align-items:center;justify-content:center;gap:8px;margin:28px 0 8px;color:#5b6168;font-size:.75rem;letter-spacing:.02em}.powered img{height:11px;width:auto}[data-mode=playful] .task{padding:14px 4px}[data-mode=playful] .check{width:44px;height:44px;border-width:3px;font-size:20px;transition:transform .15s var(--ease)}[data-mode=playful] .check:not([disabled]):hover{transform:scale(1.08)}[data-mode=playful] .check.done{animation:pop-check .4s var(--ease)}[data-mode=playful] .task-title{font-size:1.05rem}[data-mode=playful] .btn{font-weight:800}[data-mode=playful] .card{border-width:2px}@keyframes pop-check{0%{transform:scale(.6)}70%{transform:scale(1.15)}to{transform:scale(1)}}[data-mode=sophisticated] .tile-emoji,[data-mode=sophisticated] .buddy-pip{filter:saturate(.6)}.mood-row{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px}.mood-row .btn{padding:0;min-width:0;font-size:1.6rem}.mood-row .btn[aria-pressed=true]{background:var(--brand-soft);border-color:var(--brand)}.bars{display:flex;align-items:flex-end;justify-content:center;gap:28px;height:150px;padding-top:8px}.bar{display:grid;justify-items:center;align-content:end;gap:4px;height:100%;width:78px}.bar i{display:block;width:54px;min-height:6px;border-radius:12px 12px 4px 4px;background:linear-gradient(180deg,var(--accent),var(--brand))}.bar.usual i{background:var(--surface-2);border:2px dashed var(--line)}.bar b{font-size:1.2rem;font-family:var(--font-display)}.bar span{font-size:.75rem;color:var(--ink-2)}.stat{display:grid;padding:10px 12px;border-radius:14px;background:var(--surface-2)}.stat b{font-size:1.4rem;font-family:var(--font-display);line-height:1.1}.stat span{font-size:.78rem;color:var(--ink-2)}.chat-photo{display:block;width:220px;max-width:100%;min-height:120px;border-radius:14px;margin:4px 0;object-fit:cover}.photo-btn{padding:0 12px;min-width:var(--tap);cursor:pointer}.codes{font-size:1.05rem;letter-spacing:.08em;background:var(--surface-2);padding:12px;border-radius:12px;white-space:pre-wrap}html{-webkit-tap-highlight-color:transparent;text-size-adjust:100%}body{overscroll-behavior-y:contain}a,button,input,select,textarea,label{touch-action:manipulation}.input,.select,.textarea{font-size:16px}@media(max-width:380px){.main{padding-left:12px;padding-right:12px}.sky{margin-left:-12px;margin-right:-12px;padding-left:14px;padding-right:14px}h1{font-size:1.45rem}.tiles{gap:8px}.tile{min-height:96px;padding:10px}}.avatar{overflow:hidden;position:relative;flex:none}.avatar .chibi{position:relative;top:6%}.avatar.xl{width:120px;height:120px;font-size:56px}.avatar[class*=frame-]{overflow:visible}.avatar[class*=frame-]:after{content:"";position:absolute;inset:-5px;border-radius:50%;pointer-events:none}.frame-sparkle:after{border:3px dashed #fbbf24;animation:spin 12s linear infinite}.frame-sakura:after{border:4px solid #f9a8d4;box-shadow:0 0 0 3px #fff,0 0 14px #f472b6}.frame-rainbow:after{padding:4px;background:conic-gradient(#f43f5e,#f59e0b,#84cc16,#06b6d4,#8b5cf6,#f43f5e);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;animation:spin 6s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.studio-stage{display:flex;align-items:center;gap:16px;margin-bottom:12px}.studio-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(64px,1fr));gap:8px}.studio-choice{position:relative;display:grid;place-items:center;min-height:64px;border-radius:16px;border:2px solid var(--line);background:var(--surface);cursor:pointer;padding:6px}.studio-choice.on{border-color:var(--brand);background:var(--brand-soft);box-shadow:0 0 0 2px var(--brand-soft)}.studio-choice.locked{cursor:not-allowed}.studio-choice.locked>:first-child{filter:grayscale(1) opacity(.45)}.studio-lock{position:absolute;bottom:2px;font-size:.66rem;font-weight:800;color:var(--ink-2)}.swatch{width:34px;height:34px;border-radius:50%;border:2px solid rgb(0 0 0 / 25%)}.levelup{position:fixed;inset:0;z-index:80;display:grid;place-items:center;background:#0f0a288c;cursor:pointer}.levelup-burst{position:absolute;width:140vmax;height:140vmax;background:repeating-conic-gradient(from 0deg,rgb(255 236 153 / 55%) 0 8deg,transparent 8deg 20deg);animation:spin 14s linear infinite}.levelup-card{position:relative;display:grid;justify-items:center;gap:6px;padding:18px 26px 22px;text-align:center;background:#fff;color:#1f1b2e;border:4px solid #1f1b2e;border-radius:24px;box-shadow:8px 8px #1f1b2e;animation:pop-in .5s cubic-bezier(.2,1.4,.4,1)}.levelup-title{font-family:var(--font-rounded);font-size:2.4rem;font-weight:900;letter-spacing:.02em;line-height:1;color:#fde047;-webkit-text-stroke:2px #1f1b2e;paint-order:stroke fill;text-shadow:3px 3px 0 #ef4444;transform:rotate(-4deg)}@keyframes pop-in{0%{transform:scale(.3) rotate(-10deg);opacity:0}to{transform:none;opacity:1}}.sky-petals{display:none;position:absolute;inset:0;pointer-events:none;overflow:hidden}.sky-petals i{position:absolute;top:-12px;width:10px;height:8px;background:#fbcfe8;border-radius:10px 1px;opacity:.85;animation:petal 7s linear infinite}@keyframes petal{0%{transform:translate(0) rotate(0)}to{transform:translate(-60px,260px) rotate(320deg)}}[data-mode=playful]{--ink-line: #1f1b2e;--radius: 18px;--radius-l: 24px;--brand: #6d28d9;--brand-soft: #ede9fe;--accent: #f43f5e;--bg: #fdf7ff}[data-mode=playful]:not([data-theme]),[data-mode=playful][data-theme=everyday]{--sky-a: #818cf8;--sky-b: #f472b6}[data-mode=playful][data-theme=everyday][data-period=night]{--sky-a: #312e81;--sky-b: #9d174d}@media(prefers-color-scheme:dark){:root:not([data-scheme=light])[data-mode=playful]{--ink-line: #0b0816;--bg: #120d1f;--brand: #c4b5fd;--brand-ink: #1e1236}}[data-mode=playful] body{background-color:var(--bg);background-image:radial-gradient(color-mix(in srgb,var(--brand) 9%,transparent) 1.2px,transparent 1.4px);background-size:18px 18px}[data-mode=playful] .sky{background:repeating-conic-gradient(from 0deg at 85% 0%,rgb(255 255 255 / 10%) 0 6deg,transparent 6deg 14deg),linear-gradient(140deg,var(--sky-a),var(--sky-b));border-bottom:3px solid var(--ink-line)}[data-mode=playful] .sky-petals{display:block}[data-mode=playful] .sky h1{font-weight:900;text-shadow:2px 2px 0 rgb(0 0 0 / 22%)}[data-mode=playful] .card,[data-mode=playful] .tile,[data-mode=playful] .badge,[data-mode=playful] .studio-choice{border:2.5px solid var(--ink-line);box-shadow:4px 4px 0 var(--ink-line)}[data-mode=playful] .card.soft{background:var(--surface)}[data-mode=playful] .tile{background-image:radial-gradient(rgb(255 255 255 / 55%) 1.5px,transparent 1.7px);background-size:10px 10px}[data-mode=playful] .tile:active,[data-mode=playful] .btn:active{transform:translate(3px,3px);box-shadow:1px 1px 0 var(--ink-line)}[data-mode=playful] .tile-emoji{filter:drop-shadow(2px 2px 0 rgb(31 27 46 / 35%))}[data-mode=playful] .tile-label{font-weight:900}[data-mode=playful] .btn-primary,[data-mode=playful] .btn-secondary{border:2.5px solid var(--ink-line);box-shadow:3px 3px 0 var(--ink-line)}[data-mode=playful] .next-up{border:3px solid var(--ink-line);box-shadow:5px 5px 0 var(--ink-line);background:repeating-linear-gradient(115deg,#fff0 0 18px,#ffffff24 18px 22px),linear-gradient(120deg,#6d28d9,#db2777);color:#fff}[data-mode=playful] .next-up-go{background:#fde047;color:#1f1b2e;border:2px solid var(--ink-line)}[data-mode=playful] .buddy-bubble{border:2.5px solid var(--ink-line);box-shadow:3px 3px 0 var(--ink-line);border-radius:20px 20px 20px 6px}.buddy-pip{width:auto;height:auto;background:none;box-shadow:none;border-radius:0}.buddy-pip .chibi{display:block;animation:bob 3s ease-in-out infinite;filter:drop-shadow(0 4px 6px rgb(22 101 52 / 30%))}[data-mode=playful] .section-title h2,[data-mode=playful] .tiles-title{display:inline;font-weight:900;background:linear-gradient(transparent 60%,color-mix(in srgb,#fde047 80%,transparent) 60%)}[data-mode=playful] .check{border-color:var(--ink-line);box-shadow:2px 2px 0 var(--ink-line)}[data-mode=playful] .check.done{background:#22c55e}[data-mode=playful] .chip{border:1.5px solid var(--ink-line)}[data-mode=playful] .nav{border-top:3px solid var(--ink-line)}[data-mode=playful] .nav a[aria-current=page] .nav-icon{background:#fde047;color:#1f1b2e;border:2px solid var(--ink-line)}[data-mode=playful] .nav a[aria-current=page]{color:var(--ink)}[data-mode=playful] .nav a[aria-current=page]:after{content:"✦";position:absolute;transform:translate(18px,-16px);color:#f43f5e;font-size:12px}[data-mode=playful] .nav a{position:relative}[data-mode=playful] .progress{border:2px solid var(--ink-line);height:14px}[data-mode=playful] .progress>i{background:repeating-linear-gradient(45deg,#f43f5e 0 8px,#fb7185 8px 16px)}[data-mode=playful] .progress.xp>i{background:repeating-linear-gradient(45deg,#fde047 0 8px,#facc15 8px 16px)}