/* Only the percentage numerals sit around the translucent ring. */
html[data-theme] #wheelScale :is(line,rect) {display:none!important;}
html[data-theme] #wheel .ring-rim {display:none!important;}
html[data-theme] #wheel .ring-edge {display:none!important;}
html[data-theme] #wheel .ring-base {fill:none!important;stroke:#382c24!important;stroke-opacity:.72;stroke-width:1.5;}
html[data-theme] #wheel .ring-arc {stroke-opacity:.84;filter:none!important;}
html[data-theme] #wheelScale text {fill:#e2d9c5!important;stroke:#211c1d!important;stroke-width:1.35px!important;paint-order:stroke fill;filter:none;font-size:10px;}
html[data-theme] #wheelScale text.on {fill:#c8f39c!important;filter:drop-shadow(0 0 2px #7ccc73);}
html[data-halloween="on"] #wheelScale text.on {fill:#ffd289!important;filter:drop-shadow(0 0 2px #ce9555);}
html[data-theme] .wheel-glow {opacity:.12!important;}
.ptr-staff-detailed {display:none;}
html[data-weapon="staff"] #pointer>* {display:none!important;}
html[data-weapon="staff"] #pointer>.ptr-staff-detailed {display:inline!important;image-rendering:pixelated;}

/* Keep the wheel legible in the short viewport inside mobile Telegram. */
@media(max-width:600px){
 html[data-theme] #view-upgrade {justify-content:flex-start;--upgrade-gap:8px;}
 html[data-theme] #view-upgrade .wheel-row {flex:0 0 auto;}
 html[data-theme] #view-upgrade .wheel-wrap {flex:none;margin-top:12px;margin-bottom:2px;}
 html[data-theme] #view-upgrade .sky-btn {top:0;right:4px;width:38px;height:38px;}
 html[data-theme] #view-upgrade .sky-btn svg {width:22px;height:22px;}
 html[data-theme] #view-upgrade .spin-row {margin-top:14px;}
 html[data-theme] #view-upgrade .mode-track {padding-top:23px;padding-bottom:20px;}
 html[data-theme] #view-upgrade .cta.spin-btn {width:82px;height:82px;font-size:26px;}
 html[data-theme] #view-upgrade .fast-btn {width:60px;height:60px;}
 html[data-theme] #view-upgrade .hat-hint {font-size:8px;line-height:1.5;margin:2px auto 0;}
}
@media(max-width:600px) and (max-height:700px){
 html[data-theme] #view-upgrade .mode-cost {font-size:15px;}
 html[data-theme] #view-upgrade .mode-chance {font-size:15px;}
 html[data-theme] #view-upgrade .mode-edge {font-size:12px;}
 html[data-theme] #view-upgrade .chance-custom {margin-top:2px;font-size:9px;}
 html[data-theme] #view-upgrade .chance-custom input {font-size:12px;padding:5px 4px;}
}
html:not([data-halloween="on"]) #view-chests #cxGrid .cx-cell img {image-rendering:pixelated!important;}
