:root{--ink:#0f172a;--muted:#64748b;--line:#e5e7eb;--ok:#16a34a;--bad:#ef4444}
*{box-sizing:border-box}body{font-family:Segoe UI,system-ui,Arial;margin:0;background:#f8fafc;color:var(--ink)}
main.container{max-width:1100px;margin:0 auto;padding:20px}
nav{display:flex;flex-wrap:wrap;gap:8px;margin:10px 0 18px}
nav a{padding:8px 12px;border:1px solid var(--line);border-radius:10px;background:#fff;text-decoration:none;color:var(--ink)}
nav a.active{background:var(--ink);color:#fff;border-color:var(--ink)}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:14px}
.card{border:1px solid var(--line);border-radius:16px;background:#fff;padding:16px;box-shadow:0 6px 20px rgba(0,0,0,.05)}
.hero{display:flex;gap:18px;flex-wrap:wrap;align-items:center}
.hero img{width:96px;height:96px;border-radius:50%;object-fit:cover;border:1px solid var(--line)}
ul.clean{margin:8px 0 0 18px}.muted{color:#64748b}.small{font-size:13px}
.table{width:100%;border-collapse:collapse}.table th,.table td{border-bottom:1px solid var(--line);padding:10px;text-align:left}.table th{background:#f1f5f9}
.badge{display:inline-block;padding:4px 10px;border:1px solid var(--line);border-radius:999px}.ok{border-color:var(--ok);color:#166534}.bad{border-color:#ef4444;color:#991b1b}
iframe{width:100%;height:860px;border:1px solid var(--line);border-radius:12px;background:#fff}
input,textarea{width:100%;padding:10px;border:1px solid var(--line);border-radius:10px}
button,.btn{padding:10px 14px;border-radius:10px;border:1px solid var(--ink);background:#0f172a;color:#fff;cursor:pointer;text-decoration:none;display:inline-block}