/* Landing v2 — compact, interactive, responsive */
body:has(#lobby:not(.hidden)){min-height:100vh;padding:0 18px 24px!important;background:radial-gradient(900px 560px at 12% 0,#ff4d8d18,transparent 70%),radial-gradient(900px 600px at 92% 16%,#8b5cf61c,transparent 72%),#08080b!important;overflow-x:hidden}
body:has(#lobby:not(.hidden)) .wrap{width:100%!important;max-width:1500px!important;margin:0 auto!important}
.siteHeader{height:64px!important;display:flex!important;align-items:center!important;justify-content:space-between!important;padding:0 6px!important;margin:0!important;border-bottom:1px solid #ffffff0c!important}
.landingBrand{display:flex;align-items:baseline;gap:3px}.landingBrand span,.landingBrand b{font-size:18px;font-weight:950;letter-spacing:-1px}.landingBrand span{color:#fff}.landingBrand b{color:#c4b5fd}.landingBrand i{font-style:normal;color:#fb4f79;font-size:8px;margin-left:2px}
.landingMini{font-size:9px;font-weight:800;letter-spacing:1.5px;color:#777783}
#lobby.landing{margin:26px 0 0!important;padding:0!important;background:transparent!important;border:0!important;border-radius:0!important;box-shadow:none!important;overflow:visible!important}
.landingGrid{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(320px,.85fr) minmax(340px,.72fr);gap:20px;align-items:center;min-height:calc(100vh - 128px)}
.landingHero{padding:34px 12px 34px 6px;align-self:center}.landingEyebrow{display:inline-flex;align-items:center;gap:8px;font-size:9px;font-weight:850;letter-spacing:1.7px;color:#9898a3}.landingEyebrow i{width:7px;height:7px;border-radius:50%;background:#a78bfa;box-shadow:0 0 18px #a78bfa88}
.landingHero h1{font-size:clamp(48px,5.6vw,82px)!important;line-height:.9!important;letter-spacing:-4.5px!important;margin:18px 0 16px!important;color:#f8f8fb!important;max-width:700px!important}.landingHero h1 em{font-style:normal;color:#f472b6;text-shadow:0 0 42px #ec489933}
.landingHero p{font-size:16px;line-height:1.5;color:#8f8f9a;max-width:500px;margin:0 0 24px}.landingChips{display:flex;gap:8px;flex-wrap:wrap}.landingChips span{padding:8px 10px;border:1px solid #ffffff10;background:#ffffff07;border-radius:999px;font-size:8px;font-weight:900;letter-spacing:1.3px;color:#b4b4bd}
.landingArt{position:relative;height:520px;align-self:center;perspective:1000px}.landingCard{position:absolute;width:235px;border:3px solid #fff3e2;border-radius:28px;overflow:hidden;background:#17141c;box-shadow:14px 18px 0 #241c2d,0 30px 60px #0005;transition:transform .25s cubic-bezier(.2,.8,.2,1),z-index 0s}.landingCard img{display:block;width:100%;aspect-ratio:1/1;object-fit:cover}.landingCard b{display:block;padding:14px 16px 16px;color:#fff;font-size:17px;letter-spacing:-.6px}.landingCard.lc1{left:4%;top:72px;transform:rotate(-9deg)}.landingCard.lc2{right:1%;top:4px;transform:rotate(8deg)}.landingCard.lc3{left:30%;bottom:0;transform:rotate(2deg)}
.landingCard:hover{z-index:5!important;transform:translateY(-10px) rotate(0deg) scale(1.035)!important}.landingSpark{position:absolute;font-weight:900;pointer-events:none}.landingSpark.s1{left:8%;top:4%;font-size:42px;color:#f472b655;transform:rotate(16deg)}.landingSpark.s2{right:8%;bottom:12%;font-size:72px;color:#8b5cf62a}
.landingActions{align-self:center;padding:24px;border:1px solid #ffffff12;background:linear-gradient(160deg,#17171e,#101014);border-radius:28px;box-shadow:0 28px 80px #0007}.landingActions>small{font-size:8px;font-weight:900;letter-spacing:1.7px;color:#f472b6}.landingActions h2{font-size:28px;letter-spacing:-1.2px;margin:7px 0 18px;color:#fff}.landingActions input,.landingActions select{width:100%;min-height:54px!important;border:1px solid #ffffff10!important;background:#1d1d24!important;color:#fff!important;border-radius:16px!important;outline:none!important;padding:0 14px!important;font-size:14px!important}.landingActions input:focus,.landingActions select:focus{border-color:#a78bfa66!important;box-shadow:0 0 0 3px #8b5cf612!important}
.createRow{display:grid;grid-template-columns:94px 1fr;gap:9px;margin-top:10px}.createRow label{display:grid;gap:5px}.createRow label span{font-size:7px;letter-spacing:1.3px;color:#777783;padding-left:4px}.createRow select{min-height:52px!important}.createRow button,.joinRow button{min-height:52px!important;border-radius:16px!important;background:linear-gradient(105deg,#f472b6,#a78bfa)!important;color:#0b0910!important;font-weight:950!important;padding:0 15px!important;box-shadow:none!important;transition:transform .16s cubic-bezier(.2,.8,.2,1)}.createRow button:active,.joinRow button:active{transform:scale(.975)}
.landingDivider{display:flex;align-items:center;gap:9px;margin:18px 0 11px}.landingDivider:before,.landingDivider:after{content:"";height:1px;flex:1;background:#ffffff0d}.landingDivider span{font-size:7px;letter-spacing:1.2px;color:#696974;font-weight:850}.joinRow{display:grid;grid-template-columns:1fr auto;gap:8px}.joinRow #code{text-transform:uppercase;letter-spacing:3px;font-weight:850}.joinRow button{min-width:92px}.landingHint{margin-top:12px;color:#676772;font-size:10px;line-height:1.4}
:root[data-theme="light"] body:has(#lobby:not(.hidden)){background:radial-gradient(900px 560px at 12% 0,#ff4d8d16,transparent 70%),radial-gradient(900px 600px at 92% 16%,#8b5cf618,transparent 72%),#f7f5fa!important}.landingBrand span{transition:color .2s}.landingBrand b{transition:color .2s}:root[data-theme="light"] .landingBrand span{color:#19161f}:root[data-theme="light"] .siteHeader{border-color:#0000000b!important}:root[data-theme="light"] .landingHero h1{color:#18131c!important}:root[data-theme="light"] .landingHero p{color:#6f6874}:root[data-theme="light"] .landingChips span{background:#fff;border-color:#0000000c;color:#655d6d}:root[data-theme="light"] .landingActions{background:#fff;border-color:#0000000c;box-shadow:0 24px 60px #4c3d5f14}:root[data-theme="light"] .landingActions h2{color:#18131c}:root[data-theme="light"] .landingActions input,:root[data-theme="light"] .landingActions select{background:#f2eff5!important;color:#18131c!important;border-color:#0000000c!important}
@media(max-width:1180px){.landingGrid{grid-template-columns:minmax(0,1fr) minmax(330px,.72fr);gap:22px}.landingArt{display:none}.landingHero h1{font-size:clamp(48px,7vw,70px)!important}.landingActions{max-width:430px;justify-self:end;width:100%}}
@media(max-width:760px){body:has(#lobby:not(.hidden)){padding:0 10px 18px!important}.siteHeader{height:54px!important;padding:0 2px!important}.landingMini{display:none}.landingBrand span,.landingBrand b{font-size:16px}.landingGrid{grid-template-columns:1fr;gap:14px;min-height:auto;padding:18px 0 0}.landingHero{padding:12px 4px 4px}.landingHero h1{font-size:clamp(42px,12vw,58px)!important;letter-spacing:-3.3px!important;margin:12px 0!important}.landingHero p{font-size:14px;margin-bottom:15px}.landingChips{gap:5px}.landingChips span{padding:6px 8px;font-size:7px}.landingActions{justify-self:stretch;max-width:none;padding:18px;border-radius:22px}.landingActions h2{font-size:24px;margin-bottom:14px}.createRow{grid-template-columns:84px 1fr}.landingHint{font-size:9px}}
@media(max-width:390px){.landingHero h1{font-size:40px!important}.landingActions{padding:15px}.createRow{grid-template-columns:78px 1fr}.createRow button,.joinRow button{font-size:12px!important;padding:0 10px!important}.joinRow button{min-width:78px}.landingActions input,.landingActions select{min-height:50px!important}}
@media(min-width:900px){body:has(#lobby:not(.hidden)) .wrap{width:80vw!important;max-width:1500px!important;margin:0 auto!important}}
@media(max-width:899px){body:has(#lobby:not(.hidden)) .wrap{width:100%!important;max-width:none!important;margin:0!important}}