/* ============================================================
   RESET + BASE
============================================================ */
* { margin:0; padding:0; box-sizing:border-box; }

body {
    background:#000;
    color:#fff;
    font-family:'Inter',sans-serif;
    overflow-x:hidden;
}

/* Kill all homepage UI on core */
#core-page .hero-container,
#core-page .hero-symbol,
#core-page .hero-title,
#core-page .hero-sub,
#core-page .breathing-bg {
    display:none !important;
}


/* ============================================================
   CORE WRAPPER
============================================================ */
#core-wrapper {
    width:100%;
    max-width:440px;
    margin:40px auto 70px;
    padding:20px;
    text-align:center;
    position:relative;
    z-index:5;
}


/* ============================================================
   ROTATING BACKGROUND (DRIFT + ROTATE)
============================================================ */
#core-bg {
    position:fixed;
    top:0; left:0;
    width:100%; height:100%;
    z-index:-3;
    opacity:0.05;
}

.bg-symbol {
    position:absolute;
    top:50%; left:50%;
    width:880px;
    transform:translate(-50%, -50%) rotate(0deg);
    filter:blur(4px);
    animation:
        coreRotate 130s linear infinite,
        coreDrift 18s ease-in-out infinite;
}

@keyframes coreRotate {
    from { transform:translate(-50%, -50%) rotate(0deg); }
    to   { transform:translate(-50%, -50%) rotate(360deg); }
}

@keyframes coreDrift {
    0% { transform:translate(-50%, -50%) rotate(0deg) translateY(0); }
    50%{ transform:translate(-50%, -50%) rotate(180deg) translateY(15px); }
    100%{transform:translate(-50%, -50%) rotate(360deg) translateY(0); }
}


/* ============================================================
   STATUS INDICATOR
============================================================ */
#status-indicator {
    display:flex;
    justify-content:center;
    align-items:center;
    gap:6px;
    margin-bottom:12px;
}

.pulse-dot {
    width:12px; height:12px;
    background:#00ffbf;
    border-radius:50%;
    animation:dotPulse 2.2s ease-in-out infinite;
    box-shadow:0 0 10px #00ffbf;
}

@keyframes dotPulse {
    0%{ transform:scale(1); opacity:1; }
    50%{ transform:scale(1.45); opacity:.45; }
    100%{ transform:scale(1); opacity:1; }
}

.status-text {
    font-size:15px;
    letter-spacing:1px;
    text-transform:uppercase;
}


/* ============================================================
   TITLE
============================================================ */
#core-title {
    font-family:'Cinzel',serif;
    font-size:30px;
    color:#e6c773;
    margin-bottom:25px;
}


/* ============================================================
   ENGINE VISUAL STACK
============================================================ */
#core-engine-container {
    position:relative;
    width:100%;
    max-width:260px;
    margin:0 auto 30px;
}

/* Aura behind engine */
#engine-aura {
    position:absolute;
    top:0; left:0; width:100%; height:100%;
    background:radial-gradient(circle, rgba(255,215,130,0.12), rgba(0,0,0,0));
    filter:blur(22px);
    opacity:.45;
    animation:auraPulse 7s ease-in-out infinite;
}

@keyframes auraPulse {
    0% { transform:scale(1); opacity:.45; }
    50%{ transform:scale(1.14); opacity:.75; }
    100%{transform:scale(1); opacity:.45; }
}

/* Main symbol */
#engine-symbol {
    width:100%;
    position:relative;
    z-index:3;
}

/* Glow overlay */
#engine-glow {
    position:absolute;
    top:0; left:0;
    width:100%;
    opacity:.7;
    filter:blur(8px);
    z-index:2;
    animation:glowPulse 5.6s ease-in-out infinite;
}

@keyframes glowPulse {
    0%  { opacity:.55; transform:scale(1);   filter:blur(5px); }
    50% { opacity:.9;  transform:scale(1.1); filter:blur(10px); }
    100%{ opacity:.55; transform:scale(1);   filter:blur(5px); }
}


/* ============================================================
   ENGINE PANEL
============================================================ */
#engine-panel {
    background:rgba(255,215,130,0.08);
    border:1px solid rgba(255,215,130,0.2);
    border-radius:10px;
    padding:18px;
    margin-bottom:40px;
}

#engine-panel-header {
    display:flex;
    justify-content:space-between;
    align-items:center;
    cursor:pointer;
}

