/* legacy-views.css — rules main's older views still need that the mirror's ds.src.css never covered
 * (Final QA 4831471, Final Tech Lead 4831643, task #13). ds.src.css stays mirror-identical; this sheet is
 * listed BEFORE ds.css in shell.ts SHELL_SHEETS so ds.css wins any tie.
 *
 * Contents: every rule from main ec722de's old layer sheets whose selector names one of QA's 58 classes,
 * declarations copied unchanged; selectors in a shared list that name none of the 58 are dropped so this
 * sheet cannot restyle anything ds.css already owns. Each block names its source sheet and the view file.
 * run-tests group "legacy-views" asserts all 58 classes keep a rule across ds.css + legacy-views.css.
 *
 * Each athlete port (Final Designer, task #12) deletes its own blocks when it lands; when the file is empty
 * it is removed with its <link> (docs/replay LEFTOVERS). Never add new rules here: new styles go in ds.src.css.
 */

/* ══ views.js (landing) — land-benefits land-faq land-fine-c land-plan-flag land-product-art land-product-copy land-product-dark land-product-hero land-product-light land-proof reveal-1 ══ */

/* source: style.css (main ec722de) · used by views.js */
.reveal-1 { animation-delay: .05s }
.pw-card .land-plan-flag { top: -.7rem; left: 1.15rem; }

/* source: theme-v2.css (main ec722de) · used by views.js */
.land-fine-c { text-align: center; margin-top: 1.4rem; }
.land-plan-flag {
  position: absolute; top: -.75rem; left: 1.4rem;
  background: var(--accent-fill); color: var(--accent-on);
  font-size: .66rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase;
  padding: .3rem .7rem; border-radius: 999px;
}
.land-plan-flag { top: -14px; left: var(--card-pad); min-height: 28px; display: inline-flex; align-items: center; padding: 0 var(--s3); background: var(--raised); color: var(--txt-1); border: 1px solid var(--line-2); font-size: var(--t-kicker); letter-spacing: .08em; border-radius: var(--r-ctl); }
.land-fine.land-fine-c { margin-top: var(--s4); font-size: 12.5px; color: var(--txt-3); }
.land-simple .land-proof { margin: 1.5rem auto 0; max-width: 44rem; text-align: center; color: var(--txt-2); font-size: 14px; line-height: 1.6; }
.land-simple .land-proof strong { color: var(--txt-1); }
.land-simple .land-benefits dt { margin: 0; color: var(--txt-1); font-size: 18px; font-weight: 750; line-height: 1.35; }
.land-simple .land-benefits dd { margin: .65rem 0 0; color: var(--txt-2); font-size: 16px; line-height: 1.6; }
.land-simple .land-benefits { margin: 0; display: grid; gap: 1.5rem; }
.land-simple .land-benefits > div { padding-left: 1.25rem; border-left: 2px solid var(--line-2); }
.land-simple .land-fine-c { color: var(--txt-2); font-size: 14px; line-height: 1.6; }
.land-simple .land-faq { margin-top: 1.5rem; border-bottom: 1px solid var(--line-2); }
.land-simple .land-faq details { border-top: 1px solid var(--line-2); }
.land-simple .land-faq summary { padding: 1.1rem .25rem; min-height: 56px; cursor: pointer; font-size: 16px; line-height: 1.5; font-weight: 650; color: var(--txt-1); }
.land-simple .land-faq p { max-width: 48rem; margin: 0; padding: 0 .25rem 1.25rem; font-size: 16px; line-height: 1.6; color: var(--txt-2); }
.land-simple .land-benefits { gap: 24px; }
.land-simple .land-benefits > div { padding-left: 16px; }
.land-simple .land-product-hero { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: center; column-gap: clamp(1rem, 3vw, 3rem); padding: 1rem clamp(1rem, 3vw, 2.5rem) 2rem; text-align: left; background: var(--sunken); border-radius: 28px; overflow: hidden; }
.land-simple .land-product-hero .land-simple-nav { grid-column: 1 / -1; margin-bottom: 1.5rem; }
.land-simple .land-product-hero :is(.land-wordmark, .land-simple-nav a, .land-link) { color: var(--txt-1); }
.land-simple .land-product-copy { min-width: 0; padding-bottom: 1.5rem; }
.land-simple .land-product-hero .land-eyebrow { background: var(--raised); border: 0; color: var(--txt-2); font-weight: 650; }
.land-simple .land-product-hero .land-h1 { margin: 1rem 0 0; max-width: 15ch; font-size: clamp(2.1rem, 4.6vw, 3.75rem); color: var(--txt-1); letter-spacing: -.045em; line-height: 1.06; text-wrap: balance; }
.land-simple .land-product-hero .land-sub { margin: 1.25rem 0 0; max-width: 36ch; color: var(--txt-2); line-height: 1.55; }
.land-simple .land-product-hero .land-cta { align-items: flex-start; justify-content: flex-start; }
.land-simple .land-product-hero .land-btn { min-height: 56px; }
.land-simple .land-product-hero .land-fine { margin: .85rem 0 0; color: var(--txt-2); font-size: 13px; max-width: 39ch; }
.land-simple .land-product-hero :is(a, button):focus-visible { outline-color: var(--txt-1); }
.land-simple .land-product-art { min-width: 0; margin: 0; position: relative; }
.land-simple .land-product-art img { display: block; width: 100%; height: auto; object-fit: contain; }
.land-simple .land-product-art .land-product-light { display: none; }
html[data-theme="light"] .land-simple .land-product-art .land-product-light { display: block; }
html[data-theme="light"] .land-simple .land-product-art .land-product-dark { display: none; }
.land-simple .land-product-art figcaption { padding-top: .25rem; text-align: center; color: var(--txt-2); font-size: 12px; line-height: 1.5; }
@media (max-width: 767px) {
.land-simple .land-product-hero { grid-template-columns: minmax(0, 1fr); padding: .65rem 1rem 1.5rem; border-radius: 24px; }
}
@media (max-width: 767px) {
.land-simple .land-product-hero .land-simple-nav { margin-bottom: 1.1rem; gap: .75rem; }
}
@media (max-width: 767px) {
.land-simple .land-product-copy { padding-bottom: .5rem; }
}
@media (max-width: 767px) {
.land-simple .land-product-hero .land-h1 { font-size: clamp(2rem, 8.5vw, 3rem); max-width: 19ch; margin-top: .8rem; }
}
@media (max-width: 767px) {
.land-simple .land-product-hero .land-sub { margin-top: 1rem; font-size: 16px; }
}
@media (max-width: 767px) {
.land-simple .land-product-hero .land-cta { margin-top: 1.1rem; }
}
@media (max-width: 767px) {
.land-simple .land-product-hero .land-btn { width: 100%; min-height: 56px; }
}
@media (max-width: 767px) {
.land-simple .land-product-art { margin: .75rem -1rem 0; }
}
@media (max-width: 767px) {
.land-simple .land-product-art figcaption { padding-inline: 1rem; }
}

