@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{--paper:#f6f3ea;--ink:#243c3b;--muted:#718481;--coral:#e97555;--teal:#28776e;--line:#d9ded3}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font-family:'DM Sans',sans-serif}button,input,a{-webkit-tap-highlight-color:transparent}button{font:600 14px 'DM Sans',sans-serif;cursor:pointer;color:inherit;background:transparent;border:1px solid var(--line);border-radius:10px;padding:12px 16px;transition:background .15s,transform .15s;touch-action:manipulation}button:hover{background:#e9eee3}button:active{transform:translateY(1px)}button:focus-visible{outline:3px solid var(--coral);outline-offset:3px}button:disabled{opacity:.35;cursor:default}button.selected{background:var(--ink);color:#fff;border-color:var(--ink)}[hidden]{display:none!important}#app{max-width:1500px;margin:auto;padding:0 40px}header{height:95px;display:flex;align-items:center;gap:32px;border-bottom:1px solid var(--line)}.logo{font:700 35px 'Space Grotesk',sans-serif;letter-spacing:-2px;color:var(--ink);text-decoration:none}.logo span{font-weight:400}.logo i{font-style:normal;color:var(--coral);display:inline-block;font-size:35px;margin-left:9px;transform:rotate(14deg)}.tagline{color:var(--muted);font-size:14px}.edition{margin-left:auto;letter-spacing:2px;font-size:10px}.edition b{background:#e9eddf;padding:8px;border-radius:50%;margin-left:8px}.topbar{display:flex;align-items:center;gap:18px;padding:18px 0}.mode-tabs{display:flex;gap:6px}.mode-tabs button{border:0;padding:10px 17px}.mode-tabs span{font-size:10px;opacity:.55;margin-right:10px}.player{display:flex;align-items:center;gap:10px;margin-left:auto;font-size:12px;color:var(--muted)}.player button{border:0;background:#e7eee4;color:var(--teal);padding:9px 13px}.icon{border-radius:50%;padding:7px 12px}.stage{height:clamp(300px,49vh,580px);position:relative;border:1px solid #d4ded2;border-radius:20px;background:#fbfaf4;overflow:hidden;isolation:isolate}canvas{width:100%;height:100%;display:block;touch-action:none}.canvas-note{position:absolute;top:28px;left:32px;pointer-events:none}.scribble{display:block;font-family:'Space Grotesk',sans-serif;font-size:25px;letter-spacing:-1px;font-weight:500}.canvas-note small{display:block;margin-top:8px;color:var(--muted);font-size:12px}.stage-bottom{position:absolute;bottom:15px;left:24px;right:24px;display:flex;justify-content:space-between;pointer-events:none;font-size:10px;color:#72857b;letter-spacing:.7px}.toolbar{display:flex;align-items:center;gap:12px;padding:16px 0;border-bottom:1px solid var(--line)}.toolgroup{display:flex;gap:7px}.stickers{display:flex;align-items:center;gap:5px;margin-left:14px}.stickers>span,.bottom>div>span{font-size:9px;letter-spacing:1.5px;color:var(--muted);margin-right:7px}.stickers button{font-size:23px;padding:5px 8px;border-color:transparent;min-width:42px}.stickers button.selected{background:#e0eadd;border-color:#28776e}.primary{background:var(--coral);color:#fff;border-color:var(--coral);font-weight:700;box-shadow:0 3px 0 #c85a40}.primary:hover{background:#df6443}.toolbar>.primary{margin-left:auto;min-width:170px;text-align:left}.primary span{float:right;margin-left:30px}.bottom{display:flex;align-items:center;justify-content:space-between;padding:16px 0;gap:14px}.bottom>div{display:flex;align-items:center;gap:7px}.bottom button{font-size:12px;padding:8px 12px;border:0}.bottom button.selected{background:#e1e9dd;color:var(--ink)}label{font-size:12px;display:flex;align-items:center;gap:7px}input{accent-color:var(--teal);width:17px;height:17px}.assist{white-space:nowrap}footer{display:flex;justify-content:space-between;gap:15px;color:var(--muted);font-size:11px;padding:5px 0 20px}#hud{position:absolute;left:26px;top:23px;display:flex;gap:35px;pointer-events:none}#hud small{display:block;font-size:9px;letter-spacing:2px;color:var(--muted)}#hud b{font:500 30px 'Space Grotesk',sans-serif;font-variant-numeric:tabular-nums}#air{color:var(--coral);font-weight:700;align-self:center}#overlay,#pause{position:absolute;inset:0;background:#f6f3eac9;display:flex;align-items:center;justify-content:center;backdrop-filter:blur(4px)}.result-card{text-align:center;padding:25px;max-width:480px}.eyebrow{font-size:10px;letter-spacing:2px;color:var(--teal);font-weight:700}h1{font:700 49px 'Space Grotesk',sans-serif;letter-spacing:-2px;margin:10px 0}h2{font:700 30px 'Space Grotesk',sans-serif;letter-spacing:-1px}.result-card p{font-size:14px;color:var(--muted);margin:0 0 20px}.result-card button{margin:4px}.text-button{border:0;display:block;margin:12px auto!important;font-size:12px}#controls{display:flex;align-items:center;justify-content:space-between;padding:12px 0;user-select:none}.touch-set{display:flex;gap:10px}.touch-set button{min-width:78px;min-height:66px;font-size:27px;touch-action:none;background:#e5eadf;border:0}.touch-set button small{display:block;font-size:8px;letter-spacing:1px}.touch-set button.gas{background:var(--coral);color:white;min-width:110px}.touch-set button.held{background:var(--ink);color:white}#controls p{font-size:11px;line-height:1.8;color:var(--muted);text-align:center}kbd{font:10px sans-serif;padding:3px 5px;background:#e3e7dc;border-radius:3px;margin-left:7px}dialog{max-width:490px;border:1px solid var(--line);border-radius:20px;background:var(--paper);color:var(--ink);padding:32px}dialog::backdrop{background:#243c3b77;backdrop-filter:blur(3px)}dialog p{font-size:14px;line-height:1.7}.close{position:absolute;right:13px;top:10px;border:0;font-size:24px}
@media(max-width:800px){#app{padding:0 18px}header{height:72px}.logo{font-size:29px}.tagline{display:none}.stage{height:clamp(290px,45vh,440px)}.toolbar{flex-wrap:wrap;gap:8px}.toolgroup button{padding:10px}.stickers{margin-left:auto}.stickers>span{display:none}.toolbar>.primary{min-width:150px}.canvas-note{top:24px;left:20px}.scribble{font-size:22px}.bottom>div>span{display:none}.bottom button{padding:8px;font-size:11px}.stage-bottom #saveLabel{display:none}#score{white-space:nowrap}#controls p{display:none}}
@media(max-width:500px){#app{padding:0 12px}.edition{font-size:8px}.topbar{padding:12px 0;gap:8px}.player>span{display:none}.mode-tabs button{padding:9px 12px}.mode-tabs span{margin-right:5px}.toolgroup button span{display:none}.stickers{gap:0}.stickers button{font-size:21px;min-width:34px;padding:5px}.toolbar>.primary{min-width:125px;padding:11px;font-size:12px}.primary span{margin-left:15px}.bottom{gap:4px}.assist{font-size:10px}.touch-set{gap:7px}.touch-set button{min-width:62px}.touch-set button.gas{min-width:80px}footer{font-size:10px}.stage{border-radius:14px}.canvas-note small{max-width:230px}.result-card{padding:18px}h1{font-size:38px}#rideTools button{padding:9px;font-size:12px}}
@media(max-height:550px) and (orientation:landscape){header{height:45px}.topbar{padding:7px 0}.stage{height:52vh;min-height:190px}.canvas-note{top:10px}.canvas-note small{display:none}.toolbar{padding:9px 0}.bottom{padding:7px 0}#controls{padding:5px 0}.touch-set button{min-height:48px;font-size:21px}footer{display:none}}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}

#sound{font-size:12px;white-space:nowrap;padding:8px 10px}.audio-settings{margin:20px 0;display:grid;gap:14px}.audio-settings label{justify-content:space-between}.audio-settings input{width:65%;height:24px}@media(max-width:500px){.topbar{gap:5px}.mode-tabs button{padding:9px 8px}.mode-tabs span{display:none}.player button{padding:8px;font-size:11px}#sound{font-size:10px;padding:8px 6px}.icon{padding:6px 10px}}

.modebar{display:flex;align-items:center;gap:16px;padding-top:15px}.difficulty{display:flex;background:#e7ecdf;padding:3px;border-radius:12px}.difficulty button{border:0;padding:8px 18px}.modebar>span{font-size:11px;color:var(--muted)}#proEditor{display:flex;align-items:center;gap:18px;padding:12px 0;border-bottom:1px solid var(--line)}#proEditor select{font:600 13px 'DM Sans',sans-serif;color:var(--ink);background:#e7ecdf;border:0;border-radius:8px;padding:8px}.pan-control{flex:1}#pan{width:100%;max-width:420px}#panLabel{min-width:62px;font-size:10px;color:var(--muted)}#zoom{font-size:11px;padding:9px}#trickToast{position:absolute;top:110px;left:0;right:0;text-align:center;font:700 18px 'Space Grotesk',sans-serif;color:var(--coral);pointer-events:none;text-shadow:0 1px 8px #fff}#hud{flex-wrap:wrap;gap:24px;max-width:calc(100% - 45px)}#air{font-size:12px;flex-basis:100%}.best-points b{color:var(--teal)}.speedo{min-width:72px}.speedo i{font-style:normal;font-size:10px;color:var(--muted);margin-left:3px;letter-spacing:.4px}.speedo.hot b{color:var(--coral)}
@media(max-width:600px){.modebar{gap:10px}.modebar>span{font-size:10px;line-height:1.4}.difficulty button{font-size:12px;padding:8px 13px}#hud{gap:17px;top:14px;left:17px}#hud b{font-size:23px}#hud small{font-size:8px;letter-spacing:1px}.best-points{display:none}#trickToast{top:103px;font-size:15px}#proEditor{gap:9px;flex-wrap:wrap}#proEditor label{font-size:11px}.pan-control{min-width:150px}#panLabel{display:none}footer{flex-wrap:wrap}.stage{height:clamp(300px,42vh,470px)}}

/* The world has no fixed course length; tools stay outside the drawing surface. */
#app{max-width:1800px;padding:0 24px}.stage{height:clamp(340px,56vh,760px)}
#proEditor{gap:12px;padding:9px 0;flex-wrap:wrap}.view-tools{display:flex;gap:5px;align-items:center}#proEditor button{padding:8px 11px;font-size:12px}#proEditor>label{margin-left:auto;white-space:nowrap}#panLabel{min-width:100px}
#buildTools{display:flex;gap:5px;align-items:center;flex-wrap:wrap;padding:9px 0;border-bottom:1px solid var(--line)}#buildTools>span{font-size:9px;letter-spacing:1px;color:var(--teal);margin-right:7px}#buildTools button{padding:8px 10px;font-size:12px;background:#e8ede1}#buildTools button.selected{background:var(--ink);color:white}
#fullscreen{font-size:20px;border-radius:9px;min-width:38px;padding:5px 8px}#drawHint{max-width:calc(100% - 40px)}
#drawAssistLabel{margin-left:10px;white-space:nowrap}#scanPhoto{margin-left:4px;white-space:nowrap;padding:10px 12px}.scan-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:18px}.scan-actions .primary{margin-left:auto}#scanKeyWrap{display:flex;justify-content:space-between;gap:12px;margin:14px 0}#scanKeyWrap input{width:65%;height:32px}
#app.immersive{position:fixed;inset:0;z-index:1000;max-width:none;width:100%;height:100dvh;display:flex;flex-direction:column;padding:0 12px;background:var(--paper);overflow:hidden}
.immersive .logo,.immersive .context,.immersive .bottom,.immersive footer,.immersive .canvas-note{display:none}
.immersive header.chrome{height:48px;border-color:transparent}.immersive .mode-tabs{padding:6px 0}.immersive .chrome-end button{padding:6px 10px}.immersive .stage{flex:1;min-height:100px;height:auto;border-radius:12px}
.immersive #proEditor,.immersive #buildTools,.immersive .toolbar{padding:5px 0;flex-shrink:0}.immersive #buildTools{flex-wrap:nowrap;overflow-x:auto}.immersive #buildTools>span,.immersive #buildTools button{flex-shrink:0}.immersive .toolbar button{padding:7px 10px}.immersive #controls{padding:4px 0;flex-shrink:0}.immersive .touch-set button{min-height:46px;font-size:22px}.immersive #controls p{margin:0}.immersive .result-card{padding:10px}.immersive .result-card h1{font-size:32px;margin:4px 0}
@media(max-width:600px){#app{padding:0 10px}.stage{height:52vh;min-height:310px}#proEditor{gap:7px}#proEditor>label{font-size:10px}.view-tools{gap:3px}#proEditor button{font-size:10px;padding:8px}#buildTools{gap:4px}#buildTools button{font-size:11px;padding:8px}#buildTools>span{font-size:8px}.topbar{gap:4px}#fullscreen{min-width:31px;padding:5px}#sound{font-size:16px;min-width:32px}.immersive #app{padding:0 7px}.immersive .toolbar{flex-wrap:nowrap;gap:4px}.immersive .stickers{margin-left:auto}.immersive .toolbar>.primary{min-width:100px}.immersive .toolbar button{font-size:11px;padding:7px}.immersive .stickers button{font-size:19px;min-width:27px;padding:3px}.immersive #proEditor{flex-wrap:nowrap}.immersive #proEditor>label{margin-left:auto}.immersive #proEditor #panLabel{display:none}.immersive .stage{min-height:100px}.immersive .toolgroup{gap:3px}}
@media(max-height:500px) and (orientation:landscape){.immersive #controls{position:absolute;bottom:50px;left:20px;right:20px;pointer-events:none}.immersive #controls .touch-set{pointer-events:auto}.immersive #controls p{display:none}.immersive .touch-set button{opacity:.8}.immersive #hud{top:10px}.immersive #hud b{font-size:22px}.immersive #trickToast{top:70px}}

.immersive footer{display:flex;flex-shrink:0;padding:3px 0;font-size:10px;min-height:17px}.immersive #score{display:none}.immersive footer #status{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}@media(max-width:600px){.canvas-note .scribble{font-size:20px}.canvas-note small{max-width:260px;font-size:10px}.immersive footer{font-size:9px}}


.modebar{flex-wrap:wrap}#playground,#tracksBtn{font-size:12px;padding:9px 12px;color:var(--teal)}#playground.selected{color:white}.modebar #modeHint{margin-left:auto}#accountBtn{font-size:12px;padding:8px 10px;white-space:nowrap}#publishBtn{white-space:nowrap;padding:10px 12px}#resultCompare{color:var(--coral);font-weight:700}#resultBoard{text-align:left;margin:0 auto 16px;padding:0;max-width:280px;font-size:13px;color:var(--ink)}#resultBoard li{display:flex;justify-content:space-between;gap:12px;padding:4px 0;border-bottom:1px solid var(--line)}#resultBoard li.you span:first-child{color:var(--teal);font-weight:700}.result-save{margin:0 auto 14px;max-width:320px;padding:12px 14px;border:1px dashed var(--teal);border-radius:12px;background:#eef6f3}.result-save p{margin:0 0 10px;font-size:13px;color:var(--ink);line-height:1.35}.result-save button{width:100%;border-color:var(--teal);color:#fff;background:var(--teal)}.result-save button:hover{background:#1f5f58}dialog.wide{max-width:640px;width:min(640px,92vw)}dialog form{display:grid;gap:12px;margin-top:16px}dialog form label{display:flex;justify-content:space-between;gap:12px;align-items:center}dialog form input[type=email],dialog form input[type=password],dialog form input[type=text],dialog form input:not([type]){width:65%;height:36px;border:1px solid var(--line);border-radius:8px;padding:0 10px;background:#fff;font:600 14px 'DM Sans',sans-serif;color:var(--ink)}#officialWrap{justify-content:flex-start}#officialWrap input{width:17px;height:17px}.form-error{color:var(--coral);margin:0}.track-list{display:grid;gap:8px;margin-top:16px;max-height:min(60vh,480px);overflow:auto}.track-card{display:flex;align-items:center;gap:12px;width:100%;text-align:left;padding:12px 14px}.track-card b{display:block;font:700 15px 'Space Grotesk',sans-serif}.track-card small{display:block;color:var(--muted);font-size:11px;margin-top:3px}.track-card .time{margin-left:auto;font:700 16px 'Space Grotesk',sans-serif;color:var(--teal);white-space:nowrap}#accountLogout{margin-top:16px}#trickToast{left:15%;right:15%;line-height:1.6;font-size:15px;color:var(--teal);text-shadow:0 1px 5px #fff,0 0 10px #fff}.crash#overlay{background:transparent;backdrop-filter:none;align-items:flex-end;padding-bottom:32px;pointer-events:none}.crash .result-card{pointer-events:auto;background:#f6f3eaf2;border:1px solid var(--line);border-radius:16px;padding:14px 22px;box-shadow:0 5px 30px #243c3b15}.crash h1{font-size:25px;letter-spacing:-.7px;margin:5px 0}.crash #swapResult,.crash .eyebrow{display:none}.crash .result-card p{font-size:11px;margin-bottom:7px}.crash .text-button{display:inline;margin:4px!important}.crash .result-card button{padding:9px 12px;font-size:12px}@media(max-width:600px){.modebar #modeHint{flex-basis:100%;margin:0 0 0 3px}#playground{margin-left:auto;font-size:11px}#trickToast{left:10px;right:10px;top:105px;font-size:12px}.crash .result-card{padding:10px;max-width:calc(100% - 20px)}.crash h1{font-size:23px}}

/* Chrome: one header, one context strip, canvas as hero. */
header.chrome{height:64px;gap:18px}
.tagline,.edition{display:none}
.chrome-end{margin-left:auto;display:flex;align-items:center;gap:8px}
.chrome-end #tracksBtn,.chrome-end #accountBtn{font-size:13px;padding:8px 12px}
.chrome-end #player{border:0;background:#e7eee4;color:var(--teal);padding:8px 12px;font-size:13px}
.chrome-end .icon{min-width:38px}
#sound.off{opacity:.4}
.context{display:flex;align-items:center;gap:12px;padding:8px 0 12px;min-height:44px}
.context .difficulty{flex-shrink:0}
#courseLabel{font:600 14px 'Space Grotesk',sans-serif;color:var(--ink);letter-spacing:-.2px;white-space:nowrap}
#modeHint{font-size:12px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#saveLabel{margin-left:auto;font-size:11px;color:#72857b;letter-spacing:.4px;white-space:nowrap}
.dock{padding-top:12px}
button.quiet{border-color:transparent;color:var(--muted);font-weight:600;padding:10px 12px}
button.quiet:hover{color:var(--ink);background:#e9eee3}
#app.riding .context,#app.riding #library{display:none}
#app.riding header.chrome{border-bottom-color:transparent}
.help-tabs{display:flex;gap:6px;margin:14px 0 18px;flex-wrap:wrap}
.help-tabs button{border:0;background:#e7ecdf;padding:8px 14px}
.help-tabs button.selected{background:var(--ink);color:#fff}
[data-help-panel] p:first-child{margin-top:0}
#welcomeDialog{text-align:left;max-width:420px}
#welcomeDialog h2{margin-bottom:8px}
.welcome-steps{margin:16px 0;padding:0 0 0 22px;font-size:15px;line-height:1.7}
.welcome-steps li{margin:0 0 8px}
.welcome-later{color:var(--muted);font-size:13px}
#helpDone{margin-top:8px}
#presets #playground{font-size:12px;padding:8px 12px;color:var(--teal);border:0}
#presets #playground.selected{background:var(--ink);color:#fff}
#library{padding-top:8px}
@media(max-width:800px){
  header.chrome{display:grid;grid-template-columns:auto 1fr;grid-template-rows:auto auto;align-items:center;gap:8px 10px;height:auto;min-height:0;padding:8px 0 4px}
  .logo{grid-column:1;grid-row:1}
  .chrome-end{grid-column:2;grid-row:1;margin-left:0;justify-self:end;flex-wrap:wrap;justify-content:flex-end}
  .mode-tabs{grid-column:1/-1;grid-row:2;min-width:0;max-width:100%;display:flex}
  .mode-tabs button{flex:1;justify-content:center;text-align:center}
  .chrome-end #tracksBtn,.chrome-end #accountBtn{padding:8px 10px;font-size:12px}
  .chrome-end #player{padding:7px 9px;font-size:12px}
  #modeHint{display:none}
  .context{padding:4px 0 10px;gap:8px}
}
@media(max-width:500px){
  .chrome-end #player{display:none}
}
@media(max-width:500px){
  .chrome-end #accountBtn,.chrome-end #tracksBtn{font-size:11px;padding:7px 8px}
  #saveLabel{display:none}
  .welcome-steps{font-size:14px}
  #sound{font-size:16px;min-width:32px}
  .logo{font-size:24px;letter-spacing:-1px}
  .logo i{display:none}
  header.chrome{gap:8px}
}
.track-cats{display:flex;gap:6px;margin:14px 0 12px;flex-wrap:wrap}
.track-cats button{border:0;background:#e7ecdf;padding:8px 12px;font-size:13px}
.track-cats button.selected{background:var(--ink);color:#fff}
.campaign-progress{position:relative;display:flex;align-items:center;height:22px;background:#e7ecdf;border-radius:999px;overflow:hidden;margin:4px 0 8px}
.campaign-progress span{position:relative;z-index:1;font-size:11px;font-weight:700;padding:0 12px;letter-spacing:.4px}
.campaign-progress i{position:absolute;left:0;top:0;bottom:0;width:0;background:#c5d6c8;border-radius:999px}
.campaign-list{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.campaign-card .num{flex:0 0 36px;font:700 16px 'Space Grotesk',sans-serif;color:var(--teal)}
.campaign-card.done .num{color:var(--ink)}
.blackline-card .num{flex:0 0 44px;font:700 14px 'Space Grotesk',sans-serif;color:var(--ink)}
.track-card.locked{opacity:.55;cursor:default}
.track-card.locked:hover{background:transparent}
.track-main{display:flex;flex-direction:column;gap:8px;min-width:0;flex:1}
.track-scores{display:flex;gap:14px;flex-wrap:wrap}
.track-scores>span{display:flex;flex-direction:column;gap:1px;min-width:0}
.track-scores small{color:var(--muted);font-size:9px;letter-spacing:.08em;text-transform:uppercase;font-weight:700}
.track-scores strong{font:700 15px 'Space Grotesk',sans-serif;color:var(--ink);line-height:1.2}
.track-scores .mine strong{color:var(--teal)}
.track-scores .dig-login{color:var(--teal);text-decoration:underline;text-underline-offset:2px;cursor:pointer}
.track-scores .wr strong{color:var(--coral);font-weight:700}
.track-scores .wr em{font-style:normal;font-weight:600;color:var(--ink)}
.wild-scores{margin-top:4px;width:100%}
.side-board{position:fixed;top:110px;right:18px;z-index:40;display:flex;flex-direction:column;align-items:flex-end;gap:8px;pointer-events:none}
.side-board-fab,.side-board-panel{pointer-events:auto}
.side-board-fab{width:48px;height:48px;border-radius:14px;border:1px solid var(--line);background:#fbfaf4ee;box-shadow:0 8px 24px #243c3b18;font-size:20px;padding:0}
.side-board-panel{width:min(260px,78vw);background:#fbfaf4f2;border:1px solid var(--line);border-radius:14px;padding:12px 14px 10px;box-shadow:0 12px 36px #243c3b1a;backdrop-filter:blur(8px);transition:opacity .35s,transform .35s}
.side-board.collapsed .side-board-panel{opacity:0;transform:translateX(12px);pointer-events:none;position:absolute}
.side-board-panel header{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:8px}
.side-board-panel header strong{font:700 13px 'Space Grotesk',sans-serif;letter-spacing:.02em}
.side-board-panel header button{padding:4px 8px;min-width:0;font-size:16px;line-height:1;border-color:transparent}
#sideBoardList{list-style:none;margin:0;padding:0;max-height:min(42vh,320px);overflow:auto}
#sideBoardList li{display:flex;justify-content:space-between;gap:10px;padding:6px 0;border-bottom:1px solid var(--line);font-size:12px}
#sideBoardList li:last-child{border-bottom:0}
#sideBoardList i{font-style:normal;font-weight:700;color:var(--muted);display:inline-block;min-width:1.2em}
#sideBoardList b{font:700 13px 'Space Grotesk',sans-serif;color:var(--teal);white-space:nowrap}
#sideBoardList li.you{color:var(--ink)}
#sideBoardList li.you b{color:var(--coral)}
.side-board-empty{margin:4px 0 0;font-size:12px;color:var(--muted);line-height:1.4}
@media(max-width:700px){.side-board{top:auto;bottom:110px;right:10px}.side-board-panel{width:min(220px,70vw)}}
.immersive .side-board{display:none!important}
#campaignWrap,#stageWrap{justify-content:flex-start}
#campaignWrap input{width:17px;height:17px}
dialog form select{width:65%;height:36px;border:1px solid var(--line);border-radius:8px;padding:0 10px;background:#fff;font:600 14px 'DM Sans',sans-serif;color:var(--ink)}
#nextCampaign{margin:4px}
dialog.wide{max-width:720px;width:min(720px,94vw)}
@media(max-width:600px){.campaign-list{grid-template-columns:1fr}.track-cats button{padding:8px 10px;font-size:12px}}

.pen-brushes{display:flex;align-items:center;gap:5px;flex-wrap:wrap;margin-left:6px}
.pen-brushes>span{font-size:9px;letter-spacing:1.5px;color:var(--teal);margin-right:4px}
.pen-brushes button{font-size:12px;padding:8px 10px;background:#e8ede1;border-color:transparent}
.pen-brushes button.selected{background:var(--ink);color:#fff;border-color:var(--ink)}
#stickerLayer{position:absolute;inset:0;pointer-events:none;overflow:hidden;z-index:4}
#stickerLayer span{position:absolute;transform:translate(-50%,-78%);line-height:1;user-select:none;font-family:"Apple Color Emoji","Segoe UI Emoji","Noto Color Emoji",emoji,sans-serif;text-shadow:0 1px 0 #fff8,0 0 1px #243c3b22}
.stickers button.sticker-btn,.sticker-tile b{font-family:"Apple Color Emoji","Segoe UI Emoji","Noto Color Emoji",emoji,sans-serif}
.recent-stickers{display:flex;gap:4px;align-items:center}
.recent-stickers button{font-size:22px;padding:5px 8px;border-color:transparent;min-width:42px}
.recent-stickers button.selected{background:#e0eadd;border-color:#28776e}
#stickerCatalogBtn{margin-left:2px}
.sticker-search{display:flex;justify-content:space-between;align-items:center;gap:12px;margin:12px 0 8px;font-size:13px}
.sticker-search input{width:65%;height:36px;border:1px solid var(--line);border-radius:8px;padding:0 10px;background:#fff;font:600 14px 'DM Sans',sans-serif}
.sticker-cats{margin-top:4px}
.sticker-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(88px,1fr));gap:8px;margin-top:12px;max-height:min(52vh,420px);overflow:auto}
.sticker-tile{display:flex;flex-direction:column;align-items:center;gap:4px;padding:10px 6px;border:1px solid var(--line);border-radius:12px;background:#fbfaf4;text-align:center}
.sticker-tile b{font-size:28px;line-height:1}
.sticker-tile small{font-size:10px;color:var(--muted);line-height:1.2}
.sticker-tile.selected{background:#e0eadd;border-color:#28776e}
.sticker-tile:hover{background:#e9eee3}
.scenery-tools{display:flex;align-items:center;gap:6px}
.scenery-tools>span{font-size:10px;letter-spacing:.08em;color:var(--muted);font-weight:700}
.scenery-btn{padding:3px 5px;min-width:0;line-height:0}
.scenery-btn canvas{display:block;border-radius:4px}
.scenery-btn.selected{background:#e0eadd;border-color:#28776e}
.scenery-tile canvas{display:block;border-radius:8px;margin-bottom:2px}
@media(max-width:600px){.pen-brushes{margin-left:0}.pen-brushes button{font-size:11px;padding:7px 8px}.sticker-grid{grid-template-columns:repeat(auto-fill,minmax(72px,1fr))}.scenery-tools>span{display:none}}


/* Optional skill goals stay separate from timed races. */
.challenge-bar{display:flex;align-items:center;gap:16px;flex-wrap:wrap;padding:10px 14px;margin:8px 0;background:#263e38;color:#faf8ec;border-radius:10px;font-size:12px}
.challenge-bar label{display:flex;align-items:center;gap:12px;font-weight:800;letter-spacing:1px}
.challenge-bar select{max-width:100%;font:600 13px inherit;letter-spacing:0;color:#faf8ec;background:#36534a;border:1px solid #719083;border-radius:6px;padding:7px}
.challenge-bar>span{color:#d6e6d5}
.challenge-live{position:absolute;bottom:42px;left:50%;transform:translateX(-50%);max-width:90%;white-space:nowrap;padding:8px 16px;border:1px solid #36534a;background:#fbfaf4ed;color:#263e38;border-radius:5px;font-size:12px;font-weight:800;pointer-events:none;letter-spacing:.4px}
.challenge-live.ready{background:#263e38;color:#edbd67;border-color:#edbd67}
.challenge-result{font-weight:700;color:#687b71!important;font-size:13px!important}
.challenge-result.complete{color:#28776e!important;letter-spacing:1px}
@media(max-width:600px){.challenge-bar{gap:6px;padding:10px}.challenge-bar label{flex-wrap:wrap;gap:6px;font-size:10px}.challenge-bar select{font-size:12px}.challenge-live{font-size:10px;padding:6px 9px}}
@media(max-width:600px){.bottom{flex-wrap:wrap;row-gap:10px}.bottom>.assist{margin-left:0}.challenge-bar label{min-width:0}.challenge-bar select{font-family:inherit;font-weight:600}}
#presets{flex-wrap:wrap;min-width:0;max-width:100%}
@media(max-width:600px){#presets{row-gap:6px}.context{flex-wrap:wrap}.context #courseLabel{min-width:0;overflow-wrap:anywhere}}

.wild-list{display:grid;grid-template-columns:1fr 1fr;gap:12px;padding:8px 0}
.wild-card{display:flex;flex-direction:column;align-items:flex-start;gap:7px;text-align:left;background:#f8f7f0;border:1px solid var(--line);border-top:3px solid var(--course-color);border-radius:10px;padding:14px;min-width:0}
.wild-card:hover{background:#edf0e5;border-color:var(--course-color)}
.wild-card canvas{width:100%;height:auto;aspect-ratio:20/7;touch-action:auto;background:#eaf0e6;border-radius:5px}
.wild-card small{color:var(--course-color);font-size:9px;letter-spacing:1.2px;font-weight:800}
.wild-card strong{font:700 23px 'Space Grotesk',sans-serif;letter-spacing:-.8px}
.wild-card>span{font-size:12px;line-height:1.5;color:#60786d;font-weight:400}
@media(max-width:550px){.wild-list{grid-template-columns:1fr}.wild-card strong{font-size:21px}}