.gif{gap:var(--s-6);flex-direction:column;width:100%;max-width:1120px;margin:0 auto;display:flex;overflow-x:clip}.gif-head{isolation:isolate;align-items:center;gap:var(--s-2);text-align:center;flex-direction:column;display:flex;position:relative}.gif-title{font-size:calc(var(--fs-display) * 1.2);line-height:1.04}.gif-lede{max-width:56ch;color:var(--muted);font-size:var(--fs-body);line-height:var(--lh-body);text-wrap:pretty;margin:0}.gif-grid{gap:var(--s-6);grid-template-columns:minmax(0,420px) minmax(0,1fr);align-items:start;display:grid}.gif-controls{gap:var(--s-4);flex-direction:column;min-width:0;display:flex}.gif-output{top:calc(var(--control-h) + var(--s-6));align-items:center;gap:var(--s-3);flex-direction:column;min-width:0;display:flex;position:sticky}.gif-image{border-radius:var(--r-lg);width:100%;height:auto;box-shadow:var(--shadow-2);background:#0c0c0c;display:block}.gif-field{gap:var(--s-2);min-width:0;font-size:var(--fs-body-sm);border:0;flex-direction:column;margin:0;padding:0;display:flex}.gif-field>span:first-child,.gif-field>legend{padding:0;font-weight:600}.gif-row{align-items:center;gap:var(--s-2);min-width:0;display:flex}.gif-row .ui-input,.gif-row select{flex:1;min-width:0}.gif-field select{min-height:var(--control-h);padding:0 var(--s-3);border:1px solid var(--border);border-radius:var(--r-sm);background:var(--bg);font:inherit;color:var(--text)}.gif-pgn{width:100%;min-height:150px;padding:var(--s-3);border:1px solid var(--border);border-radius:var(--r-sm);background:var(--panel);font-family:var(--font-mono-stack);font-size:var(--fs-caption);color:var(--text);resize:vertical;line-height:1.5}.gif-bgs{gap:var(--s-2);grid-template-columns:repeat(5,minmax(0,1fr));display:grid}.gif-bgs>legend{margin-bottom:var(--s-2);grid-column:1/-1}.gif-bg{align-items:center;gap:var(--s-1);padding:var(--s-1);border:1px solid var(--border);border-radius:var(--r-sm);background:var(--bg);font:inherit;font-size:var(--fs-caption);color:var(--muted);cursor:pointer;flex-direction:column;display:flex}.gif-bg[data-on="1"]{border-color:var(--good);box-shadow:inset 0 0 0 1px var(--good);color:var(--text);font-weight:600}.gif-bg-swatch{aspect-ratio:1;border-radius:6px;width:100%}.gif-settings{border:1px solid var(--border);border-radius:var(--r-lg);background:var(--panel)}.gif-settings>summary{padding:var(--s-3) var(--s-4);font-weight:600;font-size:var(--fs-body-sm);cursor:pointer}.gif-settings-body{gap:var(--s-3);padding:0 var(--s-4) var(--s-4);flex-direction:column;display:flex}.gif-check{align-items:center;gap:var(--s-2);font-size:var(--fs-body-sm);display:flex}.gif-check input{width:18px;height:18px;accent-color:var(--good)}.gif-progress{gap:var(--s-2);font-size:var(--fs-caption);color:var(--muted);flex-direction:column;display:flex}.gif-privacy,.gif-meta{font-size:var(--fs-caption);line-height:var(--lh-caption);color:var(--muted);text-wrap:pretty;margin:0}.gif-download{justify-content:center;width:min(100%,360px)}.gif-cta{justify-content:center;align-items:center;gap:var(--s-2);font-size:var(--fs-body-sm);color:var(--muted);text-align:center;flex-wrap:wrap;display:flex}@media (max-width:860px){.gif-grid{grid-template-columns:minmax(0,1fr)}.gif-output{order:-1;position:static}.gif-bgs{gap:var(--s-1)}}