:root{color:#1f2a33;font-family:Trebuchet MS,system-ui,sans-serif}*{box-sizing:border-box}html,body{background:#9fd4f0;height:100%;margin:0;overflow:hidden}#app canvas{touch-action:none;cursor:grab;display:block}#app canvas:active{cursor:grabbing}.panel{background:#fffcf4f0;border:2px solid #2b3a46;border-radius:10px;position:fixed;box-shadow:0 4px #2b3a46}#toolbar{flex-direction:column;gap:6px;width:170px;max-height:calc(100vh - 28px);padding:10px;display:flex;top:14px;left:14px;overflow-y:auto}.title{letter-spacing:.5px;text-align:center;font-size:20px;font-weight:800}.group{flex-direction:column;gap:6px;display:flex}.group.view{flex-direction:row}.group.view button{flex:1;justify-content:center}button{font:inherit;color:#1f2a33;cursor:pointer;text-align:left;background:#fff;border:2px solid #2b3a46;border-radius:7px;align-items:center;gap:8px;padding:7px 9px;font-size:14px;display:flex;box-shadow:0 2px #2b3a46}button:hover{background:#fff3cf}button:active{box-shadow:none;transform:translateY(2px)}button:disabled{opacity:.4;cursor:default}button.primary{background:#ffcf3f;justify-content:center;font-weight:700}button.primary.on{background:#ff7b5c}button .key{opacity:.6;border:1px solid;border-radius:4px;margin-left:auto;padding:0 4px;font-size:11px}button svg{flex:none;width:26px;height:26px}#status{white-space:nowrap;padding:8px 16px;font-weight:700;top:14px;left:50%;transform:translate(-50%)}#status.bad{background:#ffd9d2}#status.good{background:#d6f5d9}#help{opacity:.85;max-width:290px;padding:8px 12px;font-size:12px;line-height:1.5;top:14px;right:14px}@media (width<=600px){#toolbar{width:170px}#help{display:none}}button.mode{background:#e7ecef;justify-content:center;font-weight:700}button.mode.on{background:#bfe8c4}#buildbar{gap:6px;max-width:calc(100vw - 28px);padding:6px 8px 8px;transition:transform .18s,opacity .18s;display:flex;bottom:14px;left:50%;overflow-x:auto;transform:translate(-50%)}#buildbar.hidden{opacity:0;visibility:hidden;pointer-events:none;transform:translate(-50%,140%)}.bgroup{flex-direction:column;gap:3px;padding:0 5px;display:flex}#buildbar{scrollbar-width:none}.bgroup+.bgroup{border-left:2px dashed #2b3a4640}.btitle{text-transform:uppercase;letter-spacing:.6px;opacity:.6;text-align:center;font-size:10px;font-weight:800}.brow{gap:5px;display:flex}button.bpiece{text-align:center;flex-direction:column;flex:none;justify-content:center;gap:1px;min-width:52px;height:56px;padding:4px 4px 3px;font-size:10.5px;line-height:1.1;position:relative}button.bpiece svg{width:26px;height:26px}button.bpiece .key{margin:0;padding:0 3px;font-size:9px;position:absolute;top:2px;right:3px}button.bpiece.current{background:#fff3cf}button.bpiece.blocked{opacity:.45}.bpage{gap:6px;display:flex}.bpage[hidden]{display:none}button.bpiece[data-slope]:not([data-slope=""]):after{content:attr(data-slope);color:#d9531e;font-size:12px;font-weight:800;position:absolute;top:1px;left:4px}button.bpiece:disabled{opacity:.3}.section{text-transform:uppercase;letter-spacing:.6px;opacity:.55;margin:2px 0 -4px;font-size:10px;font-weight:800}.seg{gap:4px;display:flex}.seg button{text-align:center;flex-direction:column;flex:1;justify-content:center;gap:0;padding:5px 2px;font-size:18px}.seg button span{font-size:11px}.seg.small button{flex-direction:row;padding:5px 2px;font-size:13px;font-weight:700}.seg button.on{background:#bfe8c4}.bpage{flex-direction:column;align-items:center;gap:4px}.bline{justify-content:center;gap:6px;display:flex}#board{min-width:250px;padding:8px 10px;font-size:12.5px;top:132px;right:14px}#board[hidden]{display:none}#board .row{align-items:center;gap:6px;padding:2px 0;display:flex}#board .pos{width:22px;font-weight:800}#board .dot{border:2px solid #2b3a46;border-radius:50%;width:12px;height:12px}#board .who{flex:1;font-weight:700}#board .num{text-align:right;font-variant-numeric:tabular-nums;min-width:46px}.seg.grid{grid-template-columns:1fr 1fr;display:grid}#logo{letter-spacing:.5px;cursor:pointer;z-index:5;background:#fffcf4f0;border:2px solid #2b3a46;border-radius:10px;padding:6px 14px;font-size:20px;font-weight:800;position:fixed;top:14px;left:14px;box-shadow:0 4px #2b3a46}#logo .trackname{opacity:.75;font-size:14px;font-weight:700}#logo .trackname b{color:#e8352b}#help{max-width:360px;padding:10px 14px;font-size:12px;line-height:1.6;top:14px;right:14px}#help[hidden]{display:none}#editor{flex-direction:column;align-items:flex-start;gap:8px;max-width:calc(100vw - 28px);display:flex;position:fixed;bottom:12px;left:50%;transform:translate(-50%)}.dgroup{gap:5px;display:flex}.dgroup+.dgroup{border-left:2px dashed #2b3a4640;padding-left:8px}#dock button.card svg{width:22px;height:22px}#catalog{flex-direction:column-reverse;align-items:flex-start;gap:8px;display:flex}#catalog[hidden]{display:none}.crow{box-sizing:border-box;background:#fffcf4f0;border:2px solid #2b3a46;border-radius:10px;align-items:stretch;gap:5px;min-height:64px;padding:5px 6px;display:flex;box-shadow:0 4px #2b3a46}.ctitle,.mtitle{text-transform:uppercase;letter-spacing:.3px;opacity:.6;text-align:center;font-size:9px;font-weight:800}.ctitle{align-self:center;width:54px;margin-right:2px}.mgroup{border-right:2px dashed #2b3a4640;align-items:center;gap:6px;margin-right:2px;padding-right:8px;display:flex}.mgroup .mtitle{width:54px}.mrow{gap:6px;display:flex}button.card{text-align:center;border-radius:6px;flex-direction:column;flex:none;justify-content:center;gap:0;width:56px;height:50px;padding:8px 2px 2px;font-size:9.5px;line-height:1.05;position:relative}button.card svg{width:22px;height:22px}button.card .num{opacity:.5;font-size:9px;font-weight:800;position:absolute;top:1px;left:4px}button.card.on,button.card.open{background:#ffcf3f}button.card.current{background:#fff3cf;box-shadow:0 2px #2b3a46,inset 0 0 0 2px #ffcf3f}button.card.blocked{opacity:.45}button.card:disabled{opacity:.35}button.card[data-slope]:not([data-slope=""]):after{content:attr(data-slope);color:#d9531e;font-size:12px;font-weight:800;position:absolute;top:1px;right:5px}#board{top:70px;right:14px}.modal{z-index:20;flex-direction:column;gap:12px;min-width:330px;padding:16px 18px;display:flex;top:50%;left:50%;transform:translate(-50%,-50%)}.modal[hidden],#hud[hidden],#countdown[hidden]{display:none}.rstitle{text-align:center;font-size:22px;font-weight:900}.rsrow{align-items:center;gap:10px;display:flex}.rslabel{width:92px;font-size:13px;font-weight:800}.rsseg{gap:6px;display:flex}.rsseg button{justify-content:center;min-width:46px;font-weight:700}.rsseg button.on{background:#ffcf3f}.rshint{opacity:.8;text-align:center;font-size:12px;line-height:1.5}.rsactions{justify-content:flex-end;gap:8px;display:flex}.rsactions button{justify-content:center}.rtable{flex-direction:column;gap:2px;font-size:13px;display:flex}.rtable .row,#board .row{border-radius:6px;align-items:center;gap:6px;padding:3px 4px;display:flex}.rtable .row.me,#board .row.me{background:#fff3cf}.rtable .pos{width:26px;font-weight:900}.rtable .dot{border:2px solid #2b3a46;border-radius:50%;width:12px;height:12px}.rtable .who{flex:1;min-width:80px;font-weight:800}.rtable .num{text-align:right;font-variant-numeric:tabular-nums;min-width:62px}#countdown{color:#ffcf3f;-webkit-text-stroke:4px #2b3a46;text-shadow:0 8px #2b3a46;pointer-events:none;z-index:15;font-size:120px;font-weight:900;position:fixed;top:38%;left:50%;transform:translate(-50%,-50%)}#hud{flex-direction:column;align-items:center;gap:2px;padding:8px 16px;display:flex;bottom:12px;left:50%;transform:translate(-50%)}#hud .hrow{gap:18px;font-size:14px;display:flex}#hud .speed{font-variant-numeric:tabular-nums;font-size:34px;font-weight:900;line-height:1.1}#hud .speed small{margin-left:4px;font-size:13px}#hud .pedals{gap:8px;font-size:11px;display:flex}#hud .pedals span{opacity:.6;border:2px solid #2b3a46;border-radius:6px;padding:1px 6px}#hud .pedals span.on{opacity:1;background:#ffcf3f}#editor[hidden]{display:none}.mgroup.left{border-left:2px dashed #2b3a4640;border-right:none;margin:0 0 0 2px;padding:0 0 0 8px}#library{width:min(760px,100vw - 28px);max-height:calc(100vh - 60px)}.lhead{justify-content:space-between;align-items:center;display:flex}.lclose{justify-content:center;width:36px}.lcurrent{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.lcurrent input{min-width:180px;font:inherit;background:#fff;border:2px solid #2b3a46;border-radius:7px;flex:1;padding:7px 10px;font-size:15px;font-weight:700}.lgrid{grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:10px;max-height:52vh;padding:2px 2px 6px;display:grid;overflow-y:auto}.lcard{background:#fff;border:2px solid #2b3a46;border-radius:9px;flex-direction:column;gap:3px;padding:6px;display:flex;box-shadow:0 2px #2b3a46}.lcard.open{background:#fff3cf}.lcard img{aspect-ratio:240/150;background:#9fd4f0;border-radius:5px;width:100%;display:block}.lname2{text-overflow:ellipsis;white-space:nowrap;font-size:14px;font-weight:800;overflow:hidden}.ldate{opacity:.65;font-size:11px}.lactions{gap:4px;margin-top:3px;display:flex}.lactions button{justify-content:center;padding:4px 7px;font-size:12px}.lactions button.primary{flex:1}.lempty{text-align:center;opacity:.7;grid-column:1/-1;padding:24px 0}.lfoot{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.lhint{opacity:.65;font-size:11px}.popmenu{z-index:12;flex-direction:column;align-items:stretch;gap:8px;padding:8px 10px;display:flex;transform:translate(-50%)}.popmenu[hidden]{display:none}.popmenu .mtitle{text-align:left}.popmenu .rsseg button{gap:5px}.popmenu .dot{border:2px solid #2b3a46;border-radius:50%;width:10px;height:10px;display:inline-block}.popmenu .primary{justify-content:center}html,body{overscroll-behavior:none;-webkit-tap-highlight-color:transparent}body{-webkit-user-select:none;user-select:none}input{-webkit-user-select:text;user-select:text}button{touch-action:manipulation}#racecontrols[hidden]{display:none}#racecam{top:calc(60px + env(safe-area-inset-top));right:calc(14px + env(safe-area-inset-right));z-index:16;justify-content:center;font-weight:700;position:fixed}body.touch #racecam{display:none}#board{top:106px}#raceexit{top:calc(14px + env(safe-area-inset-top));right:calc(14px + env(safe-area-inset-right));z-index:16;justify-content:center;font-weight:800;position:fixed}.pedal{display:none}body.touch .pedal{bottom:calc(18px + env(safe-area-inset-bottom));z-index:16;touch-action:none;border-width:3px;border-radius:50%;justify-content:center;align-items:center;width:108px;height:108px;font-size:15px;font-weight:900;display:flex;position:fixed;box-shadow:0 5px #2b3a46}body.touch .pedal.brake{left:calc(18px + env(safe-area-inset-left));background:#f4f1ea}body.touch .pedal.gas{right:calc(18px + env(safe-area-inset-right));background:#ffcf3f}body.touch .pedal.on{filter:brightness(.92);transform:translateY(4px);box-shadow:0 1px #2b3a46}body.touch #hud{top:calc(12px + env(safe-area-inset-top));bottom:auto}body.touch #board{top:auto;bottom:calc(140px + env(safe-area-inset-bottom))}@media (width<=760px){#logo{top:calc(8px + env(safe-area-inset-top));padding:4px 10px;font-size:15px;left:8px}#logo .trackname{font-size:11px}#status{top:calc(52px + env(safe-area-inset-top));white-space:normal;text-align:center;max-width:calc(100vw - 16px);padding:5px 10px;font-size:12px}#help{display:none!important}#board{min-width:0;padding:6px 8px;font-size:11px;right:8px}#board .num{min-width:36px}#editor{bottom:calc(6px + env(safe-area-inset-bottom));gap:6px;max-width:calc(100vw - 12px)}.crow{scrollbar-width:none;touch-action:pan-x;gap:4px;max-width:calc(100vw - 12px);min-height:54px;padding:4px 5px;overflow-x:auto}.crow::-webkit-scrollbar{display:none}button.card{width:46px;height:42px;padding:7px 1px 1px;font-size:8.5px}button.card svg,#dock button.card svg{width:18px;height:18px}.ctitle,.mtitle{display:none}.mgroup,.mgroup.left{margin-left:1px;padding-left:5px}.dgroup{gap:4px}.dgroup+.dgroup{padding-left:5px}#dock{scroll-snap-type:x proximity;overscroll-behavior-x:contain}#dock button.card{scroll-snap-align:start}.modal{width:calc(100vw - 24px);min-width:0;max-height:calc(100vh - 24px);padding:12px;overflow-y:auto}.rsrow{flex-wrap:wrap;gap:6px}.rslabel{width:auto}.rtable .num{min-width:48px}#countdown{font-size:90px}#hud .hrow{gap:10px;font-size:12px}#hud .speed{font-size:26px}.popmenu{max-width:calc(100vw - 16px)}}body.racing #logo{display:none}.rshint.left{text-align:left;margin:-6px 0 0 102px}.rsseg.swatches{flex-wrap:wrap;gap:6px}button.swatch{border-radius:50%;width:28px;min-width:0;height:28px;padding:0;box-shadow:0 2px #2b3a46}button.swatch.on{outline-offset:1px;outline:3px solid #ffcf3f}@media (width<=760px){.rshint.left{margin-left:0}}