:root{--brand-accent: oklch(.58 .13 235);--accent: var(--brand-accent);--accent-hover: oklch(.52 .13 235);--accent-text-safe: oklch(.48 .13 235);--accent-300: oklch(.78 .09 235);--accent-600: oklch(.5 .13 235);--accent-alpha8: oklch(.58 .13 235 / .08);--accent-alpha14: oklch(.58 .13 235 / .14);--bg-canvas: oklch(.985 .002 250);--bg-surface: #ffffff;--bg-raised: #ffffff;--bg-sunken: oklch(.965 .003 250);--text-primary: oklch(.22 .01 250);--text-secondary: oklch(.45 .01 250);--text-tertiary: oklch(.6 .008 250);--border-subtle: oklch(.92 .004 250);--border-strong: oklch(.85 .005 250);--success: oklch(.62 .14 155);--success-bg: oklch(.62 .14 155 / .12);--warning: oklch(.72 .14 75);--warning-bg: oklch(.72 .14 75 / .14);--violet: oklch(.58 .16 300);--violet-bg: oklch(.58 .16 300 / .12);--danger: oklch(.58 .19 25);--overlay: oklch(0 0 0 / .5);--font-sans: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--font-mono: "JetBrains Mono", ui-monospace, "SF Mono", Menlo, monospace;--radius-sm: 8px;--radius-md: 12px;--radius-lg: 16px;--radius-xl: 24px;--radius-full: 999px;--shadow-sm: 0 1px 2px oklch(0 0 0 / .05), 0 1px 1px oklch(0 0 0 / .04);--shadow-md: 0 4px 12px oklch(0 0 0 / .08);--shadow-lg: 0 12px 32px oklch(0 0 0 / .12);--s1: 4px;--s2: 8px;--s3: 12px;--s4: 16px;--s5: 24px;--s6: 32px;--s7: 48px;--s8: 64px;--s9: 96px;--ease: cubic-bezier(.2, 0, 0, 1);--rail-w: 248px;--topbar-h: 60px}:root[data-theme=dark]{--accent: oklch(.68 .13 235);--accent-hover: oklch(.74 .12 235);--accent-text-safe: oklch(.74 .11 235);--accent-300: oklch(.6 .1 235);--accent-600: oklch(.72 .13 235);--accent-alpha8: oklch(.68 .13 235 / .12);--accent-alpha14: oklch(.68 .13 235 / .2);--bg-canvas: oklch(.145 .005 250);--bg-surface: oklch(.185 .005 250);--bg-raised: oklch(.22 .006 250);--bg-sunken: oklch(.12 .004 250);--text-primary: oklch(.93 .005 250);--text-secondary: oklch(.72 .006 250);--text-tertiary: oklch(.55 .006 250);--border-subtle: oklch(.28 .006 250);--border-strong: oklch(.36 .008 250);--success: oklch(.72 .14 155);--success-bg: oklch(.72 .14 155 / .16);--warning: oklch(.78 .13 75);--warning-bg: oklch(.78 .13 75 / .18);--violet: oklch(.72 .14 300);--violet-bg: oklch(.72 .14 300 / .18);--danger: oklch(.68 .17 25);--overlay: oklch(0 0 0 / .65);--shadow-sm: 0 0 0 1px oklch(1 0 0 / .04);--shadow-md: 0 4px 16px oklch(0 0 0 / .4);--shadow-lg: 0 12px 36px oklch(0 0 0 / .55)}*{box-sizing:border-box}html,body,#root{height:100%}body{margin:0;font-family:var(--font-sans);background:var(--bg-canvas);color:var(--text-primary);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;font-feature-settings:"ss01" 1,"cv01" 1}h1,h2,h3,h4,p{margin:0}button{font-family:inherit;cursor:pointer}a{color:var(--accent-text-safe);text-decoration:none}::selection{background:var(--accent-alpha14)}.t-display{font-size:32px;line-height:38px;font-weight:650;letter-spacing:-.01em}.t-title{font-size:24px;line-height:30px;font-weight:650;letter-spacing:-.01em}.t-heading{font-size:18px;line-height:26px;font-weight:600}.t-body{font-size:16px;line-height:24px;font-weight:450}.t-small{font-size:14px;line-height:20px;font-weight:450}.t-caption{font-size:13px;line-height:18px;font-weight:500}.mono{font-family:var(--font-mono)}.sec{color:var(--text-secondary)}.ter{color:var(--text-tertiary)}:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:4px}.shell{display:grid;grid-template-columns:var(--rail-w) 1fr;min-height:100vh}.rail{background:var(--bg-sunken);border-right:1px solid var(--border-subtle);padding:var(--s4) var(--s3);display:flex;flex-direction:column;gap:var(--s1);position:sticky;top:0;height:100vh;overflow-y:auto}.rail-logo{padding:var(--s3) var(--s3) var(--s5)}.rail-logo img{height:30px;width:auto}.rail-group-label{font-size:11px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--text-tertiary);padding:var(--s4) var(--s3) var(--s2)}.rail-item{display:flex;align-items:center;gap:var(--s3);padding:9px var(--s3);border-radius:var(--radius-sm);border:none;background:none;width:100%;text-align:left;color:var(--text-secondary);font-size:14px;font-weight:500;transition:background .12s var(--ease),color .12s var(--ease)}.rail-item:hover{background:var(--accent-alpha8);color:var(--text-primary)}.rail-item.active{background:var(--accent-alpha14);color:var(--text-primary);font-weight:600}.rail-item .rail-dot{margin-left:auto}.main{display:flex;flex-direction:column;min-width:0}.topbar{height:var(--topbar-h);border-bottom:1px solid var(--border-subtle);display:flex;align-items:center;gap:var(--s4);padding:0 var(--s6);position:sticky;top:0;background:color-mix(in oklch,var(--bg-canvas) 82%,transparent);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);z-index:20}.topbar .spacer{flex:1}.content{padding:var(--s7) var(--s6);flex:1}.content-col{max-width:720px;margin:0 auto}.content-wide{max-width:1060px;margin:0 auto}.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--s2);border-radius:var(--radius-md);font-weight:600;font-size:15px;border:1px solid transparent;padding:0 var(--s5);height:44px;transition:transform .08s var(--ease),background .12s var(--ease),box-shadow .12s var(--ease)}.btn:active{transform:scale(.98)}.btn-primary{background:var(--accent);color:#fff;box-shadow:var(--shadow-sm)}.btn-primary:hover{background:var(--accent-hover);box-shadow:var(--shadow-md)}.btn-secondary{background:var(--bg-surface);color:var(--text-primary);border-color:var(--border-strong)}.btn-secondary:hover{background:var(--bg-sunken)}.btn-ghost{background:none;color:var(--text-secondary);padding:0 var(--s3)}.btn-ghost:hover{background:var(--accent-alpha8);color:var(--text-primary)}.btn-lg{height:48px;font-size:16px;padding:0 var(--s6)}.btn-sm{height:34px;font-size:13px;padding:0 var(--s3)}.btn:disabled{opacity:.4;pointer-events:none}.card{background:var(--bg-surface);border:1px solid var(--border-subtle);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm)}.card-pad{padding:var(--s5)}.chip{display:inline-flex;align-items:center;gap:6px;padding:3px 10px;border-radius:var(--radius-full);font-size:12px;font-weight:600;line-height:1.4;background:var(--bg-sunken);color:var(--text-secondary);border:1px solid var(--border-subtle)}.chip.accent{background:var(--accent-alpha14);color:var(--accent-text-safe);border-color:transparent}.chip.success{background:var(--success-bg);color:var(--success);border-color:transparent}.chip.warning{background:var(--warning-bg);color:var(--warning);border-color:transparent}.chip.violet{background:var(--violet-bg);color:var(--violet);border-color:transparent}.chip.dashed{background:none;border:1px dashed var(--accent);color:var(--accent-text-safe)}.select-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--s3)}.select-card{text-align:left;background:var(--bg-surface);border:1.5px solid var(--border-subtle);border-radius:var(--radius-md);padding:var(--s4);display:flex;flex-direction:column;gap:6px;transition:border-color .12s var(--ease),background .12s var(--ease),box-shadow .12s var(--ease),transform .08s var(--ease);position:relative}.select-card:hover{border-color:var(--accent-300);box-shadow:var(--shadow-sm)}.select-card:active{transform:scale(.99)}.select-card.selected{border-color:var(--accent);border-width:2px;background:var(--accent-alpha8)}.select-card .sc-title{font-size:16px;font-weight:600}.select-card .sc-desc{font-size:13px;line-height:19px;color:var(--text-secondary)}.select-card .sc-example{font-size:12px;font-style:italic;color:var(--text-tertiary)}.select-card .sc-check{position:absolute;top:var(--s3);right:var(--s3);width:20px;height:20px;border-radius:var(--radius-full);background:var(--accent);color:#fff;display:grid;place-items:center;font-size:12px;opacity:0;transform:scale(.6);transition:opacity .16s var(--ease),transform .16s var(--ease)}.select-card.selected .sc-check{opacity:1;transform:scale(1)}.select-card.wide{grid-column:1 / -1}.select-card.quiet{border-style:dashed;background:none}.field-label{display:block;font-size:14px;font-weight:600;margin-bottom:var(--s2)}.input,.textarea{width:100%;background:var(--bg-surface);border:1.5px solid var(--border-subtle);border-radius:var(--radius-md);padding:12px 14px;font-size:16px;color:var(--text-primary);font-family:inherit;transition:border-color .12s var(--ease)}.input{height:48px}.input:focus,.textarea:focus{border-color:var(--accent);outline:none}.input.mono,.textarea.mono{font-family:var(--font-mono);font-size:14px}.textarea{resize:vertical;min-height:84px;line-height:22px}.input.suggested,.textarea.suggested{background:var(--accent-alpha8);border-style:dashed;border-color:var(--accent)}.input-hint{font-size:12px;color:var(--text-tertiary);margin-top:6px}.input-hint.warn{color:var(--warning)}.combo-menu{position:absolute;top:calc(100% + 6px);left:0;right:0;z-index:30;background:var(--bg-raised);border:1px solid var(--border-subtle);border-radius:var(--radius-md);box-shadow:var(--shadow-lg);overflow:hidden;padding:4px}.combo-item{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;text-align:left;background:none;border:none;padding:10px 12px;border-radius:var(--radius-sm);font-size:15px;color:var(--text-primary)}.combo-item:hover{background:var(--accent-alpha8)}.combo-item.add{color:var(--accent-text-safe);font-weight:600}.ring{transform:rotate(-90deg)}.ring-track{stroke:var(--border-subtle);fill:none}.ring-fill{stroke:var(--accent);fill:none;stroke-linecap:round;transition:stroke-dashoffset .5s var(--ease)}.ring-fill.done{stroke:var(--success)}.sdot{width:9px;height:9px;border-radius:50%;display:inline-block}.sdot.done{background:var(--success)}.sdot.progress{background:var(--accent)}.sdot.none{background:var(--border-strong)}.sdot.assigned{background:var(--violet)}.sdot.blocked{background:var(--warning)}.pdots{display:flex;gap:6px;align-items:center}.pdot{width:7px;height:7px;border-radius:50%;background:var(--border-strong);transition:background .15s var(--ease),width .15s var(--ease)}.pdot.filled{background:var(--accent)}.pdot.current{background:var(--accent);width:20px;border-radius:var(--radius-full)}.why{font-size:14px;line-height:20px;color:var(--text-secondary);margin-top:var(--s3)}.learn{margin-top:var(--s4);border-top:1px solid var(--border-subtle);padding-top:var(--s3)}.learn summary{cursor:pointer;font-size:13px;color:var(--accent-text-safe);font-weight:600;list-style:none;display:flex;align-items:center;gap:6px}.learn summary::-webkit-details-marker{display:none}.learn[open] summary{margin-bottom:var(--s3)}.learn-body{font-size:14px;line-height:21px;color:var(--text-secondary)}.escape-row{display:flex;align-items:center;gap:var(--s4);margin-top:var(--s7)}.escape-row .link{background:none;border:none;color:var(--text-tertiary);font-size:14px;font-weight:500;padding:6px 0}.escape-row .link:hover{color:var(--text-secondary);text-decoration:underline}.escape-row .spacer{flex:1}.saved{display:inline-flex;align-items:center;gap:6px;font-size:12px;color:var(--text-tertiary)}.saved .dot{width:6px;height:6px;border-radius:50%;background:var(--success)}.saved.saving .dot{background:var(--warning)}.callout{display:flex;gap:var(--s3);background:var(--warning-bg);border:1px solid transparent;border-radius:var(--radius-md);padding:var(--s4);margin-top:var(--s4)}.callout .ci{color:var(--warning);flex-shrink:0}.callout .ct{font-size:13px;line-height:20px;color:var(--text-primary)}.callout .ct b{font-weight:650}.who-strip{display:flex;align-items:center;gap:var(--s3);margin-bottom:var(--s5);flex-wrap:wrap}.stack{display:flex;flex-direction:column}.row{display:flex;align-items:center}.wrap{flex-wrap:wrap}.gap1{gap:var(--s1)}.gap2{gap:var(--s2)}.gap3{gap:var(--s3)}.gap4{gap:var(--s4)}.gap5{gap:var(--s5)}.gap6{gap:var(--s6)}.mt2{margin-top:var(--s2)}.mt3{margin-top:var(--s3)}.mt4{margin-top:var(--s4)}.mt5{margin-top:var(--s5)}.mt6{margin-top:var(--s6)}.mt7{margin-top:var(--s7)}.grow{flex:1}.center{align-items:center}.between{justify-content:space-between}.hidden{display:none}@keyframes slideIn{0%{opacity:0;transform:translate(16px)}to{opacity:1;transform:none}}@keyframes fadeUp{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}.anim-slide{animation:slideIn .24s var(--ease)}.anim-fade{animation:fadeUp .3s var(--ease)}@media (prefers-reduced-motion: reduce){*{animation-duration:.01ms!important;transition-duration:.01ms!important}}@media (max-width: 900px){.shell{grid-template-columns:1fr}.rail{display:none}.select-grid{grid-template-columns:1fr}.content{padding:var(--s5) var(--s4)}}