:root{color-scheme:dark;font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:#08090c}button,input{font:inherit}#app{position:relative;width:100%;height:100%;max-width:520px;margin:auto;background:radial-gradient(circle at 50% 40%,#17242b,#08090c 65%);overflow:hidden}video{display:none}canvas{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.grain{pointer-events:none;position:absolute;inset:0;opacity:.055;mix-blend-mode:soft-light;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.95' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.8'/%3E%3C/svg%3E")}header{position:absolute;z-index:3;top:0;left:0;right:0;padding:max(22px,env(safe-area-inset-top)) 22px 0;display:flex;direction:ltr;justify-content:space-between;align-items:center}.brand{font-size:14px;letter-spacing:.22em;font-weight:800}.brand i{font-size:9px;font-style:normal;color:#9bf7dc}header button,#gallery,#focusMode{border:1px solid #ffffff2d;color:white;background:#0b0d10a8;backdrop-filter:blur(14px);width:42px;height:42px;border-radius:50%;font-size:22px}.panel{position:absolute;z-index:4;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:32px;background:linear-gradient(#08090c44,#08090cb8)}.orb{width:132px;height:132px;border-radius:50%;background:radial-gradient(circle at 45% 42%,#f5fff9 0 5%,#9bf7dc 7%,#4c8fff 25%,#ba5cff 53%,transparent 68%);filter:blur(2px) saturate(1.25);box-shadow:0 0 60px #6f6cff66;margin-bottom:20px}.eyebrow{letter-spacing:.24em;color:#9bf7dc;font-size:10px}.panel h1{font-size:44px;letter-spacing:-.055em;margin:4px 0}.panel p{max-width:330px;line-height:1.8;color:#dce3e3;font-size:14px}.panel button{margin-top:22px;border:0;border-radius:999px;padding:15px 30px;background:#f4fff9;color:#07110e;font-weight:800}.panel small{margin-top:16px;color:#9ba5a4}#controls{position:absolute;z-index:3;bottom:0;left:0;right:0;padding:16px 22px max(24px,env(safe-area-inset-bottom));background:linear-gradient(transparent,#050607d9 30%)}.preset-row{direction:ltr;display:flex;justify-content:center;gap:10px;margin-bottom:16px}.preset-row button{border:0;background:transparent;color:#ffffff82;font-size:10px;letter-spacing:.18em;padding:8px}.preset-row .active{color:#a4f9de;border-bottom:1px solid #a4f9de}label{direction:ltr;display:flex;gap:12px;align-items:center;font-size:9px;letter-spacing:.16em;color:#a4f9de;max-width:300px;margin:auto}input{width:100%;accent-color:#a4f9de}.record-row{display:flex;direction:ltr;align-items:center;justify-content:space-between;margin:18px auto 6px;max-width:270px}#record{width:76px;height:76px;border-radius:50%;border:2px solid white;background:transparent;padding:6px}#record span{display:block;width:100%;height:100%;border-radius:50%;background:white;transition:.25s}#record.recording span{background:#ff3e5c;border-radius:14px;transform:scale(.58)}#status{text-align:center;font-size:10px;color:#ffffff8a;margin:10px 0 0}#focusRing{display:none;position:absolute;z-index:2;width:58px;height:58px;border:1px solid #b1ffe8aa;border-radius:50%;transform:translate(-50%,-50%);box-shadow:0 0 28px #87ffe266;pointer-events:none;transition:left .12s,top .12s;animation:pulse 2.4s infinite}@keyframes pulse{50%{transform:translate(-50%,-50%) scale(.82);opacity:.55}}@media(min-width:521px){body{background:#15171b}#app{box-shadow:0 0 80px #000}}