:root { font:15px/1.5 system-ui,sans-serif; color:#192a40; background:#f3f6fb; } * { box-sizing:border-box; } body { margin:0; } main { max-width:1440px; margin:auto; padding:38px 36px; } header { display:flex; justify-content:space-between; align-items:center; gap:24px; } .eyebrow { font-size:11px; letter-spacing:2px; font-weight:700; color:#4968a3; } h1 { font-size:34px; margin:8px 0 0; letter-spacing:-1px; } h2 { margin:0; font-size:19px; } p { color:#5e6e84; } .tag { background:#e3edfc; color:#2a55a2; padding:7px 14px; border-radius:30px; white-space:nowrap; } .connection,.list { background:white; border:1px solid #dee6f0; border-radius:14px; padding:24px; margin:24px 0; } label { display:block; font-weight:600; margin-bottom:8px; } .row { display:flex; gap:12px; } input { font:inherit; padding:11px 14px; border:1px solid #c7d2e3; border-radius:8px; width:min(720px,100%); min-width:0; } button { font:inherit; border:0; background:#275bca; color:white; font-weight:600; border-radius:8px; padding:11px 20px; cursor:pointer; white-space:nowrap; } .secondary { background:#eaf0fa; color:#294973; margin-top:18px; } .metrics { display:grid; grid-template-columns:repeat(4,1fr); gap:18px; } article { border:1px solid #dee6f0; border-radius:12px; padding:20px; background:white; } article span { color:#5e6e84; } strong { display:block; font-size:30px; margin-top:6px; } strong.date { font-size:17px; } .title { display:flex; justify-content:space-between; margin-bottom:20px; } #shown { color:#5e6e84; } .scroll { overflow:auto; } table { width:100%; border-collapse:collapse; min-width:850px; text-align:left; } th { color:#5e6e84; font-size:12px; font-weight:600; } th,td { padding:14px 12px; border-bottom:1px solid #e9edf4; } td { font-size:13px; vertical-align:top; } td:first-child { font-weight:600; white-space:nowrap; } footer { font-size:13px; color:#66768c; max-width:900px; } @media(max-width:720px) { main { padding:24px 16px; } header { align-items:flex-start; flex-direction:column; gap:4px; } h1 { font-size:28px; } .metrics { grid-template-columns:repeat(2,1fr); gap:12px; } .connection,.list { padding:18px; } .row { flex-direction:column; } }
