:root{--paper:#eef0eb;--ink:#24342d;--teal:#009b80;--teal-bright:#00b293;--quiet:#8a978c;--line:#cdd5cb;--mono:Consolas,"Liberation Mono",monospace}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font-family:Arial,Helvetica,sans-serif;-webkit-font-smoothing:antialiased}button,a{touch-action:manipulation;-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;border-radius:0;cursor:pointer}button:disabled{cursor:default}button:focus-visible,a:focus-visible{outline:2px solid var(--teal);outline-offset:4px}svg{width:23px;height:23px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linejoin:miter;stroke-linecap:square}.sprite{position:absolute;width:0;height:0;overflow:hidden}.shell{max-width:1240px;margin:auto;padding:0 52px}header{height:100px;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--line);gap:20px}.brand{display:flex;align-items:center;gap:12px;color:var(--ink);text-decoration:none;font-weight:800;letter-spacing:-1px;font-size:27px}.brand-mark{width:30px;height:30px;stroke:#a7b6a7;stroke-width:2.4}.brand-mark .accent{stroke:var(--teal)}.brand-mark rect{stroke:var(--teal);fill:var(--teal)}.header-note{font:8px var(--mono);letter-spacing:1.6px;color:var(--quiet)}nav{display:flex;gap:7px}.icon{width:42px;height:42px;display:inline-grid;place-items:center;border:1px solid var(--line);background:transparent;padding:0;transition:color .12s linear,background .12s linear,border-color .12s linear}.icon:hover{border-color:var(--ink);color:var(--teal)}.icon:disabled{opacity:.4}.icon svg{width:21px;height:21px}.language{font:700 10px var(--mono);letter-spacing:.5px}.intro{margin:36px 0 30px;text-align:center}.eyebrow{display:flex;align-items:center;justify-content:center;gap:8px;font:8px var(--mono);letter-spacing:1.6px;color:var(--quiet)}.status-dot{height:5px;width:5px;background:var(--teal)}.intro h1{font-size:42px;font-weight:500;letter-spacing:-1.9px;margin:16px 0 10px;line-height:1.1}.intro h1 em{font-family:Georgia,"Times New Roman",serif;font-weight:400;color:var(--teal)}.intro>p{font-size:12px;color:var(--quiet);line-height:1.5;margin:0}.play-area{display:grid;grid-template-columns:1fr minmax(320px,470px) 1fr;column-gap:60px;align-items:center}.game{width:100%;min-width:0}.game-toolbar{display:flex;justify-content:space-between;align-items:center;gap:15px;margin-bottom:24px}.mode-switch,.sizes{display:flex}.mode-switch button{height:35px;display:flex;align-items:center;justify-content:center;gap:8px;font:10px var(--mono);border:1px solid var(--line);background:transparent;padding:0 12px;color:var(--quiet);transition:background .12s linear,color .12s linear}.mode-switch button+button{border-left:0;min-width:43px;padding:0 10px}.mode-switch svg{width:18px;height:18px}.mode-switch button.active{background:var(--ink);color:var(--paper);border-color:var(--ink)}.sizes button{height:31px;width:31px;position:relative;font:10px var(--mono);background:transparent;border:0;color:#a8b2a4}.sizes button:after{content:"";height:2px;left:8px;right:8px;bottom:0;background:transparent;position:absolute}.sizes button.active{color:var(--ink)}.sizes button.active:after{background:var(--teal)}.sizes.locked button:not(.active){opacity:.3}.readouts{display:flex;justify-content:space-between;align-items:center;margin:0 0 14px;font:12px var(--mono)}.connection{display:flex;align-items:center;gap:8px;color:var(--quiet)}.connection strong{font-weight:400;color:var(--teal);font-size:17px}.readout-divider{color:#b4beb0}.live-dot{width:5px;height:5px;background:var(--teal);margin-right:3px}.micro{font:8px var(--mono);letter-spacing:1.1px;color:var(--quiet)}.connection .micro{margin-left:3px;font-size:7px}.counters{display:flex;align-items:center;gap:18px}.clock-counter{display:flex;gap:6px;align-items:center;font:10px var(--mono);color:var(--quiet)}.clock-counter svg{width:13px;height:13px;stroke-width:1.4}.moves-counter{display:flex;gap:7px;align-items:center}.moves-counter strong{font-size:17px;font-weight:400;min-width:21px;font-variant-numeric:tabular-nums}.moves-counter .micro{font-size:7px}.board-wrap{position:relative;padding:0}.board{display:grid;grid-template-columns:repeat(var(--size,5),1fr);aspect-ratio:1;border:1px solid #a5b4a2;background:#aebcaa;gap:1px;isolation:isolate;user-select:none;-webkit-user-select:none;touch-action:manipulation}.tile{position:relative;display:block;width:100%;aspect-ratio:1;min-width:0;border:0;padding:0;background:#e4e9df;color:#b1bda9;outline-offset:-4px!important;overflow:hidden;transition:background .16s linear,color .16s linear}.tile:after{content:"";position:absolute;width:3px;height:3px;left:6px;top:6px;background:#c4cebc;opacity:.7;pointer-events:none}.tile:hover{background:#dae3d3}.tile.powered{background:#dfefe4;color:var(--teal)}.tile.powered:after{background:#78c3a5}.tile>svg{width:100%;height:100%;position:absolute;inset:0;stroke:none;overflow:visible;pointer-events:none}.tile .turn{transform-origin:50px 50px;transition:transform .14s linear}.pipe{fill:none;stroke:currentColor;stroke-width:6;stroke-linecap:butt;stroke-linejoin:miter}.flow{fill:none;stroke:#e9fff6;stroke-width:1.6;stroke-dasharray:2 19;opacity:0;stroke-linecap:butt;animation:flow 2s linear infinite}.powered .flow{opacity:.8}.tile .center-point{fill:#e4e9df;stroke:currentColor;stroke-width:2.2}.powered .center-point{fill:#dfefe4}.tile .source-mark{fill:var(--teal);stroke:var(--paper);stroke-width:2}.tile .source-shell{fill:none;stroke:var(--teal);stroke-width:1;stroke-dasharray:3 3}.tile .junction{fill:currentColor}.tile:focus-visible{outline:2px solid #006855;z-index:2}.tile.hinted{outline:3px solid var(--ink);outline-offset:-6px!important;z-index:1}.board.solved .tile{background:#d5eddf}.board.solved .source-shell{stroke-dasharray:none}.board-coordinate{position:absolute;font:7px var(--mono);letter-spacing:1px;color:#94a08e;pointer-events:none}.coordinate-tl{left:-22px;top:6px;writing-mode:vertical-rl}.coordinate-br{right:-21px;bottom:5px;writing-mode:vertical-rl}.below-board{display:flex;justify-content:space-between;margin-top:12px;gap:10px}.below-board .micro{font-size:7px;letter-spacing:1px}.game-controls{display:flex;gap:8px;justify-content:center;margin-top:24px}.game-controls .icon{width:44px;height:44px}.hint-button{display:flex;gap:10px;align-items:center;justify-content:center;height:44px;min-width:95px;background:var(--ink);border:1px solid var(--ink);color:var(--paper);padding:0 14px;transition:background .12s linear}.hint-button:hover{background:var(--teal)}.hint-button:disabled{background:transparent;border-color:var(--line);color:#a3afa0}.hint-button svg{width:19px;height:19px;stroke-width:1.5}.hint-button>span{display:flex;gap:4px}.hint-button i{height:4px;width:4px;background:var(--teal-bright)}.hint-button i.used{background:#68746a}.next svg{color:var(--teal)}.left-rail{align-self:center;position:relative;padding-left:12px}.rail-index{font:9px var(--mono);letter-spacing:1.8px;color:#a2af9d;margin-bottom:24px}.mini-circuit{max-width:140px;width:90%;opacity:.6}.mini-circuit svg{height:auto;width:100%;stroke:#bdc9b5;stroke-width:1.2}.mini-circuit .mini-live{stroke:#72bfa0;stroke-width:2}.mini-circuit rect{fill:var(--teal);stroke:none}.mini-circuit circle{fill:var(--paper);stroke:#a9b99f;stroke-width:1.5}.rail-caption{font:9px var(--mono);line-height:1.8;letter-spacing:1.7px;color:#8a9c82;margin-top:27px}.right-rail{padding-left:5px}.legend{display:grid;gap:18px;margin-bottom:45px}.legend>div{display:flex;align-items:center;gap:12px;font:8px var(--mono);letter-spacing:1px;color:#8a9b82;white-space:nowrap}.legend-source{width:10px;height:10px;background:var(--teal);outline:1px solid var(--teal);outline-offset:3px}.legend-terminal{width:12px;height:12px;border:2px solid #a5b39d;border-radius:50%}.rail-tip .tip-number{font-size:35px;font-weight:200;color:var(--teal)}.rail-tip p{font-size:11px;line-height:1.9;color:#8c9a85;margin:8px 0 34px}.rail-footer{font:8px var(--mono);letter-spacing:.7px;line-height:1.8;color:#a4b09e}.mobile-rule{display:none}footer{display:flex;align-items:center;justify-content:space-between;margin-top:42px;height:67px;border-top:1px solid var(--line);font:8px var(--mono);letter-spacing:.8px;color:var(--quiet)}footer b{font-weight:400;color:#b2bdac;margin:0 13px}footer button{font:8px var(--mono);color:var(--quiet);border:0;background:transparent;padding:8px 0}footer button:hover{color:var(--teal)}dialog{position:fixed;padding:35px 28px 27px;width:calc(100% - 40px);max-width:374px;border:1px solid var(--ink);border-radius:0;color:var(--ink);background:var(--paper);max-height:calc(100dvh - 40px);overflow:auto;box-shadow:7px 7px 0 #24342d12}dialog::backdrop{background:#eef0ebbb;backdrop-filter:blur(3px)}.modal-cap{position:absolute;top:0;left:0;width:48px;height:4px;background:var(--teal)}.modal-close{position:absolute;right:10px;top:10px;border:0;width:32px;height:32px}.modal-close svg{width:18px;height:18px}.modal-kicker{font:9px var(--mono);letter-spacing:1.5px;color:var(--teal)}dialog h2{font-size:31px;font-weight:500;letter-spacing:-1px;line-height:1.1;margin:13px 0 23px}dialog p{font-size:13px;line-height:1.7;color:#7a8974}dialog .fine{font:9px var(--mono);line-height:1.8;border-top:1px solid var(--line);padding-top:15px;margin-top:22px}.result-numbers{display:flex;gap:35px;margin-bottom:22px}.result-numbers strong{font:400 35px var(--mono);letter-spacing:-1px}.result-numbers span{display:block;font:8px var(--mono);letter-spacing:1px;color:var(--quiet);margin-top:7px}.result-badge{font:10px var(--mono);color:var(--teal);margin-bottom:25px}.modal-actions{display:flex;gap:8px}.primary{display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:48px;padding:0 17px;border:1px solid var(--ink);background:var(--ink);color:var(--paper);font-size:13px;flex:1}.primary svg{width:22px;height:22px;color:var(--teal-bright)}.primary:hover{background:var(--teal)}.primary:hover svg{color:var(--paper)}.modal-actions>.icon{height:48px;width:48px;flex-shrink:0}.records-list{padding:0;margin:0 0 23px;list-style:none}.records-list li{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--line);padding:12px 0;font:10px var(--mono);gap:10px}.records-list strong{font-weight:400;color:var(--teal)}.help-legend{display:flex;align-items:center;gap:18px;font-size:11px;color:var(--quiet);margin:22px 0}.help-legend>span{display:flex;align-items:center;gap:9px}.toast{position:fixed;left:50%;bottom:25px;transform:translateX(-50%);font:11px var(--mono);line-height:1.5;max-width:90%;width:max-content;background:var(--ink);color:var(--paper);padding:12px 18px;opacity:0;pointer-events:none;transition:opacity .12s linear;z-index:20}.toast.visible{opacity:1}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.sleeping .flow{animation-play-state:paused}@keyframes flow{to{stroke-dashoffset:-42}}
@media(min-width:1500px){.shell{padding-top:18px}.intro{margin-top:42px;margin-bottom:38px}.play-area{grid-template-columns:1fr minmax(320px,500px) 1fr}.game-controls{margin-top:28px}footer{margin-top:49px}}
@media(max-width:1000px){.shell{padding:0 32px}.play-area{column-gap:32px;grid-template-columns:1fr minmax(320px,440px) 1fr}.header-note{font-size:7px;letter-spacing:1px}.rail-caption{font-size:8px;letter-spacing:1px}.legend>div{font-size:7px;gap:8px}.right-rail{padding-left:0}.rail-tip p{font-size:10px}.rail-footer{font-size:7px}.intro h1{font-size:38px}}
@media(max-width:800px){.left-rail,.right-rail{display:none}.play-area{display:block;max-width:470px;margin:auto}.shell{padding:0 32px}.header-note{display:none}.intro{margin:30px 0 28px}.intro h1{font-size:37px}.intro p{font-size:11px}.game-toolbar{margin-bottom:23px}.mobile-rule{display:block;text-align:center;font:8px var(--mono);letter-spacing:.2px;color:#98a592;margin-top:20px}footer{margin-top:28px}}
@media(max-width:500px){.shell{padding:0 21px}header{height:82px;gap:10px}.brand{font-size:24px;gap:10px;letter-spacing:-1px}.brand-mark{width:25px;height:25px}nav{gap:5px}nav .icon{width:35px;height:36px}nav .icon svg{width:18px;height:18px}.intro{margin:26px 0 24px}.eyebrow{font-size:6px;letter-spacing:1.3px}.intro h1{font-size:31px;letter-spacing:-1.5px;margin:14px 0 9px}.intro p{font-size:10px}.game-toolbar{margin-bottom:22px}.mode-switch button{font-size:9px;height:33px;padding:0 10px;gap:7px}.mode-switch button+button{min-width:39px}.readouts{margin-bottom:12px}.connection{gap:7px}.connection strong,.moves-counter strong{font-size:16px}.connection .micro,.moves-counter .micro{font-size:6px}.clock-counter{font-size:9px;gap:5px}.counters{gap:14px}.clock-counter svg{width:12px;height:12px}.board-coordinate{display:none}.below-board{margin-top:11px}.below-board .micro{font-size:6px;letter-spacing:.7px}.game-controls{margin-top:22px}.mobile-rule{font-size:7px;letter-spacing:0;line-height:1.6;margin-top:17px}footer{font-size:7px;margin-top:28px;align-items:flex-start;justify-content:center;flex-direction:column;gap:13px;height:82px}footer button{font-size:8px;padding:0}footer b{margin:0 9px}.pipe{stroke-width:6.5}.tile:after{width:2px;height:2px;left:5px;top:5px}}
@media(max-width:350px){.shell{padding:0 16px}.brand{font-size:22px;gap:8px}.brand-mark{width:23px;height:23px}nav{gap:4px}nav .icon{width:33px;height:35px}.intro h1{font-size:28px}.intro .eyebrow{font-size:5px;letter-spacing:1px}.intro{margin-top:23px}.readouts .micro{font-size:5px}.counters{gap:10px}.connection{gap:5px}.mode-switch button{padding:0 8px}.sizes button{width:28px}.game-toolbar{gap:8px}.clock-counter{font-size:8px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}dialog::backdrop{backdrop-filter:none}}