/* Shared visual structure with Long Multiplication; preserve the number grid. */
[hidden]{display:none!important}
.mode-dialog{width:100%;max-height:none;margin:24px auto;padding:0;border:0;background:none;box-shadow:none;overflow:visible}
.mode-dialog-head{margin-bottom:32px;align-items:center}
.mode-dialog-head h1{font-size:clamp(36px,5vw,64px)}
.close-mode{width:auto;height:auto;min-height:44px;padding:10px 18px;border:2px solid #777aa1;border-radius:999px;font-size:16px;font-weight:800}
.gameplay-group{padding:24px;border:2px solid #48496e;border-radius:28px;background:#22233b;box-shadow:0 9px 0 #11121e;color:#f7f4ed}
.group-heading{margin-bottom:20px}.group-heading h3{font-size:22px}
.times-carousel{display:block}.scroll-tables{display:none}
.times-tiles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;overflow:visible;padding:0}
.mode-tile,.times-tiles .mode-tile{display:flex;flex-direction:column;align-items:flex-start;min-height:170px;gap:16px;padding:22px;border:2px solid #777aa1;border-radius:22px;background:#32334f;color:#f7f4ed;box-shadow:0 6px 0 #11121e}
.mode-tile strong{font-size:24px}.mode-tile small{color:#d9daec}
.mode-tile .mode-icon{background:#cafa70;color:#171821}
.mode-tile.selected{background:#3b3e60;border-color:#cafa70}
.mode-tile .tile-best{top:18px;right:16px;background:#e9eaff;color:#333ca1}
.other-tiles{grid-template-columns:1fr}.other-tiles .mode-tile{min-height:145px}
.play-stage{min-height:0;display:block;margin-top:18px}
.game-shell{display:flex;flex-direction:column;gap:18px;width:min(100%,1080px);padding:24px;border:2px solid #48496e;border-radius:28px;background:#22233b;box-shadow:0 9px 0 #11121e}
.game-head{display:grid;grid-template-columns:minmax(130px,auto) minmax(0,1fr) minmax(150px,auto);grid-template-areas:none;align-items:center;gap:16px;width:100%;margin:0}
.game-head>.stat:first-child,.game-head>.score-stat{grid-area:auto}
.stat{padding:12px 18px;border-radius:18px;background:#32334f}.stat strong{font-size:30px}.stat small{font-size:12px}
.challenge{width:auto;margin:0;padding:8px;border:0;background:transparent;box-shadow:none;color:#cafa70}
.challenge strong{color:#cafa70;font-size:clamp(22px,2.5vw,30px)}
.status-row{display:flex;flex-direction:row;align-items:center;justify-content:space-between;gap:20px;width:100%;padding:16px 22px;min-height:74px;border-radius:20px;background:#32334f}
.status-row p{color:#f6dc7d}.status-row button{width:auto;flex-shrink:0;min-height:44px}
.grid-wrap{align-self:center;margin:0 auto;width:min(100%,640px,max(360px,calc(100dvh - 360px)))}
.account-notice{width:100%;margin:0}
@media(max-width:759px){.game-shell{padding:14px;gap:14px}.game-head{grid-template-columns:1fr 1fr;gap:10px}.game-head>.challenge{grid-column:1 / -1;grid-row:1}.game-head>.stat{grid-row:2}.grid-wrap{width:min(100%,580px)}.status-row{flex-direction:column;align-items:stretch;padding:16px}.status-row button{width:100%}.times-tiles{grid-template-columns:repeat(2,minmax(0,1fr))}.gameplay-group{padding:18px}}
@media(max-width:500px){.times-tiles{grid-template-columns:1fr}.mode-tile,.times-tiles .mode-tile{min-height:150px}.mode-dialog{padding:0}.stat{padding:10px}.stat strong{font-size:28px}.game-head .score-stat small{font-size:12px}.score-stat small::after{content:none}.mode-dialog-head h1{font-size:36px}.close-mode{font-size:14px}}
@media(max-width:759px){.game-head>.stat:first-child{grid-column:1}.game-head>.score-stat{grid-column:2}}
/* Center the complete board below the header whenever there is room. */
.play-stage{display:flex;flex-direction:column;justify-content:center;min-height:calc(100svh - 84px);margin-top:0}
.grid-wrap{container-type:inline-size}
.number-cell{font-size:clamp(15px,5cqw,24px)}
@media(max-width:759px){.play-stage{min-height:calc(100svh - 100px)}}
