/* 2026 refinement: retain pixel borders, photography, and neon character. */
:root { --neon-green: #81ffc9; --neon-slimer: #81ffc9; }
body::before { opacity: .32; animation: none; }
.hero-content { width: min(1180px, 100%); padding: 80px 32px; }
.hero-eyebrow {
    color: #b0e6ee; font-family: var(--font-display); font-size: .75rem;
    letter-spacing: .25em; margin-bottom: 28px; text-shadow: none;
}
.site-title {
    animation: none;
    font-size: clamp(2.4rem, 6.5vw, 5.5rem); line-height: 1.3;
    letter-spacing: .055em; text-shadow: 0 0 6px #00ffff80, 0 0 24px #00ffff50;
}
.site-tagline { font-size: clamp(.9rem, 1.8vw, 1.35rem); letter-spacing: .14em; text-shadow: 0 0 12px #ff00ff80; }
.main-nav { max-width: 980px; margin: 36px auto 0; }
.nav-list { gap: 20px 24px; }
.nav-link { display: inline-flex; align-items: center; min-height: 48px; padding: 14px 20px; background-color: #090d20b3; }
.nav-link:hover { animation-iteration-count: 1; }
.cta-button { min-height: 52px; box-shadow: 0 0 18px #ff6ec730; }
.section { padding-top: 88px; padding-bottom: 88px; }
.section-content { max-width: 1200px; }
.section-title { animation: none; text-shadow: 0 0 8px #ff6ec780, 0 0 22px #ff6ec740; }
.about-text p { line-height: 1.9; color: #c6c8da; }
.card { background: linear-gradient(145deg, #17132cde, #090d1de8); border-color: #7b2fff70; transition: transform .2s, border-color .2s, box-shadow .2s; }
.card:hover { box-shadow: 0 12px 30px #0006, 0 0 16px #00ffff20; }
.gallery-grid { max-width: 1400px; margin-inline: auto; gap: 28px; }
.gallery-item { aspect-ratio: 3 / 2; border-width: 1px; background: #151227; box-shadow: 4px 4px 0 #0a0a1a, 6px 6px 0 #00ffff80; }
.gallery-item img { width: 100%; height: 100%; object-fit: cover; }
.gallery-item .crt-screen { opacity: .25; box-shadow: inset 0 0 24px #0005; }
.gallery-item:hover { box-shadow: 4px 4px 0 #0a0a1a, 8px 8px 0 #ff00ff90; }
.lightbox-close, .lightbox-nav { font-family: inherit; background: #080b19d9; border: 1px solid #00ffff60; min-width: 48px; min-height: 48px; padding: 0 12px; line-height: 1; }
.lightbox img { max-height: 85vh; object-fit: contain; }
.music-widget { box-shadow: 0 8px 24px #0006; }
.volume-slider { min-height: 28px; }
#ghost-score { font-size: .8rem; padding: 10px 16px; opacity: .8; }
:where(a, button, input, textarea, [tabindex]):focus-visible { outline: 2px solid #81ffc9; outline-offset: 6px; }
.custom-cursor { transition: filter .2s; }
.back-link { display: inline-flex; min-height: 44px; align-items: center; }
.page-header { background-attachment: scroll; }
@media (max-width: 700px) {
    .hero, .page-header { background-image: var(--mobile-background) !important; background-attachment: scroll; }
    .hero-content { padding: 90px 22px 130px; }
    .hero-eyebrow { font-size: .65rem; letter-spacing: .12em; }
    .site-title { font-size: clamp(2rem, 9vw, 3.6rem); overflow-wrap: normal; }
    .site-tagline { letter-spacing: .06em; margin-bottom: 24px; }
    .nav-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
    .nav-link { justify-content: center; font-size: .6rem; padding: 12px 6px; margin: 0; width: 100%; }
    .section { padding: 60px 20px; }
    .gallery-grid { padding: 0; gap: 22px; grid-template-columns: 1fr; }
    .music-widget { bottom: 12px; left: 12px; padding: 10px; }
    #ghost-score { top: 12px; right: 12px; font-size: .65rem; }
    .lightbox-prev { left: 8px; }
    .lightbox-next { right: 8px; }
}
@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
    .binary-title-overlay, .custom-cursor, #neon-rain { display: none !important; }
    body, a, button, .gallery-item { cursor: auto !important; }
}
.page-paused *, .page-paused *::before, .page-paused *::after { animation-play-state: paused !important; }
