/* vigil — operator console */

/* ── Book pills ── */
.book-pill {
  display: inline-block; font-size: 10px; font-weight: 600;
  padding: 2px 7px; border-radius: 4px; letter-spacing: .03em;
  white-space: nowrap; vertical-align: middle;
}
.bk-dk { background:#1e3a5f; color:#60a5fa; border:1px solid #1d4ed8; }
.bk-fd { background:#0c3040; color:#22d3ee; border:1px solid #0e7490; }
.bk-mg { background:#3b0a0a; color:#fca5a5; border:1px solid #b91c1c; }
.bk-cs { background:#3b1f04; color:#fcd34d; border:1px solid #92400e; }
.bk-br { background:#3a1a06; color:#fb923c; border:1px solid #c2410c; }
.bk-ts { background:#3d0a22; color:#fca5a5; border:1px solid #be185d; }
.bk-fn { background:#2e1065; color:#c4b5fd; border:1px solid #6d28d9; }
.bk-hr { background:#0d2b0d; color:#86efac; border:1px solid #166534; }
.bk-rb { background:#1e1b4b; color:#a5b4fc; border:1px solid #4338ca; }
.bk-pn { background:#1f2937; color:#9ca3af; border:1px solid #374151; }
.bk-bv { background:#1c1917; color:#a8a29e; border:1px solid #44403c; }
.bk-bo { background:#1c1917; color:#a8a29e; border:1px solid #44403c; }
.bk-lv { background:#1c1917; color:#a8a29e; border:1px solid #44403c; }
.bk-mb { background:#1c1917; color:#a8a29e; border:1px solid #44403c; }

@import url('https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;500;700&family=Geist:wght@400;500;600;700&display=swap');

:root {
	/* surface */
	--bg:          #09090b;   /* zinc-950 */
	--bg-1:        #111114;
	--bg-2:        #16161a;
	--bg-3:        #1c1c21;
	--line:        #27272a;   /* zinc-800 */
	--line-2:      #3f3f46;   /* zinc-700 */

	/* text */
	--fg:          #f4f4f5;   /* zinc-100 */
	--fg-2:        #d4d4d8;   /* zinc-300 */
	--fg-3:        #a1a1aa;   /* zinc-400 */
	--fg-4:        #71717a;   /* zinc-500 */
	--fg-5:        #52525b;   /* zinc-600 */

	/* status — used semantically only */
	--ok:          #34d399;   /* emerald-400 */
	--ok-bg:       rgba(16, 185, 129, 0.12);
	--ok-line:     rgba(16, 185, 129, 0.32);

	--warn:        #fbbf24;   /* amber-400 — RESERVED for "needs operator" */
	--warn-bg:     rgba(245, 158, 11, 0.10);
	--warn-line:   rgba(245, 158, 11, 0.32);

	--err:         #f87171;   /* red-400 */
	--err-bg:      rgba(239, 68, 68, 0.10);
	--err-line:    rgba(239, 68, 68, 0.32);

	--info:        #60a5fa;   /* blue-400 */
	--info-bg:     rgba(59, 130, 246, 0.10);
	--info-line:   rgba(59, 130, 246, 0.30);

	--muted:       #a1a1aa;
	--muted-bg:    rgba(63, 63, 70, 0.30);
	--muted-line:  rgba(63, 63, 70, 0.60);
}

* { box-sizing: border-box; }
html, body {
	margin: 0;
	font-family: 'Geist', ui-sans-serif, system-ui, -apple-system, 'Segoe UI', sans-serif;
	font-feature-settings: 'ss01', 'cv11';
}
body {
	background: var(--bg);
	color: var(--fg);
	-webkit-tap-highlight-color: transparent;
	-webkit-font-smoothing: antialiased;
	overscroll-behavior-y: contain;
	overflow-x: hidden;
	font-size: 14px;
	line-height: 1.45;
}

a { color: inherit; text-decoration: none; }

/* Mono everywhere we mark up with .font-mono via Tailwind */
.font-mono, code, kbd, pre {
	font-family: 'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, monospace !important;
	font-feature-settings: 'zero', 'ss02';
}

/* ---------- primitives ---------- */

/* status pill */
.pill {
	display: inline-flex; align-items: center; gap: 0.375rem;
	padding: 0.125rem 0.5rem;
	font: 500 11px/1.4 'JetBrains Mono', monospace;
	border-radius: 4px;
	border: 1px solid var(--muted-line);
	background: var(--muted-bg);
	color: var(--muted);
	text-transform: lowercase;
	letter-spacing: 0.02em;
	white-space: nowrap;
}
.pill::before {
	content: ''; width: 5px; height: 5px; border-radius: 999px;
	background: currentColor; opacity: 0.85;
}
.pill.no-dot::before { display: none; }

.pill-ok   { color: var(--ok);    border-color: var(--ok-line);   background: var(--ok-bg); }
.pill-warn { color: var(--warn);  border-color: var(--warn-line); background: var(--warn-bg); }
.pill-err  { color: var(--err);   border-color: var(--err-line);  background: var(--err-bg); }
.pill-info { color: var(--info);  border-color: var(--info-line); background: var(--info-bg); }

/* kicker label — small uppercase tag */
.kicker {
	font: 600 10px/1 'Geist', sans-serif;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--fg-4);
}

/* big numeric display */
.stat-num {
	font: 700 clamp(20px, 5vw, 28px)/1 'JetBrains Mono', monospace;
	letter-spacing: -0.02em;
	color: var(--fg);
	font-variant-numeric: tabular-nums;
}
.stat-num-lg { font-size: clamp(26px, 8vw, 40px); }
.stat-num-sm { font-size: clamp(16px, 4vw, 20px); }

/* card */
.card {
	background: var(--bg-1);
	border: 1px solid var(--line);
	border-radius: 8px;
}
.card-hover:hover { border-color: var(--line-2); background: var(--bg-2); }
.card-hover:active { background: var(--bg-3); }

/* attention bar — left accent on cards that need operator */
.attn-warn { box-shadow: inset 3px 0 0 var(--warn); }
.attn-err  { box-shadow: inset 3px 0 0 var(--err); }
.attn-info { box-shadow: inset 3px 0 0 var(--info); }

/* tabular numeric */
.tnum { font-variant-numeric: tabular-nums; }

/* divider rule */
.rule { border-top: 1px solid var(--line); }

/* Focus */
:focus-visible {
	outline: 2px solid var(--warn);
	outline-offset: 2px;
}

/* Pre-CDN fallback */
.bg-zinc-950 { background: var(--bg); }
.text-zinc-100 { color: var(--fg); }

/* Bottom-nav safe area */
@supports (padding: max(0px)) {
	body main { padding-bottom: max(6rem, env(safe-area-inset-bottom, 0)); }
	@media (min-width: 640px) {
		body main { padding-bottom: 1.5rem; }
	}
}

/* Bottom nav — safe-area aware */
.bottom-nav {
	padding-bottom: env(safe-area-inset-bottom, 0px);
}
@supports (padding: env(safe-area-inset-bottom)) {
	.bottom-nav {
		padding-bottom: env(safe-area-inset-bottom);
	}
}

/* Subtle background texture — adds depth without screaming */
body::before {
	content: '';
	position: fixed; inset: 0;
	pointer-events: none;
	background:
		radial-gradient(ellipse 80% 50% at 50% -10%, rgba(251, 191, 36, 0.03), transparent 60%),
		radial-gradient(ellipse 60% 40% at 100% 100%, rgba(96, 165, 250, 0.025), transparent 60%);
	z-index: -1;
}