:root{--bg-deep:oklch(16% .012 260);--bg:oklch(19% .014 260);--surface:oklch(22% .014 260);--surface-2:oklch(25% .014 260);--surface-3:oklch(28% .014 260);--hairline:oklch(32% .014 260/.6);--hairline-2:oklch(40% .014 260/.4);--fg:oklch(97% .005 250);--fg-secondary:oklch(78% .008 250);--fg-muted:oklch(58% .01 250);--fg-faint:oklch(42% .012 250);--accent:oklch(78% .16 180);--accent-2:oklch(82% .18 165);--accent-deep:oklch(55% .14 180);--accent-glow:oklch(78% .16 180/.18);--accent-fg:oklch(15% .02 200);--warn:oklch(80% .16 75);--danger:oklch(70% .2 25);--info:oklch(75% .14 240);--r-sm:6px;--r:10px;--r-lg:14px;--r-xl:20px;--font-sans:"Inter", "Noto Sans SC", system-ui, -apple-system, sans-serif;--font-mono:"JetBrains Mono", "Geist Mono", ui-monospace, "SF Mono", monospace;--density:1}[data-theme=light]{--bg-deep:oklch(97% .004 250);--bg:oklch(98.5% .003 250);--surface:oklch(100% 0 0);--surface-2:oklch(98.5% .003 250);--surface-3:oklch(96% .005 250);--hairline:oklch(88% .008 250/.9);--hairline-2:oklch(82% .01 250/.6);--fg:oklch(20% .015 260);--fg-secondary:oklch(35% .012 260);--fg-muted:oklch(52% .01 260);--fg-faint:oklch(68% .008 260)}*{box-sizing:border-box;margin:0;padding:0}html,body{height:100%;font-family:var(--font-sans);background:var(--bg-deep);color:var(--fg);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-feature-settings:"ss01", "cv11";font-size:14px;line-height:1.55}#root{min-height:100vh}button{cursor:pointer;color:inherit;background:0 0;border:none;font-family:inherit}input,textarea,select{color:inherit;font-family:inherit}.tech-bg{pointer-events:none;z-index:0;background-image:radial-gradient(circle at 20% 10%, oklch(30% .06 200/.18), transparent 50%), radial-gradient(circle at 90% 90%, oklch(30% .06 160/.12), transparent 50%), linear-gradient(var(--hairline-2) 1px, transparent 1px), linear-gradient(90deg, var(--hairline-2) 1px, transparent 1px);opacity:.35;background-position:0 0,0 0,-1px -1px,-1px -1px;background-size:auto,auto,32px 32px,32px 32px;position:fixed;inset:0;-webkit-mask-image:radial-gradient(80% 70% at 50% 30%,#000,#0000 95%);mask-image:radial-gradient(80% 70% at 50% 30%,#000,#0000 95%)}[data-theme=light] .tech-bg{opacity:.5}.app{z-index:1;grid-template-columns:240px 1fr;min-height:100vh;display:grid;position:relative}.sidebar{border-right:1px solid var(--hairline);background:linear-gradient(180deg, var(--bg) 0%, var(--bg-deep) 100%);flex-direction:column;gap:4px;height:100vh;padding:20px 16px;display:flex;position:sticky;top:0}.brand{border-bottom:1px solid var(--hairline);align-items:center;gap:10px;margin-bottom:14px;padding:6px 8px 18px;display:flex}.brand-mark{background:linear-gradient(135deg, var(--accent), var(--accent-2));width:30px;height:30px;font-family:var(--font-mono);color:var(--accent-fg);box-shadow:inset 0 0 0 1px oklch(100% 0 0/.2), 0 0 16px var(--accent-glow);border-radius:8px;place-items:center;font-size:14px;font-weight:700;display:grid;position:relative}.brand-mark:after{content:"";border:1px solid var(--accent);opacity:.4;border-radius:10px;animation:2.4s ease-in-out infinite pgPulse;position:absolute;inset:-2px}.brand-name{letter-spacing:-.01em;font-size:15px;font-weight:600}.brand-sub{color:var(--fg-muted);font-size:10.5px;font-family:var(--font-mono);letter-spacing:.06em;text-transform:uppercase;margin-top:1px}.nav-section{font-size:10px;font-family:var(--font-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--fg-faint);padding:14px 10px 6px}.nav-item{border-radius:var(--r-sm);color:var(--fg-secondary);cursor:pointer;align-items:center;gap:11px;padding:8px 11px;font-size:13px;font-weight:500;transition:background .15s,color .15s;display:flex;position:relative}.nav-item:hover{background:var(--surface);color:var(--fg)}.nav-item.active{color:var(--accent);background:linear-gradient(90deg, var(--accent-glow), transparent 80%)}.nav-item.active:before{content:"";background:var(--accent);width:2px;box-shadow:0 0 8px var(--accent);border-radius:2px;position:absolute;top:6px;bottom:6px;left:0}.nav-item .ico{opacity:.8;place-items:center;width:16px;height:16px;display:grid}.sidebar-foot{border-top:1px solid var(--hairline);font-family:var(--font-mono);color:var(--fg-faint);flex-direction:column;gap:4px;margin-top:auto;padding:12px 10px;font-size:10px;display:flex}.status-dot{background:var(--accent);width:6px;height:6px;box-shadow:0 0 6px var(--accent);border-radius:50%;margin-right:6px;animation:2s infinite pgBlink;display:inline-block}.main{grid-template-columns:1fr 240px;min-height:100vh;display:grid}.workspace{flex-direction:column;min-width:0;padding:0;display:flex}.topbar{background:oklch(from var(--bg-deep) l c h / .85);-webkit-backdrop-filter:blur(14px)saturate(140%);border-bottom:1px solid var(--hairline);z-index:10;justify-content:space-between;align-items:center;gap:24px;padding:16px 32px;display:flex;position:sticky;top:0}.topbar-title h1{letter-spacing:-.01em;font-size:17px;font-weight:600}.topbar-title p{color:var(--fg-muted);font-size:11.5px;font-family:var(--font-mono);letter-spacing:.04em;margin-top:2px}.workspace-body{flex:1;min-height:0;padding:28px 32px 60px;overflow-y:auto}.stepper{background:var(--surface);border:1px solid var(--hairline);border-radius:var(--r-lg);align-items:center;gap:0;margin-bottom:28px;padding:8px;display:flex}.step{border-radius:var(--r);cursor:pointer;flex:1;align-items:center;gap:10px;min-width:0;padding:10px 14px;transition:background .15s;display:flex;position:relative}.step:hover:not(.active):not(.done){background:var(--surface-2)}.step-num{width:24px;height:24px;font-family:var(--font-mono);background:var(--surface-3);color:var(--fg-muted);border:1px solid var(--hairline);border-radius:50%;flex-shrink:0;place-items:center;font-size:11px;font-weight:600;display:grid}.step-label{color:var(--fg-secondary);white-space:nowrap;text-overflow:ellipsis;font-size:13px;font-weight:500;overflow:hidden}.step-sub{color:var(--fg-faint);font-size:10px;font-family:var(--font-mono)}.step.done .step-num{background:oklch(from var(--accent) l c h / .15);color:var(--accent);border-color:oklch(from var(--accent) l c h / .4)}.step.done .step-num:after{content:"✓";font-family:var(--font-sans)}.step.done .step-num .num{display:none}.step.active{background:linear-gradient(135deg, var(--accent-glow), oklch(from var(--accent) l c h / .04));box-shadow:inset 0 0 0 1px oklch(from var(--accent) l c h / .4)}.step.active .step-num{background:var(--accent);color:var(--accent-fg);border-color:var(--accent);box-shadow:0 0 14px var(--accent-glow)}.step.active .step-label{color:var(--fg)}.step-connector{background:var(--hairline-2);flex-shrink:0;width:24px;height:1px}.card{background:var(--surface);border:1px solid var(--hairline);border-radius:var(--r-lg);overflow:hidden}.card-pad{padding:22px}.card-head{border-bottom:1px solid var(--hairline);justify-content:space-between;align-items:center;gap:12px;padding:16px 22px;display:flex}.card-head h3{letter-spacing:.01em;font-size:13px;font-weight:600}.card-head .head-mono{font-family:var(--font-mono);color:var(--fg-muted);letter-spacing:.06em;text-transform:uppercase;font-size:10.5px}.btn{border-radius:var(--r-sm);white-space:nowrap;border:1px solid #0000;justify-content:center;align-items:center;gap:7px;padding:9px 16px;font-size:13px;font-weight:500;transition:all .15s;display:inline-flex}.btn-primary{background:linear-gradient(135deg, var(--accent), var(--accent-2));color:var(--accent-fg);box-shadow:inset 0 1px 0 oklch(100% 0 0/.15), 0 0 0 1px oklch(from var(--accent) l c h / .3), 0 4px 14px var(--accent-glow);font-weight:600}.btn-primary:hover{filter:brightness(1.08);box-shadow:inset 0 1px 0 oklch(100% 0 0/.2), 0 0 0 1px oklch(from var(--accent) l c h / .5), 0 6px 20px var(--accent-glow)}.btn-primary:disabled{opacity:.4;cursor:not-allowed;filter:none}.btn-ghost{background:var(--surface);color:var(--fg-secondary);border-color:var(--hairline)}.btn-ghost:hover{background:var(--surface-2);color:var(--fg);border-color:var(--hairline-2)}.btn-outline{border-color:oklch(from var(--accent) l c h / .4);color:var(--accent);background:oklch(from var(--accent) l c h / .05)}.btn-outline:hover{background:var(--accent-glow);border-color:var(--accent)}.btn-sm{gap:5px;padding:6px 11px;font-size:12px}.btn-lg{padding:12px 22px;font-size:14px}.btn-icon{border-radius:var(--r-sm);width:32px;height:32px;padding:0}.input,.textarea,.select{background:var(--surface-3);border:1px solid var(--hairline);color:var(--fg);border-radius:var(--r-sm);outline:none;width:100%;padding:9px 12px;font-size:13px;transition:border .15s,box-shadow .15s}.input:focus,.textarea:focus,.select:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-glow)}.textarea{font-family:var(--font-mono);resize:vertical;font-size:12px;line-height:1.65}.chip{background:var(--surface-2);color:var(--fg-secondary);border:1px solid var(--hairline);font-size:11px;font-weight:500;font-family:var(--font-mono);letter-spacing:.02em;border-radius:999px;align-items:center;gap:5px;padding:3px 9px;display:inline-flex}.chip-accent{background:oklch(from var(--accent) l c h / .1);color:var(--accent);border-color:oklch(from var(--accent) l c h / .3)}.chip-warn{background:oklch(from var(--warn) l c h / .1);color:var(--warn);border-color:oklch(from var(--warn) l c h / .3)}.chip-danger{background:oklch(from var(--danger) l c h / .1);color:var(--danger);border-color:oklch(from var(--danger) l c h / .3)}.chip-dot:before{content:"";background:currentColor;border-radius:50%;width:6px;height:6px;box-shadow:0 0 6px}image-slot{--slot-bg:var(--surface-2);--slot-border:var(--hairline);--slot-border-style:dashed;--slot-fg:var(--fg-muted);--slot-accent:var(--accent)}.shimmer{background:var(--surface-2);position:relative;overflow:hidden}.shimmer:before{content:"";background:linear-gradient(100deg, transparent 20%, oklch(from var(--accent) l c h / .12) 50%, transparent 80%);animation:1.6s ease-in-out infinite pgShimmer;position:absolute;inset:0}.shimmer-bars{color:var(--accent);font-family:var(--font-mono);letter-spacing:.08em;flex-direction:column;justify-content:center;align-items:center;gap:10px;font-size:11px;display:flex;position:absolute;inset:0}.shimmer-bars .scan{background:linear-gradient(90deg, transparent, var(--accent), transparent);height:2px;box-shadow:0 0 12px var(--accent);animation:2.2s ease-in-out infinite pgScan;position:absolute;left:0;right:0}.placeholder-stripes{background:repeating-linear-gradient(45deg, oklch(from var(--surface-2) l c h / 1), oklch(from var(--surface-2) l c h / 1) 8px, oklch(from var(--surface-3) l c h / 1) 8px, oklch(from var(--surface-3) l c h / 1) 16px);color:var(--fg-faint);font-family:var(--font-mono);letter-spacing:.06em;text-transform:uppercase;text-align:center;place-items:center;padding:8px;font-size:10.5px;display:grid}.refpanel{border-left:1px solid var(--hairline);background:linear-gradient(180deg, var(--bg) 0%, var(--bg-deep) 100%);flex-direction:column;gap:18px;height:100vh;padding:20px 16px;display:flex;position:sticky;top:0;overflow-y:auto}.refpanel-title{font-family:var(--font-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--fg-faint);justify-content:space-between;align-items:center;font-size:10px;display:flex}.refpanel-group{flex-direction:column;gap:8px;display:flex}.refpanel-group-label{color:var(--fg-muted);justify-content:space-between;align-items:center;font-size:11px;font-weight:500;display:flex}.refpanel-grid{grid-template-columns:1fr 1fr;gap:8px;display:grid}.refpanel-card{aspect-ratio:1;border-radius:var(--r-sm);border:1px solid var(--hairline);cursor:pointer;background:var(--surface-2);transition:all .15s;position:relative;overflow:hidden}.refpanel-card:hover{border-color:var(--accent);transform:translateY(-1px)}.refpanel-card.active{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent), 0 0 12px var(--accent-glow)}.refpanel-card-foot{font-size:9.5px;font-family:var(--font-mono);color:oklch(100% 0 0/.9);letter-spacing:.04em;background:linear-gradient(#0000,oklch(10% 0 0/.85));justify-content:space-between;align-items:flex-end;padding:18px 6px 4px;display:flex;position:absolute;bottom:0;left:0;right:0}.refpanel-card-tag{color:var(--accent);background:oklch(0% 0 0/.5);border-radius:3px;padding:1px 5px}.refpanel-card-pulse{background:var(--accent);width:8px;height:8px;box-shadow:0 0 8px var(--accent);border-radius:50%;animation:1s infinite pgBlink;position:absolute;top:5px;right:5px}.mode-grid{grid-template-columns:repeat(2,1fr);gap:16px;max-width:880px;display:grid}.mode-card{background:var(--surface);border:1px solid var(--hairline);border-radius:var(--r-lg);cursor:pointer;flex-direction:column;gap:12px;padding:24px;transition:all .2s;display:flex;position:relative;overflow:hidden}.mode-card:before{content:"";background:radial-gradient(circle at 100% 0%, var(--accent-glow), transparent 60%);opacity:0;pointer-events:none;transition:opacity .3s;position:absolute;inset:0}.mode-card:hover:before{opacity:1}.mode-card:hover{border-color:oklch(from var(--accent) l c h / .5);transform:translateY(-2px)}.mode-card.disabled{opacity:.4;cursor:not-allowed}.mode-card.disabled:hover{border-color:var(--hairline);transform:none}.mode-card.disabled:before{display:none}.mode-card-head{justify-content:space-between;align-items:flex-start;gap:12px;display:flex}.mode-card-icon{background:linear-gradient(135deg, var(--surface-3), var(--surface-2));border:1px solid var(--hairline);border-radius:10px;flex-shrink:0;place-items:center;width:42px;height:42px;font-size:19px;display:grid;position:relative}.mode-card.recommended .mode-card-icon{background:linear-gradient(135deg, var(--accent), var(--accent-2));color:var(--accent-fg);box-shadow:0 0 16px var(--accent-glow);border-color:#0000}.mode-card h3{letter-spacing:-.01em;font-size:15px;font-weight:600}.mode-card p{color:var(--fg-secondary);font-size:12.5px;line-height:1.55}.mode-card-sub{color:var(--fg-faint);font-size:11px;font-family:var(--font-mono);border-top:1px dashed var(--hairline);margin-top:auto;padding-top:8px}.row{align-items:center;gap:12px;display:flex}.col{flex-direction:column;gap:12px;display:flex}.gap-2{gap:8px}.gap-3{gap:12px}.gap-4{gap:16px}.gap-6{gap:24px}.between{justify-content:space-between}.mono{font-family:var(--font-mono)}.muted{color:var(--fg-muted)}.faint{color:var(--fg-faint)}.fg-sec{color:var(--fg-secondary)}.text-xs{font-size:11px}.text-sm{font-size:12px}.text-md{font-size:14px}.text-lg{font-size:17px}.text-xl{font-size:22px}.w-full{width:100%}.grow{flex:1;min-width:0}.section-title{font-size:11px;font-family:var(--font-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--fg-muted);align-items:center;gap:10px;margin:24px 0 12px;display:flex}.section-title:after{content:"";background:var(--hairline-2);flex:1;height:1px}.section-title .num{font-family:var(--font-mono);color:var(--accent)}@keyframes pgFade{0%{opacity:0}to{opacity:1}}@keyframes pgSlideIn{0%{opacity:0;transform:translate(40px)}to{opacity:1;transform:translate(0)}}@keyframes pgPulse{0%,to{opacity:.4;transform:scale(1)}50%{opacity:0;transform:scale(1.18)}}@keyframes pgBlink{0%,to{opacity:1}50%{opacity:.3}}@keyframes pgShimmer{0%{transform:translate(-100%)}to{transform:translate(100%)}}@keyframes pgScan{0%{opacity:0;top:0}10%{opacity:1}90%{opacity:1}to{opacity:0;top:100%}}@keyframes pgRise{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@keyframes pgGlow{0%,to{box-shadow:0 0 0 1px var(--accent), 0 0 12px var(--accent-glow)}50%{box-shadow:0 0 0 1px var(--accent), 0 0 24px oklch(from var(--accent) l c h / .5)}}.rise{animation:.4s ease-out backwards pgRise}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:var(--surface-3);background-clip:padding-box;border:2px solid #0000;border-radius:4px}::-webkit-scrollbar-thumb:hover{background:var(--hairline)}kbd{font-family:var(--font-mono);background:var(--surface-3);border:1px solid var(--hairline);color:var(--fg-muted);border-radius:4px;padding:1px 6px;font-size:10px}.step-page{animation:.35s ease-out backwards pgRise}.step-actions{border-top:1px solid var(--hairline);justify-content:space-between;align-items:center;margin-top:24px;padding:16px 0 0;display:flex}.step-foot{border-top:1px solid var(--hairline);justify-content:space-between;align-items:center;gap:16px;margin-top:32px;padding-top:20px;display:flex}.step-foot .meta{font-family:var(--font-mono);color:var(--fg-muted);letter-spacing:.04em;font-size:11px}.kv{border-radius:var(--r);border:1px solid var(--hairline);grid-template-columns:120px 1fr;gap:0;display:grid;overflow:hidden}.kv>div{border-bottom:1px solid var(--hairline);background:var(--surface);padding:10px 14px;font-size:12.5px}.kv>div:nth-last-child(-n+2){border-bottom:none}.kv .k{font-family:var(--font-mono);color:var(--fg-muted);letter-spacing:.04em;background:var(--surface-2);text-transform:uppercase;font-size:11px}.kv .v{color:var(--fg)}.tabs{background:var(--surface);border:1px solid var(--hairline);border-radius:var(--r);gap:2px;padding:3px;display:inline-flex}.tab{color:var(--fg-muted);cursor:pointer;border:1px solid #0000;border-radius:7px;padding:6px 14px;font-size:12px;font-weight:500;transition:all .15s}.tab:hover{color:var(--fg-secondary)}.tab.active{background:var(--surface-2);color:var(--fg);border-color:var(--hairline-2)}.tog{background:var(--surface-3);font-size:11px;font-family:var(--font-mono);border:1px solid var(--hairline);border-radius:999px;padding:3px;display:inline-flex}.tog button{color:var(--fg-muted);letter-spacing:.04em;text-transform:uppercase;border-radius:999px;padding:4px 10px}.tog button.active{background:var(--accent);color:var(--accent-fg)}[data-density=compact]{--r:8px;--r-lg:10px}[data-density=compact] .card-pad{padding:16px}[data-density=compact] .workspace-body{padding:20px 24px 40px}[data-density=compact] .stepper{margin-bottom:20px;padding:6px}[data-density=compact] .step{padding:8px 10px}[data-density=compact] body{font-size:13px}html{scrollbar-gutter:stable}.page-header{margin-bottom:28px;animation:.35s ease-out backwards pgRise}.grid-2{grid-template-columns:repeat(2,1fr);gap:16px;display:grid}.grid-3{grid-template-columns:repeat(3,1fr);gap:16px;display:grid}.grid-4{grid-template-columns:repeat(4,1fr);gap:14px;display:grid}.grid-5{grid-template-columns:repeat(5,1fr);gap:12px;display:grid}.grid-6{grid-template-columns:repeat(6,1fr);gap:12px;display:grid}.search{align-items:center;min-width:260px;display:inline-flex;position:relative}.search:before{content:"⌕";color:var(--fg-muted);pointer-events:none;font-size:14px;position:absolute;left:12px}.search input{background:var(--surface);border:1px solid var(--hairline);color:var(--fg);border-radius:var(--r-sm);outline:none;width:100%;padding:8px 12px 8px 32px;font-family:inherit;font-size:12.5px;transition:border .15s,box-shadow .15s}.search input:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-glow)}.filter-row{flex-wrap:wrap;align-items:center;gap:8px;padding:12px 0;display:flex}.filter-chip{background:var(--surface);border:1px solid var(--hairline);color:var(--fg-secondary);cursor:pointer;border-radius:999px;padding:5px 12px;font-size:12px;font-weight:500;transition:all .15s}.filter-chip:hover{border-color:var(--hairline-2);color:var(--fg)}.filter-chip.active{background:oklch(from var(--accent) l c h / .12);color:var(--accent);border-color:oklch(from var(--accent) l c h / .4)}.thumb-card{background:var(--surface);border:1px solid var(--hairline);border-radius:var(--r-lg);cursor:pointer;flex-direction:column;transition:all .2s;display:flex;overflow:hidden}.thumb-card:hover{border-color:oklch(from var(--accent) l c h / .4);transform:translateY(-2px);box-shadow:0 12px 32px oklch(0% 0 0/.3)}.thumb-card-img{aspect-ratio:4/5;background:var(--surface-2);position:relative;overflow:hidden}.thumb-card-img img{object-fit:cover;width:100%;height:100%;transition:transform .3s;display:block}.thumb-card:hover .thumb-card-img img{transform:scale(1.04)}.thumb-card-body{flex-direction:column;gap:6px;padding:12px 14px;display:flex}.thumb-card-body h4{letter-spacing:-.005em;font-size:13.5px;font-weight:600}.thumb-card-meta{font-family:var(--font-mono);color:var(--fg-muted);letter-spacing:.03em;justify-content:space-between;align-items:center;font-size:10.5px;display:flex}.tbl{border-collapse:separate;border-spacing:0;width:100%}.tbl th,.tbl td{text-align:left;border-bottom:1px solid var(--hairline);padding:12px 16px;font-size:12.5px}.tbl th{font-family:var(--font-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--fg-muted);background:var(--surface-2);font-size:10.5px;font-weight:500}.tbl tr:hover td{background:var(--surface-2)}.tbl td{color:var(--fg-secondary)}.tbl tr:last-child td{border-bottom:none}.vert-card{background:var(--surface);border:1px solid var(--hairline);border-radius:var(--r-lg);cursor:pointer;flex-direction:column;gap:14px;min-height:200px;padding:24px;transition:all .25s;display:flex;position:relative;overflow:hidden}.vert-card:before{content:"";background:radial-gradient(circle at 100% 0%, oklch(.5 .2 var(--vh,200) / .16), transparent 55%);opacity:0;pointer-events:none;transition:opacity .3s;position:absolute;inset:0}.vert-card:hover:before{opacity:1}.vert-card:hover{border-color:oklch(.65 .18 var(--vh,200) / .5);transform:translateY(-3px);box-shadow:0 20px 40px oklch(0% 0 0/.3)}.vert-card.disabled{opacity:.4;cursor:not-allowed}.vert-card.disabled:hover{transform:none}.auth-shell{z-index:1;place-items:center;min-height:100vh;display:grid;position:relative}.auth-card{background:var(--surface);border:1px solid var(--hairline);border-radius:var(--r-xl);width:380px;padding:32px 28px;animation:.5s ease-out backwards pgRise;box-shadow:0 32px 80px oklch(0% 0 0/.4)}.settings-layout{grid-template-columns:220px 1fr;align-items:flex-start;gap:24px;display:grid}.settings-nav{flex-direction:column;gap:2px;display:flex;position:sticky;top:92px}.settings-nav-item{color:var(--fg-secondary);border-radius:var(--r-sm);cursor:pointer;padding:8px 12px;font-size:13px;transition:all .15s}.settings-nav-item:hover{background:var(--surface);color:var(--fg)}.settings-nav-item.active{background:oklch(from var(--accent) l c h / .1);color:var(--accent)}.switch{cursor:pointer;width:36px;height:20px;display:inline-block;position:relative}.switch-track{background:var(--surface-3);border:1px solid var(--hairline);border-radius:999px;width:100%;height:100%;transition:background .2s}.switch-thumb{background:var(--fg-muted);border-radius:50%;width:14px;height:14px;transition:all .2s;position:absolute;top:2px;left:2px}.switch.on .switch-track{background:oklch(from var(--accent) l c h / .25);border-color:oklch(from var(--accent) l c h / .5)}.switch.on .switch-thumb{background:var(--accent);box-shadow:0 0 8px var(--accent-glow);left:18px}.score{font-family:var(--font-mono);color:var(--accent);align-items:center;gap:4px;font-size:12px;font-weight:600;display:inline-flex}.score:before{content:"★";font-size:13px}[data-accent=cyan]{--accent:oklch(80% .16 180);--accent-2:oklch(84% .18 165);--accent-deep:oklch(55% .14 180);--accent-glow:oklch(80% .16 180/.18);--accent-fg:oklch(15% .02 200)}[data-accent=indigo]{--accent:oklch(72% .18 270);--accent-2:oklch(78% .2 290);--accent-deep:oklch(50% .16 270);--accent-glow:oklch(72% .18 270/.2);--accent-fg:oklch(98% .01 270)}[data-accent=amber]{--accent:oklch(82% .16 70);--accent-2:oklch(86% .16 55);--accent-deep:oklch(62% .14 65);--accent-glow:oklch(82% .16 70/.2);--accent-fg:oklch(18% .04 70)}[data-accent=rose]{--accent:oklch(74% .18 15);--accent-2:oklch(78% .2 350);--accent-deep:oklch(55% .16 15);--accent-glow:oklch(74% .18 15/.2);--accent-fg:oklch(98% .01 0)}[data-accent=emerald]{--accent:oklch(74% .16 155);--accent-2:oklch(80% .18 145);--accent-deep:oklch(52% .14 155);--accent-glow:oklch(74% .16 155/.2);--accent-fg:oklch(15% .04 155)}[data-accent=violet]{--accent:oklch(72% .18 305);--accent-2:oklch(78% .2 290);--accent-deep:oklch(50% .16 305);--accent-glow:oklch(72% .18 305/.2);--accent-fg:oklch(98% .01 305)}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}.ring{--p:50;--c:var(--accent);aspect-ratio:1;background:radial-gradient(closest-side, var(--surface) 76%, transparent 78% 100%), conic-gradient(var(--c) calc(var(--p) * 1%), var(--surface-3) 0);border-radius:50%;place-items:center;width:120px;display:grid;position:relative}.ring-val{font-family:var(--font-mono);color:var(--fg);font-size:22px;font-weight:700}.ring-val small{color:var(--fg-muted);font-size:12px;font-weight:500}