:root { --bg:#14161a; --card:#1d2026; --fg:#e8eaed; --mut:#9aa0a6; --acc:#f2c14e; --line:#2a2e36; }
* { box-sizing: border-box; }
body { margin:0; background:#14161a; color:#e8eaed; font:14px/1.45 system-ui, "Segoe UI", sans-serif; }
a { color:#8ab4f8; text-decoration:none; }
header { display:flex; align-items:center; gap:16px; padding:10px 18px; border-bottom:1px solid #2a2e36; position:sticky; top:0; background:#14161a; z-index:5; }
header h1 { font-size:16px; margin:0 12px 0 0; color:#f2c14e; }
header a.nav { color:#9aa0a6; padding:4px 8px; border-radius:6px; }
header a.nav.on, header a.nav:hover { color:#e8eaed; background:#22262e; }
header .sp { flex:1; }
main { padding:16px 18px; max-width:1200px; margin:0 auto; }
table { border-collapse:collapse; width:100%; }
th { text-align:left; color:#9aa0a6; font-weight:500; padding:6px 10px; border-bottom:1px solid #2a2e36; }
td { padding:6px 10px; border-bottom:1px solid #22262e; vertical-align:middle; }
tr:hover td { background:#191c22; }
img.face { width:48px; height:48px; border-radius:8px; object-fit:cover; background:#22262e; display:block; }
img.face.lg { width:96px; height:96px; }
.tag { display:inline-block; padding:1px 8px; border-radius:10px; background:#22262e; color:#9aa0a6; font-size:12px; }
.unnamed { color:#f2c14e; }
.mut { color:#9aa0a6; }
button { background:#2a2e36; color:#e8eaed; border:1px solid #363b45; border-radius:6px; padding:5px 12px; cursor:pointer; }
button:hover { background:#333945; }
button.warn { border-color:#7a4b4b; }
input, select { background:#1d2026; color:#e8eaed; border:1px solid #363b45; border-radius:6px; padding:6px 9px; }
canvas.strip { background:#191c22; border-radius:4px; }
.gallery { display:flex; flex-wrap:wrap; gap:10px; margin:12px 0; }
.gallery .cell { text-align:center; }
.gallery .cell .mut { font-size:11px; }
.login-body { display:flex; align-items:center; justify-content:center; height:100vh; }
.login-box { background:#1d2026; border:1px solid #2a2e36; border-radius:12px; padding:28px; width:300px; display:flex; flex-direction:column; gap:10px; }
.login-box h1 { font-size:17px; margin:0 0 6px; color:#f2c14e; }
.err { color:#f28b82; min-height:18px; }
.row { display:flex; gap:10px; align-items:center; margin:10px 0; flex-wrap:wrap; }
h2 { font-size:15px; margin:18px 0 8px; }
.crumb { color:#9aa0a6; }
tr.clienthdr td { background:#1d2026; border-bottom:1px solid #2a2e36; padding-top:10px; }
tr.clienthdr:hover td { background:#1d2026; }