:root{
  --bg:#ffffff; --text:#0b1220; --muted:#667085; --accent:#1e88e5; --card:#f6f8fb; --border:#e5e7eb;
}
*{box-sizing:border-box} html,body{margin:0;padding:0;font-family:Inter,system-ui,Segoe UI,Arial,sans-serif;color:var(--text);background:var(--bg)}
.container{width:min(100%,1000px);margin-inline:auto;padding:24px}
.container.narrow{width:min(100%,520px)}
.muted{color:var(--muted)} .tiny{font-size:.9rem}
.mono{font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace}

h1{font-size:1.6rem;margin:.2rem 0 1rem}
h2{font-size:1.2rem;margin:0 0 .8rem}

.card{background:var(--card);border:1px solid var(--border);border-radius:14px;padding:16px;margin:16px 0}
.table-wrap{overflow:auto}
.table{width:100%;border-collapse:collapse}
.table th,.table td{border-bottom:1px solid var(--border);padding:10px;text-align:left}

label{display:block;margin-bottom:12px}
input[type=text],input[type=password],input[type=file]{width:100%;padding:10px;border:1px solid var(--border);border-radius:10px;background:#fff}
button.btn{background:var(--accent);color:#fff;border:none;padding:10px 14px;border-radius:10px;cursor:pointer}
.btn.ghost{background:transparent;color:var(--accent);border:1px solid var(--accent)}
.btn.tiny{padding:6px 10px;border-radius:8px;font-size:.9rem}
.row{display:flex;gap:8px;align-items:center}
.grid{display:grid;gap:12px}
.alert{padding:10px 12px;border-radius:10px;margin:12px 0}
.alert.success{background:#e7f8ef;color:#1a7f45}
.alert.danger{background:#fde8e8;color:#b91c1c}
.topbar{position:sticky;top:0;background:#fff;border-bottom:1px solid var(--border);z-index:10}
.topbar .container{display:flex;align-items:center;justify-content:space-between}
.hint{font-size:.9rem}