/* Warm clay studio: ivory wall, curved floor, diffuse side light. */
body,body[data-challenge="easy"],body[data-challenge="medium"],body[data-challenge="hard"],body[data-challenge="full"]{background:#e8d6b4;color:#564635;background-image:radial-gradient(ellipse at 18% 9%,#fff6de 0,transparent 58%),linear-gradient(180deg,#eedfbf 0%,#e5d0a9 49%,#d6bf96 60%,#eadbb9 84%);background-attachment:fixed}
body:before{content:'';position:fixed;inset:0;pointer-events:none;background:radial-gradient(ellipse 80% 22% at 50% 52%,#a890651c,transparent 72%);z-index:0}
#main{position:relative;z-index:1}.play-brand,.stage-title h1{color:#624b35}.stage-title>span{color:#927c60}.round-icon{background:#f8eaca;color:#806745;box-shadow:inset 0 2px 3px #fffa,0 3px 6px #89704216}.top-points{background:#f6df9a;color:#876322}.top-points strong{color:#715c39}
.pyramid{margin-bottom:30px;isolation:isolate}.pyramid:before{content:'';position:absolute;bottom:6px;left:9%;right:9%;height:26px;border-radius:50%;background:#aa906345;filter:blur(16px);z-index:-1;pointer-events:none}
.letter-rack{padding-top:14px;padding-bottom:20px}.webgl-ready .tile:after{opacity:var(--shadow-opacity,1);background:#765d3755;filter:blur(6px)}
.actions .primary{background:#ad815c;box-shadow:inset 0 2px 3px #fff4,0 4px 0 #886446,0 7px 10px #6f503021}.actions .primary:hover:enabled{background:#b78b65;box-shadow:inset 0 2px 3px #fff4,0 5px 0 #886446}.actions .secondary{background:#f3e2b9;color:#896c42;box-shadow:inset 0 2px 3px #fff8,0 4px 0 #c9b589,0 7px 10px #6f503018}.level-dock button{color:#856d4e}.level-dock button:hover{color:#5e4930}
.info-dialog,.settings-dialog,.menu-dialog{background:#faf0d9;color:#624b35}.dialog-close{background:#eadebd;color:#8b7454}.info-dialog .motion-tip{color:#8b795a}.movement-toggle{display:none}
/* Keep idle motion running; only pointer pull pauses the fallback row bob. */
.pyramid:not(.webgl-ready) .pyramid-row{animation:studio-bob 3.9s ease-in-out infinite!important;animation-delay:calc(var(--row-index)*-.35s)!important}.pyramid.arrive:not(.webgl-ready) .tile,.letter-rack.arrive:not(.webgl-ready) .tile{animation:studio-drop-in 1.334s both!important;animation-delay:calc(var(--tile-order)*20ms)!important}.letter-rack:not(.webgl-ready) .letter-btn{animation:studio-bob 4s ease-in-out infinite!important;animation-delay:calc(var(--tile-order)*-.21s)!important}.pyramid.interacting:not(.webgl-ready) .pyramid-row{animation-play-state:paused!important}
.pyramid.dropping:not(.webgl-ready) .tile,.letter-rack.dropping:not(.webgl-ready) .tile{animation:studio-drop-out .578s ease-in both!important;animation-delay:calc(var(--tile-order)*13.333ms)!important}.pyramid.webgl-ready .pyramid-row{animation:none!important}
body[data-transition="falling"] .game-controls,body[data-transition="falling"] .level-dock{pointer-events:none}
@keyframes studio-bob{0%,100%{translate:0 0}50%{translate:0 -2px}}@keyframes studio-drop-in{
 0%{transform:translateY(-350px);animation-timing-function:ease-in}
 45.48%,50.06%,70.89%,75.48%,87.97%,92.56%,100%{transform:translateY(0) scale(1);animation-timing-function:ease-out}
 47.77%{transform:translateY(calc(var(--tile)*.055)) scale(1.0715,.89);animation-timing-function:ease-in}
 60.48%{transform:translateY(calc(var(--tile)*-.2)) scale(.9835,1.033);animation-timing-function:ease-in}
 73.18%{transform:translateY(calc(var(--tile)*.0225)) scale(1.02925,.955);animation-timing-function:ease-in}
 81.72%{transform:translateY(calc(var(--tile)*-.065)) scale(.99325,1.0135);animation-timing-function:ease-in}
 90.26%{transform:translateY(calc(var(--tile)*.009)) scale(1.0117,.982);animation-timing-function:ease-in}
 96.28%{transform:translateY(calc(var(--tile)*-.018)) scale(.9973,1.0054);animation-timing-function:ease-in}
}@keyframes studio-drop-out{0%{transform:translateY(0);opacity:1}85%{opacity:1}100%{transform:translateY(650px);opacity:0}}
@media(max-width:600px){.pyramid{margin-bottom:26px}.letter-rack{padding-top:12px}.level-dock{padding-top:20px}}
@media(max-height:700px) and (max-width:600px){.pyramid{margin-bottom:22px}.letter-rack{padding-top:10px}}

.info-dialog h3{font:600 19px var(--display);margin:18px 0 9px}
/* Active layer stays readable in both mesh and CSS rendering. */
.pyramid-row{position:relative}.pyramid-row.editable{background:none!important;border:0!important;padding:0!important;outline-offset:6px}
.row-marker{position:absolute;left:-15px;top:50%;translate:0 -50%;font-size:10px;line-height:1;color:#507f76;z-index:4;pointer-events:none}
.tile.unknown.selected-tile{background:linear-gradient(135deg,#c5e6d8,#9dcbbb)!important}.tile.unknown.selected-tile .cube-front{color:#386b61}
.pyramid.webgl-ready .tile.unknown.selected-tile{background:none!important}
.actions{max-width:390px;gap:8px}.actions .primary,.actions .secondary{font-size:15px;padding:0 13px}.actions .erase{width:44px;padding:0}.actions .solution-button{font-size:13px;padding:0 10px}
.mode-tabs{display:flex;flex-wrap:wrap;gap:7px}.mode-tabs button{flex:1 1 100px;font-size:13px;padding:11px 7px;min-height:44px}
.unlock-list{margin-top:22px}.unlock-list h3{font:600 22px var(--display);margin:0 0 8px}.unlock-list>p{font-size:13px;line-height:1.65}.unlock-item{display:flex;align-items:center;justify-content:space-between;gap:12px;border-bottom:1px solid #ac91622b;padding:13px 0}.unlock-item strong,.unlock-item small{display:block}.unlock-item strong{font-size:15px}.unlock-item small{font-size:12px;color:#897152;margin-top:4px}.unlock-item button{font-size:13px;padding:10px 12px;min-height:44px;white-space:nowrap}.unlock-open{color:#537f62;font-size:22px}.unlock-item button:disabled{opacity:.5;cursor:default}#unlockMessage,#settingsMessage{font-size:14px;line-height:1.5;margin-top:12px}
.welcome-screen{max-width:410px;margin:28px auto 0;text-align:center}.welcome-screen h1{font:600 35px var(--display);line-height:1.2;margin:12px 0}.welcome-screen>p{color:#8b7454;font-size:15px}.welcome-points{display:grid;gap:5px;padding:22px 0}.welcome-points strong{font:600 68px var(--display);color:#8c6538;line-height:1}.welcome-points span{font-size:15px}.welcome-points small{font-size:12px;color:#8c7757}.welcome-stats{display:flex;justify-content:center;gap:60px;margin-bottom:23px}.welcome-stats strong,.welcome-stats span{display:block}.welcome-stats strong{font:600 28px var(--display)}.welcome-stats span{font-size:12px;color:#8b7454}.played-modes{background:#fff4;border-radius:16px;padding:9px 16px;text-align:left}.played-modes>div{display:flex;justify-content:space-between;padding:8px 0;font-size:14px}.player-name-label{display:block;text-align:left;font-size:13px;margin:23px 0 7px;color:#896e4e}.player-name{display:block;width:100%;box-sizing:border-box;padding:12px 14px;font:inherit;border:1px solid #d1b993;border-radius:12px;background:#fff7e3;color:#624b35}.welcome-continue{width:100%;margin:14px 0;min-height:48px;background:#ad815c}.welcome-screen .save-note{font-size:12px;line-height:1.6;margin-top:24px}.welcome-screen .resume-detail{font-size:13px;margin-top:17px}.settings-dialog .select{width:100%;margin-top:7px}
@media(max-width:380px){.actions{gap:6px}.actions .primary,.actions .secondary{padding:0 10px;font-size:14px}.actions .solution-button{font-size:12px;padding:0 8px}.actions .erase{width:40px;padding:0}.welcome-screen h1{font-size:30px}}

/* Always-visible rewards for all possible computer-selected layers. */
.layer-rewards:empty{display:none}.layer-rewards{margin:-14px auto 20px;max-width:450px}
.reward-heading{font-size:12px;text-align:center;color:#806745;margin-bottom:9px}
.reward-layers{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}
.reward-layer{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;padding:8px 3px;min-height:61px;border:1px solid #ac91623b;border-radius:12px;background:#fff3;color:#806745}
.reward-layer span{font-size:11px}.reward-layer strong{font:600 19px var(--display)}
.reward-layer.current{border:2px solid #618b70;background:#e7f0d9;color:#3c6249}
.reward-layer small{font-size:9px;font-weight:600}.reward-note{font-size:11px;text-align:center;color:#806745;margin:7px 0 0}

.letter-rack.arrive:not(.webgl-ready) .tile{animation:studio-drop-in 1.334s both,studio-bob 4s ease-in-out infinite!important;animation-delay:calc(var(--tile-order)*20ms),calc(var(--tile-order)*-.21s)!important}

/* Earned points rise from the pyramid into the top-right balance. */
.points-bubble{position:fixed;z-index:1000;pointer-events:none;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;width:96px;height:80px;border-radius:50%;color:#6e4c1e;background:radial-gradient(circle at 30% 24%,#fffbedf2,#ffe69edd 60%,#e6b967e0);border:2px solid #fff3cde6;box-shadow:inset 0 3px 7px #fff9,0 9px 25px #8b62262b;font-family:var(--display);animation:points-flight 1.9s linear both;will-change:transform,opacity}
.points-bubble strong{font-size:25px}.points-bubble span{font-size:12px}
.top-points.points-arrived{animation:points-received .45s ease-out}
.auto-next-note{font-size:12px;line-height:1.6;margin-top:12px;color:#6a7950}
@keyframes points-flight{
 0%{opacity:0;transform:translate(-50%,-50%) scale(.55);animation-timing-function:ease-out}
 12%{opacity:1;transform:translate(-50%,calc(-50% - 20px)) scale(1.12);animation-timing-function:ease-in-out}
 28%{opacity:1;transform:translate(-50%,calc(-50% - 54px)) scale(1);animation-timing-function:ease-in}
 66%{opacity:1;transform:translate(calc(-50% + var(--flight-x)*.6),calc(-50% + var(--flight-y)*.75 - 24px)) scale(.85);animation-timing-function:ease-out}
 90%{opacity:1;transform:translate(calc(-50% + var(--flight-x)),calc(-50% + var(--flight-y))) scale(.45)}
 100%{opacity:0;transform:translate(calc(-50% + var(--flight-x)),calc(-50% + var(--flight-y))) scale(.1)}
}
@keyframes points-received{0%,100%{transform:scale(1)}40%{transform:scale(1.14);box-shadow:0 0 18px #f2c46ba6}}

/* A diffuse lamp glow behind the interface, with slow and shallow movement. */
.ambient-glow{position:fixed;inset:0;overflow:hidden;pointer-events:none;z-index:0;isolation:isolate}
.ambient-glow:before,.ambient-glow:after{content:'';position:absolute;width:85vmax;height:85vmax;border-radius:50%;will-change:transform;pointer-events:none}
.ambient-glow:before{left:-34vmax;top:-29vmax;background:radial-gradient(circle,#fff1c852 0%,#ffe8ae24 30%,transparent 66%);animation:lamp-warm 48s ease-in-out infinite alternate}
.ambient-glow:after{right:-34vmax;bottom:-29vmax;background:radial-gradient(circle,#cfe4ce38 0%,#e8e3c218 35%,transparent 67%);animation:lamp-mint 64s ease-in-out infinite alternate}
@keyframes lamp-warm{from{transform:translate3d(-2vw,-1vh,0) scale(.98)}to{transform:translate3d(5vw,5vh,0) scale(1.06)}}
@keyframes lamp-mint{from{transform:translate3d(2vw,1vh,0) scale(1.02)}to{transform:translate3d(-4vw,-5vh,0) scale(.96)}}
.language-controls{position:relative;z-index:1;display:flex;align-items:center;justify-content:center;gap:3px;margin:0 auto;padding:12px 16px max(12px,env(safe-area-inset-bottom));color:#7d694f}
.language-controls>span{font-size:15px;margin-right:5px;opacity:.7}
.language-controls button{font:500 13px var(--body);padding:0 10px;min-width:40px;min-height:44px;border:0;border-radius:12px;background:none;box-shadow:none;color:#7d694f;cursor:pointer}
.language-controls button[aria-pressed="true"]{background:#f5e6c4;color:#624b35;font-weight:700}
.language-controls button:focus-visible{outline:2px solid #618b70;outline-offset:2px}
.mode-tabs button{overflow-wrap:anywhere}.actions .primary{min-width:0}.level-dock{flex-wrap:wrap;row-gap:8px}.info-dialog,.menu-dialog,.settings-dialog{overflow-wrap:break-word}
@media(prefers-reduced-motion:reduce){.ambient-glow:before,.ambient-glow:after{animation:none;will-change:auto}}
.menu-dialog{width:min(420px,calc(100vw - 32px));padding:28px 22px;text-align:left}
.menu-dialog h2{margin:0 0 6px;color:#624b35}.menu-dialog>p{font-size:14px;color:#897152}
.menu-tabs{margin-top:22px;display:grid;gap:9px}.menu-tabs details,.name-edit{border:1px solid #d9c6a1;border-radius:14px;background:#f5e7c9;overflow:hidden}
.menu-tabs summary,.name-edit summary{list-style:none;cursor:pointer;padding:16px;font-size:15px;font-weight:600;display:flex;justify-content:space-between;align-items:center;min-height:48px;box-sizing:border-box;color:#624b35}
.menu-tabs summary::-webkit-details-marker,.name-edit summary::-webkit-details-marker{display:none}
.menu-tabs summary:after,.name-edit summary:after{content:'+';font-size:20px;color:#8b7454}.menu-tabs details[open] summary:after,.name-edit[open] summary:after{content:'−'}
.menu-tabs details[open]{background:#fbf1dc}.menu-panel{padding:0 16px 16px}.menu-panel p{font-size:14px;line-height:1.7;margin:0 0 12px}.menu-panel button{width:100%;min-height:44px}
.menu-dialog .primary,.time-result .primary,.settings-dialog .primary{background:#ad815c;color:#fff9ed;box-shadow:0 3px 0 #886446}
.menu-dialog .secondary,.time-result .secondary,.settings-dialog .secondary,.settings-dialog .mode-tabs button,.settings-dialog .difficulty-btn{background:#f3e2b9;color:#725937;border:1px solid #d5bd91;box-shadow:none}
.settings-dialog .mode-tabs button.active,.settings-dialog .difficulty-btn.active{background:#dce8d3;color:#3c6249;border-color:#8ba17b}
.name-edit{text-align:left;margin-top:20px}.name-edit .player-name-label{margin:0 16px 7px}.name-edit .player-name{width:calc(100% - 32px);margin:0 16px 16px}.name-edit summary{font-size:13px;font-weight:400}
.challenge-clock{display:flex;justify-content:space-between;max-width:290px;margin:0 auto 16px;padding:10px 16px;border-radius:18px;background:#f6df9a;color:#715c39;font-size:14px}.challenge-clock strong{font-variant-numeric:tabular-nums;font-size:18px}
.time-result button{display:block;width:100%;margin-top:12px;min-height:46px}.time-result p{line-height:1.7}
.menu-tabs summary:focus-visible,.name-edit summary:focus-visible{outline:3px solid #618b70;outline-offset:-4px}