:root{--bg: #f4efe6;--bg-alt: #fff9f0;--panel: #fffdf8;--text: #1f1b16;--muted: #4c4337;--line: #d4c8b6;--accent: #0f6a55;--accent-2: #b3432f;--focus: #005fcc;--ok: #165b33;--bad: #8f1d1d}:root[data-theme=dark]{--bg: #111417;--bg-alt: #1a2026;--panel: #202731;--text: #f1f4f8;--muted: #ccd3dc;--line: #324052;--accent: #5fe0b5;--accent-2: #ff9878;--focus: #8cc2ff;--ok: #8af0b8;--bad: #ff9b9b}*{box-sizing:border-box}html,body{margin:0;padding:0;background:radial-gradient(circle at 20% 0%,var(--bg-alt),var(--bg));color:var(--text);font-family:Atkinson Hyperlegible,Segoe UI,sans-serif;font-size:16px;line-height:1.5}body{min-height:100vh}.skip-link{position:absolute;left:.5rem;top:-4rem;background:var(--panel);color:var(--text);padding:.65rem .9rem;border-radius:.5rem;border:2px solid var(--focus);z-index:1000}.skip-link:focus{top:.5rem}.page{max-width:1200px;margin:0 auto;padding:.75rem}.hero,.panel,.footer{background:var(--panel);border:1px solid var(--line);border-radius:1rem;box-shadow:0 8px 30px #0000000f}.hero{padding:1rem}.header-row{display:flex;gap:.5rem;align-items:center;justify-content:space-between}h1,h2,h3{line-height:1.2}.subtitle{max-width:72ch}.warning{border-left:5px solid var(--accent-2);padding:.75rem;background:color-mix(in srgb,var(--accent-2) 11%,transparent);border-radius:.5rem}.panels{display:grid;gap:.9rem;margin-top:.9rem}.panel{padding:1rem}.chip-row,.callouts,.links,.controls-row{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center}.chip{display:inline-flex;align-items:center;border:1px solid var(--line);background:color-mix(in srgb,var(--accent) 16%,transparent);color:var(--text);border-radius:999px;padding:.35rem .7rem;font-size:.9rem}.chip.status{background:color-mix(in srgb,var(--accent-2) 18%,transparent)}.btn,select,textarea,.badge{min-height:44px}.btn,select{border-radius:.6rem;border:1px solid var(--line);padding:.55rem .9rem;font:inherit;color:var(--text);background:var(--panel)}.btn{cursor:pointer;background:linear-gradient(130deg,color-mix(in srgb,var(--accent) 20%,var(--panel)),var(--panel))}.btn.secondary{background:linear-gradient(130deg,color-mix(in srgb,var(--accent-2) 20%,var(--panel)),var(--panel))}.btn:disabled{opacity:.6;cursor:not-allowed}a{color:var(--accent)}.badge{text-decoration:none;border-radius:999px;border:1px solid var(--line);padding:.55rem .9rem;display:inline-flex;align-items:center;background:color-mix(in srgb,var(--accent) 12%,transparent)}.table-wrap{width:100%;overflow-x:auto;border:1px solid var(--line);border-radius:.75rem}table{width:100%;border-collapse:collapse;min-width:980px}th,td{border-bottom:1px solid var(--line);padding:.55rem;text-align:left;font-size:.95rem}caption{text-align:left;padding:.55rem;font-weight:600}.output{margin-top:.7rem;border:1px solid var(--line);border-radius:.65rem;padding:.75rem;background:color-mix(in srgb,var(--bg-alt) 65%,var(--panel))}.hex{display:block;max-width:100%;overflow-x:auto;font-family:JetBrains Mono,Cascadia Mono,monospace;font-size:.9rem;word-break:break-all}.viz-grid{display:grid;gap:.65rem}.mini-card{border:1px solid var(--line);border-radius:.7rem;padding:.75rem;background:color-mix(in srgb,var(--accent) 8%,transparent)}.qc-schematic{border:1px dashed var(--line);border-radius:.65rem;padding:.75rem;overflow-x:auto}pre{margin:0;white-space:pre-wrap}.bars{margin-top:.8rem;display:grid;gap:.45rem}.bar-row{display:grid;grid-template-columns:minmax(90px,170px) 1fr auto;align-items:center;gap:.55rem}.bar-track{border:1px solid var(--line);background:color-mix(in srgb,var(--panel) 60%,var(--bg-alt));border-radius:999px;height:20px}.bar-fill{height:100%;border-radius:999px;background:linear-gradient(90deg,var(--accent),var(--accent-2))}.small{font-size:.92rem}.small.strong{font-weight:600}.error{color:var(--bad);font-weight:700}.footer{margin-top:1rem;padding:1rem;display:grid;gap:.5rem}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}:focus-visible{outline:3px solid var(--focus);outline-offset:2px}@media (min-width: 760px){.page,.hero,.panel,.footer{padding:1.2rem}.viz-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}@media (prefers-reduced-motion: no-preference){.hero,.panel{animation:fade-in .5s ease both}.panel:nth-child(2){animation-delay:80ms}.panel:nth-child(3){animation-delay:.13s}.panel:nth-child(4){animation-delay:.18s}.panel:nth-child(5){animation-delay:.22s}}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation:none!important;transition:none!important}}@keyframes fade-in{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}
