/* ============================================================
   tier.css — styles for the pricing & tutoring designs
   ============================================================ */

/* ─── Shared product-page shell (no IdeaShell wrapper for these) ─── */
.tier-screen {
  width: 100%; min-height: 100%;
  background: var(--adv-bg);
  font-family: 'DM Sans', system-ui, sans-serif;
  color: var(--adv-ink);
  overflow: hidden;
}
.tier-screen * { box-sizing: border-box; }

/* ============================================================
   1 · Pricing page
   ============================================================ */
.tp-wrap {
  padding: 0;
  display: grid;
  grid-template-rows: auto auto auto auto auto;
  background: var(--adv-bg);
  height: 100%;
  overflow: auto;
}

/* Hero */
.tp-hero {
  padding: 36px 48px 28px;
  background:
    radial-gradient(circle at 90% 20%, rgba(214,168,95,0.16), transparent 38%),
    radial-gradient(circle at 10% 90%, rgba(196,123,138,0.12), transparent 40%),
    var(--adv-panel);
  border-bottom: 1.5px solid var(--adv-rule);
  text-align: center;
}
.tp-eye {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 6px 14px;
  background: var(--adv-ink);
  color: var(--adv-gold);
  border-radius: 99px;
  font-family: 'Outfit', sans-serif;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 2px;
  text-transform: uppercase;
  margin-bottom: 18px;
  white-space: nowrap;
}
.tp-eye .ic { width: 13px; height: 13px; }
.tp-hero h1 {
  font-family: 'Outfit', sans-serif;
  font-size: 52px;
  font-weight: 800;
  margin: 0;
  letter-spacing: -0.03em;
  line-height: 1.0;
  color: var(--adv-ink);
}
.tp-hero h1 em { font-style: italic; color: var(--adv-rose-deep); }
.tp-hero-sub {
  margin: 14px auto 0;
  font-size: 16px;
  color: var(--adv-ink-soft);
  max-width: 640px;
  line-height: 1.5;
}
.tp-trust {
  margin: 22px auto 0;
  display: inline-flex;
  align-items: center;
  gap: 18px;
  padding: 9px 18px;
  background: var(--adv-soft);
  border: 1.5px solid var(--adv-rule);
  border-radius: 99px;
  font-size: 12px;
  color: var(--adv-ink-soft);
  font-weight: 600;
}
.tp-trust strong { color: var(--adv-ink); font-weight: 700; }
.tp-trust .ic { width: 13px; height: 13px; color: var(--adv-gold-deep); }

/* Bill cycle toggle */
.tp-toggle-row {
  display: flex;
  justify-content: center;
  padding: 24px 0 6px;
}
.tp-toggle {
  display: inline-flex;
  background: var(--adv-soft);
  border: 1.5px solid var(--adv-rule);
  border-radius: 99px;
  padding: 4px;
  position: relative;
}
.tp-toggle-opt {
  padding: 9px 22px;
  border: none; background: transparent;
  border-radius: 99px;
  font-family: 'Outfit', sans-serif;
  font-size: 13px;
  font-weight: 700;
  color: var(--adv-ink-soft);
  cursor: pointer;
  display: inline-flex; align-items: center; gap: 8px;
}
.tp-toggle-opt.active {
  background: var(--adv-ink);
  color: #fff;
  box-shadow: 0 2px 0 rgba(0,0,0,0.08);
}
.tp-toggle-opt.active small {
  color: var(--adv-gold);
}
.tp-toggle-opt small {
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 1.2px;
  color: var(--adv-gold-deep);
}

