/* Rank stays above gameplay HUD and below menus. It never captures controls. */
#raceRank{position:absolute;right:18px;top:94px;z-index:4;min-width:146px;padding:10px 16px 12px;border:2px solid #ead4ff;border-radius:18px;background:linear-gradient(145deg,#683899ed,#192a45ed);box-shadow:0 5px 20px #050b2380;pointer-events:none;text-align:center;font-variant-numeric:tabular-nums;text-shadow:0 2px 3px #130520}
#raceRankCaption{display:block;font-size:13px;font-weight:750;letter-spacing:.1em}
#raceRankNumber{font-size:66px;line-height:1.08;font-weight:900;color:#fff1a8}
.race-rank-unit{font-size:24px;font-weight:800;margin-left:3px}
#raceRankTotal{font-size:14px;margin-left:9px;color:#eee4fa}
#raceRankDetail{display:block;font-size:12px;font-weight:700}
#raceFinishBanner{position:absolute;left:50%;top:18%;transform:translateX(-50%);z-index:4;color:#fff1a8;font-size:clamp(36px,7vw,84px);line-height:1;font-weight:900;letter-spacing:.07em;text-shadow:0 3px #542b81,0 6px 20px #09081a;pointer-events:none}
/* The board scales as one 9:16 plane. Alpha belongs to backgrounds only.
   Approved header/buttons already carry their own alpha, so no second panel
   background is composited beneath their artwork. */
