/* Pingstat admin panel — theme vars + minimal resets. All visual tokens are CSS variables so Tailwind's dark: variant (driven by .dark on ) swaps them atomically. */ :root { --bg: #f6f7fb; --surface: #ffffff; --surface-muted: #f6f7fb; --border: #eceef4; --text: #1a1d29; --text-muted: #6b7280; --brand: #ff9500; --brand-hover: #e67300; --ok: #34c759; --ok-soft: rgba(52, 199, 89, .12); --warn: #ffcc00; --warn-soft: rgba(255, 204, 0, .12); --err: #ff3b30; --err-soft: rgba(255, 59, 48, .12); --shadow-card: 0 1px 2px rgba(16, 24, 40, .04); } html.dark { --bg: #0a0d18; --surface: #0f1322; --surface-muted: #151a2e; --border: #1b2138; --text: #e6e8f2; --text-muted: #9199b8; --brand: #ff9500; --brand-hover: #ffa940; --ok: #34c759; --ok-soft: rgba(52, 199, 89, .18); --warn: #ffcc00; --warn-soft: rgba(255, 204, 0, .18); --err: #ff3b30; --err-soft: rgba(255, 59, 48, .18); --shadow-card: 0 1px 2px rgba(0, 0, 0, .2); } /* System font stack */ body { font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif; } /* Thin scrollbars, calm colors */ * { scrollbar-width: thin; scrollbar-color: var(--border) transparent; } *::-webkit-scrollbar { width: 8px; height: 8px; } *::-webkit-scrollbar-track { background: transparent; } *::-webkit-scrollbar-thumb { background: var(--border); border-radius: 4px; } *::-webkit-scrollbar-thumb:hover { background: var(--text-muted); } /* Focus ring uses brand color; Tailwind's default focus is a touch harsh */ :focus-visible { outline: 2px solid var(--brand); outline-offset: 2px; } /* Small utility classes that are awkward in Tailwind */ .card-shadow { box-shadow: var(--shadow-card); }