/* ==========================================================================
   assets/css/legacy-pages.css — Brutal Lite v3.1, PAGE-SPECIFIC LEFTOVERS
   Loaded AFTER assets/css/brutal-lite.css + brutal-lite-web.css. Contains
   ONLY classes those two files do not define: the old assets/css/lite.css
   (pre-strict-mode draft) duplicated most of Appendix A under different
   names/token values — that duplicate part was deleted; what's left here is
   genuinely page-specific CSS that some pages still reference, so switching
   stylesheets does not break them. See brutal-lite-work/STRICT-CONTRACT.md.

   DELETE FROM HERE as each page is rebuilt against brutal-lite.css classes:

   SECTION 1 — compatibility shim (").lite-page"/"body.lite"): a handful of
   auth + onboarding pages still wrap content in <body class="lite ob-...">
   <div class="lite-page ...">, the pre-strict naming, instead of the
   strict contract's <body class="lite-v31 ..."><div class="page ...">.
   Delete a page's use of .lite-page/body.lite once that page is rebuilt to
   use .page + the brutal-lite.js contract classes (see STRICT-CONTRACT.md
   §"Migrating a page off legacy-pages.css").
     Classes: body.lite, .lite-page, .lite-page.no-footer, .lite-page.has-plan-bar

   SECTION 2 — AUTH PAGES (login, register/signup, username, verified,
   forgot, check-email, reset, phone code). Reference: auth-login-preview.html
   etc (section 13 of the strict rules). Not yet checked against the
   reference pixel-for-pixel by this pass — page builders: diff against the
   reference file and move/replace classes into your own page CSS as you go.
     Classes: .auth-body .logo-stamp .btn-social .or-div .forgot-row
     .bottom-link .top-bar .link-field .link-prefix .field-hint-ok
     .strength-row .strength-bar .strength-label .check-row .checkbox
     .check-label .avatar-wrap .camera-badge .at-prefix .hint-ok
     .field-hint-grey .chip-row .footnote .center-body .confetti-wrap
     .success-circle .body-text .btn-group .icon-tile .subtitle
     .strength-seg-row .strength-seg .match-note .checklist .check-item .tick
     .code-row .code-box .resend-note

   SECTION 3 — ONBOARDING (6-step welcome journey). Reference:
   onboard-welcome-preview.html etc. Welcome + Intro (start.php) were moved
   to their own page CSS (assets/css/page-onboard-welcome.css,
   assets/css/page-onboard-intro.css) by builder B1 — rebuilt against the
   reference. All four of welcome.php's steps (Pick interests, Allow
   location, Follow creators, All set) were moved to
   assets/css/page-onboarding.css by builder B2 — rebuilt against
   onboard-interests/-location/-creators/-done-preview.html. What remains
   here is the top row/step bar shared by every step, plus a few classes
   that OTHER pages also reuse (search.php, pin.php, plan.php, creators.php,
   etc.) and so are kept here rather than moved into welcome.php's own
   stylesheet — page-onboarding.css only adds onboarding-only positioning
   on top of these, it never redefines them:
     Classes: .top-row .step-bar .step-seg .skip-btn .step-label .onb-head
     .seal .map-pin (bare circle only) .stat-row .pill

   None of these redefine :root tokens — they use var(--ink) etc, which now
   resolve against brutal-lite.css's (Appendix A) values automatically.
   ========================================================================== */

/* ---------- SECTION 1: .lite-page / body.lite compatibility shim ---------- */
body.lite{
  margin:0;background:var(--paper);color:var(--ink);font-family:var(--font-ui);
  -webkit-tap-highlight-color:transparent;
}
body.lite *{box-sizing:border-box;}
body.lite img{-webkit-user-drag:none;}
:where(body.lite) button{font-family:inherit;color:inherit;}
:where(body.lite) a{color:inherit;text-decoration:none;}
.lite-page{
  max-width:393px;margin:0 auto;min-height:100vh;position:relative;
  padding:calc(58px + env(safe-area-inset-top,0px)) 16px calc(120px + env(safe-area-inset-bottom,0px));
}
.lite-page.no-footer{padding-bottom:calc(40px + env(safe-area-inset-bottom,0px));}
.lite-page.has-plan-bar{padding-bottom:calc(200px + env(safe-area-inset-bottom,0px));}
@media (min-width:481px){
  body.lite{background:#e8e9ec;}
  .lite-page{background:var(--paper);box-shadow:var(--soft);min-height:100vh;}
}

/* SECTION 2 — AUTH PAGES: moved to assets/css/page-auth.css (builder B1,
   see PAGE-BUILDER.md report). Deleted here on purpose; do not re-add. */

/* ============================================================================
   SECTION 3 — ONBOARDING (batch 1 legacy) — 6-step welcome journey after
   sign-up/username
   (Welcome + Intro moved to assets/css/page-onboard-welcome.css and
   assets/css/page-onboard-intro.css — builder B1, see those files' headers.
   What's left here is shared by welcome.php's steps 2-5 only.)
   ============================================================================ */
/* -- shared onboarding top row (steps 2-5 of welcome.php) -- */
.top-row{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px;gap:10px;}
.step-bar{display:flex;gap:6px;flex:1;margin:0 14px;}
.step-seg{flex:1;height:4px;border-radius:2px;background:var(--line);}
.step-seg.filled{background:var(--ink);}
.skip-btn{font:700 14px/1 var(--font-ui);color:var(--muted);background:none;border:0;cursor:pointer;padding:10px;min-height:44px;}
.step-label{font:800 12px/1 var(--font-ui);color:var(--muted);text-transform:uppercase;letter-spacing:.06em;margin-bottom:18px;}
.onb-head{margin-bottom:20px;}
.onb-head .h1{font-size:28px;margin-bottom:6px;}

/* -- step 3 Interests, step 4 Location: rebuilt against the strict rules —
   moved to assets/css/page-onboarding.css (builder B2, see PAGE-BUILDER.md
   report). Deleted here on purpose; do not re-add. -- */

/* -- step 5 Follow creators, step 6 All set: rebuilt against the strict
   rules — moved to assets/css/page-onboarding.css (builder B2, see
   PAGE-BUILDER.md report). Deleted here on purpose; do not re-add.
   .seal, the bare .map-pin circle, .stat-row and .pill stay below — other
   pages (search.php, pin.php, plan.php, creators.php, etc.) reuse them. -- */
.seal{color:var(--blue);font-size:13px;flex:0 0 auto;}
.map-pin{position:absolute;width:30px;height:30px;border-radius:50%;border:2.5px solid var(--ink);overflow:hidden;background:#fff;}
.map-pin img{width:100%;height:100%;object-fit:cover;display:block;}
.stat-row{display:flex;gap:8px;width:100%;}
.stat-row .pill{flex:1;justify-content:center;}
.pill{display:inline-flex;align-items:center;gap:4px;padding:4px 9px;border:1px solid var(--line);border-radius:var(--r-pill);
  font:800 11.5px/1 var(--font-ui);background:#fff;color:var(--ink);}
