:root {
  color-scheme: dark;
  --bg: #050709;
  --panel: rgba(8, 12, 14, .9);
  --line: rgba(137, 255, 218, .24);
  --line-strong: rgba(185, 84, 255, .42);
  --text: #e7fff8;
  --muted: #92aaa4;
  --purple: #b954ff;
  --cyan: #66ffdc;
  --danger: #ff5c8a;
  --font: "Courier New", Courier, monospace;
}

* { box-sizing: border-box; }
html {
  min-height: 100%;
  background: var(--bg);
}
body {
  --surface-rail-width: 1180px;
  --surface-tab-width: 3.15rem;
  --surface-case-drawer-width: 430px;
  --surface-reports-drawer-width: 620px;
  --surface-operator-drawer-width: 500px;
  --surface-active-drawer-width: 0px;
  --surface-scroll-x: 0px;
  --surface-tab-height: 9.4rem;
  --surface-tab-gap: .42rem;
  --surface-rack-padding-y: .45rem;
  --surface-rack-height: calc((var(--surface-tab-height) * 3) + (var(--surface-tab-gap) * 2) + (var(--surface-rack-padding-y) * 2));
  margin: 0;
  min-height: 100vh;
  background:
    radial-gradient(circle at 72% 18%, rgba(185,84,255,.2), transparent 28rem),
    radial-gradient(circle at 18% 0, rgba(102,255,220,.1), transparent 24rem),
    linear-gradient(90deg, rgba(0,0,0,.78), rgba(5,7,9,.44) 48%, rgba(0,0,0,.6)),
    url("../assets/background.jpg") center top / cover no-repeat fixed,
    #050709;
  color: var(--text);
  font-family: var(--font);
  overflow-x: hidden;
}
body.has-casefile-drawer-open,
body:has(#casefile-drawer:target) {
  --surface-active-drawer-width: var(--surface-case-drawer-width);
}
body.has-reports-drawer-open,
body:has(#recovered-reports-drawer:target) {
  --surface-active-drawer-width: var(--surface-reports-drawer-width);
}
body.has-operator-preview-open,
body:has(#operator-preview:target) {
  --surface-active-drawer-width: var(--surface-operator-drawer-width);
}
.noise {
  position: fixed;
  inset: 0;
  pointer-events: none;
  opacity: .16;
  background-image:
    linear-gradient(rgba(255,255,255,.03) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.025) 1px, transparent 1px);
  background-size: 6px 6px;
}
.operator-shell {
  width: min(1180px, calc(100vw - 2rem));
  margin: 0 auto;
  padding: 2rem 0 3rem;
}
.operator-header,
.notice-panel,
.snapshot-grid div,
.module-panel,
.data-panel {
  border: 1px solid var(--line);
  background: linear-gradient(180deg, rgba(8,12,14,.92), rgba(6,8,10,.86));
  box-shadow: 0 22px 80px rgba(0,0,0,.38), inset 0 1px rgba(255,255,255,.05);
}
.operator-header {
  display: flex;
  align-items: center;
  gap: 1rem;
  padding: 1.2rem;
}
.seal-wrap {
  width: 4.2rem;
  height: 4.2rem;
  display: grid;
  place-items: center;
  border: 1px solid var(--line-strong);
  border-radius: 50%;
  box-shadow: 0 0 36px rgba(185,84,255,.2);
}
.seal {
  width: 3rem;
  height: 3rem;
  object-fit: contain;
}
.kicker {
  margin: 0;
  color: var(--cyan);
  font-size: .68rem;
  font-weight: 800;
  letter-spacing: .14em;
  text-transform: uppercase;
}
h1,
h2,
h3,
p {
  margin-top: 0;
}
h1 {
  margin-bottom: .35rem;
  font-size: clamp(1.7rem, 5vw, 3.2rem);
  letter-spacing: .08em;
}
h2 {
  margin-bottom: 0;
  color: var(--text);
  font-size: 1rem;
  line-height: 1.35;
}
h3 {
  margin-bottom: .2rem;
  color: var(--text);
  font-size: .9rem;
}
.subhead,
.notice-panel p,
.data-panel p,
.empty-line {
  margin-bottom: 0;
  color: var(--muted);
  line-height: 1.45;
}
.prompt { color: var(--purple); }
.notice-panel {
  margin-top: 1rem;
  padding: .9rem 1rem;
}
.snapshot-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: .7rem;
  margin-top: 1rem;
}
.snapshot-grid div,
.tracker-summary div {
  padding: .85rem;
}
.snapshot-grid span,
.tracker-summary span,
.console-entry strong {
  display: block;
  color: var(--cyan);
  font-size: .65rem;
  font-weight: 800;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.snapshot-grid strong,
.tracker-summary strong {
  display: block;
  margin-top: .35rem;
  overflow-wrap: anywhere;
}
.tracker-summary {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .7rem;
  margin-bottom: 1rem;
}
.tracker-summary div {
  border: 1px solid rgba(137,255,218,.2);
  background: rgba(0,0,0,.24);
}
.tracker-note {
  margin: 1rem 0 0;
  color: var(--muted);
  font-size: .82rem;
  line-height: 1.45;
}
.console-nav {
  position: sticky;
  top: .5rem;
  z-index: 20;
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: .55rem;
  margin-top: 1rem;
  padding: .45rem;
  border: 1px solid rgba(137,255,218,.18);
  background: rgba(5,7,9,.92);
  box-shadow: 0 14px 38px rgba(0,0,0,.34), inset 0 1px rgba(255,255,255,.04);
  backdrop-filter: blur(12px);
}
.module-tab,
.button {
  min-height: 2.7rem;
  border: 1px solid var(--line);
  background: rgba(0,0,0,.34);
  color: var(--text);
  cursor: pointer;
  font: inherit;
  font-size: .72rem;
  font-weight: 800;
  letter-spacing: .08em;
  white-space: nowrap;
  text-transform: uppercase;
  text-decoration: none;
}
.module-tab.is-active,
.button.primary {
  border-color: rgba(185,84,255,.7);
  box-shadow: 0 0 22px rgba(185,84,255,.14), inset 0 0 24px rgba(185,84,255,.1);
}
.button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: .72rem .9rem;
}
.button.ghost {
  color: var(--cyan);
}
.button.danger {
  border-color: rgba(255,92,138,.44);
  color: #ffd8e4;
}
.module-panel {
  display: none;
  margin-top: 1rem;
  padding: 1rem;
}
.module-panel.is-active {
  display: block;
}
.sealed-panel {
  display: grid;
  gap: .75rem;
  margin-top: 1rem;
  padding: 1rem;
  border: 1px solid rgba(185,84,255,.34);
  background:
    linear-gradient(135deg, rgba(0,0,0,.5), rgba(26,4,37,.32)),
    repeating-linear-gradient(0deg, rgba(102,255,220,.035) 0 1px, transparent 1px 7px);
  box-shadow: inset 0 0 24px rgba(185,84,255,.08);
}
.sealed-panel[hidden] {
  display: none;
}
.sealed-panel h2,
.sealed-panel p {
  margin: 0;
}
.sealed-panel .route-actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .7rem;
}
body.operator-record-sealed .console-nav,
body.operator-record-sealed .module-panel,
body.operator-record-sealed .data-panel {
  display: none;
}
.module-heading {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 1rem;
}
.console-form {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .75rem;
}
.status-form {
  display: block;
}
.console-form label {
  display: grid;
  gap: .35rem;
  color: var(--cyan);
  font-size: .67rem;
  font-weight: 800;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.console-form label:has(textarea),
.console-form .button,
.volunteer-row,
.frequency-form label:has(textarea) {
  grid-column: 1 / -1;
}
.page-lock-status {
  grid-column: 1 / -1;
  margin: 0 0 .7rem;
  color: var(--muted);
  font-size: .76rem;
}
#module-frequency .module-heading {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: .55rem .75rem;
}
#module-frequency .module-heading .sheet-edit-toggle {
  margin-left: auto;
}
.sheet-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
  gap: .9rem;
  align-items: start;
}
.sheet-card {
  min-width: 0;
  padding: .9rem;
  border: 1px solid rgba(137,255,218,.2);
  background: rgba(0,0,0,.24);
}
.sheet-grid > .wide {
  grid-column: 1 / -1;
}
.operator-live-readout {
  align-self: start;
}
.sheet-edit-toggle {
  justify-self: end;
}
#module-sheet:not(.is-editing) .sheet-edit-only {
  display: none;
}
.operator-case-strip,
.active-frequency-strip {
  padding: .75rem;
  border-color: rgba(137,255,218,.28);
  background: linear-gradient(90deg, rgba(137,255,218,.05), rgba(185,84,255,.04));
}
.operator-case-strip .card-label,
.active-frequency-strip .card-label {
  margin-bottom: .55rem;
}
.case-strip-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: .5rem;
  align-items: end;
}
.editable-case-strip {
  grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
}
.grant-preview {
  display: block;
  margin-top: .28rem;
  font-size: .72rem;
  letter-spacing: .04em;
  text-transform: uppercase;
  color: var(--muted, #8a9aa8);
}
.build-defining-notice {
  grid-column: 1 / -1;
  margin: 0;
  font-size: .78rem;
  color: var(--warning, #c9a227);
}
.identity-build-controls {
  grid-column: 1 / -1;
  padding-bottom: .55rem;
  margin-bottom: .15rem;
  border-bottom: 1px solid rgba(137,255,218,.16);
}
.identity-build-controls .creation-row {
  margin-bottom: 0;
  grid-template-columns: auto auto minmax(0, 1fr);
}
select.is-locked {
  opacity: .72;
  cursor: not-allowed;
}
.operator-case-strip input,
.active-frequency-strip input {
  min-height: 2.2rem;
  padding: .42rem .5rem;
}
.active-frequency-strip {
  padding-top: .65rem;
  padding-bottom: .65rem;
}
.status-chip {
  display: grid;
  gap: .18rem;
  min-height: 3rem;
  padding: .55rem .6rem;
  border: 1px solid rgba(137,255,218,.16);
  background: rgba(0,0,0,.26);
}
.status-chip span {
  color: var(--cyan);
  font-size: .58rem;
  font-weight: 800;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.status-chip strong {
  color: var(--text);
  font-size: .78rem;
  line-height: 1.25;
  overflow-wrap: anywhere;
}
.identity-card {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
  gap: .55rem;
}
.identity-card .card-label {
  grid-column: 1 / -1;
}
.frequency-readout-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: end;
}
.frequency-readout-row {
  display: flex;
  align-items: stretch;
  flex-wrap: wrap;
  gap: .5rem;
  grid-column: 1 / -1;
}
.primary-frequency-chip {
  display: inline-flex;
  align-items: baseline;
  gap: .5rem;
  min-height: 1.85rem;
  padding: .25rem .55rem;
  flex: 0 1 auto;
  border: 1px solid rgba(137,255,218,.16);
  background: rgba(0,0,0,.26);
}
.primary-frequency-chip span {
  color: var(--cyan);
  font-size: .58rem;
  font-weight: 800;
  letter-spacing: .12em;
  text-transform: uppercase;
  white-space: nowrap;
}
.primary-frequency-chip strong {
  color: var(--text);
  font-size: .85rem;
  line-height: 1.2;
  white-space: nowrap;
}
.bleed-cue-block,
.frequency-recovery-wrap {
  grid-column: 1 / -1;
}
.bleed-cue-block {
  padding: .55rem .6rem;
  border: 1px solid rgba(137,255,218,.16);
  background: rgba(0,0,0,.22);
}
.readout-inline-label {
  display: block;
  margin-bottom: .35rem;
  color: var(--cyan);
  font-size: .58rem;
  font-weight: 800;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.bleed-cue-copy {
  margin: 0;
  color: var(--text);
  font-size: .78rem;
  line-height: 1.45;
}
.frequency-recovery-wrap .recovery-field.compact {
  margin-top: .35rem;
}
.currency-readouts {
  display: flex;
  flex-wrap: wrap;
  gap: .5rem;
  grid-column: auto;
  margin-left: auto;
}
.currency-chip {
  display: grid;
  gap: .12rem;
  flex: 0 0 auto;
  min-width: 3.75rem;
  max-width: 5rem;
  min-height: 1.65rem;
  padding: .2rem .45rem;
  border: 1px solid rgba(137,255,218,.16);
  background: rgba(0,0,0,.26);
}
.currency-chip span {
  color: var(--cyan);
  font-size: .58rem;
  font-weight: 800;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.currency-chip strong {
  font-size: 1rem;
  text-align: center;
  color: var(--text);
  line-height: 1.1;
}
.card-label {
  margin: 0 0 .7rem;
  color: var(--cyan);
  font-size: .65rem;
  font-weight: 800;
  letter-spacing: .14em;
  text-transform: uppercase;
}
.readout-block {
  display: grid;
  gap: .25rem;
  margin-bottom: .7rem;
  padding: .7rem;
  border: 1px solid rgba(137,255,218,.16);
  background: rgba(0,0,0,.2);
}
.readout-block span {
  color: var(--cyan);
  font-size: .62rem;
  font-weight: 800;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.readout-block strong {
  color: var(--text);
  font-size: .82rem;
  line-height: 1.35;
  overflow-wrap: anywhere;
}
.condition-strip {
  grid-column: 1 / -1;
  padding: .85rem;
  border: 1px solid rgba(137,255,218,.2);
  background: rgba(0,0,0,.2);
}
.tracker-board {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
  gap: .6rem;
  align-items: start;
}
.line-tracker {
  display: grid;
  grid-template-columns: minmax(8.4rem, .34fr) minmax(8rem, 1fr) minmax(6.8rem, .3fr);
  gap: .45rem;
  align-items: center;
  min-height: 2.8rem;
  padding: .3rem .45rem;
  background: rgba(0,0,0,.18);
}
.pip-header {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: .45rem;
  min-width: 0;
}
.pip-header strong,
.pip-header span {
  font-size: .64rem;
  letter-spacing: .1em;
  text-transform: uppercase;
}
.pip-header strong {
  overflow: hidden;
  text-overflow: ellipsis;
}
.pip-header span {
  color: var(--muted);
  white-space: nowrap;
}
.pip-derived {
  margin: 0;
  color: var(--muted);
  font-size: .64rem;
  line-height: 1.35;
  text-align: right;
  text-transform: uppercase;
}
.line-pips {
  display: grid;
  grid-template-columns: repeat(10, minmax(.52rem, 1fr));
  gap: .16rem;
  align-content: center;
}
.pip {
  aspect-ratio: 2.2 / 1;
  min-width: 0;
  min-height: .52rem;
  border: 1px solid rgba(137,255,218,.34);
  background: rgba(0,0,0,.28);
  cursor: pointer;
}
.pip.is-filled {
  background: var(--cyan);
  box-shadow: 0 0 16px rgba(102,255,220,.22);
}
.pip:disabled {
  cursor: not-allowed;
  opacity: .28;
}
.line-tracker.danger .pip.is-filled {
  background: var(--danger);
  box-shadow: 0 0 16px rgba(255,92,138,.22);
}
.line-tracker.lotus .pip.is-filled {
  background: var(--purple);
  box-shadow: 0 0 16px rgba(185,84,255,.28);
}
.pip-controls {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .4rem;
  align-self: end;
  display: none;
}
.pip-controls button,
.segmented button {
  min-height: 2.25rem;
  border: 1px solid rgba(137,255,218,.22);
  background: rgba(0,0,0,.32);
  color: var(--text);
  cursor: pointer;
  font: inherit;
  font-weight: 800;
}
.segmented {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .35rem;
  margin-bottom: .55rem;
}
.segmented.attention {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.segmented.misfire {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.segmented button {
  min-height: 2rem;
  padding: .35rem .3rem;
  font-size: .6rem;
  letter-spacing: .05em;
  text-transform: uppercase;
}
.compact-control-card {
  padding: .7rem;
  align-self: start;
}
.compact-control-card textarea {
  min-height: 4.8rem;
}
.segmented button.is-active,
.pip-controls button:hover,
.segmented button:hover {
  border-color: rgba(185,84,255,.72);
  box-shadow: inset 0 0 20px rgba(185,84,255,.12), 0 0 18px rgba(185,84,255,.12);
}
.band-meter {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .45rem;
  margin-bottom: .7rem;
}
.band-meter span {
  display: grid;
  min-height: 2.25rem;
  place-items: center;
  border: 1px solid rgba(137,255,218,.18);
  background: rgba(0,0,0,.24);
  color: var(--muted);
  font-size: .65rem;
  font-weight: 800;
  letter-spacing: .05em;
  text-align: center;
  text-transform: uppercase;
}
.band-meter span.is-active {
  border-color: rgba(185,84,255,.72);
  color: var(--text);
  box-shadow: inset 0 0 20px rgba(185,84,255,.12), 0 0 18px rgba(185,84,255,.12);
}
.roll-row {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: .65rem;
  align-items: end;
}

.operator-roll-dock {
  max-width: 980px;
  justify-self: center;
  width: 100%;
  border-color: rgba(185,84,255,.46);
  box-shadow: inset 0 0 28px rgba(185,84,255,.07), 0 0 24px rgba(185,84,255,.08);
}
.operator-roll-dock .operator-roll-heading {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: .35rem .65rem;
  margin-bottom: .55rem;
}
.operator-roll-dock .operator-roll-heading .card-label {
  margin-bottom: 0;
}
.operator-roll-dock .roll-guide-drawer {
  flex: 1 1 12rem;
  max-width: 100%;
  margin: 0;
  padding: 0;
  border: 1px solid rgba(185,84,255,.22);
  background: rgba(0,0,0,.18);
}
.operator-roll-dock .roll-guide-drawer summary {
  padding: .3rem .5rem;
  color: var(--muted);
  cursor: pointer;
  font-size: .64rem;
  font-weight: 700;
  letter-spacing: .04em;
  line-height: 1.35;
  list-style: none;
  text-transform: none;
}
.operator-roll-dock .roll-guide-drawer summary::-webkit-details-marker {
  display: none;
}
.operator-roll-dock .roll-guide-drawer[open] summary {
  color: var(--purple);
  border-bottom: 1px solid rgba(185,84,255,.16);
}
.operator-roll-dock .roll-guide-body {
  padding: .45rem .55rem .55rem;
  color: var(--muted);
  font-size: .68rem;
  line-height: 1.45;
}
.operator-roll-dock .roll-guide-body p {
  margin: 0 0 .45rem;
}
.operator-roll-dock .roll-guide-body ul {
  margin: 0 0 .45rem;
  padding-left: 1.1rem;
}
.operator-roll-dock .roll-guide-body li + li {
  margin-top: .18rem;
}

.operator-live-grid,
.live-lower-grid {
  display: grid;
  width: 100%;
  grid-template-columns: minmax(18rem, 1fr) minmax(22rem, 1fr);
  grid-template-areas:
    "attributes misfire"
    "skills notes";
  gap: .9rem;
  align-items: start;
}

.operator-live-grid > * {
  min-width: 0;
}

.attributes-card {
  grid-area: attributes;
}

.active-misfire-card {
  grid-area: misfire;
}
.active-misfire-card .active-misfire-heading {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: .35rem .65rem;
  margin-bottom: .55rem;
}
.active-misfire-card .active-misfire-heading .card-label {
  margin-bottom: 0;
}
.active-misfire-card .misfire-help-drawer {
  flex: 1 1 12rem;
  max-width: 100%;
  margin: 0;
  padding: 0;
  border: 1px solid rgba(137,255,218,.14);
  background: rgba(0,0,0,.18);
}
.active-misfire-card .misfire-help-drawer summary {
  padding: .3rem .5rem;
  color: var(--muted);
  cursor: pointer;
  font-size: .64rem;
  font-weight: 700;
  letter-spacing: .04em;
  line-height: 1.35;
  list-style: none;
  text-transform: none;
}
.active-misfire-card .misfire-help-drawer summary::-webkit-details-marker {
  display: none;
}
.active-misfire-card .misfire-help-drawer[open] summary {
  color: var(--cyan);
  border-bottom: 1px solid rgba(137,255,218,.12);
}
.active-misfire-card .misfire-help-body {
  padding: .45rem .55rem .55rem;
  color: var(--muted);
  font-size: .68rem;
  line-height: 1.45;
}
.active-misfire-card .misfire-help-body p {
  margin: 0 0 .45rem;
}
.active-misfire-card .misfire-help-body ul {
  margin: 0 0 .45rem;
  padding-left: 1.1rem;
}
.active-misfire-card .misfire-help-body li + li {
  margin-top: .18rem;
}

.skill-summary-card {
  grid-area: skills;
}

.immediate-notes-card {
  grid-area: notes;
}

.immediate-notes-card textarea {
  min-height: 11rem;
  resize: vertical;
}

.observation-panel,
.misfire-panel,
.operator-recovery,
.operator-notes,
.skill-manager {
  align-self: start;
  height: auto;
  min-height: 0;
}

.operator-recovery {
  padding: .7rem;
}

.observation-panel .local-note {
  margin: 0;
  color: var(--muted);
  font-size: .72rem;
  line-height: 1.4;
}
.roll-mode {
  display: grid;
  grid-template-columns: 1fr;
  gap: .35rem;
  margin: 0;
  padding: .45rem .55rem;
  border: 1px solid rgba(137,255,218,.18);
  background: rgba(0,0,0,.2);
}
.roll-mode label {
  display: flex;
  align-items: center;
  gap: .4rem;
  color: var(--text);
  font-size: .66rem;
  letter-spacing: .06em;
}
.roll-mode input {
  width: auto;
}
.roll-output {
  margin-top: .7rem;
  min-height: 2.4rem;
  padding: .7rem;
  border: 1px solid rgba(137,255,218,.16);
  background: rgba(0,0,0,.22);
  color: var(--muted);
  line-height: 1.35;
}
details {
  grid-column: 1 / -1;
  border: 1px solid rgba(137,255,218,.2);
  background: rgba(0,0,0,.2);
  padding: .75rem;
}
summary {
  color: var(--cyan);
  cursor: pointer;
  font-size: .72rem;
  font-weight: 800;
  letter-spacing: .12em;
  text-transform: uppercase;
}
details label {
  margin-top: .7rem;
}
fieldset.recovery-field.compact {
  grid-template-columns: repeat(auto-fit, minmax(6.2rem, 1fr));
  padding: 0;
  border: 0;
}
fieldset.recovery-field.compact label {
  justify-content: center;
  min-height: 2.5rem;
  border: 1px solid rgba(137,255,218,.18);
  background: rgba(0,0,0,.24);
}
.archive-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
}
.archive-grid > section {
  min-width: 0;
  padding: .9rem;
  border: 1px solid rgba(137,255,218,.18);
  background: rgba(0,0,0,.18);
}
.lotus-workspace {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(16rem, .75fr);
  gap: .9rem;
  align-items: start;
}
.lotus-map {
  position: relative;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  grid-auto-rows: max-content;
  gap: .55rem;
  align-content: start;
  align-items: start;
  min-height: 16rem;
  padding: .75rem;
  border: 1px solid rgba(185,84,255,.28);
  background:
    linear-gradient(90deg, rgba(137,255,218,.055) 1px, transparent 1px),
    linear-gradient(0deg, rgba(137,255,218,.045) 1px, transparent 1px),
    radial-gradient(circle at 50% 50%, rgba(185,84,255,.16), transparent 8rem),
    rgba(0,0,0,.22);
  background-size: 2.4rem 2.4rem, 2.4rem 2.4rem, auto;
}
.lotus-map::before {
  content: "";
  position: absolute;
  inset: 50% auto auto 50%;
  width: min(15rem, 34%);
  aspect-ratio: 1;
  border: 1px solid rgba(137,255,218,.22);
  border-radius: 50%;
  transform: translate(-50%, -50%);
  box-shadow:
    0 0 0 3.2rem rgba(137,255,218,.018),
    0 0 0 6.4rem rgba(185,84,255,.012),
    0 0 28px rgba(185,84,255,.18);
  pointer-events: none;
}
.lotus-map::after {
  content: "";
  position: absolute;
  inset: .75rem;
  background:
    linear-gradient(90deg, transparent 0 18%, rgba(137,255,218,.18) 18% 18.2%, transparent 18.2% 48%, rgba(137,255,218,.12) 48% 48.2%, transparent 48.2% 82%, rgba(137,255,218,.18) 82% 82.2%, transparent 82.2%),
    linear-gradient(0deg, transparent 0 22%, rgba(185,84,255,.13) 22% 22.2%, transparent 22.2% 77%, rgba(185,84,255,.13) 77% 77.2%, transparent 77.2%);
  opacity: .22;
  pointer-events: none;
}
.lotus-petal {
  position: relative;
  display: grid;
  align-content: start;
  gap: .45rem;
  min-height: 6.8rem;
  padding: .55rem .62rem .62rem;
  overflow: hidden;
  border: 1px solid rgba(137,255,218,.14);
  border-radius: .18rem;
  background:
    linear-gradient(90deg, rgba(137,255,218,.08) 0 1px, transparent 1px 34%, rgba(137,255,218,.055) 34% calc(34% + 1px), transparent calc(34% + 1px) 66%, rgba(137,255,218,.055) 66% calc(66% + 1px), transparent calc(66% + 1px)),
    radial-gradient(ellipse at 50% 130%, rgba(137,255,218,.1), transparent 58%),
    rgba(0,0,0,.26);
  opacity: .58;
  transition: border-color .18s ease, box-shadow .18s ease, opacity .18s ease, transform .18s ease;
}
.lotus-petal > * {
  position: relative;
  z-index: 1;
}
.lotus-petal::before {
  content: "";
  position: absolute;
  inset: .34rem .48rem auto;
  height: 3.5rem;
  border: 1px solid rgba(137,255,218,.16);
  border-bottom: 0;
  border-radius: 50% 50% 0 0 / 84% 84% 0 0;
  opacity: .55;
  pointer-events: none;
}
.lotus-petal::after {
  content: "";
  position: absolute;
  inset: auto .75rem .72rem;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(137,255,218,.28), rgba(185,84,255,.22), transparent);
  opacity: .48;
  pointer-events: none;
}
.lotus-petal.is-selected {
  border-color: rgba(185,84,255,.72);
  opacity: 1;
  box-shadow: inset 0 0 24px rgba(185,84,255,.1), 0 0 20px rgba(185,84,255,.12);
  transform: translateY(-1px);
}
.lotus-petal.is-powered {
  opacity: .88;
  border-color: rgba(137,255,218,.3);
  box-shadow: inset 0 0 18px rgba(137,255,218,.055);
}
.lotus-petal.is-gate-open .lotus-pips {
  border-color: rgba(137,255,218,.34);
  box-shadow: inset 0 0 0 1px rgba(137,255,218,.08), 0 0 18px rgba(137,255,218,.08);
}
.lotus-petal[data-gate="2"] .lotus-pips,
.lotus-petal[data-gate="3"] .lotus-pips {
  border-color: rgba(185,84,255,.34);
}
.lotus-petal[data-gate="3"] .lotus-pips {
  box-shadow: inset 0 0 0 1px rgba(185,84,255,.18), 0 0 22px rgba(185,84,255,.12);
}
.lotus-petal.is-pulsing::before {
  animation: lotus-resonance .72s ease-out;
}
.lotus-petal.is-pulsing::after {
  animation: lotus-trace .72s ease-out;
}
.lotus-petal.is-blind {
  border-color: rgba(255,92,138,.44);
  opacity: .76;
}
.lotus-petal-name,
.blind-toggle {
  border: 1px solid rgba(137,255,218,.2);
  background: rgba(0,0,0,.32);
  color: var(--text);
  cursor: pointer;
  font: inherit;
  font-size: .68rem;
  font-weight: 800;
  letter-spacing: .08em;
  min-height: 2rem;
  text-transform: uppercase;
}
.lotus-petal-name {
  justify-self: stretch;
  color: var(--cyan);
  background:
    linear-gradient(90deg, rgba(137,255,218,.08), rgba(0,0,0,.28) 38%, rgba(137,255,218,.04)),
    rgba(0,0,0,.32);
}
.lotus-pips {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: .18rem;
  align-items: center;
  padding: .26rem;
  border: 1px solid rgba(137,255,218,.12);
  background:
    linear-gradient(90deg, transparent 32%, rgba(137,255,218,.14) 32% 33%, transparent 33% 66%, rgba(137,255,218,.14) 66% 67%, transparent 67%),
    rgba(0,0,0,.22);
}
.lotus-pips .pip {
  position: relative;
  min-height: .68rem;
  border-color: rgba(137,255,218,.18);
  background: rgba(0,0,0,.34);
}
.lotus-pips .pip.is-filled {
  background: linear-gradient(90deg, rgba(102,255,220,.72), rgba(137,255,218,.98));
  box-shadow: 0 0 12px rgba(102,255,220,.28);
  animation: pip-online .62s ease-out;
}
.lotus-void {
  display: grid;
  grid-template-columns: auto minmax(3.4rem, 1fr);
  gap: .36rem;
  align-items: center;
  min-width: 0;
  font-size: .66rem;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.lotus-void input {
  min-height: 1.85rem;
  padding: .25rem .45rem;
  text-align: center;
}
.pip.is-locked {
  border-color: rgba(255,255,255,.08);
  background: rgba(255,255,255,.025);
}
@keyframes pip-online {
  0% { box-shadow: 0 0 0 rgba(102,255,220,0); transform: scaleX(.7); }
  48% { box-shadow: 0 0 20px rgba(102,255,220,.46); transform: scaleX(1.08); }
  100% { box-shadow: 0 0 12px rgba(102,255,220,.28); transform: scaleX(1); }
}
@keyframes lotus-resonance {
  0% { opacity: .24; transform: scale(.84); }
  45% { opacity: .95; transform: scale(1.04); }
  100% { opacity: .55; transform: scale(1); }
}
@keyframes lotus-trace {
  0% { opacity: .16; transform: scaleX(.3); }
  50% { opacity: .85; transform: scaleX(1); }
  100% { opacity: .48; transform: scaleX(1); }
}
@media (prefers-reduced-motion: reduce) {
  .lotus-petal,
  .lotus-pips .pip {
    transition: none;
  }
  .lotus-petal.is-pulsing::before,
  .lotus-petal.is-pulsing::after,
  .lotus-pips .pip.is-filled {
    animation: none;
  }
}
.attribute-grid,
.skill-summary-list {
  display: grid;
  gap: .38rem;
}
.attribute-row {
  display: grid;
  grid-template-columns: minmax(5.6rem, .34fr) minmax(0, 1fr);
  gap: .42rem;
  align-items: center;
}
.attribute-name {
  min-height: 2rem;
  border: 1px solid rgba(137,255,218,.2);
  background: rgba(0,0,0,.28);
  color: var(--cyan);
  cursor: pointer;
  font: inherit;
  font-size: .64rem;
  font-weight: 800;
  letter-spacing: .08em;
  text-align: left;
  text-transform: uppercase;
}
.attribute-pips {
  display: grid;
  grid-template-columns: repeat(5, minmax(.78rem, 1.35rem));
  gap: .24rem;
  justify-content: start;
}
.attribute-pips .pip {
  aspect-ratio: 1;
  border-radius: 50%;
  min-height: .78rem;
  width: 100%;
}
.skill-builder {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(4.5rem, .35fr) minmax(7rem, .5fr) auto;
  gap: .55rem;
  align-items: end;
  margin-bottom: .75rem;
}
.skill-summary-list {
  grid-template-columns: 1fr;
  align-items: start;
}

.skill-summary-row {
  min-width: 0;
  border: 1px solid rgba(137,255,218,.16);
  background: rgba(0,0,0,.22);
  color: var(--text);
  font-size: .74rem;
  line-height: 1.35;
}

.skill-summary-row summary {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: .5rem;
  min-height: 2.35rem;
  padding: .35rem .55rem;
  cursor: pointer;
  list-style: none;
}

.skill-summary-row.is-editable summary {
  grid-template-columns: auto minmax(0, 1fr) auto auto auto;
}

.skill-summary-row summary::-webkit-details-marker {
  display: none;
}

.skill-caret {
  color: var(--purple);
  font-weight: 800;
}

.skill-caret::before {
  content: ">";
}

.skill-summary-row[open] .skill-caret::before {
  content: "v";
}

.skill-summary-select {
  display: block;
  min-width: 0;
  width: 100%;
  border: 0;
  background: transparent;
  color: inherit;
  cursor: pointer;
  font: inherit;
  text-align: left;
  padding: 0;
}

.skill-summary-select strong {
  display: block;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  color: var(--cyan);
  white-space: nowrap;
}

.skill-summary-rank {
  justify-self: end;
  min-width: 2rem;
  border: 0;
  background: transparent;
  color: var(--text);
  cursor: pointer;
  font: inherit;
  font-weight: 800;
  text-align: right;
  padding: 0;
}

.skill-inline-remove {
  justify-self: end;
  width: auto;
  min-height: 1.8rem;
  padding: .2rem .5rem;
  border: 1px solid rgba(255,92,138,.45);
  background: rgba(0,0,0,.22);
  color: #ffd8e4;
  cursor: pointer;
  font: inherit;
  font-size: .58rem;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.skill-inline-rank {
  display: grid;
  grid-template-columns: 1.8rem 1.8rem;
  align-items: center;
  gap: .25rem;
  justify-self: end;
}

.skill-inline-rank button {
  min-height: 1.8rem;
  border: 1px solid rgba(137,255,218,.22);
  background: rgba(0,0,0,.28);
  color: var(--text);
  cursor: pointer;
  font: inherit;
  font-weight: 800;
}

.skill-inline-rank button:disabled {
  border-color: rgba(137,255,218,.12);
  color: var(--muted);
  cursor: default;
}

.skill-editor-panel {
  margin-top: .65rem;
  margin-bottom: .8rem;
  border: 1px solid rgba(137,255,218,.16);
  background: rgba(0,0,0,.18);
}

.skill-editor-panel > summary {
  min-height: 2.6rem;
  padding: .65rem .75rem;
  color: var(--cyan);
  cursor: pointer;
  font-size: .66rem;
  font-weight: 800;
  letter-spacing: .12em;
  list-style: none;
  text-transform: uppercase;
}

.skill-editor-panel > summary::-webkit-details-marker {
  display: none;
}

.skill-editor-panel > summary::before {
  content: ">";
  margin-right: .5rem;
  color: var(--purple);
}

.skill-editor-panel[open] > summary {
  border-bottom: 1px solid rgba(137,255,218,.16);
}

.skill-editor-panel[open] > summary::before {
  content: "v";
}

.skill-editor-tools {
  margin-top: .65rem;
  padding-top: .65rem;
  border-top: 1px solid rgba(137,255,218,.16);
}
.skill-editor-tools .skill-builder {
  margin-bottom: .5rem;
}
.skill-editor-tools .skill-rank-preview {
  margin: 0;
}

.skill-summary-row .skill-scale {
  margin: 0;
  padding: .35rem .75rem .7rem 1.8rem;
}

.creation-row {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: .55rem;
  align-items: center;
  margin-bottom: .75rem;
}
.creation-row span,
.cost-preview {
  color: var(--muted);
  font-size: .72rem;
  font-weight: 800;
  letter-spacing: .06em;
  line-height: 1.35;
  text-transform: uppercase;
}
.cost-preview {
  min-height: 2.7rem;
  display: grid;
  align-items: center;
  padding: .45rem .55rem;
  border: 1px solid rgba(137,255,218,.18);
  background: rgba(0,0,0,.2);
}
.skill-rank-preview,
.skill-scale {
  margin: 0;
  color: var(--muted);
  font-size: .72rem;
  line-height: 1.4;
}
.skill-rank-preview {
  margin: -.25rem 0 .65rem;
  padding: .55rem .65rem;
  border: 1px solid rgba(137,255,218,.14);
  background: rgba(0,0,0,.18);
}
.skill-scale {
  grid-column: 1 / -1;
  padding: .1rem .2rem .35rem;
}
.lotus-detail {
  min-width: 0;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .55rem;
  padding: .9rem;
  border: 1px solid rgba(137,255,218,.2);
  background: rgba(0,0,0,.24);
}
.lotus-detail .card-label,
.lotus-detail .lotus-stat-grid,
.lotus-detail .lotus-copy,
.lotus-detail .lotus-unlocks {
  grid-column: 1 / -1;
}
.lotus-detail > .readout-block,
.lotus-stat-grid .readout-block {
  margin-bottom: 0;
}
.lotus-copy {
  margin: 0;
  color: var(--muted);
  line-height: 1.45;
}
.lotus-stat-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .5rem;
  margin: .65rem 0;
}
.lotus-stat-grid .readout-block {
  min-width: 0;
}
.lotus-unlocks {
  display: grid;
  gap: .65rem;
  margin-top: .8rem;
  padding-top: .8rem;
  border-top: 1px solid rgba(137,255,218,.16);
}
.lotus-unlocks h3 {
  margin: 0;
  color: var(--cyan);
  font-size: .68rem;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.lotus-unlocks ol {
  display: grid;
  gap: .45rem;
  margin: 0;
  padding-left: 1.25rem;
}
.lotus-unlocks li {
  color: var(--muted);
  font-size: .76rem;
  line-height: 1.45;
}
.lotus-unlocks li p {
  margin: .25rem 0 0;
}
.lotus-unlocks strong {
  color: var(--text);
}
.compact-rule-entry {
  list-style: none;
}
.compact-rule-entry details {
  border: 1px solid rgba(137,255,218,.12);
  background: rgba(0,0,0,.18);
}
.compact-rule-entry summary {
  cursor: pointer;
  padding: .45rem .55rem;
  color: var(--text);
  font-weight: 800;
}
.compact-rule-entry details[open] {
  border-color: rgba(137,255,218,.28);
  box-shadow: inset 0 0 16px rgba(137,255,218,.06);
}
.compact-rule-entry details p {
  margin: 0;
  padding: 0 .55rem .5rem;
}
.expression-meta {
  color: rgba(146, 170, 164, .86);
  font-size: .68rem;
}
.lotus-warning {
  margin: 0;
  color: var(--purple);
  font-size: .72rem;
  font-weight: 800;
  line-height: 1.4;
  text-transform: uppercase;
}
.frequency-dashboard {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(16rem, .75fr);
  gap: .8rem;
}
.frequency-profile,
.frequency-summary {
  min-width: 0;
  padding: .85rem;
  border: 1px solid rgba(137,255,218,.18);
  background:
    linear-gradient(180deg, rgba(137,255,218,.04), transparent 42%),
    rgba(0,0,0,.24);
}
.resonance-profile {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .55rem;
}
.resonance-group {
  min-width: 0;
  padding: .55rem;
  border: 1px solid rgba(137,255,218,.12);
  background: rgba(0,0,0,.18);
}
.resonance-group h3 {
  margin: 0 0 .4rem;
  color: var(--cyan);
  font-size: .66rem;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.resonance-group ul {
  display: grid;
  gap: .35rem;
  margin: 0;
  padding: 0;
  list-style: none;
}
.resonance-group li {
  display: grid;
  gap: .16rem;
  color: var(--muted);
  font-size: .68rem;
  line-height: 1.35;
}
.resonance-group strong {
  color: var(--text);
  font-size: .7rem;
}
.build-summary {
  display: grid;
  gap: .45rem;
}
.summary-row {
  display: grid;
  grid-template-columns: minmax(0, .9fr) minmax(0, 1fr);
  gap: .65rem;
  align-items: start;
  padding-bottom: .42rem;
  border-bottom: 1px solid rgba(137,255,218,.1);
}
.summary-row span {
  color: var(--muted);
  font-size: .66rem;
  letter-spacing: .1em;
  text-transform: uppercase;
}
.summary-row strong {
  color: var(--text);
  font-size: .78rem;
  line-height: 1.35;
}
input,
textarea,
select {
  width: 100%;
  border: 1px solid rgba(137,255,218,.22);
  background: rgba(0,0,0,.42);
  color: var(--text);
  font: inherit;
  font-size: .84rem;
  line-height: 1.35;
  padding: .72rem;
}
textarea {
  resize: vertical;
}
fieldset.recovery-field {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: .55rem;
  margin: 0;
  padding: .75rem;
  border: 1px solid rgba(137,255,218,.22);
}
.recovery-field legend {
  padding: 0 .35rem;
  color: var(--cyan);
  font-size: .67rem;
  font-weight: 800;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.recovery-field label {
  display: flex;
  align-items: center;
  gap: .45rem;
  color: var(--text);
  font-size: .72rem;
  letter-spacing: .06em;
}
.recovery-field input {
  width: auto;
}
input:focus,
textarea:focus,
select:focus,
button:focus-visible,
a:focus-visible {
  outline: 2px solid rgba(185,84,255,.7);
  outline-offset: 2px;
}
.entry-list {
  display: grid;
  gap: .75rem;
  margin-top: 1rem;
}

.equipment-law {
  display: grid;
  gap: .55rem;
  padding: .85rem;
  border: 1px solid rgba(137,255,218,.16);
  background: rgba(0,0,0,.22);
  color: var(--muted);
  line-height: 1.45;
}

.equipment-law p {
  margin: 0;
}

.authorization-notice {
  margin-bottom: .85rem;
  padding: .85rem;
  border: 1px solid rgba(185,84,255,.3);
  background: rgba(26,4,37,.26);
  color: var(--text);
  line-height: 1.45;
  white-space: pre-wrap;
}

.authorization-import-surface {
  display: grid;
  grid-template-columns: minmax(16rem, max-content) minmax(22rem, 1fr);
  gap: .85rem;
  align-items: stretch;
  margin-bottom: 1rem;
}

.authorization-current-grid,
.authorization-unlock-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
  gap: .85rem;
}

.authorization-current-grid div,
.authorization-unlock-grid > section {
  min-width: 0;
  padding: .85rem;
  border: 1px solid rgba(137,255,218,.16);
  background: rgba(0,0,0,.22);
}

.authorization-current-grid span {
  display: block;
  color: var(--cyan);
  font-size: .66rem;
  font-weight: 800;
  letter-spacing: .1em;
  text-transform: uppercase;
}

.authorization-current-grid strong {
  display: block;
  margin-top: .4rem;
  overflow-wrap: anywhere;
  font-size: .9rem;
}

.module-heading.compact {
  margin-bottom: .75rem;
}

.module-heading.compact h3 {
  margin: 0;
  color: var(--muted);
  font-size: .78rem;
  line-height: 1.4;
}

.console-entry {
  padding: .9rem;
  border: 1px solid rgba(137,255,218,.18);
  background: rgba(0,0,0,.24);
}
.entry-header {
  display: flex;
  justify-content: space-between;
  gap: .8rem;
  align-items: start;
  margin-bottom: .65rem;
}
.entry-remove {
  border: 1px solid rgba(255,92,138,.42);
  background: rgba(0,0,0,.26);
  color: #ffd8e4;
  cursor: pointer;
  font: inherit;
  font-size: .66rem;
  padding: .45rem .55rem;
  text-transform: uppercase;
}

.entry-remove:disabled {
  border-color: rgba(137,255,218,.18);
  color: var(--muted);
  cursor: default;
}

.console-entry p {
  margin: .45rem 0 0;
  color: var(--muted);
  line-height: 1.4;
  white-space: pre-wrap;
}
.data-panel {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1rem;
  margin-top: 1rem;
  padding: 1rem;
}
.data-panel-groups {
  display: grid;
  gap: 1rem;
}
.data-transfer-group {
  display: grid;
  gap: .55rem;
  padding: .85rem;
  border: 1px solid rgba(137,255,218,.16);
  background: rgba(0,0,0,.18);
}
.data-transfer-group .local-note {
  margin: 0;
}
.data-actions {
  display: flex;
  flex-wrap: wrap;
  gap: .55rem;
  justify-content: end;
}
.data-actions .button {
  flex: 1 1 10.5rem;
}
.volunteer-row {
  display: flex;
  flex-wrap: wrap;
  gap: .55rem;
}
.volunteer-row .button {
  flex: 1 1 13rem;
}
.file-button {
  position: relative;
  overflow: hidden;
}
.file-button input {
  position: absolute;
  inset: 0;
  opacity: 0;
  cursor: pointer;
}
.is-error {
  color: var(--danger);
}
.surface-tabs {
  position: fixed;
  left: calc(50vw + (var(--surface-rail-width) / 2));
  right: auto;
  top: 50%;
  z-index: 70;
  display: grid;
  gap: var(--surface-tab-gap);
  padding: var(--surface-rack-padding-y) 0 var(--surface-rack-padding-y) .42rem;
  border: 1px solid rgba(137,255,218,.2);
  border-left: 0;
  border-radius: 0 .55rem .55rem 0;
  background:
    linear-gradient(90deg, rgba(5,7,9,.42), rgba(5,7,9,.86)),
    repeating-linear-gradient(0deg, rgba(137,255,218,.035) 0 1px, transparent 1px 7px);
  box-shadow: 14px 22px 44px rgba(0,0,0,.42), inset -.4rem 0 rgba(137,255,218,.035);
  transform: translateY(-50%);
  backdrop-filter: blur(12px);
}
.surface-tabs::before {
  content: "";
  position: absolute;
  inset: .25rem .28rem .25rem -.16rem;
  z-index: -1;
  border: 1px solid rgba(137,255,218,.12);
  border-left: 0;
  border-radius: 0 .42rem .42rem 0;
  background:
    linear-gradient(90deg, rgba(137,255,218,.1), rgba(137,255,218,.02)),
    rgba(0,0,0,.18);
  pointer-events: none;
}
.surface-tab {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  justify-content: center;
  gap: .45rem;
  width: 3.15rem;
  min-width: 0;
  min-height: var(--surface-tab-height);
  height: var(--surface-tab-height);
  border: 1px solid rgba(137,255,218,.32);
  border-left: 0;
  border-radius: 0 .34rem .34rem 0;
  padding: .72rem .42rem;
  background:
    linear-gradient(90deg, rgba(8,12,14,.94), rgba(3,5,7,.94)),
    repeating-linear-gradient(90deg, rgba(255,255,255,.025) 0 1px, transparent 1px 6px);
  color: var(--text);
  clip-path: polygon(0 0, 100% 0, 100% calc(100% - .7rem), calc(100% - .7rem) 100%, 0 100%);
  font-size: .66rem;
  font-weight: 800;
  letter-spacing: .12em;
  line-height: 1.1;
  text-align: center;
  text-decoration: none;
  text-transform: uppercase;
  writing-mode: vertical-rl;
  text-orientation: mixed;
  transition: transform .16s ease, border-color .16s ease, box-shadow .16s ease;
}
.surface-tab strong {
  display: block;
  color: var(--muted);
  font-size: .48rem;
  letter-spacing: .08em;
}
.surface-tab:hover,
.surface-tab:focus-visible {
  transform: translateX(.34rem);
  border-color: rgba(137,255,218,.42);
  outline: none;
  box-shadow: 12px 18px 34px rgba(0,0,0,.42), inset 0 1px rgba(255,255,255,.09);
}
body:has(#operator-preview:target) .surface-tabs {
  left: calc(50vw + (var(--surface-rail-width) / 2) + var(--surface-operator-drawer-width));
}
body.has-operator-preview-open .surface-tabs {
  left: calc(50vw + (var(--surface-rail-width) / 2) + var(--surface-operator-drawer-width));
}
body:has(#casefile-drawer:target) .surface-tabs {
  left: calc(50vw + (var(--surface-rail-width) / 2) + var(--surface-case-drawer-width));
}
body.has-casefile-drawer-open .surface-tabs {
  left: calc(50vw + (var(--surface-rail-width) / 2) + var(--surface-case-drawer-width));
}
body:has(#recovered-reports-drawer:target) .surface-tabs {
  left: calc(50vw + (var(--surface-rail-width) / 2) + var(--surface-reports-drawer-width));
}
body.has-reports-drawer-open .surface-tabs {
  left: calc(50vw + (var(--surface-rail-width) / 2) + var(--surface-reports-drawer-width));
}
@media (min-width: 761px) {
  body.has-surface-horizontal-scroll {
    overflow-x: auto;
  }
  body.has-surface-horizontal-scroll::after {
    content: "";
    display: block;
    width: max(100vw, calc(50vw + (var(--surface-rail-width) / 2) + var(--surface-active-drawer-width) + var(--surface-tab-width) + 1rem));
    height: 1px;
    pointer-events: none;
  }
  body.has-surface-horizontal-scroll .surface-tabs,
  body.has-surface-horizontal-scroll.has-casefile-drawer-open .surface-tabs,
  body.has-surface-horizontal-scroll.has-reports-drawer-open .surface-tabs,
  body.has-surface-horizontal-scroll.has-operator-preview-open .surface-tabs,
  body.has-surface-horizontal-scroll:has(#casefile-drawer:target) .surface-tabs,
  body.has-surface-horizontal-scroll:has(#recovered-reports-drawer:target) .surface-tabs,
  body.has-surface-horizontal-scroll:has(#operator-preview:target) .surface-tabs {
    left: calc(50vw + (var(--surface-rail-width) / 2) + var(--surface-active-drawer-width) - var(--surface-scroll-x));
  }
  body.has-surface-horizontal-scroll .casefile-drawer,
  body.has-surface-horizontal-scroll .recovered-reports-drawer,
  body.has-surface-horizontal-scroll .operator-preview-drawer {
    left: calc(50vw + (var(--surface-rail-width) / 2) - var(--surface-scroll-x));
  }
}
.operator-preview-drawer {
  position: fixed;
  left: calc(50vw + (var(--surface-rail-width) / 2));
  right: auto;
  top: 50%;
  z-index: 58;
  width: min(92vw, 500px);
  max-height: min(78vh, 680px);
  transform: translate(-100%, -50%);
  visibility: hidden;
  transition: transform .24s ease;
  pointer-events: none;
}
.operator-preview-drawer:target,
.operator-preview-drawer.is-open {
  transform: translate(0, -50%);
  visibility: visible;
  pointer-events: auto;
}
.casefile-drawer,
.recovered-reports-drawer {
  position: fixed;
  left: calc(50vw + (var(--surface-rail-width) / 2));
  right: auto;
  top: 50%;
  z-index: 56;
  max-height: min(78vh, 680px);
  transform: translate(-100%, -50%);
  visibility: hidden;
  transition: transform .24s ease;
  pointer-events: none;
}
.casefile-drawer {
  width: min(92vw, 430px);
}
.recovered-reports-drawer {
  width: min(92vw, 620px);
}
.casefile-drawer:target,
.casefile-drawer.is-open,
.recovered-reports-drawer:target,
.recovered-reports-drawer.is-open {
  transform: translate(0, -50%);
  visibility: visible;
  pointer-events: auto;
}
.casefile-panel,
.recovered-reports-panel {
  min-height: min(var(--surface-rack-height), 78vh);
  max-height: min(78vh, 680px);
  overflow: auto;
  padding: 1.05rem 1rem;
  border: 1px solid rgba(137,255,218,.28);
  border-right: 0;
  background:
    linear-gradient(180deg, rgba(8,12,14,.98), rgba(6,8,10,.98)),
    repeating-linear-gradient(90deg, rgba(255,255,255,.025) 0 1px, transparent 1px 7px);
  box-shadow: -22px 28px 70px rgba(0,0,0,.72), inset 0 0 0 1px rgba(0,0,0,.52), inset 0 1px rgba(255,255,255,.05);
}
.operator-preview-panel {
  min-height: min(var(--surface-rack-height), 78vh);
  max-height: min(78vh, 680px);
  overflow: auto;
  padding: 1.05rem 1rem;
  border: 1px solid rgba(185,84,255,.34);
  border-right: 0;
  background:
    linear-gradient(180deg, rgba(21,18,30,.98), rgba(8,9,13,.98)),
    repeating-linear-gradient(90deg, rgba(255,255,255,.025) 0 1px, transparent 1px 7px);
  box-shadow: -22px 28px 70px rgba(0,0,0,.72), inset 0 0 0 1px rgba(0,0,0,.52), inset 0 1px rgba(255,255,255,.05);
}
.operator-preview-panel .record-header {
  align-items: start;
  gap: .85rem;
}
.operator-preview-panel .record-header h3 {
  margin: .2rem 0 0;
  font-size: 1rem;
  letter-spacing: .06em;
}
.operator-preview-screen {
  display: grid;
  gap: .75rem;
  margin-top: 1rem;
  padding: .9rem;
  border: 1px solid rgba(137,255,218,.2);
  background:
    linear-gradient(180deg, rgba(0,0,0,.24), rgba(0,0,0,.36)),
    repeating-linear-gradient(0deg, rgba(102,255,220,.04) 0 1px, transparent 1px 7px);
}
.operator-preview-screen h2 {
  margin: 0;
  font-size: .95rem;
  letter-spacing: .06em;
}
.preview-entry {
  padding: .7rem;
  border: 1px solid rgba(137,255,218,.18);
  background: rgba(0,0,0,.24);
}
.preview-entry span {
  display: block;
  color: var(--cyan);
  font-size: .62rem;
  font-weight: 800;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.preview-entry strong {
  display: block;
  margin-top: .32rem;
}
@media (max-width: 900px) {
  .snapshot-grid,
  .tracker-summary {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .console-nav {
    grid-template-columns: repeat(5, minmax(8.4rem, 1fr));
    overflow-x: auto;
    scrollbar-color: rgba(102,255,220,.45) rgba(0,0,0,.2);
  }
  .console-form,
  .sheet-grid,
  .operator-live-grid,
  .live-lower-grid {
    grid-template-columns: 1fr;
    grid-template-areas:
      "attributes"
      "misfire"
      "skills"
      "notes";
  }
  .tracker-board,
  .line-tracker,
  .roll-row,
  .lotus-workspace,
  .frequency-dashboard,
  .archive-grid,
  .data-panel {
    grid-template-columns: 1fr;
  }
  .resonance-profile {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .identity-card {
    grid-template-columns: 1fr;
  }
  .skill-builder,
  .creation-row,
  .skill-summary-row.is-editable summary {
    grid-template-columns: auto minmax(0, 1fr) auto;
  }

  .skill-summary-row.is-editable .skill-inline-rank {
    grid-column: 1 / -1;
    justify-self: end;
  }

  .attribute-row {
    grid-template-columns: minmax(5.6rem, .34fr) minmax(0, 1fr);
  }
  fieldset.recovery-field {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  fieldset.recovery-field.compact {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .data-actions {
    justify-content: stretch;
  }
  .data-actions .button {
    flex: 1 1 13rem;
  }
}
@media (max-width: 560px) {
  .operator-shell {
    width: min(100vw - 1rem, 1180px);
    padding-top: .5rem;
  }
  .operator-header {
    align-items: start;
  }
  .seal-wrap {
    width: 3.2rem;
    height: 3.2rem;
  }
  .seal {
    width: 2.3rem;
    height: 2.3rem;
  }
  .snapshot-grid,
  .tracker-summary {
    grid-template-columns: 1fr;
  }
  .console-nav {
    top: .25rem;
    grid-template-columns: repeat(5, minmax(7.6rem, 1fr));
    margin-inline: -.25rem;
  }
  .module-heading {
    display: block;
  }
  fieldset.recovery-field {
    grid-template-columns: 1fr;
  }
  .segmented,
  .lotus-map {
    grid-template-columns: 1fr;
  }
  .segmented.attention,
  .segmented.misfire {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 760px) {
  body {
    padding-bottom: calc(4.2rem + env(safe-area-inset-bottom));
  }
  .surface-tabs {
    left: 0;
    right: 0;
    top: auto;
    bottom: 0;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0;
    transform: none;
    max-width: none;
    padding: 0 .35rem env(safe-area-inset-bottom);
    border-right: 0;
    border-bottom: 0;
    border-left: 0;
    border-radius: .55rem .55rem 0 0;
  }
  body:has(#operator-preview:target) .surface-tabs,
  body.has-operator-preview-open .surface-tabs,
  body:has(#casefile-drawer:target) .surface-tabs,
  body.has-casefile-drawer-open .surface-tabs,
  body:has(#recovered-reports-drawer:target) .surface-tabs,
  body.has-reports-drawer-open .surface-tabs {
    left: 0;
    right: 0;
    top: auto;
    bottom: 0;
    transform: none;
  }
  body.has-surface-horizontal-scroll {
    overflow-x: hidden;
  }
  body.has-surface-horizontal-scroll::after {
    content: none;
  }
  .surface-tabs::before {
    inset: -.24rem .35rem 0;
    border-radius: .4rem .4rem 0 0;
    background:
      linear-gradient(180deg, rgba(137,255,218,.07), rgba(137,255,218,.02)),
      rgba(0,0,0,.22);
  }
  .surface-tab {
    align-items: center;
    width: auto;
    height: auto;
    min-width: 0;
    min-height: 3.05rem;
    max-height: 3.35rem;
    border-bottom: 0;
    border-right: 1px solid rgba(137,255,218,.2);
    border-radius: .34rem .34rem 0 0;
    clip-path: none;
    padding: .42rem .24rem;
    flex-direction: column;
    justify-content: center;
    gap: .22rem;
    font-size: clamp(.48rem, 1.8vw, .55rem);
    letter-spacing: .04em;
    line-height: 1;
    text-align: center;
    writing-mode: horizontal-tb;
    text-orientation: mixed;
    overflow: hidden;
  }
  .surface-tab strong {
    font-size: clamp(.38rem, 1.5vw, .46rem);
    letter-spacing: .04em;
  }
  .surface-tab:hover,
  .surface-tab:focus-visible {
    transform: translateY(-.12rem);
  }
  .operator-preview-drawer {
    left: auto;
    top: auto;
    right: 0;
    bottom: calc(3.35rem + env(safe-area-inset-bottom));
    width: 100vw;
    max-height: min(88vh, calc(100vh - 3.35rem - env(safe-area-inset-bottom)));
    transform: translateY(calc(100% + 3.35rem + env(safe-area-inset-bottom)));
    visibility: hidden;
    pointer-events: none;
  }
  .operator-preview-drawer:target,
  .operator-preview-drawer.is-open {
    transform: translateY(0);
    visibility: visible;
    pointer-events: auto;
  }
  .casefile-drawer,
  .recovered-reports-drawer {
    left: auto;
    top: auto;
    right: 0;
    bottom: calc(3.35rem + env(safe-area-inset-bottom));
    width: 100vw;
    max-height: min(88vh, calc(100vh - 3.35rem - env(safe-area-inset-bottom)));
    transform: translateY(calc(100% + 3.35rem + env(safe-area-inset-bottom)));
    visibility: hidden;
    pointer-events: none;
  }
  .casefile-drawer:target,
  .casefile-drawer.is-open,
  .recovered-reports-drawer:target,
  .recovered-reports-drawer.is-open {
    transform: translateY(0);
    visibility: visible;
    pointer-events: auto;
  }
  .operator-preview-panel {
    min-height: auto;
    max-height: min(88vh, calc(100vh - 3.35rem - env(safe-area-inset-bottom)));
    padding: .85rem;
    border-right: 0;
    border-left: 0;
    overflow-y: auto;
  }
  .casefile-panel,
  .recovered-reports-panel {
    min-height: auto;
    max-height: min(88vh, calc(100vh - 3.35rem - env(safe-area-inset-bottom)));
    padding: .85rem;
    border-right: 0;
    border-left: 0;
    overflow-y: auto;
  }
  .operator-preview-drawer:not(.is-open):not(:target) .operator-preview-panel,
  .casefile-drawer:not(.is-open):not(:target) .casefile-panel,
  .recovered-reports-drawer:not(.is-open):not(:target) .recovered-reports-panel {
    visibility: hidden;
  }
}
@media (max-width: 760px) and (max-height: 740px) {
  .operator-preview-panel {
    padding: .68rem;
  }
  .operator-preview-panel .record-header {
    gap: .55rem;
  }
  .operator-preview-panel .record-header h3 {
    margin-top: .08rem;
    font-size: .86rem;
  }
  .operator-preview-drawer .drawer-route {
    min-height: 2.25rem;
    padding: .46rem .62rem;
  }
  .operator-preview-screen {
    gap: .44rem;
    margin-top: .58rem;
    padding: .62rem;
  }
  .operator-preview-screen h2 {
    font-size: .82rem;
  }
  .operator-preview-screen .kicker {
    margin-bottom: -.08rem;
  }
  .operator-preview-drawer .preview-entry {
    display: grid;
    grid-template-columns: minmax(5.4rem, .42fr) minmax(0, 1fr);
    gap: .55rem;
    align-items: center;
    padding: .46rem .52rem;
  }
  .operator-preview-drawer .preview-entry strong {
    margin-top: 0;
  }
  .operator-preview-drawer .local-note {
    margin-top: .2rem;
    font-size: .74rem;
    line-height: 1.32;
  }
  .operator-preview-drawer .drawer-actions {
    gap: .45rem;
    margin-top: .55rem;
  }
  .operator-preview-drawer .drawer-actions .button {
    min-height: 2.55rem;
    padding: .55rem .68rem;
  }
}
