@import url('https://cdn.jsdelivr.net/gh/rastikerdar/vazirmatn@v33.003/Vazirmatn-font-face.css');

* { box-sizing: border-box; }

:root {
  --bg: #0b0d11;
  --bg-gradient: radial-gradient(circle at 20% 0%, #1a1512 0%, #0b0d11 45%), radial-gradient(circle at 100% 100%, #12181a 0%, #0b0d11 55%);
  --card: rgba(255,255,255,.045);
  --card-2: rgba(255,255,255,.03);
  --card-solid: #171a21;
  --border: rgba(255,255,255,.09);
  --text: #f3f5f8;
  --muted: #9aa3b2;
  --accent: #e50914;
  --accent-2: #ff4d4d;
  --success: #3ddc97;
  --danger: #ff5c72;
  --shadow: 0 8px 30px rgba(0,0,0,.35);
  --glass-blur: blur(22px) saturate(180%);
  color-scheme: dark;
}

/* V84 — unified discoverable navigation */
.mobile-panel-bar,.panel-menu-backdrop{display:none}
.public-menu-toggle{
  width:46px;height:46px;border:1px solid rgba(255,255,255,.15);border-radius:50%;
  background:rgba(17,18,20,.82);display:flex;flex-direction:column;align-items:center;
  justify-content:center;gap:5px;cursor:pointer;color:#fff;flex:0 0 auto;
  backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)
}
.public-menu-toggle span,.panel-menu-toggle span{display:block;width:19px;height:2px;border-radius:3px;background:currentColor;transition:.25s}
.public-menu-backdrop{
  position:fixed;inset:0;z-index:2200;border:0;background:rgba(0,0,0,.7);
  opacity:0;visibility:hidden;transition:.25s
}
.public-menu-drawer{
  position:fixed;z-index:2201;top:0;right:0;width:min(440px,92vw);height:100svh;
  padding:24px;background:linear-gradient(155deg,#171719 0%,#09090a 64%);
  border-left:1px solid rgba(229,9,20,.32);box-shadow:-30px 0 80px rgba(0,0,0,.55);
  transform:translateX(105%);transition:transform .3s ease;overflow:auto;direction:rtl
}
.public-menu-open .public-menu-backdrop{opacity:1;visibility:visible}
.public-menu-open .public-menu-drawer{transform:translateX(0)}
.public-menu-open{overflow:hidden}
.public-menu-head{display:flex;align-items:flex-start;justify-content:space-between;padding-bottom:22px;border-bottom:1px solid rgba(255,255,255,.1)}
.public-menu-head small{display:block;color:var(--accent);font-size:10px;letter-spacing:2px;margin-bottom:8px}
.public-menu-head strong{font-size:18px;color:#fff}
.public-menu-head button{width:40px;height:40px;border-radius:50%;border:1px solid rgba(255,255,255,.14);background:#202023;color:#fff;font-size:26px;cursor:pointer}
.public-menu-drawer nav{display:grid;gap:7px;padding:20px 0}
.public-menu-drawer nav a{
  display:grid;grid-template-columns:18px 1fr;column-gap:7px;align-items:center;min-height:54px;padding:8px 13px;
  border:1px solid rgba(255,255,255,.07);border-radius:14px;background:rgba(255,255,255,.025);
  text-decoration:none;color:#fff;transition:.2s
}
.public-menu-drawer nav a:hover{border-color:rgba(229,9,20,.55);background:rgba(229,9,20,.1);transform:translateX(-3px)}
.public-menu-drawer nav span{color:#fff;font:700 11px Arial;direction:rtl;text-align:center}
.public-menu-drawer nav b{font-size:14px}
.public-menu-actions{display:grid;grid-template-columns:1fr 1fr;gap:9px;padding-top:16px;border-top:1px solid rgba(255,255,255,.1)}
.public-menu-actions a{text-align:center;padding:12px;border-radius:12px;text-decoration:none;color:#fff;background:var(--accent);font-weight:800}
.public-menu-actions a:first-child{background:#252528;border:1px solid rgba(255,255,255,.1)}

@media(max-width:860px){
  .product-shell .app-shell{grid-template-rows:72px 1fr}
  .mobile-panel-bar{
    position:sticky;top:0;z-index:2102;display:grid;grid-template-columns:48px 1fr 38px;
    align-items:center;gap:10px;height:72px;padding:9px 12px;
    background:linear-gradient(105deg,rgba(230,22,35,.96),rgba(158,7,17,.96));
    border-bottom:1px solid rgba(255,255,255,.16);box-shadow:0 10px 30px rgba(0,0,0,.3);
    backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)
  }
  .panel-menu-toggle{
    width:46px;height:46px;border:1px solid rgba(255,255,255,.2);border-radius:15px;
    background:rgba(4,4,5,.25);color:#fff;display:flex;flex-direction:column;
    align-items:center;justify-content:center;gap:5px;cursor:pointer
  }
  .mobile-panel-heading{min-width:0;text-align:center;color:#fff}
  .mobile-panel-heading small{display:block;font-size:9px;opacity:.7;margin-bottom:3px}
  .mobile-panel-heading strong{display:block;font-size:15px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .mobile-panel-logo{width:55px;height:32px;object-fit:contain}
  .panel-menu-backdrop{
    position:fixed;display:block;inset:0;z-index:2098;background:rgba(0,0,0,.72);
    border:0;opacity:0;visibility:hidden;transition:.25s
  }
  .product-shell .app-sidebar{
    position:fixed!important;z-index:2101!important;top:0!important;right:0!important;bottom:0!important;
    width:min(390px,88vw)!important;height:100svh!important;padding:88px 14px 22px!important;
    display:flex!important;flex-direction:column!important;align-items:stretch!important;gap:7px!important;
    overflow-y:auto!important;overflow-x:hidden!important;background:linear-gradient(160deg,#1a1a1d,#080809 68%)!important;
    border-left:1px solid rgba(229,9,20,.35)!important;box-shadow:-28px 0 70px rgba(0,0,0,.55)!important;
    transform:translateX(105%);transition:transform .3s ease!important
  }
  .panel-menu-open .app-sidebar{transform:translateX(0)}
  .panel-menu-open .panel-menu-backdrop{opacity:1;visibility:visible}
  .panel-menu-open{overflow:hidden}
  .product-shell .app-sidebar .brand{
    display:flex!important;position:absolute;top:18px;right:18px;left:18px;height:52px;
    padding-bottom:14px;border-bottom:1px solid rgba(255,255,255,.1)
  }
  .product-shell .app-sidebar .brand-text{display:flex!important}
  .product-shell .app-sidebar .brand-logo{display:block!important}
  .product-shell .app-sidebar .mobile-swipe-hint{display:none!important}
  .product-shell .app-sidebar .athlete-quick-links{
    display:grid!important;grid-template-columns:repeat(3,1fr);height:auto!important;margin:0 0 7px!important
  }
  .product-shell .app-sidebar .athlete-quick-links a{min-width:0!important;height:42px!important;font-size:10px}
  .product-shell .sidebar-link{
    flex:0 0 auto!important;width:100%!important;min-width:0!important;min-height:52px!important;
    padding:11px 13px!important;display:flex!important;flex-direction:row!important;justify-content:flex-start!important;
    gap:11px!important;font-size:13px!important;border-radius:13px!important;scroll-snap-align:none!important
  }
  .product-shell .sidebar-link.active{background:linear-gradient(105deg,#e11623,#a60711)!important}
  .product-shell .sidebar-link.active::after{display:none!important}
  .product-shell .sidebar-spacer{display:block!important;min-height:8px}
}

html[data-theme="light"] {
  --bg: #f2f4f8;
  --bg-gradient: radial-gradient(circle at 20% 0%, #dbe8ff 0%, #f2f4f8 40%), radial-gradient(circle at 100% 100%, #e3edf3 0%, #f2f4f8 55%);
  --card: rgba(255,255,255,.75);
  --card-2: rgba(255,255,255,.55);
  --card-solid: #ffffff;
  --border: rgba(20,25,35,.09);
  --text: #171a21;
  --muted: #6b7280;
  --accent: #2563eb;
  --accent-2: #1d4ed8;
  --success: #0d9668;
  --danger: #dc2f47;
  --shadow: 0 8px 30px rgba(30,35,50,.09);
  color-scheme: light;
}

html, body {
  margin: 0; padding: 0; min-height: 100%;
  background: var(--bg-gradient), var(--bg);
  background-attachment: fixed;
  color: var(--text);
  font-family: 'Vazirmatn', Tahoma, sans-serif;
  direction: rtl;
  transition: background-color .25s, color .25s;
}
a { color: inherit; }
.container { max-width: 1000px; margin: 0 auto; padding: 20px; }
body.admin .container { max-width: 1560px; }

/* چیدمان دوستونه‌ی پهلوبه‌پهلو برای پنل مدیریت — بخش‌های مستقل کنار هم بنشینند، نه زیر هم */
.admin-columns {
  display: grid; grid-template-columns: 1fr 1fr; gap: 16px; align-items: start;
}
@media (max-width: 1100px) { .admin-columns { grid-template-columns: 1fr; } }
.admin-columns-3 {
  display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 16px; align-items: start;
}
@media (max-width: 1300px) { .admin-columns-3 { grid-template-columns: 1fr 1fr; } }
@media (max-width: 800px) { .admin-columns-3 { grid-template-columns: 1fr; } }

/* ---------- Glass helper ---------- */
.glass {
  background: var(--card);
  border: 1px solid var(--border);
  backdrop-filter: var(--glass-blur);
  -webkit-backdrop-filter: var(--glass-blur);
}

/* ---------- Navbar ---------- */
.navbar {
  display: flex; justify-content: space-between; align-items: center;
  padding: 14px 22px; border-bottom: 1px solid var(--border);
  background: var(--card);
  backdrop-filter: var(--glass-blur); -webkit-backdrop-filter: var(--glass-blur);
  position: sticky; top: 0; z-index: 30;
}
.navbar .brand { font-weight: 800; font-size: 19px; color: var(--accent); display: flex; align-items: center; gap: 10px; text-decoration: none; }
.brand-logo { height: 42px; width: 72px; max-width: 72px; object-fit: contain; object-position: right center; display: block; }
.brand-text { display: flex; flex-direction: column; line-height: 1.3; }
.brand-title { font-size: 15px; font-weight: 800; }
.brand-sub { font-size: 10px; font-weight: 500; color: var(--muted); direction: ltr; letter-spacing: .2px; }
.navbar-links { display: flex; align-items: center; gap: 8px; }
.navbar a.nav-link {
  color: var(--muted); text-decoration: none; font-size: 14px;
  padding: 8px 14px; border-radius: 10px; transition: background .15s, color .15s;
}
.navbar a.nav-link:hover { color: var(--text); background: var(--card-2); }

.navbar.overlay {
  position: absolute; top: 12px; left: 14px; right: 14px; z-index: 20;
  background: transparent; border: none; box-shadow: none; backdrop-filter: none;
}
/* هر آیتم نوار روی کاور، خودش یک تب شیشه‌ای جدا (نه یک جعبه‌ی یکپارچه) */
.navbar.overlay .brand,
.navbar.overlay a.nav-link,
.navbar.overlay span.nav-link {
  background: rgba(10,10,14,.5);
  border: 1px solid rgba(255,255,255,.14);
  backdrop-filter: var(--glass-blur); -webkit-backdrop-filter: var(--glass-blur);
  box-shadow: 0 6px 18px rgba(0,0,0,.25);
  border-radius: 12px; padding: 6px 14px; font-size: 13px;
}
.navbar.overlay .brand { color: var(--accent); border-radius: 14px; padding: 6px 14px; font-size: 16px; }
.navbar.overlay a.nav-link,
.navbar.overlay span.nav-link { color: rgba(255,255,255,.9); }
.navbar.overlay a.nav-link:hover { background: rgba(255,255,255,.16); color: #fff; }

.theme-toggle {
  width: 38px; height: 38px; border-radius: 50%; border: 1px solid var(--border);
  background: var(--card-2); color: var(--text); cursor: pointer; font-size: 16px;
  display: inline-flex; align-items: center; justify-content: center; margin-inline-start: 6px;
  transition: background .15s;
}
.theme-toggle:hover { background: var(--border); }
.theme-toggle,
.sidebar-link:has(.theme-icon) { display: none !important; }

/* ---------- Hero ---------- */
.hero {
  min-height: 100vh;
  display: flex; align-items: center; justify-content: flex-start;
  position: relative;
  direction: ltr;
  background:
    linear-gradient(90deg, rgba(9,10,13,.92) 0%, rgba(9,10,13,.72) 32%, rgba(9,10,13,.25) 62%, rgba(9,10,13,.05) 100%),
    url('/images/hero.jpg?v=240') 76% 12% / cover no-repeat;
}
html[data-theme="light"] .hero {
  background:
    linear-gradient(90deg, rgba(8,9,12,.86) 0%, rgba(8,9,12,.62) 32%, rgba(8,9,12,.2) 62%, rgba(8,9,12,.04) 100%),
    url('/images/hero-light.jpg?v=240') 72% 15% / cover no-repeat;
}
.hero-inner { padding: 40px 20px; text-align: right; max-width: 720px; }
.hero-split { direction: rtl; }
.hero h1 { font-size: 42px; margin: 0 0 14px; font-weight: 800; text-shadow: 0 4px 20px rgba(0,0,0,.7); color: #fff; line-height: 1.25; }
.hero-highlight { color: var(--accent); font-size: 0.8em; }
.hero p { color: rgba(255,255,255,.8); font-size: 14px; margin: 0 0 22px; text-shadow: 0 2px 10px rgba(0,0,0,.6); }

.hero-eyebrow {
  color: var(--accent); font-size: 13px; font-weight: 700; margin-bottom: 10px;
  text-shadow: 0 2px 8px rgba(0,0,0,.6);
}

.hero-features { list-style: none; margin: 0 0 26px; padding: 0; display: flex; flex-direction: column; gap: 16px; }
.hero-features li {
  display: flex; align-items: center; gap: 12px;
}
.feature-icon-badge {
  width: 42px; height: 42px; flex-shrink: 0; border-radius: 12px;
  display: flex; align-items: center; justify-content: center;
  background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.14);
  color: var(--accent); backdrop-filter: blur(6px);
}
.feature-text { display: flex; flex-direction: column; gap: 2px; }
.feature-text b {
  color: rgba(255,255,255,.95); font-size: 14px; font-weight: 700;
  text-shadow: 0 2px 8px rgba(0,0,0,.6);
}
.feature-text small {
  color: rgba(255,255,255,.65); font-size: 12px;
  text-shadow: 0 2px 8px rgba(0,0,0,.6);
}

.hero-ctas { display: flex; gap: 14px; flex-wrap: wrap; }
.hero-btn { padding: 15px 28px; font-size: 15px; border-radius: 14px; box-shadow: 0 8px 28px rgba(255,106,61,.4); box-shadow: 0 8px 28px color-mix(in srgb, var(--accent) 40%, transparent); }
.hero-btn.secondary-cta {
  background: rgba(255,255,255,.1); color: #fff; border: 1px solid rgba(255,255,255,.35);
  box-shadow: none; backdrop-filter: blur(8px);
}
@media (max-width: 900px) {
  .hero {
    background-image: linear-gradient(90deg, rgba(9,10,13,.92) 0%, rgba(9,10,13,.72) 32%, rgba(9,10,13,.25) 62%, rgba(9,10,13,.05) 100%), url('/images/hero.jpg?v=240') !important;
    background-position: 100% 10% !important;
    justify-content: center; align-items: flex-end; text-align: center;
  }
  html[data-theme="light"] .hero {
    background-image: linear-gradient(90deg, rgba(8,9,12,.86) 0%, rgba(8,9,12,.62) 32%, rgba(8,9,12,.2) 62%, rgba(8,9,12,.04) 100%), url('/images/hero-light.jpg?v=240') !important;
    background-position: 100% 12% !important;
  }
  .hero-inner { text-align: center; max-width: 92vw; }
  .hero-features { align-items: center; }
  .hero-features li { text-align: right; }
  .hero-ctas { justify-content: center; }
}
@media (max-width: 640px) {
  .hero {
    min-height: 100vh; padding: 20px 0 34px;
    background-image: linear-gradient(90deg, rgba(9,10,13,.92) 0%, rgba(9,10,13,.72) 32%, rgba(9,10,13,.25) 62%, rgba(9,10,13,.05) 100%), url('/images/hero.jpg?v=240') !important;
    background-position: 95% 8% !important;
  }
  html[data-theme="light"] .hero {
    background-image: linear-gradient(90deg, rgba(8,9,12,.86) 0%, rgba(8,9,12,.62) 32%, rgba(8,9,12,.2) 62%, rgba(8,9,12,.04) 100%), url('/images/hero-light.jpg?v=240') !important;
    background-position: 86% 10% !important;
  }
  .hero-inner { padding: 16px 16px; }
  .hero-eyebrow { font-size: 10px; margin-bottom: 6px; }
  .hero h1 { font-size: 20px; margin-bottom: 6px; line-height: 1.3; }
  .hero p { font-size: 12px; margin-bottom: 12px; }
  .hero-features { display: none; }
  .hero-ctas { gap: 8px; }
  .hero-btn { padding: 9px 14px; font-size: 11.5px; border-radius: 10px; }
}

/* ==========================================================
   V60 — unified product workspace (coach + athlete)
   ========================================================== */
.product-shell {
  min-height: 100svh;
  color: var(--sn-white);
  background:
    radial-gradient(circle at 88% 8%, rgba(240,43,53,.09), transparent 25rem),
    linear-gradient(135deg, #08090a 0%, #0d0f11 52%, #08090a 100%);
}
.product-shell,
.product-shell input,
.product-shell select,
.product-shell textarea,
.product-shell button {
  font-family: inherit;
}
.product-shell h1,
.product-shell h2,
.product-shell h3,
.product-shell p,
.product-shell label,
.product-shell td,
.product-shell th,
.product-shell span {
  word-break: normal;
  overflow-wrap: normal;
}
.product-shell h1,
.product-shell h2,
.product-shell h3 { text-wrap: balance; }
.product-shell p { text-wrap: pretty; }

.product-shell .app-shell {
  width: 100%;
  max-width: 1920px;
  margin-inline: auto;
}
.product-shell .app-sidebar {
  width: 276px;
  z-index: 30;
  padding: 22px 14px 18px;
  gap: 3px;
  background:
    linear-gradient(180deg, rgba(19,21,24,.98), rgba(10,11,13,.98));
  border-inline-start: 1px solid rgba(255,255,255,.075);
  box-shadow: -18px 0 60px rgba(0,0,0,.22);
  backdrop-filter: blur(22px);
}
.product-shell .app-sidebar::before {
  content: "";
  position: absolute;
  inset: 0 0 auto;
  height: 2px;
  background: linear-gradient(90deg, transparent, var(--sn-red), transparent);
}
.product-shell .app-sidebar .brand {
  min-height: 70px;
  margin-bottom: 12px;
  padding: 6px 10px 18px;
  color: var(--sn-white);
  border-bottom: 1px solid var(--sn-line);
}
.product-shell .app-sidebar .brand-logo {
  width: 40px;
  height: 40px;
  border-radius: 10px;
  box-shadow: 0 0 0 1px rgba(255,255,255,.12), 0 10px 25px rgba(0,0,0,.35);
}
.product-shell .app-sidebar .brand-text {
  display: grid;
  gap: 4px;
  min-width: 0;
}
.product-shell .app-sidebar .brand-title {
  font-size: 14px;
  font-weight: 850;
}
.product-shell .app-sidebar .brand-sub {
  color: rgba(255,255,255,.38);
  font: 700 8px/1.2 Arial,sans-serif;
  letter-spacing: 1.45px;
  direction: ltr;
}
.product-shell .sidebar-link {
  position: relative;
  min-height: 43px;
  padding: 10px 12px;
  border-radius: 10px;
  color: rgba(255,255,255,.55);
  font-size: 12.5px;
  font-weight: 650;
}
.product-shell .sidebar-link:hover {
  color: #fff;
  background: rgba(255,255,255,.055);
  transform: translateX(-2px);
}
.product-shell .sidebar-link.active {
  color: #fff;
  background: linear-gradient(90deg, rgba(240,43,53,.95), rgba(191,27,38,.82));
  box-shadow: 0 10px 25px rgba(240,43,53,.14);
}
.product-shell .sidebar-link.active::after {
  content: "";
  position: absolute;
  inset: 10px auto 10px -7px;
  width: 2px;
  border-radius: 3px;
  background: #fff;
}
.product-shell .app-main {
  padding: clamp(22px,3.1vw,48px);
  background:
    linear-gradient(rgba(255,255,255,.018) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.018) 1px, transparent 1px);
  background-size: 54px 54px;
}
.product-shell .app-main > h2 {
  display: flex;
  align-items: center;
  gap: 11px;
  margin: 0 0 7px !important;
  color: #fff;
  font-size: clamp(22px,2.4vw,34px) !important;
  letter-spacing: -.8px;
}
.product-shell .app-main > h2::before {
  content: "";
  width: 4px;
  height: 27px;
  border-radius: 4px;
  background: var(--sn-red);
  box-shadow: 0 0 20px rgba(240,43,53,.35);
}
.product-shell .app-main > .muted {
  color: rgba(255,255,255,.4);
  font-size: 11.5px;
}
.product-shell .tab-panel {
  min-height: calc(100svh - 160px);
  animation: productPanelIn .28s var(--sn-ease);
}
@keyframes productPanelIn {
  from { opacity: 0; transform: translateY(8px); }
  to { opacity: 1; transform: none; }
}
.product-shell .card,
.product-shell .stat-card,
.product-shell .chart-wrap,
.product-shell details.fold {
  border: 1px solid rgba(255,255,255,.075);
  background:
    linear-gradient(145deg, rgba(255,255,255,.055), rgba(255,255,255,.022));
  box-shadow: 0 22px 65px rgba(0,0,0,.18);
  backdrop-filter: blur(16px);
}
.product-shell input,
.product-shell select,
.product-shell textarea {
  color: #fff;
  background: rgba(3,4,5,.68);
  border: 1px solid rgba(255,255,255,.105);
}
.product-shell input:focus,
.product-shell select:focus,
.product-shell textarea:focus {
  border-color: rgba(240,43,53,.7);
  box-shadow: 0 0 0 3px rgba(240,43,53,.09);
}
.product-shell .btn:not(.secondary):not(.danger) {
  background: linear-gradient(135deg, #f02b35, #c91d29);
  box-shadow: 0 9px 24px rgba(240,43,53,.14);
}
.product-shell table {
  overflow: hidden;
  border-collapse: separate;
  border-spacing: 0;
  border: 1px solid rgba(255,255,255,.075);
  border-radius: 13px;
  background: rgba(8,9,10,.5);
}
.product-shell th {
  color: rgba(255,255,255,.5);
  background: rgba(255,255,255,.035);
  font-size: 10.5px;
  letter-spacing: .15px;
}
.product-shell td { border-color: rgba(255,255,255,.055); }
.product-shell .modal-panel {
  max-height: min(88svh,900px);
  min-height: 0;
  overflow-y: auto;
  overflow-x: hidden;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
}
body.modal-open { overflow: hidden; }

/* Mobile is a real panel switch: one complete panel, horizontal nav, no split view. */
@media (max-width: 860px) {
  .product-shell .app-shell {
    display: grid;
    grid-template-rows: auto 1fr;
    min-height: 100svh;
  }
  .product-shell .app-sidebar {
    position: sticky;
    top: 0;
    width: 100%;
    height: auto;
    padding: 8px 10px;
    flex-direction: row;
    gap: 5px;
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
    border: 0;
    border-bottom: 1px solid rgba(255,255,255,.08);
  }
  .product-shell .app-sidebar::-webkit-scrollbar { display: none; }
  .product-shell .app-sidebar .brand,
  .product-shell .sidebar-spacer { display: none; }
  .product-shell .sidebar-link {
    flex: 0 0 auto;
    min-width: 90px;
    min-height: 58px;
    padding: 8px 10px;
    justify-content: center;
    flex-direction: column;
    gap: 5px;
    font-size: 10px;
    scroll-snap-align: center;
  }
  .product-shell .sidebar-link.active::after {
    inset: auto 22px -4px;
    width: auto;
    height: 2px;
  }
  .product-shell .app-main {
    width: 100%;
    min-width: 0;
    padding: 20px 14px 38px;
  }
  .product-shell .tab-panel {
    width: 100%;
    min-height: calc(100svh - 138px);
    scroll-margin-top: 78px;
  }
  .product-shell .row2,
  .product-shell .row3 { grid-template-columns: minmax(0,1fr); }
  .product-shell table {
    display: block;
    width: 100%;
    max-width: 100%;
    overflow-x: auto;
    overscroll-behavior-inline: contain;
  }
}

/* V105 — editable card crop; the detail dialog always keeps the full poster visible. */
.purchase-plan-card .plan-visual img{
  object-position:var(--cover-x,50%) var(--cover-y,50%);
  transform:scale(var(--cover-scale,1));
  transform-origin:var(--cover-x,50%) var(--cover-y,50%);
  filter:grayscale(.18) contrast(1.07) saturate(.98)
}
.purchase-plan-card:hover .plan-visual img{
  transform:scale(var(--cover-scale,1));
  filter:grayscale(.03) contrast(1.09) saturate(1)
}
.purchase-plan-card .plan-summary{gap:5px;padding:9px 13px 11px}
.purchase-plan-card .plan-reveal-btn{padding:6px 9px}
.purchase-plan-dialog{width:min(900px,100%);max-width:900px}
.purchase-dialog-hero img{
  width:100%;height:100%;object-fit:contain;object-position:center;
  transform:none!important;filter:none
}
.purchase-dialog-hero>i{
  background:linear-gradient(0deg,rgba(8,9,11,.24),transparent 34%)
}
.admin-plan-visual img{
  object-position:var(--cover-x,50%) var(--cover-y,50%);
  transform:scale(var(--cover-scale,1));
  transform-origin:var(--cover-x,50%) var(--cover-y,50%)
}
.plan-cover-editor{margin-top:10px}
.plan-cover-stage{
  position:relative;aspect-ratio:16/9;overflow:hidden;
  border:1px solid rgba(255,255,255,.14);border-radius:3px 16px 3px 3px;background:#030405
}
.plan-cover-stage img{
  width:100%;height:100%;display:block;object-fit:cover;
  object-position:var(--cover-x,50%) var(--cover-y,50%);
  transform:scale(var(--cover-scale,1));
  transform-origin:var(--cover-x,50%) var(--cover-y,50%)
}
.plan-cover-editor small{
  display:block;margin-top:7px;color:var(--muted);font-size:11px;line-height:1.7
}
.plan-cover-controls{
  grid-template-columns:auto minmax(190px,1fr) auto;align-items:center;gap:14px;
  margin-top:10px;padding:11px;border:1px solid rgba(255,255,255,.09);
  background:rgba(255,255,255,.025)
}
.plan-cover-pad{
  display:grid;grid-template-columns:repeat(3,34px);grid-template-rows:repeat(3,34px);
  gap:3px;direction:ltr
}
.plan-cover-pad button{
  display:grid;place-items:center;padding:0;border:1px solid rgba(255,255,255,.14);
  border-radius:7px;background:#111318;color:#fff;font-size:17px;cursor:pointer
}
.plan-cover-pad button:hover{border-color:var(--red);box-shadow:0 0 14px rgba(240,43,53,.24)}
.plan-cover-pad button:nth-child(1){grid-column:2;grid-row:1}
.plan-cover-pad button:nth-child(2){grid-column:3;grid-row:2}
.plan-cover-pad button:nth-child(3){grid-column:2;grid-row:3}
.plan-cover-pad button:nth-child(4){grid-column:1;grid-row:2}
.plan-cover-zoom{
  display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:9px;margin:0
}
.plan-cover-zoom input{margin:0;padding:0}
.plan-cover-zoom output{min-width:42px;color:#fff;font-size:11px;text-align:left}
.plan-cover-reset{white-space:nowrap}
@media(max-width:650px){
  .plan-cover-controls{grid-template-columns:auto 1fr}
  .plan-cover-reset{grid-column:1/-1}
}

@media (max-width: 520px) {
  .product-shell .app-main > h2 {
    font-size: 21px !important;
  }
  .product-shell .card { padding: 14px !important; }
  .product-shell .modal-backdrop {
    padding: 10px;
    align-items: flex-end;
  }
  .product-shell .modal-panel {
    width: 100% !important;
    max-width: none !important;
    max-height: 92svh;
    border-radius: 20px 20px 5px 5px !important;
  }
  .product-shell .tile-grid {
    grid-template-columns: repeat(2,minmax(0,1fr));
  }
}

/* ---------- Layout / Grid ---------- */
.grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 16px; }

.card {
  background: var(--card); border: 1px solid var(--border); border-radius: 18px;
  padding: 20px; display: flex; flex-direction: column; gap: 8px;
  backdrop-filter: var(--glass-blur); -webkit-backdrop-filter: var(--glass-blur);
  box-shadow: var(--shadow);
  transition: transform .18s ease, box-shadow .18s ease;
}
.card:hover { transform: translateY(-3px); box-shadow: 0 14px 34px rgba(0,0,0,.18); }

@keyframes fadeInUp {
  from { opacity: 0; transform: translateY(6px); }
  to { opacity: 1; transform: translateY(0); }
}
.tab-panel, .page-panel { animation: fadeInUp .3s ease; }
.page-panel { min-height: 75vh; }
.card h3 { margin: 0; font-size: 18px; }
.badge {
  display: inline-block; font-size: 12px; padding: 4px 12px; border-radius: 999px;
  background: var(--card-2); color: var(--muted); width: fit-content; border: 1px solid var(--border);
}
.price { font-size: 22px; font-weight: 800; color: var(--accent); }
.price small { font-size: 13px; color: var(--muted); font-weight: 400; }
.desc { color: var(--muted); font-size: 14px; line-height: 1.9; white-space: pre-line; }
.system-execution-preview,
.athlete-system {
  display: block; margin-top: 9px; padding: 9px 11px;
  border: 1px solid rgba(240,43,53,.26); border-right: 3px solid var(--sn-red, #f02b35);
  background: rgba(240,43,53,.07); color: var(--text); border-radius: 9px;
  font-size: 11.5px; line-height: 1.8;
}
.system-execution-preview span { color: var(--muted); }
.media-editor-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); gap:14px; margin-top:14px; }
.media-editor-card { padding:14px; border:1px solid var(--border); border-radius:14px; background:rgba(255,255,255,.025); display:grid; gap:9px; }
.media-editor-preview { height:220px; overflow:hidden; border-radius:10px; background:#050506; border:1px solid var(--border); }
.media-editor-preview.hero-ratio { height:150px; }
.media-editor-preview img { width:100%; height:100%; object-fit:cover; display:block; }
.media-editor-card label { font-size:12px; color:var(--muted); }
.media-editor-card input[type="range"] { padding:0; }
.plans-showcase { display:grid; grid-template-columns:repeat(auto-fit,minmax(300px,1fr)); gap:20px; align-items:stretch; }
.purchase-plan-card { position:relative; overflow:hidden; border:1px solid rgba(255,255,255,.1); border-radius:4px 26px 4px 4px; background:linear-gradient(155deg,#111216,#08090b 70%); box-shadow:0 28px 70px rgba(0,0,0,.35); transition:transform .35s ease,border-color .35s ease; }
.purchase-plan-card:hover { transform:translateY(-7px); border-color:color-mix(in srgb,var(--plan-accent) 58%,transparent); }
.purchase-plan-card.featured { box-shadow:0 30px 80px color-mix(in srgb,var(--plan-accent) 14%,transparent); }
.plan-visual { height:190px; position:relative; overflow:hidden; background:radial-gradient(circle at 30% 20%,color-mix(in srgb,var(--plan-accent) 24%,transparent),transparent 48%),#0b0c0e; }
.plan-visual img { width:100%; height:100%; object-fit:cover; filter:grayscale(.7) contrast(1.08); }
.plan-visual-shade { position:absolute; inset:0; background:linear-gradient(0deg,#101115,transparent 65%),linear-gradient(90deg,transparent,rgba(0,0,0,.35)); }
.plan-watermark { position:absolute; inset:10px 22px auto auto; font:900 100px/1 Arial; color:rgba(255,255,255,.04); letter-spacing:-10px; }
.plan-featured-label,.plan-category { position:absolute; top:18px; padding:6px 10px; font-size:10px; font-weight:800; letter-spacing:.3px; }
.plan-featured-label { right:18px; background:var(--plan-accent); color:#fff; }
.plan-category { left:18px; border:1px solid rgba(255,255,255,.2); background:rgba(0,0,0,.55); color:#fff; backdrop-filter:blur(8px); }
.plan-content { padding:6px 22px 22px; display:flex; flex-direction:column; gap:13px; }
.plan-kicker { color:var(--plan-accent); font:700 9px/1 Arial; letter-spacing:2.2px; direction:ltr; text-align:right; }
.plan-content h3 { font-size:25px; margin:0; }
.plan-content .desc { min-height:52px; font-size:13px; }
.plan-start-price { display:grid; grid-template-columns:auto 1fr; align-items:end; gap:3px 10px; padding:14px 0; border-top:1px solid rgba(255,255,255,.08); border-bottom:1px solid rgba(255,255,255,.08); }
.plan-start-price span,.plan-start-price small { color:var(--muted); font-size:10px; }
.plan-start-price strong { grid-row:span 2; font-size:26px; color:#fff; }
.plan-duration-list { display:grid; gap:7px; }
.plan-duration-option { display:flex; gap:10px; align-items:center; padding:10px 11px; border:1px solid rgba(255,255,255,.08); background:rgba(255,255,255,.025); cursor:pointer; transition:.2s; }
.plan-duration-option:has(input:checked) { border-color:var(--plan-accent); background:color-mix(in srgb,var(--plan-accent) 9%,transparent); }
.plan-duration-option input { width:auto; accent-color:var(--plan-accent); }
.plan-duration-option span { display:flex; justify-content:space-between; align-items:center; width:100%; gap:8px; }
.plan-duration-option b { font-size:12px; }.plan-duration-option small { color:var(--muted); font-size:11px; }.plan-duration-option em { color:var(--plan-accent); font-style:normal; font-size:9px; }
.plan-buy-btn { display:flex; align-items:center; justify-content:space-between; width:100%; padding:14px 16px; border:0; background:var(--plan-accent); color:#fff; font-weight:800; cursor:pointer; box-shadow:0 10px 28px color-mix(in srgb,var(--plan-accent) 25%,transparent); }
.plan-buy-btn b { font-size:20px; }.plan-buy-btn.sold-out { background:#25262a; color:var(--muted); box-shadow:none; cursor:not-allowed; }

/* V101: plan covers stay compact; full copy and duration choices open in one centered view. */
.plans-showcase{grid-template-columns:repeat(auto-fit,minmax(min(280px,100%),1fr));gap:clamp(12px,1.25vw,20px);align-content:center;min-height:calc(100svh - 150px)}
.purchase-plan-card{display:grid;grid-template-rows:minmax(0,1fr) auto;min-height:clamp(260px,35vh,390px);cursor:pointer;box-shadow:0 24px 65px rgba(0,0,0,.42),0 0 0 1px color-mix(in srgb,var(--plan-accent) 5%,transparent);transition:transform .35s ease,border-color .35s ease,box-shadow .35s ease}
.purchase-plan-card::before{content:"";position:absolute;z-index:5;inset:-1px auto auto -1px;width:42%;height:2px;background:linear-gradient(90deg,transparent,var(--plan-accent),#fff);box-shadow:0 0 10px var(--plan-accent),0 0 28px color-mix(in srgb,var(--plan-accent) 65%,transparent);animation:planElectricPulse 3.8s ease-in-out infinite;pointer-events:none}
.purchase-plan-card::after{content:"";position:absolute;z-index:5;left:-1px;top:16%;width:1px;height:22%;background:#fff;box-shadow:0 0 8px var(--plan-accent),0 0 22px var(--plan-accent);opacity:.55;pointer-events:none}
.purchase-plan-card:hover,.purchase-plan-card:focus-visible{outline:none;transform:translateY(-6px);border-color:color-mix(in srgb,var(--plan-accent) 68%,transparent);box-shadow:0 28px 75px rgba(0,0,0,.45),0 0 30px color-mix(in srgb,var(--plan-accent) 18%,transparent)}
.purchase-plan-card .plan-visual{height:auto;min-height:0}
.purchase-plan-card .plan-visual-shade{background:linear-gradient(0deg,#0a0b0e 0%,transparent 52%),linear-gradient(90deg,transparent,rgba(0,0,0,.35))}
.plan-summary{position:relative;z-index:2;display:grid;gap:9px;padding:4px 22px 20px;background:linear-gradient(180deg,rgba(9,10,12,.1),#090a0c 22%)}
.plan-summary .plan-kicker{filter:drop-shadow(0 0 6px color-mix(in srgb,var(--plan-accent) 82%,transparent))}
.plan-summary h3{margin:0;font-size:clamp(20px,1.7vw,29px);text-shadow:0 0 18px color-mix(in srgb,var(--plan-accent) 24%,transparent)}
.plan-reveal-btn{display:flex;justify-content:space-between;align-items:center;width:100%;margin-top:3px;padding:11px 13px;border:1px solid color-mix(in srgb,var(--plan-accent) 45%,rgba(255,255,255,.1));background:color-mix(in srgb,var(--plan-accent) 7%,rgba(255,255,255,.025));color:#fff;font:700 11px/1.5 inherit;pointer-events:none;box-shadow:inset 0 0 16px color-mix(in srgb,var(--plan-accent) 5%,transparent)}
.plan-reveal-btn b{color:var(--plan-accent);font-size:16px;text-shadow:0 0 10px var(--plan-accent)}
.purchase-plan-modal{z-index:1000;background:rgba(2,3,5,.84);backdrop-filter:blur(12px)}
.purchase-plan-dialog{position:relative;display:block;width:min(980px,96vw);max-width:980px;max-height:min(88svh,850px);padding:0;overflow:auto;border:1px solid rgba(255,255,255,.13);border-radius:5px 30px 5px 5px;background:#08090b;box-shadow:0 35px 120px rgba(0,0,0,.7),0 0 52px rgba(240,43,53,.12)}
.purchase-plan-close{position:absolute;z-index:9;top:13px;left:13px;display:grid;place-items:center;width:38px;height:38px;padding:0;border:1px solid rgba(255,255,255,.18);border-radius:50%;background:rgba(3,4,6,.82);color:#fff;font-size:25px;cursor:pointer;backdrop-filter:blur(8px)}
.purchase-dialog-hero{position:sticky;top:0;min-height:100%;overflow:hidden;background:radial-gradient(circle at 40% 25%,color-mix(in srgb,var(--plan-accent) 25%,transparent),transparent 48%),#090a0c}
.purchase-dialog-hero img{width:100%;height:100%;min-height:520px;object-fit:cover;filter:grayscale(.38) contrast(1.06)}
.purchase-dialog-hero i{position:absolute;inset:0;background:linear-gradient(0deg,#08090b 0%,transparent 48%),linear-gradient(90deg,rgba(8,9,11,.2),rgba(8,9,11,.7))}
.purchase-dialog-hero .plan-kicker{position:absolute;right:24px;bottom:23px;z-index:2;color:var(--plan-accent);text-shadow:0 0 9px var(--plan-accent)}
.purchase-dialog-content{display:grid;align-content:start;gap:16px;padding:clamp(28px,4vw,48px)}
.purchase-dialog-content h2{margin:0;font-size:clamp(27px,3vw,40px);text-shadow:0 0 20px color-mix(in srgb,var(--plan-accent) 24%,transparent)}
.purchase-plan-description{color:var(--muted);font-size:14px;line-height:2.05;white-space:pre-line}
@media(max-width:700px){
  .plans-showcase{grid-template-columns:repeat(2,minmax(0,1fr));min-height:0;gap:10px}
  .purchase-plan-card{min-height:220px;border-radius:3px 18px 3px 3px}
  .plan-summary{padding:2px 12px 12px;gap:6px}.plan-summary h3{font-size:15px}.plan-summary .plan-kicker{font-size:7px;letter-spacing:1.2px}.plan-reveal-btn{padding:8px;font-size:8px}
  .plan-featured-label,.plan-category{top:10px;padding:4px 6px;font-size:7px}.plan-featured-label{right:9px}.plan-category{left:9px}
  .purchase-plan-dialog{display:block;width:min(94vw,560px);max-height:91svh}.purchase-dialog-hero{position:relative;height:210px;min-height:0}.purchase-dialog-hero img{min-height:0;height:100%}.purchase-dialog-content{padding:22px 17px 20px;gap:13px}.purchase-plan-close{top:9px;left:9px}
}

/* ---------- Buttons ---------- */
.btn {
  display: inline-block; text-align: center; cursor: pointer;
  background: var(--accent); color: #fff; border: none;
  padding: 12px 20px; border-radius: 12px; font-weight: 700; font-size: 14px;
  text-decoration: none; transition: filter .15s, transform .1s;
  box-shadow: 0 4px 16px rgba(255,106,61,.28); box-shadow: 0 4px 16px color-mix(in srgb, var(--accent) 28%, transparent);
}
.btn:hover { filter: brightness(1.08); }
.btn:active { transform: scale(.98); }
.btn.secondary {
  background: var(--card-2); color: var(--text); border: 1px solid var(--border);
  box-shadow: none; backdrop-filter: var(--glass-blur);
}
.btn.danger { background: var(--danger); color: #fff; box-shadow: 0 4px 16px rgba(255,92,114,.28); }
.btn:disabled { opacity: .5; cursor: not-allowed; box-shadow: none; }
.btn.block { display: block; width: 100%; }

/* V89 — اکشن‌های یکپارچه و واضح در جدول‌ها و کارت‌های پنل */
.action-cluster {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
}
.action-btn {
  appearance: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 31px;
  padding: 6px 12px;
  border: 1px solid rgba(255,255,255,.11);
  border-radius: 9px;
  background: linear-gradient(145deg,rgba(47,48,53,.9),rgba(24,25,29,.88));
  color: var(--text);
  font: inherit;
  font-size: 11.5px;
  font-weight: 750;
  line-height: 1.2;
  text-decoration: none;
  white-space: nowrap;
  cursor: pointer;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.055),0 5px 14px rgba(0,0,0,.18);
  transition: transform .14s ease,filter .14s ease,border-color .14s ease,box-shadow .14s ease;
}
.action-btn:hover {
  filter: brightness(1.12);
  border-color: rgba(255,255,255,.2);
  transform: translateY(-1px);
}
.action-btn:active { transform: scale(.97); }
.action-btn:focus-visible {
  outline: 2px solid rgba(255,255,255,.9);
  outline-offset: 2px;
}
.action-btn.danger {
  border-color: rgba(255,87,104,.56);
  background: linear-gradient(145deg,#f23b48,#c82432);
  color: #fff;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.16),0 6px 16px rgba(220,47,71,.26);
}
.action-btn.danger:hover {
  border-color: rgba(255,126,137,.78);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.2),0 8px 20px rgba(220,47,71,.36);
}
.mini-btn.danger-remove {
  border-color: rgba(255,87,104,.58);
  background: linear-gradient(145deg,#f23b48,#c82432);
  color: #fff;
  box-shadow: 0 4px 12px rgba(220,47,71,.24);
}
.mini-btn.danger-remove:hover {
  border-color: rgba(255,126,137,.8);
  filter: brightness(1.1);
}
@media (max-width: 520px) {
  .action-cluster { gap: 4px; flex-wrap: nowrap; }
  .action-btn {
    min-height: 27px;
    padding: 5px 8px;
    border-radius: 7px;
    font-size: 9.5px;
  }
}

/* زبان مشترک دکمه‌های برنامه غذایی، مکملی و تمرینی در پنل ورزشکار */
.program-card-actions {
  display: flex;
  align-items: stretch;
  gap: 8px;
  flex-wrap: wrap;
}
.program-card-actions .program-card-action {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 48px;
  white-space: nowrap;
}
.program-card-actions .program-card-action:not(.secondary) {
  min-width: 142px;
}
.program-card-actions .program-card-action.secondary {
  min-width: 178px;
}
@media (max-width: 520px) {
  .program-card-actions {
    width: auto;
    gap: 5px;
    flex-wrap: nowrap;
  }
  .program-card-actions .program-card-action {
    flex: 0 1 auto;
    min-width: 0 !important;
    min-height: 30px;
    padding: 6px 9px;
    border-radius: 8px;
    font-size: 10px;
    line-height: 1.25;
  }
}

/* ---------- Forms ---------- */
.form-box {
  background: var(--card); border: 1px solid var(--border); border-radius: 18px;
  padding: 26px; max-width: 460px; margin: 40px auto;
  backdrop-filter: var(--glass-blur); -webkit-backdrop-filter: var(--glass-blur);
  box-shadow: var(--shadow);
}
.form-box h2 { margin-top: 0; }
.auth-options {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px 18px;
  flex-wrap: wrap;
  margin-top: 12px;
}
.auth-check {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin: 0;
  color: var(--text);
  font-size: 12.5px;
  cursor: pointer;
  user-select: none;
}
.auth-check input[type="checkbox"] {
  appearance: none;
  -webkit-appearance: none;
  width: 19px;
  height: 19px;
  min-height: 19px;
  flex: 0 0 19px;
  margin: 0;
  border: 1px solid rgba(255,255,255,.28);
  border-radius: 5px;
  background: var(--card-2);
  display: grid;
  place-content: center;
  cursor: pointer;
}
.auth-check input[type="checkbox"]::before {
  content: "";
  width: 9px;
  height: 5px;
  border-inline-start: 2px solid #fff;
  border-bottom: 2px solid #fff;
  transform: rotate(-45deg) scale(0);
  transition: transform .12s ease;
}
.auth-check input[type="checkbox"]:checked {
  border-color: var(--accent);
  background: var(--accent);
}
.auth-check input[type="checkbox"]:checked::before { transform: rotate(-45deg) scale(1); }
.auth-check input[type="checkbox"]:focus-visible { outline: 2px solid #fff; outline-offset: 2px; }
.auth-guidance {
  display: grid;
  gap: 4px;
  margin: 12px 0 2px;
  padding: 11px 13px;
  border: 1px solid rgba(255,255,255,.09);
  border-inline-start: 3px solid var(--accent);
  border-radius: 10px;
  background: rgba(255,255,255,.025);
  color: var(--muted);
  font-size: 11.5px;
  line-height: 1.75;
}
.auth-guidance strong { color: var(--text); font-size: 12px; }
label { display: block; font-size: 13px; color: var(--muted); margin: 14px 0 6px; }
input, select, textarea {
  width: 100%; padding: 11px 13px; border-radius: 10px; border: 1px solid var(--border);
  background: var(--card-2); color: var(--text); font-family: inherit; font-size: 14px;
  transition: border-color .15s;
}
input:focus, select:focus, textarea:focus { outline: none; border-color: var(--accent); }
textarea { min-height: 80px; resize: vertical; }
.row2 { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }

/* لیست باز-شونده‌ی select ها یه سطح رندر جدا از صفحه‌ست و پس‌زمینه‌ی نیمه‌شفاف --card-2
   توش سفید دیده می‌شه (چون چیزی زیرش برای ترکیب‌شدن نیست) - این‌جا رنگ توپر می‌دیم که همیشه خوانا باشه */
select option, select optgroup { background: var(--card-solid); color: var(--text); }
select option:checked { background: color-mix(in srgb, var(--accent) 32%, var(--card-solid)); color: #fff; }
select option:disabled { color: var(--muted); }

.alert { padding: 11px 15px; border-radius: 12px; font-size: 13px; margin: 10px 0; white-space: pre-line; }
.alert.error { background: rgba(255,92,114,.12); color: var(--danger); border: 1px solid rgba(255,92,114,.3); }
.alert.success { background: rgba(61,220,151,.12); color: var(--success); border: 1px solid rgba(61,220,151,.3); }

/* پیام‌های alert (id="msg") باید همیشه دیده بشن، حتی وقتی یه مودال بازه - وگرنه
   پس‌زمینه‌ی تیره‌ی مودال (z-index:60) روشون رو می‌پوشونه و انگار دکمه هیچ کاری نکرده */
#msg:not(:empty) {
  position: fixed; top: 18px; left: 50%; transform: translateX(-50%);
  z-index: 200; width: min(92vw, 440px);
}

table { width: 100%; border-collapse: collapse; font-size: 13px; }
th, td { padding: 12px 10px; border-bottom: 1px solid var(--border); text-align: right; }
th { color: var(--muted); font-weight: 600; }

.stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px,1fr)); gap: 12px; margin-bottom: 20px; }
.stat-card {
  background: var(--card); border: 1px solid var(--border); border-radius: 16px; padding: 18px;
  backdrop-filter: var(--glass-blur); -webkit-backdrop-filter: var(--glass-blur); box-shadow: var(--shadow);
}
.stat-card .num { font-size: 26px; font-weight: 800; color: var(--accent); }
.stat-card .label { font-size: 12px; color: var(--muted); margin-top: 4px; }

/* ---------- Horizontal glass tabs (public pages) ---------- */
.tabs {
  display: flex; gap: 4px; margin-bottom: 18px; flex-wrap: wrap;
  background: var(--card); border: 1px solid var(--border);
  backdrop-filter: var(--glass-blur); -webkit-backdrop-filter: var(--glass-blur);
  padding: 5px; border-radius: 16px; width: fit-content; box-shadow: var(--shadow);
}
.tabs button {
  background: transparent; border: none; color: var(--muted);
  padding: 9px 16px; border-radius: 12px; cursor: pointer; font-family: inherit;
  font-size: 14px; transition: background .2s, color .2s;
}
.tabs button.active { background: var(--accent); color: #fff; font-weight: 700; }

.page-tabs {
  display: flex; gap: 4px; margin: 24px auto; flex-wrap: wrap; justify-content: center;
  background: var(--card); border: 1px solid var(--border);
  backdrop-filter: var(--glass-blur); -webkit-backdrop-filter: var(--glass-blur);
  padding: 6px; border-radius: 20px; width: fit-content; box-shadow: var(--shadow);
}
@media (min-width: 901px) {
  .page-tabs {
    position: fixed; bottom: 20px; left: 50%; transform: translateX(-50%);
    margin: 0; z-index: 50;
  }
  /* چون نوار تب‌ها دیگه تو جریان عادی صفحه نیست، فضای پایین صفحه رو نگه می‌داریم تا محتوای آخر زیرش قایم نشه */
  .container:has(.page-tabs) { padding-bottom: 90px; }
}

.page-tabs button {
  background: transparent; border: none; color: var(--muted);
  padding: 11px 20px; border-radius: 15px; cursor: pointer; font-family: inherit;
  font-size: 14px; font-weight: 600; transition: background .2s, color .2s;
}
.page-tabs button.active { background: var(--accent); color: #fff; font-weight: 800; box-shadow: 0 4px 16px rgba(255,106,61,.35); box-shadow: 0 4px 16px color-mix(in srgb, var(--accent) 35%, transparent); }

.muted { color: var(--muted); }
.section { margin: 26px 0; }

/* ---------- App shell (sidebar layout for dashboards) ---------- */
.app-shell { display: flex; min-height: 100vh; align-items: stretch; }
.app-sidebar {
  width: 250px; flex-shrink: 0;
  background: var(--card); border-inline-start: 1px solid var(--border);
  backdrop-filter: var(--glass-blur); -webkit-backdrop-filter: var(--glass-blur);
  padding: 20px 16px; position: sticky; top: 0; height: 100vh;
  display: flex; flex-direction: column; gap: 4px;
}
.app-sidebar .brand {
  font-weight: 800; font-size: 17px; color: var(--accent);
  display: flex; align-items: center; gap: 10px; text-decoration: none;
  padding: 6px 10px 18px;
}
.sidebar-link {
  display: flex; align-items: center; gap: 10px;
  padding: 12px 14px; border-radius: 12px; cursor: pointer;
  color: var(--muted); font-size: 14px; text-decoration: none; border: none; background: transparent;
  font-family: inherit; text-align: right; width: 100%; transition: background .18s, color .18s, transform .12s;
}
.sidebar-link:hover { background: var(--card-2); color: var(--text); transform: translateX(-2px); }
.sidebar-link.active { background: var(--accent); color: #fff; font-weight: 700; }
.sidebar-icon { font-size: 16px; width: 20px; text-align: center; flex-shrink: 0; }
svg.sidebar-icon { width: 19px; height: 19px; color: currentColor; opacity: .85; }
.sidebar-link.active svg.sidebar-icon { opacity: 1; }
.notif-dot {
  width: 9px; height: 9px; border-radius: 50%; background: var(--danger);
  display: inline-block; margin-inline-start: auto;
  box-shadow: 0 0 0 3px var(--card);
}
.sidebar-spacer { flex: 1; }
.app-main { flex: 1; min-width: 0; padding: 28px; }
@media (max-width: 860px) {
  .app-shell { flex-direction: column; }
  .app-sidebar {
    width: 100%; height: auto; position: static; flex-direction: row; overflow-x: auto;
    border-inline-start: none; border-bottom: 1px solid var(--border);
  }
  .app-sidebar .brand { display: none; }
  .sidebar-spacer { display: none; }
  .sidebar-link { flex-direction: column; gap: 4px; padding: 10px 12px; font-size: 11px; white-space: nowrap; }
  .app-main { padding: 18px; }
}

/* ---------- واکنش‌گرایی موبایل/تبلت (عمومی) ---------- */
@media (max-width: 720px) {
  .container { padding: 14px; }
  .navbar { padding: 12px 14px; flex-wrap: wrap; gap: 8px; }
  .navbar .brand { font-size: 16px; }
  .brand-logo { height: 36px; width: 62px; max-width: 62px; }
  .brand-title { font-size: 13px; }
  .brand-sub { font-size: 9px; }
  .row2 { grid-template-columns: 1fr; }
  .grid { grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); }
  .form-box { margin: 20px auto; padding: 18px; max-width: 94vw; }
  .stats { grid-template-columns: repeat(2, 1fr); }
  .page-tabs, .tabs { width: 100%; overflow-x: auto; flex-wrap: nowrap; justify-content: flex-start; }
  .page-tabs button, .tabs button { white-space: nowrap; }
  .about-box { flex-direction: column; text-align: center; }
  .about-photo { width: 140px; height: 140px; margin: 0 auto; }
  h1 { font-size: 26px; }
}

/* V66 — mobile-first viewport choreography */
@media (max-width: 720px) {
  html { scroll-snap-type: y mandatory; scroll-behavior: smooth; }
  body.public-home > .hero,
  body.public-home > .experience-gate,
  body.public-home > .container,
  body.public-home > .embedded-concept,
  body.public-home > .site-footer {
    scroll-snap-align: start;
    scroll-snap-stop: always;
  }
  body.public-home > .hero,
  body.public-home > .experience-gate,
  body.public-home > .container,
  body.public-home > .embedded-concept { height: 100svh; min-height: 100svh; max-height: 100svh; }

  .redesign-v60 .hero-photo {
    background:
      linear-gradient(0deg,#070809 0%,rgba(7,8,9,.94) 28%,rgba(7,8,9,.12) 62%),
      var(--media-image,url('/images/saeed/hero-designed-v61.jpg')) var(--media-mobile-x,0%) var(--media-mobile-y,50%) / auto 100% no-repeat !important;
  }
  .redesign-v60 .hero-inner {
    height: 100svh !important;
    display: flex !important;
    flex-direction: column;
    justify-content: flex-end;
    padding: 92px 20px 28px !important;
  }
  .redesign-v60 .hero-eyebrow { margin-bottom: 8px !important; }
  .redesign-v60 .hero h1 {
    margin: 6px 0 10px !important;
    font-size: clamp(30px,9.4vw,42px) !important;
    line-height: 1.16 !important;
  }
  .redesign-v60 .hero p {
    max-width: 34em;
    margin: 0 0 12px !important;
    font-size: 11px !important;
    line-height: 1.75 !important;
  }
  .redesign-v60 .hero-ctas { gap: 7px; }
  .redesign-v60 .hero-btn { min-height: 43px; padding: 8px 12px; }
  .hero-proof { margin-top: 14px !important; padding-top: 12px !important; }

  .experience-gate {
    margin: 0 auto !important;
    padding: max(82px,env(safe-area-inset-top)) 12px 22px;
    align-content: center;
    grid-template-columns: 1fr !important;
  }
  .experience-gate a { min-height: min(36svh,260px) !important; }

  .redesign-v60 > .container {
    width: 100%;
    padding: 76px 12px 12px;
    overflow: hidden !important;
  }
  .redesign-v60 .page-tabs {
    position: relative !important;
    top: auto !important;
    width: 100%;
    margin: 0 0 10px;
    overflow-x: auto;
    flex-wrap: nowrap;
    scrollbar-width: none;
  }
  .redesign-v60 .page-tabs::-webkit-scrollbar { display:none; }
  .redesign-v60 .page-tabs button { flex: 0 0 auto; min-height: 40px; }
  .redesign-v60 .page-panel {
    height: calc(100svh - 140px);
    min-height: 0 !important;
    max-height: calc(100svh - 140px);
    overflow: hidden !important;
  }
  .method-intro { padding: 10px 6px 12px !important; }
  .method-intro h2 { font-size: clamp(23px,7vw,32px) !important; margin: 8px 0 !important; }
  .method-intro p { font-size: 11px !important; line-height: 1.7 !important; }
  .redesign-v60 .about-box {
    height: calc(100% - 150px);
    display: flex !important;
    flex-wrap: nowrap !important;
    gap: 10px;
    padding: 0 !important;
    overflow-x: auto !important;
    scroll-snap-type: x mandatory;
    background: transparent;
    border: 0;
  }
  .redesign-v60 .about-photo,
  .redesign-v60 .about-text {
    flex: 0 0 88vw;
    height: 100%;
    min-height: 0 !important;
    scroll-snap-align: center;
    border: 1px solid var(--sn-line);
    border-radius: 16px;
    overflow: hidden;
  }
  .redesign-v60 .about-photo img { width:100%; height:100%; min-height:0 !important; object-fit:cover; }
  .redesign-v60 .about-text { padding:18px; overflow-y:auto; background:#0d0f12; }

  .panel-heading { padding: 8px 4px 12px; }
  .panel-heading h2 { font-size: clamp(25px,8vw,34px); margin: 8px 0; }
  .panel-heading p { font-size: 11px; margin:0; }
  .career-gallery,
  .record-grid,
  .record-photo-grid {
    display: flex !important;
    grid-template-columns: none !important;
    height: calc(100% - 112px);
    gap: 10px;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    scroll-snap-type: x mandatory;
  }
  .career-gallery .career-card,
  .record-grid .record-card,
  .record-photo-grid figure {
    flex: 0 0 82vw;
    width: 82vw;
    height: 100% !important;
    min-height: 0;
    scroll-snap-align: center;
  }
  .career-gallery .career-card img,
  .record-photo-grid img { width:100%; height:100%; aspect-ratio:auto; object-fit:cover; }

  .contact-stage { height:100%; min-height:0; overflow-y:auto; padding:16px 10px; }
  .contact-intro h2 { font-size:clamp(26px,8vw,38px); }
  .contact-channel-grid { gap:7px; }
  .contact-channel { min-height:80px; padding:12px; }

  #page-articles #articleListView { height:100%; overflow-y:auto; }
  .knowledge-hero { padding:20px 14px; gap:14px; }
  .knowledge-hero h2 { font-size:clamp(30px,9vw,42px); }
  .knowledge-principles { display:none; }
  #artGrid { display:flex; overflow-x:auto; flex-wrap:nowrap; }
  #artGrid > * { flex:0 0 82vw; }

  .embedded-concept { width:100% !important; margin:0 !important; border-radius:0; overflow:hidden; }
  .embedded-concept.start-stage { padding:76px 16px 22px; }
  .embedded-concept.start-stage > h2 { font-size:clamp(34px,11vw,52px); margin:14px 0; }
  .embedded-concept.start-stage > p { font-size:12px; line-height:1.8; }
  .embedded-concept .start-steps {
    display:flex;
    width:100%;
    overflow-x:auto;
    scroll-snap-type:x mandatory;
    margin:20px 0;
  }
  .embedded-concept .start-steps article { flex:0 0 82vw; scroll-snap-align:center; }
  .embedded-concept.portal-stage { padding:74px 14px 18px; grid-template-columns:1fr; gap:16px; }
  .embedded-concept .portal-copy > h2 { font-size:clamp(34px,10vw,48px); margin:10px 0; }
  .embedded-concept .portal-copy > p { font-size:11px; line-height:1.7; }
  .embedded-concept .portal-mockup { min-height:0; height:43svh; }
  .embedded-concept .mock-main { padding:16px 12px; overflow:hidden; }
  .embedded-concept .mock-main > h3 { margin:6px 0 12px; }
  .embedded-concept .mock-features { display:none; }

  .site-footer { min-height:100svh; display:flex; flex-direction:column; justify-content:center; }
}

@media (max-width: 380px), (max-height: 700px) and (max-width:720px) {
  .redesign-v60 .hero-description,
  .redesign-v60 .hero p { display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
  .hero-proof span { display:block; text-align:center; }
  .hero-proof > div { text-align:center; align-items:center; }
  .redesign-v60 .hero h1 { font-size:clamp(27px,8.7vw,36px) !important; }
  .embedded-concept .portal-mockup { height:38svh; }
}

@media (max-width:720px){
  .experience-gate a:first-child,
  .experience-gate a:nth-child(2){
    background-position:28% center;
    background-size:auto 100%;
  }
  .experience-gate a::after{inset:18px auto auto 18px;width:38%;height:30%;opacity:.55}
  .experience-gate a small{align-self:flex-end}
  .experience-gate a strong,.experience-gate a span{max-width:76%;margin-inline-start:auto;text-align:right}
}

/* V68 final cascade — shared forms and mobile athlete surfaces */
:where(body:not(.public-home)) :where(input:not([type="checkbox"]):not([type="radio"]):not([type="range"]),select,textarea){
  width:100%;min-height:48px;padding:12px 14px;color:#f4f2ef;
  border:1px solid rgba(255,255,255,.11);border-radius:12px;
  background:linear-gradient(145deg,rgba(255,255,255,.055),rgba(255,255,255,.025));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.025);
  outline:none;transition:border-color .2s ease,box-shadow .2s ease,background .2s ease;
}
:where(body:not(.public-home)) textarea{min-height:96px;resize:vertical;line-height:1.9}
:where(body:not(.public-home)) :where(input,select,textarea):focus{
  border-color:rgba(240,43,53,.75);background:rgba(17,19,23,.94);
  box-shadow:0 0 0 3px rgba(240,43,53,.12),inset 3px 0 0 rgba(240,43,53,.8);
}
:where(body:not(.public-home)) label{display:block;margin:14px 2px 7px;color:#c8cbd1;font-size:12px;font-weight:700}
:where(body:not(.public-home)) input[type="file"]{padding:8px}
:where(body:not(.public-home)) input[type="file"]::file-selector-button{
  margin-inline-end:10px;padding:8px 12px;border:0;border-radius:8px;color:#fff;background:#252932;font-family:inherit;cursor:pointer
}
.time-fields{margin-top:10px;padding:14px;border:1px solid rgba(255,255,255,.08);border-radius:14px;background:rgba(255,255,255,.025)}
.time-fields > div > div > div{display:grid!important;grid-template-columns:1fr auto 1fr!important}
.modal-panel{border-radius:18px!important;box-shadow:0 32px 100px rgba(0,0,0,.58)!important}
.athlete-quick-links{display:flex;gap:6px;flex-wrap:wrap;margin:8px 0 16px}
.athlete-quick-links a{padding:7px 10px;color:#c5c8ce;text-decoration:none;font-size:10px;border:1px solid rgba(255,255,255,.09);border-radius:8px}
.athlete-quick-links a:hover{color:#fff;border-color:rgba(240,43,53,.5)}
.mobile-swipe-hint{display:none}
@media(max-width:720px){
  .product-shell .app-sidebar{position:relative}
  .product-shell .app-sidebar::after{
    content:"";position:sticky;left:0;flex:0 0 24px;height:54px;pointer-events:none;
    background:linear-gradient(90deg,#0a0c0f,transparent)
  }
  .athlete-quick-links{flex:0 0 auto;margin:0 8px 0 0;flex-wrap:nowrap}
  .athlete-quick-links a{white-space:nowrap}
  .mobile-swipe-hint{
    display:flex;position:fixed;z-index:60;top:67px;left:50%;transform:translateX(-50%);
    align-items:center;gap:7px;padding:5px 10px;color:#9498a1;background:rgba(10,12,15,.9);
    border:1px solid rgba(255,255,255,.08);border-radius:999px;font-size:8px;white-space:nowrap;
    animation:swipeHintFade 5s 1.2s both
  }
  @keyframes swipeHintFade{0%,65%{opacity:1}100%{opacity:0;visibility:hidden}}
  .product-shell .app-main{padding-top:18px}
  .ex-square-info{height:auto!important;min-height:138px;padding:10px!important;overflow:visible!important}
  .ex-square-info b{font-size:12px!important}
  .ex-square-info span,.ex-square-info span.muted{
    display:block!important;-webkit-line-clamp:unset!important;overflow:visible!important;
    text-overflow:clip!important;white-space:normal!important;line-height:1.65!important
  }
  .athlete-system{margin-top:7px;padding:8px;border:1px solid rgba(240,43,53,.28);border-radius:8px;background:rgba(240,43,53,.07)}
  .ex-square-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  :where(body:not(.public-home)) .row2,
  :where(body:not(.public-home)) .row3{grid-template-columns:1fr!important;gap:6px}
  :where(body:not(.public-home)) :where(input:not([type="checkbox"]):not([type="radio"]):not([type="range"]),select,textarea){font-size:16px}
}

/* V68 — unified interaction and form language */
:where(body:not(.public-home)) :where(input:not([type="checkbox"]):not([type="radio"]):not([type="range"]),select,textarea){
  width:100%;min-height:48px;padding:12px 14px;color:#f4f2ef;
  border:1px solid rgba(255,255,255,.11);border-radius:12px;
  background:linear-gradient(145deg,rgba(255,255,255,.055),rgba(255,255,255,.025));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.025);
  outline:none;transition:border-color .2s ease,box-shadow .2s ease,background .2s ease;
}
:where(body:not(.public-home)) textarea{min-height:96px;resize:vertical;line-height:1.9}
:where(body:not(.public-home)) :where(input,select,textarea):focus{
  border-color:rgba(240,43,53,.75);background:rgba(17,19,23,.94);
  box-shadow:0 0 0 3px rgba(240,43,53,.12),inset 3px 0 0 rgba(240,43,53,.8);
}
:where(body:not(.public-home)) label{display:block;margin:14px 2px 7px;color:#c8cbd1;font-size:12px;font-weight:700}
:where(body:not(.public-home)) input[type="file"]{padding:8px}
:where(body:not(.public-home)) input[type="file"]::file-selector-button{
  margin-inline-end:10px;padding:8px 12px;border:0;border-radius:8px;color:#fff;background:#252932;font-family:inherit;cursor:pointer
}
.time-fields{margin-top:10px;padding:14px;border:1px solid rgba(255,255,255,.08);border-radius:14px;background:rgba(255,255,255,.025)}
.time-fields > div > div > div{display:grid!important;grid-template-columns:1fr auto 1fr!important}
.modal-panel{border-radius:18px!important;box-shadow:0 32px 100px rgba(0,0,0,.58)!important}
.athlete-quick-links{display:flex;gap:6px;flex-wrap:wrap;margin:8px 0 16px}
.athlete-quick-links a{padding:7px 10px;color:#c5c8ce;text-decoration:none;font-size:10px;border:1px solid rgba(255,255,255,.09);border-radius:8px}
.athlete-quick-links a:hover{color:#fff;border-color:rgba(240,43,53,.5)}
.mobile-swipe-hint{display:none}

@media(max-width:720px){
  .product-shell .app-sidebar{position:relative}
  .product-shell .app-sidebar::after{
    content:"";position:sticky;left:0;flex:0 0 24px;height:54px;pointer-events:none;
    background:linear-gradient(90deg,#0a0c0f,transparent)
  }
  .athlete-quick-links{flex:0 0 auto;margin:0 8px 0 0;flex-wrap:nowrap}
  .athlete-quick-links a{white-space:nowrap}
  .mobile-swipe-hint{
    display:flex;position:fixed;z-index:60;top:67px;left:50%;transform:translateX(-50%);
    align-items:center;gap:7px;padding:5px 10px;color:#9498a1;background:rgba(10,12,15,.9);
    border:1px solid rgba(255,255,255,.08);border-radius:999px;font-size:8px;white-space:nowrap;
    animation:swipeHintFade 5s 1.2s both
  }
  @keyframes swipeHintFade{0%,65%{opacity:1}100%{opacity:0;visibility:hidden}}
  .product-shell .app-main{padding-top:18px}
  .ex-square-info{height:auto!important;min-height:138px;padding:10px!important;overflow:visible!important}
  .ex-square-info b{font-size:12px!important}
  .ex-square-info span,.ex-square-info span.muted{
    display:block!important;-webkit-line-clamp:unset!important;overflow:visible!important;
    text-overflow:clip!important;white-space:normal!important;line-height:1.65!important
  }
  .athlete-system{margin-top:7px;padding:8px;border:1px solid rgba(240,43,53,.28);border-radius:8px;background:rgba(240,43,53,.07)}
  .ex-square-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  :where(body:not(.public-home)) .row2,
  :where(body:not(.public-home)) .row3{grid-template-columns:1fr!important;gap:6px}
  :where(body:not(.public-home)) :where(input:not([type="checkbox"]):not([type="radio"]):not([type="range"]),select,textarea){font-size:16px}
}

/* V63 — content system, knowledge hub and concept pages */
.record-photo-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:22px}
.record-photo-grid img{width:100%;aspect-ratio:4/3;object-fit:cover;border:1px solid rgba(255,255,255,.09);border-radius:14px;filter:grayscale(1)}
.content-edit-row{display:grid;grid-template-columns:80px repeat(3,minmax(0,1fr));gap:12px;align-items:end;padding:14px 0;border-bottom:1px solid rgba(255,255,255,.08)}
.content-edit-row strong{align-self:center;color:var(--accent)}
.knowledge-hero{display:grid;grid-template-columns:1.2fr .8fr;gap:clamp(24px,5vw,72px);align-items:end;padding:clamp(30px,6vw,76px);border:1px solid rgba(255,255,255,.08);background:radial-gradient(circle at 18% 40%,rgba(240,43,53,.18),transparent 38%),linear-gradient(135deg,#111318,#08090b);overflow:hidden}
.knowledge-hero h2{font-size:clamp(38px,6vw,78px);line-height:1.13;margin:16px 0}
.knowledge-hero-copy>p:not(.eyebrow){max-width:700px;color:#a8abb1;line-height:2}
.knowledge-hero .eyebrow{color:#f13b43;font-size:11px;letter-spacing:.23em}
.knowledge-principles{display:flex;gap:8px;flex-wrap:wrap;margin-top:22px}
.knowledge-principles span{padding:7px 12px;border:1px solid rgba(255,255,255,.11);color:#d9d9dc;font-size:12px}
.knowledge-hero .art-search{padding:22px;background:rgba(255,255,255,.045);border:1px solid rgba(255,255,255,.09)}
.knowledge-hero .art-search label{display:block;margin-bottom:10px;font-weight:800}
.knowledge-hero .art-search input{min-height:54px;background:#08090b}
.knowledge-hero .art-search small{display:block;color:#777b84;margin-top:10px}
.field-invalid{border-color:#ff4650!important;box-shadow:0 0 0 3px rgba(240,43,53,.18)!important}
.experience-gate{width:min(1600px,calc(100% - 48px));margin:26px auto 0;display:grid;grid-template-columns:1fr 1fr;gap:12px}
.experience-gate a{position:relative;display:flex;min-height:170px;flex-direction:column;justify-content:flex-end;padding:28px;text-decoration:none;color:#fff;border:1px solid rgba(255,255,255,.09);background:radial-gradient(circle at 85% 20%,rgba(240,43,53,.18),transparent 42%),#0d0f12;overflow:hidden;transition:.25s ease}
.experience-gate a::before{content:"";position:absolute;top:0;right:0;width:3px;height:100%;background:#f02b35;transform:scaleY(.3);transform-origin:bottom;transition:.25s ease}
.experience-gate a:hover{transform:translateY(-3px);border-color:rgba(240,43,53,.35)}.experience-gate a:hover::before{transform:scaleY(1)}
.experience-gate small{direction:ltr;align-self:flex-start;color:#f02b35;letter-spacing:.18em;font:700 9px Arial}.experience-gate strong{font-size:clamp(18px,2vw,28px);margin:12px 0 5px}.experience-gate span{color:#858991;font-size:12px}
.experience-gate a > *{position:relative;z-index:2}
.experience-gate a:first-child{
  background:
    linear-gradient(90deg,rgba(7,9,11,.2),rgba(7,9,11,.72) 60%,rgba(7,9,11,.96)),
    linear-gradient(0deg,rgba(240,43,53,.07),transparent 55%),
    url('/images/saeed/evaluation-tablet-v67.webp') left center/cover no-repeat;
}
.experience-gate a:nth-child(2){
  background:
    linear-gradient(90deg,rgba(7,9,11,.22),rgba(7,9,11,.74) 60%,rgba(7,9,11,.96)),
    linear-gradient(0deg,rgba(240,43,53,.07),transparent 55%),
    url('/images/saeed/athlete-portal-tablet-v67.webp') left center/cover no-repeat;
}
.experience-gate a::after{
  content:"";position:absolute;z-index:1;inset:18px 18px auto auto;width:34%;height:34%;
  border-top:1px solid rgba(255,255,255,.2);border-left:1px solid rgba(255,255,255,.1);
  background:repeating-linear-gradient(0deg,transparent 0 13px,rgba(207,211,217,.1) 13px 14px);
  opacity:.72;pointer-events:none;
}
.back-to-top{position:fixed;z-index:90;right:22px;bottom:22px;width:44px;height:44px;border:1px solid rgba(255,255,255,.13);border-radius:50%;color:#fff;background:rgba(12,14,17,.84);backdrop-filter:blur(14px);box-shadow:0 12px 30px rgba(0,0,0,.3);cursor:pointer;opacity:0;visibility:hidden;transform:translateY(12px);transition:.25s ease}
.back-to-top::after{content:"";position:absolute;inset:5px;border:1px solid rgba(240,43,53,.32);border-radius:50%}.back-to-top span{position:relative;z-index:1;font-size:17px}.back-to-top.visible{opacity:1;visibility:visible;transform:none}.back-to-top:hover{border-color:#f02b35;transform:translateY(-3px)}
.back-to-top.points-down:hover{transform:translateY(3px)}
.concept-page{min-height:100vh;margin:0;color:#f5f2ee;background:radial-gradient(circle at 55% 35%,rgba(225,31,40,.16),transparent 28rem),#08090c;font-family:inherit}
.concept-nav{height:92px;display:flex;align-items:center;justify-content:space-between;padding:0 clamp(22px,6vw,110px);border-bottom:1px solid rgba(255,255,255,.07)}
.concept-nav>a:last-child{color:#a6a8ae;text-decoration:none}
.start-stage{min-height:calc(100vh - 160px);display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:60px 24px}
.start-stage h1,.start-stage>h2,.portal-copy h1,.portal-copy>h2{font-size:clamp(46px,7vw,104px);line-height:1.18;margin:22px 0;letter-spacing:-.045em}
.start-stage>p,.portal-copy>p{max-width:720px;color:#aaaab0;font-size:clamp(15px,1.5vw,20px);line-height:2}
.start-steps{width:min(1080px,100%);display:grid;grid-template-columns:repeat(3,1fr);gap:1px;margin:42px 0;background:rgba(255,255,255,.1)}
.start-steps article{padding:25px;text-align:right;background:#0d0f12}
.start-steps article>b{color:#ef3039;font-size:12px}.start-steps h2,.start-steps h3{font-size:18px;margin:12px 0}.start-steps p{color:#858990;font-size:13px;line-height:1.8}
.concept-primary{box-shadow:0 15px 50px rgba(238,42,51,.2)}
.concept-footer{display:flex;justify-content:space-between;padding:25px clamp(22px,6vw,110px);color:#777b83;border-top:1px solid rgba(255,255,255,.07);font-size:12px}
.concept-footer a{color:#c8c8cb}
.portal-stage{min-height:calc(100vh - 92px);display:grid;grid-template-columns:.9fr 1.1fr;align-items:center;gap:5vw;padding:clamp(40px,6vw,100px)}
.portal-copy p{max-width:580px}.portal-actions{display:flex;gap:12px;margin-top:30px}.portal-actions .btn{width:auto}
.portal-mockup{direction:ltr;display:grid;grid-template-columns:76px 1fr;min-height:520px;background:#11141a;border:1px solid rgba(255,255,255,.1);box-shadow:0 40px 100px rgba(0,0,0,.45)}
.portal-mockup aside{display:flex;flex-direction:column;align-items:center;gap:24px;padding:24px 18px;border-right:1px solid rgba(255,255,255,.08)}
.portal-mockup aside img{width:38px}.portal-mockup aside i{width:24px;height:4px;background:#4a4e57;border-radius:4px}.portal-mockup aside i:first-of-type{background:#ef3039}
.mock-main{direction:rtl;padding:52px}.mock-main>small{color:#777b83}.mock-main>h2{font-size:28px;margin:12px 0 38px}
.mock-progress{padding:28px;border:1px solid rgba(255,255,255,.09);background:#171a20}.mock-progress b{float:left;color:#ef3039;font-size:22px}.mock-progress i{display:block;height:7px;margin-top:20px;background:#242832}.mock-progress em{display:block;width:82%;height:100%;background:#ef3039;box-shadow:0 0 18px rgba(239,48,57,.6)}
.mock-cards{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:14px}.mock-cards article{padding:24px;border:1px solid rgba(255,255,255,.09)}.mock-cards small{display:block;color:#777b83;margin-bottom:12px}
.mock-features{display:flex;gap:8px;flex-wrap:wrap;margin-top:28px}.mock-features span{font-size:12px;padding:8px 12px;background:rgba(239,48,57,.1);color:#e2e2e4}
.embedded-concept{width:min(1600px,calc(100% - 48px));margin:54px auto 0;scroll-margin-top:90px;border-top:1px solid rgba(255,255,255,.08);border-bottom:1px solid rgba(255,255,255,.08);background:radial-gradient(circle at 55% 35%,rgba(225,31,40,.13),transparent 28rem),#08090c}
.embedded-concept.start-stage{min-height:100svh}.embedded-concept.portal-stage{min-height:100svh}
@media(max-width:800px){
  .knowledge-hero,.portal-stage{grid-template-columns:1fr}.portal-stage{padding:40px 16px}.portal-copy{text-align:center}.portal-copy h1,.portal-copy>h2{font-size:clamp(40px,14vw,68px)}.portal-copy p{margin-inline:auto}.portal-actions{justify-content:center}
  .portal-mockup{grid-template-columns:48px 1fr;min-height:auto}.portal-mockup aside{padding:16px 8px}.mock-main{padding:24px 16px}.mock-cards{grid-template-columns:1fr}
  .start-steps{grid-template-columns:1fr}.concept-footer{flex-direction:column;gap:10px}.record-photo-grid{grid-template-columns:1fr 1fr}.content-edit-row{grid-template-columns:1fr}
}
@media(max-width:640px){
  .experience-gate{width:calc(100% - 24px);grid-template-columns:1fr;margin-top:12px}.experience-gate a{min-height:132px;padding:20px}
  .back-to-top{right:14px;bottom:max(14px,env(safe-area-inset-bottom));width:42px;height:42px}
  .embedded-concept{width:calc(100% - 24px);margin-top:28px;scroll-margin-top:76px}
  .redesign-v60 .hero{position:relative!important;display:flex!important;align-items:flex-end!important;min-height:100svh!important;padding:0!important}
  .redesign-v60 .hero-media{position:absolute!important;inset:0!important;width:100%!important;min-height:100%!important}
  .redesign-v60 .hero-photo{background:linear-gradient(0deg,#070809 3%,rgba(7,8,9,.92) 27%,rgba(7,8,9,.22) 66%),var(--media-image,url('/images/saeed/hero-designed-v61.jpg')) var(--media-x,50%) var(--media-y,30%)/cover no-repeat!important}
  .redesign-v60 .hero-photo-frame{inset:78px 12px 12px!important}
  .redesign-v60 .hero-inner{position:relative!important;z-index:3!important;grid-row:auto!important;padding:105px 18px max(30px,env(safe-area-inset-bottom))!important;background:transparent!important}
  .redesign-v60 .hero-eyebrow{direction:ltr!important;justify-content:flex-end!important;width:100%!important;font-family:Arial,sans-serif!important;font-size:8px!important;letter-spacing:2px!important;white-space:nowrap!important}
  .redesign-v60 .hero h1{max-width:100%!important;font-size:clamp(36px,11vw,49px)!important;line-height:1.2!important;overflow-wrap:normal!important;word-break:keep-all!important;text-wrap:balance}
  .redesign-v60 .hero p{color:rgba(255,255,255,.78)!important;line-height:1.9!important}
}

/* جدول‌ها روی صفحه‌ی کوچیک به‌جای شکستن، اسکرول افقی می‌گیرن */
.section, .card, .container { overflow-x: visible; }
table { display: block; overflow-x: auto; white-space: nowrap; -webkit-overflow-scrolling: touch; }

.about-box {
  display: flex; gap: 24px; align-items: center; flex-wrap: wrap;
  background: var(--card); border: 1px solid var(--border); border-radius: 18px; padding: 24px;
  backdrop-filter: var(--glass-blur); -webkit-backdrop-filter: var(--glass-blur); box-shadow: var(--shadow);
}
.about-photo { width: 180px; height: 180px; border-radius: 16px; overflow: hidden; flex-shrink: 0; border: 1px solid var(--border); }
.about-photo img { width: 100%; height: 100%; object-fit: cover; display: block; }
.about-photo-placeholder {
  display: none; width: 100%; height: 100%; align-items: center; justify-content: center;
  text-align: center; font-size: 12px; color: var(--muted); background: var(--card-2); padding: 10px;
}
.about-text { flex: 1; min-width: 240px; }
.about-text h2 { margin-top: 0; }
.about-text p { color: var(--text); line-height: 2; }
.achievements { color: var(--muted); line-height: 2.1; padding-inline-start: 20px; }
.achievements li::marker { color: var(--accent); }

.gallery { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 12px; }
.gallery img { width: 100%; height: 260px; object-fit: cover; border-radius: 16px; border: 1px solid var(--border); }
.chart-wrap {
  position: relative; overflow: hidden;
  background:
    radial-gradient(circle at 82% 8%, rgba(239,48,57,.08), transparent 38%),
    linear-gradient(155deg, rgba(20,21,25,.96), rgba(8,9,12,.98));
  border: 1px solid rgba(255,255,255,.085); border-radius: 5px 20px 5px 5px; padding: 18px; margin-bottom: 16px;
  backdrop-filter: var(--glass-blur); -webkit-backdrop-filter: var(--glass-blur);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.03), 0 18px 38px rgba(0,0,0,.25);
}
.chart-wrap::after {
  content:""; position:absolute; top:0; right:0; width:34%; height:1px; pointer-events:none;
  background:linear-gradient(90deg,transparent,#ef3039); box-shadow:0 0 9px rgba(239,48,57,.72);
}
.measurement-charts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:10px 0 12px}
.measurement-charts .measurement-chart{height:260px;min-height:260px;margin:0;padding:13px}
.measurement-charts .measurement-chart canvas{width:100%!important;height:100%!important;max-height:234px}
@media(max-width:900px){.measurement-charts{grid-template-columns:1fr}.measurement-charts .measurement-chart{height:225px;min-height:225px}.measurement-charts .measurement-chart canvas{max-height:199px}}

.site-footer { margin-top: 40px; padding: 26px 20px; text-align: center; border-top: 1px solid var(--border); background: var(--card); }
.site-footer #enamad-badge { display: flex; justify-content: center; align-items: center; gap: 24px; margin-bottom: 14px; min-height: 1px; flex-wrap:wrap; }
.footer-logo { height: 54px; width: auto; max-width: min(150px,60vw); object-fit: contain; object-position: right center; }
.zarinpal-trust { min-width:80px; min-height:80px; display:grid; place-items:center; }

.contact-social { display: flex; gap: 10px; margin-top: 16px; flex-wrap: wrap; }
.social-link {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 10px 18px; border-radius: 12px; font-weight: 700; font-size: 14px;
  text-decoration: none; color: #fff;
}
.social-link.instagram { background: linear-gradient(45deg, #f09433, #e6683c, #dc2743, #cc2366, #bc1888); }
.social-link.whatsapp { background: #25D366; color: #06301a; }

.contact-stage { display:grid; grid-template-columns:minmax(280px,.78fr) minmax(440px,1.22fr); gap:clamp(28px,6vw,84px); align-items:center; min-height:calc(100svh - 170px); padding:clamp(30px,6vw,78px); border:1px solid var(--sn-line); background:radial-gradient(circle at 12% 22%,rgba(240,43,53,.14),transparent 32%),linear-gradient(145deg,#101115,#070809); overflow:hidden; position:relative; }
.contact-stage::before { content:"CONTACT"; position:absolute; left:-12px; bottom:-26px; color:rgba(255,255,255,.025); font:900 clamp(70px,13vw,190px)/1 Arial; letter-spacing:-8px; pointer-events:none; }
.contact-intro { position:relative; z-index:1; }
.contact-intro h2 { font-size:clamp(36px,5vw,66px); line-height:1.28; letter-spacing:-2px; margin:20px 0; }
.contact-intro > p { color:var(--sn-muted); line-height:2.1; max-width:510px; }
.contact-book-btn { margin-top:26px; width:min(100%,330px); display:flex; justify-content:space-between; align-items:center; padding:15px 18px; background:var(--sn-red); border:0; color:#fff; font-weight:800; cursor:pointer; box-shadow:0 16px 38px rgba(240,43,53,.22); }
.contact-book-btn b { font-size:22px; }
.contact-channel-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; position:relative; z-index:1; }
.contact-channel { min-height:170px; padding:22px; color:#fff; text-decoration:none; border:1px solid rgba(255,255,255,.1); background:rgba(255,255,255,.035); display:grid; grid-template-columns:44px 1fr auto; gap:14px; align-items:start; transition:.3s; }
.contact-channel:hover { transform:translateY(-5px); border-color:rgba(255,255,255,.25); background:rgba(255,255,255,.06); }
.contact-channel svg { width:38px; height:38px; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; }
.contact-channel span { display:flex; flex-direction:column; min-width:0; }
.contact-channel small { font:700 9px/1 Arial; letter-spacing:2px; color:var(--sn-red); }
.contact-channel b { margin-top:15px; font-size:14px; overflow-wrap:anywhere; }
.contact-channel em { margin-top:7px; color:var(--sn-muted); font-size:10px; font-style:normal; }
.contact-channel i { font-style:normal; color:var(--sn-muted); }
.contact-channel.is-locked { cursor:pointer; color:rgba(255,255,255,.68); }
.contact-channel.is-locked b { font-size:11px; color:#a7aab1; }
.contact-channel.is-locked:hover { transform:none; border-color:rgba(240,43,53,.32); background:rgba(240,43,53,.045); }
.contact-channel.instagram:hover { background:linear-gradient(145deg,rgba(188,24,136,.14),rgba(220,39,67,.05)); }
.contact-channel.whatsapp:hover { background:linear-gradient(145deg,rgba(37,211,102,.12),rgba(255,255,255,.025)); }
.contact-channel.whatsapp small { color:#42df7e; }
.package-program-select { display:grid; place-items:center; align-self:stretch; min-width:28px; margin:0; }
.package-program-checkbox { width:17px; height:17px; min-height:17px; accent-color:var(--accent); cursor:pointer; }
.package-program-checkbox:disabled { cursor:not-allowed; opacity:.35; }

.plans-admin-toolbar{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:12px}
.plans-admin-toolbar>span{display:flex;align-items:center;gap:7px;color:var(--muted);font-size:10px}
.plan-drag-symbol{color:var(--accent);font-size:18px;text-shadow:0 0 10px rgba(240,43,53,.8)}
.admin-plan-showcase{display:grid;grid-template-columns:repeat(var(--plan-cols,3),minmax(0,1fr));grid-template-rows:repeat(var(--plan-rows,1),minmax(0,1fr));gap:clamp(8px,1vw,15px);height:calc(100svh - 210px);min-height:320px}
.admin-plan-card{position:relative;display:grid;grid-template-rows:minmax(74px,33%) minmax(0,1fr) auto;min-width:0;min-height:0;overflow:hidden;border:1px solid rgba(255,255,255,.1);border-radius:4px 24px 4px 4px;background:linear-gradient(155deg,#121317,#08090b);box-shadow:0 22px 54px rgba(0,0,0,.3),0 0 0 1px color-mix(in srgb,var(--plan-accent) 4%,transparent);transition:border-color .2s,box-shadow .2s,transform .2s,opacity .2s}
.admin-plan-card::before{content:"";position:absolute;z-index:4;inset:-1px auto auto -1px;width:38%;height:2px;background:linear-gradient(90deg,transparent,var(--plan-accent),#fff);box-shadow:0 0 10px var(--plan-accent),0 0 24px color-mix(in srgb,var(--plan-accent) 55%,transparent);opacity:.75;animation:planElectricPulse 3.8s ease-in-out infinite;pointer-events:none}
.admin-plan-card::after{content:"";position:absolute;z-index:4;top:10%;left:-1px;width:1px;height:24%;background:#fff;box-shadow:0 0 8px var(--plan-accent),0 0 18px var(--plan-accent);opacity:.45;pointer-events:none}
.admin-plan-card:hover{transform:translateY(-2px);border-color:color-mix(in srgb,var(--plan-accent) 62%,rgba(255,255,255,.12));box-shadow:0 18px 50px rgba(0,0,0,.38),0 0 24px color-mix(in srgb,var(--plan-accent) 16%,transparent)}
.admin-plan-card.is-dragging{opacity:.35;transform:scale(.975)}
.admin-plan-card.drag-target{border-color:#fff;box-shadow:0 0 0 1px var(--plan-accent),0 0 34px color-mix(in srgb,var(--plan-accent) 38%,transparent)}
.admin-plan-drag-handle{position:absolute;z-index:8;left:9px;bottom:9px;width:31px;height:31px;display:grid;place-items:center;padding:0;border:1px solid color-mix(in srgb,var(--plan-accent) 45%,rgba(255,255,255,.12));border-radius:8px;background:rgba(6,7,9,.86);color:#fff;font-size:18px;cursor:grab;box-shadow:0 0 14px color-mix(in srgb,var(--plan-accent) 22%,transparent)}
.admin-plan-drag-handle:active{cursor:grabbing}
@keyframes planElectricPulse{0%,100%{opacity:.35;transform:scaleX(.72);transform-origin:left}50%{opacity:.95;transform:scaleX(1);transform-origin:left}}
.admin-plan-card.inactive { opacity:.66; filter:saturate(.45); }
.admin-plan-visual { min-height:0; position:relative; overflow:hidden; background:radial-gradient(circle at 30% 20%,color-mix(in srgb,var(--plan-accent) 24%,transparent),transparent 52%),#090a0c; }
.admin-plan-visual img { width:100%; height:100%; object-fit:cover; filter:grayscale(.28) contrast(1.09) saturate(.9); }
.admin-plan-visual > span { position:absolute; right:20px; bottom:-8px; color:rgba(255,255,255,.045); font:900 100px/1 Arial; }
.admin-plan-visual i { position:absolute; inset:0; background:linear-gradient(0deg,#101115,transparent 65%); }
.admin-plan-visual em,.admin-plan-visual small { position:absolute; top:14px; padding:5px 9px; font-size:9px; font-style:normal; }
.admin-plan-visual em { right:14px; background:var(--plan-accent); color:#fff; }.admin-plan-visual small { left:14px; background:rgba(0,0,0,.6); color:#fff; border:1px solid rgba(255,255,255,.14); }
.admin-plan-body { min-height:0;padding:7px clamp(10px,1.1vw,18px) 10px;display:grid;align-content:center;gap:clamp(4px,.7vh,9px);overflow:hidden }
.admin-plan-body .plan-kicker{filter:drop-shadow(0 0 5px color-mix(in srgb,var(--plan-accent) 75%,transparent))}
.admin-plan-body h3{margin:0;font-size:clamp(15px,1.25vw,22px);text-shadow:0 0 12px color-mix(in srgb,var(--plan-accent) 18%,transparent)}.admin-plan-body .desc{min-height:0;font-size:clamp(9px,.72vw,12px);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.admin-plan-price { display:flex; gap:8px; align-items:baseline; padding-top:clamp(5px,.7vh,9px); border-top:1px solid rgba(255,255,255,.08); }.admin-plan-price strong { font-size:clamp(16px,1.35vw,23px); }.admin-plan-price span { color:var(--muted); font-size:9px; }
.admin-plan-metrics { display:grid; grid-template-columns:repeat(3,1fr); border:1px solid rgba(255,255,255,.08); }.admin-plan-metrics div { display:grid; text-align:center; gap:2px; padding:9px; border-left:1px solid rgba(255,255,255,.08); }.admin-plan-metrics div:last-child { border:0; }.admin-plan-metrics b { font-size:15px; }.admin-plan-metrics span { color:var(--muted); font-size:9px; }
.admin-plan-actions { display:flex; gap:6px; padding:0 clamp(10px,1.1vw,18px) clamp(9px,1.2vh,16px); }.admin-plan-actions .btn,.admin-plan-actions .action-btn { font-size:10px; padding:7px 9px;min-height:30px }.admin-plan-actions .icon-btn { margin-right:auto; }
.admin-plan-showcase[data-density="dense"] .admin-plan-card{grid-template-rows:minmax(54px,26%) minmax(0,1fr) auto}
.admin-plan-showcase[data-density="dense"] .admin-plan-body .desc{display:none}
.admin-plan-showcase[data-density="dense"] .admin-plan-metrics div{padding:4px}
.admin-plan-showcase[data-density="dense"] .admin-plan-actions{gap:3px;padding-bottom:6px}
.admin-plan-showcase[data-density="dense"] .admin-plan-actions .btn,.admin-plan-showcase[data-density="dense"] .admin-plan-actions .action-btn{font-size:8px;padding:5px 6px;min-height:24px}
.admin-plan-showcase[data-density="micro"] .admin-plan-card{grid-template-rows:minmax(38px,22%) minmax(0,1fr) auto;border-radius:3px 14px 3px 3px}
.admin-plan-showcase[data-density="micro"] .admin-plan-body{padding:3px 7px;gap:2px}.admin-plan-showcase[data-density="micro"] .admin-plan-body .desc,.admin-plan-showcase[data-density="micro"] .admin-plan-price span,.admin-plan-showcase[data-density="micro"] .admin-plan-visual small{display:none}
.admin-plan-showcase[data-density="micro"] .admin-plan-metrics div{padding:2px}.admin-plan-showcase[data-density="micro"] .admin-plan-metrics span{font-size:7px}.admin-plan-showcase[data-density="micro"] .admin-plan-metrics b{font-size:10px}
.admin-plan-showcase[data-density="micro"] .admin-plan-actions{padding:0 7px 4px}.admin-plan-showcase[data-density="micro"] .admin-plan-actions .btn,.admin-plan-showcase[data-density="micro"] .admin-plan-actions .action-btn{font-size:0;min-width:24px;padding:3px}.admin-plan-showcase[data-density="micro"] .admin-plan-actions .btn:first-child::after{content:"ویرایش";font-size:7px}.admin-plan-showcase[data-density="micro"] .admin-plan-actions .btn:nth-child(2)::after{content:"وضعیت";font-size:7px}.admin-plan-showcase[data-density="micro"] .admin-plan-actions .action-btn::after{content:"حذف";font-size:7px}
.admin-plan-showcase[data-density="micro"] .admin-plan-drag-handle{width:22px;height:22px;font-size:13px;left:5px;bottom:4px}
@media(prefers-reduced-motion:reduce){.admin-plan-card::before{animation:none}}
@media(max-width:900px){
  .plans-admin-toolbar{align-items:flex-start;flex-direction:column}
  .admin-plan-showcase{height:auto;min-height:0;grid-template-columns:1fr!important;grid-template-rows:none!important}
  .admin-plan-card{min-height:430px;grid-template-rows:150px minmax(0,1fr) auto}
  .admin-plan-showcase[data-density] .admin-plan-body .desc{display:-webkit-box}
}

/* V101 — plan selector cards + complete centered editors */
.admin-plan-card{grid-template-rows:minmax(64px,56%) minmax(0,1fr);cursor:pointer}
.admin-plan-showcase[data-density="dense"] .admin-plan-card{grid-template-rows:minmax(46px,51%) minmax(0,1fr)}
.admin-plan-showcase[data-density="micro"] .admin-plan-card{grid-template-rows:minmax(34px,48%) minmax(0,1fr)}
.admin-plan-card:focus-visible{outline:none;border-color:#fff;box-shadow:0 0 0 1px var(--plan-accent),0 0 30px color-mix(in srgb,var(--plan-accent) 28%,transparent)}
.admin-plan-open{
  display:flex;align-items:center;justify-content:space-between;gap:8px;
  margin-top:2px;padding-top:8px;border-top:1px solid rgba(255,255,255,.075);
  color:#d9dbe0;font-size:10px;font-weight:800
}
.admin-plan-open b{color:var(--plan-accent);font-size:16px;text-shadow:0 0 10px var(--plan-accent)}
.admin-plan-showcase[data-density="dense"] .admin-plan-open{padding-top:4px;font-size:8px}
.admin-plan-showcase[data-density="micro"] .admin-plan-open{padding-top:2px;font-size:0}
.admin-plan-showcase[data-density="micro"] .admin-plan-open::before{content:"ویرایش";font-size:7px}
.admin-plan-showcase[data-density="micro"] .admin-plan-open b{font-size:11px}
.plan-editor-modal{
  z-index:240;padding:clamp(10px,2.5vw,28px);
  background:rgba(0,0,0,.78);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)
}
.product-shell .plan-editor-dialog{
  position:relative;width:min(820px,100%);max-width:820px!important;
  max-height:calc(100svh - clamp(20px,5vw,56px));padding:18px;
  overflow-y:auto!important;overflow-x:hidden;
  border:1px solid rgba(255,255,255,.12);
  background:
    radial-gradient(circle at 85% 0,rgba(240,43,53,.13),transparent 30%),
    linear-gradient(155deg,#15171b,#090a0c 72%);
  box-shadow:0 34px 110px rgba(0,0,0,.72),0 0 38px rgba(240,43,53,.1)!important;
  scrollbar-width:thin;scrollbar-color:rgba(240,43,53,.55) rgba(255,255,255,.04)
}
.plan-editor-dialog>.card{
  transform:none!important;border-color:rgba(255,255,255,.09);
  background:rgba(255,255,255,.025);box-shadow:none
}
.plan-editor-close{
  position:sticky;z-index:20;top:0;margin:0 0 -42px auto;
  width:38px;height:38px;display:grid;place-items:center;
  padding:0;border:1px solid rgba(255,255,255,.16);border-radius:10px;
  background:rgba(8,9,11,.94);color:#fff;font:300 25px/1 Arial;cursor:pointer;
  box-shadow:0 0 22px rgba(240,43,53,.18)
}
.plan-editor-close:hover{border-color:rgba(240,43,53,.7);box-shadow:0 0 22px rgba(240,43,53,.3)}
.plan-editor-dialog #planFormTitle{padding-left:48px}
.plan-editor-actions{
  position:sticky;z-index:10;bottom:-18px;display:flex;gap:8px;
  margin:18px -20px -20px;padding:13px 20px;
  border-top:1px solid rgba(255,255,255,.09);
  background:linear-gradient(180deg,rgba(13,14,17,.9),#0d0e11 35%);
  backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)
}
.plan-editor-actions .btn:first-child{flex:1}
#durationOptionsCard table{min-width:520px}
@media(max-width:900px){
  .admin-plan-showcase .admin-plan-card{
    min-height:270px;grid-template-rows:minmax(110px,42%) minmax(0,1fr)
  }
  .admin-plan-showcase .admin-plan-metrics{display:none}
}
@media(max-width:600px){
  .plan-editor-modal{padding:8px;align-items:stretch}
  .product-shell .plan-editor-dialog{max-height:calc(100svh - 16px);padding:12px}
  .plan-editor-dialog>.card{padding:15px}
  .plan-editor-actions{bottom:-12px;margin:16px -15px -15px;padding:11px 15px}
  .plan-editor-actions .btn{padding-inline:10px}
}

/* Public sales cards remain short; all variable content lives in the detail dialog. */
.plans-showcase{
  display:grid;grid-template-columns:repeat(var(--public-plan-cols,3),minmax(0,1fr));
  grid-template-rows:repeat(var(--public-plan-rows,1),var(--public-card-height,390px));
  gap:clamp(10px,1.3vw,18px);align-content:center;align-items:stretch;min-height:0;
  max-height:calc(100svh - 132px);overflow:hidden
}
.purchase-plan-card{
  isolation:isolate;display:grid;grid-template-rows:minmax(0,1fr) auto;
  min-width:0;min-height:0;height:var(--public-card-height,390px);cursor:pointer;
  border-color:color-mix(in srgb,var(--plan-accent) 20%,rgba(255,255,255,.1));
  box-shadow:
    0 24px 64px rgba(0,0,0,.42),
    0 0 0 1px color-mix(in srgb,var(--plan-accent) 5%,transparent),
    0 0 28px color-mix(in srgb,var(--plan-accent) 8%,transparent)
}
.purchase-plan-card::before{
  content:"";position:absolute;z-index:5;inset:-1px auto auto -1px;
  width:46%;height:2px;pointer-events:none;
  background:linear-gradient(90deg,transparent,var(--plan-accent) 55%,#fff);
  box-shadow:0 0 8px #fff,0 0 18px var(--plan-accent),0 0 38px var(--plan-accent);
  animation:planElectricPulse 3.2s ease-in-out infinite
}
.purchase-plan-card::after{
  content:"";position:absolute;z-index:5;left:-1px;top:12%;width:1px;height:25%;
  background:#fff;box-shadow:0 0 7px #fff,0 0 18px var(--plan-accent);
  opacity:.72;pointer-events:none
}
.purchase-plan-card:hover{
  transform:translateY(-5px);
  border-color:color-mix(in srgb,var(--plan-accent) 72%,rgba(255,255,255,.18));
  box-shadow:0 30px 76px rgba(0,0,0,.5),0 0 34px color-mix(in srgb,var(--plan-accent) 21%,transparent)
}
.purchase-plan-card:focus-visible{outline:2px solid var(--plan-accent);outline-offset:4px}
.purchase-plan-card .plan-visual{height:100%;min-height:0}
.purchase-plan-card .plan-visual img{
  transform:scale(1.012);filter:grayscale(.32) contrast(1.1) saturate(.9);
  transition:transform .55s ease,filter .55s ease
}
.purchase-plan-card:hover .plan-visual img{transform:scale(1.055);filter:grayscale(.06) contrast(1.12) saturate(1)}
.plan-summary{
  position:relative;display:grid;gap:8px;padding:14px 17px 16px;
  border-top:1px solid rgba(255,255,255,.075);
  background:linear-gradient(150deg,rgba(18,20,24,.98),rgba(7,8,10,.98))
}
.plan-summary h3{
  margin:0;font-size:clamp(16px,1.35vw,23px);line-height:1.45;
  text-shadow:0 0 18px color-mix(in srgb,var(--plan-accent) 20%,transparent)
}
.plan-reveal-btn{
  width:100%;display:flex;align-items:center;justify-content:space-between;gap:10px;
  padding:9px 11px;border:1px solid color-mix(in srgb,var(--plan-accent) 38%,rgba(255,255,255,.1));
  background:linear-gradient(90deg,color-mix(in srgb,var(--plan-accent) 11%,transparent),rgba(255,255,255,.02));
  color:#fff;font-family:inherit;font-size:10px;font-weight:800;cursor:pointer
}
.plan-reveal-btn b{color:var(--plan-accent);font-size:17px;text-shadow:0 0 10px var(--plan-accent)}
.plans-showcase[data-density="balanced"] .plan-summary{padding:10px 13px 12px;gap:6px}
.plans-showcase[data-density="balanced"] .plan-summary h3{font-size:clamp(14px,1.18vw,20px)}
.plans-showcase[data-density="compact"] .plan-summary{padding:7px 10px 9px;gap:4px}
.plans-showcase[data-density="compact"] .plan-summary h3{font-size:13px}
.plans-showcase[data-density="compact"] .plan-reveal-btn{padding:5px 8px;font-size:8px}
.plans-showcase[data-density="compact"] .plan-kicker{font-size:7px}

.purchase-plan-modal{
  z-index:250;padding:clamp(10px,2.5vw,28px);
  background:rgba(0,0,0,.82);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)
}
.purchase-plan-dialog{
  position:relative;width:min(610px,100%);max-width:610px;
  max-height:calc(100svh - clamp(20px,5vw,56px));padding:0;
  overflow:hidden;border:1px solid rgba(255,255,255,.13);border-radius:4px 28px 4px 4px!important;
  background:
    radial-gradient(circle at 90% 10%,rgba(240,43,53,.11),transparent 28%),
    linear-gradient(145deg,#131519,#08090b 70%);
  box-shadow:0 38px 120px rgba(0,0,0,.78),0 0 42px rgba(240,43,53,.12)!important;
  outline:none;scrollbar-width:thin;scrollbar-color:rgba(240,43,53,.55) rgba(255,255,255,.04)
}
#purchasePlanDetail{
  display:block;max-height:calc(100svh - clamp(20px,5vw,56px));overflow-y:auto;
  scrollbar-width:thin;scrollbar-color:rgba(240,43,53,.55) rgba(255,255,255,.04)
}
.purchase-plan-close{
  position:absolute;z-index:20;top:14px;left:14px;width:40px;height:40px;
  display:grid;place-items:center;padding:0;border:1px solid rgba(255,255,255,.18);border-radius:10px;
  background:rgba(5,6,8,.84);color:#fff;font:300 27px/1 Arial;cursor:pointer;
  box-shadow:0 0 22px rgba(240,43,53,.2);backdrop-filter:blur(8px)
}
.purchase-plan-close:hover{border-color:rgba(240,43,53,.8);box-shadow:0 0 26px rgba(240,43,53,.36)}
.purchase-dialog-hero{
  position:relative;width:100%;aspect-ratio:16/7.2;min-height:0;overflow:hidden;
  background:radial-gradient(circle at 40% 25%,color-mix(in srgb,var(--plan-accent) 25%,transparent),transparent 48%),#08090b
}
.purchase-dialog-hero img{width:100%;height:100%;object-fit:cover;filter:grayscale(.22) contrast(1.1)}
.purchase-dialog-hero>i{
  position:absolute;inset:0;
  background:linear-gradient(90deg,rgba(8,9,11,.1),rgba(8,9,11,.75)),linear-gradient(0deg,#08090b 0,transparent 55%)
}
.purchase-dialog-content{
  display:flex;flex-direction:column;gap:12px;padding:22px 24px 24px;
  min-width:0;direction:rtl
}
.purchase-dialog-content>.plan-kicker{
  color:var(--plan-accent);filter:drop-shadow(0 0 7px color-mix(in srgb,var(--plan-accent) 80%,transparent))
}
.purchase-dialog-content h2{
  margin:0;padding-left:40px;font-size:clamp(23px,2.35vw,34px);line-height:1.35;
  text-shadow:0 0 22px color-mix(in srgb,var(--plan-accent) 25%,transparent)
}
.purchase-plan-description{
  color:#c6c9d0;font-size:12px;line-height:1.95;white-space:pre-line
}
.purchase-dialog-content .plan-start-price{margin-top:2px;padding:11px 0}
.purchase-dialog-content .plan-start-price strong{font-size:23px}
.purchase-dialog-content .plan-duration-list{display:flex;flex-direction:column;gap:7px}
.purchase-dialog-content .plan-duration-option{
  display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:10px;
  min-height:52px;padding:9px 11px
}
.purchase-dialog-content .plan-duration-option>span{
  display:grid;justify-content:stretch;align-items:start;gap:3px;text-align:right
}
.purchase-dialog-content .plan-duration-option>span>b{font-size:12px}
.purchase-dialog-content .plan-duration-option>span>small{font-size:9px;line-height:1.55}
.purchase-dialog-content .plan-duration-option>strong{
  color:#f4f5f7;font-size:12px;white-space:nowrap;text-align:left
}
.purchase-dialog-content .plan-duration-option>strong>small{font-size:8px;font-weight:500;color:var(--muted)}
.purchase-dialog-content .plan-buy-btn{margin-top:2px}
@media(max-width:760px){
  .plans-showcase{
    height:auto!important;grid-template-columns:1fr!important;grid-template-rows:none!important;
    max-height:none;overflow:visible;gap:14px
  }
  .purchase-plan-card{height:auto;min-height:315px;grid-template-rows:minmax(185px,1fr) auto}
  .purchase-plan-modal{padding:8px;align-items:stretch}
  .purchase-plan-dialog{max-height:calc(100svh - 16px);border-radius:4px 20px 4px 4px!important}
  #purchasePlanDetail{max-height:calc(100svh - 16px)}
  .purchase-dialog-hero{aspect-ratio:16/8.3;min-height:0;max-height:30svh}
  .purchase-dialog-content{padding:22px 17px 18px;gap:11px}
  .purchase-dialog-content h2{font-size:25px}
  .purchase-plan-description{max-height:none;font-size:12px}
  .purchase-dialog-content .plan-duration-option{grid-template-columns:auto minmax(0,1fr);padding:10px}
  .purchase-dialog-content .plan-duration-option>strong{grid-column:2;text-align:right}
}
@media(prefers-reduced-motion:reduce){
  .purchase-plan-card::before{animation:none}
  .purchase-plan-card,.purchase-plan-card .plan-visual img{transition:none}
}

/* V103 — athlete plan cards and detail view follow one locked vertical rhythm. */
.purchase-plan-card .plan-category,
.purchase-dialog-hero .plan-category{
  z-index:4;top:12px;left:12px;max-width:calc(100% - 24px);
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
  border-color:color-mix(in srgb,var(--plan-accent) 42%,rgba(255,255,255,.18));
  box-shadow:0 0 18px color-mix(in srgb,var(--plan-accent) 18%,transparent)
}
.purchase-plan-dialog{
  display:block;grid-template-columns:none;width:min(680px,100%);max-width:680px
}
#purchasePlanDetail{display:block;width:100%}
.purchase-dialog-hero{
  aspect-ratio:16/9
}
.purchase-dialog-hero>i{
  background:linear-gradient(0deg,#08090b 0,rgba(8,9,11,.08) 55%),linear-gradient(90deg,transparent,rgba(8,9,11,.28))
}
.purchase-dialog-content{
  gap:11px;padding:18px 22px 20px
}
.purchase-dialog-content h2{
  padding-left:42px;font-size:clamp(22px,2.1vw,31px)
}
.purchase-plan-description{
  padding:0 0 12px;border-bottom:1px solid rgba(255,255,255,.08);
  color:#c8cbd1;font-size:12px;line-height:1.9
}
.purchase-dialog-content .plan-duration-list{
  gap:6px
}
.purchase-dialog-content .plan-duration-option{
  grid-template-columns:auto minmax(0,1fr) auto;gap:11px;min-height:55px;padding:9px 12px;
  border-radius:2px;background:rgba(255,255,255,.022)
}
.purchase-dialog-content .plan-duration-option input{
  width:16px;height:16px;margin:0;accent-color:var(--plan-accent)
}
.purchase-dialog-content .plan-duration-copy{
  display:grid;width:auto;min-width:0;gap:2px;text-align:right
}
.purchase-dialog-content .plan-duration-copy b{
  font-size:12px;line-height:1.5
}
.purchase-dialog-content .plan-duration-copy small{
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
  color:var(--muted);font-size:9px;line-height:1.55
}
.purchase-dialog-content .plan-duration-value{
  display:flex;align-items:center;justify-content:flex-end;gap:8px;white-space:nowrap
}
.purchase-dialog-content .plan-duration-value em{
  color:var(--plan-accent);font-style:normal;font-size:9px;font-weight:800
}
.purchase-dialog-content .plan-duration-value strong{
  color:#f4f5f7;font-size:12px
}
.purchase-dialog-content .plan-duration-value strong small{
  color:var(--muted);font-size:8px;font-weight:500
}
.purchase-plan-checkout{
  position:sticky;z-index:8;bottom:0;display:grid;
  grid-template-columns:minmax(150px,1fr) minmax(210px,.9fr);
  align-items:stretch;gap:10px;margin:2px -22px -20px;padding:12px 22px 14px;
  border-top:1px solid rgba(255,255,255,.09);
  background:linear-gradient(180deg,rgba(8,9,11,.88),#08090b 24%);
  backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)
}
.plan-selected-total{
  display:grid;grid-template-columns:auto 1fr;align-content:center;align-items:end;
  gap:2px 9px;min-width:0;padding:7px 0;text-align:right
}
.plan-selected-total>span,.plan-selected-total>small{
  color:var(--muted);font-size:9px
}
.plan-selected-total>strong{
  grid-row:span 2;color:#fff;font-size:clamp(20px,2vw,27px);line-height:1.2
}
.purchase-plan-checkout .plan-buy-btn{
  min-height:58px;margin:0;padding:12px 15px;font-family:inherit
}
@media(max-width:760px){
  .purchase-plan-dialog{width:100%;max-width:none}
  .purchase-dialog-hero{aspect-ratio:16/9;max-height:27svh}
  .purchase-dialog-content{padding:17px 14px 15px}
  .purchase-dialog-content .plan-duration-option{
    grid-template-columns:auto minmax(0,1fr) auto;padding:9px
  }
  .purchase-dialog-content .plan-duration-option>strong{grid-column:auto}
  .purchase-dialog-content .plan-duration-copy small{white-space:normal}
  .purchase-dialog-content .plan-duration-value{display:grid;gap:2px;text-align:left}
  .purchase-plan-checkout{
    grid-template-columns:minmax(125px,.85fr) minmax(165px,1.15fr);
    margin:2px -14px -15px;padding:10px 14px 12px
  }
  .plan-selected-total{grid-template-columns:1fr;gap:1px}
  .plan-selected-total>strong{grid-row:auto;font-size:19px}
  .purchase-plan-checkout .plan-buy-btn{min-height:54px;padding:10px;font-size:11px}
}
.copy-settings-card { max-width:900px; margin-top:16px; }.copy-settings-card label { display:grid; gap:6px; font-size:12px; color:var(--muted); }.copy-settings-card textarea { min-height:85px; }

.radio-list { display: flex; flex-direction: column; gap: 8px; }
.radio-option {
  display: flex; align-items: center; gap: 10px;
  background: var(--card-2); border: 1px solid var(--border); border-radius: 12px;
  padding: 12px 14px; cursor: pointer; transition: border-color .15s, background .15s;
}
.radio-option:has(input:checked) { border-color: var(--accent); background: rgba(255,106,61,.08); background: color-mix(in srgb, var(--accent) 8%, transparent); }
.radio-option input[type="radio"] { width: 18px; height: 18px; accent-color: var(--accent); flex-shrink: 0; }
.radio-option span { font-size: 14px; }

/* ---------- سازنده‌ی برنامه‌ی تمرینی (فاز دوم) ---------- */
.day-card { gap: 0; }

.ex-block { margin-bottom: 10px; border-radius: 14px; }
.ex-block.grouped {
  border: 1px dashed var(--accent);
  background: rgba(255,106,61,.07);
  background: color-mix(in srgb, var(--accent) 7%, transparent);
  padding: 8px;
}
.block-header {
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
  padding: 2px 4px 8px;
}
.block-letter {
  width: 24px; height: 24px; border-radius: 8px; flex-shrink: 0;
  background: var(--accent); color: #fff; font-weight: 800; font-size: 12px;
  display: inline-flex; align-items: center; justify-content: center;
}
.block-desc { font-size: 11px; flex: 1; min-width: 120px; }

.ex-row {
  background: var(--card-2); border: 1px solid var(--border);
  border-radius: 12px; padding: 10px 12px; margin-bottom: 6px;
}
.ex-main { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; justify-content: space-between; }
.ex-name { display: flex; align-items: center; gap: 7px; flex-wrap: wrap; min-width: 180px; flex: 1; }
.ex-name b { font-size: 14px; }
.ex-code {
  font-size: 11px; font-weight: 800; color: var(--accent);
  min-width: 22px; text-align: center;
}
.sys-badge { background: var(--success); color: #06301a; font-size: 10.5px; padding: 2px 8px; }

.ex-fields { display: flex; align-items: flex-end; gap: 6px; flex-wrap: wrap; }
label.mini {
  display: flex; flex-direction: column; gap: 2px; margin: 0;
  font-size: 10.5px; color: var(--muted);
}
label.mini input { width: 58px; padding: 6px 8px; font-size: 13px; border-radius: 8px; }
label.mini.wide input { width: 96px; }

.icon-btn {
  width: 30px; height: 30px; border-radius: 9px; flex-shrink: 0;
  border: 1px solid var(--border); background: var(--card);
  color: var(--text); cursor: pointer; font-size: 13px; line-height: 1;
  display: inline-flex; align-items: center; justify-content: center;
  transition: background .15s, border-color .15s;
}
.icon-btn:hover:not(:disabled) { background: var(--border); }
.icon-btn:disabled { opacity: .3; cursor: not-allowed; }
.icon-btn.active { background: var(--accent); color: #fff; border-color: var(--accent); }
.icon-btn.danger-btn {
  background: linear-gradient(145deg,#f23b48,#c82432);
  color: #fff;
  border-color: rgba(255,87,104,.62);
  box-shadow: 0 5px 14px rgba(220,47,71,.25);
}
.icon-btn.danger-btn:hover {
  background: linear-gradient(145deg,#ff4b58,#d72a39);
  color: #fff;
  border-color: rgba(255,126,137,.82);
}

.ex-advanced {
  margin-top: 10px; padding-top: 10px; border-top: 1px dashed var(--border);
}
.adv-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 10px; }
.mini-label { font-size: 11px; color: var(--muted); margin: 0 0 3px; display: block; }
.adv-grid input, .adv-grid select { padding: 7px 10px; font-size: 12.5px; }

.set-detail {
  background: var(--card); border: 1px solid var(--border);
  border-radius: 10px; padding: 10px;
}
.set-row { display: flex; align-items: flex-end; gap: 8px; margin-bottom: 6px; flex-wrap: wrap; }
.set-no { font-size: 11.5px; color: var(--muted); min-width: 42px; padding-bottom: 7px; }

.modal-backdrop {
  position: fixed; inset: 0; background: rgba(0,0,0,.6); z-index: 60;
  align-items: center; justify-content: center; padding: 20px;
  backdrop-filter: blur(3px);
}
.modal-panel { max-width: 620px; width: 100%; max-height: 84vh; overflow: auto; }
.picker-item {
  display: flex; align-items: center; gap: 10px;
  padding: 8px 10px; border-radius: 10px;
  border: 1px solid transparent; font-size: 13px;
}
.picker-item:hover { background: var(--card-2); border-color: var(--border); }
.picker-item-selected { background: color-mix(in srgb, var(--accent) 10%, transparent); border-color: var(--accent); }
.picker-check {
  flex-shrink: 0; width: 26px; height: 26px; border-radius: 50%; cursor: pointer;
  border: 1px solid var(--border); display: flex; align-items: center; justify-content: center;
  font-size: 13px; font-weight: 800; color: #fff; background: var(--card-2);
}
.picker-item-selected .picker-check { background: var(--accent); border-color: var(--accent); }
.picker-item-info {
  flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px;
  cursor: pointer; overflow: hidden;
}
.picker-item-info span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.picker-thumb {
  width: 56px; height: 56px; min-width: 56px; border-radius: 10px;
  object-fit: cover; background: var(--card-2); flex-shrink: 0;
}
.picker-thumb-empty {
  display: flex; align-items: center; justify-content: center; text-align: center;
  font-size: 9.5px; color: var(--muted); line-height: 1.3; padding: 4px;
  border: 1px dashed var(--border);
}
.picker-star {
  flex-shrink: 0; width: 34px; height: 34px; border-radius: 9px;
  border: 1px solid var(--border); background: var(--card);
  color: var(--border); font-size: 16px; cursor: pointer; line-height: 1;
  display: flex; align-items: center; justify-content: center;
  transition: color .15s, border-color .15s, background .15s;
}
.picker-star:hover { border-color: var(--accent); }
.picker-star.active { color: #f5b500; border-color: #f5b500; background: rgba(245,181,0,.12); }

/* انتخابگر مشترک بانک غذا، مکمل و ویتامین؛ هم‌خانواده با بانک حرکات */
.catalog-picker { display:grid; gap:10px; }
.program-view-actions{display:flex;justify-content:flex-start;margin-top:14px}
.program-view-actions .print-btn{min-width:170px;text-align:center}
.catalog-picker-search { margin:0; }
.catalog-category-grid {
  display:flex; flex-wrap:wrap; gap:7px; padding:10px;
  border:1px solid var(--border); border-radius:14px; background:var(--card-2);
  max-height:132px; overflow-y:auto; overflow-x:hidden;
}
.catalog-category {
  width:auto; min-height:34px; margin:0; padding:7px 12px; border-radius:10px;
  border:1px solid transparent; background:transparent; color:var(--muted);
  font:inherit; font-size:12px; font-weight:800; cursor:pointer;
}
.catalog-category:hover { color:var(--text); border-color:var(--border); background:var(--card); }
.catalog-category.active { color:#fff; border-color:var(--accent); background:var(--accent); }
.catalog-results {
  display:grid; gap:6px; max-height:40vh; overflow-y:auto; overflow-x:hidden;
  padding:4px 2px 4px 6px; scrollbar-gutter:stable;
}
.catalog-item {
  display:flex; align-items:center; gap:10px; min-width:0; padding:9px 10px;
  border:1px solid var(--border); border-radius:12px; background:var(--card);
  transition:border-color .15s,background .15s,transform .15s;
}
.catalog-item:hover { border-color:color-mix(in srgb,var(--accent) 48%,var(--border)); transform:translateY(-1px); }
.catalog-item.selected {
  border-color:var(--accent);
  background:linear-gradient(135deg,color-mix(in srgb,var(--accent) 16%,var(--card)),var(--card-2));
}
.catalog-item-main {
  flex:1; min-width:0; display:flex; flex-direction:column; gap:2px; cursor:pointer;
}
.catalog-item-main strong,.catalog-item-main span {
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}
.catalog-item-main strong { font-size:13px; }
.catalog-item-main span { color:var(--muted); font-size:10.5px; }
.catalog-check {
  flex:0 0 27px; width:27px; height:27px; display:grid; place-items:center;
  border:1px solid var(--border); border-radius:50%; background:var(--card-2);
  color:#fff; font-size:13px; font-weight:900; cursor:pointer;
}
.catalog-item.selected .catalog-check { border-color:var(--accent); background:var(--accent); }
.catalog-star {
  flex:0 0 34px; width:34px; height:34px; display:grid; place-items:center;
  margin:0; padding:0; border:1px solid var(--border); border-radius:9px;
  background:var(--card-2); color:var(--border); font-size:17px; cursor:pointer;
}
.catalog-star:hover { border-color:#f5b500; }
.catalog-star.active { color:#f5b500; border-color:#f5b500; background:rgba(245,181,0,.12); }
.catalog-empty { margin:0; padding:18px; text-align:center; color:var(--muted); font-size:12px; }

@media (max-width: 480px) {
  .picker-thumb { width: 46px; height: 46px; min-width: 46px; }
  .picker-star { width: 30px; height: 30px; font-size: 14px; }
  .picker-item { gap: 8px; padding: 7px 8px; }
  .catalog-category-grid { max-height:156px; }
  .catalog-category { flex:1 1 calc(50% - 7px); text-align:center; }
  .catalog-results { max-height:34vh; }
}

/* نمای ورزشکار: بلوک‌های تمرینی */
.athlete-block {
  border-radius: 16px; margin-bottom: 14px;
}
.athlete-block.grouped {
  border: 1px dashed var(--accent);
  background: rgba(255,106,61,.06);
  background: color-mix(in srgb, var(--accent) 6%, transparent);
  padding: 12px;
}

@media (max-width: 640px) {
  .ex-main { align-items: flex-start; }
  .ex-fields { width: 100%; }
  label.mini input { width: 52px; }
  label.mini.wide input { width: 80px; }
}

/* شبکه‌ی سه‌ستونه برای فیلترها و متادیتای الگو */
.row3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
@media (max-width: 720px) { .row3 { grid-template-columns: 1fr; } }

/* گروه‌بندی روز و نوبت‌های تمرین */
.day-group { margin-bottom: 22px; }
.day-group-header {
  display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
  padding: 0 4px 10px;
}
.day-no-badge {
  background: var(--card); border: 1px solid var(--border);
  padding: 6px 14px; border-radius: 10px; font-weight: 800; font-size: 13px;
}

/* ---------- فشرده‌سازی پنل مدیریت (کمتر اسکرول) ---------- */
.app-main .card { padding: 14px 16px; border-radius: 14px; }
.app-main .card h3 { font-size: 15px; }
.app-main .section { margin: 16px 0; }
.app-main label { margin: 9px 0 4px; font-size: 12px; }
.app-main input, .app-main select, .app-main textarea { padding: 9px 11px; font-size: 13px; }
.app-main textarea { min-height: 58px; }
.app-main .btn { padding: 9px 15px; font-size: 13px; }
.app-main .stats { gap: 10px; margin-bottom: 14px; }
.app-main .stat-card { padding: 13px; border-radius: 13px; }
.app-main .stat-card .num { font-size: 21px; }
.app-main th, .app-main td { padding: 8px 8px; font-size: 12.5px; }
.app-main .grid { gap: 12px; }
.app-main .card:hover { transform: none; }

/* بخش‌های بازشونده — محتوای سنگین (نمودار، عکس، جدول‌های بلند) پیش‌فرض بسته است */
details.fold {
  background: var(--card); border: 1px solid var(--border); border-radius: 14px;
  margin-bottom: 12px; overflow: hidden;
  backdrop-filter: var(--glass-blur); -webkit-backdrop-filter: var(--glass-blur);
}
details.fold > summary {
  cursor: pointer; padding: 13px 16px; font-weight: 700; font-size: 14px;
  list-style: none; display: flex; align-items: center; gap: 8px;
  transition: background .15s;
}
details.fold > summary:hover { background: var(--card-2); }
details.fold > summary::-webkit-details-marker { display: none; }
details.fold > summary::before {
  content: '▸'; color: var(--accent); font-size: 12px; transition: transform .2s;
  display: inline-block;
}
details.fold[open] > summary::before { transform: rotate(-90deg); }
details.fold[open] > summary { border-bottom: 1px solid var(--border); }
.fold-body { padding: 14px 16px; }
.fold-body .chart-wrap { margin-bottom: 10px; padding: 12px; }
.fold-body table { margin: 0; }

/* گرید یکنواخت تایل‌های مربعی (پنل روند پیشرفت ورزشکار)
   در دسکتاپ تعداد ستون‌ها از تعداد واقعی کارت‌ها محاسبه می‌شود تا دو ردیف متوازن ساخته شود:
   تعداد زوج نصف‌ونصف و تعداد فرد با اختلاف فقط یک کارت. */
.tile-grid {
  display: grid; grid-template-columns: repeat(var(--tile-columns, 5), minmax(0, 1fr));
  gap: 12px; margin: 18px 0;
}
.tile-btn {
  aspect-ratio: 1 / 1; display: flex; flex-direction: column; align-items: center; justify-content: center;
  position: relative; isolation: isolate; overflow: hidden;
  gap: 8px; background:
    radial-gradient(circle at 82% 12%, rgba(239,48,57,.12), transparent 42%),
    linear-gradient(145deg, rgba(28,29,34,.94), rgba(12,13,16,.98));
  border: 1px solid rgba(255,255,255,.09); border-radius: 4px 20px 4px 4px;
  color: var(--text); cursor: pointer; font-family: inherit; padding: 10px;
  backdrop-filter: var(--glass-blur); -webkit-backdrop-filter: var(--glass-blur);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.035), 0 10px 24px rgba(0,0,0,.22);
  transition: border-color .2s, box-shadow .2s, transform .2s, background .2s;
}
.tile-btn::before {
  content: ""; position: absolute; z-index: -1; inset: 0;
  background: linear-gradient(135deg, rgba(239,48,57,.34), transparent 18%, transparent 77%, rgba(239,48,57,.12));
  opacity: .38; pointer-events: none;
}
.tile-btn::after {
  content: ""; position: absolute; top: -1px; right: -1px; width: 42%; height: 2px;
  background: linear-gradient(90deg, transparent, #ef3039);
  box-shadow: 0 0 9px rgba(239,48,57,.8); pointer-events: none;
}
.tile-btn:hover, .tile-btn:focus-visible {
  border-color: rgba(239,48,57,.58); transform: translateY(-3px);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.05), 0 14px 30px rgba(0,0,0,.3), 0 0 18px rgba(239,48,57,.16);
  outline: none;
}
.tile-icon {
  position: relative; display: grid; place-items: center; width: 31px; height: 31px;
  color: rgba(250,250,252,.94);
  filter: drop-shadow(0 0 2px rgba(255,255,255,.28)) drop-shadow(0 0 7px rgba(239,48,57,.68));
}
.tile-icon::before {
  content: ""; position: absolute; width: 22px; height: 22px; border-radius: 50%;
  background: rgba(239,48,57,.18); filter: blur(8px); pointer-events: none;
}
.tile-icon svg {
  position: relative; z-index: 1; width: 100%; height: 100%; fill: none; stroke: currentColor;
  stroke-width: 1.55; stroke-linecap: round; stroke-linejoin: round;
  vector-effect: non-scaling-stroke;
}
.tile-btn:hover .tile-icon, .tile-btn:focus-visible .tile-icon {
  color: #fff;
  filter: drop-shadow(0 0 2px rgba(255,255,255,.42)) drop-shadow(0 0 9px rgba(239,48,57,.85));
}
.tile-title { font-size: 12.5px; font-weight: 700; text-align: center; line-height: 1.5; }
.tile-modal-head {
  position: sticky; top: -14px; z-index: 5;
  display: flex; align-items: center; justify-content: space-between; gap: 10px;
  margin: -14px -14px 14px; padding: 14px;
  border-bottom: 1px solid var(--border);
  background: rgba(12,13,16,.96);
  backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px);
}
.tile-modal-head h3 { margin: 0; }
.nutrition-modal-panel {
  max-height: min(88svh,900px) !important;
  min-height: 0;
  overflow: hidden !important;
  padding-bottom: 0 !important;
}
.nutrition-modal-panel > .tile-modal-head {
  position: relative;
  top: auto;
  flex: 0 0 auto;
  margin-bottom: 0;
}
.nutrition-modal-scroll {
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: scroll;
  overflow-x: hidden;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
  touch-action: pan-y;
  padding: 0 5px 34px;
  scrollbar-color: var(--accent) rgba(255,255,255,.07);
  scrollbar-width: auto;
}
.nutrition-modal-scroll::-webkit-scrollbar { width: 12px; }
.nutrition-modal-scroll::-webkit-scrollbar-track { background: rgba(255,255,255,.06); border-radius: 999px; }
.nutrition-modal-scroll::-webkit-scrollbar-thumb { background: var(--accent); border: 3px solid #17181c; border-radius: 999px; }

@media (max-width: 520px) {
  .nutrition-modal-panel { height: 92svh; max-height: 92svh !important; }
}

@media (max-width: 640px) {
  .tile-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 7px; margin: 12px 0; }
  .tile-btn { border-radius: 3px 13px 3px 3px; padding: 7px 5px; gap: 5px; min-height: 88px; }
  .tile-icon {
    width: 23px; height: 23px;
    filter: drop-shadow(0 0 1px rgba(255,255,255,.22)) drop-shadow(0 0 4px rgba(239,48,57,.56));
  }
  .tile-icon::before { width: 17px; height: 17px; filter: blur(6px); }
  .tile-icon svg { stroke-width: 1.45; }
  .tile-title { font-size: 10.5px; line-height: 1.45; }
  .tile-btn::after { box-shadow: 0 0 5px rgba(239,48,57,.58); }
  .chart-wrap, body.admin .chart-wrap { padding: 9px; border-radius: 4px 13px 4px 4px; margin-bottom: 8px; }
}

/* ---------- حالت فشرده‌ی پنل مدیریت ----------
   پنل مربی پر از فرم و جدول است؛ این تنظیمات ارتفاع را کم می‌کند تا اسکرول کمتری لازم باشد.
   صفحات ورزشکار عمداً از این قوانین مستثنا هستند تا خوانا و راحت بمانند. */
body.admin .container { padding: 16px; }
body.admin .app-main { padding: 18px; }

body.admin h2 { font-size: 18px; margin: 0 0 10px; }
body.admin .card { padding: 14px; border-radius: 14px; gap: 6px; }
body.admin .card h3 { font-size: 14.5px; }
body.admin .section { margin: 16px 0; }

body.admin label { font-size: 11.5px; margin: 9px 0 4px; }
body.admin input, body.admin select, body.admin textarea { padding: 8px 10px; font-size: 13px; border-radius: 9px; }
body.admin textarea { min-height: 58px; }
body.admin .row2, body.admin .row3 { gap: 10px; }

body.admin .btn { padding: 9px 15px; font-size: 13px; border-radius: 10px; }
body.admin .stats { gap: 10px; margin-bottom: 14px; }
body.admin .stat-card { padding: 13px; border-radius: 13px; }
body.admin .stat-card .num { font-size: 21px; }
body.admin .stat-card .label { font-size: 11px; }

body.admin table { font-size: 12px; }
body.admin th, body.admin td { padding: 7px 8px; }
body.admin .grid { gap: 12px; grid-template-columns: repeat(auto-fill, minmax(215px, 1fr)); }
body.admin .badge { font-size: 11px; padding: 3px 10px; }
body.admin .desc { font-size: 12.5px; line-height: 1.75; }
body.admin .chart-wrap { padding: 12px; border-radius: 14px; margin-bottom: 12px; }
body.admin .alert { padding: 9px 13px; font-size: 12.5px; margin: 8px 0; }
body.admin .card:hover { transform: none; }



/* ---------- ناوبری بین روزها در نمای برنامه‌ی ورزشکار ---------- */
.exercise-click-hint {
  display: flex; align-items: center; gap: 9px; width: fit-content; max-width: 100%;
  margin: 0 0 14px; padding: 9px 13px; border: 1px solid rgba(239,51,59,.32);
  border-radius: 12px; background: rgba(239,51,59,.08); color: var(--text);
  font-size: 12.5px; line-height: 1.7;
}
.exercise-click-hint span { color: var(--accent); font-size: 17px; line-height: 1; }

.day-nav-bar {
  display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 18px;
  background: var(--card); border: 1px solid var(--border); border-radius: 14px;
  padding: 6px; backdrop-filter: var(--glass-blur); -webkit-backdrop-filter: var(--glass-blur);
  width: fit-content; max-width: 100%; overflow-x: auto;
}
.day-nav-bar button {
  background: transparent; border: none; color: var(--muted); cursor: pointer;
  padding: 8px 16px; border-radius: 10px; font-family: inherit; font-size: 12.5px; white-space: nowrap;
  transition: background .15s, color .15s;
}
.day-nav-bar button.active { background: var(--accent); color: #fff; font-weight: 700; }
.day-nav-bar button:hover:not(.active) { background: var(--card-2); }

.day-arrow {
  position: fixed; top: 50%; transform: translateY(-50%); z-index: 20;
  width: 46px; height: 46px; border-radius: 50%; border: 1px solid var(--border);
  background: var(--card); color: var(--text); font-size: 18px; cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  backdrop-filter: var(--glass-blur); -webkit-backdrop-filter: var(--glass-blur); box-shadow: var(--shadow);
}
.day-arrow:hover { background: var(--accent); color: #fff; }
.day-arrow-prev { right: 18px; }
.day-arrow-next { left: 18px; }
@media (max-width: 900px) {
  .day-arrow { width: 38px; height: 38px; font-size: 15px; }
  .day-arrow-prev { right: 8px; }
  .day-arrow-next { left: 8px; }
}

/* گرید مربعی نمای برنامه‌ی ورزشکار — تعداد ستون‌ها با جاوااسکریپت حساب می‌شه تا کل عرض پر بشه:
   حرکت بیشتر = مربع کوچیک‌تر، حرکت کمتر = مربع بزرگ‌تر. هر کارت بالا عکس (مربع) و پایین یه پنل رنگی جدا برای اطلاعات داره */
.ex-square-grid { display: grid; gap: 8px; align-items: start; }
.ex-square {
  display: flex; flex-direction: column; border-radius: 12px; overflow: hidden;
  background: var(--card); border: 1px solid var(--border); cursor: pointer; transition: transform .12s;
}
.ex-square:hover { transform: translateY(-2px); }
.ex-square-grouped { border: 2px solid var(--accent); }
.ex-square-imgbox { position: relative; aspect-ratio: 1 / 1; background: var(--card-2); flex-shrink: 0; }
.ex-square-imgbox img { width: 100%; height: 100%; object-fit: cover; display: block; }
.ex-square-imgpair { display: flex; width: 100%; height: 100%; gap: 1px; }
.ex-square-imgpair img { width: 50%; height: 100%; object-fit: cover; flex: 1; }
.ex-square-media-pair{display:grid;grid-template-columns:1fr 1fr;width:100%;height:100%;gap:2px;background:#050506}.ex-square-media-pair>img,.ex-square-motion>video,.ex-square-motion>img{width:100%;height:100%;display:block;object-fit:cover}.ex-square-motion{position:relative;min-width:0;overflow:hidden}.exercise-expand-btn{position:absolute;inset-inline-start:6px;bottom:6px;z-index:3;border:1px solid rgba(255,255,255,.8);border-radius:8px;background:rgba(5,5,7,.86);color:#fff;padding:5px 7px;font:700 9.5px inherit;cursor:pointer;backdrop-filter:blur(8px)}.exercise-expand-btn:hover{background:var(--accent)}
.ex-square-noimg {
  width: 100%; height: 100%; display: flex; align-items: center; justify-content: center;
  color: var(--muted); font-size: 11px; text-align: center; padding: 6px;
}
.ex-square-imgbox .ex-code {
  position: absolute; top: 6px; inset-inline-start: 6px; background: var(--accent); color: #fff; z-index: 2;
  padding: 1px 7px; border-radius: 999px; font-size: 10.5px;
}
/* پنل پایین - رنگ ساده و توپر (نه روی عکس)، جای ست‌شماری/استراحت/یادداشت */
.ex-square-info {
  padding: 8px 10px; background: var(--card-2);
  display: flex; flex-direction: column; gap: 4px; overflow: hidden; justify-content: center;
}
.ex-square-info b { color: var(--text); font-size: 13px; line-height: 1.35; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.ex-square-info span { color: var(--text); font-size: 11.5px; line-height: 1.4; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.ex-square-info span.muted { color: var(--muted); font-size: 11px; }
.ex-square-note { color: var(--accent) !important; font-size: 11px !important; }
.exercise-video-backdrop{z-index:10050;align-items:center;justify-content:center;padding:24px}.exercise-video-dialog{position:relative;width:min(920px,90vw);height:min(82vh,760px);display:flex;align-items:center;justify-content:center;border:1px solid rgba(239,51,59,.45);border-radius:18px;background:#050506;box-shadow:0 24px 90px rgba(0,0,0,.8);overflow:hidden}.exercise-video-dialog video,.exercise-video-dialog>img{width:100%;height:100%;object-fit:contain;background:#050506}.exercise-video-close{position:absolute;top:12px;inset-inline-start:12px;z-index:2;border:1px solid rgba(255,255,255,.35);border-radius:10px;background:rgba(10,10,12,.88);color:#fff;padding:8px 12px;font:700 12px inherit;cursor:pointer}
.exercise-detail-prescription{display:flex;flex-wrap:wrap;gap:8px 14px;padding:12px 14px;margin-bottom:14px;border:1px solid rgba(239,51,59,.28);border-radius:12px;background:rgba(239,51,59,.07)}
.exercise-detail-prescription b{width:100%;color:#fff}.exercise-detail-prescription span{color:var(--muted);font-size:12px}
.coach-support-shell{margin:14px 0 18px}.coach-voice-card,.monitoring-summary{display:flex;align-items:center;gap:14px;justify-content:space-between;padding:14px 16px;margin-bottom:10px;border:1px solid rgba(239,51,59,.3);border-radius:14px;background:linear-gradient(135deg,rgba(239,51,59,.12),rgba(15,16,19,.94))}.coach-voice-card>div,.monitoring-summary>div{display:flex;flex-direction:column;gap:4px}.coach-voice-card small,.monitoring-summary small{color:var(--accent);font-weight:800}.coach-voice-card audio{width:min(390px,48%);height:38px}.unheard-dot{color:#fff;background:var(--accent);border-radius:999px;padding:4px 9px;font-size:10px}.monitoring-history{border:1px solid var(--border);border-radius:12px;padding:10px 14px}.monitoring-history>div{display:flex;gap:10px;flex-wrap:wrap;padding:10px 0;border-top:1px solid var(--border)}.monitoring-history p{width:100%;margin:0;color:var(--muted)}.monitoring-form label{font-size:12px}.monitoring-check{display:flex;align-items:center;gap:8px}.monitoring-check input{width:auto}@media(max-width:680px){.coach-voice-card,.monitoring-summary{align-items:stretch;flex-direction:column}.coach-voice-card audio{width:100%}}
.voice-recorder{display:flex;flex-direction:column;gap:9px;padding:12px;border:1px solid rgba(239,51,59,.3);border-radius:12px;background:rgba(0,0,0,.24)}.voice-recorder-label{font-weight:800}.voice-recorder-actions{display:flex;gap:8px;flex-wrap:wrap}.voice-record-btn.is-recording{background:#d7202a;animation:recordPulse 1.15s infinite}.voice-record-preview{width:100%;height:40px}.voice-file-fallback summary{cursor:pointer;color:var(--muted);font-size:12px}.voice-file-fallback input{margin-top:8px}@keyframes recordPulse{50%{box-shadow:0 0 0 7px rgba(239,51,59,.16)}}
.period-package-tools{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.package-support-tab{border:1px solid #36c96f;border-radius:9px;background:rgba(38,185,94,.13);color:#ecfff3;padding:7px 13px;font:800 12px inherit;cursor:pointer}.package-support-tab:hover{background:rgba(38,185,94,.28)}.package-voice-panel{max-width:520px}.package-voice-panel audio{width:100%}.package-report-row{display:flex;gap:9px;flex-wrap:wrap;padding:9px 0;border-top:1px solid var(--border)}.package-report-row p{width:100%;margin:0}@media(max-width:680px){.period-box-head{align-items:flex-start}.period-package-tools{width:100%;margin-top:8px}}
@media(max-width:680px){.exercise-video-backdrop{padding:10px}.exercise-video-dialog{width:96vw;height:min(76vh,620px);border-radius:14px}.exercise-expand-btn{padding:5px;font-size:0}.exercise-expand-btn::first-letter{font-size:14px}.ex-square-media-pair{gap:1px}}

/* ---------- تب مطالب آموزشی ---------- */
.art-hero { padding: 6px 0 4px; }
.art-search {
  display: flex; max-width: 480px; padding: 5px; border-radius: 14px;
  background: var(--card); border: 1px solid var(--border);
  backdrop-filter: var(--glass-blur); -webkit-backdrop-filter: var(--glass-blur);
}
.art-search input { border: none; background: transparent; padding: 10px 12px; }
.art-search input:focus { outline: none; }

.art-cat-bar {
  display: flex; gap: 6px; overflow-x: auto; margin: 18px 0 4px;
  background: var(--card); border: 1px solid var(--border); border-radius: 16px;
  padding: 6px; width: fit-content; max-width: 100%;
  backdrop-filter: var(--glass-blur); -webkit-backdrop-filter: var(--glass-blur);
}
.art-cat-bar button {
  background: transparent; border: none; color: var(--muted); cursor: pointer;
  padding: 9px 16px; border-radius: 11px; font-family: inherit; font-size: 12.5px; white-space: nowrap;
  transition: background .15s, color .15s;
}
.art-cat-bar button.active { background: var(--accent); color: #fff; font-weight: 700; }
.art-cat-bar button:hover:not(.active) { background: var(--card-2); }

.art-featured { margin-top: 4px; }
.art-featured:hover { transform: translateY(-3px); }
@media (max-width: 720px) {
  .art-featured.card { flex-direction: column !important; }
  .art-featured img { width: 100% !important; height: 180px; }
}

.art-pagination { display: flex; gap: 6px; justify-content: center; flex-wrap: wrap; }
.art-pagination button {
  width: 38px; height: 38px; border-radius: 10px; border: 1px solid var(--border);
  background: var(--card); color: var(--text); cursor: pointer; font-family: inherit; font-size: 13px;
}
.art-pagination button.active { background: var(--accent); color: #fff; border-color: var(--accent); font-weight: 700; }

/* ==========================================================================
   Product Design System v60 — Saeed Norouzy
   ========================================================================== */
:root {
  --sn-black: #070809;
  --sn-surface-1: #0d0f12;
  --sn-surface-2: #13161a;
  --sn-surface-3: #191d22;
  --sn-line: rgba(255,255,255,.1);
  --sn-line-strong: rgba(255,255,255,.17);
  --sn-red: #f02b35;
  --sn-white: #f7f5f2;
  --sn-muted: #9ca3ad;
  --sn-radius-md: 20px;
  --sn-radius-lg: 30px;
  --sn-shadow-card: 0 18px 55px rgba(0,0,0,.28);
  --sn-ease: cubic-bezier(.22,1,.36,1);
  --accent: var(--sn-red);
  --accent-2: #ff5962;
}

html { scroll-behavior: smooth; text-rendering: optimizeLegibility; }
body, h1, h2, h3, h4, p, span, a, button, label {
  word-break: normal;
  overflow-wrap: normal;
}
h1, h2, h3 { text-wrap: balance; }
p { text-wrap: pretty; }

.redesign-v60 {
  background:
    radial-gradient(circle at 8% 2%, rgba(240,43,53,.08), transparent 24rem),
    linear-gradient(180deg, #08090b, #0a0c0f 45%, #070809);
}
.redesign-v60 .container {
  width: min(100% - 40px, 1240px);
  max-width: 1240px;
  padding: 0 0 120px;
}

/* Public navigation */
.redesign-v60 .navbar.overlay {
  position: absolute;
  inset: 24px 0 auto;
  width: min(100% - 48px, 1320px);
  margin-inline: auto;
  padding: 10px 12px;
  border: 1px solid rgba(255,255,255,.1);
  border-radius: 18px;
  background: rgba(7,8,9,.58);
  backdrop-filter: blur(22px) saturate(135%);
  -webkit-backdrop-filter: blur(22px) saturate(135%);
  box-shadow: 0 16px 50px rgba(0,0,0,.22);
}
.redesign-v60 .navbar.overlay .brand,
.redesign-v60 .navbar.overlay a.nav-link,
.redesign-v60 .navbar.overlay span.nav-link {
  background: transparent;
  border: 0;
  box-shadow: none;
  backdrop-filter: none;
}
.redesign-v60 .navbar.overlay .brand {
  color: var(--sn-white);
  padding: 2px 4px;
  text-decoration: none;
}
.redesign-v60 .brand-logo { width: 68px; height: 40px; border-radius: 0; }
.redesign-v60 .brand-title { font-size: 14px; letter-spacing: -.2px; }
.redesign-v60 .brand-sub {
  color: rgba(255,255,255,.5);
  font-size: 8px;
  letter-spacing: 1.6px;
}
.public-nav {
  display: flex;
  align-items: center;
  gap: 26px;
  margin-inline: auto;
}
.public-nav a {
  color: rgba(255,255,255,.66);
  text-decoration: none;
  font-size: 12px;
  font-weight: 600;
  transition: color .2s ease;
}
.public-nav a:hover { color: #fff; }
.redesign-v60 .navbar.overlay a.nav-link {
  padding: 8px 12px;
  color: rgba(255,255,255,.72);
}
.redesign-v60 .navbar.overlay #navAuthLinks { display: flex; }

/* Editorial hero: copy and portrait never share the same region */
.redesign-v60 .hero {
  min-height: 100svh;
  overflow: hidden;
  isolation: isolate;
  display: grid;
  grid-template-columns: minmax(480px,.88fr) minmax(560px,1.12fr);
  align-items: stretch;
  direction: ltr;
  background: var(--sn-black) !important;
}
.hero-ambient {
  position: absolute;
  inset: 0;
  z-index: -1;
  background:
    radial-gradient(circle at 68% 68%, rgba(240,43,53,.13), transparent 28%),
    linear-gradient(90deg, rgba(255,255,255,.018) 1px, transparent 1px),
    linear-gradient(rgba(255,255,255,.018) 1px, transparent 1px);
  background-size: auto, 128px 128px, 128px 128px;
  mask-image: linear-gradient(to bottom, #000, transparent 94%);
}
.hero-media {
  position: absolute;
  inset: 0;
  width: 100%;
  min-height: 100svh;
  overflow: hidden;
  z-index: 0;
}
.hero-photo {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(90deg, rgba(7,8,9,.08), rgba(7,8,9,0) 45%, rgba(7,8,9,.94) 100%),
    linear-gradient(0deg, rgba(7,8,9,.85), transparent 30%),
    var(--media-image, url('/images/saeed/hero-designed-v61.jpg')) var(--media-x, 50%) var(--media-y, 50%) / cover no-repeat;
  filter: grayscale(var(--hero-grayscale, 1)) contrast(1.08);
  transform: scale(1.012);
}
.hero-photo::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, transparent 55%, rgba(240,43,53,.12));
  mix-blend-mode: screen;
}
.hero-photo-frame {
  position: absolute;
  inset: 108px 28px 38px 36px;
  border: 1px solid rgba(255,255,255,.14);
  border-radius: 2px 40px 2px 2px;
  pointer-events: none;
}
.hero-media-index {
  position: absolute;
  left: 54px;
  bottom: 55px;
  color: rgba(255,255,255,.5);
  font: 600 9px/1.2 Arial, sans-serif;
  letter-spacing: 2.5px;
}
.redesign-v60 .hero-inner {
  grid-column: 2;
  direction: rtl;
  align-self: center;
  width: min(100%,760px);
  max-width: none;
  padding: 148px clamp(50px,7vw,118px) 80px 44px;
  text-align: right;
  z-index: 2;
}
.redesign-v60 .hero-eyebrow,
.section-kicker {
  display: flex;
  align-items: center;
  gap: 12px;
  direction: ltr;
  justify-content: flex-end;
  color: rgba(255,255,255,.68);
  font: 700 10px/1.3 Arial, sans-serif;
  letter-spacing: 3px;
  text-shadow: none;
}
.redesign-v60 .hero-eyebrow > span:first-child,
.section-kicker > span {
  width: 48px;
  height: 2px;
  background: var(--sn-red);
}
.redesign-v60 .hero-eyebrow > span:last-child{width:auto;height:auto;background:none;white-space:nowrap}
.redesign-v60 .hero h1 {
  max-width: 760px;
  margin: 28px 0 22px;
  color: var(--sn-white);
  font-size: clamp(52px,5.4vw,88px);
  font-weight: 900;
  line-height: 1.12;
  letter-spacing: -3.2px;
  text-shadow: none;
}
.redesign-v60 .hero-highlight {
  display: inline-block;
  color: var(--sn-red);
  font-size: 1em;
}
.redesign-v60 .hero p {
  max-width: 660px;
  margin: 0 0 34px;
  color: rgba(255,255,255,.68);
  font-size: clamp(14px,1.18vw,17px);
  line-height: 2.05;
  text-shadow: none;
}
.redesign-v60 .hero-ctas { gap: 12px; }
.redesign-v60 .hero-btn {
  min-height: 54px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 18px;
  padding: 13px 24px;
  border-radius: 4px;
  font-size: 13px;
  box-shadow: 0 18px 46px rgba(240,43,53,.24);
}
.redesign-v60 .hero-btn.secondary-cta {
  background: transparent;
  border-color: rgba(255,255,255,.2);
  backdrop-filter: none;
}
.hero-proof {
  display: grid;
  grid-template-columns: repeat(3,minmax(0,1fr));
  max-width: 660px;
  margin-top: 52px;
  padding-top: 22px;
  border-top: 1px solid rgba(255,255,255,.1);
}
.hero-proof > div {
  display: flex;
  flex-direction: column;
  gap: 5px;
  padding-inline: 18px;
  border-inline-start: 1px solid rgba(255,255,255,.08);
}
.hero-proof > div:first-child { padding-inline-start: 0; border: 0; }
.hero-proof strong {
  color: #fff;
  font: 800 23px/1 Arial,sans-serif;
  letter-spacing: -.6px;
}
.hero-proof span {
  color: rgba(255,255,255,.45);
  font-size: 10px;
  line-height: 1.5;
}
.hero-scroll-hint {
  position: absolute;
  right: 32px;
  bottom: 30px;
  display: flex;
  align-items: center;
  gap: 10px;
  color: rgba(255,255,255,.35);
  font-size: 9px;
  letter-spacing: 1px;
  writing-mode: vertical-rl;
}
.hero-scroll-hint span {
  width: 1px;
  height: 34px;
  background: linear-gradient(var(--sn-red), transparent);
}

/* Public section navigation */
.redesign-v60 .page-tabs {
  position: sticky;
  top: 18px;
  bottom: auto;
  left: auto;
  transform: none;
  z-index: 45;
  width: min(100%,760px);
  margin: 28px auto 80px;
  justify-content: stretch;
  flex-wrap: nowrap;
  padding: 5px;
  border-radius: 16px;
  background: rgba(13,15,18,.82);
  border-color: rgba(255,255,255,.1);
  box-shadow: 0 18px 50px rgba(0,0,0,.32);
}
.redesign-v60 .page-tabs button {
  flex: 1 1 auto;
  white-space: nowrap;
  padding: 11px 14px;
  border-radius: 11px;
  font-size: 11px;
}
.redesign-v60 .page-tabs button.active {
  background: #fff;
  color: #0a0b0d;
}
.redesign-v60 .page-panel {
  min-height: 70svh;
  scroll-margin-top: 100px;
}

/* Method / about */
.method-intro {
  max-width: 970px;
  margin: 0 auto 90px;
  text-align: center;
}
.method-intro .section-kicker { justify-content: center; }
.method-intro h2 {
  max-width: 900px;
  margin: 24px auto;
  font-size: clamp(40px,6.3vw,84px);
  line-height: 1.25;
  letter-spacing: -3px;
}
.method-intro p {
  max-width: 780px;
  margin: 0 auto;
  color: var(--sn-muted);
  font-size: clamp(15px,1.7vw,20px);
  line-height: 2.15;
}
.redesign-v60 .about-box {
  display: grid;
  grid-template-columns: minmax(360px,.88fr) minmax(400px,1.12fr);
  gap: clamp(38px,7vw,100px);
  align-items: center;
  padding: clamp(28px,4vw,58px);
  border: 1px solid var(--sn-line);
  border-radius: var(--sn-radius-lg);
  background:
    radial-gradient(circle at 85% 15%, rgba(240,43,53,.08), transparent 35%),
    var(--sn-surface-1);
  box-shadow: var(--sn-shadow-card);
}
.redesign-v60 .about-photo {
  position: relative;
  width: 100%;
  max-width: none;
  min-height: 590px;
  border-radius: 2px 34px 2px 2px;
  overflow: hidden;
}
.redesign-v60 .about-photo::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(0deg, rgba(7,8,9,.8), transparent 38%);
}
.redesign-v60 .about-photo img {
  width: 100%;
  height: 100%;
  min-height: 590px;
  object-fit: cover;
  object-position: 50% 20%;
  filter: grayscale(1) contrast(1.08);
}
.about-photo-caption {
  position: absolute;
  z-index: 2;
  left: 24px;
  bottom: 22px;
  color: rgba(255,255,255,.65);
  font: 600 9px/1.7 Arial,sans-serif;
  letter-spacing: 2px;
  direction: ltr;
}
.redesign-v60 .about-text { position: relative; }
.section-number {
  display: block;
  color: var(--sn-red);
  font: 800 13px/1 Arial,sans-serif;
  letter-spacing: 2px;
  margin-bottom: 22px;
}
.redesign-v60 .about-text h2 {
  margin: 0 0 24px;
  font-size: clamp(34px,4.1vw,58px);
  line-height: 1.35;
  letter-spacing: -2px;
}
.redesign-v60 .about-text > p {
  margin: 0;
  color: var(--sn-muted);
  font-size: 15px;
  line-height: 2.2;
}
.method-points {
  display: grid;
  margin-top: 34px;
  border-top: 1px solid var(--sn-line);
}
.method-points > div {
  display: grid;
  grid-template-columns: 86px 1fr;
  gap: 14px;
  padding: 17px 0;
  border-bottom: 1px solid var(--sn-line);
}
.method-points b { color: var(--sn-white); font-size: 13px; }
.method-points span {
  color: var(--sn-muted);
  font-size: 12px;
  line-height: 1.8;
}

/* Career photography: original user-supplied images only */
.career-story { margin-top: 120px; }
.career-story-head {
  display: grid;
  grid-template-columns: 1.1fr .9fr;
  gap: 50px;
  align-items: end;
  margin-bottom: 36px;
}
.career-story-head .section-kicker { justify-content: flex-end; }
.career-story-head h2 {
  margin: 16px 0 0;
  font-size: clamp(38px,5vw,68px);
  letter-spacing: -2.5px;
}
.career-story-head > p {
  max-width: 460px;
  margin: 0;
  color: var(--sn-muted);
  font-size: 14px;
  line-height: 2;
}
.career-gallery {
  display: grid;
  grid-template-columns: repeat(4,minmax(0,1fr));
  grid-auto-rows: 220px;
  gap: 12px;
}
.career-card {
  position: relative;
  margin: 0;
  overflow: hidden;
  border-radius: 3px 20px 3px 3px;
  background: var(--sn-surface-2);
  border: 1px solid rgba(255,255,255,.08);
}
.career-card.tall { grid-row: span 2; }
.career-card.wide { grid-column: span 2; }
.career-card img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: var(--px, 50%) var(--py, 25%);
  scale: var(--pz, 1);
  transform-origin: var(--px, 50%) var(--py, 25%);
  filter: grayscale(1) saturate(.25) contrast(1.05);
  transition: transform .8s var(--sn-ease), scale .8s var(--sn-ease), filter .45s ease;
}
.career-card::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(0deg, rgba(7,8,9,.88), transparent 55%);
  pointer-events: none;
}
.career-card figcaption {
  position: absolute;
  z-index: 2;
  inset: auto 18px 16px;
  display: flex;
  flex-direction: column;
  gap: 3px;
}
.career-card figcaption b { color: #fff; font-size: 13px; }
.career-card figcaption span { color: rgba(255,255,255,.48); font-size: 9px; }
.career-card:hover img {
  scale: calc(var(--pz, 1) * 1.06);
  filter: grayscale(.2) saturate(.55) contrast(1.03);
}

/* Shared cards and article entry */
.redesign-v60 .card,
body.admin .card,
body:not(.public-home) .card {
  border-color: var(--sn-line);
  border-radius: var(--sn-radius-md);
  background: linear-gradient(145deg, rgba(255,255,255,.055), rgba(255,255,255,.025));
  box-shadow: var(--sn-shadow-card);
}
.redesign-v60 .art-hero {
  padding: clamp(30px,5vw,64px);
  border: 1px solid var(--sn-line);
  border-radius: var(--sn-radius-lg);
  background:
    radial-gradient(circle at 15% 20%, rgba(240,43,53,.14), transparent 34%),
    var(--sn-surface-1);
}

/* Mobile: selected content starts cleanly; hero copy never overlaps the body */
@media (max-width: 900px) {
  .public-nav { display: none; }
  .contact-stage { grid-template-columns:1fr; padding:26px 18px; min-height:auto; }
  .contact-channel-grid { grid-template-columns:1fr; }
  .contact-channel { min-height:128px; }
  .redesign-v60 .page-tabs {
    position: sticky;
    top: 76px;
    z-index: 20;
  }
  .redesign-v60 .page-panel {
    min-height: calc(100svh - 132px);
    scroll-margin-top: 132px;
    overflow: clip;
  }
  .redesign-v60 .hero {
    min-height: 100svh;
    display: grid;
    grid-template-columns: 1fr;
    grid-template-rows: minmax(390px,52svh) auto;
    align-items: stretch;
  }
  .hero-media {
    position: relative;
    inset: auto;
    width: auto;
    grid-column: 1;
    grid-row: 1;
    min-height: 390px;
  }
  .hero-photo {
    background:
      linear-gradient(0deg, #070809 0%, rgba(7,8,9,.74) 14%, transparent 48%),
      var(--media-image, url('/images/saeed/hero-designed-v61.jpg')) var(--media-x, 35%) var(--media-y, 50%) / cover no-repeat !important;
    transform: none;
  }
  .hero-photo-frame {
    inset: 92px 18px 18px;
    border-radius: 2px 22px 2px 2px;
  }
  .hero-media-index { display: none; }
  .redesign-v60 .hero-inner {
    grid-column: 1;
    grid-row: 2;
    width: 100%;
    max-width: 700px;
    margin-inline: auto;
    align-self: start;
    padding: 18px 24px 38px;
    text-align: right;
    background: #070809;
  }
  .redesign-v60 .hero h1 {
    margin: 16px 0 14px;
    font-size: clamp(38px,9vw,58px);
    line-height: 1.18;
    letter-spacing: -2px;
  }
  .redesign-v60 .hero p {
    font-size: 13px;
    line-height: 1.95;
    margin-bottom: 22px;
  }
  .hero-proof { margin-top: 30px; }
  .hero-scroll-hint { display: none; }
  .redesign-v60 .about-box { grid-template-columns: 1fr; }
  .redesign-v60 .about-photo,
  .redesign-v60 .about-photo img { min-height: 480px; }
  .career-story-head {
    grid-template-columns: 1fr;
    gap: 18px;
  }
  .career-gallery {
    grid-template-columns: repeat(2,minmax(0,1fr));
    grid-auto-rows: 230px;
  }
}

/* V108 — public mobile application coming-soon page */
.app-coming-stage{
  position:relative;
  min-height:calc(100svh - 150px);
  display:grid;
  grid-template-columns:minmax(0,1.05fr) minmax(320px,.95fr);
  align-items:center;
  gap:clamp(28px,6vw,92px);
  overflow:hidden;
  padding:clamp(28px,5vw,68px);
  border:1px solid rgba(255,255,255,.07);
  background:
    radial-gradient(circle at 82% 46%,rgba(240,43,53,.13),transparent 34%),
    linear-gradient(135deg,rgba(255,255,255,.035),rgba(255,255,255,.008));
  box-shadow:inset 0 1px rgba(255,255,255,.04);
}
.app-coming-stage::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  opacity:.18;
  background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);
  background-size:54px 54px;
  mask-image:linear-gradient(90deg,transparent,#000);
}
.app-coming-copy,.app-device-visual{position:relative;z-index:1}
.app-coming-status{
  display:flex;
  align-items:center;
  gap:8px;
  width:max-content;
  margin:18px 0 12px;
  color:rgba(255,255,255,.58);
  font-size:11px;
}
.app-coming-status i{
  width:7px;height:7px;border-radius:50%;
  background:var(--accent);
  box-shadow:0 0 0 5px rgba(240,43,53,.1),0 0 18px var(--accent);
  animation:appPulse 1.8s ease-in-out infinite;
}
.app-coming-copy h2{
  margin:0;
  color:#fff;
  font-size:clamp(38px,5vw,72px);
  line-height:1.08;
  letter-spacing:-.045em;
}
.app-coming-copy h2 em{color:var(--accent);font-style:normal}
.app-coming-copy>p:not(.app-coming-status){
  max-width:620px;
  margin:22px 0 28px;
  color:rgba(255,255,255,.64);
  font-size:clamp(13px,1.25vw,16px);
  line-height:2;
}
.app-platform-tabs{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,180px));
  gap:9px;
  direction:ltr;
}
.app-platform-tabs button{
  display:flex;
  align-items:center;
  gap:12px;
  min-height:66px;
  padding:10px 14px;
  border:1px solid rgba(255,255,255,.1);
  border-radius:3px;
  color:rgba(255,255,255,.54);
  background:rgba(0,0,0,.22);
  text-align:left;
  cursor:pointer;
  transition:.22s ease;
}
.app-platform-tabs button:hover,
.app-platform-tabs button.active{
  color:#fff;
  border-color:rgba(240,43,53,.62);
  background:rgba(240,43,53,.08);
  box-shadow:inset 3px 0 var(--accent),0 0 25px rgba(240,43,53,.08);
}
.app-platform-tabs svg{
  width:25px;height:25px;fill:none;stroke:currentColor;stroke-width:1.45;stroke-linecap:round;stroke-linejoin:round
}
.app-platform-tabs span{display:grid;gap:2px}
.app-platform-tabs small{font-size:8px;color:rgba(255,255,255,.38);letter-spacing:.05em}
.app-platform-tabs b{font-size:15px;font-family:Arial,sans-serif;letter-spacing:.01em}
.app-coming-label{
  display:flex;
  align-items:center;
  gap:12px;
  margin-top:16px;
  direction:ltr;
}
.app-coming-label span{color:rgba(255,255,255,.32);font:9px/1 Arial,sans-serif;letter-spacing:.18em}
.app-coming-label strong{
  padding:6px 12px;
  border:1px solid rgba(240,43,53,.38);
  color:#fff;
  background:rgba(240,43,53,.1);
  font-size:10px;
}
.app-feature-line{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:8px;
  margin-top:30px;
  color:rgba(255,255,255,.44);
  font-size:10px;
}
.app-feature-line i{width:3px;height:3px;border-radius:50%;background:var(--accent)}
.app-device-visual{
  min-height:520px;
  display:grid;
  place-items:center;
  perspective:1200px;
}
.app-phone{
  position:relative;
  width:min(270px,70%);
  aspect-ratio:.51;
  padding:8px;
  border:1px solid rgba(255,255,255,.28);
  border-radius:38px;
  background:linear-gradient(145deg,#25272b,#08090b 42%,#181a1e);
  box-shadow:0 44px 90px rgba(0,0,0,.55),0 0 80px rgba(240,43,53,.14),inset 0 0 0 2px rgba(255,255,255,.04);
  transform:rotateY(-10deg) rotateX(3deg) rotateZ(2deg);
}
.app-phone::after{
  content:"";
  position:absolute;
  inset:12% -30%;
  z-index:-1;
  background:radial-gradient(circle,rgba(240,43,53,.28),transparent 62%);
  filter:blur(22px);
}
.app-phone-top{
  position:absolute;
  z-index:3;
  top:13px;
  left:50%;
  width:82px;
  height:22px;
  border-radius:20px;
  background:#050506;
  transform:translateX(-50%);
}
.app-phone-top span{display:block;width:6px;height:6px;margin:8px 0 0 58px;border-radius:50%;background:#141b24}
.app-phone-screen{
  height:100%;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  border-radius:31px;
  background:
    linear-gradient(rgba(4,5,6,.48),rgba(4,5,6,.92)),
    radial-gradient(circle at 50% 32%,rgba(240,43,53,.35),transparent 42%),
    #090a0c;
}
.app-phone-screen img{width:52px;height:52px;filter:drop-shadow(0 0 18px rgba(240,43,53,.4))}
.app-phone-screen small{margin-top:14px;color:rgba(255,255,255,.42);font:7px/1 Arial,sans-serif;letter-spacing:.24em}
.app-phone-screen h3{margin:12px 0 22px;color:#fff;text-align:center;font:700 24px/1.08 Arial,sans-serif;letter-spacing:-.04em}
.app-screen-grid{display:grid;grid-template-columns:repeat(3,34px);gap:6px}
.app-screen-grid i{height:44px;border:1px solid rgba(255,255,255,.08);background:linear-gradient(180deg,rgba(240,43,53,.17),rgba(255,255,255,.025))}
.app-phone-screen>b{margin-top:28px;padding:8px 13px;border:1px solid rgba(240,43,53,.52);color:#fff;font:7px/1 Arial,sans-serif;letter-spacing:.2em;background:rgba(240,43,53,.09)}
.app-orbit{
  position:absolute;
  border:1px solid rgba(240,43,53,.18);
  border-radius:50%;
  transform:rotateX(68deg) rotateZ(-9deg);
}
.orbit-one{width:490px;height:490px}
.orbit-two{width:390px;height:390px;border-color:rgba(255,255,255,.08)}
.app-visual-code{position:absolute;right:2%;bottom:8%;color:rgba(255,255,255,.2);font:9px/1 Arial,sans-serif;letter-spacing:.22em}
@keyframes appPulse{50%{opacity:.38;box-shadow:0 0 0 9px rgba(240,43,53,0),0 0 8px var(--accent)}}
@media(max-width:900px){
  .app-coming-stage{grid-template-columns:1fr minmax(250px,.65fr);gap:18px;padding:28px}
  .app-device-visual{min-height:430px}
  .app-phone{width:210px}
}
@media(max-width:720px){
  #page-app{min-height:calc(100svh - 130px)!important}
  .app-coming-stage{
    min-height:calc(100svh - 130px);
    grid-template-columns:1fr;
    align-content:center;
    gap:22px;
    padding:26px 16px 22px;
  }
  .app-coming-copy{text-align:right}
  .app-coming-status{margin-top:12px}
  .app-coming-copy h2{font-size:clamp(34px,11vw,50px)}
  .app-coming-copy>p:not(.app-coming-status){margin:15px 0 20px;font-size:11px;line-height:1.9}
  .app-platform-tabs{grid-template-columns:repeat(2,1fr);gap:7px}
  .app-platform-tabs button{min-height:58px;padding:8px 10px;gap:8px}
  .app-platform-tabs svg{width:21px;height:21px}
  .app-platform-tabs b{font-size:13px}
  .app-feature-line{margin-top:20px;font-size:8px;gap:6px}
  .app-device-visual{min-height:260px}
  .app-phone{width:128px;border-radius:22px;padding:5px;transform:rotateY(-9deg) rotateX(2deg) rotateZ(2deg)}
  .app-phone-top{top:8px;width:48px;height:12px}
  .app-phone-top span{width:3px;height:3px;margin:4px 0 0 34px}
  .app-phone-screen{border-radius:17px}
  .app-phone-screen img{width:30px;height:30px}
  .app-phone-screen small{margin-top:8px;font-size:4px}
  .app-phone-screen h3{margin:7px 0 12px;font-size:13px}
  .app-screen-grid{grid-template-columns:repeat(3,19px);gap:3px}
  .app-screen-grid i{height:25px}
  .app-phone-screen>b{margin-top:14px;padding:5px 7px;font-size:4px}
  .app-orbit{display:none}
  .app-visual-code{display:none}
}
@media(prefers-reduced-motion:reduce){
  .app-coming-status i{animation:none}
}

/* v99 — hero media is revealed only after the current admin-selected image has loaded.
   This prevents a retired bundled image from flashing during navigation or refresh. */
.redesign-v60 .hero-photo[data-media-slot="hero"]{
  opacity:0;
  transition:opacity .22s ease;
}
.redesign-v60 .hero-photo[data-media-slot="hero"].media-ready{
  opacity:1;
}
@media(prefers-reduced-motion:reduce){
  .redesign-v60 .hero-photo[data-media-slot="hero"]{transition:none}
}

/* V71 — true journey editor and one-screen knowledge architecture */
.journey-media-stage{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  grid-auto-rows:220px;
  gap:12px;
  margin-top:16px;
}
.journey-editor-card{
  position:relative;
  display:block;
  min-width:0;
  padding:0;
  overflow:hidden;
  border-radius:3px 20px 3px 3px;
  background:#0d0f12;
}
.journey-editor-card.tall{grid-row:span 2}
.journey-editor-card.wide{grid-column:span 2}
.journey-editor-card>.media-preview-pair{position:absolute;inset:0;display:block}
.journey-editor-card>.media-preview-pair>div:first-child,
.journey-editor-card>.media-preview-pair .media-editor-preview{width:100%;height:100%}
.journey-editor-card>.media-preview-pair small,
.journey-editor-card .journey-mobile-preview{display:none}
.journey-editor-card>.media-preview-pair img{filter:grayscale(1) saturate(.25) contrast(1.05)}
.journey-editor-card::after{
  content:"";position:absolute;z-index:1;inset:0;pointer-events:none;
  background:linear-gradient(0deg,rgba(7,8,9,.9),transparent 58%);
}
.journey-editor-caption{
  position:absolute;z-index:2;inset:auto 16px 14px;display:flex;flex-direction:column;gap:3px;pointer-events:none
}
.journey-editor-caption b{color:#fff;font-size:13px}.journey-editor-caption span{color:#858991;font-size:9px}
.journey-editor-controls{position:absolute;z-index:4;inset:10px 10px auto auto}
.journey-editor-controls>summary{
  cursor:pointer;list-style:none;padding:8px 11px;border:1px solid rgba(255,255,255,.15);
  border-radius:9px;color:#fff;background:rgba(7,9,11,.84);backdrop-filter:blur(12px);font-size:10px
}
.journey-editor-controls>summary::-webkit-details-marker{display:none}
.journey-editor-controls[open]{inset:8px}
.journey-editor-controls[open]>summary{position:absolute;z-index:2;top:8px;left:8px}
.journey-editor-control-panel{
  position:absolute;inset:0;padding:46px 14px 14px;overflow:auto;border:1px solid rgba(240,43,53,.28);
  border-radius:14px;background:rgba(10,12,15,.97);box-shadow:0 24px 70px rgba(0,0,0,.55)
}
.journey-editor-control-panel label{margin-top:8px}

/* V72 — clean article cards, full category selector and internal article scrolling */
.art-category-filter{
  display:grid;
  gap:9px;
  margin:0;
  color:#f1f2f4;
  font-size:12px;
  font-weight:800;
}
.art-filter-title{
  display:flex;
  align-items:center;
  gap:8px;
}
.art-filter-title::before{
  content:"";
  width:22px;
  height:2px;
  border-radius:2px;
  background:var(--accent);
  box-shadow:0 0 14px rgba(240,43,53,.65);
}
.art-select-shell{
  position:relative;
  display:block;
}
.art-category-filter select{
  appearance:none;
  -webkit-appearance:none;
  width:100%;
  min-height:50px;
  padding:0 16px 0 44px;
  border:1px solid rgba(240,43,53,.3);
  border-radius:13px;
  background:linear-gradient(135deg,rgba(240,43,53,.11),rgba(255,255,255,.025)),#090b0e;
  color:#fff;
  font-family:inherit;
  font-size:12px;
  font-weight:800;
  cursor:pointer;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04),0 10px 30px rgba(0,0,0,.18);
}
.art-select-shell svg{
  position:absolute;
  left:15px;
  top:50%;
  width:18px;
  height:18px;
  transform:translateY(-50%);
  fill:none;
  stroke:#fff;
  stroke-width:2;
  pointer-events:none;
}
.knowledge-list-card{
  display:grid!important;
  grid-template-columns:1fr;
  grid-template-rows:125px minmax(0,1fr);
  gap:0!important;
  padding:0!important;
}
.knowledge-list-media{
  min-width:0;
  min-height:0;
  overflow:hidden;
  background:#080a0d;
  border-bottom:1px solid rgba(255,255,255,.08);
}
.knowledge-list-cover{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center 28%;
  transition:transform .45s ease,filter .45s ease;
}
.knowledge-list-placeholder{
  display:grid;
  place-items:center;
  width:100%;
  height:100%;
  color:rgba(255,255,255,.1);
  font:900 34px Arial;
}
.knowledge-list-cover[hidden],
.knowledge-list-placeholder[hidden]{display:none}
.knowledge-list-copy{
  min-width:0;
  padding:12px 14px 14px;
  direction:rtl;
  align-self:stretch;
}
.knowledge-list-card:hover .knowledge-list-cover{
  transform:scale(1.035);
  filter:brightness(1.08);
}

/* V73 — operational order of the coach panel */
.app-sidebar>.brand{order:0}
.app-sidebar>.control-room-nav{order:0!important}
.app-sidebar>.sidebar-link[data-tab="plans"]{order:1}
.app-sidebar>.sidebar-link[data-tab="categories"]{order:2}
.app-sidebar>.sidebar-link[data-tab="discounts"]{order:3}
.app-sidebar>.sidebar-link[data-tab="booking"]{order:4}
.app-sidebar>.sidebar-link[data-tab="finance"]{order:5}
.app-sidebar>.sidebar-link[data-tab="customers"]{order:6}
.app-sidebar>.sidebar-link[data-tab="templates"]{order:7}
.app-sidebar>.sidebar-link[data-tab="exercises"]{order:8}
.app-sidebar>.sidebar-link[href="/admin/nutrition-foods.html"]{order:9!important}
.app-sidebar>.sidebar-link[data-tab="articles"]{order:10}
.app-sidebar>.sidebar-link[data-tab="about"]{order:11}
.app-sidebar>.sidebar-link[data-tab="personal-gallery"]{order:12}
.app-sidebar>.sidebar-link[data-tab="gallery"]{order:13}
.app-sidebar>.sidebar-link[data-tab="transformations"]{order:14}
.app-sidebar>.sidebar-link[data-tab="contact-settings"]{order:15}
.app-sidebar>.sidebar-link[data-tab="tickets"]{order:16}
.app-sidebar>.sidebar-link[data-tab="settings"]{order:17}
.app-sidebar>.sidebar-link[href$="#plans"]{order:1!important}
.app-sidebar>.sidebar-link[href$="#categories"]{order:2!important}
.app-sidebar>.sidebar-link[href$="#discounts"]{order:3!important}
.app-sidebar>.sidebar-link[href$="#booking"]{order:4!important}
.app-sidebar>.sidebar-link[href$="#finance"]{order:5!important}
.app-sidebar>.sidebar-link[href$="#customers"]{order:6!important}
.app-sidebar>.sidebar-link[href$="#templates"]{order:7!important}
.app-sidebar>.sidebar-link[href$="#exercises"]{order:8!important}
.app-sidebar>.sidebar-link[href$="#articles"]{order:10!important}
.app-sidebar>.sidebar-link[href$="#about"]{order:11!important}
.app-sidebar>.sidebar-link[href$="#personal-gallery"]{order:12!important}
.app-sidebar>.sidebar-link[href$="#gallery"]{order:13!important}
.app-sidebar>.sidebar-link[href$="#transformations"]{order:14!important}
.app-sidebar>.sidebar-link[href$="#contact-settings"]{order:15!important}
.app-sidebar>.sidebar-link[href$="#tickets"]{order:16!important}
.app-sidebar>.sidebar-link[href$="#settings"]{order:17!important}
.app-sidebar>.sidebar-spacer{order:100}
.app-sidebar>.sidebar-link:not([data-tab]){order:101}

@media(min-width:861px){
  #page-articles{height:calc(100vh - 150px);min-height:620px;overflow:hidden}
  #page-articles #articleListView,.knowledge-desktop-shell{height:100%}
  .knowledge-desktop-shell{
    display:grid;grid-template-columns:minmax(250px,.72fr) minmax(360px,1.12fr) minmax(360px,1.16fr);
    gap:12px;direction:rtl
  }
  .knowledge-hero{
    height:100%;display:flex;flex-direction:column;justify-content:flex-start;align-items:stretch;
    gap:16px;padding:28px 24px;border-radius:3px 24px 3px 3px
  }
  .knowledge-hero-copy{margin:0 0 auto}
  .knowledge-hero h2{font-size:clamp(34px,3.2vw,58px);line-height:1.22;margin:12px 0}
  .knowledge-hero-copy>p:not(.eyebrow){font-size:12px;line-height:1.9}
  .knowledge-principles{gap:5px}.knowledge-principles span{padding:5px 8px;font-size:9px}
  .knowledge-hero .art-search{display:block;max-width:none;padding:14px}
  .knowledge-hero .art-search input{min-height:42px;font-size:11px}.knowledge-hero .art-search small{font-size:8px}
  .knowledge-hero .art-cat-bar{width:100%;margin:0;display:grid;grid-template-columns:repeat(2,1fr);overflow:visible}
  .knowledge-hero .art-cat-bar button{padding:7px 5px;font-size:9px}

  .knowledge-feature{height:100%;min-width:0}
  .art-featured{
    position:relative;display:flex!important;flex-direction:column!important;justify-content:flex-end;
    height:100%;margin:0;padding:0!important;overflow:hidden;cursor:pointer;border-radius:3px 24px 3px 3px!important
  }
  .art-featured-cover,.art-featured-placeholder{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
  .art-featured-placeholder{display:grid;place-items:center;color:rgba(255,255,255,.08);font:900 8rem Arial;background:#111419}
  .art-featured::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,#0a0c0f 4%,rgba(10,12,15,.82) 38%,rgba(10,12,15,.08) 76%)}
  .art-featured-copy{position:relative;z-index:2;padding:30px}
  .art-featured-copy h3{margin:12px 0 8px;color:#fff;font-size:clamp(23px,2.2vw,38px);line-height:1.35}
  .art-featured-copy p{margin:0;color:#c3c6cc;font-size:11px;line-height:1.9}
  .art-read-more{display:inline-block;margin-top:14px;color:#fff;font-size:10px;border-bottom:1px solid var(--accent);padding-bottom:5px}

  .knowledge-feed{
    height:100%;min-width:0;padding:18px;border:1px solid rgba(255,255,255,.08);
    border-radius:3px 24px 3px 3px;background:rgba(255,255,255,.018);overflow:hidden
  }
  .knowledge-feed-heading{display:flex;justify-content:space-between;align-items:end;margin:0 0 10px}
  .knowledge-feed #artGrid{
    display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:270px;
    align-content:start;height:calc(100% - 42px);gap:9px;overflow-y:auto;overflow-x:hidden;
    padding-inline-end:5px;scrollbar-width:thin;scrollbar-color:rgba(240,43,53,.7) rgba(255,255,255,.04)
  }
  .knowledge-list-card{
    position:relative;min-width:0;min-height:0;padding:0!important;overflow:hidden;cursor:pointer;
    border-radius:3px 15px 3px 3px!important
  }
  .knowledge-list-card .badge{font-size:8px;padding:3px 7px}
  .knowledge-list-card h3{margin:8px 0 4px;font-size:13px;line-height:1.55}
  .knowledge-list-card .desc{font-size:9px;line-height:1.55;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
  .knowledge-list-card .muted{display:none}
  .knowledge-feed .art-pagination{display:none}
}

@media(max-width:860px){
  .journey-media-stage{grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:190px}
  .journey-editor-card.wide{grid-column:span 2}.journey-editor-card.tall{grid-row:span 2}
  .knowledge-desktop-shell{display:block}
  .knowledge-feature{margin:12px 0}
  .art-featured{overflow:hidden;cursor:pointer}
  .art-featured-cover{width:100%;height:190px;object-fit:cover}
  .art-featured-copy{padding:18px}.art-featured-copy p{color:var(--muted);line-height:1.8}
  .knowledge-feed-heading{display:flex;justify-content:space-between;align-items:end;margin:18px 0 12px}
  .knowledge-list-card{grid-template-columns:1fr;grid-template-rows:190px auto;min-height:340px}
  .knowledge-list-copy{padding:14px}
}

@media (max-width: 640px) {
  .redesign-v60 .navbar.overlay {
    inset: 12px 0 auto;
    width: calc(100% - 24px);
    padding: 7px 8px;
    border-radius: 14px;
  }
  .redesign-v60 .navbar.overlay .brand { padding: 0; }
  .redesign-v60 .brand-logo { width: 58px; height: 34px; }
  .redesign-v60 .brand-title { font-size: 11px; }
  .redesign-v60 .brand-sub { font-size: 6.5px; }
  .redesign-v60 .navbar.overlay a.nav-link {
    padding: 6px 7px;
    font-size: 10px;
  }
  .redesign-v60 .theme-toggle { width: 32px; height: 32px; }
  .redesign-v60 .hero {
    padding: 0;
    grid-template-rows: 48svh auto;
  }
  .hero-media { min-height: 340px; }
  .redesign-v60 .hero-inner {
    padding: 12px 18px max(34px,env(safe-area-inset-bottom));
  }
  .redesign-v60 .hero-eyebrow {
    justify-content: flex-end;
    font-size: 7px;
    letter-spacing: 2px;
  }
  .redesign-v60 .hero-eyebrow > span:first-child { width: 28px; }
  .redesign-v60 .hero h1 {
    font-size: clamp(34px,10.5vw,46px);
    letter-spacing: -1.6px;
  }
  .redesign-v60 .hero-ctas {
    display: grid;
    grid-template-columns: 1fr;
  }
  .redesign-v60 .hero-btn {
    width: 100%;
    min-height: 48px;
    font-size: 12px;
  }
  .hero-proof {
    grid-template-columns: repeat(3,1fr);
    margin-top: 25px;
    padding-top: 17px;
  }
  .hero-proof > div { padding-inline: 9px; }
  .hero-proof strong { font-size: 17px; }
  .hero-proof span { font-size: 8px; }
  .redesign-v60 .container {
    width: calc(100% - 24px);
    padding-bottom: 90px;
  }
  .redesign-v60 .page-tabs {
    top: 10px;
    width: calc(100vw - 16px);
    margin: 16px calc(50% - 50vw) 58px;
    margin-inline-start: calc(50% - 50vw + 8px);
    overflow-x: auto;
    justify-content: flex-start;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
  }
  .redesign-v60 .page-tabs::-webkit-scrollbar { display: none; }
  .redesign-v60 .page-tabs button {
    flex: 0 0 auto;
    scroll-snap-align: center;
    min-width: 104px;
  }
  .redesign-v60 .page-panel {
    min-height: calc(100svh - 92px);
    scroll-margin-top: 82px;
  }
  .method-intro { margin-bottom: 52px; }
  .method-intro h2 {
    margin: 18px auto;
    font-size: clamp(34px,11vw,52px);
    letter-spacing: -1.8px;
  }
  .method-intro p {
    font-size: 14px;
    line-height: 2;
  }
  .redesign-v60 .about-box {
    gap: 28px;
    padding: 12px 12px 30px;
    border-radius: 24px;
  }
  .redesign-v60 .about-photo,
  .redesign-v60 .about-photo img { min-height: 430px; }
  .redesign-v60 .about-text { padding-inline: 10px; }
  .redesign-v60 .about-text h2 {
    font-size: 34px;
    letter-spacing: -1.4px;
  }
  .method-points > div { grid-template-columns: 70px 1fr; }
  .career-story { margin-top: 78px; }
  .career-story-head h2 {
    font-size: 38px;
    letter-spacing: -1.7px;
  }
  .career-gallery {
    display: flex;
    gap: 10px;
    overflow-x: auto;
    margin-inline: calc(50% - 50vw);
    padding-inline: 12px;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
  }
  .career-gallery::-webkit-scrollbar { display: none; }
  .career-card,
  .career-card.tall,
  .career-card.wide {
    flex: 0 0 min(78vw,320px);
    height: 480px;
    grid-row: auto;
    grid-column: auto;
    scroll-snap-align: center;
  }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    scroll-behavior: auto !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}

/* V60 public secondary panels */
.redesign-v60 .panel-heading {
  max-width: 760px;
  margin: 70px 0 34px auto;
}
.redesign-v60 .panel-heading h2 {
  margin: 14px 0 10px;
  color: #fff;
  font-size: clamp(38px,5vw,68px);
  line-height: 1.25;
  letter-spacing: -2px;
}
.redesign-v60 .panel-heading p {
  margin: 0;
  color: var(--sn-muted);
  line-height: 2;
}
.redesign-v60 .standalone-gallery { margin-bottom: 70px; }
.record-grid {
  display: grid;
  grid-template-columns: repeat(3,minmax(0,1fr));
  gap: 14px;
  margin-bottom: 80px;
}
.record-card {
  position: relative;
  min-height: 280px;
  padding: 32px;
  overflow: hidden;
  border: 1px solid var(--sn-line);
  border-radius: 3px 22px 3px 3px;
  background:
    radial-gradient(circle at 90% 10%, rgba(240,43,53,.13), transparent 45%),
    linear-gradient(145deg, rgba(255,255,255,.055), rgba(255,255,255,.018));
}
.record-card::before {
  content: "";
  position: absolute;
  inset: 0 0 auto;
  width: 54px;
  height: 2px;
  background: var(--sn-red);
}
.record-card strong {
  display: block;
  margin-bottom: 58px;
  color: var(--sn-red);
  font: 900 clamp(34px,4.5vw,62px)/1 Arial,sans-serif;
  letter-spacing: -2px;
}
.record-card h3 { margin: 0 0 12px; color: #fff; font-size: 18px; }
.record-card p { margin: 0; color: var(--sn-muted); font-size: 13px; line-height: 2; }

@media (max-width: 760px) {
  .record-grid { grid-template-columns: 1fr; }
  .record-card { min-height: 220px; }
  .record-card strong { margin-bottom: 36px; }
  .redesign-v60 .panel-heading { margin-top: 44px; }
  .redesign-v60 .panel-heading h2 {
    font-size: 38px;
    letter-spacing: -1.4px;
  }
}

/* V60 focused workspaces and training builder */
.product-shell > .navbar,
.article-page > .navbar {
  position: sticky;
  top: 0;
  z-index: 55;
  min-height: 64px;
  padding: 10px clamp(14px,3vw,38px);
  color: #fff;
  background: rgba(9,10,12,.88);
  border-bottom: 1px solid rgba(255,255,255,.08);
  backdrop-filter: blur(22px) saturate(135%);
}
.product-shell > .navbar .brand,
.article-page > .navbar .brand { color: #fff; }
.product-shell > .container {
  width: min(100% - 28px,1180px);
  max-width: 1180px !important;
  padding: clamp(22px,3vw,42px) 0 70px !important;
}
.program-workspace .day-group-header {
  position: sticky;
  top: 72px;
  z-index: 12;
  width: fit-content;
  padding: 7px;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 12px;
  background: rgba(9,10,12,.84);
  backdrop-filter: blur(16px);
}
.program-workspace .day-no-badge {
  color: #fff;
  border-color: rgba(240,43,53,.3);
  background: rgba(240,43,53,.1);
}
.program-workspace .day-card {
  padding: clamp(14px,2vw,22px);
  border-radius: 3px 20px 3px 3px;
}
.program-workspace .ex-block.grouped {
  padding: 10px;
  border-style: solid;
  border-color: rgba(240,43,53,.35);
  background: linear-gradient(135deg, rgba(240,43,53,.09), rgba(255,255,255,.02));
}
.program-workspace .ex-row {
  padding: 12px 13px;
  border-color: rgba(255,255,255,.075);
  background: rgba(5,6,7,.56);
}
.program-workspace .ex-advanced {
  margin-top: 12px;
  padding: 14px;
  border: 1px solid rgba(255,255,255,.07);
  border-radius: 12px;
  background: rgba(255,255,255,.025);
}
.program-workspace .set-detail {
  border-color: rgba(240,43,53,.22);
  background: rgba(5,6,7,.65);
}
.program-workspace .sys-badge {
  color: #fff;
  background: rgba(240,43,53,.82);
}
.article-page {
  color: #f6f4f1;
  background:
    radial-gradient(circle at 80% 5%, rgba(240,43,53,.08), transparent 24rem),
    #090a0c;
}
.article-page > main.container {
  width: min(100% - 28px,1180px);
  max-width: 1180px;
}

@media (max-width: 720px) {
  .product-shell > .navbar,
  .article-page > .navbar {
    min-height: 58px;
    flex-wrap: nowrap;
  }
  .program-workspace .day-group-header { top: 64px; }
  .program-workspace .ex-main { align-items: flex-start; }
  .program-workspace .ex-name { min-width: 100%; }
  .program-workspace .ex-fields {
    width: 100%;
    display: grid;
    grid-template-columns: repeat(6,minmax(0,1fr));
  }
  .program-workspace .ex-fields label.mini { grid-column: span 2; }
  .program-workspace .ex-fields .icon-btn { grid-column: span 1; width: 100%; }
  .program-workspace label.mini input,
  .program-workspace label.mini.wide input { width: 100%; }
  .program-workspace .adv-grid { grid-template-columns: 1fr; }
  .program-workspace .set-row {
    display: grid;
    grid-template-columns: 46px repeat(3,minmax(0,1fr));
  }
}

/* V67 — photographic mobile gateway cards */
.experience-gate a > *{position:relative;z-index:2}
.experience-gate a:first-child{
  background:
    linear-gradient(90deg,rgba(7,9,11,.18),rgba(7,9,11,.74) 62%,rgba(7,9,11,.97)),
    linear-gradient(0deg,rgba(240,43,53,.08),transparent 55%),
    url('/images/saeed/evaluation-tablet-v67.webp') left center/cover no-repeat;
}
.experience-gate a:nth-child(2){
  background:
    linear-gradient(90deg,rgba(7,9,11,.2),rgba(7,9,11,.76) 62%,rgba(7,9,11,.97)),
    linear-gradient(0deg,rgba(240,43,53,.08),transparent 55%),
    url('/images/saeed/athlete-portal-tablet-v67.webp') left center/cover no-repeat;
}
.experience-gate a::after{
  content:"";position:absolute;z-index:1;inset:18px 18px auto auto;width:34%;height:34%;
  border-top:1px solid rgba(255,255,255,.2);border-left:1px solid rgba(255,255,255,.1);
  background:repeating-linear-gradient(0deg,transparent 0 13px,rgba(207,211,217,.1) 13px 14px);
  opacity:.72;pointer-events:none;
}
@media (max-width:720px){
  .experience-gate a:first-child,
  .experience-gate a:nth-child(2){background-position:28% center;background-size:auto 100%}
  .experience-gate a::after{inset:18px auto auto 18px;width:38%;height:30%;opacity:.55}
  .experience-gate a small{align-self:flex-end}
  .experience-gate a strong,.experience-gate a span{max-width:76%;margin-inline-start:auto;text-align:right}
}

/* V68 end-of-cascade guarantees */
:where(body:not(.public-home)) :where(input:not([type="checkbox"]):not([type="radio"]):not([type="range"]),select,textarea){
  width:100%;min-height:48px;padding:12px 14px;color:#f4f2ef;border:1px solid rgba(255,255,255,.11);
  border-radius:12px;background:linear-gradient(145deg,rgba(255,255,255,.055),rgba(255,255,255,.025));
  outline:none;transition:.2s ease;
}
:where(body:not(.public-home)) textarea{min-height:96px;resize:vertical;line-height:1.9}
:where(body:not(.public-home)) :where(input,select,textarea):focus{
  border-color:rgba(240,43,53,.75);background:rgba(17,19,23,.94);
  box-shadow:0 0 0 3px rgba(240,43,53,.12),inset 3px 0 0 rgba(240,43,53,.8);
}
:where(body:not(.public-home)) label{display:block;margin:14px 2px 7px;color:#c8cbd1;font-size:12px;font-weight:700}
@media(max-width:720px){
  .ex-square-info{height:auto!important;min-height:138px;padding:10px!important;overflow:visible!important}
  .ex-square-info span,.ex-square-info span.muted{display:block!important;-webkit-line-clamp:unset!important;overflow:visible!important;text-overflow:clip!important;white-space:normal!important;line-height:1.65!important}
  .athlete-system{display:block!important;margin-top:7px;padding:8px;border:1px solid rgba(240,43,53,.28);border-radius:8px;background:rgba(240,43,53,.07)}
  .ex-square-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  :where(body:not(.public-home)) .row2,:where(body:not(.public-home)) .row3{grid-template-columns:1fr!important;gap:6px}
  :where(body:not(.public-home)) :where(input:not([type="checkbox"]):not([type="radio"]):not([type="range"]),select,textarea){font-size:16px}
}

/* V69 — mobile stability reset and final visual assets */
.media-preview-pair{display:grid;grid-template-columns:1fr minmax(110px,.42fr);gap:10px;align-items:end}
.media-preview-pair>div>small{display:block;margin:0 0 5px;color:var(--muted);font-size:10px}
.media-editor-preview.mobile-ratio{height:220px}

.experience-gate a:first-child,.experience-gate a:nth-child(2){
  background:
    linear-gradient(90deg,rgba(7,9,11,.12),rgba(7,9,11,.76)),
    radial-gradient(circle at 82% 20%,rgba(240,43,53,.15),transparent 48%),
    repeating-linear-gradient(0deg,transparent 0 26px,rgba(255,255,255,.018) 26px 27px),
    #0b0d10;
}

[data-media-slot]{transform-origin:var(--media-x,50%) var(--media-y,50%)}
img[data-media-slot]{
  object-position:var(--media-x,50%) var(--media-y,50%)!important;
  scale:var(--media-scale,1);
}
.hero-photo[data-media-slot]{scale:var(--media-scale,1)}

.jalali-birth-picker {
  display: grid;
  grid-template-columns: .8fr 1.25fr 1fr;
  gap: 8px;
  margin-bottom: 12px;
}
.jalali-birth-picker select { margin: 0; min-width: 0; }
.birth-age-result {
  grid-column: 1 / -1;
  min-height: 44px;
  display: flex;
  align-items: center;
  padding: 10px 13px;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 12px;
  color: var(--muted);
  background: linear-gradient(135deg,rgba(255,255,255,.035),rgba(255,255,255,.012));
  font-size: 12px;
}
.birth-age-result.valid {
  color: #fff;
  border-color: rgba(240,43,53,.42);
  background: linear-gradient(135deg,rgba(240,43,53,.15),rgba(240,43,53,.035));
}

/* V98 — مسیر همکاری خوشه‌ای و هیروی دارای شکست خط دقیق */
.cooperation-page {
  height: 100svh;
  min-height: 560px;
  overflow: hidden;
  color: #f7f7f8;
  background:
    linear-gradient(rgba(255,255,255,.012) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.012) 1px,transparent 1px),
    radial-gradient(circle at 50% 52%,rgba(240,43,53,.16),transparent 26rem),
    radial-gradient(circle at 8% 8%,rgba(240,43,53,.1),transparent 22rem),
    #07090c;
  background-size:72px 72px,72px 72px,auto,auto;
}
.cooperation-page .concept-nav {
  position:fixed; z-index:20; inset:0 0 auto;
  height:76px; background:linear-gradient(180deg,rgba(7,9,12,.96),rgba(7,9,12,.55));
  backdrop-filter:blur(18px); -webkit-backdrop-filter:blur(18px);
}
.cooperation-shell {
  width:min(1240px,calc(100% - 34px)); height:100svh; min-height:560px; margin:auto;
  padding:88px 0 16px; display:grid; grid-template-rows:auto minmax(0,1fr) auto; gap:12px;
}
.cooperation-head {
  display:grid; grid-template-columns:minmax(360px,.9fr) minmax(420px,1.1fr);
  align-items:end; gap:clamp(28px,6vw,90px); max-width:none; margin:0;
}
.cooperation-head .section-kicker { margin-bottom:8px; }
.cooperation-head h1 { margin:0; font-size:clamp(32px,4.2vw,60px); line-height:1.08; }
.cooperation-head h1 .cooperation-title-from { display:block; }
.cooperation-head h1 .cooperation-title-join { display:inline-block; margin-inline-end:.22em; }
.cooperation-head h1 em { display:inline-block; color:var(--accent); font-style:normal; }
.cooperation-head p {
  grid-column:1; grid-row:1; align-self:end; margin:0 0 4px; color:#9da1aa;
  font-size:clamp(11px,1vw,14px); line-height:1.9; max-width:560px;
}
.cooperation-head > :not(p) { grid-column:2; }
.cooperation-flow {
  position:relative; min-height:0; display:grid; grid-template-columns:repeat(3,minmax(0,1fr));
  grid-template-rows:repeat(2,minmax(0,1fr)); gap:12px 14px; padding:11px;
  isolation:isolate;
}
.cooperation-flow::before {
  content:""; position:absolute; z-index:-2; inset:50% 7% auto;
  height:1px; background:linear-gradient(90deg,transparent 0,var(--accent) 12%,var(--accent) 88%,transparent);
  box-shadow:0 0 9px var(--accent),0 0 24px rgba(240,43,53,.78);
}
.cooperation-flow::after {
  content:""; position:absolute; z-index:-2; inset:9% 50% 9% auto; width:1px;
  background:linear-gradient(transparent,var(--accent) 15%,var(--accent) 85%,transparent);
  box-shadow:0 0 9px var(--accent),0 0 26px rgba(240,43,53,.72);
}
.cooperation-core {
  position:absolute; z-index:5; top:50%; left:50%; width:46px; height:46px;
  display:grid; place-items:center; translate:-50% -50%; border:1px solid rgba(255,91,100,.92);
  border-radius:50%; color:#fff; background:#0b0d11;
  box-shadow:0 0 0 5px rgba(240,43,53,.08),0 0 18px #f02b35,0 0 55px rgba(240,43,53,.62);
}
.cooperation-core::before,.cooperation-core::after {
  content:""; position:absolute; inset:-9px; border:1px dashed rgba(240,43,53,.38);
  border-radius:50%; animation:cooperation-orbit 12s linear infinite;
}
.cooperation-core::after { inset:-16px; border-style:solid; border-color:rgba(255,255,255,.08); animation-direction:reverse; }
.cooperation-core span { font:800 10px/1 Arial,sans-serif; letter-spacing:1px; }
.cooperation-core-logo { width:72%; height:72%; object-fit:contain; border-radius:50%; }
@keyframes cooperation-orbit { to { rotate:360deg; } }
.cooperation-step {
  position:relative; min-width:0; min-height:0; display:grid;
  grid-template-columns:56px minmax(0,1fr); grid-template-rows:1fr auto; gap:7px 12px;
  align-items:center; padding:14px 15px; overflow:hidden;
  border:1px solid rgba(255,255,255,.1); border-radius:20px;
  background:
    linear-gradient(135deg,rgba(255,255,255,.075),rgba(255,255,255,.018) 55%),
    radial-gradient(circle at 92% 8%,rgba(240,43,53,.13),transparent 42%);
  backdrop-filter:blur(18px) saturate(125%); -webkit-backdrop-filter:blur(18px) saturate(125%);
  box-shadow:inset 0 1px rgba(255,255,255,.05),0 18px 45px rgba(0,0,0,.22);
}
.cooperation-step::before {
  content:""; position:absolute; z-index:2; width:36%; height:1px; top:0; right:9%;
  background:linear-gradient(90deg,transparent,#ff626b,transparent);
  box-shadow:0 0 8px #f02b35,0 0 18px rgba(240,43,53,.62);
  transform:skewX(-28deg);
}
.cooperation-step::after {
  content:""; position:absolute; inset:0; pointer-events:none; opacity:.8;
  background:
    linear-gradient(122deg,transparent 0 70%,rgba(240,43,53,.18) 70.2%,transparent 71%),
    linear-gradient(28deg,transparent 0 83%,rgba(255,255,255,.08) 83.2%,transparent 84%);
}
.cooperation-icon {
  position:relative; z-index:3; grid-row:1 / span 2; width:48px; height:48px; display:grid; place-items:center;
  color:#fff; border:1px solid rgba(255,84,93,.86); border-radius:15px;
  background:linear-gradient(145deg,rgba(240,43,53,.9),rgba(93,7,13,.86));
  box-shadow:inset 0 1px rgba(255,255,255,.25),0 0 14px rgba(240,43,53,.44),0 0 34px rgba(240,43,53,.18);
}
.cooperation-icon::after { content:""; position:absolute; inset:6px; border:1px solid rgba(255,255,255,.13); border-radius:10px; }
.cooperation-icon svg { width:23px; height:23px; fill:none; stroke:currentColor; stroke-width:1.65; stroke-linecap:round; stroke-linejoin:round; }
.cooperation-copy { position:relative; z-index:3; min-width:0; align-self:end; }
.cooperation-copy small { display:block; color:#ff4a53; letter-spacing:.13em; font:700 7.5px/1.3 Arial,sans-serif; }
.cooperation-copy h2 { margin:3px 0; font-size:clamp(14px,1.25vw,18px); line-height:1.45; }
.cooperation-copy p { margin:0; color:#92969f; font-size:clamp(9px,.82vw,11.5px); line-height:1.7; }
.cooperation-index {
  position:absolute; z-index:1; left:12px; bottom:7px; color:rgba(255,255,255,.07);
  font:800 clamp(28px,3vw,43px)/1 Arial,sans-serif;
}
.cooperation-end {
  min-height:48px; display:flex; align-items:center; justify-content:space-between; gap:18px;
  padding-top:10px; border-top:1px solid rgba(255,255,255,.08);
}
.cooperation-end p { margin:0; color:#9da1aa; font-size:12px; }
.cooperation-end .btn { min-height:40px; padding:9px 18px; font-size:11px; }

.redesign-v60 .hero-inner {
  justify-self:end;
  width:min(100%,720px);
  padding-inline:38px clamp(24px,3.5vw,58px);
}
.redesign-v60 .hero-description {
  width:min(100%,660px); max-width:660px; min-width:0;
  font-size:var(--hero-description-size,clamp(13px,1.08vw,16px));
  white-space:pre-line; overflow:hidden;
}
.redesign-v60 .hero-description.preserve-lines {
  display:block; -webkit-line-clamp:unset; overflow:hidden;
  white-space:normal; text-wrap:nowrap;
}
.redesign-v60 .hero-description.preserve-lines > span {
  display:block; max-width:100%; white-space:nowrap; line-height:2.05;
}

@media(max-width:720px){
  .jalali-birth-picker { grid-template-columns:.75fr 1.15fr .95fr; gap:6px; }
  .jalali-birth-picker select { padding-inline:7px; font-size:11px; }
  .cooperation-page { min-height:540px; background-size:42px 42px,42px 42px,auto,auto; }
  .cooperation-page .concept-nav { height:56px; padding:0 12px; }
  .cooperation-page .concept-nav .brand-logo { width:52px; height:30px; }
  .cooperation-page .concept-nav .brand-text { display:flex; flex-direction:column; min-width:0; }
  .cooperation-page .concept-nav .brand-text b { font-size:10px; line-height:1.05; white-space:nowrap; }
  .cooperation-page .concept-nav .brand-text small { font-size:5.5px; letter-spacing:.14em; white-space:nowrap; }
  .cooperation-page .concept-nav>a:last-child { font-size:9px; }
  .cooperation-shell {
    width:calc(100% - 14px); min-height:540px; padding:62px 0 7px;
    grid-template-rows:auto minmax(0,1fr) auto; gap:5px;
  }
  .cooperation-head { display:grid; grid-template-columns:1fr; gap:3px; }
  .cooperation-head > :not(p),.cooperation-head p { grid-column:1; grid-row:auto; }
  .cooperation-head .section-kicker { margin:0 0 1px; font-size:6px; letter-spacing:1.5px; gap:7px; }
  .cooperation-head .section-kicker>span { width:24px; height:1px; }
  .cooperation-head h1 { font-size:clamp(20px,6.1vw,27px); line-height:1.18; }
  .cooperation-head h1 .cooperation-title-from { display:inline; white-space:nowrap; }
  .cooperation-head h1 .cooperation-title-join { display:inline; margin-inline:5px 0; white-space:nowrap; }
  .cooperation-head h1 em { display:block; width:max-content; margin-top:2px; white-space:nowrap; }
  .cooperation-head p { max-width:94%; margin:1px 0 0; font-size:8.2px; line-height:1.55; }
  .cooperation-flow {
    grid-template-columns:repeat(2,minmax(0,1fr)); grid-template-rows:repeat(3,minmax(0,1fr));
    gap:5px; padding:6px 2px;
  }
  .cooperation-flow::before { inset:50% 4% auto; opacity:.72; }
  .cooperation-flow::after { inset:5% 50% 5% auto; opacity:.72; }
  .cooperation-core { width:27px; height:27px; }
  .cooperation-core::before { inset:-5px; }
  .cooperation-core::after { inset:-9px; }
  .cooperation-core span { font-size:6px; }
  .cooperation-step {
    grid-template-columns:35px minmax(0,1fr); grid-template-rows:auto 1fr;
    gap:3px 6px; padding:7px; border-radius:12px;
  }
  .cooperation-step::before { width:48%; }
  .cooperation-icon { grid-row:1; align-self:start; margin-top:2px; width:32px; height:32px; border-radius:10px; }
  .cooperation-copy { align-self:start; }
  .cooperation-icon::after { inset:4px; border-radius:7px; }
  .cooperation-icon svg { width:17px; height:17px; }
  .cooperation-copy small { font-size:5.5px; letter-spacing:.08em; }
  .cooperation-copy h2 { margin:2px 0; font-size:clamp(10.5px,3.15vw,12.5px); line-height:1.35; }
  .cooperation-copy p { font-size:clamp(8px,2.25vw,9.2px); line-height:1.48; }
  .cooperation-index { left:7px; bottom:5px; font-size:38px; opacity:1; color:rgba(255,255,255,.12); }
  .cooperation-end { min-height:38px; gap:7px; padding-top:4px; }
  .cooperation-end p { max-width:45%; font-size:7.5px; line-height:1.5; }
  .cooperation-end .btn { min-height:32px; width:auto; padding:7px 9px; font-size:8px; border-radius:8px; text-align:center; }
  .redesign-v60 .hero-description.preserve-lines {
    display:block!important; -webkit-line-clamp:unset!important;
  }
  .redesign-v60 .hero-inner { width:100%; padding-inline:14px!important; }
}

@media(max-width:720px) and (max-height:680px){
  .cooperation-page .concept-nav .brand-text small { display:none; }
  .cooperation-shell { padding-top:58px; }
  .cooperation-head p { display:none; }
  .cooperation-copy p { font-size:6.8px; line-height:1.38; }
  .cooperation-end p { display:none; }
  .cooperation-end { justify-content:center; min-height:32px; }
}

@media(prefers-reduced-motion:reduce){
  .cooperation-core::before,.cooperation-core::after { animation:none; }
}

@media(max-width:720px){
  html,body.public-home{scroll-snap-type:none!important;scroll-behavior:auto}
  body.public-home>.hero,
  body.public-home>.experience-gate,
  body.public-home>.container,
  body.public-home>.embedded-concept,
  body.public-home>.site-footer{
    height:auto!important;max-height:none!important;scroll-snap-align:none!important;scroll-snap-stop:normal!important
  }
  body.public-home>.hero{min-height:100svh!important}
  body.public-home>.experience-gate{min-height:0!important}
  body.public-home>.container,
  body.public-home>.embedded-concept{min-height:100svh!important}
  body.public-home>.site-footer{min-height:50svh!important}

  .redesign-v60 .hero-photo{
    background-image:
      linear-gradient(0deg,#070809 0%,rgba(7,8,9,.92) 25%,rgba(7,8,9,.14) 62%),
      var(--media-image,url('/images/saeed/hero-designed-v61.jpg'))!important;
    background-position:center,var(--media-mobile-x,50%) var(--media-mobile-y,50%)!important;
    background-size:cover,cover!important;
    background-repeat:no-repeat!important;
    transform-origin:var(--media-mobile-x,50%) var(--media-mobile-y,50%)!important;
    scale:var(--media-mobile-scale,1)!important;
  }
  .redesign-v60 .hero-inner{min-height:100svh!important;height:auto!important}

  .experience-gate{
    padding:24px 12px!important;
    align-content:initial!important;
    gap:12px!important
  }
  .experience-gate a{min-height:min(36svh,280px)!important}
  .experience-gate a strong,.experience-gate a span{max-width:88%;margin-inline-start:auto;text-align:right}

  .redesign-v60>.container{height:auto!important;max-height:none!important;min-height:100svh!important;padding:74px 12px 38px!important;overflow:visible!important}
  .redesign-v60 .page-panel{height:auto!important;max-height:none!important;min-height:calc(100svh - 130px)!important;overflow:visible!important}
  .redesign-v60 .about-box{height:auto!important;min-height:calc(100svh - 210px)!important}
  .contact-stage,#page-articles #articleListView{height:auto!important;overflow:visible!important}
  .embedded-concept{overflow:visible!important}

  .product-shell .app-sidebar{
    scroll-snap-type:none!important;
    overscroll-behavior-inline:auto!important;
    scroll-behavior:auto!important;
    -webkit-overflow-scrolling:touch;
  }
  .product-shell .sidebar-link{scroll-snap-align:none!important}
  .athlete-quick-links{
    flex:0 0 auto!important;height:48px!important;margin:5px 4px!important;
    align-self:center!important;align-items:stretch!important;gap:5px!important
  }
  .athlete-quick-links a{
    display:flex!important;align-items:center!important;justify-content:center!important;
    min-width:82px!important;height:48px!important;padding:6px 9px!important;white-space:nowrap!important
  }
  .mobile-swipe-hint{pointer-events:none}
  .media-preview-pair{grid-template-columns:1fr}
  .media-editor-preview.mobile-ratio{height:300px}
  img[data-media-slot]{
    object-position:var(--media-mobile-x,var(--media-x,50%)) var(--media-mobile-y,var(--media-y,50%))!important;
    transform-origin:var(--media-mobile-x,var(--media-x,50%)) var(--media-mobile-y,var(--media-y,50%))!important;
    scale:var(--media-mobile-scale,var(--media-scale,1));
  }
}

/* V105 final overrides */
.purchase-plan-card .plan-visual img{
  object-position:var(--cover-x,50%) var(--cover-y,50%);
  transform:scale(var(--cover-scale,1));
  transform-origin:var(--cover-x,50%) var(--cover-y,50%);
  filter:grayscale(.18) contrast(1.07) saturate(.98)
}
.purchase-plan-card:hover .plan-visual img{
  transform:scale(var(--cover-scale,1));
  filter:grayscale(.03) contrast(1.09) saturate(1)
}
.purchase-plan-card .plan-summary{gap:5px;padding:9px 13px 11px}
.purchase-plan-card .plan-reveal-btn{padding:6px 9px}
.purchase-plan-dialog{width:min(900px,100%);max-width:900px}
.purchase-dialog-hero img{
  width:100%;height:100%;object-fit:contain;object-position:center;
  transform:none!important;filter:none
}
.admin-plan-visual img{
  object-position:var(--cover-x,50%) var(--cover-y,50%);
  transform:scale(var(--cover-scale,1));
  transform-origin:var(--cover-x,50%) var(--cover-y,50%)
}

/* V106 — compact athlete purchase dialog with one scroll owner. */
.purchase-plan-modal{
  overflow:hidden!important;
  overscroll-behavior:none
}
.product-shell .purchase-plan-dialog,
.purchase-plan-dialog{
  width:min(760px,calc(100vw - 40px));
  max-width:760px!important;
  max-height:calc(100svh - 40px);
  overflow-x:hidden!important;
  overflow-y:auto!important;
  overscroll-behavior:contain;
  scrollbar-gutter:auto
}
#purchasePlanDetail{
  width:100%;
  max-height:none;
  overflow:visible;
  scrollbar-gutter:auto
}
.purchase-dialog-hero{
  width:100%;
  aspect-ratio:16/9;
  min-height:0;
  max-height:none
}
.purchase-dialog-content{
  gap:9px;
  padding:16px 20px 18px
}
.purchase-dialog-content h2{
  font-size:clamp(21px,2vw,29px)
}
.purchase-plan-description{
  padding-bottom:9px;
  font-size:11.5px;
  line-height:1.85
}
.purchase-dialog-content .plan-duration-list{
  gap:5px
}
.purchase-dialog-content .plan-duration-option{
  grid-template-columns:16px minmax(0,1fr) auto;
  gap:9px;
  min-height:46px;
  padding:7px 10px;
  border:1px solid rgba(255,255,255,.075);
  border-radius:3px;
  background:rgba(255,255,255,.018);
  transition:border-color .18s ease,background .18s ease,box-shadow .18s ease
}
.purchase-dialog-content .plan-duration-option:hover{
  border-color:color-mix(in srgb,var(--plan-accent) 34%,rgba(255,255,255,.1))
}
.purchase-dialog-content .plan-duration-option:has(input:checked){
  border-color:color-mix(in srgb,var(--plan-accent) 68%,rgba(255,255,255,.12));
  background:color-mix(in srgb,var(--plan-accent) 7%,rgba(255,255,255,.018));
  box-shadow:inset 3px 0 0 color-mix(in srgb,var(--plan-accent) 80%,#fff)
}
.purchase-dialog-content .plan-duration-option input[type="radio"]{
  appearance:none;
  -webkit-appearance:none;
  width:14px;
  height:14px;
  margin:0;
  border:1px solid rgba(255,255,255,.42);
  border-radius:50%;
  background:#0a0b0d;
  box-shadow:none;
  cursor:pointer
}
.purchase-dialog-content .plan-duration-option input[type="radio"]:checked{
  border-color:var(--plan-accent);
  background:var(--plan-accent);
  box-shadow:inset 0 0 0 3px #0a0b0d,0 0 9px color-mix(in srgb,var(--plan-accent) 55%,transparent)
}
.purchase-dialog-content .plan-duration-option input[type="radio"]:focus-visible{
  outline:2px solid color-mix(in srgb,var(--plan-accent) 70%,#fff);
  outline-offset:3px
}
.purchase-dialog-content .plan-duration-copy b{
  font-size:11.5px
}
.purchase-dialog-content .plan-duration-copy small{
  font-size:8.5px
}
.purchase-dialog-content .plan-duration-value strong{
  font-size:11.5px
}
.purchase-plan-checkout{
  position:relative;
  margin:3px -20px -18px;
  padding:10px 20px 12px
}
.purchase-plan-checkout .plan-buy-btn{
  min-height:52px
}
@media(max-width:760px){
  .purchase-plan-modal{
    padding:8px
  }
  .product-shell .purchase-plan-dialog,
  .purchase-plan-dialog{
    width:100%;
    max-width:none!important;
    max-height:calc(100svh - 16px)
  }
  .purchase-dialog-hero{
    aspect-ratio:16/9;
    max-height:none
  }
  .purchase-dialog-content{
    gap:8px;
    padding:14px 12px 14px
  }
  .purchase-dialog-content .plan-duration-option{
    grid-template-columns:14px minmax(0,1fr) auto;
    gap:7px;
    min-height:44px;
    padding:7px 8px
  }
  .purchase-dialog-content .plan-duration-value{
    display:flex;
    align-items:center;
    gap:5px;
    text-align:left
  }
  .purchase-plan-checkout{
    margin:3px -12px -14px;
    padding:9px 12px 10px
  }
}

/* V126 — اصلاح قطعی چیدمان موبایل (این بلوک عمداً انتهای فایل است تا در کَسکید برنده باشد) */
@media (max-width: 720px) {
  /* ۳ باکس آمار بالای صفحه: وسط‌چین کامل */
  .hero-proof > div { text-align: center !important; align-items: center !important; }
  .hero-proof strong { text-align: center !important; }
  .hero-proof span { display: block !important; text-align: center !important; }
  /* دو کارت پایین: راست‌چین مثل دسکتاپ */
  .experience-gate a { text-align: right !important; align-items: flex-end !important; }
  .experience-gate a small { align-self: flex-end !important; direction: ltr; }
  .experience-gate a strong,
  .experience-gate a span { width: 100% !important; max-width: 100% !important; margin-inline-start: 0 !important; text-align: right !important; }
}



/* V132 — سینک نسبت قاب پیش‌نمایش پنل با قاب واقعی سایت */
.media-editor-preview.synced-ratio { height:auto !important; }
.media-editor-preview.synced-ratio.hero-ratio { height:auto !important; }
.media-editor-preview.synced-ratio.mobile-ratio { height:auto !important; }

/* V131 — ادیتور قاب ۴جهته + زوم درصددار + بازنشانی برای گالری‌ها (هم‌سبک پلن کاور) */
.frame-pad-editor{display:grid;gap:9px;margin-top:9px}
.frame-pad{display:grid;grid-template-columns:repeat(3,30px);grid-template-rows:repeat(3,30px);gap:3px;direction:ltr;justify-content:center}
.frame-pad button{display:grid;place-items:center;padding:0;border:1px solid rgba(255,255,255,.14);border-radius:7px;background:#111318;color:#fff;font-size:15px;cursor:pointer}
.frame-pad button:hover{border-color:var(--red);box-shadow:0 0 12px rgba(240,43,53,.24)}
.frame-pad button:nth-child(1){grid-column:2;grid-row:1}
.frame-pad button:nth-child(2){grid-column:3;grid-row:2}
.frame-pad button:nth-child(3){grid-column:2;grid-row:3}
.frame-pad button:nth-child(4){grid-column:1;grid-row:2}
.frame-zoom{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:8px;margin:0;font-size:12px;color:var(--muted)}
.frame-zoom input{margin:0;padding:0}
.frame-zoom output{font-size:12px;color:#fff;min-width:38px;text-align:left;direction:ltr}
.frame-reset{padding:5px 12px;font-size:12px;justify-self:start}

/* V129 — ادیتور یکدست گالری‌ها (کادر دسکتاپ/موبایل + کپشن روی عکس) */
#galleryList, #personalGalleryList, #aboutPhotosList {
  display:grid; grid-template-columns:repeat(auto-fill,minmax(280px,1fr)); gap:16px; margin-top:14px;
}
.gallery-frames { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.gallery-frames small { color:var(--muted); font-size:11px; display:block; margin-bottom:5px; }
.media-editor-preview.gallery-ratio { position:relative; height:auto; aspect-ratio:4/3; }
.media-editor-preview.gallery-ratio.mobile-ratio { height:auto; aspect-ratio:4/3; }
.gallery-cap-preview {
  position:absolute; inset-inline:0; bottom:0; padding:16px 10px 8px; font-size:12px; font-weight:600;
  color:#fff; text-align:right; line-height:1.4; pointer-events:none;
  background:linear-gradient(to top, rgba(0,0,0,.82), rgba(0,0,0,.45) 55%, transparent);
}
.gallery-cap-preview:empty { display:none; }
.gallery-cap-label { display:block; font-size:12px; color:var(--muted); margin-top:4px; }
.gallery-cap-label input { width:100%; margin-top:5px; }
.gallery-card-actions { display:flex; gap:8px; margin-top:4px; }

/* V129 — نمایش گالری سابقه حرفه‌ای روی سایت با کادر و کپشن یکدست */
.record-photo-grid .gallery-photo { position:relative; margin:0; border-radius:14px; overflow:hidden; }
.record-photo-grid .gallery-photo img {
  width:100%; aspect-ratio:4/3; object-fit:cover;
  object-position:var(--px,50%) var(--py,50%); scale:var(--pz,1); transform-origin:var(--px,50%) var(--py,50%);
  border:1px solid rgba(255,255,255,.09); border-radius:14px; filter:grayscale(1);
}
.record-photo-grid .gallery-photo-caption {
  position:absolute; inset-inline:0; bottom:0; padding:20px 14px 11px;
  font-size:13px; font-weight:700; color:#fff; text-align:right; line-height:1.45;
  background:linear-gradient(to top, rgba(0,0,0,.85), rgba(0,0,0,.4) 60%, transparent);
}
@media (max-width:720px) {
  .record-photo-grid .gallery-photo img {
    object-position:var(--mpx,50%) var(--mpy,50%); scale:var(--mpz,1); transform-origin:var(--mpx,50%) var(--mpy,50%);
  }
}

/* V130 — کادر موبایل برای گالری‌های career-card و چیدمان استاندارد گالری‌های جدید */
@media (max-width:720px) {
  .career-card img {
    object-position: var(--mpx, 50%) var(--mpy, 25%);
    scale: var(--mpz, 1);
    transform-origin: var(--mpx, 50%) var(--mpy, 25%);
  }
  .career-card:hover img { scale: calc(var(--mpz, 1) * 1.06); }
}
.about-posters-gallery, .personal-archive-gallery { margin-top: 22px; }

/* V133 — گالری آجری (masonry): هر عکس با نسبت اصلی خودش، بدون بریدن + افکت هاور */
.masonry-gallery {
  columns: 4;
  column-gap: 10px;
  margin-top: 22px;
}
.masonry-card {
  position: relative;
  break-inside: avoid;
  margin: 0 0 12px;
  border-radius: 3px 20px 3px 3px;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.08);
  background: var(--sn-surface-2);
}
.masonry-card img {
  display: block;
  width: 100%;
  height: auto;                 /* نسبت اصلی عکس حفظ می‌شود */
  filter: grayscale(1) saturate(.25) contrast(1.05);
  transition: transform .8s var(--sn-ease), filter .45s ease;
}
.masonry-card::after {
  content: "";
  position: absolute; inset: 0;
  background: linear-gradient(0deg, rgba(7,8,9,.85), transparent 55%);
  pointer-events: none;
}
.masonry-card figcaption {
  position: absolute; z-index: 2; inset: auto 16px 14px;
  color: #fff; font-size: 13px; font-weight: 700; text-align: right;
}
.masonry-card:hover img {
  transform: scale(1.05);
  filter: grayscale(.15) saturate(.7) contrast(1.03);
}
@media (min-width: 1500px) { .masonry-gallery { columns: 5; } }
@media (max-width: 1000px) { .masonry-gallery { columns: 3; } }
@media (max-width: 700px) { .masonry-gallery { columns: 2; } }
@media (max-width: 440px) { .masonry-gallery { columns: 1; } }
.masonry-card { margin-bottom: 10px; }

/* V133 — پیش‌نمایش نسبت‌طبیعی گالری در پنل (سینک کامل با سایتِ آجری) */
.gallery-simple-card { max-width: 320px; }
.gallery-natural-preview { position: relative; border-radius: 10px; overflow: hidden; border: 1px solid var(--border); background: #050506; }
.gallery-natural-preview img { display: block; width: 100%; height: auto; filter: grayscale(1) saturate(.25) contrast(1.05); }
.gallery-natural-preview .gallery-cap-preview {
  position: absolute; inset-inline: 0; bottom: 0; padding: 16px 10px 8px;
  font-size: 12px; font-weight: 600; color: #fff; text-align: right;
  background: linear-gradient(to top, rgba(0,0,0,.82), transparent);
}
.gallery-natural-preview .gallery-cap-preview:empty { display: none; }
.gallery-natural-note { font-size: 11px; color: var(--muted); margin: 8px 0 2px; line-height: 1.6; }

/* V134 — سیستم وضعیت درخواست‌های برنامه */
.pr-badge { background:var(--red); color:#fff; font-size:11px; font-weight:700; padding:3px 9px; border-radius:20px; }
.pr-filter { display:flex; gap:6px; flex-wrap:wrap; }
.pr-filter-btn { background:#14151a; color:var(--muted); border:1px solid var(--border); border-radius:20px; padding:5px 13px; font-size:12px; cursor:pointer; }
.pr-filter-btn.active { background:var(--red); color:#fff; border-color:var(--red); }
.pr-row { border:1px solid var(--border); border-radius:12px; padding:13px 15px; margin-bottom:11px; background:rgba(255,255,255,.02); }
.pr-row.is-unseen { border-color:rgba(229,9,20,.55); box-shadow:0 0 0 1px rgba(229,9,20,.25) inset; }
.pr-row-head { display:flex; align-items:center; justify-content:space-between; gap:10px; flex-wrap:wrap; margin-bottom:10px; }
.pr-status-chip { font-size:12px; font-weight:700; padding:4px 12px; border-radius:20px; white-space:nowrap; }
.pr-new { background:rgba(229,9,20,.16); color:#ff6b73; }
.pr-seen { background:rgba(245,158,11,.16); color:#fbbf24; }
.pr-designing { background:rgba(59,130,246,.16); color:#60a5fa; }
.pr-sent { background:rgba(34,198,94,.16); color:#4ade80; }
.pr-track { display:flex; align-items:center; gap:5px; flex-wrap:wrap; margin-bottom:11px; }
.pr-step { font-size:10.5px; font-weight:600; padding:3px 9px; border-radius:14px; background:#14151a; color:#555; border:1px solid var(--border); }
.pr-step.done.pr-new { background:rgba(229,9,20,.14); color:#ff6b73; border-color:transparent; }
.pr-step.done.pr-seen { background:rgba(245,158,11,.14); color:#fbbf24; border-color:transparent; }
.pr-step.done.pr-designing { background:rgba(59,130,246,.14); color:#60a5fa; border-color:transparent; }
.pr-step.done.pr-sent { background:rgba(34,198,94,.14); color:#4ade80; border-color:transparent; }
.pr-arrow { color:#3a3a42; font-size:11px; }
.pr-row-foot { display:flex; align-items:center; justify-content:space-between; gap:10px; flex-wrap:wrap; }
.pr-actions { display:flex; gap:7px; flex-wrap:wrap; }
.pr-actions .action-btn.primary { background:var(--red); color:#fff; border-color:var(--red); }
/* سمت شاگرد */
.myreq-tracker { display:flex; align-items:center; gap:4px; flex-wrap:wrap; margin:10px 0; }
.myreq-step { flex:1; min-width:70px; text-align:center; font-size:11px; font-weight:600; padding:8px 4px; border-radius:9px; background:#14151a; color:#555; border:1px solid var(--border); }
.myreq-step.active { color:#fff; }
.myreq-step.s-new.active { background:rgba(229,9,20,.2); color:#ff6b73; border-color:transparent; }
.myreq-step.s-seen.active { background:rgba(245,158,11,.2); color:#fbbf24; border-color:transparent; }
.myreq-step.s-designing.active { background:rgba(59,130,246,.2); color:#60a5fa; border-color:transparent; }
.myreq-step.s-sent.active { background:rgba(34,198,94,.2); color:#4ade80; border-color:transparent; }
.myreq-row { border:1px solid var(--border); border-radius:12px; padding:13px 15px; margin-bottom:11px; background:rgba(255,255,255,.02); }
.myreq-row-head { display:flex; justify-content:space-between; gap:10px; flex-wrap:wrap; align-items:center; }

/* V135 — حالت خالی باکس وضعیت درخواست (همیشه بالای صفحه شاگرد) */
.myreq-empty { border-style: dashed; }

/* V136 — کادرهای دوره‌ای برنامه‌ها + پنل وضعیت خاموش/روشن */
.myreq-panel.is-dimmed { opacity: .55; filter: grayscale(.6); }
.myreq-panel.is-dimmed .myreq-step { background: #14151a; color: #555; border-color: var(--border); }
.period-box { border: 1px solid var(--border); border-radius: 14px; margin-bottom: 16px; overflow: hidden; background: rgba(255,255,255,.02); }
.period-box-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; padding: 13px 16px; background: rgba(229,9,20,.06); border-bottom: 1px solid var(--border); }
.period-box-body { padding: 10px 16px 14px; display: flex; flex-direction: column; gap: 9px; }
.period-prog-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; padding: 9px 0; border-bottom: 1px dashed rgba(255,255,255,.06); }
.period-prog-row:last-child { border-bottom: 0; }
.period-prog-cat { display: inline-block; font-size: 11px; font-weight: 700; color: #ff6b73; background: rgba(229,9,20,.12); padding: 2px 9px; border-radius: 12px; margin-left: 8px; }
.period-chip { font-size: 12px; }
/* V145: شاخص‌های متابولیک ورزشکار در سربرگ برنامه‌ها */
.metabolic-strip{display:flex;align-items:center;flex-wrap:wrap;gap:6px 8px;margin:8px 0 12px;direction:ltr}
.metabolic-strip span{display:inline-flex;gap:4px;align-items:center;padding:5px 9px;border:1px solid var(--border);border-radius:999px;background:var(--card-2);color:var(--muted);font-size:11px;line-height:1.2}
.metabolic-strip span b{color:var(--text);font-size:10px;letter-spacing:.35px}.metabolic-strip small{direction:rtl;color:var(--muted);font-size:9.5px}

/* V150 — هایلایت فیلد خطادار در فرم‌ها (فقط اولین فیلد مشکل‌دار) */
.field-error-flash {
  border-color: #ff4d4d !important;
  box-shadow: 0 0 0 3px rgba(255, 77, 77, .22) !important;
  animation: fieldErrorPulse .5s ease;
}
@keyframes fieldErrorPulse {
  0%, 100% { box-shadow: 0 0 0 3px rgba(255, 77, 77, .22); }
  50% { box-shadow: 0 0 0 5px rgba(255, 77, 77, .35); }
}

/* V152 — بازشو فقط روی سربرگ‌ها، کارت درخواست فشرده، ویرایش کامل ورزشکار */
.admin-collapse-head { display:flex; align-items:center; justify-content:space-between; gap:10px; flex-wrap:wrap; }
.admin-collapse-toggle {
  appearance:none; border:0; background:transparent; color:var(--text); padding:0; margin:0;
  display:inline-flex; align-items:center; gap:9px; cursor:pointer; font:inherit; text-align:right;
}
.admin-collapse-toggle--solo { width:100%; justify-content:space-between; }
.admin-collapse-title { font-size:14.5px; font-weight:800; line-height:1.5; }
.admin-collapse-chevron {
  width:25px; height:25px; border:1px solid var(--border); border-radius:8px;
  display:inline-flex; align-items:center; justify-content:center; color:var(--muted);
  font-size:18px; line-height:1; transform:rotate(180deg); transition:transform .18s ease, color .18s ease, border-color .18s ease;
}
.admin-collapse-toggle[aria-expanded="false"] .admin-collapse-chevron { transform:rotate(0deg); }
.admin-collapse-toggle:hover .admin-collapse-chevron,
.admin-collapse-toggle:focus-visible .admin-collapse-chevron { color:#fff; border-color:rgba(239,48,57,.58); }
.admin-collapse-toggle:focus-visible { outline:2px solid rgba(239,48,57,.45); outline-offset:5px; border-radius:6px; }
.admin-collapse-body[hidden] { display:none !important; }
#manualCustomerBody { padding-top:8px; }

/* معماری کارت‌های درخواست دست‌نخورده است؛ فقط ارتفاع و فاصله‌های عمودی کمتر شده‌اند. */
#programRequestsCard .pr-row { padding:8px 12px; margin-bottom:7px; border-radius:11px; }
#programRequestsCard .pr-row-head { margin-bottom:4px; gap:7px; }
#programRequestsCard .pr-track { margin-bottom:5px; gap:4px; }
#programRequestsCard .pr-row-foot { gap:7px; }
#programRequestsCard .pr-step { padding:2px 8px; font-size:10px; }
#programRequestsCard .pr-status-chip { padding:3px 10px; font-size:11px; }
#programRequestsCard .pr-actions { gap:5px; }
#programRequestsCard .pr-actions .action-btn { padding:5px 10px; font-size:11.5px; min-height:0; }

.full-edit-modal { max-height:min(90svh,920px); overflow-y:auto; }
.full-edit-section { border:1px solid var(--border); border-radius:12px; padding:12px; margin-bottom:12px; background:rgba(255,255,255,.018); }
.full-edit-section h4 { margin:0 0 8px; font-size:13.5px; }
.full-edit-section-head { display:flex; align-items:center; justify-content:space-between; gap:10px; flex-wrap:wrap; }
.full-edit-section input:disabled,
.full-edit-section select:disabled,
.full-edit-section textarea:disabled { opacity:.48; cursor:not-allowed; }

@media (max-width:640px) {
  .admin-collapse-head { align-items:flex-start; }
  .admin-collapse-head .pr-filter { width:100%; }
  #programRequestsCard .pr-row { padding:8px 9px; }
  #programRequestsCard .pr-row-foot { align-items:flex-start; }
}

/* V153 — جای صحیح بازشوها و کارت یکپارچه اعضای سایت */
.members-card { width:100%; }
.members-card-head {
  display:flex; align-items:center; justify-content:space-between; gap:10px 14px; flex-wrap:wrap;
}
.members-card-tools {
  flex:1 1 auto; min-width:0; display:flex; align-items:center; justify-content:flex-end; gap:7px; flex-wrap:nowrap;
}
.members-card-tools[hidden] { display:none !important; }
#customerSearch {
  width:180px; max-width:100%; min-height:34px; margin:0;
}
.member-filter { display:flex; align-items:center; gap:5px; flex-wrap:nowrap; }
.member-filter-btn {
  appearance:none; border:1px solid var(--border); border-radius:999px; background:#14151a; color:var(--muted);
  padding:5px 8px; font:600 11px/1.4 inherit; cursor:pointer; white-space:nowrap;
  transition:background .16s ease,color .16s ease,border-color .16s ease;
}
.member-filter-btn:hover,
.member-filter-btn:focus-visible { color:#fff; border-color:rgba(239,48,57,.5); outline:none; }
.member-filter-btn.active { background:var(--red); color:#fff; border-color:var(--red); }
#siteMembersBody { padding-top:9px; }
.members-table-wrap { width:100%; overflow-x:auto; -webkit-overflow-scrolling:touch; }
.members-table-wrap #customersTable { margin:0; }

@media (max-width:640px) {
  .members-card-head { align-items:flex-start; }
  .members-card-tools { flex-basis:100%; justify-content:flex-start; flex-wrap:wrap; }
  #customerSearch { width:100%; }
  .member-filter { width:100%; }
  .members-table-wrap { overflow-x:hidden; }
  .members-table-wrap #customersTable { width:100%; table-layout:fixed; }
  #customersTable .member-phone-col,
  #customersTable .member-orders-col { display:none; }
  #customersTable .member-code-col { width:13%; padding-inline:4px; text-align:center; }
  #customersTable .member-name-col { width:39%; padding-inline:5px; white-space:normal; line-height:1.45; }
  #customersTable .member-actions-col { width:48%; padding-inline:3px; }
  #customersTable .member-actions-col .action-cluster { display:flex; flex-wrap:nowrap; justify-content:flex-end; gap:4px; }
  #customersTable .member-actions-col .action-btn { padding:5px 7px; font-size:10.5px; white-space:nowrap; }
}

/* V198 — فرم اندازه‌گیری فشرده و نمایش پایدار انتخاب‌ها در موبایل */
.size-short-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
.sn-select{position:relative;width:100%;min-width:0}.sn-select.open{z-index:90}
.sn-select-native{position:absolute!important;inset:0!important;width:1px!important;height:1px!important;min-height:1px!important;opacity:0!important;pointer-events:none!important}
.sn-select-trigger{width:100%;min-height:48px;padding:9px 12px;display:flex;align-items:center;justify-content:space-between;gap:10px;border:1px solid rgba(255,255,255,.11);border-radius:12px;background:linear-gradient(145deg,rgba(255,255,255,.055),rgba(255,255,255,.025));color:#f4f2ef;font:inherit;font-size:16px;text-align:start}
.sn-select-value{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sn-select-chevron{flex:0 0 7px;width:7px;height:7px;border-inline-end:1.5px solid #92929b;border-bottom:1.5px solid #92929b;transform:rotate(45deg);transition:.18s}
.sn-select.open .sn-select-chevron{transform:rotate(225deg)}
.sn-select-menu{position:absolute;top:calc(100% + 6px);inset-inline:0;z-index:100;display:none;max-height:var(--sn-menu-max-height,min(300px,42vh));overflow:auto;padding:6px;border:1px solid rgba(255,255,255,.12);border-radius:14px;background:#17181d;box-shadow:0 24px 55px rgba(0,0,0,.62)}
.sn-select.open .sn-select-menu{display:block}
.sn-select.drop-up .sn-select-menu{top:auto;bottom:calc(100% + 6px)}
.sn-select-option{width:100%;min-height:39px;padding:8px 11px;border:0;border-radius:9px;background:transparent;color:#c6c8ce;text-align:start;font:inherit;font-size:13px}
.sn-select-option.selected{background:rgba(229,9,20,.2);color:#fff}
.sn-select-option.selected::after{content:'✓';float:inline-end;color:#ff626c}

/* V161 — mobile rolling galleries for visual journey and professional record */
@media (max-width:720px){
  .mobile-gallery-shell{position:relative;margin-inline:calc(50% - 50vw);overflow:hidden;padding:0 0 8px}
  .mobile-rolling-gallery,
  .masonry-gallery.mobile-rolling-gallery{
    display:flex!important;
    columns:auto!important;
    gap:12px;
    overflow-x:auto;
    overflow-y:hidden;
    margin:0!important;
    padding:10px 12vw 18px;
    scroll-snap-type:x mandatory;
    scroll-behavior:smooth;
    overscroll-behavior-x:contain;
    scrollbar-width:none;
    touch-action:pan-x pan-y;
  }
  .mobile-rolling-gallery::-webkit-scrollbar{display:none}
  .mobile-rolling-gallery > figure,
  .mobile-rolling-gallery > .career-card,
  .mobile-rolling-gallery > .masonry-card{
    flex:0 0 min(78vw,340px)!important;
    width:min(78vw,340px)!important;
    min-width:min(78vw,340px)!important;
    height:min(112vw,510px)!important;
    margin:0!important;
    scroll-snap-align:center;
    scroll-snap-stop:always;
    border-radius:4px 20px 4px 4px;
  }
  .mobile-rolling-gallery > .masonry-card img,
  .mobile-rolling-gallery > .career-card img{
    width:100%;height:100%;object-fit:cover;
  }
  .mobile-gallery-arrow{
    position:absolute;z-index:15;top:50%;transform:translateY(-50%);
    width:42px;height:42px;border-radius:50%;border:1px solid rgba(255,255,255,.2);
    background:rgba(8,9,12,.78);backdrop-filter:blur(12px);color:#fff;font-size:30px;
    display:grid;place-items:center;box-shadow:0 10px 30px rgba(0,0,0,.45);touch-action:manipulation;
  }
  .mobile-gallery-arrow.prev{left:8px}.mobile-gallery-arrow.next{right:8px}
}
.mobile-gallery-shell{position:relative}.mobile-gallery-arrow{display:none}
@media (max-width:720px){.mobile-gallery-arrow{display:grid}}
@media (max-width:720px){
  .mobile-rolling-gallery{direction:ltr}
  .mobile-rolling-gallery > figure{direction:rtl}
}

/* V162 — natural-size mobile rolling galleries; no crop */
@media (max-width:720px){
  .mobile-rolling-gallery,
  .masonry-gallery.mobile-rolling-gallery{
    align-items:center;
    padding-inline:10vw;
    scroll-snap-type:x mandatory;
    touch-action:pan-x;
  }
  .mobile-rolling-gallery > figure,
  .mobile-rolling-gallery > .career-card,
  .mobile-rolling-gallery > .masonry-card{
    flex:0 0 var(--mobile-natural-width,82vw)!important;
    width:var(--mobile-natural-width,82vw)!important;
    min-width:var(--mobile-natural-width,82vw)!important;
    height:auto!important;
    max-height:none!important;
    align-self:center;
    overflow:hidden;
  }
  .mobile-rolling-gallery > .masonry-card img,
  .mobile-rolling-gallery > .career-card img{
    display:block!important;
    width:100%!important;
    height:auto!important;
    max-height:78vh!important;
    object-fit:contain!important;
    object-position:center!important;
    scale:1!important;
    transform:none!important;
    background:#07080a;
  }
  .mobile-gallery-arrow{font-size:22px;font-weight:700;line-height:1}
  .mobile-gallery-arrow.prev{left:7px}
  .mobile-gallery-arrow.next{right:7px}
}


/* V164 — mobile gallery direction is controlled by DOM order for reliable iOS scrolling */
@media (min-width:721px){
  .page-panel:not(#page-home){content-visibility:auto;contain-intrinsic-size:900px}
}

/* ===== V173: رفع چک‌باکس پلن بین‌المللی + سرریز مودال ===== */
.plan-intl-toggle{display:flex;align-items:center;gap:10px;margin:10px 0;font-size:13px;line-height:1.7;cursor:pointer}
.plan-intl-toggle input[type="checkbox"]{width:20px;height:20px;min-width:20px;flex:0 0 auto;padding:0;margin:0;border-radius:6px;accent-color:var(--accent);cursor:pointer}
.plan-intl-toggle span{flex:1;min-width:0}
/* مودال ویرایش پلن از بالای صفحه شروع شود و در صورت بلندی، داخل خودش اسکرول شود (نه سرریز از بالا) */
.plan-editor-modal{align-items:flex-start;overflow-y:auto;padding-top:max(20px,4vh);padding-bottom:max(20px,4vh)}
.product-shell .plan-editor-dialog{max-height:calc(100svh - max(40px,8vh))}

/* ===== V173: دکمه‌ی سوییچ زبان (فاز اول i18n) ===== */
.lang-toggle{display:inline-flex;align-items:center;justify-content:center;gap:5px;min-width:62px;background:transparent;border:1px solid rgba(255,255,255,.22);color:#fff;border-radius:999px;padding:6px 12px;font-size:13px;font-weight:700;cursor:pointer;transition:.15s;line-height:1;flex:0 0 auto}
.lang-toggle:hover{border-color:rgba(240,43,53,.7);box-shadow:0 0 16px rgba(240,43,53,.25)}
.lang-toggle .lang-label{font-family:inherit;min-width:20px;text-align:center}

/* ===== V184: مودال پلن بین‌المللی (توضیحات + گزینه‌های مدت با تخفیف) ===== */
.intl-modal{position:fixed;inset:0;z-index:1000;background:rgba(0,0,0,.7);backdrop-filter:blur(4px);display:flex;align-items:flex-start;justify-content:center;overflow-y:auto;padding:max(20px,5vh) 16px}
.intl-modal-card{position:relative;direction:ltr;text-align:left;width:100%;max-width:440px;background:linear-gradient(160deg,#141519,#0a0b0d 72%);border:1px solid rgba(240,43,53,.4);border-radius:20px;padding:26px 22px 22px;box-shadow:0 22px 60px rgba(0,0,0,.6),0 0 46px rgba(240,43,53,.16);margin:auto}
.intl-modal-close{position:absolute;top:12px;right:14px;width:34px;height:34px;border-radius:50%;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.14);color:#fff;font-size:20px;cursor:pointer;line-height:1}
.intl-modal-close:hover{background:rgba(240,43,53,.3)}
.intl-modal-badge{display:inline-block;font-size:11px;font-weight:800;letter-spacing:1px;color:#f02b35;margin-bottom:8px}
.intl-modal-card h3{font-size:19px;color:#fff;margin:0 0 10px;line-height:1.4}
.intl-modal-desc{font-size:13.5px;color:#b9bec7;line-height:1.9;margin:0 0 16px;white-space:pre-line}
.intl-durations{display:flex;flex-direction:column;gap:9px;margin-bottom:18px}
.intl-dur{display:flex;align-items:center;gap:11px;background:#111216;border:1.5px solid rgba(255,255,255,.1);border-radius:12px;padding:12px 15px;cursor:pointer;transition:.15s;color:#cfd2d8;font-size:14px}
.intl-dur:hover{border-color:rgba(240,43,53,.5)}
.intl-dur:has(input:checked){border-color:#f02b35;background:rgba(240,43,53,.1);box-shadow:0 0 18px rgba(240,43,53,.2)}
.intl-dur input{width:18px;height:18px;flex:0 0 auto;accent-color:#f02b35;cursor:pointer;margin:0}
.intl-dur .intl-dur-label{flex:1}
.intl-dur .intl-dur-label em{font-style:normal;color:#e6c667;font-size:12px;margin-left:6px}
.intl-dur b{color:#fff;font-size:15px;font-weight:800;direction:ltr}
.intl-modal-pay{margin-top:2px}

/* V213 — pre-existing members/packages: keep entitlement records without polluting current accounting. */
.preexisting-package-option{
  margin-top:10px;padding:11px 12px;border:1px solid rgba(64,190,122,.34);border-radius:12px;
  background:linear-gradient(180deg,rgba(37,128,80,.10),rgba(14,18,16,.45));
}
.preexisting-package-option label{display:flex;align-items:center;gap:9px;font-size:13px;font-weight:800;color:var(--text)}
.preexisting-package-option small{display:block;margin-top:6px;color:var(--muted);font-size:11.5px;line-height:1.7}
.preexisting-member-badge,.preexisting-order-note{
  display:inline-flex;align-items:center;margin-inline-start:7px;padding:3px 7px;border-radius:999px;
  border:1px solid rgba(77,185,121,.3);background:rgba(38,120,75,.12);color:#85d7aa;font-size:9.5px;font-weight:800;white-space:nowrap;
}
.preexisting-order-note{display:flex;width:max-content;margin:4px auto 0}
.action-btn.legacy-action{border-color:rgba(77,185,121,.34);color:#8ed8ad}
tr.is-preexisting-member{background:linear-gradient(90deg,rgba(38,120,75,.035),transparent 55%)}

/* V221 — navigation/viewport stability: root cause fixed in navigateToSection; keep layout neutral */
html,body{overflow-x:hidden}
html{scroll-padding-top:0}
body.public-home{overflow-x:hidden}

/* V221 public section alignment: overlay navbar is not fixed below hero */
body.public-home>.container,
body.public-home>.embedded-concept,
body.public-home>#transformation-stories{scroll-margin-top:0}
@media(max-width:720px){
  .redesign-v60>.container{padding-top:16px!important}
}

/* V228 — monitoring alerts, history/preferences, unified dropdown polish */
.history-preferences-card{margin:16px 0;padding:16px;border:1px solid rgba(229,9,20,.22);border-radius:18px;background:linear-gradient(145deg,rgba(229,9,20,.055),rgba(255,255,255,.018));box-shadow:inset 0 1px 0 rgba(255,255,255,.03)}
.history-preferences-card.compact{padding:14px;margin:14px 0}.history-preferences-card h3,.history-preferences-card h4{margin:0 0 12px;color:#f6f6f7}.history-preferences-card textarea{min-height:76px}
.preference-check,.monitoring-check{display:flex!important;align-items:center;gap:9px;margin:9px 0!important;padding:10px 12px;border:1px solid rgba(255,255,255,.08);border-radius:12px;background:rgba(0,0,0,.18);font-size:13px!important}
.preference-check input,.monitoring-check input{width:auto!important;min-width:17px;height:17px;accent-color:#e50914}
.contact-notif-badge{align-items:center;justify-content:center;margin-inline-start:7px;padding:2px 6px;border:1px solid rgba(57,217,138,.34);border-radius:999px;background:rgba(57,217,138,.12);color:#78dfa9;font:800 9px/1.4 Arial,sans-serif;direction:ltr}.contact-request-mini{display:inline-grid;place-items:center;width:18px;height:18px;border-radius:50%;border:1px solid rgba(57,217,138,.35);background:rgba(57,217,138,.10);color:#72dfa6;font-size:10px;box-shadow:0 0 12px rgba(57,217,138,.18)}
.monitoring-attention-dot,.monitoring-unread-dot{display:inline-block;width:9px;height:9px;border-radius:50%;background:#ff3543;box-shadow:0 0 0 4px rgba(255,53,67,.13),0 0 15px rgba(255,53,67,.75);animation:snMonitoringPulse 1.8s ease-in-out infinite}
.monitoring-tab-btn{position:relative}.monitoring-tab-btn .monitoring-attention-dot{margin-inline-start:7px;vertical-align:middle}
.athlete-name-with-alert{display:inline-flex;align-items:center;gap:8px}.tile-btn{position:relative}.tile-alert-dot{position:absolute;inset-inline-start:14px;top:12px}
.monitoring-admin-report.is-unread-monitoring{border-color:rgba(255,53,67,.55)!important;box-shadow:0 0 0 1px rgba(255,53,67,.08),0 12px 40px rgba(229,9,20,.08)}
.monitoring-admin-report{position:relative;overflow:visible!important;z-index:1}.monitoring-admin-report:hover{transform:none}.monitoring-admin-report:has(.sn-select.open){z-index:560}.monitoring-admin-report.has-contact-request{border-color:rgba(57,217,138,.38)!important;box-shadow:0 0 0 1px rgba(57,217,138,.06),0 12px 40px rgba(57,217,138,.055)}
.monitoring-report-head{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.contact-request-badge{display:inline-flex;align-items:center;gap:5px;padding:4px 8px;border:1px solid rgba(57,217,138,.34);border-radius:999px;background:rgba(57,217,138,.10);color:#79e3ac;font-size:10px;font-weight:900}.monitoring-save-btn{border-color:rgba(57,217,138,.62)!important;background:linear-gradient(135deg,#15804d,#0f5f3a)!important;color:#fff!important;box-shadow:0 0 18px rgba(57,217,138,.14)}.monitoring-delete-btn{border-color:rgba(255,255,255,.12)!important;background:rgba(255,255,255,.035)!important;color:#b7bac2!important}
.monitoring-report-actions{display:grid;grid-template-columns:minmax(170px,1fr) auto auto auto;gap:8px;align-items:center}.monitoring-report-actions .sn-select{min-width:0}.monitoring-report-actions .btn{white-space:nowrap;padding-inline:12px}
.package-report-row.needs-resubmission{border-color:rgba(255,53,67,.38);background:rgba(229,9,20,.055)}
@keyframes snMonitoringPulse{0%,100%{transform:scale(.9);opacity:.72}50%{transform:scale(1.18);opacity:1}}
.sn-select.open{z-index:320}.modal-panel .sn-select.open{z-index:420}.sn-select-menu{background:linear-gradient(180deg,#191a20,#121318);border-color:rgba(255,72,82,.18);box-shadow:0 22px 55px rgba(0,0,0,.72),0 0 0 1px rgba(255,255,255,.025)}
.sn-select-option:hover,.sn-select-option:focus-visible{background:rgba(229,9,20,.11);color:#fff;outline:none}.sn-select-option.selected{background:linear-gradient(90deg,rgba(229,9,20,.28),rgba(229,9,20,.14));box-shadow:inset 3px 0 0 #ef3944}
@media(max-width:700px){.monitoring-report-actions{grid-template-columns:1fr}.history-preferences-card .row2{grid-template-columns:1fr}.history-preferences-card{padding:12px}.sn-select-option{min-height:44px}}


/* V232 — members list: keep all row actions aligned inside the existing card width. */
#siteMembersCard #customersTable{width:100%;table-layout:fixed}
#customersTable .member-code-col{width:8%}
#customersTable .member-name-col{width:25%}
#customersTable .member-phone-col{width:20%}
#customersTable .member-orders-col{width:14%}
#customersTable .member-actions-col{width:33%;padding-inline:4px}
#customersTable .member-actions-col .action-cluster{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px;width:100%}
#customersTable .member-actions-col .action-btn{width:100%;min-width:0;padding:6px 4px;font-size:9.5px;line-height:1.15;white-space:nowrap}
#customersTable .preexisting-order-note{display:inline-flex;width:auto;margin:0 4px 0 0;padding:2px 5px;vertical-align:middle;font-size:8.5px}
@media(max-width:640px){
  #customersTable .member-code-col{width:12%}
  #customersTable .member-name-col{width:38%}
  #customersTable .member-actions-col{width:50%}
  #customersTable .member-actions-col .action-cluster{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:3px;width:100%}
  #customersTable .member-actions-col .action-btn{padding:5px 2px;font-size:9px}
}

/* V234 — article taxonomy filters, category colors, and admin article browsing */
.sn-select-option.has-option-color{
  border-inline-start:3px solid var(--sn-option-color);
  padding-inline-start:10px;
}
.sn-select-option.has-option-color::before{
  content:"";
  display:inline-block;
  width:7px;
  height:7px;
  margin-inline-end:8px;
  border-radius:999px;
  background:var(--sn-option-color);
  box-shadow:0 0 10px color-mix(in srgb,var(--sn-option-color) 62%,transparent);
  vertical-align:1px;
}
.sn-select-option.has-option-color.selected{
  background:color-mix(in srgb,var(--sn-option-color) 17%,#17181d);
  box-shadow:none;
  color:#fff;
}
.sn-select-option.has-option-color.selected::after{color:var(--sn-option-color)}
.sn-select.has-selected-color .sn-select-trigger{
  border-color:color-mix(in srgb,var(--sn-selected-color) 48%,rgba(255,255,255,.11));
  box-shadow:inset 3px 0 0 var(--sn-selected-color);
}
.sn-select.has-selected-color .sn-select-value::before{
  content:"";
  display:inline-block;
  width:7px;
  height:7px;
  margin-inline-end:8px;
  border-radius:50%;
  background:var(--sn-selected-color);
  box-shadow:0 0 10px color-mix(in srgb,var(--sn-selected-color) 60%,transparent);
  vertical-align:1px;
}
.art-select-shell:has(.sn-select) > svg{display:none}
.art-select-shell .sn-select-trigger{min-height:48px}

.article-admin-toolbar{
  display:grid;
  grid-template-columns:auto minmax(240px,1fr) minmax(180px,260px) auto;
  gap:10px;
  align-items:center;
  margin-bottom:14px;
  padding:12px;
  border:1px solid rgba(255,255,255,.08);
  border-radius:16px;
  background:linear-gradient(145deg,rgba(255,255,255,.035),rgba(255,255,255,.012));
}
.article-admin-toolbar .article-add-btn{white-space:nowrap;margin:0}
.article-admin-search input{margin:0;min-height:48px}
.article-admin-filter{min-width:0}
.article-admin-count{white-space:nowrap;font-size:12px;text-align:center}
.article-admin-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:14px}
.admin-article-card{
  --article-color:var(--accent);
  padding:0!important;
  overflow:hidden;
  display:flex!important;
  flex-direction:column!important;
  border-top:2px solid var(--article-color)!important;
  box-shadow:inset 0 1px 0 color-mix(in srgb,var(--article-color) 28%,transparent),0 16px 42px rgba(0,0,0,.18);
}
.admin-article-media{width:100%;aspect-ratio:1/1;background:var(--card-2);flex-shrink:0}
.admin-article-media img{display:block;width:100%;height:100%;object-fit:cover}
.admin-article-placeholder{width:100%;height:100%;display:flex;align-items:center;justify-content:center;font-size:12px}
.admin-article-copy{padding:12px;display:flex;flex-direction:column;gap:7px;flex:1;min-width:0}
.admin-article-taxonomy{display:flex;gap:6px;align-items:center;flex-wrap:wrap;min-height:25px}
.article-taxonomy-chip,.article-taxonomy-code{
  display:inline-flex;align-items:center;min-height:23px;padding:3px 8px;border:1px solid rgba(255,255,255,.1);border-radius:999px;
  background:rgba(255,255,255,.035);color:#c8cbd2;font-size:10px;font-weight:800;line-height:1.2
}
.article-taxonomy-chip.category{border-color:color-mix(in srgb,var(--chip-color) 50%,transparent);background:color-mix(in srgb,var(--chip-color) 16%,transparent);color:var(--chip-color)}
.article-taxonomy-code{font-family:ui-monospace,SFMono-Regular,Consolas,monospace;letter-spacing:.04em;color:#f1f1f3}
.admin-article-copy h3{font-size:14px;margin:0;line-height:1.55;border-inline-start:2px solid var(--article-color);padding-inline-start:8px}
.article-reference-badge{background:var(--accent);color:#fff;font-size:10px;margin-inline-end:4px}
.admin-article-meta{font-size:11.5px}
.admin-article-actions{display:flex;gap:6px;margin-top:auto;flex-wrap:wrap;padding-top:6px}
.admin-article-actions .btn{font-size:12px;padding:7px 10px}
.admin-article-actions svg{vertical-align:-2px;margin-inline-end:3px}
.article-admin-empty{grid-column:1/-1;text-align:center;padding:30px}

.art-featured,.knowledge-list-card{border-color:color-mix(in srgb,var(--article-color,var(--accent)) 30%,rgba(255,255,255,.08))!important}
.art-featured{box-shadow:inset 0 2px 0 var(--article-color,var(--accent)),0 18px 48px rgba(0,0,0,.18)}
.knowledge-list-card{box-shadow:inset 0 2px 0 var(--article-color,var(--accent))}

@media(max-width:900px){
  .article-admin-toolbar{grid-template-columns:1fr 1fr}
  .article-admin-toolbar .article-add-btn{grid-column:1/-1}
  .article-admin-count{text-align:start}
}
@media(max-width:620px){
  .article-admin-toolbar{grid-template-columns:1fr}
  .article-admin-toolbar .article-add-btn{grid-column:auto;width:100%}
  .article-admin-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
  .admin-article-copy{padding:9px}
  .admin-article-copy h3{font-size:12px}
  .article-taxonomy-chip,.article-taxonomy-code{font-size:8.5px;padding:3px 6px}
  .admin-article-actions{display:grid;grid-template-columns:1fr 1fr}
  .admin-article-actions a{grid-column:1/-1;text-align:center}
}

/* V235 — compact knowledge principles + single-row athlete quick links */
.knowledge-principles{
  flex-wrap:nowrap!important;
  gap:4px!important;
  margin-top:16px!important;
}
.knowledge-principles span{
  flex:0 0 auto;
  white-space:nowrap;
  padding:5px 7px!important;
  font-size:9px!important;
}
.art-category-filter .sn-select-menu{
  max-height:var(--sn-menu-max-height,min(390px,52vh));
}
.athlete-shell .athlete-quick-links{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:5px!important;
  width:100%!important;
  margin:8px 0 16px!important;
}
.athlete-shell .athlete-quick-links a{
  min-width:0!important;
  width:100%!important;
  padding:7px 4px!important;
  font-size:9px!important;
  line-height:1.25!important;
  white-space:nowrap!important;
  text-align:center!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
}
@media(max-width:720px){
  .athlete-shell .athlete-quick-links{
    height:auto!important;
    margin:4px 0 9px!important;
    align-self:stretch!important;
  }
  .athlete-shell .athlete-quick-links a{
    min-width:0!important;
    height:42px!important;
    padding:5px 3px!important;
    font-size:8.5px!important;
  }
}


/* V236 — stable knowledge dropdown geometry + English knowledge layout */
#page-articles .knowledge-hero{position:relative}
#page-articles .knowledge-hero:has(.sn-select.open){overflow:visible!important;z-index:180}
#page-articles .art-category-filter:has(.sn-select.open){position:relative;z-index:190}
#page-articles .art-category-filter .sn-select-menu{overscroll-behavior:contain}
html[dir="ltr"] #page-articles .knowledge-hero{padding-inline:20px}
html[dir="ltr"] #page-articles .knowledge-hero-copy{min-width:0}
html[dir="ltr"] #page-articles .knowledge-hero h2{
  font-size:clamp(30px,2.15vw,40px);
  line-height:1.16;
  letter-spacing:-.025em;
  overflow-wrap:normal;
  word-break:normal;
  hyphens:none;
}
html[dir="ltr"] #page-articles .knowledge-hero-copy>p:not(.eyebrow){font-size:11px;line-height:1.72}
html[dir="ltr"] #page-articles .knowledge-principles{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:5px!important;
  width:100%;
}
html[dir="ltr"] #page-articles .knowledge-principles span{
  min-width:0;
  padding:5px 4px!important;
  font-size:7.5px!important;
  line-height:1.15;
  text-align:center;
  white-space:nowrap;
}
html[dir="ltr"] #page-articles .art-filter-title,
html[dir="ltr"] #page-articles .art-search label{text-align:left}
html[dir="ltr"] #page-articles .art-category-filter .sn-select-trigger,
html[dir="ltr"] #page-articles .art-category-filter .sn-select-option{text-align:left}
@media(min-width:861px) and (max-width:1100px){
  html[dir="ltr"] #page-articles .knowledge-hero h2{font-size:30px}
  html[dir="ltr"] #page-articles .knowledge-hero{padding-inline:15px}
  html[dir="ltr"] #page-articles .knowledge-principles span{font-size:6.8px!important;padding-inline:2px!important}
}
@media(max-width:860px){
  #page-articles .knowledge-hero:has(.sn-select.open){overflow:visible!important}
  html[dir="ltr"] #page-articles .knowledge-hero h2{font-size:clamp(30px,8vw,44px)}
}

/* V237 — reusable athlete progress-photo guide */
.photo-submission-guide{margin:14px 0 16px;padding:14px;border:1px solid rgba(239,65,73,.28);border-radius:18px;background:linear-gradient(145deg,rgba(229,9,20,.055),rgba(255,255,255,.018));overflow:hidden}
.photo-guide-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:12px}.photo-guide-heading h4{margin:0 0 3px;font-size:15px}.photo-guide-heading p{margin:0;color:var(--muted);font-size:11.5px;line-height:1.65}.photo-guide-gender{flex:0 0 auto;padding:5px 9px;border:1px solid rgba(239,65,73,.28);border-radius:999px;color:#ff7078;font-size:10.5px;font-weight:800}
.photo-guide-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.photo-guide-card{min-width:0;display:grid;grid-template-columns:minmax(72px,40%) 1fr;align-items:stretch;border:1px solid var(--border);border-radius:15px;background:rgba(7,8,11,.72);overflow:hidden}.photo-guide-figure{position:relative;min-height:190px;background:#111}.photo-guide-figure img{width:100%;height:100%;display:block;object-fit:cover;object-position:center}.photo-guide-card-main{min-width:0;display:flex;flex-direction:column;justify-content:space-between;padding:10px}.photo-guide-card-head{display:flex;align-items:flex-start;gap:7px}.photo-guide-card-head b{display:block;font-size:12px}.photo-guide-card-head small{display:block;margin-top:3px;color:var(--muted);font-size:9.5px;line-height:1.55}.photo-guide-check{display:grid;place-items:center;width:20px;height:20px;flex:0 0 20px;border-radius:50%;border:1px solid #69df72;color:#69df72;font-size:12px;font-weight:900;box-shadow:0 0 12px rgba(105,223,114,.18)}
.photo-guide-upload{position:relative;display:flex;align-items:center;gap:8px;margin-top:10px;padding:9px;border:1px dashed rgba(239,65,73,.48);border-radius:11px;cursor:pointer;background:rgba(229,9,20,.035);transition:.18s ease}.photo-guide-upload:hover{border-color:#ef4149;background:rgba(229,9,20,.07)}.photo-guide-upload input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer}.photo-guide-upload-icon{display:grid;place-items:center;width:27px;height:27px;flex:0 0 27px;border-radius:8px;background:rgba(239,65,73,.12);color:#ff7078;font-size:16px}.photo-guide-upload-copy{min-width:0}.photo-guide-upload-copy b{display:block;font-size:10px}.photo-guide-upload-copy small{display:block;max-width:100%;margin-top:2px;color:var(--muted);font-size:8.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.photo-guide-female-note,.photo-guide-privacy{margin-top:10px;padding:8px 10px;border-radius:11px;font-size:10.5px;line-height:1.7}.photo-guide-female-note{border:1px solid rgba(239,65,73,.25);background:rgba(229,9,20,.05);color:#ddd}.photo-guide-privacy{color:var(--muted);background:rgba(255,255,255,.018)}
.photo-submission-guide.is-compact .photo-guide-figure{min-height:160px}.photo-submission-guide.is-compact .photo-guide-heading{margin-bottom:9px}.photo-submission-guide.is-compact{padding:11px}
.monitoring-photo-strip{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:10px 0}.monitoring-photo-item{position:relative;aspect-ratio:1/1;border:1px solid var(--border);border-radius:12px;overflow:hidden;background:#090a0d}.monitoring-photo-item img{width:100%;height:100%;object-fit:contain;background:#090a0d}.monitoring-photo-item span{position:absolute;inset:auto 6px 6px auto;padding:3px 6px;border-radius:7px;background:rgba(0,0,0,.72);font-size:9px;color:#fff}
.progress-photo-tabs{display:flex;gap:7px;flex-wrap:wrap;margin-bottom:12px}.progress-photo-tabs button{padding:7px 12px;border:1px solid var(--border);border-radius:10px;background:var(--card-2);color:var(--text);cursor:pointer}.progress-photo-tabs button.active{border-color:rgba(239,65,73,.6);background:rgba(229,9,20,.12);color:#fff}.progress-photo-compare{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:14px}.progress-photo-compare-card{border:1px solid var(--border);border-radius:15px;padding:9px;background:var(--card-2)}.progress-photo-compare-card img{width:100%;aspect-ratio:3/4;object-fit:contain;border-radius:10px;background:#08090c}.progress-photo-compare-card b,.progress-photo-compare-card small{display:block;margin-top:6px}.progress-photo-compare-card small{color:var(--muted);font-size:10px}.progress-photo-timeline{display:flex;gap:10px;overflow-x:auto;padding:4px 1px 8px;scroll-snap-type:x proximity}.progress-photo-timeline-card{flex:0 0 150px;scroll-snap-align:start;border:1px solid var(--border);border-radius:13px;padding:7px;background:var(--card)}.progress-photo-timeline-card img{width:100%;aspect-ratio:3/4;object-fit:contain;border-radius:8px;background:#08090c}.progress-photo-timeline-card small{display:block;margin-top:5px;color:var(--muted);font-size:9.5px}
@media(max-width:760px){.photo-guide-grid{grid-template-columns:1fr}.photo-guide-card{grid-template-columns:115px 1fr}.photo-guide-figure{min-height:230px}.photo-submission-guide.is-compact .photo-guide-figure{min-height:205px}.progress-photo-compare{grid-template-columns:1fr 1fr}.progress-photo-timeline-card{flex-basis:132px}}
@media(max-width:430px){.photo-submission-guide{margin-inline:-3px;padding:9px}.photo-guide-card{grid-template-columns:104px 1fr}.photo-guide-figure{min-height:215px}.photo-guide-heading h4{font-size:13.5px}.photo-guide-heading p{font-size:10px}.progress-photo-compare{gap:7px}.progress-photo-compare-card{padding:6px}}


/* V238 — photo-guide mobile scroll stability + photo review controls */
.photo-submission-guide{
  overflow:visible;
  min-height:min-content;
  contain:none;
}
.photo-guide-grid,.photo-guide-card,.photo-guide-card-main{min-height:0}
#sizeEditModal .modal-panel,
#packageMonitoringModal .modal-panel{
  overflow-y:scroll !important;
  overflow-x:hidden !important;
  -webkit-overflow-scrolling:touch;
  touch-action:pan-y;
  overscroll-behavior-y:contain;
  min-height:0;
  scrollbar-gutter:auto;
}
@media(max-width:520px){
  #sizeEditModal,
  #packageMonitoringModal{
    align-items:flex-end;
    padding:6px;
  }
  #sizeEditModal .modal-panel,
  #packageMonitoringModal .modal-panel{
    height:calc(100dvh - 12px);
    max-height:calc(100dvh - 12px) !important;
    padding-bottom:max(22px,env(safe-area-inset-bottom));
    border-radius:18px 18px 4px 4px !important;
  }
  #sizeEditModal .tile-modal-head,
  #packageMonitoringModal .tile-modal-head{
    top:-14px;
  }
  .photo-submission-guide{overflow:visible!important}
}
.progress-photo-single{display:grid;grid-template-columns:minmax(0,360px);justify-content:center;margin:10px 0 16px}
.progress-photo-card-actions{display:flex;gap:6px;flex-wrap:wrap;margin-top:8px}
.progress-photo-card-actions .btn{flex:1 1 auto;padding:7px 9px;font-size:10.5px;white-space:nowrap}
.progress-photo-reject-btn{border-color:rgba(255,185,70,.45)!important;background:rgba(255,185,70,.08)!important;color:#ffd58a!important}
.progress-photo-delete-btn{border-color:rgba(255,76,89,.45)!important;background:rgba(229,9,20,.10)!important;color:#ff9aa2!important}
.photo-review-alerts{display:grid;gap:8px;margin:0 0 12px}
.photo-review-alert{padding:10px 12px;border:1px solid rgba(255,185,70,.32);border-radius:12px;background:rgba(255,185,70,.06);color:#f4d7a4;font-size:11px;line-height:1.8}
