:root{--bg:#f4f6fb;--card:#ffffff;--text:#182233;--muted:#667085;--line:#dfe5ef;--brand:#0f3d66;--accent:#0b77bd;--ok:#0f766e;--warning:#b45309;}
*{box-sizing:border-box}body{margin:0;font-family:Arial,Helvetica,sans-serif;background:var(--bg);color:var(--text);line-height:1.5}.topbar{background:linear-gradient(135deg,var(--brand),#124e7f);color:#fff;padding:26px 18px}.wrap{max-width:1080px;margin:0 auto}.brand{display:flex;gap:18px;align-items:center}.brand img{width:78px;height:auto;background:#fff;border-radius:10px;padding:8px}.brand h1{font-size:1.8rem;margin:.1rem 0}.brand p{margin:.25rem 0;color:#e5edf6}.panel{background:var(--card);border:1px solid var(--line);border-radius:18px;margin:24px 0;padding:20px;box-shadow:0 10px 25px rgba(16,24,40,.06)}.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.metric{padding:16px;border:1px solid var(--line);border-radius:14px;background:#fbfdff}.metric strong{display:block;font-size:1.7rem}.metric span{color:var(--muted);font-size:.95rem}.toolbar{display:flex;gap:10px;flex-wrap:wrap;margin:18px 0}.toolbar input,.toolbar select{border:1px solid var(--line);border-radius:12px;padding:12px;font-size:1rem;background:#fff}.toolbar input{flex:1;min-width:260px}.notice{border:1px solid var(--line);border-radius:15px;padding:16px;margin:12px 0;background:#fff}.notice h3{margin:0 0 8px;font-size:1.1rem}.meta{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}.badge{display:inline-block;border-radius:999px;padding:4px 10px;font-size:.82rem;background:#eef6ff;color:#075985;border:1px solid #cde7ff}.badge.warning{background:#fff7ed;color:var(--warning);border-color:#fed7aa}.muted{color:var(--muted)}.alert{background:#fff7ed;border:1px solid #fed7aa;color:#7c2d12;border-radius:14px;padding:14px;margin-top:16px}footer{padding:30px 18px;color:var(--muted);text-align:center}@media(max-width:700px){.brand{align-items:flex-start}.grid{grid-template-columns:1fr}.brand h1{font-size:1.35rem}.panel{border-radius:0;margin:0;border-left:0;border-right:0}}