:root { color-scheme: light; --ink:#071713; --muted:#667a74; --line:#d9e9e5; --surface:#fff; --soft:#f2f9f7; --mint:#dff5ef; --emerald:#078f73; --emerald-dark:#056451; --danger:#b53a48; --danger-soft:#fff1f2; --shadow:0 24px 70px rgba(18,69,58,.10); font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; }
* { box-sizing:border-box; }
body { margin:0; min-height:100vh; color:var(--ink); background:#f5faf8; }
button,input,select,textarea { font:inherit; }
button,a { -webkit-tap-highlight-color:transparent; }
.hidden { display:none !important; }
.admin-ambient { position:fixed; inset:0; pointer-events:none; background:radial-gradient(circle at 82% 4%,rgba(18,185,148,.12),transparent 29%),radial-gradient(circle at 15% 96%,rgba(255,214,37,.09),transparent 24%); }
.admin-gate { position:relative; display:grid; place-items:center; align-content:center; min-height:100vh; padding:32px; text-align:center; }
.admin-gate img { width:72px; height:72px; margin-bottom:24px; border-radius:22px; box-shadow:var(--shadow); }
.admin-gate h1 { margin:6px 0 12px; font-size:clamp(32px,5vw,56px); letter-spacing:-.05em; }
.admin-gate > p:not(.eyebrow) { max-width:560px; margin:0 0 24px; color:var(--muted); line-height:1.6; }
.eyebrow { margin:0; color:var(--emerald); font-size:11px; font-weight:850; letter-spacing:.12em; }
.admin-shell { position:relative; display:grid; grid-template-columns:260px 1fr; min-height:100vh; }
.admin-sidebar { position:sticky; top:0; display:flex; flex-direction:column; height:100vh; padding:28px 20px; border-right:1px solid var(--line); background:rgba(255,255,255,.88); backdrop-filter:blur(20px); }
.admin-brand { display:flex; align-items:center; gap:12px; padding:0 8px 28px; color:var(--ink); text-decoration:none; }
.admin-brand img { width:42px; height:42px; border-radius:13px; }
.admin-brand span { display:grid; }
.admin-brand strong { font-size:20px; letter-spacing:-.04em; }
.admin-brand small { margin-top:2px; color:var(--muted); font-size:12px; }
.sidebar-close,.sidebar-backdrop { display:none; }
.admin-sidebar nav { display:grid; gap:6px; }
.admin-sidebar nav button { display:flex; align-items:center; gap:11px; width:100%; padding:13px 14px; border:0; border-radius:13px; color:#47615a; background:transparent; font-weight:720; text-align:left; cursor:pointer; }
.admin-sidebar nav button span { display:grid; place-items:center; width:25px; height:25px; border-radius:8px; background:#edf5f3; }
.admin-sidebar nav button:hover,.admin-sidebar nav button.active { color:var(--emerald-dark); background:var(--mint); }
.admin-sidebar-note { display:flex; gap:10px; margin-top:auto; padding:15px; border:1px solid var(--line); border-radius:16px; background:var(--soft); }
.status-dot { width:9px; height:9px; margin-top:4px; border-radius:50%; background:#08a880; box-shadow:0 0 0 5px rgba(8,168,128,.12); }
.admin-sidebar-note p { display:grid; gap:4px; margin:0; }
.admin-sidebar-note strong { font-size:12px; }
.admin-sidebar-note small { color:var(--muted); font-size:10px; line-height:1.45; }
.back-link { margin:18px 8px 0; color:var(--muted); font-size:12px; font-weight:700; text-decoration:none; }
.admin-main { min-width:0; padding:0 42px 70px; }
.admin-topbar { display:flex; align-items:center; min-height:96px; border-bottom:1px solid var(--line); }
.admin-topbar h1 { margin:5px 0 0; font-size:22px; letter-spacing:-.035em; }
.admin-identity { display:flex; align-items:center; gap:10px; margin-left:auto; }
.admin-identity > span,.account-avatar { display:grid; place-items:center; width:42px; height:42px; border-radius:14px; color:#fff; background:linear-gradient(145deg,#056451,#0bb991); font-weight:850; }
.admin-identity p { display:grid; gap:2px; margin:0; }
.admin-identity strong { font-size:12px; }
.admin-identity small { color:var(--muted); font-size:10px; }
.sidebar-toggle { display:none; border:0; background:transparent; font-size:24px; }
[data-view] { max-width:1360px; margin:0 auto; padding-top:34px; }
.welcome-panel { display:flex; justify-content:space-between; gap:32px; padding:32px; overflow:hidden; border:1px solid #cde7e0; border-radius:24px; background:linear-gradient(120deg,#fff 0%,#f0faf7 58%,#dcf4ed 100%); box-shadow:var(--shadow); }
.welcome-panel h2,.view-heading h2 { max-width:690px; margin:8px 0 10px; font-size:clamp(28px,4vw,42px); letter-spacing:-.05em; line-height:1.02; }
.welcome-panel > div > p:last-child,.view-heading > div > p:last-child { max-width:680px; margin:0; color:var(--muted); line-height:1.55; }
.safety-pill { align-self:center; display:flex; align-items:center; gap:12px; min-width:315px; padding:16px; border:1px solid rgba(7,143,115,.18); border-radius:17px; background:rgba(255,255,255,.72); }
.safety-pill > span { display:grid; place-items:center; width:34px; height:34px; border-radius:11px; color:#fff; background:var(--emerald); font-weight:900; }
.safety-pill p { display:grid; gap:3px; margin:0; }
.safety-pill strong { font-size:12px; }.safety-pill small { color:var(--muted); font-size:11px; }
.user-search { margin-top:24px; padding:24px; border:1px solid var(--line); border-radius:22px; background:var(--surface); }
.user-search > label { display:block; margin-bottom:10px; font-size:12px; font-weight:800; }
.user-search > div { display:grid; grid-template-columns:auto 1fr auto; align-items:center; overflow:hidden; border:1px solid #bed9d2; border-radius:14px; background:#fbfefd; }
.user-search > div > span { padding-left:16px; color:var(--emerald); font-size:20px; }
.user-search input { min-width:0; padding:15px 12px; border:0; outline:0; background:transparent; }
.user-search button,.action-card button { align-self:stretch; padding:0 22px; border:0; color:#fff; background:var(--emerald); font-weight:800; cursor:pointer; }
.user-search button:hover,.action-card button:hover,.button:hover { background:var(--emerald-dark); }
.user-search > p { margin:10px 0 0; color:var(--muted); font-size:12px; }
.search-results { display:grid; gap:10px; margin-top:12px; }
.search-result { display:flex; align-items:center; gap:13px; width:100%; padding:14px 16px; border:1px solid var(--line); border-radius:15px; background:#fff; text-align:left; cursor:pointer; }
.search-result:hover { border-color:#81cbbb; box-shadow:0 10px 30px rgba(7,143,115,.08); }
.search-result > span { display:grid; place-items:center; width:36px; height:36px; border-radius:11px; color:var(--emerald-dark); background:var(--mint); font-weight:850; }
.search-result p { display:grid; gap:3px; margin:0; }.search-result strong { font-size:13px; }.search-result small { color:var(--muted); font-size:10px; }
.search-result i { margin-left:auto; color:var(--emerald); font-style:normal; }
.account-detail { margin-top:28px; }
.account-heading { display:flex; align-items:center; gap:14px; padding:8px 2px 20px; }
.account-heading h2 { margin:5px 0 3px; font-size:24px; letter-spacing:-.04em; }.account-heading div:nth-child(2) > p:last-child { margin:0; color:var(--muted); font-family:ui-monospace,monospace; font-size:10px; }
.icon-button { margin-left:auto; width:40px; height:40px; border:1px solid var(--line); border-radius:12px; background:#fff; cursor:pointer; }
.metric-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:14px; }
.metric-grid article { display:grid; gap:7px; min-height:138px; padding:21px; border:1px solid var(--line); border-radius:19px; background:#fff; }
.metric-grid span { color:var(--muted); font-size:12px; font-weight:750; }.metric-grid strong { font-size:30px; letter-spacing:-.05em; }.metric-grid small { align-self:end; color:var(--muted); font-size:11px; line-height:1.4; }
.action-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; margin-top:14px; }
.action-card { display:grid; grid-template-columns:auto 1fr; column-gap:12px; padding:21px; border:1px solid var(--line); border-radius:19px; background:#fff; }
.action-icon { grid-row:span 2; display:grid; place-items:center; width:38px; height:38px; border-radius:12px; color:var(--emerald-dark); background:var(--mint); font-size:20px; font-weight:800; }
.action-card h3 { margin:1px 0 5px; font-size:14px; }.action-card p { grid-column:1/-1; min-height:46px; margin:12px 0; color:var(--muted); font-size:12px; line-height:1.5; }
.action-card button { grid-column:1/-1; min-height:39px; border-radius:11px; font-size:11px; }.danger-action .action-icon { color:var(--danger); background:var(--danger-soft); }.danger-action button { background:#7d343e; }
.record-grid { display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-top:14px; }
.record-panel,.table-panel { overflow:hidden; border:1px solid var(--line); border-radius:19px; background:#fff; }
.panel-heading { display:flex; align-items:center; justify-content:space-between; padding:20px 21px; border-bottom:1px solid var(--line); }.panel-heading h3 { margin:5px 0 0; font-size:16px; }.panel-heading > span { color:var(--muted); font-size:10px; }
.record-list { display:grid; max-height:380px; overflow:auto; }.record-empty { padding:35px 20px; color:var(--muted); font-size:11px; text-align:center; }
.record-item { display:grid; grid-template-columns:1fr auto; gap:8px; padding:15px 20px; border-bottom:1px solid #edf4f2; }.record-item:last-child { border-bottom:0; }.record-item strong { font-size:12px; }.record-item p { grid-column:1/-1; margin:0; color:var(--muted); font-size:11px; line-height:1.45; }.record-item small { color:var(--muted); font-size:10px; }.record-item button { border:0; color:var(--danger); background:transparent; font-size:11px; font-weight:800; cursor:pointer; }.record-status { justify-self:end; padding:4px 7px; border-radius:20px; color:var(--emerald-dark); background:var(--mint); font-size:10px; font-style:normal; font-weight:800; }.record-status.inactive { color:#7b6770; background:#f0ecee; }
.table-panel { margin-top:14px; }.table-wrap { overflow:auto; } table { width:100%; border-collapse:collapse; font-size:12px; } th,td { padding:13px 18px; border-bottom:1px solid #edf4f2; text-align:left; white-space:nowrap; } th { color:var(--muted); background:#fbfdfd; font-size:10px; letter-spacing:.08em; text-transform:uppercase; } td:last-child { max-width:340px; overflow:hidden; text-overflow:ellipsis; }.positive { color:var(--emerald); font-weight:850; }.negative { color:var(--danger); font-weight:850; }
.view-heading { display:flex; align-items:flex-end; justify-content:space-between; margin-bottom:20px; }.audit-list { display:grid; gap:10px; }.audit-item { display:grid; grid-template-columns:44px 1fr auto; gap:13px; padding:18px; border:1px solid var(--line); border-radius:16px; background:#fff; }.audit-item > span { display:grid; place-items:center; width:42px; height:42px; border-radius:13px; color:var(--emerald-dark); background:var(--mint); }.audit-item h3 { margin:0 0 6px; font-size:13px; }.audit-item p { margin:0; color:var(--muted); font-size:11px; line-height:1.5; }.audit-item time { color:var(--muted); font-size:10px; }
.button { display:inline-flex; align-items:center; justify-content:center; min-height:42px; padding:0 18px; border:0; border-radius:12px; color:#fff; background:var(--emerald); font-size:11px; font-weight:800; text-decoration:none; cursor:pointer; }.button.secondary { border:1px solid var(--line); color:var(--ink); background:#fff; }.button.danger { background:var(--danger); }.button:disabled { opacity:.55; cursor:wait; }
.admin-dialog { width:min(520px,calc(100% - 28px)); padding:0; border:1px solid var(--line); border-radius:22px; background:#fff; box-shadow:0 34px 100px rgba(6,38,31,.24); }.admin-dialog::backdrop { background:rgba(5,24,20,.42); backdrop-filter:blur(5px); }.admin-dialog form { display:grid; gap:15px; padding:25px; }.dialog-heading { display:flex; align-items:flex-start; justify-content:space-between; }.dialog-heading h2 { margin:5px 0 0; font-size:24px; letter-spacing:-.045em; }.dialog-heading button { width:34px; height:34px; border:0; border-radius:10px; background:var(--soft); font-size:22px; cursor:pointer; }.dialog-account { margin:0; padding:11px 13px; border-radius:11px; color:var(--emerald-dark); background:var(--mint); font-size:11px; font-weight:750; }.admin-dialog label { display:grid; gap:7px; font-size:11px; font-weight:800; }.admin-dialog input,.admin-dialog select,.admin-dialog textarea { width:100%; padding:12px 13px; border:1px solid #cdded9; border-radius:11px; outline:0; background:#fff; }.admin-dialog input:focus,.admin-dialog select:focus,.admin-dialog textarea:focus { border-color:var(--emerald); box-shadow:0 0 0 3px rgba(7,143,115,.1); }.form-note,.form-status { margin:0; color:var(--muted); font-size:10px; line-height:1.5; }.form-status:not(:empty) { padding:10px; border-radius:10px; color:var(--danger); background:var(--danger-soft); }.dialog-actions { display:flex; justify-content:flex-end; gap:9px; padding-top:5px; }.confirm-check { grid-template-columns:auto 1fr !important; align-items:start; padding:12px; border-radius:12px; color:#6d3038; background:var(--danger-soft); font-weight:650 !important; line-height:1.45; }.confirm-check input { width:auto; margin-top:2px; }
@media (max-width:1050px) { .admin-shell { grid-template-columns:1fr; }.admin-sidebar { position:fixed; z-index:20; width:260px; transform:translateX(-105%); transition:transform .2s ease; }.admin-sidebar.open { transform:translateX(0); box-shadow:30px 0 80px rgba(0,0,0,.16); }.sidebar-close { position:absolute; top:18px; right:14px; display:grid; place-items:center; width:36px; height:36px; border:0; border-radius:11px; background:var(--soft); font-size:22px; cursor:pointer; }.sidebar-backdrop { position:fixed; z-index:19; inset:0; display:block; border:0; background:rgba(6,31,25,.28); opacity:0; pointer-events:none; transition:opacity .2s ease; }.sidebar-backdrop.open { opacity:1; pointer-events:auto; }.sidebar-toggle { display:block; margin-right:15px; }.admin-main { padding-inline:24px; }.metric-grid { grid-template-columns:repeat(2,1fr); }.welcome-panel { display:grid; }.safety-pill { min-width:0; }.action-grid { grid-template-columns:1fr; } }
@media (max-width:700px) { .admin-main { padding:0 14px 50px; }.admin-topbar { min-height:78px; }.admin-topbar > div:nth-child(2) .eyebrow,.admin-identity p { display:none; }.admin-topbar h1 { font-size:18px; }.welcome-panel { padding:23px; }.welcome-panel h2 { font-size:30px; }.user-search { padding:16px; }.user-search > div { grid-template-columns:auto 1fr; }.user-search button { grid-column:1/-1; min-height:44px; }.metric-grid,.record-grid { grid-template-columns:1fr; }.metric-grid article { min-height:115px; }.view-heading { align-items:flex-start; gap:14px; }.view-heading h2 { font-size:32px; }.audit-item { grid-template-columns:38px 1fr; }.audit-item time { grid-column:2; }.admin-dialog form { padding:20px; } }
@media (prefers-reduced-motion:reduce) { *,*::before,*::after { scroll-behavior:auto !important; transition:none !important; animation:none !important; } }