:root{--ink:#1a2330;--chalk:#f4efe4;--panel:#3d5a4c;--panel-deep:#2a4036;--sky:#7eb8c9;--grass:#8fbf7a;--sand:#e8d5a3;--gold:#f0c65a;--mint:#9fd989;--muted:#a8c4b0;--cell:5.4rem;--pixel:4px;--font-pixel:"Pixelify Sans", "Segoe UI", sans-serif}*,:before,:after{box-sizing:border-box}html,body,#root{height:100%;min-height:100%;margin:0}body{font-family:var(--font-pixel);color:var(--chalk);background:var(--panel-deep);overflow-x:hidden}button{font:inherit;cursor:pointer;color:inherit;background:0 0;border:none}img{object-fit:contain;pointer-events:none;-webkit-user-select:none;user-select:none;width:100%;height:100%;display:block}.app{background:linear-gradient(180deg, #5a9aab 0%, var(--sky) 26%, var(--grass) 26%, var(--grass) 78%, #6a9a58 100%);flex-direction:column;height:100%;min-height:100%;display:flex;position:relative;overflow:hidden}.app:before{content:"";pointer-events:none;opacity:.14;z-index:0;background-image:linear-gradient(#1a233066 2px,#0000 2px),linear-gradient(90deg,#1a233066 2px,#0000 2px);background-size:16px 16px;position:absolute;inset:0}.topbar{z-index:2;box-sizing:border-box;flex:none;grid-template-columns:minmax(0,1fr) 17.5rem;align-items:center;column-gap:.75rem;min-height:4.25rem;padding:.55rem 1rem;display:grid;position:relative}.top-guide{color:#fff;white-space:normal;overflow-wrap:anywhere;word-break:break-word;min-width:0;max-width:100%;margin:0;font-size:1rem;line-height:1.35}.controls{flex-wrap:nowrap;flex-shrink:0;justify-content:flex-end;justify-self:end;align-items:center;gap:.5rem;width:17.5rem;min-width:17.5rem;max-width:17.5rem;height:2.55rem;display:flex}.btn{border:var(--pixel) solid var(--ink);background:var(--sand);min-height:2.55rem;color:var(--ink);letter-spacing:.03em;box-shadow:var(--pixel) var(--pixel) 0 var(--ink);border-radius:0;padding:.4rem .95rem;transition:transform 90ms steps(2,end),box-shadow 90ms steps(2,end),background .12s}.btn:hover{background:var(--gold)}.btn:active{transform:translate(var(--pixel), var(--pixel));box-shadow:0 0 0 var(--ink)}.btn.active{background:var(--gold)}.btn.accent{background:var(--mint)}.stage{z-index:1;flex:auto;place-items:center;min-height:0;padding:.5rem;display:grid;position:relative;overflow:hidden;container:stage/size}.board{background:var(--panel);border:calc(var(--pixel) * 2) solid var(--ink);width:min(100cqw,100cqh);height:min(100cqw,100cqh);box-shadow:inset calc(var(--pixel) * -1) calc(var(--pixel) * -1) 0 #6a8a78, calc(var(--pixel) * 2) calc(var(--pixel) * 2) 0 #1a233066;border-radius:0;position:relative;overflow:visible}.board.linked{box-shadow:inset calc(var(--pixel) * -1) calc(var(--pixel) * -1) 0 #7aaa88, calc(var(--pixel) * 2) calc(var(--pixel) * 2) 0 #1a233066}.wires{pointer-events:none;z-index:1;width:100%;height:100%;position:absolute;inset:0;overflow:visible}.wire{fill:none;stroke-linecap:square;stroke-linejoin:miter}.wire.guide{stroke:var(--muted);stroke-width:3px;stroke-dasharray:8 6;opacity:.75}.wire.hot{stroke:var(--gold);stroke-width:4px;stroke-dasharray:1 0;opacity:1;animation:.7s steps(2,end) infinite wire-pulse}@keyframes wire-pulse{0%,to{opacity:1}50%{opacity:.65}}.arrow-head{fill:var(--muted)}.arrow-head-hot{fill:var(--gold)}.hub{z-index:5;pointer-events:none;flex-direction:column;justify-content:center;align-items:center;gap:.4rem;width:70%;max-width:70%;display:flex;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.notes{border:var(--pixel) solid var(--ink);background:var(--sand);width:min(15rem,100%);max-height:36%;color:var(--ink);box-shadow:var(--pixel) var(--pixel) 0 #1a233073;pointer-events:auto;scrollbar-width:thin;border-radius:0;flex:none;padding:.7rem .8rem;position:relative;overflow:auto}.notes-title{color:var(--ink);margin:0 0 .35rem;font-size:.88rem;line-height:1.25}.notes-p{color:#2a3340;margin:0;font-size:.78rem;line-height:1.35}.pile{grid-template-columns:repeat(3, var(--cell));pointer-events:none;flex:none;justify-content:center;gap:.3rem;width:max-content;display:grid;position:relative}.piece-face,.pile-piece,.cell,.ghost{box-sizing:border-box;width:var(--cell);height:var(--cell);min-width:var(--cell);min-height:var(--cell);max-width:var(--cell);max-height:var(--cell);background:0 0;border:none;border-radius:0;place-items:center;margin:0;padding:0;display:grid;overflow:visible}.piece-face img,.pile-piece img,.cell img,.ghost img{box-sizing:border-box;width:var(--cell);height:var(--cell);max-width:var(--cell);max-height:var(--cell);object-fit:contain;object-position:center;background:0 0;border:none;margin:0;padding:0}.pile-piece{z-index:5;box-shadow:none;touch-action:none;pointer-events:auto;font-size:0;line-height:0;transition:opacity .12s;position:relative;transform:none}.pile-piece:hover{z-index:8}.pile-piece.dragging{opacity:0}.cell{z-index:6;position:absolute;transform:translate(-50%,-50%)}.cell img{z-index:6;position:relative}.cell.focus{outline:var(--pixel) solid var(--gold);outline-offset:3px;z-index:8;animation:.8s steps(2,end) infinite pulse-focus}@keyframes pulse-focus{0%,to{transform:translate(-50%,-50%)scale(1)}50%{transform:translate(-50%,-50%)scale(1.04)}}.drop{touch-action:none}.drop.empty{box-shadow:none;background:0 0;border:none}.drop.empty:after{content:"";pointer-events:none;border:2px dashed #f4efe473;width:38%;height:38%;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.drop.empty:hover:after,.drop.hover:after{border-color:var(--gold)}.drop.filled{box-shadow:none;cursor:pointer;background:0 0;border:none}.drop.filled:after{display:none}.cell.view{box-shadow:none;background:0 0;border:none}.cell.view.testable{cursor:pointer}.ghost{z-index:50;margin:calc(var(--cell) / -2) 0 0 calc(var(--cell) / -2);pointer-events:none;filter:drop-shadow(var(--pixel) var(--pixel) 0 #1a233080);opacity:.96;position:fixed;top:0;left:0}.is-reject .board{animation:.48s steps(4,end) shake}@keyframes shake{0%,to{transform:translate(0)}25%{transform:translate(-7px)}50%{transform:translate(7px)}75%{transform:translate(-4px)}}@media (width<=720px){.notes{max-height:30%}}