/* DevsArun Extensions — Agency Overhaul v2.
   Strict palette: white + accent green (#10B981) + accent blue (#3B82F6).
   Loaded after Tailwind CDN; .ds-* classes win. */

:root {
  --white:#ffffff;
  --ag:#10B981;  --ag-600:#059669;  --ag-50:#ecfdf5;
  --ab:#3B82F6;  --ab-600:#2563EB;  --ab-50:#eff6ff;

  --ink-50:#f8fafc; --ink-100:#f1f5f9; --ink-200:#e2e8f0; --ink-300:#cbd5e1;
  --ink-400:#94a3b8; --ink-500:#64748b; --ink-600:#475569; --ink-700:#334155;
  --ink-800:#1e293b; --ink-900:#0b1220; --ink-950:#060912;

  --r-sm:10px; --r-md:14px; --r-lg:22px; --r-xl:32px;

  --shadow-1: 0 1px 2px rgba(15,23,42,.04);
  --shadow-2: 0 12px 32px -16px rgba(15,23,42,.16), 0 2px 6px -2px rgba(15,23,42,.06);
  --shadow-3: 0 40px 80px -32px rgba(15,23,42,.25), 0 12px 28px -10px rgba(15,23,42,.10);
  --shadow-prod: 0 60px 120px -40px rgba(15,23,42,.30), 0 24px 60px -20px rgba(59,130,246,.22);
  --glow-green: 0 14px 40px -10px rgba(16,185,129,.55);
  --glow-blue:  0 14px 40px -10px rgba(59,130,246,.55);

  --ease: cubic-bezier(.2,.7,.2,1);
  --grad: linear-gradient(120deg, var(--ag) 0%, #14b8a6 50%, var(--ab) 100%);
}

html, body {
  font-family: 'Inter', ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
  -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility;
  color: var(--ink-900); font-feature-settings:"ss01","cv11";
}
h1,h2,h3,h4,.font-display {
  font-family: 'Space Grotesk','Inter',ui-sans-serif,system-ui,sans-serif;
  letter-spacing:-.02em; font-weight:700;
}
.font-serif-accent { font-family:'Instrument Serif','Cormorant Garamond',serif; font-style:italic; font-weight:400; letter-spacing:-.01em; }

body.ds-public {
  background:
    radial-gradient(1400px 900px at -8% -6%, rgba(16,185,129,.16), transparent 62%),
    radial-gradient(1200px 780px at 105% 12%, rgba(59,130,246,.14), transparent 60%),
    radial-gradient(900px 600px at -10% 55%, rgba(16,185,129,.08), transparent 65%),
    radial-gradient(1000px 700px at 115% 85%, rgba(59,130,246,.10), transparent 60%),
    linear-gradient(180deg,#fbfcfe 0%, #f7f9fc 100%);
  background-attachment: fixed;
  min-height:100vh;
}
body.ds-app {
  background: #f4f6fa;
  min-height:100vh;
  height:100vh;
  overflow:hidden;
}

/* ---------- Primitives ---------- */
.ds-eyebrow {
  display:inline-flex; align-items:center; gap:.45rem;
  padding:.35rem .75rem; border-radius:999px;
  font-size:.72rem; font-weight:600; letter-spacing:.08em; text-transform:uppercase;
  background:#fff; color:var(--ink-700);
  border:1px solid var(--ink-200);
  box-shadow: var(--shadow-1);
}
.ds-eyebrow .dot { width:6px;height:6px;border-radius:999px;background:var(--ag); box-shadow:0 0 0 4px rgba(16,185,129,.18);}
.ds-gradient-text { background-image:var(--grad); -webkit-background-clip:text; background-clip:text; color:transparent; }

.ds-card {
  background:rgba(255,255,255,.78);
  border:1px solid rgba(15,23,42,.06);
  border-radius:var(--r-lg);
  box-shadow:var(--shadow-2);
  backdrop-filter:blur(14px) saturate(160%);
}
.ds-card-flat { background:#fff; border:1px solid var(--ink-200); border-radius:var(--r-lg); }
.ds-card-dark {
  background:linear-gradient(165deg,#0b1220 0%,#0f172a 60%,#0b1220 100%);
  color:#e2e8f0; border:1px solid rgba(255,255,255,.06); border-radius:var(--r-xl);
  box-shadow:var(--shadow-3); position:relative; overflow:hidden;
}
.ds-card-dark::before{
  content:""; position:absolute; inset:-1px; border-radius:inherit; padding:1px;
  background:linear-gradient(135deg,rgba(16,185,129,.4),rgba(59,130,246,.4),rgba(255,255,255,0));
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
  -webkit-mask-composite:xor; mask-composite:exclude; pointer-events:none;
}

/* ---------- Buttons ---------- */
.ds-btn {
  display:inline-flex; align-items:center; justify-content:center; gap:.5rem;
  padding:.75rem 1.15rem; border-radius:var(--r-md);
  font-weight:600; font-size:.92rem; line-height:1; white-space:nowrap;
  transition:transform .18s var(--ease), box-shadow .25s var(--ease), background .2s, color .2s, border-color .2s;
  cursor:pointer; border:1px solid transparent; position:relative;
}
.ds-btn-primary { color:#fff; background-image:var(--grad); box-shadow:var(--glow-green); }
.ds-btn-primary:hover { transform:translateY(-2px); box-shadow:0 22px 44px -14px rgba(16,185,129,.55), 0 12px 30px -12px rgba(59,130,246,.45); }
.ds-btn-primary::after{
  content:""; position:absolute; inset:0; border-radius:inherit; pointer-events:none;
  background:linear-gradient(180deg,rgba(255,255,255,.25),transparent 40%);
}
.ds-btn-ghost { background:rgba(255,255,255,.9); border-color:var(--ink-200); color:var(--ink-900); box-shadow:var(--shadow-1); }
.ds-btn-ghost:hover { background:#fff; border-color:var(--ink-300); transform:translateY(-1px); }
.ds-btn-dark { background:var(--ink-900); color:#fff; }
.ds-btn-dark:hover { background:#000; transform:translateY(-1px); }
.ds-btn-link { padding:0; background:none; color:var(--ab-600); font-weight:600; }
.ds-btn-link:hover { text-decoration:underline; }
.ds-btn-sm { padding:.5rem .85rem; font-size:.84rem; border-radius:10px; }
.ds-btn-lg { padding:.95rem 1.5rem; font-size:1rem; border-radius:16px; }

/* ---------- Chips & Inputs ---------- */
.ds-chip { display:inline-flex; align-items:center; gap:.35rem; padding:.22rem .6rem; border-radius:999px; font-size:.72rem; font-weight:600; background:var(--ink-100); color:var(--ink-700); }
.ds-chip-ok { background:var(--ag-50); color:#065f46; }
.ds-chip-info { background:var(--ab-50); color:#1e40af; }
.ds-chip-warn { background:#fef3c7; color:#92400e; }
.ds-chip-danger { background:#fee2e2; color:#991b1b; }

.ds-input,.ds-select,.ds-textarea {
  width:100%; padding:.78rem 1rem;
  border:1px solid var(--ink-200); border-radius:var(--r-md);
  background:rgba(255,255,255,.88); outline:none;
  font-size:.94rem; color:var(--ink-900);
  transition:border-color .15s, box-shadow .15s, background .2s;
}
.ds-input:focus,.ds-select:focus,.ds-textarea:focus { border-color:var(--ab); box-shadow:0 0 0 4px rgba(59,130,246,.15); background:#fff; }
.ds-label { display:block; font-size:.78rem; font-weight:600; color:var(--ink-700); margin-bottom:.4rem; letter-spacing:.01em; }
.ds-help  { font-size:.78rem; color:var(--ink-500); margin-top:.35rem; }

.ds-section { padding:5rem 0; }
@media (min-width:768px){ .ds-section { padding:7rem 0; } }
.ds-divider { height:1px; background:linear-gradient(90deg,transparent,var(--ink-200),transparent); }
.ds-kbd { display:inline-flex; padding:.15rem .45rem; border-radius:6px; background:#fff; border:1px solid var(--ink-200); color:var(--ink-700); font-size:.72rem; font-family:ui-monospace,SFMono-Regular,Menlo,monospace; box-shadow:0 1px 0 var(--ink-200); }

/* ---------- Premium Nav ---------- */
.ds-nav {
  position:sticky; top:0; z-index:50;
  background:rgba(255,255,255,.72);
  backdrop-filter:blur(18px) saturate(180%);
  border-bottom:1px solid rgba(15,23,42,.06);
  transition:padding .2s var(--ease), background .2s;
}
.ds-nav.scrolled { background:rgba(255,255,255,.92); box-shadow:0 8px 20px -16px rgba(15,23,42,.15); }
.ds-nav-pill {
  display:inline-flex; align-items:center; gap:.25rem;
  padding:.35rem; background:rgba(241,245,249,.7); border:1px solid rgba(15,23,42,.05);
  border-radius:999px;
}
.ds-nav-link {
  position:relative; color:var(--ink-600); font-weight:500; font-size:.9rem;
  padding:.5rem .85rem; border-radius:999px; transition:color .15s, background .15s;
}
.ds-nav-link:hover { color:var(--ink-900); background:rgba(255,255,255,.6); }
.ds-nav-link.active { color:var(--ink-900); background:#fff; box-shadow:var(--shadow-1); }

/* ---------- Footer (premium dark) ---------- */
.ds-footer {
  margin-top:8rem; position:relative; overflow:hidden;
  background:linear-gradient(180deg,#0b1220 0%,#060912 100%);
  color:#cbd5e1; border-top:1px solid rgba(255,255,255,.06);
}
.ds-footer::before{
  content:""; position:absolute; inset:0; opacity:.6;
  background:
    radial-gradient(700px 320px at 10% 0%, rgba(16,185,129,.18), transparent 60%),
    radial-gradient(700px 320px at 90% 0%, rgba(59,130,246,.22), transparent 60%);
}
.ds-footer .ds-foot-inner { position:relative; }
.ds-footer h4 { font-size:.72rem; text-transform:uppercase; letter-spacing:.12em; color:#94a3b8; margin-bottom:1rem; font-weight:700; font-family:'Inter',sans-serif; }
.ds-footer a { color:#cbd5e1; font-size:.92rem; display:block; padding:.3rem 0; transition:color .15s; }
.ds-footer a:hover { color:#fff; }

/* ---------- Trust badges ---------- */
.ds-trust { display:inline-flex; align-items:center; gap:.45rem; padding:.4rem .75rem; border-radius:999px; background:#fff; border:1px solid var(--ink-200); font-size:.78rem; color:var(--ink-700); font-weight:500; box-shadow:var(--shadow-1); }

/* ---------- Hero mesh ---------- */
.ds-mesh {
  position:absolute; inset:0; z-index:-1; overflow:hidden; border-radius:inherit;
  pointer-events:none;
}
.ds-mesh::before, .ds-mesh::after {
  content:""; position:absolute; width:620px; height:620px; border-radius:50%;
  filter:blur(90px); opacity:.5; animation:meshFloat 18s var(--ease) infinite;
}
.ds-mesh::before { background:radial-gradient(circle,var(--ag) 0%,transparent 70%); top:-180px; left:-100px; }
.ds-mesh::after  { background:radial-gradient(circle,var(--ab) 0%,transparent 70%); bottom:-200px; right:-120px; animation-delay:-9s; }
@keyframes meshFloat { 0%,100% { transform:translate(0,0) scale(1); } 50%{ transform:translate(50px,-40px) scale(1.05);} }

/* ---------- Bento grid ---------- */
.ds-bento { display:grid; gap:1.25rem; grid-template-columns:repeat(6,1fr); }
.ds-bento > * { grid-column:span 6; }
@media (min-width:768px){
  .ds-bento > .span-2 { grid-column:span 2; }
  .ds-bento > .span-3 { grid-column:span 3; }
  .ds-bento > .span-4 { grid-column:span 4; }
  .ds-bento > .span-6 { grid-column:span 6; }
}

/* ---------- Marquee logo cloud ---------- */
.ds-marquee { mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent); overflow:hidden; }
.ds-marquee-track { display:flex; gap:3rem; width:max-content; animation:marquee 40s linear infinite; }
@keyframes marquee { from{transform:translateX(0);} to{transform:translateX(-50%);} }
.ds-logocloud { display:flex; flex-wrap:wrap; gap:2rem 3rem; align-items:center; justify-content:center; }
.ds-logocloud span { font-family:'Space Grotesk',sans-serif; font-weight:700; font-size:1.25rem; color:var(--ink-400); letter-spacing:.01em; transition:color .2s; }
.ds-logocloud span:hover { color:var(--ink-700); }

/* ---------- Scroll reveal ---------- */
.ds-reveal { opacity:0; transform:translateY(24px); transition:opacity .8s var(--ease), transform .8s var(--ease); }
.ds-reveal.in { opacity:1; transform:translateY(0); }

/* ---------- Skeleton / sparkline ---------- */
.ds-skel { background:linear-gradient(90deg,#eef2f6,#f6f8fb,#eef2f6); background-size:200% 100%; animation:skel 1.4s linear infinite; border-radius:8px;}
@keyframes skel { 0%{background-position:200% 0;} 100%{background-position:-200% 0;} }

/* ---------- Toast ---------- */
.ds-toast-host { position:fixed; bottom:1.25rem; right:1.25rem; z-index:90; display:flex; flex-direction:column; gap:.5rem; }
.ds-toast { background:var(--ink-900); color:#fff; padding:.8rem 1.1rem; border-radius:var(--r-md); box-shadow:var(--shadow-3); font-size:.88rem; max-width:360px; }
.ds-toast.ok { background-image:var(--grad); }
.ds-toast.bad { background:#b91c1c; }

:focus-visible { outline:3px solid rgba(59,130,246,.35); outline-offset:2px; border-radius:8px; }

/* ---------- FAQ ---------- */
.ds-faq summary { cursor:pointer; list-style:none; display:flex; justify-content:space-between; align-items:center; gap:1rem; }
.ds-faq summary::-webkit-details-marker { display:none; }
.ds-faq summary::after { content:"+"; font-size:1.4rem; color:var(--ink-400); transition:transform .2s; }
.ds-faq[open] summary::after { transform:rotate(45deg); color:var(--ag); }

/* ---------- Floating product mockup ---------- */
.ds-float { animation:float 8s ease-in-out infinite; }
@keyframes float { 0%,100%{ transform:translateY(0);} 50%{ transform:translateY(-12px);} }

/* ---------- Pattern grid bg ---------- */
.ds-grid-bg {
  background-image:
    linear-gradient(rgba(15,23,42,.04) 1px,transparent 1px),
    linear-gradient(90deg,rgba(15,23,42,.04) 1px,transparent 1px);
  background-size:48px 48px;
  mask-image:radial-gradient(ellipse 60% 50% at 50% 0%,#000 40%,transparent 80%);
}

/* ---------- Stat ticker ---------- */
.ds-stat-num { font-family:'Space Grotesk',sans-serif; font-weight:700; letter-spacing:-.04em; font-variant-numeric:tabular-nums; }

/* ---------- Sidebar (app shell) ---------- */
.ds-aside-section { font-size:.66rem; text-transform:uppercase; letter-spacing:.12em; color:var(--ink-400); font-weight:700; padding:1.1rem .85rem .35rem; }

/* ---------- Global app classes (usable outside dashboard shell) ---------- */
.glass {
  background:rgba(255,255,255,.78);
  backdrop-filter:blur(16px) saturate(180%);
  border:1px solid rgba(15,23,42,.06);
  box-shadow:0 1px 0 rgba(255,255,255,.8) inset, 0 10px 40px -18px rgba(15,23,42,.14);
  border-radius:22px;
}
.gradient-text { background-image:var(--grad); -webkit-background-clip:text; background-clip:text; color:transparent; }

.btn { display:inline-flex; align-items:center; justify-content:center; gap:.5rem; padding:.65rem 1.05rem; border-radius:12px; font-weight:600; font-size:.9rem; line-height:1; transition:transform .15s var(--ease), box-shadow .2s, background .2s, border-color .2s, color .15s; cursor:pointer; border:1px solid transparent; white-space:nowrap; }
.btn:focus-visible { outline:3px solid rgba(59,130,246,.35); outline-offset:2px; }
.btn-primary { color:#fff; background:var(--ink-900); box-shadow:0 8px 20px -12px rgba(15,23,42,.5); }
.btn-primary:hover { background:#000; transform:translateY(-1px); }
.btn-accent { color:#fff; background-image:var(--grad); box-shadow:var(--glow-green); }
.btn-accent:hover { transform:translateY(-1px); box-shadow:0 18px 38px -12px rgba(16,185,129,.5); }
.btn-ghost { background:rgba(255,255,255,.9); border:1px solid var(--ink-200); color:var(--ink-900); }
.btn-ghost:hover { background:#fff; border-color:var(--ink-300); }
.btn-danger { background:#fee2e2; color:#991b1b; border:1px solid #fecaca; }
.btn-sm { padding:.45rem .8rem; font-size:.82rem; border-radius:10px; }
.btn-lg { padding:.85rem 1.35rem; font-size:.98rem; border-radius:14px; }

.input, .select, textarea.input, select.input {
  width:100%; padding:.72rem .95rem;
  border:1px solid var(--ink-200); border-radius:12px;
  background:rgba(255,255,255,.9); outline:none;
  font-size:.94rem; color:var(--ink-900);
  transition:border-color .15s, box-shadow .15s, background .2s;
}
.input:focus, .select:focus, textarea.input:focus, select.input:focus, select:focus {
  border-color:var(--ab); box-shadow:0 0 0 4px rgba(59,130,246,.15); background:#fff;
}
.label { display:block; font-size:.78rem; font-weight:600; color:var(--ink-700); margin-bottom:.4rem; letter-spacing:.01em; }

.chip { display:inline-flex; align-items:center; gap:.3rem; padding:.22rem .6rem; border-radius:999px; font-size:.7rem; font-weight:600; background:var(--ink-100); color:var(--ink-700); }
.chip-ok { background:#dcfce7; color:#065f46; }
.chip-warn { background:#fef3c7; color:#92400e; }
.chip-bad { background:#fee2e2; color:#991b1b; }
.chip-info { background:#dbeafe; color:#1e40af; }
.chip-mute { background:#f1f5f9; color:#475569; }

.stat { padding:1.25rem 1.35rem; position:relative; overflow:hidden; }
.stat::before { content:""; position:absolute; inset:0; background:linear-gradient(180deg, rgba(255,255,255,.4), transparent 40%); pointer-events:none; }
.stat .v { font-family:'Space Grotesk',sans-serif; font-size:2rem; font-weight:700; letter-spacing:-.03em; font-variant-numeric:tabular-nums; color:var(--ink-900); }
.stat .l { font-size:.68rem; text-transform:uppercase; letter-spacing:.12em; color:var(--ink-500); font-weight:700; margin-bottom:.35rem; }

.table { width:100%; border-collapse:collapse; }
.table th { text-align:left; font-size:.66rem; text-transform:uppercase; letter-spacing:.1em; color:var(--ink-500); padding:.8rem 1rem; border-bottom:1px solid var(--ink-200); font-weight:700; }
.table td { padding:.9rem 1rem; border-bottom:1px solid #f1f5f9; font-size:.9rem; color:var(--ink-900); vertical-align:middle; }
.table tr:hover td { background:rgba(248,250,252,.7); }
.table-wrap { overflow-x:auto; border-radius:14px; }

/* ---------- App shell (Expinova-style) ---------- */
.ds-shell { --app-sidebar-w:15.5rem; height:100vh; min-height:100vh; overflow:hidden; background:#f4f6fa; }
.ds-shell-side {
  width:min(var(--app-sidebar-w), 86vw) !important;
  max-width:86vw;
  background:#fff;
  border-right:1px solid #edf0f5;
  overflow:hidden;
  will-change:transform;
}
@media (min-width: 768px){
  .ds-shell-side {
    position:fixed !important;
    inset:0 auto 0 0 !important;
    height:100vh;
    max-height:100vh;
    transform:none !important;
  }
  .ds-shell-content { margin-left:var(--app-sidebar-w); width:calc(100vw - var(--app-sidebar-w)); }
}
.ds-shell-content { height:100vh; min-height:0; overflow:hidden; }
.ds-shell-side-inner { padding:1.25rem 1rem; height:100vh; max-height:100vh; display:flex; flex-direction:column; min-height:0; overflow:hidden; }
.ds-shell-brand { display:flex; align-items:center; gap:.6rem; padding:.35rem .5rem 1rem; flex-shrink:0; border-bottom:1px solid #f1f4f9; margin-bottom:.5rem; background:#fff; position:relative; z-index:2; }
.ds-shell-brand-mark { height:36px; width:36px; border-radius:10px; display:flex; align-items:center; justify-content:center; color:#fff; font-weight:700; background:var(--accent, var(--ab)); box-shadow:0 6px 16px -10px var(--accent, var(--ab)); }
.ds-shell-nav { flex:1 1 auto; min-height:0; overflow-y:auto; overflow-x:hidden; overscroll-behavior:contain; scrollbar-width:thin; scrollbar-color:#d7dbe3 transparent; padding-right:.25rem; margin-right:-.25rem; }
.ds-shell-nav::-webkit-scrollbar { width:6px; }
.ds-shell-nav::-webkit-scrollbar-thumb { background:#dfe3ea; border-radius:3px; }
.ds-shell-nav::-webkit-scrollbar-thumb:hover { background:#c7cdd6; }
.ds-shell-foot { flex-shrink:0; border-top:1px solid #f1f4f9; padding-top:.6rem; margin-top:.5rem; }
.ds-shell-section-label { font-size:.68rem; text-transform:uppercase; letter-spacing:.14em; color:var(--ink-400); font-weight:700; padding:1rem .8rem .5rem; }
.ds-shell-section-label:first-child { padding-top:.25rem; }

.ds-topbar { background:#fff; border-bottom:1px solid #edf0f5; padding:.9rem 1.5rem; display:flex; align-items:center; gap:1rem; position:relative; top:auto; z-index:20; flex-shrink:0; }
.ds-topbar-title { font-family:'Space Grotesk',sans-serif; font-size:1.5rem; font-weight:700; letter-spacing:-.02em; color:var(--ink-900); }
.ds-topbar-sub { font-size:.82rem; color:var(--ink-500); margin-top:.1rem; }
.ds-topbar-search { position:relative; flex:1; max-width:380px; }
.ds-topbar-search input { width:100%; padding:.6rem .95rem .6rem 2.4rem; border-radius:999px; border:1px solid #edf0f5; background:#f6f8fc; font-size:.88rem; outline:none; transition:border-color .15s, background .2s, box-shadow .15s; }
.ds-topbar-search input:focus { background:#fff; border-color:var(--accent, var(--ab)); box-shadow:0 0 0 4px color-mix(in oklab, var(--accent, var(--ab)) 14%, transparent); }
.ds-topbar-search svg { position:absolute; left:.9rem; top:50%; transform:translateY(-50%); color:var(--ink-400); }
.ds-topbar-ico { width:38px; height:38px; border-radius:12px; display:inline-flex; align-items:center; justify-content:center; color:var(--ink-600); background:transparent; border:1px solid transparent; transition:background .15s, border-color .15s, color .15s; position:relative; }
.ds-topbar-ico:hover { background:#f6f8fc; color:var(--ink-900); }
.ds-topbar-ico .dot { position:absolute; top:9px; right:9px; width:7px; height:7px; border-radius:999px; background:var(--accent, var(--ab)); box-shadow:0 0 0 2px #fff; }
.ds-topbar-user { display:flex; align-items:center; gap:.6rem; padding:.35rem .8rem .35rem .4rem; border-radius:999px; border:1px solid #edf0f5; background:#fff; transition:border-color .15s, box-shadow .15s; }
.ds-topbar-user:hover { border-color:var(--ink-200); box-shadow:0 4px 14px -10px rgba(15,23,42,.2); }
.ds-topbar-user .av { width:32px; height:32px; border-radius:999px; background:var(--ink-900); color:#fff; display:flex; align-items:center; justify-content:center; font-weight:700; font-size:.82rem; }

.ds-main { padding:1.75rem 2rem 3rem; min-height:0; overflow-y:auto; overflow-x:hidden; overscroll-behavior:contain; }

/* Cards refined */
.glass { background:#fff; backdrop-filter:none; border:1px solid #edf0f5; box-shadow:0 1px 2px rgba(15,23,42,.03); border-radius:16px; }

.gradient-text { background-image:var(--grad); -webkit-background-clip:text; background-clip:text; color:transparent; }

/* Section accents */
body.ds-app.section-user  { --accent:var(--ag); --accent-600:var(--ag-600); --accent-50:var(--ag-50); --glow-accent:var(--glow-green); }
body.ds-app.section-admin { --accent:var(--ab); --accent-600:var(--ab-600); --accent-50:var(--ab-50); --glow-accent:var(--glow-blue); }
body.ds-app .btn-accent { background:var(--accent); background-image:none; box-shadow:0 8px 20px -12px var(--accent); }
body.ds-app .btn-accent:hover { background:var(--accent-600); box-shadow:0 18px 38px -12px var(--accent); }
body.ds-app .gradient-text { background:none; -webkit-text-fill-color:currentColor; color:var(--accent); }

/* Sidebar item — filled active (Expinova reference) */
.sidebar-item { display:flex; align-items:center; gap:.75rem; padding:.65rem .85rem; border-radius:12px; font-size:.895rem; color:var(--ink-600); font-weight:500; transition:background .15s, color .15s; position:relative; }
.sidebar-item:hover { background:#f4f6fa; color:var(--ink-900); }
.sidebar-item .si-ic { width:20px; height:20px; display:flex; align-items:center; justify-content:center; color:var(--ink-400); transition:color .15s; flex-shrink:0; }
.sidebar-item:hover .si-ic { color:var(--ink-700); }
.sidebar-item.active { background:var(--accent, var(--ab)); color:#fff; font-weight:600; box-shadow:0 10px 24px -14px var(--accent, var(--ab)); }
.sidebar-item.active .si-ic { color:#fff; }
.sidebar-item.active:hover { background:var(--accent-600, var(--ab-600)); color:#fff; }
.sidebar-item .si-badge { margin-left:auto; font-size:.66rem; font-weight:700; background:var(--accent, var(--ab)); color:#fff; padding:.08rem .45rem; border-radius:999px; min-width:18px; text-align:center; }
.sidebar-item.active .si-badge { background:rgba(255,255,255,.25); color:#fff; }

.card-hover { transition:transform .2s var(--ease), box-shadow .25s var(--ease); }
.card-hover:hover { transform:translateY(-2px); box-shadow:var(--shadow-3); }
