:root{color-scheme:light;--bg:#f6f8fa;--ink:#203246;--muted:#52677d;--line:#ccd7e0;--accent:#00796b;--soft:#e2f1ed;--second:#93620f;--paper:#fff}
:root.dark{color-scheme:dark;--bg:#18212c;--ink:#e6edf4;--muted:#a4b6c8;--line:#425267;--accent:#70d4bd;--soft:#213f3c;--second:#edbc6a;--paper:#202d3c}
*{box-sizing:border-box}body{margin:0;background:transparent;color:var(--ink);font:15px/1.75 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}main{padding:26px 28px;background:var(--bg);border-radius:14px;min-width:0}h1{font-size:23px;line-height:1.45;margin:7px 0 14px;letter-spacing:-.03em}p{margin:10px 0 16px}.eyebrow{color:var(--accent);font-size:12px;letter-spacing:.11em;margin:0}.intro,.note{color:var(--muted)}.controls{display:grid;grid-template-columns:1fr 1fr;gap:14px 24px;margin:22px 0}label{display:block;font-weight:600}label output{float:right;color:var(--accent);font-variant-numeric:tabular-nums}input,select,button{font:inherit;color:inherit}input[type=range]{display:block;width:100%;accent-color:var(--accent);min-height:34px;margin:4px 0}select{width:100%;min-height:44px;padding:8px;background:var(--paper);border:1px solid var(--line);border-radius:6px;margin-top:6px}button{min-height:44px;padding:8px 16px;border:1px solid var(--line);border-radius:6px;background:var(--paper);cursor:pointer}button.primary{background:var(--accent);color:var(--bg);border-color:var(--accent)}button:disabled{opacity:.45;cursor:default}:focus-visible{outline:3px solid var(--accent);outline-offset:3px}.toolbar{display:flex;flex-wrap:wrap;gap:10px;margin:18px 0}.table-scroll{overflow-x:auto;max-width:100%}table{width:100%;border-collapse:collapse;font-size:14px;font-variant-numeric:tabular-nums}th,td{padding:10px;text-align:left;border-bottom:1px solid var(--line);white-space:nowrap}th{color:var(--muted);font-weight:500}tr.active{background:var(--soft)}.stats{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin:22px 0}.stats>div{padding-left:14px;border-left:3px solid var(--line)}dt{font-size:13px;color:var(--muted)}dd{margin:3px 0 0;font-size:21px;font-weight:650;line-height:1.5;font-variant-numeric:tabular-nums}.status{padding:13px 16px;background:var(--soft);border-radius:6px;margin:16px 0}.saved{color:var(--muted);font-size:13px;overflow-wrap:anywhere;min-height:24px}details{border:0;margin:12px 0}summary{min-height:44px;padding:9px 0;cursor:pointer;font-weight:600}details p{margin:6px 0 14px;color:var(--muted)}.chart{display:block;width:100%;height:285px;overflow:visible;margin:20px 0 8px}.chart text{fill:var(--muted);font:12px system-ui,sans-serif}.chart .axis,.chart .grid{stroke:var(--line);fill:none}.chart .grid{stroke-dasharray:2 5}.roof{stroke:var(--accent);stroke-width:3;fill:none}.memory-guide{stroke:var(--second);stroke-dasharray:4 5;fill:none}.compute-guide{stroke:var(--muted);stroke-dasharray:5 5;fill:none}.point{fill:var(--accent);stroke:var(--bg);stroke-width:2}.saved-point{fill:none;stroke:var(--second);stroke-width:2}.legend{display:flex;flex-wrap:wrap;gap:6px 18px;font-size:13px;color:var(--muted)}.legend span::before{content:'';display:inline-block;width:20px;border-top:3px solid var(--accent);vertical-align:middle;margin-right:6px}.legend .dashed::before{border-color:var(--second);border-top-style:dashed}.legend .compute::before{border-color:var(--muted);border-top-style:dashed}.flow{display:grid;grid-template-columns:1fr auto 1fr;gap:12px;align-items:center;margin:20px 0}.flow .node{text-align:center;padding:16px 8px;background:var(--paper);border:1px solid var(--line);border-radius:6px}.flow .arrow{color:var(--accent);font-size:26px}.stages{list-style:none;margin:0;padding:0;display:grid;gap:8px}.stages li{padding:9px 12px;border-left:3px solid var(--line);color:var(--muted)}.stages li.done{background:var(--soft);border-color:var(--accent);color:var(--ink)}.stages li.current{outline:1px solid var(--accent)}.meter{height:14px;background:var(--line);border-radius:8px;overflow:hidden}.meter span{display:block;height:100%;background:var(--accent);width:0}.scale{font-size:12px;color:var(--muted)}code{font-family:ui-monospace,SFMono-Regular,monospace;background:var(--paper);padding:3px 6px} .full{grid-column:1/-1}
@media(max-width:540px){main{padding:22px 16px}h1{font-size:21px}.controls{grid-template-columns:1fr;gap:12px}.stats{grid-template-columns:1fr;gap:14px}dd{font-size:20px}.chart{height:285px}th,td{padding:9px 8px}.flow{gap:8px}.flow .node{font-size:13px}.toolbar button{flex:1 1 auto}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;animation:none!important;transition:none!important}}
