@import "https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@400;500;600&family=IBM+Plex+Sans:wght@400;500;600;700&display=swap";html,body,#root{min-height:100%}body{text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:#f7f4ec;min-height:100vh;margin:0;font-family:IBM Plex Sans,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}a{color:inherit}:root{--bg:#f7f5ef;--panel:#fffdfa;--ink:#182132;--muted:#697386;--line:#d7d1c4;--line-strong:#c3baa6;--soft:#f4f0e6;--accent:#182132;--accent-soft:#f1ede3;--warn-bg:#fff8e6;--warn-line:#ead8a0;--space-1:.5rem;--space-2:.75rem;--space-3:1rem;--space-4:1.5rem;--space-5:2rem;--radius:18px}*{box-sizing:border-box}body{background:var(--bg);min-height:100vh;color:var(--ink);margin:0}#root{max-width:1040px;margin:0 auto;padding:clamp(1.25rem,3vw,2rem)}.page{gap:var(--space-5);display:grid}.page-header{gap:var(--space-2);padding-bottom:var(--space-3);border-bottom:1px solid var(--line);display:grid}.page-header h1{color:var(--ink);margin:0;font-size:clamp(2rem,5vw,3.2rem);line-height:1.02}.page-header p,.stage-card-head p,.copy-block p,.muted-copy,.flow-arrow{color:var(--muted);margin:0;line-height:1.45}.section{gap:var(--space-3);display:grid}.section-head{align-items:center;display:flex}.eyebrow,.label,.code-tag,.diagram-label{font-family:IBM Plex Mono,monospace}.eyebrow,.label{color:var(--muted);letter-spacing:.11em;text-transform:uppercase;font-size:.78rem}.flow-overview{justify-items:center;gap:var(--space-1);padding:var(--space-4);background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);display:grid}.flow-step{justify-items:center;gap:var(--space-1);width:100%;display:grid}.flow-box{text-align:center;border:1px solid var(--line);background:var(--panel);border-radius:14px;width:min(100%,520px);padding:.9rem 1rem;font-weight:700}.flow-arrow{font-size:1.4rem}.stage-grid{gap:var(--space-3);display:grid}.stage-sequence-item{gap:var(--space-2);display:grid}.stage-sequence-arrow{color:var(--muted);justify-items:center;gap:.2rem;padding:.2rem 0 .5rem;display:grid}.stage-sequence-line{background:var(--line-strong);width:1px;height:1.3rem}.stage-sequence-arrow span{letter-spacing:.06em;text-transform:uppercase;text-align:center;font-family:IBM Plex Mono,monospace;font-size:.72rem}.stage-sequence-glyph{font-size:1.15rem;line-height:1}.stage-card{border:1px solid var(--line);border-radius:var(--radius);background:var(--panel);padding:var(--space-4)}.stage-card-head{margin-bottom:var(--space-3);gap:.45rem;display:grid}.stage-card-head h3{color:var(--ink);margin:0;font-size:1.2rem;line-height:1.2}.stage-card-title-row{flex-wrap:wrap;align-items:center;gap:.65rem;display:flex}.stage-count-chip{border:1px solid var(--line);background:var(--soft);color:var(--muted);letter-spacing:.04em;text-transform:uppercase;border-radius:999px;align-items:center;padding:.22rem .5rem;font-family:IBM Plex Mono,monospace;font-size:.7rem;display:inline-flex}.stage-card-body{gap:var(--space-4);grid-template-columns:minmax(240px,280px) minmax(0,1fr);align-items:start;display:grid}.diagram-svg{width:100%;height:auto;display:block}.tank-shape{fill:color-mix(in srgb, var(--tank-stroke) 12%, white);stroke:var(--tank-stroke);stroke-width:3px}.tank-liquid{fill:var(--tank-fill)}.diagram-line{stroke:#a6acb8;stroke-width:2px}.diagram-line.thick{stroke-width:4px}.diagram-node{fill:#fff;stroke:#a6acb8;stroke-width:2px}.diagram-node.active{fill:#20bf6b;stroke:#2d6a4f}.diagram-node.muted{fill:#d7dee7}.diagram-label{fill:var(--ink);font-size:.74rem}.diagram-label.dark{font-weight:700}.diagram-label.muted{fill:var(--muted)}.atu-box{fill:#f3ebff;stroke:#7c3aed;stroke-width:3px}.blower-ring{fill:none;stroke:#7c3aed;stroke-width:4px}.chlorinator-box{fill:#eaf1f8;stroke:#264d74;stroke-width:3px}.disposal-box{fill:#eef8ef;stroke:#2d6a4f;stroke-width:3px}.field-line{stroke:#2d6a4f;stroke-width:3px}.stage-card-copy{gap:var(--space-3);display:grid}.copy-block{gap:.45rem;display:grid}.tag-list{flex-wrap:wrap;gap:.45rem;display:flex}.code-tag{color:var(--ink);background:#f3efe5;border-radius:6px;flex-wrap:wrap;align-items:center;gap:.25rem;padding:.3rem .45rem;font-size:.76rem;display:inline-flex}.code-tag-detail{color:var(--muted)}.bullet-list{gap:.35rem;margin:0;padding-left:1.1rem;display:grid}.bullet-list li{line-height:1.45}.inline-note,.note-box{border:1px solid var(--warn-line);background:var(--warn-bg);border-radius:12px;padding:.9rem 1rem;line-height:1.5}.logic-table{border:1px solid var(--line);border-radius:var(--radius);background:var(--panel);overflow:hidden}.logic-row{grid-template-columns:1.05fr 1.1fr 1.1fr;display:grid}.logic-row>div{border-top:1px solid var(--line);padding:.9rem 1rem}.logic-row>div+div{border-left:1px solid var(--line)}.logic-head{background:var(--accent-soft);color:var(--ink);font-weight:700}.logic-head>div{border-top:0}.pinout-stack{gap:var(--space-3);display:grid}.pinout-block{gap:.7rem;display:grid}.pinout-group-head{align-items:center;display:flex}.pinout-scroll{border:1px solid var(--line);border-radius:var(--radius);background:var(--panel);overflow-x:auto}.pinout-table{border-collapse:collapse;width:100%;min-width:760px;font-size:.92rem}.pinout-table th,.pinout-table td{text-align:left;border-top:1px solid var(--line);vertical-align:top;padding:.78rem .9rem}.pinout-table th{background:var(--accent-soft);color:var(--ink);letter-spacing:.08em;text-transform:uppercase;border-top:0;font-size:.78rem}.pinout-id{font-family:IBM Plex Mono,monospace;font-size:.82rem}@media (width<=760px){.stage-card-body,.logic-row{grid-template-columns:1fr}.logic-row>div+div{border-left:0}}