.css-animation-generator-module__POhtRq__tool{gap:var(--space-3);grid-template-columns:minmax(0,1fr);grid-template-areas:"controls""presets""banners""preview""output""footer";display:grid}@media (min-width:1024px){.css-animation-generator-module__POhtRq__tool{grid-template:"controls presets""controls banners""controls preview""controls output"1fr"footer footer"/minmax(0,24rem) minmax(0,1fr)}}@media (min-width:1440px){.css-animation-generator-module__POhtRq__tool{grid-template:"controls presets presets""controls banners banners""controls preview output"1fr"footer footer footer"/minmax(0,24rem) minmax(0,1fr) minmax(0,26rem)}}.css-animation-generator-module__POhtRq__controlsPane{grid-area:controls;}.css-animation-generator-module__POhtRq__presetsZone{grid-area:presets}.css-animation-generator-module__POhtRq__bannerZone{gap:var(--space-2);flex-direction:column;grid-area:banners;display:flex}.css-animation-generator-module__POhtRq__previewPane{grid-area:preview;align-self:start;}.css-animation-generator-module__POhtRq__outputCard{grid-area:output;align-self:start;}.css-animation-generator-module__POhtRq__footerZone{gap:var(--space-2);flex-direction:column;grid-area:footer;display:flex}.css-animation-generator-module__POhtRq__paneHeader{}.css-animation-generator-module__POhtRq__paneLabel{}.css-animation-generator-module__POhtRq__liveBadge{flex:none}.css-animation-generator-module__POhtRq__stale{}.css-animation-generator-module__POhtRq__controlsBody{gap:var(--space-3);padding:var(--pane-padding);flex-direction:column;display:flex}.css-animation-generator-module__POhtRq__fieldset{min-inline-size:0;padding:var(--space-3);border:1px solid var(--color-border-subtle);border-radius:var(--radius-md);gap:var(--space-3);flex-direction:column;margin:0;display:flex}.css-animation-generator-module__POhtRq__legend{padding-inline:var(--space-1);font-size:var(--text-ui-sm-size);line-height:var(--text-ui-sm-line);font-weight:var(--weight-medium);color:var(--color-text-secondary)}.css-animation-generator-module__POhtRq__controlGroup{gap:var(--space-1);flex-direction:column;min-inline-size:0;display:flex}.css-animation-generator-module__POhtRq__groupLabel{font-family:var(--font-mono);font-feature-settings:"zero";font-size:var(--text-ui-sm-size);line-height:var(--text-ui-sm-line);color:var(--color-text-secondary)}.css-animation-generator-module__POhtRq__groupHint{min-block-size:calc(var(--text-ui-sm-line) * 2);}.css-animation-generator-module__POhtRq__textInput{inline-size:100%;font-family:var(--font-mono);font-feature-settings:"zero";}.css-animation-generator-module__POhtRq__timeline{gap:var(--space-2);flex-direction:column;margin:0;padding:0;list-style:none;display:flex}.css-animation-generator-module__POhtRq__timelineEmpty{min-block-size:var(--text-ui-sm-line);font-size:var(--text-ui-sm-size);line-height:var(--text-ui-sm-line);color:var(--color-text-muted);margin:0}.css-animation-generator-module__POhtRq__stepCard{gap:var(--space-2);padding:var(--space-2);background:var(--color-bg-surface);border:1px solid var(--color-border-subtle);border-radius:var(--radius-sm);flex-direction:column;display:flex}.css-animation-generator-module__POhtRq__stepHead{align-items:center;gap:var(--space-2);flex-wrap:wrap;display:flex}.css-animation-generator-module__POhtRq__stepLegend{min-inline-size:0;font-family:var(--font-mono);font-feature-settings:"zero";font-size:var(--text-ui-sm-size);line-height:var(--text-ui-sm-line);color:var(--color-text-secondary);white-space:nowrap;flex:1}.css-animation-generator-module__POhtRq__offsetField{align-items:center;gap:var(--space-2);min-block-size:var(--target-min);display:inline-flex}.css-animation-generator-module__POhtRq__offsetLabel{font-size:var(--text-ui-xs-size);line-height:var(--text-ui-xs-line);color:var(--color-text-muted)}.css-animation-generator-module__POhtRq__offsetInput{inline-size:64px;font-family:var(--font-mono);font-feature-settings:"zero";}.css-animation-generator-module__POhtRq__offsetUnit{font-family:var(--font-mono);font-size:var(--text-ui-xs-size);line-height:var(--text-ui-xs-line);color:var(--color-text-muted)}.css-animation-generator-module__POhtRq__rowIconButton{flex:none;}.css-animation-generator-module__POhtRq__declList{gap:var(--space-2);flex-direction:column;margin:0;padding:0;list-style:none;display:flex}.css-animation-generator-module__POhtRq__declRow{align-items:flex-end;gap:var(--space-2);flex-wrap:wrap;display:flex}.css-animation-generator-module__POhtRq__declField{gap:var(--space-1);flex-direction:column;flex:1;min-inline-size:6rem;display:flex}.css-animation-generator-module__POhtRq__declFieldLabel{font-size:var(--text-ui-xs-size);line-height:var(--text-ui-xs-line);color:var(--color-text-muted)}.css-animation-generator-module__POhtRq__declInput{inline-size:100%;min-inline-size:0;font-family:var(--font-mono);font-feature-settings:"zero";}.css-animation-generator-module__POhtRq__textInput[aria-invalid=true],.css-animation-generator-module__POhtRq__declInput[aria-invalid=true]{border-color:var(--color-danger-fg)}.css-animation-generator-module__POhtRq__stepFooter{align-items:center;gap:var(--space-2);display:flex}.css-animation-generator-module__POhtRq__addDeclButton{}.css-animation-generator-module__POhtRq__timelineFooter{gap:var(--space-1);flex-direction:column;display:flex}.css-animation-generator-module__POhtRq__capNote{min-block-size:var(--text-ui-xs-line);font-size:var(--text-ui-xs-size);line-height:var(--text-ui-xs-line);color:var(--color-text-muted);margin:0}.css-animation-generator-module__POhtRq__capNoteHidden{visibility:hidden}.css-animation-generator-module__POhtRq__numberRow{gap:var(--space-3);flex-wrap:wrap;display:flex}.css-animation-generator-module__POhtRq__numberOption{gap:var(--space-1);flex-direction:column;min-inline-size:0;display:inline-flex}.css-animation-generator-module__POhtRq__timePair{align-items:center;gap:var(--space-2);display:inline-flex}.css-animation-generator-module__POhtRq__numberInput{inline-size:88px;font-family:var(--font-mono);font-feature-settings:"zero";}.css-animation-generator-module__POhtRq__unitSelect{inline-size:72px;}.css-animation-generator-module__POhtRq__selectField{gap:var(--space-1);flex-direction:column;min-inline-size:0;display:flex}.css-animation-generator-module__POhtRq__select{inline-size:100%;font-family:var(--font-mono);font-feature-settings:"zero";}.css-animation-generator-module__POhtRq__optionCheck{align-items:center;gap:var(--space-2);min-block-size:var(--target-min);font-size:var(--text-ui-sm-size);line-height:var(--text-ui-sm-line);color:var(--color-text-secondary);cursor:pointer;display:inline-flex}.css-animation-generator-module__POhtRq__checkbox{}.css-animation-generator-module__POhtRq__diagZone{block-size:calc(var(--text-ui-sm-line) * 4 + var(--space-6));overflow-y:auto}.css-animation-generator-module__POhtRq__errorBox{}.css-animation-generator-module__POhtRq__errorMessage{font-size:var(--text-ui-sm-size);line-height:var(--text-ui-sm-line);color:var(--color-danger-fg);overflow-wrap:anywhere;margin:0}.css-animation-generator-module__POhtRq__presetsFieldset{min-inline-size:0;padding:var(--space-3);border:1px solid var(--color-border-subtle);border-radius:var(--radius-md);margin:0}.css-animation-generator-module__POhtRq__presetsRow{gap:var(--space-2);flex-wrap:wrap;display:flex}.css-animation-generator-module__POhtRq__presetChip{min-block-size:28px;padding-inline:var(--space-3);background:var(--color-bg-surface);border:1px solid var(--color-border-subtle);border-radius:var(--radius-full);font-size:var(--text-ui-sm-size);line-height:var(--text-ui-sm-line);color:var(--color-text-secondary);cursor:pointer;align-items:center;display:inline-flex}.css-animation-generator-module__POhtRq__presetChip:hover{border-color:var(--color-accent-fg);color:var(--color-text-primary)}.css-animation-generator-module__POhtRq__presetChip:active{transform:scale(.98)}.css-animation-generator-module__POhtRq__presetChipOn{background:color-mix(in srgb, var(--color-text-primary) 8%, transparent);border-color:var(--color-border-control);color:var(--color-text-primary)}.css-animation-generator-module__POhtRq__previewStage{block-size:260px;margin:var(--space-3);background:var(--color-bg-surface);border:1px solid var(--color-border-subtle);border-radius:var(--radius-sm);flex:none;justify-content:center;align-items:center;display:flex;overflow:hidden}.css-animation-generator-module__POhtRq__previewBox{border-radius:var(--radius-md);background:color-mix(in srgb, var(--color-text-primary) 8%, transparent);border:1px solid var(--color-border-control);block-size:120px;inline-size:120px;position:relative;animation-name:var(--g359-name,none)!important;animation-duration:var(--g359-duration,0s)!important;animation-timing-function:var(--g359-timing,ease)!important;animation-delay:var(--g359-delay,0s)!important;animation-iteration-count:var(--g359-iterations,1)!important;animation-direction:var(--g359-direction,normal)!important;animation-fill-mode:var(--g359-fill,none)!important;animation-play-state:var(--g359-play,paused)!important}.css-animation-generator-module__POhtRq__previewBox:before{content:"";inline-size:var(--space-3);block-size:var(--space-3);border-radius:var(--radius-full);background:var(--color-text-primary);position:absolute;inset-block-start:var(--space-2);inset-inline-start:var(--space-2)}.css-animation-generator-module__POhtRq__previewControls{gap:var(--space-2);padding-inline:var(--space-3);display:flex}.css-animation-generator-module__POhtRq__reducedMotionLine{padding:var(--space-2) var(--space-3) var(--space-3);min-block-size:var(--text-ui-sm-line);font-size:var(--text-ui-sm-size);line-height:var(--text-ui-sm-line);color:var(--color-text-secondary);margin:0}.css-animation-generator-module__POhtRq__reducedMotionLineHidden{visibility:hidden}.css-animation-generator-module__POhtRq__outputBody{gap:var(--space-3);padding:var(--pane-padding);flex-direction:column;display:flex}.css-animation-generator-module__POhtRq__blockRow{align-items:center;gap:var(--space-2);min-block-size:var(--control-height-sm);display:flex}.css-animation-generator-module__POhtRq__blockLabel{min-inline-size:0;font-family:var(--font-mono);font-feature-settings:"zero";font-size:var(--text-ui-sm-size);line-height:var(--text-ui-sm-line);color:var(--color-text-secondary);white-space:nowrap;flex:1}.css-animation-generator-module__POhtRq__staleBadge{flex:none;}.css-animation-generator-module__POhtRq__badgeHidden{visibility:hidden}.css-animation-generator-module__POhtRq__blockCopy{}.css-animation-generator-module__POhtRq__copyAccent{}.css-animation-generator-module__POhtRq__codeBlock{padding:var(--space-2);background:var(--color-bg-surface);border:1px solid var(--color-border-subtle);border-radius:var(--radius-sm);font-family:var(--font-mono);font-feature-settings:"zero";font-size:var(--text-code-size);line-height:var(--text-code-line);color:var(--color-text-primary);white-space:pre;margin:0;overflow:auto}.css-animation-generator-module__POhtRq__codeBlockKeyframes{block-size:calc(var(--text-code-line) * 14 + var(--space-4))}.css-animation-generator-module__POhtRq__codeBlockAnimation{block-size:calc(var(--text-code-line) * 6 + var(--space-4))}.css-animation-generator-module__POhtRq__reducedMotionNote{font-family:var(--font-ui);font-size:var(--text-ui-xs-size);line-height:var(--text-ui-xs-line);color:var(--color-text-muted);margin:0}.css-animation-generator-module__POhtRq__banner{}.css-animation-generator-module__POhtRq__bannerAction{color:var(--color-accent-fg);cursor:pointer;font-size:inherit;background:0 0;border:none;padding:0;text-decoration-line:underline}.css-animation-generator-module__POhtRq__actions{}.css-animation-generator-module__POhtRq__actionButton{}.css-animation-generator-module__POhtRq__swapWrap{}.css-animation-generator-module__POhtRq__swapSizer{}.css-animation-generator-module__POhtRq__echoSlot{min-inline-size:var(--space-4);text-align:start;display:inline-block}.css-animation-generator-module__POhtRq__shareNote,.css-animation-generator-module__POhtRq__storedLine,.css-animation-generator-module__POhtRq__keyboardHint{min-block-size:var(--text-ui-xs-line);font-size:var(--text-ui-xs-size);line-height:var(--text-ui-xs-line);color:var(--color-text-muted);margin:0}.css-animation-generator-module__POhtRq__dialog{}.css-animation-generator-module__POhtRq__dialogTitle{font-size:var(--text-h4-size);line-height:var(--text-h4-line);margin-block-end:var(--space-4)}.css-animation-generator-module__POhtRq__dialogNote{font-size:var(--text-ui-xs-size);line-height:var(--text-ui-xs-line);color:var(--color-text-muted)}.css-animation-generator-module__POhtRq__shortcutList{gap:var(--space-2);flex-direction:column;margin-block-end:var(--space-4);padding:0;list-style:none;display:flex}.css-animation-generator-module__POhtRq__shortcutItem{font-size:var(--text-ui-sm-size);line-height:var(--text-ui-sm-line)}.css-animation-generator-module__POhtRq__kbd{}.css-animation-generator-module__POhtRq__optionDialog{align-items:center;gap:var(--space-2);font-size:var(--text-ui-md-size);line-height:var(--text-ui-md-line);min-block-size:var(--target-min);cursor:pointer;margin-block-end:var(--space-4);display:inline-flex}@media (pointer:coarse){.css-animation-generator-module__POhtRq__presetChip{min-block-size:var(--target-touch)}.css-animation-generator-module__POhtRq__bannerAction,.css-animation-generator-module__POhtRq__optionCheck,.css-animation-generator-module__POhtRq__optionDialog,.css-animation-generator-module__POhtRq__offsetField{min-block-size:var(--target-touch);align-items:center;display:inline-flex}}