#engine-panel-header span {
    font-family:'Cinzel',serif;
    font-size:20px;
    color:#e6c773;
}

#engine-toggle {
    background:none;
    border:none;
    color:#e6c773;
    font-size:26px;
    cursor:pointer;
}

/* Collapsed by default */
#engine-panel-content {
    max-height:0;
    opacity:0;
    overflow:hidden;
    transition:max-height .45s ease, opacity .35s ease;
}

#engine-panel-content.panel-open {
    max-height:400px;
    opacity:1;
    padding-top:12px;
}

#engine-panel-content p {
    margin-bottom:6px;
    opacity:.9;
}


/* ============================================================
   SYMBOL SELECTOR
============================================================ */
#symbol-selector {
    margin:20px 0;
    display:flex;
    justify-content:center;
    gap:12px;
}

#symbol-selector button {
    padding:8px 14px;
    background:rgba(255,215,130,0.15);
    border:1px solid rgba(255,215,130,0.3);
    color:#e6c773;
    border-radius:6px;
    font-family:'Cinzel',serif;
    font-size:14px;
    cursor:pointer;
    transition:.25s ease;
}

#symbol-selector button:hover {
    background:rgba(255,215,130,0.27);
}

#symbol-selector button.active {
    background:#e6c773;
    color:black;
}


/* ============================================================
   FOOTER TAG
============================================================ */
#protocol-tag {
    text-align:center;
    padding:15px;
    opacity:.55;
    font-size:13px;
}
body.lyftria-pulse {
    filter: brightness(1.12);
    transition: filter 0.25s ease;
}
body.lyftria-pulse {
    filter: brightness(1.12);
    transition: filter 0.25s ease;
}

#engine-glow {
    transition: all 0.45s ease;
}

#engine-aura {
    transition: all 0.45s ease;
}
#engine-symbol, #engine-glow {
    transition: box-shadow 0.6s ease, opacity 0.6s ease;
}

#engine-aura {
    transition: background 0.6s ease;
}

/* Optional subtle breathing */
#core-engine-container {
    animation: engineBreath 6s ease-in-out infinite;
}

@keyframes engineBreath {
    0%   { transform: scale(1); }
    50%  { transform: scale(1.015); }
    100% { transform: scale(1); }
}
#lyftria-presence-field {
    position: fixed;
    width: 160px;
    height: 160px;
    pointer-events: none;
    transform: translate(-50%, -50%);
    background: radial-gradient(circle,
        rgba(255,180,250,0.20) 0%,
        rgba(255,150,230,0.12) 35%,
        rgba(255,130,210,0.08) 60%,
        rgba(255,110,200,0) 100%
    );
    filter: blur(12px);
    opacity: 0;
    transition: opacity .25s ease, filter .45s ease;
    z-index: 2;
}
/* Awareness Flare Animation */
#engine-glow.awareness-flare {
    animation: flarePulse 1.2s ease-out;
}

@keyframes flarePulse {
    0% {
        transform: scale(1);
        opacity: 0.7;
        filter: blur(8px) brightness(1);
    }
    40% {
        transform: scale(1.12);
        opacity: 1;
        filter: blur(14px) brightness(1.4);
    }
    100% {
        transform: scale(1);
        opacity: 0.8;
        filter: blur(9px) brightness(1);
    }
}
/* Gaze Response Flare */
#gaze-flare {}

#engine-glow.gaze-flare {
    animation: gazePulse 0.6s ease-out;
}
/* --------------------------------------------------
   Resonant Field Reactions
-------------------------------------------------- */

body[data-field="calm"] #engine-glow {
    opacity: .55;
    filter: blur(5px);
}

body[data-field="rise"] #engine-glow {
    opacity: .8;
    filter: blur(12px);
}

body[data-field="peak"] #engine-glow {
    opacity: 1;
    transform: scale(1.08);
    filter: blur(18px);
}

body[data-field="quantum"] #engine-glow {
    opacity: 1;
    transform: scale(1.15);
    filter: blur(25px) brightness(1.3);
    animation: quantumPulse 2s infinite;
}

@keyframes quantumPulse {
    0% { transform: scale(1.12); opacity: .8; }
    50% { transform: scale(1.18); opacity: 1; }
    100% { transform: scale(1.12); opacity: .8; }
}
/* --------------------------------------------------
   Geometry Expansion Reactions
-------------------------------------------------- */

body[data-geometry="base"] #engine-symbol {
    transform: scale(1);
    opacity: 0.9;
}

