:root{--paper:#f4f1ea;--surface:#fffdf8;--ink:#1f1d22;--muted:#55515c;--line:#d9d3c7;--accent:#5b2f97;--accent-ink:#fff;--accent-soft:#ece4f7;--danger:#a32116;--danger-soft:#fbe7e4;--focus:#2f6fd6;--radius:10px;--shadow:0 1px 2px #1f1d220f, 0 4px 16px #1f1d220d;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;color:var(--ink);background:var(--paper);font-family:system-ui,-apple-system,Segoe UI,Roboto,Noto Sans,sans-serif;font-size:16px;line-height:1.5}*{box-sizing:border-box}body{background:var(--paper);min-height:100vh;margin:0}h1,h2{margin:0 0 .75rem;line-height:1.25}h1{font-size:1.5rem}h2{letter-spacing:.01em;font-size:1.125rem}p{margin:0 0 .75rem}a{color:var(--accent)}:focus-visible{outline:3px solid var(--focus);outline-offset:2px}.visually-hidden{clip:rect(0 0 0 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.app-header{background:var(--surface);border-bottom:1px solid var(--line);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:.5rem 1rem;padding:.75rem 1.5rem;display:flex}.brand{letter-spacing:.04em;color:var(--ink);align-items:center;gap:.5rem;font-size:1.125rem;font-weight:700;text-decoration:none;display:inline-flex}.brand-mark{background:linear-gradient(90deg, transparent 31%, var(--paper) 31% 36%, transparent 36% 64%, var(--paper) 64% 69%, transparent 69%), linear-gradient(0deg, transparent 31%, var(--paper) 31% 36%, transparent 36% 64%, var(--paper) 64% 69%, transparent 69%), var(--accent);border-radius:3px;width:1.25rem;height:1.25rem}.guest{color:var(--muted);align-items:center;gap:.75rem;display:flex}.app-main{max-width:1200px;margin:0 auto;padding:1.5rem}.panel{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:1.25rem 1.5rem}.panel.narrow{max-width:34rem;margin:2rem auto}.muted,.hint{color:var(--muted)}.hint{min-height:1.3em;margin:.25rem 0 0;font-size:.875rem}.lead{font-size:1.125rem}.loading{color:var(--muted);text-align:center;padding:3rem 0}.field{flex-direction:column;gap:.25rem;margin-bottom:1rem;display:flex}.field label,.label{font-size:.875rem;font-weight:600}input[type=text],input:not([type]){font:inherit;color:var(--ink);background:#fff;border:1px solid #8f8899;border-radius:6px;min-width:0;padding:.5rem .75rem}input[aria-invalid=true]{border-color:var(--danger)}.field.small input{width:6rem}.field-error,.form-error{color:var(--danger);margin:.25rem 0 0;font-size:.875rem}.form-error{background:var(--danger-soft);border-radius:6px;margin-top:.75rem;padding:.5rem .75rem}fieldset.choices{border:0;flex-wrap:wrap;gap:.5rem;margin:0 0 1rem;padding:0;display:flex}fieldset.choices legend{margin-bottom:.5rem;padding:0;font-size:.875rem;font-weight:600}.choice{display:inline-flex;position:relative}.choice input{opacity:0;cursor:pointer;margin:0;position:absolute;inset:0}.choice span{border:1px solid var(--line);white-space:nowrap;background:#fff;border-radius:999px;padding:.375rem .875rem;display:inline-block}.choice input:checked+span{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}.choice input:focus-visible+span{outline:3px solid var(--focus);outline-offset:2px}.choice.disabled span{color:#6b6672;background:#ebe7df;text-decoration:line-through}.choice.disabled input{cursor:not-allowed}fieldset.choices .hint,fieldset.choices .custom-tempo{flex-basis:100%}.custom-tempo{flex-wrap:wrap;gap:0 1rem;padding-top:.5rem;display:flex}.custom-tempo .field{margin-bottom:.25rem}.custom-tempo>p{flex-basis:100%}.inline-form{flex-wrap:wrap;align-items:flex-start;gap:0 .75rem;display:flex}.inline-form button{margin-top:1.6rem}.code-input{text-transform:uppercase;letter-spacing:.2em;width:11rem;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}button,.button-link{font:inherit;color:var(--ink);cursor:pointer;background:#fff;border:1px solid #8f8899;border-radius:6px;justify-content:center;align-items:center;gap:.375rem;padding:.5rem 1rem;text-decoration:none;display:inline-flex}button:hover:not(:disabled),.button-link:hover{background:var(--accent-soft)}button:disabled{cursor:not-allowed;color:#6b6672;border-color:var(--line);background:#ebe7df}button.primary{background:var(--accent);border-color:var(--accent);color:var(--accent-ink);font-weight:600}button.primary:hover:not(:disabled){background:#4a2580}button.primary:disabled{color:#2a2430;background:#b9aacd;border-color:#b9aacd}button.danger{border-color:var(--danger);color:var(--danger)}button.danger:hover:not(:disabled){background:var(--danger-soft)}.link-button{color:var(--accent);background:0 0;border:0;padding:.25rem .375rem;text-decoration:underline}.link-button:hover:not(:disabled){color:#4a2580;background:0 0}.actions{flex-wrap:wrap;align-items:center;gap:.75rem;display:flex}.lobby{grid-template-columns:minmax(0,26rem) minmax(0,1fr);align-items:start;gap:1.5rem;display:grid}.lobby-side,.lobby-lists{flex-direction:column;gap:1.5rem;min-width:0;display:flex}@media (width<=900px){.lobby{grid-template-columns:minmax(0,1fr)}}table.games{border-collapse:collapse;width:100%;font-size:.9375rem}table.games th{text-align:left;color:var(--muted);border-bottom:1px solid var(--line);padding:.375rem .5rem;font-size:.8125rem;font-weight:600}table.games td{vertical-align:middle;border-bottom:1px solid #ebe6dc;padding:.5rem}table.games tr.own td{background:var(--accent-soft)}.row-actions{text-align:right;white-space:nowrap}.row-actions>*+*{margin-left:.5rem}.row-actions .field-error{white-space:normal;text-align:right}.badge{background:var(--accent);color:var(--accent-ink);border-radius:999px;margin-left:.5rem;padding:0 .5rem;font-size:.75rem;font-weight:600;display:inline-block}.join-code{letter-spacing:.25em;margin:.25rem 0 1rem;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:2.75rem;font-weight:700}.copy-row{flex-wrap:wrap;align-items:center;gap:.5rem;display:flex}.invite-link{overflow-wrap:anywhere;background:#fff;border:1px dashed #8f8899;border-radius:6px;flex:16rem;min-width:0;padding:.5rem .75rem;font-size:.875rem}.error-screen h1{color:var(--danger)}.game-screen{--panel-width:404px;--glass:#fffdf8d1;flex-direction:column;gap:1rem;height:100%;min-height:0;display:flex;position:relative}.app:has(.game-screen){flex-direction:column;height:100dvh;display:flex}.app:has(.game-screen) .app-main{flex:1;width:100%;max-width:none;min-height:0;margin:0;padding:0}.hud-top{top:.75rem;left:.75rem;right:calc(var(--panel-width) + 1.5rem);z-index:2;pointer-events:none;align-items:flex-start;gap:1rem;display:flex;position:absolute}.game-screen[data-panel=closed] .hud-top{right:4rem}.hud-top>*{pointer-events:auto}.hud-center{text-align:center;flex:1;min-width:0}.hud-center .turn-indicator{background:var(--glass);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);margin:0;padding:.5rem 1rem;display:inline-block}.hud-center .notices:not(:has(.notice:not(:empty))){display:none}.hud-center .notices .notice{background:var(--glass);border-radius:var(--radius);margin-top:.375rem;padding:.25rem .75rem;display:inline-block}.game-header{background:var(--glass);border:1px solid var(--line);border-radius:var(--radius);width:min(40rem,100%);box-shadow:var(--shadow);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);flex:none;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:.5rem;padding:.5rem;display:grid}.player-card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);align-items:center;gap:.5rem;min-width:0;padding:.5rem;display:flex}.player-card.to-move{border-color:var(--accent);box-shadow:0 0 0 2px var(--accent-soft)}.player-stone{border:2px solid;border-radius:50%;flex:none;width:1.5rem;height:1.5rem}.player-text{flex-direction:column;flex:1;min-width:0;display:flex}.player-name{text-overflow:ellipsis;white-space:nowrap;font-weight:600;overflow:hidden}.player-meta .badge{white-space:nowrap;margin-left:0}.player-meta{white-space:nowrap;color:var(--muted);flex-wrap:nowrap;gap:.375rem;font-size:.8125rem;display:flex}.badge.offline{background:var(--danger-soft);color:var(--danger)}.scoreboard{flex-direction:column;align-items:center;display:flex}.scoreboard .label{color:var(--muted);text-transform:uppercase;letter-spacing:.06em;font-size:.75rem}.scores{font-variant-numeric:tabular-nums;font-size:1.75rem;font-weight:700}.turn-indicator{text-align:center;margin:0}.turn-indicator.your-turn{color:var(--accent);font-size:1.25rem}.clock{border:1px solid var(--line);font-variant-numeric:tabular-nums;color:var(--muted);background:var(--paper);border-radius:6px;flex:none;padding:.125rem .4375rem;font-size:1rem}.clock.running{color:var(--ink);border-color:var(--ink);background:var(--surface);font-weight:700}.clock.low{color:var(--danger);border-color:var(--danger);background:var(--danger-soft)}.notices .notice{margin:0}.notices .notice:empty{display:none}.notices .notice.error{color:var(--danger);font-weight:600}.game-scene{z-index:0;background:var(--paper);position:absolute;inset:0;overflow:hidden}.side-panel{z-index:3;width:calc(var(--panel-width) - 1.5rem);pointer-events:none;flex-direction:column;gap:.5rem;min-height:0;display:flex;position:absolute;top:.75rem;bottom:.75rem;right:.75rem}.side-panel.closed{width:auto;bottom:auto}.side-panel>*{pointer-events:auto}.panel-bar{justify-content:flex-end;gap:.5rem;display:flex}.panel-toggle{background:var(--glass);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border-radius:50%;justify-content:center;align-items:center;width:2.25rem;height:2.25rem;padding:0;display:inline-flex}.side-panel-body{flex-direction:column;gap:.75rem;min-height:0;padding-bottom:.25rem;display:flex;overflow-y:auto}.side-panel-body[hidden]{display:none}.effect-drawer-slot{top:6rem;right:calc(var(--panel-width) + .25rem);z-index:2;pointer-events:none;position:absolute}.game-screen[data-panel=closed] .effect-drawer-slot{top:8rem;right:1rem}.effect-drawer{pointer-events:auto;border-radius:var(--radius);background:var(--glass);border:1px solid var(--line);width:15rem;box-shadow:var(--shadow);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);color:var(--ink);padding:.75rem 1rem}.effect-drawer-head{align-items:center;gap:.5rem;display:flex}.effect-drawer-head h2{margin:0;font-size:1.1rem}.effect-rule{color:var(--muted);margin:.5rem 0;font-size:.875rem}.effect-steps{margin:0 0 .75rem;padding-left:1.25rem;font-size:.875rem}.effect-steps .step-done{color:var(--muted);text-decoration:line-through}.effect-steps .step-now{color:var(--accent);font-weight:700}.effect-steps .step-todo{color:var(--muted)}.effect-actions{flex-wrap:wrap;gap:.5rem}@media (prefers-reduced-motion:no-preference){.effect-drawer{animation:.15s ease-out drawer-in}}@keyframes drawer-in{0%{opacity:0;transform:translate(1.5rem)}to{opacity:1;transform:none}}.hint-bubble{z-index:20;background:var(--surface);border:1px solid var(--line);max-width:18rem;box-shadow:var(--shadow);color:var(--ink);pointer-events:none;border-radius:8px;flex-direction:column;gap:.15rem;padding:.4rem .65rem;font-size:.85rem;display:flex;position:fixed;top:0;left:0}.hint-bubble-keys{color:var(--muted);font-size:.75rem}@media (width<=900px){.app:has(.game-screen){height:auto;display:block}.game-screen{height:auto;padding:.75rem}.hud-top,.game-screen[data-panel=closed] .hud-top{flex-direction:column;order:1;align-items:stretch;position:static}.game-header{grid-template-columns:minmax(0,1fr);width:100%}.game-scene{border-radius:var(--radius);order:2;height:60vh;min-height:20rem;position:relative}.panel-toggle{display:none}.side-panel-body[hidden]{display:flex}.side-panel,.side-panel.closed{order:3;width:auto;position:static}.effect-drawer-slot,.game-screen[data-panel=closed] .effect-drawer-slot{order:3;position:static}.hint-bubble{display:none}}.control-panel,.supply-panel,.event-log,.game-menu{background:var(--glass,var(--surface));border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);padding:.875rem 1rem}.control-panel{flex-direction:column;gap:.75rem;display:flex}.control-panel .hint{color:var(--ink);margin:0;font-weight:600}.element-chip{vertical-align:middle;border-radius:6px;justify-content:center;align-items:center;padding:.1875rem;display:inline-flex}.legal{outline:2px dashed var(--accent);outline-offset:1px}.legal:focus-visible{outline:3px solid var(--focus);outline-offset:2px}.selected,[aria-pressed=true]{box-shadow:0 0 0 3px var(--accent);background:var(--accent-soft)}.board-mat{--mat-ink:#e8e6ee;color:var(--mat-ink);background:radial-gradient(at 50% 40%,#1d1d22,#0e0e11 70%);border-radius:12px;grid-template-columns:repeat(3,minmax(0,1fr));row-gap:.25rem;padding:.75rem .5rem .5rem;display:grid}.bcell{flex-direction:column;align-items:center;gap:.25rem;min-width:0;display:flex}.board-mat .cell{width:100%;min-width:0;color:inherit;font:inherit;box-shadow:none;opacity:1;background:0 0;border:0;border-radius:12px;outline:0;justify-content:center;align-items:center;padding:0;display:flex;position:relative}.board-mat .well{background:radial-gradient(circle,#050506 55%,#23242b 82%,#e2e7f280 100%);border-radius:50%;place-items:center;width:72px;height:72px;display:grid}.board-mat .well.empty:after{content:"";background:#2a2b31;border-radius:50%;width:10px;height:10px}.board-mat .well .element-chip{border-radius:50%;padding:.5rem}.cell-no{color:#b9b6c4;font-size:.75rem;position:absolute;bottom:.25rem;left:.25rem}.cell-height{color:#111;text-align:center;font-variant-numeric:tabular-nums;background:#fff;border-radius:999px;min-width:1.125rem;padding:0 .3125rem;font-size:.75rem;font-weight:700;line-height:1.125rem;position:absolute;bottom:.25rem;left:calc(50% + 14px)}.board-mat .cell.legal{background:radial-gradient(circle,#f4f1ea59 0 42px,#0000 43px);outline:0}.board-mat .cell.legal:hover{background:radial-gradient(circle,#f4f1ea80 0 42px,#0000 43px)}.board-mat .cell.sel{background:radial-gradient(circle,#ff9a3ce6 0 42px,#0000 43px)}.board-mat .cell.legal:focus-visible{outline:3px solid var(--focus);outline-offset:2px}.board-mat .cell.legal .well{box-shadow:0 0 0 2px #f4f1eab3}.board-mat .cell.sel .well{box-shadow:0 0 0 3px #ff9a3c}.board-mat .cell.out .well,.board-mat .cell.out .cell-height{opacity:.28}.board-mat .cell.effect-origin:not(.sel) .well{box-shadow:0 0 0 2px #fff}.chips{box-sizing:content-box;flex-wrap:wrap;place-content:flex-start;gap:1px;width:111px;min-height:63px;margin:0;padding:0;list-style:none;display:flex}.chips li{display:flex}.chip{box-sizing:border-box;width:15px;height:15px;box-shadow:none;background:0 0;border:0;border-radius:50%;outline:0;padding:0;line-height:0;display:inline-flex;overflow:hidden}.chip .element-chip{border-radius:50%;width:15px;height:15px;padding:2px}.chip.top .element-chip{outline:1px solid #fff}.chip.legal{outline-offset:0;outline:2px solid #f4f1eabf}.chip.sel{background:0 0;outline:2px solid #ff9a3c;box-shadow:0 0 0 2px #ff9a3c99}.chip.out{opacity:.28}.chip-more{color:#fff;background:#3a3a44;border-radius:8px;justify-content:center;align-items:center;min-width:15px;height:15px;padding:0 3px;font-size:.6875rem;font-weight:700;line-height:1}.element-row{background:var(--surface);border:1px solid var(--line);border-radius:12px;justify-content:space-between;gap:.5rem;padding:.5rem .75rem;display:flex}.element-button{box-shadow:none;background:0 0;border:0;border-radius:50%;justify-content:center;align-items:center;padding:0;display:inline-flex;position:relative}.element-button .element-chip{border-radius:50%;width:40px;height:40px;padding:0}.element-count{color:#111;border:1px solid var(--line);text-align:center;font-variant-numeric:tabular-nums;background:#fff;border-radius:999px;min-width:1.125rem;padding:0 .25rem;font-size:.75rem;font-weight:700;line-height:1.0625rem;position:absolute;top:-4px;right:-6px}.element-button.legal{outline:0;box-shadow:0 0 0 3px #f4f1ea8c}.element-button.sel{outline-offset:2px;box-shadow:none;background:0 0;outline:3px solid #ff9a3c}.element-button.out{opacity:.45}.element-button.blocked{opacity:1}.element-button.blocked .element-chip{color:#e6e5ea!important;background:#9a98a1!important}.element-button.blocked:after{content:"";border-top:3px solid var(--danger);pointer-events:none;position:absolute;top:50%;left:0;right:0;transform:rotate(-20deg)}.effect-panel{gap:.5rem}.resign-confirm p{margin-bottom:.5rem;font-weight:600}.supply-row{margin-bottom:.5rem}.supply-row.to-move h3{color:var(--accent)}.supply-panel h3{margin:0 0 .25rem;font-size:.875rem}.counts{flex-wrap:wrap;gap:.5rem;margin:0;padding:0;list-style:none;display:flex}.counts li{font-variant-numeric:tabular-nums;align-items:center;gap:.25rem;display:inline-flex}.event-log-body{max-height:14rem;font-size:.875rem;overflow-y:auto}.event-log-body ol{margin:0;padding-left:2rem;list-style-position:outside}.game-menu{flex-wrap:wrap;align-items:center;gap:.5rem;display:flex}.connection{align-items:center;gap:.375rem;margin:0;display:inline-flex}.connection-dot{background:#3fa34d;border-radius:50%;width:.625rem;height:.625rem}.connection.reconnecting .connection-dot{background:#f2c230}.connection.disconnected .connection-dot{background:var(--danger)}.end-dialog{z-index:10;max-width:26rem;position:fixed;inset:auto 1rem 1rem auto}.end-dialog h2{font-size:1.5rem}.scene-canvas{position:absolute;inset:0}.scene-message{height:100%;color:var(--muted,inherit);text-align:center;place-items:center;margin:0;padding:1.5rem;display:grid}.scene-tooltip{pointer-events:none;background:var(--surface);border:1px solid var(--line);min-width:8rem;box-shadow:var(--shadow);white-space:nowrap;border-radius:6px;padding:.4rem .6rem;font-size:.8125rem;line-height:1.35;transform:translate(-50%,calc(-100% - 14px))}.scene-tooltip-title{margin-bottom:.25rem;font-weight:600}.scene-tooltip-list{flex-direction:column-reverse;gap:.15rem;margin:0;padding:0;list-style:none;display:flex}.scene-tooltip-list .top{font-weight:700}.scene-tooltip-list .hover{font-weight:700;text-decoration:underline}.scene-tooltip-chip{vertical-align:middle;border-radius:50%;place-items:center;width:1.1rem;height:1.1rem;margin-right:.3rem;display:inline-grid}.score-row{align-items:center;gap:.4rem;display:inline-flex}.score-pulse{min-width:1.6rem;color:var(--accent);font-weight:700}.score-pulse.seat-0{text-align:right}@media (prefers-reduced-motion:no-preference){.score-pulse:not(:empty){animation:.4s ease-out score-pulse}}@keyframes score-pulse{0%{opacity:0;transform:translateY(.4rem)}to{opacity:1;transform:none}}.notices .notice.announcement{font-weight:600}.board-mat .cell.changed .well{outline-offset:2px;outline:3px solid #0b7285}.view-reset{width:2.25rem;height:2.25rem;color:var(--ink);background:var(--glass,var(--surface));border:1px solid var(--line);cursor:pointer;border-radius:50%;justify-content:center;align-items:center;padding:0;display:inline-flex}.lobby-link{height:2.25rem;color:var(--ink);background:var(--glass,var(--surface));-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border:1px solid var(--line);border-radius:1.125rem;align-items:center;padding:0 .875rem;font-weight:600;text-decoration:none;display:inline-flex}.element-row .element-button:hover:not(:disabled),.board-mat .chip:hover:not(:disabled){background:0 0}.element-row .element-button:focus-visible,.board-mat .chip:focus-visible,.board-mat .cell:focus-visible{outline:3px solid var(--focus);outline-offset:2px}.element-row .element-button.sel:focus-visible{box-shadow:0 0 0 3px #ff9a3c}.hud-left{flex-direction:column;flex:none;align-items:flex-start;gap:.5rem;width:min(40rem,100%);display:flex}.hud-left .game-header{width:100%}.last-move{background:var(--glass,var(--surface));border:1px solid var(--line);border-radius:var(--radius);width:min(18.5rem,100%);box-shadow:var(--shadow);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);padding:.5rem .625rem;font-size:.8125rem}.last-move-locks{margin:.25rem 0 0;font-size:.8125rem}.last-move header{justify-content:space-between;align-items:center;margin-bottom:.5rem;display:flex}.last-move h2{margin:0;font-size:.9375rem}.last-move-close{border:1px solid var(--line);background:var(--surface);min-width:1.75rem;min-height:1.75rem;color:var(--ink);cursor:pointer;border-radius:6px}.last-move-body{justify-content:space-between;align-items:flex-start;gap:.5rem;display:flex}.last-move ol{flex-direction:column;gap:.375rem;margin:0;padding:0;list-style:none;display:flex}.last-move li{align-items:flex-start;gap:.5rem;display:flex}.last-move-num{background:var(--ink);width:1.25rem;height:1.25rem;color:var(--surface);border-radius:50%;flex:none;place-items:center;font-size:.75rem;font-weight:700;display:inline-grid}.last-move-fx{color:var(--muted);font-size:.8125rem;display:block}.last-move-map{flex:none;grid-template-columns:repeat(3,1.25rem);gap:.1875rem;display:grid}.last-move-map span{background:var(--line);height:1.25rem;color:var(--ink);border-radius:50%;place-items:center;font-size:.625rem;font-weight:800;display:grid}.last-move-map span.marked{background:var(--ink);color:var(--surface)}.last-move-points{border-top:1px solid var(--line);margin:.5rem 0 0;padding-top:.5rem;font-size:.8125rem}.turn-marker{color:#fff;text-align:center;white-space:nowrap;pointer-events:none;background:#1f1d22;border:2px solid #fff;border-radius:999px;min-width:1.5rem;padding:.0625rem .375rem;font-size:.875rem;font-weight:800;display:inline-block}.event-log-body li{margin-bottom:.125rem}.event-log-body li .element-icon{vertical-align:-2px}