/* =========================================================
   YSRCP Media — design system
   Inter (Latin) + Noto Sans Telugu, Bootstrap 5 base
   ========================================================= */
@font-face { font-family: "Inter"; src: url("../vendor/fonts/Inter-400.woff2") format("woff2"); font-weight: 400; font-display: swap; }
@font-face { font-family: "Inter"; src: url("../vendor/fonts/Inter-500.woff2") format("woff2"); font-weight: 500; font-display: swap; }
@font-face { font-family: "Inter"; src: url("../vendor/fonts/Inter-600.woff2") format("woff2"); font-weight: 600; font-display: swap; }
@font-face { font-family: "Inter"; src: url("../vendor/fonts/Inter-700.woff2") format("woff2"); font-weight: 700; font-display: swap; }
@font-face { font-family: "Inter"; src: url("../vendor/fonts/Inter-800.woff2") format("woff2"); font-weight: 800; font-display: swap; }
@font-face { font-family: "Noto Sans Telugu"; src: url("../vendor/fonts/NotoSansTelugu-Regular.woff2") format("woff2"); font-weight: 400; font-display: swap; }
@font-face { font-family: "Noto Sans Telugu"; src: url("../vendor/fonts/NotoSansTelugu-500.woff2") format("woff2"); font-weight: 500; font-display: swap; }
@font-face { font-family: "Noto Sans Telugu"; src: url("../vendor/fonts/NotoSansTelugu-600.woff2") format("woff2"); font-weight: 600; font-display: swap; }
@font-face { font-family: "Noto Sans Telugu"; src: url("../vendor/fonts/NotoSansTelugu-Bold.woff2") format("woff2"); font-weight: 700; font-display: swap; }

:root {
  /* Brand */
  --c-primary: #1f4fd1;
  --c-primary-600: #1a43b5;
  --c-primary-700: #163791;
  --c-primary-50: #eef3ff;
  --c-primary-100: #dde7ff;
  --c-green: #0f9d58;
  --c-green-50: #e8f7ef;
  --c-green-700: #0b6e3e;

  /* Neutrals */
  --c-bg: #f5f7fb;
  --c-surface: #ffffff;
  --c-surface-2: #f9fafc;
  --c-border: #e5e8f0;
  --c-border-strong: #d3d8e4;
  --c-ink: #111827;
  --c-ink-2: #374151;
  --c-muted: #6b7280;
  --c-faint: #9aa3b2;

  /* Status */
  --c-danger: #d92d20;
  --c-warning: #b54708;
  --c-warning-50: #fffaeb;

  /* Sidebar */
  --c-side: #0d1b3e;
  --c-side-2: #142753;
  --c-side-ink: #c7d2ee;

  --radius: 14px;
  --radius-sm: 10px;
  --shadow-sm: 0 1px 2px rgba(16, 24, 40, .05);
  --shadow: 0 1px 3px rgba(16, 24, 40, .06), 0 1px 2px rgba(16, 24, 40, .04);
  --shadow-lg: 0 12px 32px -8px rgba(16, 24, 40, .18);
  --sidebar-w: 256px;
  --topbar-h: 64px;
  --font: "Inter", "Noto Sans Telugu", "Nirmala UI", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-te: "Noto Sans Telugu", "Inter", "Nirmala UI", sans-serif;

  /* Bootstrap overrides */
  --bs-body-font-family: var(--font);
  --bs-body-bg: var(--c-bg);
  --bs-body-color: var(--c-ink);
  --bs-primary: var(--c-primary);
  --bs-primary-rgb: 31, 79, 209;
  --bs-link-color: var(--c-primary);
  --bs-link-color-rgb: 31, 79, 209;
  --bs-link-hover-color: var(--c-primary-700);
  --bs-border-color: var(--c-border);
  --bs-border-radius: 10px;
  --bs-secondary-color: var(--c-muted);
}

html { -webkit-text-size-adjust: 100%; }
body { font-family: var(--font); font-size: 15px; color: var(--c-ink); background: var(--c-bg); font-feature-settings: "cv11", "ss01"; -webkit-font-smoothing: antialiased; }
.te { font-family: var(--font-te); }
h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 { font-weight: 700; letter-spacing: -.015em; color: var(--c-ink); }
a { text-decoration: none; }
::selection { background: var(--c-primary-100); }
.text-muted { color: var(--c-muted) !important; }
.small, small { font-size: .84rem; }
.fw-medium { font-weight: 500; }
.tabular { font-variant-numeric: tabular-nums; }

