:root{color-scheme:dark;--gold:#d9b15d;--cream:#f1dfb7}
*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:#020713;font-family:Georgia,serif;color:#f6ead0}body{display:grid;place-items:center}button{font:inherit}
.game-shell{position:relative;width:min(100vw,177.7778vh);height:min(100vh,56.25vw);aspect-ratio:16/9;margin:auto;overflow:hidden;background:#050b15}
.topbar{position:absolute;z-index:30;left:0;right:0;top:0;height:9.5%;min-height:62px;display:grid;grid-template-columns:auto 1fr auto;gap:18px;align-items:center;padding:8px 2.2%;background:linear-gradient(180deg,#03101ff2,#061526b8 72%,transparent);border-bottom:1px solid #c89b4822}
.menu-button{width:48px;height:48px;border:1px solid var(--gold);border-radius:13px;color:var(--cream);background:#0b2238;font-size:22px;cursor:pointer}.brand{text-align:center;line-height:.9;text-shadow:0 3px 8px #000}.brand span{display:block;font-size:clamp(11px,1vw,16px);letter-spacing:.45em;color:var(--gold)}.brand b{font-size:clamp(21px,2.3vw,42px);letter-spacing:.08em}
.players-bar{display:flex;gap:7px;min-width:0}.player-card{height:52px;min-width:105px;padding:3px 10px 3px 4px;border:1px solid #987638;border-radius:14px;background:#071728dd;display:flex;align-items:center;gap:7px;opacity:.62;transition:.3s}.player-card.active{opacity:1;border-color:#f0c568;box-shadow:0 0 17px #e5ae4140}.player-card div{display:flex;flex-direction:column}.player-card b{font-size:13px}.player-card small{color:#d6b567;font:10px system-ui,sans-serif}.piece{display:block;width:40px;height:44px;background-image:url('assets/player-pieces-four.png');background-size:400% 100%;background-repeat:no-repeat;background-position-y:center}.piece-0{background-position-x:0%}.piece-1{background-position-x:33.333%}.piece-2{background-position-x:66.666%}.piece-3{background-position-x:100%}
.board-wrap{position:absolute;inset:0;width:100%;height:100%;overflow:hidden;background:#020712}.board-art{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;user-select:none;transform:translateY(-2.5%)}.cell-layer,.tokens{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}.cell-layer{z-index:9}.cell-marker{position:absolute;width:2px;height:2px}.mystery-sigil{position:absolute;left:50%;top:50%;display:grid;place-items:center;width:clamp(18px,1.8vw,34px);height:clamp(18px,1.8vw,34px);border:1px solid #efcf82;border-radius:50%;color:#fff0b8;background:radial-gradient(circle,#6851a8,#171438 70%);font:bold clamp(11px,1.1vw,20px) Georgia,serif;transform:translate(-50%,-145%);box-shadow:0 2px 5px #000,0 0 10px #b799ff;animation:stickerGlow 1.8s ease-in-out infinite alternate}.tokens{z-index:11}@keyframes stickerGlow{to{transform:translate(-50%,-155%) scale(1.1);box-shadow:0 3px 6px #000,0 0 16px #e1c6ff}}
.token{position:absolute;width:clamp(34px,4vw,74px);height:clamp(41px,5vw,92px);background-image:url('assets/player-pieces-four.png');background-size:400% 100%;background-repeat:no-repeat;background-position-y:center;filter:drop-shadow(0 5px 4px #000) drop-shadow(0 0 4px #f1c861);transform:translate(-50%,-96%);transition:left var(--step-transition,450ms) cubic-bezier(.2,.75,.35,1),top var(--step-transition,450ms) cubic-bezier(.2,.75,.35,1)}.token.stepping{animation:pieceStep var(--step-duration,1000ms) ease-in-out}.token.teal{filter:drop-shadow(0 5px 4px #000) drop-shadow(0 0 5px #58e0db)}.token.instant{transition:none}@keyframes pieceStep{0%{transform:translate(-50%,-96%) scale(1)}35%{transform:translate(-50%,-127%) scale(1.08) rotate(-3deg)}70%{transform:translate(-50%,-122%) scale(1.06) rotate(2deg)}100%{transform:translate(-50%,-96%) scale(1)}}
.token.riding{z-index:30;transition:left var(--passage-duration,2000ms) cubic-bezier(.18,.72,.25,1),top var(--passage-duration,2000ms) cubic-bezier(.18,.72,.25,1);animation:passageRide .38s ease-in-out infinite alternate}.token.riding.climbing{filter:drop-shadow(0 5px 4px #000) drop-shadow(0 0 13px #ffe090)}.token.riding.sliding{filter:drop-shadow(0 5px 4px #000) drop-shadow(0 0 13px #ef534f)}@keyframes passageRide{from{transform:translate(-50%,-96%) rotate(-3deg) scale(1)}to{transform:translate(-50%,-108%) rotate(3deg) scale(1.08)}}
.dice-overlay{position:absolute;z-index:23;inset:0;display:grid;place-items:center;pointer-events:none;overflow:visible;opacity:0;visibility:hidden;background:radial-gradient(circle,#0a3f3a88 0,#020812bb 42%,transparent 70%);transition:opacity .18s}.dice-overlay.showing{opacity:1;visibility:visible}.magic-die-stage{position:relative;width:min(54vh,38vw,560px);height:min(54vh,38vw,560px);overflow:visible;filter:drop-shadow(0 24px 34px #000d)}.magic-die-stage model-viewer{position:absolute;inset:-18%;width:136%;height:136%;overflow:visible;background:transparent;--poster-color:transparent}.big-die{display:grid;place-items:center;width:clamp(110px,14vw,220px);aspect-ratio:1;border:4px solid #e8c676;border-radius:22%;color:#142438;background:linear-gradient(145deg,#fff7da,#d7b66e);font:bold clamp(58px,8vw,120px) Georgia,serif;box-shadow:0 18px 55px #000c,0 0 45px #e9be5966;animation:dieFloat .55s ease-in-out infinite alternate}.fallback-die{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%)}model-viewer:defined+.fallback-die{display:none}.big-die.toss{transform:translate(-50%,-50%) rotate(22deg) scale(1.08)}@keyframes dieFloat{from{margin-top:-8px;rotate:-8deg}to{margin-top:8px;rotate:10deg}}
.result-die-face{--face-size:min(25vh,18vw,250px);position:absolute;z-index:4;left:50%;top:50%;display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(3,1fr);box-sizing:border-box;width:var(--face-size);height:var(--face-size);min-width:var(--face-size);min-height:var(--face-size);padding:13%;gap:0;transform:translate(-50%,-50%) scale(.72) rotate(-6deg);opacity:0;border:2px solid #82ffe0;border-radius:18%;background:linear-gradient(145deg,#20b38aaa,#075e54d9 55%,#012b2bde);box-shadow:inset 0 0 35px #baffef55,0 0 35px #36e6bb,0 22px 38px #000b;backdrop-filter:blur(5px);transition:opacity .28s,transform .7s cubic-bezier(.15,.8,.2,1)}.magic-die-stage.settled model-viewer{opacity:0;transition:opacity .22s}.magic-die-stage.settled .result-die-face{opacity:1;transform:translate(-50%,-50%) scale(1) rotate(0)}.result-die-face i{align-self:center;justify-self:center;box-sizing:border-box;width:clamp(15px,1.75vw,27px);height:clamp(15px,1.75vw,27px);border-radius:50%;background:radial-gradient(circle at 35% 30%,#fff6bd,#edbd4e 45%,#8f5813);box-shadow:0 0 10px #ffe994,0 3px 5px #001b}
.event-popup{position:absolute;z-index:25;inset:0;opacity:0;visibility:hidden;pointer-events:none;display:grid;place-items:center;background:radial-gradient(circle at 50% 44%,#14275c77 0 18%,#02050ad9 67%);overflow:hidden}.event-popup.summoning{visibility:visible;animation:veilIn .35s ease-out forwards}.magic-screen{position:relative;width:min(62vw,820px);height:min(59vh,500px);display:grid;place-items:center;opacity:0;transform:perspective(900px) rotateX(16deg) scale(.2);border:2px solid #d8b96d;border-radius:28px;background:radial-gradient(ellipse at center,#152448f2,#050b18f7 72%);box-shadow:0 0 0 1px #fff2b955 inset,0 0 28px #ae8cff99,0 0 90px #5c46bc66}.magic-screen::before,.magic-screen::after{content:'✦';position:absolute;z-index:5;display:grid;place-items:center;width:44px;aspect-ratio:1;border:1px solid #e4c774;border-radius:50%;color:#ffe9a0;background:#131334;box-shadow:0 0 22px #dfbd62}.magic-screen::before{left:-22px;top:calc(50% - 22px)}.magic-screen::after{right:-22px;top:calc(50% - 22px)}.event-popup.revealing .magic-screen{animation:screenReveal .75s cubic-bezier(.16,.85,.2,1.12) forwards}.event-popup.revealing .event-picture{animation:eventFloat 1.3s .55s ease-in-out infinite alternate}.event-popup.leaving{animation:veilOut .6s ease-in forwards}.magic-runes{position:absolute;z-index:4;left:8%;right:8%;top:5%;text-align:center;color:#e7c971;font-size:clamp(15px,1.5vw,24px);letter-spacing:.55em;text-shadow:0 0 12px #ffd66e;opacity:.75;animation:runePulse 1.5s ease-in-out infinite alternate}.event-smoke{position:absolute;width:125%;height:110%;object-fit:contain;mix-blend-mode:screen;filter:hue-rotate(0deg) saturate(1.2)}.tone-violet .event-smoke{filter:hue-rotate(65deg) saturate(1.5)}.tone-ice .event-smoke{filter:hue-rotate(-20deg) saturate(.8) brightness(1.35)}.tone-gold .event-smoke{filter:hue-rotate(300deg) saturate(1.3)}.event-picture{position:relative;z-index:2;max-width:70%;max-height:65%;object-fit:contain;filter:drop-shadow(0 9px 15px #000)}.event-copy{position:absolute;z-index:3;bottom:3%;left:8%;right:8%;padding:10px 18px;text-align:center;border:1px solid #d2aa5a;border-radius:12px;background:#061522ec;box-shadow:0 5px 20px #000}.event-copy strong{display:block;color:#f2cf7b;font-size:clamp(18px,2vw,30px)}.event-copy span{font:clamp(12px,1.1vw,16px) system-ui,sans-serif;color:#e8edf2}.fireflies{position:absolute;inset:0}.fireflies i{position:absolute;left:var(--x);top:var(--y);width:var(--size);height:var(--size);border-radius:50%;background:#fff5a7;box-shadow:0 0 5px #fff,0 0 13px #ffd84d,0 0 24px #8affd7;opacity:0}.event-popup.summoning .fireflies i{animation:fireflyGather 1.25s var(--delay) ease-in-out infinite alternate}.event-popup.revealing .fireflies i{animation:fireflyOrbit 1.8s var(--delay) ease-in-out infinite alternate}
@keyframes fireflyGather{0%{opacity:0;transform:translate(var(--dx),var(--dy)) scale(.4)}45%{opacity:1}100%{opacity:.8;transform:translate(0,0) scale(1.25)}}@keyframes fireflyOrbit{from{opacity:.35;transform:translate(var(--dx),var(--dy)) scale(.7)}to{opacity:1;transform:translate(var(--dx2),var(--dy2)) scale(1.45)}}@keyframes runePulse{to{opacity:1;letter-spacing:.7em;text-shadow:0 0 20px #fff3ad}}@keyframes eventFloat{from{transform:translateY(-6px) rotate(-1deg) scale(1)}to{transform:translateY(8px) rotate(1deg) scale(1.06)}}@keyframes veilIn{from{opacity:0}to{opacity:1}}@keyframes screenReveal{0%{opacity:0;transform:perspective(900px) rotateX(16deg) scale(.2)}60%{opacity:1;transform:perspective(900px) rotateX(-2deg) scale(1.06)}100%{opacity:1;transform:perspective(900px) rotateX(0) scale(1)}}@keyframes veilOut{to{opacity:0;filter:blur(8px)}}
.question-card{position:absolute;z-index:24;left:2%;right:2%;bottom:.2%;min-height:18%;padding:8px 2% 10px;color:#17140f;text-align:center;border:2px solid #a87c35;border-radius:18px;background:linear-gradient(100deg,#e6d1a4,#fff4d7,#d9bc82);box-shadow:0 -8px 28px #000b}.turn-label{color:#326653;font-weight:bold;font-size:clamp(10px,1vw,14px);letter-spacing:.18em}.question-card h1{font-size:clamp(18px,2vw,31px);margin:2px 0 7px}.answers{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;max-width:1400px;margin:auto}.answers button,.die,.secondary{min-height:40px;border:2px solid #98713a;border-radius:10px;color:#f9edd2;background:linear-gradient(#16354b,#081a2a);cursor:pointer;font-weight:bold;font-size:clamp(13px,1.4vw,21px)}.answers button.correct{outline:4px solid #388a58;background:#174c3a}.answers button.wrong{outline:4px solid #a63e44;background:#592028}.bottom-row{display:grid;grid-template-columns:140px 1fr 140px;align-items:center;gap:12px;margin-top:7px}.bottom-row p{margin:0;color:#315a4d;font:600 13px system-ui,sans-serif}.secondary,.die{min-height:34px;font-size:13px}.die{display:flex;align-items:center;justify-content:center;gap:8px}.die strong{display:grid;place-items:center;width:27px;height:27px;border-radius:6px;color:#182330;background:#f3deb0}.die:disabled{opacity:.45;cursor:not-allowed}.die.rolling strong{animation:dice .65s ease}@keyframes dice{50%{transform:rotate(540deg) scale(1.35)}100%{transform:rotate(720deg)}}
@media(max-width:850px) and (orientation:landscape){.topbar{height:13%;min-height:45px;padding:3px 1%;grid-template-columns:auto 1fr 1fr}.brand{display:none}.menu-button{width:38px;height:38px}.player-card{height:38px;border-radius:10px}.player-card .piece{width:31px;height:31px;font-size:19px}.player-card b{font-size:11px}.player-card small{font-size:9px}.question-card{left:7%;right:7%;bottom:.2%;min-height:18%;padding:3px 10px 5px;border-radius:12px}.turn-label{display:none}.question-card h1{font-size:13px;margin:0 0 3px}.answers{gap:6px}.answers button{min-height:27px;font-size:11px;border-width:1px}.bottom-row{grid-template-columns:70px 1fr 76px;margin-top:3px}.bottom-row p{font-size:9px}.secondary,.die{min-height:25px;font-size:9px;border-width:1px}.die strong{width:19px;height:19px}.magic-screen{width:62vw;height:68vh;border-radius:17px}.event-copy{padding:4px 8px}.event-copy strong{font-size:15px}.event-copy span{font-size:10px}.token{width:27px;font-size:18px}}
@media(orientation:portrait){body::before{content:'Rotate your device to enter the Academy';position:fixed;inset:0;z-index:100;display:grid;place-items:center;padding:20%;text-align:center;color:#f2cf7b;background:#04101d;font-size:24px}.game-shell{visibility:hidden}}

/* 64-cell emerald academy layout */
.board-art{transform:none;object-fit:contain}
.topbar{inset:0;height:100%;min-height:0;display:block;padding:0;background:none;border:0;pointer-events:none}
.brand{position:absolute;top:1.2%;left:50%;transform:translateX(-50%);width:45%;color:#e8cea0}.brand span{display:none}.brand b{font-size:clamp(20px,2.5vw,44px)}
.menu-button{position:absolute;left:1.5%;bottom:3%;z-index:2;pointer-events:auto}
.sound-button{position:absolute;left:5.2%;bottom:3%;z-index:2;width:48px;height:48px;border:1px solid var(--gold);border-radius:13px;color:var(--cream);background:#0b2238;font-size:24px;cursor:pointer;pointer-events:auto}.sound-button:hover,.sound-button:focus{outline:none;box-shadow:0 0 15px #55ddbf77}
.sound-button:not(.muted){box-shadow:0 0 13px #55ddbf55}.sound-button.muted{opacity:.55;filter:grayscale(1)}
.players-bar{position:absolute;inset:0;display:block}.player-card{position:absolute;width:15%;min-width:130px;height:10%;pointer-events:auto;background:linear-gradient(135deg,#091720f2,#020609f2);border-color:#aa884d;box-shadow:0 5px 18px #000b}.player-card:nth-child(1){left:1.5%;top:8%}.player-card:nth-child(2){right:1.5%;top:8%}.player-card:nth-child(3){left:1.5%;top:22%}.player-card:nth-child(4){right:1.5%;top:22%}
.question-card{left:19%;right:19%;bottom:1.3%;min-height:16%;color:#eee0c7;border-color:#a9854e;border-radius:8px;background:linear-gradient(110deg,#06131ef5,#092229f3,#06131ef5)}.question-card h1{color:#f0e7d8}.bottom-row p{color:#8fd5c0}.turn-label{color:#caae72}.answers button{border-color:#9d7946;background:linear-gradient(#102c31,#06161c)}
.mystery-sigil{background:radial-gradient(circle,#2ee5bd,#073c38 62%,#020c11);border-color:#d7bd72;box-shadow:0 0 10px #5effdc,0 0 24px #1bb99d;transform:translate(-50%,-50%);animation:stickerGlow 1.8s ease-in-out infinite alternate}
.cell-marker{display:grid;place-items:center;width:clamp(18px,1.7vw,30px);height:clamp(18px,1.7vw,30px);margin:calc(clamp(18px,1.7vw,30px)/-2);color:#e5c486;font:bold clamp(10px,1vw,17px) Georgia,serif;text-shadow:0 2px 3px #000,0 0 6px #000}.cell-marker .mystery-sigil{z-index:2}.cell-marker:has(.mystery-sigil){color:transparent;text-shadow:none}
@keyframes stickerGlow{to{transform:translate(-50%,-50%) scale(1.14) rotate(12deg);box-shadow:0 0 16px #baffed,0 0 32px #35dabc}}
@media(max-width:850px) and (orientation:landscape){.player-card{min-width:94px;width:16%;height:11%}.player-card:nth-child(1),.player-card:nth-child(2){top:7%}.player-card:nth-child(3),.player-card:nth-child(4){top:20%}.question-card{left:18%;right:18%}.brand b{font-size:17px}.menu-button{bottom:2%}.sound-button{left:6.4%;bottom:2%;width:38px;height:38px;font-size:18px}}
.board-decor{position:absolute;inset:0;z-index:8;pointer-events:none;overflow:hidden}.decor{position:absolute;object-fit:contain;filter:drop-shadow(0 5px 5px #000a)}.decor.snake{transform-origin:center}.snake-a{left:24%;top:17%;width:14%;transform:rotate(72deg)}.snake-b{left:46%;top:32%;width:12%;transform:rotate(58deg)}.snake-c{left:67%;top:16%;width:11%;transform:rotate(68deg)}.snake-d{left:69%;top:38%;width:7%;height:22%;transform:rotate(-8deg)}.decor.ladder{width:6%;height:20%;filter:drop-shadow(0 3px 4px #000) drop-shadow(0 0 7px #33d5aa88)}.ladder-a{left:31%;top:38%;transform:rotate(-20deg)}.ladder-b{left:47%;top:19%;transform:rotate(17deg)}.ladder-c{left:61%;top:38%;transform:rotate(-14deg)}.ladder-d{left:65%;top:20%;transform:rotate(18deg)}
.token{width:clamp(38px,4.4vw,82px);height:clamp(52px,5.9vw,110px);z-index:12}.player-card .piece{width:46px;height:58px}
@media(max-width:850px) and (orientation:landscape){.token{width:34px;height:46px}.player-card .piece{width:32px;height:39px}.decor.ladder{width:5.5%;height:19%}}
/* Centered magic glyphs and readable event confirmation */
.cell-marker .mystery-sigil{left:50%;top:50%;width:clamp(30px,2.7vw,50px);height:clamp(30px,2.7vw,50px);font-size:clamp(17px,1.7vw,30px);transform:translate(-50%,-50%);box-shadow:0 0 14px #8affdf,0 0 34px #20cba4,0 3px 7px #000}
.event-copy span{display:block}.event-ok{min-width:110px;margin-top:10px;padding:7px 26px;border:1px solid #e1c370;border-radius:8px;color:#fff1bf;background:linear-gradient(#174b48,#071c23);font:bold clamp(13px,1vw,17px) Georgia,serif;letter-spacing:.12em;cursor:pointer;box-shadow:0 0 14px #54e2ba55}.event-ok:hover,.event-ok:focus{outline:none;background:linear-gradient(#216c62,#0a2930);box-shadow:0 0 20px #81ffe0}.event-ok:disabled{opacity:.35;cursor:default}
@media(max-width:850px) and (orientation:landscape){.cell-marker .mystery-sigil{width:28px;height:28px;font-size:16px}.event-ok{min-width:82px;margin-top:5px;padding:4px 18px;font-size:11px}}
/* Setup screen and complete title */
.brand{width:72%;white-space:nowrap;overflow:visible}.brand b{display:block;font-size:clamp(19px,2.35vw,42px);white-space:nowrap}
.setup-screen{position:absolute;z-index:80;inset:0;display:grid;place-items:center;background:radial-gradient(circle at 50% 38%,#123c3aee,#02070cf7 70%);transition:opacity .45s,visibility .45s}.setup-screen.hidden{opacity:0;visibility:hidden;pointer-events:none}.setup-panel{width:min(1040px,90vw);max-height:90%;overflow:hidden;padding:clamp(16px,2.2vw,30px);text-align:center;border:2px solid #b18a49;border-radius:22px;background:linear-gradient(145deg,#0a2027f5,#030a11f8);box-shadow:0 0 60px #35cbaa44,0 20px 70px #000}.setup-kicker{color:#d9bd7a;letter-spacing:.35em;font-weight:bold}.setup-panel h1{margin:6px 0;color:#f2dfb6;font-size:clamp(25px,3vw,44px)}.setup-intro{margin:0 0 16px;color:#9ccfc4;font:14px system-ui,sans-serif}.count-picker{display:flex;justify-content:center;gap:8px;margin-bottom:18px}.count-picker button,.start-game{min-width:0;padding:10px 16px;border:1px solid #a78348;border-radius:9px;color:#ead9b4;background:#081720;font-weight:bold;white-space:nowrap;cursor:pointer}.count-picker button.selected{color:#071512;background:#d7b968;box-shadow:0 0 18px #4ef0c088}.piece-picker{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.setup-player{display:grid;grid-template-columns:minmax(112px,1fr) auto;align-items:center;gap:8px;min-width:0;padding:8px 10px;border:1px solid #91723e77;border-radius:12px;background:#06141d}.setup-player>b{color:#d9bd7a;font-size:12px}.setup-options{display:flex;gap:4px}.setup-piece{display:grid;place-items:center;width:50px;height:62px;padding:0;border:1px solid #846b42;border-radius:9px;background:#02070a;cursor:pointer}.setup-piece .piece{width:40px;height:56px}.setup-piece.selected{border-color:#73f7d6;background:#123b3b;box-shadow:0 0 14px #38e5bc}.setup-piece:disabled{opacity:.2;cursor:not-allowed}.start-game{margin-top:18px;min-width:210px;color:#061410;background:linear-gradient(#efcf7e,#b88637);font-size:17px;box-shadow:0 0 20px #4ff5c066}
@media(max-width:850px) and (orientation:landscape){.brand{width:65%}.brand b{font-size:17px}.setup-panel{width:76vw;max-height:94%;padding:10px 16px}.setup-panel h1{font-size:21px;margin:2px}.setup-intro{display:none}.count-picker{margin-bottom:7px}.count-picker button{padding:5px 12px;font-size:10px}.piece-picker{gap:5px}.setup-player{padding:3px 8px}.setup-piece{width:39px;height:39px}.setup-piece .piece{width:30px;height:36px}.start-game{margin-top:7px;padding:6px 16px;font-size:12px}}
/* Whole red snakes matched to the emerald board */
.decor.snake{width:8%;height:24%;object-fit:contain;filter:drop-shadow(0 4px 5px #000) drop-shadow(0 0 8px #e22b2b66)}.snake-a{left:28%;top:17%;transform:rotate(-12deg)}.snake-b{left:48%;top:29%;transform:rotate(7deg)}.snake-c{left:68%;top:15%;transform:rotate(-9deg) scaleX(-1)}.snake-d{left:69%;top:36%;transform:rotate(11deg)}
@media(max-width:850px) and (orientation:landscape){.brand{display:block;top:.8%;width:60%}.brand b{font-size:15px;letter-spacing:.06em}}
.board-decor .decor.ladder{filter:brightness(1.42) saturate(1.25) drop-shadow(0 3px 4px #000) drop-shadow(0 0 9px #46e1b1aa)}
.cell-layer{z-index:14}.tokens{z-index:16}
.event-popup.revealing{pointer-events:auto}.event-popup.leaving{pointer-events:none}
.settings-overlay,.target-overlay{position:absolute;z-index:90;inset:0;display:grid;place-items:center;opacity:0;visibility:hidden;pointer-events:none;background:#02070cdd;backdrop-filter:blur(8px);transition:opacity .25s,visibility .25s}.settings-overlay.showing,.target-overlay.showing{opacity:1;visibility:visible;pointer-events:auto}.settings-card,.target-card{position:relative;width:min(540px,82vw);padding:28px;border:2px solid #b18a49;border-radius:20px;color:#f1dfb8;text-align:center;background:linear-gradient(145deg,#0b2529,#030a11);box-shadow:0 0 45px #38dab655,0 22px 60px #000}.settings-card h2,.target-card h2{margin:7px 0 22px;font-size:clamp(26px,3vw,40px)}.settings-close{position:absolute;right:13px;top:10px;border:0;color:#ead4a5;background:transparent;font-size:32px;cursor:pointer}.settings-card label{display:grid;grid-template-columns:1fr auto;gap:8px 16px;margin:21px 0;text-align:left;font:700 16px system-ui,sans-serif}.settings-card output{color:#7ee4ca}.settings-card input{grid-column:1/-1;width:100%;accent-color:#53d9bb}.target-card p{color:#9fd7ca;font:15px system-ui,sans-serif}.target-choices{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:10px;margin-top:18px}.target-choices button{display:grid;grid-template-rows:75px auto auto;place-items:center;padding:9px;border:1px solid #a48348;border-radius:12px;color:#eedebc;background:#06151d;cursor:pointer}.target-choices button:hover,.target-choices button:focus{outline:none;border-color:#75f7d9;background:#123837;box-shadow:0 0 17px #48dbbb}.target-choices .piece{width:56px;height:72px}.target-choices small{color:#83cdbd}
/* Player names, larger cards and flexible piece swapping */
.player-card{width:17%;min-width:160px;height:12%;padding:7px 14px 7px 7px;gap:11px}.player-card .piece{width:58px;height:72px;flex:0 0 auto}.player-card b{font-size:clamp(14px,1.15vw,20px);max-width:150px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.player-card small{font-size:clamp(11px,.85vw,15px);font-weight:700}.setup-player label{display:flex;flex-direction:column;align-items:flex-start;gap:4px;color:#d9bd7a;font:bold 11px Georgia,serif}.setup-player input{width:125px;padding:6px 8px;border:1px solid #836b42;border-radius:7px;color:#f4e4c2;background:#02090e;font:bold 12px Georgia,serif;text-transform:uppercase}.setup-player input:focus{outline:1px solid #6ce5c8;box-shadow:0 0 9px #48d9ba66}.setup-player input:disabled{color:#7ddac7;opacity:.8}.count-picker{flex-wrap:wrap}
@media(max-width:850px) and (orientation:landscape){.player-card{width:18%;min-width:108px;height:13%;padding:3px 6px;gap:4px}.player-card .piece{width:38px;height:47px}.player-card b{font-size:11px}.player-card small{font-size:9px}.setup-player input{width:88px;padding:3px 5px;font-size:9px}.count-picker{gap:4px}.count-picker button{padding:4px 8px}}

.academy-typing{display:flex;gap:12px;width:100%;grid-column:1/-1}.academy-typing input{min-width:0;flex:1;border:2px solid #b8904c;border-radius:12px;background:#09232c;color:#fff2d0;padding:10px 18px;font:inherit;font-size:24px}.academy-typing button{min-width:120px}

.academy-answer-mode{display:block;margin:14px auto;color:#f5e4b8}.academy-answer-mode select{padding:10px;border:1px solid #b8904c;border-radius:8px;background:#09232c;color:#fff2d0;font:inherit}

/* Player cards must fit inside their grid tracks, including landscape phones. */
.setup-player{grid-template-columns:minmax(0,1fr) minmax(0,1.45fr);gap:6px}
.setup-player label,.setup-options{min-width:0}.setup-player input{box-sizing:border-box;width:100%;max-width:125px;min-width:0}
.setup-options{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:4px}
.setup-piece{width:100%;max-width:50px;min-width:0;height:54px}.setup-piece .piece{width:85%;height:48px}
@media(max-width:1050px) and (orientation:landscape){.setup-panel{width:84vw;padding:10px 14px}.setup-player{padding:4px 6px;gap:4px}.setup-player label{font-size:10px;gap:2px}.setup-player input{font-size:10px;padding:3px 4px}.setup-piece{height:40px}.setup-piece .piece{height:36px}.setup-options{gap:3px}}
.tone-gold .event-smoke{filter:grayscale(1) sepia(1) saturate(3.5) hue-rotate(355deg) brightness(1.15);opacity:.65}
.event-popup.victory .magic-screen{background:radial-gradient(ellipse at 50% 40%,#6a4b20cc,#07121df5 70%);box-shadow:0 0 34px #f5cb6b99,0 0 100px #e0a33255}
.event-popup.victory .event-picture{max-width:48%;max-height:65%;margin-top:-7%;filter:drop-shadow(0 8px 12px #0009) drop-shadow(0 0 24px #ffc95f88)}
.event-popup.victory .magic-screen::after,.event-popup.victory .magic-screen::before{box-shadow:0 0 25px #ffd36b}
@media(prefers-reduced-motion:reduce){.event-popup.victory .event-picture{animation:none!important}}
.setup-panel{width:min(1040px,92%)}
@media(max-width:1050px) and (orientation:landscape){.setup-panel{width:92%}}
.event-popup.victory .event-picture{position:absolute;top:9%;height:55%;max-height:55%;width:auto;margin:0}

/* Keep typing proportional to the question strip on landscape phones. */
@media(max-height:600px) and (orientation:landscape){
.question-card{min-height:0;left:14%;right:14%;padding:5px 10px 6px}
.academy-typing{gap:7px;align-items:center}.academy-typing input{height:40px;padding:6px 10px;font-size:16px;line-height:1.2;box-sizing:border-box}
.academy-typing button{min-width:76px;height:40px;min-height:40px;padding:5px 12px;font-size:13px;box-sizing:border-box}
.magic-screen{width:min(56vw,560px);height:min(68vh,300px);border-radius:16px}.magic-screen::before,.magic-screen::after{width:26px;top:calc(50% - 13px)}.magic-screen::before{left:-13px}.magic-screen::after{right:-13px}
.event-copy{left:6%;right:6%;bottom:3%;padding:5px 8px}.event-copy strong{font-size:15px}.event-copy span{font-size:11px;line-height:1.3}.event-ok{min-width:88px;min-height:36px;margin-top:6px;padding:6px 14px;font-size:12px}.magic-runes{font-size:12px}
}

@media (orientation:landscape){
 #settingsButton{left:8px;bottom:8px}#soundToggle{left:54px;bottom:8px}
 .game-menu-link{left:8px;bottom:56px}
}
.homework-game #countPicker,.homework-game .academy-answer-mode,.homework-game .setup-player label{display:none!important}.homework-game #setupScreen .setup-panel h1{font-size:clamp(22px,4vw,38px)}