:root { --ink:#1c2330; --mut:#68738a; --line:#dde3ee; --brand:#2456d6; --bg:#f5f7fb; }
* { box-sizing:border-box; }
body { margin:0; font-family:system-ui,-apple-system,"Segoe UI",sans-serif; color:var(--ink); background:var(--bg); }
.shell { min-height:100vh; display:flex; flex-direction:column; }
header { display:flex; align-items:center; gap:1.5rem; padding:.75rem 1.5rem; background:#fff; border-bottom:1px solid var(--line); }
.brand { font-size:1.1rem; letter-spacing:.02em; }
.brand b { color:var(--brand); }
nav { display:flex; gap:1rem; }
nav a { color:var(--ink); text-decoration:none; font-size:.95rem; }
nav a:hover { color:var(--brand); }
.logout { margin-left:auto; display:flex; align-items:center; gap:.75rem; }
.user { color:var(--mut); font-size:.85rem; }
main { flex:1; padding:1.5rem; max-width:960px; width:100%; margin:0 auto; }
footer { padding:.75rem 1.5rem; color:var(--mut); font-size:.8rem; border-top:1px solid var(--line); }
h1 { font-size:1.4rem; } h2 { font-size:1.15rem; }
table { width:100%; border-collapse:collapse; background:#fff; border:1px solid var(--line); border-radius:8px; overflow:hidden; }
th, td { text-align:left; padding:.55rem .8rem; border-bottom:1px solid var(--line); font-size:.92rem; }
th { background:#fafbfe; color:var(--mut); font-weight:600; }
tr:last-child td { border-bottom:none; }
a { color:var(--brand); }
.card { background:#fff; border:1px solid var(--line); border-radius:8px; padding:1.25rem; margin-bottom:1rem; }
label { display:block; margin:.6rem 0 .25rem; font-size:.9rem; color:var(--mut); }
input, select, textarea { width:100%; padding:.5rem .6rem; border:1px solid var(--line); border-radius:6px; font:inherit; }
textarea { min-height:110px; }
button { background:var(--brand); color:#fff; border:none; border-radius:6px; padding:.5rem 1rem; font:inherit; cursor:pointer; }
button:hover { filter:brightness(1.08); }
button.ghost { background:#fff; color:var(--ink); border:1px solid var(--line); }
.error { color:#b3261e; font-size:.9rem; margin:.5rem 0; }
.ok { color:#1a7f37; font-size:.9rem; margin:.5rem 0; }
.badge { display:inline-block; padding:.1rem .55rem; border-radius:99px; font-size:.78rem; background:#e8edf9; color:var(--brand); }
.badge.warn { background:#fdeed8; color:#9a6700; }
.badge.ok { background:#e2f5e8; color:#1a7f37; }
.badge.mut { background:#eef0f5; color:var(--mut); }
.msg { border:1px solid var(--line); border-radius:8px; padding:.7rem .9rem; margin:.5rem 0; background:#fff; }
.msg.staff { border-left:3px solid var(--brand); }
.msg .meta { color:var(--mut); font-size:.8rem; margin-bottom:.3rem; }
.login-box { max-width:380px; margin:8vh auto; }
.actions { display:flex; gap:.6rem; margin-top:.8rem; }