/* Portrait phone layout. Landscape keeps its reference composition. */
.cw-portrait-bet-tabs,
.cw-portrait-chat-toggle,
.cw-portrait-chat-close,
.cw-portrait-chat-scrim { display: none; }

@media (orientation: portrait) and (max-width: 1180px) {
  .cw-runtime-body[data-cw-shell-bg] {
    background:
      radial-gradient(circle at 13% 8%, rgba(234, 149, 62, 0.24), transparent 25%),
      radial-gradient(circle at 92% 31%, rgba(61, 159, 191, 0.17), transparent 31%),
      radial-gradient(circle at 13% 76%, rgba(160, 91, 48, 0.2), transparent 26%),
      radial-gradient(circle at 80% 88%, rgba(57, 103, 142, 0.14), transparent 31%),
      radial-gradient(circle, rgba(236, 175, 105, 0.23) 0 0.7px, transparent 1.2px) 11px 23px / 83px 97px,
      radial-gradient(circle, rgba(130, 194, 212, 0.18) 0 0.6px, transparent 1.1px) 43px 17px / 121px 131px,
      linear-gradient(165deg, #0e1119 0%, #080b11 45%, #05070c 100%);
  }
  .cw-runtime-body {
    display: block;
    width: 100%;
    height: auto;
    min-height: 100dvh;
    overflow-x: hidden;
    overflow-y: auto;
  }
  .cw-ui-runtime {
    width: 100%;
    height: max(100dvh, 990px);
    padding: 0;
    overflow: visible;
    transform: none !important;
    transform-origin: top left;
  }
  .cw-layout { position: absolute; inset: 0; width: 100%; height: 100%; }
  .cw-landscape-required,
  .cw-ui-border-left,
  .cw-corner-bottom-left,
  .cw-ui-top-border,
  .cw-run-top,
  .cw-run-bottom,
  .cw-players-panel { display: none !important; }

  .cw-entry-gate { position: fixed; inset: 0; }
  .cw-entry-gate__bg {
    background-image: radial-gradient(ellipse at 50% 45%, #1b233b 0%, #0a0d1a 58%, #05070d 100%) !important;
  }
  .cw-entry-gate__cover {
    inset: auto;
    left: -17.5%;
    top: 50%;
    width: 135%;
    aspect-ratio: 3 / 2;
    transform: translateY(-50%);
    background-size: cover;
    -webkit-mask-image: linear-gradient(to bottom, transparent, #000 18%, #000 82%, transparent);
    mask-image: linear-gradient(to bottom, transparent, #000 18%, #000 82%, transparent);
  }
  .cw-entry-gate__play { top: 62%; width: 92px; height: 92px; }
  .cw-entry-gate__loading { top: 62%; width: min(300px, calc(100vw - 40px)); }
  .cw-entry-gate__tagline { bottom: 20px; font-size: 15px; }

  .cw-logo-shell {
    left: 8px;
    top: 8px;
    width: min(39vw, 166px);
    height: 54px;
    background-size: contain;
    filter: drop-shadow(0 5px 1px rgba(0, 0, 0, 0.82)) drop-shadow(0 0 12px rgba(225, 139, 56, 0.38));
  }
  .cw-left-column {
    position: static;
    width: auto;
    height: auto;
  }
  .cw-balance-shell {
    position: absolute;
    left: auto;
    right: 8px;
    top: 8px;
    width: 394px;
    height: 176px;
    transform: scale(0.5);
    transform-origin: top right;
    border: 0;
    border-radius: 0;
    background-size: 100% 100%;
    box-shadow: none;
  }
  .cw-player-name { display: none; }
  .cw-balance-value { position: absolute; inset: 0; transform: none; }
  .cw-balance-value > * { display: block !important; }
  .cw-balance-value::after { content: none !important; }
  .cw-balance-punct { width: 8px; font-size: 18px; }

  .cw-run-column {
    position: absolute;
    left: 8px;
    top: 98px;
    width: calc(100% - 16px);
    min-height: 0;
  }
  .cw-run-shell { width: 100%; height: auto; }
  .cw-stage-frame {
    width: 100%;
    height: auto;
    aspect-ratio: 4 / 3;
    border-radius: 18px;
    box-shadow: 0 6px 0 rgba(0, 0, 0, 0.65), 0 10px 14px rgba(0, 0, 0, 0.8), 0 0 20px rgba(113, 180, 204, 0.2);
  }
  .cw-stage-frame canvas#c,
  .cw-stage-frame canvas.cw-sky-layer {
    position: absolute;
    left: 0;
    top: 0;
    width: 133.333%;
    height: 100%;
    border-radius: 0;
  }
  .cw-stage-frame canvas.cw-run-hud { width: 133.333%; }
  .cw-stage-countdown__stack { top: 58%; transform: translate(-50%, -50%) scale(0.36); }

  .cw-results-column {
    position: absolute;
    left: 8px !important;
    top: calc(98px + (100vw - 16px) * 3 / 4 + 6px);
    width: calc(100% - 16px);
    height: 23px;
    padding: 0;
    display: block;
    z-index: 20;
  }
  .cw-results-column--right { margin-top: 25px; }
  .cw-results-strip {
    display: flex;
    gap: 3px;
    width: 100%;
    height: 23px;
    overflow-x: auto;
    overflow-y: hidden;
    scrollbar-width: none;
  }
  .cw-results-strip::-webkit-scrollbar { display: none; }
  .cw-result-slip {
    flex: 0 0 29px;
    width: 29px;
    height: 23px;
    filter: drop-shadow(1px 3px 1px rgba(0, 0, 0, 0.82)) drop-shadow(0 0 3px rgba(236, 195, 126, 0.18));
  }
  .cw-result-slip__value { font-size: 10px; }

  .cw-bet-dock {
    position: relative;
    left: auto;
    top: auto;
    transform: none;
    width: 100%;
    height: auto;
    margin-top: 60px;
    display: flex;
    flex-direction: column;
    gap: 8px;
    pointer-events: auto;
  }
  .cw-portrait-bet-tabs {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
    height: 44px;
  }
  .cw-portrait-bet-tab,
  .cw-portrait-chat-toggle,
  .cw-portrait-chat-close {
    appearance: none;
    border: 0;
    border-radius: 12px;
    color: #f6dfaf;
    background: linear-gradient(180deg, #5d6470 0%, #343a47 13%, #1a202a 59%, #10131a 100%);
    box-shadow: inset 0 2px 1px rgba(250, 231, 185, 0.32), inset 0 -3px 4px rgba(0, 0, 0, 0.58), 0 5px 0 rgba(0, 0, 0, 0.62), 0 8px 9px rgba(0, 0, 0, 0.75), 0 0 11px rgba(218, 151, 81, 0.18);
    font: 900 18px/1 "Rajdhani", sans-serif;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.68);
    cursor: pointer;
  }
  .cw-portrait-bet-tab[aria-selected="true"] {
    background: linear-gradient(180deg, #bb8749 0%, #805732 19%, #47301f 68%, #2a1c17 100%);
    box-shadow: inset 0 2px 1px rgba(255, 230, 176, 0.5), inset 0 -3px 4px rgba(28, 10, 4, 0.65), 0 5px 0 rgba(0, 0, 0, 0.65), 0 8px 9px rgba(0, 0, 0, 0.78), 0 0 12px rgba(238, 161, 65, 0.38);
  }
  .cw-bet-card {
    position: relative;
    left: auto !important;
    top: auto !important;
    width: 100%;
    border-radius: 18px;
  }
  .cw-ui-runtime:not(.is-running) .cw-bet-dock[data-active-bet="left"] .cw-bet-card-right,
  .cw-ui-runtime:not(.is-running) .cw-bet-dock[data-active-bet="right"] .cw-bet-card-left { display: none; }
  .cw-bet-card--editing { height: 408px; }
  .cw-bet-main { padding: 10px; grid-template-rows: 29px minmax(0, 1fr) 62px; gap: 6px; }
  .cw-bet-head { top: auto; }
  .cw-bet-head h3 { font-size: 23px; }
  .cw-bet-card--editing .cw-field-card { padding: 6px 9px; }
  .cw-bet-card--editing .cw-field-top { font-size: 14px; }
  .cw-bet-card--editing .cw-stepper { grid-template-columns: 51px minmax(0, 1fr) 51px; }
  .cw-bet-card--editing .cw-stepper-btn { width: 51px; height: 49px; }
  .cw-bet-card--editing .cw-bet-input,
  .cw-bet-card--editing .cw-value-inline { min-height: 44px; font-size: 25px; }
  .cw-bet-card--editing .cw-preset-row { grid-template-columns: repeat(5, 53px); gap: 7px; }
  .cw-bet-card--editing .cw-preset { width: 53px; min-height: 36px; }
  .cw-bet-card--editing .cw-preset-label { font-size: 17px; }
  .cw-bet-footer { grid-template-columns: minmax(0, 1fr) 154px; gap: 6px; }
  .cw-bet-card--editing .cw-auto-toggle { font-size: 14px; }
  .cw-bet-card--editing .cw-auto-toggle__chrome { width: 54px; height: 29px; }
  .cw-bet-card--editing .cw-bet-submit__label { font-size: 17px; }

  .cw-ui-runtime.is-running .cw-portrait-bet-tabs { display: none; }
  .cw-ui-runtime.is-running .cw-bet-card { display: block; }
  .cw-bet-card:not(.cw-bet-card--editing) { height: 158px; }
  .cw-bet-card:not(.cw-bet-card--editing) .cw-bet-main {
    grid-template-columns: minmax(0, 1fr) 156px;
    gap: 6px;
    padding: 7px;
  }
  .cw-bet-card:not(.cw-bet-card--editing) .cw-field-card { padding: 7px 3px 4px; grid-template-rows: 18px 1fr; }
  .cw-bet-card:not(.cw-bet-card--editing) .cw-field-top { font-size: 10px; }
  .cw-bet-card:not(.cw-bet-card--editing) .cw-unit-tag { font-size: 10px; }
  .cw-bet-card:not(.cw-bet-card--editing) .cw-bet-input,
  .cw-bet-card:not(.cw-bet-card--editing) .cw-value-inline { font-size: 28px; }
  .cw-bet-card:not(.cw-bet-card--editing) .cw-bet-footer { gap: 2px; }
  .cw-bet-card:not(.cw-bet-card--editing) .cw-bet-submit {
    width: 156px;
    height: 61px;
    flex-basis: 61px;
  }
  .cw-bet-card:not(.cw-bet-card--editing) .cw-bet-submit__label { font-size: 17px; }
  .cw-bet-card:not(.cw-bet-card--editing) .cw-auto-toggle { font-size: 11px; }
  .cw-bet-card:not(.cw-bet-card--editing) .cw-auto-toggle__chrome { width: 39px; height: 22px; }

  .cw-floating-controls {
    position: absolute;
    left: 8px;
    right: 8px;
    top: calc(98px + (100vw - 16px) * 3 / 4 + 536px);
    bottom: auto;
    width: auto;
    height: 46px;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
    pointer-events: auto;
  }
  .cw-portrait-chat-toggle { display: block; width: 98px; height: 44px; margin-right: auto; }
  .cw-ui-runtime.is-running .cw-floating-controls {
    position: absolute;
    top: calc(98px + (100vw - 16px) * 3 / 4 + 400px);
    z-index: 80;
  }
  .cw-settings-toggle,
  .cw-sound-toggle { position: relative; left: auto; bottom: auto; width: 42px; height: 42px; }

  .cw-portrait-chat-scrim {
    position: fixed;
    inset: 0;
    z-index: 179;
    display: none;
    border: 0;
    background: rgba(0, 0, 0, 0.6);
  }
  .cw-ui-runtime.is-portrait-chat-open .cw-portrait-chat-scrim { display: block; }
  .cw-chat-shell {
    position: fixed;
    left: 0;
    top: 0;
    z-index: 180;
    width: min(350px, 88vw);
    height: 100dvh;
    max-height: 100dvh;
    border: 1px solid rgba(194, 150, 91, 0.68);
    border-left: 0;
    border-radius: 0 18px 18px 0;
    background: linear-gradient(150deg, #35363b, #1b1d23 66%, #111419) !important;
    background-image: linear-gradient(150deg, #35363b, #1b1d23 66%, #111419) !important;
    transform: translateX(-105%);
    transition: transform 220ms ease;
    box-shadow: 12px 0 24px rgba(0, 0, 0, 0.6);
  }
  .cw-ui-runtime.is-portrait-chat-open .cw-chat-shell { transform: translateX(0); }
  .cw-chat-header {
    left: 16px;
    right: 14px;
    top: 18px;
    height: 48px;
    border-bottom: 1px solid rgba(224, 188, 127, 0.3);
  }
  .cw-chat-header h2 { font-size: 28px; }
  .cw-portrait-chat-close {
    position: absolute;
    right: 0;
    top: 0;
    display: grid;
    place-items: center;
    width: 42px;
    height: 36px;
    font-size: 24px;
  }
  .cw-chat-clear { left: auto; right: 48px; width: 56px; height: 36px; }
  .cw-chat-list { top: 82px; height: calc(100dvh - 220px); }
  .cw-chat-compose { bottom: 16px; gap: 12px; }
  .cw-chat-input { min-height: 40px; font-size: 17px; }
  .cw-chat-send { height: 50px; background-size: 100% 100%; }

  .cw-settings-panel { width: calc(100vw - 22px); max-height: calc(100dvh - 22px); overflow: auto; }
}

@media (orientation: portrait) and (max-width: 1180px) and (max-height: 760px) {
  .cw-ui-runtime { height: 990px; }
  .cw-ui-runtime.is-running .cw-bet-card { height: 116px; }
  .cw-ui-runtime.is-running .cw-bet-dock { gap: 6px; }
  .cw-ui-runtime.is-running .cw-floating-controls {
    top: calc(98px + (100vw - 16px) * 3 / 4 + 314px);
  }
}
