/* Kravestorm responsive polish v27
   Laptop styles remain the master above 900px. This file standardizes tablet/mobile. */

@media (max-width: 900px){
  :root{--page-x:clamp(20px,5vw,34px)}
  body{font-size:16px}
  .wrap{width:calc(100% - (var(--page-x) * 2));max-width:none}

  /* Unified mobile header */
  .topbar,.home-page .topbar{position:relative;background:rgba(11,13,13,.58)!important;border:0!important;backdrop-filter:blur(12px) saturate(.72);-webkit-backdrop-filter:blur(12px) saturate(.72)}
  .nav,.home-nav,body:not(.home-page) .nav{height:104px!important;min-height:104px!important;padding:14px 0!important;display:flex!important;align-items:center!important;gap:20px!important}
  .home-nav{width:calc(100% - (var(--page-x) * 2))!important;margin:auto!important}
  .brand,.home-page .brand,body:not(.home-page) .nav .brand{width:210px!important;max-width:58vw!important;min-width:0!important;flex:0 1 210px!important;margin:0!important}
  .menu,.home-page .menu,.header-socials{display:none!important}
  .hamb,.home-page .hamb{display:block!important;margin-left:auto!important;width:48px!important;height:44px!important;transform:none!important}
  .hamb:before,.hamb:after{right:2px;width:42px;height:2px}.hamb:before{top:13px}.hamb:after{top:29px}

  /* Unified footer */
  .site-footer{background:rgba(11,13,13,.54)!important;backdrop-filter:blur(12px) saturate(.72);-webkit-backdrop-filter:blur(12px) saturate(.72);border:0!important}
  .site-footer-inner{width:calc(100% - (var(--page-x) * 2))!important;min-height:0!important;padding:32px 0 36px!important;display:grid!important;grid-template-columns:1fr!important;gap:20px!important;justify-items:center!important;text-align:center!important}
  .site-footer-copy,.site-footer-socials,.site-footer-credit{justify-self:center!important;text-align:center!important}
  .site-footer-copy{font-size:13px!important}.site-footer-credit{font-size:12px!important}.site-footer-socials{gap:30px!important}.site-footer-socials a{width:23px!important;height:23px!important}

  /* Shared page typography */
  .section{padding:58px 0 72px!important}
  .display,.section h2,.how-page .how-heading .display{font-size:clamp(42px,10vw,58px)!important;line-height:1.02!important;margin-bottom:30px!important}
  .lede{font-size:18px!important;line-height:1.45!important}

  /* Landing */
  .home-page .hero{min-height:auto!important}
  .home-hero-grid{width:calc(100% - (var(--page-x) * 2))!important;min-height:0!important;display:grid!important;grid-template-columns:1fr!important;gap:42px!important;padding:52px 0 68px!important}
  .hero-copy{padding:0!important}
  .home-page .hero h1{font-size:clamp(39px,10.5vw,56px)!important;line-height:1.04!important;max-width:700px!important;margin:0 0 28px!important}
  .home-page .hero p{font-size:18px!important;line-height:1.4!important;max-width:620px!important;margin:0 0 30px!important}
  .home-page .button{width:100%!important;max-width:430px!important;min-height:66px!important;font-size:20px!important}
  .card-stage{width:100%!important;max-width:680px!important;justify-self:start!important;gap:clamp(16px,4vw,28px)!important}
  .hero-card img{border-radius:18px!important}

  /* How to play */
  .how-page .how-section{padding-top:54px!important}
  .how-page .how-heading{margin-bottom:30px!important}
  .how-page .how-layout{grid-template-columns:1fr!important;gap:30px!important;align-items:start!important}
  .how-video-embed{width:100%!important;border-radius:14px!important;box-shadow:none!important}
  .how-page .how-rules-column{display:grid!important;grid-template-columns:1fr 1fr!important;border:1px solid rgba(255,255,255,.10)!important;border-radius:14px!important;overflow:hidden!important}
  .how-page .how-rule-option{min-height:155px!important;padding:24px!important;align-items:flex-start!important}
  .how-page .how-rule-option + .how-rule-option{border-left:1px solid rgba(255,255,255,.10)!important;border-top:0!important}
  .how-page .how-rule-option h2{font-size:31px!important;line-height:1.02!important}.how-page .how-rule-option p{font-size:14px!important}

  /* Card search */
  .database-main{padding:42px var(--page-x) 72px!important}
  .database-heading,.database-tools-row,.database-layout{max-width:none!important;width:100%!important}
  .database-heading{margin-bottom:20px!important}.database-heading h1{font-size:48px!important}
  .database-tools-row{margin:0 0 14px!important;padding:0!important}
  .controls-toggle{min-height:44px!important;padding:11px 16px!important}
  .database-layout,.database-layout.controls-collapsed{display:block!important;width:100%!important}
  .search-controls{display:grid!important;grid-template-columns:1fr!important;width:100%!important;min-width:0!important;margin-bottom:24px!important}
  .database-layout.controls-collapsed .search-controls{display:none!important}
  .set-rail{position:static!important;display:flex!important;gap:8px!important;overflow-x:auto!important;scroll-snap-type:x proximity;padding:12px!important;margin:0 0 10px!important;border-radius:12px!important;overscroll-behavior-inline:contain}
  .set-rail .panel-title,.set-divider{display:none!important}
  .set-option{flex:0 0 auto!important;min-width:150px!important;scroll-snap-align:start!important;padding:10px 12px!important;border:1px solid rgba(255,255,255,.08)!important;border-radius:10px!important}
  .set-option.future{display:block!important;opacity:.56!important}
  .filter-panel{position:static!important;max-height:none!important;padding:16px!important;border-radius:12px!important}
  .filter-row.two,.numeric-row{grid-template-columns:1fr 1fr!important;gap:10px!important}
  .results-panel{width:100%!important;margin:0!important;padding:0!important}
  .results-toolbar{margin:0 0 16px!important;align-items:center!important;gap:12px!important;flex-wrap:wrap!important}.sort-control{margin-left:auto!important}
  .database-grid-top,.database-layout.controls-collapsed .database-grid-top{display:grid!important;width:100%!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:22px 12px!important}
  .database-grid-top .db-card,.database-layout.controls-collapsed .database-grid-top .db-card{width:100%!important;max-width:none!important}
  .db-card-meta strong{font-size:12px!important}.db-card-meta small{font-size:10px!important}
  .modal{padding:12px!important}.modal-card{width:min(100%,680px)!important;grid-template-columns:1fr!important;max-height:94dvh!important;padding:14px!important;border-radius:14px!important;overflow:auto!important}.modal-image-wrap{max-width:360px!important;margin:auto!important}.modal-info{display:block!important}.modal-nav{width:42px!important;height:42px!important}

  /* Comprehensive rules */
  .rules-shell{display:block!important;width:calc(100% - (var(--page-x) * 2))!important;max-width:780px!important;padding:38px 0 76px!important}
  .rules-sidebar{position:static!important;max-height:none!important;overflow:visible!important;padding:0!important;margin:0 0 36px!important}
  .rules-search-wrap{position:sticky!important;top:8px!important;z-index:5!important;padding:12px!important;margin:0 0 14px!important;background:rgba(12,14,14,.88)!important;backdrop-filter:blur(12px)!important;border:1px solid rgba(255,255,255,.08)!important;border-radius:12px!important}
  .rules-index{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:0 14px!important;max-height:260px!important;overflow:auto!important;padding-right:6px!important}
  .rules-index a{font-size:12px!important;padding:8px 0!important}
  .rules-document-head h1{font-size:48px!important}.rules-chapter{padding-top:48px!important}.rules-chapter h2{font-size:34px!important;line-height:1.04!important}.rules-copy p,.rule-line{font-size:14px!important;line-height:1.6!important}

  /* Quick Start overall */
  .quick-hero{padding:46px 0 28px!important}.quick-hero .display{font-size:clamp(50px,12vw,68px)!important}.quick-lede{font-size:16px!important;line-height:1.52!important;max-width:700px!important}
  .quick-stepnav{display:flex!important;overflow-x:auto!important;gap:8px!important;padding-bottom:6px!important;scroll-snap-type:x proximity!important}.quick-stepnav a{flex:0 0 135px!important;min-height:58px!important;scroll-snap-align:start!important;padding:10px 12px!important}
  .quick-content{width:calc(100% - (var(--page-x) * 2))!important;max-width:780px!important;padding-bottom:64px!important}
  .quick-chapter,.quick-chapter-wide{display:grid!important;grid-template-columns:1fr!important;gap:28px!important;padding:58px 0!important;align-items:start!important}
  #kravers.quick-chapter{grid-template-columns:1fr!important;gap:28px!important;padding:58px 0!important;align-items:start!important}
  .quick-chapter .quick-copy,.quick-chapter .quick-visual,#kravers .quick-copy{order:initial!important;width:100%!important;max-width:none!important}
  .quick-num{font-size:48px!important;line-height:1!important}.quick-copy h2,.quick-finish h2{font-size:clamp(37px,9vw,48px)!important;line-height:1.02!important;margin-bottom:16px!important}.quick-copy p{font-size:15px!important;line-height:1.55!important}.quick-next{min-height:44px!important}

  /* Quick Start setup: mobile-native flow, no absolute-position collisions */
  #setup .setup-visual{padding:16px!important;border-radius:14px!important}
  #setup .setup-table-v4{display:grid!important;grid-template-columns:1fr!important;gap:18px!important;width:100%!important;max-width:560px!important;height:auto!important;min-height:0!important;margin:auto!important;position:static!important}
  #setup .setup-table-v4 .quick-capital,#setup .setup-table-v4 .resource-row,#setup .setup-library{position:static!important;left:auto!important;right:auto!important;top:auto!important;width:100%!important;transform:none!important}
  #setup .setup-table-v4 .quick-capital{max-width:520px!important;margin:auto!important}
  #setup .setup-table-v4 .resource-row{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:10px!important;align-items:start!important}
  #setup .setup-library{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:14px!important;max-width:360px!important;margin:2px auto 0!important}
  #setup .setup-deck,#setup .setup-discard-placeholder{width:100%!important;max-width:none!important}

  /* Quick Start single visuals */
  .single-card-stage{min-height:0!important;padding:14px 0!important}.single-card-stage .quick-card{width:min(62vw,300px)!important;margin:auto!important}
  .turn-tabs{grid-template-columns:repeat(4,minmax(0,1fr))!important}.turn-tabs button{min-height:44px!important}

  /* Anatomy: readable on phones via local horizontal pan, without page overflow */
  #kravers .anatomy-fixed-stage.anatomy-v7{width:100%!important;max-width:100%!important;min-height:0!important;overflow-x:auto!important;overflow-y:hidden!important;padding:8px 0 16px!important;justify-content:flex-start!important;overscroll-behavior-inline:contain!important}
  #kravers .anatomy-diagram-svg-v7{width:680px!important;min-width:680px!important;max-width:none!important;height:auto!important;margin:0!important}.anatomy-callout-v7 text{font-size:22px!important}

  /* Attack simulation: compact mobile battlefield */
  .attack-stage-v6{width:100%!important;min-height:0!important}.attack-sim-v6{width:100%!important;max-width:620px!important;margin:auto!important;padding:10px!important}.battlefield-v6{width:100%!important}.defender-zone-v6,.attacker-zone-v6{min-height:150px!important}.defender-zone-v6{grid-template-columns:minmax(0,1fr) 86px!important}.attacker-zone-v6{grid-template-columns:86px minmax(0,1fr)!important}.capital-v6{max-width:230px!important}.gorl-v6,.nevir-v6{width:78px!important}.payment-v6{grid-template-columns:repeat(3,50px)!important}.juyx-nek-v6{width:50px!important}.attack-explain-v6{min-height:86px!important}.attack-explain-v6 p{font-size:11px!important}.attack-play{width:100%!important;min-height:44px!important}

  .status-stage{min-height:380px!important}.status-card{width:min(66vw,300px)!important;max-width:none!important}.status-buttons{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:8px!important}.status-buttons button{min-height:44px!important}
  .cardtype-switcher{grid-template-columns:1fr!important}.cardtype-cards{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:8px!important}.type-card{min-width:0!important}.type-card b{font-size:11px!important}.cardtype-readout{border-left:0!important;border-top:1px solid rgba(255,255,255,.1)!important;padding:22px 0 0!important}
  .quick-finish{grid-template-columns:1fr!important;gap:24px!important}

  /* Back to top */
  .back-to-top{right:16px!important;bottom:16px!important;min-height:44px!important;border-radius:999px!important}
}