/* ══ views4.js (library/technique) — lib-gap lib-gap-s lib-gaps lib-hot lib-more tech-card sw-bar-empty ══ */

/* source: style.css (main ec722de) · used by views4.js */
.tech-card {
  position: relative; overflow: hidden;
  transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}
.tech-card::before {
  content:''; position:absolute; inset:0 auto 0 0; width:3px;
  background: var(--accent, #C62B24); opacity:.75;
}
.tech-card:hover { transform: translateY(-3px); border-color: rgba(255,255,255,.16); box-shadow: 0 16px 44px -18px rgba(0,0,0,.8); }

/* source: theme-v2.css (main ec722de) · used by views4.js */
.tech-card::before {
  background: var(--accent-fill);
}
.lib-hot,
.lib-gap { border-radius: var(--r-inner); background: var(--card); border: 1px solid var(--line); transition: border-color var(--dur-2) var(--ease), background var(--dur-2) var(--ease); }
.lib-hot:hover,
.lib-gap:hover { border-color: var(--line-2); }
.lib-hot:active,
.lib-gap:active { background: var(--raised); }
.lib-gaps { border-color: var(--line); }
.lib-gaps h2 ~ button { min-height: 44px; }
.lib-gap-s { color: var(--txt-2); }
.tech-card { border-radius: var(--r-card); }
.tech-card .chip { min-height: 26px; }
.lib-gaps i { color: var(--txt-2); }
.lib-more { min-height: 44px; width: 100%; justify-content: flex-start; padding: 0 var(--s2); margin-top: var(--s2); font-size: 12px; font-weight: 700; color: var(--txt-3); }
.tech-card .btn.lib-more { width: 100%; justify-content: flex-start; padding: 0 var(--s2); margin-top: var(--s2); }
.lib-more:hover { color: var(--txt-2); }
.lib-more i { font-size: 10px; margin-left: var(--s1); }
.sw-bar-empty { background: var(--raised); }

/* ══ views5.js (daily objectives) — obj-ico obj-main obj-row obj-s obj-t obj-xp ══ */

/* source: theme-v2.css (main ec722de) · used by views5.js */
.obj-row { display: flex; align-items: center; gap: var(--s3); width: 100%; min-width: 0; box-sizing: border-box; min-height: 60px; padding: var(--s3) var(--s4); text-align: left; background: var(--card); border: 1px solid var(--line); border-radius: var(--r-inner); transition: background var(--dur-2) var(--ease), border-color var(--dur-2) var(--ease); }
.obj-row:not(:disabled):hover { border-color: var(--line-2); }
.obj-row:not(:disabled):active { background: var(--raised); }
.obj-row.is-done { background: var(--raised); border-color: var(--line); cursor: default; }
.obj-ico { width: 36px; height: 36px; flex: none; display: grid; place-items: center; border-radius: var(--r-inner); background: var(--raised); color: var(--txt-2); }
.obj-row.is-done .obj-ico { background: var(--good-weak); color: var(--txt-1); }
.obj-ico i { font-size: var(--ico-row); }
.obj-main { min-width: 0; flex: 1; display: flex; flex-direction: column; gap: 2px; }
.obj-t { font-size: 14.5px; font-weight: 700; color: var(--txt-1); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.obj-row.is-done .obj-t { color: var(--txt-1); }
.obj-s { font-size: 12.5px; color: var(--txt-3); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.obj-xp { flex: none; font-size: 12px; font-weight: 800; color: var(--txt-2); background: var(--raised); border-color: var(--line); min-height: 28px; padding: 0 10px; }
.obj-row.is-done .obj-xp { background: var(--good-weak); border-color: transparent; color: var(--txt-1); }
html[data-theme="light"] .obj-row.is-done .obj-ico,
html[data-theme="light"] .obj-row.is-done .obj-xp { background: var(--good-weak); color: var(--txt-1); }
html[data-theme="light"] .obj-row.is-done .obj-t { color: var(--txt-1); }
main.pg-main-rank-hero-f587 .obj-ico,
main.pg-main-rank-hero-f587 .obj-ico i { color: var(--txt-2); }
main.pg-main-rank-hero-f587 .obj-ico { background: var(--raised); }

/* ══ views6.js (staff) — kpi-strip kpi-v pend-acts pend-id pend-meta pend-row ret-bar ret-card ret-count ret-go ret-handle ret-insight ret-intro ret-meta ret-out role-chip rollcall-cta roster-row staff-head-meta staff-head-plan ══ */

/* source: style.css (main ec722de) · used by views6.js */
.rollcall-cta {
  width: 100%; display: flex; align-items: center; gap: .85rem;
  padding: .95rem 1rem; border-radius: 22px; text-align: left;
  background: linear-gradient(150deg, rgba(255,107,99,.10), rgba(255,107,99,.03));
  border: 1px solid rgba(255,107,99,.22);
  transition: transform .14s ease, border-color .2s ease;
}
.rollcall-cta:active { transform: scale(.99); }

/* source: theme-v2.css (main ec722de) · used by views6.js */
.rollcall-cta { background: var(--card); border: 1px solid var(--line); box-shadow: var(--lift-1); }
@media (hover: hover) {
.rollcall-cta:hover { border-color: var(--line-2); background: var(--raised); }
}
.kpi-strip { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .5rem; }
.kpi-strip .panel { padding: .8rem .6rem; }
.kpi-strip .panel i { font-size: .8rem; }
.kpi-strip .kpi-v { font-size: 1.25rem; font-weight: 850; letter-spacing: -.03em; margin-top: .3rem; }
.kpi-strip .section-label { font-size: .58rem; margin-top: .15rem; }
@media (min-width: 640px) {
.kpi-strip { gap: .75rem; }
}
@media (min-width: 640px) {
.kpi-strip .panel { padding: 1.25rem; }
}
@media (min-width: 640px) {
.kpi-strip .kpi-v { font-size: 1.5rem; }
}
@media (min-width: 640px) {
.kpi-strip .section-label { font-size: .62rem; }
}
.roster-row { padding: .95rem 1rem; }
.staff-head-meta { display: flex; flex-direction: column; align-items: flex-end; gap: .1rem; }
.staff-head-plan {
  margin-top: .25rem;
  font-size: .68rem; font-weight: 700; letter-spacing: -.005em;
  color: var(--txt-3); white-space: nowrap;
}
.kpi-strip { gap: .75rem; }
.kpi-strip .panel { padding: 1rem .75rem; }
.kpi-strip .kpi-v { margin-top: .5rem; }
.kpi-strip .panel i { color: var(--txt-2); }
.kpi-strip .panel i { color: var(--txt-2); }
.pend-row { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: .65rem .75rem; align-items: center; }
.pend-row .pend-id { min-width: 0; }
.pend-row .pend-meta { display: flex; align-items: center; gap: .5rem; margin-top: .25rem; flex-wrap: wrap; }
.pend-row .pend-acts { grid-column: 1 / -1; display: flex; justify-content: flex-end; align-items: center; gap: .5rem; }
.pend-row .pend-acts .btn-good { padding: 0 1.05rem; }
.pend-row .pend-acts .btn-ghost { width: 44px; padding: 0; }
@media (min-width: 640px) {
.pend-row { grid-template-columns: auto minmax(0, 1fr) auto; }
}
@media (min-width: 640px) {
.pend-row .pend-acts { grid-column: auto; }
}
.kpi-v {
  font-size: var(--t-figure); font-weight: 800; letter-spacing: -.03em; line-height: 1;
  font-variant-numeric: tabular-nums; color: var(--txt-1);
}
.role-chip { background: var(--raised); color: var(--txt-1); border: 1px solid var(--line-2); }
.role-chip i { color: var(--txt-2); }
.kpi-strip { gap: var(--s2); }
.kpi-strip .panel { padding: var(--s3) var(--s3); border-radius: var(--r-inner); }
.kpi-strip .panel i { color: var(--txt-3); font-size: var(--ico-row); }
.kpi-v { font-size: 24px; font-weight: 800; letter-spacing: -.03em; line-height: 1; margin-top: var(--s2); }
.kpi-strip .section-label { font-size: 10.5px; letter-spacing: .08em; margin-top: var(--s1); margin-bottom: 0; }
.rollcall-cta { border-radius: var(--r-card); padding: var(--s4); min-height: 72px; background: var(--card); border: 1px solid var(--line); }
.rollcall-cta .rc-ico { width: 44px; height: 44px; border-radius: var(--r-inner); background: var(--raised); color: var(--txt-1); border: 1px solid var(--line-2); }
.rollcall-cta .rc-ico i { font-size: var(--ico-row); }
.rollcall-cta .font-black { font-size: var(--t-card); font-weight: 700; }
.ret-card { border-radius: var(--r-card); }
.ret-handle { color: var(--txt-3); }
.ret-meta { color: var(--txt-3); }
.ret-bar { height: 6px; border-radius: var(--r-ctl); background: var(--sunken); overflow: hidden; border: 1px solid var(--line); }
.ret-bar > div { height: 100%; border-radius: var(--r-ctl); }
.ret-insight { padding: var(--s3) var(--s4); border-radius: var(--r-inner); background: var(--raised); border: 1px solid var(--line); font-size: 14px; color: var(--txt-2); }
.ret-go { width: 44px; min-width: 44px; padding: 0; }
.ret-out { border-top: 1px solid var(--line); }
.ret-count { background: var(--raised); border: 1px solid var(--line-2); color: var(--txt-1); }
.ret-intro { color: var(--txt-2); line-height: 1.5; }
.ret-intro b { color: var(--txt-1); font-weight: 700; }

/* ══ views11.js (paywall/tiers) — pw-bill-k pw-bill-v pw-card-top pw-excl pw-legal pw-tick tiers-cap tiers-caps tiers-fair-p ok-mark ══ */

/* source: style.css (main ec722de) · used by views11.js */
.pw-card-top { display: flex; align-items: flex-start; justify-content: space-between; gap: .8rem; }
.pw-bill-k { display: flex; align-items: center; gap: .4rem; flex-wrap: wrap; font-size: .72rem; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; color: var(--txt-3); }
.pw-bill-tile.on .pw-bill-k { color: var(--txt-2); }
.pw-bill-v { display: inline-flex; align-items: baseline; gap: .15rem; }
.pw-bill-v b { font-size: 1.35rem; font-weight: 900; letter-spacing: -.03em; line-height: 1; font-variant-numeric: tabular-nums; }
.pw-bill-v small { font-size: .72rem; font-weight: 700; color: var(--txt-3); }
.pw-tick {
  display: inline-block; vertical-align: middle; margin-left: .35rem;
  font-style: normal; font-size: .58rem; font-weight: 900; letter-spacing: .06em; text-transform: uppercase;
  padding: .18em .5em; border-radius: 999px; background: var(--accent-fill); color: var(--accent-on);
}
.pw-excl { margin-top: .75rem; }
.pw-legal { display: flex; justify-content: center; align-items: center; gap: .25rem; font-size: .72rem; color: var(--txt-3); margin-top: -.15rem; }
.pw-legal a { display: inline-flex; align-items: center; min-height: 44px; padding: 0 .6rem; color: var(--txt-3); text-decoration: underline; text-underline-offset: 2px; }

/* source: theme-v2.css (main ec722de) · used by views11.js */
.ok-mark {
  display: inline-block; margin-left: .28rem;
  font-weight: 900; font-size: .92em; vertical-align: baseline;
}
.tiers-fair-p { margin: .5rem 0 0; font-size: .82rem; line-height: 1.5; color: var(--txt-2); }
.tiers-caps { margin: .9rem 0 0; display: grid; grid-template-columns: 1fr 1fr; gap: .45rem .9rem; }
.tiers-cap { display: flex; justify-content: space-between; align-items: baseline; gap: .5rem; font-size: .78rem; min-width: 0; }
.tiers-cap dt { color: var(--txt-3); min-width: 0; }
.tiers-cap dd { margin: 0; font-weight: 750; color: var(--txt-1); flex: none; }
@media (max-width: 380px) {
.tiers-caps { grid-template-columns: 1fr; }
}
html .sheet .pw-legal { flex-wrap: wrap; }

/* ══ views13.js — nudge-act ══ */

/* source: theme-v2.css (main ec722de) · used by views13.js */

/* source: ds5.css (main ec722de) · used by views13.js */
.nudge-act { margin-top: .5rem; min-height: 44px; font-size: .8rem; font-weight: 750; padding: 0 .9rem; }
.nudge-act small { font-weight: 600; color: var(--txt-3); }

/* ══ other — ob-local-lost (views.js onboarding) · pr-belt-l pr-swatch (views6.js promote sheet) ══ */

/* source: style.css (main ec722de) · used by views6.js (pr-belt-l, pr-swatch) */
.pr-belt-l { font-size: .62rem; font-weight: 800; letter-spacing: .01em; }
.pr-swatch {
  width: 100%; height: 7px; border-radius: 99px; display: block;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.12);
}

/* source: auth-ds16.css (main ec722de) · used by views.js (ob-local-lost) */
.ob-core .ob-local-lost { padding: 14px 16px; border-left: 2px solid var(--accent-ink); background: var(--raised); color: var(--txt-2); font-size: 14px; line-height: 1.5; margin: 16px 0; overflow-wrap: anywhere; }

/* ══ onboarding gutter — /onboarding funnel (views.js .ob.ob-core) ══
 * main 62fbe1e: ios26-controls c8f0944 (QA 4829470, TL 4831920 point 4; Final Tech Lead 4843147 item 2). The funnel
 * goes full-bleed and carries the page gutter itself, so content sits at x=16 at 375/390. Declarations copied
 * unchanged; selectors raised past the mirror's html body #app main.page-rise / html body #app .ob.ob-core, because
 * this sheet is linked before ds.css. */

/* source: theme-v2.css (main 62fbe1e) · #app > main:has(> .ob) */
html body #app > main.page-rise.pg-main-ob-2bfe { padding: 0; max-width: none; }

/* source: auth-ds16.css (main 62fbe1e, c8f0944) · .ob.ob-core */
html body #app main .ob.ob-core {
  box-sizing: border-box;
  padding-left: max(var(--gutter, 16px), env(safe-area-inset-left));
  padding-right: max(var(--gutter, 16px), env(safe-area-inset-right));
}

/* ══ override, not copied: mirror ds.src.css rule vs main's views7/views3 markup; remove when task #12 ports views7/views3 ══
 * Approved by Final Tech Lead 4832587 (rules 1-2) and 4845148 (rule 3). Exactly 3 rules (run-tests legacy-views asserts it).
 * 1. /gym hero: the mirror's `main h1 { 34px !important }` lands on views7's `h1.text-xl.truncate`, so the academy
 *    name is cut at 390 ("Demo Aca…"). Main showed it at 20px.
 * 2. /progress-techniques + /meta: the mirror's `.progress-detail { max-width: 720px }` is for its one-column page;
 *    main's views3 still draws a two-column grid inside it, so technique names lose ~120px per column at 1440. */
html body #app main .gym-hero h1:not(.sr-only):not(.hx-cls) { font-size: 20px !important; line-height: 1.2 !important; } /* same :not() pair so it outranks the mirror rule it corrects */
html body #app .progress-detail:has(> .grid.md\:grid-cols-2) { max-width: 1040px; }
html[data-theme="light"] body #app .home-day .home-day-dot.is-on:not(#_r1) { background: var(--accent-fill) !important; color: var(--accent-on, #0A0A0C) !important; } /* 3. R1 (Final QA 4845018, TL 4845148; round-1 items 6/18/27): the mirror paints a done day olive #3F6212 in light; day dots are lime or grey, as in dark */