
  body.arctic-player.bang-layout .player {
    /* A 300 × 784 design-unit group scales as one, without per-control caps.
       Keep 14% clear on each rail side and 7.9% / 8.6% above / below. */
    --pc-rail-width:max(260px,calc(var(--bang-width)*0.25));
    --pc-rail-art:url("/slot-bang/assets/pc-rail-frame.png");
    --pc-column-gap:clamp(10px,calc(var(--bang-width)*0.012),20px);
    --pc-unit:min(calc(var(--pc-rail-width)*.72/300),calc((calc(var(--bang-height)*1.0) - 20px)*.835/784));
    --pc-group-width:calc(var(--pc-unit)*300);
    --pc-group-height:calc(var(--pc-unit)*784);
    --pc-group-top:calc((calc(var(--bang-height)*1.0) - 20px)*.067 + ((calc(var(--bang-height)*1.0) - 20px)*.859 - var(--pc-group-height))/2);
    --pc-rail-padding:calc((var(--pc-rail-width) - var(--pc-group-width))/2);
    --pc-panel-height:calc(var(--pc-unit)*80);
    --pc-spin-size:calc(var(--pc-unit)*220);
    --pc-aux-height:calc(var(--pc-unit)*84);
    --pc-aux-width:calc(var(--pc-unit)*140);
    --pc-row-gap:calc(var(--pc-unit)*12);
    --pc-nav-size:calc(var(--pc-unit)*84);
    --pc-nav-gap:calc(var(--pc-unit)*24);
    --pc-aux-gap:calc(var(--pc-unit)*20);
    --pc-opening-left:6.93%;
    --pc-opening-top:18.57%;
    --pc-opening-width:86.14%;
    --pc-opening-height:70.79%;
    display:grid;
    grid-template-columns:minmax(0,1fr) var(--pc-rail-width);
    grid-template-rows:calc(var(--pc-group-top) + var(--pc-nav-size) + var(--pc-row-gap)) minmax(0,1fr);
    column-gap:var(--pc-column-gap);
    row-gap:0;
    align-items:center;
    align-content:stretch;
    justify-content:stretch;
    width:calc(var(--bang-width)*1.0);
    height:calc(var(--bang-height)*1.0);
    min-height:calc(var(--bang-height)*1.0);
    margin:0;
    padding:10px;
  }
  body.arctic-player.bang-layout .player::before {
    content:"";
    position:absolute;
    z-index:0;
    top:calc(10px + calc(var(--bang-height)*0.05));
    right:calc(10px + var(--pc-rail-width)*.1);
    bottom:calc(10px + calc(var(--bang-height)*0.05));
    width:calc(var(--pc-rail-width)*.8);
    background:#05243b url("/slot-bang/assets/inner-ocean.png") center/cover no-repeat;
    opacity:.85;
    pointer-events:none;
  }
  body.arctic-player.bang-layout .player::after {
    content:"";
    position:absolute;
    z-index:1;
    top:10px;
    right:10px;
    bottom:10px;
    width:var(--pc-rail-width);
    background-image:var(--pc-rail-art,none);
    background-position:center;
    background-repeat:no-repeat;
    background-size:100% 100%;
    pointer-events:none;
  }
  body.arctic-player.bang-layout .player > .game-stage {
    grid-column:1;
    grid-row:1 / 3;
    width:100%;
    height:calc(calc(var(--bang-height)*1.0) - 20px);
    min-width:0;
    max-width:none;
    margin:0;
    align-self:stretch;
    justify-self:stretch;
  }
  body.arctic-player.bang-layout .game-stage .board-frame {
    width:100%;
    height:100%;
    aspect-ratio:auto;
  }
  body.arctic-player.bang-layout .game-stage .board-window {
    left:var(--pc-opening-left);
    top:var(--pc-opening-top);
    width:var(--pc-opening-width);
    height:var(--pc-opening-height);
    aspect-ratio:auto;
  }
  body.arctic-player.bang-layout .game-stage #board {
    display:block;
    width:100%;
    height:100%;
    aspect-ratio:auto;
  }
  body.arctic-player.bang-layout .player > .player-header {
    grid-column:2;
    grid-row:1;
    position:relative;
    inset:auto;
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    grid-template-rows:var(--pc-nav-size);
    gap:var(--pc-nav-gap);
    align-content:start;
    align-items:center;
    justify-items:center;
    width:100%;
    height:100%;
    min-width:0;
    margin:0;
    padding:var(--pc-group-top) var(--pc-rail-padding) var(--pc-row-gap);
    align-self:stretch;
  }
  body.arctic-player.bang-layout .player-header .theme-name {display:none}
  body.arctic-player.bang-layout .player-header #back,
  body.arctic-player.bang-layout .player-header #history-button,
  body.arctic-player.bang-layout .player-header #fullscreen {
    grid-row:1;
    width:var(--pc-nav-size);
    height:var(--pc-nav-size);
    min-width:0;
    margin:0;
    border-radius:0!important;
  }
  body.arctic-player.bang-layout .player-header #back {grid-column:1}
  body.arctic-player.bang-layout .player-header #history-button {grid-column:2}
  body.arctic-player.bang-layout .player-header #fullscreen {grid-column:3}
  body.arctic-player.bang-layout .player > .control-dock {
    grid-column:2;
    grid-row:2;
    position:relative;
    inset:auto;
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    grid-template-rows:repeat(3,var(--pc-panel-height)) var(--pc-spin-size) repeat(2,var(--pc-aux-height));
    grid-template-areas:"balance balance" "bet bet" "win win" "spin spin" "fast auto" "help sound";
    gap:var(--pc-row-gap) var(--pc-aux-gap);
    align-items:center;
    justify-items:center;
    align-content:start;
    width:100%;
    max-width:none;
    height:100%;
    margin:0;
    padding:0 var(--pc-rail-padding);
    border:0;
    border-radius:0;
    background:none;
    box-shadow:none;
    align-self:stretch;
  }
  body.arctic-player.bang-layout .player > .control-dock::before,
  body.arctic-player.bang-layout .player > .control-dock::after {display:none;content:none}
  body.arctic-player.bang-layout .control-dock > .value-panel {
    width:100%;
    height:var(--pc-panel-height);
    min-width:0;
    margin:0;
    padding:calc(var(--pc-unit)*8) calc(var(--pc-unit)*12);
    gap:calc(var(--pc-unit)*8);
    border-width:calc(var(--pc-unit)*2);
    border-radius:calc(var(--pc-unit)*22);
    align-self:center;
    justify-self:stretch;
  }
  body.arctic-player.bang-layout .control-dock > .balance-panel {grid-area:balance}
  body.arctic-player.bang-layout .control-dock > .bet-panel {grid-area:bet;padding-inline:calc(var(--pc-unit)*12);gap:calc(var(--pc-unit)*6)}
  body.arctic-player.bang-layout .control-dock > .win-panel {grid-area:win}
  body.arctic-player.bang-layout .control-dock .shell-icon {width:calc(var(--pc-unit)*36);height:calc(var(--pc-unit)*40)}
  body.arctic-player.bang-layout .control-dock .bet-shell {display:block;width:calc(var(--pc-unit)*28)}
  body.arctic-player.bang-layout .control-dock .value {
    font-size:calc(var(--pc-unit)*42);
    line-height:1;
    letter-spacing:calc(var(--pc-unit)*-.5);
  }
  body.arctic-player.bang-layout .control-dock .bet-value {font-size:calc(var(--pc-unit)*28)}
  body.arctic-player.bang-layout .control-dock #bet-minus,
  body.arctic-player.bang-layout .control-dock #bet-plus {
    width:calc(var(--pc-unit)*40);
    height:calc(var(--pc-unit)*40);
    flex:none;
    margin:0;
    border-radius:0!important;
  }
  body.arctic-player.bang-layout .control-dock #spin {
    grid-area:spin;
    width:var(--pc-spin-size);
    height:var(--pc-spin-size);
    margin:0;
    transform:none;
    border-radius:0!important;
    align-self:center;
    justify-self:center;
  }
  body.arctic-player.bang-layout .control-dock #fast,
  body.arctic-player.bang-layout .control-dock #auto,
  body.arctic-player.bang-layout .control-dock #help,
  body.arctic-player.bang-layout .control-dock #sound {
    width:var(--pc-aux-width);
    height:var(--pc-aux-height);
    margin:0;
    transform:none;
    border-radius:0!important;
    align-self:center;
    justify-self:center;
  }
  body.arctic-player.bang-layout .control-dock #fast {grid-area:fast}
  body.arctic-player.bang-layout .control-dock #auto {grid-area:auto}
  body.arctic-player.bang-layout .control-dock #help {grid-area:help}
  body.arctic-player.bang-layout .control-dock #sound {grid-area:sound}
  body.arctic-player.bang-layout .player-header button,
  body.arctic-player.bang-layout .control-dock button {
    padding:0!important;
    border:0!important;
    background:none!important;
    box-shadow:none!important;
    border-radius:0!important;
    overflow:visible;
    clip-path:none;
  }
  body.arctic-player.bang-layout .player-header button::before,
  body.arctic-player.bang-layout .player-header button::after,
  body.arctic-player.bang-layout .control-dock button::before,
  body.arctic-player.bang-layout .control-dock button::after {display:none!important;content:none!important}
  body.arctic-player.bang-layout .player-header button > img,
  body.arctic-player.bang-layout .control-dock button > img {
    display:block;
    width:100%;
    height:100%;
    max-width:100%;
    max-height:100%;
    object-fit:contain;
    object-position:center;
    border-radius:0;
    clip-path:none;
  }
  body.arctic-player.bang-layout .control-dock button:active:not(:disabled) {transform:translateY(2px) scale(.97)}
  body.arctic-player.bang-layout .game-stage .status {
    bottom:0;
    font-size:clamp(9px,calc(var(--bang-height)*0.012),12px);
    padding-inline:10%;
  }
  body.arctic-player.bang-layout .player > .demo-note {
    grid-column:2;
    grid-row:2;
    position:relative;
    inset:auto;
    z-index:7;
    align-self:end;
    justify-self:center;
    width:100%;
    margin:0;
    padding:0;
    font-size:7px;
    letter-spacing:1px;
  }

