/* Reflow the same supplied artwork and live controls below desktop width. */
@media (max-width:900px) and (orientation:portrait) {
  #game { min-height:100svh; overflow-x:hidden; display:flex; flex-direction:column; align-items:stretch; justify-content:flex-start; }
  #game > .topbar { order:-1; position:relative; inset:auto; height:46px; padding:0 max(14px,env(safe-area-inset-right)); z-index:20; }
  .reference-stage {
    position:relative; inset:auto; width:100%; max-width:none; height:auto;
    min-height:calc(100svh - 46px); aspect-ratio:auto; margin:0; transform:none;
    overflow:visible; isolation:isolate; background:#0b2116;
  }
  .reference-stage > .landscape { display:none; background:none; }
  .reference-stage > .reference-mobile-scenery {
    display:block; position:absolute; inset:0; width:100%; height:100%;
    z-index:-4; pointer-events:none;
  }
  .reference-stage > .scene-light {
    display:block; position:absolute; inset:0; z-index:-3; pointer-events:none;
    background:linear-gradient(180deg,#041b1233 0%,transparent 25%,#061b1433 50%,#06170dd9 86%);
  }
  .reference-stage > #atmosphere { position:absolute; inset:0 auto auto 0; width:100%; height:var(--reference-main-height,740px); z-index:-1; pointer-events:none; }
  .reference-stage #main-scene {
    position:relative; inset:auto; width:100%; max-width:580px; height:auto; min-height:0; max-height:none;
    margin:0 auto; padding:4px 18px 6px; display:grid;
    grid-template-columns:minmax(0,42%) minmax(0,58%);
    grid-template-rows:clamp(145px,41vw,215px) auto 142px;
    align-items:center; gap:4px 0;
  }
  .reference-stage .adventure-side { display:contents; position:static; inset:auto; width:auto; height:auto; }
  .reference-stage .brand {
    display:block; position:relative; inset:auto; left:auto; top:auto; transform:none; clip-path:none; overflow:visible;
    grid-column:1/-1; grid-row:1; width:100%; height:100%; max-height:none; margin:0; z-index:2;
  }
  .reference-stage .brand h1 { width:100%; height:100%; margin:0; }
  .reference-stage .brand-logo { display:block; width:100%; height:100%; object-fit:contain; object-position:center; }
  .reference-stage .wheel-area {
    position:relative; inset:auto; grid-column:1/-1; grid-row:2;
    width:100%; max-width:500px; height:auto; aspect-ratio:1; margin:0 auto;
  }
  .reference-stage .wheel-halo { display:block; position:absolute; inset:1%; border-radius:50%; }
  .reference-stage .wheel-frame {
    position:absolute; inset:3%; width:auto; height:auto; border-radius:50%; overflow:hidden;
    border:7px solid #98651e; background:#422906;
    box-shadow:0 0 0 2px #ffe3a0,0 0 0 6px #65451b,0 12px 24px #0009;
  }
  .reference-stage #wheel { display:block; position:relative; inset:auto; width:100%; height:100%; border-radius:50%; }
  .reference-stage .wheel-hub { display:grid; position:absolute; inset:33%; width:auto; height:auto; }
  .reference-stage .pointer {
    display:block; position:absolute; top:-4%; left:44.84375%; right:auto; bottom:auto; width:10.625%; height:11.5625%; opacity:1;
    background:none;
    clip-path:polygon(0 0,100% 0,50% 100%); border:0; z-index:5;
  }
  .reference-stage #host {
    display:block; position:relative; inset:auto; grid-column:1; grid-row:3;
    width:100%; height:190px; max-width:none; object-fit:contain; align-self:end; justify-self:center;
    pointer-events:none;
  }
  .reference-stage .spin-area {
    position:relative; inset:auto; transform:none; grid-column:1/-1; grid-row:3; width:min(100%,330px); min-width:0; justify-self:center;
    padding:6px 0 10px; align-self:center; text-align:center;
  }
  .reference-stage .spin-area p {
    font:400 clamp(11px,2.8vw,14px)/1.5 var(--game-font); min-height:0;
    margin:0 0 12px; padding:4px 2px; color:#fff1cf; text-shadow:0 2px 4px #001a0e;
  }
  .reference-stage .spin-button {
    width:100%; min-height:62px; height:66px; gap:10px; padding:0 8px;
    font-size:clamp(24px,6.8vw,32px); letter-spacing:2px;
  }
  .reference-stage .spin-glyph { font-size:30px; }
  .reference-stage #betting-dock {
    position:relative; inset:auto; width:100%; height:auto; min-height:0; max-height:none;
    padding:18px max(14px,env(safe-area-inset-right)) max(18px,env(safe-area-inset-bottom));
    border:0; border-top:1px solid #bd985354;
    background:linear-gradient(180deg,#0b1a12c9,#08170fe8); box-shadow:0 -12px 28px #05170b66;
    overflow:visible;
  }
  .reference-stage .console-controls {
    position:relative; inset:auto; display:grid; width:100%; max-width:600px; height:auto;
    margin:0 auto; padding:0; grid-template-columns:repeat(2,minmax(0,1fr));
    grid-template-rows:auto auto auto auto; gap:12px 10px; align-items:stretch;
  }
  .reference-stage .console-frame-art,
  .reference-stage .console-beam-art,
  .reference-stage .console-center-art,
  .reference-stage .console-edge-art { display:none; }
  .reference-stage .reference-skin {
    display:block; position:absolute; inset:0; width:100%; height:100%;
    overflow:hidden; z-index:0; pointer-events:none;
  }
  .reference-stage .console-controls .console-panel {
    position:relative; inset:auto; width:auto; height:auto; min-width:0; margin:0;
    padding:0; background:none; border:0; box-shadow:none; border-radius:0; isolation:isolate;
  }
  .reference-stage .console-controls .balance-meter,
  .reference-stage .console-controls .increment {
    width:100%; max-width:100%; aspect-ratio:var(--reference-ratio,2.7); min-height:66px; display:block;
  }
  .reference-stage .console-controls .balance-meter { grid-column:1; grid-row:1; }
  .reference-stage .console-controls .increment { grid-column:2; grid-row:1; }
  .reference-stage .console-controls .balance-meter > span,
  .reference-stage .console-controls .increment > span {
    position:absolute; z-index:2; top:10%; left:15%; right:15%; width:auto;
    margin:0; padding:1px 2px; text-align:center; background:#17170feb;
    font:400 clamp(8px,2.4vw,12px)/1.25 var(--game-font); letter-spacing:.3px; color:#ffe2a0;
  }
  .reference-stage .console-controls .balance-meter strong {
    display:grid; place-items:center; position:absolute; z-index:2;
    top:39%; left:8%; right:8%; width:auto; height:43%; margin:0; padding:0;
    font:400 clamp(18px,5.4vw,32px)/1 var(--game-font); letter-spacing:0; color:#fff1cb;
    background:none; border:0; box-shadow:none; text-shadow:0 2px 3px #000;
  }
  .reference-stage .console-controls .increment > div {
    position:absolute; z-index:2; inset:auto 0; top:50%; width:auto; height:auto; aspect-ratio:300/101;
    display:block; transform:translateY(-50%); padding:0;
  }
  .reference-stage .console-controls .increment strong {
    position:absolute; left:25%; top:36%; width:46.333333%; height:48%; display:grid; place-items:center; min-width:0; padding:0;
    font:400 clamp(17px,5vw,29px)/1 var(--game-font); letter-spacing:0; color:#fff1cb;
    background:none; border:0; box-shadow:none; text-shadow:0 2px 3px #000;
  }
  .reference-stage .console-controls .increment button {
    position:absolute; top:24.752475%; width:18.666667%; height:55.445545%; min-width:0; min-height:0; padding:0;
    border:1px solid #fff3ad; border-radius:50%; box-shadow:0 0 0 1px #694814; background:radial-gradient(ellipse at 35% 20%,#fff0aa,#e8b747 45%,#a16a19 72%,#edc66b); color:#321f0d; text-shadow:none; font-size:22px;
  }
  .reference-stage .console-controls .increment #minus { left:4%; right:auto; }
  .reference-stage .console-controls .increment #plus { left:72.833333%; right:auto; }
  .reference-stage .console-controls .increment button:focus-visible { outline-offset:-3px; }
  .reference-stage .reference-utilities { display:contents; position:static; inset:auto; width:auto; height:auto; }
  .reference-stage .console-controls .bet-actions {
    position:relative; inset:auto; grid-column:1/-1; grid-row:2; display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; width:auto; height:auto; margin:0;
    pointer-events:auto;
  }
  .reference-stage .console-controls .bet-actions button {
    position:relative; inset:auto; width:auto; min-width:0; height:auto; min-height:40px;
    padding:8px 3px; border:1px solid #b49252; border-radius:4px;
    background:linear-gradient(#253021e8,#101f15f5); box-shadow:inset 0 0 0 2px #e5bf6e12;
    font-size:13px; color:#ffe3a1; text-shadow:0 1px 2px #000; white-space:nowrap;
  }
  .reference-stage .console-controls .bet-actions button span {
    position:relative; font:400 clamp(9px,2.4vw,12px)/1.2 var(--game-font); margin-left:3px; letter-spacing:0;
  }
  .reference-stage .console-controls .bet-actions button:disabled { opacity:.5; color:#b7aa86; }
  .reference-stage .console-controls .categories {
    position:relative; inset:auto; grid-column:1/-1; grid-row:3; display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr)); gap:19px 7px;
    width:auto; max-width:none; min-width:0; height:auto; margin:4px 0 0; padding:0; pointer-events:none;
  }
  .reference-stage .console-controls .bet-category {
    position:relative; inset:auto; width:auto; height:auto; min-width:0; min-height:60px;
    aspect-ratio:var(--reference-ratio,1.2); margin:0; padding:0;
    display:block; border:0; border-radius:4px; box-shadow:none; background:none;
    isolation:isolate; pointer-events:auto;
  }
  .reference-stage .console-controls .reference-number::before {display:none}
  .reference-stage .console-controls .category-number {
    position:absolute; z-index:2; inset:11% 0 10%; display:grid; place-items:center;
    font:400 clamp(30px,9.7vw,60px)/1 var(--game-font); color:#fff0ca; text-shadow:1px 2px 1px #3b2110;
  }
  .reference-stage .console-controls .category-portrait { display:none; }
  .reference-stage .console-controls .category-name {
    position:absolute; z-index:3; bottom:6%; left:7%; right:7%; top:auto;
    height:18%; display:grid; place-items:center; padding:1px 0; margin:0;
    background:#080c0bf5; color:#fff0ca;
    font:400 clamp(8px,2.3vw,13px)/1.1 var(--game-font); letter-spacing:0; white-space:nowrap;
  }
  .reference-stage .console-controls .stake-badge {
    position:absolute; z-index:5; top:-10px; left:50%; right:auto; bottom:auto;
    width:max-content; max-width:calc(100% - 4px); transform:translateX(-50%);
    padding:2px 7px; font:400 clamp(9px,2.6vw,12px)/1.2 var(--game-font);
    border:1px solid #ffe5a5; background:linear-gradient(#f1d790,#ad792b); color:#26180d;
  }
  .reference-stage .console-controls .bet-category.landed { box-shadow:0 0 0 2px #fff1b6,0 0 18px #f5be46b0; }
  .reference-stage .console-controls .total-meter {
    grid-column:1/-1; grid-row:4; display:grid; grid-template-columns:minmax(0,1fr) auto;
    align-content:center; align-items:center; gap:3px 12px; min-height:57px;
    padding:10px 14px; border:1px solid #a88749; border-radius:5px;
    background:linear-gradient(#1b2a1de8,#0a1e13f5); text-align:left;
  }
  .reference-stage .console-controls .total-meter > span {
    position:relative; inset:auto; grid-column:1; grid-row:1; margin:0; padding:0;
    font:400 10px/1.2 var(--game-font); letter-spacing:.6px; color:#efd28f; background:none;
  }
  .reference-stage .console-controls .total-meter strong {
    position:relative; inset:auto; grid-column:2; grid-row:1/3; width:auto; height:auto;
    font:400 clamp(21px,5.5vw,30px)/1 var(--game-font); letter-spacing:0; text-align:right;
  }
  .reference-stage .console-controls .total-meter small {
    display:block; position:relative; inset:auto; grid-column:1; grid-row:2; margin:0;
    font:400 clamp(7px,1.9vw,10px)/1.3 var(--game-font); letter-spacing:0; white-space:normal; color:#c6c9a4;
  }
  #game.bonus-mode .reference-stage #main-scene,
  #game.bonus-mode .reference-stage #betting-dock { display:none; }
}
@media (max-width:360px) and (orientation:portrait) {
  .reference-stage #main-scene { padding-right:12px; padding-left:12px; grid-template-rows:140px auto 130px; }
  .reference-stage #host { height:174px; }
  .reference-stage .spin-area { padding-left:1px; }
  .reference-stage .spin-area p { font-size:10px; margin-bottom:9px; }
  .reference-stage .spin-button { height:58px; min-height:58px; font-size:23px; gap:6px; }
  .reference-stage .spin-glyph { font-size:25px; }
  .reference-stage #betting-dock { padding-right:12px; padding-left:12px; }
  .reference-stage .console-controls { column-gap:8px; }
  .reference-stage .console-controls .categories { column-gap:5px; row-gap:17px; }
  .reference-stage .console-controls .balance-meter > span,
  .reference-stage .console-controls .increment > span { font-size:8px; letter-spacing:0; }
  .reference-stage .console-controls .balance-meter strong { font-size:17px; }
  .reference-stage .console-controls .increment strong { font-size:17px; }
  .reference-stage .console-controls .category-name { font-size:7px; }
  .reference-stage .reference-utilities { display:contents; position:static; inset:auto; width:auto; height:auto; }
  .reference-stage .console-controls .bet-actions { gap:5px; }
  .reference-stage .console-controls .bet-actions button { font-size:11px; }
  .reference-stage .console-controls .bet-actions button span { font-size:8px; margin-left:2px; }
}




@media (max-width:900px) and (orientation:portrait){.reference-stage>.reference-mobile-scenery{height:var(--reference-main-height,740px)}}
@media (max-width:900px) and (orientation:portrait){#game.bonus-mode>.topbar{position:absolute;top:0;right:0;left:auto;bottom:auto;order:initial}}

@media (max-width:900px) and (orientation:portrait){.reference-stage .console-controls .increment button{background:none;border:0;box-shadow:none;color:transparent;text-shadow:none}.reference-stage .console-controls .increment button:not(:disabled):is(:hover,:focus-visible){filter:none;background:#ffda7022;box-shadow:inset 0 0 0 1px #fff1bcb3,0 0 10px #eac36988}}

@media (max-width:900px) and (orientation:portrait){.reference-stage>.reference-video-layer{height:var(--reference-main-height,740px);aspect-ratio:auto;z-index:-4}}

@media(max-width:600px){#info-body table{font-size:11px}#info-body th,#info-body td{padding:7px 4px}}

@media (max-width:360px) and (orientation:portrait){#info-body table{font-size:10px}#info-body th,#info-body td{padding:7px 3px}}

@media (max-width:900px) and (orientation:portrait){.reference-stage>.logo-shine-desktop{display:none}.reference-stage .brand h1{position:relative}.reference-stage .logo-shine-mobile{display:block;inset:0;mask-size:contain;-webkit-mask-size:contain;z-index:1}}
