:root{--blue:#1264aa;--navy:#15365c;--ink:#19334c;--border:#d6e6f5;--soft:#eff7ff;--muted:#657991;--green:#15754b}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:linear-gradient(#edf7ff,#f8fbff 420px);color:var(--ink);font:15px/1.55 system-ui,-apple-system,"Segoe UI",Arial,sans-serif}button,input,select{font:inherit}button{cursor:pointer;transition:filter .15s,transform .15s}button:hover:not(:disabled){filter:brightness(.96)}button:active:not(:disabled){transform:translateY(1px)}button:disabled{opacity:.55;cursor:not-allowed}a{color:#1264aa}.skip{position:absolute;left:10px;top:-100px;z-index:40;background:#fff;padding:10px}.skip:focus{top:10px}:focus-visible{outline:3px solid #ffaf39;outline-offset:2px}.top{background:#fff;border-bottom:1px solid var(--border)}.top-inner{max-width:1340px;margin:auto;display:flex;align-items:center;justify-content:space-between;padding:12px 22px;gap:20px}.brand{display:flex;align-items:center;gap:10px;color:var(--navy);text-decoration:none}.brand b{display:block;font-size:17px}.brand small{display:block;font-size:11px;color:var(--muted)}nav{display:flex;gap:18px;font-weight:650}main{max-width:1340px;margin:auto;padding:22px}.intro{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;padding:12px 3px 22px}.eyebrow{color:var(--blue);font-size:12px;font-weight:800;letter-spacing:.12em}.eyebrow.small{font-size:10px}h1{font-size:clamp(30px,4vw,48px);color:var(--navy);margin:4px 0 2px;letter-spacing:-.05em}h2{color:var(--navy);line-height:1.25;font-size:19px;margin:0 0 13px}.intro p{max-width:740px;color:#51677e;margin:0}.status-pill{background:#e3f5e9;border:1px solid #abdbbb;color:#126234;white-space:nowrap;padding:9px 16px;border-radius:25px;font-weight:700}.game-layout{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(290px,.85fr);gap:18px;align-items:start}.board-panel,.card{background:#fff;border:1px solid var(--border);border-radius:20px;box-shadow:0 16px 40px #2b648415}.board-panel{padding:16px}.board-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px}.board-head h2{margin:3px 0 0}.head-buttons{display:flex;gap:7px;flex-wrap:wrap}.subtle,.outline{background:#eff7ff;color:#185186;border:1px solid #bdd8ed;border-radius:10px;padding:9px 12px;font-weight:700}.primary{background:var(--blue);color:#fff;border:1px solid var(--blue);border-radius:10px;padding:10px 14px;font-weight:750}.full{width:100%;margin-top:10px}.opponent{display:flex;align-items:center;gap:12px;padding:8px 8px 12px}.opponent strong{display:block}.opponent small{display:block;font-size:12px;color:var(--muted)}.player-dot{width:40px;height:40px;border-radius:10px;display:grid;place-items:center;font-size:27px}.player-dot.black{background:#243b53;color:#fff}.player-dot.white{background:#e9e2d1;color:#263950}.clock{margin-left:auto;background:#e8f2fa;border-radius:10px;padding:6px 13px;font-size:20px;font-variant-numeric:tabular-nums;color:var(--navy)}.clock.active{background:#d5f0df;color:#145f38}.clock.low{background:#ffe2d9;color:#9a2417}#scene-wrap{position:relative;height:clamp(380px,53vw,650px);overflow:hidden;background:radial-gradient(circle at 50% 48%,#edf9ff,#c9e3f6);border-radius:15px;touch-action:pan-y}#three-scene{width:100%;height:100%;touch-action:none}#three-scene canvas{display:block;width:100%;height:100%}.scene-help{position:absolute;left:50%;transform:translateX(-50%);bottom:9px;pointer-events:none;white-space:nowrap;background:#ffffffd9;padding:4px 12px;border-radius:20px;color:#315572;font-size:11px}.loading{position:absolute;inset:0;display:grid;place-items:center;background:#e9f5ff;color:#315572;font-weight:800}.loading.hidden{display:none}.bottom-actions{display:flex;gap:9px;flex-wrap:wrap;border-top:1px solid var(--border);margin-top:6px;padding-top:14px}.sidebar{display:grid;gap:14px}.card{padding:20px}.card p.smallprint,.smallprint{color:#60758b;font-size:12px;margin:8px 0 12px}.card label{display:block;font-weight:700;margin:12px 0 5px;font-size:13px}.card input,.card select{width:100%;background:#fff;color:var(--ink);border:1px solid #bfd4e6;border-radius:10px;padding:11px 12px;min-width:0}.button-pair{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-top:11px}.join{margin-top:14px;border-top:1px solid var(--border);padding-top:9px}.join-row{display:grid;grid-template-columns:1fr auto;gap:8px}.invite{background:#e8f6fc;border:1px solid #b7ddf3;border-radius:12px;padding:14px;margin-top:15px}.invite>span{font-size:11px;letter-spacing:.08em;font-weight:800;color:#386886}.code-line{display:flex;gap:7px;align-items:center;justify-content:space-between}.code-line strong{font-size:27px;letter-spacing:.1em;color:#124b7e}.invite small{display:block;color:#61768a}.hidden{display:none!important}.history-header{display:flex;align-items:center;justify-content:space-between;gap:10px}.history-header h2{margin:0}.history-header span{color:var(--muted);font-size:12px}.moves{max-height:230px;min-height:90px;overflow:auto;display:grid;grid-template-columns:1fr 1fr;align-content:start;gap:0;border-radius:10px;margin-top:13px;background:#f2f8ff}.moves .move{padding:7px 12px;border-bottom:1px solid #dcecf6;font-weight:650}.moves .move:nth-child(4n+1),.moves .move:nth-child(4n+2){background:#e5f2ff}.moves .empty{grid-column:1/-1;padding:10px;color:var(--muted)}.turn-label{font-weight:800;color:var(--blue)}.game-message{padding:12px;border-radius:10px;background:#e9f5ff;color:#214c70;margin:0}.info{margin:22px 0;background:#fff;border:1px solid var(--border);border-radius:20px;padding:20px;color:#526880}.info h2{margin-bottom:13px}.tips{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.tips>div{border-radius:12px;background:var(--soft);padding:15px}.tips b{color:var(--navy)}.tips p{margin:5px 0 0}.info>p{font-size:12px}footer{text-align:center;background:#163c63;color:#dcefff;padding:22px}footer a{color:#fff}.dialog{position:fixed;inset:0;background:#0d233b9c;z-index:60;display:grid;place-items:center;padding:15px}.dialog-card{background:#fff;border-radius:18px;padding:26px;text-align:center;max-width:430px;width:100%}.promotion-choices{display:flex;justify-content:center;gap:8px;margin:20px 0}.promotion-choices button{font-size:31px;min-width:60px;background:#f0f7ff;border:1px solid #bbd4e9;border-radius:9px;padding:8px}@media(max-width:900px){.game-layout{grid-template-columns:1fr}.sidebar{grid-template-columns:1fr 1fr}.sidebar .card:last-child{grid-column:1/-1}}@media(max-width:620px){main{padding:12px}.intro{display:block}.status-pill{display:inline-block;margin-top:13px}.top-inner{padding:10px 14px}.top nav{font-size:12px}.board-panel{padding:9px}.board-head{padding:7px}.head-buttons button{font-size:11px;padding:7px}.sidebar{grid-template-columns:1fr}.sidebar .card:last-child{grid-column:auto}#scene-wrap{height:min(100vw,500px);min-height:340px}.tips{grid-template-columns:1fr}.scene-help{font-size:10px}.opponent{gap:8px}.clock{font-size:18px}.card{padding:16px}}