:root{color:#202229;font-synthesis:none;text-rendering:optimizelegibility;background:#f4f5f1;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}[hidden]{display:none!important}html,body{min-width:320px;min-height:100%;margin:0}body{min-height:100vh}button{font:inherit;cursor:pointer;-webkit-user-select:none;user-select:none}button:disabled{cursor:default}button:focus-visible,a:focus-visible{outline-offset:2px;outline:2px solid #1e6e59}.game-header{justify-content:space-between;align-items:center;gap:20px;height:60px;padding:12px 24px;display:flex}.game-brand{align-items:center;gap:12px;min-width:0;display:flex}.game-brand img{border-radius:4px;width:42px;height:42px}.game-brand h1,.game-brand p{margin:0}.game-brand h1{font-size:1rem;line-height:1.2}.game-brand p{color:#6d706b;margin-top:3px;font-size:.76rem}.connection-status{color:#686b66;flex:none;align-items:center;gap:7px;font-size:.78rem;font-weight:700;display:inline-flex}.connection-status:before{content:"";background:#a7aaa4;border-radius:50%;width:8px;height:8px}.connection-status[data-mode=live]:before{background:#1d9a66;box-shadow:0 0 0 4px #d9f0e7}.connection-status[data-mode=error]:before{background:#d3443d;box-shadow:0 0 0 4px #f8dedb}.icon-button-content{justify-content:center;align-items:center;gap:8px;display:inline-flex}.icon-button-content svg{stroke-width:2.4px;width:19px;height:19px}.game-header{background:0 0;border:0;justify-content:center;align-items:center;height:60px;min-height:60px;padding:0 20px;display:flex}.game-header h1{text-align:center;margin:0;font-size:16px;line-height:1.2}@media (width>=901px){.game-header{display:none}}body{background:radial-gradient(circle at 50% 40%,#ddbb7924,#0000 36%),#f4f5f1}body.has-setup-modal{overflow:hidden}.gomoku-layout{width:min(1120px,100% - 40px);min-height:calc(100vh - 60px);margin:0 auto;padding:18px 0 24px}.table-layout{grid-template-columns:minmax(170px,1fr) minmax(420px,620px) minmax(170px,1fr);align-items:center;gap:28px;display:grid}.setup-panel{z-index:20;opacity:0;pointer-events:none;background:#edefea00;place-items:center;padding:24px;transition:background .2s,opacity .2s;display:grid;position:fixed;inset:0;overflow:auto}.setup-panel[data-state=open]{opacity:1;pointer-events:auto;-webkit-backdrop-filter:blur(10px)saturate(.82);backdrop-filter:blur(10px)saturate(.82);background:#edefeab8}.setup-form{--setup-padding:24px;opacity:0;background:#fffffff5;border:1px solid #b7b2a5b3;border-radius:14px;outline:0;grid-template-columns:1fr;gap:0;width:min(620px,100%);max-height:calc(100dvh - 48px);padding:0;transition:opacity .18s,transform .22s cubic-bezier(.2,.88,.24,1);display:grid;position:relative;overflow:auto;transform:translateY(18px)scale(.975);box-shadow:0 28px 80px #30281d33,0 3px 10px #30281d14}.setup-panel[data-state=open] .setup-form{opacity:1;transform:translateY(0)scale(1)}.setup-heading{height:60px;padding:0 var(--setup-padding);align-items:center;display:flex}.setup-heading h2{margin:0;font-size:1rem;font-weight:850}.setup-content{background:#f5f5f5;display:grid}.settings-list{background:#fff;margin:16px 0;padding:0;list-style:none}.settings-divider hr{border:0;border-top:1px solid #e9eae5;margin:0}.setting-field{min-width:0;min-height:62px;padding:0 var(--setup-padding);color:#202229;cursor:pointer;align-items:center;gap:14px;font-size:.9rem;transition:background-color .12s;display:flex;position:relative}.setting-title{flex-shrink:0;font-weight:600}.setting-value{color:#777970;text-align:right;text-overflow:ellipsis;white-space:nowrap;min-width:0;margin-left:auto;overflow:hidden}.setting-chevron{color:#a9aba3;flex-shrink:0;width:18px;height:18px}.setting-title,.setting-value,.setting-chevron{pointer-events:none}.setting-field select{inset:0 var(--setup-padding) 0 auto;width:min(240px, calc(100% - 90px - var(--setup-padding) - var(--setup-padding)));opacity:0;cursor:pointer;height:100%;font:inherit;border:0;outline:0;margin:0;font-size:16px;position:absolute}.setting-field:has(select:disabled){opacity:.55;cursor:not-allowed}.setting-field select:disabled{cursor:not-allowed}.setting-field:not(:has(select:disabled)):focus-within{background-color:#2022290a}@media (hover:hover) and (pointer:fine){.start-action:not(:disabled):hover{background-color:#2022290a}.setting-field:not(:has(select:disabled)):hover{background-color:#2022290a}.start-action:not(:disabled):active{background-color:#20222914}.setting-field:not(:has(select:disabled)):active{background-color:#20222914}}.setup-feedback{margin:0 var(--setup-padding) 14px;border-radius:7px;padding:10px 12px;font-size:.74rem;font-weight:750;line-height:1.4}.setup-feedback[data-mode=pending]{color:#86571f;background:#f5ecde}.setup-feedback[data-mode=error]{color:#a43b31;background:#f9e6e2}.setup-actions{background:#fff;display:grid}.start-action{width:100%;min-height:60px;padding:0 var(--setup-padding);color:#1976d2;cursor:pointer;background:0 0;border:0;border-radius:0;margin:0;transition:background-color .12s}.start-action:disabled{cursor:not-allowed;opacity:.42}.players-panel,.action-panel{flex-direction:column;gap:10px;display:flex}.player-card{color:#6d706a;background:#ffffffad;border:1px solid #dedfd9;border-radius:9px;align-items:center;gap:12px;min-width:0;padding:14px;transition:border-color .15s,box-shadow .15s;display:flex}.player-card.is-current{color:#202229;border-color:#a96a28;box-shadow:0 0 0 3px #a96a281a}.player-card.is-winner{color:#146c4b;border-color:#1f8b62}.player-card>div{flex-direction:column;flex:auto;gap:3px;min-width:0;display:flex}.player-card strong{text-overflow:ellipsis;white-space:nowrap;font-size:.83rem;overflow:hidden}.player-card span{font-size:.72rem}.player-card time{color:#777970;font-variant-numeric:tabular-nums;flex:none;font-size:.78rem;font-weight:800}.player-card.is-current time{color:#9a6122}.stone-swatch{border-radius:50%;flex:none;width:26px;height:26px;display:block}.stone-black{background:var(--stone-black-surface);box-shadow:var(--stone-black-shadow);border:0}.stone-white{--stone-light-x:29%;--stone-light-y:22%;background:var(--stone-white-surface);box-shadow:var(--stone-white-shadow);border:0}.board-shell{justify-self:center;width:min(100%,100dvh - 118px)}.gomoku-board{aspect-ratio:1;background:linear-gradient(#ffffff1f,#0000),repeating-linear-gradient(90deg,#7142140a 0 1px,#0000 1px 9px),#d9aa63;border:1px solid #9b622b;border-radius:8px;width:100%;position:relative;overflow:hidden;box-shadow:0 8px #a96f35,0 22px 48px #59361533}.gomoku-board:before,.gomoku-board:after{inset:var(--edge);content:"";pointer-events:none;position:absolute}.gomoku-board:before{background:linear-gradient(#3a2411c2 1px,#0000 1px),linear-gradient(90deg,#3a2411c2 1px,#0000 1px);background-size:var(--line-step) var(--line-step);border-bottom:1px solid #3a2411c2;border-right:1px solid #3a2411c2}.gomoku-board:after{border:1px solid #3a2411c2}.gomoku-point{z-index:2;width:var(--point-size);aspect-ratio:1;cursor:pointer;background:0 0;border:0;border-radius:50%;padding:0;position:absolute;transform:translate(-50%,-50%)}.gomoku-point.is-star{background:radial-gradient(circle,#4b321c 0 3px,#0000 3.5px)}.gomoku-point:before{z-index:1;background:var(--stone-surface);box-shadow:var(--stone-shadow);content:"";filter:brightness(var(--stone-brightness));opacity:0;border:0;border-radius:50%;transition:filter .1s,opacity .1s,transform .13s;position:absolute;inset:4%;transform:scale(.78)}.gomoku-point:nth-child(7n+2){--stone-brightness:.97;--stone-light-x:28%;--stone-light-y:25%}.gomoku-point:nth-child(11n+5){--stone-brightness:1.025;--stone-light-x:32%;--stone-light-y:22%}.gomoku-point:nth-child(13n+7){--stone-brightness:.985;--stone-light-x:29%;--stone-light-y:21%}.gomoku-point[data-piece="1"],.gomoku-board[data-turn-color=black] .gomoku-point[data-piece="0"]{--stone-surface:var(--stone-black-surface);--stone-shadow:var(--stone-black-shadow);--preview-opacity:.55}.gomoku-point[data-piece="2"],.gomoku-board[data-turn-color=white] .gomoku-point[data-piece="0"]{--stone-surface:var(--stone-white-surface);--stone-shadow:var(--stone-white-shadow);--preview-opacity:.75}.gomoku-point[data-piece]:not([data-piece="0"]):before{opacity:1;transform:scale(1)}.gomoku-point.is-last:after{z-index:2;aspect-ratio:1;content:"";pointer-events:none;border:0;border-radius:50%;width:clamp(3px,20%,6px);position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.gomoku-point.is-last[data-piece="1"]:after{background:var(--stone-last-on-black)}.gomoku-point.is-last[data-piece="2"]:after{background:var(--stone-last-on-white)}.gomoku-point.is-winning:before{box-shadow:var(--stone-shadow), 0 0 12px #d85b4399}.gomoku-point:not(:disabled)[data-piece="0"]:focus-visible:before{opacity:var(--preview-opacity);transform:scale(1)}@media (hover:hover) and (pointer:fine){.gomoku-point:not(:disabled)[data-piece="0"]:hover:before{opacity:var(--preview-opacity);transform:scale(1)}}.gomoku-point:disabled{cursor:default}.round-note{color:#777970;justify-content:space-between;font-size:.74rem;font-weight:750;display:flex}.settings-summary{color:#8a5c2c;margin:0;font-size:.72rem;font-weight:800}.turn-status{background:#ffffffb3;border:1px solid #dedfd9;border-radius:9px;flex-direction:column;justify-content:center;gap:5px;min-height:82px;padding:14px;display:flex}.turn-status strong{font-size:.88rem}.turn-status span{color:#777970;font-size:.72rem;line-height:1.45}.rematch-action,.settings-action{cursor:pointer;border-radius:7px;min-height:44px;padding:0 16px;font-weight:800}.rematch-action{color:#fff;background:#202229;border:1px solid #202229;box-shadow:0 3px #050506}.settings-action{color:#3d403b;background:#fff;border:1px solid #c8c9c3;box-shadow:0 3px #c8c9c3}.rematch-action:disabled,.settings-action:disabled{cursor:not-allowed;opacity:.45;box-shadow:none}.rules-link{color:#666961;justify-content:center;align-items:center;gap:6px;margin-top:5px;font-size:.74rem;font-weight:750;text-decoration:none;display:inline-flex}@media (hover:hover) and (pointer:fine){.rules-link:hover{color:#202229}}.rules-link svg{width:15px;height:15px}@media (width>=901px){.gomoku-layout{min-height:100vh}}@media (width<=900px){.gomoku-layout{width:min(660px,100% - 32px);padding-top:14px}.table-layout{grid-template-columns:1fr;gap:18px}.players-panel{order:1;grid-template-columns:1fr 1fr;display:grid}.board-shell{order:2;width:min(100%,100dvh - 210px)}.action-panel{order:3}.turn-status{min-height:0}}@media (width<=520px){.gomoku-layout{width:calc(100% - 20px);min-height:auto;padding:10px 0 18px}.table-layout{gap:13px}.setup-panel{align-items:end;padding:12px}.setup-form{--setup-padding:18px;border-radius:16px;max-height:calc(100dvh - 24px);transform:translateY(32px)scale(.99)}.player-card{gap:8px;padding:10px}.stone-swatch{width:22px;height:22px}.player-card strong{font-size:.75rem}.player-card span{font-size:.66rem}.player-card time{font-size:.7rem}.board-shell{width:100%}.gomoku-board{border-radius:5px;box-shadow:0 5px #a96f35,0 14px 32px #5936152e}}@media (prefers-reduced-motion:reduce){.setup-panel,.setup-form{transition-duration:1ms}}