@media (max-width: 620px){
  :root{--page-x:20px}
  .nav,.home-nav,body:not(.home-page) .nav{height:92px!important;min-height:92px!important}
  .brand,.home-page .brand,body:not(.home-page) .nav .brand{width:185px!important;flex-basis:185px!important}
  .mobile-overlay{padding:22px 20px 28px!important}.mobile-links{font-size:clamp(34px,10vw,44px)!important;gap:22px!important}

  .home-hero-grid{padding:38px 0 54px!important;gap:34px!important}.home-page .hero h1{font-size:clamp(36px,10vw,46px)!important}.home-page .hero p{font-size:17px!important}.card-stage{gap:12px!important}.hero-card img{border-radius:13px!important}.home-page .button{max-width:none!important}

  .how-page .how-rules-column{grid-template-columns:1fr!important}.how-page .how-rule-option + .how-rule-option{border-left:0!important;border-top:1px solid rgba(255,255,255,.10)!important}.how-page .how-rule-option{min-height:0!important}.how-page .how-rule-option h2{font-size:30px!important}

  .database-main{padding:34px var(--page-x) 60px!important}.database-heading h1{font-size:43px!important}.filter-row.two,.numeric-row{grid-template-columns:1fr!important}.results-toolbar{align-items:flex-start!important}.sort-control{width:100%!important;margin:0!important;justify-content:space-between!important}.sort-control select{flex:1!important;max-width:190px!important}.database-grid-top,.database-layout.controls-collapsed .database-grid-top{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:20px 10px!important}.db-card-meta strong{font-size:11px!important}

  .rules-index{grid-template-columns:1fr!important;max-height:220px!important}.rules-document-head h1{font-size:42px!important}.rules-chapter h2{font-size:31px!important}

  .quick-content{max-width:none!important}.quick-stepnav a{flex-basis:122px!important}.quick-chapter,.quick-chapter-wide,#kravers.quick-chapter{padding:48px 0!important}.quick-num{font-size:44px!important}
  #setup .setup-library{max-width:320px!important}
  .turn-tabs{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  #kravers .anatomy-diagram-svg-v7{width:620px!important;min-width:620px!important}
  .attack-sim-v6{padding:8px!important}.defender-zone-v6,.attacker-zone-v6{min-height:142px!important}.capital-v6{max-width:205px!important}.gorl-v6,.nevir-v6{width:72px!important}.payment-v6{grid-template-columns:repeat(3,45px)!important}.juyx-nek-v6{width:45px!important}.role-v6{font-size:6px!important}.payment-title-v6{font-size:6px!important}.combat-divider-v6 b{font-size:8px!important}
  .status-stage{min-height:330px!important}.status-card{width:min(72vw,280px)!important}.cardtype-cards{gap:6px!important}
  .back-to-top span:last-child{display:none!important}.back-to-top{width:46px!important;height:46px!important;padding:0!important;justify-content:center!important}
}

@media (max-width: 390px){
  :root{--page-x:16px}
  .brand,.home-page .brand,body:not(.home-page) .nav .brand{width:168px!important;flex-basis:168px!important}
  .database-grid-top,.database-layout.controls-collapsed .database-grid-top{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:16px 8px!important}
  #kravers .anatomy-diagram-svg-v7{width:580px!important;min-width:580px!important}
  .defender-zone-v6{grid-template-columns:minmax(0,1fr) 68px!important}.attacker-zone-v6{grid-template-columns:68px minmax(0,1fr)!important}.gorl-v6,.nevir-v6{width:62px!important}.capital-v6{max-width:180px!important}.payment-v6{grid-template-columns:repeat(3,40px)!important}.juyx-nek-v6{width:40px!important}
}

/* v28 mobile refinements: Quick Start composition + mobile-first Card Search controls */
@media (max-width: 900px){
  /* Build the battlefield: Capital Kit stays together on the left; library is a distinct group on the right. */
  #setup .setup-visual{padding:14px!important}
  #setup .setup-table-v4{
    display:grid!important;
    grid-template-columns:minmax(0,1.72fr) minmax(118px,.9fr)!important;
    grid-template-areas:
      "capital library"
      "resources library"!important;
    column-gap:22px!important;
    row-gap:14px!important;
    align-items:center!important;
    width:100%!important;
    max-width:660px!important;
    min-height:0!important;
    margin:0 auto!important;
    padding:8px 4px 12px!important;
  }
  #setup .setup-table-v4 .quick-capital{
    grid-area:capital!important;
    width:92%!important;
    max-width:430px!important;
    justify-self:center!important;
    align-self:end!important;
    margin:0!important;
  }
  #setup .setup-table-v4 .resource-row{
    grid-area:resources!important;
    width:92%!important;
    justify-self:center!important;
    display:grid!important;
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:9px!important;
    align-items:start!important;
    margin:0!important;
  }
  #setup .setup-library{
    grid-area:library!important;
    width:100%!important;
    max-width:220px!important;
    justify-self:end!important;
    align-self:center!important;
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:9px!important;
    margin:0!important;
  }
  #setup .setup-table-v4 .setup-deck,
  #setup .setup-table-v4 .setup-discard-placeholder{width:100%!important;max-width:none!important;margin:0!important}
  #setup .setup-table-v4 .setup-deck span{bottom:-20px!important;font-size:8px!important}
  #setup .setup-table-v4 .setup-discard-placeholder span{font-size:8px!important}

  /* Produce Nekthar: explain first, then demonstrate the card. */
  #nekthar .quick-copy{order:1!important}
  #nekthar .single-card-stage{order:2!important}

  /* Card anatomy: fit the COMPLETE diagram into the phone viewport; never crop it. */
  #kravers .anatomy-fixed-stage.anatomy-v7{
    overflow:visible!important;
    padding:0!important;
    justify-content:center!important;
  }
  #kravers .anatomy-diagram-svg-v7{
    display:block!important;
    width:100%!important;
    min-width:0!important;
    max-width:560px!important;
    height:auto!important;
    margin:0 auto!important;
    transform:none!important;
  }
  #kravers .anatomy-callout-v7 text{font-size:24px!important}
}

@media (max-width: 620px){
  #setup .setup-table-v4{
    grid-template-columns:minmax(0,1.6fr) minmax(105px,.92fr)!important;
    column-gap:14px!important;
    row-gap:11px!important;
    padding:4px 0 10px!important;
  }
  #setup .setup-table-v4 .quick-capital,
  #setup .setup-table-v4 .resource-row{width:100%!important}
  #setup .setup-library{max-width:175px!important;gap:7px!important}
  #setup .setup-table-v4 .resource-row{gap:6px!important}
  #kravers .anatomy-diagram-svg-v7{max-width:100%!important}
}

@media (max-width: 390px){
  #setup .setup-table-v4{
    grid-template-columns:minmax(0,1.55fr) minmax(96px,.95fr)!important;
    column-gap:10px!important;
  }
  #setup .setup-library{gap:5px!important}
  #setup .setup-table-v4 .resource-row{gap:5px!important}
}


/* v29 landing card corner refinement */
.home-page .hero-card,
.home-page .hero-card-front,
.home-page .hero-card-back{
  border-radius:20px!important;
  overflow:hidden!important;
}
.home-page .hero-card img,
.home-page .hero-card-front img,
.home-page .hero-card-back img{
  border-radius:20px!important;
  clip-path:inset(0 round 20px)!important;
}
@media (max-width:900px){
  .home-page .hero-card,
  .home-page .hero-card-front,
  .home-page .hero-card-back{border-radius:17px!important}
  .home-page .hero-card img,
  .home-page .hero-card-front img,
  .home-page .hero-card-back img{
    border-radius:17px!important;
    clip-path:inset(0 round 17px)!important;
  }
}

