/* HUD artwork, Rubik type and control treatment adapted from the supplied Shaft Slot source. */
@font-face{font-family:GaiaHUD;src:url('assets/imported-ui/fonts/Rubik-SemiBold.ttf') format('truetype');font-weight:600;font-display:swap}
@font-face{font-family:GaiaHUD;src:url('assets/imported-ui/fonts/Rubik-Bold.ttf') format('truetype');font-weight:700 900;font-display:swap}
:root{--hud-accent:#ffd201;--hud-ink:#fff;--hud-muted:#999}
[hidden]{display:none!important}
.console{display:block;min-height:0;padding:10px 12px 4px;background:linear-gradient(0deg,#081410,#102a2400);border:0;box-shadow:none}
#hud-viewport{position:relative;width:min(1120px,100%);margin:auto;overflow:visible}
#hud-shell{position:relative;width:1306px;height:170px;transform-origin:top left;font-family:GaiaHUD,system-ui,sans-serif;font-weight:600}
.hud-info,.hud-bet{position:absolute;top:16px;height:138px;background:center/100% 100% no-repeat;pointer-events:none}
.hud-info{left:144px;width:612px;background-image:url('assets/imported-ui/hud/panel-info.svg')}
.hud-bet{left:740px;width:486px;background-image:url('assets/imported-ui/hud/panel-bet.svg')}
.hud-buy{position:absolute;left:0;top:16px;width:160px;height:138px;padding:10px 24px 24px;background:url('assets/imported-ui/hud/bonus-button-disable.svg') center/100% 100% no-repeat;font:700 23px/1.08 GaiaHUD,sans-serif;color:#fff;letter-spacing:0;text-align:center;white-space:normal}
.hud-buy-mark{position:absolute;left:42px;top:22px;width:75px;height:75px;object-fit:contain}
.hud-buy:disabled{opacity:.6;background-image:url('assets/imported-ui/hud/bonus-button-disable.svg')}
.hud-buy span{position:absolute;left:10px;right:26px;bottom:20px;display:block;font-size:12px;white-space:nowrap;line-height:1}
.hud-chip{position:absolute;width:40px;height:40px;padding:8px;border:0;border-radius:0;background:url('assets/imported-ui/hud/chip-40-idle.svg') center/100% 100% no-repeat;display:flex;align-items:center;justify-content:center}
.hud-chip img{width:100%;height:100%;object-fit:contain;pointer-events:none}
.hud-chip:hover:not(:disabled){background-image:url('assets/imported-ui/hud/chip-40-hover.svg');filter:none}
.hud-chip.active,.hud-chip[aria-pressed=true]{background-image:url('assets/imported-ui/hud/chip-40-active.svg')}
.hud-chip.active img,.hud-chip[aria-pressed=true] img{filter:brightness(0) saturate(100%) invert(83%) sepia(84%) saturate(1890%) hue-rotate(356deg) brightness(104%)}
.hud-chip:active:not(:disabled),.hud-buy:active:not(:disabled){scale:.94}
#menu-btn{left:183px;top:38px}#plus{left:771px;top:15px}#minus{left:771px;top:63px}#auto-btn{left:1067px;top:15px}#turbo{left:1067px;top:63px;color:#fff;border:0}
#auto-count{position:absolute;inset:0;display:grid;place-items:center;font:600 17px GaiaHUD;color:var(--hud-accent)}
#auto-count:empty{display:none}.auto-playing #auto-btn img{visibility:hidden}
#hud-shell .meter{position:absolute;top:38px;min-width:0;font-variant-numeric:tabular-nums}
#hud-shell .meter>span,.hud-bet-display>span{font:600 24px/1.1 GaiaHUD,sans-serif;letter-spacing:0;color:var(--hud-muted);display:block;margin:0 0 7px}
#hud-shell .meter strong{font:600 32px/1.1 GaiaHUD,sans-serif;color:#fff;display:block;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#hud-shell .balance-meter{left:267px;width:240px}
#hud-shell .balance-meter small{display:none}
#hud-shell .win{left:487px;width:210px;text-align:right}
#hud-shell .win strong{color:var(--hud-accent)}
#hud-shell .meter small{font:600 11px GaiaHUD;letter-spacing:.8px;color:#999;margin-top:7px}
.hud-bet-display{position:absolute;left:847px;top:26px;width:224px;height:98px;padding:10px;background:none;text-align:center;border:0}
.hud-bet-display strong{font:600 32px/1.1 GaiaHUD;color:#fff}
#hud-shell .spin{position:absolute;left:1148px;top:0;width:158px;height:170px;border:0;border-radius:0;outline:0;box-shadow:none;background:none;padding:0;display:block;color:#fff}
#hud-shell .spin>span{position:absolute;inset:0;width:100%;height:100%;background:url('assets/imported-ui/hud/spin.svg') center/contain no-repeat;animation:none;line-height:normal;font-size:0}
#hud-shell .spin b{position:absolute;bottom:30px;left:0;right:0;font:700 11px GaiaHUD;letter-spacing:1px;text-align:center}
#hud-shell .spin:active:not(:disabled){scale:.96}#hud-shell .spin.busy>span{animation:none;filter:brightness(.75)}
.mode-toolbar{border:0;padding:5px 12px 0;background:none;gap:12px;font:600 10px GaiaHUD;color:#aaa;min-height:25px}
.mode-toolbar #current-mode{color:#f0e7ba;letter-spacing:.6px;text-transform:uppercase;min-width:0}
.mode-toolbar #mode-cost{min-width:0;color:#a0aa9e}
.mode-toolbar button{background:none;color:var(--hud-accent);font:600 9px GaiaHUD;padding:5px}
.mode-toolbar select[hidden]{display:none}
dialog{font-family:GaiaHUD,system-ui,sans-serif;background:#1b1c1f;border:1px solid #5c5d60;color:#fff;border-radius:16px;max-height:88svh;overflow:auto;padding:32px}
dialog::backdrop{background:#020604d9;backdrop-filter:blur(6px)}
dialog h1{font:700 30px/1.1 GaiaHUD;margin:12px 0 18px;color:#fff;letter-spacing:-.6px}
dialog p,dialog li{font:400 12px/1.65 GaiaHUD,sans-serif;color:#b1b4ba}
dialog .bonus-tier{color:var(--hud-accent);font:600 10px GaiaHUD;letter-spacing:2px}
dialog .primary{font:700 12px GaiaHUD;background:var(--hud-accent);color:#121212;padding:15px 24px;border-radius:8px;letter-spacing:.5px;min-height:44px}
dialog[data-panel=buy]{max-width:1040px;width:calc(100% - 32px)}
.buy-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:22px}
.buy-card{position:relative;display:flex;flex-direction:column;align-items:flex-start;text-align:left;padding:20px;border:1px solid #4b4f4c;border-radius:10px;background:linear-gradient(0deg,#171b19 35%,#15291bc9),url('assets/background/background-2.png') center/cover;min-height:248px;color:#fff;font-family:GaiaHUD}
.buy-card:hover,.buy-card.selected{border-color:var(--hud-accent);filter:none;background-color:#24291f}
.offer-kicker{color:#c1c4b7;font-size:9px;letter-spacing:1.5px;margin-bottom:12px}
.buy-card strong{font-size:19px;line-height:1.12;max-width:210px}
.buy-card p{font-size:11px;line-height:1.5;margin:10px 0 16px;flex:1}
.offer-price{display:block;color:var(--hud-accent);font-size:26px;line-height:1}
.offer-price small{display:block;color:#b7b8b3;font-size:10px;margin-top:5px}
.offer-action{position:absolute;right:16px;bottom:20px;color:#fff;font-size:10px;border-bottom:2px solid var(--hud-accent);padding-bottom:4px}
.text-button{display:block;background:none;color:#ccc;font:600 11px GaiaHUD;padding:16px 0 0;margin-top:6px}
.purchase-total{padding:24px 0;display:flex;flex-direction:column;gap:10px;border-block:1px solid #ffffff15;margin-top:20px}
.purchase-total>span{font-size:10px;color:#999;letter-spacing:1px}.purchase-total>strong{font-size:42px;color:var(--hud-accent)}.purchase-total small{font-size:11px;color:#bbb}
.bet-grid,.auto-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:20px 0}.auto-grid{grid-template-columns:repeat(4,1fr)}
.bet-grid button,.auto-grid button,.settings-actions button{background:#2b2d30;border:1px solid #56595b;border-radius:7px;min-height:48px;font:600 14px GaiaHUD;color:#fff;padding:12px}
.bet-grid button.selected,.auto-grid button.selected{color:#151515;background:var(--hud-accent);border-color:var(--hud-accent)}
.audio-settings{display:flex;flex-direction:column;gap:20px;margin:26px 0}
.volume-row{display:grid;grid-template-columns:36px 90px 1fr 38px;align-items:center;gap:10px;font-size:10px;color:#ccc}
.channel-button{background:none;padding:4px;width:36px;height:36px}.channel-button img{width:100%;height:100%}
.volume-row input{width:100%;accent-color:var(--hud-accent)}.volume-row output{text-align:right;color:#fff;font-variant-numeric:tabular-nums}
.settings-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px}.settings-actions button{font-size:10px;display:flex;align-items:center;justify-content:center;gap:8px}.settings-actions img{width:20px;height:20px}
@media(max-width:650px){
 .console{padding:4px 7px 0}.mode-toolbar{font-size:8px;gap:7px;flex-wrap:wrap;min-height:24px}
 #hud-shell{width:100%;height:180px;transform:none!important}
 .hud-info{left:0;top:0;width:100%;height:75px;background-image:url('assets/imported-ui/hud/mobile-panel.svg')}
 .hud-bet{left:22%;top:73px;width:58%;height:97px;background-image:url('assets/imported-ui/hud/mobile-menu-panel.svg')}
 #hud-shell .balance-meter{left:6%;top:14px;width:43%}#hud-shell .win{left:auto;right:6%;top:14px;width:42%}
 #hud-shell .meter>span,.hud-bet-display>span{font-size:10px;margin-bottom:5px}
 #hud-shell .meter strong{font-size:clamp(16px,5.3vw,22px)}#hud-shell .meter small{font-size:7px;margin-top:5px;letter-spacing:.5px}
 .hud-buy{left:0;top:78px;width:25%;height:92px;padding:5px 14px 18px;font-size:14px;background-image:url('assets/imported-ui/hud/mobile-bonus-button-blank.svg')}
 .hud-buy:disabled{background-image:url('assets/imported-ui/hud/mobile-bonus-button-blank.svg')}
 .hud-buy-mark{display:none}
 .hud-buy span{position:static;white-space:normal;font-size:14px;line-height:1.08;max-width:70px;margin:auto}
 .hud-chip{width:34px;height:34px;padding:7px}
 #menu-btn{left:27%;top:126px}#auto-btn{left:40%;top:126px}#turbo{display:flex;left:53%;top:126px}
 #minus{left:27%;top:82px}#plus{left:57%;top:82px}
 .hud-bet-display{left:36%;top:79px;width:20%;height:43px;padding:0}.hud-bet-display>span{font-size:8px;margin-bottom:2px}.hud-bet-display strong{font-size:19px}
 #hud-shell .spin{left:auto;right:0;top:72px;width:29%;height:108px}#hud-shell .spin>span{background-image:url('assets/imported-ui/hud/mobile-spin.svg')}
 #hud-shell .spin b{font-size:8px;bottom:23px}
 dialog{padding:26px 20px;max-height:90svh}dialog h1{font-size:26px}.buy-grid{grid-template-columns:1fr 1fr;gap:8px}.buy-card{padding:14px 12px;min-height:240px}.buy-card strong{font-size:16px}.buy-card p{font-size:10px}.offer-kicker{font-size:7px}.offer-action{font-size:8px;right:10px;bottom:15px}.offer-price{font-size:22px}
 .volume-row{grid-template-columns:30px 64px 1fr 32px;gap:6px;font-size:8px}.settings-actions button{font-size:9px}
}
/* Keep the imported controls inside the game viewport instead of below the page. */
header{height:54px}footer{min-height:32px}
.stage{height:calc(100svh - var(--hud-height,140px) - 130px);min-height:370px;max-height:850px}
.logo{width:160px;height:76px}.mode{margin-bottom:8px}.message{font-size:21px;min-height:26px}
@media(min-width:651px){.board-wrap{width:min(680px,88vw,max(360px,calc((100svh - var(--hud-height,140px) - 280px)*1.529)))}.mascot{height:280px}.bonus-strip{margin-top:5px}}
@media(max-width:650px){.stage{min-height:400px;padding:8px 0 14px}.logo{width:160px;height:68px}.message{font-size:18px;min-height:38px}.board-wrap{width:99vw}}