/* ─── Google Material Icons ─── */
@import url('https://fonts.googleapis.com/icon?family=Material+Icons');
.material-icons {
  font-size: 1.125rem;      /* matches legacy emoji size */
  line-height: 1;
  vertical-align: middle;
  user-select: none;
}

/* ─── Layout Density Modifiers ─── */
:root[data-theme-density="compact"] .pad { padding: 3rem 1.5rem !important; }
:root[data-theme-density="compact"] .pad-sm { padding: 1.5rem 1.5rem !important; }
:root[data-theme-density="compact"] .hero { padding: 6rem 1.5rem 2rem !important; }
:root[data-theme-density="compact"] .btn { padding: 0.5rem 1.2rem !important; font-size: 0.85rem !important; }
:root[data-theme-density="compact"] .tl-content { padding: 1rem !important; }
:root[data-theme-density="compact"] .stat-card { padding: 1rem !important; }

/* ─── Reduced Motion ─── */
:root[data-theme-motion="reduced"] *,
:root[data-theme-motion="reduced"] *::before,
:root[data-theme-motion="reduced"] *::after {
  animation-duration: 0.001s !important;
  transition-duration: 0.001s !important;
  scroll-behavior: auto !important;
}

/* ─── Matte Theme Specific Adjustments ─── */
:root[data-theme-mode="matte"] #stars-canvas { opacity: 0; display: none; }
:root[data-theme-mode="matte"] .glass {
  background: var(--glass);
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  box-shadow: 0 4px 12px rgba(0,0,0,0.5);
  border: 1px solid var(--gb);
}
:root[data-theme-mode="matte"] .glass::before { display: none; }
:root[data-theme-mode="matte"] .nav-inner { background: #1a1a1a; }
:root[data-theme-mode="matte"] .btn-login, :root[data-theme-mode="matte"] .btn-settings { background: transparent; border: 1px solid var(--gb); }
:root[data-theme-mode="matte"] .btn-login:hover, :root[data-theme-mode="matte"] .btn-settings:hover { background: #222222; }
:root[data-theme-mode="matte"] .modal-overlay { background: rgba(5,5,8,0.95); backdrop-filter: none; }
:root[data-theme-mode="matte"] .modal-box { background: #1a1a1a; border: 1px solid var(--gb); }
:root[data-theme-mode="matte"] select, :root[data-theme-mode="matte"] .ai-input { background: #111111 !important; color: var(--txt) !important; border-color: var(--gb) !important; }

/* ─── OLED Stealth Theme Specifics ─── */
:root[data-theme-mode="oled"] #stars-canvas { opacity: 0.1; filter: grayscale(1); }
:root[data-theme-mode="oled"] .glass {
  background: #080808;
  backdrop-filter: none;
  border: 1px solid #1a1a1a;
  box-shadow: none;
}
:root[data-theme-mode="oled"] .nav-inner { background: #000000; border: 1px solid #1a1a1a; }
:root[data-theme-mode="oled"] .btn-pri { filter: brightness(1.2) contrast(1.1); box-shadow: 0 0 15px var(--blueg); }

/* ─── Nebula Radiant Theme Specifics ─── */
:root[data-theme-mode="nebula"] #stars-canvas { opacity: 0.4; filter: hue-rotate(240deg); }
:root[data-theme-mode="nebula"] .grad-text { background: linear-gradient(135deg,#fff, #10b981, #00f5ff); -webkit-background-clip: text; background-clip: text; color: transparent; text-shadow: 0 0 20px rgba(167, 139, 250, 0.3); }
:root[data-theme-mode="nebula"] .glass {
  background: linear-gradient(135deg, rgba(139, 92, 246, 0.08), rgba(0, 245, 255, 0.03));
  border-color: var(--gb);
  box-shadow: 0 8px 32px rgba(10, 1, 24, 0.4), 0 0 15px rgba(139, 92, 246, 0.05);
}
:root[data-theme-mode="nebula"] .hero-eye { background: rgba(0, 245, 255, 0.1); border-color: rgba(0, 245, 255, 0.4); color: #00f5ff; text-shadow: 0 0 8px rgba(0, 245, 255, 0.5); }
:root[data-theme-mode="nebula"] .btn-pri { background: linear-gradient(135deg, #10b981, #00f5ff); box-shadow: 0 0 20px rgba(124, 58, 237, 0.4); }

/* ─── Light Mode Theme Specifics ─── */
:root[data-theme-mode="light"] #stars-canvas { opacity: 0.15; }
:root[data-theme-mode="light"] .glass::before { background: linear-gradient(135deg,rgba(255,255,255,0.5) 0%,transparent 55%); }
:root[data-theme-mode="light"] .btn-login, :root[data-theme-mode="light"] .btn-settings { background: rgba(0,0,0,0.05); border-color: rgba(0,0,0,0.15); color: var(--txt); }
:root[data-theme-mode="light"] .btn-login:hover, :root[data-theme-mode="light"] .btn-settings:hover { background: rgba(0,0,0,0.1); }
:root[data-theme-mode="light"] .modal-box { background: #fdfdfd; }
:root[data-theme-mode="light"] select, :root[data-theme-mode="light"] .ai-input { background: rgba(0,0,0,0.03) !important; color: #000 !important; border-color: rgba(0,0,0,0.2) !important; }
:root[data-theme-mode="light"] #voice-orb { background: rgba(255,255,255,0.6); backdrop-filter: blur(12px); border: 1px solid rgba(0,0,0,0.1); box-shadow: 0 16px 48px rgba(0,0,0,0.08), inset 0 1px 0 rgba(255,255,255,1); }
:root[data-theme-mode="light"] .ai-icon-mask { filter: none; }

/* ─── High-Fidelity Glass Theme Specifics ─── */
:root[data-theme-mode="glass-hifi"] body {
    line-height: 1.6;
}
:root[data-theme-mode="glass-hifi"] .glass {
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.08), rgba(255, 255, 255, 0.03));
    backdrop-filter: blur(25px) saturate(180%);
    -webkit-backdrop-filter: blur(25px) saturate(180%);
    border: 1px solid var(--gb);
    box-shadow:
        0 25px 50px -12px rgba(0, 0, 0, 0.6),
        inset 0 1px 1px rgba(255, 255, 255, 0.2),
        inset 0 -1px 1px rgba(255, 255, 255, 0.05);
}
:root[data-theme-mode="glass-hifi"] .glass:hover {
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.12), rgba(255, 255, 255, 0.05));
    border: 1px solid rgba(255, 255, 255, 0.35);
    box-shadow:
        0 40px 80px -20px rgba(0, 0, 0, 0.8),
        inset 0 1px 2px rgba(255, 255, 255, 0.3);
}
:root[data-theme-mode="glass-hifi"] .hero-h1 {
    background: linear-gradient(135deg, #ffffff, #dbeafe, #94a3b8);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    text-shadow: 0 4px 20px rgba(255, 255, 255, 0.1);
}
:root[data-theme-mode="glass-hifi"] .btn-pri {
    background: linear-gradient(to right, #3b82f6, #4f46e5, #6366f1);
    box-shadow: 0 10px 15px -3px rgba(59, 130, 246, 0.5);
}
:root[data-theme-mode="glass-hifi"] .btn-pri:hover {
    transform: scale(1.05);
    box-shadow: 0 20px 25px -5px rgba(59, 130, 246, 0.6);
}
:root[data-theme-mode="glass-hifi"] ::-webkit-scrollbar-thumb {
    background: #1e293b;
    border-radius: 10px;
}
:root[data-theme-mode="glass-hifi"] ::-webkit-scrollbar-thumb:hover {
    background: #334155;
}

/* 3D Tilt Support */
[data-theme-mode="glass-hifi"] [data-tilt] {
    transform-style: preserve-3d;
}
[data-theme-mode="glass-hifi"] [data-tilt] * {
    transform: translateZ(20px);
}

/* ─── Global Reset & Layout ─── */
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth; background: #050508; /* Fallback to prevent white flash */}
body{background:transparent;color:var(--txt);overflow-x:hidden;line-height:1.6; transition: opacity 0.4s var(--ease);}
body.page-loading { opacity: 0; }
img{display:block;max-width:100%;}
a{color:inherit;text-decoration:none;}
button{font-family:inherit;cursor:pointer;}
input,textarea,select{font-family:inherit;}
::-webkit-scrollbar{width:5px;}

/* F4 — Page Transition Curtain */
.page-curtain {
  position: fixed;
  inset: 0;
  background: #050508;
  z-index: 10000;
  pointer-events: none;
  transition: opacity 0.5s var(--ease);
}
.page-curtain.hide { opacity: 0; }

.grad-text{background:linear-gradient(135deg,#fff 0%,#93c5fd 45%,#818cf8 80%,#10b981 100%);-webkit-background-clip:text;background-clip:text;color:transparent;}
.grad-accent{background:linear-gradient(135deg,#06b6d4,#3b82f6,#10b981);-webkit-background-clip:text;background-clip:text;color:transparent;}

/* ─── Background Contexts ─── */

#stars-canvas { position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: -1; pointer-events: none; opacity: 0.3; display: none; }

#bg-backdrop {
  position: fixed;
  inset: 0;
  z-index: -10;
  overflow: hidden;
  pointer-events: none;
  background: var(--current-bg, var(--bg));
  transition: background-color 1.5s cubic-bezier(0.4, 0, 0.2, 1);
}

.ref-glow {
  position: absolute;
  width: 40%;
  height: 40%;
  border-radius: 9999px;
  filter: blur(120px);
  will-change: opacity;
  animation: nebula-pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
}

.ref-glow-1 {
  top: -10%;
  left: -10%;
  background-color: rgba(var(--blue-rgb), 0.1);
}

.ref-glow-2 {
  bottom: -10%;
  right: -10%;
  background-color: rgba(147, 51, 234, 0.1);
  animation-delay: 2s;
}

@keyframes nebula-pulse {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.5; }
}

/* Glass Basics */
.glass{
  background:linear-gradient(135deg,rgba(255,255,255,0.07),rgba(255,255,255,0.02));
  backdrop-filter:blur(22px) saturate(160%);-webkit-backdrop-filter:blur(22px) saturate(160%);
  border:1px solid var(--gb);
  box-shadow:0 16px 48px rgba(0,0,0,0.45),inset 0 1px 0 rgba(255,255,255,0.10);
  position:relative;overflow:hidden;transition:border-color var(--ts),box-shadow var(--ts);
}
.glass::before{content:'';position:absolute;inset:0;background:linear-gradient(135deg,rgba(255,255,255,0.04) 0%,transparent 55%);pointer-events:none;}
.glass:hover{border-color:var(--ghi);box-shadow:0 24px 64px rgba(0,0,0,0.55),inset 0 1px 0 rgba(255,255,255,0.17);}
.g-blue  {border-color:rgba(59,130,246,0.28); box-shadow:0 0 24px rgba(59,130,246,0.09),0 16px 48px rgba(0,0,0,0.4);}
.g-emerald{border-color:rgba(16,185,129,0.28); box-shadow:0 0 24px rgba(16,185,129,0.09),0 16px 48px rgba(0,0,0,0.4);}
.g-cyan  {border-color:rgba(6,182,212,0.28);  box-shadow:0 0 24px rgba(6,182,212,0.09),0 16px 48px rgba(0,0,0,0.4);}
.g-green {border-color:rgba(16,185,129,0.28); box-shadow:0 0 24px rgba(16,185,129,0.09),0 16px 48px rgba(0,0,0,0.4);}
.g-pink  {border-color:rgba(236,72,153,0.28); box-shadow:0 0 24px rgba(236,72,153,0.09),0 16px 48px rgba(0,0,0,0.4);}
.g-amber {border-color:rgba(245,158,11,0.28); box-shadow:0 0 24px rgba(245,158,11,0.09),0 16px 48px rgba(0,0,0,0.4);}

/* Nav Structure */
#navbar{position:fixed;top:0;left:0;right:0;z-index:1000;padding:1rem 1.5rem;transition:padding var(--ts);}
#navbar.scrolled{padding:0.5rem 1.5rem;}
.nav-inner{max-width:1280px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;padding:0.75rem 1.5rem;border-radius:var(--rxl);}
.nav-logo{font-size:1.25rem;font-weight:800;letter-spacing:-0.03em;}
.nav-logo span{color:var(--blue);}
.nav-links{display:flex;gap:0;list-style:none;}
.nav-link{display:block;padding:0.45rem 0.9rem;border-radius:var(--rsm);font-size:0.78rem;font-weight:500;letter-spacing:0.09em;text-transform:uppercase;color:var(--txt2);transition:all var(--tf);}
.nav-link:hover,.nav-link.active{color:var(--txt);background:rgba(255,255,255,0.07);}
.nav-actions{display:flex;gap:0.625rem;align-items:center;}
.voice-pill{display:flex;align-items:center;gap:0.4rem;padding:0.35rem 0.8rem;border-radius:99px;font-size:0.72rem;font-weight:700;letter-spacing:0.06em;cursor:pointer;transition:all var(--tf);background:rgba(59,130,246,0.09);border:1px solid rgba(59,130,246,0.28);color:var(--blue);}
.voice-pill:hover{background:rgba(59,130,246,0.18);}
.voice-pill .vdot{width:6px;height:6px;border-radius:50%;background:var(--blue);animation:pdot 2s ease-in-out infinite;}
.voice-pill.listening{background:rgba(239,68,68,0.12);border-color:rgba(239,68,68,0.35);color:#ef4444;}
.voice-pill.listening .vdot{background:#ef4444;animation:pdot 0.4s ease-in-out infinite;}
@keyframes pdot{0%,100%{transform:scale(1);opacity:1;}50%{transform:scale(1.5);opacity:0.5;}}
.btn-login, .btn-settings{padding:0.4rem 1rem;border-radius:var(--rsm);font-size:0.78rem;font-weight:600;border:1px solid rgba(255,255,255,0.14);background:rgba(255,255,255,0.05);color:var(--txt);transition:all var(--tf);}
.btn-login:hover, .btn-settings:hover{background:rgba(255,255,255,0.10);border-color:rgba(255,255,255,0.22);}
.nav-burger{display:none;flex-direction:column;gap:5px;padding:6px;border:none;background:none;}
.nav-burger span{display:block;width:20px;height:2px;background:var(--txt);border-radius:2px;transition:all var(--tf);}
.nav-mobile{display:none;flex-direction:column;gap:0.25rem;padding:1rem;border-top:1px solid var(--gb);}
.nav-mobile.open{display:flex;}
.nav-mobile .nav-link{padding:0.625rem 1rem;font-size:0.875rem;}
@media(max-width:768px){.nav-links,.nav-actions .voice-pill{display:none;}.nav-burger{display:flex;}}

/* ─── Layout Formatting ─── */
section{position:relative;z-index:1;}
.pad{padding:5.5rem 1.5rem;}
.pad-sm{padding:3rem 1.5rem;}
.wrap{max-width:1280px;margin:0 auto;}
.wrap-md{max-width:860px;margin:0 auto;}
.wrap-sm{max-width:620px;margin:0 auto;}
.sec-label{display:inline-flex;align-items:center;gap:0.5rem;font-size:0.68rem;font-weight:700;letter-spacing:0.14em;text-transform:uppercase;color:var(--blue);margin-bottom:0.875rem;}
.sec-label::before{content:'';display:block;width:18px;height:1px;background:var(--blue);}
.sec-h2{font-size:clamp(1.75rem,4vw,2.75rem);font-weight:800;letter-spacing:-0.03em;margin-bottom:1rem;}
.sec-sub{font-size:1rem;color:var(--txt2);line-height:1.7;max-width:520px;}
.divider{height:1px;background:linear-gradient(90deg,transparent,rgba(255,255,255,0.07),transparent);}

/* Hero Section */
.hero{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative;padding:8rem 1.5rem 4rem;z-index:1;text-align:center;}
.hero-eye{display:inline-flex;align-items:center;gap:0.45rem;padding:0.325rem 0.875rem;border-radius:99px;border:1px solid rgba(59,130,246,0.32);background:rgba(59,130,246,0.08);font-size:0.72rem;font-weight:700;letter-spacing:0.12em;text-transform:uppercase;color:var(--blue);margin-bottom:1.75rem;}
.hero-h1{font-size:clamp(2.5rem,7vw,5.25rem);font-weight:900;line-height:1.05;letter-spacing:-0.035em;margin-bottom:1.375rem;}
.hero-sub{font-size:clamp(1rem,1.8vw,1.1875rem);color:var(--txt2);max-width:560px;line-height:1.75;margin:0 auto 2.25rem;}
.hero-tagline{font-size:0.875rem;color:var(--txt3);letter-spacing:0.08em;margin-bottom:0.5rem;transition:all 0.5s var(--ease);}
.hero-cta-row{display:flex;gap:0.875rem;flex-wrap:wrap;justify-content:center;margin-bottom:3.5rem;}

/* Button Components */
.btn{display:inline-flex;align-items:center;gap:0.45rem;padding:0.8125rem 1.625rem;border-radius:var(--rmd);font-size:0.9375rem;font-weight:600;border:none;cursor:pointer;position:relative;overflow:hidden;transition:all var(--ts);}
.btn::after{content:'';position:absolute;inset:0;background:linear-gradient(rgba(255,255,255,0.10),rgba(255,255,255,0));opacity:0;transition:opacity var(--tf);}
.btn:hover::after{opacity:1;}
.btn-pri {
  background: linear-gradient(135deg, var(--blue), var(--emerald));
  color: #fff;
  box-shadow: 0 8px 24px var(--blueg);
  font-weight: 700;
  transition: all 0.5s var(--ease);
}
.btn-pri:hover {
  transform: translateY(-4px) scale(1.02);
  box-shadow: 0 16px 40px var(--blueg);
  border: 1px solid rgba(255, 255, 255, 0.3);
}
.btn-pri::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.2), transparent);
  transform: translateX(-100%);
  transition: transform 0.6s ease-in-out;
}
.btn-pri:hover::before {
  transform: translateX(100%);
}
.btn-sec{background:rgba(255,255,255,0.06);color:var(--txt);border:1px solid rgba(255,255,255,0.14);}
.btn-sec:hover{background:rgba(255,255,255,0.10);transform:translateY(-2px);}
.btn-ghost{background:transparent;color:var(--txt2);border:1px solid var(--gb);font-size:0.875rem;}
.btn-ghost:hover{color:var(--txt);background:rgba(255,255,255,0.04);}
.btn-sm{padding:0.5rem 1rem;font-size:0.8125rem;border-radius:var(--rsm);}

/* Preferences Modal Extras */
.pref-btn { transition: transform 0.2s var(--ease), box-shadow 0.2s var(--ease); outline: 2px solid transparent; outline-offset: 2px; }
.pref-btn:hover { transform: scale(1.1); }
.pref-btn.active { outline-color: var(--blue); box-shadow: 0 0 10px var(--blue); }

/* Voice Interface (Core Features) */

/* The Floating Voice Orb */
#voice-orb{position:fixed;bottom:1.75rem;right:1.75rem;z-index:950;width:60px;height:60px;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,rgba(255,255,255,0.07),rgba(255,255,255,0.02));backdrop-filter:blur(22px) saturate(160%);-webkit-backdrop-filter:blur(22px) saturate(160%);border:1px solid var(--gb);box-shadow:0 16px 48px rgba(0,0,0,0.45),inset 0 1px 0 rgba(255,255,255,0.10);transition:all var(--ts);overflow:hidden;padding:0;}
.ai-icon-mask { width: 65%; height: 65%; background-color: var(--blue); -webkit-mask: url('../img/ai-icon-simple.svg') center/contain no-repeat; mask: url('../img/ai-icon-simple.svg') center/contain no-repeat; transition: transform 0.3s var(--ease), background-color 0.3s var(--ease); }
#voice-orb:hover{transform:scale(1.12);border-color:var(--ghi);box-shadow:0 24px 64px rgba(0,0,0,0.55),inset 0 1px 0 rgba(255,255,255,0.17);}
#voice-orb:hover .ai-icon-mask { transform: scale(1.08); }
#voice-orb.listening { animation:orb-listen 0.55s ease-in-out infinite; border-color: #ef4444; }
#voice-orb.listening .ai-icon-mask { background-color: #ef4444; }
@keyframes orb-listen{0%,100%{transform:scale(1);}50%{transform:scale(1.07);}}

/* F15 — Emotional Presence: Thinking */
#voice-orb.orb-thinking{animation:orb-breathe 2s ease-in-out infinite;box-shadow:0 6px 28px var(--blueg),0 0 20px rgba(59,130,246,0.3);}
@keyframes orb-breathe{0%,100%{transform:scale(1);opacity:0.85;}50%{transform:scale(1.05);opacity:1;}}

/* F15 — Emotional Presence: Speaking */
#voice-orb.orb-speaking{animation:orb-speak 0.3s ease-in-out infinite;background:linear-gradient(135deg,var(--emerald),var(--pink));box-shadow:0 6px 28px rgba(16,185,129,0.45),0 0 40px rgba(16,185,129,0.15);}
@keyframes orb-speak{0%,100%{transform:scale(1);}50%{transform:scale(1.06);}}

/* The AI Chat Panel */
#ai-panel{position:fixed;bottom:5.75rem;right:1.75rem;width:340px;max-height:500px;border-radius:var(--rlg);z-index:890;display:flex;flex-direction:column;transform:translateY(16px) scale(0.96);opacity:0;pointer-events:none;transition:all var(--ts);}
#ai-panel.open{transform:translateY(0) scale(1);opacity:1;pointer-events:all;}
.ai-hdr{padding:0.75rem 1rem;display:flex;align-items:center;gap:0.75rem;border-bottom:1px solid var(--gb);flex-shrink:0;}
.ai-avatar{width:28px;height:28px;border-radius:50%;flex-shrink:0;background:linear-gradient(135deg,var(--blue),var(--emerald));display:flex;align-items:center;justify-content:center;font-size:0.75rem;font-weight:800;color:#fff;box-shadow:0 0 12px rgba(59,130,246,0.3);}
.ai-name{font-size:0.84rem;font-weight:700;letter-spacing:0.02em;color:var(--txt);}
.ai-close{margin-left:auto;background:none;border:none;color:var(--txt3);cursor:pointer;font-size:1.1rem;padding:4px;display:flex;align-items:center;justify-content:center;transition:color 0.2s;}
.ai-close:hover{color:var(--txt);}
.ai-status{display:none;} /* Hidden for minimal header */
.ai-msgs{flex:1;overflow-y:auto;padding:1rem;display:flex;flex-direction:column;gap:0.75rem;min-height:160px;scroll-behavior:smooth;}
.msg{max-width:85%;padding:0.625rem 0.875rem;border-radius:14px;font-size:0.84rem;line-height:1.5;animation:msg-in 0.3s cubic-bezier(0.4, 0, 0.2, 1);position:relative;}
@keyframes msg-in{from{opacity:0;transform:translateY(8px) scale(0.98);}to{opacity:1;transform:translateY(0) scale(1);}}
.msg-ai{background:rgba(59,130,246,0.08);border:1px solid rgba(59,130,246,0.15);border-radius:4px 14px 14px 14px;align-self:flex-start;color:var(--txt2);}
.msg-user{background:rgba(255,255,255,0.04);border:1px solid var(--gb);border-radius:14px 14px 4px 14px;align-self:flex-end;color:var(--txt);}
.ai-input-row{padding:0.875rem 1rem;display:flex;align-items:center;gap:0.5rem;border-top:1px solid var(--gb);flex-shrink:0;}
.ai-input{flex:1;padding:0.5rem 0.875rem;background:rgba(255,255,255,0.03);border:1px solid var(--gb);border-radius:var(--rmd);color:var(--txt);font-size:0.84rem;outline:none;transition:all 0.2s ease;}
.ai-input:focus{border-color:rgba(59,130,246,0.4);background:rgba(255,255,255,0.05);box-shadow:0 0 0 3px rgba(59,130,246,0.06);}
.ai-input::placeholder{color:var(--txt3);opacity:0.6;}
.ai-input.system-msg { color: var(--txt3); font-style: italic; }
.btn-mic, .ai-send, .btn-attach { width: 36px; height: 36px; border-radius: var(--rmd); background: rgba(255,255,255,0.05); color: var(--txt2); border: 1px solid var(--gb); cursor: pointer; display: flex; align-items: center; justify-content: center; transition: all 0.2s ease; padding: 0; flex-shrink: 0; }
.btn-attach:hover { color: var(--blue); background: rgba(255,255,255,0.1); border-color: rgba(59,130,246,0.3); }
.ai-send{display: flex;}
.ai-send:hover{background:#2563eb;transform:translateY(-1px);box-shadow:0 4px 12px rgba(37,99,235,0.3);}
.btn-mic:hover{background:rgba(255,255,255,0.1);color:var(--blue);border-color:rgba(59,130,246,0.3);}
.btn-mic.agent-pulse{background:rgba(239,68,68,0.1);border-color:rgba(239,68,68,0.4);color:#ef4444;animation:mic-recording 1.2s infinite;}
@keyframes mic-recording{0%,100%{opacity:1;}50%{opacity:0.6;}}
#voice-transcript{position:fixed;bottom:8rem;right:1.75rem;max-width:260px;padding:0.625rem 0.875rem;border-radius:var(--rmd);font-size:0.8rem;color:var(--txt);z-index:920;display:none;}

/* Glassmorphic loading shimmer for chat input */
.ai-loading{position:relative;pointer-events:none;}
.ai-loading::after{content:'';position:absolute;inset:0;border-radius:inherit;background:linear-gradient(90deg,transparent 0%,rgba(255,255,255,0.06) 40%,rgba(255,255,255,0.12) 50%,rgba(255,255,255,0.06) 60%,transparent 100%);background-size:200% 100%;animation:shimmer 1.5s ease-in-out infinite;}
@keyframes shimmer{0%{background-position:200% 0;}100%{background-position:-200% 0;}}

/* Unified AI Indicator */
.ai-indicator-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 0 12px #fff;
  animation: pdot 1.5s infinite;
  display: inline-block;
  margin-right: 0.5rem;
}

/* Modals */
.modal-overlay{position:fixed;top:0;left:0;width:100vw;height:100vh;background:rgba(5,5,8,0.88);backdrop-filter:blur(14px);z-index:2000;display:flex;align-items:center;justify-content:center;padding:1.5rem;opacity:0;pointer-events:none;transition:opacity var(--ts);}
.modal-overlay.open{opacity:1;pointer-events:all;}
.modal-box{width:100%;max-width:500px;max-height:90vh;overflow-y:auto;border-radius:var(--rxl);padding:2.25rem;text-align:center;transform:scale(0.95);transition:transform var(--ts);position:relative;background:var(--bg2);}
.modal-overlay.open .modal-box{transform:scale(1);}
.modal-close{position:absolute;top:1rem;right:1rem;width:28px;height:28px;border-radius:50%;background:rgba(255,255,255,0.08);border:none;color:var(--txt2);font-size:1rem;cursor:pointer;display:flex;align-items:center;justify-content:center;}
.modal-close:hover{background:rgba(255,255,255,0.14);}

/* Footers */
footer{padding:2.25rem 1.5rem;border-top:1px solid rgba(255,255,255,0.05);text-align:center;color:var(--txt3);font-size:0.8rem;position:relative;z-index:1;}
footer a{color:var(--blue);}
.footer-nav{display:flex;justify-content:center;gap:1.375rem;flex-wrap:wrap;margin-bottom:1.25rem;}

/* Utility Animations */
.reveal{opacity:0;transform:translateY(28px);transition:opacity 0.7s var(--ease),transform 0.7s var(--ease);}
.reveal.vis{opacity:1;transform:translateY(0);}

.page-in{animation:page-in 0.6s var(--ease) forwards;}
@keyframes page-in{from{opacity:0;}to{opacity:1;}}

.heartbeat { animation: heartbeat 1.5s ease-in-out infinite; }
@keyframes heartbeat {
  0% { transform: scale(1); opacity: 1; }
  14% { transform: scale(1.1); opacity: 0.9; }
  28% { transform: scale(1); opacity: 1; }
  42% { transform: scale(1.1); opacity: 0.9; }
  70% { transform: scale(1); opacity: 1; }
}

.agent-pulse { animation: agent-pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite; }
@keyframes agent-pulse {
  0% { box-shadow: 0 0 0 0 rgba(59, 130, 246, 0.4); }
  70% { box-shadow: 0 0 0 10px rgba(59, 130, 246, 0); }
  100% { box-shadow: 0 0 0 0 rgba(59, 130, 246, 0); }
}

/* Waveform Visualizer */
.waveform-wrap {
  display: flex;
  align-items: center;
  gap: 3px;
  height: 24px;
  padding: 0 10px;
}
.wave-bar {
  width: 3px;
  height: 4px;
  background: var(--blue);
  border-radius: 2px;
  transition: height 0.1s ease;
}
.voice-pill.listening .wave-bar {
  animation: wave-anim 0.4s infinite alternate;
}
@keyframes wave-anim {
  from { height: 4px; }
  to { height: 18px; }
}
/* ─── Portal & Profile Components (Wortman.AI) ─── */
.portal-hero-wrap { display:flex; flex-direction:column; align-items:center; gap:1.5rem; }
.portal-avatar { 
  width:140px; height:140px; border-radius:50%; object-fit:cover; 
  border:3px solid var(--pulse-color, rgba(59,130,246,0.5)); 
  box-shadow:0 0 40px var(--pulse-shadow, rgba(59,130,246,0.25)), 0 0 0 6px rgba(255,255,255,0.03); 
  animation:avatarPulse 4s ease-in-out infinite; 
}
@keyframes avatarPulse { 
  0%,100%{box-shadow:0 0 40px var(--pulse-shadow, rgba(59,130,246,0.25)),0 0 0 6px rgba(255,255,255,0.03);} 
  50%{box-shadow:0 0 60px var(--pulse-glow, rgba(59,130,246,0.45)),0 0 0 10px rgba(255,255,255,0.06);} 
}
.stats-bar { display:flex; gap:2rem; justify-content:center; flex-wrap:wrap; margin-top:2rem; }
.stat-pill { display:flex; flex-direction:column; align-items:center; gap:0.25rem; background:rgba(255,255,255,0.03); border:1px solid rgba(255,255,255,0.08); border-radius:1rem; padding:0.75rem 1.25rem; min-width:90px; transition: all 0.3s var(--ease); }
.stat-pill:hover { transform: translateY(-3px); border-color: var(--pulse-color, var(--blue)); background: rgba(255,255,255,0.06); }
.stat-num { font-size:1.5rem; font-weight:800; color:#fff; line-height:1; }
.stat-lbl { font-size:0.65rem; font-weight:600; letter-spacing:0.08em; text-transform:uppercase; color:var(--txt3); }
.breadcrumb { font-size:0.78rem; color:var(--txt3); margin-bottom:1rem; }
.breadcrumb a { color:var(--txt3); text-decoration:none; } .breadcrumb a:hover { color:var(--txt); }
@media(max-width:640px){ .portal-avatar{width:100px;height:100px;} .stats-bar{gap:1rem;} }