/* === ORCHESTRATOR DASHBOARD — MATRIX/CYBER REDESIGN 2026 === */

*{margin:0;padding:0;box-sizing:border-box}

/* --- CSS Houdini: Animated angle for rotating borders --- */
@property --angle{
    syntax:'<angle>';
    initial-value:0deg;
    inherits:false;
}

/* --- Design Tokens (Dark = Default — Matrix/Cyber) --- */
:root{
    --bg:#030308;--s:#0a0d14;--s2:#0f1219;--s3:#141a24;
    --b:rgba(0,255,65,.08);--b2:rgba(0,255,65,.15);--b3:rgba(0,255,65,.22);
    --t:#c8e6c9;--td:#4a7c59;--tw:#e0ffe0;
    --neon:#00ff41;--matrix-green:#00ff41;--cyber-cyan:#00e5ff;--electric-purple:#b24dff;
    --a:#00ff41;--a2:#33ff6a;--a3:#66ff8f;
    --ag:linear-gradient(135deg,#00ff41,#00cc33);
    --g:#00ff41;--gg:linear-gradient(135deg,#00ff41,#00cc33);
    --r:#ff4141;--rg:linear-gradient(135deg,#ff4141,#cc2020);
    --y:#ffd700;--bl:#00e5ff;--blg:linear-gradient(135deg,#00e5ff,#00b8d4);
    --cyan:#00e5ff;
    --glow:0 0 20px rgba(0,255,65,.12),0 0 40px rgba(0,255,65,.06);
    --glow-strong:0 0 20px rgba(0,255,65,.25),0 0 50px rgba(0,255,65,.1),0 0 1px rgba(0,255,65,.4);
    --glow-cyan:0 0 20px rgba(0,229,255,.2),0 0 40px rgba(0,229,255,.08);
    --glass:rgba(0,255,65,.03);--glass2:rgba(0,255,65,.05);
    --radius:16px;--radius-sm:10px;--radius-xs:6px;
    --nav-h:56px;--bottom-h:72px;--sidebar-w:60px;--sidebar-w-expanded:200px;
    --font:'JetBrains Mono','SF Mono','Fira Code',monospace;
    --mono:'JetBrains Mono','SF Mono','Fira Code',monospace;
    --font-sans:-apple-system,BlinkMacSystemFont,'SF Pro Display','Inter','Segoe UI',sans-serif;
    --ease:cubic-bezier(.4,0,.2,1);--ease-bounce:cubic-bezier(.34,1.56,.64,1);
    --safe-bottom:env(safe-area-inset-bottom,0px);
    color-scheme:dark;
}

/* --- Light Theme Override --- */
[data-theme="light"]{
    --bg:#f5f5f7;--s:#ffffff;--s2:#f0f0f5;--s3:#e8e8f0;
    --b:rgba(0,0,0,.08);--b2:rgba(0,0,0,.12);--b3:rgba(0,0,0,.18);
    --t:#1a1a2e;--td:#6b7194;--tw:#000;
    --a:#2d8a4e;--a2:#34a058;--a3:#3cb868;
    --ag:linear-gradient(135deg,#2d8a4e,#1e7a3e);
    --g:#059669;--r:#dc2626;--y:#d97706;--bl:#2563eb;--cyan:#0891b2;
    --glass:rgba(255,255,255,.7);--glass2:rgba(255,255,255,.8);
    --glow:0 2px 12px rgba(0,0,0,.06);
    --glow-strong:0 4px 24px rgba(0,0,0,.08),0 0 1px rgba(0,0,0,.1);
    --glow-cyan:0 2px 12px rgba(0,0,0,.06);
    --neon:#2d8a4e;--matrix-green:#2d8a4e;--cyber-cyan:#0891b2;--electric-purple:#6d5bd0;
    --font:-apple-system,BlinkMacSystemFont,'SF Pro Display','Inter','Segoe UI',sans-serif;
    color-scheme:light;
}

/* --- Theme Transition --- */
body,nav,.top-bar,.bottom-nav,.sidebar,.card,.agent-card,.group-card,.modal,.dashboard-footer,
table,th,td,.log-box,.console-box,.memory-card,
input,select,textarea,button.secondary{
    transition:background-color .3s,color .3s,border-color .3s,box-shadow .3s;
}

/* --- Base --- */
body{font-family:var(--font);background:var(--bg);color:var(--t);min-height:100vh;min-height:100dvh;overflow-x:hidden;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}

/* --- Animated Background (Matrix-style floating gradients) --- */
body::before,body::after{content:'';position:fixed;top:-50%;left:-50%;width:200%;height:200%;pointer-events:none;z-index:-1}
body::before{background:radial-gradient(ellipse at 20% 40%,rgba(0,255,65,.06) 0%,transparent 50%),radial-gradient(ellipse at 80% 20%,rgba(0,229,255,.04) 0%,transparent 50%);animation:bgFloat1 25s ease-in-out infinite alternate}
body::after{background:radial-gradient(ellipse at 60% 80%,rgba(0,255,65,.04) 0%,transparent 45%),radial-gradient(ellipse at 30% 70%,rgba(178,77,255,.03) 0%,transparent 40%);animation:bgFloat2 30s ease-in-out infinite alternate-reverse}

/* Light theme: subtle gradients */
[data-theme="light"] body::before{background:radial-gradient(ellipse at 20% 40%,rgba(45,138,78,.04) 0%,transparent 50%),radial-gradient(ellipse at 80% 20%,rgba(8,145,178,.03) 0%,transparent 50%)}
[data-theme="light"] body::after{background:radial-gradient(ellipse at 60% 80%,rgba(45,138,78,.03) 0%,transparent 45%),radial-gradient(ellipse at 30% 70%,rgba(109,91,208,.02) 0%,transparent 40%)}

@keyframes bgFloat1{0%{transform:translate(0,0) rotate(0deg)}50%{transform:translate(-3%,2%) rotate(2deg)}100%{transform:translate(1%,-1%) rotate(-1deg)}}
@keyframes bgFloat2{0%{transform:translate(0,0) rotate(0deg)}50%{transform:translate(2%,-3%) rotate(-2deg)}100%{transform:translate(-1%,1%) rotate(1.5deg)}}

/* --- Scrollbar (Matrix-styled) --- */
::-webkit-scrollbar{width:4px;height:4px}
::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{background:rgba(0,255,65,.2);border-radius:4px}
::-webkit-scrollbar-thumb:hover{background:rgba(0,255,65,.35)}

[data-theme="light"] ::-webkit-scrollbar-thumb{background:rgba(0,0,0,.15)}
[data-theme="light"] ::-webkit-scrollbar-thumb:hover{background:rgba(0,0,0,.25)}

/* ================================
   KEYFRAMES — Matrix/Cyber
   ================================ */
@keyframes fadeUp{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
@keyframes slideUp{from{opacity:0;transform:translateY(24px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}
@keyframes shimmer{0%{background-position:-200% 0}100%{background-position:200% 0}}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.6}}
@keyframes glowPulse{0%,100%{box-shadow:0 0 8px rgba(0,255,65,.4)}50%{box-shadow:0 0 24px rgba(0,255,65,.7)}}
@keyframes dotPulse{0%,100%{box-shadow:0 0 8px rgba(0,255,65,.5)}50%{box-shadow:0 0 18px rgba(0,255,65,.8)}}
@keyframes borderGlow{0%{border-color:rgba(0,229,255,.15)}50%{border-color:rgba(0,229,255,.4)}100%{border-color:rgba(0,229,255,.15)}}
@keyframes countUp{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
@keyframes spinIn{from{opacity:0;transform:rotate(-90deg) scale(0)}to{opacity:1;transform:rotate(0) scale(1)}}
@keyframes ringDraw{from{stroke-dashoffset:var(--ring-c)}to{stroke-dashoffset:var(--ring-offset)}}
@keyframes cardEntrance{from{opacity:0;transform:translateY(20px) scale(.96)}to{opacity:1;transform:translateY(0) scale(1)}}
@keyframes spin{to{transform:rotate(360deg)}}
@keyframes fadeOut{to{opacity:0;transform:translateY(-8px)}}

/* NEW: Matrix-specific keyframes */
@keyframes borderRotate{
    0%{--angle:0deg}
    100%{--angle:360deg}
}
@keyframes scanline{
    0%{transform:translateY(-100%)}
    100%{transform:translateY(100%)}
}
@keyframes neonPulse{
    0%,100%{
        text-shadow:0 0 4px rgba(0,255,65,.4),0 0 10px rgba(0,255,65,.2);
        filter:brightness(1);
    }
    50%{
        text-shadow:0 0 8px rgba(0,255,65,.7),0 0 20px rgba(0,255,65,.4),0 0 40px rgba(0,255,65,.15);
        filter:brightness(1.15);
    }
}
@keyframes flicker{
    0%,100%{opacity:1}
    92%{opacity:1}
    93%{opacity:.8}
    94%{opacity:1}
    96%{opacity:.9}
    97%{opacity:1}
}

/* Stagger animation helper */
.stagger>*{animation:cardEntrance .5s var(--ease) both}
.stagger>*:nth-child(1){animation-delay:.05s}
.stagger>*:nth-child(2){animation-delay:.1s}
.stagger>*:nth-child(3){animation-delay:.12s}
.stagger>*:nth-child(4){animation-delay:.16s}
.stagger>*:nth-child(5){animation-delay:.2s}
.stagger>*:nth-child(6){animation-delay:.24s}
.stagger>*:nth-child(7){animation-delay:.28s}
.stagger>*:nth-child(8){animation-delay:.32s}

/* --- View Transitions --- */
::view-transition-old(page){animation:.25s var(--ease) both fadeOut}
::view-transition-new(page){animation:.3s var(--ease) both slideUp}
main{view-transition-name:page}

/* ================================
   THEME TOGGLE
   ================================ */
.theme-toggle{background:none;border:none;color:var(--td);width:36px;height:36px;cursor:pointer;border-radius:var(--radius-sm);transition:all .25s;display:flex;align-items:center;justify-content:center;margin-left:auto;padding:0}
.theme-toggle:hover{color:var(--neon);background:rgba(0,255,65,.06)}
.theme-toggle .icon-sun,.theme-toggle .icon-moon{width:20px;height:20px;stroke:currentColor;fill:none;stroke-width:1.8;transition:transform .5s var(--ease-bounce),opacity .3s}

/* Dark (default): show moon, hide sun */
.theme-toggle .icon-sun{display:none}
.theme-toggle .icon-moon{display:block}

/* Light: show sun, hide moon */
[data-theme="light"] .theme-toggle .icon-sun{display:block}
[data-theme="light"] .theme-toggle .icon-moon{display:none}
[data-theme="light"] .theme-toggle:hover{color:var(--a);background:rgba(0,0,0,.04)}

/* ================================
   SIDEBAR (Desktop — Collapsed/Expanded)
   ================================ */
/* Sidebar — fixed left column */
.sidebar{
    display:none;
    position:fixed;left:0;top:0;bottom:0;
    width:200px;
    background:rgba(5,8,14,.97);
    border-right:1px solid rgba(0,255,65,.1);
    z-index:55;
    transition:width .3s var(--ease);
}
.sidebar *{box-sizing:border-box}
.sidebar-logo{
    display:flex;align-items:center;gap:10px;
    padding:16px;height:56px;
    border-bottom:1px solid rgba(0,255,65,.08);
}
.sidebar-logo svg{flex-shrink:0}
.sidebar-logo-text{font-weight:700;font-size:15px;color:var(--tw);white-space:nowrap;overflow:hidden}
.sidebar-toggle{
    display:flex;align-items:center;justify-content:center;
    width:calc(100% - 16px);height:32px;margin:4px 8px;
    background:none;border:1px solid rgba(0,255,65,.1);border-radius:6px;
    color:var(--td);cursor:pointer;padding:0;
}
.sidebar-toggle:hover{color:var(--neon);background:rgba(0,255,65,.04)}
.sidebar-toggle svg{transition:transform .3s}
.sidebar-nav{
    display:flex;flex-direction:column;gap:2px;
    padding:8px;align-items:stretch;
}
.sidebar-link{
    display:flex;align-items:center;gap:12px;
    padding:10px 12px;border-radius:8px;
    color:var(--t);text-decoration:none;font-size:14px;font-weight:500;
    white-space:nowrap;width:100%;
}
.sidebar-link svg{width:20px;height:20px;stroke:currentColor;fill:none;stroke-width:1.8;flex-shrink:0}
.sidebar-link span{overflow:hidden}
.sidebar-link:hover{color:var(--neon);background:rgba(0,255,65,.06)}
.sidebar-link.active{color:var(--neon);background:rgba(0,255,65,.1);box-shadow:inset 3px 0 0 var(--neon)}
.sidebar-link.active svg{filter:drop-shadow(0 0 6px rgba(0,255,65,.5))}

/* Light theme sidebar */
[data-theme="light"] .sidebar{background:rgba(255,255,255,.95);border-right:1px solid rgba(0,0,0,.08)}
[data-theme="light"] .sidebar-logo-text{color:var(--t)}
[data-theme="light"] .sidebar-toggle{border-color:rgba(0,0,0,.1)}
[data-theme="light"] .sidebar-toggle:hover{color:var(--a);background:rgba(0,0,0,.03)}
[data-theme="light"] .sidebar-link:hover{color:var(--a);background:rgba(0,0,0,.04)}
[data-theme="light"] .sidebar-link.active{color:var(--a);background:rgba(45,138,78,.08);box-shadow:inset 3px 0 0 var(--a)}

/* Collapsed */
body.sidebar-collapsed .sidebar{width:60px}
body.sidebar-collapsed .sidebar-link span{display:none}
body.sidebar-collapsed .sidebar-logo-text{display:none}
body.sidebar-collapsed .sidebar-toggle svg{transform:rotate(180deg)}
body.sidebar-collapsed main{margin-left:60px}
body.sidebar-collapsed .dashboard-footer{left:60px}
body.sidebar-collapsed nav.top-bar{margin-left:60px}

/* ================================
   TOP NAV (Desktop = top-bar: logo + toggle only)
   ================================ */
nav{display:flex;align-items:center;padding:0 24px;height:var(--nav-h);background:rgba(5,8,14,.9);backdrop-filter:blur(24px) saturate(180%);-webkit-backdrop-filter:blur(24px) saturate(180%);border-bottom:1px solid rgba(0,255,65,.08);gap:24px;position:sticky;top:0;z-index:50;transition:background .3s,margin-left .3s var(--ease)}
.logo{font-weight:800;font-size:20px;background:linear-gradient(135deg,var(--neon),var(--cyber-cyan));-webkit-background-clip:text;-webkit-text-fill-color:transparent;letter-spacing:-.5px;display:flex;align-items:center;gap:8px;animation:neonPulse 4s ease-in-out infinite}
.logo::before{content:'⚡';-webkit-text-fill-color:initial;font-size:18px;filter:drop-shadow(0 0 8px rgba(0,255,65,.6))}
.nav-links{display:flex;gap:2px}
.nav-link{color:var(--td);text-decoration:none;padding:8px 16px;border-radius:var(--radius-sm);font-size:13px;font-weight:500;transition:all .25s var(--ease);position:relative}
.nav-link:hover{color:var(--neon);background:rgba(0,255,65,.06)}
.nav-link.active{color:#fff;background:linear-gradient(135deg,rgba(0,255,65,.2),rgba(0,229,255,.15));box-shadow:0 2px 16px rgba(0,255,65,.2),inset 0 0 0 1px rgba(0,255,65,.2)}

[data-theme="light"] nav{background:rgba(255,255,255,.9);border-bottom:1px solid rgba(0,0,0,.06)}
[data-theme="light"] .logo{animation:none}
[data-theme="light"] .nav-link:hover{color:var(--a);background:rgba(0,0,0,.04)}
[data-theme="light"] .nav-link.active{color:#fff;background:var(--ag);box-shadow:0 2px 12px rgba(45,138,78,.2)}

/* ================================
   BOTTOM NAV (Mobile) — iOS-Style
   ================================ */
.bottom-nav{display:none;position:fixed;bottom:0;left:0;right:0;height:calc(var(--bottom-h) + var(--safe-bottom));background:rgba(3,3,8,.94);backdrop-filter:blur(24px) saturate(200%);-webkit-backdrop-filter:blur(24px) saturate(200%);border-top:1px solid rgba(0,255,65,.08);z-index:50;padding:0 4px;padding-bottom:var(--safe-bottom)}
.bottom-nav .nav-items{display:flex;justify-content:space-around;align-items:center;height:var(--bottom-h)}
.bottom-nav .nav-item{display:flex;flex-direction:column;align-items:center;gap:3px;padding:6px 0;border-radius:12px;text-decoration:none;color:var(--td);font-size:10px;font-weight:500;transition:all .25s var(--ease);min-width:52px;position:relative;-webkit-tap-highlight-color:transparent}
.bottom-nav .nav-item svg{width:22px;height:22px;stroke:currentColor;fill:none;stroke-width:1.8;transition:all .3s var(--ease-bounce)}
.bottom-nav .nav-item:active svg{transform:scale(.85)}
.bottom-nav .nav-item.active{color:var(--neon)}
.bottom-nav .nav-item.active svg{stroke:var(--neon);filter:drop-shadow(0 0 8px rgba(0,255,65,.5));transform:scale(1.05)}
/* Active glow dot */
.bottom-nav .nav-item.active::before{content:'';position:absolute;top:-1px;left:50%;transform:translateX(-50%);width:20px;height:3px;background:var(--neon);border-radius:3px;box-shadow:0 2px 8px rgba(0,255,65,.6);animation:fadeIn .3s var(--ease)}

[data-theme="light"] .bottom-nav{background:rgba(245,245,247,.92);border-top:1px solid rgba(0,0,0,.08)}
[data-theme="light"] .bottom-nav .nav-item.active{color:var(--a)}
[data-theme="light"] .bottom-nav .nav-item.active svg{stroke:var(--a);filter:none}
[data-theme="light"] .bottom-nav .nav-item.active::before{background:var(--a);box-shadow:0 2px 8px rgba(45,138,78,.3)}

/* ================================
   MAIN CONTENT
   ================================ */
main{max-width:1400px;margin-right:auto;padding:20px 20px 52px;min-height:calc(100dvh - var(--nav-h));transition:margin-left .3s var(--ease)}

/* ================================
   SKELETON LOADING
   ================================ */
.skeleton{background:linear-gradient(90deg,rgba(0,255,65,.03) 25%,rgba(0,255,65,.06) 50%,rgba(0,255,65,.03) 75%);background-size:200% 100%;animation:shimmer 1.5s ease infinite;border-radius:var(--radius-sm);pointer-events:none}
.skeleton-card{height:100px;border-radius:var(--radius)}
.skeleton-row{height:48px;margin-bottom:8px}
.skeleton-text{height:14px;width:60%;margin-bottom:8px}
.skeleton-text.short{width:30%}

[data-theme="light"] .skeleton{background:linear-gradient(90deg,rgba(0,0,0,.04) 25%,rgba(0,0,0,.08) 50%,rgba(0,0,0,.04) 75%);background-size:200% 100%}

/* ================================
   GLASS CARDS — with rotating gradient border
   ================================ */
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px;margin-bottom:20px}
.card{
    background:rgba(5,10,18,.8);
    backdrop-filter:blur(16px) saturate(180%);-webkit-backdrop-filter:blur(16px) saturate(180%);
    border:1px solid rgba(0,255,65,.1);border-radius:var(--radius);
    padding:20px 24px;transition:all .35s var(--ease);
    position:relative;overflow:hidden;
}
/* Rotating gradient border via ::before */
.card::before{
    content:'';position:absolute;inset:-1px;border-radius:var(--radius);
    background:conic-gradient(from var(--angle),transparent 40%,var(--neon) 50%,var(--cyber-cyan) 55%,transparent 60%);
    opacity:0;transition:opacity .4s var(--ease);
    animation:borderRotate 4s linear infinite;
    z-index:-1;
}
.card::after{
    content:'';position:absolute;inset:1px;border-radius:calc(var(--radius) - 1px);
    background:rgba(5,10,18,.95);
    z-index:-1;
}
.card:hover{border-color:rgba(0,255,65,.25);transform:translateY(-3px);box-shadow:var(--glow-strong)}
.card:hover::before{opacity:1}
.card h3{font-size:11px;color:var(--td);text-transform:uppercase;letter-spacing:1px;margin-bottom:8px;font-weight:600}
.card .val{font-size:2.5rem;font-weight:800;letter-spacing:-1px;line-height:1;animation:countUp .5s var(--ease) both;font-family:var(--mono);color:var(--neon)}
.card .sub{font-size:12px;color:var(--td);margin-top:6px;font-weight:500}

/* Card accent glow variants */
.card.accent-glow:hover{box-shadow:0 0 30px rgba(0,255,65,.15),0 0 60px rgba(0,255,65,.06),inset 0 0 0 1px rgba(0,255,65,.15)}
.card.green-glow:hover{box-shadow:0 0 30px rgba(0,255,65,.2),0 0 60px rgba(0,255,65,.08),inset 0 0 0 1px rgba(0,255,65,.2)}
.card.blue-glow:hover{box-shadow:0 0 30px rgba(0,229,255,.15),0 0 60px rgba(0,229,255,.06),inset 0 0 0 1px rgba(0,229,255,.15)}

[data-theme="light"] .card{background:var(--glass);border:1px solid var(--b);box-shadow:0 1px 3px rgba(0,0,0,.04)}
[data-theme="light"] .card::before{display:none}
[data-theme="light"] .card::after{display:none}
[data-theme="light"] .card:hover{box-shadow:var(--glow-strong)}
[data-theme="light"] .card .val{color:var(--t);font-family:var(--font)}

/* ================================
   BADGES
   ================================ */
.badge{display:inline-flex;align-items:center;padding:3px 10px;border-radius:20px;font-size:11px;font-weight:600;letter-spacing:.3px;transition:all .25s}
.b-idle,.b-completed{background:rgba(0,255,65,.1);color:var(--g);border:1px solid rgba(0,255,65,.2)}
.b-active,.b-running{background:rgba(0,229,255,.1);color:var(--bl);border:1px solid rgba(0,229,255,.2);animation:pulse 2s ease-in-out infinite}
.b-pending{background:rgba(255,215,0,.08);color:var(--y);border:1px solid rgba(255,215,0,.2)}
.b-waiting{background:rgba(178,77,255,.08);color:var(--electric-purple);border:1px solid rgba(178,77,255,.2)}
.b-failed{background:rgba(255,65,65,.08);color:var(--r);border:1px solid rgba(255,65,65,.2)}
.b-busy{background:rgba(0,229,255,.1);color:var(--cyber-cyan);border:1px solid rgba(0,229,255,.2);animation:pulse 2s ease-in-out infinite}
.b-claude{background:rgba(178,77,255,.08);color:var(--electric-purple);border:1px solid rgba(178,77,255,.15);font-size:10px}
.b-codex{background:rgba(0,229,255,.08);color:var(--cyan);border:1px solid rgba(0,229,255,.15);font-size:10px}

/* Light theme badges */
[data-theme="light"] .b-idle,[data-theme="light"] .b-completed{background:rgba(5,150,105,.08);color:#059669;border-color:rgba(5,150,105,.2)}
[data-theme="light"] .b-active,[data-theme="light"] .b-running{background:rgba(37,99,235,.08);color:#2563eb;border-color:rgba(37,99,235,.2)}
[data-theme="light"] .b-pending{background:rgba(217,119,6,.08);color:#d97706;border-color:rgba(217,119,6,.2)}
[data-theme="light"] .b-waiting{background:rgba(109,91,208,.08);color:#6d5bd0;border-color:rgba(109,91,208,.2)}
[data-theme="light"] .b-failed{background:rgba(220,38,38,.06);color:#dc2626;border-color:rgba(220,38,38,.2)}
[data-theme="light"] .b-busy{background:rgba(8,145,178,.08);color:#0891b2;border-color:rgba(8,145,178,.2)}
[data-theme="light"] .b-claude{background:rgba(109,91,208,.06);color:#6d5bd0;border-color:rgba(109,91,208,.15)}
[data-theme="light"] .b-codex{background:rgba(8,145,178,.06);color:#0891b2;border-color:rgba(8,145,178,.15)}

/* Status dot with neon pulse */
.status-dot{width:10px;height:10px;border-radius:50%;display:inline-block;margin-right:6px;flex-shrink:0}
.status-dot.ok{background:var(--neon);box-shadow:0 0 8px rgba(0,255,65,.5);animation:neonPulse 2.5s ease-in-out infinite,dotPulse 2.5s ease-in-out infinite}
.status-dot.err{background:var(--r);box-shadow:0 0 8px rgba(255,65,65,.5)}

[data-theme="light"] .status-dot.ok{background:var(--g);box-shadow:0 0 6px rgba(5,150,105,.3);animation:none}

/* ================================
   TABLES
   ================================ */
table{width:100%;border-collapse:collapse;background:rgba(5,10,18,.6);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-radius:var(--radius);overflow:hidden;border:1px solid rgba(0,255,65,.08)}
th{text-align:left;padding:12px 16px;font-size:10px;color:var(--neon);text-transform:uppercase;letter-spacing:.8px;border-bottom:1px solid rgba(0,255,65,.1);font-weight:600;background:rgba(0,255,65,.03)}
td{padding:12px 16px;font-size:13px;border-bottom:1px solid rgba(0,255,65,.04)}
tr:last-child td{border-bottom:none}
tr.clickable{cursor:pointer;transition:all .2s var(--ease)}
tr.clickable:hover{background:rgba(0,255,65,.04)}
tr.clickable:active{background:rgba(0,255,65,.07)}

[data-theme="light"] table{background:var(--glass);border:1px solid var(--b)}
[data-theme="light"] th{background:rgba(0,0,0,.03);color:var(--td);border-bottom-color:var(--b)}
[data-theme="light"] td{border-bottom-color:rgba(0,0,0,.04)}

/* ================================
   AGENT CARDS
   ================================ */
.agents-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:12px}
.agent-card{background:rgba(5,10,18,.8);backdrop-filter:blur(16px) saturate(180%);-webkit-backdrop-filter:blur(16px) saturate(180%);border:1px solid rgba(0,255,65,.08);border-radius:var(--radius);padding:18px;transition:all .35s var(--ease);position:relative;overflow:hidden}
.agent-card:hover{border-color:rgba(0,255,65,.2);transform:translateY(-3px);box-shadow:var(--glow-strong)}
.agent-card .role{font-size:15px;font-weight:700;margin-bottom:6px;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.agent-card .stats{display:flex;gap:16px;margin-top:12px;font-size:12px;color:var(--td);font-weight:500}
.agent-card .bar{height:4px;background:rgba(0,255,65,.08);border-radius:4px;margin-top:10px;overflow:hidden}
.agent-card .bar-fill{height:100%;border-radius:4px;background:linear-gradient(90deg,var(--neon),var(--cyber-cyan));transition:width .8s var(--ease);box-shadow:0 0 8px rgba(0,255,65,.3)}

/* Active agent card glow border */
.agent-card.is-active{border-color:rgba(0,229,255,.25);animation:borderGlow 3s ease-in-out infinite}

[data-theme="light"] .agent-card{background:var(--glass);border:1px solid var(--b)}
[data-theme="light"] .agent-card:hover{box-shadow:var(--glow-strong)}
[data-theme="light"] .agent-card .bar{background:rgba(0,0,0,.06)}
[data-theme="light"] .agent-card .bar-fill{background:var(--ag);box-shadow:none}

/* ================================
   LOGS
   ================================ */
.log-box{background:rgba(5,10,18,.8);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid rgba(0,255,65,.08);border-radius:var(--radius);padding:14px;max-height:600px;overflow-y:auto;font-family:var(--mono);font-size:12px}
.log-entry{padding:5px 0;border-bottom:1px solid rgba(0,255,65,.03);display:flex;gap:10px;align-items:flex-start;transition:background .15s}
.log-entry:hover{background:rgba(0,255,65,.03);border-radius:var(--radius-xs)}
.log-time{color:var(--td);white-space:nowrap;min-width:60px;font-size:11px}
.log-src{color:var(--cyber-cyan);min-width:80px;font-weight:600;font-size:11px}
.log-msg{color:var(--t);word-break:break-word;line-height:1.5}
.log-entry.error .log-msg{color:var(--r)}
.log-entry.warning .log-msg{color:var(--y)}

[data-theme="light"] .log-box{background:var(--glass);border:1px solid var(--b)}
[data-theme="light"] .log-entry{border-bottom-color:rgba(0,0,0,.04)}
[data-theme="light"] .log-entry:hover{background:rgba(0,0,0,.02)}
[data-theme="light"] .log-src{color:var(--cyan)}

/* ================================
   FORMS
   ================================ */
.form-row{display:flex;gap:10px;margin-bottom:10px;flex-wrap:wrap}
input,select,textarea{background:var(--s2);border:1px solid rgba(0,255,65,.1);color:var(--t);padding:12px 16px;border-radius:var(--radius-sm);font-size:14px;font-family:var(--font);outline:none;transition:all .25s var(--ease)}
input:focus,select:focus,textarea:focus{border-color:var(--neon);box-shadow:0 0 0 3px rgba(0,255,65,.1),0 0 20px rgba(0,255,65,.06)}
input::placeholder,textarea::placeholder{color:var(--td)}
textarea{resize:vertical;min-height:50px}
button{background:linear-gradient(135deg,var(--neon),#00cc33);color:#000;border:none;padding:12px 24px;border-radius:var(--radius-sm);font-size:14px;font-weight:700;cursor:pointer;transition:all .25s var(--ease);font-family:var(--font);position:relative;overflow:hidden}
button:hover{transform:translateY(-1px);box-shadow:0 0 20px rgba(0,255,65,.35),0 4px 16px rgba(0,255,65,.2)}
button:active{transform:translateY(0) scale(.98)}
button.secondary{background:var(--s3);border:1px solid rgba(0,255,65,.1);color:var(--t)}
button.secondary:hover{background:var(--s2);box-shadow:none;border-color:rgba(0,255,65,.2)}
button.danger{background:var(--rg);color:#fff}
button.danger:hover{box-shadow:0 0 20px rgba(255,65,65,.3),0 4px 16px rgba(255,65,65,.15)}
button.small{padding:5px 12px;font-size:11px;border-radius:8px}

[data-theme="light"] input,[data-theme="light"] select,[data-theme="light"] textarea{background:var(--s2);border:1px solid var(--b)}
[data-theme="light"] input:focus,[data-theme="light"] select:focus,[data-theme="light"] textarea:focus{border-color:var(--a);box-shadow:0 0 0 3px rgba(45,138,78,.1)}
[data-theme="light"] button{background:var(--ag);color:#fff}
[data-theme="light"] button:hover{box-shadow:0 4px 16px rgba(45,138,78,.2)}
[data-theme="light"] button.secondary{background:var(--s3);border:1px solid var(--b);color:var(--t)}

/* Button loading state */
button.loading{pointer-events:none;opacity:.7}
button.loading::after{content:'';position:absolute;width:16px;height:16px;border:2px solid rgba(0,0,0,.3);border-top-color:#000;border-radius:50%;animation:spin .6s linear infinite;right:12px;top:50%;margin-top:-8px}

/* ================================
   SECTIONS & HEADINGS
   ================================ */
h2{font-size:22px;font-weight:800;margin-bottom:18px;display:flex;align-items:center;gap:10px;letter-spacing:-.3px}
h2 .page-icon{width:32px;height:32px;border-radius:10px;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,rgba(0,255,65,.2),rgba(0,229,255,.15));flex-shrink:0;box-shadow:0 0 16px rgba(0,255,65,.2),0 4px 12px rgba(0,255,65,.1);border:1px solid rgba(0,255,65,.2)}
h2 .page-icon svg{width:16px;height:16px;stroke:var(--neon);fill:none;stroke-width:2}
.section{margin-bottom:20px}
.section h3{margin-bottom:10px;color:var(--td);font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.5px}
code{font-size:12px;color:var(--neon);font-family:var(--mono);background:rgba(0,255,65,.06);padding:2px 6px;border-radius:4px}

[data-theme="light"] h2 .page-icon{background:var(--ag);border:none;box-shadow:0 4px 12px rgba(45,138,78,.2)}
[data-theme="light"] h2 .page-icon svg{stroke:#fff}
[data-theme="light"] code{color:#059669;background:rgba(5,150,105,.06)}

/* ================================
   MODAL
   ================================ */
.modal-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,.7);display:flex;align-items:center;justify-content:center;z-index:100;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);animation:fadeIn .2s var(--ease)}
.modal-overlay.hidden{display:none}
.modal{background:var(--s);border:1px solid rgba(0,255,65,.12);border-radius:var(--radius);width:90%;max-width:900px;max-height:85vh;display:flex;flex-direction:column;animation:slideUp .35s var(--ease);box-shadow:0 24px 64px rgba(0,0,0,.6),0 0 40px rgba(0,255,65,.05),0 0 1px rgba(0,255,65,.2)}
.modal-header{display:flex;justify-content:space-between;align-items:center;padding:18px 22px;border-bottom:1px solid rgba(0,255,65,.08)}
.modal-header h3{font-size:16px;font-weight:700}
.modal-close{background:none;border:none;color:var(--td);font-size:24px;cursor:pointer;padding:4px 8px;border-radius:6px;transition:all .2s}
.modal-close:hover{color:var(--neon);background:rgba(0,255,65,.06)}
.modal-body{padding:22px;overflow-y:auto;flex:1}
.modal-body .field{margin-bottom:16px}
.modal-body .field label{display:block;font-size:10px;color:var(--td);text-transform:uppercase;letter-spacing:.8px;margin-bottom:6px;font-weight:600}
.modal-body .field .value{font-size:14px}
.modal-body .result-box{background:var(--bg);border:1px solid rgba(0,255,65,.08);border-radius:var(--radius-sm);padding:16px;font-family:var(--mono);font-size:12px;line-height:1.7;white-space:pre-wrap;word-break:break-word;max-height:400px;overflow-y:auto}

[data-theme="light"] .modal-overlay{background:rgba(0,0,0,.3)}
[data-theme="light"] .modal{background:var(--s);border:1px solid var(--b2);box-shadow:0 24px 64px rgba(0,0,0,.12),0 0 1px rgba(0,0,0,.1)}
[data-theme="light"] .modal-header{border-bottom:1px solid var(--b)}

/* ================================
   DAG
   ================================ */
.dag-row{display:flex;gap:6px;align-items:center;flex-wrap:wrap}
.dag-node{padding:4px 10px;border-radius:8px;font-size:11px;font-family:var(--mono);font-weight:600;transition:all .2s var(--ease);border:1px solid transparent}
.dag-node:hover{transform:scale(1.08)}
.dag-arrow{color:var(--td);font-size:11px}
.dag-node.completed{background:rgba(0,255,65,.08);color:var(--g);border-color:rgba(0,255,65,.2)}
.dag-node.running{background:rgba(0,229,255,.08);color:var(--bl);border-color:rgba(0,229,255,.2);animation:pulse 2s infinite}
.dag-node.pending{background:rgba(255,215,0,.06);color:var(--y);border-color:rgba(255,215,0,.2)}
.dag-node.waiting{background:rgba(178,77,255,.06);color:var(--electric-purple);border-color:rgba(178,77,255,.2)}
.dag-node.failed{background:rgba(255,65,65,.06);color:var(--r);border-color:rgba(255,65,65,.2)}

/* ================================
   GROUP CARDS
   ================================ */
.group-card{background:rgba(5,10,18,.8);backdrop-filter:blur(16px) saturate(180%);-webkit-backdrop-filter:blur(16px) saturate(180%);border:1px solid rgba(0,255,65,.08);border-radius:var(--radius);padding:18px;margin-bottom:12px;transition:all .35s var(--ease);position:relative;overflow:hidden}
.group-card:hover{border-color:rgba(0,255,65,.15);box-shadow:var(--glow)}
.group-card .group-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px;flex-wrap:wrap;gap:8px}
.group-card .group-title{font-weight:700;font-size:14px}
.group-card .group-stats{font-size:12px;color:var(--td);font-weight:500}
.group-card .progress-bar{height:4px;background:rgba(0,255,65,.06);border-radius:4px;overflow:hidden;margin-top:10px}
.group-card .progress-fill{height:100%;border-radius:4px;transition:width .8s var(--ease)}

[data-theme="light"] .group-card{background:var(--glass);border:1px solid var(--b)}
[data-theme="light"] .group-card:hover{box-shadow:var(--glow)}

/* ================================
   TABS
   ================================ */
.tabs{display:flex;gap:4px;margin-bottom:16px;border-bottom:1px solid rgba(0,255,65,.08)}
.tab{color:var(--td);padding:10px 18px;cursor:pointer;font-size:13px;font-weight:500;border-bottom:2px solid transparent;transition:all .25s var(--ease)}
.tab:hover{color:var(--neon)}
.tab.active{color:var(--neon);border-bottom-color:var(--neon);text-shadow:0 0 8px rgba(0,255,65,.3)}

[data-theme="light"] .tab:hover{color:var(--a)}
[data-theme="light"] .tab.active{color:var(--a);border-bottom-color:var(--a);text-shadow:none}

/* ================================
   FILTERS
   ================================ */
.filter-row{display:flex;gap:6px;margin-bottom:16px;align-items:center;flex-wrap:wrap}
.filter-row .filter-btn{padding:6px 14px;border-radius:20px;font-size:12px;cursor:pointer;background:rgba(0,255,65,.04);color:var(--td);border:1px solid rgba(0,255,65,.08);transition:all .25s var(--ease);font-weight:500;-webkit-tap-highlight-color:transparent;user-select:none}
.filter-row .filter-btn:hover,.filter-row .filter-btn.active{background:linear-gradient(135deg,rgba(0,255,65,.15),rgba(0,229,255,.1));color:var(--neon);border-color:rgba(0,255,65,.25);box-shadow:0 0 12px rgba(0,255,65,.15)}
.filter-row .filter-btn:active{transform:scale(.95)}

[data-theme="light"] .filter-row .filter-btn{background:var(--glass);border:1px solid var(--b);color:var(--td)}
[data-theme="light"] .filter-row .filter-btn:hover,[data-theme="light"] .filter-row .filter-btn.active{background:var(--ag);color:#fff;border-color:transparent;box-shadow:0 2px 8px rgba(45,138,78,.15)}

/* ================================
   MEMORY
   ================================ */
.memory-card{background:rgba(5,10,18,.8);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid rgba(0,255,65,.08);border-radius:var(--radius);padding:16px;margin-bottom:10px;cursor:pointer;transition:all .25s var(--ease)}
.memory-card:hover{border-color:rgba(0,255,65,.2);transform:translateY(-2px);box-shadow:var(--glow)}
.memory-card .score{font-size:12px;color:var(--neon);font-weight:700;font-family:var(--mono)}
.memory-card .meta{font-size:11px;color:var(--td);margin-top:4px}
.memory-card .text{font-size:13px;margin-top:8px;line-height:1.6;max-height:80px;overflow:hidden;transition:max-height .4s var(--ease)}
.memory-card.expanded .text{max-height:none}

[data-theme="light"] .memory-card{background:var(--glass);border:1px solid var(--b)}
[data-theme="light"] .memory-card:hover{box-shadow:var(--glow)}
[data-theme="light"] .memory-card .score{color:var(--g);font-family:var(--font)}

/* ================================
   CONSOLE OUTPUT (Task Modal) — Matrix terminal
   ================================ */
.console-box{
    background:#020504;
    border:1px solid rgba(0,255,65,.12);
    border-radius:var(--radius-sm);
    padding:14px;font-family:var(--mono);font-size:12px;line-height:1.7;
    max-height:300px;overflow-y:auto;white-space:pre-wrap;word-break:break-word;
    color:#00ff41;
    position:relative;
    text-shadow:0 0 4px rgba(0,255,65,.3);
}
/* Scanline overlay */
.console-box::after{
    content:'';position:absolute;top:0;left:0;right:0;bottom:0;
    pointer-events:none;
    background:repeating-linear-gradient(
        0deg,
        transparent,
        transparent 2px,
        rgba(0,255,65,.015) 2px,
        rgba(0,255,65,.015) 4px
    );
    z-index:1;
}
.console-line{padding:1px 0;border-bottom:1px solid rgba(0,255,65,.04)}
.console-line:last-child{border-bottom:none}
.console-placeholder{color:var(--td);font-style:italic;text-shadow:none}
.console-live-badge{display:inline-flex;align-items:center;gap:4px;margin-left:8px;padding:2px 8px;border-radius:10px;font-size:10px;font-weight:700;color:var(--r);background:rgba(255,65,65,.08);border:1px solid rgba(255,65,65,.2);animation:pulse 2s ease-in-out infinite;text-transform:uppercase;letter-spacing:.5px;vertical-align:middle}

[data-theme="light"] .console-box{background:#f0f0f5;color:#1a1a2e;text-shadow:none;border:1px solid var(--b)}
[data-theme="light"] .console-box::after{display:none}
[data-theme="light"] .console-line{border-bottom-color:rgba(0,0,0,.04)}

/* ================================
   FOOTER
   ================================ */
.dashboard-footer{position:fixed;bottom:0;left:0;right:0;height:36px;background:rgba(3,3,8,.92);backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);border-top:1px solid rgba(0,255,65,.08);display:flex;align-items:center;justify-content:space-between;padding:0 24px;font-size:11px;color:var(--td);z-index:40;font-family:var(--mono);transition:left .3s var(--ease)}
.footer-info{display:flex;gap:20px;align-items:center}
.footer-actions{display:flex;gap:10px;align-items:center}
#footer-cleanup-result{font-size:11px;color:var(--td)}

[data-theme="light"] .dashboard-footer{background:rgba(255,255,255,.9);border-top:1px solid rgba(0,0,0,.06)}

/* ================================
   STAT RING (Overview)
   ================================ */
.stat-ring{position:relative;flex-shrink:0}
.stat-ring svg{transform:rotate(-90deg)}
.stat-ring circle{fill:none;stroke-width:4}
.stat-ring .bg{stroke:rgba(0,255,65,.08)}
.stat-ring .fg{stroke-linecap:round;animation:ringDraw .8s var(--ease) both;filter:drop-shadow(0 0 4px rgba(0,255,65,.3))}
.stat-ring .ring-val{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-size:12px;font-weight:800;font-family:var(--mono);color:var(--neon)}

[data-theme="light"] .stat-ring .bg{stroke:var(--b)}
[data-theme="light"] .stat-ring .fg{filter:none}
[data-theme="light"] .stat-ring .ring-val{color:var(--t);font-family:var(--font)}

/* ================================
   OVERVIEW GRID
   ================================ */
.overview-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}

/* Pipeline mini cards */
.pipeline-cards{display:grid;grid-template-columns:repeat(5,1fr);gap:8px}
.pipeline-card{text-align:center;padding:12px 6px;background:rgba(5,10,18,.6);border:1px solid rgba(0,255,65,.06);border-radius:var(--radius-sm);transition:all .3s var(--ease);cursor:pointer}
.pipeline-card:hover{border-color:rgba(0,255,65,.2);box-shadow:0 0 12px rgba(0,255,65,.08)}
.pipeline-card .pipe-label{font-size:9px;color:var(--td);text-transform:uppercase;letter-spacing:.8px;font-weight:600;margin-bottom:6px}
.pipeline-card .pipe-val{font-size:28px;font-weight:800;letter-spacing:-.5px;animation:countUp .4s var(--ease) both;font-family:var(--mono);color:var(--neon)}

[data-theme="light"] .pipeline-card{background:var(--glass);border:1px solid var(--b)}
[data-theme="light"] .pipeline-card:hover{box-shadow:var(--glow)}
[data-theme="light"] .pipeline-card .pipe-val{color:var(--t);font-family:var(--font)}

/* Card detail text */
.card-detail{font-size:11px;color:var(--td);margin-top:4px;line-height:1.5;font-weight:400}
[data-theme="light"] .card-detail{color:var(--td)}

/* ETA badge */
.eta-badge{display:inline-flex;align-items:center;gap:4px;padding:2px 8px;border-radius:10px;font-size:11px;font-weight:600;color:var(--cyber-cyan);background:rgba(0,229,255,.08);border:1px solid rgba(0,229,255,.15)}
[data-theme="light"] .eta-badge{color:#0891b2;background:rgba(8,145,178,.06);border-color:rgba(8,145,178,.15)}

/* ================================
   RESPONSIVE (Mobile-First Breakpoints)
   ================================ */
@media(max-width:768px){
    nav{padding:0 16px;height:48px;margin-left:0!important}
    nav .nav-links{display:none}
    .sidebar{display:none!important}
    .bottom-nav{display:block}
    main{padding:16px 14px calc(var(--bottom-h) + var(--safe-bottom) + 48px);margin-top:0;min-height:calc(100dvh - 48px);margin-left:0!important}
    .dashboard-footer{bottom:calc(var(--bottom-h) + var(--safe-bottom));font-size:10px;padding:0 14px;height:32px;left:0!important}

    .cards{grid-template-columns:repeat(2,1fr);gap:10px}
    .card .val{font-size:24px}
    .card{padding:14px}
    /* Disable rotating border on mobile for performance */
    .card::before,.card::after{display:none}

    .agents-grid{grid-template-columns:1fr}
    .modal{width:96%;max-height:92vh;border-radius:14px}
    .modal-body{padding:16px}

    h2{font-size:18px;margin-bottom:14px}
    .form-row{flex-direction:column}
    .form-row input,.form-row select,.form-row textarea,.form-row button{width:100%}
    button{padding:14px 24px;font-size:15px}

    .filter-row{gap:6px;overflow-x:auto;flex-wrap:nowrap;-webkit-overflow-scrolling:touch;scrollbar-width:none;padding-bottom:4px}
    .filter-row::-webkit-scrollbar{display:none}
    .filter-row .filter-btn{flex-shrink:0}

    table{font-size:12px}
    th,td{padding:10px 10px}
    .group-card{padding:14px}
    .group-card table th:nth-child(4),.group-card table td:nth-child(4),
    .group-card table th:nth-child(5),.group-card table td:nth-child(5){display:none}

    .log-box{font-size:11px;max-height:70vh}
    .section h3{font-size:11px}
    .overview-grid{grid-template-columns:1fr!important}
    .pipeline-cards{grid-template-columns:repeat(3,1fr)}

    /* Stat ring larger on mobile */
    .stat-ring{width:56px!important;height:56px!important}
}

@media(max-width:380px){
    .cards{grid-template-columns:repeat(2,1fr);gap:8px}
    .card{padding:12px}
    .card .val{font-size:20px}
    main{padding:12px 10px calc(var(--bottom-h) + var(--safe-bottom) + 12px)}
    .pipeline-cards{grid-template-columns:repeat(3,1fr);gap:6px}
    .pipeline-card .pipe-val{font-size:18px}
}

/* ================================
   DESKTOP ENHANCEMENTS (769px+)
   ================================ */
@media(min-width:769px){
    /* Show sidebar, hide top-bar nav-links */
    .sidebar{display:flex;flex-direction:column}
    .top-bar .nav-links{display:none}

    /* Offset everything for sidebar */
    .top-bar{margin-left:200px;transition:margin-left .3s}
    main{margin-left:200px;transition:margin-left .3s}
    .dashboard-footer{left:200px;transition:left .3s}

    /* Hover enhancements */
    .card:hover{transform:translateY(-4px) scale(1.01)}
    .agent-card:hover{transform:translateY(-4px) scale(1.01)}
    .group-card:hover{transform:translateY(-2px)}

    /* Neon glow on card hover */
    .card:hover{box-shadow:0 0 30px rgba(0,255,65,.15),0 0 60px rgba(0,255,65,.05),0 8px 32px rgba(0,0,0,.3)}
    .agent-card:hover{box-shadow:0 0 25px rgba(0,229,255,.12),0 0 50px rgba(0,229,255,.04),0 8px 32px rgba(0,0,0,.3)}

    /* Console scanline animation on desktop */
    .console-box{overflow:hidden}
}

/* Light theme: disable all matrix effects on desktop */
[data-theme="light"] .card:hover{box-shadow:var(--glow-strong)}
[data-theme="light"] .agent-card:hover{box-shadow:var(--glow-strong)}