:root {
  color-scheme: dark;
  --bg: #07110d;
  --panel: #102018;
  --panel-2: #172b21;
  --ink: #f4f7f5;
  --muted: #9fb4a9;
  --line: #294238;
  --accent: #6ee7a7;
  --accent-2: #ffd166;
  --danger: #ff6b6b;
  --radius: 18px;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

* { box-sizing: border-box; }
body { margin: 0; background: radial-gradient(circle at top, #153326 0, var(--bg) 42%); color: var(--ink); min-height: 100vh; }
button, input, textarea, select { font: inherit; }
button { cursor: pointer; }
.shell { width: min(760px, 100%); margin: 0 auto; padding: 18px 14px 72px; }
.admin-shell { width: min(1240px, 100%); }
.hero { padding: 18px 4px 10px; }
.eyebrow { color: var(--accent); font-size: 12px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; }
h1 { margin: 5px 0 4px; font-size: clamp(28px, 8vw, 46px); line-height: 1; }
h2 { margin: 0 0 12px; font-size: 18px; }
h3 { margin: 0; font-size: 15px; }
p { line-height: 1.45; }
.muted { color: var(--muted); }
.card { background: rgba(16, 32, 24, .94); border: 1px solid var(--line); border-radius: var(--radius); padding: 16px; margin: 12px 0; box-shadow: 0 12px 40px rgba(0,0,0,.22); }
.challenge { border-color: #517d69; background: linear-gradient(145deg, rgba(24,56,42,.98), rgba(11,25,19,.98)); }
.practice-card { border-color: #866e37; background: linear-gradient(150deg, rgba(47,39,19,.98), rgba(11,25,19,.98)); }
.competition-explainer { border: 1px solid #426d5a; border-radius: 12px; background: rgba(8,28,20,.7); padding: 11px 12px; margin: 13px 0; }
.competition-explainer p { margin: 5px 0; font-size: 13px; }
.competition-explainer small { color: var(--muted); }
.practice-controls { margin-top: 16px; padding-top: 14px; border-top: 1px solid var(--line); }
.spectator-refresh-status { min-height: 1.4em; margin: 0 0 10px; font-size: 13px; }
.practice-empty, .practice-finish { border: 1px dashed var(--line); border-radius: 14px; padding: 16px; margin: 12px 0; }
.practice-result { border: 1px solid var(--line); border-radius: 14px; padding: 14px; margin: 12px 0; background: rgba(7,17,13,.65); }
.practice-result.survived { border-color: #3a765b; }
.practice-result.eliminated { border-color: #713c3c; }
.practice-result h3 { font-size: 20px; margin: 5px 0 12px; }
.round-report { border: 1px solid var(--line); border-radius: 14px; padding: 14px; background: rgba(7,17,13,.65); }
.round-report.survived { border-color: #3a765b; }
.round-report.eliminated { border-color: #713c3c; }
.round-report > h2 { font-size: 23px; margin-top: 5px; }
.round-report > h3 { margin: 18px 0 9px; font-size: 16px; }
.round-verdict { border-radius: 10px; padding: 9px 11px; margin: 10px 0; font-weight: 800; }
.round-verdict.live { color: var(--accent); background: rgba(22,61,43,.72); }
.round-verdict.dead { color: #ffabab; background: rgba(67,32,32,.72); }
.score-breakdown { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 8px; }
.supply-meter { height: 18px; overflow: hidden; border: 1px solid #315647; border-radius: 999px; background: #09140f; margin: 12px 0; }
.supply-fill { height: 100%; border-radius: inherit; background: linear-gradient(90deg,#e6a23c,#f4d06f); transition: width .25s ease; }
.score-breakdown > div { border: 1px solid var(--line); border-radius: 10px; padding: 9px; min-width: 0; }
.score-breakdown span, .score-breakdown small { color: var(--muted); display: block; font-size: 11px; line-height: 1.3; }
.score-breakdown strong { display: block; font-size: 18px; margin: 4px 0; }
.action-distribution { display: grid; gap: 8px; }
.distribution-row { border: 1px solid var(--line); border-radius: 10px; padding: 8px 10px; font-size: 13px; }
.distribution-track { height: 5px; border-radius: 99px; overflow: hidden; background: #20372c; margin-top: 7px; }
.distribution-track span { display: block; height: 100%; border-radius: inherit; background: var(--accent); }
.nearby-table tr.you { background: rgba(110,231,167,.09); }
.nearby-table small { color: var(--muted); }
.report-rule { border-top: 1px solid var(--line); padding-top: 12px; margin-bottom: 0; color: var(--muted); }
.practice-kpis { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 8px; }
.practice-kpis > div { border: 1px solid var(--line); border-radius: 10px; padding: 9px; }
.practice-kpis strong { display: block; margin-top: 4px; font-size: 17px; }
.practice-challenge { margin: 14px 0; }
.practice-balance { border-block: 1px solid var(--line); padding: 12px 0; margin: 12px 0; }
.practice-stats { display: grid; grid-template-columns: 1fr 1fr; gap: 0 18px; }
.practice-actions { margin-top: 10px; }
.grid { display: grid; gap: 12px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.admin-grid { display: grid; gap: 12px; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.kpi { font-size: 25px; font-weight: 850; }
.label { color: var(--muted); font-size: 12px; text-transform: uppercase; letter-spacing: .08em; }
.row { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.wrap { flex-wrap: wrap; }
.pill { border: 1px solid var(--line); background: var(--panel-2); padding: 5px 9px; border-radius: 999px; font-size: 12px; }
.pill.live { color: var(--accent); border-color: #3a765b; }
.pill.dead { color: var(--danger); border-color: #713c3c; }
.stat { margin: 12px 0; }
.bar { font-size: clamp(14px, 4vw, 21px); letter-spacing: 1px; white-space: nowrap; margin-top: 5px; overflow: hidden; }
.stat-guide { margin: 18px 0 16px; padding: 15px; border: 1px solid var(--line); border-radius: 14px; background: rgba(7,17,13,.62); }
.stat-guide h3 { margin: 5px 0 7px; font-size: 18px; }
.stat-guide-intro { color: var(--muted); margin: 0 0 12px; font-size: 13px; }
.stat-guide-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; }
.stat-guide-item { min-width: 0; border: 1px solid var(--line); border-radius: 11px; padding: 10px; background: rgba(16,32,24,.72); }
.stat-guide-title { display: flex; align-items: center; gap: 7px; }
.stat-guide-item p { margin: 6px 0; font-size: 13px; }
.stat-guide-item small { color: var(--muted); line-height: 1.35; }
.actions { display: grid; gap: 10px; }
.action, .primary, .secondary, .danger, .tiny { border: 0; border-radius: 13px; padding: 12px 14px; color: #06120c; background: var(--accent); font-weight: 800; }
.action { background: var(--panel-2); color: var(--ink); border: 1px solid var(--line); text-align: left; display: flex; justify-content: space-between; align-items: center; }
.action:hover { border-color: var(--accent); transform: translateY(-1px); }
.action-copy { display: grid; gap: 4px; min-width: 0; }
.action-copy small { color: var(--muted); font-weight: 600; line-height: 1.3; }
.action-cost { white-space: nowrap; }
.secondary { background: transparent; color: var(--ink); border: 1px solid var(--line); }
.danger { background: var(--danger); color: #250404; }
.tiny { padding: 6px 9px; font-size: 12px; border-radius: 8px; }
button:disabled { opacity: .45; cursor: not-allowed; transform: none; }
input, textarea, select { width: 100%; border: 1px solid var(--line); background: #091611; color: var(--ink); padding: 11px 12px; border-radius: 10px; }
textarea { min-height: 88px; resize: vertical; }
label { display: block; color: var(--muted); font-size: 13px; margin: 9px 0 5px; }
.message { position: sticky; bottom: 12px; z-index: 9; padding: 12px; border-radius: 12px; background: #183b2c; border: 1px solid #4a8a6b; display: none; }
.message.error { display: block; background: #432020; border-color: #994b4b; }
.message.ok { display: block; }
table { width: 100%; border-collapse: collapse; font-size: 13px; }
th, td { padding: 9px 7px; border-bottom: 1px solid var(--line); text-align: left; vertical-align: top; }
th { color: var(--muted); font-size: 11px; text-transform: uppercase; letter-spacing: .06em; }
.table-wrap { overflow-x: auto; }
.section-tabs { display: flex; gap: 8px; overflow-x: auto; padding-bottom: 4px; }
.section-tabs a { color: var(--ink); text-decoration: none; border: 1px solid var(--line); border-radius: 999px; padding: 7px 10px; white-space: nowrap; }
.hidden { display: none !important; }
.sr-only { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0, 0, 0, 0) !important; white-space: nowrap !important; border: 0 !important; }
.code { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 12px; word-break: break-all; }

/* Player app — approved LAST1 light art direction. Admin pages keep the
   original dark dashboard theme above. */
body.player-app {
  color-scheme: light;
  --bg: #f7f3e8;
  --panel: #fffdf7;
  --panel-2: #f1ecdf;
  --ink: #17160f;
  --muted: #68645a;
  --line: #17160f;
  --accent: #d8f33c;
  --accent-2: #ff6b21;
  --danger: #8e2619;
  --radius: 16px;
  background: var(--bg);
  color: var(--ink);
  font-family: "Manrope", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.player-app button,
.player-app input,
.player-app textarea,
.player-app select { font: inherit; }

.player-shell {
  width: min(560px, 100%);
  padding: max(18px, env(safe-area-inset-top)) 16px calc(88px + env(safe-area-inset-bottom));
}

.player-app .hero {
  padding: 8px 2px 18px;
  border-bottom: 2px solid var(--ink);
}

.player-app .brand-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 22px;
}

.version-status { display: inline-flex; align-items: center; gap: 7px; }
.version-badge {
  border: 2px solid var(--ink);
  border-radius: 999px;
  background: var(--panel);
  padding: 7px 9px;
  box-shadow: 2px 2px 0 var(--ink);
  font-size: 11px;
  font-weight: 900;
  letter-spacing: .04em;
}

.player-app .brand-kicker,
.player-app .island-status {
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.player-app .island-status {
  border: 2px solid var(--ink);
  border-radius: 999px;
  background: var(--accent);
  padding: 7px 10px;
  box-shadow: 2px 2px 0 var(--ink);
  letter-spacing: .04em;
}

.player-app .island-status.alert { background: #f6c1b7; }

.player-app .hero h1 {
  display: grid;
  margin: 0;
  font-family: "Unbounded", "Arial Black", sans-serif;
  font-size: clamp(34px, 11vw, 54px);
  line-height: .94;
  letter-spacing: -.06em;
  text-transform: uppercase;
}

.player-app .hero h1 span:last-child { color: var(--ink); }
.player-app .hero-copy { max-width: 34rem; margin: 14px 0 0; color: var(--muted); font-size: 14px; line-height: 1.45; }

.avatar-required #game-content,
.profile-required #game-content,
.profile-required #avatar-onboarding { display: none; }

.avatar-onboarding,
.name-onboarding {
  padding: 10px 0 30px;
}

.avatar-onboarding-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding-bottom: 18px;
  border-bottom: 2px solid var(--ink);
}

.avatar-step {
  border: 2px solid var(--ink);
  border-radius: 999px;
  background: var(--accent);
  padding: 7px 10px;
  box-shadow: 2px 2px 0 var(--ink);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .08em;
}

.avatar-onboarding h1,
.name-onboarding h1 {
  margin: 28px 0 12px;
  font-family: "Unbounded", "Arial Black", sans-serif;
  font-size: clamp(36px, 10vw, 52px);
  line-height: .98;
  letter-spacing: -.055em;
}

.avatar-intro {
  margin: 0 0 16px;
  max-width: 34rem;
  font-size: 17px;
}

.name-form {
  margin-top: 22px;
  padding: 16px;
  border: 2px solid var(--ink);
  border-radius: 14px;
  background: var(--panel);
  box-shadow: 4px 4px 0 var(--ink);
}
.name-form label { margin-top: 0; color: var(--ink); font-weight: 900; }
.name-form input { min-height: 52px; background: var(--panel-2); font-size: 18px; font-weight: 800; }
.name-meta { margin-top: 7px; color: var(--muted); font-size: 11px; }
.name-rule {
  display: grid;
  gap: 4px;
  margin: 16px 0;
  padding: 12px;
  border: 2px dashed var(--ink);
  border-radius: 11px;
  background: #fff7df;
  font-size: 13px;
}

.avatar-rule {
  display: grid;
  gap: 4px;
  margin: 18px 0 22px;
  padding: 13px 14px;
  border: 2px solid var(--ink);
  border-radius: 12px;
  background: #f6c1b7;
  box-shadow: 3px 3px 0 var(--ink);
}

.avatar-rule strong { font-family: "Unbounded", "Arial Black", sans-serif; font-size: 13px; }
.avatar-rule span { font-size: 13px; }

.avatar-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.avatar-option {
  position: relative;
  display: grid;
  min-width: 0;
  overflow: hidden;
  padding: 0 10px 12px;
  border: 2px solid var(--ink);
  border-radius: 14px;
  background: var(--panel);
  color: var(--ink);
  box-shadow: 4px 4px 0 var(--ink);
  text-align: center;
  transition: transform .1s ease, box-shadow .1s ease, background .1s ease;
}

.avatar-option:hover { transform: translate(-1px, -1px); }
.avatar-option:active { transform: translate(2px, 2px); box-shadow: 1px 1px 0 var(--ink); }
.avatar-option.selected { background: var(--accent); box-shadow: 4px 4px 0 var(--ink); }

.avatar-art {
  display: flex;
  align-items: flex-start;
  justify-content: center;
  height: 180px;
  margin: 0 -10px 10px;
  overflow: hidden;
  border-bottom: 2px solid var(--ink);
  background: var(--panel-2);
}

.avatar-art img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center top;
}

.avatar-option > strong { font-family: "Unbounded", "Arial Black", sans-serif; font-size: 14px; }
.avatar-species { margin-top: 3px; color: var(--muted); font-size: 11px; }
.avatar-option.selected .avatar-species { color: var(--ink); }
.avatar-selected-badge {
  position: absolute;
  top: 8px;
  right: 8px;
  display: none;
  border: 2px solid var(--ink);
  border-radius: 999px;
  background: var(--accent);
  padding: 5px 7px;
  font-size: 8px;
  font-weight: 900;
  letter-spacing: .06em;
}
.avatar-option.selected .avatar-selected-badge { display: block; }

.avatar-confirm { scroll-margin-bottom: 20px; margin-top: 20px; }
.avatar-final-warning {
  display: grid;
  gap: 6px;
  margin-bottom: 12px;
  padding: 14px;
  border: 2px solid var(--ink);
  border-radius: 12px;
  background: var(--panel);
}
.avatar-final-warning strong { font-family: "Unbounded", "Arial Black", sans-serif; font-size: 14px; }
.avatar-final-warning p { margin: 0; color: var(--muted); font-size: 13px; }
.avatar-lock-note { margin: 0; padding: 14px; border: 2px dashed var(--ink); border-radius: 12px; color: var(--muted); text-align: center; }
.avatar-empty { grid-column: 1 / -1; padding: 24px; border: 2px dashed var(--ink); border-radius: 12px; text-align: center; }

.identity-profile { display: flex; align-items: center; gap: 14px; }
.identity-main { flex: 1 1 auto; min-width: 0; }
.profile-avatar-trigger {
  flex: 0 0 88px;
  width: 88px;
  height: 108px;
  overflow: hidden;
  padding: 0;
  border: 2px solid var(--ink);
  border-radius: 11px;
  background: var(--panel-2);
  box-shadow: 3px 3px 0 var(--ink);
  cursor: pointer;
}
.profile-avatar-trigger:hover { transform: translate(-1px, -1px); box-shadow: 4px 4px 0 var(--ink); }
.profile-avatar-trigger:active { transform: translate(2px, 2px); box-shadow: 1px 1px 0 var(--ink); }
.profile-avatar {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center top;
}
.avatar-profile-note { margin: 8px 0 0; color: var(--muted); font-size: 12px; }
.profile-name-tools { margin-top: 10px; }
.profile-name-note { margin: 9px 0 0; color: var(--muted); font-size: 12px; }
.profile-name-form {
  margin-top: 12px;
  padding-top: 12px;
  border-top: 2px solid var(--ink);
}
.profile-name-form input { margin-bottom: 0; background: var(--panel-2); }
.profile-name-form .primary { margin-top: 12px; }
.profile-settings-button { margin-top: 10px; }

body.settings-open { overflow: hidden; }
.settings-shell {
  position: fixed;
  inset: 0;
  z-index: 70;
  display: grid;
  place-items: center;
  padding: max(14px, env(safe-area-inset-top)) 14px max(14px, env(safe-area-inset-bottom));
}
.settings-scrim {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: rgba(23, 22, 15, .64);
  cursor: pointer;
}
.settings-panel {
  position: relative;
  display: grid;
  grid-template-rows: auto auto minmax(0, 1fr);
  width: min(780px, 100%);
  max-height: calc(100dvh - 28px);
  overflow: hidden;
  border: 3px solid var(--ink);
  border-radius: 24px;
  background: var(--bg);
  color: var(--ink);
  box-shadow: 8px 8px 0 var(--ink);
}
.settings-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 16px;
  padding: 18px 20px 14px;
  border-bottom: 2px solid var(--ink);
  background: var(--bg);
}
.settings-header h2 { margin: 4px 0 3px; font-family: "Unbounded", "Arial Black", sans-serif; font-size: 22px; }
.settings-header p { margin: 0; color: var(--muted); font-size: 13px; }
.settings-tabs { display: flex; gap: 7px; overflow-x: auto; padding: 10px 12px; border-bottom: 2px solid var(--ink); background: var(--panel-2); scrollbar-width: thin; }
.settings-tab { flex: 0 0 auto; padding: 8px 11px; border: 2px solid var(--ink); border-radius: 999px; background: var(--panel); color: var(--ink); font-weight: 800; white-space: nowrap; }
.settings-tab[aria-selected="true"] { background: var(--accent); box-shadow: 2px 2px 0 var(--ink); }
.settings-content { min-height: 280px; overflow: auto; overscroll-behavior: contain; padding: 18px; outline: none; }
.settings-section { display: grid; gap: 14px; }
.settings-section > h3 { margin: 0; font-family: "Unbounded", "Arial Black", sans-serif; font-size: clamp(21px, 4vw, 30px); line-height: 1.1; }
.settings-section > p { margin: 0; }
.settings-steps { display: grid; gap: 9px; margin: 0; padding: 0; list-style: none; counter-reset: settings-step; }
.settings-steps li { counter-increment: settings-step; display: grid; grid-template-columns: 34px 1fr; gap: 2px 10px; padding: 12px; border: 2px solid var(--ink); border-radius: 12px; background: var(--panel); }
.settings-steps li::before { content: counter(settings-step, decimal-leading-zero); grid-row: 1 / span 2; font-family: "Unbounded", "Arial Black", sans-serif; font-size: 12px; }
.settings-steps span { color: var(--muted); font-size: 13px; }
.settings-choice,
.settings-permission,
.settings-data-actions,
.settings-delete-confirm { display: grid; gap: 10px; padding: 14px; border: 2px solid var(--ink); border-radius: 13px; background: var(--panel-2); }
.settings-choice h4,
.settings-permission h4,
.settings-data-actions h4,
.settings-delete-confirm h4 { margin: 0; font-family: "Unbounded", "Arial Black", sans-serif; font-size: 14px; }
.settings-choice p,
.settings-permission p,
.settings-data-actions p,
.settings-delete-confirm p { margin: 0; color: var(--muted); font-size: 13px; }
.settings-choice label,
.settings-delete-confirm label { margin: 0; color: var(--ink); font-size: 14px; }
.settings-choice input,
.settings-delete-confirm input { width: auto; margin-right: 7px; }
.tutorial-progress { height: 12px; overflow: hidden; border: 2px solid var(--ink); border-radius: 999px; background: var(--panel); }
.tutorial-progress span { display: block; height: 100%; background: var(--accent); transition: width .2s ease; }
.tutorial-panel > p { min-height: 54px; color: var(--muted); font-size: 16px; }
.tutorial-controls { margin-top: 6px; }
.settings-rule-grid,
.settings-account-card { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); overflow: hidden; border: 2px solid var(--ink); border-radius: 12px; }
.settings-rule-grid > div,
.settings-account-card > div { display: grid; gap: 4px; min-width: 0; padding: 12px; border-right: 2px solid var(--ink); background: var(--panel-2); }
.settings-rule-grid > div:last-child,
.settings-account-card > div:last-child { border-right: 0; }
.settings-rule-grid span,
.settings-account-card span { color: var(--muted); font-size: 11px; }
.settings-rule-grid strong,
.settings-account-card strong { overflow-wrap: anywhere; font-family: "Unbounded", "Arial Black", sans-serif; font-size: 15px; }
.settings-action-rules { display: grid; gap: 8px; }
.settings-action-rules > div { display: grid; gap: 3px; padding: 11px 12px; border: 2px solid var(--ink); border-radius: 11px; background: var(--panel); }
.settings-action-rules span { color: var(--muted); font-size: 13px; }
.settings-safe-note,
.settings-empty-note { padding: 11px 12px; border-left: 4px solid var(--accent-2); background: var(--panel-2); color: var(--muted); font-size: 13px; }
.settings-section details { border: 2px solid var(--ink); border-radius: 11px; background: var(--panel); }
.settings-section summary { padding: 12px; cursor: pointer; font-weight: 800; }
.settings-section details p { margin: 0; padding: 0 12px 12px; color: var(--muted); }
.settings-privacy-list { display: grid; gap: 8px; margin: 0; padding-left: 20px; }
.settings-privacy-list li { padding-left: 3px; }
.settings-loading,
.settings-error,
.settings-empty { min-height: 300px; place-content: center; justify-items: center; text-align: center; }
.settings-loading p,
.settings-error p,
.settings-empty p { color: var(--muted); }
.settings-data-actions > button { justify-self: start; }
.settings-request-status { padding: 12px; border: 2px solid var(--ink); border-radius: 11px; background: var(--accent); }
.settings-inline-ok,
.settings-inline-error { margin: 0; padding: 10px 12px; border: 2px solid var(--ink); border-radius: 10px; }
.settings-inline-ok { background: var(--accent); }
.settings-inline-error { background: #f6c1b7; }
.settings-permission button { justify-self: start; }
.settings-permission #settings-permission-status { color: var(--ink); }

body.room-open { overflow: hidden; }
.player-room {
  position: fixed;
  inset: 0;
  z-index: 60;
  display: grid;
  place-items: center;
  padding: max(14px, env(safe-area-inset-top)) 14px max(14px, env(safe-area-inset-bottom));
}
.player-room-scrim {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: rgba(23, 22, 15, .64);
  cursor: pointer;
}
.player-room-panel {
  position: relative;
  width: min(720px, 100%);
  max-height: calc(100dvh - 28px);
  overflow: auto;
  overscroll-behavior: contain;
  border: 3px solid var(--ink);
  border-radius: 24px;
  background: var(--bg);
  color: var(--ink);
  box-shadow: 8px 8px 0 var(--ink);
}
.player-room-header {
  position: sticky;
  top: 0;
  z-index: 2;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 16px;
  padding: 18px 20px 14px;
  border-bottom: 2px solid var(--ink);
  background: rgba(247, 243, 232, .96);
}
.player-room-header h2 { margin: 4px 0 3px; font-family: "Unbounded", "Arial Black", sans-serif; font-size: 22px; }
.player-room-header p { margin: 0; color: var(--muted); font-size: 13px; }
.player-room-content { padding: 18px; }
.player-room-stage {
  position: relative;
  display: grid;
  grid-template-columns: minmax(220px, .9fr) minmax(240px, 1.1fr);
  min-height: 390px;
  overflow: hidden;
  border: 2px solid var(--ink);
  border-radius: 18px;
  background: linear-gradient(145deg, var(--accent) 0 52%, var(--panel) 52% 100%);
}
.player-room-stage::before {
  content: '';
  position: absolute;
  top: 28px;
  right: 38px;
  width: 74px;
  height: 74px;
  border: 2px solid var(--ink);
  border-radius: 50%;
  background: var(--panel);
  box-shadow: 7px 7px 0 rgba(23, 22, 15, .2);
}
.player-room-art { position: relative; z-index: 1; display: grid; place-items: end center; min-height: 390px; padding: 18px 12px 0; }
.player-room-avatar { position: relative; z-index: 1; display: block; width: 100%; height: 360px; object-fit: contain; object-position: center bottom; }
.room-floor { position: absolute; right: 10%; bottom: 12px; left: 10%; height: 22px; border: 2px solid var(--ink); border-radius: 50%; background: rgba(255, 253, 247, .65); }
.player-room-copy { position: relative; z-index: 1; align-self: end; margin: 22px; padding: 18px; border: 2px solid var(--ink); border-radius: 14px; background: var(--panel); box-shadow: 4px 4px 0 var(--ink); }
.player-room-copy h3 { margin: 4px 0 7px; font-family: "Unbounded", "Arial Black", sans-serif; font-size: clamp(22px, 4vw, 34px); line-height: 1.05; overflow-wrap: anywhere; }
.player-room-copy p { margin: 0; color: var(--muted); }
.player-room-summary { margin-top: 14px; border: 2px solid var(--ink); border-radius: 16px; background: var(--panel); }
.player-room-loading,
.player-room-error { display: grid; gap: 8px; min-height: 150px; place-content: center; justify-items: center; padding: 24px; text-align: center; }
.player-room-loading span:last-child,
.player-room-error p { margin: 0; color: var(--muted); }
.room-loading-mark { width: 34px; height: 34px; border: 3px solid var(--ink); border-top-color: var(--accent-2); border-radius: 50%; }
.player-room-profile { padding: 16px; }
.player-room-title { display: grid; gap: 3px; margin-bottom: 14px; }
.player-room-title strong { font-family: "Unbounded", "Arial Black", sans-serif; font-size: 18px; }
.player-room-stats { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border: 2px solid var(--ink); border-radius: 12px; overflow: hidden; }
.player-room-stats > div { display: grid; gap: 3px; padding: 12px; border-right: 2px solid var(--ink); background: var(--panel-2); }
.player-room-stats > div:last-child { border-right: 0; }
.player-room-stats span { color: var(--muted); font-size: 11px; }
.player-room-stats strong { font-family: "Unbounded", "Arial Black", sans-serif; font-size: 18px; }
.player-room-empty,
.player-room-safe-note { margin: 13px 0 0; color: var(--muted); font-size: 12px; }
.player-room-avatar-fallback { position: relative; z-index: 1; display: grid; place-content: center; gap: 5px; align-self: stretch; width: 100%; min-height: 310px; padding: 20px; border: 2px dashed var(--ink); border-radius: 16px 16px 0 0; background: var(--panel-2); text-align: center; }
.player-room-avatar-fallback strong { font-family: "Unbounded", "Arial Black", sans-serif; }
.player-room-avatar-fallback span { color: var(--muted); font-size: 12px; }

@media (prefers-reduced-motion: no-preference) {
  .room-loading-mark { animation: room-loading 1s linear infinite; }
}
@keyframes room-loading { to { transform: rotate(360deg); } }

.player-app .card {
  margin: 14px 0;
  padding: 17px;
  border: 2px solid var(--ink);
  border-radius: var(--radius);
  background: var(--panel);
  box-shadow: 4px 4px 0 var(--ink);
}

.player-app .challenge,
.player-app .practice-card {
  border-color: var(--ink);
  background: var(--panel);
}

.player-app .challenge {
  position: relative;
  overflow: hidden;
}

.player-app .challenge::before {
  content: "СВОДКА МАЯКА";
  display: inline-block;
  margin: -17px -17px 16px;
  padding: 9px 17px 8px;
  border-right: 2px solid var(--ink);
  border-bottom: 2px solid var(--ink);
  background: var(--panel-2);
  color: var(--ink);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .12em;
}

.player-app h2 {
  margin: 0 0 10px;
  font-family: "Unbounded", "Arial Black", sans-serif;
  font-size: 18px;
  line-height: 1.16;
  letter-spacing: -.035em;
}

.player-app h3 { font-size: 15px; }
.player-app p { line-height: 1.5; }
.player-app .muted { color: var(--muted); }
.player-app .eyebrow { color: var(--ink); font-size: 10px; letter-spacing: .12em; }
.player-app .label { color: var(--muted); font-size: 10px; font-weight: 800; letter-spacing: .09em; }

.player-app .grid { gap: 8px; margin-top: 14px; }
.player-app .grid > div,
.player-app .practice-kpis > div,
.player-app .score-breakdown > div {
  min-width: 0;
  border: 2px solid var(--ink);
  border-radius: 11px;
  background: var(--panel-2);
  padding: 11px;
}

.player-app .kpi { margin-top: 4px; font-family: "Unbounded", "Arial Black", sans-serif; font-size: 26px; line-height: 1; }

.player-app .pill {
  border: 2px solid var(--ink);
  border-radius: 999px;
  background: var(--panel-2);
  color: var(--ink);
  padding: 6px 10px;
  font-weight: 800;
}

.player-app .pill.live { border-color: var(--ink); background: var(--accent); color: var(--ink); }
.player-app .pill.dead { border-color: var(--ink); background: #f6c1b7; color: var(--ink); }

.player-app #countdown {
  display: inline-block;
  margin-top: 10px;
  border: 2px solid var(--ink);
  border-radius: 10px;
  background: var(--accent);
  padding: 8px 10px;
  font-family: "Unbounded", "Arial Black", sans-serif;
  font-size: 14px;
  font-variant-numeric: tabular-nums;
  box-shadow: 2px 2px 0 var(--ink);
}
.player-app #countdown.urgent { background: var(--accent-2); }
.player-app #countdown.closed { background: #f6c1b7; }
.player-app .round-clock { align-items: center; margin-top: 12px; }
.player-app .waiting-calculation {
  display: flex;
  align-items: center;
  gap: 11px;
  margin-top: 12px;
  padding: 11px 12px;
  border: 2px solid var(--ink);
  border-radius: 11px;
  background: var(--accent);
}
.player-app .waiting-calculation > span:last-child { display: grid; gap: 2px; }
.player-app .waiting-calculation small { color: var(--ink); }
.player-app .waiting-signal,
.player-app .button-activity { display: inline-flex; align-items: center; gap: 3px; }
.player-app .waiting-signal i,
.player-app .button-activity i { width: 6px; height: 6px; border: 1px solid var(--ink); border-radius: 50%; background: var(--ink); }
.player-app .supply-changed { display: inline-block; }
.player-app .supply-gained { color: #356500; }
.player-app .supply-spent { color: var(--danger); }

.player-app .competition-explainer,
.player-app .practice-empty,
.player-app .practice-finish,
.player-app .practice-result,
.player-app .round-report {
  border: 2px solid var(--ink);
  border-radius: 12px;
  background: var(--panel-2);
}

.player-app .competition-explainer { padding: 12px; }
.player-app .competition-explainer small { color: var(--muted); }

.player-app #stats:not(:empty) { margin-top: 12px; }
.player-app .supply-meter {
  height: 10px;
  overflow: hidden;
  margin: 9px 0 0;
  border: 2px solid var(--ink);
  border-radius: 3px;
  background: var(--panel);
}

.player-app .supply-fill {
  display: block;
  height: 100%;
  border-radius: 0;
  background: var(--ink);
  transition: width .2s ease;
}

@media (prefers-reduced-motion: no-preference) {
  .player-app .waiting-signal i,
  .player-app .button-activity i { animation: activity-step 1s ease-in-out infinite; }
  .player-app .waiting-signal i:nth-child(2),
  .player-app .button-activity i:nth-child(2) { animation-delay: .14s; }
  .player-app .waiting-signal i:nth-child(3),
  .player-app .button-activity i:nth-child(3) { animation-delay: .28s; }
  .player-app .supply-changed { animation: supply-pop .5s ease-out; }
  .player-app .supply-fill-changed { animation: supply-track .55s ease-out; }
  .player-app #countdown.urgent { animation: deadline-pulse 1.8s ease-in-out infinite; }
}

@keyframes activity-step { 0%, 70%, 100% { transform: translateY(0); opacity: .45; } 35% { transform: translateY(-3px); opacity: 1; } }
@keyframes supply-pop { 0% { transform: scale(.92); } 55% { transform: scale(1.12); } 100% { transform: scale(1); } }
@keyframes supply-track { 0% { filter: brightness(1.8); } 100% { filter: brightness(1); } }
@keyframes deadline-pulse { 50% { box-shadow: 4px 4px 0 var(--ink); } }

.player-app .actions { gap: 10px; }
.player-app .action {
  min-height: 74px;
  gap: 12px;
  border: 2px solid var(--ink);
  border-radius: 12px;
  background: var(--panel);
  color: var(--ink);
  box-shadow: 3px 3px 0 var(--ink);
  transition: transform .1s ease, box-shadow .1s ease, background .1s ease;
}

.player-app .action:hover { border-color: var(--ink); transform: translate(-1px, -1px); }
.player-app .action:active { transform: translate(2px, 2px); box-shadow: 1px 1px 0 var(--ink); }
.player-app .action.selected { background: var(--accent); box-shadow: 3px 3px 0 var(--ink); }
.player-app .action-index { flex: 0 0 auto; font-family: "Unbounded", "Arial Black", sans-serif; font-size: 13px; }
.player-app .action-copy { flex: 1 1 auto; }
.player-app .action-copy strong { font-family: "Unbounded", "Arial Black", sans-serif; font-size: 13px; line-height: 1.2; }
.player-app .action-copy small { color: var(--muted); font-size: 12px; }
.player-app .action.selected .action-copy small { color: var(--ink); }
.player-app .action-cost { flex: 0 0 auto; border-left: 2px solid var(--ink); padding-left: 10px; font-size: 12px; }

.player-app .action-confirm {
  margin-top: 14px;
  padding-top: 14px;
  border-top: 2px solid var(--ink);
}

.player-app .action-receipt {
  display: grid;
  gap: 6px;
  margin-bottom: 12px;
}

.player-app .action-receipt strong { font-family: "Unbounded", "Arial Black", sans-serif; font-size: 14px; }

.player-app .primary,
.player-app .secondary,
.player-app .danger,
.player-app .tiny {
  min-height: 48px;
  border: 2px solid var(--ink);
  border-radius: 12px;
  background: var(--accent-2);
  color: var(--ink);
  box-shadow: 3px 3px 0 var(--ink);
  font-weight: 900;
  transition: transform .1s ease, box-shadow .1s ease;
}

.player-app .primary { width: 100%; min-height: 54px; text-transform: uppercase; letter-spacing: .03em; }
.player-app .secondary { background: var(--panel); }
.player-app .danger { background: #f6c1b7; }
.player-app .tiny { min-height: 38px; padding: 7px 10px; }
.player-app button:active:not(:disabled) { transform: translate(2px, 2px); box-shadow: 1px 1px 0 var(--ink); }
.player-app button:focus-visible,
.player-app input:focus-visible,
.player-app textarea:focus-visible,
.player-app select:focus-visible {
  outline: 3px solid var(--accent-2);
  outline-offset: 3px;
}

.player-app button:disabled { opacity: .42; filter: grayscale(1); }

.player-app input,
.player-app textarea,
.player-app select {
  border: 2px solid var(--ink);
  border-radius: 10px;
  background: var(--panel);
  color: var(--ink);
}

.player-app .round-verdict { border: 2px solid var(--ink); color: var(--ink); }
.player-app .round-verdict.live { background: var(--accent); color: var(--ink); }
.player-app .round-verdict.dead { background: #f6c1b7; color: var(--ink); }
.player-app .round-report.survived,
.player-app .practice-result.survived { border-color: var(--ink); }
.player-app .round-report.eliminated,
.player-app .practice-result.eliminated { border-color: var(--ink); }

.player-app .distribution-row { border: 2px solid var(--ink); background: var(--panel); }
.player-app .distribution-track { height: 7px; border: 1px solid var(--ink); background: var(--panel-2); }
.player-app .distribution-track span { background: var(--accent); }

.player-app .nearby-table tr.you { background: var(--accent); }
.player-app th,
.player-app td { border-bottom: 1px solid #d7d1c3; }
.player-app th { color: var(--muted); }

.player-app .message {
  bottom: calc(12px + env(safe-area-inset-bottom));
  border: 2px solid var(--ink);
  border-radius: 12px;
  background: var(--accent);
  color: var(--ink);
  box-shadow: 3px 3px 0 var(--ink);
}

.player-app .message.error { background: #f6c1b7; border-color: var(--ink); }

.player-app .spectator-card { border-color: var(--ink); background: #fff7df; }
.player-app .spectator-season-head { padding: 18px 0 8px; }
.player-app .spectator-season-head h2 { margin: 10px 0 4px; font-size: 24px; }
.player-app .spectator-live,
.player-app .spectator-history,
.player-app .spectator-final {
  margin: 14px 0;
  padding: 16px;
  border: 2px solid var(--ink);
  border-radius: 13px;
  background: var(--panel);
  box-shadow: 3px 3px 0 var(--ink);
}
.player-app .spectator-live { background: #f1ffe7; }
.player-app .spectator-final { text-align: center; background: var(--accent); }
.player-app .spectator-final > h2 { margin: 10px 0 2px; font-size: 26px; }
.player-app .spectator-progress {
  height: 15px;
  overflow: hidden;
  margin: 13px 0;
  border: 2px solid var(--ink);
  border-radius: 4px;
  background: var(--panel-2);
}
.player-app .spectator-progress span { display: block; height: 100%; background: var(--accent); transition: width .25s ease; }
.player-app .spectator-secrecy { margin: 14px 0; padding: 12px; border: 2px dashed var(--ink); border-radius: 11px; background: #fff7df; }
.player-app .spectator-secrecy p { margin: 5px 0 0; color: var(--muted); font-size: 13px; }
.player-app .activity-feed { display: grid; gap: 7px; }
.player-app .activity-feed > div { display: grid; grid-template-columns: 12px 1fr auto; align-items: center; gap: 8px; padding: 9px 10px; border: 1px solid #d7d1c3; border-radius: 9px; background: var(--panel); }
.player-app .activity-feed small { color: var(--muted); }
.player-app .activity-dot { width: 9px; height: 9px; border: 2px solid var(--ink); border-radius: 50%; background: var(--accent); }
.player-app .activity-feed > div:first-child .activity-dot { animation: spectator-pulse 1.7s infinite; }
@keyframes spectator-pulse { 50% { box-shadow: 0 0 0 7px rgba(216,243,60,0); } 0%,100% { box-shadow: 0 0 0 2px rgba(216,243,60,.35); } }
.player-app .spectator-round { margin: 10px 0; border: 2px solid var(--ink); border-radius: 11px; background: var(--panel-2); }
.player-app .spectator-round summary { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 13px; cursor: pointer; list-style: none; }
.player-app .spectator-round summary::-webkit-details-marker { display: none; }
.player-app .spectator-round summary > span:first-child { display: grid; gap: 4px; }
.player-app .spectator-round summary > span:last-child { white-space: nowrap; font-family: "Unbounded", "Arial Black", sans-serif; font-size: 12px; }
.player-app .spectator-round-body { padding: 0 13px 14px; border-top: 2px solid var(--ink); }
.player-app .spectator-round-body > h3 { margin: 16px 0 8px; }
.player-app .spectator-economy { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 7px; margin-top: 10px; }
.player-app .spectator-economy span { padding: 8px; border: 1px solid #d7d1c3; border-radius: 8px; font-size: 11px; color: var(--muted); }
.player-app .spectator-economy strong { display: block; margin-top: 3px; color: var(--ink); font-size: 16px; }
.player-app .spectator-top { display: grid; gap: 8px; }
.player-app .spectator-player { display: grid; grid-template-columns: 46px 1fr; align-items: center; gap: 10px; padding: 8px; border: 1px solid #d7d1c3; border-radius: 9px; background: var(--panel); text-align: left; }
.player-app .spectator-player div { display: grid; gap: 2px; }
.player-app .spectator-player small { color: var(--muted); }
.player-app .spectator-avatar { width: 46px; height: 54px; object-fit: cover; object-position: top; border: 2px solid var(--ink); border-radius: 9px; background: var(--panel-2); }
.player-app .spectator-avatar.large { width: 92px; height: 110px; margin: 14px auto 4px; }
.player-app .spectator-avatar.placeholder { display: grid; place-items: center; color: var(--ink); }

@media (max-width: 600px) {
  .settings-shell { place-items: end center; padding: max(8px, env(safe-area-inset-top)) 0 0; }
  .settings-panel { width: 100%; max-height: calc(100dvh - max(8px, env(safe-area-inset-top))); border-width: 3px 0 0; border-radius: 22px 22px 0 0; box-shadow: none; }
  .settings-header { padding: 15px 14px 12px; }
  .settings-header h2 { font-size: 19px; }
  .settings-header p { max-width: 230px; }
  .settings-tabs { padding-inline: 10px; }
  .settings-content { padding: 14px 12px max(18px, env(safe-area-inset-bottom)); }
  .settings-rule-grid,
  .settings-account-card { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .settings-rule-grid > div,
  .settings-account-card > div { border-bottom: 2px solid var(--ink); }
  .settings-rule-grid > div:nth-child(2),
  .settings-account-card > div:nth-child(2) { border-right: 0; }
  .settings-rule-grid > div:nth-last-child(-n+2),
  .settings-account-card > div:nth-last-child(-n+2) { border-bottom: 0; }
  .player-room { place-items: end center; padding: max(8px, env(safe-area-inset-top)) 0 0; }
  .player-room-panel { width: 100%; max-height: calc(100dvh - max(8px, env(safe-area-inset-top))); border-width: 3px 0 0; border-radius: 22px 22px 0 0; box-shadow: none; }
  .player-room-header { padding: 15px 14px 12px; }
  .player-room-header h2 { font-size: 19px; }
  .player-room-header p { max-width: 230px; }
  .player-room-content { padding: 12px 12px max(16px, env(safe-area-inset-bottom)); }
  .player-room-stage { grid-template-columns: 1fr; min-height: 0; background: linear-gradient(165deg, var(--accent) 0 63%, var(--panel) 63% 100%); }
  .player-room-stage::before { top: 20px; right: 24px; width: 58px; height: 58px; }
  .player-room-art { min-height: 46dvh; max-height: 430px; padding-top: 12px; }
  .player-room-avatar { height: min(44dvh, 410px); }
  .player-room-copy { margin: -10px 12px 14px; }
  .player-room-copy h3 { font-size: 23px; }
  .player-room-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .player-room-stats > div { border-bottom: 2px solid var(--ink); }
  .player-room-stats > div:nth-child(2) { border-right: 0; }
  .player-room-stats > div:nth-last-child(-n+2) { border-bottom: 0; }
}

@media (max-width: 420px) {
  .player-shell { padding-inline: 12px; }
  .player-app .card { padding: 15px; }
  .player-app .challenge::before { margin: -15px -15px 15px; }
  .player-app .brand-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 10px; margin-bottom: 16px; }
  .version-status { align-items: center; flex-direction: row; justify-self: end; }
  .player-app .island-status { max-width: 130px; text-align: center; }
  .player-app .grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .player-app .action { align-items: center; }
  .avatar-art { height: 158px; }
  .profile-avatar-trigger { flex-basis: 76px; width: 76px; height: 96px; }
  .player-app .activity-feed > div { grid-template-columns: 12px 1fr; }
  .player-app .activity-feed small { grid-column: 2; }
  .player-app .spectator-economy { grid-template-columns: 1fr 1fr 1fr; }
}

@media (prefers-reduced-motion: reduce) {
  .player-app *,
  .player-app *::before,
  .player-app *::after {
    scroll-behavior: auto !important;
    transition-duration: 0.01ms !important;
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
  }
  .player-app .waiting-signal i,
  .player-app .button-activity i,
  .player-app .supply-changed,
  .player-app .supply-fill-changed,
  .player-app #countdown.urgent { animation: none !important; }
  .room-loading-mark { animation: none !important; }
}
.player-app.user-reduced-motion *,
.player-app.user-reduced-motion *::before,
.player-app.user-reduced-motion *::after {
  scroll-behavior: auto !important;
  transition-duration: 0.01ms !important;
  animation: none !important;
}
.audit-dashboard { padding: 20px; overflow: hidden; }
.audit-heading { align-items: flex-start; border-bottom: 1px solid var(--line); padding-bottom: 16px; }
.audit-heading h2 { font-size: 24px; margin: 4px 0 2px; }
.audit-heading p { margin: 0; }
.audit-status, .connection-pill { display: inline-flex; align-items: center; gap: 7px; border: 1px solid var(--line); border-radius: 999px; padding: 7px 10px; font-size: 11px; font-weight: 850; letter-spacing: .08em; }
.audit-status.idle { color: var(--muted); }
.audit-status.running { color: #a7d7ff; border-color: #315b78; background: #102b3d; }
.audit-status.pass { color: var(--accent); border-color: #3a765b; background: #163d2b; }
.audit-status.warning { color: var(--accent-2); border-color: #826c34; background: #43371b; }
.audit-status.fail, .audit-status.error { color: #ff9b9b; border-color: #8a4444; background: #432020; }
.connection-pill { color: var(--muted); letter-spacing: 0; font-weight: 700; }
.connection-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--muted); }
.connection-pill.online .connection-dot { background: var(--accent); box-shadow: 0 0 0 4px rgba(110,231,167,.12); }
.connection-pill.live-stream .connection-dot { animation: live-pulse 1.7s infinite; }
@keyframes live-pulse { 50% { box-shadow: 0 0 0 7px rgba(110,231,167,0); } }
.audit-controls { display: grid; grid-template-columns: minmax(120px,180px) minmax(160px,220px) auto; gap: 12px; align-items: end; padding: 16px 0; }
.audit-controls label { margin-top: 0; }
.audit-controls button { min-height: 42px; }
.audit-empty { border: 1px dashed var(--line); border-radius: 14px; padding: 28px; text-align: center; color: var(--muted); }
.audit-stage { margin-top: 5px; }
.stage-title { font-size: 21px; font-weight: 850; margin-top: 3px; }
.progress-value { font-size: 34px; font-weight: 900; font-variant-numeric: tabular-nums; }
.progress-track { height: 10px; background: #091611; border: 1px solid var(--line); border-radius: 99px; overflow: hidden; margin-top: 12px; }
.progress-fill { height: 100%; width: 0; background: linear-gradient(90deg, #3aa876, var(--accent)); border-radius: inherit; transition: width .28s ease; }
.progress-note { margin-top: 7px; font-size: 12px; }
.audit-kpis { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 10px; margin: 16px 0; }
.audit-kpi { border: 1px solid var(--line); background: #0b1913; border-radius: 13px; padding: 12px; }
.audit-kpi strong { display: block; margin-top: 5px; font-size: 20px; }
.audit-layout { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; }
.audit-panel { min-width: 0; border: 1px solid var(--line); background: rgba(9,22,17,.72); border-radius: 14px; padding: 14px; }
.audit-panel-wide { grid-column: 1 / -1; }
.panel-heading { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; margin-bottom: 10px; }
.panel-heading .muted { font-size: 11px; }
.strategy-table td { vertical-align: middle; }
.metric-cell { min-width: 120px; }
.metric-line { display: flex; align-items: center; gap: 8px; }
.mini-track { width: 72px; height: 5px; border-radius: 9px; background: #20372c; overflow: hidden; }
.mini-fill { height: 100%; max-width: 100%; background: var(--accent); }
.pipeline-list { list-style: none; padding: 0; margin: 0; display: grid; gap: 9px; }
.pipeline-item { display: grid; grid-template-columns: 22px 1fr; gap: 8px; align-items: start; color: var(--muted); }
.pipeline-marker { width: 18px; height: 18px; border: 1px solid var(--line); border-radius: 50%; text-align: center; font-size: 11px; line-height: 16px; }
.pipeline-item.active { color: var(--ink); }
.pipeline-item.active .pipeline-marker { border-color: #6aa6cf; background: #173044; }
.pipeline-item.done { color: var(--ink); }
.pipeline-item.done .pipeline-marker { border-color: #3a765b; background: #163d2b; color: var(--accent); }
.finding-list, .change-list { display: grid; gap: 7px; max-height: 210px; overflow: auto; }
.finding, .change-row { border: 1px solid var(--line); border-radius: 10px; padding: 9px; font-size: 12px; }
.finding.p1 { border-color: #713c3c; background: #2b1717; }
.finding.p2 { border-color: #6a5930; background: #292315; }
.change-row { display: grid; gap: 3px; }
.diff-values { display: grid; grid-template-columns: 1fr 1fr; gap: 7px; color: var(--muted); }
.diff-before { color: #ff9b9b; }
.diff-after { color: var(--accent); }
.empty-state { color: var(--muted); font-size: 12px; padding: 8px 0; }
.report-actions { margin-top: 14px; border: 1px solid #3a765b; background: #113324; border-radius: 14px; padding: 14px; display: flex; justify-content: space-between; align-items: center; gap: 12px; }
@media (max-width: 720px) { .admin-grid { grid-template-columns: repeat(2, minmax(0,1fr)); } }
@media (max-width: 760px) { .audit-layout { grid-template-columns: 1fr; } .audit-panel-wide { grid-column: auto; } .audit-kpis { grid-template-columns: repeat(2,minmax(0,1fr)); } }
@media (max-width: 560px) { .audit-controls { grid-template-columns: 1fr 1fr; } .audit-controls button { grid-column: 1 / -1; } .report-actions { align-items: flex-start; flex-direction: column; } }
@media (max-width: 460px) { .grid { grid-template-columns: 1fr; } .admin-grid { grid-template-columns: 1fr 1fr; } .audit-kpis { grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px) { .practice-kpis, .practice-stats { grid-template-columns: 1fr 1fr; } }
@media (max-width: 520px) { .stat-guide-grid { grid-template-columns: 1fr; } .action { align-items: flex-start; } }
@media (max-width: 620px) { .score-breakdown { grid-template-columns: 1fr 1fr; } }