/* ══════════════════════════════════════════════════════
   PyForm — Liquid Glass Base (shared across pages)
   Safe additive overlay: aurora background, Inter font,
   glass palette, iOS-style radii. Uses high specificity
   but avoids breaking existing layouts.
   ══════════════════════════════════════════════════════ */

:root {
    --lg-bg: #07080f;
    --lg-bg-deep: #03040a;
    --lg-glass: rgba(255,255,255,0.07);
    --lg-glass-hi: rgba(255,255,255,0.11);
    --lg-border: rgba(255,255,255,0.12);
    --lg-border-hi: rgba(255,255,255,0.20);
    --lg-indigo: #6366f1;
    --lg-cyan: #06b6d4;
    --lg-emerald: #10b981;
    --lg-text: #f8fafc;
    --lg-text-sec: rgba(248,250,252,0.60);
    --lg-text-muted: rgba(248,250,252,0.32);
    --lg-r-card: 20px;
    --lg-r-pill: 100px;
    --lg-r-input: 12px;
    --lg-blur: 40px;
    --lg-blur-nav: 60px;
    --lg-ease: cubic-bezier(0.4, 0, 0.2, 1);
    --lg-ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
}

/* Apply only when body is opted in via class */
body.lg-enabled {
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
    background: var(--lg-bg-deep) !important;
    color: var(--lg-text) !important;
    -webkit-font-smoothing: antialiased;
    font-feature-settings: 'cv11', 'ss01', 'calt';
    letter-spacing: -0.011em;
}

.lg-aurora {
    position: fixed; inset: 0; z-index: -2; pointer-events: none; overflow: hidden;
    background: var(--lg-bg-deep);
}
.lg-aurora::before {
    content: ''; position: absolute; inset: -10%;
    background:
        radial-gradient(1000px 700px at 15% 10%, rgba(99,102,241,0.22), transparent 55%),
        radial-gradient(900px 700px at 85% 20%, rgba(139,92,246,0.16), transparent 55%),
        radial-gradient(1000px 800px at 50% 100%, rgba(6,182,212,0.14), transparent 60%);
    animation: lg-mesh 30s ease-in-out infinite;
}
.lg-aurora-blob {
    position: absolute; border-radius: 50%; filter: blur(140px);
    animation: lg-drift 26s ease-in-out infinite;
    mix-blend-mode: screen;
}
.lg-aurora-blob.b1 { width: 480px; height: 480px; background: rgba(99,102,241,0.22); top: -8%; left: -8%; }
.lg-aurora-blob.b2 { width: 440px; height: 440px; background: rgba(139,92,246,0.18); top: 20%; right: -10%; animation-delay: -6s; }
.lg-aurora-blob.b3 { width: 520px; height: 520px; background: rgba(6,182,212,0.16); bottom: -12%; left: 18%; animation-delay: -12s; }
.lg-aurora-blob.b4 { width: 420px; height: 420px; background: rgba(56,189,248,0.16); bottom: 0%; right: 8%; animation-delay: -18s; }

@keyframes lg-drift {
    0%, 100% { transform: translate(0,0) scale(1); }
    33% { transform: translate(60px,-40px) scale(1.08); }
    66% { transform: translate(-40px,50px) scale(0.95); }
}
@keyframes lg-mesh {
    0%, 100% { transform: translate(0,0) scale(1); filter: hue-rotate(0deg); }
    50% { transform: translate(-16px,-8px) scale(1.04); filter: hue-rotate(-6deg); }
}

body.lg-enabled ::-webkit-scrollbar { width: 10px; height: 10px; }
body.lg-enabled ::-webkit-scrollbar-track { background: transparent; }
body.lg-enabled ::-webkit-scrollbar-thumb { background: rgba(255,255,255,0.08); border-radius: 10px; }
body.lg-enabled ::-webkit-scrollbar-thumb:hover { background: rgba(99,102,241,0.35); }
body.lg-enabled ::selection { background: rgba(99,102,241,0.35); color: #fff; }