/* ==========================================================================
   PlagCheck AI — Ultra-Premium Design System v3.0
   Glassmorphism · Neumorphism · 3D Motion · Animated Gradients
   Typography: Outfit, Plus Jakarta Sans, JetBrains Mono
   ========================================================================== */

@import url('https://fonts.googleapis.com/css2?family=JetBrains+Mono:ital,wght@0,400;0,500;0,600;0,700;1,400&family=Outfit:wght@400;500;600;700;800;900&family=Plus+Jakarta+Sans:ital,wght@0,400;0,500;0,600;0,700;0,800;1,400;1,600&display=swap');

:root {
  /* Core Surfaces */
  --pc-bg: #F0F4FA;
  --pc-card-bg: #FFFFFF;
  --pc-foreground: #0A1128;
  --pc-foreground-heading: #060D1E;
  --pc-muted: #475569;
  --pc-border: #E2E8F0;
  --pc-border-hover: #CBD5E1;
  --pc-sidebar-width: 16rem;

  /* Obsidian Oceanic Spectrum */
  --pc-obsidian-950: #040814;
  --pc-obsidian-900: #070F22;
  --pc-obsidian-850: #0B1733;
  --pc-obsidian-800: #102042;
  --pc-obsidian-700: #172E5C;

  /* Vivid Accent Spectrum */
  --pc-cyan-neon: #00F2FE;
  --pc-cyan-electric: #00C6FF;
  --pc-cyan-glow: rgba(0, 242, 254, 0.28);
  --pc-indigo-vibrant: #4F46E5;
  --pc-blue-primary: #2563EB;
  --pc-blue-hover: #1D4ED8;
  --pc-emerald-vibrant: #10B981;
  --pc-emerald-glow: rgba(16, 185, 129, 0.25);
  --pc-amber-imperial: #F59E0B;
  --pc-crimson-laser: #EF4444;
  --pc-violet-neural: #8B5CF6;
  --pc-gold-luxury: #D4AF37;

  /* Premium Shadows */
  --pc-shadow-sm: 0 2px 8px rgba(10, 17, 40, 0.04), 0 1px 2px rgba(10, 17, 40, 0.02);
  --pc-shadow-md: 0 8px 30px -6px rgba(10, 17, 40, 0.07), 0 2px 8px rgba(10, 17, 40, 0.03);
  --pc-shadow-lg: 0 20px 50px -10px rgba(10, 17, 40, 0.12), 0 4px 16px rgba(10, 17, 40, 0.04);
  --pc-shadow-xl: 0 30px 70px -15px rgba(10, 17, 40, 0.18);

  /* Glass Effect */
  --pc-glass-bg: rgba(255, 255, 255, 0.72);
  --pc-glass-border: rgba(255, 255, 255, 0.5);
  --pc-glass-blur: 20px;

  /* Neumorphic Shadows */
  --pc-neu-light: #FFFFFF;
  --pc-neu-shadow: rgba(166, 180, 200, 0.45);
  --pc-neu-raised: 6px 6px 16px var(--pc-neu-shadow), -6px -6px 16px var(--pc-neu-light);
  --pc-neu-pressed: inset 3px 3px 8px var(--pc-neu-shadow), inset -3px -3px 8px var(--pc-neu-light);
}

html.dark {
  --pc-bg: #050B17;
  --pc-card-bg: #0A1329;
  --pc-foreground: #F8FAFC;
  --pc-foreground-heading: #FFFFFF;
  --pc-muted: #94A3B8;
  --pc-border: rgba(255, 255, 255, 0.09);
  --pc-border-hover: rgba(0, 242, 254, 0.3);
  --pc-glass-bg: rgba(10, 19, 41, 0.72);
  --pc-glass-border: rgba(255, 255, 255, 0.08);
}

/* ==========================================================================
   BASE TYPOGRAPHY & BODY
   ========================================================================== */

body {
  margin: 0;
  background-color: var(--pc-bg) !important;
  background-image:
    radial-gradient(ellipse at 0% 0%, rgba(79, 70, 229, 0.06) 0%, transparent 50%),
    radial-gradient(ellipse at 100% 0%, rgba(0, 198, 255, 0.05) 0%, transparent 50%),
    radial-gradient(ellipse at 50% 100%, rgba(16, 185, 129, 0.04) 0%, transparent 50%) !important;
  color: var(--pc-foreground) !important;
  font-family: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  overflow-x: hidden;
}

/* Floating particle dots background effect (CSS-only) */
body::before {
  content: "";
  position: fixed;
  top: 0; left: 0; right: 0; bottom: 0;
  background-image:
    radial-gradient(2px 2px at 10% 20%, rgba(79, 70, 229, 0.15) 50%, transparent 50%),
    radial-gradient(2px 2px at 30% 60%, rgba(0, 198, 255, 0.12) 50%, transparent 50%),
    radial-gradient(1.5px 1.5px at 50% 10%, rgba(16, 185, 129, 0.1) 50%, transparent 50%),
    radial-gradient(2px 2px at 70% 40%, rgba(139, 92, 246, 0.12) 50%, transparent 50%),
    radial-gradient(1.5px 1.5px at 90% 80%, rgba(245, 158, 11, 0.1) 50%, transparent 50%),
    radial-gradient(2px 2px at 20% 90%, rgba(37, 99, 235, 0.1) 50%, transparent 50%),
    radial-gradient(1px 1px at 80% 15%, rgba(0, 242, 254, 0.15) 50%, transparent 50%),
    radial-gradient(1.5px 1.5px at 40% 75%, rgba(236, 72, 153, 0.08) 50%, transparent 50%);
  pointer-events: none;
  z-index: 0;
  animation: pcParticleDrift 30s ease-in-out infinite alternate;
}

@keyframes pcParticleDrift {
  0% { transform: translate(0, 0) scale(1); }
  25% { transform: translate(-10px, 15px) scale(1.02); }
  50% { transform: translate(8px, -10px) scale(0.98); }
  75% { transform: translate(-5px, -8px) scale(1.01); }
  100% { transform: translate(12px, 10px) scale(1); }
}

h1, h2, h3, h4, h5, h6,
.font-heading, .rasendra-brand-title,
.rasendra-kpi-value, .rasendra-stat-num {
  font-family: 'Outfit', 'Plus Jakarta Sans', sans-serif !important;
  letter-spacing: -0.02em;
  color: var(--pc-foreground-heading) !important;
}

