@font-face{font-family:Inter Variable;font-style:normal;font-display:swap;font-weight:100 900;src:url(/assets/inter-cyrillic-ext-wght-normal-BOeWTOD4.woff2)format("woff2-variations");unicode-range:U+460-52F,U+1C80-1C8A,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F}@font-face{font-family:Inter Variable;font-style:normal;font-display:swap;font-weight:100 900;src:url(/assets/inter-cyrillic-wght-normal-DqGufNeO.woff2)format("woff2-variations");unicode-range:U+301,U+400-45F,U+490-491,U+4B0-4B1,U+2116}@font-face{font-family:Inter Variable;font-style:normal;font-display:swap;font-weight:100 900;src:url(/assets/inter-greek-ext-wght-normal-DlzME5K_.woff2)format("woff2-variations");unicode-range:U+1F??}@font-face{font-family:Inter Variable;font-style:normal;font-display:swap;font-weight:100 900;src:url(/assets/inter-greek-wght-normal-CkhJZR-_.woff2)format("woff2-variations");unicode-range:U+370-377,U+37A-37F,U+384-38A,U+38C,U+38E-3A1,U+3A3-3FF}@font-face{font-family:Inter Variable;font-style:normal;font-display:swap;font-weight:100 900;src:url(/assets/inter-vietnamese-wght-normal-CBcvBZtf.woff2)format("woff2-variations");unicode-range:U+102-103,U+110-111,U+128-129,U+168-169,U+1A0-1A1,U+1AF-1B0,U+300-301,U+303-304,U+308-309,U+323,U+329,U+1EA0-1EF9,U+20AB}@font-face{font-family:Inter Variable;font-style:normal;font-display:swap;font-weight:100 900;src:url(/assets/inter-latin-ext-wght-normal-DO1Apj_S.woff2)format("woff2-variations");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}@font-face{font-family:Inter Variable;font-style:normal;font-display:swap;font-weight:100 900;src:url(/assets/inter-latin-wght-normal-Dx4kXJAl.woff2)format("woff2-variations");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}:root{--canvas:#fbfaf9;--stone:#f2f0ed;--sand:#f6f4ef;--raised:#fff;--hairline:#ebe8e4;--hairline-strong:#d9d5cf;--ink:#121212;--ink-hover:#343433;--on-ink:#fbfaf9;--heading:#343433;--body:#474645;--muted:#6b6a69;--disabled:#b5b2ad;--danger:#ff2b3a;--overlay:#fbfaf9f0;--shadow-float:0 0 24px #00000026;--preview-canvas:#fff;--preview-shadow:0 1px 6px #0000000a;--shadow-raised:0 1px 2px #1212120f, 0 2px 8px #1212120d;--shadow-raised-hover:0 1px 2px #12121214, 0 4px 12px #12121214;--chip:#121212b8;--font-sans:"Inter Variable", Inter, ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;--gutter:32px;--ease:cubic-bezier(.22, 1, .36, 1);--radius-panel:16px;--radius-card:10px;--radius-badge:6px;--ring-gap:2px;--ring-width:2px;--ring-reach:5px;--ring-color:#343433;--focus-color:var(--ink);--z-overlay:10;--z-toast:50;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}:root[data-theme=dark]{--canvas:#161514;--stone:#1f1e1c;--sand:#242321;--raised:#1d1c1a;--hairline:#fff8ec14;--hairline-strong:#fff8ec2e;--ink:#f3f1ed;--ink-hover:#d9d5cf;--on-ink:#121212;--heading:#ece9e4;--body:#cdc9c3;--muted:#8f8b85;--disabled:#5c5955;--danger:#ff5c66;--overlay:#161514f0;--shadow-float:0 0 24px #0006;--preview-shadow:none;--shadow-raised:0 1px 2px #0006, 0 2px 8px #00000040;--shadow-raised-hover:0 1px 2px #00000073, 0 4px 12px #00000059;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--ring-color:#d9d5cf;--focus-color:var(--ink)}*{box-sizing:border-box}html{background:var(--canvas);-webkit-tap-highlight-color:transparent;-webkit-text-size-adjust:100%;min-width:320px}html,body{overscroll-behavior:none}body{background:var(--canvas);color:var(--body);font-family:var(--font-sans);letter-spacing:-.01em;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;margin:0;font-size:14px;overflow:hidden}button,input,select{color:inherit;font:inherit;letter-spacing:inherit}button,select{cursor:pointer}button,a,input,select,label{touch-action:manipulation}button,.frame-card,.add-card{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}button:disabled{cursor:default}button:focus-visible,input:focus-visible,select:focus-visible,a:focus-visible{outline:2px solid var(--focus-color);outline-offset:2px}.app-shell{background:var(--canvas);height:100dvh;min-height:620px;overflow:hidden}.topbar{background:var(--canvas);height:70px;padding:0 var(--gutter);align-items:center;gap:32px;display:flex}.brand{color:var(--ink);letter-spacing:-.02em;white-space:nowrap;align-items:baseline;gap:11px;margin:0;font-size:17px;font-weight:600;text-decoration:none;display:inline-flex}.brand__mark{width:auto;height:24px;display:block}.stats{color:var(--muted);white-space:nowrap;align-items:center;gap:0;font-size:13px;display:flex}.stats span{font-variant-numeric:tabular-nums}.stats span+span:before{color:var(--disabled);content:"/";padding:0 12px}.top-actions{align-items:center;gap:8px;margin-left:auto;display:flex}.button,.theme-toggle{height:38px;transition:background .18s ease, color .18s ease, box-shadow .18s ease, transform .12s var(--ease);border:0;border-radius:9999px;justify-content:center;align-items:center;font-size:13px;font-weight:600;display:inline-flex}.button:active:not(:disabled),.theme-toggle:active:not(:disabled),.icon-button:active:not(:disabled),.add-card:active,.size-control button:active,.frame-delete:active,.toast button:active{transform:scale(.96)}.button{font-variant-numeric:tabular-nums;gap:7px;padding:0 16px 0 14px}.theme-toggle{color:var(--heading);background:0 0;width:38px;padding:0}.theme-icon--sun,:root[data-theme=dark] .theme-icon--moon{display:none}:root[data-theme=dark] .theme-icon--sun{display:block}@media (hover:hover) and (pointer:fine){.theme-toggle:hover:not(:disabled){background:var(--sand)}}.theme-toggle:disabled{color:var(--disabled)}.theme-toggle--raised,.button--secondary{background:var(--raised);box-shadow:var(--shadow-raised);color:var(--heading)}.button--secondary{min-width:102px}@media (hover:hover) and (pointer:fine){.theme-toggle--raised:hover:not(:disabled),.button--secondary:hover:not(:disabled){background:var(--raised);box-shadow:var(--shadow-raised-hover)}.button--danger:hover:not(:disabled){color:var(--danger)}}.button--primary{background:var(--ink);color:var(--on-ink);min-width:104px}@media (hover:hover) and (pointer:fine){.button--primary:hover:not(:disabled){background:var(--ink-hover)}}.button:disabled{background:var(--sand);box-shadow:none;color:var(--disabled)}.workspace{grid-template-rows:minmax(0,1fr) 142px auto;min-width:0;height:calc(max(100dvh,620px) - 70px);min-height:0;display:grid;position:relative}.preview-stage{background:var(--stone);border-radius:var(--radius-panel);margin:20px var(--gutter) 0;isolation:isolate;justify-content:center;align-items:center;min-height:0;padding:24px;display:flex;position:relative;overflow:hidden}.preview-canvas{background:var(--preview-canvas);box-shadow:var(--preview-shadow);border:0;border-radius:0;flex:none;max-width:100%;max-height:100%;position:relative;overflow:hidden}.preview-canvas img{width:100%;height:100%;display:block;position:absolute;inset:0}.empty-state{border-radius:var(--radius-panel);color:var(--muted);text-align:center;background:0 0;border:0;flex-direction:column;justify-content:center;align-items:center;gap:6px;padding:18px;font-size:13px;font-weight:400;display:flex;position:absolute;inset:0}.empty-state:focus-visible{outline-offset:-4px}.empty-state strong{color:var(--heading);letter-spacing:-.015em;font-size:17px;font-weight:500}.empty-state>span:not(.empty-state__cta){color:var(--muted);font-size:13px}.empty-state__cta{background:var(--ink);color:var(--on-ink);height:38px;transition:background .18s ease, transform .12s var(--ease);border-radius:9999px;align-items:center;margin-top:14px;padding:0 18px;font-size:13px;font-weight:600;display:inline-flex}.empty-state:active .empty-state__cta{transform:scale(.96)}@media (hover:hover) and (pointer:fine){.empty-state:hover .empty-state__cta{background:var(--ink-hover)}}.drop-overlay{background:var(--overlay);border-radius:var(--radius-panel);box-shadow:inset 0 0 0 2px var(--ink);pointer-events:none;z-index:var(--z-overlay);flex-direction:column;justify-content:center;align-items:center;gap:14px;display:flex;position:absolute;inset:0}.drop-overlay svg{color:var(--heading)}.drop-overlay strong{color:var(--heading);font-size:19px;font-weight:500}.playback{background:var(--raised);box-shadow:inset 0 0 0 1px var(--hairline);border-radius:9999px;align-self:flex-start;align-items:center;gap:2px;height:36px;padding:3px;display:flex}.icon-button{color:var(--heading);height:30px;transition:background .16s ease, color .16s ease, transform .12s var(--ease);background:0 0;border:0;border-radius:9999px;justify-content:center;align-items:center;width:30px;padding:0;display:flex;position:relative}.icon-button:before{content:"";position:absolute;inset:-5px 0}.play-icon{margin-left:2px}@media (hover:hover) and (pointer:fine){.icon-button:hover:not(:disabled){background:var(--sand)}}.icon-button--primary{background:var(--ink);color:var(--on-ink)}@media (hover:hover) and (pointer:fine){.icon-button--primary:hover:not(:disabled){background:var(--ink-hover)}}.icon-button:disabled{color:var(--disabled)}.icon-button--primary:disabled{background:var(--sand)}.playback-count{color:var(--muted);font-variant-numeric:tabular-nums;white-space:nowrap;justify-content:center;align-items:center;min-width:44px;margin:0 10px 0 6px;font-size:12px;display:flex}.timeline-panel{background:var(--canvas);min-width:0;padding:10px var(--gutter) 0;overflow:hidden}.timeline{background:var(--canvas);height:132px;margin:0 calc(-1 * var(--ring-reach));overscroll-behavior-x:contain;min-width:0;padding:8px var(--ring-reach) 16px;scrollbar-color:var(--hairline-strong) transparent;scrollbar-width:thin;width:calc(100% + 2 * var(--ring-reach));-webkit-overflow-scrolling:touch;gap:10px;display:flex;overflow:auto hidden}.timeline:focus-visible{outline-offset:-2px}.frame-card{background:var(--raised);border-radius:var(--radius-card);cursor:grab;border:0;flex-grow:0;flex-shrink:0;min-width:70px;height:106px;transition:opacity .18s;position:relative}.frame-card:after{border-radius:inherit;box-shadow:inset 0 0 0 1px var(--hairline);content:"";pointer-events:none;transition:box-shadow .16s;position:absolute;inset:0}.selection-ring{fill:none;pointer-events:none;height:100%;stroke:var(--ring-color);stroke-width:var(--ring-width);width:100%;position:absolute;inset:0;overflow:visible}.frame-card.is-dragging{cursor:grabbing;opacity:.5}.frame-card>img{border-radius:inherit;object-fit:contain;pointer-events:none;width:100%;height:100%;display:block}.duration-control{background:var(--chip);border-radius:var(--radius-badge);color:#fff;font-variant-numeric:tabular-nums;align-items:center;height:24px;padding:0 7px;font-size:11px;font-weight:500;display:flex;position:absolute;bottom:7px;left:7px}.duration-control input{appearance:textfield;color:inherit;field-sizing:content;font-variant-numeric:tabular-nums;text-align:right;background:0 0;border:0;min-width:3ch;padding:0;font-size:11px;font-weight:500}.duration-control input::-webkit-inner-spin-button{display:none}.duration-control span{font-size:11px}.frame-delete{background:var(--chip);color:#fff;height:28px;transition:opacity .16s ease, background .16s ease, transform .12s var(--ease);border:0;border-radius:9999px;justify-content:center;align-items:center;width:28px;padding:0;display:flex;position:absolute;top:7px;right:7px}.frame-delete:before{content:"";position:absolute;inset:-6px}@media (hover:hover) and (pointer:fine){.frame-delete{opacity:0}.frame-card:hover .frame-delete,.frame-card:focus-within .frame-delete{opacity:1}.frame-delete:hover{background:var(--danger)}}.add-card{background:var(--sand);border-radius:var(--radius-card);box-shadow:inset 0 0 0 1px var(--hairline);color:var(--muted);height:106px;transition:background .16s ease, color .16s ease, transform .12s var(--ease);border:0;flex:0 0 52px;justify-content:center;align-items:center;padding:0;display:flex}@media (hover:hover) and (pointer:fine){.add-card:hover{background:var(--stone);color:var(--heading)}}.timeline-placeholder{border-radius:var(--radius-card);box-shadow:inset 0 0 0 1px var(--hairline);color:var(--muted);flex:1 0 auto;justify-content:center;align-items:center;height:106px;margin:0;font-size:13px;display:flex}.settings-strip{background:var(--canvas);margin:0 var(--gutter);flex-wrap:wrap;align-items:end;gap:12px 18px;min-width:0;padding:14px 0 18px;display:flex;overflow:visible}.compact-control{flex-direction:column;flex:0 0 96px;align-items:stretch;gap:6px;min-width:0;display:flex}.compact-control>span:not(.select-field):not(.number-field){color:var(--muted);font-size:12px;font-weight:500}.compact-control select{appearance:none;background:var(--raised);border-radius:var(--radius-card);box-shadow:inset 0 0 0 1px var(--hairline);color:var(--heading);border:0;align-items:center;width:100%;min-width:0;height:36px;padding:0 32px 0 12px;font-size:13px;font-weight:500;transition:box-shadow .16s;display:flex}.playback-control{flex-basis:184px}.select-field,.number-field{min-width:0;height:36px;display:block;position:relative}.select-field svg{color:var(--muted);pointer-events:none;position:absolute;top:50%;right:12px;transform:translateY(-50%)}.number-field{background:var(--raised);border-radius:var(--radius-card);box-shadow:inset 0 0 0 1px var(--hairline);color:var(--heading);align-items:center;transition:box-shadow .16s;display:flex}@media (hover:hover) and (pointer:fine){.number-field:hover{box-shadow:inset 0 0 0 1px var(--hairline-strong)}}.number-field:focus-within{box-shadow:inset 0 0 0 1px var(--hairline-strong)}.number-field:has(input:focus-visible){outline:2px solid var(--focus-color);outline-offset:2px}.number-field input{appearance:textfield;color:var(--heading);font-variant-numeric:tabular-nums;background:0 0;border:0;outline:0;width:100%;min-width:0;height:100%;padding:0 4px 0 12px;font-size:13px;font-weight:500}.number-field input::-webkit-inner-spin-button{display:none}.number-field input::-webkit-outer-spin-button{display:none}.number-field i{color:var(--muted);padding-right:12px;font-size:13px;font-style:normal}@media (hover:hover) and (pointer:fine){.compact-control select:hover,.size-control input:hover,.size-control button:hover{box-shadow:inset 0 0 0 1px var(--hairline-strong)}.size-control button:hover{background:var(--sand)}}.size-control>div{align-items:center;gap:6px;display:flex}.size-control{flex-basis:194px}.size-control input{appearance:textfield;background:var(--raised);border-radius:var(--radius-card);box-shadow:inset 0 0 0 1px var(--hairline);color:var(--heading);font-variant-numeric:tabular-nums;text-align:center;border:0;width:62px;min-width:0;height:36px;padding:0 4px;font-size:13px;font-weight:500;transition:box-shadow .16s}.size-control input::-webkit-inner-spin-button{display:none}.size-control i{color:var(--muted);font-size:13px;font-style:normal}.size-control button{box-shadow:inset 0 0 0 1px var(--hairline);color:var(--heading);height:36px;transition:box-shadow .16s ease, background .16s ease, transform .12s var(--ease);background:0 0;border:0;border-radius:9999px;flex:none;justify-content:center;align-items:center;width:36px;padding:0;display:flex;position:relative}.size-control button:before{content:"";position:absolute;inset:-4px}.spinner{border:2px solid;border-right-color:#0000;border-radius:50%;width:13px;height:13px;animation:.7s linear infinite spin;display:inline-block}.countdown{width:14px;height:14px;transform:rotate(-90deg)}.countdown circle{fill:none;stroke:currentColor;stroke-width:2px}.countdown__track{opacity:.18}.countdown__bar{stroke-dasharray:1;stroke-linecap:round;animation:linear forwards countdown}.button:focus-visible .countdown__bar{animation-play-state:paused}@keyframes countdown{to{stroke-dashoffset:1px}}.file-input{display:none}.sr-only{clip-path:inset(50%);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.toasts{pointer-events:none;width:max-content;z-index:var(--z-toast);flex-direction:column;align-items:center;gap:8px;display:flex;position:fixed;top:84px;left:50%;transform:translate(-50%)}.toast{background:var(--ink);border-radius:var(--radius-card);box-shadow:var(--shadow-float);color:var(--on-ink);pointer-events:auto;align-items:center;gap:10px;width:max-content;max-width:calc(100vw - 30px);padding:8px 8px 8px 14px;font-size:13px;display:flex}.toast:before{background:var(--danger);content:"";border-radius:9999px;flex:0 0 8px;height:8px}.toast>span{flex:auto;margin-right:4px}.toast button{color:inherit;height:28px;transition:background .16s ease, transform .12s var(--ease);background:0 0;border:0;border-radius:9999px;flex:none;justify-content:center;align-items:center;width:28px;padding:0;display:flex;position:relative}.toast button:before{content:"";position:absolute;inset:-8px}.toast button:focus-visible{outline-color:var(--on-ink)}@media (hover:hover) and (pointer:fine){.toast button:hover{background:color-mix(in srgb, var(--on-ink) 14%, transparent)}}@keyframes spin{to{transform:rotate(360deg)}}@supports (corner-shape:squircle){:root{--radius-panel:24px;--radius-card:16px;--radius-badge:9px}.preview-stage,.empty-state,.drop-overlay,.frame-card,.frame-card:after,.frame-card>img,.duration-control,.add-card,.timeline-placeholder,.compact-control select,.number-field,.size-control input,.toast{corner-shape:squircle}}@media (height<=619px){body{overflow:auto}.app-shell{overflow:visible}}@media (pointer:coarse){.duration-control input,.number-field input,.size-control input,.compact-control select{font-size:16px}.duration-control{height:32px}.duration-control span{font-size:13px}.compact-control select,.select-field,.number-field,.size-control input,.playback{height:40px}.icon-button{width:34px;height:34px}.icon-button:before{inset:-5px -1px}.size-control button{width:40px;height:40px}.frame-delete:before{inset:-8px}.button:before,.theme-toggle:before{content:"";position:absolute;inset:-3px}.button,.theme-toggle{position:relative}}@media (width<=980px){:root{--gutter:20px}.topbar{gap:22px}.stats span:nth-child(2){display:none}.stats span:nth-child(3):before{padding-left:0}.settings-strip{column-gap:12px}}@media (width<=760px){body{overflow:auto}.app-shell{height:auto;min-height:100dvh;overflow:visible}.topbar{height:64px;padding:0 var(--gutter)}.stats{display:none}.workspace{height:auto;min-height:0;display:block}.preview-stage{height:min(66svh,620px);min-height:390px;margin-top:16px;padding:20px}.timeline-panel{padding-top:18px}.settings-strip{grid-template-columns:repeat(3,minmax(0,1fr));align-items:stretch;gap:18px 12px;margin-top:10px;padding:20px 0 28px;display:grid;overflow:visible}.playback-control{grid-column:span 2;align-self:stretch}.compact-control{flex-basis:auto}.size-control{grid-column:span 2}.size-control input{flex:1}}@media (width<=520px){.topbar{gap:12px;padding-left:12px;padding-right:12px}.button--primary,.button--secondary{gap:0;width:38px;min-width:38px;padding:0;font-size:0}.preview-stage{min-height:360px;margin-left:12px;margin-right:12px;padding:16px}.empty-state{padding:14px}.timeline-panel{padding-left:12px;padding-right:12px}.settings-strip{grid-template-columns:repeat(2,minmax(0,1fr));margin-left:12px;margin-right:12px}}@media (prefers-reduced-motion:reduce){.button:active:not(:disabled),.theme-toggle:active:not(:disabled),.icon-button:active:not(:disabled),.add-card:active,.size-control button:active,.frame-delete:active,.toast button:active{transform:none}.spinner{animation-duration:1.6s}}.no-transitions,.no-transitions *{transition:none!important}.credits{color:var(--muted);align-self:end;margin:0 0 8px auto;font-size:12px;line-height:1.4}.credits span{white-space:nowrap}.credits a{color:inherit;text-decoration:underline;-webkit-text-decoration-color:var(--hairline-strong);text-decoration-color:var(--hairline-strong);text-underline-offset:2px;transition:color .16s,text-decoration-color .16s}@media (hover:hover) and (pointer:fine){.credits a:hover{color:var(--body);text-decoration-color:currentColor}}