@font-face{font-family:Arena;src:local('Bahnschrift');font-display:swap}
:root{color-scheme:dark;--bg:#131411;--panel:#1b1d18;--border:#34362c;--muted:#949889;--text:#eeeede;--orange:#ff7939;--lime:#c5d7a2;--display:Arena,'Arial Narrow',Impact,sans-serif;--body:'Segoe UI',Arial,sans-serif}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font-family:var(--body);font-size:13px;min-width:320px}button,a,select,input{-webkit-tap-highlight-color:transparent}button,select,input{font:inherit}button{cursor:pointer;color:inherit}button:disabled{opacity:.35;cursor:not-allowed}a{color:inherit}button:focus-visible,a:focus-visible,select:focus-visible,input:focus-visible{outline:2px solid var(--orange);outline-offset:5px}button{border:0}button:not(:disabled){transition:color .15s,background .15s,border-color .15s,transform .15s}button:not(:disabled):active{transform:translateY(1px)}.ambient{position:fixed;inset:0;pointer-events:none;background:radial-gradient(ellipse at 43% 43%,#49503519,transparent 60%);z-index:-1}.topbar{height:84px;padding:0 3.5%;border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;gap:30px;background:#141511ed}.brand{display:flex;align-items:center;font-family:var(--display);font-stretch:condensed;font-size:28px;letter-spacing:-1.3px;text-decoration:none;font-weight:900}.brand>span:not(.brand-mark){color:var(--orange)}.brand-mark{font-size:43px;color:var(--orange);margin-right:8px;font-family:Impact,sans-serif;transform:skewX(-10deg)}.brand sup{font:10px var(--body);align-self:flex-start;margin-top:12px;margin-left:4px;color:var(--muted)}nav{display:flex;align-items:center;gap:35px;font-size:11px;font-weight:700;letter-spacing:1.4px;height:100%}nav button{background:none;color:var(--muted);font-size:10px;letter-spacing:1.2px;height:100%}nav button:hover{color:var(--text)}nav button span{margin-left:9px}.nav-active{height:100%;display:flex;align-items:center;border-bottom:2px solid var(--orange);position:relative}.nav-active:before{content:'';height:5px;width:5px;border-radius:50%;background:var(--orange);margin-right:9px}.header-right{display:flex;align-items:center;gap:14px}.local-badge{font-size:10px;font-weight:600;letter-spacing:1px;color:var(--muted);margin-right:13px;display:flex;align-items:center;gap:7px}.local-badge i,footer i{width:5px;height:5px;border-radius:50%;background:var(--lime);display:inline-block}.icon-button{width:34px;height:34px;border:1px solid var(--border);background:transparent;border-radius:50%;display:grid;place-items:center;color:#c3c6b5}.icon-button:hover{background:var(--border);color:var(--orange)}.icon-button svg{width:16px;height:16px}.arena-heading{display:flex;align-items:center;justify-content:space-between;margin:33px 0 29px;gap:20px}.eyebrow{font-size:9px;font-weight:600;letter-spacing:2.2px;color:var(--muted);line-height:1.6}.tiny-cross{color:var(--orange);padding-right:5px;font-size:13px}h1{font-family:var(--display);font-stretch:condensed;font-size:clamp(27px,3vw,44px);line-height:1.14;letter-spacing:-1.3px;margin:9px 0 0;font-weight:850}h1 span{color:var(--muted)}.mobile-br{display:none}.arena-id{text-align:right;padding-top:14px;white-space:nowrap}.arena-id span{font-size:10px;letter-spacing:1.5px;color:#c0c3b4}.arena-id small{display:block;font-size:8px;letter-spacing:1.2px;color:#707568;margin-top:7px}main{max-width:1536px;margin:auto;padding:0 3.5%}.arena-layout{display:grid;grid-template-columns:minmax(195px,240px) minmax(380px,1fr) minmax(195px,240px);gap:32px;align-items:start}.panel-label{height:31px;display:flex;justify-content:space-between;align-items:flex-start;font-size:9px;font-weight:650;letter-spacing:1.6px;color:#a3a896}.panel-label>span{color:#5e6455;font-size:9px}.rival-card{background:linear-gradient(130deg,#20231b,#191b16);border:1px solid var(--border)}.rival-art{height:210px;position:relative;overflow:hidden;background:radial-gradient(ellipse at 50% 100%,#c8602538,transparent 65%),repeating-linear-gradient(0deg,transparent,transparent 31px,#4f564919 32px),repeating-linear-gradient(90deg,transparent,transparent 31px,#4f564919 32px),#20241b;border-bottom:1px solid var(--border)}.target-ring{position:absolute;border:1px solid #89945e30;width:175px;height:175px;border-radius:50%;top:17px;left:calc(50% - 87.5px)}.target-ring:before,.target-ring:after{content:'';position:absolute;inset:14px;border:1px dashed #89945e40;border-radius:50%}.target-ring:after{inset:-15px;border-style:solid;border-color:#89945e16}.rival-svg{position:absolute;width:220px;bottom:-9px;left:calc(50% - 110px);filter:drop-shadow(0 7px 20px #0008)}.art-code{position:absolute;left:13px;top:12px;font-family:monospace;font-size:8px;color:#8b9379;letter-spacing:1.5px}.art-plus{position:absolute;right:13px;top:8px;color:#7a8369;font-size:18px}.art-bottom{display:flex;justify-content:space-between;align-items:center;position:absolute;bottom:0;left:0;right:0;padding:23px 13px 11px;background:linear-gradient(transparent,#151810)}.art-bottom>span:first-child{display:flex;align-items:center;gap:6px;font-size:7px;color:#b8c29d;letter-spacing:1.1px}.art-bottom i{width:4px;height:4px;background:var(--orange);border-radius:50%}.art-bottom>span:last-child{color:var(--orange);font-size:18px}.rival-info{padding:21px 19px 17px}.rival-info .eyebrow{font-size:7px;letter-spacing:1.3px}.rival-info h2{font:800 32px/.95 var(--display);letter-spacing:-.8px;margin:11px 0 15px}.rival-info h2 span{font:9px var(--body);vertical-align:top;display:inline-block;margin:1px 0 0 3px;color:var(--muted)}.rival-info p{color:#c3c7b5;font-size:12px;line-height:1.6;margin:0;font-style:italic}.difficulty-section{padding:16px 14px 15px;border-top:1px solid var(--border)}.mini-label{font-size:8px;letter-spacing:1.15px;font-weight:600;color:#acb29c}.difficulty-section .mini-label{display:flex;justify-content:space-between;font-size:7px}.mini-label>span{color:var(--orange);letter-spacing:.7px}.difficulty-picker{display:grid;grid-template-columns:1fr 1.5fr 1.1fr;margin-top:12px;gap:3px}.difficulty-picker button{background:#12150f;border:1px solid #383d2e;color:#7d8770;font-size:7px;padding:9px 2px;letter-spacing:.2px}.difficulty-picker button:hover{border-color:var(--orange)}.difficulty-picker button.active{background:#e97431;color:#171911;border-color:#ff8e4b;font-weight:800}.difficulty-section p{font-size:9px;color:#818976;margin:11px 0 0}.tip-card{margin-top:18px;padding:13px 2px;display:flex;gap:10px}.tip-icon{font-size:25px;line-height:25px;color:var(--orange)}.tip-card .mini-label{font-size:7px;letter-spacing:.8px}.tip-card p{color:#939b85;font-size:11px;line-height:1.6;margin:7px 0 0}.new-game{display:flex;align-items:center;gap:12px;justify-content:flex-start;width:100%;margin-top:14px;padding:15px 15px;background:var(--orange);color:#161710;font-size:10px;font-weight:800;letter-spacing:1px}.new-game>span:first-child{font-size:21px;font-weight:400;line-height:10px}.new-game>span:last-child{margin-left:auto;font-size:17px}.new-game:hover,.primary-button:hover{background:#ff965e}.board-column{min-width:0}.player-bar{display:flex;gap:12px;align-items:center;min-height:51px}.opponent{padding-bottom:13px}.human{padding-top:15px}.player-avatar{width:35px;height:35px;flex-shrink:0;display:grid;place-items:center;border:1px solid #4b4e3e}.rival-mini{background:#2e3226;color:var(--orange);font-size:26px}.human-mini{background:#e2e1c9;color:#4c5040}.human-mini svg{height:25px;width:25px}.player-name{flex:1;min-width:0}.player-name>strong{font-size:11px;letter-spacing:1px;display:block;font-weight:600}.player-name>strong>span{display:inline-block;font-size:7px;background:#373c2d;padding:2px 5px;color:#b5c09f;vertical-align:middle;margin-left:5px;letter-spacing:.6px}.player-name>strong>.human-tag{background:none;color:#7d8770;font-size:7px;padding-left:0}.captured-pieces{display:flex;align-items:center;height:18px;font-size:8px;color:#858e77;gap:0;margin-top:3px;white-space:nowrap}.captured-pieces svg{width:17px;height:18px;margin-left:-2px;filter:none}.captured-pieces .material{font-size:9px;color:#bac5a7;margin-left:7px}.player-indicator{font-size:8px;color:#828a76;letter-spacing:.8px;white-space:nowrap;display:flex;align-items:center;gap:6px}.player-indicator.active{color:var(--lime)}.player-indicator i{width:5px;height:5px;background:var(--lime);border-radius:50%}.board-shell{position:relative;padding:10px;border:1px solid #555d43;background:#252b1e;box-shadow:0 13px 0 -8px #0b0e07,0 15px 0 -8px #3c432f,0 24px 45px #0006;isolation:isolate}.board{display:grid;grid-template-columns:repeat(8,1fr);aspect-ratio:1;overflow:hidden;border:1px solid #11170c;position:relative;background:#9aab79}.board:after{content:'';position:absolute;inset:0;pointer-events:none;box-shadow:inset 0 0 22px #0006;z-index:2}.square{padding:0;border:0;border-radius:0;position:relative;display:grid;place-items:center;aspect-ratio:1;background:var(--square);touch-action:none;overflow:visible;isolation:isolate}.square.light{--square:#b4bd94;--coordinate:#536342}.square.dark{--square:#526443;--coordinate:#b7c394}.square:before{content:'';position:absolute;inset:0;background:linear-gradient(145deg,#fff1,#0001);pointer-events:none}.square:hover{box-shadow:inset 0 0 0 2px #ffd99290}.square.selected{background:#e4b65f;box-shadow:inset 0 0 0 3px #f9d684;z-index:1}.square.last-move{background:color-mix(in srgb,var(--square) 62%,#d8aa44)}.square.hint-square{box-shadow:inset 0 0 0 3px #e8f9af;background:color-mix(in srgb,var(--square) 60%,#ecff70)}.square.king-check{background:#b45637;box-shadow:inset 0 0 18px #ffad49}.square:focus-visible{outline:3px solid #ffeab1;outline-offset:-3px;z-index:4}.square .coord{position:absolute;font-size:8px;font-family:var(--body);font-weight:700;color:var(--coordinate);pointer-events:none}.coord.rank{top:3px;left:4px}.coord.file{bottom:2px;right:4px}.piece-svg{width:86%;height:89%;overflow:visible;filter:drop-shadow(0 3px 1.5px #111a);position:relative;pointer-events:none;z-index:1;transition:transform .15s}.square:hover .piece-svg{transform:translateY(-3px)}.square.selected .piece-svg{transform:translateY(-4px);filter:drop-shadow(0 6px 3px #442c2180)}.square .legal-dot{width:23%;height:23%;border-radius:50%;background:#1a2c1b4a;box-shadow:0 0 0 1px #ffffff12;position:absolute;pointer-events:none;z-index:2}.square .capture-ring{position:absolute;inset:4%;border:4px solid #ffcb80b3;border-radius:50%;z-index:2;pointer-events:none}.square.arrival .piece-svg{animation:arrive .25s ease-out}.board-corner{position:absolute;width:12px;height:12px;border-color:#d0d8a8;z-index:3;pointer-events:none}.tl{top:-1px;left:-1px;border-top:2px solid;border-left:2px solid}.tr{top:-1px;right:-1px;border-top:2px solid;border-right:2px solid}.bl{bottom:-1px;left:-1px;border-bottom:2px solid;border-left:2px solid}.br{bottom:-1px;right:-1px;border-bottom:2px solid;border-right:2px solid}#fx-canvas{position:absolute;inset:-90px;width:calc(100% + 180px);height:calc(100% + 180px);z-index:10;pointer-events:none}.move-ghost{position:absolute;pointer-events:none;z-index:6;display:none}.move-ghost .piece-svg{width:100%;height:100%;filter:drop-shadow(0 14px 5px #0007)}.board-toolbar{display:flex;justify-content:center;align-items:center;margin-top:23px;padding:15px 5px;border-top:1px solid #383d2e;border-bottom:1px solid #272c21;gap:18px}.board-toolbar button{background:none;font-size:8px;letter-spacing:.5px;color:#a7b094;display:flex;align-items:center;gap:7px;padding:2px}.board-toolbar button:hover{color:var(--orange)}.board-toolbar button span{font-size:17px;line-height:15px}.toolbar-divider{width:1px;height:12px;background:#3b4131}.live-dot{width:5px;height:5px;border-radius:50%;background:var(--orange);margin-top:3px}.turn-card{padding:19px 16px 17px;border:1px solid #735036;background:linear-gradient(135deg,#3b3021,#24251b)}.turn-card>.mini-label{display:flex;justify-content:space-between;font-size:7px;letter-spacing:.6px}.turn-card>.mini-label span{color:#a79b83;font-size:6px}.turn-title{display:flex;align-items:center;gap:9px;margin-top:25px}.turn-title>span{color:var(--orange);font-size:29px;line-height:25px}.turn-title h2{font:800 27px/1 var(--display);margin:0;letter-spacing:-.7px;white-space:nowrap}.turn-card p{font-size:10px;color:#b5ae98;line-height:1.55;min-height:30px;margin:12px 0 18px}.turn-progress{height:2px;background:#65523a}.turn-progress span{width:26%;display:block;height:2px;background:var(--orange)}.thinking .turn-progress span{animation:thinking 1.2s infinite alternate ease-in-out}.feed-header{margin-top:24px;display:flex;justify-content:space-between;align-items:center;padding-bottom:12px;border-bottom:1px solid #383d2e}.feed-header>span:last-child{font-size:7px;color:#69755c;letter-spacing:1px}.move-log{height:214px;overflow-y:auto;scrollbar-width:thin;scrollbar-color:#596746 transparent;border-bottom:1px solid #383d2e}.empty-log{text-align:center;padding:20px 10px}.empty-log>div{font-size:44px;color:#505b41;height:55px}.empty-log>span{font-size:13px;color:#8c997a;line-height:1.5;display:block}.empty-log>small{font-size:6px;letter-spacing:1px;color:#5e6d4d;display:block;margin-top:18px}.log-row{display:grid;grid-template-columns:24px 1fr 1fr;gap:5px;align-items:center;padding:10px 8px;color:#b8c2a7;border-bottom:1px solid #323929;font:12px monospace}.log-row:nth-child(even){background:#20251a}.log-row>span:first-child{color:#657554;font-size:9px}.log-row .capture-move{color:var(--orange)}.log-row:last-child{background:#2d3622}.log-row>span:last-child:empty:after{content:'·';color:#667752}.fx-card{border:1px solid #3e4832;background:#20281a;margin-top:21px;padding:13px 14px}.fx-card>div{display:flex;align-items:center;gap:8px}.fx-bolt{font-size:21px;color:var(--orange)}.fx-live{font-size:6px;letter-spacing:1px;margin-left:auto;color:#bdcda0;background:#3e4e2d;padding:3px 5px}.fx-card p{font-size:9px;color:#849571;margin:4px 0 15px}.fx-card button{display:flex;align-items:center;justify-content:space-between;width:100%;background:none;border-top:1px solid #3a472d;padding:12px 0 0;color:#becdad;font-size:7px;letter-spacing:.8px}.fx-card button span{font-size:14px}.fx-card button:hover{color:var(--orange)}.arena-note{display:flex;align-items:center;gap:12px;margin-top:20px;color:#748663}.arena-note>span:first-child{font-size:23px;color:#556b40}.arena-note p{font-size:10px;line-height:1.55;margin:0;white-space:nowrap}.note-line{height:1px;background:#3a452e;flex:1}footer{display:flex;justify-content:space-between;align-items:center;gap:15px;margin-top:34px;padding:19px 0 24px;border-top:1px solid #353c2b;font-size:7px;letter-spacing:.8px;color:#738364}footer>span:first-child{display:flex;align-items:center;gap:7px}footer>span:nth-child(2){letter-spacing:1.5px}footer b{font-weight:600;color:#aaba96}footer button{font-size:6px;letter-spacing:.6px;background:none;color:#849875;padding:0}footer button:hover{color:var(--orange)}.capture-banner{position:absolute;left:50%;top:46%;transform:translate(-50%,-50%) scale(.75) rotate(-5deg);display:flex;align-items:center;flex-direction:column;pointer-events:none;z-index:12;opacity:0;white-space:nowrap;text-shadow:0 4px 0 #3c1a0b,0 0 25px #000;background:linear-gradient(90deg,transparent,#20160bcf,transparent);padding:14px 50px}.capture-banner small{letter-spacing:5px;font-size:10px;font-weight:800;color:#ffdaa7}.capture-banner strong{font:900 clamp(35px,5vw,64px)/1.1 var(--display);letter-spacing:-1px;color:#fff2c7}.capture-banner>span{font-size:10px;letter-spacing:3px;color:#ffc582}.capture-banner.show{animation:banner 1.6s both}.board-shell.impact{animation:shake .48s both}.toast{position:fixed;bottom:24px;left:50%;transform:translate(-50%,15px);background:#e3e8ce;color:#202719;padding:14px 23px;font-size:12px;max-width:min(90vw,530px);box-shadow:0 10px 40px #0007;opacity:0;pointer-events:none;z-index:60;transition:opacity .2s,transform .2s;border-left:3px solid var(--orange)}.toast.visible{opacity:1;transform:translate(-50%,0)}dialog{background:#1d2418;color:var(--text);border:1px solid #64714f;padding:33px;width:min(520px,calc(100vw - 32px));max-height:88dvh;overflow:auto;box-shadow:0 30px 100px #0009}dialog::backdrop{background:#090c08cf;backdrop-filter:blur(8px)}dialog h2{font:800 36px/1.1 var(--display);letter-spacing:-.8px;margin:12px 0 20px}dialog p{color:#a5b396;font-size:13px;line-height:1.7}dialog .close-modal{position:absolute;top:12px;right:15px;background:transparent;font-size:25px;color:#a2b18f}dialog label{display:block;font-size:10px;letter-spacing:1px;color:#c1ceb1;margin:24px 0 10px}dialog select{background:#121b0b;color:#d2ddc2;padding:14px 12px;border:1px solid #536640;width:100%;border-radius:0;font-size:12px;max-width:100%}.primary-button{background:var(--orange);color:#1a1e13;display:flex;justify-content:space-between;padding:17px 20px;width:100%;font-size:11px;font-weight:800;letter-spacing:1px;margin-top:25px}.secondary-button{display:block;width:100%;background:transparent;border:1px solid #536640;margin-top:12px;padding:14px;letter-spacing:1px;font-size:9px}.check-label{display:flex!important;align-items:center;gap:10px;font-size:12px!important;letter-spacing:0!important}input[type=checkbox]{accent-color:var(--orange);width:17px;height:17px}.rules-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin:24px 0}.rules-grid b{font-size:12px;color:#edb273}.rules-grid p{font-size:11px;line-height:1.5;margin:6px 0}.credits{display:block;text-align:center;font-size:9px;color:#7c8e6d;margin-top:20px}.promotion-options{display:flex;gap:10px}.promotion-options button{width:25%;background:#354729;border:1px solid #607f4a;padding:8px 5px;color:#d5e6c3;font-size:9px}.promotion-options button:hover{background:#986437}.promotion-options svg{width:100%;height:auto}.result-stats{display:flex;justify-content:space-around;border-block:1px solid #425233;margin:25px 0;padding:20px}.result-stats strong{display:block;font:30px var(--display);color:var(--orange);text-align:center}.result-stats small{font-size:8px;color:#a0b58b;letter-spacing:1px}.reduced .capture-banner.show{animation:gentle 1.2s both}.reduced .square .piece-svg{transition:none}.dragging .piece-svg{opacity:.25}
@keyframes arrive{from{transform:translateY(-12px) scale(1.12)}to{transform:translateY(0) scale(1)}}@keyframes thinking{from{transform:translateX(0)}to{transform:translateX(280%)}}@keyframes banner{0%{opacity:0;transform:translate(-50%,-50%) scale(1.5) rotate(-6deg)}12%,70%{opacity:1;transform:translate(-50%,-50%) scale(1) rotate(-5deg)}90%,100%{opacity:0;transform:translate(-50%,-55%) scale(1.05) rotate(-5deg)}}@keyframes shake{0%,100%{transform:translate(0)}15%{transform:translate(-5px,3px)}30%{transform:translate(4px,-3px)}45%{transform:translate(-3px,2px)}60%{transform:translate(2px,-1px)}80%{transform:translate(-1px,0)}}@keyframes gentle{0%,100%{opacity:0}20%,80%{opacity:1}}
@media(min-width:1500px){.arena-layout{gap:42px;grid-template-columns:250px minmax(380px,660px) 250px}.rival-art{height:235px}.rival-svg{width:245px;left:calc(50% - 122.5px)}.move-log{height:280px}.turn-title h2{font-size:29px}}
@media(max-width:1150px){.arena-layout{gap:20px;grid-template-columns:195px minmax(340px,1fr) 195px}main{padding:0 2.5%}.topbar{padding:0 2.5%}.turn-title h2{font-size:23px}.turn-card{padding:17px 12px}.rival-info{padding:17px 14px}.rival-info h2{font-size:29px}.rival-art{height:185px}.rival-svg{width:205px;left:calc(50% - 102.5px)}.turn-title{margin-top:20px}.board-toolbar{gap:12px}.board-toolbar button{font-size:7px}.move-log{height:180px}.arena-note{display:none}.arena-id small{font-size:7px}.player-indicator{font-size:7px}.player-name>strong{font-size:10px}}
@media(max-width:950px){.arena-layout{grid-template-columns:180px minmax(320px,1fr);gap:24px}.right-rail{display:grid;grid-template-columns:1fr 1fr;gap:14px;grid-column:1/-1}.right-rail>.panel-label,.right-rail>.arena-note,.right-rail>.feed-header{display:none}.turn-card{grid-column:1;grid-row:1}.move-log{grid-column:2;grid-row:1/3;height:100%;max-height:280px;border:1px solid #37442b}.fx-card{grid-column:1;margin:0}.fx-card p{display:none}.fx-card button{margin-top:8px;padding-top:8px}.turn-title{margin-top:15px}.turn-card p{min-height:0;margin:9px 0 12px}.rival-art{height:170px}.rival-info h2{font-size:27px}.difficulty-picker{grid-template-columns:1fr}.difficulty-picker button{padding:8px}.difficulty-section>.mini-label>span{display:none}.tip-card{display:none}.header-right{gap:8px}.local-badge{display:none}.arena-heading{margin:25px 0}.arena-id{display:none}.right-rail .turn-title h2{font-size:26px}footer>span:nth-child(2){display:none}nav{gap:20px}main{max-width:840px}}
@media(max-width:650px){.topbar{height:65px;padding:0 17px}.brand{font-size:24px}.brand-mark{font-size:33px}.brand sup{margin-top:9px;font-size:7px}nav{display:none}.header-right{gap:8px}.icon-button{width:32px;height:32px}main{padding:0 15px}.arena-heading{margin:21px 0 20px}.arena-heading .eyebrow{font-size:7px;letter-spacing:1.7px}h1{font-size:30px;letter-spacing:-1px}.mobile-br{display:block}.arena-layout{display:flex;flex-direction:column;gap:20px}.board-column{order:1;width:100%}.left-rail{order:2;width:100%}.right-rail{order:3;width:100%;grid-template-columns:1fr 1fr}.panel-label{display:none}.rival-card{display:grid;grid-template-columns:80px 1fr;position:relative}.rival-art{height:100%;grid-row:1/3;border-right:1px solid var(--border);border-bottom:0}.rival-svg{width:140px;left:calc(50% - 70px);bottom:-1px}.art-code,.art-plus,.art-bottom,.target-ring{display:none}.rival-info{padding:14px 13px 10px}.rival-info .eyebrow{font-size:6px;letter-spacing:.7px}.rival-info h2{font-size:22px;margin:5px 0 0}.rival-info p{display:none}.difficulty-section{padding:0 12px 13px;border:0}.difficulty-section>.mini-label{display:none}.difficulty-picker{grid-template-columns:1fr 1.5fr 1.1fr;margin-top:3px}.difficulty-picker button{padding:8px 2px;font-size:7px}.difficulty-section p{font-size:8px;margin-top:7px}.new-game{margin-top:12px;padding:14px}.board-shell{padding:7px}.opponent{padding-bottom:12px}.player-name>strong{font-size:10px}.captured-pieces{font-size:7px}.player-indicator{font-size:7px}.board-toolbar{margin-top:18px;padding:13px 1px;gap:15px}.board-toolbar button{font-size:7px;gap:5px}.human{padding-top:14px}.turn-card{padding:14px 11px}.turn-title{gap:6px}.right-rail .turn-title h2{font-size:23px}.turn-title>span{font-size:24px}.turn-card>.mini-label>span{font-size:5px}.turn-card>.mini-label{font-size:6px}.fx-card{padding:10px}.fx-card .mini-label{font-size:7px}.fx-card button{font-size:6px}.empty-log{padding:20px 4px}.empty-log>small{font-size:5px;letter-spacing:.5px}.board .coord{font-size:7px}.human-tag{font-size:6px!important}footer{align-items:flex-start;margin-top:24px;padding-bottom:20px;gap:10px;font-size:5px}footer button{font-size:5px;max-width:130px;text-align:right;line-height:1.8}#fx-canvas{inset:-15px;width:calc(100% + 30px);height:calc(100% + 30px)}dialog{padding:27px 23px}dialog h2{font-size:29px}.capture-banner strong{font-size:42px}.capture-banner small{font-size:8px}.capture-banner>span{font-size:8px}.toast{font-size:11px;padding:13px 18px;bottom:17px}.rules-grid{gap:15px}.log-row{font-size:11px;padding:10px 5px;grid-template-columns:20px 1fr 1fr}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important;scroll-behavior:auto!important}.capture-banner.show{animation:gentle 1.2s both!important}.square:hover .piece-svg,.square.selected .piece-svg{transform:none}}
/* The effects canvas may leave the board, but must never widen the page. */
body{overflow-x:hidden;overflow-x:clip}
body{min-width:0}
.board-shell{overflow:hidden;overflow:clip}
.right-rail,.right-rail>*{min-width:0}
.turn-title h2{white-space:normal;overflow-wrap:break-word}
@media(max-width:380px){.right-rail{display:flex;flex-direction:column}.right-rail .move-log{height:180px;max-height:180px}.turn-card>.mini-label>span{font-size:6px}.right-rail .turn-title h2{font-size:25px}.fx-card{margin-top:0}.right-rail .fx-card p{display:block}.board-toolbar{gap:9px}.player-indicator{font-size:6px}.player-name>strong>.human-tag{display:none}}
.board-toolbar{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:5px}
.board-toolbar .toolbar-divider{display:none}
.board-toolbar button{justify-content:center;white-space:nowrap;font-size:8px;letter-spacing:.25px;min-width:0}
#maximize{color:var(--orange)}
.square.selection-pop .piece-svg{animation:selection-pop .38s cubic-bezier(.18,.75,.24,1)}
.square.selected{box-shadow:inset 0 0 0 2px #ffdd9f,inset 0 0 18px #ffac494d}
.tap-feedback{position:absolute;transform:translate(-50%,-50%);pointer-events:none;z-index:9}
.tap-ring{position:absolute;inset:0;border:2px solid #ffe0a6;border-radius:50%;box-shadow:0 0 12px #ffb85a66,inset 0 0 8px #ffd58133;animation:tap-ring .6s cubic-bezier(.17,.7,.25,1) forwards}
.tap-spark{position:absolute;left:50%;top:50%;width:3px;height:8px;background:#ffd28b;border-radius:3px;box-shadow:0 0 7px #ffb558;transform-origin:50% 0;animation:tap-spark .55s ease-out forwards}
.tap-feedback.gentle .tap-ring{animation:tap-gentle .5s ease-out forwards;box-shadow:none}
.volume-label{display:flex;justify-content:space-between}.volume-label output{color:var(--orange)}
#volume-choice{accent-color:var(--orange);width:100%;cursor:pointer;margin:5px 0 0;height:20px}
dialog .sound-note{font-size:10px;margin:8px 0 0}
body.focus-mode{overflow:hidden}
.board-column.board-focus{position:fixed;inset:0;z-index:100;display:flex;flex-direction:column;align-items:center;justify-content:center;width:100vw;height:100vh;height:100dvh;max-width:none;margin:0;padding:12px;background:radial-gradient(ellipse at center,#29321f 0%,#12170e 75%);overflow:auto}
.board-focus .board-shell{flex:0 0 auto;width:min(100%,calc(100dvh - 178px));max-width:calc(100dvh - 178px)}
.board-focus .player-bar,.board-focus .board-toolbar{width:min(100%,calc(100dvh - 178px));flex-shrink:0}
.board-focus .player-bar{min-height:43px}.board-focus .opponent{padding-bottom:8px}.board-focus .human{padding-top:8px}
.board-focus .board-toolbar{margin-top:12px;padding:10px 3px;min-height:38px}
.board-focus #maximize{background:#e77e3630;padding:8px 4px}
.board-focus::backdrop{background:#12170e}
@keyframes selection-pop{0%{transform:translateY(0) scale(1)}45%{transform:translateY(-5px) scale(1.08)}100%{transform:translateY(-4px) scale(1)}}
@keyframes tap-ring{0%{opacity:.75;transform:scale(.35)}100%{opacity:0;transform:scale(1.3)}}
@keyframes tap-spark{0%{opacity:0;transform:rotate(var(--ray)) translateY(-12px) scale(.6)}18%{opacity:.7}100%{opacity:0;transform:rotate(var(--ray)) translateY(-44px) scale(.2)}}
@keyframes tap-gentle{0%{opacity:0;transform:scale(.82)}35%{opacity:.4}100%{opacity:0;transform:scale(.92)}}
@media(max-width:650px){.board-toolbar{gap:3px}.board-toolbar button{flex-direction:column;gap:7px;font-size:7px;letter-spacing:0}.board-toolbar button span{font-size:18px}.board-focus .board-toolbar{min-height:47px}.board-focus .board-shell,.board-focus .player-bar,.board-focus .board-toolbar{width:min(100%,calc(100dvh - 180px));max-width:calc(100dvh - 180px)}}
@media(max-height:500px){.board-focus{padding:6px!important}.board-focus .board-shell,.board-focus .player-bar,.board-focus .board-toolbar{width:min(100%,calc(100dvh - 106px));max-width:calc(100dvh - 106px)}.board-focus .player-bar{min-height:27px;height:27px;gap:7px;padding-block:3px}.board-focus .player-avatar{width:21px;height:21px;font-size:18px}.board-focus .human-mini svg{height:18px;width:18px}.board-focus .captured-pieces{display:none}.board-focus .board-toolbar{margin-top:5px;min-height:32px;padding:4px 0}.board-focus .board-toolbar button{flex-direction:row;gap:4px;font-size:6px}.board-focus .board-toolbar button span{font-size:14px}.board-focus .player-name strong>span{display:none}}
@media(prefers-reduced-motion:reduce){.square.selection-pop .piece-svg{animation:none!important}.tap-spark{display:none}.tap-ring{animation:tap-gentle .5s ease-out forwards!important}}
.banter-line{display:flex;align-items:center;gap:9px;min-height:42px;padding:8px 11px;margin:0 0 12px;border-left:2px solid #bd702f;background:linear-gradient(90deg,#4d39222e,#21271b33);color:#c4c8ad}
.banter-mark{font-size:23px;color:var(--orange);flex-shrink:0}.banter-line p{margin:0;flex:1;font-size:10px;line-height:1.45;font-style:italic}.banter-line button{align-self:stretch;background:transparent;border-left:1px solid #485039;color:#8d9c78;font-size:7px;letter-spacing:.5px;padding:0 0 0 11px;flex-shrink:0;min-width:40px}.banter-line button:hover{color:var(--orange)}
.banter-muted{border-color:#3f4a32}.banter-muted .banter-mark{color:#667750}.banter-muted p{color:#728365;font-size:9px}
.banter-arrival p{animation:banter-in .3s ease-out}
.board-focus .banter-line{width:min(100%,calc(100dvh - 235px));flex-shrink:0;min-height:35px;margin-bottom:9px;padding-block:6px}
.board-focus .board-shell,.board-focus .player-bar,.board-focus .board-toolbar{width:min(100%,calc(100dvh - 235px));max-width:calc(100dvh - 235px)}
@keyframes banter-in{from{opacity:.35;transform:translateY(3px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:650px){.banter-line{gap:7px;padding:7px 9px;margin-bottom:10px}.banter-line p{font-size:9px}.banter-line button{font-size:6px;padding-left:8px;min-width:36px}.banter-mark{font-size:20px}}
@media(max-height:500px){.board-focus .board-shell,.board-focus .player-bar,.board-focus .board-toolbar,.board-focus .banter-line{width:min(100%,calc(100dvh - 137px));max-width:calc(100dvh - 137px)}.board-focus .banter-line{min-height:24px;height:24px;padding:3px 6px;margin-bottom:4px;gap:4px}.board-focus .banter-line p{font-size:7px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.board-focus .banter-line button{font-size:5px;min-width:28px}.board-focus .banter-mark{font-size:16px}}
