/* One welcome screen, with all entry actions visible without scrolling. */
body:not(.workspace-open){overflow:hidden;min-width:0}
body:not(.workspace-open) #app{position:fixed;inset:0;width:100%;height:100%;overflow:hidden;visibility:hidden;pointer-events:none}
.landing{position:fixed;inset:0;z-index:100;display:grid;grid-template-rows:76px minmax(0,1fr) 56px;height:100dvh;overflow:hidden;background:radial-gradient(ellipse at 70% 50%,#29213240,transparent 55%),#111115;color:#f1edf5;font-family:Inter,system-ui,sans-serif}
.landing[hidden]{display:none}.landing *{box-sizing:border-box}.landing a{color:inherit;text-decoration:none}.landing button{font:inherit;cursor:pointer}
.landing-nav,.landing-main,.landing-footer{width:min(1200px,calc(100% - 88px));margin:0 auto;min-height:0}.landing-nav{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #ffffff0d}
.landing-brand{display:flex;align-items:center;gap:9px;font-size:24px;font-weight:700;letter-spacing:-1px}.landing-signin{display:flex;gap:22px;align-items:center;background:transparent;border:1px solid #ffffff1c;border-radius:7px;padding:10px 15px;color:#c8c1d2;font-size:11px!important}.landing-signin:hover{border-color:#bba5d165}
.landing-main{display:grid;align-items:center}.landing-hero{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:64px;padding:32px 0;min-height:0;height:100%}.hero-eyebrow{display:flex;align-items:center;gap:8px;color:#9e90b3;font-size:8px;letter-spacing:2px;font-weight:500}.hero-eyebrow>.hero-signal{width:5px;height:5px;border-radius:50%;background:#bda4d5;flex:none}.hero-eyebrow s{color:#81758f;text-decoration-thickness:1.5px;text-decoration-color:#9f8aac}.hero-eyebrow .hero-rewrite-arrow{color:#7d708a;letter-spacing:0;font-size:13px}.hero-eyebrow strong{font-weight:650;color:#b9e6bf}
.hero-copy h1{font-size:clamp(42px,4.8vw,68px);line-height:1.12;letter-spacing:-2.7px;font-weight:450;margin:24px 0}.hero-copy h1 em{font-family:Georgia,serif;font-weight:400;color:#c5aedb;letter-spacing:-2.5px;white-space:nowrap}.hero-description{max-width:340px;font-size:13px;line-height:1.85;color:#96909f;margin:0 0 28px}
.hero-actions{display:flex;gap:10px;align-items:center}.landing-primary,.landing-secondary{padding:14px 17px;border-radius:7px;font-size:11px!important;font-weight:550!important;white-space:nowrap}.landing-primary{color:#292033;border:1px solid #ddcbea;background:#ddcbea;display:flex;align-items:center;gap:23px}.landing-primary:hover{background:#efe2fa}.landing-secondary{color:#c9bed5;border:1px solid #ffffff1c;background:transparent}.landing-secondary:hover{background:#ffffff06}.hero-note{color:#6f687b;font-size:10px;margin:16px 0 0;line-height:1.6}
.hero-studio{display:flex;flex-direction:column;align-self:center;height:min(61dvh,525px);min-height:0;background:#201d25;border:1px solid #ffffff1a;border-radius:10px;box-shadow:0 30px 70px #0004;transform:perspective(1600px) rotateY(-4deg);overflow:hidden}.studio-top,.studio-bottom{display:flex;align-items:center;gap:8px;color:#ada2b8;padding:13px 15px;flex:none;font-size:9px}.studio-dot{height:6px;width:6px;background:#9f83b8;border-radius:50%}.studio-live{margin-left:auto;font-size:7px;letter-spacing:1.3px;color:#756c80}.studio-canvas{position:relative;flex:1;min-height:0;margin:0 7px;overflow:hidden;border-radius:4px}.studio-canvas>img{display:block;width:100%;height:100%;object-fit:cover}.studio-selection-label{position:absolute;top:17%;left:24%;display:flex;align-items:center;gap:6px;font-size:8px;color:#e7daef;background:#2b2232ed;border:1px solid #c9b1d93d;border-radius:5px;padding:8px}.studio-selection-label i{height:5px;width:5px;background:#c7a1dd;border-radius:50%}.studio-selection-label span{margin-left:7px;font-size:7px;color:#9e8eab}.studio-prompt{position:absolute;left:11%;right:11%;bottom:10%;display:flex;align-items:center;gap:11px;padding:15px;background:#251f2ced;border:1px solid #ffffff1e;border-radius:7px;box-shadow:0 8px 25px #0003;font-size:10px;color:#e1d4eb}.studio-spark{font-size:21px;color:#c6a4dd}.studio-prompt small{display:block;margin-top:5px;color:#9986a9;font-size:8px}.studio-bottom{gap:24px;font-size:8px;padding:13px 15px}.studio-check{margin-left:auto;color:#bea1d0}
.landing-footer{display:flex;justify-content:space-between;align-items:center;border-top:1px solid #ffffff0c;font-size:9px;color:#6e6479}
@media(max-width:1000px){.landing-nav,.landing-main,.landing-footer{width:calc(100% - 48px)}.landing-hero{gap:30px}.hero-copy h1{font-size:48px}.hero-copy h1 em{letter-spacing:-2px}.hero-description{font-size:12px}}
@media(max-width:700px){.landing{grid-template-rows:68px minmax(0,1fr) 46px}.landing-nav,.landing-main,.landing-footer{width:calc(100% - 40px)}.landing-hero{grid-template-columns:1fr;padding:20px 0;gap:0}.hero-copy{width:100%;max-width:450px;margin:auto}.hero-studio{display:none}.hero-copy h1{font-size:clamp(38px,8.6vw,56px);margin:22px 0;letter-spacing:-2px}.hero-copy h1 em{letter-spacing:-1.9px}.hero-description{font-size:13px;max-width:320px;margin-bottom:28px}.hero-eyebrow{font-size:8px;letter-spacing:1.6px}.hero-actions{gap:9px}.landing-primary,.landing-secondary{padding:13px 14px!important;font-size:10px!important}.landing-primary{gap:16px}.landing-footer{font-size:8px}.landing-footer>span:last-child{display:none}.hero-note{font-size:10px;margin-top:16px}}
@media(max-height:520px){.landing{grid-template-rows:54px minmax(0,1fr) 32px}.landing-hero{padding:12px 0}.hero-copy h1{font-size:38px;margin:14px 0}.hero-description{font-size:11px;line-height:1.6;margin-bottom:16px}.hero-note{margin-top:9px;font-size:8px}.hero-eyebrow{font-size:7px}.hero-studio{height:64dvh}.landing-primary,.landing-secondary{padding:10px 12px!important}}
@media(prefers-reduced-motion:reduce){.landing *{transition:none!important}}
.key-setup-steps{list-style:none;padding:0;display:grid;gap:15px;margin:24px 0}.key-setup-steps li{display:flex;gap:14px;align-items:flex-start}.key-setup-steps li>span{display:grid;place-items:center;flex-shrink:0;width:29px;height:29px;border-radius:8px;background:#b296ee14;color:#bdb0d8;font-size:10px}.key-setup-steps a,.key-setup-steps strong{font-size:12px;color:#ded5f1;font-weight:600;text-decoration:none}.key-setup-steps small{display:block;font-size:10px;color:#92909e;line-height:1.6;margin-top:4px}#apiKeyDialog{width:min(520px,calc(100vw - 32px))}#apiKeyDialog .private-key-note{font-size:10px;line-height:1.8;background:#ffffff04;border:1px solid #ffffff0b;border-radius:8px;padding:12px;margin-top:16px}
.demo-credits-button{font-size:10px!important;border:1px solid #a993d52c!important;background:#ae92dd0a!important;color:#cbb7ed!important;border-radius:6px}.pro-badge{display:inline-flex;padding:4px 7px;border:1px solid #a88bd239;border-radius:4px;background:#b896e810;color:#c8b5e3;font:600 8px/1.2 Inter,system-ui,sans-serif;letter-spacing:1.3px}.demo-balance{display:flex;align-items:center;gap:18px;margin:26px 0}.demo-balance>strong{font-size:54px;font-weight:500;color:#ddc9fa;letter-spacing:-3px}.demo-balance>span{font-size:13px;color:#cbc4d8}.demo-balance small{display:block;font-size:10px;color:#88818f;margin-top:7px}.credit-rates{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.credit-rates>span{padding:14px;background:#ffffff05;border:1px solid #ffffff0a;border-radius:6px;font-size:11px;color:#98919f}.credit-rates strong{display:block;margin-top:7px;font-size:12px;color:#ddd2e9}.credits-explanation,.credits-disclaimer{font-size:11px!important;line-height:1.7!important;color:#a39aaa}.billing-link{display:block;color:#d6c3eb;font-size:12px;margin:18px 0 10px}.credits-disclaimer{display:block;font-size:10px!important}.credits-dialog{width:min(480px,calc(100vw - 32px));padding:28px}#creditsError{color:#d6b28c;font-size:11px}
[data-credit-label]::after{content:attr(data-credit-label);display:block;font-size:8px;line-height:1.3;letter-spacing:0;font-weight:400;opacity:.7;margin-top:3px}.btn[data-credit-label]{flex-wrap:wrap;display:inline-flex;column-gap:4px}.btn[data-credit-label]::after{flex-basis:100%}.welcome-prompt-generate-button[data-credit-label]{height:auto;padding-top:8px;padding-bottom:8px}.credit-icon-cost{font-size:8px;display:inline-flex;align-items:center;gap:2px}.premium-pill{display:none!important}

/* Keep the AI-for-designers correction readable on narrow phones. */
@media(max-width:480px){.hero-eyebrow{gap:6px;flex-wrap:wrap;letter-spacing:1.15px}.hero-eyebrow .hero-rewrite-arrow{font-size:11px}}


/* Minimal video-first landing: preserve the left message and entry actions. */
.landing{grid-template-rows:76px minmax(0,1fr)}
.landing .hero-studio{display:block;width:100%;height:auto;aspect-ratio:910/512;min-height:0;border:1px solid #ffffff18;border-radius:12px;background:#19161d;box-shadow:0 24px 60px #0005;transform:none;overflow:hidden}
.landing .hero-video{display:block;width:100%;height:100%;object-fit:contain;background:#19161d}
@media(max-width:700px){.landing{grid-template-rows:68px minmax(0,1fr);overflow-y:auto}.landing-main{align-items:center}.landing-hero{height:auto;min-height:100%;grid-template-columns:minmax(0,1fr);gap:22px;padding:22px 0 32px}.landing .hero-studio{display:block;width:100%;max-width:530px;margin:0 auto}.landing .hero-copy{margin:0 auto;width:100%;max-width:530px}.hero-copy h1{margin:16px 0}.hero-description{margin-bottom:20px}}
@media(max-height:520px){.landing .hero-studio{height:auto;aspect-ratio:910/512}}
