/* The worlds borrow from CatProxy's original Cosmic, Kawaii, Cloud and arcade themes. */
html[data-site-theme="starlight"] :is(.site-home, .appearance-settings) {
    background-color: var(--page);
    background-image: radial-gradient(ellipse at 82% 7%, #623b7d40, transparent 40%), radial-gradient(ellipse at 8% 45%, #493b862a, transparent 45%), radial-gradient(circle, #d5bbff55 1px, transparent 1.5px), radial-gradient(circle, #ffc8e744 1px, transparent 1.5px);
    background-size: auto, auto, 97px 109px, 157px 143px;
    background-position: 0 0, 0 0, 15px 29px, 76px 82px;
}
html[data-site-theme="starlight"] .site-home .header h1 em {
    color: #e0c1ff;
    text-shadow: 0 4px 30px #b47dff33;
}
html[data-site-theme="starlight"] .site-home .card { background: linear-gradient(125deg, #2b2146, #1e1a36); }
html[data-site-theme="starlight"] .site-home .login-modal-button-banner { background: linear-gradient(110deg, #ccb1ff, #f4c8e9); }
html[data-site-theme="starlight"] .hero-illustration { filter: drop-shadow(0 15px 35px #a56aff20); }
html[data-site-theme="starlight"] .site-home .homepage-model-card:hover { box-shadow: 0 0 20px #bd96ff15; }

html[data-site-theme="mochi"] :is(.site-home, .appearance-settings) {
    background-color: var(--page);
    background-image: radial-gradient(ellipse at 2% 10%, #cfefdf90, transparent 30%), radial-gradient(ellipse at 95% 20%, #e3d3f790, transparent 35%), radial-gradient(circle, #dbaeb755 1.2px, transparent 1.5px);
    background-size: auto, auto, 23px 23px;
}
html[data-site-theme="mochi"] .site-home .header h1 em { color: #a3396a; }
html[data-site-theme="mochi"] .site-home .card { border: 2px solid var(--line); box-shadow: 0 6px 0 #ebcedd; }
html[data-site-theme="mochi"] .site-home .card h3 .section-symbol { background: #f8dce9; }
html[data-site-theme="mochi"] .site-home .endpoint-display { background: #f0faf5; border-style: dashed; border-color: #9bc5b0; }
html[data-site-theme="mochi"] .site-home .homepage-model-card { border: 1px solid #cfb7d8; background: #fbf7ff; border-radius: 18px; }
html[data-site-theme="mochi"] .site-home .login-modal-button-banner { border-radius: 24px; box-shadow: 0 4px 0 #76324f; }
html[data-site-theme="mochi"] .club-strip { background: #fff7da; border-color: #dfc998; color: #80623f; padding-inline: 15px; transform: rotate(-.35deg); }
html[data-site-theme="mochi"] .auth-modal-content { border: 2px solid var(--line); }

html[data-site-theme="arcade"] :is(.site-home, .appearance-settings) {
    background-color: var(--page);
    background-image: linear-gradient(#3c7c8c0b 1px, transparent 1px), linear-gradient(90deg, #3c7c8c0b 1px, transparent 1px), radial-gradient(ellipse at 90% 10%, #69539d25, transparent 42%);
    background-size: 32px 32px, 32px 32px, auto;
}
html[data-site-theme="arcade"] .site-home .header h1 { font-size: clamp(34px, 4.5vw, 51px); line-height: 1.22; font-weight: 700; letter-spacing: -.04em; text-wrap: balance; }
html[data-site-theme="arcade"] .site-home .header h1 em { text-shadow: 3px 3px 0 #bb5d9e55; }
html[data-site-theme="arcade"] .site-home .eyebrow { font-family: 'Consolas', monospace; color: #f7d889; }
html[data-site-theme="arcade"] .brand-mark { border-radius: 4px; transform: none; box-shadow: 3px 3px 0 #fa96d044; }
html[data-site-theme="arcade"] .site-brand { font-size: 24px; }
html[data-site-theme="arcade"] .site-home .card { border-top: 3px solid var(--accent); box-shadow: 5px 5px 0 var(--shadow); }
html[data-site-theme="arcade"] .site-home .card h3 { font-size: 16px; line-height: 1.5; }
html[data-site-theme="arcade"] .site-home :is(.login-modal-button-banner, .login-button-modal) { border-radius: 3px; font-family: 'Consolas', monospace; text-transform: uppercase; letter-spacing: .06em; box-shadow: 4px 4px 0 #2e666a; }
html[data-site-theme="arcade"] .site-home .section-symbol { border-radius: 2px; }
html[data-site-theme="arcade"] .site-home .stat-value { font-family: 'Consolas', monospace; }
html[data-site-theme="arcade"] .site-home :is(.homepage-model-card, .endpoint-display, .copy-button, .auth-modal-content) { border-radius: 3px; }
.arcade-quick-menu { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; padding: 9px 0; margin: 10px 0 25px; font: 12px 'Consolas', monospace; }
.quick-menu-label { color: var(--subtle); font-size: 10px; letter-spacing: .08em; margin-right: auto; }
.quick-menu-label > span { color: var(--line); margin-left: 10px; }
.arcade-quick-menu a { display: inline-flex; align-items: center; gap: 10px; color: var(--ink); background: var(--surface); border: 1px solid var(--line); border-radius: 3px; text-decoration: none; padding: 10px 13px; }
.arcade-quick-menu a > span:first-child { color: var(--accent); font-size: 10px; }
.arcade-quick-menu a > span:last-child { color: var(--subtle); }
.arcade-quick-menu a:hover { border-color: var(--accent); background: var(--surface-raised); }
.site-home :is(#systemStats, #modelRoster, #connectionGuide) { scroll-margin-top: 20px; }

.art-float { animation: cat-drift 6s ease-in-out infinite; transform-box: fill-box; transform-origin: center; }
.world-art-mochi .art-float { animation-duration: 8s; }
.world-art-arcade .art-float { animation-timing-function: steps(6); }
.art-sparkles { animation: cat-twinkle 5s ease-in-out infinite; }
.theme-miniature :is(.art-float, .art-sparkles) { animation: none; }
@keyframes cat-drift { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-7px); } }
@keyframes cat-twinkle { 0%, 100% { opacity: .55; } 50% { opacity: 1; } }

@media (max-width: 700px) {
    html[data-site-theme="arcade"] .site-home .header h1 { font-size: clamp(31px, 8vw, 40px); }
    html[data-site-theme="arcade"] .site-home .card h3 { font-size: 14px; }
    html[data-site-theme="arcade"] .site-brand { font-size: 22px; }
    .site-nav-note { max-width: 125px; text-align: right; font-size: 10px; }
    .site-nav-note span { display: none; }
    .arcade-quick-menu { gap: 8px; margin-top: 6px; }
    .quick-menu-label { width: 100%; margin-bottom: 3px; }
    .arcade-quick-menu a { flex: 1 1 auto; justify-content: center; padding: 10px 9px; font-size: 11px; gap: 7px; }
}
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}
