/* Rules card after a skipped how-to-play, the session close's way out, the bot-game lobby note, the build id. */
.rules-card{max-width:1500px;margin:0 auto}.rules-card h1{margin:6px 0 18px;font-size:clamp(36px,3.6vw,64px)}
.rules-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;margin:22px 0 0}
.rules-list>div{padding:20px 24px;border:1px solid #38626d;border-left:4px solid #35d4ed;border-radius:10px;background:#0c2838}
.rules-list dt{font-size:13px;font-weight:800;letter-spacing:2px;text-transform:uppercase;color:#35d4ed}
.rules-list dd{margin:8px 0 0;font-size:clamp(18px,1.6vw,30px);line-height:1.35}
.campaign-next{display:flex;align-items:center;gap:18px;margin:26px 0 0}.campaign-next button{font-size:clamp(18px,1.5vw,26px);padding:14px 30px}.campaign-next small{color:#9cb5c2;font-size:14px}
.bot-note{align-items:center}.bot-note h2{margin:6px 0 10px}
.build-id{font-size:10px;letter-spacing:1px;color:#5f7f8e;font-family:ui-monospace,Consolas,monospace}
/* "Keep sound off" stays readable over the intro art; the sound control keeps clear of the lobby headline. */
#sound-keep-off{padding:6px 14px;border-radius:8px;background:#071d2bdd;color:#e6f3f8}
@media (max-width:700px){.rules-list{grid-template-columns:1fr}.campaign-next{flex-direction:column;align-items:start}}
/* Live play on a TV: one Silas card, and the readiness board fills the room's view instead of leaving half empty. */
@media (min-width:1100px) and (min-height:600px){
  .public-crews:has(>.public-crew:only-child){grid-template-columns:minmax(0,1fr)}
  .public-crews:has(>.public-crew:nth-child(2):last-child){grid-template-columns:repeat(2,minmax(0,1fr))}
  .public-crew{padding:16px 24px}.public-crew h2{font-size:clamp(26px,2vw,38px)}
  .public-seat{min-height:clamp(44px,6vh,76px)}
  .public-seat strong{font-size:clamp(16px,1.35vw,26px)}
  .public-seat>div>span{font-size:clamp(14px,1.1vw,21px)}
  .readiness-label{font-size:clamp(14px,1.15vw,22px);font-weight:700}
  .public-board-heading p{font-size:clamp(13px,1vw,18px)}
}
/* Island map on a 1920x1080 TV: the map, Silas and the standings fit on one screen. The map sits beside Silas and
   its empty water below the island is trimmed (the overlays keep the image's own coordinates). */
@media (min-width:1100px) and (orientation:landscape){
  /* Playtest 2: the whole map image (no trimmed water) and a slimmer side column, so the map fills the height and no
     empty band is left under it at 1080p; the height cap keeps shorter screens on one page. */
  .island-hub{grid-template-columns:minmax(0,1fr) minmax(340px,24vw);align-items:start;column-gap:28px;row-gap:12px}
  .island-head{grid-column:1/-1}
  .island-frame{width:min(100%,calc((100vh - 290px) * 1672 / 941));aspect-ratio:1672/941;overflow:hidden;border-radius:14px;margin:0}
  .island-foot{align-content:start}
  .island-foot .phase-guide{flex-direction:column;align-items:flex-start;min-height:0}
  .island-foot .phase-guide p{font-size:clamp(18px,1.4vw,26px)}
  .island-foot .phase-guide .avatar-portrait{width:clamp(90px,7vw,130px);height:clamp(90px,7vw,130px)}
}
/* "Back to the island" on small or portrait screens: a compact corner button that never covers the status line,
   and the page leaves room under it. */
@media (max-width:1100px),(max-height:500px){
  .hub-back{top:auto;bottom:10px;left:10px;transform:none;padding:6px 12px;font-size:13px;opacity:.92}
  body:has(#back-to-island) main{padding-bottom:64px}
}

/* District results (no overall winner, Kevin 2026-11-07): one ranked list per district, side by side on a TV. */
.district-results-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:18px;margin:14px 0 6px}
.district-results{border:1px solid #315a70;border-radius:10px;padding:12px 18px;background:#0a2739}
.district-results h3{margin:0 0 8px;font-size:clamp(18px,1.4vw,26px);color:var(--cyan)}
.district-results ol{list-style:none;margin:0;padding:0}
.district-results li{display:flex;align-items:center;gap:10px;padding:7px 0;border-top:1px solid #23465a;font-size:clamp(15px,1.15vw,21px)}
.district-results li:first-child{border-top:0}
.district-results .place{min-width:3ch;color:#9fc1d1}
.district-results li b{margin-left:auto;font-weight:normal;color:#e3f3f8;white-space:nowrap}
.island-foot .district-results-grid{grid-template-columns:1fr;gap:10px}
.island-foot .district-results li{font-size:15px;padding:4px 0}
