/* Shared digital meters and distinct feature lighting. All effects stay in their frames. */
body{--feature-accent:#93a9c6;--feature-ink:#101725;--feature-rgb:147 169 198}
body[data-feature-mode=free]{--feature-accent:#bc8cff;--feature-ink:#24123d;--feature-rgb:188 140 255}
body[data-feature-mode=characters]{--feature-accent:#ffd265;--feature-ink:#33240d;--feature-rgb:255 210 101}
body[data-feature-mode=cash]{--feature-accent:#42efd0;--feature-ink:#082d2a;--feature-rgb:66 239 208}
body[data-feature-mode=boost]{--feature-accent:#ff963f;--feature-ink:#3c1c08;--feature-rgb:255 150 63}
body[data-feature-mode=diamond]{--feature-accent:#83dfff;--feature-ink:#0c2844;--feature-rgb:131 223 255}
body[data-feature-mode=raid]{--feature-accent:#ff68ac;--feature-ink:#351226;--feature-rgb:255 104 172}
body[data-feature-mode=wheel]{--feature-accent:#c5f65b;--feature-ink:#23330e;--feature-rgb:197 246 91}
body[data-feature-mode=gamble]{--feature-accent:#ff6876;--feature-ink:#37121a;--feature-rgb:255 104 118}
body .cabinet .meters{box-sizing:border-box;display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1.2fr) minmax(0,.72fr);gap:6px;height:auto;min-height:76px;margin:8px 0 6px;padding:0;border:0;background:transparent;overflow:hidden;border-radius:12px}
body .cabinet .meters .meter{position:relative;box-sizing:border-box;display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:14px 29px 12px;align-content:center;gap:2px;min-width:0;height:78px;padding:7px 9px;overflow:hidden;border:1px solid #334158;border-radius:11px;background:linear-gradient(155deg,#1a2433,#0a101a)!important;box-shadow:inset 0 1px 0 #ffffff12;text-align:left}
body .cabinet .meter:before{content:'';position:absolute;inset:0 12px auto;height:2px;background:var(--feature-accent);opacity:.8}
body .cabinet .meter label{display:block;min-width:0;max-width:100%;height:auto;margin:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#aab9ce;font:750 clamp(8px,1.5vw,10px)/14px Arial,sans-serif;letter-spacing:.09em}
body .cabinet .meter strong{display:block;min-width:0;max-width:100%;height:29px;overflow:hidden;white-space:nowrap;color:#f2f7ff;font:750 clamp(16px,3.5vw,23px)/29px ui-monospace,SFMono-Regular,Consolas,'Liberation Mono',monospace;font-variant-numeric:tabular-nums;letter-spacing:-.055em;text-shadow:none;-webkit-text-stroke:0}
body .cabinet .meter small{grid-column:1;min-width:0;max-width:100%;height:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin:0;color:#8394ab;font:600 9px/12px Arial,sans-serif}
body .cabinet .meter:nth-child(2){border-color:rgb(var(--feature-rgb)/.5);background:linear-gradient(150deg,var(--feature-ink),#0b101b)!important}
body .cabinet .meter:nth-child(2) strong,body .cabinet .meter:nth-child(3) strong{color:var(--feature-accent);text-shadow:0 0 12px rgb(var(--feature-rgb)/.22)}
body .cabinet .meter:nth-child(3){text-align:center}
body[data-feature-mode]:not([data-feature-mode=base]) .cabinet .machine{border-color:var(--feature-accent)!important;background:var(--feature-ink)!important;box-shadow:inset 0 0 0 1px rgb(var(--feature-rgb)/.8),inset 0 0 22px rgb(var(--feature-rgb)/.22)!important}
body[data-feature-mode]:not([data-feature-mode=base]) .cabinet #reels{isolation:isolate;border-color:var(--feature-accent)!important;background:var(--feature-ink)!important;box-shadow:inset 0 0 0 2px rgb(var(--feature-rgb)/.65),inset 0 0 30px rgb(var(--feature-rgb)/.3)!important}
body[data-feature-mode]:not([data-feature-mode=base]) #reels>.reel{background:var(--feature-ink)!important;box-shadow:inset 1px 0 rgb(var(--feature-rgb)/.4),inset -1px 0 rgb(var(--feature-rgb)/.4)}
body[data-feature-mode]:not([data-feature-mode=base]) #reels :is(.cell,.reel-tile,.hole-symbol){background:radial-gradient(ellipse at 50% 35%,rgb(var(--feature-rgb)/.23),transparent 74%),var(--feature-ink)!important;border-color:rgb(var(--feature-rgb)/.22)!important}
/* Lit edges on each stationary symbol without changing sprite crops or wild effects. */
body[data-feature-mode]:not([data-feature-mode=base]) #reels .cell:not(.win):not(.line-active):not(.wild-cell){box-shadow:inset 0 0 16px rgb(var(--feature-rgb)/.2)}
body[data-feature-mode]:not([data-feature-mode=base]) .cabinet #bonusBanner{box-sizing:border-box;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;border:1px solid rgb(var(--feature-rgb)/.6);border-radius:7px;background:linear-gradient(100deg,var(--feature-ink),rgb(var(--feature-rgb)/.25),var(--feature-ink))!important;color:var(--feature-accent)!important;font-family:Arial,sans-serif;letter-spacing:.06em;text-shadow:0 0 12px rgb(var(--feature-rgb)/.35)}
body[data-feature-mode]:not([data-feature-mode=base]) .cabinet #featureTag{color:var(--feature-accent)!important}
/* Bonus overlays have their own frame; Diamond changes colour as soon as it appears. */
body #reels .tits-rush{border:1px solid var(--feature-accent);border-radius:9px;background:radial-gradient(ellipse at top,rgb(var(--feature-rgb)/.16),transparent 75%),var(--feature-ink);box-shadow:inset 0 0 22px rgb(var(--feature-rgb)/.18)}
body #reels .tits-rush:before{background:repeating-linear-gradient(0deg,transparent 0 5px,#ffffff 5px 6px);opacity:.025}
body #reels .tits-rush.is-diamond{--feature-accent:#83dfff;--feature-ink:#0c2844;--feature-rgb:131 223 255}
body #reels .tits-rush .rush-slot{border-color:rgb(var(--feature-rgb)/.4);background:linear-gradient(150deg,rgb(var(--feature-rgb)/.09),#080d17);box-shadow:inset 0 0 14px rgb(var(--feature-rgb)/.12)}
body #reels .tits-rush :is(header strong,.rush-status){color:var(--feature-accent);font-family:Arial,sans-serif}
body #reels .rush-meter{border-color:rgb(var(--feature-rgb)/.3);border-radius:7px;background:#080e19}
body #reels .rush-meter output{font-family:ui-monospace,Consolas,monospace;color:#f0f8ff;text-shadow:none}
body #reels .rush-spins{border-color:rgb(var(--feature-rgb)/.5);color:var(--feature-accent);background:#0b121e;border-radius:6px}
body #banditDialog .raid-grid{border-color:#ff68ac;box-shadow:inset 0 0 20px #ff68ac33;background:#210e20}
body #banditDialog .raid-cell{border-color:#ff68ac66;background:radial-gradient(#4a1939,#140c1c)!important;box-shadow:inset 0 0 12px #ff68ac22}
body #gambleDialog{border-color:#ff6876;box-shadow:inset 0 0 24px #ff68761c,0 20px 70px #0009}
@media(max-width:430px){body .cabinet .meters{gap:4px;min-height:70px}body .cabinet .meters .meter{height:70px;padding:6px;grid-template-rows:12px 25px 11px;border-radius:9px}body .cabinet .meter label{font-size:8px;line-height:12px;letter-spacing:.02em}body .cabinet .meter strong{height:25px;line-height:25px;font-size:17px}body .cabinet .meter small{font-size:8px;line-height:11px;height:11px}}
/* Labels may use two lines on narrow screens, never lose their meaning to ellipses. */
body .cabinet .meters .meter{grid-template-rows:22px 25px 10px;padding-block:6px}
body .cabinet .meter label{display:flex;align-items:center;height:22px;line-height:11px;white-space:normal;text-overflow:clip;font-size:9px;letter-spacing:.035em}
body .cabinet .meter:nth-child(3) label{justify-content:center}
body .cabinet .meter strong{height:25px;line-height:25px}
body .cabinet .meter small{height:10px;line-height:10px}
@media(max-width:430px){body .cabinet .meters .meter{grid-template-rows:20px 23px 9px;padding-block:5px}body .cabinet .meter label{height:20px;font-size:8px;line-height:10px;letter-spacing:0}body .cabinet .meter strong{height:23px;line-height:23px}body .cabinet .meter small{height:9px;line-height:9px}}

/* One fixed status strip: the bonus message replaces, rather than covers, the normal copy. */
body .cabinet .feature{position:relative;display:flex;align-items:center;justify-content:space-between;gap:8px;height:44px;min-height:44px;max-height:44px;box-sizing:border-box;padding:4px 8px;overflow:hidden;isolation:isolate}
body .cabinet .feature>span,body .cabinet .feature>strong{min-width:0;max-width:100%;line-height:1.2;overflow-wrap:anywhere;white-space:normal}
body .cabinet .feature>span{flex:0 1 38%}
body .cabinet .feature>strong{flex:1 1 62%;text-align:right;font-size:clamp(10px,2.6vw,12px);letter-spacing:.025em}
body .cabinet .feature:has(#bonusBanner:not([hidden]))>:not(#bonusBanner){visibility:hidden}
body .cabinet .feature #bonusBanner{position:absolute;inset:0;display:flex!important;align-items:center;justify-content:center;box-sizing:border-box;width:100%;height:44px;min-height:44px;max-height:44px;margin:0;padding:4px 8px;border:0;border-radius:0;z-index:1;visibility:visible;overflow:hidden;text-overflow:clip;white-space:normal;overflow-wrap:anywhere;font:900 clamp(10px,2.8vw,14px)/1.2 Arial,sans-serif;letter-spacing:.025em;text-align:center;background:var(--feature-ink)!important}
body .cabinet .feature #bonusBanner[hidden]{display:none!important;visibility:hidden}
/* Allow headings and counters to share narrow feature frames without forcing them wider. */
body #reels .tits-rush header{min-width:0;flex:none}
body #reels .tits-rush header strong{min-width:0;flex:1;overflow-wrap:anywhere;line-height:1.1;text-align:left}
body #reels .rush-spins{flex:none;max-width:45%;white-space:normal;text-align:center;line-height:1.1}
body :is(.free-games-splash,.hold-intro,.tits-intro-sign,.kraken-title,.zarn-takeover-copy,.trots-stampede-copy,.tits-rescue-copy,.hold-total-card){box-sizing:border-box;max-width:100%;overflow-wrap:anywhere}
body :is(.free-games-splash,.hold-intro,.tits-intro-sign,.kraken-title,.zarn-takeover-copy,.trots-stampede-copy,.tits-rescue-copy,.hold-total-card) :is(strong,small,output){max-width:100%;box-sizing:border-box;white-space:normal;overflow-wrap:anywhere}

/* Seven denominations and recharge copy must fit the smallest supported phone. */
body .cabinet :is(#reset,#lockVault){min-width:0;max-width:100%;white-space:normal;overflow-wrap:anywhere;padding-inline:6px}
body .cabinet :is(#reset,#lockVault) :is(b,small){display:block;min-width:0;max-width:100%;white-space:normal;overflow-wrap:anywhere;line-height:1.15}
@media(max-width:360px){body .cabinet #denominations{gap:2px}body .cabinet #denominations button{padding-inline:0;font-size:10px;letter-spacing:0}body .cabinet :is(#reset,#lockVault) b{font-size:11px}body .cabinet :is(#reset,#lockVault) small{font-size:9px}}

/* Reserve room for the checkbox and its full label inside the restaurant artwork. */
body #strayaFeature.straya-restaurant-cabinet footer label{flex:0 0 38%;max-width:38%;min-width:0;white-space:normal;overflow-wrap:anywhere;line-height:1.15}
body #strayaFeature.straya-restaurant-cabinet footer label input{flex:none;margin-inline:0}
