/* Lucky Club v7: responsive interaction layer + original Lucky Skies */
html,body,.app-shell { max-width:100%; }
html,body { overflow-x:clip; }
button,[role="button"] { -webkit-user-select:none; user-select:none; }
body.game-active { overscroll-behavior:none; }
.game-view.is-active { scroll-margin-top:0; }
.game-view .back-button,.game-view .sound-button { min-width:44px; min-height:44px; touch-action:manipulation; }

/* Keep the compact game chooser balanced on phones. */
@media (max-width:619px) {
  .tile-flight { grid-column:auto; min-height:190px; }
  .tile-flight .tile-copy { max-width:none; }
  .tile-flight .tile-copy small { max-width:12ch; }
  .flight-art b { margin-left:0; }
  .games-grid { align-items:stretch; }
}

/* Keep the integrated Lucky 88 cabinet inside the phone viewport. */
.slots-view,.slot-stage { width:100%; max-width:100%; }
.slot-stage .slot-machine,.slots-view .game-bet-panel { width:min(100%,680px); max-width:680px; }
.slot-stage { min-height:0; padding:4px 0 2px; }
.slot-machine .slot-screen { height:46.5%; }
.slot-machine .slot-crown { height:20%; }
@media (max-width:430px) {
  .mike-slots-scene { right:0; }
  .game-bet-panel { width:100%; grid-template-columns:minmax(94px,1fr) 88px minmax(72px,1fr); gap:3px; padding:7px; }
  .game-bet-panel .stepper { min-width:94px; grid-template-columns:44px minmax(0,1fr) 44px; gap:2px; }
  .game-bet-panel .stepper button { width:44px; height:44px; }
  .spin-button { width:84px; min-width:84px; height:68px; }
  .last-win,.potential-win { min-width:0; }
}