/* Tier card row */
.tp-tiers {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 14px;
  padding: 22px 48px 28px;
}
.tp-tier {
  background: var(--adv-panel);
  border: 1.5px solid var(--adv-rule);
  border-radius: var(--adv-r-lg);
  padding: 22px 22px 20px;
  display: flex; flex-direction: column;
  position: relative;
  box-shadow: var(--adv-shadow);
}
.tp-tier.featured {
  background: var(--adv-ink);
  color: #fff;
  border-color: var(--adv-ink);
  box-shadow: 0 8px 22px rgba(45,49,66,0.28);
  transform: translateY(-6px);
}
.tp-tier.featured .tp-tier-name { color: #fff; }
.tp-tier.featured .tp-tier-sub  { color: rgba(255,255,255,0.65); }
.tp-tier.featured .tp-tier-price { color: var(--adv-gold); }
.tp-tier.featured .tp-tier-price small { color: rgba(255,255,255,0.55); }
.tp-tier.featured .tp-tier-feat { color: rgba(255,255,255,0.9); }
.tp-tier.featured .tp-tier-feat::before { color: var(--adv-gold); }
.tp-tier.featured .tp-tier-cta { background: var(--adv-gold); color: var(--adv-ink); }

.tp-recommend {
  position: absolute;
  top: -12px; left: 50%; transform: translateX(-50%);
  padding: 5px 14px;
  background: var(--adv-gold);
  color: var(--adv-ink);
  border-radius: 99px;
  font-family: 'Outfit', sans-serif;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 2px;
  white-space: nowrap;
  box-shadow: 0 4px 10px rgba(0,0,0,0.12);
}

.tp-tier-name {
  font-family: 'Outfit', sans-serif;
  font-size: 18px;
  font-weight: 800;
  color: var(--adv-ink);
  letter-spacing: -0.01em;
}
.tp-tier-sub {
  font-size: 11.5px;
  color: var(--adv-muted);
  font-weight: 600;
  margin-top: 4px;
  letter-spacing: 0.2px;
}

.tp-tier-price {
  margin: 18px 0 6px;
  font-family: 'Outfit', sans-serif;
  color: var(--adv-ink);
  line-height: 1;
  display: flex; align-items: baseline; gap: 4px;
}
.tp-tier-price strong {
  font-size: 38px;
  font-weight: 800;
  letter-spacing: -0.03em;
  color: inherit;
}
.tp-tier-price em {
  font-style: normal;
  font-size: 13px;
  font-weight: 700;
  color: var(--adv-muted);
  letter-spacing: 0.2px;
}
.tp-tier-price small {
  display: block;
  font-size: 10.5px;
  font-weight: 700;
  color: var(--adv-muted);
  letter-spacing: 0.4px;
  font-family: 'DM Mono', monospace;
}
.tp-tier-price-row { display: flex; align-items: baseline; gap: 6px; }
.tp-tier-price-alt {
  font-size: 11.5px;
  color: var(--adv-muted);
  font-weight: 600;
  margin-top: 2px;
  letter-spacing: 0.2px;
}

.tp-tier-feats {
  margin: 18px 0 18px;
  padding: 0;
  list-style: none;
  display: flex; flex-direction: column; gap: 7px;
  flex: 1;
}
.tp-tier-feat {
  position: relative;
  padding-left: 22px;
  font-size: 12.5px;
  color: var(--adv-ink-soft);
  line-height: 1.45;
  font-weight: 500;
}
.tp-tier-feat::before {
  content: '✓';
  position: absolute; left: 0; top: 0;
  font-family: 'Outfit', sans-serif;
  font-weight: 800;
  font-size: 14px;
  color: var(--adv-green);
}
.tp-tier-feat.off { opacity: 0.45; }
.tp-tier-feat.off::before { content: '–'; color: var(--adv-muted); }
.tp-tier-feat strong { color: var(--adv-ink); font-weight: 700; }
.tp-tier.featured .tp-tier-feat strong { color: #fff; }

.tp-tier-cta {
  padding: 11px 16px;
  background: var(--adv-rose);
  color: #fff;
  border: none;
  border-radius: var(--adv-r-sm);
  font-family: 'Outfit', sans-serif;
  font-size: 13.5px;
  font-weight: 800;
  letter-spacing: 0.4px;
  cursor: pointer;
  box-shadow: 0 2px 0 var(--adv-rose-deep);
}
.tp-tier-cta.ghost {
  background: transparent;
  color: var(--adv-ink);
  border: 1.5px solid var(--adv-rule);
  box-shadow: none;
}

/* Comparison matrix */
.tp-matrix {
  margin: 8px 48px 30px;
  background: var(--adv-panel);
  border: 1.5px solid var(--adv-rule);
  border-radius: var(--adv-r-lg);
  overflow: hidden;
  box-shadow: var(--adv-shadow);
}
.tp-matrix-title {
  padding: 18px 22px;
  font-family: 'Outfit', sans-serif;
  font-size: 16px;
  font-weight: 800;
  color: var(--adv-ink);
  border-bottom: 1.5px solid var(--adv-rule);
  background: var(--adv-soft);
}
.tp-matrix-title small {
  display: block;
  font-size: 10.5px;
  font-weight: 800;
  letter-spacing: 1.6px;
  color: var(--adv-muted);
  text-transform: uppercase;
  margin-bottom: 4px;
}
.tp-mx-row {
  display: grid;
  grid-template-columns: 2.2fr repeat(5, 1fr);
  border-top: 1px solid var(--adv-rule-soft);
}
.tp-mx-row.head {
  background: var(--adv-soft);
  border-top: none;
}
.tp-mx-row.section {
  background: var(--adv-soft);
  border-top: 1.5px solid var(--adv-rule);
}
.tp-mx-row.section .tp-mx-cell {
  font-family: 'Outfit', sans-serif;
  font-weight: 800;
  font-size: 11px;
  letter-spacing: 1.4px;
  text-transform: uppercase;
  color: var(--adv-rose-deep);
  padding: 12px 18px 6px;
}
.tp-mx-cell {
  padding: 12px 18px;
  font-size: 13px;
  color: var(--adv-ink-soft);
  display: flex; align-items: center;
  border-left: 1px solid var(--adv-rule-soft);
}
.tp-mx-cell:first-child {
  border-left: none;
  color: var(--adv-ink);
  font-weight: 600;
}
.tp-mx-row.head .tp-mx-cell {
  font-family: 'Outfit', sans-serif;
  font-size: 13px;
  font-weight: 800;
  color: var(--adv-ink);
  justify-content: center;
}
.tp-mx-row.head .tp-mx-cell.featured { color: var(--adv-rose-deep); }
.tp-mx-cell:not(:first-child) { justify-content: center; text-align: center; }
.tp-mx-yes { color: var(--adv-green); font-size: 18px; font-weight: 800; }
.tp-mx-no  { color: var(--adv-rule); font-size: 16px; }
.tp-mx-val {
  font-family: 'DM Mono', monospace;
  font-size: 12px;
  font-weight: 700;
  color: var(--adv-ink);
}
.tp-mx-val small {
  display: block;
  font-size: 10px;
  font-weight: 600;
  color: var(--adv-muted);
  letter-spacing: 0.4px;
  margin-top: 1px;
}

/* FAQ */
.tp-faq {
  margin: 0 48px 36px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}
.tp-faq-card {
  background: var(--adv-panel);
  border: 1.5px solid var(--adv-rule);
  border-radius: var(--adv-r);
  padding: 14px 18px;
}
.tp-faq-q {
  font-family: 'Outfit', sans-serif;
  font-size: 14px;
  font-weight: 800;
  color: var(--adv-ink);
  margin-bottom: 6px;
  display: flex; align-items: center; gap: 8px;
}
.tp-faq-q .ic { width: 14px; height: 14px; color: var(--adv-rose-deep); }
.tp-faq-a {
  font-size: 12.5px;
  color: var(--adv-ink-soft);
  line-height: 1.5;
}
.tp-faq-a strong { color: var(--adv-ink); font-weight: 700; }

/* Footer CTA */
.tp-footer {
  padding: 30px 48px 36px;
  background: linear-gradient(135deg, #2d2640, #4e4068);
  color: #fff;
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 28px;
  align-items: center;
}
.tp-footer h3 {
  font-family: 'Outfit', sans-serif;
  font-size: 24px;
  font-weight: 800;
  color: #fff;
  margin: 0;
  letter-spacing: -0.01em;
}
.tp-footer h3 em { color: var(--adv-gold); font-style: italic; }
.tp-footer p { margin: 6px 0 0; font-size: 13px; color: rgba(255,255,255,0.7); line-height: 1.5; max-width: 620px; }
.tp-footer-cta-row { display: flex; gap: 10px; }
.tp-footer-cta {
  padding: 13px 20px;
  background: var(--adv-gold);
  color: var(--adv-ink);
  border: none;
  border-radius: var(--adv-r-sm);
  font-family: 'Outfit', sans-serif;
  font-size: 13.5px;
  font-weight: 800;
  letter-spacing: 0.4px;
  cursor: pointer;
  box-shadow: 0 2px 0 var(--adv-gold-deep);
  white-space: nowrap;
}
.tp-footer-cta.ghost {
  background: transparent;
  color: #fff;
  border: 1.5px solid rgba(255,255,255,0.3);
  box-shadow: none;
}

/* ============================================================
   2 · Tutoring session marketplace
   ============================================================ */
.tc-wrap {
  display: grid;
  grid-template-columns: 1fr 320px;
  height: 100%;
  min-height: 0;
}
.tc-main {
  padding: 22px 28px;
  overflow: auto;
  min-height: 0;
}
.tc-head {
  display: flex; align-items: end; justify-content: space-between; gap: 20px;
  margin-bottom: 16px;
}
.tc-head h2 {
  font-family: 'Outfit', sans-serif;
  font-size: 24px;
  font-weight: 800;
  color: var(--adv-ink);
  margin: 0;
}
.tc-head h2 small {
  display: block;
  font-size: 10.5px;
  font-weight: 800;
  letter-spacing: 1.6px;
  color: var(--adv-muted);
  text-transform: uppercase;
  margin-bottom: 4px;
}
.tc-allowance {
  display: flex; gap: 8px; align-items: center;
  background: var(--adv-gold-soft);
  border: 1.5px solid var(--adv-gold);
  border-radius: 99px;
  padding: 6px 14px;
  font-family: 'Outfit', sans-serif;
  font-size: 12.5px;
  font-weight: 700;
  color: var(--adv-gold-deep);
}
.tc-allowance .ic { width: 13px; height: 13px; }
.tc-allowance strong { font-weight: 800; }

/* week selector */
.tc-week {
  display: grid;
  grid-template-columns: 36px repeat(7, 1fr) 36px;
  gap: 6px;
  align-items: center;
  margin-bottom: 16px;
}
.tc-week-arrow {
  width: 32px; height: 32px;
  background: var(--adv-soft);
  border: 1.5px solid var(--adv-rule);
  border-radius: 50%;
  display: grid; place-items: center;
  cursor: pointer;
  color: var(--adv-ink-soft);
}
.tc-week-arrow .ic { width: 14px; height: 14px; }
.tc-day {
  background: var(--adv-panel);
  border: 1.5px solid var(--adv-rule);
  border-radius: var(--adv-r-sm);
  padding: 8px 10px;
  text-align: center;
  cursor: pointer;
  position: relative;
}
.tc-day.today {
  background: var(--adv-ink); color: #fff;
  border-color: var(--adv-ink);
}
.tc-day.active {
  border-color: var(--adv-rose);
  box-shadow: 0 0 0 3px rgba(196,123,138,0.18);
}
.tc-day-name {
  font-family: 'Outfit', sans-serif;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 1.4px;
  text-transform: uppercase;
  color: var(--adv-muted);
}
.tc-day.today .tc-day-name { color: rgba(255,255,255,0.5); }
.tc-day-num {
  font-family: 'Outfit', sans-serif;
  font-size: 17px;
  font-weight: 800;
  color: var(--adv-ink);
  line-height: 1.1;
}
.tc-day.today .tc-day-num { color: var(--adv-gold); }
.tc-day-count {
  font-size: 10.5px;
  color: var(--adv-muted);
  font-weight: 700;
  margin-top: 2px;
}
.tc-day.today .tc-day-count { color: rgba(255,255,255,0.55); }
.tc-day-dot {
  position: absolute;
  top: 5px; right: 5px;
  width: 7px; height: 7px;
  background: var(--adv-rose);
  border-radius: 50%;
}

/* filters */
.tc-filters {
  display: flex; gap: 8px;
  margin-bottom: 18px;
  flex-wrap: wrap;
}
.tc-filter {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 6px 12px;
  background: var(--adv-soft);
  border: 1.5px solid var(--adv-rule);
  border-radius: 99px;
  font-family: 'Outfit', sans-serif;
  font-size: 12px;
  font-weight: 700;
  color: var(--adv-ink-soft);
  cursor: pointer;
}
.tc-filter.active {
  background: var(--adv-plum);
  color: var(--adv-gold);
  border-color: var(--adv-plum);
}
.tc-filter .ic { width: 11px; height: 11px; }

/* session list */
.tc-section {
  margin-bottom: 22px;
}
.tc-section h4 {
  font-family: 'Outfit', sans-serif;
  font-size: 12.5px;
  font-weight: 800;
  margin: 0 0 10px;
  color: var(--adv-ink);
  display: flex; align-items: baseline; justify-content: space-between;
}
.tc-section h4 em {
  font-style: normal;
  font-weight: 700;
  font-size: 10.5px;
  letter-spacing: 1.4px;
  text-transform: uppercase;
  color: var(--adv-muted);
}

.tc-session {
  display: grid;
  grid-template-columns: 76px 38px 1fr auto auto;
  gap: 14px;
  align-items: center;
  padding: 14px 18px;
  background: var(--adv-panel);
  border: 1.5px solid var(--adv-rule);
  border-radius: var(--adv-r);
  margin-bottom: 8px;
  position: relative;
}
.tc-session.booked {
  border-color: var(--adv-green);
  background: var(--adv-green-soft);
}
.tc-session.full {
  opacity: 0.55;
}
.tc-session-time {
  font-family: 'Outfit', sans-serif;
  font-size: 16px;
  font-weight: 800;
  color: var(--adv-ink);
  line-height: 1;
}
.tc-session-time small {
  display: block;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 1px;
  color: var(--adv-muted);
  margin-top: 2px;
  text-transform: uppercase;
}
.tc-session-av {
  width: 38px; height: 38px;
  border-radius: 50%;
}
.tc-session-info h5 {
  font-family: 'Outfit', sans-serif;
  font-size: 14.5px;
  font-weight: 800;
  color: var(--adv-ink);
  margin: 0;
  line-height: 1.2;
}
.tc-session-info p {
  font-size: 12px;
  color: var(--adv-muted);
  font-weight: 600;
  margin: 4px 0 0;
}
.tc-session-info p strong { color: var(--adv-ink); font-weight: 700; }

.tc-session-tags {
  display: flex;
  flex-direction: column;
  gap: 4px;
  align-items: flex-end;
  text-align: right;
}
.tc-session-tag {
  display: inline-flex; align-items: center; gap: 4px;
  padding: 3px 9px;
  border-radius: 99px;
  font-family: 'Outfit', sans-serif;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 1.2px;
  text-transform: uppercase;
  white-space: nowrap;
}
.tc-session-tag.bio { background: var(--adv-green-soft); color: var(--adv-green); }
.tc-session-tag.chem { background: var(--adv-plum-soft); color: var(--adv-plum-deep); }
.tc-session-tag.phys { background: var(--adv-coral-soft); color: var(--adv-coral-deep); }
.tc-session-tag.math { background: var(--adv-gold-soft); color: var(--adv-gold-deep); }
.tc-session-tag.qa   { background: rgba(196,123,138,0.18); color: var(--adv-rose-deep); }
.tc-session-tag.workshop { background: var(--adv-soft); color: var(--adv-ink-soft); border: 1px solid var(--adv-rule); }
.tc-session-seats {
  font-size: 11px;
  color: var(--adv-muted);
  font-weight: 600;
  display: flex; align-items: center; gap: 4px;
}
.tc-session-seats strong { color: var(--adv-ink); font-weight: 700; }
.tc-session-seats .ic { width: 10px; height: 10px; }

.tc-session-cta {
  padding: 9px 14px;
  border: none;
  border-radius: var(--adv-r-sm);
  font-family: 'Outfit', sans-serif;
  font-size: 12.5px;
  font-weight: 800;
  letter-spacing: 0.3px;
  cursor: pointer;
  white-space: nowrap;
}
.tc-session-cta.book {
  background: var(--adv-ink);
  color: #fff;
}
.tc-session-cta.booked {
  background: var(--adv-green);
  color: #fff;
  display: inline-flex; align-items: center; gap: 6px;
}
.tc-session-cta.booked .ic { width: 12px; height: 12px; }
.tc-session-cta.full {
  background: var(--adv-soft);
  color: var(--adv-muted);
  cursor: not-allowed;
}
.tc-session-cta.waitlist {
  background: var(--adv-gold-soft);
  color: var(--adv-gold-deep);
}

/* "your week" rail */
.tc-rail {
  background: var(--adv-soft);
  border-left: 1.5px solid var(--adv-rule);
  padding: 22px 20px;
  overflow: auto;
  min-height: 0;
  display: flex; flex-direction: column; gap: 14px;
}
.tc-rail h4 {
  font-family: 'Outfit', sans-serif;
  font-size: 10.5px;
  font-weight: 800;
  letter-spacing: 1.6px;
  text-transform: uppercase;
  color: var(--adv-muted);
  margin: 0;
}
.tc-rail-card {
  background: var(--adv-panel);
  border: 1.5px solid var(--adv-rule);
  border-radius: var(--adv-r);
  padding: 14px;
}
.tc-mine {
  display: flex; flex-direction: column; gap: 8px;
}
.tc-mine-row {
  display: grid;
  grid-template-columns: 56px 1fr;
  gap: 12px;
  padding: 10px 12px;
  background: var(--adv-panel);
  border: 1.5px solid var(--adv-rule);
  border-radius: var(--adv-r-sm);
  align-items: center;
}
.tc-mine-row.live {
  border-color: var(--adv-rose);
  background: var(--adv-rose-soft);
  position: relative;
}
.tc-mine-row.live::before {
  content: 'LIVE NOW';
  position: absolute; top: -8px; right: 12px;
  padding: 2px 8px;
  background: var(--adv-rose);
  color: #fff;
  border-radius: 99px;
  font-family: 'Outfit', sans-serif;
  font-size: 9px;
  font-weight: 800;
  letter-spacing: 1.4px;
}
.tc-mine-time {
  font-family: 'DM Mono', monospace;
  font-size: 13px;
  font-weight: 800;
  color: var(--adv-ink);
  text-align: center;
  background: var(--adv-soft);
  border-radius: var(--adv-r-sm);
  padding: 6px 4px;
}
.tc-mine-time small {
  display: block;
  font-size: 9px;
  font-weight: 700;
  color: var(--adv-muted);
  letter-spacing: 0.8px;
}
.tc-mine-info h5 {
  font-family: 'Outfit', sans-serif;
  font-size: 12.5px;
  font-weight: 800;
  margin: 0 0 3px;
  color: var(--adv-ink);
  line-height: 1.2;
}
.tc-mine-info p { font-size: 10.5px; color: var(--adv-muted); font-weight: 600; margin: 0; }

.tc-upgrade {
  background: linear-gradient(135deg, #2d2640, #4e4068);
  color: #fff;
  border-radius: var(--adv-r);
  padding: 16px;
  text-align: center;
}
.tc-upgrade-eye {
  font-family: 'Outfit', sans-serif;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 1.6px;
  color: var(--adv-gold);
  margin-bottom: 6px;
  text-transform: uppercase;
}
.tc-upgrade h5 {
  font-family: 'Outfit', sans-serif;
  font-size: 14px;
  font-weight: 800;
  color: #fff;
  margin: 0 0 6px;
  letter-spacing: -0.01em;
}
.tc-upgrade p {
  font-size: 11.5px;
  color: rgba(255,255,255,0.7);
  margin: 0 0 12px;
  line-height: 1.4;
}
.tc-upgrade-cta {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 8px 14px;
  background: var(--adv-gold);
  color: var(--adv-ink);
  border: none;
  border-radius: var(--adv-r-sm);
  font-family: 'Outfit', sans-serif;
  font-size: 12px;
  font-weight: 800;
  cursor: pointer;
  box-shadow: 0 2px 0 var(--adv-gold-deep);
}

/* ============================================================
   3 · Live tutor-led classroom
   ============================================================ */
.lc-wrap {
  display: grid;
  grid-template-rows: auto 1fr auto;
  height: 100%;
  min-height: 0;
  background: linear-gradient(180deg, #2d2640, #1c1a28);
  color: #fff;
}

.lc-head {
  padding: 16px 24px;
  display: grid;
  grid-template-columns: auto 1fr auto auto;
  gap: 20px;
  align-items: center;
  border-bottom: 1px solid rgba(255,255,255,0.08);
  background: rgba(0,0,0,0.18);
}
.lc-live-pill {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 6px 12px;
  background: var(--adv-rose);
  color: #fff;
  border-radius: 99px;
  font-family: 'Outfit', sans-serif;
  font-size: 10.5px;
  font-weight: 800;
  letter-spacing: 1.6px;
  text-transform: uppercase;
}
.lc-live-pill::before {
  content: '';
  width: 7px; height: 7px;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 0 0 3px rgba(255,255,255,0.25);
  animation: lcPulse 1.4s ease-out infinite;
}
@keyframes lcPulse {
  0%, 100% { box-shadow: 0 0 0 3px rgba(255,255,255,0.25); }
  50%      { box-shadow: 0 0 0 6px rgba(255,255,255,0.10); }
}
.lc-lesson-title {
  font-family: 'Outfit', sans-serif;
  font-size: 17px;
  font-weight: 800;
  color: #fff;
  line-height: 1.1;
  letter-spacing: -0.01em;
}
.lc-lesson-sub {
  font-size: 11.5px;
  color: rgba(255,255,255,0.6);
  font-weight: 600;
  margin-top: 3px;
  letter-spacing: 0.2px;
}
.lc-time {
  text-align: right;
  font-family: 'Outfit', sans-serif;
}
.lc-time-num {
  font-size: 18px;
  font-weight: 800;
  color: var(--adv-gold);
  font-family: 'DM Mono', monospace;
  line-height: 1;
}
.lc-time-lbl {
  font-size: 9.5px;
  font-weight: 800;
  letter-spacing: 1.4px;
  color: rgba(255,255,255,0.5);
  margin-top: 3px;
  text-transform: uppercase;
}
.lc-leave {
  padding: 8px 14px;
  background: rgba(255,255,255,0.08);
  color: #fff;
  border: 1px solid rgba(255,255,255,0.18);
  border-radius: 99px;
  font-family: 'Outfit', sans-serif;
  font-size: 12px;
  font-weight: 700;
  cursor: pointer;
}

/* body grid */
.lc-body {
  display: grid;
  grid-template-columns: 230px 1fr 300px;
  min-height: 0;
}

/* left: agenda */
.lc-agenda {
  padding: 18px 16px;
  border-right: 1px solid rgba(255,255,255,0.08);
  overflow: auto;
  min-height: 0;
}
.lc-agenda h4 {
  font-family: 'Outfit', sans-serif;
  font-size: 10.5px;
  font-weight: 800;
  letter-spacing: 1.6px;
  color: var(--adv-gold);
  margin: 0 0 12px;
  text-transform: uppercase;
}
.lc-agenda-item {
  display: grid;
  grid-template-columns: 22px 1fr;
  gap: 8px;
  padding: 8px 0;
  border-bottom: 1px solid rgba(255,255,255,0.06);
  align-items: start;
}
.lc-agenda-item:last-child { border-bottom: none; }
.lc-agenda-num {
  width: 20px; height: 20px;
  border-radius: 50%;
  display: grid; place-items: center;
  font-family: 'Outfit', sans-serif;
  font-size: 10px;
  font-weight: 800;
  background: rgba(255,255,255,0.08);
  color: rgba(255,255,255,0.55);
}
.lc-agenda-item.done .lc-agenda-num { background: var(--adv-green); color: #fff; }
.lc-agenda-item.done .lc-agenda-title { text-decoration: line-through; color: rgba(255,255,255,0.45); }
.lc-agenda-item.active .lc-agenda-num { background: var(--adv-gold); color: var(--adv-ink); }
.lc-agenda-item.active { background: rgba(214,168,95,0.10); margin: 0 -6px; padding-left: 6px; padding-right: 6px; border-radius: var(--adv-r-sm); border-bottom: none; }
.lc-agenda-title {
  font-family: 'Outfit', sans-serif;
  font-size: 12.5px;
  font-weight: 700;
  color: #fff;
  line-height: 1.3;
}
.lc-agenda-time {
  font-family: 'DM Mono', monospace;
  font-size: 10px;
  font-weight: 700;
  color: rgba(255,255,255,0.45);
  margin-top: 2px;
}

/* center: slide stage + tutor + students */
.lc-stage {
  display: grid;
  grid-template-rows: auto 1fr auto;
  gap: 14px;
  padding: 18px 18px 14px;
  min-height: 0;
}

/* tutor tile */
.lc-tutor {
  background: linear-gradient(135deg, rgba(214,168,95,0.18), rgba(196,123,138,0.18));
  border: 1px solid rgba(214,168,95,0.35);
  border-radius: var(--adv-r-lg);
  padding: 14px 18px;
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: 14px;
  align-items: center;
}
.lc-tutor-av {
  width: 60px; height: 60px;
  border-radius: 50%;
  position: relative;
  flex-shrink: 0;
}
.lc-tutor-av::after {
  content: '';
  position: absolute;
  inset: -4px;
  border: 2px solid var(--adv-gold);
  border-radius: 50%;
  animation: lcRing 1.6s ease-out infinite;
}
@keyframes lcRing {
  0%   { transform: scale(1);   opacity: 0.8; }
  100% { transform: scale(1.18); opacity: 0; }
}
.lc-tutor-info h3 {
  font-family: 'Outfit', sans-serif;
  font-size: 15px;
  font-weight: 800;
  color: #fff;
  margin: 0;
  line-height: 1;
}
.lc-tutor-info p {
  font-size: 11.5px;
  color: rgba(255,255,255,0.7);
  margin: 4px 0 0;
  line-height: 1.4;
}
.lc-tutor-info p strong { color: var(--adv-gold); font-weight: 700; }
.lc-tutor-mic {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 8px 14px;
  background: rgba(255,255,255,0.10);
  border-radius: 99px;
  font-family: 'Outfit', sans-serif;
  font-size: 11.5px;
  font-weight: 800;
  color: #fff;
  letter-spacing: 0.4px;
}
.lc-tutor-mic .lc-wave {
  display: inline-flex; align-items: center; gap: 2px; height: 14px;
}
.lc-tutor-mic .lc-wave i {
  display: block; width: 3px; background: var(--adv-gold); border-radius: 1px;
  animation: lcWave 0.9s ease-in-out infinite;
}
.lc-tutor-mic .lc-wave i:nth-child(1) { animation-delay: 0.0s; }
.lc-tutor-mic .lc-wave i:nth-child(2) { animation-delay: 0.15s; }
.lc-tutor-mic .lc-wave i:nth-child(3) { animation-delay: 0.30s; }
.lc-tutor-mic .lc-wave i:nth-child(4) { animation-delay: 0.45s; }
@keyframes lcWave {
  0%, 100% { height: 4px; }
  50%      { height: 14px; }
}

/* slide stage */
.lc-slide {
  background: var(--adv-panel);
  border-radius: var(--adv-r-lg);
  padding: 30px 36px;
  position: relative;
  overflow: hidden;
  color: var(--adv-ink);
  min-height: 0;
  display: grid;
  grid-template-rows: auto auto auto 1fr auto;
  gap: 12px;
}
.lc-slide-eye {
  font-family: 'Outfit', sans-serif;
  font-size: 10.5px;
  font-weight: 800;
  letter-spacing: 1.6px;
  text-transform: uppercase;
  color: var(--adv-rose-deep);
}
.lc-slide h2 {
  font-family: 'Outfit', sans-serif;
  font-size: 28px;
  font-weight: 800;
  color: var(--adv-ink);
  margin: 0;
  letter-spacing: -0.02em;
  line-height: 1.1;
}
.lc-slide-body {
  font-size: 14px;
  line-height: 1.55;
  color: var(--adv-ink-soft);
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 18px;
}
.lc-slide-body h4 {
  font-family: 'Outfit', sans-serif;
  font-size: 13px;
  font-weight: 800;
  color: var(--adv-rose-deep);
  margin: 0 0 6px;
  letter-spacing: 0.4px;
}
.lc-slide-body ul {
  margin: 0; padding: 0; list-style: none;
  display: flex; flex-direction: column; gap: 6px;
}
.lc-slide-body li {
  padding-left: 16px;
  position: relative;
  font-size: 13px;
  color: var(--adv-ink-soft);
}
.lc-slide-body li::before {
  content: '';
  position: absolute; left: 0; top: 8px;
  width: 6px; height: 6px;
  background: var(--adv-gold);
  border-radius: 50%;
}
.lc-slide-body strong { color: var(--adv-ink); font-weight: 700; }
.lc-slide-foot {
  display: flex; justify-content: space-between; align-items: center;
  border-top: 1.5px dashed var(--adv-rule);
  padding-top: 10px;
  font-size: 11px;
  color: var(--adv-muted);
  font-weight: 600;
  letter-spacing: 0.4px;
}
.lc-slide-nav { display: flex; gap: 6px; }
.lc-slide-nav button {
  width: 28px; height: 28px;
  background: var(--adv-soft);
  border: 1.5px solid var(--adv-rule);
  border-radius: 50%;
  display: grid; place-items: center;
  cursor: pointer;
}
.lc-slide-nav button .ic { width: 12px; height: 12px; color: var(--adv-ink-soft); }

/* student tiles bottom strip */
.lc-students {
  display: grid;
  grid-template-columns: repeat(11, 1fr);
  gap: 6px;
}
.lc-stile {
  background: rgba(255,255,255,0.06);
  border-radius: var(--adv-r-sm);
  padding: 6px 4px 4px;
  text-align: center;
  position: relative;
}
.lc-stile.you {
  background: rgba(196,123,138,0.20);
  outline: 1px solid var(--adv-rose);
}
.lc-stile.hand {
  background: rgba(214,168,95,0.20);
  outline: 1px solid var(--adv-gold);
}
.lc-stile-av { width: 32px; height: 32px; margin: 0 auto 2px; }
.lc-stile-name {
  font-family: 'Outfit', sans-serif;
  font-size: 10px;
  font-weight: 700;
  color: rgba(255,255,255,0.85);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.lc-stile-hand {
  position: absolute; top: 2px; right: 2px;
  width: 16px; height: 16px;
  background: var(--adv-gold);
  color: var(--adv-ink);
  border-radius: 50%;
  display: grid; place-items: center;
  font-size: 9px;
  font-weight: 800;
}
.lc-stile-num {
  position: absolute; top: 2px; left: 2px;
  width: 14px; height: 14px;
  background: var(--adv-gold);
  color: var(--adv-ink);
  border-radius: 50%;
  display: grid; place-items: center;
  font-family: 'Outfit', sans-serif;
  font-size: 8.5px;
  font-weight: 800;
}

/* right: chat / queue */
.lc-right {
  background: rgba(0,0,0,0.20);
  border-left: 1px solid rgba(255,255,255,0.08);
  display: grid;
  grid-template-rows: auto 1fr auto;
  min-height: 0;
}
.lc-tabs {
  display: flex;
  border-bottom: 1px solid rgba(255,255,255,0.08);
}
.lc-tab {
  flex: 1;
  padding: 12px 8px;
  background: transparent; border: none;
  font-family: 'Outfit', sans-serif;
  font-size: 11.5px;
  font-weight: 800;
  color: rgba(255,255,255,0.55);
  letter-spacing: 0.4px;
  cursor: pointer;
  border-bottom: 2px solid transparent;
}
.lc-tab.active {
  color: var(--adv-gold);
  border-bottom-color: var(--adv-gold);
}
.lc-tab small {
  font-size: 9.5px;
  color: rgba(255,255,255,0.4);
  background: rgba(255,255,255,0.10);
  padding: 2px 5px;
  border-radius: 99px;
  margin-left: 4px;
}
.lc-tab.active small { background: rgba(214,168,95,0.20); color: var(--adv-gold); }

.lc-queue {
  padding: 14px 14px;
  overflow: auto;
  min-height: 0;
  display: flex; flex-direction: column; gap: 8px;
}
.lc-q-item {
  display: grid;
  grid-template-columns: 18px 28px 1fr auto;
  gap: 8px;
  align-items: center;
  padding: 8px 10px;
  background: rgba(255,255,255,0.06);
  border-radius: var(--adv-r-sm);
}
.lc-q-item.next {
  background: rgba(214,168,95,0.18);
  outline: 1px solid rgba(214,168,95,0.5);
}
.lc-q-num {
  font-family: 'Outfit', sans-serif;
  font-size: 11px;
  font-weight: 800;
  color: rgba(255,255,255,0.45);
  text-align: center;
}
.lc-q-item.next .lc-q-num { color: var(--adv-gold); }
.lc-q-name {
  font-family: 'Outfit', sans-serif;
  font-size: 12px;
  font-weight: 800;
  color: #fff;
  line-height: 1.1;
}
.lc-q-q {
  font-size: 11px;
  color: rgba(255,255,255,0.6);
  margin-top: 2px;
  line-height: 1.3;
}
.lc-q-time {
  font-family: 'DM Mono', monospace;
  font-size: 10px;
  font-weight: 700;
  color: rgba(255,255,255,0.45);
}
.lc-q-empty {
  padding: 30px 10px;
  text-align: center;
  font-size: 12px;
  color: rgba(255,255,255,0.4);
  font-style: italic;
}

.lc-input {
  padding: 14px 14px;
  border-top: 1px solid rgba(255,255,255,0.08);
}
.lc-input-row {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 8px;
}
.lc-input-field {
  background: rgba(255,255,255,0.08);
  border: 1px solid rgba(255,255,255,0.10);
  border-radius: var(--adv-r-sm);
  padding: 10px 12px;
  font-size: 12px;
  color: rgba(255,255,255,0.55);
  font-family: 'DM Sans', sans-serif;
}
.lc-raise {
  width: 40px; height: 40px;
  background: var(--adv-gold);
  color: var(--adv-ink);
  border: none;
  border-radius: var(--adv-r-sm);
  cursor: pointer;
  display: grid; place-items: center;
  font-family: 'Outfit', sans-serif;
  font-size: 12px;
  font-weight: 800;
}
.lc-raise.active {
  background: var(--adv-rose);
  color: #fff;
}
.lc-input-hint {
  font-size: 10.5px;
  color: rgba(255,255,255,0.45);
  margin-top: 8px;
  display: flex; align-items: center; gap: 6px;
}
.lc-input-hint .ic { width: 11px; height: 11px; color: var(--adv-gold); }

/* footer controls */
.lc-foot {
  padding: 12px 24px;
  background: rgba(0,0,0,0.30);
  border-top: 1px solid rgba(255,255,255,0.08);
  display: flex; align-items: center; gap: 12px;
}
.lc-progress {
  flex: 1;
  height: 5px;
  background: rgba(255,255,255,0.08);
  border-radius: 99px;
  overflow: hidden;
  position: relative;
}
.lc-progress i {
  display: block; height: 100%;
  background: linear-gradient(90deg, var(--adv-rose), var(--adv-gold));
  border-radius: 99px;
}
.lc-progress-label {
  font-family: 'DM Mono', monospace;
  font-size: 11px;
  font-weight: 700;
  color: rgba(255,255,255,0.7);
  white-space: nowrap;
}
.lc-foot-tag {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 4px 10px;
  background: rgba(255,255,255,0.08);
  border-radius: 99px;
  font-family: 'Outfit', sans-serif;
  font-size: 10.5px;
  font-weight: 800;
  letter-spacing: 0.4px;
  color: rgba(255,255,255,0.7);
}
.lc-foot-tag .ic { width: 11px; height: 11px; color: var(--adv-green); }