@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@400;500;600;700;800&display=swap');
:root{font-family:'DM Sans',sans-serif;color:#142d32;background:#eef2f2;font-synthesis:none;font-size:16px}*{box-sizing:border-box}body{margin:0}button,select,input{font:inherit}button,select{border:1px solid #ccd7d8;border-radius:7px;min-height:44px;background:white;color:inherit}button{padding:10px 16px;cursor:pointer;font-weight:600;transition:background .15s,transform .15s}button:hover{background:#e6eeee}button:disabled{opacity:.5;cursor:default}button:focus-visible,select:focus-visible,input:focus-visible{outline:3px solid #dd724d;outline-offset:3px}header{max-width:1400px;margin:auto;min-height:100px;padding:22px 48px;display:flex;align-items:center;gap:28px;border-bottom:1px solid #d4dddd}.brand{font:800 22px Manrope,sans-serif;letter-spacing:3px;text-decoration:none;color:inherit;display:flex;align-items:center;gap:12px}.brandmark{background:#16363b;color:#daff91;font-size:34px;line-height:40px;letter-spacing:0;padding:0 6px;border-radius:7px}.header-note{font-size:14px;color:#6b7d80}header button{margin-left:auto}.quiet{border-color:transparent;background:transparent}main{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:58px;max-width:1320px;margin:auto;padding:42px 48px}.eyebrow{font-size:12px;letter-spacing:2px;font-weight:700;color:#648084}.gameheading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:10px 0 26px}h1{font:700 clamp(24px,2.4vw,34px)/1.25 Manrope,sans-serif;letter-spacing:-1.2px;margin:0}.badge{font-size:12px;border:1px solid #bfcccc;border-radius:20px;padding:7px 10px;white-space:nowrap}.players{display:flex;gap:12px;margin-bottom:24px}.player{flex:1;border:1px solid #d2dcdc;display:flex;align-items:center;gap:12px;padding:14px 18px;border-radius:9px;background:#f7f9f9}.player.active{background:#fff;border-color:#20484d;box-shadow:0 3px 0 #20484d}.player strong,.player span{display:block}.player span{font-size:13px;color:#687d80;margin-top:3px}.player small{margin-left:auto;color:#829294;font-size:12px}.stone{display:inline-block;border-radius:50%;width:28px;height:28px;flex-shrink:0}.white{background:radial-gradient(circle at 35% 25%,#fff,#f4f4eb 65%,#bbc6bf);border:1px solid #b9c5be;box-shadow:0 2px 3px #0002}.black{background:radial-gradient(circle at 35% 25%,#4b5b5d,#18272b 70%);border:1px solid #102227;box-shadow:0 2px 3px #0004}.boardwrap{background:#183b40;border-radius:14px;padding:14px 22px 24px;box-shadow:0 9px 0 #102d32,0 16px 26px #12363b18;max-width:660px;margin:0 auto}.columns{display:grid;grid-template-columns:repeat(var(--x),1fr);text-align:center;color:#a8c1c4;font-size:12px;margin-bottom:10px}.board{display:grid;grid-template-columns:repeat(var(--x),1fr);gap:clamp(3px,.8vw,8px)}.cell{aspect-ratio:1;min-height:0;padding:0;border-radius:5px;border:1px solid #507076;background:#2b5055;display:flex;align-items:center;justify-content:center;position:relative;touch-action:manipulation}.cell:hover:not(:disabled){background:#497177}.cell:disabled{opacity:1;cursor:default}.cell .stone{width:76%;height:76%}.cell.winning{background:#9abc64;border-color:#d9ff99}.cell.last .stone:after{content:'';display:block;width:12%;height:12%;border-radius:50%;background:#c47950;margin:44% auto}.cell .fall{animation:drop .32s ease-in}@keyframes drop{from{transform:translateY(var(--fall));opacity:.4}to{transform:translateY(0);opacity:1}}.statusline{display:flex;justify-content:space-between;gap:12px;margin-top:30px;align-items:start}#status{font-weight:700;font-size:18px}.statusline p{color:#60777a;font-size:14px;margin:5px 0}#moveCount{font-size:13px;color:#627b7f;white-space:nowrap;padding-top:4px}.gameactions{display:flex;gap:10px;margin-top:16px}.panel{background:#fff;padding:24px;border:1px solid #dbe3e3;border-radius:12px;margin-bottom:20px}.sectionheading{display:flex;align-items:center;justify-content:space-between;gap:8px}h2{font:800 18px Manrope,sans-serif;margin:0}.sectionheading>span{font-size:10px;letter-spacing:1px;color:#6e8588}.presets{display:flex;gap:6px;margin:20px 0}.presets button{font-size:12px;padding:7px 8px;flex:1}.presets button.selected{background:#e7efd9;border-color:#9cad83}.dimensions{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.dimensions label{font-weight:600;font-size:14px}.dimensions label span{display:block;font-size:10px;letter-spacing:1px;color:#7c8b8c;font-weight:400;margin:4px 0 8px}select{width:100%;padding:8px 10px;background:#f6f8f8;font-size:14px}.gravity{display:flex;align-items:center;justify-content:space-between;margin:22px 0}.gravity strong{font-size:14px}.gravity small{display:block;color:#6a8083;font-size:12px;margin-top:4px}.gravity input{width:36px;height:22px;accent-color:#244e51}.divider{border-top:1px solid #e4eaea;margin-bottom:20px}.side-label{font-size:14px;display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:15px}.side-label .stone{width:18px;height:18px}.side-label select{flex-basis:100%}.full{width:100%;display:flex;align-items:center;justify-content:space-between}.primary{background:#21484d;color:#fff;border-color:#21484d}.primary:hover{background:#316268}.secondary{background:#e5f3ca;border-color:#c8d9ab}.secondary:hover{background:#d6eaae}.caption{font-size:12px;color:#617a7e;line-height:1.55;margin-bottom:0}.training>p{font-size:14px;line-height:1.55;color:#62797c}.memory-stat{display:flex;gap:14px;align-items:center;margin:22px 0}.memory-stat strong{font:700 40px Manrope,sans-serif;letter-spacing:-2px}.memory-stat span{font-size:14px;line-height:1.5}.memory-stat small{font-size:12px;color:#688185}.train-label{font-size:14px;display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px}.train-label select{width:150px}.clear-row{display:flex;flex-wrap:wrap;gap:0;margin-top:12px}.textbutton{padding:5px 0;min-height:36px;border:0;background:none;font-size:12px;color:#617b7e;text-decoration:underline;margin-right:14px}progress{width:100%;margin-top:15px;accent-color:#254f53}.result{display:flex;flex-wrap:wrap;gap:12px;align-items:center;background:#e5f3ca;padding:16px;margin-top:20px;border-radius:8px}.result strong{font-size:20px}footer{max-width:1224px;margin:10px auto 30px;border-top:1px solid #d4dddd;padding:22px 0;display:flex;justify-content:space-between;gap:16px;color:#6c8184;font-size:11px;letter-spacing:1.1px}dialog{border:1px solid #cbd7d7;border-radius:14px;max-width:480px;width:calc(100% - 32px);padding:28px;color:#183b40}dialog::backdrop{background:#0d252a99}dialog p{line-height:1.65;white-space:pre-line}.dialogactions{display:flex;justify-content:flex-end;gap:10px}[hidden]{display:none!important}@media(max-width:1000px){main{gap:26px;padding:30px 24px;grid-template-columns:minmax(0,1fr) 310px}.panel{padding:18px}.gameheading{display:block}.badge{display:inline-block;margin-top:10px}header{padding:22px 24px}footer{margin:10px 24px 20px}.boardwrap{padding:12px 12px 18px}}@media(max-width:740px){header{min-height:78px;padding:16px 20px}.header-note{display:none}.brand{font-size:18px}main{display:block;padding:26px 18px}.gameheading{display:flex;flex-wrap:wrap}.gameheading .badge{margin:0}.game{margin-bottom:34px}.players{gap:10px}.player{padding:12px}.player small{display:none}aside{display:grid;grid-template-columns:1fr 1fr;gap:16px}.panel{margin:0}.boardwrap{max-width:540px}footer{font-size:10px}}@media(max-width:570px){aside{display:block}.panel{margin-bottom:18px}h1{font-size:26px}.gameheading{gap:10px}.brand{letter-spacing:2px}.boardwrap{padding:12px 9px 15px}footer{display:block}footer span{display:block;margin:8px 0}.cell{border-radius:3px}}@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

.scoreboard{display:flex;align-items:center;gap:20px;margin:0 0 24px;border-top:1px solid #cbd8d9;border-bottom:1px solid #cbd8d9;padding:14px 0;flex-wrap:wrap}.scoreboard>div{margin-right:auto}.scoreboard small{display:block;font-size:12px;color:#627b7f;margin-top:5px}.scoreboard>span{font-size:14px;white-space:nowrap}.scoreboard strong{font:800 26px Manrope,sans-serif;margin-left:8px}.scoreboard button{margin:0}.result p{flex-basis:100%;margin:0;font-size:14px;line-height:1.5}.result strong{flex-basis:100%}header #sound{margin-left:auto}header #help{margin-left:0}@media(max-width:570px){header{gap:8px;flex-wrap:wrap}header .brand{margin-right:auto}header button{font-size:12px;padding:8px}.scoreboard{gap:16px}.scoreboard>div{flex-basis:100%}}

.support-entry{max-width:1224px;margin:0 auto;padding:0 24px}#supportDialog{max-width:560px;max-height:90vh;overflow:auto}#supportClose{float:right}#supportDialog h2{padding-top:12px}#supportDialog select{margin:10px 0 14px}#supportStatus{font-size:14px}#checkout-form{min-height:0}

.dimensions{align-items:end}.dimensions select{display:block;margin-top:8px}.bot-description{flex-basis:100%;font-size:14px;line-height:1.4;color:#617a7e}.player span{font-size:14px}

#configBadge{font-size:clamp(18px,2vw,24px);font-weight:700;line-height:1.5;white-space:normal;border:0;border-radius:0;padding:0}#trainingStatus:empty{display:none}

.scoreboard{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:12px}.scoreboard>span:first-child{text-align:left}.scoreboard>span:nth-child(3){text-align:right}.scoreboard>span,.scoreboard strong{font:800 26px/1.35 Manrope,sans-serif;white-space:normal;overflow-wrap:anywhere}.scoreboard strong{margin-left:8px}.speed-label{display:flex;justify-content:space-between;align-items:center;margin:18px 0 4px;font-size:14px;font-weight:600}#trainingSpeed{width:100%;accent-color:#21484d;cursor:pointer;min-height:32px}.speed-limits{display:flex;justify-content:space-between;font-size:14px;color:#617a7e;margin:0 0 16px}

.scoreboard>span:first-child,.scoreboard>span:nth-child(3){display:flex;align-items:center;gap:24px;min-width:0;flex-wrap:wrap}.scoreboard>span:nth-child(3){justify-content:flex-end}.scoreboard strong{display:inline-flex;align-items:center;justify-content:center;min-width:52px;padding:5px 12px;margin:0;border:2px solid #9eb5b8;border-radius:8px;background:#fff;font-variant-numeric:tabular-nums;flex-shrink:0}

.boardwrap{width:100%;max-width:none}.players{margin-bottom:18px}.player{min-width:0;display:flex;flex-direction:column;align-items:flex-start;gap:8px;padding:14px 18px}.player-colour{display:flex;align-items:center;gap:10px;min-width:0}.player-colour strong{font-size:16px}.player #whiteLabel,.player #blackLabel{font:800 26px/1.25 Manrope,sans-serif;color:#142d32;margin:0;overflow-wrap:anywhere}.player-score{display:flex;align-items:center;gap:24px}.player .player-score span{font-size:16px;margin:0}.player-score strong{font:800 26px/1.35 Manrope,sans-serif;min-width:52px;text-align:center;padding:3px 12px;border:2px solid #9eb5b8;border-radius:8px;background:#fff;font-variant-numeric:tabular-nums}#blackCard{align-items:flex-end;text-align:right}#setup{margin-top:18px}.gameactions:has(button[hidden]){margin-top:0}

/* Keep the play area within the viewport; controls can scroll independently. */
.player-colour{display:flex!important;flex-direction:row!important;align-items:center!important;flex-wrap:nowrap!important;gap:8px!important;width:auto!important}.player-colour .piece-colour{order:1;display:flex!important;align-items:center}.player-colour select{order:2;width:auto!important;max-width:12rem}.player-colour #whiteLabel,.player-colour #blackLabel{display:none!important}.player-colour small{display:none!important}.player-score .games-played{display:none!important}
html,body{height:100%;width:100%;overflow:hidden}body{height:100dvh;display:flex;flex-direction:column}header{width:100%;min-height:64px;padding:12px 24px;flex:0 0 auto}main{width:100%;max-width:1400px;flex:1;min-height:0;display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:28px;padding:16px 24px 12px;overflow:hidden}.game{min-width:0;min-height:0;display:grid;grid-template-rows:auto auto minmax(0,1fr) auto auto auto;margin:0}.gameheading{margin:0 0 12px}.gameheading .badge{margin:0}.players{margin-bottom:12px}.boardstage{min-width:0;min-height:0;display:flex;align-items:center;justify-content:center;overflow:hidden}.boardwrap{flex:none;max-width:100%;margin:0;padding:10px 12px 16px;box-shadow:0 6px 0 #102d32}.columns{height:18px;line-height:18px;margin-bottom:8px}.board{gap:6px}.cell{min-width:0}.statusline{margin-top:10px}.statusline p{margin-bottom:0}.result{margin-top:8px;padding:10px;gap:4px}.result strong{font-size:18px}.gameactions{margin-top:8px}aside{min-width:0;min-height:0;overflow:auto;overscroll-behavior:contain}.panel{padding:18px;margin-bottom:12px}footer{flex:0 0 auto;width:calc(100% - 48px);margin:0 auto;padding:8px 0;font-size:10px}.support-entry{flex:0 0 auto;width:100%;padding:0 24px}.training-results{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:14px;padding-top:12px;border-top:1px solid #dbe3e3;font-size:14px}.training-results span{text-align:center}.training-results strong{display:block;font:800 22px Manrope,sans-serif;margin-top:4px}
@media(max-width:740px){header{min-height:54px;padding:8px 14px;gap:8px}main{padding:10px 14px;gap:12px;grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1fr) minmax(120px,30%)}aside{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;align-items:start}.panel{padding:12px;margin:0}footer{display:none}.gameheading{margin-bottom:8px}#configBadge{font-size:18px}.player{padding:8px 12px;gap:4px}.player #whiteLabel,.player #blackLabel{font-size:20px}.player-score strong{font-size:20px;min-width:42px;padding:1px 8px}.player-colour .stone{width:18px;height:18px}.players{margin-bottom:8px}.statusline p{display:none}.statusline{margin-top:6px}#status{font-size:16px}.result p{display:none}.support-entry{padding:0 14px}.training-results{gap:3px;font-size:12px}}
@media(max-width:480px){aside{grid-template-columns:1fr}.brand{font-size:16px}.player-score{gap:14px}}
@media(max-height:650px) and (min-width:741px){header{min-height:48px;padding:6px 20px}main{padding-top:8px;gap:20px}.player{padding:8px 14px;gap:3px}.player #whiteLabel,.player #blackLabel{font-size:22px}.player-score strong{font-size:22px;padding:1px 8px}.gameheading{margin-bottom:6px}footer{display:none}.result p{display:none}.statusline p{display:none}}
.player{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;column-gap:8px;row-gap:6px;text-align:left}
.player-colour{grid-column:1;grid-row:1;justify-self:start;white-space:nowrap}
.player #whiteLabel,.player #blackLabel{grid-column:2;grid-row:1;justify-self:end;text-align:right}
.player-score{grid-column:2;grid-row:2;justify-self:end}
#blackCard{align-items:center;text-align:left}
.memory-stat{display:block;margin:16px 0}
.memory-count{display:flex;align-items:baseline;gap:7px;min-width:0;flex-wrap:wrap}
.memory-stat .memory-count strong{font-size:clamp(19px,2vw,28px);letter-spacing:-1px;overflow-wrap:anywhere}
.memory-divider{font:700 22px Manrope,sans-serif;color:#829294}
.memory-stat>span{display:block;margin-top:3px}
.player{grid-template-columns:auto minmax(0,1fr) auto;column-gap:7px;row-gap:3px}
.player-score{grid-column:3;grid-row:1;justify-self:end;display:flex;align-items:center;gap:8px}
.player .player-score span{white-space:nowrap}
dialog{max-height:calc(100dvh - 32px);overflow:auto}
@container (max-width:270px){.player #whiteLabel,.player #blackLabel{font-size:18px}.player-colour strong,.player .player-score span{font-size:14px}}
.player{container-type:inline-size}
.speed-bar{position:relative;height:40px;--speed-percent:0%}
.speed-track{position:absolute;left:9px;right:9px;top:15px;height:10px;border-radius:6px;background:#759497}
.speed-fill{height:100%;width:var(--speed-percent);border-radius:6px;background:#21484d}
.speed-marks{position:absolute;inset:0}
.speed-marks i{position:absolute;top:50%;width:1px;height:15px;background:#e5f3ca;transform:translate(-50%,-50%);pointer-events:none}
.speed-marks i.major{width:3px;height:21px;background:#e8f7ce}
#trainingSpeed{position:absolute;inset:0;margin:0;width:100%;height:40px;min-height:0;appearance:none;-webkit-appearance:none;background:transparent;cursor:pointer;accent-color:unset}
#trainingSpeed::-webkit-slider-runnable-track{height:10px;background:transparent}
#trainingSpeed::-moz-range-track{height:10px;background:transparent}
#trainingSpeed::-webkit-slider-thumb{appearance:none;-webkit-appearance:none;width:18px;height:24px;margin-top:-7px;border:2px solid #173a3f;border-radius:7px;background:#e5f3ca;box-shadow:0 1px 3px #12363b66}
#trainingSpeed::-moz-range-thumb{width:18px;height:24px;border:2px solid #173a3f;border-radius:7px;background:#e5f3ca;box-shadow:0 1px 3px #12363b66}
footer{align-items:center}footer #supportButton{min-height:36px;padding:6px 13px;font-size:13px;letter-spacing:0;text-transform:none}
@media(max-width:740px){footer{display:flex;width:calc(100% - 28px);padding:6px 0}footer #saveStatus{display:none}}

.memory-stat .bot-games-summary{font-size:16px;line-height:1.6;margin:0 0 4px;overflow-wrap:anywhere}.memory-stat .bot-games-summary strong{font:700 18px Manrope,sans-serif;letter-spacing:0}


[hidden]{display:none!important}.account-nav{display:flex;align-items:center;gap:.4rem;flex-wrap:wrap}.account-nav button{font-size:.875rem;padding:.45rem .65rem}.account-nav span{font-weight:700;overflow-wrap:anywhere;max-width:12rem}header{flex-wrap:wrap;gap:.6rem}#authDialog{width:min(94vw,440px)}#authDialog label{display:grid;gap:.45rem;margin:1rem 0}#authDialog input{box-sizing:border-box;width:100%;padding:.75rem;border:1px solid #a6b8bb;border-radius:7px;font:inherit}#authDialog small{font-size:.875rem;line-height:1.4;font-weight:400}#authMessage{white-space:pre-line}#scoresDialog{width:min(95vw,850px)}.scores-scroll{overflow:auto}#scoresDialog table{border-collapse:collapse;width:100%;font-size:.875rem}#scoresDialog th,#scoresDialog td{text-align:left;padding:.65rem;border-bottom:1px solid #ccd6d8}.account-feedback{font-size:.875rem;padding:.4rem 1rem;min-height:1.7rem}.bot-total{font-size:.9rem}.bot-total strong{font-variant-numeric:tabular-nums}#botPersistence{font-size:.875rem}@media(max-width:650px){.account-nav{order:4;width:100%}.header-note{display:none}}

.player-score{flex-wrap:wrap}.player-score small{display:block!important;flex-basis:100%;text-align:right;font-size:12px;font-weight:600;color:#587176}.player-score .rating-up{color:#23733d;background:#e7f5d7}.player-score .rating-down{color:#a64232;background:#fff0eb}.player-score strong{font-variant-numeric:tabular-nums}

.credit-balance{display:flex;align-items:center;justify-content:space-between;font-weight:700;margin:12px 0}.credit-balance strong{font-size:26px;font-variant-numeric:tabular-nums}.training-count-control{display:flex;flex-direction:column;align-items:center;gap:8px;margin:20px 0}.training-count-control>label{font-weight:700}.training-stepper{display:flex;flex-direction:column;align-items:stretch;width:100px;gap:3px}.training-stepper button{min-height:44px;padding:5px}.training-stepper input{width:100%;height:50px;text-align:center;font-size:24px;font-weight:700;border:1px solid #ccd7d8;border-radius:7px;background:#fff;color:#142d32;appearance:textfield;-moz-appearance:textfield}.training-stepper input::-webkit-inner-spin-button,.training-stepper input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}

.player-score .games-played{flex-basis:100%;text-align:right;font-size:14px;white-space:nowrap;color:#587176}.games-played b{font-variant-numeric:tabular-nums;color:#142d32;margin-left:8px}

.player{grid-template-columns:minmax(0,1fr) auto}.player-colour{grid-column:1/-1;flex-wrap:wrap;white-space:normal}.player-score{grid-column:2;grid-row:2;max-width:100%;justify-content:flex-end}.player-colour #whiteLabel,.player-colour #blackLabel{min-width:0;white-space:normal}
@media(min-width:1000px){.player-colour{grid-column:1;grid-row:1}.player-colour #whiteLabel,.player-colour #blackLabel{flex-basis:100%;text-align:left;font-size:22px}.player-score{grid-column:2;grid-row:1;width:150px}.player{padding:12px 16px}}

.training .sectionheading{margin-bottom:0}.training .credit-balance{margin-top:0}.player-score{display:grid;grid-template-columns:auto auto auto;width:auto;column-gap:7px;row-gap:5px}.player-score>span{grid-column:1;grid-row:1}.player-score>strong{grid-column:2;grid-row:1}.player-score>small{grid-column:3;grid-row:1;white-space:nowrap;font-size:14px}.player-score>.games-played{grid-column:1/-1;grid-row:2}@media(max-width:480px){.player-score{column-gap:4px}.player .player-score>span{font-size:13px}.player-score>strong{padding:1px 5px}.player-score>small{font-size:13px}}

.result p.training-nudge{display:block}

#formatPickerLabel{display:grid;gap:8px;margin-bottom:12px;font-weight:700}#formatPicker{width:100%;min-width:0;font-size:14px}#ruleEditor{border:1px solid #ccd7d8;border-radius:8px;padding:12px;margin:12px 0}#ruleEditor h3{margin-top:0}#formatStatus:empty{display:none}

/* Names and side selection stay with their board cards. */
.player-colour{display:flex;flex-direction:column;align-items:flex-start;gap:7px;min-width:0}
.player-colour select{max-width:100%;width:100%;font-size:18px;font-weight:700;margin:0}
.piece-colour{display:flex;align-items:center;gap:8px}
.player-colour [hidden]{display:none!important}
.player-score{grid-template-columns:minmax(0,1fr) auto auto}
.player .player-score>span{white-space:normal}
#creditPurchaseStatus:empty,#unlockAvailability:empty,#formatStatus:empty{display:none}
.training-stepper button{touch-action:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}
@media(min-width:1000px){.player-score{width:170px}.player-colour{width:100%}}
@media(max-width:480px){.player-colour select{font-size:15px}.player-score{max-width:100%;width:100%}}

.gameheading{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}.gameheading form{margin:0}.gameheading #gameButton{margin:0}

.player .piece-colour{display:flex;flex-direction:row;align-items:center;gap:8px;margin:0}

.credits-heading{display:flex;align-items:center;justify-content:space-between;gap:12px}.credits-heading>strong{font-size:24px;font-variant-numeric:tabular-nums}
header .account-nav{margin-left:auto;justify-content:flex-end}header .account-nav button{margin-left:0;border:1px solid #ccd7d8;background:white;min-height:44px}header #logoutAccount{order:10}
.gameheading{align-items:center}.gameheading #configBadge{font-size:clamp(24px,2.5vw,32px);line-height:1.2;white-space:normal;margin:0;padding:0}.gameheading #gameButton{align-self:center}
@media(max-width:650px){header .account-nav{justify-content:flex-end}.gameheading #configBadge{font-size:24px}}

.gameheading #setup{margin:0;display:flex;align-items:center}


.player-score{grid-template-columns:auto auto;justify-content:end;column-gap:7px}.player-score>span{justify-self:end}.player-score>strong{justify-self:end}
.memory-stat>#memoryConfig{display:block;font-size:17px;line-height:1.4;margin-bottom:10px;color:#142d32}
.training-count-control>label{text-align:center}.training-stepper{display:grid;grid-template-columns:100px auto;grid-template-rows:44px 50px 44px;width:auto;column-gap:10px;align-items:center}
#trainingUp{grid-column:1;grid-row:1}#trainingCount{grid-column:1;grid-row:2}#trainingDown{grid-column:1;grid-row:3}.training-games-unit{grid-column:2;grid-row:2}

.memory-stat>#memoryConfig{letter-spacing:normal;word-spacing:normal;white-space:normal}

.gameheading #formatPickerLabel{flex:1;min-width:0;max-width:100%;margin:0}
.gameheading #formatPicker{width:100%;font-size:clamp(20px,2.3vw,30px);font-weight:700;line-height:1.25;margin:0;padding:7px 32px 7px 10px;background-color:transparent;border-color:#bdcecf;text-overflow:ellipsis}
.gameheading #formatPicker:disabled{opacity:1;color:#425b60;cursor:default}
.boardwrap{position:relative}.boardwrap.gravity-on:before,.boardwrap.gravity-on:after{content:'';position:absolute;top:20%;height:60%;width:18px;background:#234e54;opacity:.13;pointer-events:none;clip-path:polygon(36% 0,64% 0,64% 86%,100% 86%,50% 100%,0 86%,36% 86%)}
.boardwrap.gravity-on:before{left:-25px}.boardwrap.gravity-on:after{right:-25px}
@media(max-width:480px){.gameheading #formatPicker{font-size:18px}.gameheading #formatPickerLabel{flex-basis:100%}}

.players .player{display:flex;flex-direction:row;align-items:center;justify-content:space-between;gap:8px}.players .player-colour{min-width:0;flex:1}.players .player-colour select{min-width:0;max-width:100%;flex:1}.players .player-score{width:auto;flex:none;display:flex;align-items:center;gap:6px}.players #blackCard{align-items:center;text-align:left}.players .games-played{display:none!important}@media(max-width:600px){.players{flex-direction:column}.players .player{width:100%}}
#gameName{width:100%;margin:8px 0 14px}#gameName[readonly]{background:#edf2f2}#unlockConfirm{max-width:440px;border:1px solid #bdcecf;border-radius:12px;padding:24px}#unlockConfirm::backdrop{background:#142d3266}#unlockConfirm button{margin-top:12px;margin-right:8px}
.playing-for{font-size:18px;font-weight:600}.players .player-score strong{border:0;background:transparent;box-shadow:none;padding:0;min-width:0}.players .player-score>span{font-size:24px}
.gameheading{justify-content:space-between}.playing-sentence{display:flex;align-items:center;gap:.28em;flex:1;min-width:0;font-size:26px;font-weight:700;font-family:inherit;line-height:1.25}.playing-sentence .playing-for,.gameheading .playing-sentence #configBadge,.gameheading .playing-sentence #formatPicker{font:inherit;line-height:inherit}.playing-sentence .playing-for{white-space:nowrap}.gameheading .playing-sentence #formatPickerLabel{flex:0 1 auto;min-width:0}.gameheading .playing-sentence #formatPicker{width:auto;max-width:100%;padding:0 24px 0 0;border-color:transparent}.players .player-score>span{font-size:32px}.gameheading #gameButton{font-size:20px;padding:14px 24px;min-height:54px;animation:startPulse 2s ease-in-out infinite}.gameheading #gameButton:disabled{animation:none}@keyframes startPulse{0%,100%{transform:scale(1)}50%{transform:scale(1.045)}}#unlockChoices button{margin-bottom:10px}@media(max-width:600px){.playing-sentence{font-size:21px;flex-wrap:wrap}}
.gameheading #gameButton{background:#4cae38;border-color:#398a29;color:#fff;font-size:22px;animation-duration:1.2s}.gameheading #gameButton:hover{background:#419a30}
.credits-heading{display:flex;justify-content:center;align-items:center;gap:12px}.credits-heading h2{margin:0}.playing-sentence{flex:0 1 auto;justify-content:center}.gameheading{justify-content:center;gap:16px}.gameheading .playing-sentence #formatPicker{padding:0 0 0 22px;background-image:none;appearance:none;text-align:left}.gameheading #formatPickerLabel{position:relative}.gameheading #formatPickerLabel:before{content:"▾";position:absolute;left:0;top:50%;transform:translateY(-50%);pointer-events:none;font-size:20px}.boardwrap.gravity-on:before,.boardwrap.gravity-on:after{opacity:.3;width:20px}.boardwrap.gravity-up:before,.boardwrap.gravity-up:after{transform:rotate(180deg)}#showLargeNumbers{margin-right:8px}

#moveCountdown{text-align:center;font-size:1.3rem;font-weight:700;color:#923b20;}

.gameheading{flex-wrap:nowrap;align-items:center;gap:12px}.gameheading .playing-sentence{flex:0 1 auto;flex-wrap:nowrap;min-width:0}.gameheading .playing-sentence #formatPicker{padding:0 26px 0 0;field-sizing:content;max-width:100%}.gameheading #formatPickerLabel:before{left:auto;right:3px}.gameheading #formatPickerLabel{flex:0 1 auto;min-width:0}.gameheading #setup{flex:0 0 auto;align-self:center}.gameheading #gameButton{white-space:nowrap}.gameheading #configBadge{white-space:nowrap}#ruleEditor h3{margin:0 0 12px}#ruleEditor h4{margin:0 0 12px}#gravity{width:7.4ch;min-width:7.4ch;flex:0 0 auto;padding:7px 20px 7px 6px}.cell .stone.fall{position:relative;z-index:2;animation:drop .32s ease-in;opacity:1}@keyframes drop{from{transform:translateY(var(--fall));opacity:1}to{transform:translateY(0);opacity:1}}@media(max-width:700px){.playing-sentence{font-size:clamp(14px,3.3vw,21px)}.gameheading #gameButton{font-size:clamp(14px,3vw,20px);padding:10px 12px;min-height:44px}.gameheading{gap:8px}}

.stone.cross{position:relative;background:none;border:0;box-shadow:none}.stone.cross:before,.stone.cross:after,.cell.last .stone.cross:after{content:'';position:absolute;display:block;top:43%;left:6%;width:88%;height:14%;margin:0;border-radius:2px;background:#f9faf3;box-shadow:0 1px 2px #0003}.stone.cross:before{transform:rotate(45deg)}.stone.cross:after,.cell.last .stone.cross:after{transform:rotate(-45deg)}.piece-colour .stone.cross:before,.piece-colour .stone.cross:after{background:#254b51}

.game{container-type:inline-size}.gameheading .playing-sentence{font-size:clamp(14px,3.2cqw,26px)}.gameheading #gameButton{font-size:clamp(14px,2.7cqw,22px);padding:12px clamp(10px,2.4cqw,24px)}

.gameheading{flex-wrap:wrap}.gameheading .playing-sentence{flex:0 0 auto;flex-wrap:wrap;max-width:100%}.gameheading .playing-sentence .playing-for{flex:0 0 auto}.gameheading .playing-sentence #formatPickerLabel{flex:0 0 auto;max-width:none}.gameheading .playing-sentence #formatPicker{flex-shrink:0;max-width:none;field-sizing:fixed;text-overflow:clip;padding-right:34px}#gravity{width:5.5rem;min-width:5.5rem;padding:7px 22px 7px 8px}.board{position:relative}.board>.piece-in-flight{position:absolute!important;z-index:5;pointer-events:none;min-width:0;min-height:0}.result{position:relative}.win-dancer{width:58px;height:76px;flex:0 0 58px;color:#244b50}.win-dancer svg{width:100%;height:100%;overflow:visible}.win-dancer .dance-body{animation:danceBounce .4s ease-in-out infinite}.win-dancer .dance-arm{transform-box:view-box;transform-origin:32px 28px;animation:danceArms .4s ease-in-out infinite alternate}.win-dancer .dance-leg{transform-box:view-box;transform-origin:32px 43px;animation:danceLegs .4s ease-in-out infinite alternate}.win-dancer .dance-right{animation-delay:-.4s}.result:has(.win-dancer:not([hidden])) strong,.result:has(.win-dancer:not([hidden])) p{flex-basis:calc(100% - 70px)}@keyframes danceBounce{0%,100%{transform:translateY(0) rotate(-4deg)}50%{transform:translateY(-5px) rotate(4deg)}}@keyframes danceArms{from{transform:rotate(-18deg)}to{transform:rotate(18deg)}}@keyframes danceLegs{from{transform:rotate(-12deg)}to{transform:rotate(12deg)}}.page-footer{display:none}main{padding-bottom:6px}.account-feedback:has(#accountStatus:empty):has(#retryAccountSave[hidden]){display:none}

#playOnline{animation:startPulse 1.2s ease-in-out infinite}#playOnline:disabled{animation:none}

.board>.piece-in-flight{animation:drop .32s ease-in both}

.win-dancer:not(.dancing) .dance-body,.win-dancer:not(.dancing) .dance-arm,.win-dancer:not(.dancing) .dance-leg{animation:none;transform:none}
.result p.training-nudge{font-size:18px;font-weight:800}
.result.training-complete{margin-top:2px}
.game:has(.result.training-complete:not([hidden])) .boardstage{align-items:flex-end}
#unlockHeading{margin-bottom:16px}#unlockChoices{display:grid;gap:12px}#unlockChoices button{margin-bottom:0}
#dialogText h2{font-size:18px;font-weight:800;margin:18px 0 10px}

/* Keep the board in a stable slot before, during and after a game. */
.game{grid-template-rows:auto auto minmax(0,1fr) 156px}.players{min-height:64px}.boardstage{align-items:flex-end}.board-feedback{height:156px;min-height:0;padding-top:8px;overflow:auto}.board-feedback .statusline{margin-top:0}.board-feedback .result{margin-top:4px}.board-feedback .statusline:has(#status:empty):has(#hint:empty){display:none}.board-feedback .gameactions{margin-top:4px}.players .player-score>span{font-size:38px}#playOnline{background:#4cae38;border-color:#398a29;color:#fff}#playOnline:hover{background:#419a30}@media(max-width:740px){.game{grid-template-rows:auto auto minmax(0,1fr) 156px}}

/* Stable heading tracks prevent button-label changes from moving the board. */
.game{grid-template-rows:72px 76px minmax(0,1fr) 156px}.gameheading{height:72px;min-height:72px;margin:0;align-content:center}.players{height:76px;min-height:76px;margin-bottom:12px}.gameheading #setup{width:220px;flex:0 0 220px}.gameheading #gameButton,#playOnline{width:220px;height:54px;min-height:54px;font-size:22px;padding:12px 16px;box-sizing:border-box}#onlinePanel{height:72px;min-height:72px;display:flex;align-items:center;justify-content:center;padding:0;margin-bottom:12px;background:transparent;border:0;box-shadow:none;position:relative}#onlineStatus:empty{display:none}#onlineStatus:not(:empty){position:absolute;top:62px;left:0;right:0;z-index:1;padding:8px;background:#eef2f2}.boardstage{align-items:flex-start}.game:has(.result.training-complete:not([hidden])) .boardstage{align-items:flex-start}.credit-coin{display:inline-flex;align-items:center;justify-content:center;width:23px;height:23px;border-radius:50%;border:2px solid #c98b12;background:linear-gradient(135deg,#fff0a8,#edb631 55%,#d69512);color:#f9d467;box-shadow:inset 0 0 0 2px #f5d579;font-size:15px;flex:0 0 23px}@media(max-width:740px){.game{grid-template-rows:104px 76px minmax(0,1fr) 156px}.gameheading{height:104px;min-height:104px}.gameheading #setup{width:180px;flex-basis:180px}.gameheading #gameButton,#playOnline{width:180px;height:54px;font-size:18px}}

.result{height:132px;min-height:132px;background:#fff;display:grid;grid-template-columns:70px minmax(0,1fr);grid-template-rows:1fr 1fr;align-items:center;overflow:auto}.result .win-dancer{grid-column:1;grid-row:1/span 2}.result strong{grid-column:2;grid-row:1}.result p{grid-column:2;grid-row:2;margin:0}.result.black-win{grid-template-columns:minmax(0,1fr) 70px}.result.black-win .win-dancer{grid-column:2}.result.black-win strong,.result.black-win p{grid-column:1}.unlock-actions{display:flex;gap:8px}.unlock-actions #saveFormat{flex:1;min-width:0}#formatsPanel:has(#ruleEditor:not([hidden])){position:relative}#formatsPanel:has(#ruleEditor:not([hidden])) .unlock-actions{padding-right:92px}#formatsPanel:has(#ruleEditor:not([hidden])) #cancelGameUnlock{position:absolute;right:18px;bottom:18px;width:84px}#cancelGameUnlock{margin-top:10px}#buyCredits{background:#e5f3ca;border:1px solid #cbdbaa;color:#254b51}#buyCredits:hover{background:#d9edb6}

@media(min-width:741px){#onlinePanel{height:136px;min-height:136px;align-items:flex-start;padding-top:9px}#onlineStatus:not(:empty){top:70px;margin:0;padding:8px 0;background:transparent;z-index:auto}}

#accountName{font-size:18px}

.free-credit-label{color:#c62828}