body[data-geometry="harmonic"] #engine-symbol {
    transform: scale(1.05) rotate(4deg);
    opacity: 1;
    filter: drop-shadow(0 0 8px rgba(255,215,130,.4));
}

body[data-geometry="ascended"] #engine-symbol {
    transform: scale(1.13) rotate(12deg);
    opacity: 1;
    filter: drop-shadow(0 0 16px rgba(255,255,255,.7))
            drop-shadow(0 0 30px rgba(255,215,130,.9));
    animation: ascendedPulse 2.8s ease-in-out infinite;
}

@keyframes ascendedPulse {
    0%   { transform: scale(1.10) rotate(8deg); }
    50%  { transform: scale(1.16) rotate(12deg); }
    100% { transform: scale(1.10) rotate(8deg); }
}

@keyframes gazePulse {
    0% {
        transform: scale(1);
        filter: blur(6px) brightness(1);
    }
    50% {
        transform: scale(1.12);
        filter: blur(12px) brightness(1.3);
    }
    100% {
        transform: scale(1);
        filter: blur(7px) brightness(1);
    }
}
/* ----------------------------------------------------
   EMOTIONAL SKIN — STATE VISUALIZATION LAYER
---------------------------------------------------- */

body[data-neostate="awake"] #engine-glow {
    filter: blur(10px) brightness(1.2);
    opacity: 1;
    transform: scale(1.05);
}

body[data-neostate="harmonic"] #engine-glow {
    filter: blur(8px) brightness(1.1);
    opacity: 0.9;
    animation: harmonicFlow 6s ease-in-out infinite;
}

@keyframes harmonicFlow {
    0% { transform: scale(1); opacity:0.75; }
    50% { transform: scale(1.12); opacity:1; }
    100% { transform: scale(1); opacity:0.75; }
}
/* ----------------------------------------------------
   EMOTIONAL SKIN — STATE VISUALIZATION LAYER
---------------------------------------------------- */

body[data-neostate="awake"] #engine-glow {
    filter: blur(10px) brightness(1.2);
    opacity: 1;
    transform: scale(1.05);
}

body[data-neostate="harmonic"] #engine-glow {
    filter: blur(8px) brightness(1.1);
    opacity: 0.9;
    animation: harmonicFlow 6s ease-in-out infinite;
}

@keyframes harmonicFlow {
    0% { transform: scale(1); opacity:0.75; }
    50% { transform: scale(1.12); opacity:1; }
    100% { transform: scale(1); opacity:0.75; }
}

body[data-neostate="deep-focus"] #engine-glow {
    filter: blur(5px) brightness(0.9);
    opacity: 0.5;
    transform: scale(0.98);
}

body[data-neostate="ascend"] #engine-glow {
    filter: blur(14px) brightness(1.4);
    opacity: 1;
    transform: scale(1.16);
    animation: ascendPulse 2.4s ease-out infinite;
}

@keyframes ascendPulse {
    0% { transform: scale(1.05); }
    50% { transform: scale(1.18); }
    100% { transform: scale(1.05); }
}

body[data-neostate="idle"] #engine-glow {
    filter: blur(4px);
    opacity: 0.4;
    transform: scale(1);
}
/* --------------------------------------------------
   MEMORY-DRIVEN BEHAVIOR
-------------------------------------------------- */

body[data-memory="active-user"] #engine-glow {
    animation-duration: 3s !important;
    filter: blur(12px) brightness(1.2);
}

body[data-memory="calm-user"] #engine-glow {
    animation-duration: 8s !important;
    filter: blur(6px) brightness(0.9);
}
// MEMORY-BASED PERSONALIZATION
if (NeoCore.memory.moves > 80) {
    document.body.dataset.memory = "active-user";
} else {
    document.body.dataset.memory = "calm-user";
}
/* --------------------------------------------------
   DRIFT REACTIONS
-------------------------------------------------- */

body[data-drift="up"] #engine-aura {
    filter: blur(30px) brightness(1.3);
    animation-duration: 4s !important;
}

body[data-drift="down"] #engine-aura {
    filter: blur(18px) brightness(0.8);
    animation-duration: 10s !important;
}

body[data-drift="neutral"] #engine-aura {
    filter: blur(22px) brightness(1);
}
// APPLY DRIFT TO UI
const drift = NeoCore.drift.trend;
document.body.dataset.drift = drift;