@media(max-width:900px){.home-page .hero-card,.home-page .hero-card-front,.home-page .hero-card-back{border-radius:9px!important}.home-page .hero-card img,.home-page .hero-card-front img,.home-page .hero-card-back img{border-radius:9px!important;clip-path:inset(0 round 9px)!important}}
@media(max-width:520px){.home-page .hero-card,.home-page .hero-card-front,.home-page .hero-card-back{border-radius:7px!important}.home-page .hero-card img,.home-page .hero-card-front img,.home-page .hero-card-back img{border-radius:7px!important;clip-path:inset(0 round 7px)!important}}

#cardBackToTop{position:fixed;right:22px;bottom:22px;z-index:90;opacity:0;pointer-events:none;transform:translateY(8px);transition:opacity .2s ease,transform .2s ease;background:rgba(14,16,18,.78);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.16);color:#f3f3f3;border-radius:999px;padding:10px 15px;font:600 12px/1.2 inherit;letter-spacing:.04em;cursor:pointer}
#cardBackToTop.is-visible{opacity:1;pointer-events:auto;transform:none}
@media(max-width:600px){#cardBackToTop{right:14px;bottom:14px;padding:9px 12px;font-size:11px}}

/* Launch UX audit v2 */
@media(max-width:900px){
  button,.button,.hero-cta,.quick-next,.controls-toggle,.mobile-links a,.set-option{min-height:44px}
  html,body{max-width:100%;overflow-x:hidden}
  [id]{scroll-margin-top:18px}
}
@media(max-width:620px){
  .database-tools-row{position:sticky!important;top:8px!important;z-index:25!important}
  .controls-toggle{backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
  .rules-sidebar{max-height:42dvh!important;overflow:auto!important}
}


/* UX / discoverability refinement v3 — mobile */
@media(max-width:900px){
  .site-footer-inner{grid-template-columns:1fr!important;text-align:center!important;padding:28px 20px!important;gap:18px!important}
  .site-footer-nav{order:2;gap:12px 16px}.site-footer-socials{order:3;justify-content:center}.site-footer-credit{order:4}.site-footer-copy{order:1}
  .how-hub-grid{grid-template-columns:1fr}.how-hub-card{min-height:0}.how-hub-card-copy{padding:20px}
  .video-tutorial-wrap{width:min(100% - 28px,1120px);padding-top:42px}.video-tutorial-heading{margin-bottom:24px}
}
@media(max-width:760px){
  /* Card artwork on phones: almost-square corners, no aggressive clipping. */
  .home-page .hero-card,.home-page .hero-card-front,.home-page .hero-card-back{border-radius:3px!important;overflow:visible!important}
  .home-page .hero-card img,.home-page .hero-card-front img,.home-page .hero-card-back img{border-radius:2px!important}
  .db-card-image{border-radius:3px!important;overflow:visible!important}.db-card-image img{border-radius:2px!important}
  .modal-image-wrap img{border-radius:2px!important}

  /* Quick Start: compact horizontal step navigation instead of a tall 2-column wall. */
  .quick-stepnav{display:flex!important;grid-template-columns:none!important;gap:8px!important;overflow-x:auto!important;scroll-snap-type:x proximity;padding:0 0 8px!important;scrollbar-width:none}
  .quick-stepnav::-webkit-scrollbar{display:none}.quick-stepnav a{flex:0 0 auto;min-width:124px;scroll-snap-align:start;padding:11px 13px!important;justify-content:flex-start!important}
  .quick-start-page .quick-visual{min-height:0!important}.quick-start-page .single-card-stage,.quick-start-page .status-stage,.quick-start-page .anatomy-fixed-stage{padding:14px;border-radius:10px}
  #kravers .anatomy-diagram-svg-v7{display:none!important}.anatomy-mobile-v3{display:block;width:min(100%,360px);margin:0 auto}.anatomy-mobile-card-v3{position:relative;background:#020202;padding:6px;border-radius:5px;box-shadow:0 18px 34px rgba(0,0,0,.46)}.anatomy-mobile-card-v3 img{width:100%!important;height:auto!important;display:block!important;border-radius:2px!important;margin:0!important}.anatomy-mobile-marker-v3{position:absolute;width:25px;height:25px;border-radius:50%;display:grid;place-items:center;background:#f0f0ed;color:#101111;font:800 12px Arial,sans-serif;box-shadow:0 2px 10px rgba(0,0,0,.5)}.anatomy-marker-cost{left:4%;top:3%}.anatomy-marker-hp{right:4%;top:3%}.anatomy-marker-soma{left:4%;top:67%}.anatomy-marker-ethos{left:4%;top:73%}.anatomy-marker-attack-cost{left:4%;bottom:3%}.anatomy-marker-side-effect{left:56%;bottom:3%}.anatomy-marker-damage{right:4%;bottom:3%}.anatomy-mobile-key-v3{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin-top:14px}.anatomy-mobile-key-v3 span{padding:8px 9px;border:1px solid rgba(255,255,255,.08);background:rgba(5,6,6,.3);font:700 10px/1.25 Arial,sans-serif;color:#bfc3c0}.anatomy-mobile-key-v3 b{display:inline-grid;place-items:center;width:19px;height:19px;margin-right:3px;border-radius:50%;background:#ededeb;color:#111;font-size:10px}

  /* Rules mobile index starts closed. Search remains immediately available. */
  .rules-sidebar{max-height:none!important;overflow:visible!important}.rules-index-toggle{display:flex}.rules-index{display:none!important;max-height:45dvh;overflow:auto;margin-top:8px;padding-right:5px}.rules-sidebar.index-open .rules-index{display:grid!important}

  .video-tutorial-play{width:62px;height:62px;font-size:22px}.video-tutorial-label{bottom:14px;font-size:9px}.video-tutorial-after{text-align:left}.video-tutorial-links{justify-content:flex-start}
  .support .support-copy{font-size:15px;line-height:1.55}
}

/* v4 mobile — preserve artwork, simplify teaching diagrams */
@media(max-width:760px){
  .home-page .hero-card,.home-page .hero-card-front,.home-page .hero-card-back,.home-page .hero-card img,.home-page .hero-card-front img,.home-page .hero-card-back img,.db-card-image,.db-card-image img,.modal-image-wrap img,.quick-start-page .quick-card,.quick-start-page .quick-card img{clip-path:none!important}
  .quick-start-page .quick-chapter,.quick-start-page .quick-chapter-wide,#kravers.quick-chapter{gap:22px!important;padding:44px 0!important}
  .quick-start-page .quick-visual{border-radius:6px!important}
  #setup .setup-visual{padding:16px!important}
  .setup-zone-label-v4{font-size:7px;letter-spacing:.13em}
  .setup-zone-capital{left:2%;top:-7px}.setup-zone-resources{left:2%;top:auto;bottom:31%}.setup-zone-library{right:3%;top:-7px}
  #kravers .anatomy-stage{padding:16px!important}
  .anatomy-board-v4{grid-template-columns:1fr;gap:18px;width:min(100%,390px)}
  .anatomy-card-v4{width:min(100%,338px);padding:10px;border-radius:4px}
  .anatomy-dot-v4{width:27px;height:27px;font-size:12px}
  .anatomy-key-v4{grid-template-columns:1fr 1fr;gap:0 8px}
  .anatomy-key-v4 li{min-height:40px;padding:7px 5px;grid-template-columns:26px 1fr;font-size:10px}
  .anatomy-key-v4 b{width:23px;height:23px;font-size:10px}
  .turn-tabs{display:flex!important;overflow-x:auto!important;scroll-snap-type:x proximity;border-radius:5px!important;scrollbar-width:none}.turn-tabs::-webkit-scrollbar{display:none}
  .turn-tabs button{flex:0 0 88px!important;min-width:88px!important;scroll-snap-align:start;font-size:10px!important}
  .attack-sim-v6{border-radius:6px!important;padding:9px!important}
  .attack-explain-v6{min-height:64px!important}.attack-explain-v6 p{font-size:10.5px!important}
  .status-buttons{display:grid!important;grid-template-columns:repeat(2,1fr)!important}.status-buttons button{border-radius:5px!important}
  .cardtype-cards{grid-template-columns:repeat(3,minmax(0,1fr))!important}.type-card{padding:7px!important}
}
@media(max-width:390px){.anatomy-key-v4{grid-template-columns:1fr}.anatomy-card-v4{width:min(100%,315px)}}


/* Quick Start v5 hard overrides */
@media(max-width:760px){
  #setup .setup-table-v4,
  #setup .setup-table-v4 .quick-capital,
  #setup .setup-library,
  #setup .setup-table-v4 .resource-row,
  #setup .setup-garrison-band{transform:none !important}
}

/* v17 — primary nav gains Play Online; collapse header before labels can crowd. */
@media (max-width: 1080px) and (min-width: 901px){
  .menu,.home-page .menu,.header-socials{display:none!important}
  .hamb,.home-page .hamb{display:block!important;margin-left:auto!important}
}

/* v111 — final mobile launch polish */
@media(max-width:760px){
  /* Keep small playing cards looking like cards, not rounded tiles. */
  .home-page .hero-card,.home-page .hero-card-front,.home-page .hero-card-back,
  .db-card-image,.modal-image-wrap,.quick-start-page .quick-card,.quick-start-page .sample-card,.cardtype-cards .quick-card{border-radius:2px!important;clip-path:none!important}
  .home-page .hero-card img,.home-page .hero-card-front img,.home-page .hero-card-back img,
  .db-card-image img,.modal-image-wrap img,.quick-start-page .quick-card img,.quick-start-page .sample-card img,.cardtype-cards img{border-radius:1.5px!important;clip-path:none!important}

  /* No cropped horizontal tab bars: every step is visible. */
  .quick-stepnav{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:6px!important;overflow:visible!important;padding-bottom:0!important}
  .quick-stepnav a{min-width:0!important;width:auto!important;padding:9px 7px!important;justify-content:center!important;text-align:center!important;font-size:9px!important;line-height:1.15!important}
  .turn-tabs{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;overflow:visible!important;scroll-snap-type:none!important;border-radius:4px!important}
  .turn-tabs button{min-width:0!important;width:auto!important;flex:auto!important;padding:10px 3px!important;font-size:9px!important;line-height:1.12!important;border-right:1px solid rgba(255,255,255,.07)!important;border-bottom:1px solid rgba(255,255,255,.07)!important}
  .turn-tabs button:nth-child(4n){border-right:0!important}

  .quick-start-page .quick-content{width:min(100% - 28px,1240px)!important}.quick-start-page .quick-chapter,.quick-start-page .quick-chapter-wide,#kravers.quick-chapter{padding:48px 0!important;gap:25px!important}.quick-start-page .quick-copy h2,.quick-start-page .quick-finish h2{font-size:clamp(35px,10vw,44px)!important;line-height:.98!important}.quick-start-page .quick-copy p{font-size:15px!important;line-height:1.62!important}.quick-start-page .quick-visual{padding:12px!important;border-radius:5px!important;overflow:visible!important}.quick-start-page .quick-next{width:100%;justify-content:space-between}

  /* Setup: larger cards in a 3-column tabletop, with deck/discard below. */
  #setup .ks-setup-stage-v9{--card-w:min(26vw,104px)!important;--gap:8px!important;grid-template-columns:repeat(3,var(--card-w))!important;grid-template-rows:auto auto auto!important;gap:18px var(--gap)!important;width:max-content!important;max-width:100%!important}
  #setup .ks-setup-capital-v9{grid-column:1 / span 3!important;grid-row:1!important}
  #setup .ks-setup-stage-v9>.ks-setup-portrait-v9:nth-child(2){grid-column:1!important;grid-row:2!important}
  #setup .ks-setup-stage-v9>.ks-setup-portrait-v9:nth-child(3){grid-column:2!important;grid-row:2!important}
  #setup .ks-setup-stage-v9>.ks-setup-portrait-v9:nth-child(4){grid-column:3!important;grid-row:2!important}
  #setup .ks-setup-stage-v9>.ks-setup-portrait-v9:nth-child(5){grid-column:1!important;grid-row:3!important}
  #setup .ks-setup-stage-v9>.ks-setup-portrait-v9:nth-child(6){grid-column:3!important;grid-row:3!important}
  #setup .ks-setup-deck-v9 span,#setup .ks-setup-discard-v9 span{font-size:8px!important}

  .attack-sim-v6,.attack-stage,.status-stage,.anatomy-stage{max-width:100%!important;min-width:0!important;overflow:hidden!important}.attack-sim-v6{padding:8px!important}.attack-explain-v6{padding-inline:8px!important}.cardtype-switcher{grid-template-columns:1fr!important;gap:18px!important}.cardtype-readout{border-left:0!important;border-top:1px solid rgba(255,255,255,.11)!important;padding:20px 4px 0!important;min-height:0!important}
  .contact-hero,.legal-page{padding-top:44px!important}.contact-layout{grid-template-columns:1fr!important;gap:18px!important;margin-top:26px!important}.contact-form{grid-template-columns:1fr!important;padding:20px!important;gap:16px!important}.contact-field-full,.contact-form-footer{grid-column:auto!important}.contact-form-footer{align-items:flex-start;flex-direction:column}.contact-form-footer .btn{width:100%;justify-content:center}.contact-aside-card{padding:20px}.contact-thanks-actions{display:grid}.demo-modal{padding:10px}.demo-modal-card{padding:25px 18px 22px;max-height:calc(100dvh - 20px)}.demo-form-grid{grid-template-columns:1fr}.demo-modal-card .button{width:100%;justify-content:center}.legal-block{padding:23px 0}.legal-block h2{font-size:22px}
  .rules-document{min-width:0!important}.rule-list-item{grid-template-columns:24px 1fr;gap:6px}.rules-minihead{font-size:17px}
}
@media(max-width:390px){.quick-stepnav{grid-template-columns:repeat(2,minmax(0,1fr))!important}.turn-tabs{grid-template-columns:repeat(2,minmax(0,1fr))!important}.turn-tabs button:nth-child(4n){border-right:1px solid rgba(255,255,255,.07)!important}.turn-tabs button:nth-child(2n){border-right:0!important}}


/* v114 — Nekthar detail mobile containment and typography */
@media (max-width: 900px){
  .nekthar-type-detail,.nekthar-detail-page{max-width:100%;overflow-x:clip}
  .nekthar-dual-detail .nekthar-dual-hero .wrap,
  .nekthar-dual-detail .nekthar-dual-body .wrap{width:calc(100% - (var(--page-x) * 2))!important;max-width:none!important;min-width:0!important}
  .nekthar-dual-detail .nekthar-dual-hero-grid,
  .nekthar-dual-detail .nekthar-dual-intro,
  .nekthar-dual-detail .nekthar-dual-feature-grid,
  .nekthar-dual-detail .nekthar-dual-feature,
  .nekthar-dual-detail .nekthar-dual-echoes,
  .nekthar-dual-detail .nekthar-related-convergences,
  .nekthar-dual-detail .nekthar-dual-people,
  .nekthar-dual-detail .nekthar-convergence-grid{min-width:0!important;max-width:100%!important;width:100%!important}
  .nekthar-dual-detail .nekthar-dual-feature-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .nekthar-dual-detail .nekthar-dual-feature{overflow:hidden!important}
  .nekthar-dual-detail .nekthar-dual-feature h2{font-size:clamp(25px,4.8vw,34px)!important;line-height:1.08!important;margin:0 0 12px!important;max-width:100%!important;overflow-wrap:break-word!important;word-break:normal!important}
  .nekthar-dual-detail .nekthar-dual-feature p{max-width:100%!important;overflow-wrap:break-word!important}
  .nekthar-dual-detail .nekthar-section-heading h2{font-size:clamp(32px,6vw,44px)!important;line-height:1.05!important;margin-bottom:16px!important;overflow-wrap:break-word!important}
}
@media (max-width: 700px){
  .nekthar-dual-detail .nekthar-dual-feature-grid{grid-template-columns:minmax(0,1fr)!important;gap:14px!important}
  .nekthar-dual-detail .nekthar-dual-feature{padding:22px 20px!important}
  .nekthar-dual-detail .nekthar-dual-feature h2{font-size:clamp(27px,8.2vw,36px)!important;line-height:1.04!important;margin:0 0 12px!important}
  .nekthar-dual-detail .nekthar-dual-feature p{font-size:15px!important;line-height:1.62!important}
  .nekthar-dual-detail .nekthar-section-heading h2{font-size:clamp(30px,8.5vw,38px)!important;line-height:1.04!important}
  .nekthar-dual-detail .nekthar-convergence-card{grid-template-columns:52px minmax(0,1fr)!important;gap:11px!important}
  .nekthar-dual-detail .nekthar-convergence-card>b{display:none!important}
}
@media (max-width: 390px){
  .nekthar-dual-detail .nekthar-dual-feature{padding:20px 17px!important}
  .nekthar-dual-detail .nekthar-dual-feature h2{font-size:clamp(25px,8vw,32px)!important}
  .nekthar-dual-detail .nekthar-dual-intro h1{font-size:clamp(29px,9.5vw,38px)!important}
}


/* v114 — mono Nekthar detail mobile containment */
@media (max-width: 900px){
  .nekthar-type-detail:not(.nekthar-dual-detail) .nekthar-detail-hero .wrap,
  .nekthar-type-detail:not(.nekthar-dual-detail) .nekthar-detail-body .wrap{width:calc(100% - (var(--page-x) * 2))!important;max-width:none!important;min-width:0!important}
  .nekthar-type-detail:not(.nekthar-dual-detail) .nekthar-detail-hero-grid,
  .nekthar-type-detail:not(.nekthar-dual-detail) .nekthar-detail-intro,
  .nekthar-type-detail:not(.nekthar-dual-detail) .nekthar-feature-grid,
  .nekthar-type-detail:not(.nekthar-dual-detail) .nekthar-feature,
  .nekthar-type-detail:not(.nekthar-dual-detail) .nekthar-mono-convergences,
  .nekthar-type-detail:not(.nekthar-dual-detail) .nekthar-convergence-grid{min-width:0!important;max-width:100%!important;width:100%!important}
  .nekthar-type-detail:not(.nekthar-dual-detail) .nekthar-feature-grid{grid-template-columns:minmax(0,1fr)!important}
  .nekthar-type-detail:not(.nekthar-dual-detail) .nekthar-feature{overflow:hidden!important}
  .nekthar-type-detail:not(.nekthar-dual-detail) .nekthar-feature h2{font-size:clamp(25px,4.8vw,34px)!important;line-height:1.08!important;margin:0 0 12px!important;max-width:100%!important;overflow-wrap:break-word!important}
  .nekthar-type-detail:not(.nekthar-dual-detail) .nekthar-feature p{max-width:100%!important;overflow-wrap:break-word!important}
  .nekthar-type-detail:not(.nekthar-dual-detail) .nekthar-section-heading h2{font-size:clamp(32px,6vw,44px)!important;line-height:1.05!important;margin-bottom:16px!important;overflow-wrap:break-word!important}
}
@media (max-width: 700px){
  .nekthar-type-detail:not(.nekthar-dual-detail) .nekthar-feature{padding:22px 20px!important}
  .nekthar-type-detail:not(.nekthar-dual-detail) .nekthar-feature h2{font-size:clamp(27px,8.2vw,36px)!important;line-height:1.04!important}
  .nekthar-type-detail:not(.nekthar-dual-detail) .nekthar-feature p{font-size:15px!important;line-height:1.62!important}
  .nekthar-type-detail:not(.nekthar-dual-detail) .nekthar-section-heading h2{font-size:clamp(30px,8.5vw,38px)!important;line-height:1.04!important}
  .nekthar-type-detail:not(.nekthar-dual-detail) .nekthar-convergence-card{grid-template-columns:52px minmax(0,1fr)!important;gap:11px!important}
  .nekthar-type-detail:not(.nekthar-dual-detail) .nekthar-convergence-card>b{display:none!important}
}
@media (max-width: 390px){
  .nekthar-type-detail:not(.nekthar-dual-detail) .nekthar-feature{padding:20px 17px!important}
  .nekthar-type-detail:not(.nekthar-dual-detail) .nekthar-feature h2{font-size:clamp(25px,8vw,32px)!important}
}

/* v115 — Sets page mobile typography containment */
@media(max-width:640px){
  .sets-page .set-tile h2{
    max-width:100%!important;
    font-size:clamp(23px,7vw,28px)!important;
    line-height:1.02!important;
    letter-spacing:-.025em!important;
    white-space:normal!important;
    overflow-wrap:normal!important;
    word-break:normal!important;
  }
  .sets-page .set-tile-copy{min-width:0!important;overflow:hidden!important}
}
@media(max-width:360px){
  .sets-page .set-tile h2{font-size:clamp(21px,7vw,25px)!important}
}


/* v150 - final mobile layout overrides */
@media(max-width:719px){
  .nekthar-types-page .nekthar-wheel-center{width:32%!important;padding:10px!important}
  .nekthar-types-page .nekthar-wheel-center .nekthar-wheel-mark{width:92%!important;max-width:none!important;height:auto!important;object-fit:contain!important}
  .nekthar-types-page .nekthar-node-top{top:9.5%!important}
}
@media(max-width:900px){
  .nekthar-dual-detail .nekthar-dual-hero{padding-bottom:26px!important}
  .nekthar-dual-detail .nekthar-dual-body{padding-top:10px!important}
  .nekthar-dual-detail .nekthar-dual-echoes{margin-top:28px!important}
}
@media(max-width:620px){
  .home-page .hero h1{font-size:clamp(27px,8vw,33px)!important;line-height:1.14!important;letter-spacing:-.012em!important}
  .home-page .hero .hero-title-line{display:block!important;white-space:nowrap!important}
  .nekthar-type-detail:not(.nekthar-dual-detail) .nekthar-mini-nav{display:flex!important;flex-wrap:nowrap!important;justify-content:center!important;gap:clamp(3px,1.2vw,6px)!important;width:100%!important;max-width:100%!important}
  .nekthar-type-detail:not(.nekthar-dual-detail) .nekthar-mini-link{flex:0 1 40px!important;width:auto!important;min-width:0!important;height:auto!important;aspect-ratio:1/1!important}
  .nekthar-type-detail:not(.nekthar-dual-detail) .nekthar-mini-link img{width:72%!important;height:72%!important}
  .sets-page .set-tile{display:block!important;grid-template-columns:none!important;gap:0!important;align-items:initial!important;width:100%!important;max-width:100%!important}
  .sets-page .set-tile-inner,.sets-page .set-face{width:100%!important;max-width:100%!important}
  .legal-block h2{font-size:20px!important;line-height:1.2!important;letter-spacing:0!important;overflow-wrap:anywhere!important;word-break:normal!important}
  .display,.section h2,.faq-question,.nq-recs h3,.nq-echoes h3,.nekthar-section-heading h2{max-width:100%!important;white-space:normal!important;overflow-wrap:anywhere!important;word-break:normal!important;text-wrap:pretty}
}


/* Grouped site footer v189 — responsive */
@media(max-width:1180px){
  .site-footer-inner{width:calc(100% - (var(--page-x) * 2))!important;padding:40px 0 26px!important;display:block!important;text-align:left!important}
  .site-footer-directory{grid-template-columns:repeat(3,minmax(0,1fr));row-gap:34px}
  .site-footer-group{padding:0 24px;border-left:1px solid rgba(255,255,255,.075)}
  .site-footer-group:nth-child(3n+1){padding-left:0;border-left:0}
  .site-footer-group:nth-child(3n){padding-right:0}
  .site-footer-bottom{margin-top:34px}
}
@media(max-width:760px){
  .site-footer-inner{width:calc(100% - (var(--page-x) * 2))!important;padding:34px 0 26px!important;display:block!important;text-align:left!important}
  .site-footer-directory{grid-template-columns:repeat(2,minmax(0,1fr));gap:30px 0}
  .site-footer-group{padding:0 18px!important;border-left:1px solid rgba(255,255,255,.075)!important;text-align:left!important;align-items:flex-start!important}
  .site-footer-group:nth-child(odd){padding-left:0!important;border-left:0!important}
  .site-footer-group:nth-child(even){padding-right:0!important}
  .site-footer-group h2{font-size:11px}
  .site-footer-group a{font-size:13px}
  .site-footer-bottom{grid-template-columns:1fr;gap:18px;margin-top:32px;padding-top:22px;text-align:center}
  .site-footer-bottom .site-footer-copy,.site-footer-bottom .site-footer-socials,.site-footer-bottom .site-footer-credit{justify-self:center!important;text-align:center!important}
  .site-footer-bottom .site-footer-socials{order:1;gap:28px!important}
  .site-footer-bottom .site-footer-copy{order:2}
  .site-footer-bottom .site-footer-credit{order:3}
}
@media(max-width:440px){
  .site-footer-directory{grid-template-columns:1fr;gap:0}
  .site-footer-group{padding:20px 0!important;border-left:0!important;border-top:1px solid rgba(255,255,255,.065)!important}
  .site-footer-group:first-child{padding-top:0!important;border-top:0!important}
}


/* Compact grouped site footer v190 — responsive overrides */
@media(max-width:1180px){
  .site-footer-inner{padding:18px 0 14px!important}
  .site-footer-directory{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:14px 0!important}
  .site-footer-group{padding:0 16px!important;border-left:1px solid rgba(255,255,255,.06)!important}
  .site-footer-group:nth-child(3n+1){padding-left:0!important;border-left:0!important}
  .site-footer-group:nth-child(3n){padding-right:0!important}
  .site-footer-bottom{margin-top:14px!important;padding-top:10px!important}
}
@media(max-width:760px){
  .site-footer-inner{padding:16px 0 14px!important;text-align:left!important}
  .site-footer-directory{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:12px 0!important}
  .site-footer-group{padding:0 12px!important;border-top:0!important;border-left:1px solid rgba(255,255,255,.06)!important;text-align:left!important}
  .site-footer-group:nth-child(odd){padding-left:0!important;border-left:0!important}
  .site-footer-group:nth-child(even){padding-right:0!important}
  .site-footer-group h2{font-size:9px!important;margin-bottom:4px!important}
  .site-footer-group a{font-size:10px!important;line-height:1.5!important}
  .site-footer-bottom{grid-template-columns:1fr auto 1fr!important;gap:10px!important;margin-top:13px!important;padding-top:10px!important;text-align:left!important}
  .site-footer-bottom .site-footer-copy{order:initial!important;justify-self:start!important;text-align:left!important;font-size:9px!important}
  .site-footer-bottom .site-footer-socials{order:initial!important;justify-self:center!important;gap:16px!important}
  .site-footer-bottom .site-footer-socials a{width:16px!important;height:16px!important}
  .site-footer-bottom .site-footer-credit{order:initial!important;justify-self:end!important;text-align:right!important;font-size:9px!important}
}
@media(max-width:520px){
  .site-footer-directory{grid-template-columns:1fr!important;gap:9px!important}
  .site-footer-group,
  .site-footer-group:nth-child(odd),
  .site-footer-group:nth-child(even){padding:0!important;border:0!important}
  .site-footer-group h2{display:inline!important;margin:0 7px 0 0!important}
  .site-footer-group h2::after{content:":"}
  .site-footer-group a{font-size:9.5px!important;line-height:1.45!important}
  .site-footer-bottom{grid-template-columns:1fr!important;justify-items:center!important;gap:8px!important;text-align:center!important}
  .site-footer-bottom .site-footer-socials{order:1!important;justify-self:center!important}
  .site-footer-bottom .site-footer-copy{order:2!important;justify-self:center!important;text-align:center!important}
  .site-footer-bottom .site-footer-credit{order:3!important;justify-self:center!important;text-align:center!important}
}

/* === Simple site footer v192 responsive === */
@media(max-width:1200px){
  .site-footer-inner{width:min(1160px,calc(100% - 64px))!important;gap:18px!important}
  .site-footer-nav{gap:12px!important}
}
@media(max-width:760px){
  .site-footer-inner{
    width:min(100% - 34px,760px)!important;
    padding:13px 0!important;
    grid-template-columns:1fr auto!important;
    grid-template-areas:"nav socials" "copy credit"!important;
    gap:10px 16px!important;
  }
  .site-footer-nav{grid-area:nav!important;justify-content:flex-start!important;gap:8px 12px!important;font-size:9.5px!important}
  .site-footer-socials{grid-area:socials!important;justify-self:end!important;gap:13px!important}
  .site-footer-copy{grid-area:copy!important;justify-self:start!important;font-size:9px!important}
  .site-footer-credit{grid-area:credit!important;justify-self:end!important;font-size:9px!important}
}
@media(max-width:520px){
  .site-footer-inner{grid-template-columns:1fr!important;grid-template-areas:"nav" "socials" "copy"!important;justify-items:start!important;gap:9px!important}
  .site-footer-nav{justify-content:flex-start!important}
  .site-footer-socials{justify-self:start!important}
  .site-footer-copy{justify-self:start!important}
  .site-footer-credit{display:none!important}
}

/* === v193 final mobile + footer polish === */
/* Keep the simple footer discreet, but readable and easy to tap. */
.site-footer-inner{
  padding:18px 0!important;
  gap:22px!important;
}
.site-footer-nav{
  font-size:13px!important;
  line-height:1.32!important;
  gap:12px 17px!important;
  letter-spacing:.035em!important;
}
.site-footer-copy,
.site-footer-credit{
  font-size:12px!important;
  line-height:1.3!important;
}
.site-footer-socials{gap:13px!important}
.site-footer-socials a{
  width:34px!important;
  height:34px!important;
  padding:6px!important;
  opacity:.82!important;
}
.site-footer-socials svg{width:24px!important;height:24px!important}

@media(max-width:900px){
  /* Global phone/tablet containment audit. */
  html,body{width:100%;max-width:100%;overflow-x:hidden!important}
  img,video,iframe{max-width:100%;height:auto}
  .mobile-overlay{overflow-y:auto!important;overscroll-behavior:contain}
  .mobile-links{width:min(100%,560px)!important}

  /* Long rules/legal/editorial content must never push the page wider than the viewport. */
  .rules-copy,.legal-block,.about-text-body,.support-copy,.news-preview-copy,.article-body,
  .nekthar-feature,.nekthar-dual-body,.faq-answer{min-width:0!important;max-width:100%!important}
  .rules-copy p,.rules-copy li,.legal-block p,.legal-block li,.about-text-body p,.support-copy,
  .news-preview-copy p,.article-body p,.nekthar-feature p,.nekthar-dual-body p,.faq-answer{
    overflow-wrap:break-word!important;
    word-break:normal!important;
  }
  .rules-copy table,.rules-copy pre,.rules-copy code{max-width:100%}
  .rules-copy table,.rules-copy pre{display:block;overflow-x:auto;-webkit-overflow-scrolling:touch}

  /* Embedded media and cards stay inside their columns. */
  .how-hub-card,.news-preview,.set-tile,.first-guide-page{min-width:0!important;max-width:100%!important}
  .video-tutorial-player,.how-video-embed{max-width:100%!important}

  /* Footer: readable without turning back into a large directory. */
  .site-footer-inner{
    width:min(100% - 34px,760px)!important;
    padding:18px 0!important;
    grid-template-columns:1fr auto!important;
    grid-template-areas:"nav socials" "copy credit"!important;
    gap:12px 18px!important;
    text-align:left!important;
    justify-items:stretch!important;
  }
  .site-footer-nav{
    grid-area:nav!important;
    justify-content:flex-start!important;
    gap:8px 14px!important;
    font-size:13px!important;
    line-height:1.35!important;
  }
  .site-footer-nav a{padding:3px 0!important}
  .site-footer-socials{grid-area:socials!important;justify-self:end!important;gap:8px!important}
  .site-footer-socials a{width:42px!important;height:42px!important;padding:8px!important}
  .site-footer-socials svg{width:25px!important;height:25px!important}
  .site-footer-copy{grid-area:copy!important;justify-self:start!important;font-size:12px!important}
  .site-footer-credit{grid-area:credit!important;justify-self:end!important;font-size:12px!important}
}

@media(max-width:620px){
  /* Header / menu tap targets and safe spacing. */
  .nav,.home-nav,body:not(.home-page) .nav{padding-inline:0!important}
  .hamb,.home-page .hamb{width:48px!important;height:48px!important;min-height:48px!important}
  .mobile-close{width:48px!important;height:48px!important}
  .mobile-nav-toggle,.mobile-links>a{min-height:56px!important}
  .mobile-nav-children>a,.mobile-nav-subrow>a{min-height:44px!important;display:flex!important;align-items:center!important;justify-content:center!important}

  /* Footer becomes three short rows, keeping the creator credit visible. */
  .site-footer-inner{
    width:min(100% - 28px,620px)!important;
    grid-template-columns:1fr!important;
    grid-template-areas:"nav" "socials" "copy" "credit"!important;
    justify-items:center!important;
    gap:10px!important;
    padding:17px 0 16px!important;
    text-align:center!important;
  }
  .site-footer-nav{justify-content:center!important;gap:6px 13px!important;font-size:13.5px!important;line-height:1.35!important}
  .site-footer-socials{justify-self:center!important;gap:10px!important}
  .site-footer-socials a{width:42px!important;height:42px!important;padding:8px!important}
  .site-footer-socials svg{width:25px!important;height:25px!important}
  .site-footer-copy{justify-self:center!important;text-align:center!important;font-size:12px!important}
  .site-footer-credit{display:block!important;justify-self:center!important;text-align:center!important;font-size:12px!important;color:#9fa49f!important}

  /* First Game Guide remains visually integrated but gains breathing room on phones. */
  .first-guide-section{padding:38px 0 58px!important}
  .first-guide-heading{margin-bottom:24px!important}
  .first-guide-heading .display{font-size:clamp(38px,11vw,48px)!important;margin-bottom:14px!important}
  .first-guide-lede{font-size:15px!important;line-height:1.58!important}
  .first-guide-actions{margin-top:20px!important}
  .first-guide-download{min-width:0!important;min-height:48px!important;font-size:15px!important}
  .first-guide-pages{gap:15px!important;margin-top:24px!important}
  .first-guide-page{padding:5px!important;box-shadow:0 12px 28px rgba(0,0,0,.28)!important}

  /* Editorial cards and sets should fill the useful phone width cleanly. */
  .news-index,.editorial-grid,.sets-page .sets-grid{width:100%!important;max-width:100%!important}
  .news-preview-overlay h2{font-size:clamp(23px,7vw,29px)!important;line-height:1.06!important}
  .news-preview-copy p{font-size:15.5px!important;line-height:1.56!important}
}

@media(max-width:390px){
  .site-footer-inner{width:calc(100% - 24px)!important}
  .site-footer-nav{font-size:11.5px!important;gap:5px 11px!important}
  .site-footer-socials a{width:32px!important;height:32px!important;padding:5px!important}
  .site-footer-socials svg{width:21px!important;height:21px!important}
  .site-footer-copy,.site-footer-credit{font-size:10px!important}
  .mobile-overlay{padding-inline:14px!important}
}

/* v193 audit corrections found in rendered phone pass */
/* The First Game Guide CTA must look like an actual primary download button on every viewport. */
.first-guide-download{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  padding:14px 20px!important;
  min-height:48px!important;
  border-radius:999px!important;
  background:#e6e6e6!important;
  color:#111!important;
  text-decoration:none!important;
  font:700 13px/1 Arial,Helvetica,sans-serif!important;
  letter-spacing:.055em!important;
  text-transform:uppercase!important;
  transition:background .15s ease,transform .15s ease!important;
}
.first-guide-download:hover{background:#fff!important;transform:translateY(-1px)!important}

@media(max-width:620px){
  /* Preserve the intended two-line landing headline without clipping on real phone widths. */
  .home-page .hero-copy{width:100%!important;min-width:0!important;text-align:center!important}
  .home-page .hero h1{
    width:100%!important;
    max-width:100%!important;
    margin:0 auto 24px!important;
    font-size:clamp(22px,6.55vw,27px)!important;
    line-height:1.16!important;
    text-align:center!important;
  }
  .home-page .hero .hero-title-line{display:block!important;white-space:nowrap!important}
  .home-page .hero p{
    width:100%!important;
    max-width:100%!important;
    margin:0 auto 24px!important;
    padding:0 4px!important;
    font-size:16px!important;
    line-height:1.38!important;
    text-align:center!important;
    white-space:normal!important;
  }
  .home-page .buttonrow{width:100%!important;margin:0 auto!important}
  .home-page .button{width:100%!important;max-width:100%!important;margin:0 auto!important;min-width:0!important;padding-inline:16px!important;font-size:18px!important}
  .home-page .card-stage{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    justify-self:stretch!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:12px!important;
  }
  .home-page .hero-card{width:100%!important;min-width:0!important}

  /* Hub titles wrap only between words, never through the middle of a word. */
  .how-hub-card h2{
    font-size:clamp(27px,7.8vw,31px)!important;
    line-height:1.02!important;
    overflow-wrap:normal!important;
    word-break:normal!important;
    hyphens:none!important;
  }

  /* Slightly larger final footer typography after visual review. */
  .site-footer-nav{font-size:13.5px!important;gap:7px 15px!important}
  .site-footer-socials a{width:42px!important;height:42px!important;padding:8px!important}
  .site-footer-socials svg{width:25px!important;height:25px!important}
  .site-footer-copy,.site-footer-credit{font-size:12px!important}
}

@media(max-width:390px){
  .home-page .hero h1{font-size:clamp(21px,6.4vw,25px)!important}
  .home-page .hero p{font-size:15.5px!important}
  .home-page .button{font-size:17px!important}
  .site-footer-nav{font-size:12.5px!important;gap:6px 13px!important}
  .site-footer-copy,.site-footer-credit{font-size:12px!important}
  .site-footer-socials a{width:40px!important;height:40px!important}
  .site-footer-socials svg{width:25px!important;height:25px!important}
}


/* v193 mobile contrast + tap-target audit */
@media(max-width:760px){
  .display{color:#eceeea!important}
  .home-page .hero h1{color:#f0f1ef!important}
  .home-page .hero p{color:#e0e2df!important}
  .how-hub-card h2{color:#e9ebe8!important}
  .how-hub-card p,.how-hub-lede{color:#b9bfba!important}
  .sets-page .sets-masthead .display{color:#f0f1ed!important}
  .first-guide-heading .display{color:#f0f1ed!important}
  .news-masthead .display,.about-text-only .display,.about-rich .display,.quick-hero .display{color:#f0f1ed!important}
  .btn,.button,.controls-toggle,.rules-index-toggle,.quick-next{min-height:44px}
  input,select,textarea{font-size:16px}
}
@media(max-width:390px){
  .site-footer-inner{padding-bottom:max(18px,env(safe-area-inset-bottom))!important}
}

/* v293 — definitive mobile layout corrections
   Loaded after styles.css so these rules are authoritative on phones. */
@media (max-width:700px){
  /* Homepage headline: center each line by its own intrinsic width. */
  .home-page .hero-copy{width:100%!important;min-width:0!important;text-align:center!important}
  .home-page .hero h1{
    width:100%!important;
    max-width:100%!important;
    margin-inline:auto!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    text-align:center!important;
    transform:none!important;
  }
  .home-page .hero .hero-title-line{
    display:block!important;
    width:max-content!important;
    max-width:100%!important;
    margin-inline:auto!important;
    text-align:center!important;
    transform:none!important;
    white-space:nowrap!important;
  }

  /* Release strip: center the heading/date and clock as independent rows. */
  .core-release-countdown-inner{
    width:100%!important;
    max-width:100%!important;
    box-sizing:border-box!important;
    padding:9px 12px 8px!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:center!important;
    gap:7px!important;
  }
  .core-release-countdown-heading,
  .core-release-countdown-clock{
    width:max-content!important;
    max-width:100%!important;
    margin-inline:auto!important;
    justify-self:auto!important;
    transform:none!important;
  }
  .core-release-countdown-heading{justify-content:center!important;text-align:center!important}
  .core-release-countdown-clock{justify-content:center!important}

  /* News + Articles archive titles: current titles should fit without being cut.
     Three lines remains the hard maximum. */
  .editorial-grid .news-preview-title{
    font-size:clamp(18.5px,5vw,20px)!important;
    line-height:1.08!important;
    letter-spacing:-.012em!important;
    max-height:3.24em!important;
    -webkit-line-clamp:3!important;
    line-clamp:3!important;
    overflow:hidden!important;
    margin-bottom:8px!important;
  }
  .editorial-grid .news-preview-copy{
    min-height:0!important;
    padding:11px 13px 13px!important;
  }
  .editorial-grid .news-preview-meta{font-size:10.5px!important;line-height:1.25!important}

  /* Quick Start paged reader: reset old scrolling-layout mobile rules that conflict
     with the current one-topic-at-a-time reader. */
  .quick-start-page.quick-paged-mode .quick-main{width:100%!important;max-width:100%!important;overflow-x:hidden!important}
  .quick-start-page.quick-paged-mode .quick-reader-shell{
    width:100%!important;
    max-width:100%!important;
    margin:0 auto!important;
    padding:14px 14px 76px!important;
    box-sizing:border-box!important;
  }
  .quick-start-page.quick-paged-mode .quick-content{
    width:100%!important;
    max-width:100%!important;
    margin:0!important;
    padding:0!important;
  }
  .quick-start-page.quick-paged-mode .quick-chapter.is-quick-page-active,
  .quick-start-page.quick-paged-mode .quick-finish.is-quick-page-active{
    width:100%!important;
    min-width:0!important;
    min-height:0!important;
    margin:0!important;
    padding:20px 16px 24px!important;
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:20px!important;
    align-items:start!important;
    overflow:hidden!important;
    border-radius:12px!important;
    box-sizing:border-box!important;
  }
  .quick-start-page.quick-paged-mode .quick-page-meta{
    width:100%!important;
    min-width:0!important;
    margin:0!important;
    padding:0 0 10px!important;
    justify-content:flex-start!important;
    gap:8px!important;
    font-size:8px!important;
  }
  .quick-start-page.quick-paged-mode .quick-page-title{
    min-width:0!important;
    max-width:calc(100% - 52px)!important;
    padding-left:8px!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }
  .quick-start-page.quick-paged-mode .quick-copy,
  .quick-start-page.quick-paged-mode .quick-copy-full{
    width:100%!important;
    max-width:100%!important;
    margin:0!important;
    order:initial!important;
  }
  .quick-start-page.quick-paged-mode .quick-num{
    width:34px!important;
    height:34px!important;
    margin:0 0 12px!important;
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    border-radius:50%!important;
    font:700 10px/1 Arial,sans-serif!important;
    letter-spacing:0!important;
  }
  .quick-start-page.quick-paged-mode .quick-copy h2,
  .quick-start-page.quick-paged-mode .quick-finish h2{
    margin:7px 0 14px!important;
    font-size:clamp(28px,8.3vw,34px)!important;
    line-height:1!important;
  }
  .quick-start-page.quick-paged-mode .quick-copy p,
  .quick-start-page.quick-paged-mode .quick-finish p{
    font-size:14.5px!important;
    line-height:1.55!important;
  }
  .quick-start-page.quick-paged-mode .quick-visual,
  .quick-start-page.quick-paged-mode .anatomy-layout,
  .quick-start-page.quick-paged-mode .attack-stage,
  .quick-start-page.quick-paged-mode .status-stage,
  .quick-start-page.quick-paged-mode .cardtype-switcher{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    margin-inline:auto!important;
    padding:0!important;
    overflow:hidden!important;
    box-sizing:border-box!important;
  }
  .quick-start-page.quick-paged-mode #setup .ks-setup-stage-v9{
    --card-w:min(24vw,82px)!important;
    --gap:6px!important;
    width:max-content!important;
    max-width:100%!important;
    margin:0 auto!important;
    grid-template-columns:repeat(3,var(--card-w))!important;
    gap:16px var(--gap)!important;
  }
  .quick-start-page.quick-paged-mode .single-card-stage .quick-card{
    width:min(58vw,220px)!important;
    max-width:220px!important;
    margin:0 auto!important;
  }
  .quick-start-page.quick-paged-mode .turn-explorer,
  .quick-start-page.quick-paged-mode .turn-tabs,
  .quick-start-page.quick-paged-mode .turn-readout{width:100%!important;max-width:100%!important;min-width:0!important}
  .quick-start-page.quick-paged-mode .turn-tabs{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    overflow:visible!important;
  }
  .quick-start-page.quick-paged-mode .turn-tabs button{
    width:100%!important;
    min-width:0!important;
    padding:9px 5px!important;
    font-size:9px!important;
  }
  .quick-start-page.quick-paged-mode .anatomy-board-v4{
    width:100%!important;
    max-width:320px!important;
    margin:0 auto!important;
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:14px!important;
  }
  .quick-start-page.quick-paged-mode .anatomy-card-v4{
    width:min(100%,250px)!important;
    max-width:250px!important;
    margin:0 auto!important;
    padding:6px!important;
  }
  .quick-start-page.quick-paged-mode .anatomy-key-v4{
    width:100%!important;
    grid-template-columns:1fr 1fr!important;
    gap:5px 7px!important;
  }
  .quick-start-page.quick-paged-mode .attack-sim-v6{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    margin:0!important;
    padding:8px!important;
    overflow:hidden!important;
  }
  .quick-start-page.quick-paged-mode .status-stage{min-height:300px!important}
  .quick-start-page.quick-paged-mode .status-card{width:min(64vw,220px)!important;max-width:220px!important}
  .quick-start-page.quick-paged-mode .status-buttons{
    display:grid!important;
    grid-template-columns:1fr 1fr!important;
    gap:7px!important;
  }
  .quick-start-page.quick-paged-mode .cardtype-cards{
    display:grid!important;
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:6px!important;
  }
  .quick-start-page.quick-paged-mode .type-card{min-width:0!important;padding:0!important}
  .quick-start-page.quick-paged-mode .type-card b{font-size:9px!important;margin-top:7px!important}
  .quick-start-page.quick-paged-mode .cardtype-readout{padding:16px 0 0!important;min-height:0!important}
  .quick-start-page.quick-paged-mode .quick-page-controls{
    left:14px!important;
    right:14px!important;
    bottom:14px!important;
    height:48px!important;
  }
  .quick-start-page.quick-paged-mode .quick-page-arrow{
    width:44px!important;
    height:44px!important;
    bottom:0!important;
    border-radius:50%!important;
    font-size:22px!important;
    transform:none!important;
  }
}

@media (max-width:390px){
  .quick-start-page.quick-paged-mode .quick-reader-shell{padding-inline:10px!important}
  .quick-start-page.quick-paged-mode .quick-chapter.is-quick-page-active,
  .quick-start-page.quick-paged-mode .quick-finish.is-quick-page-active{padding-inline:14px!important}
  .quick-start-page.quick-paged-mode #setup .ks-setup-stage-v9{--card-w:min(23.5vw,78px)!important;--gap:5px!important}
}


/* === v294 definitive Quick Start mobile reader repair === */
@media (max-width:760px){
  /* The paged reader owns visibility. Legacy mobile chapter rules must never
     force another chapter back into the layout. */
  body.quick-start-page.quick-paged-mode .quick-content > .quick-chapter:not(.is-quick-page-active),
  body.quick-start-page.quick-paged-mode .quick-content > .quick-finish:not(.is-quick-page-active),
  body.quick-start-page.quick-paged-mode .quick-content > .quick-chapter[hidden],
  body.quick-start-page.quick-paged-mode .quick-content > .quick-finish[hidden],
  body.quick-start-page.quick-paged-mode #kravers.quick-chapter:not(.is-quick-page-active),
  body.quick-start-page.quick-paged-mode #kravers.quick-chapter[hidden]{
    display:none!important;
  }

  body.quick-start-page.quick-paged-mode .quick-main{
    width:100%!important;
    max-width:100%!important;
    padding:0!important;
    overflow-x:hidden!important;
  }
  body.quick-start-page.quick-paged-mode .quick-reader-shell{
    position:relative!important;
    width:100%!important;
    max-width:100%!important;
    margin:0 auto!important;
    padding:14px 12px 74px!important;
    box-sizing:border-box!important;
    overflow:visible!important;
  }
  body.quick-start-page.quick-paged-mode .quick-content{
    width:100%!important;
    max-width:100%!important;
    margin:0!important;
    padding:0!important;
    box-sizing:border-box!important;
  }

  body.quick-start-page.quick-paged-mode .quick-chapter.is-quick-page-active,
  body.quick-start-page.quick-paged-mode #kravers.quick-chapter.is-quick-page-active,
  body.quick-start-page.quick-paged-mode .quick-finish.is-quick-page-active{
    display:grid!important;
    grid-template-columns:minmax(0,1fr)!important;
    align-items:start!important;
    gap:18px!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    min-height:0!important;
    margin:0!important;
    padding:18px 15px 22px!important;
    overflow:hidden!important;
    border-radius:12px!important;
    box-sizing:border-box!important;
  }

  /* Every page follows the same reading order on a phone: progress, copy,
     then the interactive/visual material. */
  body.quick-start-page.quick-paged-mode .quick-page-meta{
    order:0!important;
    grid-column:1!important;
    display:flex!important;
    align-items:center!important;
    justify-content:flex-start!important;
    width:100%!important;
    min-width:0!important;
    margin:0!important;
    padding:0 0 10px!important;
    gap:8px!important;
    font-size:8px!important;
    line-height:1.2!important;
  }
  body.quick-start-page.quick-paged-mode .quick-page-title{
    min-width:0!important;
    max-width:calc(100% - 58px)!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
  }
  body.quick-start-page.quick-paged-mode .quick-copy,
  body.quick-start-page.quick-paged-mode .quick-copy-full{
    order:1!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    margin:0!important;
  }
  body.quick-start-page.quick-paged-mode .quick-visual,
  body.quick-start-page.quick-paged-mode .turn-explorer,
  body.quick-start-page.quick-paged-mode .anatomy-layout,
  body.quick-start-page.quick-paged-mode .attack-stage,
  body.quick-start-page.quick-paged-mode .status-stage,
  body.quick-start-page.quick-paged-mode .cardtype-switcher{
    order:2!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    margin:0 auto!important;
    box-sizing:border-box!important;
  }

  body.quick-start-page.quick-paged-mode .quick-num{
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    width:32px!important;
    height:32px!important;
    margin:0 0 10px!important;
    padding:0!important;
    border-radius:50%!important;
    font:700 10px/1 Arial,sans-serif!important;
    letter-spacing:0!important;
  }
  body.quick-start-page.quick-paged-mode .quick-copy h2,
  body.quick-start-page.quick-paged-mode .quick-finish h2{
    max-width:100%!important;
    margin:6px 0 12px!important;
    font-size:clamp(27px,8vw,33px)!important;
    line-height:1!important;
    overflow-wrap:normal!important;
    word-break:normal!important;
  }
  body.quick-start-page.quick-paged-mode .quick-copy p,
  body.quick-start-page.quick-paged-mode .quick-finish p{
    max-width:100%!important;
    margin-top:0!important;
    font-size:14px!important;
    line-height:1.55!important;
  }

  /* Page 1: keep the complete battlefield diagram inside the card. */
  body.quick-start-page.quick-paged-mode #setup .quick-visual{
    padding:10px 4px!important;
    overflow:hidden!important;
  }
  body.quick-start-page.quick-paged-mode #setup .ks-setup-stage-v9{
    --card-w:min(23.5vw,78px)!important;
    --gap:5px!important;
    width:max-content!important;
    max-width:100%!important;
    margin:0 auto!important;
    grid-template-columns:repeat(3,var(--card-w))!important;
    gap:14px var(--gap)!important;
  }

  /* Page 2 */
  body.quick-start-page.quick-paged-mode .single-card-stage{
    padding:8px 0!important;
    overflow:visible!important;
  }
  body.quick-start-page.quick-paged-mode .single-card-stage .quick-card{
    width:min(58vw,210px)!important;
    max-width:210px!important;
    margin:0 auto!important;
  }

  /* Page 3 */
  body.quick-start-page.quick-paged-mode #turn .turn-explorer-v265{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:12px!important;
  }
  body.quick-start-page.quick-paged-mode #turn .turn-sequence-v265{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    width:100%!important;
    min-width:0!important;
    overflow:visible!important;
  }
  body.quick-start-page.quick-paged-mode #turn .turn-sequence-v265 button{
    min-width:0!important;
    width:100%!important;
    min-height:42px!important;
    padding:8px 5px!important;
  }
  body.quick-start-page.quick-paged-mode #turn .turn-readout{
    width:100%!important;
    min-width:0!important;
    min-height:0!important;
    padding:15px!important;
    box-sizing:border-box!important;
  }

  /* Page 4: use the compact card + key anatomy, never the old 600px pan layout. */
  body.quick-start-page.quick-paged-mode #kravers .anatomy-fixed-stage{
    width:100%!important;
    max-width:100%!important;
    min-height:0!important;
    padding:0!important;
    overflow:visible!important;
  }
  body.quick-start-page.quick-paged-mode #kravers .anatomy-board-v4{
    display:grid!important;
    grid-template-columns:minmax(0,1fr)!important;
    gap:12px!important;
    width:100%!important;
    max-width:300px!important;
    margin:0 auto!important;
  }
  body.quick-start-page.quick-paged-mode #kravers .anatomy-card-v4{
    width:min(100%,225px)!important;
    max-width:225px!important;
    margin:0 auto!important;
    padding:4px!important;
  }
  body.quick-start-page.quick-paged-mode #kravers .anatomy-key-v4{
    display:grid!important;
    grid-template-columns:1fr 1fr!important;
    gap:5px 7px!important;
    width:100%!important;
    margin:0!important;
    padding:0!important;
  }

  /* Page 5: preserve the simulation but contain its battlefield. */
  body.quick-start-page.quick-paged-mode #attack .attack-stage,
  body.quick-start-page.quick-paged-mode #attack .attack-sim-v6{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    margin:0!important;
    box-sizing:border-box!important;
    overflow:hidden!important;
  }
  body.quick-start-page.quick-paged-mode #attack .attack-sim-v6{padding:7px!important}
  body.quick-start-page.quick-paged-mode #attack .attack-explain-v6{padding-inline:7px!important}
  body.quick-start-page.quick-paged-mode #attack .attack-play{width:100%!important;min-height:42px!important}

  /* Page 6 */
  body.quick-start-page.quick-paged-mode #statuses .status-stage{
    min-height:290px!important;
    padding:8px 0!important;
    overflow:visible!important;
  }
  body.quick-start-page.quick-paged-mode #statuses .status-card{
    width:min(60vw,205px)!important;
    max-width:205px!important;
  }
  body.quick-start-page.quick-paged-mode #statuses .status-buttons{
    display:grid!important;
    grid-template-columns:1fr 1fr!important;
    gap:7px!important;
  }

  /* Page 7 */
  body.quick-start-page.quick-paged-mode #cards .cardtype-switcher{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:14px!important;
  }
  body.quick-start-page.quick-paged-mode #cards .cardtype-cards{
    display:grid!important;
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:5px!important;
    width:100%!important;
  }
  body.quick-start-page.quick-paged-mode #cards .type-card{
    min-width:0!important;
    width:100%!important;
    padding:0!important;
  }
  body.quick-start-page.quick-paged-mode #cards .type-card b{font-size:9px!important}
  body.quick-start-page.quick-paged-mode #cards .cardtype-readout{
    width:100%!important;
    min-width:0!important;
    min-height:0!important;
    padding:14px 0 0!important;
    border-left:0!important;
    border-top:1px solid rgba(255,255,255,.1)!important;
  }

  /* Page 8 */
  body.quick-start-page.quick-paged-mode .quick-finish.is-quick-page-active > div{
    min-width:0!important;
    max-width:100%!important;
  }
  body.quick-start-page.quick-paged-mode .quick-finish-actions{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:10px!important;
    width:100%!important;
    align-items:stretch!important;
  }
  body.quick-start-page.quick-paged-mode .quick-finish-actions .btn{
    width:100%!important;
    justify-content:center!important;
    box-sizing:border-box!important;
  }

  /* Navigation belongs below the active page and never overlaps its content. */
  body.quick-start-page.quick-paged-mode .quick-page-controls{
    position:absolute!important;
    top:auto!important;
    left:12px!important;
    right:12px!important;
    bottom:14px!important;
    height:44px!important;
    pointer-events:none!important;
  }
  body.quick-start-page.quick-paged-mode .quick-page-arrow{
    position:absolute!important;
    top:auto!important;
    bottom:0!important;
    width:44px!important;
    height:44px!important;
    display:grid!important;
    place-items:center!important;
    border-radius:50%!important;
    font-size:22px!important;
    transform:none!important;
    pointer-events:auto!important;
  }
  body.quick-start-page.quick-paged-mode .quick-page-prev{left:0!important}
  body.quick-start-page.quick-paged-mode .quick-page-next{right:0!important}
  body.quick-start-page.quick-paged-mode .quick-page-arrow[hidden]{display:none!important}
}