html,body{width:100%;height:100%;overflow:hidden!important;margin:0}#bang-stage{position:fixed;transform-origin:top left;overflow:hidden;background:url('/slot-bang/assets/background.png') center/cover no-repeat}.demo-note,.theme-name{display:none!important}.status[hidden]{display:none!important}.status{pointer-events:none}.board-window canvas{touch-action:none}#bang-stage .player{position:relative}#bang-loading{position:fixed;z-index:1000;inset:0;display:grid;place-items:center;background:#03162d url('/loading-background-20261018.png') center/cover no-repeat}#bang-loading[hidden]{display:none}.bang-load-box{width:min(70vw,360px);padding:24px;background:#002843ef;border:2px solid #7ceaff;border-radius:18px;text-align:center}.bang-load-box progress{width:100%;height:18px;accent-color:#52eaff}.bang-load-box button{padding:10px;background:#ddf9e6;color:#147c38;border:1px solid #84cea0;border-radius:7px}.player-dialog,#shark-dialog{max-height:calc(var(--bang-height)*.88);max-width:calc(var(--bang-width)*.9);width:min(620px,calc(var(--bang-width)*.85));position:fixed;margin:0;left:50%;top:50%;transform:translate(-50%,-50%)}.player-dialog .dialog-body{max-height:calc(var(--bang-height)*.65)}.bang-rotated .player-dialog,.bang-rotated #shark-dialog{transform:translate(-50%,-50%) rotate(90deg);max-width:calc(var(--bang-width)*.9)}#shark-dialog{width:min(750px,calc(var(--bang-width)*.88));padding:10px}#shark-dialog .hunt-title{max-width:45%;max-height:calc(var(--bang-height)*.15);object-fit:contain}#shark-dialog .hunt-sub{display:none}#shark-dialog .hunt-layout{display:grid;grid-template-columns:28% 1fr;gap:10px}#shark-dialog .hunt-shark{max-width:100%;max-height:calc(var(--bang-height)*.4);object-fit:contain}#shark-dialog .prey-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:5px}#shark-dialog .prey-choice{min-height:0;height:calc(var(--bang-height)*.15);padding:2px}#shark-dialog .prey-choice img{height:100%;max-height:100%;max-width:100%;object-fit:contain}#shark-dialog .hunt-timer{font-size:14px;margin:4px}.bang-history-pages{display:flex;justify-content:center;align-items:center;gap:18px;margin-top:15px}.bang-layout .player .game-stage .status{bottom:1%;color:#e8ffff;background:#002641dd;border-radius:8px;left:15%;width:70%;padding:3px 8px}.bang-layout .player .value{font-variant-numeric:tabular-nums}#hunt-win{font-size:clamp(16px,3vw,34px)}

