/* v3 responsive polish 4 (presentation only). Loaded last. */

/* ---- Stability: while rotating / entering fullscreen, drop the heaviest GPU
   layers so phones don't run out of graphics memory and paint black. ---- */
html.ktk-reflow *,html.ktk-reflow *::before,html.ktk-reflow *::after{animation-play-state:paused!important}
html.ktk-reflow .smoke,html.ktk-reflow .splash-embers,html.ktk-reflow #cinders,html.ktk-reflow .realm{visibility:hidden!important}
html.ktk-reflow .play-area,html.ktk-reflow .side,html.ktk-reflow .hand-bar,html.ktk-reflow .splash-stage{-webkit-backdrop-filter:none!important;backdrop-filter:none!important}
/* Menu hidden behind the fullscreen game stage: stop painting it. */
html.ktk-stage-on .royal-siege>.world,html.ktk-stage-on .royal-siege>.scene,html.ktk-stage-on .royal-siege>.top{display:none!important}
/* Touch devices: same look, lighter compositing (no 42px live blur at DPR 3). */
@media (pointer:coarse){
  .smoke{filter:none!important;opacity:.14!important;background:radial-gradient(closest-side,var(--sm,#a23b24),transparent)!important}
  .smoke-a{--sm:#a23b24}.smoke-b{--sm:#6586a7}
  .play-area,.side{-webkit-backdrop-filter:none!important;backdrop-filter:none!important}
}

/* ---- Main menu, phone landscape / short wide screens: the hero column must
   end above the footer links (tagline was printing over RULES OF WAR). ---- */
@media (orientation:landscape) and (max-height:520px){
  .royal-siege .main-scene{padding-bottom:calc(44px + env(safe-area-inset-bottom));align-items:center}
  .royal-siege .hero{align-self:center;max-height:100%}
  .royal-siege .hero .v3m-crest{width:clamp(34px,11vh,60px);margin-bottom:4px}
  .royal-siege .hero .kicker{margin-bottom:5px}
  .royal-siege .hero h1{font-size:clamp(30px,min(8vw,12.5vh),60px)!important}
  .royal-siege .hero .title-ember-line{margin-top:6px}
  .royal-siege .hero .lead{margin-top:8px;font-size:10px;line-height:1.4;padding-left:12px}
}
@media (orientation:landscape) and (max-height:400px){
  .royal-siege .hero .lead{display:none}
}

/* ---- Graveyard pile card: same frame weight as the deck pile card (thin rim,
   subtle glow) for every deck theme and both sides. ---- */
html .pile-stack .card-face.v3,
html [data-deck-theme] .pile-stack .card-face.v3.full,
html [data-deck-theme]:not([data-deck-theme="legacy"]) .pile-stack .card-face.v3.full{
  border-width:1px!important;
  box-shadow:0 0 0 1px rgba(0,0,0,.7),0 0 6px var(--sk-glow,rgba(212,168,75,.22))!important}
html .pile-stack .card-face.v3::after,
html [data-deck-theme]:not([data-deck-theme="legacy"]) .pile-stack .card-face.v3.full::after{
  border-width:1px!important;
  box-shadow:0 0 0 1px rgba(0,0,0,.6)!important}

/* ---- Readability floor on phones: 8px captions were too small to read. ---- */
@media (max-width:700px),(orientation:landscape) and (max-height:520px){
  .royal-siege .tools button,.royal-siege footer button,.royal-siege .back,.royal-siege .studio{font-size:10px!important}
  .royal-siege .order small,.royal-siege footer span,.royal-siege .secondary .kicker{font-size:9.5px!important}
}

/* ---- Deck card frames, every deck, every size (hand, board, deck pile, GY):
   a thin, refined metallic edge so the art dominates. The old frame had a
   4px floor, which ate ~10% of a 40px phone card. ---- */
html [data-deck-theme]:not([data-deck-theme="legacy"]) .card-face.v3.full::after{
  border-width:clamp(1px,1.5cqw,3px)!important;
  box-shadow:inset 0 0 0 clamp(.5px,.6cqw,1px) var(--dk-inner),inset 0 0 max(6px,7cqw) var(--dk-glow)!important}
html [data-deck-theme]:not([data-deck-theme="legacy"]) .card-face.v3.full{
  box-shadow:0 0 0 1px rgba(0,0,0,.75),inset 0 0 0 1px color-mix(in srgb,var(--sk-rim-hi,#e4bf66) 45%,transparent),0 3px 8px rgba(0,0,0,.5),0 0 6px var(--sk-glow,transparent)!important}
html .hand-card .card-face.v3{box-shadow:0 0 0 1px rgba(0,0,0,.75),inset 0 0 0 1px color-mix(in srgb,var(--v3-gold,#e4bf66) 40%,transparent),0 4px 10px rgba(0,0,0,.55)!important}
html .pile-stack.card-back-mini,html .board-2d .side[data-deck-theme] .pile-stack.card-back-mini{border-width:1px!important}
html .pile-stack .card-face.v3.full::after{border-width:1px!important;box-shadow:none!important}

/* ---- No per-deck emblems on card faces (ring, star, rune, crescent, bolt...).
   Only AIMAGEDDON keeps its cam brackets + HUD. ---- */
html [data-deck-theme]:not([data-deck-theme="legacy"]):not([data-deck-theme="aimageddon"]) .card-face.v3.full::after{
  background:radial-gradient(ellipse 80% 75% at 50% 50%,transparent 66%,rgba(0,0,0,.32) 100%)!important}
/* AIMAGEDDON on tiny cards (phone hand/piles): its px floors made the REC/HUD
   text outgrow the card; keep the brackets, drop the unreadable HUD text. */
@container (max-width:72px){[data-deck-theme="aimageddon"] .dk-hud{display:none!important}}

/* AIMAGEDDON cam brackets: pure card-relative sizes so they stay fine on phone cards. */
html [data-deck-theme="aimageddon"]{--dk-acc:linear-gradient(#e4bf66,#e4bf66) 0 0/12cqw max(1px,1.5cqw) no-repeat,
  linear-gradient(#e4bf66,#e4bf66) 0 0/max(1px,1.5cqw) 12cqw no-repeat,
  linear-gradient(#e4bf66,#e4bf66) 100% 0/12cqw max(1px,1.5cqw) no-repeat,
  linear-gradient(#e4bf66,#e4bf66) 100% 0/max(1px,1.5cqw) 12cqw no-repeat,
  linear-gradient(#e4bf66,#e4bf66) 0 100%/12cqw max(1px,1.5cqw) no-repeat,
  linear-gradient(#e4bf66,#e4bf66) 0 100%/max(1px,1.5cqw) 12cqw no-repeat,
  linear-gradient(#e4bf66,#e4bf66) 100% 100%/12cqw max(1px,1.5cqw) no-repeat,
  linear-gradient(#e4bf66,#e4bf66) 100% 100%/max(1px,1.5cqw) 12cqw no-repeat,
  linear-gradient(#e4bf66,#e4bf66) 0 50%/max(1px,1.5cqw) 24cqw no-repeat,
  linear-gradient(#e4bf66,#e4bf66) 100% 50%/max(1px,1.5cqw) 24cqw no-repeat,
  linear-gradient(#e4bf66,#e4bf66) 50% 0/14cqw max(1px,1.5cqw) no-repeat,
  linear-gradient(#e4bf66,#e4bf66) 50% 100%/14cqw max(1px,1.5cqw) no-repeat}

/* ---- Battlefield HUD captions on phones: 6px labels were unreadable. ---- */
@media (max-width:700px),(orientation:landscape) and (max-height:520px){
  html .board-2d .field-hud small{font-size:max(.45rem,8px)!important}
  html .board-2d .pile-label{font-size:max(.38rem,7.5px)!important}
}

/* ---- GY sweep fix (r3): cards flying into the graveyard are cloned into #fx-layer,
   outside every [data-deck-theme] side, so they only inherit the theme set on <html>.
   The "no per-deck emblems" rule above needs a themed ancestor, so the flight showed
   the raw deck accents (e.g. Soldier's two gold rivet discs) over the GY card. ---- */
html[data-deck-theme]:not([data-deck-theme="legacy"]):not([data-deck-theme="aimageddon"]) #fx-layer .card-face.v3.full::after{
  background:radial-gradient(ellipse 80% 75% at 50% 50%,transparent 66%,rgba(0,0,0,.32) 100%)!important}

/* ---- GY WINS badge fit (r4): size from the flying card itself (it is a size container),
   so "WINS" always fits inside the card instead of being clipped to "WIN". ---- */
html #fx-layer .gy-card-flight .gy-card-flight-wins{
  font-size:19cqw!important;letter-spacing:.06em!important;line-height:1.05!important;
  padding:1.6cqw 7cqw 1.2cqw!important;max-width:92cqw!important;box-sizing:border-box;overflow:visible;
  clip-path:polygon(5cqw 0,calc(100% - 5cqw) 0,100% 50%,calc(100% - 5cqw) 100%,5cqw 100%,0 50%)!important}