* { box-sizing: border-box; }
body { margin:0; font-family: -apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif; font-size:14px; color:#1d2733; background:#f4f6f9; }
a { color:#1769d3; text-decoration:none; } a:hover { text-decoration:underline; }
.topbar { display:flex; align-items:center; gap:16px; background:#1f2c3d; color:#fff; padding:0 16px; flex-wrap:wrap; }
.brand { font-weight:700; padding:12px 0; white-space:nowrap; } .brand .dom { opacity:.5; font-weight:400; }
.mainnav { display:flex; flex-wrap:wrap; gap:2px; flex:1; }
.mainnav a { color:#c7d2de; padding:14px 11px; border-bottom:3px solid transparent; }
.mainnav a:hover { color:#fff; text-decoration:none; }
.mainnav a.on { color:#fff; border-bottom-color:#3d9bff; }
.userbox { display:flex; align-items:center; gap:10px; font-size:13px; } .userbox .u { opacity:.7; } .userbox a { color:#bcd; } .userbox .logout { color:#ff9b9b; }
.wrap { max-width:1180px; margin:18px auto; padding:0 16px; }
h1 { font-size:20px; margin:4px 0 16px; }
h2 { font-size:16px; margin:22px 0 10px; }
.flash { padding:10px 14px; border-radius:7px; margin:10px 0; }
.flash.ok { background:#e3f6e6; border:1px solid #9bd5a6; color:#1e6b32; }
.flash.err { background:#fde7e7; border:1px solid #e3a3a3; color:#a02525; }
.flash.warn { background:#fff5e0; border:1px solid #e8cf90; color:#8a6400; }
.card { background:#fff; border:1px solid #e2e8f0; border-radius:10px; padding:18px; margin-bottom:18px; }
table { width:100%; border-collapse:collapse; background:#fff; }
th,td { text-align:left; padding:8px 10px; border-bottom:1px solid #eef1f5; vertical-align:top; }
th { background:#f7f9fc; font-weight:600; font-size:12px; text-transform:uppercase; letter-spacing:.02em; color:#5a6b7e; }
tr:hover td { background:#fafcff; }
input[type=text],input[type=email],input[type=password],input[type=number],select,textarea { width:100%; padding:8px 10px; border:1px solid #cfd8e3; border-radius:7px; font:inherit; background:#fff; }
textarea { min-height:120px; font-family:ui-monospace,Menlo,Consolas,monospace; }
label.field { display:block; margin:10px 0; } label.field > span { display:block; font-size:12px; color:#5a6b7e; margin-bottom:4px; }
.row { display:flex; gap:14px; flex-wrap:wrap; } .row > * { flex:1; min-width:180px; }
.btn { display:inline-block; background:#1769d3; color:#fff; border:0; border-radius:7px; padding:9px 16px; font:inherit; cursor:pointer; }
.btn:hover { background:#1257b0; } .btn.sec { background:#eef2f7; color:#33445a; } .btn.danger { background:#d8413a; }
.btn.sm { padding:5px 10px; font-size:13px; }
.ok { color:#1e8e3e; } .err { color:#d8413a; } .warn { color:#b8860b; } .muted { color:#8696a7; }
.pager { margin:14px 0; } .pager a { padding:5px 10px; border:1px solid #d6deea; border-radius:6px; margin-right:4px; }
.pager a.cur { background:#1769d3; color:#fff; border-color:#1769d3; }
.kpis { display:flex; gap:14px; flex-wrap:wrap; }
.kpi { background:#fff; border:1px solid #e2e8f0; border-radius:10px; padding:14px 18px; min-width:120px; }
.kpi .n { font-size:26px; font-weight:700; } .kpi .l { font-size:12px; color:#5a6b7e; }
.login-wrap { max-width:380px; margin:8vh auto; }
.login-card { background:#fff; border:1px solid #e2e8f0; border-radius:12px; padding:26px; box-shadow:0 6px 24px rgba(20,40,80,.08); }
.login-card h1 { text-align:center; }
.hint { font-size:12px; color:#7a899b; } code { background:#eef2f7; padding:1px 5px; border-radius:4px; }
.tagok{background:#e3f6e6;color:#1e6b32;padding:2px 7px;border-radius:10px;font-size:12px}
.tagno{background:#fde7e7;color:#a02525;padding:2px 7px;border-radius:10px;font-size:12px}
.small{font-size:12px;color:#7a899b}
.inline{display:inline}