.bang-history-dialog{padding:16px;overflow:hidden}
.bang-history-dialog .dialog-heading{margin-bottom:12px}
.bang-history-dialog .dialog-body{display:flex;flex-direction:column;gap:12px;white-space:normal;max-height:none;overflow:hidden}
.bang-history-scroll{max-height:calc(var(--bang-height)*.88 - 150px);min-height:0;overflow:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#62ccea #05304d;border:1px solid #397b9a;border-radius:8px}
.bang-history-table{width:100%;border-collapse:collapse;font-size:13px;line-height:1.4;font-variant-numeric:tabular-nums}
.bang-history-table th{position:sticky;top:0;z-index:1;background:#0d4665;color:#bcf4ff;font-weight:700;text-align:left}
.bang-history-table th,.bang-history-table td{padding:7px 10px;border-bottom:1px solid #397b9a66;white-space:nowrap}
.bang-history-table tbody tr:nth-child(even){background:#154d662e}
.bang-history-table th:nth-child(n+2),.bang-history-table td:nth-child(n+2){text-align:right}
.bang-history-table .bang-history-result{font-weight:700}
.bang-history-table .bang-history-win{color:#53ed91}
.bang-history-table .bang-history-loss{color:#ff7777}
.bang-history-table .bang-history-tie,.bang-history-table .bang-history-pending{color:#8cdaff}
.bang-history-table .bang-history-empty{text-align:center;padding:22px}
.bang-history-dialog .bang-history-pages{display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:12px;margin:0;flex:none;font-variant-numeric:tabular-nums}
.bang-history-dialog .bang-history-pages button{min-width:62px;padding:5px 10px}
.bang-history-pages button:disabled{opacity:.42;cursor:default}
.bang-history-total{font-size:12px;color:#a8d8e9}
@media(max-width:760px){.bang-history-table{font-size:12px}.bang-history-table th,.bang-history-table td{padding:6px 8px}}
