/* Salvage Sweep. Reads as the same command surface as Missions and Research --
 * teal signal on deep blue -- with the field itself as the one warm object. */

.sweep-hero { position: relative; overflow: hidden; padding: 56px 0 30px; background: linear-gradient(150deg, rgba(9,20,38,0.96), rgba(19,11,38,0.92)); border-bottom: 1px solid rgba(83,149,183,0.32); }
.sweep-hero-grid { position: absolute; inset: 0; background-image: linear-gradient(rgba(116,214,221,0.06) 1px, transparent 1px), linear-gradient(90deg, rgba(116,214,221,0.06) 1px, transparent 1px); background-size: 34px 34px; pointer-events: none; }
.sweep-hero-content { position: relative; }
.sweep-hero h1 { margin: 6px 0 10px; }
.sweep-hero p { max-width: 62ch; color: #b6cbd8; font-size: 0.86rem; line-height: 1.6; }
.sweep-main { padding: 26px 0 60px; }

/* The rails are fixed and the board takes the rest, so a wide screen widens
 * the thing being played rather than padding the margins. The page breaks out
 * of the site's 1180px container for the same reason -- three columns inside
 * it left the board narrower than the crew list under it. */
.sweep-main > .container { max-width: min(1720px, calc(100vw - 48px)); }
.sweep-layout { display: grid; grid-template-columns: 286px minmax(0, 1fr) 300px; gap: 20px; align-items: start; }
.sweep-rail { display: grid; gap: 14px; min-width: 0; }
.sweep-sidebar, .sweep-board-column { display: grid; gap: 14px; min-width: 0; }
.sweep-card { padding: 16px; border: 1px solid rgba(83,149,183,0.34); background: linear-gradient(150deg, rgba(11,24,43,0.9), rgba(17,11,34,0.9)); }
.sweep-card h2 { margin: 4px 0 10px; font-size: 1.02rem; }
.sweep-muted { color: #9db4c6; font-size: 0.74rem; line-height: 1.5; }
.sweep-back { display: block; padding: 11px 13px; border: 1px solid rgba(83,149,183,0.3); background: rgba(9,20,38,0.6); color: #cfe4ef; text-decoration: none; }
.sweep-back strong { display: block; margin-top: 3px; font: 600 0.8rem/1.2 'Cinzel', serif; }
.sweep-back:hover, .sweep-back:focus-visible { border-color: rgba(126,227,232,0.6); color: #f0fdff; }

.sweep-gate { padding: 34px; border: 1px solid rgba(83,149,183,0.34); background: rgba(11,24,43,0.8); text-align: center; }
.sweep-status { min-height: 1.4em; color: #8ddde1; font-size: 0.76rem; }
.sweep-status.is-error { color: #f0a8a0; }

.sweep-facts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7px; margin: 0 0 10px; }
.sweep-facts div { padding: 7px 8px; border: 1px solid rgba(103,152,190,0.24); background: rgba(6,15,28,0.5); }
.sweep-facts dt { color: #86a5ba; font: 700 0.52rem/1 'Jost', sans-serif; letter-spacing: 0.1em; text-transform: uppercase; }
.sweep-facts dd { margin: 4px 0 0; color: #eaf3f8; font: 600 0.82rem/1 'Cinzel', serif; }

/* One compact card per sector. These are personal records, not a public
 * leaderboard: changing sector deliberately gives the commander a fresh set
 * of targets without comparing them to another player's field conditions. */
.sweep-record-card { position: relative; overflow: hidden; border-color: rgba(236,201,135,0.36); background: linear-gradient(145deg, rgba(41,31,13,0.56), rgba(11,24,43,0.92) 58%, rgba(22,13,39,0.88)); }
.sweep-record-card::after { content: ''; position: absolute; right: -36px; bottom: -52px; width: 130px; height: 130px; border: 1px solid rgba(236,201,135,0.15); border-radius: 50%; box-shadow: 0 0 0 14px rgba(236,201,135,0.035), 0 0 0 28px rgba(236,201,135,0.025); pointer-events: none; }
.sweep-record-card .eyebrow { color: #ecc987; }
.sweep-record-card h2, .sweep-record-note, .sweep-record-grid { position: relative; z-index: 1; }
.sweep-record-note { margin: -3px 0 10px; color: #b9bfaf; font-size: .63rem; line-height: 1.4; }
.sweep-record-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; }
.sweep-record { display: grid; grid-template-columns: 20px minmax(0, 1fr); gap: 6px; align-items: center; min-width: 0; padding: 7px 6px; border: 1px solid rgba(236,201,135,0.2); background: rgba(5,13,23,0.56); }
.sweep-record-medal { display: grid; width: 20px; height: 20px; place-items: center; border: 1px solid rgba(236,201,135,0.54); background: rgba(80,57,17,0.35); color: #f0d891; font: 600 .66rem/1 'Cinzel', serif; }
.sweep-record > span:last-child { display: grid; min-width: 0; gap: 2px; }
.sweep-record small { color: #97adbb; font: 700 .42rem/1.2 'Jost', sans-serif; letter-spacing: .08em; text-transform: uppercase; }
.sweep-record strong { overflow: hidden; color: #edf5f7; font: 600 .61rem/1.22 'Cinzel', serif; text-overflow: ellipsis; text-transform: capitalize; white-space: nowrap; }
.sweep-record.is-tier-uncommon .sweep-record-medal { border-color: rgba(158,219,168,0.7); color: #9edba8; }
.sweep-record.is-tier-rare .sweep-record-medal { border-color: rgba(112,204,223,0.8); color: #8fe6ec; box-shadow: 0 0 8px rgba(112,204,223,0.2); }
.sweep-record.is-tier-epic .sweep-record-medal { border-color: rgba(205,124,236,0.8); color: #d8a2f0; box-shadow: 0 0 9px rgba(205,124,236,0.24); }
.sweep-record.is-tier-legendary .sweep-record-medal { border-color: rgba(255,230,173,0.85); color: #fff0c2; box-shadow: 0 0 10px rgba(236,201,135,0.3); }

/* --- The field ------------------------------------------------------------
 * A cell is a button until it is turned over and a plain element afterwards:
 * an opened cell is a readout, not a control, and leaving it focusable as a
 * button would put a dozen dead tab stops between the player and Withdraw. */
.sweep-board-head { display: flex; flex-wrap: wrap; align-items: start; justify-content: space-between; gap: 12px; border-bottom: 1px solid rgba(83,149,183,0.24); padding-bottom: 11px; margin-bottom: 13px; }
.sweep-board-head h2 { margin: 4px 0 0; }
.sweep-board-meta { display: flex; flex-wrap: wrap; gap: 14px; }
.sweep-board-meta span { display: grid; gap: 2px; text-align: right; }
.sweep-board-meta small { color: #86a5ba; font: 700 0.5rem/1 'Jost', sans-serif; letter-spacing: 0.1em; text-transform: uppercase; }
.sweep-board-meta strong { color: #eaf3f8; font: 600 0.85rem/1 'Cinzel', serif; }

/* --- Sector conditions ---------------------------------------------------
 * Every admin-authored condition has one warning and one visual language. The
 * condition is frozen onto the run at launch, so this banner always describes
 * the rules the player is actually facing rather than a later sector edit. */
.sweep-condition { --condition-color: #8ddde1; display: grid; gap: 4px; margin: 0 0 13px; padding: 10px 11px; border: 1px solid rgba(141,221,225,0.4); border-left: 3px solid var(--condition-color); background: linear-gradient(110deg, rgba(12,49,64,0.72), rgba(8,21,39,0.74)); }
.sweep-condition.is-compact { margin-top: 10px; }
.sweep-condition-label { color: var(--condition-color); font: 700 0.48rem/1 'Jost', sans-serif; letter-spacing: 0.13em; text-transform: uppercase; }
.sweep-condition strong { color: #eef7fa; font: 600 0.75rem/1.2 'Cinzel', serif; }
.sweep-condition p { margin: 0; color: #c2d4de; font-size: 0.67rem; line-height: 1.45; }
.sweep-condition small { color: var(--condition-color); font-size: 0.59rem; line-height: 1.35; }
.sweep-condition.is-template-interference { --condition-color: #d4acef; border-color: rgba(205,124,236,0.58); background: repeating-linear-gradient(0deg, rgba(205,124,236,0.055) 0 2px, transparent 2px 5px), linear-gradient(110deg, rgba(55,25,78,0.78), rgba(20,13,42,0.8)); }
.sweep-condition.is-template-unstable { --condition-color: #f0a8a0; border-color: rgba(224,120,110,0.62); background: linear-gradient(110deg, rgba(78,21,22,0.77), rgba(30,12,25,0.82)); }
.sweep-condition.is-template-debris { --condition-color: #ecc987; border-color: rgba(236,201,135,0.62); background: repeating-linear-gradient(135deg, rgba(236,201,135,0.045) 0 5px, transparent 5px 10px), linear-gradient(110deg, rgba(70,49,19,0.74), rgba(30,23,19,0.8)); }

.sweep-grid { display: grid; grid-template-columns: repeat(var(--sweep-cols, 5), minmax(0, 1fr)); gap: 6px; max-width: 640px; }
.sweep-cell { display: grid; aspect-ratio: 1; place-items: center; padding: 0; border: 1px solid rgba(103,152,190,0.3); background: rgba(7,17,31,0.75); color: #6f8ea2; font: 600 1rem/1 'Cinzel', serif; cursor: pointer; transition: border-color .16s ease, background .16s ease, transform .16s ease; }
button.sweep-cell:hover:not(:disabled), button.sweep-cell:focus-visible { border-color: rgba(126,227,232,0.75); background: rgba(18,44,68,0.9); color: #cdeff3; outline: none; transform: translateY(-1px); }
button.sweep-cell:disabled { cursor: default; opacity: 0.75; }
.sweep-cell.is-open { position: relative; cursor: default; }
/* An identified cell. Toned by category and glyphed, but still a closed cell
 * with a question behind it -- recognition narrows the guess, it does not
 * answer it, and only safe cells are ever marked. */
.sweep-cell.is-known { border-style: dashed; }
.sweep-cell.is-known-material { border-color: rgba(158,219,168,0.55); color: #9edba8; }
.sweep-cell.is-known-credits { border-color: rgba(236,201,135,0.55); color: #ecc987; }
.sweep-cell.is-known-equipment { border-color: rgba(126,227,232,0.55); color: #8fe6ec; }
.sweep-cell.is-known-unknown { border-color: rgba(180,168,200,0.5); color: #b6abcd; }
.sweep-cell-glyph { font-size: 1.05rem; }
.sweep-cell-hint { position: absolute; right: 3px; bottom: 2px; color: #7f9bad; font: 700 0.5rem/1 'Jost', sans-serif; }
.sweep-cell-hint.is-warn { color: #e8c98a; }
/* One tone per outcome, so a swept field can be read at a glance afterwards. */
.sweep-cell.is-gear { border-color: rgba(126,227,232,0.55); background: rgba(14,44,60,0.85); color: #8fe6ec; }
.sweep-cell.is-crew { border-color: rgba(205,124,236,0.55); background: rgba(38,20,56,0.85); color: #d8a2f0; }
.sweep-cell.is-cache { border-color: rgba(236,201,135,0.55); background: rgba(46,36,14,0.85); color: #ecc987; }
.sweep-cell.is-empty { border-color: rgba(103,152,190,0.2); background: rgba(6,13,24,0.7); color: #7f9bad; }
.sweep-cell.is-hazard { overflow: hidden; border-color: rgba(224,120,110,0.7); background: rgba(58,16,16,0.85); color: #f0a8a0; }
.sweep-cell.is-hazard::before { content: ''; position: absolute; z-index: 1; inset: 0; pointer-events: none; background: rgba(134,20,27,0.28); }
.sweep-cell.is-hazard .sweep-cell-art { filter: saturate(.78) contrast(1.04); }
.sweep-cell.is-shrug { border-color: rgba(158,219,168,0.65); background: rgba(16,44,28,0.85); color: #9edba8; }
/* The recovered object itself fills the cell: with no room for a label the
 * artwork is the cell's identity, and the name lives in the title and the
 * accessible label. The built-in glyph stays small and centred, because a line
 * icon scaled to fill reads as a blown-up sketch -- the same conclusion the
 * stim belt reached at the same size. */
.sweep-cell-art { display: block; width: 100%; height: 100%; object-fit: cover; }
.sweep-cell.is-cache .sweep-cell-art { filter: saturate(1.08) contrast(1.04); }

/* The deployed crew is a field readout, not a second control. Its marker
 * only uses the last cell already resolved by the server, so it brings the
 * board to life without implying anything about an unopened square. */
.sweep-field-stage { display: grid; width: min(100%, 640px); gap: 9px; margin-inline: auto; }
.sweep-field-presence { display: grid; grid-template-columns: 32px minmax(0, 1fr); gap: 8px; align-items: center; padding: 7px 8px; border: 1px solid rgba(92,174,196,0.32); border-left: 3px solid #7ee3e8; background: linear-gradient(100deg, rgba(10,39,55,0.72), rgba(8,17,31,0.68)); }
.sweep-field-face, .sweep-field-marker { display: grid; overflow: hidden; place-items: center; border: 1px solid rgba(126,227,232,0.72); background: #0b1c30; color: #bdf2f3; font: 600 0.72rem/1 'Cinzel', serif; }
.sweep-field-face { width: 32px; height: 32px; box-shadow: 0 0 10px rgba(126,227,232,0.18); }
.sweep-field-face img, .sweep-field-marker img { width: 100%; height: 100%; object-fit: cover; }
.sweep-field-copy { display: grid; min-width: 0; grid-template-columns: auto minmax(0, 1fr); column-gap: 7px; align-items: baseline; }
.sweep-field-copy small { grid-column: 1 / -1; color: #7ee3e8; font: 700 0.46rem/1 'Jost', sans-serif; letter-spacing: 0.12em; text-transform: uppercase; }
.sweep-field-copy strong { overflow: hidden; color: #eef7fa; font: 600 0.67rem/1.25 'Cinzel', serif; text-overflow: ellipsis; white-space: nowrap; }
.sweep-field-copy em { overflow: hidden; color: #92afbf; font: 500 0.54rem/1.2 'Jost', sans-serif; font-style: normal; text-overflow: ellipsis; white-space: nowrap; }
.sweep-field-radio { grid-column: 1 / -1; overflow: hidden; color: #afc9d6; font-size: 0.57rem; line-height: 1.3; text-overflow: ellipsis; white-space: nowrap; }
.sweep-field-grid-wrap { position: relative; width: 100%; }
.sweep-field-grid-wrap .sweep-grid { max-width: none; }
.sweep-field-marker { position: absolute; z-index: 4; width: 25px; height: 25px; pointer-events: none; transform: translate(-50%, -50%); box-shadow: 0 0 0 2px rgba(5,13,25,0.88), 0 0 13px rgba(126,227,232,0.6); animation: sweep-field-marker-idle 2.8s ease-in-out infinite; }
@keyframes sweep-field-marker-idle { 0%, 100% { box-shadow: 0 0 0 2px rgba(5,13,25,0.88), 0 0 8px rgba(126,227,232,0.42); } 50% { box-shadow: 0 0 0 2px rgba(5,13,25,0.88), 0 0 16px rgba(126,227,232,0.76); } }
@keyframes sweep-field-marker-scan { 0%, 100% { transform: translate(-50%, -50%) scale(1); } 40% { transform: translate(-50%, -50%) scale(1.22); } 70% { transform: translate(-50%, -50%) scale(0.94); } }
.sweep-field-marker.is-scanning { border-color: #f0d891; box-shadow: 0 0 0 2px rgba(5,13,25,0.88), 0 0 20px rgba(236,201,135,0.9); animation: sweep-field-marker-scan .7s ease-in-out infinite; }

/* Resolving a cell uses a short directional pulse, then lets the revealed
 * tile arrive as a physical result. The pulse never supplies a category or
 * reward before the pick endpoint has answered. */
@keyframes sweep-cell-scan { 0%, 100% { border-color: rgba(126,227,232,0.62); background: rgba(12,34,53,0.88); box-shadow: inset 0 0 0 rgba(126,227,232,0), 0 0 0 rgba(126,227,232,0); } 48% { border-color: #f0d891; background: rgba(58,45,17,0.9); box-shadow: inset 0 0 18px rgba(236,201,135,0.34), 0 0 15px rgba(236,201,135,0.38); } }
@keyframes sweep-cell-reveal { 0% { transform: scale(0.74) rotate(-2deg); filter: brightness(1.85); } 55% { transform: scale(1.08) rotate(.5deg); filter: brightness(1.15); } 100% { transform: scale(1); filter: none; } }
button.sweep-cell.is-scanning { border-color: #f0d891; color: #fff0c2; animation: sweep-cell-scan .7s ease-in-out infinite; }
.sweep-cell.is-open.is-recent { z-index: 2; animation: sweep-cell-reveal .7s cubic-bezier(.16, .84, .3, 1); }

/* --- Shine ----------------------------------------------------------------
 * Rarity above common is worth noticing on a board where most cells are not.
 * It escalates the way the crew cards do: uncommon and rare get an edge and a
 * glow, epic adds a sweep across the art, legendary adds a second, slower one
 * out of phase so it reads as a different kind of object rather than a
 * brighter one. */
.sweep-cell.is-shiny { position: relative; overflow: hidden; }
.sweep-cell.is-shiny.is-tier-uncommon { border-color: rgba(158,219,168,0.7); box-shadow: inset 0 0 12px rgba(158,219,168,0.28); }
.sweep-cell.is-shiny.is-tier-rare { border-color: rgba(112,204,223,0.8); box-shadow: inset 0 0 14px rgba(112,204,223,0.34), 0 0 10px rgba(112,204,223,0.22); }
.sweep-cell.is-shiny.is-tier-epic { border-color: rgba(205,124,236,0.85); box-shadow: inset 0 0 16px rgba(205,124,236,0.38), 0 0 14px rgba(205,124,236,0.3); }
.sweep-cell.is-shiny.is-tier-legendary { border-color: rgba(255,230,173,0.9); box-shadow: inset 0 0 18px rgba(236,201,135,0.42), 0 0 18px rgba(236,201,135,0.38); }

@keyframes sweep-shine { 0% { transform: translateX(-140%) skewX(-18deg); } 55%, 100% { transform: translateX(140%) skewX(-18deg); } }
.sweep-cell.is-shiny.is-tier-epic::after,
.sweep-cell.is-shiny.is-tier-legendary::after {
  content: ''; position: absolute; inset: -30% -60%; pointer-events: none;
  background: linear-gradient(105deg, transparent 42%, rgba(255,255,255,0.42) 50%, transparent 58%);
  animation: sweep-shine 3.6s ease-in-out infinite;
}
/* The second pass, slower and out of phase, is what makes legendary read as
 * more than a brighter epic. */
.sweep-cell.is-shiny.is-tier-legendary::before {
  content: ''; position: absolute; inset: -30% -60%; pointer-events: none;
  background: linear-gradient(105deg, transparent 44%, rgba(255,238,194,0.5) 50%, transparent 56%);
  animation: sweep-shine 5.9s ease-in-out infinite 1.2s;
}
/* The hint has to stay legible over artwork, so it sits on its own opaque
 * pill rather than a scrim -- a gradient over a pale image composites to
 * nothing, which is the trap the stim belt count already hit. */
.sweep-cell.is-open .sweep-cell-hint { z-index: 2; padding: 1px 3px; background: rgba(4,10,20,0.92); }

.sweep-spent { margin: 12px 0 0; }
.sweep-board-actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; margin-top: 15px; }
/* An author rule setting display ties with the browser's own
 * [hidden] { display: none } and wins by being declared later, so Withdraw and
 * Abandon were on screen from first paint with no sweep to withdraw from. The
 * same defect this codebase already hit on the OAuth buttons; every element
 * here that carries a display rule AND is toggled by the hidden attribute
 * needs the override. */
.sweep-board-actions[hidden] { display: none; }

/* --- After-action field reveal ------------------------------------------
 * The result replaces the live board after the server has closed the run.
 * It keeps the original cell layout as a map, then repeats every reward in a
 * row/column manifest so a player can read exactly where a missed item sat. */
.sweep-result { display: grid; gap: 15px; }
.sweep-result-head { padding: 15px; border: 1px solid rgba(126,227,232,0.42); background: linear-gradient(135deg, rgba(12,47,62,0.78), rgba(10,21,42,0.78)); }
.sweep-result.is-lost .sweep-result-head { border-color: rgba(224,120,110,0.5); background: linear-gradient(135deg, rgba(58,16,16,0.78), rgba(25,13,31,0.8)); }
.sweep-result.is-collapse { animation: sweep-collapse-arrival .62s cubic-bezier(.22, .78, .32, 1); }
@keyframes sweep-collapse-arrival { 0%, 18% { transform: translateX(-5px); } 9%, 27% { transform: translateX(5px); } 45% { transform: translateX(0); } }
.sweep-result-head h3 { margin: 4px 0 6px; color: #f2f7fb; font: 600 clamp(1rem, 2vw, 1.3rem)/1.2 'Cinzel', serif; }
.sweep-result-head p { margin: 0; color: #bdd2df; font-size: 0.77rem; line-height: 1.55; }
.sweep-collapse-alert { display: grid; grid-template-columns: 26px minmax(0, 1fr); gap: 9px; padding: 10px; border: 1px solid rgba(224,120,110,0.64); border-left: 3px solid #f0a8a0; background: repeating-linear-gradient(135deg, rgba(224,120,110,0.055) 0 5px, transparent 5px 10px), linear-gradient(110deg, rgba(75,20,23,0.84), rgba(34,12,27,0.8)); }
.sweep-collapse-alert.is-tethered { border-color: rgba(205,124,236,0.6); border-left-color: #d8a2f0; background: repeating-linear-gradient(135deg, rgba(205,124,236,0.052) 0 5px, transparent 5px 10px), linear-gradient(110deg, rgba(52,23,70,0.82), rgba(20,18,40,0.82)); }
.sweep-collapse-mark { display: grid; width: 26px; height: 26px; place-items: center; border: 1px solid currentColor; color: #f0a8a0; font: 700 1rem/1 'Cinzel', serif; }
.sweep-collapse-alert.is-tethered .sweep-collapse-mark { color: #d8a2f0; }
.sweep-collapse-alert > span:last-child { display: grid; gap: 3px; }
.sweep-collapse-alert small { color: #f0a8a0; font: 700 0.47rem/1 'Jost', sans-serif; letter-spacing: .12em; text-transform: uppercase; }
.sweep-collapse-alert.is-tethered small { color: #d8a2f0; }
.sweep-collapse-alert strong { color: #fff0ee; font: 600 .74rem/1.2 'Cinzel', serif; }
.sweep-collapse-alert p { margin: 0; color: #e3c4c0; font-size: .63rem; line-height: 1.45; }
.sweep-result-payout { display: grid; grid-template-columns: repeat(auto-fit, minmax(112px, 1fr)); gap: 7px; }
.sweep-result-payout span { display: grid; gap: 4px; padding: 9px; border: 1px solid rgba(103,152,190,0.28); background: rgba(6,15,28,0.58); }
.sweep-result-payout small { color: #8daabd; font: 700 0.49rem/1 'Jost', sans-serif; letter-spacing: 0.1em; text-transform: uppercase; }
.sweep-result-payout strong { overflow: hidden; color: #eaf3f8; font: 600 0.72rem/1.25 'Cinzel', serif; text-overflow: ellipsis; white-space: nowrap; }
.sweep-result-overflow { margin: -7px 0 0; color: #e8c98a; font-size: 0.68rem; line-height: 1.45; }
.sweep-achievement-unlocks { padding: 10px; border: 1px solid rgba(236,201,135,0.4); background: linear-gradient(105deg, rgba(64,45,15,0.48), rgba(15,24,40,0.72)); }
.sweep-achievement-unlocks > .eyebrow { color: #f0d891; }
.sweep-achievement-list { display: grid; gap: 6px; margin-top: 7px; }
.sweep-achievement { --achievement-color: 224,173,120; display: grid; grid-template-columns: 28px minmax(0, 1fr); gap: 8px; align-items: center; padding: 7px; border: 1px solid rgba(var(--achievement-color),0.4); background: rgba(5,13,23,0.55); }
.sweep-achievement.is-tier-silver { --achievement-color: 173,201,217; }
.sweep-achievement.is-tier-gold { --achievement-color: 236,201,135; }
.sweep-achievement-mark { display: grid; width: 28px; height: 28px; place-items: center; border: 1px solid rgba(var(--achievement-color),0.75); color: rgb(var(--achievement-color)); font: 600 .85rem/1 'Cinzel', serif; box-shadow: inset 0 0 8px rgba(var(--achievement-color),0.17), 0 0 9px rgba(var(--achievement-color),0.15); }
.sweep-achievement > span:last-child { display: grid; gap: 2px; min-width: 0; }
.sweep-achievement strong { color: #eef7fa; font: 600 .68rem/1.2 'Cinzel', serif; }
.sweep-achievement small { color: #b4c7d1; font-size: .57rem; line-height: 1.35; }
.sweep-reward-cabinet { overflow: hidden; border: 1px solid rgba(236,201,135,0.42); background: linear-gradient(130deg, rgba(49,37,15,0.58), rgba(13,25,39,0.84) 48%, rgba(10,17,31,0.88)); }
.sweep-reward-cabinet-head { padding: 11px 12px 10px; border-bottom: 1px solid rgba(236,201,135,0.22); background: linear-gradient(90deg, rgba(93,65,17,0.35), transparent); }
.sweep-reward-cabinet-head .eyebrow { color: #ecc987; }
.sweep-reward-cabinet-head h4 { margin: 3px 0 3px; color: #fff3d4; font: 600 .86rem/1.2 'Cinzel', serif; }
.sweep-reward-cabinet-head p { margin: 0; color: #c5c8b7; font-size: .62rem; line-height: 1.45; }
.sweep-reward-cabinet-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(165px, 1fr)); gap: 7px; padding: 9px; }
.sweep-reward-cabinet-item { --cabinet-color: 126,227,232; display: grid; grid-template-columns: 42px minmax(0, 1fr); gap: 8px; align-items: center; min-width: 0; padding: 7px; border: 1px solid rgba(var(--cabinet-color),0.38); background: linear-gradient(135deg, rgba(5,13,24,0.86), rgba(var(--cabinet-color),0.1)); animation: sweep-haul-arrival .48s cubic-bezier(.16, .84, .3, 1) both; animation-delay: var(--haul-delay, 0ms); }
.sweep-reward-cabinet-item.is-cache { --cabinet-color: 236,201,135; }
.sweep-reward-cabinet-item.is-crew { --cabinet-color: 205,124,236; }
.sweep-reward-cabinet-item.is-tier-uncommon { --cabinet-color: 158,219,168; }
.sweep-reward-cabinet-item.is-tier-rare { --cabinet-color: 112,204,223; }
.sweep-reward-cabinet-item.is-tier-epic { --cabinet-color: 205,124,236; }
.sweep-reward-cabinet-item.is-tier-legendary { --cabinet-color: 233,211,153; }
@keyframes sweep-haul-arrival { from { opacity: 0; transform: translateY(9px) scale(.96); } to { opacity: 1; transform: translateY(0) scale(1); } }
/* Rarity is a moment on the reward page, not merely a colour label. The glint
 * starts only after the card's arrival animation has settled, then escalates
 * from a quiet rare pass to a layered legendary flare. */
.sweep-reward-cabinet-item.is-tier-rare,
.sweep-reward-cabinet-item.is-tier-epic,
.sweep-reward-cabinet-item.is-tier-legendary { position: relative; overflow: hidden; }
.sweep-reward-cabinet-item.is-tier-rare::after,
.sweep-reward-cabinet-item.is-tier-epic::after,
.sweep-reward-cabinet-item.is-tier-legendary::after { content: ''; position: absolute; z-index: 2; inset: -35% -65%; pointer-events: none; background: linear-gradient(105deg, transparent 43%, rgba(255,255,255,.5) 50%, transparent 57%); animation: sweep-reward-shine 5.8s ease-in-out infinite 1.05s; }
.sweep-reward-cabinet-item.is-tier-rare::after { opacity: .42; }
.sweep-reward-cabinet-item.is-tier-epic::after { opacity: .62; animation-duration: 4.1s; }
.sweep-reward-cabinet-item.is-tier-legendary::after { opacity: .78; animation-duration: 3.25s; }
.sweep-reward-cabinet-item.is-tier-legendary::before { content: ''; position: absolute; z-index: 2; inset: -35% -65%; pointer-events: none; background: linear-gradient(105deg, transparent 45%, rgba(255,236,181,.56) 50%, transparent 55%); animation: sweep-reward-shine 6.4s ease-in-out infinite 2.5s; }
@keyframes sweep-reward-shine { 0%, 58%, 100% { transform: translateX(-140%) skewX(-18deg); } 28% { transform: translateX(140%) skewX(-18deg); } }
.sweep-reward-cabinet-art { display: grid; width: 42px; height: 42px; overflow: hidden; place-items: center; border: 1px solid rgba(var(--cabinet-color),.65); background: rgba(4,10,20,.82); color: rgb(var(--cabinet-color)); font: 600 1rem/1 'Cinzel', serif; box-shadow: 0 0 11px rgba(var(--cabinet-color),.16); }
.sweep-reward-cabinet-art img { width: 100%; height: 100%; object-fit: cover; }
.sweep-reward-cabinet-copy { display: grid; min-width: 0; gap: 2px; }
.sweep-reward-cabinet-copy small { color: rgb(var(--cabinet-color)); font: 700 .44rem/1 'Jost', sans-serif; letter-spacing: .1em; text-transform: uppercase; }
.sweep-reward-cabinet-copy strong { overflow: hidden; color: #f0f5fa; font: 600 .67rem/1.25 'Cinzel', serif; text-overflow: ellipsis; white-space: nowrap; }
.sweep-reward-cabinet-copy em { color: #a9bdc9; font: 500 .52rem/1.2 'Jost', sans-serif; font-style: normal; text-transform: capitalize; }
.sweep-result-legend { display: flex; flex-wrap: wrap; gap: 7px 14px; color: #9db4c6; font: 700 0.55rem/1 'Jost', sans-serif; letter-spacing: 0.08em; text-transform: uppercase; }
.sweep-result-legend .is-secured { color: #9edba8; }
.sweep-result-legend .is-missed { color: #e8b0a6; }
.sweep-result-legend .is-tethered { color: #d8a2f0; }
.sweep-result-grid { max-width: none; }
.sweep-cell.is-result { overflow: hidden; }
.sweep-cell.is-result.is-tier-rare { border-color: rgba(112,204,223,0.88); box-shadow: inset 0 0 18px rgba(112,204,223,0.38), 0 0 13px rgba(112,204,223,0.28); }
.sweep-cell.is-result.is-tier-epic { border-color: rgba(205,124,236,0.92); box-shadow: inset 0 0 21px rgba(205,124,236,0.44), 0 0 17px rgba(205,124,236,0.36); }
.sweep-cell.is-result.is-tier-legendary { border-color: rgba(255,230,173,0.96); box-shadow: inset 0 0 24px rgba(236,201,135,0.5), 0 0 22px rgba(236,201,135,0.46); }
/* The full debrief map deserves the same tier signal as the secured-haul
 * cabinet. Using ::before leaves ::after available for the red "left in the
 * field" frame, so an unrecovered legendary can look valuable and lost at
 * the same time. */
.sweep-cell.is-result.is-tier-rare::before,
.sweep-cell.is-result.is-tier-epic::before,
.sweep-cell.is-result.is-tier-legendary::before { content: ''; position: absolute; z-index: 2; inset: -32% -62%; pointer-events: none; background: linear-gradient(105deg, transparent 42%, rgba(255,255,255,0.58) 50%, transparent 58%); animation: sweep-shine 6.5s ease-in-out infinite; }
.sweep-cell.is-result.is-tier-rare::before { opacity: .4; animation-duration: 7.4s; }
.sweep-cell.is-result.is-tier-epic::before { opacity: .62; animation-duration: 4.4s; }
.sweep-cell.is-result.is-tier-legendary::before { opacity: .82; animation-duration: 3.25s; background: linear-gradient(105deg, transparent 43%, rgba(255,239,194,0.74) 50%, transparent 57%); }
.sweep-cell.is-result.is-unrecovered { filter: saturate(0.64); }
.sweep-cell.is-result.is-unrecovered::after { content: ''; position: absolute; inset: 0; border: 2px solid rgba(224,120,110,0.65); pointer-events: none; }
.sweep-cell.is-result.is-tethered { box-shadow: inset 0 0 14px rgba(205,124,236,0.4), 0 0 10px rgba(205,124,236,0.24); }
.sweep-result-cell-position, .sweep-result-cell-state { position: absolute; z-index: 3; padding: 2px 3px; background: rgba(4,10,20,0.86); font: 700 0.46rem/1 'Jost', sans-serif; letter-spacing: 0.03em; }
.sweep-result-cell-position { top: 2px; left: 2px; color: #b8cfdd; }
.sweep-result-cell-state { right: 2px; bottom: 2px; color: #9edba8; font-size: 0.62rem; }
.sweep-cell.is-result.is-unrecovered .sweep-result-cell-state { color: #e8b0a6; }
.sweep-cell.is-result.is-tethered .sweep-result-cell-state { color: #d8a2f0; }
.sweep-result-manifest-wrap { padding-top: 13px; border-top: 1px solid rgba(83,149,183,0.24); }
.sweep-result-manifest-wrap h4 { margin: 0; color: #eaf3f8; font: 600 0.82rem/1.2 'Cinzel', serif; }
.sweep-result-manifest-wrap > p { margin: 4px 0 9px; color: #92aebe; font-size: 0.65rem; line-height: 1.45; }
.sweep-result-manifest { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 5px; margin: 0; padding: 0; list-style: none; }
.sweep-result-manifest li { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 7px; padding: 6px 7px; border: 1px solid rgba(103,152,190,0.25); background: rgba(6,14,26,0.58); }
.sweep-result-manifest b { color: #9cbacb; font: 700 0.52rem/1 'Jost', sans-serif; letter-spacing: 0.06em; white-space: nowrap; }
.sweep-result-manifest span { overflow: hidden; color: #d8e5ec; font: 600 0.65rem/1.2 'Cinzel', serif; text-overflow: ellipsis; white-space: nowrap; }
.sweep-result-manifest small { color: #e8b0a6; font-size: 0.52rem; letter-spacing: 0.05em; text-transform: uppercase; white-space: nowrap; }
.sweep-result-manifest .is-secured { border-color: rgba(158,219,168,0.38); }
.sweep-result-manifest .is-secured small { color: #9edba8; }
.sweep-result-manifest .is-tethered { border-color: rgba(205,124,236,0.48); }
.sweep-result-manifest .is-tethered small { color: #d8a2f0; }
.sweep-result-actions { display: flex; justify-content: flex-end; padding-top: 2px; }
.sweep-salvage-contract { display: grid; gap: 9px; margin: 13px 0 0; padding: 13px; border: 1px solid rgba(117,211,219,0.52); background: linear-gradient(135deg, rgba(12,61,70,0.56), rgba(24,15,56,0.74)); }.sweep-salvage-contract.is-tier-epic { border-color: rgba(185,125,235,0.68); background: linear-gradient(135deg, rgba(54,23,86,0.7), rgba(22,17,63,0.82)); }.sweep-salvage-contract.is-tier-legendary { border-color: rgba(239,204,117,0.74); background: linear-gradient(135deg, rgba(77,52,17,0.65), rgba(48,19,55,0.84)); }.sweep-salvage-contract .eyebrow { margin: 0; color: #8ce4e7; }.sweep-salvage-contract > div { display: grid; grid-template-columns: 48px minmax(0, 1fr); align-items: center; gap: 10px; }.sweep-salvage-contract img, .sweep-salvage-contract-glyph { display: grid; width: 48px; height: 48px; place-items: center; border: 1px solid rgba(135,221,226,0.44); background: rgba(4,12,25,0.7); color: #f0d591; object-fit: cover; }.sweep-salvage-contract strong { display: block; color: #f3eef9; font: 600 .78rem/1.2 'Cinzel', serif; }.sweep-salvage-contract p { margin: 4px 0 0; color: #b1c7d4; font-size: .67rem; line-height: 1.42; }.sweep-salvage-contract .btn { width: fit-content; padding: 8px 11px; font-size: .64rem; }

/* --- The ladder -----------------------------------------------------------
 * Same three states as the reputation rail: earned, current, sealed. Sealed
 * dims by a measured colour step rather than by opacity, which a contrast
 * check cannot see. */
.sweep-ladder-note { margin: 0 0 9px; }
.sweep-ladder-pager { display: grid; gap: 5px; }
.sweep-ladder-step { display: grid; width: 100%; height: 18px; place-items: center; padding: 0; border: 1px solid rgba(103,152,190,0.32); background: linear-gradient(90deg, rgba(7,15,28,0.6), rgba(17,37,58,0.78), rgba(7,15,28,0.6)); color: #8fb0c4; cursor: pointer; font: 700 0.66rem/1 'Cinzel', serif; }
.sweep-ladder-step:hover:not(:disabled), .sweep-ladder-step:focus-visible { border-color: rgba(126,227,232,0.72); color: #d7f8fa; outline: none; }
.sweep-ladder-step:disabled { border-color: rgba(103,152,190,0.16); color: #536d7d; cursor: default; }
.sweep-ladder { display: grid; gap: 4px; margin: 0; padding: 0; overflow: hidden; list-style: none; }
.sweep-rung { --rank-color: #7ee3e8; --rank-tone: var(--rank-color); display: grid; grid-template-columns: 24px minmax(0, 1fr) auto; align-items: center; gap: 9px; padding: 5px 4px; border-left: 2px solid color-mix(in srgb, var(--rank-tone) 56%, transparent); background: linear-gradient(90deg, color-mix(in srgb, var(--rank-tone) 10%, transparent), transparent 72%); }
.sweep-rung-mark { display: grid; width: 24px; height: 24px; place-items: center; border: 1px solid color-mix(in srgb, var(--rank-tone) 68%, #253a50); background: color-mix(in srgb, var(--rank-tone) 16%, #0c1526); color: var(--rank-tone); font: 600 0.6rem/1 'Cinzel', serif; }
.sweep-rung-copy { min-width: 0; }
.sweep-rung-copy strong { display: block; overflow: hidden; color: color-mix(in srgb, var(--rank-tone) 66%, #edf6f8); font: 600 0.74rem/1.25 'Cinzel', serif; text-overflow: ellipsis; white-space: nowrap; }
.sweep-rung-copy small { display: block; overflow: hidden; color: color-mix(in srgb, var(--rank-tone) 48%, #8097aa); font-size: 0.58rem; letter-spacing: 0.05em; text-overflow: ellipsis; white-space: nowrap; }
.sweep-rung > b { color: var(--rank-tone); font: 600 0.68rem/1 'Cinzel', serif; }
.sweep-rung.is-current { border-left-color: var(--rank-color); background: linear-gradient(90deg, color-mix(in srgb, var(--rank-color) 28%, transparent), color-mix(in srgb, var(--rank-color) 6%, transparent) 72%); }
.sweep-rung.is-current .sweep-rung-mark { border-width: 2px; border-color: var(--rank-color); background: var(--rank-color); color: #06121e; box-shadow: 0 0 12px color-mix(in srgb, var(--rank-color) 58%, transparent); }
.sweep-rung.is-current .sweep-rung-copy strong { color: #fff; }
.sweep-rung.is-sealed .sweep-rung-mark { border-style: dashed; }
.sweep-rung.is-next-one { --rank-tone: color-mix(in srgb, var(--rank-color) 62%, #101a2c); }
.sweep-rung.is-next-two { --rank-tone: color-mix(in srgb, var(--rank-color) 38%, #101a2c); }

/* --- Crew ----------------------------------------------------------------
 * Four figures, each traceable to the stat that produced it. The stat is
 * printed under the figure rather than left to a tooltip alone: a roster
 * showing Survey 0 on every card reads as broken until you can see that
 * nobody has the Science for it yet.
 * ------------------------------------------------------------------------ */
/* Two across. auto-fit with a 248px floor gave one column the moment the
 * centre narrowed, which is what turned the roster into a single tall stack. */
.sweep-crew-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.sweep-crew-sort { display: flex; align-items: center; gap: 7px; color: #86a5ba; font: 700 0.5rem/1 Jost, sans-serif; letter-spacing: 0.1em; text-transform: uppercase; }
.sweep-crew-sort select { min-width: 108px; min-height: 28px; padding: 3px 25px 3px 8px; border: 1px solid rgba(103,152,190,.48); appearance: none; color-scheme: dark; background-color: #0a192b; background-image: linear-gradient(45deg, transparent 50%, #a6d9dd 50%), linear-gradient(135deg, #a6d9dd 50%, transparent 50%), linear-gradient(135deg, rgba(20,58,76,.88), rgba(10,19,35,.94)); background-position: calc(100% - 11px) 11px, calc(100% - 7px) 11px, 0 0; background-repeat: no-repeat; background-size: 4px 4px, 4px 4px, 100% 100%; color: #e1f0f3; font: 600 .66rem/1 'Jost', sans-serif; letter-spacing: 0; text-transform: none; cursor: pointer; }
.sweep-crew-sort select:hover { border-color: rgba(126,227,232,.72); background-color: #0d243a; }
.sweep-crew-sort select:focus-visible { border-color: #7ee3e8; outline: 2px solid rgba(126,227,232,.24); outline-offset: 2px; }
.sweep-crew-sort option { background: #0a192b; color: #e1f0f3; }
/* The star sits over the card corner rather than in the header grid: the
 * header is a fixed two-column layout and a third child would squeeze the
 * name, which already ellipses at this width. */
.sweep-crew-star { position: absolute; z-index: 2; top: 7px; right: 7px; display: grid; width: 24px; height: 24px; place-items: center; padding: 0; border: 1px solid rgba(126,178,199,0.4); background: rgba(6,16,30,0.78); color: #7e98a9; cursor: pointer; font-size: 0.72rem; line-height: 1; }
.sweep-crew-star:hover:not(:disabled), .sweep-crew-star:focus-visible { border-color: rgba(235,209,138,0.82); color: #f0d891; outline: none; }
.sweep-crew-star.is-on { border-color: rgba(235,209,138,0.78); background: rgba(78,61,31,0.68); color: #f0d891; text-shadow: 0 0 8px rgba(240,216,145,0.54); }
.sweep-crew.is-favorite { border-color: rgba(var(--rarity), 0.7); }
/* The virtual pager owns the visual order now. It renders only the current
 * sector and two following rungs, so the browser has no scroll position (or
 * native scrollbar) to reconcile with the commander's progression. */
.sweep-crew { position: relative; --rarity: 226,232,240; display: grid; gap: 10px; padding: 12px; border: 1px solid rgba(var(--rarity), 0.45); background: linear-gradient(150deg, rgba(9,20,38,0.72), rgba(14,9,28,0.72)); }
.sweep-crew.is-tier-uncommon { --rarity: 158,219,168; }
.sweep-crew.is-tier-rare { --rarity: 112,204,223; }
.sweep-crew.is-tier-epic { --rarity: 205,124,236; }
.sweep-crew.is-tier-legendary { --rarity: 233,211,153; }
/* Unavailable dims by a measured colour step, never opacity -- opacity
 * composites text and background together and hides a contrast failure from
 * any sampler, which this codebase has been caught by twice. */
.sweep-crew.is-blocked { border-color: rgba(103,152,190,0.22); background: rgba(6,13,24,0.6); }
.sweep-crew.is-blocked .sweep-crew-name strong { color: #a9bccb; }
.sweep-crew.is-blocked .sweep-figure b { color: #9db2c2; }

/* Room reserved for the star, which is positioned over this corner. The
 * name ellipses, so without it a long one runs under the button rather
 * than being cut before it. */
.sweep-crew-head { display: grid; grid-template-columns: 42px minmax(0, 1fr); gap: 10px; align-items: center; padding-right: 30px; }
.sweep-crew-face { display: grid; width: 42px; height: 42px; overflow: hidden; place-items: center; border: 1px solid rgba(var(--rarity), 0.65); background: rgba(5,12,24,0.85); box-shadow: 0 0 10px rgba(var(--rarity), 0.18); }
.sweep-crew-face img { width: 100%; height: 100%; object-fit: cover; }
.sweep-crew-face span { color: rgb(var(--rarity)); font: 600 1.05rem/1 'Cinzel', serif; }
.sweep-crew-name { min-width: 0; }
.sweep-crew-name strong { display: block; overflow: hidden; color: #f0f5fa; font: 600 0.86rem/1.2 'Cinzel', serif; text-overflow: ellipsis; white-space: nowrap; }
.sweep-crew-name em { display: block; margin-top: 1px; color: #9db4c6; font-size: 0.6rem; font-style: normal; letter-spacing: 0.07em; text-transform: uppercase; }
.sweep-crew-tier { display: inline-block; margin-top: 4px; padding: 1px 6px; border: 1px solid rgba(var(--rarity), 0.5); color: rgb(var(--rarity)); font: 700 0.47rem/1.6 'Jost', sans-serif; letter-spacing: 0.14em; text-transform: uppercase; }
.sweep-crew-ilvl { display: inline-flex; align-items: baseline; gap: 3px; margin: 4px 0 0 5px; padding: 2px 5px; border: 1px solid rgba(126,203,158,.58); background: rgba(15,53,38,.5); color: #a9e8bc; cursor: help; font-family: 'Jost', sans-serif; line-height: 1; vertical-align: middle; }.sweep-crew-ilvl small { color: #86bd96; font-size: .4rem; font-weight: 800; letter-spacing: .09em; }.sweep-crew-ilvl b { color: #c9f4d3; font: 700 .62rem/1 'Cinzel', serif; }.sweep-crew-ilvl em { color: #89b89a; font-size: .47rem; font-style: normal; font-weight: 700; }.sweep-crew-ilvl.is-legendary { border-color: rgba(255,230,173,.9); background: linear-gradient(110deg, rgba(87,59,17,.62), rgba(40,26,14,.64)); box-shadow: 0 0 11px rgba(236,201,135,.24); }.sweep-crew-ilvl.is-legendary small, .sweep-crew-ilvl.is-legendary em { color: #f0cf83; }.sweep-crew-ilvl.is-legendary b { color: #fff0c2; text-shadow: 0 0 8px rgba(255,230,173,.52); }

.sweep-crew-projection { display: grid; grid-template-columns: repeat(4, 1fr); gap: 4px; }
/* cursor: help and a tab stop, because the tooltip is the explanation and a
 * pointer-only affordance would put it out of reach of a keyboard. */
.sweep-figure { display: grid; gap: 2px; padding: 5px 3px; border: 1px solid rgba(103,152,190,0.22); background: rgba(4,10,20,0.55); text-align: center; cursor: help; }
.sweep-figure:hover, .sweep-figure:focus-visible { border-color: rgba(126,227,232,0.6); background: rgba(14,34,54,0.8); outline: none; }
.sweep-figure small { color: #86a5ba; font: 700 0.47rem/1 'Jost', sans-serif; letter-spacing: 0.07em; text-transform: uppercase; }
.sweep-figure b { color: #eaf3f8; font: 600 0.8rem/1 'Cinzel', serif; }
/* The source stat, in that stat's own colour -- the same four tones the
 * mission roster's stat card uses, so STR means the same thing on both. */
.sweep-figure i { font: 600 0.5rem/1 'Jost', sans-serif; font-style: normal; letter-spacing: 0.06em; }
.sweep-figure.is-strength i { color: #e08a72; }
.sweep-figure.is-cunning i { color: #c79ae8; }
.sweep-figure.is-science i { color: #6fd7b0; }
.sweep-figure.is-charisma i { color: #e8c66f; }

/* A concise pre-flight read that turns the four independent sweep figures into
 * an actionable loadout assessment for the sector the commander has open. */
.sweep-readiness { --readiness-color: #e3a89d; display: grid; gap: 7px; padding: 8px 9px; border: 1px solid var(--readiness-color); border-left: 3px solid var(--readiness-color); background: linear-gradient(110deg, rgba(22,43,57,.72), rgba(8,17,31,.62)); }
.sweep-readiness.is-a { --readiness-color: #9edba8; }.sweep-readiness.is-b { --readiness-color: #7ee3e8; }.sweep-readiness.is-c { --readiness-color: #ecc987; }
.sweep-readiness-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; }.sweep-readiness-head span { display: grid; gap: 1px; }.sweep-readiness-head small, .sweep-readiness-metrics small { color: var(--readiness-color); font: 800 .46rem/1 'Jost', sans-serif; letter-spacing: .12em; text-transform: uppercase; }.sweep-readiness-head strong { color: #e9f4f6; font: 600 .7rem/1.2 'Cinzel', serif; }.sweep-readiness-head > b { color: var(--readiness-color); font: 700 .86rem/1 'Cinzel', serif; }.sweep-readiness-head > b i { margin-left: 2px; color: #7994a6; font: 600 .48rem/1 Jost, sans-serif; font-style: normal; }
.sweep-readiness-metrics { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 4px; }.sweep-readiness-metrics span { display: grid; gap: 2px; min-width: 0; padding: 4px; border: 1px solid rgba(104,151,180,.22); background: rgba(3,10,19,.38); }.sweep-readiness-metrics strong { overflow: hidden; color: #d8e6ec; font-size: .58rem; text-overflow: ellipsis; white-space: nowrap; }.sweep-readiness-metrics span.is-low { border-color: rgba(225,156,145,.4); }.sweep-readiness-metrics span.is-low strong { color: #efb3aa; }
.sweep-readiness p { margin: 0; color: #efb2a7; font-size: .57rem; line-height: 1.38; }.sweep-readiness p.is-clear { color: #a9dcb7; }

.sweep-crew-foot { display: flex; flex-wrap: wrap; align-items: end; justify-content: space-between; gap: 8px; }
.sweep-crew-fatigue { display: grid; flex: 1 1 130px; gap: 4px; min-width: 0; }
.sweep-crew-fatigue small { color: #9db4c6; font-size: 0.6rem; }
/* The bar marks what this sector costs, so whether a crew member can go is a
 * glance rather than two numbers subtracted in the reader's head. */
.sweep-crew-bar { position: relative; display: block; height: 5px; overflow: hidden; background: rgba(4,10,20,0.8); border: 1px solid rgba(103,152,190,0.24); }
.sweep-crew-bar i { display: block; height: 100%; background: linear-gradient(90deg, #4fc6d6, #7ee3e8); }
.sweep-crew-bar u { position: absolute; top: -1px; bottom: -1px; width: 2px; background: #ecc987; text-decoration: none; }
.sweep-crew.is-blocked .sweep-crew-bar i { background: linear-gradient(90deg, #4a6478, #6f8ea2); }
.sweep-crew-blocked { color: #d8a98f; font-size: 0.62rem; }
.sweep-crew-contract-finished { color: #9edba8; font: 700 0.58rem/1.3 'Jost', sans-serif; letter-spacing: 0.06em; text-align: right; text-decoration: none; text-transform: uppercase; }
.sweep-crew-contract-finished span { margin-left: 2px; font-size: 0.75rem; }
.sweep-crew-contract-finished:hover, .sweep-crew-contract-finished:focus-visible { color: #d4f4da; text-decoration: underline; outline: none; }
.sweep-crew-foot .btn { min-height: 30px; padding: 0 14px; font-size: 0.6rem; }

/* The rail folds first: at this width the board is still comfortable and the
 * commander card is the least load-bearing of the three columns. */
/* --- Commander and the trophy log ----------------------------------------
 * The same card the missions page shows. Its class names are its own rather
 * than borrowed from missions.css, which this page does not load -- reusing
 * the names would make the card depend on a stylesheet that is not here. */
.sweep-profile-card { padding: 16px; border: 1px solid rgba(83,149,183,0.34); background: linear-gradient(150deg, rgba(11,24,43,0.9), rgba(17,11,34,0.9)); }
.sweep-profile-head { display: grid; grid-template-columns: 46px minmax(0, 1fr); gap: 11px; align-items: center; margin: 8px 0 12px; }
.sweep-profile-avatar { position: relative; display: grid; width: 46px; height: 46px; overflow: hidden; place-items: center; border: 2px solid var(--rank-color, #7ee3e8); background: rgba(5,12,24,0.9); }
.sweep-profile-avatar img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.sweep-profile-fallback { color: #cfe4ef; font: 600 1.15rem/1 Cinzel, serif; }
.sweep-profile-identity { min-width: 0; }
.sweep-profile-identity strong { display: block; overflow: hidden; color: #f2f6fb; font: 600 0.92rem/1.2 Cinzel, serif; text-overflow: ellipsis; white-space: nowrap; }
.sweep-profile-rank { display: flex; align-items: center; gap: 6px; margin-top: 3px; font-size: 0.64rem; letter-spacing: 0.08em; text-transform: uppercase; }
.sweep-profile-rank i { display: grid; width: 17px; height: 17px; place-items: center; border: 1px solid currentColor; font: 600 0.55rem/1 Cinzel, serif; font-style: normal; }
.sweep-profile-track { display: block; height: 5px; overflow: hidden; background: rgba(4,10,20,0.8); border: 1px solid rgba(103,152,190,0.24); }
.sweep-profile-track i { display: block; height: 100%; }
.sweep-profile-rep small { display: block; margin-top: 5px; color: #9db4c6; font-size: 0.63rem; }
.sweep-profile-credits { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; margin-top: 12px; padding-top: 10px; border-top: 1px solid rgba(83,149,183,0.24); }
.sweep-profile-credits span { color: #86a5ba; font: 700 0.52rem/1 Jost, sans-serif; letter-spacing: 0.1em; text-transform: uppercase; }
.sweep-profile-credits strong { color: #ecc987; font: 600 0.88rem/1 Cinzel, serif; }

.sweep-trophies { display: grid; gap: 6px; margin: 10px 0 0; padding: 0; list-style: none; }
.sweep-trophy { --rarity: 205,124,236; display: grid; grid-template-columns: 34px minmax(0, 1fr); gap: 9px; align-items: center; padding: 7px; border: 1px solid rgba(var(--rarity), 0.42); background: rgba(6,14,26,0.55); }
.sweep-trophy.is-tier-legendary { --rarity: 233,211,153; }
.sweep-trophy-art { display: grid; width: 34px; height: 34px; overflow: hidden; place-items: center; border: 1px solid rgba(var(--rarity), 0.6); background: rgba(4,10,20,0.85); color: rgb(var(--rarity)); font-size: 0.8rem; }
.sweep-trophy-art img { width: 100%; height: 100%; object-fit: cover; }
.sweep-trophy-copy { min-width: 0; }
.sweep-trophy-copy strong { display: block; overflow: hidden; color: #f0f5fa; font: 600 0.76rem/1.2 Cinzel, serif; text-overflow: ellipsis; white-space: nowrap; }
.sweep-trophy-copy small { display: block; margin-top: 2px; color: rgb(var(--rarity)); font-size: 0.56rem; letter-spacing: 0.08em; text-transform: uppercase; }

/* The Field Kit uses the same complete quick-slot grid as Mission Command,
 * placed immediately below the Commander card so a stim is useful while a
 * sweep is being planned or worked rather than one page away. */
.sweep-stim-belt-card { display: grid; gap: 10px; padding: 15px 16px 16px; border: 1px solid rgba(126,203,158,0.4); background: linear-gradient(148deg, rgba(18,44,34,0.78), rgba(13,25,48,0.9)); box-shadow: inset 0 1px rgba(196,244,212,0.07), 0 10px 24px rgba(5,3,15,0.16); }
.sweep-stim-belt-card[hidden] { display: none; }
.sweep-stim-belt-card .eyebrow { margin: 0; color: #9edba8; font-size: .57rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
.sweep-stim-belt-head { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; }
.sweep-stim-belt-head strong { color: #eaf6ee; font: 600 .98rem/1 'Cinzel', serif; }
.sweep-stim-belt-head > span { color: #9fb4c2; font-size: .68rem; font-weight: 600; }
.sweep-stim-belt-grid { display: grid; gap: 6px; }
.sweep-stim-belt-card > p { margin: 0; color: #9fb4c2; font-size: .64rem; line-height: 1.45; }
.sweep-stim-slot { position: relative; display: block; aspect-ratio: 1; width: 100%; padding: 0; border: 1px solid rgba(122,160,186,0.3); background: rgba(8,18,32,0.55); }
.sweep-stim-slot.is-empty { display: grid; place-items: center; color: #6f8697; cursor: pointer; transition: border-color .2s ease, color .2s ease; }
.sweep-stim-slot.is-empty:hover, .sweep-stim-slot.is-empty:focus-visible { border-color: rgba(158,219,168,0.6); color: #9edba8; }
.sweep-stim-slot.is-filled { border-color: rgba(126,203,158,0.5); background: rgba(20,46,36,0.6); }
.sweep-stim-slot.is-rare { border-color: rgba(112,204,223,0.55); }
.sweep-stim-slot.is-legendary { border-color: rgba(226,178,92,0.6); }
.sweep-stim-slot-use { position: relative; display: grid; width: 100%; height: 100%; padding: 0; place-items: center; border: 0; background: none; color: inherit; cursor: pointer; }
.sweep-stim-slot-icon { position: absolute; inset: 0; display: grid; overflow: hidden; place-items: center; color: var(--sweep-stim-accent, #9edba8); font: 600 1.1rem/1 'Cinzel', serif; }
.sweep-stim-slot-icon img { display: block; width: 100%; height: 100%; object-fit: cover; }
.sweep-stim-slot.is-effect-fatigue { --sweep-stim-accent: #9edba8; }
.sweep-stim-slot.is-effect-mission_speed { --sweep-stim-accent: #70ccdf; }
.sweep-stim-slot.is-effect-luck { --sweep-stim-accent: #e3bc71; }
.sweep-stim-slot-use b { position: absolute; z-index: 1; bottom: 2px; left: 2px; padding: 1px 4px; background: rgba(4,10,20,0.92); color: #eaf6ee; font: 700 .58rem/1.25 'Jost', sans-serif; }
.sweep-stim-slot-clear { position: absolute; top: -1px; right: -1px; display: grid; z-index: 2; width: 18px; height: 18px; padding: 0; place-items: center; border: 0; background: rgba(8,18,32,0.85); color: #8ba3b4; font-size: .72rem; line-height: 1; cursor: pointer; }
.sweep-stim-slot-clear:hover, .sweep-stim-slot-clear:focus-visible { color: #e59a9a; }

.sweep-choice-modal { width: min(420px, calc(100vw - 28px)); padding: 0; border: 1px solid rgba(105,213,222,0.5); color: var(--text); background: #100d22; box-shadow: 0 24px 90px rgba(0,0,0,0.7), 0 0 45px rgba(71,207,218,0.13); }
.sweep-choice-modal::backdrop { background: rgba(3,4,12,0.8); backdrop-filter: blur(4px); }
.sweep-choice-inner { position: relative; display: grid; gap: 12px; padding: 22px 22px 20px; }
.sweep-choice-close { position: absolute; top: 8px; right: 9px; width: 28px; height: 28px; padding: 0; border: 0; background: transparent; color: #a9bdcb; font-size: 1.15rem; cursor: pointer; }
.sweep-choice-inner .eyebrow { margin: 0; color: #8fdee4; font-size: .57rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
.sweep-choice-inner h2 { margin: 0; color: #f0edf8; font: 600 1.15rem/1.25 'Cinzel', serif; }
#sweep-choice-copy { margin: 0; color: #a9bdcb; font-size: .78rem; line-height: 1.5; }
.sweep-choice-options { display: grid; gap: 6px; max-height: 44vh; overflow-y: auto; }
.sweep-choice-option { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; width: 100%; padding: 10px 12px; border: 1px solid rgba(122,160,186,0.32); background: rgba(10,20,38,0.5); color: #dfe9f1; font: inherit; text-align: left; cursor: pointer; transition: border-color .18s ease, background-color .18s ease; }
.sweep-choice-option:hover, .sweep-choice-option:focus-visible { border-color: rgba(143,222,228,0.6); background: rgba(16,34,56,0.6); }
.sweep-choice-option.is-active { border-color: rgba(143,222,228,0.85); background: rgba(20,52,66,0.62); box-shadow: inset 2px 0 rgba(143,222,228,0.9); }
.sweep-choice-option > span { font-size: .84rem; font-weight: 600; }
.sweep-choice-option small { flex: none; color: #90abba; font-size: .68rem; }
.sweep-choice-error { min-height: 1.2em; margin: 0; color: #f0a8a0; font-size: .72rem; }
.sweep-choice-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; }

@media (max-width: 1320px) {
  .sweep-layout { grid-template-columns: 280px minmax(0, 1fr); }
  .sweep-rail { grid-column: 1 / -1; grid-template-columns: repeat(auto-fit, minmax(248px, 1fr)); }
}
@media (max-width: 900px) {
  .sweep-layout { grid-template-columns: minmax(0, 1fr); }
  .sweep-crew-list { grid-template-columns: repeat(auto-fit, minmax(238px, 1fr)); }
  .sweep-rail { grid-template-columns: minmax(0, 1fr); }
  .sweep-ladder { max-height: 250px; }
}
@media (max-width: 560px) {
  .sweep-facts { grid-template-columns: 1fr; }
  .sweep-board-meta span { text-align: left; }
  .sweep-crew-projection { grid-template-columns: repeat(2, 1fr); }
  .sweep-crew-list { grid-template-columns: minmax(0, 1fr); }
}
@media (prefers-reduced-motion: reduce) {
  .sweep-cell { transition: none; }
  .sweep-stim-slot.is-empty, .sweep-choice-option { transition: none; }
  .sweep-cell.is-shiny::before, .sweep-cell.is-shiny::after, .sweep-reward-cabinet-item.is-tier-rare::after, .sweep-reward-cabinet-item.is-tier-epic::after, .sweep-reward-cabinet-item.is-tier-legendary::before, .sweep-reward-cabinet-item.is-tier-legendary::after { animation: none; opacity: 0; }
  .sweep-field-marker, .sweep-field-marker.is-scanning, button.sweep-cell.is-scanning, .sweep-cell.is-open.is-recent, .sweep-result.is-collapse, .sweep-reward-cabinet-item { animation: none; }
  button.sweep-cell:hover:not(:disabled) { transform: none; }
}