@media (max-width:390px){
  body.quick-start-page.quick-paged-mode .quick-reader-shell{padding-inline:9px!important}
  body.quick-start-page.quick-paged-mode .quick-chapter.is-quick-page-active,
  body.quick-start-page.quick-paged-mode #kravers.quick-chapter.is-quick-page-active,
  body.quick-start-page.quick-paged-mode .quick-finish.is-quick-page-active{padding-inline:13px!important}
  body.quick-start-page.quick-paged-mode #setup .ks-setup-stage-v9{
    --card-w:min(23vw,72px)!important;
    --gap:4px!important;
  }
}

/* v298 - Mobile Sets index titles: keep every set name on one line */
@media (max-width: 620px){
  .sets-page .set-index-copy h2{
    font-size:clamp(16px,4.8vw,19px)!important;
    line-height:1.04!important;
    letter-spacing:-.025em!important;
    white-space:nowrap!important;
    text-wrap:nowrap!important;
    overflow-wrap:normal!important;
    word-break:normal!important;
    margin-bottom:6px!important;
  }
}


/* v316 — mobile footer credit/copyright order */
@media(max-width:620px){
  .site-footer-inner{
    grid-template-areas:"nav" "socials" "credit" "copy"!important;
  }
}


/* v317 — force mobile footer order: nav, socials, creator credit, copyright */
@media(max-width:620px){
  .site-footer-inner{
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:center!important;
  }
  .site-footer-nav{order:1!important;}
  .site-footer-socials{order:2!important;}
  .site-footer-credit{order:3!important;}
  .site-footer-copy{order:4!important;}
}
