/*
 * Account look (docs/SNEAKY-ACCOUNT-LOOK.md): the Your Space bar on every member account page, Your Space's tabs and
 * Settings, and the account rows. Scoped to body.sh-acct (account-look/account-look.php). Local --ya-* tokens mirror the
 * design contract §1 with --sh-* fallbacks; no --sh-* is defined here, no @font-face ("Sneaky Display" is declared by
 * the footer), no global selector. Motion: transitions only, none under prefers-reduced-motion.
 * WooCommerce's account pages and Sneaky Credits: account-wc.css.
 */

/* ---------- tokens ---------- */
body.sh-acct {
	--ya-ink: var(--sh-ink, #122c3a); --ya-copy: #375568; --ya-muted: #587183;
	--ya-line: #c7ddeb; --ya-line-soft: #e1ecf2;
	--ya-teal: #246b5f; --ya-teal-deep: #173d39; --ya-sky: #6ec4e8; --ya-sky-soft: #edf8fc; --ya-sky-deep: #1d6f97;
	--ya-learn-ink: #8a5a06; --ya-learn-wash: #fbf1e1; --ya-assess-wash: #e7f2ef;
	--ya-grad: linear-gradient(90deg, #3fb39d, #6ec4e8 40%, #4ea6ec 70%, #ec6a98);
	--ya-display: "Sneaky Display", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
	--ya-text: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif;
	--ya-shadow: 0 30px 60px -44px rgba(18, 44, 58, .5);
	--ya-ease: cubic-bezier(.2, .7, .2, 1);
	--ya-wrap: min(1240px, 100% - 2 * clamp(16px, 4vw, 48px));
}

/* ---------- the Your Space bar: Your Space, three groups and My Journey (bar.php, account.js) ---------- */
body.sh-acct .ya-nav {
	--ya-nav-h: 64px;
	position: relative; z-index: 40; background: rgba(255, 255, 255, .97); border-bottom: 1px solid var(--ya-line-soft);
	box-shadow: 0 18px 32px -32px rgba(18, 44, 58, .55); font-family: var(--ya-text); color: var(--ya-ink);
}
body.sh-acct .ya-nav-in { position: relative; width: min(1360px, 100% - 2 * clamp(16px, 4vw, 48px)); margin-inline: auto; }
body.sh-acct .ya-nav :where(ul) { margin: 0; padding: 0; list-style: none; }
body.sh-acct .ya-nav :where(li) { margin: 0; padding: 0; }
body.sh-acct .ya-nav-menu { display: flex; align-items: stretch; gap: 2px; min-height: var(--ya-nav-h); }
body.sh-acct .ya-nav-top { position: relative; display: flex; align-items: center; }
body.sh-acct .ya-nav-top--space { margin-inline-end: 8px; padding-inline-end: 12px; }
body.sh-acct .ya-nav-top--space::before { content: ""; position: absolute; right: 0; top: 16px; bottom: 16px; width: 1px; background: var(--ya-line-soft); }
body.sh-acct .ya-nav-top--end { margin-inline-start: auto; }
/* the page's group: the Sneaky Line under it */
body.sh-acct .ya-nav-top.is-current::after { content: ""; position: absolute; left: 12px; right: 12px; bottom: 0; height: 4px; border-radius: 4px 4px 0 0; background: var(--ya-grad); }
body.sh-acct .ya-nav-top--space.is-current::after { left: 6px; right: 18px; }

/* Your Space: whose space this is */
body.sh-acct .ya-nav-home, body.sh-acct .ya-nav-home:is(:hover, :focus, :active, :visited) {
	display: inline-flex; align-items: center; gap: 10px; min-height: 48px; padding: 4px 14px 4px 4px; border-radius: 999px;
	background: transparent; color: var(--ya-ink); text-decoration: none;
}
body.sh-acct .ya-nav-home:hover { background: var(--ya-sky-soft); }
body.sh-acct .ya-nav-home-node {
	display: grid; place-items: center; flex: none; width: 36px; height: 36px; box-sizing: border-box; border-radius: 50%;
	border: 2px solid transparent; background: linear-gradient(#fff, #fff) padding-box, var(--ya-grad) border-box; color: var(--ya-teal);
}
body.sh-acct .ya-nav-home-node .ya-i { width: 18px; height: 18px; }
body.sh-acct .ya-nav-home[aria-current="page"] .ya-nav-home-node { background: linear-gradient(var(--ya-ink), var(--ya-ink)) padding-box, var(--ya-grad) border-box; color: #fff; }
body.sh-acct .ya-nav-home-text { display: grid; gap: 1px; }
body.sh-acct .ya-nav-home-label { font: 800 16px/1.15 var(--ya-display); letter-spacing: -.01em; white-space: nowrap; }
body.sh-acct .ya-nav-home-note { display: inline-flex; align-items: center; gap: 4px; font: 600 12px/1.2 var(--ya-text); color: var(--ya-muted); white-space: nowrap; }
body.sh-acct .ya-nav-home-note .ya-i { width: 12px; height: 12px; color: var(--ya-teal); }

/* a group's button */
body.sh-acct .ya-nav-trigger, body.sh-acct .ya-nav-trigger:is(:hover, :focus, :active) {
	display: inline-flex; align-items: center; gap: 8px; min-height: 44px; margin: 0; padding: 0 12px 0 14px;
	border: 0; border-radius: 999px; background: transparent; box-shadow: none; color: var(--ya-copy);
	font: 700 15px/1.1 var(--ya-text); letter-spacing: 0; text-transform: none; white-space: nowrap; cursor: pointer;
}
body.sh-acct .ya-nav-trigger:hover, body.sh-acct .ya-nav-trigger[aria-expanded="true"], body.sh-acct .ya-nav-trigger[aria-expanded="true"]:is(:hover, :focus, :active) { background: var(--ya-sky-soft); color: var(--ya-ink); }
body.sh-acct .ya-nav-top.is-current .ya-nav-trigger { color: var(--ya-ink); font-weight: 800; }
body.sh-acct .ya-nav-trigger-i { width: 18px; height: 18px; color: var(--ya-sky-deep); }
body.sh-acct .ya-nav-top.is-current .ya-nav-trigger-i { color: var(--ya-teal); }
body.sh-acct .ya-nav-trigger-cur { display: inline-flex; align-items: center; gap: 7px; font-weight: 650; color: var(--ya-teal); }
body.sh-acct .ya-nav-trigger-sep { color: var(--ya-muted); font-weight: 700; }
body.sh-acct .ya-nav-chev { width: 14px; height: 14px; color: var(--ya-muted); transform: rotate(90deg); }
body.sh-acct .ya-nav-trigger[aria-expanded="true"] .ya-nav-chev { transform: rotate(-90deg); }

/* My Journey: one way back (bar.php), styled like a group button, without a popover */
body.sh-acct .ya-nav-direct, body.sh-acct .ya-nav-direct:is(:hover, :focus, :active, :visited) {
	display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 0 14px; border-radius: 999px; background: transparent;
	color: var(--ya-copy); font: 700 15px/1.1 var(--ya-text); text-decoration: none; white-space: nowrap;
}
body.sh-acct .ya-nav-direct:hover { background: var(--ya-sky-soft); color: var(--ya-ink); }
body.sh-acct .ya-nav-top.is-current .ya-nav-direct { color: var(--ya-ink); font-weight: 800; }
body.sh-acct .ya-nav-top.is-current .ya-nav-direct .ya-nav-trigger-i { color: var(--ya-teal); }
/* a group's popover */
body.sh-acct .ya-nav-pop {
	position: absolute; top: calc(100% - 6px); left: 0; z-index: 2; box-sizing: border-box; width: max-content; min-width: 320px; max-width: min(380px, calc(100vw - 32px));
	padding: 12px; border: 1px solid var(--ya-line-soft); border-radius: 22px; background: #fff;
	box-shadow: 0 30px 60px -30px rgba(18, 44, 58, .5), 0 2px 8px rgba(18, 44, 58, .06);
	visibility: hidden; opacity: 0; transform: translateY(-4px);
}
body.sh-acct .ya-nav-top--end .ya-nav-pop { left: auto; right: 0; }
body.sh-acct .ya-nav-top.is-open > .ya-nav-pop,
body.sh-acct .ya-nav:not(.ya-nav--js) .ya-nav-top:is(:hover, :focus-within) > .ya-nav-pop { visibility: visible; opacity: 1; transform: none; }
body.sh-acct .ya-nav-pop-head, body.sh-acct .ya-nav-sub-head { margin: 4px 10px 8px; font: 800 12px/1.2 var(--ya-text); letter-spacing: .14em; text-transform: uppercase; color: var(--ya-sky-deep); }
body.sh-acct .ya-nav-sub-head { margin: 10px 10px 4px; padding-top: 12px; border-top: 1px solid var(--ya-line-soft); color: var(--ya-muted); }
body.sh-acct .ya-nav-list { display: grid; gap: 2px; }
body.sh-acct .ya-nav-list--minor { margin-top: 8px; padding-top: 8px; border-top: 1px solid var(--ya-line-soft); }

/* a destination */
body.sh-acct .ya-nav-link, body.sh-acct .ya-nav-link:is(:hover, :focus, :active, :visited) {
	display: grid; grid-template-columns: 40px minmax(0, 1fr) auto; align-items: center; gap: 12px; min-height: 58px; box-sizing: border-box;
	padding: 8px 12px 8px 8px; border-radius: 16px; background: transparent; color: var(--ya-ink); text-decoration: none;
}
body.sh-acct .ya-nav-link:hover { background: #f3f9fc; }
body.sh-acct .ya-nav-link[aria-current="page"] { background: var(--ya-assess-wash); }
body.sh-acct .ya-nav-node { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 50%; background: var(--ya-tone-wash, var(--ya-sky-soft)); color: var(--ya-tone-ink, var(--ya-sky-deep)); }
body.sh-acct .ya-nav-node .ya-i { width: 20px; height: 20px; }
body.sh-acct .ya-nav-link-body { display: grid; gap: 2px; min-width: 0; }
body.sh-acct .ya-nav-link-label { font: 700 15.5px/1.2 var(--ya-text); color: var(--ya-ink); }
body.sh-acct .ya-nav-link-desc { font: 500 13.5px/1.35 var(--ya-text); color: var(--ya-muted); }
body.sh-acct .ya-nav-link[aria-current="page"] .ya-nav-link-label { color: var(--ya-teal-deep); font-weight: 800; }
body.sh-acct .ya-nav-here { padding: 4px 9px; border-radius: 999px; background: #fff; color: var(--ya-teal); font: 750 11.5px/1 var(--ya-text); white-space: nowrap; }
body.sh-acct .ya-nav-link--minor, body.sh-acct .ya-nav-link--minor:is(:hover, :focus, :active, :visited) { grid-template-columns: 32px minmax(0, 1fr) auto; min-height: 46px; padding-block: 6px; }
body.sh-acct .ya-nav-link--minor .ya-nav-node { width: 32px; height: 32px; }
body.sh-acct .ya-nav-link--minor .ya-nav-node .ya-i { width: 17px; height: 17px; }
body.sh-acct .ya-nav-link--minor .ya-nav-link-label { font-size: 14.5px; font-weight: 650; }
body.sh-acct .ya-nav-link--minor .ya-nav-link-desc { font-size: 12.5px; }
/* tones: the brand's pillar washes */
body.sh-acct .ya-tone--sky { --ya-tone-wash: #edf8fc; --ya-tone-ink: #1d6f97; }
body.sh-acct .ya-tone--teal { --ya-tone-wash: #e7f2ef; --ya-tone-ink: #246b5f; }
body.sh-acct .ya-tone--rose { --ya-tone-wash: #fdecf2; --ya-tone-ink: #c2255c; }
body.sh-acct .ya-tone--leaf { --ya-tone-wash: #eaf5e7; --ya-tone-ink: #3b7a2c; }
body.sh-acct .ya-tone--plum { --ya-tone-wash: #f8eaf1; --ya-tone-ink: #7b244b; }
body.sh-acct .ya-tone--gold { --ya-tone-wash: #fbf1e1; --ya-tone-ink: #8a5a06; }
body.sh-acct .ya-tone--slate { --ya-tone-wash: #eef3f6; --ya-tone-ink: #4a6272; }
body.sh-acct .ya-tone--night { --ya-tone-wash: #e5edf3; --ya-tone-ink: #122c3a; }
body.sh-acct .ya-nav-link[aria-current="page"] .ya-nav-node { background: #fff; }

/* the phones' one button (account.js shows it) */
body.sh-acct .ya-nav-toggle { display: none; }

@media (min-width: 768px) and (max-width: 1023px) {
	body.sh-acct .ya-nav .ya-nav-home-note, body.sh-acct .ya-nav .ya-nav-trigger-i { display: none; }
	body.sh-acct .ya-nav-top--space { margin-inline-end: 4px; padding-inline-end: 8px; }
	body.sh-acct .ya-nav-trigger, body.sh-acct .ya-nav-trigger:is(:hover, :focus, :active) { gap: 6px; padding: 0 10px 0 12px; font-size: 14.5px; }
}
@media (min-width: 768px) and (max-width: 899px) {
	/* the group is still marked (the Sneaky Line) and its popover names the page */
	body.sh-acct .ya-nav .ya-nav-trigger-cur { display: none; }
}
@media (max-width: 767px) {
	body.sh-acct .ya-nav { --ya-nav-h: 60px; }
	body.sh-acct .ya-nav--js .ya-nav-toggle, body.sh-acct .ya-nav--js .ya-nav-toggle:is(:hover, :focus, :active) {
		display: flex; align-items: center; gap: 12px; width: 100%; min-height: var(--ya-nav-h); margin: 0; padding: 6px 0;
		border: 0; border-radius: 0; background: transparent; box-shadow: none; color: var(--ya-ink); text-align: left; text-transform: none; letter-spacing: 0; cursor: pointer;
	}
	body.sh-acct .ya-nav-toggle-text { display: grid; gap: 2px; min-width: 0; }
	body.sh-acct .ya-nav-toggle-kicker { font: 800 11.5px/1.2 var(--ya-text); letter-spacing: .14em; text-transform: uppercase; color: var(--ya-sky-deep); }
	body.sh-acct .ya-nav-toggle-where { overflow: hidden; font: 750 16px/1.25 var(--ya-text); color: var(--ya-ink); white-space: nowrap; text-overflow: ellipsis; }
	body.sh-acct .ya-nav-toggle-act { display: inline-flex; align-items: center; gap: 6px; margin-inline-start: auto; min-height: 40px; padding: 0 14px; box-sizing: border-box; border: 1.5px solid var(--ya-line); border-radius: 999px; font: 700 14px/1 var(--ya-text); color: var(--ya-ink); }
	body.sh-acct .ya-nav-toggle[aria-expanded="true"] .ya-nav-toggle-act { border-color: var(--ya-ink); background: var(--ya-ink); color: #fff; }
	body.sh-acct .ya-nav-toggle[aria-expanded="true"] .ya-nav-chev { color: #fff; transform: rotate(-90deg); }
	/* the whole list, in place: Your Space, then each group under its own heading */
	body.sh-acct .ya-nav-menu { display: block; min-height: 0; padding: 6px 0 16px; }
	body.sh-acct .ya-nav--js:not(.is-open) .ya-nav-menu { display: none; }
	body.sh-acct .ya-nav--js.is-open .ya-nav-menu { border-top: 1px solid var(--ya-line-soft); }
	body.sh-acct .ya-nav-top { display: block; margin: 0; padding: 0; }
	body.sh-acct .ya-nav-top::before, body.sh-acct .ya-nav-top.is-current::after, body.sh-acct .ya-nav-trigger { display: none; }
	body.sh-acct .ya-nav-home, body.sh-acct .ya-nav-home:is(:hover, :focus, :active, :visited) { display: flex; width: 100%; min-height: 56px; margin-top: 6px; padding: 6px 12px 6px 6px; box-sizing: border-box; border-radius: 16px; }
	body.sh-acct .ya-nav-home[aria-current="page"] { background: var(--ya-assess-wash); }
	body.sh-acct .ya-nav-pop { position: static; width: auto; min-width: 0; max-width: none; padding: 0; border: 0; border-radius: 0; background: none; box-shadow: none; visibility: visible; opacity: 1; transform: none; }
	body.sh-acct .ya-nav-pop-head { margin: 16px 6px 6px; }
	body.sh-acct .ya-nav-sub-head { margin: 8px 6px 4px; padding-top: 10px; }
	body.sh-acct .ya-nav-link, body.sh-acct .ya-nav-link:is(:hover, :focus, :active, :visited) { min-height: 52px; padding: 6px 10px 6px 6px; }
	body.sh-acct .ya-nav-top--direct { margin-top: 10px; padding-top: 10px; border-top: 1px solid var(--ya-line-soft); }
	body.sh-acct .ya-nav-direct, body.sh-acct .ya-nav-direct:is(:hover, :focus, :active, :visited) { display: flex; width: 100%; min-height: 52px; padding: 6px 12px; box-sizing: border-box; border-radius: 16px; }
	body.sh-acct .ya-nav-top--direct.is-current .ya-nav-direct { background: var(--ya-assess-wash); }
}
@media (min-width: 480px) and (max-width: 767px) {
	body.sh-acct .ya-nav-list { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 8px; }
}

/* the shared member masthead's crumb (brand/foundation.php prints no separator; Favorites prints its own "›") */
body.sh-acct .sl-member-mast .sl-crumbs li + li::before { content: "\203A"; margin-inline-end: 10px; color: var(--ya-muted); font-weight: 650; }

/* ---------- focus: the ink ring on light surfaces (contract §10, HK-084) ---------- */
body.sh-acct :is(.ya-nav, .ya-tabs, .ya-account, .ya-panel, .ys-glance) :focus-visible { outline: 2px solid #122c3a !important; outline-offset: 3px !important; box-shadow: 0 0 0 5px #fff !important; }
body.sh-acct :is(.ya-nav-link, .ya-nav-toggle):focus-visible { outline-offset: -2px !important; }

/* ---------- shared pieces ---------- */
body.sh-acct .ya-kicker { margin: 0; font: 800 13px/1.2 var(--ya-text); letter-spacing: .14em; text-transform: uppercase; color: var(--ya-sky-deep); }
body.sh-acct .ya-h2 { margin: 0; font: 800 clamp(1.45rem, 1.1rem + 1vw, 1.95rem)/1.1 var(--ya-display); letter-spacing: -.025em; color: var(--ya-ink); text-wrap: balance; }
body.sh-acct .ya-note { margin: 0; font: 500 15.5px/1.55 var(--ya-text); color: var(--ya-copy); }
body.sh-acct .ya-note strong { color: var(--ya-ink); font-weight: 700; overflow-wrap: anywhere; }
body.sh-acct .ya-i { display: inline-block; flex: none; width: 20px; height: 20px; vertical-align: middle; }
body.sh-acct .ya-btn, body.sh-acct .ya-btn:is(:hover, :focus, :active, :visited) {
	display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 50px; padding: 0 22px;
	border: 1.5px solid var(--ya-line); border-radius: 999px; background: #fff; color: var(--ya-ink);
	font: 700 16px/1.15 var(--ya-text); text-decoration: none; white-space: nowrap; cursor: pointer;
}
body.sh-acct .ya-btn:hover { border-color: var(--ya-teal); }
body.sh-acct .ya-btn .ya-i { color: var(--ya-teal); }

/* the account rows (Your Space Settings, WooCommerce overview) */
body.sh-acct .ya-rows { display: grid; gap: 10px; margin: 0; padding: 0; list-style: none; }
body.sh-acct .ya-rows > li { margin: 0; padding: 0; min-width: 0; }
body.sh-acct .ya-row, body.sh-acct .ya-row:is(:hover, :focus, :active, :visited) {
	display: grid; grid-template-columns: 46px minmax(0, 1fr) 20px; gap: 14px; align-items: center; min-height: 76px; height: 100%; box-sizing: border-box;
	padding: 12px 16px 12px 12px; border: 1px solid var(--ya-line-soft); border-radius: 20px; background: #fff;
	color: var(--ya-ink); text-decoration: none;
}
body.sh-acct .ya-row:hover { border-color: var(--ya-line); background: #f7fcfe; box-shadow: 0 18px 34px -30px rgba(18, 44, 58, .6); }
body.sh-acct .ya-row-node { display: grid; place-items: center; width: 46px; height: 46px; border-radius: 50%; background: var(--ya-sky-soft); color: var(--ya-sky-deep); }
body.sh-acct .ya-row-node .ya-i { width: 22px; height: 22px; }
body.sh-acct .ya-row--credits .ya-row-node { background: var(--ya-learn-wash); color: var(--ya-learn-ink); }
body.sh-acct :is(.ya-row--profile, .ya-row--privacy) .ya-row-node { background: var(--ya-assess-wash); color: var(--ya-teal); }
body.sh-acct .ya-row-body { display: grid; gap: 3px; min-width: 0; }
body.sh-acct .ya-row-title { font: 700 17px/1.25 var(--ya-display); letter-spacing: -.01em; color: var(--ya-ink); }
body.sh-acct .ya-row-fact { font: 500 14px/1.4 var(--ya-text); color: var(--ya-muted); overflow-wrap: anywhere; }
body.sh-acct .ya-row-go { width: 18px; height: 18px; color: var(--ya-sky-deep); }
@media (min-width: 760px) {
	body.sh-acct .ya-rows { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* ---------- Your Space: tabs (sections of this page: Overview, Saved, Checks and reports, Settings) ---------- */
body.sh-acct--space .ya-tabs { max-width: 1180px; margin: 0 auto clamp(16px, 2vw, 24px); scroll-margin-top: 96px; }
body.sh-acct--space .ya-tabs-in { display: flex; gap: 4px; padding: 5px; border: 1px solid var(--ya-line-soft); border-radius: 22px; background: #fff; box-shadow: var(--ya-shadow); }
body.sh-acct--space .ya-tab, body.sh-acct--space .ya-tab:is(:hover, :focus, :active) {
	flex: 1 1 0; display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 48px; margin: 0; padding: 0 16px;
	border: 0; border-radius: 18px; background: transparent; color: var(--ya-copy);
	font: 700 16px/1.1 var(--ya-text); text-transform: none; letter-spacing: 0; white-space: nowrap; cursor: pointer; box-shadow: none;
}
body.sh-acct--space .ya-tab:hover { background: var(--ya-sky-soft); color: var(--ya-ink); }
body.sh-acct--space .ya-tab[aria-selected="true"], body.sh-acct--space .ya-tab[aria-selected="true"]:is(:hover, :focus, :active) { background: var(--ya-ink); color: #fff; }
body.sh-acct--space .ya-tab-i { width: 20px; height: 20px; color: var(--ya-sky-deep); }
body.sh-acct--space .ya-tab[aria-selected="true"] .ya-tab-i { color: #8fd3ef; }
body.sh-acct--space .ya-tab-count { display: inline-grid; place-items: center; min-width: 26px; height: 24px; padding: 0 7px; box-sizing: border-box; border-radius: 999px; background: var(--ya-sky-soft); color: var(--ya-ink); font: 800 13px/1 var(--ya-text); font-variant-numeric: tabular-nums; }
body.sh-acct--space .ya-tab[aria-selected="true"] .ya-tab-count { background: rgba(255, 255, 255, .16); color: #fff; }
body.sh-acct--space .ya-panel { display: grid; gap: clamp(18px, 2.4vw, 28px); min-width: 0; }
body.sh-acct--space .ya-panel[hidden] { display: none !important; }
body.sh-acct--space .ya-panel:focus { outline: none; }
@media (max-width: 767px) {
	body.sh-acct--space .ya-tabs { margin-inline: 0; }
	/* all four tabs in view on a phone: two by two, never a row that hides Settings off screen */
	body.sh-acct--space .ya-tabs-in { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); border-radius: 20px; overflow: visible; }
	body.sh-acct--space .ya-tab, body.sh-acct--space .ya-tab:is(:hover, :focus, :active) { min-width: 0; min-height: 48px; padding: 0 10px; gap: 8px; font-size: 15px; white-space: normal; text-align: left; line-height: 1.15; border-radius: 15px; }
}

/* Overview is the at-a-glance cards; "Checks and reports" opens with "My Current State" as its heading, not a card */
body.sh-acct--space.ya-tabs-on .ya-panel--overview > .ys-glance { margin: 0; }
body.sh-acct--space.ya-tabs-on .ya-panel--checks > .rhp-header { padding: 4px 4px 0; border: 0; background: none; box-shadow: none; }
body.sh-acct--space.ya-tabs-on .ya-panel--checks > .rhp-header p { max-width: 70ch; }

/* ---------- Your Space: Settings ---------- */
body.sh-acct--space.ya-tabs-on .rhp-profile-section { margin: 0; }
body.sh-acct--space .rhp-profile-more.ya-static { padding: 0; border: 0; background: none; box-shadow: none; }
body.sh-acct--space .rhp-profile-more.ya-static > summary { display: grid; gap: 8px; padding: 4px 4px 0; list-style: none; cursor: default; pointer-events: none; background: none; }
body.sh-acct--space .rhp-profile-more.ya-static > summary::-webkit-details-marker { display: none; }
body.sh-acct--space .rhp-profile-more.ya-static > summary::marker { content: ""; }
body.sh-acct--space .rhp-profile-more.ya-static > summary .rhp-profile-edit { display: none; }
body.sh-acct--space .rhp-profile-more.ya-static > summary .rhp-profile-line { font: 800 clamp(1.45rem, 1.1rem + 1vw, 1.95rem)/1.15 var(--ya-display); letter-spacing: -.025em; color: var(--ya-ink); }
body.sh-acct--space .rhp-profile-more.ya-static > .rhp-card-note { margin: 10px 4px 18px; font-size: 15.5px; color: var(--ya-copy); }

/* the two settings forms (Profile info, My Settings): the brand's form language; fields, names and saves unchanged */
body.sh-acct--space .ya-panel--settings .rhp-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: clamp(18px, 2.4vw, 24px); margin: 0; }
body.sh-acct--space .ya-panel--settings :is(.rhp-global-profile-card, .rhp-settings-card) { margin: 0; padding: 0; border: 0; background: none; box-shadow: none; }
body.sh-acct--space .ya-panel--settings :is(.rghp-card, .rhp-settings-card) { padding: clamp(20px, 3vw, 32px); border: 1px solid var(--ya-line-soft); border-radius: 26px; background: #fff; box-shadow: var(--ya-shadow); }
body.sh-acct--space .ya-panel--settings .rghp-card { margin: 0; }
body.sh-acct--space .ya-panel--settings :is(.rghp-header, .rhp-card-header) { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 6px 16px; margin: 0 0 20px; padding: 0; border: 0; }
body.sh-acct--space .ya-panel--settings :is(.rghp-header h2, .rhp-card-header h2) { margin: 0; font: 800 clamp(1.3rem, 1.05rem + .8vw, 1.6rem)/1.15 var(--ya-display); letter-spacing: -.02em; color: var(--ya-ink); }
body.sh-acct--space .ya-panel--settings .rghp-header p { margin: 6px 0 0; font: 500 15px/1.5 var(--ya-text); color: var(--ya-copy); }
body.sh-acct--space .ya-panel--settings :is(.rghp-field, .rhp-field) > span:first-child { display: block; margin: 0 0 7px; font: 700 14.5px/1.3 var(--ya-text); letter-spacing: 0; text-transform: none; color: var(--ya-ink); }
body.sh-acct--space .ya-panel--settings :is(.rghp-field, .rhp-field) :is(input:not([type="range"]):not([type="checkbox"]):not([type="radio"]), select, textarea) {
	box-sizing: border-box; width: 100%; min-height: 48px; margin: 0; padding: 10px 14px;
	border: 1.5px solid var(--ya-line); border-radius: 14px; background: #fff; color: var(--ya-ink);
	font: 500 16px/1.4 var(--ya-text); box-shadow: none;
}
body.sh-acct--space .ya-panel--settings :is(.rghp-field, .rhp-field) textarea { min-height: 96px; resize: vertical; }
body.sh-acct--space .ya-panel--settings :is(.rghp-field, .rhp-field) :is(input, select, textarea):hover { border-color: #9fc6db; }
body.sh-acct--space .ya-panel--settings :is(.rghp-field, .rhp-field) :is(input, select, textarea):focus { border-color: var(--ya-teal); outline: none; box-shadow: 0 0 0 4px rgba(36, 107, 95, .14); }
body.sh-acct--space .ya-panel--settings .rghp-field input[type="range"] { width: 100%; accent-color: var(--ya-teal); }
body.sh-acct--space .ya-panel--settings .rghp-gender-labels small { font: 650 13px/1.2 var(--ya-text); color: var(--ya-muted); }
body.sh-acct--space .ya-panel--settings .rghp-unit-field { display: grid; grid-template-columns: minmax(0, 1fr) minmax(76px, auto); gap: 8px; }
body.sh-acct--space .ya-panel--settings .rghp-grid { display: grid; grid-template-columns: minmax(0, 1fr); align-items: start; gap: 22px 28px; }
body.sh-acct--space .ya-panel--settings .rghp-gender-labels { display: flex; justify-content: space-between; margin: 4px 0 6px; }
body.sh-acct--space .ya-panel--settings .sh-dob { display: grid; grid-template-columns: minmax(64px, .7fr) minmax(110px, 1.4fr) minmax(84px, .9fr); gap: 10px; }
body.sh-acct--space .ya-panel--settings .sh-dob-part { display: grid; gap: 5px; min-width: 0; margin: 0; }
body.sh-acct--space .ya-panel--settings .sh-dob-part > label { margin: 0; font: 650 13px/1.2 var(--ya-text); color: var(--ya-muted); }
body.sh-acct--space .ya-panel--settings .sh-dob-msg { margin: 8px 0 0; font: 600 14px/1.4 var(--ya-text); color: var(--ya-muted); }
@media (min-width: 760px) {
	body.sh-acct--space .ya-panel--settings .rghp-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
body.sh-acct--space .ya-panel--settings .rhp-settings-form { display: grid; grid-template-columns: minmax(0, 1fr); gap: 18px 20px; }
body.sh-acct--space .ya-panel--settings .rhp-settings-form > * { margin: 0; min-width: 0; }
body.sh-acct--space .ya-panel--settings .rhp-field-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 18px 20px; margin: 0; }
@media (min-width: 760px) {
	body.sh-acct--space .ya-panel--settings .rhp-settings-form { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	body.sh-acct--space .ya-panel--settings .rhp-settings-form > :is(.rhp-field-grid, .rhp-actions) { grid-column: 1 / -1; }
	body.sh-acct--space .ya-panel--settings .rhp-field-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
body.sh-acct--space .ya-panel--settings :is(.rghp-actions, .rhp-actions) { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 16px; margin: 22px 0 0; }
body.sh-acct--space .ya-panel--settings .rhp-settings-form > .rhp-actions { margin-top: 4px; }
body.sh-acct--space .ya-panel--settings :is(.rghp-button-primary, .rhp-button-primary), body.sh-acct--space .ya-panel--settings :is(.rghp-button-primary, .rhp-button-primary):is(:hover, :focus, :active) {
	display: inline-flex; align-items: center; justify-content: center; min-height: 50px; padding: 0 26px;
	border: 0; border-radius: 999px; background: var(--ya-teal); color: #fff; font: 700 16px/1.15 var(--ya-text);
	text-transform: none; letter-spacing: 0; white-space: nowrap; cursor: pointer;
	box-shadow: 0 14px 28px -16px rgba(36, 107, 95, .9), inset 0 1px 0 rgba(255, 255, 255, .18);
}
body.sh-acct--space .ya-panel--settings :is(.rghp-button-primary, .rhp-button-primary):hover { background: var(--ya-teal-deep); }
body.sh-acct--space .ya-panel--settings :is(.rghp-message, .rhp-message) { font: 650 14.5px/1.4 var(--ya-text); color: var(--ya-teal); }
@media (max-width: 479px) {
	body.sh-acct--space .ya-panel--settings :is(.rghp-actions, .rhp-actions) > :is(.rghp-button-primary, .rhp-button-primary) { width: 100%; }
}

/* the "Your account" card */
body.sh-acct .ya-account { display: grid; gap: 20px; padding: clamp(20px, 3vw, 32px); border: 1px solid var(--ya-line-soft); border-radius: 26px; background: linear-gradient(180deg, #fbfdfe 0%, #f1f8fc 100%); box-shadow: var(--ya-shadow); }
body.sh-acct .ya-account-head { display: grid; gap: 10px; }
body.sh-acct .ya-account-foot { display: flex; flex-wrap: wrap; gap: 12px; }

/* ---------- motion ---------- */
@media (prefers-reduced-motion: no-preference) {
	body.sh-acct :is(.ya-nav-home, .ya-nav-trigger, .ya-nav-link) { transition: background-color .18s var(--ya-ease), color .18s var(--ya-ease); }
	body.sh-acct .ya-nav-chev { transition: transform .2s var(--ya-ease); }
	/* a popover settles in; it leaves at once (visibility waits for the fade) */
	body.sh-acct .ya-nav-pop { transition: opacity .16s var(--ya-ease), transform .2s var(--ya-ease), visibility 0s linear .16s; }
	body.sh-acct .ya-nav-top.is-open > .ya-nav-pop, body.sh-acct .ya-nav:not(.ya-nav--js) .ya-nav-top:is(:hover, :focus-within) > .ya-nav-pop { transition: opacity .16s var(--ya-ease), transform .2s var(--ya-ease), visibility 0s; }
	body.sh-acct .ya-row { transition: background-color .2s var(--ya-ease), border-color .2s var(--ya-ease), box-shadow .2s var(--ya-ease), transform .2s var(--ya-ease); }
	body.sh-acct .ya-row:hover { transform: translateY(-2px); }
	body.sh-acct .ya-row:hover .ya-row-go { transform: translateX(2px); }
	body.sh-acct .ya-row-go { transition: transform .2s var(--ya-ease); }
	body.sh-acct--space .ya-tab { transition: background-color .18s var(--ya-ease), color .18s var(--ya-ease); }
	body.sh-acct .ya-btn { transition: border-color .18s var(--ya-ease), transform .18s var(--ya-ease); }
	body.sh-acct .ya-btn:hover { transform: translateY(-2px); }
}
@media print {
	body.sh-acct .ya-nav, body.sh-acct--space .ya-tabs { display: none; }
	body.sh-acct--space .ya-panel[hidden] { display: grid !important; }
}

/* ---------- one compact member header on every signed-in account page (owner brief 18 Oct 2026) ----------
   The Your Space bar already says "signed in, private, this section, the way home"; the page header under it only
   names the page, says what it is for and holds the page's own actions. Each page keeps its own markup, colours and
   actions (Train's track, Eat's cream, Support's rose): only the size comes down, and decorative stages step aside. */
body.sh-acct.sh-acct-has-bar:is(.sh-acct--workouts, .sh-acct--plans, .sh-acct--favorites, .sh-acct--wc) .sl-mast .sl-mast-inner { grid-template-columns: minmax(0, 1fr); padding-block: clamp(18px, 2.4vw, 28px) clamp(24px, 3vw, 36px); }
body.sh-acct.sh-acct-has-bar:is(.sh-acct--workouts, .sh-acct--plans, .sh-acct--favorites, .sh-acct--wc) .sl-mast .sl-mast-copy { gap: 10px; max-width: 780px; }
body.sh-acct.sh-acct-has-bar:is(.sh-acct--workouts, .sh-acct--plans, .sh-acct--favorites, .sh-acct--wc, .sh-acct--trainers) .sl-mast .sl-h1 { font-size: clamp(1.85rem, 1.25rem + 1.6vw, 2.5rem); line-height: 1.06; }
body.sh-acct.sh-acct-has-bar:is(.sh-acct--workouts, .sh-acct--plans, .sh-acct--favorites, .sh-acct--wc, .sh-acct--trainers) .sl-mast .sl-lead { font-size: 16px; line-height: 1.55; }
body.sh-acct.sh-acct-has-bar:is(.sh-acct--workouts, .sh-acct--plans, .sh-acct--favorites, .sh-acct--wc) .sl-mast .sl-mast-stage { display: none; }
body.sh-acct.sh-acct-has-bar:is(.sh-acct--workouts, .sh-acct--plans, .sh-acct--favorites, .sh-acct--wc) .sl-mast .sl-actions { margin-top: 2px; }
/* My Trainers: Connections' own masthead */
body.sh-acct.sh-acct-has-bar.sh-acct--trainers .scx-mast .scx-mast-inner { gap: 10px; padding-block: clamp(18px, 2.4vw, 28px) clamp(22px, 2.8vw, 32px); }
/* Family & friends: the classic Connections hero */
body.sh-acct.sh-acct-has-bar.sh-acct--connections .rcon-hero { padding: clamp(18px, 2.6vw, 28px) clamp(18px, 3vw, 32px); }
body.sh-acct.sh-acct-has-bar.sh-acct--connections .rcon-hero h1 { font-size: clamp(1.85rem, 1.25rem + 1.6vw, 2.5rem); line-height: 1.06; }
/* Support conversations: Support's rose header, smaller */
body.sh-acct.sh-acct-has-bar.sh-acct--conversations .sh-sc .sh-sc-wrap:not(.sh-sc-v-hub) .sh-detail-hero { padding: clamp(18px, 2.6vw, 28px) clamp(18px, 3vw, 34px); border-radius: 24px; }
body.sh-acct.sh-acct-has-bar.sh-acct--conversations .sh-sc .sh-sc-wrap:not(.sh-sc-v-hub) .sh-detail-hero h1 { font-size: clamp(1.85rem, 1.25rem + 1.6vw, 2.5rem); line-height: 1.06; }

/* ---------- Settings, finale (owner brief 18 Oct 2026): calmer summary, one optional note per form, feedback beside Save ---------- */
body.sh-acct--space .rhp-profile-more.ya-static > summary .rhp-profile-line { font-size: clamp(1.15rem, 1rem + .5vw, 1.4rem); line-height: 1.3; }
body.sh-acct--space .ya-panel--settings .ya-form-note { grid-column: 1 / -1; margin: 0 0 6px; padding: 10px 14px; border-radius: 12px; background: var(--ya-sky-soft); font: 600 14.5px/1.45 var(--ya-text); color: var(--ya-copy); }
body.sh-acct--space .ya-panel--settings :is(.rghp-message, .rhp-message):not(:empty) { display: inline-flex; align-items: center; min-height: 36px; padding: 6px 14px; border-radius: 999px; background: var(--ya-assess-wash); }