/* ---------- Buttons ---------- */
.btn { font-weight: 600; border-radius: 10px; padding: .5rem 1rem; letter-spacing: -.005em; }
.btn-sm { padding: .34rem .7rem; font-size: .82rem; border-radius: 8px; }
.btn-lg { padding: .7rem 1.25rem; font-size: 1rem; border-radius: 12px; }
.btn-primary { --bs-btn-bg: var(--c-primary); --bs-btn-border-color: var(--c-primary); --bs-btn-hover-bg: var(--c-primary-600); --bs-btn-hover-border-color: var(--c-primary-600); --bs-btn-active-bg: var(--c-primary-700); --bs-btn-active-border-color: var(--c-primary-700); --bs-btn-disabled-bg: var(--c-primary); box-shadow: 0 1px 2px rgba(31, 79, 209, .25), inset 0 1px 0 rgba(255, 255, 255, .12); }
.btn-outline-primary { --bs-btn-color: var(--c-primary); --bs-btn-border-color: var(--c-primary-100); --bs-btn-bg: var(--c-primary-50); --bs-btn-hover-bg: var(--c-primary); --bs-btn-hover-border-color: var(--c-primary); --bs-btn-active-bg: var(--c-primary-700); }
.btn-light, .btn-white { --bs-btn-bg: #fff; --bs-btn-border-color: var(--c-border); --bs-btn-color: var(--c-ink-2); --bs-btn-hover-bg: var(--c-surface-2); --bs-btn-hover-border-color: var(--c-border-strong); --bs-btn-hover-color: var(--c-ink); box-shadow: var(--shadow-sm); }
.btn-ghost { --bs-btn-color: var(--c-muted); --bs-btn-hover-bg: #eef0f5; --bs-btn-hover-color: var(--c-ink); --bs-btn-border-color: transparent; --bs-btn-hover-border-color: transparent; }
.btn-whatsapp { --bs-btn-bg: #1fa855; --bs-btn-border-color: #1fa855; --bs-btn-color: #fff; --bs-btn-hover-bg: #178a45; --bs-btn-hover-border-color: #178a45; --bs-btn-hover-color: #fff; --bs-btn-active-bg: #127038; --bs-btn-active-color: #fff; }
.btn-pdf { --bs-btn-bg: #fff; --bs-btn-border-color: var(--c-border); --bs-btn-color: #b42318; --bs-btn-hover-bg: #fef3f2; --bs-btn-hover-border-color: #fecdca; --bs-btn-hover-color: #912018; box-shadow: var(--shadow-sm); }
.btn-soft-danger { --bs-btn-bg: #fef3f2; --bs-btn-border-color: #fef3f2; --bs-btn-color: #b42318; --bs-btn-hover-bg: #fee4e2; --bs-btn-hover-border-color: #fee4e2; --bs-btn-hover-color: #912018; }
.btn-icon { width: 38px; height: 38px; padding: 0; display: inline-flex; align-items: center; justify-content: center; }
.btn-icon.btn-sm { width: 32px; height: 32px; }
.btn:focus-visible, .form-control:focus, .form-select:focus { box-shadow: 0 0 0 4px rgba(31, 79, 209, .15); border-color: #94adf0; }

/* ---------- Forms ---------- */
.form-label { font-size: .82rem; font-weight: 600; color: var(--c-ink-2); margin-bottom: .35rem; }
.form-control, .form-select { background-color: #fff; border-color: var(--c-border-strong); border-radius: 10px; padding: .55rem .8rem; font-size: .95rem; box-shadow: var(--shadow-sm); }
.form-control::placeholder { color: var(--c-faint); }
.form-control-sm, .form-select-sm { padding: .38rem .65rem; font-size: .85rem; border-radius: 8px; }
.form-text { color: var(--c-muted); font-size: .8rem; }
textarea.form-control { line-height: 1.75; }
.input-icon { position: relative; }
.input-icon > .bi { position: absolute; left: .85rem; top: 50%; transform: translateY(-50%); color: var(--c-faint); pointer-events: none; }
.input-icon > .form-control { padding-left: 2.4rem; }

/* Tom Select */
.ts-wrapper.form-select, .ts-wrapper.form-control { padding: 0 !important; min-height: 42px; border: 1px solid var(--c-border-strong); border-radius: 10px; box-shadow: var(--shadow-sm); background-color: #fff; }
.ts-wrapper.form-select-sm, .ts-wrapper.form-control-sm { min-height: 34px; border-radius: 8px; }
.ts-wrapper .ts-control, .ts-wrapper.single.input-active .ts-control { background: transparent !important; border: 0 !important; box-shadow: none !important; min-height: 40px; padding: .5rem 2.2rem .5rem .8rem !important; font-size: .95rem; }
.ts-wrapper.form-select-sm .ts-control { min-height: 32px; padding: .3rem 2rem .3rem .65rem !important; font-size: .85rem; }
.ts-wrapper.multi .ts-control { padding: .4rem .6rem !important; }
.ts-wrapper.focus { border-color: #94adf0; box-shadow: 0 0 0 4px rgba(31, 79, 209, .15); }
.ts-wrapper.multi .ts-control > .item { background: var(--c-primary-50); color: var(--c-primary-700); border: 1px solid var(--c-primary-100); border-radius: 6px; font-weight: 500; padding: 1px 6px; }
.ts-dropdown { border-radius: 12px; border-color: var(--c-border); box-shadow: var(--shadow-lg); overflow: hidden; margin-top: 6px; font-size: .92rem; }
.ts-dropdown .option { padding: .55rem .8rem; }
.ts-dropdown .active { background: var(--c-primary-50); color: var(--c-ink); }
.ts-dropdown .create { color: var(--c-primary); font-weight: 500; }

/* ---------- App shell ---------- */
.app-sidebar { position: fixed; inset: 0 auto 0 0; width: var(--sidebar-w); background: var(--c-side); color: var(--c-side-ink); display: flex; flex-direction: column; z-index: 1040; }
.app-sidebar::before { content: ""; position: absolute; inset: 0 0 auto 0; height: 4px; background: linear-gradient(90deg, #1f4fd1 0 33%, #fff 33% 66%, #0f9d58 66%); }
.side-brand { display: flex; align-items: center; gap: .75rem; padding: 1.4rem 1.25rem 1.1rem; color: #fff; }
.side-brand img { width: 42px; height: 42px; }
.side-brand .t1 { font-weight: 800; font-size: 1.05rem; letter-spacing: -.01em; line-height: 1.1; }
.side-brand .t2 { font-size: .72rem; color: #8ea0cc; font-weight: 500; letter-spacing: .04em; text-transform: uppercase; }
.side-section { font-size: .68rem; text-transform: uppercase; letter-spacing: .08em; color: #6f82b3; font-weight: 700; padding: 1rem 1.4rem .4rem; }
.side-nav { list-style: none; margin: 0; padding: 0 .75rem; }
.side-nav a { display: flex; align-items: center; gap: .75rem; padding: .62rem .8rem; border-radius: 10px; color: var(--c-side-ink); font-weight: 500; font-size: .92rem; transition: background .15s, color .15s; }
.side-nav a .bi { font-size: 1.1rem; opacity: .85; }
.side-nav a:hover { background: rgba(255, 255, 255, .06); color: #fff; }
.side-nav a.active { background: linear-gradient(90deg, rgba(31, 79, 209, .9), rgba(31, 79, 209, .55)); color: #fff; box-shadow: inset 3px 0 0 #7fa2ff; }
.side-cta { margin: 1rem 1rem 0; }
.side-cta .btn { width: 100%; background: #fff; color: var(--c-side); border: 0; }
.side-cta .btn:hover { background: #eef3ff; }
.side-foot { margin-top: auto; padding: 1rem; border-top: 1px solid rgba(255, 255, 255, .07); }
.side-user { display: flex; align-items: center; gap: .7rem; padding: .5rem; border-radius: 12px; color: #fff; }
.side-user:hover { background: rgba(255, 255, 255, .06); color: #fff; }
.side-user .meta { min-width: 0; line-height: 1.2; }
.side-user .meta .n { font-weight: 600; font-size: .9rem; }
.side-user .meta .r { font-size: .75rem; color: #8ea0cc; }

.app-main { min-height: 100vh; }
@media (min-width: 992px) { .app-main { margin-left: var(--sidebar-w); } }

.app-topbar { position: sticky; top: 0; z-index: 1030; height: var(--topbar-h); background: rgba(245, 247, 251, .85); backdrop-filter: saturate(180%) blur(10px); -webkit-backdrop-filter: saturate(180%) blur(10px); border-bottom: 1px solid transparent; transition: border-color .2s, background .2s; }
.app-topbar.scrolled { border-bottom-color: var(--c-border); background: rgba(255, 255, 255, .9); }
.app-topbar .inner { height: 100%; display: flex; align-items: center; gap: .75rem; padding: 0 1.75rem; max-width: 1440px; }
.topbar-search { flex: 1; max-width: 520px; }
.topbar-search .form-control { background: #fff; border-color: var(--c-border); border-radius: 12px; height: 42px; }
.topbar-search kbd { position: absolute; right: .6rem; top: 50%; transform: translateY(-50%); background: var(--c-surface-2); color: var(--c-muted); border: 1px solid var(--c-border); font-size: .7rem; font-family: var(--font); padding: 2px 6px; border-radius: 6px; }
.mobile-brand { display: flex; align-items: center; gap: .55rem; font-weight: 800; color: var(--c-ink); font-size: 1.02rem; }
.mobile-brand img { width: 34px; height: 34px; }

.app-content { padding: 1.5rem 1.75rem 3rem; max-width: 1440px; }

/* Mobile bottom navigation */
.bottom-nav { position: fixed; inset: auto 0 0 0; z-index: 1035; background: rgba(255, 255, 255, .96); backdrop-filter: blur(12px); border-top: 1px solid var(--c-border); display: flex; justify-content: space-around; align-items: flex-end; padding: .35rem .25rem calc(.35rem + env(safe-area-inset-bottom)); }
.bottom-nav a, .bottom-nav button { flex: 1; display: flex; flex-direction: column; align-items: center; gap: 2px; font-size: .68rem; font-weight: 600; color: var(--c-muted); background: none; border: 0; padding: .25rem 0; }
.bottom-nav .bi { font-size: 1.3rem; line-height: 1; }
.bottom-nav a.active { color: var(--c-primary); }
.bottom-nav .add-btn { position: relative; top: -14px; flex: 0 0 auto; width: 56px; height: 56px; border-radius: 18px; background: linear-gradient(135deg, var(--c-primary), #3b6cf0); color: #fff !important; justify-content: center; box-shadow: 0 8px 20px -6px rgba(31, 79, 209, .6); margin: 0 .5rem; }
.bottom-nav .add-btn .bi { font-size: 1.6rem; }

@media (max-width: 991.98px) {
  .app-topbar .inner { padding: 0 1rem; }
  .app-content { padding: 1rem 1rem calc(96px + env(safe-area-inset-bottom)); }
  body { font-size: 15px; }
}

/* Offcanvas menu (mobile) */
.offcanvas.side-offcanvas { background: var(--c-side); color: var(--c-side-ink); width: 280px; }
.offcanvas.side-offcanvas .btn-close { filter: invert(1) grayscale(1) brightness(2); }

/* ---------- Page header ---------- */
.page-header { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 1rem; margin-bottom: 1.5rem; }
.page-header h1 { font-size: 1.6rem; margin: 0; }
.page-header .sub { color: var(--c-muted); margin-top: .2rem; font-size: .92rem; }
.page-header .actions { display: flex; flex-wrap: wrap; gap: .5rem; }
.crumbs { font-size: .82rem; color: var(--c-muted); margin-bottom: .4rem; display: flex; align-items: center; gap: .35rem; }
.crumbs a { color: var(--c-muted); font-weight: 500; }
.crumbs a:hover { color: var(--c-primary); }
@media (max-width: 575.98px) { .page-header h1 { font-size: 1.3rem; } .page-header { margin-bottom: 1rem; } .page-header .actions { width: 100%; } .page-header .actions > .btn { flex: 1; white-space: nowrap; } .chart-box { height: 200px; } }

/* ---------- Panels ---------- */
.panel { background: var(--c-surface); border: 1px solid var(--c-border); border-radius: var(--radius); box-shadow: var(--shadow); }
.panel-head { display: flex; align-items: center; justify-content: space-between; gap: .75rem; padding: 1rem 1.25rem; border-bottom: 1px solid var(--c-border); }
.panel-head h2, .panel-head h3 { font-size: 1rem; margin: 0; font-weight: 700; }
.panel-head .hint { font-size: .8rem; color: var(--c-muted); font-weight: 500; }
.panel-body { padding: 1.25rem; }
.panel-foot { padding: .85rem 1.25rem; border-top: 1px solid var(--c-border); background: var(--c-surface-2); border-radius: 0 0 var(--radius) var(--radius); }
.panel-title-icon { width: 30px; height: 30px; border-radius: 9px; display: inline-flex; align-items: center; justify-content: center; background: var(--c-primary-50); color: var(--c-primary); font-size: .95rem; margin-right: .6rem; }
@media (max-width: 575.98px) { .panel-body { padding: 1rem; } .panel-head { padding: .85rem 1rem; } }

/* ---------- KPI tiles ---------- */
.kpi { padding: 1.1rem 1.25rem; display: flex; gap: 1rem; align-items: flex-start; height: 100%; }
.kpi .ic { width: 42px; height: 42px; border-radius: 12px; display: flex; align-items: center; justify-content: center; font-size: 1.2rem; flex: none; background: var(--c-primary-50); color: var(--c-primary); }
.kpi .ic.green { background: var(--c-green-50); color: var(--c-green); }
.kpi .lbl { font-size: .8rem; color: var(--c-muted); font-weight: 500; }
.kpi .val { font-size: 1.75rem; font-weight: 800; letter-spacing: -.03em; line-height: 1.15; font-variant-numeric: tabular-nums; }
.kpi .delta { font-size: .76rem; font-weight: 600; color: var(--c-muted); }
.kpi .delta.up { color: var(--c-green-700); }
.kpi .delta.down { color: #b42318; }
@media (max-width: 575.98px) { .kpi { padding: .9rem; gap: .7rem; } .kpi .ic { width: 36px; height: 36px; font-size: 1rem; } .kpi .val { font-size: 1.4rem; } }

/* ---------- Chips & badges ---------- */
.chip { display: inline-flex; align-items: center; gap: .3rem; padding: .18rem .55rem; border-radius: 999px; font-size: .74rem; font-weight: 600; background: #f0f2f7; color: var(--c-ink-2); border: 1px solid transparent; white-space: nowrap; }
.chip-type { background: var(--c-primary-50); color: var(--c-primary-700); border-color: var(--c-primary-100); }
.chip-tag { background: var(--c-green-50); color: var(--c-green-700); }
.chip-yt { background: #fef3f2; color: #b42318; }
.chip-muted { background: transparent; border-color: var(--c-border); color: var(--c-muted); }
a.chip:hover { filter: brightness(.96); }

/* ---------- Avatars ---------- */
.avatar { --s: 40px; width: var(--s); height: var(--s); flex: none; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; background: linear-gradient(135deg, var(--c-primary-100), #cfe0ff); color: var(--c-primary-700); font-weight: 700; font-family: var(--font-te); font-size: calc(var(--s) * .42); border: 2px solid #fff; box-shadow: 0 0 0 1px var(--c-border); }
.avatar.sm { --s: 30px; }
.avatar.lg { --s: 52px; }
.avatar.group { background: linear-gradient(135deg, #d9f2e4, #c2ebd3); color: var(--c-green-700); }
.avatar-stack { display: inline-flex; }
.avatar-stack .avatar + .avatar { margin-left: -10px; }

/* ---------- Meet list items ---------- */
.meet-row { display: flex; gap: .9rem; padding: 1rem 1.25rem; border-bottom: 1px solid var(--c-border); color: inherit; transition: background .12s; }
.meet-row:last-child { border-bottom: 0; }
.meet-row:hover { background: #fafbff; color: inherit; }
.meet-date { flex: none; align-self: flex-start; width: 54px; text-align: center; border-radius: 12px; background: var(--c-surface-2); border: 1px solid var(--c-border); padding: .35rem 0 .4rem; line-height: 1.1; }
.meet-date .d { font-size: 1.25rem; font-weight: 800; letter-spacing: -.02em; }
.meet-date .m { font-size: .66rem; font-weight: 700; color: var(--c-primary); text-transform: uppercase; letter-spacing: .06em; }
.meet-date .y { font-size: .64rem; color: var(--c-faint); font-weight: 600; }
.meet-main { min-width: 0; flex: 1; }
.meet-leaders { font-weight: 700; font-family: var(--font-te); font-size: .98rem; line-height: 1.45; }
.meet-leaders .role { font-family: var(--font); font-weight: 500; color: var(--c-muted); font-size: .8rem; }
.meet-meta { display: flex; flex-wrap: wrap; gap: .25rem .9rem; font-size: .8rem; color: var(--c-muted); margin-top: .1rem; }
.meet-meta .bi { margin-right: .2rem; }
.meet-points { font-family: var(--font-te); color: var(--c-ink-2); font-size: .9rem; line-height: 1.75; margin-top: .4rem; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.meet-chips { display: flex; flex-wrap: wrap; gap: .3rem; margin-top: .5rem; }
.meet-aside { flex: none; display: flex; align-items: center; color: var(--c-faint); }
@media (max-width: 575.98px) { .meet-row { padding: .9rem 1rem; gap: .75rem; } .meet-date { width: 48px; } .meet-aside { display: none; } }

/* Timeline (today) */
.timeline { list-style: none; margin: 0; padding: .5rem 1.25rem 1rem; }
.timeline li { position: relative; padding: .6rem 0 .6rem 1.6rem; }
.timeline li::before { content: ""; position: absolute; left: 5px; top: 0; bottom: 0; width: 2px; background: var(--c-border); }
.timeline li:first-child::before { top: 1.2rem; }
.timeline li:last-child::before { bottom: calc(100% - 1.2rem); }
.timeline li::after { content: ""; position: absolute; left: 0; top: 1rem; width: 12px; height: 12px; border-radius: 50%; background: #fff; border: 3px solid var(--c-primary); }
.timeline .tm { font-size: .78rem; font-weight: 700; color: var(--c-primary); }
.timeline a { color: inherit; display: block; }
.timeline a:hover .meet-leaders { color: var(--c-primary); }

/* ---------- Tables ---------- */
.table-modern { margin: 0; --bs-table-bg: transparent; }
.table-modern thead th { font-size: .72rem; text-transform: uppercase; letter-spacing: .06em; color: var(--c-muted); font-weight: 700; background: var(--c-surface-2); border-bottom: 1px solid var(--c-border); padding: .7rem 1rem; white-space: nowrap; }
.table-modern td { padding: .9rem 1rem; border-color: var(--c-border); vertical-align: top; }
.table-modern tbody tr:hover td { background: #fafbff; }
.table-modern .clamp { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; font-family: var(--font-te); line-height: 1.7; color: var(--c-ink-2); font-size: .9rem; }

/* ---------- Detail page ---------- */
.detail-hero { padding: 1.5rem; position: relative; overflow: hidden; }
.detail-hero::after { content: ""; position: absolute; right: -60px; top: -60px; width: 200px; height: 200px; border-radius: 50%; background: radial-gradient(circle, rgba(31, 79, 209, .08), transparent 70%); pointer-events: none; }
.speaker-card { display: flex; align-items: center; gap: .75rem; padding: .6rem .9rem .6rem .6rem; border: 1px solid var(--c-border); border-radius: 999px; background: var(--c-surface-2); color: inherit; transition: border-color .15s, background .15s; }
.speaker-card:hover { border-color: var(--c-primary-100); background: var(--c-primary-50); color: inherit; }
.speaker-card .n { font-weight: 700; font-family: var(--font-te); line-height: 1.2; }
.speaker-card .r { font-size: .76rem; color: var(--c-muted); font-weight: 500; }
.section-label { font-size: .72rem; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; color: var(--c-muted); margin-bottom: .6rem; display: flex; align-items: center; gap: .5rem; }
.section-label::after { content: ""; flex: 1; height: 1px; background: var(--c-border); }
.prose-te { font-family: var(--font-te); font-size: 1.04rem; line-height: 1.95; color: var(--c-ink); white-space: pre-wrap; word-break: break-word; }
.points-list { list-style: none; padding: 0; margin: 0; }
.points-list li { position: relative; padding: .45rem 0 .45rem 1.6rem; font-family: var(--font-te); font-size: 1.02rem; line-height: 1.8; border-bottom: 1px dashed var(--c-border); }
.points-list li:last-child { border-bottom: 0; }
.points-list li::before { content: ""; position: absolute; left: .3rem; top: 1.05rem; width: 8px; height: 8px; border-radius: 2px; background: var(--c-primary); transform: rotate(45deg); }
.yt-wrap { position: relative; padding-top: 56.25%; border-radius: 14px; overflow: hidden; background: #0b0f19; box-shadow: var(--shadow-lg); }
.yt-wrap iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.action-stack .btn { justify-content: flex-start; display: flex; align-items: center; gap: .6rem; }
.action-stack .btn .bi { font-size: 1.1rem; }
.link-row { min-width: 0; overflow: hidden; display: flex; gap: .7rem; align-items: center; padding: .65rem .8rem; border: 1px solid var(--c-border); border-radius: 12px; color: var(--c-ink-2); font-size: .85rem; }
.link-row:hover { border-color: var(--c-primary-100); background: var(--c-primary-50); }
.link-row .ic { width: 34px; height: 34px; border-radius: 9px; flex: none; display: flex; align-items: center; justify-content: center; background: #fef3f2; color: #d92d20; font-size: 1.1rem; }
.link-row .ic.other { background: var(--c-primary-50); color: var(--c-primary); }
.link-row .u { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.photo-thumb { width: 100%; aspect-ratio: 4/3; object-fit: cover; border-radius: 10px; border: 1px solid var(--c-border); }
.mobile-actions { position: fixed; left: 0; right: 0; bottom: calc(68px + env(safe-area-inset-bottom)); z-index: 1034; padding: .6rem 1rem; background: linear-gradient(180deg, rgba(245, 247, 251, 0), rgba(245, 247, 251, .95) 30%); display: flex; gap: .5rem; }
.mobile-actions .btn { flex: 1; box-shadow: var(--shadow); }
.mobile-actions .btn.btn-icon { flex: none; }
.has-mobile-actions .app-content { padding-bottom: 170px; }
@media (min-width: 992px) { .has-mobile-actions .app-content { padding-bottom: 3rem; } }

/* ---------- Form page ---------- */
.form-section { margin-bottom: 1.25rem; }
.step-num { width: 26px; height: 26px; border-radius: 8px; background: var(--c-primary); color: #fff; font-size: .8rem; font-weight: 700; display: inline-flex; align-items: center; justify-content: center; margin-right: .6rem; }
.time-chips { display: flex; flex-wrap: wrap; gap: .35rem; }
.time-chips .btn { border-radius: 999px; font-weight: 500; font-size: .78rem; padding: .25rem .7rem; }
.time-chips .btn.active { background: var(--c-primary); color: #fff; border-color: var(--c-primary); }
.speaker-row { background: var(--c-surface-2); border: 1px solid var(--c-border); border-radius: 12px; padding: .9rem; position: relative; }
.speaker-row + .speaker-row { margin-top: .75rem; }
.speaker-row .idx { position: absolute; top: -9px; left: 12px; background: var(--c-primary); color: #fff; font-size: .68rem; font-weight: 700; padding: 1px 8px; border-radius: 999px; }
.dropzone { border: 2px dashed var(--c-border-strong); border-radius: 14px; padding: 1.25rem; text-align: center; background: var(--c-surface-2); cursor: pointer; transition: border-color .15s, background .15s; position: relative; }
.dropzone:hover, .dropzone.drag { border-color: var(--c-primary); background: var(--c-primary-50); }
.dropzone input[type=file] { position: absolute; inset: 0; opacity: 0; cursor: pointer; }
.dropzone .bi { font-size: 1.8rem; color: var(--c-primary); }
.sticky-actions { position: sticky; top: calc(var(--topbar-h) + 1rem); }
.form-bottom-bar { position: fixed; left: 0; right: 0; bottom: 0; z-index: 1036; padding: .7rem 1rem calc(.7rem + env(safe-area-inset-bottom)); background: rgba(255, 255, 255, .96); backdrop-filter: blur(10px); border-top: 1px solid var(--c-border); display: flex; gap: .5rem; }
.form-bottom-bar .btn { flex: 1; }
.similar-warn { font-size: .85rem; border-radius: 10px; background: var(--c-warning-50); border: 1px solid #fedf89; color: #93370d; padding: .55rem .7rem; margin-top: .5rem; }
.similar-warn .btn-warning { --bs-btn-bg: #fdb022; --bs-btn-border-color: #fdb022; font-weight: 600; }

/* ---------- Filters ---------- */
.filter-bar { display: flex; flex-wrap: wrap; gap: .6rem; align-items: center; }
.search-xl .form-control { height: 52px; font-size: 1rem; border-radius: 14px; padding-left: 2.8rem; }
.search-xl > .bi { left: 1.05rem; font-size: 1.1rem; }
.active-filters { display: flex; flex-wrap: wrap; gap: .4rem; }
.active-filters .chip { background: #fff; border-color: var(--c-border); font-weight: 500; }
.active-filters .chip .x { color: var(--c-faint); margin-left: .15rem; }
.active-filters .chip:hover .x { color: var(--c-danger); }

/* ---------- Report ---------- */
.rank { width: 24px; font-size: .78rem; color: var(--c-faint); font-weight: 700; text-align: right; flex: none; }
.bar-row { display: flex; align-items: center; gap: .75rem; padding: .55rem 1.25rem; }
.bar-row .name { min-width: 0; flex: 1; font-family: var(--font-te); font-weight: 600; font-size: .9rem; }
.bar-row .track { height: 6px; border-radius: 999px; background: #eef0f5; margin-top: .35rem; overflow: hidden; }
.bar-row .fill { height: 100%; border-radius: 999px; background: var(--c-primary); }
.bar-row .num { font-weight: 700; font-variant-numeric: tabular-nums; min-width: 2ch; text-align: right; }
.bar-row .brk { font-size: .72rem; color: var(--c-muted); font-weight: 500; }
.bar-row:hover { background: #fafbff; }
.month-nav { display: inline-flex; align-items: center; background: #fff; border: 1px solid var(--c-border); border-radius: 12px; box-shadow: var(--shadow-sm); }
.month-nav a { padding: .5rem .7rem; color: var(--c-ink-2); }
.month-nav a:hover { color: var(--c-primary); }
.month-nav input { border: 0; font-weight: 700; width: 170px; text-align: center; padding: .45rem 0; background: transparent; }
.month-nav input:focus { outline: none; }

/* ---------- Chart ---------- */
.chart-box { position: relative; height: 240px; }

/* ---------- Empty states ---------- */
.empty { text-align: center; padding: 2.5rem 1rem; color: var(--c-muted); }
.empty .ic { width: 56px; height: 56px; border-radius: 16px; background: var(--c-surface-2); border: 1px solid var(--c-border); display: inline-flex; align-items: center; justify-content: center; font-size: 1.5rem; color: var(--c-faint); margin-bottom: .75rem; }
.empty .t { font-weight: 700; color: var(--c-ink); margin-bottom: .2rem; }

/* ---------- Lists (masters/users) ---------- */
.list-row { display: flex; align-items: center; gap: .9rem; padding: .85rem 1.25rem; border-bottom: 1px solid var(--c-border); }
.list-row:last-child { border-bottom: 0; }
.list-row .main { flex: 1; min-width: 0; }
.list-row .title { font-weight: 600; }
.list-row .sub { font-size: .8rem; color: var(--c-muted); }
.list-edit { background: var(--c-surface-2); border-bottom: 1px solid var(--c-border); padding: 1rem 1.25rem; }
.seg { display: inline-flex; background: #eceff5; padding: 4px; border-radius: 12px; gap: 2px; overflow-x: auto; max-width: 100%; }
.seg a { padding: .42rem .85rem; border-radius: 9px; font-size: .85rem; font-weight: 600; color: var(--c-muted); white-space: nowrap; }
.seg a:hover { color: var(--c-ink); }
.seg a.active { background: #fff; color: var(--c-ink); box-shadow: var(--shadow); }

/* ---------- Alerts / toasts ---------- */
.alert { border-radius: 12px; border-width: 1px; font-size: .9rem; display: flex; gap: .6rem; align-items: flex-start; }
.alert-success { background: #ecfdf3; border-color: #abefc6; color: #067647; }
.alert-danger { background: #fef3f2; border-color: #fecdca; color: #b42318; }
.alert-warning { background: var(--c-warning-50); border-color: #fedf89; color: #93370d; }
.alert-info { background: var(--c-primary-50); border-color: var(--c-primary-100); color: var(--c-primary-700); }
.toast { border-radius: 12px; box-shadow: var(--shadow-lg); }

/* ---------- Dropdowns, pagination ---------- */
.dropdown-menu { border-radius: 12px; border-color: var(--c-border); box-shadow: var(--shadow-lg); padding: .4rem; font-size: .9rem; }
.dropdown-item { border-radius: 8px; padding: .5rem .7rem; }
.dropdown-item .bi { width: 1.2rem; color: var(--c-muted); }
.pagination { gap: .25rem; }
.pagination .page-link { border-radius: 9px !important; border: 1px solid var(--c-border); color: var(--c-ink-2); font-weight: 600; min-width: 36px; text-align: center; }
.pagination .page-item.active .page-link { background: var(--c-primary); border-color: var(--c-primary); color: #fff; }

/* ---------- Login ---------- */
.auth { min-height: 100vh; display: grid; grid-template-columns: 1fr; background: #fff; }
@media (min-width: 992px) { .auth { grid-template-columns: 1.05fr 1fr; } }
.auth-art { display: none; position: relative; overflow: hidden; color: #fff; padding: 3rem; background: radial-gradient(1200px 600px at -10% -10%, #2c5fe6 0%, transparent 60%), radial-gradient(800px 500px at 110% 110%, #0f9d58 0%, transparent 55%), #0d1b3e; }
@media (min-width: 992px) { .auth-art { display: flex; flex-direction: column; justify-content: space-between; } }
.auth-art .grid { position: absolute; inset: 0; background-image: linear-gradient(rgba(255, 255, 255, .05) 1px, transparent 1px), linear-gradient(90deg, rgba(255, 255, 255, .05) 1px, transparent 1px); background-size: 44px 44px; mask-image: radial-gradient(circle at 30% 40%, #000, transparent 75%); }
.auth-art h2 { color: #fff; font-size: 2.3rem; font-weight: 800; letter-spacing: -.03em; line-height: 1.15; max-width: 460px; }
.auth-art p { color: #c7d2ee; max-width: 420px; font-size: 1.02rem; }
.auth-feature { display: flex; gap: .75rem; align-items: center; color: #dfe6f8; font-size: .92rem; margin-top: .8rem; }
.auth-feature .bi { width: 34px; height: 34px; border-radius: 10px; background: rgba(255, 255, 255, .1); display: inline-flex; align-items: center; justify-content: center; }
.auth-art.auth-photo { padding: 0; background: #0d1b3e; }
.auth-art.auth-photo img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 45% 22%; }
.auth-art.auth-photo::after { content: ""; position: absolute; inset: auto 0 0 0; height: 6px; background: linear-gradient(90deg, #1f4fd1 0 33%, #fff 33% 66%, #0f9d58 66%); }
.auth-form { display: flex; align-items: center; justify-content: center; padding: 2rem 1.25rem; }
.auth-card { width: 100%; max-width: 400px; }
.auth-card h1 { font-size: 1.7rem; font-weight: 800; letter-spacing: -.03em; }
.auth-card .form-control { height: 48px; }
.flag-bar { height: 4px; width: 72px; border-radius: 4px; background: linear-gradient(90deg, #1f4fd1 0 33%, #d3d8e4 33% 66%, #0f9d58 66%); }

/* ---------- Utilities ---------- */
.divider { height: 1px; background: var(--c-border); margin: 1rem 0; }
.min-w-0 { min-width: 0; }
.gap-xs { gap: .35rem; }
[x-cloak] { display: none; }
.fade-in { animation: fadeIn .25s ease both; }
@keyframes fadeIn { from { opacity: 0; transform: translateY(4px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { * { animation: none !important; transition: none !important; } }
.pt-sep { color: var(--c-primary); font-weight: 700; margin: 0 .45rem; }

/* Mobile menu button + collapsible statistics */
.menu-btn { margin-left: -.4rem; font-size: 1.6rem; color: var(--c-ink); }
.stats-toggle { width: 100%; display: flex; align-items: center; gap: .6rem; padding: .8rem 1rem; background: var(--c-surface); border: 1px solid var(--c-border); border-radius: var(--radius); box-shadow: var(--shadow); color: var(--c-ink); font-size: .92rem; text-align: left; }
.stats-toggle .summary { margin-left: auto; color: var(--c-muted); font-size: .8rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.stats-toggle .summary b { color: var(--c-ink); font-weight: 700; }
.stats-toggle .chev { transition: transform .2s; color: var(--c-muted); }
.stats-toggle:not(.collapsed) { border-bottom-left-radius: 0; border-bottom-right-radius: 0; }
.stats-toggle:not(.collapsed) .chev { transform: rotate(180deg); }
.stats-toggle:not(.collapsed) .summary { visibility: hidden; }
@media (max-width: 991.98px) {
  .stats-collapse .stats-row { padding: .75rem; margin: 0; background: var(--c-surface); border: 1px solid var(--c-border); border-top: 0; border-radius: 0 0 var(--radius) var(--radius); --bs-gutter-x: .6rem; --bs-gutter-y: .6rem; }
  .stats-collapse .stats-row .panel { box-shadow: none; background: var(--c-surface-2); }
}
@media (min-width: 992px) { .stats-collapse.collapse:not(.show) { display: block; } }
.avatar-img { object-fit: contain; padding: 0; background: transparent; border: 0; box-shadow: none; }

/* Login heading */
.auth-brand { display: flex; align-items: center; gap: .85rem; }
.auth-brand img { width: 60px; height: 60px; flex: none; }
.auth-brand h1 { margin: 0; font-size: 1.85rem; font-weight: 800; letter-spacing: -.03em; line-height: 1.1; color: var(--c-primary-700); }
.auth-sub { font-size: 1.05rem; font-weight: 600; color: var(--c-ink-2); margin: 0 0 1.25rem; }
@media (max-width: 575.98px) { .auth-brand h1 { font-size: 1.55rem; } .auth-brand img { width: 52px; height: 52px; } }