@font-face{font-family:DM Sans;font-style:normal;font-weight:400 700;font-display:swap;src:url(/fonts/dm-sans-latin.woff2)format("woff2");unicode-range:U+??,U+131,U+152-153,U+2BB-2BC,U+2C6,U+2DA,U+2DC,U+304,U+308,U+329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:DM Sans;font-style:normal;font-weight:400 700;font-display:swap;src:url(/fonts/dm-sans-latin-ext.woff2)format("woff2");unicode-range:U+100-2BA,U+2BD-2C5,U+2C7-2CC,U+2CE-2D7,U+2DD-2FF,U+304,U+308,U+329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}:root{--ink:#191819;--surface:#f2f2f2;--line:#e2e2e2;--muted:#919191;--muted-2:#6b6b6b;--sub:#878787;--placeholder:#a29fa2;--track:#b3b3b3;font-optical-sizing:auto;color:var(--ink);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:DM Sans,system-ui,sans-serif}*{box-sizing:border-box}html,body,#root{height:100%}body{background:#fff;margin:0}button{font-family:inherit}.cp{display:flex;position:relative}.cp .swatch{appearance:none;padding:0}.cp .swatch:disabled{opacity:.4;cursor:not-allowed}.cp__pop{z-index:20;border:1px solid var(--ink);background:#fff;border-radius:4px;flex-direction:column;gap:8px;width:200px;padding:8px;display:flex;position:absolute;top:calc(100% + 8px);right:0;box-shadow:0 8px 24px #00000026}.cp__opt{border:1px solid var(--line);letter-spacing:.5px;text-transform:uppercase;color:var(--ink);cursor:pointer;background:0 0;border-radius:4px;align-items:center;gap:8px;padding:8px;font-size:14px;display:flex}.cp__opt.is-active{border-color:var(--ink)}.cp__hex{border:1px solid var(--ink);border-radius:4px;align-items:center;gap:6px;padding:8px 12px;display:flex}.cp__hash{color:var(--muted-2)}.cp__hex input{width:100%;font:inherit;letter-spacing:1px;text-transform:uppercase;color:var(--ink);background:0 0;border:none;outline:none}.cp__visual{border:1px solid var(--line);cursor:pointer;background:0 0;border-radius:4px;width:100%;height:32px;padding:0}.dual{cursor:pointer;touch-action:none;width:min(363px,100%);height:12px;position:relative}.dual-track,.dual-fill,.dual-playhead{pointer-events:none}.dual-playhead{border:2px solid var(--ink);box-sizing:border-box;background:#ff3b30;border-radius:6px;width:12px;height:12px;position:absolute;top:50%;transform:translate(-50%,-50%)}.dual-track,.dual-fill{border-radius:500px;height:6px;position:absolute;top:50%;transform:translateY(-50%)}.dual-track{background:var(--track);left:0;right:0}.dual-fill{background:var(--ink)}.dual-thumb{pointer-events:none;appearance:none;background:0 0;width:100%;height:100%;margin:0;position:absolute;top:0;left:0}.dual-thumb::-webkit-slider-thumb{pointer-events:auto;appearance:none;border:2px solid var(--ink);box-sizing:border-box;cursor:pointer;background:#fff;border-radius:6px;width:12px;height:12px}.dual-thumb::-moz-range-thumb{pointer-events:auto;border:2px solid var(--ink);box-sizing:border-box;cursor:pointer;background:#fff;border-radius:6px;width:12px;height:12px}.dual-thumb:focus-visible::-webkit-slider-thumb{outline:2px solid var(--ink);outline-offset:2px}.dual-thumb:focus-visible::-moz-range-thumb{outline:2px solid var(--ink);outline-offset:2px}.app{background:#fff;gap:8px;height:100vh;padding:8px;display:flex;overflow:hidden}.recorder{background:var(--surface);border-radius:8px;flex-direction:column;flex:1;justify-content:center;align-items:center;gap:24px;min-width:0;padding:10px;display:flex;position:relative;overflow:hidden}.panel{background:var(--surface);border-radius:8px;flex-direction:column;flex-shrink:0;justify-content:space-between;width:484px;padding:16px;display:flex;overflow:hidden}.recorder__feedback{text-transform:uppercase;color:var(--ink);font-size:12px;line-height:1.4;text-decoration:none;position:absolute;top:12px;left:10px}.recorder__footer{text-transform:uppercase;justify-content:space-between;display:flex;position:absolute;bottom:12px;left:10px;right:10px}.recorder__footer p{color:var(--muted);margin:0;font-size:12px;line-height:1.4}.recorder__footer a{color:var(--ink);text-decoration:none}.hero{text-align:center;flex-direction:column;align-items:center;gap:64px;display:flex}.hero__heading{text-transform:uppercase;flex-direction:column;align-items:center;gap:10px;display:flex}@property --grad-angle{syntax:"<angle>";inherits:false;initial-value:0deg}.hero__title{letter-spacing:-2.88px;background:linear-gradient(var(--grad-angle), #191819 0%, #ff6b6b 25%, #4a9eff 50%, #9b5de5 75%, #191819 100%);color:#0000;-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;margin:0;font-size:32px;font-weight:700;line-height:1.4;animation:6s linear infinite grad-spin}@keyframes grad-spin{to{--grad-angle:360deg}}@media (prefers-reduced-motion:reduce){.hero__title{animation:none}}.hero__sub{color:var(--sub);margin:0;font-size:16px;font-weight:500;line-height:1.4}.hero__record{flex-direction:column;align-items:center;gap:12px;display:flex}.live-dot{background:#ff3b30;border-radius:50%;width:10px;height:10px;animation:1.2s ease-in-out infinite live-pulse}@keyframes live-pulse{0%,to{opacity:1;box-shadow:0 0 #ff3b3080}50%{opacity:.5;box-shadow:0 0 0 6px #ff3b3000}}@media (prefers-reduced-motion:reduce){.live-dot{animation:none}}.hero__timer{font-variant-numeric:tabular-nums;color:var(--ink);margin:0;font-size:20px;font-weight:600;line-height:1.4}.panel__content{flex-direction:column;gap:16px;width:100%;display:flex}.accordion{border-bottom:1px solid var(--line);flex-direction:column;width:100%;padding:16px 0;display:flex}.accordion.is-open{gap:16px}.accordion__header{cursor:pointer;background:0 0;border:none;justify-content:space-between;align-items:center;width:100%;padding:0;display:flex}.accordion__title{text-transform:uppercase;color:var(--ink);font-size:16px;font-weight:600;line-height:1.4}.chevron{transition:transform .2s}.chevron--open{transform:rotate(180deg)}.btn{height:40px;color:var(--ink);border:1px solid var(--ink);letter-spacing:.64px;text-transform:uppercase;white-space:nowrap;cursor:pointer;background:0 0;border-radius:4px;align-items:center;gap:8px;padding:8px 16px;font-size:16px;line-height:normal;transition:background .15s;display:inline-flex}.btn:hover:not(:disabled){background:#1918190f}.btn:disabled{opacity:.4;cursor:not-allowed}.btn--solid{background:var(--ink);color:#fff}.btn--solid:hover:not(:disabled){background:#000}.btn--hero{height:auto;padding:16px 24px}.actions{gap:16px;display:flex}.panel__actions{justify-content:space-between;align-items:center;width:100%;display:flex}.section-body{border:none;flex-direction:column;gap:16px;width:100%;min-width:0;margin:0;padding:0;display:flex}.section-body:disabled{opacity:.4}.field{width:100%;height:40px;color:var(--ink);border:1px solid var(--ink);letter-spacing:.64px;text-transform:uppercase;background:0 0;border-radius:4px;justify-content:space-between;align-items:center;gap:8px;padding:8px 16px;font-size:16px;line-height:normal;display:flex}.field[aria-disabled]{opacity:.4}.field--select{appearance:none;cursor:pointer;background-image:url("data:image/svg+xml,%3Csvg width='12' height='6' viewBox='0 0 12 6' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1l5 4 5-4' stroke='%23191819' stroke-width='1.5'/%3E%3C/svg%3E");background-position:right 16px center;background-repeat:no-repeat;padding-right:40px}.field--select:disabled{cursor:not-allowed}.field--check{cursor:pointer;justify-content:flex-start}.field--check input{width:18px;height:18px;accent-color:var(--ink);cursor:pointer;margin:0}.muted{color:var(--placeholder)}.row{gap:8px;width:100%;display:flex}.row .field{flex:1;width:auto;min-width:0}.row .field--res{flex:0 0 158px}.segment{border:1px solid var(--ink);border-radius:4px;gap:16px;width:100%;height:56px;padding:8px;display:flex}.segment.is-disabled{opacity:.4}.segment__item{min-width:0;color:var(--ink);letter-spacing:.64px;text-transform:uppercase;cursor:pointer;background:0 0;border:none;border-radius:4px;flex:1;justify-content:center;align-items:center;padding:8px 16px;font-size:16px;display:flex}.segment__item--active{background:var(--ink);color:#fff}.swatch{border:1px solid var(--ink);cursor:pointer;border-radius:50%;flex-shrink:0;width:21px;height:21px;position:relative;overflow:hidden}.swatch input[type=color]{opacity:0;cursor:pointer;border:none;width:100%;height:100%;padding:0;position:absolute;inset:0}.swatch--checker,.stage.checker{background-color:#fff;background-image:linear-gradient(45deg,#ccc 25%,#0000 25%),linear-gradient(-45deg,#ccc 25%,#0000 25%),linear-gradient(45deg,#0000 75%,#ccc 75%),linear-gradient(-45deg,#0000 75%,#ccc 75%)}.swatch--checker{background-position:0 0,0 4px,4px -4px,-4px 0;background-size:8px 8px}.source{display:none}.stage{background:#000;border-radius:8px;justify-content:center;align-items:center;max-width:min(728px,100%);display:flex;position:relative;overflow:hidden}.stage.clickable{cursor:pointer}.stage.checker{background-position:0 0,0 8px,8px -8px,-8px 0;background-size:16px 16px}.preview{width:auto;max-width:100%;height:auto;max-height:calc(100vh - 220px);display:block}.play-overlay{color:#ffffffd9;pointer-events:none;justify-content:center;align-items:center;font-size:48px;display:flex;position:absolute;inset:0}.stage__overlay{color:#fff;letter-spacing:.5px;text-align:center;background:#0000008c;justify-content:center;align-items:center;padding:16px;font-size:18px;display:flex;position:absolute;inset:0}.crop-layer{position:absolute;inset:0}.crop-layer.active{cursor:crosshair}.crop-rect{border:2px solid #fff;position:absolute;box-shadow:0 0 0 9999px #0006}.handle{border:2px solid var(--ink);box-sizing:border-box;background:#fff;border-radius:3px;width:12px;height:12px;position:absolute}.handle.nw{top:-6px;left:-6px}.handle.ne{top:-6px;right:-6px}.handle.sw{bottom:-6px;left:-6px}.handle.se{bottom:-6px;right:-6px}.timeline-row{align-items:center;gap:12px;width:min(728px,100%);display:flex}.timeline-row .dual{flex:1;width:auto}.crop-tools{flex-shrink:0;gap:8px;display:flex}.crop-btn{color:#000;border:1px solid var(--ink);cursor:pointer;background:#fff;border-radius:50%;justify-content:center;align-items:center;width:40px;height:40px;padding:0;display:inline-flex}.crop-btn:hover:not(:disabled){background:#1918190f}.crop-btn:disabled{opacity:.4;cursor:not-allowed}.estimate{text-transform:uppercase;color:var(--muted-2);text-align:center;margin:0;font-size:16px;line-height:1.4}.export-error{color:#b00020;text-align:center;margin:0 0 12px;font-size:14px;line-height:1.4}