:root{font-family:Manrope,Inter,"Segoe UI",sans-serif;color:#f4f1e9;background:#101a2b;font-synthesis:none;text-rendering:optimizeLegibility;--paper:#f2eddf;--ink:#172131;--muted:#aab4c3;--gold:#efad43;--line:rgba(238,241,246,.13);--wood:#d6c7aa;--square:#5c6d65}
*{box-sizing:border-box}body{margin:0;min-width:320px;background:radial-gradient(ellipse at 50% -10%,#263a4b 0,transparent 48%),#101a2b}button{font:inherit}.game-page{width:min(1160px,calc(100% - 48px));margin:0 auto}.topbar{height:76px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:#fff;font-size:19px;font-weight:800;letter-spacing:-.04em}.brand-mark{width:29px;height:29px;display:grid;place-items:center;border-radius:9px;background:var(--gold);color:#172131;font-size:16px}.topbar-note{color:#aeb9c6;font-size:12px}.intro{display:flex;align-items:flex-end;justify-content:space-between;gap:30px;padding:38px 0 25px}.eyebrow{margin:0 0 10px;color:#e6ad5b;font-size:10px;font-weight:800;letter-spacing:.14em}.intro h1{margin:0;color:#fff;font-size:clamp(32px,4.6vw,52px);line-height:1.03;letter-spacing:-.045em}.mobile-break{display:none}.intro-copy{max-width:57ch;margin:12px 0 0;color:#bac4d0;font-size:14px;line-height:1.65}.mode-picker{display:flex;padding:4px;border:1px solid var(--line);border-radius:12px;background:#0d1624;flex:none}.mode-button{min-height:38px;border:0;border-radius:8px;padding:0 13px;background:transparent;color:#adb8c7;cursor:pointer;font-size:12px;font-weight:700}.mode-button:hover{color:#fff}.mode-button.is-active{background:#e9aa43;color:#172131}.play-layout{display:grid;grid-template-columns:minmax(0,700px) minmax(220px,1fr);align-items:center;gap:27px;padding:20px;border:1px solid rgba(241,241,239,.15);border-radius:18px;background:rgba(16,26,42,.83);box-shadow:0 18px 50px rgba(0,0,0,.21)}.board-wrap{min-width:0}.board-topline,.board-bottomline{display:flex;align-items:center;justify-content:space-between;gap:12px;color:#b0bdc8}.board-topline{padding:0 4px 12px;font-size:11px}.turn-indicator{color:#f1c274;font-size:12px;font-weight:800}.board-bottomline{padding:12px 4px 0;font-size:11px}.board{width:100%;aspect-ratio:1;display:grid;grid-template-columns:repeat(8,minmax(0,1fr));overflow:hidden;border:5px solid #cbb994;border-radius:10px;background:#d8c9ad;box-shadow:0 10px 26px rgba(0,0,0,.26);touch-action:manipulation}.cell{position:relative;display:grid;place-items:center;min-width:0;min-height:0;border:0;padding:0;background:#d8c9ad;cursor:default}.cell.dark-square{background:#5b6c64;cursor:pointer}.cell.dark-square:hover{filter:brightness(1.09)}.cell.selected{z-index:1;box-shadow:inset 0 0 0 4px #e9bd6d}.cell.legal-target::after{content:"";position:absolute;width:22%;height:22%;border-radius:50%;background:#f0c275d6;box-shadow:0 1px 6px #16202066}.cell.capture-target::after{width:62%;height:62%;background:transparent;border:3px solid #f0c275}.cell.stack-target{box-shadow:inset 0 0 0 4px #77d3b2}.cell .coord{position:absolute;left:4px;top:2px;color:#d9dfd9a3;font-size:8px;font-weight:700;pointer-events:none}.piece{position:relative;width:72%;height:72%;display:grid;place-items:center;border-radius:50%;transition:transform 130ms ease,filter 130ms ease;box-shadow:inset 0 -5px 0 rgba(0,0,0,.22),inset 0 2px 1px rgba(255,255,255,.31),0 3px 6px rgba(0,0,0,.34);pointer-events:none}.piece.light{background:radial-gradient(circle at 36% 27%,#fff4d8,#e8d6b0 68%,#cdb78c);border:1px solid #d5c39f}.piece.dark{background:radial-gradient(circle at 36% 25%,#596474,#1b2432 69%,#111924);border:1px solid #788291}.piece.king:after{content:"";width:33%;height:33%;border:2px solid #e9ad48;transform:rotate(45deg);border-radius:3px;box-shadow:0 0 0 2px #1a2732}.piece.tower{width:76%;height:76%;border:3px solid #e9ad48}.piece.tower:before{content:"";position:absolute;inset:12%;border:1px solid currentColor;border-radius:50%;opacity:.7}.piece.tower:after{content:"Ⅱ";position:relative;color:#f5c975;font-size:clamp(13px,2.4vw,25px);font-weight:800;line-height:1}.piece-dot{display:inline-block;width:13px;height:13px;border-radius:50%;vertical-align:-2px;margin-right:6px;box-shadow:inset 0 -2px 0 #0003}.piece-dot.light{background:#ead9b7}.piece-dot.dark{background:#263141;border:1px solid #7e8793}.score{font-variant-numeric:tabular-nums;color:#f1e5cd;font-weight:800}.game-rail{align-self:stretch;display:flex;flex-direction:column;justify-content:center;padding:12px 7px}.rail-heading{display:flex;align-items:center;gap:9px;color:#f4f0e8;font-size:14px;font-weight:800}.live-dot{width:9px;height:9px;border-radius:50%;background:#69ca9f;box-shadow:0 0 0 4px #69ca9f22}.rail-copy{min-height:48px;margin:10px 0 19px;color:#acb8c7;font-size:12px;line-height:1.6}.primary-button{min-height:46px;display:flex;align-items:center;justify-content:space-between;gap:16px;border:0;border-radius:10px;padding:0 15px;background:#e9aa43;color:#182333;font-size:13px;font-weight:800;cursor:pointer}.primary-button:hover{background:#f2bd61}.primary-button span{font-size:20px}.rail-divider{height:1px;margin:23px 0 14px;background:var(--line)}.captured-row{display:flex;justify-content:space-between;gap:12px;padding:8px 0;color:#abb6c4;font-size:11px}.captured-row strong{color:#f2e8d4;font-size:12px}.hint{margin:17px 0 0;color:#8593a4;font-size:10px;line-height:1.6}.rules{padding:46px 0 33px}.rules-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin-bottom:19px}.rules-heading .eyebrow{margin-bottom:7px}.rules-heading h2{margin:0;color:#fff;font-size:27px;letter-spacing:-.035em}.rules-tag{padding:7px 10px;border:1px solid rgba(232,177,94,.35);border-radius:99px;color:#e7bd7b;font-size:10px;font-weight:700}.rules-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:44px;border-top:1px solid var(--line)}.rule-item{display:grid;grid-template-columns:30px 1fr;gap:12px;padding:17px 0;border-bottom:1px solid var(--line)}.rule-number{padding-top:2px;color:#eab457;font-size:11px;font-weight:800;font-variant-numeric:tabular-nums}.rule-item h3{margin:0 0 5px;color:#f6f2e9;font-size:13px}.rule-item p{margin:0;color:#abb6c3;font-size:11px;line-height:1.7}.tower-rule h3{color:#f0c274}.rules-footnote{max-width:75ch;margin:15px 0 0;color:#8996a6;font-size:10px;line-height:1.6}.page-footer{display:flex;justify-content:space-between;gap:16px;padding:16px 0 24px;border-top:1px solid var(--line);color:#8290a1;font-size:10px}.page-footer a{color:#d9b16f;text-decoration:none}.game-over .live-dot{background:#e9aa43;box-shadow:0 0 0 4px #e9aa4322}
@media(max-width:800px){.game-page{width:min(700px,calc(100% - 32px))}.intro{align-items:flex-start;flex-direction:column;padding-top:31px;gap:19px}.play-layout{grid-template-columns:1fr;padding:14px;gap:10px}.game-rail{display:grid;grid-template-columns:1fr auto;column-gap:18px;align-items:center;padding:8px 4px 2px}.rail-heading{grid-column:1}.rail-copy{grid-column:1;margin:7px 0 9px;min-height:0}.primary-button{grid-column:2;grid-row:1/3;min-width:164px}.rail-divider{grid-column:1/-1;margin:8px 0 7px}.captured-row{padding:4px 0}.hint{grid-column:1/-1;margin:9px 0 2px}.rules{padding-top:35px}}
@media(max-width:540px){.game-page{width:calc(100% - 22px)}.topbar{height:61px}.topbar-note{max-width:150px;text-align:right;font-size:10px}.intro{padding:27px 2px 20px}.intro h1{font-size:37px}.mobile-break{display:block}.intro-copy{font-size:12px;line-height:1.55}.mode-picker{width:100%}.mode-button{flex:1;padding:0 7px;font-size:10px}.play-layout{padding:9px;border-radius:13px}.board{border-width:3px;border-radius:7px}.board-topline{padding:0 2px 9px;font-size:9px}.turn-indicator{font-size:10px}.board-bottomline{font-size:9px;padding:9px 2px 0}.cell .coord{font-size:6px;left:2px;top:1px}.cell.selected{box-shadow:inset 0 0 0 2px #e9bd6d}.cell.stack-target{box-shadow:inset 0 0 0 2px #77d3b2}.cell.capture-target:after{border-width:2px}.game-rail{column-gap:9px}.rail-heading{font-size:12px}.rail-copy{font-size:10px}.primary-button{min-width:123px;min-height:41px;padding:0 10px;font-size:10px}.captured-row{font-size:9px}.hint{font-size:9px}.rules{padding:32px 2px 24px}.rules-heading{align-items:flex-start;flex-direction:column;gap:10px}.rules-heading h2{font-size:23px}.rules-grid{grid-template-columns:1fr;column-gap:0}.rule-item{padding:13px 0}.rule-item p{font-size:10px}.page-footer{font-size:9px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition:none!important}}
/* Keep the complete board in view on short desktop windows and compact phones. */
.board-wrap{width:min(100%,min(45vh,700px));margin-inline:auto}
@media(max-width:800px){.board-wrap{width:min(100%,min(30vh,700px))}}
@media(max-width:540px){.intro{padding-top:17px;padding-bottom:12px}}
.cell.last-action{outline:2px solid #f2ca79;outline-offset:-3px}
.cell.captured-action{background-color:#83544b!important}
.cell.captured-action::before{content:"×";position:absolute;z-index:2;color:#ffe0d6;font-size:clamp(18px,3vw,30px);font-weight:800;line-height:1;text-shadow:0 1px 4px #311b1b;pointer-events:none}
.cell.capture-step{box-shadow:inset 0 0 0 3px #f0c275a6}
.piece.king::after{content:"";width:36%;height:36%;border:2px solid #f2bd52;border-radius:50%;transform:none;background:transparent;box-shadow:0 0 0 1px #172131}
.piece.tower{color:#e9ad48}
.piece.tower::after{content:"";width:36%;height:36%;border:2px solid #f2bd52;border-radius:50%;transform:none;background:transparent;box-shadow:0 0 0 1px #172131}
.board{grid-template-rows:repeat(8,minmax(0,1fr))}
.piece{aspect-ratio:1;height:72%}
#split-toggle{min-height:25px;border:1px solid #dcae5e;border-radius:7px;padding:0 8px;background:#f0bd65;color:#172131;font-size:9px;font-weight:800;white-space:nowrap;cursor:pointer}
#split-toggle[aria-pressed="true"]{background:#f6d998}
#split-toggle:focus-visible{outline:2px solid #fff;outline-offset:2px}
.play-layout{overflow-anchor:none}
.board-topline{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);min-height:37px}
#turn-indicator{min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#turn-indicator{grid-column:1}
#split-toggle{grid-column:2}
#move-note{grid-column:3;width:100%;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-align:right}
.rail-copy{height:58px;min-height:58px;overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3}
.hint{height:32px;min-height:32px;overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2}
@media(max-width:540px){.board-wrap{width:min(100%,min(33.5vh,700px))}.board-topline{min-height:34px}.turn-indicator{max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.board-topline #move-note{flex:1}.rail-copy{height:48px;min-height:48px;font-size:10px;line-height:16px}.hint{line-height:14px}}
.topbar{height:64px}
.intro{padding-top:26px;padding-bottom:18px}
.game-tagline{margin:6px 0 0;color:#e6ad5b;font-size:clamp(16px,1.7vw,20px);font-weight:800;letter-spacing:-.02em}
.intro-copy{margin-top:7px}
@media(max-width:800px){.intro{padding-top:23px;padding-bottom:16px;gap:15px}}
@media(max-width:540px){.topbar{height:54px}.intro{padding-top:12px;padding-bottom:9px}.game-tagline{margin-top:5px;font-size:16px}.intro-copy{margin-top:5px}}
.result-overlay{position:fixed;inset:0;z-index:1000;display:grid;place-items:center;overflow:hidden;padding:18px;background:rgba(5,12,22,.82);backdrop-filter:blur(7px)}
.result-overlay[hidden]{display:none}
body.result-open{overflow:hidden}
.confetti-field{position:absolute;inset:0;overflow:hidden;pointer-events:none}
.confetti-piece{position:absolute;top:47%;left:50%;width:9px;height:14px;border-radius:2px;opacity:0;animation:confetti-burst 1150ms cubic-bezier(.14,.72,.22,1) var(--delay,0ms) both}
.confetti-piece:nth-child(3n){width:7px;height:7px;border-radius:50%}
.confetti-piece:nth-child(3n + 1){width:6px;height:17px;border-radius:1px}
@keyframes confetti-burst{0%{opacity:0;transform:translate(0,0) rotate(0) scale(.2)}12%{opacity:1}100%{opacity:0;transform:translate(var(--dx),var(--dy)) rotate(var(--rotation)) scale(.9)}}
.result-card{position:relative;z-index:1;width:min(100%,440px);max-height:calc(100vh - 36px);overflow:auto;padding:30px 30px 24px;border:1px solid #6c7785;border-radius:20px;background:radial-gradient(ellipse at 50% 0,#29394b 0,transparent 55%),#142033;box-shadow:0 24px 80px #0009,0 5px 18px #0005;text-align:center;animation:result-arrive 360ms cubic-bezier(.16,1,.3,1) both}
@keyframes result-arrive{from{opacity:0;transform:translateY(12px) scale(.96)}to{opacity:1;transform:translateY(0) scale(1)}}
.result-close{position:absolute;top:12px;right:13px;width:34px;height:34px;border:1px solid #ffffff24;border-radius:50%;background:#ffffff0a;color:#c8d1dc;font-size:23px;line-height:1;cursor:pointer}
.result-close:hover{background:#ffffff18;color:#fff}
.result-close:focus-visible,.result-actions button:focus-visible,.result-chat:focus-visible{outline:2px solid #f2bd52;outline-offset:3px}
.result-emblem{width:60px;height:60px;display:grid;place-items:center;margin:0 auto 14px;border:2px solid #e9ad48;border-radius:50%;background:#101b2b;color:#f2bd52;font-size:30px;box-shadow:0 5px 18px #0005,inset 0 0 0 5px #e9ad4822}
.result-kicker{margin:0 0 7px;color:#e6ad5b;font-size:10px;font-weight:800;letter-spacing:.16em}
.result-card h2{margin:0;color:#fff4df;font-size:clamp(27px,6vw,36px);line-height:1.12;letter-spacing:-.035em}
.result-description{max-width:34ch;margin:12px auto 0;color:#c3ceda;font-size:14px;line-height:1.55}
.result-score{display:inline-flex;align-items:center;gap:12px;margin:18px auto 20px;padding:9px 15px;border:1px solid #ffffff20;border-radius:11px;background:#0c1625;color:#aeb9c7;font-size:12px}
.result-score strong{color:#f7e8ca;font-size:19px;font-variant-numeric:tabular-nums}
.result-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.result-actions button,.result-chat{min-height:44px;border-radius:10px;padding:0 13px;font:inherit;font-size:12px;font-weight:700;line-height:1.2;cursor:pointer}
.result-primary{border:0;background:#e9aa43;color:#172131}
.result-primary:hover{background:#f2bd61}
.result-secondary{border:1px solid #778495;background:#1b2a3d;color:#f4eee2}
.result-secondary:hover{background:#26384e}
.result-feedback{max-width:40ch;margin:20px auto 10px;color:#abb8c7;font-size:12px;line-height:1.5}
.result-chat{min-height:38px;border:1px solid #5e9d88;background:#173c38;color:#a9ead0}
.result-chat:hover{background:#205147;color:#d4ffed}
.share-status{min-height:15px;margin:7px 0 0;color:#9de0bf;font-size:10px}
@media(max-width:540px){.result-overlay{padding:12px}.result-card{max-height:calc(100vh - 24px);padding:26px 19px 18px;border-radius:16px}.result-emblem{width:52px;height:52px;margin-bottom:11px}.result-description{font-size:13px}.result-score{margin:14px auto 16px}.result-actions{grid-template-columns:1fr;gap:8px}.result-actions button{min-height:42px}.result-feedback{margin-top:15px}}
@media(prefers-reduced-motion:reduce){.result-card,.confetti-piece{animation:none!important}.result-overlay{backdrop-filter:none}}

.rail-actions{display:grid;gap:8px}.rail-actions .primary-button{justify-content:center}.control-button{min-height:42px;padding:8px 12px;border:1px solid #78889a;border-radius:10px;background:#1b2a3d;color:#f4eee2;font-size:12px;font-weight:700;cursor:pointer}.control-button:hover{background:#26384e}.control-button:disabled{opacity:.45;cursor:default}.primary-button:focus-visible,.control-button:focus-visible,.mode-button:focus-visible{outline:2px solid #f2bd52;outline-offset:3px}.screen-state{margin:10px 0 0;font-size:11px;color:#afc7b9;line-height:1.4}.game-confirm{width:min(440px,calc(100% - 32px));padding:24px;border:1px solid #78889a;border-radius:14px;background:#142033;color:#f4eee2}.game-confirm::backdrop{background:#050c16cc}.game-confirm h2{margin:0;font-size:22px}.game-confirm p{margin:14px 0 20px;font-size:14px;line-height:1.6}.confirm-actions{display:flex;gap:10px;flex-wrap:wrap}.confirm-actions button{flex:1;min-width:140px;justify-content:center}
body.game-fullscreen{overflow:hidden;background:#101a2b}.game-fullscreen .game-page{width:100%;height:100dvh;padding:12px;display:grid;place-items:center}.game-fullscreen .topbar,.game-fullscreen .intro,.game-fullscreen .rules,.game-fullscreen .page-footer{display:none}.game-fullscreen .play-layout{width:min(100%,1200px);grid-template-columns:minmax(0,1fr) 220px;gap:20px;padding:16px}.game-fullscreen .board-wrap{width:min(100%,calc(100dvh - 130px))}
@media(max-width:800px){.rail-actions{grid-column:1/-1;grid-row:auto;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}.rail-actions .primary-button{grid-column:auto;grid-row:auto;min-width:0;min-height:44px;padding:8px;font-size:11px}.rail-actions .control-button{min-width:0;min-height:44px;padding:8px;font-size:11px}.screen-state{grid-column:1/-1;margin-top:8px}.game-rail .rail-heading,.game-rail .rail-copy{grid-column:1/-1}.game-fullscreen .play-layout{grid-template-columns:1fr;gap:8px;padding:10px}.game-fullscreen .game-rail{padding:0 2px}.game-fullscreen .rail-copy{display:none}.game-fullscreen .hint{margin-top:3px}.game-fullscreen .board-topline{min-height:34px}.game-fullscreen .board-bottomline{padding-top:8px}.game-fullscreen .board-wrap{width:min(100%,calc(100dvh - 265px))}}
@media(max-height:540px) and (min-width:541px){.game-fullscreen .play-layout{grid-template-columns:minmax(0,1fr) 200px;padding:10px;gap:16px}.game-fullscreen .board-wrap{width:min(100%,calc(100dvh - 120px))}.game-fullscreen .game-rail{display:flex;padding:0}.game-fullscreen .rail-actions{display:grid;grid-template-columns:1fr;gap:6px}.game-fullscreen .rail-copy,.game-fullscreen .hint{display:none}.game-fullscreen .rail-divider{margin:10px 0 4px}.game-fullscreen .rail-heading{font-size:12px}.game-fullscreen .screen-state{font-size:10px}}
