:root{--bg: #ffffff;--fg: #0f172a;--muted: #64748b;--line: #e5edf5;--shadow: 0 20px 50px rgba(15, 23, 42, .06)}*{box-sizing:border-box;margin:0;padding:0;-webkit-font-smoothing:antialiased}body{background:var(--bg);color:var(--fg);font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Helvetica,Arial,sans-serif;overflow-x:hidden;overflow-y:auto;min-height:100vh}body.capture-body,body.live-body{min-height:100vh}button,select{font:inherit}button{border:none;background:transparent;cursor:pointer}.canvas-root{width:100%;min-height:100vh}.canvas{min-height:100vh;width:100%;padding:32px 0 72px;background:radial-gradient(circle at top center,rgba(224,242,254,.45),transparent 28%),#fff}.flow-canvas{display:grid;gap:18px;align-content:start}.top-nav{position:sticky;top:0;z-index:1000;display:flex;align-items:center;justify-content:space-between;gap:18px;padding:18px 28px;background:#ffffffe0;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);border-bottom:1px solid rgba(229,237,245,.9)}.logo{font-family:Comic Sans MS,Trebuchet MS,cursive;font-size:28px;font-weight:700;letter-spacing:-1px}.logo-button{color:#0f172a;background:transparent;padding:0;text-align:left}.logo-button:hover{transform:none}.nav-links{display:flex;gap:10px;flex-wrap:wrap;justify-content:center}.nav-links-static{flex:1}.nav-chip{padding:8px 12px;border-radius:999px;background:#f8fafc;color:#64748b;font-size:12px;font-weight:700}.nav-stage{padding:10px 14px;border-radius:999px;background:#111;color:#fff;font-size:13px;font-weight:700}.panel{background:#fff;border:1px solid var(--line);border-radius:28px;padding:24px;box-shadow:var(--shadow)}.panel-soft{background:linear-gradient(180deg,#fffffffa,#f8fafcfa)}.panel-header{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:18px}.panel-header h2{font-size:16px;font-weight:800}.panel-header span{color:var(--muted);font-size:12px}.eyebrow{display:inline-flex;width:fit-content;padding:8px 12px;border-radius:999px;background:#eef6ff;color:#2563eb;font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.05em;margin-bottom:16px}.primary-btn,.secondary-btn,.metric-summary-card,.tab-strip button{transition:transform .12s ease,box-shadow .12s ease,background .12s ease}.primary-btn:hover,.secondary-btn:hover,.metric-summary-card:hover,.tab-strip button:hover{transform:translateY(-1px)}.primary-btn,.secondary-btn{display:inline-flex;align-items:center;justify-content:center;padding:14px 20px;border-radius:999px;font-weight:800}.primary-btn{background:#111;color:#fff}.secondary-btn{background:#f8fafc;color:#111;border:1px solid var(--line)}.secondary-note{color:var(--muted);font-size:13px}.capture-panel,.start-shell,.journey-shell,.tab-strip{width:min(1120px,calc(100vw - 40px));margin:0 auto}.capture-panel p{color:#475569;line-height:1.6}.start-shell,.journey-shell{display:grid;gap:18px}.centered-shell{justify-items:center}.centered-panel{width:min(920px,100%);text-align:center}.section-intro{text-align:left}.start-copy h1,.section-intro h1{font-family:Comic Sans MS,Trebuchet MS,cursive;font-size:clamp(44px,7vw,72px);line-height:.94;margin-bottom:18px}.start-copy p,.section-intro p{max-width:52rem;color:#334155;font-size:18px;line-height:1.7}.start-copy p{margin:0 auto}.section-intro p{margin:0}.start-actions,.config-actions{display:flex;flex-wrap:wrap;gap:14px;align-items:center;margin-top:22px}.centered-actions{justify-content:center}.config-actions-inline{margin-top:18px}.feature-card-grid{display:grid;gap:14px}.feature-card-grid-wide{width:100%;grid-template-columns:repeat(3,minmax(0,1fr))}.feature-card{min-height:180px;display:grid;align-content:start;gap:12px;padding:18px;border-radius:24px;border:1px solid rgba(255,255,255,.8)}.feature-tag{display:inline-flex;width:fit-content;padding:6px 10px;border-radius:999px;background:#ffffffbf;font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.05em}.feature-card strong{font-size:18px}.feature-card p{color:#475569;line-height:1.55}.feature-stat{margin-top:auto;font-size:22px;font-weight:800}.controls-panel-wide{width:100%}.controls-grid{display:grid;gap:14px}.controls-grid-three{grid-template-columns:repeat(3,minmax(0,1fr))}.controls-grid label{display:grid;gap:8px;color:var(--muted);font-size:12px;font-weight:800}.controls-grid select{padding:14px;border-radius:14px;border:1px solid var(--line);background:#fff}.controls-grid input{padding:14px;border-radius:14px;border:1px solid var(--line);background:#fff;color:var(--fg)}.reset-btn{background:#111;color:#fff;border-radius:999px;padding:10px 16px}.config-hint-grid,.source-summary-grid,.inference-grid,.metric-summary-grid,.baseline-grid,.tree-grid,.split-grid,.content-grid{display:grid;gap:16px}.config-hint-grid,.source-summary-grid,.metric-summary-grid,.baseline-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.config-hint-grid,.source-summary-grid,.metric-summary-grid,.tree-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.split-grid,.content-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.content-grid>.comparison-panel,.run-timeline-panel,.summary-card-wide{grid-column:span 2}.summary-card,.hint-card,.metric-summary-card,.baseline-card,.tree-card,.split-card{border:1px solid var(--line);background:#fafcff;border-radius:22px;padding:16px}.summary-card strong,.hint-card strong,.tree-card strong,.split-card strong,.baseline-card strong{display:block;margin-bottom:10px}.summary-card p,.hint-card p,.split-card p,.baseline-card p{color:#475569;line-height:1.6}.metric-value{font-size:30px;font-weight:800}.metric-value.compact{font-size:22px}.metric-callout-value{font-size:48px;font-weight:900}.metric-summary-card{text-align:left}.metric-summary-card.static{cursor:default}.metric-summary-card.active{background:#111;color:#fff}.metric-summary-card.active p,.metric-summary-card.active strong{color:#fff}.metric-summary-card p{color:var(--muted);line-height:1.5}.metric-diagram{display:grid;gap:18px}.metric-diagram-row{display:grid;gap:12px}.metric-diagram-bars{display:grid;gap:10px}.metric-diagram-bar{display:grid;grid-template-columns:96px 1fr 92px;gap:12px;align-items:center}.metric-diagram-track{height:12px;border-radius:999px;background:#e2e8f0;overflow:hidden}.metric-diagram-fill{height:100%;border-radius:999px}.metric-diagram-bar.muted .metric-diagram-fill{background:#cbd5e1}.metric-diagram-bar.subtle .metric-diagram-fill{background:#94a3b8}.metric-diagram-bar.highlight .metric-diagram-fill{background:#111}.metric-diagram-label{color:#475569;font-size:13px;font-weight:700}.metric-diagram-value{text-align:right;font-size:14px}.metric-diagram-delta{font-weight:900;color:#0f172a}.tab-strip{display:inline-flex;gap:10px;padding:8px;border-radius:999px;background:#fff;border:1px solid var(--line);box-shadow:var(--shadow)}.tab-strip button{padding:12px 18px;border-radius:999px;color:var(--muted);font-weight:800}.tab-strip button.active{background:#111;color:#fff}.run-grid{width:min(980px,100%);margin:0 auto}.run-step-list{display:grid;gap:14px;justify-items:center}.run-step-card{display:grid;grid-template-columns:42px 1fr;gap:16px;width:min(900px,100%);padding:16px;border-radius:22px;border:1px solid var(--line);background:#f8fafc}.run-step-card.active{border-color:#93c5fd;background:#eff6ff}.run-step-card.queued{opacity:.78}.run-step-metrics{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:10px}.run-step-metric{border:1px solid var(--line);border-radius:14px;background:#fff;padding:10px 12px}.run-step-metric span{display:block;color:var(--muted);font-size:11px;margin-bottom:4px;text-transform:uppercase;letter-spacing:.04em}.run-step-metric strong{font-size:18px}.run-step-card.complete{border-color:#bbf7d0;background:#f0fdf4}.run-step-index{width:42px;height:42px;border-radius:50%;background:#fff;display:flex;align-items:center;justify-content:center;font-weight:800}.run-step-topline{display:flex;justify-content:space-between;gap:12px;align-items:baseline;margin-bottom:6px}.run-step-topline strong{font-size:16px}.run-step-topline span{color:var(--muted);font-size:12px;font-weight:800}.run-step-card p{color:#334155;line-height:1.55;margin-bottom:10px}.run-step-card ul{display:grid;gap:8px;padding-left:18px;color:#334155}.tree-badge{display:inline-flex;padding:6px 10px;border-radius:999px;background:#eef2ff;color:#4338ca;font-size:11px;font-weight:800;margin-bottom:12px}.tree-card ul{list-style:none;display:grid;gap:8px}.tree-card li,.split-values span,.baseline-values>div{padding:10px 12px;border:1px solid var(--line);border-radius:14px;background:#fff}.split-values,.baseline-values{display:grid;gap:8px;margin:12px 0}.baseline-values>div span{display:block;color:var(--muted);font-size:12px;margin-bottom:4px}.feature-importance-panel{height:100%;display:flex;flex-direction:column}.feature-bars{flex:1;width:100%;display:flex;flex-direction:column;gap:18px}.feature-bar-row{width:100%;display:flex;align-items:center;gap:18px}.feature-bar-label{width:170px;flex:0 0 170px;color:#1e293b;font-size:22px}.feature-bar-track{flex:1 1 auto;min-width:0;width:100%;background:#edf2f7;border-radius:999px;height:24px;overflow:hidden}.feature-bar-fill{height:100%;background:linear-gradient(90deg,#86efac,#22c55e);border-radius:999px}.km-chart{width:100%;height:220px}.km-figure{margin:0;display:grid;gap:12px}.km-chart-image{width:100%;height:auto;display:block;border-radius:18px;border:1px solid var(--line);background:#fff}.km-line{fill:none;stroke-width:4;stroke-linecap:round}.km-line.low{stroke:#0ea5e9}.km-line.high{stroke:#111}.legend{display:flex;gap:16px;font-size:12px;color:var(--muted);margin-top:10px}.swatch{display:inline-block;width:12px;height:12px;border-radius:50%;margin-right:6px}.swatch.low{background:#0ea5e9}.swatch.high{background:#111}.panel-footnote{margin-top:16px;color:#475569;line-height:1.6}.capture-mode .canvas{padding-top:18px}@media (max-width: 1100px){.feature-card-grid-wide,.controls-grid-three,.config-hint-grid,.source-summary-grid,.metric-summary-grid,.baseline-grid,.tree-grid,.split-grid,.content-grid,.inference-grid{grid-template-columns:1fr}.content-grid>.comparison-panel,.run-timeline-panel,.baseline-card,.summary-card-wide{grid-column:auto}.top-nav{padding:16px 18px;flex-wrap:wrap}.nav-links-static{order:3;width:100%}.canvas{padding-top:18px}.tab-strip{width:calc(100vw - 40px);flex-wrap:wrap}}
