:root{--ink: #f5ede6;--muted: #a4948a;--ground: #14100f;--ground-2: #1e1815;--line: rgba(245, 237, 230, .14);--accent: #f0785a;--gold: #e9b95a;--rain: #bfd4f2;--shadow: 0 12px 40px rgba(0, 0, 0, .45);--ink-on-accent: #1b120e;--glass: rgba(20, 16, 15, .6);--glass-blur: 9px;--glass-press: rgba(245, 237, 230, .1);--glass-press-line: rgba(245, 237, 230, .24);--accent-soft: rgba(240, 120, 90, .12);--accent-tint: rgba(240, 120, 90, .16);--accent-line: rgba(240, 120, 90, .55);--icon-knob: #191311;--grad-primary: linear-gradient(135deg, var(--accent) 0%, var(--gold) 100%);--grad-slider: linear-gradient(90deg, var(--accent), var(--gold));--gold-soft: rgba(233, 185, 90, .1);--ink-on-accent-a30: rgba(27, 18, 14, .3);--ink-a30: rgba(245, 237, 230, .3);--paused-dim: rgba(20, 16, 15, .72);--accent-hold: rgba(240, 120, 90, .26);--drawer-bg: rgba(30, 24, 21, .94);--type-label: 16px;--type-control: 16px;--type-button: 16px;--type-hint: 14px;--type-debug: 13px;--type-label-shadow: 0 1px 2px rgba(0, 0, 0, .55);color-scheme:dark}*{box-sizing:border-box}[hidden]{display:none!important}html,body{margin:0;height:100%;overflow:hidden;background:var(--ground);color:var(--ink);font-family:-apple-system,BlinkMacSystemFont,PingFang SC,Noto Sans SC,Microsoft YaHei,system-ui,sans-serif;-webkit-font-smoothing:antialiased;overscroll-behavior:none}#stage{position:fixed;inset:0}#cam,#camFront{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transform:scaleX(-1);background:var(--ground)}#camFront.is-collider{filter:sepia(1) hue-rotate(120deg) saturate(2.4) brightness(1.15)}#fx,#rain{position:absolute;inset:0;pointer-events:none}#hud{position:absolute;inset:0;pointer-events:none;text-size-adjust:100%;-webkit-text-size-adjust:100%}#hud button{pointer-events:auto;font:inherit}.start{position:absolute;inset:0;display:grid;place-items:center;padding:0 44px;background:radial-gradient(120% 90% at 50% 0%,var(--accent-tint),transparent 60%),radial-gradient(90% 70% at 50% 110%,var(--gold-soft),transparent 60%),var(--ground);pointer-events:auto;transition:opacity .4s ease,transform .4s ease}.start.is-gone{opacity:0;transform:scale(1.03);pointer-events:none}.start-inner{width:100%;max-width:302px;text-align:center;display:flex;flex-direction:column;align-items:center}.start-copy{display:flex;flex-direction:column;align-items:center;width:100%}.start-title{margin:0;font-size:30px;font-weight:600;letter-spacing:.02em;text-wrap:balance;line-height:1.35}.start-inner:has(#previewWrap:not([hidden])) .start-title{margin-top:26px;font-size:28px}.start-sub{margin:14px 0 0;color:var(--muted);font-size:14px;line-height:1.8;max-width:276px}.start-inner:has(#previewWrap:not([hidden])) .start-sub{margin-top:12px}.start-btn{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:10px;width:100%;height:52px;margin-top:34px;letter-spacing:.04em}.start-inner:has(#previewWrap:not([hidden])) .start-btn{margin-top:26px}.start-btn .spinner{display:none;width:16px;height:16px;border-radius:999px;border:2px solid var(--ink-on-accent-a30);border-top-color:var(--ink-on-accent);animation:spin .8s linear infinite}.start-btn.is-busy .spinner{display:block}@keyframes spin{to{transform:rotate(360deg)}}.start-note{margin:14px 0 0;font-size:12px;color:var(--muted);font-variant-numeric:tabular-nums}.start-steps{margin:18px 0 0;max-width:300px;font-size:12px;line-height:1.9;color:var(--muted)}.start-link{border:0;background:none;margin-top:10px;padding:0;color:var(--accent);font:inherit;font-size:13px;text-decoration:underline;text-underline-offset:4px;cursor:pointer}.start-cam{position:absolute;left:0;right:0;bottom:calc(74px + env(safe-area-inset-bottom,0px));display:flex;align-items:center;justify-content:center;gap:7px;margin:0;font-size:11px;letter-spacing:.02em;color:var(--muted)}.start-cam-dot{width:4px;height:4px;border-radius:999px;background:var(--gold);flex:none}.start-privacy{position:absolute;left:0;right:0;bottom:calc(46px + env(safe-area-inset-bottom,0px));margin:0;text-align:center;color:var(--muted);font-size:11px;letter-spacing:.02em}.btn-primary{border:0;border-radius:999px;padding:0 24px;height:52px;font-size:16px;font-weight:600;cursor:pointer;transition:transform .15s ease,opacity .2s ease,background .2s ease,filter .15s ease;background:var(--grad-primary);color:var(--ink-on-accent)}.btn-primary:active{transform:scale(.98);filter:brightness(.86)}.btn-primary:disabled{opacity:.55;cursor:default;filter:none}.btn-primary:focus-visible,.manual:focus-visible,.share:focus-visible,.icon-btn:focus-visible,.ui-dot:focus-visible{outline:2px solid var(--gold);outline-offset:3px}.preview{width:min(100%,220px);aspect-ratio:1 / 1;border-radius:18px;overflow:hidden;border:1px solid var(--line);background:var(--ground-2)}.preview img{width:100%;height:100%;object-fit:cover;display:block}.guide{position:absolute;left:50%;bottom:calc(58px + env(safe-area-inset-bottom,0px));transform:translate(-50%);display:flex;flex-direction:column;align-items:center;gap:14px;transition:opacity .5s ease;max-width:min(90vw,22rem)}.guide:has(.guide-text.is-off){gap:10px}.guide.is-gone{opacity:0}.guide-text{margin:0;font-size:var(--type-hint);font-weight:500;line-height:1.5;letter-spacing:.02em;text-align:center;color:#fff;text-shadow:var(--type-label-shadow);opacity:.5;transition:opacity .3s ease}.guide-text.is-off{opacity:0;height:0;overflow:hidden;pointer-events:none}.guide-bars{display:flex;flex-direction:column;gap:10px}.guide-bar-row{display:flex;align-items:center;gap:8px;transition:opacity .15s ease}.guide-bar-row.is-dim{opacity:.35}.guide-bar-row span{flex:none;min-width:2.3em;white-space:nowrap;font-size:var(--type-label);font-weight:600;line-height:1.35;color:#fff;text-align:right;text-shadow:var(--type-label-shadow)}.guide-bar{position:relative;width:184px;max-width:calc(90vw - 4.8em);height:5px;border-radius:999px;background:#f5ede666;overflow:hidden}.guide-bar i{display:block;width:100%;height:100%;transform-origin:left center;transform:scaleX(0);transition:transform .12s linear;background:var(--rain)}.guide-bar[data-phase=laugh] i{background:var(--accent)}.status{position:absolute;left:50%;top:calc(104px + env(safe-area-inset-top,0px));transform:translate(-50%);display:flex;align-items:center;margin:0;min-height:36px;padding:6px 14px;border-radius:999px;background:var(--glass);border:1px solid var(--line);backdrop-filter:blur(var(--glass-blur));-webkit-backdrop-filter:blur(var(--glass-blur));font-size:var(--type-hint);font-weight:500;line-height:1.5;letter-spacing:.02em;color:#fff;text-shadow:var(--type-label-shadow);white-space:nowrap}.topbar{position:absolute;right:calc(16px + env(safe-area-inset-right,0px));top:calc(54px + env(safe-area-inset-top,0px));display:flex;gap:8px}.icon-btn{width:44px;height:44px;min-width:44px;min-height:44px;flex-shrink:0;border-radius:999px;border:1px solid var(--line);background:var(--glass);backdrop-filter:blur(var(--glass-blur));-webkit-backdrop-filter:blur(var(--glass-blur));color:var(--ink);display:grid;place-items:center;cursor:pointer;padding:0;touch-action:none;-webkit-user-select:none;user-select:none}.icon-btn svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}.icon-btn svg .knob{fill:currentColor;stroke:var(--ground-2);stroke-width:3;paint-order:stroke}.icon-btn:active{transform:scale(.98);background:var(--glass-press);border-color:var(--glass-press-line)}.ui-dot{position:absolute;right:calc(24px + env(safe-area-inset-right,0px));top:calc(62px + env(safe-area-inset-top,0px));width:24px;height:24px;border-radius:999px;border:0;background:var(--ink-a30);cursor:pointer;padding:0}.ui-dot:after{content:"";position:absolute;inset:-12px}#hud.is-ui-hidden>:not(.ui-dot):not(.start):not(.debug){display:none!important}.drawer-ends{display:flex;justify-content:space-between;margin-top:4px}.drawer-ends i{font-style:normal;font-size:var(--type-hint);line-height:1.5;color:var(--muted);letter-spacing:.04em}.drawer-switch span em{display:block;margin-top:2px;font-style:normal;font-size:var(--type-hint);font-weight:400;line-height:1.5;color:var(--muted)}.drawer-palette{display:flex;flex-direction:column;gap:10px}.drawer-swatches{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.drawer-swatch{display:flex;flex-direction:column;align-items:center;gap:6px;padding:8px 4px;border:1px solid transparent;border-radius:12px;background:#f5ede60d;color:var(--muted);font:inherit;cursor:pointer}.drawer-swatch.is-on{border-color:var(--gold);background:#e9b95a1f;color:var(--ink)}.drawer-swatch-dots{display:flex;gap:3px}.drawer-swatch-dots i{width:10px;height:10px;border-radius:50%}.drawer-swatch em{font-style:normal;font-size:var(--type-hint);line-height:1.35;letter-spacing:.04em}.drawer-swatch:focus-visible{outline:2px solid var(--gold);outline-offset:2px}.drawer-more{display:flex;align-items:center;justify-content:space-between;width:100%;margin-top:4px;min-height:44px;padding:12px 0;border:0;border-top:1px solid var(--line);background:none;color:var(--muted);font:inherit;font-size:var(--type-button);line-height:1.35;cursor:pointer}.drawer-more span{transition:transform .2s ease}.drawer-more.is-open span{transform:rotate(90deg)}.drawer-more:hover{color:var(--ink)}.toast{position:absolute;left:50%;bottom:calc(120px + env(safe-area-inset-bottom,0px));transform:translate(-50%,6px);display:flex;align-items:center;gap:8px;margin:0;min-height:36px;padding:6px 16px;border-radius:999px;background:var(--glass);border:1px solid var(--line);backdrop-filter:blur(var(--glass-blur));-webkit-backdrop-filter:blur(var(--glass-blur));font-size:var(--type-hint);font-weight:500;line-height:1.5;color:#fff;text-shadow:var(--type-label-shadow);white-space:nowrap;opacity:0;transition:opacity .24s ease,transform .24s ease}.toast.is-on{opacity:1;transform:translate(-50%)}.paused{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;gap:10px;padding:0 24px calc(74px + env(safe-area-inset-bottom,0px));border:0;background:var(--paused-dim);backdrop-filter:blur(7px);-webkit-backdrop-filter:blur(7px);color:var(--ink);font:inherit;text-align:center;cursor:pointer;pointer-events:auto;z-index:3}.paused-title{font-size:var(--type-control);font-weight:600;line-height:1.35;letter-spacing:.02em}.paused-hint{font-size:var(--type-hint);line-height:1.5;color:var(--muted)}.banner{position:absolute;left:calc(16px + env(safe-area-inset-left,0px));top:calc(57px + env(safe-area-inset-top,0px));display:flex;align-items:center;gap:8px;min-height:44px;max-width:calc(100vw - 176px);padding:0 12px;border-radius:999px;background:var(--glass);border:1px solid var(--line);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);font-size:var(--type-hint);font-weight:500;line-height:1.35;color:#fff;text-shadow:var(--type-label-shadow);white-space:nowrap}.banner-dot{width:5px;height:5px;border-radius:999px;background:var(--gold);flex:none}.banner-text{overflow:hidden;text-overflow:ellipsis}.banner-rule{width:1px;height:12px;background:var(--line);flex:none}.banner-btn{flex:none;display:inline-flex;align-items:center;gap:4px;min-width:44px;min-height:44px;padding:0;border:0;background:none;color:var(--accent);font:inherit;font-size:var(--type-button);font-weight:500;line-height:1.35;cursor:pointer}.banner-btn svg{width:13px;height:13px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}.banner-btn:disabled{color:var(--muted);cursor:default}.banner-btn:focus-visible{outline:2px solid var(--gold);outline-offset:2px}.manual{position:absolute;right:calc(16px + env(safe-area-inset-right,0px));bottom:calc(54px + env(safe-area-inset-bottom,0px));width:56px;height:56px;border-radius:999px;border:1px solid var(--accent-line);background:var(--accent-tint);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);display:grid;place-items:center;cursor:pointer;touch-action:none;transition:transform .15s ease,background .15s ease}.manual:active{transform:scale(.98)}.manual-dot{width:18px;height:18px;border-radius:999px;background:var(--grad-primary);transition:width .15s ease,height .15s ease}.manual-hint{position:absolute;right:calc(84px + env(safe-area-inset-right,0px));bottom:calc(74px + env(safe-area-inset-bottom,0px));margin:0;font-size:var(--type-hint);font-weight:500;line-height:1.5;color:#fff;text-shadow:var(--type-label-shadow);white-space:nowrap}.manual-hint-hold{display:none}#hud:has(.manual.is-holding) .manual-hint-idle{display:none}#hud:has(.manual.is-holding) .manual-hint-hold{display:inline}.manual-ring{position:absolute;left:-6px;top:-6px;width:68px;height:68px;transform:rotate(-90deg);opacity:0;pointer-events:none}.manual-ring-track,.manual-ring-fill{fill:none;stroke-width:2}.manual-ring-track{stroke:var(--line)}.manual-ring-fill{stroke:var(--gold);stroke-linecap:round;stroke-dasharray:194.8;stroke-dashoffset:194.8}.manual.is-holding{background:var(--accent-hold)}.manual.is-holding .manual-dot{width:22px;height:22px}.manual.is-holding .manual-ring{opacity:1}.manual.is-holding .manual-ring-fill{animation:ring-fill .35s linear forwards}@keyframes ring-fill{to{stroke-dashoffset:0}}.share{display:none!important}.share:active{transform:scale(.98);background:var(--glass-press);border-color:var(--glass-press-line)}.share svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}.debug{position:absolute;left:calc(14px + env(safe-area-inset-left,0px));top:calc(14px + env(safe-area-inset-top,0px));margin:0;padding:10px 12px;border-radius:8px;background:var(--paused-dim);border:1px solid var(--line);font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:var(--type-debug);line-height:1.5;color:var(--gold);white-space:pre;font-variant-numeric:tabular-nums;pointer-events:none}.drawer{position:fixed;z-index:4;pointer-events:none;visibility:hidden;text-size-adjust:100%;-webkit-text-size-adjust:100%}.drawer.is-open{pointer-events:auto;visibility:visible}.drawer-sheet{background:var(--drawer-bg);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid var(--line);color:var(--ink);display:flex;flex-direction:column;overflow:hidden;transition:transform .28s ease}.drawer-handle{display:none;padding:8px 0 0;cursor:grab;touch-action:none;flex-shrink:0}.drawer-handle i{display:block;width:36px;height:4px;margin:0 auto;border-radius:999px;background:var(--glass-press-line)}.drawer-advanced{display:flex;flex-direction:column;gap:0}.drawer-sub{margin:0;font-size:var(--type-control);font-weight:600;line-height:1.35;letter-spacing:.02em}.drawer-hint{margin:6px 0 20px;font-size:var(--type-hint);line-height:1.5;color:var(--muted)}.drawer-advanced .drawer-field+.drawer-field{margin-top:20px}.drawer-advanced>.drawer-switch{margin-top:24px}.drawer-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 12px 12px 20px;border-bottom:1px solid var(--line);flex-shrink:0}.drawer-title{margin:0;font-size:17px;font-weight:600;letter-spacing:.02em}.drawer-close{width:44px;height:44px;min-width:44px;min-height:44px;flex-shrink:0;border:0;border-radius:999px;background:transparent;color:var(--muted);display:grid;place-items:center;cursor:pointer;padding:0}.drawer-close svg{width:18px;height:18px;stroke:currentColor;stroke-width:1.5;stroke-linecap:round}.drawer-close:focus-visible{outline:2px solid var(--gold);outline-offset:2px}.drawer-body{flex:1 1 auto;min-height:0;padding:20px 20px calc(40px + env(safe-area-inset-bottom,0px));overflow-y:auto;overscroll-behavior:contain;display:flex;flex-direction:column;gap:18px}.drawer-field{display:flex;flex-direction:column;gap:9px}.drawer-field-head{display:flex;justify-content:space-between;align-items:baseline;gap:8px;font-size:var(--type-control);font-weight:500;line-height:1.35;color:var(--ink)}.drawer-val{color:var(--gold);font-size:var(--type-debug);line-height:1.5;font-variant-numeric:tabular-nums}.drawer input[type=range]{width:100%;height:14px;margin:0;background:transparent;appearance:none;cursor:pointer}.drawer input[type=range]::-webkit-slider-runnable-track{height:3px;border-radius:999px;background-image:var(--grad-slider),linear-gradient(var(--line),var(--line));background-size:var(--p, 0%) 100%,100% 100%;background-repeat:no-repeat}.drawer input[type=range]::-webkit-slider-thumb{appearance:none;width:14px;height:14px;margin-top:-5.5px;border:0;border-radius:999px;background:var(--ink)}.drawer input[type=range]::-moz-range-track{height:3px;border-radius:999px;background:var(--line)}.drawer input[type=range]::-moz-range-progress{height:3px;border-radius:999px;background:var(--grad-slider)}.drawer input[type=range]::-moz-range-thumb{width:14px;height:14px;border:0;border-radius:999px;background:var(--ink)}.drawer-switch{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:44px;font-size:var(--type-control);font-weight:500;line-height:1.35;color:var(--ink);cursor:pointer}.drawer-switch input{-webkit-appearance:none;appearance:none;width:44px;height:26px;border:0;border-radius:999px;background:var(--line);flex:none;position:relative;cursor:pointer}.drawer-switch input:after{content:"";position:absolute;top:3px;left:3px;width:20px;height:20px;border-radius:999px;background:var(--muted)}.drawer-switch input:checked{background:var(--grad-primary)}.drawer-switch input:checked:after{left:21px;background:var(--ink)}.drawer-export{align-self:stretch;flex-shrink:0;height:48px;min-height:48px;margin-top:24px;font-size:var(--type-button);font-weight:600;line-height:1.35;letter-spacing:.02em}.drawer-feedback{margin:10px 0 0;text-align:center;font-size:var(--type-debug);line-height:1.5;color:var(--gold)}@media (min-width: 641px){:root{--type-label: 14px;--type-control: 14px;--type-button: 14px;--type-hint: 13px;--type-debug: 12px}.start-inner:has(#previewWrap:not([hidden])){flex-direction:row;align-items:center;justify-content:center;gap:72px;max-width:none}.start-inner:has(#previewWrap:not([hidden])) .start-copy{align-items:flex-start;max-width:460px;width:auto;text-align:left}.start-inner:has(#previewWrap:not([hidden])) .start-title{margin-top:0;font-size:46px;line-height:1.28}.start-inner:has(#previewWrap:not([hidden])) .start-sub{margin-top:18px;font-size:16px;line-height:1.9;max-width:none}.start-inner:has(#previewWrap:not([hidden])) .start-btn{width:280px;height:56px;margin-top:36px;font-size:17px}.preview{width:240px;flex:none}.start-cam{bottom:calc(72px + env(safe-area-inset-bottom,0px));gap:8px;font-size:12px}.start-cam-dot{width:5px;height:5px}.start-privacy{bottom:calc(40px + env(safe-area-inset-bottom,0px));font-size:12px}.topbar{top:calc(28px + env(safe-area-inset-top,0px));right:calc(28px + env(safe-area-inset-right,0px))}.icon-btn{width:44px;height:44px}.icon-btn svg{width:20px;height:20px}.ui-dot{top:calc(38px + env(safe-area-inset-top,0px));right:calc(38px + env(safe-area-inset-right,0px))}.guide{bottom:calc(44px + env(safe-area-inset-bottom,0px));gap:16px}.guide-bars{gap:11px}.guide-bar-row{gap:10px}.guide-bar{width:230px;max-width:calc(90vw - 4.8em)}.share{right:calc(28px + env(safe-area-inset-right,0px));bottom:calc(44px + env(safe-area-inset-bottom,0px));width:52px;height:52px}.share svg{width:22px;height:22px}.drawer{top:0;right:0;bottom:0;width:320px;max-width:320px}.drawer-sheet{height:100%;transform:translate(100%);border-right:0;border-radius:0;border-top:0;border-bottom:0;border-left:1px solid var(--line)}.drawer.is-open .drawer-sheet{transform:translate(0)}.drawer-head{padding:18px 12px 18px 24px}.drawer-body{padding:22px 24px 32px}body:has(.drawer.is-open) .topbar{right:calc(348px + env(safe-area-inset-right,0px))}body:has(.drawer.is-open) .ui-dot{right:calc(358px + env(safe-area-inset-right,0px))}body:has(.drawer.is-open) .guide{left:0;right:320px;width:auto;max-width:none;transform:none}body:has(.drawer.is-open) .share{right:calc(348px + env(safe-area-inset-right,0px))}}@media (max-width: 640px){.drawer{left:0;right:0;bottom:0;max-height:calc(50vh - 12px)}.drawer-sheet{max-height:calc(50vh - 12px);transform:translateY(100%);border-bottom:0;border-radius:16px 16px 0 0}.drawer.is-open .drawer-sheet{transform:translateY(0)}.drawer-handle{display:block}}@media (max-width: 640px) and (max-height: 420px){.guide{bottom:calc(36px + env(safe-area-inset-bottom,0px));gap:8px}.guide-bars{gap:6px}.banner{max-width:calc(100vw - 160px)}}@media (prefers-reduced-motion: reduce){*{transition-duration:.01ms!important}}