.race-toolbar{display:flex;align-items:center;gap:16px;padding:5px 3px 14px;font-size:13px;color:#31536d;font-weight:800}.race-pill{background:#fff4cf;color:#725400;padding:7px 12px;border-radius:999px}.race-toolbar button{margin-left:auto;border:1px solid #cde6f5;background:white;border-radius:10px;padding:7px 12px;color:#087fc2;font:inherit;cursor:pointer}.course-note{font-size:12px;color:#60778c;margin:0 4px 12px}.course-viewport{max-height:74vh;overflow:auto;border-radius:18px;border:2px solid #75b64d;scrollbar-color:#8dbb40 #e2f5bd;scrollbar-width:thin;position:relative}.race-course{position:relative;isolation:isolate;width:100%;min-height:300px;aspect-ratio:1670/941;background:#79c52c url('./assets/stadium.png') center/100% 100% no-repeat;image-rendering:pixelated;overflow:hidden}.race-course.running:after{content:'';position:absolute;left:10%;right:8%;top:24%;bottom:7%;background:repeating-linear-gradient(transparent 0,transparent calc(100% / var(--rows) - 1px),#ffffff0d calc(100% / var(--rows) - 1px),#ffffff0d calc(100% / var(--rows)));pointer-events:none;z-index:-1}.race-course.large{aspect-ratio:auto;height:var(--course-height)}.race-cat{position:absolute;left:0;top:0;width:var(--cat-size);height:var(--cat-size);will-change:transform;z-index:3}.cat-sprite,.result-cat{display:block;background-image:url('./assets/cats.png');background-size:500% 600%;background-position:var(--cat-x) var(--cat-y);background-repeat:no-repeat;image-rendering:pixelated}.cat-sprite{position:absolute;inset:0;transform-origin:50% 90%;filter:drop-shadow(0 2px 0 #36572255)}.running .race-cat .cat-sprite{animation:catStride .18s steps(2,end) infinite;animation-delay:var(--phase)}.race-cat.falling .cat-sprite{animation:catTumble .55s ease-out both!important}.race-cat.finished .cat-sprite{animation:none!important}.cat-label{position:absolute;right:100%;top:50%;transform:translate(-5px,-50%);max-width:clamp(52px,10vw,130px);padding:3px 6px;border:1px solid #234d20;border-radius:5px;background:#fffff2ed;color:#18334b;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:900;font-size:clamp(8px,.8vw,12px);line-height:1.2;box-shadow:2px 2px 0 #254a2733}.cat-bubble{display:none;position:absolute;left:10%;bottom:100%;background:white;border:2px solid #38482b;padding:3px 6px;border-radius:7px;font-size:clamp(9px,.85vw,13px);font-weight:900;white-space:nowrap;z-index:20}.falling .cat-bubble{display:block}.cat-rank{position:absolute;right:-3px;bottom:-3px;min-width:16px;height:16px;background:#123b63;color:white;border:1px solid white;text-align:center;font:900 10px/14px system-ui;border-radius:5px}.race-count{position:sticky;top:10px;left:10px;width:44px;height:44px;display:grid;place-items:center;color:white;background:#123b63e6;border:2px solid #fff;border-radius:12px;font-size:22px;font-weight:900;z-index:30;margin:10px}.race-course:not(.running) .race-count{opacity:.8}.history-item.is-picked{background:#f0faff;border-radius:8px}.history-item.is-last .history-position{background:#fff0cf;color:#875b00}.history-item small{color:#6f8493;font-size:10px}.history-item .history-name{flex:1}.start:disabled{cursor:not-allowed}.history-description{line-height:1.6}.race-results{border:0;padding:22px;border-radius:23px;background:#f2f9ff;width:min(850px,94vw);max-height:94vh;overflow:auto;color:#123b63;box-shadow:0 20px 80px #123b6366;text-align:center}.race-results::backdrop{background:#123b63aa;backdrop-filter:blur(5px)}.results-top{display:flex;gap:15px;align-items:center;justify-content:space-between;margin:0 0 16px}.results-top h2{font-size:23px;margin:0}.close-results{border:1px solid #d7e6f2;background:white;color:#123b63;border-radius:12px;width:38px;height:38px;font-size:25px;cursor:pointer;flex:none}.result-boards{display:grid;grid-template-columns:1fr 1fr;gap:22px;max-width:720px;margin:auto}.pixel-board{position:relative;aspect-ratio:1122/1402;image-rendering:pixelated}.pixel-board>img{width:100%;height:100%;object-fit:contain;display:block}.board-row{position:absolute;left:28%;width:64%;height:12%;display:flex;align-items:center;gap:5%;padding:0 3%;}.row-1{top:34.4%}.row-2{top:53.6%}.row-3{top:72.9%}.board-row strong{display:flex;align-items:center;justify-content:center;width:71%;height:100%;color:#fff7bd;font-size:clamp(10px,1.6vw,21px);font-weight:900;line-height:1.15;overflow-wrap:anywhere}.result-cat{width:28%;aspect-ratio:1;flex:none}.loser-name{position:absolute;top:55.5%;left:12%;width:76%;height:14.5%;display:flex;align-items:center;justify-content:center;padding:0 5%;color:#633517;font-size:clamp(12px,2vw,25px);line-height:1.2;overflow-wrap:anywhere;font-weight:900}.loser-ribbon{position:absolute;left:23%;top:79%;width:54%;color:#fff5bd;font-size:clamp(10px,1.4vw,18px);font-weight:900;line-height:1.3}.results-note{font-size:12px;color:#60778c;margin:15px 0}.race-results>.start{margin-top:0}.race-preview-hint{position:absolute;left:30%;right:15%;top:12%;text-align:center;color:#123b63;font-weight:900;font-size:13px;background:#ffffffe0;padding:8px;border-radius:10px}.settings-control .toggle-block{margin-bottom:9px}.race-course .cat-label{pointer-events:none}
@keyframes catStride{0%{transform:translateY(0) rotate(-4deg) scaleX(1.03)}50%{transform:translateY(-5px) rotate(4deg) scaleX(.96)}100%{transform:translateY(0) rotate(-4deg) scaleX(1.03)}}@keyframes catTumble{0%{transform:rotate(0)}55%{transform:rotate(80deg) translateY(4px)}100%{transform:rotate(65deg) translateY(3px)}}
@media(max-width:640px){.race-toolbar{gap:8px;flex-wrap:wrap;font-size:11px}.race-course{min-height:240px}.course-viewport{max-height:65vh}.result-boards{gap:9px}.race-results{padding:12px}.results-top h2{font-size:18px}.board-row{padding:0 2%;gap:2%}.board-row strong{font-size:clamp(8px,2.5vw,14px)}.loser-name{font-size:clamp(9px,3vw,16px)}.loser-ribbon{font-size:10px}.race-count{height:35px;width:35px;font-size:18px}.cat-label{max-width:70px;font-size:8px}.race-pill{padding:6px 9px}}
@media(prefers-reduced-motion:reduce){.cat-sprite{animation:none!important}}

.cat-sprite{clip-path:inset(0 7% 0 0)}

/* Entire background remains visible: no inner scrolling and no stretched field. */
.course-viewport{max-height:none;overflow:hidden;background:#eaf7ff;scrollbar-width:none;display:flex;justify-content:center;align-items:center}
.race-course,.race-course.large{width:min(100%,calc(68svh * 1670 / 941));height:auto;min-height:0;aspect-ratio:1670 / 941;background-size:100% 100%;flex:none;margin:0 auto}
.race-course .cat-label{font-size:var(--label-font,11px);padding:var(--label-padding,3px) 4px;line-height:1;border-radius:3px;border-width:1px}
.race-course .cat-rank{width:14px;min-width:14px;height:14px;font-size:8px;line-height:12px;right:-6px;bottom:-4px}
.race-toolbar #enableMusic{margin-left:auto;background:#fff4cf;border-color:#f2d064;color:#725400}
@media(max-height:520px){.race-course,.race-course.large{width:min(100%,calc(72svh * 1670 / 941))}}
