:root{--a:#5b5bd6;--b:#f0a050;--bg:#f7f5ff;--ink:#1d1b2e;--card:#fff;--r:18px;--font:'Nunito',system-ui,sans-serif;--head:'Fraunces',Georgia,serif}
*{box-sizing:border-box}html,body{margin:0}body{font:17px/1.55 var(--font);color:var(--ink);background:var(--bg);-webkit-font-smoothing:antialiased;overflow-x:hidden}
button{font:inherit;cursor:pointer;touch-action:manipulation}a{color:var(--a)}
.lp-top{position:sticky;top:0;z-index:30;display:flex;align-items:center;gap:12px;padding:10px clamp(12px,3vw,28px);background:color-mix(in srgb,var(--bg) 82%,transparent);backdrop-filter:blur(12px);border-bottom:1px solid color-mix(in srgb,var(--ink) 8%,transparent)}
.lp-logo{width:40px;height:40px;flex:none}.lp-brand{font:700 1.05rem var(--head);line-height:1.1}.lp-brand small{display:block;font:600 .72rem var(--font);opacity:.65;letter-spacing:.06em;text-transform:uppercase}
.lp-sp{flex:1}.lp-btn{border:0;border-radius:999px;padding:8px 14px;background:color-mix(in srgb,var(--a) 12%,transparent);color:var(--ink);font-weight:700;display:inline-flex;gap:6px;align-items:center;min-height:40px}
.lp-btn:hover{background:color-mix(in srgb,var(--a) 22%,transparent)}.lp-btn.pri{background:var(--a);color:#fff}
.lp-lang{border:0;border-radius:999px;padding:8px 10px;background:color-mix(in srgb,var(--a) 12%,transparent);font-weight:700;min-height:40px}
.lp-badge{background:var(--b);color:#fff;border-radius:999px;padding:0 7px;font-size:.75rem}
.lp-hero{position:relative;min-height:clamp(260px,42vh,440px);overflow:hidden;display:flex;align-items:flex-end;isolation:isolate}
.lp-hero canvas,.lp-hero .lp-layer{position:absolute;inset:0;width:100%;height:100%}.lp-layer svg{position:absolute;bottom:0;left:-5%;width:110%;height:auto}
.lp-hero .lp-sky{background:linear-gradient(180deg,var(--sky1,#9fd3ff),var(--sky2,#fff3d6))}
.lp-hero-txt{position:relative;z-index:5;padding:28px clamp(16px,4vw,48px);color:#fff;text-shadow:0 2px 14px rgba(0,0,0,.35);max-width:900px}
.lp-hero h1{font:800 clamp(1.9rem,5vw,3.4rem)/1.05 var(--head);margin:0 0 6px}.lp-hero p{margin:0;font-size:clamp(1rem,2.2vw,1.25rem);font-weight:600}
.lp-chip{display:inline-flex;gap:8px;align-items:center;background:rgba(255,255,255,.22);backdrop-filter:blur(6px);border-radius:999px;padding:6px 12px;font-weight:700;margin-bottom:10px;font-size:.9rem}
.lp-wrap{max-width:1180px;margin:0 auto;padding:22px clamp(12px,3vw,28px) 60px}
.lp-grid{display:grid;gap:16px;grid-template-columns:repeat(auto-fill,minmax(min(100%,230px),1fr))}
.lp-tile{position:relative;border:0;text-align:left;background:var(--card);border-radius:var(--r);padding:18px;min-height:150px;display:flex;flex-direction:column;gap:8px;box-shadow:0 1px 2px rgba(0,0,0,.05),0 8px 24px -12px color-mix(in srgb,var(--a) 40%,transparent);transition:transform .25s,box-shadow .25s;overflow:hidden;color:var(--ink)}
.lp-tile:hover,.lp-tile:focus-visible{transform:translateY(-4px);box-shadow:0 18px 40px -16px color-mix(in srgb,var(--a) 60%,transparent)}
.lp-tile .ic{width:56px;height:56px;border-radius:16px;display:grid;place-items:center;background:linear-gradient(135deg,var(--a),var(--b));color:#fff}
.lp-tile .ic svg{width:30px;height:30px}.lp-tile b{font:700 1.15rem var(--head)}.lp-tile span{opacity:.72;font-size:.95rem}
.lp-tile .fav{position:absolute;top:10px;right:10px;background:none;border:0;font-size:1.2rem;opacity:.5}.lp-tile .fav.on{opacity:1;color:#e0465e}
.fx-glow .lp-tile::after{content:"";position:absolute;inset:0;background:radial-gradient(240px circle at var(--mx,50%) var(--my,50%),color-mix(in srgb,var(--b) 30%,transparent),transparent 60%);opacity:0;transition:opacity .3s;pointer-events:none}
.fx-glow .lp-tile:hover::after{opacity:1}
.lp-view{animation:none}.fx-trans .lp-view{animation:lpIn .45s cubic-bezier(.2,.8,.2,1)}
@keyframes lpIn{from{opacity:0;transform:translateY(14px) scale(.985)}to{opacity:1;transform:none}}
.lp-head{display:flex;align-items:center;gap:12px;margin:4px 0 18px}.lp-head h2{font:800 1.7rem var(--head);margin:0}
.lp-card{background:var(--card);border-radius:var(--r);padding:18px;box-shadow:0 8px 24px -14px rgba(0,0,0,.25)}
.lp-list{display:grid;gap:12px;grid-template-columns:repeat(auto-fill,minmax(min(100%,260px),1fr))}
.lp-item{background:var(--card);border-radius:14px;padding:14px;display:flex;gap:12px;align-items:center;border:2px solid transparent;text-align:left;color:var(--ink)}
.lp-item.on{border-color:var(--a)}.lp-item .ic{width:44px;height:44px;flex:none;border-radius:12px;background:linear-gradient(135deg,var(--a),var(--b));display:grid;place-items:center;color:#fff}
.lp-vid{aspect-ratio:16/9;width:100%;border:0;border-radius:var(--r);background:#000}
.lp-thumb{position:relative;border:0;padding:0;border-radius:14px;overflow:hidden;background:#000;aspect-ratio:16/9}.lp-thumb img{width:100%;height:100%;object-fit:cover;transition:transform .4s}.lp-thumb:hover img{transform:scale(1.06)}
.lp-thumb i{position:absolute;inset:auto 0 0 0;padding:8px 10px;color:#fff;font-style:normal;font-weight:700;font-size:.9rem;background:linear-gradient(transparent,rgba(0,0,0,.8));text-align:left}
.lp-games{display:grid;gap:10px;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));margin-bottom:16px}
.mem{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;max-width:440px}.mem button{aspect-ratio:1;border:0;border-radius:14px;font-size:2rem;background:linear-gradient(135deg,var(--a),var(--b));color:transparent;transition:transform .3s}
.mem button.up{background:var(--card);color:var(--ink);transform:rotateY(180deg) scaleX(-1);box-shadow:inset 0 0 0 3px var(--a)}
.ttt{display:grid;grid-template-columns:repeat(3,90px);gap:8px}.ttt button{height:90px;border:0;border-radius:14px;background:color-mix(in srgb,var(--a) 10%,var(--card));font:800 2.4rem var(--head);color:var(--a)}
.simon{display:grid;grid-template-columns:repeat(2,120px);gap:10px}.simon button{height:120px;border:0;border-radius:24px;opacity:.55;transition:opacity .15s,transform .15s}.simon button.lit{opacity:1;transform:scale(1.05)}
.lp-big{font:800 2rem var(--head)}.lp-in{font:inherit;padding:12px 14px;border-radius:12px;border:2px solid color-mix(in srgb,var(--a) 30%,transparent);min-height:48px;width:100%;max-width:340px}
.breathe{width:220px;height:220px;margin:20px auto;border-radius:50%;background:radial-gradient(circle,var(--b),var(--a));display:grid;place-items:center;color:#fff;font-weight:800;font-size:1.2rem;animation:br 10s ease-in-out infinite}
@keyframes br{0%,100%{transform:scale(.6)}50%{transform:scale(1)}}
.wx{display:flex;gap:18px;align-items:center;flex-wrap:wrap}.wx .t{font:800 3.2rem var(--head)}.wxd{display:grid;grid-template-columns:repeat(auto-fill,minmax(110px,1fr));gap:10px;margin-top:14px}.wxd div{background:color-mix(in srgb,var(--a) 8%,var(--card));border-radius:12px;padding:10px;text-align:center}
.lp-color{touch-action:none;background:#fff;border-radius:var(--r);width:100%;max-width:640px;aspect-ratio:4/3;box-shadow:inset 0 0 0 2px #0001}
.sw{width:40px;height:40px;border-radius:50%;border:3px solid #fff;box-shadow:0 0 0 1px #0003}
.lp-row{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.lp-foot{text-align:center;padding:26px;opacity:.7;font-size:.9rem}
.lp-drawer{position:fixed;inset:0 0 0 auto;width:min(420px,100%);background:var(--card);z-index:60;box-shadow:-20px 0 60px rgba(0,0,0,.25);padding:20px;overflow:auto;transform:translateX(105%);transition:transform .35s}
.lp-drawer.open{transform:none}.lp-drawer h3{font:800 1.4rem var(--head);margin:0 0 12px}
.lp-drawer label{display:block;font-weight:700;margin:12px 0 4px}
.lp-toast{position:fixed;left:50%;bottom:20px;transform:translateX(-50%);background:var(--ink);color:#fff;padding:10px 18px;border-radius:999px;z-index:80;font-weight:700}
.lp-tier{position:fixed;left:12px;bottom:12px;z-index:40;background:#111a;color:#fff;backdrop-filter:blur(8px);padding:6px 12px;border-radius:999px;font-size:.78rem;font-weight:700;text-decoration:none}
.lp-cursor{position:fixed;width:340px;height:340px;border-radius:50%;pointer-events:none;z-index:1;background:radial-gradient(circle,color-mix(in srgb,var(--b) 18%,transparent),transparent 65%);transform:translate(-50%,-50%);left:-400px}
.lp-wrap,.lp-top{position:relative;z-index:2}.lp-top{position:sticky}
@media (max-width:600px){.lp-brand small{display:none}.lp-btn .tx{display:none}.ttt{grid-template-columns:repeat(3,28vw)}.ttt button{height:28vw}}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto!important}.breathe{transform:scale(.85)}}
#lpM{scroll-margin-top:72px}.lp-btn{white-space:nowrap}