code, pre, .font-mono, .rasendra-footer-badge,
.pc-telemetry-mono, .pc-file-badge {
  font-family: 'JetBrains Mono', monospace !important;
}

/* Sleek Scrollbar */
::-webkit-scrollbar { width: 5px; height: 5px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: rgba(148, 163, 184, 0.35); border-radius: 9999px; }
::-webkit-scrollbar-thumb:hover { background: rgba(100, 116, 139, 0.6); }

::selection { background: rgba(79, 70, 229, 0.2); color: #1E1B4B; }

/* ==========================================================================
   SIDEBAR — Neumorphic Glass
   ========================================================================== */

aside:not(.rasendra-admin-sidebar) {
  width: var(--pc-sidebar-width, 16rem) !important;
  background: linear-gradient(180deg, #FFFFFF 0%, #F8FAFD 100%) !important;
  border-right: 1px solid var(--pc-border) !important;
  box-shadow: 4px 0 24px rgba(10, 17, 40, 0.04) !important;
  z-index: 50 !important;
  display: flex !important; flex-direction: column !important;
  height: 100vh !important; box-sizing: border-box !important;
  overflow: hidden !important; position: relative !important;
}

html.dark aside:not(.rasendra-admin-sidebar) {
  background: linear-gradient(180deg, #070F22 0%, #050B17 100%) !important;
  border-right: 1px solid rgba(255, 255, 255, 0.08) !important;
}

aside:not(.rasendra-admin-sidebar) > div:first-child,
aside:not(.rasendra-admin-sidebar) .flex.items-center.gap-2.px-4.py-3,
aside:not(.rasendra-admin-sidebar) .flex.items-center.gap-2.p-4 {
  border-bottom: 1px solid var(--pc-border) !important;
  padding: 1.1rem 1.25rem !important;
  flex-shrink: 0 !important;
}

aside:not(.rasendra-admin-sidebar) nav {
  flex: 1 !important; overflow-y: auto !important;
  padding: 0.5rem 0.65rem 1.5rem 0.65rem !important;
}

/* Neumorphic Nav Items */
aside:not(.rasendra-admin-sidebar) nav a,
aside:not(.rasendra-admin-sidebar) nav button,
.pc-sidebar-nav-item {
  display: flex !important; align-items: center !important;
  gap: 10px !important; border-radius: 10px !important;
  padding: 8px 12px !important; font-size: 13px !important;
  font-weight: 600 !important; color: #334155 !important;
  text-decoration: none !important;
  transition: all 0.22s cubic-bezier(0.16, 1, 0.3, 1) !important;
  margin-bottom: 2px !important; border: 1px solid transparent !important;
  position: relative !important;
}

aside:not(.rasendra-admin-sidebar) nav a:hover,
aside:not(.rasendra-admin-sidebar) nav button:hover,
.pc-sidebar-nav-item:hover {
  background: rgba(37, 99, 235, 0.06) !important;
  color: #1D4ED8 !important;
  transform: translateX(3px);
  border-color: rgba(37, 99, 235, 0.12) !important;
  box-shadow: 0 2px 8px rgba(37, 99, 235, 0.08) !important;
}

/* Active Nav — Glassmorphic Indigo */
aside:not(.rasendra-admin-sidebar) nav a.bg-primary,
aside:not(.rasendra-admin-sidebar) nav a[aria-current="page"],
aside:not(.rasendra-admin-sidebar) nav a.text-primary-foreground {
  background: linear-gradient(135deg, #1D4ED8 0%, #2563EB 60%, #3B82F6 100%) !important;
  color: #FFFFFF !important;
  box-shadow: 0 4px 16px rgba(29, 78, 216, 0.35), inset 0 1px 0 rgba(255,255,255,0.15) !important;
  font-weight: 700 !important;
  border-color: rgba(59, 130, 246, 0.5) !important;
}

/* Admin Suite Sidebar Button — Cyberpunk Glow */
.pc-sidebar-nav-item.admin-highlight {
  border: 1.5px solid rgba(0, 242, 254, 0.5) !important;
  background: linear-gradient(135deg, rgba(6, 13, 30, 0.96), rgba(11, 23, 51, 0.96)) !important;
  color: #00F2FE !important;
  box-shadow: 0 2px 12px rgba(0, 242, 254, 0.2), inset 0 0 20px rgba(0, 242, 254, 0.05) !important;
  font-weight: 700 !important;
}
.pc-sidebar-nav-item.admin-highlight:hover {
  background: linear-gradient(135deg, #070F22, #102042) !important;
  box-shadow: 0 4px 20px rgba(0, 242, 254, 0.4), inset 0 0 30px rgba(0, 242, 254, 0.08) !important;
  transform: translateX(3px) !important;
}

.pc-sidebar-nav-item.upgrade-highlight {
  border: 1px solid rgba(212, 175, 55, 0.4) !important;
  background: linear-gradient(135deg, rgba(212, 175, 55, 0.08), rgba(245, 158, 11, 0.06)) !important;
  color: #B45309 !important;
}
.pc-sidebar-nav-item.upgrade-highlight:hover {
  background: linear-gradient(135deg, rgba(212, 175, 55, 0.14), rgba(245, 158, 11, 0.12)) !important;
  transform: translateX(3px) !important;
  box-shadow: 0 2px 12px rgba(212, 175, 55, 0.15) !important;
}

aside:not(.rasendra-admin-sidebar) .border-t {
  border-top: 1px solid var(--pc-border) !important;
  padding: 0.75rem 1rem !important;
  background: linear-gradient(180deg, #F8FAFD 0%, #F1F5F9 100%) !important;
  flex-shrink: 0 !important; z-index: 10 !important;
}

/* ==========================================================================
   HEADER — Floating Glassmorphism Bar
   ========================================================================== */

header {
  left: var(--pc-sidebar-width, 16rem) !important;
  width: calc(100% - var(--pc-sidebar-width, 16rem)) !important;
  background: var(--pc-glass-bg) !important;
  backdrop-filter: blur(var(--pc-glass-blur)) saturate(180%) !important;
  -webkit-backdrop-filter: blur(var(--pc-glass-blur)) saturate(180%) !important;
  border-bottom: 1px solid var(--pc-glass-border) !important;
  box-shadow: 0 4px 30px -4px rgba(10, 17, 40, 0.06), 0 1px 3px rgba(10, 17, 40, 0.02) !important;
  transition: left 0.3s cubic-bezier(0.16, 1, 0.3, 1), width 0.3s cubic-bezier(0.16, 1, 0.3, 1) !important;
  z-index: 40 !important; height: 4.25rem !important;
}

html.dark header {
  background: rgba(7, 15, 34, 0.85) !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.06) !important;
}

header input[type="search"],
header input[placeholder*="Search"] {
  background: rgba(248, 250, 253, 0.8) !important;
  border: 1px solid rgba(226, 232, 240, 0.8) !important;
  border-radius: 9999px !important;
  padding: 0.55rem 1.25rem 0.55rem 2.6rem !important;
  font-size: 13.5px !important; font-weight: 500 !important;
  color: var(--pc-foreground) !important;
  transition: all 0.25s ease !important;
  box-shadow: inset 0 1px 4px rgba(0, 0, 0, 0.03) !important;
}

header input[type="search"]:focus,
header input[placeholder*="Search"]:focus {
  background: #FFFFFF !important; border-color: #2563EB !important;
  box-shadow: 0 0 0 4px rgba(37, 99, 235, 0.12), inset 0 1px 2px rgba(0, 0, 0, 0.02) !important;
  outline: none !important;
}

/* Header Buttons — matches both original and duplicate header instances */
#btn-admin-suite-nav, [id^="btn-admin-suite-nav"] {
  display: inline-flex !important; align-items: center !important; gap: 7px !important;
  padding: 7px 16px !important; border-radius: 9999px !important;
  font-size: 12.5px !important; font-weight: 800 !important;
  letter-spacing: 0.01em !important; cursor: pointer !important;
  transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1) !important;
  position: relative !important; overflow: hidden !important;
}
#btn-admin-suite-nav:hover, [id^="btn-admin-suite-nav"]:hover {
  transform: translateY(-2px) scale(1.03) !important;
  box-shadow: 0 6px 24px rgba(0, 242, 254, 0.45) !important;
}

/* Shimmer animation on admin button */
#btn-admin-suite-nav::after, [id^="btn-admin-suite-nav"]::after {
  content: ""; position: absolute;
  top: 0; left: -100%; width: 100%; height: 100%;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,0.15), transparent);
  animation: pcShimmer 3s infinite;
}
@keyframes pcShimmer { 0% { left: -100%; } 50%, 100% { left: 100%; } }

