:root{color-scheme:dark;--canvas:#0b1020;--surface:#121a2c;--soft:#172137;--text:#edf1fc;--muted:#8f9ebc;--line:#27334b;--accent:#a799ff;--snow:#e4efff}
[data-theme=light]{color-scheme:light;--canvas:#f4f6fb;--surface:#fff;--soft:#f2f4fa;--text:#17213a;--muted:#63738e;--line:#dce3ef;--accent:#6642cc;--snow:#c9dbef}
*{box-sizing:border-box}body{margin:0;background:var(--canvas);color:var(--text);font:14px/1.5 Inter,system-ui,-apple-system,'Segoe UI',sans-serif}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;cursor:pointer}button:focus-visible,a:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.topbar{position:sticky;top:0;height:88px;background:var(--surface);border-bottom:1px solid var(--line);overflow:hidden;isolation:isolate}.header-row{position:relative;height:54px;display:flex;align-items:center;justify-content:space-between;padding:0 30px;z-index:2}.breadcrumb{font-size:12px;display:flex;gap:10px}.breadcrumb span{color:var(--muted)}.brand{position:absolute;left:50%;transform:translateX(-50%);display:block;width:170px;height:46px}.brand svg{width:100%;height:100%;display:block;overflow:hidden}.actions{display:flex;align-items:center;gap:8px;margin-left:auto}.icon{width:38px;height:38px;border:1px solid var(--line);border-radius:13px;background:transparent;display:grid;place-items:center;color:var(--muted)}.icon svg,.balance svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}.icon:hover{background:var(--soft);color:var(--text)}.balance{height:36px;display:flex;align-items:center;gap:7px;padding:0 11px;border:1px solid var(--line);border-radius:12px;color:#f5c562;font-size:12px}.menu{display:none}.symbols{position:absolute;width:0;height:0;overflow:hidden}
.winter-track{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:1;contain:layout paint}.ground{position:absolute;bottom:0;left:0;width:100%;height:3px;background:var(--snow);border-radius:50% 30% 0 0;box-shadow:0 -1px 5px #c1ddff33}.obstacle{position:absolute;bottom:2px;width:19px;height:7px;border-radius:70% 90% 0 0;background:var(--snow);box-shadow:-5px 2px 0 -1px var(--snow)}.runner{position:absolute;bottom:0;left:0;width:51.6px;height:40px;will-change:transform}.character{width:100%;height:100%;object-fit:contain;display:block;user-select:none}.gift{position:absolute;bottom:0;left:0;width:12px;height:11px;border-radius:2px;background:linear-gradient(110deg,#fa6265,#be1c40);box-shadow:0 1px 2px #0004;will-change:transform}.gift:before{content:'';position:absolute;left:5px;top:-1px;width:2px;height:12px;background:#ffe48b}.gift:after{content:'';position:absolute;left:-1px;top:1px;width:14px;height:2px;background:#ffd66a}.gift i,.gift b{position:absolute;top:-5px;width:6px;height:5px;border:2px solid #ffdf78;border-radius:70% 70% 10% 70%}.gift i{left:1px;transform:rotate(15deg)}.gift b{left:5px;transform:rotate(70deg)}.impact{position:absolute;bottom:3px;width:26px;height:11px;border-radius:50%;background:radial-gradient(ellipse,#e3efffbb,transparent 70%);opacity:0}.flake{position:absolute;top:-7px;left:var(--x);width:var(--s);height:var(--s);background:var(--snow);border-radius:50%;opacity:.6;animation:snowfall var(--d) linear infinite;animation-delay:var(--delay)}@keyframes snowfall{to{transform:translate(16px,100px);opacity:.12}}.paused .flake{animation-play-state:paused}
main{max-width:820px;margin:70px auto;padding:0 24px}.eyebrow{font-size:10px;font-weight:750;letter-spacing:2px;color:var(--accent)}h1{font-size:clamp(24px,4vw,34px);letter-spacing:-.8px;margin:10px 0 12px}main>p{max-width:620px;color:var(--muted);line-height:1.7}.demo-controls{display:flex;flex-wrap:wrap;gap:8px;margin:25px 0 14px}.demo-controls button{border:1px solid var(--line);background:var(--surface);padding:9px 16px;border-radius:11px;font-size:12px;font-weight:600}.demo-controls button:first-child{background:var(--accent);border-color:var(--accent);color:var(--canvas)}.phase{display:flex;align-items:center;gap:8px;color:var(--muted);font-size:12px;min-height:26px}.dot{width:6px;height:6px;border-radius:50%;background:#52ddb0}.preview-card{display:flex;align-items:center;gap:16px;margin-top:34px;padding:20px;border:1px solid var(--line);border-radius:18px;background:var(--surface)}.preview-card h2{font-size:14px;margin:0 0 4px}.preview-card p{font-size:12px;color:var(--muted);margin:0}.small-icon{width:42px;height:42px;flex-shrink:0;border-radius:12px;background:var(--soft);color:var(--accent);display:grid;place-items:center;font-size:24px}.hint{font-size:12px}
@media(max-width:1023px){.menu{display:grid}.breadcrumb{display:none}.header-row{padding:0 14px}.search{display:none}}
@media(max-width:639px){.topbar{height:78px}.header-row{height:48px;padding:0 10px}.brand{width:clamp(124px,calc(100vw - 200px),170px);height:42px}.actions{gap:4px}.icon{width:32px;height:34px;border-radius:11px}.theme{display:none}.balance{height:34px;min-width:34px;flex-direction:column;gap:0;padding:2px 4px;font-size:10px;line-height:1.1}.balance svg{width:12px;height:12px}.runner{width:45.2px;height:35px}main{margin-top:38px;padding:0 18px}.preview-card{padding:16px}}