body.race-results-open #pause{background:transparent;backdrop-filter:none;pointer-events:none;padding:calc(12px + env(safe-area-inset-top)) calc(12px + env(safe-area-inset-right)) calc(12px + env(safe-area-inset-bottom)) calc(12px + env(safe-area-inset-left))}
body.race-results-open #pause>.box{width:min(calc(100vw - 24px - env(safe-area-inset-left) - env(safe-area-inset-right)),calc((100dvh - 24px - env(safe-area-inset-top) - env(safe-area-inset-bottom))*9/16));max-width:none;max-height:none;padding:0;border:0;border-radius:0;background:none;box-shadow:none;overflow:visible;pointer-events:none}
body.race-results-open #pause>.box>:not(#raceResults){display:none}
#raceResults{position:relative;isolation:isolate;container-type:inline-size;aspect-ratio:9/16;margin:0;text-align:left;pointer-events:auto;color:#fff;--result-panel-background:rgba(16,20,55,.63);background:linear-gradient(to bottom,transparent 0 28.125%,var(--result-panel-background) 28.125% 82.8%,transparent 82.8% 96.9%,var(--result-panel-background) 96.9% 100%);border:2px solid #ee9fec;border-radius:3.6% / 2%;box-shadow:0 0 0 2px #642cc6,0 0 0 4px #f0bf6680,0 0 18px #6621ab80;font-family:system-ui,'Noto Sans JP',sans-serif;font-weight:800}
#raceResults::before,#raceResults::after{content:'';position:absolute;z-index:-1;pointer-events:none;inset:27.5% 1.1% 1%;border-left:2px solid #9755ff;border-right:2px solid #64c9ff;border-bottom:2px solid #efaceb;border-radius:0 0 3% 3%}
#raceResults::after{inset:28% 2% 1.5%;border-color:#f6c57180}
.race-results-header{position:absolute;left:0;top:0;width:100%;height:28.125%;object-fit:fill;pointer-events:none}
.race-results-sr{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip-path:inset(50%)!important;white-space:nowrap!important;border:0!important}
#raceResultsRows{position:absolute;left:5.8%;right:5.8%;top:28.8%;height:53.1%;list-style:none;margin:0;padding:0;display:grid;grid-template-rows:repeat(9,minmax(0,1fr));gap:.42cqw}
.race-result-row{position:relative;display:grid;grid-template-columns:16% minmax(0,1fr) 29% 11%;align-items:center;column-gap:2%;min-height:0;padding:0 1.4%;border:1px solid #ae83f4;border-radius:2cqw;background:linear-gradient(105deg,#263c6d24,#3c248128);box-shadow:inset 0 0 0 1px #68c6ff80;text-shadow:0 .2cqw .15cqw #080615}
.race-result-place{position:relative;display:flex;flex-direction:column;justify-content:center;align-items:center;width:88%;height:84%;font-size:6.6cqw;line-height:.92;color:#fff;font-weight:900;font-variant-numeric:tabular-nums;background:linear-gradient(135deg,#b2e4ff,#24539a 20%,#142443 65%,#76b0ed);border:1px solid #afd8ff;border-radius:1.5cqw .3cqw 1.5cqw .3cqw;box-shadow:inset 0 0 0 .3cqw #c2c9ff80;text-shadow:.18cqw .18cqw #080615,-.12cqw -.12cqw #080615}
.race-result-row[data-place="1"] .race-result-place{background:linear-gradient(135deg,#fff6bd,#d99720 22%,#5f2e08 65%,#ffda7d);border-color:#ffe4a2}
.race-result-row[data-place="2"] .race-result-place{background:linear-gradient(135deg,#ffffff,#bfc3c8 22%,#555b63 65%,#e8eaed);border-color:#f1f3f5;box-shadow:inset 0 0 0 .3cqw #e3e5e880}
.race-result-row[data-place="3"] .race-result-place{background:linear-gradient(135deg,#ffe0ad,#b96930 22%,#602105 65%,#e9ad70);border-color:#ffd190}
.race-result-place small{font-size:1.5cqw;line-height:1.3;margin-top:.2cqw;letter-spacing:0}
.race-result-name{font-size:4.7cqw;font-weight:900;white-space:nowrap;letter-spacing:-.065em;line-height:1.1;overflow:hidden;text-overflow:ellipsis}
.race-result-record{font-size:3.65cqw;font-weight:850;white-space:nowrap;line-height:1.15;font-variant-numeric:tabular-nums;text-align:center;letter-spacing:-.035em}
.race-result-record small{display:block;font-size:1.8cqw;line-height:1.3;margin-top:.15cqw;color:#f1eaff}
.race-result-portrait{aspect-ratio:1;width:100%;padding:2%;border:1px solid #ffd1e7;border-radius:1.25cqw;background:#11193680;box-shadow:0 0 0 1px #ab8eff,inset 0 0 0 1px #68c9ff;overflow:hidden}
.race-result-portrait img{display:block;width:100%;height:100%;object-fit:contain;opacity:1}
.race-result-player{border:2px solid #ffd582;background:linear-gradient(100deg,#ae164485,#730d4780);box-shadow:inset 0 0 0 1px #ff73b4,0 0 .7cqw #f496cfb0}
.race-result-player::before{content:'';position:absolute;left:-3.5%;top:31%;width:0;height:0;border-top:1.7cqw solid transparent;border-bottom:1.7cqw solid transparent;border-left:2.6cqw solid #ffda78;filter:none}
.race-result-player .race-result-portrait{border-color:#ffe183;box-shadow:0 0 0 1px #ffc738,inset 0 0 0 1px #ff8de2}
.race-result-unfinished .race-result-record{font-size:2.7cqw}
.race-results-actions{position:absolute;left:4.6%;right:4.6%;top:83%;height:13.7%;display:flex;flex-direction:column;justify-content:space-between;gap:.45cqw}
.race-results-actions button{display:block;width:100%;height:53%;padding:0;border:0;border-radius:2cqw;background:transparent;position:relative}
.race-results-actions button+button{height:45%}
.race-results-actions button img{display:block;width:100%;height:100%;object-fit:fill;pointer-events:none}
.race-results-actions button:hover,.race-results-actions button:focus-visible,.race-results-actions button.selected{background:transparent;outline:2px solid #ffeeb8;outline-offset:1px;box-shadow:0 0 1cqw #ffe6a4}
#raceResultsNote,#raceResultsHint{position:absolute;left:3%;right:3%;margin:0!important;text-align:center;color:#fff0fb;white-space:nowrap;font-weight:600;line-height:1;font-size:1.65cqw;text-shadow:0 1px #101437}
#raceResultsNote{top:97.3%}#raceResultsHint{top:98.7%;font-size:1.4cqw}
.mobile #raceRank{left:calc(10px + env(safe-area-inset-left));right:auto;top:calc(46px + env(safe-area-inset-top));min-width:106px;width:106px;padding:6px;border-radius:12px}
.mobile #raceRankCaption{font-size:11px}.mobile #raceRankNumber{font-size:48px}.mobile .race-rank-unit{font-size:17px}.mobile #raceRankTotal{display:block;font-size:11px;margin:0}.mobile #raceRankDetail{font-size:10px}
.mobile #minimap{left:calc(124px + env(safe-area-inset-left))}
.mobile #raceFinishBanner{top:44%;font-size:42px}