: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{text-transform:uppercase;letter-spacing:.2em;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}