/**
 * PromXAI Theme 1.4.15.85 — Explain Category + Golden Rule + Help Hub Refinement
 * Single visual owner for page-how-to-use.php. No stacked visual patches.
 */
body.promxai-how-modern-page,
body.page-template-page-how-to-use {
  color:var(--px-account-text);
  /* test376: canonical ambient root owns the page background. */
  background:transparent!important;
}
body.promxai-how-modern-page .px-footer,
body.page-template-page-how-to-use .px-footer { display:none; }

.px-how-v2,.px-how-v2 * { box-sizing:border-box; }
.px-how-v2 { min-height:100vh; padding:16px 0 64px; color:var(--px-account-text); }
.px-how-v2 a { color:inherit; text-decoration:none; }
.px-how-v2 button { font:inherit; }
.px-how-v2__frame { width:min(1480px,calc(100% - 30px)); margin-inline:auto; }
.px-how-v2__workspace { display:grid; grid-template-columns:216px minmax(0,1fr); gap:18px; direction:ltr; align-items:start; }
.px-how-v2__canvas { min-width:0; direction:rtl; }
html[data-ui-lang="en"] .px-how-v2__canvas { direction:ltr; }
.px-how-v2__account-tool { color:var(--px-accent-purple); }

/* Main canvas ----------------------------------------------------------- */
.px-how-v2 .px-how-page {
  width:100%; min-width:0; margin:0; padding:24px;
  border:1px solid var(--px-account-line); border-radius:26px;
  background:linear-gradient(145deg,var(--px-global-page-glass-a,rgb(10 24 55 / .70)),var(--px-global-page-glass-b,rgb(8 20 47 / .58)));
  -webkit-backdrop-filter:blur(18px) saturate(1.10);backdrop-filter:blur(18px) saturate(1.10);
  box-shadow:var(--px-global-page-glass-shadow,var(--px-account-shadow)); overflow:hidden;
}
.px-how-v2 .px-how-page__container { width:100%; max-width:none; margin:0; padding:0; }
.px-how-v2 .px-glass-panel {
  border:1px solid var(--px-account-line); background:var(--px-account-surface-2);
  box-shadow:var(--px-account-shadow-soft); backdrop-filter:none; -webkit-backdrop-filter:none;
}

/* Hero ------------------------------------------------------------------ */
.px-how-v2 .px-how-hero {
  min-height:228px; padding:24px; border-radius:22px;
  display:grid; grid-template-columns:minmax(0,.92fr) minmax(390px,1.08fr); align-items:center; gap:14px;
  position:relative; overflow:hidden;
  background:
    radial-gradient(circle at 2% 20%,rgb(var(--px-accent-blue-rgb) / .10),transparent 32%),
    radial-gradient(circle at 96% 86%,rgb(var(--px-accent-purple-rgb) / .10),transparent 34%),
    linear-gradient(135deg,var(--px-account-surface-2),var(--px-account-surface));
}
.px-how-v2 .px-how-hero::before { content:""; position:absolute; inset:0 0 auto; height:2px; background:var(--px-account-gradient); }
.px-how-v2 .px-how-hero__intro { min-width:0; position:relative; z-index:1; }
.px-how-v2 .px-how-eyebrow {
  min-height:27px; padding:0 10px; border:1px solid color-mix(in srgb,var(--px-accent-purple) 22%,transparent);
  border-radius:999px; display:inline-flex; align-items:center; color:var(--px-accent-purple);
  background:var(--px-account-gradient-soft); font-size:8px; font-weight:900;
}
.px-how-v2 .px-how-hero h1 { max-width:760px; margin:13px 0 0; color:var(--px-account-strong); font-size:clamp(32px,4vw,52px); line-height:1.16; letter-spacing:var(--px-heading-tracking,0); }
.px-how-v2 .px-how-hero h1 em { color:transparent; background:var(--px-account-gradient); -webkit-background-clip:text; background-clip:text; font-style:normal; }
.px-how-v2 .px-how-hero__intro > p { max-width:680px; margin:12px 0 0; color:var(--px-account-muted); font-size:11px; line-height:1.8; }

