@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Space+Grotesk:wght@400;500;600;700&display=swap');
:root{--ink:#19374a;--muted:#7a8e95;--paper:#f4f7f2;--teal:#397d80;--line:#dce5df;--dark:#142d43;--font:'DM Sans',Arial,sans-serif;--display:'Space Grotesk',Arial,sans-serif}
*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--font);-webkit-tap-highlight-color:transparent}button,a{touch-action:manipulation}button{font:inherit;cursor:pointer;color:inherit}button:focus-visible,a:focus-visible,canvas:focus-visible{outline:3px solid #55b4b7;outline-offset:4px}button:disabled{cursor:default;opacity:.4}button{transition:background .15s,transform .15s}button:active:not(:disabled){transform:translateY(1px)}[hidden]{display:none!important}
.site-header{height:88px;max-width:1200px;margin:auto;padding:0 44px;display:flex;align-items:center;border-bottom:1px solid var(--line);gap:20px}.brand{display:flex;gap:12px;align-items:center;color:var(--ink);text-decoration:none;font-family:var(--display);font-weight:700;letter-spacing:1.5px;font-size:15px}.brand svg{height:30px;width:30px;stroke:var(--teal);stroke-width:1.6;fill:none}.brand-light{font-weight:400;margin-left:5px}.edition{margin-left:auto;font-size:9px;font-weight:600;letter-spacing:1.7px;color:var(--muted);display:flex;align-items:center;gap:8px}.status-dot{width:5px;height:5px;background:#77a893;border-radius:50%}.icon-button{border:1px solid #cad8d2;background:none;width:28px;height:28px;border-radius:50%;font-weight:600;font-family:var(--display)}main{max-width:1200px;margin:auto;padding:42px 44px 0}.intro{display:flex;align-items:flex-end;justify-content:space-between;margin-bottom:30px}.eyebrow{font-size:10px;font-weight:700;letter-spacing:2px;margin:0 0 13px;color:var(--teal)}.eyebrow span{color:#adbab6;padding:0 8px}h1{font-family:var(--display);font-size:60px;line-height:1.02;letter-spacing:-3px;margin:0;font-weight:600}h1>span{color:#63a3a3}.subtitle{font-size:14px;color:#7a8d94;margin:15px 0 0}.intro-note{display:flex;align-items:center;gap:13px;font-size:11px;color:var(--muted);line-height:1.8;padding:0 0 3px}.intro-note strong{font-weight:500;color:var(--ink)}.little-snowflake{font-size:38px;color:#88aaa7;font-weight:400}
.play-layout{display:grid;grid-template-columns:minmax(0,1fr) 292px;gap:40px;align-items:start}.console{background:var(--dark);border:1px solid #254052;border-radius:15px;box-shadow:0 12px 30px #19374a0c,0 3px 0 #bdd0cb;overflow:hidden}.screen-bar{height:47px;display:flex;align-items:center;justify-content:space-between;padding:0 21px;color:#a9c2ce;font-family:var(--display);font-size:10px;letter-spacing:1.3px}.screen-bar>span{display:flex;align-items:center;gap:8px}.live-dot{width:5px;height:5px;border-radius:50%;background:#aed5c5}.screen-bar button{display:flex;align-items:center;gap:6px;font-size:10px;background:#244157;border:1px solid #355269;border-radius:5px;color:#d7e6e4;padding:7px 10px;letter-spacing:0}.screen-bar button:hover{background:#30516a}.screen-bar svg{width:13px;height:13px;stroke:currentColor;stroke-width:1.3;fill:none}.screen{position:relative;margin:0 13px;background:#81cddf;border:3px solid #0b2032;border-radius:4px;overflow:hidden;touch-action:none}.screen canvas{display:block;width:100%;height:auto;image-rendering:pixelated;image-rendering:crisp-edges;touch-action:none;user-select:none;outline-offset:-4px}.dialogue{margin:12px 16px 0;min-height:56px;display:flex;align-items:center;gap:12px;color:#e7f0e7;background:#1b354b;border:1px solid #345064;border-radius:5px;padding:10px 15px;font-size:12px;line-height:1.6}.dialogue p{margin:0}.dialogue-arrow{color:#9fc7bd;font-size:17px}.console-bottom{display:flex;align-items:center;justify-content:space-between;padding:15px 20px 17px}.console-label{color:#5e7d91;font-size:8px;letter-spacing:2px}.console-label span{padding:0 6px;color:#8399a7}.sound-button{border:0;padding:0;background:none;color:#94aebc;display:flex;align-items:center;gap:6px;font-size:10px}.sound-button svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.3}
.start-overlay,.win-overlay{position:absolute;inset:0;display:flex;align-items:flex-end;justify-content:center;padding:18px;background:linear-gradient(transparent 8%,#112d4a25 45%,#132b4966)}.start-dialog{width:100%;max-width:390px;background:#f4f8ec;border:3px solid #314b5d;outline:2px solid #eaf7e9;box-shadow:4px 4px 0 #102c4844;border-radius:3px;padding:18px 20px}.pixel-label{font-family:monospace;font-size:9px;letter-spacing:1.5px;color:var(--teal);font-weight:700;margin:0 0 8px}.start-dialog h2{font-family:var(--display);font-size:24px;letter-spacing:-.6px;margin:0 0 8px}.start-dialog>p:not(.pixel-label){font-size:12px;line-height:1.7;margin:0 0 15px;color:#677c85}.start-dialog button,.win-card button,.primary-button{border:0;background:#285b67;color:#effbf2;border-radius:4px;padding:10px 14px;font-size:12px;font-weight:600}.start-dialog button{width:100%;text-align:left;display:flex;justify-content:space-between}.start-dialog button:hover,.primary-button:hover{background:#347685}.win-overlay{align-items:center;background:#17385177}.win-card{background:#f3f7ed;border-radius:5px;border:3px solid #36576a;box-shadow:4px 4px 0 #142d4380;padding:28px 30px;text-align:center;max-width:90%}.win-card h2{font-family:var(--display);font-size:29px;letter-spacing:-1px;margin:8px 0}.win-card>p:not(.pixel-label){font-size:12px;color:#718790;margin-bottom:20px}.badge{font-size:48px;color:#559da4;text-shadow:2px 2px #aad6d2;margin-bottom:10px}
.control-panel{padding-top:6px}.progress-head{display:flex;justify-content:space-between;align-items:center}.progress-head .eyebrow{font-size:9px;letter-spacing:1.3px;margin:0}.progress-head>span{font-size:7px;letter-spacing:1px;color:#8b9d9f}.snowball-count{display:flex;align-items:center;gap:10px;padding:19px 0 15px}.snowball-count>span:first-child{font-family:var(--display);font-size:56px;font-weight:500;line-height:1;letter-spacing:-2px}.count-total{font-family:var(--display);font-size:18px;color:#99adaa;padding-top:4px}.count-total small{display:block;font-family:var(--font);font-size:8px;letter-spacing:1px;margin-top:8px;color:#6c838b}.snowball-icon{width:30px;height:30px;margin-left:auto;border-radius:50%;background:linear-gradient(135deg,#fff,#d9e9e2);border:2px solid #bfd6d0;box-shadow:0 4px 0 #dce7de}.progress-track{height:4px;background:#dde8e1;border-radius:3px;overflow:hidden}.progress-track>div{height:100%;width:0;background:#5d9d99;transition:width .35s}.stats{display:flex;justify-content:space-between;padding:19px 0 23px;border-bottom:1px solid var(--line)}.stats>div{display:flex;flex-direction:column;gap:7px}.stats strong{font-family:var(--display);font-weight:500;font-size:17px}.stats span{font-size:7px;letter-spacing:1.3px;color:#91a39f}.controls-area{display:flex;align-items:center;gap:17px;padding:24px 0}.dpad{width:114px;height:114px;flex-shrink:0;display:grid;grid-template:repeat(3,38px)/repeat(3,38px);filter:drop-shadow(0 3px 0 #bfcfc8)}.dpad button,.pad-center{border:0;display:flex;align-items:center;justify-content:center;background:#d6e3db;color:#315360;font-size:13px;touch-action:none;user-select:none}.dpad button:hover{background:#c1d5cc}.dpad button:active{background:#91b6ad;transform:none}.dpad .up{grid-area:1/2;border-radius:6px 6px 0 0}.dpad .left{grid-area:2/1;border-radius:6px 0 0 6px}.dpad .right{grid-area:2/3;border-radius:0 6px 6px 0}.dpad .down{grid-area:3/2;border-radius:0 0 6px 6px}.pad-center{grid-area:2/2;font-size:15px;color:#8fafaa}.controls-note strong{font-size:11px;font-weight:600;display:block;margin-bottom:4px}.controls-note>span{font-size:9px;color:#8a9b9d;line-height:1.6;display:block}.controls-note p{margin:13px 0 7px;display:flex;align-items:center;gap:3px}.controls-note p>span{font-size:8px;color:#91a19e;margin-left:2px}kbd{font-family:var(--font);border:1px solid #d4e1d8;border-bottom:2px solid #c7d6ce;border-radius:3px;font-size:8px;padding:2px 4px;color:#69848a;background:#f8faf5}.controls-note small{font-size:8px;color:#7d9496;display:block}.actions{display:flex;gap:7px}.actions button{flex:1;background:transparent;border:1px solid #cddcd2;border-radius:5px;font-size:10px;padding:10px 5px;display:flex;gap:6px;align-items:center;justify-content:center}.actions button:hover:not(:disabled){background:#e7eee7}.actions button span{font-size:16px}.rules{padding-top:27px;display:flex;flex-direction:column;gap:16px}.rules>div{display:flex;gap:13px;align-items:center}.rules p{margin:0;font-size:11px}.rules strong{display:block;font-weight:500;margin-bottom:4px}.rules p span{display:block;font-size:9px;color:#8a9c9e}.rule-symbol{width:26px;height:26px;display:flex;justify-content:center;align-items:center;border:1px solid #bedbd8;border-radius:4px;color:#558d9c;font-size:17px}.ice-symbol{background:#cde7e6}.snow-symbol{background:#fafff3;color:#c2d9d2}.ramp-symbol{background:#ece8d5;color:#999b7c;border-color:#d4d1bb}footer{display:flex;justify-content:space-between;border-top:1px solid var(--line);padding:23px 0 25px;margin-top:37px;font-size:8px;letter-spacing:1.2px;color:#9caca5}footer>span:last-child{display:flex;gap:9px;align-items:center;color:#7f9692}.footer-line{width:28px;height:1px;background:#c7d6cc}dialog{max-width:450px;width:calc(100% - 36px);border:1px solid #bcd0c5;background:var(--paper);border-radius:12px;padding:32px;color:var(--ink);box-shadow:0 20px 100px #142d4344}dialog::backdrop{background:#142d4388;backdrop-filter:blur(4px)}dialog h2{font-family:var(--display);font-size:28px;letter-spacing:-1px;margin:10px 0 18px}dialog p,dialog li{font-size:12px;line-height:1.8;color:#6d838d}dialog ol{padding-left:18px}dialog li{margin-bottom:10px}dialog strong{color:var(--ink)}.close-dialog{position:absolute;right:15px;top:10px;font-size:25px;border:0;background:none;color:#8aa19c}.help-credit{font-size:10px!important;border-top:1px solid var(--line);padding-top:13px}.help-credit a{color:var(--teal)}.primary-button{margin-top:9px}
@media(min-width:1000px){.console.map-active{max-width:600px}}
@media(max-width:950px){.site-header{padding:0 28px;height:72px}main{padding:30px 28px 0}.play-layout{gap:25px;grid-template-columns:minmax(0,1fr) 250px}h1{font-size:51px}.intro-note{font-size:9px}.controls-area{gap:12px}.dpad{grid-template:repeat(3,33px)/repeat(3,33px);width:99px;height:99px}.start-dialog{padding:13px}.start-dialog h2{font-size:21px}.start-dialog p:not(.pixel-label){font-size:10px}.screen-bar{padding:0 13px}.control-panel{padding-top:0}}
@media(max-width:730px){.site-header{height:63px;padding:0 20px;gap:12px}.brand{font-size:12px;letter-spacing:1px;gap:9px}.brand svg{width:26px;height:26px}.edition{font-size:7px;letter-spacing:1px}.icon-button{width:24px;height:24px;font-size:12px}main{padding:27px 18px 0}.intro{margin-bottom:23px}.eyebrow{font-size:8px;margin-bottom:11px}h1{font-size:43px;letter-spacing:-2px}.subtitle{font-size:11px;margin-top:11px}.intro-note{display:none}.play-layout{display:flex;flex-direction:column;gap:22px}.console{width:100%;border-radius:11px}.screen-bar{height:39px;font-size:8px;padding:0 14px}.screen-bar button{font-size:9px;padding:5px 8px}.screen{margin:0 8px;border-width:2px}.dialogue{margin:9px 10px 0;padding:8px 11px;min-height:47px;font-size:10px;gap:8px}.console-bottom{padding:12px 14px}.console-label{font-size:7px;letter-spacing:1.5px}.sound-button{font-size:9px}.start-overlay{padding:14px}.start-dialog{max-width:350px;padding:13px 16px}.start-dialog h2{font-size:22px}.start-dialog>p:not(.pixel-label){font-size:11px;line-height:1.6;margin-bottom:11px}.start-dialog button{padding:9px 12px;font-size:11px}.control-panel{width:100%;display:grid;grid-template-columns:1fr 1fr;gap:0 17px}.progress-head{grid-column:1/-1}.progress-head .eyebrow{font-size:8px}.progress-head>span{font-size:7px}.snowball-count{grid-column:1;padding:16px 0 9px}.snowball-count>span:first-child{font-size:43px}.count-total{font-size:15px}.count-total small{font-size:6px;letter-spacing:.8px;max-width:70px;line-height:1.5}.snowball-icon{width:22px;height:22px;margin-left:auto}.progress-track{grid-column:1;grid-row:3}.stats{grid-column:1;grid-row:4;border-bottom:0;padding:17px 0 8px}.stats strong{font-size:14px}.stats span{font-size:6px;letter-spacing:.6px}.controls-area{grid-column:2;grid-row:2/5;padding:16px 0 2px;justify-content:center}.dpad{width:123px;height:123px;grid-template:repeat(3,41px)/repeat(3,41px)}.controls-note{display:none}.actions{grid-column:1/-1;margin-top:17px;gap:10px}.actions button{font-size:11px;padding:11px 5px}.rules{grid-column:1/-1;border-top:1px solid var(--line);margin-top:22px;padding-top:19px;gap:15px}.rules p{font-size:11px}.rules p span{font-size:10px}footer{font-size:6px;letter-spacing:.8px;margin-top:25px;padding-bottom:calc(25px + env(safe-area-inset-bottom))}.win-card{padding:19px}.win-card h2{font-size:25px}.badge{font-size:32px}}
.queued-input{margin-left:auto;margin-right:10px;color:#e3eab9;font-size:8px;letter-spacing:1px}.return-button{width:100%;display:flex;align-items:center;justify-content:center;gap:7px;margin-top:10px;border:0;border-radius:5px;background:#e6eee6;padding:9px 6px;color:#466c73;font-size:10px}.return-button>span{font-size:16px}.return-button small{font-size:8px;color:#89a09a;margin-left:auto}.return-button:hover{background:#dce8de}.dpad button.is-queued{background:#accbc2;box-shadow:inset 0 0 0 2px #6a9e96}.dpad button.is-active{color:#f1faf0;background:#508681}.progress-track>div{transition:width .2s}
@media(max-width:730px){.return-button{grid-column:1/-1;padding:11px 9px;font-size:11px}.return-button small{font-size:9px}.queued-input{font-size:7px;margin-right:5px}.dpad{width:138px;height:138px;grid-template:repeat(3,46px)/repeat(3,46px)}}
@media(prefers-reduced-motion:reduce){*{transition:none!important}dialog::backdrop{backdrop-filter:none}}
/* Edition picker and a compact, thumb-friendly playing surface. */
.level-bar{display:flex;align-items:center;gap:20px;padding:14px 0 18px;margin-bottom:8px;border-top:1px solid var(--line)}.level-choice{display:flex;flex-direction:column;gap:6px}.level-choice label{font-size:7px;letter-spacing:1.4px;color:var(--muted);font-weight:700}.level-choice select{font:600 13px var(--display);color:var(--ink);background:#e9efe7;border:1px solid #c7d9cf;border-radius:6px;padding:9px 32px 9px 11px;max-width:230px;min-height:40px}.level-detail{display:flex;flex-direction:column;gap:7px;font-size:10px;color:var(--muted)}.level-detail strong{font-size:8px;letter-spacing:1px;font-weight:500;color:var(--teal)}#playModeButton{margin-left:auto;background:var(--dark);color:#e1efe8;border:0;border-radius:6px;min-height:40px;padding:10px 13px;font-size:11px;white-space:nowrap}.win-card button{display:block;margin:0 auto}.win-card .replay-button{margin-top:10px;background:none;color:#5f7f83;padding:7px;font-size:10px}.dpad{touch-action:none;user-select:none;-webkit-user-select:none}.dpad button{min-width:38px;min-height:38px}.level-choice select:focus-visible{outline:3px solid #55b4b7;outline-offset:2px}
@media(max-width:730px){
 .site-header{height:49px}main{padding:14px 14px 0}.intro{margin-bottom:13px}.intro .eyebrow{display:none}h1{font-size:34px}.subtitle{font-size:10px;margin-top:7px}.level-bar{gap:10px;display:grid;grid-template-columns:minmax(0,1fr) auto;padding:10px 0 12px;margin-bottom:0}.level-choice label{font-size:6px}.level-choice select{font-size:12px;max-width:100%;width:100%;padding:8px 24px 8px 9px;min-height:36px}.level-detail{grid-column:1/-1;grid-row:2;flex-direction:row;justify-content:space-between;gap:5px;font-size:8px}.level-detail strong{font-size:7px;white-space:nowrap}#playModeButton{font-size:10px;min-height:36px;padding:9px}.play-layout{gap:12px}.screen{aspect-ratio:4/3;max-height:42svh}.screen canvas{height:100%;object-fit:contain}.map-active .screen{aspect-ratio:336/368;max-height:55svh}.screen-bar{height:34px}.console-bottom{padding:9px 12px}.dialogue{min-height:42px;line-height:1.4}.controls-area{padding:8px 0}.snowball-count{padding:8px 0}.progress-head{padding-top:2px}.stats{padding:12px 0 5px}.actions{margin-top:10px}.actions button{min-height:44px}.return-button{min-height:42px}.dpad{width:144px;height:144px;grid-template:repeat(3,48px)/repeat(3,48px)}.start-dialog h2{font-size:20px}.start-dialog>p:not(.pixel-label){font-size:10px}.start-dialog{padding:10px 13px}.start-dialog .pixel-label{margin-bottom:5px}
}
/* Play mode uses the live viewport, including rotating phones and safe areas. */
body.play-mode{position:fixed;inset:0;overflow:hidden;overscroll-behavior:none}body.play-mode .site-header,body.play-mode .intro,body.play-mode footer,body.play-mode .rules{display:none}body.play-mode main{height:100dvh;max-width:1300px;padding:max(10px,env(safe-area-inset-top)) max(12px,env(safe-area-inset-right)) max(10px,env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left));display:flex;flex-direction:column}body.play-mode .level-bar{border:0;flex-shrink:0;padding:0 0 9px;margin:0}body.play-mode .level-choice label,body.play-mode .level-detail{display:none}body.play-mode .play-layout{flex:1;min-height:0}body.play-mode .console{height:100%;min-height:0;display:flex;flex-direction:column}body.play-mode .screen{flex:1;min-height:0;aspect-ratio:auto;max-height:none;display:flex;align-items:center;justify-content:center;background:#102c40}body.play-mode .screen canvas{width:100%;height:100%;object-fit:contain}body.play-mode .screen-bar,body.play-mode .dialogue,body.play-mode .console-bottom{flex-shrink:0}body.play-mode .control-panel{align-self:center}body.play-mode .controls-note{display:none}body.play-mode .controls-area{justify-content:center}body.play-mode .dpad{width:168px;height:168px;grid-template:repeat(3,56px)/repeat(3,56px)}
@media(max-width:730px) and (orientation:portrait){
 body.play-mode .play-layout{gap:9px}body.play-mode .console{flex:1;width:100%}body.play-mode .control-panel{flex:0 0 auto;display:grid;grid-template-columns:minmax(0,1fr) 150px;gap:0 10px}body.play-mode .controls-area{grid-column:2;grid-row:1/5;padding:0}body.play-mode .dpad{width:150px;height:150px;grid-template:repeat(3,50px)/repeat(3,50px)}body.play-mode .progress-head{grid-column:1}body.play-mode .progress-head .eyebrow{display:none}body.play-mode .progress-head>span{font-size:6px;letter-spacing:.5px}body.play-mode .snowball-count{grid-column:1;grid-row:2;padding:5px 0}body.play-mode .snowball-count>span:first-child{font-size:32px}body.play-mode .count-total{font-size:12px}body.play-mode .count-total small{font-size:5px;margin-top:3px}body.play-mode .snowball-icon{display:none}body.play-mode .progress-track{grid-column:1;grid-row:3}body.play-mode .stats{grid-column:1;grid-row:4;padding:6px 0 2px}body.play-mode .stats strong{font-size:11px}body.play-mode .stats span{font-size:5px}body.play-mode .actions{grid-column:1/-1;margin-top:7px;gap:7px}body.play-mode .actions button{font-size:10px;padding:5px;min-height:38px}body.play-mode .return-button{margin-top:5px;padding:5px 8px;min-height:30px;font-size:9px}body.play-mode .return-button small{font-size:7px}body.play-mode .console-bottom{display:none}body.play-mode .dialogue{min-height:36px;margin-bottom:8px;font-size:9px;padding:7px}
}
@media(orientation:landscape) and (max-height:540px){
 body.play-mode .level-bar{display:flex;padding-bottom:6px}body.play-mode .level-choice select{min-height:30px;padding-top:5px;padding-bottom:5px;font-size:10px}body.play-mode #playModeButton{min-height:30px;padding:6px 10px}body.play-mode .play-layout{display:grid;grid-template-columns:minmax(0,1fr) 200px;gap:12px}body.play-mode .control-panel{display:grid;grid-template-columns:1fr 1fr;gap:4px 8px;width:100%}body.play-mode .progress-head,body.play-mode .stats,body.play-mode .snowball-icon,body.play-mode .progress-track{display:none}body.play-mode .snowball-count{grid-column:1/-1;grid-row:1;justify-content:center;padding:0}body.play-mode .snowball-count>span:first-child{font-size:23px}body.play-mode .count-total{font-size:11px;padding:0}body.play-mode .count-total small{font-size:5px;margin-top:2px;max-width:none}body.play-mode .controls-area{grid-column:1/-1;grid-row:2;padding:4px 0}body.play-mode .dpad{width:132px;height:132px;grid-template:repeat(3,44px)/repeat(3,44px)}body.play-mode .actions{grid-column:1/-1;margin:0;gap:4px}body.play-mode .actions button{min-height:32px;padding:4px 2px;font-size:9px;gap:2px}body.play-mode .return-button{grid-column:1/-1;min-height:28px;font-size:8px;margin-top:0;padding:3px}body.play-mode .return-button small{display:none}body.play-mode .console-bottom{display:none}body.play-mode .screen-bar{height:29px;font-size:8px}body.play-mode .dialogue{min-height:32px;font-size:9px;margin-bottom:8px;padding:5px 8px}body.play-mode .start-overlay{align-items:center;padding:7px}body.play-mode .start-dialog{padding:8px 12px;max-width:320px}body.play-mode .start-dialog h2{font-size:16px}body.play-mode .start-dialog p:not(.pixel-label){font-size:9px;line-height:1.4;margin-bottom:7px}body.play-mode .start-dialog .pixel-label{display:none}body.play-mode .start-dialog button{padding:6px 10px}body.play-mode .win-card{padding:10px}body.play-mode .badge{display:none}body.play-mode .win-card h2{font-size:20px}body.play-mode .win-card>p:not(.pixel-label){margin:6px 0 10px}
}
@media(max-width:730px) and (orientation:portrait){body.play-mode .win-card{padding:12px 16px}body.play-mode .win-card .badge{display:none}body.play-mode .win-card h2{font-size:22px;margin:5px 0}body.play-mode .win-card>p:not(.pixel-label){font-size:10px;margin:7px 0 10px}body.play-mode .win-card button{padding:7px 11px;font-size:10px}body.play-mode .win-card .replay-button{margin-top:5px;padding:4px;font-size:9px}}
.level-detail{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:5px 16px}.level-detail #levelDifficulty{grid-column:1;grid-row:1;color:var(--teal);font-size:8px;font-weight:700;letter-spacing:.8px}.level-detail #levelNote{grid-column:1;grid-row:2;line-height:1.5}.level-detail #editionProgress{grid-column:2;grid-row:1/3;align-self:center;white-space:nowrap}
@media(max-width:730px){.level-detail{display:grid;gap:4px 7px}.level-detail #levelDifficulty{font-size:7px}.level-detail #levelNote{grid-column:1/-1;font-size:8px}.level-detail #editionProgress{grid-row:1}.level-choice select{font-size:11px}}
body.play-mode .level-detail{display:none}
.mode-switch{display:flex;gap:5px;background:#e8eee6;border:1px solid #d7e2d8;border-radius:8px;padding:4px;width:max-content;margin:0 0 15px}.mode-switch button{background:none;border:0;border-radius:5px;padding:10px 17px;font-size:11px;color:#77908d;min-height:40px}.mode-switch button[aria-pressed=true]{background:var(--dark);color:#edf7ed;box-shadow:0 2px 5px #18364616}.mode-switch button span{padding-left:5px}.generator-settings-button{background:#e3ece3;color:var(--teal);border:1px solid #c3d7ca;border-radius:6px;min-height:40px;padding:9px 13px;font-size:11px;margin-right:auto}.generator-dialog{max-width:490px;max-height:90dvh;overflow:auto}.generator-dialog>p:not(.eyebrow){margin-bottom:22px}.generator-fields{display:grid;grid-template-columns:1fr 1fr;gap:16px}.generator-fields label,.seed-label,.randomness-label{font-size:11px;font-weight:600;color:var(--ink)}.generator-fields input,#generatorSeed{display:block;width:100%;background:#fffdf8;border:1px solid #c8dbd0;border-radius:6px;padding:11px 12px;color:var(--ink);font:500 16px var(--display);margin:8px 0 6px}.generator-fields small{font-size:9px;color:#879b94;font-weight:400;display:block;line-height:1.5}.randomness-label{display:flex;justify-content:space-between;align-items:center;margin-top:22px}.randomness-label strong{font-size:11px;color:var(--teal)}#generatorRandomness{width:100%;margin:13px 0 7px;accent-color:var(--teal);min-height:28px}.range-note{display:flex;justify-content:space-between;font-size:8px;color:#8ba09b}.seed-label{display:flex;gap:8px;margin-top:21px}.seed-label span{font-weight:400;font-size:9px;color:#93a79e}#generatorSeed{font-size:13px;min-height:44px}.seed-button{font-size:9px;background:none;border:0;padding:7px 0;color:var(--teal)}.generator-status{font-size:10px!important;min-height:44px;line-height:1.6!important;background:#e8eee5;border-radius:5px;padding:10px 12px;color:#608174!important;margin-top:12px}.generator-actions{display:flex;align-items:center;gap:12px}.generator-actions .primary-button{flex:1;margin:0;min-height:44px}.generator-actions>button:last-child{border:1px solid #ccdbcf;border-radius:5px;background:none;padding:10px 13px;font-size:11px;min-height:44px}.generator-dialog input:focus-visible{outline:2px solid #65aba0;outline-offset:2px}
@media(max-width:730px){.mode-switch{width:100%;margin-bottom:10px}.mode-switch button{flex:1;padding:7px 3px;font-size:9px;min-height:35px}.mode-switch button span{padding-left:2px}.generator-dialog{padding:27px 22px}.generator-dialog h2{font-size:25px;margin:10px 0}.generator-dialog>p:not(.eyebrow){font-size:11px;margin-bottom:18px}.generator-settings-button{font-size:10px;min-height:36px;padding:7px 10px}.level-bar:has(.generator-settings-button:not([hidden])){grid-template-columns:1fr auto}}
body.play-mode .mode-switch{display:none}
#levelNote{overflow-wrap:anywhere;min-width:0}#generatorSeed{font-size:16px}
/* Align actions with the dropdown beneath its label in both flex and grid layouts. */
#playModeButton,.generator-settings-button{align-self:end}