/* /Features/Combat/CombatPrototype.razor.rz.scp.css */
*[b-tn736eka6s] { box-sizing: border-box; }

.combat-shell[b-tn736eka6s] {
  --ink: #edf0e7;
  --muted: #919b91;
  --line: #2a342e;
  --panel: #111713;
  --gold: #d8ad63;
  --green: #65c48d;
  --red: #d36e64;
  min-height: 100vh;
  padding: clamp(12px, 2vw, 24px);
  color: var(--ink);
  font-family: Inter, ui-sans-serif, system-ui, sans-serif;
  background: radial-gradient(circle at 16% 0%, rgba(80,112,78,.24), transparent 32rem),
              linear-gradient(rgba(255,255,255,.018) 1px, transparent 1px),
              linear-gradient(90deg, rgba(255,255,255,.018) 1px, transparent 1px), #090b0d;
  background-size: auto, 24px 24px, 24px 24px, auto;
}

button[b-tn736eka6s], select[b-tn736eka6s] { font: inherit; }
.combat-toolbar[b-tn736eka6s] { max-width: 1480px; min-height: 48px; margin: 0 auto 14px; display: flex; align-items: stretch; overflow-x: auto; white-space: nowrap; border: 1px solid var(--line); background: rgba(17,23,19,.94); }
.back-link[b-tn736eka6s] { display: flex; align-items: center; padding: 0 13px; border-right: 1px solid var(--line); color: var(--gold); text-decoration: none; font: 800 .63rem ui-monospace, monospace; letter-spacing: .1em; text-transform: uppercase; }
.device-picker[b-tn736eka6s] { display: flex; align-items: center; gap: 8px; padding: 6px 10px; border-right: 1px solid var(--line); color: var(--muted); font: 700 .52rem ui-monospace, monospace; letter-spacing: .12em; }
.device-picker select[b-tn736eka6s] { width: 202px; min-height: 32px; padding: 0 9px; border: 1px solid #354139; border-radius: 6px; color: var(--ink); background: #111713; font: 700 .66rem ui-monospace, monospace; }
.toolbar-stat[b-tn736eka6s] { min-width: 60px; padding: 6px 10px; display: grid; align-content: center; gap: 2px; border-right: 1px solid var(--line); }
.toolbar-stat.match[b-tn736eka6s] { min-width: 112px; }
.toolbar-stat.build[b-tn736eka6s] { min-width: 118px; color: #efc77f; }
.toolbar-stat.phase[b-tn736eka6s] { min-width: 122px; flex: 1; color: var(--green); }
.toolbar-stat small[b-tn736eka6s], .connection-state[b-tn736eka6s] { color: var(--muted); font: 700 .5rem ui-monospace, monospace; letter-spacing: .1em; }
.toolbar-stat b[b-tn736eka6s] { font: 750 .68rem ui-monospace, monospace; }
.new-match[b-tn736eka6s] { padding: 0 14px; border: 0; border-right: 1px solid var(--line); color: var(--gold); background: transparent; font-size: .7rem; font-weight: 850; cursor: pointer; }
.connection-state[b-tn736eka6s] { display: flex; align-items: center; gap: 8px; padding: 0 13px; font-size: .62rem; letter-spacing: 0; }
.connection-state i[b-tn736eka6s] { width: 8px; height: 8px; border-radius: 50%; background: var(--red); box-shadow: 0 0 10px currentColor; }
.connection-state.connected i[b-tn736eka6s] { background: var(--green); }
.connection-state.connecting i[b-tn736eka6s], .connection-state.reconnecting i[b-tn736eka6s] { background: var(--gold); animation: pulse-b-tn736eka6s 1s infinite alternate; }
@keyframes pulse-b-tn736eka6s { to { opacity: .35; } }

.launch-panel[b-tn736eka6s] { max-width: 880px; margin: 12vh auto 0; padding: clamp(26px, 5vw, 54px); display: grid; gap: 24px; border: 1px solid var(--line); border-radius: 24px; background: linear-gradient(145deg, rgba(30,40,33,.96), rgba(13,17,15,.97)); box-shadow: 0 28px 80px rgba(0,0,0,.4); }
.launch-panel h1[b-tn736eka6s] { margin: 8px 0; font: 700 clamp(2rem, 6vw, 4rem) Georgia, serif; }
.launch-panel p[b-tn736eka6s], .empty-copy[b-tn736eka6s] { color: var(--muted); }
.primary-action[b-tn736eka6s], .game-over-modal button[b-tn736eka6s] { justify-self: start; padding: 14px 19px; border: 0; border-radius: 8px; color: #17120b; background: var(--gold); font-weight: 900; letter-spacing: .06em; cursor: pointer; }
.error-copy[b-tn736eka6s], .inline-error[b-tn736eka6s] { padding-left: 12px; border-left: 3px solid var(--red); color: #f2a59d !important; }
.kicker[b-tn736eka6s] { color: var(--gold); font: 750 .61rem ui-monospace, monospace; letter-spacing: .15em; }

.combat-grid[b-tn736eka6s] { max-width: 1480px; margin: 0 auto; display: grid; grid-template-columns: minmax(0, auto) minmax(260px, 330px); justify-content: center; gap: 14px; }
.battle-column[b-tn736eka6s] { min-width: 0; overflow: auto; }
.arena-frame[b-tn736eka6s] { width: var(--device-width); height: var(--device-height); display: grid; grid-template-rows: 28px minmax(0,1fr) 28px; overflow: hidden; border: 1px solid var(--line); border-radius: 18px; background: #0d110f; box-shadow: 0 22px 70px rgba(0,0,0,.34); container: phone / inline-size; }
.arena-label[b-tn736eka6s] { padding: 8px 12px; display: flex; justify-content: space-between; color: #748077; background: #0b0e0c; font: 750 .55rem ui-monospace, monospace; letter-spacing: .13em; }
.arena-label.bottom[b-tn736eka6s] { color: #aa946d; }
/*
  The arena carries the authoritative map aspect ratio (--map-w / --map-h) and is
  letterboxed inside the device frame. Because the box matches the world proportions,
  a square world object renders square without any hardcoded row constant, and both
  axes project through their own map extent.
*/
/* Top-aligned so the letterbox slack sits under the decision board, not above the action. */
.combat-arena[b-tn736eka6s] { position: relative; min-height: 0; overflow: hidden; isolation: isolate; display: grid; place-items: start center; background: #070a0c; }
.arena-world[b-tn736eka6s] { position: relative; width: 100%; max-height: 100%; aspect-ratio: var(--map-w) / var(--map-h); overflow: hidden; background: #0c100e; }
.arena-world[b-tn736eka6s]::after { content: ""; position: absolute; z-index: 700; inset: 0; pointer-events: none; box-shadow: inset 0 0 76px rgba(0,0,0,.82); }

.arena-overlay-layer[b-tn736eka6s] { position: absolute; z-index: 800; inset: 0; pointer-events: none; }
.targeting-banner[b-tn736eka6s] { position: absolute; z-index: 4; top: 8px; left: 8px; right: 8px; min-height: 52px; padding: 8px 70px 8px 10px; display: grid; gap: 2px; border: 1px solid rgba(216,173,99,.7); border-radius: 9px; color: var(--ink); background: rgba(19,24,20,.94); box-shadow: 0 8px 28px rgba(0,0,0,.4); pointer-events: auto; }
.targeting-banner span[b-tn736eka6s] { color: var(--gold); font: 850 .48rem ui-monospace, monospace; letter-spacing: .12em; }
.targeting-banner b[b-tn736eka6s] { font-size: .72rem; }.targeting-banner small[b-tn736eka6s] { color: #aeb6ad; font-size: .55rem; }
.targeting-banner button[b-tn736eka6s] { position: absolute; right: 8px; top: 8px; padding: 5px 7px; border: 1px solid #465149; border-radius: 5px; color: #c5cdc3; background: #19201b; font-size: .52rem; cursor: pointer; }

/* Translucent so the party deployment zone stays readable behind the board. */
.decision-board[b-tn736eka6s] { position: absolute; left: 7px; right: 7px; bottom: 7px; height: 288px; padding: 10px; display: grid; grid-template-rows: auto auto auto minmax(52px,1fr) auto; gap: 7px; overflow: hidden; border: 1px solid #455148; border-radius: 12px; color: var(--ink); background: linear-gradient(160deg, rgba(23,30,25,.74), rgba(9,13,11,.86)); backdrop-filter: blur(5px) saturate(.8); box-shadow: 0 16px 44px rgba(0,0,0,.55); pointer-events: auto; }
/* Text stays legible over the see-through board without hiding the units behind it. */
.decision-head h2[b-tn736eka6s], .decision-copy[b-tn736eka6s], .decision-actions > span[b-tn736eka6s] { text-shadow: 0 1px 4px rgba(0,0,0,.9); }
.decision-head[b-tn736eka6s] { display: flex; align-items: start; justify-content: space-between; gap: 9px; }
.decision-head h2[b-tn736eka6s] { margin: 2px 0 0; max-width: 210px; overflow: hidden; font: 800 .91rem Georgia, serif; text-overflow: ellipsis; white-space: nowrap; }
.deadline[b-tn736eka6s] { min-width: 69px; padding: 5px 6px; display: grid; justify-items: end; border-left: 1px solid #39433d; }
.deadline small[b-tn736eka6s] { color: var(--muted); font: 700 .42rem ui-monospace, monospace; }.deadline b[b-tn736eka6s] { color: var(--green); font: 850 .75rem ui-monospace, monospace; }.deadline.urgent b[b-tn736eka6s] { color: var(--red); }
.decision-copy[b-tn736eka6s] { height: 26px; margin: 0; overflow: hidden; color: #aeb6ad; font-size: .57rem; line-height: 1.35; }
.card-strip[b-tn736eka6s] { display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); gap: 5px; }
.decision-card[b-tn736eka6s] { min-width: 0; min-height: 58px; padding: 5px 3px; display: grid; justify-items: center; align-content: center; gap: 2px; border: 1px solid #39453e; border-radius: 7px; color: #d9ded5; background: linear-gradient(145deg,#202821,#141a16); cursor: pointer; }
.decision-card > span[b-tn736eka6s] { color: #ecc77f; font-size: 1rem; line-height: 1; }.decision-card b[b-tn736eka6s] { max-width: 100%; overflow: hidden; font-size: .5rem; text-overflow: ellipsis; white-space: nowrap; }.decision-card small[b-tn736eka6s] { color: #8f998f; font: 650 .44rem ui-monospace, monospace; }
.decision-card.selected[b-tn736eka6s] { border-color: var(--gold); background: linear-gradient(145deg,#343a2d,#1c221b); box-shadow: inset 0 0 0 1px rgba(216,173,99,.25); }
.decision-card:disabled[b-tn736eka6s], .power-chip:disabled[b-tn736eka6s] { opacity: .38; cursor: not-allowed; }
.power-strip[b-tn736eka6s] { min-height: 52px; display: flex; gap: 5px; overflow-x: auto; scrollbar-width: thin; }
.power-chip[b-tn736eka6s] { min-width: 132px; padding: 5px 7px; display: grid; grid-template-columns: 22px 1fr; align-items: center; gap: 5px; border: 1px solid #344139; border-radius: 7px; color: #dce2d9; text-align: left; background: #121915; cursor: pointer; }
.power-chip > span:first-child[b-tn736eka6s] { color: #9ed2b0; font-size: .85rem; }.power-chip > span:last-child[b-tn736eka6s] { min-width: 0; display: grid; gap: 2px; }.power-chip b[b-tn736eka6s] { overflow: hidden; font-size: .51rem; text-overflow: ellipsis; white-space: nowrap; }.power-chip small[b-tn736eka6s] { overflow: hidden; color: #849087; font: 650 .43rem ui-monospace, monospace; text-overflow: ellipsis; white-space: nowrap; }
.power-chip.selected[b-tn736eka6s] { border-color: #71c293; background: #18271e; box-shadow: inset 0 0 0 1px rgba(101,196,141,.18); }
.decision-actions[b-tn736eka6s] { display: flex; align-items: center; justify-content: space-between; gap: 8px; border-top: 1px solid #303a34; padding-top: 7px; }.decision-actions > span[b-tn736eka6s] { color: #8e998f; font: 700 .48rem ui-monospace, monospace; }
.submit-decision[b-tn736eka6s] { min-height: 31px; padding: 0 11px; border: 1px solid #e0b76d; border-radius: 6px; color: #17120b; background: var(--gold); font: 900 .53rem ui-monospace, monospace; letter-spacing: .07em; cursor: pointer; }.submit-decision:disabled[b-tn736eka6s] { opacity: .38; cursor: not-allowed; }
.resolving-banner[b-tn736eka6s] { position: absolute; left: 50%; bottom: 18px; padding: 8px 12px; display: flex; align-items: center; gap: 8px; transform: translateX(-50%); border: 1px solid #39443e; border-radius: 999px; color: #b5beb5; background: rgba(13,18,15,.9); font: 750 .5rem ui-monospace, monospace; letter-spacing: .08em; }.resolving-banner i[b-tn736eka6s] { width: 7px; height: 7px; border-radius: 50%; background: var(--green); animation: pulse-b-tn736eka6s .8s infinite alternate; }

.game-over-overlay[b-tn736eka6s] { position: absolute; z-index: 5; inset: 0; display: grid; place-items: center; padding: 20px; background: rgba(4,7,5,.72); backdrop-filter: blur(3px); pointer-events: auto; }
.game-over-modal[b-tn736eka6s] { width: min(88%,310px); padding: 23px 18px; display: grid; justify-items: center; gap: 10px; border: 1px solid #4a574e; border-radius: 15px; text-align: center; background: linear-gradient(155deg,#1c251f,#0a0e0c); box-shadow: 0 22px 60px rgba(0,0,0,.7); }.game-over-modal h2[b-tn736eka6s] { margin: 0; color: #f0eadc; font: 800 2.2rem Georgia,serif; }.game-over-modal p[b-tn736eka6s] { margin: 0 0 5px; color: #abb4aa; font-size: .72rem; }

.combat-sidebar[b-tn736eka6s] { height: min(852px,calc(100vh - 90px)); display: grid; grid-template-rows: auto minmax(0,1fr); gap: 14px; }
.selection-panel[b-tn736eka6s], .event-panel[b-tn736eka6s] { overflow: hidden; border: 1px solid var(--line); border-radius: 12px; background: rgba(17,23,19,.92); }
.selection-panel[b-tn736eka6s] { padding: 16px; display: grid; gap: 9px; }.selection-panel h2[b-tn736eka6s] { margin: 0; font: 760 1.15rem Georgia,serif; }.selection-panel article[b-tn736eka6s] { padding: 9px; display: grid; gap: 3px; border: 1px solid #303b34; border-radius: 7px; background: #141b17; }.selection-panel article b[b-tn736eka6s] { font-size: .72rem; }.selection-panel article span[b-tn736eka6s] { color: #96a097; font-size: .6rem; }.selection-panel .power-summary[b-tn736eka6s] { border-color: rgba(101,196,141,.28); }
.authority-note[b-tn736eka6s] { color: #7f8b81; font-size: .58rem; line-height: 1.45; }
.inline-error[b-tn736eka6s] { margin: 3px 0 0; font-size: .62rem; line-height: 1.4; }
.context-delivery[b-tn736eka6s] { padding: 10px; display: grid; gap: 5px; border: 1px solid rgba(216,173,99,.58); border-radius: 8px; background: rgba(42,34,20,.76); }
.context-delivery > span[b-tn736eka6s] { color: #e7bd73; font: 850 .48rem ui-monospace,monospace; letter-spacing: .1em; }
.context-delivery > b[b-tn736eka6s] { font-size: .7rem; }.context-delivery > small[b-tn736eka6s] { color: #a99b82; font: 700 .48rem ui-monospace,monospace; }
.context-delivery.unconfirmed[b-tn736eka6s] { border-color: rgba(211,110,100,.72); background: rgba(51,25,22,.78); }
.context-delivery.unconfirmed > span[b-tn736eka6s] { color: #f1a39b; }.context-delivery p[b-tn736eka6s] { margin: 2px 0; color: #c9b7b3; font-size: .56rem; line-height: 1.4; }
.context-delivery div[b-tn736eka6s] { display: flex; flex-wrap: wrap; gap: 6px; }.context-delivery button[b-tn736eka6s] { min-height: 30px; padding: 5px 8px; border: 1px solid #c99c58; border-radius: 6px; color: #1a150e; background: #d8ad63; font-size: .54rem; font-weight: 850; cursor: pointer; }.context-delivery button.cancel[b-tn736eka6s] { border-color: #6d7770; color: #c7cec5; background: #19201b; }.context-delivery button:disabled[b-tn736eka6s] { opacity: .4; cursor: not-allowed; }
.event-panel[b-tn736eka6s] { min-height: 0; display: flex; flex-direction: column; }.event-panel > header[b-tn736eka6s] { padding: 14px 16px; display: grid; gap: 4px; border-bottom: 1px solid var(--line); }.event-list[b-tn736eka6s] { overflow: auto; }.event-row[b-tn736eka6s] { padding: 9px 12px; display: grid; grid-template-columns: 34px 1fr; gap: 8px; border-bottom: 1px solid rgba(40,48,44,.72); }.event-row time[b-tn736eka6s] { color: #69736b; font: 650 .6rem ui-monospace,monospace; }.event-row p[b-tn736eka6s] { margin: 0; color: #aeb6ad; font-size: .68rem; line-height: 1.35; }.event-row.attack p[b-tn736eka6s],.event-row.ability p[b-tn736eka6s] { color: #e1bd82; }.event-row.heal p[b-tn736eka6s] { color: #79c99a; }.event-row.death p[b-tn736eka6s] { color: #dc8178; }.empty-copy[b-tn736eka6s] { margin: 0; padding: 10px 0; font-size: .68rem; }

/* Camera/Aree: the map occupies one exact area-shaped viewport. The permanent
   84 px command bar is a sibling below it, so no map content can sit underneath. */
.arena-frame[b-tn736eka6s] { height: auto; display: block; }
.camera-viewport[b-tn736eka6s] { position: relative; width: 100%; aspect-ratio: var(--view-w) / var(--view-h); overflow: hidden; isolation: isolate; background: #070a0c; }
.camera-viewport .arena-world[b-tn736eka6s] { position: absolute; inset: 0; width: 100%; height: 100%; max-height: none; aspect-ratio: auto; }
.camera-viewport .arena-overlay-layer[b-tn736eka6s] { position: absolute; z-index: 800; inset: 0; pointer-events: none; }
.map-input-layer[b-tn736eka6s] { position: absolute; z-index: 10; inset: 0; cursor: crosshair; }

.scene-nameplate[b-tn736eka6s] { position: absolute; z-index: 1; top: 8px; left: 50%; min-width: 130px; padding: 5px 9px; display: grid; justify-items: center; gap: 1px; transform: translateX(-50%); border: 1px solid rgba(54,66,58,.8); border-radius: 7px; color: #d9e0d7; background: rgba(10,14,11,.8); backdrop-filter: blur(3px); pointer-events: none; }
.scene-nameplate b[b-tn736eka6s] { font: 800 .63rem Georgia,serif; }.scene-nameplate span[b-tn736eka6s] { color: #8f9b90; font: 750 .42rem ui-monospace,monospace; letter-spacing: .08em; }

.zoom-control[b-tn736eka6s],.scene-bubble[b-tn736eka6s],.main-menu-button[b-tn736eka6s] { position: absolute; z-index: 8; top: 8px; min-width: 48px; min-height: 48px; border: 1px solid #a9874e; border-radius: 9px; color: #f0d69f; background: rgba(17,23,19,.94); box-shadow: 0 7px 22px rgba(0,0,0,.45); pointer-events: auto; cursor: pointer; touch-action: none; }
.zoom-control[b-tn736eka6s] { left: 8px; padding: 4px; display: grid; place-items: center; gap: 0; }
.zoom-control span[b-tn736eka6s] { font: 900 1rem ui-monospace,monospace; line-height: 1; }.zoom-control b[b-tn736eka6s] { font: 850 .43rem ui-monospace,monospace; }
.zoom-control.locked[b-tn736eka6s] { color: #17120b; background: #d8ad63; }
.scene-bubble[b-tn736eka6s] { left: 8px; width: 78px; padding: 3px 5px; display: grid; grid-template-columns: 30px 1fr; grid-template-rows: 24px 14px; align-items: center; animation: scene-pulse-b-tn736eka6s .9s ease-in-out infinite alternate; }
.scene-bubble img[b-tn736eka6s] { grid-row: 1 / 3; width: 30px; height: 38px; object-fit: contain; image-rendering: pixelated; }.scene-bubble b[b-tn736eka6s] { font: 900 .7rem ui-monospace,monospace; }.scene-bubble small[b-tn736eka6s] { overflow: hidden; font: 750 .4rem ui-monospace,monospace; text-overflow: ellipsis; white-space: nowrap; }
@keyframes scene-pulse-b-tn736eka6s { to { box-shadow: 0 0 0 4px rgba(216,173,99,.16),0 7px 22px rgba(0,0,0,.5); } }

.main-menu-button[b-tn736eka6s] { right: 8px; width: 48px; padding: 0; font-size: 1.15rem; }
.main-menu[b-tn736eka6s] { position: absolute; z-index: 12; top: 61px; right: 8px; width: 150px; padding: 5px; display: grid; gap: 3px; border: 1px solid #4a574e; border-radius: 9px; background: rgba(15,21,17,.97); box-shadow: 0 12px 34px rgba(0,0,0,.58); pointer-events: auto; }
.main-menu button[b-tn736eka6s] { min-height: 34px; padding: 0 9px; border: 0; border-radius: 5px; color: #d7ded5; text-align: left; background: transparent; font-size: .61rem; cursor: pointer; }.main-menu button:hover[b-tn736eka6s],.main-menu button:focus-visible[b-tn736eka6s] { color: #f2d59a; background: #273028; }

.combat-snackbar[b-tn736eka6s] { position: absolute; z-index: 11; top: 63px; left: 50%; width: min(72%,280px); min-height: 38px; padding: 7px 10px; transform: translateX(-50%); border: 1px solid #d8ad63; border-radius: 8px; color: #f2dcae; text-align: center; background: rgba(37,30,18,.96); box-shadow: 0 10px 30px rgba(0,0,0,.55); font-size: .57rem; pointer-events: auto; }
.combat-snackbar.alarm[b-tn736eka6s] { border-color: #d36e64; color: #ffd4cf; background: rgba(57,22,22,.97); }.combat-snackbar.navigable[b-tn736eka6s] { cursor: pointer; }.combat-snackbar:disabled[b-tn736eka6s] { opacity: 1; cursor: default; }
.combat-snackbar b[b-tn736eka6s] { margin-left: 4px; font: 900 .45rem ui-monospace,monospace; letter-spacing: .06em; }

.camera-viewport .targeting-banner[b-tn736eka6s] { top: 111px; }
.camera-viewport .resolving-banner[b-tn736eka6s] { bottom: 12px; }

.context-menu[b-tn736eka6s] { position: absolute; z-index: 15; width: min(210px,78%); padding: 7px; display: grid; gap: 4px; transform: translate(-50%,-10px); border: 1px solid #a9874e; border-radius: 10px; color: #e7ece4; background: rgba(14,20,16,.98); box-shadow: 0 14px 38px rgba(0,0,0,.68); pointer-events: auto; }
.context-menu > span[b-tn736eka6s] { color: #c9a766; font: 850 .45rem ui-monospace,monospace; letter-spacing: .1em; }.context-menu header[b-tn736eka6s] { min-height: 38px; display: flex; align-items: center; gap: 7px; border-bottom: 1px solid #354138; }.context-menu header img[b-tn736eka6s] { width: 34px; height: 38px; object-fit: contain; image-rendering: pixelated; }.context-menu header b[b-tn736eka6s] { font: 800 .67rem Georgia,serif; }.context-menu header small[b-tn736eka6s] { margin-left: auto; color: #8d988f; font-size: .5rem; }
.context-menu > button[b-tn736eka6s] { min-height: 34px; padding: 6px 8px; border: 1px solid #364239; border-radius: 6px; color: #dbe1d8; text-align: left; background: #18201a; font-size: .58rem; cursor: pointer; }.context-menu > button:hover[b-tn736eka6s],.context-menu > button:focus-visible[b-tn736eka6s] { border-color: #d8ad63; color: #f1d7a3; }.context-menu > button:disabled[b-tn736eka6s] { opacity: .4; cursor: not-allowed; }
.context-menu.overlap[b-tn736eka6s] { width: min(260px,86%); }
.portrait-picker[b-tn736eka6s] { display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); gap: 4px; }.portrait-picker button[b-tn736eka6s] { min-width: 0; height: 54px; padding: 2px; display: grid; place-items: center; border: 1px solid #354139; border-radius: 6px; color: #aeb8af; background: #111713; cursor: pointer; }.portrait-picker img[b-tn736eka6s] { width: 31px; height: 34px; object-fit: contain; image-rendering: pixelated; }.portrait-picker span[b-tn736eka6s] { max-width: 100%; overflow: hidden; font: 750 .36rem ui-monospace,monospace; text-overflow: ellipsis; white-space: nowrap; }.portrait-picker button.selected[b-tn736eka6s] { border-color: #d8ad63; color: #f1d8a7; background: #2d2b20; }.portrait-picker .multi-select[b-tn736eka6s] { font-size: 1rem; }.portal-go[b-tn736eka6s] { text-align: center !important; color: #17120b !important; background: #d8ad63 !important; font-weight: 900 !important; }

.command-bar[b-tn736eka6s] { height: 84px; padding: 7px 6px; overflow: hidden; border-top: 1px solid #3a463e; background: linear-gradient(180deg,#111813,#0b100d); }
.command-strip[b-tn736eka6s] { height: 70px; display: flex; align-items: center; gap: 6px; overflow-x: auto; overflow-y: hidden; scrollbar-width: thin; scroll-snap-type: x proximity; }
.command-card[b-tn736eka6s] { flex: 0 0 54px; width: 54px; height: 62px; min-width: 54px; min-height: 62px; padding: 3px; display: grid; place-items: center; align-content: center; gap: 2px; scroll-snap-align: start; border: 1px solid #3c493f; border-radius: 7px; color: #dce2d9; background: linear-gradient(145deg,#202821,#121813); cursor: pointer; }
.command-card > span[b-tn736eka6s] { color: #e8bd70; font-size: .98rem; line-height: 1; }.command-card b[b-tn736eka6s] { width: 100%; overflow: hidden; font: 850 .4rem ui-monospace,monospace; text-overflow: ellipsis; white-space: nowrap; }.command-card small[b-tn736eka6s] { width: 100%; overflow: hidden; color: #88938a; font: 700 .35rem ui-monospace,monospace; text-overflow: ellipsis; white-space: nowrap; }.command-card.context[b-tn736eka6s] { border-color: #6d5b38; }.command-card.power > span[b-tn736eka6s] { color: #8fd0a6; }.command-card.selected[b-tn736eka6s] { border-color: #e1b86c; background: linear-gradient(145deg,#3a3a2b,#20251d); box-shadow: inset 0 0 0 1px rgba(216,173,99,.25); }.command-card.commit[b-tn736eka6s] { border-color: #71bd8e; color: #dff4e6; }.command-card.commit > span[b-tn736eka6s] { color: #78ca98; }.command-card:disabled[b-tn736eka6s] { opacity: .34; cursor: not-allowed; }

/* Static map sprites are already tightly cropped to their bodies. Their buttons are
   therefore the body hit target and remain touchable outside explicit targeting. */
.combat-unit[b-tn736eka6s] { pointer-events: auto; cursor: pointer; }
.combat-unit.hero:hover img[b-tn736eka6s],.combat-unit.hero:focus-visible img[b-tn736eka6s] { filter: saturate(1.08) drop-shadow(0 0 9px rgba(224,186,108,.72)) drop-shadow(0 6px 5px rgba(0,0,0,.55)); }
.combat-unit.monster:hover img[b-tn736eka6s],.combat-unit.monster:focus-visible img[b-tn736eka6s] { filter: saturate(.9) drop-shadow(0 0 9px rgba(211,110,100,.68)) drop-shadow(0 6px 5px rgba(0,0,0,.55)); }

@media (max-width: 900px) { .combat-grid[b-tn736eka6s] { grid-template-columns: 1fr; justify-items: center; }.combat-sidebar[b-tn736eka6s] { width: min(100%,440px); height: auto; grid-template-rows: auto 300px; }.device-picker select[b-tn736eka6s] { width: 180px; } }
@media (max-width: 520px) { .combat-shell[b-tn736eka6s] { padding: 8px; }.combat-toolbar[b-tn736eka6s] { margin-bottom: 8px; }.arena-frame[b-tn736eka6s] { border-radius: 10px; }.combat-sidebar[b-tn736eka6s] { width: 100%; } }
@container phone (max-width: 380px) { .decision-board[b-tn736eka6s] { height: 278px; }.decision-card b[b-tn736eka6s] { font-size: .46rem; }.power-chip[b-tn736eka6s] { min-width: 122px; }.decision-head h2[b-tn736eka6s] { max-width: 180px; } }

@media (prefers-reduced-motion: reduce) {
  .connection-state.connecting i[b-tn736eka6s], .connection-state.reconnecting i[b-tn736eka6s], .resolving-banner i[b-tn736eka6s],.scene-bubble[b-tn736eka6s] { animation: none; }
}
/* /Features/Combat/Map/AreaGridOverlay.razor.rz.scp.css */
.area-grid[b-va8v5b3r7j] { position: absolute; z-index: 15; inset: 0; overflow: hidden; pointer-events: none; }
.area-grid i[b-va8v5b3r7j] { position: absolute; opacity: .62; border-color: rgba(225, 190, 118, .55); border-style: dashed; }
.area-grid i.vertical[b-va8v5b3r7j] { top: 0; bottom: 0; border-left-width: 1px; }
.area-grid i.horizontal[b-va8v5b3r7j] { left: 0; right: 0; border-top-width: 1px; }
.area-grid b[b-va8v5b3r7j] { position: absolute; padding: 2px 4px; transform: translate(-50%, -50%); border: 1px solid rgba(216, 173, 99, .28); border-radius: 999px; color: rgba(240, 215, 166, .72); background: rgba(8, 11, 9, .68); font: 800 .48rem ui-monospace, monospace; }
/* /Features/Combat/Map/ArenaGround.razor.rz.scp.css */
/*
  Decorative ground stack for the ruins-at-dusk battlefield.
  Every layer is inert: pointer-events are disabled and nothing here is targetable.
  --map-cols / --map-rows come from the authoritative MapSnapshot via MapProjection.

  The three ground textures are 6x6 cell patches of pixel art. They are sized so one
  source tile covers exactly one world cell, which keeps their scale locked to the props
  (both shrink together as the arena scales down on smaller devices).
*/
.ground[b-nh7drcoi4q] {
  /* One texture patch spans six cells on each axis. */
  --patch-w: calc(100% * 6 / var(--map-cols, 14));
  --patch-h: calc(100% * 6 / var(--map-rows, 26));
  position: absolute;
  inset: 0;
  overflow: hidden;
  pointer-events: none;
}

.ground > *[b-nh7drcoi4q] {
  position: absolute;
  inset: 0;
}

.ground-soil[b-nh7drcoi4q],
.ground-stone[b-nh7drcoi4q],
.ground-moss[b-nh7drcoi4q] {
  background-size: var(--patch-w) var(--patch-h);
  background-repeat: repeat;
  image-rendering: pixelated;
}

/* Base soil across the whole field. */
.ground-soil[b-nh7drcoi4q] {
  background-image: url("assets/combat-map/ground/ground-base.png");
}

/*
  Paved stone through the middle of the arena, masked into an irregular plaza.
  Decorative only: the paving does not mark walkable or blocked ground.
*/
.ground-stone[b-nh7drcoi4q] {
  opacity: .5;
  background-image: url("assets/combat-map/ground/ground-stone.png");
  -webkit-mask-image:
    radial-gradient(ellipse 46% 15% at 42% 44%, #000 30%, transparent 72%),
    radial-gradient(ellipse 34% 10% at 62% 56%, #000 28%, transparent 74%),
    radial-gradient(ellipse 26% 8% at 30% 62%, #000 26%, transparent 76%);
  mask-image:
    radial-gradient(ellipse 46% 15% at 42% 44%, #000 30%, transparent 72%),
    radial-gradient(ellipse 34% 10% at 62% 56%, #000 28%, transparent 74%),
    radial-gradient(ellipse 26% 8% at 30% 62%, #000 26%, transparent 76%);
}

/* Overgrowth reclaiming the ruins. Cosmetic - never a cover hint. */
.ground-moss[b-nh7drcoi4q] {
  opacity: .62;
  background-image: url("assets/combat-map/ground/ground-moss.png");
  -webkit-mask-image:
    radial-gradient(ellipse 20% 7% at 20% 30%, #000 24%, transparent 76%),
    radial-gradient(ellipse 16% 6% at 74% 20%, #000 22%, transparent 78%),
    radial-gradient(ellipse 24% 8% at 64% 72%, #000 24%, transparent 78%),
    radial-gradient(ellipse 14% 5% at 32% 84%, #000 22%, transparent 78%),
    radial-gradient(ellipse 18% 6% at 84% 50%, #000 22%, transparent 78%);
  mask-image:
    radial-gradient(ellipse 20% 7% at 20% 30%, #000 24%, transparent 76%),
    radial-gradient(ellipse 16% 6% at 74% 20%, #000 22%, transparent 78%),
    radial-gradient(ellipse 24% 8% at 64% 72%, #000 24%, transparent 78%),
    radial-gradient(ellipse 14% 5% at 32% 84%, #000 22%, transparent 78%),
    radial-gradient(ellipse 18% 6% at 84% 50%, #000 22%, transparent 78%);
}

/*
  Deployment zones: readable bands at each end of the arena. They mark where each
  side starts, not where it may legally stand - the server owns all movement rules.
*/
.deploy-zone[b-nh7drcoi4q] {
  inset: auto 0 auto 0;
  height: 17%;
}

.deploy-zone.monsters[b-nh7drcoi4q] {
  top: 0;
  background:
    linear-gradient(180deg, rgba(164, 76, 88, .28), transparent 84%),
    repeating-linear-gradient(115deg, rgba(180, 96, 106, .08) 0 6px, transparent 6px 14px);
  border-bottom: 1px solid rgba(178, 100, 110, .26);
}

.deploy-zone.heroes[b-nh7drcoi4q] {
  bottom: 0;
  background:
    linear-gradient(0deg, rgba(204, 160, 88, .28), transparent 84%),
    repeating-linear-gradient(65deg, rgba(212, 176, 110, .08) 0 6px, transparent 6px 14px);
  border-top: 1px solid rgba(214, 176, 108, .28);
}

/*
  Measured grid at one cell = 5 ft, sized from the authoritative column/row counts.
  Kept faint: it aids distance reading without implying tile-based movement.
*/
.ground-grid[b-nh7drcoi4q] {
  opacity: .42;
  background-image:
    linear-gradient(rgba(206, 220, 202, .05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(206, 220, 202, .05) 1px, transparent 1px);
  background-size:
    100% calc(100% / var(--map-rows, 26)),
    calc(100% / var(--map-cols, 14)) 100%;
}

/*
  Low warm sun raking across the ruins from the upper left. Kept restrained: the
  ground texture now carries the visual interest these gradients used to supply.
*/
.dusk-light[b-nh7drcoi4q] {
  mix-blend-mode: screen;
  opacity: .28;
  background:
    radial-gradient(ellipse 82% 46% at 14% 8%, rgba(238, 164, 84, .58), transparent 68%),
    radial-gradient(ellipse 46% 30% at 30% 30%, rgba(226, 142, 72, .26), transparent 72%),
    radial-gradient(ellipse 64% 44% at 90% 86%, rgba(78, 116, 144, .34), transparent 72%);
}

/* Ground haze pooling toward the far end of the arena. */
.ground-fog[b-nh7drcoi4q] {
  opacity: .24;
  background:
    linear-gradient(180deg, rgba(146, 166, 176, .3) 0%, transparent 26%),
    radial-gradient(ellipse 90% 22% at 50% 8%, rgba(158, 176, 184, .22), transparent 72%);
}

.ground-vignette[b-nh7drcoi4q] {
  box-shadow:
    inset 0 0 90px rgba(4, 7, 9, .8),
    inset 0 0 30px rgba(4, 7, 9, .45);
}

/* Small arenas: drop the finest detail so the field stays legible. */
@container phone (max-width: 380px) {
  .ground-moss[b-nh7drcoi4q] { opacity: .5; }
  .ground-grid[b-nh7drcoi4q] { opacity: .3; }
}
/* /Features/Combat/Map/MapObjectLayer.razor.rz.scp.css */
/*
  Map object presentation. The sprite is artwork; the footprint is the authoritative
  collision circle (MapObjectSnapshot.Radius) and is revealed only while targeting so
  the player can see exactly what the server considers solid.
*/
.map-object[b-dnhkclw7u5] {
  position: absolute;
  padding: 0;
  border: 0;
  transform: translate(-50%, -50%);
  background: transparent;
  pointer-events: none;
}

.map-object img[b-dnhkclw7u5] {
  position: relative;
  z-index: 3;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  image-rendering: pixelated;
  transform: rotate(var(--rotation));
  transform-origin: 50% 62%;
}

/* Dusk grade: warm stone keeps its colour, cold stone sinks into the distance. */
.map-object.warm img[b-dnhkclw7u5] {
  filter: saturate(.82) brightness(.84) drop-shadow(0 6px 5px rgba(0, 0, 0, .5));
}

.map-object.cold img[b-dnhkclw7u5] {
  filter: saturate(.6) brightness(.72) hue-rotate(-8deg) drop-shadow(0 6px 5px rgba(0, 0, 0, .5));
}

/* Soft contact shadow grounding the sprite to the soil. */
.object-shadow[b-dnhkclw7u5] {
  position: absolute;
  z-index: 1;
  left: 50%;
  top: 62%;
  width: 92%;
  height: 46%;
  transform: translate(-50%, -50%);
  border-radius: 50%;
  background: radial-gradient(ellipse at center, rgba(4, 7, 5, .55), transparent 70%);
}

/*
  Authoritative collision footprint. Sized from Radius, so it is deliberately allowed
  to differ from the artwork silhouette - the circle is the truth, the sprite is not.
*/
.object-footprint[b-dnhkclw7u5] {
  position: absolute;
  z-index: 2;
  left: 50%;
  top: 50%;
  width: var(--footprint-x);
  height: var(--footprint-y);
  transform: translate(-50%, -50%);
  border: 1px solid rgba(151, 171, 143, .1);
  border-radius: 50%;
  background: rgba(5, 8, 6, .16);
  transition: border-color .16s ease, box-shadow .16s ease, background-color .16s ease;
}

.map-object.targetable[b-dnhkclw7u5] {
  pointer-events: auto;
  cursor: crosshair;
}

/* While targeting, the real collision circle becomes explicit. */
.map-object.targetable .object-footprint[b-dnhkclw7u5] {
  border-color: rgba(216, 173, 99, .85);
  border-style: dashed;
  background: rgba(216, 173, 99, .1);
  box-shadow: 0 0 0 3px rgba(216, 173, 99, .12), 0 0 14px rgba(216, 173, 99, .3);
}

.map-object.targetable:hover .object-footprint[b-dnhkclw7u5],
.map-object.targetable:focus-visible .object-footprint[b-dnhkclw7u5] {
  border-color: #f2d59a;
  background: rgba(216, 173, 99, .2);
  box-shadow: 0 0 0 4px rgba(216, 173, 99, .22), 0 0 20px rgba(216, 173, 99, .5);
}

.map-object.targetable:focus-visible[b-dnhkclw7u5] {
  outline: 2px solid #f5e0b0;
  outline-offset: 3px;
  border-radius: 50%;
}

.map-object.interactive[b-dnhkclw7u5] { pointer-events: auto; cursor: pointer; }
.map-object.interactive img[b-dnhkclw7u5] { filter: saturate(.88) brightness(.9) drop-shadow(0 5px 5px rgba(0,0,0,.65)); }
.interaction-label[b-dnhkclw7u5] { position: absolute; z-index: 4; left: 50%; bottom: -8px; padding: 2px 4px; transform: translateX(-50%) rotate(calc(-1 * var(--rotation))); border: 1px solid rgba(216,173,99,.48); border-radius: 4px; color: #efd39c; background: rgba(8,11,9,.88); font: 850 .4rem ui-monospace,monospace; letter-spacing: .08em; white-space: nowrap; }
/* /Features/Combat/Map/OffscreenTagLayer.razor.rz.scp.css */
.offscreen-tags[b-a5n28zgd8y] { position: absolute; z-index: 900; inset: 0; overflow: hidden; pointer-events: none; }
.offscreen-tag[b-a5n28zgd8y] { position: absolute; min-height: 30px; max-width: 130px; padding: 4px 7px; display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 5px; transform: translate(-50%, -50%); border: 1px solid currentColor; border-radius: 999px; color: #d8ad63; background: rgba(12, 16, 13, .92); box-shadow: 0 5px 18px rgba(0, 0, 0, .48); pointer-events: auto; cursor: pointer; }
.offscreen-tag.monster[b-a5n28zgd8y] { color: #d36e64; }
.offscreen-tag span[b-a5n28zgd8y] { overflow: hidden; font: 800 .52rem ui-monospace, monospace; text-overflow: ellipsis; white-space: nowrap; }
.offscreen-tag b[b-a5n28zgd8y] { font: 850 .5rem ui-monospace, monospace; white-space: nowrap; }
.offscreen-tag:focus-visible[b-a5n28zgd8y] { outline: 2px solid #f4e0b4; outline-offset: 2px; }
/* /Features/Combat/Map/TargetLines.razor.rz.scp.css */
/*
  Target relationship lines. A blocked line means the server reported TargetVisible=false;
  it is a readout of authoritative state, not a client-side line-of-sight calculation.
*/
.target-lines[b-bvgrvtc9ov] {
  position: absolute;
  z-index: 1;
  inset: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
}

.target-lines line[b-bvgrvtc9ov] {
  stroke-width: .35;
  stroke-dasharray: 1.3 1.3;
  vector-effect: non-scaling-stroke;
  opacity: .42;
  animation: target-drift-b-bvgrvtc9ov 1.6s linear infinite;
}

.hero-line[b-bvgrvtc9ov] { stroke: #d8ad63; }
.monster-line[b-bvgrvtc9ov] { stroke: #aa7480; }

/* Server reports no line of sight: dimmer, tighter dashes, no drift. */
.target-lines .blocked-line[b-bvgrvtc9ov] {
  stroke: #d36e64;
  stroke-dasharray: .5 1.4;
  opacity: .24;
  animation: none;
}

@keyframes target-drift-b-bvgrvtc9ov {
  to { stroke-dashoffset: -2.6; }
}

@media (prefers-reduced-motion: reduce) {
  .target-lines line[b-bvgrvtc9ov] { animation: none; }
}
/* /Features/Combat/Map/UnitLayer.razor.rz.scp.css */
/*
  Unit presentation. Heroes read warm and lit, monsters read cold and desaturated;
  the distinction stays restrained so silhouettes remain the primary signal.
*/
.combat-unit[b-rxse63g5c8] {
  position: absolute;
  width: calc(clamp(50px, 10.5%, 72px) * var(--camera-scale, 1));
  padding: 0;
  display: grid;
  justify-items: center;
  border: 0;
  color: #edf0e7;
  background: transparent;
  transform: translate(-50%, -72%);
  transition: left .08s linear, top .08s linear, opacity .2s;
  pointer-events: auto;
  cursor: pointer;
}

/* Contact shadow anchoring the sprite to the ground plane. */
.unit-shadow[b-rxse63g5c8] {
  position: absolute;
  z-index: 0;
  left: 50%;
  bottom: 14px;
  width: 46%;
  height: 9px;
  transform: translateX(-50%);
  border-radius: 50%;
  background: radial-gradient(ellipse at center, rgba(3, 6, 4, .68), transparent 72%);
}

.combat-unit img[b-rxse63g5c8] {
  position: relative;
  z-index: 1;
  width: 100%;
  aspect-ratio: 1;
  object-fit: contain;
  image-rendering: pixelated;
  filter: drop-shadow(0 6px 5px rgba(0, 0, 0, .55));
}

.combat-unit.hero img[b-rxse63g5c8] {
  filter: saturate(1.04) drop-shadow(0 0 7px rgba(224, 186, 108, .3)) drop-shadow(0 6px 5px rgba(0, 0, 0, .55));
}

.combat-unit.monster img[b-rxse63g5c8] {
  filter: saturate(.84) brightness(.94) drop-shadow(0 0 6px rgba(150, 92, 104, .22)) drop-shadow(0 6px 5px rgba(0, 0, 0, .55));
}

.combat-unit.hero:hover img[b-rxse63g5c8],
.combat-unit.hero:focus-visible img[b-rxse63g5c8] {
  filter: saturate(1.08) drop-shadow(0 0 9px rgba(224, 186, 108, .72)) drop-shadow(0 6px 5px rgba(0, 0, 0, .55));
}

.combat-unit.monster:hover img[b-rxse63g5c8],
.combat-unit.monster:focus-visible img[b-rxse63g5c8] {
  filter: saturate(.9) drop-shadow(0 0 9px rgba(211, 110, 100, .68)) drop-shadow(0 6px 5px rgba(0, 0, 0, .55));
}

.combat-unit b[b-rxse63g5c8] {
  position: relative;
  z-index: 1;
  max-width: 84px;
  margin-top: -5px;
  overflow: hidden;
  color: #eee6d6;
  font: 800 .5rem ui-monospace, monospace;
  text-overflow: ellipsis;
  white-space: nowrap;
  text-shadow: 0 1px 3px #000, 0 2px 6px #000;
}

.combat-unit small[b-rxse63g5c8] {
  position: relative;
  z-index: 1;
  color: #bdc6bb;
  font: 750 .45rem ui-monospace, monospace;
  text-shadow: 0 1px 3px #000, 0 2px 6px #000;
}

.leader-star[b-rxse63g5c8] { margin-right: 2px; color: #f1c76e; text-shadow: 0 0 8px rgba(241, 199, 110, .8); }

.unit-hp[b-rxse63g5c8] {
  position: relative;
  z-index: 1;
  width: 78%;
  height: 3px;
  overflow: hidden;
  border-radius: 3px;
  background: #321d1d;
  box-shadow: 0 0 0 1px rgba(0, 0, 0, .55);
}

.unit-hp i[b-rxse63g5c8] {
  display: block;
  height: 100%;
  background: #65c48d;
  transition: width .18s ease;
}

.combat-unit.monster .unit-hp i[b-rxse63g5c8] { background: #d36e64; }

/* Damage escalation is readable without relying on the hero/monster hue alone. */
.unit-hp.hurt i[b-rxse63g5c8] { background: #d8ad63; }
.unit-hp.critical i[b-rxse63g5c8] { background: #d36e64; }
.combat-unit.monster .unit-hp.hurt i[b-rxse63g5c8] { background: #c98a72; }
.combat-unit.monster .unit-hp.critical i[b-rxse63g5c8] { background: #a8443c; }

.combat-unit.dead[b-rxse63g5c8] {
  opacity: .28;
  filter: grayscale(1);
}

.combat-unit.dead .unit-shadow[b-rxse63g5c8] { opacity: .4; }

.combat-unit.broken img[b-rxse63g5c8] {
  filter: drop-shadow(0 0 8px rgba(211, 110, 100, .8));
  animation: broken-shudder-b-rxse63g5c8 1.4s ease-in-out infinite;
}

@keyframes broken-shudder-b-rxse63g5c8 {
  0%, 100% { transform: translateX(0); }
  50% { transform: translateX(1.5px); }
}

.combat-unit.targetable[b-rxse63g5c8] {
  pointer-events: auto;
  cursor: crosshair;
}

.combat-unit.targetable[b-rxse63g5c8]::after {
  content: "";
  position: absolute;
  inset: 2px -4px 14px;
  border: 1px solid #d8ad63;
  border-radius: 50%;
  box-shadow: 0 0 0 4px rgba(216, 173, 99, .12), 0 0 18px rgba(216, 173, 99, .4);
  animation: target-pulse-b-rxse63g5c8 .8s infinite alternate;
}

.combat-unit.targetable:hover[b-rxse63g5c8]::after,
.combat-unit.targetable:focus-visible[b-rxse63g5c8]::after {
  border-color: #f5e0b0;
  box-shadow: 0 0 0 5px rgba(216, 173, 99, .24), 0 0 26px rgba(216, 173, 99, .6);
}

.combat-unit.targetable:focus-visible[b-rxse63g5c8] {
  outline: 2px solid #f5e0b0;
  outline-offset: 2px;
  border-radius: 10px;
}

@keyframes target-pulse-b-rxse63g5c8 {
  to { transform: scale(1.08); opacity: .55; }
}

@media (prefers-reduced-motion: reduce) {
  .combat-unit[b-rxse63g5c8] { transition: none; }
  .combat-unit.targetable[b-rxse63g5c8]::after { animation: none; }
  .combat-unit.broken img[b-rxse63g5c8] { animation: none; }
  .unit-hp i[b-rxse63g5c8] { transition: none; }
}
/* /Features/Expeditions/ExpeditionsView.razor.rz.scp.css */
:host[b-901x3rham8] {
    color: #eee7d7;
}

*[b-901x3rham8] {
    box-sizing: border-box;
}

.expeditions-shell[b-901x3rham8] {
    --ink: #11110f;
    --surface: #191915;
    --surface-raised: #22211c;
    --bone: #eee7d7;
    --muted: #9e988b;
    --rust: #c85d36;
    --gold: #c9a762;
    --moss: #667356;
    min-height: 100vh;
    overflow-x: hidden;
    background:
        radial-gradient(circle at 88% 2%, rgba(200, 93, 54, .15), transparent 24rem),
        linear-gradient(rgba(238, 231, 215, .025) 1px, transparent 1px),
        var(--ink);
    background-size: auto, 100% 5px, auto;
    color: var(--bone);
    font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    padding-bottom: calc(4rem + env(safe-area-inset-bottom));
}

.topbar[b-901x3rham8] {
    position: sticky;
    top: 0;
    z-index: 20;
    min-height: 4.4rem;
    display: grid;
    grid-template-columns: 2.5rem 1fr auto;
    align-items: center;
    gap: .75rem;
    padding: .7rem 1rem;
    border-bottom: 1px solid rgba(238, 231, 215, .12);
    background: rgba(17, 17, 15, .9);
    backdrop-filter: blur(14px);
}

.topbar strong[b-901x3rham8] {
    display: block;
    font-family: Georgia, "Times New Roman", serif;
    font-size: 1.05rem;
    letter-spacing: .01em;
}

.back-link[b-901x3rham8] {
    display: grid;
    place-items: center;
    width: 2.5rem;
    height: 2.5rem;
    border: 1px solid rgba(238, 231, 215, .16);
    color: var(--bone);
    text-decoration: none;
    font-size: 1.25rem;
}

.kicker[b-901x3rham8],
.option-kind[b-901x3rham8] {
    margin: 0;
    color: var(--gold);
    font-size: .64rem;
    font-weight: 800;
    letter-spacing: .17em;
}

.evidence-chip[b-901x3rham8] {
    padding: .35rem .48rem;
    border: 1px solid rgba(201, 167, 98, .55);
    color: var(--gold);
    font-size: .55rem;
    font-weight: 850;
    letter-spacing: .12em;
}

.connection-banner[b-901x3rham8] {
    display: flex;
    gap: .75rem;
    align-items: center;
    padding: .8rem 1rem;
    color: #f2dfbd;
    background: #392b1c;
    border-bottom: 1px solid #755331;
}

.connection-banner.offline[b-901x3rham8] {
    background: #2b2a25;
    border-color: #5a574d;
}

.connection-banner strong[b-901x3rham8],
.connection-banner span[b-901x3rham8] {
    display: block;
}

.connection-banner strong[b-901x3rham8] {
    font-size: .75rem;
    letter-spacing: .05em;
}

.connection-banner div span[b-901x3rham8] {
    margin-top: .14rem;
    color: #cbbca5;
    font-size: .72rem;
}

.connection-pulse[b-901x3rham8] {
    flex: 0 0 auto;
    width: .55rem;
    height: .55rem;
    border-radius: 50%;
    background: var(--gold);
    box-shadow: 0 0 0 .3rem rgba(201, 167, 98, .14);
}

.expeditions-main[b-901x3rham8] {
    width: min(100%, 43rem);
    margin: 0 auto;
}

.hero[b-901x3rham8] {
    padding: 2.1rem 1.25rem 1.5rem;
}

h1[b-901x3rham8],
h2[b-901x3rham8],
p[b-901x3rham8] {
    margin-top: 0;
}

h1[b-901x3rham8],
h2[b-901x3rham8] {
    font-family: Georgia, "Times New Roman", serif;
    font-weight: 500;
}

.hero h1[b-901x3rham8] {
    max-width: 12ch;
    margin: .35rem 0 .8rem;
    font-size: clamp(2.4rem, 11vw, 4.5rem);
    line-height: .92;
    letter-spacing: -.045em;
}

.subtitle[b-901x3rham8] {
    max-width: 37rem;
    margin-bottom: 0;
    color: #b9b2a3;
    font-family: Georgia, "Times New Roman", serif;
    font-size: 1rem;
    font-style: italic;
    line-height: 1.55;
}

.vital-panel[b-901x3rham8] {
    margin: 0 1rem 2.2rem;
    padding: 1rem;
    border: 1px solid rgba(238, 231, 215, .13);
    background: linear-gradient(145deg, rgba(238, 231, 215, .06), rgba(238, 231, 215, .015));
}

.time-heading[b-901x3rham8] {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: 1rem;
}

.time-heading span[b-901x3rham8],
.vital-grid span[b-901x3rham8] {
    color: var(--muted);
    font-size: .58rem;
    font-weight: 800;
    letter-spacing: .15em;
}

.time-heading strong[b-901x3rham8] {
    font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
    font-size: .88rem;
}

.time-heading small[b-901x3rham8] {
    color: var(--muted);
    font-weight: 500;
}

.time-track[b-901x3rham8] {
    height: 3px;
    margin: .8rem 0 1rem;
    background: #36342e;
}

.time-track span[b-901x3rham8] {
    display: block;
    height: 100%;
    background: linear-gradient(90deg, var(--gold), var(--rust));
}

.vital-grid[b-901x3rham8] {
    display: grid;
    grid-template-columns: 1fr 1.7fr;
    gap: .75rem;
}

.vital-grid div[b-901x3rham8] {
    display: flex;
    flex-direction: column;
    gap: .2rem;
}

.vital-grid strong[b-901x3rham8] {
    font-size: .78rem;
}

.section-heading[b-901x3rham8] {
    margin-bottom: 1rem;
}

.section-heading h2[b-901x3rham8] {
    margin: .25rem 0 0;
    font-size: 1.5rem;
}

.route-section[b-901x3rham8],
.choices[b-901x3rham8],
.event-log[b-901x3rham8] {
    padding: 0 1.25rem 2.4rem;
}

.route-map[b-901x3rham8] {
    margin: 0;
    padding: 0;
    list-style: none;
}

.route-node[b-901x3rham8] {
    position: relative;
    min-height: 5rem;
    display: grid;
    grid-template-columns: 2rem 1fr auto;
    gap: .75rem;
    align-items: start;
}

.route-line[b-901x3rham8] {
    position: absolute;
    left: .82rem;
    top: 1.5rem;
    bottom: -.15rem;
    width: 1px;
    background: #4a473f;
}

.route-node:last-child .route-line[b-901x3rham8] {
    display: none;
}

.node-marker[b-901x3rham8] {
    position: relative;
    z-index: 1;
    width: 1.65rem;
    height: 1.65rem;
    display: grid;
    place-items: center;
    border: 1px solid #565248;
    border-radius: 50%;
    color: var(--muted);
    background: var(--ink);
    font-size: .65rem;
}

.route-node.current .node-marker[b-901x3rham8] {
    color: var(--rust);
    border-color: var(--rust);
    box-shadow: 0 0 0 .32rem rgba(200, 93, 54, .12);
}

.route-node.available .node-marker[b-901x3rham8] {
    border-color: var(--gold);
}

.route-node.locked[b-901x3rham8] {
    opacity: .4;
}

.node-copy[b-901x3rham8] {
    display: flex;
    flex-direction: column;
    gap: .12rem;
    padding-top: .05rem;
}

.node-copy > span[b-901x3rham8] {
    color: var(--muted);
    font-size: .55rem;
    font-weight: 800;
    letter-spacing: .14em;
}

.node-copy strong[b-901x3rham8] {
    font-family: Georgia, "Times New Roman", serif;
    font-size: 1rem;
}

.node-copy small[b-901x3rham8] {
    color: var(--muted);
    font-size: .7rem;
    line-height: 1.4;
}

button[b-901x3rham8],
.secondary-action[b-901x3rham8] {
    font: inherit;
}

.node-action[b-901x3rham8] {
    margin-top: .1rem;
    padding: .42rem .62rem;
    border: 1px solid rgba(201, 167, 98, .5);
    color: var(--gold);
    background: transparent;
    font-size: .63rem;
    font-weight: 800;
    letter-spacing: .08em;
    text-transform: uppercase;
}

button:not(:disabled)[b-901x3rham8],
a[b-901x3rham8] {
    cursor: pointer;
}

button:disabled[b-901x3rham8] {
    cursor: not-allowed;
    opacity: .42;
}

.choice-card[b-901x3rham8] {
    position: relative;
    width: 100%;
    display: grid;
    gap: .3rem;
    margin-bottom: .65rem;
    padding: 1rem 2.8rem 1rem 1rem;
    text-align: left;
    border: 1px solid rgba(238, 231, 215, .12);
    color: var(--bone);
    background: var(--surface);
}

.choice-card strong[b-901x3rham8] {
    font-family: Georgia, "Times New Roman", serif;
    font-size: 1.05rem;
}

.choice-card small[b-901x3rham8] {
    color: var(--muted);
    line-height: 1.45;
}

.choice-arrow[b-901x3rham8] {
    position: absolute;
    right: 1rem;
    top: 50%;
    color: var(--gold);
    transform: translateY(-50%);
}

.event-log article[b-901x3rham8] {
    display: grid;
    grid-template-columns: .5rem 1fr auto;
    gap: .7rem;
    align-items: baseline;
    padding: .8rem 0;
    border-top: 1px solid rgba(238, 231, 215, .09);
}

.event-log p[b-901x3rham8] {
    margin-bottom: 0;
    color: #c7c0b1;
    font-size: .78rem;
    line-height: 1.45;
}

.event-log time[b-901x3rham8] {
    color: #6f6b62;
    font: .62rem ui-monospace, monospace;
}

.event-mark[b-901x3rham8] {
    width: .35rem;
    height: .35rem;
    border-radius: 50%;
    background: var(--gold);
}

.event-mark.warning[b-901x3rham8],
.event-mark.lost[b-901x3rham8] {
    background: var(--rust);
}

.event-mark.safe[b-901x3rham8] {
    background: var(--moss);
}

.inline-error[b-901x3rham8] {
    margin: -1rem 1rem 2rem;
    padding: .75rem 1rem;
    border-left: 2px solid var(--rust);
    color: #e2baa9;
    background: rgba(200, 93, 54, .09);
    font-size: .75rem;
}

.state-card[b-901x3rham8],
.terminal-card[b-901x3rham8] {
    min-height: calc(100vh - 4.4rem);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 2rem 1.5rem;
    text-align: center;
}

.centered-state h1[b-901x3rham8],
.terminal-card h1[b-901x3rham8] {
    max-width: 11ch;
    margin: .45rem auto .8rem;
    font-size: clamp(2rem, 10vw, 3.6rem);
    line-height: 1;
}

.centered-state > p:not(.kicker)[b-901x3rham8],
.terminal-card > p:not(.kicker)[b-901x3rham8] {
    max-width: 28rem;
    color: var(--muted);
    line-height: 1.55;
}

.state-glyph[b-901x3rham8],
.terminal-sigil[b-901x3rham8] {
    display: grid;
    place-items: center;
    width: 4rem;
    height: 4rem;
    margin-bottom: 1.4rem;
    border: 1px solid rgba(201, 167, 98, .55);
    border-radius: 50%;
    color: var(--gold);
    font-family: Georgia, serif;
    font-size: 1.6rem;
}

.error-state .state-glyph[b-901x3rham8],
.terminal-card.lost .terminal-sigil[b-901x3rham8] {
    color: var(--rust);
    border-color: rgba(200, 93, 54, .6);
}

.veil-loader[b-901x3rham8] {
    width: 3rem;
    height: 3rem;
    margin-bottom: 1.5rem;
    border: 1px solid rgba(201, 167, 98, .25);
    border-top-color: var(--gold);
    border-radius: 50%;
    animation: turn-b-901x3rham8 1.2s linear infinite;
}

@keyframes turn-b-901x3rham8 {
    to { transform: rotate(360deg); }
}

.secondary-action[b-901x3rham8],
.primary-action[b-901x3rham8] {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    min-height: 3rem;
    margin-top: .8rem;
    padding: .75rem 1.1rem;
    border: 1px solid var(--gold);
    color: var(--bone);
    background: transparent;
    text-decoration: none;
    font-size: .72rem;
    font-weight: 850;
    letter-spacing: .1em;
    text-transform: uppercase;
}

.terminal-stats[b-901x3rham8] {
    width: min(100%, 24rem);
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1px;
    margin: 1.5rem 0;
    background: rgba(238, 231, 215, .12);
}

.terminal-stats span[b-901x3rham8] {
    display: flex;
    flex-direction: column;
    gap: .35rem;
    padding: .9rem;
    color: var(--muted);
    background: var(--surface);
    font-size: .62rem;
    text-transform: uppercase;
    letter-spacing: .1em;
}

.terminal-stats strong[b-901x3rham8] {
    color: var(--bone);
    font: .78rem ui-monospace, monospace;
}

.sheet-scrim[b-901x3rham8] {
    position: fixed;
    inset: 0;
    z-index: 29;
    background: rgba(0, 0, 0, .67);
    backdrop-filter: blur(2px);
}

.decision-sheet[b-901x3rham8] {
    position: fixed;
    z-index: 30;
    left: 50%;
    bottom: 0;
    width: min(100%, 43rem);
    padding: 1.4rem 1.25rem calc(1.25rem + env(safe-area-inset-bottom));
    border: 1px solid rgba(238, 231, 215, .16);
    border-bottom: 0;
    color: var(--bone);
    background: #22211c;
    transform: translateX(-50%);
    box-shadow: 0 -1rem 3rem rgba(0, 0, 0, .45);
}

.decision-sheet h2[b-901x3rham8] {
    margin: .35rem 2rem .6rem 0;
    font-size: 1.75rem;
}

.decision-sheet p[b-901x3rham8] {
    color: var(--muted);
    line-height: 1.5;
}

.decision-sheet small[b-901x3rham8] {
    display: block;
    margin-top: .65rem;
    color: #777267;
    text-align: center;
    font-size: .62rem;
}

.sheet-close[b-901x3rham8] {
    position: absolute;
    top: .8rem;
    right: .85rem;
    width: 2.4rem;
    height: 2.4rem;
    border: 0;
    color: var(--muted);
    background: transparent;
    font-size: 1.5rem;
}

.primary-action[b-901x3rham8] {
    width: 100%;
    border-color: var(--rust);
    background: var(--rust);
}

@media (min-width: 44rem) {
    .expeditions-shell[b-901x3rham8] {
        padding-bottom: 6rem;
    }

    .topbar[b-901x3rham8] {
        padding-inline: max(1rem, calc((100vw - 43rem) / 2));
    }

    .hero[b-901x3rham8],
    .route-section[b-901x3rham8],
    .choices[b-901x3rham8],
    .event-log[b-901x3rham8] {
        padding-inline: 2rem;
    }

    .vital-panel[b-901x3rham8] {
        margin-inline: 2rem;
    }
}

@media (prefers-reduced-motion: reduce) {
    .veil-loader[b-901x3rham8] {
        animation: none;
    }
}
/* /Features/Roster/RosterView.razor.rz.scp.css */
.roster-shell[b-6ge9zub6qq] { --ink:#10110f; --surface:#191a17; --surface-2:#21221d; --bone:#eee7d8; --muted:#999589; --gold:#c9a762; --rust:#c76542; --sage:#7d8e6a; min-height:100vh; color:var(--bone); background:radial-gradient(circle at 72% 0,rgba(201,167,98,.07),transparent 25rem),linear-gradient(90deg,rgba(255,255,255,.015) 1px,transparent 1px),var(--ink); background-size:auto,4px 4px,auto; }
button[b-6ge9zub6qq],a[b-6ge9zub6qq] { font:inherit; }
button[b-6ge9zub6qq] { cursor:pointer; }
button:disabled[b-6ge9zub6qq] { cursor:not-allowed; opacity:.48; }
.topbar[b-6ge9zub6qq] { position:sticky; top:0; z-index:50; height:4.4rem; display:grid; grid-template-columns:2.5rem 1fr auto; align-items:center; gap:.85rem; padding:0 1.1rem; background:rgba(15,16,14,.96); border-bottom:1px solid rgba(238,231,216,.11); backdrop-filter:blur(14px); }
.back-link[b-6ge9zub6qq] { display:grid; place-items:center; width:2.35rem; height:2.35rem; color:var(--bone); border:1px solid rgba(238,231,216,.14); text-decoration:none; }
.topbar div[b-6ge9zub6qq] { display:grid; gap:.06rem; }
.topbar div span[b-6ge9zub6qq],.topbar em[b-6ge9zub6qq],.eyebrow[b-6ge9zub6qq] { margin:0; color:var(--gold); font-size:.54rem; font-style:normal; font-weight:850; letter-spacing:.15em; text-transform:uppercase; }
.topbar div strong[b-6ge9zub6qq] { font:500 1.08rem Georgia,serif; }
.topbar em[b-6ge9zub6qq] { padding:.5rem .65rem; border:1px solid rgba(201,167,98,.4); }
.connection-banner[b-6ge9zub6qq] { display:flex; justify-content:center; gap:.7rem; padding:.65rem 1rem; color:#dac4b9; background:rgba(199,101,66,.14); border-bottom:1px solid rgba(199,101,66,.38); font-size:.7rem; }
.connection-banner span[b-6ge9zub6qq] { color:#b7a49b; }
.company-dock[b-6ge9zub6qq] { display:grid; grid-template-columns:minmax(15rem,.8fr) minmax(29rem,1.5fr) minmax(13rem,.7fr); gap:1rem; align-items:center; width:min(100%,94rem); margin:0 auto; padding:1.15rem 1.35rem; border-bottom:1px solid rgba(238,231,216,.1); }
.company-identity h1[b-6ge9zub6qq] { margin:.25rem 0 .18rem; font:500 clamp(1.65rem,3vw,2.6rem)/1 Georgia,serif; }
.company-identity > span[b-6ge9zub6qq] { color:var(--muted); font-size:.65rem; }
.party-slots[b-6ge9zub6qq] { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:.45rem; }
.party-slot[b-6ge9zub6qq] { min-width:0; min-height:4.2rem; display:grid; grid-template-columns:2.2rem 1fr; gap:.55rem; align-items:center; padding:.55rem; text-align:left; color:var(--bone); background:var(--surface); border:1px solid rgba(238,231,216,.11); }
.party-slot:hover[b-6ge9zub6qq],.party-slot:focus-visible[b-6ge9zub6qq] { border-color:var(--gold); outline:none; }
.party-slot.quick[b-6ge9zub6qq] { border-color:rgba(201,167,98,.6); background:linear-gradient(135deg,rgba(201,167,98,.13),var(--surface)); }
.portrait[b-6ge9zub6qq] { display:grid; place-items:center; width:2.2rem; height:2.2rem; flex:none; color:var(--gold); background:#27261f; border:1px solid #5b5547; border-radius:50%; font:500 1rem Georgia,serif; }
.party-slot > span:last-child[b-6ge9zub6qq] { min-width:0; display:grid; gap:.16rem; }
.party-slot strong[b-6ge9zub6qq] { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font:500 .78rem Georgia,serif; }
.party-slot small[b-6ge9zub6qq] { color:var(--muted); font-size:.46rem; font-weight:800; letter-spacing:.08em; }
.party-slot.empty[b-6ge9zub6qq] { display:flex; flex-direction:column; justify-content:center; color:#706d65; border-style:dashed; }
.party-slot.empty > span[b-6ge9zub6qq] { font-size:1.1rem; }
.quick-budget[b-6ge9zub6qq] { display:grid; gap:.25rem; padding-left:1rem; border-left:1px solid rgba(201,167,98,.28); }
.quick-budget > span[b-6ge9zub6qq] { color:var(--gold); font-size:.5rem; font-weight:850; letter-spacing:.12em; }
.quick-budget strong[b-6ge9zub6qq] { font:500 .9rem Georgia,serif; }
.quick-budget small[b-6ge9zub6qq] { color:var(--muted); font-size:.58rem; line-height:1.4; }
.workspace-nav[b-6ge9zub6qq] { position:sticky; top:4.4rem; z-index:40; display:flex; align-items:center; width:100%; padding:0 max(1rem,calc((100% - 91rem)/2)); background:rgba(17,18,15,.96); border-bottom:1px solid rgba(238,231,216,.1); backdrop-filter:blur(12px); }
.workspace-nav button[b-6ge9zub6qq] { min-height:3.25rem; display:flex; align-items:center; gap:.4rem; padding:0 1rem; color:var(--muted); background:transparent; border:0; border-bottom:2px solid transparent; font-size:.65rem; font-weight:850; letter-spacing:.1em; text-transform:uppercase; }
.workspace-nav button.active[b-6ge9zub6qq] { color:var(--gold); border-bottom-color:var(--gold); }
.workspace-nav button em[b-6ge9zub6qq] { min-width:1.35rem; padding:.13rem .3rem; color:var(--gold); background:rgba(201,167,98,.12); font-style:normal; font-size:.52rem; }
.workspace-nav > small[b-6ge9zub6qq] { margin-left:auto; padding-right:1rem; color:var(--muted); font-size:.58rem; }
.inline-error[b-6ge9zub6qq] { width:min(calc(100% - 2rem),91rem); margin:1rem auto 0; padding:.75rem 1rem; color:#eccbbb; background:rgba(199,101,66,.14); border:1px solid rgba(199,101,66,.4); font-size:.7rem; }
.company-workspace[b-6ge9zub6qq],.archive-workspace[b-6ge9zub6qq] { width:min(calc(100% - 2rem),91rem); margin:0 auto; padding:2.2rem 0 4rem; }
.company-workspace[b-6ge9zub6qq] { display:grid; grid-template-columns:minmax(0,1.5fr) minmax(18rem,.7fr); gap:1rem; }
.company-overview[b-6ge9zub6qq],.relationships[b-6ge9zub6qq] { padding:clamp(1.25rem,3vw,2.2rem); background:rgba(25,26,23,.8); border:1px solid rgba(238,231,216,.1); }
.company-overview h2[b-6ge9zub6qq],.archive-workspace h2[b-6ge9zub6qq] { margin:.3rem 0 .65rem; font:500 clamp(2rem,5vw,4rem)/.95 Georgia,serif; }
.company-overview > p:not(.eyebrow)[b-6ge9zub6qq],.archive-workspace header > p[b-6ge9zub6qq] { max-width:42rem; color:#b2ada1; font-size:.78rem; line-height:1.6; }
.company-facts[b-6ge9zub6qq] { display:grid; grid-template-columns:repeat(3,1fr); gap:.65rem; margin:2rem 0 1.25rem; }
.company-facts article[b-6ge9zub6qq] { min-height:8rem; padding:1rem; background:var(--surface-2); border:1px solid rgba(238,231,216,.09); }
.company-facts span[b-6ge9zub6qq],.vitals span[b-6ge9zub6qq] { color:var(--muted); font-size:.5rem; font-weight:850; letter-spacing:.12em; }
.company-facts strong[b-6ge9zub6qq] { display:block; margin:.7rem 0 .35rem; font:500 1.2rem Georgia,serif; }
.company-facts small[b-6ge9zub6qq] { color:var(--muted); font-size:.61rem; line-height:1.45; }
.company-actions[b-6ge9zub6qq],.character-actions[b-6ge9zub6qq] { display:flex; gap:.6rem; flex-wrap:wrap; }
.primary-action[b-6ge9zub6qq],.secondary-action[b-6ge9zub6qq],.danger-action[b-6ge9zub6qq] { min-height:2.6rem; padding:.65rem .9rem; color:#15140f; background:var(--gold); border:1px solid var(--gold); font-size:.6rem; font-weight:850; letter-spacing:.08em; text-transform:uppercase; }
.secondary-action[b-6ge9zub6qq] { color:var(--gold); background:transparent; }
.danger-action[b-6ge9zub6qq] { color:#e6aa92; background:transparent; border-color:rgba(199,101,66,.6); }
.boundary-note[b-6ge9zub6qq] { color:#77746b !important; font-size:.61rem !important; line-height:1.5 !important; }
.relationships h3[b-6ge9zub6qq] { margin:.25rem 0 1rem; font:500 1.5rem Georgia,serif; }
.relationships article[b-6ge9zub6qq] { padding:.85rem 0; border-top:1px solid rgba(238,231,216,.09); }
.relationships article span[b-6ge9zub6qq],.archive-grid article > span[b-6ge9zub6qq],.power-grid article > span[b-6ge9zub6qq] { color:var(--gold); font-size:.49rem; font-weight:850; letter-spacing:.11em; text-transform:uppercase; }
.relationships article strong[b-6ge9zub6qq] { display:block; margin:.25rem 0; font:500 .9rem Georgia,serif; }
.relationships article p[b-6ge9zub6qq] { margin:0; color:var(--muted); font-size:.65rem; line-height:1.5; }
.roster-workspace[b-6ge9zub6qq] { width:min(100%,94rem); display:grid; grid-template-columns:minmax(25rem,40%) minmax(0,60%); margin:0 auto; }
.roster-browser[b-6ge9zub6qq] { min-width:0; min-height:calc(100vh - 14rem); padding:1.35rem; border-right:1px solid rgba(238,231,216,.1); }
.roster-heading[b-6ge9zub6qq] { display:flex; align-items:end; justify-content:space-between; margin-bottom:.8rem; }
.roster-heading h2[b-6ge9zub6qq] { margin:.25rem 0 0; font:500 2.4rem Georgia,serif; }
.roster-heading > strong[b-6ge9zub6qq] { font:500 1.8rem Georgia,serif; }
.roster-heading > strong small[b-6ge9zub6qq] { color:var(--muted); font-size:.75rem; }
.filter-row[b-6ge9zub6qq] { display:flex; gap:.35rem; overflow-x:auto; margin-bottom:.8rem; }
.filter-row button[b-6ge9zub6qq] { padding:.4rem .6rem; color:var(--muted); background:transparent; border:1px solid rgba(238,231,216,.11); font-size:.56rem; text-transform:uppercase; }
.filter-row button.active[b-6ge9zub6qq] { color:var(--gold); border-color:rgba(201,167,98,.45); }
.character-grid[b-6ge9zub6qq] { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:.45rem; }
.character-card[b-6ge9zub6qq] { min-width:0; min-height:4.5rem; display:grid; grid-template-columns:2.2rem 1fr auto; gap:.55rem; align-items:center; padding:.6rem; text-align:left; color:var(--bone); background:var(--surface); border:1px solid rgba(238,231,216,.09); }
.character-card:hover[b-6ge9zub6qq],.character-card:focus-visible[b-6ge9zub6qq] { border-color:rgba(201,167,98,.55); outline:none; }
.character-card.selected[b-6ge9zub6qq] { border-color:var(--gold); box-shadow:inset 3px 0 var(--gold); background:linear-gradient(120deg,rgba(201,167,98,.12),var(--surface)); }
.character-copy[b-6ge9zub6qq] { min-width:0; display:grid; gap:.13rem; }
.character-copy strong[b-6ge9zub6qq] { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font:500 .82rem Georgia,serif; }
.character-copy small[b-6ge9zub6qq] { overflow:hidden; color:var(--muted); font-size:.53rem; text-overflow:ellipsis; white-space:nowrap; }
.character-copy em[b-6ge9zub6qq] { width:max-content; padding:.1rem .25rem; color:#ceb77f; background:rgba(201,167,98,.13); font-size:.43rem; font-style:normal; font-weight:850; letter-spacing:.08em; }
.hp[b-6ge9zub6qq] { display:grid; justify-items:center; color:#b9c9a9; font:700 .67rem ui-monospace,monospace; }
.hp small[b-6ge9zub6qq] { color:var(--muted); font-size:.45rem; }
.hp.ko[b-6ge9zub6qq] { color:#df7957; }
.recruit-action[b-6ge9zub6qq] { width:100%; margin-top:.65rem; padding:.65rem; color:var(--muted); background:transparent; border:1px dashed rgba(238,231,216,.16); font-size:.6rem; text-transform:uppercase; }
.character-sheet[b-6ge9zub6qq] { min-width:0; }
.character-hero[b-6ge9zub6qq] { min-height:10rem; display:flex; align-items:end; justify-content:space-between; gap:1rem; padding:1.7rem 1.8rem 1.25rem; background:linear-gradient(120deg,rgba(201,167,98,.1),transparent 55%); border-bottom:1px solid rgba(238,231,216,.1); }
.character-hero.ko[b-6ge9zub6qq] { background:linear-gradient(120deg,rgba(199,101,66,.2),transparent 55%); }
.character-hero h2[b-6ge9zub6qq] { margin:.25rem 0 .3rem; font:500 clamp(2.5rem,6vw,4.4rem)/.9 Georgia,serif; letter-spacing:-.04em; }
.character-hero > div:first-child > p:last-child[b-6ge9zub6qq] { margin:0; color:var(--muted); font:italic .8rem Georgia,serif; }
.level-seal[b-6ge9zub6qq] { min-width:4.8rem; padding:.65rem; text-align:center; border:1px solid rgba(201,167,98,.45); }
.level-seal span[b-6ge9zub6qq],.level-seal small[b-6ge9zub6qq] { display:block; color:var(--gold); font-size:.5rem; font-weight:850; letter-spacing:.1em; }
.level-seal strong[b-6ge9zub6qq] { display:block; font:500 1.8rem Georgia,serif; }
.control-banner[b-6ge9zub6qq] { display:flex; gap:.7rem; padding:.7rem 1.8rem; border-bottom:1px solid rgba(238,231,216,.09); font-size:.65rem; }
.control-banner.quick[b-6ge9zub6qq] { background:rgba(201,167,98,.09); }
.control-banner.auto[b-6ge9zub6qq] { background:rgba(125,142,106,.1); }
.control-banner strong[b-6ge9zub6qq] { flex:none; color:var(--gold); }
.control-banner span[b-6ge9zub6qq] { color:var(--muted); }
.sheet-tabs[b-6ge9zub6qq] { display:flex; overflow-x:auto; padding:0 1rem; background:rgba(17,18,15,.88); border-bottom:1px solid rgba(238,231,216,.1); scrollbar-width:none; }
.sheet-tabs button[b-6ge9zub6qq] { flex:none; padding:.8rem .65rem .65rem; color:var(--muted); background:transparent; border:0; border-bottom:2px solid transparent; font-size:.54rem; font-weight:850; letter-spacing:.07em; text-transform:uppercase; }
.sheet-tabs button.active[b-6ge9zub6qq] { color:var(--gold); border-color:var(--gold); }
.sheet-content[b-6ge9zub6qq] { padding:1.25rem 1.6rem 3rem; }
.vitals[b-6ge9zub6qq] { display:grid; grid-template-columns:repeat(4,1fr); margin-bottom:1.4rem; background:rgba(238,231,216,.025); border:1px solid rgba(238,231,216,.1); }
.vitals article[b-6ge9zub6qq] { min-width:0; padding:.75rem; border-right:1px solid rgba(238,231,216,.08); }
.vitals article:last-child[b-6ge9zub6qq] { border:0; }
.vitals strong[b-6ge9zub6qq] { display:block; overflow:hidden; margin-top:.25rem; font:500 1.1rem Georgia,serif; text-overflow:ellipsis; }
.sheet-section[b-6ge9zub6qq] { margin-bottom:1.5rem; }
.section-heading[b-6ge9zub6qq] { display:flex; justify-content:space-between; align-items:end; gap:1rem; margin-bottom:.75rem; }
.section-heading h3[b-6ge9zub6qq],.progression-summary h3[b-6ge9zub6qq],.audit-panel h3[b-6ge9zub6qq] { margin:.2rem 0 0; font:500 1.45rem Georgia,serif; }
.section-heading > small[b-6ge9zub6qq] { color:var(--muted); font-size:.57rem; }
.ability-grid[b-6ge9zub6qq] { display:grid; grid-template-columns:repeat(6,1fr); gap:.35rem; }
.ability-card[b-6ge9zub6qq] { display:grid; justify-items:center; padding:.65rem .25rem; background:var(--surface); border:1px solid rgba(238,231,216,.1); }
.ability-card.live[b-6ge9zub6qq] { border-color:rgba(201,167,98,.58); background:linear-gradient(160deg,rgba(201,167,98,.13),var(--surface)); }
.ability-card > span[b-6ge9zub6qq] { color:var(--muted); font-size:.52rem; font-weight:850; }
.ability-card strong[b-6ge9zub6qq] { font:500 1.5rem Georgia,serif; }
.ability-card small[b-6ge9zub6qq] { color:var(--muted); font-size:.52rem; }
.ability-card em[b-6ge9zub6qq] { margin-top:.35rem; padding:.12rem .2rem; color:#7e7a70; background:rgba(255,255,255,.03); font-size:.4rem; font-style:normal; font-weight:850; }
.ability-card.live em[b-6ge9zub6qq] { color:#f0d598; background:rgba(201,167,98,.18); }
.skill-grid[b-6ge9zub6qq] { display:grid; grid-template-columns:repeat(2,1fr); border-top:1px solid rgba(238,231,216,.09); }
.skill-grid > div[b-6ge9zub6qq] { display:grid; grid-template-columns:1fr auto 2rem; gap:.4rem; padding:.38rem .2rem; border-bottom:1px solid rgba(238,231,216,.07); }
.skill-grid > div:nth-child(odd)[b-6ge9zub6qq] { margin-right:.6rem; }
.skill-grid strong[b-6ge9zub6qq] { font:500 .68rem Georgia,serif; }
.skill-grid span[b-6ge9zub6qq] { color:var(--muted); font-size:.5rem; }
.skill-grid em[b-6ge9zub6qq] { text-align:right; color:var(--gold); font:700 .6rem ui-monospace,monospace; font-style:normal; }
.skill-grid .proficient strong[b-6ge9zub6qq] { color:#e7d3a4; }
.progression-summary[b-6ge9zub6qq] { padding:1.1rem; background:linear-gradient(135deg,rgba(201,167,98,.12),rgba(238,231,216,.02)); border:1px solid rgba(201,167,98,.28); }
.progression-summary > div[b-6ge9zub6qq] { display:flex; justify-content:space-between; margin-top:1rem; color:var(--muted); font-size:.58rem; }
.progression-summary > i[b-6ge9zub6qq] { display:block; height:4px; margin-top:.4rem; background:#39372f; }
.progression-summary b[b-6ge9zub6qq] { display:block; height:100%; background:linear-gradient(90deg,var(--gold),var(--rust)); }
.progression-path[b-6ge9zub6qq] { display:grid; grid-template-columns:repeat(auto-fit,minmax(9rem,1fr)); gap:.45rem; margin:1rem 0; }
.progression-path article[b-6ge9zub6qq] { min-height:8.5rem; padding:.8rem; background:var(--surface); border:1px solid rgba(238,231,216,.1); }
.progression-path article.complete[b-6ge9zub6qq] { border-top:2px solid var(--sage); }
.progression-path article.selected[b-6ge9zub6qq],.progression-path article.available[b-6ge9zub6qq] { border-color:rgba(201,167,98,.55); }
.progression-path article.locked[b-6ge9zub6qq] { opacity:.5; }
.progression-path span[b-6ge9zub6qq] { color:var(--gold); font-size:.46rem; font-weight:850; letter-spacing:.08em; }
.progression-path h4[b-6ge9zub6qq],.power-grid h4[b-6ge9zub6qq],.equipment-grid h4[b-6ge9zub6qq] { margin:.45rem 0 .3rem; font:500 .95rem Georgia,serif; }
.progression-path p[b-6ge9zub6qq],.power-grid p[b-6ge9zub6qq],.equipment-grid p[b-6ge9zub6qq] { margin:0 0 .55rem; color:var(--muted); font-size:.58rem; line-height:1.45; }
.progression-path small[b-6ge9zub6qq],.power-grid small[b-6ge9zub6qq],.equipment-grid small[b-6ge9zub6qq] { color:#77746c; font-size:.47rem; }
.audit-panel[b-6ge9zub6qq] { margin-top:1rem; padding:1rem; border-left:3px solid var(--sage); background:rgba(125,142,106,.09); }
.audit-panel article[b-6ge9zub6qq] { display:grid; grid-template-columns:1fr auto; gap:.25rem; margin-top:.8rem; padding-top:.8rem; border-top:1px solid rgba(238,231,216,.09); }
.audit-panel article strong[b-6ge9zub6qq] { font:500 .8rem Georgia,serif; }
.audit-panel article span[b-6ge9zub6qq],.audit-panel article small[b-6ge9zub6qq] { color:var(--muted); font-size:.52rem; }
.audit-panel article small[b-6ge9zub6qq] { grid-column:1/-1; }
.power-grid[b-6ge9zub6qq],.equipment-grid[b-6ge9zub6qq] { display:grid; grid-template-columns:repeat(2,1fr); gap:.5rem; }
.power-grid article[b-6ge9zub6qq],.equipment-grid article[b-6ge9zub6qq] { padding:.9rem; background:var(--surface); border:1px solid rgba(238,231,216,.1); }
.equipment-grid[b-6ge9zub6qq] { margin-bottom:1rem; }
.equipment-grid article > span[b-6ge9zub6qq] { color:var(--gold); font-size:.48rem; font-weight:850; letter-spacing:.1em; text-transform:uppercase; }
.equipment-grid article.empty[b-6ge9zub6qq] { border-color:rgba(199,101,66,.38); background:rgba(199,101,66,.07); }
.consequence-grid[b-6ge9zub6qq] { display:grid; grid-template-columns:repeat(3,1fr); gap:.7rem; }
.consequence-grid h4[b-6ge9zub6qq] { margin:0 0 .5rem; color:var(--muted); font-size:.55rem; letter-spacing:.08em; text-transform:uppercase; }
.consequence-grid article[b-6ge9zub6qq] { display:grid; gap:.2rem; margin-bottom:.4rem; padding:.75rem; background:var(--surface); border:1px solid rgba(238,231,216,.09); }
.consequence-grid article span[b-6ge9zub6qq] { color:var(--rust); font-size:.48rem; text-transform:uppercase; }
.consequence-grid article strong[b-6ge9zub6qq] { font:500 .8rem Georgia,serif; }
.empty-note[b-6ge9zub6qq] { padding:.7rem; color:var(--muted); border:1px dashed rgba(238,231,216,.12); font-size:.58rem; }
.quick-rule[b-6ge9zub6qq] { display:grid; gap:.2rem; margin-top:1rem; padding:.85rem; border-left:3px solid var(--gold); background:rgba(201,167,98,.09); }
.quick-rule strong[b-6ge9zub6qq] { color:var(--gold); font-size:.63rem; text-transform:uppercase; }
.quick-rule span[b-6ge9zub6qq] { color:var(--muted); font-size:.65rem; }
.history-list article[b-6ge9zub6qq] { display:grid; grid-template-columns:.8rem 1fr; gap:.6rem; padding:0 0 1rem; }
.history-list i[b-6ge9zub6qq] { width:.5rem; height:.5rem; margin-top:.25rem; border:1px solid #706d64; border-radius:50%; }
.history-list i.significant[b-6ge9zub6qq] { border-color:var(--gold); background:var(--gold); box-shadow:0 0 0 .22rem rgba(201,167,98,.12); }
.history-list strong[b-6ge9zub6qq] { font:500 .9rem Georgia,serif; }
.history-list p[b-6ge9zub6qq] { margin:.2rem 0; color:var(--muted); font-size:.65rem; line-height:1.5; }
.history-list small[b-6ge9zub6qq] { color:#77746c; font-size:.48rem; }
.archive-workspace header[b-6ge9zub6qq] { max-width:48rem; margin-bottom:1.5rem; }
.archive-grid[b-6ge9zub6qq] { display:grid; grid-template-columns:repeat(3,1fr); gap:.65rem; }
.archive-grid article[b-6ge9zub6qq] { min-height:12rem; padding:1.2rem; background:linear-gradient(145deg,rgba(199,101,66,.07),var(--surface)); border:1px solid rgba(238,231,216,.1); }
.archive-grid h3[b-6ge9zub6qq] { margin:.7rem 0 .25rem; font:500 1.45rem Georgia,serif; }
.archive-grid p[b-6ge9zub6qq] { color:var(--muted); font-size:.65rem; }
.archive-grid strong[b-6ge9zub6qq],.archive-grid small[b-6ge9zub6qq] { display:block; margin-top:.7rem; font-size:.65rem; }
.archive-grid small[b-6ge9zub6qq] { color:var(--muted); }
.system-state[b-6ge9zub6qq] { width:min(36rem,calc(100% - 2rem)); min-height:calc(100vh - 4.4rem); display:grid; align-content:center; justify-items:center; margin:auto; text-align:center; }
.system-state h1[b-6ge9zub6qq] { margin:.4rem 0 .7rem; font:500 clamp(2rem,8vw,4rem)/.95 Georgia,serif; }
.system-state > p:not(.eyebrow)[b-6ge9zub6qq] { color:var(--muted); font-size:.78rem; line-height:1.55; }
.state-glyph[b-6ge9zub6qq] { display:grid; place-items:center; width:3rem; height:3rem; margin-bottom:1rem; color:var(--gold); border:1px solid rgba(201,167,98,.45); font:500 1.2rem Georgia,serif; }
.loader[b-6ge9zub6qq] { width:2rem; height:2rem; margin-bottom:1rem; border:1px solid rgba(201,167,98,.25); border-top-color:var(--gold); border-radius:50%; animation:spin-b-6ge9zub6qq 1s linear infinite; }
@keyframes spin-b-6ge9zub6qq { to { transform:rotate(360deg); } }
@media (prefers-reduced-motion:reduce) { .loader[b-6ge9zub6qq] { animation:none; border-color:var(--gold); } }
@media (max-width:1000px) {
  .company-dock[b-6ge9zub6qq] { grid-template-columns:1fr; }
  .quick-budget[b-6ge9zub6qq] { padding:.7rem 0 0; border-left:0; border-top:1px solid rgba(201,167,98,.22); }
  .roster-workspace[b-6ge9zub6qq] { grid-template-columns:minmax(20rem,43%) minmax(0,57%); }
  .character-grid[b-6ge9zub6qq] { grid-template-columns:1fr; }
  .company-workspace[b-6ge9zub6qq] { grid-template-columns:1fr; }
}
@media (max-width:760px) {
  .company-dock[b-6ge9zub6qq] { padding:.9rem .8rem; }
  .party-slots[b-6ge9zub6qq] { display:flex; overflow-x:auto; scrollbar-width:none; }
  .party-slot[b-6ge9zub6qq] { min-width:10.5rem; }
  .workspace-nav[b-6ge9zub6qq] { padding:0 .45rem; }
  .workspace-nav > small[b-6ge9zub6qq] { display:none; }
  .workspace-nav button[b-6ge9zub6qq] { flex:1; justify-content:center; padding:0 .4rem; }
  .roster-workspace[b-6ge9zub6qq] { display:block; }
  .roster-browser[b-6ge9zub6qq] { min-height:0; border-right:0; border-bottom:1px solid rgba(238,231,216,.1); }
  .character-grid[b-6ge9zub6qq] { grid-template-columns:repeat(2,minmax(0,1fr)); max-height:28rem; overflow-y:auto; overscroll-behavior:contain; padding-right:.25rem; scrollbar-color:rgba(201,167,98,.45) transparent; scrollbar-width:thin; }
  .company-facts[b-6ge9zub6qq] { grid-template-columns:1fr; }
  .company-facts article[b-6ge9zub6qq] { min-height:0; }
  .archive-grid[b-6ge9zub6qq] { grid-template-columns:1fr; }
}
@media (max-width:520px) {
  .topbar[b-6ge9zub6qq] { padding:0 .7rem; }
  .topbar em[b-6ge9zub6qq] { max-width:4.6rem; text-align:center; }
  .company-identity h1[b-6ge9zub6qq] { font-size:1.8rem; }
  .workspace-nav button[b-6ge9zub6qq] { font-size:.53rem; }
  .roster-browser[b-6ge9zub6qq] { padding:1rem .7rem; }
  .character-grid[b-6ge9zub6qq] { grid-template-columns:repeat(2,minmax(0,1fr)); max-height:21rem; }
  .character-card[b-6ge9zub6qq] { min-height:7rem; grid-template-columns:2.2rem 1fr; align-content:center; }
  .character-card .hp[b-6ge9zub6qq] { grid-column:1/-1; grid-auto-flow:column; justify-content:start; gap:.15rem; }
  .character-hero[b-6ge9zub6qq] { min-height:8.5rem; padding:1.25rem .9rem .9rem; }
  .character-hero h2[b-6ge9zub6qq] { font-size:2.55rem; }
  .control-banner[b-6ge9zub6qq] { display:grid; padding:.7rem .9rem; }
  .sheet-tabs[b-6ge9zub6qq] { padding:0 .2rem; }
  .sheet-content[b-6ge9zub6qq] { padding:1rem .75rem 2.5rem; }
  .vitals[b-6ge9zub6qq] { grid-template-columns:1fr 1fr; }
  .vitals article:nth-child(2)[b-6ge9zub6qq] { border-right:0; }
  .vitals article:nth-child(-n+2)[b-6ge9zub6qq] { border-bottom:1px solid rgba(238,231,216,.08); }
  .ability-grid[b-6ge9zub6qq] { grid-template-columns:repeat(3,1fr); }
  .skill-grid[b-6ge9zub6qq],.power-grid[b-6ge9zub6qq],.equipment-grid[b-6ge9zub6qq],.consequence-grid[b-6ge9zub6qq] { grid-template-columns:1fr; }
  .skill-grid > div:nth-child(odd)[b-6ge9zub6qq] { margin:0; }
  .progression-path[b-6ge9zub6qq] { display:flex; overflow-x:auto; scroll-snap-type:x mandatory; }
  .progression-path article[b-6ge9zub6qq] { min-width:12rem; scroll-snap-align:start; }
  .company-workspace[b-6ge9zub6qq],.archive-workspace[b-6ge9zub6qq] { width:min(calc(100% - 1rem),91rem); padding-top:1rem; }
}
/* /Pages/Dashboard.razor.rz.scp.css */
.operations-shell[b-ymq2iq7wee] {
    --surface: #10161e;
    --surface-raised: #151d27;
    --surface-soft: #1a2430;
    --line: rgba(154, 174, 199, 0.16);
    --muted: #8190a3;
    --text: #ecf2f8;
    --blue: #68a7ff;
    --green: #60d69a;
    --amber: #efb85a;
    min-height: 100vh;
    box-sizing: border-box;
    padding: 34px clamp(18px, 4vw, 64px) 60px;
    color: var(--text);
    background:
        radial-gradient(circle at 9% 2%, rgba(65, 126, 195, 0.13), transparent 31rem),
        radial-gradient(circle at 92% 10%, rgba(62, 173, 126, 0.08), transparent 28rem),
        #0b1017;
    font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.operations-shell *[b-ymq2iq7wee],
.operations-shell *[b-ymq2iq7wee]::before,
.operations-shell *[b-ymq2iq7wee]::after {
    box-sizing: border-box;
}

.operations-header[b-ymq2iq7wee] {
    max-width: 1500px;
    margin: 0 auto 28px;
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 36px;
}

.back-link[b-ymq2iq7wee] {
    display: inline-flex;
    margin-bottom: 22px;
    color: #91a3b8;
    font: 700 0.72rem/1 ui-monospace, SFMono-Regular, Menlo, monospace;
    letter-spacing: 0.13em;
    text-decoration: none;
    text-transform: uppercase;
}

.back-link:hover[b-ymq2iq7wee] { color: #d8e6f5; }

.title-row[b-ymq2iq7wee] {
    display: flex;
    align-items: center;
    gap: 16px;
}

.title-mark[b-ymq2iq7wee] {
    width: 54px;
    height: 54px;
    display: grid;
    place-items: center;
    border: 1px solid rgba(104, 167, 255, 0.46);
    border-radius: 14px;
    color: #b9d6ff;
    background: linear-gradient(145deg, rgba(104, 167, 255, 0.2), rgba(104, 167, 255, 0.04));
    box-shadow: inset 0 0 20px rgba(104, 167, 255, 0.08);
    font: 800 1.35rem/1 Georgia, serif;
}

.eyebrow[b-ymq2iq7wee],
.section-kicker[b-ymq2iq7wee] {
    margin: 0 0 7px;
    color: var(--blue);
    font: 800 0.64rem/1 ui-monospace, SFMono-Regular, Menlo, monospace;
    letter-spacing: 0.18em;
}

h1[b-ymq2iq7wee], h2[b-ymq2iq7wee], p[b-ymq2iq7wee] { margin-top: 0; }

h1[b-ymq2iq7wee] {
    margin-bottom: 0;
    font-size: clamp(1.9rem, 4vw, 3rem);
    line-height: 0.95;
    letter-spacing: -0.045em;
}

.subtitle[b-ymq2iq7wee] {
    max-width: 730px;
    margin: 18px 0 0;
    color: #96a5b7;
    font-size: 0.96rem;
    line-height: 1.65;
}

.refresh-panel[b-ymq2iq7wee] {
    min-width: 190px;
    display: grid;
    justify-items: end;
    gap: 9px;
}

.health-pill[b-ymq2iq7wee],
.read-only-label[b-ymq2iq7wee] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    border: 1px solid var(--line);
    border-radius: 999px;
    padding: 8px 12px;
    color: #aab8c9;
    background: rgba(16, 22, 30, 0.7);
    font: 800 0.64rem/1 ui-monospace, SFMono-Regular, Menlo, monospace;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.health-pill i[b-ymq2iq7wee],
.watch-count i[b-ymq2iq7wee],
.instance-dot[b-ymq2iq7wee] {
    width: 7px;
    height: 7px;
    display: inline-block;
    border-radius: 50%;
    background: var(--green);
    box-shadow: 0 0 10px rgba(96, 214, 154, 0.7);
}

.health-pill.degraded i[b-ymq2iq7wee] {
    background: #ee795f;
    box-shadow: 0 0 10px rgba(238, 121, 95, 0.64);
}

.refresh-button[b-ymq2iq7wee] {
    border: 1px solid rgba(104, 167, 255, 0.34);
    border-radius: 9px;
    padding: 10px 15px;
    color: #d9e9fd;
    background: rgba(48, 94, 148, 0.16);
    font-weight: 750;
    cursor: pointer;
}

.refresh-button:hover:not(:disabled)[b-ymq2iq7wee] { background: rgba(68, 128, 197, 0.25); }
.refresh-button:disabled[b-ymq2iq7wee] { opacity: 0.6; cursor: wait; }
.refresh-panel small[b-ymq2iq7wee] { color: #647386; font-size: 0.7rem; }

.status-message[b-ymq2iq7wee],
.summary-grid[b-ymq2iq7wee],
.operations-section[b-ymq2iq7wee],
.lower-grid[b-ymq2iq7wee] {
    max-width: 1500px;
    margin-left: auto;
    margin-right: auto;
}

.status-message[b-ymq2iq7wee] {
    min-height: 108px;
    margin-bottom: 20px;
    display: flex;
    align-items: center;
    gap: 16px;
    border: 1px solid var(--line);
    border-radius: 14px;
    padding: 20px;
    color: #b8c5d3;
    background: var(--surface);
}

.status-message div[b-ymq2iq7wee] { display: grid; gap: 5px; }
.status-message strong[b-ymq2iq7wee] { color: var(--text); }
.status-message span[b-ymq2iq7wee] { display: block; }
.status-message small[b-ymq2iq7wee] { color: #7c8998; }
.status-message.error[b-ymq2iq7wee] { min-height: auto; border-color: rgba(238, 121, 95, 0.35); background: rgba(70, 29, 25, 0.42); }
.status-message.error[b-ymq2iq7wee] { display: grid; gap: 5px; }

.loader[b-ymq2iq7wee] {
    width: 22px;
    height: 22px;
    border: 2px solid rgba(104, 167, 255, 0.25);
    border-top-color: var(--blue);
    border-radius: 50%;
    animation: spin-b-ymq2iq7wee 0.8s linear infinite;
}

@keyframes spin-b-ymq2iq7wee { to { transform: rotate(360deg); } }

.summary-grid[b-ymq2iq7wee] {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}

.summary-card[b-ymq2iq7wee] {
    min-height: 138px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    border: 1px solid var(--line);
    border-top: 2px solid #7f91a8;
    border-radius: 12px;
    padding: 17px 18px;
    overflow: hidden;
    background: linear-gradient(150deg, rgba(255, 255, 255, 0.025), transparent 60%), var(--surface);
}

.summary-card.accent-blue[b-ymq2iq7wee] { border-top-color: var(--blue); }
.summary-card.accent-green[b-ymq2iq7wee] { border-top-color: var(--green); }
.summary-card.accent-amber[b-ymq2iq7wee] { border-top-color: var(--amber); }
.summary-card > span[b-ymq2iq7wee] { color: #7f8ea1; font: 800 0.62rem/1 ui-monospace, monospace; letter-spacing: 0.14em; }
.summary-card > strong[b-ymq2iq7wee] { font-size: 2.3rem; line-height: 1; letter-spacing: -0.04em; }
.summary-card > small[b-ymq2iq7wee] { color: #7f8ea1; }
.summary-card > strong.revision-value[b-ymq2iq7wee] { overflow: hidden; font: 750 1rem/1.3 ui-monospace, monospace; text-overflow: ellipsis; white-space: nowrap; }

.operations-section[b-ymq2iq7wee] {
    border: 1px solid var(--line);
    border-radius: 14px;
    margin-bottom: 16px;
    background: var(--surface);
    box-shadow: 0 18px 50px rgba(0, 0, 0, 0.12);
}

.section-heading[b-ymq2iq7wee] {
    min-height: 77px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    border-bottom: 1px solid var(--line);
    padding: 16px 20px;
}

.section-heading h2[b-ymq2iq7wee] { margin: 0; font-size: 1.06rem; letter-spacing: -0.015em; }
.section-kicker[b-ymq2iq7wee] { margin-bottom: 6px; color: #7389a3; }
.snapshot-time[b-ymq2iq7wee] { color: #6f7e90; font: 0.72rem/1 ui-monospace, monospace; }
.read-only-label[b-ymq2iq7wee] { color: #e0b564; border-color: rgba(239, 184, 90, 0.25); background: rgba(123, 82, 20, 0.12); }

.instance-list[b-ymq2iq7wee] { padding: 14px; }
.instance-card[b-ymq2iq7wee] {
    display: grid;
    grid-template-columns: minmax(210px, 0.6fr) 1.4fr;
    align-items: center;
    gap: 24px;
    border: 1px solid rgba(154, 174, 199, 0.12);
    border-radius: 10px;
    padding: 15px;
    background: var(--surface-raised);
}

.instance-identity[b-ymq2iq7wee] { display: flex; align-items: center; gap: 12px; }
.instance-identity strong[b-ymq2iq7wee] { display: block; font: 750 0.86rem/1.4 ui-monospace, monospace; }
.instance-identity small[b-ymq2iq7wee] { color: var(--muted); }
.instance-card dl[b-ymq2iq7wee] { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; margin: 0; }
.instance-card dl div[b-ymq2iq7wee] { min-width: 0; border-left: 1px solid var(--line); padding-left: 12px; }
.instance-card dt[b-ymq2iq7wee] { color: #738296; font-size: 0.68rem; }
.instance-card dd[b-ymq2iq7wee] { margin: 5px 0 0; overflow: hidden; color: #dce7f2; font: 700 0.77rem/1.3 ui-monospace, monospace; text-overflow: ellipsis; white-space: nowrap; }

.empty-state[b-ymq2iq7wee] {
    min-height: 130px;
    display: grid;
    place-content: center;
    justify-items: center;
    gap: 7px;
    padding: 28px;
    color: #708094;
    text-align: center;
}
.empty-state strong[b-ymq2iq7wee] { color: #b9c5d2; }

.match-table[b-ymq2iq7wee] { width: 100%; overflow: hidden; }
.match-row[b-ymq2iq7wee] {
    display: grid;
    grid-template-columns: minmax(150px, 1.1fr) minmax(120px, 0.9fr) 70px 105px 105px 80px minmax(250px, 1.5fr);
    align-items: center;
    min-height: 76px;
    border-bottom: 1px solid rgba(154, 174, 199, 0.1);
    padding: 0 20px;
    column-gap: 16px;
}
.match-row:last-child[b-ymq2iq7wee] { border-bottom: 0; }
.match-header[b-ymq2iq7wee] { min-height: 40px; color: #6f7f92; background: rgba(255, 255, 255, 0.015); font: 750 0.61rem/1 ui-monospace, monospace; letter-spacing: 0.08em; text-transform: uppercase; }
.match-id strong[b-ymq2iq7wee] { display: block; font: 750 0.8rem/1.4 ui-monospace, monospace; }
.match-id small[b-ymq2iq7wee],
.match-row [role="cell"] > small[b-ymq2iq7wee] { display: block; margin-top: 4px; color: #6f7e90; font-size: 0.68rem; }
.numeric[b-ymq2iq7wee] { color: #c9d4e1; font: 0.75rem/1 ui-monospace, monospace; }
.watch-count[b-ymq2iq7wee] { display: inline-flex; align-items: center; gap: 8px; font-weight: 750; }
.watch-count i[b-ymq2iq7wee] { width: 6px; height: 6px; }

.state-badge[b-ymq2iq7wee] {
    display: inline-flex;
    border: 1px solid rgba(129, 144, 163, 0.28);
    border-radius: 999px;
    padding: 5px 8px;
    color: #b7c2ce;
    background: rgba(129, 144, 163, 0.09);
    font: 800 0.6rem/1 ui-monospace, monospace;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}
.state-badge.running[b-ymq2iq7wee] { color: #92c2ff; border-color: rgba(104, 167, 255, 0.32); background: rgba(68, 124, 190, 0.12); }
.state-badge.completed[b-ymq2iq7wee] { color: #8de4b5; border-color: rgba(96, 214, 154, 0.3); background: rgba(59, 153, 106, 0.11); }
.state-badge.faulted[b-ymq2iq7wee] { color: #ff9a84; border-color: rgba(238, 121, 95, 0.34); background: rgba(174, 68, 49, 0.12); }

.pins[b-ymq2iq7wee] { min-width: 0; display: grid; gap: 5px; }
.pins span[b-ymq2iq7wee] { overflow: hidden; color: #8fa0b3; font: 0.68rem/1.2 ui-monospace, monospace; text-overflow: ellipsis; white-space: nowrap; }

.lower-grid[b-ymq2iq7wee] {
    display: grid;
    grid-template-columns: 0.9fr 1.1fr;
    gap: 16px;
}
.lower-grid .operations-section[b-ymq2iq7wee] { margin: 0; }
.metric-grid[b-ymq2iq7wee] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; padding: 18px; }
.metric-grid > div[b-ymq2iq7wee] { border: 1px solid rgba(154, 174, 199, 0.12); border-radius: 9px; padding: 13px; background: var(--surface-raised); }
.metric-grid span[b-ymq2iq7wee] { display: block; margin-bottom: 8px; color: #748396; font-size: 0.68rem; }
.metric-grid strong[b-ymq2iq7wee] { font-size: 1.55rem; }
.section-note[b-ymq2iq7wee] { margin: 0; border-top: 1px solid var(--line); padding: 14px 18px 17px; color: #77879a; font-size: 0.76rem; line-height: 1.5; }

.balance-pin[b-ymq2iq7wee] { margin: 18px; border: 1px solid rgba(239, 184, 90, 0.2); border-radius: 10px; padding: 16px; background: linear-gradient(140deg, rgba(151, 98, 23, 0.14), rgba(151, 98, 23, 0.03)); }
.balance-pin small[b-ymq2iq7wee] { display: block; margin-bottom: 8px; color: #a9874c; font: 750 0.6rem/1 ui-monospace, monospace; letter-spacing: 0.09em; }
.balance-pin strong[b-ymq2iq7wee] { color: #f3c875; font: 750 0.92rem/1.4 ui-monospace, monospace; }
.balance-pin p[b-ymq2iq7wee] { margin: 11px 0 0; color: #948b7c; font-size: 0.75rem; line-height: 1.5; }
.revision-list[b-ymq2iq7wee] { display: grid; gap: 8px; padding: 0 18px 18px; }
.revision-list > div[b-ymq2iq7wee] { display: flex; justify-content: space-between; gap: 18px; border-top: 1px solid var(--line); padding-top: 10px; color: #8797a9; font: 0.72rem/1.4 ui-monospace, monospace; }
.revision-list strong[b-ymq2iq7wee] { color: #c0ccda; }

@media (max-width: 1100px) {
    .summary-grid[b-ymq2iq7wee] { grid-template-columns: repeat(2, 1fr); }
    .match-table[b-ymq2iq7wee] { overflow-x: auto; }
    .match-row[b-ymq2iq7wee] { min-width: 1050px; }
    .lower-grid[b-ymq2iq7wee] { grid-template-columns: 1fr; }
}

@media (max-width: 720px) {
    .operations-shell[b-ymq2iq7wee] { padding: 22px 12px 40px; }
    .operations-header[b-ymq2iq7wee] { align-items: flex-start; flex-direction: column; }
    .refresh-panel[b-ymq2iq7wee] { width: 100%; grid-template-columns: 1fr auto; align-items: center; justify-items: start; }
    .refresh-panel small[b-ymq2iq7wee] { grid-column: 1 / -1; }
    .summary-grid[b-ymq2iq7wee] { grid-template-columns: 1fr; }
    .summary-card[b-ymq2iq7wee] { min-height: 112px; }
    .instance-card[b-ymq2iq7wee] { grid-template-columns: 1fr; }
    .instance-card dl[b-ymq2iq7wee] { grid-template-columns: repeat(2, 1fr); }
    .metric-grid[b-ymq2iq7wee] { grid-template-columns: repeat(2, 1fr); }
    .section-heading[b-ymq2iq7wee] { align-items: flex-start; flex-direction: column; }
    .snapshot-time[b-ymq2iq7wee] { line-height: 1.35; }
}
/* /Pages/Home.razor.rz.scp.css */
.prototype-home[b-0cjqaz090c] {
  position: relative;
  isolation: isolate;
  box-sizing: border-box;
  width: 100%;
  min-height: 100vh;
  min-height: 100dvh;
  padding: clamp(2rem, 6vw, 5rem) clamp(1.25rem, 4vw, 3rem) 2rem;
  overflow: hidden;
  background:
    radial-gradient(circle at 14% 2%, rgba(146, 88, 38, 0.18), transparent 34rem),
    radial-gradient(circle at 86% 76%, rgba(48, 72, 55, 0.13), transparent 32rem),
    linear-gradient(145deg, #0c0b0b 0%, #090a0b 44%, #060708 100%);
  color: #ded8ce;
  font-family: Inter, ui-sans-serif, system-ui, sans-serif;
}

.prototype-home[b-0cjqaz090c]::before {
  position: absolute;
  z-index: -1;
  inset: 0;
  background-image:
    linear-gradient(rgba(255, 255, 255, 0.018) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 255, 255, 0.018) 1px, transparent 1px);
  background-size: 4rem 4rem;
  content: "";
  mask-image: linear-gradient(to bottom, black, transparent 76%);
}

.hero[b-0cjqaz090c],
.destination-grid[b-0cjqaz090c],
footer[b-0cjqaz090c] {
  width: min(76rem, 100%);
  margin-inline: auto;
}

.hero[b-0cjqaz090c] {
  margin-bottom: clamp(2.5rem, 6vw, 5rem);
}

.eyebrow[b-0cjqaz090c] {
  display: inline-flex;
  align-items: center;
  gap: 0.65rem;
  margin: 0 0 1.3rem;
  color: #c99551;
  font-size: 0.7rem;
  font-weight: 800;
  letter-spacing: 0.24em;
}

.eyebrow[b-0cjqaz090c]::before {
  width: 1.8rem;
  height: 1px;
  background: #8e6033;
  content: "";
}

h1[b-0cjqaz090c] {
  max-width: 62rem;
  margin: 0;
  color: #f2ede4;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(3.2rem, 8vw, 7rem);
  font-weight: 500;
  letter-spacing: -0.06em;
  line-height: 0.88;
  text-wrap: balance;
  text-shadow: 0 1.2rem 4rem rgba(0, 0, 0, 0.65);
}

.intro[b-0cjqaz090c] {
  max-width: 44rem;
  margin: 1.7rem 0 0;
  color: #918b82;
  font-size: clamp(1rem, 2vw, 1.2rem);
  line-height: 1.7;
}

.destination-grid[b-0cjqaz090c] {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
}

.destination-card[b-0cjqaz090c] {
  --accent: 141, 119, 88;
  position: relative;
  display: flex;
  min-height: 16rem;
  box-sizing: border-box;
  flex-direction: column;
  padding: clamp(1.4rem, 3vw, 2rem);
  overflow: hidden;
  border: 1px solid rgba(var(--accent), 0.22);
  border-radius: 0.8rem;
  background:
    radial-gradient(circle at 100% 0%, rgba(var(--accent), 0.12), transparent 48%),
    linear-gradient(155deg, rgba(27, 26, 25, 0.96), rgba(15, 16, 17, 0.98));
  box-shadow:
    0 1.4rem 4rem rgba(0, 0, 0, 0.28),
    inset 0 1px rgba(255, 255, 255, 0.025);
  color: inherit;
  text-decoration: none;
  transition: border-color 170ms ease, transform 170ms ease, background 170ms ease, box-shadow 170ms ease;
}

.destination-card[b-0cjqaz090c]::before {
  position: absolute;
  top: 0;
  right: 1.2rem;
  left: 1.2rem;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(var(--accent), 0.75), transparent);
  content: "";
}

a.destination-card:hover[b-0cjqaz090c],
a.destination-card:focus-visible[b-0cjqaz090c] {
  border-color: rgba(var(--accent), 0.55);
  background:
    radial-gradient(circle at 100% 0%, rgba(var(--accent), 0.2), transparent 52%),
    linear-gradient(155deg, #201f1d, #111214);
  box-shadow:
    0 1.8rem 5rem rgba(0, 0, 0, 0.42),
    0 0 0 1px rgba(var(--accent), 0.08);
  outline: none;
  transform: translateY(-3px);
}

.destination-card.combat[b-0cjqaz090c] {
  --accent: 191, 126, 58;
}

.destination-card.operations[b-0cjqaz090c] {
  --accent: 76, 115, 164;
}

.destination-card.expeditions[b-0cjqaz090c] {
  --accent: 84, 126, 87;
}

.destination-card.roster[b-0cjqaz090c] {
  --accent: 174, 135, 72;
}

.card-status[b-0cjqaz090c] {
  display: inline-flex;
  align-self: flex-start;
  padding: 0.38rem 0.55rem;
  border: 1px solid rgba(var(--accent), 0.24);
  border-radius: 999px;
  background: rgba(var(--accent), 0.07);
  color: rgb(var(--accent));
  font-size: 0.62rem;
  font-weight: 800;
  letter-spacing: 0.16em;
}

.destination-card h2[b-0cjqaz090c] {
  margin: auto 0 0.7rem;
  color: #eee9e1;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(1.9rem, 3vw, 2.5rem);
  font-weight: 500;
  letter-spacing: -0.04em;
}

.destination-card p[b-0cjqaz090c] {
  min-height: 3.2rem;
  margin: 0 0 1.5rem;
  color: #8f8a83;
  line-height: 1.55;
}

.destination-card strong[b-0cjqaz090c] {
  color: #c9c2b8;
  font-size: 0.82rem;
  letter-spacing: 0.015em;
}

footer[b-0cjqaz090c] {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  box-sizing: border-box;
  margin-top: 2rem;
  padding-top: 1.25rem;
  border-top: 1px solid rgba(255, 255, 255, 0.055);
  color: #5f5d59;
  font-size: 0.72rem;
  letter-spacing: 0.035em;
}

footer strong[b-0cjqaz090c] {
  color: #8f8a83;
  font-weight: 600;
}

.server-indicator[b-0cjqaz090c] {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  color: inherit;
  text-decoration: none;
}

.server-indicator:hover[b-0cjqaz090c],
.server-indicator:focus-visible[b-0cjqaz090c] {
  color: #918b82;
  outline: none;
}

.server-indicator i[b-0cjqaz090c] {
  width: 0.55rem;
  height: 0.55rem;
  flex: 0 0 auto;
  border-radius: 50%;
  background: #756f66;
  box-shadow: 0 0 0 0.22rem rgba(117, 111, 102, 0.12);
}

.server-indicator.healthy i[b-0cjqaz090c] {
  background: #67b879;
  box-shadow: 0 0 0 0.22rem rgba(103, 184, 121, 0.12), 0 0 0.8rem rgba(103, 184, 121, 0.42);
}

.server-indicator.degraded i[b-0cjqaz090c] {
  background: #d4a451;
  box-shadow: 0 0 0 0.22rem rgba(212, 164, 81, 0.12), 0 0 0.8rem rgba(212, 164, 81, 0.35);
}

.server-indicator.offline i[b-0cjqaz090c] {
  background: #bd5f59;
  box-shadow: 0 0 0 0.22rem rgba(189, 95, 89, 0.12), 0 0 0.8rem rgba(189, 95, 89, 0.3);
}

.server-state[b-0cjqaz090c] {
  min-width: 3.4rem;
  color: #77736d;
  font-weight: 700;
  text-align: right;
}

.server-indicator.healthy .server-state[b-0cjqaz090c] {
  color: #67b879;
}

.server-indicator.degraded .server-state[b-0cjqaz090c] {
  color: #d4a451;
}

.server-indicator.offline .server-state[b-0cjqaz090c] {
  color: #bd5f59;
}

@media (max-width: 700px) {
  .prototype-home[b-0cjqaz090c] {
    padding-top: 2.5rem;
  }

  .hero[b-0cjqaz090c] {
    margin-bottom: 2.5rem;
  }

  .destination-grid[b-0cjqaz090c] {
    grid-template-columns: 1fr;
  }

  .destination-card[b-0cjqaz090c] {
    min-height: 13.5rem;
  }

  footer[b-0cjqaz090c] {
    flex-direction: column;
  }
}

@media (prefers-reduced-motion: reduce) {
  .destination-card[b-0cjqaz090c] {
    transition: none;
  }
}
