.triangles-stage{width:min(100%,700px);margin:0 auto 16px;color:#243149}
.triangle-scoreboard{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:8px 0 20px}
.triangle-player{display:flex;align-items:center;gap:12px;padding:14px 18px;background:#fffdf8;border:2px solid #d5dae2;border-radius:14px;min-width:0;box-shadow:0 2px 4px #1822360a}
.triangle-avatar{display:grid;place-items:center;width:44px;height:44px;border-radius:50%;font-size:23px;background:#f8dfcb;color:#9e4819;flex:none}
.triangle-player-1 .triangle-avatar{background:#d9e9f3;color:#285c80}.triangle-player.is-turn{border-color:#ce793c;box-shadow:0 0 0 3px #ce793c12}.triangle-player-1.is-turn{border-color:#4d8ab1;box-shadow:0 0 0 3px #4d8ab112}
.triangle-player-name{display:block;font-size:16px;font-weight:700;line-height:1.25}.triangle-turn-label{display:block;color:#677385;font-size:12px;margin-top:3px}.triangle-player strong{font:750 34px/1 Arial,sans-serif;margin-left:auto;font-variant-numeric:tabular-nums}
.triangle-board-caption{display:flex;justify-content:space-between;align-items:center;gap:12px;margin:0 10px 10px;font-size:14px}.triangle-board-caption span{color:#667286;font-size:13px}
.triangle-board{display:block;width:100%;height:auto;background:#fffdf8;border:1px solid #d3d8e1;border-radius:18px;box-shadow:0 5px 16px #18223609;overflow:visible;touch-action:none;user-select:none;-webkit-user-select:none}
.triangle-claimed polygon{fill:#edaa72;fill-opacity:.67}.triangle-claimed.triangle-owner-1 polygon{fill:#79b0d0;fill-opacity:.61}.triangle-claimed text{fill:#945025;font:bold 13px Arial;pointer-events:none}.triangle-claimed.triangle-owner-1 text{fill:#2c6286}
.triangle-edge-line{stroke:#c3cbd5;stroke-width:2;stroke-dasharray:3 5;stroke-linecap:round;pointer-events:none}.triangle-edge-hit{stroke:transparent;stroke-width:26;stroke-linecap:round;cursor:pointer}.triangle-edge-halo{stroke:transparent;stroke-width:10;stroke-linecap:round;pointer-events:none}
.triangle-edge.is-drawn .triangle-edge-line{stroke:#34455d;stroke-width:4;stroke-dasharray:none}.triangle-edge.is-drawn.triangle-owner-0 .triangle-edge-line{stroke:#b35d2b}.triangle-edge.is-drawn.triangle-owner-1 .triangle-edge-line{stroke:#407da5}.triangle-edge.is-drawn .triangle-edge-hit{pointer-events:none;cursor:default}
.triangle-edge.is-last .triangle-edge-halo{stroke:#26374e;stroke-width:9;stroke-dasharray:2 8;opacity:.48}.triangle-edge.is-open:hover .triangle-edge-line,.triangle-edge.is-open:focus-visible .triangle-edge-line,.triangle-edge.is-candidate .triangle-edge-line{stroke:#ad5a29;stroke-width:5;stroke-dasharray:none}.triangle-edge:focus-visible{outline:none}.triangle-edge:focus-visible .triangle-edge-halo{stroke:#efc5a3;stroke-width:13}
#game[data-game=triangles] .triangle-dot-hit{fill:transparent;cursor:pointer}#game[data-game=triangles] .triangle-dot-ring{fill:#f5d3b6;opacity:0;pointer-events:none}#game[data-game=triangles] .triangle-dot-core{fill:#293b55;stroke:#fffdf8;stroke-width:2;pointer-events:none}.triangle-dot:hover .triangle-dot-ring,.triangle-dot:focus-visible .triangle-dot-ring,.triangle-dot.is-selected .triangle-dot-ring{opacity:1!important}.triangle-dot:focus-visible{outline:none}.triangle-dot.is-selected .triangle-dot-core{fill:#b45d2a!important}.triangle-drag-preview{stroke:#bd6b32;stroke-width:5;stroke-linecap:round;stroke-dasharray:5 5;pointer-events:none}.triangle-board[data-can-play="0"] .triangle-dot-hit{cursor:default!important}
.triangle-help{margin:15px auto 10px!important;text-align:center;color:#536176;font-size:14px;line-height:1.5;min-height:22px}.triangle-legend{display:flex;justify-content:center;align-items:center;gap:18px;flex-wrap:wrap;color:#667286;font-size:12px}.triangle-legend>span{display:flex;align-items:center;gap:6px}.triangle-key{width:12px;height:12px;border-radius:3px;background:#e6a16b}.triangle-key-1{background:#79b0d0}.triangle-last-key{font-size:11px}
@media(max-width:600px){.triangle-scoreboard{gap:8px;margin:6px 0 15px}.triangle-player{gap:8px;padding:10px 9px;border-radius:10px}.triangle-avatar{width:30px;height:30px;font-size:18px}.triangle-player-name{font-size:13px}.triangle-turn-label{font-size:10px}.triangle-player strong{font-size:28px}.triangle-board-caption{margin-inline:3px;font-size:13px}.triangle-board-caption span{font-size:11px}.triangle-board{border-radius:12px}.triangle-help{font-size:12px;padding:0 6px}.triangle-legend{gap:12px;font-size:11px}.triangle-last-key{font-size:10px}}
/* Version 2 has arbitrary connections: show chosen lines, not a web of 190 candidates. */
.triangle-board{overflow:hidden;max-height:calc(100dvh - 275px);min-height:220px;aspect-ratio:4/3}
.triangle-edge{pointer-events:none}.triangle-edge.is-open{opacity:0}.triangle-edge.is-drawn .triangle-edge-line{stroke-width:3.5}.triangle-edge.is-last .triangle-edge-halo{stroke-width:8}
.triangle-dot-label{font:600 12px Arial,sans-serif;fill:#31455e;opacity:0;pointer-events:none}.triangle-dot.is-selected .triangle-dot-label,.triangle-dot.is-candidate .triangle-dot-label,.triangle-dot:focus-visible .triangle-dot-label{opacity:1}
#game[data-game=triangles] .triangle-dot.is-candidate .triangle-dot-ring{fill:#b9d7e9;opacity:.85}#game[data-game=triangles] .triangle-dot.is-selected .triangle-dot-ring{fill:#f2c6a1;opacity:1}#game[data-game=triangles] .triangle-dot.is-blocked .triangle-dot-core{fill:#788599}
.triangle-move-summary{margin:14px 0 5px;text-align:center;font-size:14px;font-weight:700;line-height:1.5;min-height:21px;color:#33465e}.triangle-help{margin:5px auto 12px!important;max-width:580px}.triangle-rule-note,.triangle-legacy{text-align:center;font-size:12px;color:#677385;margin:10px 0}.triangle-legacy{font-style:italic}.triangle-drag-preview.is-invalid{stroke:#b14838}.triangle-claimed{pointer-events:none}.triangle-player strong{min-width:30px;text-align:right}
@media(max-width:600px){.triangle-board{max-height:none;min-height:0}.triangle-move-summary{font-size:12px}.triangle-rule-note,.triangle-legacy{font-size:11px}.triangle-scoreboard{margin-bottom:12px}}
@media(prefers-reduced-motion:no-preference){.triangle-claimed.is-new polygon{animation:triangle-claim .25s ease-out}@keyframes triangle-claim{from{fill-opacity:.15}to{fill-opacity:.67}}}
