/* LunaScene — canvas garden host + Root Console HUD.
   Pairs with components/luna/luna-scene.js. Loaded after luna-world.css. */

.luna-scene-host {
    position: absolute;
    inset: 0;
    z-index: 0;
}
.luna-scene-host .luna-scene-canvas {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    display: block;
}

/* Creation overlays + detail dock sit above the canvas. */
.luna-world-root .luna-creation-rail,
.luna-world-root .luna-creation-scene,
.luna-world-root .luna-drawer,
.luna-world-root .luna-detail,
.luna-world-root .luna-event-badge { z-index: 3; }

/* ===================== ROOT CONSOLE (bottom HUD) ===================== */
.luna-console {
    position: absolute;
    left: 50%;
    bottom: 22px;
    transform: translateX(-50%);
    display: flex;
    align-items: stretch;
    z-index: 4;
    font-family: 'Inter', system-ui, sans-serif;
    background: linear-gradient(180deg,
        color-mix(in srgb, var(--bg-elevated) 86%, var(--luna-accent) 14%) 0%,
        color-mix(in srgb, var(--bg-deepest) 90%, var(--luna-accent) 10%) 100%);
    border: 1px solid color-mix(in srgb, var(--luna-accent) 24%, transparent);
    border-radius: 14px;
    overflow: hidden;
    transition: opacity 420ms ease, transform 420ms cubic-bezier(0.16, 0.9, 0.24, 1);
    box-shadow:
        0 22px 60px rgba(0, 0, 0, 0.55),
        0 2px 0 rgba(0, 0, 0, 0.30),
        inset 0 1px 0 color-mix(in srgb, var(--luna-accent-hover) 18%, transparent),
        inset 0 0 60px color-mix(in srgb, var(--luna-accent) 8%, transparent);
}
.luna-console::before {
    content: '';
    position: absolute;
    left: 14px; right: 14px; top: 0; height: 1px;
    background: linear-gradient(90deg, transparent, color-mix(in srgb, var(--luna-accent-hover) 70%, transparent) 50%, transparent);
}
.luna-con-cell {
    position: relative;
    padding: 14px 30px;
    display: flex;
    flex-direction: column;
    gap: 3px;
    border-right: 1px solid color-mix(in srgb, var(--luna-accent) 12%, transparent);
}
.luna-con-cell:last-child { border-right: 0; }
.luna-con-cell::after {
    content: '';
    position: absolute;
    left: 30px; top: 18px;
    width: 5px; height: 5px;
    border-radius: 50%;
    background: var(--text-muted);
    transition: background 0.3s ease, box-shadow 0.3s ease;
}
.luna-console.has-running .luna-con-cell::after {
    background: var(--luna-profit);
    box-shadow: 0 0 9px color-mix(in srgb, var(--luna-profit) 80%, transparent);
}

/* Creation mode is for building a flight — fade the live portfolio console away. */
.mode-creation .luna-console {
    opacity: 0;
    transform: translateX(-50%) translateY(26px);
    pointer-events: none;
}
.luna-con-v {
    font-size: 19px;
    font-weight: 700;
    font-family: 'JetBrains Mono', monospace;
    padding-left: 15px;
    color: var(--text-primary);
    letter-spacing: 0.2px;
    white-space: nowrap;
}
.luna-con-v.pos { color: var(--luna-profit); }
.luna-con-v.neg { color: var(--luna-loss); }
.luna-con-l {
    font-size: 9px;
    text-transform: uppercase;
    letter-spacing: 1.8px;
    color: var(--text-secondary);
    font-weight: 700;
    padding-left: 15px;
}

@media (max-width: 760px) {
    .luna-con-cell { padding: 11px 16px; }
    .luna-con-v { font-size: 16px; }
}