@font-face {
    font-family: 'Minecrafter';
    src: url('../Minecrafter-MA3Dw.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

:root {
    --bg-deep: #0a0907;
    --bg-panel: rgba(18, 16, 14, 0.72);
    --cream: #f3ebe2;
    --cream-soft: rgba(243, 235, 226, 0.72);
    --cream-muted: rgba(243, 235, 226, 0.42);
    --sage: #8fbf9f;
    --sage-bright: #b8dcc4;
    --sage-dim: rgba(143, 191, 159, 0.14);
    --ember: #d4a574;
    --honey: #e8c49a;
    --line: rgba(243, 235, 226, 0.08);
    --line-bright: rgba(243, 235, 226, 0.14);
    --radius-lg: 28px;
    --radius-md: 18px;
    --radius-sm: 12px;
    --font-ui: 'Outfit', 'Segoe UI', sans-serif;
    --font-display: 'Minecrafter', var(--font-ui);
    --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
}

* { box-sizing: border-box; }

html, body {
    margin: 0;
    width: 100%;
    min-height: 100%;
    background: var(--bg-deep);
    font-family: var(--font-ui);
    color: var(--cream);
    -webkit-font-smoothing: antialiased;
    cursor: url('../assets/cursor-sword.png') 2 2, default;
}

a, button, label[for], select, summary {
    cursor: url('../assets/cursor-sword.png') 2 2, pointer;
}

::selection {
    background: rgba(143, 191, 159, 0.28);
    color: var(--cream);
}

.scene-fixed {
    position: fixed;
    inset: 0;
    z-index: 0;
    overflow: hidden;
    pointer-events: none;
}

.scene-fixed .scene-backdrop,
.scene-fixed .scene-media,
.scene-fixed .ambient-mesh,
.scene-fixed .ambient-glow,
.scene-fixed .scene-vignette,
.scene-fixed .scene-grain {
    pointer-events: none;
}

.scene-backdrop {
    position: absolute;
    inset: -10%;
    background: url('../assets/scene-poster.jpg') center / cover no-repeat;
    filter: blur(20px) brightness(0.5) saturate(1.02);
    transform: scale(1.08);
    z-index: 0;
}

.scene-media {
    position: absolute;
    inset: 0;
    z-index: 1;
}

.scene-video,
.scene-static {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center center;
}

.scene-video {
    opacity: 0;
    transition: opacity 0.42s linear;
    filter: contrast(1.04) saturate(1.02);
}

.scene-video.is-active { opacity: 1; }

.scene-video.is-idle { display: none; }

#scene.is-loop-reset .scene-video.is-active {
    animation: loopResetFade 0.5s ease-out;
}

@keyframes loopResetFade {
    0% { opacity: 0.55; filter: contrast(1.04) saturate(1.02) brightness(0.88); }
    100% { opacity: 1; filter: contrast(1.04) saturate(1.02) brightness(1); }
}

.scene-static {
    display: none;
    background: url('../assets/background.jpg') center / cover no-repeat;
}

.scene-fixed[data-scene="wide"] .scene-video { display: none; }
.scene-fixed[data-scene="wide"] .scene-static { display: block; }
.scene-fixed[data-scene="wide"] .scene-backdrop {
    background-image: url('../assets/background.jpg');
    filter: blur(22px) brightness(0.48) saturate(1.05);
}

.ambient-mesh {
    position: absolute;
    inset: 0;
    z-index: 2;
    background:
        radial-gradient(ellipse 55% 45% at 18% 28%, rgba(212, 165, 116, 0.1) 0%, transparent 70%),
        radial-gradient(ellipse 48% 40% at 82% 72%, rgba(143, 191, 159, 0.07) 0%, transparent 72%),
        radial-gradient(ellipse 70% 50% at 50% 100%, rgba(10, 8, 6, 0.38) 0%, transparent 70%);
}

.ambient-glow {
    position: absolute;
    z-index: 2;
    border-radius: 50%;
    filter: blur(80px);
    animation: orbDrift 14s ease-in-out infinite;
}

.ambient-glow--ember {
    width: min(46vw, 480px);
    height: min(46vw, 480px);
    left: -10%;
    top: 12%;
    background: radial-gradient(circle, rgba(212, 165, 116, 0.24) 0%, transparent 68%);
}

.ambient-glow--moss {
    width: min(40vw, 420px);
    height: min(40vw, 420px);
    right: -8%;
    bottom: 18%;
    background: radial-gradient(circle, rgba(143, 191, 159, 0.16) 0%, transparent 70%);
    animation-delay: -7s;
}

.ambient-glow--haze {
    width: min(60vw, 640px);
    height: min(30vw, 320px);
    left: 50%;
    bottom: 8%;
    transform: translateX(-50%);
    background: radial-gradient(circle, rgba(232, 196, 154, 0.08) 0%, transparent 72%);
    animation: none;
    filter: blur(100px);
}

@keyframes orbDrift {
    0%, 100% { opacity: 0.55; transform: translate(0, 0) scale(1); }
    50% { opacity: 0.82; transform: translate(12px, -8px) scale(1.04); }
}

.scene-vignette {
    position: absolute;
    inset: 0;
    z-index: 4;
    background:
        radial-gradient(ellipse 72% 58% at 50% 42%, transparent 0%, rgba(8, 6, 4, 0.38) 100%),
        linear-gradient(180deg, rgba(8, 6, 4, 0.42) 0%, transparent 20%, transparent 64%, rgba(8, 6, 4, 0.82) 100%);
}

.scene-grain {
    position: absolute;
    inset: 0;
    z-index: 8;
    opacity: 0.028;
    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
    animation: grainShift 0.5s steps(2) infinite;
}

@keyframes grainShift {
    to { transform: translate(1%, -1%); }
}

@media (prefers-reduced-motion: reduce) {
    .scene-video { display: none; }
    .scene-static { display: block !important; }
    .ambient-glow { animation: none; }
    .scene-grain { animation: none; }
    #scene.is-loop-reset .scene-video.is-active { animation: none !important; }
}
