:root{--ice-bg: #dff4ff;--ice-alt: #cfeaf7;--center-red: #d62828;--line-blue: #2b59c3;--crease: #8ed1fc;--boards: #ffffff;--blue: #1d4ed8;--red: #dc2626;--puck: #111827;--selected: #fbbf24;--legal: rgba(6, 182, 212, .32);--pass: rgba(34, 197, 94, .35);--steal: rgba(249, 115, 22, .4);--panel-border: #bfd9e8;--text: #0f172a}*{box-sizing:border-box}body{margin:0;color:var(--text);font-family:Trebuchet MS,Segoe UI,sans-serif;background:radial-gradient(circle at 15% 15%,#f5fcff,#e8f5fc 34%,#d7ecf8 70%,#cbe3f1)}.app{min-height:100vh;padding:16px}h1{margin:0 0 10px;text-align:center;letter-spacing:.03em}.main-grid{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:14px;align-items:start}.left-column{display:flex;flex-direction:column;gap:10px}.bottom-panel{display:grid;grid-template-columns:320px minmax(0,1fr);gap:12px;align-items:start}.turn-banner{margin:0 auto 12px;max-width:420px;text-align:center;padding:10px;border-radius:10px;font-weight:700;border:1px solid #b7d0e1;box-shadow:0 4px 14px #0f172a26}.turn-banner.blue{background:#dbeafe;color:#1e3a8a}.turn-banner.red{background:#fee2e2;color:#7f1d1d}.turn-banner.winner-banner{background:#fef3c7;color:#78350f}.turn-banner-sub{margin-top:4px;font-size:.8rem;font-weight:600;opacity:.88}.board-shell{background:var(--boards);border-radius:12px;border:1px solid #c8dceb;padding:10px;box-shadow:0 10px 20px #0f172a29;overflow-x:auto}.col-labels{display:grid;grid-template-columns:24px repeat(30,34px) 24px;align-items:center}.col-label{text-align:center;font-size:.67rem;font-weight:700;color:#33566d}.corner-label{height:18px}.board-main{display:grid;grid-template-columns:24px auto 24px;align-items:center}.row-labels{display:grid;grid-template-rows:repeat(13,34px)}.row-label{display:grid;place-items:center;font-size:.67rem;font-weight:700;color:#33566d}.board-grid{display:grid;grid-template-rows:repeat(13,34px);border:2px solid #aac8da;border-radius:8px;overflow:hidden}.cell{border:1px solid rgba(30,64,175,.08);position:relative;padding:0;cursor:pointer}.tile-even{background:var(--ice-bg)}.tile-odd{background:var(--ice-alt)}.cell.center-line{box-shadow:inset -1px 0 0 var(--center-red),inset 1px 0 0 var(--center-red)}.cell.blue-line{box-shadow:inset -1px 0 0 var(--line-blue),inset 1px 0 0 var(--line-blue)}.cell.goal-cell{background:color-mix(in srgb,var(--crease),#ffffff 20%)}.cell.crease-cell{background:color-mix(in srgb,var(--crease),var(--ice-bg) 35%)}.cell.legal-move:before,.cell.pass-target:before,.cell.steal-target:before{content:"";position:absolute;top:7px;right:7px;bottom:7px;left:7px;border-radius:999px}.cell.legal-move:before{background:var(--legal)}.cell.pass-target:before{background:var(--pass)}.cell.steal-target:before{background:var(--steal)}.piece{width:28px;height:28px;margin:auto;border-radius:50%;display:grid;place-items:center;font-size:.62rem;font-weight:800;color:#fff;position:relative;z-index:1;line-height:1}.piece-blue{background:var(--blue)}.piece-red{background:var(--red)}.piece-selected{outline:3px solid var(--selected);outline-offset:1px}.puck-dot{position:absolute;width:9px;height:9px;background:var(--puck);border-radius:50%;right:-2px;bottom:-2px;border:1px solid #ffffff}.role-chip{position:absolute;top:-7px;left:-7px;font-size:.48rem;font-weight:800;background:#0f172ad9;border-radius:999px;padding:1px 4px}.loose-puck{position:absolute;width:12px;height:12px;border-radius:50%;background:var(--puck);box-shadow:0 0 0 2px #fffc;top:10px;left:10px}.hud{background:#f8fcff;border:1px solid var(--panel-border);border-radius:12px;box-shadow:0 8px 18px #0f172a24;padding:10px;display:flex;flex-direction:column;gap:8px}.panel-section{background:#fff;border:1px solid #d5e7f2;border-radius:10px;padding:9px}.panel-section h3{margin:0 0 6px}.panel-section p{margin:3px 0;font-size:.9rem}.score-row{display:flex;justify-content:space-between;align-items:center;margin-bottom:6px}.team-pill{color:#fff;border-radius:999px;padding:2px 9px;font-size:.75rem;font-weight:700}.team-blue-pill{background:var(--blue)}.team-red-pill{background:var(--red)}.acted-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.action-buttons{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.setup-row{display:flex;justify-content:space-between;align-items:center;margin:6px 0;gap:8px;font-size:.9rem}.setup-row select{min-width:150px;border:1px solid #a5c6d8;border-radius:7px;padding:4px 6px;background:#f3fbff}.lineup-editor{margin-top:8px;border:1px solid #d5e7f2;border-radius:8px;padding:8px;background:#fbfeff}.lineup-editor h4{margin:0 0 6px}.role-help{margin:8px 0;font-size:.85rem}button{font:inherit}.action-buttons button,.reset-button{border:1px solid #a5c6d8;background:#e7f5ff;border-radius:8px;padding:7px 8px;font-weight:700;cursor:pointer}.action-buttons button:disabled,.reset-button:disabled{opacity:.45;cursor:not-allowed}.active-action{background:#ccecff;border-color:#68a7c8}.reset-button{width:100%}.action-log{max-height:280px;overflow:auto}.action-log ul{margin:0;padding-left:18px;display:flex;flex-direction:column;gap:5px;font-size:.86rem}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:#0f172a73;display:grid;place-items:center;padding:16px;z-index:20}.modal-card{width:min(900px,100%);max-height:calc(100vh - 32px);overflow:auto;background:#f8fcff;border:1px solid #aac8da;border-radius:12px;box-shadow:0 20px 36px #0f172a59;padding:14px}.modal-card h2{margin:0 0 8px}.modal-card p{margin:6px 0}.modal-draft-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.muted{color:#64748b}@media (max-width: 1180px){.main-grid,.bottom-panel{grid-template-columns:1fr}.hud{width:min(100%,760px);margin:0 auto}.modal-draft-grid{grid-template-columns:1fr}}