:root { --ink:#1b2430; --muted:#5d6b7a; --line:#d9e0e7; --bg:#f4f6f9; --card:#fff; --brand:#0b5cad; --brand-dark:#084781; --bad:#b3261e; --good:#1b7f3b; --warn:#9a6700; }
* { box-sizing: border-box; }
body { margin:0; font:16px/1.45 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif; color:var(--ink); background:var(--bg); }
header.top { background:#fff; border-bottom:1px solid var(--line); padding:10px 20px; display:flex; align-items:center; gap:16px; flex-wrap:wrap; }
header.top .brand { font-weight:700; font-size:18px; color:var(--brand-dark); }
header.top .who { margin-left:auto; color:var(--muted); font-size:14px; }
nav.tabs { display:flex; gap:4px; padding:0 20px; background:#fff; border-bottom:1px solid var(--line); }
nav.tabs a { padding:12px 16px; color:var(--muted); text-decoration:none; border-bottom:3px solid transparent; font-weight:600; }
nav.tabs a[aria-current="page"] { color:var(--brand-dark); border-bottom-color:var(--brand); }
main { max-width:1040px; margin:24px auto; padding:0 16px 64px; }
.card { background:var(--card); border:1px solid var(--line); border-radius:10px; padding:20px; margin-bottom:20px; }
.card h2 { margin:0 0 4px; font-size:20px; } .card h3 { margin:18px 0 6px; font-size:16px; }
.hint { color:var(--muted); font-size:14px; margin:4px 0 12px; }
label { display:block; font-weight:600; font-size:14px; margin:12px 0 4px; }
input[type=text], input[type=email], input[type=password], input[type=number], input[type=search], textarea, select {
  width:100%; padding:9px 10px; font:inherit; border:1px solid #b9c3ce; border-radius:7px; background:#fff; color:var(--ink); }
textarea { min-height:110px; resize:vertical; }
input:focus, textarea:focus, select:focus, button:focus-visible, a:focus-visible { outline:3px solid #7fb2e6; outline-offset:1px; }
button, .btn { font:inherit; font-weight:600; padding:9px 16px; border-radius:7px; border:1px solid var(--brand); background:var(--brand); color:#fff; cursor:pointer; text-decoration:none; display:inline-block; }
button:hover, .btn:hover { background:var(--brand-dark); }
button.secondary, .btn.secondary { background:#fff; color:var(--brand-dark); }
button.secondary:hover { background:#eef4fb; }
button.danger { background:var(--bad); border-color:var(--bad); } button.danger:hover { background:#8c1d18; }
button.small { padding:4px 10px; font-size:14px; }
button:disabled { opacity:.5; cursor:default; }
.row { display:flex; gap:10px; align-items:center; flex-wrap:wrap; } .row > * { flex:0 0 auto; } .row .grow { flex:1 1 220px; }
.grid2 { display:grid; grid-template-columns:1fr 1fr; gap:0 16px; } @media (max-width:640px) { .grid2 { grid-template-columns:1fr; } }
.msg { padding:9px 12px; border-radius:7px; margin:10px 0; background:#e8f1fb; color:#0a3d70; font-size:15px; }
.msg.error { background:#fdeceb; color:var(--bad); } .msg.ok { background:#e6f4ea; color:var(--good); } .msg.warn { background:#fff4d6; color:var(--warn); }
.msg[hidden] { display:none; }
table { width:100%; border-collapse:collapse; font-size:14.5px; }
th, td { text-align:left; padding:6px 8px; border-bottom:1px solid var(--line); vertical-align:middle; }
th { background:#f0f3f7; font-size:13px; text-transform:uppercase; letter-spacing:.03em; color:var(--muted); position:sticky; top:0; }
td.num, th.num { text-align:right; font-variant-numeric:tabular-nums; }
td input { padding:5px 7px; } td input.rate { width:90px; text-align:right; } td input.unit { width:64px; } td input.code { width:120px; }
.tablewrap { max-height:520px; overflow:auto; border:1px solid var(--line); border-radius:8px; }
tr.flag td { background:#fff8e6; } tr.off td { color:#9aa5b1; }
.pdfview { max-height:640px; overflow:auto; background:#e5e9ee; padding:12px; border-radius:8px; border:1px solid var(--line); }
canvas.pdfpage { display:block; max-width:100%; height:auto; margin:0 auto 12px; background:#fff; box-shadow:0 1px 4px rgba(0,0,0,.25); }
.signin { max-width:420px; margin:8vh auto; }
.kv { display:grid; grid-template-columns:170px 1fr; gap:6px 12px; font-size:15px; } .kv dt { color:var(--muted); } .kv dd { margin:0; }
.bar { height:10px; background:#e3e8ee; border-radius:6px; overflow:hidden; max-width:320px; } .bar > span { display:block; height:100%; background:var(--brand); }
code.invite { font-size:20px; letter-spacing:.08em; background:#f0f3f7; padding:4px 10px; border-radius:6px; }
.logo { max-width:180px; max-height:90px; border:1px solid var(--line); border-radius:6px; padding:4px; background:#fff; }
.spinner { color:var(--muted); }

.mt { margin-top:16px; }