*,:before,:after{box-sizing:border-box;margin:0;padding:0}:root{--bg:#050508;--accent:#a855f7;--accent2:#f36;--glow:#c084fc;--text:#f1f5f9;--text-dim:#94a3b8;--glass:#ffffff0a;--glass-border:#ffffff14;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;font-family:Inter,system-ui,-apple-system,sans-serif}html,body{background:var(--bg);width:100%;height:100%;color:var(--text);-webkit-tap-highlight-color:transparent;overflow:hidden}#app{width:100dvw;height:100dvh;position:relative;overflow:hidden}#viz-canvas{background:var(--bg);touch-action:none;z-index:0;width:100%;height:100%;display:block;position:absolute;inset:0}.overlay{z-index:10;pointer-events:none;justify-content:center;align-items:center;transition:opacity .5s;display:flex;position:absolute;inset:0}.overlay[hidden]{display:none!important}.overlay>*{pointer-events:auto}#landing{-webkit-backdrop-filter:blur(8px);background:radial-gradient(at 50% 60%,#a855f71a 0%,#0000 70%),#050508a6}#landing-content{text-align:center;flex-direction:column;align-items:center;gap:24px;max-width:480px;padding:40px;display:flex}#brand{letter-spacing:-2px;color:#fff;font-size:48px;font-weight:800;line-height:1;animation:.6s both fadeUp}#brand span{background:linear-gradient(135deg, var(--accent), var(--accent2));-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text}#tagline{color:var(--text);font-size:22px;font-weight:600;line-height:1.4;animation:.6s .15s both fadeUp}#mode-buttons{flex-direction:column;gap:12px;width:100%;max-width:320px;animation:.6s .3s both fadeUp;display:flex}.mode-btn{border:1px solid var(--glass-border);background:var(--glass);color:#fff;cursor:pointer;-webkit-backdrop-filter:blur(12px);border-radius:20px;flex-direction:column;align-items:center;gap:4px;padding:20px 24px;font-family:inherit;transition:all .25s;display:flex;position:relative;overflow:hidden}.mode-btn:before{content:"";background:linear-gradient(135deg, var(--accent), var(--accent2));z-index:-1;opacity:0;filter:blur(12px);border-radius:21px;transition:opacity .3s;position:absolute;inset:-1px}.mode-btn:hover:before{opacity:.3}.mode-btn:hover{border-color:#a855f766;transform:translateY(-2px);box-shadow:0 8px 32px #a855f726}.mode-btn:active{transform:translateY(0)scale(.98)}.mode-btn:disabled{opacity:.5;cursor:not-allowed;transform:none}.mode-btn-icon{font-size:28px;line-height:1}.mode-btn-label{letter-spacing:1.5px;text-transform:uppercase;font-size:16px;font-weight:700}.mode-btn-sub{color:var(--text-dim);letter-spacing:1px;font-size:13px;font-weight:400}#voice-btn{animation:3s ease-in-out infinite modeBtnPulse}#touch-btn{animation:3s ease-in-out 1.5s infinite modeBtnPulse}@keyframes modeBtnPulse{0%,to{box-shadow:0 0 #a855f700}50%{box-shadow:0 0 24px #a855f71f}}#hint{color:#ffffff4d;letter-spacing:3px;text-transform:lowercase;font-size:14px;animation:.6s .45s both fadeUp}@keyframes fadeUp{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}#mode-indicator{-webkit-backdrop-filter:blur(10px);border:1px solid var(--glass-border);color:var(--text-dim);white-space:nowrap;cursor:pointer;opacity:.8;z-index:5;background:#05050880;border-radius:20px;align-items:center;gap:6px;padding:6px 16px;font-family:inherit;font-size:12px;font-weight:500;transition:all .25s;display:flex;position:absolute;top:60px;left:50%;transform:translate(-50%)}#mode-indicator:hover{opacity:1;border-color:var(--accent);background:#a855f71a}#mode-indicator:active{transform:translate(-50%)scale(.96)}.mode-switch-hint{color:var(--glow);letter-spacing:.5px;opacity:.6;font-size:10px;font-weight:600;transition:opacity .2s}#mode-indicator:hover .mode-switch-hint{opacity:1}#close-btn{top:16px;left:16px;top:max(16px, env(safe-area-inset-top));border:1px solid var(--glass-border);-webkit-backdrop-filter:blur(10px);width:36px;height:36px;color:var(--text-dim);cursor:pointer;z-index:15;background:#05050866;border-radius:50%;justify-content:center;align-items:center;padding:0;font-family:inherit;font-size:18px;font-weight:300;line-height:1;transition:all .2s;display:flex;position:absolute}#close-btn:hover{color:var(--text);background:#ffffff0f;border-color:#fff3}#close-btn:active{transform:scale(.9)}#cross-sell{justify-content:center;width:100%;display:flex}.cross-sell-btn{color:var(--glow);cursor:pointer;text-align:center;background:#a855f70f;border:1px dashed #a855f766;border-radius:12px;width:100%;padding:12px 24px;font-family:inherit;font-size:14px;font-weight:600;transition:all .25s}.cross-sell-btn:hover{border-color:var(--accent);background:#a855f726;transform:translateY(-1px);box-shadow:0 4px 20px #a855f726}.cross-sell-btn:active{transform:translateY(0)}#live-ui{flex-direction:column;justify-content:flex-end;align-items:flex-end;padding:0}#bottom-controls{padding:0 0 20px;padding-bottom:max(20px, env(safe-area-inset-bottom));pointer-events:auto;background:linear-gradient(#0000 0%,#0505084d 40%,#050508b3 100%);flex-direction:column;align-items:center;gap:10px;display:flex;position:absolute;bottom:0;left:0;right:0}#viz-carousel{scrollbar-width:none;-ms-overflow-style:none;-webkit-overflow-scrolling:touch;gap:8px;max-width:100%;padding:4px 24px;display:flex;overflow:auto hidden;-webkit-mask-image:linear-gradient(90deg,#0000,#000 20px calc(100% - 20px),#0000);mask-image:linear-gradient(90deg,#0000,#000 20px calc(100% - 20px),#0000)}.carousel-pill{border:1px solid var(--glass-border);background:var(--glass);color:var(--text-dim);cursor:pointer;white-space:nowrap;-webkit-backdrop-filter:blur(10px);border-radius:24px;flex-shrink:0;min-height:40px;padding:8px 18px;font-family:inherit;font-size:13px;font-weight:600;transition:all .25s}.carousel-pill:hover{color:var(--text);border-color:#ffffff40}.carousel-pill.active{color:#fff;border-color:var(--accent);background:#a855f733;transform:scale(1.08);box-shadow:0 0 16px #a855f74d}#viz-dots{justify-content:center;gap:6px;padding:2px 0;display:flex}.dot{cursor:pointer;background:#fff3;border-radius:50%;width:6px;height:6px;transition:all .25s}.dot.active{background:linear-gradient(90deg, var(--accent), var(--accent2));border-radius:3px;width:18px;box-shadow:0 0 8px #a855f766}#viz-name-toast{-webkit-backdrop-filter:blur(12px);border:1px solid var(--glass-border);color:#fff;letter-spacing:.5px;white-space:nowrap;pointer-events:none;opacity:0;z-index:15;background:#05050899;border-radius:16px;padding:10px 28px;font-size:18px;font-weight:700;transition:opacity .25s,transform .25s;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)scale(.9)}#viz-name-toast.visible{opacity:1;transform:translate(-50%,-50%)scale(1)}#swipe-nudge{-webkit-backdrop-filter:blur(12px);pointer-events:none;opacity:0;z-index:15;background:#0505088c;border:1px solid #a855f740;border-radius:24px;align-items:center;gap:12px;padding:10px 24px;transition:opacity .5s;display:flex;position:absolute;top:45%;left:50%;transform:translate(-50%)}#swipe-nudge.visible{opacity:1}.nudge-text{color:var(--text-dim);letter-spacing:1px;font-size:14px;font-weight:500}.nudge-arrow{color:var(--glow);font-size:22px;font-weight:700;line-height:1}.nudge-left{animation:1.2s ease-in-out infinite nudgeBounceL}.nudge-right{animation:1.2s ease-in-out infinite nudgeBounceR}@keyframes nudgeBounceL{0%,to{transform:translate(0)}50%{transform:translate(-6px)}}@keyframes nudgeBounceR{0%,to{transform:translate(0)}50%{transform:translate(6px)}}#rec-btn{border:2px solid var(--accent2);color:#fff;letter-spacing:1px;cursor:pointer;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#ff33661f;border-radius:50px;align-items:center;gap:10px;min-height:56px;padding:16px 36px;font-family:inherit;font-size:16px;font-weight:700;transition:all .25s;display:flex}#rec-btn:hover{background:#ff336640;transform:scale(1.05);box-shadow:0 0 30px #ff33664d}#rec-btn:active{transform:scale(.97)}.rec-dot{background:var(--accent2);border-radius:50%;width:12px;height:12px;animation:1.2s ease-in-out infinite recDotPulse}@keyframes recDotPulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.5;transform:scale(.8)}}#rec-hud{background:0 0;justify-content:flex-start;align-items:flex-start}#rec-bar{width:100%;padding:10px 20px 12px;padding-top:max(10px, env(safe-area-inset-top));-webkit-backdrop-filter:blur(16px);background:#0505088c;border-bottom:1px solid #ffffff0f;flex-direction:column;gap:8px;display:flex}#rec-bar-top{color:#ffffffb3;letter-spacing:.5px;justify-content:space-between;align-items:center;font-size:12px;font-weight:600;display:flex}#rec-indicator{color:var(--accent2);letter-spacing:2px;align-items:center;gap:7px;font-size:13px;font-weight:700;display:flex}#rec-dot-pulse{background:var(--accent2);border-radius:50%;width:8px;height:8px;animation:1s ease-in-out infinite recDotBlink;display:inline-block}@keyframes recDotBlink{0%,to{opacity:1}50%{opacity:.25}}#rec-phase{color:var(--text-dim);font-size:13px;font-weight:500}#rec-time{font-variant-numeric:tabular-nums;color:#ffffff80;font-family:ui-monospace,Cascadia Code,Consolas,monospace;font-size:12px}#rec-track{background:#ffffff14;border-radius:2px;width:100%;height:4px;overflow:hidden}#rec-track-fill{background:linear-gradient(90deg, var(--accent2), var(--accent));border-radius:2px;width:0%;height:100%;transition:width .15s linear;box-shadow:0 0 10px #f366}#processing{-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);background:#050508cc}#proc-content{flex-direction:column;align-items:center;gap:20px;display:flex}#proc-content p{color:var(--text-dim);font-size:16px}#spinner{border:3px solid #ffffff1a;border-top-color:var(--accent);border-radius:50%;width:48px;height:48px;animation:.8s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}#preview{-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);background:#050508eb;overflow-y:auto}#preview-content{flex-direction:column;align-items:center;gap:24px;width:100%;max-width:440px;padding:32px 20px;display:flex}#preview-player{aspect-ratio:9/16;background:#000;border:1px solid #ffffff14;border-radius:16px;width:100%;max-width:240px;overflow:hidden;box-shadow:0 0 40px #a855f733,0 4px 30px #00000080}#preview-video{object-fit:cover;width:100%;height:100%}#share-title{text-align:center;font-size:20px;font-weight:700}#share-buttons{grid-template-columns:1fr 1fr;gap:10px;width:100%;display:grid}.share-btn{border:1px solid var(--glass-border);background:var(--glass);color:var(--text);cursor:pointer;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-radius:12px;justify-content:center;align-items:center;gap:8px;min-height:48px;padding:12px 16px;font-family:inherit;font-size:14px;font-weight:600;transition:all .2s;display:flex}.share-btn:hover{border-color:var(--accent);background:#ffffff14;transform:translateY(-1px)}.share-btn:active{transform:translateY(0)}.share-icon{font-size:18px}.share-btn[data-platform=download]:hover{border-color:#00d97e;box-shadow:0 0 15px #00d97e33}#preview-actions{gap:12px;width:100%;display:flex}#preview-actions button{cursor:pointer;border:none;border-radius:12px;flex:1;min-height:50px;padding:14px 20px;font-family:inherit;font-size:15px;font-weight:600;transition:all .2s}#try-again-btn{background:linear-gradient(135deg, var(--accent), var(--accent2));color:#fff}#try-again-btn:hover{transform:translateY(-1px);box-shadow:0 0 20px #a855f74d}#new-viz-btn{background:var(--glass);color:var(--text);border:1px solid var(--glass-border)!important}#new-viz-btn:hover{background:#ffffff14;transform:translateY(-1px)}.error-toast{color:var(--accent2);text-align:center;background:#ff336626;border:1px solid #ff33664d;border-radius:8px;padding:10px 16px;font-size:13px;animation:.3s toastIn}@keyframes toastIn{0%{opacity:0;transform:translate(-50%)translateY(10px)}to{opacity:1;transform:translate(-50%)translateY(0)}}#photo-modal{z-index:1000;-webkit-backdrop-filter:blur(6px);opacity:0;pointer-events:none;background:#000000bf;justify-content:center;align-items:center;transition:opacity .25s;display:flex;position:fixed;inset:0}#photo-modal.visible{opacity:1;pointer-events:auto}#photo-modal-box{text-align:center;background:#0a0814f5;border:1px solid #ffbe0080;border-radius:20px;flex-direction:column;align-items:center;gap:14px;max-width:min(420px,92vw);padding:32px 28px;display:flex;box-shadow:0 8px 48px #000c,0 0 32px #ffbe0014}#photo-modal-icon{font-size:40px;line-height:1}#photo-modal-title{color:#ffd84d;letter-spacing:.02em;font-size:18px;font-weight:700}#photo-modal-body{color:var(--text);font-size:14px;line-height:1.6}#photo-modal-body strong{color:#ffd84d}#photo-modal-sub{color:var(--text-dim);font-size:13px;line-height:1.5}#photo-modal-ok{color:#ffd84d;cursor:pointer;background:#ffbe001a;border:1px solid #ffbe0066;border-radius:12px;width:100%;margin-top:6px;padding:12px 28px;font-family:inherit;font-size:15px;font-weight:600;transition:all .2s}#photo-modal-ok:hover{background:#ffbe0033;border-color:#ffbe00b3}#photo-modal-ok:active{transform:scale(.97)}@media (width>=601px){#photo-modal-title{font-size:22px}#photo-modal-body{font-size:15px}#photo-modal-sub{font-size:14px}#photo-modal-ok{padding:14px 32px;font-size:16px}}@media (width<=600px){#brand{font-size:36px}#tagline{font-size:18px}#hint{letter-spacing:2px;font-size:12px}#landing-content{gap:20px;padding:24px}.mode-btn{padding:16px 20px}.mode-btn-icon{font-size:24px}.mode-btn-label{font-size:14px}.mode-btn-sub{font-size:12px}#mode-indicator{font-size:11px;top:52px}#close-btn{width:32px;height:32px;font-size:16px}#rec-btn{min-height:48px;padding:14px 28px;font-size:14px}.carousel-pill{min-height:34px;padding:6px 14px;font-size:12px}#preview-content{gap:18px;padding:20px 16px}#preview-player{max-width:180px}#share-title{font-size:17px}.share-btn{padding:10px 12px;font-size:13px}#preview-actions button{padding:12px 16px;font-size:14px}}@media (width<=360px){#brand{font-size:28px}#tagline{font-size:15px}}#viz-carousel{scrollbar-width:none}#viz-carousel::-webkit-scrollbar{display:none}.overlay{animation:.4s overlayIn}@keyframes overlayIn{0%{opacity:0}to{opacity:1}}@media (width>=601px){#mode-indicator{border-radius:28px;padding:14px 32px;font-size:20px}#close-btn{width:54px;height:54px;font-size:28px}}@media (width<=600px){#mode-indicator{border-radius:20px;padding:7px 16px;font-size:13px}#close-btn{width:36px;height:36px;font-size:18px}}#privacy-link{top:max(16px, env(safe-area-inset-top));z-index:50;color:var(--text-dim);letter-spacing:.3px;cursor:pointer;text-underline-offset:3px;background:0 0;border:none;padding:4px 2px;font-family:inherit;font-size:12px;font-weight:500;text-decoration:underline;transition:color .2s;position:fixed;right:20px}#privacy-link:hover,#privacy-link:focus-visible{color:var(--accent);outline:none}#privacy-modal{z-index:1002;-webkit-backdrop-filter:blur(8px);background:#000000b8;justify-content:center;align-items:center;animation:.2s privacyFadeIn;display:flex;position:fixed;inset:0}#privacy-modal[hidden]{display:none!important}@keyframes privacyFadeIn{0%{opacity:0}to{opacity:1}}#privacy-modal-box{border:1px solid var(--glass-border);background:#0c0a16fa;border-radius:20px;flex-direction:column;gap:16px;max-width:min(460px,94vw);max-height:90dvh;padding:32px 28px 24px;animation:.25s privacySlideUp;display:flex;overflow-y:auto;box-shadow:0 8px 48px #000c}@keyframes privacySlideUp{0%{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}#privacy-modal-title{color:var(--text);letter-spacing:-.2px;font-size:18px;font-weight:700}#privacy-modal-body{flex-direction:column;gap:12px;display:flex}#privacy-modal-body p{color:var(--text-dim);font-size:14px;line-height:1.65}#privacy-modal-body p strong{color:var(--text);font-weight:600}#privacy-modal-body a{color:var(--accent);text-underline-offset:2px;text-decoration:underline}#privacy-modal-close{border:1px solid var(--glass-border);color:var(--accent);cursor:pointer;background:#a855f71a;border-radius:12px;align-self:flex-end;margin-top:4px;padding:10px 28px;font-family:inherit;font-size:14px;font-weight:600;transition:background .2s,border-color .2s}#privacy-modal-close:hover,#privacy-modal-close:focus-visible{border-color:var(--accent);background:#a855f738;outline:none}@media (width<=600px){#privacy-link{font-size:11px;right:12px}#privacy-modal-box{gap:12px;padding:24px 18px 18px}#privacy-modal-title{font-size:16px}#privacy-modal-body p{font-size:13px}#privacy-modal-close{padding:9px 22px;font-size:13px}}@media (width>=601px){#privacy-link{font-size:13px}#privacy-modal-title{font-size:20px}#privacy-modal-body p{font-size:15px}}#viz-info-btn{top:max(14px, env(safe-area-inset-top));z-index:200;color:#fff;letter-spacing:.04em;text-transform:lowercase;cursor:pointer;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);white-space:nowrap;touch-action:manipulation;background:#a855f72e;border:1px solid #a855f78c;border-radius:999px;align-items:center;gap:6px;height:34px;padding:0 16px;font-family:inherit;font-size:13px;font-weight:600;line-height:1;transition:background .2s,border-color .2s,box-shadow .2s;display:flex;position:fixed;right:16px}#viz-info-btn:after{content:"ℹ";opacity:.75;font-size:12px}#viz-info-btn:hover,#viz-info-btn:focus-visible{border-color:var(--accent);background:#a855f761;outline:none;box-shadow:0 0 12px #a855f766}#viz-info-modal{z-index:1010;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#000000b8;justify-content:center;align-items:center;padding:16px;display:flex;position:fixed;inset:0}#viz-info-modal[hidden]{display:none}#viz-info-box{background:#0c0818f5;border:1px solid #a855f759;border-radius:16px;flex-direction:column;gap:16px;width:100%;max-width:540px;max-height:80vh;padding:28px 26px 22px;display:flex;overflow-y:auto;box-shadow:0 8px 48px #0009,0 0 0 1px #a855f71f}#viz-info-title{color:#fff;letter-spacing:-.01em;margin:0;font-size:22px;font-weight:700}#viz-info-body{flex-direction:column;gap:12px;display:flex}#viz-info-body p{color:#ffffffd1;margin:0;font-size:14px;line-height:1.65}#viz-info-body strong{color:#fff}#viz-info-body em{color:#a855f7f2;font-style:normal}#viz-info-close{color:#fff;cursor:pointer;background:#a855f726;border:1px solid #a855f780;border-radius:8px;align-self:flex-end;padding:10px 26px;font-family:inherit;font-size:14px;transition:background .2s,border-color .2s}#viz-info-close:hover,#viz-info-close:focus-visible{border-color:var(--accent);background:#a855f74d;outline:none}@media (width<=600px){#viz-info-btn{height:30px;padding:0 12px;font-size:12px;top:12px;right:12px}#viz-info-box{max-height:85vh;padding:20px 16px 16px}#viz-info-title{font-size:18px}#viz-info-body p{font-size:13px}#viz-info-close{padding:9px 20px;font-size:13px}}@media (width>=601px){#viz-info-btn{height:38px;padding:0 20px;font-size:14px}#viz-info-title{font-size:24px}#viz-info-body p{font-size:15px}}
