@font-face {
  font-family: 'Barlow Condensed';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(./assets/fonts/barlow-condensed-600.ttf) format('truetype');
}
@font-face {
  font-family: 'Barlow Condensed';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(./assets/fonts/barlow-condensed-700.ttf) format('truetype');
}
@font-face {
  font-family: 'Barlow Condensed';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url(./assets/fonts/barlow-condensed-800.ttf) format('truetype');
}
@font-face {
  font-family: 'Barlow Condensed';
  font-style: normal;
  font-weight: 900;
  font-display: swap;
  src: url(./assets/fonts/barlow-condensed-900.ttf) format('truetype');
}
@font-face {
  font-family: 'DM Sans';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(./assets/fonts/dm-sans-400.ttf) format('truetype');
}
@font-face {
  font-family: 'DM Sans';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(./assets/fonts/dm-sans-500.ttf) format('truetype');
}
@font-face {
  font-family: 'DM Sans';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(./assets/fonts/dm-sans-600.ttf) format('truetype');
}
@font-face {
  font-family: 'DM Sans';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(./assets/fonts/dm-sans-700.ttf) format('truetype');
}

:root{--blue:#0d5d8b;--yellow:#ffbf29;--ink:#123c51;--cream:#f6f4ed;--muted:#647a85;--line:#dce3e4;font-family:'DM Sans',sans-serif;color:var(--ink);background:var(--cream)}*{box-sizing:border-box}body{margin:0}button,select,input{font:inherit}button,a,select,input{ -webkit-tap-highlight-color:transparent}button{cursor:pointer}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid var(--yellow);outline-offset:3px}button{border:0;color:inherit;background:none}button:disabled{opacity:.4;cursor:not-allowed}[hidden]{display:none!important}header{height:92px;display:flex;align-items:center;gap:24px;padding:12px 32px;border-bottom:1px solid var(--line);background:#fffdf7}.brand{display:flex;gap:12px;align-items:center;text-decoration:none;color:var(--blue)}.brand img{width:62px;height:62px;object-fit:contain}.brand span{font-family:'Barlow Condensed',sans-serif;font-size:20px;line-height:1;letter-spacing:1px}.brand b{font-size:24px}.lab{font-family:'Barlow Condensed',sans-serif;font-size:32px;font-weight:800;letter-spacing:1px;margin-left:auto;margin-right:auto}.lab i{font-style:normal;color:var(--blue)}.lab span{font-family:'DM Sans',sans-serif;font-size:12px;letter-spacing:0;margin-left:20px;color:var(--muted);font-weight:400}.icon-button{font-size:19px}.icon-button span{font-size:13px;margin-left:6px}.modes{display:flex;gap:8px;padding:0 32px;height:58px;align-items:stretch;border-bottom:1px solid var(--line);background:#fffdf7}.modes button{display:flex;align-items:center;gap:10px;padding:0 22px;font-family:'Barlow Condensed',sans-serif;font-size:14px;font-weight:700;color:var(--muted);border-bottom:3px solid transparent}.modes button span{font-family:'DM Sans',sans-serif;font-size:14px;font-weight:600}.modes button.active{border-color:var(--blue);color:var(--blue);background:#eaf0ef}.mode-caption{margin-left:auto;align-self:center;letter-spacing:1.8px;font-size:10px;font-weight:700}main{display:grid;grid-template-columns:276px minmax(0,1fr);height:calc(100dvh - 150px);min-height:630px}aside{padding:27px 24px 20px;border-right:1px solid var(--line);overflow:auto;display:flex;flex-direction:column}.section-title{font-size:10px;letter-spacing:1.8px;font-weight:700;display:flex;justify-content:space-between;align-items:center}.dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--yellow)}h1{font-family:'Barlow Condensed',sans-serif;font-size:66px;font-weight:800;line-height:.86;letter-spacing:-.5px;margin:22px 0 16px}h1 em{color:var(--blue);font-style:normal}.intro{font-size:12px;line-height:1.7;color:var(--muted);margin:0 0 22px}.boards{display:grid;gap:7px}.board-choice{display:flex;align-items:center;gap:15px;padding:13px 14px;text-align:left;border:1px solid var(--line);border-radius:10px;background:#fffdf9;transition:background .2s,transform .2s}.board-choice:hover{transform:translateX(3px)}.board-choice.active{background:var(--blue);color:white;border-color:var(--blue)}.board-choice b{display:block;font-size:13px}.board-choice small{display:block;font-size:10px;opacity:.7;margin-top:4px}.choice-check{margin-left:auto;font-size:17px;opacity:.55}.active .choice-check{color:var(--yellow);opacity:1}.board-silhouette{width:17px;height:38px;border-radius:9px;background:var(--yellow);position:relative;transform:rotate(22deg);flex-shrink:0}.board-silhouette:after{content:'';position:absolute;left:-3px;right:-3px;top:7px;height:3px;background:var(--ink);box-shadow:0 21px var(--ink)}.board-silhouette.long{height:46px;width:14px;clip-path:polygon(35% 0,65% 0,100% 18%,100% 78%,65% 100%,35% 100%,0 78%,0 18%)}.board-silhouette.cruiser{border-radius:60% 60% 25% 25%;height:33px}.board-silhouette.surf{width:20px;border-radius:55% 55% 30% 30%}.board-note{font-size:11px;line-height:1.6;padding:13px 2px;color:var(--muted);min-height:55px}.inspect{border-bottom:1px solid var(--line);border-top:1px solid var(--line);padding:13px 0;text-align:left;font-size:12px;font-weight:600}.inspect span{display:block;font-size:10px;color:var(--muted);font-weight:400;margin:5px 0 0 16px}.inspect.active{color:var(--blue)}.setup-row{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:16px;font-size:11px}.setup-row select{max-width:175px;font-size:12px;background:transparent;border:0;color:var(--ink);padding:5px}.toggle{background:#dbe2e3;padding:5px 13px;border-radius:6px;font-size:11px}.toggle[aria-pressed=true]{background:var(--yellow);color:#123c51}.aside-footer{margin-top:auto;padding-top:24px;font-size:9px;letter-spacing:1px;font-weight:700}.aside-footer>span{color:var(--blue);margin-right:4px}.aside-footer small{display:block;color:var(--muted);font-size:9px;font-weight:400;letter-spacing:0;margin-top:8px}.simulation{padding:22px 24px 0;display:flex;flex-direction:column;min-width:0;overflow:auto}.viewport{position:relative;border-radius:15px;overflow:hidden;background:#d3e6e7;flex:1;min-height:390px;isolation:isolate}#world{width:100%;height:100%;display:block;position:absolute;inset:0;touch-action:none}.scene-top{position:absolute;top:27px;left:28px;right:26px;display:flex;justify-content:space-between;gap:15px;pointer-events:none}.scene-label{font-size:9px;letter-spacing:2px;font-weight:700;color:#346575}.scene-top h2{font-family:'Barlow Condensed',sans-serif;font-size:36px;font-weight:800;letter-spacing:-.4px;margin:4px 0;color:#123c51}.live-tag{font-size:10px;align-self:flex-start;border-radius:20px;padding:9px 12px;background:#ffffffbd;display:flex;gap:7px;align-items:center}.live-tag>span:first-child{width:5px;height:5px;background:#329280;border-radius:50%}.camera-bar{position:absolute;right:22px;top:100px;display:flex;background:#ffffffde;border:1px solid #ffffff77;padding:4px;border-radius:8px;gap:3px}.camera-bar button{font-size:11px;padding:7px 11px;border-radius:5px}.camera-bar button.active{background:var(--blue);color:white}.start-card{position:absolute;top:43%;left:8%;transform:translateY(-30%);padding:27px;background:#fffdf4f2;border:1px solid white;border-radius:13px;box-shadow:0 16px 45px #16425718;max-width:295px}.eyebrow{font-size:9px;font-weight:700;letter-spacing:1.6px;color:var(--blue)}.start-card h3{font-family:'Barlow Condensed',sans-serif;font-size:38px;margin:9px 0}.start-card p{font-size:12px;line-height:1.7;color:var(--muted)}.start-card button{background:var(--yellow);color:#123c51;width:100%;border-radius:6px;padding:13px 17px;font-weight:700;font-size:12px;display:flex;justify-content:space-between}.start-card small{display:block;font-size:9px;color:var(--muted);margin-top:12px}.coach{position:absolute;bottom:83px;left:25px;display:flex;align-items:center;gap:12px;background:#fffdf6ee;padding:13px 17px;border-radius:9px;max-width:390px;box-shadow:0 8px 20px #123c5110;pointer-events:none}.coach-icon{background:var(--yellow);color:#123c51;border-radius:50%;width:31px;height:31px;display:flex;align-items:center;justify-content:center;flex-shrink:0}.coach div>span{font-size:8px;letter-spacing:1.4px;font-weight:700;color:var(--blue)}.coach p{font-size:11px;line-height:1.6;margin:4px 0 0}.telemetry{position:absolute;bottom:24px;left:27px;display:flex;gap:31px}.telemetry div{display:flex;align-items:baseline;gap:6px}.telemetry b{font-family:'Barlow Condensed',sans-serif;font-weight:700;font-size:31px;color:#123c51;font-variant-numeric:tabular-nums}.telemetry span{font-size:8px;letter-spacing:1px;color:#3c6472;font-weight:700}.scene-credit{position:absolute;bottom:26px;right:22px;color:#446674;font-size:8px;letter-spacing:1.2px}.scene-credit span{display:block;font-size:8px;letter-spacing:0;margin-top:5px}.control-deck{display:flex;gap:12px;margin:13px 0 0;align-items:stretch}.controls{display:flex;gap:6px;flex:1}.controls button{border:1px solid var(--line);background:#fffdf9;border-radius:8px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;padding:11px 5px;flex:1;min-width:0;touch-action:none;user-select:none;-webkit-user-select:none}.controls button.held{background:var(--yellow);border-color:var(--yellow)}kbd{font-family:'DM Sans',sans-serif;font-size:10px;font-weight:700;color:var(--blue)}.controls button span{font-size:10px;color:var(--muted)}.transport{display:flex;gap:5px}.transport button{border:1px solid var(--line);background:#fffdf9;border-radius:8px;width:39px;font-size:19px}.bottom-strip{display:flex;justify-content:space-between;gap:10px;align-items:center;min-height:45px;font-size:9px;color:var(--muted)}.bottom-strip .dot{width:5px;height:5px;margin-right:5px}.bottom-strip button{font-size:9px;text-align:right;color:var(--blue)}.pump-hud{position:absolute;right:24px;bottom:90px;background:#123c51e8;color:white;padding:16px;border-radius:10px;width:265px}.pump-hud>span{font-family:'Barlow Condensed',sans-serif;font-size:18px;font-weight:700;letter-spacing:.6px}.timing-track{height:24px;position:relative;margin:10px 0;background:linear-gradient(90deg,#829aa0 0 48%,var(--yellow) 48% 76%,#829aa0 76%);border-radius:4px;overflow:hidden}.timing-track:before{content:'KUPPE';position:absolute;left:8px;top:7px;font-size:7px}.timing-track:after{content:'BERGAB';position:absolute;left:52%;top:7px;font-size:7px;color:#123c51}#phase-dot{position:absolute;left:0;top:0;height:24px;width:4px;background:#fff;box-shadow:0 0 7px white}.pump-hud small{font-size:10px;line-height:1.6;display:block;color:#e2edf0}.lesson-list{margin-top:19px;border-top:1px solid var(--line);padding-top:12px;display:grid;gap:6px}.lesson-list button{font-size:11px;text-align:left;padding:10px;border-radius:6px;display:flex;gap:8px;align-items:center}.lesson-list button.active{background:var(--blue);color:white}.lesson-list button>span:last-child{margin-left:auto;color:var(--yellow)}.lesson-deck{margin-top:13px;background:#fffdf9;border:1px solid var(--line);padding:17px 20px;border-radius:10px;display:grid;grid-template-columns:1fr 1.2fr;gap:12px 20px}.lesson-deck h3{font-family:'Barlow Condensed',sans-serif;font-size:24px;margin:4px 0}.lesson-deck p{font-size:11px;line-height:1.6;margin:0;color:var(--muted)}.steps{display:flex;flex-direction:column;gap:4px}.steps button{text-align:left;font-size:11px;border-radius:5px;padding:7px 9px;display:flex;gap:9px}.steps button span{color:var(--muted);font-size:9px}.steps button.active{background:#fff0c9;color:var(--ink)}.lesson-playback{grid-column:1/-1;display:flex;align-items:center;gap:15px;border-top:1px solid var(--line);padding-top:10px}.lesson-playback button{font-size:11px;padding:8px 12px;border-radius:5px;background:var(--blue);color:white}.lesson-playback button:last-child{margin-left:auto;background:var(--yellow);color:#123c51}.lesson-playback label,.lesson-playback select{font-size:11px}.lesson-playback select{border:0;background:transparent}dialog{color:var(--ink);background:#fffdf7;max-width:570px;width:calc(100% - 32px);max-height:85dvh;border:0;border-radius:15px;padding:32px;box-shadow:0 20px 100px #00152270}dialog::backdrop{background:#072e43a6;backdrop-filter:blur(6px)}dialog h2{font-family:'Barlow Condensed',sans-serif;font-size:36px;margin:12px 0}dialog h3{font-size:14px;margin:24px 0 8px}dialog p{font-size:13px;line-height:1.8;color:var(--muted)}dialog a{display:block;font-size:12px;color:var(--blue);margin:13px 0}dialog small{display:block;color:var(--muted);font-size:10px;margin-top:20px}.close{position:absolute;right:18px;top:13px;font-size:28px}.colour-input{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);padding:13px 0;font-size:13px}.colour-input input{border:0;background:none;width:60px;height:35px}.upload-label{display:grid;gap:13px;margin-top:20px;font-size:13px}input[type=file]{max-width:100%;font-size:16px}#brand-reset{border:1px solid var(--line);padding:12px;border-radius:6px;font-size:12px}.error{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;padding:30px;background:var(--cream);z-index:9}.error button{background:var(--yellow);padding:12px;border-radius:7px}.error p{max-width:500px;font-size:13px;line-height:1.7}
@media(min-width:1500px){main{grid-template-columns:310px 1fr}aside{padding-left:32px;padding-right:32px}.viewport{min-height:520px}.controls button{padding:16px}.scene-top h2{font-size:43px}}
@media(max-width:1050px){header{padding:12px 20px}.lab span,.mode-caption{display:none}main{grid-template-columns:235px 1fr}aside{padding:24px 17px}.simulation{padding:17px 17px 0}.scene-top{left:20px;top:20px}.scene-top h2{font-size:30px}.live-tag{font-size:8px}.camera-bar{right:15px;top:85px}.camera-bar button{padding:7px}.coach{left:17px;max-width:290px;bottom:90px}.pump-hud{right:17px;bottom:176px;width:230px}.scene-credit{display:none}.telemetry{gap:18px;left:20px}.lesson-deck{grid-template-columns:1fr}.lesson-playback{gap:8px}.lesson-playback button{font-size:10px}.controls button span{font-size:9px}.transport{flex-direction:column}.transport button{flex:1;width:32px}}
@media(max-width:700px){header{height:75px;padding:8px 14px;gap:14px}.brand img{width:49px;height:49px}.brand span{font-size:15px}.brand b{font-size:18px}.lab{font-size:25px}.icon-button span{display:none}.modes{height:51px;padding:0 8px;gap:0}.modes button{flex:1;justify-content:center;padding:0 6px;gap:5px;font-size:10px}.modes button span{font-size:11px}main{display:flex;flex-direction:column;height:auto;min-height:0}aside{padding:15px 14px 12px;border-right:0;border-bottom:1px solid var(--line);overflow:visible}.section-title,h1,.intro,.aside-footer{display:none}.boards{display:grid;grid-template-columns:repeat(4,1fr);gap:5px}.board-choice{flex-direction:column;gap:8px;padding:11px 3px;border-radius:8px;text-align:center}.board-choice b{font-size:10px}.board-choice small,.choice-check{display:none}.board-silhouette{height:29px;width:13px}.board-silhouette.long{height:29px;width:10px}.board-silhouette.cruiser{height:29px}.board-silhouette.surf{height:29px;width:16px}.board-silhouette:after{top:6px;box-shadow:0 14px var(--ink)}.board-note{min-height:0;font-size:10px;padding:9px 0 0}.inspect{position:absolute;right:14px;top:244px;font-size:10px;padding:0;border:0}.inspect span{display:none}.setup-row{display:inline-flex;margin-top:10px;margin-right:12px;gap:6px;font-size:10px}.setup-row select{font-size:16px;max-width:178px;transform-origin:left;}.setup-row label{display:none}#ride-options{display:inline-flex;gap:8px}#ride-options label{display:inline;font-size:10px}.simulation{padding:12px 10px 0;overflow:visible}.viewport{height:440px;flex:auto;min-height:0;border-radius:11px}.scene-top{left:16px;top:17px;right:13px;gap:5px}.scene-top h2{font-size:27px}.scene-label{font-size:7px;letter-spacing:1.3px}.live-tag{font-size:8px;padding:7px}.camera-bar{top:76px;right:12px}.camera-bar button{font-size:10px}.start-card{top:35%;left:20px;padding:18px;max-width:260px}.start-card h3{font-size:30px}.coach{left:13px;right:13px;bottom:76px;max-width:none;padding:10px 12px}.coach p{font-size:10px}.telemetry{left:16px;bottom:19px;gap:22px}.telemetry b{font-size:27px}.telemetry span{font-size:7px}.control-deck{gap:6px}.controls{display:grid;grid-template-columns:repeat(3,1fr);gap:5px}.controls button{padding:9px 4px;gap:5px;min-height:53px}.controls button span{font-size:10px}.transport button{width:34px}.bottom-strip{font-size:8px;gap:12px;min-height:50px}.bottom-strip button{font-size:9px;max-width:150px}.pump-hud{right:13px;bottom:163px;width:220px;padding:11px}.pump-hud>span{font-size:16px}.pump-hud small{font-size:9px}.lesson-list{display:flex;overflow-x:auto;gap:5px;padding-top:10px;margin-top:10px}.lesson-list button{white-space:nowrap;font-size:10px;padding:8px}.lesson-deck{padding:14px;gap:10px}.lesson-deck h3{font-size:23px}.lesson-playback{flex-wrap:wrap}.lesson-playback label,.lesson-playback select{font-size:16px}.lesson-playback button:last-child{margin-left:0}dialog{padding:25px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}
.mission{position:absolute;right:22px;top:153px;width:225px;background:#fffdf6ed;padding:13px 15px;border-radius:9px;pointer-events:none}.mission>span{font-size:8px;font-weight:700;letter-spacing:1.1px;color:var(--blue)}.mission p{font-size:11px;line-height:1.6;margin:6px 0 0}.mission-result{font-size:10px}.mission.completed{background:var(--yellow)}#mission-result{font-size:10px;margin-top:4px;font-weight:700}body.quiz-open .simulation{display:none}body.quiz-open aside #ride-options,body.quiz-open aside .lesson-list{display:none!important}.quiz-section{padding:28px 38px;overflow:auto;background:#eef0e9}.quiz-hero{display:flex;align-items:center;justify-content:space-between;max-width:840px;margin:0 auto 21px}.quiz-hero h2{font-family:'Barlow Condensed',sans-serif;font-size:62px;line-height:.88;letter-spacing:-.5px;margin:12px 0 17px}.quiz-hero em{font-style:normal;color:var(--blue)}.quiz-hero p{font-size:12px;color:var(--muted);line-height:1.7}.quiz-hero img{width:155px;height:155px;object-fit:contain;transform:rotate(8deg)}.quiz-topics{max-width:840px;margin:0 auto 14px;display:flex;gap:7px}.quiz-topics button{padding:9px 15px;font-size:11px;background:#fffdf7;border-radius:6px;border:1px solid var(--line)}.quiz-topics button.active{background:var(--blue);color:#fff;border-color:var(--blue)}.quiz-card,.quiz-result{max-width:840px;margin:auto;background:#fffdf7;border:1px solid #fff;padding:26px 30px;border-radius:14px;box-shadow:0 12px 35px #123c5108}.quiz-progress{display:flex;justify-content:space-between;font-size:9px;font-weight:600;color:var(--muted);letter-spacing:.6px}.quiz-progress-track{height:4px;background:#e0e7e5;margin:12px 0 23px;border-radius:4px;overflow:hidden}.quiz-progress-track span{height:100%;background:var(--blue);display:block;width:0;transition:width .3s}.quiz-card h3{font-family:'Barlow Condensed',sans-serif;font-size:29px;line-height:1.15;font-weight:700;margin:10px 0 22px;max-width:670px}.quiz-answers{display:grid;grid-template-columns:1fr 1fr;gap:9px}.quiz-answers button{display:flex;align-items:center;gap:12px;text-align:left;border:1px solid var(--line);border-radius:8px;padding:15px;font-size:12px;line-height:1.5;background:white;min-height:68px}.quiz-answers button:hover:not(:disabled){background:#edf2f2;border-color:var(--blue)}.quiz-answers button:disabled{opacity:1;color:var(--muted)}.quiz-answers button.correct{background:#e5f3e9;border-color:#439167;color:#205c3f}.quiz-answers button.incorrect{background:#fbe8db;border-color:#be7b51;color:#794224}.quiz-answers button>span{border-radius:6px;flex-shrink:0;width:28px;height:28px;background:#edf0ea;display:flex;align-items:center;justify-content:center;font-weight:600;color:var(--blue);font-size:11px}.quiz-answers button.correct>span{background:#439167;color:white}.quiz-answers button.incorrect>span{background:#be7b51;color:white}.quiz-hint{font-size:11px;color:var(--blue);padding:15px 0 0}.quiz-card #quiz-hint-text{font-size:11px;color:var(--muted);line-height:1.6}.quiz-feedback{margin-top:18px;padding:15px 18px;background:#f0f2e9;border-radius:8px;font-size:12px;line-height:1.7}.quiz-feedback b{display:block;font-size:13px;color:var(--blue);margin-bottom:4px}.quiz-feedback a{display:inline-block;margin-top:8px;font-size:10px;color:var(--blue)}.quiz-actions{display:flex;gap:12px;margin-top:15px}.quiz-actions button{font-size:11px;padding:11px 15px;border-radius:6px;border:1px solid var(--line)}.quiz-actions button:last-child{margin-left:auto;background:var(--yellow);color:#123c51;font-weight:600;border:0}.quiz-bottom{max-width:840px;margin:14px auto 0;color:var(--muted);font-size:10px}.quiz-bottom span{float:right}.quiz-result{text-align:center}.result-symbol{display:flex;background:var(--yellow);width:64px;height:64px;border-radius:50%;align-items:center;justify-content:center;font-size:34px;margin:0 auto 18px;color:var(--blue)}.quiz-result .eyebrow{display:block}.quiz-result h3{font-family:'Barlow Condensed',sans-serif;font-size:38px;margin:12px 0}.quiz-result p{font-size:12px;color:var(--muted);line-height:1.7}.quiz-result-score{font-family:'Barlow Condensed',sans-serif;font-size:62px;color:var(--blue);margin:16px 0}.quiz-result-actions{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin-top:20px}.quiz-result-actions button{background:var(--yellow);padding:12px 16px;border-radius:6px;font-size:11px;font-weight:600;color:#123c51}.quiz-result-actions button:nth-child(2){background:var(--blue);color:white}.quiz-result-actions button:last-child{background:transparent;border:1px solid var(--line);color:var(--blue)}.review-row{padding:12px 0;border-top:1px solid var(--line);font-size:11px;text-align:left;line-height:1.6}.review-row b{display:block;color:var(--blue)}
@media(max-width:1050px){.mission{top:132px;right:15px;width:195px;padding:11px}.mission p{font-size:10px}.quiz-section{padding:24px}.quiz-hero img{width:130px;height:130px}.quiz-hero h2{font-size:52px}.quiz-card{padding:22px}.quiz-answers button{font-size:11px;padding:12px}.quiz-card h3{font-size:27px}}
@media(max-width:700px){.modes button{padding:0 3px;gap:3px}.modes button span{font-size:10px}.modes button{font-size:9px}.mission{top:120px;right:13px;width:165px;padding:9px}.mission>span{font-size:7px}.mission p{font-size:9px}.quiz-section{padding:23px 14px}.quiz-hero h2{font-size:50px}.quiz-hero img{width:104px;height:104px}.quiz-hero p{font-size:11px}.quiz-topics{gap:5px;flex-wrap:wrap}.quiz-topics button{font-size:11px;padding:9px 12px}.quiz-card{padding:20px 16px}.quiz-card h3{font-size:27px}.quiz-answers{grid-template-columns:1fr}.quiz-answers button{min-height:55px;font-size:12px}.quiz-bottom{line-height:1.6}.quiz-bottom span{display:block;float:none;margin-top:5px}.quiz-result{padding:24px 17px}.quiz-result h3{font-size:32px}}
.timing-track{background:linear-gradient(90deg,#829aa0 0 25%,var(--yellow) 25% 75%,#829aa0 75%)}.timing-track:before{left:8px;content:'BERGAUF'}.timing-track:after{left:37%;content:'BERGAB / DRUCK'}
@media(max-width:700px){.inspect{position:static;align-self:flex-end;margin-top:8px}.setup-row{margin-top:7px}}
@media(max-width:700px){.viewport:has(#start-card:not([hidden])) .coach,.viewport:has(#start-card:not([hidden])) .mission{visibility:hidden}.start-card{top:auto;bottom:80px;left:16px;right:16px;transform:none;max-width:none;padding:16px}.start-card h3{font-size:28px;margin:6px 0}.start-card p{font-size:11px;margin:8px 0;line-height:1.5}.start-card small{display:none}.start-card button{padding:11px 15px}}
/* Keep instruction panels outside the riding view. */
header{height:78px}.modes{height:50px}main{height:calc(100dvh - 128px);min-height:620px;grid-template-columns:248px minmax(0,1fr)}aside{padding:20px}h1{font-size:48px;margin:15px 0}.intro{margin-bottom:14px}.board-choice{padding:10px}.simulation{padding:12px 18px 0}.session-toolbar{display:flex;justify-content:flex-end;margin-bottom:8px}.camera-bar{position:static;padding:3px;background:#fffdf7}.viewport{min-height:360px}.scene-top{top:17px;left:20px;right:18px}.scene-top h2{font-size:28px}.telemetry{bottom:15px;left:20px}.telemetry b{font-size:26px}.start-card{position:static;transform:none;max-width:none;padding:8px 0;margin:0;background:none;border:0;box-shadow:none;display:flex;align-items:center;gap:14px}.start-card h3,.start-card .eyebrow,.start-card small{display:none}.start-card p{margin:0;font-size:11px;flex:1}.start-card p br{display:none}.start-card button{width:auto;min-width:156px;padding:10px 15px;gap:20px}.control-deck{margin-top:8px}.controls button{padding:9px 3px;gap:5px}.controls button span{font-size:9px}.learning-content{padding:12px;display:grid;grid-template-columns:1fr 1fr;gap:12px}.coach,.mission,.pump-hud{position:static;max-width:none;width:auto;box-shadow:none;margin:0;pointer-events:auto;padding:12px;transform:none}.coach{background:#fffdf7}.mission{background:#edf2f1}.pump-hud{grid-column:1/-1}.lesson-deck{grid-column:1/-1;margin:0}.coach p,.mission p{font-size:12px}#learning-panel{margin-top:9px;border:1px solid var(--line);border-radius:9px;background:#fffdf7}#learning-panel summary{padding:11px 14px;font-size:11px;font-weight:600;cursor:pointer;color:var(--blue)}#learning-panel summary span{float:right;font-size:10px;font-weight:400}#learning-panel[open] summary span{display:none}.bottom-strip{min-height:36px}#setup-toggle,#setup-close{display:none}#voice[aria-pressed=true]{color:var(--blue);background:#fff0c9;border-radius:7px;padding:8px}#setup-backdrop{position:fixed;inset:0;background:#072e4380;backdrop-filter:blur(3px);z-index:29}#setup-panel{z-index:30}
@media(max-width:900px){header{height:72px;padding:8px 13px;gap:12px}.brand img{width:48px;height:48px}.brand span{font-size:14px}.brand b{font-size:18px}.lab{font-size:24px}.lab span{display:none}.icon-button span{display:none}#setup-toggle,#setup-close{display:block}#setup-close{align-self:flex-end;font-size:26px;min-width:44px;min-height:44px}main{display:block;height:auto;min-height:0}#setup-panel{position:fixed;inset:0 auto 0 0;width:min(320px,86vw);background:var(--cream);overflow:auto;transform:translateX(-105%);transition:transform .22s;display:flex;padding:16px 20px;box-shadow:15px 0 45px #123c511c}.setup-open #setup-panel{transform:translateX(0)}#setup-panel .section-title,#setup-panel h1,#setup-panel .intro,#setup-panel .aside-footer{display:block}#setup-panel .boards{grid-template-columns:1fr}#setup-panel .board-choice{flex-direction:row;text-align:left;padding:12px;gap:18px}#setup-panel .board-choice b{font-size:13px}#setup-panel .board-choice small,#setup-panel .choice-check{display:block}#setup-panel .inspect{position:static;margin:12px 0 0;align-self:stretch;padding:12px 0;border-block:1px solid var(--line);font-size:12px}#setup-panel .inspect span{display:block}#setup-panel .setup-row{display:flex;margin-top:14px}#setup-panel .setup-row label{display:block}#setup-panel #ride-options{display:block}#setup-panel .lesson-list{display:grid;overflow:visible}#setup-panel .setup-row select{font-size:14px}.simulation{padding:9px 10px 0;overflow:visible}.viewport{height:clamp(330px,calc(100dvh - 290px),650px);min-height:330px;flex:none}.camera-bar button{min-height:34px;font-size:10px;padding:6px 10px}.scene-top{top:14px;left:15px}.scene-top h2{font-size:25px}.scene-label{font-size:7px}.live-tag{font-size:8px}.controls{display:grid;grid-template-columns:repeat(4,1fr);gap:5px}.controls button{min-height:48px;padding:7px 3px}.controls button span{font-size:9px}.transport{flex-direction:column}.transport button{width:36px;flex:1}.learning-content{grid-template-columns:1fr}.coach,.mission,.pump-hud{grid-column:1}.lesson-deck{grid-template-columns:1fr}.start-card p{font-size:10px}.start-card button{min-width:138px;font-size:11px}.telemetry{bottom:14px;left:15px;gap:18px}.telemetry b{font-size:25px}.scene-credit{display:none}.modes{padding:0 6px}.modes button{flex:1;padding:0 4px;gap:5px;justify-content:center}.modes button span{font-size:10px}.mode-caption{display:none}.quiz-section{padding:20px 14px}}
@media(max-width:360px){.brand span{display:none}.controls button span{font-size:8px}.start-card p{max-width:125px}}
@media(prefers-reduced-motion:reduce){#setup-panel{transition:none}}
/* Mobile riding controls and a visible learning route. */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.lesson-route{border:1px solid var(--line);background:#fffdf7;border-radius:10px;padding:12px 14px;margin-bottom:10px;flex-shrink:0}.lesson-route-top{display:flex;justify-content:space-between;gap:10px;font-size:11px;font-weight:600}.lesson-route-top span:last-child{color:var(--blue)}.lesson-progress-track{height:5px;border-radius:5px;background:#dde6e3;margin:9px 0;overflow:hidden}.lesson-progress-track>span{display:block;height:100%;width:0;background:var(--blue);transition:width .25s}.lesson-navigation{display:flex;align-items:center;gap:8px}.lesson-navigation select{font-size:16px;min-width:0;flex:1;padding:8px;border:1px solid var(--line);border-radius:6px;background:white;color:var(--ink)}.lesson-navigation button{width:44px;height:44px;background:#edf2ef;border-radius:7px;font-size:19px}.lesson-navigation button:disabled{opacity:.25}#lesson-notice{background:#e6f2e8;color:#24583d;padding:11px 13px;border-radius:7px;font-size:12px;line-height:1.5;margin:10px 0 0}#lesson-finish{border-top:1px solid var(--line);padding-top:14px;margin-top:12px;font-size:13px}#lesson-finish p{font-size:12px;line-height:1.5;color:var(--muted)}#lesson-finish button{background:var(--blue);color:white;border-radius:7px;min-height:44px;padding:10px 14px;margin:0 5px 5px 0;font-size:12px}#lesson-finish button:last-child{background:#e8eeeb;color:var(--ink)}#learning-panel summary #learning-summary{float:none;font-size:11px;font-weight:600}#learning-panel[open] summary #learning-summary{display:inline}.lesson-playback #complete{background:var(--yellow);color:var(--ink);min-height:44px;font-size:12px}.lesson-playback #complete[data-done=true]{background:#e6f2e8;color:#24583d}.lesson-playback #complete:disabled{opacity:1;cursor:default}.secondary-actions{display:flex;gap:5px}.secondary-actions button{display:flex;flex-direction:column;justify-content:center;gap:4px;width:auto;min-width:68px;padding:7px 10px;touch-action:none;user-select:none;-webkit-user-select:none;font-size:10px}.secondary-actions button.held{background:var(--yellow);border-color:var(--yellow)}.secondary-actions button span{font-size:10px}.touch-hint{display:none}button[data-action]{-webkit-touch-callout:none}.controls button.held{box-shadow:inset 0 0 0 2px #123c5129;transform:translateY(1px)}#control-deck{flex-shrink:0}.transport{flex-direction:row}
@media(max-width:900px){
 header{height:60px;gap:10px;padding-top:max(6px,env(safe-area-inset-top));padding-inline:max(12px,env(safe-area-inset-left))}.brand img{width:42px;height:42px}.brand span{font-size:13px}.brand b{font-size:16px}.lab{font-size:23px}.icon-button{min-width:36px;min-height:44px;padding:4px}.modes{height:44px}.modes button span{font-size:11px}.simulation{padding:6px max(10px,env(safe-area-inset-right)) max(8px,env(safe-area-inset-bottom)) max(10px,env(safe-area-inset-left))}.session-toolbar{margin-bottom:6px}.camera-bar{padding:2px}.camera-bar button{min-height:32px}.viewport{height:calc(100dvh - 325px);min-height:240px;max-height:680px}.simulation:has(#start-card:not([hidden])) .viewport{height:calc(100dvh - 369px)}.scene-top{top:12px;left:13px;right:12px}.scene-top h2{font-size:23px;max-width:210px}.live-tag{padding:6px 8px;font-size:8px}.start-card{padding:6px 0;gap:8px}.start-card p{font-size:10px;line-height:1.4}.start-card button{min-height:38px;min-width:140px;padding:9px 12px}.control-deck{display:flex;flex-direction:column;gap:6px;margin-top:7px;position:sticky;bottom:0;z-index:4;background:var(--cream);padding-bottom:max(5px,env(safe-area-inset-bottom));border-radius:10px}.controls{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));grid-template-rows:52px 52px;gap:6px}.controls button{min-height:52px;border-radius:10px;padding:7px 3px;gap:4px;background:#fffdf9}.controls button kbd{display:none}.controls button span{font-size:13px;font-weight:600;color:var(--ink)}.controls button[data-action=left]{grid-column:1;grid-row:1/3}.controls button[data-action=right]{grid-column:4;grid-row:1/3}.controls button[data-action=left] kbd,.controls button[data-action=right] kbd{display:block;font-size:26px;font-weight:400}.controls button[data-action=left] span,.controls button[data-action=right] span{font-size:11px}.controls button[data-action=push]{grid-column:2/4;grid-row:1;background:var(--blue);border-color:var(--blue)}.controls button[data-action=push] span{color:white}.controls button[data-action=push].held{background:var(--yellow);border-color:var(--yellow)}.controls button[data-action=push].held span{color:var(--ink)}.controls button[data-action=crouch]{grid-column:2;grid-row:2}.controls button[data-action=brake]{grid-column:3;grid-row:2}.controls button[data-action=brake] span{color:#8e4935}.transport{display:flex;flex-direction:row;align-items:center;gap:6px;min-width:0}.transport>button{width:44px;min-width:44px;height:44px;flex:none;font-size:20px}.secondary-actions{display:flex;gap:6px}.secondary-actions button{min-width:68px;min-height:44px;height:44px;flex:none;border-radius:8px;padding:6px 9px}.secondary-actions button kbd{display:none}.secondary-actions button span{font-size:11px}.touch-hint{display:block;font-size:9px;line-height:1.4;color:var(--muted);margin-left:auto;text-align:right;max-width:100px}.bottom-strip{min-height:27px;font-size:8px}.bottom-strip>span{max-width:56%}.bottom-strip button{font-size:8px}.lesson-route{padding:10px;margin-bottom:6px}.lesson-route-top{font-size:10px}.lesson-navigation select{padding:8px 5px}.lesson-progress-track{margin:8px 0}body[data-mode=learn] .viewport{height:clamp(240px,calc(100dvh - 350px),500px)}body[data-mode=learn] .scene-top h2{font-size:22px}body[data-mode=learn] .telemetry{display:none}.learning-content{padding:10px;gap:8px}body[data-mode=learn] .learning-content .coach{display:none}.lesson-deck{padding:12px;border:0;gap:12px}.lesson-deck h3{font-size:25px}.lesson-deck p{font-size:13px}.steps button{padding:10px;min-height:44px;font-size:13px}.lesson-playback{display:grid;grid-template-columns:1fr 1fr;gap:8px}.lesson-playback button{font-size:12px;min-height:44px;padding:10px}.lesson-playback label{display:flex;align-items:center;justify-content:center;font-size:12px;gap:5px}.lesson-playback select{font-size:16px;min-height:44px;min-width:0}.lesson-playback #complete{grid-column:1/-1;width:100%;margin:0;font-size:15px}#learning-panel summary{padding:12px 10px;min-height:44px}#learning-panel summary .expand-hint{display:none}.setup-row select{font-size:16px!important}.lesson-navigation select{font-size:16px}#lesson-notice{font-size:12px}
}
@media(max-width:370px){.brand span{display:none}.touch-hint{font-size:8px;max-width:69px}.secondary-actions button{min-width:61px;padding:5px 7px}.controls button span{font-size:12px}.controls button[data-action=crouch] span{font-size:11px}.scene-top h2{max-width:170px;font-size:22px}.live-tag{font-size:7px}.lesson-route-top{font-size:9px}}
@media(max-width:900px) and (orientation:landscape) and (max-height:550px){
 header{height:52px}.modes{height:39px}.simulation{display:grid;grid-template-columns:minmax(0,1fr) 232px;gap:6px 10px;align-items:start}.session-toolbar{grid-column:1;grid-row:1;margin:0}.viewport{grid-column:1;grid-row:2/4;height:calc(100dvh - 145px);min-height:180px;max-height:none}.simulation:has(#start-card:not([hidden])) .viewport{height:calc(100dvh - 145px)}.start-card{grid-column:2;grid-row:1;padding:0}.start-card p{display:none}.start-card button{width:100%;min-height:34px}.control-deck{grid-column:2;grid-row:2;position:static;margin:0}.controls{grid-template-rows:52px 52px;gap:5px}.controls button span{font-size:11px}.controls button[data-action=crouch] span{font-size:10px}.transport{flex-wrap:wrap;gap:5px}.touch-hint{max-width:none;width:100%;text-align:center}#learning-panel{grid-column:1/-1;margin:0}.bottom-strip{grid-column:1/-1}.lesson-route{grid-column:1/-1}body[data-mode=learn] .simulation{display:flex}body[data-mode=learn] .viewport{height:220px;min-height:220px}
}
@media(max-width:900px){header{gap:6px}.brand{gap:8px;flex-shrink:0}.brand span{white-space:nowrap}.lab{white-space:nowrap;font-size:21px}.transport .secondary-actions{flex-shrink:0}}
.quiz-settings{max-width:840px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;gap:12px}.quiz-settings label{display:flex;align-items:center;gap:10px;font-size:12px;font-weight:600}.quiz-settings select{font-size:16px;min-height:44px;max-width:100%;padding:8px 10px;border:1px solid var(--line);border-radius:7px;background:#fffdf7;color:var(--ink)}#quiz-bank-size{font-size:11px;font-weight:600;color:var(--blue);white-space:nowrap}.quiz-pool-count{max-width:840px;margin:9px auto 16px;font-size:11px;line-height:1.5;color:var(--muted)}.quiz-topics{flex-wrap:wrap}.quiz-topics button{min-height:44px}
@media(max-width:700px){.quiz-settings{gap:8px;align-items:flex-end}.quiz-settings label{display:grid;gap:6px;min-width:0}.quiz-settings select{width:100%;font-size:16px;max-width:245px}#quiz-bank-size{padding-bottom:13px;font-size:10px}.quiz-topics button{padding:8px 11px}.quiz-hero{margin-bottom:15px}.quiz-answers button{font-size:13px}.quiz-feedback{font-size:13px}.quiz-actions button{min-height:44px}}
/* A single-row navigation, always-visible timing and a dedicated board designer. */
.modes{overflow-x:auto;overflow-y:hidden;flex-wrap:nowrap;scrollbar-width:thin;scrollbar-color:#b1c5ca transparent;-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain;gap:4px}.modes button{flex:0 0 auto;white-space:nowrap;min-height:44px;padding:0 18px}.modes button span{white-space:nowrap}.mode-caption{white-space:nowrap;padding-left:14px}#voice{display:inline-flex;align-items:center;gap:6px;white-space:nowrap;min-height:44px;font-size:12px}#voice svg{width:22px;height:22px;fill:currentColor;flex:none}#voice span{display:inline;font-size:12px;margin:0}#voice[aria-pressed=true]{color:var(--blue)}.pump-hud{display:grid;grid-template-columns:1fr minmax(130px,.6fr);gap:3px 14px;align-items:center;margin-top:7px;padding:9px 14px;background:var(--ink);border-radius:9px;flex-shrink:0}.pump-hud>span{font-family:'DM Sans',sans-serif;font-size:13px;font-weight:700;letter-spacing:0}.pump-hud small{grid-column:1/-1;font-size:10px;line-height:1.4}.pump-hud .timing-track{height:9px;margin:0;border-radius:7px}.pump-hud .timing-track:before,.pump-hud .timing-track:after{display:none}.pump-hud #phase-dot{height:9px;width:4px}.pump-hud[data-phase=extend]>span{color:var(--yellow)}#studio-views{display:flex;gap:4px;border:1px solid var(--line);background:#fffdf7;border-radius:8px;padding:3px}#studio-views button{font-size:12px;padding:8px 12px;min-height:38px;border-radius:5px}#studio-views button.active{background:var(--blue);color:white}body[data-mode=studio] main{grid-template-columns:1fr}body[data-mode=studio] #setup-panel{display:none}body[data-mode=studio] .simulation{display:grid;grid-template-columns:minmax(0,1fr) 350px;grid-template-rows:auto minmax(380px,1fr) auto;gap:10px 20px;overflow:auto;padding:18px 24px}body[data-mode=studio] .session-toolbar{grid-column:1;grid-row:1;justify-content:center;margin:0}body[data-mode=studio] .viewport{grid-column:1;grid-row:2;height:100%;min-height:380px}body[data-mode=studio] .bottom-strip{grid-column:1;grid-row:3}#board-editor{grid-column:2;grid-row:1/4;padding:22px;border:1px solid var(--line);background:#fffdf7;border-radius:13px;overflow:auto}#board-editor h2{font-family:'Barlow Condensed',sans-serif;font-size:36px;margin:7px 0 9px}.studio-intro{font-size:12px;line-height:1.6;color:var(--muted)}.studio-field{display:grid;gap:7px;font-size:12px;margin:14px 0}.studio-field select{font-size:16px;width:100%;min-height:44px;padding:8px 10px;border:1px solid var(--line);border-radius:7px;background:white;color:var(--ink)}.design-presets{display:flex;gap:5px;margin:12px 0 16px}.design-presets button{flex:1;min-height:44px;border-radius:7px;background:#e8eeeb;font-size:11px;font-weight:600}.design-presets [data-design-preset=sunset]{background:#f5d4df;color:#742a49}.design-presets [data-design-preset=ocean]{background:#d3ebe5;color:#24575a}.design-presets [data-design-preset=mono]{background:#303b45;color:white}.design-presets [data-design-preset=crew]{background:var(--blue);color:white}#board-editor details{border-top:1px solid var(--line);padding:8px 0}#board-editor summary{font-size:12px;font-weight:700;min-height:44px;cursor:pointer;display:list-item;align-content:center;padding:9px 0}.design-colours{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:8px 0}.design-colours label{display:grid;gap:6px;text-align:center;font-size:10px}.design-colours input{width:100%;min-width:0;height:44px;border:1px solid var(--line);padding:3px;border-radius:7px;background:white}.studio-upload{display:grid;gap:10px;font-size:12px;margin:7px 0}.studio-upload input{width:100%;font-size:16px;min-height:44px;padding:9px;border:1px dashed #a3bdc6;border-radius:7px;background:#f0f4f2}.studio-upload input::file-selector-button{font:inherit;font-size:12px;border:0;background:var(--blue);color:white;border-radius:4px;padding:7px;margin-right:8px}#board-editor small{display:block;font-size:10px;color:var(--muted)}.image-tools{display:flex;gap:8px;margin:10px 0}.image-tools button{font-size:11px;border:1px solid var(--line);border-radius:6px;min-height:44px;padding:8px 10px}.image-tools button[aria-pressed=true]{background:#e8eeeb}.studio-slider{display:grid;grid-template-columns:1fr auto;gap:6px;margin-top:12px;font-size:12px}.studio-slider output{font-size:11px;color:var(--muted)}.studio-slider input{grid-column:1/-1;accent-color:var(--blue);width:100%;height:38px;margin:0;cursor:pointer}.studio-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px;padding-top:14px}.studio-actions button{min-height:44px;font-size:11px;border:1px solid var(--line);background:#edf2ef;border-radius:7px;padding:10px}.studio-actions #design-save{background:var(--yellow);color:var(--ink);border:0;font-weight:700}.studio-actions #design-ride{grid-column:1/-1;background:var(--blue);color:white;border:0}.studio-actions #design-reset{grid-column:1/-1;background:none;font-size:11px;color:var(--muted)}#design-status{font-size:11px;line-height:1.6;margin-bottom:0;color:var(--blue)}#design-status.error-message{color:#99432d}
@media(max-width:900px){header .lab{display:none}header{gap:7px}header .brand{margin-right:auto}#voice span{display:inline!important;font-size:11px}#voice{padding:4px 6px;gap:4px;min-width:0}#voice svg{width:20px;height:20px}.modes{padding:0 8px;scrollbar-width:none;height:46px}.modes::-webkit-scrollbar{display:none}.modes button{flex:0 0 auto;padding:0 15px;gap:7px;font-size:10px}.modes button span{font-size:12px}.mode-caption{display:none}.pump-hud{grid-template-columns:minmax(0,1fr) 95px;margin-top:6px;padding:8px 11px;gap:3px 10px;min-height:52px}.pump-hud>span{font-size:12px;line-height:1.3}.pump-hud small{font-size:9px}.pump-hud .timing-track{height:8px}.pump-hud #phase-dot{height:8px}body[data-mode=pump] .viewport{height:calc(100dvh - 385px)}body[data-mode=pump] .simulation:has(#start-card:not([hidden])) .viewport{height:calc(100dvh - 429px)}body[data-mode=studio] .simulation{display:flex;padding:9px 10px;gap:8px;overflow:visible}body[data-mode=studio] .viewport{height:360px;min-height:280px;flex:none}body[data-mode=studio] .scene-top h2{font-size:23px}body[data-mode=studio] .scene-label{font-size:7px;letter-spacing:1px}body[data-mode=studio] .bottom-strip{order:4}#board-editor{padding:18px;width:100%;overflow:visible}#board-editor h2{font-size:34px}.studio-field,.studio-upload,.studio-slider{font-size:13px}.studio-actions button{font-size:12px}.design-colours label{font-size:11px}.studio-slider input{height:44px}#studio-views{width:100%}#studio-views button{flex:1;font-size:12px;min-height:44px}body[data-mode=studio] .session-toolbar{width:100%}}
@media(max-width:900px) and (orientation:landscape) and (max-height:550px){body[data-mode=pump] .viewport,body[data-mode=pump] .simulation:has(#start-card:not([hidden])) .viewport{height:calc(100dvh - 210px);min-height:180px}.pump-hud{grid-column:1;grid-row:4;margin:0}body[data-mode=studio] .simulation{display:grid;grid-template-columns:minmax(0,1fr) 300px;grid-template-rows:auto 270px auto;align-items:start}body[data-mode=studio] .viewport{height:270px;min-height:270px}body[data-mode=studio] #board-editor{grid-column:2;grid-row:1/4}body[data-mode=studio] .bottom-strip{grid-column:1;grid-row:3}}
@media(max-width:900px) and (orientation:portrait){body[data-mode=studio] .viewport{position:sticky;top:8px;z-index:5;box-shadow:0 5px 20px #123c5112}body[data-mode=studio] .scene-top h2{display:none}}

.design-colours label{font-size:12px}

.studio-actions #design-save,.studio-actions #design-export,.studio-actions #design-export-flat{grid-column:1/-1}.studio-actions #design-export{background:var(--blue);color:white;font-weight:700}.studio-actions #design-export:disabled{opacity:.65;cursor:wait}