:root{font-family:DM Sans,Noto Sans SC,sans-serif;color:#2c2e2a;background:#f5f1e9;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased}*{box-sizing:border-box}[hidden]{display:none!important}body{margin:0;min-width:320px;background:radial-gradient(circle at 50% 15%,#faf8f3,#f5f1e9 70%)}button{font:inherit}button:focus-visible,canvas:focus-visible{outline:3px solid #ba7949;outline-offset:3px}.site-shell{min-height:100dvh;height:100dvh;display:flex;flex-direction:column;max-width:1500px;margin:auto;padding:0 36px}.topbar{flex:none;height:68px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #ddd6cb}.brand,.top-actions{display:flex;align-items:center}.brand{gap:12px}.brand-mark{width:29px;height:29px;display:grid;grid-template-columns:repeat(2,1fr);gap:3px;transform:rotate(-12deg)}.brand-mark i{display:block;border-radius:50%;background:#343735}.brand-mark i:nth-child(2),.brand-mark i:nth-child(3){background:#c78351}.brand-name{display:flex;align-items:center;gap:11px;font-family:"Noto Serif SC",serif;font-size:21px;font-weight:700;letter-spacing:.07em}.brand-name small{font:500 11px Noto Sans SC,sans-serif;color:#898177;letter-spacing:.12em}.brand-divider{height:18px;width:1px;background:#d5cec3}.top-actions{gap:13px}.local-badge{display:flex;align-items:center;gap:8px;color:#746e65;font-size:11px;font-weight:600;margin-right:8px;padding:6px 8px;border:0;border-radius:8px;background:transparent;cursor:pointer}.local-badge:hover{background:#eae3d8}.local-badge b{font:inherit}.local-badge span{width:7px;height:7px;border-radius:50%;background:#91a17a;box-shadow:0 0 0 4px #e6eade}.icon-button{width:36px;height:36px;border:0;border-radius:10px;background:transparent;display:grid;place-items:center;color:#6a685e;cursor:pointer;transition:background .2s,transform .2s;position:relative}.icon-button:hover{background:#eae3d8;transform:translateY(-1px)}.icon-button svg{width:20px;height:20px}.icon-button.muted .sound-wave{display:none}.icon-button.muted:after{content:"";position:absolute;width:22px;height:1.8px;background:currentColor;transform:rotate(-45deg)}.details-button{height:36px;border:1px solid #dcd5ca;border-radius:9px;background:#fffcf7;padding:0 12px;display:flex;align-items:center;gap:7px;color:#56584f;font-size:11px;font-weight:700;cursor:pointer;transition:background .2s,border-color .2s}.details-button:hover{background:#f1e8db;border-color:#c8b79f}.details-button svg{width:16px;height:16px}.game-main{min-height:0;flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;padding:8px 0 12px}.game-heading,.turn-bar,.board-panel{width:min(720px,calc(100vw - 32px),calc(100dvh - 275px));min-width:0}.game-heading{flex:none;display:flex;align-items:end;justify-content:space-between;min-height:43px;padding:0 3px}.section-overline{display:block;color:#b98155;font-size:9px;font-weight:700;letter-spacing:.2em}.game-heading h1{margin:2px 0 0;font-family:"Noto Serif SC",serif;font-size:19px;font-weight:600;letter-spacing:.05em;line-height:1.35}.game-heading h1 span{color:#c48756}.board-size{color:#9b9184;font-size:10px;padding-bottom:4px}.online-score{display:flex;align-items:baseline;gap:5px;padding:4px 9px;border:1px solid #e2d4c0;border-radius:9px;background:#fbf4e9;color:#746b5e;white-space:nowrap;font-size:10px}.online-score[hidden]{display:none}.online-score strong{color:#463b2d;font-size:18px;font-weight:700;line-height:1;font-variant-numeric:tabular-nums}.online-score b{color:#b6906f;font-size:14px}.site-shell.online .board-size{display:none}.turn-bar{flex:none;min-height:59px;display:flex;align-items:center;gap:13px;padding:8px 14px;background:#fffdfa;border:1px solid #e8e0d5;border-radius:13px;box-shadow:0 7px 26px #5f49250a}.turn-copy{min-width:0;display:flex;flex-direction:column;gap:2px;margin-right:auto}.turn-eyebrow{color:#b58158;font-size:9px;font-weight:700;letter-spacing:.15em}.turn-copy strong{font-size:13px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.presence-summary{display:block;color:#797c70;font-size:10px;white-space:nowrap}.site-shell.online .turn-bar{min-height:67px}.site-shell.online .player:not(.online){opacity:.55}.turn-players{display:flex;align-items:center;gap:7px}.player{min-width:76px;height:34px;display:flex;align-items:center;gap:7px;padding:0 8px;border:1px solid #ede8df;border-radius:18px;color:#8d867c;font-size:11px;font-weight:700;transition:background .2s,border-color .2s,color .2s,box-shadow .2s}.player.active{background:#f8f2e8;border-color:#d4ad83;color:#413a32;box-shadow:0 2px 7px #8f694522}.player.winner{background:#faecda;border-color:#c98a50}.player i{display:none;width:5px;height:5px;border-radius:50%;background:#c1814d;margin-left:auto}.player.active i{display:block}.player-stone,.history-stone{flex:none;display:block;border-radius:50%;box-shadow:0 2px 4px #8577664f}.player-stone{width:18px;height:18px}.black-stone{background:radial-gradient(circle at 33% 28%,#62635e,#282b2b 50%,#101414)}.white-stone{background:radial-gradient(circle at 34% 27%,#fff,#f8f6f0 50%,#cec8bb);border:1px solid #d8d1c4}.state-pill{flex:none;color:#8c867d;font-size:10px;background:#f0eee9;border-radius:16px;padding:6px 9px}.state-pill.in-progress{color:#687d51;background:#edf2e7}.state-pill.is-finished{color:#b97743;background:#faecdf}.board-panel{flex:none;padding:9px 9px 0;border:1px solid #e7dfd2;border-radius:16px;background:#fffdfa;box-shadow:0 15px 45px #5a47251a}.board-wrap{position:relative;width:100%;aspect-ratio:1;border:5px solid #c69c69;border-radius:8px;background:#e6c89c;box-shadow:inset 0 0 0 1px #a67a4f,0 3px 10px #6a4b2424;overflow:hidden}.board-wrap:before{content:"";position:absolute;inset:2px;border:1px solid #ad8253;border-radius:2px;z-index:2;pointer-events:none}.board-wrap #Cocos2dGameContainer,.board-wrap #gameCanvas{display:block;width:100%!important;height:100%!important;max-width:100%;max-height:100%}.board-wrap canvas{touch-action:manipulation}.start-overlay{position:absolute;inset:0;z-index:3;display:grid;place-items:center;pointer-events:none}.start-overlay[hidden]{display:none}.start-card{width:min(83%,290px);padding:23px 22px 20px;text-align:center;background:#fffcf7;border:1px solid #fff8ef;border-radius:15px;box-shadow:0 15px 45px #4930194a;pointer-events:auto;animation:rise .3s ease-out}.start-decoration{color:#af7848;font-size:14px;letter-spacing:.55em}.start-card h2{font-family:"Noto Serif SC",serif;font-size:18px;margin:11px 0 7px;font-weight:600}.start-card p{color:#8b8276;font-size:11px;line-height:1.6;margin:0 0 17px}.online-card{max-width:300px;padding:20px}.online-card h2{margin:8px 0 5px}.online-card p{margin-bottom:10px}.online-card small{display:block;color:#777a6e;font-size:10px;margin:10px 0}.room-code{height:42px;padding:0 8px 0 17px;display:flex;align-items:center;justify-content:space-between;border:1px solid #d9c3a8;border-radius:9px;background:#f8efdf}.room-code>span{font-size:23px;font-weight:700;letter-spacing:.2em;color:#58432e}.room-code button{border:0;border-radius:5px;padding:5px 8px;background:#e7d5bb;color:#69513a;font-size:10px;cursor:pointer}.online-card .primary-button{margin-top:10px}.primary-button{width:100%;height:43px;border:0;border-radius:9px;background:#303e35;color:#fff;font-size:12px;font-weight:700;letter-spacing:.06em;display:flex;align-items:center;justify-content:center;gap:9px;cursor:pointer;box-shadow:0 7px 14px #31423824;transition:background .2s,transform .2s}.primary-button:hover{background:#47614d;transform:translateY(-2px)}.primary-button:active{transform:translateY(0)}.primary-button:disabled{opacity:.55;cursor:not-allowed;transform:none}.board-controls{min-height:48px;display:flex;align-items:center;justify-content:space-between;gap:10px}.board-caption{color:#8d8579;font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.control-actions{display:flex;align-items:center;gap:8px;flex:none}.move-count{color:#a09588;font-size:11px;margin-right:4px;white-space:nowrap}.secondary-button{height:32px;border:1px solid #e6ded2;border-radius:8px;background:#fffdfa;color:#6d695f;padding:0 10px;display:inline-flex;align-items:center;justify-content:center;gap:5px;font-size:11px;font-weight:600;cursor:pointer}.secondary-button svg{width:14px;height:14px}.secondary-button:not(:disabled):hover{background:#f8f1e7;border-color:#cba879}.secondary-button:disabled{opacity:.45;cursor:not-allowed}.danger-button{color:#ae5c4b;border-color:#e7c7bd}.danger-button:hover{background:#fff1ed!important;border-color:#d99f90!important}.setup-dialog{width:min(430px,calc(100vw - 28px));max-height:88dvh;padding:28px;border:1px solid #e4d9ca;border-radius:20px;background:#fffdfa;color:#2c2e2a;box-shadow:0 22px 70px #25180e55}.setup-dialog::backdrop{background:#292319a8;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px)}.setup-dialog h2{font-family:"Noto Serif SC",serif;font-size:25px;margin:6px 0 0}.setup-intro{color:#8b8177;font-size:12px;line-height:1.7;margin:10px 0 20px}.mode-options{display:grid;gap:10px}.mode-option{position:relative;min-height:94px;border:1px solid #e8dfd2;border-radius:12px;background:#fffaf2;padding:15px 18px 14px 75px;text-align:left;display:flex;flex-direction:column;justify-content:center;gap:3px;cursor:pointer;transition:border-color .2s,background .2s,transform .2s}.mode-option:hover{border-color:#bb956b;background:#faf1e3;transform:translateY(-2px)}.mode-option strong{font-size:15px}.mode-option small{color:#978c7f;font-size:11px}.mode-icon{position:absolute;left:18px;top:26px;width:42px;height:42px;display:grid;place-items:center;border-radius:10px;background:#e9d9be;color:#5a4634;font-size:16px;letter-spacing:-.1em}.mode-arrow{position:absolute;right:18px;top:33px;color:#b88255;font-size:18px}.lobby-status{margin-bottom:15px;color:#7b806d;font-size:11px}.lobby-status:before{content:"";display:inline-block;width:7px;height:7px;border-radius:50%;margin-right:7px;background:#91a17a}.lobby-status.offline:before{background:#ce9167}.lobby-divider{display:flex;align-items:center;gap:10px;color:#a09487;font-size:10px;margin:18px 0 13px}.lobby-divider:before,.lobby-divider:after{content:"";flex:1;height:1px;background:#eae1d5}.join-form label{display:block;color:#5f5a51;font-size:11px;font-weight:700;margin-bottom:7px}.join-form>div{display:flex;gap:8px}.join-form input{min-width:0;flex:1;height:42px;border:1px solid #d9cfc1;border-radius:8px;padding:0 12px;background:#fff;color:#343633;font-size:15px;letter-spacing:.18em}.join-form button{flex:none;border:0;border-radius:8px;background:#e5d5be;color:#58462f;padding:0 14px;font-size:11px;font-weight:700;cursor:pointer}.join-form button:hover{background:#d9bf9b}.lobby-error{min-height:16px;margin:11px 0 0;color:#b65543;font-size:11px}.toast{position:fixed;left:50%;bottom:max(18px,env(safe-area-inset-bottom));z-index:40;transform:translate(-50%);padding:10px 15px;border-radius:9px;background:#303e35;color:#fff;box-shadow:0 8px 28px #2a251a42;font-size:12px;white-space:nowrap}.details-dialog{width:min(420px,calc(100vw - 28px));max-height:min(620px,82dvh);padding:25px;border:1px solid #e4d9ca;border-radius:18px;background:#fffdfa;color:#2c2e2a;box-shadow:0 22px 70px #25180e55;overflow:hidden}.details-dialog::backdrop{background:#2621199c;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.details-header,.details-summary{display:flex;align-items:center;justify-content:space-between}.details-header h2{font-family:"Noto Serif SC",serif;font-size:22px;margin:5px 0 0}.close-button{width:32px;height:32px;border:0;border-radius:50%;background:#f2ece3;color:#6b6156;font-size:25px;line-height:1;cursor:pointer}.close-button:hover{background:#e8dac9}.details-summary{margin-top:24px;padding-bottom:10px;border-bottom:1px solid #eae3da;font-size:12px;font-weight:700}.details-summary span:last-child{color:#a79582;font-size:11px}.history-list{height:min(280px,38dvh);overflow:auto;scrollbar-width:thin;scrollbar-color:#d6c5b0 transparent}.history-empty{text-align:center;padding:45px 0 15px}.mini-board{display:grid;place-items:center;width:36px;height:36px;margin:0 auto 8px;border:1px solid #e8ddd0;border-radius:8px;color:#b99470;font-size:24px}.history-empty p{margin:3px 0;font-family:"Noto Serif SC",serif;font-size:13px;color:#746e66}.history-empty small{color:#b0a89d;font-size:10px}.history-item{height:39px;display:flex;align-items:center;gap:10px;border-bottom:1px solid #f0ece6;color:#625d55;font-size:12px}.history-item.latest{background:#fbf6ef}.history-number{width:28px;color:#aaa095;font-size:11px;text-align:center}.history-stone{width:16px;height:16px}.history-coordinate{margin-left:auto;color:#a89786;font-weight:700}.rules{margin-top:16px;padding:15px;border-radius:10px;background:#f2efe8}.rules strong{font-size:11px}.rules p{margin:6px 0 0;color:#7d766d;font-size:11px;line-height:1.6}.modal-backdrop{position:fixed;inset:0;z-index:20;display:grid;place-items:center;padding:24px;background:#211f1bc0;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px)}.modal-backdrop[hidden]{display:none}.result-modal{width:min(100%,380px);padding:36px 32px 32px;text-align:center;border-radius:20px;background:#fffdf9;box-shadow:0 25px 75px #120d0959;animation:rise .35s ease-out}.result-spark{display:block;font-size:32px;color:#bf8a57;margin-bottom:15px}.result-modal h2{font-family:"Noto Serif SC",serif;font-size:29px;margin:10px 0 7px}.result-modal p{font-size:13px;color:#847a70;margin:0 0 24px}.result-modal .primary-button{max-width:220px;margin:auto}.result-end-room{display:block;margin:13px auto 0;padding:5px 8px;border:0;background:transparent;color:#a06151;font-size:11px;cursor:pointer}.result-end-room[hidden]{display:none}@keyframes rise{0%{opacity:0;transform:translateY(12px) scale(.96)}to{opacity:1;transform:none}}@media(max-width:640px){.site-shell{padding:0 12px}.topbar{height:58px}.brand-mark{width:25px;height:25px}.brand-name{font-size:18px;gap:7px}.brand-name small{font-size:9px}.brand-divider{height:15px}.top-actions{gap:5px}.local-badge{margin-right:1px;padding:6px;font-size:10px}.local-badge span{display:none}.details-button{padding:0 9px}.game-main{gap:8px;padding:5px 0 9px}.game-heading{min-height:38px}.game-heading h1{font-size:16px}.board-size{font-size:9px}.turn-bar{min-height:55px;padding:7px 9px;gap:5px}.turn-copy strong{font-size:11px}.presence-summary{font-size:9px}.site-shell.online .turn-bar{min-height:67px}.turn-players{gap:4px}.player{min-width:58px;height:30px;padding:0 6px;gap:5px;font-size:10px}.player-stone{width:14px;height:14px}.state-pill{display:none}.board-panel{padding:6px 6px 0;border-radius:12px}.board-wrap{border-width:4px;border-radius:7px}.board-controls{min-height:45px}.board-caption,.move-count{font-size:10px}.secondary-button{padding:0 8px}}@media(max-width:370px){.board-size{display:none}.online-score{gap:3px;padding:4px 6px;font-size:9px}.online-score strong{font-size:16px}.turn-copy{max-width:120px}.board-caption{max-width:110px}.control-actions{gap:4px}.move-count{margin-right:0}.start-card{padding:18px 15px 16px}.start-card h2{font-size:16px}.start-card p{font-size:10px;margin-bottom:12px}.online-card{padding:14px}.online-card p{margin-bottom:7px}.online-card small{margin:6px 0}.room-code{height:37px}.room-code>span{font-size:19px}}@media(max-height:540px){.online-card p{display:none}.online-card .primary-button{height:36px}}@media(max-height:560px)and (min-width:500px){.site-shell{padding:0 16px}.topbar{height:50px}.game-main{display:grid;grid-template-columns:min(calc(100dvh - 112px),calc(100vw - 250px)) minmax(190px,300px);grid-template-rows:auto auto;justify-content:center;align-content:center;align-items:start;gap:12px 18px;padding:8px 0}.game-heading,.turn-bar,.board-panel{width:auto}.board-panel{grid-column:1;grid-row:1 / span 2;padding:6px 6px 0}.game-heading{grid-column:2;grid-row:1}.turn-bar{grid-column:2;grid-row:2;min-height:150px;flex-wrap:wrap;align-content:center}.turn-copy{width:100%}.state-pill{display:inline-block}.board-caption{display:none}.control-actions{width:100%;justify-content:space-between}}@media(max-height:620px)and (min-width:641px){.topbar{height:54px}.game-heading{min-height:35px}.turn-bar{min-height:48px}.board-controls{min-height:42px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation-duration:.01ms!important;transition-duration:.01ms!important}}
