
/* ── PRINT SETUP ──────────────────────────────────────────── */
@page { size: A4 portrait; margin: 0; }

/* ── BASE ─────────────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
body { font-family: 'Nunito', sans-serif; }
#main { background: #d1d5db; }

/* ── SCREEN PRINT BAR ─────────────────────────────────────── */
.print-bar {
  background: #1E1B4B; color: #C4B5FD;
  text-align: center; padding: .45cm 1cm;
  font-size: 9.5pt; font-family: 'Nunito', sans-serif;
}
.print-bar strong { color: #fff; }
.print-btn {
  display: inline-block; margin-left: .5cm;
  background: #F97316; color: #fff; font-weight: 700; font-size: 9.5pt;
  padding: .12cm .5cm; border-radius: 100px; cursor: pointer;
  border: none; font-family: 'Nunito', sans-serif;
}
@media print { .print-bar { display: none; } }

/* ── SLIDE ────────────────────────────────────────────────── */
.slide {
  width: 21cm; height: 29.7cm;
  background: #fff;
  position: relative; overflow: hidden;
  margin: .6cm auto;
  display: flex; flex-direction: column;
  box-shadow: 0 4px 24px rgba(0,0,0,.18);
}
@media print {
  body { background: #fff; }
  #sidebar, .mobile-bar, #sb-overlay, .print-bar { display: none !important; }
  #main { margin-left: 0 !important; padding-top: 0 !important; background: #fff; }
  .slide { margin: 0; box-shadow: none; page-break-after: always; break-after: page; }
  .slide:last-child { page-break-after: avoid; break-after: avoid; }
}

/* ── SESSION COLOUR VARS ──────────────────────────────────── */
.s1 { --accent:#0EA5E9; --badge-bg:#0284C7; --banner-bg:rgba(14,165,233,.11); }
.s2 { --accent:#8B5CF6; --badge-bg:#7C3AED; --banner-bg:rgba(139,92,246,.11); }
.s3 { --accent:#F97316; --badge-bg:#EA580C; --banner-bg:rgba(249,115,22,.11);  }
.s4 { --accent:#16A34A; --badge-bg:#15803D; --banner-bg:rgba(22,163,74,.11);   }

/* ── HEADER BAND ──────────────────────────────────────────── */
.slide-header {
  flex-shrink: 0; height: 1.6cm;
  background: var(--accent);
  display: flex; align-items: center;
  padding: 0 .4cm; gap: .25cm;
}
.session-badge {
  background: var(--badge-bg); color: #fff;
  font-family: 'Fredoka One', cursive; font-size: 10.5pt;
  padding: .11cm .42cm; border-radius: 100px;
  white-space: nowrap; flex-shrink: 0;
}
.slide-title {
  color: #fff; font-family: 'Fredoka One', cursive;
  font-size: 20pt; line-height: 1; flex: 1;
}

/* ── FOOTER ───────────────────────────────────────────────── */
.slide-footer {
  flex-shrink: 0; height: .55cm;
  background: #F5F3FF;
  display: flex; align-items: center;
  padding: 0 1.1cm;
}
.slide-footer span { font-size: 7pt; color: #6B7280; }

/* ── CONTENT AREA ─────────────────────────────────────────── */
.slide-content {
  flex: 1; overflow: hidden;
  padding: .22cm 1.1cm .18cm;
  display: flex; flex-direction: column;
  gap: .14cm;
}

/* ── T1: SESSION COVER ────────────────────────────────────── */
.cover-banner {
  background: var(--banner-bg);
  border-radius: 8px;
  padding: .3cm .6cm .35cm;
  flex-shrink: 0;
}
.cover-num {
  font-family: 'Fredoka One', cursive;
  font-size: 42pt; color: var(--accent);
  opacity: .22; line-height: 1; margin-bottom: .08cm;
}
.cover-goal-label {
  font-weight: 800; font-size: 11pt; color: #1E1B4B;
}
.cover-goal-text {
  font-size: 12pt; color: #1E1B4B; margin-top: .06cm; line-height: 1.3;
}
.cover-bullets { list-style: none; margin-top: .18cm; }
.cover-bullets li {
  font-size: 10.5pt; color: #1E1B4B;
  padding: .05cm 0 .05cm 1.2em; position: relative; line-height: 1.3;
}
.cover-bullets li::before {
  content: '●'; color: var(--accent);
  position: absolute; left: 0; font-size: 6.5pt; top: .18cm;
}

/* ── SUBHEADING ───────────────────────────────────────────── */
.subh {
  font-weight: 700; font-size: 12pt; color: var(--accent);
  flex-shrink: 0; line-height: 1.15;
}
.subh-sm { font-weight: 700; font-size: 10.5pt; color: var(--accent); flex-shrink: 0; }

/* ── BODY TEXT ────────────────────────────────────────────── */
.body { font-size: 10pt; color: #1E1B4B; line-height: 1.35; flex-shrink: 0; }

/* ── DATA TABLE ───────────────────────────────────────────── */
.tbl {
  width: 100%; border-collapse: collapse;
  font-size: 9.5pt; flex-shrink: 0;
  border: 1px solid #DDD6FE; border-radius: 8px; overflow: hidden;
}
.tbl thead th {
  background: var(--accent); color: #fff;
  font-weight: 700; font-size: 9pt;
  padding: .1cm .25cm; text-align: left;
}
.tbl tbody tr:nth-child(odd)  td { background: #fff; }
.tbl tbody tr:nth-child(even) td { background: #F5F3FF; }
.tbl td {
  padding: .1cm .25cm; color: #1E1B4B;
  border-top: 1px solid #EDE9FE;
  vertical-align: middle; font-size: 9pt;
}
.tbl td:first-child { font-weight: 600; }
.tbl .total-row td { background: var(--banner-bg) !important; font-weight: 800; color: var(--accent); }

/* ── FILL-IN TABLE ────────────────────────────────────────── */
.ftbl {
  width: 100%; border-collapse: collapse;
  font-size: 9.5pt; flex-shrink: 0;
  border: 1px solid #DDD6FE; border-radius: 8px; overflow: hidden;
}
.ftbl thead th {
  background: var(--accent); color: #fff;
  font-weight: 700; font-size: 9pt;
  padding: .1cm .25cm; text-align: left;
}
.ftbl td {
  padding: .12cm .25cm; border-top: 1px solid #EDE9FE;
  vertical-align: middle;
}
.ftbl tr:nth-child(odd)  td { background: #fff; }
.ftbl tr:nth-child(even) td { background: #F5F3FF; }
.ftbl td:first-child { font-weight: 700; color: #1E1B4B; font-size: 9pt; }
.ftbl td.val {
  background: #F5F3FF !important;
  border-bottom: 1.5px dashed #9CA3AF;
  color: #C4B5FD; font-size: 9pt; min-width: 2.5cm;
}

/* ── CODE BLOCK ───────────────────────────────────────────── */
.code-wrap { flex-shrink: 0; }
.code-label {
  font-size: 8pt; color: #6B7280; font-weight: 700;
  margin-bottom: .05cm;
}
.code-block {
  background: #0D0B18; border: 1px solid #4C1D95;
  border-radius: 7px; padding: .18cm .3cm;
}
.code-block pre {
  font-family: 'Space Mono', monospace;
  font-size: 7.5pt; color: #E2DCFF;
  white-space: pre; line-height: 1.5; margin: 0;
}
.code-cols { display: flex; gap: .3cm; flex-shrink: 0; }
.code-cols .code-wrap { flex: 1; }

/* ── CALLOUTS ─────────────────────────────────────────────── */
.tip {
  background: #F5F3FF; border-left: 3px solid #8B5CF6;
  border-radius: 0 6px 6px 0; padding: .13cm .3cm;
  font-style: italic; font-size: 9pt; color: #4C1D95;
  line-height: 1.35; flex-shrink: 0;
}
.warn {
  background: #FFF7ED; border-left: 3px solid #F97316;
  border-radius: 0 6px 6px 0; padding: .14cm .32cm;
  flex-shrink: 0;
}
.warn-title { font-weight: 700; font-size: 10pt; color: #92400E; margin-bottom: .05cm; }
.warn p { font-size: 9pt; color: #92400E; line-height: 1.35; }
.hi {
  background: #DCFCE7; border-left: 3px solid #16A34A;
  border-radius: 0 6px 6px 0; padding: .13cm .3cm;
  font-weight: 700; font-size: 10pt; color: #15803D;
  flex-shrink: 0;
}

/* ── POINTS BADGE ROW ─────────────────────────────────────── */
.badge-row { display: flex; align-items: center; justify-content: space-between; flex-shrink: 0; }
.pts {
  background: #16A34A; color: #fff;
  font-weight: 700; font-size: 8.5pt;
  padding: .08cm .35cm; border-radius: 100px; white-space: nowrap;
}

/* ── NUMBERED STEPS ───────────────────────────────────────── */
.steps { flex-shrink: 0; display: flex; flex-direction: column; gap: .07cm; }
.step  { display: flex; gap: .22cm; align-items: baseline; }
.step-n {
  font-family: 'Fredoka One', cursive; font-size: 12pt;
  color: var(--accent); flex-shrink: 0;
  width: .52cm; text-align: right; line-height: 1.25;
}
.step-t { font-size: 10pt; color: #1E1B4B; line-height: 1.32; flex: 1; }
ic {
  font-family: 'Space Mono', monospace; font-size: 7.5pt;
  background: #EDE9FE; color: #5B21B6;
  padding: 1px 4px; border-radius: 4px;
  border: 1px solid #DDD6FE; font-style: normal;
}

/* ── CHECKLIST ────────────────────────────────────────────── */
.chk  { flex-shrink: 0; display: flex; flex-direction: column; gap: .04cm; }
.ci   { display: flex; gap: .2cm; align-items: flex-start; padding: .03cm 0; }
.cb   {
  flex-shrink: 0; display: inline-block;
  width: 13px; height: 13px;
  border: 2px solid #9CA3AF; border-radius: 3px;
  margin-top: 2px;
}
.ct   { font-size: 10pt; color: #1E1B4B; line-height: 1.32; flex: 1; }
cc    {
  font-family: 'Space Mono', monospace; font-size: 7.5pt;
  background: #EDE9FE; color: #5B21B6;
  padding: 1px 4px; border-radius: 3px;
  border: 1px solid #DDD6FE;
}

/* ── FILL-IN LINES ────────────────────────────────────────── */
.fil-line {
  display: flex; align-items: baseline; gap: .18cm;
  font-size: 10pt; flex-shrink: 0; padding: .03cm 0;
}
.fil-lbl { font-weight: 700; color: #1E1B4B; white-space: nowrap; flex-shrink: 0; }
.fil-dot { flex: 1; border-bottom: 1.5px dashed #9CA3AF; min-width: 3cm; height: .38cm; }

/* ── CLOSING LINE ─────────────────────────────────────────── */
.closing {
  font-size: 7.5pt; color: #9CA3AF; font-style: italic;
  text-align: center; margin-top: auto; padding-top: .08cm;
}

/* ── BROADCAST CHAIN (horizontal) ────────────────────────── */
.chain { display: flex; align-items: center; flex-wrap: wrap; gap: .14cm; flex-shrink: 0; }
.c-pill {
  background: var(--accent); color: #fff;
  font-weight: 700; font-size: 8.5pt;
  padding: .1cm .32cm; border-radius: 100px; white-space: nowrap;
}
.c-arr { color: #6B7280; font-size: 9pt; flex-shrink: 0; }

/* ── VERTICAL CHAIN ───────────────────────────────────────── */
.vchain { flex-shrink: 0; display: flex; flex-direction: column; gap: .04cm; }
.vc-row { display: flex; align-items: center; gap: .18cm; }
.vc-arr { font-family: 'Space Mono', monospace; font-size: 7.5pt; color: #6B7280; flex-shrink: 0; min-width: .85cm; text-align: right; }
.vc-pill { background: var(--accent); color: #fff; font-weight: 700; font-size: 8.5pt; padding: .07cm .28cm; border-radius: 100px; white-space: nowrap; }
.vc-pts  { font-size: 8pt; font-weight: 700; color: var(--accent); margin-left: .12cm; }
.vc-done { font-weight: 800; font-size: 9.5pt; color: #15803D; }
.vc-total{ font-size: 8.5pt; font-weight: 700; color: #15803D; margin-left: .12cm; }

/* ── BULLET LIST ──────────────────────────────────────────── */
.bul { list-style: none; flex-shrink: 0; }
.bul li {
  font-size: 10pt; color: #1E1B4B; line-height: 1.32;
  padding: .04cm 0 .04cm 1.1em; position: relative;
}
.bul li::before { content: '●'; color: var(--accent); position: absolute; left: 0; font-size: 6pt; top: .2cm; }

/* ── ITALIC NOTE ──────────────────────────────────────────── */
.note { font-size: 8.5pt; color: #6B7280; font-style: italic; flex-shrink: 0; }

/* ── DIVIDER ──────────────────────────────────────────────── */
.div { height: 1px; background: #EDE9FE; flex-shrink: 0; }

/* ── SPACER ───────────────────────────────────────────────── */
.sp { flex-shrink: 0; }
.sp-sm { height: .08cm; flex-shrink: 0; }

/* ── SESSION INTRO (compact — replaces full cover slide) ──── */
.session-intro {
  display: flex; align-items: flex-start; gap: .45cm; flex-shrink: 0;
  background: var(--banner-bg); border-left: 3.5px solid var(--accent);
  border-radius: 0 7px 7px 0; padding: .2cm .4cm;
}
.si-left { flex-shrink: 0; min-width: 4.2cm; }
.si-num {
  font-family: 'Fredoka One', cursive; font-size: 20pt;
  color: var(--accent); opacity: .28; line-height: 1;
}
.si-name {
  font-family: 'Fredoka One', cursive; font-size: 10.5pt;
  color: var(--accent); line-height: 1.1;
}
.si-goal {
  font-size: 8.5pt; color: #1E1B4B;
  font-weight: 700; line-height: 1.2; margin-top: .04cm;
}
.si-bul { list-style: none; flex: 1; margin: 0; padding: 0; }
.si-bul li {
  font-size: 8.5pt; color: #374151; line-height: 1.28;
  padding: .03cm 0 .03cm 1em; position: relative;
}
.si-bul li::before {
  content: '●'; color: var(--accent);
  position: absolute; left: 0; font-size: 5.5pt; top: .11cm;
}
