:root{--ink:#17191f;--muted:#69707d;--paper:#fffaf0;--card:rgba(255,255,255,.78);--line:rgba(23,25,31,.12);--blue:#5a8cff;--cyan:#58d7d0;--yellow:#ffd166;--pink:#ff7a90;--shadow:0 24px 70px rgba(37,43,58,.14)}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;min-height:100vh;font-family:Inter,system-ui,sans-serif;color:var(--ink);background:radial-gradient(circle at 20% 10%,#d9f6ff 0 24%,transparent 25%),radial-gradient(circle at 90% 15%,#fff0ba 0 18%,transparent 19%),linear-gradient(135deg,#f8fbff,#fff7e8 50%,#eaf7ff);overflow-x:hidden}.bg-grid{position:fixed;inset:0;pointer-events:none;opacity:.28;background-image:linear-gradient(rgba(23,25,31,.08) 1px,transparent 1px),linear-gradient(90deg,rgba(23,25,31,.08) 1px,transparent 1px);background-size:32px 32px;mask-image:linear-gradient(#000,transparent 85%)}.float{position:fixed;z-index:0;font-size:40px;color:rgba(23,25,31,.16);animation:drift 7s ease-in-out infinite}.f1{left:7%;top:22%}.f2{right:10%;top:30%;animation-delay:-2s}.f3{left:13%;bottom:16%;animation-delay:-4s}.f4{right:18%;bottom:20%;animation-delay:-1s}@keyframes drift{50%{transform:translateY(-22px) rotate(12deg)}}#toast{position:fixed;left:50%;top:88px;transform:translateX(-50%) translateY(-20px);z-index:50;background:#17191f;color:white;border-radius:999px;padding:12px 18px;font-weight:900;box-shadow:0 16px 40px rgba(0,0,0,.18);opacity:0;pointer-events:none;transition:.25s}#toast.show{opacity:1;transform:translateX(-50%) translateY(0)}#emojiRain{position:fixed;inset:0;z-index:45;pointer-events:none;overflow:hidden}.drop{position:absolute;top:-40px;font-size:28px;animation:fall 1.8s linear forwards}@keyframes fall{to{transform:translateY(calc(100vh + 80px)) rotate(360deg);opacity:.1}}.nav{position:sticky;top:0;z-index:10;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:12px clamp(16px,5vw,64px);backdrop-filter:blur(18px);background:rgba(255,250,240,.65);border-bottom:1px solid var(--line)}.logo{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--ink);font-weight:900}.logo img{width:48px;height:48px;border-radius:16px;object-fit:cover;object-position:center;border:2px solid white;box-shadow:5px 5px 0 var(--yellow);background:white}.logo span{font-weight:900}.nav nav{display:flex;gap:10px;flex-wrap:wrap}.nav nav a{text-decoration:none;color:var(--ink);font-weight:800;padding:9px 12px;border-radius:999px}.nav nav a:hover{background:white}.hero,.section{position:relative;z-index:1;width:min(1160px,calc(100% - 32px));margin:0 auto}.hero{min-height:calc(100vh - 72px);display:grid;grid-template-columns:1.1fr .9fr;align-items:center;gap:22px;padding:38px 0}.card{background:var(--card);border:1px solid var(--line);border-radius:28px;box-shadow:var(--shadow);backdrop-filter:blur(18px)}.intro{padding:clamp(24px,5vw,48px)}.eyebrow{text-transform:uppercase;letter-spacing:.16em;font-size:12px;font-weight:900;color:#4a6fff;margin:0 0 12px}.intro h1{font-size:clamp(44px,8vw,92px);line-height:.92;margin:0 0 18px;letter-spacing:-.07em}.intro h1 span{display:inline-block;background:linear-gradient(90deg,var(--blue),#111827 50%,var(--pink));-webkit-background-clip:text;color:transparent}.lead{font-size:clamp(16px,2vw,20px);line-height:1.65;color:#3c4350;max-width:720px}.actions{display:flex;gap:12px;flex-wrap:wrap;margin:26px 0}.btn{border:1px solid var(--line);background:white;color:var(--ink);font-weight:900;border-radius:16px;padding:13px 18px;cursor:pointer;text-decoration:none;display:inline-flex;align-items:center;justify-content:center;box-shadow:0 8px 0 rgba(23,25,31,.08);transition:.16s}.btn:hover{transform:translateY(-2px);box-shadow:0 10px 0 rgba(23,25,31,.1)}.btn.primary{background:var(--ink);color:white;border-color:var(--ink)}.btn.small{padding:10px 13px;border-radius:12px;box-shadow:none}.chips,.quick-emotes{display:flex;flex-wrap:wrap;gap:8px}.chips b{padding:9px 11px;border-radius:999px;background:#fff;border:1px solid var(--line);font-size:13px}.quick-emotes button,.emote-grid button{border:1px solid var(--line);background:white;border-radius:14px;padding:10px 12px;font-weight:900;cursor:pointer}.profile{padding:24px;display:grid;place-items:center;gap:18px;min-height:520px}.avatar-wrap{position:relative;width:min(350px,80vw);aspect-ratio:1;border-radius:38px;overflow:hidden;background:linear-gradient(135deg,#fff,#dff5ff);border:2px solid white;box-shadow:14px 14px 0 rgba(23,25,31,.08)}.avatar-wrap img{width:100%;height:100%;object-fit:cover;object-position:center 18%;filter:saturate(1.05) contrast(1.04)}.avatar-wrap:before{content:"";position:absolute;inset:0;background:linear-gradient(transparent 65%,rgba(23,25,31,.2));pointer-events:none}.status{position:absolute;left:16px;bottom:16px;background:rgba(23,25,31,.84);color:white;padding:10px 12px;border-radius:999px;font-size:13px;font-weight:900}.speech{background:white;border:1px solid var(--line);padding:16px 18px;border-radius:20px;font-family:JetBrains Mono,monospace;font-weight:700;line-height:1.5}.section{padding:44px 0}.two-col{display:grid;grid-template-columns:1fr 1fr;gap:22px}.section .card{padding:28px}.section h2{font-size:clamp(28px,4vw,44px);letter-spacing:-.04em;margin:0 0 12px}.section p{line-height:1.75;color:#46505d}.list{padding-left:20px;line-height:2;color:#333b47}.section-head{display:flex;justify-content:space-between;align-items:center;gap:18px;margin-bottom:18px}.motion-layout{display:grid;grid-template-columns:1.25fr .75fr;gap:18px}.motion{padding:18px!important}.screen{height:370px;border-radius:22px;position:relative;overflow:hidden;background:linear-gradient(#98dcff 0 48%,#ffe0a6 49%,#f3bc68 70%,#35394a 71%);transition:.35s}.sun{position:absolute;width:82px;height:82px;border-radius:50%;right:48px;top:38px;background:#ffe778;box-shadow:0 0 45px #ffe778;animation:pulse 3s infinite}.moon{position:absolute;width:72px;height:72px;border-radius:50%;right:56px;top:42px;background:#f4f0dc;box-shadow:0 0 35px #f4f0dc;opacity:0}.cloud{position:absolute;width:100px;height:38px;border-radius:999px;background:white;filter:drop-shadow(0 8px 0 rgba(0,0,0,.04));animation:cloud 12s linear infinite}.cloud:before,.cloud:after{content:"";position:absolute;border-radius:50%;background:white}.cloud:before{width:42px;height:42px;left:18px;top:-18px}.cloud:after{width:54px;height:54px;right:18px;top:-26px}.c1{left:-110px;top:70px}.c2{left:-160px;top:130px;animation-delay:-5s;transform:scale(.75)}@keyframes cloud{to{translate:760px 0}}@keyframes pulse{50%{transform:scale(1.08)}}.city{position:absolute;left:0;right:0;bottom:72px;height:92px;background:linear-gradient(90deg,#25293a 0 8%,transparent 8% 10%,#25293a 10% 19%,transparent 19% 23%,#25293a 23% 33%,transparent 33% 35%,#25293a 35% 48%,transparent 48% 52%,#25293a 52% 67%,transparent 67% 70%,#25293a 70% 84%,transparent 84% 88%,#25293a 88%)}.runner{position:absolute;left:54px;bottom:68px;width:28px;height:42px;border-radius:18px 18px 10px 10px;background:#16191f;box-shadow:0 -18px 0 -2px #f2c7ad,9px -34px 0 -6px #111318;animation:run 1.6s ease-in-out infinite}.runner:before,.runner:after{content:"";position:absolute;width:10px;height:28px;border-radius:99px;background:#16191f;bottom:-20px;transform-origin:top}.runner:before{left:4px;animation:leg .45s infinite}.runner:after{right:4px;animation:leg .45s infinite reverse}@keyframes run{50%{translate:240px -8px}}@keyframes leg{50%{rotate:32deg}}.scanline{position:absolute;inset:0;background:repeating-linear-gradient(transparent 0 7px,rgba(255,255,255,.15) 8px);mix-blend-mode:soft-light}.rain,.spark-field,.heart-burst{position:absolute;inset:0;pointer-events:none}.rain{opacity:0;background:repeating-linear-gradient(105deg,transparent 0 15px,rgba(255,255,255,.55) 16px 18px);animation:rain .7s linear infinite}@keyframes rain{to{background-position:0 60px}}.spark-field:before{content:"✦ ✧ ✦ ✧ ✦ ✧";position:absolute;left:20px;top:30px;font-size:32px;letter-spacing:32px;color:#fff4a8;opacity:0;animation:spark 2s infinite}.heart-burst:before{content:"♥ ♥ ♥ ♥ ♥";position:absolute;left:70px;top:130px;font-size:34px;letter-spacing:24px;color:#ff5c8a;opacity:0;animation:spark 1.6s infinite}@keyframes spark{50%{opacity:1;transform:translateY(-16px)}}.scene-1{background:linear-gradient(#222945,#513c72 55%,#191d2b 56%)}.scene-1 .sun{opacity:0}.scene-1 .moon{opacity:1}.scene-1 .city{background:linear-gradient(90deg,#0d1020 0 8%,transparent 8% 10%,#0d1020 10% 19%,transparent 19% 23%,#0d1020 23% 33%,transparent 33% 35%,#0d1020 35% 48%,transparent 48% 52%,#0d1020 52% 67%,transparent 67% 70%,#0d1020 70% 84%,transparent 84% 88%,#0d1020 88%)}.scene-2{background:linear-gradient(#caf3ff 0 58%,#80c687 59%)}.scene-2 .city{background:#5b8f41;height:55px}.scene-2 .spark-field:before{opacity:1}.scene-3{background:linear-gradient(#0b1020,#202b5e 52%,#ff4d9a 53%,#111827 78%)}.scene-3 .sun,.scene-3 .cloud{opacity:0}.scene-3 .spark-field:before{opacity:1;color:#58d7d0}.scene-4{background:linear-gradient(#8ed8ff 0 52%,#5cb7e8 53%)}.scene-4 .city{background:#275c7a;height:45px}.scene-5{background:linear-gradient(#ece7d8 0 55%,#c7aa79 56%)}.scene-5 .runner{animation-duration:3s}.scene-6{background:linear-gradient(#101827,#27324a 55%,#0b0f19 56%)}.scene-6 .rain{opacity:.55}.scene-6 .sun{opacity:0}.scene-6 .moon{opacity:1}.scene-7{background:linear-gradient(#ffd7e0 0 55%,#fff4aa 56%)}.scene-7 .heart-burst:before{opacity:1}.scene-8{background:linear-gradient(#dff7ff 0 55%,#f8f8ff 56%)}.scene-8 .city{background:#d7e2ef}.scene-8 .runner{background:#5a8cff}.scene-9{background:linear-gradient(#ffba7a 0 50%,#733d47 51%,#1a1822 80%)}.scene-9 .sun{background:#ff784a;box-shadow:0 0 55px #ff784a}.caption{display:flex;justify-content:space-between;gap:10px;margin-top:12px}.caption span{color:var(--muted)}.scene-list{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;align-content:start}.scene-list button{border:1px solid var(--line);background:white;border-radius:16px;padding:12px;text-align:left;font-weight:900;cursor:pointer}.scene-list button.active{background:#17191f;color:white}.terminal-card{padding:0!important;overflow:hidden}.term-head{height:46px;background:#17191f;color:white;display:flex;align-items:center;gap:8px;padding:0 16px}.term-head span{width:12px;height:12px;border-radius:50%;background:#ff5f57}.term-head span:nth-child(2){background:#ffbd2e}.term-head span:nth-child(3){background:#28c840}.term-head b{margin-left:8px;font-family:JetBrains Mono,monospace;font-size:13px}.cmd-toolbar{display:flex;gap:8px;flex-wrap:wrap;padding:14px;background:#222838}.cmd-toolbar button{border:1px solid rgba(255,255,255,.12);background:#fff;color:#17191f;border-radius:12px;padding:9px 11px;font-weight:900;cursor:pointer}.terminal{min-height:270px;background:#0f1117;color:#c8facc;font-family:JetBrains Mono,monospace;padding:20px;line-height:1.8;white-space:pre-wrap}.game-card{display:grid;grid-template-columns:.85fr 1.15fr;gap:18px;align-items:stretch}.scorebar{display:flex;gap:10px;flex-wrap:wrap;margin:16px 0}.scorebar span{background:white;border:1px solid var(--line);border-radius:12px;padding:9px 11px;font-weight:800}#gameCanvas{width:100%;height:auto;border-radius:22px;background:linear-gradient(#dff7ff,#fff2c7);border:1px solid var(--line)}.music-card .player{display:flex;align-items:center;gap:14px;padding:14px;background:white;border:1px solid var(--line);border-radius:18px;margin:18px 0}.player button{width:52px;height:52px;border:0;border-radius:16px;background:var(--ink);color:white;font-weight:900;font-size:18px;cursor:pointer}.player small{display:block;color:var(--muted);margin-top:4px}.track-list{display:grid;gap:8px}.track-list button,.sticker-grid button{border:1px solid var(--line);background:white;border-radius:14px;padding:12px;text-align:left;font-weight:900;cursor:pointer;transition:.16s}.track-list button.active,.sticker-grid button:hover,.emote-grid button:hover,.quick-emotes button:hover{background:#17191f;color:white;transform:translateY(-2px)}.sticker-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}.sticker-grid button{text-align:center;min-height:64px;font-size:16px}.emote-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.emote-grid button{font-size:24px;min-height:58px}footer{text-align:center;color:#69707d;padding:40px 16px 60px}@media(max-width:900px){.nav{align-items:flex-start;flex-direction:column}.hero,.two-col,.game-card,.motion-layout{grid-template-columns:1fr}.hero{padding-top:24px}.profile{min-height:auto}.section{padding:26px 0}.nav nav a{padding:8px 9px}.caption,.section-head{display:block}.screen{height:280px}.scene-list{grid-template-columns:1fr}.emote-grid{grid-template-columns:repeat(3,1fr)}}

/* v4 restore patch: keep v2 layout, add smoother 5 games + distinct motion scenes */
.static-sticker-grid span,.mini-projects span{display:inline-flex;align-items:center;gap:6px;margin:5px;padding:10px 12px;border-radius:999px;background:#fff;border:1px solid var(--line);font-weight:900;font-size:13px}.mini-projects{display:flex;flex-wrap:wrap;gap:8px}.note-card{min-height:100%}.game-tabs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:16px 0}.game-tabs button{border:1px solid var(--line);background:#fff;border-radius:14px;padding:11px 12px;font-weight:900;text-align:left;cursor:pointer;box-shadow:0 6px 0 rgba(23,25,31,.06);transition:.16s}.game-tabs button:hover{transform:translateY(-2px)}.game-tabs button.active{background:#17191f;color:#fff;border-color:#17191f}.screen .chat,.screen .cmdbox,.screen .planet,.screen .mini-moon,.screen .ship,.screen .rainbox,.screen .hearts,.screen .loader,.screen .zonk-label,.screen .wave,.screen .boat,.screen .rocket,.screen .stars{position:absolute}.scene-run{background:linear-gradient(#98dcff 0 48%,#ffe0a6 49%,#f3bc68 70%,#35394a 71%)}.scene-run .runner{left:50px;bottom:70px;width:30px;height:45px;border-radius:18px;background:#16191f;box-shadow:0 -18px 0 -2px #f2c7ad;animation:run2 1.6s ease-in-out infinite}.scene-run .city{left:0;right:0;bottom:72px;height:88px;background:repeating-linear-gradient(90deg,#25293a 0 46px,transparent 46px 58px)}@keyframes run2{50%{translate:260px -10px}}.scene-chat{background:#f2fbff}.scene-chat .chat{inset:35px;display:grid;gap:14px;align-content:center}.bubble-msg{max-width:72%;padding:14px 16px;border-radius:18px;background:white;box-shadow:0 8px 0 rgba(23,25,31,.08);font-weight:900;animation:pop2 1.8s infinite}.bubble-msg:nth-child(even){justify-self:end;background:#17191f;color:white;animation-delay:.4s}@keyframes pop2{50%{transform:scale(1.04)}}.scene-cmd{background:#0f1117}.scene-cmd .cmdbox{inset:28px;color:#c8facc;font-family:JetBrains Mono,monospace;line-height:1.8}.scene-orbit{background:radial-gradient(circle,#273e70,#080b16)}.scene-orbit .planet{width:120px;height:120px;border-radius:50%;background:#ffd166;left:50%;top:50%;translate:-50% -50%;box-shadow:0 0 60px #ffd166}.scene-orbit .mini-moon{width:34px;height:34px;border-radius:50%;background:#fff;left:50%;top:50%;animation:orbit2 3s linear infinite}@keyframes orbit2{from{transform:rotate(0) translateX(135px)}to{transform:rotate(360deg) translateX(135px)}}.scene-shooter{background:#111827}.scene-shooter .ship{left:60px;top:165px;width:0;height:0;border-top:22px solid transparent;border-bottom:22px solid transparent;border-left:52px solid #5a8cff;animation:ship2 1.4s infinite}.scene-shooter .stars,.scene-rocket .stars{inset:0;background:radial-gradient(#fff 2px,transparent 3px) 0 0/55px 55px;animation:starMove2 2s linear infinite}@keyframes starMove2{to{background-position:-110px 0}}@keyframes ship2{50%{translate:0 -30px}}.scene-rain{background:linear-gradient(#101827,#27324a)}.scene-rain .rainbox{inset:0;background:repeating-linear-gradient(105deg,transparent 0 15px,rgba(255,255,255,.6) 16px 18px);animation:rain2 .7s linear infinite}.scene-rain .cloud.big{width:180px;height:55px;border-radius:999px;background:#dce7f4;left:90px;top:60px}@keyframes rain2{to{background-position:0 60px}}.scene-heart{background:linear-gradient(#ffd7e0,#fff4aa)}.scene-heart .hearts{left:45px;right:45px;top:90px;font-size:42px;letter-spacing:22px;color:#ff5c8a;animation:heart2 1.3s infinite}.scene-heart .hearts:before{content:'♥ ♥ ♥ ♥ ♥ ♥'}@keyframes heart2{50%{transform:translateY(-20px) scale(1.08)}}.scene-load{background:#f8fafc}.scene-load .loader{left:50%;top:48%;translate:-50% -50%;width:230px;height:28px;border-radius:999px;border:3px solid #17191f;overflow:hidden}.scene-load .loader:before{content:'';display:block;height:100%;width:45%;background:#5a8cff;animation:load2 1.4s infinite}.scene-load .zonk-label{left:50%;top:58%;translate:-50% 0;font-weight:900}@keyframes load2{50%{width:100%}}.scene-wave{background:linear-gradient(#bfefff 0 50%,#58bde8 51%)}.scene-wave .wave{left:-20%;right:-20%;bottom:70px;height:110px;background:radial-gradient(circle at 50% 0,#fff 0 22%,#58bde8 23%);background-size:90px 90px;animation:wave2 2s linear infinite}.scene-wave .boat{left:52%;top:45%;font-size:46px;animation:boat2 1.8s ease-in-out infinite}@keyframes wave2{to{transform:translateX(90px)}}@keyframes boat2{50%{transform:translateY(-16px) rotate(5deg)}}.scene-rocket{background:linear-gradient(#101827,#4b5da8)}.scene-rocket .rocket{left:50%;bottom:45px;font-size:70px;animation:rocket2 1.7s infinite}.scene-rocket .rocket:before{content:'🚀'}@keyframes rocket2{50%{transform:translateY(-170px) rotate(-8deg)}}@media(max-width:720px){.game-tabs{grid-template-columns:1fr}}

.scene-list button b{display:block;margin-bottom:4px}.scene-list button small{display:block;color:inherit;opacity:.78;line-height:1.35}.scene-list button{line-height:1.25}

/* v5 game polish */
.game-card{align-items:center}.game-info{align-self:center}#gameCanvas{display:block;width:100%;max-width:720px;aspect-ratio:2/1;height:auto;margin:auto;border-radius:24px;background:linear-gradient(180deg,#e9fbff,#fff3c9);box-shadow:inset 0 0 0 1px rgba(23,25,31,.1),0 18px 50px rgba(37,43,58,.12);image-rendering:auto}.game-tabs{grid-template-columns:1fr;max-width:360px}.game-tabs button{padding:10px 12px;font-size:13px}.scorebar span{font-size:13px}.game-card .btn.primary{min-width:150px}
@media(min-width:980px){.game-card{grid-template-columns:.78fr 1.22fr}}
