/* The public prompt pages, /prompts (prompts/front/*, 2026-11-01). On top of
   front.css; the colours are home-v2's own roles (--panel, --stroke, --text,
   --muted, --purple-soft, --focus), so light and dark both follow
   html[data-theme]. */

/* Dana draws the Latin digits 0-9 as Persian ones in its own character map,
   so "85mm" in an English prompt came out "۸۵mm". front-base.css has the
   digits-only face (hn-latin-digits); these take it too. */
.prompt-text,.prompt-explain code,.prompt-fields input,.prompt-fields select,.prompt-tile-text,.prompt-stage-text,.prompt-byline bdi,.prompt-fa-guide bdi,.prompt-keep-warn bdi,.prompt-stage-cap bdi,.prompts-filters select,.prompts-filters input,.prompts-search input{font-family:"hn-latin-digits",Dana,system-ui,sans-serif}

/* Heads of the lists */
.prompts-hero h1{max-width:900px}
.prompts-hero .prompts-intro{color:var(--muted);font-size:15px;line-height:1.95;max-width:760px;margin:0}
.prompts-count{display:inline-flex;align-items:center;gap:6px;margin-top:6px;padding:6px 14px;border-radius:999px;border:1px solid var(--stroke);background:var(--panel-2);color:var(--muted);font-size:13px;font-weight:700}
.prompts-sr{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* The front of /prompts: title, search, the types, the real numbers */
.prompts-hero.is-front{max-width:none;padding-bottom:28px}
.prompts-hero.is-front h1{font-size:clamp(28px,3.6vw,46px);margin-bottom:10px}
.prompts-search{display:flex;gap:8px;max-width:640px;margin:22px 0 0;padding:6px;border-radius:16px;border:1px solid var(--stroke);background:var(--panel);box-shadow:0 10px 30px #00000014;transition:border-color .18s cubic-bezier(.2,.8,.2,1),box-shadow .18s cubic-bezier(.2,.8,.2,1)}
.prompts-search:focus-within{border-color:var(--purple-soft);box-shadow:0 0 0 3px color-mix(in srgb,var(--purple) 22%,transparent),0 10px 30px #00000014}
.prompts-search input{flex:1;min-width:0;min-height:46px;padding:0 12px;border:0;background:none;color:var(--text);font-size:15px;font-weight:500}
.prompts-search input::placeholder{color:var(--subtle)}
.prompts-search input:focus{outline:none}
.prompts-search .btn{min-height:46px;padding-inline:22px;font-size:14px}
.prompts-search .btn:focus-visible{outline:2px solid var(--focus);outline-offset:2px}
.prompts-typechips{list-style:none;margin:16px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.prompts-typechips a{display:inline-flex;align-items:center;gap:8px;min-height:40px;padding:0 14px;border-radius:999px;border:1px solid var(--stroke);background:var(--panel-2);color:var(--text);font-size:14px;font-weight:700;transition:border-color .18s cubic-bezier(.2,.8,.2,1),background .18s cubic-bezier(.2,.8,.2,1)}
.prompts-typechips a:hover{border-color:var(--purple-soft);background:var(--panel-3)}
.prompts-typechips a:focus-visible{outline:2px solid var(--focus);outline-offset:2px}
.prompts-typechips span{color:var(--muted);font-weight:500;font-size:13px}
.prompts-facts{display:flex;flex-wrap:wrap;gap:6px 0;margin:18px 0 0;color:var(--muted);font-size:14px;line-height:1.8}
.prompts-facts span+span:before{content:"";display:inline-block;width:4px;height:4px;margin-inline:12px;border-radius:50%;background:var(--subtle);vertical-align:middle}
.prompts-facts b{color:var(--text);font-weight:800}

/* The wall of samples: pictures at their own shape, newest-loved first */
.prompts-wall-wrap{padding:8px clamp(18px,4.1vw,74px) 0}
.prompts-wall{list-style:none;margin:0;padding:0;columns:4 230px;column-gap:14px}
.prompts-wall li{break-inside:avoid;margin-bottom:14px}
.wall-tile{position:relative;display:block;border-radius:16px;overflow:hidden;background:var(--panel-2);isolation:isolate}
.wall-tile img{display:block;width:100%;height:auto;transition:transform .5s cubic-bezier(.2,.8,.2,1)}
.wall-tile:after{content:"";position:absolute;inset:auto 0 0;height:55%;background:linear-gradient(transparent,#000000b8);pointer-events:none}
.wall-cap{position:absolute;z-index:1;inset-inline:12px;bottom:10px;color:#fff;font-size:14px;font-weight:700;line-height:1.7;text-wrap:balance;text-shadow:0 1px 8px #00000080}
.wall-tile:hover img{transform:scale(1.04)}
.wall-tile:focus-visible{outline:2px solid var(--focus);outline-offset:3px}

/* Categories: a picture, the name and how many prompts it holds */
.prompts-cats{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:14px}
.prompts-cat{display:flex;flex-direction:column;height:100%;border-radius:16px;overflow:hidden;border:1px solid var(--stroke);background:var(--panel);color:var(--text);transition:border-color .18s cubic-bezier(.2,.8,.2,1),transform .18s cubic-bezier(.2,.8,.2,1)}
.prompts-cat:hover{border-color:var(--purple-soft);transform:translateY(-2px)}
.prompts-cat:focus-visible{outline:2px solid var(--focus);outline-offset:2px}
.prompts-cat-media{position:relative;display:block;aspect-ratio:4/3;overflow:hidden;background:linear-gradient(135deg,var(--panel-3),color-mix(in srgb,var(--purple) 24%,var(--panel-2)))}
.prompts-cat-media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.prompts-cat-body{display:flex;flex-direction:column;gap:2px;padding:12px 14px 14px}
.prompts-cat-body strong{font-size:15px;font-weight:800;line-height:1.7}
.prompts-cat-body span{font-size:13px;color:var(--muted)}

/* Three steps, joined by one line */
.prompts-steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px;counter-reset:step;position:relative}
.prompts-steps:before{content:"";position:absolute;top:21px;inset-inline-start:21px;width:calc((100% - 56px) / 3 * 2 + 56px);height:2px;background:linear-gradient(to left,var(--purple),color-mix(in srgb,var(--purple) 20%,transparent))}
.prompts-steps li{position:relative;counter-increment:step}
.prompts-steps li:before{content:counter(step,persian);display:grid;place-items:center;width:44px;height:44px;margin-bottom:14px;border-radius:50%;background:var(--purple);color:#fff;font-size:18px;font-weight:800;box-shadow:0 0 0 6px var(--bg)}
.prompts-steps strong{display:block;font-size:19px;font-weight:800;margin-bottom:6px}
.prompts-steps p{margin:0;color:var(--muted);font-size:14px;line-height:1.9;max-width:34ch}
.prompts-steps-demo.prompt-text{margin-top:12px;padding:10px 12px;border-radius:12px;border:1px solid var(--stroke);background:var(--panel);font-size:13px;line-height:1.9;max-width:none;text-align:start}

/* The short guide at the foot, closed until asked */
.prompts-more{max-width:820px;border-radius:16px;border:1px solid var(--stroke);background:var(--panel)}
.prompts-more summary{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:56px;padding:12px 18px;cursor:pointer;list-style:none;font-size:16px;font-weight:800;line-height:1.7}
.prompts-more summary::-webkit-details-marker{display:none}
.prompts-more summary:after{content:"";flex:none;width:9px;height:9px;border-inline-end:2px solid var(--muted);border-bottom:2px solid var(--muted);rotate:45deg;translate:0 -3px;transition:rotate .18s cubic-bezier(.2,.8,.2,1)}
.prompts-more[open] summary:after{rotate:225deg;translate:0 3px}
.prompts-more summary:focus-visible{outline:2px solid var(--focus);outline-offset:2px;border-radius:16px}
.prompts-more-body{padding:0 18px 18px}
.prompts-more-body p{margin:0 0 10px;color:var(--muted);font-size:15px;line-height:1.95}
.prompts-more-body a{color:var(--purple-soft);font-weight:700}
.prompts-admin-note{margin:0 0 16px;padding:10px 14px;border-radius:12px;border:1px dashed var(--purple-soft);color:var(--purple-soft);font-size:13px;line-height:1.8}

/* Type tiles and sub-category chips */
.prompts-types{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.prompts-type{display:flex;flex-direction:column;gap:6px;min-height:112px;padding:20px;border-radius:16px;border:1px solid var(--stroke);background:var(--panel);color:var(--text);transition:border-color .18s cubic-bezier(.2,.8,.2,1),transform .18s cubic-bezier(.2,.8,.2,1)}
.prompts-type:hover{border-color:var(--purple-soft);transform:translateY(-2px)}
.prompts-type:focus-visible{outline:2px solid var(--focus);outline-offset:2px}
.prompts-type strong{font-size:18px;font-weight:800}
.prompts-type span{color:var(--muted);font-size:14px;line-height:1.8}
.prompts-subs{margin-top:20px}

/* Filters: a GET form of dropdowns, links work without it */
.prompts-filters{display:flex;flex-wrap:wrap;align-items:flex-end;gap:12px;margin:0 0 20px}
.prompts-filters label{display:flex;flex-direction:column;gap:6px;font-size:13px;color:var(--muted)}
.prompts-filters select,.prompts-filters input[type=search]{min-height:44px;min-width:180px;padding:0 12px;border-radius:12px;border:1px solid var(--stroke);background:var(--panel);color:var(--text);font-weight:inherit;line-height:inherit;font-size:14px}
.prompts-filters select:focus-visible,.prompts-filters input:focus-visible{outline:2px solid var(--focus);outline-offset:2px}
.prompts-filters button{min-height:44px}

/* The wall of prompts */
.prompts-grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:18px}
.prompt-tile{position:relative;display:flex;flex-direction:column;height:100%;border-radius:16px;overflow:hidden;border:1px solid var(--stroke);background:var(--panel);color:var(--text);transition:border-color .18s cubic-bezier(.2,.8,.2,1),transform .18s cubic-bezier(.2,.8,.2,1)}
.prompt-tile:hover{border-color:var(--purple-soft);transform:translateY(-2px)}
.prompt-tile:focus-visible{outline:2px solid var(--focus);outline-offset:2px}
.prompt-tile-media{position:relative;display:block;aspect-ratio:4/5;background:var(--panel-2);overflow:hidden}
.prompt-tile-media img{width:100%;height:100%;object-fit:cover;display:block}
.prompt-tile-text{display:block;padding:16px;height:100%;font-size:13px;line-height:1.9;color:var(--muted);overflow:hidden;mask-image:linear-gradient(180deg,#000 70%,transparent)}
.prompt-tile-face{position:absolute;top:10px;inset-inline-end:10px;padding:3px 10px;border-radius:999px;background:#0009;color:#fff;font-size:12px;font-weight:700;backdrop-filter:blur(6px)}
.prompt-tile-kind{position:absolute;top:10px;inset-inline-start:10px;padding:3px 10px;border-radius:999px;background:#0009;color:#fff;font-size:12px;font-weight:700;backdrop-filter:blur(6px)}
.prompt-tile-body{display:flex;flex-direction:column;gap:4px;padding:12px 14px 14px}
.prompt-tile-title{font-size:15px;font-weight:700;line-height:1.7}
.prompt-tile-meta{font-size:12px;color:var(--subtle)}
.prompts-empty{padding:32px;border-radius:16px;border:1px dashed var(--stroke);color:var(--muted);text-align:center;line-height:1.9}
.prompts-empty a{color:var(--purple-soft);font-weight:700}

/* One prompt */
.prompt-page{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:32px;align-items:start;padding:40px clamp(18px,4.1vw,74px) 24px}
.prompt-page h1{font-size:clamp(26px,3.2vw,40px);line-height:1.45;font-weight:800;margin:0 0 10px;text-wrap:balance}
.prompt-summary{color:var(--muted);font-size:15px;line-height:1.95;margin:0 0 18px}
.prompt-byline{display:flex;flex-wrap:wrap;gap:6px 14px;margin:0 0 22px;color:var(--subtle);font-size:13px}
.prompt-byline a{color:var(--purple-soft)}
.prompt-actions{display:flex;flex-wrap:wrap;align-items:center;gap:8px 10px;margin:-8px 0 22px}
.prompt-react{display:inline-flex;align-items:center;gap:6px;min-height:40px;padding:0 14px;border-radius:9999px;border:1px solid var(--stroke);background:var(--panel);color:var(--text);font-size:13px;font-weight:700;transition:border-color .12s,background-color .12s,color .12s}
.prompt-react svg{width:18px;height:18px;flex:none;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linejoin:round}
.prompt-react:hover{border-color:var(--purple)}
.prompt-react:focus-visible,.prompt-mine:focus-visible{outline:2px solid var(--focus);outline-offset:2px}
.prompt-react[aria-pressed=true]{border-color:var(--purple);background:#b664e926;color:var(--purple-soft)}
.prompt-react[aria-pressed=true] svg{fill:currentColor}
html[data-theme=light] .prompt-react[aria-pressed=true]{color:#7a2fb0}
.prompt-react[aria-busy=true]{cursor:progress}
.prompt-react-count:empty{display:none}
.prompt-mine{font-size:13px;color:var(--purple-soft);font-weight:700}
.prompt-mine[hidden]{display:none}
html[data-theme=light] .prompt-mine{color:#7a2fb0}
.prompt-stats{display:inline-flex;flex-wrap:wrap;gap:4px 12px;color:var(--subtle);font-size:13px}
.prompt-stats span+span:before{content:"·";margin-inline-end:12px}
.prompt-stage{margin:0;position:sticky;top:96px;border-radius:20px;overflow:hidden;border:1px solid var(--stroke);background:var(--panel-2)}
.prompt-stage img,.prompt-stage video{display:block;width:100%;height:auto}
.prompt-stage-text{padding:20px;font-size:14px;line-height:2;white-space:pre-line;color:var(--text);max-height:640px;overflow:auto}
.prompt-stage-cap{padding:10px 14px;font-size:12px;color:var(--subtle);border-top:1px solid var(--stroke)}

.prompt-box{border-radius:16px;border:1px solid var(--stroke);background:var(--panel);overflow:hidden}
.prompt-box-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 14px;border-bottom:1px solid var(--stroke);font-size:13px;color:var(--muted)}
.prompt-text{margin:0;padding:16px;font-size:14px;line-height:1.95;white-space:pre-wrap;word-break:break-word;color:var(--text);unicode-bidi:plaintext}
.prompt-text .gap{padding:1px 6px;border-radius:6px;background:color-mix(in srgb,var(--purple) 18%,transparent);color:var(--purple-soft);font-weight:700}
.prompt-text .gap.is-filled{background:color-mix(in srgb,var(--purple) 28%,transparent);color:var(--text)}
.prompt-text .part{text-decoration:underline dashed var(--purple-soft);text-decoration-thickness:2px;text-underline-offset:5px;cursor:help;border-radius:4px}
.prompt-text .part:hover,.prompt-text .part:focus-visible{background:color-mix(in srgb,var(--purple) 14%,transparent);outline:none}
.prompt-copy{display:inline-flex;align-items:center;gap:6px;min-height:36px;padding:0 14px;border-radius:10px;border:1px solid var(--stroke);background:var(--panel-2);color:var(--text);font:inherit;font-size:13px;font-weight:700;cursor:pointer;transition:border-color .12s,background .12s}
.prompt-copy:hover{border-color:var(--purple-soft)}
.prompt-copy:focus-visible{outline:2px solid var(--focus);outline-offset:2px}
.prompt-copy.is-done{border-color:#47d6a1;color:#47d6a1}

.prompt-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:16px 0 0}
.prompt-fields label{display:flex;flex-direction:column;gap:6px;font-size:13px;color:var(--muted)}
.prompt-fields input,.prompt-fields select{min-height:44px;padding:0 12px;border-radius:12px;border:1px solid var(--stroke);background:var(--panel);color:var(--text);font-weight:inherit;line-height:inherit;font-size:14px}
.prompt-fields input[type=color]{padding:4px;min-width:72px}
.prompt-field{display:flex;flex-direction:column;gap:6px;min-width:0}
.prompt-fields .prompt-keep{display:flex;align-items:center;gap:8px;min-height:32px;font-size:13px;color:var(--muted)}
.prompt-fields .prompt-keep input{width:18px;height:18px;min-height:0;margin:0;padding:0;accent-color:var(--purple);cursor:pointer}
.prompt-fields .prompt-keep label{display:inline;cursor:pointer}
.prompt-keep-warn{margin:0;padding-inline-start:8px;border-inline-start:3px solid #f4a92c;font-size:12px;line-height:1.9;color:var(--text)}
.prompt-keep-warn[hidden]{display:none}
.prompt-keep-warn bdi,.prompt-fa-guide bdi{white-space:nowrap}
.prompt-keep-warn a{color:var(--purple-soft);text-decoration:underline;text-underline-offset:3px}
html[data-theme=light] .prompt-keep-warn a{color:#7a2fb0}
.prompt-fa-guide{margin:14px 0 0;border:1px solid var(--stroke);border-radius:16px;background:var(--panel)}
.prompt-fa-guide summary{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:48px;padding:10px 16px;cursor:pointer;list-style:none;font-size:14px;font-weight:800;line-height:1.7}
.prompt-fa-guide summary::-webkit-details-marker{display:none}
.prompt-fa-guide summary:after{content:"";flex:none;width:8px;height:8px;border-inline-end:2px solid var(--muted);border-bottom:2px solid var(--muted);rotate:45deg;translate:0 -3px;transition:rotate .18s cubic-bezier(.2,.8,.2,1)}
.prompt-fa-guide[open] summary:after{rotate:-135deg;translate:0 2px}
.prompt-fa-guide summary:focus-visible{outline:2px solid var(--focus);outline-offset:2px;border-radius:16px}
.prompt-fa-guide ul{margin:0;padding:0 16px 14px;list-style:none;display:grid;gap:8px}
.prompt-fa-guide li{position:relative;padding-inline-start:16px;color:var(--muted);font-size:13px;line-height:1.9}
.prompt-fa-guide li:before{content:"";position:absolute;inset-inline-start:2px;top:.8em;width:5px;height:5px;border-radius:9999px;background:var(--purple)}
.prompt-fa-guide strong{color:var(--text)}
@media(prefers-reduced-motion:reduce){.prompt-fa-guide summary:after,.prompt-react{transition:none}}
.prompt-fields input:focus-visible,.prompt-fields select:focus-visible{outline:2px solid var(--focus);outline-offset:2px}

.prompt-make{display:flex;flex-wrap:wrap;align-items:flex-start;gap:12px 20px;margin:22px 0 6px}
.prompt-make-btn{display:flex;flex-direction:column;align-items:stretch;gap:6px}
.prompt-price{align-self:flex-start;font-size:12px;color:var(--subtle)}
.prompt-photo-btn{min-height:44px;padding:0 20px;border-radius:12px;border:1px solid var(--purple);background:transparent;color:var(--text);font:inherit;font-size:15px;font-weight:700;cursor:pointer;transition:background .12s,border-color .12s}
.prompt-photo-btn:hover{background:color-mix(in srgb,var(--purple) 14%,transparent)}
.prompt-photo-btn:focus-visible{outline:2px solid var(--focus);outline-offset:2px}
.prompt-photo-btn[disabled]{opacity:.6;cursor:progress}
.prompt-face{margin:0 0 10px;padding:10px 12px;border-radius:12px;border:1px solid color-mix(in srgb,var(--purple) 40%,transparent);background:color-mix(in srgb,var(--purple) 10%,transparent);color:var(--text);font-size:13px;line-height:1.85}
.prompt-face strong{display:block;font-size:14px}
.prompt-why{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:4px;font-size:13px;color:var(--muted);line-height:1.8}
.prompt-why li:before{content:"✓";color:#47d6a1;margin-inline-end:6px}

/* The note of an explained part: above it, in the accent colour (green-teal in
   the live palette), darkened so white text keeps 4.5:1 on any palette. */
.prompt-tip{--tip-bg:color-mix(in srgb,var(--purple) 72%,#000);position:fixed;z-index:60;max-width:300px;padding:10px 14px;border-radius:12px;background:var(--tip-bg);color:#fff;font-size:14px;font-weight:500;line-height:1.85;box-shadow:0 12px 32px #0006;pointer-events:none;animation:promptTipIn .12s ease-out}
/* `left` on purpose: the script measures the arrow in viewport px from the left edge. */
.prompt-tip:after{content:"";position:absolute;left:var(--tip-arrow,50%);translate:-50% 0;width:12px;height:12px;background:var(--tip-bg);rotate:45deg;bottom:-6px}
.prompt-tip.is-below:after{bottom:auto;top:-6px}
@keyframes promptTipIn{from{opacity:0;transform:translateY(4px)}}
@media (prefers-reduced-motion:reduce){.prompt-tip{animation:none}}
.prompt-tip[hidden]{display:none}

.prompt-explain{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:10px}
.prompt-explain li{padding:12px 14px;border-radius:12px;border:1px solid var(--stroke);background:var(--panel)}
.prompt-explain code{display:inline-block;margin-bottom:4px;font-weight:700;color:var(--purple-soft);unicode-bidi:plaintext}
.prompt-explain p{margin:0;font-size:14px;line-height:1.9;color:var(--muted)}

/* The bar at the foot of the phone screen */
.prompt-dockbar{display:none}

@media(max-width:980px){
  .prompt-page{grid-template-columns:minmax(0,1fr);padding-top:24px}
  .prompt-stage{position:static;order:-1}
  .prompt-stage img{max-height:70vh;object-fit:cover}
  .prompts-types{grid-template-columns:minmax(0,1fr)}
}
@media(max-width:620px){
  .prompt-fields{grid-template-columns:minmax(0,1fr)}
  .prompts-filters{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .prompts-filters select,.prompts-filters input[type=search]{width:100%;min-width:0}
  .prompts-filters label:last-of-type{grid-column:1/-1}
  .prompts-filters button{display:none}
  .prompts-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
  .prompts-types{gap:10px}
  .prompts-type{min-height:0;padding:14px 16px}
  .prompt-tile-body{padding:10px}
  .prompt-tile-title{font-size:14px}
  .prompt-dockbar{display:flex;position:fixed;z-index:40;inset-inline:0;bottom:64px;padding:10px 16px;gap:10px;align-items:center;justify-content:space-between;background:var(--panel);border-top:1px solid var(--stroke);box-shadow:0 -8px 30px #0003}
  .prompt-dockbar .prompt-price{align-self:center}
  .prompt-page{padding-bottom:96px}
}
@media(prefers-reduced-motion:reduce){.prompt-tile,.prompts-type{transition:none}.prompt-tile:hover,.prompts-type:hover{transform:none}}

/* The front on smaller screens */
@media(max-width:980px){
  .prompts-steps{grid-template-columns:minmax(0,1fr);gap:22px}
  .prompts-steps:before{top:22px;bottom:22px;inset-inline-start:21px;width:2px;height:auto;background:linear-gradient(to bottom,var(--purple),color-mix(in srgb,var(--purple) 20%,transparent))}
  .prompts-steps li{padding-inline-start:62px}
  .prompts-steps li:before{position:absolute;inset-inline-start:0;top:0;margin:0}
  .prompts-steps p{max-width:none}
}
@media(max-width:620px){
  .prompts-hero.is-front{padding-bottom:20px}
  .prompts-search .btn{padding-inline:16px}
  .prompts-facts{font-size:13px;gap:4px 16px}
  .prompts-facts span+span:before{display:none}
  .prompts-wall{columns:2;column-gap:10px}
  .prompts-wall li{margin-bottom:10px}
  .prompts-wall li:nth-child(n+7){display:none}
  .wall-cap{inset-inline:10px;bottom:8px;font-size:13px}
  .prompts-cats{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:10px;margin-inline:-18px;padding:0 18px 6px;scrollbar-width:none}
  .prompts-cats::-webkit-scrollbar{display:none}
  .prompts-cats li{flex:0 0 42%;scroll-snap-align:start}
}
@media(prefers-reduced-motion:reduce){.wall-tile img,.prompts-cat,.prompts-more summary:after{transition:none}.wall-tile:hover img,.prompts-cat:hover{transform:none}}

/* The questions at the foot of a list: centred, one column, each opens alone */
.front-section.prompts-faq{max-width:calc(860px + 2 * clamp(18px,4.1vw,74px));margin-inline:auto}
.prompts-faq .section-title{text-align:center}
.prompts-faq-list{display:flex;flex-direction:column;gap:10px}
.prompts-faq .prompts-more{max-width:none}
.prompts-chip-count{color:var(--muted);font-weight:500;font-size:12px;margin-inline-start:4px}

/* One prompt: the guide, the FA/EN tab, the how-to line, «ویدیو کن» */
.prompt-guide{margin:0 0 14px;padding:12px 14px;border-radius:12px;background:color-mix(in srgb,var(--purple) 12%,var(--panel));border:1px solid color-mix(in srgb,var(--purple) 35%,var(--stroke));color:var(--text);font-size:14px;line-height:1.9}
.prompt-guide strong{color:var(--purple-soft);font-weight:800;margin-inline-end:4px}
.prompt-lang{display:inline-flex;gap:2px;padding:3px;border-radius:999px;background:var(--panel-2);border:1px solid var(--stroke)}
.prompt-lang button{min-height:32px;padding:0 14px;border:0;border-radius:999px;background:none;color:var(--muted);font-family:inherit;font-size:13px;font-weight:700;cursor:pointer;transition:background .12s cubic-bezier(.2,.8,.2,1),color .12s cubic-bezier(.2,.8,.2,1)}
.prompt-lang button:hover{color:var(--text)}
.prompt-lang button[aria-selected=true]{background:var(--purple);color:#fff}
.prompt-lang button:focus-visible{outline:2px solid var(--focus);outline-offset:2px}
.prompt-text[hidden]{display:none}
.prompt-lang-note{margin:0;padding:10px 16px 14px;border-top:1px dashed var(--stroke);color:var(--subtle);font-size:12px;line-height:1.9}
.prompt-tovideo{display:flex;align-items:center;justify-content:center;min-height:44px;padding:0 14px;border-top:1px solid var(--stroke);color:var(--purple-soft);font-size:14px;font-weight:800;transition:background .12s cubic-bezier(.2,.8,.2,1)}
.prompt-tovideo:hover{background:var(--panel-3)}
.prompt-tovideo:focus-visible{outline:2px solid var(--focus);outline-offset:-2px}
.prompt-stage-audio{display:flex;flex-direction:column;gap:14px;padding:18px}
.prompt-stage-audio img{width:100%;height:auto;aspect-ratio:1;object-fit:cover;border-radius:16px}
.prompt-stage-audio-mark{display:grid;place-items:center;aspect-ratio:1;border-radius:16px;background:linear-gradient(140deg,#b664e933,transparent 60%),var(--panel-2);color:var(--purple-soft)}
.prompt-stage-audio-mark svg{width:72px;height:72px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.prompt-stage-audio audio{width:100%}
.prompts-learn-list{display:grid;gap:10px;margin:0;padding:0;list-style:none}
.prompts-learn-list a{display:block;min-height:44px;padding:12px 16px;border-radius:14px;border:1px solid var(--stroke);background:var(--panel);color:var(--text);line-height:1.8;text-decoration:none;transition:border-color .18s cubic-bezier(.2,.8,.2,1)}
.prompts-learn-list a:hover{border-color:var(--purple)}
.prompts-learn-list a:focus-visible{outline:2px solid var(--focus);outline-offset:2px}
.prompts-maker-link{margin:8px 0 0;font-size:14px;line-height:1.85;color:var(--muted)}
.prompts-maker-link a{color:var(--purple-soft);font-weight:600}
.prompts-maker-link a:focus-visible{outline:2px solid var(--focus);outline-offset:2px}
html[data-theme=light] .prompts-maker-link a{color:#7a2fb0}