:root,[data-theme=ink]{--bg: #0b1020;--bg-radial-1: rgba(93, 78, 201, .11);--bg-radial-2: rgba(45, 140, 140, .06);--surface-1: #10162a;--surface-2: #161d35;--surface-3: #1d2542;--border: #262e4e;--border-strong: #333c60;--text: #edeff6;--text-dim: #a6abc7;--text-faint: #6c7192;--glass-bg: rgba(11, 16, 32, .7);--shadow-sm: 0 2px 10px rgba(0, 0, 0, .35);--shadow-md: 0 12px 34px rgba(0, 0, 0, .5);--shadow-lg: 0 28px 70px rgba(0, 0, 0, .6)}[data-theme=paper]{--bg: #f2ead4;--bg-radial-1: rgba(201, 151, 74, .12);--bg-radial-2: rgba(40, 28, 8, .035);--surface-1: #faf5e7;--surface-2: #efe5cb;--surface-3: #e3d5ae;--border: #dccca0;--border-strong: #c7b381;--text: #251d10;--text-dim: #6b5f42;--text-faint: #94875f;--glass-bg: rgba(250, 245, 231, .72);--shadow-sm: 0 2px 8px rgba(90, 66, 20, .1);--shadow-md: 0 14px 30px rgba(90, 66, 20, .16);--shadow-lg: 0 26px 60px rgba(90, 66, 20, .22)}:root{--accent: #c9974a;--accent-strong: #e8c373;--accent-soft: #a97c3a;--accent-gradient: linear-gradient(135deg, var(--accent-soft) 0%, var(--accent-strong) 55%, var(--accent) 100%);--accent-dim: rgba(201, 151, 74, .15);--accent-border: rgba(201, 151, 74, .45);--on-accent: #1c1409;--accent-glow: 0 0 2px rgba(232, 195, 115, .8), 0 0 36px -4px rgba(201, 151, 74, .6);--good: #4f9d75;--good-dim: rgba(79, 157, 117, .15);--bad: #c1443a;--bad-dim: rgba(193, 68, 58, .15);--seal: #b83227;--accent2: var(--text-dim);--indigo: var(--surface-3);--warn: var(--accent);--font-ui: "Manrope", "Noto Sans SC", sans-serif;--font-display: "Manrope", "Noto Sans SC", sans-serif;--text-2xs: 11.5px;--text-xs: 13px;--text-sm: 14.5px;--text-base: 16px;--text-md: 18.5px;--text-lg: 22px;--text-xl: 29px;--text-2xl: 38px;--text-3xl: clamp(42px, 6.5vw, 66px);--text-hero: clamp(48px, 8.5vw, 92px);--space-1: 4px;--space-2: 8px;--space-3: 12px;--space-4: 16px;--space-5: 24px;--space-6: 32px;--space-7: 48px;--space-8: 64px;--radius-sm: 8px;--radius-md: 12px;--radius-lg: 18px;--radius-full: 999px;--radius: var(--radius-md);--shadow: var(--shadow-md);--ring-accent: 0 0 0 1px var(--accent-border), 0 8px 28px -8px rgba(201, 151, 74, .4);--ease-out: cubic-bezier(.16, 1, .3, 1);--ease-spring: cubic-bezier(.22, 1.4, .36, 1);--dur-fast: .12s;--dur-base: .22s;--dur-slow: .42s}body,.card,.appbar,.btn,.input,.chip,.badge{transition:background-color var(--dur-slow) ease,border-color var(--dur-slow) ease,color var(--dur-slow) ease}*{box-sizing:border-box}@keyframes fadeInUp{0%{opacity:0;transform:translateY(14px)}}@keyframes fadeIn{0%{opacity:0}}@keyframes scaleIn{0%{opacity:0;transform:scale(.94)}}@keyframes shimmer{0%{background-position:-200% 0}to{background-position:200% 0}}@keyframes floatGlow{0%,to{transform:translate(0) scale(1)}50%{transform:translate(-2%,3%) scale(1.08)}}@keyframes spin{to{transform:rotate(360deg)}}@keyframes shake{10%,90%{transform:translate(-1px)}20%,80%{transform:translate(2px)}30%,50%,70%{transform:translate(-4px)}40%,60%{transform:translate(4px)}}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}}html,body,#root{margin:0;min-height:100%}body{background:radial-gradient(900px 560px at 15% -8%,var(--bg-radial-1) 0%,transparent 60%),radial-gradient(700px 500px at 100% 0%,var(--bg-radial-2) 0%,transparent 55%),var(--bg);color:var(--text);font-family:var(--font-ui);font-size:var(--text-base);line-height:1.55;-webkit-font-smoothing:antialiased}html{scrollbar-width:thin;scrollbar-color:var(--accent-soft) transparent}*::-webkit-scrollbar{width:10px;height:10px}*::-webkit-scrollbar-track{background:transparent}*::-webkit-scrollbar-thumb{background-color:var(--accent-soft);border-radius:var(--radius-full);border:2px solid transparent;background-clip:padding-box}*::-webkit-scrollbar-thumb:hover{background-color:var(--accent-strong)}*::-webkit-scrollbar-corner{background:transparent}a{color:inherit;text-decoration:none}::selection{background:var(--accent-dim);color:var(--accent-strong)}.boot{display:grid;place-items:center;min-height:100vh;font-size:15px;font-weight:700;letter-spacing:.24em;text-transform:uppercase;color:var(--text-faint)}.appbar-wrap{position:sticky;top:0;z-index:50;background:var(--glass-bg);backdrop-filter:blur(18px) saturate(1.5);-webkit-backdrop-filter:blur(18px) saturate(1.5);border-bottom:1px solid var(--border);box-shadow:var(--shadow-sm)}.appbar{position:relative;display:flex;align-items:center;gap:var(--space-5);padding:14px 28px;max-width:1500px;margin:0 auto}.appbar-wrap:after{content:"";position:absolute;left:8%;right:8%;bottom:-14px;height:20px;background:radial-gradient(50% 100% at 50% 0%,var(--accent-dim) 0%,transparent 75%);pointer-events:none;z-index:-1}.appbar-group{display:flex;align-items:center;gap:10px}.appbar-divider{width:1px;height:22px;background:var(--border);flex-shrink:0}.brand{font-weight:700;font-size:16.5px;letter-spacing:-.01em;display:flex;align-items:center;gap:11px;white-space:nowrap;color:var(--text);font-family:var(--font-display)}.brand .logomark{display:inline-flex;width:32px;height:32px;border-radius:7px;background:var(--accent-gradient);align-items:center;justify-content:center;color:var(--on-accent);font-family:var(--font-display);font-size:19px;font-weight:700;box-shadow:var(--accent-glow),inset 0 1px 1px #ffffff59,inset 0 -2px 3px #00000040}.appbar .nav{display:flex;gap:2px;margin-left:10px;overflow-x:auto;white-space:nowrap;scrollbar-width:none}.appbar .nav::-webkit-scrollbar{display:none}.navlink{position:relative;display:inline-flex;align-items:center;gap:6px;padding:8px 11px;border-radius:var(--radius-sm);color:var(--text-dim);font-size:var(--text-xs);font-weight:600;transition:color var(--dur-fast) ease}.navlink svg{opacity:.75;transition:opacity var(--dur-fast) ease,transform var(--dur-base) var(--ease-spring)}.navlink:after{content:"";position:absolute;left:11px;right:11px;bottom:2px;height:2px;border-radius:var(--radius-full);background:var(--accent-gradient);transform:scaleX(0);transform-origin:center;opacity:0;transition:transform var(--dur-base) var(--ease-spring),opacity var(--dur-fast) ease}.navlink:hover{color:var(--text)}.navlink:hover svg{opacity:1;transform:translateY(-1px)}.navlink:hover:after{opacity:.5;transform:scaleX(.6)}a.navlink.active{color:var(--text)}a.navlink.active svg{opacity:1;color:var(--accent)}a.navlink.active:after{opacity:1;transform:scaleX(1);box-shadow:0 0 8px -1px #c9974ab3}.spacer{flex:1}.theme-toggle{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;border-radius:var(--radius-full);border:1px solid var(--border);background:var(--surface-2);color:var(--text-dim);cursor:pointer;transition:color var(--dur-fast) ease,border-color var(--dur-fast) ease,transform var(--dur-fast) var(--ease-spring)}.theme-toggle:hover{color:var(--accent);border-color:var(--accent-border);transform:rotate(-8deg) scale(1.06)}.theme-toggle svg{transition:transform var(--dur-slow) var(--ease-spring)}[data-theme=paper] .theme-toggle svg{transform:rotate(180deg)}.chip{padding:6px 12px;border-radius:var(--radius-full);background:var(--surface-2);border:1px solid var(--border);font-size:var(--text-2xs);color:var(--text-dim);display:inline-flex;align-items:center;gap:6px;font-weight:600;white-space:nowrap;transition:border-color var(--dur-fast) ease,transform var(--dur-fast) ease}.chip svg{width:13px;height:13px}.chip b{color:var(--text);font-weight:800}.btn{display:inline-flex;align-items:center;justify-content:center;gap:7px;cursor:pointer;border:1px solid var(--border-strong);background:var(--surface-2);color:var(--text);padding:11px 19px;border-radius:var(--radius-md);font-size:var(--text-sm);font-weight:700;font-family:inherit;letter-spacing:-.005em;transition:transform var(--dur-fast) var(--ease-out),background var(--dur-base) ease,border-color var(--dur-base) ease,box-shadow var(--dur-base) ease,filter var(--dur-base) ease}.btn:hover{background:var(--surface-3);border-color:var(--text-faint);transform:translateY(-1px)}.btn:active{transform:translateY(0) scale(.98);transition-duration:.05s}.btn.primary{background:var(--accent);border-color:var(--accent);color:var(--on-accent)}.btn.primary:hover{background:var(--accent-strong);border-color:var(--accent-strong);box-shadow:0 8px 24px -6px #eab24473}.btn:disabled:hover{transform:none;box-shadow:none}.btn.ghost{background:transparent;border-color:var(--border)}.btn.ghost:hover{background:var(--surface-1)}.btn.small{padding:6.5px 12px;font-size:var(--text-xs);border-radius:var(--radius-sm)}.btn:disabled{opacity:.45;cursor:not-allowed}.btn.danger{background:var(--bad-dim);border-color:#ee6a6759;color:var(--bad)}.btn.danger:hover{background:#ee6a6733;border-color:var(--bad)}.page{max-width:min(1360px,94vw);margin:0 auto;padding:36px 24px 90px}.page.wide{max-width:min(1600px,96vw)}.grid{display:grid;gap:var(--space-4)}.grid.grid-2{grid-template-columns:1fr 1fr}@media (max-width: 640px){.grid.grid-2{grid-template-columns:1fr}}.grid.cards{grid-template-columns:repeat(auto-fill,minmax(268px,1fr))}.grid>.card,.mapgrid>.spot,.col>.card{animation:fadeInUp var(--dur-base) var(--ease-out) both}.grid>.card:nth-child(2),.mapgrid>.spot:nth-child(2),.col>.card:nth-child(2){animation-delay:.03s}.grid>.card:nth-child(3),.mapgrid>.spot:nth-child(3),.col>.card:nth-child(3){animation-delay:.06s}.grid>.card:nth-child(4),.mapgrid>.spot:nth-child(4),.col>.card:nth-child(4){animation-delay:.09s}.grid>.card:nth-child(5),.mapgrid>.spot:nth-child(5),.col>.card:nth-child(5){animation-delay:.12s}.grid>.card:nth-child(n+6),.mapgrid>.spot:nth-child(n+6),.col>.card:nth-child(n+6){animation-delay:.15s}.row{display:flex;align-items:center;gap:var(--space-3);flex-wrap:wrap}.spread{justify-content:space-between}.col{display:flex;flex-direction:column;gap:var(--space-3)}.center{text-align:center}.muted{color:var(--text-dim)}.h1{font-size:var(--text-xl);font-weight:800;letter-spacing:-.015em;margin:0}.hero-greeting{font-family:var(--font-display);font-size:var(--text-hero);font-weight:600;letter-spacing:-.02em;line-height:1.05;margin:0 0 6px;color:var(--text)}.dna-hero-card{background:radial-gradient(120% 100% at 50% 0%,var(--accent-dim) 0%,transparent 60%),var(--surface-1);padding:28px 20px}.h2{font-size:var(--text-md);font-weight:800;letter-spacing:-.01em;margin:0 0 4px}.sub{color:var(--text-dim);font-size:var(--text-sm)}.card{background:var(--surface-1);border:1px solid var(--border);border-radius:var(--radius-lg);padding:26px;box-shadow:var(--shadow-sm);transition:border-color var(--dur-base) ease,box-shadow var(--dur-base) ease}.card.hover{cursor:pointer;transition:border-color var(--dur-base) var(--ease-out),transform var(--dur-base) var(--ease-out),box-shadow var(--dur-base) var(--ease-out)}.card.hover:hover{border-color:var(--border-strong);transform:translateY(-3px);box-shadow:var(--shadow-md)}.card.flat{box-shadow:none}.badge{display:inline-flex;align-items:center;gap:5px;padding:4px 10px;border-radius:var(--radius-full);font-size:var(--text-2xs);font-weight:700;letter-spacing:.01em;background:var(--surface-2);border:1px solid var(--border);color:var(--text-dim)}.badge.good{background:var(--good-dim);color:var(--good);border-color:#6bcf8f59}.badge.bad{background:var(--bad-dim);color:var(--bad);border-color:#ee6a6759}.badge.warn,.badge.accent{background:var(--accent-dim);color:var(--accent-strong);border-color:var(--accent-border)}.bar{height:8px;border-radius:var(--radius-full);background:var(--surface-2);overflow:hidden;margin-top:8px}.bar>div{height:100%;border-radius:var(--radius-full);background:var(--accent);transition:width var(--dur-slow) var(--ease-out)}.bar.alt>div{background:var(--text-dim)}.hbar{display:flex;align-items:center;gap:10px}.hbar .bar{flex:1;margin-top:0}.field{display:flex;flex-direction:column;gap:6px;margin-bottom:15px}.field label{font-size:var(--text-2xs);font-weight:700;color:var(--text-faint);text-transform:uppercase;letter-spacing:.07em}.input,textarea.input,select.input{background:var(--surface-2);border:1px solid var(--border);border-radius:var(--radius-sm);color:var(--text);padding:11px 13px;font-size:var(--text-base);font-family:inherit;outline:none;width:100%;transition:border-color var(--dur-fast) ease,box-shadow var(--dur-fast) ease,background var(--dur-fast) ease}.input::placeholder{color:var(--text-faint)}.input:hover{border-color:var(--border-strong)}.input:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-dim);background:var(--surface-1)}.formcard{max-width:420px!important;margin:48px auto}.formerr{color:var(--bad);font-size:var(--text-sm);margin:4px 0 10px;animation:shake .4s var(--ease-out)}.divider{display:flex;align-items:center;gap:12px;color:var(--text-faint);font-size:var(--text-2xs);text-transform:uppercase;letter-spacing:.1em}.divider:before,.divider:after{content:"";flex:1;height:1px;background:var(--border)}.animal{position:relative;display:flex;flex-direction:column;align-items:center;gap:4px;text-align:center;min-height:240px;justify-content:flex-start;overflow:hidden}.animal .face{line-height:1}.animal .name{font-weight:800;font-size:var(--text-base);margin-top:8px}.animal .species{color:var(--text-faint);font-size:var(--text-2xs);font-style:italic;font-family:var(--font-display)}.animal .desc{color:var(--text-dim);font-size:var(--text-xs);margin-top:6px}.animal .ability{margin-top:8px;font-size:var(--text-xs);color:var(--accent);font-weight:600}.animal .statsrow{display:flex;gap:8px;margin-top:10px;flex-wrap:wrap;justify-content:center}.animal .statpill{font-size:var(--text-2xs);padding:3px 8px;border-radius:var(--radius-full);background:var(--surface-2);color:var(--text-dim);border:1px solid var(--border)}.animal.picked{border-color:var(--accent-border);box-shadow:var(--ring-accent)}.animal.picked:after{content:"COMPANION";position:absolute;top:10px;right:10px;font-size:9.5px;letter-spacing:.12em;background:var(--accent);color:var(--on-accent);border-radius:var(--radius-full);padding:3px 8px;font-weight:800;animation:scaleIn var(--dur-base) var(--ease-spring) both}.animal.hover:hover .face{transform:scale(1.08) translateY(-2px)}.animal .face{transition:transform var(--dur-base) var(--ease-out)}.worldmap-wrap{position:relative;width:min(880px,100%);aspect-ratio:1 / 1;margin:0 auto;border-radius:var(--radius-lg);overflow:hidden;border:1px solid var(--border);box-shadow:var(--shadow-md);animation:fadeInUp var(--dur-base) var(--ease-out) both}.worldmap-svg{width:100%;height:100%;display:block}.wm-node{cursor:pointer}.wm-node .wm-dot,.wm-node .wm-icon{transition:transform var(--dur-fast) ease,filter var(--dur-fast) ease;transform-origin:center}.wm-node:hover .wm-dot,.wm-node:hover .wm-icon{transform:scale(1.15);filter:brightness(1.2)}.wm-node.locked .wm-icon{opacity:.55}.wm-node .wm-label{fill:var(--text-dim);font-weight:700;paint-order:stroke;stroke:var(--bg);stroke-width:.6px}.wm-pulse{animation:wmPulse 2.4s ease-in-out infinite;transform-origin:center}@keyframes wmPulse{0%,to{opacity:.3;transform:scale(.9)}50%{opacity:.85;transform:scale(1.15)}}.wm-tooltip{position:absolute;transform:translate(-50%,calc(-100% - 14px));background:var(--surface-1);border:1px solid var(--border-strong);border-radius:var(--radius-md);padding:10px 12px;width:200px;box-shadow:var(--shadow-md);pointer-events:none;z-index:5;animation:fadeInUp .15s var(--ease-out) both}.chat{display:flex;flex-direction:column;gap:14px;max-width:720px;margin:0 auto}.bubble{max-width:78%;padding:12px 15px;border-radius:var(--radius-lg);font-size:var(--text-base);animation:pop var(--dur-base) var(--ease-out)}@keyframes pop{0%{transform:translateY(6px);opacity:0}}.bubble.npc{align-self:flex-start;background:var(--surface-2);border:1px solid var(--border);border-bottom-left-radius:4px}.bubble.me{align-self:flex-end;background:var(--surface-3);border:1px solid var(--border-strong);border-bottom-right-radius:4px}.bubble .pinyin{display:block;color:var(--text-dim);font-family:var(--font-display);font-style:italic;font-size:var(--text-xs);margin-top:4px}.bubble .english{display:block;color:var(--text-faint);font-size:var(--text-xs);margin-top:2px}.bubble .speaker{display:block;font-size:var(--text-2xs);font-weight:800;text-transform:uppercase;letter-spacing:.06em;color:var(--accent);margin-bottom:3px}.bubble.reaction{align-self:center;background:var(--good-dim);border:1px dashed rgba(107,207,143,.4);color:var(--good);font-size:var(--text-sm);animation:pop var(--dur-slow) var(--ease-spring)}.microw{display:flex;align-items:center;gap:12px;justify-content:center;margin-top:8px}.micbtn{display:inline-flex;align-items:center;justify-content:center;width:58px;height:58px;border-radius:50%;border:2px solid var(--border-strong);background:var(--surface-2);color:var(--text);cursor:pointer;transition:all var(--dur-fast) ease}.micbtn.listening{background:var(--bad);border-color:var(--bad);color:var(--on-accent);animation:pulse 1s infinite}.micbtn:hover:not(:disabled){transform:scale(1.06);border-color:var(--accent);color:var(--accent)}.micbtn:disabled{opacity:.5;cursor:not-allowed}@keyframes pulse{0%,to{box-shadow:0 0 #ee6a6780}50%{box-shadow:0 0 0 12px #ee6a6700}}.modal{position:fixed;top:0;right:0;bottom:0;left:0;z-index:100;display:grid;place-items:center;background:#040405bf;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);animation:fadeIn .15s ease}.modal .card{width:min(480px,92vw);animation:scaleIn var(--dur-base) var(--ease-spring) both}.scores{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:10px}.scorecard{text-align:center;background:var(--surface-2);border:1px solid var(--border);border-radius:var(--radius-md);padding:14px 8px;transition:border-color var(--dur-fast) ease}.scorecard .num{font-size:var(--text-lg);font-weight:800;letter-spacing:-.01em;font-variant-numeric:tabular-nums}.scorecard .lbl{font-size:10px;color:var(--text-faint);text-transform:uppercase;letter-spacing:.09em;margin-top:2px}.ring{position:relative;width:132px;height:132px;display:grid;place-items:center}.ring-svg{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%}.ring-track-bg{fill:none;stroke:var(--surface-2);stroke-width:14}.ring-track-fg{fill:none;stroke:var(--accent);stroke-width:14;stroke-linecap:round}.ring-center{position:relative;z-index:1;font-size:var(--text-xl);font-weight:800;font-variant-numeric:tabular-nums}table.data{width:100%;border-collapse:collapse;font-size:var(--text-base)}table.data th{text-align:left;color:var(--text-faint);font-size:var(--text-2xs);text-transform:uppercase;letter-spacing:.07em;padding:8px 10px;border-bottom:1px solid var(--border)}table.data td{padding:10px;border-bottom:1px solid var(--border)}.duelbanner{display:flex;align-items:center;justify-content:space-around;padding:22px}.duelbanner .vs{font-size:var(--text-lg);font-weight:900;color:var(--text-faint);font-family:var(--font-display);font-style:italic}.timerbar{height:6px;background:var(--surface-2);border-radius:var(--radius-full);overflow:hidden}.timerbar>div{height:100%;background:var(--accent);transition:width .1s linear,background var(--dur-base) ease}.timerbar.low>div{background:var(--bad);animation:pulse .6s infinite}.reveal{animation:scaleIn var(--dur-slow) var(--ease-spring) both}.reveal-icon{animation:scaleIn .5s var(--ease-spring) .1s both}.option{display:block;width:100%;text-align:left;padding:13px 15px;border-radius:var(--radius-md);border:1px solid var(--border);background:var(--surface-2);color:var(--text);font-size:var(--text-base);font-family:inherit;cursor:pointer;transition:border-color var(--dur-fast) ease,background var(--dur-fast) ease,transform var(--dur-fast) ease}.option:hover{border-color:var(--border-strong);transform:translate(2px)}.option.correct{border-color:var(--good);background:var(--good-dim);animation:pop var(--dur-base) var(--ease-spring)}.option.wrong{border-color:var(--bad);background:var(--bad-dim);animation:shake .4s var(--ease-out)}.option.picked{border-color:var(--accent);background:var(--accent-dim)}.hero{position:relative;padding:96px 20px 72px;text-align:center;overflow:hidden}.hero:before,.hero:after{content:"";position:absolute;width:380px;height:380px;border-radius:50%;filter:blur(100px);opacity:.22;z-index:-1;animation:floatGlow 12s ease-in-out infinite}.hero:before{top:-140px;left:6%;background:var(--accent)}.hero:after{top:-80px;right:6%;background:var(--text-faint);animation-delay:-6s}.hero>*{animation:fadeInUp var(--dur-slow) var(--ease-out) both}.hero-carousel{position:absolute;top:0;right:0;bottom:0;left:0;z-index:-1;overflow:hidden;border-radius:inherit}.hero-scene{position:absolute;top:0;right:0;bottom:0;left:0}.hero-scene-svg{width:100%;height:100%;display:block}.hero-carousel-veil{position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(180deg,var(--bg) 0%,transparent 16%,transparent 72%,var(--bg) 100%),radial-gradient(60% 55% at 50% 42%,transparent 0%,var(--bg) 92%);opacity:.94}[data-theme=paper] .hero-carousel{opacity:.5}.hero h1{font-family:var(--font-display);font-size:var(--text-3xl);font-weight:600;font-style:italic;letter-spacing:-.01em;margin:14px 0 10px;color:var(--text)}.hero .tagline{font-size:var(--text-md);color:var(--text-dim);max-width:620px;margin:0 auto 30px}.features{display:grid;grid-template-columns:repeat(6,1fr);gap:var(--space-4);margin-top:38px}.features>*{grid-column:span 6}@media (min-width: 760px){.features .feat-span-2{grid-column:span 2}.features .feat-span-4{grid-column:span 4}}.features>.card{animation:fadeInUp var(--dur-base) var(--ease-out) both;transition:transform var(--dur-base) var(--ease-out),border-color var(--dur-base) ease}.features>.card:hover{transform:translateY(-4px);border-color:var(--border-strong)}.features>.card:nth-child(2){animation-delay:.05s}.features>.card:nth-child(3){animation-delay:.1s}.features>.card:nth-child(4){animation-delay:.15s}.features>.card:nth-child(5){animation-delay:.2s}.features>.card:nth-child(6){animation-delay:.25s}.feat{--feat-color: var(--accent);position:relative;padding:26px 24px;overflow:hidden;min-height:168px;display:flex;flex-direction:column;justify-content:center}.feat:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:radial-gradient(220px 160px at 100% 0%,color-mix(in srgb,var(--feat-color) 20%,transparent) 0%,transparent 70%);pointer-events:none}.feat .ic{position:relative;display:inline-flex;align-items:center;justify-content:center;width:46px;height:46px;border-radius:var(--radius-md);background:color-mix(in srgb,var(--feat-color) 18%,var(--surface-2));color:var(--feat-color);transition:transform var(--dur-base) var(--ease-spring)}.features>.card:hover .ic{transform:scale(1.1) rotate(-4deg)}.feat h3,.feat p{position:relative}.ilb{display:inline-block;padding:4px 11px;border-radius:var(--radius-full);border:1px solid var(--border);background:var(--surface-2);font-size:var(--text-2xs);color:var(--text-dim);font-weight:700}@media (max-width: 720px){.page{padding:20px 14px 64px}.navlink{font-size:var(--text-2xs);padding:6px 8px}.appbar{flex-wrap:wrap}}.scrollhint{font-size:var(--text-2xs);color:var(--text-faint);text-transform:uppercase;letter-spacing:.1em}.empty{text-align:center;padding:48px 16px;color:var(--text-dim);animation:fadeInUp var(--dur-base) var(--ease-out) both}.loading{display:flex;flex-direction:column;align-items:center;gap:14px;padding:60px 16px;color:var(--text-dim);animation:fadeInUp var(--dur-base) var(--ease-out) both}.spinner{width:30px;height:30px;border-radius:50%;border:3px solid var(--border);border-top-color:var(--accent);animation:spin .8s linear infinite}.skeleton{border-radius:var(--radius-sm);background:linear-gradient(90deg,var(--surface-2) 25%,var(--surface-3) 50%,var(--surface-2) 75%);background-size:200% 100%;animation:shimmer 1.4s ease-in-out infinite}.icon{display:inline-flex;flex-shrink:0}.route-reveal{position:relative}.bento{display:grid;grid-template-columns:repeat(6,1fr);gap:var(--space-4)}.bento>*{grid-column:span 6}.bento-2,.bento-3,.bento-4{grid-column:span 6}@media (min-width: 860px){.bento-2{grid-column:span 3}.bento-3{grid-column:span 2}.bento-4{grid-column:span 4}}.ring-hero{--p: 0;position:relative;width:176px;height:176px;margin:0 auto;border-radius:50%;display:grid;place-items:center}.ring-hero:before{content:"";position:absolute;top:-18px;right:-18px;bottom:-18px;left:-18px;border-radius:50%;background:radial-gradient(closest-side,var(--accent-dim),transparent 72%);filter:blur(2px);animation:ringGlowPulse 3.4s ease-in-out infinite}.ring-hero-svg{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%}.ring-hero-track-bg{fill:none;stroke:var(--surface-3);stroke-width:12}.ring-hero-track-fg{fill:none;stroke-width:12;stroke-linecap:round;filter:drop-shadow(0 0 6px rgba(201,151,74,.45))}.ring-hero .ring-face{position:relative;width:138px;height:138px;border-radius:50%;background:var(--surface-1);border:1px solid var(--border);display:grid;place-items:center;box-shadow:inset 0 2px 10px #00000040}.ring-hero .ring-value{font-family:var(--font-display);font-size:44px;font-weight:700;font-variant-numeric:tabular-nums;background:var(--accent-gradient);-webkit-background-clip:text;background-clip:text;color:transparent}.ring-hero .ring-label{font-size:var(--text-2xs);text-transform:uppercase;letter-spacing:.12em;color:var(--text-faint);margin-top:2px}@keyframes ringGlowPulse{0%,to{opacity:.6;transform:scale(1)}50%{opacity:1;transform:scale(1.06)}}.seal-stamp{position:relative;display:inline-flex;align-items:center;justify-content:center;width:46px;height:46px;border-radius:9px;border:2px solid var(--seal);color:var(--seal);background:color-mix(in srgb,var(--seal) 10%,transparent);transform:rotate(-4deg);box-shadow:0 0 0 1px color-mix(in srgb,var(--seal) 25%,transparent)}.seal-stamp:before{content:"";position:absolute;top:3px;right:3px;bottom:3px;left:3px;border:1px solid color-mix(in srgb,var(--seal) 55%,transparent);border-radius:6px}.seal-stamp.locked{border-color:var(--border-strong);color:var(--text-faint);background:transparent;box-shadow:none;transform:none}.seal-stamp.locked:before{border-color:var(--border)}.burst{position:relative}.burst:before,.burst:after{content:"";position:absolute;top:-30%;right:-30%;bottom:-30%;left:-30%;border-radius:50%;background:radial-gradient(circle,var(--accent-dim) 0%,transparent 60%);animation:burstRing .9s var(--ease-out) both;pointer-events:none}.burst:after{animation-delay:.12s;top:-20%;right:-20%;bottom:-20%;left:-20%}@keyframes burstRing{0%{opacity:.9;transform:scale(.3)}to{opacity:0;transform:scale(1.6)}}.ink-brush{position:absolute;top:0;right:0;bottom:0;left:0;z-index:-1;overflow:hidden;pointer-events:none}.ink-brush svg{position:absolute;opacity:.5}[data-theme=paper] .ink-brush svg{opacity:.35}.shell{display:flex;min-height:100vh;align-items:stretch}.sidebar{width:252px;flex-shrink:0;position:sticky;top:0;height:100vh;background:var(--surface-1);border-right:1px solid var(--border);display:flex;flex-direction:column;z-index:45;transition:width var(--dur-base) var(--ease-out),transform var(--dur-slow) var(--ease-out)}.sidebar.collapsed{width:78px}.sidebar-backdrop{display:none}.sidebar-head{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:20px 16px 14px;border-bottom:1px solid var(--border)}.sidebar-brand{min-width:0;overflow:hidden}.sidebar-brand .label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.sidebar.collapsed .sidebar-brand .label{display:none}.sidebar-collapse-btn{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:26px;height:26px;border-radius:var(--radius-full);border:1px solid var(--border);background:var(--surface-2);color:var(--text-dim);cursor:pointer;transition:color var(--dur-fast) ease,border-color var(--dur-fast) ease}.sidebar-collapse-btn:hover{color:var(--accent);border-color:var(--accent-border)}.sidebar-nav{position:relative;flex:1;overflow-y:auto;padding:10px 12px 14px;scrollbar-width:thin}.sidebar-group{margin-top:16px}.sidebar-group:first-child{margin-top:8px}.sidebar-group-label{display:flex;align-items:center;gap:7px;font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.09em;color:var(--text-faint);padding:0 10px 6px}.sidebar-group-mark{width:12px;height:3px;flex-shrink:0;background:var(--accent-gradient);clip-path:polygon(0 20%,100% 0,100% 80%,0 100%)}.sidebar.collapsed .sidebar-group-label{opacity:0;height:0;padding:0;overflow:hidden}.sidebar-link{position:relative;display:flex;align-items:center;gap:12px;padding:10px 12px 10px 18px;margin-bottom:2px;border-radius:var(--radius-md);color:var(--text-dim);font-size:var(--text-sm);font-weight:600;font-family:var(--font-display);letter-spacing:.005em;transition:background var(--dur-fast) ease,color var(--dur-fast) ease}.sidebar-link svg{position:relative;z-index:1;flex-shrink:0;opacity:.8;transition:opacity var(--dur-fast) ease}.sidebar-link .label{position:relative;z-index:1}.sidebar-link:hover{background:var(--surface-2);color:var(--text)}.sidebar-link:hover svg{opacity:1}.sidebar-link.active{color:var(--accent-strong)}.sidebar-link.active svg{opacity:1;color:var(--accent)}.sidebar-link-brush{position:absolute;z-index:1;left:4px;top:8px;bottom:8px;width:3px;background:var(--accent-gradient);clip-path:polygon(0 0,100% 0,65% 100%,35% 100%);transform:scaleY(0);transform-origin:top;transition:transform var(--dur-base) var(--ease-spring)}.sidebar-link.active .sidebar-link-brush{transform:scaleY(1)}.sidebar-ink-blob{position:absolute;z-index:0;background:radial-gradient(ellipse at 35% 30%,var(--accent-dim) 0%,var(--accent-dim) 45%,transparent 88%);border-radius:61% 39% 52% 48%/44% 41% 59% 56%;pointer-events:none}.sidebar.collapsed .sidebar-ink-blob{border-radius:50%}.sidebar.collapsed .sidebar-link{justify-content:center;padding:10px}.sidebar.collapsed .sidebar-link .label{display:none}.sidebar.collapsed .sidebar-link:after{content:attr(data-label);position:absolute;left:calc(100% + 12px);top:50%;transform:translateY(-50%) scale(.95);background:var(--surface-3);border:1px solid var(--border-strong);padding:6px 10px;border-radius:var(--radius-sm);font-size:var(--text-xs);font-weight:700;white-space:nowrap;color:var(--text);opacity:0;pointer-events:none;box-shadow:var(--shadow-md);transition:opacity var(--dur-fast) ease,transform var(--dur-fast) ease;z-index:60}.sidebar.collapsed .sidebar-link:hover:after{opacity:1;transform:translateY(-50%) scale(1)}.sidebar-profile{display:flex;align-items:center;gap:10px;padding:14px;border-top:1px solid var(--border)}.sidebar-profile-fallback{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:50%;background:var(--surface-2);color:var(--text-dim);flex-shrink:0}.sidebar-profile .info{flex:1;min-width:0}.sidebar-profile .name{font-weight:800;font-size:var(--text-sm);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.sidebar-profile .role{font-size:var(--text-2xs);color:var(--text-faint)}.sidebar.collapsed .sidebar-profile{justify-content:center;padding:14px 8px}.sidebar.collapsed .sidebar-profile .info{display:none}.sidebar-logout-btn{display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;border-radius:var(--radius-sm);border:1px solid var(--border);background:transparent;color:var(--text-faint);cursor:pointer;flex-shrink:0;transition:color var(--dur-fast) ease,border-color var(--dur-fast) ease}.sidebar-logout-btn:hover{color:var(--bad);border-color:#ee6a6759}.sidebar.collapsed .sidebar-logout-btn{display:none}.shell-main{flex:1;min-width:0;display:flex;flex-direction:column}.topbar{position:sticky;top:0;z-index:40;display:flex;align-items:center;gap:22px;padding:14px 28px;background:var(--glass-bg);backdrop-filter:blur(18px) saturate(1.5);-webkit-backdrop-filter:blur(18px) saturate(1.5);border-bottom:1px solid var(--border)}.mobile-menu-btn{display:none;align-items:center;justify-content:center;width:34px;height:34px;border-radius:var(--radius-sm);border:1px solid var(--border);background:var(--surface-2);color:var(--text-dim);cursor:pointer;flex-shrink:0}.topbar-greeting{flex-shrink:1;min-width:0}.topbar-greeting .hello{font-family:var(--font-display);font-weight:700;font-size:var(--text-md);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.topbar-greeting .date{font-size:var(--text-2xs);color:var(--text-faint);text-transform:uppercase;letter-spacing:.06em;white-space:nowrap}.topbar-search{flex:1;max-width:420px;margin:0 auto;position:relative}.topbar-search-ic{position:absolute;left:13px;top:50%;transform:translateY(-50%);color:var(--text-faint);pointer-events:none}.topbar-search .input{padding-left:38px}.search-results{position:absolute;top:calc(100% + 8px);left:0;right:0;background:var(--surface-1);border:1px solid var(--border-strong);border-radius:var(--radius-md);box-shadow:var(--shadow-lg);overflow:hidden;z-index:60;animation:fadeInUp .12s ease both}.search-results a{display:flex;align-items:center;gap:10px;padding:10px 13px;font-size:var(--text-sm);color:var(--text);cursor:pointer;border-top:1px solid var(--border)}.search-results a:first-child{border-top:none}.search-results a:hover{background:var(--surface-2)}.search-results .kind{font-size:10px;text-transform:uppercase;letter-spacing:.05em;color:var(--text-faint);font-weight:700}.search-empty{padding:14px;font-size:var(--text-xs);color:var(--text-faint);text-align:center}.topbar-actions{display:flex;align-items:center;gap:10px;flex-shrink:0}.notif-wrap,.notif-btn{position:relative}.notif-btn .dot{position:absolute;top:6px;right:7px;width:8px;height:8px;border-radius:50%;background:var(--bad);border:2px solid var(--surface-1)}.notif-dropdown{position:absolute;top:calc(100% + 12px);right:0;width:300px;background:var(--surface-1);border:1px solid var(--border-strong);border-radius:var(--radius-md);box-shadow:var(--shadow-lg);overflow:hidden;z-index:60;animation:fadeInUp .12s ease both}.notif-dropdown h4{margin:0;padding:12px 14px 8px;font-size:10.5px;text-transform:uppercase;letter-spacing:.07em;color:var(--text-faint)}.notif-item{display:flex;align-items:flex-start;gap:10px;padding:10px 14px;border-top:1px solid var(--border);font-size:var(--text-sm);color:var(--text)}.notif-item .ic{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:var(--radius-sm);background:var(--surface-2);color:var(--accent);flex-shrink:0}.topbar-avatar{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:50%;overflow:hidden;background:var(--surface-2);border:2px solid var(--border-strong);color:var(--text-dim);flex-shrink:0}@media (max-width: 980px){.sidebar{position:fixed;left:0;top:0;transform:translate(-100%);box-shadow:var(--shadow-lg)}.sidebar.mobile-open{transform:translate(0)}.sidebar-backdrop{display:block;position:fixed;top:0;right:0;bottom:0;left:0;z-index:44;background:#0404058c;animation:fadeIn .15s ease}.mobile-menu-btn{display:inline-flex}.topbar-greeting .date,.topbar-search{display:none}}@media (max-width: 640px){.topbar{padding:12px 16px;gap:12px}.topbar-actions .chip{display:none}}.hero-banner{position:relative;border-radius:var(--radius-lg);padding:40px 36px;overflow:hidden;border:1px solid var(--border);color:#f7f2e4;background:linear-gradient(120deg,color-mix(in srgb,var(--good) 38%,var(--bg)) 0%,var(--bg) 48%,color-mix(in srgb,var(--accent) 55%,var(--bg)) 100%)}.hero-banner:before,.hero-banner:after{content:"";position:absolute;width:320px;height:320px;border-radius:50%;filter:blur(90px);opacity:.35;z-index:0;animation:floatGlow 14s ease-in-out infinite}.hero-banner:before{top:-120px;left:-40px;background:var(--good)}.hero-banner:after{bottom:-140px;right:-20px;background:var(--accent);animation-delay:-7s}.hero-banner>*{position:relative;z-index:1}.hero-banner .kicker{display:inline-block;padding:4px 11px;border-radius:var(--radius-full);background:#ffffff1f;border:1px solid rgba(255,255,255,.2);font-size:var(--text-2xs);font-weight:700}.hero-banner h1{font-family:var(--font-display);font-size:var(--text-3xl);font-weight:600;margin:12px 0 4px;color:#fff}.hero-banner .sub{color:#f7f2e4c7}.hero-stats-row{display:flex;flex-wrap:wrap;gap:12px;margin-top:26px}.hero-stat-pill{display:flex;align-items:center;gap:11px;padding:10px 16px;border-radius:var(--radius-md);background:#ffffff1a;border:1px solid rgba(255,255,255,.18);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}.hero-stat-pill .ic{display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;border-radius:var(--radius-sm);background:#ffffff24}.hero-stat-pill .num{font-weight:800;font-size:var(--text-md);font-variant-numeric:tabular-nums;line-height:1.1}.hero-stat-pill .lbl{font-size:10.5px;text-transform:uppercase;letter-spacing:.05em;opacity:.75}.quick-actions{display:grid;grid-template-columns:1.3fr 1fr;grid-template-rows:repeat(3,auto);gap:var(--space-3) var(--space-4);margin-top:22px}.quick-action{position:relative;display:flex;flex-direction:column;justify-content:space-between;gap:16px;min-height:84px;padding:16px 18px;border-radius:var(--radius-lg);color:#fff;border:1px solid rgba(255,255,255,.1);box-shadow:var(--shadow-sm);overflow:hidden;transition:transform var(--dur-base) var(--ease-spring),box-shadow var(--dur-base) ease}.quick-action:nth-of-type(2){grid-column:2;grid-row:1;transform:rotate(-3deg)}.quick-action:nth-of-type(3){grid-column:2;grid-row:2;transform:rotate(3.4deg) translate(6px)}.quick-action:nth-of-type(4){grid-column:2;grid-row:3;transform:rotate(-2.4deg)}.quick-action:hover{transform:translateY(-3px) rotate(0);box-shadow:var(--shadow-md);z-index:2}.quick-action.featured{grid-column:1;grid-row:1 / span 3;padding:24px 24px 22px;gap:46px;min-height:0}.quick-action.featured:hover{transform:translateY(-3px)}.qa-globe{position:absolute;top:-18px;right:-18px;width:150px;height:150px;fill:none;stroke:#fff;stroke-width:1.1;opacity:.16;pointer-events:none}.quick-action.featured:after{content:"";position:absolute;top:0;right:0;width:30px;height:30px;background:#ffffff29;clip-path:polygon(100% 0,100% 100%,0 0)}.quick-action .qa-top{position:relative;display:flex;align-items:center;justify-content:space-between}.quick-action .ic{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:var(--radius-md);background:#fff3}.quick-action.featured .ic{width:48px;height:48px}.quick-action .arrow{opacity:.85;transition:transform var(--dur-base) var(--ease-spring)}.quick-action:hover .arrow{transform:translate(4px)}.quick-action .label{position:relative;font-weight:800;font-size:var(--text-sm)}.quick-action.featured .label{font-size:var(--text-xl)}@media (max-width: 720px){.quick-actions{grid-template-columns:1fr;grid-template-rows:none}.quick-action,.quick-action:nth-of-type(2),.quick-action:nth-of-type(3),.quick-action:nth-of-type(4){grid-column:1;grid-row:auto;transform:none;min-height:96px}.quick-action.featured{padding:22px;gap:30px}}.stat-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:var(--space-4);margin-top:22px}.stat-card{--stat-color: var(--accent);position:relative;background:var(--surface-1);border:1px solid var(--border);border-top:3px solid var(--stat-color);border-radius:var(--radius-lg);padding:20px;box-shadow:var(--shadow-sm)}.stat-card .ic{display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;border-radius:var(--radius-md);background:color-mix(in srgb,var(--stat-color) 16%,var(--surface-2));color:var(--stat-color);margin-bottom:14px}.stat-card .num{font-size:var(--text-2xl);font-weight:800;letter-spacing:-.01em;font-variant-numeric:tabular-nums}.stat-card .lbl{font-size:var(--text-xs);color:var(--text-dim);margin-top:2px}.celebration-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;z-index:200;display:grid;place-items:center;background:#040405b8;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}.celebration-card{position:relative;width:min(420px,90vw);padding:36px 28px;text-align:center;background:var(--surface-1);border:1px solid var(--accent-border);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg),var(--accent-glow);overflow:visible}.celebration-card.tone-good{border-color:#6bcf8f73}.celebration-card.tone-bad{border-color:#ee6a6759}.celebration-icon{font-size:52px;line-height:1}.celebration-count{position:relative;margin:14px 0 2px}.celebration-count span:first-child{font-family:var(--font-display);font-size:46px;font-weight:800;font-variant-numeric:tabular-nums;background:var(--accent-gradient);-webkit-background-clip:text;background-clip:text;color:transparent}.celebration-count-label{display:block;font-size:var(--text-2xs);color:var(--text-faint);text-transform:uppercase;letter-spacing:.08em;margin-top:2px}.voice-feedback{background:var(--surface-2);border:1px solid var(--border);border-radius:var(--radius-lg);padding:16px;max-width:520px;align-self:center;width:100%}.voice-feedback-head{display:flex;align-items:flex-start;gap:12px}.voice-feedback-text{flex:1;min-width:0}.voice-feedback-overall{font-size:var(--text-lg);font-weight:800;font-variant-numeric:tabular-nums;flex-shrink:0}.voice-feedback-overall small{font-size:var(--text-2xs);font-weight:700;color:var(--text-faint)}.voice-feedback-reaction{margin:10px 0 0;padding:8px 12px;background:var(--surface-1);border:1px dashed var(--border);border-radius:var(--radius-sm);font-size:var(--text-sm);color:var(--text-dim)}.voice-feedback-scores{display:flex;flex-direction:column;gap:8px;margin-top:14px}.voice-score-row{display:flex;align-items:center;gap:8px;color:var(--text-faint)}.voice-score-row .lbl{width:82px;font-size:var(--text-2xs);color:var(--text-dim);flex-shrink:0}.voice-score-row .bar{flex:1;margin-top:0}.voice-score-row .val{width:28px;text-align:right;font-size:var(--text-2xs);font-weight:700;color:var(--text-dim)}.voice-score-row.weakest .lbl,.voice-score-row.weakest .val{color:var(--accent);font-weight:800}.voice-score-row.weakest .bar>div{background:var(--accent)}.voice-feedback-tip{margin:12px 0 0;font-size:var(--text-xs);color:var(--accent-strong)}.rhythm-grid{display:grid;grid-template-columns:1.6fr 1fr;gap:var(--space-4);align-items:start}@media (max-width: 900px){.rhythm-grid{grid-template-columns:1fr}}.rhythm-stats-row{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-3);margin-top:16px}.rhythm-stat{--stat-color: var(--accent);background:var(--surface-2);border:1px solid var(--border);border-radius:var(--radius-md);padding:14px}.rhythm-stat .ic{display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;border-radius:var(--radius-sm);background:color-mix(in srgb,var(--stat-color) 18%,var(--surface-1));color:var(--stat-color);margin-bottom:10px}.rhythm-stat .num{font-size:var(--text-lg);font-weight:800;font-variant-numeric:tabular-nums}.rhythm-stat .lbl{font-size:var(--text-2xs);color:var(--text-faint);text-transform:uppercase;letter-spacing:.05em;margin-top:2px}.rhythm-stat .sub-count{font-size:var(--text-2xs);color:var(--text-dim);margin-top:4px}.streak-card-row{display:flex;align-items:center;gap:16px}.streak-flame{display:inline-flex;align-items:center;justify-content:center;width:56px;height:56px;border-radius:50%;background:color-mix(in srgb,#ff8a3d 18%,var(--surface-2));color:#ff8a3d;flex-shrink:0}.donut-wrap{display:flex;align-items:center;gap:18px;margin-top:14px}.donut{--p: 0;position:relative;width:118px;height:118px;border-radius:50%;flex-shrink:0;display:grid;place-items:center;background:var(--donut-gradient, var(--surface-2))}.donut:before{content:"";position:absolute;top:16px;right:16px;bottom:16px;left:16px;border-radius:50%;background:var(--surface-1)}.donut-center{position:relative;text-align:center;z-index:1}.donut-center .num{font-size:var(--text-md);font-weight:800;font-variant-numeric:tabular-nums}.donut-center .lbl{font-size:9px;color:var(--text-faint);text-transform:uppercase;letter-spacing:.06em}.donut-legend{flex:1;min-width:0;display:flex;flex-direction:column;gap:8px}.donut-legend-row{display:flex;align-items:center;gap:8px;font-size:var(--text-xs)}.donut-dot{width:9px;height:9px;border-radius:50%;flex-shrink:0}.donut-legend-row .name{flex:1;color:var(--text-dim);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.donut-legend-row .pct{font-weight:700;color:var(--text);font-variant-numeric:tabular-nums}.heatmap-wrap{margin-top:14px}.heatmap-scroll{overflow-x:auto;padding-bottom:4px}.heatmap-months{display:grid;gap:3px;margin-bottom:4px;min-width:max-content}.heatmap-month{font-size:10px;color:var(--text-faint);text-transform:uppercase;letter-spacing:.04em}.heatmap-grid{display:grid;gap:3px;min-width:max-content}.heatmap-col{display:grid;grid-template-rows:repeat(7,11px);gap:3px}.heatmap-cell{width:11px;height:11px;border-radius:3px;background:var(--surface-2)}.heatmap-cell.empty{background:transparent}.heatmap-cell.level-1{background:color-mix(in srgb,var(--accent) 28%,var(--surface-2))}.heatmap-cell.level-2{background:color-mix(in srgb,var(--accent) 52%,var(--surface-2))}.heatmap-cell.level-3{background:color-mix(in srgb,var(--accent) 76%,var(--surface-2))}.heatmap-cell.level-4{background:var(--accent)}.heatmap-legend{display:flex;align-items:center;gap:4px;margin-top:10px}.activity-chips{display:flex;gap:10px;flex-wrap:wrap;margin-top:4px}.assistant-panel{display:flex;flex-direction:column;height:min(64vh,640px);padding:18px}.assistant-log{flex:1;overflow-y:auto;display:flex;flex-direction:column;gap:12px;padding:4px 6px}.assistant-empty{margin:auto;text-align:center;max-width:360px;color:var(--text-dim)}.assistant-thinking{display:inline-flex;gap:5px;align-items:center;align-self:flex-start;padding:14px 16px}.assistant-thinking .dot{width:6px;height:6px;border-radius:50%;background:var(--text-faint);animation:assistantDot 1.1s ease-in-out infinite}.assistant-thinking .dot:nth-child(2){animation-delay:.15s}.assistant-thinking .dot:nth-child(3){animation-delay:.3s}@keyframes assistantDot{0%,60%,to{opacity:.3;transform:translateY(0)}30%{opacity:1;transform:translateY(-3px)}}.assistant-input-row{display:flex;gap:10px;margin-top:12px;padding-top:12px;border-top:1px solid var(--border)}.assistant-input-row .input{flex:1}.toggle-row{gap:14px}.switch{position:relative;flex-shrink:0;width:42px;height:24px;border-radius:var(--radius-full);background:var(--surface-3);border:1px solid var(--border-strong);transition:background var(--dur-fast) ease,border-color var(--dur-fast) ease}.switch.on{background:var(--accent);border-color:var(--accent)}.switch-knob{position:absolute;top:2px;left:2px;width:18px;height:18px;border-radius:50%;background:#fff;box-shadow:var(--shadow-sm);transition:transform var(--dur-base) var(--ease-spring)}.switch.on .switch-knob{transform:translate(18px)}.avatar-preview{width:64px;height:64px;border-radius:50%;object-fit:cover;border:2px solid var(--border-strong);flex-shrink:0}.celebration-spark{position:absolute;top:50%;left:50%;width:7px;height:7px;margin:-3.5px 0 0 -3.5px;border-radius:50%;background:var(--accent-gradient);pointer-events:none}
