*{-webkit-tap-highlight-color:transparent}html,body,#app{height:100%}:root{--bg:#070707;--metal:#d5d4cf;--edge:#777873;--hot:#ff7a1a}*{box-sizing:border-box}body{margin:0;min-height:100dvh;overflow:hidden;background:var(--bg);color:#eee;font-family:Arial,PingFang SC,sans-serif;touch-action:none}.scene{height:100dvh;display:grid;place-items:center;position:relative;background:radial-gradient(circle at 50% 60%,#23211e 0,#0c0c0c 45%,#050505 78%)}.topbar{position:absolute;top:max(22px,env(safe-area-inset-top));left:24px;right:24px;display:flex;justify-content:space-between;align-items:center;z-index:30}.tools{display:flex;gap:10px}.brand{font-size:13px;letter-spacing:.24em;font-weight:700;display:flex;align-items:center;gap:10px}.icon-btn{min-width:46px;height:46px;padding:0 14px;border:1px solid #393939;background:#111;color:#eee;border-radius:23px;display:grid;place-items:center;cursor:pointer;font-size:15px}.hint{position:absolute;bottom:max(28px,env(safe-area-inset-bottom));text-align:center;color:#8b8b8b;font-size:12px;letter-spacing:.08em;z-index:20}.hint b{display:block;color:#eee;font-size:14px;margin-bottom:7px;font-weight:500}.lighter-stage{position:relative;width:350px;height:650px;transform:scale(min(1,calc(100dvh / 790)));transform-origin:center}.lighter{position:absolute;width:270px;height:360px;left:40px;top:248px;border-radius:10px 10px 22px 22px;background:linear-gradient(110deg,#777 0,#ecebe5 14%,#aaa 32%,#f0efea 52%,#8c8d89 78%,#d8d7d2);border:2px solid #5d5e5b;box-shadow:inset 0 0 0 4px #b4b3ae,inset 12px 0 18px #0004,inset -8px 0 16px #fff5,0 40px 70px #000}.lighter:after{content:"EMBER";position:absolute;left:0;right:0;bottom:52px;text-align:center;color:#50514f;font:700 18px Georgia;letter-spacing:.22em;text-shadow:0 1px #fff}.body-line{position:absolute;left:6px;right:6px;top:145px;height:1px;background:#676864;box-shadow:0 1px #eee}.lid{position:absolute;width:270px;height:155px;left:40px;top:94px;border-radius:18px 18px 7px 7px;background:linear-gradient(105deg,#777,#f1f0ea 17%,#aaa 36%,#eee 58%,#81827f 84%,#d9d8d3);border:2px solid #5d5e5b;box-shadow:inset 0 0 0 4px #b4b3ae,inset 10px 0 16px #0004,0 7px 16px #0008;transform-origin:14px 148px;transition:transform .5s cubic-bezier(.2,.8,.2,1);z-index:9}.open .lid{transform:translate(-6px,-25px) rotate(-104deg)}.hinge{position:absolute;left:33px;top:211px;width:25px;height:70px;background:#777;border:2px solid #454545;border-radius:5px;z-index:11}.chimney{position:absolute;left:96px;top:207px;width:158px;height:102px;background:linear-gradient(90deg,#6d6e6a,#dfded8 30%,#858682 70%,#c7c6c1);border:2px solid #555;border-radius:8px 8px 4px 4px;z-index:7;overflow:hidden}.chimney:before{content:"";position:absolute;inset:14px 12px;background:repeating-linear-gradient(90deg,#333 0 7px,transparent 7px 21px);clip-path:polygon(0 0,100% 0,90% 100%,10% 100%)}.wheel{position:absolute;width:72px;height:72px;left:139px;top:195px;border-radius:50%;background:repeating-linear-gradient(90deg,#424341 0 3px,#a6a6a1 3px 6px);border:3px solid #444;z-index:12;box-shadow:0 3px 5px #0008;transition:transform .25s}.spark .wheel{transform:rotate(180deg)}.wick{position:absolute;width:24px;height:22px;left:164px;top:213px;background:#302d28;border-radius:4px;z-index:10}.flame{position:absolute;left:135px;top:65px;width:82px;height:170px;z-index:8;opacity:0;transform-origin:50% 100%;transition:opacity .25s;background:radial-gradient(ellipse at 50% 70%,#fff 0 8%,#ffe76b 9% 29%,#ff7b18 35% 64%,#e52f0e 70%,transparent 72%);clip-path:polygon(50% 0,72% 25%,88% 50%,76% 79%,50% 100%,22% 80%,10% 48%,31% 25%);filter:drop-shadow(0 0 16px #ff5a1a) blur(.35px)}.lit .flame{opacity:1;animation:flicker .12s infinite alternate}.smoke{position:absolute;left:164px;top:38px;width:26px;height:100px;opacity:0;background:radial-gradient(ellipse,#9997,transparent 68%);filter:blur(9px);animation:smoke 2s infinite;z-index:6}.lit .smoke{opacity:.55}@keyframes flicker{to{transform:translate(4px) scale(.93,1.04) rotate(2deg)}}@keyframes smoke{0%{transform:translateY(35px) scale(.6);opacity:0}50%{opacity:.4}to{transform:translate(20px,-45px) scale(1.6);opacity:0}}.open .lighter{box-shadow:inset 0 0 0 4px #b4b3ae,inset 12px 0 18px #0004,inset -8px 0 16px #fff5,0 40px 70px #000,0 -40px 85px #ff7a1a22}.gesture-pill{position:absolute;top:82px;left:50%;transform:translate(-50%);padding:9px 14px;border:1px solid #343434;border-radius:24px;background:#101010cc;color:#999;font-size:11px;white-space:nowrap;z-index:20}.gesture-pill.ready{color:#ffb26e;border-color:#6e3a16}.spark-particles{position:absolute;left:170px;top:205px;z-index:15}.spark-particles i{display:none;position:absolute;width:4px;height:4px;background:#ffd25a;box-shadow:0 0 5px #ff5a00}.spark .spark-particles i{display:block;animation:spark .35s forwards}.spark-particles i:nth-child(2){--x:34px;--y:-25px}.spark-particles i:nth-child(3){--x:-28px;--y:-32px}.spark-particles i:nth-child(4){--x:22px;--y:10px}@keyframes spark{to{transform:translate(var(--x,12px),var(--y,-38px));opacity:0}}.bubble-mode .scene{background:radial-gradient(circle at 50% 65%,#15373b,#071316 65%,#040809)}.bubble-mode .lighter-stage{display:none}.bubble-world{display:none;position:absolute;inset:0;overflow:hidden}.bubble-mode .bubble-world{display:block}.wand{position:absolute;left:50%;bottom:12%;width:30px;height:300px;transform:translate(-50%) rotate(0);transform-origin:50% 100%;transition:transform .35s ease,bottom .35s ease;background:linear-gradient(90deg,#d2cbc1,#fff,#968f87);border-radius:12px;box-shadow:0 12px 30px #0008}.wand:before{content:"";position:absolute;width:112px;height:112px;left:50%;top:-94px;transform:translate(-50%);border:15px solid #e7e0d6;border-radius:50%;box-shadow:inset 0 0 12px #8ff8ff77,0 0 12px #8ff8ff55}.bottle{position:absolute;left:50%;bottom:-40px;width:180px;height:190px;transform:translate(-50%);border-radius:28px 28px 10px 10px;background:linear-gradient(90deg,#1d7083cc,#63d0dccc,#17576bcc);border:2px solid #9cf5ff88;box-shadow:inset 0 12px 20px #d8ffff44,0 20px 45px #000}.bubble{position:absolute;border-radius:50%;pointer-events:auto;background:radial-gradient(circle at 28% 24%,#fff 0 3%,#9ff8ff44 8%,transparent 33%),radial-gradient(circle at 70% 70%,#ff8cda33,transparent 40%);border:1px solid #d9ffffbb;box-shadow:inset -8px -8px 16px #ae7dff22,0 0 8px #8ffaff44;animation:float var(--life) ease-in forwards}.bubble.pop{animation:pop .18s ease-out forwards}@keyframes float{0%{transform:translate(0) scale(.55);opacity:0}8%{opacity:1}55%{transform:translate(var(--drift),-48vh) scale(1)}to{transform:translate(calc(var(--drift) * -.4),-105vh) scale(.86);opacity:.3}}@keyframes pop{to{transform:scale(1.45);opacity:0}}.mic-btn{display:block;position:absolute;bottom:110px;left:50%;transform:translate(-50%);z-index:24;border:1px solid #78e7ed88;background:#0d2529dd;color:#cfffff;border-radius:22px;padding:12px 18px}.bubble-mode .gesture-pill{color:#aafaff;border-color:#34777d}.bubble-mode .hint span:after{content:" · 或启用麦克风后吹气"}@media(max-width:480px){.lighter-stage{transform:scale(.82)}.gesture-pill{top:82px}.topbar{left:16px;right:16px}.brand{font-size:11px}.icon-btn{min-width:42px;padding:0 11px}}.home{min-height:100dvh;display:flex;flex-direction:column;background:radial-gradient(circle at 50% 30%,#1d1b18 0,#0b0b0b 55%,#050505);color:#eee;font-family:Arial,PingFang SC,sans-serif;padding:24px clamp(20px,6vw,72px) 32px}.home-head{display:flex;justify-content:space-between;align-items:center;padding-bottom:20px;border-bottom:1px solid #2a2a2a}.home-sub{font:11px ui-monospace,monospace;color:#8b8b8b;letter-spacing:.18em}.home-hero{padding:56px 0 40px}.home-hero h1{margin:0;font-size:clamp(38px,7vw,72px);line-height:1.02;letter-spacing:-.03em;font-weight:600}.home-hero h1 span{color:var(--hot)}.home-hero p{margin:16px 0 0;color:#9a9a9a;font-size:15px;line-height:1.7;max-width:460px}.home-grid{display:grid;gap:16px;grid-template-columns:repeat(auto-fill,minmax(240px,1fr))}.toy-card{display:flex;flex-direction:column;align-items:flex-start;gap:8px;text-align:left;padding:22px;border:1px solid #2c2c2c;border-radius:16px;background:#131313;cursor:pointer;color:#eee;transition:transform .18s,border-color .18s,box-shadow .18s}.toy-card:hover{transform:translateY(-3px);border-color:var(--accent);box-shadow:0 12px 34px #00000073,0 0 24px color-mix(in srgb,var(--accent) 22%,transparent)}.toy-icon{font-size:30px}.toy-name{font-size:18px;font-weight:600}.toy-desc{color:#9a9a9a;font-size:13px;line-height:1.5}.toy-cta{margin-top:8px;color:var(--accent);font-size:12px;letter-spacing:.1em}.home-foot{margin-top:auto;padding-top:36px;text-align:center;color:#666;font-size:12px;letter-spacing:.12em}.home-link{display:flex;align-items:center;gap:10px}@media(max-width:480px){.home{padding:18px 16px 28px}.home-hero{padding:40px 0 28px}}.brand-logo{width:34px;height:34px;border-radius:10px;object-fit:cover;box-shadow:0 2px 10px #0006}.bubble-world.blowing .wand{transform:translate(-50%) rotate(-4deg);bottom:15%}.bubble-world.blowing .wand:before{animation:filmGlow 1.2s ease-in-out infinite}@keyframes filmGlow{0%,to{box-shadow:inset 0 0 12px #8ff8ff77,0 0 12px #8ff8ff55}50%{box-shadow:inset 0 0 22px #d5fbffcc,0 0 26px #8ff8ffaa}}.bubble{filter:hue-rotate(var(--hue,0deg));animation:float var(--life) ease-in forwards,sway var(--sway,5s) ease-in-out infinite}@keyframes sway{0%,to{margin-left:0}50%{margin-left:14px}}