/* ============================================================================
   Coach Planner — athlete-first weekly board + compact workout modal.
   Mobile-first, dark-premium, single teal accent. No horizontal overflow;
   touch targets >= 44px. Scopes: .cpl-* (planner), .qw-* (quick modal).
   ============================================================================ */
:root { --cpl-accent: var(--brand, #14b8a6); }

/* ── Planner shell ───────────────────────────────────────────────────────── */
.cpl { display: flex; flex-direction: column; gap: 14px; }
.cpl-head { display: flex; flex-direction: column; gap: 10px; }
.cpl-head__athlete { display: flex; flex-direction: column; gap: 4px; }
.cpl-head__lbl { font-size: 11px; font-weight: 700; letter-spacing: .5px; text-transform: uppercase; color: var(--muted); }
.cpl-athlete {
  width: 100%; min-height: 46px; padding: 10px 14px; font-size: 16px; font-weight: 800;
  color: var(--text); background: var(--card); border: 1px solid var(--border); border-radius: 12px;
  -webkit-appearance: none; appearance: none;
  background-image: linear-gradient(45deg, transparent 50%, var(--muted) 50%), linear-gradient(135deg, var(--muted) 50%, transparent 50%);
  background-position: calc(100% - 18px) 50%, calc(100% - 13px) 50%; background-size: 5px 5px, 5px 5px; background-repeat: no-repeat;
}
.cpl-head__nav { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; }
.cpl-week { display: inline-flex; align-items: center; gap: 4px; background: var(--card); border: 1px solid var(--border); border-radius: 12px; padding: 3px; }
.cpl-nav {
  width: 40px; height: 40px; display: grid; place-items: center; font-size: 22px; line-height: 1;
  color: var(--text); background: transparent; border: 0; border-radius: 9px; cursor: pointer;
}
.cpl-nav:hover { background: color-mix(in srgb, var(--cpl-accent) 16%, transparent); }
.cpl-week__lbl { min-height: 40px; padding: 0 10px; display: inline-flex; align-items: center; font-weight: 800; font-size: 14px; color: var(--text); background: transparent; border: 0; cursor: pointer; white-space: nowrap; }
.cpl-views { display: inline-flex; background: var(--card); border: 1px solid var(--border); border-radius: 12px; padding: 3px; }
.cpl-views__btn { min-height: 40px; padding: 0 12px; font-size: 13px; font-weight: 700; color: var(--muted); background: transparent; border: 0; border-radius: 9px; cursor: pointer; }
.cpl-views__btn.is-active { color: #fff; background: var(--cpl-accent); }

/* ── Week grid (vertical day stack) ──────────────────────────────────────── */
.cpl-grid { display: flex; flex-direction: column; gap: 10px; }
.cpl-day { background: var(--card); border: 1px solid var(--border); border-radius: 14px; padding: 10px 12px 12px; }
.cpl-day.is-today { border-color: var(--cpl-accent); box-shadow: inset 0 0 0 1px var(--cpl-accent); }
.cpl-day__hd { display: flex; align-items: baseline; gap: 8px; margin-bottom: 8px; }
.cpl-day__dow { font-size: 12px; font-weight: 800; letter-spacing: 1px; color: var(--muted); }
.cpl-day.is-today .cpl-day__dow { color: var(--cpl-accent); }
.cpl-day__num { font-size: 18px; font-weight: 800; color: var(--text); }
.cpl-day__list { display: flex; flex-direction: column; gap: 8px; }
.cpl-day__list:empty { display: none; }

/* Workout card */
.cpl-wk {
  display: flex; align-items: stretch; gap: 0; background: var(--bg, rgba(255,255,255,.02));
  border: 1px solid var(--border); border-left: 3px solid var(--cpl-accent); border-radius: 10px; overflow: hidden;
}
.cpl-wk__main { flex: 1; min-width: 0; display: flex; align-items: center; gap: 10px; padding: 10px 12px; background: transparent; border: 0; text-align: left; cursor: pointer; color: var(--text); }
.cpl-wk__grip { color: var(--muted); font-size: 14px; flex-shrink: 0; }
.cpl-wk__txt { min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.cpl-wk__title { font-weight: 800; font-size: 14px; color: var(--text); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cpl-wk__sum { font-size: 12px; color: var(--muted); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.cpl-wk__menu { flex-shrink: 0; width: 44px; display: grid; place-items: center; font-size: 20px; color: var(--muted); background: transparent; border: 0; border-left: 1px solid var(--border); cursor: pointer; }
.cpl-wk__menu:hover { color: var(--text); background: color-mix(in srgb, var(--cpl-accent) 10%, transparent); }

/* + Προπόνηση (subtle, per day) */
.cpl-addwk {
  width: 100%; min-height: 40px; margin-top: 8px; display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  font-size: 13px; font-weight: 700; color: var(--cpl-accent); background: transparent;
  border: 1px dashed color-mix(in srgb, var(--cpl-accent) 45%, var(--border)); border-radius: 10px; cursor: pointer;
}
.cpl-addwk:hover { background: color-mix(in srgb, var(--cpl-accent) 10%, transparent); }
.cpl-addwk__plus { font-size: 17px; line-height: 1; }

.cpl-loading { display: grid; place-items: center; padding: 40px 0; }
.cpl-empty { text-align: center; padding: 36px 16px; }
.cpl-empty__t { font-weight: 800; margin: 0 0 4px; }
.cpl-empty__s { color: var(--muted); font-size: 13px; margin: 0 0 14px; }

/* ⋮ menu (in modal) */
.cpl-menu { display: flex; flex-direction: column; gap: 6px; }
.cpl-menu__it { width: 100%; min-height: 46px; padding: 12px 14px; text-align: left; font-size: 15px; font-weight: 600; color: var(--text); background: var(--card); border: 1px solid var(--border); border-radius: 10px; cursor: pointer; }
.cpl-menu__it:hover { border-color: var(--cpl-accent); }
.cpl-menu__it--danger { color: var(--no, #ef4444); }

/* ============================================================================
   Quick workout modal (.qw)
   ============================================================================ */
.qw { display: flex; flex-direction: column; gap: 12px; }
.qw-field { display: flex; flex-direction: column; gap: 4px; flex: 1; min-width: 0; }
.qw-field__lbl { font-size: 11px; font-weight: 700; letter-spacing: .4px; text-transform: uppercase; color: var(--muted); }
.qw-sel, .qw-num {
  width: 100%; min-height: 46px; padding: 10px 12px; font-size: 15px; color: var(--text);
  background: var(--card); border: 1px solid var(--border); border-radius: 10px; -webkit-appearance: none; appearance: none;
}
select.qw-sel {
  background-image: linear-gradient(45deg, transparent 50%, var(--muted) 50%), linear-gradient(135deg, var(--muted) 50%, transparent 50%);
  background-position: calc(100% - 18px) 50%, calc(100% - 13px) 50%; background-size: 5px 5px, 5px 5px; background-repeat: no-repeat; padding-right: 34px;
}
textarea.qw-num { min-height: 72px; resize: vertical; line-height: 1.4; }
.qw-sel:focus, .qw-num:focus { outline: none; border-color: var(--cpl-accent); box-shadow: 0 0 0 3px color-mix(in srgb, var(--cpl-accent) 22%, transparent); }
.qw-be__row { display: flex; gap: 10px; }
.qw-field--sm .qw-num, .qw-field--sm .qw-sel { min-height: 44px; }

.qw-quick { display: flex; gap: 8px; align-items: stretch; }
.qw-quick .qw-num { flex: 1; }
.qw-magic { flex-shrink: 0; display: inline-flex; align-items: center; gap: 6px; padding: 0 14px; min-height: 46px; font-weight: 800; font-size: 14px; color: #fff; background: var(--cpl-accent); border: 0; border-radius: 10px; cursor: pointer; white-space: nowrap; }
.qw-magic:hover { filter: brightness(1.08); }

.qw-seclbl { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; font-size: 12px; font-weight: 800; letter-spacing: .5px; text-transform: uppercase; color: var(--muted); margin-top: 2px; }
.qw-stats { font-size: 12px; font-weight: 700; text-transform: none; letter-spacing: 0; color: var(--cpl-accent); }

.qw-blocks { display: flex; flex-direction: column; gap: 8px; }
.qw-blocks__empty { font-size: 13px; color: var(--muted); text-align: center; padding: 14px; border: 1px dashed var(--border); border-radius: 10px; margin: 0; }
.qw-block { border: 1px solid var(--border); border-radius: 10px; background: var(--card); overflow: hidden; }
.qw-block.is-open { border-color: var(--cpl-accent); }
.qw-block__head { width: 100%; min-height: 48px; display: flex; align-items: center; gap: 10px; padding: 8px 12px; background: transparent; border: 0; cursor: pointer; text-align: left; color: var(--text); }
.qw-block__grip { color: var(--muted); font-size: 13px; }
.qw-block__dot { width: 10px; height: 10px; border-radius: 3px; flex-shrink: 0; }
.qw-block__title { font-weight: 800; font-size: 14px; flex-shrink: 0; }
.qw-block__sum { flex: 1; min-width: 0; font-size: 12px; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; text-align: right; }
.qw-block__chev { color: var(--muted); font-size: 15px; flex-shrink: 0; }

.qw-be { display: flex; flex-direction: column; gap: 10px; padding: 12px; border-top: 1px solid var(--border); background: color-mix(in srgb, var(--cpl-accent) 5%, transparent); }
.qw-be__fields { display: flex; flex-direction: column; gap: 8px; }
.qw-be__actions { display: flex; gap: 8px; justify-content: flex-end; }
.qw-mini { width: 40px; height: 40px; display: grid; place-items: center; font-size: 15px; color: var(--text); background: var(--card); border: 1px solid var(--border); border-radius: 9px; cursor: pointer; }
.qw-mini--danger { color: var(--no, #ef4444); }
.qw-mini:hover { border-color: var(--cpl-accent); }

/* duration / distance segmented */
.qw-seg { display: inline-flex; background: var(--card); border: 1px solid var(--border); border-radius: 10px; padding: 3px; align-self: flex-start; }
.qw-seg--sm { align-self: stretch; }
.qw-seg__btn { flex: 1; min-height: 38px; padding: 0 14px; font-size: 13px; font-weight: 700; color: var(--muted); background: transparent; border: 0; border-radius: 8px; cursor: pointer; }
.qw-seg__btn.is-active { color: #fff; background: var(--cpl-accent); }

/* + Προσθήκη τμήματος + reveal sheet */
.qw-addbtn { width: 100%; min-height: 48px; display: inline-flex; align-items: center; justify-content: center; gap: 8px; font-size: 15px; font-weight: 800; color: var(--cpl-accent); background: transparent; border: 1px dashed color-mix(in srgb, var(--cpl-accent) 50%, var(--border)); border-radius: 10px; cursor: pointer; }
.qw-addbtn:hover { background: color-mix(in srgb, var(--cpl-accent) 10%, transparent); }
.qw-addbtn__chev { font-size: 12px; }
.qw-addsheet { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; padding: 4px 0 2px; }
.qw-addsheet__it { display: flex; align-items: center; gap: 8px; min-height: 46px; padding: 10px 12px; font-size: 14px; font-weight: 600; color: var(--text); background: var(--card); border: 1px solid var(--border); border-radius: 10px; cursor: pointer; text-align: left; }
.qw-addsheet__it:hover { border-color: var(--cpl-accent); }
.qw-addsheet__dot { width: 10px; height: 10px; border-radius: 3px; flex-shrink: 0; }

/* accordions */
.qw-acc { border: 1px solid var(--border); border-radius: 10px; background: var(--card); overflow: hidden; }
.qw-acc__sum { min-height: 48px; display: flex; align-items: center; padding: 0 14px; font-weight: 800; font-size: 14px; cursor: pointer; list-style: none; color: var(--text); }
.qw-acc__sum::-webkit-details-marker { display: none; }
.qw-acc__sum::before { content: '▸'; margin-right: 8px; color: var(--muted); transition: transform .15s; }
.qw-acc[open] .qw-acc__sum::before { transform: rotate(90deg); }
.qw-acc__body { display: flex; flex-direction: column; gap: 10px; padding: 4px 14px 14px; }

/* ── drag & drop (desktop) ───────────────────────────────────────────────── */
.cpl-wk { cursor: grab; }
.cpl-wk.is-dragging { opacity: .45; cursor: grabbing; }
.cpl-day.is-dragover { border-color: var(--cpl-accent); box-shadow: inset 0 0 0 2px var(--cpl-accent); background: color-mix(in srgb, var(--cpl-accent) 8%, transparent); }

/* ── copy-week ───────────────────────────────────────────────────────────── */
.cpl-copyweek { width: 100%; min-height: 46px; display: inline-flex; align-items: center; justify-content: center; gap: 8px; font-size: 14px; font-weight: 700; color: var(--text); background: var(--card); border: 1px solid var(--border); border-radius: 12px; cursor: pointer; }
.cpl-copyweek:hover { border-color: var(--cpl-accent); color: var(--cpl-accent); }
.cpl-copyweek__ic { font-size: 15px; }

/* ── move-day picker ─────────────────────────────────────────────────────── */
.cpl-move { display: flex; flex-direction: column; gap: 12px; }
.cpl-move__lbl { font-size: 13px; color: var(--muted); margin: 0; }
.cpl-move__days { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; }
.cpl-move__day { min-height: 46px; font-size: 13px; font-weight: 700; color: var(--text); background: var(--card); border: 1px solid var(--border); border-radius: 10px; cursor: pointer; }
.cpl-move__day:hover { border-color: var(--cpl-accent); }
.cpl-move__day.is-current { border-color: var(--cpl-accent); color: var(--cpl-accent); }

/* ── training-plan banner ────────────────────────────────────────────────── */
.cpl-plan { width: 100%; min-height: 46px; display: flex; align-items: center; gap: 10px; padding: 10px 14px; font-size: 13px; font-weight: 700; color: var(--muted); background: var(--card); border: 1px solid var(--border); border-radius: 12px; cursor: pointer; text-align: left; margin-bottom: 4px; }
.cpl-plan.is-set { color: var(--text); border-color: color-mix(in srgb, var(--cpl-accent) 40%, var(--border)); }
.cpl-plan:hover { border-color: var(--cpl-accent); }
.cpl-plan__ic { font-size: 16px; }
.cpl-plan__txt { flex: 1; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cpl-plan__chev { color: var(--muted); font-size: 16px; }

/* ── day (solo) ──────────────────────────────────────────────────────────── */
.cpl-day--solo .cpl-day__full { font-size: 13px; color: var(--muted); font-weight: 600; text-transform: capitalize; margin-left: auto; }

/* ── month grid ──────────────────────────────────────────────────────────── */
.cpl-month { display: grid; grid-template-columns: repeat(7, 1fr); gap: 5px; }
.cpl-month__wd { text-align: center; font-size: 11px; font-weight: 800; color: var(--muted); padding: 4px 0; }
.cpl-month__day { min-height: 54px; display: flex; flex-direction: column; align-items: flex-start; gap: 3px; padding: 6px; color: var(--text); background: var(--card); border: 1px solid var(--border); border-radius: 10px; cursor: pointer; }
.cpl-month__day.has-wk { background: color-mix(in srgb, var(--cpl-accent) 14%, var(--card)); }
.cpl-month__day.is-today { border-color: var(--cpl-accent); box-shadow: inset 0 0 0 1px var(--cpl-accent); }
.cpl-month__day:hover { border-color: var(--cpl-accent); }
.cpl-month__num { font-size: 13px; font-weight: 800; }
.cpl-month__dot { font-size: 10px; font-weight: 800; color: #fff; background: var(--cpl-accent); border-radius: 999px; padding: 1px 6px; }

/* ── watch connect bar ───────────────────────────────────────────────────── */
.cpl-connect { display: flex; align-items: center; gap: 10px; padding: 8px 12px; background: color-mix(in srgb, var(--cpl-accent) 9%, var(--card)); border: 1px solid color-mix(in srgb, var(--cpl-accent) 35%, var(--border)); border-radius: 12px; }
.cpl-connect__ic { font-size: 18px; flex-shrink: 0; }
.cpl-connect__txt { flex: 1; min-width: 0; font-size: 12px; color: var(--text); }
.cpl-connect__btn { flex-shrink: 0; min-height: 40px; padding: 0 16px; font-size: 13px; font-weight: 800; color: #fff; background: var(--cpl-accent); border: 0; border-radius: 10px; cursor: pointer; }
.cpl-connect__btn:hover { filter: brightness(1.08); }

/* ── athlete: big «connect your watch» banner (Intervals pilot) ──────────── */
.ap-watch { display: flex; align-items: center; gap: 14px; padding: 16px 18px; margin-bottom: 14px; border-radius: 16px; background: linear-gradient(135deg, color-mix(in srgb, var(--cpl-accent) 22%, var(--card)), color-mix(in srgb, var(--cpl-accent) 8%, var(--card))); border: 1px solid color-mix(in srgb, var(--cpl-accent) 45%, var(--border)); }
.ap-watch__ic { font-size: 30px; flex-shrink: 0; line-height: 1; }
.ap-watch__txt { flex: 1; min-width: 0; }
.ap-watch__title { margin: 0; font-weight: 800; font-size: 15px; color: var(--text); }
.ap-watch__sub { margin: 3px 0 0; font-size: 12px; color: var(--muted); }
.ap-watch__btn { flex-shrink: 0; min-height: 46px; padding: 0 20px; font-size: 14px; font-weight: 800; color: #fff; background: var(--cpl-accent); border: 0; border-radius: 12px; cursor: pointer; white-space: nowrap; }
.ap-watch__btn:hover { filter: brightness(1.08); }
.ap-watch--ok { background: color-mix(in srgb, #22c55e 12%, var(--card)); border-color: color-mix(in srgb, #22c55e 40%, var(--border)); }
@media (max-width: 560px) {
  .ap-watch { flex-wrap: wrap; }
  .ap-watch__btn { width: 100%; }
}

/* very narrow phones (360px and below): keep the add-sheet single column */
@media (max-width: 360px) {
  .qw-addsheet { grid-template-columns: 1fr; }
  .cpl-move__days { grid-template-columns: repeat(3, 1fr); }
  .cpl-head__nav { gap: 8px; }
  .cpl-views__btn { padding: 0 9px; }
  .cpl-connect { flex-wrap: wrap; }
  .cpl-connect__btn { width: 100%; }
}

/* ============================================================================
   Coach Dashboard (Πίνακας) — premium restyle. Replaces the flat bright-blue
   hero + boxy cards with a cohesive dark-glass, teal-accent look. Scoped to
   .cd-dash and loaded last, so it wins the cascade without touching styles.css
   or the association dashboard's shared .ihero.
   ============================================================================ */
/* LAYOUT FIX: force the whole coach dashboard to stack vertically, full-width.
   .cd-dash was display:grid and on wide screens the top strip (hero + KPI cards
   + quick actions) squeezed into one cramped row with clipped labels. Flex
   column makes every section its own full-width row; the KPI/quick/board grids
   keep their own internal columns. */
.cd-dash { display: flex; flex-direction: column; gap: 12px; }
.cd-dash > * { width: 100%; min-width: 0; }

.cd-dash .ihero--coach {
  background:
    radial-gradient(130% 150% at 92% -25%, color-mix(in srgb, var(--cpl-accent) 34%, transparent), transparent 52%),
    radial-gradient(120% 130% at 0% 130%, rgba(59, 130, 246, .12), transparent 55%),
    linear-gradient(140deg, #101c26, #0a1016);
  border: 1px solid rgba(255, 255, 255, .08);
  box-shadow: 0 22px 54px -22px rgba(0, 0, 0, .8), inset 0 1px 0 rgba(255, 255, 255, .07);
}
.cd-dash .ihero--coach .ihero__badge { background: color-mix(in srgb, var(--cpl-accent) 26%, rgba(255, 255, 255, .06)); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--cpl-accent) 45%, transparent); }
.cd-dash .ihero--coach .ihero__kicker { color: var(--cpl-accent); opacity: 1; }

/* KPI cards — glass + colored accent stripe (was flat boxes). */
.cd-dash .cd-kpi {
  position: relative; overflow: hidden;
  padding: 15px 14px 13px; min-height: 88px;
  border: 1px solid var(--border); border-radius: 16px;
  background: color-mix(in srgb, var(--cpl-accent) 5%, var(--card));
  box-shadow: 0 10px 24px -16px rgba(0, 0, 0, .55);
  transition: transform .12s, border-color .15s, box-shadow .15s;
}
.cd-dash .cd-kpi:hover { transform: translateY(-2px); box-shadow: 0 14px 30px -16px rgba(0, 0, 0, .6); }
.cd-dash .cd-kpi::before { content: ''; position: absolute; top: 0; left: 0; bottom: 0; width: 3px; background: var(--cpl-accent); opacity: .85; }
.cd-dash .cd-kpi__ic { width: 26px; height: 26px; }
.cd-dash .cd-kpi__ic svg { width: 20px; height: 20px; }
.cd-dash .cd-kpi__v { font-size: 26px; font-weight: 900; letter-spacing: -.03em; }
.cd-dash .cd-kpi__l { font-size: 10.5px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--muted); }
.cd-dash .cd-kpi--blue::before { background: #3b82f6; }
.cd-dash .cd-kpi--violet::before { background: #8b5cf6; }
.cd-dash .cd-kpi--green::before { background: #22c55e; }
.cd-dash .cd-kpi--amber::before { background: #f59e0b; }

/* Quick actions — glass tiles with a teal icon chip (were empty flat boxes). */
.cd-dash .cd-quick { gap: 10px; grid-template-columns: repeat(3, 1fr); }
.cd-dash .cd-quick__btn {
  gap: 10px; padding: 16px 8px; min-height: 92px;
  border: 1px solid var(--border); border-radius: 16px;
  background: color-mix(in srgb, var(--cpl-accent) 4%, var(--card));
  box-shadow: 0 10px 24px -18px rgba(0, 0, 0, .55);
  transition: transform .12s, border-color .15s, box-shadow .15s;
}
.cd-dash .cd-quick__btn:hover { border-color: var(--cpl-accent); transform: translateY(-2px); box-shadow: 0 14px 30px -16px rgba(0, 0, 0, .6); }
.cd-dash .cd-quick__ic { width: 44px; height: 44px; border-radius: 14px; display: grid; place-items: center; background: color-mix(in srgb, var(--cpl-accent) 16%, transparent); color: var(--cpl-accent); }
.cd-dash .cd-quick__ic svg { width: 21px; height: 21px; }
.cd-dash .cd-quick__lbl { font-size: 12px; font-weight: 800; }

/* Widget cards — glass surfaces + refined headers. */
.cd-dash .cd-w { border: 1px solid var(--border); border-radius: 18px; background: var(--card); box-shadow: 0 12px 28px -20px rgba(0, 0, 0, .5); }
.cd-dash .cd-w__title { font-weight: 800; letter-spacing: -.01em; }
.cd-dash .cd-live { color: #22c55e; font-weight: 800; font-size: 11px; }
.cd-dash .cd-notif__row { border-radius: 10px; transition: background .12s; }
.cd-dash .cd-notif__row:hover { background: color-mix(in srgb, var(--cpl-accent) 8%, transparent); }
.cd-dash .cd-notif__cnt.has { background: var(--cpl-accent); color: #fff; }

/* ── Roster Status Board (the coach's real home) ─────────────────────────── */
.cd-dash .cd-w__count { font-size: 12px; font-weight: 800; color: var(--muted); background: color-mix(in srgb, var(--cpl-accent) 12%, transparent); border-radius: 999px; padding: 2px 10px; }
.cd-dash .cd-roster { display: flex; flex-direction: column; gap: 8px; }
.cd-rost { display: flex; align-items: stretch; border: 1px solid var(--border); border-left: 3px solid var(--muted); border-radius: 12px; background: var(--bg, rgba(255, 255, 255, .02)); overflow: hidden; }
.cd-rost--green { border-left-color: #22c55e; }
.cd-rost--teal { border-left-color: var(--cpl-accent); }
.cd-rost--amber { border-left-color: #f59e0b; }
.cd-rost--rose { border-left-color: #f43f5e; }
.cd-rost--muted { border-left-color: var(--muted); }
.cd-rost__main { flex: 1; min-width: 0; display: flex; align-items: center; gap: 12px; padding: 10px 12px; background: transparent; border: 0; text-align: left; cursor: pointer; color: var(--text); }
.cd-rost__av { width: 38px; height: 38px; flex: none; display: grid; place-items: center; border-radius: 11px; font-weight: 800; color: #fff; background: color-mix(in srgb, var(--cpl-accent) 55%, #334155); }
.cd-rost__id { min-width: 0; flex: 1; }
.cd-rost__name { margin: 0 0 4px; font-weight: 800; font-size: 14px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cd-rost__chips { display: flex; flex-wrap: wrap; gap: 4px 6px; }
.cd-rost__chip { font-size: 11px; font-weight: 700; color: var(--muted); background: color-mix(in srgb, var(--muted) 12%, transparent); border-radius: 6px; padding: 1px 6px; white-space: nowrap; }
.cd-rost__chip--done { color: #22c55e; background: color-mix(in srgb, #22c55e 14%, transparent); }
.cd-rost__chip--pend { color: #f59e0b; background: color-mix(in srgb, #f59e0b 14%, transparent); }
.cd-rost__chip--miss { color: #f43f5e; background: color-mix(in srgb, #f43f5e 16%, transparent); }
.cd-rost__chip--watch { color: var(--cpl-accent); background: color-mix(in srgb, var(--cpl-accent) 14%, transparent); }
.cd-rost__status { flex: none; align-self: center; font-size: 11px; font-weight: 800; padding: 3px 9px; border-radius: 999px; white-space: nowrap; }
.cd-rost__status--green { color: #22c55e; background: color-mix(in srgb, #22c55e 14%, transparent); }
.cd-rost__status--teal { color: var(--cpl-accent); background: color-mix(in srgb, var(--cpl-accent) 14%, transparent); }
.cd-rost__status--amber { color: #f59e0b; background: color-mix(in srgb, #f59e0b 14%, transparent); }
.cd-rost__status--rose { color: #f43f5e; background: color-mix(in srgb, #f43f5e 16%, transparent); }
.cd-rost__status--muted { color: var(--muted); background: color-mix(in srgb, var(--muted) 12%, transparent); }
.cd-rost__acts { flex: none; display: flex; align-items: center; gap: 4px; padding: 0 8px; border-left: 1px solid var(--border); }
.cd-rost__act { width: 38px; height: 38px; display: grid; place-items: center; font-size: 16px; color: var(--muted); background: transparent; border: 0; border-radius: 9px; cursor: pointer; }
.cd-rost__act:hover { background: color-mix(in srgb, var(--cpl-accent) 12%, transparent); color: var(--text); }
.cd-rost__act--primary { color: var(--cpl-accent); font-size: 20px; font-weight: 800; }

/* Attention zone */
.cd-attn { border: 1px solid color-mix(in srgb, #f43f5e 30%, var(--border)); border-radius: 16px; background: color-mix(in srgb, #f43f5e 6%, var(--card)); padding: 12px 14px; margin-bottom: 14px; }
.cd-attn__head { display: flex; align-items: center; gap: 8px; margin-bottom: 8px; }
.cd-attn__title { margin: 0; font-size: 14px; font-weight: 800; }
.cd-attn__cnt { font-size: 11px; font-weight: 800; color: #fff; background: #f43f5e; border-radius: 999px; padding: 1px 8px; }
.cd-attn__list { display: flex; flex-direction: column; gap: 4px; }
.cd-attn__row { display: flex; align-items: center; gap: 10px; padding: 8px 10px; background: transparent; border: 0; border-radius: 9px; cursor: pointer; text-align: left; color: var(--text); }
.cd-attn__row:hover { background: color-mix(in srgb, #f43f5e 8%, transparent); }
.cd-attn__dot { width: 8px; height: 8px; border-radius: 50%; flex: none; background: var(--muted); }
.cd-attn__dot--rose { background: #f43f5e; }
.cd-attn__dot--amber { background: #f59e0b; }
.cd-attn__dot--muted { background: var(--muted); }
.cd-attn__name { font-weight: 700; font-size: 13px; }
.cd-attn__why { flex: 1; min-width: 0; font-size: 12px; color: var(--muted); }
.cd-attn__go { color: var(--muted); font-size: 16px; }

/* Empty roster */
.cd-dash .cd-empty { text-align: center; padding: 28px 16px; }
.cd-dash .cd-empty__ic { font-size: 34px; }
.cd-dash .cd-empty__t { font-weight: 800; margin: 8px 0 4px; }
.cd-dash .cd-empty__s { color: var(--muted); font-size: 13px; margin: 0 0 14px; }
.cd-dash .cd-empty__btns { display: flex; gap: 8px; justify-content: center; flex-wrap: wrap; }

@media (max-width: 480px) {
  .cd-rost__main { flex-wrap: wrap; }
  .cd-rost__status { order: 3; margin-left: 50px; }
}

/* ===== Coach Command Center (Performance OS) — ccx-* ===== */
.ccx { display: flex; flex-direction: column; gap: 14px; padding-bottom: 24px; }
.ccx-skel__bar { height: 74px; border-radius: 16px; background: var(--surface-2, #14181f); }
.ccx-skel__grid { height: 220px; margin-top: 12px; border-radius: 16px; background: var(--surface-2, #14181f); }
.ccx-team { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap;
  padding: 16px 18px; border-radius: 16px; background: linear-gradient(180deg, rgba(20,26,34,.9), rgba(12,16,22,.9));
  border: 1px solid var(--border, #232a33); }
.ccx-team__top { display: flex; align-items: baseline; gap: 8px; }
.ccx-team__n { font-size: 2rem; font-weight: 800; letter-spacing: -.02em; }
.ccx-team__lbl { font-size: .72rem; letter-spacing: .12em; color: var(--muted, #8b95a3); }
.ccx-team__pills { display: flex; gap: 8px; flex-wrap: wrap; }
.ccx-pill { display: inline-flex; align-items: center; gap: 6px; padding: 6px 10px; border-radius: 999px;
  background: rgba(255,255,255,.03); border: 1px solid var(--border, #232a33); font-size: .78rem; }
.ccx-pill strong { font-size: .95rem; }
.ccx-pill__lbl { font-size: .62rem; letter-spacing: .1em; color: var(--muted, #8b95a3); }
.ccx-pill--ready { border-color: rgba(34,197,94,.35); }
.ccx-pill--attention { border-color: rgba(245,158,11,.35); }
.ccx-pill--risk { border-color: rgba(239,68,68,.4); }
.ccx-filters { display: flex; gap: 8px; overflow-x: auto; padding-bottom: 2px; -webkit-overflow-scrolling: touch; }
.ccx-chip { flex: 0 0 auto; padding: 7px 13px; border-radius: 999px; font-size: .72rem; letter-spacing: .06em;
  background: transparent; border: 1px solid var(--border, #232a33); color: var(--muted, #8b95a3); cursor: pointer; }
.ccx-chip.is-on { background: rgba(255,255,255,.06); color: var(--text, #e7ecf2); border-color: rgba(255,255,255,.18); }
.ccx-attn { display: flex; flex-direction: column; gap: 8px; }
.ccx-attn__h { margin: 2px 0; font-size: .74rem; letter-spacing: .1em; color: var(--muted, #8b95a3); font-weight: 700; }
.ccx-alert { display: flex; gap: 10px; text-align: left; width: 100%; padding: 10px 12px; border-radius: 12px;
  background: var(--surface, #10141a); border: 1px solid var(--border, #232a33); cursor: pointer; }
.ccx-alert__bar { flex: 0 0 3px; border-radius: 3px; background: var(--muted, #8b95a3); }
.ccx-alert--high .ccx-alert__bar { background: #ef4444; }
.ccx-alert--medium .ccx-alert__bar { background: #f59e0b; }
.ccx-alert--low .ccx-alert__bar { background: #38bdf8; }
.ccx-alert__t { margin: 0; font-weight: 700; font-size: .86rem; }
.ccx-alert__x { margin: 2px 0 0; font-size: .78rem; color: var(--muted, #8b95a3); }
.ccx-alert__a { margin: 3px 0 0; font-size: .76rem; color: #38bdf8; }
.ccx-board { display: grid; grid-template-columns: 1fr; gap: 10px; }
.ccx-card { display: flex; flex-direction: column; gap: 10px; text-align: left; width: 100%;
  padding: 14px; border-radius: 14px; background: var(--surface, #10141a); border: 1px solid var(--border, #232a33); cursor: pointer; }
.ccx-card--risk { border-color: rgba(239,68,68,.35); }
.ccx-card--attention { border-color: rgba(245,158,11,.28); }
.ccx-card__head { display: flex; align-items: center; gap: 12px; }
.ccx-card__av { flex: 0 0 40px; width: 40px; height: 40px; display: grid; place-items: center; border-radius: 12px;
  background: rgba(255,255,255,.05); font-weight: 800; font-size: .85rem; }
.ccx-card__id { flex: 1 1 auto; min-width: 0; }
.ccx-card__name { margin: 0; font-weight: 700; font-size: .95rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ccx-card__st { margin: 2px 0 0; font-size: .72rem; color: var(--muted, #8b95a3); }
.ccx-card__score { flex: 0 0 auto; text-align: center; }
.ccx-card__scoreN { display: block; font-size: 1.5rem; font-weight: 800; line-height: 1; }
.ccx-card__scoreL { font-size: .56rem; letter-spacing: .12em; color: var(--muted, #8b95a3); }
.ccx-card__metrics { display: grid; grid-template-columns: repeat(4, 1fr); gap: 6px; }
.ccx-mchip { display: flex; flex-direction: column; gap: 1px; padding: 7px 8px; border-radius: 10px;
  background: rgba(255,255,255,.02); border: 1px solid var(--border, #232a33); }
.ccx-mchip--warn { border-color: rgba(245,158,11,.4); }
.ccx-mchip__l { font-size: .6rem; letter-spacing: .06em; color: var(--muted, #8b95a3); }
.ccx-mchip__v { font-size: .95rem; font-weight: 700; }
.ccx-mchip__s { font-size: .62rem; color: var(--muted, #8b95a3); }
.ccx-card__why { margin: 0; font-size: .76rem; color: var(--muted, #8b95a3); }
.ccx-empty { padding: 22px 16px; text-align: center; border-radius: 14px; border: 1px dashed var(--border, #232a33); }
.ccx-empty__t { margin: 0; font-weight: 700; }
.ccx-empty__s { margin: 4px 0 0; font-size: .82rem; color: var(--muted, #8b95a3); }
@media (min-width: 780px) {
  .ccx-board { grid-template-columns: 1fr 1fr; }
}

/* ===== Autopilot card (Performance OS Phase 2) — cad__ap* ===== */
.cad__apcard { margin-top: 6px; padding: 14px; border-radius: 14px; border: 1px solid var(--border, #232a33);
  background: var(--surface, #10141a); display: flex; flex-direction: column; gap: 6px; }
.cad__apcard--modify { border-color: rgba(245,158,11,.4); }
.cad__apcard--keep { border-color: rgba(34,197,94,.3); }
.cad__apPlanned { margin: 0; font-weight: 700; }
.cad__apReady { margin: 0; }
.cad__apReason { margin: 2px 0 0; font-size: .9rem; }
.cad__apEv { margin: 0; }
.cad__apSuggest { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-top: 6px;
  padding: 8px 10px; border-radius: 10px; background: rgba(245,158,11,.08); }
.cad__apSuggestL { font-size: .6rem; letter-spacing: .12em; color: var(--muted, #8b95a3); }
.cad__apActions { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 8px; }
.cad__apOk { margin: 4px 0 0; color: #22c55e; }
.cad__apDone { margin: 8px 0 0; color: var(--muted, #8b95a3); }

/* ===== Race Digital Twin (Performance OS Phase 3) — twin__* ===== */
.twin { display: flex; flex-direction: column; gap: 14px; padding-bottom: 24px; }
.twin__head { display: flex; flex-direction: column; gap: 2px; }
.twin__h { margin: 0; font-size: 1.3rem; font-weight: 800; }
.twin__pickWrap { display: flex; flex-direction: column; gap: 4px; }
.twin__pick { width: 100%; }
.twin__body { display: flex; flex-direction: column; gap: 14px; }
.twin__pred { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap;
  padding: 18px; border-radius: 16px; border: 1px solid rgba(56,189,248,.3);
  background: linear-gradient(180deg, rgba(20,26,34,.9), rgba(12,16,22,.9)); }
.twin__predN { display: block; font-size: 2.2rem; font-weight: 800; letter-spacing: -.02em; line-height: 1; }
.twin__predL { display: block; margin-top: 4px; font-size: .78rem; color: var(--muted, #8b95a3); }
.twin__predMeta { display: flex; gap: 6px; flex-wrap: wrap; }
.twin__chip { padding: 5px 10px; border-radius: 999px; font-size: .74rem;
  background: rgba(255,255,255,.05); border: 1px solid var(--border, #232a33); }
.twin__sec { display: flex; flex-direction: column; gap: 8px; }
.twin__secH { margin: 0; font-size: .78rem; letter-spacing: .1em; color: var(--muted, #8b95a3); font-weight: 700; }
.twin__elev { overflow-x: auto; }
.twin__elev svg { max-width: 100%; height: auto; }
.twin__strat { display: flex; flex-direction: column; gap: 8px; }
.twin__stratRow { display: grid; grid-template-columns: 80px 1fr 34px; align-items: center; gap: 10px; }
.twin__stratL { font-size: .82rem; color: var(--muted, #8b95a3); }
.twin__stratBar { height: 8px; border-radius: 999px; background: rgba(255,255,255,.06); overflow: hidden; }
.twin__stratFill { display: block; height: 100%; border-radius: 999px; background: linear-gradient(90deg, #38bdf8, #22c55e); }
.twin__stratV { font-size: .85rem; font-weight: 700; text-align: right; }
.twin__segs { display: flex; flex-direction: column; gap: 8px; }
.twin__seg { padding: 12px; border-radius: 12px; background: var(--surface, #10141a); border: 1px solid var(--border, #232a33); border-left-width: 3px; }
.twin__seg--climb, .twin__seg--steep_climb { border-left-color: #ef4444; }
.twin__seg--descent, .twin__seg--technical_descent { border-left-color: #38bdf8; }
.twin__seg--flat, .twin__seg--rolling { border-left-color: #8b95a3; }
.twin__seg--final_push { border-left-color: #f59e0b; }
.twin__segTop { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 8px; }
.twin__segT { font-weight: 800; font-size: .8rem; letter-spacing: .06em; }
.twin__segGrid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px; }
.twin__cell { display: flex; flex-direction: column; gap: 1px; }
.twin__cellL { font-size: .6rem; letter-spacing: .05em; color: var(--muted, #8b95a3); }
.twin__cellV { font-size: .9rem; font-weight: 700; }
.twin__segCum { margin: 8px 0 0; }
@media (min-width: 780px) {
  .twin__segGrid { grid-template-columns: repeat(6, 1fr); }
}

/* ===== Ask OrgHub (Performance OS Phase 4) — ask__* ===== */
.ask { display: flex; flex-direction: column; gap: 10px; padding: 14px; border-radius: 16px;
  background: var(--surface, #10141a); border: 1px solid var(--border, #232a33); }
.ask__head { display: flex; align-items: baseline; gap: 8px; }
.ask__title { font-weight: 800; }
.ask__chips { display: flex; gap: 6px; flex-wrap: wrap; }
.ask__chip { padding: 6px 11px; border-radius: 999px; font-size: .74rem; text-align: left;
  background: rgba(255,255,255,.03); border: 1px solid var(--border, #232a33); color: var(--text, #e7ecf2); cursor: pointer; }
.ask__chip:hover { border-color: rgba(56,189,248,.4); }
.ask__row { display: flex; gap: 8px; }
.ask__input { flex: 1 1 auto; }
.ask__host:empty { display: none; }
.ask__ans { display: flex; flex-direction: column; gap: 6px; margin-top: 4px; padding: 12px;
  border-radius: 12px; background: rgba(56,189,248,.05); border: 1px solid rgba(56,189,248,.2); }
.ask__q { margin: 0; font-style: italic; color: var(--muted, #8b95a3); font-size: .82rem; }
.ask__answer { margin: 0; font-weight: 700; font-size: .96rem; }
.ask__ev { display: flex; flex-direction: column; gap: 4px; }
.ask__lbl { font-size: .58rem; letter-spacing: .12em; color: var(--muted, #8b95a3); }
.ask__evList { display: flex; flex-wrap: wrap; gap: 5px; }
.ask__evItem { padding: 3px 8px; border-radius: 8px; font-size: .74rem;
  background: rgba(255,255,255,.04); border: 1px solid var(--border, #232a33); }
.ask__interp { margin: 0; font-size: .82rem; color: var(--muted, #8b95a3); }
.ask__action { margin: 0; font-size: .84rem; color: #38bdf8; font-weight: 600; }
.ask__conf { align-self: flex-start; font-size: .6rem; letter-spacing: .1em; padding: 3px 8px; border-radius: 999px;
  border: 1px solid var(--border, #232a33); color: var(--muted, #8b95a3); }
.ask__conf--high { color: #22c55e; border-color: rgba(34,197,94,.4); }
.ask__conf--medium { color: #f59e0b; border-color: rgba(245,158,11,.4); }
.ask__conf--low { color: #8b95a3; }

/* ===== Race Week (Performance OS Phase 5) — rw__* ===== */
.rw { display: flex; flex-direction: column; gap: 8px; padding: 16px; border-radius: 16px;
  border: 1px solid rgba(245,158,11,.35); background: linear-gradient(180deg, rgba(30,22,10,.6), rgba(12,16,22,.9)); }
.rw--race_morning { border-color: rgba(34,197,94,.4); }
.rw--post_race { border-color: rgba(56,189,248,.35); }
.rw__top { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.rw__phase { font-size: .72rem; font-weight: 800; letter-spacing: .12em; color: #f59e0b; }
.rw--race_morning .rw__phase { color: #22c55e; }
.rw__cd { font-size: .9rem; font-weight: 800; }
.rw__race { margin: 0; font-weight: 700; }
.rw__morning { display: flex; flex-direction: column; align-items: flex-start; gap: 2px; margin-top: 4px; }
.rw__ready { font-size: .66rem; letter-spacing: .14em; color: #22c55e; font-weight: 800; }
.rw__readyN { font-size: 2.4rem; font-weight: 800; line-height: 1; }
.rw__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; margin-top: 4px; }
.rw__stat { display: flex; flex-direction: column; gap: 1px; padding: 8px; border-radius: 10px;
  background: rgba(255,255,255,.03); border: 1px solid var(--border, #232a33); }
.rw__statV { font-size: 1.1rem; font-weight: 800; }
.rw__statL { font-size: .58rem; letter-spacing: .04em; color: var(--muted, #8b95a3); }
.rw__taper { margin: 4px 0 0; }

/* ===== Performance Network (Performance OS Phase 6) — net__* ===== */
.net { display: flex; flex-direction: column; gap: 8px; padding: 14px; border-radius: 16px;
  background: var(--surface, #10141a); border: 1px solid var(--border, #232a33); }
.net__head { display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap; }
.net__title { font-weight: 800; }
.net__rows { display: flex; flex-direction: column; gap: 6px; }
.net__row { display: flex; align-items: center; justify-content: space-between; gap: 8px;
  padding: 10px 12px; border-radius: 12px; background: rgba(255,255,255,.02); border: 1px solid var(--border, #232a33); }
.net__lbl { font-weight: 700; font-size: .86rem; }
.net__my { font-weight: 400; }
.net__pct strong { color: #22c55e; }
.net__own { margin: 2px 0 0; }
