/* Illustrated controls: only the live value, labels and slider state are DOM. */
/* One native-ratio canvas keeps the painted buttons and live hit areas
   in the same coordinate system at every viewport size. */
#app.setup-reference #setup-footer .bet-control.illustrated-wager{container-type:inline-size;isolation:isolate;display:block;padding:0;margin:0;max-width:none;min-height:0;height:auto;aspect-ratio:1942/809;background:url('../public/assets/wager-v4/panel.png') center/contain no-repeat;border:0;border-image:none;box-shadow:none;--bet-fill:9.91%;--wager-hit-size:44px}
#app.setup-reference #setup-footer .illustrated-wager:after{content:none}
#app.setup-reference #setup-footer .illustrated-wager>label{position:absolute;left:29%;top:calc(16% + 2px);width:42%;height:11%;margin:0;padding:0;display:flex;align-items:center;justify-content:center;font:700 3.25cqw/1 Rajdhani,sans-serif;letter-spacing:.7cqw;color:#bceeff;text-shadow:0 0 6px #008dff}
#app.setup-reference #setup-footer .illustrated-wager>div{position:absolute;inset:0;width:100%;height:100%;display:block;padding:0;margin:0;background:none;border:0;box-shadow:none;pointer-events:none}
#app.setup-reference #setup-footer .illustrated-wager>div:before{content:none}
#app.setup-reference #setup-footer .illustrated-wager .bet-main button{position:absolute;top:47%;width:max(17%,var(--wager-hit-size));min-width:0;height:max(40%,var(--wager-hit-size));padding:0;margin:0;border:0;clip-path:polygon(16% 0,84% 0,100% 16%,100% 84%,84% 100%,16% 100%,0 84%,0 16%);background:transparent;color:transparent;text-shadow:none;box-shadow:none;filter:none;transform:translate(-50%,-50%);-webkit-text-stroke:0;pointer-events:auto}
#app.setup-reference #setup-footer .illustrated-wager #bet-down{left:16.5%}
#app.setup-reference #setup-footer .illustrated-wager #bet-up{left:83.5%}
#app.setup-reference #setup-footer .illustrated-wager .bet-main button:after{content:none}
#app.setup-reference #setup-footer .illustrated-wager .bet-main button:hover{background:#32bbff17;box-shadow:inset 0 0 14px #5edcff6b}
#app.setup-reference #setup-footer .illustrated-wager .bet-main button:active{background:#9befff34;transform:translate(-50%,-50%)}
#app.setup-reference #setup-footer .illustrated-wager .bet-main button:focus-visible{outline:2px solid #dbf8ff;outline-offset:-5px;box-shadow:inset 0 0 16px #1fafff}
#app.setup-reference #setup-footer .illustrated-wager #bet{position:absolute;inset:31% auto auto 28%;width:44%;height:33%;min-width:0;padding:0;margin:0;background:none;border:0;box-shadow:none;border-radius:0;color:#eefaff;font-family:Rajdhani,sans-serif;font-size:11cqw;font-weight:800;font-style:italic;line-height:1;text-align:center;letter-spacing:0;font-variant-numeric:tabular-nums;text-shadow:0 0 3px #fff8,0 0 8px #008dff,0 0 17px #008dff80;appearance:textfield;pointer-events:auto}
#app.setup-reference #setup-footer .illustrated-wager #bet::-webkit-inner-spin-button,
#app.setup-reference #setup-footer .illustrated-wager #bet::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}
#app.setup-reference #setup-footer .illustrated-wager #bet:focus-visible{outline:1px solid #68d8ff;outline-offset:-4px}
#app.setup-reference #setup-footer .illustrated-wager #bet-range{position:absolute;left:20.6%;top:calc(73% - var(--wager-hit-size)/2);width:59%;height:var(--wager-hit-size);min-width:0;margin:0;padding:0;border:0;background:none;box-shadow:none;appearance:none;cursor:pointer;pointer-events:auto;--thumb-size:7cqw}
#app.setup-reference #setup-footer .illustrated-wager #bet-range::-webkit-slider-runnable-track{height:4px;border:0;border-radius:4px;background:linear-gradient(90deg,#50e9ff var(--bet-fill),transparent var(--bet-fill));box-shadow:none}
#app.setup-reference #setup-footer .illustrated-wager #bet-range::-webkit-slider-thumb{width:var(--thumb-size);height:var(--thumb-size);margin-top:calc((4px - var(--thumb-size))/2);appearance:none;border:0;border-radius:0;background:url('../public/assets/wager-v3/slider-thumb.png') center/contain no-repeat;box-shadow:none}
#app.setup-reference #setup-footer .illustrated-wager #bet-range::-moz-range-track{height:4px;border:0;background:transparent}
#app.setup-reference #setup-footer .illustrated-wager #bet-range::-moz-range-progress{height:4px;border:0;border-radius:4px;background:#50e9ff}
#app.setup-reference #setup-footer .illustrated-wager #bet-range::-moz-range-thumb{width:var(--thumb-size);height:var(--thumb-size);border:0;border-radius:0;background:url('../public/assets/wager-v3/slider-thumb.png') center/contain no-repeat}
#app.setup-reference #setup-footer .illustrated-wager #bet-range:focus-visible{outline:2px solid #76dfff;outline-offset:0;border-radius:6px}
/* At the slider centerline the illustration's inner frame spans 10.2–90%.
   Each label fills its complete gap to the unchanged 20.6–79.6% slider. */
