.gomoku-page{--gomoku-green:#3e6454;--gomoku-green-soft:#edf3ed;width:min(1120px,100% - 48px);color:var(--text);margin:0 auto;padding:30px 0 76px;overflow:visible}.gomoku-page *{box-sizing:border-box}.gomoku-page button,.gomoku-page input{font:inherit}.gomoku-back{color:var(--muted);align-items:center;gap:7px;font-size:13px;display:inline-flex}.gomoku-back:hover{color:var(--text)}.gomoku-heading{justify-content:space-between;align-items:center;gap:24px;margin:32px 0 30px;display:flex}.gomoku-eyebrow{color:var(--gomoku-green);letter-spacing:.12em;margin:0 0 12px;font-size:12px;font-weight:650}.gomoku-heading h1{letter-spacing:-.045em;margin:0;font-size:clamp(30px,4vw,44px);font-weight:720;line-height:1.25}.gomoku-intro{color:var(--muted);margin:14px 0 0;font-size:14px;line-height:1.8}.gomoku-heading-mark{isolation:isolate;padding:0 14px;display:flex}.gomoku-heading-mark i{background:radial-gradient(circle at 32% 26%,#565a60,#14171c 70%);border-radius:50%;width:47px;height:47px;box-shadow:0 7px 13px #11131825}.gomoku-heading-mark i+i{z-index:1;background:radial-gradient(circle at 35% 26%,#fff,#e7e5dc 80%);border:1px solid #d9d7d0;margin:18px 0 0 -11px}.gomoku-game{grid-template-columns:minmax(0,1fr) 320px;align-items:start;gap:32px;display:grid}.gomoku-play,.gomoku-sidebar{min-width:0}.gomoku-board-top{justify-content:space-between;align-items:center;gap:10px;display:flex}.gomoku-mode{border:1px solid var(--line);color:var(--muted);border-radius:6px;align-items:center;gap:6px;padding:5px 9px;font-size:11px;font-weight:550;display:inline-flex}.gomoku-mode--online{border-color:color-mix(in srgb, var(--gomoku-green) 22%, transparent);background:var(--gomoku-green-soft);color:var(--gomoku-green)}.gomoku-move-count{color:var(--muted);white-space:nowrap;font-size:12px}.gomoku-status{align-items:center;gap:12px;min-height:90px;padding:17px 0;display:flex}.gomoku-status h2{letter-spacing:-.03em;margin:0;font-size:20px;font-weight:650;line-height:1.4}.gomoku-status p{color:var(--muted);margin:5px 0 0;font-size:12px}.gomoku-status-stone{border-radius:50%;flex:none;width:24px;height:24px;box-shadow:0 2px 5px #10121822}.gomoku-status-stone--1{background:radial-gradient(circle at 30% 25%,#5a6066,#14181c 70%)}.gomoku-status-stone--2{background:radial-gradient(circle at 30% 25%,#fff,#e7e5dc);border:1px solid #c8c7c1}.gomoku-board-frame{background:linear-gradient(115deg,#eee0c7,#e9d8b8 55%,#eedfc5);border:1px solid #d7c0a0;border-radius:12px;padding:16px 24px 22px 12px;box-shadow:inset 0 1px #ffffffa6,0 10px 28px #6549230a}.gomoku-letters{color:#88704f;text-align:center;grid-template-columns:repeat(15,1fr);height:20px;margin-left:22px;font:10px/1.4 ui-monospace,monospace;display:grid}.gomoku-board-layout{grid-template-columns:14px minmax(0,1fr);gap:8px;display:grid}.gomoku-ranks{color:#88704f;text-align:center;grid-template-rows:repeat(15,1fr);align-items:center;font:10px/1.4 ui-monospace,monospace;display:grid}.gomoku-grid{aspect-ratio:1;grid-template-rows:repeat(15,1fr);width:100%;display:grid}.gomoku-row{grid-template-columns:repeat(15,minmax(0,1fr));min-height:0;display:grid}.gomoku-cell{cursor:default;touch-action:manipulation;-webkit-tap-highlight-color:transparent;background-color:#0000;background-image:linear-gradient(#a58b68,#a58b68),linear-gradient(#a58b68,#a58b68);background-position:50%,50%;background-repeat:no-repeat;background-size:100% 1px,1px 100%;border:0;border-radius:0;place-items:center;width:100%;min-width:0;height:100%;min-height:0;margin:0;padding:0;display:grid;position:relative}.gomoku-cell:first-child{background-position:100%,50%;background-size:50% 1px,1px 100%}.gomoku-cell:last-child{background-position:0,50%;background-size:50% 1px,1px 100%}.gomoku-row:first-child .gomoku-cell{background-position:50%,bottom;background-size:100% 1px,1px 50%}.gomoku-row:last-child .gomoku-cell{background-position:50%,top;background-size:100% 1px,1px 50%}.gomoku-row:first-child .gomoku-cell:first-child{background-position:100%,bottom;background-size:50% 1px,1px 50%}.gomoku-row:first-child .gomoku-cell:last-child{background-position:0,bottom;background-size:50% 1px,1px 50%}.gomoku-row:last-child .gomoku-cell:first-child{background-position:100%,top;background-size:50% 1px,1px 50%}.gomoku-row:last-child .gomoku-cell:last-child{background-position:0,top;background-size:50% 1px,1px 50%}.gomoku-cell--available{cursor:pointer}.gomoku-cell:focus-visible{z-index:3;outline-offset:-2px;border-radius:4px;outline:2px solid #3e6454}.gomoku-star{background:#826c4b;border-radius:50%;width:5px;height:5px;position:absolute}.gomoku-stone{z-index:1;border-radius:50%;width:85%;height:85%;animation:.16s ease-out gomoku-drop;position:relative;box-shadow:1px 2px 3px #36271140}.gomoku-stone--1{background:radial-gradient(circle at 31% 25%,#5f6264,#191d20 64%,#101315)}.gomoku-stone--2{background:radial-gradient(circle at 30% 22%,#fffef9,#f8f5e9 58%,#e5e0cf);border:1px solid #c9c5b6}.gomoku-stone--last:after{content:"";border:1.5px solid #e3a670;border-radius:50%;width:28%;height:28%;position:absolute;top:36%;left:36%}.gomoku-stone--2.gomoku-stone--last:after{border-color:#925c3c}.gomoku-cell--winning .gomoku-stone{outline-offset:1px;outline:3px solid #568164}.gomoku-preview{opacity:.28;border-radius:50%;width:72%;height:72%;display:none;position:absolute}.gomoku-preview--1{background:#171c19}.gomoku-preview--2{background:#fff;border:1px solid #9c988c}@media (hover:hover){.gomoku-cell--available:hover .gomoku-preview{display:block}}.gomoku-cell--available:focus-visible .gomoku-preview{display:block}.gomoku-board-bottom{color:var(--muted);justify-content:space-between;gap:12px;margin-top:13px;font-size:11px;line-height:1.5;display:flex}.gomoku-board-bottom span:last-child{white-space:nowrap}.gomoku-sidebar{flex-direction:column;gap:20px;display:flex}.gomoku-room-panel{border:1px solid color-mix(in srgb, var(--gomoku-green) 23%, var(--line));background:var(--surface-solid);border-radius:12px;padding:22px}.gomoku-panel-eyebrow{color:var(--gomoku-green);align-items:center;gap:7px;margin:0 0 15px;font-size:12px;font-weight:650;display:flex}.gomoku-room-panel h2{letter-spacing:-.04em;margin:0 0 10px;font-size:20px;font-weight:650;line-height:1.45}.gomoku-panel-copy{color:var(--muted);margin:0 0 21px;font-size:12px;line-height:1.85}.gomoku-label{color:var(--text);margin-bottom:7px;font-size:12px;font-weight:550;display:block}.gomoku-input,.gomoku-share{border:1px solid var(--line);background:var(--bg);width:100%;min-width:0;min-height:44px;color:var(--text);border-radius:7px}.gomoku-input{padding:9px 12px;font-size:13px!important}.gomoku-input::placeholder{color:var(--muted);opacity:.8}.gomoku-input--code{letter-spacing:.09em}.gomoku-page input:focus-visible{outline:2px solid var(--gomoku-green);outline-offset:2px}.gomoku-button{cursor:pointer;border:1px solid #0000;border-radius:7px;justify-content:center;align-items:center;gap:8px;width:100%;min-height:44px;padding:9px 14px;line-height:1.4;transition:background .16s,opacity .16s;display:flex;font-size:13px!important;font-weight:600!important}.gomoku-room-panel .gomoku-button{margin-top:12px}.gomoku-button--primary{background:var(--gomoku-green);color:#fff}.gomoku-button--primary:hover{background:color-mix(in srgb, var(--gomoku-green) 86%, #102619)}.gomoku-button--secondary{border-color:var(--line);background:var(--surface-solid);color:var(--text)}.gomoku-button--secondary:hover{background:var(--surface-soft)}.gomoku-button--danger{color:#fff;background:#9a4c3b}.gomoku-page button:disabled{opacity:.48;cursor:default}.gomoku-page button:focus-visible,.gomoku-page summary:focus-visible,.gomoku-back:focus-visible{outline:2px solid var(--gomoku-green);outline-offset:3px}.gomoku-join{border-top:1px solid var(--line);margin-top:18px;padding-top:16px}.gomoku-join summary,.gomoku-rules summary{width:fit-content;color:var(--muted);cursor:pointer;font-size:12px}.gomoku-join form{margin-top:15px}.gomoku-panel-footnote{color:var(--muted);text-align:center;margin:20px 0 0;font-size:10px}.gomoku-share{display:flex;overflow:hidden}.gomoku-share input{width:100%;min-width:0;color:var(--muted);background:0 0;border:0;padding:10px;font-size:11px}.gomoku-share button{border:0;border-left:1px solid var(--line);color:var(--gomoku-green);cursor:pointer;background:0 0;flex:0 0 44px;place-items:center;display:grid}.gomoku-share:focus-within{outline:2px solid var(--gomoku-green);outline-offset:2px}.gomoku-share input:focus-visible{outline:none}.gomoku-players{gap:9px;display:grid}.gomoku-player{border:1px solid var(--line);background:var(--surface-solid);border-radius:9px;align-items:center;gap:12px;min-height:70px;padding:12px 16px;display:flex}.gomoku-player--turn{border-color:color-mix(in srgb, var(--gomoku-green) 40%, var(--line))}.gomoku-player-stone{border-radius:50%;flex:none;width:29px;height:29px;box-shadow:0 2px 4px #11131820}.gomoku-player div{min-width:0}.gomoku-player strong{overflow-wrap:anywhere;flex-wrap:wrap;align-items:center;gap:6px;font-size:13px;font-weight:600;display:flex}.gomoku-player small{background:var(--surface-soft);color:var(--muted);border-radius:4px;padding:1px 5px;font-size:10px;font-weight:500}.gomoku-player p{color:var(--muted);margin:3px 0 0;font-size:11px}.gomoku-turn-label{color:var(--gomoku-green);flex:none;margin-left:auto;font-size:10px}.gomoku-feedback:empty{display:none}.gomoku-feedback p{border:1px solid var(--line);overflow-wrap:anywhere;border-radius:8px;margin:0;padding:12px 14px;font-size:12px;line-height:1.8}.gomoku-error{background:color-mix(in srgb, #b76343 8%, var(--surface-solid));color:#a04b35}.gomoku-notice{background:var(--gomoku-green-soft);color:var(--gomoku-green)}.gomoku-connection{border:1px solid var(--line);color:var(--muted);border-radius:8px;align-items:center;gap:8px;margin-top:16px;padding:12px;font-size:12px;line-height:1.7;display:flex}.gomoku-connection svg{flex:none}.gomoku-connection button{border:1px solid var(--line);background:var(--surface-solid);color:var(--text);cursor:pointer;border-radius:6px;flex:none;margin-left:auto;padding:7px 10px}.gomoku-result{border:1px solid color-mix(in srgb, var(--gomoku-green) 25%, var(--line));background:var(--gomoku-green-soft);border-radius:10px;margin-top:22px;padding:20px}.gomoku-result strong{font-size:18px;font-weight:650}.gomoku-result p{color:var(--muted);margin:6px 0 0;font-size:12px}.gomoku-result .gomoku-button{width:fit-content;margin-top:16px;padding-inline:24px}.gomoku-round-actions p{color:var(--muted);text-align:center;margin:8px 0 0;font-size:11px}.gomoku-text-button{width:fit-content;min-height:32px;color:var(--muted);cursor:pointer;background:0 0;border:0;align-items:center;gap:6px;padding:0;display:inline-flex;font-size:12px!important}.gomoku-text-button:hover{color:var(--text)}.gomoku-room-panel>.gomoku-text-button{margin-top:16px}.gomoku-resign{padding-top:3px}.gomoku-resign p{color:var(--muted);margin:0 0 10px;font-size:12px}.gomoku-resign>div{gap:10px;display:flex}.gomoku-rules{border-top:1px solid var(--line);margin-top:1px;padding-top:15px}.gomoku-rules p{color:var(--muted);margin:10px 0 0;font-size:11px;line-height:1.9}@keyframes gomoku-drop{0%{opacity:.45;transform:scale(.86)}to{opacity:1;transform:scale(1)}}:root[data-theme=dark] .gomoku-page{--gomoku-green:#91b8a1;--gomoku-green-soft:#1a2e27}:root[data-theme=dark] .gomoku-button--primary{color:#f4f8f5;background:#446e59}:root[data-theme=dark] .gomoku-board-frame{background:linear-gradient(115deg,#c8b18b,#c0a779 55%,#cbb68f);border-color:#9b805b;box-shadow:inset 0 1px #e2d3b35c,0 10px 28px #0000001a}:root[data-theme=dark] .gomoku-cell{background-image:linear-gradient(#89714e,#89714e),linear-gradient(#89714e,#89714e)}:root[data-theme=dark] .gomoku-letters,:root[data-theme=dark] .gomoku-ranks{color:#645035}:root[data-theme=dark] .gomoku-error{color:#efad97}@media (max-width:900px){.gomoku-game{grid-template-columns:minmax(0,1fr) 280px;gap:22px}.gomoku-room-panel{padding:19px}.gomoku-board-frame{padding:12px 15px 15px 7px}.gomoku-heading{margin-top:26px}}@media (max-width:700px){.gomoku-page{width:calc(100% - 32px);padding:22px 0 52px}.gomoku-heading{gap:12px;margin:22px 0 24px}.gomoku-heading h1{font-size:29px}.gomoku-eyebrow{margin-bottom:9px;font-size:11px}.gomoku-intro{max-width:310px;margin-top:12px;font-size:12px}.gomoku-heading-mark{padding:0 4px}.gomoku-heading-mark i{width:30px;height:30px}.gomoku-heading-mark i+i{margin:15px 0 0 -10px}.gomoku-game{grid-template-columns:minmax(0,1fr);gap:25px}.gomoku-sidebar{display:contents}.gomoku-room-panel{grid-row:1;padding:17px 18px}.gomoku-panel-eyebrow{margin-bottom:10px}.gomoku-room-panel h2{font-size:18px}.gomoku-panel-copy{margin-bottom:14px;font-size:12px}.gomoku-panel-footnote{margin-top:15px}.gomoku-play{grid-row:2}.gomoku-status{min-height:79px}.gomoku-status h2{font-size:18px}.gomoku-players{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.gomoku-player{flex-wrap:wrap;gap:9px;min-height:74px;padding:12px}.gomoku-player-stone{width:25px;height:25px}.gomoku-player strong{font-size:12px}.gomoku-turn-label{display:none}.gomoku-rules{margin-top:0}.gomoku-input{font-size:16px!important}.gomoku-share input{font-size:16px}.gomoku-board-bottom{font-size:10px}.gomoku-stone--last:after{border-width:1px}.gomoku-cell--winning .gomoku-stone{outline-width:2px}}@media (prefers-reduced-motion:reduce){.gomoku-stone{animation:none}.gomoku-button{transition:none}}