:root{color:#eef4ee;background:#121713;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;font-synthesis:none;text-rendering:optimizeLegibility}*{box-sizing:border-box}body{margin:0;min-width:320px;min-height:100vh;background:linear-gradient(180deg,rgba(18,23,19,.94),rgba(10,12,11,.98)),repeating-linear-gradient(90deg,rgba(255,255,255,.04) 0 1px,transparent 1px 48px),repeating-linear-gradient(0deg,rgba(255,255,255,.035) 0 1px,transparent 1px 48px)}button{font:inherit}.app-shell{width:min(1500px,100%);margin:0 auto;padding:22px}.topbar{display:flex;align-items:end;justify-content:space-between;gap:18px;margin-bottom:18px}.eyebrow{margin:0 0 6px;color:#9db7a6;font-size:.78rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase}h1,h2{margin:0;letter-spacing:0}h1{font-size:clamp(1.7rem,4vw,3.1rem);line-height:1}h2{font-size:.98rem}.period-chip{min-width:210px;border:1px solid rgba(255,255,255,.15);background:rgba(255,255,255,.08);padding:12px 14px}.topbar-controls{display:flex;align-items:stretch;gap:10px}.example-menu{position:relative}.example-button{display:flex;align-items:center;justify-content:center;gap:8px;height:100%;min-height:62px;border:1px solid rgba(255,255,255,.15);background:rgba(255,255,255,.08);color:#eef4ee;cursor:pointer;padding:0 14px}.example-button:hover,.example-button:focus-visible{border-color:#eac15ea6;outline:none}.example-list{position:absolute;top:calc(100% + 8px);right:0;z-index:20;display:grid;width:min(330px,calc(100vw - 36px));border:1px solid rgba(213,222,208,.2);background:rgba(23,29,24,.98);box-shadow:0 18px 42px #0000005c;padding:6px}.example-list button{display:grid;gap:3px;border:1px solid transparent;background:transparent;color:#eef4ee;cursor:pointer;padding:11px;text-align:left}.example-list button:hover,.example-list button:focus-visible{border-color:#7ce1ff52;background:rgba(124,225,255,.08);outline:none}.example-list strong,.example-list span{display:block}.example-list span{color:#aebcaf;font-size:.84rem;line-height:1.35}.period-chip span,.period-chip strong{display:block}.period-chip span{color:#d4dfd8;font-size:.9rem}.period-chip strong{margin-top:2px;font-size:1.02rem}.period-chip--offPeak{border-color:#62d4ff8c;box-shadow:inset 0 0 0 1px #62d4ff2e}.period-chip--peak{border-color:#ffbc5999}.game-layout{display:grid;grid-template-columns:245px minmax(540px,1fr) 300px;gap:16px;align-items:start}.tool-panel,.metrics-panel{border:1px solid rgba(209,220,204,.16);background:rgba(28,35,29,.92);padding:14px}.panel-heading{display:flex;align-items:center;gap:8px;margin-bottom:12px;color:#f4f6ef}.tool-grid{display:grid;gap:8px}.tool-button{display:grid;grid-template-columns:58px minmax(0,1fr);align-items:center;gap:10px;min-height:68px;border:1px solid rgba(213,222,208,.15);background:rgba(255,255,255,.055);color:#eef4ee;cursor:grab;padding:7px 9px;text-align:left}.tool-button:disabled{cursor:not-allowed;opacity:.42}.tool-button--selected{border-color:#eac15e;background:rgba(234,193,94,.13)}.tool-button strong,.tool-button small{display:block;overflow-wrap:anywhere}.tool-button small{margin-top:2px;color:#aebcaf}.tool-actions{display:flex;gap:8px;margin-top:14px}.icon-button{display:grid;width:42px;height:42px;place-items:center;border:1px solid rgba(213,222,208,.16);background:rgba(255,255,255,.06);color:#eef4ee;cursor:pointer}.icon-button:hover,.tool-button:hover:not(:disabled){border-color:#eac15ea6}.board-wrap{min-width:0}.board-status{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-bottom:10px}.board-status div{border:1px solid rgba(213,222,208,.14);background:rgba(255,255,255,.055);padding:10px 12px}.board-status strong,.board-status span{display:block}.board-status span{color:#aebcaf;font-size:.82rem}.board{--tile-size: min(5.75vw, 68px);position:relative;display:grid;grid-template-columns:repeat(var(--grid-width),var(--tile-size));grid-template-rows:repeat(var(--grid-height),var(--tile-size));width:max-content;max-width:100%;overflow:auto;border:1px solid rgba(219,224,214,.16);background:linear-gradient(135deg,rgba(255,255,255,.06) 25%,transparent 25%) 0 0 / 24px 24px,linear-gradient(225deg,rgba(0,0,0,.18) 25%,transparent 25%) 0 0 / 24px 24px,#242b22;box-shadow:0 18px 48px #00000047}.tile{position:relative;z-index:3;display:grid;width:var(--tile-size);height:var(--tile-size);place-items:center;border:1px solid rgba(255,255,255,.06);background:linear-gradient(145deg,rgba(250,250,235,.05),transparent 42%),rgba(73,88,63,.28);cursor:copy;isolation:isolate}.tile:before{position:absolute;top:9%;right:9%;bottom:9%;left:9%;border:1px solid rgba(255,255,255,.055);content:"";transform:rotate(45deg) scale(.7)}.tile:hover{background:rgba(234,193,94,.16)}.tile--occupied{cursor:pointer}.tile--invalid{animation:invalid-pulse .5s ease;background:rgba(255,85,85,.34)}.wire-segment,.capture-pulse{position:relative;pointer-events:none}.wire-segment{z-index:2}.wire-segment:before{position:absolute;content:"";filter:drop-shadow(0 0 4px rgba(118,214,255,.9))}.wire-segment--horizontal:before{top:calc(50% - 1.5px);right:25%;left:25%;height:3px;background:repeating-linear-gradient(90deg,#76d6ff 0 11px,transparent 11px 19px);animation:line-flow-x .8s linear infinite}.wire-segment--vertical:before{top:25%;bottom:25%;left:calc(50% - 1.5px);width:3px;background:repeating-linear-gradient(180deg,#76d6ff 0 11px,transparent 11px 19px);animation:line-flow-y .8s linear infinite}.capture-pulse{z-index:4}.capture-pulse:before,.capture-pulse:after{position:absolute;top:13%;right:13%;bottom:13%;left:13%;border:2px solid #7ce1ff;border-radius:999px;content:"";filter:drop-shadow(0 0 5px rgba(124,225,255,.75));animation:capture 1.6s ease-out infinite}.capture-pulse:after{top:29%;right:29%;bottom:29%;left:29%;animation-delay:.28s}.asset-sprite{position:relative;z-index:3;display:block;width:92%;aspect-ratio:1;filter:drop-shadow(0 8px 7px rgba(0,0,0,.34));object-fit:contain;-webkit-user-select:none;user-select:none}.tool-button .asset-sprite{width:52px}.asset-sprite--offline{filter:grayscale(.95) brightness(.72)}.disconnect-dot{position:absolute;right:7px;bottom:7px;z-index:4;width:10px;height:10px;border:2px solid #121713;border-radius:999px;background:#ffbd59}.metric{display:flex;align-items:center;justify-content:space-between;gap:12px;border-bottom:1px solid rgba(213,222,208,.12);padding:10px 0}.metric span{color:#b7c4b8}.metric strong{color:#f6f8ef;text-align:right}.metric--good strong{color:#8beca8}.metric--warn strong{color:#ffd071}.tes-meter{margin-top:16px}.meter-title{display:grid;grid-template-columns:18px minmax(0,1fr) auto;align-items:center;gap:8px;color:#dbe8dc;font-size:.9rem}.meter-track{height:12px;margin-top:8px;overflow:hidden;border:1px solid rgba(255,255,255,.15);background:rgba(0,0,0,.3)}.meter-track span{display:block;height:100%;background:linear-gradient(90deg,#59d2ff,#8beca8);transition:width .25s ease}.electrified-readout{display:grid;grid-template-columns:24px minmax(0,1fr);gap:10px;align-items:center;margin-top:16px;border:1px solid rgba(124,225,255,.22);background:rgba(124,225,255,.08);padding:12px}.electrified-readout strong,.electrified-readout span{display:block}.electrified-readout strong{font-size:1.55rem}.electrified-readout span{color:#b7c4b8}@keyframes invalid-pulse{0%,to{transform:scale(1)}45%{transform:scale(.94)}}@keyframes line-flow-x{to{background-position-x:-19px}}@keyframes line-flow-y{to{background-position-y:-19px}}@keyframes capture{0%{opacity:.9;transform:scale(.45)}to{opacity:0;transform:scale(1.35)}}@media (max-width: 1120px){.game-layout{grid-template-columns:220px minmax(0,1fr)}.metrics-panel{grid-column:1 / -1}}@media (max-width: 780px){.app-shell{padding:14px}.topbar{align-items:stretch;flex-direction:column}.period-chip{min-width:0}.topbar-controls{flex-wrap:wrap}.example-button,.period-chip{flex:1 1 180px}.game-layout{grid-template-columns:1fr}.tool-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.board{--tile-size: 58px}}