.px-how-v2 .px-how-selected,
.px-how-v2 .px-how-generic-card {
  min-width:0; min-height:var(--px-how-card-min-height,176px); padding:14px; border:1px solid var(--px-account-line-strong); border-radius:19px;
  display:grid; grid-template-columns:var(--px-how-media-column,102px) minmax(0,1fr); align-items:center; gap:15px; position:relative; z-index:1;
  background:color-mix(in srgb,var(--px-account-surface) 92%,transparent); box-shadow:var(--px-account-shadow-soft);
}
.px-how-v2 .px-how-selected > .px-protected-image,
.px-how-v2 .px-how-selected__placeholder {
  width:100%; aspect-ratio:var(--px-how-media-ratio,9 / 16); border:1px solid var(--px-account-line); border-radius:14px;
  display:grid; place-items:center; position:relative; overflow:hidden; background:var(--px-account-surface-soft);
}
.px-how-v2 .px-how-selected > .px-protected-image img { width:100%; height:100%; object-fit:contain; background:var(--px-account-surface-soft); }
.px-how-v2 .px-how-selected__video-play { position:absolute; z-index:3; inset:50% auto auto 50%; width:42px; height:42px; border:1px solid rgb(255 255 255 / .34); border-radius:50%; display:grid; place-items:center; color:#fff; background:rgb(8 13 28 / .64); box-shadow:0 10px 28px rgb(0 0 0 / .24); transform:translate(-50%,-50%); backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px); }
.px-how-v2 .px-how-selected__video-play .px-icon { width:24px; height:24px; }
.px-how-v2 .px-how-selected__video-duration { position:absolute; z-index:3; inset:auto 8px 8px auto; min-height:24px; padding:0 8px; border:1px solid rgb(255 255 255 / .18); border-radius:8px; display:inline-flex; align-items:center; color:#fff; background:rgb(8 13 28 / .72); font-size:8px; font-weight:900; direction:ltr; }
.px-how-v2 .px-how-selected.is-locked > .px-protected-image img { filter:blur(8px) brightness(.82) saturate(.9); transform:scale(1.055); }
.px-how-v2 .px-how-selected.is-locked > .px-protected-image::after { content:""; position:absolute; inset:0; background:linear-gradient(180deg,rgb(8 13 28 / .02),rgb(8 13 28 / .18)); }
.px-how-v2 .px-how-selected__placeholder .px-icon { width:26px; height:26px; color:var(--px-accent-purple); }
.px-how-v2 .px-how-selected.is-tall { --px-how-media-column:102px; --px-how-card-min-height:188px; }
.px-how-v2 .px-how-selected.is-portrait { --px-how-media-column:148px; --px-how-card-min-height:204px; }
.px-how-v2 .px-how-selected.is-squareish { --px-how-media-column:176px; --px-how-card-min-height:198px; }
.px-how-v2 .px-how-selected.is-landscape { --px-how-media-column:252px; --px-how-card-min-height:182px; }
.px-how-v2 .px-how-selected__body { min-width:0; }
.px-how-v2 .px-how-selected__body h2 { margin:8px 0 9px; color:var(--px-account-strong); font-size:16px; line-height:1.45; }
.px-how-v2 .px-pro-badge,.px-how-v2 .px-featured-badge { width:64px;min-width:64px;height:28px;min-height:28px;padding:0 8px;border-radius:999px;display:inline-flex;align-items:center;justify-content:center;color:#fff;font-size:10px;font-weight:900;box-sizing:border-box; }
.px-how-v2 .px-pro-badge { left:11px!important;right:auto!important;inset-inline-start:auto!important;inset-inline-end:auto!important;background:var(--px-account-gradient); }

.px-how-v2 .px-how-selected__reference-note { margin:0 0 10px; padding:9px 10px; border:1px solid var(--px-account-line); border-radius:11px; color:var(--px-account-muted); background:var(--px-account-surface-soft); font-size:8.5px; line-height:1.7; }
.px-how-v2 .px-how-selected > .px-featured-badge { top:11px; right:11px!important; left:auto!important; inset-inline-start:auto!important; inset-inline-end:auto!important; }

.px-how-v2 .px-how-selected__meta { display:flex; flex-wrap:wrap; gap:6px; color:var(--px-account-muted-2); font-size:8px; font-weight:800; }
.px-how-v2 .px-how-selected__meta > span { min-height:27px; padding:0 9px; border:1px solid var(--px-account-line); border-radius:9px; display:inline-flex; align-items:center; gap:6px; background:var(--px-account-surface-soft); }
.px-how-v2 .px-how-selected__meta .px-how-selected__type.is-video { color:var(--px-accent-blue); border-color:color-mix(in srgb,var(--px-accent-blue) 28%,var(--px-account-line)); background:color-mix(in srgb,var(--px-accent-blue) 9%,var(--px-account-surface-soft)); }
.px-how-v2 .px-how-selected__meta .px-how-selected__type.is-image { color:var(--px-accent-purple); }
.px-how-v2 .px-how-selected__meta .px-how-selected__duration { direction:ltr; color:var(--px-account-strong); }
.px-how-v2 .px-how-selected__meta .px-icon { width:12px; height:12px; }
.px-how-v2 .px-how-selected__actions { margin-top:11px; display:flex; flex-wrap:wrap; gap:7px; }
@media (min-width:761px) { .px-how-v2 .px-how-selected { transform:translateY(-6px); } }

.px-how-v2 :is(.px-primary-button,.px-secondary-button,.px-copy-button) {
  min-height:39px; padding:0 13px; border-radius:11px; display:inline-flex; align-items:center; justify-content:center; gap:7px;
  border:1px solid transparent; font-size:9px; font-weight:900; box-shadow:none;
}
.px-how-v2 .px-primary-button,.px-how-v2 .px-copy-button { color:#fff; background:var(--px-account-gradient); }
.px-how-v2 .px-secondary-button { color:var(--px-account-text); border-color:var(--px-account-line); background:var(--px-account-surface-soft); }
.px-how-v2 :is(.px-primary-button,.px-secondary-button,.px-copy-button) .px-icon { width:14px; height:14px; }
.px-how-v2 .px-how-generic-card { grid-template-columns:48px minmax(0,1fr); }
.px-how-v2 .px-how-generic-card > span { width:46px; height:46px; border-radius:14px; display:grid; place-items:center; color:var(--px-accent-purple); background:var(--px-account-gradient-soft); }
.px-how-v2 .px-how-generic-card strong,.px-how-v2 .px-how-generic-card p { display:block; }
.px-how-v2 .px-how-generic-card strong { color:var(--px-account-strong); font-size:13px; }
.px-how-v2 .px-how-generic-card p { margin:6px 0 0; color:var(--px-account-muted); font-size:9px; line-height:1.65; }

/* Golden rule and main layout ------------------------------------------ */
.px-how-v2 .px-how-golden-rule { margin:13px 0 15px; padding:13px 15px; border-radius:16px; display:grid; grid-template-columns:38px minmax(0,1fr); align-items:center; gap:11px; }
.px-how-v2 .px-how-golden-rule__icon { width:38px; height:38px; border-radius:11px; display:grid; place-items:center; color:var(--px-accent-purple); background:var(--px-account-gradient-soft); }
.px-how-v2 .px-how-golden-rule__icon .px-icon { width:18px; height:18px; }
.px-how-v2 .px-how-golden-rule strong { color:var(--px-account-strong); font-size:11px; }
.px-how-v2 .px-how-golden-rule p { margin:3px 0 0; color:var(--px-account-muted); font-size:9px; line-height:1.65; }
.px-how-v2 .px-how-golden-rule b { color:var(--px-accent-purple); }

.px-how-v2 .px-how-layout { display:grid; grid-template-columns:minmax(0,1fr) 306px; gap:14px; align-items:stretch; }
.px-how-v2 .px-how-main,.px-how-v2 .px-how-sidebar { min-width:0; }

/* Tabs and steps -------------------------------------------------------- */
.px-how-v2 .px-how-tabs { min-height:74px; margin:16px 0 14px; padding:6px; border:1px solid var(--px-account-line); border-radius:18px; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:7px; background:var(--px-account-surface-soft); }
.px-how-v2 .px-how-tabs button { min-height:60px; padding:9px 16px; border:1px solid transparent; border-radius:13px; display:flex; align-items:center; justify-content:center; gap:11px; color:var(--px-account-muted); background:transparent; cursor:pointer; text-align:start; }
.px-how-v2 .px-how-tabs button > span { min-width:0; display:grid; gap:2px; }
.px-how-v2 .px-how-tabs button strong { font-size:10px; font-weight:900; }
.px-how-v2 .px-how-tabs button small { font-size:7px; line-height:1.4; opacity:.78; }
.px-how-v2 .px-how-tabs button.is-active { color:#fff; border-color:transparent; background:var(--px-account-gradient); box-shadow:0 12px 28px rgb(var(--px-accent-purple-rgb) / .16); }
.px-how-v2 .px-how-tabs .px-icon { width:21px; height:21px; flex:0 0 auto; }
.px-how-v2 .px-how-panel { margin:0; padding:16px; border:1px solid var(--px-account-line); border-radius:19px; background:var(--px-account-surface-2); box-shadow:var(--px-account-shadow-soft); }
.px-how-v2 .px-how-panel[hidden] { display:none; }
.px-how-v2 .px-how-section-head { min-height:44px; margin:0 0 12px; padding:0 1px 11px; border-bottom:1px solid var(--px-account-line); display:flex; align-items:center; justify-content:space-between; gap:10px; }
.px-how-v2 .px-how-section-head div { color:var(--px-account-strong); font-size:17px; font-weight:900; }
.px-how-v2 .px-how-section-head strong { min-height:26px; padding:0 8px; border-radius:999px; display:inline-flex; align-items:center; color:var(--px-accent-purple); background:var(--px-account-gradient-soft); font-size:8px; }
.px-how-v2 .px-how-steps { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:9px; }
.px-how-v2 .px-how-step { min-height:238px; padding:16px; border:1px solid var(--px-account-line); border-radius:16px; display:flex; flex-direction:column; background:var(--px-account-surface); transition:transform .18s ease,border-color .18s ease; }
.px-how-v2 .px-how-step:hover { transform:translateY(-2px); border-color:color-mix(in srgb,var(--px-accent-purple) 28%,var(--px-account-line)); }
.px-how-v2 .px-how-step__top { display:flex; align-items:center; justify-content:space-between; gap:10px; }
.px-how-v2 .px-how-step__icon { width:38px; height:38px; border:0; border-radius:12px; display:grid; place-items:center; color:var(--px-accent-purple); background:var(--px-account-gradient-soft); }
.px-how-v2 .px-how-step__icon .px-icon { width:18px; height:18px; }
.px-how-v2 .px-how-step__number { min-width:31px; height:25px; padding:0 8px; border-radius:999px; display:grid; place-items:center; color:var(--px-account-muted-2); background:var(--px-account-surface-soft); font-size:8px; font-weight:900; }
.px-how-v2 .px-how-step h3 { margin:13px 0 7px; color:var(--px-account-strong); font-size:13px; line-height:1.5; }
.px-how-v2 .px-how-step p { margin:0; color:var(--px-account-muted); font-size:9px; line-height:1.75; }
.px-how-v2 .px-how-step__action { margin-top:auto; padding-top:11px; border-top:1px solid var(--px-account-line); color:var(--px-account-muted-2); font-size:8px; line-height:1.55; }

/* Prompt copy and support ---------------------------------------------- */
.px-how-v2 .px-how-copy-card { margin-top:12px; padding:16px; border-radius:19px; }
.px-how-v2 .px-how-copy-card__head { min-height:50px; padding-bottom:12px; border-bottom:1px solid var(--px-account-line); display:flex; align-items:center; justify-content:space-between; gap:12px; }
.px-how-v2 .px-how-copy-card__head h2 { margin:6px 0 0; color:var(--px-account-strong); font-size:17px; }
.px-how-v2 .px-how-copy-card__head > .px-icon { width:23px; height:23px; color:var(--px-accent-purple); }
.px-how-v2 .px-prompt-tabs { margin:13px 0 9px; padding:4px; border:1px solid var(--px-account-line); border-radius:12px; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:4px; background:var(--px-account-surface-soft); }
.px-how-v2 .px-prompt-tabs button { min-height:36px; border:0; border-radius:9px; color:var(--px-account-muted); background:transparent; font-size:9px; font-weight:900; }
.px-how-v2 .px-prompt-tabs button.is-active { color:#fff; background:var(--px-account-gradient); }
.px-how-v2 .px-prompt-panel[hidden] { display:none; }
.px-how-v2 .px-prompt-text { max-height:320px; padding:14px; border:1px solid var(--px-account-line); border-radius:13px; overflow:auto; color:var(--px-account-text); background:var(--px-account-surface-soft); font-size:9px; line-height:1.8; }
.px-how-v2 .px-copy-button { width:100%; margin-top:9px; cursor:pointer; }
.px-how-v2 .px-how-copy-note { margin:9px 0 0; display:flex; gap:7px; color:var(--px-account-muted-2); font-size:8px; line-height:1.55; }
.px-how-v2 .px-how-copy-note .px-icon { width:14px; height:14px; flex:0 0 auto; color:var(--px-accent-purple); }
.px-how-v2 .px-how-lock { margin-top:13px; padding:13px; border:1px solid color-mix(in srgb,var(--px-accent-purple) 20%,var(--px-account-line)); border-radius:14px; display:grid; grid-template-columns:38px minmax(0,1fr) auto; align-items:center; gap:10px; background:var(--px-account-gradient-soft); }
.px-how-v2 .px-how-lock > span { width:38px; height:38px; border-radius:11px; display:grid; place-items:center; color:var(--px-accent-purple); background:var(--px-account-surface); }
.px-how-v2 .px-how-lock h3 { margin:0; color:var(--px-account-strong); font-size:11px; }
.px-how-v2 .px-how-lock p { margin:4px 0 0; color:var(--px-account-muted); font-size:8px; line-height:1.55; }

.px-how-v2 .px-how-assistance {
  margin:14px 0 0; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px;
}
.px-how-v2 .px-how-assistance__card {
  min-height:94px; padding:15px; border:1px solid var(--px-account-line); border-radius:17px;
  display:grid; grid-template-columns:42px minmax(0,1fr); align-items:center; gap:11px;
  color:var(--px-account-text); background:var(--px-account-surface-2); box-shadow:var(--px-account-shadow-soft);
}
.px-how-v2 a.px-how-assistance__card { transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease; }
.px-how-v2 a.px-how-assistance__card:hover { transform:translateY(-2px); border-color:color-mix(in srgb,var(--px-accent-purple) 30%,var(--px-account-line)); box-shadow:var(--px-account-shadow); }
.px-how-v2 .px-how-assistance__icon { width:42px; height:42px; border-radius:13px; display:grid; place-items:center; color:var(--px-accent-purple); background:var(--px-account-gradient-soft); }
.px-how-v2 .px-how-assistance__icon .px-icon { width:20px; height:20px; }
.px-how-v2 .px-how-assistance__card > span:last-child { min-width:0; display:grid; gap:4px; }
.px-how-v2 .px-how-assistance__card strong { color:var(--px-account-strong); font-size:10px; font-weight:900; }
.px-how-v2 .px-how-assistance__card small { color:var(--px-account-muted); font-size:7.5px; line-height:1.55; }
.px-how-v2 .px-how-assistance__card.is-design { color:#fff; border-color:transparent; background:var(--px-account-gradient); }
.px-how-v2 .px-how-assistance__card.is-design :is(strong,small) { color:#fff; }
.px-how-v2 .px-how-assistance__card.is-design .px-how-assistance__icon { color:#fff; background:rgb(255 255 255 / .15); }
.px-how-v2 .px-how-assistance__card.is-whatsapp { border-color:color-mix(in srgb,var(--px-success) 28%,var(--px-account-line)); background:color-mix(in srgb,var(--px-success) 7%,var(--px-account-surface-2)); }
.px-how-v2 .px-how-assistance__card.is-whatsapp .px-how-assistance__icon { color:var(--px-success); background:color-mix(in srgb,var(--px-success) 13%,transparent); }
.px-how-v2 .px-how-assistance__card.is-disabled { opacity:.62; }

/* Sidebar --------------------------------------------------------------- */
.px-how-v2 .px-how-mistakes,.px-how-v2 .px-how-guide-card {
  min-height:238px; padding:16px; border-radius:18px; border:1px solid var(--px-account-line); background:var(--px-account-surface); box-shadow:var(--px-account-shadow-soft);
}
.px-how-v2 .px-how-sidebar { position:sticky; top:16px; display:grid; grid-template-rows:minmax(238px,auto) minmax(0,1fr); gap:12px; align-content:stretch; align-self:stretch; }
body.admin-bar .px-how-v2 .px-how-sidebar { top:48px; }
.px-how-v2 .px-how-mistakes { display:grid; gap:12px; align-content:start; }
.px-how-v2 .px-how-mistakes h2 { margin:0; color:var(--px-account-strong); font-size:14px; }
.px-how-v2 .px-how-mistakes ul { margin:0; padding:0; display:grid; gap:7px; list-style:none; }
.px-how-v2 .px-how-mistakes li { display:grid; grid-template-columns:19px minmax(0,1fr); gap:7px; color:var(--px-account-muted); font-size:8px; line-height:1.55; }
.px-how-v2 .px-how-mistakes li > span:first-child { width:18px; height:18px; border-radius:6px; display:grid; place-items:center; color:var(--px-danger); background:color-mix(in srgb,var(--px-danger) 8%,transparent); font-weight:900; }
.px-how-v2 .px-how-tip { margin-top:0; padding:10px; border:1px solid var(--px-account-line); border-radius:12px; display:grid; grid-template-columns:20px minmax(0,1fr); gap:7px; color:var(--px-account-muted); background:var(--px-account-surface-soft); }
.px-how-v2 .px-how-tip .px-icon { width:16px; height:16px; color:var(--px-accent-purple); }
.px-how-v2 .px-how-tip p { margin:0; font-size:7px; line-height:1.5; }

.px-how-v2 .px-how-guide-card {
  display:grid; gap:12px; align-content:start; height:100%;
  background:
    linear-gradient(180deg,color-mix(in srgb,var(--px-account-surface) 92%,transparent),color-mix(in srgb,var(--px-account-surface-2) 96%,transparent));
}
.px-how-v2 .px-how-guide-card__head { display:grid; gap:7px; }
.px-how-v2 .px-how-guide-card__meta { display:flex; flex-wrap:wrap; gap:5px; }
.px-how-v2 .px-how-guide-card__meta > span,
.px-how-v2 .px-how-guide-card__meta > b {
  min-height:22px; padding:0 7px; border-radius:999px; display:inline-flex; align-items:center; gap:4px;
  color:var(--px-account-muted); background:var(--px-account-surface-soft); font-size:6.8px; font-weight:850;
}
.px-how-v2 .px-how-guide-card__meta > b { color:var(--px-accent-purple); background:var(--px-account-gradient-soft); }
.px-how-v2 .px-how-guide-card__meta .px-icon { width:11px; height:11px; }
.px-how-v2 .px-how-guide-card h2 { margin:0; color:var(--px-account-strong); font-size:12px; line-height:1.5; }
.px-how-v2 .px-how-guide-card p { margin:0; color:var(--px-account-muted); font-size:7.8px; line-height:1.55; }
.px-how-v2 .px-how-guide-card__visual {
  padding:14px; border:1px solid var(--px-account-line); border-radius:14px; display:grid; place-items:center;
  background:linear-gradient(180deg,var(--px-account-surface-soft),color-mix(in srgb,var(--px-account-surface) 86%,transparent));
}
.px-how-v2 .px-how-guide-card__cover-link {
  width:116px; height:156px; border:1px solid var(--px-account-line-strong); border-radius:16px; display:grid; place-items:center;
  overflow:hidden; background:var(--px-account-surface);
  box-shadow:var(--px-account-shadow-soft);
}
.px-how-v2 .px-how-guide-card__cover-link img { width:100%; height:100%; object-fit:cover; }
.px-how-v2 .px-how-guide-card__cover-link.is-placeholder .px-icon { width:28px; height:28px; color:var(--px-accent-purple); }
.px-how-v2 .px-how-guide-card__topics {
  padding:12px; border:1px solid var(--px-account-line); border-radius:14px; background:var(--px-account-surface-soft);
}
.px-how-v2 .px-how-guide-card__topics > strong { display:block; color:var(--px-account-strong); font-size:8px; font-weight:900; }
.px-how-v2 .px-how-guide-card__topics ul { margin:10px 0 0; padding:0; display:grid; gap:7px; list-style:none; }
.px-how-v2 .px-how-guide-card__topics li { display:grid; grid-template-columns:18px minmax(0,1fr); gap:7px; color:var(--px-account-muted); font-size:7.6px; line-height:1.5; }
.px-how-v2 .px-how-guide-card__topics li > span:first-child {
  width:18px; height:18px; border-radius:50%; display:grid; place-items:center; color:#fff; background:var(--px-account-gradient); font-size:10px; font-weight:900;
}
.px-how-v2 .px-how-guide-card__actions { display:grid; grid-template-columns:1fr; gap:7px; }
.px-how-v2 .px-how-guide-card__action {
  min-height:38px; padding:0 11px; border:1px solid var(--px-account-line); border-radius:11px; display:flex; align-items:center; justify-content:center; gap:7px;
  color:var(--px-account-text); background:var(--px-account-surface-soft); font-size:8px; font-weight:900;
}
.px-how-v2 .px-how-guide-card__action.is-primary { color:#fff; border-color:transparent; background:var(--px-account-gradient); }
.px-how-v2 .px-how-guide-card__action .px-icon { width:13px; height:13px; }
.px-how-v2 #px-how-practical { scroll-margin-top:24px; }
.px-how-v2 .px-how-generic-card.is-guide-entry { border-color:color-mix(in srgb,var(--px-accent-purple) 24%,var(--px-account-line)); }
/* Final prompt copy ----------------------------------------------------- */
.px-how-v2 .px-how-copy-card--final {
  width:100%; margin-top:16px; padding:18px; border-radius:20px;
  background:
    radial-gradient(circle at 0 0,rgb(var(--px-accent-blue-rgb) / .07),transparent 30%),
    radial-gradient(circle at 100% 100%,rgb(var(--px-accent-purple-rgb) / .07),transparent 32%),
    var(--px-account-surface-2);
}
.px-how-v2 .px-how-copy-card--final .px-how-copy-card__head { margin-bottom:13px; }
.px-how-v2 #px-how-prompt-copy { scroll-margin-top:24px; }

/* Responsive ------------------------------------------------------------ */
@media (max-width:1180px) {
  .px-how-v2__frame { width:min(1160px,calc(100% - 24px)); }
  .px-how-v2__workspace { grid-template-columns:202px minmax(0,1fr); gap:14px; }
  .px-how-v2 .px-how-page { padding:20px; }
  .px-how-v2 .px-how-hero { grid-template-columns:minmax(0,.94fr) minmax(340px,1.06fr); gap:12px; }
  .px-how-v2 .px-how-layout { grid-template-columns:minmax(0,1fr) 280px; }
  .px-how-v2 .px-how-steps { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .px-how-v2 .px-how-assistance { grid-template-columns:repeat(3,minmax(0,1fr)); }
}
@media (max-width:940px) and (min-width:761px) {
  .px-how-v2__workspace { grid-template-columns:184px minmax(0,1fr); gap:11px; }
  .px-how-v2 .px-how-page { padding:18px; }
  .px-how-v2 .px-how-hero { grid-template-columns:1fr; }
  .px-how-v2 .px-how-selected { max-width:none; width:100%; }
  .px-how-v2 .px-how-layout { grid-template-columns:1fr; }
  .px-how-v2 .px-how-sidebar { position:static; grid-template-columns:repeat(2,minmax(0,1fr)); grid-template-rows:none; }
}
@media (max-width:760px) {
  .px-how-v2 { min-height:0; padding:9px 0 calc(28px + env(safe-area-inset-bottom,0px)); }
  .px-how-v2__frame { width:min(100% - 18px,720px); }
  .px-how-v2__workspace { grid-template-columns:1fr; gap:10px; }
  .px-how-v2 .px-how-page { padding:14px; border-radius:20px; }
  .px-how-v2 .px-how-hero { min-height:0; padding:18px; grid-template-columns:1fr; border-radius:19px; }
  .px-how-v2 .px-how-hero h1 { font-size:32px; }
  .px-how-v2 .px-how-selected { min-height:0; transform:none; }
  .px-how-v2 .px-how-selected.is-tall { --px-how-media-column:82px; --px-how-card-min-height:0; }
  .px-how-v2 .px-how-selected.is-portrait { --px-how-media-column:108px; --px-how-card-min-height:0; }
  .px-how-v2 .px-how-selected.is-squareish { --px-how-media-column:120px; --px-how-card-min-height:0; }
  .px-how-v2 .px-how-selected.is-landscape { --px-how-card-min-height:0; grid-template-columns:1fr; }
  .px-how-v2 .px-how-selected.is-landscape > .px-protected-image { width:min(100%,360px); justify-self:center; }
  .px-how-v2 .px-how-selected.is-landscape .px-how-selected__body { width:100%; }
  .px-how-v2 .px-how-selected:not(.is-landscape) { align-items:start; gap:12px; }
  .px-how-v2 .px-how-selected:not(.is-landscape) .px-how-selected__body { display:contents; }
  .px-how-v2 .px-how-selected:not(.is-landscape) > .px-protected-image,
  .px-how-v2 .px-how-selected:not(.is-landscape) > .px-how-selected__placeholder { grid-column:1; grid-row:1 / span 2; align-self:start; }
  .px-how-v2 .px-how-selected:not(.is-landscape) .px-pro-badge { position:absolute; top:11px; left:11px!important; right:auto!important; margin:0; }
  .px-how-v2 .px-how-selected:not(.is-landscape) .px-how-selected__body h2 { grid-column:2; margin:0; align-self:end; }
  .px-how-v2 .px-how-selected:not(.is-landscape) .px-how-selected__meta { grid-column:2; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:6px; width:100%; }
  .px-how-v2 .px-how-selected:not(.is-landscape) .px-how-selected__meta > :is(span,a) { width:100%; min-width:0; justify-content:center; text-align:center; }
  .px-how-v2 .px-how-selected:not(.is-landscape) .px-how-selected__meta > .px-how-selected__category { grid-column:1/-1; }
  .px-how-v2 .px-how-selected__actions { grid-column:1/-1; width:100%; margin-top:2px; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:7px; }
  .px-how-v2 .px-how-selected__actions a { width:100%; min-width:0; padding-inline:9px; }
  .px-how-v2 .px-how-selected.is-landscape .px-how-selected__actions { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); }
  .px-how-v2 .px-how-layout { grid-template-columns:1fr; }
  .px-how-v2 .px-how-sidebar { position:static; grid-template-rows:none; }
  .px-how-v2 .px-how-panel { padding:13px; }
  .px-how-v2 .px-how-steps { grid-template-columns:1fr; }
  .px-how-v2 .px-how-step { min-height:0; }
  .px-how-v2 .px-how-assistance { grid-template-columns:1fr; }
  .px-how-v2 .px-how-lock { grid-template-columns:38px minmax(0,1fr); }
  .px-how-v2 .px-how-lock .px-primary-button { grid-column:1/-1; }
}
@media (max-width:430px) {
  .px-how-v2 .px-how-hero { padding:16px; }
  .px-how-v2 .px-how-hero h1 { font-size:29px; }
  .px-how-v2 .px-how-selected { padding:10px; }
  .px-how-v2 .px-how-selected.is-tall { --px-how-media-column:70px; }
  .px-how-v2 .px-how-selected.is-portrait { --px-how-media-column:88px; }
  .px-how-v2 .px-how-selected.is-squareish { --px-how-media-column:98px; }
  .px-how-v2 .px-how-selected__body h2 { font-size:14.5px; line-height:1.4; }
  .px-how-v2 .px-how-selected__meta { font-size:7.4px; }
  .px-how-v2 :is(.px-primary-button,.px-secondary-button) { min-height:42px; font-size:8.2px; }
  .px-how-v2 .px-how-tabs button { font-size:8px; }
  .px-how-v2 .px-how-section-head { align-items:flex-start; flex-direction:column; }
  .px-how-v2 .px-how-guide-card__cover-link { width:104px; height:140px; }
}
@media (prefers-reduced-motion:reduce) {
  .px-how-v2 .px-how-step,.px-how-v2 :is(.px-primary-button,.px-secondary-button,.px-copy-button) { transition:none; }
}


/* 1.4.15.85 — selected prompt refinements ------------------------------- */
.px-how-v2 .px-how-selected__meta > .px-how-selected__ratio { color:var(--px-account-strong); }
.px-how-v2 .px-how-selected__meta > .px-how-selected__category {
  min-height:27px; padding:0 10px; border:1px solid color-mix(in srgb,var(--px-accent-purple) 26%,var(--px-account-line));
  border-radius:9px; display:inline-flex; align-items:center; gap:6px; color:var(--px-accent-purple);
  background:color-mix(in srgb,var(--px-accent-purple) 8%,var(--px-account-surface-soft));
  transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease,background .18s ease;
}
.px-how-v2 .px-how-selected__meta > .px-how-selected__category:hover {
  transform:translateY(-1px); border-color:color-mix(in srgb,var(--px-accent-purple) 44%,var(--px-account-line));
  box-shadow:0 10px 24px rgb(var(--px-accent-purple-rgb) / .10);
  background:color-mix(in srgb,var(--px-accent-purple) 11%,var(--px-account-surface-soft));
}
.px-how-v2 .px-how-selected__meta > .px-how-selected__category bdi { color:var(--px-account-strong); font-weight:900; }
.px-how-v2 .px-how-selected__golden-rule {
  margin-top:10px; padding:11px 12px; border:1px solid color-mix(in srgb,var(--px-accent-purple) 24%,var(--px-account-line));
  border-radius:14px; display:grid; grid-template-columns:36px minmax(0,1fr); gap:10px;
  background:linear-gradient(135deg,color-mix(in srgb,var(--px-accent-blue) 5%,var(--px-account-surface-soft)),color-mix(in srgb,var(--px-accent-purple) 8%,var(--px-account-surface-soft)));
}
.px-how-v2 .px-how-selected__golden-icon {
  width:36px; height:36px; border-radius:11px; display:grid; place-items:center; color:#fff;
  background:var(--px-account-gradient); box-shadow:0 10px 24px rgb(var(--px-accent-purple-rgb) / .16);
}
.px-how-v2 .px-how-selected__golden-icon .px-icon { width:18px; height:18px; }
.px-how-v2 .px-how-selected__golden-copy { min-width:0; display:grid; gap:3px; }
.px-how-v2 .px-how-selected__golden-copy strong { color:var(--px-account-strong); font-size:10px; font-weight:900; }
.px-how-v2 .px-how-selected__golden-copy p { margin:0; color:var(--px-account-muted); font-size:7.9px; line-height:1.65; }

/* 1.4.15.85 — unified help hub ---------------------------------------- */
.px-how-v2 .px-how-help-hub {
  margin:14px 0 0; padding:16px; border-radius:19px;
  display:grid; grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr); gap:14px; align-items:stretch;
  background:
    radial-gradient(circle at 0 0,rgb(var(--px-accent-blue-rgb) / .06),transparent 30%),
    radial-gradient(circle at 100% 100%,rgb(var(--px-accent-purple-rgb) / .08),transparent 34%),
    var(--px-account-surface-2);
}
.px-how-v2 .px-how-help-hub__intro {
  min-width:0; padding:14px; border:1px solid var(--px-account-line); border-radius:16px;
  display:grid; grid-template-columns:48px minmax(0,1fr); gap:12px; align-items:center;
  background:var(--px-account-surface-soft);
}
.px-how-v2 .px-how-help-hub__icon {
  width:48px; height:48px; border-radius:15px; display:grid; place-items:center; color:#fff;
  background:var(--px-account-gradient); box-shadow:0 12px 30px rgb(var(--px-accent-purple-rgb) / .18);
}
.px-how-v2 .px-how-help-hub__icon .px-icon { width:22px; height:22px; }
.px-how-v2 .px-how-help-hub__intro strong { display:block; color:var(--px-account-strong); font-size:12px; }
.px-how-v2 .px-how-help-hub__intro p { margin:6px 0 0; color:var(--px-account-muted); font-size:8px; line-height:1.7; }
.px-how-v2 .px-how-help-hub__actions { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; }
.px-how-v2 .px-how-help-hub__action {
  min-height:112px; padding:14px; border:1px solid var(--px-account-line); border-radius:17px;
  display:grid; grid-template-columns:40px minmax(0,1fr); gap:10px; align-items:center;
  color:var(--px-account-text); background:var(--px-account-surface); box-shadow:var(--px-account-shadow-soft);
}
.px-how-v2 a.px-how-help-hub__action { transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease; }
.px-how-v2 a.px-how-help-hub__action:hover { transform:translateY(-2px); border-color:color-mix(in srgb,var(--px-accent-purple) 30%,var(--px-account-line)); box-shadow:var(--px-account-shadow); }
.px-how-v2 .px-how-help-hub__action-icon {
  width:40px; height:40px; border-radius:13px; display:grid; place-items:center; color:var(--px-accent-purple);
  background:var(--px-account-gradient-soft);
}
.px-how-v2 .px-how-help-hub__action-icon .px-icon { width:19px; height:19px; }
.px-how-v2 .px-how-help-hub__action > span:last-child { min-width:0; display:grid; gap:4px; }
.px-how-v2 .px-how-help-hub__action strong { color:var(--px-account-strong); font-size:10px; font-weight:900; }
.px-how-v2 .px-how-help-hub__action small { color:var(--px-account-muted); font-size:7.4px; line-height:1.55; }
.px-how-v2 .px-how-help-hub__action.is-design { color:#fff; border-color:transparent; background:var(--px-account-gradient); }
.px-how-v2 .px-how-help-hub__action.is-design :is(strong,small) { color:#fff; }
.px-how-v2 .px-how-help-hub__action.is-design .px-how-help-hub__action-icon { color:#fff; background:rgb(255 255 255 / .16); }
.px-how-v2 .px-how-help-hub__action.is-whatsapp { border-color:color-mix(in srgb,var(--px-success) 28%,var(--px-account-line)); background:color-mix(in srgb,var(--px-success) 6%,var(--px-account-surface)); }
.px-how-v2 .px-how-help-hub__action.is-whatsapp .px-how-help-hub__action-icon { color:var(--px-success); background:color-mix(in srgb,var(--px-success) 12%,transparent); }
.px-how-v2 .px-how-help-hub__action.is-disabled { opacity:.62; }

@media (max-width:1180px) {
  .px-how-v2 .px-how-help-hub { grid-template-columns:1fr; }
}
@media (max-width:940px) and (min-width:761px) {
  .px-how-v2 .px-how-help-hub__actions { grid-template-columns:repeat(3,minmax(0,1fr)); }
}
@media (max-width:760px) {
  .px-how-v2 .px-how-selected__golden-rule { grid-template-columns:1fr; }
  .px-how-v2 .px-how-selected__golden-icon { width:34px; height:34px; }
  .px-how-v2 .px-how-help-hub { padding:14px; }
  .px-how-v2 .px-how-help-hub__intro { grid-template-columns:42px minmax(0,1fr); }
  .px-how-v2 .px-how-help-hub__icon { width:42px; height:42px; border-radius:13px; }
  .px-how-v2 .px-how-help-hub__actions { grid-template-columns:1fr; }
  .px-how-v2 .px-how-help-hub__action { min-height:0; }
}


/* 1.4.15.85 — final explain refinements -------------------------------- */
.px-how-v2 .px-how-help-hub {
  margin:14px 0 0; padding:16px; border-radius:19px; display:grid; gap:14px;
  background:
    radial-gradient(circle at 0 0,rgb(var(--px-accent-blue-rgb) / .06),transparent 30%),
    radial-gradient(circle at 100% 100%,rgb(var(--px-accent-purple-rgb) / .08),transparent 34%),
    var(--px-account-surface-2);
}
.px-how-v2 .px-how-help-hub__head {
  min-width:0; padding:14px 16px; border:1px solid var(--px-account-line); border-radius:16px;
  display:grid; grid-template-columns:48px minmax(0,1fr); gap:12px; align-items:center;
  background:linear-gradient(135deg,color-mix(in srgb,var(--px-accent-blue) 5%,var(--px-account-surface-soft)),color-mix(in srgb,var(--px-accent-purple) 8%,var(--px-account-surface-soft)));
}
.px-how-v2 .px-how-help-hub__copy { min-width:0; }
.px-how-v2 .px-how-help-hub__copy strong { display:block; color:var(--px-account-strong); font-size:12px; font-weight:900; }
.px-how-v2 .px-how-help-hub__copy p { margin:6px 0 0; color:var(--px-account-muted); font-size:8px; line-height:1.7; }
.px-how-v2 .px-how-help-hub__actions { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; }
.px-how-v2 .px-how-help-hub__action { min-height:118px; align-content:center; }
.px-how-v2 .px-how-help-hub__action strong { font-size:10.5px; }
.px-how-v2 .px-how-help-hub__action small { font-size:7.6px; }
.px-how-v2 .px-how-golden-rule {
  margin:14px 0 16px; padding:14px 16px; border-radius:18px;
  display:grid; grid-template-columns:44px minmax(0,1.1fr) minmax(240px,.9fr); gap:12px; align-items:center;
  background:
    radial-gradient(circle at 0 0,rgb(var(--px-accent-blue-rgb) / .05),transparent 30%),
    radial-gradient(circle at 100% 100%,rgb(var(--px-accent-purple-rgb) / .08),transparent 34%),
    var(--px-account-surface-2);
}
.px-how-v2 .px-how-golden-rule__icon {
  width:44px; height:44px; border-radius:14px; color:#fff; background:var(--px-account-gradient);
  box-shadow:0 14px 28px rgb(var(--px-accent-purple-rgb) / .16);
}
.px-how-v2 .px-how-golden-rule__copy { min-width:0; }
.px-how-v2 .px-how-golden-rule__copy strong { display:block; color:var(--px-account-strong); font-size:12px; font-weight:900; }
.px-how-v2 .px-how-golden-rule__copy p { margin:5px 0 0; color:var(--px-account-muted); font-size:8.6px; line-height:1.75; }
.px-how-v2 .px-how-golden-rule__chips {
  min-width:0; display:flex; flex-wrap:wrap; justify-content:flex-end; gap:8px;
}
.px-how-v2 .px-how-golden-rule__chips > span {
  min-height:31px; padding:0 11px; border:1px solid color-mix(in srgb,var(--px-accent-purple) 18%,var(--px-account-line)); border-radius:999px;
  display:inline-flex; align-items:center; color:var(--px-account-strong); background:var(--px-account-surface-soft); font-size:8px; font-weight:800;
}
.px-how-v2 .px-how-tabs { margin:16px 0 0; }
.px-how-v2 .px-how-tabs button { min-height:80px; }
@media (max-width:1180px) {
  .px-how-v2 .px-how-golden-rule { grid-template-columns:44px minmax(0,1fr); }
  .px-how-v2 .px-how-golden-rule__chips { grid-column:1/-1; justify-content:flex-start; }
}
@media (max-width:760px) {
  .px-how-v2 .px-how-help-hub__head { grid-template-columns:42px minmax(0,1fr); }
  .px-how-v2 .px-how-help-hub__actions { grid-template-columns:1fr; }
  .px-how-v2 .px-how-help-hub__action { min-height:0; }
  .px-how-v2 .px-how-golden-rule { grid-template-columns:1fr; }
  .px-how-v2 .px-how-golden-rule__icon { width:40px; height:40px; }
  .px-how-v2 .px-how-golden-rule__chips { justify-content:flex-start; }
}

/* 1.4.15.91 — keep help hub balanced when WhatsApp is not configured */
.px-how-v2 .px-how-help-hub__actions.has-two-actions{
  grid-template-columns:repeat(2,minmax(0,1fr));
}
@media (max-width:760px){
  .px-how-v2 .px-how-help-hub__actions.has-two-actions{grid-template-columns:1fr}
}

/* 1.4.15.92 — visible but disabled WhatsApp action */
.px-how-v2 .px-how-help-hub__action.is-whatsapp.is-disabled {
  opacity:1!important;
  pointer-events:none!important;
  cursor:not-allowed!important;
  user-select:none!important;
  filter:saturate(.68);
  border-color:color-mix(in srgb,var(--px-success) 18%,var(--px-account-line))!important;
  background:color-mix(in srgb,var(--px-success) 3%,var(--px-account-surface))!important;
}
.px-how-v2 .px-how-help-hub__action.is-whatsapp.is-disabled .px-how-help-hub__action-icon {
  color:color-mix(in srgb,var(--px-success) 55%,var(--px-account-muted))!important;
  background:color-mix(in srgb,var(--px-success) 7%,transparent)!important;
}
.px-how-v2 .px-how-help-hub__action.is-whatsapp.is-disabled small {
  color:var(--px-account-muted)!important;
}