:root{--bg:#f3ede1;--panel:#fffdf8;--board:#e3b878;--board-line:#6b4a22;--stone-black:#1f1c18;--stone-white:#faf7f0;--ink:#2b2419;--ink-soft:#6f6455;--accent:#b4552d;--accent-soft:#e8d5c4;--ok:#2f7d4f;--warn:#b07d18;--danger:#a33327;--line:#ddd2c0;--radius:14px;--shadow:0 2px 12px #4632191f}*{box-sizing:border-box}html,body{min-height:100%;margin:0;padding:0}body{background:var(--bg);color:var(--ink);-webkit-font-smoothing:antialiased;font-family:system-ui,-apple-system,Segoe UI,PingFang SC,Hiragino Sans GB,Microsoft YaHei,sans-serif;line-height:1.5}button{font:inherit;cursor:pointer}input{font:inherit}.page{flex-direction:column;justify-content:center;align-items:center;gap:16px;min-height:100dvh;padding:24px 16px;display:flex}.room{flex-direction:column;align-items:center;gap:10px;min-height:100dvh;padding:14px 16px 20px;display:flex}.panel{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);width:100%;max-width:420px;box-shadow:var(--shadow);padding:22px}.stack{flex-direction:column;gap:12px;display:flex}.title{letter-spacing:2px;margin:0;font-size:26px}.subtitle{color:var(--ink-soft);margin:0;font-size:14px}.divider{background:var(--line);height:1px;margin:4px 0}.field{flex-direction:column;gap:6px;display:flex}.label{color:var(--ink-soft);font-size:13px}.input{border:1px solid var(--line);width:100%;color:var(--ink);background:#fff;border-radius:10px;padding:11px 12px}.input:focus{outline:2px solid var(--accent-soft);outline-offset:1px;border-color:var(--accent)}.input-code{text-transform:uppercase;letter-spacing:6px;text-align:center;font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:18px}.btn{background:var(--accent-soft);color:var(--ink);border:1px solid #0000;border-radius:10px;padding:11px 16px;font-weight:600;transition:filter .12s}.btn:hover:not(:disabled){filter:brightness(.96)}.btn:disabled{opacity:.5;cursor:not-allowed}.btn-primary{background:var(--accent);color:#fff}.btn-ghost{border-color:var(--line);color:var(--ink-soft);background:0 0;font-weight:500}.btn-block{width:100%}.btn-sm{padding:4px 10px;font-size:13px;font-weight:500}a.btn{text-align:center;text-decoration:none;display:block}.code-box{background:var(--accent-soft);border-radius:12px;flex-direction:column;align-items:center;gap:8px;padding:14px;display:flex}.code-value{letter-spacing:8px;margin-right:-8px;font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:34px;font-weight:700}.status{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);flex-direction:column;gap:8px;width:100%;max-width:640px;padding:10px 14px;display:flex}.status-head{color:var(--ink-soft);justify-content:space-between;align-items:center;gap:10px;font-size:13px;display:flex}.status-line{text-align:center;margin:0;font-size:16px;font-weight:600}.status-line[data-tone=turn]{color:var(--ok)}.status-line[data-tone=wait]{color:var(--ink-soft)}.status-line[data-tone=warn]{color:var(--warn)}.status-line[data-tone=over]{color:var(--accent)}.players{gap:8px;display:flex}.player{border:1px solid var(--line);background:#fff;border-radius:10px;flex:1;align-items:center;gap:8px;min-width:0;padding:6px 10px;font-size:14px;display:flex}.player[data-active=true]{border-color:var(--accent);box-shadow:inset 0 0 0 1px var(--accent)}.player-stone{border:1px solid var(--board-line);border-radius:50%;flex:none;width:16px;height:16px}.player-stone[data-color=black]{background:var(--stone-black)}.player-stone[data-color=white]{background:var(--stone-white)}.player-name{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.player-tag{color:var(--ink-soft);flex:none;margin-left:auto;font-size:12px}.player-tag[data-off=true]{color:var(--danger)}.board-wrap{width:min(100%,100dvh - 230px,640px)}.board{aspect-ratio:1;width:100%;box-shadow:var(--shadow);touch-action:manipulation;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;border-radius:10px;display:block}.board[data-disabled=true]{cursor:default}.board[data-disabled=false]{cursor:pointer}.rematch{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);flex-wrap:wrap;justify-content:center;align-items:center;gap:10px;width:100%;max-width:640px;padding:10px 14px;font-size:14px;display:flex}.rematch-votes{color:var(--ink-soft);font-size:13px}.toast{background:var(--ink);color:#fff;max-width:min(90vw,420px);box-shadow:var(--shadow);z-index:20;border-radius:999px;padding:10px 16px;font-size:14px;position:fixed;bottom:28px;left:50%;transform:translate(-50%)}.notice{border-radius:var(--radius);border:1px solid var(--line);background:var(--panel);text-align:center;width:100%;max-width:640px;padding:12px 16px;font-size:14px}.notice[data-tone=warn]{border-color:var(--warn);color:var(--warn)}.notice[data-tone=danger]{border-color:var(--danger);color:var(--danger)}.center-note{text-align:center;color:var(--ink-soft);margin:0;font-size:14px}.loading{min-height:40vh;color:var(--ink-soft);justify-content:center;align-items:center;display:flex}