/* =========================================================================
   img2prompt — shared design system
   Colour tokens are the brand palette used since v1.
   Type follows Tailwind's default size/line-height pairs.
   ========================================================================= */
:root{
  --font:"DM Sans",system-ui,sans-serif;
  --mono:"DM Mono",ui-monospace,monospace;
  --canvas:#f5f4f0;
  --surface:#ffffff;
  --surface-2:#faf8f5;
  --ink:#1a1917;
  --ink-2:#3d3a36;
  --muted:#857f79;
  --faint:#c4bdb5;
  --border:#e8e3da;
  --border-2:#d0c9be;
  --coral:#e85d3a;
  --coral-hover:#d14e2c;
  --coral-light:#fdf0ec;
  --coral-muted:#f5c4b5;
  --ok:#6ab187;
  --shadow:0 4px 24px rgba(26,25,23,.06);
  --shadow-lift:0 8px 32px rgba(26,25,23,.08);
  --shadow-toast:0 8px 24px rgba(26,25,23,.18);
  --expo:cubic-bezier(.16,1,.3,1);
  --header-h:60px;
}

/* ---------- Base ---------- */
*{box-sizing:border-box}
html{scroll-behavior:smooth}
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto!important}
.lenis.lenis-stopped{overflow:hidden}
body{margin:0;background:var(--canvas);color:var(--ink);font:400 16px/24px var(--font);-webkit-font-smoothing:antialiased;overflow-x:hidden}
h1,h2,h3,h4{font-family:var(--font);font-weight:600;letter-spacing:-.02em;margin:0}
p{margin:0}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;cursor:pointer;background:none;border:0;padding:0}
:focus-visible{outline:2px solid var(--coral);outline-offset:2px}
::selection{background:var(--coral-light);color:var(--ink)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
[x-cloak],[hidden]{display:none!important}

/* ---------- Layout ---------- */
.wrap{max-width:1200px;margin:0 auto;padding:0 24px}
.wrap-md{max-width:960px;margin:0 auto;padding:0 24px}
.wrap-sm{max-width:720px;margin:0 auto;padding:0 24px}
.sec{padding:120px 0}
.sec-sm{padding:72px 0}
.white{background:var(--surface)}
.sec-head{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:24px;align-items:end;margin-bottom:40px}
.sec-head .lead{margin-top:8px;max-width:34em}
/* Inner page title block */
.page-head{padding:64px 0 40px}
.page-head .lead{margin-top:10px;max-width:36em}
.page-head .crumb{font-size:14px;line-height:20px;color:var(--muted);margin-bottom:16px}
.page-head .crumb a:hover{color:var(--ink)}
.divider{height:1px;background:var(--border);border:0;margin:0}

/* ---------- Type ---------- */
.h1{font-size:30px;line-height:36px}
.h2{font-size:24px;line-height:32px}
.h3{font-size:18px;line-height:28px}
.h4{font-size:16px;line-height:24px}
.lead{font-size:16px;line-height:24px;color:var(--muted)}
.body-sm{font-size:14px;line-height:20px}
.small{font-size:12px;line-height:16px}
.muted{color:var(--muted)}
.ink-2{color:var(--ink-2)}
.mono,.font-mono{font-family:var(--mono)}
.stat-value{font-family:var(--mono);font-weight:500;font-variant-numeric:tabular-nums}
.prompt-block{font:400 13px/1.7 var(--mono);color:var(--ink-2);white-space:pre-wrap;word-break:break-word}
.prompt-block .p{color:var(--coral-hover)}
.prompt-block .n{color:var(--muted)}
@media (min-width:768px){
  .h1{font-size:48px;line-height:48px}
  .h2{font-size:30px;line-height:36px}
  .h1-sm{font-size:36px;line-height:40px}   /* inner page titles */
}
.h1-sm{font-size:30px;line-height:36px}

/* ---------- Buttons & links ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:40px;padding:0 16px;border-radius:8px;font-size:14px;line-height:20px;font-weight:600;white-space:nowrap;transition:background-color .2s ease,border-color .2s ease,color .2s ease,opacity .2s}
.btn-primary{background:var(--coral);color:#fff}
.btn-primary:hover{background:var(--coral-hover)}
.btn-ink{background:var(--ink);color:#fff}
.btn-ink:hover{background:#000}
.btn-ghost{border:1px solid var(--border-2);color:var(--ink);background:transparent}
.btn-ghost:hover{border-color:var(--ink)}
.btn-sm{height:32px;padding:0 12px}
.btn-lg{height:48px;padding:0 20px}
.btn-block{width:100%}
.btn[disabled],.btn.is-disabled{opacity:.45;pointer-events:none}
.link{font-size:14px;line-height:20px;font-weight:600;color:var(--ink);border-bottom:1px solid var(--border-2);padding-bottom:1px;transition:border-color .2s}
.link:hover{border-color:var(--ink)}
.text-link{color:var(--ink);text-decoration:underline;text-decoration-color:var(--border-2);text-underline-offset:3px;transition:text-decoration-color .2s}
.text-link:hover{text-decoration-color:var(--ink)}

/* ---------- Header ---------- */
.top{position:sticky;top:0;z-index:50;background:rgba(245,244,240,.86);backdrop-filter:saturate(1.4) blur(14px);-webkit-backdrop-filter:saturate(1.4) blur(14px);border-bottom:1px solid transparent;transition:border-color .3s}
.top.scrolled{border-bottom-color:var(--border)}
.top .wrap{display:flex;align-items:center;gap:40px;height:var(--header-h)}
.logo{font-size:18px;line-height:28px;font-weight:700;letter-spacing:-.02em;white-space:nowrap}
.logo i{color:var(--coral)}
.nav{display:flex;align-items:center;gap:28px;flex:1;font-size:14px;line-height:20px;color:var(--ink-2)}
.nav > a,.drop > button{transition:color .2s}
.nav > a:hover,.drop > button:hover,.nav > a[aria-current="page"],.drop.active > button{color:var(--ink)}
.nav > a[aria-current="page"],.drop.active > button{font-weight:600}
.drop{position:relative}
.drop > button{display:inline-flex;align-items:center;gap:4px;color:var(--ink-2)}
.drop-menu{position:absolute;top:calc(100% + 14px);left:-14px;min-width:220px;background:var(--surface);border:1px solid var(--border);border-radius:12px;box-shadow:var(--shadow-lift);padding:6px;opacity:0;visibility:hidden;transform:translateY(-4px);transition:opacity .25s var(--expo),transform .35s var(--expo),visibility .25s}
.drop:hover .drop-menu,.drop:focus-within .drop-menu{opacity:1;visibility:visible;transform:none}
.drop-menu a{display:block;padding:8px 10px;border-radius:8px;color:var(--ink)}
.drop-menu a:hover,.drop-menu a[aria-current="page"]{background:var(--surface-2)}
.drop-menu small{display:block;font-size:12px;line-height:16px;color:var(--muted)}
.top-r{display:flex;align-items:center;gap:20px;font-size:14px;line-height:20px}
.top-r .lang,.top-r .login{color:var(--ink-2);transition:color .2s}
.top-r .lang:hover,.top-r .login:hover{color:var(--ink)}
.burger{display:none;width:36px;height:36px;border:1px solid var(--border-2);border-radius:8px;place-items:center}
.m-menu{position:fixed;inset:var(--header-h) 0 0 0;z-index:49;background:var(--canvas);padding:16px 24px 32px;overflow:auto;opacity:0;visibility:hidden;transform:translateY(-6px);transition:opacity .3s var(--expo),transform .4s var(--expo),visibility .3s}
.m-menu.open{opacity:1;visibility:visible;transform:none}
.m-menu a{display:block;padding:12px 0;border-bottom:1px solid var(--border);font-size:16px;line-height:24px}
.m-menu .m-sub{padding-left:16px;color:var(--ink-2)}
.m-menu .m-cta{display:flex;gap:8px;margin-top:24px}
.m-menu .m-cta a{border:0;padding:0}

/* ---------- Footer ---------- */
footer.foot-wrap{background:var(--canvas);border-top:1px solid var(--border);padding:64px 0 32px;font-size:14px;line-height:20px}
.foot{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr 1fr;gap:40px}
.foot p{color:var(--muted);max-width:22em;margin-top:12px}
.foot h4{font-size:14px;line-height:20px;margin-bottom:14px}
.foot ul{list-style:none;margin:0;padding:0;display:grid;gap:10px;color:var(--muted)}
.foot a{transition:color .2s}
.foot a:hover{color:var(--ink)}
.foot-b{display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;margin-top:56px;padding-top:24px;border-top:1px solid var(--border);font-size:12px;line-height:16px;color:var(--muted)}
.langs{display:flex;flex-wrap:wrap;gap:4px 16px}
.langs a:hover,.langs a[aria-current]{color:var(--ink)}

/* ---------- Surfaces ---------- */
.card{background:var(--surface);border:1px solid var(--border);border-radius:16px}
.card-pad{padding:24px}
.panel-soft{background:var(--surface-2);border:1px solid var(--border);border-radius:12px}
.shadow{box-shadow:var(--shadow)}
.ph{background:#e9e5de;overflow:hidden;position:relative}
.ph img{width:100%;height:100%;object-fit:cover}
.fade{opacity:0;transition:opacity .9s var(--expo),transform 1.2s var(--expo)}
.fade.ld{opacity:1}
.tag{display:inline-flex;align-items:center;gap:6px;height:24px;padding:0 8px;border-radius:6px;background:var(--surface-2);border:1px solid var(--border);font-size:12px;line-height:16px;color:var(--ink-2);white-space:nowrap}
.tag.ok::before,.tag.busy::before,.tag.err::before{content:"";width:6px;height:6px;border-radius:50%}
.tag.ok::before{background:var(--ok)}
.tag.busy::before{background:var(--coral-muted)}
.tag.err::before{background:var(--coral)}
.dot{display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--ok)}

/* ---------- Forms ---------- */
.field{display:grid;gap:6px}
.field + .field{margin-top:16px}
.label{font-size:14px;line-height:20px;font-weight:500;color:var(--ink)}
.hint{font-size:12px;line-height:16px;color:var(--muted)}
.input,.select,.textarea{width:100%;height:40px;padding:0 12px;border:1px solid var(--border-2);border-radius:8px;background:var(--surface);font:400 14px/20px var(--font);color:var(--ink);transition:border-color .2s,box-shadow .2s;appearance:none;-webkit-appearance:none}
.textarea{height:auto;min-height:120px;padding:10px 12px;resize:vertical}
.select{padding-right:32px;background:var(--surface) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12' fill='none'%3E%3Cpath d='M3 4.5 6 7.5 9 4.5' stroke='%23857f79' stroke-width='1.4' stroke-linecap='round'/%3E%3C/svg%3E") right 12px center no-repeat}
.input::placeholder,.textarea::placeholder{color:var(--faint)}
.input:hover,.select:hover,.textarea:hover{border-color:var(--muted)}
.input:focus,.select:focus,.textarea:focus{outline:0;border-color:var(--ink);box-shadow:0 0 0 3px rgba(26,25,23,.06)}
.input.err{border-color:var(--coral)}
.err-msg{font-size:12px;line-height:16px;color:var(--coral-hover)}
.check{display:flex;gap:10px;align-items:flex-start;font-size:14px;line-height:20px;color:var(--ink-2);cursor:pointer}
.check input{appearance:none;-webkit-appearance:none;flex:none;width:16px;height:16px;margin:2px 0 0;border:1px solid var(--border-2);border-radius:4px;background:var(--surface);display:grid;place-items:center;transition:background .2s,border-color .2s}
.check input:checked{background:var(--ink);border-color:var(--ink)}
.check input:checked::after{content:"";width:8px;height:4px;border:1.5px solid #fff;border-top:0;border-right:0;transform:rotate(-45deg) translate(1px,-1px)}
/* segmented control */
.seg{position:relative;display:inline-flex;padding:3px;background:var(--surface-2);border:1px solid var(--border);border-radius:10px}
.seg button{position:relative;z-index:1;height:30px;padding:0 12px;border-radius:7px;font-size:14px;line-height:20px;color:var(--muted);transition:color .25s}
.seg button[aria-pressed="true"],.seg button[aria-selected="true"]{color:var(--ink)}
.seg .seg-ind{position:absolute;top:3px;bottom:3px;left:0;border-radius:7px;background:var(--surface);box-shadow:0 1px 2px rgba(26,25,23,.08),0 0 0 1px var(--border);transition:transform .45s var(--expo),width .45s var(--expo)}
/* switch */
.switch{display:inline-flex;align-items:center;gap:10px;font-size:14px;line-height:20px;cursor:pointer}
.switch input{appearance:none;-webkit-appearance:none;position:relative;width:32px;height:18px;margin:0;border-radius:99px;background:var(--border-2);transition:background .25s}
.switch input::after{content:"";position:absolute;top:2px;left:2px;width:14px;height:14px;border-radius:50%;background:#fff;box-shadow:0 1px 2px rgba(0,0,0,.15);transition:transform .35s var(--expo)}
.switch input:checked{background:var(--ink)}
.switch input:checked::after{transform:translateX(14px)}
/* drop zone */
.dropzone{display:grid;place-items:center;text-align:center;border:1px dashed var(--border-2);border-radius:16px;background:var(--surface);padding:48px 24px;cursor:pointer;transition:border-color .25s,background .25s}
.dropzone:hover,.dropzone.over{border-color:var(--ink);background:var(--surface-2)}
.dropzone .dz-title{font-size:16px;line-height:24px;font-weight:600}
.dropzone .dz-hint{font-size:14px;line-height:20px;color:var(--muted);margin-top:4px}

/* ---------- Tabs (underline) ---------- */
.tabs{position:relative;display:flex;gap:24px;border-bottom:1px solid var(--border);overflow-x:auto;scrollbar-width:none}
.tabs::-webkit-scrollbar{display:none}
.tab{padding:12px 0;font-size:14px;line-height:20px;color:var(--muted);white-space:nowrap;transition:color .2s}
.tab:hover{color:var(--ink)}
.tab[aria-selected="true"]{color:var(--ink)}
.tabs .ind{position:absolute;left:0;bottom:0;height:2px;background:var(--ink);transition:transform .45s var(--expo),width .45s var(--expo)}

/* ---------- Table ---------- */
.table{width:100%;border-collapse:collapse;font-size:14px;line-height:20px}
.table th{text-align:left;font-weight:500;color:var(--muted);padding:12px 16px;border-bottom:1px solid var(--border);font-size:12px;line-height:16px}
.table td{padding:14px 16px;border-bottom:1px solid var(--border);vertical-align:middle}
.table tr:last-child td{border-bottom:0}

/* ---------- Accordion ---------- */
.qa{border-top:1px solid var(--border)}
.qa:last-child{border-bottom:1px solid var(--border)}
.qa > button{width:100%;display:flex;justify-content:space-between;align-items:center;gap:24px;padding:18px 0;font-size:16px;line-height:24px;font-weight:500;text-align:left}
.qa .pm{position:relative;flex:none;width:12px;height:12px}
.qa .pm::before,.qa .pm::after{content:"";position:absolute;left:0;right:0;top:50%;height:1.5px;margin-top:-.75px;background:var(--ink-2);transition:transform .45s var(--expo)}
.qa .pm::after{transform:rotate(90deg)}
.qa.open .pm::after{transform:rotate(0)}
.qa .ans{display:grid;grid-template-rows:0fr;transition:grid-template-rows .55s var(--expo)}
.qa.open .ans{grid-template-rows:1fr}
.qa .ans > div{overflow:hidden}
.qa .ans p{padding:0 0 20px;font-size:14px;line-height:20px;color:var(--ink-2);max-width:40em;opacity:0;transition:opacity .4s}
.qa.open .ans p{opacity:1;transition-delay:.1s}

/* ---------- Long-form text (blog, legal) ---------- */
.prose{font-size:16px;line-height:28px;color:var(--ink-2)}
.prose > * + *{margin-top:20px}
.prose h2{font-size:24px;line-height:32px;color:var(--ink);margin-top:48px}
.prose h3{font-size:18px;line-height:28px;color:var(--ink);margin-top:32px}
.prose a{color:var(--ink);text-decoration:underline;text-decoration-color:var(--border-2);text-underline-offset:3px}
.prose a:hover{text-decoration-color:var(--ink)}
.prose ul,.prose ol{padding-left:20px}
.prose li + li{margin-top:8px}
.prose strong{color:var(--ink);font-weight:600}
.prose blockquote{margin:28px 0;padding-left:20px;border-left:2px solid var(--ink);color:var(--ink)}
.prose pre,.prose .prompt-block{background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:16px;overflow:auto}
.prose code{font:400 13px/1.7 var(--mono);background:var(--surface-2);border:1px solid var(--border);border-radius:4px;padding:1px 5px}
.prose pre code{background:none;border:0;padding:0}
.prose figure{margin:32px 0}
.prose figure img{border-radius:12px}
.prose figcaption{font-size:12px;line-height:16px;color:var(--muted);margin-top:8px}
.prose hr{border:0;height:1px;background:var(--border);margin:40px 0}

/* ---------- Motion ---------- */
.rv{opacity:0;transform:translate3d(0,10px,0);transition:opacity .9s var(--expo),transform .9s var(--expo);transition-delay:var(--d,0s)}
.rv.in{opacity:1;transform:none}
.marquee{overflow:hidden;mask-image:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent);-webkit-mask-image:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent)}
.marquee-track{display:flex;gap:16px;width:max-content;will-change:transform}
@keyframes spin{to{transform:rotate(360deg)}}
.spinner{width:14px;height:14px;border-radius:50%;border:2px solid var(--border);border-top-color:var(--ink);animation:spin .75s linear infinite}
@keyframes pulse{50%{opacity:.4}}
.pulse{animation:pulse 2s ease-in-out infinite}
@keyframes blink{50%{opacity:0}}
.caret{display:inline-block;width:6px;height:14px;background:var(--coral);vertical-align:-2px;margin-left:1px;animation:blink .9s steps(1) infinite}
.skeleton{background:linear-gradient(90deg,var(--surface-2),#efebe4,var(--surface-2));background-size:200% 100%;animation:sk 1.4s ease-in-out infinite;border-radius:6px}
@keyframes sk{to{background-position:-200% 0}}

/* ---------- Toast ---------- */
.toast{position:fixed;left:50%;bottom:24px;transform:translate(-50%,12px);background:var(--ink);color:#fff;font-size:14px;line-height:20px;padding:10px 16px;border-radius:10px;box-shadow:var(--shadow-toast);opacity:0;pointer-events:none;transition:opacity .35s var(--expo),transform .5s var(--expo);z-index:100;display:flex;gap:8px;align-items:center}
.toast i{width:6px;height:6px;border-radius:50%;background:var(--ok)}
.toast.show{opacity:1;transform:translate(-50%,0)}

/* =========================================================================
   Theme additions (WordPress build). Same tokens and type scale as above.
   ========================================================================= */
.skip{position:absolute;left:16px;top:-48px;z-index:100;background:var(--ink);color:#fff;padding:8px 12px;border-radius:8px;font-size:14px;line-height:20px;transition:top .2s}
.skip:focus{top:8px}
html.menu-open{overflow:hidden}
.logo{display:inline-flex;align-items:center;gap:8px}
.logo .logo-mark{flex:none;border-radius:5px}
/* dropdowns open on click/tap as well as hover */
.drop.open .drop-menu{opacity:1;visibility:visible;transform:none}
.drop-r .drop-menu{left:auto;right:-6px}
.drop.lang .drop-menu{min-width:160px}
.drop.lang > button{gap:2px;color:var(--ink-2)}
.drop.lang .drop-menu a[aria-current]{font-weight:600;background:var(--surface-2)}
.avatar{width:32px;height:32px;border-radius:50%;background:var(--ink);color:#fff;display:grid;place-items:center;font-size:12px;line-height:16px;font-weight:600;overflow:hidden}
.avatar img{width:100%;height:100%;object-fit:cover}
.drop > button.avatar{color:#fff;gap:0;justify-content:center}
.drop > button.avatar:hover{color:#fff;opacity:.88}
.drop-menu .who{display:block;padding:8px 10px 10px;margin-bottom:4px;border-bottom:1px solid var(--border);font-size:14px;line-height:20px;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.drop-menu .who small{font-weight:400}
.m-menu .m-langs{display:flex;flex-wrap:wrap;gap:4px 16px;padding:16px 0 4px;font-size:14px;line-height:20px;color:var(--muted)}
.m-menu .m-langs a{display:inline;padding:0;border:0;font-size:14px;line-height:20px}
.m-menu .m-langs a[aria-current]{color:var(--ink);font-weight:600}
.foot .foot-h{font-size:14px;line-height:20px;margin-bottom:14px}
.foot.no-gen{grid-template-columns:1.6fr 1fr 1fr 1fr}
.toast.err i{background:var(--coral)}
.spinner-light{border-color:rgba(255,255,255,.35);border-top-color:#fff;display:inline-block;vertical-align:-2px}
.btn .spinner{flex:none}
main{display:block;min-height:50vh}

/* notice bars (email verification, flash messages) */
.notice-bar{position:sticky;top:var(--header-h);z-index:40;background:var(--coral-light);border-bottom:1px solid var(--coral-muted);font-size:14px;line-height:20px;color:var(--ink)}
.notice-bar .wrap{display:flex;align-items:center;gap:16px;min-height:44px;padding-top:8px;padding-bottom:8px;flex-wrap:wrap}
.notice-bar .wrap > span{flex:1;min-width:200px}
.notice-bar button{font-weight:600;text-decoration:underline;text-decoration-color:var(--coral-muted);text-underline-offset:3px}
.notice-bar button:disabled{opacity:.5;cursor:default}

/* cookie consent */
.cookie{position:fixed;left:16px;right:16px;bottom:16px;z-index:90;max-width:560px;margin-left:auto;background:var(--surface);border:1px solid var(--border);border-radius:16px;box-shadow:var(--shadow-lift);padding:20px;font-size:14px;line-height:20px;color:var(--ink-2);opacity:0;transform:translateY(12px);transition:opacity .4s var(--expo),transform .5s var(--expo)}
.cookie.show{opacity:1;transform:none}
.cookie b{display:block;color:var(--ink);font-weight:600;margin-bottom:4px}
.cookie .acts{display:flex;gap:8px;margin-top:16px;flex-wrap:wrap}

/* inline alerts inside forms and cards */
.alert{display:flex;gap:10px;align-items:flex-start;padding:12px 14px;border-radius:10px;font-size:14px;line-height:20px;border:1px solid var(--border);background:var(--surface-2);color:var(--ink-2)}
.alert svg{flex:none;margin-top:2px}
.alert.err{background:var(--coral-light);border-color:var(--coral-muted);color:var(--ink)}
.alert.ok{background:#eef6f1;border-color:#cfe5d8;color:var(--ink)}
.alert[hidden]{display:none}

/* pagination (paginate_links type=list and plain) */
.pager{display:flex;justify-content:center;margin-top:56px}
.pager ul{display:flex;gap:4px;list-style:none;margin:0;padding:0;flex-wrap:wrap;justify-content:center}
.pager a,.pager span{display:grid;place-items:center;min-width:36px;height:36px;padding:0 10px;border-radius:8px;font-size:14px;line-height:20px;color:var(--ink-2);transition:background .2s,color .2s}
.pager a:hover{background:var(--surface);color:var(--ink)}
.pager .current{background:var(--ink);color:#fff;font-weight:600}
.pager .dots{color:var(--muted)}

/* post content from the editor */
.prose img{height:auto;border-radius:12px}
.prose .alignleft{float:left;margin:4px 24px 16px 0}
.prose .alignright{float:right;margin:4px 0 16px 24px}
.prose .aligncenter{margin-left:auto;margin-right:auto}
.prose .wp-caption-text,.prose .wp-element-caption{font-size:12px;line-height:16px;color:var(--muted);margin-top:8px}
.prose table{width:100%;border-collapse:collapse;font-size:14px;line-height:20px}
.prose th,.prose td{border-bottom:1px solid var(--border);padding:10px 12px;text-align:left;vertical-align:top}
.prose th{font-weight:600;color:var(--ink)}
.prose h4{font-size:16px;line-height:24px;color:var(--ink);margin-top:28px}
.screen-reader-text{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.prose .wp-block-image figcaption{font-size:12px;line-height:16px;color:var(--muted)}

/* shared bits used by several templates */
.empty-state{text-align:center;padding:64px 24px;color:var(--muted);font-size:14px;line-height:20px}
.empty-state h2,.empty-state h3{color:var(--ink);font-size:18px;line-height:28px;margin-bottom:6px}
.empty-state .btn{margin-top:20px}
.kbd{display:inline-grid;place-items:center;min-width:20px;height:20px;padding:0 5px;border:1px solid var(--border-2);border-bottom-width:2px;border-radius:5px;font:500 12px/16px var(--mono);color:var(--ink-2);background:var(--surface)}
.btn-coral{display:inline-flex;align-items:center;height:40px;padding:0 16px;border-radius:8px;background:var(--coral);color:#fff;font-size:14px;line-height:20px;font-weight:600}

/* ---------- Responsive ---------- */
@media (max-width:1024px){
  .nav,.top-r .login,.top-r .lang,.top-r .acct{display:none}
  .foot.no-gen{grid-template-columns:1fr 1fr}
  .cookie{left:16px;right:16px;max-width:none}
  .burger{display:grid}
  .top .wrap{justify-content:space-between}
  .sec{padding:88px 0}
  .foot{grid-template-columns:1fr 1fr}
  .foot > div:first-child{grid-column:1/-1}
}
@media (max-width:720px){
  .wrap,.wrap-md,.wrap-sm{padding:0 16px}
  .sec-head{grid-template-columns:1fr}
  .page-head{padding:40px 0 28px}
  .sec{padding:72px 0}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important}
  html{scroll-behavior:auto}
  .rv,.fade{opacity:1!important;transform:none!important}
}

/* header CTA: long translations (de/fr) don't fit next to the logo on phones */
.lbl-sm{display:none}
@media (max-width:480px){.top .wrap{gap:12px}.top-r{gap:12px}.top-r .lbl-lg{display:none}.top-r .lbl-sm{display:inline}}
@media (max-width:360px){.top .wrap,.top-r{gap:8px}.top-r .btn-sm{padding-left:10px;padding-right:10px}}
/* language suggestion (inc/i18n-routing.php): quiet, not sticky */
.lang-suggest{position:static;background:var(--surface-2);border-bottom:1px solid var(--border)}
.lang-suggest .wrap{justify-content:center}
.lang-suggest .wrap > span{flex:none;min-width:0;color:var(--muted)}
.lang-suggest button{font-weight:400;color:var(--muted);text-decoration:none}