@import url('https://fonts.googleapis.com/css2?family=DM+Mono&family=Noto+Sans+SC:wght@400;500;700;900&family=Space+Grotesk:wght@400;500;700&display=swap');

:root{--ink:#f5f4ec;--muted:#a9b0c4;--night:#07101f;--night2:#111b35;--yellow:#ffd84b;--green:#93d19a;--pink:#fb859d;--accent:#c2ff69}*{box-sizing:border-box}body{margin:0;color:var(--ink);background:radial-gradient(circle at 70% 12%,#273d6c 0,transparent 25rem),radial-gradient(circle at 10% 75%,#1e4b4e 0,transparent 28rem),var(--night);font-family:'Noto Sans SC',sans-serif;min-height:100vh;overflow-x:hidden}.page-shell{max-width:1280px;margin:auto;padding:25px 48px 30px}.topbar{height:52px;display:flex;align-items:center;gap:24px}.brand{color:#fff;text-decoration:none;font:700 26px 'Space Grotesk',sans-serif;letter-spacing:-1px}.brand-mark{display:inline-grid;place-items:center;border:2px solid var(--yellow);color:var(--yellow);font-size:13px;border-radius:7px;width:37px;height:29px;margin-right:3px;letter-spacing:-1px}.tagline{font-size:13px;color:var(--muted);border-left:1px solid #54607a;padding-left:22px}.nav-link{margin-left:auto;color:var(--ink);text-decoration:none;font-size:14px}.nav-link span{color:var(--yellow);font-size:18px}.hero{min-height:calc(100vh - 138px);display:grid;grid-template-columns:1.02fr .98fr;align-items:center;gap:38px}.eyebrow{font:500 12px 'DM Mono',monospace;letter-spacing:1.8px;color:var(--yellow);margin:0 0 22px}.hero h1{font-weight:900;line-height:1.13;font-size:clamp(43px,5vw,72px);letter-spacing:-4px;margin:0}.hero h1 em{font-style:normal;color:var(--yellow)}.intro{max-width:445px;line-height:1.8;font-size:16px;color:var(--muted);margin:25px 0 28px}.creator{max-width:480px;padding:17px 18px;border:1px solid #30405c;border-radius:16px;background:#0c172a99;box-shadow:0 20px 50px #0002}.creator label{display:block;font-size:12px;font-weight:700;margin-bottom:9px}.input-row{display:flex;background:#f9f7ed;border-radius:10px;padding:4px}.input-row input{border:0;background:transparent;outline:0;min-width:0;flex:1;padding:9px 11px;font:14px 'DM Mono',monospace;color:#263148}.input-row button{border:0;border-radius:7px;background:var(--yellow);font:700 13px 'Noto Sans SC',sans-serif;padding:8px 16px;color:#172037;cursor:pointer}.input-help{font-size:11px;color:#8390a8;margin:10px 1px 0}.chips{display:flex;gap:8px;margin-top:16px;flex-wrap:wrap}.chip{background:transparent;border:1px solid #3a475f;border-radius:99px;color:#aeb8c9;padding:7px 11px;font:12px 'Noto Sans SC';cursor:pointer}.chip i{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--yellow);margin-right:6px}.chip:nth-child(2) i{background:#bba5fc}.chip:nth-child(3) i{background:#fb859d}.chip.active{border-color:#d9e1ee;color:white;background:#1f2b43}.stage-wrap{position:relative;display:grid;place-items:center;padding:45px 0 20px;min-height:570px}.art-card{position:relative;z-index:2;width:min(100%,470px);aspect-ratio:.78;border:1px solid #ffffffa8;border-radius:30px;background:#f4f0e5;color:#172037;padding:20px;box-shadow:17px 27px 0 #0207114b,0 35px 70px #0008;transform:perspective(1000px) rotateX(4deg) rotateY(-7deg);transition:transform .18s ease;transform-style:preserve-3d;user-select:none}.card-head,.card-foot{display:flex;justify-content:space-between;align-items:center;font:700 13px 'Space Grotesk';letter-spacing:.8px}.card-head{height:26px}.status-dot{font:10px 'DM Mono';color:#64715f}.status-dot::first-letter{color:#54ba68}.scene{height:calc(100% - 75px);margin-top:10px;position:relative;border-radius:22px;background:radial-gradient(ellipse at 50% 10%,#d8f6fa,#c9e4e5 45%,#a5cfbe);overflow:hidden;cursor:pointer;outline:none}.scene:focus-visible{box-shadow:inset 0 0 0 3px #10244d}.scene::before{content:"";position:absolute;inset:0;background-image:radial-gradient(#fff9 1px,transparent 1px);background-size:22px 22px;opacity:.38}.qr-halo{position:absolute;width:220px;height:220px;border-radius:50%;background:#ffed91a6;left:50%;top:50%;transform:translate(-50%,-45%);filter:blur(10px)}.island{position:absolute;width:250px;height:205px;left:50%;top:53%;transform:translate(-50%,-50%) rotateX(55deg) rotateZ(45deg);background:linear-gradient(135deg,#73b774,#c1e197);border:11px solid #52905c;box-shadow:18px 19px 0 #356e5b;border-radius:18px}.island::after{content:"";position:absolute;inset:18px;background:repeating-linear-gradient(90deg,#cbe8ba 0 11px,#96ce98 11px 22px);opacity:.5}.grass{position:absolute;z-index:3;width:31px;height:45px;border-left:6px solid #2f8a57;border-radius:100%;transform:rotate(-29deg)}.grass-one{left:-19px;bottom:-6px}.grass-two{right:-12px;top:18px}.grass-three{left:75px;top:-23px}.rock{position:absolute;z-index:3;background:#819e8c;clip-path:polygon(50% 0,100% 43%,75% 100%,18% 84%,0 39%)}.rock-one{width:30px;height:24px;right:27px;bottom:10px}.rock-two{width:21px;height:18px;left:22px;top:25px}.creature{position:absolute;z-index:5;left:50%;top:50%;width:120px;height:150px;transform:translate(-50%,-57%) rotateZ(-45deg) rotateX(-55deg);filter:drop-shadow(10px 12px 4px #346b5566)}.body{position:absolute;width:92px;height:96px;left:18px;top:38px;background:linear-gradient(110deg,#ffe76d,#f5ad31);border-radius:48% 52% 43% 45%;border:4px solid #a66527}.face{position:absolute;width:83px;height:73px;left:22px;top:2px;background:#ffe56a;border:4px solid #a66527;border-radius:52% 48% 50% 47%;z-index:2}.ear{position:absolute;width:27px;height:75px;background:#ffd743;border:4px solid #a66527;border-radius:70% 70% 22% 20%;top:-31px;z-index:0}.ear::after{content:"";position:absolute;background:#30344a;height:23px;left:0;right:0;top:-1px;border-radius:100%}.ear-left{left:22px;transform:rotate(-24deg)}.ear-right{right:12px;transform:rotate(25deg)}.eye{position:absolute;background:#202638;width:11px;height:18px;border-radius:50%;top:25px}.eye.left{left:20px}.eye.right{right:20px}.nose{position:absolute;background:#603d31;width:7px;height:5px;left:36px;top:45px;border-radius:50%}.cheek{position:absolute;width:15px;height:15px;background:#f36a52;top:43px;border-radius:50%}.cheek-left{left:4px}.cheek-right{right:4px}.tail{position:absolute;z-index:3;right:-47px;top:82px;width:70px;height:36px;background:#f7c842;border:4px solid #a66527;clip-path:polygon(0 35%,41% 35%,41% 0,100% 50%,52% 100%,52% 64%,0 65%);transform:rotate(-8deg)}.flower{position:absolute;z-index:4;color:#fb6d96;font-size:24px}.flower-one{bottom:-8px;left:40px}.flower-two{top:8px;right:42px;color:#fff}.qr-reveal{opacity:0;transform:translate(-50%,-50%) scale(.78);pointer-events:none;position:absolute;z-index:8;left:50%;top:50%;display:grid;justify-items:center;gap:9px;color:#172037;font-weight:700;font-size:12px;transition:.28s}.scene.show-qr .qr-reveal{opacity:1;transform:translate(-50%,-50%) scale(1)}.scene.show-qr .island,.scene.show-qr .qr-halo{filter:blur(5px);opacity:.32}.qr-frame{background:#fff;padding:10px;border-radius:14px;box-shadow:0 10px 30px #28485455}.qr-frame img{display:block;width:142px;height:142px}.scene-hint{position:absolute;bottom:8px;left:0;right:0;text-align:center;color:#365156;font:11px 'DM Mono';margin:0}.card-foot{height:29px;margin-top:10px}.card-foot span{max-width:320px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#506477}.card-foot button{border:0;border-radius:9px;background:#e2d778;color:#27313c;width:29px;height:29px;cursor:pointer;font-size:18px}.orb{position:absolute;border-radius:50%;filter:blur(1px);opacity:.7}.orb-a{background:#e772a2;width:100px;height:100px;top:4%;right:2%;box-shadow:0 0 70px 25px #d763ad99}.orb-b{background:#73e6d0;width:45px;height:45px;bottom:16%;left:4%;box-shadow:0 0 55px 16px #4dd7d3}.spark{position:absolute;color:#ffed8c;font-size:23px;z-index:3;animation:float 3s ease-in-out infinite}.spark-a{top:13%;left:9%}.spark-b{right:0;bottom:17%;animation-delay:-1.2s}.drag-hint{font-size:11px;color:#9ca8bd;position:absolute;bottom:-4px}.how-it-works{display:flex;align-items:center;justify-content:center;gap:13px;color:#8590a6;font:11px 'DM Mono';letter-spacing:.2px}.how-it-works p{margin:0}.how-it-works span{height:1px;width:62px;background:#47526a}@keyframes float{50%{transform:translateY(-10px) rotate(18deg)}}body[data-theme="moon"]{--yellow:#c8b8ff;--green:#7ca4e5;background:radial-gradient(circle at 70% 12%,#403a74 0,transparent 25rem),radial-gradient(circle at 10% 75%,#1d365c 0,transparent 28rem),#081025}body[data-theme="moon"] .scene{background:radial-gradient(ellipse at 50% 10%,#e8e4fa,#b8c5e9 45%,#839dc9)}body[data-theme="sunset"]{--yellow:#ffb06f;--green:#f0ad6f;background:radial-gradient(circle at 70% 12%,#693151 0,transparent 25rem),radial-gradient(circle at 10% 75%,#663e3e 0,transparent 28rem),#1d1022}body[data-theme="sunset"] .scene{background:radial-gradient(ellipse at 50% 10%,#ffd5a9,#f6ac95 45%,#cc8276)}.toast{position:fixed;bottom:24px;left:50%;transform:translate(-50%,20px);opacity:0;background:#f8f2de;color:#172037;border-radius:99px;padding:10px 16px;font-size:13px;transition:.25s;pointer-events:none}.toast.show{opacity:1;transform:translate(-50%,0)}@media(max-width:800px){.page-shell{padding:19px 20px 28px}.tagline{display:none}.hero{grid-template-columns:1fr;gap:6px;padding-top:43px}.hero-copy{text-align:center}.eyebrow{margin-bottom:14px}.hero h1{font-size:45px;letter-spacing:-2.5px}.intro{font-size:14px;margin:17px auto 21px}.creator{text-align:left;margin:auto}.chips{justify-content:center}.stage-wrap{min-height:520px;padding-top:23px}.art-card{max-width:390px;border-radius:24px}.how-it-works{gap:7px;font-size:9px;flex-wrap:wrap}.how-it-works span{width:20px}.nav-link{font-size:12px}}