#btn-upgrade-plan-nav, [id^="btn-upgrade-plan-nav"] {
  display: inline-flex !important; align-items: center !important; gap: 6px !important;
  padding: 7px 16px !important; border-radius: 9999px !important;
  background: linear-gradient(135deg, #4F46E5 0%, #06B6D4 100%) !important;
  color: #FFFFFF !important; font-size: 12.5px !important; font-weight: 700 !important;
  border: 1px solid rgba(255, 255, 255, 0.25) !important; cursor: pointer !important;
  box-shadow: 0 4px 16px rgba(79, 70, 229, 0.3) !important;
  transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1) !important;
}
#btn-upgrade-plan-nav:hover, [id^="btn-upgrade-plan-nav"]:hover {
  transform: translateY(-2px) scale(1.03) !important;
  box-shadow: 0 8px 28px rgba(6, 182, 212, 0.45) !important;
}

/* Pulsing Status Beacon */
.pc-status-beacon {
  display: inline-flex; align-items: center; gap: 8px;
  font-size: 12px; font-weight: 700; color: #0F766E;
  background: rgba(16, 185, 129, 0.08);
  border: 1px solid rgba(16, 185, 129, 0.2);
  padding: 5px 14px; border-radius: 9999px;
  letter-spacing: 0.02em; backdrop-filter: blur(8px);
}
.pc-beacon-dot {
  width: 7px; height: 7px; border-radius: 50%;
  background: #10B981;
  box-shadow: 0 0 10px #10B981, 0 0 20px rgba(16, 185, 129, 0.3);
  animation: pcPulseBeacon 2s infinite ease-in-out;
}
@keyframes pcPulseBeacon {
  0%, 100% { transform: scale(1); opacity: 1; box-shadow: 0 0 10px #10B981; }
  50% { transform: scale(1.4); opacity: 0.5; box-shadow: 0 0 20px #10B981, 0 0 40px rgba(16, 185, 129, 0.2); }
}

/* Floating Admin Beacon */
#pc-floating-admin-beacon {
  position: fixed !important; bottom: 24px !important; left: 24px !important;
  z-index: 99998 !important; display: flex !important; align-items: center !important;
  gap: 8px !important; background: #060D1E !important;
  border: 1.5px solid #00F2FE !important; color: #00F2FE !important;
  padding: 8px 16px !important; border-radius: 9999px !important;
  font-weight: 800 !important; font-size: 12px !important;
  cursor: pointer !important;
  box-shadow: 0 4px 20px rgba(0, 242, 254, 0.35), 0 0 40px rgba(0, 242, 254, 0.1) !important;
  transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1) !important;
}
#pc-floating-admin-beacon:hover {
  transform: translateY(-3px) scale(1.04) !important;
  box-shadow: 0 8px 30px rgba(0, 242, 254, 0.5), 0 0 60px rgba(0, 242, 254, 0.15) !important;
}

/* ==========================================================================
   MAIN CONTENT
   ========================================================================== */

main {
  margin-left: 2.5rem !important; margin-right: 2.5rem !important;
  max-width: calc(100% - 5rem) !important; width: auto !important;
  padding-left: 0 !important; padding-right: 0 !important;
  padding-top: 5.75rem !important; padding-bottom: 3.5rem !important;
  box-sizing: border-box !important; position: relative !important; z-index: 1 !important;
}

@media (min-width: 1024px) {
  div.transition-all.duration-300:has(> header) {
    padding-left: var(--pc-sidebar-width, 16rem) !important;
  }
}
@media (max-width: 1023px) {
  :root { --pc-sidebar-width: 0rem !important; }
  header { left: 0 !important; width: 100% !important; }
  div.transition-all.duration-300:has(> header) { padding-left: 0 !important; }
  main { margin-left: 1rem !important; margin-right: 1rem !important; max-width: calc(100% - 2rem) !important; }
}

main h1 {
  font-size: 2.35rem !important; font-weight: 800 !important;
  color: #060D1E !important; margin-bottom: 0.35rem !important;
  letter-spacing: -0.035em !important; line-height: 1.15 !important;
}
main p.text-muted-foreground {
  font-size: 15px !important; color: #475569 !important;
  font-weight: 500 !important; margin-bottom: 1.75rem !important;
}

