/* Shared styles for the login page and admin panel (brand tokens mirror the course). */
:root {
  --g-ink:#1c1c1e; --g-sub:#6b6b70; --g-faint:#9a9aa0;
  --g-app:#f4f4f6; --g-panel:#fff; --g-panel-sub:#fbfbfc;
  --g-line:#e6e6ea; --g-line-soft:#ececef;
  --g-accent:#d75649; --g-accent-dk:#b8453a; --g-accent-soft:#fceae7;
  --g-ok:#1f7a4d; --g-ok-soft:#e4f3ea; --g-warn:#b85c0a; --g-warn-soft:#fbeede;
  --g-danger:#b3261e; --g-danger-soft:#fbe6e4; --g-blue:#2a5db0; --g-blue-soft:#e5edf9;
  --r-md:8px; --r-lg:10px; --r-xl:12px; --r-pill:999px;
  --shadow-pop:0 8px 28px rgba(20,20,30,.14);
}
@media (prefers-color-scheme: dark){ :root:not([data-theme="light"]){
  --g-ink:#f3f3f5; --g-sub:#a6a6ad; --g-faint:#76767d;
  --g-app:#0f0f12; --g-panel:#18181c; --g-panel-sub:#1d1d22;
  --g-line:#2b2b31; --g-line-soft:#26262b;
  --g-accent:#ec6d60; --g-accent-dk:#d75649; --g-accent-soft:#3a211e;
  --g-ok:#4cc08a; --g-ok-soft:#16281f; --g-warn:#e6962f; --g-warn-soft:#2c2113;
  --g-danger:#f0776e; --g-danger-soft:#2e1715; --g-blue:#6a9bea; --g-blue-soft:#16203a;
  --shadow-pop:0 10px 34px rgba(0,0,0,.55);
}}
*{box-sizing:border-box;}
body{margin:0;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;background:var(--g-app);color:var(--g-ink);font-size:15px;line-height:1.5;-webkit-font-smoothing:antialiased;}
a{color:var(--g-accent);}
h1,h2,h3{margin:0 0 .4em;line-height:1.25;}
.logo{width:34px;height:34px;border-radius:8px;background:var(--g-accent);color:#fff;display:grid;place-items:center;font-weight:800;}
.btn{appearance:none;border:1px solid var(--g-accent);background:var(--g-accent);color:#fff;border-radius:var(--r-md);padding:10px 18px;font-size:14px;font-weight:650;cursor:pointer;}
.btn:hover{background:var(--g-accent-dk);}
.btn:disabled{opacity:.6;cursor:default;}
.btn.secondary{background:var(--g-panel);color:var(--g-ink);border-color:var(--g-line);}
.btn.secondary:hover{border-color:var(--g-accent);}
.btn.ghost{background:transparent;border-color:transparent;color:var(--g-accent-dk);padding:6px 10px;}
.btn.danger{background:var(--g-panel);color:var(--g-danger);border-color:var(--g-line);}
.btn.danger:hover{border-color:var(--g-danger);}
.btn.sm{padding:6px 12px;font-size:13px;}
input,select{font-size:15px;padding:10px 12px;border:1px solid var(--g-line);border-radius:var(--r-md);background:var(--g-panel);color:var(--g-ink);width:100%;}
input:focus,select:focus{outline:2px solid var(--g-accent-soft);border-color:var(--g-accent);}
label{display:block;font-size:12.5px;font-weight:650;color:var(--g-sub);margin-bottom:5px;}
.field{margin-bottom:14px;}
.muted{color:var(--g-sub);} .small{font-size:13px;} .tiny{font-size:11.5px;}
.pill{display:inline-flex;align-items:center;gap:5px;padding:2px 10px;border-radius:var(--r-pill);font-size:12px;font-weight:650;white-space:nowrap;}
.pill.green{background:var(--g-ok-soft);color:var(--g-ok);}
.pill.amber{background:var(--g-warn-soft);color:var(--g-warn);}
.pill.red{background:var(--g-danger-soft);color:var(--g-danger);}
.pill.blue{background:var(--g-blue-soft);color:var(--g-blue);}
.pill.neutral{background:var(--g-line);color:var(--g-sub);}
.pill.dot::before{content:"";width:7px;height:7px;border-radius:50%;background:currentColor;}
.notice{border:1px solid var(--g-line);border-left-width:4px;border-radius:var(--r-md);padding:10px 14px;margin:12px 0;font-size:13.5px;background:var(--g-panel-sub);}
.notice.err{border-left-color:var(--g-danger);background:var(--g-danger-soft);color:var(--g-danger);}
.notice.ok{border-left-color:var(--g-ok);background:var(--g-ok-soft);color:var(--g-ok);}
.notice.warn{border-left-color:var(--g-warn);background:var(--g-warn-soft);}
.hidden{display:none !important;}

/* ---------- login ---------- */
.login-wrap{min-height:100vh;display:grid;place-items:center;padding:24px;}
.login-card{width:100%;max-width:380px;background:var(--g-panel);border:1px solid var(--g-line);border-radius:var(--r-xl);padding:28px;box-shadow:var(--shadow-pop);}
.login-card .brand{display:flex;align-items:center;gap:10px;margin-bottom:18px;}
.login-card .brand b{font-weight:750;}
.login-card .brand small{display:block;color:var(--g-sub);font-weight:500;font-size:12px;}

/* ---------- admin ---------- */
.topbar{position:sticky;top:0;z-index:10;display:flex;align-items:center;gap:14px;padding:12px 22px;background:var(--g-panel);border-bottom:1px solid var(--g-line);}
.topbar .brand{display:flex;align-items:center;gap:10px;font-weight:700;}
.topbar .brand small{display:block;font-weight:500;font-size:11px;color:var(--g-sub);}
.topbar .spacer{flex:1;}
.wrap{max-width:1040px;margin:0 auto;padding:24px 22px 80px;}
.statrow{display:flex;flex-wrap:wrap;gap:14px;margin:0 0 20px;}
.stat{flex:1 1 150px;background:var(--g-panel);border:1px solid var(--g-line);border-radius:var(--r-lg);padding:14px 16px;}
.stat .n{font-size:26px;font-weight:750;font-variant-numeric:tabular-nums;}
.stat .k{font-size:12.5px;color:var(--g-sub);}
.card{background:var(--g-panel);border:1px solid var(--g-line);border-radius:var(--r-lg);padding:18px;margin:16px 0;}
.row{display:flex;flex-wrap:wrap;gap:12px;align-items:flex-end;}
.row .field{flex:1 1 180px;margin-bottom:0;}
.tbl-wrap{overflow-x:auto;border:1px solid var(--g-line);border-radius:var(--r-lg);}
table{width:100%;border-collapse:collapse;font-size:13.5px;min-width:720px;}
th,td{text-align:left;padding:11px 14px;border-bottom:1px solid var(--g-line-soft);vertical-align:middle;}
th{background:var(--g-panel-sub);font-size:11.5px;text-transform:uppercase;letter-spacing:.03em;color:var(--g-sub);}
tr:last-child td{border-bottom:0;}
.bar{width:92px;height:8px;background:var(--g-line);border-radius:var(--r-pill);overflow:hidden;display:inline-block;vertical-align:middle;}
.bar>i{display:block;height:100%;background:var(--g-ok);}
.rowacts{display:flex;gap:6px;flex-wrap:wrap;}
.modal-scrim{position:fixed;inset:0;background:rgba(0,0,0,.45);display:grid;place-items:center;padding:20px;z-index:50;}
.modal{background:var(--g-panel);border:1px solid var(--g-line);border-radius:var(--r-xl);padding:22px;max-width:440px;width:100%;box-shadow:var(--shadow-pop);}
.modal h3{margin-top:0;}
.cred{font-family:ui-monospace,monospace;background:var(--g-panel-sub);border:1px solid var(--g-line);border-radius:var(--r-md);padding:10px 12px;font-size:14px;word-break:break-all;}
@media (max-width:620px){ .wrap{padding:16px;} .topbar{padding:12px 16px;} }