* { box-sizing: border-box; }
html { min-height: 100%; background: var(--surface-muted); color: var(--text); font-family: var(--font); }
body { min-height: 100vh; margin: 0; background: var(--surface-muted); }
button, input, select, textarea { font: inherit; }
button, a, select { -webkit-tap-highlight-color: transparent; }
button { cursor: pointer; }
a { color: var(--blue-600); text-decoration: none; }
svg { display: inline-block; flex: 0 0 auto; }
h1, h2, h3, p { margin-top: 0; }
h1 { margin-bottom: .35rem; color: var(--navy-950); font-size: clamp(1.55rem, 3vw, 2.15rem); line-height: 1.08; }
h2 { color: var(--navy-950); }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0, 0, 0, 0); }
.eyebrow { display: block; margin-bottom: .5rem; color: var(--blue-600); font-size: .69rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.panel { border: 1px solid var(--line); border-radius: var(--radius-lg); background: var(--surface); box-shadow: var(--shadow-sm); }
.main-content { width: min(var(--content), calc(100% - 48px)); margin: 0 auto; padding: 20px 0 110px; }
.empty-state { min-height: 360px; display: grid; place-content: center; justify-items: center; padding: 42px; color: var(--text-muted); text-align: center; }
.empty-state svg { margin-bottom: 18px; color: var(--blue-600); }
.empty-state h2 { margin-bottom: 8px; }
.empty-state p { margin: 0; }