:root{--bg:#f6f3ee;--surface:#fff;--ink:#23201c;--muted:#776f66;--line:#e4ddd2;--accent:#2f6f5e;--accent-ink:#fff;--accent-soft:#e3f0eb;--warn:#b5541c;--warn-soft:#fbeadf;--danger:#b3261e;--wood:#e9c98f;--wood-line:#6b4f2a;--felt:#2e7d4f;--felt-line:#1d5534;--highlight:#ffc40073;--target:#2f6f5e59;--radius:10px;--shadow:0 1px 2px #0000000f, 0 4px 16px #0000000d;--vh:100vh;color:var(--ink);background:var(--bg);font-family:Hiragino Sans,Noto Sans JP,Yu Gothic UI,system-ui,sans-serif;line-height:1.6}@supports (height:100dvh){:root{--vh:100dvh}}@media (prefers-color-scheme:dark){:root{--bg:#1b1a18;--surface:#262421;--ink:#eeeae4;--muted:#a39b90;--line:#3a3733;--accent:#5fb39b;--accent-ink:#10201b;--accent-soft:#23382f;--warn:#f0a070;--warn-soft:#3c2a1f;--danger:#f2827a;--wood:#c9a46a;--shadow:none}}*{box-sizing:border-box}body{background:var(--bg);margin:0}h1,h2,h3{margin:0 0 .5em;line-height:1.3}p{margin:0 0 .75em}a{color:var(--accent)}.topbar{border-bottom:1px solid var(--line);background:var(--surface);flex-wrap:wrap;align-items:baseline;gap:4px 12px;padding:12px 20px;display:flex}.lang-switch{border:1px solid var(--line);border-radius:999px;align-self:center;margin-left:auto;display:inline-flex;overflow:hidden}.lang-switch button{color:var(--muted);font:inherit;cursor:pointer;background:0 0;border:0;padding:3px 10px;font-size:.8rem}.lang-switch button:hover{color:var(--ink)}.lang-switch button.is-active{background:var(--accent-soft);color:var(--ink);font-weight:600}.lang-switch+.creator-link{margin-left:0}.creator-link{color:var(--muted);align-items:center;gap:5px;margin-left:auto;font-size:.85rem;text-decoration:none;display:inline-flex}.creator-link:hover{color:var(--ink)}.brand{color:var(--ink);letter-spacing:.02em;font-size:1.15rem;font-weight:800;text-decoration:none}.page{max-width:1180px;margin:0 auto;padding:20px 16px 48px}.page-narrow{max-width:640px}.hero{margin:16px 0 20px}.hero h1{font-size:1.8rem}.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);margin-bottom:16px;padding:18px 20px}.muted{color:var(--muted)}.small{font-size:.85rem}.error{color:var(--danger)}.row{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.btn{appearance:none;border:1px solid var(--line);background:var(--surface);color:var(--ink);font:inherit;cursor:pointer;border-radius:8px;align-items:center;gap:6px;padding:8px 14px;font-size:.95rem;text-decoration:none;display:inline-flex}.btn:hover:not(:disabled){border-color:var(--accent)}.btn:disabled{opacity:.5;cursor:default}.btn-primary{background:var(--accent);border-color:var(--accent);color:var(--accent-ink);font-weight:600}.btn-danger{background:var(--danger);border-color:var(--danger);color:#fff}.btn-quiet{color:var(--muted);background:0 0;border-color:#0000}.btn-chip{color:var(--muted);background:var(--surface);border-color:var(--line);white-space:nowrap;border-radius:999px;gap:5px;padding:5px 12px;font-size:.82rem;font-weight:500;transition:border-color .15s,color .15s,background .15s}.btn-chip:hover:not(:disabled){color:var(--ink);border-color:var(--accent)}.btn-small{padding:4px 10px;font-size:.85rem}.btn-large{justify-content:center;width:100%;padding:12px 20px;font-size:1.05rem}.link{appearance:none;color:var(--accent);cursor:pointer;font:inherit;background:0 0;border:0;padding:0;text-decoration:underline}.badge{border-radius:999px;padding:2px 10px;font-size:.8rem}.badge.is-warn{background:var(--warn-soft);color:var(--warn)}.form fieldset{border:0;margin:0 0 18px;padding:0}.form legend,.field>span{margin-bottom:8px;font-weight:700;display:block}.field{margin-bottom:18px;display:block}.field select,.field textarea,.chat-input input{width:100%;font:inherit;border:1px solid var(--line);background:var(--surface);color:var(--ink);border-radius:8px;padding:8px 10px}.field textarea{resize:vertical}.turnstile{min-height:65px;margin:8px 0 16px}.waiting{max-width:720px;margin:0 auto}.participants{gap:6px;margin:0;padding:0;list-style:none;display:grid}.participants li{align-items:center;gap:8px;display:flex}.invite-head{flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:12px;display:flex}.invite-expiry{color:var(--muted);font-variant-numeric:tabular-nums;font-size:.85rem}.invite-expiry.is-expired{color:var(--danger)}.tabs{border-bottom:1px solid var(--line);gap:4px;margin-bottom:8px;display:flex}.tabs button{appearance:none;font:inherit;color:var(--muted);cursor:pointer;background:0 0;border:0;border-bottom:2px solid #0000;padding:6px 12px}.tabs button.is-active{color:var(--ink);border-bottom-color:var(--accent);font-weight:700}.invite-text{border:1px solid var(--line);background:var(--bg);width:100%;color:var(--ink);resize:vertical;border-radius:8px;margin-bottom:8px;padding:10px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.85rem}.room-head{justify-content:space-between;align-items:baseline;margin-bottom:12px;display:flex}.room-head h1{font-size:1.3rem}.room-back,.room-menu-btn{display:none}.room-grid{grid-template-columns:minmax(0,1fr) minmax(280px,380px);align-items:start;gap:20px;display:grid}.board-col{flex-direction:column;align-items:stretch;gap:10px;min-width:0;display:flex}.board-area{justify-content:center;display:flex}.side-col{flex-direction:column;gap:12px;display:flex;position:sticky;top:12px}.play-foot{display:contents}.play-notice{margin:0;display:none}.turn-line{flex-wrap:wrap;gap:12px;min-height:1.6em;font-size:.9rem;display:flex}.actions{justify-content:flex-start}.mobile-tabs{display:none}.player{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:8px 14px;position:relative;overflow:hidden}.player.is-turn{border-color:var(--accent);box-shadow:inset 4px 0 0 var(--accent)}.player-main{align-items:baseline;gap:10px;display:flex}.player-seat{color:var(--muted);border:1px solid var(--line);border-radius:4px;padding:0 6px;font-size:.8rem}.player-name{font-weight:700}.player-lastmove{color:var(--muted);font-size:.8rem}.player-main .avatar{align-self:center}.avatar{object-fit:cover;background:var(--accent-soft);color:var(--accent);border-radius:50%;flex:none;place-items:center;font-weight:700;line-height:1;display:inline-grid}.avatar.is-lg{width:42px;height:42px;font-size:1.1rem}.avatar.is-md{width:32px;height:32px;font-size:.95rem}.avatar.is-sm{width:22px;height:22px;font-size:.7rem}.player-clock{font-variant-numeric:tabular-nums;color:var(--muted);margin-left:auto;font-weight:700}.player-clock.is-running{color:var(--ink)}.player-status{align-items:center;gap:6px;margin-top:2px;font-size:.9rem;display:flex}.player-status.is-active{color:var(--accent)}.player-status.is-badge{width:fit-content;color:var(--accent-ink);background:var(--accent);border-radius:999px;padding:1px 10px;font-size:.78rem;font-weight:700;display:inline-flex}.player-status.is-warn{color:var(--warn);font-weight:700}.player-thinking-bar{background:linear-gradient(90deg, transparent, var(--accent), transparent);pointer-events:none;background-repeat:no-repeat;background-size:40% 100%;height:2px;animation:1.8s linear infinite thinking-flow;position:absolute;bottom:0;left:0;right:0}@keyframes thinking-flow{0%{background-position:-40% 0}to{background-position:140% 0}}.player-recover{background:var(--warn-soft);border-radius:8px;margin-top:8px;padding:10px}.player-recover p{margin-bottom:6px}.dot{background:currentColor;border-radius:50%;width:8px;height:8px;animation:1.4s ease-in-out infinite pulse;display:inline-block}.dot.is-waiting{color:var(--accent)}@keyframes pulse{50%{opacity:.25}}.board-area[data-turn=me] :is(.shogi-board,.othello-board,.chess-board){box-shadow:0 0 0 2px var(--accent), 0 0 18px color-mix(in srgb, var(--accent) 45%, transparent)}.bubble{align-items:flex-start;gap:10px;min-height:64px;transition:opacity .6s;display:flex}.bubble.is-faded{opacity:.45}.bubble.is-empty{border:2px dashed var(--line);border-radius:14px;padding:10px 14px}.bubble>.avatar{margin-top:2px;box-shadow:0 1px 3px #0000001f}.bubble-body{background:var(--surface);border:2px solid var(--accent);border-radius:4px 14px 14px;flex:1;min-width:0;padding:8px 12px;position:relative}.bubble-head{align-items:center;gap:6px;display:flex}.bubble-name{color:var(--accent);font-size:.8rem;font-weight:700}.bubble-move{color:var(--muted);font-size:.78rem}.bubble-share{appearance:none;border:1px solid var(--line);background:var(--bg);color:var(--muted);font:inherit;cursor:pointer;border-radius:999px;align-items:center;gap:4px;margin-left:auto;padding:2px 8px;font-size:.72rem;font-weight:600;display:inline-flex}.bubble-share:hover{color:var(--ink);border-color:var(--accent)}.bubble-text{white-space:pre-wrap;overflow-wrap:anywhere;margin:2px 0 0}.chat-log{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);flex-direction:column;gap:10px;height:340px;padding:10px 12px;display:flex;overflow-y:auto}.chat-empty{margin:auto}.chat-entry{align-items:flex-start;gap:8px;max-width:92%;display:flex}.chat-entry>.avatar{margin-top:2px}.chat-body{flex:1;min-width:0}.chat-entry.is-user{text-align:right;align-self:flex-end}.chat-meta{color:var(--muted);align-items:center;gap:8px;font-size:.75rem;display:flex}.chat-entry.is-user .chat-meta{justify-content:flex-end}.chat-name{color:var(--ink);font-weight:700}.chat-text{background:var(--bg);white-space:pre-wrap;overflow-wrap:anywhere;text-align:left;border-radius:4px 12px 12px;margin:2px 0 0;padding:6px 10px}.chat-entry.is-user .chat-text{background:var(--accent-soft);border-radius:12px 4px 12px 12px}.chat-input-foot{justify-content:space-between;margin-top:4px;display:flex}.chat-input-foot>:last-child{margin-left:auto}.chat-input input{flex:1;width:auto;min-width:0}.quick-replies{flex-wrap:wrap;gap:6px;margin-bottom:8px;display:flex}.quick-reply{border-radius:999px}.panel-overlay{z-index:40;background:#00000073;place-items:center;padding:16px;display:grid;position:fixed;inset:0}.panel{background:var(--surface);border-radius:var(--radius);width:100%;max-width:640px;max-height:90vh;padding:20px;overflow:auto}.panel .card{box-shadow:none}.panel-close{margin-top:12px}.share-modal{flex-direction:column;gap:14px;display:flex}.share-modal-head{justify-content:space-between;align-items:center;display:flex}.share-modal-head h3{margin:0;font-size:1.15rem}.share-preview-wrap{background:var(--bg);border:1px solid var(--line);aspect-ratio:1200/630;border-radius:12px;place-items:center;display:grid;overflow:hidden}.share-preview-img{width:100%;height:auto;display:block}.share-moment-field{margin-bottom:0}.share-actions,.share-sub-actions{gap:8px}.share-hint{margin:0}.result{text-align:center}.result h2{font-size:1.6rem}.result.is-win h2{color:var(--accent)}.result.is-lose h2{color:var(--warn)}.result-comment{color:var(--muted);font-style:italic}.replay-controls{flex-wrap:wrap;justify-content:center;align-items:center;gap:6px;display:flex}.replay-controls input[type=range]{min-width:120px;accent-color:var(--accent);flex:1}.replay-ply{font-variant-numeric:tabular-nums;min-width:9em}.kifu{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);max-height:360px;margin:0;padding:4px;list-style:none;overflow-y:auto}.kifu button{all:unset;cursor:pointer;box-sizing:border-box;border-radius:6px;grid-template-columns:2.5em auto;gap:0 6px;width:100%;padding:4px 8px;display:grid}.kifu li.is-current button{background:var(--accent-soft)}.kifu-ply{color:var(--muted);text-align:right;font-variant-numeric:tabular-nums}.kifu-comment{color:var(--muted);white-space:pre-wrap;overflow-wrap:anywhere;grid-column:2;font-size:.85rem}.chat-details summary{cursor:pointer;margin-bottom:8px}.board-text{background:var(--surface);border-radius:8px;padding:12px}.shogi{--cell:min(calc((100vw - 64px) / 9.6), 44px);flex-direction:column;align-items:center;gap:8px;display:flex}.shogi-hand{min-height:calc(var(--cell) * .95);width:calc(var(--cell) * 9 + 24px);flex-wrap:wrap;align-items:center;gap:4px;display:flex}.shogi-hand.is-top{justify-content:flex-start}.shogi-hand.is-bottom{justify-content:flex-end}.shogi-hand-label{color:var(--muted);margin:0 6px;font-size:.8rem}.shogi-hand-empty{color:var(--muted);font-size:.8rem}.shogi-hand-piece{appearance:none;background:var(--wood);color:#1a1209;width:calc(var(--cell) * .85);height:calc(var(--cell) * .9);font:inherit;font-size:calc(var(--cell) * .5);cursor:default;border:1px solid #0000;border-radius:4px;font-family:Hiragino Mincho ProN,Yu Mincho,serif;font-weight:700;position:relative}.shogi-hand.is-top .shogi-hand-piece{transform:rotate(180deg)}.shogi-hand-piece:disabled{opacity:1}.shogi-hand-piece small{background:var(--ink);color:var(--bg);border-radius:999px;min-width:16px;font-family:system-ui;font-size:.7rem;line-height:16px;position:absolute;bottom:-6px;right:-6px;transform:none}.shogi-hand.is-top .shogi-hand-piece small{transform:rotate(180deg)}.shogi-hand-piece.is-selectable{cursor:pointer;box-shadow:0 0 0 2px var(--target)}.shogi-hand-piece.is-selected{box-shadow:0 0 0 3px var(--accent)}.shogi-board-wrap{position:relative}.shogi-files{grid-template-columns:repeat(9, var(--cell));color:var(--muted);text-align:center;font-size:.75rem;display:grid}.shogi-board-row{display:flex}.shogi-board{grid-template-columns:repeat(9, var(--cell));grid-template-rows:repeat(9, calc(var(--cell) * 1.08));background:var(--wood);border:2px solid var(--wood-line);display:grid}.shogi-ranks{grid-template-rows:repeat(9, calc(var(--cell) * 1.08));color:var(--muted);align-items:center;width:20px;padding-left:4px;font-size:.75rem;display:grid}.shogi-cell{appearance:none;border:0;border-right:1px solid var(--wood-line);border-bottom:1px solid var(--wood-line);cursor:default;color:#1a1209;background:0 0;place-items:center;padding:0;display:grid;position:relative}.shogi-cell:nth-child(9n){border-right:0}.shogi-cell:nth-last-child(-n+9){border-bottom:0}.shogi-cell.is-last{background:var(--highlight)}.shogi-cell.is-movable{cursor:pointer}.shogi-cell.is-selected{background:#2f6f5e73}.shogi-cell.is-target{cursor:pointer}.shogi-cell.is-target:after{content:"";background:var(--target);border-radius:50%;width:30%;height:30%;position:absolute}.shogi-piece{font-family:Hiragino Mincho ProN,Yu Mincho,serif;font-size:calc(var(--cell) * .58);font-weight:700;line-height:1}.shogi-piece.is-opponent{transform:rotate(180deg)}.shogi-piece.is-promoted{color:#b3261e}.shogi-promote{background:var(--surface);border-radius:var(--radius);text-align:center;width:220px;height:fit-content;margin:auto;padding:16px;position:absolute;inset:0;box-shadow:0 8px 30px #0000004d}.shogi-promote>div{justify-content:center;gap:8px;margin-bottom:8px;display:flex}.othello{--cell:min(calc((100vw - 72px) / 8.4), 50px);flex-direction:column;align-items:center;gap:6px;display:flex}.othello-counts{font-variant-numeric:tabular-nums;gap:20px;font-weight:700;display:flex}.othello-counts span{border-radius:999px;align-items:center;gap:6px;padding:2px 10px;display:inline-flex}.othello-counts span.is-turn{background:var(--accent-soft)}.othello-counts .othello-stone{width:16px;height:16px}.othello-files{grid-template-columns:repeat(8, var(--cell));color:var(--muted);text-align:center;margin-left:20px;font-size:.75rem;display:grid}.othello-board-row{display:flex}.othello-ranks{grid-template-rows:repeat(8, var(--cell));width:20px;color:var(--muted);align-items:center;font-size:.75rem;display:grid}.othello-board{grid-template-columns:repeat(8, var(--cell));grid-template-rows:repeat(8, var(--cell));background:var(--felt);border:3px solid var(--felt-line);background-clip:padding-box;background:var(--felt-line);gap:1px;display:grid}.othello-cell{appearance:none;background:var(--felt);border:0;place-items:center;padding:0;display:grid;position:relative}.othello-cell:disabled{cursor:default;color:inherit}.othello-cell.is-target{cursor:pointer}.othello-cell.is-target:after{content:"";background:#ffffff59;border-radius:50%;width:26%;height:26%}.othello-cell.is-target:hover:after{background:#fff9}.othello-cell.is-last{box-shadow:inset 0 0 0 3px #ffc400cc}.othello-stone{border-radius:50%;width:82%;height:82%;display:inline-block}.othello-stone.is-black{background:radial-gradient(circle at 35% 30%,#555,#111 60%)}.othello-stone.is-white{background:radial-gradient(circle at 35% 30%,#fff,#d8d8d8 70%);border:1px solid #aaa}.othello-pass{text-align:center;flex-wrap:wrap;justify-content:center;align-items:center;gap:10px;display:flex}.othello-pass p{margin:0}.chess{--cell:min(calc((100vw - 72px) / 8.4), 52px);flex-direction:column;align-items:center;display:flex}.chess-board-wrap{position:relative}.chess-board-row{display:flex}.chess-ranks{grid-template-rows:repeat(8, var(--cell));width:20px;color:var(--muted);align-items:center;font-size:.75rem;display:grid}.chess-files{grid-template-columns:repeat(8, var(--cell));color:var(--muted);text-align:center;margin-left:20px;font-size:.75rem;display:grid}.chess-board{grid-template-columns:repeat(8, var(--cell));grid-template-rows:repeat(8, var(--cell));border:2px solid var(--wood-line);display:grid}.chess-cell{appearance:none;cursor:default;border:0;place-items:center;padding:0;display:grid;position:relative}.chess-cell.is-light{background:#eed8b0}.chess-cell.is-dark{background:#b58863}.chess-cell.is-last{box-shadow:inset 0 0 0 100px var(--highlight)}.chess-cell.is-selected{box-shadow:inset 0 0 0 100px #2f6f5e80}.chess-cell.is-movable,.chess-cell.is-target,.chess-cell.is-capture{cursor:pointer}.chess-cell.is-target:after{content:"";background:#1e3c3273;border-radius:50%;width:30%;height:30%;position:absolute}.chess-cell.is-capture:after{content:"";border:4px solid #1e3c3273;border-radius:50%;position:absolute;inset:4%}.chess-piece{font-size:calc(var(--cell) * .78);z-index:1;font-family:Segoe UI Symbol,Apple Symbols,"Noto Sans Symbols 2",DejaVu Sans,serif;line-height:1;position:relative}.chess-piece.is-white{color:#fff;-webkit-text-stroke:1.2px #222;text-shadow:0 1px 1px #0000004d}.chess-piece.is-black{color:#111;text-shadow:0 1px #ffffff40}.chess-promote{background:var(--surface);border-radius:var(--radius);text-align:center;z-index:2;width:260px;height:fit-content;margin:auto;padding:16px;position:absolute;inset:0;box-shadow:0 8px 30px #0000004d}.chess-promote>div{justify-content:center;gap:6px;margin-bottom:8px;display:flex}.chess-promote .btn{background:#b58863;padding:2px 8px}.chess-promote .chess-piece{font-size:34px}@keyframes toast-in{0%{opacity:0;transform:translateY(calc(-100% - 16px))}}@keyframes opponent-moved{0%{opacity:.95;transform:scale(.6)}to{opacity:0;transform:scale(1.5)}}.board-area[data-last-by=opponent] .is-last:before{content:"";pointer-events:none;z-index:2;border-radius:50%;animation:.9s ease-out 2 both opponent-moved;position:absolute;inset:0;box-shadow:0 0 0 3px #ffc400f2,0 0 14px 4px #ffc400b3}@media (prefers-reduced-motion:reduce){.board-area[data-last-by=opponent] .is-last:before{opacity:0;animation:none}.player-thinking-bar{animation:none}.bubble{transition:none!important;animation:none!important}}.shogi-cell,.shogi-hand-piece,.othello-cell,.chess-cell,.btn,.mobile-tab,.room-menu-btn,.sheet-row{touch-action:manipulation}.topbar{flex-wrap:wrap;row-gap:0}@keyframes sheet-up{0%{transform:translateY(100%)}}.sheet-overlay{z-index:30;background:#0006;justify-content:center;align-items:flex-end;display:flex;position:fixed;inset:0}.sheet{background:var(--surface);width:100%;max-width:520px;padding:6px 0 calc(env(safe-area-inset-bottom,0px) + 12px);border-radius:18px 18px 0 0;animation:.22s ease-out sheet-up;box-shadow:0 -6px 30px #00000038}.sheet-grab{background:var(--line);border-radius:4px;width:36px;height:4px;margin:4px auto 8px}.sheet-list{flex-direction:column;display:flex}.sheet-row{appearance:none;width:100%;min-height:48px;font:inherit;color:var(--ink);text-align:left;cursor:pointer;background:0 0;border:0;align-items:center;gap:12px;padding:0 20px;font-size:.95rem;text-decoration:none;display:flex}.sheet-row:hover:not(.sheet-row-static){background:var(--bg)}.sheet-row-static{cursor:default}.sheet-row.is-danger{color:var(--danger);font-weight:700}.sheet-sub{color:var(--muted);margin-left:auto;font-size:.85rem}.sheet-lang{margin-left:auto}.sheet-switch{background:var(--line);border-radius:999px;flex:none;width:42px;height:26px;margin-left:auto;transition:background .15s;position:relative}.sheet-switch:after{content:"";background:#fff;border-radius:50%;width:20px;height:20px;transition:transform .15s;position:absolute;top:3px;left:3px}.sheet-switch.is-on{background:var(--accent)}.sheet-switch.is-on:after{transform:translate(16px)}.sheet-divider{border:0;border-top:1px solid var(--line);margin:6px 0}.sheet-confirm{flex-direction:column;gap:8px;padding:4px 20px 8px;display:flex}.sheet-confirm h3{margin:4px 0 0;font-size:1.05rem}.sheet-confirm p{margin:0 0 6px}.sheet-confirm .btn-large{min-height:48px}@media (width<=860px){#root:has(.room){height:var(--vh);flex-direction:column;display:flex;overflow:hidden}#root:has(.room)>.topbar{display:none}.topbar{flex:none;padding:6px 12px}.topbar-tagline{display:none}.page.room{--board-chrome:200px;flex-direction:column;flex:1;width:100%;min-height:0;padding:0 10px;display:flex;overflow:hidden}.page.room:has(.is-finished){--board-chrome:250px}.room-head{background:var(--surface);border-bottom:1px solid var(--line);flex:none;justify-content:flex-start;align-items:center;gap:4px;height:44px;margin:0 -10px 4px;padding:0 4px 0 2px;display:flex}.room-head h1{white-space:nowrap;text-overflow:ellipsis;flex:1;min-width:0;margin:0;font-size:1rem;overflow:hidden}.room-back,.room-menu-btn{appearance:none;color:var(--ink);cursor:pointer;background:0 0;border:0;border-radius:10px;flex:none;place-items:center;width:44px;height:44px;text-decoration:none;display:inline-grid}.room-back:hover,.room-menu-btn:hover{background:var(--bg)}.waiting{flex-direction:column;flex:1;gap:8px;width:100%;min-height:0;padding-bottom:8px;display:flex;overflow-y:auto}.waiting .card{margin-bottom:0;padding:10px 12px}.waiting h2,.waiting h3{margin-bottom:4px;font-size:1rem}.waiting p{margin-bottom:4px;font-size:.85rem}.waiting .invite{flex-direction:column;flex:1;min-height:0;display:flex}.waiting .invite-text{flex:1;min-height:64px;margin-bottom:6px;padding:6px 8px;font-size:.8rem}.room-grid{flex-direction:column;flex:1;align-items:stretch;gap:0;width:100%;min-height:0;display:flex;overflow:hidden}.board-col{flex:1;justify-content:space-between;gap:4px;width:100%;min-height:0;overflow:hidden}.board-area{flex:1;align-items:center;min-height:0;overflow:hidden}.side-col{width:100%;position:static}.room-grid:not([data-mobile-tab=board]) .board-col{display:none}.room-grid[data-mobile-tab=board] .side-col{gap:0;height:0;min-height:0;overflow:visible}.room-grid[data-mobile-tab=board] .side-col>:not(.bubble){display:none}.room-grid:not([data-mobile-tab=board]) .side-col{flex:1;gap:8px;min-height:0;overflow:hidden}.room-grid:not([data-mobile-tab=board]) .side-col>.bubble,.room-grid[data-mobile-tab=kifu] .side-col>:not(.kifu),.room-grid[data-mobile-tab=chat] .side-col>.kifu{display:none}.kifu{flex:1;min-height:0;max-height:none}.chat-details{flex-direction:column;flex:1;min-height:0;display:flex;overflow:hidden}.chat-details>summary{display:none}.chat-log{flex:1;height:auto;min-height:0}.quick-replies{flex:none;gap:4px;margin-bottom:0}.chat-input{flex:none}.player{flex-wrap:wrap;flex:none;align-items:center;gap:2px 8px;min-height:38px;padding:5px 10px;display:flex}.player-main{display:contents}.player .avatar.is-md{width:22px;height:22px;font-size:.75rem}.player-name{font-size:.9rem}.player-lastmove{font-size:.78rem}.player-status{margin-top:0;font-size:.8rem}.player-status.is-badge{padding:1px 8px;font-size:.72rem}.player-clock{order:5;margin-left:auto;font-size:.9rem}.player-recover{flex-wrap:wrap;flex-basis:100%;order:6;justify-content:space-between;align-items:center;gap:6px;margin-top:4px;padding:6px 8px;display:flex}.player-recover p{margin:0}.play-foot{display:none}.play-notice{text-align:center;flex:none;display:block}.result.card{flex-wrap:wrap;flex:none;justify-content:center;align-items:baseline;gap:2px 10px;margin-bottom:0;padding:6px 10px;display:flex}.result h2{margin:0;font-size:1rem}.result p{margin:0;font-size:.82rem}.result-comment{white-space:nowrap;text-overflow:ellipsis;flex-basis:100%;font-size:.78rem;overflow:hidden}.replay-controls{flex-wrap:nowrap;flex:none;gap:4px}.replay-controls .btn-small{padding:4px 8px;font-size:.8rem}.replay-controls input[type=range]{min-width:60px}.replay-ply{white-space:nowrap;text-overflow:ellipsis;min-width:0;max-width:42vw;font-size:.78rem;overflow:hidden}.is-finished .actions{flex:none;justify-content:center;margin-left:0}.shogi{--cell:min(calc((100vw - 40px) / 9.6), calc((var(--vh) - var(--board-chrome)) / 11.6), 44px);gap:4px}.shogi-hand{min-height:calc(var(--cell) * .9);flex-wrap:nowrap;gap:3px}.shogi-hand-label{white-space:nowrap;margin:0 4px;font-size:.75rem}.othello{--cell:min(calc((100vw - 44px) / 8.4), calc((var(--vh) - var(--board-chrome) - 30px) / 8.5), 50px);gap:4px}.othello-counts{font-size:.85rem}.chess{--cell:min(calc((100vw - 44px) / 8.4), calc((var(--vh) - var(--board-chrome)) / 8.2), 52px)}.mobile-tabs{background:var(--surface);border:1px solid var(--line);width:100%;margin:4px 0 calc(env(safe-area-inset-bottom,0px) + 6px);box-shadow:var(--shadow);border-radius:12px;flex:none;gap:4px;padding:4px;display:flex}.mobile-tab{appearance:none;min-width:0;min-height:38px;font:inherit;color:var(--muted);cursor:pointer;white-space:nowrap;background:0 0;border:0;border-radius:8px;flex:1;justify-content:center;align-items:center;gap:6px;padding:7px 10px;font-size:.82rem;font-weight:600;transition:background .15s,color .15s,box-shadow .15s;display:inline-flex}.mobile-tab:hover:not(.is-active){color:var(--ink)}.mobile-tab.is-active{background:var(--accent);color:var(--accent-ink);box-shadow:0 1px 3px #0000001f}.mobile-tab-count{font-variant-numeric:tabular-nums;background:var(--bg);color:var(--muted);border-radius:999px;padding:2px 6px;font-size:.72rem;font-weight:700;line-height:1}.mobile-tab-count.is-unread{background:var(--accent);color:var(--accent-ink)}.mobile-tab.is-active .mobile-tab-count{background:color-mix(in srgb, var(--accent-ink) 18%, transparent);color:var(--accent-ink)}.room-grid .bubble{z-index:20;top:calc(env(safe-area-inset-top,0px) + 8px);background:var(--surface);border:1.5px solid var(--accent);cursor:pointer;border-radius:16px;max-width:520px;min-height:0;margin:0 auto;padding:10px 12px;transition:opacity .4s,transform .4s;animation:.35s ease-out toast-in;position:fixed;left:8px;right:8px;box-shadow:0 6px 24px #0000002e}.room-grid .bubble-body{background:0 0;border:0;border-radius:0;padding:0}.room-grid .bubble.is-empty,.room-grid .bubble.is-faded,.room-grid .bubble.is-dismissed{opacity:0;pointer-events:none;transform:translateY(calc(-100% - 16px))}.room-grid .bubble-text{-webkit-line-clamp:4;-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}}@media (width<=480px){.page:not(.room){padding:12px 12px 40px}.hero h1{font-size:1.5rem}.card{padding:14px}.panel{padding:16px}}.creator-card{margin-top:28px}.creator-eyebrow{color:var(--accent);letter-spacing:.04em;margin:0 0 2px;font-size:.8rem;font-weight:700}.creator-name{flex-wrap:wrap;align-items:baseline;gap:8px;margin:0 0 8px;font-size:1.25rem;display:flex}.creator-name a{font-size:.95rem;font-weight:400;text-decoration:none}.creator-lead{margin:0 0 8px}.creator-topics{color:var(--muted);gap:4px;margin:0 0 16px;padding-left:1.2em;display:grid}.btn-x{background:var(--ink);border-color:var(--ink);color:var(--bg);font-weight:600}.btn-x:hover:not(:disabled){border-color:var(--ink);opacity:.88}@media (width<=480px){.topbar-tagline{display:none}}.steps{padding-top:22px;padding-bottom:10px}.step{grid-template-columns:32px 1fr;gap:14px;display:grid}.step-rail{justify-content:center;display:flex;position:relative}.step:not(.is-last) .step-rail:after{content:"";background:var(--line);border-radius:2px;width:2px;position:absolute;top:34px;bottom:4px}.step.is-done:not(.is-last) .step-rail:after{background:var(--accent)}.step-dot{border:2px solid var(--line);background:var(--surface);width:30px;height:30px;color:var(--muted);border-radius:50%;place-items:center;font-size:.9rem;font-weight:700;transition:background .2s,border-color .2s,color .2s;display:grid}.step.is-active .step-dot{border-color:var(--accent);color:var(--accent);box-shadow:0 0 0 4px var(--accent-soft)}.step.is-done .step-dot{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}.step-main{min-width:0;padding-bottom:22px}.step-title{margin:3px 0 10px;font-size:1.05rem}.step.is-locked .step-title{color:var(--muted);margin-bottom:2px;font-weight:600}.step.is-done .step-title{color:var(--muted);margin-bottom:6px;font-size:.85rem;font-weight:600}.step-hint{margin:0}.step-body{animation:.28s ease-out step-in}.step-lead{margin-bottom:12px}@keyframes step-in{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}.game-grid{grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:12px;display:grid}.game-card{border:1.5px solid var(--line);cursor:pointer;background:var(--surface);border-radius:12px;flex-direction:column;transition:border-color .15s,transform .15s,box-shadow .15s;display:flex;position:relative;overflow:hidden}.game-card:hover{border-color:var(--accent);transform:translateY(-2px);box-shadow:0 6px 18px #00000014}.game-card.is-checked{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}.game-card input,.seat-card input{opacity:0;pointer-events:none;position:absolute}:is(.game-card:has(input:focus-visible),.seat-card:has(input:focus-visible)){outline:2px solid var(--accent);outline-offset:2px}.game-art{aspect-ratio:16/10;background:var(--bg);line-height:0}.game-art svg{width:100%;height:100%;display:block}.game-card-body{gap:2px;padding:10px 12px 12px;display:grid}.game-card-body strong{font-size:1rem}.game-card-body small{color:var(--muted);font-size:.8rem;line-height:1.45}.seat-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;display:grid}.seat-card{border:1.5px solid var(--line);cursor:pointer;border-radius:10px;align-items:center;gap:10px;padding:12px 14px;transition:border-color .15s,background .15s;display:flex;position:relative}.seat-card:hover{border-color:var(--accent)}.seat-card.is-checked{border-color:var(--accent);background:var(--accent-soft)}.seat-card span{display:grid}.seat-card small{color:var(--muted);font-size:.78rem}.seat-mark{flex:none}.step-summary{flex-wrap:wrap;align-items:center;gap:10px;display:flex}.step-summary .game-art{border-radius:6px;flex:none;width:64px;overflow:hidden}.step-summary .seat-mark{width:24px;height:24px}.step-summary .btn{margin-left:auto}.advanced{border:1px solid var(--line);border-radius:10px;margin-bottom:16px}.advanced summary{cursor:pointer;gap:6px;padding:10px 14px;list-style:none;display:grid}.advanced summary::-webkit-details-marker{display:none}.advanced-title{align-items:center;gap:6px;font-weight:600;display:flex}.advanced-title:after{content:"";border-right:2px solid var(--muted);border-bottom:2px solid var(--muted);width:7px;height:7px;margin-left:auto;transition:transform .2s;transform:rotate(45deg)translateY(-2px)}.advanced[open] .advanced-title:after{transform:rotate(-135deg)translateY(-2px)}.advanced-chips{flex-wrap:wrap;gap:6px;display:flex}.advanced-chips span{color:var(--muted);background:var(--bg);border-radius:999px;padding:2px 9px;font-size:.75rem}.advanced[open] .advanced-chips{display:none}.advanced-body{border-top:1px solid var(--line);padding:14px 14px 0}.steps .turnstile{margin-bottom:12px}.steps>.error{margin:0 0 12px 46px}@media (width<=480px){.step{grid-template-columns:28px 1fr;gap:10px}.step-dot{width:28px;height:28px}.game-grid{grid-template-columns:1fr;gap:10px}.game-grid .game-card{flex-direction:row;align-items:center}.game-grid .game-art{flex:none;width:112px}.steps>.error{margin-left:0}}@media (prefers-reduced-motion:reduce){.step-body{animation:none}.game-card:hover{transform:none}}
