*,*:before,*:after{margin:0;padding:0;box-sizing:border-box}[hidden]{display:none!important}:root{--black: #000000;--white: #ffffff;--gray-100: #f7f7f7;--gray-200: #e3e3e3;--gray-400: #999999;--gray-700: #333333;--border: 2px solid var(--black);--border-thin: 1px solid var(--gray-200);--font: "Helvetica Neue", Helvetica, Arial, sans-serif;--header-height: 52px;--controls-height: 52px;--canvas-side-pad: 16px}[data-theme=dark]{--black: #e8e8e8;--white: #0f0f0f;--gray-100: #1a1a1a;--gray-200: #2a2a2a;--gray-400: #888888;--gray-700: #c0c0c0}[data-theme=dark] .results-screen{background:#0f0f0ff2}[data-theme=stylized]{--black: #000000;--white: #ffffff;--gray-100: #1A6FA0;--gray-200: #e3e3e3;--gray-400: #999999;--gray-700: #333333}[data-theme=stylized] .player-1{color:#555}[data-theme=stylized] .results-screen{background:#fffffff2}[data-theme=stylized] .results-score-label.player-1,[data-theme=stylized] .results-score-value.player-1,[data-theme=stylized] .status-player.player-1{color:#555}html,body{height:100%;width:100%;overflow:hidden;touch-action:none;-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}body{font-family:var(--font);background:var(--white);color:var(--black);display:flex;flex-direction:column}.header{height:var(--header-height);border-bottom:var(--border);display:flex;align-items:center;justify-content:center;flex-shrink:0;position:relative}.header-title{font-size:17px;font-weight:800;letter-spacing:.18em;text-transform:uppercase}.header-help-btn{position:absolute;right:12px;width:36px;height:36px;border:var(--border);background:var(--white);color:var(--black);font-family:var(--font);font-size:18px;font-weight:700;cursor:pointer}.header-help-btn:hover{background:var(--gray-100)}.header-night-btn{position:absolute;left:12px;width:36px;height:36px;border:var(--border);background:var(--white);color:var(--black);font-family:var(--font);font-size:16px;cursor:pointer}.header-night-btn:hover{background:var(--gray-100)}.controls-bar{height:var(--controls-height);border-bottom:var(--border);display:flex;align-items:stretch;flex-shrink:0}#pre-game-controls{display:flex;width:100%;align-items:center;justify-content:center}#game-controls{display:flex;width:100%;align-items:center;justify-content:space-between;padding:0 var(--canvas-side-pad);gap:10px;font-size:12px;font-weight:700;letter-spacing:.1em;text-transform:uppercase}.game-status-left{display:flex;align-items:center;gap:10px}#game-controls .btn{flex:none;height:32px;width:auto;padding:0 16px;border:var(--border)}.btn{height:100%;flex:1;font-family:var(--font);font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;cursor:pointer;border:none;border-right:var(--border);transition:background .1s,color .1s;white-space:nowrap;padding:0 8px}@media(max-width:639px){.controls-bar .btn:last-child{border-right:none}}.btn-primary{background:var(--black);color:var(--white)}.btn-primary:hover{background:var(--gray-700)}.btn-primary:active{background:var(--black)}.btn-secondary{background:var(--white);color:var(--black)}.btn-secondary:hover{background:var(--gray-100)}.btn-secondary.active{background:var(--black);color:var(--white)}.btn:disabled{opacity:.35;cursor:not-allowed}.status-player.player-1{color:#3498db}.status-player.player-2{color:#e74c3c}.player-1{color:#3498db}.player-2{color:#e74c3c}.canvas-wrapper{flex:1;display:flex;align-items:center;justify-content:center;overflow:hidden;background:var(--gray-100);position:relative;min-height:0}.canvas-wrapper canvas{display:block;touch-action:none;-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}.hud-bar{display:flex;justify-content:space-between;flex-shrink:0;padding:6px var(--canvas-side-pad);background:var(--gray-100)}.hud-panel{padding:6px 4px;min-width:90px;-webkit-user-select:none;user-select:none;visibility:hidden;border:var(--border);border-color:transparent}.hud-panel.hud-active{border-color:var(--black)}.hud-panel.hud-winner{border-color:var(--black);border-width:3px}.hud-bar.hud-visible .hud-panel{visibility:visible}.hud-p2{text-align:right}.hud-name{font-family:var(--font);font-size:9px;font-weight:800;letter-spacing:.16em;text-transform:uppercase;margin-bottom:5px}.hud-number{font-family:var(--font);font-size:30px;font-weight:800;color:var(--black);line-height:1;margin-bottom:5px}.hud-sub{font-family:var(--font);font-size:9px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--gray-400)}.territory-info{position:absolute;bottom:16px;right:16px;background:var(--white);border:var(--border);padding:14px 16px;min-width:156px;opacity:0;pointer-events:none;transition:opacity .15s ease}.territory-info.visible{opacity:1}.info-title{font-size:10px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--gray-400);margin-bottom:10px}.info-row{display:flex;justify-content:space-between;align-items:center;margin:5px 0;gap:16px}.info-label{font-size:12px;font-weight:400;color:var(--gray-400);text-transform:uppercase;letter-spacing:.06em}.info-value{font-size:13px;font-weight:700;color:var(--black)}.size-badge{display:inline-block;padding:2px 7px;font-size:10px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;border:1.5px solid currentColor}.size-xs{color:#888}.size-s{color:#2980b9}.size-m{color:#27ae60}.size-l{color:#e67e22}.size-xl{color:#8e44ad}.modal{border:var(--border);padding:24px;min-width:280px;background:var(--white);color:var(--black);font-family:var(--font);margin:16px auto}.modal::backdrop{background:#00000080}.modal-title{font-size:14px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;margin-bottom:8px}.modal-remaining{font-size:18px;font-weight:700;text-align:center;margin-bottom:20px}.modal-error{font-size:11px;font-weight:600;color:#e74c3c;text-align:center;min-height:16px;margin-top:-12px;margin-bottom:12px}.modal-input-wrap{display:flex;justify-content:center;margin-bottom:20px}.modal-input{width:120px;height:44px;border:var(--border);background:var(--white);color:var(--black);text-align:center;font-size:18px;font-weight:700;font-family:var(--font);outline:none}.modal-input:focus{outline:3px solid var(--black);outline-offset:2px}.modal-actions{display:flex;gap:8px}.modal-actions .btn{flex:1;height:40px;border:var(--border)}.how-to-play-modal{max-width:420px;width:90vw;padding:clamp(20px,2.6dvh,32px) clamp(22px,3vw,28px);position:relative}.htp-close{position:absolute;top:clamp(10px,1.5dvh,16px);right:clamp(10px,1.5dvh,16px);width:32px;height:32px;background:transparent;border:none;cursor:pointer;font-size:20px;font-weight:400;color:var(--black);font-family:var(--font)}.htp-close:hover{color:var(--gray-400)}.htp-heading{font-size:clamp(17px,2.2dvh,22px);font-weight:800;letter-spacing:0;text-transform:none;margin-bottom:clamp(4px,.5dvh,8px)}.htp-tagline{font-size:clamp(22px,2.9dvh,28px);font-weight:800;color:var(--black);margin-bottom:clamp(16px,2.1dvh,28px);letter-spacing:.18em;text-transform:uppercase}.htp-phases{display:flex;flex-direction:column;gap:0}.htp-phase{border-top:var(--border-thin);padding:clamp(11px,1.4dvh,16px) 0}.htp-phase-label{display:block;font-size:10px;font-weight:800;letter-spacing:.16em;text-transform:uppercase;margin-bottom:6px;color:var(--black)}.htp-phase-text{font-size:14px;font-weight:400;line-height:1.5;color:var(--gray-700)}.htp-phase-text+.htp-phase-text{margin-top:8px}.htp-phase-text strong{color:var(--black);font-weight:700}.htp-challenge{border-top:var(--border-thin);padding:clamp(11px,1.4dvh,16px) 0 0}.htp-challenge-text{font-size:14px;font-weight:400;line-height:1.5;color:var(--gray-700);margin-bottom:clamp(10px,1.3dvh,14px)}.htp-challenge-btn{display:block;margin:0 auto;font-family:var(--font);font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;cursor:pointer;border:var(--border);background:var(--white);color:var(--black);padding:9px 18px;transition:background .1s,color .1s}.htp-challenge-btn:hover:not(:disabled){background:var(--gray-100)}.htp-challenge-btn:disabled{opacity:.35;cursor:not-allowed}.welcome-modal{max-width:380px;width:90vw;padding:36px 28px 28px;text-align:center}.welcome-heading{font-size:16px;font-weight:400;letter-spacing:0;text-transform:none;margin-bottom:4px;color:var(--gray-700)}.welcome-title{font-size:32px;font-weight:800;letter-spacing:.18em;text-transform:uppercase;color:var(--black);margin-bottom:28px}.welcome-rules{display:flex;flex-direction:column;text-align:left;margin-bottom:24px}.welcome-rule{display:flex;align-items:flex-start;gap:12px;border-top:var(--border-thin);padding:12px 0}.welcome-rule-num{flex-shrink:0;width:24px;height:24px;border:var(--border);display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:800;color:var(--black)}.welcome-rule p{font-size:14px;font-weight:400;line-height:1.5;color:var(--gray-700);margin:0}.welcome-rule p strong{color:var(--black);font-weight:700}.welcome-play-btn{width:100%;height:44px;border:var(--border);font-size:13px}.results-screen{position:fixed;top:0;right:0;bottom:0;left:0;z-index:100;background:#fffffff2;display:flex;align-items:center;justify-content:center}.results-card{border:var(--border);padding:32px;background:var(--white);min-width:300px;text-align:center}.results-title{font-size:20px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;margin-bottom:24px}.results-scores{display:flex;justify-content:center;gap:40px;margin-bottom:28px}.results-score{display:flex;flex-direction:column;align-items:center;gap:4px}.results-score-label{font-size:10px;font-weight:700;letter-spacing:.12em;text-transform:uppercase}.results-score-value{font-size:48px;font-weight:800;line-height:1}.results-score-label.player-1,.results-score-value.player-1{color:#3498db}.results-score-label.player-2,.results-score-value.player-2{color:#e74c3c}.results-actions{display:flex;flex-direction:column;gap:8px}.results-actions-row{display:flex;gap:8px}.results-actions .btn{height:40px;border:var(--border)}.results-actions-row .btn{flex:1}.results-challenge-btn{width:100%!important;align-self:center;flex:none}@media(min-width:640px){:root{--header-height: 56px;--controls-height: 48px}.header-title{font-size:20px}.btn{font-size:12px;flex:none;width:160px;border-right:none;border-left:var(--border)}.controls-bar{border-bottom:var(--border)}#pre-game-controls{gap:8px}}@media(min-width:640px){.controls-bar .btn{border:var(--border);border-radius:0;height:36px}.controls-bar .btn-primary,.controls-bar .btn-secondary.active{background:var(--black);color:var(--white)}}