/* Original Lucky Skies experience. */
.lucky-skies-view { min-height:calc(100dvh - 76px - var(--safe-top)); }
.lucky-skies-view .game-topline { margin-bottom:8px; }
.lucky-skies-token-free { min-width:54px; min-height:44px; padding:0 10px; border:1px solid rgba(244,207,108,.25); border-radius:14px; display:grid; place-items:center; color:#ffe89b; background:#10392c; font:700 .55rem Oswald,sans-serif; letter-spacing:.08em; }
.lucky-skies-stage { width:100%; height:clamp(430px,calc(100dvh - 146px - var(--safe-top)),690px); min-height:430px; border:1px solid rgba(255,224,129,.26); border-radius:26px; position:relative; isolation:isolate; overflow:hidden; touch-action:none; background:#082e3d; box-shadow:0 22px 55px rgba(0,0,0,.42),inset 0 0 0 1px rgba(255,255,255,.04); }
.lucky-skies-stage canvas { width:100%; height:100%; display:block; position:absolute; inset:0; touch-action:none; }
.lucky-skies-stage::after { content:""; position:absolute; z-index:2; inset:0; pointer-events:none; box-shadow:inset 0 0 55px rgba(1,14,18,.42); }
.lucky-skies-hud { min-height:48px; padding:8px; display:grid; grid-template-columns:repeat(3,1fr); gap:6px; position:absolute; z-index:6; inset:0 0 auto; pointer-events:none; }
.lucky-skies-hud span { min-width:0; padding:7px 8px; border:1px solid rgba(255,230,143,.22); border-radius:13px; display:flex; align-items:center; justify-content:space-between; gap:5px; color:#a9c8c4; background:rgba(2,24,28,.72); box-shadow:0 6px 16px rgba(0,0,0,.2); backdrop-filter:blur(9px); font:700 .5rem Oswald,sans-serif; letter-spacing:.08em; }
.lucky-skies-hud b { color:#fff0a0; font-size:.88rem; letter-spacing:0; }
.lucky-skies-overlay { padding:68px 22px 24px; position:absolute; z-index:8; inset:0; display:grid; align-content:end; background:linear-gradient(180deg,rgba(2,18,27,.08) 18%,rgba(3,20,24,.3) 48%,rgba(2,14,16,.94) 100%); }
.lucky-skies-overlay[hidden] { display:none; }
.lucky-skies-intro-copy,.lucky-skies-over-copy { max-width:370px; position:relative; z-index:3; }
.lucky-skies-overlay .eyebrow { margin-bottom:7px; }
.lucky-skies-overlay h3 { margin:0 0 8px; color:#fff2b2; font:700 clamp(2.25rem,9vw,3.8rem)/.88 Oswald,sans-serif; letter-spacing:-.045em; }
.lucky-skies-overlay p:not(.eyebrow) { max-width:34ch; margin:0 0 16px; color:#d0e1dd; font-size:.72rem; line-height:1.55; }
.lucky-skies-overlay .primary-button { min-width:190px; padding:0 22px; }
.lucky-skies-mike { width:min(55%,250px); height:58%; margin:0; position:absolute; z-index:2; right:-1%; bottom:5%; pointer-events:none; }
.lucky-skies-mike img { width:100%; height:100%; object-fit:cover; object-position:47% center; border-radius:28px; opacity:.92; filter:drop-shadow(0 16px 22px rgba(0,0,0,.45)); -webkit-mask-image:linear-gradient(to bottom,#000 68%,transparent 100%); mask-image:linear-gradient(to bottom,#000 68%,transparent 100%); }
.lucky-skies-intro-copy { width:65%; }
.lucky-skies-control-hint { min-height:34px; padding:7px 13px; border:1px solid rgba(255,233,149,.2); border-radius:999px; position:absolute; z-index:7; left:50%; bottom:12px; transform:translateX(-50%); white-space:nowrap; color:#fff0a2; background:rgba(2,20,22,.76); box-shadow:0 5px 15px rgba(0,0,0,.32); font:700 .55rem Oswald,sans-serif; letter-spacing:.04em; pointer-events:none; opacity:0; transition:opacity .2s; }
.lucky-skies-stage.is-running .lucky-skies-control-hint { opacity:1; }
.lucky-skies-final-score { width:92px; height:92px; margin:0 0 14px; border:4px solid #ffe185; border-radius:50%; display:grid; place-items:center; color:#3b2504; background:radial-gradient(circle at 34% 25%,#fff7b6,#e5ac35 58%,#8b5412 61%,#efca65 78%); box-shadow:0 10px 28px rgba(0,0,0,.42); font:700 2rem Oswald,sans-serif; }
.lucky-skies-over-copy h3 { font-size:2.55rem; }
.lucky-skies-over-actions { display:flex; flex-wrap:wrap; gap:8px; }
.lucky-skies-over-actions button:last-child { min-height:52px; padding:0 18px; border:1px solid rgba(255,232,149,.23); border-radius:17px; color:#d5e2de; background:#12392d; font-weight:800; }

@media (min-width:620px) {
  .lucky-skies-stage { height:min(690px,calc(100dvh - 170px)); min-height:560px; }
  .lucky-skies-overlay { padding:82px 48px 38px; }
  .lucky-skies-intro-copy { width:56%; }
  .lucky-skies-mike { width:48%; height:72%; right:1%; bottom:-4%; }
}

@media (max-width:390px) {
  .lucky-skies-stage { height:calc(100dvh - 136px - var(--safe-top)); min-height:410px; border-radius:21px; }
  .lucky-skies-hud span { padding:6px; font-size:.43rem; }
  .lucky-skies-hud b { font-size:.75rem; }
  .lucky-skies-overlay { padding:62px 16px 20px; }
  .lucky-skies-intro-copy { width:72%; }
  .lucky-skies-overlay h3 { font-size:2.25rem; }
  .lucky-skies-overlay p:not(.eyebrow) { font-size:.66rem; }
  .lucky-skies-mike { width:56%; height:52%; right:-7%; bottom:9%; }
  .lucky-skies-overlay .primary-button { min-width:166px; }
}

@media (max-height:650px) and (max-width:620px) {
  .lucky-skies-stage { height:calc(100dvh - 126px - var(--safe-top)); min-height:390px; }
  .lucky-skies-overlay { padding-top:54px; }
  .lucky-skies-mike { height:48%; bottom:9%; }
  .lucky-skies-overlay p:not(.eyebrow) { margin-bottom:10px; }
  .lucky-skies-control-hint { bottom:7px; }
}

@media (prefers-reduced-motion:reduce) {
  .lucky-skies-control-hint { transition:none; }
}

/* Lucky Club v10: public blackjack table + integrated Mike scene */
.public-tables {
  grid-template-columns: repeat(2,minmax(0,1fr));
  gap: 9px;
}
.public-table {
  min-height: 90px;
  padding: 10px;
  grid-template-columns: 32px minmax(0,1fr);
  grid-template-areas: "medal info" "seats seats";
  align-content: center;
}
.public-table .table-medallion { grid-area: medal; width:32px; height:32px; }
.public-table .table-info { grid-area:info; }
.public-table .seat-meter { grid-area:seats; justify-content:flex-start; padding-left:2px; }
.public-table > strong { display:none; }
.public-table.is-live:not(.is-full) { border-color:rgba(86,222,151,.33); }
.public-table.is-live .table-info small { color:#8fdfae; }

.blackjack-table {
  height:clamp(430px,64dvh,575px);
  border-radius:30px 30px 42% 42% / 24px 24px 19% 19%;
  background:#092d22;
}
.blackjack-table::before { z-index:3; pointer-events:none; }
.blackjack-table::after {
  z-index:2;
  opacity:1;
  pointer-events:none;
  background:linear-gradient(180deg,transparent 0 48%,rgba(2,22,16,.06) 55%,rgba(2,19,14,.7) 100%);
}
.blackjack-table .blackjack-table-scene {
  width:100%;
  height:100%;
  inset:0;
  position:absolute;
  z-index:1;
  opacity:1;
  filter:none;
  overflow:hidden;
  border-radius:inherit;
}
.blackjack-table .blackjack-table-scene img {
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:50% 45%;
  transform:scale(1.015);
}
.table-inlay { z-index:3; top:70%; color:rgba(255,230,161,.28); }
.dealer-seat { z-index:5; top:54%; }
.dealer-host,.dealer-seat > strong { display:none; }
.dealer-seat .dealer-hand { min-height:38px; }
.dealer-seat em { top:34px; right:20px; }
.player-seats,.bet-spot { z-index:6; }
.player-seat.is-waiting { opacity:.76; }
.player-seat.is-waiting .seat-avatar { border-style:dashed; }
.blackjack-controls { position:relative; z-index:8; }
.blackjack-game-area { width:100%; max-width:620px; margin:0 auto; }

@media (max-width:430px) {
  .blackjack-lobby { min-height:0; }
  .lobby-hero { min-height:118px; padding:15px; grid-template-columns:minmax(0,1fr) 82px; }
  .lobby-hero h3 { margin-top:9px; font-size:1.65rem; }
  .lobby-copy p { font-size:.59rem; line-height:1.35; }
  .mike-lobby-scene { width:98px; height:112px; margin:-8px -14px -15px 0; }
  .lobby-actions { grid-template-columns:1fr; margin:8px 0; }
  .public-table { min-height:82px; padding:8px; gap:6px; }
  .public-table .table-info b { font-size:.61rem; }
  .public-table .table-info small { font-size:.49rem; line-height:1.2; }
  .seat-meter i { width:8px; height:8px; }
  .blackjack-table { height:clamp(390px,58dvh,470px); border-width:5px; }
  .blackjack-table .blackjack-table-scene img { object-position:50% 44%; }
  .dealer-seat { top:52%; }
  .player-seat:nth-child(2) { bottom:76px; left:-5px; }
  .player-seat:nth-child(3) { top:56%; left:-6px; }
  .player-seat:nth-child(4) { top:56%; right:-6px; }
  .player-seat:nth-child(5) { bottom:76px; right:-5px; }
  .bet-spot { bottom:88px; }
}
@media (max-width:340px) {
  .public-tables { gap:6px; }
  .public-table { grid-template-columns:28px minmax(0,1fr); min-height:78px; }
  .public-table .table-medallion { width:28px; height:28px; }
  .blackjack-table { height:382px; }
}

/* v12: High/Low start flow + vertical blackjack table */
.higher-start-row { margin:0 0 10px; display:grid; }
.higher-start-row[hidden] { display:none; }
.higher-start-row .primary-button { width:100%; min-height:54px; }
.higher-actions button:disabled,
.game-bet-panel [data-higher-step]:disabled { opacity:.42; filter:saturate(.35); cursor:not-allowed; }

@media (max-width:619px) {
  .blackjack-table {
    width:100%;
    height:clamp(410px,64dvh,500px);
    isolation:isolate;
    overflow:hidden;
    border-radius:28px 28px 40% 40% / 22px 22px 16% 16%;
  }
  .blackjack-table .blackjack-table-scene { z-index:1; }
  .blackjack-table .blackjack-table-scene img {
    object-fit:cover;
    object-position:50% 50%;
    transform:none;
  }
  .blackjack-table::after { z-index:2; }
  .blackjack-table::before,.table-inlay { z-index:3; }
  .table-inlay { top:67%; }
  .dealer-seat {
    z-index:7;
    top:40%;
    width:210px;
    pointer-events:none;
  }
  .dealer-seat .dealer-hand {
    min-width:112px;
    height:76px;
    align-items:flex-start;
    filter:drop-shadow(0 8px 8px rgba(0,0,0,.38));
  }
  .dealer-seat .card-mini {
    width:49px;
    height:70px;
    margin-left:-14px;
    padding:5px;
    border-radius:8px;
    font-size:.78rem;
    line-height:1.16;
  }
  .dealer-seat em { z-index:3; top:3px; right:30px; }
  .player-seats { z-index:8; }
  .player-seat { width:84px; z-index:1; }
  .player-seat .hand {
    min-width:72px;
    width:max-content;
    height:62px;
    top:-58px;
    left:50%;
    z-index:3;
    align-items:flex-start;
    transform:translateX(-50%);
    filter:drop-shadow(0 7px 7px rgba(0,0,0,.34));
  }
  .player-seat .card-mini {
    width:42px;
    height:60px;
    margin-left:-12px;
    padding:4px;
    border-radius:7px;
    font-size:.68rem;
    line-height:1.14;
  }
  .player-seat:nth-child(1) { bottom:12px; }
  .player-seat:nth-child(1) .hand {
    min-width:96px;
    height:80px;
    top:-84px;
  }
  .player-seat:nth-child(1) .card-mini {
    width:54px;
    height:78px;
    margin-left:-17px;
    padding:6px;
    border-width:2px;
    border-radius:9px;
    font-size:.88rem;
  }
  .player-seat:nth-child(2) { bottom:104px; left:5px; }
  .player-seat:nth-child(3) { top:57%; left:5px; }
  .player-seat:nth-child(4) { top:57%; right:5px; }
  .player-seat:nth-child(5) { bottom:104px; right:5px; }
  .bet-spot {
    z-index:10;
    left:10px;
    right:auto;
    bottom:10px;
    transform:none;
    box-shadow:0 6px 14px rgba(0,0,0,.34);
  }
  .blackjack-controls {
    min-height:116px;
    margin-top:8px;
    padding:9px;
    border:1px solid rgba(235,202,111,.14);
    border-radius:20px;
    background:rgba(7,31,23,.94);
    box-shadow:0 10px 24px rgba(0,0,0,.22);
  }
  .bet-controls button { min-width:0; height:46px; }
  .deal-button { min-height:52px; }
  .action-controls { grid-template-columns:repeat(3,minmax(0,1fr)); gap:6px; }
  .action-controls button { min-width:0; min-height:58px; padding:5px 3px; }
}

@media (max-width:340px) {
  .blackjack-table { height:410px; }
  .dealer-seat { width:190px; }
  .dealer-seat .card-mini { width:47px; height:68px; }
  .player-seat:nth-child(1) .card-mini { width:52px; height:76px; }
  .player-seat:nth-child(2),.player-seat:nth-child(3) { left:3px; }
  .player-seat:nth-child(4),.player-seat:nth-child(5) { right:3px; }
}