.bs-root{--c64-black:#000;--c64-white:#fff;--c64-bg:#4a4ac0;--c64-border:#7a7ae0;--c64-paper:#d8d8ff;--c64-cyan:#75cec8;--c64-yellow:#edf171;--c64-red:#c46c71;--c64-red-dark:#813338;--c64-green:#56ac4d;--c64-orange:#8e5029;--c64-brown:#553800;--c64-grey:#7b7b7b;--c64-light-grey:#b2b2b2;--bs-water:#2e2c9b;--bs-water-2:#3b3aac;--bs-grid-line:#7a7ae0;color:var(--c64-paper);background:var(--c64-bg);image-rendering:pixelated;-webkit-font-smoothing:none;font-smooth:never;letter-spacing:.02em;font-family:"Press Start 2P",Courier New,monospace;line-height:1.5}.bs-screen{background:var(--c64-bg);border:12px solid var(--c64-border);box-shadow:0 0 0 4px var(--c64-black);min-height:100vh;padding:16px}.bs-panel{background:var(--c64-black);border:4px solid var(--c64-paper);padding:12px}.bs-panel--accent{border-color:var(--c64-yellow)}.bs-btn{background:var(--c64-paper);color:var(--c64-black);border:4px solid var(--c64-black);cursor:pointer;box-shadow:4px 4px 0 0 var(--c64-black);text-transform:uppercase;-webkit-user-select:none;user-select:none;padding:10px 14px;font-family:inherit;font-size:11px;transition:transform 60ms linear,box-shadow 60ms linear}.bs-btn:hover{background:var(--c64-yellow)}.bs-btn:active{box-shadow:0 0 0 0 var(--c64-black);transform:translate(4px,4px)}.bs-btn--primary{background:var(--c64-yellow)}.bs-btn--danger{background:var(--c64-red);color:var(--c64-white)}.bs-btn--ghost{color:var(--c64-paper);border-color:var(--c64-paper);box-shadow:4px 4px 0 0 var(--c64-paper);background:0 0}.bs-btn:disabled{background:var(--c64-grey);color:var(--c64-light-grey);cursor:not-allowed;box-shadow:4px 4px 0 0 var(--c64-black);opacity:.7}.bs-grid-wrap{background:var(--c64-black);border:4px solid var(--c64-paper);gap:4px;padding:8px;display:inline-grid}.bs-grid-title{letter-spacing:.1em;color:var(--c64-yellow);text-transform:uppercase;margin-bottom:6px;font-size:10px}.bs-grid{background:var(--c64-black);gap:1px;display:grid}.bs-axis-cell{color:var(--c64-paper);justify-content:center;align-items:center;min-width:24px;min-height:24px;font-size:9px;display:flex}.bs-cell{background:var(--bs-water);border:1px solid var(--bs-grid-line);cursor:default;justify-content:center;align-items:center;width:28px;height:28px;display:flex;position:relative}.bs-cell--clickable{cursor:crosshair}.bs-cell--clickable:hover{outline:2px solid var(--c64-yellow);outline-offset:-2px}.bs-cell--ship{background:var(--c64-light-grey);border-color:var(--c64-white)}.bs-cell--ship-sunk{background:var(--c64-brown);border-color:var(--c64-red-dark)}.bs-cell--preview-ok{background:var(--c64-green)}.bs-cell--preview-bad{background:var(--c64-red)}.bs-cell--miss:after{content:"";background:var(--c64-paper);border-radius:0;width:6px;height:6px}.bs-cell--hit{background:var(--c64-red-dark)}.bs-cell--hit:after{content:"";background:var(--c64-yellow);clip-path:polygon(50% 0,80% 30%,100% 50%,80% 70%,50% 100%,20% 70%,0 50%,20% 30%);width:14px;height:14px}@media(min-width:768px){.bs-cell{width:32px;height:32px}.bs-axis-cell{min-width:28px;min-height:28px;font-size:10px}}@media(max-width:767px){.bs-screen{border-width:6px;padding:8px}.bs-boards{flex-direction:column;align-items:stretch;gap:16px}.bs-grid-wrap{width:100%;display:grid}.bs-grid{width:100%}.bs-cell{aspect-ratio:1;width:auto;min-width:0;height:auto;min-height:0}.bs-axis-cell{min-width:24px;min-height:24px}}@media(max-width:480px){.bs-axis-cell{min-width:20px;min-height:20px;font-size:8px}}.bs-hud-row{color:var(--c64-paper);text-transform:uppercase;justify-content:space-between;padding:4px 0;font-size:10px;display:flex}.bs-hud-row strong{color:var(--c64-yellow)}.bs-roster{flex-wrap:wrap;gap:4px;font-size:9px;display:flex}.bs-roster-ship{background:var(--c64-black);border:2px solid var(--c64-paper);gap:2px;padding:4px 6px;display:inline-flex}.bs-roster-ship--sunk{opacity:.4;border-color:var(--c64-red);text-decoration:line-through}.bs-roster-cell{background:var(--c64-light-grey);width:8px;height:8px}.bs-roster-cell--hit{background:var(--c64-red-dark)}.bs-title{color:var(--c64-yellow);text-shadow:4px 4px 0 var(--c64-black);letter-spacing:.1em;text-transform:uppercase;font-size:22px}.bs-subtitle{color:var(--c64-paper);text-transform:uppercase;font-size:11px}.bs-scanlines{pointer-events:none;z-index:50;background:repeating-linear-gradient(0deg,#0000002e 0 1px,#0000 1px 3px);position:fixed;inset:0}.bs-banner{background:var(--c64-yellow);color:var(--c64-black);border:4px solid var(--c64-black);text-transform:uppercase;box-shadow:4px 4px 0 0 var(--c64-black);padding:8px 12px;font-size:11px;display:inline-block}.bs-log{background:var(--c64-black);border:2px solid var(--c64-paper);max-height:140px;color:var(--c64-paper);padding:6px;font-size:9px;overflow-y:auto}.bs-log-line{padding:1px 0}.bs-log-line--hit{color:var(--c64-yellow)}.bs-log-line--miss{color:var(--c64-paper);opacity:.7}.bs-log-line--sunk{color:var(--c64-red)}.bs-pass{text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:20px;min-height:50vh;display:flex}.bs-input,.bs-select{background:var(--c64-black);color:var(--c64-paper);border:3px solid var(--c64-paper);padding:8px;font-family:inherit;font-size:11px}.bs-label{text-transform:uppercase;color:var(--c64-yellow);margin-bottom:4px;font-size:9px;display:block}.bs-row{flex-wrap:wrap;align-items:end;gap:12px;display:flex}.bs-stack{flex-direction:column;gap:12px;display:flex}.bs-boards{flex-wrap:wrap;align-items:flex-start;gap:24px;display:flex}[data-tock-theme=classic]{--walnut-950:#1b120c;--walnut-900:#251a12;--walnut-800:#3a2818;--brass:#c6a15b;--brass-bright:#e3c583;--felt:#1e3a2f;--felt-light:#28503f;--parchment:#efe4c8;--ink:#2a1d12;--cream:#f7f1e3;--red:#c94a3b;--blue:#3465a4;--gold:#d9a521;--green:#4c8b5e;--card-bg:#fffdf7;--card-joker-a:#fff8e6;--card-joker-b:#f3e2b2;--suit-red:#a5342a;--suit-black:#22201c;--joker-ink:#8a5a12;--card-tag-ink:#8a6a2d;--btn-ink:#2a1d0c;--display-font:"Fraunces",serif;--tag-font:"IBM Plex Mono",monospace;--card-radius:10px}[data-tock-theme=modern]{--walnut-950:#0a0c12;--walnut-900:#12141d;--walnut-800:#1c202c;--brass:#5cc8ff;--brass-bright:#8fd9ff;--felt:#131726;--felt-light:#1c2438;--parchment:#dbe4f5;--ink:#0b0d13;--cream:#161a26;--red:#ff4d6d;--blue:#3aa0ff;--gold:#ffb020;--green:#2de0c2;--card-bg:#1c2130;--card-joker-a:#241a3a;--card-joker-b:#181c2a;--suit-red:#ff6b86;--suit-black:#dbe4f5;--joker-ink:#c9a4ff;--card-tag-ink:#8fd9ff;--btn-ink:#0a0c12;--display-font:"Space Grotesk",sans-serif;--tag-font:"IBM Plex Mono",monospace;--card-radius:7px}[data-tock-theme=folk]{--walnut-950:#241611;--walnut-900:#33221a;--walnut-800:#4a3224;--brass:#c17a3a;--brass-bright:#e0a35f;--felt:#3d1f1a;--felt-light:#4f2a22;--parchment:#f3e3c0;--ink:#2b1c10;--cream:#faf3e0;--red:#b33f2f;--blue:#4a7a95;--gold:#cf9a2e;--green:#4c7a4a;--card-bg:#fbf4e3;--card-joker-a:#f6e7c2;--card-joker-b:#ecd7a4;--suit-red:#a13d2e;--suit-black:#2b1c10;--joker-ink:#9a6a1f;--card-tag-ink:#8a5a2e;--btn-ink:#2b1c10;--display-font:"Rye",cursive;--tag-font:"Special Elite",monospace;--card-radius:4px}.tock-scope{background:linear-gradient(180deg,var(--walnut-900),var(--walnut-950));color:var(--parchment)}.tock-title{font-family:var(--display-font);color:var(--brass-bright);letter-spacing:.02em}.tock-btn-primary{background:linear-gradient(180deg,var(--brass-bright),var(--brass));color:var(--btn-ink);font-weight:700;font-family:var(--display-font);text-transform:uppercase;letter-spacing:.05em;border-radius:10px;padding:10px 18px}[data-tock-theme=modern] .tock-btn-primary{box-shadow:0 0 20px color-mix(in oklab,var(--brass) 55%,transparent)}.tock-round-pill{font-family:var(--tag-font);background:var(--walnut-800);color:var(--brass-bright);border:1px solid color-mix(in oklab,var(--brass) 40%,transparent);letter-spacing:.15em;text-transform:uppercase;border-radius:999px;padding:2px 10px;font-size:12px}.tock-status-pill{font-family:var(--display-font);background:var(--walnut-800);color:var(--parchment);border:1px solid color-mix(in oklab,var(--brass) 25%,transparent);border-radius:999px;align-items:center;gap:8px;padding:6px 14px;font-size:14px;display:inline-flex}.tock-board-frame{background:radial-gradient(circle at 50% 40%,var(--felt-light),var(--felt) 70%);border:6px solid var(--walnut-800);box-shadow:inset 0 0 0 2px color-mix(in oklab,var(--brass) 40%,transparent),0 24px 60px #0006;border-radius:14px}[data-tock-theme=modern] .tock-board-frame{box-shadow:inset 0 0 0 2px var(--brass),0 0 40px color-mix(in oklab,var(--brass) 45%,transparent),0 24px 60px #0009}.tock-seat-pill{background:var(--walnut-800);border:1px solid color-mix(in oklab,var(--brass) 20%,transparent);color:var(--parchment);border-radius:999px;align-items:center;gap:6px;padding:4px 10px 4px 4px;font-size:12px;font-weight:600;display:inline-flex}.tock-seat-pill[data-active=true]{box-shadow:0 0 0 2px var(--brass-bright)}.tock-card{background:linear-gradient(160deg,var(--card-bg-a,#fff) 0%,var(--cream) 100%);color:var(--ink);border-radius:var(--card-radius);-webkit-user-select:none;user-select:none;border:1px solid #00000014;transition:filter .18s ease-out,transform .2s ease-out,box-shadow .2s ease-out;position:relative;box-shadow:0 6px 14px #00000059,inset 0 0 0 1px #0000000f}.tock-card:hover:not(:disabled){filter:brightness(1.04)}.tock-card[data-joker=true]{background:linear-gradient(160deg,var(--card-joker-a),var(--card-joker-b));color:var(--joker-ink)}.tock-card[data-selected=true]{box-shadow:0 14px 28px #00000080,0 0 0 2.5px var(--brass-bright),0 0 24px color-mix(in oklab,var(--brass-bright) 60%,transparent)}.tock-card[data-playable=false]{filter:grayscale(.55)brightness(.75)}.tock-card-tag{background:color-mix(in oklab,var(--brass) 22%,transparent);min-height:11px;color:var(--card-tag-ink);font-family:var(--tag-font);letter-spacing:.05em;text-transform:uppercase;white-space:nowrap;text-overflow:ellipsis;border-radius:5px;max-width:calc(100% - 8px);padding:2px 5px;font-size:7.4px;font-weight:700;line-height:1;position:absolute;bottom:5px;left:50%;overflow:hidden;transform:translate(-50%)}.tock-suit-red{color:var(--suit-red)}.tock-suit-black{color:var(--suit-black)}.tock-theme-switcher a{color:var(--parchment);font-family:var(--tag-font);text-transform:uppercase;letter-spacing:.15em;cursor:pointer;border-bottom:2px solid #0000;padding:2px 6px;font-size:12px}.tock-theme-switcher a[data-active=true]{color:var(--brass-bright);border-bottom-color:var(--brass-bright)}@keyframes tock-pulse{0%,to{opacity:.35}50%{opacity:.95}}.tock-halo{stroke:var(--brass-bright);fill:none;stroke-width:1.5px;animation:1.2s ease-in-out infinite tock-pulse}.tock-ghost{stroke:var(--brass-bright);stroke-dasharray:2 2;fill:none;animation:1.4s ease-in-out infinite tock-pulse}