/* =====================================================================
   ISK TECHNOLOGIES — Admin Web App styles
   Loaded only on admin.html, alongside isk-style.css (shares the same
   colour tokens / fonts already defined there).

   Chart palette: eight categorical slots validated for colour-vision
   deficiency on a white card surface (adjacent-pair CVD ΔE ≥ 8 except
   green↔red, which is in the 6–8 band and therefore always ships with a
   direct label — colour never carries meaning alone anywhere here).
   Status colours are a separate, reserved set and are never reused as
   a series colour.
===================================================================== */
:root{
  --s1:#2A6DB0;  /* blue    */
  --s2:#F58220;  /* orange  — ISK brand */
  --s3:#0E8F7E;  /* teal    */
  --s4:#7A5AF8;  /* purple  */
  --s5:#E0508A;  /* magenta */
  --s6:#B08800;  /* ochre   */
  --s7:#2E7D32;  /* green   */
  --s8:#D64545;  /* red     */

  --st-good:#0CA30C; --st-warn:#FAB219; --st-serious:#EC835A; --st-crit:#D03B3B;

  /* sequential ramp (single hue, light → dark) for the heatmap */
  --q1:#E4EEF9; --q2:#C2D9F2; --q3:#96BEE9; --q4:#639FDD; --q5:#2A6DB0; --q6:#1B4E85;

  --panel:#FFFFFF;
  --panel-line:#E6EBF1;
  --ink-2:#6C7C8D;
  --shadow-1:0 1px 2px rgba(11,42,74,.05), 0 8px 24px rgba(11,42,74,.06);
  --shadow-2:0 18px 44px rgba(11,42,74,.14);
}

body.admin-body{background:var(--navy-900); min-height:100vh;}

