:root {
  --shell-bg: #020617;
  --shell-bg-soft: #111827;
  --shell-border: #334155;
  --shell-text: #e5e7eb;
  --shell-muted: #94a3b8;
  --shell-blue: #38bdf8;
}

.app-header {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 18px !important;
  min-height: 66px;
  padding: 11px 20px !important;
  margin: 0 !important;
  background: linear-gradient(90deg, var(--shell-bg), var(--shell-bg-soft)) !important;
  border-bottom: 1px solid var(--shell-border) !important;
  color: var(--shell-text) !important;
}

.app-header__main { min-width: 0; }
.app-header__title-row { display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.app-header h1 {
  margin: 0 !important;
  font-size: 20px !important;
  line-height: 1.15 !important;
  letter-spacing: .02em !important;
  color: var(--shell-text) !important;
}

.app-header p,
.app-header__subtitle {
  margin: 4px 0 0 !important;
  max-width: 980px;
  color: var(--shell-muted) !important;
  font-size: 12px !important;
  line-height: 1.35 !important;
}

.app-header__actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 7px;
  flex-wrap: wrap;
  flex: 0 0 auto;
}
.app-header__action {
  display: inline-flex;
  align-items: center;
  min-height: 32px;
  padding: 6px 10px;
  border: 1px solid #475569;
  border-radius: 6px;
  background: #1f2937;
  color: var(--shell-text) !important;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .03em;
  text-decoration: none !important;
  text-transform: uppercase;
  white-space: nowrap;
}
.app-header__action:hover { background:#334155; }

.app-header__badge {
  display:inline-flex;
  align-items:center;
  padding:3px 7px;
  border:1px solid var(--shell-border);
  border-radius:999px;
  background:#0f172a;
  color:var(--shell-blue);
  font-size:10px;
  font-weight:700;
  letter-spacing:.04em;
}
body > nav {
  display: flex !important;
  align-items: center !important;
  gap: 2px !important;
  flex-wrap: wrap !important;
  min-height: 38px;
  padding: 7px 20px !important;
  margin: 0 !important;
  background: var(--shell-bg) !important;
  border-bottom: 1px solid var(--shell-border) !important;
  position: sticky !important;
  top: 0 !important;
  z-index: 50 !important;
}

body > nav a {
  display: inline-flex !important;
  align-items: center !important;
  min-height: 26px;
  margin: 0 !important;
  padding: 4px 8px !important;
  border-radius: 5px;
  color: var(--shell-blue) !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  letter-spacing: .04em !important;
  text-decoration: none !important;
  text-transform: uppercase !important;
}
body > nav a:hover { background:#111827 !important; color:#e0f2fe !important; }
body > nav a[aria-current="page"] {
  background:#172033 !important;
  color:#f8fafc !important;
  box-shadow: inset 0 -2px 0 var(--shell-blue);
}

@media (max-width: 760px) {
  .app-header { align-items:flex-start !important; padding:10px 12px !important; }
  .app-header__actions { justify-content:flex-start; }
  body > nav { padding:7px 10px !important; }
  body > nav a { padding:4px 6px !important; }
}