:root{--bg:#101211;--panel:#1a1d1b;--line:#343933;--lime:#caff58;--muted:#a2aaa1;--text:#f4f6ef;color-scheme:dark;font-family:Inter,Arial,sans-serif;color:var(--text);background:var(--bg)}*{box-sizing:border-box}body{margin:0}a{color:inherit;text-decoration:none}button,input{font:inherit}button,a,input{touch-action:manipulation}button{cursor:pointer}button:disabled{opacity:.5;cursor:wait}a:focus-visible,button:focus-visible,input:focus-visible{outline:2px solid var(--lime);outline-offset:4px}button{color:inherit}h1,h2,h3,p{margin-top:0}h1{font-size:clamp(40px,5.6vw,78px);letter-spacing:-.065em;line-height:1.05;font-weight:800}h2{font-size:clamp(30px,3.3vw,48px);letter-spacing:-.045em;line-height:1.1}em{font-style:normal;color:var(--lime)}p{line-height:1.6}.site-nav{height:94px;margin:0 auto;max-width:1400px;padding:0 48px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);gap:20px}.wordmark{display:flex;align-items:center;gap:10px;font-size:23px;font-weight:800;letter-spacing:-1px}.logo{color:#161b13;background:var(--lime);width:35px;height:35px;border-radius:10px;display:flex;align-items:center;justify-content:center;letter-spacing:-7px;padding-right:5px;font-size:32px}.logo span{transform:translateY(4px)}.beta-tag{font:600 10px Arial;letter-spacing:1px;color:var(--muted);align-self:flex-start;margin-top:4px}.site-nav nav{display:flex;align-items:center;gap:28px;font-size:14px}.nav-login{border:1px solid #687261;border-radius:8px;padding:10px 18px}.nav-logout{border:0;background:none;color:var(--muted);padding:0}.home{max-width:1400px;margin:auto;padding:0 48px}.hero{display:grid;grid-template-columns:1.45fr 1fr;gap:60px;align-items:center;padding:62px 0 76px}.eyebrow{font-size:12px;font-weight:700;letter-spacing:1.8px;color:var(--muted)}.live-dot{display:inline-block;width:7px;height:7px;background:var(--lime);border-radius:50%;margin-right:8px}.hero-description{font-size:18px;color:#b0b8ae;max-width:490px;margin:26px 0 30px}.hero-actions{display:flex;align-items:center;gap:26px;flex-wrap:wrap}.button{display:inline-flex;justify-content:center;align-items:center;gap:22px;padding:16px 24px;border-radius:9px;border:1px solid var(--line);font-size:15px;font-weight:700;cursor:pointer}.primary{background:var(--lime);border-color:var(--lime);color:#192213}.primary:hover{background:#dafc97}.text-link{font-size:14px;text-decoration:underline;text-underline-offset:5px}.hero-note{font-size:12px;color:var(--muted);margin:19px 0 42px}.steps{display:flex;gap:22px;font-size:12px;color:var(--muted);flex-wrap:wrap}.steps b{color:var(--text);font-size:11px;margin-right:7px}.hero-game{max-width:348px;justify-self:center;width:100%;transform:rotate(3deg);background:#191e23;padding:12px;border:1px solid #4f5964;border-radius:24px;box-shadow:22px 22px 0 #caff5812}.hero-game canvas{display:block;width:100%;border-radius:16px;max-height:480px;object-fit:contain;background:#121829}.demo-label,.demo-caption{display:flex;justify-content:space-between;gap:8px;padding:12px 3px;font-size:9px;letter-spacing:.6px;color:#b9c9cb}.demo-caption{font-size:11px;letter-spacing:0}.demo-caption a{color:var(--lime)}.section-heading{display:flex;justify-content:space-between;align-items:end;gap:24px;margin-bottom:28px}.section-heading h2{margin-bottom:0}.mode-library{scroll-margin-top:28px;padding:50px 0;border-top:1px solid var(--line)}.filters{display:flex;gap:8px;flex-wrap:wrap}.filters button{background:transparent;border:1px solid var(--line);border-radius:24px;padding:9px 17px;font-size:13px}.filters button[aria-pressed=true]{background:#eaf1e4;color:#172017;border-color:#eaf1e4}.mode-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}.mode-card{border:1px solid var(--line);border-radius:13px;overflow:hidden;background:#191c19;transition:transform .2s,border-color .2s}.mode-card:hover{transform:translateY(-4px);border-color:#a9bb95}.mode-art{height:126px;background:#242d22;display:flex;align-items:center;justify-content:center;position:relative;color:#caff58}.mode-art>span:first-child{font-size:67px;line-height:1}.mode-kind{position:absolute;left:15px;top:14px;font-size:10px;letter-spacing:1px;text-transform:uppercase;padding:5px 8px;border:1px solid #ffffff33;border-radius:5px;color:#ffffffb0}.art-race,.art-ice,.art-knockout{background:#1f323f;color:#8fddff}.art-lava,.art-bomb,.art-crusher{background:#382b24;color:#ffb183}.art-drain,.art-crown,.art-maze{background:#2d283c;color:#c9acff}.art-colour,.art-lightning,.art-magnet{background:#37263a;color:#f7a8e5}.art-plinko{background:#363022;color:#ffe591}.art-blackhole{background:#211f35;color:#b7a2e7}.mode-card-copy{padding:20px}.mode-card-copy>div{display:flex;justify-content:space-between}.mode-card h3{font-size:19px;letter-spacing:-.5px;margin-bottom:8px}.mode-card p{font-size:13px;color:var(--muted);margin-bottom:20px}.mode-arrow{color:#9fae95}.mode-meta{font-size:12px;color:#c1caba}.mode-meta i{font-style:normal;margin:0 9px;color:#687461}.closing{padding:85px 0 90px;text-align:center;border-top:1px solid var(--line)}.closing h2{font-size:clamp(36px,4vw,58px)}.site-footer{max-width:1400px;margin:auto;border-top:1px solid var(--line);padding:32px 48px;display:flex;justify-content:space-between;gap:20px;align-items:center;color:var(--muted);font-size:12px}.site-footer .wordmark{font-size:18px;color:var(--text)}.account-shell{max-width:1100px;margin:80px auto 120px;padding:0 36px;display:grid;grid-template-columns:1fr 420px;gap:85px;align-items:center}.account-intro h1{font-size:52px}.account-intro p{color:var(--muted)}.account-panel{padding:34px;background:var(--panel);border:1px solid var(--line);border-radius:16px}.account-panel h2{font-size:30px}.account-panel>p,.account-switch{font-size:14px;color:var(--muted)}form label{display:block;font-size:14px;margin-top:22px}input{display:block;width:100%;background:#111511;border:1px solid #4c5548;color:#f5f8ee;border-radius:8px;padding:13px 14px;margin-top:9px}form .button{width:100%;margin-top:20px}.form-note{font-size:12px;color:var(--muted);margin:18px 0 0}.form-note a,.account-switch a{color:var(--lime);text-decoration:underline}.account-switch{margin:25px 0 0}.form-feedback{font-size:14px;color:#ffc299;margin:12px 0 0;min-height:1em}.projects-page{max-width:1200px;margin:65px auto 130px;padding:0 36px}.projects-page h1{font-size:48px}.projects-page .section-heading p{color:var(--muted)}.project-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}.project-card{padding:25px;border:1px solid var(--line);border-radius:12px;background:var(--panel)}.project-card h2{font-size:22px;overflow-wrap:anywhere}.project-card p{font-size:13px;color:var(--muted)}.project-card>div{display:flex;justify-content:space-between;align-items:center;gap:10px}.delete-project{background:none;border:0;color:#ecb2ac;font-size:12px}.empty-projects{padding:44px;background:var(--panel);border-radius:16px;grid-column:1/-1}.legal{max-width:800px;margin:60px auto 100px;padding:0 28px}.legal h1{font-size:48px}.legal h2{font-size:23px;margin-top:36px}.legal p{color:#b5bfb1}.creator-toolbar{max-width:1360px;margin:22px auto 0;padding:18px 28px;display:flex;gap:15px;align-items:end;flex-wrap:wrap;border-bottom:1px solid var(--line)}.creator-toolbar label{font-size:12px;color:var(--muted);flex:1;min-width:180px}.creator-toolbar input{margin-top:5px;padding:10px}.creator-toolbar button,.creator-toolbar>a{background:var(--panel);border:1px solid #535d4a;padding:12px 15px;border-radius:8px;font-size:13px}.creator-toolbar #save-project{background:var(--lime);color:#15220f;border-color:var(--lime)}.project-feedback{max-width:1304px;margin:10px auto;padding:0 28px;font-size:13px;color:#e5cd98;min-height:20px}.creator-page .topbar,.creator-page>footer:not(.site-footer){display:none}.creator-page .setup h1{font-size:36px;letter-spacing:-1.4px}.creator-page .privacy{font-size:12px}.creator-page .mode-switch{max-height:240px}.creator-page .site-nav{max-width:none}.creator-page main:not(.home){margin-top:20px}.creator-page .name-field input{margin-top:0}.creator-page #record{background:#caff58;color:#192213;border-color:#caff58}.creator-page #start{background:#272e25;color:#edf6e8;border:1px solid #687860}.creator-page.focus .site-nav,.creator-page.focus .creator-toolbar,.creator-page.focus .project-feedback,.creator-page.focus .site-footer{display:none}.creator-page .site-footer{max-width:none}.creator-page .beta{display:none}
@media(max-width:1000px){.hero{gap:35px}.site-nav,.home{padding-left:28px;padding-right:28px}.mode-cards{grid-template-columns:repeat(2,minmax(0,1fr))}.account-shell{gap:35px;grid-template-columns:1fr 380px}.account-intro h1{font-size:43px}.site-nav nav{gap:16px}.section-heading{align-items:start;flex-direction:column}.project-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:680px){.site-nav{height:auto;min-height:78px;padding:20px;flex-wrap:wrap;gap:15px}.site-nav nav{width:100%;font-size:12px;justify-content:space-between;gap:8px}.wordmark{font-size:22px}.home{padding:0 22px}.hero{grid-template-columns:1fr;padding:46px 0 55px;gap:38px}.hero h1{font-size:53px}.hero-description{font-size:16px}.hero-game{max-width:265px;transform:rotate(2deg)}.hero-game canvas{max-height:380px}.hero-note{line-height:1.7}.steps{gap:12px}.mode-cards{gap:13px}.mode-art{height:100px}.mode-art>span:first-child{font-size:50px}.mode-card-copy{padding:14px}.mode-card h3{font-size:16px;line-height:1.2}.mode-card p{font-size:12px;min-height:38px}.mode-meta{font-size:11px}.mode-meta i{margin:0 3px}.filters{gap:6px}.filters button{padding:8px 12px;font-size:12px}.closing{padding:55px 0}.site-footer{padding:25px 22px;flex-wrap:wrap}.site-footer>span{display:none}.account-shell{grid-template-columns:1fr;margin:42px auto 70px;padding:0 22px;gap:35px}.account-intro h1{font-size:42px}.account-panel{padding:24px}.projects-page{padding:0 22px;margin-top:40px}.project-grid{grid-template-columns:1fr}.creator-toolbar{padding:14px 20px;margin-top:8px}.creator-toolbar label{flex-basis:100%}.project-feedback{padding:0 20px}.creator-page .site-nav nav a:first-child{display:none}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}.hero-game{transform:none}}
[hidden]{display:none!important}
.creator-page{font-family:Arial,sans-serif}.creator-page h1,.creator-page h2{font-family:Arial,sans-serif}.creator-page .setup h1{font-size:32px;line-height:1.07;letter-spacing:-1.2px}.creator-page .ready-overlay h2{font-family:Arial,sans-serif;font-size:clamp(28px,3.8vw,48px);letter-spacing:-2px;line-height:1.02}

