/* اسپلش تم — جزئیات بیشتر در index.html (critical inline) */
.app-splash {
  position: fixed;
  inset: 0;
  z-index: 99999;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #000;
}

html[data-theme="light"] .app-splash {
  background: #fff;
}

.app-splash-img {
  width: min(100vw, 100dvh, 28rem);
  height: min(100vw, 100dvh, 28rem);
  max-width: 28rem;
  max-height: 100dvh;
  object-fit: contain;
  object-position: center;
  -webkit-mask-image: radial-gradient(
    circle at center,
    #000 0 72%,
    rgba(0, 0, 0, 0.92) 82%,
    rgba(0, 0, 0, 0.58) 91%,
    transparent 100%
  );
  mask-image: radial-gradient(
    circle at center,
    #000 0 72%,
    rgba(0, 0, 0, 0.92) 82%,
    rgba(0, 0, 0, 0.58) 91%,
    transparent 100%
  );
}

html:not([data-theme="light"]) .app-splash-img--light {
  display: none;
}

html[data-theme="light"] .app-splash-img--dark {
  display: none;
}

.app-splash.is-hidden {
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.32s ease;
}

.app-splash.is-gone {
  display: none;
}

/** نوار حالت آفلاین — قرمز ملایم + آیکن سیگنال قطع */
.app-offline-banner {
  flex-shrink: 0;
  padding: 0.45rem 0.75rem;
  display: flex;
  justify-content: center;
  align-items: center;
  background: rgba(220, 38, 38, 0.14);
  border-bottom: 1px solid rgba(220, 38, 38, 0.42);
  color: var(--text);
}

.app-offline-banner-inner {
  display: inline-flex;
  align-items: flex-start;
  gap: 0.55rem;
  max-width: 100%;
  text-align: right;
}

.app-offline-banner-ico {
  flex-shrink: 0;
  margin-top: 0.12rem;
  color: #dc2626;
  line-height: 0;
}

.app-offline-banner-text {
  font-size: 0.76rem;
  font-weight: 600;
  line-height: 1.5;
  letter-spacing: 0.01em;
}

.app-offline-banner.hidden {
  display: none !important;
}

html[data-theme="light"] .app-offline-banner {
  background: rgba(220, 38, 38, 0.1);
  border-bottom-color: rgba(185, 28, 28, 0.38);
}

html[data-theme="light"] .app-offline-banner-ico {
  color: #b91c1c;
}

/* Vazirmatn — فایل‌ها در ریپو: fonts/vazirmatn/ و سرو از /app/fonts/ (بدون CDN) */
@font-face {
  font-family: "Vazirmatn";
  font-style: normal;
  font-weight: 400;
  font-display: block;
  src: url("/app/fonts/vazirmatn-400.ttf") format("truetype");
}

@font-face {
  font-family: "Vazirmatn";
  font-style: normal;
  font-weight: 500;
  font-display: block;
  src: url("/app/fonts/vazirmatn-500.ttf") format("truetype");
}

@font-face {
  font-family: "Vazirmatn";
  font-style: normal;
  font-weight: 600;
  font-display: block;
  src: url("/app/fonts/vazirmatn-600.ttf") format("truetype");
}

@font-face {
  font-family: "Vazirmatn";
  font-style: normal;
  font-weight: 700;
  font-display: block;
  src: url("/app/fonts/vazirmatn-700.ttf") format("truetype");
}

:root {
  --bg: #0d0c11;
  --bg-deep: #08070b;
  --surface-1: rgba(22, 21, 29, 0.92);
  --surface-2: rgba(28, 27, 36, 0.78);
  --surface-glass: rgba(19, 18, 26, 0.74);
  --line-soft: rgba(163, 160, 173, 0.16);
  --line-strong: rgb(var(--accent-rgb) / 0.28);
  --card: rgba(22, 21, 29, 0.9);
  --text: #f7f6f4;
  --muted: #a8a5b2;
  --accent: #f97316;
  --accent-rgb: 249 115 22;
  --accent-strong: #ea580c;
  --accent-strong-rgb: 234 88 12;
  --accent-2: #facc15;
  --accent-3: #ef4444;
  --accent-warm: #f97316;
  --accent-hover: #fb923c;
  --accent-hover-rgb: 251 146 60;
  --accent-soft: #fdba74;
  --accent-soft-rgb: 253 186 116;
  --accent-contrast: #ffedd5;
  --ok: #f59e0b;
  --err: #fb7185;
  --radius: 0.5rem;
  --font: "Vazirmatn", system-ui, "Segoe UI", Tahoma, sans-serif;
  --font-size-xs: 0.75rem;
  --font-size-sm: 0.875rem;
  --font-size-md: 1rem;
  --font-size-lg: 1.25rem;
  --font-size-xl: 1.75rem;
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-6: 1.5rem;
  --space-8: 2rem;
  --control-height: 2.75rem;
  --control-height-lg: 3rem;
  --app-shell-max: 26rem;
  --app-shell-pad: 1rem;
  --app-viewport-height: 100dvh;
  --app-keyboard-inset: 0px;
  --bottom-nav-height: 3.5rem;
  --search-bar-height: 3.15rem;
  --layer-bottom-navigation: 10042;
  --layer-modal: 12100;
  /* کارت‌ها و جستجو — با تم روشن بازتعریف می‌شوند */
  --ex-card-bg: linear-gradient(145deg, rgba(26, 25, 34, 0.95), rgba(15, 14, 20, 0.98));
  --ex-card-border: rgb(var(--accent-rgb) / 0.2);
  --ex-card-hover-bd: rgb(var(--accent-rgb) / 0.5);
  --ex-card-shadow: rgba(0, 0, 0, 0.35);
  --ex-media-bg: #0f0e14;
  --ex-ph-a: #16151d;
  --ex-ph-b: #211f2a;
  --ex-ph-fg: #6f6c7c;
  --ex-meta: #b9b6c4;
  --tag-bg: rgb(var(--accent-rgb) / 0.14);
  --tag-fg: var(--accent-contrast);
  --tag-bd: rgb(var(--accent-rgb) / 0.28);
  --tag-acc-bg: rgb(var(--accent-rgb) / 0.13);
  --tag-acc-bd: rgb(var(--accent-rgb) / 0.3);
  --tag-acc-fg: var(--accent-contrast);
  --filter-wrap-bg: rgba(0, 0, 0, 0.2);
  --filter-wrap-bd: #2c2a36;
  --filt-chip-bg: #100f16;
  --filt-chip-bd: #2c2a36;
  --filt-chip-on-bg: rgb(var(--accent-rgb) / 0.22);
  --filt-chip-on-fg: #f2f0f7;
  --detail-meta: #b9b6c4;
  --detail-body: #dedbe6;
  --step-bd-bg: linear-gradient(135deg, rgb(var(--accent-rgb) / 0.9), rgb(var(--accent-rgb) / 0.86));
  --step-bd-fg: #f2f0f7;
  --step-txt: #e5e2ec;
  --detail-code-bg: rgba(0, 0, 0, 0.25);
  --plan-row-bg: rgba(0, 0, 0, 0.12);
  --plan-row-bd: #2c2a36;
  --plan-pick-bg: rgba(0, 0, 0, 0.1);
  --search-status-ok: #c9c6d4;
  --sheet-toggle-bg: linear-gradient(180deg, rgba(32, 31, 41, 0.96) 0%, rgba(19, 18, 26, 0.98) 100%);
  --sheet-toggle-bd: #332f3e;
  --sheet-panel-bg: rgba(19, 18, 26, 0.99);
  --sheet-panel-bd: #332f3e;
  --sheet-inner-top: rgb(var(--accent-rgb) / 0.16);
  --sheet-shadow: rgba(0, 0, 0, 0.35);
  --sheet-toggle-shadow: rgba(0, 0, 0, 0.35);
  --ex-fav-bg: rgba(15, 14, 20, 0.82);
  --ex-fav-bd: rgba(255, 255, 255, 0.12);
  --ex-fav-shadow: rgba(0, 0, 0, 0.35);
  --modal-x-bg: rgba(255, 255, 255, 0.06);
  --hero-radial: rgb(var(--accent-rgb) / 0.14);
  --modal-head-bd: rgba(44, 42, 54, 0.6);
  /* آیکن‌ها: <img> از assets؛ SVG با currentColor */
  --app-ui-icon-img-filter: brightness(0) invert(1);
  --app-icon-mono: #f7f6f4;
  --app-icon-mono-soft: rgba(248, 250, 252, 0.78);
  --theme-toggle-light-ico: var(--accent-soft);
  --theme-toggle-dark-ico: #7c2d12;
  color-scheme: dark;
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

/* اسکرول بدون نوار — لمس، ماوس و چرخ */
html,
body,
* {
  scrollbar-width: none;
  -ms-overflow-style: none;
}

*::-webkit-scrollbar {
  display: none;
  width: 0;
  height: 0;
}

html,
body {
  margin: 0;
  height: var(--app-viewport-height);
  overflow: hidden;
  font-family: var(--font);
  background: var(--bg);
  color: var(--text);
  line-height: 1.65;
  letter-spacing: 0;
  -webkit-font-smoothing: antialiased;
  -webkit-tap-highlight-color: transparent;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  user-select: none;
}

input,
textarea,
select,
[contenteditable],
[role="textbox"] {
  -webkit-touch-callout: default;
  -webkit-user-select: text;
  user-select: text;
}

img,
svg {
  -webkit-user-drag: none;
  user-drag: none;
}

button,
a,
summary,
[role="button"],
input,
textarea,
select {
  touch-action: manipulation;
}

:where(button, summary, [role="button"], input, select, textarea, .app-select-trigger) {
  min-height: 2.75rem;
}

:where(button, summary, [role="button"], .app-select-trigger) {
  min-width: 2.75rem;
}

:where(button, a, summary, input, select, textarea, [role="button"], .app-select-trigger):focus-visible {
  outline: 3px solid color-mix(in srgb, var(--accent) 72%, #ffffff);
  outline-offset: 3px;
  box-shadow: 0 0 0 5px color-mix(in srgb, var(--accent) 20%, transparent);
}

.page:focus {
  outline: none;
}

.page:focus-visible {
  outline: none;
}

@media (prefers-reduced-motion: no-preference) and (hover: hover) and (pointer: fine) {
  button:not(:disabled),
  a,
  summary,
  .ex-card,
  .portal-grid-tile-action,
  .plan-summary-card,
  .workout-tile-card,
  .coach-student-row,
  .filter-chip,
  .app-nav-btn {
    transition-timing-function: cubic-bezier(0.2, 0.8, 0.2, 1);
  }

  button:not(:disabled):active,
  a:active,
  summary:active,
  .ex-card:active,
  .portal-grid-tile-action:active,
  .plan-summary-card:active,
  .workout-tile-card:active,
  .coach-student-row:active,
  .filter-chip:active,
  .app-nav-btn:active {
    transform: translateY(1px) scale(0.985);
    filter: brightness(0.98);
  }
}

body::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background:
    linear-gradient(90deg, rgba(255, 255, 255, 0.026) 1px, transparent 1px),
    linear-gradient(180deg, rgba(255, 255, 255, 0.018) 1px, transparent 1px);
  background-size: 28px 28px;
  mask-image: linear-gradient(180deg, rgba(0, 0, 0, 0.68), transparent 72%);
}

.skip-link {
  position: fixed;
  inset-block-start: max(0.6rem, env(safe-area-inset-top));
  inset-inline-start: 50%;
  z-index: 10080;
  width: max-content;
  max-width: calc(100vw - 2rem);
  padding: 0.62rem 0.85rem;
  border: 1px solid rgb(var(--accent-rgb) / 0.42);
  border-radius: 0.55rem;
  background: var(--surface);
  color: var(--text);
  font-size: 0.86rem;
  font-weight: 800;
  text-decoration: none;
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.34);
  transform: translate(-50%, calc(-100% - 1rem));
  transition: transform 0.16s ease;
}

.skip-link:focus,
.skip-link:focus-visible {
  transform: translate(-50%, 0);
}

#app-root {
  display: flex;
  flex-direction: column;
  height: var(--app-viewport-height);
  max-height: var(--app-viewport-height);
  min-height: 0;
  overflow: hidden;
  width: 100%;
  max-width: var(--app-shell-max);
  margin: 0 auto;
  padding-inline: var(--app-shell-pad);
  padding-top: max(0.45rem, env(safe-area-inset-top));
  padding-bottom: 0;
}

.app-brand {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  flex-shrink: 0;
  margin: 0 calc(var(--app-shell-pad) * -0.2) 0.2rem;
  padding: 0.44rem 0.48rem 0.62rem;
  border-bottom: 1px solid rgba(163, 160, 173, 0.12);
  border-radius: 0 0 1.05rem 1.05rem;
  background: linear-gradient(180deg, rgba(10, 9, 14, 0.96), rgba(10, 9, 14, 0.78));
  backdrop-filter: blur(16px);
  z-index: 40;
}

.app-brand-cluster {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 0.75rem;
  min-width: 0;
  flex: 1;
}

.app-main-scroll {
  flex: 1;
  min-height: 0;
  overflow-y: auto;
  overflow-x: hidden;
  overscroll-behavior-y: contain;
  -webkit-overflow-scrolling: touch;
  padding-bottom: 1.25rem;
}

body.keyboard-open .app-main-scroll {
  overflow-y: auto;
  scroll-padding-bottom: calc(1.25rem + var(--app-keyboard-inset));
}

body.app-shell.has-bottom-nav .app-main-scroll {
  padding-bottom: calc(var(--bottom-nav-height) + max(18px, env(safe-area-inset-bottom)) + 1.1rem);
}

body.app-shell.has-bottom-nav.has-search-sheet .app-main-scroll {
  padding-bottom: calc(
    var(--bottom-nav-height) + var(--search-bar-height) + max(18px, env(safe-area-inset-bottom)) + 1.1rem
  );
}

body.app-shell.has-bottom-nav.has-search-sheet.search-filter-floating:not(.search-filter-expanded) .app-main-scroll {
  padding-bottom: calc(var(--bottom-nav-height) + max(18px, env(safe-area-inset-bottom)) + 1.1rem);
}

body.app-shell.has-bottom-nav .app-main-scroll:has(#page-support-ticket:not(.hidden)) {
  overflow: hidden;
  padding-bottom: calc(var(--bottom-nav-height) + max(10px, env(safe-area-inset-bottom)) + 0.35rem);
}

.app-brand-logo {
  flex-shrink: 0;
  width: 2.875rem;
  height: 2.875rem;
  border-radius: 0.85rem;
  display: block;
  overflow: hidden;
  box-shadow:
    0 10px 26px rgb(var(--accent-rgb) / 0.26),
    0 0 0 1px rgba(255, 255, 255, 0.08) inset;
}

.theme-logo-img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.theme-logo-img--light,
html[data-theme="light"] .theme-logo-img--dark {
  display: none;
}

html[data-theme="light"] .theme-logo-img--light {
  display: block;
}

.app-brand-text {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.06rem;
  min-width: 0;
}

.app-brand-home-link {
  color: inherit;
  text-decoration: none;
  border-radius: 0.65rem;
  cursor: pointer;
}

.app-brand-home-link:focus-visible {
  outline: 2px solid rgb(var(--accent-rgb) / 0.72);
  outline-offset: 3px;
}

.app-brand-name-fa {
  font-size: 1.22rem;
  font-weight: 800;
  letter-spacing: 0;
  color: var(--text);
  line-height: 1.2;
}

.app-brand-name-en {
  font-size: 0.71rem;
  font-weight: 600;
  letter-spacing: 0.13em;
  text-transform: uppercase;
  color: var(--accent-2);
  opacity: 0.93;
}

.app-brand-trailing {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 0.35rem;
  flex-shrink: 0;
}

.app-theme-toggle {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.5rem;
  height: 2.5rem;
  margin: 0;
  padding: 0;
  border: 1px solid rgb(var(--accent-soft-rgb) / 0.32);
  border-radius: 0.85rem;
  background: linear-gradient(135deg, rgb(var(--accent-rgb) / 0.18), rgb(var(--accent-hover-rgb) / 0.1));
  color: var(--theme-toggle-light-ico);
  cursor: pointer;
  transition:
    background 0.16s ease,
    border-color 0.16s ease,
    color 0.16s ease;
}

.app-theme-toggle:hover,
.app-theme-toggle:focus-visible {
  border-color: rgb(var(--accent-rgb) / 0.45);
  background: linear-gradient(135deg, rgb(var(--accent-rgb) / 0.24), rgb(var(--accent-rgb) / 0.18));
}

.app-theme-toggle:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}

.app-theme-toggle-ico {
  display: none;
}

.app-theme-toggle-ico--sun {
  display: block;
  color: var(--theme-toggle-light-ico);
}

html[data-theme="light"] .app-theme-toggle-ico--sun {
  display: none;
}

html[data-theme="light"] .app-theme-toggle-ico--moon {
  display: block;
  color: var(--theme-toggle-dark-ico);
}

.page.hidden {
  display: none !important;
}

.page {
  animation: fadeIn 0.22s ease-out;
}

@keyframes fadeIn {
  from {
    opacity: 0;
    transform: translateY(4px);
  }
  to {
    opacity: 1;
    transform: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
  }

  .page {
    animation: none !important;
  }
}

.page-head {
  margin: 0 0 0.6rem;
  padding: 0.5rem 0 0;
}

.page-head h1 {
  margin: 0;
  font-size: 1.06rem;
  font-weight: 700;
  letter-spacing: 0;
  line-height: 1.4;
  color: var(--text);
  overflow-wrap: anywhere;
  word-break: break-word;
  white-space: normal;
}

.lead {
  margin: 0;
  color: var(--muted);
  font-size: 0.92rem;
  font-weight: 400;
}

.page-head .lead {
  margin: 0;
  max-width: 38rem;
  font-size: 0.89rem;
  line-height: 1.55;
  color: var(--muted);
}

.page-head .lead code {
  font-size: 0.92em;
  padding: 0.06em 0.28em;
  border-radius: 0.28rem;
  background: rgb(var(--accent-rgb) / 0.1);
}

html[data-theme="light"] .page-head .lead code {
  background: rgb(var(--accent-rgb) / 0.09);
}

.page-head-heading-row {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.45rem;
}

.page-head-heading-row h1 {
  margin: 0;
  flex: 1;
  min-width: 0;
}

.page-head-context {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  margin: 0.32rem 0 0;
  max-width: 38rem;
  font-size: 0.88rem;
  line-height: 1.5;
  color: var(--muted);
}

#plan-session-headline {
  max-width: none;
  width: 100%;
}

.page-head-context:empty {
  display: none;
}

.page-head-context code {
  font-size: 0.92em;
  padding: 0.06em 0.28em;
  border-radius: 0.28rem;
  background: rgb(var(--accent-rgb) / 0.1);
}

html[data-theme="light"] .page-head-context code {
  background: rgb(var(--accent-rgb) / 0.09);
}

.app-confirm-modal {
  position: fixed;
  inset: 0;
  z-index: 10060;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: max(1rem, env(safe-area-inset-top)) 1rem max(1rem, env(safe-area-inset-bottom));
}

.app-confirm-modal.hidden {
  display: none !important;
}

.app-confirm-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(7, 6, 10, 0.66);
  backdrop-filter: blur(8px);
}

.app-confirm-panel {
  position: relative;
  width: min(100%, 22rem);
  padding: 1rem;
  display: grid;
  gap: 0.72rem;
  border: 1px solid var(--control-line);
  border-radius: var(--radius);
  background: var(--surface);
  box-shadow: 0 1rem 2.5rem rgba(0, 0, 0, 0.28);
}

.app-confirm-icon {
  width: 2.65rem;
  height: 2.65rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: var(--radius);
  color: var(--accent-soft);
  background: rgb(var(--accent-rgb) / 0.14);
}

.app-confirm-title,
.app-confirm-body {
  margin: 0;
}

.app-confirm-title {
  color: var(--text);
  font-size: 1rem;
  line-height: 1.55;
}

.app-confirm-body {
  color: var(--muted);
  font-size: 0.88rem;
  line-height: 1.9;
}

.app-confirm-actions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.55rem;
  margin-top: 0.25rem;
}

.app-confirm-actions button {
  margin: 0;
  min-height: 2.75rem;
  border-radius: var(--radius);
}

button.app-confirm-ok.danger-button {
  color: #16151d;
  background: var(--accent);
  box-shadow: none;
}

html[data-theme="light"] .app-confirm-backdrop {
  background: rgba(17, 19, 24, 0.32);
}

html[data-theme="light"] .app-confirm-panel {
  border-color: var(--control-line);
  background: var(--surface);
  box-shadow: 0 1rem 2.5rem rgba(17, 19, 24, 0.14);
}

html[data-theme="light"] .app-confirm-icon {
  color: #9a3412;
  background: rgb(var(--accent-rgb) / 0.13);
}

.btn-back {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  width: auto;
  padding: 0.45rem 0.85rem;
  margin: 0 0 0.75rem;
  background: transparent;
  color: var(--accent);
  border: 1px solid #2c2a36;
  border-radius: 999px;
  font-family: inherit;
  font-size: 0.9rem;
  font-weight: 500;
  cursor: pointer;
}

.btn-back:hover {
  border-color: var(--accent);
  color: var(--accent-hover);
}

.card {
  background: var(--card);
  border-radius: var(--radius);
  padding: 1rem;
  margin-bottom: 1rem;
  border: 1px solid var(--line-soft);
  box-shadow: 0 0.35rem 1rem rgba(0, 0, 0, 0.08);
}

label {
  display: block;
  margin: 0.65rem 0 0.3rem;
  color: var(--muted);
  font-size: 0.82rem;
  font-weight: 500;
}

input,
select,
textarea,
button {
  width: 100%;
  padding: 0.65rem 0.85rem;
  border-radius: 0.55rem;
  border: 1px solid rgba(163, 160, 173, 0.18);
  background: rgba(10, 9, 14, 0.66);
  color: var(--text);
  font-size: 1rem;
  font-family: inherit;
}

textarea {
  resize: vertical;
  min-height: 5rem;
}

button {
  background: var(--accent);
  border: none;
  color: #fff;
  font-weight: 600;
  margin-top: 0.85rem;
  cursor: pointer;
  box-shadow: none;
}

button:hover {
  filter: brightness(1.06);
}

button:disabled {
  opacity: 0.45;
  cursor: not-allowed;
  filter: none;
}

button.secondary,
button.wide.secondary {
  background: rgba(255, 255, 255, 0.035);
  color: var(--accent-2);
  border: 1px solid rgb(var(--accent-rgb) / 0.32);
  box-shadow: none;
}

button.secondary:hover {
  border-color: var(--accent-2);
}

.tabs {
  display: flex;
  gap: 0.5rem;
}

.tabs button {
  flex: 1;
  margin: 0;
}

.nav-cards {
  display: flex;
  flex-direction: column;
  gap: 0.65rem;
}

.nav-tile {
  margin: 0;
  text-align: center;
  padding: 1rem;
  font-size: 1.05rem;
}

.muted {
  color: var(--muted);
}

.small {
  font-size: 0.85rem;
}

.msg {
  font-size: 0.9rem;
  margin-top: 0.55rem;
  min-height: 1.25em;
}

.msg:not(.hidden):not(:empty) {
  display: block;
  padding: 0.62rem 0.72rem;
  border: 1px solid rgba(163, 160, 173, 0.16);
  border-radius: 0.5rem;
  background: rgba(163, 160, 173, 0.08);
  line-height: 1.65;
}

.msg.err {
  color: #fecdd3;
  border-color: rgba(244, 63, 94, 0.34);
  background: rgba(127, 29, 29, 0.22);
}

.msg.ok {
  color: #fde68a;
  border-color: rgba(245, 158, 11, 0.32);
  background: rgba(120, 53, 15, 0.2);
}

.msg.warn {
  color: #fef3c7;
  border-color: rgba(245, 158, 11, 0.36);
  background: rgba(120, 53, 15, 0.22);
}

.msg.info {
  color: #dbeafe;
  border-color: rgba(59, 130, 246, 0.28);
  background: rgba(30, 64, 175, 0.16);
}

html[data-theme="light"] .msg.err {
  color: #9f1239;
  border-color: rgba(225, 29, 72, 0.2);
  background: rgba(255, 241, 242, 0.92);
}

html[data-theme="light"] .msg.ok {
  color: #92400e;
  border-color: rgba(217, 119, 6, 0.22);
  background: rgba(255, 251, 235, 0.95);
}

html[data-theme="light"] .msg.warn {
  color: #92400e;
  border-color: rgba(217, 119, 6, 0.26);
  background: rgba(255, 251, 235, 0.95);
}

html[data-theme="light"] .msg.info {
  color: #1e3a8a;
  border-color: rgba(37, 99, 235, 0.18);
  background: rgba(239, 246, 255, 0.95);
}

.guest-login-notice {
  margin: 0.85rem 0 0;
  padding: 0.72rem 0.85rem;
  border: 1px solid rgb(var(--accent-rgb) / 0.28);
  border-radius: 8px;
  background: rgb(var(--accent-rgb) / 0.08);
  color: var(--text);
  font-size: 0.9rem;
  line-height: 1.7;
}

.guest-login-notice a,
.search-scroll-hint a {
  color: var(--accent-2);
  font-weight: 700;
  text-decoration: none;
}

.guest-login-notice a:hover,
.search-scroll-hint a:hover {
  text-decoration: underline;
}

.auth-terms-accept {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 0.28rem;
  margin-top: 0.42rem;
  padding: 0.12rem 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: color-mix(in srgb, var(--muted) 82%, var(--text));
  cursor: pointer;
  direction: rtl;
  text-align: right;
}

.auth-terms-accept.is-attention {
  animation: authTermsNudge 360ms ease;
}

.auth-terms-accept input {
  flex: 0 0 auto;
  width: 1rem;
  height: 1rem;
  margin: 0;
  accent-color: var(--accent);
}

.auth-terms-copy {
  flex: 0 1 auto;
  min-width: 0;
  display: inline-flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 0.2rem;
  font-size: 0.72rem;
  font-weight: 760;
  line-height: 1.35;
  text-align: right;
}

.auth-terms-copy label {
  cursor: pointer;
}

.auth-terms-link {
  width: auto;
  min-height: 0;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
  color: color-mix(in srgb, var(--accent) 46%, var(--muted));
  font: inherit;
  text-decoration: underline;
  text-underline-offset: 0.18em;
}

.auth-terms-link:hover,
.auth-terms-link:focus-visible {
  background: transparent;
  box-shadow: none;
  color: var(--accent-soft);
  transform: none;
}

.terms-nav-actions {
  display: flex;
  justify-content: flex-start;
  margin-top: 0.7rem;
}

.terms-nav-action {
  min-height: 2.25rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0.46rem 0.9rem;
  border: 1px solid color-mix(in srgb, var(--accent) 26%, var(--line));
  border-radius: 8px;
  background: color-mix(in srgb, var(--accent) 7%, transparent);
  color: var(--accent-hover);
  font-size: 0.84rem;
  font-weight: 850;
  line-height: 1.4;
  text-decoration: none;
}

.terms-nav-action:hover,
.terms-nav-action:focus-visible {
  background: color-mix(in srgb, var(--accent) 12%, transparent);
  color: var(--accent);
}

@keyframes authTermsNudge {
  0%,
  100% {
    transform: translateX(0);
  }

  18% {
    transform: translateX(5px);
  }

  36% {
    transform: translateX(-5px);
  }

  54% {
    transform: translateX(3px);
  }

  72% {
    transform: translateX(-3px);
  }
}

@media (prefers-reduced-motion: reduce) {
  .auth-terms-accept.is-attention {
    animation: none;
  }
}

.phone-auth-head {
  text-align: center;
  padding-top: 0;
}

.phone-auth-logo {
  display: block;
  width: 4rem;
  height: 4rem;
  margin: 0 auto 0.68rem;
  object-fit: contain;
  overflow: hidden;
  border-radius: var(--radius);
  filter: drop-shadow(0 3px 10px color-mix(in srgb, var(--ink) 12%, transparent));
}

.phone-auth-lockup {
  display: block;
  width: 4.55rem;
  aspect-ratio: 1 / 1;
  margin: 0 auto 0.58rem;
  overflow: hidden;
  border-radius: var(--radius);
  filter: drop-shadow(0 3px 10px color-mix(in srgb, var(--ink) 12%, transparent));
}

.phone-auth-head h1 {
  justify-content: center;
  font-size: clamp(1.55rem, 4vw, 2rem);
  line-height: 1.35;
}

.phone-auth-lead {
  margin: 0.55rem auto 0;
  max-width: 24rem;
  color: var(--muted);
  font-size: 0.95rem;
  line-height: 1.8;
}

.phone-auth-card {
  padding: 0.82rem 1.15rem 1.08rem;
  text-align: center;
}

.phone-auth-card-head {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.75rem;
  margin-bottom: 0.28rem;
}

.phone-auth-card-head strong {
  font-size: 0.98rem;
  font-weight: 800;
}

.auth-helper-copy {
  margin: 0.1rem auto 0.72rem;
  max-width: 21rem;
  color: var(--muted);
  font-size: 0.8rem;
  font-weight: 620;
  line-height: 1.85;
}

.phone-auth-card #phone,
.phone-auth-card #login-password,
.phone-auth-card #password-reset-new-password,
.phone-auth-card #password-reset-new-password-repeat {
  direction: ltr;
  text-align: center;
  font-size: 1.08rem;
  letter-spacing: 0.02em;
}

.phone-auth-card label {
  text-align: center;
}

.password-field {
  position: relative;
  display: block;
  width: 100%;
  direction: ltr;
}

.password-field input {
  width: 100%;
  direction: ltr !important;
  text-align: left !important;
  padding-right: 3rem !important;
  padding-left: 0.95rem !important;
}

.password-eye {
  position: absolute;
  right: 0.42rem;
  left: auto;
  inset-block-start: 50%;
  z-index: 2;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.2rem !important;
  min-width: 2.2rem !important;
  max-width: 2.2rem !important;
  height: 2.2rem !important;
  min-height: 2.2rem !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: transparent !important;
  color: var(--muted) !important;
  box-shadow: none !important;
  transform: translateY(-50%);
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
}

.password-eye:hover,
.password-eye:focus-visible {
  background: color-mix(in srgb, var(--accent) 10%, transparent) !important;
  color: var(--text) !important;
}

.password-eye:active {
  transform: translateY(-50%) !important;
}

.password-eye svg {
  width: 1.18rem;
  height: 1.18rem;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.password-eye .password-eye-hide,
.password-eye.is-visible .password-eye-show {
  display: none;
}

.password-eye.is-visible .password-eye-hide {
  display: block;
}

.phone-auth-card #btn-send-otp,
.phone-auth-card #btn-password-login,
.phone-auth-card #btn-verify-password-reset-code,
.phone-auth-card #btn-confirm-password-reset {
  margin-top: 0.86rem !important;
}

.phone-auth-card #btn-send-otp,
.phone-auth-card #btn-password-login,
.phone-auth-card #btn-auth-choice-password,
.phone-auth-card #btn-verify {
  min-height: 2.72rem !important;
  width: min(100%, 16rem) !important;
  max-width: 16rem !important;
  margin-inline: auto !important;
  border-radius: 8px !important;
  font-size: 0.9rem !important;
}

.auth-password-toggle {
  margin-top: 0 !important;
}

.auth-alt-action,
.phone-guest-action,
.otp-resend-action {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: auto !important;
  min-width: 0 !important;
  min-height: 1.8rem !important;
  margin: 0 !important;
  padding: 0.14rem 0.28rem !important;
  border: 0 !important;
  border-radius: 8px !important;
  background: transparent !important;
  color: color-mix(in srgb, var(--accent) 46%, var(--text)) !important;
  box-shadow: none !important;
  cursor: pointer;
  font-size: 0.78rem !important;
  font-weight: 860 !important;
  text-decoration: none;
}

.auth-alt-action:hover,
.phone-guest-action:hover,
.otp-resend-action:not(:disabled):hover {
  color: var(--accent) !important;
  background: color-mix(in srgb, var(--accent) 8%, transparent) !important;
}

.auth-alt-action:focus-visible,
.phone-guest-action:focus-visible,
.otp-resend-action:focus-visible {
  outline: 2px solid color-mix(in srgb, var(--accent) 44%, transparent);
  outline-offset: 0.16rem;
  color: var(--accent) !important;
  background: color-mix(in srgb, var(--accent) 8%, transparent) !important;
}

.auth-alt-action:active,
.phone-guest-action:active,
.otp-resend-action:not(:disabled):active {
  color: color-mix(in srgb, var(--accent) 82%, var(--text)) !important;
  background: color-mix(in srgb, var(--accent) 12%, transparent) !important;
  transform: translateY(1px);
}

.auth-password-otp-row {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 0.35rem;
  margin: 0.78rem auto 0;
  color: color-mix(in srgb, var(--muted) 88%, var(--text));
  font-size: 0.78rem;
  font-weight: 700;
}

.auth-password-panel {
  display: grid;
  gap: 0.5rem;
  margin-top: 0.75rem;
  padding-top: 0.75rem;
  border-top: 1px solid var(--line-soft);
}

.auth-password-panel.hidden {
  display: none;
}

.auth-password-panel #login-password {
  direction: ltr;
  text-align: center;
}

.phone-guest-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  margin-top: 0.82rem;
  padding-top: 0.72rem;
  border-top: 1px solid var(--line-soft);
  color: var(--muted);
  font-size: 0.8rem;
  font-weight: 650;
}

/* ثبت وزن — بازخورد موفق */
.stats-save-ok-banner.msg.ok {
  display: block;
  margin-top: 0.75rem;
  padding: 0.7rem 0.9rem;
  border-radius: 12px;
  font-weight: 650;
  font-size: 0.92rem;
  line-height: 1.45;
  color: var(--accent-contrast);
  background: rgb(var(--accent-strong-rgb) / 0.2);
  border: 1px solid rgb(var(--accent-soft-rgb) / 0.5);
  box-shadow: 0 0 0 0 rgb(var(--accent-soft-rgb) / 0.35);
  animation: stats-save-pop 0.55s ease;
}

html[data-theme="light"] .stats-save-ok-banner.msg.ok {
  color: #9a3412;
  background: rgb(var(--accent-strong-rgb) / 0.12);
  border-color: rgb(var(--accent-strong-rgb) / 0.35);
}

@keyframes stats-save-pop {
  0% {
    opacity: 0;
    transform: translateY(6px) scale(0.98);
    box-shadow: 0 0 0 0 rgb(var(--accent-soft-rgb) / 0.45);
  }
  45% {
    opacity: 1;
    transform: translateY(0) scale(1);
    box-shadow: 0 0 0 6px rgb(var(--accent-soft-rgb) / 0.12);
  }
  100% {
    box-shadow: 0 0 0 0 rgb(var(--accent-soft-rgb) / 0);
  }
}

.stats-log-weight-card.stats-save-card-ok {
  border-color: rgb(var(--accent-soft-rgb) / 0.45);
  box-shadow: 0 0 0 1px rgb(var(--accent-soft-rgb) / 0.2), 0 8px 24px rgb(var(--accent-strong-rgb) / 0.12);
  transition: border-color 0.25s ease, box-shadow 0.25s ease;
}

html[data-theme="light"] .stats-log-weight-card.stats-save-card-ok {
  border-color: rgb(var(--accent-strong-rgb) / 0.35);
  box-shadow: 0 0 0 1px rgb(var(--accent-strong-rgb) / 0.15), 0 8px 20px rgb(var(--accent-strong-rgb) / 0.08);
}

#btn-stats-save-log.stats-save-btn-ok {
  background: linear-gradient(180deg, rgb(var(--accent-rgb) / 0.95), rgb(var(--accent-strong-rgb) / 0.98));
  border-color: rgba(134, 239, 172, 0.55);
  color: #f0fdf4;
  box-shadow: 0 4px 18px rgb(var(--accent-strong-rgb) / 0.35);
}

html[data-theme="light"] #btn-stats-save-log.stats-save-btn-ok {
  background: linear-gradient(180deg, #f59e0b, var(--accent-strong));
  color: #fff;
}

pre {
  white-space: pre-wrap;
  font-size: 0.78rem;
  color: var(--muted);
  margin-top: 0.75rem;
  max-height: 14rem;
  overflow: auto;
  font-family: ui-monospace, "Cascadia Mono", monospace;
  direction: ltr;
  text-align: left;
}

.day-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.5rem;
  margin-top: 0.75rem;
}

.day-grid button {
  margin: 0;
  padding: 0.65rem 0.5rem;
  font-size: 0.88rem;
}

.hidden {
  display: none !important;
}

.otp-entry {
  position: relative;
  margin: 1rem 0 0.95rem;
}

.otp-autofill-input {
  position: absolute;
  inset: 0;
  z-index: 2;
  display: block;
  width: 100% !important;
  height: 100%;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  outline: 0;
  color: transparent;
  caret-color: transparent;
  background: transparent !important;
  box-shadow: none !important;
  opacity: 0.01;
}

.otp-boxes {
  display: flex;
  flex-direction: row;
  justify-content: center;
  gap: 0.5rem;
  margin: 0;
  direction: ltr;
  pointer-events: none;
}

.otp-digit {
  position: relative;
  width: auto;
  flex: 1;
  max-width: 3.25rem;
  text-align: center;
  font-size: 1.35rem;
  font-weight: 800;
  padding: 0.65rem 0.25rem;
  font-variant-numeric: tabular-nums;
  border-color: color-mix(in srgb, var(--accent) 20%, var(--control-line));
  background: color-mix(in srgb, var(--surface) 78%, var(--accent) 4%);
  transition:
    border-color 0.16s ease,
    box-shadow 0.16s ease,
    background 0.16s ease,
    transform 0.16s ease;
}

.otp-digit.is-filled {
  border-color: color-mix(in srgb, var(--accent-strong) 44%, var(--control-line));
  background: color-mix(in srgb, var(--surface) 70%, var(--accent) 8%);
}

.otp-digit.is-active {
  border-color: var(--accent-strong);
  background: color-mix(in srgb, var(--surface) 64%, var(--accent) 12%);
  box-shadow:
    0 0 0 3px color-mix(in srgb, var(--accent) 22%, transparent),
    0 0 18px color-mix(in srgb, var(--accent) 18%, transparent);
  transform: translateY(-1px);
}

.otp-digit.is-active:not(.is-filled)::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 2px;
  height: 1.45rem;
  border-radius: 999px;
  background: var(--accent-strong);
  transform: translate(-50%, -50%);
  animation: otp-caret-blink 1s steps(2, start) infinite;
}

@keyframes otp-caret-blink {
  0%,
  45% {
    opacity: 1;
  }
  46%,
  100% {
    opacity: 0;
  }
}

.otp-resend-hint {
  margin: 0;
  min-height: 0;
}

.otp-auth-head {
  margin-bottom: 0.15rem;
}

.otp-auth-lockup {
  width: 5rem;
  margin-bottom: 0.8rem;
}

.otp-auth-card #otp-phone-hint,
.password-reset-auth-card #password-reset-phone-hint {
  margin: 0.15rem 0 0;
  text-align: center;
  line-height: 1.7;
}

.otp-auth-card #btn-verify,
.password-reset-auth-card #btn-verify-password-reset-code {
  margin-top: 1.05rem !important;
}

.otp-resend-row {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.55rem;
  margin-top: 1rem;
  padding-top: 0.9rem;
  border-top: 1px solid var(--line-soft);
  color: var(--muted);
}

.otp-resend-action:disabled {
  cursor: default;
  opacity: 0.48;
}

.phone-fa-preview {
  margin: 0.35rem 0 0;
  min-height: 1.35em;
  direction: ltr;
  text-align: center;
  font-size: 1.1rem;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
  letter-spacing: 0.06em;
}

.otp-dev-hint {
  margin: 0.5rem 0 0.75rem;
  padding: 0.65rem 0.75rem;
  border-radius: 0.55rem;
  border: 1px solid #413d4f;
  background: rgb(var(--accent-rgb) / 0.12);
  font-size: 0.88rem;
  line-height: 1.55;
}

button.wide {
  width: 100%;
}

/* ─── جستجوی تمرین + کارت ─── */
.search-status {
  margin-top: 0.75rem;
  min-height: 1.2em;
  font-size: 0.88rem;
}

.search-status strong {
  color: var(--text);
  font-weight: 800;
}

.search-status-err {
  color: var(--err);
}

.search-status-warn {
  color: var(--muted);
}

.search-status-ok {
  color: var(--search-status-ok);
}

.search-results {
  margin-top: 1rem;
  display: flex;
  flex-direction: column;
  gap: 0.85rem;
}

.search-results .ex-card {
  block-size: 8.9rem;
  display: flex;
  flex-direction: column;
}

.search-results .ex-card--plan-picker {
  block-size: 11.35rem;
}

.ex-card {
  position: relative;
  background: var(--ex-card-bg);
  border: 1px solid var(--ex-card-border);
  border-radius: calc(var(--radius) + 0.08rem);
  overflow: hidden;
  cursor: pointer;
  transition: border-color 0.18s ease, box-shadow 0.18s ease, transform 0.12s ease;
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.045) inset;
}

.ex-card::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(135deg, rgb(var(--accent-rgb) / 0.12), transparent 34%, rgb(var(--accent-rgb) / 0.08));
  opacity: 0.75;
}

button.ex-card {
  color: var(--text);
}

.ex-card:focus {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}

.ex-card:hover {
  border-color: var(--ex-card-hover-bd);
  box-shadow: 0 10px 26px var(--ex-card-shadow);
  transform: translateY(-1px);
}

.ex-card-inner {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: 6.5rem 1fr;
  gap: 0.75rem;
  align-items: start;
  padding: 0.65rem 0.75rem;
}

.search-results .ex-card-inner {
  min-block-size: 0;
  flex: 1 1 auto;
}

@media (max-width: 360px) {
  .ex-card-inner {
    grid-template-columns: 5.4rem 1fr;
    gap: 0.55rem;
  }
}

.ex-card-media {
  position: relative;
  inline-size: 100%;
  aspect-ratio: 1;
  height: auto;
  min-height: 0;
  box-sizing: border-box;
  padding: 0.32rem;
  border-radius: 0.72rem;
  overflow: hidden;
  background: var(--ex-media-bg);
  align-self: start;
  box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.055) inset;
}

.ex-card-media--lyfta,
.ex-card-media--lyfta .ex-card-img {
  background: #fff;
  filter: none;
}

.ex-card-media--loop::after {
  content: "";
  position: absolute;
  inset-inline: 0.45rem;
  bottom: 0.36rem;
  height: 0.16rem;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.58);
  box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.12);
}

.ex-media-count {
  position: absolute;
  top: 0.35rem;
  inset-inline-start: 0.35rem;
  min-width: 1.35rem;
  height: 1.25rem;
  padding: 0 0.32rem;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 0.68rem;
  font-weight: 800;
  color: #fff;
  background: rgba(10, 13, 18, 0.62);
  backdrop-filter: blur(8px);
}

.ex-card-img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: top center;
  display: block;
}

.ex-card-copy {
  min-width: 0;
  min-height: 0;
  overflow: hidden;
}

.ex-card--quick-add .ex-card-copy {
  padding-inline-end: 2.15rem;
}

.ex-card--quick-add .ex-card-title-row,
.ex-card--quick-add .ex-card-title,
.ex-card--quick-add .ex-card-sub {
  max-inline-size: 100%;
  min-inline-size: 0;
}

.ex-card-media--placeholder .ex-card-img {
  object-fit: contain;
  filter: saturate(0.98) contrast(1.02);
}

.ex-card-ph {
  min-height: 4.85rem;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.7rem;
  font-weight: 700;
  color: var(--ex-ph-fg);
  letter-spacing: 0.08em;
  background: repeating-linear-gradient(
    -12deg,
    var(--ex-ph-a),
    var(--ex-ph-a) 6px,
    var(--ex-ph-b) 6px,
    var(--ex-ph-b) 12px
  );
}

.ex-card-title-row {
  display: flex;
  align-items: flex-start;
  gap: 0.38rem;
  min-width: 0;
  margin: 0 0 0.2rem;
}

.ex-card-play-mark {
  flex: 0 0 auto;
  inline-size: 1.1rem;
  block-size: 1.1rem;
  margin-block-start: 0.12rem;
  display: inline-grid;
  place-items: center;
  border: 1px solid color-mix(in srgb, var(--accent) 54%, var(--text));
  border-radius: 50%;
  color: color-mix(in srgb, var(--accent) 72%, var(--text));
  background: color-mix(in srgb, var(--surface) 78%, transparent);
  opacity: 0.86;
  filter: drop-shadow(0 0 7px color-mix(in srgb, var(--accent) 34%, transparent));
}

.ex-card-play-mark::before {
  content: "";
  inline-size: 0.42rem;
  block-size: 0.52rem;
  transform: translateX(0.07rem);
  clip-path: polygon(0 0, 100% 50%, 0 100%);
  background: currentColor;
}

.ex-card-title {
  margin: 0;
  font-size: 0.97rem;
  font-weight: 600;
  line-height: 1.35;
  color: var(--text);
  max-block-size: 2.7em;
  overflow: hidden;
  overflow-wrap: anywhere;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  line-clamp: 2;
}

.ex-card-sub {
  margin: 0 0 0.35rem;
  font-size: 0.78rem;
  color: var(--muted);
  direction: ltr;
  text-align: right;
  line-height: 1.35;
  overflow: hidden;
  overflow-wrap: anywhere;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.ex-external-links {
  display: flex;
  align-items: center;
  gap: 0.32rem;
  min-width: 0;
}

.ex-external-link {
  position: relative;
  inline-size: 1.58rem;
  block-size: 1.58rem;
  flex: 0 0 auto;
  display: inline-grid;
  place-items: center;
  border-radius: 0.55rem;
  border: 1px solid color-mix(in srgb, var(--text) 12%, transparent);
  background: color-mix(in srgb, var(--surface) 82%, transparent);
  color: var(--text);
  text-decoration: none;
  -webkit-tap-highlight-color: transparent;
  transition: transform 0.12s ease, border-color 0.16s ease, background 0.16s ease;
}

.ex-external-link:hover,
.ex-external-link:focus-visible {
  transform: translateY(-1px);
  border-color: color-mix(in srgb, currentColor 46%, transparent);
  background: color-mix(in srgb, currentColor 12%, var(--surface));
  outline: none;
}

.ex-external-icon {
  inline-size: 1.08rem;
  block-size: 1.08rem;
  display: block;
}

.ex-external-badge {
  position: absolute;
  inset-block-start: -0.28rem;
  inset-inline-start: -0.2rem;
  min-inline-size: 0.92rem;
  block-size: 0.92rem;
  display: inline-grid;
  place-items: center;
  border: 1px solid color-mix(in srgb, var(--surface) 86%, var(--text));
  border-radius: 999px;
  background: var(--surface);
  color: var(--text);
  font-size: 0.5rem;
  font-weight: 800;
  line-height: 1;
}

.ex-external-link--youtube {
  color: #ff0033;
}

.ex-card-meta {
  font-size: 0.75rem;
  color: var(--ex-meta);
  margin-bottom: 0.4rem;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.2rem;
  max-block-size: 1.35rem;
  overflow: hidden;
}

.ex-card-meta span:not(.dot) {
  min-width: 0;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.ex-card-meta .dot {
  opacity: 0.5;
}

.tag-row {
  display: flex;
  flex-wrap: wrap;
  gap: 0.3rem;
  margin-bottom: 0.25rem;
  max-block-size: 3.9rem;
  overflow: hidden;
}

.ex-card .tag-row {
  flex-wrap: nowrap;
  max-block-size: 1.55rem;
  min-width: 0;
}

.ex-card .tag-row .tag-chip {
  flex: 0 1 auto;
  min-width: 0;
}

.tag-row-lg {
  margin: 0.6rem 0 0;
}

.exercise-modal-body .tag-row,
.exercise-modal-body .tag-row-lg {
  max-block-size: none;
  overflow: visible;
}

.tag-chip {
  font-size: 0.69rem;
  font-weight: 500;
  padding: 0.18rem 0.45rem;
  border-radius: 999px;
  background: var(--tag-bg);
  color: var(--tag-fg);
  border: 1px solid var(--tag-bd);
  white-space: nowrap;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
}

.tag-chip-accent {
  background: var(--tag-acc-bg);
  border-color: var(--tag-acc-bd);
  color: var(--tag-acc-fg);
}

.tag-chip-primary {
  background: color-mix(in srgb, var(--accent) 18%, var(--surface));
  border-color: color-mix(in srgb, var(--accent) 58%, var(--tag-bd));
  color: color-mix(in srgb, #fed7aa 62%, var(--text));
}

.tag-chip-secondary {
  background: color-mix(in srgb, #14b8a6 17%, var(--surface));
  border-color: color-mix(in srgb, #14b8a6 60%, var(--tag-bd));
  color: color-mix(in srgb, #99f6e4 62%, var(--text));
}

.tag-chip-bodypart {
  background: color-mix(in srgb, #38bdf8 16%, var(--surface));
  border-color: color-mix(in srgb, #38bdf8 56%, var(--tag-bd));
  color: color-mix(in srgb, #bae6fd 64%, var(--text));
}

.tag-chip-equipment {
  background: color-mix(in srgb, #a78bfa 16%, var(--surface));
  border-color: color-mix(in srgb, #a78bfa 56%, var(--tag-bd));
  color: color-mix(in srgb, #ddd6fe 64%, var(--text));
}

html[data-theme="light"] .tag-chip-primary {
  background: rgb(var(--accent-rgb) / 0.12);
  border-color: rgb(var(--accent-strong-rgb) / 0.38);
  color: #9a3412;
}

html[data-theme="light"] .tag-chip-secondary {
  background: rgba(20, 184, 166, 0.12);
  border-color: rgba(13, 148, 136, 0.38);
  color: #0f766e;
}

html[data-theme="light"] .tag-chip-bodypart {
  background: rgba(56, 189, 248, 0.13);
  border-color: rgba(2, 132, 199, 0.36);
  color: #075985;
}

html[data-theme="light"] .tag-chip-equipment {
  background: rgba(167, 139, 250, 0.14);
  border-color: rgba(124, 58, 237, 0.32);
  color: #5b21b6;
}

.tag-chip-muted {
  opacity: 0.85;
  background: rgba(139, 156, 179, 0.1);
  border-color: rgba(139, 156, 179, 0.2);
}

.tag-more {
  background: transparent;
  border-style: dashed;
  color: var(--muted);
}

/* ─── مودال جزئیات ─── */
.exercise-modal {
  position: fixed;
  inset: 0;
  z-index: 10050;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  padding: 0;
}

.exercise-modal.hidden {
  display: none !important;
}

.exercise-modal-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(7, 6, 10, 0.72);
  backdrop-filter: blur(6px);
}

.exercise-modal-panel {
  position: relative;
  width: 100%;
  max-width: min(var(--app-shell-max), 38rem);
  max-height: min(88vh, 640px);
  margin: 0 auto;
  background: linear-gradient(180deg, #151d2e 0%, #101626 100%);
  border: 1px solid #2c2a36;
  border-radius: 1.1rem 1.1rem 0 0;
  box-shadow: 0 -8px 40px rgba(0, 0, 0, 0.5);
  display: flex;
  flex-direction: column;
  animation: sheetUp 0.28s ease-out;
}

@keyframes sheetUp {
  from {
    transform: translateY(100%);
    opacity: 0.6;
  }
  to {
    transform: none;
    opacity: 1;
  }
}

.exercise-modal-head {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: flex-start;
  gap: 0.45rem;
  padding: 0.85rem 1rem 0.5rem;
  border-bottom: 1px solid var(--modal-head-bd);
  flex-shrink: 0;
}

.exercise-modal-title {
  flex: 1;
  margin: 0;
  min-width: 0;
  max-width: 100%;
  font-size: 1.05rem;
  font-weight: 700;
  line-height: 1.4;
  text-align: start;
  overflow-wrap: anywhere;
  word-break: break-word;
  white-space: normal;
  padding-inline-end: 0.15rem;
  color: var(--text);
}

.exercise-modal-head-controls {
  display: inline-flex;
  flex-direction: row;
  align-items: center;
  gap: 0.4rem;
  flex-shrink: 0;
  margin-top: 0.05rem;
}

.exercise-modal-icon-btn {
  box-sizing: border-box;
  flex-shrink: 0;
  width: 2.15rem;
  height: 2.15rem;
  border: 1px solid var(--control-line, color-mix(in srgb, var(--text) 12%, transparent));
  border-radius: 0.65rem;
  padding: 0;
  font-family: inherit;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  background: var(--control-bg, var(--modal-x-bg));
  color: var(--app-icon-mono);
  box-shadow: 0 0.5rem 1.1rem color-mix(in srgb, var(--ink, #08070b) 10%, transparent);
  transition: background 0.16s ease, border-color 0.16s ease, color 0.16s ease, transform 0.16s ease;
}

.exercise-modal-icon-btn:hover,
.exercise-modal-icon-btn:focus-visible {
  border-color: color-mix(in srgb, currentColor 34%, var(--control-line, transparent));
  background: color-mix(in srgb, currentColor 10%, var(--control-bg, var(--modal-x-bg)));
}

.exercise-modal-icon-btn:active {
  transform: translateY(1px);
}

.exercise-modal-icon-btn svg {
  display: block;
  width: 1.15rem;
  height: 1.15rem;
}

.exercise-modal-close {
  color: var(--app-icon-mono);
  font-size: 1.35rem;
  font-weight: 700;
  line-height: 1;
}

.exercise-modal-close:hover {
  color: var(--err);
}

.exercise-modal-body {
  overflow-y: auto;
  padding: 0 1rem 1.25rem;
  -webkit-overflow-scrolling: touch;
  color: var(--text);
}

.ex-detail-hero-wrap {
  position: relative;
  margin: 0 -1rem 0.85rem;
  background: radial-gradient(circle at 50% 30%, var(--hero-radial), transparent 65%);
}

.ex-detail-hero-wrap--loop {
  padding-bottom: 2.6rem;
}

.ex-detail-hero {
  width: 100%;
  max-height: 200px;
  object-fit: contain;
  background: var(--ex-media-bg);
  display: block;
}

.ex-detail-hero-wrap--lyfta,
.ex-detail-hero-wrap--lyfta .ex-detail-hero {
  background: #fff;
  filter: none;
}

.ex-detail-hero-wrap--placeholder .ex-detail-hero {
  max-height: 230px;
  object-fit: cover;
}

.ex-detail-media-meta {
  position: absolute;
  inset-inline-start: 0.75rem;
  bottom: 3.2rem;
  display: inline-flex;
  align-items: center;
  min-height: 1.6rem;
  padding: 0 0.6rem;
  border-radius: 999px;
  color: #fff;
  font-size: 0.74rem;
  font-weight: 800;
  background: rgba(10, 13, 18, 0.64);
  backdrop-filter: blur(10px);
}

.ex-media-controls {
  position: absolute;
  inset-inline: 0.75rem;
  bottom: 0.62rem;
  height: 2rem;
  display: grid;
  grid-template-columns: 2rem 2rem minmax(2.4rem, auto) 2rem;
  align-items: center;
  justify-content: center;
  gap: 0.38rem;
  pointer-events: auto;
}

.ex-media-btn {
  inline-size: 2rem;
  block-size: 2rem;
  min-width: 0;
  padding: 0;
  border: 0;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  background: rgba(10, 13, 18, 0.66);
  box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.16) inset;
  backdrop-filter: blur(10px);
}

.ex-media-btn:active {
  transform: translateY(1px);
}

.ex-media-btn svg {
  inline-size: 1rem;
  block-size: 1rem;
  pointer-events: none;
  fill: currentColor;
  stroke: currentColor;
  stroke-width: 2.25;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.ex-media-btn svg rect,
.ex-media-btn svg polygon {
  stroke: none;
}

.ex-media-position {
  min-inline-size: 2.4rem;
  block-size: 1.55rem;
  padding: 0 0.5rem;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-size: 0.72rem;
  font-weight: 800;
  background: rgba(10, 13, 18, 0.58);
  backdrop-filter: blur(10px);
  font-variant-numeric: tabular-nums;
}

.ex-detail-sub {
  margin: 0 0 0.5rem;
  font-size: 0.82rem;
  color: var(--muted);
  direction: ltr;
  text-align: right;
}

.ex-detail-meta {
  font-size: 0.82rem;
  color: var(--detail-meta);
  margin-bottom: 0.35rem;
}

.ex-detail-ai-chip,
.ex-card-ai-chip {
  display: inline-flex;
  align-items: center;
  min-height: 1.25rem;
  padding: 0.1rem 0.38rem;
  border-radius: 6px;
  border: 1px solid color-mix(in srgb, var(--accent) 35%, rgba(163, 160, 173, 0.28));
  background: color-mix(in srgb, var(--accent) 10%, transparent);
  color: color-mix(in srgb, var(--accent) 42%, var(--text));
  font-size: 0.72rem;
  font-weight: 850;
  line-height: 1;
  vertical-align: middle;
}

.ex-external-links--detail {
  margin: 0.2rem 0 0.65rem;
}

.ex-external-links--detail .ex-external-link {
  inline-size: 2rem;
  block-size: 2rem;
  border-radius: 0.7rem;
}

.ex-external-links--detail .ex-external-icon {
  inline-size: 1.24rem;
  block-size: 1.24rem;
}

.ex-detail-id {
  margin: 0 0 0.65rem;
}

.ex-detail-id code {
  direction: ltr;
  unicode-bidi: plaintext;
  font-size: 0.8em;
  padding: 0.1rem 0.35rem;
  border-radius: 0.3rem;
  background: var(--detail-code-bg);
}

.ex-detail-source {
  margin: 0 0 0.65rem;
}

.ex-detail-source a {
  color: var(--accent);
  font-size: 0.82rem;
  font-weight: 700;
  text-decoration: none;
}

.ex-detail-source a:hover {
  text-decoration: underline;
}

.ex-detail-videos {
  display: grid;
  gap: 0.65rem;
  margin: 0.6rem 0 0.8rem;
}

.ex-detail-video-item {
  display: grid;
  gap: 0.35rem;
}

.ex-detail-video {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center center;
  background: var(--ex-media-bg);
}

.fitana-player {
  display: grid;
  grid-template-rows: minmax(0, auto) auto;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: 0.7rem;
  background: #0a0a0a;
  box-shadow: 0 0.75rem 1.8rem rgba(0, 0, 0, 0.28);
}

.fitana-player-stage {
  position: relative;
  display: grid;
  place-items: center;
  inline-size: 100%;
  max-inline-size: 100%;
  justify-self: stretch;
  aspect-ratio: 16 / 9;
  min-height: 170px;
  max-height: 320px;
  overflow: hidden;
  background: #000;
  z-index: 1;
}

.fitana-player-video {
  position: absolute;
  inset: 0;
  z-index: 0;
  inline-size: 100%;
  block-size: 100%;
  max-inline-size: 100%;
  max-block-size: 100%;
  object-fit: contain;
  object-position: center center;
  border-radius: 0;
  background: #000;
}

.fitana-player-poster {
  position: absolute;
  inset: 0;
  z-index: 1;
  inline-size: 100%;
  block-size: 100%;
  max-inline-size: 100%;
  max-block-size: 100%;
  object-fit: contain;
  object-position: center center;
  background: #000;
  transition: opacity 0.18s ease;
}

.fitana-player.has-started .fitana-player-poster,
.fitana-player.is-playing .fitana-player-poster {
  opacity: 0;
  pointer-events: none;
}

.fitana-player-overlay {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  border: 0;
  background: rgba(0, 0, 0, 0.08);
  color: #fff;
  cursor: pointer;
  transition: opacity 0.16s ease, background 0.16s ease;
  z-index: 2;
}

.fitana-player.is-playing .fitana-player-overlay {
  opacity: 0;
  pointer-events: none;
}

.fitana-player-overlay-icon {
  display: grid;
  place-items: center;
  width: 3.6rem;
  height: 3.6rem;
  border: 1px solid rgba(255, 255, 255, 0.34);
  border-radius: 999px;
  background: rgba(0, 0, 0, 0.58);
  box-shadow: 0 0.8rem 1.8rem rgba(0, 0, 0, 0.3);
  backdrop-filter: blur(8px);
}

.fitana-player-badge {
  position: absolute;
  top: 0.65rem;
  right: 0.65rem;
  display: grid;
  place-items: center;
  width: 1.65rem;
  height: 1.65rem;
  border: 1px solid rgba(255, 255, 255, 0.2);
  border-radius: 999px;
  background: rgba(0, 0, 0, 0.5);
  color: rgba(255, 255, 255, 0.82);
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 0.68rem;
  font-weight: 700;
  z-index: 3;
}

.fitana-player-controls {
  position: relative;
  z-index: 5;
  display: grid;
  grid-template-columns: 2.25rem 2.9rem minmax(0, 1fr) 2.9rem 2.25rem 2.25rem auto;
  align-items: center;
  overflow: hidden;
  gap: 0.4rem;
  min-height: 3.2rem;
  padding: 0.48rem;
  border-top: 1px solid rgba(255, 255, 255, 0.12);
  background: #111 !important;
  background-image: none !important;
  isolation: isolate;
}

.fitana-player-controls video,
.fitana-player-controls img,
.fitana-player-controls picture,
.fitana-player-controls source,
.fitana-player-controls canvas,
.fitana-player-controls .fitana-player-video,
.fitana-player-controls .fitana-player-poster,
.fitana-player-controls .ex-detail-video,
.fitana-player-controls .ex-detail-hero {
  display: none !important;
}

.fitana-player-btn {
  position: relative;
  display: grid;
  place-items: center;
  width: 2.25rem;
  height: 2.25rem;
  border: 1px solid rgba(255, 255, 255, 0.24);
  border-radius: 0.6rem;
  background: rgba(255, 255, 255, 0.08);
  color: #fff;
  cursor: pointer;
  transition: border-color 0.16s ease, background 0.16s ease, color 0.16s ease;
}

.fitana-player-btn:hover {
  border-color: rgba(255, 255, 255, 0.44);
  background: rgba(255, 255, 255, 0.14);
  color: #fff;
}

.fitana-player-btn:focus-visible {
  outline: 2px solid rgba(255, 255, 255, 0.42);
  outline-offset: 2px;
}

.fitana-player-ico,
.fitana-player-overlay-icon svg {
  display: grid;
  place-items: center;
  color: currentColor;
  line-height: 0;
}

.fitana-player-ico {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 1.1rem;
  height: 1.1rem;
  transform: translate(-50%, -50%);
}

.fitana-player-overlay-icon svg {
  width: 1.45rem;
  height: 1.45rem;
}

.fitana-player-ico svg,
.fitana-player-overlay-icon svg {
  display: block;
  width: 100%;
  height: 100%;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.fitana-player-ico-play svg,
.fitana-player-overlay-icon svg {
  fill: currentColor;
  stroke: none;
}

.fitana-player-ico-play {
  transform: translate(-46%, -50%);
}

.fitana-player-ico-pause,
.fitana-player-ico-check {
  display: none;
}

.fitana-player.is-playing .fitana-player-ico-play,
.fitana-player[data-cache-state="cached"] .fitana-player-ico-download {
  display: none;
}

.fitana-player.is-playing .fitana-player-ico-pause,
.fitana-player[data-cache-state="cached"] .fitana-player-ico-check {
  display: grid;
}

.fitana-player[data-cache-state="saving"] .fitana-player-cache span {
  width: 0.9rem;
  height: 0.9rem;
  border: 0.13rem solid rgba(255, 255, 255, 0.24);
  border-top-color: #fff;
  border-radius: 999px;
  animation: fitana-player-spin 0.8s linear infinite;
}

.fitana-player[data-cache-state="saving"] .fitana-player-cache span svg {
  display: none;
}

.fitana-player[data-cache-state="cached"] .fitana-player-cache {
  color: #fff;
  border-color: rgb(var(--accent-rgb) / 0.72);
  background: rgb(var(--accent-rgb) / 0.86);
}

.fitana-player[data-cache-state="error"] .fitana-player-cache {
  color: #fff;
  border-color: rgba(255, 255, 255, 0.44);
}

.fitana-player-cache-status {
  width: 4.2rem;
  min-width: 0;
  color: rgba(255, 255, 255, 0.72);
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 0.68rem;
  font-weight: 700;
  line-height: 2.25rem;
  text-align: left;
  white-space: nowrap;
}

.fitana-player[data-cache-state="cached"] .fitana-player-cache-status {
  color: #4ade80;
}

.fitana-player[data-cache-state="error"] .fitana-player-cache-status {
  color: rgba(255, 255, 255, 0.86);
}

.fitana-player-time {
  display: block;
  width: 2.9rem;
  color: rgba(255, 255, 255, 0.72);
  font-size: 0.76rem;
  font-variant-numeric: tabular-nums;
  text-align: center;
  direction: ltr;
  line-height: 2.25rem;
}

.fitana-player-seek-wrap {
  --seek-progress: 0%;
  position: relative;
  display: block;
  width: 100%;
  height: 2.25rem;
  min-width: 0;
}

.fitana-player-seek {
  position: absolute;
  inset: 0;
  z-index: 2;
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
  appearance: none;
  -webkit-appearance: none;
  background: transparent;
  cursor: pointer;
}

.fitana-player-seek-wrap::before,
.fitana-player-seek-fill {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  height: 0.28rem;
  border-radius: 999px;
  transform: translateY(-50%);
}

.fitana-player-seek-wrap::before {
  right: 0;
  background: rgba(255, 255, 255, 0.22);
}

.fitana-player-seek-fill {
  width: var(--seek-progress);
  background: #fff;
}

.fitana-player-seek::-webkit-slider-thumb {
  width: 1.25rem;
  height: 2.25rem;
  border: 0;
  appearance: none;
  -webkit-appearance: none;
  background: transparent;
}

.fitana-player-seek::-webkit-slider-runnable-track {
  height: 2.25rem;
  background: transparent;
}

.fitana-player-seek::-moz-range-track {
  height: 2.25rem;
  background: transparent;
}

.fitana-player-seek::-moz-range-thumb {
  width: 1.25rem;
  height: 2.25rem;
  border: 0;
  background: transparent;
}

.fitana-player-seek-knob {
  position: absolute;
  z-index: 1;
  left: var(--seek-progress);
  top: 50%;
  width: 0.78rem;
  height: 0.78rem;
  border: 2px solid #fff;
  border-radius: 999px;
  background: #111;
  transform: translate(-50%, -50%);
  pointer-events: none;
}

@keyframes fitana-player-spin {
  to {
    transform: rotate(360deg);
  }
}

@media (max-width: 420px) {
  .fitana-player-controls {
    grid-template-columns: 2.15rem 2.55rem minmax(0, 1fr) 2.55rem 2.15rem 2.15rem;
    gap: 0.24rem;
    padding-inline: 0.36rem;
  }

  .fitana-player-time {
    width: 2.55rem;
    font-size: 0.68rem;
  }

  .fitana-player-btn {
    width: 2.15rem;
    height: 2.15rem;
    border-radius: 0.55rem;
  }

  .fitana-player-cache-status {
    grid-column: 1 / -1;
    width: 100%;
    height: 0.9rem;
    line-height: 0.9rem;
    text-align: center;
  }
}

.ex-detail-h {
  margin: 0.85rem 0 0.4rem;
  font-size: 0.82rem;
  font-weight: 600;
  color: var(--accent);
  letter-spacing: 0.02em;
}

.ex-detail-desc {
  font-size: 0.91rem;
  line-height: 1.65;
  color: var(--detail-body);
}

.ex-composite-detail {
  margin-top: 0.75rem;
  --accent: var(--text);
  --accent-2: var(--muted);
  --accent-hover: var(--text);
  --ex-card-border: color-mix(in srgb, var(--text) 10%, transparent);
  --ex-card-hover-bd: color-mix(in srgb, var(--text) 18%, transparent);
  --tag-bg: color-mix(in srgb, var(--text) 5%, transparent);
  --tag-fg: var(--muted);
  --tag-bd: color-mix(in srgb, var(--text) 12%, transparent);
  --tag-acc-bg: color-mix(in srgb, var(--text) 5%, transparent);
  --tag-acc-fg: var(--muted);
  --tag-acc-bd: color-mix(in srgb, var(--text) 12%, transparent);
}

.ex-composite-detail-list {
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 0.55rem;
}

.ex-composite-detail-list li {
  position: relative;
  overflow: hidden;
  border: 1px solid var(--shell-line);
  border-radius: 0.65rem;
  background: color-mix(in srgb, var(--card) 96%, var(--surface));
  box-shadow: 0 0.45rem 1.15rem color-mix(in srgb, var(--ink) 5%, transparent);
  transition: background 0.14s ease, border-color 0.14s ease, box-shadow 0.14s ease;
}

.ex-composite-detail-list li:hover,
.ex-composite-detail-list li:focus-within {
  border-color: color-mix(in srgb, var(--text) 16%, var(--shell-line));
  background: color-mix(in srgb, var(--text) 4%, var(--card));
  box-shadow: 0 0.55rem 1.25rem color-mix(in srgb, var(--ink) 7%, transparent);
}

.ex-composite-detail-list li.is-open {
  border-color: color-mix(in srgb, var(--text) 18%, var(--shell-line));
  background: color-mix(in srgb, var(--text) 3%, var(--card));
}

.ex-composite-detail-toggle {
  width: 100%;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 0.55rem;
  align-items: center;
  padding: 0.66rem 0.72rem 0.42rem;
  margin: 0;
  border: 0 !important;
  border-radius: 0;
  background: transparent !important;
  background-image: none !important;
  color: inherit !important;
  text-align: right;
  font: inherit;
  cursor: pointer;
  box-shadow: none !important;
}

.ex-composite-detail-toggle:hover,
.ex-composite-detail-toggle:focus-visible {
  background: transparent !important;
  background-image: none !important;
  color: inherit !important;
  box-shadow: none !important;
}

.ex-composite-detail-title {
  min-width: 0;
  color: var(--detail-body);
  font-size: 0.91rem;
  font-weight: 750;
}

.ex-composite-detail-title small {
  display: block;
  margin-top: 0.12rem;
  color: var(--muted);
  font-size: 0.77rem;
  font-weight: 500;
}

.ex-composite-detail .ex-step-badge {
  background: color-mix(in srgb, var(--text) 8%, transparent);
  color: var(--text);
  border: 1px solid color-mix(in srgb, var(--text) 10%, transparent);
  box-shadow: none;
}

.ex-composite-detail-caret {
  display: inline-grid;
  place-items: center;
  width: 1.6rem;
  height: 1.6rem;
  border-radius: 0.48rem;
  color: var(--muted);
  background: color-mix(in srgb, var(--text) 7%, transparent);
  transition: transform 0.16s ease, color 0.16s ease;
}

.ex-composite-detail-item.is-open .ex-composite-detail-caret {
  transform: rotate(180deg);
  color: var(--text);
  background: color-mix(in srgb, var(--text) 9%, transparent);
}

.ex-external-links--composite {
  padding: 0 3.42rem 0.62rem 0.72rem;
  background: transparent;
}

.ex-external-links--composite .ex-external-link {
  inline-size: 1.45rem;
  block-size: 1.45rem;
  border-radius: 0.48rem;
  border-color: color-mix(in srgb, var(--text) 12%, transparent);
  background: color-mix(in srgb, var(--surface) 84%, transparent);
  color: var(--muted);
}

.ex-external-links--composite .ex-external-link:hover,
.ex-external-links--composite .ex-external-link:focus-visible {
  border-color: color-mix(in srgb, var(--text) 20%, transparent);
  background: color-mix(in srgb, var(--text) 6%, var(--surface));
  color: var(--text);
}

.ex-composite-preview-slot {
  display: block;
  padding: 0 0.72rem 0.72rem;
}

.ex-composite-preview-slot.hidden {
  display: none !important;
}

.ex-composite-preview-card .ex-card {
  margin: 0;
  cursor: default;
  border-color: transparent;
  background: transparent;
  box-shadow: none;
  transform: none;
  border-radius: 0;
  overflow: visible;
}

.ex-composite-preview-card .ex-card:hover,
.ex-composite-preview-card .ex-card:focus {
  border-color: transparent;
  box-shadow: none;
  transform: none;
}

.ex-composite-preview-card .ex-card::before {
  opacity: 0;
}

.ex-composite-preview-card .ex-card-inner {
  grid-template-columns: 4.2rem minmax(0, 1fr);
  gap: 0.56rem;
  padding: 0.1rem 0 0;
}

.ex-composite-preview-card .ex-card-media {
  border-radius: 0.55rem;
  padding: 0.22rem;
}

.ex-composite-preview-card .ex-card-play-mark {
  border-color: color-mix(in srgb, var(--text) 18%, transparent);
  background: color-mix(in srgb, var(--surface) 88%, transparent);
  color: var(--muted);
  filter: none;
}

.ex-composite-preview-card .ex-card-title {
  font-size: 0.88rem;
  line-height: 1.4;
}

.ex-composite-preview-card .ex-card-sub {
  font-size: 0.72rem;
  margin-bottom: 0.28rem;
}

.ex-composite-preview-card .tag-row,
.ex-composite-preview-card .ex-card-meta {
  max-block-size: 1.3rem;
}

.ex-composite-preview-card .tag-chip,
.ex-composite-preview-card .tag-chip-accent,
.ex-composite-preview-card .tag-chip-muted {
  border-color: color-mix(in srgb, var(--text) 12%, transparent);
  background: color-mix(in srgb, var(--text) 5%, transparent);
  color: var(--muted);
}

.ex-composite-preview-card .ex-card-meta {
  color: var(--muted);
}

.ex-composite-preview-card {
  position: relative;
  padding: 0.08rem 0 0;
  border-radius: 0;
  border: 0;
  background: transparent;
}

.ex-composite-preview-card .ex-fav-btn,
.ex-composite-preview-card .ex-card-edit-row {
  display: none;
}

.ex-composite-full-icon-btn {
  position: absolute;
  top: 0.08rem;
  left: 0;
  z-index: 2;
  width: 2rem;
  min-width: 2rem;
  height: 2rem;
  min-height: 2rem;
  margin: 0 !important;
  padding: 0 !important;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 0.55rem;
  border: 1px solid color-mix(in srgb, var(--text) 14%, transparent);
  background: color-mix(in srgb, var(--surface) 86%, transparent);
  color: var(--app-icon-mono);
  box-shadow: 0 8px 18px rgba(0, 0, 0, 0.18);
}

.ex-composite-full-icon-btn:hover,
.ex-composite-full-icon-btn:focus-visible {
  border-color: color-mix(in srgb, var(--text) 22%, var(--shell-line));
  background: color-mix(in srgb, var(--text) 6%, var(--surface));
  transform: translateY(-1px);
}

.ex-composite-preview-loading {
  padding: 0.25rem 0;
}

.ex-composite-detail-empty {
  margin: 0;
  padding: 0.75rem;
  text-align: center;
  border: 1px dashed color-mix(in srgb, var(--text) 16%, transparent);
  border-radius: 0.6rem;
}

.ex-detail-loading,
.ex-detail-error {
  padding: 1rem 0;
  text-align: center;
}

.ex-detail-error {
  color: var(--err);
}

.ex-detail-error-state {
  display: grid;
  justify-items: center;
  gap: 0.55rem;
  margin: 0.35rem 0;
  padding: 1rem;
  text-align: center;
  border: 1px solid color-mix(in srgb, var(--err) 24%, var(--shell-line));
  border-radius: 8px;
  background:
    linear-gradient(145deg, color-mix(in srgb, var(--err) 10%, transparent), transparent 58%),
    color-mix(in srgb, var(--surface-2) 88%, transparent);
}

.ex-detail-error-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2rem;
  height: 2rem;
  border-radius: 8px;
  color: var(--err);
  border: 1px solid color-mix(in srgb, var(--err) 28%, var(--shell-line));
  background: color-mix(in srgb, var(--err) 10%, transparent);
  font-weight: 900;
}

.ex-detail-error-state strong {
  color: var(--text);
  font-weight: 900;
}

.ex-detail-error-state p {
  margin: 0;
  color: var(--muted);
  font-size: 0.82rem;
  line-height: 1.65;
}

.ex-detail-error-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.45rem;
}

.ex-detail-error-retry,
.ex-detail-error-close {
  min-height: 2.35rem;
  padding-inline: 0.95rem;
  border-radius: 8px;
}

.ex-steps-list {
  margin: 0;
  padding: 0 0.85rem 0 0;
  list-style: none;
}

.ex-steps-list li {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 0.5rem;
  align-items: start;
  margin-bottom: 0.85rem;
  font-size: 0.89rem;
  line-height: 1.6;
}

.ex-step-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 1.65rem;
  height: 1.65rem;
  border-radius: 0.35rem;
  background: var(--step-bd-bg);
  color: var(--step-bd-fg);
  font-size: 0.76rem;
  font-weight: 700;
}

.ex-step-body {
  color: var(--step-txt);
}

/* جستجو: فیلتر، اسکرول بی‌نهایت، بوکمارک روی کارت */
.nav-tile.secondary-tile {
  background: transparent;
  border: 1px solid #413d4f;
  box-shadow: none;
  color: var(--accent);
}

.btn-inline-portal {
  margin-top: 0.5rem;
}

.search-filters-details {
  margin: 0.75rem 0 0.25rem;
  padding: 0.5rem 0.65rem;
  border-radius: 0.55rem;
  border: 1px solid var(--filter-wrap-bd);
  background: var(--filter-wrap-bg);
}

.search-filters-summary {
  cursor: pointer;
  font-weight: 600;
  color: var(--accent);
  font-size: 0.92rem;
}

.search-filters-summary::-webkit-details-marker {
  display: none;
}

.filter-section {
  margin-top: 0.75rem;
}

.filter-section:first-of-type {
  margin-top: 0.35rem;
}

.filter-section-title {
  display: block;
  font-size: 0.78rem;
  color: var(--muted);
  margin-bottom: 0.4rem;
  font-weight: 500;
}

.filter-chip-scroll {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
  max-height: 6.5rem;
  overflow-y: auto;
  padding-bottom: 0.15rem;
}

.filter-chip {
  width: auto !important;
  margin: 0 !important;
  padding: 0.32rem 0.55rem !important;
  font-size: 0.76rem !important;
  font-weight: 500;
  background: var(--filt-chip-bg);
  border: 1px solid var(--filt-chip-bd);
  color: var(--text);
  border-radius: 999px;
  cursor: pointer;
  line-height: 1.3;
  box-shadow: none;
}

.filter-chip:hover {
  border-color: var(--accent);
}

.filter-chip.is-on {
  border-color: var(--accent);
  background: var(--filt-chip-on-bg);
  color: var(--filt-chip-on-fg);
}

.search-scroll-hint {
  min-height: 1.3em;
  margin-top: 0.4rem;
}

.search-scroll-hint.err {
  color: var(--err);
}

.search-scroll-retry {
  width: auto;
  min-height: 1.85rem;
  margin-inline-start: 0.45rem;
  padding: 0.28rem 0.68rem;
  border: 1px solid color-mix(in srgb, var(--accent) 34%, var(--control-line));
  border-radius: 0.5rem;
  background: color-mix(in srgb, var(--accent) 8%, var(--surface));
  color: var(--accent);
  font-size: 0.72rem;
  font-weight: 850;
  box-shadow: none;
}

.search-scroll-retry:hover,
.search-scroll-retry:focus-visible {
  background: color-mix(in srgb, var(--accent) 14%, var(--surface));
  transform: none;
}

.search-scroll-sentinel {
  height: 2px;
  margin-top: 0.25rem;
  pointer-events: none;
  visibility: hidden;
}

.favorites-empty-msg {
  margin-bottom: 0.5rem;
}

.app-empty-state {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.7rem;
  padding: 1.1rem 0.95rem;
  text-align: center;
  border-radius: calc(var(--radius) + 0.1rem);
  border: 1px dashed rgb(var(--accent-rgb) / 0.28);
  background:
    radial-gradient(circle at 50% 0%, rgb(var(--accent-rgb) / 0.12), transparent 64%),
    rgb(var(--accent-rgb) / 0.055);
}

.app-empty-state--nested {
  margin: 0.35rem 0 0.15rem;
  padding: 0.5rem 0 0.25rem;
  border: none;
  background: transparent;
}

.app-empty-state--in-results {
  margin: 0.55rem 0 0.35rem;
}

.card.app-empty-state {
  background:
    radial-gradient(circle at 50% 0%, rgb(var(--accent-rgb) / 0.12), transparent 64%),
    var(--card);
  border: 1px solid rgb(var(--accent-rgb) / 0.18);
}

html[data-theme="light"] .card.app-empty-state {
  border-color: rgba(19, 18, 26, 0.1);
  box-shadow: 0 1px 3px rgba(19, 18, 26, 0.06);
}

.app-empty-state-text {
  margin: 0;
  max-width: 22rem;
  line-height: 1.55;
}

.app-empty-state-copy {
  display: grid;
  gap: 0.25rem;
  justify-items: center;
}

.app-empty-state-title {
  margin: 0;
  color: var(--text);
  font-size: 0.95rem;
  font-weight: 700;
  line-height: 1.45;
}

.app-empty-state-illustration {
  width: 5.5rem;
  height: 5.5rem;
  opacity: 0.82;
}

.app-empty-state-illustration--sm {
  width: 4.25rem;
  height: 4.25rem;
  opacity: 0.78;
}

.app-empty-state-action {
  width: auto;
  min-width: min(11rem, 100%);
  margin-top: 0.15rem;
  padding: 0.55rem 0.95rem;
  border-radius: 999px;
  border: 1px solid rgb(var(--accent-rgb) / 0.35);
  background: rgb(var(--accent-rgb) / 0.12);
  color: var(--text);
  font: inherit;
  font-size: 0.86rem;
  font-weight: 700;
  text-decoration: none;
  cursor: pointer;
}

.app-empty-state-action:hover,
.app-empty-state-action:focus-visible {
  border-color: rgb(var(--accent-rgb) / 0.62);
  background: rgb(var(--accent-rgb) / 0.18);
}

.favorites-toolbar {
  padding: 0 0.15rem;
  min-height: 1.2em;
}

.favorites-results-pad {
  margin-top: 0.35rem;
}

.ex-fav-btn {
  position: absolute;
  top: 0.4rem;
  inset-inline-start: 0.4rem;
  z-index: 3;
  width: 1.8rem;
  height: 1.8rem;
  margin: 0 !important;
  padding: 0 !important;
  border-radius: 999px;
  border: 1px solid color-mix(in srgb, #fff 24%, var(--ex-fav-bd));
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.2), rgba(255, 255, 255, 0.035) 42%, rgba(255, 255, 255, 0.12)),
    color-mix(in srgb, var(--ex-fav-bg) 72%, transparent);
  -webkit-backdrop-filter: blur(12px) saturate(1.35);
  backdrop-filter: blur(12px) saturate(1.35);
  color: color-mix(in srgb, var(--accent) 72%, var(--text));
  font-size: 0.92rem;
  line-height: 1;
  cursor: pointer;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.2),
    inset 0 -1px 0 rgba(255, 255, 255, 0.06),
    0 0.55rem 1.2rem var(--ex-fav-shadow);
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.ex-fav-svg {
  display: block;
  flex-shrink: 0;
}

.ex-fav-btn:hover {
  color: var(--accent-hover);
  border-color: color-mix(in srgb, var(--accent) 52%, rgba(255, 255, 255, 0.22));
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.24), rgba(255, 255, 255, 0.05) 42%, rgb(var(--accent-rgb) / 0.18)),
    color-mix(in srgb, var(--accent) 12%, var(--ex-fav-bg));
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.24),
    inset 0 -1px 0 rgba(255, 255, 255, 0.08),
    0 0.65rem 1.35rem color-mix(in srgb, var(--accent) 16%, var(--ex-fav-shadow));
}

.ex-fav-btn[aria-pressed="true"] {
  color: #c2410c;
  border-color: color-mix(in srgb, #c2410c 54%, rgba(255, 255, 255, 0.2));
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.22), rgba(255, 255, 255, 0.04) 42%, rgba(194, 65, 12, 0.2)),
    color-mix(in srgb, #c2410c 16%, var(--ex-fav-bg));
}

.ex-card-plan-add-btn {
  position: absolute;
  top: 0.4rem;
  inset-inline-end: 0.4rem;
  z-index: 3;
  width: 1.55rem;
  height: 1.55rem;
  min-height: 1.55rem;
  margin: 0 !important;
  padding: 0 !important;
  display: inline-grid;
  place-items: center;
  border-radius: 0.42rem;
  border: 1px solid color-mix(in srgb, #fff 18%, var(--line, rgba(163, 160, 173, 0.28)));
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.18), rgba(255, 255, 255, 0.035) 46%, rgba(255, 255, 255, 0.1)),
    color-mix(in srgb, var(--card) 68%, transparent);
  -webkit-backdrop-filter: blur(12px) saturate(1.35);
  backdrop-filter: blur(12px) saturate(1.35);
  color: color-mix(in srgb, #fff 72%, var(--muted));
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.18),
    inset 0 -1px 0 rgba(255, 255, 255, 0.06),
    0 0.5rem 1.05rem color-mix(in srgb, var(--ink, #000) 25%, transparent);
  cursor: pointer;
}

.ex-card-plan-add-btn svg {
  width: 1rem;
  height: 1rem;
  fill: none;
  stroke: currentColor;
  stroke-width: 2.4;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.ex-card-plan-add-btn:hover,
.ex-card-plan-add-btn:focus-visible {
  color: var(--text);
  border-color: color-mix(in srgb, var(--accent) 44%, rgba(255, 255, 255, 0.22));
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.22), rgba(255, 255, 255, 0.05) 46%, rgb(var(--accent-rgb) / 0.16)),
    color-mix(in srgb, var(--surface-2, var(--card)) 70%, transparent);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.22),
    inset 0 -1px 0 rgba(255, 255, 255, 0.08),
    0 0.6rem 1.2rem color-mix(in srgb, var(--accent) 12%, var(--ink, #000));
}

.exercise-modal-fav {
  color: color-mix(in srgb, var(--accent) 72%, var(--text));
}

.exercise-modal-fav[aria-pressed="true"] {
  color: #c2410c;
  border-color: color-mix(in srgb, #c2410c 54%, transparent);
  background: color-mix(in srgb, #c2410c 12%, var(--control-bg, var(--modal-x-bg)));
}

.exercise-modal-fav:hover {
  background: color-mix(in srgb, var(--accent) 12%, var(--control-bg, var(--modal-x-bg)));
}

.exercise-modal-fav.hidden {
  display: none !important;
}

.exercise-modal-report {
  color: color-mix(in srgb, var(--warn, #f59e0b) 72%, var(--text));
}

.exercise-modal-report:hover {
  background: color-mix(in srgb, var(--warn, #f59e0b) 12%, var(--control-bg, var(--modal-x-bg)));
}

.exercise-modal-report.hidden {
  display: none !important;
}

.exercise-modal-report-svg {
  display: block;
}

.exercise-report-modal {
  position: fixed;
  inset: 0;
  z-index: 12100;
  display: flex;
  align-items: flex-end;
  justify-content: center;
}

.exercise-report-modal.hidden {
  display: none !important;
}

.exercise-report-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(7, 6, 10, 0.68);
  backdrop-filter: blur(5px);
}

.exercise-report-panel {
  position: relative;
  width: 100%;
  max-width: min(var(--app-shell-max), 38rem);
  max-height: min(86vh, 620px);
  min-height: min(31rem, 82vh);
  overflow: hidden;
  margin: 0 auto;
  padding: 0;
  background: linear-gradient(180deg, #151d2e 0%, #101626 100%);
  border: 1px solid #2c2a36;
  border-radius: 1rem 1rem 0 0;
  box-shadow: 0 -8px 40px rgba(0, 0, 0, 0.48);
  color: var(--text);
  animation: sheetUp 0.24s ease-out;
  display: flex;
  flex-direction: column;
}

.exercise-report-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.75rem;
  padding: 0.95rem 1rem 0.75rem;
  border-bottom: 1px solid var(--modal-head-bd);
  flex: 0 0 auto;
  background: inherit;
}

.exercise-report-head h3 {
  margin: 0;
  font-size: 1rem;
  line-height: 1.4;
}

.exercise-report-head p {
  margin: 0.2rem 0 0;
  color: var(--muted);
  font-size: 0.82rem;
  line-height: 1.6;
}

.exercise-report-close {
  background: var(--modal-x-bg);
  color: var(--app-icon-mono);
  font-size: 1.2rem;
}

.exercise-report-form {
  min-height: 0;
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
}

.exercise-report-scroll {
  min-height: 0;
  flex: 1 1 auto;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  display: grid;
  align-content: start;
  gap: 0.85rem;
  padding: 0.85rem 1rem;
}

.exercise-report-options {
  display: grid;
  gap: 0.5rem;
}

.exercise-report-option {
  display: flex;
  align-items: center;
  gap: 0.55rem;
  min-height: 2.75rem;
  padding: 0.55rem 0.7rem;
  border: 1px solid var(--control-line);
  border-radius: 0.6rem;
  background: color-mix(in srgb, var(--surface-2, #16151d) 82%, transparent);
  color: var(--text);
}

.exercise-report-option input {
  min-height: auto;
  width: 1rem;
  height: 1rem;
  accent-color: var(--accent);
}

.exercise-report-note {
  display: grid;
  gap: 0.4rem;
  color: var(--muted);
  font-size: 0.86rem;
}

.exercise-report-note textarea {
  resize: vertical;
  min-height: 5.6rem;
  max-height: 10rem;
  color: var(--text);
}

.exercise-report-foot {
  flex: 0 0 auto;
  display: grid;
  gap: 0.55rem;
  padding: 0.7rem 1rem calc(0.9rem + env(safe-area-inset-bottom, 0px));
  border-top: 1px solid var(--modal-head-bd);
  background: inherit;
  box-shadow: 0 -0.8rem 1.4rem rgba(0, 0, 0, 0.1);
}

.exercise-report-msg {
  min-height: 1.2rem;
  color: var(--muted);
  font-size: 0.82rem;
  line-height: 1.5;
}

.exercise-report-msg.is-error {
  color: var(--err);
}

.exercise-report-actions {
  display: grid;
  grid-template-columns: 1fr 1.4fr;
  gap: 0.6rem;
}

.search-add-plan-modal.hidden {
  display: none !important;
}

.search-add-plan-modal {
  position: fixed;
  inset: 0;
  z-index: 12000;
  display: grid;
  place-items: center;
  padding: max(1rem, env(safe-area-inset-top)) 1rem max(1rem, env(safe-area-inset-bottom));
}

.search-add-plan-backdrop {
  position: absolute;
  inset: 0;
  background: color-mix(in srgb, #08070b 58%, transparent);
  backdrop-filter: blur(8px);
}

.search-add-plan-panel {
  position: relative;
  z-index: 1;
  width: min(29rem, 100%);
  max-height: min(38rem, calc(100vh - 2rem));
  overflow: hidden;
  display: grid;
  grid-template-rows: auto auto minmax(0, 1fr) auto;
  gap: 0;
  border: 1px solid var(--shell-line);
  border-radius: 0.85rem;
  background: var(--card);
  color: var(--text);
  box-shadow: 0 1.3rem 3rem color-mix(in srgb, var(--ink, #000) 26%, transparent);
}

.search-add-plan-head {
  position: sticky;
  top: 0;
  z-index: 2;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.75rem;
  padding: 0.95rem 0.95rem 0.6rem;
  background: color-mix(in srgb, var(--card) 94%, var(--surface-2, var(--card)));
}

.search-add-plan-kicker {
  margin: 0 0 0.16rem;
  color: var(--muted);
  font-size: 0.74rem;
  font-weight: 750;
}

.search-add-plan-head h2 {
  margin: 0;
  font-size: 1rem;
  line-height: 1.35;
}

.search-add-plan-close {
  width: 2rem;
  min-height: 2rem;
  height: 2rem;
  margin: 0;
  padding: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 0.55rem;
  border: 1px solid var(--control-line);
  background: var(--modal-x-bg);
  color: var(--app-icon-mono);
  box-shadow: none;
  font-size: 1.25rem;
  line-height: 1;
}

.search-add-plan-close:hover,
.search-add-plan-close:focus-visible {
  background: rgba(255, 122, 122, 0.2);
  color: var(--err);
}

.search-add-plan-exercise {
  position: sticky;
  top: 0;
  z-index: 2;
  margin: 0 0.95rem 0.75rem;
  padding: 0.55rem 0.65rem;
  border: 1px solid color-mix(in srgb, var(--line, rgba(163, 160, 173, 0.22)) 78%, transparent);
  border-radius: 0.65rem;
  background: color-mix(in srgb, var(--surface-2, var(--card)) 70%, transparent);
  color: var(--text);
  font-weight: 750;
}

.search-add-plan-body {
  min-height: 0;
  overflow-y: auto;
  display: grid;
  gap: 0.65rem;
  padding: 0 0.95rem 0.9rem;
  -webkit-overflow-scrolling: touch;
}

.search-add-plan-create,
.search-add-plan-session-wrap,
.search-add-plan-list,
.search-add-plan-sessions {
  display: grid;
  gap: 0.65rem;
}

.search-add-plan-choice,
.search-add-plan-sessions label {
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 0.55rem;
  min-height: 2.85rem;
  width: 100%;
  margin: 0;
  border: 1px solid color-mix(in srgb, var(--line, rgba(163, 160, 173, 0.25)) 82%, transparent);
  border-radius: 0.65rem;
  padding: 0.55rem 0.65rem;
  background: color-mix(in srgb, var(--surface-2, var(--card)) 88%, var(--app-bg, #0e0d12)) !important;
  background-image: none !important;
  color: var(--text) !important;
  box-shadow: none !important;
  text-align: right;
}

.search-add-plan-choice {
  grid-template-columns: 1fr auto;
  justify-items: stretch;
}

.search-add-plan-choice:hover,
.search-add-plan-choice:focus-visible,
.search-add-plan-sessions label:hover,
.search-add-plan-sessions label:focus-within {
  border-color: color-mix(in srgb, var(--line, rgba(163, 160, 173, 0.34)) 70%, var(--text));
  background: color-mix(in srgb, var(--surface-2, var(--card)) 78%, var(--app-bg, #0e0d12)) !important;
  color: var(--text) !important;
}

.search-add-plan-sessions label:has(input:checked) {
  border-color: color-mix(in srgb, var(--accent) 30%, var(--line, rgba(163, 160, 173, 0.3)));
  background:
    linear-gradient(145deg, color-mix(in srgb, var(--accent) 7%, transparent), transparent 62%),
    color-mix(in srgb, var(--surface-2, var(--card)) 84%, var(--app-bg, #0e0d12)) !important;
}

.search-add-plan-choice small,
.search-add-plan-sessions small {
  color: var(--muted);
  font-size: 0.72rem;
}

.search-add-plan-sessions input {
  accent-color: color-mix(in srgb, var(--accent) 45%, var(--muted));
}

.search-add-plan-sessions label.is-present {
  opacity: 0.68;
}

.search-add-plan-create label,
.search-add-plan-plan-title {
  margin: 0;
  font-weight: 850;
}

.search-add-plan-actions {
  display: flex;
  gap: 0.55rem;
  justify-content: flex-end;
}

.search-add-plan-primary,
.search-add-plan-secondary {
  min-height: 2.55rem;
}

.search-add-plan-msg {
  min-height: 1.25em;
  margin: 0;
  padding: 0 0.95rem 0.85rem;
}

.search-add-plan-msg.is-err {
  color: #ef4444;
}

.search-add-plan-loading {
  padding: 1rem;
  color: var(--muted);
  text-align: center;
}

/* نوار پایین — ارتفاع ثابت؛ فقط آیکن؛ مرکز تمرین */
.app-bottom-nav {
  position: fixed;
  inset-inline: 0;
  bottom: max(0.55rem, env(safe-area-inset-bottom));
  z-index: var(--layer-bottom-navigation);
  width: min(calc(100% - 1rem), var(--app-shell-max));
  max-width: none;
  margin-inline: auto;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  gap: 0.22rem;
  height: calc(var(--bottom-nav-height) - 0.12rem);
  box-sizing: border-box;
  padding-inline: 0.42rem;
  padding-block: 0.34rem max(8px, env(safe-area-inset-bottom));
  background: linear-gradient(180deg, rgba(22, 21, 29, 0.78), rgba(9, 8, 12, 0.92));
  border: 1px solid rgba(163, 160, 173, 0.15);
  border-radius: 1.25rem;
  box-shadow: 0 14px 44px rgba(0, 0, 0, 0.36);
  backdrop-filter: blur(18px) saturate(1.15);
}

.app-bottom-nav.hidden,
[hidden].app-bottom-nav {
  display: none !important;
}

body.keyboard-open .app-bottom-nav {
  pointer-events: none;
  transform: translateY(calc(100% + max(1rem, env(safe-area-inset-bottom))));
}

.app-bottom-nav button.app-nav-btn {
  --nav-item-color: #a3a0ad;
  --nav-item-glow: rgb(var(--accent-rgb) / 0.16);
  --nav-item-bg: rgba(163, 160, 173, 0.08);
  --nav-icon-filter: brightness(0) saturate(100%) invert(70%) sepia(13%) saturate(500%) hue-rotate(176deg)
    brightness(91%) contrast(86%);
  flex: 1 1 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0;
  height: calc(var(--bottom-nav-height) - 0.9rem - max(8px, env(safe-area-inset-bottom)));
  max-height: 2.75rem;
  min-width: 0;
  margin: 0 !important;
  padding: 0 !important;
  border: none;
  border-radius: 999px;
  background: transparent;
  color: var(--muted);
  font-family: inherit;
  cursor: pointer;
  box-shadow: none;
  line-height: 1;
  transition: color 0.16s ease, background 0.16s ease, transform 0.14s ease;
}

.app-bottom-nav #nav-home {
  --nav-item-color: var(--accent-soft);
  --nav-item-glow: rgb(var(--accent-soft-rgb) / 0.2);
  --nav-item-bg: rgb(var(--accent-soft-rgb) / 0.09);
}

.app-bottom-nav #nav-favorites {
  --nav-item-color: #fed7aa;
  --nav-item-glow: rgba(254, 215, 170, 0.18);
  --nav-item-bg: rgba(254, 215, 170, 0.09);
}

.app-bottom-nav #nav-workout {
  --nav-item-color: #fed7aa;
  --nav-item-glow: rgb(var(--accent-rgb) / 0.28);
  --nav-item-bg: linear-gradient(135deg, rgb(var(--accent-rgb) / 0.18), rgb(var(--accent-rgb) / 0.1));
  flex-grow: 1.16;
  transform: translateY(-0.12rem);
  height: calc(var(--bottom-nav-height) - 0.68rem - max(8px, env(safe-area-inset-bottom)));
  max-height: 2.95rem;
  background: var(--nav-item-bg);
  border: 1px solid rgb(var(--accent-rgb) / 0.2);
  box-shadow: 0 8px 22px rgb(var(--accent-rgb) / 0.14);
}

.app-bottom-nav #nav-search {
  --nav-item-color: var(--accent-hover);
  --nav-item-glow: rgb(var(--accent-hover-rgb) / 0.18);
  --nav-item-bg: rgb(var(--accent-hover-rgb) / 0.09);
}

.app-bottom-nav #nav-profile {
  --nav-item-color: #fed7aa;
  --nav-item-glow: rgba(254, 215, 170, 0.16);
  --nav-item-bg: rgba(254, 215, 170, 0.08);
}

.app-bottom-nav button.app-nav-btn:hover {
  background: var(--nav-item-bg);
  transform: translateY(-1px);
}

.app-bottom-nav #nav-workout:hover {
  transform: translateY(-0.18rem);
}

.app-bottom-nav button.app-nav-btn svg {
  flex-shrink: 0;
  opacity: 0.9;
}

.app-bottom-nav button.app-nav-btn-workout .app-nav-icon-img {
  width: 1.78rem;
  height: 1.78rem;
}

.app-nav-icon-img {
  width: 1.62rem;
  height: 1.62rem;
  object-fit: contain;
  display: block;
}

/*
  رویهٔ آیکن‌ها: تم تاریک سفید، تم روشن سیاه (تضاد ثابت).
  - تصویرهای UI از /app/assets/: --app-ui-icon-img-filter
  - SVG با stroke/fill = currentColor: --app-icon-mono / --app-icon-mono-soft
  (بوکمارک ذخیره‌شده و دکمهٔ حذفٔ قرمز طبق قبلی رنگ معنادار می‌مانند.)
*/
.app-nav-icon-img,
.portal-tile-icon-img,
.stats-hub-action-btn .portal-tile-icon-img,
.plan-src-tab-icon-img,
.plan-hub-visual-img,
.workout-hub-empty-icon,
.app-empty-state-illustration,
.plan-edit-icon,
.plan-notes-icon {
  filter: var(--app-ui-icon-img-filter);
}

.app-bottom-nav .app-nav-icon-img {
  filter: var(--nav-icon-filter);
  opacity: 0.96;
}

.app-bottom-nav button.app-nav-btn.is-active {
  color: #ffffff;
  background: linear-gradient(135deg, rgb(var(--accent-rgb) / 0.82), rgb(var(--accent-rgb) / 0.7));
  box-shadow: 0 10px 24px var(--nav-item-glow), 0 4px 18px rgb(var(--accent-rgb) / 0.14);
}

.app-bottom-nav button.app-nav-btn.is-active svg {
  opacity: 1;
  stroke-width: 2.45;
  filter: drop-shadow(0 0 8px rgb(var(--accent-rgb) / 0.38));
}

.app-bottom-nav button.app-nav-btn.is-active .app-nav-icon-img {
  opacity: 1;
  filter: brightness(0) invert(1);
}

.app-bottom-nav #nav-workout.is-active {
  transform: translateY(-0.18rem);
  box-shadow: 0 12px 28px var(--nav-item-glow), 0 6px 18px rgb(var(--accent-rgb) / 0.16);
}

.app-nav-label {
  display: none !important;
}

.search-bottom-sheet {
  position: fixed;
  inset-inline: 0;
  bottom: calc(var(--bottom-nav-height) + max(12px, env(safe-area-inset-bottom)));
  z-index: 10041;
  max-width: var(--app-shell-max);
  margin-inline: auto;
  pointer-events: auto;
}

.search-bottom-sheet.hidden {
  display: none !important;
}

body.search-filter-floating .search-bottom-sheet {
  inset-inline: auto;
  inset-inline-end: max(var(--app-shell-pad), calc((100vw - var(--app-shell-max)) / 2 + var(--app-shell-pad)));
  bottom: calc(var(--bottom-nav-height) + max(18px, env(safe-area-inset-bottom)) + 1rem);
  max-width: none;
  width: auto;
  margin-inline: 0;
  pointer-events: none;
}

body.keyboard-open.search-filter-floating .search-bottom-sheet,
body.keyboard-open.search-filter-floating .search-bottom-sheet.search-sheet-expanded {
  bottom: max(0.5rem, env(safe-area-inset-bottom));
}

body.search-filter-floating .search-bottom-sheet.search-sheet-expanded {
  inset-inline: 0;
  bottom: calc(var(--bottom-nav-height) + max(12px, env(safe-area-inset-bottom)));
  max-width: var(--app-shell-max);
  width: auto;
  margin-inline: auto;
  pointer-events: auto;
}

.search-sheet-toggle {
  width: 100%;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: flex-start;
  gap: 0.55rem;
  min-height: var(--search-bar-height);
  padding: 0.35rem 0.95rem;
  margin: 0 !important;
  border-radius: 1.05rem 1.05rem 0 0;
  border: 1px solid var(--sheet-toggle-bd);
  border-bottom: none;
  background: var(--sheet-toggle-bg);
  color: var(--text);
  font-family: inherit;
  font-size: inherit;
  cursor: pointer;
  box-shadow: 0 -6px 24px var(--sheet-toggle-shadow);
}

body.search-filter-floating .search-sheet-toggle {
  width: auto;
  min-height: 3.15rem;
  padding: 0.44rem 0.82rem;
  border-radius: 999px;
  border-bottom: 1px solid var(--sheet-toggle-bd);
  background: linear-gradient(180deg, rgb(var(--accent-rgb) / 0.96), rgb(var(--accent-rgb) / 0.96));
  color: #fff;
  box-shadow: 0 10px 26px rgb(var(--accent-rgb) / 0.38), 0 2px 10px rgba(0, 0, 0, 0.26);
  pointer-events: auto;
}


.search-sheet-toggle .icon-wrap {
  display: inline-flex;
  color: currentColor;
}

.search-sheet-toggle-text {
  flex: 1;
  text-align: start;
  font-weight: 650;
  font-size: 0.9rem;
}

body.search-filter-floating .search-sheet-toggle-text {
  flex: 0 0 auto;
  font-size: 0.84rem;
  white-space: nowrap;
}

body.search-filter-floating .search-bottom-sheet.search-sheet-expanded .search-sheet-toggle-text {
  flex: 1;
  font-size: 0.9rem;
}

.search-sheet-bar {
  display: contents;
}

.search-sheet-close {
  display: none;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 2.35rem;
  height: 2.35rem;
  margin: 0;
  padding: 0;
  border: 1px solid rgba(163, 160, 173, 0.18);
  border-radius: 0.78rem;
  background: color-mix(in srgb, var(--surface) 88%, transparent) !important;
  color: var(--app-icon-mono);
  cursor: pointer;
  box-shadow: none;
  transition: background 0.18s ease, border-color 0.18s ease, color 0.18s ease, opacity 0.18s ease, transform 0.15s ease;
}

.search-sheet-close:hover {
  border-color: rgb(var(--accent-rgb) / 0.28);
  background: color-mix(in srgb, var(--surface) 78%, rgb(var(--accent-rgb) / 0.12)) !important;
  color: var(--text);
}

.search-sheet-close svg {
  display: none;
}

.search-sheet-close::before {
  content: "";
  display: block;
  width: 1rem;
  height: 1rem;
  background:
    linear-gradient(45deg, transparent 43%, #332f3e 45% 55%, transparent 57%),
    linear-gradient(-45deg, transparent 43%, #332f3e 45% 55%, transparent 57%);
}

html[data-theme="light"] .search-sheet-close {
  color: #211f2a;
  border-color: rgba(19, 18, 26, 0.11);
  background: rgba(255, 255, 255, 0.88) !important;
}

.search-sheet-close:active {
  opacity: 0.72;
  transform: scale(0.96);
}

body.search-filter-floating .search-sheet-bar {
  display: block;
  pointer-events: none;
}

body.search-filter-floating .search-sheet-toggle {
  pointer-events: auto;
}

body.search-filter-floating .search-bottom-sheet.search-sheet-expanded .search-sheet-bar {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  width: 100%;
  min-height: var(--search-bar-height);
  padding: 0.32rem 0.55rem 0.28rem 0.65rem;
  box-sizing: border-box;
  pointer-events: auto;
  border-radius: 1.05rem 1.05rem 0 0;
  border: 1px solid var(--sheet-toggle-bd);
  border-bottom: none;
  background: var(--sheet-toggle-bg);
  box-shadow: 0 -6px 24px var(--sheet-toggle-shadow);
}

body.search-filter-floating .search-bottom-sheet.search-sheet-expanded .search-sheet-toggle {
  display: none;
}

body.search-filter-floating .search-bottom-sheet.search-sheet-expanded .search-sheet-bar {
  justify-content: flex-end;
}

body.search-filter-floating .search-bottom-sheet.search-sheet-expanded .search-sheet-close {
  display: inline-flex;
}

.search-sheet-panel {
  border: 1px solid var(--sheet-panel-bd);
  border-top: 1px solid var(--sheet-inner-top);
  background: var(--sheet-panel-bg);
  max-height: min(50vh, 24rem);
  overflow-y: auto;
  overflow-x: hidden;
  -webkit-overflow-scrolling: touch;
}

body.search-filter-floating .search-bottom-sheet.search-sheet-expanded .search-sheet-panel {
  border-radius: 0 0 1.05rem 1.05rem;
  box-shadow: 0 -8px 30px rgba(0, 0, 0, 0.32);
}

.search-sheet-panel .search-filters-inner > button:not(.lib-search-submit-btn),
.search-sheet-panel .search-filters-inner .lib-search-more-body > button {
  width: 100%;
}

.search-filters-inner {
  padding: 0.72rem 0.78rem 0.78rem;
}

.lib-search-section {
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
}

.lib-search-section + .lib-search-section,
.lib-search-section + .lib-search-more,
.lib-search-more + .lib-search-actions-row {
  margin-top: 0.5rem;
}

.lib-search-simple-section {
  background: rgba(255, 255, 255, 0.045);
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 0.35rem;
}

html[data-theme="light"] .lib-search-simple-section {
  background: rgba(255, 255, 255, 0.72);
}

.lib-search-field-label,
.lib-search-section-title {
  display: block;
  margin: 0 0 0.55rem;
  font-weight: 800;
  font-size: 0.9rem;
  color: var(--text);
}

.lib-search-q-input {
  width: 100%;
  box-sizing: border-box;
  min-height: 2.4rem;
  margin: 0;
}

.lib-search-help-text {
  display: none;
  margin-top: 0;
  color: var(--muted);
  font-size: 0.72rem;
  line-height: 1.45;
}

.lib-search-submit-btn {
  width: 100% !important;
  min-height: 2.5rem;
  padding-inline: 1rem;
  white-space: nowrap;
}

.lib-search-actions-row {
  position: sticky;
  bottom: 0;
  z-index: 1;
  display: grid;
  grid-template-columns: minmax(0, 0.72fr) minmax(0, 1.28fr);
  gap: 0.5rem;
  margin-top: 0.72rem;
  padding: 0.72rem 0 0.05rem;
  border-top: 1px solid color-mix(in srgb, var(--sheet-inner-top) 78%, transparent);
  background: linear-gradient(180deg, rgba(0, 0, 0, 0), var(--sheet-panel-bg) 26%);
}

.lib-search-actions-row button {
  min-height: 2.5rem;
  margin: 0;
  border-radius: 0.78rem;
  box-shadow: none;
}

.lib-search-actions-row #btn-search-reset {
  border-color: rgba(163, 160, 173, 0.18);
  background: color-mix(in srgb, var(--surface) 90%, transparent) !important;
  color: var(--muted);
}

.lib-search-actions-row #btn-search-reset:hover,
.lib-search-actions-row #btn-search-reset:focus-visible {
  border-color: rgba(163, 160, 173, 0.28);
  background: color-mix(in srgb, var(--surface) 80%, rgba(163, 160, 173, 0.1)) !important;
  color: var(--text);
}

.lib-search-actions-row .lib-search-submit-btn {
  border-color: rgb(var(--accent-rgb) / 0.24);
  background: color-mix(in srgb, var(--surface) 76%, rgb(var(--accent-rgb) / 0.2)) !important;
  background-image: none !important;
  color: var(--text);
}

.lib-search-actions-row .lib-search-submit-btn:hover,
.lib-search-actions-row .lib-search-submit-btn:focus-visible {
  border-color: rgb(var(--accent-rgb) / 0.36);
  background: color-mix(in srgb, var(--surface) 68%, rgb(var(--accent-rgb) / 0.26)) !important;
}

.lib-search-more {
  border-radius: 0.78rem;
  border: 1px solid var(--sheet-inner-top);
  background: rgba(0, 0, 0, 0.11);
  overflow: hidden;
}

html[data-theme="light"] .lib-search-more {
  background: rgba(19, 18, 26, 0.04);
}

.lib-search-more-summary {
  cursor: pointer;
  list-style: none;
  padding: 0.58rem 0.65rem;
  font-weight: 800;
  font-size: 0.82rem;
  color: var(--text);
}

.lib-search-more[open] .lib-search-more-summary {
  border-bottom: 1px solid rgb(var(--accent-rgb) / 0.13);
}

.lib-search-more-summary::after {
  content: "⌄";
  float: left;
  display: inline-block;
  color: var(--muted);
  transform: translateY(-1px);
}

.lib-search-more[open] .lib-search-more-summary::after {
  transform: rotate(180deg);
}

.lib-search-more-summary::-webkit-details-marker {
  display: none;
}

.lib-search-more-body {
  padding: 0.58rem;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.search-top-filter-card {
  display: grid;
  gap: 0.58rem;
  width: 100%;
  box-sizing: border-box;
  padding: 0.62rem;
  margin: 0 0 0.72rem;
  border: 1px solid var(--shell-line);
  border-radius: 0.62rem;
  background: color-mix(in srgb, var(--surface) 88%, transparent);
  box-shadow: 0 0.7rem 1.7rem color-mix(in srgb, var(--ink) 7%, transparent);
}

.search-top-query-row {
  position: relative;
  display: flex;
  align-items: center;
  min-width: 0;
}

.search-top-query-icon {
  position: absolute;
  left: 0.58rem;
  top: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2rem;
  height: 2rem;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0.5rem;
  background: transparent !important;
  box-shadow: none !important;
  color: color-mix(in srgb, var(--text) 76%, var(--muted));
  transform: translateY(-50%);
  z-index: 3;
  pointer-events: auto;
}

.plan-pick-filter-card .search-top-query-icon,
html:not([data-theme="light"]) .search-top-query-icon {
  color: #e5e7eb;
}

.search-top-query-icon svg {
  display: block;
  width: 1.1rem;
  height: 1.1rem;
  stroke: currentColor;
}

.search-top-query-icon:hover,
.search-top-query-icon:focus-visible {
  background: color-mix(in srgb, var(--accent-2) 12%, transparent) !important;
  color: color-mix(in srgb, var(--text) 92%, white);
}

html[data-theme="light"] .search-top-query-icon {
  color: color-mix(in srgb, var(--muted) 82%, var(--text));
}

html[data-theme="light"] .search-top-query-icon:hover,
html[data-theme="light"] .search-top-query-icon:focus-visible {
  color: var(--text);
}

.search-top-q-input {
  min-height: 2.58rem;
  padding-left: 2.45rem;
  padding-right: 0.85rem;
  border-radius: 0.58rem;
  direction: rtl;
  text-align: right;
}

.search-top-muscle-filter {
  margin: 0;
  min-width: 0;
}

.search-active-filters {
  position: sticky;
  top: 0.4rem;
  z-index: 34;
  display: grid;
  gap: 0.42rem;
  min-width: 0;
  margin: -0.18rem 0 0.72rem;
  padding: 0.54rem;
  border: 1px solid color-mix(in srgb, var(--control-line) 82%, transparent);
  border-radius: 0.58rem;
  background: color-mix(in srgb, var(--surface-strong) 88%, transparent);
  box-shadow: 0 0.7rem 1.45rem color-mix(in srgb, var(--ink) 10%, transparent);
  backdrop-filter: blur(14px);
}

.search-active-filters.is-empty {
  background: color-mix(in srgb, var(--surface-strong) 72%, transparent);
  box-shadow: 0 0.45rem 1rem color-mix(in srgb, var(--ink) 6%, transparent);
}

.search-active-filters-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.6rem;
  min-width: 0;
}

.search-active-filters-actions {
  display: inline-flex;
  align-items: center;
  gap: 0.38rem;
  flex: 0 0 auto;
}

.search-active-filters-title {
  color: var(--muted);
  font-size: 0.74rem;
  font-weight: 850;
  line-height: 1.35;
}

.search-active-filters-info {
  width: 1.7rem;
  min-height: 1.7rem;
  height: 1.7rem;
  margin: 0 !important;
  padding: 0 !important;
  display: inline-grid;
  place-items: center;
  border-radius: 0.5rem;
  border: 1px solid color-mix(in srgb, var(--control-line) 92%, transparent);
  background: color-mix(in srgb, var(--surface) 82%, transparent) !important;
  color: var(--muted) !important;
  box-shadow: none !important;
}

.search-active-filters-info svg {
  width: 1rem;
  height: 1rem;
  fill: none;
  stroke: currentColor;
  stroke-width: 2.15;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.search-active-filters-info:hover,
.search-active-filters-info:focus-visible {
  border-color: color-mix(in srgb, var(--accent) 34%, var(--control-line));
  color: color-mix(in srgb, var(--accent) 34%, var(--text)) !important;
}

.search-active-filters-clear {
  flex: 0 0 auto;
  width: auto !important;
  min-height: 1.6rem;
  margin: 0;
  padding: 0.08rem 0.52rem;
  border-radius: 999px;
  border: 1px solid color-mix(in srgb, var(--control-line) 92%, transparent);
  background: color-mix(in srgb, var(--surface) 82%, transparent) !important;
  color: var(--muted) !important;
  box-shadow: none !important;
  font-size: 0.68rem;
  font-weight: 850;
  white-space: nowrap;
}

.search-active-filter-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 0.34rem;
  min-width: 0;
}

.search-active-filters-empty {
  display: inline-flex;
  align-items: center;
  min-height: 1.9rem;
  color: var(--muted);
  font-size: 0.78rem;
}

.search-active-filter-chip {
  width: auto !important;
  flex: 0 1 auto;
  display: inline-flex;
  align-items: center;
  gap: 0.34rem;
  max-width: 100%;
  min-height: 1.9rem;
  margin: 0;
  padding: 0.16rem 0.34rem 0.16rem 0.48rem;
  border-radius: 999px;
  border: 1px solid color-mix(in srgb, var(--accent-2) 28%, var(--control-line));
  background: color-mix(in srgb, var(--surface) 78%, rgb(var(--accent-rgb) / 0.16)) !important;
  color: var(--text) !important;
  box-shadow: none !important;
  font-size: 0.74rem;
  line-height: 1.3;
}

.search-active-filter-label {
  color: var(--muted);
  font-weight: 800;
  white-space: nowrap;
}

.search-active-filter-chip strong {
  min-width: 0;
  overflow: hidden;
  color: var(--text);
  font-size: 0.76rem;
  font-weight: 900;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.search-active-filter-remove {
  display: inline-grid;
  place-items: center;
  flex: 0 0 auto;
  width: 1.12rem;
  height: 1.12rem;
  border-radius: 999px;
  background: color-mix(in srgb, var(--text) 10%, transparent);
  color: var(--muted);
  font-size: 0.9rem;
  font-weight: 900;
  line-height: 1;
}

.search-target-backing-select {
  display: none !important;
}

.search-target-backing-select + .app-select {
  display: none !important;
}

.search-top-actions-row {
  display: grid;
  grid-template-columns: 7rem minmax(0, 1fr);
  gap: 0.48rem;
}

.search-top-actions-row button {
  min-height: 2.42rem;
  margin: 0;
  border-radius: 0.58rem;
  white-space: nowrap;
}

.muscle-filter-map {
  border-radius: 0.72rem;
  border: 1px solid color-mix(in srgb, var(--accent-2) 22%, transparent);
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--surface) 88%, transparent), color-mix(in srgb, var(--surface-strong) 72%, transparent)),
    var(--surface);
  padding: 0.58rem;
}

.muscle-filter-map-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  margin-bottom: 0.45rem;
}

.muscle-filter-map-title {
  font-size: 0.82rem;
  font-weight: 850;
  color: var(--text);
}

.muscle-filter-map-actions {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  min-width: 0;
}

.muscle-filter-view-toggle {
  display: inline-grid;
  grid-template-columns: repeat(2, minmax(2.45rem, 1fr));
  gap: 0.18rem;
  padding: 0.16rem;
  border-radius: 0.55rem;
  border: 1px solid var(--control-line);
  background: color-mix(in srgb, var(--surface-strong) 72%, transparent);
}

.muscle-filter-view-btn {
  min-height: 1.72rem;
  margin: 0;
  padding: 0.1rem 0.42rem;
  border: 0;
  border-radius: 0.42rem;
  background: transparent !important;
  color: var(--muted) !important;
  box-shadow: none !important;
  font-size: 0.7rem;
  font-weight: 850;
}

.muscle-filter-view-btn.is-active {
  background: color-mix(in srgb, var(--accent-2) 24%, var(--surface)) !important;
  color: var(--text) !important;
}

.muscle-filter-clear {
  min-height: 1.82rem;
  margin: 0;
  padding: 0.16rem 0.5rem;
  border-radius: 0.5rem;
  border: 1px solid var(--control-line);
  background: color-mix(in srgb, var(--surface) 86%, transparent) !important;
  color: var(--muted) !important;
  box-shadow: none !important;
  font-size: 0.72rem;
  font-weight: 800;
}

.muscle-filter-map-body {
  display: grid;
  grid-template-columns: minmax(7.5rem, 0.68fr) minmax(0, 1fr);
  gap: 0.62rem;
  align-items: center;
}

.muscle-filter-figure {
  width: 100%;
  max-height: 16rem;
  display: block;
  overflow: visible;
}

.muscle-filter-map[data-view="front"] .muscle-filter-side-back,
.muscle-filter-map[data-view="back"] .muscle-filter-side-front {
  display: none;
}

.muscle-zone {
  fill: color-mix(in srgb, var(--accent-2) 15%, var(--surface-strong));
  stroke: color-mix(in srgb, var(--accent-2) 36%, var(--line-soft));
  stroke-width: 2;
  stroke-linejoin: round;
  cursor: pointer;
  transition:
    fill 0.16s ease,
    stroke 0.16s ease,
    opacity 0.16s ease,
    transform 0.16s ease;
  transform-box: fill-box;
  transform-origin: center;
}

.muscle-zone:hover,
.muscle-zone:focus-visible {
  fill: color-mix(in srgb, var(--accent-2) 34%, var(--surface));
  stroke: color-mix(in srgb, var(--accent-2) 72%, #ffffff);
}

.muscle-zone.is-active {
  fill: color-mix(in srgb, var(--accent-3) 74%, var(--accent-2));
  stroke: color-mix(in srgb, #ffffff 44%, var(--accent-3));
  transform: scale(1.025);
}

.muscle-zone.is-disabled {
  cursor: default;
  opacity: 0.36;
}

.muscle-filter-outline {
  fill: none;
  stroke: color-mix(in srgb, var(--text) 32%, transparent);
  stroke-width: 2.2;
  stroke-linecap: round;
  pointer-events: none;
}

.muscle-filter-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.36rem;
}

.muscle-filter-chip {
  --muscle-chip-active-border: color-mix(in srgb, var(--accent-3) 44%, var(--accent-2));
  --muscle-chip-active-bg: color-mix(in srgb, var(--accent-3) 20%, var(--surface));
  --muscle-chip-active-glow: color-mix(in srgb, var(--accent-2) 20%, transparent);
  min-height: 2rem;
  margin: 0;
  padding: 0.32rem 0.46rem;
  border-radius: 0.5rem;
  font-size: 0.74rem;
  font-weight: 800;
  line-height: 1.3;
}

.muscle-filter-chip.is-active {
  border-color: var(--muscle-chip-active-border);
  background: var(--muscle-chip-active-bg) !important;
  color: var(--text);
}

.muscle-filter-chip.is-primary {
  --muscle-chip-active-border: color-mix(in srgb, var(--accent) 64%, var(--accent-3));
  --muscle-chip-active-bg: color-mix(in srgb, var(--accent) 20%, var(--surface));
  --muscle-chip-active-glow: rgb(var(--accent-rgb) / 0.18);
}

.muscle-filter-chip.is-secondary {
  --muscle-chip-active-border: color-mix(in srgb, #14b8a6 66%, #22c55e);
  --muscle-chip-active-bg: color-mix(in srgb, #14b8a6 18%, var(--surface));
  --muscle-chip-active-glow: rgba(20, 184, 166, 0.18);
}

.muscle-filter-chip.is-disabled {
  opacity: 0.45;
}

.muscle-filter-selected {
  margin: 0.48rem 0 0.34rem;
  min-height: 1.1rem;
}

.muscle-filter-map--lyfta {
  padding: 0;
  border: 0;
  background: transparent;
}

.muscle-filter-map--lyfta .muscle-filter-list {
  display: flex;
  gap: 0.42rem;
  overflow-x: auto;
  overscroll-behavior-inline: contain;
  scroll-snap-type: x proximity;
  padding: 0.02rem 0 0.16rem;
  scrollbar-width: none;
  cursor: grab;
  touch-action: auto;
  -webkit-overflow-scrolling: touch;
  user-select: none;
  -webkit-user-select: none;
}

.muscle-filter-map--lyfta .muscle-filter-list::-webkit-scrollbar {
  display: none;
}

.muscle-filter-map--lyfta .muscle-filter-list.is-dragging {
  cursor: grabbing;
  scroll-snap-type: none;
}

.muscle-filter-map--lyfta .muscle-filter-list.is-intro-scrolling {
  scroll-snap-type: none;
}

.muscle-filter-map--lyfta .muscle-filter-chip {
  flex: 0 0 5.25rem;
  display: grid;
  grid-template-rows: 4.35rem auto;
  align-items: center;
  justify-items: center;
  gap: 0.3rem;
  min-height: 6.18rem;
  padding: 0.36rem 0.32rem 0.4rem;
  text-align: center;
  border-color: color-mix(in srgb, var(--control-line) 88%, var(--accent-2));
  background: color-mix(in srgb, var(--surface) 84%, transparent) !important;
  scroll-snap-align: start;
}

.muscle-filter-chip-icon {
  display: inline-grid;
  place-items: center;
  width: 4.05rem;
  height: 4.05rem;
  border-radius: 0.7rem;
  background: color-mix(in srgb, var(--surface-strong) 68%, transparent);
  overflow: visible;
}

.muscle-filter-chip-icon img {
  width: 3.9rem;
  height: 3.9rem;
  object-fit: contain;
  display: block;
  pointer-events: none;
  -webkit-user-drag: none;
  user-select: none;
}

.muscle-filter-chip--shortcut {
  --muscle-chip-active-border: color-mix(in srgb, var(--accent) 62%, var(--accent-3));
  --muscle-chip-active-bg: color-mix(in srgb, var(--accent) 18%, var(--surface));
  --muscle-chip-active-glow: rgb(var(--accent-rgb) / 0.16);
}

.muscle-filter-chip--shortcut .muscle-filter-chip-icon img {
  width: 3.9rem;
  height: 3.9rem;
  filter: none;
  opacity: 1;
}

.muscle-filter-chip-text {
  min-width: 0;
  display: grid;
  gap: 0.08rem;
}

.muscle-filter-chip-text strong,
.muscle-filter-chip-text small {
  display: block;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.muscle-filter-chip-text strong {
  font-size: 0.75rem;
  line-height: 1.35;
}

.muscle-filter-chip-text small {
  color: var(--muted);
  font-size: 0.61rem;
  line-height: 1.15;
}

.muscle-filter-map--lyfta .muscle-filter-chip.is-active {
  border-color: var(--muscle-chip-active-border);
  background: var(--muscle-chip-active-bg) !important;
  box-shadow:
    0 0 0 1px color-mix(in srgb, var(--muscle-chip-active-border) 26%, transparent),
    0 10px 22px var(--muscle-chip-active-glow);
}

.search-top-muscle-filter .muscle-filter-map-head {
  display: none;
}

.search-top-muscle-filter .muscle-filter-map-title {
  color: var(--muted);
  font-size: 0.76rem;
}

.search-top-muscle-filter .muscle-filter-selected {
  display: none;
}

.search-top-muscle-filter .muscle-filter-clear[hidden] {
  display: none;
}

.search-top-muscle-filter .muscle-filter-clear {
  min-height: 1.62rem;
  padding: 0.08rem 0.52rem;
  border-radius: 999px;
  font-size: 0.68rem;
}

.muscle-filter-chip.is-active .muscle-filter-chip-icon {
  background: color-mix(in srgb, var(--surface-strong) 68%, transparent);
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--control-line) 72%, transparent);
}

.muscle-filter-map--lyfta .muscle-filter-chip.is-active .muscle-filter-chip-icon {
  background: color-mix(in srgb, var(--surface-strong) 68%, transparent);
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--control-line) 72%, transparent);
}

.muscle-filter-map--lyfta .muscle-filter-chip.is-active .muscle-filter-chip-icon img {
  filter: none !important;
  opacity: 1;
  mix-blend-mode: normal;
}

.muscle-filter-chip.is-active .muscle-filter-chip-text small {
  color: color-mix(in srgb, var(--text) 72%, var(--muted));
}

.lib-search-filters-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: stretch;
  gap: 0.58rem;
  padding: 0;
  border-radius: 0.72rem;
  border: 0;
  background: transparent;
}

.lib-search-filter-field {
  min-width: 0;
  display: grid;
  gap: 0.28rem;
}

.lib-search-filters-grid label {
  font-size: 0.78rem;
  font-weight: 700;
  margin: 0;
  line-height: 1.35;
  color: var(--muted);
}

.lib-search-filters-grid select {
  width: 100%;
  box-sizing: border-box;
  min-height: 2.48rem;
  margin: 0;
  border-radius: 0.72rem;
  background-color: color-mix(in srgb, var(--surface) 88%, transparent);
}

.search-sheet-myex-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.45rem;
  margin-bottom: 0;
  min-height: 2.55rem;
  border-radius: 0.72rem;
}

@media (min-width: 560px) {
  .lib-search-simple-section {
    grid-template-columns: 7rem minmax(0, 1fr);
    align-items: center;
  }

  .lib-search-simple-section .lib-search-field-label {
    margin: 0;
  }

  .lib-search-simple-section .lib-search-help-text {
    grid-column: 2;
  }

  .lib-search-filters-grid-main {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .lib-search-more-body .lib-search-filters-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  .muscle-filter-map-body {
    grid-template-columns: minmax(8.5rem, 0.58fr) minmax(0, 1fr);
  }

  .muscle-filter-figure {
    max-height: 13.5rem;
  }

  .muscle-filter-list {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .muscle-filter-map--lyfta .muscle-filter-chip {
    flex-basis: 5.45rem;
  }
}

@media (max-width: 420px) {
  .search-sheet-panel {
    max-height: min(48vh, 21rem);
  }

  .lib-search-filters-grid-main {
    grid-template-columns: 1fr;
  }

  .lib-search-filters-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.42rem;
  }

  .lib-search-filters-grid label {
    font-size: 0.76rem;
  }

  .lib-search-filters-grid select,
  .lib-search-q-input,
  .search-top-actions-row button,
  .lib-search-actions-row button {
    min-height: 2.25rem;
  }

  .search-top-filter-card {
    padding: 0.54rem;
    gap: 0.52rem;
  }

  .search-top-actions-row {
    grid-template-columns: 6.3rem minmax(0, 1fr);
  }

  .muscle-filter-map-body {
    grid-template-columns: 1fr;
  }

  .muscle-filter-figure {
    max-height: 13.5rem;
  }

  .muscle-filter-list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .muscle-filter-chip {
    min-height: 6.25rem;
    padding-inline: 0.34rem;
  }

  .muscle-filter-map--lyfta .muscle-filter-chip {
    flex-basis: 5.25rem;
  }

  .muscle-filter-map-head {
    align-items: stretch;
  }

  .muscle-filter-map-actions {
    gap: 0.28rem;
  }

  .muscle-filter-view-toggle {
    grid-template-columns: repeat(2, minmax(2.05rem, 1fr));
  }
}

.search-filters-inner label:first-of-type {
  margin-top: 0;
}

.search-results-only-card .search-status {
  margin-top: 0;
}

.search-results-only-card {
  margin-bottom: 0.15rem;
}

/* صفحهٔ اصلی — تمرین تصادفی */
#page-portal {
  --portal-gap: 0.625rem;
}

.portal-random-card {
  position: relative;
  isolation: isolate;
  box-sizing: border-box;
  margin: 0.45rem 0 0.7rem;
  padding: 0.82rem;
  border-radius: calc(var(--radius) + 0.28rem);
  border-color: rgb(var(--accent-hover-rgb) / 0.3);
  background: var(--card);
  box-shadow: none;
  overflow: hidden;
}

.portal-random-card::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background:
    radial-gradient(circle at 11% 5%, rgba(250, 204, 21, 0.2), transparent 24%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.07), transparent 42%);
  opacity: 0.68;
}

.portal-random-card::after {
  content: "";
  position: absolute;
  inset-inline: 0.9rem;
  top: 0;
  z-index: -1;
  height: 0.18rem;
  border-radius: 999px;
  background: linear-gradient(90deg, transparent, rgba(250, 204, 21, 0.78), rgb(var(--accent-rgb) / 0.72), transparent);
}

html[data-theme="light"] .portal-random-card {
  border-color: rgb(var(--accent-strong-rgb) / 0.2);
  background:
    linear-gradient(145deg, rgba(255, 237, 213, 0.84), transparent 42%),
    linear-gradient(315deg, rgba(224, 242, 254, 0.6), transparent 42%),
    color-mix(in srgb, var(--surface) 96%, #ffffff);
  box-shadow:
    0 14px 34px rgba(19, 18, 26, 0.09),
    0 1px 0 rgba(255, 255, 255, 0.78) inset;
}

.portal-random-head {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  gap: 0.72rem;
  margin-bottom: 0.62rem;
  min-height: 2.55rem;
}

.portal-random-title {
  position: relative;
  margin: 0;
  flex: 1;
  min-width: 0;
  padding-inline-start: 0.78rem;
  font-size: 1.08rem;
  font-weight: 800;
  letter-spacing: 0;
  color: var(--text);
  line-height: 1.45;
}

.portal-random-title::before {
  content: "";
  position: absolute;
  inset-inline-start: 0;
  top: 0.45em;
  width: 0.38rem;
  height: 0.38rem;
  border-radius: 999px;
  background: var(--accent);
  box-shadow: 0 0 0 0.28rem rgb(var(--accent-rgb) / 0.14);
}

.portal-random-refresh-btn {
  position: relative;
  box-sizing: border-box;
  flex-shrink: 0;
  width: 2.1rem;
  height: 2.1rem;
  margin: 0 !important;
  padding: 0 !important;
  border-radius: 0.6rem;
  border: 1px solid rgb(var(--accent-hover-rgb) / 0.2);
  background: rgb(var(--accent-hover-rgb) / 0.06);
  color: var(--muted);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition:
    background 0.18s ease,
    border-color 0.18s ease,
    color 0.18s ease,
    opacity 0.18s ease;
}

.portal-random-refresh-btn:hover:not(:disabled) {
  background: rgb(var(--accent-rgb) / 0.1);
  border-color: rgb(var(--accent-rgb) / 0.38);
  color: var(--accent);
}

.portal-random-refresh-btn:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}

.portal-random-refresh-btn:disabled {
  opacity: 0.55;
  cursor: wait;
}

.portal-random-refresh-btn.is-loading {
  color: transparent !important;
}

.portal-random-refresh-btn.is-loading::after {
  content: "";
  position: absolute;
  inset: 0;
  width: 0.92rem;
  height: 0.92rem;
  margin: auto;
  border: 2px solid rgb(var(--accent-rgb) / 0.28);
  border-top-color: var(--accent);
  border-radius: 50%;
  animation: edb-spin 0.72s linear infinite;
}

.portal-random-refresh-btn.is-loading .portal-random-refresh-icon {
  opacity: 0;
}

@keyframes portal-refresh-spin {
  to {
    transform: rotate(-360deg);
  }
}

.portal-random-refresh-icon {
  display: block;
  width: 1rem;
  height: 1rem;
  flex-shrink: 0;
  transform-box: view-box;
  transform-origin: center;
  will-change: transform;
  transition: transform 0.18s ease;
}

.portal-random-refresh-btn:hover:not(:disabled) .portal-random-refresh-icon {
  transform: rotate(-22deg);
}

.portal-random-hint:not(.hidden) {
  margin: -0.24rem 0 0.55rem;
  padding: 0.44rem 0.58rem;
  border-radius: 0.7rem;
  border: 1px solid rgb(var(--accent-hover-rgb) / 0.18);
  background: rgba(19, 18, 26, 0.2);
  color: color-mix(in srgb, var(--muted) 84%, var(--text));
}

.portal-random-results {
  margin-top: 0;
  gap: 0.62rem;
}

.portal-random-results .ex-card {
  block-size: 8.55rem;
  border-radius: calc(var(--radius) + 0.16rem);
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.045), transparent 38%),
    var(--ex-card-bg);
  box-shadow:
    0 10px 26px rgba(0, 0, 0, 0.16),
    0 1px 0 rgba(255, 255, 255, 0.055) inset;
}

.portal-random-results .ex-card:only-child {
  grid-column: 1 / -1;
}

.portal-random-results .ex-card:hover {
  box-shadow:
    0 16px 32px rgba(0, 0, 0, 0.22),
    0 1px 0 rgba(255, 255, 255, 0.08) inset;
}

.portal-random-results .ex-card-inner {
  grid-template-columns: 6.15rem 1fr;
  gap: 0.68rem;
  padding: 0.6rem;
}

.portal-random-results .ex-card-media {
  border-radius: 0.86rem;
}

.portal-random-results .ex-card-title {
  font-size: 0.95rem;
  font-weight: 700;
}

.portal-random-results .ex-card:last-child {
  margin-bottom: 0;
}

.portal-random-results .edb-loading-row.portal-random-loading {
  margin: 0;
  padding: 0.55rem 0;
}

.portal-random-empty {
  margin: 0;
  min-height: 7.8rem;
  align-items: center;
  justify-content: center;
  border: 1px dashed rgb(var(--accent-soft-rgb) / 0.36);
  background:
    linear-gradient(135deg, rgb(var(--accent-rgb) / 0.095), transparent 48%),
    rgba(19, 18, 26, 0.16);
}

.portal-random-empty-icon {
  width: 2.55rem;
  height: 2.55rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 0.82rem;
  color: var(--accent);
  background:
    linear-gradient(180deg, rgba(250, 204, 21, 0.18), rgb(var(--accent-rgb) / 0.13)),
    rgb(var(--accent-rgb) / 0.1);
  box-shadow: 0 8px 20px rgb(var(--accent-rgb) / 0.12);
}

.portal-random-empty-icon svg {
  width: 1.3rem;
  height: 1.3rem;
}

.portal-random-empty--busy .portal-random-empty-icon svg {
  animation: portal-refresh-spin 0.9s linear infinite;
}

html[data-theme="light"] .portal-random-empty {
  border-color: rgb(var(--accent-strong-rgb) / 0.22);
  background:
    linear-gradient(135deg, rgba(255, 237, 213, 0.78), transparent 52%),
    rgba(255, 255, 255, 0.5);
}

html[data-theme="light"] .portal-random-hint:not(.hidden) {
  background: rgba(255, 247, 237, 0.72);
  color: color-mix(in srgb, var(--muted) 78%, var(--text));
}

html[data-theme="light"] .portal-random-results .ex-card {
  box-shadow:
    0 9px 24px rgba(19, 18, 26, 0.08),
    0 1px 0 rgba(255, 255, 255, 0.86) inset;
}

@keyframes edb-spin {
  to {
    transform: rotate(-360deg);
  }
}

.edb-spinner-sm {
  display: block;
  width: 1.05em;
  height: 1.05em;
  border: 2px solid rgb(var(--accent-rgb) / 0.32);
  border-top-color: var(--accent);
  border-radius: 50%;
  animation: edb-spin 0.75s linear infinite;
  flex-shrink: 0;
  box-sizing: border-box;
}

/* دکمه‌ها — حالت در حال ارسال */
button.is-loading,
button[type="button"].is-loading,
button[type="submit"].is-loading {
  position: relative;
  cursor: wait;
  pointer-events: none;
  color: transparent !important;
}

button.is-loading::after {
  content: "";
  position: absolute;
  inset-inline-start: 50%;
  top: 50%;
  width: 1.15rem;
  height: 1.15rem;
  margin: -0.575rem 0 0 -0.575rem;
  border: 2px solid rgba(255, 255, 255, 0.35);
  border-top-color: #fff;
  border-radius: 50%;
  animation: edb-spin 0.72s linear infinite;
}

button.secondary.is-loading::after,
button.wide.secondary.is-loading::after {
  border-color: rgb(var(--accent-rgb) / 0.28);
  border-top-color: var(--accent);
}

html[data-theme="light"] button.is-loading::after {
  border-color: rgb(var(--accent-rgb) / 0.2);
  border-top-color: var(--accent);
}

.edb-loading-row {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  width: 100%;
  flex-wrap: wrap;
  box-sizing: border-box;
}

.app-skeleton {
  --skel-base: rgba(163, 160, 173, 0.12);
  --skel-shine: rgba(255, 255, 255, 0.13);
  display: grid;
  gap: 0.72rem;
  width: 100%;
}

.app-skeleton-item {
  position: relative;
  overflow: hidden;
  border-radius: var(--radius);
  border: 1px solid rgb(var(--accent-rgb) / 0.11);
  background: rgba(255, 255, 255, 0.035);
  min-width: 0;
}

.app-skeleton-label {
  display: inline-flex;
  grid-column: 1 / -1;
  align-items: center;
  justify-content: center;
  justify-self: center;
  gap: 0.5rem;
  min-height: 2rem;
  padding: 0.42rem 0.78rem;
  border-radius: 999px;
  color: var(--muted);
  background: rgba(255, 255, 255, 0.055);
  border: 1px solid rgba(163, 160, 173, 0.16);
  font-size: 0.78rem;
  font-weight: 700;
}

.app-skeleton-item::after,
.app-skel-line::after,
.app-skel-media::after,
.app-skel-hero::after,
.app-skel-thumb::after,
.app-skel-avatar::after,
.app-skel-pill::after,
.app-skel-chip-row span::after {
  content: "";
  position: absolute;
  inset: 0;
  transform: translateX(105%);
  background: linear-gradient(90deg, transparent, var(--skel-shine), transparent);
  animation: app-skeleton-shimmer 1.35s ease-in-out infinite;
}

.app-skeleton-item--card {
  padding: 0.72rem;
  display: grid;
  gap: 0.55rem;
}

.app-skeleton-item--row {
  padding: 0.78rem 0.82rem;
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 0.72rem;
}

.app-skeleton-item--tile {
  padding: 0.75rem;
  display: grid;
  grid-template-columns: 4.8rem 1fr;
  gap: 0.75rem;
  align-items: center;
}

.app-skeleton-item--plan,
.app-skeleton-item--detail {
  padding: 0.95rem;
  display: grid;
  gap: 0.65rem;
}

.app-skel-stack {
  display: grid;
  gap: 0.45rem;
  min-width: 0;
}

.app-skel-line,
.app-skel-media,
.app-skel-hero,
.app-skel-thumb,
.app-skel-avatar,
.app-skel-pill,
.app-skel-chip-row span {
  position: relative;
  display: block;
  overflow: hidden;
  background: var(--skel-base);
}

.app-skel-line {
  width: 100%;
  height: 0.7rem;
  border-radius: 999px;
}

.app-skel-line--title {
  width: 66%;
  height: 0.92rem;
}

.app-skel-line--lg {
  width: 78%;
}

.app-skel-line--md {
  width: 48%;
}

.app-skel-line--sm {
  width: 34%;
}

.app-skel-media {
  aspect-ratio: 16 / 9;
  border-radius: 0.85rem;
}

.app-skel-hero {
  aspect-ratio: 4 / 3;
  border-radius: 1rem;
}

.app-skel-thumb,
.app-skel-avatar {
  width: 4.4rem;
  height: 4.4rem;
  border-radius: 0.9rem;
}

.app-skel-avatar {
  width: 2.35rem;
  height: 2.35rem;
  border-radius: 50%;
}

.app-skel-pill {
  width: 4.4rem;
  height: 1.65rem;
  border-radius: 999px;
}

.app-skel-chip-row {
  display: flex;
  gap: 0.45rem;
  flex-wrap: wrap;
}

.app-skel-chip-row span {
  width: 4.2rem;
  height: 1.35rem;
  border-radius: 999px;
}

.app-skeleton--portal-random {
  margin: 0;
}

.app-skeleton--paging {
  grid-column: 1 / -1;
  grid-template-columns: repeat(auto-fit, minmax(13rem, 1fr));
  margin: 0.1rem 0 0.35rem;
}

html[data-theme="light"] .app-skeleton {
  --skel-base: rgba(100, 116, 139, 0.15);
  --skel-shine: rgba(255, 255, 255, 0.68);
}

html[data-theme="light"] .app-skeleton-item {
  border-color: rgb(var(--accent-hover-rgb) / 0.13);
  background: rgba(19, 18, 26, 0.035);
}

html[data-theme="light"] .app-skeleton-label {
  background: rgba(19, 18, 26, 0.045);
  border-color: rgb(var(--accent-hover-rgb) / 0.12);
}

.ex-detail-loading.app-skeleton {
  padding: 0.2rem 0 0.6rem;
}

@keyframes app-skeleton-shimmer {
  100% {
    transform: translateX(-105%);
  }
}

@media (prefers-reduced-motion: reduce) {
  .app-skeleton-item::after,
  .app-skel-line::after,
  .app-skel-media::after,
  .app-skel-hero::after,
  .app-skel-thumb::after,
  .app-skel-avatar::after,
  .app-skel-pill::after,
  .app-skel-chip-row span::after {
    animation: none;
    display: none;
  }
}

.ex-detail-loading.edb-loading-row {
  padding: 1rem 0.5rem;
  text-align: center;
}

@keyframes edb-card-enter {
  from {
    opacity: 0;
    transform: translateY(8px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.ex-card.ex-card-enter {
  animation: edb-card-enter 0.42s cubic-bezier(0.22, 1, 0.36, 1) forwards;
}

@media (prefers-reduced-motion: reduce) {
  .ex-card.ex-card-enter {
    animation: none;
    opacity: 1;
    transform: none;
  }

  .edb-spinner-sm {
    animation: none;
    border-color: var(--accent);
    opacity: 0.85;
  }
}

.portal-random-hint-err {
  color: var(--err);
}

/* میانبرها — هم‌عرض کادر بالا؛ فاصلهٔ استاندارد موبایل */
.portal-shortcuts {
  margin: 0 0 0.85rem;
  width: 100%;
}

.portal-grid.portal-grid--shortcuts {
  display: grid;
  grid-template-columns: repeat(var(--portal-shortcut-columns, 5), minmax(0, 1fr));
  gap: var(--portal-gap, 0.625rem);
  width: 100%;
  direction: rtl;
}

.portal-grid--shortcuts .portal-grid-tile {
  min-width: 0;
  min-height: 4.25rem;
  border-radius: 0.75rem;
  border: 1px solid rgba(163, 160, 173, 0.15);
  background:
    linear-gradient(145deg, rgb(var(--accent-rgb) / 0.1), rgb(var(--accent-rgb) / 0.055)),
    linear-gradient(180deg, rgba(18, 26, 44, 0.9), rgba(10, 14, 24, 0.95));
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.45rem;
  padding: 0.5rem 0.28rem 0.45rem;
  text-align: center;
  overflow: hidden;
  box-sizing: border-box;
  backdrop-filter: blur(10px);
  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.22), 0 1px 0 rgba(255, 255, 255, 0.05) inset;
}

.portal-tile-icon {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 2.12rem;
  height: 2.12rem;
  padding: 0.32rem;
  margin: 0;
  border-radius: 0.78rem;
  background: linear-gradient(135deg, rgb(var(--accent-rgb) / 0.24), rgb(var(--accent-rgb) / 0.16));
  line-height: 0;
  color: var(--app-icon-mono);
  box-sizing: border-box;
  transition: color 0.18s ease, opacity 0.18s ease, background 0.18s ease;
}

.portal-tile-icon-svg {
  display: block;
  width: 1.46rem;
  height: 1.46rem;
}

.portal-tile-icon-img {
  width: 1.46rem;
  height: 1.46rem;
  object-fit: contain;
  display: block;
}

button.portal-grid-tile.portal-grid-tile-action {
  width: 100%;
  max-width: none;
  margin: 0 !important;
  cursor: pointer;
  font-family: inherit;
  color: var(--text);
  box-shadow: 0 6px 22px rgba(0, 0, 0, 0.22);
  border: 1px solid #2c2a36;
  background: linear-gradient(180deg, rgba(18, 26, 44, 0.9), rgba(10, 14, 24, 0.95));
}

button.portal-grid-tile-action:hover {
  border-color: rgb(var(--accent-rgb) / 0.55);
  background: linear-gradient(180deg, rgba(35, 45, 70, 0.92), rgba(16, 22, 38, 0.98));
}

button.portal-grid-tile-action:hover .portal-tile-icon {
  color: var(--app-icon-mono);
  background: rgb(var(--accent-rgb) / 0.22);
}

.portal-grid--shortcuts .portal-tile-caption {
  display: block;
  margin: 0;
  padding: 0 0.1rem;
  font-weight: 700;
  font-size: 0.58rem;
  line-height: 1.3;
  color: var(--text);
  overflow-wrap: anywhere;
  hyphens: auto;
}

html[data-theme="light"] button.portal-grid-tile.portal-grid-tile-action {
  border-color: rgba(19, 18, 26, 0.1);
  background:
    linear-gradient(145deg, rgb(var(--accent-strong-rgb) / 0.08), rgba(202, 138, 4, 0.045)),
    linear-gradient(180deg, rgba(255, 255, 255, 0.97), rgba(245, 247, 252, 0.99));
  box-shadow: 0 6px 18px rgba(19, 18, 26, 0.08);
}

html[data-theme="light"] .portal-tile-icon {
  background: linear-gradient(135deg, rgb(var(--accent-strong-rgb) / 0.12), rgba(202, 138, 4, 0.1));
}

html[data-theme="light"] button.portal-grid-tile.portal-grid-tile-action:hover {
  border-color: rgb(var(--accent-rgb) / 0.28);
  background: linear-gradient(180deg, rgba(255, 255, 255, 1), rgba(238, 242, 255, 0.98));
}

html[data-theme="light"] button.portal-grid-tile-action:hover .portal-tile-icon {
  background: rgb(var(--accent-rgb) / 0.13);
}

.billing-section,
.billing-manual-card {
  margin: 0 0 0.9rem;
}

.billing-section h2,
.billing-manual-card h2 {
  margin: 0 0 0.65rem;
  font-size: 1rem;
}

.billing-active,
.billing-product,
.billing-transaction,
.billing-method,
.billing-manual-card {
  border: 1px solid var(--line);
  border-radius: 0.75rem;
  background: var(--card);
  padding: 0.85rem;
}

.billing-active {
  display: grid;
  gap: 0.25rem;
  margin-bottom: 0.9rem;
  border-color: color-mix(in srgb, var(--accent) 42%, var(--line));
}

.billing-products,
.billing-transactions {
  display: grid;
  gap: 0.65rem;
}

.billing-methods {
  display: flex;
  flex-flow: row wrap;
  gap: 0.55rem;
}

.billing-product,
.billing-transaction,
.billing-method {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 0.75rem;
  align-items: center;
}

.billing-transaction {
  grid-template-columns: minmax(0, 1fr) auto;
}

.billing-transaction-main {
  min-width: 0;
}

.billing-transaction-title-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.35rem 0.55rem;
}

.billing-transaction-id {
  display: inline-flex !important;
  width: fit-content;
  margin: 0 !important;
  padding: 0.12rem 0.42rem;
  border-radius: 999px;
  border: 1px solid color-mix(in srgb, var(--muted) 20%, var(--line));
  color: var(--muted) !important;
  background: color-mix(in srgb, var(--surface) 76%, transparent);
  font-size: 0.72rem !important;
  font-weight: 800;
  line-height: 1.35 !important;
}

.billing-status-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  justify-self: end;
  min-width: 6.2rem;
  padding: 0.36rem 0.62rem;
  border-radius: 999px;
  border: 1px solid color-mix(in srgb, var(--accent) 26%, var(--line));
  background: color-mix(in srgb, var(--accent) 11%, var(--card));
  color: var(--text);
  font-size: 0.76rem;
  font-weight: 900;
  line-height: 1.35;
  white-space: nowrap;
}

.billing-status-badge--pending {
  border-color: rgba(234, 179, 8, 0.42);
  background: rgba(234, 179, 8, 0.14);
  color: #facc15;
}

.billing-status-badge--approved {
  border-color: rgba(34, 197, 94, 0.42);
  background: rgba(34, 197, 94, 0.14);
  color: #86efac;
}

.billing-status-badge--rejected {
  border-color: rgba(239, 68, 68, 0.42);
  background: rgba(239, 68, 68, 0.13);
  color: #fca5a5;
}

.billing-status-badge--cancelled {
  border-color: color-mix(in srgb, var(--muted) 30%, var(--line));
  background: color-mix(in srgb, var(--muted) 10%, transparent);
  color: var(--muted);
}

.billing-method {
  flex: 1 1 12rem;
  grid-template-columns: auto minmax(0, 1fr);
  min-width: min(100%, 10.5rem);
  gap: 0.95rem;
  padding: 0.78rem;
  min-height: 4.75rem;
}

.billing-method-choice {
  width: auto;
  margin: 0;
  text-align: right;
  color: inherit;
  cursor: pointer;
}

.billing-method-choice:hover:not(:disabled),
.billing-method-choice:focus-visible:not(:disabled) {
  border-color: color-mix(in srgb, var(--accent) 48%, var(--line));
  background: color-mix(in srgb, var(--accent) 8%, var(--card));
}

.billing-method-icon {
  width: 3.35rem;
  height: 3.35rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 0.9rem;
  color: var(--accent);
  background: color-mix(in srgb, var(--accent) 11%, var(--surface, var(--card)));
  border: 1px solid color-mix(in srgb, var(--accent) 22%, var(--line));
}

.billing-method-icon svg {
  width: 1.85rem;
  height: 1.85rem;
}

.billing-method-copy {
  min-width: 0;
}

.billing-method.is-disabled {
  opacity: 0.62;
  cursor: not-allowed;
}

.billing-product strong,
.billing-transaction strong,
.billing-method strong {
  display: block;
  margin-bottom: 0.2rem;
}

.billing-method strong {
  margin-bottom: 0.08rem;
}

.billing-method small {
  display: block;
  color: var(--muted);
  font-size: 0.74rem;
  line-height: 1.4;
}

.billing-product span,
.billing-transaction span,
.billing-method-copy,
.billing-transaction small,
.billing-product p,
.billing-transaction p {
  display: block;
  margin: 0.15rem 0 0;
  color: var(--muted);
  font-size: 0.82rem;
  line-height: 1.7;
}

.billing-product-action {
  display: grid;
  justify-items: end;
  gap: 0.35rem;
  min-width: 7.4rem;
}

.billing-product-action b {
  font-size: 0.86rem;
  white-space: nowrap;
}

.billing-product-action button {
  min-width: 5.5rem;
}

.billing-product-action small {
  max-width: 8rem;
  color: var(--muted);
  font-size: 0.72rem;
  text-align: left;
}

.billing-destinations {
  display: grid;
  grid-template-columns: minmax(5.5rem, auto) minmax(0, 1fr);
  gap: 0.55rem 0.9rem;
  margin: 0;
  direction: rtl;
}

.billing-destinations dt {
  color: var(--muted);
  text-align: right;
}

.billing-destinations dd {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  flex-direction: row-reverse;
  gap: 0.45rem;
  min-width: 0;
  margin: 0;
  text-align: left;
}

.billing-destination-value {
  min-width: 0;
  margin-inline-start: auto;
  overflow-wrap: anywhere;
}

.billing-copy-btn {
  flex: 0 0 auto;
  width: 2rem;
  height: 2rem;
  min-height: 2rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin: 0 !important;
  padding: 0;
  border-radius: 0.62rem;
  border: 1px solid color-mix(in srgb, var(--accent) 22%, var(--line));
  background: color-mix(in srgb, var(--accent) 9%, var(--card)) !important;
  color: var(--accent);
  box-shadow: none !important;
}

.billing-copy-btn svg {
  width: 1.08rem;
  height: 1.08rem;
}

.billing-copy-btn:hover:not(:disabled),
.billing-copy-btn:focus-visible:not(:disabled) {
  border-color: color-mix(in srgb, var(--accent) 44%, var(--line));
  background: color-mix(in srgb, var(--accent) 15%, var(--card)) !important;
}

.billing-copy-btn:disabled {
  opacity: 0.45;
  cursor: not-allowed;
}

.billing-manual-form {
  display: grid;
  gap: 0.65rem;
}

.billing-manual-form.is-disabled {
  opacity: 0.62;
  pointer-events: none;
}

.billing-manual-unavailable {
  margin: 0.35rem 0 0;
}

.billing-jalali-fields-label,
.billing-jalali-preview {
  margin: 0;
}

.billing-jalali-row {
  display: grid;
  grid-template-columns: minmax(4.8rem, 0.9fr) minmax(5.8rem, 1.1fr) minmax(4.2rem, 0.8fr) minmax(3.8rem, 0.65fr) minmax(3.8rem, 0.65fr);
  gap: 0.42rem;
  align-items: center;
}

.billing-jalali-part {
  min-width: 0;
  padding: 0.55rem 0.48rem;
  border-radius: 0.58rem;
  font-size: 0.82rem;
}

.billing-jalali-time {
  direction: ltr;
  text-align: center;
}

.billing-jalali-preview {
  color: var(--muted);
}

.billing-file-chip,
.support-new-file-chip {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.6rem;
  min-height: 3.15rem;
  border: 1px solid color-mix(in srgb, var(--accent) 36%, var(--line));
  border-radius: 0.78rem;
  padding: 0.72rem 0.9rem;
  color: #1a0b05;
  background: linear-gradient(135deg, var(--accent-hover), var(--accent-soft)) !important;
  box-shadow: 0 0.75rem 1.65rem rgb(var(--accent-strong-rgb) / 0.2);
  cursor: pointer;
  font-weight: 850;
  transition: transform 0.16s ease, box-shadow 0.16s ease, filter 0.16s ease;
}

.billing-file-chip:hover,
.billing-file-chip:focus-within,
.support-new-file-chip:hover,
.support-new-file-chip:focus-within {
  transform: translateY(-1px);
  filter: brightness(1.03);
  box-shadow: 0 0.9rem 1.85rem rgb(var(--accent-strong-rgb) / 0.27);
}

.billing-file-chip.is-selected,
.support-new-file-chip.is-selected {
  border-color: color-mix(in srgb, #22c55e 62%, var(--accent));
  background: linear-gradient(135deg, #16a34a, #86efac) !important;
  box-shadow: 0 0.75rem 1.65rem rgba(22, 163, 74, 0.22);
}

.billing-file-chip.is-selected .file-chip-action-icon,
.support-new-file-chip.is-selected .file-chip-action-icon {
  color: #14532d;
  background: rgba(240, 253, 244, 0.82);
}

.billing-file-chip.is-selected .file-chip-action-icon svg,
.support-new-file-chip.is-selected .file-chip-action-icon svg {
  display: none;
}

.billing-file-chip.is-selected .file-chip-action-icon::before,
.support-new-file-chip.is-selected .file-chip-action-icon::before {
  content: "✓";
  font-size: 1.18rem;
  font-weight: 900;
}

.search-filters-info-modal.hidden {
  display: none !important;
}

.search-filters-info-modal {
  position: fixed;
  inset: 0;
  z-index: 12100;
  display: grid;
  place-items: center;
  padding: max(1rem, env(safe-area-inset-top)) 1rem max(1rem, env(safe-area-inset-bottom));
}

.search-filters-info-backdrop {
  position: absolute;
  inset: 0;
  background: color-mix(in srgb, #08070b 58%, transparent);
  backdrop-filter: blur(8px);
}

.search-filters-info-panel {
  position: relative;
  z-index: 1;
  width: min(30rem, 100%);
  max-height: min(40rem, calc(100dvh - 2rem));
  overflow: hidden;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  border: 1px solid var(--shell-line);
  border-radius: 0.85rem;
  background: var(--card);
  color: var(--text);
  box-shadow: 0 1.3rem 3rem color-mix(in srgb, var(--ink, #000) 26%, transparent);
}

.search-filters-info-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.75rem;
  padding: 0.95rem 0.95rem 0.7rem;
  background: color-mix(in srgb, var(--card) 94%, var(--surface-2, var(--card)));
}

.search-filters-info-kicker {
  margin: 0 0 0.16rem;
  color: var(--muted);
  font-size: 0.74rem;
  font-weight: 750;
}

.search-filters-info-head h2 {
  margin: 0;
  font-size: 1rem;
  line-height: 1.35;
}

.search-filters-info-close {
  width: 2rem;
  min-height: 2rem;
  height: 2rem;
  margin: 0;
  padding: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 0.55rem;
  border: 1px solid var(--control-line);
  background: var(--modal-x-bg);
  color: var(--app-icon-mono);
  box-shadow: none;
  font-size: 1.25rem;
  line-height: 1;
}

.search-filters-info-close:hover,
.search-filters-info-close:focus-visible {
  background: rgba(255, 122, 122, 0.2);
  color: var(--err);
}

.search-filters-info-body {
  min-height: 0;
  overflow-y: auto;
  display: grid;
  gap: 0.62rem;
  padding: 0.2rem 0.95rem 0.95rem;
  -webkit-overflow-scrolling: touch;
}

.search-filters-info-body article {
  display: grid;
  gap: 0.22rem;
  padding: 0.65rem 0.7rem;
  border: 1px solid color-mix(in srgb, var(--line, rgba(163, 160, 173, 0.24)) 82%, transparent);
  border-radius: 0.65rem;
  background: color-mix(in srgb, var(--surface-2, var(--card)) 86%, var(--app-bg, #0e0d12));
}

.search-filters-info-body strong {
  font-size: 0.86rem;
  line-height: 1.45;
}

.search-filters-info-body p {
  margin: 0;
  color: var(--muted);
  font-size: 0.78rem;
  line-height: 1.75;
}

.file-chip-action-icon {
  flex: 0 0 auto;
  width: 2rem;
  height: 2rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 0.62rem;
  background: rgba(255, 247, 237, 0.72);
  color: #7c2d12;
}

.file-chip-action-icon svg {
  width: 1.18rem;
  height: 1.18rem;
}

.file-chip-action-copy {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 0.08rem;
  line-height: 1.35;
}

.file-chip-action-copy small {
  color: rgba(26, 11, 5, 0.72);
  font-size: 0.72rem;
  font-weight: 750;
}

#billing-file,
#support-file {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  min-height: 1px !important;
  padding: 0 !important;
  border: 0 !important;
  opacity: 0;
  pointer-events: none;
}

@media (max-width: 420px) {
  .billing-product,
  .billing-transaction {
    grid-template-columns: 1fr;
  }

  .billing-product-action {
    justify-items: stretch;
  }

  .billing-status-badge {
    justify-self: stretch;
  }

  .billing-jalali-row {
    grid-template-columns: 1fr 1fr 1fr;
  }

  .billing-jalali-time {
    grid-column: span 1;
  }
}

.portal-exercise-rail {
  margin: 0 0 1rem;
  min-width: 0;
}

.portal-rail-head {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: 0.55rem;
  margin: 0 0 0.45rem;
  direction: ltr;
}

.portal-rail-title {
  grid-column: 2;
  justify-self: end;
  margin: 0;
  min-width: 0;
  color: var(--text);
  font-size: 0.9rem;
  font-weight: 800;
  line-height: 1.35;
  display: inline-flex;
  align-items: center;
  gap: 0.34rem;
  direction: rtl;
}

.portal-rail-title-dot {
  width: 0.32rem;
  height: 1.05rem;
  border-radius: 999px;
  background: var(--accent);
  box-shadow: none;
}

.portal-rail-more {
  grid-column: 1;
  justify-self: start;
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.18rem;
  min-width: 0;
  min-height: 1.68rem;
  margin: 0 !important;
  padding: 0.16rem 0.48rem !important;
  border-radius: 999px;
  border: 1px solid rgb(var(--accent-rgb) / 0.22);
  background: rgb(var(--accent-rgb) / 0.08);
  color: var(--accent);
  font-size: 0.68rem;
  font-weight: 800;
  box-shadow: none;
  direction: rtl;
}

.portal-rail-more svg {
  width: 0.82rem;
  height: 0.82rem;
  flex-shrink: 0;
}

.portal-rail-more:hover,
.portal-rail-more:focus-visible {
  border-color: rgb(var(--accent-rgb) / 0.52);
  background: rgb(var(--accent-rgb) / 0.2);
}

.portal-rail-scroll {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: clamp(10.2rem, 43vw, 11.8rem);
  gap: 0.7rem;
  overflow-x: auto;
  overflow-y: hidden;
  overscroll-behavior-x: contain;
  scroll-snap-type: x proximity;
  scrollbar-width: none;
  -ms-overflow-style: none;
  margin-inline: calc(var(--app-shell-pad) * -1);
  padding: 0.05rem var(--app-shell-pad) 0.25rem;
  direction: rtl;
}

.portal-rail-scroll::-webkit-scrollbar {
  display: none;
  width: 0;
  height: 0;
}

.portal-rail-card.ex-card {
  scroll-snap-align: start;
  position: relative;
  min-width: 0;
  height: 13.4rem;
  margin: 0;
  padding: 0;
  border-radius: 0.75rem;
  overflow: hidden;
  display: block;
  border-color: rgba(163, 160, 173, 0.16);
  background: #0a0e18;
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.28);
}

.portal-rail-card .ex-card-inner,
.portal-rail-card .ex-card-copy {
  display: contents;
}

.portal-rail-media {
  position: absolute;
  inset: 0;
  background: var(--ex-media-bg);
  overflow: hidden;
}

.portal-rail-media--lyfta,
.portal-rail-media--lyfta .portal-rail-img {
  background: #fff;
  filter: none;
}

.portal-rail-img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transform: scale(1.02);
  transition: transform 0.22s ease, filter 0.22s ease;
}

.portal-rail-img--placeholder {
  filter: saturate(0.95) contrast(1.02);
}

.portal-rail-card:hover .portal-rail-img,
.portal-rail-card:focus-visible .portal-rail-img {
  transform: scale(1.07);
  filter: saturate(1.08) contrast(1.03);
}

.portal-rail-ph {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  color: var(--ex-ph-fg);
  font-size: 0.76rem;
  font-weight: 800;
}

.portal-rail-glow {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(180deg, rgba(5, 8, 16, 0.08) 0%, rgba(5, 8, 16, 0.2) 34%, rgba(5, 8, 16, 0.92) 100%),
    radial-gradient(circle at 18% 18%, rgb(var(--accent-rgb) / 0.26), transparent 46%);
  pointer-events: none;
}

.portal-rail-copy {
  position: absolute;
  inset-inline: 0;
  bottom: 0;
  display: flex;
  flex-direction: column;
  gap: 0.36rem;
  padding: 0.68rem;
  min-width: 0;
  z-index: 1;
}

.portal-rail-kicker {
  align-self: flex-start;
  max-width: 100%;
  padding: 0.12rem 0.48rem;
  border-radius: 999px;
  color: #eef2ff;
  background: rgba(19, 18, 26, 0.48);
  border: 1px solid rgba(255, 255, 255, 0.18);
  backdrop-filter: blur(8px);
  font-size: 0.66rem;
  font-weight: 800;
  line-height: 1.45;
  white-space: nowrap;
}

.portal-rail-card-title {
  margin: 0;
  color: #f7f6f4;
  text-shadow: 0 1px 10px rgba(0, 0, 0, 0.45);
  font-size: 0.88rem;
  font-weight: 800;
  line-height: 1.42;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.portal-rail-bottom {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  min-width: 0;
}

.portal-rail-card-meta {
  margin: 0;
  min-width: 0;
  flex: 1;
  color: rgba(226, 232, 240, 0.78);
  font-size: 0.68rem;
  font-weight: 650;
  line-height: 1.45;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.portal-rail-chip {
  flex-shrink: 0;
  max-width: 100%;
  padding: 0.1rem 0.42rem;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.13);
  border: 1px solid rgba(255, 255, 255, 0.16);
  color: #eef2ff;
  font-size: 0.64rem;
  font-weight: 800;
  line-height: 1.45;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.portal-rail-empty {
  grid-column: span 2;
  margin: 0;
  padding: 0.75rem 0;
}

.portal-rail-empty--err {
  color: var(--err);
}

.portal-rail-retry {
  width: auto;
  min-height: 2rem;
  margin-top: 0.45rem;
  padding: 0.35rem 0.75rem;
  border: 1px solid color-mix(in srgb, var(--accent) 38%, var(--control-line));
  border-radius: 0.55rem;
  background: color-mix(in srgb, var(--accent) 9%, var(--surface));
  color: var(--accent);
  font-size: 0.75rem;
  font-weight: 800;
  box-shadow: none;
}

.portal-rail-retry:hover,
.portal-rail-retry:focus-visible {
  background: color-mix(in srgb, var(--accent) 14%, var(--surface));
  transform: none;
}

.app-skeleton--portal-rail {
  display: contents;
}

.app-skeleton--portal-rail .app-skeleton-item {
  width: 10.2rem;
  min-height: 13.4rem;
  border-radius: 0.75rem;
  scroll-snap-align: start;
}

html[data-theme="light"] .portal-rail-more {
  border-color: rgb(var(--accent-rgb) / 0.22);
  background: rgb(var(--accent-rgb) / 0.08);
}

html[data-theme="light"] .portal-rail-card.ex-card {
  border-color: rgba(19, 18, 26, 0.1);
  background: #e2e8f0;
  box-shadow: 0 10px 24px rgba(19, 18, 26, 0.14);
}

html[data-theme="light"] .portal-rail-glow {
  background:
    linear-gradient(180deg, rgba(19, 18, 26, 0.02) 0%, rgba(19, 18, 26, 0.16) 34%, rgba(19, 18, 26, 0.84) 100%),
    radial-gradient(circle at 18% 18%, rgb(var(--accent-rgb) / 0.2), transparent 46%);
}

html[data-theme="light"] .coach-students-list-head {
  border-color: rgb(var(--accent-rgb) / 0.14);
  background: rgb(var(--accent-rgb) / 0.045);
}

html[data-theme="light"] .coach-student-new-cta {
  border-color: rgb(var(--accent-rgb) / 0.2);
  background: rgb(var(--accent-rgb) / 0.065) !important;
  background-image: none !important;
  color: #151924 !important;
}

html[data-theme="light"] .my-ex-actions {
  background: linear-gradient(180deg, rgba(248, 250, 252, 0.96), rgba(248, 250, 252, 0.74));
}

.my-ex-form-card label ~ label {
  margin-top: 0.55rem;
}

.my-ex-form-card > label:first-of-type {
  margin-top: 0;
}

.my-ex-kind-tabs {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.4rem;
  margin-bottom: 0.65rem;
}

.my-ex-kind-tab {
  min-height: 2.45rem;
  border-radius: 0.55rem;
  border: 1px solid var(--unified-soft-border, #2c2a36);
  background: var(--unified-inner-bg, rgba(19, 18, 26, 0.28));
  color: var(--unified-muted, var(--muted));
  font: inherit;
  font-weight: 700;
  cursor: pointer;
}

.my-ex-kind-tab.is-on {
  border-color: rgb(var(--accent-rgb) / 0.72);
  background:
    linear-gradient(145deg, rgb(var(--accent-hover-rgb) / 0.2), rgba(250, 204, 21, 0.1)),
    var(--unified-inner-bg, rgba(19, 18, 26, 0.28));
  color: var(--text);
}

.my-ex-form-card .my-ex-steps-label {
  margin-top: 0.75rem;
}

.my-ex-optional-details {
  margin-top: 0.85rem;
  padding: 0.55rem 0.65rem;
  border-radius: 0.75rem;
  border: 1px dashed var(--unified-soft-border, rgb(var(--accent-rgb) / 0.32));
  background: var(--unified-inner-bg, rgba(19, 18, 26, 0.28));
}

.my-ex-optional-details summary {
  cursor: pointer;
  font-weight: 600;
  user-select: none;
}

.my-ex-optional-details-body {
  margin-top: 0.7rem;
}

.my-ex-optional-details-body > label:first-of-type {
  margin-top: 0;
}

.my-ex-composite-panel {
  margin-top: 0.85rem;
  padding: 0.8rem 0.65rem 0.65rem;
  border: 1px solid var(--unified-soft-border, rgb(var(--accent-rgb) / 0.24));
  border-radius: 0.78rem;
  background: var(--unified-inner-bg, rgba(19, 18, 26, 0.28));
}

.my-ex-composite-hint {
  margin: 0 0 0.6rem;
}

.my-ex-composite-selected,
.my-ex-composite-results {
  display: flex;
  flex-direction: column;
  gap: 0.55rem;
}

.my-ex-composite-results {
  margin-top: 0.65rem;
}

.my-ex-composite-tabs {
  margin: 0.85rem 0 0.55rem;
}

.my-ex-composite-empty,
.my-ex-composite-picked {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 0.5rem;
  align-items: center;
  padding: 0.5rem;
  border-radius: 0.55rem;
  border: 1px solid var(--unified-soft-border, #2c2a36);
  background: color-mix(in srgb, var(--unified-inner-bg, rgba(19, 18, 26, 0.28)) 82%, transparent);
}

.my-ex-composite-empty {
  display: block;
  text-align: center;
}

.my-ex-composite-retry {
  width: auto;
  min-height: 2rem;
  margin-top: 0.45rem;
  padding: 0.35rem 0.75rem;
  border: 1px solid color-mix(in srgb, var(--accent) 36%, var(--control-line));
  border-radius: 0.55rem;
  background: color-mix(in srgb, var(--accent) 8%, var(--surface));
  color: var(--accent);
  font-size: 0.75rem;
  font-weight: 800;
  box-shadow: none;
}

.my-ex-composite-retry:hover,
.my-ex-composite-retry:focus-visible {
  background: color-mix(in srgb, var(--accent) 14%, var(--surface));
  transform: none;
}

.my-ex-composite-picked {
  background:
    linear-gradient(90deg, rgb(var(--accent-rgb) / 0.16), rgba(250, 204, 21, 0.055)),
    var(--unified-inner-bg, rgba(19, 18, 26, 0.28));
}

.my-ex-composite-order {
  display: inline-grid;
  place-items: center;
  width: 1.8rem;
  height: 1.8rem;
  border-radius: 999px;
  background: rgb(var(--accent-rgb) / 0.18);
  color: var(--text);
  font-size: 0.82rem;
  font-weight: 800;
}

.my-ex-composite-title {
  min-width: 0;
  font-weight: 700;
}

.my-ex-composite-title small {
  display: block;
  margin-top: 0.12rem;
  color: var(--muted);
  font-weight: 500;
  direction: ltr;
  text-align: right;
}

.my-ex-composite-row-actions {
  display: flex;
  gap: 0.22rem;
  align-items: center;
}

.my-ex-composite-row-actions button {
  width: 1.9rem;
  min-width: 1.9rem;
  height: 1.9rem;
  min-height: 1.9rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  border-radius: 0.48rem;
  font-size: 0.82rem;
  line-height: 1;
}

.my-ex-composite-row-actions .my-ex-composite-icon-btn {
  width: 1.9rem !important;
  min-width: 1.9rem;
  height: 1.9rem;
  min-height: 1.9rem;
}

.my-ex-composite-result {
  position: relative;
}

.my-ex-composite-result .ex-card {
  padding-bottom: 0.9rem;
  padding-inline-start: 0.85rem;
  padding-inline-end: 3.25rem;
}

.my-ex-composite-result .ex-fav-btn,
.my-ex-composite-result .ex-card-edit-row {
  display: none;
}

.my-ex-composite-result-action {
  position: absolute;
  inset-inline-end: 0.65rem;
  top: 50%;
  transform: translateY(-50%);
  display: flex;
  justify-content: flex-start;
  pointer-events: none;
}

.my-ex-composite-icon-btn {
  width: 2.1rem !important;
  height: 2.1rem;
  min-width: 2.1rem;
  min-height: 2.1rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin: 0 !important;
  padding: 0 !important;
  border-radius: 0.55rem;
  border: 1px solid rgb(var(--accent-rgb) / 0.34);
  background:
    linear-gradient(145deg, rgb(var(--accent-hover-rgb) / 0.08), transparent 52%),
    color-mix(in srgb, var(--surface) 86%, var(--card));
  color: var(--text);
  box-shadow: 0 8px 16px rgba(0, 0, 0, 0.18);
  pointer-events: auto;
}

.my-ex-composite-icon-btn:hover,
.my-ex-composite-icon-btn:focus-visible {
  border-color: rgba(255, 255, 255, 0.62);
  transform: translateY(-1px);
}

.my-ex-composite-icon-add {
  background: rgb(var(--accent-rgb) / 0.92);
  border-color: rgba(34, 211, 238, 0.72);
  color: #fff;
}

.my-ex-composite-icon-danger {
  background: rgba(127, 29, 29, 0.9);
  border-color: rgba(248, 113, 113, 0.62);
  color: #fff;
}

.my-ex-composite-icon-btn.is-added {
  opacity: 0.96;
}

html[data-theme="light"] .my-ex-kind-tab,
html[data-theme="light"] .my-ex-composite-empty,
html[data-theme="light"] .my-ex-composite-picked {
  border-color: rgb(var(--accent-rgb) / 0.16);
  background: rgb(var(--accent-rgb) / 0.035);
}

html[data-theme="light"] .my-ex-composite-icon-btn {
  background: rgba(255, 255, 255, 0.96);
  color: #211f2a;
}

html[data-theme="light"] .my-ex-composite-icon-add {
  background: #ca8a04;
  color: #fff;
}

html[data-theme="light"] .my-ex-composite-icon-danger {
  background: #dc2626;
  color: #fff;
}

.my-ex-hub-body {
  margin-top: 0.25rem;
}

.my-ex-hub-actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.55rem;
  margin: 0.1rem 0 0.75rem;
  direction: ltr;
}

.my-ex-hub-new-btn {
  width: 100%;
  min-height: 2.55rem;
  margin: 0 !important;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.42rem;
  border-radius: 0.7rem;
  border: 1px solid color-mix(in srgb, var(--accent) 28%, var(--line));
  background: color-mix(in srgb, var(--accent) 8%, var(--card)) !important;
  color: var(--text);
  font-weight: 800;
  letter-spacing: 0;
  box-shadow: none !important;
  direction: rtl;
}

.my-ex-hub-new-btn--composite {
  border-color: color-mix(in srgb, var(--accent) 22%, var(--line));
  background: color-mix(in srgb, var(--surface) 88%, transparent) !important;
}

.my-ex-hub-new-btn:hover,
.my-ex-hub-new-btn:focus-visible {
  border-color: color-mix(in srgb, var(--accent) 42%, var(--line));
  background: color-mix(in srgb, var(--accent) 12%, var(--card)) !important;
}

.my-ex-hub-new-plus {
  width: 1.32rem;
  height: 1.32rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: color-mix(in srgb, var(--accent) 14%, transparent);
  border: 1px solid color-mix(in srgb, var(--accent) 30%, transparent);
  color: var(--accent);
  font-size: 1.06rem;
  line-height: 1;
  font-weight: 900;
}

.my-exercise-cards-list {
  display: flex;
  flex-direction: column;
  gap: 0.65rem;
}

.my-ex-hub-count {
  margin: 0.45rem 0 0;
  text-align: center;
}

html[data-theme="light"] .my-ex-optional-details {
  border-color: rgb(var(--accent-rgb) / 0.22);
  background: rgb(var(--accent-rgb) / 0.04);
}

.select-multi {
  width: 100%;
  border-radius: var(--radius);
  border: 1px solid var(--unified-soft-border, #2c2a36);
  background: var(--unified-inner-bg, var(--card));
  color: var(--text);
  padding: 0.35rem;
}

.my-ex-results-pad {
  margin-top: 0.35rem;
}

.my-ex-step-row {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0.35rem;
  margin-bottom: 0.5rem;
  padding: 0.5rem;
  border-radius: 0.55rem;
  border: 1px solid var(--unified-soft-border, #2c2a36);
  background: var(--unified-inner-bg, rgba(19, 18, 26, 0.28));
}

.btn-remove-step {
  font: inherit;
  font-size: 0.82rem;
  cursor: pointer;
  padding: 0.35rem 0.5rem;
  border-radius: 0.45rem;
  border: 1px solid var(--unified-soft-border, #413d4f);
  background: color-mix(in srgb, var(--unified-inner-bg, rgba(19, 18, 26, 0.28)) 86%, transparent);
  color: var(--unified-muted, var(--muted));
}

@media (min-width: 28rem) {
  .my-ex-step-row {
    grid-template-columns: 1fr 1fr auto;
    align-items: end;
  }
}

.my-ex-actions {
  position: sticky;
  top: 0.35rem;
  z-index: 8;
  display: flex;
  justify-content: flex-end;
  gap: 0.45rem;
  margin: -0.18rem 0 0.55rem;
  padding: 0.24rem 0 0.34rem;
  align-items: center;
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--bg) 94%, var(--surface)), color-mix(in srgb, var(--bg) 74%, transparent));
  backdrop-filter: blur(10px) saturate(1.05);
  -webkit-backdrop-filter: blur(10px) saturate(1.05);
}

.my-ex-save-btn {
  width: auto !important;
  min-height: 2.22rem;
  margin: 0 !important;
  padding: 0.34rem 0.68rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.42rem;
  border-radius: 999px;
  border: 1px solid rgb(var(--accent-soft-rgb) / 0.58);
  background:
    linear-gradient(145deg, rgb(var(--accent-hover-rgb) / 0.18), rgba(250, 204, 21, 0.08)),
    var(--unified-inner-bg, rgba(19, 18, 26, 0.28));
  color: var(--text);
  font-size: 0.84rem;
  font-weight: 800;
  letter-spacing: 0;
  box-shadow: none;
}

.my-ex-save-btn:hover,
.my-ex-save-btn:focus-visible {
  filter: brightness(1.05);
  border-color: rgba(187, 247, 208, 0.95);
}

.my-ex-save-icon {
  width: 1.24rem;
  height: 1.24rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  background: var(--accent-strong);
  color: #fff;
}

.my-ex-save-icon svg {
  width: 0.88rem;
  height: 0.88rem;
}

.my-ex-actions .danger-outline {
  min-height: 2.22rem;
  width: auto;
  margin: 0 !important;
  padding-inline: 0.68rem;
  white-space: nowrap;
  border-radius: 999px;
  font-size: 0.82rem;
}

.my-ex-form-msg {
  margin: -0.25rem 0 0.65rem;
}

.btn-my-ex-secondary {
  margin-top: 0.45rem;
  font-size: 0.88rem;
}

.danger-outline {
  background: transparent;
  border: 1px solid var(--err);
  color: var(--err);
}

.danger-outline:hover {
  background: rgba(255, 122, 122, 0.08);
}

.coach-student-compact-card {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 0.55rem;
  align-items: center;
  padding: 0.52rem 0.6rem;
  border-radius: 0.68rem;
  border: 1px solid var(--plan-row-bd);
  background: var(--plan-pick-bg);
}

.coach-students-list-card {
  padding-top: 0.78rem;
}

.coach-students-list-head {
  display: flex;
  align-items: stretch;
  justify-content: space-between;
  gap: 0.75rem;
  margin-bottom: 0.65rem;
  padding: 0.52rem;
  border-radius: 0.78rem;
  border: 1px solid rgb(var(--accent-rgb) / 0.18);
  background: rgb(var(--accent-rgb) / 0.07);
}

.coach-students-list-head p {
  margin: 0;
}

.coach-students-list-copy {
  min-width: 0;
  display: grid;
  align-content: center;
  gap: 0.1rem;
}

.coach-students-list-title {
  color: var(--text);
  font-size: 0.9rem;
  font-weight: 800;
  line-height: 1.35;
}

.coach-students-list-lead {
  line-height: 1.55;
}

.coach-student-new-cta {
  flex: 0 0 auto;
  align-self: center;
  min-height: 2.35rem;
  width: auto;
  max-width: 9.75rem;
  margin: 0 !important;
  padding: 0.32rem 0.48rem 0.32rem 0.74rem !important;
  border-radius: 999px;
  border: 1px solid rgb(var(--accent-rgb) / 0.28);
  background: rgb(var(--accent-rgb) / 0.09) !important;
  background-image: none !important;
  color: var(--text) !important;
  box-shadow: none !important;
  display: inline-grid;
  grid-template-columns: auto 1fr;
  column-gap: 0.42rem;
  align-items: center;
  text-align: right;
}

.coach-student-new-cta-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.55rem;
  height: 1.55rem;
  border-radius: 999px;
  color: var(--accent);
  background: color-mix(in srgb, var(--accent) 13%, transparent);
  border: 1px solid rgb(var(--accent-rgb) / 0.2);
  font-size: 1rem;
  font-weight: 900;
  line-height: 1;
}

.coach-student-new-cta-text {
  color: var(--text);
  font-size: 0.78rem;
  font-weight: 850;
  line-height: 1.2;
  white-space: nowrap;
}

.coach-student-new-cta-hint {
  display: none;
}

.coach-student-new-cta:hover {
  border-color: rgb(var(--accent-rgb) / 0.42);
  background: rgb(var(--accent-rgb) / 0.13) !important;
  transform: translateY(-1px);
}

@media (max-width: 380px) {
  .coach-students-list-head {
    flex-direction: column;
  }

  .coach-student-new-cta {
    flex-basis: auto;
    width: max-content;
    max-width: 100%;
  }
}

.coach-student-compact-title {
  margin: 0;
  font-size: 0.85rem;
  font-weight: 700;
  line-height: 1.32;
}

.coach-student-compact-sub {
  margin: 0.08rem 0 0.2rem;
}

.coach-student-compact-note {
  margin: 0.15rem 0 0.25rem;
  line-height: 1.45;
  font-size: 0.78rem;
}

.coach-student-compact-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 0.24rem;
  align-items: center;
}

.coach-student-mini-tag {
  display: inline-block;
  padding: 0.06rem 0.35rem;
  border-radius: 999px;
  font-size: 0.67rem;
  border: 1px solid var(--tag-bd);
  background: var(--tag-bg);
  color: var(--tag-fg);
}

.coach-student-compact-actions {
  display: inline-flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 0.3rem;
  align-items: center;
  max-width: 7.2rem;
}

button.coach-student-icon-btn {
  width: 2.05rem;
  height: 2.05rem;
  min-width: 2.05rem;
  margin: 0;
  padding: 0;
  border-radius: 0.5rem;
  border: 1px solid rgb(var(--accent-rgb) / 0.4);
  background: rgb(var(--accent-rgb) / 0.12);
  color: var(--app-icon-mono);
  box-shadow: none;
}

button.coach-student-icon-btn:disabled {
  opacity: 0.45;
}

.coach-student-action-svg {
  width: 1.05rem;
  height: 1.05rem;
  display: block;
  margin: 0 auto;
}

#coach-students-search {
  margin: 0.2rem 0 0.3rem;
}

#coach-students-list {
  max-height: min(54vh, 26rem);
  overflow-y: auto;
}

#coach-students-list .coach-students-empty {
  width: 100%;
  min-height: 10.5rem;
  margin: 0.45rem auto 0.2rem;
  align-items: center;
  justify-content: center;
  text-align: center;
}

#coach-students-list .coach-students-empty .app-empty-state-copy {
  width: 100%;
  justify-items: center;
  text-align: center;
}

#coach-students-list .coach-students-empty .app-empty-state-title,
#coach-students-list .coach-students-empty .app-empty-state-text {
  width: 100%;
  text-align: center;
}

#coach-students-list .coach-students-empty .app-empty-state-illustration {
  margin-inline: auto;
}

#coach-students-stats {
  margin: 0 0 0.32rem;
}

#btn-coach-student-edit-plan.secondary.wide {
  margin-top: 0.45rem;
}

.coach-student-plans-root {
  padding: 0 0 0.75rem;
  display: flex;
  flex-direction: column;
  gap: 0.45rem;
  max-height: min(62vh, 30rem);
  overflow-y: auto;
}

button.coach-student-plan-row {
  width: 100%;
  margin: 0;
  padding: 0.52rem 0.55rem 0.52rem 0.42rem;
  border-radius: 0.65rem;
  border: 1px solid var(--plan-row-bd);
  background: var(--plan-row-bg);
  color: var(--text);
  text-align: right;
  font: inherit;
  cursor: pointer;
  display: grid;
  grid-template-columns: 1fr auto;
  grid-template-rows: auto auto;
  column-gap: 0.35rem;
  align-items: center;
  box-shadow: none;
}

button.coach-student-plan-row:hover {
  border-color: rgb(var(--accent-rgb) / 0.45);
}

.coach-student-plan-row-title {
  grid-column: 1;
  grid-row: 1;
  font-weight: 700;
  font-size: 0.86rem;
  line-height: 1.32;
}

.coach-student-plan-row-meta {
  grid-column: 1;
  grid-row: 2;
  margin-top: 0.12rem;
  display: flex;
  flex-wrap: wrap;
  gap: 0.25rem;
  align-items: center;
}

.coach-student-plan-tag {
  display: inline-block;
  padding: 0.04rem 0.32rem;
  border-radius: 999px;
  font-size: 0.66rem;
  border: 1px solid var(--tag-bd);
  background: var(--tag-bg);
  color: var(--tag-fg);
}

.coach-student-plan-row-chev {
  grid-column: 2;
  grid-row: 1 / span 2;
  font-size: 1.35rem;
  font-weight: 300;
  color: var(--muted);
  line-height: 1;
}

.ex-card-edit-link {
  position: absolute;
  top: 0.4rem;
  inset-inline-end: 0.4rem;
  z-index: 3;
  width: 1.8rem !important;
  height: 1.8rem !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 0.5rem !important;
  border: 1px solid color-mix(in srgb, var(--accent) 34%, var(--ex-fav-bd)) !important;
  background: color-mix(in srgb, var(--surface) 76%, transparent) !important;
  color: color-mix(in srgb, var(--accent) 78%, var(--text)) !important;
  box-shadow: 0 2px 10px var(--ex-fav-shadow) !important;
  -webkit-backdrop-filter: blur(4px);
  backdrop-filter: blur(4px);
  cursor: pointer;
  font-family: inherit;
  line-height: 1;
}

.ex-card-edit-link:hover,
.ex-card-edit-link:focus-visible {
  border-color: color-mix(in srgb, var(--accent) 56%, transparent) !important;
  background: color-mix(in srgb, var(--accent) 12%, var(--surface)) !important;
  color: var(--accent-hover) !important;
}

.ex-card-edit-svg {
  width: 0.96rem;
  height: 0.96rem;
  display: block;
  flex-shrink: 0;
}

.profile-login-phone {
  margin: 0.12rem 0 0;
  line-height: 1.55;
  unicode-bidi: plaintext;
}

.profile-login-phone.hidden {
  display: none;
}

.offline-snapshot-banner {
  margin: 0 0 0.75rem;
}

.profile-shell {
  display: grid;
  gap: 0.72rem;
}

.profile-identity-card,
.profile-action-row,
.profile-version-card,
.profile-password-card,
.profile-account-card,
.terms-card {
  border: 1px solid var(--shell-line);
  border-radius: 0.75rem;
  background: var(--card);
  box-shadow: 0 0.75rem 1.8rem color-mix(in srgb, var(--ink) 8%, transparent);
}

.profile-identity-card {
  display: grid;
  gap: 0.95rem;
  padding: 1rem;
}

.profile-password-card {
  display: grid;
  gap: 0.85rem;
  padding: 0.9rem 1rem 1rem;
}

.profile-password-head {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 0.72rem;
}

.profile-password-fields input {
  direction: ltr;
  text-align: start;
}

.profile-password-choice-actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.6rem;
}

.profile-password-choice-actions button {
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  min-height: 3rem !important;
  margin: 0 !important;
  padding: 0.62rem 0.65rem !important;
  border-radius: 0.78rem !important;
  white-space: normal;
  overflow-wrap: anywhere;
  color: var(--brand-action-text) !important;
  font-size: 0.9rem !important;
  font-weight: 900 !important;
  line-height: 1.45;
}

.profile-password-choice-actions #btn-forgot-password {
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  min-height: 3rem !important;
  padding: 0.62rem 0.65rem !important;
  border-radius: 0.78rem !important;
  color: var(--brand-action-text) !important;
  font-size: 0.9rem !important;
  font-weight: 900 !important;
}

.profile-password-choice-actions button.hidden {
  display: none !important;
}

.profile-password-choice-actions:has(button.hidden) {
  grid-template-columns: minmax(0, 1fr);
}

.profile-identity-top {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: 0.75rem;
}

.profile-avatar,
.profile-action-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  color: var(--accent);
  background: color-mix(in srgb, var(--accent) 12%, var(--surface));
  border: 1px solid color-mix(in srgb, var(--accent) 20%, var(--shell-line));
}

.profile-avatar {
  width: 3.1rem;
  height: 3.1rem;
  border-radius: 0.95rem;
}

.profile-avatar svg {
  width: 1.55rem;
  height: 1.55rem;
}

.profile-identity-copy {
  min-width: 0;
}

.profile-kicker {
  margin: 0;
  color: var(--muted);
  font-size: 0.75rem;
  font-weight: 700;
}

.profile-display-title {
  margin: 0.08rem 0 0;
  color: var(--text);
  font-size: 1.05rem;
  font-weight: 850;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.profile-fields {
  display: grid;
  gap: 0.45rem;
}

.profile-body-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.65rem;
}

.profile-metric-field {
  display: grid;
  align-content: start;
  gap: 0.35rem;
  min-width: 0;
}

.profile-metric-field label {
  margin: 0;
}

.profile-metric-picker.weight-picker {
  margin: 0;
}

.profile-metric-picker button.weight-picker-trigger {
  min-height: 7.35rem;
  padding: 0.72rem 0.5rem;
  border-radius: 0.78rem;
}

.profile-metric-picker .weight-picker-value {
  font-size: clamp(2rem, 9vw, 2.55rem);
}

.profile-metric-picker .weight-picker-unit,
.profile-metric-picker .weight-picker-trigger-hint {
  margin-top: 0.12rem;
  font-size: 0.73rem;
  line-height: 1.35;
}

.profile-metric-note {
  min-height: 2.65em;
  margin: 0;
  line-height: 1.35;
}

.profile-fields label {
  margin-top: 0.25rem;
}

.profile-fields .profile-metric-field label {
  margin: 0;
}

.profile-fields label:first-child {
  margin-top: 0;
}

#page-profile #gender[data-custom-select-skip="1"],
#page-profile #profile-age-years[data-custom-select-skip="1"] {
  min-height: 2.75rem;
  padding: 0.56rem 0.72rem 0.56rem 2.25rem;
  border: 1px solid var(--control-line);
  border-radius: 0.5rem;
  background:
    linear-gradient(45deg, transparent 50%, var(--muted) 50%) left 1rem center / 0.42rem 0.42rem no-repeat,
    linear-gradient(135deg, var(--muted) 50%, transparent 50%) left 0.72rem center / 0.42rem 0.42rem no-repeat,
    var(--control-bg);
  color: var(--text);
  box-shadow: inset 0 1px 0 color-mix(in srgb, #ffffff 5%, transparent);
  appearance: none;
  -webkit-appearance: none;
}

#page-profile #gender[data-custom-select-skip="1"]:focus {
  border-color: color-mix(in srgb, var(--accent) 52%, var(--control-line));
  outline: none;
  box-shadow:
    0 0 0 3px color-mix(in srgb, var(--accent) 16%, transparent),
    inset 0 1px 0 color-mix(in srgb, #ffffff 8%, transparent);
}

#page-profile #gender[data-custom-select-skip="1"] option {
  background: var(--surface);
  color: var(--text);
}

#page-profile #gender[data-custom-select-skip="1"] + .app-select {
  display: none !important;
}

.profile-primary-actions {
  display: flex;
  justify-content: flex-end;
}

.profile-action-row {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 0.72rem;
  width: 100%;
  min-height: 4.05rem;
  padding: 0.72rem 0.82rem;
}

.profile-coach-request-form {
  display: grid;
  gap: 0.55rem;
}

.profile-coach-request-form textarea {
  min-height: 4.5rem;
}

.profile-coach-request-form input[type="file"] {
  display: none;
}

.profile-coach-file-chip {
  width: 100%;
}

.profile-coach-request-form #btn-enable-coach {
  width: 100% !important;
  min-width: 0;
  max-width: none;
  min-height: 3.15rem !important;
  padding: 0.72rem 0.9rem !important;
  border-radius: 0.78rem !important;
}

button.profile-action-row {
  margin: 0 !important;
  color: var(--text);
  font: inherit;
  text-align: start;
  cursor: pointer;
  box-shadow: 0 0.75rem 1.8rem color-mix(in srgb, var(--ink) 8%, transparent) !important;
}

button.profile-action-row:hover {
  border-color: color-mix(in srgb, var(--accent) 24%, var(--shell-line));
  background: color-mix(in srgb, var(--accent) 5%, var(--card)) !important;
}

a.profile-action-row,
a.profile-action-row:visited {
  color: var(--text);
  text-decoration: none;
}

a.profile-action-row:hover,
a.profile-action-row:focus-visible {
  border-color: color-mix(in srgb, var(--accent) 24%, var(--shell-line));
  background: color-mix(in srgb, var(--accent) 5%, var(--card));
  color: var(--text);
  outline: none;
}

#btn-profile-support,
#btn-profile-password-open,
#btn-profile-support .profile-action-copy strong,
#btn-profile-support .profile-action-copy small,
#btn-profile-password-open .profile-action-copy strong,
#btn-profile-password-open .profile-action-copy small {
  color: var(--text);
}

#btn-profile-support,
#btn-profile-password-open {
  grid-template-columns: auto minmax(0, 1fr);
}

.profile-invite-actions {
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  gap: 0.42rem;
  min-width: 0;
}

.profile-invite-actions .profile-row-action {
  width: auto !important;
  min-width: 4.65rem;
  max-width: none;
  padding-inline: 0.6rem !important;
}

#btn-profile-support .profile-action-copy small,
#btn-profile-password-open .profile-action-copy small {
  opacity: 0.78;
}

#btn-profile-support:hover,
#btn-profile-support:focus-visible,
#btn-profile-password-open:hover,
#btn-profile-password-open:focus-visible {
  border-color: color-mix(in srgb, var(--accent) 24%, var(--shell-line));
  background: color-mix(in srgb, var(--accent) 5%, var(--card)) !important;
  color: var(--text);
}

.profile-action-icon {
  width: 2.25rem;
  height: 2.25rem;
  border-radius: 0.65rem;
}

.profile-action-icon svg {
  width: 1.15rem;
  height: 1.15rem;
}

.profile-action-copy {
  min-width: 0;
  display: grid;
  gap: 0.1rem;
}

.profile-action-copy strong {
  color: var(--text);
  font-size: 0.9rem;
  line-height: 1.45;
}

.profile-action-copy small {
  color: var(--muted);
  font-size: 0.76rem;
  line-height: 1.5;
}

.terms-card {
  display: grid;
  gap: 1rem;
  padding: 1rem;
}

.terms-hero {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: 0.82rem;
  padding: 0.2rem 0 0.85rem;
  border-bottom: 1px solid var(--line-soft);
}

.terms-hero-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 3rem;
  height: 3rem;
  border: 1px solid color-mix(in srgb, var(--accent) 22%, var(--shell-line));
  border-radius: 0.9rem;
  background: color-mix(in srgb, var(--accent) 12%, var(--surface));
  color: var(--accent);
}

.terms-hero-icon svg {
  width: 1.48rem;
  height: 1.48rem;
}

.terms-hero h2 {
  margin: 0.08rem 0 0;
  color: var(--text);
  font-size: 1.08rem;
  font-weight: 900;
  line-height: 1.45;
}

.terms-hero p:last-child {
  margin: 0.28rem 0 0;
  color: var(--muted);
  font-size: 0.8rem;
  font-weight: 750;
}

.terms-section {
  display: grid;
  gap: 0.5rem;
  padding: 0.9rem 0 0;
  border-top: 1px solid color-mix(in srgb, var(--line-soft) 72%, transparent);
}

.terms-hero + .terms-section {
  border-top: 0;
  padding-top: 0;
}

.terms-section h3 {
  margin: 0;
  color: var(--text);
  font-size: 0.95rem;
  font-weight: 900;
  line-height: 1.6;
}

.terms-section p,
.terms-section li {
  margin: 0;
  color: color-mix(in srgb, var(--text) 82%, var(--muted));
  font-size: 0.86rem;
  font-weight: 650;
  line-height: 1.9;
}

.terms-intro {
  padding: 0.72rem 0.82rem;
  border: 1px solid color-mix(in srgb, var(--accent) 18%, var(--line-soft));
  border-radius: 0.72rem;
  background: color-mix(in srgb, var(--accent) 7%, transparent);
}

.terms-section ul {
  display: grid;
  gap: 0.28rem;
  margin: 0;
  padding-inline-start: 1.2rem;
}

.profile-row-action,
#btn-save-profile,
#btn-save-password,
#btn-forgot-password,
.profile-logout-btn,
#btn-enable-coach {
  width: 6.35rem !important;
  min-width: 6.35rem;
  max-width: 6.35rem;
  min-height: 2.15rem !important;
  margin: 0 !important;
  padding: 0.35rem 0.72rem !important;
  border-radius: 999px !important;
  border: 1px solid transparent !important;
  background: var(--accent) !important;
  color: #ffffff !important;
  box-shadow: none !important;
  font-size: 0.8rem !important;
  font-weight: 800 !important;
}

.profile-password-actions {
  display: grid;
  gap: 0.55rem;
}

.profile-password-actions #btn-save-password,
.profile-password-actions #btn-confirm-password-reset {
  justify-self: end;
}

.profile-password-head #btn-forgot-password {
  justify-self: end;
  white-space: nowrap;
}

.password-reset-auth-card {
  --phone-auth-width: min(100%, 28rem);
}

.password-change-auth-card {
  --phone-auth-width: min(100%, 28rem);
}

.password-change-fields {
  margin-top: 0.4rem;
}

.password-reset-auth-card .otp-resend-row {
  margin-top: 1rem;
}

.password-reset-auth-card #btn-request-password-reset {
  white-space: nowrap;
}

.password-reset-new-fields {
  margin-top: 0.4rem;
}

.password-reset-new-fields .profile-password-actions {
  margin-top: 0.2rem;
}

.password-reset-new-fields #btn-confirm-password-reset {
  width: 100% !important;
}

.password-change-auth-card #btn-save-password {
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  min-height: 3.15rem !important;
  margin-top: 0.35rem !important;
  border-radius: 0.82rem !important;
  border: 0 !important;
  background:
    linear-gradient(135deg, var(--brand-action-strong), var(--brand-action)),
    var(--brand-action) !important;
  color: var(--brand-action-text) !important;
  box-shadow: 0 0.65rem 1.5rem var(--brand-action-shadow) !important;
  font-size: 1rem !important;
  font-weight: 900 !important;
  line-height: 1.35 !important;
}

@media (max-width: 420px) {
  .profile-invite-row {
    grid-template-columns: auto minmax(0, 1fr);
  }

  .profile-invite-actions {
    grid-column: 2;
    justify-content: flex-start;
  }

  .profile-password-head {
    grid-template-columns: auto minmax(0, 1fr);
  }

  .profile-password-head #btn-forgot-password {
    grid-column: 2;
    justify-self: start;
  }
}

.profile-row-action:hover,
.profile-row-action:focus-visible,
#btn-save-profile:hover,
#btn-save-profile:focus-visible,
#btn-enable-coach:hover,
#btn-enable-coach:focus-visible {
  border-color: transparent !important;
  background: var(--accent-strong) !important;
  filter: none;
}

.profile-action-chevron {
  color: var(--muted);
  font-size: 1.35rem;
  line-height: 1;
}

.profile-account-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 0.75rem;
  padding: 0.75rem 0.82rem;
  background: color-mix(in srgb, var(--card) 88%, transparent);
}

.profile-account-card .profile-account-heading {
  margin: 0 0 0.12rem;
  font-size: 0.88rem;
  font-weight: 750;
  color: var(--text);
}

.profile-account-card p {
  margin-block-end: 0;
}

.profile-logout-btn {
  border-color: color-mix(in srgb, var(--err) 34%, var(--control-line)) !important;
  background: color-mix(in srgb, var(--err) 8%, var(--surface)) !important;
  color: var(--err) !important;
}

.profile-version-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 0.72rem;
  align-items: center;
  padding: 0.82rem;
}

.profile-version-copy {
  min-width: 0;
}

.profile-version-label {
  display: block;
  color: var(--muted);
  font-size: 0.75rem;
  font-weight: 700;
}

.profile-version-value {
  margin: 0.15rem 0 0;
  color: var(--text);
  font-size: 0.92rem;
  font-weight: 850;
}

.profile-version-meta {
  margin: 0.1rem 0 0;
}

.profile-version-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 0.42rem;
}

.profile-version-feedback {
  grid-column: 1 / -1;
  margin: 0;
}

@media (max-width: 360px) {
  .profile-action-row,
  .profile-version-card,
  .profile-account-card {
    grid-template-columns: auto minmax(0, 1fr);
  }

  .profile-row-action,
  .profile-action-chevron,
  .profile-version-actions,
  .profile-logout-btn {
    grid-column: 2;
    justify-self: end;
  }

  .profile-account-card {
    grid-template-columns: minmax(0, 1fr);
    align-items: stretch;
  }

  .profile-account-card .profile-logout-btn {
    grid-column: 1;
    justify-self: end;
    width: 6.35rem !important;
    max-width: 100%;
  }

  #page-profile .profile-version-actions {
    flex-direction: column;
    align-items: flex-end;
    justify-self: stretch;
  }

  #page-profile .profile-version-check-btn,
  #page-profile .profile-version-apply-btn {
    width: 6.35rem !important;
    max-width: 6.35rem;
  }
}

.profile-support-head,
.profile-support-history-head,
.support-ticket-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
}

.profile-support-kicker,
.profile-support-title {
  margin: 0;
}

.profile-support-title {
  font-size: 1rem;
  line-height: 1.6;
}

.profile-support-icon {
  width: 2.5rem;
  height: 2.5rem;
  border-radius: 0.8rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--accent-soft);
  background: rgb(var(--accent-rgb) / 0.12);
  border: 1px solid rgb(var(--accent-rgb) / 0.22);
  flex-shrink: 0;
}

.profile-support-docs-hint {
  margin: 0.45rem 0 0;
}

.support-layout {
  display: grid;
  gap: 0.85rem;
}

.support-section-title,
.support-chat-title {
  margin: 0;
  font-size: 1rem;
  line-height: 1.6;
}

.support-new-card.hidden,
.support-chat-panel.hidden {
  display: none;
}

.support-new-actions {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 0.55rem;
  align-items: center;
}

.support-new-actions button {
  margin-top: 0.85rem;
}

.support-thread-card,
.support-chat-card {
  overflow: hidden;
}

.support-thread-head,
.support-chat-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
}

.support-thread-head button {
  width: auto;
  min-width: 7rem;
  margin: 0;
  white-space: nowrap;
}

.support-thread-list {
  display: grid;
  gap: 0.55rem;
  margin-top: 0.8rem;
}

button.support-thread-row {
  width: 100%;
  margin: 0;
  padding: 0.72rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.65rem;
  text-align: right;
  color: var(--text);
  background: rgba(10, 9, 14, 0.3);
  border: 1px solid rgba(163, 160, 173, 0.14);
  box-shadow: none;
}

button.support-thread-row.is-active {
  border-color: rgb(var(--accent-rgb) / 0.48);
  background: rgb(var(--accent-rgb) / 0.1);
}

.support-thread-row-main {
  min-width: 0;
  display: grid;
  gap: 0.2rem;
}

.support-thread-row-main strong,
.support-thread-row-main span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.support-thread-row-main span {
  color: var(--muted);
  font-size: 0.76rem;
}

.support-chat-empty {
  color: var(--muted);
  text-align: center;
  padding: 1.4rem 0.75rem;
  font-size: 0.9rem;
}

.support-chat-body {
  display: flex;
  flex-direction: column;
  gap: 0.65rem;
  min-height: 18rem;
  max-height: min(48vh, 28rem);
  overflow: auto;
  padding: 0.85rem 0.1rem;
  scroll-behavior: smooth;
}

.support-chat-message {
  display: flex;
  min-width: 0;
}

.support-chat-message.is-user {
  justify-content: flex-start;
}

.support-chat-message.is-admin {
  justify-content: flex-end;
}

.support-chat-bubble {
  min-width: 0;
  max-width: min(82%, 26rem);
  padding: 0.7rem 0.78rem 0.5rem;
  border-radius: 0.95rem;
  border: 1px solid rgba(163, 160, 173, 0.13);
  background: rgba(163, 160, 173, 0.1);
  overflow-wrap: anywhere;
  word-break: break-word;
}

.support-chat-message.is-user .support-chat-bubble {
  color: #16151d;
  background: linear-gradient(135deg, rgb(var(--accent-rgb) / 0.9), rgb(var(--accent-strong-rgb) / 0.82));
  border-color: rgb(var(--accent-rgb) / 0.24);
  border-bottom-right-radius: 0.32rem;
}

.support-chat-message.is-admin .support-chat-bubble {
  background: rgba(34, 197, 94, 0.09);
  border-color: rgba(34, 197, 94, 0.18);
  border-bottom-left-radius: 0.32rem;
}

.support-chat-bubble p {
  margin: 0;
  font-size: 0.9rem;
  line-height: 1.8;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  word-break: break-word;
}

.support-chat-bubble time {
  display: block;
  margin-top: 0.35rem;
  color: rgba(22, 21, 29, 0.68);
  font-size: 0.68rem;
}

.support-chat-message.is-admin .support-chat-bubble time {
  color: var(--muted);
}

.support-chat-compose {
  padding-top: 0.75rem;
  border-top: 1px solid var(--line-soft);
}

.support-chat-compose textarea {
  min-height: 2.6rem;
  max-height: 8rem;
}

.support-chat-compose button {
  height: 2.55rem;
  margin: 0;
  padding: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
}

@media (min-width: 880px) {
  .support-layout {
    grid-template-columns: minmax(17rem, 0.9fr) minmax(0, 1.4fr);
    align-items: start;
  }

  .support-new-card {
    grid-column: 1 / -1;
  }

  .support-chat-card {
    min-height: 28rem;
  }
}

.support-home-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 0.85rem;
  align-items: center;
  padding: 1rem;
  margin-bottom: 0.85rem;
  border: 1px solid var(--line-soft);
  border-radius: 0.8rem;
  background:
    linear-gradient(135deg, rgb(var(--accent-rgb) / 0.11), rgba(34, 197, 94, 0.05)),
    rgba(10, 9, 14, 0.28);
}

.support-home-kicker,
.support-home-hero h2,
.support-home-hero p {
  margin: 0;
}

.support-home-kicker {
  color: #7c2d12;
  font-size: 0.75rem;
  font-weight: 800;
}

.support-home-hero h2 {
  margin-top: 0.15rem;
  font-size: 1.05rem;
  line-height: 1.7;
}

button.support-home-new {
  width: auto;
  min-width: 7.5rem;
  margin: 0;
  white-space: nowrap;
}

.support-limit-note {
  margin: 0 0 0.75rem;
  color: var(--muted);
  font-size: 0.82rem;
}

.support-thread-list--page {
  margin-top: 0;
}

a.support-thread-row {
  width: 100%;
  min-height: 4.4rem;
  padding: 0.78rem 0.82rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.7rem;
  text-decoration: none;
  color: #16151d;
  border: 1px solid rgba(154, 52, 18, 0.32);
  border-radius: 0.8rem;
  background:
    linear-gradient(145deg, rgb(var(--accent-rgb) / 0.76), rgb(var(--accent-hover-rgb) / 0.42)),
    #fed7aa;
  box-shadow: 0 10px 24px rgba(154, 52, 18, 0.16);
}

a.support-thread-row .support-thread-row-main strong,
a.support-thread-row .support-thread-row-main span {
  color: #16151d;
}

a.support-thread-row .support-thread-row-main span {
  opacity: 0.82;
}

a.support-thread-row .support-ticket-status {
  background: rgba(255, 247, 237, 0.62);
  color: #16151d;
}

a.support-thread-row .support-ticket-status.is-status-open {
  color: #064e3b;
  background: rgba(167, 243, 208, 0.82);
  border: 1px solid rgba(5, 150, 105, 0.24);
}

a.support-thread-row .support-ticket-status.is-status-inreview {
  color: #7c2d12;
  background: rgba(254, 215, 170, 0.9);
  border: 1px solid rgb(var(--accent-strong-rgb) / 0.26);
}

a.support-thread-row .support-ticket-status.is-status-resolved {
  color: #1e3a8a;
  background: rgba(191, 219, 254, 0.86);
  border: 1px solid rgba(37, 99, 235, 0.2);
}

a.support-thread-row .support-ticket-status.is-status-dismissed {
  color: #4a4656;
  background: rgba(226, 232, 240, 0.86);
  border: 1px solid rgba(100, 116, 139, 0.18);
}

.support-new-card,
.support-chat-card {
  border-radius: 0.8rem;
}

.support-quota-hint,
.support-upload-quota {
  margin: 0.45rem 0 0;
}

.support-ticket-page-head {
  position: relative;
  z-index: 3;
  margin-bottom: 0.55rem;
  padding-top: 0.35rem;
  flex-shrink: 0;
}

.support-close-ticket {
  width: auto;
  min-width: 6.5rem;
  margin: 0;
  padding-inline: 0.8rem;
  white-space: nowrap;
}

.support-close-ticket.hidden {
  display: none;
}

.support-chat-card {
  padding: 0;
  min-height: 0;
}

#page-support-ticket {
  height: 100%;
  min-height: 0;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
}

#page-support-ticket .support-chat-card {
  height: 100%;
  min-height: 0;
  display: grid;
}

#page-support-ticket .support-chat-empty {
  align-self: center;
}

.support-chat-panel {
  display: grid;
  height: 100%;
  min-height: 0;
  grid-template-rows: minmax(0, 1fr) auto auto;
}

.support-chat-body {
  min-height: 0;
  max-height: none;
  overflow-y: auto;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
  padding: 1rem;
}

.support-chat-compose {
  position: relative;
  z-index: 2;
  padding: 0.75rem;
  background:
    linear-gradient(180deg, rgba(10, 9, 14, 0.08), rgba(10, 9, 14, 0.32)),
    rgba(10, 9, 14, 0.2);
}

.support-chat-inputs {
  display: grid;
  gap: 0.35rem;
}

.support-composer-bar {
  display: grid;
  grid-template-columns: 2.55rem minmax(0, 1fr) 2.55rem;
  gap: 0.35rem;
  align-items: end;
  padding: 0.35rem;
  border: 1px solid rgba(163, 160, 173, 0.16);
  border-radius: 1.35rem;
  background: rgba(19, 18, 26, 0.7);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
}

.support-chat-inputs textarea,
.support-composer-bar textarea {
  margin: 0;
  min-height: 2.55rem;
  max-height: 7rem;
  padding: 0.66rem 0.2rem;
  border: 0;
  background: transparent;
  box-shadow: none;
  resize: none;
}

.support-composer-bar textarea:focus {
  outline: none;
  box-shadow: none;
}

.support-composer-bar button#btn-support-chat-send {
  width: 2.55rem;
  min-width: 2.55rem;
  color: #16151d;
  background: linear-gradient(135deg, var(--accent-hover), var(--accent-soft));
  box-shadow: 0 8px 18px rgb(var(--accent-strong-rgb) / 0.24);
}

.support-file-chip {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.55rem;
  min-width: 2.55rem;
  height: 2.55rem;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 999px;
  color: #16151d;
  background: rgb(var(--accent-rgb) / 0.72);
  cursor: pointer;
  transition: transform 0.16s ease, background 0.16s ease, color 0.16s ease;
}

.support-file-chip:hover {
  transform: translateY(-1px);
  color: #16151d;
  background: rgb(var(--accent-soft-rgb) / 0.86);
}

.support-file-chip.is-selected {
  color: #052e16;
  background: #86efac;
}

.support-file-chip:has(input:disabled) {
  cursor: not-allowed;
  opacity: 0.5;
}

.support-file-chip input {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
  pointer-events: none;
}

.support-file-name {
  margin: 0 0.5rem;
  color: var(--accent-soft);
  font-size: 0.74rem;
  font-weight: 700;
  line-height: 1.6;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.support-file-name.hidden {
  display: none;
}

.support-attachments {
  display: grid;
  gap: 0.4rem;
  margin-top: 0.55rem;
  min-width: 0;
}

.support-attachment {
  min-width: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.55rem;
  color: inherit;
  text-decoration: none;
  border-radius: 0.62rem;
  padding: 0.42rem 0.55rem;
  border: 0;
  background: rgba(255, 255, 255, 0.12);
  font: inherit;
  text-align: right;
  cursor: pointer;
}

.support-attachment.is-media {
  display: grid;
  padding: 0.35rem;
}

.support-attachment.is-media img,
.support-attachment.is-media video {
  width: min(100%, 18rem);
  max-height: 14rem;
  display: block;
  border-radius: 0.55rem;
  object-fit: cover;
  background: rgba(0, 0, 0, 0.18);
}

.support-attachment.is-media span {
  padding: 0.35rem 0.2rem 0.1rem;
}

.support-attachment.is-broken::after {
  content: "نمایش فایل ممکن نیست";
  color: inherit;
  opacity: 0.78;
  font-size: 0.75rem;
}

.support-attachment span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.support-attachment small {
  opacity: 0.78;
  white-space: nowrap;
}

html[data-theme="light"] .support-home-hero {
  background:
    linear-gradient(145deg, rgb(var(--accent-strong-rgb) / 0.1), rgba(202, 138, 4, 0.055)),
    rgba(255, 255, 255, 0.88);
}

html[data-theme="light"] .support-chat-compose {
  background:
    linear-gradient(180deg, rgba(255, 247, 237, 0.4), rgba(255, 247, 237, 0.82)),
    #fff7ed;
}

html[data-theme="light"] .support-chat-card {
  border-color: rgba(154, 52, 18, 0.14);
  background:
    linear-gradient(180deg, rgba(255, 247, 237, 0.58), rgba(255, 251, 245, 0.94)),
    #fff7ed;
}

html[data-theme="light"] .support-chat-body {
  background:
    radial-gradient(circle at top right, rgb(var(--accent-rgb) / 0.09), transparent 34%),
    linear-gradient(180deg, rgba(255, 247, 237, 0.52), rgba(255, 251, 245, 0.82));
}

html[data-theme="light"] .support-chat-message.is-user .support-chat-bubble {
  color: #16151d;
  background:
    linear-gradient(135deg, rgb(var(--accent-rgb) / 0.72), rgb(var(--accent-soft-rgb) / 0.76)),
    #fed7aa;
  border-color: rgba(154, 52, 18, 0.22);
  box-shadow: 0 8px 20px rgba(154, 52, 18, 0.12);
}

html[data-theme="light"] .support-chat-message.is-admin .support-chat-bubble {
  color: #16151d;
  background:
    linear-gradient(135deg, rgba(254, 243, 199, 0.72), rgba(255, 247, 237, 0.96)),
    #fff7ed;
  border-color: rgba(154, 52, 18, 0.16);
  box-shadow: 0 8px 18px rgba(120, 53, 15, 0.08);
}

html[data-theme="light"] .support-chat-bubble time,
html[data-theme="light"] .support-chat-message.is-admin .support-chat-bubble time {
  color: rgba(22, 21, 29, 0.66);
}

html[data-theme="light"] .support-attachment {
  background: rgba(255, 251, 245, 0.64);
  border: 1px solid rgba(154, 52, 18, 0.14);
}

html[data-theme="light"] .support-composer-bar {
  border-color: rgba(154, 52, 18, 0.18);
  background: #fffaf5;
}

html[data-theme="light"] .support-composer-bar textarea {
  color: #16151d;
}

html[data-theme="light"] .support-file-chip {
  color: #16151d;
  background: rgb(var(--accent-rgb) / 0.66);
}

html[data-theme="light"] a.support-thread-row {
  background:
    linear-gradient(145deg, rgb(var(--accent-rgb) / 0.76), rgb(var(--accent-hover-rgb) / 0.42)),
    #fed7aa;
  border-color: rgba(154, 52, 18, 0.32);
  color: #16151d;
}

html[data-theme="light"] a.support-thread-row .support-thread-row-main strong,
html[data-theme="light"] a.support-thread-row .support-thread-row-main span {
  color: #16151d;
}

@media (max-width: 520px) {
  .support-home-hero {
    grid-template-columns: 1fr;
  }

  button.support-home-new {
    width: 100%;
  }
}

/* AI coach workspace: conversation first, compact controls, flat request rows. */
:is(#page-ai-plan-quick, #page-ai-plan, #page-ai-plan-requests, #page-plan-ai-revision) {
  --ai-space-1: 0.38rem;
  --ai-space-2: 0.62rem;
  --ai-space-3: 0.88rem;
  --ai-space-4: 1.15rem;
  --ai-surface: color-mix(in srgb, var(--control-bg) 78%, var(--card));
  --ai-line: color-mix(in srgb, var(--control-line) 88%, transparent);
  letter-spacing: 0;
}

:is(#page-ai-plan-quick, #page-ai-plan, #page-ai-plan-requests, #page-plan-ai-revision) .page-head {
  margin-bottom: var(--ai-space-3);
  padding-inline: 0.1rem;
}

:is(#page-ai-plan-quick, #page-ai-plan, #page-ai-plan-requests, #page-plan-ai-revision) .page-head-heading-row {
  align-items: flex-end;
}

:is(#page-ai-plan-quick, #page-ai-plan, #page-ai-plan-requests, #page-plan-ai-revision) .page-head h1 {
  margin: 0;
  font-size: clamp(1.22rem, 5.5vw, 1.52rem);
  line-height: 1.42;
  font-weight: 850;
}

:is(#page-ai-plan-quick, #page-ai-plan, #page-ai-plan-requests, #page-plan-ai-revision) .page-head-context {
  max-width: 42rem;
  margin-top: 0.2rem;
  font-size: 0.8rem;
  line-height: 1.75;
}

.ai-workspace-eyebrow {
  display: block;
  margin-bottom: 0.08rem;
  color: var(--accent);
  font-size: 0.62rem;
  font-weight: 850;
  line-height: 1.2;
}

#page-ai-plan-quick .ai-plan-panel,
#page-ai-plan-requests .ai-plan-requests-panel {
  padding: 0;
  border: 0;
  background: transparent !important;
}

.ai-plan-profile-context,
.ai-plan-builder,
.ai-plan-recent {
  display: grid;
  gap: var(--ai-space-2);
  min-width: 0;
  border: 1px solid var(--ai-line);
  border-radius: 0.5rem;
  padding: 0.72rem;
  background: var(--ai-surface);
}

.ai-plan-profile-context-head,
.ai-plan-section-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.7rem;
  min-width: 0;
}

.ai-plan-profile-context-head > strong,
.ai-plan-section-heading strong {
  color: var(--text);
  font-size: 0.82rem;
  font-weight: 800;
  line-height: 1.5;
}

.ai-plan-section-heading > div {
  display: grid;
  gap: 0.02rem;
}

.ai-plan-section-heading > div > span {
  color: var(--muted);
  font-size: 0.62rem;
  font-weight: 650;
}

.ai-plan-section-heading > a {
  flex: 0 0 auto;
  color: var(--accent);
  font-size: 0.7rem;
  font-weight: 750;
  text-decoration: none;
}

.ai-plan-quick-state {
  min-height: 1.5rem;
  padding: 0.08rem 0.42rem;
  border-radius: 0.4rem;
  font-size: 0.62rem;
}

.ai-plan-quick-profile-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 0;
  padding-top: 0.15rem;
}

#page-ai-plan-quick .ai-plan-quick-profile-chip {
  min-height: auto;
  border: 0 !important;
  border-radius: 0;
  padding: 0 0.52rem;
  color: var(--muted);
  background: transparent !important;
  box-shadow: none !important;
  font-size: 0.72rem;
  font-weight: 650;
}

#page-ai-plan-quick .ai-plan-quick-profile-chip:first-child {
  padding-inline-start: 0;
}

#page-ai-plan-quick .ai-plan-quick-profile-chip + .ai-plan-quick-profile-chip {
  border-inline-start: 1px solid var(--ai-line);
}

#page-ai-plan-quick .ai-plan-chat,
#page-plan-ai-revision .ai-plan-chat {
  gap: var(--ai-space-2);
  padding: 0;
  border: 0;
  background: transparent;
}

.ai-plan-chat-head {
  min-height: 2.2rem;
  padding-inline: 0.12rem;
}

.ai-plan-chat-head strong,
.ai-plan-chat-head h2 {
  font-size: 0.84rem;
  font-weight: 800;
}

.ai-plan-chat-messages {
  height: clamp(16rem, 45dvh, 25rem);
  max-height: 25rem;
  gap: 0.58rem;
  padding: 0.72rem 0.5rem;
  border: 0;
  border-block: 1px solid var(--ai-line);
  border-radius: 0;
  background: transparent;
  scrollbar-gutter: auto;
}

.ai-plan-chat-message {
  max-width: min(90%, 35rem);
  padding: 0.62rem 0.72rem;
  border-radius: 0.5rem;
  font-size: 0.82rem;
  line-height: 1.85;
  box-shadow: none;
}

.ai-plan-chat-message.is-assistant {
  border-color: var(--ai-line);
  color: var(--text);
  background: var(--ai-surface);
}

.ai-plan-chat-message.is-user {
  border-color: rgb(var(--accent-rgb) / 0.22);
  background: rgb(var(--accent-rgb) / 0.08);
}

.ai-plan-chat-composer {
  bottom: calc(0.35rem + env(safe-area-inset-bottom));
  grid-template-columns: minmax(0, 1fr) 2.65rem;
  gap: 0.3rem;
  padding: 0.25rem;
  border-radius: 0.5rem;
  background: var(--card);
  box-shadow: 0 0.45rem 1.35rem rgb(0 0 0 / 0.1);
  backdrop-filter: none;
}

.ai-plan-chat-composer textarea {
  min-height: 2.65rem;
  padding: 0.52rem 0.58rem;
  font-size: 0.82rem;
}

.ai-plan-chat-composer .ai-plan-chat-send {
  width: 2.65rem;
  min-width: 2.65rem;
  min-height: 2.65rem;
  padding: 0;
  border-radius: 0.42rem;
  color: #fff !important;
  background: var(--accent) !important;
  box-shadow: none !important;
}

.ai-plan-chat-send svg {
  width: 1.15rem;
  height: 1.15rem;
}

.ai-plan-builder {
  gap: 0.72rem;
}

.ai-plan-quick-presets {
  grid-template-columns: minmax(7.5rem, 0.7fr) minmax(0, 1.3fr);
  align-items: start;
  gap: 0.5rem;
}

.ai-plan-session-counts {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.35rem;
}

.ai-plan-session-count-item {
  gap: 0.18rem;
}

.ai-plan-session-count-item > span {
  color: var(--muted);
  font-size: 0.62rem;
}

.ai-plan-session-count-item select,
.ai-plan-quick-select {
  min-height: 2.55rem;
  border-radius: 0.42rem;
  font-size: 0.78rem;
}

.ai-plan-quick-more {
  border: 0;
  border-top: 1px solid var(--ai-line);
  border-radius: 0;
}

.ai-plan-quick-more summary {
  min-height: 2.35rem;
  padding: 0.48rem 0.08rem 0.18rem;
  font-size: 0.76rem;
}

.ai-plan-quick-more-body {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.38rem 0.52rem;
  padding: 0.62rem 0 0;
}

.ai-plan-quick-more-body label {
  margin-top: 0.15rem;
}

.ai-plan-quick-more-body label small {
  color: var(--muted);
  font-size: 0.62rem;
  font-weight: 500;
}

.ai-plan-quick-more-body :is(input, select, button) {
  min-height: 2.55rem;
  border-radius: 0.42rem;
}

.ai-plan-chat-finish {
  min-height: 3.25rem;
  border-radius: 0.48rem;
}

.ai-plan-chat-finish strong {
  font-size: 0.84rem;
}

.ai-plan-recent {
  padding-bottom: 0;
}

.ai-plan-quick-recent-list {
  display: grid;
  margin-inline: -0.72rem;
}

.ai-plan-recent-row {
  display: grid;
  grid-template-columns: 0.58rem minmax(0, 1fr) auto;
  align-items: center;
  gap: 0.55rem;
  min-height: 3.55rem;
  padding: 0.52rem 0.72rem;
  border-top: 1px solid var(--ai-line);
  color: var(--text);
  text-decoration: none;
}

.ai-plan-recent-indicator {
  width: 0.52rem;
  height: 0.52rem;
  border: 1.5px solid var(--muted);
  border-radius: 50%;
}

.ai-plan-recent-indicator.is-done {
  border-color: #2ca66f;
  background: #2ca66f;
}

.ai-plan-recent-indicator.is-loading {
  border-color: var(--accent);
  border-inline-start-color: transparent;
  animation: ai-plan-request-spin 0.9s linear infinite;
}

.ai-plan-recent-copy {
  min-width: 0;
  display: grid;
  gap: 0.08rem;
}

.ai-plan-recent-copy strong {
  overflow: hidden;
  color: var(--text);
  font-size: 0.76rem;
  font-weight: 750;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.ai-plan-recent-copy span,
.ai-plan-recent-status {
  color: var(--muted);
  font-size: 0.62rem;
  line-height: 1.5;
}

.ai-plan-recent-status {
  max-width: 5.8rem;
  text-align: end;
}

.ai-plan-recent-empty {
  padding: 0.78rem 0.72rem;
  border-top: 1px solid var(--ai-line);
  color: var(--muted);
  font-size: 0.72rem;
  text-decoration: none;
}

#page-ai-plan-requests .ai-plan-requests-actions {
  width: 100%;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) 2.25rem;
}

#page-ai-plan-requests :is(.ai-plan-requests-create, .ai-plan-requests-create--full) {
  border-radius: 0.45rem !important;
}

#page-ai-plan-requests .ai-plan-requests-list {
  overflow: hidden;
  gap: 0;
  border: 1px solid var(--ai-line);
  border-radius: 0.5rem;
  background: var(--ai-surface);
}

#page-ai-plan-requests .ai-plan-requests-filters {
  padding: 0.5rem;
  border-bottom: 1px solid var(--ai-line);
}

#page-ai-plan-requests .ai-plan-request-row,
#page-ai-plan-requests .ai-plan-request-row:is(.ai-plan-request-row--done, .ai-plan-request-row--draft, .ai-plan-request-row--review) {
  min-height: 4.35rem;
  border: 0;
  border-radius: 0;
  padding: 0.65rem 0.72rem;
  background: transparent !important;
  box-shadow: none;
}

#page-ai-plan-requests .ai-plan-request-row + .ai-plan-request-row {
  border-top: 1px solid var(--ai-line);
}

#page-ai-plan-requests .ai-plan-request-status {
  border-radius: 0.38rem;
}

#page-ai-plan .ai-plan-panel {
  padding: 0.76rem;
  border-radius: 0.5rem;
}

#page-ai-plan .ai-plan-mode-tabs,
#page-plan-ai-revision .plan-ai-revision-mode {
  border-radius: 0.48rem;
}

#page-ai-plan .ai-plan-step {
  gap: 0.58rem;
}

#page-ai-plan .ai-plan-step :is(input, textarea, select),
#page-plan-ai-revision :is(input, textarea, select, .app-select-trigger) {
  border-radius: 0.42rem;
  font-size: 0.82rem;
}

#page-plan-ai-revision .plan-ai-revision-content {
  gap: 0.68rem;
}

#page-plan-ai-revision .plan-ai-revision-mode button {
  min-height: 2.35rem;
  border-radius: 0.38rem;
  font-size: 0.75rem;
}

#page-plan-ai-revision .plan-ai-revision-chat {
  padding: 0.72rem;
  border: 1px solid var(--ai-line);
  border-radius: 0.5rem;
  background: var(--ai-surface);
}

#page-plan-ai-revision :is(.plan-ai-revision-primary, .plan-ai-revision-more) {
  border-radius: 0.5rem;
}

@media (max-width: 520px) {
  .ai-plan-quick-presets {
    grid-template-columns: 1fr;
  }

  .ai-plan-quick-presets .ai-plan-session-count-group {
    grid-column: auto;
  }

  .ai-plan-session-counts {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .ai-plan-quick-more-body {
    grid-template-columns: minmax(0, 1fr);
  }

  .ai-plan-chat-messages {
    height: clamp(15rem, 42dvh, 22rem);
  }

  .ai-plan-request-side {
    align-self: center;
  }
}

@media (max-width: 360px) {
  .ai-plan-session-counts {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .ai-plan-recent-row {
    grid-template-columns: 0.5rem minmax(0, 1fr);
  }

  .ai-plan-recent-status {
    display: none;
  }
}

.profile-support-history-head {
  margin-top: 1rem;
  padding-top: 0.9rem;
  border-top: 1px solid var(--line-soft);
}

.profile-support-history-head h3 {
  margin: 0;
  font-size: 0.95rem;
}

button#btn-support-refresh {
  width: 2.3rem;
  height: 2.3rem;
  min-width: 2.3rem;
  padding: 0;
  margin: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 0.75rem;
}

.support-ticket-list {
  display: grid;
  gap: 0.65rem;
  margin-top: 0.75rem;
}

.support-ticket,
.support-empty {
  border-radius: 0.8rem;
  border: 1px solid rgba(163, 160, 173, 0.14);
  background: rgba(10, 9, 14, 0.32);
  padding: 0.78rem;
}

.support-empty {
  color: var(--muted);
  font-size: 0.86rem;
  text-align: center;
}

.support-ticket h3,
.support-ticket p {
  margin: 0;
}

.support-ticket h3 {
  margin-top: 0.45rem;
  font-size: 0.95rem;
  line-height: 1.55;
}

.support-ticket-status {
  display: inline-flex;
  align-items: center;
  min-height: 1.45rem;
  padding: 0.12rem 0.5rem;
  border-radius: 999px;
  background: rgb(var(--accent-soft-rgb) / 0.82);
  color: #16151d;
  font-size: 0.72rem;
  font-weight: 700;
}

.support-ticket-date,
.support-ticket-type,
.support-ticket-waiting {
  color: var(--text);
  font-size: 0.76rem;
  opacity: 0.82;
}

.support-ticket-message {
  margin-top: 0.45rem !important;
  color: var(--text);
  font-size: 0.88rem;
  line-height: 1.8;
  white-space: pre-wrap;
}

.support-ticket-reply {
  margin-top: 0.65rem;
  padding: 0.65rem;
  border-radius: 0.7rem;
  background: rgba(34, 197, 94, 0.08);
  border: 1px solid rgba(34, 197, 94, 0.18);
}

.support-ticket-reply span {
  display: block;
  color: #86efac;
  font-size: 0.75rem;
  font-weight: 700;
  margin-bottom: 0.25rem;
}

.support-ticket-reply p {
  font-size: 0.86rem;
  line-height: 1.75;
  white-space: pre-wrap;
}

.support-ticket-waiting {
  margin-top: 0.65rem !important;
}

html[data-theme="light"] .support-ticket,
html[data-theme="light"] .support-empty {
  background: rgba(255, 255, 255, 0.72);
  border-color: rgba(19, 18, 26, 0.08);
}

html[data-theme="light"] .support-ticket-status {
  color: #16151d;
  background: rgb(var(--accent-soft-rgb) / 0.82);
}

html[data-theme="light"] .support-ticket-reply {
  background: rgba(22, 163, 74, 0.08);
  border-color: rgba(22, 163, 74, 0.16);
}

html[data-theme="light"] .support-ticket-reply span {
  color: #15803d;
}

.profile-version-card {
  margin-bottom: 0.25rem;
}

.profile-version-kicker {
  margin: 0 0 0.5rem;
  font-size: 0.72rem;
  letter-spacing: 0.02em;
}

.profile-version-label {
  display: block;
  font-size: 0.82rem;
  font-weight: 600;
  color: var(--text);
  margin-bottom: 0.2rem;
}

.profile-version-value {
  margin: 0;
  font-family: ui-monospace, "Cascadia Code", Consolas, monospace;
  font-size: 0.92rem;
  font-weight: 600;
  letter-spacing: 0.03em;
  word-break: break-all;
}

.profile-version-meta {
  margin: 0.2rem 0 0;
  font-size: 0.76rem;
  line-height: 1.45;
}

.profile-version-meta.hidden {
  display: none;
}

.profile-version-actions {
  display: flex;
  flex-direction: column;
  gap: 0.45rem;
  margin-top: 0.75rem;
}

.profile-version-check-btn,
.profile-version-apply-btn {
  margin: 0;
}

.profile-version-apply-btn.hidden {
  display: none !important;
}

.profile-version-feedback.msg {
  margin: 0.55rem 0 0;
  min-height: 1.2em;
}

/* Profile refresh: compact account surface with row actions instead of stacked button cards. */
#page-profile .profile-version-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 0.58rem;
  align-items: stretch;
  padding: 0.78rem 0.82rem;
  margin-bottom: 0;
}

#page-profile .profile-version-label {
  color: var(--muted);
  font-size: 0.72rem;
  font-weight: 700;
  margin-bottom: 0;
}

#page-profile .profile-version-value {
  display: inline-flex;
  width: max-content;
  max-width: 100%;
  margin: 0.18rem 0 0;
  padding: 0.16rem 0.48rem;
  border-radius: 999px;
  border: 1px solid color-mix(in srgb, var(--accent) 24%, var(--control-line));
  background: color-mix(in srgb, var(--accent) 9%, var(--surface));
  color: var(--text);
  font-family: ui-monospace, "Cascadia Code", Consolas, monospace;
  font-size: 0.8rem;
  font-weight: 800;
  letter-spacing: 0;
  line-height: 1.35;
}

#page-profile .profile-version-actions {
  justify-self: end;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 0.38rem;
  margin-top: 0.1rem;
}

#page-profile .profile-version-check-btn,
#page-profile .profile-version-apply-btn {
  width: 6.35rem !important;
  min-width: 6.35rem;
  max-width: 6.35rem;
  min-height: 2.15rem !important;
  padding: 0.35rem 0.72rem !important;
  font-size: 0.8rem !important;
}

#page-profile .profile-version-feedback.msg {
  grid-column: 1 / -1;
  margin: 0.05rem 0 0;
}

@media (max-width: 520px) {
  #page-profile .profile-version-actions {
    flex-direction: column;
    align-items: flex-end;
    justify-self: stretch;
    width: 100%;
  }

  #page-profile .profile-version-check-btn,
  #page-profile .profile-version-apply-btn {
    flex: 0 0 auto;
    width: 6.35rem !important;
    max-width: 6.35rem;
  }
}

.plans-list-root {
  padding: 0 0 1rem;
}

.plan-summary-card {
  display: block;
  width: 100%;
  margin-top: 0.5rem;
  padding: 0.72rem 0.82rem;
  border-radius: var(--radius);
  border: 1px solid var(--plan-row-bd);
  background: var(--plan-row-bg);
  font: inherit;
  text-align: right;
  cursor: pointer;
  color: var(--text);
}

.plan-summary-card:hover {
  border-color: rgb(var(--accent-rgb) / 0.45);
}

.plan-summary-card-rich {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 0.55rem;
  align-items: center;
}

.plan-summary-main {
  min-width: 0;
  margin: 0 !important;
  padding: 0 !important;
  border: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  text-align: right;
  box-shadow: none;
  cursor: pointer;
}

.plan-card-actions {
  display: flex;
  gap: 0.35rem;
  align-items: center;
}

.plan-card-action {
  display: inline-flex;
  align-items: center;
  gap: 0.28rem;
  margin: 0 !important;
  padding: 0.36rem 0.46rem !important;
  border-radius: 0.62rem;
  border: 1px solid rgb(var(--accent-rgb) / 0.28);
  background: rgb(var(--accent-rgb) / 0.1);
  color: var(--text);
  font: inherit;
  font-size: 0.75rem;
  box-shadow: none;
  cursor: pointer;
}

.plan-hide-link {
  margin: 0 !important;
  padding: 0 !important;
  border: 0;
  background: transparent;
  color: var(--muted, #a3a0ad);
  font: inherit;
  font-size: 0.78rem;
  font-weight: 400;
  text-decoration: underline;
  text-underline-offset: 0.14em;
  cursor: pointer;
  box-shadow: none;
}

.plan-hide-link:hover,
.plan-hide-link:focus-visible {
  color: var(--text);
}

.plan-hide-link-compact {
  font-size: 0.72rem;
}

.plan-hide-link-restore {
  text-decoration-style: dotted;
}

.plan-vis-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin: 0 !important;
  padding: 0.34rem !important;
  min-width: 2rem;
  min-height: 2rem;
  border-radius: 0.62rem;
  border: 1px solid rgb(var(--accent-rgb) / 0.22);
  background: rgb(var(--accent-rgb) / 0.08);
  color: var(--app-icon-mono-soft);
  cursor: pointer;
  box-shadow: none;
}

.plan-vis-btn:hover,
.plan-vis-btn:focus-visible {
  color: var(--app-icon-mono);
  border-color: rgb(var(--accent-rgb) / 0.45);
}

.plan-vis-btn-compact {
  min-width: 1.85rem;
  min-height: 1.85rem;
  padding: 0.28rem !important;
}

.plan-vis-btn-restore {
  color: var(--accent, var(--accent));
}

.plan-vis-icon {
  display: block;
  width: 1.05rem;
  height: 1.05rem;
}

.plan-card-action-icon {
  padding: 0.34rem 0.4rem !important;
  min-width: 2rem;
  min-height: 2rem;
}

.plan-card-action-icon span {
  display: none;
}

.plan-card-action-icon .plan-edit-icon {
  width: 1.05rem;
  height: 1.05rem;
}

.plan-detail-hide-host {
  margin: 0.35rem 0 0.15rem;
  text-align: right;
}

.plan-ro-session-meta {
  margin: 0.2rem 0 0;
}

.plan-ro-session-open-row {
  margin: 0.45rem 0 0;
}

.plan-ro-session-open {
  margin: 0 !important;
  padding: 0 !important;
  border: 0;
  background: transparent;
  color: var(--accent, var(--accent));
  font: inherit;
  font-size: 0.82rem;
  font-weight: 500;
  cursor: pointer;
  text-decoration: underline;
  text-underline-offset: 0.12em;
  box-shadow: none;
}

.plan-ro-session-open:hover,
.plan-ro-session-open:focus-visible {
  color: var(--text);
}

.plan-card-action-notes .plan-notes-icon {
  width: 1.05rem;
  height: 1.05rem;
  opacity: 0.92;
}

.plan-summary-card--workout-hidden {
  opacity: 0.82;
}

.workout-hub-filters {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 0.5rem;
  margin: 0 0 0.75rem;
  max-height: none;
  direction: rtl;
}

#page-workout-hub .workout-hub-head-new-btn {
  width: fit-content !important;
  max-width: 9.5rem;
  inline-size: fit-content;
  min-width: 8.4rem;
  min-height: 2.25rem;
  display: inline-flex;
  padding: 0.38rem 0.64rem;
  flex: 0 0 auto;
}

.workout-hub-chip-new {
  min-height: 2.18rem;
  min-width: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.48rem;
  margin: 0 !important;
  padding: 0.4rem 0.72rem 0.4rem 0.54rem;
  border: 1px solid color-mix(in srgb, var(--accent) 42%, var(--line));
  border-radius: 999px;
  background: color-mix(in srgb, var(--accent) 16%, var(--card)) !important;
  color: var(--accent);
  box-shadow: none !important;
  font-weight: 850;
  direction: rtl;
}

.workout-hub-chip-new:hover,
.workout-hub-chip-new:focus-visible {
  border-color: color-mix(in srgb, var(--accent) 58%, var(--line));
  background: color-mix(in srgb, var(--accent) 22%, var(--card)) !important;
}

.workout-hub-new-plus {
  width: 1.16rem;
  height: 1.16rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 0.34rem;
  background: var(--accent);
  border: 1px solid color-mix(in srgb, var(--accent) 70%, #ffffff);
  color: #ffffff;
  font-size: 0.82rem;
  line-height: 1;
  font-weight: 900;
}

.workout-hub-chip-hidden {
  direction: rtl;
}

.workout-hub-plans-list {
  display: grid;
  gap: 0.55rem;
}

.plan-summary-card--hub {
  grid-template-columns: auto 1fr auto;
  gap: 0.65rem;
  align-items: center;
  padding: 0.62rem 0.72rem;
  border-radius: 0.85rem;
  background: linear-gradient(135deg, var(--plan-row-bg) 0%, rgb(var(--accent-rgb) / 0.06) 100%);
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.04) inset;
}

.plan-summary-card--hub:hover {
  border-color: rgb(var(--accent-rgb) / 0.5);
  box-shadow:
    0 1px 0 rgba(255, 255, 255, 0.05) inset,
    0 6px 18px rgba(0, 0, 0, 0.12);
}

.plan-hub-visual {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.12rem;
  width: 3.35rem;
  min-width: 3.35rem;
  padding: 0.38rem 0.28rem 0.32rem;
  border-radius: 0.72rem;
  border: 1px solid rgb(var(--accent-rgb) / 0.22);
  background: rgb(var(--accent-rgb) / 0.1);
}

.plan-hub-visual--coach {
  border-color: rgba(61, 214, 140, 0.35);
  background: linear-gradient(160deg, rgba(61, 214, 140, 0.14) 0%, rgb(var(--accent-rgb) / 0.08) 100%);
}

.plan-hub-visual--self {
  border-color: rgb(var(--accent-rgb) / 0.32);
  background: linear-gradient(160deg, rgb(var(--accent-rgb) / 0.16) 0%, rgb(var(--accent-rgb) / 0.05) 100%);
}

.plan-hub-visual--muted {
  opacity: 0.72;
  filter: grayscale(0.35);
}

.plan-hub-visual-icon-wrap {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 1.85rem;
  height: 1.85rem;
}

.plan-hub-visual-img {
  display: block;
  width: 1.65rem;
  height: 1.65rem;
  object-fit: contain;
  opacity: 0.92;
}

html:not([data-theme="light"]) .plan-hub-visual--muted .plan-hub-visual-img {
  opacity: 0.82;
}

.plan-hub-visual-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 1.35rem;
  padding: 0.06rem 0.32rem;
  border-radius: 999px;
  font-size: 0.72rem;
  font-weight: 700;
  line-height: 1.2;
  color: var(--text);
  background: rgba(0, 0, 0, 0.22);
  border: 1px solid rgba(255, 255, 255, 0.08);
}

.plan-hub-visual-kind {
  font-size: 0.62rem;
  line-height: 1.1;
  opacity: 0.88;
}

.plan-summary-title-row {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  flex-wrap: wrap;
  gap: 0.35rem;
  width: 100%;
}

.plan-summary-title-row .plan-summary-title {
  flex: 0 1 auto;
}

.plan-summary-card--hub .plan-summary-title {
  font-size: 0.95rem;
  font-weight: 700;
}

.plan-hub-middle-wrap {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 0.42rem;
  min-width: 0;
}

.plan-summary-main--hub {
  flex: 1 1 auto;
  min-width: 0;
}

html[data-theme="light"] .plan-summary-card--hub {
  background: linear-gradient(135deg, #fff 0%, rgb(var(--accent-rgb) / 0.05) 100%);
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.9) inset;
}

html[data-theme="light"] .plan-hub-visual-badge {
  background: rgb(var(--accent-rgb) / 0.1);
  border-color: rgb(var(--accent-rgb) / 0.12);
  color: var(--text);
}

html[data-theme="light"] .plan-hub-visual--coach {
  background: linear-gradient(160deg, rgb(var(--accent-strong-rgb) / 0.12) 0%, rgb(var(--accent-rgb) / 0.06) 100%);
}

.workout-hub-empty {
  margin: 0.65rem 0 0.25rem;
  text-align: center;
}

.workout-hub-empty-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.55rem;
  margin: 0.5rem 0 0.25rem;
  padding: 1rem 0.85rem;
  border-radius: calc(var(--radius) + 0.08rem);
  border: 1px dashed rgb(var(--accent-rgb) / 0.28);
  background: rgb(var(--accent-rgb) / 0.06);
  text-align: center;
}

.workout-hub-empty-card p {
  margin: 0;
}

.workout-hub-empty-icon {
  width: 2.5rem;
  height: 2.5rem;
  opacity: 0.75;
}

.workout-hidden-plans-details {
  margin: 0.5rem 0 0.35rem;
}

.workout-hidden-plans-summary {
  cursor: pointer;
  user-select: none;
}

.workout-hidden-plans-list {
  display: grid;
  gap: 0.45rem;
  margin-top: 0.45rem;
}

.my-ex-hidden-plans {
  margin: 0.35rem 0 0.15rem;
}

.my-ex-hidden-plans-list {
  display: grid;
  gap: 0.45rem;
  margin-top: 0.45rem;
}

.my-ex-toolbar {
  margin-top: 0.65rem;
}

.plan-edit-icon {
  width: 1rem;
  height: 1rem;
  object-fit: contain;
  display: block;
}

.plan-detail-session-comments {
  display: grid;
  gap: 0.38rem;
  margin: 0.55rem 0;
}

.workout-hub-create-card {
  display: grid;
  gap: 0.65rem;
  margin-bottom: 0.65rem;
}

.workout-hub-create-title {
  margin: 0 0 0.12rem;
  font-weight: 800;
}

.plan-new-student-context {
  margin: 0 0 0.75rem;
  padding: 0.55rem 0.65rem;
  border-radius: 0.6rem;
  border: 1px solid rgb(var(--accent-rgb) / 0.28);
  background: rgb(var(--accent-rgb) / 0.08);
}

.plan-new-student-context-kicker {
  margin: 0 0 0.15rem;
  font-size: 0.78rem;
}

.plan-new-student-context-name {
  margin: 0;
  font-size: 1rem;
  font-weight: 700;
}

.plan-new-self-context-note {
  margin-top: 0;
  margin-bottom: 0.65rem;
  padding: 0.48rem 0.58rem;
  border-radius: 0.65rem;
  border: 1px solid rgb(var(--accent-rgb) / 0.2);
  background: rgb(var(--accent-rgb) / 0.08);
}

.plan-assignee-comment {
  margin: 0.35rem 0;
  padding: 0.45rem 0.55rem;
  border-radius: 0.65rem;
  border: 1px solid rgb(var(--accent-rgb) / 0.18);
  background: rgb(var(--accent-rgb) / 0.08);
}

.plan-summary-card--session {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 0.28rem;
  text-align: start;
}

.plan-summary-card-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.45rem;
  width: 100%;
}

.plan-summary-title {
  font-weight: 700;
  font-size: 0.92rem;
  margin: 0;
  flex: 1;
  min-width: 0;
}

.plan-session-pos {
  flex-shrink: 0;
  font-size: 0.68rem;
  font-weight: 600;
  padding: 0.08rem 0.36rem;
  border-radius: 999px;
  line-height: 1.25;
  color: var(--muted);
  border: 1px solid rgb(var(--accent-rgb) / 0.28);
  background: rgb(var(--accent-rgb) / 0.1);
}

.plan-summary-meta {
  display: -webkit-box;
  font-size: 0.73rem;
  line-height: 1.38;
  width: 100%;
  overflow: hidden;
  overflow-wrap: anywhere;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.plan-ro-session-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  flex-wrap: wrap;
}

.session-head-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  width: 100%;
}

.session-head-actions {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  gap: 0.34rem;
}

.session-head-title {
  min-width: 0;
  flex: 1 1 auto;
  font-weight: 700;
  font-size: 1rem;
  color: var(--text);
}

.session-head-pos {
  flex-shrink: 0;
  font-size: 0.68rem;
  font-weight: 600;
  padding: 0.08rem 0.38rem;
  border-radius: 999px;
  line-height: 1.25;
  color: var(--muted);
  border: 1px solid rgb(var(--accent-rgb) / 0.3);
  background: rgb(var(--accent-rgb) / 0.1);
}

.plan-session-nav {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  gap: 0.24rem;
  padding: 0.16rem;
  border-radius: 999px;
  border: 1px solid color-mix(in srgb, var(--accent) 30%, var(--control-line));
  background: color-mix(in srgb, var(--surface) 76%, transparent);
}

.plan-session-nav-pos {
  min-width: 3.5rem;
  padding: 0 0.18rem;
  color: var(--muted);
  font-size: 0.72rem;
  font-weight: 800;
  line-height: 1;
  text-align: center;
  white-space: nowrap;
}

.plan-session-nav-btn {
  width: 1.7rem !important;
  height: 1.7rem !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px !important;
  border: 1px solid color-mix(in srgb, var(--accent) 30%, transparent) !important;
  background: color-mix(in srgb, var(--accent) 10%, transparent) !important;
  color: var(--text) !important;
  box-shadow: none !important;
}

.plan-session-nav-btn svg {
  width: 0.95rem;
  height: 0.95rem;
}

.plan-session-nav-btn:disabled {
  opacity: 0.36;
  cursor: default;
}

.plan-session-nav-btn:not(:disabled):hover,
.plan-session-nav-btn:not(:disabled):focus-visible {
  border-color: color-mix(in srgb, var(--accent) 52%, transparent) !important;
  background: color-mix(in srgb, var(--accent) 18%, transparent) !important;
}

.plan-session-mode-toggle {
  width: 2.15rem !important;
  height: 2.15rem !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 0.58rem !important;
  border: 1px solid color-mix(in srgb, var(--accent) 36%, var(--control-line)) !important;
  background: color-mix(in srgb, var(--accent) 12%, var(--surface)) !important;
  color: var(--text) !important;
  box-shadow: none !important;
}

.plan-session-mode-toggle svg {
  width: 1.08rem;
  height: 1.08rem;
}

.plan-session-mode-toggle:hover,
.plan-session-mode-toggle:focus-visible {
  border-color: color-mix(in srgb, var(--accent) 58%, transparent) !important;
  background: color-mix(in srgb, var(--accent) 20%, var(--surface)) !important;
}

.plan-session-mode-toggle:disabled {
  opacity: 0.62;
  cursor: wait;
}

.session-note-block,
.plan-note-block--user,
.plan-note-block--coach {
  display: block;
  margin-top: 0.4rem;
  padding: 0.5rem 0.6rem;
  border-radius: 0.65rem;
  line-height: 1.5;
  font-size: 0.86rem;
}

.session-note-block--user,
.plan-note-block--user {
  border: 1px solid rgb(var(--accent-rgb) / 0.22);
  background: rgb(var(--accent-rgb) / 0.08);
}

.session-note-block--coach,
.plan-note-block--coach {
  border: 1px solid rgba(163, 160, 173, 0.22);
  background: rgba(163, 160, 173, 0.08);
}

.session-note-block--plan {
  border: 1px solid rgba(163, 160, 173, 0.18);
  background: rgba(163, 160, 173, 0.06);
}

.session-note-label {
  display: block;
  font-weight: 600;
  font-size: 0.8rem;
  margin-bottom: 0.2rem;
  color: var(--text);
}

.session-note-body {
  display: block;
  color: var(--muted);
  overflow-wrap: anywhere;
}

.page-head-context .session-note-block--user,
.plan-ro-session .plan-note-block--user {
  margin-top: 0.28rem;
  padding: 0.38rem 0.48rem;
  border-radius: 0.54rem;
  font-size: 0.78rem;
  line-height: 1.42;
}

.page-head-context .session-note-block--user .session-note-label,
.plan-ro-session .plan-note-block--user .session-note-label {
  font-size: 0.72rem;
  margin-bottom: 0.12rem;
}

.session-intro-empty {
  display: block;
  margin-top: 0.25rem;
}

.plan-detail-edit-card {
  display: grid;
  gap: 0.55rem;
}

.plan-detail-section-title {
  margin: 0 0 0.15rem;
  font-size: 0.95rem;
  font-weight: 700;
}

.plan-detail-readonly-hint {
  margin: 0 0 0.25rem;
}

.plan-detail-feedback.msg {
  margin: 0.35rem 0 0;
  padding: 0;
  border: 0;
  background: transparent;
  min-height: 0;
}

.plan-detail-feedback.msg.hidden {
  display: none;
}

#page-plan-detail .page-head {
  display: block;
}

#page-plan-detail .page-head-heading-row {
  width: 100%;
  min-width: 0;
  flex-wrap: nowrap;
  align-items: center;
}

#page-plan-detail .page-head-heading-row > h1,
#page-plan-detail .page-head h1.plan-detail-title-with-toggle {
  min-width: 0;
  flex: 1 1 auto;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#page-plan-detail .page-head-heading-row > .plan-detail-ai-badge {
  width: 1.82rem;
  height: 1.82rem;
  margin: 0;
  border-radius: 0.5rem;
  border-color: color-mix(in srgb, var(--accent) 36%, var(--control-line));
  background: color-mix(in srgb, var(--accent) 12%, var(--surface));
}

#page-plan-detail .page-head-heading-row > .plan-detail-ai-badge .plan-ai-badge-icon {
  width: 1.08rem;
  height: 1.08rem;
}

.plan-detail-mode-toggle {
  flex: 0 0 auto;
  width: 1.82rem !important;
  height: 1.82rem !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 0.5rem !important;
  border: 1px solid color-mix(in srgb, var(--accent) 36%, var(--control-line)) !important;
  background: color-mix(in srgb, var(--accent) 12%, var(--surface)) !important;
  color: var(--text) !important;
  box-shadow: none !important;
  transition:
    background 0.16s ease,
    border-color 0.16s ease,
    color 0.16s ease,
    transform 0.16s ease;
}

.plan-detail-mode-toggle svg {
  width: 0.92rem;
  height: 0.92rem;
  transition: transform 0.16s ease, opacity 0.16s ease;
}

.plan-detail-mode-toggle:hover,
.plan-detail-mode-toggle:focus-visible {
  border-color: color-mix(in srgb, var(--accent) 58%, transparent) !important;
  background: color-mix(in srgb, var(--accent) 20%, var(--surface)) !important;
}

.plan-detail-mode-toggle[aria-pressed="true"] {
  color: color-mix(in srgb, var(--accent) 36%, var(--text)) !important;
}

.plan-detail-mode-toggle:active {
  transform: scale(0.96);
}

.plan-detail-mode-toggle:disabled {
  opacity: 0.62;
  cursor: wait;
}

.plan-detail-pdf-export {
  flex: 0 0 auto;
  width: 1.82rem !important;
  height: 1.82rem !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  position: relative;
  border-radius: 0.5rem !important;
  border: 1px solid color-mix(in srgb, var(--accent) 36%, var(--control-line)) !important;
  background: color-mix(in srgb, var(--accent) 9%, var(--surface)) !important;
  color: color-mix(in srgb, var(--accent) 68%, var(--text)) !important;
  box-shadow: none !important;
}

.plan-detail-pdf-export svg {
  width: 0.9rem;
  height: 0.9rem;
}

.plan-detail-pdf-export:hover,
.plan-detail-pdf-export:focus-visible {
  border-color: color-mix(in srgb, var(--accent) 60%, transparent) !important;
  background: color-mix(in srgb, var(--accent) 18%, var(--surface)) !important;
}

.plan-detail-pdf-export:disabled {
  cursor: wait;
}

.plan-detail-pdf-export.is-loading svg {
  opacity: 0;
}

.plan-detail-pdf-export.is-loading::after {
  content: "";
  width: 0.7rem;
  height: 0.7rem;
  position: absolute;
  inset: 0;
  margin: auto;
  border: 2px solid color-mix(in srgb, var(--accent) 24%, transparent);
  border-top-color: currentColor;
  border-radius: 50%;
  animation: plan-detail-pdf-spin 0.7s linear infinite;
}

@keyframes plan-detail-pdf-spin {
  to { transform: rotate(360deg); }
}

#page-plan-detail.plan-detail--editable .plan-summary-card--session {
  border-color: rgb(var(--accent-rgb) / 0.28);
}

.plan-detail-view-root {
  padding: 0.65rem 0.75rem;
}

.plan-detail-meta-inner {
  display: grid;
  gap: 0.45rem;
}

.plan-detail-sess-count {
  margin: 0;
  font-weight: 600;
}

.plan-detail-notes-wrap {
  display: grid;
  gap: 0.4rem;
}

.plan-detail-sessions-card {
  padding: 0.55rem 0.65rem;
}

.plan-detail-sessions-list {
  display: grid;
  gap: 0.5rem;
}

#page-plan-detail.plan-detail--view-only .plan-summary-card--session {
  border-color: rgb(var(--accent-rgb) / 0.22);
  background: rgb(var(--accent-rgb) / 0.06);
}

#page-plan-detail.plan-detail--view-only .plan-summary-card--session:hover {
  border-color: rgb(var(--accent-rgb) / 0.38);
  background: rgb(var(--accent-rgb) / 0.1);
}

body.search-filter-floating .plan-session-filter-link {
  display: none;
}

.plan-session-workspace {
  display: grid;
  gap: 0.85rem;
}

.plan-session-title-hint {
  margin: 0.2rem 0 0;
}

.plan-session-section {
  display: grid;
  gap: 0.45rem;
}

.plan-session-section-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.6rem;
  margin: 0;
  font-size: 1rem;
  font-weight: 700;
}

.plan-session-exercise-count {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 1.55rem;
  padding: 0.18rem 0.56rem;
  border: 1px solid color-mix(in srgb, var(--accent) 18%, var(--line));
  border-radius: 999px;
  background: color-mix(in srgb, var(--accent) 8%, transparent);
  color: color-mix(in srgb, var(--accent) 34%, var(--text));
  font-size: 0.75rem;
  font-weight: 850;
  line-height: 1.2;
  white-space: nowrap;
}

.plan-session-draft {
  display: grid;
  gap: 0.55rem;
}

.plan-session-add-panel {
  margin-top: 0;
  border-radius: var(--radius);
  border: 1px solid var(--plan-row-bd);
  padding: 0.35rem 0.55rem;
  background: rgba(0, 0, 0, 0.06);
}

.plan-session-add-panel > summary {
  display: none;
}

.plan-session-add-body {
  padding: 0.55rem 0 0.15rem;
  display: grid;
  gap: 0.55rem;
}

.plan-session-inline-search {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 0.4rem;
  align-items: center;
}

.plan-session-inline-search input {
  margin: 0;
}

.plan-session-filter-link {
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--muted, #a3a0ad);
  font: inherit;
  font-size: 0.78rem;
  text-decoration: underline;
  text-underline-offset: 0.14em;
  cursor: pointer;
  text-align: right;
  width: 100%;
}

.plan-session-filter-link:hover,
.plan-session-filter-link:focus-visible {
  color: var(--text);
}

.plan-session-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.55rem;
  margin-bottom: 0.15rem;
  padding: 0.35rem 0.5rem;
  border-radius: 0.55rem;
  border: 1px solid rgb(var(--accent-rgb) / 0.12);
  background: rgb(var(--accent-rgb) / 0.05);
}

.plan-session-autosave-hint {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  margin: 0;
  flex: 1 1 auto;
  min-width: 0;
  font-size: 0.78rem;
  color: var(--muted, #a3a0ad);
  line-height: 1.35;
}

.plan-session-autosave-dot {
  flex-shrink: 0;
  width: 0.42rem;
  height: 0.42rem;
  border-radius: 50%;
  background: rgb(var(--accent-rgb) / 0.55);
  opacity: 0.85;
}

.plan-session-save-btn {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.35rem;
  height: 2.35rem;
  margin: 0;
  padding: 0;
  border-radius: 0.55rem;
  border: 1px solid rgb(var(--accent-rgb) / 0.35);
  background: rgb(var(--accent-rgb) / 0.14);
  color: var(--app-icon-mono);
  cursor: pointer;
  box-shadow: none;
}

.plan-session-save-btn:hover,
.plan-session-save-btn:focus-visible {
  border-color: rgb(var(--accent-rgb) / 0.55);
  background: rgb(var(--accent-rgb) / 0.24);
}

.plan-session-save-icon {
  width: 1.15rem;
  height: 1.15rem;
}

.plan-session-toolbar-msg.msg {
  margin: -0.15rem 0 0.35rem;
  padding: 0;
  border: 0;
  background: transparent;
  min-height: 0;
  font-size: 0.82rem;
}

.plan-session-toolbar-msg.msg.hidden {
  display: none;
}

.plan-session-add-btn {
  width: 100%;
  margin: 0.1rem 0 0.25rem;
  padding: 0.62rem 0.85rem;
  border-radius: 0.6rem;
  border: 1px solid rgb(var(--accent-rgb) / 0.42);
  background: linear-gradient(180deg, rgb(var(--accent-rgb) / 0.22), rgb(var(--accent-rgb) / 0.1));
  color: var(--text);
  font: inherit;
  font-size: 0.92rem;
  font-weight: 700;
  cursor: pointer;
  box-shadow: 0 1px 0 rgba(0, 0, 0, 0.12);
}

.plan-session-add-btn::before {
  content: "+ ";
  font-weight: 800;
}

.plan-session-add-btn:hover,
.plan-session-add-btn:focus-visible {
  border-color: rgb(var(--accent-rgb) / 0.62);
  background: linear-gradient(180deg, rgb(var(--accent-rgb) / 0.3), rgb(var(--accent-rgb) / 0.14));
}

.plan-session-add-btn.is-open {
  border-color: rgb(var(--accent-rgb) / 0.5);
  background: rgb(var(--accent-rgb) / 0.12);
}

.plan-session-edit-row {
  margin: 0.45rem 0 0;
}

.plan-session-edit-link {
  color: var(--text);
  font-size: 0.88rem;
  text-decoration: underline;
  text-underline-offset: 0.12em;
}

.plan-session-edit-link:hover {
  color: rgb(var(--accent-rgb) / 0.95);
}

.plan-badge {
  display: inline-block;
  margin-inline-end: 0.35rem;
  padding: 0.08rem 0.4rem;
  border-radius: 999px;
  font-size: 0.68rem;
  font-weight: 600;
}

.plan-badge-on {
  background: rgb(var(--accent-rgb) / 0.22);
  color: #86efac;
}

.plan-badge-off {
  background: rgba(163, 160, 173, 0.15);
  color: #d3d0da;
}

.plan-checkbox-row {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin: 0.55rem 0;
  cursor: pointer;
}

.plan-session-search-hint {
  margin: 0.35rem 0 0.55rem;
}

.plan-source-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  margin-bottom: 0.65rem;
}

.plan-pick-sticky-controls {
  position: sticky;
  top: 0.35rem;
  z-index: 30;
  display: grid;
  gap: 0.46rem;
  margin: -0.1rem -0.42rem 0.08rem;
  padding: 0.42rem;
  border-radius: 0.86rem;
  background: color-mix(in srgb, var(--card) 82%, rgba(10, 9, 14, 0.82));
  box-shadow: 0 0.85rem 1.5rem color-mix(in srgb, var(--ink) 18%, transparent);
  -webkit-backdrop-filter: blur(16px) saturate(1.08);
  backdrop-filter: blur(16px) saturate(1.08);
}

html[data-theme="light"] .plan-pick-sticky-controls {
  background: color-mix(in srgb, var(--surface) 92%, transparent);
  box-shadow: 0 0.7rem 1.35rem color-mix(in srgb, var(--ink) 9%, transparent);
}

.plan-session-add-body.plan-session-pick-body .plan-source-tabs {
  gap: 0.28rem;
  margin: 0;
  padding: 0.28rem;
  border-radius: 0.72rem;
  border: 1px solid color-mix(in srgb, var(--control-line) 78%, transparent);
  background: color-mix(in srgb, var(--surface-strong) 72%, transparent);
  box-shadow: inset 0 1px 0 color-mix(in srgb, white 4%, transparent);
}

html[data-theme="light"] .plan-session-add-body.plan-session-pick-body .plan-source-tabs {
  background: color-mix(in srgb, var(--surface) 90%, transparent);
}

.plan-session-add-body.plan-session-pick-body .plan-source-tab {
  min-height: 2.35rem;
  padding: 0.38rem 0.28rem;
  border-radius: 0.52rem;
  border-color: transparent;
  font-size: 0.76rem;
  font-weight: 700;
  gap: 0.26rem;
  line-height: 1.25;
}

.plan-source-tab {
  flex: 1;
  padding: 0.45rem;
  border-radius: var(--radius);
  border: 1px solid var(--plan-row-bd);
  background: transparent;
  color: var(--app-icon-mono-soft);
  font: inherit;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.4rem;
}

.plan-src-tab-svg {
  flex-shrink: 0;
  display: block;
  width: 0.98rem;
  height: 0.98rem;
  color: currentColor;
}

.plan-src-tab-icon-img {
  flex-shrink: 0;
  display: block;
  width: 0.98rem;
  height: 0.98rem;
  object-fit: contain;
}

.plan-source-tab.is-on {
  border-color: rgb(var(--accent-rgb) / 0.55);
  background: rgb(var(--accent-rgb) / 0.12);
  color: var(--app-icon-mono);
}

.plan-session-pick-body .plan-source-tab.is-on {
  border-color: color-mix(in srgb, var(--accent-2) 35%, transparent);
  background: color-mix(in srgb, var(--accent-2) 15%, var(--surface));
  box-shadow: 0 0.45rem 1.15rem color-mix(in srgb, var(--ink) 9%, transparent);
}

.plan-pick-filter-card {
  margin: 0.04rem 0 0;
  padding: 0.54rem;
  gap: 0.5rem;
  border-radius: 0.72rem;
  box-shadow: none;
}

.plan-pick-filter-card .muscle-filter-map--lyfta .muscle-filter-chip {
  flex-basis: 4.85rem;
  grid-template-rows: 3.8rem auto;
  min-height: 5.7rem;
}

.plan-pick-filter-card .muscle-filter-chip-icon {
  width: 3.58rem;
  height: 3.58rem;
}

.plan-pick-filter-card .muscle-filter-chip-icon img {
  width: 3.44rem;
  height: 3.44rem;
}

.plan-pick-active-filters {
  position: relative;
  top: auto;
  z-index: 1;
  margin: -0.04rem 0 0;
  padding: 0.46rem;
  box-shadow: none;
}

.plan-pick-active-filters .search-active-filters-title,
.plan-pick-active-filters .search-active-filter-chip {
  font-size: 0.68rem;
}

.plan-pick-active-filters .search-active-filter-chip strong {
  font-size: 0.7rem;
}

.plan-pick-active-filters .search-active-filters-clear {
  min-height: 1.45rem;
  padding-inline: 0.44rem;
  font-size: 0.62rem;
}

.plan-pick-filter-card .search-top-query-icon,
.search-top-filter-card .search-top-query-icon {
  color: #e5e7eb !important;
}

html[data-theme="light"] .plan-pick-filter-card .search-top-query-icon,
html[data-theme="light"] .search-top-filter-card .search-top-query-icon {
  color: #4a4656 !important;
}

.plan-session-search-results {
  margin-top: 0.65rem;
  display: flex;
  flex-direction: column;
  gap: 0.72rem;
}

.ex-card-plan-toolbar {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  padding: 0.35rem 0.55rem 0.45rem;
  border-top: 1px solid rgb(var(--accent-rgb) / 0.14);
  background: rgba(0, 0, 0, 0.1);
}

.plan-picker-buttons {
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  gap: 0.44rem;
}

.ex-card--plan-picker.ex-card--plan-session-active {
  border-color: rgba(61, 214, 140, 0.38);
}

html[data-theme="light"] .ex-card-plan-toolbar {
  background: rgba(0, 0, 0, 0.04);
}

.plan-picker-svg {
  display: block;
  flex-shrink: 0;
  pointer-events: none;
}

/* دکمه/نشانٔ کنترل — همه هم‌اندازه و هم‌ خانواده */
.plan-picker-icon-btn {
  box-sizing: border-box;
  width: 2rem;
  height: 2rem;
  min-width: 2rem;
  margin: 0;
  padding: 0;
  border-radius: 0.48rem;
  border: 1px solid rgba(58, 74, 102, 0.85);
  background: rgba(255, 255, 255, 0.04);
  color: var(--app-icon-mono);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  cursor: pointer;
  font: inherit;
  line-height: 0;
  transition:
    border-color 0.12s ease,
    background 0.12s ease,
    color 0.12s ease;
}

.plan-picker-icon-btn:focus-visible {
  outline: 2px solid rgb(var(--accent-rgb) / 0.55);
  outline-offset: 1px;
}

button.plan-picker-icon-btn:hover {
  border-color: rgb(var(--accent-rgb) / 0.45);
  background: rgb(var(--accent-rgb) / 0.1);
  color: var(--app-icon-mono);
}

.plan-picker-detail:hover {
  color: var(--accent);
}

.plan-picker-icon-state {
  cursor: default;
  pointer-events: none;
  border-color: rgba(61, 214, 140, 0.42);
  background: rgba(61, 214, 140, 0.1);
  color: var(--ok);
}

.plan-picker-add:hover {
  border-color: rgba(61, 214, 140, 0.5);
  background: rgba(61, 214, 140, 0.12);
  color: #b8efd6;
}

.plan-picker-remove.plan-picker-icon-danger:hover {
  border-color: rgba(248, 113, 113, 0.45);
  background: rgba(248, 113, 113, 0.12);
  color: #fecaca;
}

.plan-picker-remove.plan-picker-icon-danger {
  color: #e8a4a8;
}

.plan-draft-row {
  margin-bottom: 0.6rem;
  padding: 0.55rem 0.6rem;
  border-radius: 0.55rem;
  border: 1px solid #2e3a52;
  background: rgba(0, 0, 0, 0.14);
}

.plan-draft-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.35rem;
  margin-bottom: 0.35rem;
}

.plan-draft-head-main {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 0.4rem;
  min-width: 0;
}

.plan-draft-kind-badge {
  padding: 0.12rem 0.42rem;
  border-radius: 999px;
  border: 1px solid rgba(34, 211, 238, 0.32);
  background: rgb(var(--accent-rgb) / 0.1);
  color: #a5f3fc;
  font-size: 0.68rem;
  font-weight: 800;
}

.plan-draft-order {
  flex-shrink: 0;
  font-size: 0.72rem;
  font-weight: 600;
}

.plan-draft-head-actions {
  display: flex;
  align-items: center;
  gap: 0.35rem;
  flex-shrink: 0;
}

.plan-draft-reorder {
  display: inline-flex;
  flex-direction: column;
  gap: 0.12rem;
}

.plan-draft-reorder-btn {
  margin: 0;
  padding: 0.12rem 0.38rem;
  min-width: 1.65rem;
  border: 1px solid rgb(var(--accent-rgb) / 0.28);
  border-radius: 0.4rem;
  background: rgb(var(--accent-rgb) / 0.08);
  color: var(--muted, #a3a0ad);
  font: inherit;
  font-size: 0.68rem;
  line-height: 1;
  cursor: pointer;
  box-shadow: none;
}

.plan-draft-reorder-btn:hover:not(:disabled),
.plan-draft-reorder-btn:focus-visible:not(:disabled) {
  color: var(--text);
  border-color: rgb(var(--accent-rgb) / 0.45);
}

.plan-draft-reorder-btn:disabled {
  opacity: 0.35;
  cursor: not-allowed;
}

.plan-draft-remove.plan-picker-icon-danger {
  color: #e8a4a8;
}

.plan-draft-remove.plan-picker-icon-danger:hover,
.plan-draft-remove.plan-picker-icon-danger:focus-visible {
  border-color: rgba(248, 113, 113, 0.45);
  background: rgba(248, 113, 113, 0.12);
  color: #fecaca;
}

html[data-theme="light"] .plan-draft-remove.plan-picker-icon-danger {
  color: #b91c1c;
}

html[data-theme="light"] .plan-draft-remove.plan-picker-icon-danger:hover,
html[data-theme="light"] .plan-draft-remove.plan-picker-icon-danger:focus-visible {
  color: #991b1b;
}

.plan-draft-note-label {
  display: block;
  margin: 0.35rem 0 0.2rem;
  font-size: 0.78rem;
}

.plan-draft-head strong {
  font-size: 0.86rem;
}

.plan-draft-row textarea.plan-draft-note {
  width: 100%;
  min-height: 3rem;
  margin-top: 0.35rem;
  border-radius: var(--radius);
  border: 1px solid #2c2a36;
  background: var(--card);
  color: var(--text);
  padding: 0.4rem;
  font: inherit;
}

.plan-detail-readonly-section h2 {
  font-size: 1rem;
  margin: 0 0 0.35rem;
}

.plan-detail-readonly-section .plan-ro-tag {
  font-size: 0.82rem;
  margin-bottom: 0.5rem;
}

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.app-toolbar-bleed {
  flex-shrink: 0;
  margin-inline: calc(var(--app-shell-pad) * -1);
  padding-inline: var(--app-shell-pad);
  padding-block: 0;
  border-bottom: 1px solid rgba(44, 42, 54, 0.42);
  background: rgba(10, 14, 24, 0.55);
}

.app-toolbar {
  flex-shrink: 0;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  gap: 0.4rem;
  padding: 0.28rem 0 0.4rem;
  margin: 0;
  border: none;
  background: transparent;
  z-index: 36;
}

.app-toolbar.hidden {
  display: none;
}

.app-toolbar-side-spacer {
  display: none;
}

.app-toolbar-back {
  justify-self: center;
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.5rem;
  height: 2.5rem;
  margin: 0;
  padding: 0;
  border: none;
  border-radius: 0.65rem;
  background: rgb(var(--accent-rgb) / 0.12);
  color: var(--app-icon-mono);
  cursor: pointer;
}

.app-toolbar-back:hover {
  background: rgb(var(--accent-rgb) / 0.2);
}

.app-toolbar-back-svg {
  display: block;
}

/* دکمهٔ بک */
html[dir="rtl"] .app-brand .app-toolbar-back-svg {
  transform: none;
}

.app-toolbar-title-wrap {
  flex: 1;
  min-width: 0;
}

.app-toolbar-heading {
  margin: 0;
  font-size: 0.97rem;
  font-weight: 700;
  line-height: 1.38;
  text-align: center;
  overflow-wrap: anywhere;
  word-break: break-word;
  white-space: normal;
  max-height: 3.2rem;
  overflow-y: auto;
}

.plan-draft-train-fields {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.45rem 0.55rem;
  margin: 0.35rem 0 0.15rem;
}

.plan-draft-train-fields .full-width {
  grid-column: 1 / -1;
}

.plan-draft-composite-box {
  grid-column: 1 / -1;
  padding: 0.52rem;
  border-radius: 0.58rem;
  border: 1px solid rgba(34, 211, 238, 0.22);
  background: rgb(var(--accent-rgb) / 0.055);
}

.plan-draft-composite-head {
  display: flex;
  flex-direction: column;
  gap: 0.1rem;
  margin-bottom: 0.45rem;
  font-size: 0.78rem;
  font-weight: 800;
  color: var(--text);
}

.plan-draft-composite-list {
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
}

.plan-draft-composite-component {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 0.35rem 0.45rem;
  align-items: center;
  padding: 0.42rem;
  border-radius: 0.5rem;
  background: rgba(0, 0, 0, 0.12);
}

.plan-draft-composite-index {
  display: inline-grid;
  place-items: center;
  width: 1.55rem;
  height: 1.55rem;
  border-radius: 999px;
  background: rgb(var(--accent-rgb) / 0.16);
  color: var(--text);
  font-size: 0.72rem;
  font-weight: 850;
}

.plan-draft-composite-title {
  min-width: 0;
  font-size: 0.8rem;
  font-weight: 750;
  overflow-wrap: anywhere;
}

.plan-draft-composite-dose {
  grid-column: 1 / -1;
}

.plan-draft-composite-empty {
  grid-column: 1 / -1;
  margin: 0;
}

.workout-tile-dose--composite {
  display: inline-flex;
  padding: 0.12rem 0.45rem;
  border-radius: 999px;
  border: 1px solid color-mix(in srgb, var(--accent) 24%, var(--control-line));
  background: color-mix(in srgb, var(--accent) 10%, var(--surface));
  color: color-mix(in srgb, var(--accent) 82%, var(--text));
  font-weight: 850;
}

.workout-tile-composite-list {
  display: flex;
  flex-direction: column;
  gap: 0.22rem;
  margin-top: 0.35rem;
  font-size: 0.78rem;
  line-height: 1.55;
  color: var(--muted);
}

.workout-tile-composite-list span {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 0.32rem;
}

.workout-tile-composite-list b {
  display: inline-grid;
  place-items: center;
  width: 1.35rem;
  height: 1.35rem;
  border-radius: 999px;
  background: rgb(var(--accent-rgb) / 0.14);
  color: var(--text);
  font-size: 0.68rem;
}

.plan-draft-field {
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
  font-size: 0.78rem;
}

.plan-draft-num,
.plan-draft-rest-select,
.plan-draft-unit-select {
  width: 100%;
  border-radius: 0.5rem;
  border: 1px solid #2c2a36;
  background: var(--card);
  color: var(--text);
  padding: 0.35rem 0.4rem;
  font: inherit;
  font-size: 0.88rem;
}

.plan-draft-dose-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 0.35rem;
  align-items: center;
}

.plan-draft-dose-row .plan-draft-num {
  min-width: 0;
}

.plan-draft-unit-select {
  min-width: 5.2rem;
  width: auto;
}

.workout-hub-body {
  display: flex;
  flex-direction: column;
  gap: 0.55rem;
}

.workout-hub-sessions {
  display: flex;
  flex-direction: column;
  gap: 0.45rem;
  margin-top: 0.35rem;
}

.workout-hub-other-plans-lead {
  margin: 0.35rem 0 0.15rem;
}

.session-intro-day {
  font-weight: 600;
  color: var(--text);
}

.session-intro-user-comment,
.session-intro-global-notes {
  display: block;
}

.session-intro-user-comment strong,
.session-intro-global-notes strong {
  font-weight: 600;
}

.workout-hub-head {
  padding: 0.65rem 0.75rem;
}

.workout-hub-plan-title {
  font-size: 1rem;
  font-weight: 700;
  margin: 0 0 0.35rem;
}

.workout-hub-notes {
  margin: 0;
}

.workout-session-tiles {
  display: flex;
  flex-direction: column;
  gap: 0.55rem;
}

.workout-tile-wrap {
  display: grid;
  gap: 0.4rem;
}

.workout-tile-card {
  display: flex;
  flex-direction: row;
  align-items: stretch;
  gap: 0.65rem;
  width: 100%;
  text-align: start;
  padding: 0.55rem 0.6rem;
  margin: 0;
  border-radius: var(--radius);
  border: 1px solid #2e3a52;
  background: var(--card);
  color: var(--text);
  font: inherit;
  cursor: pointer;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.12);
}

@media (hover: hover) and (pointer: fine) {
  .workout-tile-card:active {
    transform: scale(0.99);
  }
}

.workout-tile-media {
  flex-shrink: 0;
  width: 4.25rem;
  height: 4.25rem;
  border-radius: 0.65rem;
  overflow: hidden;
  background: rgba(0, 0, 0, 0.2);
}

.workout-tile-media--lyfta,
.workout-tile-media--lyfta img {
  background: #fff;
  filter: none;
}

.workout-tile-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.workout-tile-media-ph {
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.68rem;
  color: var(--muted);
  text-align: center;
  padding: 0.25rem;
}

.workout-tile-body {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 0.15rem;
}

.workout-tile-title {
  margin: 0;
  font-size: 0.92rem;
  font-weight: 700;
  line-height: 1.35;
}

.workout-tile-title--numbered {
  display: flex;
  align-items: flex-start;
  gap: 0.45rem;
}

.workout-tile-order {
  display: inline-grid;
  place-items: center;
  flex: 0 0 auto;
  min-width: 1.55rem;
  height: 1.55rem;
  border: 1px solid color-mix(in srgb, var(--accent) 20%, var(--line));
  border-radius: 999px;
  background: color-mix(in srgb, var(--accent) 9%, var(--card));
  color: color-mix(in srgb, var(--accent) 38%, var(--text));
  font-size: 0.74rem;
  font-weight: 900;
  line-height: 1;
}

.workout-tile-title-text {
  min-width: 0;
}

.ex-tile-coach-note {
  margin: 0.2rem 0 0.35rem;
  line-height: 1.45;
  text-align: right;
}

.ex-tile-coach-note .session-note-label {
  font-weight: 600;
  color: var(--text);
}

.ex-tile-coach-note-body {
  color: var(--muted, #a3a0ad);
}

.workout-tile-meta {
  font-size: 0.8rem;
  color: var(--accent);
}

.workout-tile-ai-swaps {
  display: grid;
  margin-top: 0.45rem;
  padding: 0.65rem;
  border: 1px solid color-mix(in srgb, var(--line, rgba(163, 160, 173, 0.22)) 78%, transparent);
  border-radius: 14px;
  background: color-mix(in srgb, var(--card) 94%, var(--app-bg, #0e0d12));
}

.workout-tile-ai-swaps-summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.65rem;
  min-height: 2.1rem;
  cursor: pointer;
  list-style: none;
  touch-action: manipulation;
}

.workout-tile-ai-swaps-summary::-webkit-details-marker {
  display: none;
}

.workout-tile-ai-swaps-summary::after {
  content: "";
  flex: 0 0 auto;
  width: 0.46rem;
  height: 0.46rem;
  margin-inline-start: 0.08rem;
  border-inline-end: 2px solid currentColor;
  border-block-end: 2px solid currentColor;
  color: color-mix(in srgb, var(--muted, #a3a0ad) 86%, var(--text));
  transform: rotate(45deg);
  transform-origin: center;
  transition: transform 0.18s ease;
}

.workout-tile-ai-swaps[open] .workout-tile-ai-swaps-summary::after {
  transform: rotate(225deg);
}

.workout-tile-ai-swaps-label {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  min-width: 0;
  color: var(--muted, #a3a0ad);
  font-size: 0.78rem;
  font-weight: 800;
}

.workout-tile-ai-swaps-count {
  margin-inline-start: auto;
  color: color-mix(in srgb, var(--muted, #a3a0ad) 82%, var(--text));
  font-size: 0.72rem;
  font-weight: 850;
  white-space: nowrap;
}

.workout-tile-ai-dot {
  display: inline-grid;
  place-items: center;
  min-width: 1.65rem;
  height: 1.35rem;
  border-radius: 0.42rem;
  border: 1px solid color-mix(in srgb, var(--line, rgba(163, 160, 173, 0.24)) 82%, transparent);
  background: color-mix(in srgb, var(--surface-2, var(--card)) 88%, var(--app-bg, #0e0d12));
  color: var(--muted, #a3a0ad);
  font-size: 0.66rem;
  font-weight: 900;
  letter-spacing: 0;
}

.workout-tile-ai-swaps-list {
  display: grid;
  gap: 0.45rem;
  margin-top: 0.55rem;
}

.workout-tile-ai-swap-row {
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  gap: 0.6rem;
  min-height: 2.7rem;
  border: 1px solid color-mix(in srgb, var(--line, rgba(163, 160, 173, 0.26)) 86%, transparent);
  border-radius: 10px;
  padding: 0.5rem 0.62rem;
  background: color-mix(in srgb, var(--surface-2, var(--card)) 90%, var(--app-bg, #0e0d12));
  color: var(--text);
}

.workout-tile-ai-swap-row:hover,
.workout-tile-ai-swap-row:focus-within {
  border-color: color-mix(in srgb, var(--line, rgba(163, 160, 173, 0.32)) 72%, var(--text));
  background: color-mix(in srgb, var(--surface-2, var(--card)) 82%, var(--app-bg, #0e0d12));
}

button.workout-tile-ai-swap-title,
button.workout-tile-ai-swap-btn {
  margin: 0;
  background: transparent !important;
  box-shadow: none;
}

button.workout-tile-ai-swap-title {
  min-width: 0;
  min-height: 1.95rem;
  padding: 0;
  border: 0;
  color: var(--text);
  font-size: 0.78rem;
  font-weight: 800;
  line-height: 1.45;
  text-align: right;
}

button.workout-tile-ai-swap-title:hover,
button.workout-tile-ai-swap-title:focus-visible {
  color: var(--text);
  text-decoration: underline;
  text-underline-offset: 0.18rem;
}

button.workout-tile-ai-swap-btn {
  display: inline-grid;
  place-items: center;
  min-height: 1.85rem;
  padding: 0 0.55rem;
  border-radius: 0.55rem;
  border: 1px solid color-mix(in srgb, var(--line, rgba(163, 160, 173, 0.28)) 82%, transparent);
  background: color-mix(in srgb, var(--card) 70%, var(--surface-2, #16151d));
  color: color-mix(in srgb, var(--text) 76%, var(--muted, #a3a0ad));
  font-size: 0.72rem;
  font-weight: 850;
  white-space: nowrap;
}

button.workout-tile-ai-swap-btn:hover,
button.workout-tile-ai-swap-btn:focus-visible {
  border-color: color-mix(in srgb, var(--accent) 38%, var(--line, rgba(163, 160, 173, 0.3)));
  color: color-mix(in srgb, var(--accent) 36%, var(--text));
}

button.workout-tile-ai-swap-btn:disabled {
  cursor: wait;
  opacity: 0.68;
}

.ex-card-my-line {
  margin: 0.15rem 0 0;
  line-height: 1.45;
  max-block-size: 2.9em;
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  line-clamp: 2;
}

/* دکمهٔ شناور «برگرد بالا» — بالای نوار پایین / نوار جستجو */
button.app-scroll-top-fab {
  position: fixed;
  z-index: 10043;
  inset-inline-end: max(var(--app-shell-pad), calc((100vw - var(--app-shell-max)) / 2 + var(--app-shell-pad)));
  width: 2.85rem;
  height: 2.85rem;
  margin: 0;
  padding: 0;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: rgba(21, 29, 46, 0.94);
  border: 1px solid rgb(var(--accent-rgb) / 0.38);
  color: var(--app-icon-mono);
  box-shadow: 0 4px 22px rgba(0, 0, 0, 0.38);
  cursor: pointer;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: translateY(8px);
  transition: opacity 0.36s ease, transform 0.36s ease, visibility 0.36s ease;
}

body.app-shell.has-bottom-nav button.app-scroll-top-fab {
  bottom: calc(var(--bottom-nav-height) + max(12px, env(safe-area-inset-bottom)) + 0.85rem);
}

body.app-shell.has-bottom-nav.has-search-sheet button.app-scroll-top-fab {
  bottom: calc(
    var(--bottom-nav-height) + var(--search-bar-height) + max(12px, env(safe-area-inset-bottom)) + 2.65rem
  );
}

button.app-scroll-top-fab.app-scroll-top-visible {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: translateY(0);
}

button.app-scroll-top-fab.app-scroll-top-fading {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: translateY(6px);
  transition: opacity 0.42s ease, transform 0.42s ease, visibility 0.42s ease;
}

body.search-filter-expanded button.app-scroll-top-fab {
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
  transform: translateY(6px);
}

/* آمار من — هاب پیش‌نمایش */
.stats-hub-preview-card {
  margin-bottom: 0.75rem;
}

.stats-hub-preview-head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  margin-bottom: 0.65rem;
}

.stats-hub-preview-head .stats-section-title {
  margin: 0;
}

.stats-hub-chart-filter.filter-chip-scroll {
  flex: 0 1 auto;
  margin: 0;
  padding: 0;
}

.stats-hub-chart-canvas {
  max-height: 8.25rem;
  margin-bottom: 0.5rem;
}

.stats-hub-bmi-readout {
  min-height: 0;
  margin-top: 0.35rem;
  padding-top: 0.55rem;
  border-top: 1px solid rgba(255, 255, 255, 0.06);
}

html[data-theme="light"] .stats-hub-bmi-readout {
  border-top-color: rgba(19, 18, 26, 0.08);
}

.stats-hub-actions {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  margin-bottom: 0.75rem;
}

button.stats-hub-action-btn {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 0.65rem;
  width: 100%;
  padding: 0.7rem 0.85rem;
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.04);
  color: inherit;
  font: inherit;
  text-align: right;
  cursor: pointer;
  transition: border-color 0.15s ease, background 0.15s ease, transform 0.12s ease;
}

button.stats-hub-action-btn:hover {
  border-color: rgb(var(--accent-rgb) / 0.4);
  background: rgb(var(--accent-hover-rgb) / 0.12);
}

button.stats-hub-action-btn:active {
  transform: scale(0.99);
}

.stats-hub-action-btn .portal-tile-icon.stats-hub-action-icon {
  flex-shrink: 0;
  width: 2.5rem;
  height: 2.5rem;
  margin: 0;
}

button.stats-hub-action-btn:hover .portal-tile-icon {
  color: var(--app-icon-mono);
  background: rgb(var(--accent-rgb) / 0.22);
}

.stats-hub-action-copy {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 0.12rem;
}

.stats-hub-action-title {
  font-weight: 650;
  font-size: 0.92rem;
}

.stats-hub-action-hint {
  line-height: 1.35;
  font-size: 0.78rem;
}

.stats-hub-action-chevron {
  flex-shrink: 0;
}

button.stats-hub-action-btn:hover .stats-hub-action-chevron {
  color: var(--accent, var(--accent));
  transform: translateX(-2px);
}

html[data-theme="light"] button.stats-hub-action-btn {
  border-color: rgba(19, 18, 26, 0.1);
  background: rgba(19, 18, 26, 0.03);
}

html[data-theme="light"] button.stats-hub-action-btn:hover {
  background: rgb(var(--accent-rgb) / 0.08);
  border-color: rgb(var(--accent-rgb) / 0.28);
}

.stats-hub-entries-lead {
  margin: 0 0 0.5rem;
}

.stats-hub-entries-scroll {
  max-height: 14rem;
}

.stats-hub-recent-card {
  margin-bottom: 0.5rem;
}

.stats-hub-recent-card .stats-section-title {
  margin: 0 0 0.55rem;
}

.stats-hub-recent-list {
  list-style: none;
  margin: 0 0 0.75rem;
  padding: 0;
}

.stats-hub-recent-li {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 0.75rem;
  padding: 0.45rem 0;
  border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}

.stats-hub-recent-li:last-child {
  border-bottom: none;
}

html[data-theme="light"] .stats-hub-recent-li {
  border-bottom-color: rgba(19, 18, 26, 0.08);
}

.stats-hub-recent-date {
  font-size: 0.82rem;
  opacity: 0.85;
}

.stats-hub-recent-val {
  font-weight: 600;
}

.stats-chart-card-head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  margin-bottom: 0.65rem;
}

.stats-chart-card-head .stats-section-title {
  margin: 0;
}

.stats-chart-filter.filter-chip-scroll {
  flex: 1 1 auto;
  justify-content: flex-end;
  margin: 0;
  padding: 0;
}

/* آمار من — قد و نمای خانه */
.stats-body-setup-card {
  padding-top: 0.65rem;
}

.stats-body-setup-lead {
  margin: 0 0 0.65rem;
  line-height: 1.5;
}

.stats-body-setup-card .stats-bmi-height-row {
  margin-bottom: 0.75rem;
}

.profile-home-weight-pref-kicker {
  margin: 0 0 0.5rem;
  font-weight: 600;
  letter-spacing: 0.02em;
}

.stats-home-weight-pref-row,
.profile-home-weight-pref-row {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.75rem;
}

.stats-home-weight-pref-copy,
.profile-home-weight-pref-copy {
  flex: 1;
  min-width: 0;
}

.stats-home-weight-pref-title,
.profile-home-weight-pref-title {
  display: block;
  font-size: 0.94rem;
  font-weight: 700;
  line-height: 1.35;
  margin: 0 0 0.25rem;
}

.stats-home-weight-pref-note,
.profile-home-weight-pref-note {
  margin: 0 !important;
  line-height: 1.45;
  max-width: 17rem;
}

.stats-home-weight-feedback.msg,
.profile-home-weight-feedback.msg {
  margin-top: 0.4rem;
  margin-bottom: 0;
  font-size: 0.8125rem;
  min-height: 1.2em;
}

.profile-switch {
  position: relative;
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  cursor: pointer;
  margin-top: 0.12rem;
}

.profile-switch-input {
  position: absolute;
  opacity: 0;
  width: 0;
  height: 0;
  margin: 0;
}

.profile-switch-track {
  display: block;
  width: 2.6rem;
  height: 1.45rem;
  border-radius: 999px;
  background: rgb(var(--accent-rgb) / 0.22);
  border: 1px solid rgb(var(--accent-rgb) / 0.45);
  transition: background 0.18s ease, border-color 0.18s ease;
  position: relative;
}

.profile-switch-thumb {
  position: absolute;
  top: 50%;
  left: 0.12rem;
  width: 1.1rem;
  height: 1.1rem;
  border-radius: 50%;
  background: var(--text);
  transform: translateY(-50%);
  transition: transform 0.18s ease, background 0.18s ease;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
}

.profile-switch-input:checked + .profile-switch-track {
  background: rgb(var(--accent-rgb) / 0.45);
  border-color: var(--accent);
}

.profile-switch-input:checked + .profile-switch-track .profile-switch-thumb {
  transform: translate(1.12rem, -50%);
  background: var(--accent);
}

.profile-switch-input:focus-visible + .profile-switch-track {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}

html[data-theme="light"] .profile-switch-track {
  background: rgb(var(--accent-rgb) / 0.12);
  border-color: rgb(var(--accent-rgb) / 0.28);
}

html[data-theme="light"] .profile-switch-input:checked + .profile-switch-track {
  background: rgb(var(--accent-rgb) / 0.26);
}

.pref-theme-label {
  margin: 0 0 0.35rem;
  color: var(--muted);
  font-size: 0.82rem;
  font-weight: 500;
}

.pref-theme-seg {
  display: flex;
  gap: 0.4rem;
  margin-top: 0.15rem;
}

button.pref-theme-btn {
  flex: 1;
  margin: 0 !important;
  padding: 0.55rem 0.5rem !important;
  background: transparent !important;
  border: 1px solid #2c2a36 !important;
  color: var(--text) !important;
  box-shadow: none !important;
  font-weight: 600 !important;
  font-size: 0.88rem !important;
  border-radius: 0.55rem !important;
}

button.pref-theme-btn.is-on {
  border-color: var(--accent) !important;
  background: rgb(var(--accent-rgb) / 0.16) !important;
  color: #f2f0f7 !important;
}

/* --- تم روشن (پروفایل / localStorage) --- */
html[data-theme="light"] {
  --bg: #f7f6f4;
  --bg-deep: #e9eef8;
  --surface-1: rgba(255, 255, 255, 0.94);
  --surface-2: rgba(248, 250, 252, 0.86);
  --surface-glass: rgba(255, 255, 255, 0.76);
  --line-soft: rgba(19, 18, 26, 0.1);
  --line-strong: rgb(var(--accent-strong-rgb) / 0.22);
  --card: rgba(255, 255, 255, 0.92);
  --text: #13121a;
  --muted: #6b6878;
  --accent: #ea580c;
  --accent-2: #ca8a04;
  --accent-3: var(--accent-strong);
  --accent-warm: #d97706;
  --accent-hover: var(--accent);
  --ok: #ca8a04;
  --err: #dc2626;
  /* کارت حرکت، جستجو، مودال */
  --ex-card-bg: linear-gradient(145deg, #ffffff 0%, #f5f8fc 58%, #edf5f9 100%);
  --ex-card-border: rgb(var(--accent-strong-rgb) / 0.14);
  --ex-card-hover-bd: rgba(202, 138, 4, 0.36);
  --ex-card-shadow: rgba(19, 18, 26, 0.13);
  --ex-media-bg: #e8edf5;
  --ex-ph-a: #dbe4f0;
  --ex-ph-b: #eef2f7;
  --ex-ph-fg: #6b6878;
  --ex-meta: #6b6878;
  --tag-bg: rgb(var(--accent-strong-rgb) / 0.09);
  --tag-fg: #9a3412;
  --tag-bd: rgb(var(--accent-strong-rgb) / 0.2);
  --tag-acc-bg: rgb(var(--accent-strong-rgb) / 0.11);
  --tag-acc-bd: rgb(var(--accent-strong-rgb) / 0.28);
  --tag-acc-fg: #9a3412;
  --filter-wrap-bg: rgba(248, 250, 252, 0.98);
  --filter-wrap-bd: rgba(19, 18, 26, 0.11);
  --filt-chip-bg: #ffffff;
  --filt-chip-bd: rgba(19, 18, 26, 0.13);
  --filt-chip-on-bg: rgb(var(--accent-strong-rgb) / 0.11);
  --filt-chip-on-fg: #7c2d12;
  --detail-meta: #6b6878;
  --detail-body: #332f3e;
  --step-bd-bg: linear-gradient(135deg, var(--accent-strong), #ca8a04);
  --step-bd-fg: #ffffff;
  --step-txt: #332f3e;
  --detail-code-bg: rgba(19, 18, 26, 0.06);
  --plan-row-bg: rgba(255, 255, 255, 0.85);
  --plan-row-bd: rgba(19, 18, 26, 0.1);
  --plan-pick-bg: #f7f6f4;
  --search-status-ok: var(--accent-strong);
  --sheet-toggle-bg: linear-gradient(180deg, rgba(255, 255, 255, 0.96) 0%, rgba(241, 245, 249, 0.98) 100%);
  --sheet-toggle-bd: rgba(19, 18, 26, 0.12);
  --sheet-panel-bg: #ffffff;
  --sheet-panel-bd: rgba(19, 18, 26, 0.11);
  --sheet-inner-top: rgb(var(--accent-strong-rgb) / 0.16);
  --sheet-toggle-shadow: rgba(19, 18, 26, 0.1);
  --ex-fav-bg: rgba(255, 255, 255, 0.94);
  --ex-fav-bd: rgba(19, 18, 26, 0.12);
  --ex-fav-shadow: rgba(19, 18, 26, 0.1);
  --modal-x-bg: rgba(19, 18, 26, 0.06);
  --hero-radial: rgba(202, 138, 4, 0.11);
  --modal-head-bd: rgba(19, 18, 26, 0.1);
  --app-ui-icon-img-filter: brightness(0);
  --app-icon-mono: #13121a;
  --app-icon-mono-soft: rgba(19, 18, 26, 0.68);

  color-scheme: light;
}

html[data-theme="light"] input,
html[data-theme="light"] select,
html[data-theme="light"] textarea {
  background: #ffffff;
  border-color: rgba(19, 18, 26, 0.16);
}

html[data-theme="light"] button.pref-theme-btn {
  border-color: rgb(var(--accent-rgb) / 0.32) !important;
}

html[data-theme="light"] button.pref-theme-btn.is-on {
  background: rgb(var(--accent-rgb) / 0.12) !important;
  color: var(--accent) !important;
}

html[data-theme="light"] .card {
  border-color: rgba(19, 18, 26, 0.1);
  box-shadow: 0 12px 32px rgba(19, 18, 26, 0.075), 0 1px 0 rgba(255, 255, 255, 0.9) inset;
}

html[data-theme="light"] button.secondary,
html[data-theme="light"] button.wide.secondary {
  border-color: rgb(var(--accent-rgb) / 0.35);
}

html[data-theme="light"] .btn-back {
  border-color: rgba(19, 18, 26, 0.16);
}

html[data-theme="light"] .app-toolbar-bleed {
  background: rgba(255, 255, 255, 0.92);
  border-bottom-color: rgba(19, 18, 26, 0.1);
}

html[data-theme="light"] .app-brand {
  border-bottom-color: rgba(19, 18, 26, 0.12);
  background: linear-gradient(180deg, rgba(244, 247, 251, 0.96), rgba(244, 247, 251, 0.78));
}

html[data-theme="light"] .app-brand-logo {
  box-shadow:
    0 8px 18px rgb(var(--accent-rgb) / 0.14),
    0 0 0 1px rgba(19, 18, 26, 0.08) inset;
}

html[data-theme="light"] .phone-auth-lockup {
  filter:
    drop-shadow(0 8px 18px rgb(var(--accent-rgb) / 0.12))
    drop-shadow(0 3px 8px rgba(19, 18, 26, 0.1));
}

html[data-theme="light"] .app-theme-toggle {
  border-color: rgb(var(--accent-strong-rgb) / 0.2);
  background: rgb(var(--accent-rgb) / 0.08);
  color: var(--app-icon-mono);
}

html[data-theme="light"] .app-theme-toggle:hover,
html[data-theme="light"] .app-theme-toggle:focus-visible {
  border-color: rgb(var(--accent-rgb) / 0.32);
  background: rgb(var(--accent-rgb) / 0.1);
}

html[data-theme="light"] .app-bottom-nav {
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.82), rgba(245, 247, 252, 0.96));
  border-top-color: rgba(19, 18, 26, 0.1);
  box-shadow: 0 -10px 30px rgba(19, 18, 26, 0.11);
}

html[data-theme="light"] .app-bottom-nav button.app-nav-btn {
  --nav-icon-filter: brightness(0) saturate(100%) invert(34%) sepia(11%) saturate(792%) hue-rotate(178deg)
    brightness(91%) contrast(88%);
  color: #4a4656;
}

html[data-theme="light"] .app-bottom-nav #nav-workout {
  background: linear-gradient(135deg, rgb(var(--accent-strong-rgb) / 0.12), rgba(202, 138, 4, 0.08));
  border-color: rgb(var(--accent-strong-rgb) / 0.18);
}

html[data-theme="light"] .app-bottom-nav .app-nav-icon-img {
  opacity: 1;
}

html[data-theme="light"] .app-bottom-nav button.app-nav-btn:not(.is-active):hover {
  background: rgba(19, 18, 26, 0.055);
}

html[data-theme="light"] .app-bottom-nav button.app-nav-btn.is-active {
  background: linear-gradient(135deg, rgb(var(--accent-strong-rgb) / 0.82), rgba(202, 138, 4, 0.74));
  box-shadow: 0 10px 24px rgba(202, 138, 4, 0.16), 0 4px 18px rgb(var(--accent-strong-rgb) / 0.14);
}

html[data-theme="light"] .app-bottom-nav #nav-workout.is-active {
  background: linear-gradient(135deg, rgba(255, 255, 255, 0.98), rgba(237, 242, 255, 0.96));
  border-color: rgb(var(--accent-strong-rgb) / 0.34);
  box-shadow: 0 12px 26px rgba(19, 18, 26, 0.13), 0 0 0 3px rgb(var(--accent-strong-rgb) / 0.1);
}

html[data-theme="light"] .app-bottom-nav #nav-workout.is-active .app-nav-icon-img {
  filter: brightness(0) saturate(100%) invert(20%) sepia(78%) saturate(2597%) hue-rotate(258deg)
    brightness(84%) contrast(100%);
  opacity: 1;
}

html[data-theme="light"] button.app-scroll-top-fab {
  background: rgba(255, 255, 255, 0.96);
  border-color: rgb(var(--accent-rgb) / 0.35);
  box-shadow: 0 4px 20px rgba(19, 18, 26, 0.12);
  color: var(--app-icon-mono);
}

html[data-theme="light"] .workout-tile-card {
  border-color: rgba(19, 18, 26, 0.12);
  box-shadow: 0 2px 10px rgba(19, 18, 26, 0.06);
}

html[data-theme="light"] .exercise-modal-backdrop {
  background: rgba(19, 18, 26, 0.42);
}

html[data-theme="light"] .exercise-modal-panel {
  background: linear-gradient(180deg, #ffffff 0%, #f7f6f4 100%);
  border-color: rgba(19, 18, 26, 0.12);
  box-shadow: 0 -8px 40px rgba(19, 18, 26, 0.18);
}

html[data-theme="light"] .exercise-report-backdrop {
  background: rgba(19, 18, 26, 0.42);
}

html[data-theme="light"] .exercise-report-panel {
  background: linear-gradient(180deg, #ffffff 0%, #f7f6f4 100%);
  border-color: rgba(19, 18, 26, 0.12);
  box-shadow: 0 -8px 40px rgba(19, 18, 26, 0.18);
}

html[data-theme="light"] .my-ex-step-row {
  border-color: rgba(19, 18, 26, 0.12);
  background: rgba(241, 245, 249, 0.8);
}

html[data-theme="light"] .btn-remove-step {
  border-color: rgba(19, 18, 26, 0.14);
  background: rgba(255, 255, 255, 0.9);
}

html[data-theme="light"] .select-multi {
  border-color: rgba(19, 18, 26, 0.12);
}

html[data-theme="light"] .plan-picker-icon-btn {
  border-color: rgba(19, 18, 26, 0.14);
  background: rgba(248, 250, 252, 0.95);
  color: var(--app-icon-mono);
}

html[data-theme="light"] button.plan-picker-icon-btn:hover {
  border-color: rgb(var(--accent-rgb) / 0.35);
  background: rgb(var(--accent-rgb) / 0.08);
  color: var(--accent);
}

html[data-theme="light"] .plan-picker-add:hover {
  color: var(--ok);
}

html[data-theme="light"] .plan-picker-remove.plan-picker-icon-danger {
  color: #b91c1c;
}

html[data-theme="light"] .plan-picker-remove.plan-picker-icon-danger:hover {
  color: #991b1b;
}

html[data-theme="light"] .nav-tile.secondary-tile {
  border-color: rgba(19, 18, 26, 0.14);
}

/* ─── وزن و هدف خانه؛ خلاصهٔ فشرده و خوانا بالای تمرین تصادفی ─── */
.portal-weight-goal-card {
  box-sizing: border-box;
  margin: 0.35rem 0 0.8rem;
  padding: 0.82rem 0.88rem;
  border-radius: 0.8rem;
  border: 1px solid var(--line-soft);
  background: var(--card);
  box-shadow: none;
}

.portal-weight-goal-card.hidden {
  display: none !important;
}

.portal-weight-goal-line {
  margin: 0;
  text-align: right;
  font-size: 0.8125rem;
  font-weight: 650;
  color: var(--text);
  line-height: 1.45;
  letter-spacing: 0;
}

/* خلاصهٔ وزن / هدف / BMI — خانه و سرصفحهٔ آمار */
.weight-goal-summary {
  display: flex;
  flex-direction: column;
  gap: 0.58rem;
  align-items: center;
  width: 100%;
}

.weight-goal-summary--portal {
  align-items: stretch;
}

.weight-goal-summary-top {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 0.55rem;
  text-align: right;
}

.weight-goal-summary-kicker {
  color: var(--muted);
  font-size: 0.78rem;
  font-weight: 800;
}

.weight-goal-summary--headline {
  align-items: flex-start;
  text-align: right;
}

.weight-goal-summary-metrics {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: baseline;
  gap: 0.28rem 0.5rem;
}

.weight-goal-summary--portal .weight-goal-summary-metrics {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(4.8rem, 1fr));
  align-items: stretch;
  gap: 0.45rem;
}

.weight-goal-summary--headline .weight-goal-summary-metrics {
  justify-content: flex-start;
}

.weight-goal-metric {
  min-width: 0;
  display: inline-flex;
  align-items: baseline;
  gap: 0.18rem;
}

.weight-goal-summary--portal .weight-goal-metric {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.06rem;
  padding: 0.48rem 0.32rem;
  border: 1px solid color-mix(in srgb, var(--accent) 13%, var(--shell-line));
  border-radius: 0.62rem;
  background: color-mix(in srgb, var(--accent) 6%, transparent);
}

.weight-goal-metric-label {
  font-size: 0.72rem;
  font-weight: 650;
  color: var(--muted);
}

.weight-goal-metric-val {
  font-size: 1rem;
  font-weight: 800;
  letter-spacing: 0.02em;
  color: var(--text);
  unicode-bidi: isolate;
}

.weight-goal-summary--headline .weight-goal-metric-val {
  font-size: 1.02rem;
}

.weight-goal-metric-val--goal {
  color: #facc15;
}

.weight-goal-metric-val--bmi {
  color: var(--accent-hover);
}

.weight-goal-metric-unit {
  font-size: 0.68rem;
  font-weight: 600;
  color: var(--muted);
}

.weight-goal-metric-sep {
  font-size: 0.82rem;
  font-weight: 700;
  color: rgba(163, 160, 173, 0.55);
  user-select: none;
}

.weight-goal-summary--portal .weight-goal-metric-sep {
  display: none;
}

.weight-goal-hl {
  font-weight: 750;
  color: #fed7aa;
  padding: 0.02em 0.14em;
  border-radius: 0.22rem;
  background: rgb(var(--accent-rgb) / 0.14);
}

.weight-goal-hl--bmi {
  color: var(--accent-hover);
  background: rgb(var(--accent-rgb) / 0.12);
}

.weight-goal-hl--zone {
  color: #facc15;
  background: rgba(250, 204, 21, 0.1);
}

.weight-goal-summary-status {
  margin: 0;
  max-width: 100%;
  font-size: 0.76rem;
  font-weight: 700;
  line-height: 1.48;
  color: var(--muted);
  text-align: center;
}

.weight-goal-summary--portal .weight-goal-summary-status {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  padding: 0.62rem 0.78rem;
  border: 1px solid color-mix(in srgb, var(--accent) 16%, transparent);
  border-radius: 999px;
  background: color-mix(in srgb, var(--ink) 12%, transparent);
  box-shadow:
    inset 0 0 1.4rem color-mix(in srgb, var(--accent) 10%, transparent),
    0 0.5rem 1.25rem color-mix(in srgb, var(--ink) 12%, transparent);
}

.weight-goal-summary--portal .weight-goal-summary-status::before {
  content: none;
}

.weight-goal-summary--portal .weight-goal-summary-status .weight-goal-hl {
  padding: 0;
  border-radius: 0;
  background: transparent;
}

.weight-goal-summary--headline .weight-goal-summary-status {
  font-size: 0.84rem;
  text-align: right;
}

.weight-goal-summary-status--on-target .weight-goal-hl {
  color: #facc15;
  background: rgba(250, 204, 21, 0.12);
}

.weight-goal-summary-status--lose .weight-goal-hl {
  color: #fcd34d;
  background: rgba(251, 191, 36, 0.12);
}

.weight-goal-summary-status--gain .weight-goal-hl {
  color: var(--accent-hover);
  background: rgb(var(--accent-rgb) / 0.12);
}

html[data-theme="light"] .weight-goal-metric-val--goal {
  color: #ca8a04;
}

html[data-theme="light"] .weight-goal-metric-val--bmi {
  color: #c2410c;
}

html[data-theme="light"] .weight-goal-hl {
  color: #c2410c;
  background: rgb(var(--accent-rgb) / 0.1);
}

html[data-theme="light"] .weight-goal-hl--zone {
  color: #ca8a04;
  background: rgba(250, 204, 21, 0.14);
}

html[data-theme="light"] .weight-goal-summary-status--on-target .weight-goal-hl {
  color: #ca8a04;
  background: rgba(250, 204, 21, 0.14);
}

.stats-bmi-readout-inner {
  display: flex;
  flex-direction: column;
  gap: 0.28rem;
}

.stats-bmi-readout-main {
  margin: 0;
  font-weight: 650;
}

.stats-bmi-readout-detail {
  margin: 0;
}

html[data-theme="light"] .portal-weight-goal-card {
  border-color: color-mix(in srgb, var(--accent) 18%, var(--shell-line));
  background: linear-gradient(145deg, #ffffff, #fff7ed);
  box-shadow: 0 2px 12px rgba(19, 18, 26, 0.06);
}

html[data-theme="light"] .weight-goal-summary--portal .weight-goal-summary-status {
  border-color: rgb(var(--accent-rgb) / 0.16);
  background: rgba(255, 247, 237, 0.82);
  box-shadow:
    inset 0 0 1.2rem rgb(var(--accent-rgb) / 0.08),
    0 0.45rem 1.1rem rgba(19, 18, 26, 0.06);
}

.stats-jalali-fields-label {
  margin: 0 0 0.35rem;
}

.stats-jalali-row {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  align-items: center;
}

select.stats-jalali-part {
  flex: 1 1 6.5rem;
  min-width: 0;
  font-size: 0.85rem;
  padding: 0.35rem 0.4rem;
  border-radius: 0.45rem;
}

.stats-section-title {
  margin: 0 0 0.65rem;
  font-size: 1.02rem;
  font-weight: 700;
}

.stats-subsection-title {
  margin: 0 0 0.4rem;
  font-size: 0.93rem;
  font-weight: 700;
}

.stats-bmi-target-card .stats-section-title {
  flex: 1;
  margin: 0;
  padding-inline-end: 0.35rem;
}

.stats-bmi-intro {
  margin: 0 0 0.5rem !important;
  line-height: 1.52;
}

.stats-bmi-height-row {
  display: grid;
  grid-template-columns: 1fr minmax(7.5rem, 9.75rem);
  gap: 0.45rem;
  align-items: stretch;
}

.stats-bmi-height-row #btn-stats-save-height {
  width: 100%;
  margin: 0;
  align-self: stretch;
}

.stats-bmi-height-field {
  min-width: 0;
}

.stats-bmi-target-divider {
  height: 0;
  margin: 0.9rem 0 0.75rem;
  border: none;
  border-top: 1px dashed rgb(var(--accent-rgb) / 0.42);
}

html[data-theme="light"] .stats-bmi-target-divider {
  border-top-color: rgb(var(--accent-rgb) / 0.24);
}

@keyframes stats-target-highlight {
  0% {
    box-shadow: 0 0 0 0 rgb(var(--accent-rgb) / 0.55);
  }
  100% {
    box-shadow: 0 0 0 10px transparent;
  }
}

input.weight-spin-range.stats-target-pulse-highlight {
  outline: 2px solid var(--accent);
  outline-offset: 3px;
}

.stats-bmi-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
}

.stats-bmi-readout {
  margin: 0.5rem 0 0.45rem;
  padding: 0.55rem 0.62rem;
  border-radius: 0.52rem;
  background: rgba(10, 14, 24, 0.35);
  font-size: 0.92rem;
  line-height: 1.52;
  white-space: pre-line;
}

.stats-bmi-target-card #btn-stats-bmi-suggest.wide,
.stats-bmi-target-card #btn-stats-bmi-suggest {
  margin-top: 0.15rem !important;
}

html[data-theme="light"] .stats-bmi-readout {
  background: rgba(241, 245, 249, 0.95);
}

.stats-actions-row {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
  margin-top: 0.65rem;
  align-items: center;
}

.stats-jalali-label {
  margin: 0.12rem 0 0.45rem;
}

.stats-chart-card {
  overflow: hidden;
}

/* انتخاب وزن — لمس عدد → شیت چرخ عمودی */
.weight-picker {
  margin: 0.35rem 0 0.5rem;
}

button.weight-picker-trigger {
  display: block;
  width: 100%;
  margin: 0;
  padding: 0.85rem 0.75rem;
  border: 1px solid var(--control-line);
  border-radius: 0.9rem;
  background: var(--control-bg);
  box-shadow: none;
  cursor: pointer;
  text-align: center;
  font: inherit;
  color: inherit;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

button.weight-picker-trigger:hover {
  border-color: rgb(var(--accent-rgb) / 0.5);
  box-shadow: 0 0 0 3px rgb(var(--accent-rgb) / 0.12);
}

html[data-theme="light"] button.weight-picker-trigger {
  border-color: var(--control-line);
  background: #ffffff;
}

.weight-picker-value {
  display: block;
  font-size: clamp(1.9rem, 8vw, 2.4rem);
  font-weight: 800;
  line-height: 1.1;
  unicode-bidi: isolate;
  color: var(--text);
}

html[data-theme="light"] .weight-picker-value {
  color: var(--text);
}

.weight-picker-unit,
.weight-picker-trigger-hint {
  display: block;
  margin-top: 0.2rem;
  font-size: 0.8rem;
}

.weight-picker-hint {
  margin: 0.2rem 0 0.55rem;
  line-height: 1.45;
  text-align: center;
}

body.weight-picker-sheet-open {
  overflow: hidden;
}

.weight-picker-sheet {
  position: fixed;
  inset: 0;
  z-index: var(--layer-modal);
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  pointer-events: none;
}

.weight-picker-sheet:not(.hidden) {
  pointer-events: auto;
}

.weight-picker-sheet-backdrop {
  position: absolute;
  inset: 0;
  margin: 0;
  padding: 0;
  border: none;
  background: rgba(0, 0, 0, 0.52);
  cursor: pointer;
}

.weight-picker-sheet-panel {
  position: relative;
  z-index: 1;
  margin: 0;
  max-height: calc(100dvh - max(0.75rem, env(safe-area-inset-top)));
  overflow-y: auto;
  overscroll-behavior: contain;
  padding: 1rem 1rem calc(1rem + env(safe-area-inset-bottom, 0px));
  border-radius: 20px 20px 0 0;
  border: 1px solid rgb(var(--accent-rgb) / 0.28);
  border-bottom: none;
  background: linear-gradient(180deg, rgba(22, 28, 52, 0.98), rgba(10, 14, 28, 0.99));
  box-shadow: 0 -12px 40px rgba(0, 0, 0, 0.35);
  transform: translateY(0);
  animation: weight-sheet-in 0.28s ease;
}

html[data-theme="light"] .weight-picker-sheet-panel {
  background: linear-gradient(180deg, #fff, #f7f6f4);
  border-color: rgb(var(--accent-rgb) / 0.18);
}

@keyframes weight-sheet-in {
  from {
    transform: translateY(100%);
    opacity: 0.6;
  }
  to {
    transform: translateY(0);
    opacity: 1;
  }
}

@keyframes weight-sheet-center-in {
  from {
    transform: translateY(8px) scale(0.97);
    opacity: 0;
  }
  to {
    transform: translateY(0) scale(1);
    opacity: 1;
  }
}

.weight-picker-sheet-head {
  text-align: center;
  margin-bottom: 0.65rem;
}

.weight-picker-sheet-title {
  margin: 0 0 0.35rem;
  font-size: 0.88rem;
  color: var(--muted);
}

.weight-picker-sheet-preview {
  display: block;
  font-size: 2.2rem;
  font-weight: 800;
  line-height: 1.1;
  unicode-bidi: isolate;
}

.weight-picker-sheet-unit {
  display: block;
  margin-top: 0.15rem;
}

.weight-picker-wheel-wrap {
  position: relative;
  margin: 0.25rem 0 0.65rem;
  border-radius: 14px;
  overflow: hidden;
  background: rgba(7, 6, 10, 0.55);
}

html[data-theme="light"] .weight-picker-wheel-wrap {
  background: rgba(241, 245, 249, 0.95);
}

.weight-picker-wheel-wrap::before,
.weight-picker-wheel-wrap::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  height: 34%;
  z-index: 2;
  pointer-events: none;
}

.weight-picker-wheel-wrap::before {
  top: 0;
  background: linear-gradient(180deg, rgba(10, 14, 28, 0.92), transparent);
}

.weight-picker-wheel-wrap::after {
  bottom: 0;
  background: linear-gradient(0deg, rgba(10, 14, 28, 0.92), transparent);
}

html[data-theme="light"] .weight-picker-wheel-wrap::before {
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.95), transparent);
}

html[data-theme="light"] .weight-picker-wheel-wrap::after {
  background: linear-gradient(0deg, rgba(255, 255, 255, 0.95), transparent);
}

.weight-picker-wheel-highlight {
  position: absolute;
  left: 0.65rem;
  right: 0.65rem;
  top: 50%;
  transform: translateY(-50%);
  height: 48px;
  border-radius: 12px;
  border: 1px solid rgb(var(--accent-rgb) / 0.4);
  background: rgb(var(--accent-hover-rgb) / 0.12);
  z-index: 1;
  pointer-events: none;
}

.weight-picker-wheel-track {
  position: relative;
  z-index: 0;
  height: 100%;
  overflow-y: auto;
  overflow-x: hidden;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
  scroll-snap-type: y mandatory;
  scrollbar-width: none;
}

.weight-picker-wheel-track::-webkit-scrollbar {
  display: none;
}

.weight-picker-wheel-track:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}

.weight-picker-wheel-item {
  display: flex;
  align-items: center;
  justify-content: center;
  scroll-snap-align: center;
  font-size: 1.15rem;
  font-weight: 600;
  color: var(--muted);
  unicode-bidi: isolate;
}

.weight-picker-wheel-item.is-active {
  font-size: 1.45rem;
  font-weight: 800;
  color: var(--accent);
}

.weight-picker-sheet-steps {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0.45rem;
  margin-bottom: 0.65rem;
}

.weight-picker-sheet-steps .secondary {
  margin: 0;
  padding: 0.55rem 0.25rem;
  font-size: 0.9rem;
}

.weight-picker-sheet-done {
  margin: 0;
}

.weight-spin {
  margin: 0.1rem 0 0.5rem;
}

.weight-spin-row {
  display: flex;
  flex-direction: row;
  align-items: baseline;
  justify-content: flex-start;
  gap: 0.4rem;
  margin-bottom: 0.35rem;
}

.weight-spin-unit {
  line-height: 1.2;
}

.weight-spin-val {
  font-size: 1.05rem;
  font-weight: 800;
  letter-spacing: 0.03em;
  min-width: 2.85rem;
  unicode-bidi: isolate;
}

.weight-spin-range {
  display: block;
  box-sizing: border-box;
  width: 100%;
  height: 2.35rem;
  margin: 0.15rem 0 0.4rem;
  accent-color: var(--accent);
  cursor: pointer;
}

.weight-spin-range:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 3px;
}

.weight-spin-nudge-row {
  display: flex;
  flex-direction: row;
  gap: 0.4rem;
}

.weight-spin-nudge-row .weight-spin-nudge {
  flex: 1;
  margin: 0;
  padding: 0.45rem 0.35rem;
  font-weight: 600;
}

.stats-weight-list-scroll {
  max-height: min(52vh, 26rem);
  overflow-y: auto;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
  border-radius: 0.55rem;
  border: 1px solid rgb(var(--accent-rgb) / 0.28);
  background: rgba(6, 10, 22, 0.45);
  padding: 0.15rem 0.62rem;
}

.stats-history-card .stats-history-lead {
  margin-top: -0.2rem !important;
  margin-bottom: 0.6rem !important;
  line-height: 1.5;
}

html[data-theme="light"] .stats-weight-list-scroll {
  background: rgba(248, 250, 252, 0.98);
  border-color: rgba(19, 18, 26, 0.1);
}

.stats-list-empty {
  margin-top: 0.5rem !important;
}

.stats-weight-chart-canvas {
  display: block;
  width: 100%;
  max-width: 100%;
  height: auto;
  aspect-ratio: 3 / 1.2;
  margin: 0.25rem 0 0;
}

.stats-weight-list {
  list-style: none;
  margin: 0;
  padding: 0;
}

.stats-weight-list li {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 0.65rem;
  padding: 0.45rem 0;
  border-bottom: 1px solid rgb(var(--accent-rgb) / 0.15);
  font-size: 0.9rem;
}

.stats-weight-list li:last-child {
  border-bottom: none;
}

.stats-weight-li-date {
  color: var(--muted);
  font-size: 0.84rem;
}

.stats-weight-li-val {
  font-weight: 700;
}

.stats-delta-good {
  color: #86efac;
}

.stats-delta-bad {
  color: #fca5a5;
}

.stats-delta-muted {
  color: var(--muted);
  opacity: 0.95;
  font-weight: 500;
}

html[data-theme="light"] .stats-delta-good {
  color: #15803d;
}

html[data-theme="light"] .stats-delta-bad {
  color: #b91c1c;
}

/* صفحهٔ برنامهٔ جدید — انتخاب مخاطب (مربی) */
.plan-new-coach-wrap {
  margin: 1rem 0 0.25rem;
  padding: 0.85rem 0.95rem;
  border-radius: var(--radius);
  border: 1px solid var(--plan-row-bd);
  background: var(--plan-pick-bg);
}

.plan-new-coach-head {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  flex-wrap: wrap;
  margin-bottom: 0.65rem;
}

.plan-new-coach-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0.12rem 0.45rem;
  border-radius: 999px;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.02em;
  color: var(--filt-chip-on-fg);
  background: var(--filt-chip-on-bg);
  border: 1px solid rgb(var(--accent-rgb) / 0.35);
}

.plan-new-coach-title {
  margin: 0;
  font-size: 0.95rem;
  font-weight: 600;
  color: var(--text);
}

.plan-new-coach-segment {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.55rem;
}

.plan-new-coach-seg {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 3.35rem;
  margin: 0;
  padding: 0.55rem 0.45rem;
  border-radius: calc(var(--radius) * 0.85);
  border: 1px solid var(--plan-row-bd);
  background: rgba(0, 0, 0, 0.12);
  cursor: pointer;
  transition:
    border-color 0.15s ease,
    background 0.15s ease,
    box-shadow 0.15s ease;
  user-select: none;
  -webkit-tap-highlight-color: transparent;
}

.plan-new-coach-seg:hover {
  border-color: rgb(var(--accent-rgb) / 0.35);
}

.plan-new-coach-seg:focus-within {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}

.plan-new-coach-seg input[type="radio"] {
  position: absolute;
  opacity: 0;
  width: 1px;
  height: 1px;
  margin: 0;
  pointer-events: none;
}

.plan-new-coach-seg-text {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 0.15rem;
  pointer-events: none;
}

.plan-new-coach-seg-label {
  font-weight: 700;
  font-size: 0.98rem;
  line-height: 1.25;
  color: var(--text);
}

.plan-new-coach-seg-hint {
  font-size: 0.72rem;
  line-height: 1.35;
  max-width: 9.5rem;
}

.plan-new-coach-seg--active {
  border-color: rgb(var(--accent-rgb) / 0.55);
  background: var(--filt-chip-on-bg);
  box-shadow: 0 0 0 1px rgb(var(--accent-rgb) / 0.22);
}

.plan-new-coach-seg--active .plan-new-coach-seg-label {
  color: var(--filt-chip-on-fg);
}

.plan-new-coach-student-panel {
  margin-top: 0.85rem;
  padding-top: 0.85rem;
  border-top: 1px dashed var(--plan-row-bd);
}

html[data-theme="light"] .plan-new-coach-wrap {
  background: rgba(255, 255, 255, 0.55);
}

html[data-theme="light"] .plan-new-coach-seg {
  background: rgba(255, 255, 255, 0.65);
}

html[data-theme="light"] .plan-new-coach-seg--active {
  box-shadow: 0 1px 0 rgb(var(--accent-rgb) / 0.15);
}

/* دیالوگ به‌روزرسانیٔ پوسته — تمام صفحه، کارت مرکزی */
.fitana-fresh-prompt {
  position: fixed;
  inset: 0;
  z-index: 10100;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  padding: 0.75rem;
  padding-bottom: calc(0.9rem + env(safe-area-inset-bottom, 0px));
  background: rgba(6, 8, 16, 0.42);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  pointer-events: auto;
}

.fitana-fresh-prompt.hidden {
  display: none !important;
}

.fitana-fresh-prompt-card {
  pointer-events: auto;
  width: 100%;
  max-width: 21.75rem;
  max-height: min(68vh, 29rem);
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 0.55rem;
  padding: 0.9rem 0.95rem 0.9rem;
  border-radius: var(--radius);
  border: 1px solid var(--control-line);
  background: var(--surface);
  box-shadow: var(--shadow-modal);
  overflow: hidden;
  text-align: right;
}

.fitana-fresh-prompt-top {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  gap: 0.7rem;
  width: 100%;
  flex-shrink: 0;
}

.fitana-fresh-prompt-intro {
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 0.15rem;
}

.fitana-fresh-prompt-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 2.75rem;
  height: 2.75rem;
  border-radius: var(--radius);
  color: #fed7aa;
  background: rgb(var(--accent-strong-rgb) / 0.22);
  border: 1px solid rgb(var(--accent-rgb) / 0.35);
}

.fitana-fresh-prompt-icon svg {
  display: block;
}

.fitana-fresh-prompt-title {
  margin: 0;
  font-size: 1rem;
  font-weight: 800;
  color: var(--text);
  line-height: 1.35;
  letter-spacing: 0;
}

.fitana-fresh-version-badge {
  margin: 0;
  margin-top: 0.1rem;
  font-size: 0.8rem;
  font-weight: 700;
  color: var(--accent-soft);
  letter-spacing: 0.02em;
}

.fitana-fresh-version-badge.hidden {
  display: none !important;
}

.fitana-fresh-built-at {
  margin: 0;
}

.fitana-fresh-built-at.hidden {
  display: none !important;
}

.fitana-fresh-summary {
  margin: 0;
  padding: 0.5rem 0.6rem;
  border-radius: 0.55rem;
  font-size: 0.82rem;
  font-weight: 500;
  line-height: 1.55;
  color: rgba(237, 242, 247, 0.92);
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid rgba(255, 255, 255, 0.06);
}

.fitana-fresh-summary.hidden {
  display: none !important;
}

.fitana-fresh-changes-heading {
  margin: 0;
  flex-shrink: 0;
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: none;
  color: rgba(226, 232, 240, 0.75);
}

.fitana-fresh-changes-scroll {
  max-height: min(7.8rem, 24vh);
  overflow-y: auto;
  margin: 0 -0.2rem;
  padding: 0 0.2rem 0.15rem;
  scrollbar-width: none;
  -ms-overflow-style: none;
}

.fitana-fresh-changes-scroll.fitana-fresh-changes-scroll--short {
  max-height: none;
}

.fitana-fresh-changes-scroll::-webkit-scrollbar {
  display: none;
  width: 0;
  height: 0;
}

.fitana-fresh-highlights {
  margin: 0;
  padding: 0 0 0 0;
  list-style: none;
  font-size: 0.815rem;
  line-height: 1.62;
  color: rgba(237, 242, 247, 0.95);
}

.fitana-fresh-highlights li {
  margin: 0;
  padding: 0.32rem 0.6rem 0.32rem 0.95rem;
  position: relative;
  border-inline-end: 2px solid rgb(var(--accent-strong-rgb) / 0.45);
}

.fitana-fresh-highlights li + li {
  margin-top: 0.15rem;
}

.fitana-fresh-highlights li::before {
  content: "";
  position: absolute;
  inset-inline-end: -0.3rem;
  top: 0.85em;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--accent-hover);
  box-shadow: 0 0 0 3px rgb(var(--accent-rgb) / 0.12);
}

.fitana-fresh-prompt-lead {
  margin: 0;
  flex-shrink: 0;
  font-size: 0.8rem;
  line-height: 1.52;
  color: rgba(203, 213, 225, 0.88);
}

.fitana-fresh-prompt-actions {
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  width: 100%;
  margin-top: 0.1rem;
  padding-top: 0.55rem;
  border-top: 1px solid rgba(255, 255, 255, 0.07);
}

.fitana-fresh-progress {
  flex-shrink: 0;
  display: grid;
  gap: 0.42rem;
  padding: 0.6rem 0.62rem;
  border: 1px solid rgb(var(--accent-rgb) / 0.18);
  border-radius: 0.72rem;
  background: rgb(var(--accent-rgb) / 0.08);
}

.fitana-fresh-progress.hidden {
  display: none !important;
}

.fitana-fresh-progress-track {
  display: block;
  width: 100%;
  height: 0.42rem;
  overflow: hidden;
  border-radius: 999px;
  background: rgba(19, 18, 26, 0.44);
}

.fitana-fresh-progress-bar {
  display: block;
  width: 8%;
  height: 100%;
  border-radius: inherit;
  background: var(--accent);
  box-shadow: none;
  transition: width 0.32s ease;
}

.fitana-fresh-progress-text {
  color: rgba(237, 242, 247, 0.9);
  font-size: 0.78rem;
  font-weight: 700;
  line-height: 1.45;
}

.fitana-fresh-prompt-card.is-applying .fitana-fresh-changes-scroll,
.fitana-fresh-prompt-card.is-applying .fitana-fresh-changes-heading {
  display: none;
}

.fitana-fresh-prompt-card.is-applying .fitana-fresh-prompt-lead {
  color: rgba(237, 242, 247, 0.92);
}

.fitana-fresh-prompt-actions .fitana-fresh-go {
  width: 100%;
  min-height: 2.9rem;
  font-weight: 700;
  box-shadow: 0 6px 20px rgb(var(--accent-strong-rgb) / 0.32);
}

.fitana-fresh-prompt-actions .fitana-fresh-later {
  width: 100%;
  min-height: 2.75rem;
  font-size: 0.82rem;
  opacity: 0.94;
}

html[data-theme="light"] .fitana-fresh-prompt {
  background: rgba(19, 18, 26, 0.4);
}

html[data-theme="light"] .fitana-fresh-prompt-card {
  border-color: var(--control-line);
  background: var(--surface);
  color: var(--text);
  box-shadow: var(--shadow-modal);
}

html[data-theme="light"] .fitana-fresh-prompt-card :is(.muted, .small) {
  color: #4a4656;
}

html[data-theme="light"] .fitana-fresh-prompt-title {
  color: #13121a;
}

html[data-theme="light"] .fitana-fresh-version-badge {
  color: var(--accent-strong);
}

html[data-theme="light"] .fitana-fresh-prompt-icon {
  color: #ffffff;
  background: var(--accent);
  border-color: rgba(154, 52, 18, 0.36);
  box-shadow: none;
}

html[data-theme="light"] .fitana-fresh-prompt-icon svg {
  stroke: #ffffff;
}

html[data-theme="light"] .fitana-fresh-summary {
  color: #211f2a;
  background: rgb(var(--accent-strong-rgb) / 0.06);
  border-color: rgb(var(--accent-strong-rgb) / 0.12);
}

html[data-theme="light"] .fitana-fresh-changes-heading {
  color: rgba(71, 85, 105, 0.95);
}

html[data-theme="light"] .fitana-fresh-highlights {
  color: #332f3e;
}

html[data-theme="light"] .fitana-fresh-highlights li {
  border-inline-end-color: rgb(var(--accent-strong-rgb) / 0.35);
}

html[data-theme="light"] .fitana-fresh-prompt-lead {
  color: #6b6878;
}

html[data-theme="light"] .fitana-fresh-prompt-card.is-applying .fitana-fresh-prompt-lead {
  color: #332f3e;
}

html[data-theme="light"] .fitana-fresh-prompt-actions {
  border-top-color: rgba(19, 18, 26, 0.08);
}

html[data-theme="light"] .fitana-fresh-progress {
  border-color: rgb(var(--accent-strong-rgb) / 0.14);
  background: rgba(255, 247, 237, 0.82);
  color: #7c2d12;
}

html[data-theme="light"] .fitana-fresh-progress-track {
  background: rgba(19, 18, 26, 0.1);
}

html[data-theme="light"] .fitana-fresh-progress-text {
  color: #7c2d12;
}

html[data-theme="light"] .fitana-fresh-prompt-actions .fitana-fresh-go {
  color: #fff7ed;
  box-shadow: 0 6px 18px rgb(var(--accent-strong-rgb) / 0.22);
}

html[data-theme="light"] .fitana-fresh-prompt-actions .fitana-fresh-later {
  color: #332f3e;
}

.fitana-install-prompt {
  position: fixed;
  inset: 0;
  z-index: 10090;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  padding: 0.75rem;
  padding-bottom: calc(0.9rem + env(safe-area-inset-bottom, 0px));
  background: rgba(6, 8, 16, 0.5);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  pointer-events: auto;
}

.fitana-install-prompt.hidden {
  display: none !important;
}

.fitana-install-card {
  pointer-events: auto;
  width: 100%;
  max-width: 21.75rem;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 0.8rem;
  padding: 1.05rem 1.1rem 1rem;
  border-radius: var(--radius);
  border: 1px solid var(--control-line);
  background: var(--surface);
  box-shadow: var(--shadow-modal);
  overflow: hidden;
  text-align: right;
}

.fitana-install-top {
  display: flex;
  align-items: flex-start;
  gap: 0.7rem;
}

.fitana-install-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 2.65rem;
  height: 2.65rem;
  border-radius: 0.75rem;
  color: #fed7aa;
  background: rgb(var(--accent-strong-rgb) / 0.22);
  border: 1px solid rgb(var(--accent-rgb) / 0.35);
}

.fitana-install-copy {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 0.28rem;
}

.fitana-install-title {
  margin: 0;
  color: var(--text);
  font-size: 1.04rem;
  font-weight: 800;
  line-height: 1.35;
  letter-spacing: 0;
}

.fitana-install-lead {
  margin: 0;
  color: rgba(226, 232, 240, 0.84);
  font-size: 0.83rem;
  line-height: 1.65;
}

.fitana-install-steps {
  display: grid;
  gap: 0.45rem;
  margin: 0;
  padding: 0;
  list-style: none;
  counter-reset: fitana-install-step;
}

.fitana-install-steps li {
  position: relative;
  min-height: 2rem;
  padding: 0.46rem 2.55rem 0.46rem 0.7rem;
  border-radius: 0.65rem;
  color: rgba(237, 242, 247, 0.94);
  background: rgba(255, 255, 255, 0.055);
  border: 1px solid rgba(255, 255, 255, 0.07);
  font-size: 0.82rem;
  line-height: 1.55;
}

.fitana-install-steps li::before {
  counter-increment: fitana-install-step;
  content: counter(fitana-install-step);
  position: absolute;
  inset-inline-start: auto;
  inset-inline-end: 0.62rem;
  top: 0.42rem;
  width: 1.42rem;
  height: 1.42rem;
  display: grid;
  place-items: center;
  border-radius: 50%;
  color: #fed7aa;
  background: rgb(var(--accent-strong-rgb) / 0.24);
  font-size: 0.74rem;
  font-weight: 800;
}

.fitana-install-actions {
  display: flex;
  flex-direction: column;
  gap: 0.45rem;
  width: 100%;
  margin-top: 0.1rem;
  padding-top: 0.55rem;
  border-top: 1px solid rgba(255, 255, 255, 0.07);
}

.fitana-install-actions .fitana-install-primary {
  width: 100%;
  font-weight: 700;
  box-shadow: 0 6px 20px rgb(var(--accent-strong-rgb) / 0.32);
}

.fitana-install-actions .fitana-install-secondary {
  width: 100%;
  font-size: 0.82rem;
  opacity: 0.94;
}

html[data-theme="light"] .fitana-install-prompt {
  background: rgba(19, 18, 26, 0.4);
}

html[data-theme="light"] .fitana-install-card {
  border-color: var(--control-line);
  background: var(--surface);
  box-shadow: var(--shadow-modal);
}

html[data-theme="light"] .fitana-install-title {
  color: #13121a;
}

html[data-theme="light"] .fitana-install-lead {
  color: #4a4656;
}

html[data-theme="light"] .fitana-install-steps li {
  color: #332f3e;
  background: rgb(var(--accent-strong-rgb) / 0.055);
  border-color: rgb(var(--accent-strong-rgb) / 0.12);
}

html[data-theme="light"] .fitana-install-actions {
  border-top-color: rgba(19, 18, 26, 0.08);
}

html[data-theme="light"] .fitana-install-actions .fitana-install-primary {
  box-shadow: 0 6px 18px rgb(var(--accent-strong-rgb) / 0.22);
}

.app-toast-root {
  position: fixed;
  left: 0;
  right: 0;
  top: calc(0.85rem + env(safe-area-inset-top, 0px));
  z-index: 10062;
  width: 100%;
  max-width: var(--app-shell-max, 42rem);
  margin-inline: auto;
  padding-inline: max(0.85rem, env(safe-area-inset-left, 0px)) max(0.85rem, env(safe-area-inset-right, 0px));
  box-sizing: border-box;
  pointer-events: none;
}

.app-snackbar,
.app-toast {
  display: flex;
  align-items: center;
  gap: 0.7rem;
  width: 100%;
  min-height: 3.25rem;
  padding: 0.75rem 0.9rem;
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: 0.65rem;
  background: rgba(37, 99, 235, 0.96);
  color: #ffffff;
  font-size: 0.92rem;
  line-height: 1.45;
  text-align: start;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.32);
  box-sizing: border-box;
}

.app-snackbar[dir="rtl"],
.app-toast[dir="rtl"] {
  text-align: right;
}

.app-snackbar[dir="ltr"],
.app-toast[dir="ltr"] {
  text-align: left;
}

.app-snackbar-icon {
  display: grid;
  flex: 0 0 auto;
  place-items: center;
  width: 1.55rem;
  height: 1.55rem;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.18);
  color: #ffffff;
  font-size: 0.95rem;
  font-weight: 800;
  line-height: 1;
}

.app-snackbar-body {
  flex: 1 1 auto;
  min-width: 0;
  overflow-wrap: anywhere;
  unicode-bidi: plaintext;
}

.app-snackbar--success,
.app-toast--success,
.app-toast--ok {
  background: rgba(22, 101, 52, 0.96);
}

.app-snackbar--info,
.app-toast--info {
  background: rgba(37, 99, 235, 0.96);
}

.app-snackbar--error,
.app-toast--error,
.app-toast--err {
  background: rgba(185, 28, 28, 0.96);
}

.app-snackbar--warning,
.app-toast--warning,
.app-toast--warn {
  background: rgba(180, 83, 9, 0.96);
}

/* pick page: .plan-session-add-body zeroed horizontal padding on the same .card element */
.plan-session-add-body.plan-session-pick-body {
  padding: 0.65rem 1.1rem 1.1rem;
  margin-top: 0.35rem;
}

html[data-theme="light"] .app-snackbar,
html[data-theme="light"] .app-toast {
  border-color: rgba(19, 18, 26, 0.08);
  box-shadow: 0 12px 28px rgba(19, 18, 26, 0.18);
}

@media (min-width: 640px) {
  :root {
    --app-shell-max: 42rem;
    --app-shell-pad: 1.25rem;
    --bottom-nav-height: 3.75rem;
  }

  #app-root {
    padding-top: max(0.65rem, env(safe-area-inset-top));
  }

  .app-brand {
    margin-inline: 0;
    padding: 0.52rem 0.7rem 0.68rem;
    border: 1px solid rgba(163, 160, 173, 0.12);
    border-radius: 1.15rem;
    box-shadow: 0 16px 40px rgba(0, 0, 0, 0.16);
  }

  .app-main-scroll {
    padding-top: 0.15rem;
  }

  #page-phone .card,
  #page-otp .card {
    max-width: 28rem;
    margin-inline: auto;
  }

  #page-phone .page-head,
  #page-otp .page-head {
    max-width: 28rem;
    margin-inline: auto;
  }

  .search-results {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: stretch;
  }

  .portal-random-results.search-results,
  .favorites-results-pad.search-results,
  .workout-session-tiles,
  .workout-hub-plans-list {
    grid-template-columns: 1fr;
  }

  .portal-grid.portal-grid--shortcuts {
    gap: 0.85rem;
  }

  .portal-grid--shortcuts .portal-grid-tile {
    min-height: 5.2rem;
  }

  .app-bottom-nav {
    bottom: max(0.7rem, env(safe-area-inset-bottom));
    padding-inline: 0.55rem;
    max-width: min(var(--app-shell-max), 34rem);
  }

  .search-bottom-sheet {
    max-width: min(var(--app-shell-max), 36rem);
  }

  body.search-filter-floating .search-bottom-sheet.search-sheet-expanded {
    max-width: min(var(--app-shell-max), 36rem);
  }
}

@media (min-width: 960px) {
  :root {
    --app-shell-max: 54rem;
    --app-shell-pad: 1.5rem;
  }

  .card {
    padding: 1.2rem;
  }

  .page-head h1 {
    font-size: 1.18rem;
  }

  .portal-random-card {
    padding: 1.15rem;
  }

  .portal-grid.portal-grid--shortcuts {
    grid-template-columns: repeat(var(--portal-shortcut-columns, 5), minmax(0, 1fr));
  }

  .exercise-modal-panel {
    border-radius: 1.2rem;
    max-height: min(82vh, 680px);
  }
}

/* Fitana visual system: approved AI coach density, hierarchy, and quiet surfaces. */
:root {
  --surface: #16151d;
  --surface-strong: #182131;
  --ink: #08070b;
  --brand-action: var(--accent);
  --brand-action-strong: var(--accent);
  --brand-action-text: #ffffff;
  --brand-action-shadow: transparent;
  --shell-panel: #0d1320;
  --shell-line: rgba(163, 160, 173, 0.18);
  --control-bg: #16151d;
  --control-line: rgba(163, 160, 173, 0.24);
  --shadow-xs: 0 0.15rem 0.45rem rgba(0, 0, 0, 0.12);
  --shadow-sm: 0 0.35rem 1rem rgba(0, 0, 0, 0.16);
  --shadow-modal: 0 1rem 2.5rem rgba(0, 0, 0, 0.32);
  --app-shell-max: 26rem;
  --bottom-nav-height: calc(4.4rem + env(safe-area-inset-bottom, 0px));
  --radius: 0.5rem;
}

html[data-theme="light"] {
  --bg: #ffffff;
  --bg-deep: #f6f7f9;
  --surface: #ffffff;
  --surface-strong: #f6f7f9;
  --surface-1: rgba(255, 255, 255, 0.96);
  --surface-2: rgba(248, 250, 252, 0.9);
  --surface-glass: rgba(255, 255, 255, 0.82);
  --line-soft: rgba(17, 19, 24, 0.11);
  --line-strong: rgb(var(--accent-rgb) / 0.22);
  --card: #ffffff;
  --text: #111318;
  --muted: #6b7280;
  --accent: var(--accent-strong);
  --accent-rgb: 234 88 12;
  --accent-strong: #c2410c;
  --accent-strong-rgb: 194 65 12;
  --accent-2: #ca8a04;
  --accent-3: #dc2626;
  --accent-warm: #ea580c;
  --accent-hover: #f97316;
  --accent-hover-rgb: 249 115 22;
  --accent-soft: #fdba74;
  --accent-soft-rgb: 253 186 116;
  --accent-contrast: #ffedd5;
  --brand-action: var(--accent);
  --brand-action-strong: var(--accent);
  --brand-action-text: #ffffff;
  --brand-action-shadow: transparent;
  --shell-panel: #ffffff;
  --shell-line: #e2e5ea;
  --control-bg: #ffffff;
  --control-line: #d8dde5;
  --shadow-xs: 0 0.15rem 0.45rem rgba(17, 19, 24, 0.05);
  --shadow-sm: 0 0.35rem 1rem rgba(17, 19, 24, 0.07);
  --shadow-modal: 0 1rem 2.5rem rgba(17, 19, 24, 0.14);
  --ex-card-bg: #ffffff;
  --ex-card-border: #dfe4ea;
  --ex-card-hover-bd: rgb(var(--accent-rgb) / 0.34);
  --ex-card-shadow: rgba(17, 19, 24, 0.1);
  --ex-media-bg: #eef1f4;
  --tag-bg: rgb(var(--accent-rgb) / 0.08);
  --tag-fg: #9a3412;
  --tag-bd: rgb(var(--accent-rgb) / 0.18);
  --filter-wrap-bg: rgba(255, 255, 255, 0.94);
  --filt-chip-bg: #ffffff;
  --filt-chip-bd: #dfe4ea;
  --filt-chip-on-bg: rgb(var(--accent-rgb) / 0.1);
  --filt-chip-on-fg: #7c2d12;
  --sheet-toggle-bg: linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(238, 241, 244, 0.98));
  --sheet-panel-bg: #ffffff;
  --sheet-panel-bd: #dfe4ea;
  --modal-x-bg: rgba(17, 19, 24, 0.06);
  --app-ui-icon-img-filter: brightness(0) saturate(100%) invert(16%) sepia(9%) saturate(848%) hue-rotate(183deg)
    brightness(93%) contrast(90%);
  --app-icon-mono: #111318;
  --app-icon-mono-soft: rgba(17, 19, 24, 0.7);
  --theme-toggle-light-ico: var(--accent-soft);
  --theme-toggle-dark-ico: #7c2d12;
}

html,
body {
  background: var(--bg);
}

body::before {
  display: none;
}

#app-root {
  max-width: var(--app-shell-max);
  padding-inline: max(var(--space-4), env(safe-area-inset-left)) max(var(--space-4), env(safe-area-inset-right));
}

.app-brand {
  min-height: calc(4rem + env(safe-area-inset-top, 0px));
  margin: 0 -0.1rem 0.5rem;
  padding: calc(env(safe-area-inset-top, 0px) + 0.55rem) 0.7rem 0.58rem;
  border: 1px solid var(--shell-line);
  border-top: 0;
  border-radius: 0 0 0.75rem 0.75rem;
  background: var(--shell-panel);
  box-shadow: 0 0.55rem 1.75rem color-mix(in srgb, var(--ink) 10%, transparent);
  backdrop-filter: blur(16px) saturate(1.08);
}

.app-brand-logo {
  width: 2.2rem;
  height: 2.2rem;
  border-radius: 0.5rem;
  box-shadow: 0 0.35rem 0.9rem color-mix(in srgb, var(--ink) 12%, transparent);
}

.app-brand-name-fa {
  font-size: var(--font-size-md);
  font-weight: 800;
}

.app-brand-name-en {
  font-size: var(--font-size-xs);
  letter-spacing: 0;
  color: var(--muted);
}

.app-theme-toggle,
.app-toolbar-back,
button.plan-picker-icon-btn,
.my-ex-composite-icon-btn,
.coach-student-icon-btn,
.ex-fav-btn,
.exercise-modal-close,
.exercise-modal-fav,
.exercise-modal-report {
  border-radius: 0.5rem;
  border-color: var(--control-line);
  background: var(--control-bg);
  box-shadow: none;
}

.exercise-modal-close,
.exercise-modal-fav,
.exercise-modal-report {
  width: 2.15rem;
  height: 2.15rem;
  border: 1px solid var(--control-line);
  border-radius: 0.65rem;
  background: var(--control-bg);
}

.ex-card .ex-fav-btn,
.ex-card .ex-card-plan-add-btn {
  width: 1.8rem;
  height: 1.8rem;
  min-height: 1.8rem;
  border-radius: 0.5rem;
  border: 1px solid var(--control-line);
  background: var(--control-bg);
  color: var(--accent);
  box-shadow: none;
}

.ex-card .ex-card-plan-add-btn svg {
  width: 1rem;
  height: 1rem;
  stroke: currentColor;
  stroke-width: 2.45;
}

.ex-card .ex-card-plan-add-btn {
  width: 1.42rem;
  height: 1.42rem;
  min-width: 1.42rem;
  min-height: 1.42rem;
  border-radius: 0.42rem;
}

.ex-card .ex-fav-btn {
  width: 1.42rem;
  height: 1.42rem;
  min-width: 1.42rem;
  min-height: 1.42rem;
  border-radius: 0.42rem;
}

.ex-card .ex-fav-svg {
  width: 0.82rem;
  height: 0.82rem;
}

.ex-card .ex-fav-btn[aria-pressed="false"] .ex-fav-svg {
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
}

.ex-card .ex-fav-btn[aria-pressed="true"] .ex-fav-svg {
  fill: currentColor;
  stroke: none;
}

.ex-card .ex-card-plan-add-btn svg {
  width: 0.82rem;
  height: 0.82rem;
}

.ex-card .ex-fav-btn:hover,
.ex-card .ex-fav-btn:focus-visible,
.ex-card .ex-card-plan-add-btn:hover,
.ex-card .ex-card-plan-add-btn:focus-visible {
  color: var(--accent-hover);
  border-color: color-mix(in srgb, var(--accent) 48%, var(--control-line));
  background: color-mix(in srgb, var(--accent) 8%, var(--control-bg));
}

:root:not([data-theme="light"]) .ex-card .ex-fav-btn,
:root:not([data-theme="light"]) .ex-card .ex-card-plan-add-btn,
html[data-theme="dark"] .ex-card .ex-fav-btn,
html[data-theme="dark"] .ex-card .ex-card-plan-add-btn {
  border-color: color-mix(in srgb, var(--accent) 42%, var(--line, #332f3e));
  background: color-mix(in srgb, var(--card, #16151d) 88%, #13121a);
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
  color: var(--accent);
  box-shadow: 0 0.18rem 0.45rem rgba(0, 0, 0, 0.22);
}

:root:not([data-theme="light"]) .ex-card .ex-fav-btn:hover,
:root:not([data-theme="light"]) .ex-card .ex-fav-btn:focus-visible,
:root:not([data-theme="light"]) .ex-card .ex-card-plan-add-btn:hover,
:root:not([data-theme="light"]) .ex-card .ex-card-plan-add-btn:focus-visible,
html[data-theme="dark"] .ex-card .ex-fav-btn:hover,
html[data-theme="dark"] .ex-card .ex-fav-btn:focus-visible,
html[data-theme="dark"] .ex-card .ex-card-plan-add-btn:hover,
html[data-theme="dark"] .ex-card .ex-card-plan-add-btn:focus-visible {
  border-color: color-mix(in srgb, var(--accent) 58%, var(--line, #332f3e));
  background: color-mix(in srgb, var(--card, #16151d) 78%, var(--accent));
  color: var(--accent-hover);
  box-shadow: 0 0.22rem 0.55rem rgba(0, 0, 0, 0.28);
}

.app-theme-toggle {
  width: 2.5rem;
  height: 2.5rem;
  border: 1px solid var(--control-line);
  border-radius: var(--radius);
  background: var(--control-bg);
  color: var(--theme-toggle-light-ico);
}

.app-theme-toggle:hover,
.app-theme-toggle:focus-visible {
  border-color: color-mix(in srgb, var(--accent) 42%, var(--control-line));
  background: color-mix(in srgb, var(--accent) 8%, var(--control-bg));
  color: var(--theme-toggle-light-ico);
  opacity: 1;
}

html[data-theme="light"] .app-theme-toggle {
  border-color: var(--control-line);
  background: var(--control-bg);
  color: var(--theme-toggle-dark-ico);
}

html[data-theme="light"] .app-theme-toggle:hover,
html[data-theme="light"] .app-theme-toggle:focus-visible {
  border-color: color-mix(in srgb, var(--accent) 42%, var(--control-line));
  background: color-mix(in srgb, var(--accent) 8%, var(--control-bg));
  color: var(--theme-toggle-dark-ico);
  opacity: 1;
}

.card,
.ex-card,
.plan-summary-card,
.workout-tile-card,
.portal-grid-tile,
.stats-hub-action-btn,
.portal-random-card,
.my-ex-composite-picked,
.my-ex-composite-empty,
.exercise-modal-panel,
.exercise-report-panel,
.weight-picker-sheet-panel {
  border-radius: 0.5rem;
  border-color: var(--shell-line);
  background: var(--card);
  box-shadow: var(--shadow-sm);
}

.ex-card::before,
.portal-rail-glow {
  opacity: 0.22;
}

.ex-card:hover,
.plan-summary-card:hover,
.portal-grid-tile-action:hover,
button.stats-hub-action-btn:hover {
  transform: none;
  box-shadow: var(--shadow-sm);
}

input,
select,
textarea {
  min-height: var(--control-height);
  border-radius: 0.5rem;
  border-color: var(--control-line);
  background: var(--control-bg);
  box-shadow: none;
}

button:not(.auth-terms-link):not(.app-nav-btn):not(.app-theme-toggle):not(.app-toolbar-back):not(.ex-fav-btn):not(.ex-card-plan-add-btn):not(.search-add-plan-close):not(.search-add-plan-choice):not(.search-active-filters-info):not(.search-filters-info-close):not(.workout-tile-ai-swap-title):not(.workout-tile-ai-swap-btn):not(.exercise-modal-close):not(.exercise-modal-fav):not(.exercise-modal-report):not(.exercise-report-close):not(.plan-picker-icon-btn):not(.my-ex-composite-icon-btn):not(.coach-student-icon-btn):not(.weight-picker-trigger):not(.plan-draft-reorder-btn):not(.fitana-player-btn):not(.fitana-player-overlay):not(.ex-media-btn):not(.ex-composite-detail-toggle) {
  border-radius: 0.5rem;
}

button:not(.auth-terms-link):not(.secondary):not(.app-nav-btn):not(.app-theme-toggle):not(.app-toolbar-back):not(.ex-fav-btn):not(.ex-card-plan-add-btn):not(.search-add-plan-close):not(.search-add-plan-choice):not(.search-active-filters-info):not(.search-filters-info-close):not(.workout-tile-ai-swap-title):not(.workout-tile-ai-swap-btn):not(.exercise-modal-close):not(.exercise-modal-fav):not(.exercise-modal-report):not(.exercise-report-close):not(.plan-picker-icon-btn):not(.my-ex-composite-icon-btn):not(.coach-student-icon-btn):not(.weight-picker-trigger):not(.plan-draft-reorder-btn):not(.fitana-player-btn):not(.fitana-player-overlay):not(.ex-media-btn):not(.ex-composite-detail-toggle):not(.danger-button):not(.btn-remove-step):not(.ex-card):not(.portal-grid-tile):not(.plan-summary-card):not(.plan-summary-main):not(.workout-tile-card):not(.stats-hub-action-btn):not(.plan-source-tab):not(.my-ex-kind-tab):not(.filter-chip):not(.portal-random-refresh-btn):not(.portal-rail-more):not(.plan-card-action):not(.plan-vis-btn):not(.search-sheet-toggle):not(.app-scroll-top-fab):not(.billing-method-choice):not(.billing-copy-btn):not(.workout-hub-chip-new):not(.my-ex-hub-new-btn):not(.my-ex-composite-retry):not(.ai-plan-focus-retry):not(.ai-plan-requests-page-btn):not(.search-scroll-retry) {
  background: var(--brand-action);
  color: var(--brand-action-text);
  box-shadow: none;
}

button.secondary,
button.wide.secondary,
.filter-chip,
.my-ex-kind-tab,
.plan-source-tab,
.plan-new-coach-seg label {
  border-radius: 0.5rem;
  border-color: var(--control-line);
  background: color-mix(in srgb, var(--surface) 82%, transparent);
  color: var(--text);
  box-shadow: none;
}

/* Shared route primitives. Feature layouts may arrange these, but not restyle their visual contract. */
.page {
  padding-bottom: var(--space-4);
  letter-spacing: 0;
}

.page-head {
  margin: 0 0 var(--space-4);
  padding-top: var(--space-2);
}

.page-head h1,
.app-toolbar-heading {
  font-size: var(--font-size-lg);
  font-weight: 800;
  line-height: 1.5;
  letter-spacing: 0;
}

.page-head .lead,
.page-head-context {
  margin-top: var(--space-1);
  color: var(--muted);
  font-size: var(--font-size-sm);
  line-height: 1.7;
}

:where(.page .card, .page [class$="-card"], .page [class$="-panel"], .page [class$="-section"]) {
  border-radius: var(--radius);
}

:where(.page .card, .page [class$="-card"], .page [class$="-panel"]) {
  border-color: var(--shell-line);
  box-shadow: var(--shadow-sm);
}

:where(.page .card .card, .page [class$="-card"] [class$="-card"]) {
  box-shadow: none;
}

:where(.app-confirm-panel, .exercise-modal-panel, .exercise-report-panel, .weight-picker-sheet-panel, .app-select-menu) {
  border-radius: var(--radius);
  border-color: var(--control-line);
  background-color: var(--surface);
  box-shadow: var(--shadow-modal);
}

:where(.page input, .page select, .page textarea, .page .app-select-trigger) {
  min-height: var(--control-height);
  border-radius: var(--radius);
  border-color: var(--control-line);
  background: var(--control-bg);
  box-shadow: none;
  font-size: var(--font-size-md);
  letter-spacing: 0;
}

:where(.page button, .page .app-select-trigger) {
  min-height: var(--control-height);
}

:where(.tag-chip, .filter-chip, [class$="-status"], [class$="-badge"]) {
  letter-spacing: 0;
}

:where(.plan-summary-card, .workout-tile-card, .support-thread-row, .support-ticket, .coach-student-row, .ai-plan-request-row) {
  border-radius: var(--radius);
  border: 1px solid var(--shell-line);
  background: var(--card);
  box-shadow: none;
}

:where(.msg, .app-empty-state, .app-skeleton, .edb-loading-row) {
  letter-spacing: 0;
}

.app-bottom-nav {
  inset-inline: 0;
  bottom: 0;
  width: 100%;
  max-width: none;
  height: auto;
  margin: 0;
  padding: 0;
  justify-content: center;
  gap: 0;
  pointer-events: none;
  border: 0;
  border-radius: 0;
  background: linear-gradient(180deg, transparent, color-mix(in srgb, var(--bg) 94%, transparent) 24%);
  box-shadow: none;
}

.app-bottom-nav::before {
  content: "";
  pointer-events: auto;
  width: min(100%, 42.5rem);
  height: calc(4.95rem + env(safe-area-inset-bottom, 0px));
  position: absolute;
  inset-inline: auto;
  bottom: 0;
  background: var(--shell-panel);
  border-top: 1px solid var(--shell-line);
  box-shadow: 0 -0.5rem 1.75rem color-mix(in srgb, var(--ink) 10%, transparent);
  backdrop-filter: blur(18px) saturate(1.1);
}

.app-bottom-nav button.app-nav-btn {
  position: relative;
  pointer-events: auto;
  z-index: 1;
  flex: 0 1 calc(min(100%, 42.5rem) / 5);
  min-height: 4.45rem;
  height: 4.45rem;
  max-height: none;
  gap: 0.24rem;
  padding: 0.42rem 0.12rem calc(0.52rem + env(safe-area-inset-bottom, 0px)) !important;
  border-radius: 0;
  background: transparent;
  color: var(--muted);
  transform: none !important;
}

.app-bottom-nav button.app-nav-btn:hover {
  background: transparent;
  transform: none;
}

.app-bottom-nav button.app-nav-btn .app-nav-icon-img {
  width: 1.42rem;
  height: 1.42rem;
}

.app-bottom-nav button.app-nav-btn-workout .app-nav-icon-img {
  width: 1.78rem;
  height: 1.78rem;
}

.app-bottom-nav button.app-nav-btn .app-nav-icon-img,
.app-bottom-nav button.app-nav-btn svg {
  padding: 0.55rem;
  box-sizing: content-box;
  border-radius: 0.75rem;
  transition: background 0.16s ease, box-shadow 0.16s ease, filter 0.16s ease, transform 0.16s ease;
}

.app-bottom-nav button.app-nav-btn::before {
  content: "";
  position: absolute;
  inset-block-start: 0.44rem;
  inset-inline-start: 50%;
  width: 2.55rem;
  height: 2.55rem;
  border-radius: 0.75rem;
  transform: translateX(-50%);
  opacity: 0;
  background: color-mix(in srgb, var(--accent) 13%, transparent);
  transition: opacity 0.16s ease, background 0.16s ease, box-shadow 0.16s ease;
}

.app-bottom-nav button.app-nav-btn.is-active {
  background: transparent;
  color: var(--accent);
  box-shadow: none;
}

.app-bottom-nav button.app-nav-btn.is-active::before {
  opacity: 1;
}

.app-bottom-nav button.app-nav-btn.is-active .app-nav-icon-img,
.app-bottom-nav button.app-nav-btn.is-active svg {
  position: relative;
  z-index: 1;
  background: transparent;
  box-shadow: none;
  filter: brightness(0) saturate(100%) invert(54%) sepia(96%) saturate(1846%) hue-rotate(354deg) brightness(100%) contrast(96%);
}

.app-bottom-nav #nav-workout .app-nav-icon-img {
  position: relative;
  z-index: 1;
  background: transparent;
  border: 0;
  box-shadow: none;
  filter: brightness(0) invert(1);
}

.app-bottom-nav #nav-workout::before {
  width: 2.92rem;
  height: 2.92rem;
  opacity: 1;
  background:
    radial-gradient(circle at 32% 18%, color-mix(in srgb, var(--accent-2) 38%, transparent) 0 18%, transparent 39%),
    linear-gradient(145deg, color-mix(in srgb, var(--accent) 88%, #ffffff), color-mix(in srgb, var(--accent-2) 82%, var(--surface)));
  border: 1px solid color-mix(in srgb, var(--accent-2) 36%, var(--shell-line));
  box-shadow:
    0 0.45rem 1rem color-mix(in srgb, var(--accent-2) 16%, transparent),
    inset 0 1px 0 color-mix(in srgb, #ffffff 34%, transparent);
}

.app-bottom-nav #nav-workout.is-active .app-nav-icon-img {
  background: transparent;
  box-shadow:
    none;
  filter: brightness(0) invert(1);
}

.app-bottom-nav #nav-workout.is-active::before {
  background:
    radial-gradient(circle at 30% 18%, color-mix(in srgb, var(--accent-2) 46%, transparent) 0 20%, transparent 42%),
    linear-gradient(145deg, color-mix(in srgb, var(--accent-hover) 86%, #ffffff) 0%, var(--accent) 46%, var(--accent-2) 100%);
  box-shadow:
    0 0.5rem 1.12rem color-mix(in srgb, var(--accent-2) 20%, transparent),
    0 0 0 0.32rem color-mix(in srgb, var(--accent) 8%, transparent),
    inset 0 1px 0 color-mix(in srgb, #ffffff 38%, transparent);
}

.app-nav-label {
  display: block !important;
  width: 100%;
  height: 0.9rem;
  overflow: hidden;
  color: currentColor;
  font-size: 0.62rem;
  font-weight: 700;
  line-height: 0.9rem;
  text-align: center;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.search-bottom-sheet {
  bottom: calc(var(--bottom-nav-height) + max(0.5rem, env(safe-area-inset-bottom)));
  max-width: 42.5rem;
}

body.app-shell.has-bottom-nav button.app-scroll-top-fab {
  bottom: calc(var(--bottom-nav-height) + 0.85rem);
}

body.app-shell.has-bottom-nav.has-search-sheet button.app-scroll-top-fab {
  bottom: calc(var(--bottom-nav-height) + var(--search-bar-height) + 0.95rem);
}

/* Floating top-level navigation matches the established app shell. */
.app-bottom-nav,
html[data-theme="light"] .app-bottom-nav {
  position: fixed;
  inset-inline: 0;
  bottom: max(0.55rem, env(safe-area-inset-bottom));
  z-index: 10042;
  width: min(calc(100% - 1rem), var(--app-shell-max));
  max-width: 34rem;
  height: calc(4.15rem + env(safe-area-inset-bottom, 0px));
  margin-inline: auto;
  padding: 0.44rem 0.48rem max(0.42rem, env(safe-area-inset-bottom));
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  align-items: stretch;
  gap: 0.12rem;
  pointer-events: auto;
  overflow: visible;
  border: 1px solid var(--shell-line);
  border-radius: 1.1rem;
  background: var(--shell-panel);
  box-shadow: 0 -0.45rem 1.65rem color-mix(in srgb, var(--ink) 12%, transparent);
  backdrop-filter: blur(18px) saturate(1.08);
}

.app-bottom-nav::before,
.app-bottom-nav button.app-nav-btn::before,
.app-bottom-nav #nav-workout::before {
  display: none !important;
  content: none !important;
}

.app-bottom-nav.hidden,
html[data-theme="light"] .app-bottom-nav.hidden,
[hidden].app-bottom-nav,
html[data-theme="light"] [hidden].app-bottom-nav {
  display: none !important;
}

.app-bottom-nav.is-guest-nav,
html[data-theme="light"] .app-bottom-nav.is-guest-nav {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  max-width: 16rem;
}

.app-bottom-nav button.app-nav-btn,
html[data-theme="light"] .app-bottom-nav button.app-nav-btn,
.app-bottom-nav #nav-workout,
html[data-theme="light"] .app-bottom-nav #nav-workout {
  width: auto;
  min-width: 0;
  min-height: 0;
  height: 100%;
  max-height: none;
  margin: 0 !important;
  padding: 0.28rem 0.08rem !important;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.2rem;
  border: 0;
  border-radius: var(--radius);
  background: transparent !important;
  color: var(--muted);
  box-shadow: none !important;
  transform: none !important;
  transition: background 0.18s ease, color 0.18s ease, transform 0.18s ease, box-shadow 0.18s ease;
}

.app-bottom-nav button.app-nav-btn .app-nav-icon-img,
.app-bottom-nav button.app-nav-btn-workout .app-nav-icon-img,
html[data-theme="light"] .app-bottom-nav .app-nav-icon-img,
html[data-theme="light"] .app-bottom-nav #nav-workout.is-active .app-nav-icon-img {
  width: 1.38rem;
  height: 1.38rem;
  padding: 0 !important;
  border: 0;
  border-radius: 0;
  background: transparent !important;
  box-shadow: none !important;
  object-fit: contain;
  filter: var(--nav-icon-filter);
  opacity: 0.92;
}

.app-bottom-nav button.app-nav-btn-workout .app-nav-icon-img,
html[data-theme="light"] .app-bottom-nav button.app-nav-btn-workout .app-nav-icon-img {
  width: 1.38rem;
  height: 1.38rem;
}

.app-bottom-nav button.app-nav-btn.is-active,
html[data-theme="light"] .app-bottom-nav button.app-nav-btn.is-active,
.app-bottom-nav #nav-workout.is-active,
html[data-theme="light"] .app-bottom-nav #nav-workout.is-active {
  background: transparent !important;
  color: var(--accent);
  box-shadow: none !important;
}

.app-bottom-nav button.app-nav-btn.is-active .app-nav-icon-img,
html[data-theme="light"] .app-bottom-nav button.app-nav-btn.is-active .app-nav-icon-img,
html[data-theme="light"] .app-bottom-nav #nav-workout.is-active .app-nav-icon-img {
  filter: brightness(0) saturate(100%) invert(54%) sepia(96%) saturate(1846%) hue-rotate(354deg) brightness(100%) contrast(96%);
  opacity: 1;
}

.app-bottom-nav #nav-workout .app-nav-icon-img,
html[data-theme="light"] .app-bottom-nav #nav-workout .app-nav-icon-img {
  filter: var(--nav-icon-filter);
}

.app-bottom-nav #nav-workout.is-active .app-nav-icon-img,
html[data-theme="light"] .app-bottom-nav #nav-workout.is-active .app-nav-icon-img {
  filter: brightness(0) saturate(100%) invert(54%) sepia(96%) saturate(1846%) hue-rotate(354deg) brightness(100%) contrast(96%);
}

.app-bottom-nav #nav-workout.is-active,
html[data-theme="light"] .app-bottom-nav #nav-workout.is-active {
  z-index: 1;
  background: transparent !important;
  color: var(--accent);
  transform: none !important;
  box-shadow: none !important;
}

.app-bottom-nav #nav-workout.is-active .app-nav-icon-img,
html[data-theme="light"] .app-bottom-nav #nav-workout.is-active .app-nav-icon-img {
  width: 1.38rem;
  height: 1.38rem;
  filter: brightness(0) saturate(100%) invert(54%) sepia(96%) saturate(1846%) hue-rotate(354deg) brightness(100%) contrast(96%);
}

.app-bottom-nav #nav-workout.is-active .app-nav-label,
html[data-theme="light"] .app-bottom-nav #nav-workout.is-active .app-nav-label {
  font-size: 0.58rem;
  font-weight: 750;
}

.app-bottom-nav button.app-nav-btn,
.app-bottom-nav button.app-nav-btn * {
  -webkit-tap-highlight-color: transparent;
}

.app-bottom-nav button.app-nav-btn:focus {
  outline: none;
}

.app-bottom-nav button.app-nav-btn:active,
html[data-theme="light"] .app-bottom-nav button.app-nav-btn:active {
  background: transparent !important;
  filter: none !important;
  box-shadow: none !important;
  transform: none !important;
}

.app-bottom-nav #nav-workout:active,
html[data-theme="light"] .app-bottom-nav #nav-workout:active {
  background: transparent !important;
  transform: none !important;
}

.app-bottom-nav button.app-nav-btn.is-active:active,
html[data-theme="light"] .app-bottom-nav button.app-nav-btn.is-active:active,
.app-bottom-nav #nav-workout.is-active:active,
html[data-theme="light"] .app-bottom-nav #nav-workout.is-active:active {
  background: transparent !important;
  color: var(--accent);
}

.app-bottom-nav button.app-nav-btn:focus-visible,
html[data-theme="light"] .app-bottom-nav button.app-nav-btn:focus-visible {
  outline: 2px solid color-mix(in srgb, var(--accent) 56%, transparent);
  outline-offset: -3px;
  background: transparent !important;
}

.app-nav-label {
  display: block !important;
  height: 1.05rem;
  max-width: 100%;
  color: currentColor;
  font-size: 0.58rem;
  font-weight: 750;
  line-height: 1.05rem;
  text-align: center;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body.app-shell.has-bottom-nav .app-main-scroll {
  padding-bottom: calc(var(--bottom-nav-height) + var(--space-4));
}

body.app-shell.has-bottom-nav.has-search-sheet .app-main-scroll {
  padding-bottom: calc(
    var(--bottom-nav-height) + var(--search-bar-height) + var(--space-4)
  );
}

body.app-shell.has-bottom-nav button.app-scroll-top-fab {
  bottom: calc(var(--bottom-nav-height) + var(--space-3));
}

body.app-shell.has-bottom-nav.has-search-sheet button.app-scroll-top-fab {
  bottom: calc(var(--bottom-nav-height) + var(--search-bar-height) + var(--space-3));
}

/* نوار پایین — تاکید روی «برنامه من» */
.app-bottom-nav #nav-workout,
html[data-theme="light"] .app-bottom-nav #nav-workout {
  --workout-nav-icon-size: 1.88rem;
  --workout-nav-frame-size: 2.68rem;
  position: relative;
  isolation: auto;
  overflow: hidden;
  gap: 0 !important;
  border: 0;
  background: transparent !important;
  box-shadow: none !important;
}

.app-bottom-nav #nav-workout::before {
  content: none !important;
  display: none !important;
}

.app-bottom-nav #nav-workout::after {
  content: none !important;
  display: none !important;
}

.app-bottom-nav #nav-workout .app-nav-icon-img,
html[data-theme="light"] .app-bottom-nav #nav-workout .app-nav-icon-img {
  position: relative;
  z-index: 1;
  width: var(--workout-nav-icon-size);
  height: var(--workout-nav-icon-size);
  opacity: 0.92;
  filter: var(--nav-icon-filter);
}

.app-bottom-nav #nav-workout .app-nav-icon-shine {
  position: relative;
  z-index: 1;
  width: var(--workout-nav-icon-size);
  height: var(--workout-nav-icon-size);
  flex: 0 0 var(--workout-nav-icon-size);
  display: inline-grid;
  place-items: center;
  overflow: visible;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

.app-bottom-nav #nav-workout .app-nav-icon-shine::after {
  content: none;
  display: none;
}

.app-bottom-nav #nav-workout .app-nav-label {
  display: none !important;
}

.app-bottom-nav #nav-workout.is-active .app-nav-icon-shine,
html[data-theme="light"] .app-bottom-nav #nav-workout.is-active .app-nav-icon-shine {
  width: var(--workout-nav-icon-size);
  height: var(--workout-nav-icon-size);
  flex-basis: var(--workout-nav-icon-size);
  border: 0;
  background: transparent;
  box-shadow: none;
}

.app-bottom-nav #nav-workout.is-active .app-nav-icon-img,
html[data-theme="light"] .app-bottom-nav #nav-workout.is-active .app-nav-icon-img {
  width: var(--workout-nav-icon-size);
  height: var(--workout-nav-icon-size);
}

.app-bottom-nav #nav-workout.is-active,
html[data-theme="light"] .app-bottom-nav #nav-workout.is-active {
  background: transparent !important;
  box-shadow: none !important;
}

@media (prefers-reduced-motion: reduce) {
  .app-bottom-nav #nav-workout .app-nav-icon-shine::after {
    animation: none;
    opacity: 0;
  }
}

@keyframes bottom-workout-icon-shine {
  0%,
  34% {
    background-position: -170% 50%;
    opacity: 0;
  }

  46%,
  68% {
    opacity: 1;
  }

  84%,
  100% {
    background-position: 270% 50%;
    opacity: 0;
  }
}

/* workout hub icon color repair: keep Fitana orange, avoid the sharp blue cast */
.plan-summary-card--hub {
  background: linear-gradient(135deg, var(--plan-row-bg) 0%, rgb(var(--accent-rgb) / 0.055) 100%);
}

.plan-summary-card--hub:hover {
  border-color: rgb(var(--accent-rgb) / 0.38);
}

.plan-hub-visual {
  border-color: rgb(var(--accent-rgb) / 0.2);
  background: rgb(var(--accent-rgb) / 0.08);
}

.plan-hub-visual--self {
  border-color: rgb(var(--accent-rgb) / 0.24);
  background: linear-gradient(160deg, rgb(var(--accent-rgb) / 0.14) 0%, rgb(var(--accent-rgb) / 0.045) 100%);
}

.plan-hub-visual--coach {
  border-color: rgb(var(--accent-rgb) / 0.28);
  background: linear-gradient(160deg, rgb(var(--accent-rgb) / 0.12) 0%, rgb(var(--accent-rgb) / 0.045) 100%);
}

.plan-hub-visual-badge {
  background: rgb(var(--accent-rgb) / 0.12);
  border-color: rgb(var(--accent-rgb) / 0.14);
}

html[data-theme="light"] .plan-summary-card--hub {
  background: linear-gradient(135deg, #fff 0%, rgb(var(--accent-rgb) / 0.04) 100%);
}

html[data-theme="light"] .plan-hub-visual,
html[data-theme="light"] .plan-hub-visual--self {
  border-color: rgb(var(--accent-rgb) / 0.18);
  background: linear-gradient(160deg, rgb(var(--accent-rgb) / 0.1) 0%, rgb(var(--accent-rgb) / 0.035) 100%);
}

html[data-theme="light"] .plan-hub-visual--coach {
  background: linear-gradient(160deg, rgb(var(--accent-strong-rgb) / 0.1) 0%, rgb(var(--accent-rgb) / 0.035) 100%);
}

html[data-theme="light"] .plan-hub-visual-badge {
  background: rgb(var(--accent-rgb) / 0.09);
  border-color: rgb(var(--accent-rgb) / 0.12);
}

/* orange/neutral action cleanup: workout action icons, search filters, and jump-to-top */
.plan-card-action,
.plan-vis-btn {
  border-color: rgb(var(--accent-rgb) / 0.22);
  background: rgb(var(--accent-rgb) / 0.075) !important;
  background-image: none !important;
  color: var(--app-icon-mono-soft);
  box-shadow: none !important;
}

.plan-card-action:hover,
.plan-card-action:focus-visible,
.plan-vis-btn:hover,
.plan-vis-btn:focus-visible {
  border-color: rgb(var(--accent-rgb) / 0.38);
  background: rgb(var(--accent-rgb) / 0.12) !important;
  background-image: none !important;
  color: var(--app-icon-mono);
}

.plan-card-action .plan-edit-icon,
.plan-card-action .plan-notes-icon {
  filter: var(--app-ui-icon-img-filter);
  opacity: 0.9;
}

html[data-theme="light"] .plan-card-action,
html[data-theme="light"] .plan-vis-btn {
  border-color: rgb(var(--accent-rgb) / 0.16);
  background: rgb(var(--accent-rgb) / 0.055) !important;
  background-image: none !important;
  color: #4b5563;
}

html[data-theme="light"] .plan-card-action:hover,
html[data-theme="light"] .plan-card-action:focus-visible,
html[data-theme="light"] .plan-vis-btn:hover,
html[data-theme="light"] .plan-vis-btn:focus-visible {
  border-color: rgb(var(--accent-rgb) / 0.28);
  background: rgb(var(--accent-rgb) / 0.09) !important;
  background-image: none !important;
  color: #16151d;
}

.filter-chip,
.search-sheet-panel .search-filters-inner > button:not(.lib-search-submit-btn),
.search-sheet-panel .search-filters-inner .lib-search-more-body > button,
.lib-search-section {
  border-color: color-mix(in srgb, var(--shell-line) 86%, transparent);
  background: color-mix(in srgb, var(--surface) 78%, transparent);
}

.filter-chip:hover,
.filter-chip:focus-visible,
.search-sheet-panel .search-filters-inner > button:not(.lib-search-submit-btn):hover,
.search-sheet-panel .search-filters-inner .lib-search-more-body > button:hover {
  border-color: rgb(var(--accent-rgb) / 0.28);
  background: rgb(var(--accent-rgb) / 0.085);
}

.filter-chip.is-on {
  border-color: rgb(var(--accent-rgb) / 0.48);
  background: rgb(var(--accent-rgb) / 0.18);
  color: var(--filt-chip-on-fg);
}

body.search-filter-floating .search-sheet-toggle {
  position: relative;
  overflow: hidden;
  isolation: isolate;
  border-color: rgb(var(--accent-rgb) / 0.5);
  background:
    linear-gradient(180deg, rgba(250, 204, 21, 0.22), rgb(var(--accent-rgb) / 0.16)),
    rgb(var(--accent-rgb) / 0.14) !important;
  color: color-mix(in srgb, var(--accent) 86%, #ffffff);
  box-shadow:
    0 10px 24px rgb(var(--accent-rgb) / 0.18),
    0 5px 14px rgba(19, 18, 26, 0.22),
    0 1px 0 rgba(255, 255, 255, 0.12) inset;
  transition: transform 0.16s ease, box-shadow 0.2s ease, border-color 0.2s ease, filter 0.2s ease;
}

body.search-filter-floating .search-bottom-sheet:not(.search-sheet-expanded) .search-sheet-toggle::before {
  content: "";
  position: absolute;
  inset: -45% -28%;
  z-index: -1;
  background:
    linear-gradient(105deg, transparent 31%, rgba(255, 247, 237, 0.34) 44%, transparent 57%),
    radial-gradient(circle at 70% 24%, rgba(250, 204, 21, 0.28), transparent 22%);
  opacity: 0.34;
  transform: translateX(32%) rotate(8deg);
  animation: searchFilterShine 4.8s ease-in-out infinite;
}

body.search-filter-floating .search-bottom-sheet:not(.search-sheet-expanded) .search-sheet-toggle::after {
  content: "";
  position: absolute;
  inset: 0.16rem;
  border-radius: inherit;
  border: 1px solid rgba(255, 255, 255, 0.26);
  box-shadow: 0 0 18px rgba(255, 218, 185, 0.24) inset;
  pointer-events: none;
}

body.search-filter-floating .search-bottom-sheet:not(.search-sheet-expanded) .search-sheet-toggle:hover,
body.search-filter-floating .search-bottom-sheet:not(.search-sheet-expanded) .search-sheet-toggle:focus-visible {
  border-color: rgba(255, 226, 188, 0.64);
  filter: saturate(1.04) brightness(1.04);
  transform: translateY(-1px);
  box-shadow:
    0 13px 28px rgb(var(--accent-rgb) / 0.24),
    0 6px 16px rgba(19, 18, 26, 0.22),
    0 1px 0 rgba(255, 255, 255, 0.18) inset;
}

body.search-filter-floating .search-bottom-sheet:not(.search-sheet-expanded) .search-sheet-toggle:active {
  transform: translateY(0) scale(0.98);
}

body.search-filter-floating .search-bottom-sheet:not(.search-sheet-expanded) .search-sheet-icon-filter {
  filter: drop-shadow(0 2px 5px rgba(124, 45, 18, 0.32));
}

@keyframes searchFilterShine {
  0%,
  56% {
    opacity: 0.18;
    transform: translateX(48%) rotate(8deg);
  }

  72% {
    opacity: 0.72;
    transform: translateX(-42%) rotate(8deg);
  }

  100% {
    opacity: 0.18;
    transform: translateX(-52%) rotate(8deg);
  }
}

@media (prefers-reduced-motion: reduce) {
  body.search-filter-floating .search-bottom-sheet:not(.search-sheet-expanded) .search-sheet-toggle::before {
    animation: none;
  }
}

button.app-scroll-top-fab {
  overflow: hidden;
  border-color: rgb(var(--accent-rgb) / 0.5);
  background:
    linear-gradient(180deg, rgba(250, 204, 21, 0.22), rgb(var(--accent-rgb) / 0.16)),
    rgb(var(--accent-rgb) / 0.14) !important;
  color: color-mix(in srgb, var(--accent) 86%, #ffffff);
  box-shadow:
    0 10px 24px rgb(var(--accent-rgb) / 0.18),
    0 5px 14px rgba(19, 18, 26, 0.22),
    0 1px 0 rgba(255, 255, 255, 0.12) inset;
}

button.app-scroll-top-fab:hover,
button.app-scroll-top-fab:focus-visible {
  border-color: rgba(255, 226, 188, 0.64);
  background:
    linear-gradient(180deg, rgba(250, 204, 21, 0.28), rgb(var(--accent-rgb) / 0.22)),
    rgb(var(--accent-rgb) / 0.18) !important;
  box-shadow:
    0 13px 28px rgb(var(--accent-rgb) / 0.24),
    0 6px 16px rgba(19, 18, 26, 0.22),
    0 1px 0 rgba(255, 255, 255, 0.18) inset;
}

body.app-shell.has-search-sheet button.app-scroll-top-fab {
  inset-inline-end: auto;
  inset-inline-start: max(var(--app-shell-pad), calc((100vw - var(--app-shell-max)) / 2 + var(--app-shell-pad)));
  bottom: calc(4.15rem + var(--search-bar-height) + max(1.35rem, env(safe-area-inset-bottom)));
}

html[data-theme="light"] button.app-scroll-top-fab {
  border-color: rgb(var(--accent-rgb) / 0.42);
  background:
    linear-gradient(180deg, rgba(250, 204, 21, 0.22), rgb(var(--accent-rgb) / 0.15)),
    rgb(var(--accent-rgb) / 0.12) !important;
  color: var(--accent-strong);
  box-shadow:
    0 11px 24px rgb(var(--accent-rgb) / 0.18),
    0 4px 14px rgba(19, 18, 26, 0.1),
    0 1px 0 rgba(255, 255, 255, 0.48) inset;
}

html[data-theme="light"] body.search-filter-floating .search-sheet-toggle,
html[data-theme="light"] body.search-filter-floating .search-bottom-sheet.search-sheet-expanded .search-sheet-bar {
  border-color: rgb(var(--accent-rgb) / 0.22);
}

html[data-theme="light"] body.search-filter-floating .search-bottom-sheet:not(.search-sheet-expanded) .search-sheet-toggle {
  border-color: rgb(var(--accent-rgb) / 0.42);
  background:
    linear-gradient(180deg, rgba(250, 204, 21, 0.22), rgb(var(--accent-rgb) / 0.15)),
    rgb(var(--accent-rgb) / 0.12) !important;
  color: var(--accent-strong);
  box-shadow:
    0 11px 24px rgb(var(--accent-rgb) / 0.18),
    0 4px 14px rgba(19, 18, 26, 0.1),
    0 1px 0 rgba(255, 255, 255, 0.48) inset;
}

body.search-filter-floating {
  --floating-control-size: 2.85rem;
  --floating-control-gap: 0.55rem;
  --floating-control-edge-gap: 0.5rem;
  --floating-stack-left: max(
    calc(var(--app-shell-pad) + var(--floating-control-edge-gap)),
    calc((100vw - min(var(--fitana-content-max), 100vw)) / 2 + var(--app-shell-pad) + var(--floating-control-edge-gap))
  );
}

body.search-filter-floating .search-bottom-sheet:not(.search-sheet-expanded) {
  inset-inline: auto;
  left: var(--floating-stack-left);
  right: auto;
  bottom: calc(var(--bottom-nav-height) + max(0.85rem, env(safe-area-inset-bottom)));
}

body.search-filter-floating .search-bottom-sheet:not(.search-sheet-expanded) .search-sheet-toggle {
  width: var(--floating-control-size);
  min-height: var(--floating-control-size);
  padding: 0;
  justify-content: center;
}

body.search-filter-floating .search-bottom-sheet:not(.search-sheet-expanded) .search-sheet-toggle-text {
  display: none;
}

body.app-shell.has-bottom-nav.search-filter-floating.has-search-sheet button.app-scroll-top-fab {
  inset-inline: auto;
  left: calc(var(--floating-stack-left) + var(--floating-control-size) + var(--floating-control-gap));
  right: auto;
  bottom: calc(var(--bottom-nav-height) + max(0.85rem, env(safe-area-inset-bottom)));
}

/* Secondary routes retain the shell but do not reserve space for a hidden tab bar. */
body.app-shell:not(.has-bottom-nav) .app-main-scroll {
  padding-bottom: calc(1.25rem + max(10px, env(safe-area-inset-bottom)));
}

body.app-shell:not(.has-bottom-nav).has-search-sheet .app-main-scroll {
  padding-bottom: calc(var(--search-bar-height) + max(14px, env(safe-area-inset-bottom)) + 1.15rem);
}

body.app-shell:not(.has-bottom-nav) .search-bottom-sheet,
body.app-shell:not(.has-bottom-nav).search-filter-floating .search-bottom-sheet:not(.search-sheet-expanded),
body.app-shell:not(.has-bottom-nav).search-filter-floating .search-bottom-sheet.search-sheet-expanded {
  bottom: max(0.5rem, env(safe-area-inset-bottom));
}

body.app-shell:not(.has-bottom-nav) button.app-scroll-top-fab {
  bottom: max(1rem, env(safe-area-inset-bottom));
}

body.app-shell:not(.has-bottom-nav).has-search-sheet button.app-scroll-top-fab {
  bottom: calc(var(--search-bar-height) + max(0.85rem, env(safe-area-inset-bottom)));
}

.lib-search-actions-row {
  background: linear-gradient(180deg, rgba(255, 255, 255, 0), var(--sheet-panel-bg) 32%);
}

.lib-search-actions-row #btn-search-reset,
.lib-search-actions-row .lib-search-submit-btn {
  min-height: 2.5rem;
  border-radius: 0.78rem;
  box-shadow: none;
}

.lib-search-actions-row #btn-search-reset {
  border-color: rgba(163, 160, 173, 0.18) !important;
  background: rgba(255, 255, 255, 0.76) !important;
  color: #4a4656 !important;
}

.lib-search-actions-row .lib-search-submit-btn {
  border-color: rgb(var(--accent-rgb) / 0.24) !important;
  background: rgb(var(--accent-rgb) / 0.11) !important;
  background-image: none !important;
  color: #9a3412 !important;
}

html:not([data-theme="light"]) .lib-search-actions-row #btn-search-reset {
  background: rgba(19, 18, 26, 0.76) !important;
  color: var(--muted) !important;
}

html:not([data-theme="light"]) .lib-search-actions-row .lib-search-submit-btn {
  background: rgb(var(--accent-rgb) / 0.18) !important;
  color: #ede9fe !important;
}

.search-sheet-panel .lib-search-section {
  border: 0;
  background: transparent;
}

.search-sheet-panel .lib-search-filters-grid-main {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.search-sheet-panel .lib-search-filter-field {
  padding: 0.48rem;
  border: 1px solid color-mix(in srgb, var(--shell-line) 78%, transparent);
  border-radius: 0.82rem;
  background: color-mix(in srgb, var(--surface) 82%, transparent);
}

html[data-theme="light"] .search-sheet-panel .lib-search-filter-field {
  background: rgba(255, 255, 255, 0.78);
}

.search-sheet-panel .lib-search-filters-grid select {
  border-color: transparent;
  background: transparent;
  padding-inline: 0;
}

.search-sheet-panel .lib-search-actions-row #btn-search-reset {
  background: transparent !important;
}

.search-sheet-panel .lib-search-actions-row .lib-search-submit-btn {
  background: var(--accent) !important;
  color: #fff !important;
  border-color: var(--accent) !important;
}

/* responsive polish: mobile-first PWA, wider tablet/desktop workspaces */
:root {
  --fitana-content-max: 42.5rem;
  --fitana-nav-max: 34rem;
}

#app-root {
  width: 100%;
  max-width: var(--fitana-content-max);
}

.app-bottom-nav,
html[data-theme="light"] .app-bottom-nav {
  width: min(calc(100% - 1rem), var(--fitana-nav-max));
}

.search-bottom-sheet,
body.search-filter-floating .search-bottom-sheet.search-sheet-expanded {
  max-width: min(var(--fitana-content-max), calc(100vw - 1rem));
}

.portal-rail-scroll {
  margin-inline: 0;
  padding-inline: 0;
}

@media (max-width: 420px) {
  :root {
    --fitana-content-max: 100%;
    --fitana-nav-max: calc(100% - 0.8rem);
  }

  #app-root {
    padding-inline: 0.7rem;
  }

  .app-brand {
    margin-inline: -0.15rem;
  }

  .app-bottom-nav,
  html[data-theme="light"] .app-bottom-nav {
    bottom: max(0.42rem, env(safe-area-inset-bottom));
    height: calc(4rem + env(safe-area-inset-bottom, 0px));
    padding-inline: 0.34rem;
    border-radius: 1rem;
  }

  .app-nav-label {
    font-size: 0.54rem;
  }

  .search-results,
  .workout-hub-plans-list,
  .workout-session-tiles {
    grid-template-columns: 1fr !important;
  }
}

@media (min-width: 700px) {
  :root {
    --fitana-content-max: 46rem;
    --fitana-nav-max: 36rem;
    --app-shell-pad: 1.35rem;
  }

  #app-root {
    padding-inline: var(--app-shell-pad);
  }

  .app-main-scroll {
    padding-top: 0.25rem;
  }

  .search-results {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .portal-grid.portal-grid--shortcuts {
    grid-template-columns: repeat(var(--portal-shortcut-columns, 5), minmax(0, 1fr));
  }

  .coach-student-row,
  .plan-summary-card--hub,
  .workout-tile-card {
    min-height: 5rem;
  }
}

@media (min-width: 1024px) {
  :root {
    --fitana-content-max: 64rem;
    --fitana-nav-max: 38rem;
    --app-shell-pad: 1.6rem;
  }

  #app-root {
    padding-top: 1rem;
  }

  .app-brand {
    position: sticky;
    top: 0.7rem;
    border-radius: 0.85rem;
  }

  .page-head {
    padding-top: 0.7rem;
  }

  .search-results {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .portal-random-results.search-results,
  .favorites-results-pad.search-results,
  .workout-session-tiles {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .workout-hub-plans-list,
  #coach-students-list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.65rem;
  }

  .coach-student-row,
  .plan-summary-card--hub {
    height: 100%;
  }

  .exercise-modal-panel,
  .exercise-report-panel,
  .weight-picker-sheet-panel {
    max-width: min(44rem, calc(100vw - 2rem));
  }

  body.search-filter-floating .search-bottom-sheet {
    inset-inline-end: calc((100vw - min(var(--fitana-content-max), 100vw)) / 2 + var(--app-shell-pad));
  }

  body.app-shell.has-search-sheet button.app-scroll-top-fab {
    inset-inline-start: calc((100vw - min(var(--fitana-content-max), 100vw)) / 2 + var(--app-shell-pad));
  }
}

/* Phone login keeps the field and CTA visually paired at every breakpoint. */
#page-phone,
#page-password-login,
#page-otp {
  --phone-auth-width: min(100%, 28rem);
  min-height: min(43rem, calc(100dvh - 6.8rem));
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding-block: clamp(1.3rem, 5vh, 3.4rem) 1.4rem;
}

body.keyboard-open #page-phone,
body.keyboard-open #page-password-login,
body.keyboard-open #page-otp {
  min-height: auto;
  justify-content: flex-start;
  padding-block: 0.75rem calc(1.5rem + var(--app-keyboard-inset));
}

body.keyboard-open #page-phone .phone-auth-lockup,
body.keyboard-open #page-password-login .phone-auth-lockup,
body.keyboard-open #page-otp .phone-auth-lockup {
  width: 4.25rem;
  margin-bottom: 0.55rem;
}

body.keyboard-open #page-phone .phone-auth-card,
body.keyboard-open #page-password-login .phone-auth-card,
body.keyboard-open #page-otp .phone-auth-card {
  padding-block: 0.9rem 1rem;
}

body.keyboard-open :is(#page-ai-plan, #page-ai-plan-quick) {
  padding-bottom: calc(1rem + var(--app-keyboard-inset));
}

body.keyboard-open :is(#page-ai-plan, #page-ai-plan-quick) .ai-plan-panel,
body.keyboard-open :is(#page-ai-plan, #page-ai-plan-quick) .ai-plan-requests-panel {
  scroll-margin-block: 0.8rem calc(1rem + var(--app-keyboard-inset));
}

body.keyboard-open :is(#page-ai-plan, #page-ai-plan-quick) .ai-plan-step label {
  scroll-margin-block: 1rem calc(1.2rem + var(--app-keyboard-inset));
}

body.keyboard-open :is(#page-ai-plan, #page-ai-plan-quick) :is(input:not([type="checkbox"]):not([type="radio"]), textarea, select, .app-select-trigger) {
  scroll-margin-block: 0.9rem calc(1rem + var(--app-keyboard-inset));
}

#page-phone .page-head,
#page-phone .card,
#page-password-login .page-head,
#page-password-login .card,
#page-otp .page-head,
#page-otp .card {
  width: var(--phone-auth-width);
  max-width: var(--phone-auth-width);
  margin-inline: auto;
}

#page-phone .page-head,
#page-password-login .page-head {
  margin-bottom: 1.05rem;
}

#page-phone .card #phone,
#page-phone .card #btn-send-otp,
#page-password-login .card .password-field,
#page-password-login .card #login-password,
#page-password-login .card #btn-password-login,
#page-otp .card #btn-verify {
  display: block;
  width: 100% !important;
  max-width: none !important;
  margin-inline: 0 !important;
}

#page-phone .card #btn-send-otp,
#page-password-login .card #btn-password-login,
#page-otp .card #btn-verify {
  justify-self: stretch;
}

@media (max-width: 380px) {
  .phone-guest-row {
    align-items: stretch;
    flex-direction: column;
  }
}

@media (min-width: 1280px) {
  :root {
    --fitana-content-max: 72rem;
  }

  .search-results {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

/* desktop/tablet action sizing: form buttons should not stretch across wide cards */
@media (min-width: 700px) {
  .card > button:not(.ex-card):not(.portal-grid-tile):not(.plan-summary-card):not(.plan-summary-main):not(.workout-tile-card):not(.stats-hub-action-btn):not(.filter-chip):not(.plan-card-action):not(.plan-vis-btn):not(.search-sheet-toggle):not(.app-scroll-top-fab):not(.billing-method-choice):not(.billing-copy-btn):not(.workout-hub-chip-new):not(.my-ex-hub-new-btn):not(.my-ex-composite-retry):not(.ai-plan-focus-retry):not(.ai-plan-requests-page-btn):not(.search-scroll-retry):not(.portal-random-refresh-btn):not(.profile-logout-btn),
  .card button.wide:not(.fitana-fresh-go):not(.fitana-fresh-later):not(.search-sheet-myex-btn),
  .stats-actions-row > button,
  .my-ex-form-save,
  .my-ex-hub-new-btn,
  #btn-send-otp,
  #btn-password-login,
  #btn-verify-otp,
  #btn-verify,
  #btn-create-plan,
  #btn-plan-save,
  #btn-plan-detail-save,
  #btn-stats-save-log,
  #btn-stats-save-body,
  #btn-stats-bmi-suggest {
    display: block;
    width: min(100%, 22rem) !important;
    max-width: 22rem;
    margin-inline: auto !important;
    justify-self: center;
    align-self: center;
  }

  .card > button + button,
  .stats-actions-row > button {
    margin-inline-start: 0;
  }

  .lib-search-actions-row button,
  .search-sheet-panel button,
  .tabs button,
  .day-grid button,
  .plan-card-actions button,
  .my-ex-composite-row-actions button,
  .coach-student-actions button,
  .input-with-button button {
    width: 100% !important;
    max-width: none;
  }

  .profile-version-actions {
    align-items: center;
  }

  .filter-chip,
  .workout-hub-chip-hidden {
    width: auto !important;
    max-width: max-content;
  }

  .weight-picker-trigger {
    width: min(100%, 28rem) !important;
    max-width: 28rem;
  }

  #page-stats-log .page-head,
  #page-stats-log .stats-log-weight-card {
    width: min(100%, 31rem);
    margin-inline: auto;
  }

  #page-stats-log .page-head {
    text-align: center;
  }

  #page-stats-log .page-head-heading-row {
    justify-content: center;
  }

  #page-stats-log .stats-log-weight-card {
    padding: 1.15rem;
  }

  #page-stats-log .weight-picker,
  #page-stats-log .weight-picker-trigger,
  #page-stats-log #btn-stats-save-log {
    margin-inline: auto !important;
  }

  #page-stats-log #btn-stats-save-log {
    display: block;
    justify-self: center;
  }
}

@media (min-width: 1024px) {
  .card > button:not(.ex-card):not(.portal-grid-tile):not(.plan-summary-card):not(.plan-summary-main):not(.workout-tile-card):not(.stats-hub-action-btn):not(.filter-chip):not(.plan-card-action):not(.plan-vis-btn):not(.search-sheet-toggle):not(.app-scroll-top-fab):not(.billing-method-choice):not(.billing-copy-btn):not(.workout-hub-chip-new):not(.my-ex-hub-new-btn):not(.my-ex-composite-retry):not(.ai-plan-focus-retry):not(.ai-plan-requests-page-btn):not(.search-scroll-retry):not(.portal-random-refresh-btn):not(.profile-logout-btn),
  .card button.wide:not(.fitana-fresh-go):not(.fitana-fresh-later):not(.search-sheet-myex-btn),
  .stats-actions-row > button,
  .my-ex-form-save,
  .my-ex-hub-new-btn,
  #btn-send-otp,
  #btn-password-login,
  #btn-verify-otp,
  #btn-verify,
  #btn-create-plan,
  #btn-plan-save,
  #btn-plan-detail-save,
  #btn-stats-save-log,
  #btn-stats-save-body,
  #btn-stats-bmi-suggest {
    display: block;
    width: min(100%, 20rem) !important;
    max-width: 20rem;
  }

  #page-stats-log .page-head,
  #page-stats-log .stats-log-weight-card {
    width: min(100%, 34rem);
  }

  #page-stats-log .stats-log-weight-card {
    padding: 1.25rem;
  }

  .weight-picker-sheet {
    justify-content: center;
    align-items: center;
    padding: 1.5rem;
  }

  .weight-picker-sheet-panel {
    width: min(100%, 24rem);
    max-width: 24rem;
    margin: 0 auto;
    padding: 1.1rem;
    border-radius: 1rem;
    border-bottom: 1px solid rgb(var(--accent-rgb) / 0.28);
    box-shadow: 0 22px 70px rgba(0, 0, 0, 0.36);
    animation-name: weight-sheet-center-in;
  }
}

/* Final reset for image gallery controls: player-like controls, no inherited brand gradients. */
.ex-detail-hero-wrap--loop .ex-media-controls {
  height: 2.25rem !important;
  grid-template-columns: 2.25rem 2.25rem minmax(2.6rem, auto) 2.25rem !important;
  gap: 0.34rem !important;
}

button.ex-media-btn,
button.ex-media-btn:hover,
button.ex-media-btn:active,
button.ex-media-btn:focus-visible {
  inline-size: 2.25rem !important;
  block-size: 2.25rem !important;
  min-width: 0 !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 1px solid rgba(255, 255, 255, 0.2) !important;
  border-radius: 999px !important;
  color: #fff !important;
  background: rgba(14, 14, 16, 0.86) !important;
  box-shadow: none !important;
  backdrop-filter: blur(12px) !important;
}

button.ex-media-btn:hover,
button.ex-media-btn:focus-visible {
  border-color: rgba(255, 255, 255, 0.36) !important;
  background: rgba(28, 28, 31, 0.92) !important;
}

button.ex-media-btn:active {
  transform: scale(0.96) !important;
}

.ex-media-position {
  block-size: 1.7rem !important;
  color: #fff !important;
  background: rgba(14, 14, 16, 0.72) !important;
  box-shadow: none !important;
}

/* Final reset for the custom video player: no brand colors, no inherited button gradients. */
.fitana-player,
.fitana-player * {
  color-scheme: dark;
}

.fitana-player .fitana-player-stage,
.fitana-player video.fitana-player-video {
  background: #000 !important;
  filter: none !important;
}

.fitana-player .fitana-player-stage {
  place-items: center !important;
}

.fitana-player video.fitana-player-video {
  place-self: center !important;
  inline-size: 100% !important;
  block-size: 100% !important;
  max-inline-size: 100% !important;
  max-block-size: 100% !important;
  object-fit: contain !important;
  object-position: center center !important;
}

.fitana-player .fitana-player-poster {
  inline-size: 100% !important;
  block-size: 100% !important;
  max-inline-size: 100% !important;
  max-block-size: 100% !important;
  object-fit: contain !important;
  object-position: center center !important;
}

.fitana-player button.fitana-player-overlay {
  background: transparent !important;
  box-shadow: none !important;
}

.fitana-player button.fitana-player-btn,
.fitana-player button.fitana-player-btn:hover,
.fitana-player button.fitana-player-btn:active,
.fitana-player button.fitana-player-btn:focus-visible {
  width: 2.25rem !important;
  height: 2.25rem !important;
  margin: 0 !important;
  padding: 0 !important;
  border-color: rgba(255, 255, 255, 0.24) !important;
  background: #191919 !important;
  color: #fff !important;
  box-shadow: none !important;
  transform: none !important;
}

.fitana-player button.fitana-player-btn:hover {
  background: #232323 !important;
  border-color: rgba(255, 255, 255, 0.38) !important;
}

.fitana-player[data-cache-state="cached"] button.fitana-player-cache,
.fitana-player[data-cache-state="cached"] button.fitana-player-cache:hover {
  border-color: rgb(var(--accent-rgb) / 0.72) !important;
  background: rgb(var(--accent-rgb) / 0.86) !important;
  color: #fff !important;
}

.fitana-player .fitana-player-ico {
  position: absolute !important;
  top: 50% !important;
  left: 50% !important;
  display: grid;
  width: 1.08rem !important;
  height: 1.08rem !important;
  transform: translate(-50%, -50%) !important;
}

.fitana-player .fitana-player-ico-play {
  transform: translate(-46%, -50%) !important;
}

.fitana-player .fitana-player-ico-pause,
.fitana-player .fitana-player-ico-check,
.fitana-player.is-playing .fitana-player-ico-play,
.fitana-player[data-cache-state="cached"] .fitana-player-ico-download {
  display: none !important;
}

.fitana-player.is-playing .fitana-player-ico-pause,
.fitana-player[data-cache-state="cached"] .fitana-player-ico-check {
  display: grid !important;
}

.fitana-player input.fitana-player-seek,
.fitana-player input.fitana-player-seek:focus,
.fitana-player input.fitana-player-seek:active {
  position: absolute !important;
  inset: 0 !important;
  z-index: 2 !important;
  width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  outline: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  appearance: none !important;
  -webkit-appearance: none !important;
}

.fitana-player .fitana-player-seek-wrap {
  align-self: center !important;
}

/* Custom select controls: the native select stays as the data source, but the user sees Fitana UI. */
.app-native-select-hidden {
  position: absolute !important;
  inline-size: 1px !important;
  block-size: 1px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  opacity: 0 !important;
  pointer-events: none !important;
  clip: rect(0 0 0 0) !important;
  clip-path: inset(50%) !important;
}

.app-select {
  position: relative;
  width: 100%;
  min-width: 0;
  direction: rtl;
  z-index: 1;
}

.app-select.is-open {
  z-index: 10120;
}

body.app-select-modal-open {
  overflow: hidden;
}

.app-select.is-open::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 0;
  background: rgba(7, 6, 10, 0.52);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
}

button.app-select-trigger,
button.app-select-trigger:hover,
button.app-select-trigger:focus-visible,
button.app-select-trigger:active {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 1.3rem !important;
  align-items: center !important;
  width: 100% !important;
  min-height: 2.75rem !important;
  margin: 0 !important;
  padding: 0.56rem 0.72rem 0.56rem 0.56rem !important;
  border: 1px solid var(--control-line) !important;
  border-radius: 0.5rem !important;
  background: var(--control-bg) !important;
  background-image: none !important;
  color: var(--text) !important;
  box-shadow: inset 0 1px 0 color-mix(in srgb, #ffffff 5%, transparent) !important;
  transform: none !important;
  text-align: start !important;
}

button.app-select-trigger:hover,
button.app-select-trigger:focus-visible,
.app-select.is-open button.app-select-trigger {
  border-color: color-mix(in srgb, var(--accent) 52%, var(--control-line)) !important;
  box-shadow:
    0 0 0 3px color-mix(in srgb, var(--accent) 16%, transparent),
    inset 0 1px 0 color-mix(in srgb, #ffffff 8%, transparent) !important;
}

.app-select-value {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  min-width: 0;
}

.app-select-icon {
  display: grid;
  place-items: center;
  color: var(--muted);
  transition: transform 0.16s ease, color 0.16s ease;
}

.app-select-icon svg {
  width: 1.05rem;
  height: 1.05rem;
  fill: none;
  stroke: currentColor;
  stroke-width: 2.2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.app-select.is-open .app-select-icon {
  color: var(--accent);
  transform: rotate(180deg);
}

.app-select-menu {
  position: fixed;
  z-index: 1;
  left: 50%;
  right: auto;
  top: 44dvh;
  bottom: auto;
  width: min(34rem, calc(100vw - max(1.4rem, env(safe-area-inset-left)) - max(1.4rem, env(safe-area-inset-right))));
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  gap: 0.54rem;
  max-height: min(66dvh, 32rem);
  overflow-y: auto;
  padding: 0.78rem;
  border: 1px solid color-mix(in srgb, var(--control-line) 80%, var(--accent));
  border-radius: 0.88rem;
  background: color-mix(in srgb, var(--surface) 97%, var(--bg));
  box-shadow: 0 24px 70px rgba(0, 0, 0, 0.42);
  transform: translate(-50%, -50%);
}

.app-select-menu[hidden] {
  display: none !important;
}

.app-select-menu-head {
  display: grid;
  gap: 0.14rem;
  padding: 0.12rem 0.1rem 0.44rem;
  border-bottom: 1px solid color-mix(in srgb, var(--control-line) 78%, transparent);
}

.app-select-menu-head strong {
  color: var(--text);
  font-size: 0.95rem;
  line-height: 1.45;
}

.app-select-menu-head span {
  color: var(--muted);
  font-size: 0.78rem;
  line-height: 1.45;
}

.app-select-options-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(10rem, 100%), 1fr));
  gap: 0.36rem;
  overflow-y: auto;
  padding: 0.06rem;
}

button.app-select-option,
button.app-select-option:hover,
button.app-select-option:focus-visible,
button.app-select-option:active {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  width: 100% !important;
  min-height: 2.62rem !important;
  margin: 0 !important;
  padding: 0.52rem 0.68rem !important;
  border: 1px solid color-mix(in srgb, var(--control-line) 72%, transparent) !important;
  border-radius: 0.56rem !important;
  background: color-mix(in srgb, var(--surface) 82%, transparent) !important;
  background-image: none !important;
  color: var(--text) !important;
  box-shadow: none !important;
  transform: none !important;
  text-align: start !important;
}

button.app-select-option:hover,
button.app-select-option:focus-visible {
  border-color: color-mix(in srgb, var(--accent) 18%, transparent) !important;
  background: color-mix(in srgb, var(--accent) 12%, transparent) !important;
}

button.app-select-option.is-selected {
  border-color: color-mix(in srgb, var(--accent) 24%, transparent) !important;
  background: color-mix(in srgb, var(--accent) 18%, transparent) !important;
  color: color-mix(in srgb, var(--accent) 74%, var(--text)) !important;
  font-weight: 800 !important;
}

button.app-select-option.is-disabled,
button.app-select-option:disabled,
.app-select.is-disabled button.app-select-trigger {
  opacity: 0.56 !important;
  cursor: not-allowed !important;
}

.plan-draft-rest-select .app-select,
.plan-draft-unit-select + .app-select,
.plan-draft-rest-set-select + .app-select,
.plan-draft-rest-after-select + .app-select {
  min-width: 0;
}

.plan-draft-unit-select + .app-select button.app-select-trigger,
.plan-draft-rest-set-select + .app-select button.app-select-trigger,
.plan-draft-rest-after-select + .app-select button.app-select-trigger,
select.stats-jalali-part + .app-select button.app-select-trigger {
  min-height: 2.45rem !important;
  padding-block: 0.42rem !important;
}

html[data-theme="light"] .app-select-menu {
  background: #ffffff;
  border-color: rgba(19, 18, 26, 0.12);
  box-shadow: 0 18px 42px rgba(19, 18, 26, 0.14);
}

html[data-theme="light"] .app-select.is-open::before {
  background: rgba(19, 18, 26, 0.28);
}

@media (min-width: 700px) {
  .app-select-menu {
    left: 50%;
    right: auto;
    top: 50%;
    bottom: auto;
    width: min(42rem, calc(100vw - 2rem));
    max-height: min(72vh, 34rem);
    transform: translate(-50%, -50%);
    padding: 0.9rem;
  }

  html[dir="rtl"] .app-select-menu {
    transform: translate(-50%, -50%);
  }

  .app-select-options-grid {
    grid-template-columns: repeat(auto-fit, minmax(9.5rem, 1fr));
  }
}

.inapp-message-root.hidden {
  display: none;
}

.inapp-message-root {
  position: fixed;
  inset: 0;
  z-index: 2147483000;
  display: flex;
  align-items: center;
  justify-content: center;
  pointer-events: none;
  padding: max(1rem, env(safe-area-inset-top, 0px)) 1rem max(1rem, env(safe-area-inset-bottom, 0px));
}

.inapp-message-panel {
  width: min(100%, 29rem);
  pointer-events: auto;
}

.inapp-message-card {
  position: relative;
  overflow: hidden;
  border: 1px solid color-mix(in srgb, var(--accent) 24%, var(--control-line));
  border-radius: var(--radius);
  background: var(--surface);
  color: var(--text);
  box-shadow: var(--shadow-modal);
}

.inapp-message-close {
  position: absolute;
  top: 0.62rem;
  left: 0.62rem;
  z-index: 2;
  display: inline-flex;
  width: 2.1rem;
  height: 2.1rem;
  min-width: 2.1rem;
  min-height: 2.1rem;
  align-items: center;
  justify-content: center;
  padding: 0 0 0.08rem;
  border: 1px solid color-mix(in srgb, var(--control-line) 78%, transparent);
  border-radius: 999px;
  background: color-mix(in srgb, var(--surface) 92%, transparent);
  color: color-mix(in srgb, var(--text) 72%, var(--muted));
  box-shadow: 0 6px 18px rgba(19, 18, 26, 0.12);
  font-size: 1.25rem;
  font-weight: 700;
  line-height: 1;
  text-align: center;
  cursor: pointer;
}

.inapp-message-close:hover,
.inapp-message-close:focus-visible {
  border-color: color-mix(in srgb, var(--accent) 28%, var(--control-line));
  color: var(--text);
}

.inapp-message-media {
  width: 100%;
  max-height: 14rem;
  background: #16151d;
}

.inapp-message-media img,
.inapp-message-media video {
  display: block;
  width: 100%;
  max-height: 14rem;
  object-fit: cover;
}

.inapp-message-copy {
  display: grid;
  gap: 0.38rem;
  padding: 1rem 1rem 0.45rem;
}

.inapp-message-copy h2 {
  max-width: calc(100% - 2.7rem);
  margin: 0;
  color: color-mix(in srgb, var(--text) 94%, var(--accent));
  font-size: 1.02rem;
  font-weight: 900;
  line-height: 1.55;
}

.inapp-message-copy p {
  margin: 0;
  color: var(--muted);
  font-size: 0.9rem;
  line-height: 1.85;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}

.inapp-message-cta {
  display: flex;
  width: fit-content;
  max-width: calc(100% - 2rem);
  min-height: 2.38rem;
  align-items: center;
  justify-content: center;
  margin: 0.5rem 1rem 0.95rem;
  border-radius: 0.55rem;
  background: var(--accent);
  color: #fff;
  padding: 0.46rem 0.95rem;
  box-shadow: none;
  font-weight: 800;
  font-size: 0.88rem;
  line-height: 1.5;
  text-decoration: none;
}

.inapp-message-cta:hover,
.inapp-message-cta:focus-visible {
  filter: brightness(1.02);
  transform: translateY(-1px);
}

.inapp-message-controls {
  display: grid;
  grid-template-columns: 2.25rem 1fr 2.25rem;
  align-items: center;
  gap: 0.4rem;
  border-top: 1px solid color-mix(in srgb, var(--control-line) 62%, transparent);
  padding: 0.45rem 0.7rem;
  color: var(--muted);
  font-size: 0.82rem;
  text-align: center;
}

.inapp-message-controls button {
  display: inline-flex;
  width: 2.25rem;
  height: 2rem;
  align-items: center;
  justify-content: center;
  border: 1px solid color-mix(in srgb, var(--control-line) 70%, transparent);
  border-radius: 999px;
  background: color-mix(in srgb, var(--surface) 84%, transparent);
  color: var(--text);
  font-size: 1.3rem;
  line-height: 1;
}

@media (min-width: 700px) {
  .inapp-message-root {
    inset: 0;
    justify-content: center;
  }
}

/* خانه — هماهنگی بصری کارت‌های بالا و میانبرها */
#page-portal {
  --portal-home-border: var(--shell-line);
  --portal-home-glow: transparent;
  --portal-home-blue: transparent;
  --portal-home-card-bg: var(--card);
}

#page-portal .portal-weight-goal-card,
#page-portal .portal-random-card {
  position: relative;
  isolation: isolate;
  border-radius: var(--radius);
  border: 1px solid var(--portal-home-border);
  background: var(--portal-home-card-bg);
  box-shadow: var(--shadow-sm);
  overflow: hidden;
}

#page-portal .portal-weight-goal-card::before,
#page-portal .portal-random-card::before {
  content: none;
}

#page-portal .portal-weight-goal-card::after,
#page-portal .portal-random-card::after {
  content: none;
}

#page-portal .portal-weight-goal-card {
  margin: 0.35rem 0 0.68rem;
  padding: 0.78rem;
}

#page-portal .weight-goal-summary-top {
  min-height: 2rem;
}

#page-portal .weight-goal-summary-kicker {
  position: relative;
  padding-inline-start: 0.78rem;
  color: var(--text);
  font-size: 0.86rem;
  font-weight: 850;
}

#page-portal .portal-random-head {
  min-height: 2rem;
}

#page-portal .portal-random-title {
  font-size: 0.86rem;
  font-weight: 850;
  line-height: 1.45;
}

#page-portal .weight-goal-summary-kicker::before {
  content: "";
  position: absolute;
  inset-inline-start: 0;
  top: 0.5em;
  width: 0.38rem;
  height: 0.38rem;
  border-radius: 999px;
  background: var(--accent);
  box-shadow: 0 0 0 0.28rem rgb(var(--accent-rgb) / 0.14);
}

#page-portal .weight-goal-summary--portal .weight-goal-metric {
  border-color: rgb(var(--accent-hover-rgb) / 0.18);
  border-radius: var(--radius);
  background: var(--surface-strong);
}

#page-portal .weight-goal-summary--portal .weight-goal-summary-status {
  border-radius: var(--radius);
  border-color: rgb(var(--accent-hover-rgb) / 0.18);
  background: var(--surface-strong);
  box-shadow: none;
}

#page-portal .portal-shortcuts {
  margin: 0 0 0.95rem;
}

#page-portal button.portal-grid-tile.portal-grid-tile-action {
  min-height: 4.6rem;
  border-radius: var(--radius);
  border-color: var(--shell-line);
  background: var(--card);
  box-shadow: none;
}

#page-portal button.portal-grid-tile-action:hover {
  border-color: color-mix(in srgb, var(--accent) 36%, var(--shell-line));
  background: color-mix(in srgb, var(--accent) 5%, var(--card));
}

#page-portal .portal-tile-icon {
  border: 1px solid rgb(var(--accent-rgb) / 0.28);
  border-radius: var(--radius);
  background: color-mix(in srgb, var(--accent) 8%, var(--control-bg));
  box-shadow: none;
}

#page-portal .portal-grid--shortcuts .portal-tile-caption {
  font-weight: 800;
  color: color-mix(in srgb, var(--text) 92%, var(--muted));
}

#page-portal .portal-exercise-rail {
  margin-bottom: 1.05rem;
}

#page-portal .portal-rail-title {
  font-size: 0.95rem;
}

#page-portal .portal-rail-title-dot {
  width: 0.38rem;
  height: 0.38rem;
  border-radius: 999px;
  box-shadow: 0 0 0 0.28rem rgb(var(--accent-rgb) / 0.14);
}

#page-portal .portal-rail-more {
  border-radius: 0.72rem;
  border-color: rgb(var(--accent-rgb) / 0.3);
  background:
    linear-gradient(180deg, rgba(250, 204, 21, 0.12), rgb(var(--accent-rgb) / 0.1)),
    rgb(var(--accent-rgb) / 0.08);
  box-shadow: 0 7px 16px rgb(var(--accent-rgb) / 0.1);
}

#page-portal .portal-rail-card.ex-card {
  border-color: rgb(var(--accent-hover-rgb) / 0.18);
  box-shadow:
    0 12px 30px rgba(0, 0, 0, 0.24),
    0 1px 0 rgba(255, 255, 255, 0.055) inset;
}

html[data-theme="light"] #page-portal {
  --portal-home-border: var(--shell-line);
  --portal-home-blue: transparent;
  --portal-home-card-bg: var(--card);
}

html[data-theme="light"] #page-portal .portal-weight-goal-card,
html[data-theme="light"] #page-portal .portal-random-card {
  box-shadow: var(--shadow-sm);
}

html[data-theme="light"] #page-portal .weight-goal-summary--portal .weight-goal-metric,
html[data-theme="light"] #page-portal .weight-goal-summary--portal .weight-goal-summary-status {
  border-color: rgb(var(--accent-strong-rgb) / 0.16);
  background: rgba(255, 247, 237, 0.7);
}

html[data-theme="light"] #page-portal button.portal-grid-tile.portal-grid-tile-action {
  border-color: var(--shell-line);
  background: var(--card);
  box-shadow: none;
}

html[data-theme="light"] #page-portal .portal-tile-icon {
  border-color: var(--control-line);
  background: color-mix(in srgb, var(--accent) 8%, var(--control-bg));
}

/* آمار من — یکدست‌سازی کارت‌ها، نمودار و فرم‌ها */
#page-stats-hub,
#page-stats-log,
#page-stats-body,
#page-stats-history {
  --stats-card-border: var(--shell-line);
  --stats-card-bg: var(--card);
  --stats-inner-bg: var(--surface-strong);
  --stats-muted: color-mix(in srgb, var(--muted) 74%, var(--text));
  --stats-soft-border: var(--control-line);
}

#page-stats-hub .page-head,
#page-stats-log .page-head,
#page-stats-body .page-head,
#page-stats-history .page-head {
  margin-bottom: 0.78rem;
}

#page-stats-hub .page-head h1,
#page-stats-log .page-head h1,
#page-stats-body .page-head h1,
#page-stats-history .page-head h1 {
  font-size: 1.22rem;
  letter-spacing: 0;
}

#page-stats-hub .lead,
#page-stats-log .lead,
#page-stats-body .lead,
#page-stats-history .lead,
#stats-hub-headline {
  max-width: 32rem;
  line-height: 1.62;
  color: var(--stats-muted);
}

#page-stats-hub .muted,
#page-stats-log .muted,
#page-stats-body .muted,
#page-stats-history .muted {
  color: var(--stats-muted);
}

#page-stats-hub .card,
#page-stats-log .card,
#page-stats-body .card,
#page-stats-history .card {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  border: 1px solid var(--stats-card-border);
  border-radius: var(--radius);
  background: var(--stats-card-bg);
  box-shadow: var(--shadow-sm);
}

#page-stats-hub .card::before,
#page-stats-log .card::before,
#page-stats-body .card::before,
#page-stats-history .card::before {
  content: none;
}

#page-stats-hub .stats-section-title,
#page-stats-log .stats-section-title,
#page-stats-body .stats-section-title,
#page-stats-history .stats-section-title,
#page-stats-body .stats-subsection-title {
  position: relative;
  margin-bottom: 0.72rem;
  padding-inline-start: 0.75rem;
  color: var(--text);
  font-size: 1rem;
  font-weight: 850;
  line-height: 1.42;
}

#page-stats-hub .stats-section-title::before,
#page-stats-log .stats-section-title::before,
#page-stats-body .stats-section-title::before,
#page-stats-history .stats-section-title::before,
#page-stats-body .stats-subsection-title::before {
  content: "";
  position: absolute;
  inset-inline-start: 0;
  top: 0.48em;
  width: 0.36rem;
  height: 0.36rem;
  border-radius: 999px;
  background: var(--accent);
  box-shadow: 0 0 0 0.26rem rgb(var(--accent-rgb) / 0.13);
}

#page-stats-hub .filter-chip-scroll,
#page-stats-history .filter-chip-scroll {
  padding: 0.12rem;
  border: 1px solid rgb(var(--accent-hover-rgb) / 0.14);
  border-radius: var(--radius);
  background: var(--surface-strong);
}

#page-stats-hub .filter-chip,
#page-stats-history .filter-chip {
  min-height: 2rem;
  border-radius: 0.66rem;
  font-weight: 800;
}

#page-stats-hub .filter-chip.is-on,
#page-stats-history .filter-chip.is-on {
  box-shadow:
    0 8px 18px rgb(var(--accent-rgb) / 0.16),
    inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

.stats-hub-trends-card,
.stats-chart-card {
  padding: 0.9rem;
}

#page-portal .portal-weight-goal-card--empty-body .portal-weight-goal-line {
  filter: blur(8px);
  opacity: 0.62;
  pointer-events: none;
  user-select: none;
}

.portal-body-empty-overlay {
  position: absolute;
  inset: 0.72rem;
  z-index: 2;
  display: grid;
  align-content: center;
  justify-items: center;
  gap: 0.68rem;
  min-height: 8rem;
  padding: 1rem;
  border: 1px solid var(--line-soft);
  border-radius: 0.86rem;
  background: color-mix(in srgb, var(--bg) 62%, transparent);
  color: var(--text);
  text-align: center;
  cursor: pointer;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08);
  -webkit-backdrop-filter: blur(8px) saturate(1.05);
  backdrop-filter: blur(8px) saturate(1.05);
}

.portal-body-empty-overlay.hidden {
  display: none;
}

.portal-body-empty-overlay-copy {
  display: grid;
  gap: 0.24rem;
  max-width: 18rem;
}

.portal-body-empty-overlay-copy strong {
  font-size: 1.08rem;
  font-weight: 900;
}

.portal-body-empty-overlay-copy span {
  color: color-mix(in srgb, var(--muted) 88%, var(--text));
  font-size: 0.86rem;
  line-height: 1.7;
}

.portal-body-empty-actions {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 0.48rem;
}

.portal-body-empty-primary,
.portal-body-empty-dismiss {
  width: auto;
  min-height: 2.34rem;
  margin: 0;
  padding: 0.42rem 0.78rem;
  border-radius: 999px;
  font-size: 0.82rem;
  font-weight: 850;
  box-shadow: none;
}

.portal-body-empty-primary {
  border: 1px solid rgba(250, 204, 21, 0.34);
  background:
    linear-gradient(135deg, rgb(var(--accent-hover-rgb) / 0.96), rgb(var(--accent-rgb) / 0.92)),
    var(--accent);
  color: #fff7ed;
  box-shadow: 0 0.52rem 1.2rem rgb(var(--accent-rgb) / 0.22);
}

.portal-body-empty-primary:hover {
  border-color: rgba(250, 204, 21, 0.52);
  background:
    linear-gradient(135deg, rgb(var(--accent-soft-rgb) / 0.98), rgb(var(--accent-rgb) / 0.98)),
    var(--accent);
}

.portal-body-empty-dismiss {
  border: 1px solid rgba(255, 255, 255, 0.16);
  background: rgba(255, 255, 255, 0.055);
  color: color-mix(in srgb, var(--muted) 82%, var(--text));
}

.portal-body-empty-dismiss:hover {
  border-color: rgba(255, 255, 255, 0.22);
  background: rgba(255, 255, 255, 0.085);
  color: var(--text);
}

.stats-hub-preview-head,
.stats-chart-card-head {
  margin-bottom: 0.72rem;
}

.stats-weight-chart-canvas,
.stats-hub-chart-canvas {
  padding: 0.5rem;
  border: 1px solid rgb(var(--accent-hover-rgb) / 0.14);
  border-radius: var(--radius);
  background: var(--surface-strong);
  box-shadow: none;
}

.stats-chart-card .stats-weight-chart-canvas {
  max-height: 12.5rem;
}

.stats-hub-bmi-readout,
.stats-bmi-readout {
  margin-top: 0.58rem;
  padding: 0.68rem 0.74rem;
  border: 1px solid var(--stats-soft-border);
  border-radius: 0.78rem;
  background: var(--stats-inner-bg);
  box-shadow: none;
}

.stats-bmi-readout-inner {
  gap: 0.36rem;
}

.stats-bmi-readout-main {
  font-size: 0.95rem;
  font-weight: 800;
}

.stats-bmi-readout-detail {
  line-height: 1.58;
}

.stats-hub-actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.62rem;
}

button.stats-hub-action-btn {
  min-height: 5.05rem;
  padding: 0.72rem;
  border-color: var(--stats-soft-border);
  border-radius: calc(var(--radius) + 0.06rem);
  background: var(--card);
  box-shadow: none;
}

#page-stats-log button.secondary,
#page-stats-body button.secondary,
#page-stats-history button.secondary,
button.stats-hub-action-btn {
  color: var(--text);
}

button.stats-hub-action-btn:hover {
  border-color: rgba(250, 204, 21, 0.42);
  background: color-mix(in srgb, var(--accent) 5%, var(--card));
}

.stats-hub-action-btn .portal-tile-icon.stats-hub-action-icon {
  width: 2.72rem;
  height: 2.72rem;
  border-radius: 0.78rem;
}

.stats-hub-action-title {
  font-size: 0.96rem;
  font-weight: 850;
}

.stats-hub-action-hint {
  color: color-mix(in srgb, var(--muted) 90%, var(--text));
}

.stats-hub-retry {
  width: auto;
  min-height: 2rem;
  margin-inline-start: 0.55rem;
  padding: 0.35rem 0.75rem;
  border: 1px solid color-mix(in srgb, var(--accent) 36%, var(--control-line));
  border-radius: 0.55rem;
  background: color-mix(in srgb, var(--accent) 8%, var(--surface));
  color: var(--accent);
  font-size: 0.75rem;
  font-weight: 800;
  box-shadow: none;
}

.stats-hub-retry:hover,
.stats-hub-retry:focus-visible {
  background: color-mix(in srgb, var(--accent) 14%, var(--surface));
  transform: none;
}

.stats-hub-recent-card,
.stats-history-card {
  padding: 0.9rem;
}

.stats-hub-entries-lead,
.stats-history-card .stats-history-lead {
  margin-bottom: 0.62rem !important;
  line-height: 1.55;
}

.stats-weight-list-scroll {
  max-height: min(52vh, 26rem);
  padding: 0.32rem;
  border-color: var(--stats-soft-border);
  border-radius: 0.86rem;
  background: rgba(3, 7, 18, 0.22);
}

.stats-weight-list {
  display: grid;
  gap: 0.36rem;
}

.stats-weight-list li {
  padding: 0.62rem 0.68rem;
  border: 1px solid rgb(var(--accent-hover-rgb) / 0.12);
  border-radius: 0.72rem;
  background: rgba(19, 18, 26, 0.22);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.025);
}

.stats-weight-list li:last-child {
  border-bottom: 1px solid rgb(var(--accent-hover-rgb) / 0.12);
}

.stats-weight-li-date {
  font-size: 0.82rem;
}

.stats-weight-li-val {
  font-size: 0.95rem;
  font-weight: 850;
  color: #fed7aa;
}

.stats-log-weight-card,
.stats-body-setup-card,
.stats-bmi-target-card {
  padding: 0.95rem;
}

.stats-jalali-fields-label,
#page-stats-log label,
#page-stats-body label {
  font-weight: 850;
  color: color-mix(in srgb, var(--text) 92%, var(--muted));
}

.stats-jalali-row {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.46rem;
}

select.stats-jalali-part,
select.stats-jalali-part + .app-select button.app-select-trigger,
.stats-bmi-height-field {
  min-height: 2.55rem;
  border-radius: 0.72rem;
  border-color: rgb(var(--accent-hover-rgb) / 0.18);
  background: rgba(19, 18, 26, 0.2);
}

button.weight-picker-trigger {
  padding: 0.95rem 0.78rem;
  border-color: var(--control-line);
  border-radius: 0.9rem;
  background: var(--control-bg);
}

.weight-picker-value {
  font-size: clamp(2.2rem, 9vw, 2.7rem);
}

#btn-stats-save-log,
#btn-stats-save-target,
#btn-stats-save-height,
#btn-stats-bmi-suggest {
  min-height: 2.72rem;
  border-radius: 0.78rem;
}

.stats-bmi-height-row {
  grid-template-columns: minmax(0, 1fr) minmax(7.4rem, 9.2rem);
  gap: 0.52rem;
}

.stats-home-weight-pref-row {
  margin-top: 0.72rem;
  padding: 0.68rem;
  border: 1px solid var(--stats-soft-border);
  border-radius: 0.82rem;
  background: var(--stats-inner-bg);
}

.stats-bmi-target-divider {
  margin: 0.95rem 0 0.82rem;
  border-top-color: rgb(var(--accent-hover-rgb) / 0.24);
}

.weight-spin {
  padding: 0.68rem;
  border: 1px solid var(--stats-soft-border);
  border-radius: 0.82rem;
  background: var(--stats-inner-bg);
}

#page-stats-body .weight-spin-range {
  accent-color: var(--accent);
}

.weight-spin-val {
  font-size: 1.32rem;
}

.weight-spin-nudge-row .weight-spin-nudge {
  min-height: 2.35rem;
  border-radius: 0.68rem;
}

.stats-actions-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 0.78fr);
  gap: 0.5rem;
}

.stats-actions-row > button {
  width: 100%;
  margin: 0;
}

html[data-theme="light"] #page-stats-hub,
html[data-theme="light"] #page-stats-log,
html[data-theme="light"] #page-stats-body,
html[data-theme="light"] #page-stats-history {
  --stats-card-border: var(--shell-line);
  --stats-card-bg: var(--card);
  --stats-inner-bg: var(--surface-strong);
  --stats-muted: color-mix(in srgb, var(--muted) 82%, var(--text));
  --stats-soft-border: var(--control-line);
}

html[data-theme="light"] #page-stats-hub .card,
html[data-theme="light"] #page-stats-log .card,
html[data-theme="light"] #page-stats-body .card,
html[data-theme="light"] #page-stats-history .card {
  box-shadow: var(--shadow-sm);
}

html[data-theme="light"] .stats-weight-chart-canvas,
html[data-theme="light"] .stats-hub-chart-canvas,
html[data-theme="light"] .stats-weight-list-scroll,
html[data-theme="light"] .stats-weight-list li,
html[data-theme="light"] button.stats-hub-action-btn,
html[data-theme="light"] .weight-spin,
html[data-theme="light"] .stats-home-weight-pref-row {
  background: rgba(255, 255, 255, 0.72);
}

html[data-theme="light"] .stats-bmi-readout {
  border-color: var(--stats-soft-border);
  background: rgba(255, 247, 237, 0.72);
}

html[data-theme="light"] .portal-body-empty-overlay {
  border-color: var(--line-soft);
  background: rgba(255, 255, 255, 0.8);
  box-shadow: none;
}

html[data-theme="light"] .portal-body-empty-dismiss {
  border-color: rgba(163, 160, 173, 0.22);
  background: rgba(248, 250, 252, 0.72);
  color: color-mix(in srgb, var(--muted) 86%, var(--text));
}

html[data-theme="light"] select.stats-jalali-part,
html[data-theme="light"] select.stats-jalali-part + .app-select button.app-select-trigger,
html[data-theme="light"] .stats-bmi-height-field {
  background: rgba(255, 255, 255, 0.84);
}

html[data-theme="light"] .stats-weight-li-val {
  color: #c2410c;
}

@media (max-width: 420px) {
  .stats-hub-actions {
    grid-template-columns: 1fr;
  }

  .stats-bmi-height-row,
  .stats-actions-row {
    grid-template-columns: 1fr;
  }
}

/* یکپارچه‌سازی ظاهر صفحات اصلی با سبک جدید خانه و آمار */
:is(
  #page-profile,
  #page-profile-terms,
  #page-profile-coach-request,
  #page-support,
  #page-support-new,
  #page-support-ticket,
  #page-billing,
  #page-billing-payment,
  #page-billing-manual,
  #page-my-exercises,
  #page-my-exercise-form,
  #page-plans-new,
  #page-plans-active,
  #page-plan-detail,
  #page-plan-assignee-comments,
  #page-plan-session,
  #page-plan-session-pick,
  #page-coach,
  #page-coach-day,
  #page-coach-students,
  #page-coach-student-new,
  #page-coach-student-edit,
  #page-coach-student-plans,
  #page-workout-hub,
  #page-workout-session,
  #page-search,
  #page-favorites
) {
  --unified-card-border: var(--line-soft);
  --unified-card-bg: var(--card);
  --unified-inner-bg: color-mix(in srgb, var(--bg-deep) 55%, transparent);
  --unified-soft-border: var(--line-soft);
  --unified-muted: color-mix(in srgb, var(--muted) 76%, var(--text));
}

:is(
  #page-profile,
  #page-profile-terms,
  #page-profile-coach-request,
  #page-support,
  #page-support-new,
  #page-support-ticket,
  #page-billing,
  #page-billing-payment,
  #page-billing-manual,
  #page-my-exercises,
  #page-my-exercise-form,
  #page-plans-new,
  #page-plans-active,
  #page-plan-detail,
  #page-plan-assignee-comments,
  #page-plan-session,
  #page-plan-session-pick,
  #page-coach,
  #page-coach-day,
  #page-coach-students,
  #page-coach-student-new,
  #page-coach-student-edit,
  #page-coach-student-plans,
  #page-workout-hub,
  #page-workout-session,
  #page-search,
  #page-favorites
) .page-head {
  margin-bottom: 0.8rem;
}

:is(
  #page-profile,
  #page-profile-terms,
  #page-profile-coach-request,
  #page-support,
  #page-support-new,
  #page-support-ticket,
  #page-billing,
  #page-billing-payment,
  #page-billing-manual,
  #page-my-exercises,
  #page-my-exercise-form,
  #page-plans-new,
  #page-plans-active,
  #page-plan-detail,
  #page-plan-assignee-comments,
  #page-plan-session,
  #page-plan-session-pick,
  #page-coach,
  #page-coach-day,
  #page-coach-students,
  #page-coach-student-new,
  #page-coach-student-edit,
  #page-coach-student-plans,
  #page-workout-hub,
  #page-workout-session,
  #page-favorites
) .page-head h1 {
  font-size: 1.22rem;
  letter-spacing: 0;
}

:is(
  #page-profile,
  #page-profile-terms,
  #page-profile-coach-request,
  #page-support,
  #page-support-new,
  #page-support-ticket,
  #page-billing,
  #page-billing-payment,
  #page-billing-manual,
  #page-my-exercises,
  #page-my-exercise-form,
  #page-plans-new,
  #page-plans-active,
  #page-plan-detail,
  #page-plan-assignee-comments,
  #page-plan-session,
  #page-plan-session-pick,
  #page-coach,
  #page-coach-day,
  #page-coach-students,
  #page-coach-student-new,
  #page-coach-student-edit,
  #page-coach-student-plans,
  #page-workout-hub,
  #page-workout-session,
  #page-search,
  #page-favorites
) :is(.lead, .page-head-context, .muted) {
  color: var(--unified-muted);
}

:is(
  #page-profile,
  #page-profile-terms,
  #page-profile-coach-request,
  #page-support,
  #page-support-new,
  #page-support-ticket,
  #page-billing,
  #page-billing-payment,
  #page-billing-manual,
  #page-my-exercises,
  #page-my-exercise-form,
  #page-plans-new,
  #page-plans-active,
  #page-plan-detail,
  #page-plan-assignee-comments,
  #page-plan-session,
  #page-plan-session-pick,
  #page-coach,
  #page-coach-day,
  #page-coach-students,
  #page-coach-student-new,
  #page-coach-student-edit,
  #page-coach-student-plans,
  #page-workout-hub,
  #page-workout-session,
  #page-search,
  #page-favorites
) :is(
  .card,
  .search-top-filter-card,
  .search-active-filters,
  .profile-identity-card,
  .profile-action-row,
  .profile-version-card,
  .profile-account-card,
  .terms-card,
  .support-home-hero,
  .support-new-card,
  .support-chat-card,
  .billing-section,
  .billing-active,
  .billing-product,
  .billing-transaction,
  .billing-method,
  .billing-manual-card,
  .plan-summary-card,
  .plan-session-add-panel,
  .plan-source-tabs,
  .workout-tile-card,
  .coach-student-compact-card,
  .coach-students-list-card,
  .coach-student-plan-row,
  .my-ex-hub-actions,
  .my-ex-optional-details,
  .my-ex-composite-panel
) {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  border: 1px solid var(--unified-card-border);
  border-radius: calc(var(--radius) + 0.14rem);
  background: var(--unified-card-bg);
  box-shadow:
    0 16px 38px rgba(0, 0, 0, 0.23),
    inset 0 1px 0 rgba(255, 255, 255, 0.055);
}

:is(
  #page-profile,
  #page-profile-terms,
  #page-profile-coach-request,
  #page-support,
  #page-support-new,
  #page-support-ticket,
  #page-billing,
  #page-billing-payment,
  #page-billing-manual,
  #page-my-exercises,
  #page-my-exercise-form,
  #page-plans-new,
  #page-plans-active,
  #page-plan-detail,
  #page-plan-assignee-comments,
  #page-plan-session,
  #page-plan-session-pick,
  #page-coach,
  #page-coach-day,
  #page-coach-students,
  #page-coach-student-new,
  #page-coach-student-edit,
  #page-coach-student-plans,
  #page-workout-hub,
  #page-workout-session,
  #page-search,
  #page-favorites
) :is(
  .card,
  .search-top-filter-card,
  .search-active-filters,
  .profile-identity-card,
  .profile-action-row,
  .profile-version-card,
  .profile-account-card,
  .terms-card,
  .support-home-hero,
  .support-new-card,
  .support-chat-card,
  .billing-section,
  .billing-active,
  .billing-product,
  .billing-transaction,
  .billing-method,
  .billing-manual-card,
  .plan-summary-card,
  .plan-session-add-panel,
  .workout-tile-card,
  .coach-student-compact-card,
  .coach-students-list-card,
  .coach-student-plan-row,
  .my-ex-composite-panel
)::before {
  content: "";
  position: absolute;
  inset-inline: 0.85rem;
  top: 0;
  z-index: -1;
  height: 1px;
  border-radius: 999px;
  background: linear-gradient(90deg, transparent, rgb(var(--accent-rgb) / 0.22), rgb(var(--accent-rgb) / 0.28), transparent);
}

:is(
  #page-profile,
  #page-profile-terms,
  #page-profile-coach-request,
  #page-support-new,
  #page-billing-manual,
  #page-my-exercise-form,
  #page-plans-new,
  #page-plan-detail,
  #page-plan-assignee-comments,
  #page-plan-session,
  #page-plan-session-pick,
  #page-coach,
  #page-coach-day,
  #page-coach-students,
  #page-coach-student-new,
  #page-coach-student-edit,
  #page-search,
  #page-favorites
) :is(input:not([type="checkbox"]):not([type="radio"]):not([type="file"]), textarea, select) {
  border-color: var(--unified-soft-border);
  border-radius: 0.76rem;
  background-color: rgba(19, 18, 26, 0.24);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.035);
}

:is(
  #page-profile,
  #page-profile-terms,
  #page-profile-coach-request,
  #page-support-new,
  #page-billing-manual,
  #page-my-exercise-form,
  #page-plans-new,
  #page-plan-detail,
  #page-plan-assignee-comments,
  #page-plan-session,
  #page-plan-session-pick,
  #page-coach,
  #page-coach-day,
  #page-coach-students,
  #page-coach-student-new,
  #page-coach-student-edit,
  #page-search,
  #page-favorites
) label {
  font-weight: 820;
  color: color-mix(in srgb, var(--text) 92%, var(--muted));
}

:is(#page-search, #page-favorites, #page-plan-session-pick) .search-top-filter-card {
  padding: 0.78rem;
}

:is(#page-search, #page-favorites, #page-plan-session-pick) .search-active-filters {
  padding: 0.68rem;
}

:is(#page-search, #page-favorites, #page-plan-session, #page-plan-session-pick, #page-my-exercise-form) .ex-card {
  border-color: var(--unified-soft-border);
  background: var(--card);
}

@media (min-width: 1024px) {
  :is(#page-search, #page-favorites) .search-results .ex-card {
    block-size: 9.65rem;
  }

  :is(#page-search, #page-favorites) .search-results .ex-card-inner {
    grid-template-columns: 5.7rem minmax(0, 1fr);
    gap: 0.62rem;
    padding: 0.62rem;
  }

  :is(#page-search, #page-favorites) .search-results .ex-card-sub {
    margin-bottom: 0.24rem;
  }

  :is(#page-search, #page-favorites) .search-results .ex-card-meta {
    margin-bottom: 0.34rem;
  }

  :is(#page-search, #page-favorites) .search-results .ex-card .tag-row {
    flex-direction: row;
    align-items: flex-start;
    align-content: flex-start;
    flex-wrap: wrap;
    gap: 0.24rem;
    block-size: 2.7rem;
    max-block-size: 2.7rem;
    margin-bottom: 0;
  }

  :is(#page-search, #page-favorites) .search-results .ex-card .tag-row .tag-chip {
    flex: 0 1 auto;
    max-inline-size: 100%;
    min-block-size: 1.18rem;
    padding: 0.11rem 0.42rem;
    font-size: 0.65rem;
    line-height: 1.2;
  }
}

:is(#page-workout-hub, #page-workout-session, #page-plans-active, #page-plan-detail) :is(.plan-summary-card, .workout-tile-card) {
  border-radius: calc(var(--radius) + 0.08rem);
}

:is(#page-support, #page-support-new, #page-support-ticket) :is(.support-home-new, #btn-support-start, #btn-support-chat-send),
:is(#page-billing, #page-billing-payment, #page-billing-manual) :is(.billing-product-action button, #btn-billing-submit),
:is(#page-my-exercise-form, #page-plans-new, #page-plan-detail, #page-plan-session, #page-coach, #page-coach-day, #page-coach-student-new, #page-coach-student-edit) :is(button:not(.auth-terms-link):not(.secondary):not(.danger-outline):not(.app-toolbar-back):not(.btn-back):not(.plan-source-tab):not(.plan-session-save-btn):not(.my-ex-composite-icon-btn):not(.ex-fav-btn):not(.ex-modal-close):not(.my-ex-composite-retry):not(.ai-plan-focus-retry):not(.ai-plan-requests-page-btn):not(.search-scroll-retry)) {
  min-height: 2.72rem;
  border-radius: var(--radius);
}

:is(#page-profile, #page-support, #page-billing, #page-my-exercises, #page-workout-hub) :is(.profile-action-icon, .billing-method-icon, .portal-tile-icon, .coach-student-new-cta-icon) {
  background: color-mix(in srgb, var(--accent) 8%, var(--control-bg));
  border: 1px solid var(--control-line);
}

html[data-theme="light"] :is(
  #page-profile,
  #page-profile-terms,
  #page-profile-coach-request,
  #page-support,
  #page-support-new,
  #page-support-ticket,
  #page-billing,
  #page-billing-payment,
  #page-billing-manual,
  #page-my-exercises,
  #page-my-exercise-form,
  #page-plans-new,
  #page-plans-active,
  #page-plan-detail,
  #page-plan-assignee-comments,
  #page-plan-session,
  #page-plan-session-pick,
  #page-coach,
  #page-coach-day,
  #page-coach-students,
  #page-coach-student-new,
  #page-coach-student-edit,
  #page-coach-student-plans,
  #page-workout-hub,
  #page-workout-session,
  #page-search,
  #page-favorites
) {
  --unified-card-border: var(--shell-line);
  --unified-card-bg: var(--card);
  --unified-inner-bg: var(--surface-strong);
  --unified-soft-border: var(--control-line);
  --unified-muted: color-mix(in srgb, var(--muted) 82%, var(--text));
}

html[data-theme="light"] :is(
  #page-profile,
  #page-profile-terms,
  #page-profile-coach-request,
  #page-support-new,
  #page-billing-manual,
  #page-my-exercise-form,
  #page-plans-new,
  #page-plan-detail,
  #page-plan-assignee-comments,
  #page-plan-session,
  #page-plan-session-pick,
  #page-coach,
  #page-coach-day,
  #page-coach-students,
  #page-coach-student-new,
  #page-coach-student-edit,
  #page-search,
  #page-favorites
) :is(input:not([type="checkbox"]):not([type="radio"]):not([type="file"]), textarea, select) {
  background-color: rgba(255, 255, 255, 0.82);
}

#page-my-exercise-form :is(.my-ex-kind-tab, .my-ex-composite-empty, .my-ex-composite-picked, .my-ex-step-row, .select-multi) {
  border-color: var(--unified-soft-border);
  background: var(--unified-inner-bg);
}

#page-my-exercise-form .my-ex-kind-tab.is-on {
  border-color: rgb(var(--accent-rgb) / 0.72);
  background: color-mix(in srgb, var(--accent) 10%, var(--unified-inner-bg));
  color: var(--text);
}

#page-my-exercise-form .my-ex-composite-picked {
  background: color-mix(in srgb, var(--accent) 8%, var(--unified-inner-bg));
}

#page-my-exercise-form .my-ex-composite-icon-btn {
  border-color: rgb(var(--accent-rgb) / 0.34);
  background: var(--control-bg);
  color: var(--text);
}

#page-my-exercise-form .my-ex-composite-icon-add {
  border-color: rgba(34, 211, 238, 0.72);
  background: rgb(var(--accent-rgb) / 0.92);
  color: #fff;
}

#page-my-exercise-form .my-ex-composite-icon-danger {
  border-color: rgba(248, 113, 113, 0.62);
  background: rgba(127, 29, 29, 0.9);
  color: #fff;
}

html[data-theme="light"] #page-my-exercise-form :is(.my-ex-kind-tab, .my-ex-composite-empty, .my-ex-composite-picked, .my-ex-step-row, .select-multi) {
  border-color: var(--unified-soft-border);
  background: var(--unified-inner-bg);
}

html[data-theme="light"] #page-my-exercise-form .my-ex-kind-tab.is-on,
html[data-theme="light"] #page-my-exercise-form .my-ex-composite-picked {
  background: color-mix(in srgb, var(--accent) 8%, var(--card));
}

html[data-theme="light"] #page-my-exercise-form .my-ex-composite-icon-btn {
  background: rgba(255, 255, 255, 0.96);
  color: #211f2a;
}

html[data-theme="light"] #page-my-exercise-form .my-ex-composite-icon-add {
  background: var(--accent-strong);
  color: #fff;
}

html[data-theme="light"] #page-my-exercise-form .my-ex-composite-icon-danger {
  background: #dc2626;
  color: #fff;
}

html[data-theme="light"] #page-profile .profile-shell {
  gap: 0.62rem;
}

html[data-theme="light"] #page-profile :is(
  .profile-identity-card,
  .profile-action-row,
  .profile-version-card,
  .profile-account-card
) {
  border-color: var(--shell-line);
  background: var(--card);
  box-shadow: var(--shadow-sm);
}

html[data-theme="light"] #page-profile :is(.profile-action-icon, .profile-avatar) {
  color: var(--accent-strong);
  border-color: rgb(var(--accent-strong-rgb) / 0.24);
  background: color-mix(in srgb, var(--accent) 8%, var(--card));
  box-shadow: none;
}

html[data-theme="dark"] #btn-profile-support,
html[data-theme="dark"] #btn-profile-support .profile-action-copy strong,
html[data-theme="dark"] #btn-profile-support .profile-action-copy small {
  color: var(--text) !important;
}

html[data-theme="dark"] #btn-profile-support:hover,
html[data-theme="dark"] #btn-profile-support:focus-visible {
  color: var(--text) !important;
}

html[data-theme="dark"] #page-support .support-home-kicker,
html[data-theme="dark"] #page-support .support-home-hero h2,
html[data-theme="dark"] #page-support .support-home-hero p {
  color: var(--text);
}

html[data-theme="dark"] #page-support .support-home-hero p {
  color: var(--unified-muted);
}

html[data-theme="dark"] a.support-thread-row {
  color: var(--text);
  border-color: var(--unified-soft-border);
  background: var(--card);
}

html[data-theme="dark"] a.support-thread-row .support-thread-row-main strong,
html[data-theme="dark"] a.support-thread-row .support-thread-row-main span {
  color: var(--text);
}

html[data-theme="dark"] a.support-thread-row .support-thread-row-main span {
  color: var(--unified-muted);
  opacity: 1;
}

#page-search .search-active-filters {
  position: sticky;
  top: 0.4rem;
  z-index: 46;
  overflow: visible;
}

#page-plan-session-pick .plan-pick-sticky-controls {
  position: sticky;
  top: 0.35rem;
  z-index: 46;
  overflow: visible;
}

#page-plan-session-pick .plan-pick-active-filters {
  position: relative;
  top: auto;
  z-index: auto;
  overflow: visible;
}

:is(#page-plan-session, #page-plan-session-pick) :is(.plan-session-workspace, .plan-session-pick-body) {
  border-color: var(--unified-card-border);
  background: var(--unified-card-bg);
}

#page-plan-session .plan-session-add-panel {
  border-color: color-mix(in srgb, var(--control-line) 86%, var(--accent-2));
  background: color-mix(in srgb, var(--surface-strong) 76%, transparent);
}

#page-plan-session-pick .plan-pick-sticky-controls {
  border: 1px solid color-mix(in srgb, var(--control-line) 82%, transparent);
  background: color-mix(in srgb, var(--surface-strong) 88%, transparent);
  box-shadow: 0 0.7rem 1.45rem color-mix(in srgb, var(--ink) 10%, transparent);
}

#page-plan-session-pick .plan-pick-filter-card {
  border-color: var(--shell-line);
  background: color-mix(in srgb, var(--surface) 88%, transparent);
  box-shadow: 0 0.7rem 1.7rem color-mix(in srgb, var(--ink) 7%, transparent);
}

#btn-plan-pick-open-search-sheet {
  display: none !important;
}

html[data-theme="light"] :is(#page-search, #page-favorites, #page-plan-session, #page-plan-session-pick) {
  --unified-card-border: var(--shell-line);
  --unified-card-bg: var(--card);
  --unified-soft-border: var(--control-line);
}

html[data-theme="light"] :is(#page-search, #page-favorites, #page-plan-session, #page-plan-session-pick) :is(.search-top-filter-card, .search-active-filters, .search-results-only-card, .plan-session-workspace, .plan-session-pick-body) {
  border-color: var(--shell-line);
  background: var(--card);
  box-shadow: var(--shadow-sm);
}

html[data-theme="light"] #page-plan-session .plan-session-add-panel,
html[data-theme="light"] #page-plan-session-pick .plan-pick-sticky-controls {
  border-color: var(--shell-line);
  background: var(--card);
  box-shadow: var(--shadow-sm);
}

html[data-theme="light"] :is(#page-search, #page-favorites, #page-plan-session-pick) .search-active-filters.is-empty {
  background: rgba(255, 255, 255, 0.9);
}

html[data-theme="light"] :is(#page-search, #page-favorites, #page-plan-session, #page-plan-session-pick) .search-top-q-input {
  border-color: rgba(203, 213, 225, 0.84);
  background: rgba(255, 255, 255, 0.92);
}

html[data-theme="light"] #page-plan-session .plan-session-inline-search input {
  border-color: rgba(203, 213, 225, 0.84);
  background: rgba(255, 255, 255, 0.92);
}

html[data-theme="light"] :is(#page-search, #page-favorites, #page-plan-session-pick) .muscle-filter-map--lyfta .muscle-filter-chip:not(.is-active) {
  border-color: rgba(163, 160, 173, 0.42);
  background: var(--surface-strong) !important;
  box-shadow: none;
}

html[data-theme="light"] :is(#page-search, #page-favorites, #page-plan-session-pick) .muscle-filter-map--lyfta .muscle-filter-chip:not(.is-active) .muscle-filter-chip-icon {
  background: rgba(255, 255, 255, 0.68);
  box-shadow: inset 0 0 0 1px rgba(163, 160, 173, 0.22);
}

html[data-theme="light"] :is(#page-search, #page-favorites, #page-plan-session-pick) .muscle-filter-map--lyfta .muscle-filter-chip.is-active .muscle-filter-chip-icon {
  background: rgba(255, 255, 255, 0.68);
  box-shadow: inset 0 0 0 1px rgba(163, 160, 173, 0.22);
}

html[data-theme="light"] :is(#page-search, #page-favorites, #page-plan-session-pick) .muscle-filter-map--lyfta .muscle-filter-chip.is-active .muscle-filter-chip-icon img {
  filter: none !important;
  opacity: 1;
  mix-blend-mode: normal;
}

html[data-theme="light"] :is(#page-search, #page-favorites, #page-plan-session, #page-plan-session-pick) .ex-card {
  border-color: var(--shell-line);
  background: var(--card);
  box-shadow: none;
}

html[data-theme="light"] :is(#page-search, #page-favorites, #page-plan-session, #page-plan-session-pick) .ex-card:hover {
  border-color: rgb(var(--accent-strong-rgb) / 0.22);
  box-shadow: 0 12px 28px rgba(19, 18, 26, 0.09);
}

.ai-plan-panel {
  display: grid;
  gap: 1rem;
  border: 1px solid var(--unified-card-border, rgba(163, 160, 173, 0.22));
  border-radius: 8px;
  padding: 1rem;
  background: var(--card) !important;
  box-shadow: var(--shadow-sm);
}

.ai-plan-mode-tabs {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.42rem;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  padding: 0.34rem;
  border: 1px solid color-mix(in srgb, var(--control-line) 82%, var(--accent));
  border-radius: 8px;
  background: color-mix(in srgb, var(--surface-1) 86%, transparent);
  overflow: hidden;
}

.ai-plan-mode-tab {
  min-width: 0;
  max-width: 100%;
  min-height: 2.36rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.28rem;
  padding-inline: 0.38rem;
  border-radius: 7px;
  color: var(--muted);
  font-size: 0.82rem;
  font-weight: 900;
  line-height: 1.35;
  text-align: center;
  text-decoration: none;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.ai-plan-mode-tab.is-active {
  color: color-mix(in srgb, var(--accent) 42%, var(--text));
  background:
    linear-gradient(145deg, color-mix(in srgb, var(--accent) 12%, transparent), transparent 58%),
    var(--surface-2);
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--accent) 24%, var(--control-line));
}

.ai-plan-title-row {
  align-items: center;
  gap: 0.52rem;
}

.ai-plan-title-icon {
  width: 2.1rem;
  height: 2.1rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(255, 122, 26, 0.34);
  border-radius: 8px;
  background: #16151d;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.12);
}

.ai-plan-title-icon img {
  width: 1.25rem;
  height: 1.25rem;
  object-fit: contain;
}

html[data-theme="light"] .ai-plan-title-icon {
  border-color: rgb(var(--accent-rgb) / 0.24);
  background:
    linear-gradient(135deg, rgba(255, 247, 237, 0.94), rgba(255, 237, 213, 0.64));
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.78),
    0 8px 18px rgba(154, 52, 18, 0.08);
}

html[data-theme="light"] .ai-plan-title-icon img {
  filter: brightness(0) saturate(100%) invert(18%) sepia(24%) saturate(2245%) hue-rotate(344deg)
    brightness(88%) contrast(96%);
  opacity: 0.9;
}

.ai-plan-quick-panel {
  gap: 0.9rem;
}

.ai-plan-quick-state {
  display: inline-flex;
  align-items: center;
  min-height: 1.85rem;
  border: 1px solid rgba(250, 204, 21, 0.28);
  border-radius: 8px;
  padding: 0.18rem 0.55rem;
  color: #92400e;
  background: rgba(254, 243, 199, 0.76);
  font-size: 0.72rem;
  font-weight: 900;
  white-space: nowrap;
}

.ai-plan-quick-state.is-ready {
  border-color: rgba(34, 197, 94, 0.28);
  color: #166534;
  background: rgba(220, 252, 231, 0.78);
}

.ai-plan-quick-state.is-missing {
  border-color: rgba(239, 68, 68, 0.24);
  color: #991b1b;
  background: rgba(254, 226, 226, 0.72);
}

.ai-plan-quick-summary {
  min-height: 3.1rem;
}

.ai-plan-quick-profile-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
}

.ai-plan-quick-profile-chip {
  display: inline-flex;
  align-items: center;
  min-height: 2.2rem;
  border: 1px solid color-mix(in srgb, var(--accent) 22%, var(--control-line));
  border-radius: 8px;
  padding: 0.28rem 0.62rem;
  color: var(--text);
  background: color-mix(in srgb, var(--surface-2) 92%, transparent);
  font-size: 0.78rem;
  font-weight: 850;
}

.ai-plan-quick-presets {
  display: grid;
  gap: 0.72rem;
}

.ai-plan-quick-preset-group {
  display: grid;
  gap: 0.42rem;
}

.ai-plan-quick-preset-title {
  color: var(--muted);
  font-size: 0.76rem;
  font-weight: 900;
}

.ai-plan-session-count-group {
  display: grid;
  gap: 0.48rem;
}

.ai-plan-session-counts {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(7.5rem, 1fr));
  gap: 0.5rem;
}

.ai-plan-session-count-item {
  display: grid;
  gap: 0.32rem;
  min-width: 0;
  color: var(--muted);
  font-size: 0.72rem;
  font-weight: 850;
}

.ai-plan-session-count-item select {
  min-height: 2.7rem;
}

.ai-plan-quick-select {
  min-height: 2.78rem;
  border-color: color-mix(in srgb, var(--accent) 42%, var(--control-line));
  color: color-mix(in srgb, var(--accent) 42%, var(--text));
  background:
    linear-gradient(145deg, color-mix(in srgb, var(--accent) 13%, transparent), transparent 58%),
    var(--surface-2);
  font-size: 0.86rem;
  font-weight: 900;
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--accent) 18%, transparent);
}

.ai-plan-quick-more {
  border: 1px solid color-mix(in srgb, var(--control-line) 84%, var(--accent));
  border-radius: 8px;
  background: color-mix(in srgb, var(--surface-1) 86%, transparent);
}

.ai-plan-quick-more summary {
  min-height: 2.65rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0.45rem 0.74rem;
  color: color-mix(in srgb, var(--accent) 38%, var(--text));
  font-size: 0.82rem;
  font-weight: 900;
  cursor: pointer;
}

.ai-plan-quick-more-body {
  display: grid;
  gap: 0.58rem;
  border-top: 1px solid color-mix(in srgb, var(--control-line) 82%, transparent);
  padding: 0.72rem;
}

.ai-plan-quick-more-body label {
  margin-top: 0;
  color: var(--muted);
  font-size: 0.76rem;
  font-weight: 900;
}

.ai-plan-quick-focus-trigger {
  width: 100%;
  min-height: 2.78rem;
  justify-content: center;
  border-color: color-mix(in srgb, var(--accent) 32%, var(--control-line));
  color: color-mix(in srgb, var(--accent) 38%, var(--text));
  background: var(--surface-2) !important;
  font-weight: 900;
}

.ai-plan-quick-focus-panel {
  width: min(100%, 31rem);
  max-height: min(82vh, 42rem);
  overflow: auto;
}

.ai-plan-quick-focus-list {
  max-height: 24rem;
  overflow: auto;
  padding-inline-end: 0.1rem;
}

.ai-plan-quick-focus-actions {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 0.55rem;
}

.ai-plan-quick-missing {
  display: grid;
  gap: 0.22rem;
  border: 1px dashed rgba(239, 68, 68, 0.32);
  border-radius: 8px;
  padding: 0.74rem 0.82rem;
  color: #991b1b;
  background: rgba(254, 242, 242, 0.62);
}

.ai-plan-quick-missing strong {
  color: inherit;
  font-size: 0.84rem;
  font-weight: 900;
  line-height: 1.55;
}

.ai-plan-quick-missing span {
  color: color-mix(in srgb, #991b1b 78%, var(--muted));
  font-size: 0.76rem;
  font-weight: 760;
  line-height: 1.75;
}

.ai-plan-quick-profile-link {
  min-height: 2.42rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  justify-self: start;
  border: 1px solid rgba(239, 68, 68, 0.32);
  border-radius: 8px;
  padding: 0.38rem 0.78rem;
  color: #991b1b;
  background: rgba(255, 255, 255, 0.58);
  font-size: 0.78rem;
  font-weight: 900;
  text-decoration: none;
}

.ai-plan-quick-actions button:disabled {
  cursor: not-allowed;
  opacity: 0.62;
}

.ai-plan-quick-step textarea {
  min-height: 9.5rem;
}

.ai-plan-secondary-link {
  min-height: 2.75rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(163, 160, 173, 0.36);
  border-radius: 8px;
  padding: 0.52rem 0.86rem;
  color: var(--text);
  background: var(--surface-2);
  font-size: 0.86rem;
  font-weight: 850;
  text-decoration: none;
}

.ai-plan-requests-create--full {
  border: 1px solid color-mix(in srgb, var(--accent) 28%, var(--control-line));
  color: var(--accent);
  background:
    linear-gradient(135deg, color-mix(in srgb, var(--accent) 12%, transparent), transparent 62%),
    color-mix(in srgb, var(--surface) 94%, var(--accent)) !important;
  text-decoration: none;
}

.ai-plan-requests-panel {
  display: grid;
  gap: 0.82rem;
  margin-top: 0;
  border: 1px solid color-mix(in srgb, var(--control-line) 76%, var(--accent));
  border-radius: 8px;
  padding: 1rem;
  background:
    linear-gradient(145deg, color-mix(in srgb, var(--accent) 12%, transparent), transparent 48%),
    linear-gradient(215deg, color-mix(in srgb, #f59e0b 10%, transparent), transparent 42%),
    color-mix(in srgb, var(--card) 98%, transparent) !important;
  box-shadow:
    0 18px 38px color-mix(in srgb, var(--ink) 10%, transparent),
    inset 0 1px 0 color-mix(in srgb, #ffffff 8%, transparent);
}

.ai-plan-requests-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.65rem;
}

.ai-plan-requests-actions {
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  gap: 0.45rem;
  flex-wrap: wrap;
  min-width: 0;
}

.ai-plan-requests-create {
  width: auto !important;
  min-width: 0;
  max-width: 100%;
  min-height: 2.45rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.42rem;
  margin: 0;
  padding: 0.34rem 0.78rem;
  border-radius: 8px;
  font-size: 0.78rem;
  font-weight: 900;
  white-space: nowrap;
  overflow: hidden;
}

.ai-plan-requests-create span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
}

.ai-plan-requests-refresh {
  width: 2.45rem !important;
  min-height: 2.45rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin: 0;
  padding: 0;
  border-radius: 8px;
  border-color: color-mix(in srgb, var(--control-line) 84%, var(--accent)) !important;
  background: color-mix(in srgb, var(--surface-2) 94%, transparent) !important;
  color: var(--text) !important;
}

.ai-plan-requests-refresh svg {
  width: 1.08rem;
  height: 1.08rem;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.ai-plan-requests-list {
  display: grid;
  gap: 0.54rem;
}

.ai-plan-requests-filters {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  min-height: 2.2rem;
  max-height: none;
  margin: 0 0 0.08rem;
  direction: rtl;
}

.ai-plan-requests-hidden-filter {
  flex: 0 0 auto;
}

.ai-plan-requests-empty {
  display: grid;
  align-content: center;
  justify-items: center;
  min-height: 13.5rem;
  gap: 0.82rem;
  padding: 1.45rem 0.95rem;
  border: 1px dashed color-mix(in srgb, var(--control-line) 78%, var(--accent));
  border-radius: 8px;
  background:
    linear-gradient(145deg, color-mix(in srgb, var(--accent) 9%, transparent), transparent 48%),
    color-mix(in srgb, var(--surface-2) 86%, transparent);
  text-align: center;
}

.ai-plan-requests-empty-icon {
  width: 3.2rem;
  height: 3.2rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 8px;
  border: 1px solid color-mix(in srgb, var(--accent) 30%, var(--control-line));
  background: color-mix(in srgb, var(--surface) 94%, transparent);
}

.ai-plan-requests-empty-icon img {
  width: 1.85rem;
  height: 1.85rem;
  object-fit: contain;
  filter: brightness(0) saturate(1) invert(35%) sepia(91%) saturate(1396%) hue-rotate(357deg) brightness(96%) contrast(94%);
}

.ai-plan-requests-empty-copy {
  display: grid;
  gap: 0.28rem;
  max-width: 23rem;
}

.ai-plan-requests-empty-copy strong {
  color: var(--text);
  font-size: 0.94rem;
  font-weight: 900;
  line-height: 1.55;
}

.ai-plan-requests-empty-copy span {
  color: var(--muted);
  font-size: 0.78rem;
  font-weight: 700;
  line-height: 1.75;
}

.ai-plan-requests-empty-action {
  justify-self: center;
  margin-top: 0.45rem;
}

.ai-plan-request-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 0.62rem;
  min-height: 4.35rem;
  border: 1px solid rgba(163, 160, 173, 0.22);
  border-radius: 8px;
  padding: 0.68rem 0.72rem;
  color: var(--text);
  background:
    linear-gradient(135deg, color-mix(in srgb, var(--accent) 4%, transparent), transparent 52%),
    var(--surface-2) !important;
  text-align: right;
  text-decoration: none;
}

.ai-plan-request-row[data-ai-plan-draft-open] {
  cursor: pointer;
}

.ai-plan-request-row[data-ai-plan-draft-open]:hover,
.ai-plan-request-row[data-ai-plan-draft-open]:focus-visible {
  border-color: rgb(var(--accent-rgb) / 0.38);
  box-shadow: 0 10px 22px rgba(19, 18, 26, 0.08);
}

.ai-plan-request-open {
  min-width: 0;
  display: block;
  color: inherit;
  text-decoration: none;
}

.ai-plan-request-open:hover .ai-plan-request-title,
.ai-plan-request-open:focus-visible .ai-plan-request-title {
  color: var(--accent);
}

.ai-plan-request-row--hidden {
  opacity: 0.82;
}

.ai-plan-request-row--draft {
  border-style: dashed;
  background:
    linear-gradient(135deg, color-mix(in srgb, var(--accent) 7%, transparent), transparent 54%),
    var(--surface-2) !important;
}

.ai-plan-request-row--done {
  border-color: rgba(34, 197, 94, 0.22);
  background:
    linear-gradient(135deg, rgba(34, 197, 94, 0.1), transparent 54%),
    var(--surface-2) !important;
}

.ai-plan-request-row--review {
  border-color: rgba(236, 72, 153, 0.22);
  background:
    linear-gradient(135deg, rgba(236, 72, 153, 0.1), transparent 54%),
    var(--surface-2) !important;
}

.ai-plan-request-row--loading {
  position: relative;
  overflow: hidden;
}

.ai-plan-request-row--cancelled {
  opacity: 0.82;
}

.ai-plan-request-row--loading::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(
    90deg,
    transparent,
    color-mix(in srgb, var(--accent) 14%, transparent),
    transparent
  );
  transform: translateX(110%);
  animation: ai-plan-request-shimmer 1.7s ease-in-out infinite;
}

.ai-plan-request-main {
  min-width: 0;
  display: grid;
  gap: 0.18rem;
}

.ai-plan-request-title {
  overflow: hidden;
  color: var(--text);
  font-size: 0.84rem;
  font-weight: 850;
  line-height: 1.45;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.ai-plan-request-meta {
  color: var(--muted);
  font-size: 0.7rem;
  font-weight: 700;
  line-height: 1.55;
}

.ai-plan-request-detail {
  color: color-mix(in srgb, var(--muted) 82%, var(--text));
  font-size: 0.66rem;
  font-weight: 700;
  line-height: 1.55;
}

.ai-plan-request-side {
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  gap: 0.34rem;
}

.ai-plan-request-side .plan-vis-btn {
  inline-size: 1.85rem !important;
  block-size: 1.85rem;
  min-width: 1.85rem;
  min-height: 1.85rem;
  flex: 0 0 1.85rem;
  padding: 0.28rem !important;
}

.ai-plan-request-status {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.3rem;
  min-height: 1.72rem;
  border-radius: 8px;
  padding: 0.14rem 0.48rem;
  border: 1px solid rgba(250, 204, 21, 0.28);
  color: #92400e;
  background: rgba(254, 243, 199, 0.76);
  font-size: 0.68rem;
  font-weight: 900;
  white-space: nowrap;
}

.ai-plan-request-status--done {
  border-color: rgba(34, 197, 94, 0.28);
  color: #166534;
  background: rgba(220, 252, 231, 0.78);
}

.ai-plan-request-status--hidden {
  border-color: rgba(100, 116, 139, 0.3);
  color: #4a4656;
  background: rgba(226, 232, 240, 0.82);
}

.ai-plan-request-status--draft {
  border-color: rgb(var(--accent-rgb) / 0.3);
  color: #9a3412;
  background: rgba(255, 237, 213, 0.78);
}

.ai-plan-request-status--loading {
  border-color: rgb(var(--accent-rgb) / 0.28);
  color: #9a3412;
  background: rgba(255, 237, 213, 0.72);
}

.ai-plan-request-status--cancelled {
  border-color: rgba(100, 116, 139, 0.3);
  color: #4a4656;
  background: rgba(226, 232, 240, 0.82);
}

.ai-plan-request-status--review {
  border-color: rgba(236, 72, 153, 0.24);
  color: #9d174d;
  background: rgba(252, 231, 243, 0.78);
}

.ai-plan-request-spinner {
  width: 0.72rem;
  height: 0.72rem;
  flex: 0 0 auto;
  border-radius: 999px;
  border: 2px solid currentColor;
  border-inline-start-color: transparent;
  opacity: 0.9;
  animation: ai-plan-request-spin 0.8s linear infinite;
}

@keyframes ai-plan-request-spin {
  to {
    transform: rotate(360deg);
  }
}

@keyframes ai-plan-request-shimmer {
  0% {
    transform: translateX(110%);
  }
  52%,
  100% {
    transform: translateX(-110%);
  }
}

.ai-plan-request-delete {
  width: 1.92rem !important;
  height: 1.92rem;
  min-height: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  margin: 0;
  padding: 0;
  border: 1px solid rgba(239, 68, 68, 0.2);
  border-radius: 8px;
  color: #b91c1c;
  background: rgba(254, 226, 226, 0.72);
  box-shadow: none;
}

.ai-plan-request-delete:hover,
.ai-plan-request-delete:focus-visible {
  border-color: rgba(239, 68, 68, 0.36);
  background: rgba(254, 202, 202, 0.86);
  transform: none;
}

.ai-plan-request-delete svg {
  width: 1rem;
  height: 1rem;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.ai-plan-requests-pager {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.6rem;
  padding: 0.25rem 0.1rem 0;
}

.ai-plan-requests-page-info {
  color: var(--muted);
  font-size: 0.72rem;
  font-weight: 800;
}

.ai-plan-requests-page-actions {
  display: inline-flex;
  align-items: center;
  gap: 0.42rem;
}

.ai-plan-requests-page-btn {
  width: auto;
  min-height: 2.1rem;
  padding: 0.35rem 0.72rem;
  border: 1px solid color-mix(in srgb, var(--accent) 28%, var(--control-line));
  border-radius: 0.55rem;
  background: color-mix(in srgb, var(--accent) 8%, var(--surface));
  color: var(--accent);
  font-size: 0.74rem;
  font-weight: 850;
  box-shadow: none;
}

.ai-plan-requests-page-btn:hover,
.ai-plan-requests-page-btn:focus-visible {
  background: color-mix(in srgb, var(--accent) 14%, var(--surface));
  transform: none;
}

.ai-plan-requests-page-btn:disabled {
  opacity: 0.48;
  cursor: not-allowed;
}

.ai-plan-progress-row,
.ai-plan-actions {
  display: flex;
  align-items: center;
  gap: 0.6rem;
}

.ai-plan-progress-row {
  justify-content: space-between;
}

.plan-ai-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  width: 1.42rem;
  height: 1.42rem;
  border: 1px solid rgb(var(--accent-rgb) / 0.28);
  border-radius: 999px;
  color: #9a3412;
  background: rgba(255, 247, 237, 0.82);
  white-space: nowrap;
}

.plan-ai-badge-icon {
  display: block;
  width: 0.92rem;
  height: 0.92rem;
  object-fit: contain;
}

.ai-plan-disclaimer-modal {
  position: fixed;
  inset: 0;
  z-index: 10070;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: max(1rem, env(safe-area-inset-top)) 1rem max(1rem, env(safe-area-inset-bottom));
}

.ai-plan-disclaimer-modal.hidden {
  display: none !important;
}

.ai-plan-disclaimer-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(7, 6, 10, 0.66);
  backdrop-filter: blur(8px);
}

.ai-plan-disclaimer-panel {
  position: relative;
  width: min(100%, 25rem);
  display: grid;
  gap: 0.78rem;
  direction: rtl;
  border: 1px solid rgba(14, 165, 233, 0.26);
  border-radius: 8px;
  padding: 1rem;
  color: var(--text);
  background: var(--card) !important;
  box-shadow: 0 22px 54px rgba(0, 0, 0, 0.38);
}

.ai-plan-disclaimer-head {
  display: flex;
  align-items: center;
  gap: 0.72rem;
}

.ai-plan-disclaimer-mark {
  width: 2.75rem;
  height: 2.75rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  border: 1px solid rgb(var(--accent-rgb) / 0.26);
  border-radius: 8px;
  background: rgba(255, 247, 237, 0.16);
}

.ai-plan-disclaimer-mark img {
  width: 1.52rem;
  height: 1.52rem;
  object-fit: contain;
}

.ai-plan-disclaimer-copy {
  display: grid;
  gap: 0.12rem;
  min-width: 0;
}

.ai-plan-disclaimer-brand {
  color: #9a3412;
  font-size: 0.76rem;
  font-weight: 900;
  line-height: 1.3;
}

.ai-plan-disclaimer-title {
  margin: 0;
  color: var(--text);
  font-size: 1.02rem;
  line-height: 1.65;
}

.ai-plan-disclaimer-body {
  display: grid;
  gap: 0.55rem;
  color: var(--muted);
  font-size: 0.9rem;
  line-height: 1.9;
}

.ai-plan-disclaimer-body p {
  margin: 0;
}

.ai-plan-disclaimer-ok {
  width: 100%;
  min-height: 2.78rem;
  margin: 0.18rem 0 0;
}

.ai-plan-step {
  display: grid;
  gap: 0.78rem;
}

.ai-plan-step label {
  display: grid;
  gap: 0.35rem;
  color: var(--text);
  font-size: 0.9rem;
  font-weight: 700;
}

.ai-plan-step input,
.ai-plan-step textarea,
.ai-plan-step select {
  width: 100%;
  min-height: 2.75rem;
  border: 1px solid rgba(163, 160, 173, 0.34);
  border-radius: 8px;
  padding: 0.68rem 0.75rem;
  color: var(--text);
  background: var(--surface-1) !important;
  font: inherit;
}

.ai-plan-step :is(input, textarea, select).ai-plan-input-invalid {
  border-color: rgba(220, 38, 38, 0.78) !important;
  box-shadow: 0 0 0 3px rgba(220, 38, 38, 0.1);
}

.ai-plan-step select.ai-plan-input-invalid + .app-select button.app-select-trigger,
.ai-plan-step select.ai-plan-input-invalid + .app-select button.app-select-trigger:hover,
.ai-plan-step select.ai-plan-input-invalid + .app-select button.app-select-trigger:focus-visible,
.ai-plan-step select.ai-plan-input-invalid + .app-select button.app-select-trigger:active,
.ai-plan-step select.ai-plan-input-invalid + .app-select.is-open button.app-select-trigger {
  border-color: rgba(220, 38, 38, 0.78) !important;
  box-shadow:
    0 0 0 3px rgba(220, 38, 38, 0.1),
    inset 0 1px 0 color-mix(in srgb, #ffffff 5%, transparent) !important;
}

.ai-plan-step select.ai-plan-input-invalid + .app-select .app-select-icon {
  color: #dc2626;
}

.ai-plan-step textarea {
  resize: vertical;
  min-height: 6.5rem;
}

.ai-plan-field-hint {
  display: block;
  margin-top: -0.2rem;
  color: var(--muted);
  font-size: 0.76rem;
  font-weight: 700;
  line-height: 1.7;
  text-align: left;
}

.ai-plan-field-hint-warn {
  color: #b45309;
}

.ai-plan-field-hint-danger {
  color: #b91c1c;
}

.ai-plan-field-grid,
.ai-plan-check-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.7rem;
}

.ai-plan-choice-section {
  display: grid;
  gap: 0.55rem;
}

.ai-plan-choice-section--saved,
.ai-plan-choice-section--source {
  gap: 0.48rem;
  margin-top: 0.1rem;
  padding-bottom: 0.18rem;
}

.ai-plan-choice-title {
  margin: 0;
  color: color-mix(in srgb, var(--text) 90%, var(--muted));
  font-size: 0.86rem;
  font-weight: 850;
  line-height: 1.35;
}

.ai-plan-check-grid--single {
  grid-template-columns: 1fr;
}

.ai-plan-source-layout {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.55rem;
  padding: 0.58rem;
  border: 1px solid color-mix(in srgb, var(--line, rgba(163, 160, 173, 0.24)) 82%, transparent);
  border-radius: 12px;
  background: color-mix(in srgb, var(--surface-1) 78%, var(--app-bg, #0e0d12));
}

.ai-plan-source-base {
  display: contents;
}

.ai-plan-source-option,
.ai-plan-source-free-card {
  min-height: 2.9rem;
  display: flex;
  align-items: center;
  gap: 0.55rem;
  border: 1px solid color-mix(in srgb, var(--line, rgba(163, 160, 173, 0.24)) 82%, transparent);
  border-radius: 8px;
  padding: 0.58rem 0.66rem;
  background: var(--surface-2) !important;
  font-weight: 800;
}

.ai-plan-source-option.is-active,
.ai-plan-source-free-card.is-active {
  border-color: color-mix(in srgb, var(--accent) 46%, rgba(163, 160, 173, 0.24));
  background:
    linear-gradient(145deg, color-mix(in srgb, var(--accent) 10%, transparent), transparent 62%),
    var(--surface-2) !important;
  color: color-mix(in srgb, var(--accent) 42%, var(--text));
}

.ai-plan-source-layout.ai-plan-group-invalid {
  border-color: rgba(220, 38, 38, 0.7);
  box-shadow: 0 0 0 3px rgba(220, 38, 38, 0.1);
}

.ai-plan-source-layout.ai-plan-group-invalid :is(.ai-plan-source-option, .ai-plan-source-free-card) {
  border-color: rgba(220, 38, 38, 0.55);
}

.ai-plan-source-free-card {
  align-items: flex-start;
}

.ai-plan-source-option label {
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 0.55rem;
  flex: 1;
  cursor: pointer;
}

.ai-plan-source-free-copy {
  min-width: 0;
  display: grid;
  gap: 0.18rem;
  flex: 1;
}

.ai-plan-source-free-title {
  line-height: 1.25;
}

.ai-plan-source-free-sub {
  color: var(--muted);
  font-size: 0.72rem;
  font-weight: 650;
  line-height: 1.45;
}

.ai-plan-source-info-btn {
  width: 1.55rem;
  min-width: 1.55rem;
  height: 1.55rem;
  min-height: 1.55rem;
  display: inline-grid;
  place-items: center;
  border-radius: 999px !important;
  border: 1px solid color-mix(in srgb, var(--muted) 35%, transparent) !important;
  padding: 0 !important;
  background: transparent !important;
  color: var(--muted) !important;
  font-family: ui-serif, Georgia, serif;
  font-size: 0.86rem !important;
  font-weight: 900 !important;
  line-height: 1 !important;
  margin-inline-start: auto;
}

.ai-plan-source-info-btn:hover,
.ai-plan-source-info-btn:focus-visible {
  border-color: color-mix(in srgb, var(--accent) 55%, transparent) !important;
  color: var(--accent) !important;
}

.ai-plan-equipment-mode {
  display: block;
}

.ai-plan-equipment-mode label {
  min-height: 2.9rem;
  display: flex;
  align-items: center;
  gap: 0.58rem;
  border: 1px solid color-mix(in srgb, var(--accent) 28%, rgba(163, 160, 173, 0.24));
  border-radius: 8px;
  padding: 0.62rem 0.74rem;
  background:
    linear-gradient(145deg, color-mix(in srgb, var(--accent) 8%, transparent), transparent 62%),
    var(--surface-2) !important;
  font-weight: 850;
}

.ai-plan-equipment-mode input {
  width: 1.1rem;
  min-height: auto;
  height: 1.1rem;
  padding: 0;
}

.ai-plan-check-grid[hidden],
#ai-plan-equipment-list[hidden] {
  display: none !important;
}

.ai-plan-check-grid label {
  min-height: 2.75rem;
  display: flex;
  align-items: center;
  gap: 0.55rem;
  border: 1px solid rgba(163, 160, 173, 0.24);
  border-radius: 8px;
  padding: 0.55rem 0.68rem;
  background: var(--surface-2) !important;
  font-weight: 700;
}

.ai-plan-saved-only-option {
  border-color: color-mix(in srgb, var(--accent-2) 28%, rgba(163, 160, 173, 0.24)) !important;
  background:
    linear-gradient(145deg, color-mix(in srgb, var(--accent-2) 9%, transparent), transparent 58%),
    var(--surface-2) !important;
}

.ai-plan-choice-section.is-disabled {
  opacity: 0.58;
}

.ai-plan-choice-section.is-disabled .ai-plan-choice-title {
  color: var(--muted);
}

.ai-plan-check-grid label.is-disabled {
  cursor: not-allowed;
}

.ai-plan-check-grid label.is-disabled input {
  cursor: not-allowed;
}

.ai-plan-check-grid input,
.ai-plan-source-base input,
.ai-plan-source-free-card input {
  width: 1.1rem;
  min-height: auto;
  height: 1.1rem;
  padding: 0;
}

.ai-plan-focus-grid {
  grid-template-columns: repeat(auto-fit, minmax(5.25rem, 1fr));
}

.ai-plan-focus-grid.is-collapsed,
.ai-plan-focus-grid[hidden] {
  display: none;
}

.ai-plan-step .ai-plan-full-body-toggle {
  min-height: 2.9rem;
  display: flex;
  align-items: center;
  gap: 0.62rem;
  border: 1px solid color-mix(in srgb, var(--accent) 42%, var(--control-line));
  border-radius: 8px;
  padding: 0.62rem 0.72rem;
  background: color-mix(in srgb, var(--accent) 12%, var(--surface)) !important;
  color: var(--text);
  font-weight: 800;
}

.ai-plan-full-body-toggle input {
  width: 1.12rem;
  height: 1.12rem;
  min-height: auto;
  padding: 0;
  accent-color: var(--accent);
}

.ai-plan-focus-loading {
  grid-column: 1 / -1;
  color: var(--muted);
  font-size: 0.9rem;
}

.ai-plan-focus-loading--error {
  display: grid;
  gap: 0.45rem;
  justify-items: start;
}

.ai-plan-focus-retry {
  width: auto;
  min-height: 2rem;
  padding: 0.35rem 0.75rem;
  border: 1px solid color-mix(in srgb, var(--accent) 36%, var(--control-line));
  border-radius: 0.55rem;
  background: color-mix(in srgb, var(--accent) 8%, var(--surface));
  color: var(--accent);
  font-size: 0.75rem;
  font-weight: 800;
  box-shadow: none;
}

.ai-plan-focus-retry:hover,
.ai-plan-focus-retry:focus-visible {
  background: color-mix(in srgb, var(--accent) 14%, var(--surface));
  transform: none;
}

.ai-plan-check-grid .ai-plan-focus-chip {
  --muscle-chip-active-border: color-mix(in srgb, var(--accent) 64%, var(--accent-3));
  --muscle-chip-active-bg: color-mix(in srgb, var(--accent) 20%, var(--surface));
  --muscle-chip-active-glow: rgb(var(--accent-rgb) / 0.18);
  position: relative;
  min-height: 6.18rem;
  display: grid;
  grid-template-rows: 4.35rem auto;
  align-items: center;
  justify-items: center;
  gap: 0.3rem;
  padding: 0.36rem 0.32rem 0.4rem;
  text-align: center;
  border-color: color-mix(in srgb, var(--control-line) 88%, var(--accent-2));
  background: color-mix(in srgb, var(--surface) 84%, transparent) !important;
  cursor: pointer;
}

.ai-plan-focus-chip input {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  margin: 0;
  opacity: 0;
  cursor: pointer;
}

.ai-plan-focus-chip.is-active {
  border-color: var(--muscle-chip-active-border);
  background: var(--muscle-chip-active-bg) !important;
  box-shadow:
    0 0 0 1px color-mix(in srgb, var(--muscle-chip-active-border) 26%, transparent),
    0 10px 22px var(--muscle-chip-active-glow);
}

.ai-plan-check-grid .ai-plan-focus-chip.is-active,
.ai-plan-check-grid .ai-plan-focus-chip.is-primary,
.ai-plan-check-grid.ai-plan-group-invalid .ai-plan-focus-chip.is-active {
  border: 1px solid var(--muscle-chip-active-border) !important;
}

.ai-plan-focus-chip .muscle-filter-chip-icon {
  width: 4.05rem;
  height: 4.05rem;
}

.ai-plan-focus-chip .muscle-filter-chip-icon img {
  width: 3.9rem;
  height: 3.9rem;
}

.ai-plan-focus-chip.is-active .muscle-filter-chip-icon {
  background: color-mix(in srgb, var(--surface-strong) 68%, transparent);
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--control-line) 72%, transparent);
}

.ai-plan-focus-chip.is-active .muscle-filter-chip-icon img {
  filter: none !important;
  opacity: 1;
  mix-blend-mode: normal;
}

.ai-plan-check-grid.ai-plan-group-invalid label {
  border-color: rgba(220, 38, 38, 0.7);
  background: rgba(254, 242, 242, 0.68) !important;
}

.ai-plan-actions {
  justify-content: flex-end;
  border-top: 1px solid rgba(163, 160, 173, 0.18);
  padding-top: 0.85rem;
}

.ai-plan-actions button {
  min-width: 6.5rem;
}

:root:not([data-theme="light"]) .ai-plan-panel,
html[data-theme="dark"] .ai-plan-panel {
  background:
    linear-gradient(145deg, rgb(var(--accent-rgb) / 0.08), transparent 44%),
    rgba(19, 18, 26, 0.82) !important;
}

:root:not([data-theme="light"]) .ai-plan-requests-panel,
html[data-theme="dark"] .ai-plan-requests-panel {
  background:
    linear-gradient(145deg, rgb(var(--accent-rgb) / 0.12), transparent 44%),
    linear-gradient(215deg, rgba(250, 204, 21, 0.07), transparent 46%),
    rgba(19, 18, 26, 0.82) !important;
}

:root:not([data-theme="light"]) .ai-plan-requests-refresh,
html[data-theme="dark"] .ai-plan-requests-refresh {
  border-color: rgba(163, 160, 173, 0.28) !important;
  background: rgba(19, 18, 26, 0.55) !important;
}

:root:not([data-theme="light"]) .ai-plan-requests-empty,
html[data-theme="dark"] .ai-plan-requests-empty {
  border-color: rgb(var(--accent-hover-rgb) / 0.24);
  background:
    linear-gradient(145deg, rgb(var(--accent-rgb) / 0.1), transparent 48%),
    rgba(19, 18, 26, 0.5);
}

:root:not([data-theme="light"]) .ai-plan-requests-empty-icon,
html[data-theme="dark"] .ai-plan-requests-empty-icon {
  border-color: rgb(var(--accent-hover-rgb) / 0.3);
  background: rgba(19, 18, 26, 0.62);
}

:root:not([data-theme="light"]) .ai-plan-requests-empty-icon img,
html[data-theme="dark"] .ai-plan-requests-empty-icon img {
  filter: brightness(0) saturate(100%) invert(78%) sepia(62%) saturate(647%) hue-rotate(337deg)
    brightness(101%) contrast(98%);
}

:root:not([data-theme="light"]) .ai-plan-request-row,
html[data-theme="dark"] .ai-plan-request-row {
  border-color: rgba(163, 160, 173, 0.24);
  background: rgba(19, 18, 26, 0.55) !important;
}

:root:not([data-theme="light"]) .ai-plan-request-row--draft,
html[data-theme="dark"] .ai-plan-request-row--draft {
  border-color: rgb(var(--accent-hover-rgb) / 0.3);
  background:
    linear-gradient(135deg, rgb(var(--accent-rgb) / 0.1), transparent 54%),
    rgba(19, 18, 26, 0.55) !important;
}

:root:not([data-theme="light"]) .ai-plan-request-row--done,
html[data-theme="dark"] .ai-plan-request-row--done {
  border-color: rgba(34, 197, 94, 0.24);
  background:
    linear-gradient(135deg, rgba(34, 197, 94, 0.12), transparent 54%),
    rgba(19, 18, 26, 0.55) !important;
}

:root:not([data-theme="light"]) .ai-plan-request-row--review,
html[data-theme="dark"] .ai-plan-request-row--review {
  border-color: rgba(244, 114, 182, 0.24);
  background:
    linear-gradient(135deg, rgba(244, 114, 182, 0.12), transparent 54%),
    rgba(19, 18, 26, 0.55) !important;
}

:root:not([data-theme="light"]) .ai-plan-request-status,
html[data-theme="dark"] .ai-plan-request-status {
  border-color: rgba(250, 204, 21, 0.28);
  color: #fde68a;
  background: rgba(113, 63, 18, 0.34);
}

:root:not([data-theme="light"]) .ai-plan-request-status--done,
html[data-theme="dark"] .ai-plan-request-status--done {
  border-color: rgba(34, 197, 94, 0.28);
  color: #bbf7d0;
  background: rgba(20, 83, 45, 0.34);
}

:root:not([data-theme="light"]) .ai-plan-request-status--draft,
html[data-theme="dark"] .ai-plan-request-status--draft {
  border-color: rgb(var(--accent-hover-rgb) / 0.32);
  color: #fed7aa;
  background: rgba(124, 45, 18, 0.34);
}

:root:not([data-theme="light"]) .ai-plan-request-status--loading,
html[data-theme="dark"] .ai-plan-request-status--loading {
  border-color: rgb(var(--accent-hover-rgb) / 0.32);
  color: #fed7aa;
  background: rgba(124, 45, 18, 0.34);
}

:root:not([data-theme="light"]) .ai-plan-request-status--cancelled,
html[data-theme="dark"] .ai-plan-request-status--cancelled {
  border-color: rgba(163, 160, 173, 0.26);
  color: #d3d0da;
  background: rgba(51, 65, 85, 0.42);
}

:root:not([data-theme="light"]) .ai-plan-request-status--review,
html[data-theme="dark"] .ai-plan-request-status--review {
  border-color: rgba(244, 114, 182, 0.28);
  color: #fbcfe8;
  background: rgba(131, 24, 67, 0.34);
}

:root:not([data-theme="light"]) .ai-plan-request-status--hidden,
html[data-theme="dark"] .ai-plan-request-status--hidden {
  border-color: rgba(163, 160, 173, 0.3);
  color: #d3d0da;
  background: rgba(51, 65, 85, 0.42);
}

:root:not([data-theme="light"]) .ai-plan-request-delete,
html[data-theme="dark"] .ai-plan-request-delete {
  border-color: rgba(248, 113, 113, 0.26);
  color: #fecaca;
  background: rgba(127, 29, 29, 0.34);
}

:root:not([data-theme="light"]) .ai-plan-request-delete:hover,
:root:not([data-theme="light"]) .ai-plan-request-delete:focus-visible,
html[data-theme="dark"] .ai-plan-request-delete:hover,
html[data-theme="dark"] .ai-plan-request-delete:focus-visible {
  border-color: rgba(248, 113, 113, 0.44);
  background: rgba(127, 29, 29, 0.48);
}

:root:not([data-theme="light"]) .ai-plan-step input,
:root:not([data-theme="light"]) .ai-plan-step textarea,
:root:not([data-theme="light"]) .ai-plan-step select,
:root:not([data-theme="light"]) .ai-plan-equipment-mode label,
:root:not([data-theme="light"]) .ai-plan-check-grid label,
html[data-theme="dark"] .ai-plan-step input,
html[data-theme="dark"] .ai-plan-step textarea,
html[data-theme="dark"] .ai-plan-step select,
html[data-theme="dark"] .ai-plan-equipment-mode label,
html[data-theme="dark"] .ai-plan-check-grid label {
  border-color: rgba(163, 160, 173, 0.28);
  background: rgba(19, 18, 26, 0.55);
}

:root:not([data-theme="light"]) .ai-plan-equipment-mode label,
html[data-theme="dark"] .ai-plan-equipment-mode label {
  border-color: rgb(var(--accent-hover-rgb) / 0.3);
  background:
    linear-gradient(145deg, rgb(var(--accent-hover-rgb) / 0.1), transparent 62%),
    rgba(19, 18, 26, 0.55) !important;
}

:root:not([data-theme="light"]) .ai-plan-check-grid .ai-plan-saved-only-option,
html[data-theme="dark"] .ai-plan-check-grid .ai-plan-saved-only-option {
  border-color: rgba(250, 204, 21, 0.28) !important;
  background:
    linear-gradient(145deg, rgba(250, 204, 21, 0.1), transparent 58%),
    rgba(19, 18, 26, 0.55) !important;
}

:root:not([data-theme="light"]) .ai-plan-source-option.is-active,
:root:not([data-theme="light"]) .ai-plan-source-free-card.is-active,
html[data-theme="dark"] .ai-plan-source-option.is-active,
html[data-theme="dark"] .ai-plan-source-free-card.is-active {
  border-color: rgb(var(--accent-hover-rgb) / 0.4);
  background:
    linear-gradient(145deg, rgb(var(--accent-hover-rgb) / 0.12), transparent 62%),
    rgba(19, 18, 26, 0.55) !important;
  color: #fed7aa;
}

:root:not([data-theme="light"]) .ai-plan-source-option,
:root:not([data-theme="light"]) .ai-plan-source-free-card,
html[data-theme="dark"] .ai-plan-source-option,
html[data-theme="dark"] .ai-plan-source-free-card {
  border-color: rgba(163, 160, 173, 0.28);
  background: rgba(19, 18, 26, 0.55) !important;
}

:root:not([data-theme="light"]) .ai-plan-source-layout,
html[data-theme="dark"] .ai-plan-source-layout {
  border-color: rgba(163, 160, 173, 0.24);
  background: rgba(19, 18, 26, 0.34);
}

:root:not([data-theme="light"]) .ai-plan-source-layout.ai-plan-group-invalid,
html[data-theme="dark"] .ai-plan-source-layout.ai-plan-group-invalid {
  border-color: rgba(248, 113, 113, 0.66);
  box-shadow: 0 0 0 3px rgba(248, 113, 113, 0.1);
}

:root:not([data-theme="light"]) .ai-plan-disclaimer-brand,
html[data-theme="dark"] .ai-plan-disclaimer-brand {
  color: #fed7aa;
}

:root:not([data-theme="light"]) .ai-plan-disclaimer-mark,
html[data-theme="dark"] .ai-plan-disclaimer-mark {
  border-color: rgb(var(--accent-hover-rgb) / 0.3);
  background: rgba(154, 52, 18, 0.2);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.07),
    0 8px 18px rgba(0, 0, 0, 0.22);
}

:root:not([data-theme="light"]) .ai-plan-disclaimer-mark img,
html[data-theme="dark"] .ai-plan-disclaimer-mark img {
  filter: brightness(0) saturate(100%) invert(78%) sepia(62%) saturate(647%) hue-rotate(337deg)
    brightness(101%) contrast(98%);
}

:root:not([data-theme="light"]) .ai-plan-field-hint-warn,
html[data-theme="dark"] .ai-plan-field-hint-warn {
  color: #fbbf24;
}

:root:not([data-theme="light"]) .ai-plan-field-hint-danger,
html[data-theme="dark"] .ai-plan-field-hint-danger {
  color: #fca5a5;
}

:root:not([data-theme="light"]) .ai-plan-check-grid.ai-plan-group-invalid label,
html[data-theme="dark"] .ai-plan-check-grid.ai-plan-group-invalid label {
  border-color: rgba(248, 113, 113, 0.66);
  background: rgba(127, 29, 29, 0.18) !important;
}

:root:not([data-theme="light"]) .plan-ai-badge,
html[data-theme="dark"] .plan-ai-badge {
  color: #fed7aa;
  border-color: rgb(var(--accent-hover-rgb) / 0.34);
  background: rgba(154, 52, 18, 0.22);
}

:root:not([data-theme="light"]) .plan-ai-badge-icon,
html[data-theme="dark"] .plan-ai-badge-icon {
  filter: brightness(0) saturate(100%) invert(78%) sepia(62%) saturate(647%) hue-rotate(337deg)
    brightness(101%) contrast(98%);
}

html[data-theme="light"] .ai-plan-disclaimer-backdrop {
  background: rgba(17, 19, 24, 0.34);
}

html[data-theme="light"] .ai-plan-disclaimer-panel {
  border-color: rgba(14, 165, 233, 0.2);
  background: rgba(255, 255, 255, 0.98) !important;
  box-shadow: 0 18px 44px rgba(19, 18, 26, 0.14);
}

html[data-theme="light"] .ai-plan-disclaimer-mark {
  background: rgba(255, 247, 237, 0.86);
}

/* Bottom nav: keep five destinations on one compact row. */
.app-bottom-nav,
html[data-theme="light"] .app-bottom-nav {
  display: grid !important;
  grid-auto-flow: column;
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  grid-template-rows: 1fr !important;
  align-items: stretch;
}

.app-bottom-nav button.app-nav-btn,
html[data-theme="light"] .app-bottom-nav button.app-nav-btn,
.app-bottom-nav #nav-workout,
html[data-theme="light"] .app-bottom-nav #nav-workout {
  min-width: 0;
  overflow: hidden;
}

.app-bottom-nav .app-nav-label {
  min-width: 0;
  max-width: 100%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

@media (max-width: 380px) {
  .app-bottom-nav,
  html[data-theme="light"] .app-bottom-nav {
    height: calc(3.8rem + env(safe-area-inset-bottom, 0px));
    padding-inline: 0.26rem;
    gap: 0.04rem;
  }

  .app-bottom-nav button.app-nav-btn,
  html[data-theme="light"] .app-bottom-nav button.app-nav-btn,
  .app-bottom-nav #nav-workout,
  html[data-theme="light"] .app-bottom-nav #nav-workout {
    gap: 0.12rem;
    padding-inline: 0.02rem !important;
  }

  .app-bottom-nav .app-nav-label {
    font-size: 0.49rem;
  }
}

@media (max-width: 520px) {
  .ai-plan-disclaimer-panel {
    max-height: calc(100dvh - 2rem);
    overflow: auto;
  }

  .ai-plan-panel {
    padding: 0.85rem;
  }

  .ai-plan-mode-tabs {
    gap: 0.28rem;
    padding: 0.26rem;
  }

  .ai-plan-mode-tab {
    min-height: 2.24rem;
    padding-inline: 0.28rem;
    font-size: 0.76rem;
  }

  .ai-plan-field-grid,
  .ai-plan-check-grid {
    grid-template-columns: 1fr;
  }

  .ai-plan-source-layout {
    grid-template-columns: 1fr;
  }

  #ai-plan-focus-list.ai-plan-focus-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 0.45rem;
  }

  .ai-plan-requests-head {
    align-items: flex-start;
    flex-direction: column;
  }

  .ai-plan-requests-actions,
  .ai-plan-requests-create {
    width: 100% !important;
  }

  .ai-plan-requests-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: stretch;
  }

  .ai-plan-requests-create {
    min-width: 0 !important;
    width: 100% !important;
    padding-inline: 0.38rem;
  }

  .ai-plan-requests-refresh {
    grid-column: 1 / -1;
    justify-self: end;
    width: 2.45rem !important;
  }

  .ai-plan-requests-empty {
    padding-inline: 0.7rem;
  }

  .ai-plan-request-row {
    grid-template-columns: 1fr;
    align-items: stretch;
  }

  .ai-plan-request-side {
    justify-content: space-between;
  }

  .ai-plan-requests-pager {
    align-items: stretch;
    flex-direction: column;
  }

  .ai-plan-requests-page-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .ai-plan-check-grid .ai-plan-focus-chip {
    min-height: 5.65rem;
    grid-template-rows: 3.75rem auto;
    padding: 0.32rem 0.22rem 0.36rem;
  }

  .ai-plan-focus-chip .muscle-filter-chip-icon {
    width: 3.55rem;
    height: 3.55rem;
  }

  .ai-plan-focus-chip .muscle-filter-chip-icon img {
    width: 3.42rem;
    height: 3.42rem;
  }

  .ai-plan-actions {
    display: grid;
    grid-template-columns: 1fr 1fr;
  }

  .ai-plan-actions button {
    width: 100%;
    min-width: 0;
  }
}

/* UX accessibility pass: final overrides after feature-specific rules. */
:where(button, summary, [role="button"], input, select, textarea, .app-select-trigger) {
  min-height: 2.75rem;
}

:where(button, summary, [role="button"], .app-select-trigger) {
  min-width: 2.75rem;
}

#app-theme-toggle.app-theme-toggle,
#app-toolbar-back.app-toolbar-back,
.app-brand-trailing .app-toolbar-back,
.search-active-filters-info,
.fitana-fresh-prompt-actions .fitana-fresh-later {
  min-width: 2.75rem;
  min-height: 2.75rem;
}

:where(button, a, summary, input, select, textarea, [role="button"], .app-select-trigger):focus-visible {
  outline: 3px solid color-mix(in srgb, var(--accent) 72%, #ffffff);
  outline-offset: 3px;
  box-shadow: 0 0 0 5px color-mix(in srgb, var(--accent) 20%, transparent);
}

.page[tabindex="-1"]:focus,
.page[tabindex="-1"]:focus-visible {
  outline: none;
  box-shadow: none;
}

/* Keep form feedback readable after page-specific card/message overrides. */
.msg.warn:not(.hidden):not(:empty) {
  color: #fef3c7;
  border-color: rgba(245, 158, 11, 0.36);
  background: rgba(120, 53, 15, 0.22);
}

.msg.err:not(.hidden):not(:empty) {
  color: #fecdd3;
  border-color: rgba(244, 63, 94, 0.34);
  background: rgba(127, 29, 29, 0.22);
}

.msg.ok:not(.hidden):not(:empty) {
  color: #fde68a;
  border-color: rgba(245, 158, 11, 0.32);
  background: rgba(120, 53, 15, 0.2);
}

.msg.info:not(.hidden):not(:empty) {
  color: #dbeafe;
  border-color: rgba(59, 130, 246, 0.28);
  background: rgba(30, 64, 175, 0.16);
}

html[data-theme="light"] .msg.warn:not(.hidden):not(:empty),
html[data-theme="light"] .msg.ok:not(.hidden):not(:empty) {
  color: #92400e;
  border-color: rgba(217, 119, 6, 0.26);
  background: rgba(255, 251, 235, 0.95);
}

html[data-theme="light"] .msg.err:not(.hidden):not(:empty) {
  color: #9f1239;
  border-color: rgba(225, 29, 72, 0.2);
  background: rgba(255, 241, 242, 0.92);
}

html[data-theme="light"] .msg.info:not(.hidden):not(:empty) {
  color: #1e3a8a;
  border-color: rgba(37, 99, 235, 0.18);
  background: rgba(239, 246, 255, 0.95);
}

button.is-soft-disabled,
button[data-soft-disabled="true"]:not(:disabled) {
  opacity: 0.72;
  filter: saturate(0.82);
}

button.is-soft-disabled:hover,
button[data-soft-disabled="true"]:not(:disabled):hover {
  transform: none;
}

:where(input, select, textarea).field-invalid:not([type="checkbox"]):not([type="radio"]):not([type="file"]),
:where(input, select, textarea)[aria-invalid="true"]:not([type="checkbox"]):not([type="radio"]):not([type="file"]) {
  border-color: rgba(244, 63, 94, 0.72) !important;
  background: color-mix(in srgb, rgba(244, 63, 94, 0.12) 72%, var(--card)) !important;
  box-shadow: 0 0 0 3px rgba(244, 63, 94, 0.18) !important;
}

:where(input[type="checkbox"], input[type="radio"]).field-invalid,
:where(input[type="checkbox"], input[type="radio"])[aria-invalid="true"] {
  outline: 3px solid rgba(244, 63, 94, 0.75);
  outline-offset: 3px;
}

.field-invalid:is(label, div, section, span),
.app-select.field-invalid .app-select-trigger,
select.field-invalid + .app-select .app-select-trigger,
select[aria-invalid="true"] + .app-select .app-select-trigger {
  border-color: rgba(244, 63, 94, 0.72) !important;
  box-shadow: 0 0 0 3px rgba(244, 63, 94, 0.18) !important;
}

.field-invalid:is(label, div, section, span) {
  border-radius: 8px;
}

.auth-terms-accept.field-invalid {
  padding: 0.32rem 0.42rem;
  background: rgba(244, 63, 94, 0.08);
}

.otp-boxes.field-invalid,
.billing-jalali-row.field-invalid,
.stats-jalali-row.field-invalid,
.my-ex-composite-selected.field-invalid {
  padding: 0.35rem;
  background: rgba(244, 63, 94, 0.08);
}

html[data-theme="light"] :where(input, select, textarea).field-invalid:not([type="checkbox"]):not([type="radio"]):not([type="file"]),
html[data-theme="light"] :where(input, select, textarea)[aria-invalid="true"]:not([type="checkbox"]):not([type="radio"]):not([type="file"]) {
  background: #fff1f2 !important;
  border-color: rgba(225, 29, 72, 0.58) !important;
  box-shadow: 0 0 0 3px rgba(225, 29, 72, 0.13) !important;
}

/* AI workspace: use the same quiet surfaces and controls as the workout hub. */
:is(#page-ai-plan-quick, #page-ai-plan, #page-ai-plan-requests) .ai-plan-head {
  margin-bottom: 0.78rem;
}

.ai-plan-title-icon,
html[data-theme="light"] .ai-plan-title-icon {
  width: 2.25rem;
  height: 2.25rem;
  border: 1px solid rgb(var(--accent-rgb) / 0.22);
  border-radius: 0.72rem;
  background: rgb(var(--accent-rgb) / 0.08);
  box-shadow: none;
}

.ai-plan-title-icon img,
html[data-theme="light"] .ai-plan-title-icon img {
  width: 1.28rem;
  height: 1.28rem;
  filter: brightness(0) saturate(100%) invert(34%) sepia(79%) saturate(1450%) hue-rotate(356deg)
    brightness(93%) contrast(92%);
  opacity: 0.92;
}

.ai-plan-panel,
:root:not([data-theme="light"]) .ai-plan-panel,
html[data-theme="dark"] .ai-plan-panel {
  gap: 0.82rem;
  border: 1px solid var(--plan-row-bd, var(--shell-line));
  border-radius: var(--radius);
  padding: 0.84rem;
  background: var(--card) !important;
  box-shadow: none;
  backdrop-filter: none;
}

.ai-plan-mode-tabs {
  gap: 0.2rem;
  padding: 0.2rem;
  border-color: var(--control-line);
  border-radius: 0.62rem;
  background: var(--control-bg);
}

.ai-plan-mode-tab {
  min-height: 2.25rem;
  border-radius: 0.48rem;
  color: var(--muted);
  font-size: 0.8rem;
  font-weight: 750;
}

.ai-plan-mode-tab.is-active {
  color: var(--text);
  background: rgb(var(--accent-rgb) / 0.1);
  box-shadow: inset 0 0 0 1px rgb(var(--accent-rgb) / 0.24);
}

.ai-plan-progress-row {
  min-height: 1.9rem;
  justify-content: flex-start;
  padding-inline: 0.08rem;
}

.ai-plan-quick-state {
  min-height: 1.75rem;
  border-color: var(--control-line);
  border-radius: 999px;
  padding: 0.14rem 0.55rem;
  color: var(--muted);
  background: var(--control-bg);
  font-size: 0.7rem;
  font-weight: 750;
}

.ai-plan-quick-state.is-ready {
  border-color: rgba(34, 197, 94, 0.28);
  color: color-mix(in srgb, #22c55e 70%, var(--text));
  background: color-mix(in srgb, #22c55e 9%, var(--control-bg));
}

.ai-plan-quick-state.is-missing {
  border-color: rgba(239, 68, 68, 0.26);
  color: color-mix(in srgb, #ef4444 72%, var(--text));
  background: color-mix(in srgb, #ef4444 8%, var(--control-bg));
}

.ai-plan-quick-summary {
  min-height: 0;
}

.ai-plan-quick-profile-chips {
  gap: 0.38rem;
}

.ai-plan-quick-profile-chip {
  min-height: 2rem;
  border-color: var(--control-line);
  border-radius: 999px;
  padding: 0.24rem 0.62rem;
  background: var(--control-bg);
  font-size: 0.74rem;
  font-weight: 750;
}

.ai-plan-quick-presets {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.6rem;
}

.ai-plan-quick-preset-title,
.ai-plan-quick-more-body label,
.ai-plan-step label {
  color: var(--muted);
  font-size: 0.8rem;
  font-weight: 650;
}

.ai-plan-quick-select,
.ai-plan-step input,
.ai-plan-step textarea,
.ai-plan-step select,
.ai-plan-quick-more-body input,
.ai-plan-quick-more-body select {
  min-height: 2.75rem;
  border-color: var(--control-line);
  border-radius: 0.5rem;
  color: var(--text);
  background: var(--control-bg) !important;
  box-shadow: inset 0 1px 0 color-mix(in srgb, #ffffff 5%, transparent);
  font-size: 0.86rem;
  font-weight: 650;
}

.ai-plan-quick-more {
  border-color: var(--control-line);
  border-radius: 0.62rem;
  background: transparent;
}

.ai-plan-quick-more summary {
  min-height: 2.5rem;
  padding: 0.4rem 0.68rem;
  color: var(--text);
  font-size: 0.8rem;
  font-weight: 750;
}

.ai-plan-quick-more-body {
  border-top-color: var(--control-line);
  padding: 0.68rem;
}

.ai-plan-quick-focus-trigger {
  border-color: var(--control-line);
  color: var(--text);
  background: var(--control-bg) !important;
  font-weight: 700;
  box-shadow: none !important;
}

.ai-plan-quick-missing {
  border-style: solid;
  border-color: rgba(239, 68, 68, 0.24);
  color: color-mix(in srgb, #ef4444 72%, var(--text));
  background: color-mix(in srgb, #ef4444 7%, var(--card));
}

.ai-plan-quick-profile-link {
  border-color: var(--control-line);
  color: var(--text);
  background: var(--control-bg);
  font-weight: 750;
}

.ai-plan-requests-panel,
:root:not([data-theme="light"]) .ai-plan-requests-panel,
html[data-theme="dark"] .ai-plan-requests-panel {
  gap: 0.7rem;
  border: 0;
  padding: 0;
  background: transparent !important;
  box-shadow: none;
}

.ai-plan-requests-head {
  justify-content: flex-start;
}

.ai-plan-requests-actions {
  justify-content: flex-start;
  gap: 0.38rem;
}

.ai-plan-requests-create,
.ai-plan-requests-create--full {
  height: 2.25rem !important;
  min-height: 2.25rem !important;
  border: 1px solid var(--control-line);
  border-radius: 999px !important;
  padding: 0.32rem 0.68rem !important;
  color: var(--text);
  background: var(--control-bg) !important;
  box-shadow: none !important;
  font-size: 0.75rem;
  font-weight: 750;
}

#btn-ai-plan-request-new {
  border-color: rgb(var(--accent-rgb) / 0.32);
  color: var(--accent);
  background: rgb(var(--accent-rgb) / 0.1) !important;
}

.ai-plan-requests-create img,
.ai-plan-requests-create.ai-plan-requests-create--full img {
  width: 1rem;
  height: 1rem;
  filter: brightness(0) saturate(100%) invert(34%) sepia(79%) saturate(1450%) hue-rotate(356deg)
    brightness(93%) contrast(92%);
  opacity: 0.88;
}

.ai-plan-requests-refresh {
  width: 2.25rem !important;
  min-width: 2.25rem;
  height: 2.25rem;
  min-height: 2.25rem;
  border-color: var(--control-line) !important;
  border-radius: 0.62rem;
  background: var(--control-bg) !important;
  color: var(--app-icon-mono-soft) !important;
  box-shadow: none !important;
}

.ai-plan-requests-filters {
  min-height: 2rem;
  margin-bottom: 0;
}

.ai-plan-requests-empty,
:root:not([data-theme="light"]) .ai-plan-requests-empty,
html[data-theme="dark"] .ai-plan-requests-empty {
  min-height: 11rem;
  gap: 0.58rem;
  border-color: var(--plan-row-bd, var(--shell-line));
  background: var(--plan-row-bg, var(--card)) !important;
}

.ai-plan-requests-empty-icon,
:root:not([data-theme="light"]) .ai-plan-requests-empty-icon,
html[data-theme="dark"] .ai-plan-requests-empty-icon {
  width: 2.75rem;
  height: 2.75rem;
  border-color: var(--control-line);
  background: var(--control-bg);
}

.ai-plan-requests-empty-icon img,
:root:not([data-theme="light"]) .ai-plan-requests-empty-icon img,
html[data-theme="dark"] .ai-plan-requests-empty-icon img {
  width: 1.5rem;
  height: 1.5rem;
  filter: brightness(0) saturate(100%) invert(34%) sepia(79%) saturate(1450%) hue-rotate(356deg)
    brightness(93%) contrast(92%);
}

.ai-plan-request-row,
:root:not([data-theme="light"]) .ai-plan-request-row,
html[data-theme="dark"] .ai-plan-request-row,
:root:not([data-theme="light"]) .ai-plan-request-row--draft,
html[data-theme="dark"] .ai-plan-request-row--draft,
:root:not([data-theme="light"]) .ai-plan-request-row--done,
html[data-theme="dark"] .ai-plan-request-row--done,
:root:not([data-theme="light"]) .ai-plan-request-row--review,
html[data-theme="dark"] .ai-plan-request-row--review {
  min-height: 4rem;
  border-color: var(--plan-row-bd, var(--shell-line));
  border-radius: 0.85rem;
  padding: 0.62rem 0.72rem;
  background: var(--plan-row-bg, var(--card)) !important;
  box-shadow: 0 1px 0 color-mix(in srgb, #ffffff 4%, transparent) inset;
}

.ai-plan-request-row[data-ai-plan-draft-open]:hover,
.ai-plan-request-row[data-ai-plan-draft-open]:focus-visible,
.ai-plan-request-row:has(.ai-plan-request-open:hover) {
  border-color: rgb(var(--accent-rgb) / 0.42);
  box-shadow: 0 6px 18px color-mix(in srgb, var(--ink) 10%, transparent);
}

.ai-plan-request-title {
  font-size: 0.86rem;
  font-weight: 750;
}

.ai-plan-request-meta,
.ai-plan-request-detail {
  font-weight: 600;
}

.ai-plan-request-status {
  min-height: 1.62rem;
  border-color: var(--control-line);
  border-radius: 999px;
  padding: 0.12rem 0.48rem;
  color: var(--muted);
  background: var(--control-bg);
  font-size: 0.66rem;
  font-weight: 750;
}

.ai-plan-request-status--done {
  border-color: rgba(34, 197, 94, 0.24);
  color: color-mix(in srgb, #22c55e 72%, var(--text));
  background: color-mix(in srgb, #22c55e 8%, var(--control-bg));
}

.ai-plan-request-status--draft,
.ai-plan-request-status--loading {
  border-color: rgb(var(--accent-rgb) / 0.24);
  color: var(--accent);
  background: rgb(var(--accent-rgb) / 0.08);
}

.ai-plan-request-status--review {
  border-color: rgba(245, 158, 11, 0.26);
  color: color-mix(in srgb, #f59e0b 72%, var(--text));
  background: color-mix(in srgb, #f59e0b 8%, var(--control-bg));
}

.ai-plan-request-status--cancelled,
.ai-plan-request-status--hidden {
  border-color: var(--control-line);
  color: var(--muted);
  background: var(--control-bg);
}

.ai-plan-request-delete {
  width: 1.85rem !important;
  height: 1.85rem;
  min-width: 1.85rem;
  min-height: 1.85rem;
  border-color: var(--control-line);
  color: var(--app-icon-mono-soft);
  background: var(--control-bg);
}

.ai-plan-request-side .plan-vis-btn {
  inline-size: 1.85rem !important;
  block-size: 1.85rem;
  min-width: 1.85rem;
  min-height: 1.85rem;
  flex-basis: 1.85rem;
}

.ai-plan-requests-page-btn {
  min-height: 2rem;
  border-color: var(--control-line);
  border-radius: 999px;
  background: var(--control-bg);
  color: var(--text);
  font-weight: 700;
}

.ai-plan-step {
  gap: 0.68rem;
}

.ai-plan-source-layout,
:root:not([data-theme="light"]) .ai-plan-source-layout,
html[data-theme="dark"] .ai-plan-source-layout {
  gap: 0.5rem;
  border: 0;
  padding: 0;
  background: transparent;
}

.ai-plan-source-option,
.ai-plan-source-free-card,
:root:not([data-theme="light"]) .ai-plan-source-option,
:root:not([data-theme="light"]) .ai-plan-source-free-card,
html[data-theme="dark"] .ai-plan-source-option,
html[data-theme="dark"] .ai-plan-source-free-card,
.ai-plan-equipment-mode label,
:root:not([data-theme="light"]) .ai-plan-equipment-mode label,
html[data-theme="dark"] .ai-plan-equipment-mode label,
.ai-plan-check-grid label,
:root:not([data-theme="light"]) .ai-plan-check-grid label,
html[data-theme="dark"] .ai-plan-check-grid label {
  border-color: var(--control-line);
  border-radius: 0.58rem;
  background: var(--control-bg) !important;
  box-shadow: none;
}

.ai-plan-source-option.is-active,
.ai-plan-source-free-card.is-active,
:root:not([data-theme="light"]) .ai-plan-source-option.is-active,
:root:not([data-theme="light"]) .ai-plan-source-free-card.is-active,
html[data-theme="dark"] .ai-plan-source-option.is-active,
html[data-theme="dark"] .ai-plan-source-free-card.is-active,
.ai-plan-step .ai-plan-full-body-toggle {
  border-color: rgb(var(--accent-rgb) / 0.34);
  color: var(--text);
  background: rgb(var(--accent-rgb) / 0.08) !important;
  box-shadow: none;
}

.ai-plan-check-grid .ai-plan-focus-chip {
  border-radius: 0.65rem;
  background: var(--control-bg) !important;
}

.ai-plan-focus-chip.is-active {
  border-color: rgb(var(--accent-rgb) / 0.46);
  background: rgb(var(--accent-rgb) / 0.1) !important;
  box-shadow: inset 0 0 0 1px rgb(var(--accent-rgb) / 0.12);
}

.ai-plan-actions {
  border-top-color: var(--line-soft);
  padding-top: 0.72rem;
}

.ai-plan-disclaimer-backdrop {
  background: rgba(7, 6, 10, 0.58);
  backdrop-filter: blur(6px);
}

.ai-plan-disclaimer-panel,
html[data-theme="light"] .ai-plan-disclaimer-panel {
  gap: 0.72rem;
  border-color: var(--shell-line);
  border-radius: var(--radius);
  padding: 0.9rem;
  background: var(--card) !important;
  box-shadow: 0 18px 44px color-mix(in srgb, var(--ink) 22%, transparent);
}

.ai-plan-disclaimer-mark,
:root:not([data-theme="light"]) .ai-plan-disclaimer-mark,
html[data-theme="dark"] .ai-plan-disclaimer-mark,
html[data-theme="light"] .ai-plan-disclaimer-mark {
  width: 2.5rem;
  height: 2.5rem;
  border-color: var(--control-line);
  border-radius: 0.65rem;
  background: var(--control-bg);
  box-shadow: none;
}

.ai-plan-disclaimer-brand,
:root:not([data-theme="light"]) .ai-plan-disclaimer-brand,
html[data-theme="dark"] .ai-plan-disclaimer-brand {
  color: var(--muted);
  font-size: 0.7rem;
  font-weight: 750;
}

.ai-plan-disclaimer-body {
  font-size: 0.84rem;
  line-height: 1.85;
}

@media (max-width: 520px) {
  .ai-plan-panel {
    padding: 0.72rem;
  }

  .ai-plan-quick-presets {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.45rem;
  }

  .ai-plan-quick-presets .ai-plan-session-count-group {
    grid-column: 1 / -1;
  }

  .ai-plan-session-counts {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .ai-plan-requests-head {
    width: 100%;
    flex-direction: row;
  }

  .ai-plan-requests-actions {
    width: 100% !important;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) 2.25rem;
    gap: 0.35rem;
  }

  .ai-plan-requests-create {
    min-height: 2.25rem;
    padding-inline: 0.35rem;
  }

  .ai-plan-requests-refresh {
    grid-column: auto;
    justify-self: stretch;
  }

  .ai-plan-request-side {
    justify-content: flex-start;
  }
}

@media (max-width: 360px) {
  .ai-plan-quick-presets {
    grid-template-columns: 1fr;
  }
}

/* Shared workout-plan conversation surface. */
.ai-plan-chat {
  display: grid;
  gap: 0.65rem;
  min-width: 0;
  padding: 0.7rem;
  border: 1px solid var(--control-line);
  border-radius: var(--radius);
  background: color-mix(in srgb, var(--control-bg) 74%, var(--card));
}

.ai-plan-chat-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  padding: 0 0.12rem;
}

.ai-plan-chat-head > div {
  display: grid;
  gap: 0.08rem;
  min-width: 0;
}

.ai-plan-chat-head strong,
.ai-plan-chat-head h2 {
  margin: 0;
  color: var(--text);
  font-size: 0.92rem;
  line-height: 1.45;
}

.ai-plan-chat-head span,
.ai-plan-chat-head small {
  color: var(--muted);
  font-size: 0.7rem;
  line-height: 1.5;
}

.ai-plan-chat-head span {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
}

.ai-plan-chat-head span i {
  width: 0.42rem;
  height: 0.42rem;
  border-radius: 50%;
  background: #2ca66f;
  box-shadow: 0 0 0 0.18rem rgb(44 166 111 / 0.12);
}

.ai-plan-chat-messages {
  display: flex;
  flex-direction: column;
  gap: 0.48rem;
  height: clamp(12rem, 42dvh, 23rem);
  max-height: 23rem;
  overflow-y: auto;
  overscroll-behavior-y: auto;
  touch-action: pan-y;
  -webkit-overflow-scrolling: touch;
  padding: 0.62rem;
  border: 1px solid color-mix(in srgb, var(--control-line) 74%, transparent);
  border-radius: 0.62rem;
  background: color-mix(in srgb, var(--card) 92%, transparent);
  scrollbar-gutter: stable;
}

.ai-plan-chat-message {
  width: fit-content;
  max-width: min(88%, 34rem);
  padding: 0.62rem 0.72rem;
  border: 1px solid var(--control-line);
  border-radius: 0.68rem;
  color: var(--text);
  background: var(--control-bg);
  font-size: 0.84rem;
  line-height: 1.8;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}

.ai-plan-chat-message.is-user {
  align-self: flex-start;
  border-color: rgb(var(--accent-rgb) / 0.28);
  background: rgb(var(--accent-rgb) / 0.09);
}

.ai-plan-chat-message.is-assistant {
  align-self: flex-end;
  color: var(--muted);
}

.ai-plan-chat-message.is-typing {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  opacity: 0.78;
}

.ai-plan-thinking-dots {
  direction: ltr;
  display: inline-flex;
  align-items: center;
  gap: 0.2rem;
  min-width: 1.45rem;
}

.ai-plan-thinking-dots i {
  width: 0.3rem;
  height: 0.3rem;
  border-radius: 50%;
  background: currentColor;
  animation: ai-plan-thinking-pulse 1.15s ease-in-out infinite;
}

.ai-plan-thinking-dots i:nth-child(2) {
  animation-delay: 0.16s;
}

.ai-plan-thinking-dots i:nth-child(3) {
  animation-delay: 0.32s;
}

@keyframes ai-plan-thinking-pulse {
  0%, 70%, 100% { opacity: 0.28; transform: translateY(0); }
  35% { opacity: 1; transform: translateY(-0.16rem); }
}

@media (prefers-reduced-motion: reduce) {
  .ai-plan-thinking-dots i {
    animation: none;
    opacity: 0.65;
  }
}

.ai-plan-chat-composer {
  position: sticky;
  bottom: calc(0.4rem + env(safe-area-inset-bottom));
  z-index: 4;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: end;
  gap: 0.45rem;
  padding: 0.32rem;
  border: 1px solid var(--control-line);
  border-radius: 0.68rem;
  background: color-mix(in srgb, var(--card) 94%, transparent);
  box-shadow: 0 0.35rem 1rem rgb(0 0 0 / 0.08);
  backdrop-filter: blur(12px);
}

.ai-plan-chat-composer textarea {
  min-height: 2.65rem;
  max-height: 8rem;
  resize: none;
  margin: 0;
  border: 0;
  padding: 0.55rem 0.62rem;
  background: transparent !important;
  box-shadow: none !important;
  font-size: 0.84rem;
  line-height: 1.65;
}

.ai-plan-chat-composer .ai-plan-chat-send {
  width: auto;
  min-width: 5rem;
  min-height: 2.65rem;
  margin: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.38rem;
  padding-inline: 0.7rem;
  border-radius: 0.52rem;
  border-color: rgb(var(--accent-rgb) / 0.72);
  background: var(--accent);
  color: #fff;
  box-shadow: none;
}

.ai-plan-chat-send svg {
  width: 1.05rem;
  height: 1.05rem;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
  transform: scaleX(-1);
}

.ai-plan-chat-send span {
  font-size: 0.78rem;
  font-weight: 800;
}

.ai-plan-chat-finish {
  width: 100%;
  min-height: 3.8rem;
  margin: 0;
  display: grid;
  place-items: center;
  gap: 0.08rem;
  padding: 0.55rem 0.8rem;
  border-radius: 0.58rem;
  box-shadow: none;
}

.ai-plan-chat-finish strong {
  font-size: 0.88rem;
  line-height: 1.5;
}

.ai-plan-chat-finish span {
  font-size: 0.68rem;
  font-weight: 600;
  line-height: 1.45;
  opacity: 0.75;
}

.plan-ai-revision-chat {
  gap: 0.7rem;
}

.plan-ai-revision-mode {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.28rem;
  padding: 0.28rem;
  border: 1px solid var(--control-line);
  border-radius: 0.68rem;
  background: var(--control-bg);
}

.plan-ai-revision-mode button {
  min-width: 0;
  min-height: 2.65rem;
  margin: 0;
  padding: 0.48rem 0.65rem;
  border: 1px solid transparent;
  border-radius: 0.5rem;
  color: var(--muted);
  background: transparent;
  box-shadow: none;
  font-size: 0.8rem;
  font-weight: 750;
}

.plan-ai-revision-mode button.is-active {
  border-color: rgb(var(--accent-rgb) / 0.34);
  color: var(--text);
  background: rgb(var(--accent-rgb) / 0.1);
}

.plan-ai-revision-mode button:disabled {
  opacity: 0.45;
}

@media (max-width: 520px) {
  .ai-plan-chat-messages {
    height: clamp(11rem, 36dvh, 19rem);
  }

  .ai-plan-chat-message {
    max-width: 94%;
  }

  .ai-plan-chat-composer {
    bottom: calc(0.25rem + env(safe-area-inset-bottom));
  }

  .ai-plan-chat-head small {
    display: none;
  }
}

/* AI plan revision: follows the same compact rows, controls, and surfaces as plan details. */
.plan-ai-revision-entry {
  margin: 0 0 0.65rem;
}

.plan-ai-revision-entry-link {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 0.68rem;
  min-height: 3.7rem;
  padding: 0.62rem 0.7rem;
  border: 1px solid var(--control-line);
  border-radius: var(--radius);
  background: var(--control-bg);
  color: var(--text);
  text-decoration: none;
  box-shadow: none;
}

.plan-ai-revision-entry-link:hover,
.plan-ai-revision-entry-link:focus-visible {
  border-color: rgb(var(--accent-rgb) / 0.45);
  background: color-mix(in srgb, var(--accent) 7%, var(--control-bg));
}

.plan-ai-revision-entry-copy {
  min-width: 0;
  display: grid;
  gap: 0.12rem;
}

.plan-ai-revision-entry-copy strong {
  font-size: 0.88rem;
  font-weight: 750;
}

.plan-ai-revision-entry-copy span {
  overflow-wrap: anywhere;
  color: var(--muted);
  font-size: 0.73rem;
  line-height: 1.55;
}

.plan-ai-revision-entry-arrow {
  color: var(--muted);
  font-size: 1.45rem;
  line-height: 1;
}

#page-plan-ai-revision {
  position: relative;
  isolation: isolate;
  padding-bottom: calc(1.5rem + env(safe-area-inset-bottom, 0px));
}

/* The shared select menu is fixed. A blurred card creates a containing layer,
   so the active revision card must temporarily release that layer and sit above
   the surrounding form and version rows. */
#page-plan-ai-revision .plan-ai-revision-fieldset:has(.app-select.is-open) {
  position: relative;
  z-index: 10120;
}

#page-plan-ai-revision :is(.plan-ai-revision-primary, .plan-ai-revision-more):has(.app-select.is-open) {
  position: relative;
  z-index: 10121;
  overflow: visible;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}

#page-plan-ai-revision .app-select.is-open .app-select-menu {
  z-index: 10122;
}

.plan-ai-revision-head .page-head-context {
  margin-top: 0.25rem;
  color: var(--muted);
  font-size: 0.78rem;
  line-height: 1.7;
}

.plan-ai-revision-content,
.plan-ai-revision-fieldset {
  display: grid;
  gap: 0.7rem;
}

.plan-ai-revision-fieldset {
  min-width: 0;
  margin: 0;
  padding: 0;
  border: 0;
}

.plan-ai-revision-fieldset:disabled .plan-ai-revision-primary,
.plan-ai-revision-fieldset:disabled .plan-ai-revision-more,
.plan-ai-revision-fieldset:disabled > button {
  opacity: 0.58;
}

.plan-ai-revision-primary,
.plan-ai-revision-more {
  margin: 0;
  box-shadow: none;
}

.plan-ai-revision-primary label,
.plan-ai-revision-more label {
  display: block;
  margin: 0 0 0.32rem;
  font-size: 0.8rem;
  font-weight: 700;
}

.plan-ai-revision-primary textarea,
.plan-ai-revision-more textarea {
  resize: vertical;
}

.plan-ai-revision-primary .field-help {
  margin: 0.35rem 0 0.75rem;
  color: var(--muted);
  font-size: 0.7rem;
  line-height: 1.65;
}

.plan-ai-revision-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.58rem;
}

.plan-ai-revision-more .plan-ai-revision-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.plan-ai-revision-selection {
  margin-top: 0.75rem;
  padding-top: 0.7rem;
  border-top: 1px solid var(--line-soft);
}

.plan-ai-revision-selection-label {
  margin: 0 0 0.48rem;
  font-size: 0.78rem;
  font-weight: 750;
}

.plan-ai-revision-selection-list {
  display: grid;
  gap: 0.42rem;
  max-height: min(48dvh, 25rem);
  overflow: auto;
  overscroll-behavior: contain;
  padding: 0.05rem 0 0.1rem 0.18rem;
}

.plan-ai-revision-choice {
  display: grid !important;
  grid-template-columns: 1.15rem minmax(0, 1fr);
  align-items: center;
  gap: 0.56rem;
  min-height: 3rem;
  margin: 0 !important;
  padding: 0.5rem 0.58rem;
  border: 1px solid var(--control-line);
  border-radius: 0.58rem;
  background: var(--control-bg);
  cursor: pointer;
}

.plan-ai-revision-choice:has(input:checked) {
  border-color: rgb(var(--accent-rgb) / 0.46);
  background: rgb(var(--accent-rgb) / 0.09);
}

.plan-ai-revision-choice input {
  width: 1.05rem;
  height: 1.05rem;
  margin: 0;
  accent-color: var(--accent);
}

.plan-ai-revision-choice > span {
  min-width: 0;
  display: grid;
  gap: 0.08rem;
}

.plan-ai-revision-choice strong {
  overflow-wrap: anywhere;
  font-size: 0.78rem;
  font-weight: 700;
}

.plan-ai-revision-choice small {
  color: var(--muted);
  font-size: 0.67rem;
  font-weight: 500;
}

.plan-ai-revision-session-group {
  display: grid;
  gap: 0.38rem;
}

.plan-ai-revision-session-group + .plan-ai-revision-session-group {
  margin-top: 0.42rem;
  padding-top: 0.58rem;
  border-top: 1px solid var(--line-soft);
}

.plan-ai-revision-session-group h3 {
  margin: 0;
  font-size: 0.76rem;
  font-weight: 750;
}

.plan-ai-revision-more > summary {
  cursor: pointer;
  color: var(--text);
  font-size: 0.82rem;
  font-weight: 750;
}

.plan-ai-revision-more-body {
  display: grid;
  gap: 0.7rem;
  margin-top: 0.75rem;
  padding-top: 0.72rem;
  border-top: 1px solid var(--line-soft);
}

.plan-ai-revision-toggle {
  display: flex !important;
  align-items: center;
  gap: 0.52rem;
  min-height: 2.7rem;
  margin: 0 !important;
  padding: 0.48rem 0.56rem;
  border: 1px solid var(--control-line);
  border-radius: 0.58rem;
  background: var(--control-bg);
  cursor: pointer;
}

.plan-ai-revision-toggle input {
  width: 1.05rem;
  height: 1.05rem;
  margin: 0;
  accent-color: var(--accent);
}

.plan-ai-revision-toggle span {
  font-size: 0.78rem;
  font-weight: 650;
}

#btn-plan-ai-revision-submit {
  margin: 0;
}

.plan-ai-versions-section {
  margin-top: 0.35rem;
  padding-top: 0.82rem;
  border-top: 1px solid var(--line-soft);
}

.plan-ai-versions-heading {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 0.7rem;
  margin-bottom: 0.48rem;
}

.plan-ai-versions-heading h2 {
  margin: 0;
  font-size: 0.92rem;
  font-weight: 800;
}

.plan-ai-versions-list {
  display: grid;
  gap: 0.42rem;
}

.plan-ai-version-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 0.62rem;
  padding: 0.62rem 0.68rem;
  border: 1px solid var(--control-line);
  border-radius: var(--radius);
  background: var(--control-bg);
}

.plan-ai-version-row.is-active {
  border-color: rgb(var(--accent-rgb) / 0.42);
  background: rgb(var(--accent-rgb) / 0.07);
}

.plan-ai-version-main {
  min-width: 0;
  display: grid;
  gap: 0.2rem;
}

.plan-ai-version-title-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.35rem;
}

.plan-ai-version-title-row strong {
  font-size: 0.78rem;
}

.plan-ai-version-title-row span,
.plan-ai-version-main time {
  color: var(--muted);
  font-size: 0.66rem;
}

.plan-ai-version-main p {
  margin: 0;
  overflow-wrap: anywhere;
  color: var(--muted);
  font-size: 0.72rem;
  line-height: 1.6;
}

.plan-ai-version-active,
.plan-ai-version-restore {
  flex: 0 0 auto;
  margin: 0 !important;
  padding: 0.34rem 0.48rem !important;
  border-radius: 0.52rem !important;
  font-size: 0.7rem !important;
  font-weight: 700;
  box-shadow: none !important;
}

.plan-ai-version-active {
  border: 1px solid rgb(var(--accent-rgb) / 0.28);
  background: rgb(var(--accent-rgb) / 0.1);
  color: var(--text);
}

.plan-ai-version-restore {
  min-height: 2rem !important;
  border: 1px solid var(--control-line) !important;
  background: transparent !important;
  color: var(--text) !important;
}

body.keyboard-open #page-plan-ai-revision {
  padding-bottom: calc(1rem + var(--app-keyboard-inset));
}

body.keyboard-open #page-plan-ai-revision :is(input:not([type="checkbox"]), textarea, select, .app-select-trigger) {
  scroll-margin-block: 1rem calc(1.2rem + var(--app-keyboard-inset));
}

@media (max-width: 520px) {
  .plan-ai-revision-grid,
  .plan-ai-revision-more .plan-ai-revision-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .plan-ai-version-row {
    grid-template-columns: minmax(0, 1fr) auto;
  }

  .plan-ai-revision-primary,
  .plan-ai-revision-more {
    padding: 0.72rem;
  }
}

/* Final AI workspace cascade: keep legacy AI styles from overriding the new system. */
:is(#page-ai-plan-quick, #page-plan-ai-revision) .ai-plan-chat-messages {
  height: clamp(16rem, 45dvh, 25rem);
  max-height: 25rem;
  gap: 0.58rem;
  padding: 0.72rem 0.5rem;
  border: 0;
  border-block: 1px solid var(--ai-line);
  border-radius: 0;
  background: transparent;
  scrollbar-gutter: auto;
}

:is(#page-ai-plan-quick, #page-plan-ai-revision) .ai-plan-chat-message {
  max-width: min(90%, 35rem);
  padding: 0.62rem 0.72rem;
  border-radius: 0.5rem;
  font-size: 0.82rem;
  line-height: 1.85;
  box-shadow: none;
}

:is(#page-ai-plan-quick, #page-plan-ai-revision) .ai-plan-chat-message.is-assistant {
  border-color: var(--ai-line);
  color: var(--text);
  background: var(--ai-surface);
}

:is(#page-ai-plan-quick, #page-plan-ai-revision) .ai-plan-chat-message.is-user {
  border-color: rgb(var(--accent-rgb) / 0.22);
  background: rgb(var(--accent-rgb) / 0.08);
}

:is(#page-ai-plan-quick, #page-plan-ai-revision) .ai-plan-chat-composer {
  bottom: calc(0.35rem + env(safe-area-inset-bottom));
  grid-template-columns: minmax(0, 1fr) 2.65rem;
  gap: 0.3rem;
  padding: 0.25rem;
  border-radius: 0.5rem;
  background: var(--card);
  box-shadow: 0 0.45rem 1.35rem rgb(0 0 0 / 0.1);
  backdrop-filter: none;
}

:is(#page-ai-plan-quick, #page-plan-ai-revision) .ai-plan-chat-composer textarea {
  min-height: 2.65rem;
  padding: 0.52rem 0.58rem;
  font-size: 0.82rem;
}

:is(#page-ai-plan-quick, #page-plan-ai-revision) .ai-plan-chat-composer .ai-plan-chat-send {
  width: 2.65rem;
  min-width: 2.65rem;
  min-height: 2.65rem;
  padding: 0;
  border-radius: 0.42rem;
  color: #fff !important;
  background: var(--accent) !important;
  box-shadow: none !important;
}

#page-ai-plan-quick .ai-plan-quick-presets {
  grid-template-columns: minmax(7.5rem, 0.7fr) minmax(0, 1.3fr);
  align-items: start;
  gap: 0.5rem;
}

#page-ai-plan-quick .ai-plan-session-counts {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.35rem;
}

#page-ai-plan-quick .ai-plan-quick-more {
  border: 0;
  border-top: 1px solid var(--ai-line);
  border-radius: 0;
}

#page-ai-plan-quick .ai-plan-chat-finish {
  min-height: 3.25rem;
  border-radius: 0.48rem;
}

@media (max-width: 520px) {
  #page-ai-plan-quick .ai-plan-quick-presets {
    grid-template-columns: minmax(0, 1fr);
  }

  #page-ai-plan-quick .ai-plan-quick-presets .ai-plan-session-count-group {
    grid-column: auto;
  }

  :is(#page-ai-plan-quick, #page-plan-ai-revision) .ai-plan-chat-messages {
    height: clamp(15rem, 42dvh, 22rem);
  }
}

@media (max-width: 360px) {
  #page-ai-plan-quick .ai-plan-session-counts {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* ═══ Fitana Redesign 2.1 — توکن‌های rd-* (تخت و آرام) ═══
   نسخهٔ ۲.۱ گرادیان‌ها را کنار گذاشت؛ مقادیر تختِ همین توکن‌ها منبع پوسته است. */
:root {
  --rd-ex-card-bg: var(--card);
  --rd-sheet-toggle-bg: var(--surface-strong);
  --rd-brand-action: var(--accent);
  --rd-fab-bg: var(--accent);
  --rd-nav-dock-bg: var(--shell-panel);
  --rd-ambient: none;
  --rd-rail-scrim: linear-gradient(
    180deg,
    rgba(10, 10, 13, 0) 26%,
    rgba(10, 10, 13, 0.34) 56%,
    rgba(10, 10, 13, 0.88) 100%
  );
}

/* ═══ کپی ایمنی: هندسهٔ سوییچ جستجو (در برابر کش مخلوط SW) ═══ */
/* ═══ نوع جستجو: دو آیکون دایره‌ای هم‌اندازه داخل نوار جستجو ═══
   هندسه با !important قفل شده تا قوانین عمومی دکمه‌ها (min-height و شعاع)
   نتوانند آن را از کادر بیرون بزنند. */
.search-top-query-row {
  position: relative;
}

.search-mode-switch {
  position: absolute;
  left: 0.45rem;
  top: 0;
  bottom: 0;
  display: flex;
  align-items: center;
  gap: 0.3rem;
  padding: 0;
  border: 0;
  background: transparent;
}

#btn-search-icon-top,
#btn-search-ai,
.search-mode-switch .search-top-query-icon,
.search-mode-switch .search-ai-btn {
  position: relative !important;
  transform: none !important;
  width: 2.1rem !important;
  height: 2.1rem !important;
  min-width: 2.1rem !important;
  min-height: 2.1rem !important;
  max-width: 2.1rem !important;
  max-height: 2.1rem !important;
  margin: 0 !important;
  padding: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  border: 0 !important;
  border-radius: 50% !important;
  background: transparent !important;
  box-shadow: none !important;
  color: var(--muted) !important;
  transition: background 0.15s ease, color 0.15s ease, transform 0.12s ease;
}

.search-mode-switch .search-top-query-icon svg {
  width: 1.15rem;
  height: 1.15rem;
}

#btn-search-ai img,
.search-mode-switch .search-ai-btn img {
  width: 1.15rem !important;
  height: 1.15rem !important;
  filter: var(--app-ui-icon-img-filter);
  opacity: 0.72;
}

.search-mode-switch .search-top-query-icon:hover,
.search-mode-switch .search-ai-btn:hover {
  background: color-mix(in srgb, var(--text) 7%, transparent) !important;
}

.search-mode-switch .search-top-query-icon:focus-visible,
.search-mode-switch .search-ai-btn:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 1px;
  box-shadow: none !important;
}

#btn-search-ai.is-on,
.search-mode-switch .search-ai-btn.is-on {
  background: var(--accent) !important;
}

#btn-search-ai.is-on img,
.search-mode-switch .search-ai-btn.is-on img {
  filter: brightness(0) invert(1) !important;
  opacity: 1;
}

.search-mode-switch .search-top-query-icon:active,
.search-mode-switch .search-ai-btn:active {
  transform: scale(0.9) !important;
}

/* اسپینر لودینگ دقیقاً وسط همان دایره؛ نه وسط سوییچ */
#btn-search-icon-top.is-loading::after,
#btn-search-ai.is-loading::after {
  inset: 0 !important;
  margin: auto !important;
  width: 1.05rem !important;
  height: 1.05rem !important;
  border-color: rgb(var(--accent-rgb) / 0.25);
  border-top-color: var(--accent);
}

#btn-search-ai.is-on.is-loading::after {
  border-color: rgba(255, 255, 255, 0.4);
  border-top-color: #ffffff;
}

#btn-search-ai.is-loading img {
  opacity: 0 !important;
}

/* جای دو آیکون در سمت چپ ورودی */
#page-search .search-top-q-input,
.search-top-q-input {
  padding-inline-end: 0.9rem;
  padding-left: 5.5rem !important;
}

.search-status .search-ai-exit {
  display: inline;
  min-height: 0;
  min-width: 0;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--accent);
  font-size: inherit;
  font-weight: 700;
  text-decoration: underline;
  cursor: pointer;
}