html {
    color-scheme: dark;
}

body {
    text-rendering: optimizeLegibility;
    color: var(--theme-text);
}

a,
button,
input,
select,
textarea,
summary {
    -webkit-tap-highlight-color: transparent;
}

a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
summary:focus-visible,
[tabindex]:focus-visible {
    outline: 2px solid rgba(34, 211, 238, 0.9);
    outline-offset: 3px;
    box-shadow: 0 0 0 5px rgba(34, 211, 238, 0.18);
}

.theme-scene {
    position: fixed;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    overflow: hidden;
    background:
        radial-gradient(ellipse 120% 90% at 50% -15%, rgba(34, 211, 238, 0.22), transparent 55%),
        radial-gradient(ellipse 70% 50% at 110% 30%, rgba(168, 85, 247, 0.18), transparent 50%),
        radial-gradient(ellipse 55% 45% at -5% 90%, rgba(244, 114, 182, 0.1), transparent 50%),
        linear-gradient(168deg, var(--theme-bg-0) 0%, var(--theme-bg-1) 42%, var(--theme-bg-2) 100%);
}

.theme-scene__blob {
    position: absolute;
    border-radius: 50%;
    filter: blur(76px);
    opacity: 0.42;
    animation: theme-blob-float 18s ease-in-out infinite;
}

.theme-scene__blob--1 {
    width: 420px;
    height: 420px;
    top: -8%;
    left: 12%;
    background: rgba(34, 211, 238, 0.35);
}

.theme-scene__blob--2 {
    width: 360px;
    height: 360px;
    right: -6%;
    bottom: 10%;
    background: rgba(168, 85, 247, 0.32);
    animation-delay: -6s;
}

.theme-scene__blob--3 {
    width: 280px;
    height: 280px;
    left: 40%;
    bottom: -12%;
    background: rgba(244, 114, 182, 0.28);
    animation-delay: -12s;
}

.theme-page-main {
    position: relative;
    z-index: var(--theme-z-base);
}

body.theme-ready .theme-page-main {
    animation: theme-page-enter var(--theme-dur-3) var(--theme-ease-out) both;
}

.theme-gradient-text {
    background: var(--theme-gradient-cta);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    background-size: 200% auto;
    animation: theme-title-shine 8s ease-in-out infinite;
}

.theme-accent-bar {
    border-left: 4px solid transparent;
    border-image: var(--theme-feed-neon) 1;
}

#theme-page-loader {
    position: fixed;
    inset: 0;
    z-index: var(--theme-z-loader);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 20px;
    background: var(--theme-bg-0);
    transition: opacity var(--theme-dur-2) var(--theme-ease-out), visibility var(--theme-dur-2);
}

#theme-page-loader.theme-page-loader--hidden {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
}

.theme-page-loader__logo {
    font-size: 1.35rem;
    font-weight: 800;
    letter-spacing: -0.02em;
    color: var(--theme-text);
}

.theme-page-loader__logo {
    color: #f8fafc;
}

html.theme-reduce-motion #theme-page-loader {
    display: none !important;
}
