body {
    background-color: #030303;
    color: #E2E8F0;
    overflow-x: hidden;
    -webkit-font-smoothing: antialiased;
}

/* Cinematic Noise Overlay */
.bg-noise {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    pointer-events: none;
    z-index: 50;
    opacity: 0.05;
    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.65' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)'/%3E%3C/svg%3E");
}

/* Ensure Orbitron font is applied to logo */
.font-orbitron,
span.font-orbitron,
.font-orbitron.text-3xl {
    font-family: 'Orbitron', sans-serif !important;
    font-feature-settings: normal !important;
}

h1, h2, h3, h4, .font-display { letter-spacing: -0.02em; }
.glass-card {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.03) 0%, rgba(255, 255, 255, 0.00) 100%);
    backdrop-filter: blur(20px);
    border: 1px solid rgba(255, 255, 255, 0.08);
    box-shadow: 0 20px 40px -20px rgba(0,0,0,0.5);
}
.chart-line {
    fill: none;
    stroke-width: 2.5;
    stroke-linecap: round;
    stroke-linejoin: round;
    vector-effect: non-scaling-stroke;
}
/* Syntax Highlighting Overrides */
code[class*="language-"],
pre[class*="language-"] {
    color: #abb2bf;
    background: transparent !important;
    text-shadow: none !important;
    font-family: 'JetBrains Mono', monospace !important;
    font-size: 0.9rem;
}
.one-dark-toolbar {
    background: #21252b;
    border-bottom: 1px solid #2c313c;
}
.one-dark-editor {
    background: #282c34;
    box-shadow: inset 0 0 0 1px rgba(255,255,255,0.03);
    color: #abb2bf;
}
.code-tab-group {
    display: flex;
    gap: 0.35rem;
}
.code-tab {
    padding: 0.2rem 0.9rem;
    border-radius: 999px;
    border: 1px solid #3a3f4b;
    background: transparent;
    color: #8b92a3;
    font-size: 0.75rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    cursor: pointer;
    transition: all 0.2s ease;
}
.code-tab:focus-visible {
    outline: 2px solid #61afef;
    outline-offset: 2px;
}
.code-tab-active {
    background: #2c313c;
    border-color: #4b5261;
    color: #e6edf7;
    box-shadow: 0 0 0 1px rgba(255,255,255,0.04);
}
.code-pane-wrapper {
    position: relative;
    width: 100%;
}
.code-pane {
    display: none;
}
.code-pane.active {
    display: block;
}
.token.comment,
.token.prolog,
.token.doctype,
.token.cdata {
    color: #5c6370;
}
.token.punctuation {
    color: #abb2bf;
}
.token.property,
.token.tag,
.token.constant,
.token.symbol,
.token.deleted {
    color: #e06c75;
}
.token.boolean,
.token.number {
    color: #d19a66;
}
.token.selector,
.token.attr-name,
.token.string,
.token.char,
.token.builtin,
.token.inserted {
    color: #24D3EE;
}
.token.operator,
.token.entity,
.token.url,
.language-css .token.string,
.style .token.string,
.token.variable {
    color: #56b6c2;
}
.token.atrule,
.token.attr-value,
.token.function,
.token.class-name {
    color: #61afef;
}
.token.keyword {
    color: #c678dd;
}
.token.regex,
.token.important {
    color: #c678dd;
}
.token.bold { font-weight: bold; }
.token.italic { font-style: italic; }
.float-anim { animation: float 6s ease-in-out infinite; }
@keyframes float {
    0% { transform: translateY(0px); }
    50% { transform: translateY(-20px); }
    100% { transform: translateY(0px); }
}

/* Smooth fade for market shuffle */
.market-fade-enter { opacity: 0; transform: translateY(20px); }
.market-fade-enter-active { opacity: 1; transform: translateY(0); transition: all 0.4s ease-out; }
.market-fade-exit { opacity: 1; transform: scale(1); }
.market-fade-exit-active { opacity: 0; transform: scale(0.95); transition: all 0.3s ease-in; }

/* Live Market Price Flash Animations */
.price-flash-up,
.price-flash-down {
    animation: flashWhite 0.5s ease-out;
}

@keyframes flashWhite {
    0% {
        background-color: rgba(255, 255, 255, 0);
    }
    12% {
        background-color: rgba(255, 255, 255, 0.08);
    }
    100% {
        background-color: rgba(255, 255, 255, 0);
    }
}

/* Price text flash effect */
.font-mono.price-flash-up,
.font-mono.price-flash-down {
    animation: textFlashWhite 0.5s ease-out;
}

@keyframes textFlashWhite {
    0% { opacity: 1; }
    12% { opacity: 0.6; }
    100% { opacity: 1; }
}

/* Mobile Menu Styles */
#mobile-menu-panel nav a {
    position: relative;
    display: inline-block;
}

#mobile-menu-panel nav a::after {
    content: '';
    position: absolute;
    bottom: -4px;
    left: 0;
    width: 0;
    height: 2px;
    background: linear-gradient(90deg, #24D3EE, #fff);
    transition: width 0.3s ease;
}

#mobile-menu-panel nav a:hover::after {
    width: 100%;
}

/* Mobile hero image adjustments */
@media (max-width: 768px) {
    .hero-img-container {
        opacity: 0.2;
    }
}