.tool-page{--tool-surface:20px;--tool-band:color-mix(in oklch, var(--foreground) 3%, var(--background));overflow-x:clip}.tool-page h1,.tool-page h2,.tool-page h3{text-wrap:balance}.tool-page :is(button,a,[role=slider],[role=radio]):focus-visible{outline:2px solid var(--ring);outline-offset:3px}.tool-hero{max-width:1152px;margin-inline:auto;padding:48px 24px 0}.tool-hero>header{text-align:center;max-width:760px;margin:0 auto 32px}.tool-hero h1,.tool-index-heading h1{font-family:var(--font-display);font-size:clamp(32px,4.2vw,54px);font-weight:var(--display-weight);letter-spacing:var(--display-tracking);line-height:1.12}.tool-hero>header p,.tool-index-heading p{max-width:600px;color:var(--muted-foreground);margin:16px auto 0;font-size:16px;line-height:1.7}.tool-generator[data-shape=tool]{max-width:800px;margin-inline:auto;scroll-margin-top:88px}.tool-page[data-shape=style] .tool-hero{padding-top:24px}.tool-page[data-shape=style] .tool-hero>header{margin-bottom:24px}.tool-page[data-shape=style] .tool-hero h1{font-size:clamp(28px,3vw,40px)}.tool-page[data-shape=style] .tool-hero>header p{margin-top:12px}.tool-dropzone{border:1.5px dashed color-mix(in oklch, var(--foreground) 22%, transparent);border-radius:var(--tool-surface);background:var(--card);text-align:center;cursor:pointer;flex-direction:column;justify-content:center;align-items:center;gap:10px;min-height:340px;padding:40px 24px;transition:border-color .16s,background-color .16s;display:flex;position:relative}.tool-dropzone:hover:not([data-disabled]){border-color:color-mix(in oklch, var(--foreground) 38%, transparent)}.tool-dropzone[data-dragging]{border-color:var(--primary);background:color-mix(in oklch, var(--primary) 6%, var(--card));border-style:solid}.tool-dropzone[data-disabled]{cursor:default}.tool-dropzone-button.tool-dropzone-button{border-radius:999px;min-height:52px;padding-inline:28px;font-size:15px;font-weight:600}.tool-dropzone-button svg{width:18px;height:18px}.tool-dropzone-hint{color:var(--foreground);margin-top:6px;font-size:14px}.tool-dropzone-formats{color:var(--muted-foreground);font-size:12px}.tool-dropzone-drop{color:var(--primary);font-size:16px;font-weight:600}.tool-dropzone-link-toggle.tool-dropzone-link-toggle{min-height:44px;color:var(--muted-foreground);margin-top:2px;font-size:13px}.tool-dropzone-link-toggle:hover{color:var(--foreground)}.tool-dropzone-link{gap:8px;width:min(100%,420px);margin-top:8px;display:flex}.tool-dropzone-filled{border:1px solid var(--border);background:var(--muted);cursor:default;min-height:0;padding:0;overflow:hidden}.tool-dropzone-filled>img{object-fit:contain;width:100%;height:auto;min-height:200px;max-height:min(56vh,460px);transition:opacity .2s;display:block}.tool-dropzone-filled[data-dragging]{border-color:var(--primary)}.tool-dropzone-status{color:var(--foreground);background:color-mix(in oklch, var(--background) 55%, transparent);justify-content:center;align-items:center;gap:10px;font-size:14px;font-weight:500;display:flex;position:absolute;inset:0}.tool-dropzone-actions{gap:8px;display:flex;position:absolute;top:12px;right:12px}.tool-dropzone-error,.tool-error{color:var(--destructive);margin-top:12px;font-size:13px;line-height:1.6}.tool-samples{flex-wrap:wrap;justify-content:center;align-items:center;gap:10px 16px;margin-top:20px;display:flex}.tool-samples>p{color:var(--muted-foreground);font-size:13px}.tool-samples ul{flex-wrap:wrap;gap:10px;display:flex}.tool-samples button{background:var(--muted);border-radius:12px;width:60px;height:60px;transition:opacity .16s,transform .16s;display:block;overflow:hidden}.tool-samples button:hover:not(:disabled){transform:translateY(-1px)}.tool-samples button:disabled{opacity:.5;cursor:not-allowed}.tool-samples button[aria-pressed=true]{outline:2px solid var(--primary);outline-offset:2px}.tool-samples img{object-fit:cover;width:100%;height:100%}.is-compact .tool-dropzone:not(.tool-dropzone-filled){gap:6px;min-height:144px;padding:16px 20px}.is-compact .tool-dropzone-filled>img{min-height:144px;max-height:176px}.is-compact .tool-samples{justify-content:flex-start;gap:8px 12px;margin-top:12px}.is-compact .tool-samples button{width:48px;height:48px}.is-compact .tool-dropzone-hint{margin-top:0}.tool-generate-row{justify-content:center;margin-top:24px;display:flex}.tool-generate{background:var(--primary);min-width:260px;min-height:52px;color:var(--primary-foreground);white-space:nowrap;border-radius:999px;justify-content:center;align-items:center;gap:10px;padding:8px 28px;font-size:15px;font-weight:600;transition:background-color .16s,filter .16s;display:inline-flex}.tool-generate:hover:not(:disabled){background:color-mix(in oklab, var(--primary) 90%, var(--background))}.tool-generate:active:not(:disabled){filter:brightness(.92)}.tool-generate:disabled{opacity:.45;cursor:not-allowed}.tool-generate>svg{width:18px;height:18px}.tool-cost{border-left:1px solid color-mix(in oklch, var(--primary-foreground) 35%, transparent);font-variant-numeric:tabular-nums;align-items:center;gap:4px;padding-left:10px;font-size:13px;font-weight:500;display:inline-flex}.tool-cost svg{width:14px;height:14px}.tool-notice{flex-wrap:wrap;justify-content:center;align-items:center;gap:12px;margin-top:16px;font-size:14px;display:flex}.tool-notice-text{text-align:center;color:var(--muted-foreground);margin-top:16px;font-size:13px}.tool-generator[data-shape=tool] .tool-error{text-align:center}.tool-compare{--tool-max-h:min(68vh, 680px);width:min(100%, calc(var(--tool-max-h) * var(--ratio,1.333)));border-radius:var(--tool-surface);background:var(--muted);touch-action:pan-y;-webkit-user-select:none;user-select:none;cursor:ew-resize;margin-inline:auto;position:relative;overflow:hidden}.tool-compare>img{object-fit:contain;-webkit-user-drag:none;width:100%;height:100%;position:absolute;inset:0}.tool-compare.is-revealing>img:nth-of-type(2){transition:clip-path .9s cubic-bezier(.16,1,.3,1)}.tool-compare.is-revealing .tool-compare-divider{transition:left .9s cubic-bezier(.16,1,.3,1)}.tool-compare-label{background:color-mix(in oklch, var(--background) 88%, transparent);color:var(--foreground);pointer-events:none;border-radius:999px;padding:4px 10px;font-size:12px;font-weight:500;position:absolute;bottom:12px}.tool-compare-label[data-side=before]{left:12px}.tool-compare-label[data-side=after]{right:12px}.tool-compare-divider{background:var(--background);width:2px;margin-left:-1px;position:absolute;top:0;bottom:0;box-shadow:0 0 6px oklch(0% 0 0/.25)}.tool-compare-handle{background:var(--background);width:44px;height:44px;color:var(--foreground);cursor:ew-resize;border-radius:999px;justify-content:center;align-items:center;display:flex;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);box-shadow:0 2px 10px -2px oklch(0% 0 0/.35)}.tool-compare-handle svg{width:18px;height:18px}.tool-result-bar{flex-wrap:wrap;justify-content:center;align-items:center;gap:12px;margin-top:20px;display:flex}.tool-result-actions{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.tool-sample-note{color:var(--muted-foreground);font-size:12px}.tool-generator[data-shape=tool][data-intro]{max-width:1080px}.tool-intro{grid-template-columns:repeat(2,minmax(0,1fr));align-items:start;gap:24px;display:grid}.tool-intro .tool-dropzone{aspect-ratio:3/2;min-height:0}.tool-showcase{min-width:0;margin:0}.tool-showcase .tool-compare{--tool-max-h:520px}.tool-showcase figcaption{color:var(--muted-foreground);text-align:center;margin-top:10px;font-size:12px}.tool-video{border-radius:inherit;background:var(--muted);width:100%;display:block;position:relative;overflow:hidden}.tool-showcase .tool-video{border-radius:var(--tool-surface)}.tool-video video{object-fit:contain;width:100%;height:auto;max-height:620px;display:block}.tool-video-controls{gap:8px;display:flex;position:absolute;bottom:12px;left:12px}.tool-video-button{background:color-mix(in oklch, var(--background) 88%, transparent);width:44px;height:44px;color:var(--foreground);border-radius:999px;place-items:center;transition:background-color .16s;display:grid;box-shadow:0 2px 10px -2px oklch(0% 0 0/.3)}.tool-video-button:hover{background:var(--background)}.tool-video-button svg{width:18px;height:18px}.tool-pending{--ratio:1;border-radius:var(--tool-surface);background:var(--muted);isolation:isolate;place-items:center;width:100%;display:grid;position:relative;overflow:hidden}.tool-pending-hero{width:min(100%, calc(min(60vh, 600px) * var(--ratio)));margin-inline:auto}.tool-pending>img{z-index:-1;object-fit:contain;opacity:.3;filter:grayscale()blur(2px);width:100%;height:100%;position:absolute;inset:0}.tool-pending:after{content:"";z-index:-1;background:linear-gradient(100deg, transparent 30%, color-mix(in oklch, var(--background) 45%, transparent) 50%, transparent 70%);background-size:220% 100%;animation:2.2s ease-in-out infinite tool-shimmer;position:absolute;inset:0}.tool-pending-copy{text-align:center;max-width:34ch;padding:24px}.tool-pending-copy p{font-size:15px;font-weight:600}.tool-pending-copy span{color:var(--muted-foreground);margin-top:8px;font-size:13px;line-height:1.6;display:block}.tool-pending-bar{background:color-mix(in oklch, var(--foreground) 8%, transparent);height:3px;position:absolute;inset:auto 0 0;overflow:hidden}.tool-pending-bar>span{background:var(--primary);width:32%;animation:1.8s cubic-bezier(.65,0,.35,1) infinite tool-progress;position:absolute;inset:0 auto 0 0}@keyframes tool-shimmer{0%{background-position:120% 0}to{background-position:-120% 0}}@keyframes tool-progress{0%{transform:translate(-100%)}to{transform:translate(320%)}}.tool-failed{border:1px solid var(--border);border-radius:var(--tool-surface);background:var(--card);text-align:center;flex-direction:column;align-items:center;gap:8px;padding:40px 24px;display:flex}.tool-failed>p{font-size:15px;font-weight:600}.tool-failed>span{color:var(--muted-foreground);font-size:13px}.tool-failed .tool-result-actions{justify-content:center;margin-top:12px}.tool-generator-style{grid-template-columns:minmax(0,440px) minmax(0,1fr);align-items:start;gap:40px;display:grid}.tool-style-inputs{flex-direction:column;gap:20px;min-width:0;display:flex}.tool-step>h2{margin-bottom:12px;font-size:14px;font-weight:600}.tool-style-inputs .tool-generate-row{margin-top:0}.tool-style-inputs .tool-generate{width:100%}.tool-style-inputs .tool-notice,.tool-style-inputs .tool-notice-text,.tool-style-inputs .tool-error{text-align:left;justify-content:flex-start;margin-top:0}.tool-style-results{flex-direction:column;gap:16px;min-width:0;scroll-margin-top:88px;display:flex;position:sticky;top:88px}.tool-style-inputs{scroll-margin-top:88px}.tool-style-feedback{grid-column:1/-1}.tool-style-feedback:empty,.tool-edit-input{display:none}.tool-style-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:16px 12px;display:grid}.tool-style-grid.is-four{grid-template-columns:repeat(4,minmax(0,1fr))}.tool-style-tile{text-align:left;cursor:pointer;background:0 0;border:0;flex-direction:column;gap:8px;min-width:0;padding:0;display:flex}.tool-style-tile[data-disabled]{cursor:not-allowed;opacity:.6}.tool-style-image{aspect-ratio:4/5;background:var(--muted);outline-offset:3px;border-radius:12px;outline:2px solid #0000;transition:outline-color .16s;display:block;overflow:hidden}.tool-style-image img{object-fit:cover;width:100%;height:100%;transition:transform .4s cubic-bezier(.16,1,.3,1)}.tool-style-tile:hover:not([data-disabled]) .tool-style-image img{transform:scale(1.04)}.tool-style-tile[data-checked] .tool-style-image{outline-color:var(--primary)}.tool-page .tool-style-tile:focus-visible{outline:none}.tool-style-tile:focus-visible .tool-style-image{outline-color:var(--ring)}.tool-style-name{color:var(--muted-foreground);font-size:13px;font-weight:500;line-height:1.35}.tool-style-tile[data-checked] .tool-style-name{color:var(--foreground)}.tool-style-tile.is-none .tool-style-image{background:color-mix(in oklab, var(--foreground) 5%, var(--card));color:var(--muted-foreground);justify-content:center;align-items:center;display:flex}.tool-style-tile.is-none .tool-style-image svg{width:26px;height:26px}.tool-style-tile.is-none[data-checked] .tool-style-image{color:var(--foreground)}.tool-result-empty{border:1px solid var(--border);border-radius:var(--tool-surface);background:var(--tool-band);text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:8px;min-height:220px;padding:24px;display:flex}.tool-result-empty p{font-size:15px;font-weight:600}.tool-result-empty span{max-width:32ch;color:var(--muted-foreground);font-size:13px;line-height:1.6}.tool-result-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px 16px;display:grid}.tool-result-grid.is-single{grid-template-columns:minmax(0,1fr)}.tool-result-card{min-width:0;margin:0}.tool-result-media{background:var(--muted);border-radius:16px;justify-content:center;align-items:center;width:100%;display:flex;overflow:hidden}.tool-result-media img{object-fit:contain;width:100%;height:auto;max-height:620px}button.tool-result-media{cursor:zoom-in}.tool-result-card figcaption{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:10px;margin-top:12px;display:flex}.tool-result-card figcaption>span{font-size:14px;font-weight:500}.tool-steps{margin-top:72px}.tool-steps .creative-section-heading{margin-bottom:28px}.tool-page .tool-disclosure{max-width:1152px;margin:20px auto 0;padding:0 24px}.tool-disclosure>summary{border-top:1px solid var(--border);cursor:pointer;min-height:52px;padding:16px 0;font-size:14px;font-weight:500}.tool-disclosure>summary:focus-visible{outline:2px solid var(--ring);outline-offset:3px}.tool-disclosure[open]>summary{margin-bottom:16px}.tool-page .tool-disclosure:last-child{margin-bottom:32px}@media (width<=760px){.tool-generator-style[data-result-phase]>.tool-style-inputs{display:none}.tool-generator-style[data-result-phase] .tool-edit-input{align-self:flex-start;display:inline-flex}.tool-generator-style{gap:20px}.tool-page .tool-disclosure{margin-top:12px;padding-inline:16px}}.tool-card-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:32px 20px;display:grid}@media (width>=1024px){.tool-card-grid:has(>:nth-child(4):last-child){grid-template-columns:repeat(4,minmax(0,1fr))}}.tool-card{min-width:0;color:var(--foreground);flex-direction:column;gap:14px;display:flex}.tool-card-media{aspect-ratio:3/2;background:var(--muted);isolation:isolate;border-radius:16px;display:block;position:relative;overflow:hidden}.tool-card-media>img{object-fit:cover;width:100%;height:100%;transition:transform .6s cubic-bezier(.16,1,.3,1);position:absolute;inset:0}.tool-card:hover .tool-card-media>img{transform:scale(1.03)}.tool-card-media>.tool-card-before{clip-path:inset(0 50% 0 0)}.tool-card-divider{background:var(--background);width:2px;margin-left:-1px;position:absolute;top:0;bottom:0;left:50%}.tool-card-play{background:color-mix(in oklch, var(--background) 88%, transparent);width:36px;height:36px;color:var(--foreground);border-radius:999px;place-items:center;display:grid;position:absolute;bottom:12px;left:12px}.tool-card-play svg{fill:currentColor;width:14px;height:14px}.tool-card-styles{grid-template-columns:repeat(3,minmax(0,1fr));gap:3px;display:grid;position:absolute;inset:0}.tool-card-styles img{object-fit:cover;width:100%;height:100%;transition:transform .6s cubic-bezier(.16,1,.3,1)}.tool-card:hover .tool-card-styles img{transform:scale(1.03)}.tool-card-body{flex-direction:column;gap:6px;display:flex}.tool-card h3{font-family:var(--font-display);font-size:20px;font-weight:var(--display-weight);letter-spacing:var(--display-tracking);line-height:1.3}.tool-card p{max-width:46ch;color:var(--muted-foreground);font-size:14px;line-height:1.6}.tool-card-cta{color:var(--primary);align-items:center;gap:6px;margin-top:4px;font-size:13px;font-weight:500;display:inline-flex}.tool-card-cta svg{width:14px;height:14px;transition:transform .2s}.tool-card:hover .tool-card-cta svg{transform:translate(3px)}.tool-page .tool-card:focus-visible{outline:none}.tool-card:focus-visible .tool-card-media{outline:2px solid var(--ring);outline-offset:3px}.tool-index{padding-top:48px}.tool-group+.tool-group{margin-top:64px}.tool-group>h2{font-family:var(--font-display);font-size:clamp(22px,2.4vw,28px);font-weight:var(--display-weight);letter-spacing:var(--display-tracking);margin-bottom:20px;line-height:1.25}.tool-index-heading{text-align:center;max-width:760px;margin:0 auto 40px}@media (width<=1023px){.tool-generator-style{grid-template-columns:minmax(0,1fr);gap:32px}.tool-style-results{position:static}.tool-card-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.tool-style-grid:not(.is-four){grid-template-columns:repeat(auto-fill,minmax(96px,1fr))}.tool-generate-row.is-sticky{z-index:10;padding:12px 16px calc(12px + env(safe-area-inset-bottom));border-top:1px solid var(--border);background:var(--background);margin-inline:-16px;position:sticky;bottom:0}}@media (width<=700px){.tool-hero{padding:28px 16px 0}.tool-hero>header{margin-bottom:24px}.tool-hero>header p,.tool-index-heading p{font-size:15px}.tool-dropzone{min-height:280px;padding:32px 16px}.tool-dropzone-filled>img{max-height:340px}.tool-generate-row .tool-generate{width:100%;min-width:0}.tool-samples{justify-content:flex-start}.tool-samples ul{gap:8px}.tool-samples button{width:56px;height:56px}.tool-compare{--tool-max-h:62vh;border-radius:16px}.tool-result-bar,.tool-result-bar .tool-result-actions{flex-direction:column;align-items:stretch}.tool-result-bar .tool-result-actions>*{width:100%}.tool-result-grid{grid-template-columns:minmax(0,1fr)}.tool-result-empty{display:none}.tool-steps{margin-top:48px}.tool-card-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 12px}.tool-card{gap:10px}.tool-card h3{font-size:16px}.tool-card p{-webkit-line-clamp:2;-webkit-box-orient:vertical;font-size:13px;display:-webkit-box;overflow:hidden}.tool-group+.tool-group{margin-top:48px}.tool-intro{grid-template-columns:minmax(0,1fr);gap:16px}.tool-intro .tool-dropzone{aspect-ratio:auto;min-height:220px}.tool-index{padding-top:28px}}@media (prefers-reduced-motion:reduce){.tool-page *,.tool-page :before,.tool-page :after{transition:none!important;animation:none!important}.tool-pending-bar>span{opacity:.35;width:100%;left:0}}.template-generator{--tile-h:84px;gap:16px;min-width:0;display:grid}.template-inputs,.template-output{min-width:0}.template-inputs{flex-direction:column;gap:16px;display:flex}.template-selected{align-items:center;gap:16px;min-height:80px;display:flex}.template-example-toggle{min-height:44px;color:var(--foreground);text-align:left;align-items:center;gap:12px;display:flex}.template-example-toggle>span{text-underline-offset:3px;max-width:5em;font-size:13px;text-decoration:underline}.template-task-actions{justify-content:space-between;align-items:center;gap:12px;margin-bottom:12px;display:flex}.template-task-actions>a{align-items:center;min-height:44px;font-size:14px;display:inline-flex}.template-example-dialog{max-width:min(560px,100vw - 32px)}.template-example-dialog>img,.template-example-dialog .tool-video{object-fit:contain;width:100%;max-height:65dvh}.template-generator>.template-notices{height:auto;min-height:0;overflow:visible}.template-selected img{object-fit:cover;border-radius:var(--radius);width:64px;height:80px}.template-selected>div{flex:1;min-width:0}.template-selected h2{font-size:18px;font-weight:600;line-height:1.4}.template-selected span{color:var(--muted-foreground);font-size:13px}.template-slots{align-items:start;gap:16px;display:flex}.template-slot{min-width:0;width:var(--tile-h)}.template-generator .generation-upload-label{min-height:36px;font-size:13px;line-height:18px}.template-sample{width:100%;padding-inline:0;font-size:13px}.template-format legend{color:var(--muted-foreground);margin-bottom:12px;font-size:13px}.template-format>div{gap:8px;display:flex}.template-format button{min-width:88px}.template-format button[aria-pressed=true],.template-categories button[aria-pressed=true]{border-color:var(--primary);color:var(--primary)}.template-generate{width:100%;min-height:48px}.template-notices{height:88px;color:var(--muted-foreground);font-size:13px;line-height:1.6;overflow-y:auto}.template-notices button{margin-top:8px}.template-stage{--preview-h:420px;height:var(--preview-h);background:var(--muted);border-radius:calc(var(--radius) + 4px);place-items:center;display:grid;overflow:hidden}.template-frame{width:min(100%, calc(var(--preview-h) * var(--template-ratio)));aspect-ratio:var(--template-ratio);position:relative;overflow:hidden}.template-frame>*,.template-frame .tool-result-media,.template-frame .tool-video{aspect-ratio:auto;border-radius:0;width:100%;height:100%;margin:0}.template-frame :is(img,video){object-fit:contain;width:100%;height:100%}.template-frame>img,.template-frame>.tool-video video{object-fit:cover}.template-frame .tool-pending{min-height:0}.template-output-actions{height:112px;padding-top:12px;overflow-y:auto}.template-output-actions .tool-result-actions{margin-top:12px}.template-browse{min-height:44px;color:var(--muted-foreground);text-underline-offset:4px;align-items:center;font-size:13px;text-decoration:underline;display:inline-flex}.template-filters{flex-direction:column;gap:16px;margin-bottom:24px;display:flex}.template-categories{flex-wrap:wrap;gap:8px;display:flex}.template-library-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 16px;display:grid}.template-card{border-radius:var(--radius);min-width:0;display:block}.template-cover{aspect-ratio:4/5;border-radius:calc(var(--radius) + 4px);background:var(--muted);position:relative;overflow:hidden}.template-cover :is(img,video){object-fit:cover;width:100%;height:100%;position:absolute;inset:0}.template-card-copy{padding-top:12px}.template-card h3{min-height:45px;font-size:15px;font-weight:600;line-height:1.5}.template-card p{text-overflow:ellipsis;white-space:nowrap;color:var(--muted-foreground);margin-top:4px;font-size:13px;overflow:hidden}.template-card-copy>span{color:var(--muted-foreground);margin-top:8px;font-size:13px;display:block}.template-card:focus-visible,.template-mini:focus-visible{outline:2px solid var(--ring);outline-offset:4px}.template-empty{min-height:240px;color:var(--muted-foreground);padding-block:48px}.template-picker[data-slot]{max-height:85dvh;padding:24px;overflow-y:auto}.template-picker [data-slot$=-title]{padding-right:36px}.template-picker [data-slot$=-close]{min-width:44px;min-height:44px}.template-picker .template-cover{aspect-ratio:1}.template-index-tabs{border-bottom:1px solid var(--border);gap:24px;margin-bottom:32px;display:flex}.template-index-tabs a{border-bottom:2px solid #0000;align-items:center;min-height:48px;display:inline-flex}.template-index-tabs a[data-selected=true]{color:var(--primary);border-color:var(--primary)}.template-strip{align-items:center;gap:16px;min-width:0;height:92px;margin-top:16px;display:flex}.template-strip-label{flex-direction:column;flex-shrink:0;justify-content:center;gap:8px;min-height:44px;font-size:13px;display:flex}.template-strip-label svg{width:16px;height:16px}.template-strip-items{scrollbar-width:thin;gap:12px;min-width:0;padding:4px;display:flex;overflow-x:auto}.template-mini{flex:0 0 100px;min-width:0}.template-mini .template-cover{aspect-ratio:auto;border-radius:var(--radius);height:56px}.template-mini .template-card-copy{padding-top:4px}.template-mini h3{white-space:nowrap;text-overflow:ellipsis;font-size:13px;line-height:18px;overflow:hidden}.template-landing-reel{scrollbar-width:thin;grid-auto-columns:180px;grid-auto-flow:column;gap:20px;padding:4px 4px 16px;display:grid;overflow-x:auto}.template-landing>.tool-sample-note{margin-top:16px}@media (width<=760px){[data-product-shell] .product-generation .tool-dropzone:not(.tool-dropzone-filled){min-height:200px;padding:24px 16px}[data-product-shell] .product-generation .is-compact .tool-dropzone:not(.tool-dropzone-filled){min-height:144px;padding:16px}[data-product-shell] .product-generation .tool-dropzone-filled>img{min-height:144px;max-height:38dvh}[data-product-shell] .product-generation .tool-dropzone-actions{border-top:1px solid var(--border);background:var(--card);justify-content:flex-end;width:100%;padding:10px;position:static}[data-product-shell] .product-generation :is(.tool-dropzone-error,.tool-error,.tool-notice-text,.template-notices){overflow-wrap:anywhere}[data-product-shell] .product-generation .tool-dropzone-link{flex-wrap:wrap}[data-product-shell] .product-generation .tool-dropzone-link input{flex:160px;min-width:0;font-size:16px}[data-product-shell] .product-generation .generation-action-dock :is(.tool-generate,.template-generate){white-space:normal;width:100%;min-width:0;min-height:48px}[data-product-shell] .product-generation .tool-cost{white-space:nowrap;flex-shrink:0}[data-product-shell] .product-generation :is(.template-notices,.template-output-actions){height:auto;min-height:0;overflow:visible}[data-product-shell] .product-generation .template-notices:empty{display:none}[data-product-shell] .product-generation .template-slots,[data-product-shell] .product-generation .template-format>div{flex-wrap:wrap}[data-product-shell] .product-generation .template-format button{flex:1;min-height:44px}[data-product-shell] .product-generation :is(.tool-result-actions,.template-output-actions) :is(button,a){min-height:44px}[data-product-shell] .product-generation .template-stage{--preview-h:min(420px, 58dvh)}}@media (width>=768px){.template-generator{--tile-h:100px;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:48px}.template-inputs{grid-area:1/1}.template-output{grid-area:1/2/span 2}.template-generator>.template-notices{grid-area:2/1}.template-stage{--preview-h:520px}.template-inputs{gap:24px}.template-notices{height:132px}.template-library-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:32px 24px}.template-filters{flex-direction:row;justify-content:space-between;align-items:center}.template-filters input{max-width:280px}.template-picker[data-slot]{width:800px;max-width:calc(100vw - 48px)}.template-picker .template-library-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.template-card h3{min-height:23px}.template-landing-reel{grid-auto-columns:220px}}@media (width<=767px){.template-generator[data-stage=input]>.template-output,.template-generator:not([data-stage=input])>.template-inputs{display:none}.template-generator>.template-notices{order:3}.template-generator .template-notices:empty{display:none}[data-product-shell] .template-generator{--tile-h:clamp(76px, 24vw, 96px)}.template-selected{gap:12px}.template-selected>div{display:none}.template-selected>:last-child{margin-left:auto}.template-slots{justify-content:flex-start;gap:12px}.template-generator .generation-upload-label{min-height:22px;margin-top:8px}.template-generator .template-frame>img{object-fit:contain}}