/* Site appearance is independent of the recorded game artwork. */
.theme-toggle{display:inline-flex;align-items:center;justify-content:center;gap:7px;white-space:nowrap;background:var(--panel);border:1px solid var(--line);border-radius:8px;padding:10px 12px;font-size:12px;color:var(--text)}
.theme-toggle [data-theme-icon]{font-size:16px;line-height:1}
:root[data-theme="light"]{color-scheme:light;--bg:#f7f8f2;--panel:#fff;--line:#d6ddcf;--muted:#586451;--text:#1c291b;--accent-ink:#456719;background:var(--bg);color:var(--text)}
[data-theme="light"] body{background:var(--bg);color:var(--text)}
[data-theme="light"] :is(a,button,input,select):focus-visible{outline-color:#456719}
[data-theme="light"] em,[data-theme="light"] .form-note a,[data-theme="light"] .account-switch a{color:var(--accent-ink)}
[data-theme="light"] .hero-description,[data-theme="light"] .legal p{color:#52614d}
[data-theme="light"] .nav-login{border-color:#b7c4ad}
[data-theme="light"] .filters button[aria-pressed=true]{background:#263e22;color:#fff;border-color:#263e22}
[data-theme="light"] .mode-card{background:#fff;box-shadow:0 3px 10px #293e1405}
[data-theme="light"] .mode-card:hover{border-color:#789763}
[data-theme="light"] .mode-art{background:#e7efd5;color:#486923}
[data-theme="light"] :is(.art-race,.art-ice,.art-knockout){background:#dfeef6;color:#226281}
[data-theme="light"] :is(.art-lava,.art-bomb,.art-crusher){background:#f8e6d9;color:#994d23}
[data-theme="light"] :is(.art-drain,.art-crown,.art-maze){background:#eee5fa;color:#7049a2}
[data-theme="light"] :is(.art-colour,.art-lightning,.art-magnet){background:#f4e2ee;color:#8e3977}
[data-theme="light"] .art-plinko{background:#f5edce;color:#816313}
[data-theme="light"] .art-blackhole{background:#e7e4f5;color:#62508d}
[data-theme="light"] .mode-kind{color:inherit;border-color:currentColor;background:#ffffff66}
[data-theme="light"] .mode-meta,[data-theme="light"] .mode-arrow{color:#536749}
[data-theme="light"] input{background:#fff;border-color:#b5c2ac;color:var(--text)}
[data-theme="light"] input::placeholder{color:#65765d}
[data-theme="light"] .form-feedback,[data-theme="light"] .delete-project{color:#a23929}
[data-theme="light"] .project-feedback{color:#655327}
[data-theme="light"] .creator-toolbar :is(button,a){border-color:#b5c2ac}
[data-theme="light"] .creator-page :is(.intro,.how p,.legend,.privacy,.format-label,.stage-bottom>span,.stage-bottom button,.text-button,.phase p,.phase small,.watch-note,.standing-progress){color:#586451}
[data-theme="light"] .creator-page .mode-switch button{background:#fff;color:var(--text)}
[data-theme="light"] .creator-page .mode-switch button[aria-pressed=true]{background:#e9f3d8;color:#385b18;border-color:#648843}
[data-theme="light"] .creator-page .mode-switch button:focus-visible{outline-color:#456719}
[data-theme="light"] .creator-page .racer-setting select{color:var(--text);border-color:#b5c2ac}
[data-theme="light"] .creator-page .name-field input{background:transparent;border-color:#bbc8b2}
[data-theme="light"] .creator-page .card-head{color:var(--text)}
[data-theme="light"] .creator-page .avatar-input{color:#304328;background:color-mix(in srgb,var(--accent),white 55%);border-color:color-mix(in srgb,var(--accent),#304328 40%)}
[data-theme="light"] .creator-page .upload-icon{background:#263e22;color:white}
[data-theme="light"] .creator-page :is(.sound-button[aria-pressed=true],.download-button,.result,.watch-note>span){color:#456719;border-color:#648843}
[data-theme="light"] .creator-page .phase>span{border-color:#bdc8b6;color:#586451}
[data-theme="light"] .creator-page .phase.active>span{color:#456719;border-color:#648843;background:#e9f3d8}
[data-theme="light"] .creator-page #start{background:#e9f3d8;color:#304623;border-color:#b0c59a}
[data-theme="light"] .creator-page .spark-icon{color:#886b15}
[data-theme="light"] .creator-page .ready-overlay h2{color:#f4f6ef}
[data-theme="light"] .creator-page .ready-overlay em{color:#caff58}
[data-theme="light"] .creator-page .canvas-wrap{box-shadow:0 18px 50px #23361c22}
@media(max-width:680px){.site-nav nav{flex-wrap:wrap;row-gap:12px}.theme-toggle{padding:8px 10px;font-size:12px}}

.art-meteor{background:#3c2528;color:#ffb17f}.art-sprint{background:#1c3534;color:#78ecc8}.art-treasure{background:#3c3220;color:#ffdd75}
[data-theme="light"] .art-meteor{background:#f9e1da;color:#984331}[data-theme="light"] .art-sprint{background:#dcf0e7;color:#236952}[data-theme="light"] .art-treasure{background:#f8edc9;color:#805f10}

.art-kart{background:#293e3b;color:#d1f99b}.art-horse{background:#433128;color:#f6cc9c}.art-golf{background:#214e39;color:#d9f19b}.art-tennis{background:#204547;color:#dcf57d}.art-boat{background:#17475b;color:#85ddf3}.art-penalty{background:#264734;color:#c5f4ae}.art-snow{background:#263f58;color:#c7efff}.art-archery{background:#4a3931;color:#ffe19a}
[data-theme="light"] :is(.art-kart,.art-horse,.art-golf,.art-tennis,.art-boat,.art-penalty,.art-snow,.art-archery){background:#e3efdf;color:#244b39}

.art-neon{background:radial-gradient(ellipse at 20% 90%,#fa319055,transparent 55%),linear-gradient(145deg,#10152f,#221134);color:#72efff;position:relative}.art-neon>span:first-child{text-shadow:0 0 22px #44e9ff}.art-neon::after{content:"3D";position:absolute;right:15px;bottom:12px;font-size:13px;letter-spacing:3px;color:#f2ceff}[data-theme="light"] .art-neon{background:linear-gradient(135deg,#16152c,#322145);color:#90f7ff}

.music-settings{border:1px solid var(--line);border-radius:12px;padding:16px;margin:0 0 20px;background:var(--panel);color:var(--text)}.music-heading{display:flex;align-items:center;justify-content:space-between;gap:10px}.music-heading strong{font-size:14px}.music-settings label{display:flex;justify-content:space-between;font-size:12px;margin-top:18px}.music-settings input{width:100%;margin:10px 0;accent-color:#849e34}.music-settings p{font-size:11px;color:var(--muted);line-height:1.5;margin:0}.music-settings output{font-variant-numeric:tabular-nums}