.pc-brand-badge {
  display: inline-flex; align-items: center; gap: 7px;
  font-size: 11px; font-weight: 800; text-transform: uppercase;
  letter-spacing: 0.08em; padding: 4px 12px; border-radius: 9999px; margin-bottom: 8px;
}

/* ==========================================================================
   CARDS — 3D Glassmorphic with Hover Transforms
   ========================================================================== */

main div.grid.gap-4.md\:grid-cols-2.lg\:grid-cols-4,
main div.grid.gap-4.grid-cols-1.sm\:grid-cols-2.lg\:grid-cols-4,
main div.grid.gap-4:has(> div:nth-child(4)) {
  display: grid !important; grid-template-columns: repeat(4, 1fr) !important;
  gap: 1.5rem !important; margin-top: 1.5rem !important; perspective: 1000px !important;
}
@media (max-width: 1024px) {
  main div.grid.gap-4.md\:grid-cols-2.lg\:grid-cols-4,
  main div.grid.gap-4.grid-cols-1.sm\:grid-cols-2.lg\:grid-cols-4,
  main div.grid.gap-4:has(> div:nth-child(4)) { grid-template-columns: repeat(2, 1fr) !important; }
}
@media (max-width: 640px) {
  main div.grid.gap-4.md\:grid-cols-2.lg\:grid-cols-4,
  main div.grid.gap-4.grid-cols-1.sm\:grid-cols-2.lg\:grid-cols-4,
  main div.grid.gap-4:has(> div:nth-child(4)) { grid-template-columns: 1fr !important; }
}

/* Glassmorphic Card with 3D transform */
main div.grid:has(> div:nth-child(4)) > div {
  position: relative !important;
  background: var(--pc-glass-bg) !important;
  backdrop-filter: blur(16px) saturate(180%) !important;
  -webkit-backdrop-filter: blur(16px) saturate(180%) !important;
  border: 1px solid rgba(255, 255, 255, 0.6) !important;
  border-radius: 16px !important; padding: 1.5rem 1.75rem !important;
  box-shadow: var(--pc-shadow-md), inset 0 1px 0 rgba(255, 255, 255, 0.8) !important;
  transition: all 0.35s cubic-bezier(0.16, 1, 0.3, 1) !important;
  overflow: hidden !important; transform-style: preserve-3d !important;
}
main div.grid:has(> div:nth-child(4)) > div:hover {
  transform: translateY(-6px) rotateX(2deg) !important;
  box-shadow: var(--pc-shadow-xl), inset 0 1px 0 rgba(255, 255, 255, 0.9) !important;
  border-color: rgba(37, 99, 235, 0.2) !important;
}

