@import url('https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=DM+Sans:wght@400;500;600;700&family=Newsreader:opsz,wght@6..72,500;6..72,600&display=swap');

:root { --ink:#182a35; --muted:#6f7e81; --paper:#f4f1e9; --card:#fffdf8; --line:#dfe1d9; --orange:#e9683d; --sage:#d9e4d6; --blue:#bdd4da; }
* { box-sizing:border-box; }
[hidden] { display:none !important; }
body { margin:0; color:var(--ink); background:var(--paper); font-family:'DM Sans', sans-serif; }
body:before { content:""; position:fixed; inset:0; pointer-events:none; opacity:.28; background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 160 160' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.07'/%3E%3C/svg%3E"); z-index:10; }
.shell { max-width:1440px; margin:auto; padding:0 5vw 80px; }
.login-screen { min-height:100vh; display:grid; place-items:center; padding:30px; background:radial-gradient(circle at 75% 15%, #d9e4d6 0, transparent 31%), var(--paper); }.login-card { width:min(430px, 100%); padding:55px 48px 48px; background:var(--card); border:1px solid var(--line); box-shadow:12px 12px 0 var(--sage); }.login-card > .brand-mark { display:grid; margin-bottom:35px; }.login-card h1 { margin:0; font:600 68px/.9 Newsreader,serif; letter-spacing:-.06em; }.login-card h1 span { color:var(--orange); }.login-copy { color:var(--muted); font-size:14px; line-height:1.55; margin:20px 0 32px; }.login-card form { display:grid; gap:16px; }.login-card label { color:var(--muted); font:10px 'DM Mono',monospace; text-transform:uppercase; letter-spacing:.08em; }.login-card input { display:block; width:100%; border:1px solid var(--line); background:#fff; color:var(--ink); padding:14px; margin-top:7px; outline:0; font:15px 'DM Sans',sans-serif; }.login-card input:focus { border-color:var(--orange); }.login-card button { border:0; padding:15px; background:var(--ink); color:white; cursor:pointer; text-align:left; font:12px 'DM Mono',monospace; margin-top:5px; }.login-card button span { float:right; color:var(--orange); font-size:17px; line-height:10px; }.login-error { color:var(--orange); min-height:15px; margin:0; font-size:12px; }
.topbar { height:84px; border-bottom:1px solid var(--line); display:flex; align-items:center; justify-content:space-between; }
.brand { color:var(--ink); text-decoration:none; display:flex; gap:11px; align-items:center; font-size:15px; letter-spacing:-.02em; }.brand b { font-weight:700; }.brand-mark { background:var(--orange); color:white; width:29px; height:29px; display:grid; place-items:center; font-family:Newsreader,serif; font-size:20px; border-radius:50%; }.status { color:var(--muted); font:11px 'DM Mono',monospace; text-transform:uppercase; letter-spacing:.06em; }.status i { display:inline-block; width:6px; height:6px; background:#5b9d67; border-radius:50%; margin-right:7px; }
.intro { display:flex; justify-content:space-between; align-items:end; padding:92px 0 68px; }.eyebrow { color:var(--orange); font:500 11px 'DM Mono',monospace; letter-spacing:.14em; text-transform:uppercase; margin:0 0 17px; }.intro h1 { margin:0; font:600 clamp(54px,7vw,98px)/.87 Newsreader,serif; letter-spacing:-.06em; }.intro h1 em { color:var(--orange); font-style:normal; }.intro-copy { max-width:295px; margin:0 5% 5px 20px; color:var(--muted); font-size:15px; line-height:1.55; }
.stats { display:grid; grid-template-columns:repeat(4,1fr); border:1px solid var(--ink); margin-bottom:88px; }.stat { padding:22px 25px; border-right:1px solid var(--ink); }.stat:last-child { border:0; }.stat-value { font:500 38px Newsreader,serif; letter-spacing:-.04em; }.stat-label { color:var(--muted); font:10px 'DM Mono',monospace; letter-spacing:.1em; text-transform:uppercase; margin-top:8px; }
.directory-head { display:flex; justify-content:space-between; align-items:end; margin-bottom:25px; }.directory-head .eyebrow { margin-bottom:8px; }.directory h2 { font:500 40px Newsreader,serif; letter-spacing:-.04em; margin:0; }.result-count { color:var(--muted); font:11px 'DM Mono',monospace; padding-bottom:7px; }
.filters { display:flex; gap:9px; margin-bottom:20px; }.search { display:flex; align-items:center; flex:1; background:var(--card); border:1px solid var(--line); padding:0 15px; }.search span { font-size:25px; line-height:0; transform:rotate(-20deg); color:var(--orange); }.search input, select { width:100%; border:0; background:transparent; color:var(--ink); font:14px 'DM Sans',sans-serif; outline:0; }.search input { padding:15px 10px; } select { width:190px; padding:0 14px; border:1px solid var(--line); background:var(--card); }.clear { border:1px solid var(--line); color:var(--muted); background:transparent; padding:0 17px; font:11px 'DM Mono',monospace; cursor:pointer; }.clear:hover { color:var(--orange); border-color:var(--orange); }
.records { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; }.record { background:var(--card); border:1px solid var(--line); padding:22px 22px 18px; cursor:pointer; transition:.2s ease; min-height:225px; display:flex; flex-direction:column; }.record:hover { transform:translateY(-3px); border-color:var(--orange); box-shadow:6px 6px 0 var(--sage); }.record-top { display:flex; justify-content:space-between; align-items:center; }.batch { background:var(--sage); padding:5px 8px; font:10px 'DM Mono',monospace; }.record-id { color:#9ba5a3; font:10px 'DM Mono',monospace; }.record h3 { font-size:20px; line-height:1.12; letter-spacing:-.04em; margin:21px 0 8px; }.role { color:var(--muted); font-size:13px; line-height:1.35; min-height:35px; }.record-bottom { border-top:1px solid var(--line); margin-top:auto; padding-top:15px; display:flex; gap:16px; }.mini-label { color:#9ba5a3; display:block; font:9px 'DM Mono',monospace; text-transform:uppercase; margin-bottom:4px; }.mini-value { font-size:12px; font-weight:600; }.category { margin-left:auto; text-align:right; max-width:125px; color:var(--orange); font:10px/1.2 'DM Mono',monospace; }
.pagination { display:flex; gap:6px; justify-content:center; padding:34px 0; }.page { border:1px solid var(--line); background:transparent; color:var(--muted); min-width:35px; height:35px; cursor:pointer; font:11px 'DM Mono',monospace; }.page.current, .page:hover { background:var(--ink); color:white; border-color:var(--ink); }.page:disabled { opacity:.35; cursor:default; }
.overlay { position:fixed; inset:0; background:rgba(24,42,53,.3); z-index:20; }.drawer { position:fixed; z-index:21; right:0; top:0; width:min(620px,100%); height:100%; overflow:auto; background:var(--card); box-shadow:-15px 0 40px #182a3525; padding:65px 48px 50px; transform:translateX(100%); transition:transform .3s ease; }.drawer.open { transform:translateX(0); }.close { position:absolute; right:25px; top:20px; border:0; background:transparent; color:var(--muted); font-size:33px; cursor:pointer; }.detail-eyebrow { color:var(--orange); font:10px 'DM Mono',monospace; text-transform:uppercase; letter-spacing:.1em; }.detail h2 { font:500 48px/.95 Newsreader,serif; letter-spacing:-.05em; margin:13px 0 10px; }.detail-role { color:var(--muted); font-size:14px; line-height:1.45; margin-bottom:30px; }.detail-grid { display:grid; grid-template-columns:1fr 1fr; gap:1px; background:var(--line); border:1px solid var(--line); margin-bottom:30px; }.detail-cell { background:var(--paper); padding:14px; }.detail-cell span { display:block; color:var(--muted); font:9px 'DM Mono',monospace; text-transform:uppercase; margin-bottom:6px; }.detail-cell strong { font-size:14px; }.detail h3 { border-top:1px solid var(--line); padding-top:22px; font:500 25px Newsreader,serif; }.response { border-left:3px solid var(--blue); padding:12px 15px; background:#f1f5f2; margin:10px 0; }.response-name { font-weight:600; font-size:13px; }.response-meta { color:var(--muted); font:10px 'DM Mono',monospace; margin-top:4px; }.response p { font-size:13px; line-height:1.5; margin:11px 0 0; white-space:pre-wrap; }.empty, .loading { padding:50px 20px; text-align:center; color:var(--muted); grid-column:1/-1; }
@media (max-width:800px) { .shell { padding:0 20px 60px; }.topbar { height:65px; }.status { display:none; }.intro { display:block; padding:65px 0 48px; }.intro h1 { font-size:62px; }.intro-copy { margin:28px 0 0; }.stats { grid-template-columns:repeat(2,1fr); margin-bottom:60px; }.stat:nth-child(2) { border-right:0; }.stat:nth-child(-n+2) { border-bottom:1px solid var(--ink); }.filters { flex-wrap:wrap; }.search { flex-basis:100%; height:48px; } select { flex:1; height:45px; width:auto; }.clear { height:45px; }.records { grid-template-columns:1fr; }.directory-head { align-items:start; }.directory h2 { font-size:34px; }.drawer { padding:57px 24px 35px; }.detail h2 { font-size:40px; }.login-card { padding:40px 28px 32px; } }