/* AhStepper (stepper-sync.js): pinned picture beside steps. Logical properties only. No text under 13px.
   Default and below 900px: a plain stacked list, "Step N of M" on each step, no picture. */
.ahs-pic{display:none}
.ahs-list{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.ahs-n{display:block;color:var(--muted);font-size:var(--fs-13);font-weight:var(--fw-semibold);white-space:nowrap}
.ahs-btn{display:flex;inline-size:100%;min-block-size:44px;align-items:center;gap:10px;padding:10px 14px;background:transparent;border:0;color:var(--ink);font:inherit;font-weight:var(--fw-semibold);text-align:start;cursor:pointer}
.ahs-btn:focus-visible{outline:2px solid var(--ink);outline-offset:2px}
.ahs-body{padding:0 14px 14px;color:var(--ink-2)}
.ahs-body[hidden]{display:none}

/* wide screens only: the picture is pinned, the steps scroll beside it */
@media (min-width:900px){
  .ahs.is-live{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:var(--s-6);align-items:start}
  .ahs.is-live .ahs-pic{display:block;position:sticky;inset-block-start:calc(var(--top-h,72px) + 16px)}
  .ahs.is-live .ahs-n{display:none}
  .ahs.is-live .ahs-list{gap:0}
  .ahs.is-live .ahs-step{min-block-size:22vh;display:flex;align-items:center;transition:opacity var(--dur-fast,.15s) ease}
  .ahs.is-live .ahs-step:not(.is-active){opacity:.55}
  .ahs.is-live.ahs-acc .ahs-step{min-block-size:0;display:block;border-block-end:1px solid var(--border)}
}
.ahs-screen{background:var(--card);border:1px solid var(--border);border-radius:var(--r-lg,16px);box-shadow:var(--shadow-1);overflow:hidden}
.ahs-bar{display:flex;align-items:center;gap:6px;padding:10px 14px;background:var(--card-2);border-block-end:1px solid var(--border)}
.ahs-bar i{inline-size:10px;block-size:10px;border-radius:50%;background:var(--border)}
.ahs-bar .badge{margin-inline-start:auto}
.ahs-view{display:grid;gap:var(--s-3);justify-items:start;padding:var(--s-6);min-block-size:240px;align-content:center}
.ahs-icon{inline-size:56px;block-size:56px;color:var(--ink)}
.ahs-title{margin:0;font-weight:var(--fw-semibold);font-size:var(--fs-20,20px);line-height:1.3;color:var(--ink)}
.ahs-count{margin:0;color:var(--muted);font-size:var(--fs-14)}

/* reduced motion: no fades, no dimming; the list stays plain (the script also skips the pinned mode) */
@media (prefers-reduced-motion:reduce){
  .ahs .ahs-step{transition:none!important;opacity:1!important}
}
/* safety net below 900px even before the script runs */
@media (max-width:899.98px){
  .ahs.is-live{display:block}
  .ahs .ahs-pic{display:none!important}
}