:root { --fg:#1a1a1a; --muted:#666; --line:#ddd; --accent:#1d4ed8; }
* { box-sizing: border-box; }
body { margin:0; font:16px/1.5 system-ui,Segoe UI,Roboto,sans-serif; color:var(--fg); background:#fafafa; }
main { max-width:980px; margin:0 auto; padding:24px; }
h1 { font-size:1.5rem; } h2 { font-size:1.1rem; color:var(--muted); margin:24px 0 8px; }
.topbar { display:flex; justify-content:space-between; align-items:center; }
.grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); gap:12px; }
.card { display:flex; flex-direction:column; gap:4px; padding:16px; border:1px solid var(--line);
  border-radius:10px; background:#fff; text-decoration:none; color:var(--fg); }
.card:hover { border-color:var(--accent); }
.card-type { font-weight:600; } .card-mode { color:var(--muted); font-size:.9rem; }
.btn { display:inline-block; padding:8px 14px; border:0; border-radius:8px; background:var(--accent);
  color:#fff; font:inherit; text-decoration:none; cursor:pointer; }
.btn.ghost { background:#fff; color:var(--fg); border:1px solid var(--line); }
.actions { display:flex; gap:10px; flex-wrap:wrap; margin:12px 0; }
.hint { color:var(--muted); font-size:.9rem; }
.login { max-width:320px; margin:10vh auto; display:flex; flex-direction:column; gap:12px; }
.login input { padding:10px; border:1px solid var(--line); border-radius:8px; font:inherit; }
.error { color:#b91c1c; }
iframe#pdf { width:100%; height:80vh; border:1px solid var(--line); border-radius:8px; background:#fff; }