:root{color-scheme:light;--ink:#172044;--muted:#6d7390;--purple:#6c55e8;--blue:#3979f6;--pink:#ff5e91;--line:#e3e7f4;--panel:#fff;--bg:#f5f7ff}
*{box-sizing:border-box}
html{min-height:100%;overflow-x:hidden;overflow-y:auto;background:var(--bg)}
body.ball-page{min-width:0;min-height:100%;margin:0;overflow-x:hidden;overflow-y:auto;background:radial-gradient(circle at 12% 5%,#dff7ff 0,transparent 25rem),radial-gradient(circle at 95% 18%,#efe6ff 0,transparent 28rem),var(--bg);color:var(--ink);font-family:Pretendard,"Noto Sans KR",system-ui,-apple-system,sans-serif;-webkit-font-smoothing:antialiased}
button,a,textarea{font:inherit}
button,a{touch-action:manipulation}
button{cursor:pointer}
.ball-topbar{position:sticky;top:0;z-index:80;display:flex;align-items:center;justify-content:space-between;gap:16px;width:100%;padding:12px max(18px,calc((100vw - 1240px)/2));border-bottom:1px solid rgba(100,112,165,.16);background:rgba(255,255,255,.92);box-shadow:0 7px 25px rgba(36,48,99,.08);backdrop-filter:blur(18px)}
.ball-brand{display:flex;align-items:center;gap:11px;min-width:0;color:var(--ink);text-decoration:none}
.ball-brand-mark{display:grid;place-items:center;width:43px;height:43px;border-radius:50%;background:linear-gradient(145deg,#54cbff,#6557ed);box-shadow:inset -6px -7px 11px rgba(35,35,132,.24),0 6px 15px rgba(61,104,218,.25);color:#fff;font-size:23px}
.ball-brand span:last-child{display:flex;flex-direction:column;line-height:1.08}.ball-brand small{color:#737b9a;font-size:9px;font-weight:900;letter-spacing:.13em}.ball-brand strong{font-size:21px;font-weight:1000}
.ball-top-actions{display:flex;align-items:center;justify-content:flex-end;gap:7px}.ball-head-btn{display:inline-flex;align-items:center;justify-content:center;min-height:42px;padding:0 15px;border:1px solid #dfe3f3;border-radius:14px;background:#fff;box-shadow:0 4px 10px rgba(44,53,99,.06);color:#273052;text-decoration:none;font-size:13px;font-weight:900;white-space:nowrap}.ball-head-btn:hover{border-color:#aeb8ec;transform:translateY(-1px)}.ball-head-btn.accent{border-color:#5d4ee5;background:linear-gradient(135deg,#6f59ed,#487df6);color:#fff}
.ball-shell{width:min(1240px,calc(100% - 36px));margin:22px auto 64px}
.ball-hero{position:relative;display:flex;align-items:center;justify-content:space-between;min-height:176px;padding:30px 38px;overflow:hidden;border-radius:30px;background:linear-gradient(125deg,#2d83f4 0%,#6656ec 62%,#874ce5 100%);box-shadow:0 18px 38px rgba(65,72,174,.22);color:#fff}
.ball-hero:after{content:"";position:absolute;right:-90px;bottom:-170px;width:390px;height:390px;border:50px solid rgba(255,255,255,.08);border-radius:50%}.ball-kicker{font-size:11px;font-weight:1000;letter-spacing:.18em;opacity:.82}.ball-hero h1{margin:7px 0 7px;font-size:clamp(28px,4vw,48px);line-height:1.08;letter-spacing:-.045em}.ball-hero p{max-width:680px;margin:0;font-size:15px;line-height:1.6;opacity:.9}.hero-balls{position:relative;z-index:2;width:235px;height:100px;flex:0 0 auto}.hero-balls i{position:absolute;display:block;border:5px solid rgba(255,255,255,.88);border-radius:50%;box-shadow:inset -8px -10px 15px rgba(40,25,125,.24),0 12px 20px rgba(24,25,100,.18)}.hero-balls i:nth-child(1){left:5px;top:18px;width:63px;height:63px;background:#ff668f}.hero-balls i:nth-child(2){left:60px;top:3px;width:80px;height:80px;background:#ffca49}.hero-balls i:nth-child(3){left:127px;top:25px;width:58px;height:58px;background:#53d1ae}.hero-balls i:nth-child(4){left:174px;top:8px;width:72px;height:72px;background:#75d7ff}
.setup-card,.race-section,.winner-card{margin-top:20px;border:1px solid rgba(114,124,170,.2);border-radius:26px;background:rgba(255,255,255,.96);box-shadow:0 15px 38px rgba(47,57,110,.09)}
.setup-card{padding:28px}.section-heading,.race-toolbar{display:flex;align-items:center;justify-content:space-between;gap:20px}.section-heading small,.race-toolbar small{display:block;margin-bottom:3px;color:#7061dc;font-size:10px;font-weight:1000;letter-spacing:.13em}.section-heading h2,.race-toolbar h2{margin:0;font-size:25px;letter-spacing:-.04em}.count-pill{padding:8px 13px;border-radius:999px;background:#eeeaff;color:#5945d3;font-size:13px;font-weight:900}
.name-label{display:block;margin:22px 0 8px;font-size:13px;font-weight:900}.setup-card textarea{display:block;width:100%;min-height:148px;resize:vertical;padding:16px 17px;border:2px solid #e2e4f0;border-radius:17px;outline:none;background:#fafbff;color:#222a4e;font-size:15px;line-height:1.62}.setup-card textarea:focus{border-color:#7966eb;box-shadow:0 0 0 4px rgba(115,92,232,.11);background:#fff}.input-help{display:flex;flex-wrap:wrap;justify-content:space-between;gap:6px 16px;margin-top:9px;color:#777e97;font-size:11px;line-height:1.45}.input-help b{color:#6453d7}.input-error{min-height:20px;margin-top:5px;color:#e83e67;font-size:12px;font-weight:800}
.setup-actions,.race-actions,.winner-actions{display:flex;justify-content:flex-end;align-items:center;gap:9px}
.primary-btn,.secondary-btn,.ball-head-btn,.race-audio-btn,.expand-game-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  height:44px;
  min-height:44px;
  padding:0 16px;
  border-radius:14px;
  font-weight:800;
  font-size:13px;
  line-height:1;
  letter-spacing:-.01em;
  white-space:nowrap;
  box-sizing:border-box;
  vertical-align:middle;
}
.primary-btn{border:0;background:linear-gradient(135deg,#7259ed,#357ef5);box-shadow:0 9px 18px rgba(72,88,218,.21);color:#fff}
.secondary-btn{border:1px solid #dcdfee;background:#fff;color:#39405e}
.primary-btn:disabled,.secondary-btn:disabled{cursor:not-allowed;opacity:.5;transform:none}
.primary-btn:not(:disabled):hover,.secondary-btn:not(:disabled):hover{transform:translateY(-1px)}
.race-section{padding:20px}.race-toolbar{padding:5px 6px 18px}.race-toolbar p{margin:5px 0 0;color:var(--muted);font-size:13px}.race-layout{display:grid;grid-template-columns:minmax(0,1fr) 285px;gap:16px;align-items:start}.track-card{position:relative;min-width:0;padding:12px;border:1px solid #dde2f1;border-radius:22px;background:linear-gradient(180deg,#eef5ff,#f8f5ff);overflow:hidden}.track-card canvas{display:block;width:100%;height:auto;aspect-ratio:820/1040;border-radius:16px;background:#11275e;box-shadow:inset 0 0 0 1px rgba(255,255,255,.15)}.track-caption{display:flex;justify-content:space-between;padding:9px 5px 0;color:#707994;font-size:10px;font-weight:950;letter-spacing:.08em}.countdown{position:absolute;z-index:12;left:50%;top:19%;display:grid;place-items:center;width:112px;height:112px;transform:translate(-50%,-50%);border:8px solid rgba(255,255,255,.88);border-radius:50%;background:linear-gradient(145deg,#ffce4c,#ff5f8f);box-shadow:0 18px 45px rgba(32,27,103,.34);color:#fff;font-size:54px;font-weight:1000;text-shadow:0 3px 0 rgba(91,43,43,.16)}
.ranking-card{position:sticky;top:82px;min-height:330px;padding:18px;border:1px solid #e0e3f0;border-radius:22px;background:#fff}.ranking-title{display:flex;align-items:center;gap:10px}.ranking-title>span{display:grid;place-items:center;width:43px;height:43px;border-radius:14px;background:#fff3c9;font-size:23px}.ranking-title small{color:#f09b23;font-size:9px;font-weight:1000;letter-spacing:.15em}.ranking-title h3{margin:0;font-size:19px}.ranking-list{display:grid;gap:7px;margin:15px 0 0;padding:0;list-style:none}.ranking-list li:not(.ranking-empty){display:grid;grid-template-columns:28px 13px minmax(0,1fr);align-items:center;gap:7px;padding:10px 9px;border-radius:12px;background:#f5f6fb;font-size:12px;font-weight:900}.ranking-list li:first-child{background:linear-gradient(90deg,#fff1ac,#fff8d7);color:#6f4a00}.rank-number{font-size:14px;text-align:center}.rank-dot{width:12px;height:12px;border-radius:50%;box-shadow:inset -2px -2px 3px rgba(0,0,0,.18)}.ranking-empty{padding:20px 9px;border:1px dashed #dfe1ed;border-radius:13px;color:#8b90a6;font-size:12px;text-align:center}.participant-preview{margin-top:18px;padding-top:15px;border-top:1px solid #eceef5}.participant-preview h4{margin:0 0 10px;font-size:12px}.ball-legend{display:flex;flex-wrap:wrap;gap:6px}.legend-item{display:inline-flex;align-items:center;gap:5px;max-width:100%;padding:5px 7px;border-radius:999px;background:#f5f6fb;color:#545b77;font-size:10px;font-weight:800}.legend-item i{width:9px;height:9px;flex:0 0 auto;border-radius:50%}.legend-item span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.winner-card{position:fixed;z-index:2147483000;inset:0;display:grid;place-items:center;margin:0!important;padding:18px;border:0;border-radius:0;background:rgba(7,12,29,.66);box-shadow:none;text-align:center;overflow:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;backdrop-filter:blur(10px);pointer-events:auto}.winner-card[hidden]{display:none!important}.winner-dialog{position:relative;width:min(460px,100%);padding:36px 28px 29px;overflow:hidden;border:1px solid rgba(255,255,255,.9);border-radius:28px;background:linear-gradient(135deg,#fff4bd,#fff 48%,#ece7ff);box-shadow:0 28px 90px rgba(6,12,36,.48)}.winner-dialog:before,.winner-dialog:after{content:"";position:absolute;width:130px;height:130px;border:25px solid rgba(255,199,55,.15);border-radius:50%;pointer-events:none}.winner-dialog:before{left:-50px;top:-60px}.winner-dialog:after{right:-45px;bottom:-65px}.winner-close{position:absolute;z-index:3;right:13px;top:12px;display:grid;place-items:center;width:39px;height:39px;padding:0;border:1px solid #dfe1ed;border-radius:50%;background:rgba(255,255,255,.82);color:#444b67;font-size:25px;font-weight:800;line-height:1}.winner-crown{position:relative;z-index:1;display:block;font-size:52px}.winner-card small{position:relative;z-index:1;display:block;margin-top:5px;color:#a56c00;font-size:12px;font-weight:1000;letter-spacing:.12em}.winner-card h2{position:relative;z-index:1;margin:5px 0 7px;font-size:38px;letter-spacing:-.04em}.winner-card p{position:relative;z-index:1;margin:0 0 18px;color:#74798e}.winner-card .winner-race-note{margin:-8px auto 19px;max-width:330px;color:#6257a2;font-size:11px;font-weight:800;line-height:1.5}.winner-actions{position:relative;z-index:1;justify-content:center}
.ball-page #jukdolBgmControl .jbgm-fab,.ball-page #jukdolAudioControl .jv-btn{display:none!important}
body.ball-page.race-active #jukdolBgmControl,
body.ball-page.game-expanded #jukdolBgmControl,
body.ball-page.race-active #jukdolAudioControl,
body.ball-page.game-expanded #jukdolAudioControl{z-index:2147483646!important}
@media(max-width:900px){.ball-shell{width:min(100% - 22px,760px);margin-top:12px}.ball-hero{min-height:150px;padding:25px}.hero-balls{width:165px;transform:scale(.82);transform-origin:right center}.race-layout{grid-template-columns:1fr}.ranking-card{position:static;min-height:0}.ranking-list{grid-template-columns:repeat(2,minmax(0,1fr))}.participant-preview{display:none}}
@media(max-width:640px){.ball-topbar{position:relative;display:block;padding:10px 11px}.ball-brand{width:max-content;margin:0 0 9px}.ball-brand-mark{width:38px;height:38px}.ball-brand strong{font-size:18px}.ball-top-actions{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));width:100%;gap:5px}.ball-head-btn{min-width:0;min-height:39px;padding:0 5px;border-radius:11px;font-size:11px}.ball-shell{width:calc(100% - 16px);margin:8px auto calc(36px + env(safe-area-inset-bottom))}.ball-hero{min-height:0;padding:22px 18px;border-radius:22px}.ball-hero h1{font-size:27px}.ball-hero p{font-size:12px}.hero-balls{display:none}.setup-card,.race-section,.winner-card{margin-top:10px;border-radius:20px}.setup-card{padding:19px 15px}.section-heading h2,.race-toolbar h2{font-size:21px}.setup-card textarea{min-height:165px;font-size:16px}.input-help{display:grid}.setup-actions{display:grid;grid-template-columns:1fr 1.45fr}.primary-btn,.secondary-btn{min-height:46px;padding:0 10px;font-size:13px}.race-section{padding:9px}.race-toolbar{display:block;padding:8px 5px 12px}.race-actions{display:grid;grid-template-columns:1fr 1.35fr;margin-top:12px}.race-actions button[hidden]{display:none}.track-card{padding:6px;border-radius:16px}.track-card canvas{border-radius:12px}.countdown{width:84px;height:84px;border-width:6px;font-size:42px}.ranking-card{padding:14px;border-radius:16px}.ranking-list{grid-template-columns:1fr 1fr}.ranking-list li:not(.ranking-empty){grid-template-columns:23px 11px minmax(0,1fr);padding:9px 6px;gap:5px}.winner-actions{display:grid;grid-template-columns:1.3fr 1fr}.ball-page #jukdolAudioControl,.ball-page #jukdolBgmPlayer{right:8px!important;bottom:calc(8px + env(safe-area-inset-bottom))!important}}
@media(max-width:390px){.ball-head-btn{font-size:10px}.ranking-list{grid-template-columns:1fr}.count-pill{font-size:11px}.ball-hero h1{font-size:24px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation:none!important;transition:none!important}}

/* v20260903 · 장거리 스킬 레이스 */
.winner-rule-row{display:flex;align-items:center;justify-content:space-between;gap:18px;margin:6px 0 18px;padding:15px 16px;border:1px solid #dfe3f3;border-radius:16px;background:linear-gradient(135deg,#f8f9ff,#f2f5ff)}
.map-rule-row{display:flex;align-items:center;justify-content:space-between;gap:18px;margin:-7px 0 18px;padding:15px 16px;border:1px solid #dfe3f3;border-radius:16px;background:linear-gradient(135deg,#f8fbff,#f1f9ff)}
.all-multiplier-row{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:13px 0 4px;padding:13px 15px;border:1px solid #e0e4f2;border-radius:15px;background:#f8faff}.all-multiplier-row>label{display:grid;gap:2px}.all-multiplier-row strong{font-size:13px;color:#303853}.all-multiplier-row small{font-size:11px;color:#78809b}.all-multiplier-row>div{display:flex;align-items:center;gap:6px}.all-multiplier-row>div>span{color:#6752dc;font-size:20px;font-weight:1000}.all-multiplier-row input{width:65px;height:41px;border:2px solid #d8dcef;border-radius:11px;background:#fff;color:#283052;font-size:16px;font-weight:950;text-align:center}.all-multiplier-row button{height:41px;padding:0 13px;border:0;border-radius:11px;background:#6b57df;color:#fff;font-size:12px;font-weight:900;white-space:nowrap}
.winner-rule-row label{display:grid;gap:3px}.winner-rule-row strong{font-size:14px;color:#273052}.winner-rule-row small{font-size:12px;color:#747c99}
.winner-rule-row select,.winner-rule-row input,.map-rule-row select{min-width:165px;height:46px;padding:0 14px;border:2px solid #7663e9;border-radius:13px;outline:0;background:#fff;color:#4936bd;font-size:14px;font-weight:950;text-align:center;cursor:pointer}.map-rule-row label{display:grid;gap:3px}.map-rule-row strong{font-size:14px;color:#273052}.map-rule-row small{font-size:12px;color:#747c99}.map-rule-row select{border-color:#3c8edb;color:#2169aa}
.race-layout{grid-template-columns:minmax(0,1fr) 310px}
.track-card{padding:10px;border-color:#2b3652;background:linear-gradient(180deg,#101728,#18213a);box-shadow:0 18px 42px rgba(17,24,54,.2)}
.track-card canvas#ballCanvas{display:block;width:100%;height:auto;aspect-ratio:820/1120;border-radius:16px;background:#111827;box-shadow:inset 0 0 0 1px rgba(255,255,255,.15)}
.track-scroll{position:relative;width:100%;overflow-x:hidden;overflow-y:scroll;overscroll-behavior:contain;touch-action:pan-y;border-radius:16px;background:#111827;scrollbar-width:auto;scrollbar-color:#6a75a0 #111827}.track-scroll::-webkit-scrollbar{width:12px}.track-scroll::-webkit-scrollbar-track{background:#111827}.track-scroll::-webkit-scrollbar-thumb{border:3px solid #111827;border-radius:999px;background:#6a75a0}.track-world{position:relative;width:100%;min-height:100%}.track-world canvas#ballCanvas{position:sticky;top:0;left:0}
.track-caption{color:#aebad2;font-size:11px}
.countdown{z-index:30;top:20%;box-shadow:0 18px 45px rgba(0,0,0,.4)}.countdown[hidden]{display:none!important}
.race-view-hud{position:absolute;z-index:12;left:22px;right:22px;top:20px;display:flex;align-items:center;justify-content:space-between;gap:12px;pointer-events:none}
.race-view-hud b,.race-view-hud span{display:inline-flex;align-items:center;min-height:34px;padding:0 12px;border:1px solid rgba(142,218,255,.22);border-radius:11px;background:rgba(5,12,28,.68);box-shadow:0 8px 24px rgba(0,0,0,.22);backdrop-filter:blur(8px);color:#fff;font-size:12px;font-weight:900}
.race-view-hud span{border-color:rgba(255,215,80,.3);color:#ffe27b}
.course-minimap{position:absolute!important;z-index:13;right:22px;top:72px;width:72px!important;height:330px!important;aspect-ratio:auto!important;border:1px solid rgba(134,240,178,.35);border-radius:12px!important;background:rgba(5,11,24,.76)!important;box-shadow:0 10px 26px rgba(0,0,0,.3)!important;pointer-events:none}
.skill-feed{position:absolute;z-index:13;left:22px;top:72px;display:grid;gap:5px;width:min(230px,42%);pointer-events:none}
.skill-feed div{display:flex;align-items:center;gap:7px;min-height:31px;padding:6px 9px;border:1px solid rgba(123,218,255,.18);border-radius:10px;background:rgba(5,11,25,.7);backdrop-filter:blur(7px);color:#eef7ff;font-size:11px;font-weight:850;animation:skillFeedIn .25s ease both}
.skill-feed i{width:9px;height:9px;flex:0 0 auto;border-radius:50%;box-shadow:0 0 10px currentColor}
.winner-toast{position:absolute;z-index:35;left:50%;top:48%;display:flex;align-items:center;gap:13px;min-width:245px;padding:17px 20px;transform:translate(-50%,-50%);border:3px solid rgba(255,255,255,.92);border-radius:21px;background:linear-gradient(135deg,#ffcf4e,#ff688e);box-shadow:0 24px 60px rgba(0,0,0,.45);color:#fff;animation:winnerPop .5s cubic-bezier(.2,1.4,.35,1) both}
.winner-toast[hidden]{display:none!important}.winner-toast>span{font-size:35px}.winner-toast div{display:grid}.winner-toast small{font-size:11px;font-weight:900;opacity:.85}.winner-toast strong{font-size:24px;font-weight:1000}
.skip-remaining-btn{position:absolute;z-index:38;right:22px;bottom:24px;min-height:52px;padding:0 22px;border:2px solid rgba(255,255,255,.9);border-radius:16px;background:linear-gradient(135deg,#ffcf45,#ff6c7d);box-shadow:0 15px 38px rgba(0,0,0,.42);color:#fff;font-size:14px;font-weight:1000;cursor:pointer;animation:winnerPopCorner .32s ease-out both}.skip-remaining-btn[hidden]{display:none!important}.skip-remaining-btn:hover{transform:translateY(-2px)}
@keyframes winnerPopCorner{from{opacity:0;transform:translateY(14px) scale(.92)}to{opacity:1;transform:none}}
@keyframes skillFeedIn{from{opacity:0;transform:translateX(-10px)}to{opacity:1;transform:none}}@keyframes winnerPop{from{opacity:0;transform:translate(-50%,-50%) scale(.65)}to{opacity:1;transform:translate(-50%,-50%) scale(1)}}
.ranking-card{min-height:360px;border-color:#dfe4f3;background:linear-gradient(180deg,#fff,#f8faff);box-shadow:0 14px 30px rgba(44,54,99,.08)}
.ranking-list li:not(.ranking-empty){grid-template-columns:31px 12px minmax(0,1fr) auto;border:1px solid transparent;background:#f1f4fa}
.ranking-list li.is-finished{background:#eafbf5;border-color:#b9ead7}.rank-copy{display:grid;min-width:0}.rank-copy strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:12px}.rank-copy small{color:#7b8298;font-size:9px}.rank-copy small.is-active{color:#e59a00;font-weight:1000;text-shadow:0 0 10px rgba(255,199,58,.28)}.ranking-list em{color:#6a7190;font-size:10px;font-style:normal}
.race-progress{margin-top:15px;padding:12px;border-radius:13px;background:#eef2fb}.race-progress>div:first-child{display:flex;justify-content:space-between;color:#56607c;font-size:11px;font-weight:900}.race-progress-track{height:7px;margin-top:8px;overflow:hidden;border-radius:999px;background:#dce2f1}.race-progress-track i{display:block;width:0;height:100%;border-radius:inherit;background:linear-gradient(90deg,#47c9ee,#715bea);transition:width .25s ease}
.legend-item{display:grid;grid-template-columns:9px minmax(0,1fr);gap:2px 5px;padding:6px 8px;border-radius:11px}.legend-item i{grid-row:1/3;margin-top:2px}.legend-item b{color:#6751d9;font-size:9px;white-space:nowrap}
@media(max-width:900px){.race-layout{grid-template-columns:1fr}}
@media(max-width:640px){.winner-rule-row{display:grid;gap:10px;padding:13px}.winner-rule-row select,.winner-rule-row input{width:100%;font-size:16px}.all-multiplier-row{display:grid;gap:9px}.all-multiplier-row>div{display:grid;grid-template-columns:auto 66px 1fr}.all-multiplier-row button{font-size:13px}.race-section{padding:7px}.track-card{padding:4px;border-radius:15px}.track-scroll,.track-card canvas#ballCanvas{border-radius:11px}.track-scroll::-webkit-scrollbar{width:9px}.race-view-hud{left:11px;right:18px;top:12px}.race-view-hud b,.race-view-hud span{min-height:29px;padding:0 8px;font-size:9px}.course-minimap{right:14px;top:53px;width:50px!important;height:250px!important}.skill-feed{left:11px;top:53px;width:48%}.skill-feed div{min-height:26px;padding:4px 6px;font-size:8px}.winner-toast{min-width:210px;padding:14px 16px}.winner-toast strong{font-size:20px}.ranking-list li:not(.ranking-empty){grid-template-columns:25px 10px minmax(0,1fr) auto;padding:8px 6px;gap:5px}.ball-page #jukdolAudioControl,.ball-page #jukdolBgmControl{right:8px!important;bottom:calc(8px + env(safe-area-inset-bottom))!important}}
@media(max-width:640px){.skip-remaining-btn{right:12px;bottom:14px;min-height:48px;padding:0 16px;border-radius:14px;font-size:12px}}
@media(max-width:640px){.map-rule-row{display:grid;gap:10px;padding:13px}.map-rule-row select{width:100%;font-size:16px}}

/* 경기 화면: 자동 추적 우선, 전원 완주 후에만 수동 스크롤 */
body.ball-page.race-active{height:100dvh;overflow:hidden}
.race-active .ball-hero,.race-active .setup-card{display:none!important}
.race-active .ball-shell{width:min(1320px,calc(100% - 20px));height:calc(100dvh - 72px);margin:8px auto 0}
.race-active .race-section{height:100%;margin:0;padding:10px 12px;overflow:hidden}
.race-active .race-toolbar{min-height:68px;padding:2px 4px 8px}
.race-active .race-toolbar h2{font-size:21px}.race-active .race-toolbar p{margin-top:2px;font-size:12px}
.speed-control{display:inline-flex;align-items:center;justify-content:center;gap:6px;height:44px;padding:0 10px 0 12px;border:1px solid #dcdfee;border-radius:14px;background:#fff;color:#626a87;font-size:11px;font-weight:800;line-height:1;white-space:nowrap}.speed-control select{height:30px;padding:0 24px 0 8px;border:1px solid #d9ddef;border-radius:9px;outline:0;background:#f7f8fd;color:#333b5c;font-size:12px;font-weight:800;line-height:1;cursor:pointer}
.race-active .race-layout{height:calc(100% - 72px);grid-template-columns:minmax(0,1fr) 320px;align-items:stretch}
.race-active .track-card{display:flex;min-height:0;flex-direction:column}
.race-active .track-scroll{min-height:0;flex:1;overflow-x:hidden;overflow-y:auto;touch-action:pan-y;-webkit-overflow-scrolling:touch;scrollbar-width:thin}
.race-active .track-scroll::-webkit-scrollbar{display:none}
.race-active .track-scroll.manual-scroll{overflow-y:auto;touch-action:pan-y;scrollbar-width:auto}
.race-active .track-scroll.manual-scroll::-webkit-scrollbar{display:block;width:12px}
.race-active .track-world canvas#ballCanvas{width:100%;height:100%;aspect-ratio:auto}
.race-active .ranking-card{position:static;min-height:0;height:100%;overflow-y:auto}
.race-active .participant-preview{display:none}
.race-active .follow-btn{display:none!important}
.race-section:fullscreen,.race-section.game-expanded{width:100vw;height:100dvh;margin:0;padding:10px;border:0;border-radius:0;background:#eef3ff;overflow:hidden}.race-section.game-expanded{position:fixed;z-index:500;inset:0}.race-section:fullscreen .race-layout,.race-section.game-expanded .race-layout{height:calc(100% - 72px)}.race-section:fullscreen .track-card,.race-section.game-expanded .track-card{height:100%}.race-section:fullscreen .ranking-card,.race-section.game-expanded .ranking-card{height:100%;overflow-y:auto}.race-section:fullscreen .expand-game-btn,.race-section.game-expanded .expand-game-btn{border-color:#6250dc;background:#6b57df;color:#fff}
@media(max-width:900px){body.ball-page.race-active{height:auto;min-height:100dvh;overflow-y:auto}.race-active .ball-shell{height:auto;min-height:calc(100dvh - 68px)}.race-active .race-section{height:auto;overflow:visible}.race-active .race-layout{height:auto;grid-template-columns:1fr}.race-active .track-card{height:calc(100dvh - 220px);min-height:480px}.race-active .ranking-card{height:auto;max-height:45dvh}.race-active .ranking-list{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:640px){.race-active .ball-shell{width:calc(100% - 8px);margin-top:4px}.race-active .race-toolbar{min-height:104px}.race-active .track-card{height:calc(100dvh - 285px);min-height:430px}.race-active .course-minimap{height:210px!important}.race-active .ranking-list{grid-template-columns:1fr 1fr}}
@media(max-width:640px){.speed-control{grid-column:1/-1;height:40px;justify-content:space-between}.speed-control select{min-width:95px}.race-active .race-actions{grid-template-columns:repeat(3,minmax(0,1fr))}.race-active .race-actions .primary-btn,.race-active .race-actions .secondary-btn{min-width:0;padding:0 7px;font-size:11px}}

/* v20260903_0113 · 한 화면 시네마 레이스 */
.setup-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:0 0 16px}
.setup-grid .winner-rule-row,.setup-grid .map-rule-row{margin:0;height:100%}
.setup-card textarea{min-height:128px}
.home-in-race{text-decoration:none}
.race-toolbar-copy{min-width:0}
.race-toolbar-copy h2{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

body.ball-page.race-active{
  height:100dvh;
  max-height:100dvh;
  overflow:hidden;
  background:#070d1c;
}
body.ball-page.race-active .ball-topbar{display:none}
@media(max-width:900px){
  body.ball-page.race-active{
    display:flex;
    flex-direction:column;
  }
  body.ball-page.race-active .ball-topbar{
    display:flex!important;
    flex:0 0 auto;
    position:sticky;
    top:0;
    z-index:90;
    align-items:center;
    justify-content:stretch;
    min-height:48px;
    padding:6px 8px;
    gap:6px;
    border-bottom:1px solid rgba(255,255,255,.1);
    background:#0c1324;
    box-shadow:none;
  }
  body.ball-page.race-active .ball-brand{display:none}
  body.ball-page.race-active .ball-top-actions{
    display:grid;
    grid-template-columns:1fr 1fr;
    width:100%;
    gap:6px;
  }
  body.ball-page.race-active .ball-top-actions [data-jukdol-bgm-button],
  body.ball-page.race-active .ball-top-actions [data-jukdol-sfx-button]{display:none}
  body.ball-page.race-active .ball-head-btn{
    min-height:40px;
    border-color:#3c4a70;
    background:#1c2740;
    color:#e8eefc;
    box-shadow:none;
  }
  body.ball-page.race-active .ball-head-btn.accent{
    border-color:#5d4ee5;
    background:linear-gradient(135deg,#6f59ed,#487df6);
    color:#fff;
  }
  body.ball-page.race-active .ball-shell{
    flex:1 1 auto;
    min-height:0;
    height:auto!important;
  }
}
body.ball-page.race-active .ball-shell{
  width:100%;
  max-width:none;
  height:100dvh;
  margin:0;
  padding:0;
}
body.ball-page.race-active .race-section{
  display:flex;
  flex-direction:column;
  height:100%;
  margin:0;
  padding:8px 10px 10px;
  border:0;
  border-radius:0;
  background:linear-gradient(180deg,#11192c,#0c1324 40%,#10182c);
  box-shadow:none;
  overflow:hidden;
}
body.ball-page.race-active .race-toolbar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  flex:0 0 auto;
  min-height:52px;
  padding:2px 4px 8px;
}
body.ball-page.race-active .race-toolbar small{color:#8bd9ff}
body.ball-page.race-active .race-toolbar h2{color:#fff;font-size:18px}
body.ball-page.race-active .race-toolbar p{margin-top:2px;color:#b7c4de;font-size:12px}
body.ball-page.race-active .race-actions{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:6px}
body.ball-page.race-active .race-audio-btn{
  height:40px;
  min-height:40px;
  border-color:#3c4a70;
  background:#1c2740;
  color:#e8eefc;
}
body.ball-page.race-active .speed-control{
  height:40px;
  border-color:#3a4668;
  background:#1a233a;
  color:#d5def0;
}
body.ball-page.race-active .speed-control select{background:#10182b;border-color:#3a4668;color:#fff;height:28px}
body.ball-page.race-active .secondary-btn{
  height:40px;
  min-height:40px;
  border-color:#3c4a70;
  background:#1c2740;
  color:#e8eefc;
}
body.ball-page.race-active .primary-btn{height:40px;min-height:40px}
body.ball-page.race-active .race-layout{
  flex:1 1 auto;
  min-height:0;
  height:auto;
  display:grid;
  grid-template-columns:1fr;
  align-items:stretch;
}
body.ball-page.race-active .track-card{
  position:relative;
  display:flex;
  flex-direction:column;
  min-height:0;
  height:100%;
  padding:0;
  border:1px solid rgba(120,210,255,.22);
  border-radius:18px;
  background:#070c18;
  overflow:hidden;
  box-shadow:0 18px 50px rgba(0,0,0,.35), inset 0 0 80px rgba(40,170,255,.05);
}
body.ball-page.race-active .track-scroll{
  flex:1 1 auto;
  min-height:0;
  overflow-x:hidden;
  overflow-y:auto;
  touch-action:pan-y;
  -webkit-overflow-scrolling:touch;
  overscroll-behavior:contain;
  border-radius:0;
  scrollbar-width:thin;
}
body.ball-page.race-active .track-scroll::-webkit-scrollbar{width:8px}
body.ball-page.race-active .track-scroll.manual-scroll{overflow-y:auto;touch-action:pan-y;scrollbar-width:thin}
body.ball-page.race-active .track-world{min-height:100%}
body.ball-page.race-active .track-world canvas#ballCanvas{
  width:100%;
  height:100%;
  aspect-ratio:auto;
  border-radius:0;
  background:#07101f;
}
body.ball-page.race-active .track-caption{display:none}
body.ball-page.race-active .race-view-hud{
  left:14px;
  right:min(292px, 32vw);
  top:12px;
}
body.ball-page.race-active .skill-feed{
  left:14px;
  top:56px;
  width:min(240px, 36%);
}
body.ball-page.race-active .course-minimap{
  left:14px;
  right:auto;
  top:auto;
  bottom:14px;
  width:64px!important;
  height:min(280px, 42%)!important;
  border-color:rgba(120,230,255,.4);
  background:rgba(4,10,22,.82)!important;
}
body.ball-page.race-active .ranking-card{
  position:absolute;
  z-index:16;
  top:12px;
  right:12px;
  bottom:12px;
  width:min(276px, 30vw);
  height:auto;
  min-height:0;
  margin:0;
  padding:12px 12px 10px;
  overflow:hidden;
  display:flex;
  flex-direction:column;
  border:1px solid rgba(160,210,255,.22);
  border-radius:16px;
  background:rgba(8,14,28,.78);
  box-shadow:0 16px 40px rgba(0,0,0,.35);
  backdrop-filter:blur(16px);
  color:#eef5ff;
}
body.ball-page.race-active .ranking-title>span{background:#2a2108}
body.ball-page.race-active .ranking-title small{color:#ffd56a}
body.ball-page.race-active .ranking-title h3{color:#fff}
body.ball-page.race-active .ranking-list{
  flex:1 1 auto;
  min-height:0;
  overflow:auto;
  gap:5px;
  margin-top:10px;
  scrollbar-width:thin;
}
body.ball-page.race-active .ranking-list li:not(.ranking-empty){
  grid-template-columns:30px 11px minmax(0,1fr) auto;
  padding:7px 8px;
  border:1px solid rgba(255,255,255,.04);
  background:rgba(255,255,255,.06);
  color:#eef4ff;
}
body.ball-page.race-active .ranking-list li:first-child{
  background:linear-gradient(90deg,rgba(255,214,90,.28),rgba(255,248,215,.08));
  color:#ffe9a8;
}
body.ball-page.race-active .ranking-list li.is-finished{
  background:rgba(70,210,160,.16);
  border-color:rgba(120,230,190,.28);
  color:#d9fff0;
}
body.ball-page.race-active .rank-copy small{color:#9aa6c0}
body.ball-page.race-active .rank-copy small.is-active{color:#ffd36a}
body.ball-page.race-active .ranking-list em{color:#9eb0d0}
body.ball-page.race-active .ranking-empty{
  border-color:rgba(255,255,255,.12);
  color:#9aa6c0;
}
body.ball-page.race-active .race-progress{
  flex:0 0 auto;
  margin-top:10px;
  background:rgba(255,255,255,.06);
}
body.ball-page.race-active .race-progress>div:first-child{color:#c5d0e8}
body.ball-page.race-active .participant-preview{display:none}
body.ball-page.race-active .follow-btn{display:none!important}
body.ball-page.race-active .countdown{top:22%}

.race-section:fullscreen,
.race-section.game-expanded{
  width:100%;
  height:100%;
  margin:0;
  border:0;
  border-radius:0;
  background:#0c1324;
  overflow:hidden;
}
body.ball-page.race-active.game-expanded .race-section{
  padding:0;
}
body.ball-page.race-active.game-expanded .race-toolbar{
  position:absolute;
  z-index:24;
  top:8px;
  left:8px;
  right:auto;
  width:auto;
  min-height:0;
  padding:0;
  display:flex;
  align-items:center;
  pointer-events:none;
}
body.ball-page.race-active.game-expanded .race-toolbar-copy{display:none!important}
body.ball-page.race-active.game-expanded .home-in-race,
body.ball-page.race-active.game-expanded .new-in-race,
body.ball-page.race-active.game-expanded #shuffleBallsBtn{display:none!important}
body.ball-page.race-active.game-expanded .race-actions{
  pointer-events:auto;
  display:flex;
  flex-wrap:wrap;
  justify-content:flex-start;
  gap:4px;
  max-width:min(560px, calc(100vw - 24px));
}
body.ball-page.race-active.game-expanded .race-actions .secondary-btn,
body.ball-page.race-active.game-expanded .race-actions .primary-btn,
body.ball-page.race-active.game-expanded .speed-control{
  height:34px;
  min-height:34px;
  padding:0 10px;
  font-size:11px;
  border-radius:11px;
  background:rgba(12,18,34,.82);
  backdrop-filter:blur(10px);
}
body.ball-page.race-active.game-expanded .expand-game-btn{
  border-color:#7aa7ff;
  background:#4f6bff;
  color:#fff;
}
body.ball-page.race-active.game-expanded .track-card{
  border:0;
  border-radius:0;
}
body.ball-page.race-active.game-expanded .race-view-hud{top:50px}
body.ball-page.race-active.game-expanded .skill-feed{top:88px}

.ranking-toggle{
  position:absolute;
  top:8px;
  right:8px;
  z-index:2;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:34px;
  height:34px;
  padding:0;
  border:0;
  border-radius:10px;
  background:rgba(255,255,255,.12);
  color:#fff;
  font-size:18px;
  font-weight:800;
  line-height:1;
  cursor:pointer;
}
body.ball-page.race-active .ranking-card{padding-top:14px}
body.ball-page.race-active .ranking-title{padding-right:36px}
body.ball-page.race-active .ranking-body{flex:1 1 auto;min-height:0;display:flex;flex-direction:column;overflow:hidden}
body.ball-page.race-active .ranking-card.is-collapsed{
  top:50%;
  right:8px;
  bottom:auto;
  left:auto;
  width:42px;
  height:auto;
  min-height:0;
  max-height:none;
  padding:8px 6px;
  transform:translateY(-50%);
  cursor:pointer;
}
body.ball-page.race-active .ranking-card.is-collapsed .ranking-title,
body.ball-page.race-active .ranking-card.is-collapsed .ranking-body{display:none}
body.ball-page.race-active .ranking-card.is-collapsed .ranking-toggle{
  position:static;
  width:100%;
  height:auto;
  min-height:112px;
  writing-mode:vertical-rl;
  letter-spacing:.18em;
  font-size:13px;
}
body.ball-page.ranking-collapsed .race-view-hud{right:56px}

@media(max-width:900px){
  body.ball-page.race-active.game-expanded .race-toolbar{
    display:flex;
    grid-template-columns:none;
  }
  body.ball-page.race-active.game-expanded .race-actions{
    display:flex;
    grid-template-columns:none;
  }
  body.ball-page.race-active .ranking-card.is-collapsed{
    top:auto;
    bottom:10px;
    right:8px;
    left:auto;
    width:auto;
    transform:none;
    padding:0 4px;
  }
  body.ball-page.race-active .ranking-card.is-collapsed .ranking-toggle{
    min-height:40px;
    height:40px;
    width:auto;
    padding:0 14px;
    writing-mode:horizontal-tb;
    letter-spacing:0;
  }
  body.ball-page.ranking-collapsed .course-minimap{
    bottom:14px!important;
  }
}

@media(max-width:1100px){
  body.ball-page.race-active .ranking-card{width:min(240px, 34vw)}
  body.ball-page.race-active .race-view-hud{right:min(256px, 36vw)}
}

@media(max-width:900px){
  body.ball-page.race-active{height:100dvh;overflow:hidden}
  body.ball-page.race-active .ball-shell{height:100dvh;width:100%;margin:0}
  body.ball-page.race-active .race-section{height:100%;overflow:hidden;padding:6px}
  body.ball-page.race-active .race-toolbar{display:grid;grid-template-columns:1fr;gap:6px;min-height:0;padding:0 2px 6px}
  body.ball-page.race-active .race-actions{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));width:100%}
  body.ball-page.race-active .speed-control{grid-column:span 2;height:38px}
  body.ball-page.race-active .race-audio-btn{display:inline-flex;min-height:38px}
  body.ball-page.race-active .home-in-race,
  body.ball-page.race-active .new-in-race{display:none}
  body.ball-page.race-active .race-layout{height:auto}
  body.ball-page.race-active .track-card{height:auto;min-height:0}
  body.ball-page.race-active .ranking-card{
    top:auto;
    right:8px;
    left:8px;
    bottom:8px;
    width:auto;
    max-height:28dvh;
    padding:8px 8px 6px;
  }
  body.ball-page.race-active .ranking-list{grid-template-columns:repeat(2,minmax(0,1fr))}
  body.ball-page.race-active .race-view-hud{left:10px;right:10px;top:8px}
  body.ball-page.race-active .skill-feed{top:46px;left:10px}
  body.ball-page.race-active .course-minimap{
    left:auto;
    right:10px;
    bottom:calc(28dvh + 16px);
    width:48px!important;
    height:160px!important;
  }
}

@media(max-width:640px){
  .setup-grid{grid-template-columns:1fr}
  body.ball-page.race-active .race-toolbar h2{font-size:16px}
  body.ball-page.race-active .race-actions{
    grid-template-columns:repeat(3,minmax(0,1fr));
  }
  body.ball-page.race-active .speed-control{grid-column:1/-1}
  body.ball-page.race-active .race-actions .primary-btn,
  body.ball-page.race-active .race-actions .secondary-btn{min-height:38px;padding:0 6px;font-size:11px}
  body.ball-page.race-active .ranking-card{max-height:26dvh}
  body.ball-page.race-active .ranking-list li:not(.ranking-empty){padding:6px;font-size:11px}
  body.ball-page.race-active .course-minimap{bottom:calc(26dvh + 14px);height:130px!important}
}

@media(max-height:700px){
  body.ball-page.race-active .race-toolbar p{display:none}
  body.ball-page.race-active .ranking-card{width:min(220px, 28vw)}
}

/* 모바일/좁은 화면: 페이지·트랙 모두 세로 터치 스크롤 */
@media (max-width:1024px){
  html:has(body.ball-page),
  body.ball-page,
  body.ball-page.jukdol-safe-game,
  body.ball-page.jukdol-safe-ui{
    height:auto!important;
    min-height:100dvh!important;
    max-height:none!important;
    overflow-x:hidden!important;
    overflow-y:auto!important;
    overscroll-behavior:auto!important;
    touch-action:pan-y pinch-zoom!important;
    -webkit-overflow-scrolling:touch!important;
  }
  body.ball-page .ball-shell,
  body.ball-page .setup-card,
  body.ball-page .race-section{
    touch-action:pan-y pinch-zoom;
  }
  body.ball-page .track-scroll,
  body.ball-page.race-active .track-scroll,
  body.ball-page.race-active .track-scroll.manual-scroll{
    overflow-x:hidden!important;
    overflow-y:auto!important;
    touch-action:pan-y!important;
    -webkit-overflow-scrolling:touch!important;
  }
  body.ball-page .track-world canvas#ballCanvas{
    touch-action:pan-y;
  }
  body.ball-page.race-active .ranking-list,
  body.ball-page.race-active .ranking-body{
    overflow-y:auto;
    touch-action:pan-y;
    -webkit-overflow-scrolling:touch;
  }
}
@media (max-width:900px){
  body.ball-page.race-active,
  body.ball-page.race-active.jukdol-safe-game{
    height:auto!important;
    max-height:none!important;
    overflow-y:auto!important;
  }
  body.ball-page.race-active .ball-shell,
  body.ball-page.race-active .race-section{
    height:auto!important;
    max-height:none!important;
    overflow:visible!important;
  }
  body.ball-page.race-active .track-card{
    height:min(78dvh, 820px)!important;
    min-height:420px!important;
    overflow:hidden;
  }
}

body.ball-page #winnerCard,
body.ball-page.race-active #winnerCard,
body.ball-page.game-expanded #winnerCard{
  position:fixed!important;
  top:0!important;
  right:0!important;
  bottom:0!important;
  left:0!important;
  z-index:2147483000!important;
  display:grid!important;
  place-items:center;
  width:100vw!important;
  height:100dvh!important;
  max-width:100vw!important;
  max-height:100dvh!important;
  margin:0!important;
  padding:12px!important;
  border:0!important;
  border-radius:0!important;
  overflow:hidden!important;
  pointer-events:auto!important;
}
body.ball-page #winnerCard[hidden]{display:none!important}
body.ball-page #winnerCard .winner-dialog{
  width:min(400px, calc(100vw - 28px));
  max-height:min(82dvh, 520px);
  padding:28px 20px 20px;
  overflow:hidden!important;
}
body.ball-page.winner-open,
body.ball-page.winner-open.jukdol-safe-game,
html:has(body.ball-page.winner-open){
  overflow:hidden!important;
  height:100dvh!important;
  max-height:100dvh!important;
  overscroll-behavior:none!important;
}
@media(max-width:640px){
  body.ball-page #winnerCard .winner-dialog{padding:22px 16px 16px}
  body.ball-page #winnerCard .winner-crown{font-size:36px}
  body.ball-page #winnerCard h2{margin:4px 0 6px;font-size:28px}
  body.ball-page #winnerCard p{margin:0 0 10px;font-size:13px}
  body.ball-page #winnerCard .winner-race-note{display:none}
  body.ball-page #winnerCard .winner-actions{margin-top:4px;gap:8px}
}

/* v20260903_1335 · PC 레이스 UI 복구 및 사이드 미니맵 정리 */
.course-minimap-panel{
  position:absolute;
  z-index:15;
  top:64px;
  right:calc(min(276px, 30vw) + 26px);
  display:grid;
  justify-items:center;
  width:84px;
  padding:7px 6px 6px;
  overflow:hidden;
  border:1px solid rgba(126,225,255,.38);
  border-radius:14px;
  background:linear-gradient(180deg,rgba(15,26,48,.94),rgba(5,11,24,.9));
  box-shadow:0 12px 34px rgba(0,0,0,.38),inset 0 1px 0 rgba(255,255,255,.08);
  pointer-events:none;
  backdrop-filter:blur(12px);
}
.course-minimap-panel>span{
  display:block;
  margin:0 0 6px;
  color:#99eaff;
  font-size:8px;
  font-weight:1000;
  line-height:1;
  letter-spacing:.12em;
  text-shadow:0 0 10px rgba(91,223,255,.45);
}
body.ball-page .track-card .course-minimap-panel .course-minimap,
body.ball-page.race-active .track-card .course-minimap-panel .course-minimap{
  position:static!important;
  display:block!important;
  width:70px!important;
  height:min(300px, 42dvh)!important;
  min-height:180px;
  aspect-ratio:auto!important;
  border:1px solid rgba(134,240,178,.28)!important;
  border-radius:9px!important;
  background:#07101f!important;
  box-shadow:inset 0 0 18px rgba(52,217,255,.08)!important;
}
body.ball-page.ranking-collapsed .course-minimap-panel{right:58px}

/* 레이스 중에는 상단바 또는 경기 도구막대 중 한 세트만 노출 */
@media(min-width:901px){
  body.ball-page.race-active .ball-topbar{display:none!important}
}
@media(max-width:1100px) and (min-width:901px){
  .course-minimap-panel{right:calc(min(240px, 34vw) + 24px)}
}
@media(max-width:900px){
  .course-minimap-panel{
    top:68px;
    right:10px;
    bottom:auto;
    width:62px;
    padding:6px 5px 5px;
  }
  .course-minimap-panel>span{font-size:6px;letter-spacing:.08em}
  body.ball-page .track-card .course-minimap-panel .course-minimap,
  body.ball-page.race-active .track-card .course-minimap-panel .course-minimap{
    width:50px!important;
    height:min(210px, 31dvh)!important;
    min-height:130px;
  }
  body.ball-page.ranking-collapsed .course-minimap-panel{right:10px}
}
@media(max-width:640px){
  .course-minimap-panel{top:60px;width:58px}
  body.ball-page .track-card .course-minimap-panel .course-minimap,
  body.ball-page.race-active .track-card .course-minimap-panel .course-minimap{
    width:46px!important;
    height:min(180px, 28dvh)!important;
    min-height:118px;
  }
}

/* 경기 시작은 코스 중앙의 큰 준비 팝업에서만 진행 */
.race-start-overlay{
  position:absolute;
  z-index:42;
  inset:0;
  display:grid;
  place-items:center;
  padding:24px;
  background:radial-gradient(circle at 50% 44%,rgba(72,117,255,.2),rgba(4,9,21,.7) 58%,rgba(4,9,21,.88));
  backdrop-filter:blur(4px);
}
.race-start-overlay[hidden]{display:none!important}
.race-start-dialog{
  display:grid;
  justify-items:center;
  width:min(440px, calc(100% - 24px));
  padding:34px 28px 30px;
  border:1px solid rgba(145,220,255,.5);
  border-radius:24px;
  background:linear-gradient(145deg,rgba(20,34,67,.97),rgba(10,17,35,.98));
  box-shadow:0 28px 90px rgba(0,0,0,.58),inset 0 1px 0 rgba(255,255,255,.12),0 0 48px rgba(66,137,255,.16);
  color:#fff;
  text-align:center;
}
.race-start-dialog>small{color:#79e5ff;font-size:11px;font-weight:1000;letter-spacing:.2em}
.race-start-dialog>strong{margin-top:9px;font-size:25px;font-weight:1000;letter-spacing:-.04em}
.race-start-dialog>span{margin-top:9px;color:#b9c8e4;font-size:14px;font-weight:750;line-height:1.55}
.race-auto-countdown{
  display:grid;
  place-items:center;
  width:94px;
  height:94px;
  margin-top:20px;
  border:5px solid rgba(255,255,255,.88);
  border-radius:50%;
  background:linear-gradient(145deg,#ffcf4d,#ff5f91);
  box-shadow:0 14px 38px rgba(255,82,132,.32),inset 0 2px 0 rgba(255,255,255,.35);
  color:#fff;
  font-size:48px;
  font-weight:1000;
  line-height:1;
  text-shadow:0 3px 0 rgba(92,32,67,.2);
}
.race-start-main{
  min-width:270px;
  height:68px;
  min-height:68px!important;
  margin-top:18px;
  padding:0 34px;
  border:1px solid rgba(255,255,255,.34);
  border-radius:20px;
  background:linear-gradient(135deg,#795cff,#398dff 58%,#29c8eb);
  box-shadow:0 16px 38px rgba(40,101,255,.42),inset 0 1px 0 rgba(255,255,255,.3);
  color:#fff;
  font-size:20px;
  font-weight:1000;
}
.race-start-main:hover{transform:translateY(-2px) scale(1.015)!important}
body.ball-page.race-active .track-scroll:not(.manual-scroll){
  overflow-x:hidden!important;
  overflow-y:hidden!important;
  touch-action:none!important;
  overscroll-behavior:none!important;
}
@media(max-width:640px){
  .race-start-overlay{padding:12px}
  .race-start-dialog{padding:27px 18px 22px;border-radius:20px}
  .race-start-dialog>strong{font-size:21px}
  .race-start-dialog>span{font-size:12px}
  .race-auto-countdown{width:78px;height:78px;margin-top:16px;border-width:4px;font-size:40px}
  .race-start-main{width:100%;min-width:0;height:60px;min-height:60px!important;font-size:18px}
}