/* Animated gradient accent lines */
main div.grid:has(> div:nth-child(4)) > div::before {
  content: ""; position: absolute; top: 0; left: 0; right: 0; height: 3px; border-radius: 16px 16px 0 0;
}
main div.grid:has(> div:nth-child(4)) > div:nth-child(1)::before { background: linear-gradient(90deg, #2563EB, #00F2FE); }
main div.grid:has(> div:nth-child(4)) > div:nth-child(2)::before { background: linear-gradient(90deg, #F59E0B, #F97316); }
main div.grid:has(> div:nth-child(4)) > div:nth-child(3)::before { background: linear-gradient(90deg, #8B5CF6, #EC4899); }
main div.grid:has(> div:nth-child(4)) > div:nth-child(4)::before { background: linear-gradient(90deg, #10B981, #06B6D4); }

main div.grid:has(> div:nth-child(4)) > div p.text-sm.font-medium,
main div.grid:has(> div:nth-child(4)) > div div.text-sm.font-medium {
  font-size: 13.5px !important; font-weight: 700 !important; color: #475569 !important; margin-bottom: 0.5rem !important;
}
main div.grid:has(> div:nth-child(4)) > div div.text-2xl.font-bold,
main div.grid:has(> div:nth-child(4)) > div p.text-2xl.font-bold {
  font-family: 'Outfit', sans-serif !important; font-size: 2.25rem !important;
  font-weight: 800 !important; color: #060D1E !important; line-height: 1.1 !important;
}
main div.grid:has(> div:nth-child(4)) > div svg {
  color: #2563EB !important; opacity: 0.85 !important;
  width: 28px !important; height: 28px !important;
  transition: all 0.3s ease !important;
}
main div.grid:has(> div:nth-child(4)) > div:hover svg {
  transform: scale(1.15) rotate(3deg) !important; opacity: 1 !important;
}

/* ==========================================================================
   STRATEGY CARDS — Neumorphic with 3D
   ========================================================================== */

main div.grid button.flex-col,
main div.grid button:has(div.font-semibold) {
  position: relative !important; background: #FFFFFF !important;
  border: 1.5px solid var(--pc-border) !important;
  border-radius: 16px !important; padding: 1.4rem 1.5rem !important;
  text-align: left !important;
  box-shadow: var(--pc-neu-raised) !important;
  transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1) !important;
  transform-style: preserve-3d !important; overflow: hidden !important;
}
main div.grid button.flex-col::after,
main div.grid button:has(div.font-semibold)::after {
  content: ""; position: absolute; inset: 0; border-radius: 16px; opacity: 0;
  background: linear-gradient(135deg, rgba(37, 99, 235, 0.06), rgba(6, 182, 212, 0.04));
  transition: opacity 0.3s ease;
}
main div.grid button.flex-col:hover,
main div.grid button:has(div.font-semibold):hover {
  transform: translateY(-4px) rotateX(1deg) !important;
  box-shadow: 0 12px 30px rgba(10, 17, 40, 0.1), 0 4px 8px rgba(10, 17, 40, 0.04) !important;
  border-color: #93C5FD !important;
}
main div.grid button.flex-col:hover::after,
main div.grid button:has(div.font-semibold):hover::after { opacity: 1; }

main div.grid button.flex-col.border-primary,
main div.grid button:has(div.font-semibold).border-primary,
main div.grid button[class*="border-blue"] {
  border-color: #2563EB !important;
  background: linear-gradient(180deg, rgba(37, 99, 235, 0.04) 0%, rgba(37, 99, 235, 0.01) 100%) !important;
  box-shadow: 0 4px 20px rgba(37, 99, 235, 0.18), 0 0 0 1px rgba(37, 99, 235, 0.1) !important;
}
main div.grid button .font-semibold {
  font-family: 'Outfit', sans-serif !important; font-size: 16px !important;
  font-weight: 700 !important; color: #060D1E !important; margin-top: 8px !important;
}

/* ==========================================================================
   TEXTAREAS & WORKBENCH
   ========================================================================== */

textarea, main textarea {
  font-family: 'Plus Jakarta Sans', sans-serif !important; font-size: 14.5px !important;
  line-height: 1.75 !important; border-radius: 14px !important;
  border: 1.5px solid var(--pc-border) !important; background: #FFFFFF !important;
  padding: 1.25rem !important; box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.02) !important;
  transition: all 0.25s ease !important;
}
textarea:focus, main textarea:focus {
  border-color: #2563EB !important;
  box-shadow: 0 0 0 4px rgba(37, 99, 235, 0.1), inset 0 1px 2px rgba(0, 0, 0, 0.02) !important;
  outline: none !important;
}

main .grid:has(textarea) { gap: 1.5rem !important; }
main .grid:has(textarea) > div {
  background: var(--pc-glass-bg) !important; backdrop-filter: blur(12px) !important;
  border: 1.5px solid var(--pc-glass-border) !important; border-radius: 18px !important;
  box-shadow: var(--pc-shadow-md), inset 0 1px 0 rgba(255, 255, 255, 0.6) !important;
  padding: 1.5rem !important; transition: all 0.25s ease !important;
}
main .grid:has(textarea) > div:hover {
  border-color: rgba(37, 99, 235, 0.15) !important;
  box-shadow: var(--pc-shadow-lg), inset 0 1px 0 rgba(255, 255, 255, 0.8) !important;
}

/* Buttons */
main button.bg-primary {
  background: linear-gradient(135deg, #1D4ED8 0%, #2563EB 60%, #3B82F6 100%) !important;
  color: #FFFFFF !important; font-weight: 700 !important; border-radius: 12px !important;
  padding: 10px 22px !important;
  box-shadow: 0 4px 16px rgba(29, 78, 216, 0.35), inset 0 1px 0 rgba(255,255,255,0.15) !important;
  transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1) !important;
  border: 1px solid rgba(255, 255, 255, 0.2) !important;
  position: relative !important; overflow: hidden !important;
}
main button.bg-primary:hover {
  transform: translateY(-2px) !important;
  box-shadow: 0 8px 28px rgba(29, 78, 216, 0.45), inset 0 1px 0 rgba(255,255,255,0.2) !important;
}
main button.bg-secondary, main button.border-input, main button:has(svg.lucide-rotate-ccw) {
  border-radius: 10px !important; font-weight: 600 !important;
  border: 1px solid var(--pc-border) !important; background: #FFFFFF !important;
  box-shadow: var(--pc-shadow-sm) !important; transition: all 0.2s ease !important;
}
main button.bg-secondary:hover, main button.border-input:hover,
main button:has(svg.lucide-rotate-ccw):hover {
  background: #F8FAFD !important; border-color: #CBD5E1 !important;
  box-shadow: var(--pc-shadow-md) !important; transform: translateY(-1px) !important;
}

/* ==========================================================================
   REPORTS PAGE
   ========================================================================== */

#btn-new-scan-reports {
  display: inline-flex !important; align-items: center !important; gap: 8px !important;
  padding: 10px 22px !important; border-radius: 12px !important;
  background: linear-gradient(135deg, #1D4ED8 0%, #2563EB 60%, #3B82F6 100%) !important;
  color: #FFFFFF !important; font-size: 13.5px !important; font-weight: 700 !important;
  text-decoration: none !important;
  box-shadow: 0 4px 18px rgba(37, 99, 235, 0.35), inset 0 1px 0 rgba(255,255,255,0.15) !important;
  transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1) !important;
  border: 1px solid rgba(255, 255, 255, 0.2) !important;
}
#btn-new-scan-reports:hover {
  transform: translateY(-2px) scale(1.02) !important;
  box-shadow: 0 8px 28px rgba(37, 99, 235, 0.45) !important;
}

/* Neumorphic Filter Tabs */
main div.flex.space-x-1,
main div.inline-flex.h-9.items-center,
main div.inline-flex.h-10.items-center {
  background: #EAF0F8 !important; border: 1px solid rgba(226, 232, 240, 0.8) !important;
  border-radius: 14px !important; padding: 4px !important; margin-bottom: 1.5rem !important;
  box-shadow: inset 2px 2px 6px rgba(166, 180, 200, 0.2), inset -2px -2px 6px rgba(255, 255, 255, 0.7) !important;
}
main div.flex.space-x-1 button,
main div.inline-flex.h-9.items-center button,
main div.inline-flex.h-10.items-center button {
  border-radius: 10px !important; font-size: 13px !important; font-weight: 600 !important;
  color: #475569 !important; padding: 6px 18px !important;
  transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1) !important;
}
main div.flex.space-x-1 button:hover,
main div.inline-flex.h-9.items-center button:hover,
main div.inline-flex.h-10.items-center button:hover { color: #0A1128 !important; }
main div.flex.space-x-1 button[data-state="active"],
main div.inline-flex.h-9.items-center button[data-state="active"],
main div.inline-flex.h-10.items-center button[data-state="active"] {
  background: #FFFFFF !important; color: #0A1128 !important; font-weight: 700 !important;
  box-shadow: 0 2px 10px rgba(10, 17, 40, 0.1), 0 1px 3px rgba(10, 17, 40, 0.04) !important;
}

/* Glassmorphic Table Container */
main div.rounded-lg.border.bg-card,
main div.rounded-md.border {
  background: var(--pc-glass-bg) !important; backdrop-filter: blur(12px) !important;
  border: 1px solid rgba(255, 255, 255, 0.5) !important; border-radius: 18px !important;
  box-shadow: var(--pc-shadow-md), inset 0 1px 0 rgba(255, 255, 255, 0.6) !important;
  overflow: hidden !important; margin-bottom: 2rem !important; transition: all 0.25s ease !important;
}
main div.rounded-lg.border.bg-card:hover,
main div.rounded-md.border:hover {
  box-shadow: var(--pc-shadow-lg), inset 0 1px 0 rgba(255, 255, 255, 0.8) !important;
  transform: translateY(-2px) !important;
}

table thead tr { background: rgba(248, 250, 253, 0.9) !important; border-bottom: 1px solid var(--pc-border) !important; }
table thead th {
  padding: 14px 20px !important; font-family: 'Plus Jakarta Sans', sans-serif !important;
  font-size: 11.5px !important; font-weight: 800 !important;
  letter-spacing: 0.08em !important; text-transform: uppercase !important; color: #475569 !important;
}
table tbody tr {
  border-bottom: 1px solid #F1F5F9 !important;
  transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1) !important; cursor: pointer;
}
table tbody tr:last-child { border-bottom: none !important; }
table tbody tr:hover { background: rgba(37, 99, 235, 0.03) !important; transform: translateX(4px); }
table tbody td { padding: 16px 20px !important; font-size: 14px !important; vertical-align: middle !important; }

/* Badges */
.pc-badge-clean, .pc-score-pill-clean {
  display: inline-flex; align-items: center; gap: 5px;
  background: rgba(16, 185, 129, 0.1); color: #047857;
  border: 1.5px solid rgba(16, 185, 129, 0.3);
  font-size: 12px; font-weight: 700; padding: 3px 10px;
  border-radius: 9999px; font-family: 'JetBrains Mono', monospace;
}
.pc-badge-warning, .pc-score-pill-warning {
  display: inline-flex; align-items: center; gap: 5px;
  background: rgba(245, 158, 11, 0.1); color: #B45309;
  border: 1.5px solid rgba(245, 158, 11, 0.3);
  font-size: 12px; font-weight: 700; padding: 3px 10px;
  border-radius: 9999px; font-family: 'JetBrains Mono', monospace;
}
.pc-badge-critical, .pc-score-pill-critical {
  display: inline-flex; align-items: center; gap: 5px;
  background: rgba(239, 68, 68, 0.1); color: #B91C1C;
  border: 1.5px solid rgba(239, 68, 68, 0.3);
  font-size: 12px; font-weight: 700; padding: 3px 10px;
  border-radius: 9999px; font-family: 'JetBrains Mono', monospace;
}
.pc-badge-ai {
  display: inline-flex; align-items: center; gap: 5px;
  background: rgba(139, 92, 246, 0.1); color: #6D28D9;
  border: 1.5px solid rgba(139, 92, 246, 0.3);
  font-size: 12px; font-weight: 700; padding: 3px 10px;
  border-radius: 9999px; font-family: 'JetBrains Mono', monospace;
}

/* Neumorphic Table Action Buttons */
table tbody td button {
  width: 36px !important; height: 36px !important; border-radius: 10px !important;
  border: 1px solid var(--pc-border) !important; background: #FFFFFF !important;
  color: #475569 !important; display: inline-flex !important;
  align-items: center !important; justify-content: center !important;
  cursor: pointer !important; transition: all 0.22s cubic-bezier(0.16, 1, 0.3, 1) !important;
  margin-left: 6px !important;
  box-shadow: 2px 2px 6px rgba(166, 180, 200, 0.2), -2px -2px 6px rgba(255, 255, 255, 0.7) !important;
}
table tbody td button:hover {
  background: linear-gradient(135deg, #1D4ED8, #2563EB) !important;
  color: #FFFFFF !important; border-color: #1D4ED8 !important;
  transform: translateY(-2px) scale(1.05) !important;
  box-shadow: 0 4px 16px rgba(29, 78, 216, 0.35) !important;
}

/* ==========================================================================
   ADMIN CONTROL SUITE — Obsidian Cyberpunk
   ========================================================================== */

.rasendra-admin-viewport {
  position: fixed; inset: 0; z-index: 999999;
  background-color: #F4F7FB;
  background-image:
    radial-gradient(at 0% 0%, rgba(79, 70, 229, 0.05) 0px, transparent 45%),
    radial-gradient(at 100% 100%, rgba(0, 242, 254, 0.05) 0px, transparent 45%);
  color: #0A1128; display: flex;
  font-family: 'Plus Jakarta Sans', sans-serif; overflow: hidden;
  animation: pcFadeIn 0.2s ease;
}

.rasendra-admin-sidebar, aside.rasendra-admin-sidebar {
  width: 260px !important; min-width: 260px !important; max-width: 260px !important;
  background: linear-gradient(180deg, #070F22 0%, #040814 100%) !important;
  border-right: 1px solid rgba(255, 255, 255, 0.08) !important;
  box-shadow: 4px 0 40px rgba(0, 0, 0, 0.5) !important;
  display: flex !important; flex-direction: column !important;
  height: 100vh !important; z-index: 1000000 !important;
}
.rasendra-sidebar-header { padding: 1.4rem 1.5rem !important; border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important; flex-shrink: 0; }
.rasendra-brand-title {
  display: flex !important; align-items: center !important; gap: 12px !important;
  color: #FFFFFF !important; font-family: 'Outfit', sans-serif !important;
  font-weight: 800 !important; font-size: 1.2rem !important;
  letter-spacing: -0.02em !important; text-decoration: none !important;
}
.rasendra-brand-icon {
  width: 36px; height: 36px; border-radius: 10px;
  background: linear-gradient(135deg, rgba(0, 242, 254, 0.2), rgba(79, 70, 229, 0.2));
  border: 1px solid rgba(0, 242, 254, 0.4); color: #00F2FE;
  display: flex; align-items: center; justify-content: center;
  font-size: 1.2rem; box-shadow: 0 0 20px rgba(0, 242, 254, 0.2);
}
.rasendra-back-link {
  margin-top: 0.85rem !important; display: inline-flex !important; align-items: center !important;
  gap: 8px !important; font-size: 12.5px !important; font-weight: 600 !important;
  color: rgba(255, 255, 255, 0.65) !important; cursor: pointer !important;
  transition: all 0.2s ease !important; background: rgba(255, 255, 255, 0.05) !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
  border-radius: 6px !important; padding: 5px 10px !important;
}
.rasendra-back-link:hover {
  color: #00F2FE !important; background: rgba(0, 242, 254, 0.1) !important;
  border-color: rgba(0, 242, 254, 0.3) !important; transform: translateX(-2px);
}
.rasendra-nav-scroll { flex: 1; overflow-y: auto; padding: 0.85rem 0.75rem; }
.rasendra-section-divider {
  display: flex !important; align-items: center !important; gap: 8px !important;
  padding: 1.2rem 0.5rem 0.4rem 0.5rem !important; font-size: 10.5px !important;
  font-weight: 800 !important; letter-spacing: 0.12em !important;
  text-transform: uppercase !important; color: rgba(255, 255, 255, 0.4) !important;
}
.rasendra-section-divider-line { flex: 1; height: 1px; background: rgba(255, 255, 255, 0.08); }
.rasendra-nav-btn {
  position: relative !important; width: 100% !important;
  display: flex !important; align-items: center !important; gap: 12px !important;
  padding: 9px 13px !important; font-size: 13.5px !important; font-weight: 600 !important;
  color: rgba(255, 255, 255, 0.7) !important; background: transparent !important;
  border: 1px solid transparent !important; border-radius: 9px !important;
  cursor: pointer !important; text-align: left !important;
  transition: all 0.22s cubic-bezier(0.16, 1, 0.3, 1) !important; margin-bottom: 3px !important;
}
.rasendra-nav-btn:hover { background: rgba(255, 255, 255, 0.07) !important; color: #FFFFFF !important; transform: translateX(2px); }
.rasendra-nav-btn.active {
  background: linear-gradient(135deg, #0B1D42 0%, #11285A 100%) !important;
  color: #FFFFFF !important; border-color: rgba(0, 242, 254, 0.45) !important;
  box-shadow: 0 4px 18px rgba(0, 0, 0, 0.35), inset 0 0 15px rgba(0, 242, 254, 0.1) !important;
  font-weight: 700 !important;
}
.rasendra-nav-btn.active::before {
  content: ""; position: absolute; left: 0; top: 15%; bottom: 15%; width: 3px;
  border-radius: 0 4px 4px 0; background: #00F2FE; box-shadow: 0 0 12px #00F2FE;
}
.rasendra-badge-new {
  margin-left: auto; font-size: 9.5px; font-weight: 800; letter-spacing: 0.06em;
  color: #F59E0B; background: rgba(245, 158, 11, 0.15);
  border: 1px solid rgba(245, 158, 11, 0.4); padding: 2px 7px;
  border-radius: 9999px; box-shadow: 0 0 10px rgba(245, 158, 11, 0.2);
}
.rasendra-sidebar-footer { padding: 0.85rem 1rem !important; border-top: 1px solid rgba(255, 255, 255, 0.08) !important; flex-shrink: 0; }
.rasendra-footer-badge {
  text-align: center !important; font-size: 11px !important;
  font-family: 'JetBrains Mono', monospace !important; font-weight: 700 !important;
  color: rgba(255, 255, 255, 0.45) !important; background: rgba(0, 0, 0, 0.35) !important;
  border: 1px solid rgba(255, 255, 255, 0.06) !important;
  border-radius: 7px !important; padding: 7px !important;
}

.rasendra-admin-main { flex: 1; display: flex; flex-direction: column; height: 100vh; overflow: hidden; background: #F4F7FB; }
.rasendra-top-bar {
  padding: 1.1rem 2.5rem !important; background: #FFFFFF !important;
  border-bottom: 1px solid var(--pc-border) !important;
  display: flex !important; justify-content: space-between !important;
  align-items: center !important; flex-shrink: 0;
  box-shadow: 0 2px 12px rgba(10, 17, 40, 0.03) !important;
}
.rasendra-top-bar h2 { font-size: 1.45rem !important; font-weight: 800 !important; color: #060D1E !important; margin: 0 !important; }
.rasendra-content-scroll { flex: 1; overflow-y: auto; padding: 2.25rem 2.5rem !important; }
.rasendra-content-container { max-width: 1100px; margin: 0 auto; }

.rasendra-kpi-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.4rem; margin-bottom: 2.25rem; perspective: 1000px; }
@media (max-width: 1024px) { .rasendra-kpi-grid { grid-template-columns: repeat(2, 1fr); } }

.rasendra-kpi-card {
  position: relative; background: var(--pc-glass-bg);
  backdrop-filter: blur(12px); border: 1px solid rgba(255, 255, 255, 0.5);
  border-radius: 16px; padding: 1.4rem 1.5rem;
  display: flex; align-items: center; gap: 1.1rem;
  box-shadow: var(--pc-shadow-md), inset 0 1px 0 rgba(255, 255, 255, 0.6);
  transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
  overflow: hidden; transform-style: preserve-3d;
}
.rasendra-kpi-card:hover { transform: translateY(-4px) rotateX(2deg); box-shadow: var(--pc-shadow-xl); }
.rasendra-kpi-card::before {
  content: ""; position: absolute; top: 0; left: 0; right: 0; height: 3px;
  background: linear-gradient(90deg, #2563EB, #00F2FE);
}
.rasendra-kpi-icon {
  width: 50px; height: 50px; border-radius: 14px;
  display: flex; align-items: center; justify-content: center;
  font-size: 1.4rem; flex-shrink: 0;
}
.rasendra-kpi-label { font-size: 13.5px; font-weight: 700; color: #475569; margin-bottom: 3px; }
.rasendra-kpi-value { font-size: 1.85rem !important; font-weight: 800 !important; color: #060D1E !important; line-height: 1.1; }

.rasendra-visitor-card {
  background: var(--pc-glass-bg); backdrop-filter: blur(12px);
  border: 1px solid rgba(255, 255, 255, 0.5); border-radius: 18px;
  box-shadow: var(--pc-shadow-md), inset 0 1px 0 rgba(255, 255, 255, 0.6);
  overflow: hidden; margin-bottom: 2.25rem;
}
.rasendra-visitor-header {
  padding: 1.4rem 2rem; border-bottom: 1px solid #F1F5F9;
  display: flex; justify-content: space-between; align-items: center;
  background: rgba(250, 252, 254, 0.9);
}
.rasendra-visitor-stats-row { display: grid; grid-template-columns: repeat(3, 1fr); border-bottom: 1px solid #E2E8F0; }
.rasendra-stat-cell { padding: 2rem 1.5rem; text-align: center; border-right: 1px solid #F1F5F9; }
.rasendra-stat-cell:last-child { border-right: none; }
.rasendra-stat-num { font-size: 2.35rem !important; font-weight: 900 !important; line-height: 1.1; margin-bottom: 6px; }
.rasendra-stat-tag { font-size: 11.5px; font-weight: 800; letter-spacing: 0.1em; text-transform: uppercase; color: #64748B; }

.btn-export-excel {
  display: inline-flex; align-items: center; gap: 8px;
  background: linear-gradient(135deg, #10B981 0%, #059669 100%);
  color: #FFFFFF; padding: 10px 20px; border-radius: 10px;
  font-size: 13.5px; font-weight: 700;
  border: 1px solid rgba(255, 255, 255, 0.2); cursor: pointer;
  box-shadow: 0 4px 16px rgba(16, 185, 129, 0.3), inset 0 1px 0 rgba(255,255,255,0.15);
  transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1);
}
.btn-export-excel:hover { transform: translateY(-2px); box-shadow: 0 8px 28px rgba(16, 185, 129, 0.45); }

/* ==========================================================================
   MODALS — Frosted Glass
   ========================================================================== */

.pc-modal-backdrop {
  position: fixed; inset: 0;
  background-color: rgba(4, 8, 20, 0.7);
  backdrop-filter: blur(16px) saturate(180%);
  -webkit-backdrop-filter: blur(16px) saturate(180%);
  z-index: 99999; display: flex; align-items: center; justify-content: center;
  padding: 1.5rem; opacity: 0;
  animation: pcFadeIn 0.25s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}
.pc-modal-box {
  background: var(--pc-glass-bg); backdrop-filter: blur(20px) saturate(200%);
  color: #0A1128; border: 1px solid rgba(255, 255, 255, 0.4);
  border-radius: 22px;
  box-shadow: 0 40px 100px -20px rgba(0, 0, 0, 0.35), inset 0 1px 0 rgba(255, 255, 255, 0.6);
  width: 100%; max-width: 1100px; max-height: 90vh;
  display: flex; flex-direction: column; overflow: hidden;
  animation: pcScaleIn 0.3s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}

@keyframes pcFadeIn { to { opacity: 1; } }
@keyframes pcScaleIn {
  from { transform: scale(0.94) translateY(16px); opacity: 0; }
  to { transform: scale(1) translateY(0); opacity: 1; }
}

.pc-highlight-plag { background-color: rgba(239, 68, 68, 0.14); border-bottom: 2px solid #EF4444; padding: 2px 5px; border-radius: 4px; cursor: pointer; transition: all 0.2s; }
.pc-highlight-plag:hover { background-color: rgba(239, 68, 68, 0.28); }
.pc-highlight-ai { background-color: rgba(139, 92, 246, 0.14); border-bottom: 2px solid #8B5CF6; padding: 2px 5px; border-radius: 4px; cursor: pointer; transition: all 0.2s; }
.pc-highlight-ai:hover { background-color: rgba(139, 92, 246, 0.28); }
.pc-highlight-paraphrase { background-color: rgba(245, 158, 11, 0.14); border-bottom: 2px solid #F59E0B; padding: 2px 5px; border-radius: 4px; cursor: pointer; transition: all 0.2s; }
.pc-highlight-paraphrase:hover { background-color: rgba(245, 158, 11, 0.28); }

.pc-toast {
  position: fixed; bottom: 28px; right: 28px;
  background: rgba(7, 15, 34, 0.92); backdrop-filter: blur(16px);
  color: #FFFFFF; border: 1px solid rgba(0, 242, 254, 0.35);
  padding: 14px 22px; border-radius: 16px;
  box-shadow: 0 16px 48px rgba(0, 0, 0, 0.35), 0 0 30px rgba(0, 242, 254, 0.1);
  font-size: 14px; font-weight: 600;
  display: flex; align-items: center; gap: 12px; z-index: 100000;
  animation: pcToastSlide 0.35s cubic-bezier(0.16, 1, 0.3, 1);
}
@keyframes pcToastSlide {
  from { transform: translateY(30px) scale(0.95); opacity: 0; }
  to { transform: translateY(0) scale(1); opacity: 1; }
}

/* ==========================================================================
   MICRO-ANIMATIONS & EFFECTS
   ========================================================================== */

@keyframes pcSlideUp {
  from { transform: translateY(20px); opacity: 0; }
  to { transform: translateY(0); opacity: 1; }
}
main > * { animation: pcSlideUp 0.4s cubic-bezier(0.16, 1, 0.3, 1) both; }
main > *:nth-child(1) { animation-delay: 0.05s; }
main > *:nth-child(2) { animation-delay: 0.1s; }
main > *:nth-child(3) { animation-delay: 0.15s; }
main > *:nth-child(4) { animation-delay: 0.2s; }
main > *:nth-child(5) { animation-delay: 0.25s; }
main > *:nth-child(6) { animation-delay: 0.3s; }

*:focus-visible { outline: 2px solid #2563EB !important; outline-offset: 2px !important; }

.pc-gradient-text {
  background: linear-gradient(135deg, #2563EB, #00F2FE, #4F46E5);
  background-size: 200% auto;
  -webkit-background-clip: text; -webkit-text-fill-color: transparent;
  background-clip: text; animation: pcTextGradient 4s ease infinite;
}
@keyframes pcTextGradient {
  0% { background-position: 0% center; }
  50% { background-position: 100% center; }
  100% { background-position: 0% center; }
}

/* ==========================================================================
   DOUBLE LAYOUT & NESTED CONTAINER FIXES (App Router Seamless Viewport)
   ========================================================================== */

/* 1. Prevent sidebar container from creating a blocking flow box pushing content down */
body > div > .min-h-screen > .hidden.lg\:block,
div.min-h-screen > div.hidden.lg\:block:first-child {
  height: 0 !important;
  width: 0 !important;
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  pointer-events: none !important;
  z-index: 40 !important;
}
aside.fixed {
  pointer-events: auto !important;
}

/* 2. Hide duplicate nested header */
header ~ * header,
.min-h-screen .min-h-screen header,
main header,
div.transition-all > div.min-h-screen header {
  display: none !important;
}

/* 3. Hide duplicate nested sidebar */
main aside,
.min-h-screen .min-h-screen aside,
div.min-h-screen div.min-h-screen > .hidden.lg\:block {
  display: none !important;
}

/* 4. Reset inner nested layout containers */
main .min-h-screen,
div.transition-all > div.min-h-screen {
  min-height: auto !important;
  background: transparent !important;
  padding: 0 !important;
  margin: 0 !important;
}
main .min-h-screen > .transition-all,
div.transition-all > div.min-h-screen > .transition-all {
  padding-left: 0 !important;
  margin: 0 !important;
}
main .min-h-screen main,
div.transition-all > div.min-h-screen main {
  padding-top: 1.5rem !important;
  margin-top: 0 !important;
}