:root{
  --font-body:"Aptos","Segoe UI Variable Text","Trebuchet MS",sans-serif;
  --font-display:"Aptos Display","Segoe UI Variable Display","Gill Sans",sans-serif;
  --bg:#f7f8f2;
  --bg-elev:#ffffff;
  --bg-soft:rgba(255,255,255,.82);
  --surface:#ffffff;
  --surface-2:#f4f7ec;
  --text:#162317;
  --muted:#5f6c60;
  --line:rgba(22,35,23,.10);
  --primary:#089318;
  --primary-2:#056f12;
  --accent:#ffb400;
  --accent-2:#ffd76a;
  --success:#089318;
  --warning:#ffb400;
  --danger:#ff0000;
  --shadow:0 30px 80px rgba(18,40,22,.12);
  --shadow-soft:0 12px 30px rgba(18,40,22,.09);
  --radius:24px;
  --radius-sm:16px;
}

html[data-theme="dark"]{
  --bg:#07110a;
  --bg-elev:#0b1710;
  --bg-soft:rgba(10,18,12,.94);
  --surface:#0d1811;
  --surface-2:#132016;
  --text:#edf5ec;
  --muted:#9cb0a0;
  --line:rgba(213,232,210,.10);
  --primary:#24cb3d;
  --primary-2:#0ea724;
  --accent:#ffb400;
  --accent-2:#ffd76a;
  --success:#34d24d;
  --warning:#ffb400;
  --danger:#ff5252;
  --shadow:0 30px 80px rgba(0,0,0,.58);
  --shadow-soft:0 12px 30px rgba(0,0,0,.34);
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
html,body{overflow-x:hidden}
body{
  margin:0;
  min-height:100vh;
  background:
    radial-gradient(circle at top left, rgba(8,147,24,.16), transparent 24%),
    radial-gradient(circle at top right, rgba(255,180,0,.15), transparent 24%),
    radial-gradient(circle at bottom right, rgba(255,0,0,.10), transparent 28%),
    var(--bg);
  color:var(--text);
  font:16px/1.55 var(--font-body);
}
html[data-theme="dark"] body{
  background:
    radial-gradient(circle at top left, rgba(36,203,61,.08), transparent 24%),
    radial-gradient(circle at top right, rgba(255,180,0,.10), transparent 26%),
    radial-gradient(circle at bottom right, rgba(255,82,82,.08), transparent 28%),
    linear-gradient(180deg, #07110a 0%, #0b1710 100%);
}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}
button,.btn{
  appearance:none;
  border:1px solid var(--line);
  background:var(--bg-soft);
  color:var(--text);
  border-radius:999px;
  min-height:46px;
  padding:12px 18px;
  font:700 14px/1 var(--font-body);
  cursor:pointer;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  transition:transform .18s ease, border-color .18s ease, background .18s ease, opacity .18s ease;
  backdrop-filter:blur(18px);
}
button:hover,.btn:hover{transform:translateY(-1px);border-color:rgba(8,147,24,.35)}
.btn.primary,button.primary{background:linear-gradient(135deg,var(--primary),var(--primary-2));color:#fff;border-color:transparent;box-shadow:var(--shadow-soft)}
.btn.danger,button.danger{background:rgba(209,61,67,.12);color:var(--danger);border-color:rgba(209,61,67,.22)}
.btn.small{min-height:38px;padding:9px 14px;font-size:13px}
.is-loading{opacity:.7;pointer-events:none}

.ambient{
  position:fixed;
  inset:auto;
  border-radius:999px;
  filter:blur(50px);
  pointer-events:none;
  z-index:0;
}
.ambient-a{width:280px;height:280px;top:-70px;right:-60px;background:rgba(8,147,24,.16)}
.ambient-b{width:240px;height:240px;bottom:12%;left:-80px;background:rgba(255,180,0,.12)}
.ambient-c{width:320px;height:320px;top:32%;right:-110px;background:rgba(255,0,0,.12)}

.auth-shell,.admin-shell,.topbar,.container,.admin-main,.auth-stage{position:relative;z-index:1}
.topbar{
  position:sticky;top:0;z-index:10;
  display:flex;align-items:center;justify-content:space-between;gap:16px;
  padding:16px 20px;
  background:var(--bg-soft);
  border-bottom:1px solid var(--line);
  backdrop-filter:blur(22px);
}
.topbar nav,.actions,.admin-head-actions,.admin-head-main{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.brand{display:inline-flex;align-items:center;gap:12px;font-weight:800;font-family:var(--font-display);letter-spacing:.01em}
.brand-copy{
  display:grid;
  gap:2px;
  min-width:0;
}
.brand-copy strong,
.brand-copy small{
  overflow-wrap:anywhere;
}
.brand-copy small{
  color:var(--muted);
  font-size:12px;
  font-weight:700;
}
.brand-mark{
  width:40px;height:40px;border-radius:14px;display:grid;place-items:center;
  background:linear-gradient(135deg,var(--primary),var(--accent));color:#fff;box-shadow:var(--shadow-soft)
}
.brand-mark.has-logo{
  padding:0;
  overflow:hidden;
  background:rgba(255,255,255,.92);
}
.brand-mark.has-logo img{
  width:100%;
  height:100%;
  object-fit:contain;
  display:block;
}
.brand-mark-lg{
  width:54px;
  height:54px;
  border-radius:18px;
  flex:0 0 54px;
}
.brand-mark-md{
  width:64px;
  height:64px;
  border-radius:20px;
  flex:0 0 64px;
}
.brand-mark-xl{
  width:264px;
  height:264px;
  border-radius:52px;
  flex:0 0 264px;
  margin:0 auto;
  box-shadow:0 34px 88px rgba(0,0,0,.32);
}
.brand-mark-hero{
  width:232px;
  height:232px;
  border-radius:48px;
  flex:0 0 232px;
  box-shadow:0 32px 80px rgba(0,0,0,.28);
}
.auth-brand{
  display:flex;
  align-items:center;
  gap:16px;
  margin-bottom:16px;
}

.container{width:min(1180px,100%);margin:0 auto;padding:28px 16px 56px}
.auth-stage{
  min-height:100vh;
  width:min(1160px,100%);
  margin:0 auto;
  padding:28px 16px;
  display:grid;
  gap:22px;
  align-items:center;
}
.auth-intro,.hero,.card,.stat,.auth-card{
  background:var(--bg-soft);
  border:1px solid var(--line);
  box-shadow:var(--shadow);
  backdrop-filter:blur(22px);
}
.auth-intro,.hero{
  border-radius:32px;
  padding:28px;
  overflow:hidden;
}
.auth-intro{
  background:
    linear-gradient(145deg, rgba(8,147,24,.98), rgba(255,180,0,.88)),
    var(--surface);
  color:#fff;
}
.auth-card{
  border-radius:28px;
  padding:28px;
  max-width:460px;
  justify-self:end;
}
.hero-saas,.hero-admin{
  background:
    linear-gradient(145deg, rgba(8,147,24,.98), rgba(255,180,0,.86)),
    var(--surface);
  color:#fff;
}
.hero-admin{
  background:
    linear-gradient(145deg, rgba(8,17,10,.97), rgba(255,0,0,.74)),
    var(--surface);
}

h1,h2,h3{margin:0 0 12px;font-family:var(--font-display);line-height:1.06;letter-spacing:0}
h1{font-size:clamp(2rem,5vw,3.65rem)}
h2{font-size:clamp(1.4rem,3.2vw,2rem)}
p{margin:0 0 12px}
.muted{color:var(--muted)}
.compact{margin:2px 0 0}
.eyebrow{
  display:inline-flex;
  margin-bottom:14px;
  padding:7px 12px;
  border-radius:999px;
  background:rgba(255,255,255,.14);
  border:1px solid rgba(255,255,255,.18);
  font-size:12px;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.08em;
}

.card,.stat{
  border-radius:var(--radius);
  padding:22px;
}
html[data-theme="dark"] .card,
html[data-theme="dark"] .stat,
html[data-theme="dark"] .auth-card{
  background:rgba(13,24,17,.92);
}
.card-feature{position:relative;overflow:hidden}
.card-feature::after{
  content:"";
  position:absolute;inset:auto -20% -38% auto;
  width:180px;height:180px;border-radius:50%;
  background:radial-gradient(circle, rgba(255,228,137,.25), transparent 60%);
}
.grid,.record-grid,.stats{display:grid;grid-template-columns:1fr;gap:16px}
.stats .stat strong{font-size:2rem;font-family:var(--font-display)}
.timeline-note,.notice-panel{
  margin-top:14px;
  padding:14px 16px;
  border-radius:18px;
  background:var(--surface-2);
  border:1px solid var(--line);
}
.notice-panel.success{background:rgba(8,147,24,.10)}
.info-banner{
  padding:14px 16px;
  border-radius:20px;
  background:rgba(8,147,24,.08);
  border:1px solid rgba(8,147,24,.18);
}
.page-head,.section-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:14px;
  margin-bottom:18px;
  flex-wrap:wrap;
}
.summary-line{
  color:var(--muted);
  font-weight:600;
}
.eyebrow.subtle{
  background:rgba(8,147,24,.10);
  border-color:rgba(8,147,24,.14);
  color:var(--primary);
}
.data-grid{
  display:grid;
  grid-template-columns:1fr;
  gap:14px;
}
.data-grid-compact{margin-top:16px}
.data-item{
  min-width:0;
  padding:15px 16px;
  border-radius:18px;
  border:1px solid var(--line);
  background:rgba(255,255,255,.54);
}
html[data-theme="dark"] .data-item{background:rgba(13,24,17,.92)}
.data-item-highlight{
  background:rgba(8,147,24,.08);
  border-color:rgba(8,147,24,.16);
}
html[data-theme="dark"] .data-item-highlight{
  background:rgba(78,211,130,.10);
  border-color:rgba(78,211,130,.18);
}
.data-label{
  display:block;
  margin-bottom:8px;
  color:var(--muted);
  font-size:12px;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.06em;
}
.data-value{
  display:block;
  font-size:1rem;
  line-height:1.4;
  word-break:break-word;
}
.fee-field{
  padding:14px 16px;
  border-radius:20px;
  background:rgba(8,147,24,.10);
  border:1px solid rgba(8,147,24,.24);
  color:var(--success);
}
.fee-field input{
  border-color:rgba(8,147,24,.24);
  background:rgba(255,255,255,.92);
}
html[data-theme="dark"] .fee-field{
  background:rgba(36,203,61,.12);
  border-color:rgba(36,203,61,.28);
  color:var(--success);
}
html[data-theme="dark"] .fee-field input{
  background:rgba(13,24,17,.96);
  border-color:rgba(36,203,61,.24);
}
.fee-value{
  color:var(--success);
  font-weight:800;
}
.mono-link{
  display:block;
  font-family:ui-monospace,SFMono-Regular,Menlo,monospace;
  word-break:break-all;
  color:var(--primary-2);
}

.form{display:grid;gap:14px}
.grid-2{grid-template-columns:1fr}
.form label{display:grid;gap:8px;font-weight:700}
.form input,.form select,.form textarea,.filters input,.filters select{
  width:100%;
  min-height:48px;
  padding:13px 14px;
  color:var(--text);
  border:1px solid var(--line);
  border-radius:16px;
  background:rgba(255,255,255,.78);
  font:inherit;
  outline:none;
  transition:border-color .18s ease, box-shadow .18s ease, background .18s ease;
}
html[data-theme="dark"] .form input,
html[data-theme="dark"] .form select,
html[data-theme="dark"] .form textarea,
html[data-theme="dark"] .filters input,
html[data-theme="dark"] .filters select{background:rgba(13,24,17,.96)}
.form input:focus,.form select:focus,.form textarea:focus,.filters input:focus,.filters select:focus{
  border-color:rgba(8,147,24,.55);
  box-shadow:0 0 0 4px rgba(8,147,24,.12);
}
.span{grid-column:1/-1}
.error{color:var(--danger);font-size:13px}

.alert{
  margin:0 0 16px;
  padding:14px 16px;
  border-radius:18px;
  border:1px solid var(--line);
  background:var(--bg-soft);
}
.alert.success{color:var(--success);background:rgba(8,147,24,.10)}
.alert.danger{color:var(--danger);background:rgba(209,61,67,.10)}

.badge{
  display:inline-flex;align-items:center;justify-content:center;
  min-height:28px;padding:5px 10px;border-radius:999px;
  font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.04em;
  background:rgba(8,147,24,.12);color:var(--primary-2)
}
.status-draft{background:rgba(255,180,0,.14);color:#9b6b00}
.status-pending_admin_validation{background:rgba(255,180,0,.16);color:#9b6b00}
.status-matricule_generated{background:rgba(8,147,24,.14);color:var(--primary)}
.status-completed{background:rgba(8,147,24,.12);color:var(--success)}
.status-locked,.status-archived{background:rgba(255,0,0,.10);color:var(--danger)}

.stepper{
  display:flex;gap:10px;overflow:auto;padding:6px 0 14px;
}
.stepper span{
  flex:0 0 auto;
  padding:9px 14px;
  border-radius:999px;
  border:1px solid var(--line);
  background:var(--bg-soft);
  color:var(--muted);
  font-weight:700;
}
.stepper .active{
  color:#fff;
  background:linear-gradient(135deg,var(--primary),var(--primary-2));
  border-color:transparent;
}

.qr-card img{
  width:min(330px,100%);
  padding:12px;
  border-radius:24px;
  background:#fff;
  box-shadow:var(--shadow-soft);
}
.details{display:grid;grid-template-columns:110px 1fr;gap:10px}
.details dt{color:var(--muted);font-weight:800}
.details dd{margin:0}

.admin-shell{display:grid;grid-template-columns:1fr}
.sidebar-backdrop{
  position:fixed;inset:0;
  background:rgba(3,8,16,.55);
  opacity:0;pointer-events:none;
  transition:opacity .22s ease;
  z-index:19;
}
.sidebar{
  position:fixed;top:0;left:0;bottom:0;z-index:20;
  width:min(86vw,320px);
  max-width:100%;
  display:flex;flex-direction:column;gap:18px;
  padding:18px 16px;
  background:linear-gradient(180deg, rgba(7,17,10,.98), rgba(13,24,17,.97));
  border-right:1px solid rgba(255,255,255,.08);
  box-shadow:0 20px 60px rgba(0,0,0,.42);
  transform:translateX(-102%);
  transition:transform .24s ease;
}
.sidebar-head{
  display:block;
}
.sidebar-brand{
  display:flex;
  align-items:center;
  justify-content:center;
  min-width:0;
  width:100%;
  padding:6px 0 4px;
}
.sidebar-brand .brand-mark.has-logo img,
.auth-brand .brand-mark.has-logo img{
  transform:scale(1);
  transform-origin:center;
}
.sidebar-close,.sidebar-toggle{
  width:46px;height:46px;padding:0;border-radius:14px;
}
.sidebar-close{
  display:none;
  background:rgba(255,255,255,.05);
  border-color:rgba(255,255,255,.08);
  color:#fff;
  position:relative;
}
.sidebar-close span{
  position:absolute;left:13px;right:13px;top:22px;height:2px;background:currentColor;border-radius:99px;
}
.sidebar-close span:first-child{transform:rotate(45deg)}
.sidebar-close span:last-child{transform:rotate(-45deg)}
.sidebar-close span:nth-child(2){display:none}
.sidebar-toggle{
  background:var(--bg-soft);
  border-color:var(--line);
  position:relative;
}
.sidebar-toggle span{
  position:absolute;left:12px;right:12px;height:2px;background:currentColor;border-radius:99px;
}
.sidebar-toggle span:nth-child(1){top:14px}
.sidebar-toggle span:nth-child(2){top:22px}
.sidebar-toggle span:nth-child(3){top:30px}
.sidebar-panel{
  padding:14px;
  border-radius:22px;
  background:rgba(255,255,255,.035);
  border:1px solid rgba(255,255,255,.06);
}
.sidebar-label{
  display:block;
  margin-bottom:12px;
  color:#c9d7cb;
  font-size:12px;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.08em;
}
.sidebar-nav{display:grid;gap:8px}
.sidebar-link{
  display:flex;align-items:center;gap:12px;
  min-height:48px;
  padding:12px 14px;
  border-radius:16px;
  color:#e8f0ff;
  border:1px solid transparent;
  transition:background .18s ease, border-color .18s ease, transform .18s ease;
}
.sidebar-link:hover{
  background:rgba(255,255,255,.05);
  border-color:rgba(255,255,255,.07);
}
.sidebar-link.active{
  background:linear-gradient(135deg, rgba(8,147,24,.16), rgba(255,180,0,.16));
  border-color:rgba(255,180,0,.22);
  transform:translateX(2px);
}
.sidebar-icon{
  width:18px;height:18px;display:inline-flex;align-items:center;justify-content:center;flex:0 0 18px;
}
.sidebar-icon svg{
  width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round;
}
.sidebar-user{
  display:flex;align-items:center;gap:12px;
  margin-bottom:14px;
}
.sidebar-avatar{
  width:42px;height:42px;border-radius:14px;display:grid;place-items:center;
  background:linear-gradient(135deg,var(--primary),var(--accent));
  color:#fff;font-weight:800;
}
.sidebar-logout{
  width:100%;
  background:rgba(255,255,255,.06);
  color:#f1f6ff;
  border-color:rgba(255,255,255,.08);
}
.admin-main{padding:22px 16px 56px}
.admin-main,.container,.card,.stat,.hero,.auth-card,.sidebar-panel,.topbar,.page-head,.section-head{min-width:0}
.admin-head{display:flex;justify-content:space-between;gap:16px;align-items:flex-start;margin-bottom:16px}
.admin-head-main{min-width:0;flex:1 1 auto}
.admin-head-main > div{min-width:0}
.admin-head-brand{
  display:flex;
  align-items:center;
  gap:14px;
  min-width:0;
}
.admin-head-brand > div{
  min-width:0;
}
.admin-head-main strong,
.admin-head-main p,
.page-head h1,
.section-head h2,
.card h2,
.card h1,
.hero h1{overflow-wrap:anywhere}
body.sidebar-open .sidebar{transform:translateX(0)}
body.sidebar-open .sidebar-backdrop{opacity:1;pointer-events:auto}

.table-wrap{
  overflow:auto;
  border-radius:20px;
  border:1px solid var(--line);
  background:rgba(255,255,255,.48);
  width:100%;
}
html[data-theme="dark"] .table-wrap{background:rgba(13,24,17,.94)}
table{width:100%;border-collapse:separate;border-spacing:0;min-width:680px}
th,td{padding:14px 16px;text-align:left;border-bottom:1px solid var(--line);vertical-align:top}
th{font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}

.filters{display:grid;gap:10px;grid-template-columns:1fr}
.theme-toggle{
  width:46px;height:46px;padding:0;border-radius:16px;
}
.theme-toggle.floating{position:fixed;right:16px;bottom:16px;z-index:20}

.topbar nav{
  justify-content:flex-end;
}
.topbar nav a,
.topbar nav form,
.topbar nav button{
  flex:0 0 auto;
}
.actions{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
}
.actions form{display:inline-flex}
.actions .btn,
.actions button{max-width:100%}
.branding-preview{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(160px,1fr));
  gap:12px;
}
.branding-tile{
  padding:14px;
  border-radius:18px;
  border:1px solid var(--line);
  background:rgba(255,255,255,.56);
}
html[data-theme="dark"] .branding-tile{
  background:rgba(13,24,17,.92);
}
.branding-tile img{
  width:72px;
  height:72px;
  object-fit:contain;
  border-radius:16px;
  background:#fff;
  padding:8px;
}
.kpi-grid{
  display:grid;
  grid-template-columns:1fr;
  gap:16px;
  margin-bottom:18px;
}
.kpi-card{
  position:relative;
  overflow:hidden;
}
.kpi-card::before{
  content:"";
  position:absolute;
  inset:0 auto 0 0;
  width:5px;
  background:var(--primary);
}
.kpi-card.tone-yellow::before{background:var(--accent)}
.kpi-card.tone-red::before{background:var(--danger)}
.kpi-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-bottom:14px;
}
.kpi-icon{
  width:48px;
  height:48px;
  display:grid;
  place-items:center;
  border-radius:16px;
  background:rgba(8,147,24,.10);
  color:var(--primary);
  flex:0 0 48px;
}
.tone-yellow .kpi-icon{background:rgba(255,180,0,.14);color:#9b6b00}
.tone-red .kpi-icon{background:rgba(255,0,0,.10);color:var(--danger)}
.kpi-icon svg{
  width:22px;
  height:22px;
  stroke:currentColor;
  fill:none;
  stroke-width:1.9;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.kpi-card strong{
  font-size:2rem;
  font-family:var(--font-display);
}
.analytics-grid{
  display:grid;
  grid-template-columns:1fr;
  gap:16px;
  margin-bottom:18px;
}
.meter-list{
  display:grid;
  gap:14px;
}
.meter-row{
  display:grid;
  gap:8px;
}
.meter-meta{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  flex-wrap:wrap;
}
.meter{
  height:12px;
  border-radius:999px;
  background:rgba(8,147,24,.10);
  overflow:hidden;
}
.meter-fill{
  display:block;
  height:100%;
  border-radius:999px;
  background:var(--primary);
}
.meter-fill.tone-yellow{background:var(--accent)}
.meter-fill.tone-red{background:var(--danger)}
.shortcut-grid{
  display:grid;
  grid-template-columns:1fr;
  gap:12px;
}
.shortcut-card{
  padding:16px;
  border-radius:18px;
  border:1px solid var(--line);
  background:rgba(255,255,255,.56);
  transition:transform .18s ease,border-color .18s ease,background .18s ease;
}
html[data-theme="dark"] .shortcut-card{
  background:rgba(13,24,17,.92);
}
.shortcut-card:hover{
  transform:translateY(-2px);
  border-color:rgba(8,147,24,.24);
}
.shortcut-card span{
  display:block;
  margin-bottom:6px;
  color:var(--muted);
  font-size:12px;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.06em;
}
.log-detail-cell{
  min-width:260px;
  max-width:420px;
  white-space:normal;
  word-break:break-word;
}
.logs-table{
  table-layout:fixed;
  min-width:0;
}
.logs-table th,
.logs-table td{
  overflow-wrap:anywhere;
}
.logs-table th:nth-child(1),
.logs-table td:nth-child(1){width:120px}
.logs-table th:nth-child(2),
.logs-table td:nth-child(2){width:180px}
.logs-table th:nth-child(3),
.logs-table td:nth-child(3){width:90px}
.logs-table th:nth-child(4),
.logs-table td:nth-child(4){width:120px}
.logs-table th:nth-child(5),
.logs-table td:nth-child(5){width:96px}
.logs-table th:nth-child(6),
.logs-table td:nth-child(6){width:110px}
.logs-table th:nth-child(8),
.logs-table td:nth-child(8){width:132px}

.fade-in{animation:fadeUp .55s cubic-bezier(.2,.65,.2,1) both}
@keyframes fadeUp{
  from{opacity:0;transform:translateY(18px)}
  to{opacity:1;transform:translateY(0)}
}

@media (min-width:760px){
  .auth-stage{grid-template-columns:1.1fr .9fr}
  .grid,.record-grid{grid-template-columns:1fr 1fr}
  .kpi-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .analytics-grid{grid-template-columns:1.2fr .8fr}
  .stats{grid-template-columns:repeat(5,1fr)}
  .grid-2{grid-template-columns:1fr 1fr}
  .data-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .filters{grid-template-columns:1fr 240px auto}
  .admin-shell{grid-template-columns:280px 1fr}
  .admin-main{padding:28px}
}
@media (min-width:1100px){
  .kpi-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
  .logs-table{
    min-width:100%;
  }
}
@media (min-width:980px){
  .sidebar-backdrop,.sidebar-close,.sidebar-toggle{display:none}
  .admin-shell{grid-template-columns:300px 1fr}
  .sidebar{
    position:sticky;top:0;left:auto;bottom:auto;z-index:auto;
    width:300px;min-height:100vh;
    transform:none;
  }
  .topbar{
    align-items:center;
  }
}

@media (min-width:760px){
  .admin-head-brand .brand-mark{display:none}
}

@media (max-width:759px){
  body{
    font-size:15px;
  }
  .topbar{
    align-items:flex-start;
    padding:14px;
  }
  .topbar nav{
    width:100%;
    justify-content:flex-start;
  }
  .topbar nav > *{
    width:100%;
  }
  .topbar nav .theme-toggle{
    width:46px;
  }
  .topbar nav form{
    width:100%;
  }
  .topbar nav form button{
    width:100%;
  }
  .brand{
    max-width:100%;
  }
  .brand > span:last-child{
    min-width:0;
    overflow-wrap:anywhere;
  }
  .brand-copy{
    gap:0;
  }
  .brand-copy strong{
    font-size:14px;
  }
  .auth-card{
    justify-self:stretch;
    max-width:none;
  }
  .hero,.auth-intro,.card,.stat,.auth-card{
    border-radius:22px;
  }
  .card,.stat{
    padding:18px;
  }
  .details{
    grid-template-columns:1fr;
    gap:6px;
  }
  .data-grid{
    grid-template-columns:1fr;
  }
  .page-head,.section-head,.admin-head{
    flex-direction:column;
    align-items:stretch;
  }
  .admin-main{
    padding:18px 12px 40px;
  }
  .container{
    padding:20px 12px 40px;
  }
  .sidebar{
    width:min(92vw,320px);
    padding:16px 12px 20px;
  }
  .sidebar-head{
    display:grid;
    grid-template-columns:1fr auto;
    align-items:start;
    gap:12px;
  }
  .sidebar-close{
    display:inline-flex;
  }
  .sidebar-link{
    min-height:44px;
    padding:11px 12px;
  }
  .sidebar-panel{
    padding:12px;
  }
  .actions{
    width:100%;
  }
  .actions form,
  .actions a,
  .actions button{
    width:100%;
  }
  .admin-head-actions{
    width:100%;
    justify-content:space-between;
  }
  .admin-head-brand{
    align-items:flex-start;
  }
  .brand-mark-lg{
    width:48px;
    height:48px;
    border-radius:16px;
    flex-basis:48px;
  }
  .brand-mark-md{
    width:58px;
    height:58px;
    border-radius:18px;
    flex-basis:58px;
  }
  .brand-mark-xl{
    width:210px;
    height:210px;
    border-radius:42px;
    flex-basis:210px;
  }
  .brand-mark-hero{
    width:186px;
    height:186px;
    border-radius:40px;
    flex-basis:186px;
  }
  .auth-brand{
    align-items:flex-start;
  }
  .kpi-card strong{
    font-size:1.65rem;
  }
  .table-wrap{
    overflow-x:auto;
    -webkit-overflow-scrolling:touch;
  }
  table{
    min-width:560px;
  }
  .logs-table{
    min-width:760px;
  }
  .kpi-grid,
  .analytics-grid,
  .shortcut-grid{
    grid-template-columns:1fr;
  }
  .qr-card img{
    width:min(280px,100%);
  }
}

@media (min-width:760px) and (max-width:1023px){
  .admin-main{
    padding:24px 18px 48px;
  }
  .sidebar{
    width:280px;
  }
  table{
    min-width:640px;
  }
  .topbar{
    gap:12px;
  }
  .topbar nav{
    justify-content:flex-end;
  }
  .brand-mark-hero{
    width:204px;
    height:204px;
    border-radius:44px;
    flex-basis:204px;
  }
  .brand-mark-xl{
    width:236px;
    height:236px;
    border-radius:48px;
    flex-basis:236px;
  }
}