@font-face{font-family:ChipkaloPoppins;src:url('/restyle/assets/poppins-regular.ttf') format('truetype');font-weight:400;font-display:swap}
@font-face{font-family:ChipkaloPoppins;src:url('/restyle/assets/poppins-bold.ttf') format('truetype');font-weight:700;font-display:swap}
@font-face{font-family:'Bakbak One';src:url('/fonts/bakbak-one.ttf') format('truetype');font-weight:400;font-display:swap}
:root{--ck-base:#ffca22;--ck-orb-opacity:.85;--ck-orb-blur:36px;--brand-purple:#480f7f;--brand-purple-deep:#2c0752;--brand-yellow:#ffca22;--brand-yellow-shade:#ffb809}
*{box-sizing:border-box}html{color-scheme:light}body{margin:0;min-height:100dvh;display:grid;place-items:center;background:var(--brand-yellow);font-family:ChipkaloPoppins,sans-serif;color:var(--brand-purple);isolation:isolate}
.home-glass{width:min(88vw,680px);margin:40px auto;padding:64px 56px;border-radius:32px;background:color-mix(in srgb,var(--brand-yellow) 66%,transparent);border:1px solid color-mix(in srgb,var(--brand-yellow-shade) 70%,transparent);box-shadow:0 24px 80px #2c075230,inset 0 1px 0 #ffca22;backdrop-filter:blur(30px);-webkit-backdrop-filter:blur(30px)}
h1{margin:0 0 44px;line-height:0}.home-logo{display:block;width:100%;height:auto;max-width:500px}
label{display:block;margin-bottom:14px;font-family:'Bakbak One',sans-serif;font-size:24px;font-weight:400;line-height:1.6}input{width:100%;height:54px;border:1px solid color-mix(in srgb,var(--brand-purple) 35%,transparent);border-radius:14px;background:color-mix(in srgb,var(--brand-yellow) 70%,transparent);font:inherit;padding:0 16px;opacity:1;color:var(--brand-purple)}
.restyle-link{display:inline-flex;align-items:center;gap:28px;margin-top:26px;min-height:46px;padding:12px 22px;border-radius:100px;background:var(--brand-purple);color:var(--brand-yellow);font-size:14px;font-weight:700;text-decoration:none}.restyle-link:hover{background:var(--brand-purple-deep)}a:focus-visible{outline:3px solid var(--brand-purple);outline-offset:4px}
.ck-ambient{position:fixed;inset:0;z-index:-1;overflow:hidden;pointer-events:none;background:var(--ck-base);contain:strict}.ck-orb{position:absolute;left:0;top:0;width:clamp(190px,29vmax,500px);height:clamp(190px,29vmax,500px);border-radius:50%;opacity:var(--ck-orb-opacity);filter:blur(var(--ck-orb-blur));background-image:radial-gradient(circle at 28% 25%,#ffffffb3,transparent 63%);will-change:transform;animation-timing-function:ease-in-out;animation-iteration-count:infinite}.ckAmbientSuspended .ck-orb{animation-play-state:paused}
@media(max-width:600px){.home-glass{padding:40px 26px;border-radius:24px}h1{letter-spacing:-2.4px;margin-bottom:34px}label{font-size:21px}.ck-orb{width:65vmin;height:65vmin;filter:blur(28px)}}
@media(prefers-reduced-motion:reduce){.ck-orb{animation:none!important;will-change:auto}}@media(prefers-reduced-transparency:reduce){.home-glass{background:var(--brand-yellow);backdrop-filter:none;-webkit-backdrop-filter:none}}
/* Homepage interaction update: approved logo, purple glass, yellow entry controls. */
.home-glass{position:relative;z-index:1;background:color-mix(in srgb,var(--brand-purple) 86%,transparent);border-color:color-mix(in srgb,var(--brand-purple) 70%,var(--brand-yellow));color:var(--brand-yellow);box-shadow:0 24px 80px #2c07524d,inset 0 1px 0 #723ca1}
.home-glass input{background:var(--brand-yellow);color:var(--brand-purple);border-color:var(--brand-yellow-shade)}
.entry-button{display:inline-flex;align-items:center;justify-content:center;margin-top:26px;min-height:46px;padding:12px 26px;border:0;border-radius:100px;background:var(--brand-yellow);color:var(--brand-purple);font:700 14px ChipkaloPoppins,sans-serif}.entry-button:disabled{opacity:.7;cursor:not-allowed}
.ck-ambient{z-index:0}.ck-orb{pointer-events:none}.ck-orb[data-stuck=true]{cursor:default}.ck-orb:focus-visible{outline:3px solid var(--brand-purple);outline-offset:8px}
@media(prefers-reduced-transparency:reduce){.home-glass{background:var(--brand-purple)}}
.site-home{background:#fff;--ck-base:#fff}.site-home .game-glass{background:#ffffff18}.creator-credit{position:fixed;right:18px;bottom:12px;z-index:4;color:var(--brand-purple);font-size:11px;pointer-events:none}.game-only .home-glass{padding-block:46px}.game-only h1{margin-bottom:0}.game-only .game-note{margin-inline:18px}
/* Only the newest simple ball game: no score, papers or levels. */
.home-glass{z-index:3}.game-glass{position:fixed;inset:0;z-index:1;pointer-events:none;background:#ffca2226;backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px)}.caught-balls,.falling-balls{position:fixed;inset:0;pointer-events:none;overflow:hidden;contain:strict}.caught-balls{z-index:0}.falling-balls{z-index:2}.falling-ball,.caught-ball{position:absolute;left:0;top:0;width:40px;height:40px;min-width:0;min-height:0;padding:0;border:0;border-radius:50%;background:none;box-shadow:none;will-change:transform}.falling-ball{cursor:pointer;pointer-events:auto;touch-action:manipulation}.ball-body{display:block;width:100%;height:100%;border-radius:50%;background-image:radial-gradient(circle at 28% 23%,#ffffffd9,transparent 42%),radial-gradient(circle at 75% 82%,#2c07524d,transparent 60%);box-shadow:0 4px 9px #2c07522b}.caught-ball{pointer-events:none;opacity:.85;will-change:auto}.caught-ball .ball-body{animation:caughtBallRotate 7s linear infinite}.falling-ball:focus-visible{outline:3px solid #480f7f;outline-offset:4px}@keyframes caughtBallRotate{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}@media(prefers-reduced-motion:reduce){.caught-ball .ball-body{animation:none}}@media(prefers-reduced-transparency:reduce){.game-glass{backdrop-filter:none;-webkit-backdrop-filter:none}}
.entry-stack{position:relative;z-index:3;width:min(88vw,680px);margin:40px auto}.entry-stack .home-glass{width:100%;margin:0}.game-note{margin:14px 0 0;text-align:center;color:#480f7f;font-size:12px;line-height:1.7}
.home-logo{margin-inline:auto}.home-glass{text-align:center}.home-glass input{text-align:center}
.caught-balls{width:100%;height:100%}
.game-stats{position:fixed;top:14px;right:18px;z-index:4;padding:8px 13px;border-radius:30px;background:#ffffffb8;color:var(--brand-purple);font-size:12px;line-height:1.5;pointer-events:none;backdrop-filter:blur(8px)}
.falling-ball{width:44px;height:44px;display:grid;place-items:center}.falling-ball .ball-body{width:20px;height:20px;background-color:transparent;border:1px solid color-mix(in srgb,var(--bubble-color) 70%,transparent);background-image:radial-gradient(circle at 28% 22%,#fffffff2 0 9%,transparent 25%),radial-gradient(circle at 46% 43%,color-mix(in srgb,var(--bubble-color) 3%,transparent) 35%,color-mix(in srgb,var(--bubble-color) 12%,transparent) 65%,color-mix(in srgb,var(--bubble-color) 48%,transparent) 100%);box-shadow:inset 1px 1px 2px #ffffffc9,inset -1px -1px 3px color-mix(in srgb,var(--bubble-color) 30%,transparent),0 1px 3px #480f7f18}
.bubble-poof{position:fixed;z-index:2;pointer-events:none;border:2px dotted var(--bubble-color);border-radius:50%;transform:translate(-50%,-50%);animation:bubblePoof .2s ease-out forwards}@keyframes bubblePoof{to{transform:translate(-50%,-50%) scale(1.65);opacity:0}}.site-home{touch-action:manipulation}@media(prefers-reduced-motion:reduce){.bubble-poof{animation:none;opacity:.5}}
.entry-stack{pointer-events:none}.home-glass{background:color-mix(in srgb,var(--brand-purple) 50%,transparent);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}.home-glass input,.home-glass button,.home-glass label,.home-glass a{pointer-events:auto}.home-glass label{text-shadow:0 1px 3px var(--brand-purple-deep)}.home-logo{pointer-events:auto;user-select:none;cursor:default}
@media(prefers-reduced-transparency:reduce){.home-glass{background:var(--brand-purple)}}

/* Landing V1.1: 200px bubbles and 90% visible purple glass. */
.falling-ball,.falling-ball .ball-body{width:200px;height:200px}.home-glass{background:color-mix(in srgb,var(--brand-purple) 90%,transparent)}

/* Native form validity keeps demo entry usable with keyboard, autofill, or no JavaScript. */
.home-glass:has(#entry:invalid) .entry-button{opacity:.7;cursor:not-allowed}.home-glass:has(#entry:valid) .entry-button{opacity:1;cursor:pointer}

/* Keep caught colors solid while the rear plane visibly diffuses them. */
.caught-balls{z-index:0;filter:blur(14px)}.game-glass{z-index:1}.falling-balls{z-index:2}