/* =====================================================================
   LOGIN SCREEN
===================================================================== */
.admin-login-wrap{
  min-height:100vh; display:flex; align-items:center; justify-content:center; padding:24px;
  background:
    radial-gradient(900px 400px at 85% -10%, rgba(245,130,32,.22), transparent 60%),
    radial-gradient(700px 380px at 10% 110%, rgba(11,85,99,.38), transparent 60%),
    linear-gradient(180deg, var(--navy-900) 0%, var(--navy) 100%);
}
.admin-login-card{
  background:#fff; border-radius:16px; padding:36px; width:390px; max-width:100%;
  box-shadow:0 30px 80px rgba(0,0,0,.38);
}
.admin-login-card .brand-row{display:flex; align-items:center; gap:10px; margin-bottom:22px;}
.admin-login-card .brand-row img{width:38px; height:38px; object-fit:contain; border-radius:8px;}
.admin-login-card .brand-row .fallback-mark{
  width:38px; height:38px; border-radius:8px; background:linear-gradient(135deg,var(--orange),var(--orange-dark));
  display:none; align-items:center; justify-content:center; font-family:'Space Grotesk'; font-weight:700; color:#fff;
}
.admin-login-card h2{font-size:19px; margin-bottom:4px;}
.admin-login-card p.sub{font-size:13px; color:var(--muted); margin-bottom:22px;}
.admin-error{background:#FDECEC; color:#B3261E; font-size:12.5px; padding:10px 12px; border-radius:8px; margin-bottom:14px; display:none;}

/* =====================================================================
   SHELL
===================================================================== */
.admin-shell{display:none; min-height:100vh; grid-template-columns:238px 1fr;}
.admin-shell.active{display:grid;}

.admin-sidebar{
  color:#CBD8E6; padding:22px 16px; position:sticky; top:0; height:100vh;
  display:flex; flex-direction:column;
  background:
    radial-gradient(420px 220px at 50% -10%, rgba(245,130,32,.16), transparent 62%),
    linear-gradient(180deg, var(--navy-900), #0A1B30 70%, #08192C);
  border-right:1px solid rgba(255,255,255,.07);
}
.admin-sidebar .brand-row{display:flex; align-items:center; gap:10px; margin-bottom:24px; padding:0 6px;}
.admin-sidebar .brand-row img{width:34px; height:34px; object-fit:contain; border-radius:7px;}
.admin-sidebar .brand-row .fallback-mark{
  width:34px; height:34px; border-radius:7px; background:linear-gradient(135deg,var(--orange),var(--orange-dark));
  display:none; align-items:center; justify-content:center; font-family:'Space Grotesk'; font-weight:700; color:#fff; font-size:13px;
}
.admin-sidebar .brand-row b{color:#fff; font-family:'Space Grotesk'; font-size:14px; display:block;}
.admin-sidebar .brand-row small{color:#8CA0B6; font-size:9.5px; text-transform:uppercase; letter-spacing:.1em;}

.nav-label{
  font-family:'JetBrains Mono',monospace; font-size:9.5px; letter-spacing:.14em;
  text-transform:uppercase; color:#63788F; padding:0 14px; margin:6px 0 8px;
}
.admin-nav{display:flex; flex-direction:column; gap:3px;}
.admin-nav button{
  position:relative; text-align:left; background:none; border:none; color:#B9C8D8;
  padding:10px 14px; border-radius:9px; font-size:13.5px; font-weight:500;
  display:flex; align-items:center; gap:10px; width:100%;
  transition:background .18s ease, color .18s ease, transform .18s ease;
}
.admin-nav button .nav-ico{width:17px; height:17px; flex:0 0 auto; opacity:.85;}
.admin-nav button .nav-ico svg{width:100%; height:100%; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round;}
.admin-nav button .nav-count{
  margin-left:auto; font-family:'JetBrains Mono',monospace; font-size:10.5px;
  background:rgba(255,255,255,.08); padding:2px 7px; border-radius:20px; color:#9FB3C8;
}
.admin-nav button:hover{background:rgba(255,255,255,.07); color:#fff; transform:translateX(2px);}
.admin-nav button.active{
  background:linear-gradient(90deg, rgba(245,130,32,.95), rgba(217,106,12,.9)); color:#fff;
  box-shadow:0 8px 20px rgba(245,130,32,.28);
}
.admin-nav button.active .nav-count{background:rgba(255,255,255,.22); color:#fff;}

.sidebar-foot{margin-top:auto; padding-top:18px;}
.admin-sidebar .logout-btn{
  width:100%; background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.15); color:#fff;
  padding:10px 14px; border-radius:9px; font-size:13px; transition:background .18s ease;
}
.admin-sidebar .logout-btn:hover{background:rgba(255,255,255,.13);}
.sidebar-foot a{display:block; margin-top:10px; font-size:12px; color:#8CA0B6; text-align:center;}
.sidebar-foot a:hover{color:#fff;}

.admin-main{background:var(--paper); padding:24px 30px 44px; overflow-x:hidden; min-width:0;}
.admin-topbar{display:flex; justify-content:space-between; align-items:flex-end; margin-bottom:20px; flex-wrap:wrap; gap:12px;}
.admin-topbar h1{font-size:22px;}
.admin-topbar .meta{font-size:12.5px; color:var(--muted); margin-top:3px; display:flex; align-items:center; gap:7px;}
.live-dot{width:7px; height:7px; border-radius:50%; background:var(--st-good); box-shadow:0 0 0 0 rgba(12,163,12,.6); animation:livePulse 2.2s infinite;}
.live-dot.is-demo{background:var(--st-warn); box-shadow:0 0 0 0 rgba(250,178,25,.6);}
@keyframes livePulse{70%{box-shadow:0 0 0 7px rgba(12,163,12,0);}100%{box-shadow:0 0 0 0 rgba(12,163,12,0);}}

.admin-tab{display:none;}
.admin-tab.active{display:block; animation:tabIn .32s cubic-bezier(.2,.7,.3,1);}
@keyframes tabIn{from{opacity:0; transform:translateY(8px);}to{opacity:1; transform:none;}}

/* =====================================================================
   PANELS
===================================================================== */
.panel{
  background:var(--panel); border:1px solid var(--panel-line); border-radius:14px;
  padding:18px 20px 20px; box-shadow:var(--shadow-1); min-width:0;
  transition:box-shadow .28s ease, transform .28s ease;
}
.panel:hover{box-shadow:var(--shadow-2);}
.panel-head{display:flex; align-items:flex-start; justify-content:space-between; gap:12px; margin-bottom:14px;}
.panel-head h4{font-size:14px; line-height:1.3;}
.panel-head .sub{font-size:11.5px; color:var(--ink-2); margin-top:2px;}
.panel-tools{display:flex; gap:5px; flex:0 0 auto;}
.seg{display:inline-flex; background:var(--paper); border:1px solid var(--panel-line); border-radius:9px; padding:2px;}
.seg button{
  border:none; background:none; font-family:'JetBrains Mono',monospace; font-size:11px;
  color:var(--ink-2); padding:5px 10px; border-radius:7px; transition:all .18s ease;
}
.seg button:hover{color:var(--navy);}
.seg button.active{background:var(--navy); color:#fff;}

/* =====================================================================
   HERO KPI CARDS
===================================================================== */
.kpi-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:16px; margin-bottom:16px;}
.kpi-card{
  position:relative; overflow:hidden; border-radius:14px; padding:18px 18px 14px; color:#fff;
  box-shadow:var(--shadow-1); transition:transform .3s cubic-bezier(.2,.7,.3,1), box-shadow .3s ease;
}
.kpi-card:hover{transform:translateY(-4px); box-shadow:var(--shadow-2);}
.kpi-card::after{
  content:""; position:absolute; right:-30px; top:-40px; width:150px; height:150px;
  border-radius:50%; background:rgba(255,255,255,.10);
}
.kpi-card .k-top{display:flex; align-items:center; justify-content:space-between; position:relative; z-index:1;}
.kpi-card .k-ico{
  width:32px; height:32px; border-radius:9px; background:rgba(255,255,255,.20);
  display:grid; place-items:center;
}
.kpi-card .k-ico svg{width:16px; height:16px; fill:none; stroke:#fff; stroke-width:1.9; stroke-linecap:round; stroke-linejoin:round;}
.kpi-card .k-delta{
  font-family:'JetBrains Mono',monospace; font-size:11px; font-weight:600;
  background:rgba(255,255,255,.18); padding:3px 8px; border-radius:20px;
  display:inline-flex; align-items:center; gap:4px;
}
.kpi-card .n{
  font-family:'Space Grotesk',sans-serif; font-size:clamp(22px,2.1vw,30px); font-weight:700;
  color:#fff; margin-top:12px; position:relative; z-index:1; line-height:1.1;
}
.kpi-card .l{
  font-size:11px; color:rgba(255,255,255,.82); text-transform:uppercase;
  letter-spacing:.06em; margin-top:4px; position:relative; z-index:1;
}
.kpi-card .spark{margin-top:10px; height:34px; position:relative; z-index:1;}
.kpi-card .spark svg{width:100%; height:34px; display:block; overflow:visible;}
.kpi-card.grad-1{background:linear-gradient(135deg,#0B2A4A,#1D5A8F);}
.kpi-card.grad-2{background:linear-gradient(135deg,#D96A0C,#F5A03C);}
.kpi-card.grad-3{background:linear-gradient(135deg,#0B5563,#10897F);}
.kpi-card.grad-4{background:linear-gradient(135deg,#5B3FD6,#8E77FF);}

/* small stat tiles */
.tile-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:16px; margin-bottom:20px;}
.tile{
  background:var(--panel); border:1px solid var(--panel-line); border-radius:14px;
  padding:16px 18px; display:flex; align-items:center; gap:14px; box-shadow:var(--shadow-1);
  transition:transform .28s ease, box-shadow .28s ease;
}
.tile:hover{transform:translateY(-3px); box-shadow:var(--shadow-2);}
.tile .ring-wrap{position:relative; width:52px; height:52px; flex:0 0 auto;}
.tile .ring-wrap svg{width:52px; height:52px; display:block; transform:rotate(-90deg);}
.tile .ring-wrap .rv{
  position:absolute; inset:0; display:grid; place-items:center;
  font-family:'JetBrains Mono',monospace; font-size:11px; font-weight:600; color:var(--navy);
}
.tile .t-body{min-width:0;}
.tile .t-n{font-family:'Space Grotesk',sans-serif; font-size:20px; font-weight:700; color:var(--navy); line-height:1.1;}
.tile .t-l{font-size:11.5px; color:var(--ink-2); margin-top:3px;}

/* =====================================================================
   DASHBOARD GRID
===================================================================== */
.dash-grid{display:grid; gap:16px; margin-bottom:16px;}
.dash-grid.cols-3-1{grid-template-columns:2.1fr 1fr;}
.dash-grid.cols-3{grid-template-columns:repeat(3,1fr);}
.dash-grid.cols-2{grid-template-columns:1fr 1fr;}
.dash-grid.cols-2-1{grid-template-columns:1.6fr 1fr;}

/* legacy names kept so nothing else on the page breaks */
.chart-grid{display:grid; grid-template-columns:1fr 1fr; gap:16px; margin-bottom:16px;}
.chart-card{background:var(--panel); border:1px solid var(--panel-line); border-radius:14px; padding:18px 20px; box-shadow:var(--shadow-1);}
.chart-card h4{font-size:14px; margin-bottom:14px;}

/* =====================================================================
   CHARTS (inline SVG, drawn by admin.html)
===================================================================== */
.chart{width:100%; display:block; overflow:visible;}
.chart .grid-line{stroke:var(--panel-line); stroke-width:1;}
.chart .axis-txt{font-family:'JetBrains Mono',monospace; font-size:10px; fill:var(--ink-2);}
.chart .val-txt{font-family:'JetBrains Mono',monospace; font-size:10.5px; fill:var(--navy); font-weight:600;}
.chart .series-line{fill:none; stroke-width:2; stroke-linecap:round; stroke-linejoin:round;}
.chart .dot{stroke:#fff; stroke-width:2;}
.draw-in{stroke-dasharray:var(--len); stroke-dashoffset:var(--len); animation:drawIn 1.1s cubic-bezier(.3,.8,.3,1) forwards;}
@keyframes drawIn{to{stroke-dashoffset:0;}}
.fade-in{opacity:0; animation:fadeIn .7s ease .35s forwards;}
@keyframes fadeIn{to{opacity:1;}}
.grow{transform-origin:center; animation:growIn .8s cubic-bezier(.2,.8,.3,1) forwards;}
@keyframes growIn{from{transform:scale(.6); opacity:0;}to{transform:scale(1); opacity:1;}}

.chart-crosshair{stroke:var(--navy); stroke-width:1; stroke-dasharray:3 3; opacity:0;}
.hit{fill:transparent; cursor:crosshair;}

.viz-tip{
  position:fixed; z-index:60; pointer-events:none; opacity:0; transform:translate(-50%,-120%);
  background:var(--navy-900); color:#fff; border-radius:9px; padding:9px 11px;
  font-size:11.5px; line-height:1.5; box-shadow:0 12px 30px rgba(0,0,0,.32);
  transition:opacity .14s ease; white-space:nowrap;
}
.viz-tip b{font-family:'Space Grotesk',sans-serif; font-size:12.5px; display:block; margin-bottom:3px;}
.viz-tip .row{display:flex; align-items:center; gap:6px;}
.viz-tip .sw{width:8px; height:8px; border-radius:2px; flex:0 0 auto;}
.viz-tip .num{margin-left:auto; font-family:'JetBrains Mono',monospace; padding-left:12px;}

/* legend */
.legend{display:flex; flex-wrap:wrap; gap:8px 16px; margin-top:14px;}
.legend-item{display:flex; align-items:center; gap:7px; font-size:12px; color:var(--ink); min-width:0;}
.legend-item .sw{width:10px; height:10px; border-radius:3px; flex:0 0 auto;}
.legend-item .lb{overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.legend-item .vv{font-family:'JetBrains Mono',monospace; color:var(--ink-2); font-size:11.5px;}

/* donut centre */
.donut-wrap{position:relative; display:grid; place-items:center;}
.donut-centre{position:absolute; text-align:center; pointer-events:none;}
.donut-centre .dn{font-family:'Space Grotesk',sans-serif; font-size:26px; font-weight:700; color:var(--navy); line-height:1;}
.donut-centre .dl{font-size:10.5px; color:var(--ink-2); text-transform:uppercase; letter-spacing:.07em; margin-top:4px;}

/* ranking bars */
.rank-row{display:grid; grid-template-columns:1fr auto; gap:4px 10px; margin-bottom:13px;}
.rank-row .rl{font-size:12.5px; color:var(--ink); overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.rank-row .rv{font-family:'JetBrains Mono',monospace; font-size:12px; color:var(--navy); font-weight:600;}
.rank-row .rt{grid-column:1/-1; height:9px; background:var(--paper); border-radius:5px; overflow:hidden;}
.rank-row .rf{height:100%; border-radius:5px; width:0; transition:width .9s cubic-bezier(.2,.8,.3,1);}

/* segmented status bar */
.segbar{display:flex; height:14px; border-radius:7px; overflow:hidden; gap:2px; background:var(--paper);}
.segbar span{height:100%; transition:flex-grow .9s cubic-bezier(.2,.8,.3,1);}

/* funnel */
.funnel{display:flex; flex-direction:column; gap:8px;}
.funnel-step{position:relative; border-radius:9px; padding:11px 14px; color:#fff; display:flex; align-items:center; justify-content:space-between; gap:10px; font-size:12.5px; transition:transform .25s ease;}
.funnel-step:hover{transform:translateX(3px);}
.funnel-step .fs-n{font-family:'JetBrains Mono',monospace; font-weight:600;}
.funnel-step .fs-p{font-size:11px; opacity:.85;}

/* heatmap */
.heat{display:grid; grid-template-columns:auto repeat(7,1fr); gap:4px; align-items:center;}
.heat .hh{font-family:'JetBrains Mono',monospace; font-size:9.5px; color:var(--ink-2); text-align:center;}
.heat .hr{font-family:'JetBrains Mono',monospace; font-size:9.5px; color:var(--ink-2); padding-right:6px; white-space:nowrap;}
.heat .hc{aspect-ratio:1/1; border-radius:4px; background:var(--paper); cursor:default; transition:transform .18s ease;}
.heat .hc:hover{transform:scale(1.14);}
.heat-key{display:flex; align-items:center; gap:6px; margin-top:12px; font-size:11px; color:var(--ink-2);}
.heat-key i{width:14px; height:10px; border-radius:3px; display:inline-block;}

/* activity feed */
.feed{display:flex; flex-direction:column; max-height:326px; overflow-y:auto;}
.feed-item{display:flex; gap:11px; padding:11px 2px; border-bottom:1px solid var(--panel-line);}
.feed-item:last-child{border-bottom:none;}
.feed-ico{width:30px; height:30px; border-radius:9px; flex:0 0 auto; display:grid; place-items:center;}
.feed-ico svg{width:14px; height:14px; fill:none; stroke-width:1.9; stroke-linecap:round; stroke-linejoin:round;}
.feed-body{min-width:0; flex:1;}
.feed-body .ft{font-size:12.5px; color:var(--ink); line-height:1.4;}
.feed-body .ft b{font-weight:600; color:var(--navy);}
.feed-body .fm{font-size:11px; color:var(--ink-2); margin-top:2px;}
.feed-amt{font-family:'JetBrains Mono',monospace; font-size:12px; color:var(--navy); font-weight:600; white-space:nowrap;}

/* alerts */
.alert-item{display:flex; gap:11px; align-items:flex-start; padding:12px 13px; border-radius:10px; margin-bottom:9px; border:1px solid;}
.alert-item .ai{width:18px; height:18px; flex:0 0 auto; margin-top:1px;}
.alert-item .ai svg{width:18px; height:18px; fill:none; stroke-width:1.9; stroke-linecap:round; stroke-linejoin:round;}
.alert-item .at{font-size:12.5px; font-weight:600;}
.alert-item .ad{font-size:11.5px; margin-top:2px; opacity:.9;}
.alert-crit{background:#FDECEC; border-color:#F5C9C9; color:#8E2020;}
.alert-warn{background:#FFF7E4; border-color:#F6E1B0; color:#7A5600;}
.alert-good{background:#E9F7EA; border-color:#C4E7C6; color:#1B6A1E;}
.alert-info{background:#EAF1FA; border-color:#C9DCF2; color:#1F4C82;}

/* rating bars */
.rate-row{display:grid; grid-template-columns:34px 1fr 28px; gap:9px; align-items:center; margin-bottom:8px; font-size:11.5px;}
.rate-row .rk{font-family:'JetBrains Mono',monospace; color:var(--ink-2);}
.rate-row .rt{display:block; height:9px; background:var(--paper); border-radius:5px; overflow:hidden;}
.rate-row .rf{display:block; height:100%; border-radius:5px; background:var(--s6); width:0; transition:width .9s cubic-bezier(.2,.8,.3,1);}
.rate-row .rn{font-family:'JetBrains Mono',monospace; color:var(--navy); text-align:right; font-weight:600;}

.big-rating{display:flex; align-items:baseline; gap:8px; margin-bottom:4px;}
.big-rating .br{font-family:'Space Grotesk',sans-serif; font-size:38px; font-weight:700; color:var(--navy); line-height:1;}
.big-rating .bo{font-size:13px; color:var(--ink-2);}
.stars{display:flex; gap:2px; margin-bottom:16px;}
.stars svg{width:15px; height:15px;}

.empty-note{
  display:flex; align-items:center; gap:8px; font-size:12.5px; color:var(--ink-2);
  background:var(--paper); border:1px dashed var(--panel-line); border-radius:10px; padding:14px;
}

/* =====================================================================
   TABLES
===================================================================== */
.table-toolbar{display:flex; justify-content:space-between; align-items:center; margin-bottom:14px; gap:10px; flex-wrap:wrap;}
.table-toolbar h3{font-size:15px;}
.table-toolbar input{border:1px solid var(--panel-line); border-radius:9px; padding:9px 13px; font-size:13px; width:260px; font-family:inherit; background:#fff; transition:border-color .18s ease, box-shadow .18s ease;}
.table-toolbar input:focus{outline:none; border-color:var(--orange); box-shadow:0 0 0 3px rgba(245,130,32,.16);}
.table-wrap{background:var(--panel); border:1px solid var(--panel-line); border-radius:14px; overflow:auto; max-height:64vh; box-shadow:var(--shadow-1);}
table.admin-table{width:100%; border-collapse:collapse; font-size:12.5px;}
table.admin-table thead th{
  position:sticky; top:0; z-index:1; background:var(--navy); color:#fff; text-align:left;
  padding:11px 14px; font-weight:600; white-space:nowrap; font-size:11px;
  text-transform:uppercase; letter-spacing:.04em;
}
table.admin-table tbody td{padding:10px 14px; border-bottom:1px solid var(--panel-line); color:var(--ink); white-space:nowrap; max-width:260px; overflow:hidden; text-overflow:ellipsis;}
table.admin-table tbody tr{transition:background .15s ease;}
table.admin-table tbody tr:hover{background:#F7FAFD;}

.status-tag{display:inline-flex; align-items:center; gap:5px; padding:3px 9px; border-radius:20px; font-size:10.5px; font-weight:600;}
.status-tag::before{content:""; width:6px; height:6px; border-radius:50%; background:currentColor; flex:0 0 auto;}
.status-tag.pending, .status-tag.new{background:#FFF2CC; color:#8A6100;}
.status-tag.confirmed, .status-tag.fulfilled, .status-tag.won, .status-tag.converted{background:#E3F5E9; color:#1E8E3E;}
.status-tag.cancelled, .status-tag.lost, .status-tag.closed{background:#FDECEC; color:#B3261E;}
.status-tag.contacted, .status-tag.quoted{background:#E8EEFB; color:#2A4B9B;}
.status-tag.active{background:#E3F5E9; color:#1E8E3E;}
.status-tag.inactive{background:#EEF1F4; color:#5B6B7B;}

.spinner{width:26px; height:26px; border:3px solid var(--panel-line); border-top-color:var(--orange); border-radius:50%; animation:spin .8s linear infinite; margin:40px auto;}
@keyframes spin{to{transform:rotate(360deg);}}

.skeleton{background:linear-gradient(90deg,#EEF2F6 25%,#F7FAFC 50%,#EEF2F6 75%); background-size:200% 100%; animation:shimmer 1.3s infinite; border-radius:8px;}
@keyframes shimmer{to{background-position:-200% 0;}}

/* =====================================================================
   RESPONSIVE
===================================================================== */
@media (max-width:1400px){
  .kpi-grid, .tile-grid{grid-template-columns:repeat(2,1fr);}
}
@media (max-width:1200px){
  .dash-grid.cols-3-1, .dash-grid.cols-2-1{grid-template-columns:1fr;}
  .dash-grid.cols-3{grid-template-columns:1fr 1fr;}
}
@media (max-width:900px){
  .admin-shell.active{grid-template-columns:1fr;}
  .admin-sidebar{position:static; height:auto;}
  .admin-nav{flex-direction:row; flex-wrap:wrap;}
  .admin-nav button{width:auto;}
  .admin-nav button .nav-count{margin-left:6px;}
  .admin-main{padding:20px 18px 40px;}
  .dash-grid.cols-3, .dash-grid.cols-2, .chart-grid{grid-template-columns:1fr;}
}
@media (max-width:640px){
  .kpi-grid, .tile-grid{grid-template-columns:1fr;}
  .table-toolbar input{width:100%;}
}
@media (prefers-reduced-motion:reduce){
  .draw-in, .fade-in, .grow, .admin-tab.active{animation:none !important;}
  .draw-in{stroke-dashoffset:0 !important;}
  .fade-in{opacity:1 !important;}
  .kpi-card:hover, .tile:hover, .panel:hover{transform:none;}
}

/* =====================================================================
   ROUND 10 — branded login, password fields, settings tab
===================================================================== */
.admin-login-card{text-align:left;}
.login-logo{height:52px; width:auto; max-width:190px; object-fit:contain; margin:0 0 18px; display:block;}
/* .admin-login-card .brand-row sets display:flex, so the fallback needs the
   same specificity to stay hidden; the img's onerror re-shows it inline. */
.admin-login-card .brand-row.login-fallback{display:none;}
.admin-login-card > h2{font-size:19px;}

.pw-wrap{position:relative;}
.pw-wrap input{width:100%; padding-right:42px;}
.pw-eye{
  position:absolute; right:6px; top:50%; transform:translateY(-50%);
  width:30px; height:30px; border:none; background:none; border-radius:7px;
  color:var(--ink-2); display:grid; place-items:center;
  transition:color .18s ease, background .18s ease;
}
.pw-eye:hover{color:var(--navy); background:var(--paper);}
.pw-eye svg{width:17px; height:17px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round;}
.pw-eye.is-on{color:var(--orange-dark);}
.pw-eye.is-on::after{
  content:""; position:absolute; left:6px; right:6px; top:50%;
  height:1.8px; background:currentColor; border-radius:2px; transform:rotate(-38deg);
}

.link-btn{
  background:none; border:none; padding:0; margin-top:16px;
  font-family:inherit; font-size:12.5px; color:var(--orange-dark);
  font-weight:600; text-align:left; display:inline-flex; align-items:center; gap:6px;
}
.link-btn:hover{text-decoration:underline;}
.link-btn::after{content:"▾"; font-size:10px; transition:transform .2s ease;}
.link-btn.is-open::after{transform:rotate(180deg);}

.pw-help{
  margin-top:14px; padding:14px 16px; border-radius:10px;
  background:var(--paper); border:1px solid var(--panel-line);
  font-size:12.5px; line-height:1.65; color:var(--ink);
}
.pw-help p{margin:0 0 10px;}
.pw-help p:last-child{margin-bottom:0;}
.pw-help ol{margin:0 0 10px; padding-left:20px;}
.pw-help li{margin-bottom:5px;}
.pw-help code{
  font-family:'JetBrains Mono',monospace; font-size:11.5px;
  background:#EEF2F6; padding:1px 5px; border-radius:4px;
}
.pw-help .muted-note{color:var(--ink-2); font-size:11.5px;}

.login-back{
  display:inline-flex; align-items:center; gap:7px; margin-top:20px;
  font-size:12.5px; color:var(--ink-2); font-weight:500;
  transition:color .18s ease;
}
.login-back:hover{color:var(--navy);}
.login-back svg{width:15px; height:15px; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round;}

/* sidebar brand becomes a link home */
.sidebar-brand{text-decoration:none;}
.sidebar-brand img{width:auto !important; height:36px !important; max-width:170px; object-fit:contain; border-radius:0 !important;}
.sidebar-brand .brand-fallback-text{display:none;}
.sidebar-brand img[style*="display: none"] ~ .brand-fallback-text{display:block;}
.sidebar-brand:hover{opacity:.88;}

/* strength meter */
.pw-meter{height:5px; background:#EEF2F6; border-radius:3px; overflow:hidden; margin-top:8px;}
.pw-meter span{display:block; height:100%; width:0; border-radius:3px; transition:width .3s ease, background .3s ease;}
.pw-meter span.s0, .pw-meter span.s1{background:var(--st-crit);}
.pw-meter span.s2{background:var(--st-warn);}
.pw-meter span.s3{background:#2A6DB0;}
.pw-meter span.s4{background:var(--st-good);}
.pw-hint{font-size:11.5px; color:var(--ink-2); margin-top:6px;}

.pw-ok{
  background:#E9F7EA; border:1px solid #C4E7C6; color:#1B6A1E;
  font-size:12.5px; padding:10px 12px; border-radius:8px; margin-bottom:14px;
}
#tab-settings .panel code{
  font-family:'JetBrains Mono',monospace; font-size:11.5px;
  background:#EEF2F6; padding:1px 5px; border-radius:4px;
}
#tab-settings .field{margin-bottom:14px;}

/* =====================================================================
   ROUND 11 — intimation e-mail settings
===================================================================== */
.ceo-row{
  display:flex; align-items:center; gap:13px;
  padding:14px 16px; border-radius:12px; margin-bottom:18px;
  background:linear-gradient(135deg,#F3F7FC,#EAF1FA);
  border:1px solid #D8E4F2;
}
.ceo-avatar{
  width:42px; height:42px; flex:0 0 auto; border-radius:50%;
  background:linear-gradient(135deg,var(--navy),#1D5A8F); color:#fff;
  display:grid; place-items:center;
  font-family:'Space Grotesk',sans-serif; font-weight:700; font-size:14px; letter-spacing:.02em;
}
.ceo-meta{min-width:0; flex:1;}
.ceo-label{
  display:block; font-size:10.5px; letter-spacing:.09em; text-transform:uppercase;
  color:var(--ink-2); font-weight:600;
}
.ceo-mail{
  display:block; font-family:'JetBrains Mono',monospace; font-size:13px;
  color:var(--navy); font-weight:600; margin-top:3px;
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}
.ceo-lock{width:18px; height:18px; flex:0 0 auto; color:#7E93AB;}
.ceo-lock svg{width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round;}

#notifyList{
  width:100%; font-family:'JetBrains Mono',monospace; font-size:12.5px; line-height:1.6;
  border:1px solid var(--panel-line); border-radius:9px; padding:10px 12px;
  resize:vertical; background:#fff; color:var(--ink);
}
#notifyList:focus{outline:none; border-color:var(--orange); box-shadow:0 0 0 3px rgba(245,130,32,.16);}

.switch-row{display:flex; align-items:flex-start; gap:12px; cursor:pointer;}
.switch-row input{position:absolute; opacity:0; width:0; height:0;}
.switch{
  width:40px; height:22px; flex:0 0 auto; margin-top:1px; border-radius:20px;
  background:#CBD5E1; position:relative; transition:background .22s ease;
}
.switch::after{
  content:""; position:absolute; top:3px; left:3px; width:16px; height:16px;
  border-radius:50%; background:#fff; box-shadow:0 1px 3px rgba(0,0,0,.22);
  transition:transform .22s cubic-bezier(.2,.8,.3,1);
}
.switch-row input:checked + .switch{background:var(--st-good);}
.switch-row input:checked + .switch::after{transform:translateX(18px);}
.switch-row input:focus-visible + .switch{box-shadow:0 0 0 3px rgba(245,130,32,.28);}
.switch-text b{display:block; font-size:13px; color:var(--ink); font-weight:600;}
.switch-text small{display:block; font-size:11.5px; color:var(--ink-2); margin-top:2px; line-height:1.5;}

.quota-card{
  background:linear-gradient(160deg,#0B2A4A,#123B5C); color:#fff;
  border-radius:12px; padding:18px; margin-bottom:14px;
}
.quota-n{font-family:'Space Grotesk',sans-serif; font-size:32px; font-weight:700; line-height:1; color:#fff;}
.quota-n.is-low{color:#FFD9AE;}
.quota-n.is-out{color:#FFB3B3;}
.quota-l{font-size:11px; letter-spacing:.07em; text-transform:uppercase; color:#9FB6CE; margin-top:5px;}
.quota-note{font-size:11.5px; line-height:1.6; color:#B9C8D8; margin-top:12px;}

.notify-what{list-style:none; margin:0; padding:0;}
.notify-what li{
  display:flex; align-items:center; gap:9px; font-size:12.5px;
  color:var(--ink); padding:7px 0; border-bottom:1px solid var(--panel-line);
}
.notify-what li:last-child{border-bottom:none;}
.notify-what i{width:9px; height:9px; border-radius:3px; flex:0 0 auto;}

@media (max-width:900px){
  #tab-settings .dash-grid.cols-2-1{grid-template-columns:1fr;}
}