.prompt-images{padding:0 0 54px;background:#f5f9fd}
.prompt-images__hero{position:relative;min-height:300px;overflow:hidden;background:#eef6ff}
.prompt-images__hero-art{position:absolute;top:-15px;right:4%;width:min(650px,47vw);height:330px;object-fit:contain;object-position:center}
.prompt-images__hero-inner{position:relative;z-index:1;display:flex;min-height:300px;align-items:center}
.prompt-images__hero-copy{width:min(760px,60%);padding:28px 0 22px}
.prompt-images__hero h1{max-width:760px;margin:.17em 0 .18em;font-size:clamp(2.65rem,4.1vw,4rem);line-height:.97;letter-spacing:-.052em}
.prompt-images__hero .lead{max-width:590px;margin:0;color:#486683;font-size:1rem;line-height:1.45}
.prompt-images__benefits{display:flex;gap:24px;margin:24px 0 0;padding:0;list-style:none}
.prompt-images__benefits li{display:grid;grid-template-columns:38px auto;grid-template-rows:auto auto;column-gap:9px;align-items:center;min-width:0}
.prompt-images__benefits li>span{display:grid;grid-row:1/3;width:38px;height:38px;place-items:center;border:1px solid #cfe2f5;border-radius:50%;color:#087cf0;background:#fff}
.prompt-images__benefits svg{width:18px;height:18px;fill:currentColor}
.prompt-images__benefits strong{font-size:.75rem;line-height:1.2}
.prompt-images__benefits small{color:#617b96;font-size:.66rem;line-height:1.25}
.prompt-images__content{padding-top:18px}
.prompt-images__workspace{display:grid;grid-template-columns:minmax(0,1.56fr) minmax(370px,.94fr);gap:16px;align-items:start}
.prompt-images__form,.prompt-images__output-stack{display:grid;grid-template-columns:minmax(0,1fr);gap:13px;min-width:0}
.prompt-images__output-stack{position:sticky;top:96px}
.prompt-images .prompt-builder-vertical__step,.prompt-images__tips{min-width:0;padding:20px;border-radius:13px;box-shadow:0 8px 24px rgba(19,73,126,.055)}
.prompt-images .builder-section-heading{margin-bottom:16px}
.prompt-images .builder-section-heading>span{width:36px;height:36px;flex-basis:36px}
.prompt-images .builder-section-heading h2{font-size:1.16rem}
.prompt-images .builder-section-heading p{font-size:.82rem}
.prompt-images__fields{display:grid;gap:13px}
.prompt-images__creative-grid{display:grid;grid-template-columns:1.15fr 1fr .9fr;gap:12px}
.prompt-images .field label{margin-bottom:5px;font-size:.78rem}
.prompt-images .field label b{color:#e44f27}
.prompt-images .field label small{color:#71849a;font-size:.68rem;font-weight:600}
.prompt-images .field input,.prompt-images .field select,.prompt-images .field textarea{min-height:42px;padding:9px 11px;border-color:#d2e1ef;border-radius:8px;background:#fff;font-size:.82rem}
.prompt-images .field textarea{min-height:68px;resize:vertical}
.prompt-images .field input:focus,.prompt-images .field select:focus,.prompt-images .field textarea:focus{outline:3px solid rgba(8,124,240,.14);border-color:#087cf0}
.prompt-images__example-list{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:8px}
.prompt-images__example{position:relative;min-width:0;padding:0 0 8px;overflow:hidden;border:1px solid #d5e3ef;border-radius:9px;color:#0d2b55;background:#fff;cursor:pointer;font:inherit;text-align:left;transition:border-color .16s ease,box-shadow .16s ease,transform .16s ease}
.prompt-images__example:hover{transform:translateY(-2px);border-color:#77b8ef;box-shadow:0 8px 18px rgba(19,73,126,.1)}
.prompt-images__example:focus-visible{outline:3px solid rgba(8,124,240,.28);outline-offset:2px}
.prompt-images__example.is-selected{border-color:#087cf0;box-shadow:inset 0 0 0 1px #087cf0,0 8px 18px rgba(19,73,126,.1)}
.prompt-images__example img{display:block;width:100%;height:70px;object-fit:cover}
.prompt-images__example>span{display:block;padding:7px 7px 0;overflow:hidden;font-size:.66rem;font-weight:800;line-height:1.15;text-overflow:ellipsis;white-space:nowrap}
.prompt-images__example>svg{position:absolute;top:5px;right:5px;width:15px;height:15px;fill:#fff;filter:drop-shadow(0 1px 2px rgba(5,35,70,.5));opacity:0}
.prompt-images__example.is-selected>svg{fill:#087cf0;opacity:1}
.prompt-images__example-status{min-height:1.1rem;margin:8px 0 0;color:#237047;font-size:.7rem;font-weight:700}
.prompt-images__field-example{font-size:.76rem}
.prompt-images__field-example .field-example-list{max-height:280px;overflow-y:auto}
.prompt-images__field-example .field-example-confirm[hidden]{display:none}
.prompt-images__generate{display:flex;align-items:center;gap:22px;padding:2px 0 4px}
.prompt-images__submit{display:flex;width:min(240px,100%);min-height:48px;align-items:center;gap:10px;padding:11px 18px;border-color:#ff5a2f;border-radius:9px;background:#ff5a2f;box-shadow:0 9px 20px rgba(255,90,47,.23);cursor:pointer;transition:background-color .16s ease,border-color .16s ease,box-shadow .16s ease,transform .1s ease}
.prompt-images__submit svg{width:15px;height:15px;fill:currentColor}
.prompt-images__submit:hover:not(:disabled){transform:translateY(-1px);background:#f55229;border-color:#f55229;box-shadow:0 12px 25px rgba(255,90,47,.32)}
.prompt-images__submit:active:not(:disabled){transform:translateY(1px)}
.prompt-images__submit:focus-visible{outline:3px solid rgba(8,124,240,.32);outline-offset:3px}
.prompt-images__submit:disabled{opacity:.82;cursor:wait}
.prompt-images__generate p{max-width:280px;margin:0;color:#607995;font-size:.76rem;line-height:1.4}
.prompt-images__spinner{width:15px;height:15px;border:2px solid rgba(255,255,255,.45);border-top-color:#fff;border-radius:50%;animation:prompt-images-spin .7s linear infinite}
.prompt-images__output{padding:20px;border:1px solid #183f68;border-radius:13px;color:#eef7ff;background:#092c52;box-shadow:0 16px 38px rgba(8,45,84,.2);scroll-margin-top:98px}
.prompt-images__output-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}
.prompt-images__output .builder-section-heading{margin-bottom:15px}
.prompt-images__output .builder-section-heading>span{background:#1598f2}
.prompt-images__output .builder-section-heading h2{color:#fff}
.prompt-images__output .builder-section-heading p{color:#bfd3e6}
.prompt-images__live{display:flex;flex:0 0 auto;align-items:center;gap:6px;margin-top:4px;padding:5px 9px;border:1px solid rgba(177,215,245,.25);border-radius:999px;color:#d9edff;background:rgba(255,255,255,.06);font-size:.68rem;font-weight:700}
.prompt-images__live i{width:7px;height:7px;border-radius:50%;background:#55d889;box-shadow:0 0 0 3px rgba(85,216,137,.12)}
.prompt-images__result{display:block;width:100%;min-height:300px;padding:17px;border:1px solid #204b75;border-radius:9px;color:#e9f6ff;background:#082442;resize:vertical;font:500 .8rem/1.65 ui-monospace,Consolas,monospace}
.prompt-images__result::placeholder{color:#9db7cf;opacity:1}
.prompt-images__result:focus{outline:2px solid #49aef4;outline-offset:2px}
.prompt-images__actions{display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:8px;margin-top:13px}
.prompt-images__actions .btn{gap:7px;min-height:42px;padding:9px 10px;border-color:#446785;border-radius:8px;color:#fff;background:#12395f;font-size:.74rem}
.prompt-images__actions .btn:first-child:not(:disabled){border-color:#087cf0;background:#087cf0}
.prompt-images__actions .btn:hover:not(:disabled){border-color:#65b7f5;background:#174872}
.prompt-images__actions .btn:focus-visible{outline:3px solid rgba(113,198,255,.5);outline-offset:2px}
.prompt-images__actions svg{width:14px;height:14px;fill:currentColor}
.prompt-images__feedback{min-height:1.2rem;margin:6px 0 -8px;color:#80dfab;font-size:.72rem;font-weight:800}
.prompt-images__output.is-result-highlighted{animation:prompt-builder-vertical-result 3s ease-in-out 1}
.prompt-images__tips{border:1px solid #d7e5f3;background:#fff}
.prompt-images__support-heading{display:flex;align-items:center;gap:10px}
.prompt-images__support-heading>svg{width:22px;height:22px;fill:#087cf0}
.prompt-images__support-heading h2{margin:0;font-size:.94rem}
.prompt-images__tips ol{display:grid;gap:9px;margin:15px 0 0;padding:0;list-style:none}
.prompt-images__tips li{display:grid;grid-template-columns:28px minmax(0,1fr);gap:10px;align-items:start}
.prompt-images__tips li>b{display:grid;width:28px;height:28px;place-items:center;border:1px solid #cae1f5;border-radius:50%;color:#087cf0;background:#edf7ff;font-size:.72rem}
.prompt-images__tips li>span{display:grid;gap:1px}
.prompt-images__tips strong{font-size:.78rem}
.prompt-images__tips small{color:#607995;font-size:.71rem;line-height:1.35}
.prompt-images__privacy{display:grid;grid-template-columns:34px minmax(0,1fr);gap:11px;padding:17px;border:1px solid #ffc8ae;border-radius:13px;background:#fff8f3}
.prompt-images__privacy>svg{width:24px;height:24px;margin:2px auto 0;fill:#ff5a2f}
.prompt-images__privacy h2{margin:0;color:#d94a25;font-size:.92rem}
.prompt-images__privacy p{margin:3px 0 0;color:#6c6f78;font-size:.75rem;line-height:1.45}
.prompt-images__resources{margin-top:48px;padding-top:25px;border-top:1px solid #d6e4f2}
.prompt-images__resources-heading{display:flex;align-items:end;justify-content:space-between;gap:24px}
.prompt-images__resources-heading h2{margin:.18em 0 .1em;font-size:clamp(1.8rem,2.7vw,2.5rem);letter-spacing:-.035em}
.prompt-images__resources-heading p{margin:0;color:#5d7690}
.prompt-images__resources-heading>a{display:inline-flex;align-items:center;gap:8px;color:#087cf0;font-size:.8rem;font-weight:800;text-decoration:none}
.prompt-images__resources-heading>a svg{width:13px;height:13px;fill:currentColor}
.prompt-images__resource-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:20px}
.prompt-images__resource-grid>a{display:grid;grid-template-columns:46px minmax(0,1fr) 18px;gap:12px;align-items:center;padding:17px;border:1px solid #d8e6f3;border-radius:13px;color:#0d2b55;background:#fff;text-decoration:none;box-shadow:0 7px 20px rgba(19,73,126,.045);transition:transform .16s ease,border-color .16s ease,box-shadow .16s ease}
.prompt-images__resource-grid>a:hover{transform:translateY(-2px);border-color:#8fc4ef;box-shadow:0 11px 25px rgba(19,73,126,.09)}
.prompt-images__resource-grid>a:focus-visible{outline:3px solid rgba(8,124,240,.25);outline-offset:3px}
.prompt-images__resource-grid>a>span{display:grid;width:46px;height:46px;place-items:center;border-radius:12px;color:#087cf0;background:#e8f4ff}
.prompt-images__resource-grid>a:nth-child(2)>span{color:#0ca978;background:#e7f9f1}
.prompt-images__resource-grid>a:nth-child(3)>span{color:#7a35ea;background:#f2eaff}
.prompt-images__resource-grid>a>span svg{width:21px;height:21px;fill:currentColor}
.prompt-images__resource-grid>a>svg{width:14px;height:14px;fill:#087cf0}
.prompt-images__resource-grid div{display:grid;gap:2px}
.prompt-images__resource-grid strong{font-size:.86rem}
.prompt-images__resource-grid small{color:#607995;font-size:.72rem;line-height:1.35}
@keyframes prompt-images-spin{to{transform:rotate(360deg)}}
@media(min-width:981px){.prompt-images .container{width:min(1420px,88vw)}}
@media(max-width:980px){
    .prompt-images__workspace{grid-template-columns:minmax(0,1.4fr) minmax(315px,.8fr)}
    .prompt-images__creative-grid{grid-template-columns:1fr 1fr}
    .prompt-images__creative-grid .field:last-child{grid-column:1/-1}
    .prompt-images__example-list{grid-template-columns:repeat(3,minmax(0,1fr))}
    .prompt-images__benefits{gap:14px}
    .prompt-images__benefits small{display:none}
}
@media(max-width:780px){
    .prompt-images__hero-art{top:12px;right:-15%;width:68%;height:265px;opacity:.34}
    .prompt-images__hero-copy{width:78%}
    .prompt-images__workspace{grid-template-columns:1fr}
    .prompt-images__output-stack{position:static}
    .prompt-images__resource-grid{grid-template-columns:1fr}
}
@media(max-width:560px){
    .prompt-images{padding-bottom:38px}
    .prompt-images__hero,.prompt-images__hero-inner{min-height:390px}
    .prompt-images__hero-art{top:auto;right:-10%;bottom:-6px;width:92%;height:225px;opacity:.58}
    .prompt-images__hero-copy{width:100%;padding:25px 0 185px}
    .prompt-images__hero h1{max-width:340px;font-size:2.2rem}
    .prompt-images__hero .lead{max-width:350px;font-size:.9rem}
    .prompt-images__benefits{display:none}
    .prompt-images__content{padding-top:13px}
    .prompt-images .prompt-builder-vertical__step,.prompt-images__tips,.prompt-images__output{padding:16px}
    .prompt-images__creative-grid{grid-template-columns:1fr}
    .prompt-images__creative-grid .field:last-child{grid-column:auto}
    .prompt-images__example-list{display:flex;margin:0 -2px;padding:2px 2px 9px;overflow-x:auto;scroll-snap-type:x mandatory}
    .prompt-images__example{flex:0 0 118px;scroll-snap-align:start}
    .prompt-images__example img{height:78px}
    .prompt-images__generate{display:grid;gap:9px}
    .prompt-images__submit{width:100%}
    .prompt-images__generate p{text-align:center}
    .prompt-images__output-heading{display:block}
    .prompt-images__live{display:none}
    .prompt-images__result{min-height:250px}
    .prompt-images__actions{grid-template-columns:1fr}
    .prompt-images__resources{margin-top:38px}
    .prompt-images__resources-heading{display:grid;align-items:start}
    .prompt-images__resource-grid>a{grid-template-columns:42px minmax(0,1fr) 18px;padding:14px}
    .prompt-images__resource-grid>a>span{width:42px;height:42px}
}
@media(prefers-reduced-motion:reduce){
    .prompt-images__submit,.prompt-images__example,.prompt-images__resource-grid>a{transition:none}
    .prompt-images__submit:hover:not(:disabled),.prompt-images__example:hover,.prompt-images__resource-grid>a:hover{transform:none}
    .prompt-images__spinner{animation:none}
    .prompt-images__output.is-result-highlighted{animation:none;box-shadow:inset 0 0 0 1px rgba(255,229,207,.88),0 0 0 4px rgba(255,106,50,.9),0 0 32px rgba(255,106,50,.44),0 16px 38px rgba(8,45,84,.24)}
}
