:root{--bg:#fdf8ef;--panel:#fff;--ink:#2f3b36;--muted:#6f7f78;--accent:#2f8f6b;--accent-ink:#fff;--line:#e4ddcf;--board:#3f9a6b;--board-line:#2c6e4c;--hint:#ffffff59;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}*{box-sizing:border-box}body{background:var(--bg);color:var(--ink);margin:0;font-family:Hiragino Maru Gothic ProN,Hiragino Sans,Noto Sans JP,system-ui,sans-serif;line-height:1.6}.page{max-width:880px;margin:0 auto;padding:24px 16px 48px}h1{margin:8px 0;font-size:28px}h2{margin:0 0 12px;font-size:18px}.lead{color:var(--muted);margin-top:0}.back{color:var(--muted);text-decoration:none}button,input{font:inherit}button{cursor:pointer;border:1px solid var(--line);background:var(--panel);border-radius:10px;padding:8px 14px}button.primary{background:var(--accent);color:var(--accent-ink);border-color:var(--accent);font-weight:700}button:disabled{opacity:.5;cursor:default}input{border:1px solid var(--line);background:#fff;border-radius:10px;padding:8px 12px}.gallery{grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:16px;padding:0;list-style:none;display:grid}.game-card{background:var(--panel);border:1px solid var(--line);color:inherit;border-radius:16px;gap:4px;padding:20px;text-decoration:none;display:grid}.game-card:hover{border-color:var(--accent)}.game-icon{font-size:40px}.game-title{font-size:20px;font-weight:700}.game-description{color:var(--muted);font-size:14px}.game-mode{color:var(--accent);background:#e8f4ee;border-radius:999px;justify-self:start;padding:2px 8px;font-size:12px}.panel{background:var(--panel);border:1px solid var(--line);border-radius:16px;margin:16px 0;padding:20px}.profile-form{gap:16px;display:grid}.field{gap:6px;display:grid}.current-emoji{vertical-align:middle;font-size:24px}.emoji-row{flex-wrap:wrap;gap:6px;display:flex}.emoji{padding:4px 8px;font-size:22px}.emoji.selected{border-color:var(--accent);background:#e8f4ee}.emoji-more summary{cursor:pointer;color:var(--muted);margin:6px 0}.code-form{gap:8px;display:flex}.code-form input{letter-spacing:.1em;width:8em}.message{color:#b5452f}.room-header{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px;display:flex}.room-share{align-items:center;gap:8px;display:flex}.room-code{letter-spacing:.15em;color:var(--muted);font-size:16px;font-weight:700}.status{color:var(--muted)}.players{grid-template-columns:1fr 1fr;gap:8px;margin:12px 0;display:grid}.player{background:var(--panel);border:1px solid var(--line);border-radius:12px;flex-wrap:wrap;align-items:center;gap:6px;padding:8px 12px;display:flex}.player.empty{color:var(--muted)}.player.offline{opacity:.6}.you,.offline-note,.rematch-note{color:var(--accent);background:#e8f4ee;border-radius:999px;padding:0 6px;font-size:12px}.offline-note{color:#b5452f;background:#fbe9e4}.turn{font-size:18px;font-weight:700}.spectators{color:var(--muted)}.othello{justify-items:center;gap:8px;margin:12px 0;display:grid}.othello-score{align-items:center;gap:12px;font-weight:700;display:flex}.pass{color:var(--muted);font-size:14px;font-weight:400}.othello-board{aspect-ratio:1;background:var(--board-line);border-radius:8px;grid-template-rows:repeat(8,1fr);grid-template-columns:repeat(8,1fr);gap:2px;width:min(100%,480px);padding:2px;display:grid}.othello-cell{background:var(--board);border:0;border-radius:0;place-items:center;padding:0;display:grid}.othello-cell:disabled{opacity:1;cursor:default}.othello-cell.hint:after{content:"";aspect-ratio:1;background:var(--hint);border-radius:50%;width:24%}.othello-cell.hint:hover{background:#4aab7a}.stone{aspect-ratio:1;border-radius:50%;width:80%;box-shadow:0 2px 2px #0000004d}.stone.black{background:#1d1d1d}.stone.white{background:#f6f6f6}.site-header{background:var(--panel);border-bottom:1px solid var(--line)}.site-header-inner{justify-content:space-between;align-items:center;gap:12px;max-width:880px;margin:0 auto;padding:10px 16px;display:flex}.brand{color:var(--ink);font-size:18px;font-weight:700;text-decoration:none}.profile-chip{text-overflow:ellipsis;white-space:nowrap;border-radius:999px;max-width:60%;padding:4px 14px;font-size:15px;overflow:hidden}.profile-chip[aria-expanded=true]{border-color:var(--accent);background:#e8f4ee}.profile-panel{max-width:880px;margin:0 auto;padding:0 16px 16px}.welcome{border-color:var(--accent)}.welcome h2{margin-bottom:4px}.blocks{grid-template-columns:auto minmax(0,200px);justify-content:start;align-items:start;gap:16px;display:grid}.blocks-board-wrap{touch-action:none;position:relative}.blocks-board{aspect-ratio:1/2;background:#2f3b36;border-radius:8px;grid-template-rows:repeat(20,1fr);grid-template-columns:repeat(10,1fr);gap:1px;width:min(100vw - 32px,min(100dvh - 350px,600px)/2);padding:1px;display:grid}.blocks-cell{background:#3a4842;border-radius:3px}.blocks-cell.ghost{outline-offset:-3px;background:0 0;outline:2px dashed #ffffff59}.blocks-cell.empty{background:0 0}.kind-I{background:#8fcfe0}.kind-O{background:#f3d681}.kind-T{background:#c6a8e3}.kind-S{background:#a3d9a0}.kind-Z{background:#eea9a4}.kind-J{background:#a3b8ec}.kind-L{background:#f2bb8e}.blocks-overlay{text-align:center;background:#fdf8efe6;border-radius:8px;place-content:center;justify-items:center;gap:8px;padding:16px;display:grid;position:absolute;inset:0}.blocks-over{margin:0;font-size:22px;font-weight:700}.blocks-best{color:var(--accent);margin:0;font-weight:700}.blocks-side{grid-template-columns:1fr 1fr;align-content:start;gap:10px;display:grid}.blocks-stat{background:var(--panel);border:1px solid var(--line);border-radius:12px;gap:4px;padding:8px 12px;display:grid}.blocks-stat small{color:var(--muted)}.blocks-stat strong{font-size:22px}.blocks-next{grid-template-rows:repeat(2,16px);grid-template-columns:repeat(4,16px);gap:1px;display:grid}.blocks-controls{grid-template-columns:repeat(6,1fr);gap:8px;max-width:480px;margin-top:16px;display:grid}.blocks-control{touch-action:none;-webkit-user-select:none;user-select:none;padding:12px 0;font-size:22px}.blocks-help{color:var(--muted);font-size:13px}@media (width<=560px){.blocks{grid-template-columns:1fr}.blocks-side{order:-1;grid-template-columns:repeat(5,1fr);gap:6px}.blocks-stat{padding:6px}.blocks-stat strong{font-size:16px}.blocks-board-wrap{justify-self:center}.blocks-stat small{white-space:nowrap;font-size:11px}.blocks-board{width:min(100vw - 32px,50dvh - 195px)}}@media (hover:none){.blocks-help{display:none}}.chess{justify-items:center;gap:10px;margin:12px 0;display:grid}.chess-board-wrap{width:min(100%,480px);position:relative}.chess-board{aspect-ratio:1;border:2px solid #6b5a45;border-radius:8px;grid-template-rows:repeat(8,1fr);grid-template-columns:repeat(8,1fr);display:grid;overflow:hidden}.chess-square{border:0;border-radius:0;place-items:center;padding:0;font-size:min(9vw,44px);line-height:1;display:grid;position:relative}.chess-square.light{background:#f0e4cf}.chess-square.dark{background:#b9956f}.chess-square.last{box-shadow:inset 0 0 0 100px #f6d65c73}.chess-square.selected{box-shadow:inset 0 0 0 100px #2f8f6b73}.chess-square.check{box-shadow:inset 0 0 0 100px #dc3c328c}.chess-square.target:after{content:"";aspect-ratio:1;background:#2f8f6b8c;border-radius:50%;width:28%;position:absolute}.chess-square.target.capture:after{box-sizing:border-box;background:0 0;border:4px solid #2f8f6b99;width:86%}.chess-piece{font-variant-emoji:text;z-index:1;font-family:Apple Symbols,Segoe UI Symbol,"Noto Sans Symbols 2",serif;position:relative}.chess-piece.white{color:#fffdf8;-webkit-text-stroke:1px #2f3b36;text-shadow:0 1px 2px #00000073}.chess-piece.black{color:#22201d}.chess-coord{color:#3c2d1eb3;font-size:10px;font-weight:700;position:absolute}.chess-coord.file{bottom:1px;right:3px}.chess-coord.rank{top:1px;left:3px}.chess-promotion{background:#fdf8efeb;border-radius:8px;place-content:center;justify-items:center;gap:10px;display:grid;position:absolute;inset:0}.chess-promotion p{margin:0;font-weight:700}.chess-promotion-choices{gap:8px;display:flex}.chess-promotion-choices button{background:#b9956f;padding:4px 12px;font-size:40px}.chess-actions{flex-wrap:wrap;justify-content:center;align-items:center;gap:8px;display:flex}