.ai-edit-page {
  min-height: calc(100dvh - var(--header));
  padding: 30px clamp(14px, 3.2vw, 52px) 64px;
  color: #eef4ef;
  background: radial-gradient(900px 420px at 82% -5%, #4c2f1d55, transparent 70%), radial-gradient(650px 330px at 8% 24%, #17352b42, transparent 70%), #0a0e0d;
}
.ai-edit-workspace { max-width: 1540px; margin: 0 auto; }
.ai-edit-header { display:flex; align-items:flex-end; justify-content:space-between; gap:28px; margin-bottom:20px; }
.ai-edit-header-copy { min-width:0; }
.ai-edit-kicker { display:flex; align-items:center; gap:8px; }
.ai-edit-live-mark { width:7px; height:7px; border-radius:50%; background:#ff751f; box-shadow:0 0 0 5px #ff751f1f; }
.ai-edit-eyebrow { margin:0; color:#de9d75; font-size:10px; font-weight:800; letter-spacing:.16em; text-transform:uppercase; }
.ai-edit-version { color:#71817a; font-size:10px; letter-spacing:.02em; }
.ai-edit-header h1 { margin:11px 0 8px; color:#f8f6f4; font:650 clamp(32px, 4.5vw, 58px)/.98 Space,Inter,system-ui,sans-serif; letter-spacing:-.065em; }
.ai-edit-header p:not(.ai-edit-eyebrow) { max-width:680px; margin:0; color:#9ca9a2; font-size:13px; line-height:1.6; }
.ai-edit-header-actions { display:flex; align-items:center; gap:9px; flex-shrink:0; }
.ai-edit-account-pill { display:inline-flex; align-items:center; gap:8px; max-width:220px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; padding:9px 12px; border:1px solid #dca07a2e; border-radius:999px; color:#eec7af; background:#162117; font-size:11px; }
.ai-edit-account-pill i { width:6px; height:6px; flex:0 0 6px; border-radius:50%; background:#ff751f; }
.ai-edit-credit-pill { display:inline-flex; align-items:center; gap:4px; padding:7px 9px; border:1px solid #ff751f36; border-radius:999px; color:#ef782e; background:#ff751f0d; font-size:10px; white-space:nowrap; }
.ai-edit-icon-action { display:grid; place-items:center; width:38px; height:38px; border:1px solid #ffffff16; border-radius:11px; color:#b4c2ba; background:#121817; font-size:20px; transition:transform .25s, border-color .2s, color .2s; }
.ai-edit-icon-action:hover { color:#ff751f; border-color:#e0976a70; transform:rotate(20deg); }
.ai-edit-readiness { display:flex; align-items:center; flex-wrap:wrap; gap:9px; min-height:42px; margin-bottom:17px; padding:10px 13px; border:1px solid #ffffff12; border-radius:12px; color:#aebbb4; background:#111817c9; font-size:11px; }
.ai-edit-readiness.ready { color:#ebc2a8; border-color:#da936745; background:#142017; }
.ai-edit-readiness-dot { width:8px; height:8px; flex:0 0 8px; border-radius:50%; background:#7c8a83; box-shadow:0 0 0 4px #7c8a8320; }
.ai-edit-readiness.ready .ai-edit-readiness-dot { background:#ff751f; box-shadow:0 0 0 4px #ff751f20; }
.ai-edit-readiness-note { flex:1 1 220px; color:#75847c; line-height:1.4; }
.ai-edit-readiness .text-button { margin-left:auto; color:#f1782d; font-size:11px; }
.ai-edit-refresh-link { margin-left:0 !important; }
.ai-edit-grid { display:grid; grid-template-columns:minmax(0, 1.12fr) minmax(360px, .88fr); gap:18px; align-items:start; }
.ai-edit-composer, .ai-edit-side { display:grid; gap:16px; min-width:0; }
.ai-edit-side { position:sticky; top:calc(var(--header) + 18px); }
.ai-edit-panel { min-width:0; padding:20px; border:1px solid #ffffff12; border-radius:18px; background:linear-gradient(145deg,#151c1a,#101514 72%); box-shadow:0 20px 60px #0003; }
.ai-edit-panel-heading { display:flex; align-items:flex-start; justify-content:space-between; gap:14px; margin-bottom:15px; }
.ai-edit-panel-heading h2 { margin:6px 0 0; color:#f0f5f1; font:600 19px/1.15 Space,Inter,system-ui,sans-serif; letter-spacing:-.035em; }
.ai-edit-section-line { display:flex; align-items:center; gap:8px; }
.ai-edit-section-hint { color:#74847b; font-size:10px; }
.ai-edit-model-chip, .ai-edit-counter, .ai-edit-status-badge, .ai-edit-selected-label, .ai-edit-output-summary { display:inline-flex; align-items:center; gap:5px; white-space:nowrap; padding:6px 9px; border:1px solid #ffffff17; border-radius:999px; color:#9eaca4; background:#0e1412; font-size:10px; }
.ai-edit-model-chip { color:#eb7932; border-color:#e79b6c44; }
.ai-edit-model-chip i { color:#ff751f; font-style:normal; }
.ai-edit-selected-label, .ai-edit-output-summary { color:#e9b595; border-color:#e79b6c2e; }
.ai-edit-status-badge.status-completed { color:#f87625; border-color:#da946866; background:#152218; }
.ai-edit-status-badge.status-payment-locked { color:#f0d18e; border-color:#efc96d55; background:#241d12; }
.ai-edit-status-badge.status-failed { color:#ffc0b1; border-color:#d9776666; background:#271815; }
.ai-edit-status-badge.status-processing, .ai-edit-status-badge.status-queued { color:#ffdb8b; border-color:#cda45c55; background:#241d12; }
.ai-edit-status-badge.status-draft { color:#9ca9a2; }
.ai-edit-prompt-panel textarea { display:block; width:100%; min-height:148px; resize:vertical; padding:15px 16px; border:1px solid #ffffff17; border-radius:13px; outline:0; color:#f2f7f3; background:#0a100f; line-height:1.65; transition:border-color .2s, box-shadow .2s; }
.ai-edit-prompt-panel textarea::placeholder { color:#68766f; }
.ai-edit-prompt-panel textarea:focus { border-color:#ff751f88; box-shadow:0 0 0 4px #ff751f14; }
.ai-edit-prompt-tools { display:flex; align-items:center; flex-wrap:wrap; gap:7px; margin-top:11px; color:#75837c; font-size:10px; }
.ai-edit-starter { padding:6px 9px; border:1px solid #ffffff14; border-radius:999px; color:#b4c3bb; background:#121a17; font-size:10px; transition:background .2s, border-color .2s, color .2s; }
.ai-edit-starter:hover { color:#ee7930; border-color:#e99e705c; background:#291e18; }
.ai-edit-prompt-meta { display:flex; justify-content:space-between; gap:12px; margin-top:10px; color:#75837c; font-size:10px; }
.ai-edit-prompt-meta span:last-child { color:#9aab9f; }
.ai-edit-dropzone { display:block; min-height:150px; padding:12px; border:1px dashed #ffffff2c; border-radius:14px; outline:0; background:#0d1412; cursor:pointer; transition:border-color .2s, background .2s, transform .2s; }
.ai-edit-dropzone:hover, .ai-edit-dropzone:focus-visible, .ai-edit-dropzone.dragging { border-color:#ff751f; background:#152016; }
.ai-edit-dropzone.busy { opacity:.62; pointer-events:none; }
.ai-edit-dropzone input { display:none; }
.ai-edit-reference-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(92px,1fr)); gap:9px; }
.ai-edit-upload-empty { display:grid; place-items:center; align-content:center; min-height:124px; gap:6px; color:#7f8d85; text-align:center; }
.ai-edit-upload-empty .ai-edit-upload-icon { display:grid; place-items:center; width:34px; height:34px; border:1px solid #e9a07244; border-radius:10px; color:#ff751f; background:#2b1f18; font-size:22px; }
.ai-edit-upload-empty b { color:#dce8df; font-size:12px; }
.ai-edit-upload-empty small { font-size:10px; }
.ai-edit-upload-action { margin-top:2px; color:#f0782e; font-size:10px; }
.ai-edit-reference { position:relative; overflow:hidden; margin:0; aspect-ratio:1; border:1px solid #ffffff1e; border-radius:10px; background:#080c0b; }
.ai-edit-reference img, .ai-edit-reference video { display:block; width:100%; height:100%; object-fit:cover; }
.ai-edit-reference video { background:#050706; pointer-events:none; }
.ai-edit-reference audio { position:absolute; right:5px; bottom:22px; left:5px; width:calc(100% - 10px); height:24px; }
.ai-edit-audio-reference { background:linear-gradient(145deg,#263b30,#101a15); }
.ai-edit-reference-kind { position:absolute; z-index:1; top:6px; left:6px; padding:3px 5px; border:1px solid #ffffff2b; border-radius:5px; color:#f4e7df; background:#06100ccc; font-size:8px; line-height:1; }
.ai-edit-reference-placeholder { display:grid; place-items:center; width:100%; height:100%; color:#ff751f; background:radial-gradient(circle at 50% 40%,#453023,#0a100d 72%); font-size:27px; }
.ai-edit-reference figcaption { position:absolute; right:0; bottom:0; left:0; display:flex; align-items:center; gap:4px; padding:5px 6px; color:#f3f8f4; background:#050706d9; font-size:9px; }
.ai-edit-reference figcaption span { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.ai-edit-reference figcaption button { margin-left:auto; padding:0 2px; color:#fff; font-size:17px; line-height:1; }
.ai-edit-add-source { display:grid; place-items:center; align-content:center; min-height:92px; aspect-ratio:1; border:1px dashed #e9a07245; border-radius:10px; color:#ff751f; background:#122016; font-size:22px; transition:border-color .2s, background .2s, transform .2s; }
.ai-edit-add-source small { margin-top:4px; color:#9caf9f; font-size:9px; }
.ai-edit-add-source:hover { border-color:#ff751f; background:#1a2b19; transform:translateY(-1px); }
.ai-edit-style-reference-wrap { margin-top:12px; padding-top:12px; border-top:1px solid #ffffff0f; }
.ai-edit-style-reference-heading { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; margin-bottom:8px; color:#dce8df; font-size:11px; }
.ai-edit-style-reference-heading div { display:grid; gap:3px; }
.ai-edit-style-reference-heading small { color:#7d8d82; font-size:9px; line-height:1.4; }
.ai-edit-style-reference-heading > span { color:#87988d; font-size:9px; }
.ai-edit-style-dropzone { min-height:90px; padding:8px; }
.ai-edit-style-reference-grid { display:grid; grid-template-columns:minmax(0,150px); }
.ai-edit-style-reference-empty { display:flex; align-items:center; gap:10px; min-height:72px; padding:8px; color:#8c9b91; }
.ai-edit-style-reference-empty > div { display:grid; gap:3px; flex:1; }
.ai-edit-style-reference-empty b { color:#dce8df; font-size:11px; }
.ai-edit-style-reference-empty small { color:#7f8e84; font-size:9px; line-height:1.45; }
.ai-edit-style-reference-empty .ai-edit-upload-icon { display:grid; place-items:center; width:30px; height:30px; flex:0 0 30px; border:1px solid #e9a07244; border-radius:9px; color:#ff751f; background:#2b1f18; font-size:16px; }
.ai-edit-style-reference { aspect-ratio:16/9; }
.ai-edit-asset-footer { display:flex; justify-content:space-between; gap:10px; margin-top:10px; color:#75847b; font-size:10px; }
.ai-edit-source-note, .ai-edit-output-note { margin:9px 0 0; color:#74837a; font-size:10px; line-height:1.45; }
.ai-edit-source-note { padding-left:18px; position:relative; }
.ai-edit-source-note::before { content:"ⓘ"; position:absolute; left:0; color:#c98d67; }
.ai-edit-advanced-settings { overflow:hidden; border:1px solid #ffffff12; border-radius:16px; background:#111817c9; }
.ai-edit-advanced-settings > summary { display:flex; align-items:center; justify-content:space-between; gap:14px; padding:14px 16px; color:#dce8df; cursor:pointer; list-style:none; user-select:none; }
.ai-edit-advanced-settings > summary::-webkit-details-marker { display:none; }
.ai-edit-advanced-settings > summary::marker { content:""; }
.ai-edit-advanced-settings > summary > span { display:grid; gap:3px; min-width:0; }
.ai-edit-advanced-settings > summary b { color:#f4ede9; font-size:12px; }
.ai-edit-advanced-settings > summary small { color:#7f8e84; font-size:10px; line-height:1.35; }
.ai-edit-advanced-settings > summary i { display:grid; place-items:center; width:24px; height:24px; flex:0 0 24px; border:1px solid #ffffff18; border-radius:7px; color:#e8a880; font-size:15px; font-style:normal; transition:transform .2s, background .2s; }
.ai-edit-advanced-settings > summary:hover { background:#182019; }
.ai-edit-advanced-settings[open] > summary { border-bottom:1px solid #ffffff0f; }
.ai-edit-advanced-settings[open] > summary i { transform:rotate(180deg); background:#ff751f14; }
.ai-edit-advanced-body { display:grid; gap:14px; padding:14px; }
.ai-edit-advanced-body > .ai-edit-panel { border-color:#ffffff0d; box-shadow:none; }
.ai-edit-choice-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(170px,1fr)); gap:10px; }
.ai-edit-choice { display:flex; align-items:flex-start; gap:10px; min-height:72px; padding:10px; border:1px solid #ffffff13; border-radius:12px; text-align:left; color:#d8e3dc; background:#101817; transition:transform .2s, border-color .2s, background .2s, box-shadow .2s; }
.ai-edit-choice:hover { border-color:#ff751f6e; background:#172316; transform:translateY(-1px); }
.ai-edit-choice:focus-visible { outline:2px solid #ff751f; outline-offset:2px; border-color:#ff751f; }
.ai-edit-choice.active { border-color:#ff751f; background:#2a1e17; box-shadow:0 0 0 1px #ff751f30 inset, 0 8px 20px #0002; }
.ai-edit-art, .ai-edit-template-art { position:relative; display:block; overflow:hidden; flex:0 0 76px; width:76px; height:52px; border-radius:9px; background:var(--ai-edit-art) center/cover; }
.ai-edit-art::after, .ai-edit-template-art::after { content:""; position:absolute; inset:0; background:linear-gradient(135deg,#06100a18,#06100ab0); }
.ai-edit-art-shade { position:absolute; inset:0; z-index:1; background:linear-gradient(130deg,#ff751f22,transparent 45%,#02060488); }
.ai-edit-choice-icon { position:absolute; z-index:2; right:6px; bottom:5px; display:grid; place-items:center; width:22px; height:22px; border:1px solid #ffffff32; border-radius:7px; color:#ff751f; background:#09120caa; font-size:12px; }
.ai-edit-choice-copy { display:grid; align-content:start; min-width:0; gap:4px; }
.ai-edit-choice-copy b { overflow:hidden; color:#eaf2eb; font-size:11px; text-overflow:ellipsis; white-space:nowrap; }
.ai-edit-choice-copy small { color:#91a097; font-size:10px; line-height:1.35; }
.ai-edit-choice-copy em { width:max-content; padding:3px 5px; border-radius:4px; color:#dda988; background:#e79b6c15; font-size:9px; font-style:normal; }
.ai-edit-choice-use { overflow:hidden; color:#6f8076; font-size:9px; line-height:1.3; text-overflow:ellipsis; white-space:nowrap; }
.ai-edit-template-art { flex-basis:68px; width:68px; height:52px; }
.ai-edit-template-ratio, .ai-edit-template-check { position:absolute; z-index:2; display:grid; place-items:center; }
.ai-edit-template-ratio { top:5px; left:5px; padding:3px 5px; border:1px solid #ffffff2e; border-radius:4px; color:#ecf5ec; background:#06100caa; font-size:8px; }
.ai-edit-template-check { right:5px; bottom:5px; width:18px; height:18px; border-radius:50%; color:#17110d; background:#ff751f; font-size:11px; opacity:0; transform:scale(.7); transition:opacity .2s, transform .2s; }
.ai-edit-template-card.active .ai-edit-template-check { opacity:1; transform:scale(1); }
.ai-edit-output-options { display:grid; grid-template-columns:minmax(165px,.65fr) minmax(0,1fr); gap:15px; margin-top:16px; padding-top:15px; border-top:1px solid #ffffff0d; }
.ai-edit-output-options label { display:grid; align-content:start; gap:9px; color:#87958c; font-size:10px; }
.ai-edit-duration-settings { display:grid; align-content:start; gap:9px; min-width:0; }
.ai-edit-duration-settings > label:first-child { color:#87958c; font-size:10px; }
.ai-edit-duration-hint { min-height:29px; margin:0; color:#728177; font-size:9px; line-height:1.45; }
.ai-edit-duration-presets { overflow:auto; }
.ai-edit-duration-presets button { min-width:58px; white-space:nowrap; }
.ai-edit-duration-value { display:grid; gap:6px; color:#87958c; font-size:9px; }
.ai-edit-duration-value input { width:100%; padding:8px 9px; border:1px solid #ffffff17; border-radius:7px; outline:0; color:#eaf3ea; background:#0a100e; font-size:11px; }
.ai-edit-duration-value input:focus { border-color:#ff751f88; box-shadow:0 0 0 3px #ff751f14; }
.ai-edit-duration-value input:disabled { opacity:.52; }
.ai-edit-segmented, .ai-edit-duration-presets { display:flex; gap:4px; padding:3px; border:1px solid #ffffff12; border-radius:9px; background:#0b110f; }
.ai-edit-segmented button, .ai-edit-duration-presets button { flex:1; padding:7px 6px; border-radius:6px; color:#87958d; font-size:10px; }
.ai-edit-segmented button:hover, .ai-edit-duration-presets button:hover { color:#f7ede7; background:#ffffff0b; }
.ai-edit-segmented button.active, .ai-edit-duration-presets button.active { color:#20140d; background:#ff751f; font-weight:750; }
.ai-edit-ratio-select { display:none; }
.ai-edit-output-options output { float:right; color:#ef782e; font-weight:700; }
.ai-edit-output-options input[type=range] { width:100%; accent-color:#ff751f; }
.ai-edit-submit-row { display:flex; align-items:center; justify-content:space-between; gap:18px; padding:5px 3px 0; }
.ai-edit-submit-summary { display:flex; align-items:center; gap:8px; }
.ai-edit-submit-summary b { color:#eef6ee; font-size:13px; }
.ai-edit-summary-dot { width:7px; height:7px; border-radius:50%; background:#ff751f; box-shadow:0 0 0 4px #ff751f1d; }
.ai-edit-submit-copy small { display:block; margin-top:6px; color:#819087; font-size:10px; }
.ai-edit-submit-copy .ai-edit-cost-policy { color:#be8e70; }
.ai-edit-submit { min-width:164px; padding:12px 17px; border-radius:11px; }
.ai-edit-submit span { font-size:14px; }
.ai-edit-submit:disabled { filter:grayscale(.45); }
.ai-edit-preview-panel { padding-bottom:15px; }
.ai-edit-preview { position:relative; overflow:hidden; min-height:290px; border:1px solid #ffffff13; border-radius:13px; background:#070b0a; }
.ai-edit-preview[data-ai-edit-ratio-view="9:16"] { aspect-ratio:9/16; min-height:380px; max-height:620px; }
.ai-edit-preview[data-ai-edit-ratio-view="1:1"] { aspect-ratio:1; }
.ai-edit-preview-video { display:block; width:100%; max-height:590px; background:#000; }
.ai-edit-output-locked { min-height:290px; background:radial-gradient(circle at 50% 35%,#32251d 0,#0b100d 58%); }
.ai-edit-output-locked > span:first-child { color:#efcf83; font-size:33px; }
.ai-edit-output-locked small { color:#c8b2a5; font-size:9px; }
.ai-edit-preview-placeholder { display:grid; place-items:center; align-content:center; min-height:290px; gap:8px; padding:26px; color:#7f8e85; text-align:center; }
.ai-edit-preview-placeholder > span:first-child { color:#ff751f; font-size:36px; }
.ai-edit-preview-placeholder b { color:#e1ece3; font-size:13px; }
.ai-edit-preview-placeholder p { max-width:300px; margin:0; color:#84938a; font-size:11px; line-height:1.55; }
.ai-edit-draft-preview { position:relative; overflow:hidden; isolation:isolate; background:#102018; }
.ai-edit-preview-art { position:absolute; inset:0; background:var(--ai-edit-art) center/cover; filter:saturate(.85); }
.ai-edit-preview-art::after { content:""; position:absolute; inset:0; background:linear-gradient(180deg,#0509081c 10%,#050908c9 94%); }
.ai-edit-preview-art-glow { position:absolute; top:15%; left:16%; width:35%; height:35%; border-radius:50%; background:#ff751f46; filter:blur(30px); }
.ai-edit-preview-art-label { position:absolute; z-index:1; top:16px; left:17px; padding:5px 7px; border:1px solid #ffffff35; border-radius:5px; color:#f7eee8; background:#08110bcc; font-size:9px; letter-spacing:.08em; text-transform:uppercase; }
.ai-edit-preview-overlay { position:absolute; z-index:2; inset:auto 0 0; display:grid; justify-items:start; gap:6px; padding:22px 19px; text-align:left; }
.ai-edit-preview-overlay .ai-edit-preview-play { display:grid; place-items:center; width:32px; height:32px; border-radius:50%; color:#20150e; background:#ff751f; font-size:14px; }
.ai-edit-preview-overlay b { font-size:15px; }
.ai-edit-preview-overlay p { max-width:100%; }
.ai-edit-preview-meta { display:flex; flex-wrap:wrap; gap:6px; margin-top:11px; }
.ai-edit-preview-meta span { padding:5px 7px; border-radius:5px; color:#a7b5ac; background:#ffffff09; font-size:9px; }
.ai-edit-usage { display:grid; gap:9px; margin-top:12px; padding:11px 12px; border:1px solid #e79b6c26; border-radius:11px; background:linear-gradient(135deg,#132016,#0d1411); }
.ai-edit-usage.is-locked { border-color:#efc96d42; background:linear-gradient(135deg,#211c12,#11120d); }
.ai-edit-usage.is-locked .ai-edit-usage-heading span { color:#f1ce83; }
.ai-edit-usage.is-settled .ai-edit-usage-heading span { color:#e9a57a; }
.ai-edit-usage-heading { display:flex; align-items:center; justify-content:space-between; gap:8px; color:#ebddd5; font-size:10px; }
.ai-edit-usage-heading span { color:#cf9673; font-size:9px; }
.ai-edit-usage-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:6px; }
.ai-edit-usage-grid span { display:grid; gap:3px; min-width:0; padding:6px 7px; border:1px solid #ffffff0c; border-radius:7px; background:#0a110e; }
.ai-edit-usage-grid small { overflow:hidden; color:#718177; font-size:8px; text-overflow:ellipsis; white-space:nowrap; }
.ai-edit-usage-grid b { overflow:hidden; color:#f8efe9; font-size:10px; text-overflow:ellipsis; white-space:nowrap; }
.ai-edit-usage-policy, .ai-edit-usage-estimate p { margin:0; color:#75857a; font-size:9px; line-height:1.45; }
.ai-edit-usage-lock { margin:0; padding:8px 9px; border:1px solid #efc96d39; border-radius:7px; color:#eed28e; background:#efc96d0c; font-size:9px; line-height:1.45; }
.ai-edit-usage-estimate { border-style:dashed; }
.ai-edit-stage-list { display:grid; grid-template-columns:repeat(3,1fr); gap:7px; margin-top:15px; }
.ai-edit-stage-list span { display:flex; align-items:center; gap:6px; min-width:0; color:#65756d; font-size:9px; line-height:1.2; }
.ai-edit-stage-list span.active { color:#f5bf9d; }
.ai-edit-stage-list span.done { color:#b7896d; }
.ai-edit-stage-list i { display:grid; place-items:center; width:19px; height:19px; flex:0 0 19px; border:1px solid #ffffff17; border-radius:50%; color:#7c8b82; background:#121a16; font-style:normal; font-size:9px; }
.ai-edit-stage-list .active i { border-color:#ff751f; color:#20140d; background:#ff751f; }
.ai-edit-stage-list .done i { border-color:#ae7754; color:#ec7932; }
.ai-edit-error { margin:11px 0 0; padding:9px 10px; border:1px solid #cc706055; border-radius:8px; color:#ffc3b4; background:#2b1815; font-size:10px; }
.ai-edit-history { display:grid; gap:9px; }
.ai-edit-history-card { display:grid; grid-template-columns:58px minmax(0,1fr) auto; align-items:center; gap:10px; padding:9px; border:1px solid #ffffff10; border-radius:12px; outline:0; background:#101817; cursor:pointer; transition:border-color .2s, background .2s, transform .2s; }
.ai-edit-history-card:hover, .ai-edit-history-card.selected, .ai-edit-history-card:focus-visible { border-color:#ff751f72; background:#172316; transform:translateY(-1px); }
.ai-edit-history-thumb { display:grid; place-items:center; width:58px; height:58px; border-radius:9px; color:#ff751f; background:linear-gradient(140deg,#2a4b32,#14201c); font-size:18px; }
.ai-edit-history-status { color:#f3d48b; background:linear-gradient(140deg,#4a3a20,#211b13); font-size:11px; }
.ai-edit-history-locked { color:#efcf83; font-size:16px; }
.ai-edit-history-card-locked { border-color:#efc96d2e; }
.ai-edit-history-payment-lock { padding:6px 7px; border:1px solid #efc96d35; border-radius:6px; color:#e8c979; background:#efc96d0b; font-size:9px; white-space:nowrap; }
.ai-edit-pay-button { border-color:#ff751f66; color:#ff751f; background:#2a1e16; }
.ai-edit-pay-button:hover { border-color:#ff751f; background:#3a281d; }
.ai-edit-history-info { min-width:0; }
.ai-edit-history-info>b { display:block; overflow:hidden; color:#e4ede6; font-size:11px; text-overflow:ellipsis; white-space:nowrap; }
.ai-edit-history-info>p { margin:5px 0 0; overflow:hidden; color:#839189; font-size:9px; text-overflow:ellipsis; white-space:nowrap; }
.ai-edit-history-actions { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:5px; }
.ai-edit-workspace .small-button { padding:7px 9px; font-size:10px; }
.ai-edit-history-empty { display:grid; place-items:center; gap:6px; padding:32px 12px; color:#829188; text-align:center; }
.ai-edit-history-empty span { color:#ff751f; font-size:29px; }
.ai-edit-history-empty p { max-width:260px; margin:0; font-size:11px; line-height:1.5; }
.ai-edit-progress { display:flex; align-items:center; gap:8px; width:100%; margin-top:8px; }
.ai-edit-progress-track { height:4px; overflow:hidden; flex:1; border-radius:99px; background:#27332b; }
.ai-edit-progress-track i { display:block; height:100%; border-radius:99px; background:linear-gradient(90deg,#bb774c,#ff751f); }
.ai-edit-progress>b { color:#ff751f; font-size:9px; }
.ai-edit-upload-progress { display:grid; gap:6px; margin-top:10px; padding:10px 11px; border:1px solid #e79b6c2b; border-radius:10px; color:#9eafa4; background:#101b14; font-size:9px; }
.ai-edit-upload-progress > div:first-child { display:flex; align-items:center; justify-content:space-between; gap:10px; }
.ai-edit-upload-progress b { color:#f0c7ad; font-size:10px; }
.ai-edit-upload-progress span { min-width:0; overflow:hidden; color:#84948a; text-overflow:ellipsis; white-space:nowrap; }
.ai-edit-upload-progress .ai-edit-progress { margin-top:0; }
.ai-edit-upload-progress small { color:#76867c; }
.ai-edit-local-link { white-space:nowrap; }
.ai-edit-spinner { animation:ai-edit-spin 1s linear infinite; }
@keyframes ai-edit-spin { to { transform:rotate(360deg); } }
@media (max-width: 1050px) {
  .ai-edit-page { padding-inline:18px; }
  .ai-edit-grid { grid-template-columns:minmax(0,1fr) minmax(310px,.76fr); }
  .ai-edit-side { position:static; }
}
@media (max-width: 820px) {
  .ai-edit-page { padding:22px 13px 45px; }
  .ai-edit-header { align-items:flex-start; flex-direction:column; gap:16px; }
  .ai-edit-header-actions { width:100%; }
  .ai-edit-account-pill { margin-left:auto; }
  .ai-edit-grid { grid-template-columns:1fr; }
  .ai-edit-side { grid-row:1; }
  .ai-edit-preview-panel { order:-1; }
}
@media (max-width: 560px) {
  .ai-edit-panel { padding:15px; border-radius:15px; }
  .ai-edit-panel-heading h2 { font-size:17px; }
  .ai-edit-section-hint, .ai-edit-prompt-meta span:last-child { display:none; }
  .ai-edit-output-options { grid-template-columns:1fr; }
  .ai-edit-submit-row { align-items:stretch; flex-direction:column; padding-inline:0; }
  .ai-edit-submit { width:100%; }
  .ai-edit-history-card { grid-template-columns:48px minmax(0,1fr); }
  .ai-edit-history-thumb { width:48px; height:48px; }
  .ai-edit-history-actions { grid-column:2; justify-content:flex-start; }
  .ai-edit-stage-list { gap:4px; }
  .ai-edit-stage-list span { font-size:8px; }
  .ai-edit-stage-list i { width:17px; height:17px; flex-basis:17px; font-size:8px; }
  .ai-edit-asset-footer { align-items:flex-start; flex-direction:column; gap:3px; }
  .ai-edit-output-note, .ai-edit-source-note { font-size:9px; }
  .ai-edit-usage-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (prefers-reduced-motion: reduce) {
  .ai-edit-spinner, .ai-edit-choice, .ai-edit-icon-action { animation:none; transition:none; }
}

/* AI Edit Studio visual pass: one coherent surface layer and breakpoint-safe
   workspace. The base selectors above remain the interaction contract; these
   rules only refine the product surface and deliberately reset the previous
   narrow-grid cascade. */
.ai-edit-page {
  --ai-ink:#f6f4f2; --ai-muted:#8d9992; --ai-line:rgba(255,255,255,.10);
  --ai-soft:rgba(255,255,255,.065); --ai-field:#0c1210; --ai-lime:#ff751f;
  padding:clamp(22px,3vw,44px) clamp(12px,4vw,64px) 72px;
  background:radial-gradient(760px 360px at 86% -8%,rgba(113,65,35,.22),transparent 72%),radial-gradient(560px 380px at -8% 28%,rgba(20,68,51,.18),transparent 72%),#0a0e0d;
}
.ai-edit-workspace { width:min(100%,1480px); max-width:none; margin:0 auto; }
.ai-edit-header { align-items:flex-end; gap:28px; margin-bottom:18px; }
.ai-edit-kicker { flex-wrap:wrap; min-height:18px; }
.ai-edit-header h1 { margin:10px 0 7px; font-size:clamp(30px,4vw,48px); line-height:1; }
.ai-edit-header p:not(.ai-edit-eyebrow) { max-width:680px; color:#9ca8a1; font-size:13px; line-height:1.55; }
.ai-edit-header-actions { flex-wrap:wrap; gap:8px; }
.ai-edit-account-pill { min-height:36px; padding:8px 11px; background:#152019; }
.ai-edit-credit-pill { min-height:34px; padding:7px 10px; background:rgba(255,117,31,.06); }
.ai-edit-icon-action { width:36px; height:36px; border-radius:10px; }
.ai-edit-readiness { min-height:44px; margin-bottom:18px; padding:10px 13px; border-radius:12px; background:rgba(17,24,21,.92); }
.ai-edit-grid { grid-template-columns:minmax(0,1.08fr) minmax(400px,.92fr); gap:20px; min-width:0; }
.ai-edit-composer,.ai-edit-side { min-width:0; gap:16px; }
.ai-edit-side { top:calc(var(--header) + 16px); }
.ai-edit-panel { min-width:0; padding:20px; border-color:var(--ai-line); border-radius:16px; background:linear-gradient(145deg,#171d1a 0%,#121816 78%); box-shadow:0 18px 48px rgba(0,0,0,.20),inset 0 1px rgba(255,255,255,.025); }
.ai-edit-panel-heading { gap:14px; margin-bottom:14px; }
.ai-edit-panel-heading > div { min-width:0; }
.ai-edit-panel-heading h2 { margin-top:6px; font-size:19px; line-height:1.18; }
.ai-edit-section-line { flex-wrap:wrap; }
.ai-edit-prompt-panel textarea { min-height:142px; padding:14px 15px; border-color:var(--ai-line); border-radius:11px; background:var(--ai-field); font-size:13px; }
.ai-edit-prompt-tools { margin-top:10px; }
.ai-edit-dropzone { min-height:142px; padding:11px; border-color:rgba(255,255,255,.20); border-radius:12px; background:#0d1412; }
.ai-edit-reference-grid { grid-template-columns:repeat(auto-fill,minmax(94px,1fr)); gap:8px; }
.ai-edit-upload-empty { min-height:116px; }
.ai-edit-choice-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:9px; }
.ai-edit-choice { min-width:0; min-height:70px; padding:9px; border-color:var(--ai-soft); border-radius:11px; background:#101816; }
.ai-edit-choice-copy { min-width:0; }
.ai-edit-choice-copy b { font-size:11px; }
.ai-edit-choice-copy small { font-size:9px; }
.ai-edit-art,.ai-edit-template-art { flex-basis:70px; width:70px; height:49px; }
.ai-edit-template-art { flex-basis:62px; width:62px; height:47px; }
.ai-edit-output-options { grid-template-columns:minmax(145px,.55fr) minmax(0,1fr); gap:14px; margin-top:15px; padding-top:14px; }
.ai-edit-submit-row { gap:16px; padding-top:4px; }
.ai-edit-submit { min-width:164px; min-height:43px; border-radius:10px; }
.ai-edit-preview { min-height:280px; aspect-ratio:16/10; border-color:var(--ai-line); border-radius:12px; }
.ai-edit-preview[data-ai-edit-ratio-view="9:16"],.ai-edit-preview[data-ai-edit-ratio-view="1:1"],.ai-edit-preview[data-ai-edit-ratio-view="4:3"] { aspect-ratio:16/10; min-height:280px; max-height:none; }
.ai-edit-preview-video { width:100%; height:100%; max-height:640px; object-fit:contain; }
.ai-edit-output-locked,.ai-edit-preview-placeholder { min-height:280px; }
.ai-edit-preview-placeholder { gap:8px; padding:26px; }
.ai-edit-preview-placeholder > span:first-child { font-size:34px; }
.ai-edit-preview-placeholder b { font-size:13px; }
.ai-edit-preview-placeholder p { max-width:320px; font-size:10px; }
.ai-edit-preview-meta { gap:5px; margin-top:10px; }
.ai-edit-preview-meta span { padding:5px 7px; border:1px solid var(--ai-soft); background:rgba(255,255,255,.04); }
.ai-edit-usage { margin-top:12px; padding:11px 12px; border-radius:10px; }
.ai-edit-usage-grid { gap:5px; }
.ai-edit-usage-grid span { padding:6px; }
.ai-edit-history-panel { margin-top:20px; }
.ai-edit-history { grid-template-columns:repeat(auto-fit,minmax(330px,1fr)); gap:8px; }
.ai-edit-history-card { min-width:0; padding:9px; border-radius:11px; background:#101816; }
.ai-edit-history-info { min-width:0; }
.ai-edit-history-info>b,.ai-edit-history-info>p { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.ai-edit-state-icon { display:grid; place-items:center; width:34px; height:34px; border:1px solid rgba(255,255,255,.13); border-radius:50%; color:#a4b2aa; background:#121a16; font-size:22px; }
.ai-edit-state-icon.is-failed,.ai-edit-state-icon.is-canceled { color:#ffb2a3; border-color:rgba(217,119,102,.36); }

@media (max-width:1180px) {
  .ai-edit-grid { grid-template-columns:minmax(0,1fr) minmax(350px,.78fr); }
}
@media (max-width:900px) {
  body:has(.ai-edit-page) { overflow-x:hidden; }
  .ai-edit-page { padding-inline:16px; }
  .ai-edit-header { align-items:flex-start; flex-direction:column; gap:14px; }
  .ai-edit-header-actions { width:100%; justify-content:flex-start; }
  .ai-edit-account-pill { margin-left:auto; }
  .ai-edit-grid { grid-template-columns:minmax(0,1fr); gap:14px; }
  .ai-edit-side { position:static; grid-row:auto; order:0; width:auto; }
  .ai-edit-preview-panel { order:0; }
  .ai-edit-preview { width:100%; height:200px; min-height:200px; max-width:100%; aspect-ratio:auto; }
  .ai-edit-preview-video { width:100%; max-width:100%; min-width:0; height:198px; }
  .ai-edit-history { grid-template-columns:1fr; }
}
@media (max-width:620px) {
  .ai-edit-page { padding:18px 12px 48px; }
  .ai-edit-header h1 { font-size:clamp(30px,10vw,40px); }
  .ai-edit-header p:not(.ai-edit-eyebrow) { font-size:12px; }
  .ai-edit-header-actions { gap:6px; }
  .ai-edit-account-pill { max-width:150px; }
  .ai-edit-panel { padding:15px; border-radius:14px; }
  .ai-edit-panel-heading { gap:9px; }
  .ai-edit-panel-heading h2 { font-size:17px; }
  .ai-edit-section-hint,.ai-edit-prompt-meta span:last-child { display:none; }
  .ai-edit-choice-grid { grid-template-columns:1fr; }
  .ai-edit-output-options { grid-template-columns:1fr; }
  .ai-edit-submit-row { align-items:stretch; flex-direction:column; padding-inline:0; }
  .ai-edit-submit { width:100%; }
  .ai-edit-history-card { grid-template-columns:48px minmax(0,1fr); }
  .ai-edit-history-thumb { width:48px; height:48px; }
  .ai-edit-history-actions { grid-column:2; justify-content:flex-start; }
  .ai-edit-usage-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .ai-edit-asset-footer { align-items:flex-start; flex-direction:column; gap:3px; }
}
@media (prefers-reduced-motion:reduce) {
  .ai-edit-spinner,.ai-edit-choice,.ai-edit-icon-action { animation:none; transition:none; }
}