*,*:before,*:after{box-sizing:border-box}*{margin:0}html{interpolate-size:allow-keywords}body{line-height:1.5;-webkit-font-smoothing:antialiased}img,picture,video,canvas,svg{display:block;max-width:100%}input,button,textarea,select{font:inherit}p{overflow-wrap:break-word;text-wrap:pretty}h1,h2,h3,h4,h5,h6{overflow-wrap:break-word;text-wrap:balance}#root,#app{isolation:isolate}@font-face{font-family:"Baloo 2";font-style:normal;font-display:swap;font-weight:700;src:url(/assets/baloo-2-latin-700-normal-CqTg7A15.woff2) format("woff2"),url(/assets/baloo-2-latin-700-normal-Ld3Zm3l2.woff) format("woff")}@font-face{font-family:"Baloo 2";font-style:normal;font-display:swap;font-weight:800;src:url(/assets/baloo-2-latin-800-normal-BbF3Etk1.woff2) format("woff2"),url(/assets/baloo-2-latin-800-normal-B8BXfZF7.woff) format("woff")}@font-face{font-family:Orbitron;font-style:normal;font-display:swap;font-weight:700;src:url(/assets/orbitron-latin-700-normal-4jsRXGGJ.woff2) format("woff2"),url(/assets/orbitron-latin-700-normal-DmYOh-W9.woff) format("woff")}@font-face{font-family:Space Mono;font-style:normal;font-display:swap;font-weight:700;src:url(/assets/space-mono-latin-700-normal-mWgeinG7.woff2) format("woff2"),url(/assets/space-mono-latin-700-normal-D7A851RN.woff) format("woff")}@font-face{font-family:"Press Start 2P";font-style:normal;font-display:swap;font-weight:400;src:url(/assets/press-start-2p-latin-400-normal-_wFEWmAB.woff2) format("woff2"),url(/assets/press-start-2p-latin-400-normal-KLytu4cr.woff) format("woff")}@font-face{font-family:Bebas Neue;font-style:normal;font-display:swap;font-weight:400;src:url(/assets/bebas-neue-latin-400-normal-9mHNbWWO.woff2) format("woff2"),url(/assets/bebas-neue-latin-400-normal-Bi-ndsyu.woff) format("woff")}@font-face{font-family:Permanent Marker;font-style:normal;font-display:swap;font-weight:400;src:url(/assets/permanent-marker-latin-400-normal-BF23djCy.woff2) format("woff2"),url(/assets/permanent-marker-latin-400-normal-BnZj5c41.woff) format("woff")}:root{font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Open Sans,Helvetica Neue,sans-serif;color-scheme:light dark;--font-display: "Baloo 2", system-ui, -apple-system, BlinkMacSystemFont, sans-serif;--color-bg: #ffffff;--color-surface: #ffffff;--color-text: #17182b;--color-text-muted: #5c5f78;--color-border: #17182b;--color-accent: #ff2e63;--color-accent-contrast: #ffffff;--color-secondary: #2f6fed;--color-yellow: #ffce3d;--color-danger: #ff5a36;--radius: 20px;--radius-sm: 12px;--border-width: 3px;--shadow-soft: 4px 4px 0 var(--color-border);--shadow-soft-sm: 3px 3px 0 var(--color-border);--shadow-lift: 6px 6px 0 var(--color-border);--shadow-press: 1px 1px 0 var(--color-border);--ease-bounce: cubic-bezier(.34, 1.56, .64, 1)}@media(prefers-color-scheme:dark){:root{--color-bg: #14162b;--color-surface: #1d2044;--color-text: #f5f4ff;--color-text-muted: #b6b9dd;--color-border: #f5f4ff;--color-accent: #ff5c86;--color-accent-contrast: #14162b;--color-secondary: #6f9bff;--color-yellow: #ffd85c;--color-danger: #ff7a57;--shadow-soft: 4px 4px 0 rgba(0, 0, 0, .55);--shadow-soft-sm: 3px 3px 0 rgba(0, 0, 0, .55);--shadow-lift: 6px 6px 0 rgba(0, 0, 0, .55);--shadow-press: 1px 1px 0 rgba(0, 0, 0, .55)}}body{min-height:100dvh;background-color:var(--color-bg);color:var(--color-text)}.page{max-width:80ch;margin-inline:auto;padding:2rem}.gif-maker{max-width:640px;display:flex;flex-direction:column;gap:2rem;padding-block:3rem}.gif-maker__header{text-align:center;display:flex;flex-direction:column;gap:.5rem}.wordmark{font-family:var(--font-display);font-size:clamp(2.75rem,9vw,3.75rem);font-weight:800;letter-spacing:-.01em}.wordmark__accent{color:var(--color-accent)}.gif-maker__tagline{color:var(--color-text-muted);font-size:1rem;font-weight:500}.gif-maker__hint{color:var(--color-text-muted);font-size:.875rem;text-align:center}.gif-maker__error{color:var(--color-danger);font-size:.9rem;font-weight:600;text-align:center}.gif-maker__generate{align-self:center;padding:.9rem 2.5rem;font-family:var(--font-display);font-size:1.1rem;font-weight:700;color:var(--color-accent-contrast);background-color:var(--color-accent);border:var(--border-width) solid var(--color-border);border-radius:var(--radius);box-shadow:var(--shadow-soft);cursor:pointer;transition:transform .2s var(--ease-bounce),box-shadow .2s var(--ease-bounce),opacity .15s ease-out}.gif-maker__generate:not(:disabled):hover{transform:translate(-2px,-2px);box-shadow:var(--shadow-lift)}.gif-maker__generate:not(:disabled):active{transform:translate(2px,2px);box-shadow:var(--shadow-press)}.gif-maker__generate:disabled{opacity:.45;cursor:not-allowed}.uploader__dropzone{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.375rem;padding:2.75rem 1.5rem;border:var(--border-width) dashed var(--color-border);border-radius:var(--radius);background-color:var(--color-surface);text-align:center;cursor:pointer;transition:border-color .2s var(--ease-bounce),transform .2s var(--ease-bounce),box-shadow .2s var(--ease-bounce)}.uploader__dropzone:hover{border-color:var(--color-accent);transform:translate(-2px,-2px);box-shadow:var(--shadow-soft)}.uploader__title{font-family:var(--font-display);font-weight:700;font-size:1.15rem}.uploader__hint{color:var(--color-text-muted);font-size:.9rem}.uploader__input{position:absolute;width:1px;height:1px;opacity:0;overflow:hidden}.preview{position:relative;display:flex;align-items:center;justify-content:center;height:320px;container-type:size;animation:pop-in .32s var(--ease-bounce)}.preview__image{width:100%;height:100%;border-radius:var(--radius);border:var(--border-width) solid var(--color-border);box-shadow:var(--shadow-soft);overflow:hidden}.preview__text-overlay,.text-overlay__marker{position:absolute;max-width:90%;transform:translate(-50%,-50%);font-weight:700;text-align:center;line-height:1.15;white-space:pre-wrap;text-shadow:0 1px 3px rgba(0,0,0,.85),0 0 8px rgba(0,0,0,.5);pointer-events:none}.frame-strip{display:flex;flex-wrap:wrap;gap:.75rem;list-style:none;padding:0;animation:pop-in .32s var(--ease-bounce)}.frame-strip__item{position:relative;display:flex;flex-direction:column;align-items:center;gap:.375rem;padding:.5rem;background-color:var(--color-surface);border:var(--border-width) solid var(--color-border);border-radius:var(--radius-sm);box-shadow:var(--shadow-soft-sm);cursor:grab;transition:opacity .15s ease-out,box-shadow .2s var(--ease-bounce),transform .2s var(--ease-bounce)}.frame-strip__item:hover{transform:translate(-1px,-1px)}.frame-strip__item--dragging{opacity:.4}.frame-strip__item--drag-over{box-shadow:0 0 0 3px var(--color-accent),var(--shadow-soft-sm)}.frame-strip__item--active{box-shadow:0 0 0 3px var(--color-accent),var(--shadow-lift);transform:translate(-1px,-1px)}.frame-strip__editing-badge{position:absolute;bottom:-.55rem;left:50%;transform:translate(-50%);padding:.1rem .5rem;font-family:var(--font-display);font-size:.65rem;font-weight:700;letter-spacing:.02em;color:var(--color-accent-contrast);background-color:var(--color-accent);border-radius:999px;white-space:nowrap;z-index:1}.frame-strip__grip{position:absolute;top:.25rem;right:.25rem;font-size:.8rem;line-height:1;color:var(--color-text-muted)}.frame-strip__index{position:absolute;top:.25rem;left:.25rem;min-width:1.35rem;padding:0 .3rem;font-family:var(--font-display);font-size:.7rem;font-weight:700;line-height:1.35rem;text-align:center;color:#fff;background-color:var(--color-secondary);border-radius:999px}.frame-strip__thumb-button{padding:0;border:none;background:none;cursor:pointer;border-radius:var(--radius-sm)}.frame-strip__thumb-button:focus-visible{outline:2px solid var(--color-accent);outline-offset:2px}.frame-strip__thumb{position:relative;width:84px;height:84px;overflow:hidden;object-fit:cover;border-radius:var(--radius-sm)}.frame-strip__controls{display:flex;gap:.25rem}.frame-strip__controls button{min-width:1.85rem;padding:.15rem .4rem;font-size:.9rem;font-weight:700;color:var(--color-text);background:none;border:2px solid var(--color-border);border-radius:var(--radius-sm);cursor:pointer;transition:background-color .15s ease-out,transform .2s var(--ease-bounce)}.frame-strip__controls button:hover:not(:disabled){background-color:var(--color-bg);transform:translateY(-1px)}.frame-strip__controls button:disabled{opacity:.35;cursor:not-allowed}.frame-strip__remove{color:var(--color-danger)}.frame-editor{display:flex;flex-direction:column;gap:.75rem;animation:pop-in .32s var(--ease-bounce)}.frame-editor__heading{display:flex;align-items:baseline;justify-content:space-between;gap:.75rem}.frame-editor__title{margin:0;font-family:var(--font-display);font-size:1.15rem;font-weight:800}.frame-editor__frame-badge{color:var(--color-text-muted);font-size:.85rem;font-weight:600;white-space:nowrap}.frame-editor__tabs{display:flex;gap:.5rem;flex-wrap:wrap}.frame-editor__tab{position:relative;padding:.55rem 1.1rem;font-family:var(--font-display);font-size:.9rem;font-weight:700;color:var(--color-text);background-color:var(--color-surface);border:var(--border-width) solid var(--color-border);border-radius:var(--radius);box-shadow:var(--shadow-soft-sm);cursor:pointer;transition:transform .2s var(--ease-bounce),box-shadow .2s var(--ease-bounce),background-color .15s ease-out,color .15s ease-out}.frame-editor__tab:hover{transform:translate(-1px,-1px);box-shadow:var(--shadow-lift)}.frame-editor__tab--active{color:var(--color-accent-contrast);background-color:var(--color-accent)}.frame-editor__tab-dot{display:inline-block;width:6px;height:6px;margin-left:.4rem;background-color:currentColor;border-radius:50%;vertical-align:middle}.frame-editor__panel{animation:pop-in .25s var(--ease-bounce)}.frame-crop{display:flex;flex-direction:column;gap:.6rem;padding:1rem;background-color:var(--color-surface);border:var(--border-width) solid var(--color-border);border-radius:var(--radius);box-shadow:var(--shadow-soft);animation:pop-in .32s var(--ease-bounce)}.frame-crop__title{margin:0;font-family:var(--font-display);font-size:.9rem;font-weight:700;color:var(--color-text-muted);text-transform:uppercase;letter-spacing:.04em}.frame-crop__row{display:flex;flex-direction:column;gap:.375rem;font-size:.9rem}.frame-crop__row select{padding:.5rem .6rem;font:inherit;color:var(--color-text);background-color:var(--color-surface);border:2px solid var(--color-border);border-radius:var(--radius-sm)}.frame-crop__stage{position:relative;display:flex;align-items:center;justify-content:center;height:210px;overflow:hidden;background-color:var(--color-bg);border:var(--border-width) solid var(--color-border);border-radius:var(--radius-sm)}.frame-crop__stage-image{width:100%;height:100%;object-fit:contain;-webkit-user-select:none;user-select:none;-webkit-user-drag:none}.frame-crop__rect{position:absolute;box-shadow:0 0 0 9999px #14162b8c;border:2px dashed #ffffff;cursor:move;touch-action:none}.frame-crop__handle{position:absolute;width:18px;height:18px;background-color:var(--color-accent);border:2px solid #ffffff;border-radius:50%;touch-action:none}.frame-crop__handle--nw{top:-10px;left:-10px;cursor:nwse-resize}.frame-crop__handle--ne{top:-10px;right:-10px;cursor:nesw-resize}.frame-crop__handle--sw{bottom:-10px;left:-10px;cursor:nesw-resize}.frame-crop__handle--se{bottom:-10px;right:-10px;cursor:nwse-resize}.frame-crop__hint{margin:0;color:var(--color-text-muted);font-size:.8rem}.frame-effects{display:flex;flex-direction:column;gap:.6rem;padding:1rem;background-color:var(--color-surface);border:var(--border-width) solid var(--color-border);border-radius:var(--radius);box-shadow:var(--shadow-soft);animation:pop-in .32s var(--ease-bounce)}.frame-effects__title{margin:0;font-family:var(--font-display);font-size:.9rem;font-weight:700;color:var(--color-text-muted);text-transform:uppercase;letter-spacing:.04em}.frame-effects__row{display:flex;flex-direction:column;gap:.375rem;font-size:.85rem}.frame-effects__row--checkbox{flex-direction:row;align-items:center;gap:.5rem}.frame-effects__row select{padding:.5rem .6rem;font:inherit;color:var(--color-text);background-color:var(--color-surface);border:2px solid var(--color-border);border-radius:var(--radius-sm)}.frame-effects__stage{position:relative;display:flex;align-items:center;justify-content:center;height:190px;overflow:hidden;background-color:var(--color-bg);border:var(--border-width) solid var(--color-border);border-radius:var(--radius-sm)}.frame-effects__stage-image{width:100%;height:100%}.frame-effects__group{display:flex;flex-direction:column;gap:.5rem;padding-top:.6rem;border-top:2px dashed var(--color-border)}.frame-effects__group-title{margin:0;font-family:var(--font-display);font-size:.8rem;font-weight:700;color:var(--color-text-muted);text-transform:uppercase;letter-spacing:.04em}.frame-effects__grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(110px,1fr));gap:.5rem 1rem}.frame-effects__value{color:var(--color-text-muted);font-size:.75rem}.frame-effects__checkboxes{display:flex;flex-wrap:wrap;gap:1.25rem}.frame-effects__actions{display:flex;flex-wrap:wrap;gap:.75rem}.frame-effects__reset,.frame-effects__apply-all{padding:.6rem 1.2rem;font-family:var(--font-display);font-size:.9rem;font-weight:700;color:var(--color-accent);background:var(--color-surface);border:2px solid var(--color-accent);border-radius:var(--radius);box-shadow:var(--shadow-soft-sm);cursor:pointer;transition:transform .2s var(--ease-bounce),box-shadow .2s var(--ease-bounce)}.frame-effects__reset:hover:not(:disabled),.frame-effects__apply-all:hover:not(:disabled){transform:translate(-2px,-2px);box-shadow:var(--shadow-lift)}.frame-effects__reset:active:not(:disabled),.frame-effects__apply-all:active:not(:disabled){transform:translate(1px,1px);box-shadow:var(--shadow-press)}.frame-effects__reset:disabled,.frame-effects__apply-all:disabled{opacity:.4;cursor:not-allowed}.text-overlay{display:flex;flex-direction:column;gap:.6rem;padding:1rem;background-color:var(--color-surface);border:var(--border-width) solid var(--color-border);border-radius:var(--radius);box-shadow:var(--shadow-soft);animation:pop-in .32s var(--ease-bounce)}.text-overlay__title{margin:0;font-family:var(--font-display);font-size:.9rem;font-weight:700;color:var(--color-text-muted);text-transform:uppercase;letter-spacing:.04em}.text-overlay__row{display:flex;flex-direction:column;gap:.375rem;font-size:.9rem}.text-overlay__row select,.text-overlay__row textarea,.text-overlay__style-row select{padding:.5rem .6rem;font:inherit;color:var(--color-text);background-color:var(--color-surface);border:2px solid var(--color-border);border-radius:var(--radius-sm);resize:vertical}.text-overlay__stage{position:relative;display:flex;align-items:center;justify-content:center;height:210px;overflow:hidden;background-color:var(--color-bg);border:var(--border-width) solid var(--color-border);border-radius:var(--radius-sm);container-type:size}.text-overlay__stage-image{position:relative;width:100%;height:100%;overflow:hidden}.text-overlay__marker{padding:.15rem .4rem;cursor:grab;pointer-events:auto;touch-action:none;outline:2px dashed rgba(255,255,255,.8);outline-offset:3px}.text-overlay__marker:active{cursor:grabbing}.text-overlay__hint{margin:0;color:var(--color-text-muted);font-size:.8rem}.text-overlay__style-row{display:flex;flex-wrap:wrap;align-items:flex-end;gap:1.5rem}.text-overlay__style-row label{display:flex;flex-direction:column;gap:.375rem;font-size:.9rem}.text-overlay__apply-all{align-self:flex-start;padding:.6rem 1.2rem;font-family:var(--font-display);font-size:.9rem;font-weight:700;color:var(--color-accent);background:var(--color-surface);border:2px solid var(--color-accent);border-radius:var(--radius);box-shadow:var(--shadow-soft-sm);cursor:pointer;transition:transform .2s var(--ease-bounce),box-shadow .2s var(--ease-bounce)}.text-overlay__apply-all:hover:not(:disabled){transform:translate(-2px,-2px);box-shadow:var(--shadow-lift)}.text-overlay__apply-all:active:not(:disabled){transform:translate(1px,1px);box-shadow:var(--shadow-press)}.text-overlay__apply-all:disabled{opacity:.4;cursor:not-allowed}.frame-crop__reset{align-self:flex-start;padding:.6rem 1.2rem;font-family:var(--font-display);font-size:.9rem;font-weight:700;color:var(--color-accent);background:var(--color-surface);border:2px solid var(--color-accent);border-radius:var(--radius);box-shadow:var(--shadow-soft-sm);cursor:pointer;transition:transform .2s var(--ease-bounce),box-shadow .2s var(--ease-bounce)}.frame-crop__reset:hover:not(:disabled){transform:translate(-2px,-2px);box-shadow:var(--shadow-lift)}.frame-crop__reset:active:not(:disabled){transform:translate(1px,1px);box-shadow:var(--shadow-press)}.frame-crop__reset:disabled{opacity:.4;cursor:not-allowed}.settings{display:flex;flex-direction:column;gap:1rem;padding:1.25rem;background-color:var(--color-surface);border:var(--border-width) solid var(--color-border);border-radius:var(--radius);box-shadow:var(--shadow-soft)}.settings__legend{font-family:var(--font-display);font-size:.9rem;font-weight:700;color:var(--color-text-muted);text-transform:uppercase;letter-spacing:.04em}.settings__row{display:flex;flex-direction:column;gap:.375rem;font-size:.9rem}.settings__row--checkbox{flex-direction:row;align-items:center;gap:.5rem}.settings__value{color:var(--color-text-muted);font-size:.8rem}.settings__hint{margin:-.25rem 0 0;color:var(--color-text-muted);font-size:.8rem}.settings__section{display:flex;flex-direction:column;gap:.75rem;padding-top:1rem;border-top:2px dashed var(--color-border)}.settings__section:first-child{padding-top:0;border-top:none}.settings__section-title{margin:0;font-family:var(--font-display);font-size:.85rem;font-weight:700;color:var(--color-text-muted);text-transform:uppercase;letter-spacing:.04em}.settings__dimension-row{display:flex;gap:1rem}.settings__dimension-row label{display:flex;flex:1;flex-direction:column;gap:.375rem;font-size:.9rem}.settings input[type=number],.settings select{padding:.4rem .5rem;font-size:.9rem;color:var(--color-text);background-color:var(--color-surface);border:2px solid var(--color-border);border-radius:var(--radius-sm)}.result{display:flex;flex-direction:column;align-items:center;gap:1rem;padding-top:.5rem;animation:pop-in .32s var(--ease-bounce)}.result__image{max-width:100%;max-height:360px;border-radius:var(--radius);border:var(--border-width) solid var(--color-border);box-shadow:var(--shadow-soft)}.result__download{padding:.7rem 1.75rem;font-family:var(--font-display);font-size:1rem;font-weight:700;color:var(--color-accent-contrast);background-color:var(--color-accent);border:var(--border-width) solid var(--color-border);border-radius:var(--radius);box-shadow:var(--shadow-soft);text-decoration:none;transition:transform .2s var(--ease-bounce),box-shadow .2s var(--ease-bounce)}.result__download:hover{transform:translate(-2px,-2px);box-shadow:var(--shadow-lift)}.result__download:active{transform:translate(2px,2px);box-shadow:var(--shadow-press)}@keyframes pop-in{0%{opacity:0;transform:translateY(10px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}