#app.setup-reference #setup-footer .illustrated-wager .bet-limit{position:absolute;top:67.5%;width:10.4%;height:11%;display:flex;align-items:center;justify-content:center;text-align:center;white-space:nowrap;pointer-events:none;font:700 2.7cqw/1 Rajdhani,sans-serif;color:#d0f2ff;text-shadow:0 0 5px #009cff}
#app.setup-reference #setup-footer .illustrated-wager .bet-min{left:10.2%;right:auto}
#app.setup-reference #setup-footer .illustrated-wager .bet-max{left:79.6%;right:auto}
#app.setup-reference[data-screen="tracks"] #setup-footer .bet-control.illustrated-wager>div{width:100%;height:100%}
#app.setup-reference[data-screen="tracks"] #setup-footer .bet-control.illustrated-wager>label{display:flex;width:42%;font-size:3.25cqw;line-height:1;letter-spacing:.7cqw}
@media(orientation:landscape){
 #app.setup-reference #setup-footer .bet-control.illustrated-wager{left:1223px;top:778px;width:380px;height:auto;--wager-hit-size:calc(44px / var(--reference-scale,1))}
 #app.setup-reference[data-screen="tracks"] #setup-footer .bet-control.illustrated-wager{left:656px;top:795px;width:344px;height:auto}
 #app.setup-reference[data-screen="tracks"] #setup-footer:before{background:linear-gradient(90deg,transparent,#020b17 12%,#020b17 88%,transparent)}
}
@media(orientation:portrait){
 #app.setup-reference{--wager-panel-width:min(calc(100vw - 20px),430px);--wager-panel-height:calc(var(--wager-panel-width) * 809 / 1942);--wager-footer-height:calc(58px + var(--wager-panel-height))}
 #app.setup-reference #setup-footer.setup-footer,
 #app.setup-reference[data-screen="tracks"] #setup-footer.setup-footer{height:var(--wager-footer-height);inset:auto 10px 0;display:grid;grid-template-columns:90px minmax(0,1fr);grid-template-rows:48px var(--wager-panel-height);gap:4px 10px;padding:0 0 6px;align-content:end}
 #app.setup-reference #setup-footer .setup-footer-left,
 #app.setup-reference[data-screen="tracks"] #setup-footer .setup-footer-left{grid-column:1;grid-row:1;align-self:stretch}
 #app.setup-reference #setup-footer #guide-button,
 #app.setup-reference #setup-footer #course-back{width:90px;height:48px;min-width:0;font-size:13px}
 #app.setup-reference #setup-footer #select-course,
 #app.setup-reference #setup-footer #race-button{grid-column:2;grid-row:1;width:100%;min-width:0;height:48px;padding:0 8px;font-size:24px;gap:6px}
 #app.setup-reference #setup-footer #select-course>b{font-size:19px}
 #app.setup-reference #setup-footer .bet-control.illustrated-wager,
 #app.setup-reference[data-screen="tracks"] #setup-footer .bet-control.illustrated-wager{position:relative;inset:auto;grid-column:1/-1;grid-row:2;width:var(--wager-panel-width);height:auto;max-width:100%;justify-self:center;align-self:end}
 #app.setup-reference #garage-screen.setup-screen{--hero-height:clamp(166px,25dvh,248px);bottom:calc(var(--wager-footer-height) + 6px)}
 #app.setup-reference #tracks-screen.setup-screen{bottom:calc(var(--wager-footer-height) + 6px)}
}
