/* Quiet Signal — editorial monitoring, not a neon console. */
:root, html[data-theme="dark"] {
  --bg: #101011;
  --panel: #171719;
  --ink: #ededee;
  --muted: #a0a0a6;
  --line: #2b2b2f;
  --accent: #ededee;
  --wash: #232325;
  --nav: #101011;
  --nav-ink: #a0a0a6;
  --nav-active: #232325;
  --button-ink: #18181a;
  --status-ok: #92baa4;
  --danger: #dd999c;
  --warn: #cbb691;
  --shadow: none;
}
html[data-theme="light"] {
  --bg: #faf9f7;
  --panel: #ffffff;
  --ink: #262527;
  --muted: #6a686d;
  --line: #e4e2df;
  --accent: #262527;
  --wash: #eeedeb;
  --nav: #faf9f7;
  --nav-ink: #6a686d;
  --nav-active: #eeedeb;
  --button-ink: #ffffff;
  --status-ok: #356b50;
  --danger: #a4474f;
  --warn: #856327;
}
body { background-image: none; font-family: "SF Pro Display", "Helvetica Neue", "PingFang SC", "Microsoft YaHei", sans-serif; }
.sidebar { width: 216px; padding: 38px 18px 24px; border-right: 1px solid var(--line); }
.brand { margin: 0 10px 60px; gap: 11px; }
.brand-mark { width: 26px; height: 30px; font-size: 26px; border: 0; border-radius: 0; box-shadow: none; color: var(--ink); }
.brand strong { font-size: 17px; font-weight: 550; letter-spacing: .4px; }
.brand small, .nav-caption, nav a span { display: none; }
nav { gap: 6px; }
nav a { min-height: 45px; padding: 10px 16px; border: 0; font-size: 13px; border-radius: 6px; }
nav a.active { background: var(--nav-active); color: var(--ink); border: 0; box-shadow: none; }
nav a:hover { border: 0; background: var(--wash); }
.sidebar-note { font-size: 11px; padding: 25px 12px 18px; }
.sidebar-note p { font-size: 10px; line-height: 1.9; }
.tiny-dot { background: var(--muted); box-shadow: none; }
.theme-button { padding-left: 12px; border-top: 0; font-size: 12px; }
.workspace { margin-left: 216px; }
.topbar { max-width: 1120px; margin: auto; height: 75px; background: transparent; border-bottom: 0; padding: 0 52px; }
.topbar > span { font-family: inherit; letter-spacing: .4px; font-size: 11px; color: var(--muted); }
.topbar > span::before { content: none; }
.timezone { font-size: 10px; }
.icon-button { background: transparent; border: 0; border-radius: 6px; color: var(--muted); width: 44px; min-height: 44px; }
.icon-button:hover { background: var(--wash); color: var(--ink); }
main { max-width: 1120px; padding: 28px 52px 72px; }
.page-heading { padding: 0; border: 0; margin-bottom: 38px; align-items: center; }
.page-heading::after, .status-mini::after, .subscription::after { content: none; }
.eyebrow { display: none; }
.page-heading h1 { font-size: 32px; font-weight: 500; letter-spacing: -1px; margin: 0 0 14px; }
.page-heading p { font-size: 13px; line-height: 1.9; max-width: 550px; }
.primary-link { background: var(--accent); color: var(--button-ink); font-size: 12px; font-weight: 500; border: 0; border-radius: 7px; padding: 10px 16px; box-shadow: none; gap: 14px; }
.primary-link:hover { transform: none; box-shadow: none; filter: brightness(.92); }
.status-strip { border: 1px solid var(--line); border-radius: 9px; gap: 0; background: var(--panel); margin-bottom: 34px; }
.status-mini { border: 0; border-radius: 0; background: transparent; box-shadow: none; padding: 19px 24px; overflow: visible; }
.status-mini + .status-mini { border-left: 1px solid var(--line); }
.status-mini strong { font-size: 12px; font-weight: 500; }
.status-mini small { font-family: inherit; font-size: 10px; color: var(--muted); margin-top: 4px; }
.pill { border: 0; background: transparent; font-size: 10px; padding: 3px 0; gap: 6px; }
.pill.operational, .pill.healthy, .pill.resolved, .pill.error, .pill.degraded, .pill.unknown, .pill.draft, .pill.stale, .pill.unconfigured, .pill.investigating, .pill.monitoring, .pill.identified { background: transparent; }
.pill::before { width: 4px; height: 4px; }
.feed-toolbar { border: 0; border-bottom: 1px solid var(--line); border-radius: 0; padding: 0 0 15px; background: transparent; gap: 15px; }
.tabs { gap: 3px; }
.tabs button { border: 0; padding: 8px 13px; font-weight: 400; border-radius: 6px; }
.tabs button.active { color: var(--ink); background: var(--wash); border: 0; font-weight: 500; }
.search input { background: transparent; border: 1px solid var(--line); border-radius: 7px; font-size: 11px; }
.search { max-width: 225px; }
.feed-caption { margin: 24px 0 0; font-size: 11px; }
.feed-caption span:first-child, #result-count { font-family: inherit; color: var(--muted); letter-spacing: 0; }
.record { background: transparent; border: 0; border-bottom: 1px solid var(--line); border-radius: 0; box-shadow: none; margin: 0; padding: 28px 0; }
.record:hover { border-color: var(--line); }
.record-head { margin-bottom: 12px; }
.product-label { font-family: inherit; font-size: 11px; font-weight: 500; letter-spacing: .1px; text-transform: none; color: var(--ink); }
.type-label { font-size: 10px; padding: 0; background: transparent; border: 0; color: var(--muted); }
.type-label::before { content: "/"; margin-right: 9px; color: var(--muted); }
.record time { font-family: inherit; font-size: 11px; }
.record h2, .record h3 { font-size: 17px; line-height: 1.6; font-weight: 500; letter-spacing: -.15px; margin-bottom: 10px; }
.record p { font-size: 13px; line-height: 1.9; color: var(--muted); }
.record summary { font-size: 11px; color: var(--muted); }
.record summary:hover { color: var(--ink); }
.record-foot { border: 0; margin-top: 14px; padding: 0; font-size: 10px; }
.record-foot a { color: var(--muted); min-height: 30px; }
.record-foot a:hover { color: var(--ink); }
.record-foot > span { color: var(--muted); font-size: 10px; }
.secondary-button { background: transparent; border-color: var(--line); font-size: 12px; border-radius: 6px; }
.secondary-button:hover { border-color: var(--muted); }
.provider, .subscription, .admin-card, .admin-login { box-shadow: none; border-radius: 9px; }
.provider { padding: 25px; }
.provider-heading h2, .section-heading h2 { font-size: 17px; font-weight: 500; }
.component { font-size: 12px; }
.component > span:last-child { font-size: 10px; }
.provider > a, .source-row a { color: var(--ink); }
.source-row { border: 0; border-bottom: 1px solid var(--line); background: transparent; border-radius: 0; padding: 25px 0; box-shadow: none; margin: 0; }
.source-row h3 { font-weight: 500; }
.source-row p { font-size: 11px; }
.subscription { padding: 30px; }
.subscription .label { color: var(--muted); font-size: 10px; letter-spacing: 1px; }
.subscription h2 { font-size: 23px; font-weight: 500; margin-top: 25px; }
.subscription p { font-size: 13px; }
.explain h2 { font-size: 18px; font-weight: 500; }
.notice { border-radius: 7px; background: var(--wash); }
.empty { background: transparent; border: 0; border-bottom: 1px solid var(--line); border-radius: 0; padding: 55px 20px; }
footer { max-width: 1016px; margin: 0 auto; border-top: 1px solid var(--line); padding: 25px 0; font-size: 10px; }
footer a { color: var(--muted); }
@media(min-width:1500px) { .page-heading h1 { font-size: 35px; } main { padding-top: 38px; } }
@media(max-width:1100px) {
  .sidebar { width: 194px; padding: 30px 13px 20px; }
  .workspace { margin-left: 194px; }
  .brand { margin-left: 9px; gap: 9px; }
  .brand-mark { width: 23px; flex-shrink: 0; }
  .brand strong { font-size: 16px; }
  .topbar { padding: 0 32px; }
  main { padding: 25px 32px 60px; }
  .status-mini { padding: 18px; }
  footer { margin: 0 32px; }
}
@media(max-width:760px) {
  .sidebar { position: static; width: auto; height: auto; padding: 22px 20px 0; border: 0; background: var(--bg); }
  .brand { margin: 0 0 23px; gap: 10px; }
  .brand-mark { width: 24px; height: 28px; font-size: 25px; }
  .brand strong { font-size: 18px; font-weight: 500; }
  nav { border-bottom: 1px solid var(--line); margin: 0 -2px; gap: 6px; padding-bottom: 12px; }
  nav a { padding: 8px 12px; font-size: 12px; min-height: 44px; }
  .theme-button { top: 17px; right: 22px; }
  .workspace { margin-left: 0; }
  .topbar { height: 49px; padding: 0 20px; }
  .topbar > span { font-size: 9px; letter-spacing: .3px; }
  main { padding: 19px 20px 45px; }
  .page-heading { margin-bottom: 25px; gap: 16px; align-items: flex-start; }
  .page-heading h1 { font-size: 27px; font-weight: 500; margin: 0 0 11px; }
  .page-heading p { font-size: 12px; line-height: 1.8; max-width: 245px; }
  .page-heading > .primary-link { margin-top: 0; padding: 8px 11px; font-size: 10px; gap: 8px; min-height: 40px; }
  .status-strip { margin-bottom: 25px; border-radius: 8px; }
  .status-mini { padding: 15px 13px; }
  .status-mini strong { font-size: 11px; }
  .status-mini small { font-size: 9px; }
  .status-mini .pill { font-size: 10px; margin-top: 7px; }
  .feed-toolbar { padding-bottom: 15px; gap: 12px; }
  .tabs button { font-size: 12px; }
  .search { max-width: none; }
  .search input { font-size: 12px; }
  .feed-caption { margin-top: 20px; font-size: 10px; }
  .record { padding: 25px 0; }
  .record-head { gap: 8px; margin-bottom: 12px; }
  .product-label { font-size: 10px; }
  .type-label { font-size: 9px; }
  .record time { font-size: 10px; }
  .record h2, .record h3 { font-size: 16px; line-height: 1.65; font-weight: 500; }
  .record p { font-size: 12px; line-height: 1.9; }
  .record-foot { font-size: 10px; align-items: flex-start; gap: 12px; }
  .record-foot > span { font-size: 9px; max-width: 118px; }
  .record-foot a { min-height: 32px; }
  .source-row { padding: 23px 0; }
  .source-row h3 { font-size: 13px; }
  .source-row p { font-size: 11px; }
  footer { margin: 0 20px; padding: 23px 0; font-size: 9px; }
}
@media(prefers-reduced-motion:no-preference) { nav a, .primary-link, .secondary-button { transition: background .15s ease, color .15s ease; } }
@media(prefers-reduced-motion:reduce) { *, *::before, *::after { transition: none !important; animation: none !important; } }
