/* Make Prompt AI — Cyber Noir Dashboard v70.0 | Pure CSS3 */
:root{
  color-scheme:dark;--bg:#0D1524;--panel:#172437;--panel-2:#1C2D43;
  --cyan:#39D2B4;--gold:#F4C26B;--violet:#8B42F4;--pink:#D52DF5;
  --blue:#0A7CF5;--text:#E8F1FC;--muted:#9DAEC5;--line:#2A5F88;
  --ease:all .3s ease;
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;min-width:320px;background:var(--bg);color:var(--text);font:14px/1.55 Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",Arial,sans-serif;isolation:isolate}
body::before{content:"";position:fixed;inset:0;z-index:-3;pointer-events:none;background:
linear-gradient(180deg,#020b1c 0%,#071a32 64%,#020b1c 100%);
}
body::after{content:"";position:fixed;inset:0;z-index:-2;pointer-events:none;background:
linear-gradient(90deg,rgba(0,105,255,.10) 0%,transparent 23%,transparent 77%,rgba(0,105,255,.10) 100%),
repeating-linear-gradient(0deg,transparent 0px,transparent 57px,rgba(30,109,185,.085) 58px,transparent 59px),
repeating-linear-gradient(90deg,transparent 0px,transparent 69px,rgba(30,109,185,.07) 70px,transparent 71px),
radial-gradient(ellipse at 50% 100%,rgba(3,81,180,.13),transparent 65%);
}
.ambient{position:fixed;z-index:-1;pointer-events:none;border-radius:50%;filter:blur(90px);opacity:.24}
.ambient-one{width:450px;height:450px;top:8%;left:15%;background:#008dff}
.ambient-two{width:500px;height:500px;right:9%;bottom:12%;background:#e322d6}
button,textarea,select{font:inherit}
button{cursor:pointer}
a{color:inherit;text-decoration:none}
a:focus-visible,button:focus-visible,textarea:focus-visible,select:focus-visible{outline:2px solid #39e8fa;outline-offset:3px}
.site{width:min(1320px,calc(100% - 44px));margin:auto}
.header{display:flex;justify-content:space-between;align-items:center;gap:20px;min-height:70px;padding:10px 20px;border:1px solid #3b7caa66;border-top:0;border-radius:0 0 16px 16px;background:#08152cdd;box-shadow:0 8px 30px #0206178c;backdrop-filter:blur(18px)}
.brand{display:flex;align-items:center;gap:12px;font-size:23px;font-weight:850;white-space:nowrap;letter-spacing:-.5px}
.brand em{color:#47e8e0;font-style:normal}
.brand-mark{display:grid;place-items:center;width:42px;height:42px;color:#70eaff;border-radius:11px;border:1px solid #36d8ff;background:linear-gradient(145deg,#08244c,#0c4081);font-size:29px;font-weight:900;box-shadow:0 0 15px #39D2B4, inset 0 0 15px #0d92ff45}
.nav{display:flex;align-items:center;gap:16px;font-size:11px;font-weight:750}
.nav a{padding:9px 0;transition:var(--ease);white-space:nowrap}
.nav a:hover{color:#66fff2;text-shadow:0 0 12px #39D2B4}
.nav a.active{color:#f3faff}
.nav-cta{flex-shrink:0;padding:10px 19px;border-radius:24px;font-size:12px;font-weight:850;background:linear-gradient(100deg,#02c9f0,#1279ff 65%,#9e3be9);border:1px solid #4bdfff;box-shadow:0 0 15px #39D2B4,0 0 25px #166eff70;transition:var(--ease)}
.nav-cta:hover{transform:translateY(-2px);box-shadow:0 0 25px #39D2B4,0 0 45px #126bff}
.hero{text-align:center;padding:32px 0 22px;text-shadow:0 2px 20px #020a1c}
.eyebrow,.section-kicker{font-size:10px;letter-spacing:2.4px;font-weight:900;color:#42e8df;margin:0}
.hero h1{font-size:clamp(30px,3.65vw,54px);line-height:1.12;letter-spacing:-1.8px;margin:11px 0 10px}
.hero h1 span{background:linear-gradient(100deg,#43f4ff 5%,#5987f8 54%,#e45bed 95%);background-clip:text;-webkit-background-clip:text;color:transparent}
.subtitle{margin:0;font-size:14px;color:#f2f6ff}
.subtitle span{color:#8daac9;padding:0 10px}
.modes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.mode-tab{min-width:0;min-height:82px;display:flex;align-items:center;gap:15px;text-align:left;padding:13px 16px;color:var(--text);border:1px solid #128ae5;border-radius:15px;background:linear-gradient(115deg,#052857e8,#061128f2);box-shadow:0 0 20px #005dff60,inset 0 1px #ffffff24;backdrop-filter:blur(14px);transition:var(--ease)}
.mode-tab:nth-child(2){border-color:#c64cf3;background:linear-gradient(115deg,#2d1451e8,#0b1230f2);box-shadow:0 0 20px #a119ef5c}
.mode-tab:nth-child(3){border-color:#e69a57;background:linear-gradient(115deg,#40203de8,#11142df2);box-shadow:0 0 20px #e8863357}
.mode-tab:hover{transform:translateY(-4px);filter:brightness(1.15)}
.mode-tab[aria-selected=true]{box-shadow:0 0 0 1px #5ceaff,0 0 29px #00aaffb0,inset 0 0 25px #008aff2e}
.mode-icon{display:grid;place-items:center;flex-shrink:0;width:51px;height:51px;border:1px solid #37dcff;border-radius:11px;background:linear-gradient(135deg,#0066bb,#043b7e);box-shadow:0 0 19px #078dff8a;font-size:29px}
.mode-tab:nth-child(2) .mode-icon{background:#7b169a;border-color:#f078ff}
.mode-tab:nth-child(3) .mode-icon{background:#9b481e;border-color:#ffc16c}
.mode-copy{flex:1;min-width:0}.mode-copy strong{display:block;font-size:17px}.mode-copy small{display:block;font-size:11px;color:#cbd7f3}
.mode-arrow{display:grid;place-items:center;width:30px;height:30px;border:1px solid #5c80b7;border-radius:50%;font-size:27px;line-height:1}
.mode-note{text-align:center;color:#c0d2e8;font-size:11px;margin:12px 0}
.layout{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;align-items:stretch}
.panel{min-width:0;padding:21px 23px 19px;border-radius:15px;background:linear-gradient(145deg,#172437ef,#0a162cf5);backdrop-filter:blur(10px);border:1px solid rgba(57,210,180,.45);box-shadow:0 20px 42px #0009,inset 0 1px #ffffff12,0 0 18px #13d9b326;transition:var(--ease)}
.enhanced-prompt{border:1px solid rgba(213,45,245,.65);box-shadow:0 20px 42px #0009,inset 0 1px #ffffff14,0 0 22px #cf29ee35}
.panel:hover{box-shadow:0 22px 48px #0009,inset 0 1px #ffffff18,0 0 25px #14d4e347}
.enhanced-prompt:hover{box-shadow:0 22px 48px #0009,0 0 28px #cf29ee4d}
.panel-heading{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:16px}
.panel-heading h2{font-size:22px;letter-spacing:-.5px;margin:5px 0 0;line-height:1.2}
.chip{border:1px solid #1bbaaa;border-radius:25px;padding:6px 10px;color:#54f3db;background:#003c4355;font-size:10px;font-weight:800;white-space:nowrap}
.field-label{display:block;font-size:12px;font-weight:800;margin:12px 0 7px}
.entry,.model-select{width:100%;background:#071328e8;color:var(--text);border:1px solid #355f94;border-radius:9px;transition:var(--ease)}
.entry{height:107px;resize:vertical;padding:13px;font-size:12px}
.entry::placeholder{color:#829cb9}
.enhanced-prompt .entry{height:108px;resize:none}
.entry:focus,.model-select:focus{border-color:#39D2B4;box-shadow:0 0 0 3px #39D2B426;outline:none}
.model-select{height:46px;padding:0 12px}
.hint{color:var(--muted);font-size:10px;margin:6px 0 15px}
.styles{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.style{min-width:0;padding:0 0 9px;background:#0b1b34;color:#e8f1fc;border:1px solid #335e8e;border-radius:10px;overflow:hidden;font-size:11px;font-weight:800;transition:var(--ease)}
.style:hover{transform:translateY(-4px);border-color:#66e6ff}
.style[aria-pressed=true]{border-color:#39e5f0;box-shadow:0 0 17px #39d2b46e}
.thumb{display:block;width:100%;height:94px;margin-bottom:8px;background-position:center;background-size:cover}
.style[data-style=corporate] .thumb{background-image:none}
.style[data-style=cyber] .thumb{background-image:none}
.style[data-style=photo] .thumb{background-image:none}
.style[data-style=minimal] .thumb{background-image:none}
.actions{display:flex;gap:10px;margin-top:14px}
.btn{border-radius:9px;border:1px solid #41668d;padding:12px 15px;font-size:12px;font-weight:850;color:white;transition:all .3s ease}
.btn:hover{transform:translateY(-2px);filter:brightness(1.13)}
.btn:disabled{opacity:.6;cursor:wait}
.btn.primary{border-color:#23d7f7;background:linear-gradient(100deg,#00bfe9,#2175f5 48%,#c926e8);box-shadow:0 0 18px #008bff5e}
.btn.secondary{background:#1C2D43}
.grow{flex:1}
.stats{display:flex;gap:6px;flex-wrap:wrap;margin-top:9px}
.stat{font-size:10px;color:#b2c7e6;border:1px solid #375984;border-radius:5px;padding:4px 7px;background:#06162d}
.status{font-size:11px;color:#4ff9e6;min-height:15px;margin:10px 0 8px}
.preview{border:1px solid #2b98d9;border-radius:10px;overflow:hidden;box-shadow:0 0 18px #0e76ff47}
.preview-title{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:9px 10px;background:#0b1e38;font-size:11px;font-weight:850}
.preview-badge{color:#40ebea;white-space:nowrap;font-size:10px}
.preview-art{height:179px;position:relative;background:#0d1524 url("assets/city-inspiration-hd.webp") center/cover no-repeat;transition:background-image .3s ease}
.benefits{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));margin:17px 0 28px;border:1px solid #275b8b;border-radius:14px;overflow:hidden;background:#08172ee9;backdrop-filter:blur(12px)}
.benefit{display:flex;align-items:center;gap:12px;padding:16px 13px;min-width:0}
.benefit:not(:last-child){border-right:1px solid #285079}
.benefit-icon{flex-shrink:0;color:#56f5ff;text-shadow:0 0 16px #00bfff;font-size:35px;line-height:1}
.benefit:nth-child(even) .benefit-icon{color:#eb75ff;text-shadow:0 0 16px #d42df5}
.benefit b{display:block;font-size:11px;color:#39e9e2;white-space:nowrap}
.benefit small{display:block;font-size:10px;color:#c2d1e5}
.learn{padding:22px 25px;margin-bottom:23px;border:1px solid #286b9c;border-radius:14px;background:#111e33ef}
.learn h2{margin:0 0 13px;font-size:20px}
.learn-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.learn article{border:1px solid #31567e;border-radius:10px;padding:16px;background:#1C2D43}
.learn article h3{margin:0 0 6px;font-size:15px}
.learn article p{font-size:12px;color:var(--muted);margin:0 0 10px}
.learn article a{font-size:12px;color:#50f3ea}
.disclaimer{font-size:11px;color:var(--muted);margin:15px 0 0}
.footer{display:flex;justify-content:space-between;gap:15px;padding:4px 0 25px;color:#c2d1e3;font-size:12px}
.footer>div{display:flex;gap:15px;flex-wrap:wrap}
.footer a:hover{color:#39D2B4}
@media(max-width:1180px){
 .nav{gap:9px;font-size:10px}.brand{font-size:19px}.benefit{gap:7px;padding:13px 8px}.benefit-icon{font-size:29px}.benefit b{font-size:10px}
}
@media(max-width:950px){
 .nav a:nth-child(n+5){display:none}.site{width:min(100% - 28px,1320px)}.layout{gap:12px}.panel{padding:17px}.styles{gap:6px}.thumb{height:77px}.mode-copy strong{font-size:14px}.mode-tab{gap:9px;padding:10px}.benefits{grid-template-columns:repeat(3,1fr)}.benefit:nth-child(3){border-right:0}.benefit:nth-child(n+4){border-top:1px solid #285079}
}
@media(max-width:720px){
 body::before{background-position:38% center}.header{min-height:65px;padding:8px 11px}.brand{font-size:18px}.brand-mark{width:35px;height:35px;font-size:24px}.nav{display:none}.nav-cta{font-size:11px;padding:9px 12px}.hero{padding:27px 0 20px}.hero h1{font-size:clamp(29px,8vw,42px);letter-spacing:-1px}.subtitle{font-size:12px}.modes{grid-template-columns:1fr;gap:9px}.mode-tab{min-height:67px}.layout{grid-template-columns:1fr}.panel{padding:17px}.thumb{height:110px}.enhanced-prompt .entry{height:130px}.preview-art{height:210px}.benefits{grid-template-columns:repeat(2,1fr)}.benefit:nth-child(3){border-right:1px solid #285079}.benefit:nth-child(2n){border-right:0}.benefit:nth-child(n+3){border-top:1px solid #285079}.learn-grid{grid-template-columns:1fr}.footer{flex-direction:column}
}
@media(max-width:400px){
 .site{width:calc(100% - 18px)}.panel-heading h2{font-size:18px}.chip{font-size:8px}.styles{gap:5px}.thumb{height:74px}.style{font-size:9px}.benefit b{font-size:9px}.benefit small{font-size:9px}.actions{gap:7px}.btn{padding:10px 9px;font-size:11px}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{transition:none!important;animation:none!important}}

/* v72 — independently embedded, sharp visual preset cards */
.styles .style .thumb{display:block;position:relative;overflow:hidden;height:110px;background:none!important;margin-bottom:8px}
.styles .style .thumb img{display:block;width:100%;height:100%;object-fit:cover;object-position:center;transition:transform .35s ease,filter .35s ease;filter:saturate(1.1) contrast(1.05)}
.styles .style:hover .thumb img,.styles .style[aria-pressed="true"] .thumb img{transform:scale(1.055);filter:saturate(1.17) contrast(1.07)}
.styles .style .thumb::after{content:"";position:absolute;inset:55% 0 0;background:linear-gradient(transparent,#06132b44);pointer-events:none}
@media(max-width:950px){.styles .style .thumb{height:95px}}
@media(max-width:400px){.styles .style .thumb{height:76px}}

/* v73: force real image elements to render without old background styles */
.styles .style .thumb{background-image:none!important;display:block!important;overflow:hidden!important}
.styles .style .thumb img{display:block!important;width:100%!important;height:100%!important;object-fit:cover!important;opacity:1!important;visibility:visible!important}

/* v74 clean images: remove old screenshot previews and force distinct image assets */
.preview-art{background-image:url("assets/v74-inspiration-city.webp");background-position:center;background-size:cover}
.styles .style .thumb{height:105px!important;background:none!important}
.styles .style .thumb img{display:block!important;width:100%!important;height:100%!important;object-fit:cover!important}

/* v75 Midnight Grid: CSS-native architectural atmosphere; no screenshot background */
body{background:#050e1e}
.ambient{opacity:.09;filter:blur(110px)}
.ambient-one{background:#0871cc;left:-160px;top:20%}
.ambient-two{background:#0758bc;right:-160px;bottom:10%}
.site{position:relative}
.site::before,.site::after{content:"";position:fixed;top:0;bottom:0;width:clamp(24px,calc((100vw - 1350px)/2),240px);z-index:-1;pointer-events:none;opacity:.6}
.site::before{left:0;border-right:1px solid #0b4d92;background:linear-gradient(90deg,#0a1d35,#05112590),repeating-linear-gradient(0deg,transparent 0 62px,#1764a44d 63px 64px),repeating-linear-gradient(90deg,transparent 0 66px,#1764a438 67px 68px);box-shadow:inset -4px 0 18px #0866b333}
.site::after{right:0;border-left:1px solid #0b4d92;background:linear-gradient(270deg,#0a1d35,#05112590),repeating-linear-gradient(0deg,transparent 0 62px,#1764a44d 63px 64px),repeating-linear-gradient(90deg,transparent 0 66px,#1764a438 67px 68px);box-shadow:inset 4px 0 18px #0866b333}
.mode-tab:nth-child(2),.mode-tab:nth-child(3){border-color:#2565aa;background:linear-gradient(115deg,#092341ee,#06142bee);box-shadow:0 0 15px #005dff32}
.mode-tab:nth-child(2) .mode-icon,.mode-tab:nth-child(3) .mode-icon{background:#093e79;border-color:#378ae4}
.mode-tab[aria-selected=true]{box-shadow:0 0 0 1px #54d8ff,0 0 20px #0089e077}
.enhanced-prompt{border-color:rgba(44,132,210,.65);box-shadow:0 20px 42px #0009,0 0 17px #006aff25}
.enhanced-prompt:hover{box-shadow:0 20px 42px #0009,0 0 20px #168eff3d}
@media(max-width:720px){.site::before,.site::after{display:none}}

/* v79.2 consistent responsive navigation */
header nav[aria-label="Main navigation"],header nav[aria-label="Primary navigation"]{display:flex;flex-wrap:wrap;align-items:center;gap:clamp(7px,1.1vw,16px)}
header nav[aria-label="Main navigation"] a,header nav[aria-label="Primary navigation"] a{font-size:clamp(11px,.88vw,14px);white-space:nowrap;text-decoration:none}
header nav a[aria-current="page"]{color:#39D2B4!important}
@media(max-width:850px){header nav[aria-label="Main navigation"],header nav[aria-label="Primary navigation"]{gap:10px}header nav a{white-space:normal!important}}