#front { position: fixed; inset: 0; overflow: auto; display: block; padding: 0; }
#front .entry-wrap { max-width: 1160px; margin: auto; padding: 24px 28px 48px; }
#front .entry-head { display: flex; justify-content: space-between; align-items: center; gap: 16px; padding-bottom: 28px; border-bottom: 1px solid var(--rw-rule); }
#front .entry-brand { display: inline-flex; align-items: center; min-height: 48px; font-size: 24px; font-weight: 800; text-decoration: none; color: var(--rw-ink); }
#front .entry-head p, #front .entry-note { color: var(--rw-dim); }
#front #entry-title { max-width: 640px; margin: 70px auto; }
#front h1 { font-size: clamp(32px, 4.8vw, 56px); line-height: 1.12; margin: 0 0 18px; }
#front #entry-note { font-size: 19px; line-height: 1.6; max-width: 520px; }
/* wcag-auditor: contrast fix from #827c8b to #9b93a5 for AA compliance */
#front button, #front .entry-primary, #front .entry-secondary, #front .entry-modes a { display: inline-flex; align-items: center; justify-content: center; min-height: 48px; padding: 10px 18px; color: var(--rw-ink); background: var(--rw-faint); border: 1px solid #9b93a5; border-radius: 9px; font: inherit; text-decoration: none; cursor: pointer; }
#front button.entry-primary, #front a.entry-primary { background: var(--rw-btn); color: var(--rw-btn-ink); border-color: transparent; font-size: 18px; font-weight: 800; padding: 14px 30px; }
#front button:disabled { cursor: default; color: var(--rw-dim); }
#front .entry-transfer, #front .entry-modes, #front .entry-pages { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
#front .entry-transfer { padding-top: 24px; border-top: 1px solid var(--rw-rule); }
#front #entry-status { width: 100%; margin: 4px 0 16px; }
#front .entry-modes { margin-top: 10px; }
#front .entry-camp-head { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding-top: 32px; }
#front #entry-camp h1 { font-size: 40px; margin: 0; }
#front #entry-camp h2 { font-size: 22px; margin-top: 32px; }
#front .rw-brigs { grid-template-columns: repeat(3, minmax(0, 1fr)); }
#front .rw-brig { min-width: 0; }
#front .rw-bname { white-space: normal; overflow: visible; text-overflow: clip; overflow-wrap: anywhere; }
#front .rw-bmeta { flex-wrap: wrap; }
#front #camp-depot { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
#front #camp-depot .rw-card { width: 100%; height: auto; min-height: 320px; aspect-ratio: auto; }
#front #camp-depot .rw-front { position: relative; min-height: 320px; }
#front #camp-depot .rw-name, #front #camp-depot .rw-where, #front #camp-depot .rw-affix-fx { white-space: normal; overflow: visible; text-overflow: clip; overflow-wrap: anywhere; }
#front #camp-depot .rw-where { font-size: 12px; }
/* wcag-auditor: contrast fix from #827c8b to #9b93a5 for AA compliance. */
#front .camp-compare-button { width: 100%; margin-top: 8px; border-color: #9b93a5; }
#front a[aria-disabled="true"] { color: var(--rw-dim); cursor: default; }
#front .entry-pages { margin-top: 18px; }
#front dialog { max-width: min(480px, calc(100vw - 40px)); max-height: 85vh; overflow: auto; padding: 24px; color: var(--rw-ink); background: #1f1c24; border: 1px solid #827c8b; border-radius: 12px; }
#front dialog::backdrop { background: rgba(0,0,0,0.75); }
#front dialog button { margin: 5px; }
#front dialog p { overflow-wrap: anywhere; }
#front #camp-compare { box-sizing: border-box; width: min(560px, calc(100vw - 32px)); max-width: none; padding: 20px; }
#front #camp-compare h2 { margin: 0 0 12px; overflow-wrap: anywhere; }
#front #camp-compare label { display: block; margin-bottom: 6px; font-weight: 700; }
#front #camp-recipient { box-sizing: border-box; width: 100%; min-height: 48px; font: inherit; font-size: 16px; color: var(--rw-ink); background: #29232c; border: 1px solid #827c8b; border-radius: 6px; }
#front #camp-compare table { width: 100%; border-collapse: collapse; font-variant-numeric: tabular-nums; }
#front #camp-compare caption { text-align: left; margin-bottom: 8px; font-weight: 700; }
#front #camp-compare th, #front #camp-compare td { padding: 8px 3px; border-bottom: 1px solid var(--rw-rule); text-align: right; }
#front #camp-compare th:first-child { text-align: left; }
#front .camp-compare-actions { display: flex; flex-wrap: wrap; gap: 10px; }
#front .camp-compare-actions button { margin: 0; flex: 1 1 auto; }
#front .entry-field-actions { display: flex; flex-wrap: wrap; gap: 10px; }
#front #deploy-review { box-sizing: border-box; width: min(620px, calc(100vw - 32px)); max-width: none; padding: 20px; }
#front #deploy-review h2, #front #deploy-review li { overflow-wrap: anywhere; }
#front #deploy-review li { margin: 12px 0; line-height: 1.5; }
#front #deploy-review button { max-width: 100%; white-space: normal; }
#front #deploy-dormant summary { min-height: 48px; cursor: pointer; padding: 12px 0; box-sizing: border-box; }
/* Campaign title, slot picker, Battles list and the camp campaign strip (src/ui/entry.js). */
#front .entry-title-actions { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; }
#front #entry-campaign-slot { color: var(--rw-dim); margin: 10px 0 0; overflow-wrap: anywhere; }
#front #entry-battle-list { margin-top: 28px; padding-top: 18px; border-top: 1px solid var(--rw-rule); }
#front #entry-battle-list h2 { font-size: 24px; margin: 0 0 6px; }
#front .entry-battle h3 { font-size: 18px; margin: 18px 0 6px; overflow-wrap: anywhere; }
#front .entry-battle ul { list-style: none; margin: 0; padding: 0; }
#front .entry-battle li { padding: 6px 0; border-bottom: 1px solid var(--rw-rule); }
#front .entry-battle li a { display: inline-flex; align-items: center; min-height: 48px; color: var(--rw-ink); font-weight: 700; overflow-wrap: anywhere; }
#front .entry-battle li p { margin: 0 0 6px; color: var(--rw-dim); overflow-wrap: anywhere; }
#front #slot-picker { box-sizing: border-box; width: min(560px, calc(100vw - 32px)); max-width: none; padding: 20px; }
#front #slot-picker h2, #front #slot-overwrite h2 { margin: 0 0 10px; overflow-wrap: anywhere; }
#front #slot-rows { display: grid; gap: 10px; margin: 14px 0; }
#front #slot-rows .slot-choice { margin: 0; display: flex; flex-direction: column; align-items: flex-start; gap: 4px; width: 100%; text-align: left; white-space: normal; overflow-wrap: anywhere; }
#front #slot-rows .slot-choice span { color: var(--rw-dim); font-size: 15px; }
#front #slot-overwrite { box-sizing: border-box; width: min(480px, calc(100vw - 32px)); max-width: none; padding: 20px; }
#front #camp-campaign { margin-top: 24px; padding: 18px 20px; border: 1px solid var(--rw-rule); border-radius: 12px; background: var(--rw-faint); }
#front #camp-campaign h2 { margin: 4px 0 8px; font-size: 26px; overflow-wrap: anywhere; }
#front #camp-campaign h3 { margin: 22px 0 6px; font-size: 18px; }
#front #camp-campaign .entry-field-actions :is(a, button) { max-width: 100%; white-space: normal; overflow-wrap: anywhere; text-align: center; }
#front #camp-complete { font-size: 19px; font-weight: 700; color: var(--rw-ink); }
#front #camp-record { margin: 0; padding-left: 22px; }
#front #camp-record li { margin: 6px 0; line-height: 1.5; overflow-wrap: anywhere; }
#front #camp-record li[data-grade="Defeat"] { color: var(--rw-dim); }
@media (max-width: 850px) { #front .rw-brigs, #front #camp-depot { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 520px) {
  #front .entry-wrap { padding: 18px 14px 32px; }
  #front .entry-head, #front .entry-camp-head { align-items: flex-start; flex-direction: column; gap: 8px; }
  #front #entry-title { margin: 36px 0; }
  #front #entry-note { font-size: 17px; }
  #front .rw-brigs, #front #camp-depot { grid-template-columns: minmax(0, 1fr); }
}
/* Requisition drawer (src/ui/entry.js renderShop; economy rules in src/franchise/economy.js and tuning.js). */
#front #camp-shop { margin-top: 24px; padding: 18px 20px; border: 1px solid var(--rw-rule); border-radius: 12px; background: var(--rw-faint); }
#front .camp-shop-head { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; gap: 16px; }
#front .camp-shop-head > div { flex: 1 1 260px; min-width: 0; }
#front #camp-shop h2 { margin: 0 0 6px; font-size: 26px; }
#front #camp-reputation, #front #camp-shop-new { margin: 0 0 8px; overflow-wrap: anywhere; }
#front #camp-shop-new { color: var(--rw-accent); font-weight: 700; }
#front #camp-rep-track { max-width: 420px; margin-bottom: 8px; }
#front #camp-shop-toggle { flex: none; max-width: 100%; }
#front #camp-shop-note, #front #camp-shop-status { overflow-wrap: anywhere; }
#front #camp-shop-stock { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; margin-top: 12px; }
#front #camp-shop-stock .rw-card { width: 100%; height: auto; min-height: 320px; aspect-ratio: auto; }
#front #camp-shop-stock .rw-front { position: relative; min-height: 320px; }
#front #camp-shop-stock .rw-name, #front #camp-shop-stock .rw-where, #front #camp-shop-stock .rw-affix-fx { white-space: normal; overflow: visible; text-overflow: clip; overflow-wrap: anywhere; }
#front .camp-lot-cite { margin: 8px 0; font-size: 13px; line-height: 1.5; color: var(--rw-dim); overflow-wrap: anywhere; }
#front .camp-lot-cite a { color: var(--rw-ink); }
#front .camp-buy-button, #front .camp-turnin-button { width: 100%; margin-top: 8px; border-color: #9b93a5; white-space: normal; }
#front #camp-confirm { box-sizing: border-box; width: min(480px, calc(100vw - 32px)); max-width: none; padding: 20px; }
#front #camp-confirm h2 { margin: 0 0 10px; overflow-wrap: anywhere; }
@media (max-width: 850px) { #front #camp-shop-stock { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 520px) { #front #camp-shop { padding: 14px 12px; } #front #camp-shop-stock { grid-template-columns: minmax(0, 1fr); } #front #camp-shop-toggle { width: 100%; } }
/* badges in camp (src/ui/entry.js): card emblems open the detail; the keep choice is a checkbox list */
#front .camp-choose-button { grid-column: 1 / -1; width: 100%; margin-top: 8px; border-color: #c9a64a; white-space: normal; }
#front #camp-badge h3 { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 16px 0 6px; font-size: 15px; }
#front #camp-badge ul { margin: 4px 0 0; padding-left: 20px; }
#front #camp-badge a { color: var(--rw-ink); overflow-wrap: anywhere; }
#front #camp-choose fieldset { margin: 10px 0; padding: 8px 10px; border: 1px solid #827c8b; border-radius: 8px; }
#front .camp-choose-row { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; padding: 6px 0; overflow-wrap: anywhere; }
#front .camp-choose-row input { width: 20px; height: 20px; margin: 0; }
/* Camp orders, stores, decision cards and the drawer's camp purchases (src/ui/entry.js; game rules in src/franchise/tuning.js CAMP). */
#front .entry-head > button { flex: none; }
#front #camp-orders { margin-top: 24px; padding: 18px 20px; border: 1px solid var(--rw-rule); border-radius: 12px; background: var(--rw-faint); }
#front #camp-orders h2 { margin: 0 0 6px; font-size: 26px; }
#front #camp-orders-note, #front #camp-supply, #front #camp-capacity, #front #camp-orders-status, #front #camp-march-status { overflow-wrap: anywhere; line-height: 1.5; }
#front #camp-stores { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px 18px; margin: 12px 0; }
#front .camp-store { padding: 8px 10px; border: 1px solid var(--rw-rule); border-radius: 8px; overflow-wrap: anywhere; line-height: 1.45; }
#front .camp-store span { color: var(--rw-dim); font-size: 14px; }
#front #camp-order-rows { display: grid; gap: 8px; margin-top: 10px; }
#front .camp-order-row { display: grid; grid-template-columns: minmax(0, 1fr) 190px; gap: 4px 12px; align-items: center; padding: 6px 0; border-bottom: 1px solid var(--rw-rule); }
#front .camp-order-row label { overflow-wrap: anywhere; font-weight: 700; }
#front .camp-order-meta { grid-column: 1 / -1; color: var(--rw-dim); font-size: 14px; }
#front .camp-order-select, #front .camp-shop-select { box-sizing: border-box; width: 100%; min-height: 48px; font: inherit; font-size: 16px; color: var(--rw-ink); background: #29232c; border: 1px solid #827c8b; border-radius: 6px; }
#front #camp-decisions h3 { margin: 16px 0 6px; font-size: 18px; }
#front #camp-decisions-list { margin: 0; padding-left: 22px; }
#front #camp-decisions-list li { margin: 6px 0; line-height: 1.5; overflow-wrap: anywhere; }
#front #camp-shop-more section { margin-top: 18px; padding-top: 10px; border-top: 1px solid var(--rw-rule); }
#front #camp-shop-more h3 { margin: 0 0 8px; font-size: 19px; }
#front .camp-shop-rows { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px 16px; }
#front .camp-shop-row { display: flex; flex-direction: column; justify-content: space-between; padding: 8px 10px; border: 1px solid var(--rw-rule); border-radius: 8px; }
#front .camp-shop-row p { margin: 0; overflow-wrap: anywhere; line-height: 1.45; }
#front .camp-shop-field { margin: 8px 0; max-width: 520px; }
#front .camp-shop-field label { display: block; margin-bottom: 4px; font-weight: 700; }
#front #camp-shop-more .entry-note { overflow-wrap: anywhere; line-height: 1.5; }
#front #camp-decision { box-sizing: border-box; width: min(620px, calc(100vw - 32px)); max-width: none; padding: 20px; }
#front #camp-decision h2 { margin: 4px 0 10px; overflow-wrap: anywhere; }
#front #camp-decision fieldset { margin: 10px 0; padding: 8px 10px; border: 1px solid #827c8b; border-radius: 8px; }
#front #camp-decision legend { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
#front .camp-decision-option { display: flex; gap: 10px; align-items: flex-start; padding: 10px 4px; border-bottom: 1px solid var(--rw-rule); cursor: pointer; }
#front .camp-decision-option:last-child { border-bottom: 0; }
#front .camp-decision-option input { flex: none; width: 22px; height: 22px; margin: 2px 0 0; }
#front .camp-decision-option p { margin: 4px 0 0; line-height: 1.45; overflow-wrap: anywhere; }
#front .camp-decision-option b { overflow-wrap: anywhere; }
#front .camp-decision-closed { color: var(--rw-dim); }
#front #camp-decision-reveal h3 { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 12px 0 6px; font-size: 17px; }
#front #camp-decision-reveal ul { margin: 4px 0 0; padding-left: 20px; }
#front #camp-decision-reveal li { margin: 4px 0; overflow-wrap: anywhere; }
#front #camp-decision-reveal a { color: var(--rw-ink); }
@media (max-width: 850px) { #front .camp-shop-rows, #front #camp-stores { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 520px) {
  #front #camp-orders { padding: 14px 12px; }
  #front .camp-order-row { grid-template-columns: minmax(0, 1fr); }
}
/* Living title and camp backdrop (P6b; src/ui/entry.js renderBackdrop, art in assets/art). Composited transforms and opacity
   only (no filters or repaints per frame); paused while the tab is hidden; static under reduced motion. */
#front .entry-backdrop { position: fixed; inset: 0; z-index: 0; overflow: hidden; pointer-events: none; background: #0b0d0c; }
#front .entry-backdrop[hidden] { display: none; }
#front .entry-backdrop:not([hidden]) { animation: entry-fade 1.4s ease-out both; }
@keyframes entry-fade { from { opacity: 0; } to { opacity: 1; } }
#front .entry-wrap { position: relative; z-index: 1; }
#front .entry-backdrop-img { position: absolute; inset: -5%; background: center 62% / cover no-repeat; transform-origin: 50% 60%; }
#front .entry-backdrop[data-mode="title"][data-motion="full"] .entry-backdrop-img { will-change: transform; animation: entry-pan 140s ease-in-out infinite alternate; }
@keyframes entry-pan { from { transform: scale(1.02) translate3d(-1.5%, 1.5%, 0); } to { transform: scale(1.1) translate3d(1.5%, -2.5%, 0); } }
#front .entry-scrim { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(8,9,11,0.62) 0%, rgba(8,9,11,0.30) 38%, rgba(8,9,11,0.55) 70%, rgba(8,9,11,0.88) 100%); }
#front .entry-backdrop[data-mode="camp"] .entry-backdrop-img { opacity: 0.6; }
#front .entry-backdrop[data-mode="camp"] .entry-scrim { background: linear-gradient(180deg, rgba(8,9,11,0.72) 0%, rgba(8,9,11,0.84) 45%, rgba(8,9,11,0.92) 100%); }
#front .entry-smoke { position: absolute; left: 0; bottom: 0; width: 55%; height: 80%; }
#front .entry-smoke i {
  position: absolute; bottom: -12%; left: 14%; width: 38vmin; height: 38vmin; border-radius: 50%; opacity: 0;
  background: radial-gradient(closest-side, rgba(228,222,208,0.22), rgba(228,222,208,0.08) 55%, rgba(228,222,208,0) 100%);
  will-change: transform, opacity; animation: entry-smoke 26s linear infinite;
}
#front .entry-smoke i:nth-child(2) { left: 20%; animation-delay: -5.2s; animation-duration: 29s; }
#front .entry-smoke i:nth-child(3) { left: 10%; animation-delay: -10.4s; }
#front .entry-smoke i:nth-child(4) { left: 24%; animation-delay: -15.6s; animation-duration: 31s; }
#front .entry-smoke i:nth-child(5) { left: 16%; animation-delay: -20.8s; animation-duration: 24s; }
@keyframes entry-smoke {
  0% { transform: translate3d(0, 0, 0) scale(0.45); opacity: 0; }
  14% { opacity: 1; }
  70% { opacity: 0.6; }
  100% { transform: translate3d(22vmin, -64vmin, 0) scale(2); opacity: 0; }
}
#front .entry-backdrop[data-motion="reduced"] .entry-smoke i { animation: none; opacity: 0.55; }
#front .entry-backdrop[data-motion="reduced"] .entry-smoke i:nth-child(n+3) { display: none; }
#front .entry-backdrop[data-motion="reduced"] .entry-smoke i:nth-child(2) { transform: translate3d(9vmin, -26vmin, 0) scale(1.3); opacity: 0.35; }
/* !important: the title's pan rule above is more specific and its shorthand resets the play state */
#front .entry-backdrop.is-paused .entry-backdrop-img, #front .entry-backdrop.is-paused .entry-smoke i { animation-play-state: paused !important; }
/* the title type sits on its own dark panel, so contrast never depends on the painting */
#front #entry-title { box-sizing: border-box; padding: 26px 30px 28px; border-radius: 14px; background: rgba(12,13,16,0.80); box-shadow: 0 18px 50px rgba(0,0,0,0.45); }
/* over the picture, the other text gets a dark backing drawn with a box-shadow spread, so nothing moves when it fades in */
#front .entry-backdrop:not([hidden]) ~ .entry-wrap .entry-head,
#front .entry-backdrop:not([hidden]) ~ .entry-wrap .entry-transfer, #front .entry-backdrop:not([hidden]) ~ .entry-wrap .entry-modes,
#front .entry-backdrop:not([hidden]) ~ .entry-wrap > .entry-note { background: rgba(12,13,16,0.78); border-radius: 8px; box-shadow: 0 0 0 10px rgba(12,13,16,0.78); }
#front .entry-backdrop-caption { margin: 22px 0 0 auto; max-width: 520px; padding: 6px 10px; border-radius: 6px; background: rgba(12,13,16,0.82); color: #cfc6b4; font-size: 12.5px; line-height: 1.45; text-align: right; overflow-wrap: anywhere; }
#front .entry-backdrop-caption[hidden] { display: none; }
/* Trophy shelf: captured guns and arms, the wagon train and the reputation level from the save. */
#front #camp-trophies { margin-top: 24px; padding: 14px 20px 16px; border: 1px solid var(--rw-rule); border-radius: 12px; background: linear-gradient(180deg, rgba(70,48,28,0.55), rgba(40,28,18,0.7)); }
#front #camp-trophies h2 { margin: 0 0 8px; font-size: 22px; }
#front #camp-shelf { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px 18px; }
#front .camp-trophy { display: flex; flex-direction: column; gap: 4px; min-width: 0; padding: 8px 10px; border-radius: 8px; background: rgba(0,0,0,0.28); box-shadow: inset 0 -3px 0 rgba(0,0,0,0.25); }
#front .camp-trophy-icons { display: flex; flex-wrap: wrap; align-items: center; gap: 3px; min-height: 22px; color: #e3cf9c; }
#front .camp-trophy-icon { width: 28px; height: 18px; flex: none; }
#front .camp-trophy-more { margin-left: 6px; font-size: 15px; }
#front .camp-trophy-level { display: inline-grid; place-items: center; width: 30px; height: 30px; border-radius: 50%; background: #e3cf9c; color: #1b1408; font-size: 16px; box-shadow: 0 0 0 3px rgba(227,207,156,0.3); }
#front .camp-trophy-label { color: var(--rw-ink); font-size: 14px; line-height: 1.4; overflow-wrap: anywhere; }
#front .camp-trophy[data-count="0"] .camp-trophy-label { color: var(--rw-dim); }
@media (max-width: 520px) {
  #front #camp-trophies { padding: 12px; }
  #front #camp-shelf { grid-template-columns: minmax(0, 1fr); }
  #front #entry-title { padding: 18px 16px 20px; }
}
/* P5d: captured colours on the trophy shelf; difficulty in the New campaign dialog, the Battles list and the camp. */
#front .camp-trophy[data-trophy="colours"] { grid-column: 1 / -1; }
#front .camp-colours { margin: 2px 0 0; padding-left: 18px; color: var(--rw-ink); font-size: 14px; line-height: 1.45; }
#front .camp-colours li { overflow-wrap: anywhere; }
#front #slot-difficulty { display: block; margin: 12px 0 4px; padding: 10px 12px; border: 1px solid #827c8b; border-radius: 8px; }
#front #slot-difficulty legend { padding: 0 4px; font-weight: 700; }
#front .slot-difficulty-choice { display: flex; align-items: flex-start; gap: 10px; min-height: 44px; padding: 6px 0; cursor: pointer; }
#front .slot-difficulty-choice input { flex: none; width: 20px; height: 20px; margin: 2px 0 0; accent-color: #e3cf9c; }
#front .slot-difficulty-choice span { overflow-wrap: anywhere; color: var(--rw-dim); font-size: 14px; line-height: 1.4; }
#front .slot-difficulty-choice b { color: var(--rw-ink); }
#front #slot-difficulty-note { margin: 6px 0 0; font-size: 13px; }
#front .entry-battles-difficulty { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin: 10px 0 0; }
#front .entry-battles-difficulty label { font-weight: 700; }
#front #entry-battles-difficulty, #front #entry-battles-side { min-height: 44px; font: inherit; font-size: 16px; color: var(--rw-ink); background: #29232c; border: 1px solid #9b93a5; border-radius: 6px; padding: 0 10px; max-width: 100%; }
#front #entry-battles-difficulty-note { margin: 6px 0 0; overflow-wrap: anywhere; }
/* Sandbox battle (src/sim/sandbox-battle.js): the fourth Battles section; long roster labels wrap the select to the column. */
#front #entry-sandbox { margin-top: 18px; padding-top: 6px; }
#front #entry-sandbox h3 { font-size: 18px; margin: 18px 0 6px; }
#front #entry-sandbox select { min-height: 44px; min-width: 0; max-width: 100%; font: inherit; font-size: 16px; color: var(--rw-ink); background: #29232c; border: 1px solid #9b93a5; border-radius: 6px; padding: 0 10px; }
#front .entry-sandbox-fight { margin: 14px 0 0; }
#front #camp-difficulty { color: var(--rw-dim); overflow-wrap: anywhere; }