:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--bg:#101114;--panel:#171a20;--panel-2:#1e222b;--text:#e6e8ee;--muted:#9aa3b2;--line:#343a46;--cell:#20252f;--cell-hover:#2d3441;--tile:#d7dde8;--tile-ink:#171a20;--accent:#6ee7b7;--danger:#ff5370;--shadow:0 18px 50px #00000059;background:var(--bg);color:var(--text);font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*{box-sizing:border-box}body{touch-action:manipulation;background:radial-gradient(circle at 30% -20%, #6ee7b71f, transparent 38rem), linear-gradient(180deg, #11141a 0%, var(--bg) 34rem);min-width:320px;min-height:100svh;margin:0}button,input,select,textarea{font:inherit}button{border:1px solid var(--line);color:var(--text);background:var(--panel-2);cursor:pointer;border-radius:7px;min-height:38px}button:hover{border-color:#596274}button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid var(--accent);outline-offset:2px}h1,h2,p{margin:0}h1{font-size:32px;font-weight:760;line-height:1}h2{color:var(--text);font-size:14px;font-weight:720}label{color:var(--muted);gap:7px;font-size:13px;display:grid}input,select,textarea{border:1px solid var(--line);width:100%;color:var(--text);background:#11141a;border-radius:7px}input,select{min-height:36px;padding:0 10px}textarea{resize:vertical;min-height:132px;padding:10px;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:12px;line-height:1.45}.shell{grid-template-columns:300px minmax(0,1fr);min-height:100svh;display:grid}.editor-toggle{display:none}.panel{border-right:1px solid var(--line);background:#171a20f5;flex-direction:column;gap:24px;height:100svh;padding:24px;display:flex;position:sticky;top:0;overflow:auto}.eyebrow{color:var(--accent);letter-spacing:.08em;text-transform:uppercase;margin-bottom:9px;font-size:12px;font-weight:800}.control-group{gap:12px;display:grid}.segmented{border:1px solid var(--line);background:#11141a;border-radius:8px;grid-template-columns:repeat(3,1fr);padding:3px;display:grid}.segmented button{min-height:34px;color:var(--muted);background:0 0;border:0;border-radius:5px}.segmented button.active{color:var(--text);background:#28313d}.shift-grid{grid-template-columns:repeat(3,1fr);gap:7px;display:grid}.primary{background:var(--accent);color:#062018;border-color:#0000;font-weight:780}.status{min-height:58px;color:var(--muted);border:1px solid var(--line);background:#11141a;border-radius:8px;margin-top:auto;padding:12px;font-size:13px;line-height:1.35}.workspace{align-content:start;gap:20px;min-width:0;padding:28px;display:grid}.board-wrap{border-bottom:1px solid var(--line);place-items:center;min-height:520px;padding-bottom:22px;display:grid;position:relative;overflow:auto}#board{touch-action:none;width:100%;height:auto}#board.domino-mode .regions{pointer-events:none}.hole-cell{fill:#0000;stroke:#0000;stroke-width:2px;pointer-events:none}#board.hole-mode .hole-cell{fill:#ffffff09;stroke:#6ee7b747;stroke-dasharray:5 6;pointer-events:all;cursor:pointer}.cell{fill:var(--cell);stroke:#3d4654;stroke-width:2px;cursor:pointer;transition:fill .14s,stroke .14s}.cell:hover,.cell.drawing{fill:var(--cell-hover);stroke:var(--accent)}.region-edge{stroke-width:4px;stroke-dasharray:3 7;stroke-linecap:round;pointer-events:none}.region-badge{cursor:pointer}.region-badge circle,.region-badge rect{fill:#12151b;stroke:currentColor;stroke-width:2.5px;filter:drop-shadow(0 6px 10px #00000052)}.region-badge.invalid circle,.region-badge.invalid rect{fill:var(--danger);stroke:#ff9aad}.region-badge text{fill:var(--text);text-anchor:middle;pointer-events:none;font-size:9px;font-weight:850}.region-badge.invalid text{fill:#fff}.domino-half{fill:var(--tile);stroke:#f7f9fca6;stroke-width:1px;cursor:pointer;transition:transform .18s,opacity .16s}.domino-bridge{stroke:var(--tile);stroke-width:30px;stroke-linecap:round;pointer-events:none}.domino-hit-bridge{stroke:#0000;stroke-width:34px;stroke-linecap:round;cursor:pointer;pointer-events:stroke}.board-domino.hovering{opacity:.72}.pip,.bank-pip{fill:var(--tile-ink);pointer-events:none;transition:cx .18s,cy .18s,transform .18s}.drag-ghost{z-index:20;pointer-events:none;filter:drop-shadow(0 18px 24px #0000006b);will-change:transform;width:164px;height:152px;position:fixed;top:0;left:0}.drag-ghost svg{width:100%;height:100%;display:block;overflow:visible}.drag-ghost[hidden]{display:none}.bank-shell{gap:12px;display:grid}.bank-head{justify-content:space-between;align-items:center;gap:16px;display:flex}.bank-head span{color:var(--muted);font-size:13px}.bank{touch-action:manipulation;grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:10px;display:grid}.bank-domino{aspect-ratio:1.66;touch-action:none;background:#151922;border-radius:8px;min-height:0;padding:0;transition:opacity .16s,transform .16s,border-color .16s}.bank-domino svg{width:100%;height:100%;display:block;overflow:visible}.bank-tile{fill:var(--tile);stroke:#f7f9fc;stroke-width:1.5px}.bank-half,.pip-cluster{transition:transform .18s}.bank-domino.used{opacity:.33}.popover{z-index:10;background:var(--panel);border:1px solid var(--line);width:220px;box-shadow:var(--shadow);border-radius:8px;gap:10px;padding:12px;display:grid;position:fixed}.popover[hidden]{display:none}#delete-region{color:#ffd4dc;background:#ff53701f;border-color:#ff537073}@media (width<=860px){.shell{grid-template-columns:1fr}.editor-toggle{z-index:30;background:var(--accent);color:#062018;min-height:36px;box-shadow:var(--shadow);border-color:#0000;place-items:center;padding:0 13px;font-weight:780;display:inline-grid;position:fixed;top:10px;left:10px}.panel{z-index:25;width:min(300px,100vw - 32px);height:100svh;box-shadow:var(--shadow);border-bottom:0;border-right:0;transition:transform .18s;position:fixed;inset:0 auto 0 0;transform:translate(-100%)}.shell.editor-open .panel{transform:translate(0)}.workspace{gap:14px;padding:56px 12px 14px}.board-wrap{min-height:420px}.bank{grid-template-columns:repeat(7,minmax(0,1fr));gap:4px}.bank-domino{border-radius:6px}}