/* =============================================================================
   DC ACADEMY — Design System
   Paleta: Navy (#0B2545) · Azul (#2563EB) · Laranja (#F97316)
   ============================================================================= */

:root {
  /* Brand — alinhado à identidade DC Omni */
  --navy: #0b1220;
  --navy-700: #101a2e;
  --navy-600: #16233d;
  --blue: #1262f3;
  --blue-600: #0f52d6;
  --blue-50: #e8f0ff;
  --blue-light: #5b8dff;
  --orange: #f57402;
  --orange-600: #db6702;
  --orange-50: #fff7f0;
  --orange-light: #ff9a3c;

  /* Neutrals (slate) */
  --ink: #0b1220;
  --ink-2: #334155;
  --muted: #64748b;
  --line: #e6e9f0;
  --line-2: #eef1f7;
  --bg: #f8f9fb;
  --card: #ffffff;

  /* Status */
  --green: #1fa23e;
  --green-50: #e9f9ef;
  --red: #dc2626;
  --red-50: #fdecec;
  --amber: #f8a61b;

  /* System */
  --radius: 14px;
  --radius-sm: 10px;
  --radius-lg: 20px;
  --shadow-sm: 0 1px 2px rgba(11, 18, 32, 0.06), 0 1px 3px rgba(11, 18, 32, 0.08);
  --shadow: 0 4px 16px rgba(11, 18, 32, 0.08);
  --shadow-lg: 0 18px 50px rgba(11, 18, 32, 0.18);
  --font: 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, Arial, sans-serif;
  --maxw: 1160px;
}

* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }
body {
  font-family: var(--font);
  color: var(--ink);
  background: var(--bg);
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
}
a { color: var(--blue); text-decoration: none; }
img { max-width: 100%; }
button { font-family: inherit; cursor: pointer; }
::selection { background: var(--orange); color: #fff; }

/* ------------------------------------------------------------------ Layout */
.container { max-width: var(--maxw); margin: 0 auto; padding: 0 20px; }

/* ------------------------------------------------------------------ Header */
.appbar {
  position: sticky; top: 0; z-index: 50;
  background: var(--navy);
  color: #fff;
  box-shadow: 0 2px 0 rgba(0,0,0,0.06);
}
.appbar-inner {
  display: flex; align-items: center; gap: 18px;
  height: 64px; max-width: var(--maxw); margin: 0 auto; padding: 0 20px;
}
.brand { display: flex; align-items: center; gap: 11px; cursor: pointer; }
.brand-mark { width: 40px; height: 34px; display: grid; place-items: center; }
.brand-mark img { width: 100%; height: 100%; object-fit: contain; display: block;
  filter: drop-shadow(0 1px 3px rgba(0,0,0,.3)); }
.brand-name { font-weight: 800; letter-spacing: .2px; font-size: 17px; }
.brand-name span { color: var(--orange); }
.appbar nav { display: flex; gap: 4px; margin-left: 8px; }
.appbar nav a {
  color: #c9d6ea; padding: 8px 13px; border-radius: 9px; font-size: 14px; font-weight: 600;
  transition: background .15s, color .15s;
}
.appbar nav a:hover { background: rgba(255,255,255,.08); color: #fff; }
.appbar nav a.active { background: var(--blue); color: #fff; }
.appbar-spacer { flex: 1; }
.appbar-user {
  display: flex; align-items: center; gap: 9px; font-size: 13.5px; color: #c9d6ea;
  background: rgba(255,255,255,.07); padding: 6px 12px 6px 8px; border-radius: 999px;
}
.avatar {
  width: 28px; height: 28px; border-radius: 50%;
  background: linear-gradient(135deg, var(--orange), var(--blue));
  display: grid; place-items: center; color: #fff; font-weight: 700; font-size: 12px;
}

/* ------------------------------------------------------------------ Buttons */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  padding: 11px 20px; border-radius: 11px; border: 1px solid transparent;
  font-weight: 700; font-size: 14.5px; line-height: 1; transition: all .16s;
  background: var(--line-2); color: var(--ink-2);
}
.btn:hover { transform: translateY(-1px); }
.btn:active { transform: translateY(0); }
.btn-primary { background: linear-gradient(135deg, #1e40af 0%, #3b82f6 100%); color: #fff; box-shadow: 0 6px 16px rgba(18,98,243,.28); }
.btn-primary:hover { background: linear-gradient(135deg, #1b3aa0 0%, #2f74e6 100%); }
.btn-accent { background: linear-gradient(135deg, #F57402 0%, #ff9a3c 100%); color: #fff; box-shadow: 0 6px 16px rgba(245,116,2,.3); }
.btn-accent:hover { background: linear-gradient(135deg, #db6702 0%, #f58a2c 100%); }
.btn-ghost { background: transparent; border-color: var(--line); color: var(--ink-2); }
.btn-ghost:hover { background: var(--bg); border-color: var(--muted); }
.btn-lg { padding: 14px 26px; font-size: 15.5px; }
.btn-sm { padding: 8px 14px; font-size: 13px; }
.btn:disabled { opacity: .5; cursor: not-allowed; transform: none; }
.btn-block { width: 100%; }

/* ------------------------------------------------------------------ Chips / badges */
.chip {
  display: inline-flex; align-items: center; gap: 6px;
  font-size: 12px; font-weight: 700; padding: 4px 10px; border-radius: 999px;
  background: var(--blue-50); color: var(--blue-600);
}
.chip-orange { background: var(--orange-50); color: var(--orange-600); }
.chip-green { background: var(--green-50); color: var(--green); }
.chip-muted { background: var(--line-2); color: var(--muted); }
.chip-navy { background: rgba(11,37,69,.08); color: var(--navy); }

/* ------------------------------------------------------------------ Hero */
.hero {
  position: relative; overflow: hidden;
  background:
    radial-gradient(1200px 420px at 85% -10%, rgba(245,116,2,.20), transparent 60%),
    radial-gradient(950px 520px at 0% 0%, rgba(18,98,243,.34), transparent 55%),
    linear-gradient(160deg, #0b1220 0%, #000510 100%);
  color: #fff; padding: 54px 0 60px;
}
.hero::after {
  content: ""; position: absolute; right: -60px; top: 50%; transform: translateY(-50%);
  width: 460px; height: 340px; background: url("img/dc-monogram.svg") no-repeat center / contain;
  opacity: .12; pointer-events: none; z-index: 0;
}
.hero .container { position: relative; z-index: 1; }
.hero h1 { font-size: 40px; line-height: 1.1; margin: 12px 0 12px; letter-spacing: -.5px; }
.hero p { font-size: 17px; color: #c9d6ea; max-width: 620px; margin: 0 0 24px; }
.hero-stats { display: flex; gap: 30px; margin-top: 34px; flex-wrap: wrap; }
.hero-stat b { display: block; font-size: 26px; font-weight: 800; }
.hero-stat span { font-size: 13px; color: #9fb2cd; }

/* ------------------------------------------------------------------ Section */
.section { padding: 44px 0; }
.section-head { display: flex; align-items: flex-end; justify-content: space-between; margin-bottom: 22px; gap: 16px; flex-wrap: wrap; }
.section-head h2 { font-size: 23px; margin: 0; letter-spacing: -.3px; }
.section-head p { margin: 4px 0 0; color: var(--muted); font-size: 14.5px; }

/* ------------------------------------------------------------------ Course grid */
.grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; }
.course-card {
  background: var(--card); border: 1px solid var(--line); border-radius: var(--radius-lg);
  overflow: hidden; cursor: pointer; transition: transform .18s, box-shadow .18s, border-color .18s;
  display: flex; flex-direction: column;
}
.course-card:hover { transform: translateY(-4px); box-shadow: var(--shadow-lg); border-color: transparent; }
.course-cover {
  height: 132px; position: relative; display: grid; place-items: center;
  font-size: 46px; color: #fff;
}
.course-cover::after {
  content: ""; position: absolute; inset: 0;
  background: linear-gradient(135deg, rgba(255,255,255,.18), rgba(0,0,0,.12));
}
.course-cover .cover-emoji { position: relative; z-index: 1; filter: drop-shadow(0 4px 8px rgba(0,0,0,.3)); font-size: 52px; }
.course-cover .cover-watermark { position: absolute; right: -18px; bottom: -22px; width: 150px; height: 150px;
  object-fit: contain; opacity: .16; filter: brightness(0) invert(1); z-index: 0; pointer-events: none; }
.course-cover .cover-img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: 0; }
/* card com banner: mostra a imagem inteira (16:9), sem corte nem overlay escuro */
.course-cover.has-banner { height: auto; display: block; }
.course-cover.has-banner::after { display: none; }
.course-cover.has-banner .cover-img { position: static; inset: auto; height: auto; display: block; }
.course-cover .cover-emoji-badge { position: absolute; top: 10px; left: 10px; z-index: 2; font-size: 20px;
  width: 38px; height: 38px; border-radius: 10px; display: grid; place-items: center;
  background: rgba(11,18,32,.55); backdrop-filter: blur(4px); box-shadow: 0 2px 8px rgba(0,0,0,.25); }
.course-body { padding: 18px 18px 20px; display: flex; flex-direction: column; flex: 1; }
.course-body .chip { align-self: flex-start; margin-bottom: 11px; }
.course-body h3 { margin: 0 0 6px; font-size: 18px; letter-spacing: -.2px; }
.course-body .sub { color: var(--muted); font-size: 13.5px; margin: 0 0 16px; flex: 1; }
.course-meta { display: flex; align-items: center; gap: 14px; font-size: 12.5px; color: var(--muted); margin-bottom: 14px; }
.course-meta .dot { width: 3px; height: 3px; border-radius: 50%; background: var(--muted); }

/* progress bar */
.progress { height: 7px; background: var(--line-2); border-radius: 999px; overflow: hidden; }
.progress > i { display: block; height: 100%; background: linear-gradient(90deg, var(--blue), var(--orange)); border-radius: 999px; transition: width .5s ease; }
.progress-row { display: flex; align-items: center; gap: 10px; }
.progress-row .progress { flex: 1; }
.progress-row .pct { font-size: 12px; font-weight: 800; color: var(--ink-2); min-width: 34px; text-align: right; }

/* ------------------------------------------------------------------ Course detail layout */
/* banner personalizado do curso/aula */
.course-banner { background: var(--navy); padding: 0; }
.course-banner .container { padding-top: 0; padding-bottom: 0; }
.course-banner img { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover; border-radius: 0 0 14px 14px; }
.course-hero-slim { padding: 14px 0 16px !important; }
.lesson-banner { margin: 0; }
.lesson-banner img { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover; }
.course-hero { background: var(--navy); color: #fff; padding: 34px 0 30px; }
.course-hero .container { display: flex; gap: 24px; align-items: center; }
.course-hero .ch-mark {
  width: 84px; height: 84px; border-radius: 18px; display: grid; place-items: center; font-size: 40px; flex-shrink: 0;
  box-shadow: var(--shadow);
}
.course-hero h1 { margin: 0 0 6px; font-size: 28px; letter-spacing: -.4px; }
.course-hero .ch-sub { color: #c9d6ea; margin: 0 0 14px; font-size: 15px; }
.breadcrumb { display: flex; align-items: center; gap: 8px; font-size: 13px; color: #9fb2cd; margin-bottom: 12px; }
.breadcrumb a { color: #c9d6ea; }
.breadcrumb a:hover { color: #fff; }

.layout { display: grid; grid-template-columns: 340px 1fr; gap: 26px; padding: 28px 0 60px; align-items: start; }

/* curriculum sidebar */
.curriculum { background: var(--card); border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; position: sticky; top: 84px; }
.curriculum-head { padding: 16px 18px; border-bottom: 1px solid var(--line); }
.curriculum-head h4 { margin: 0 0 10px; font-size: 15px; }
.module { border-bottom: 1px solid var(--line-2); }
.module:last-child { border-bottom: none; }
.module-head {
  display: flex; align-items: center; gap: 10px; padding: 13px 18px; cursor: pointer; user-select: none;
  transition: background .12s;
}
.module-head:hover { background: var(--bg); }
.module-head .m-idx {
  width: 26px; height: 26px; border-radius: 8px; background: var(--navy); color: #fff;
  display: grid; place-items: center; font-size: 12px; font-weight: 800; flex-shrink: 0;
}
.module-head.locked .m-idx { background: var(--line); color: var(--muted); }
.module-head .m-title { font-weight: 700; font-size: 14px; flex: 1; }
.module-head .m-title small { display: block; font-weight: 500; color: var(--muted); font-size: 11.5px; margin-top: 1px; }
.module-head .m-chevron { color: var(--muted); transition: transform .2s; font-size: 12px; }
.module.open .m-chevron { transform: rotate(90deg); }
.lessons { display: none; padding: 2px 0 8px; }
.module.open .lessons { display: block; }

.lesson-item {
  display: flex; align-items: center; gap: 11px; padding: 9px 18px 9px 20px; cursor: pointer;
  border-left: 3px solid transparent; transition: background .12s;
}
.lesson-item:hover { background: var(--bg); }
.lesson-item.active { background: var(--blue-50); border-left-color: var(--blue); }
.lesson-item.locked { cursor: not-allowed; opacity: .62; }
.lesson-item .l-ico {
  width: 24px; height: 24px; border-radius: 7px; flex-shrink: 0; display: grid; place-items: center;
  font-size: 12px; background: var(--line-2); color: var(--ink-2);
}
.lesson-item.done .l-ico { background: var(--green-50); color: var(--green); }
.lesson-item.locked .l-ico { background: var(--line-2); color: var(--muted); }
/* miniatura de vídeo (frame do Loom) na lista de aulas */
.lesson-item .l-thumb { position: relative; width: 58px; height: 34px; border-radius: 7px; overflow: hidden;
  flex-shrink: 0; background: #0b1220; box-shadow: 0 1px 3px rgba(11,18,32,.2); }
.lesson-item .l-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.lesson-item .l-thumb .l-thumb-ov { position: absolute; inset: 0; display: grid; place-items: center;
  font-size: 11px; color: #fff; background: rgba(11,18,32,.28); text-shadow: 0 1px 3px rgba(0,0,0,.5); }
.lesson-item .l-thumb.done .l-thumb-ov { background: rgba(31,162,62,.55); font-size: 13px; }
.lesson-item .l-thumb.locked img { opacity: .45; filter: grayscale(.4); }
.lesson-item .l-thumb.locked .l-thumb-ov { background: rgba(11,18,32,.35); }
.lesson-item .l-title { font-size: 13.5px; font-weight: 600; flex: 1; }
.lesson-item .l-meta { font-size: 11px; color: var(--muted); display: flex; align-items: center; gap: 5px; }
.type-tag { font-size: 10px; font-weight: 800; text-transform: uppercase; letter-spacing: .4px; padding: 2px 6px; border-radius: 5px; background: var(--line-2); color: var(--muted); }

/* ------------------------------------------------------------------ Lesson top nav (sticky, acima da dobra) */
.lesson-topnav {
  position: sticky; top: 64px; z-index: 30;
  display: flex; align-items: center; justify-content: space-between; gap: 10px;
  background: var(--card); border: 1px solid var(--line); border-radius: var(--radius);
  padding: 9px 11px; margin-bottom: 16px; box-shadow: var(--shadow-sm);
}
.ltn-btn {
  display: inline-flex; align-items: center; gap: 7px;
  padding: 9px 15px; border-radius: 10px; font-weight: 700; font-size: 14px;
  border: 1px solid var(--line); color: var(--ink-2); background: #fff;
  transition: all .15s; white-space: nowrap; cursor: pointer;
}
.ltn-btn:hover { border-color: var(--blue); color: var(--blue); transform: translateY(-1px); }
.ltn-btn.ltn-primary { background: linear-gradient(135deg,#1e40af 0%,#3b82f6 100%); color:#fff; border-color: transparent; box-shadow: 0 4px 12px rgba(18,98,243,.25); }
.ltn-btn.ltn-primary:hover { color:#fff; }
.ltn-btn.ltn-accent { background: linear-gradient(135deg,#F57402 0%,#ff9a3c 100%); color:#fff; border-color: transparent; box-shadow: 0 4px 12px rgba(245,116,2,.25); }
.ltn-btn.ltn-accent:hover { color:#fff; }
.ltn-btn.disabled { opacity: .5; cursor: not-allowed; pointer-events: none; }
.ltn-ar { font-size: 15px; line-height: 1; }
.ltn-pos { font-size: 12.5px; font-weight: 700; color: var(--muted); text-align: center; white-space: nowrap; }

/* ------------------------------------------------------------------ Lesson content panel */
.panel { background: var(--card); border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden;
  overflow: clip; }   /* clip corta igual ao hidden, mas sem virar caixa de rolagem: é o que deixa o cabeçalho da planilha congelar na página */
.panel-pad { padding: 26px 30px 30px; }
.lesson-video { position: relative; width: 100%; aspect-ratio: 16 / 9; background: #000; }
.lesson-video iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.lesson-title { font-size: 24px; margin: 0 0 6px; letter-spacing: -.3px; }
.lesson-sub { color: var(--muted); font-size: 13.5px; margin: 0 0 22px; display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }

/* barra de evolução de tempo (aulas em vídeo) */
.watchbar { display: flex; align-items: center; gap: 12px; margin: 0 0 20px; padding: 10px 14px;
  background: var(--bg); border: 1px solid var(--line); border-radius: 11px; }
.watchbar-ico { color: var(--blue); font-size: 12px; flex-shrink: 0; }
.watchbar-track { flex: 1; height: 8px; background: var(--line); border-radius: 999px; overflow: hidden; }
.watchbar-track > i { display: block; height: 100%; width: 0; border-radius: 999px;
  background: linear-gradient(90deg, var(--blue), var(--orange)); transition: width .35s linear; }
.watchbar-label { font-size: 12px; font-weight: 700; color: var(--muted);
  font-variant-numeric: tabular-nums; min-width: 84px; text-align: right; flex-shrink: 0; }

/* descrição da aula */
.lesson-desc { font-size: 15.5px; color: var(--ink-2); line-height: 1.6; margin: 0 0 20px;
  padding-left: 13px; border-left: 3px solid var(--blue); font-weight: 500; }
.lesson-desc a { color: var(--blue); text-decoration: underline; font-weight: 700; word-break: break-word; }
.lesson-desc a:hover { color: var(--blue-600, #0b4fd1); }

/* embed customizado (código de incorporação) */
.lesson-embed { position: relative; width: 100%; background: #000; line-height: 0; }
.lesson-embed iframe { display: block; }

/* botão (CTA) no vídeo */
.lesson-cta { margin: 2px 0 20px; }

/* arquivos para download */
.lesson-files { margin: 20px 0; border: 1px solid var(--line); border-radius: var(--radius); padding: 15px 16px; background: var(--bg); }
.lesson-files-h { font-weight: 700; font-size: 13.5px; margin-bottom: 10px; }
.lesson-file { display: flex; align-items: center; gap: 11px; padding: 10px 12px; background: #fff; border: 1px solid var(--line);
  border-radius: 10px; margin-bottom: 8px; font-size: 14px; font-weight: 600; color: var(--ink-2); transition: border-color .12s, color .12s; }
.lesson-file:last-child { margin-bottom: 0; }
.lesson-file:hover { border-color: var(--blue); color: var(--blue); }
.lf-ic { width: 28px; height: 28px; border-radius: 7px; background: var(--blue-50); color: var(--blue); display: grid; place-items: center; font-weight: 800; flex-shrink: 0; }

/* editor: thumbnail + arquivos */
.adm-thumb-row { display: flex; gap: 8px; align-items: center; }
.adm-thumb-row .adm-input { flex: 1; }
.adm-thumb-prev { margin-top: 8px; }
.adm-thumb-prev img { max-width: 180px; max-height: 110px; border-radius: 8px; border: 1px solid var(--line); }
.adm-banner-prev img { max-width: 100%; max-height: 150px; }
.adm-files { display: flex; flex-direction: column; gap: 6px; }
.adm-file-row { display: flex; align-items: center; gap: 8px; padding: 8px 10px; background: var(--bg); border-radius: 8px; font-size: 13px; }
.adm-file-nm { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.prose { font-size: 15.5px; color: var(--ink-2); line-height: 1.72; }
.prose p { margin: 0 0 15px; }
.prose h3 { color: var(--ink); font-size: 18px; margin: 26px 0 10px; }
.prose h4 { color: var(--ink); font-size: 15px; margin: 20px 0 8px; padding-bottom: 4px; border-bottom: 1px solid rgba(245,116,2,.35); }
.prose h3.dc-sec { font-size: 21px; margin: 34px 0 14px; padding-bottom: 9px; border-bottom: 2px solid var(--orange); }
.prose h3.dc-model { font-size: 27px; line-height: 1.15; letter-spacing: -.01em; margin: 46px 0 16px; padding-bottom: 12px; border-bottom: 3px solid var(--orange); }
.prose ul, .prose ol { margin: 0 0 16px; padding-left: 22px; }
.prose li { margin-bottom: 7px; }
.prose strong { color: var(--ink); }
.prose a { font-weight: 600; }
.prose blockquote { margin: 0 0 16px; padding: 12px 16px; background: var(--blue-50); border-left: 3px solid var(--blue); border-radius: 0 8px 8px 0; color: var(--ink); }
.prose pre { background: var(--line-2); color: var(--ink); padding: 12px 14px; border-radius: 8px; font-size: 13px; line-height: 1.6; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; overflow-x: auto; white-space: pre-wrap; word-break: break-all; margin: 0 0 16px; }
.prose code { background: var(--line-2); color: var(--ink); padding: 1px 6px; border-radius: 5px; font-size: 13.5px; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; }
.prose .prose-table-wrap, .prose table { display: block; overflow-x: auto; }
.prose table { width: 100%; border-collapse: collapse; margin: 14px 0 20px; font-size: 14px; }
.prose th, .prose td { border: 1px solid var(--line); padding: 8px 11px; text-align: left; vertical-align: top; }
.prose thead th { background: var(--navy); color: #fff; font-weight: 700; white-space: nowrap; }
.prose tbody tr:nth-child(even) { background: var(--bg); }
.prose td code { white-space: nowrap; }

.pdf-box {
  display: flex; align-items: center; gap: 16px; padding: 18px 20px; border: 1px dashed var(--line);
  border-radius: var(--radius-sm); background: var(--bg); margin-bottom: 22px;
}
.pdf-box .pdf-ico { width: 44px; height: 44px; border-radius: 10px; background: var(--red-50); color: var(--red); display: grid; place-items: center; font-weight: 800; font-size: 12px; flex-shrink: 0; }
.pdf-box b { display: block; font-size: 14.5px; }
.pdf-box span { font-size: 12.5px; color: var(--muted); }

/* lesson footer nav */
.lesson-foot {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  padding: 18px 30px; border-top: 1px solid var(--line); background: #fbfcfe;
}

/* ------------------------------------------------------------------ Quiz */
.quiz {
  margin-top: 26px; border: 2px solid var(--line); border-radius: var(--radius); overflow: hidden;
}
.quiz-head { padding: 18px 24px; background: linear-gradient(135deg, var(--navy), var(--navy-600)); color: #fff; }
.quiz-head .qh-top { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.quiz-head h3 { margin: 0; font-size: 17px; display: flex; align-items: center; gap: 9px; }
.quiz-head .qh-sub { color: #b9c8de; font-size: 13px; margin: 6px 0 0; }
.quiz-body { padding: 8px 24px 22px; }

.q-block { padding: 20px 0; border-bottom: 1px solid var(--line-2); }
.q-block:last-child { border-bottom: none; }
.q-num { font-size: 12px; font-weight: 800; color: var(--blue); letter-spacing: .5px; text-transform: uppercase; }
.q-text { font-size: 16px; font-weight: 700; margin: 6px 0 14px; color: var(--ink); }
.options { display: flex; flex-direction: column; gap: 9px; }
.opt {
  display: flex; align-items: center; gap: 12px; padding: 13px 15px; border: 1.5px solid var(--line);
  border-radius: 11px; cursor: pointer; transition: all .13s; font-size: 14.5px; color: var(--ink-2);
  background: #fff;
}
.opt:hover { border-color: var(--blue); background: var(--blue-50); }
.opt .opt-mark {
  width: 22px; height: 22px; border-radius: 50%; border: 2px solid var(--line); flex-shrink: 0;
  display: grid; place-items: center; font-size: 12px; color: #fff; transition: all .13s;
}
.opt.selected { border-color: var(--blue); background: var(--blue-50); font-weight: 600; color: var(--ink); }
.opt.selected .opt-mark { background: var(--blue); border-color: var(--blue); }
/* graded states */
.opt.correct { border-color: var(--green); background: var(--green-50); color: var(--ink); font-weight: 600; }
.opt.correct .opt-mark { background: var(--green); border-color: var(--green); }
.opt.wrong { border-color: var(--red); background: var(--red-50); color: var(--ink); font-weight: 600; }
.opt.wrong .opt-mark { background: var(--red); border-color: var(--red); }
.opt.disabled { cursor: default; pointer-events: none; }

.q-feedback {
  margin-top: 12px; padding: 12px 15px; border-radius: 10px; font-size: 13.5px; display: none;
  border-left: 3px solid;
}
.q-feedback.show { display: block; }
.q-feedback.ok { background: var(--green-50); border-color: var(--green); color: #14532d; }
.q-feedback.no { background: var(--red-50); border-color: var(--red); color: #7f1d1d; }

.quiz-foot { padding: 18px 24px; border-top: 1px solid var(--line-2); display: flex; align-items: center; justify-content: space-between; gap: 14px; flex-wrap: wrap; }
.quiz-progress { font-size: 13px; color: var(--muted); font-weight: 600; }

/* quiz result banner */
.result {
  display: none; padding: 22px 24px; border-radius: var(--radius); margin-top: 4px;
  align-items: center; gap: 18px;
}
.result.show { display: flex; }
.result.pass { background: var(--green-50); border: 1.5px solid #bbe6c9; }
.result.fail { background: var(--red-50); border: 1.5px solid #f6cccc; }
.result .r-score {
  width: 78px; height: 78px; border-radius: 50%; flex-shrink: 0; display: grid; place-items: center;
  font-size: 22px; font-weight: 800; color: #fff;
}
.result.pass .r-score { background: var(--green); }
.result.fail .r-score { background: var(--red); }
.result h4 { margin: 0 0 4px; font-size: 18px; }
.result p { margin: 0; font-size: 13.5px; color: var(--ink-2); }

/* locked lesson state */
.locked-state { text-align: center; padding: 70px 30px; }
.locked-state .ls-ico { font-size: 48px; margin-bottom: 14px; }
.locked-state h3 { margin: 0 0 8px; font-size: 20px; }
.locked-state p { color: var(--muted); max-width: 400px; margin: 0 auto; font-size: 14.5px; }

/* completion / certificate */
.cert {
  text-align: center; padding: 50px 30px; background:
    radial-gradient(600px 200px at 50% 0%, rgba(249,115,22,.12), transparent 70%), var(--card);
  border: 1px solid var(--line); border-radius: var(--radius);
}
.cert .cert-badge { font-size: 60px; margin-bottom: 10px; }
.cert h2 { margin: 0 0 8px; }
.cert p { color: var(--muted); max-width: 460px; margin: 0 auto 20px; }

/* ------------------------------------------------------------------ Empty / misc */
.notice { background: var(--orange-50); border: 1px solid #fad9be; color: #9a4a06; padding: 12px 16px; border-radius: var(--radius-sm); font-size: 13.5px; line-height: 1.55; }

/* ------------------------------------------------------------------ Footer */
.footer { background: var(--navy); color: #9fb2cd; padding: 26px 0; margin-top: 40px; font-size: 13px; }
.footer .container { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; }

/* ------------------------------------------------------------------ Mobile */
.menu-toggle { display: none; background: rgba(255,255,255,.08); border: none; color: #fff; width: 40px; height: 40px; border-radius: 10px; font-size: 18px; }

@media (max-width: 940px) {
  .grid { grid-template-columns: repeat(2, 1fr); }
  .layout { grid-template-columns: 1fr; }
  /* aula primeiro, currículo depois — nav de aula acima da dobra */
  .layout > main { order: 1; }
  .layout > aside { order: 2; }
  .curriculum { position: static; }
  .hero h1 { font-size: 32px; }
}
@media (max-width: 680px) {
  .appbar nav { display: none; position: absolute; top: 64px; left: 0; right: 0; flex-direction: column; background: var(--navy-700); padding: 8px; gap: 2px; box-shadow: var(--shadow); }
  .appbar nav.open { display: flex; }
  .appbar nav a { padding: 12px 14px; }
  .menu-toggle { display: block; }
  .appbar-user .u-name { display: none; }
  .grid { grid-template-columns: 1fr; }
  .hero { padding: 38px 0 42px; }
  .hero h1 { font-size: 27px; }
  .course-hero { padding: 20px 0 20px; }
  .course-hero .container { flex-direction: row; align-items: center; gap: 14px; }
  .course-hero .ch-mark { width: 52px; height: 52px; border-radius: 13px; font-size: 26px; }
  .course-hero h1 { font-size: 20px; }
  .course-hero .ch-sub { display: none; }
  .course-hero .breadcrumb { margin-bottom: 6px; }
  .course-hero .progress-row { margin-top: 8px; max-width: 100%; }
  .panel-pad { padding: 20px 18px 22px; }
  .lesson-foot { padding: 14px 18px; }
  .quiz-body { padding: 4px 16px 16px; }
  .quiz-head, .quiz-foot { padding-left: 16px; padding-right: 16px; }
  .result { flex-direction: column; text-align: center; }
  .section-head { flex-direction: column; align-items: flex-start; }
  .lesson-topnav { top: 64px; padding: 8px 10px; }
  .ltn-btn { padding: 9px 13px; font-size: 13.5px; }
}
/* telas bem estreitas: mantém só as setas para os botões caberem */
@media (max-width: 400px) {
  .ltn-tx { display: none; }
  .ltn-btn { padding: 9px 12px; }
  .ltn-ar { font-size: 17px; }
  .ltn-pos { font-size: 11.5px; }
}

/* =============================================================================
   PAINEL DO INSTRUTOR (admin)
   ============================================================================= */
/* login */
.adm-login-wrap { min-height: 100vh; display: grid; place-items: center; padding: 24px;
  background: radial-gradient(900px 500px at 50% -10%, rgba(18,98,243,.28), transparent 55%), var(--navy); }
.adm-login { background: var(--card); border-radius: var(--radius-lg); box-shadow: var(--shadow-lg);
  padding: 32px 30px; width: 100%; max-width: 400px; text-align: center; }
.adm-login h2 { margin: 8px 0 4px; font-size: 21px; }
.adm-login p { color: var(--muted); font-size: 13.5px; margin: 0 0 18px; }
.adm-login-err { color: var(--red); font-size: 13px; min-height: 18px; margin: 8px 0; font-weight: 600; }
.adm-back { display: inline-block; margin-top: 16px; font-size: 13px; color: var(--muted); }

/* topbar */
.adm-topbar { position: sticky; top: 0; z-index: 50; background: var(--navy); color: #fff; }
.adm-topbar-in { max-width: 1240px; margin: 0 auto; height: 60px; display: flex; align-items: center; gap: 10px; padding: 0 20px; }
.adm-topbar .brand-name { color: #fff; }

.adm-wrap { max-width: 1240px; margin: 0 auto; padding: 20px; }

/* banner publicar */
.adm-banner { background: var(--card); border: 1px solid var(--line); border-radius: var(--radius);
  padding: 16px 18px; margin-bottom: 18px; display: flex; flex-wrap: wrap; gap: 14px; align-items: center; box-shadow: var(--shadow-sm); }
.adm-banner-main { flex: 1; min-width: 260px; display: flex; flex-direction: column; gap: 3px; }
.adm-banner-main b { font-size: 14.5px; }
.adm-banner-main span { font-size: 12.5px; color: var(--muted); }
.adm-banner-main code { background: var(--bg); padding: 1px 5px; border-radius: 5px; font-size: 12px; color: var(--ink-2); }
.adm-banner-actions { display: flex; gap: 8px; flex-wrap: wrap; }
.adm-publish-box { flex-basis: 100%; border-top: 1px solid var(--line-2); padding-top: 14px; margin-top: 2px; }
.adm-publish-box p { font-size: 13px; color: var(--ink-2); margin: 0 0 8px; }
.adm-json { width: 100%; height: 150px; font-family: ui-monospace, Menlo, Consolas, monospace; font-size: 11.5px;
  border: 1px solid var(--line); border-radius: 10px; padding: 10px; background: var(--bg); color: var(--ink-2); resize: vertical; margin-bottom: 8px; }
.adm-copy-ok { color: var(--green); font-weight: 700; font-size: 13px; margin-left: 10px; }

.adm-flash { background: var(--green-50); border: 1px solid #bbe6c9; color: #14532d; padding: 10px 14px;
  border-radius: 10px; font-size: 13.5px; font-weight: 600; margin-bottom: 14px; }
.adm-flash.err { background: var(--red-50); border-color: #f6cccc; color: #7f1d1d; }

/* layout master-detail */
.adm-layout { display: grid; grid-template-columns: 320px 1fr; gap: 20px; align-items: start; }

/* árvore */
.adm-tree-wrap { position: sticky; top: 76px; }
.adm-tree { background: var(--card); border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; }
.adm-tree-head { display: flex; align-items: center; justify-content: space-between; padding: 12px 14px; border-bottom: 1px solid var(--line); }
.adm-tree-head h3 { margin: 0; font-size: 15px; }
.adm-empty { padding: 30px 16px; text-align: center; color: var(--muted); font-size: 13.5px; }

.adm-node { display: flex; align-items: center; gap: 8px; padding: 8px 10px; cursor: pointer; border-radius: 8px; transition: background .12s; position: relative; }
/* arrastar e soltar (alça ☰) */
.adm-grip { flex-shrink: 0; cursor: grab; color: var(--muted); font-size: 15px; line-height: 1;
  padding: 0 2px; opacity: .55; user-select: none; transition: opacity .12s, color .12s; }
.adm-grip:hover { opacity: 1; color: var(--blue); }
.adm-grip:active { cursor: grabbing; }
.adm-node.adm-dragging { opacity: .4; }
.adm-node.drop-before { box-shadow: inset 0 3px 0 0 var(--blue); }
.adm-node.drop-after { box-shadow: inset 0 -3px 0 0 var(--blue); }
.adm-node:hover { background: var(--bg); }
.adm-node.active { background: var(--blue-50); }
.adm-node-ico { width: 24px; height: 24px; border-radius: 6px; flex-shrink: 0; display: grid; place-items: center;
  font-size: 11px; font-weight: 800; background: var(--line-2); color: var(--ink-2); }
.adm-node.course > .adm-node-ico { color: #fff; }
.adm-node-t { flex: 1; font-size: 13.5px; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.adm-tag { font-size: 9.5px; font-weight: 800; text-transform: uppercase; background: var(--orange-50); color: var(--orange-600); padding: 1px 5px; border-radius: 4px; }
.adm-course { border-bottom: 1px solid var(--line-2); padding: 6px; }
.adm-course:last-child { border-bottom: none; }
.adm-modules { padding-left: 8px; }
.adm-lessons { padding-left: 20px; }
.adm-node.module { font-weight: 600; }
/* flechinha de abrir/recolher módulo */
.adm-caret { width: 14px; flex-shrink: 0; text-align: center; font-size: 11px; line-height: 1;
  color: var(--muted); cursor: pointer; transition: transform .15s ease; user-select: none; }
.adm-caret:hover { color: var(--blue); }
.adm-mod.open > .adm-node > .adm-caret,
.adm-course.open > .adm-node > .adm-caret { transform: rotate(90deg); }
/* módulos e cursos começam recolhidos; abrem só quando .open */
.adm-mod > .adm-lessons { display: none; }
.adm-mod.open > .adm-lessons { display: block; }
.adm-course > .adm-modules { display: none; }
.adm-course.open > .adm-modules { display: block; }
.adm-mod-count { flex-shrink: 0; font-size: 11px; font-weight: 700; color: var(--muted);
  background: var(--line-2); border-radius: 999px; padding: 1px 8px; }
.adm-add { background: none; border: 1px dashed var(--line); color: var(--muted); border-radius: 8px;
  padding: 6px 10px; font-size: 12px; font-weight: 700; cursor: pointer; margin: 4px 0 4px 10px; transition: all .12s; }
.adm-add:hover { border-color: var(--blue); color: var(--blue); }
.adm-add.sm { padding: 4px 9px; font-size: 11.5px; margin: 4px 0; }

.adm-node-actions { display: none; gap: 2px; }
.adm-node:hover .adm-node-actions { display: flex; }
.adm-node-actions button { width: 22px; height: 22px; border: none; background: var(--line-2); color: var(--ink-2);
  border-radius: 6px; font-size: 11px; cursor: pointer; line-height: 1; }
.adm-node-actions button:hover { background: var(--blue); color: #fff; }
.adm-node-actions button.del:hover { background: var(--red); }
.adm-node-actions button:disabled { opacity: .3; cursor: not-allowed; }

/* editor */
.adm-editor { background: var(--card); border: 1px solid var(--line); border-radius: var(--radius); min-height: 400px; }
.adm-placeholder { text-align: center; padding: 70px 30px; color: var(--muted); }
.adm-placeholder h3 { color: var(--ink); margin: 10px 0 6px; }
.adm-placeholder p { font-size: 14px; max-width: 380px; margin: 0 auto; }
.adm-form { padding: 22px 24px 24px; }
.adm-form-head { margin-bottom: 18px; }
.adm-crumb { font-size: 11px; font-weight: 800; text-transform: uppercase; letter-spacing: .5px; color: var(--blue); }
.adm-form-head h2 { margin: 3px 0 0; font-size: 20px; }
.adm-field { margin-bottom: 15px; display: flex; flex-direction: column; }
.adm-field label { font-size: 12.5px; font-weight: 700; color: var(--ink-2); margin-bottom: 6px; }
.adm-field small { font-size: 11.5px; color: var(--muted); margin-top: 5px; }
.adm-input { font-family: inherit; font-size: 14px; padding: 10px 12px; border: 1.5px solid var(--line);
  border-radius: 10px; background: #fff; color: var(--ink); width: 100%; transition: border-color .12s; }
.adm-input:focus { outline: none; border-color: var(--blue); }
textarea.adm-input { resize: vertical; line-height: 1.5; }
.adm-grid2 { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.adm-grid3 { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 14px; }
.adm-form-foot { margin-top: 18px; padding-top: 16px; border-top: 1px solid var(--line-2); display: flex; justify-content: flex-end; gap: 10px; flex-wrap: wrap; }
.adm-notify-hint { display: block; text-align: right; margin-top: 8px; color: var(--muted); font-size: 12px; }

/* quiz builder */
.adm-quiz-toggle { margin: 18px 0 10px; padding: 12px 14px; background: var(--bg); border-radius: 10px; }
.adm-check { display: flex; align-items: center; gap: 9px; font-size: 13.5px; cursor: pointer; }
.adm-check input { width: 17px; height: 17px; accent-color: var(--blue); }
.adm-quiz { border: 1.5px solid var(--line); border-radius: 12px; padding: 16px; background: #fcfdff; }
.adm-q { border: 1px solid var(--line); border-radius: 10px; padding: 14px; margin-bottom: 12px; background: #fff; }
.adm-q-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 8px; font-size: 13.5px; }
.adm-opts { display: flex; flex-direction: column; gap: 7px; margin: 8px 0; }
.adm-opt-row { display: flex; align-items: center; gap: 8px; }
.adm-opt-row .adm-correct { width: 18px; height: 18px; accent-color: var(--green); flex-shrink: 0; }
.adm-mini { border: none; background: var(--line-2); color: var(--muted); border-radius: 6px; padding: 5px 8px;
  font-size: 11px; font-weight: 700; cursor: pointer; flex-shrink: 0; }
.adm-mini:hover { background: var(--red); color: #fff; }
.adm-mini.del { }
.adm-sublabel { display: block; font-size: 11.5px; font-weight: 700; color: var(--muted); margin: 10px 0 4px; }
.adm-quiz-head-row { margin-bottom: 6px; }

@media (max-width: 860px) {
  .adm-layout { grid-template-columns: 1fr; }
  .adm-tree-wrap { position: static; }
}
@media (max-width: 560px) {
  .adm-grid2, .adm-grid3 { grid-template-columns: 1fr; }
  .adm-banner-actions { width: 100%; }
}

/* =============================================================================
   AUTENTICAÇÃO — login, perfil, gestão de usuários, menu do header
   ============================================================================= */
/* login */
.auth-wrap { min-height: 100vh; display: grid; place-items: center; padding: 24px;
  background:
    radial-gradient(900px 480px at 18% 8%, rgba(18,98,243,.30), transparent 55%),
    radial-gradient(900px 480px at 88% 96%, rgba(245,116,2,.24), transparent 55%),
    linear-gradient(160deg,#0b1220 0%,#000510 100%); }
.auth-card { background: var(--card); border-radius: var(--radius-lg); box-shadow: var(--shadow-lg);
  padding: 34px 32px; width: 100%; max-width: 400px; text-align: center; }
.auth-logo { width: 138px; height: 138px; margin: 0 auto 6px; display: grid; place-items: center; }
.auth-logo img { width: 100%; height: 100%; object-fit: contain; }
.auth-card h2 { margin: 0 0 2px; font-size: 22px; }
.auth-card h2 span { color: var(--orange); }
.auth-card > p { color: var(--muted); font-size: 13.5px; margin: 0 0 20px; }
.auth-lbl { display: block; text-align: left; font-size: 12.5px; font-weight: 700; color: var(--ink-2); margin: 12px 0 6px; }
.auth-err { color: var(--red); font-size: 13px; min-height: 18px; margin: 10px 0 4px; font-weight: 600; }
.auth-help { font-size: 12px; color: var(--muted); margin: 16px 0 0; }

/* páginas perfil / usuários */
.auth-page { padding: 22px 0 60px; background: var(--bg); min-height: calc(100vh - 60px); }
.prof-head { margin-bottom: 16px; }
.prof-card { background: var(--card); border: 1px solid var(--line); border-radius: var(--radius); padding: 26px 28px; max-width: 640px; }
.prof-card h2 { margin: 0 0 20px; }
.prof-avatar-row { display: flex; align-items: center; gap: 18px; margin-bottom: 22px; }
.prof-avatar .avatar.xl { box-shadow: 0 6px 18px rgba(11,18,32,.18); }
.prof-hint { font-size: 12px; color: var(--muted); margin: 8px 0 0; }

/* avatar com foto + tamanhos */
.avatar { overflow: hidden; }
.avatar img { width: 100%; height: 100%; border-radius: 50%; object-fit: cover; display: block; }
.avatar.sm { width: 30px; height: 30px; font-size: 12px; }
.avatar.xl { width: 92px; height: 92px; font-size: 30px; border: 3px solid #fff; }

/* menu do usuário no header */
.appbar-user { position: relative; cursor: pointer; user-select: none; }
.user-menu { position: absolute; top: calc(100% + 10px); right: 0; min-width: 210px; background: #fff;
  border-radius: 12px; box-shadow: var(--shadow-lg); padding: 6px; display: none; z-index: 60; }
.user-menu.open { display: block; }
.user-menu a { display: block; padding: 10px 12px; border-radius: 8px; color: var(--ink-2); font-size: 14px; font-weight: 600; }
.user-menu a:hover { background: var(--bg); color: var(--blue); }

/* sino de notificações */
.appbar-bell { position: relative; cursor: pointer; font-size: 18px; margin-right: 8px; user-select: none; line-height: 1; }
.notif-badge { position: absolute; top: -7px; right: -7px; background: var(--orange); color: #fff; font-size: 10px;
  font-weight: 800; min-width: 16px; height: 16px; border-radius: 999px; display: grid; place-items: center; padding: 0 4px; box-shadow: 0 1px 4px rgba(0,0,0,.3); }
.notif-panel { position: absolute; top: calc(100% + 12px); right: -8px; width: 330px; max-width: 88vw; max-height: 440px;
  overflow-y: auto; background: #fff; border-radius: 12px; box-shadow: var(--shadow-lg); display: none; z-index: 61; color: var(--ink); }
.notif-panel.open { display: block; }
.notif-head { padding: 12px 15px; font-weight: 800; font-size: 13px; border-bottom: 1px solid var(--line); position: sticky; top: 0; background: #fff; }
.notif-item { padding: 11px 15px; border-bottom: 1px solid var(--line-2); }
.notif-item:last-child { border-bottom: none; }
.notif-link { cursor: pointer; transition: background .12s; }
.notif-link:hover { background: var(--blue-50); }
.notif-go { color: var(--blue); font-weight: 700; margin-left: 8px; }
.notif-t { font-weight: 700; font-size: 13.5px; }
.notif-b { font-size: 12.5px; color: var(--ink-2); margin-top: 2px; line-height: 1.42; }
.notif-time { font-size: 11px; color: var(--muted); margin-top: 4px; }
.notif-empty { padding: 28px 16px; text-align: center; color: var(--muted); font-size: 13px; }
.notif-enable { padding: 10px 12px; border-bottom: 1px solid var(--line-2); }

/* pop-up de boas-vindas */
.welcome-card { background: #fff; border-radius: var(--radius-lg); box-shadow: var(--shadow-lg); width: 100%; max-width: 440px; padding: 30px 30px 24px; text-align: center; }
.welcome-logo { width: 96px; height: 96px; margin: 0 auto 4px; }
.welcome-logo img { width: 100%; height: 100%; object-fit: contain; }
.welcome-card h2 { margin: 4px 0 12px; font-size: 22px; }
.welcome-card p { color: var(--ink-2); font-size: 14.5px; line-height: 1.6; margin: 0 0 12px; }
.welcome-note { color: var(--muted) !important; font-size: 13px !important; }
.welcome-card .btn { margin-top: 8px; }
.welcome-skip { display: inline-block; margin-top: 12px; font-size: 13px; color: var(--muted); }

/* tabela de usuários */
.users-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 14px; flex-wrap: wrap; margin-bottom: 14px; }
.users-head h2 { margin: 0; }
.users-head p { margin: 3px 0 0; color: var(--muted); font-size: 13.5px; }
.users-table-wrap { background: var(--card); border: 1px solid var(--line); border-radius: var(--radius); overflow-x: auto; }
.users-table { width: 100%; border-collapse: collapse; font-size: 13.5px; min-width: 720px; }
.users-table th { text-align: left; padding: 12px 14px; font-size: 11.5px; text-transform: uppercase; letter-spacing: .4px; color: var(--muted); border-bottom: 1px solid var(--line); }
.users-table td { padding: 11px 14px; border-bottom: 1px solid var(--line-2); vertical-align: middle; }
.users-table tr:last-child td { border-bottom: none; }
.u-row { display: flex; align-items: center; gap: 10px; font-weight: 600; }
.u-pass { background: var(--bg); padding: 3px 8px; border-radius: 6px; font-family: ui-monospace, Menlo, monospace; font-size: 12.5px; }
.u-actions { display: flex; gap: 6px; white-space: nowrap; }

/* aviso de sessão vencida — fica por cima de tudo, em qualquer tela */
#dca-sessao { position: fixed; left: 12px; right: 12px; bottom: 12px; z-index: 20500;
  display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
  background: #7A1F1F; color: #fff; border-radius: 12px; padding: 12px 14px;
  font-size: 13.5px; line-height: 1.45; box-shadow: 0 10px 30px rgba(0,0,0,.35); }
#dca-sessao span { flex: 1 1 200px; }
#dca-sessao button { border: 0; border-radius: 8px; padding: 8px 12px; font-family: inherit;
  font-weight: 700; font-size: 13px; cursor: pointer; }
#dca-sessao .dca-sessao-btn { background: #fff; color: #7A1F1F; }
#dca-sessao .dca-sessao-x { background: rgba(255,255,255,.16); color: #fff; padding: 8px 10px; }

/* rótulo que só aparece no cartão do celular */
.u-so-cel { display: none; }

/* ===== Gestão de usuários no celular: a tabela vira um cartão por pessoa =====
   Cinco colunas com cinco ações não cabem em 390px — na tela pequena cada
   usuário ocupa um cartão, com os rótulos vindos do data-lb e os botões em
   grade, do tamanho do dedo. */
@media (max-width: 760px) {
  .users-table-wrap { border: 0; background: transparent; overflow: visible; }
  .users-table { display: block; min-width: 0; width: 100%; font-size: 14px; }
  .users-table thead { display: none; }
  .users-table tbody, .users-table tr, .users-table td { display: block; width: auto; }
  .users-table tr { background: var(--card); border: 1px solid var(--line); border-radius: 14px;
    padding: 12px 14px 14px; margin-bottom: 12px; }
  .users-table td { border: 0; padding: 4px 0; }
  .users-table tr:last-child td { border-bottom: 0; }
  .users-table td.u-nome { font-size: 15.5px; padding-bottom: 8px; }
  .users-table td[data-lb] { display: flex; align-items: baseline; gap: 8px; }
  .users-table td[data-lb]::before { content: attr(data-lb); flex: 0 0 62px; font-size: 11px;
    text-transform: uppercase; letter-spacing: .4px; color: var(--muted); }
  .users-table td.u-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; white-space: normal;
    margin-top: 10px; padding-top: 12px; border-top: 1px solid var(--line-2); }
  .users-table td.u-actions .btn { width: 100%; justify-content: center; padding: 9px 6px; font-size: 12.5px; }
  .users-table td.u-actions .u-papel { grid-column: 1 / -1; width: 100%; }
  .users-head { align-items: stretch; }
  .users-head > div:last-child { display: grid !important; grid-template-columns: 1fr 1fr; width: 100%; }
  .users-head > div:last-child .btn { width: 100%; justify-content: center; }
  .u-so-cel { display: inline; }
  .users-table td.u-actions .u-remover { border-color: #f3c9c4; color: #a3271b; }
}
.pw-cell { display: flex; align-items: center; gap: 6px; }
.pw-eye { border: none; background: var(--line-2); border-radius: 6px; padding: 3px 7px; cursor: pointer; font-size: 12px; line-height: 1; }
.pw-eye:hover { background: var(--line); }
.wa-btn { background: #25d366; color: #fff; box-shadow: 0 4px 12px rgba(37,211,102,.28); }
.wa-btn:hover { background: #1fb857; color: #fff; }
.dca-toast { position: fixed; left: 50%; bottom: 26px; transform: translateX(-50%) translateY(20px);
  background: var(--navy); color: #fff; padding: 12px 20px; border-radius: 12px; font-size: 14px; font-weight: 600;
  box-shadow: var(--shadow-lg); opacity: 0; pointer-events: none; transition: opacity .2s, transform .2s; z-index: 200; }
.dca-toast.show { opacity: 1; transform: translateX(-50%) translateY(0); }

/* modal de envio de acesso */
.send-modal-bg { position: fixed; inset: 0; background: rgba(11,18,32,.55); z-index: 150; display: grid; place-items: center; padding: 20px; }
.send-modal { background: var(--card); border-radius: var(--radius-lg); box-shadow: var(--shadow-lg); width: 100%; max-width: 460px; padding: 22px 24px; max-height: 90vh; overflow-y: auto; }
.send-modal-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 6px; font-size: 16px; }
.send-sub { color: var(--muted); font-size: 13px; margin: 0 0 16px; }
.send-lbl { font-size: 12.5px; font-weight: 700; color: var(--ink-2); margin: 14px 0 8px; }
.send-opts { display: flex; flex-direction: column; gap: 6px; }
.send-opt { display: flex; align-items: center; gap: 9px; padding: 10px 12px; border: 1.5px solid var(--line); border-radius: 10px; cursor: pointer; font-size: 14px; font-weight: 600; transition: border-color .12s, background .12s; }
.send-opt:hover { border-color: var(--blue); background: var(--blue-50); }
.send-opt input { accent-color: var(--blue); }
.send-actions { display: flex; gap: 8px; justify-content: flex-end; margin-top: 16px; flex-wrap: wrap; }
.send-hint { font-weight: 500; color: var(--muted); font-size: 11.5px; }
.send-opt.allopt { background: var(--bg); }
.send-partial { font-weight: 700; font-size: 11px; color: var(--orange-600, #db6702); background: rgba(245,116,2,.12); border-radius: 999px; padding: 1px 8px; margin-left: auto; }
.send-mods { display: flex; flex-direction: column; gap: 2px; margin: -2px 0 4px 30px; padding-left: 10px; border-left: 2px solid var(--line-2); }
.send-mod { display: flex; align-items: center; gap: 8px; padding: 5px 8px; border-radius: 8px; cursor: pointer; font-size: 13px; font-weight: 500; color: var(--ink-2); }
.send-mod:hover { background: var(--blue-50); }
.send-mod input { accent-color: var(--blue); }

/* painel de progresso (master) */
.prog-course { border: 1px solid var(--line); border-radius: 12px; padding: 14px; margin-bottom: 12px; }
.prog-course-h { display: flex; align-items: center; justify-content: space-between; gap: 10px; font-weight: 700; font-size: 14px; margin-bottom: 8px; }
.prog-pct { color: var(--muted); font-size: 12.5px; font-weight: 700; white-space: nowrap; }
.prog-tests { margin-top: 12px; display: flex; flex-direction: column; gap: 6px; }
.prog-test { display: flex; align-items: center; justify-content: space-between; gap: 10px; font-size: 12.5px; padding: 6px 10px; background: var(--bg); border-radius: 8px; }
.prog-test span { color: var(--ink-2); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.prog-test b { white-space: nowrap; }
.prog-pend { color: var(--muted); font-weight: 500; }
.prog-notests { margin-top: 8px; font-size: 12px; color: var(--muted); }

/* ---- Landing page (deslogado) ---- */
.lp-hero { padding: 62px 0 66px; }
.lp-cta { margin-top: 6px; }
.lp-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; }
.lp-card { background: var(--card); border: 1px solid var(--line); border-radius: var(--radius); padding: 22px 20px; box-shadow: var(--shadow-sm); }
.lp-ic { font-size: 30px; margin-bottom: 10px; }
.lp-card h3 { margin: 0 0 6px; font-size: 16px; }
.lp-card p { margin: 0; color: var(--muted); font-size: 13.5px; line-height: 1.5; }
.lp-band { background: linear-gradient(135deg, #0b1220, #16233d); color: #fff; text-align: center; padding: 50px 20px; }
.lp-band h2 { margin: 0 0 8px; font-size: 24px; }
.lp-band p { margin: 0 0 20px; color: #c9d6ea; }

/* ---- modal de login ---- */
.login-modal-bg { position: fixed; inset: 0; background: rgba(11,18,32,.6); backdrop-filter: blur(3px);
  z-index: 200; display: grid; place-items: center; padding: 20px; }
.login-modal-bg .auth-card { position: relative; }
.login-close { position: absolute; top: 12px; right: 12px; border: none; background: var(--line-2);
  width: 30px; height: 30px; border-radius: 8px; cursor: pointer; font-size: 13px; color: var(--muted); }
.login-close:hover { background: var(--line); }

@media (max-width: 860px) { .lp-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 480px) { .lp-grid { grid-template-columns: 1fr; } }
.add-user-form { background: var(--card); border: 1px solid var(--line); border-radius: var(--radius); padding: 18px 20px; margin-bottom: 16px; }

@media (max-width: 560px) {
  .appbar-user .u-name { display: none; }
  .prof-card { padding: 20px 16px; }
}

/* ============================================================
   Playbook de Vendas — paleta DC (escopado em .playbook)
   navy #0D1B2E · azul #1B4F9E · laranja #E8821A
   ============================================================ */
.prose .playbook{ --pb-navy:#0D1B2E; --pb-blue:#1B4F9E; --pb-orange:#E8821A;
  --pb-lblue:#EDF3FF; --pb-lorange:#FFF8EE; --pb-check:#73AC59; --pb-green:#27AE60;
  --pb-text:#2D3A4A; --pb-muted:#5A6A7E; --pb-line:#E3E8F0;
  color:var(--pb-text); font-size:15px; }
.prose .playbook h2{ font-size:19px; color:var(--pb-blue); margin:34px 0 10px; padding-top:6px; border:0; }
.prose .playbook h3{ font-size:16px; color:var(--pb-navy); margin:24px 0 8px; border:0; }
.prose .playbook h4{ font-size:13px; color:var(--pb-muted); margin:18px 0 6px; text-transform:uppercase; letter-spacing:.06em; border:0; opacity:1; }
.prose .playbook p{ font-size:15px; line-height:1.62; margin:8px 0; }
.prose .playbook ul,.prose .playbook ol{ font-size:15px; line-height:1.55; padding-left:22px; margin:8px 0 14px; }
.prose .playbook li{ margin:5px 0; }
.prose .playbook ul.check{ list-style:none; padding-left:2px; }
.prose .playbook ul.check li{ padding-left:26px; position:relative; }
.prose .playbook ul.check li:before{ content:"✔"; position:absolute; left:0; color:var(--pb-check); font-weight:bold; }

/* alerta laranja */
.prose .playbook .note{ background:var(--pb-lorange); border-left:4px solid var(--pb-orange);
  padding:12px 16px; border-radius:6px; font-size:14px; line-height:1.55; margin:14px 0; color:#5b3d18; }

/* cartao de mensagem (azul, copiavel) */
.prose .playbook .msg{ background:var(--pb-lblue); border:1px solid #D8E4F8; border-radius:10px; margin:14px 0; overflow:hidden; }
.prose .playbook .msg-head{ display:flex; justify-content:space-between; align-items:center; gap:10px;
  padding:9px 14px; background:#E2EBFA; border-bottom:1px solid #D0DDF3; }
.prose .playbook .msg-label{ font-size:12.5px; font-weight:700; color:var(--pb-blue); }
.prose .playbook .copy{ background:var(--pb-navy); color:#fff; border:0; border-radius:6px;
  padding:6px 14px; font-size:12px; font-weight:700; cursor:pointer; white-space:nowrap; font-family:inherit; }
.prose .playbook .copy:hover{ background:var(--pb-blue); }
.prose .playbook .copy.ok{ background:var(--pb-green); }
.prose .playbook .msg-body{ padding:10px 16px 12px; }
.prose .playbook .msg-body p{ margin:8px 0; font-size:15px; line-height:1.6; }
.prose .playbook .msg-body p.sdr{ color:var(--pb-muted); font-size:13px; font-style:italic;
  border-top:1px dashed #C6D3EA; padding-top:8px; margin-top:10px; word-break:break-word; }

/* variaveis e placeholders */
.prose .playbook .var{ background:#FFE9CF; color:#9A4F00; border-radius:4px; padding:0 4px;
  font-family:Menlo,Consolas,monospace; font-size:12.5px; white-space:nowrap; }
.prose .playbook .ph{ background:#FFF3C4; color:#7A5A00; border-radius:4px; padding:0 4px; }

/* tabelas */
.prose .playbook .tw{ overflow-x:auto; margin:14px 0; }
.prose .playbook table{ border-collapse:collapse; width:100%; font-size:13.5px; margin:0; }
.prose .playbook th{ background:var(--pb-navy); color:#fff; text-align:left; padding:9px 11px; font-size:12px; }
.prose .playbook td{ padding:9px 11px; border:1px solid var(--pb-line); vertical-align:top; line-height:1.45; background:#fff; }
.prose .playbook tbody tr:nth-child(odd) td{ background:#F7F9FC; }

/* objecoes */
.prose .playbook .obj{ margin:20px 0; padding:16px 18px; border:1px solid var(--pb-line);
  border-left:5px solid var(--pb-orange); border-radius:10px; background:#fff; }
.prose .playbook .obj-name{ font-size:16px; font-weight:700; color:var(--pb-navy); }
.prose .playbook .obj-rev{ font-size:13.5px; color:var(--pb-muted); line-height:1.5; margin:6px 0; }
.prose .playbook .obj .msg{ margin-bottom:0; }

/* cabecalho do capitulo */
.prose .playbook .pb-head{ display:flex; gap:14px; align-items:center; margin:6px 0 12px; padding-bottom:14px; border-bottom:3px solid var(--pb-orange); }
.prose .playbook .pb-emoji{ font-size:34px; line-height:1; }
.prose .playbook .pb-label{ font-size:11px; letter-spacing:.16em; color:var(--pb-blue); font-weight:700; }
.prose .playbook .pb-title{ font-size:22px; color:var(--pb-navy); font-weight:800; line-height:1.15; }

/* indice do playbook */
.prose .playbook .pb-index{ background:var(--pb-navy); color:#fff; border-radius:12px; padding:16px 18px; margin:0 0 22px; }
.prose .playbook .pb-index-h{ font-size:11px; letter-spacing:.14em; color:#AAB8CC; font-weight:700; margin-bottom:10px; }
.prose .playbook .pb-chaps{ list-style:none; margin:0 0 4px; padding:0; display:grid; grid-template-columns:1fr 1fr; gap:2px 14px; }
.prose .playbook .pb-chaps li{ margin:0; }
.prose .playbook .pb-chaps a{ display:block; color:#D7E0EE; text-decoration:none; padding:5px 8px; border-radius:6px; font-size:12.5px; line-height:1.3; }
.prose .playbook .pb-chaps a b{ font-weight:600; }
.prose .playbook .pb-chaps a:hover{ background:rgba(255,255,255,.08); color:#fff; }
.prose .playbook .pb-chaps li.on a{ background:var(--pb-orange); color:#fff; }
.prose .playbook .pb-sub-h{ font-size:11px; letter-spacing:.12em; color:#AAB8CC; font-weight:700; margin:12px 0 6px; border-top:1px solid rgba(255,255,255,.1); padding-top:12px; }
.prose .playbook .pb-sub{ list-style:none; margin:0; padding:0; }
.prose .playbook .pb-sub li{ margin:0; }
.prose .playbook .pb-sub a{ display:block; color:#C9D6E8; text-decoration:none; padding:4px 8px; border-radius:6px; font-size:12.5px; }
.prose .playbook .pb-sub a:hover{ background:rgba(232,130,26,.18); color:#fff; }

/* toast de copia (global do playbook) */
.pb-toast{ position:fixed; bottom:26px; left:50%; transform:translateX(-50%) translateY(20px);
  background:#0D1B2E; color:#fff; padding:10px 18px; border-radius:8px; font-size:13px;
  opacity:0; transition:.25s; pointer-events:none; z-index:9999; box-shadow:0 6px 20px rgba(0,0,0,.25); }
.pb-toast.show{ opacity:1; transform:translateX(-50%); }

@media (max-width:640px){
  .prose .playbook .pb-chaps{ grid-template-columns:1fr; }
  .prose .playbook .pb-head{ gap:10px; }
  .prose .playbook .pb-title{ font-size:19px; }
  .prose .playbook .msg-head{ flex-wrap:wrap; }
}

/* ============================================================
   Playbook — índice flutuante + edição inline (master)
   ============================================================ */
body.pb-has-nav .prose .playbook .pb-index{ display:none; } /* substituído pelo flutuante */

#pb-nav{ position:fixed; z-index:60; --pbn-navy:#0D1B2E; --pbn-orange:#E8821A; font-family:Arial,Helvetica,sans-serif; }
#pb-nav .pb-nav-bd{ display:none; }
#pb-nav .pb-nav-tab{ position:fixed; display:flex; align-items:center; gap:6px; border:0; cursor:pointer;
  background:var(--pbn-navy); color:#fff; font-family:inherit; font-weight:700; box-shadow:0 6px 18px rgba(0,0,0,.28); }
#pb-nav .pb-nav-tab span{ font-size:12px; }
#pb-nav.open .pb-nav-tab{ display:none; }
#pb-nav .pb-nav-panel{ display:none; background:var(--pbn-navy); color:#fff; box-shadow:0 12px 40px rgba(0,0,0,.35); }
#pb-nav.open .pb-nav-panel{ display:flex; flex-direction:column; }
#pb-nav .pb-nav-top{ display:flex; align-items:center; justify-content:space-between; padding:12px 14px;
  border-bottom:1px solid rgba(255,255,255,.1); font-weight:800; font-size:13px; }
#pb-nav .pb-nav-close{ background:transparent; border:0; color:#AAB8CC; font-size:20px; line-height:1; cursor:pointer; padding:0 8px; border-radius:6px; }
#pb-nav .pb-nav-close:hover{ background:rgba(255,255,255,.1); color:#fff; }
#pb-nav .pb-nav-scroll{ overflow-y:auto; padding:10px 12px 14px; }
#pb-nav .pb-nav-sec, #pb-nav .pb-sub-h{ font-size:10.5px; letter-spacing:.14em; color:#8FA0B6; font-weight:700; text-transform:uppercase; margin:6px 2px; }
#pb-nav .pb-sub-h{ border-top:1px solid rgba(255,255,255,.1); padding-top:12px; margin-top:10px; }
#pb-nav .pb-chaps, #pb-nav .pb-sub{ list-style:none; margin:0; padding:0; }
#pb-nav .pb-chaps li, #pb-nav .pb-sub li{ margin:0; }
#pb-nav .pb-chaps a, #pb-nav .pb-sub a{ display:block; color:#D7E0EE; text-decoration:none; padding:6px 9px; border-radius:7px; font-size:12.5px; line-height:1.3; }
#pb-nav .pb-chaps a b{ font-weight:600; }
#pb-nav .pb-chaps a:hover, #pb-nav .pb-sub a:hover{ background:rgba(255,255,255,.09); color:#fff; }
/* aula (capítulo) atual: contorno sutil + fonte levemente maior, sem laranjão */
#pb-nav .pb-chaps li.on > a{ color:#fff; font-weight:700; font-size:13px; background:rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.16); box-shadow:inset 2px 0 0 var(--pbn-orange); }
#pb-nav .pb-nav-edit{ width:100%; margin-top:12px; border:0; border-radius:8px; padding:9px;
  font-family:inherit; font-weight:700; font-size:12.5px; cursor:pointer; }
/* "ir ao topo" mora na barra do título do índice, ao lado do nome do módulo */
#pb-nav .pb-nav-tt{ flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
#pb-nav .pb-nav-topbtn{ flex:0 0 auto; border:1px solid rgba(255,255,255,.28); background:rgba(255,255,255,.12);
  color:#fff; border-radius:7px; padding:5px 9px; margin:0 4px 0 8px; font-family:inherit; font-weight:700;
  font-size:11.5px; line-height:1; cursor:pointer; white-space:nowrap; }
#pb-nav .pb-nav-topbtn:hover{ background:rgba(255,255,255,.24); }
#pb-nav .pb-nav-edit{ background:var(--pbn-orange); color:#fff; margin-top:8px; }

@media (min-width:981px){
  #pb-nav .pb-nav-tab{ top:50%; right:0; transform:translateY(-50%); flex-direction:column; padding:14px 8px; border-radius:10px 0 0 10px; }
  #pb-nav .pb-nav-tab span{ writing-mode:vertical-rl; margin-top:2px; }
  #pb-nav .pb-nav-panel{ position:fixed; top:88px; right:16px; width:264px; max-height:calc(100vh - 116px); border-radius:12px; }
}
@media (max-width:980px){
  #pb-nav .pb-nav-tab{ bottom:18px; right:18px; padding:12px 16px; border-radius:24px; font-size:15px; }
  #pb-nav.open .pb-nav-bd{ display:block; position:fixed; inset:0; background:rgba(6,12,22,.5); z-index:1; }
  #pb-nav .pb-nav-panel{ position:fixed; left:0; right:0; bottom:0; max-height:66vh; border-radius:16px 16px 0 0; z-index:2; }
  #pb-nav .pb-nav-scroll{ padding-bottom:24px; }
}

#pb-editbar{ position:fixed; left:50%; bottom:20px; transform:translateX(-50%); background:#0D1B2E; color:#fff;
  border-radius:12px; padding:10px 14px; display:none; gap:10px; align-items:center; z-index:10001; box-shadow:0 10px 30px rgba(0,0,0,.35); }
body.pb-editing #pb-editbar{ display:flex; }
#pb-editbar b{ font-size:12.5px; font-weight:700; }
#pb-editbar button{ border:0; border-radius:8px; padding:8px 12px; font-family:inherit; font-weight:700; font-size:12.5px; cursor:pointer; }
#pb-editbar .pb-eb-save{ background:#27AE60; color:#fff; }
#pb-editbar .pb-eb-cancel{ background:rgba(255,255,255,.14); color:#fff; }
#pb-editbar .pb-eb-reset{ background:rgba(255,255,255,.14); color:#FFC46B; }
body.pb-editing .prose .playbook [contenteditable="true"]{ outline:1px dashed rgba(232,130,26,.55); outline-offset:3px; border-radius:3px; cursor:text; }
body.pb-editing .prose .playbook [contenteditable="true"]:focus{ outline:2px solid #E8821A; background:#FFFBF5; }
body.pb-editing .prose .playbook .copy, body.pb-editing .prose .playbook .copy-b{ pointer-events:none; opacity:.4; }
body.pb-editing #pb-nav{ display:none; }

/* ===== Playbook: subtópicos aninhados + recolher menu do curso ===== */
#pb-nav .pb-subnest{ list-style:none; margin:1px 0 8px; padding:2px 0 2px 10px; border-left:2px solid rgba(232,130,26,.45); }
#pb-nav .pb-subnest li{ margin:0; }
#pb-nav .pb-subnest a{ display:block; color:#B9C7DC; text-decoration:none; padding:5px 9px; border-radius:6px; font-size:12px; line-height:1.32; }
#pb-nav .pb-subnest a:hover{ background:rgba(255,255,255,.08); color:#fff; }
/* seção atual da aula: contorno sutil + fonte levemente maior */
#pb-nav .pb-subnest a.current{ color:#fff; font-weight:700; font-size:12.5px; background:rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.16); box-shadow:inset 2px 0 0 var(--pbn-orange); }
#pb-nav .pb-chaps li.on{ background:rgba(255,255,255,.04); border-radius:8px; padding-bottom:2px; }

/* botão de recolher — dentro do cabeçalho "Conteúdo do curso" */
.curriculum-head{ position:relative; }
.pb-aside-collapse{ position:absolute; top:12px; right:10px; width:28px; height:28px; border-radius:8px;
  border:1px solid #DDE3EC; background:#fff; color:#0B2545; cursor:pointer; font-size:15px; line-height:1;
  display:flex; align-items:center; justify-content:center; font-family:Arial,Helvetica,sans-serif; }
.pb-aside-collapse:hover{ background:#F2F5FA; border-color:#C7D2E2; }
/* botão discreto para reabrir o menu quando recolhido */
#pb-aside-open{ display:none; }
@media (min-width:981px){
  #pb-aside-open{ position:fixed; left:14px; top:150px; z-index:59; width:34px; height:34px; border-radius:50%;
    border:1px solid #DDE3EC; background:#fff; color:#0B2545; font-size:20px; line-height:1; cursor:pointer;
    display:flex; align-items:center; justify-content:center; box-shadow:0 4px 14px rgba(0,0,0,.14); }
  #pb-aside-open:hover{ background:#F2F5FA; }
  /* reserva espaço p/ o índice à direita só quando aberto E menu não recolhido */
  body.pb-has-nav.pb-nav-open:not(.pb-aside-collapsed) .layout{ padding-right:300px; }
  /* menu esquerdo recolhido: conteúdo centralizado EXATAMENTE no centro da tela */
  body.pb-has-nav.pb-aside-collapsed .layout{ grid-template-columns:1fr; padding:28px 0 60px; }
  body.pb-has-nav.pb-aside-collapsed .layout > aside{ display:none; }
  body.pb-has-nav.pb-aside-collapsed .layout > main{ margin:0 auto; max-width:860px; }
  /* com o índice aberto, estreita o conteúdo p/ manter-se centrado sem tocar o índice */
  body.pb-has-nav.pb-aside-collapsed.pb-nav-open .layout > main{ max-width:min(860px, calc(100vw - 640px)); }
}

/* ===== Playbook: balões de mensagem (técnica WhatsApp — copiar 1 a 1) ===== */
.prose .playbook .msg-bubble{ position:relative; background:#fff; border:1px solid #DCE6F7; border-radius:12px;
  padding:9px 76px 9px 13px; margin:8px 0; }
.prose .playbook .msg-bubble p{ margin:0; font-size:15px; line-height:1.55; }
.prose .playbook .msg-bubble .copy-b{ position:absolute; top:7px; right:7px; background:transparent; border:1px solid transparent;
  color:var(--pb-blue); cursor:pointer; font-size:11.5px; font-weight:700; font-family:inherit; padding:4px 9px; border-radius:7px; opacity:.6; }
.prose .playbook .msg-bubble:hover .copy-b{ opacity:1; border-color:#CFE0F7; background:#F2F7FF; }
.prose .playbook .msg-bubble .copy-b:hover{ background:#E6F0FD; }
.prose .playbook .msg-bubble .copy-b.ok{ color:#fff; background:var(--pb-green); border-color:var(--pb-green); opacity:1; }
/* o "Copiar tudo" no topo fica mais discreto que o copiar do balão */
.prose .playbook .msg-head .copy{ font-size:11.5px; padding:5px 11px; }
@media (max-width:640px){ .prose .playbook .msg-bubble{ padding:9px 13px; } .prose .playbook .msg-bubble .copy-b{ position:static; display:inline-block; margin-top:6px; opacity:1; border-color:#CFE0F7; background:#F2F7FF; } }

/* ===== Playbook: botão de ouvir (voz) + ações do balão ===== */
.prose .playbook .pb-say{ border:0; background:transparent; cursor:pointer; padding:2px 6px; border-radius:6px;
  line-height:1; color:var(--pb-blue); vertical-align:middle; font-family:inherit; }
.prose .playbook .pb-say::before{ content:"🔊"; font-size:13px; }
.prose .playbook .pb-say.speaking{ background:var(--pb-orange); }
.prose .playbook .pb-say.speaking::before{ content:"⏸"; }
/* prosa e notas: aparece no hover */
.prose .playbook p .pb-say, .prose .playbook .note .pb-say{ opacity:0; margin-left:4px; transition:opacity .15s; }
.prose .playbook p:hover .pb-say, .prose .playbook .note:hover .pb-say, .prose .playbook .pb-say:focus{ opacity:.5; }
.prose .playbook p .pb-say:hover, .prose .playbook .note .pb-say:hover{ opacity:1; background:#EAF1FD; }
/* ações do balão (ouvir + copiar juntos, no canto) */
.prose .playbook .msg-bubble{ padding-right:120px; }
.prose .playbook .msg-bubble.solo{ padding-right:54px; }
.prose .playbook .bubble-actions{ position:absolute; top:6px; right:8px; display:flex; gap:2px; align-items:center; }
.prose .playbook .bubble-actions .copy-b{ position:static; top:auto; right:auto; opacity:.7; }
.prose .playbook .bubble-actions .pb-say{ opacity:.7; }
.prose .playbook .msg-bubble:hover .bubble-actions .copy-b, .prose .playbook .msg-bubble:hover .bubble-actions .pb-say{ opacity:1; }
@media (max-width:640px){
  .prose .playbook .msg-bubble, .prose .playbook .msg-bubble.solo{ padding-right:13px; }
  .prose .playbook .bubble-actions{ position:static; margin-top:8px; }
  .prose .playbook p .pb-say, .prose .playbook .note .pb-say{ opacity:.5; }
}

/* ===== Playbook índice: recolher o capítulo atual (accordion) ===== */
#pb-nav .pb-chaps li.on > a{ position:relative; }
#pb-nav .pb-chaps li.on > a::after{ content:"▾"; float:right; margin-left:8px; opacity:.7; font-size:11px; }
#pb-nav .pb-chaps li.on.collapsed > a::after{ content:"▸"; }
#pb-nav .pb-chaps li.on.collapsed .pb-subnest{ display:none; }

/* =============================================================================
   AJUSTES DE LEITURA E DE MOBILE (agosto/2026)
   1. Corrige o estouro horizontal que cortava o cabeçalho e o banner no celular
   2. Banner do curso e da aula ocupando a largura toda no celular
   3. Tipografia ~2px maior em todo o app (celular e desktop)
   ============================================================================= */

/* 1. Itens de grid têm min-width:auto — uma tabela larga dentro da aula impedia
   a coluna de encolher e empurrava a página para ~895px num celular de 390px.
   Com min-width:0 a coluna encolhe e a tabela rola sozinha. */
.layout > main, .layout > aside { min-width: 0; }
.panel, .prose, .prose .playbook { min-width: 0; }
.prose table { max-width: 100%; }

/* 2. Banner de ponta a ponta no celular (sem a margem lateral do container) */
@media (max-width: 680px) {
  .course-banner .container { padding-left: 0; padding-right: 0; }
  .course-banner img { border-radius: 0; }
  .panel > .lesson-banner { margin: 0; }
  .panel > .lesson-banner img { border-radius: 0; }
  .layout { padding-top: 0; }
  main > .panel:first-child { border-top-left-radius: 0; border-top-right-radius: 0; }
}

/* 3. Tipografia maior — o playbook é material de leitura longa no celular */
.prose { font-size: 17.5px; }
.prose p { margin: 0 0 16px; }
.prose h3 { font-size: 20px; }
.prose h4 { font-size: 17px; }
.prose h3.dc-sec { font-size: 23px; }
.prose ul, .prose ol { font-size: 17.5px; }
.prose table { font-size: 16px; }
.prose blockquote { font-size: 17px; }
.prose code { font-size: 15px; }

.prose .playbook p { font-size: 17px; line-height: 1.65; }
.prose .playbook ul, .prose .playbook ol { font-size: 17px; }
.prose .playbook h2 { font-size: 21px; }
.prose .playbook h3 { font-size: 18px; }
.prose .playbook h4 { font-size: 15px; }
.prose .playbook table { font-size: 15.5px; }
.prose .playbook th { font-size: 14px; }
.prose .playbook .note { font-size: 16.5px; }
.prose .playbook .msg-bubble p { font-size: 17px; }
.prose .playbook .msg-label { font-size: 14.5px; }
.prose .playbook .sdr, .prose .playbook .obj-rev { font-size: 15.5px; }
.prose .playbook .obj-name { font-size: 18px; }
.prose .pb-txt p { font-size: 17px; }
.prose .pb-label { font-size: 14.5px; }
.prose .pb-sdr { font-size: 15px; }
.prose .pb-obj-n { font-size: 18px; }
.prose .pb-obj-r { font-size: 15.5px; }

.lesson-title { font-size: 27px; }
.lesson-desc { font-size: 17px; }
.q-text { font-size: 18px; }
.opt { font-size: 16.5px; }
.q-feedback { font-size: 15.5px; }

@media (max-width: 680px) {
  .prose { font-size: 17px; }
  .prose .playbook p, .prose .playbook ul, .prose .playbook ol,
  .prose .playbook .msg-bubble p, .prose .pb-txt p { font-size: 16.5px; }
  .lesson-title { font-size: 23px; }
}

/* --- Botão de enviar por WhatsApp, ao lado de cada Copiar --- */
.prose .playbook .pb-wa{ background:#25D366; color:#0a3d21; border:0; border-radius:6px;
  padding:6px 12px; font-size:12px; font-weight:800; cursor:pointer; white-space:nowrap;
  font-family:inherit; margin-left:6px; }
.prose .playbook .pb-wa:hover{ background:#1eb356; color:#fff; }
.prose .playbook .msg-bubble .pb-wa-b{ background:transparent; color:#128C7E; border:1px solid transparent;
  padding:3px 6px; font-size:14px; opacity:.75; margin-left:0; }
.prose .playbook .msg-bubble:hover .pb-wa-b{ opacity:1; border-color:#BFE9D2; background:#EDFBF3; }
.prose .playbook .msg-bubble{ padding-right:150px; }
.prose .playbook .msg-bubble.solo{ padding-right:96px; }
body.pb-editing .prose .playbook .pb-wa{ pointer-events:none; opacity:.4; }
@media (max-width:640px){
  .prose .playbook .msg-bubble, .prose .playbook .msg-bubble.solo{ padding-right:13px; }
  .prose .playbook .pb-wa{ margin-left:5px; padding:6px 10px; }
}

/* --- Ouvir por bloco: some com o botão de cada frase da prosa --- */
.prose .playbook.pb-said p .pb-say,
.prose .playbook.pb-said li .pb-say,
.prose .playbook.pb-said .note .pb-say{ display:none; }
.prose .playbook .pb-say.pb-say-group{ display:inline-flex; align-items:center; gap:6px;
  opacity:1; margin:2px 0 16px; padding:7px 13px; border:1px solid var(--pb-line,#E3E8F0);
  background:#fff; color:var(--pb-blue,#1B4F9E); font-size:13.5px; font-weight:700; border-radius:999px; }
.prose .playbook .pb-say.pb-say-group:hover{ background:#EAF1FD; }
.prose .playbook .pb-say.pb-say-group::before{ font-size:15px; }
.prose .playbook .pb-say.pb-say-group.speaking{ background:var(--pb-orange,#E8821A); color:#fff; border-color:transparent; }
.brand-name{ white-space:nowrap; }
@media (max-width:400px){ .appbar-inner{ gap:10px; } .brand-name{ font-size:16px; } }

/* =============================================================================
   ESTABILIDADE DE LAYOUT E ÍNDICE MAIOR
   - imagens com espaço reservado: a página não "dança" quando elas carregam
   - fonte maior no índice de capítulos (na aula e na barra flutuante)
   ============================================================================= */

/* o card de curso com banner crescia ao carregar a imagem — agora o espaço é reservado */
.course-cover.has-banner .cover-img { aspect-ratio: 16 / 9; object-fit: cover; }
.lesson-banner img, .course-banner img { aspect-ratio: 16 / 9; }
/* âncora de rolagem: mudanças fora da tela não empurram o que você está lendo */
.layout > main { overflow-anchor: auto; }

/* índice de capítulos dentro da aula */
.prose .playbook .pb-index-h { font-size: 12.5px; }
.prose .playbook .pb-chaps a { font-size: 14.5px; padding: 6px 9px; }
.prose .playbook .pb-sub-h { font-size: 12.5px; }
.prose .playbook .pb-sub a { font-size: 14.5px; padding: 5px 9px; }

/* índice flutuante (lateral no desktop, folha no celular) */
#pb-nav .pb-nav-sec, #pb-nav .pb-sub-h { font-size: 12px; }
#pb-nav .pb-chaps a, #pb-nav .pb-sub a { font-size: 14.5px; padding: 7px 10px; }
#pb-nav .pb-chaps li.on > a { font-size: 15px; }

/* ================== Tour guiado do Playbook ================== */
#dca-tour{ display:none; font-family:Arial,Helvetica,sans-serif; }
#dca-tour.on{ display:block; }
#dca-tour .tour-block{ position:fixed; inset:0; z-index:20000; background:transparent; }
#dca-tour .tour-dim{ position:fixed; inset:0; z-index:20000; background:rgba(9,14,24,.62); display:none; }
#dca-tour .tour-ring{ position:fixed; z-index:20001; border-radius:10px; pointer-events:none; display:none;
  border:2px solid #E8821A; box-shadow:0 0 0 4px rgba(232,130,26,.25), 0 0 0 9999px rgba(9,14,24,.62);
  transition:top .18s ease, left .18s ease, width .18s ease, height .18s ease; }
#dca-tour .tour-card{ position:fixed; z-index:20002; width:min(340px, calc(100vw - 24px));
  background:#fff; color:#2D3A4A; border-radius:14px; box-shadow:0 18px 50px rgba(0,0,0,.38);
  padding:16px 16px 12px; box-sizing:border-box; }
#dca-tour .tour-card[data-seta="b"]::before,
#dca-tour .tour-card[data-seta="t"]::before{ content:""; position:absolute; left:var(--seta-x,50%); margin-left:-8px;
  border:8px solid transparent; }
#dca-tour .tour-card[data-seta="b"]::before{ top:-16px; border-bottom-color:#fff; }
#dca-tour .tour-card[data-seta="t"]::before{ bottom:-16px; border-top-color:#fff; }
#dca-tour .tour-x{ position:absolute; top:8px; right:8px; width:30px; height:30px; border:0; border-radius:8px;
  background:#F2F5FA; color:#5A6A7E; font-size:14px; cursor:pointer; line-height:1; }
#dca-tour .tour-x:hover{ background:#E6ECF5; color:#0B2545; }
#dca-tour .tour-t{ font-size:16px; font-weight:800; color:#0D1B2E; padding-right:34px; line-height:1.3; }
#dca-tour .tour-p{ font-size:14.5px; line-height:1.55; color:#3B4859; margin-top:7px; }
#dca-tour .tour-demo{ display:none; margin-top:11px; padding:10px; border:1px dashed #DDE3EC; border-radius:10px;
  background:#FBFCFE; pointer-events:none; max-height:210px; overflow:hidden; }
#dca-tour .tour-demo .playbook{ font-size:14px; }
#dca-tour .tour-demo .msg{ margin:0; }
#dca-tour .tour-demo .msg-bubble, #dca-tour .tour-demo .msg-bubble.solo{ padding-right:13px; margin:6px 0 0; }
#dca-tour .tour-demo .bubble-actions{ position:static; margin-top:8px; opacity:1; }
#dca-tour .tour-demo .bubble-actions .copy-b, #dca-tour .tour-demo .bubble-actions .pb-say,
#dca-tour .tour-demo .bubble-actions .pb-wa-b{ opacity:1; border-color:#CFE0F7; background:#F2F7FF; }
#dca-tour .tour-demo .bubble-actions .pb-wa-b{ border-color:#BFE9D2; background:#EDFBF3; }
#dca-tour .tour-demo p{ margin:0; }
#dca-tour .tour-demo .note{ margin:0; }
#dca-tour .tour-fake{ position:relative; display:flex; align-items:center; justify-content:space-between;
  border:1px solid #E3E8F0; border-radius:10px; padding:10px 12px; background:#fff; }
#dca-tour .tour-fake-h{ font-size:13px; font-weight:800; color:#0B2545; }
#dca-tour .tour-demo .pb-aside-collapse{ position:static; }
#dca-tour .tour-foot{ display:flex; align-items:center; justify-content:space-between; gap:10px; margin-top:14px; }
#dca-tour .tour-n{ font-size:12px; color:#8494A8; font-weight:700; }
#dca-tour .tour-acts{ display:flex; gap:8px; }
#dca-tour .tour-b{ border:0; border-radius:9px; padding:9px 14px; font-family:inherit; font-weight:800;
  font-size:13px; cursor:pointer; }
#dca-tour .tour-prev{ background:#F2F5FA; color:#3B4859; }
#dca-tour .tour-prev:hover{ background:#E6ECF5; }
#dca-tour .tour-next{ background:#E8821A; color:#fff; }
#dca-tour .tour-next:hover{ background:#d0740f; }
/* botão de refazer o tour, dentro do índice flutuante */
#pb-nav .pb-tour-btn{ width:100%; margin-top:8px; border-radius:8px; padding:9px; font-family:inherit;
  font-weight:700; font-size:12.5px; cursor:pointer; background:rgba(232,130,26,.16); color:#FFD3A3;
  border:1px solid rgba(232,130,26,.45); }
#pb-nav .pb-tour-btn:hover{ background:rgba(232,130,26,.28); color:#fff; }
@media (max-width:640px){
  #dca-tour .tour-t{ font-size:17px; }
  #dca-tour .tour-p{ font-size:15px; }
}

/* ===== Painel de voz da leitura ===== */
#pb-nav .pb-nav-voz{ width:100%; margin-top:8px; border:0; border-radius:8px; padding:9px; font-family:inherit;
  font-weight:700; font-size:12.5px; cursor:pointer; background:rgba(255,255,255,.1); color:#fff; }
#pb-nav .pb-nav-voz:hover{ background:rgba(255,255,255,.18); }
#pb-voz{ position:fixed; inset:0; z-index:20100; font-family:Arial,Helvetica,sans-serif; }
#pb-voz .pbv-bd{ position:absolute; inset:0; background:rgba(9,14,24,.6); }
#pb-voz .pbv-card{ position:absolute; left:50%; top:50%; transform:translate(-50%,-50%);
  width:min(360px, calc(100vw - 24px)); background:#fff; color:#2D3A4A; border-radius:14px;
  box-shadow:0 18px 50px rgba(0,0,0,.38); padding:16px; box-sizing:border-box; max-height:calc(100vh - 32px); overflow-y:auto; }
#pb-voz .pbv-top{ display:flex; align-items:center; justify-content:space-between; font-size:16px; color:#0D1B2E; }
#pb-voz .pbv-x{ width:30px; height:30px; border:0; border-radius:8px; background:#F2F5FA; color:#5A6A7E; font-size:14px; cursor:pointer; }
#pb-voz .pbv-x:hover{ background:#E6ECF5; color:#0B2545; }
#pb-voz .pbv-lb{ font-size:11.5px; font-weight:800; letter-spacing:.06em; text-transform:uppercase; color:#8494A8; margin:14px 0 6px; }
#pb-voz .pbv-sel{ width:100%; padding:10px; border:1px solid #DDE3EC; border-radius:9px; font-family:inherit;
  font-size:14px; color:#2D3A4A; background:#fff; box-sizing:border-box; }
#pb-voz .pbv-rates{ display:flex; gap:6px; flex-wrap:wrap; }
#pb-voz .pbv-rate{ flex:1 1 auto; border:1px solid #DDE3EC; background:#fff; color:#3B4859; border-radius:9px;
  padding:9px 6px; font-family:inherit; font-weight:700; font-size:12.5px; cursor:pointer; }
#pb-voz .pbv-rate:hover{ background:#F2F5FA; }
#pb-voz .pbv-rate.on{ background:#0D1B2E; color:#fff; border-color:#0D1B2E; }
#pb-voz .pbv-test{ width:100%; margin-top:14px; border:0; border-radius:9px; padding:11px; background:#E8821A;
  color:#fff; font-family:inherit; font-weight:800; font-size:13.5px; cursor:pointer; }
#pb-voz .pbv-test:hover{ background:#d0740f; }
#pb-voz .pbv-dica{ margin-top:14px; background:#FFF8EE; border-left:4px solid #E8821A; border-radius:6px;
  padding:11px 13px; font-size:13px; line-height:1.55; color:#5b3d18; }

/* ===== Planilha de ABM (dentro da aula) ===== */
.prose .playbook .abm-sheet{ margin:14px 0 8px; }
.prose .playbook .abm-loading{ color:var(--pb-muted); font-size:14px; padding:12px; }
.prose .playbook .abm-tabs{ margin:0 0 10px; font-size:13px; color:var(--pb-muted); }
.prose .playbook .abm-tabs-lb{ font-weight:700; color:var(--pb-navy); }
.prose .playbook .abm-tabs-quem{ margin-top:6px; font-size:12.5px; color:var(--pb-muted); }
.prose .playbook .abm-ir{ border:1px solid #DCE6F7; background:#fff; color:var(--pb-navy); border-radius:999px;
  padding:3px 10px; margin:3px 4px 0 0; font-family:inherit; font-size:12px; font-weight:700; cursor:pointer; }
.prose .playbook .abm-ir:hover{ background:var(--pb-navy); color:#fff; border-color:var(--pb-navy); }
.prose .playbook .abm-est-selo{ display:inline-block; margin:0 0 5px; font-size:11px; font-weight:700; color:#146C43;
  background:#EAF7F0; border-radius:5px; padding:2px 7px; }
.prose .playbook .abm-ir-todos{ border-color:var(--pb-orange,#E8821A); color:#8A4A00; background:#FFF6EC; }
.prose .playbook .abm-ir-todos:hover{ background:var(--pb-orange,#E8821A); color:#fff; border-color:var(--pb-orange,#E8821A); }
/* endereço da planilha do Google, dentro da janela do Sheets */
#abm-sheets-modal .abm-sh-link{ padding:12px 16px; border-bottom:1px solid #E3E8F0; background:#F7F9FC; }
#abm-sheets-modal .abm-sh-abrir{ width:100%; border:0; border-radius:10px; background:var(--pb-blue,#2563EB); color:#fff;
  padding:11px 14px; font-family:inherit; font-weight:700; font-size:14px; cursor:pointer; }
#abm-sheets-modal .abm-sh-abrir:hover{ background:var(--pb-navy,#0B2545); }
#abm-sheets-modal .abm-sh-lb{ display:block; margin:12px 0 6px; font-size:11.5px; font-weight:700;
  text-transform:uppercase; letter-spacing:.4px; color:#5A6A7E; }
#abm-sheets-modal .abm-sh-linha{ display:flex; gap:8px; }
#abm-sheets-modal .abm-sh-url-in{ flex:1 1 auto; min-width:0; border:1px solid #DCE6F7; border-radius:9px;
  padding:9px 11px; font-family:inherit; font-size:13.5px; background:#fff; }
#abm-sheets-modal .abm-sh-url-in:focus{ outline:none; border-color:var(--pb-orange,#E8821A);
  box-shadow:0 0 0 2px rgba(232,130,26,.18); }
#abm-sheets-modal .abm-sh-salvar{ flex:0 0 auto; border:1px solid #DCE6F7; background:#fff; color:var(--pb-navy,#0B2545);
  border-radius:9px; padding:9px 14px; font-family:inherit; font-weight:700; font-size:13px; cursor:pointer; }
#abm-sheets-modal .abm-sh-dica{ margin:8px 0 0; font-size:12.5px; color:#5A6A7E; line-height:1.5; }
.prose .playbook .abm-sheets-cfg{ padding:6px 9px; }
/* análise estratégica do lead */
#abm-an-modal .abm-an-corpo{ padding:14px 16px 18px; overflow:auto; }
.abm-an-form{ width:100%; border-collapse:separate; border-spacing:0; margin:0 0 10px; }
.abm-an-form th{ width:34%; text-align:left; font-size:12.5px; font-weight:700; color:var(--pb-navy,#0B2545);
  padding:7px 10px; background:#F2F5FA; border:1px solid #DDE3EC; border-right:0; border-radius:8px 0 0 8px; }
.abm-an-form td{ padding:0; border:1px solid #DDE3EC; border-left:0; border-radius:0 8px 8px 0; background:#fff; }
.abm-an-form tr + tr th, .abm-an-form tr + tr td{ border-top:0; }
.abm-an-form input{ width:100%; box-sizing:border-box; border:0; background:transparent; padding:8px 10px;
  font-family:inherit; font-size:13.5px; color:var(--pb-text,#1B2A3D); }
.abm-an-form input:focus{ outline:none; background:#FFFBF5; box-shadow:inset 0 0 0 2px var(--pb-orange,#E8821A); border-radius:0 7px 7px 0; }
.abm-an-nota{ font-size:12.5px; color:var(--pb-muted,#5A6A7E); line-height:1.55; margin:0 0 10px; }
.abm-an-acoes{ display:flex; flex-wrap:wrap; gap:8px; }
.abm-an-modo{ margin-top:8px; font-size:12.5px; color:var(--pb-muted,#5A6A7E); line-height:1.5; }
.abm-an-saida{ margin-top:14px; }
.prose .playbook .abm-tab-sel{ font-family:inherit; font-size:13px; padding:6px 8px; border:1px solid #DCE6F7; border-radius:8px; background:#fff; color:var(--pb-navy); }
.prose .playbook .abm-wrap{ overflow-x:auto; border:1px solid var(--pb-line); border-radius:10px; }
.prose .playbook table.abm-table{ border-collapse:separate; border-spacing:0; width:auto; min-width:100%; font-size:13px; margin:0; }
.prose .playbook .abm-table th{ background:var(--pb-navy); color:#fff; text-align:left; padding:8px 10px; font-size:11.5px; white-space:nowrap; position:sticky; top:0; z-index:2; }
.prose .playbook .abm-table td{ padding:0; border-bottom:1px solid var(--pb-line); border-right:1px solid #EEF2F7; vertical-align:top; background:#fff; }
.prose .playbook .abm-table td.abm-idx{ text-align:center; color:var(--pb-muted); font-size:12px; padding:6px 8px; background:#F7F9FC; }
.prose .playbook .abm-table th.abm-idx{ width:34px; text-align:center; }
.prose .playbook .abm-table td.abm-fz{ position:sticky; z-index:1; box-shadow:2px 0 0 #E3E8F0; }
.prose .playbook .abm-table th.abm-fz{ position:sticky; z-index:3; box-shadow:2px 0 0 rgba(0,0,0,.25); }
.prose .playbook .abm-table th.abm-idx{ width:34px; text-align:center; }
.prose .playbook .abm-cell{ min-width:150px; max-width:320px; padding:7px 10px; outline:none; min-height:18px; line-height:1.4; }
.prose .playbook .abm-cell:focus{ background:#FFFBF0; box-shadow:inset 0 0 0 2px var(--pb-orange); }
.prose .playbook .abm-table td:nth-child(2) .abm-cell{ font-weight:600; }
.prose .playbook .abm-empty{ padding:16px; color:var(--pb-muted); text-align:center; }
.prose .playbook .abm-del{ border:0; background:transparent; color:#C0392B; cursor:pointer; font-size:13px; padding:4px 8px; opacity:.6; }
.prose .playbook .abm-del:hover{ opacity:1; }
.prose .playbook .abm-foot{ display:flex; align-items:center; gap:12px; margin-top:10px; flex-wrap:wrap; }
.prose .playbook .abm-add{ background:var(--pb-blue); color:#fff; border:0; border-radius:8px; padding:9px 14px; font-family:inherit; font-weight:700; font-size:13px; cursor:pointer; }
.prose .playbook .abm-add:hover{ background:var(--pb-navy); }
.prose .playbook .abm-status{ font-size:12.5px; color:var(--pb-muted); }

/* ===== artigo genérico com o padrão do Playbook ===== */
body.pb-generic-lesson #pb-nav .pb-nav-edit{ display:none; }
.prose .playbook.pb-generic code{ cursor:pointer; transition:outline .12s; }
.prose .playbook.pb-generic code:hover{ outline:2px solid rgba(232,130,26,.45); outline-offset:1px; }
.prose .playbook.pb-generic code.code-ok{ outline:2px solid var(--pb-green,#27AE60); }
.prose .playbook.pb-generic blockquote, .prose .playbook.pb-generic pre{ position:relative; padding-right:88px; }
.prose .playbook .copy-inj{ position:absolute; top:8px; right:8px; background:var(--pb-navy,#0D1B2E); color:#fff; border:0; border-radius:6px; padding:5px 11px; font-size:11.5px; font-weight:700; font-family:inherit; cursor:pointer; z-index:1; }
.prose .playbook .copy-inj:hover{ background:var(--pb-blue,#1B4F9E); }
.prose .playbook .copy-inj.ok{ background:var(--pb-green,#27AE60); }

/* ===== Planilha ABM: colunas próprias + cartões no celular ===== */
.prose .playbook .abm-cards{ display:none; }
.prose .playbook .abm-sheet.abm-mob .abm-wrap{ display:none; }
.prose .playbook .abm-sheet.abm-mob .abm-cards{ display:block; }
.prose .playbook .abm-th{ outline:none; display:inline-block; min-width:60px; }
.prose .playbook .abm-th:focus{ background:rgba(255,255,255,.16); box-shadow:inset 0 0 0 2px var(--pb-orange); border-radius:4px; }
.prose .playbook .abm-table th.abm-extra{ white-space:normal; min-width:120px; }
.prose .playbook .abm-delcol{ border:0; background:transparent; color:#FFC9C0; cursor:pointer; font-size:11px; padding:0 4px; opacity:.75; }
.prose .playbook .abm-delcol:hover{ opacity:1; color:#fff; }
.prose .playbook .abm-addcol{ border:1px solid rgba(255,255,255,.35); background:rgba(255,255,255,.12); color:#fff;
  border-radius:7px; width:26px; height:26px; font-size:15px; line-height:1; cursor:pointer; font-family:inherit; }
.prose .playbook .abm-addcol:hover{ background:rgba(255,255,255,.25); }
.prose .playbook .abm-addcol-b{ width:auto; height:auto; padding:9px 14px; font-size:13px; font-weight:700;
  background:#fff; color:var(--pb-blue); border:1px solid #CFE0F7; border-radius:8px; }
.prose .playbook .abm-addcol-b:hover{ background:#F2F7FF; color:var(--pb-navy); }
/* cartões (celular) */
.prose .playbook .abm-card{ border:1px solid var(--pb-line); border-radius:12px; background:#fff; margin:0 0 12px; overflow:hidden; }
.prose .playbook .abm-card-h{ display:flex; align-items:center; justify-content:space-between; gap:8px;
  background:var(--pb-navy); color:#fff; padding:10px 12px; font-size:14px; }
.prose .playbook .abm-card-h .abm-del{ color:#FFC9C0; opacity:.85; }
.prose .playbook .abm-f{ padding:9px 12px; border-top:1px solid #EEF2F7; }
.prose .playbook .abm-f:first-of-type{ border-top:0; }
.prose .playbook .abm-f-lb{ font-size:11px; font-weight:800; letter-spacing:.05em; text-transform:uppercase;
  color:var(--pb-muted); margin-bottom:4px; display:flex; align-items:center; gap:6px; }
.prose .playbook .abm-f-lb .abm-th{ color:var(--pb-navy); }
.prose .playbook .abm-f-lb .abm-th:focus{ background:#FFF3E0; }
.prose .playbook .abm-f-lb .abm-delcol{ color:#C0392B; }
.prose .playbook .abm-card .abm-cell{ min-width:0; max-width:none; font-size:15px; padding:8px 10px;
  border:1px solid #DDE3EC; border-radius:8px; background:#FCFDFF; min-height:22px; }
.prose .playbook .abm-card .abm-cell:empty:before{ content:attr(data-ph); color:#A9B6C8; }
.prose .playbook .abm-card .abm-cell.abm-ro{ background:#F7F9FC; }

/* ===== Índice de artigo: subtítulos encaixados (estrutura de documento) ===== */
#pb-nav .pb-sub-n{ list-style:none; margin:0 0 2px; padding:1px 0 1px 12px; border-left:1px solid rgba(255,255,255,.14); }
#pb-nav .pb-sub-n a{ color:#A9B8CE; font-size:11.5px; padding:4px 9px; }
#pb-nav .pb-sub-n .pb-sub-n a{ color:#93A3B8; font-size:11px; }
#pb-nav li.pb-sub-br{ list-style:none; }
.prose .playbook .pb-sub-n{ list-style:none; margin:2px 0 2px; padding-left:14px; border-left:2px solid var(--pb-line,#E3E8F0); }
.prose .playbook .pb-sub-n a{ font-size:13.5px; }

/* ===== Ouvir o artigo inteiro (topo de toda aula em texto) ===== */
.prose .playbook .pb-ouvir-tudo{ display:flex; align-items:center; gap:9px; width:100%; margin:0 0 18px;
  background:#EDF3FF; color:#1B4F9E; border:1px solid #D3E1F8; border-radius:10px; padding:12px 14px;
  font-family:inherit; font-weight:800; font-size:14px; cursor:pointer; text-align:left; }
.prose .playbook .pb-ouvir-tudo:hover{ background:#E2EBFC; }
.prose .playbook .pb-ouvir-tudo .pb-ot-ic{ font-size:17px; line-height:1; }
.prose .playbook .pb-ouvir-tudo.speaking{ background:var(--pb-orange,#E8821A); border-color:transparent; color:#fff; }
@media (max-width:640px){ .prose .playbook .pb-ouvir-tudo{ font-size:15px; padding:13px 14px; } }

/* ===== ABM: link, ordem das colunas, congelar e estratégia ===== */
.prose .playbook .abm-wrap{ max-height:min(70vh, 760px); overflow:auto; }
.prose .playbook .abm-link{ display:inline-flex; align-items:center; justify-content:center; width:22px; height:22px;
  margin:0 6px 6px 8px; border-radius:6px; background:#EDF3FF; color:#1B4F9E; text-decoration:none;
  font-size:12px; font-weight:800; vertical-align:top; }
.prose .playbook .abm-link:hover{ background:#1B4F9E; color:#fff; }
.prose .playbook .abm-cards .abm-link{ margin:6px 0 0 8px; }
.prose .playbook .abm-grip{ cursor:grab; margin-right:6px; opacity:.55; font-size:12px; }
.prose .playbook th.abm-h{ user-select:none; }
.prose .playbook th.abm-dragging{ opacity:.45; }
.prose .playbook th.abm-drop{ box-shadow:inset 3px 0 0 var(--pb-orange); }
.prose .playbook .abm-bar{ margin:0 0 10px; }
.prose .playbook .abm-cols-btn{ border:1px solid #DCE6F7; background:#fff; color:var(--pb-navy); border-radius:8px;
  padding:8px 12px; font-family:inherit; font-weight:700; font-size:12.5px; cursor:pointer; }
.prose .playbook .abm-cols-btn:hover{ background:#F2F7FF; }
/* coluna de estratégia */
.prose .playbook .abm-td-est{ min-width:280px; max-width:420px; }
.prose .playbook .abm-est{ padding:8px 10px; }
.prose .playbook .abm-est-tx{ white-space:pre-wrap; font-family:inherit; font-size:12.5px; line-height:1.5;
  background:#F7F9FC; border:1px solid var(--pb-line); border-radius:8px; padding:9px 11px; margin:0 0 8px;
  max-height:220px; overflow:auto; color:var(--pb-text); }
.prose .playbook .abm-est-vazio{ display:block; color:var(--pb-muted); font-size:12.5px; margin-bottom:8px; }
.prose .playbook .abm-est-acts{ display:flex; gap:6px; flex-wrap:wrap; }
.prose .playbook .abm-est-acts button{ border:1px solid #DCE6F7; background:#fff; color:var(--pb-navy);
  border-radius:7px; padding:6px 10px; font-family:inherit; font-weight:700; font-size:11.5px; cursor:pointer; }
.prose .playbook .abm-gerar{ background:var(--pb-orange); border-color:transparent; color:#fff; }
.prose .playbook .abm-est-acts button:hover{ filter:brightness(.95); }
.prose .playbook .abm-f-est{ background:#FBFCFE; }
/* painel de colunas */
#abm-cols{ position:fixed; inset:0; z-index:20100; font-family:Arial,Helvetica,sans-serif; }
#abm-cols .abmc-bd{ position:absolute; inset:0; background:rgba(9,14,24,.6); }
#abm-cols .abmc-card{ position:absolute; left:50%; top:50%; transform:translate(-50%,-50%);
  width:min(380px, calc(100vw - 24px)); max-height:calc(100vh - 40px); overflow-y:auto; background:#fff;
  color:#2D3A4A; border-radius:14px; box-shadow:0 18px 50px rgba(0,0,0,.38); padding:16px; box-sizing:border-box; }
#abm-cols .abmc-top{ display:flex; align-items:center; justify-content:space-between; font-size:16px; color:#0D1B2E; }
#abm-cols .abmc-x{ width:30px; height:30px; border:0; border-radius:8px; background:#F2F5FA; color:#5A6A7E; font-size:14px; cursor:pointer; }
#abm-cols .abmc-dica{ font-size:12.5px; line-height:1.5; color:#5A6A7E; margin:10px 0 12px; }
#abm-cols .abmc-list{ list-style:none; margin:0; padding:0; }
#abm-cols .abmc-i{ display:flex; align-items:center; gap:8px; border:1px solid #E3E8F0; border-radius:9px;
  padding:10px 10px; margin:0 0 6px; background:#fff; touch-action:none; }
#abm-cols .abmc-i.on{ background:#F2F7FF; border-color:#CFE0F7; }
#abm-cols .abmc-i.dragging{ opacity:.6; box-shadow:0 6px 18px rgba(0,0,0,.18); }
#abm-cols .abmc-grip{ cursor:grab; color:#8494A8; font-size:15px; padding:2px 4px; touch-action:none; }
#abm-cols .abmc-nm{ flex:1; font-size:13px; font-weight:600; color:#2D3A4A; }
#abm-cols .abmc-lock{ border:0; background:transparent; font-size:15px; cursor:pointer; padding:2px 4px; }
#abm-cols .abmc-foot{ margin-top:10px; }
#abm-cols .abmc-reset{ width:100%; border:1px solid #E3E8F0; background:#F7F9FC; color:#3B4859; border-radius:9px;
  padding:9px; font-family:inherit; font-weight:700; font-size:12.5px; cursor:pointer; }
.prose .playbook .abm-est-tx.abm-est-min{ max-height:76px; overflow:hidden; margin-bottom:8px;
  -webkit-mask-image:linear-gradient(#000 55%, transparent); mask-image:linear-gradient(#000 55%, transparent); }
#abm-est-modal, #abm-an-modal{ position:fixed; inset:0; z-index:20100; font-family:Arial,Helvetica,sans-serif; }
#abm-est-modal .abmc-bd, #abm-an-modal .abmc-bd{ position:absolute; inset:0; background:rgba(9,14,24,.6); }
#abm-est-modal .abmc-card, #abm-an-modal .abmc-card{ position:absolute; left:50%; top:50%; transform:translate(-50%,-50%);
  width:min(560px, calc(100vw - 24px)); max-height:calc(100vh - 40px); overflow-y:auto; background:#fff;
  color:#2D3A4A; border-radius:14px; box-shadow:0 18px 50px rgba(0,0,0,.38); padding:16px; box-sizing:border-box; }
#abm-est-modal .abmc-top, #abm-an-modal .abmc-top{ display:flex; align-items:center; justify-content:space-between;
  font-size:16px; color:#0D1B2E; gap:10px; }
#abm-est-modal .abmc-x, #abm-an-modal .abmc-x{ width:30px; height:30px; border:0; border-radius:8px; background:#F2F5FA;
  color:#5A6A7E; font-size:14px; cursor:pointer; flex:0 0 auto; }
#abm-an-modal .abmc-card{ padding:16px 0 0; }
#abm-an-modal .abmc-top{ padding:0 16px 12px; border-bottom:1px solid #E3E8F0; }
#abm-est-modal .abm-est-full{ white-space:pre-wrap; font-family:inherit; font-size:13.5px; line-height:1.6;
  background:#F7F9FC; border:1px solid #E3E8F0; border-radius:10px; padding:12px 14px; margin:12px 0 0; }
#abm-est-modal .abmc-foot{ margin-top:12px; }
#abm-est-modal .abmc-reset{ width:100%; border:1px solid #E3E8F0; background:#F7F9FC; color:#3B4859; border-radius:9px;
  padding:10px; font-family:inherit; font-weight:700; font-size:13px; cursor:pointer; }

/* ===== ABM: zoom das células, estratégia congelada e janelas ricas ===== */
.prose .playbook .abm-sheet{ --abm-z:1; }
.prose .playbook .abm-table{ font-size:calc(13px * var(--abm-z, 1)); }
.prose .playbook .abm-cell{ min-width:calc(150px * var(--abm-z, 1)); max-width:calc(320px * var(--abm-z, 1));
  padding:calc(7px * var(--abm-z, 1)) calc(10px * var(--abm-z, 1)); font-size:calc(13px * var(--abm-z, 1)); }
.prose .playbook .abm-cards .abm-cell{ font-size:calc(14.5px * var(--abm-z, 1)); }
.prose .playbook .abm-cards .abm-f-lb{ font-size:calc(11.5px * var(--abm-z, 1)); }
.prose .playbook .abm-bar{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
.prose .playbook .abm-z{ display:inline-flex; align-items:center; gap:2px; border:1px solid #DCE6F7; border-radius:8px; overflow:hidden; }
.prose .playbook .abm-z button{ border:0; background:#fff; color:var(--pb-navy); font-family:inherit; font-weight:800;
  font-size:12.5px; padding:8px 11px; cursor:pointer; }
.prose .playbook .abm-z button:hover{ background:#F2F7FF; }
.prose .playbook .abm-z-lb{ font-size:11.5px; color:var(--pb-muted); min-width:38px; text-align:center; }
/* estratégia congelada à direita */
.prose .playbook .abm-table th.abm-fz-r{ position:sticky; right:0; z-index:3; box-shadow:-2px 0 0 rgba(0,0,0,.25); }
.prose .playbook .abm-table td.abm-fz-r{ position:sticky; right:0; z-index:1; background:#fff; box-shadow:-2px 0 0 #E3E8F0; }
#abm-cols .abmc-i.abmc-fixa{ border-style:dashed; }
#abm-cols .abmc-grip.abmc-off{ opacity:.25; cursor:default; }
#abm-cols .abmc-nm i{ font-style:normal; color:#8494A8; font-weight:400; font-size:11.5px; }
#abm-cols .abmc-lock-est{ border:0; background:transparent; font-size:15px; cursor:pointer; padding:2px 4px; }
/* janelas largas com o visual do artigo */
#abm-est-modal .abmc-larga, #abm-brief-modal .abmc-larga, #abm-an-modal .abmc-larga{ width:min(720px, calc(100vw - 20px)); }
#abm-est-modal .abm-est-vis, #abm-brief-modal .abm-brief-vis{ margin-top:12px; }
#abm-est-modal .abm-est-vis .playbook h3, #abm-brief-modal .abm-brief-vis .playbook h3{ margin-top:20px; }
#abm-brief-modal{ position:fixed; inset:0; z-index:20100; font-family:Arial,Helvetica,sans-serif; }
#abm-brief-modal .abmc-bd{ position:absolute; inset:0; background:rgba(9,14,24,.6); }
#abm-brief-modal .abmc-card{ position:absolute; left:50%; top:50%; transform:translate(-50%,-50%);
  max-height:calc(100vh - 32px); overflow-y:auto; background:#fff; color:#2D3A4A; border-radius:14px;
  box-shadow:0 18px 50px rgba(0,0,0,.38); padding:16px; box-sizing:border-box; }
#abm-brief-modal .abmc-top{ display:flex; align-items:center; justify-content:space-between; font-size:16px; color:#0D1B2E; gap:10px; }
#abm-brief-modal .abmc-x{ width:30px; height:30px; border:0; border-radius:8px; background:#F2F5FA; color:#5A6A7E; font-size:14px; cursor:pointer; flex:0 0 auto; }
#abm-brief-modal .abm-b-tab{ width:100%; border-collapse:collapse; font-size:13.5px; }
#abm-brief-modal .abm-b-tab th{ text-align:left; width:38%; padding:7px 10px; background:#F7F9FC; color:#0D1B2E;
  font-weight:700; border:1px solid #E3E8F0; vertical-align:top; }
#abm-brief-modal .abm-b-tab td{ padding:7px 10px; border:1px solid #E3E8F0; vertical-align:top; }
#abm-brief-modal .abm-b-vazio{ color:#A8B4C4; }
#abm-brief-modal .abm-b-prompt{ white-space:pre-wrap; font-family:inherit; font-size:12.5px; line-height:1.55;
  background:#0D1B2E; color:#D7E0EE; border-radius:10px; padding:12px 14px; margin:8px 0 0; }
#abm-brief-modal .abmc-foot2{ display:flex; gap:8px; }
#abm-brief-modal .abmc-reset{ flex:1; border:1px solid #E3E8F0; background:#F7F9FC; color:#3B4859; border-radius:9px;
  padding:10px; font-family:inherit; font-weight:700; font-size:13px; cursor:pointer; }
#abm-brief-modal .abm-b-copiar{ background:var(--pb-orange,#E8821A); border-color:transparent; color:#fff; }
.prose .playbook .abm-exp{ border:1px solid #DCE6F7; background:#fff; color:var(--pb-navy); border-radius:8px;
  padding:8px 12px; font-family:inherit; font-weight:700; font-size:12.5px; cursor:pointer; }
.prose .playbook .abm-exp:hover{ background:#F2F7FF; }
.prose .playbook .abm-sheets{ border:1px solid #CFE7D6; background:#F2FBF5; color:#146C43; border-radius:8px;
  padding:8px 12px; font-family:inherit; font-weight:700; font-size:12.5px; cursor:pointer; }
.prose .playbook .abm-sheets:hover{ background:#E3F6EA; }
#abm-sheets-modal{ position:fixed; inset:0; z-index:20100; font-family:Arial,Helvetica,sans-serif; }
#abm-sheets-modal .abmc-bd{ position:absolute; inset:0; background:rgba(9,14,24,.6); }
#abm-sheets-modal .abmc-card{ position:absolute; left:50%; top:50%; transform:translate(-50%,-50%);
  width:min(680px, calc(100vw - 20px)); max-height:calc(100vh - 32px); overflow-y:auto; background:#fff;
  color:#2D3A4A; border-radius:14px; box-shadow:0 18px 50px rgba(0,0,0,.38); padding:16px; box-sizing:border-box; }
#abm-sheets-modal .abmc-top{ display:flex; align-items:center; justify-content:space-between; font-size:16px; color:#0D1B2E; gap:10px; }
#abm-sheets-modal .abmc-x{ width:30px; height:30px; border:0; border-radius:8px; background:#F2F5FA; color:#5A6A7E; font-size:14px; cursor:pointer; flex:0 0 auto; }
#abm-sheets-modal .msg-bubble p{ font-family:ui-monospace,Menlo,Consolas,monospace; font-size:12px; word-break:break-all; }
#abm-sheets-modal .abmc-foot2{ display:flex; gap:8px; margin-top:12px; flex-wrap:wrap; }
#abm-sheets-modal .abmc-reset{ flex:1 1 140px; border:1px solid #E3E8F0; background:#F7F9FC; color:#3B4859; border-radius:9px;
  padding:10px; font-family:inherit; font-weight:700; font-size:13px; cursor:pointer; }
#abm-sheets-modal .abm-sh-copiar{ background:#146C43; border-color:transparent; color:#fff; }
#abm-sheets-modal .abm-sh-regerar{ color:#B4402F; }

/* ===== "Para quem você vai mandar?" — preenche os scripts do capítulo ===== */
.prose .playbook .pb-dest{ border:1px solid #E3E8F0; background:#FBFCFE; border-radius:10px; padding:12px 14px; margin:0 0 18px; }
.prose .playbook .pb-dest.on{ border-color:#BFE9D2; background:#F4FBF7; }
.prose .playbook .pb-dest-h b{ font-size:14px; color:var(--pb-navy); display:block; }
.prose .playbook .pb-dest-nota{ display:block; font-size:12.5px; line-height:1.5; color:var(--pb-muted); margin-top:3px; }
.prose .playbook .pb-dest-eco{ font-size:12.5px; color:var(--pb-muted); margin-top:8px; line-height:1.5; }
.prose .playbook .pb-dest.on .pb-dest-eco{ color:#146C43; font-weight:700; }
@media (max-width:640px){
  .prose .playbook .pb-dest-campos label{ flex:1 1 100%; }
  .prose .playbook .pb-dest-limpar{ width:100%; }
  .prose .playbook .pb-min-limpar{ width:auto; }
}

/* formulário compacto acima de cada script: um campo por variável daquele script */
.prose .playbook .pb-dest-min{ margin:18px 0 -6px; background:#F7F9FC; border:1px solid #E3E8F0;
  border-radius:9px 9px 0 0; padding:9px 11px 12px; }
.prose .playbook .pb-dest-min.on{ background:#F4FBF7; border-color:#BFE9D2; }
.prose .playbook .pb-dest-mh{ display:flex; align-items:center; justify-content:space-between; gap:10px;
  font-size:11.5px; font-weight:700; letter-spacing:.03em; color:#5A6A7E; }
.prose .playbook .pb-dest-min.on .pb-dest-mh{ color:#146C43; }
.prose .playbook .pb-dest-min .pb-dest-tab{ margin:7px 0 0; }
.prose .playbook .pb-dest-min.on .pb-dest-tab th{ background:#EAF7F0; border-color:#BFE9D2; color:#146C43; }
.prose .playbook .pb-dest-min.on .pb-dest-tab td{ border-color:#BFE9D2; }
.prose .playbook .pb-dest-min + .msg{ margin-top:0; border-top-left-radius:0; border-top-right-radius:0; }

/* ===== "Para quem?" em tabela: rótulo à esquerda, campo à direita ===== */
.prose .playbook .pb-dest-tab{ width:100%; border-collapse:separate; border-spacing:0; margin:10px 0 0; font-size:14px; }
.prose .playbook .pb-dest-tab th{ width:34%; max-width:120px; text-align:left; vertical-align:middle;
  padding:7px 10px; background:#F2F5FA; border:1px solid #DDE3EC; border-right:0; border-radius:8px 0 0 8px;
  font-size:12.5px; font-weight:700; color:var(--pb-navy); white-space:nowrap; }
.prose .playbook .pb-dest-tab td{ padding:0; border:1px solid #DDE3EC; border-left:0; border-radius:0 8px 8px 0; background:#fff; }
.prose .playbook .pb-dest-tab tr + tr th, .prose .playbook .pb-dest-tab tr + tr td{ border-top:0; }
.prose .playbook .pb-dest-tab tr:first-child th{ border-radius:8px 0 0 0; }
.prose .playbook .pb-dest-tab tr:first-child td{ border-radius:0 8px 0 0; }
.prose .playbook .pb-dest-tab tr:last-child th{ border-radius:0 0 0 8px; }
.prose .playbook .pb-dest-tab tr:last-child td{ border-radius:0 0 8px 0; }
.prose .playbook .pb-dest-tab input{ width:100%; border:0; background:transparent; padding:9px 10px;
  font-family:inherit; font-size:14px; color:var(--pb-text); box-sizing:border-box; }
.prose .playbook .pb-dest-tab input:focus{ outline:none; background:#FFFBF5; box-shadow:inset 0 0 0 2px var(--pb-orange); border-radius:0 7px 7px 0; }
.prose .playbook .pb-dest.on .pb-dest-tab th{ background:#EAF7F0; border-color:#BFE9D2; color:#146C43; }
.prose .playbook .pb-dest.on .pb-dest-tab td{ border-color:#BFE9D2; }
.prose .playbook .pb-dest-limpar{ margin-top:8px; border:1px solid #DDE3EC; background:#fff; color:#5A6A7E;
  border-radius:8px; padding:7px 12px; font-family:inherit; font-weight:700; font-size:12px; cursor:pointer; }
.prose .playbook .pb-dest-limpar:hover{ background:#F2F5FA; color:#0B2545; }
/* no formulário do script o Limpar fica na própria faixa do título, sem roubar altura */
.prose .playbook .pb-min-limpar{ flex:0 0 auto; margin-top:0; padding:4px 9px; font-size:11px; letter-spacing:0; }
.prose .playbook .pb-dest-min.on .pb-min-limpar{ border-color:#BFE9D2; color:#146C43; }
/* faixa acima de cada script: a mesma tabela, colada no cartão */
.prose .playbook .pb-dest-min{ display:block; margin:14px 0 -6px; background:#F7F9FC; border:1px solid #E3E8F0;
  border-bottom:0; border-radius:9px 9px 0 0; padding:8px 10px 10px; }
.prose .playbook .pb-dest-min.on{ background:#F4FBF7; border-color:#BFE9D2; }
.prose .playbook .pb-dest-min .pb-dest-tab{ margin:0; }

/* ===== Quiz: nunca mais um botão de enviar mudo ===== */
.quiz-progress.ok{ color:#146C43; font-weight:700; }
#quizSubmit.incompleto{ background:#8FA0B6; border-color:#8FA0B6; }
#quizSubmit.incompleto:hover{ background:#7d8ea4; }
.q-block.pendente{ box-shadow:0 0 0 2px var(--orange-600, #E8821A); border-radius:12px; }

/* rótulo do formulário de variáveis no celular: nunca espreme o campo */
@media (max-width:640px){
  .prose .playbook .pb-dest-tab th{ width:38%; max-width:none; font-size:12px; padding:7px 8px; white-space:normal; }
  .prose .playbook .pb-dest-tab input{ font-size:14px; padding:9px 8px; }
}

/* ===================== Validador de ICP ===================== */
.prose .playbook .icp-box{ border:1px solid var(--pb-line,#E3E8F0); border-radius:14px; background:#fff;
  padding:16px 16px 18px; margin:18px 0; box-shadow:0 1px 3px rgba(11,37,69,.05); }
.prose .playbook .icp-box-h{ display:flex; align-items:center; gap:10px; flex-wrap:wrap;
  font-size:15px; font-weight:800; color:var(--pb-navy,#0B2545); margin-bottom:12px; }
.prose .playbook .icp-box-h > span{ flex:1 1 auto; }
/* zerar: some no meio do caminho até ser preciso, mas fica sempre ao lado do título */
.prose .playbook .icp-zerar{ flex:0 0 auto; font-family:inherit; font-size:12px; font-weight:700;
  line-height:1; cursor:pointer; padding:7px 11px; border-radius:8px;
  border:1px solid var(--pb-line,#E3E8F0); background:#fff; color:var(--pb-muted,#5A6A7E); }
.prose .playbook .icp-zerar:hover{ border-color:#E3B6B0; background:#FDF2F0; color:#B3261E; }
.prose .playbook .icp-form{ width:100%; border-collapse:separate; border-spacing:0; margin:0 0 14px; }
.prose .playbook .icp-form th{ width:36%; max-width:210px; text-align:left; vertical-align:middle; padding:8px 10px;
  background:#F2F5FA; border:1px solid #DDE3EC; border-right:0; border-radius:8px 0 0 8px;
  font-size:12.5px; font-weight:700; color:var(--pb-navy,#0B2545); }
.prose .playbook .icp-form td{ padding:0; border:1px solid #DDE3EC; border-left:0; border-radius:0 8px 8px 0; background:#fff; }
.prose .playbook .icp-form tr + tr th, .prose .playbook .icp-form tr + tr td{ border-top:0; }
.prose .playbook .icp-form input{ width:100%; border:0; background:transparent; padding:10px;
  font-family:inherit; font-size:14px; color:var(--pb-text,#1B2A3D); box-sizing:border-box; }
.prose .playbook .icp-form input:focus{ outline:none; background:#FFFBF5; box-shadow:inset 0 0 0 2px var(--pb-orange,#E8821A); border-radius:0 7px 7px 0; }
.prose .playbook .icp-req{ font-style:normal; font-size:10.5px; font-weight:700; color:#D14343; margin-left:4px; }
.prose .playbook .icp-modo{ font-size:12.5px; color:var(--pb-muted,#5A6A7E); margin-top:10px; line-height:1.5; }
.prose .playbook .icp-aviso{ margin-top:14px; padding:12px 14px; border-radius:10px;
  background:#FDECEC; border:1px solid #F5C2C2; color:#8A2222; font-size:14px; }

/* carregando */
.prose .playbook .icp-carrega{ display:flex; align-items:center; gap:12px; margin-top:16px; padding:14px 16px;
  border:1px solid #DDE3EC; border-radius:10px; background:#F7F9FC; }
.prose .playbook .icp-spin{ width:20px; height:20px; flex:0 0 auto; border-radius:50%;
  border:2.5px solid #DDE3EC; border-top-color:var(--pb-orange,#E8821A); animation:icp-gira .8s linear infinite; }
@keyframes icp-gira{ to{ transform:rotate(360deg); } }
.prose .playbook .icp-passo{ font-size:13.5px; color:var(--pb-muted,#5A6A7E); line-height:1.5; }

/* prompt para quem não é master */
.prose .playbook .icp-prompt{ margin-top:16px; border:1px solid #DDE3EC; border-radius:12px; padding:14px 16px; background:#F7F9FC; }
.prose .playbook .icp-prompt-h{ font-weight:800; color:var(--pb-navy,#0B2545); margin-bottom:6px; }
.prose .playbook .icp-prompt-acoes{ display:flex; flex-wrap:wrap; gap:8px; margin:12px 0; }
.prose .playbook .icp-prompt-txt{ max-height:280px; overflow:auto; white-space:pre-wrap; word-break:break-word;
  background:#fff; border:1px solid #E3E8F0; border-radius:8px; padding:12px; font-size:12.5px; line-height:1.55; margin:0; }

/* relatório */
.prose .playbook .icp-rel{ margin-top:18px; }
.prose .playbook .icp-cab{ border-radius:14px 14px 0 0; background:var(--pb-navy,#0B2545); color:#fff; padding:18px 18px 16px; }
.prose .playbook .icp-eyebrow{ font-size:10.5px; letter-spacing:.14em; text-transform:uppercase; color:#8FA0B6; font-weight:700; }
.prose .playbook .icp-titulo{ margin:4px 0 2px; color:#fff; font-size:22px; line-height:1.2; }
.prose .playbook .icp-sub{ font-size:13px; color:#C9D6E8; }
.prose .playbook .icp-prat{ border:1px solid #E3E8F0; border-top:0; background:#fff; }
.prose .playbook .icp-prat:last-child{ border-radius:0 0 14px 14px; }
.prose .playbook .icp-prat-h{ padding:10px 16px; background:#F2F5FA; border-bottom:1px solid #E3E8F0;
  font-size:11px; letter-spacing:.12em; text-transform:uppercase; font-weight:800; color:var(--pb-navy,#0B2545); }
.prose .playbook .icp-prat-b{ padding:16px; display:flex; gap:20px; align-items:flex-start; flex-wrap:wrap; }
.prose .playbook .icp-prat-b.icp-texto{ display:block; }
.prose .playbook .icp-texto h3{ margin-top:18px; }
.prose .playbook .icp-texto h4{ margin:16px 0 8px; }

/* rosca */
.prose .playbook .icp-rosca{ margin:0; flex:0 0 190px; text-align:center; }
.prose .playbook .icp-rosca svg{ width:150px; height:150px; }
.prose .playbook .icp-trilho{ fill:none; stroke:#E9EEF5; stroke-width:14; }
.prose .playbook .icp-arco{ fill:none; stroke-width:14; stroke-linecap:round; transition:stroke-dasharray .8s ease; }
.prose .playbook .icp-nota{ text-anchor:middle; font-size:34px; font-weight:800; font-family:inherit; }
.prose .playbook .icp-de{ text-anchor:middle; font-size:11px; fill:#8FA0B6; font-family:inherit; }
.prose .playbook .icp-rosca figcaption{ font-size:13px; color:var(--pb-text,#1B2A3D); line-height:1.45; }
.prose .playbook .icp-rosca figcaption b{ display:block; color:var(--pb-navy,#0B2545); }
.prose .playbook .icp-rosca figcaption span{ display:block; margin-top:4px; font-size:12px; color:var(--pb-muted,#5A6A7E); }

/* barras horizontais */
.prose .playbook .icp-barras{ flex:1 1 320px; min-width:0; }
.prose .playbook .icp-bt{ font-size:11px; letter-spacing:.1em; text-transform:uppercase; font-weight:800;
  color:var(--pb-muted,#5A6A7E); margin-bottom:10px; }
.prose .playbook .icp-barra{ position:relative; margin-bottom:12px; cursor:default; outline:none; }
.prose .playbook .icp-blabel{ display:flex; justify-content:space-between; gap:10px; font-size:13px; margin-bottom:4px; }
.prose .playbook .icp-blabel b{ font-variant-numeric:tabular-nums; }
.prose .playbook .icp-btrilho{ height:10px; border-radius:6px; background:#EDF1F7; overflow:hidden; }
.prose .playbook .icp-btrilho i{ display:block; height:100%; border-radius:6px; transition:width .8s ease; }
.prose .playbook .icp-peso{ margin-top:3px; font-size:10.5px; color:#A9B8CE; letter-spacing:.12em; }
.prose .playbook .icp-peso span{ letter-spacing:0; margin-left:6px; }
.prose .playbook .icp-tip{ position:absolute; left:0; right:0; top:100%; z-index:9990; margin-top:4px;
  background:var(--pb-navy,#0B2545); color:#fff; font-size:12.5px; line-height:1.5; padding:9px 11px; border-radius:8px;
  box-shadow:0 6px 20px rgba(11,37,69,.22); opacity:0; visibility:hidden; transform:translateY(-4px); transition:.16s; }
.prose .playbook .icp-barra:hover .icp-tip, .prose .playbook .icp-barra:focus .icp-tip{ opacity:1; visibility:visible; transform:none; }

/* SWOT */
.prose .playbook .icp-swot{ display:grid; grid-template-columns:1fr 1fr; gap:10px; margin:8px 0 4px; }
.prose .playbook .icp-sw{ border:1px solid #E3E8F0; border-radius:10px; padding:10px 12px; background:#FBFCFE; }
.prose .playbook .icp-sw b{ display:block; font-size:12px; text-transform:uppercase; letter-spacing:.08em; margin-bottom:6px; }
.prose .playbook .icp-sw ul{ margin:0; padding-left:18px; font-size:13.5px; }
.prose .playbook .icp-sw-f{ border-color:#BFE9D2; } .prose .playbook .icp-sw-f b{ color:#146C43; }
.prose .playbook .icp-sw-w{ border-color:#F5C2C2; } .prose .playbook .icp-sw-w b{ color:#8A2222; }
.prose .playbook .icp-sw-o{ border-color:#BBD6F5; } .prose .playbook .icp-sw-o b{ color:#14508A; }
.prose .playbook .icp-sw-t{ border-color:#F2D9A8; } .prose .playbook .icp-sw-t b{ color:#8A5A14; }

@media (max-width:720px){
  .prose .playbook .icp-form th{ width:42%; max-width:none; font-size:12px; padding:8px; }
  .prose .playbook .icp-prat-b{ display:block; }
  .prose .playbook .icp-rosca{ margin:0 auto 16px; }
  .prose .playbook .icp-swot{ grid-template-columns:1fr; }
  .prose .playbook .icp-titulo{ font-size:19px; }
}

/* validador de ICP — ações e painel de liberação */
.prose .playbook .icp-acoes{ display:flex; flex-wrap:wrap; gap:8px; }
.prose .playbook .icp-painel{ display:none; }
.prose .playbook .icp-painel.on{ display:block; margin-top:14px; border:1px solid #DDE3EC; border-radius:12px;
  padding:14px 16px; background:#F7F9FC; }
.prose .playbook .icp-painel-h{ font-weight:800; color:var(--pb-navy,#0B2545); margin-bottom:10px; font-size:14px; }
.prose .playbook .icp-linha{ display:block; margin-bottom:12px; }
.prose .playbook .icp-linha span{ display:block; font-size:12.5px; font-weight:700; color:var(--pb-navy,#0B2545); margin-bottom:4px; }
.prose .playbook .icp-linha input{ width:100%; box-sizing:border-box; border:1px solid #DDE3EC; border-radius:8px;
  padding:9px 10px; font-family:inherit; font-size:14px; background:#fff; }
.prose .playbook .icp-linha input:focus{ outline:none; border-color:var(--pb-orange,#E8821A); box-shadow:0 0 0 2px rgba(232,130,26,.18); }
.prose .playbook .icp-check{ display:flex; align-items:center; gap:8px; padding:5px 0; font-size:14px; cursor:pointer; }
.prose .playbook .icp-check input{ width:17px; height:17px; flex:0 0 auto; accent-color:var(--pb-orange,#E8821A); }
.prose .playbook .icp-usuarios{ margin:8px 0 12px; padding:8px 10px; background:#fff; border:1px solid #E3E8F0;
  border-radius:8px; max-height:230px; overflow:auto; }
.prose .playbook .icp-usuarios.off{ opacity:.4; pointer-events:none; }
.prose .playbook .icp-tag{ font-style:normal; font-size:10.5px; font-weight:700; color:#146C43;
  background:#EAF7F0; border-radius:4px; padding:1px 5px; margin-left:4px; }
.prose .playbook .icp-ok{ margin-left:10px; font-size:13px; font-weight:700; color:#146C43; }

/* ===================== Ritual diário: rotina, metas e projeção ===================== */
.prose .playbook .rot-box{ margin:18px 0; }
.prose .playbook .rot-h{ font-size:15px; font-weight:800; color:var(--pb-navy,#0B2545); margin:22px 0 10px; }
.prose .playbook .rot-nota{ font-size:12.5px; color:var(--pb-muted,#5A6A7E); line-height:1.55; margin:8px 0 12px; }
.prose .playbook table.rot-tab td{ vertical-align:top; }
.prose .playbook .rot-hora{ white-space:nowrap; font-weight:700; color:var(--pb-navy,#0B2545); font-variant-numeric:tabular-nums; }
.prose .playbook .rot-vol{ white-space:nowrap; font-weight:700; color:#146C43; }
.prose .playbook .rot-pq{ color:var(--pb-muted,#5A6A7E); font-size:13.5px; }

/* metas do dia, no topo */
.prose .playbook .rot-totais{ display:flex; flex-wrap:wrap; gap:10px; margin:12px 0 6px; }
.prose .playbook .rot-total{ flex:1 1 130px; border:1px solid #E3E8F0; border-radius:10px; padding:10px 12px; background:#F7F9FC; }
.prose .playbook .rot-total b{ display:block; font-size:22px; color:var(--pb-navy,#0B2545); line-height:1.1; }
.prose .playbook .rot-total span{ display:block; font-size:12px; line-height:1.35; color:var(--pb-muted,#5A6A7E); }

/* rotina sugerida — o master edita direto na célula */
.prose .playbook table.rot-tab[data-edita] td{ cursor:text; }
.prose .playbook table.rot-tab[data-edita] td:hover{ background:#FFF6EC; }
.prose .playbook table.rot-tab[data-edita] td:focus{ outline:2px solid var(--pb-orange,#E8821A); outline-offset:-2px; background:#fff; }
.prose .playbook .rot-x{ border:0; background:transparent; color:#fff; opacity:.5; font-size:11px; line-height:1;
  padding:3px 5px; margin-left:6px; border-radius:5px; font-family:inherit; cursor:pointer; }
.prose .playbook .rot-x:hover{ opacity:1; background:rgba(255,255,255,.2); }
.prose .playbook th.rot-acao-cab{ padding:0; }
.prose .playbook td.rot-acao{ text-align:center; padding:5px 2px; }
.prose .playbook .rot-del-lin{ color:#C0392B; opacity:.45; margin:0; }
.prose .playbook .rot-del-lin:hover{ opacity:1; background:#FBE9E7; }
.prose .playbook .rot-editbar{ display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin:8px 0 4px;
  font-size:12.5px; color:var(--pb-muted,#5A6A7E); }
.prose .playbook .rot-ok{ font-size:12.5px; font-weight:700; color:#146C43; }

/* calculadora: alavancas e resultado lado a lado, no celular também */
.prose .playbook .rot-duo{ display:grid; grid-template-columns:1fr 1fr; gap:12px; align-items:start; }
.prose .playbook .rot-col{ min-width:0; }
.prose .playbook .rot-sub{ font-size:11px; letter-spacing:.12em; text-transform:uppercase; font-weight:800;
  color:var(--pb-muted,#5A6A7E); margin:6px 0 8px; }
.prose .playbook table.rot-form{ width:100%; border-collapse:separate; border-spacing:0; margin:0 0 14px; table-layout:fixed; }
.prose .playbook table.rot-form th{ width:56%; text-align:left; font-size:12px; font-weight:700; color:var(--pb-navy,#0B2545);
  padding:6px 8px; background:#F2F5FA; border:1px solid #DDE3EC; border-right:0; border-radius:8px 0 0 8px; line-height:1.3; }
.prose .playbook table.rot-form td{ padding:0; border:1px solid #DDE3EC; border-left:0; border-radius:0 8px 8px 0;
  background:#fff; vertical-align:middle; }
.prose .playbook table.rot-form th{ vertical-align:middle; }
.prose .playbook table.rot-form tr + tr th, .prose .playbook table.rot-form tr + tr td{ border-top:0; }
/* alavanca: contorno e fundo laranja dizem "isto aqui você edita" */
.prose .playbook td.rot-edit{ background:#FFF6EC; border-color:var(--pb-orange,#E8821A); position:relative; }
.prose .playbook tr + tr td.rot-edit{ border-top:1px solid var(--pb-orange,#E8821A); }
.prose .playbook .rot-in{ width:100%; box-sizing:border-box; border:0; background:transparent; padding:7px 26px 7px 6px;
  font-family:inherit; font-size:13px; font-weight:700; color:#8A4A00; text-align:right; }
.prose .playbook .rot-in:focus{ outline:none; background:#fff; box-shadow:inset 0 0 0 2px var(--pb-orange,#E8821A); border-radius:0 7px 7px 0; }
.prose .playbook .rot-un{ position:absolute; right:7px; top:50%; transform:translateY(-50%); font-size:11px; color:#B07A3A; pointer-events:none; }
.prose .playbook .rot-un.esq{ left:7px; right:auto; }
.prose .playbook td.rot-edit.rs .rot-in{ padding-left:26px; }
.prose .playbook td.rot-calc{ padding:7px 8px; font-size:13px; color:var(--pb-text,#1B2A3D); background:#FBFCFE;
  text-align:right; font-variant-numeric:tabular-nums; }
.prose .playbook .rot-out th{ background:#F7F9FC; }

/* tooltip das métricas */
.prose .playbook .rot-dica{ display:inline-flex; align-items:center; justify-content:center; width:15px; height:15px;
  margin-left:5px; border-radius:50%; background:#DDE3EC; color:#5A6A7E; font-size:10px; font-weight:800;
  font-style:normal; cursor:help; position:relative; vertical-align:middle; }
.prose .playbook .rot-dica:hover, .prose .playbook .rot-dica:focus{ background:var(--pb-orange,#E8821A); color:#fff; outline:none; }
.prose .playbook .rot-tip{ position:absolute; left:0; top:130%; z-index:9990; width:230px; background:var(--pb-navy,#0B2545);
  color:#fff; font-size:12px; font-weight:400; line-height:1.5; padding:9px 11px; border-radius:8px; text-align:left;
  text-transform:none; letter-spacing:0; box-shadow:0 6px 20px rgba(11,37,69,.22); opacity:0; visibility:hidden;
  transform:translateY(-4px); transition:.15s; }
.prose .playbook .rot-dica:hover .rot-tip, .prose .playbook .rot-dica:focus .rot-tip{ opacity:1; visibility:visible; transform:none; }
.prose .playbook .rot-col:last-child .rot-tip{ left:auto; right:0; }

/* projeção */
.prose .playbook table.rot-proj{ font-size:13.5px; }
.prose .playbook table.rot-proj th, .prose .playbook table.rot-proj td{ padding:8px 10px; }
.prose .playbook table.rot-proj td{ font-variant-numeric:tabular-nums; white-space:nowrap; }
.prose .playbook .rot-proj-tot td{ background:#F2F5FA; font-weight:700; }
.prose .playbook .rot-proj-alvo{ margin-top:12px; }
.prose .playbook .rot-ver-proj{ margin-top:4px; }

/* quadro de metas — compartilhado pelo time */
.prose .playbook .rot-quadro{ border:1px solid #E3E8F0; border-radius:12px; overflow:hidden; background:#fff; }
.prose .playbook .rot-q-topo{ background:var(--pb-navy,#0B2545); color:#fff; padding:11px 14px; font-weight:800; font-size:14px; }
.prose .playbook .rot-q-data{ width:92px; margin-left:6px; border:0; border-bottom:1px dashed rgba(255,255,255,.5);
  background:transparent; color:#fff; font-family:inherit; font-size:14px; font-weight:800; text-align:center; }
.prose .playbook .rot-q-data:focus{ outline:none; border-bottom-color:var(--pb-orange,#E8821A); }
.prose .playbook .rot-q-sec{ padding:12px 14px 4px; font-weight:800; color:var(--pb-navy,#0B2545); font-size:13.5px; }
.prose .playbook .rot-q-vazio{ padding:0 14px 8px; margin:0; }
.prose .playbook .rot-q-cab, .prose .playbook .rot-q-linha{ display:grid;
  grid-template-columns:1.7fr repeat(var(--cols,4), minmax(0,1fr)) 32px; gap:5px; align-items:center; padding:4px 14px; }
.prose .playbook .rot-q-cab{ font-size:10.5px; color:var(--pb-muted,#5A6A7E); text-transform:uppercase; letter-spacing:.03em; }
.prose .playbook .rot-q-cab b{ text-align:center; font-weight:700; line-height:1.2; word-break:break-word; }
.prose .playbook .rot-q-cab b::before{ content:attr(data-e) " "; }
.prose .playbook .rot-q-linha{ padding-top:3px; padding-bottom:3px; }
.prose .playbook .rot-q-nome{ font-size:13px; font-weight:700; color:var(--pb-navy,#0B2545); line-height:1.25; }
.prose .playbook .rot-eu{ font-style:normal; font-size:10px; font-weight:700; color:#8A4A00; background:#FFF1DF;
  border-radius:4px; padding:1px 4px; margin-left:3px; }
.prose .playbook .rot-q-cel{ display:flex; align-items:center; justify-content:center; min-width:0;
  border:1px solid #DDE3EC; border-radius:7px; background:#fff; padding:4px 3px; font-size:12.5px; font-weight:700;
  color:var(--pb-muted,#5A6A7E); font-variant-numeric:tabular-nums; }
.prose .playbook .rot-q-cel.ok{ background:#EAF7F0; border-color:#9AD3B4; color:#146C43; }
.prose .playbook .rot-q-cel.nao{ background:#FDEEEE; border-color:#F0B4B4; color:#A32020; }
.prose .playbook .rot-q-cel i{ flex:0 0 auto; font-style:normal; font-weight:400; opacity:.7; white-space:nowrap; }
.prose .playbook input.rot-q-f{ flex:1 1 0; width:auto; min-width:0; box-sizing:border-box; border:0; background:transparent;
  padding:0; font-family:inherit; font-size:12.5px; font-weight:700; color:inherit; text-align:right;
  -moz-appearance:textfield; }
.prose .playbook input.rot-q-f::-webkit-outer-spin-button,
.prose .playbook input.rot-q-f::-webkit-inner-spin-button{ -webkit-appearance:none; margin:0; }
.prose .playbook input.rot-q-f:focus{ outline:none; }
.prose .playbook .rot-q-cel:focus-within{ border-color:var(--pb-orange,#E8821A); box-shadow:0 0 0 2px rgba(232,130,26,.18); }
.prose .playbook .rot-q-meta{ font-size:16px; line-height:1; text-align:center; }
.prose .playbook .rot-q-acoes{ display:flex; flex-wrap:wrap; align-items:center; gap:8px; padding:12px 14px;
  border-top:1px solid #E3E8F0; background:#F7F9FC; }
.prose .playbook .rot-q-eco{ font-size:12px; color:var(--pb-muted,#5A6A7E); }
/* metas aprovadas pelo master ou pelo líder */
.prose .playbook .rot-q-aviso:empty{ display:none; }
.prose .playbook .rot-q-aviso{ padding:0 14px 12px; font-size:12.5px; line-height:1.5; color:#8A4A00; background:#FFF6EC; }
.prose .playbook .rot-em-meta .rot-q-topo{ background:#8A4A00; }
.prose .playbook .rot-em-meta .rot-q-meta{ visibility:hidden; }   /* aprovando meta, o ✅/❌ não diz nada */
.prose .playbook .rot-q-cel.meta{ background:#FFF6EC; border-color:var(--pb-orange,#E8821A); color:#8A4A00; }
.prose .playbook .rot-q-cel.oficial{ box-shadow:inset 0 -2px 0 rgba(232,130,26,.55); }
.prose .playbook input.rot-q-mt{ flex:1 1 0; width:auto; min-width:0; box-sizing:border-box; border:0;
  background:transparent; padding:0; font-family:inherit; font-size:12.5px; font-weight:700; color:inherit;
  text-align:center; -moz-appearance:textfield; }
.prose .playbook input.rot-q-mt::-webkit-outer-spin-button,
.prose .playbook input.rot-q-mt::-webkit-inner-spin-button{ -webkit-appearance:none; margin:0; }
.prose .playbook input.rot-q-mt:focus{ outline:none; }

@media (max-width:720px){
  /* as duas colunas continuam lado a lado: o que encolhe é a célula */
  .prose .playbook .rot-duo{ gap:8px; }
  .prose .playbook .rot-sub{ font-size:10px; letter-spacing:.06em; }
  .prose .playbook .rot-duo table.rot-form,
  .prose .playbook .rot-duo table.rot-form tbody,
  .prose .playbook .rot-duo table.rot-form tr,
  .prose .playbook .rot-duo table.rot-form th,
  .prose .playbook .rot-duo table.rot-form td{ display:block; width:auto; }
  .prose .playbook .rot-duo table.rot-form{ margin-bottom:8px; }
  .prose .playbook .rot-duo table.rot-form tr{ margin-bottom:4px; }
  .prose .playbook .rot-duo table.rot-form th{ font-size:10.5px; line-height:1.25; padding:3px 5px;
    border-right:1px solid #DDE3EC; border-bottom:0; border-radius:7px 7px 0 0; }
  .prose .playbook .rot-duo .rot-dica{ width:13px; height:13px; font-size:9px; margin-left:4px; }
  .prose .playbook .rot-duo table.rot-form td{ border-left:1px solid #DDE3EC; border-radius:0 0 8px 8px; }
  .prose .playbook .rot-duo table.rot-form tr + tr th{ border-top:1px solid #DDE3EC; }
  .prose .playbook .rot-duo tr + tr td.rot-edit{ border-top:0; }
  .prose .playbook .rot-duo .rot-in{ font-size:12.5px; padding:4px 20px 4px 6px; }
  .prose .playbook .rot-duo td.rot-edit.rs .rot-in{ padding-left:24px; }
  .prose .playbook .rot-duo .rot-in:focus{ border-radius:0 0 7px 7px; }
  .prose .playbook .rot-duo td.rot-calc{ font-size:12.5px; padding:4px 6px; }
  .prose .playbook .rot-tip{ width:min(230px, 74vw); }
  .prose .playbook .rot-col:first-child .rot-tip{ left:0; right:auto; }
  .prose .playbook .rot-col:last-child .rot-tip{ left:auto; right:0; }
  .prose .playbook .rot-total b{ font-size:19px; }
  /* quadro: nome em cima, números embaixo, cabeçalho só com o emoji */
  .prose .playbook .rot-q-cab{ grid-template-columns:repeat(var(--cols,4), minmax(0,1fr)) 28px;
    gap:4px; padding:8px 12px 0; }
  .prose .playbook .rot-q-cab > span{ display:none; }
  .prose .playbook .rot-q-cab b{ font-size:0; text-align:center; }
  .prose .playbook .rot-q-cab b::before{ content:attr(data-e); font-size:13px; }   /* o texto some, o emoji fica */
  .prose .playbook .rot-q-linha{ grid-template-columns:repeat(var(--cols,4), minmax(0,1fr)) 28px;
    gap:4px; padding:2px 12px 8px; }
  .prose .playbook .rot-q-nome{ grid-column:1 / -1; white-space:normal; padding-top:4px; }
  .prose .playbook .rot-q-cel{ font-size:11.5px; padding:4px 3px; }
  .prose .playbook .rot-q-cel i{ font-size:10.5px; }
  .prose .playbook input.rot-q-f{ font-size:11.5px; }
}

/* ===================== Planilhas: cabeçalho e 1ª coluna congelados ===================== */
/* Formulário de duas colunas não é planilha: precisa deixar o balão da dica
   sair da tabela, senão a explicação nasce cortada. */
.prose table.rot-form, .prose table.pb-dest-tab, .prose table.icp-form{ display:table; overflow:visible; }

.prose .tw, .prose .prose-table-wrap{ overflow:visible; }
.prose .playbook .tw{ overflow:visible; margin:14px 0; }
/* planilha maior que a tela: ganha rolagem própria, com o cabeçalho preso nela */
.prose .tw.rola, .prose .prose-table-wrap.rola, .prose .playbook .tw.rola{ overflow:auto;
  overscroll-behavior:contain;   /* rolando a planilha, a página fica parada: o cabeçalho não foge */
  max-height:calc(100vh - var(--dca-topo, 120px) - 28px);
  max-height:calc(100dvh - var(--dca-topo, 120px) - 28px); }
.prose table.tab-fix{ display:table; table-layout:fixed; border-collapse:separate; border-spacing:0; margin:0;
  overflow:visible; }   /* quem rola é a caixa, não a tabela — senão o cabeçalho não congela */
/* estreitou a coluna? o texto desce de linha — palavra nenhuma é partida ao meio */
.prose table.tab-fix th, .prose table.tab-fix td{ white-space:normal; overflow-wrap:normal;
  word-break:normal; hyphens:none; border-width:0 1px 1px 0; }
.prose table.tab-fix tr > *:first-child{ border-left-width:1px; }
.prose table.tab-fix thead tr:first-child > *{ border-top-width:1px; }
.prose table.tab-fix thead th{ position:sticky; top:var(--dca-topo, 120px); z-index:3; }
.rola table.tab-fix thead th{ top:0; }
.prose .rola table.tab-fix tbody tr > *:first-child{ position:sticky; left:0; z-index:2; background:#fff; }
.prose table.tab-fix tbody tr:nth-child(even) > *:first-child{ background:var(--bg,#F7F9FC); }
.prose .playbook table.tab-fix tbody tr:nth-child(odd) > *:first-child{ background:#F7F9FC; }
.prose .playbook table.tab-fix tbody tr:nth-child(even) > *:first-child{ background:#fff; }
.prose table.tab-fix thead th:first-child{ z-index:4; }
.prose .rola table.tab-fix tbody tr > *:first-child{ box-shadow:1px 0 0 var(--pb-line,#E3E8F0); }
/* barra do master: editar a planilha e publicar para o time */
/* a barra abre a planilha, não fecha: por isso a folga fica em cima */
/* a barra abre a planilha, não fecha: fica em cima e encostada na direita */
.prose .tab-bar{ display:flex; flex-wrap:wrap; align-items:center; justify-content:flex-end;
  gap:8px; margin:16px 0 8px; }
.prose .tab-bar .tab-eco{ flex:1 1 100%; text-align:right; }
.prose .tab-bar button{ border:1px solid #DCE6F7; background:#fff; color:var(--pb-navy,#0B2545); border-radius:8px;
  padding:6px 11px; font-family:inherit; font-size:12.5px; font-weight:700; cursor:pointer; }
.prose .tab-bar button:hover{ background:#F2F5FA; }
.prose .tab-bar .tab-salvar{ background:var(--pb-blue,#2563EB); border-color:var(--pb-blue,#2563EB); color:#fff; }
.prose .tab-bar .tab-salvar:hover{ background:var(--pb-navy,#0B2545); }
.prose .tab-bar .tab-original{ border-color:#F0C9A8; color:#8A4A00; }
.prose .tab-marca{ font-size:11.5px; font-weight:700; color:#146C43; background:#EAF7F0; border-radius:5px; padding:2px 7px; }
.prose .tab-eco{ font-size:12.5px; color:var(--pb-muted,#5A6A7E); }
.prose table.tab-editando th, .prose table.tab-editando td{ cursor:text; }
.prose table.tab-editando td:hover{ background:#FFF6EC; }
.prose table.tab-editando td:focus, .prose table.tab-editando .tab-ed:focus{ outline:2px solid var(--pb-orange,#E8821A);
  outline-offset:-2px; background:#fff; }
.prose table.tab-editando .tab-ed{ display:inline-block; min-width:30px; }
.prose .tab-x{ border:0; background:transparent; color:#fff; opacity:.55; font-size:11px; line-height:1;
  padding:3px 5px; margin-left:6px; border-radius:5px; font-family:inherit; cursor:pointer; }
.prose .tab-x:hover{ opacity:1; background:rgba(255,255,255,.2); }
.prose td.tab-acao{ text-align:center; padding:5px 2px; white-space:nowrap; }
/* arrastar e soltar: ordem das colunas e das linhas, no toque e no mouse */
.prose .tab-grip{ display:inline-block; cursor:grab; user-select:none; touch-action:none;
  font-size:13px; line-height:1; padding:3px 4px; border-radius:5px; opacity:.55; }
.prose .tab-grip:hover{ opacity:1; background:rgba(255,255,255,.18); }
.prose td.tab-acao .tab-grip{ color:var(--pb-muted,#5A6A7E); }
.prose td.tab-acao .tab-grip:hover{ background:#EEF2F8; }
.prose .tab-grip-col{ margin-right:6px; color:#fff; }
.prose table.tab-arrastando .tab-grip{ cursor:grabbing; }
.prose table.tab-arrastando th.tab-alvo, .prose table.tab-arrastando td.tab-alvo{
  outline:2px solid var(--pb-orange,#E8821A); outline-offset:-2px; background:#FFF6EC; }
.prose table.tab-arrastando tr.tab-alvo > td{ background:#FFF6EC; }
.prose .tab-del-lin{ color:#C0392B; opacity:.5; margin:0; }
.prose .tab-del-lin:hover{ opacity:1; background:#FBE9E7; }

/* botão do canto: copia a célula inteira, um item embaixo do outro */
.prose table.tab-fix td.tem-copia{ position:relative; padding-right:28px; }
.prose .tab-copia-tudo{ position:absolute; top:3px; right:3px; margin:0; z-index:2;
  background:var(--pb-blue,#2563EB); color:#fff; border-color:var(--pb-blue,#2563EB); opacity:.5; }
.prose .tab-copia-tudo:hover{ opacity:1; background:var(--pb-navy,#0B2545); }
.prose .tab-copia-tudo.ok{ background:#146C43; border-color:#146C43; color:#fff; }

/* botão do cabeçalho: copia a coluna inteira, um item embaixo do outro.
   O cabeçalho já é congelado e já tem a alça de arrastar a largura no canto
   direito, então o botão entra à esquerda dela, com folga para as duas. */
/* NÃO declarar position aqui: o <th> é sticky (cabeçalho congelado) e um
   position:relative venceria o sticky por especificidade, soltando o cabeçalho
   126px para baixo, por cima da terceira linha. Sticky já é posicionado, então
   o botão absoluto se ancora nele do mesmo jeito. */
.prose table.tab-fix th.tem-copia-col{ padding-right:34px; }
.prose .tab-copia-col{ position:absolute; top:50%; right:12px; transform:translateY(-50%);
  margin:0; z-index:2; background:rgba(255,255,255,.18); color:#fff;
  border-color:rgba(255,255,255,.35); opacity:.75; }
.prose .tab-copia-col:hover{ opacity:1; background:rgba(255,255,255,.32); }
.prose .tab-copia-col.ok{ background:#146C43; border-color:#146C43; color:#fff; opacity:1; }

/* variáveis do card: o formulário que fica acima da planilha */
.prose .tab-vars{ border:1px solid var(--pb-line,#E3E8F0); border-left:4px solid var(--pb-orange,#E8821A);
  border-radius:10px; background:#FFFDF9; padding:12px 14px; margin:16px 0; }
.prose .tab-vars .rot-topo{ display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin-bottom:8px; }
.prose .tab-vars .rot-titulo{ flex:1 1 240px; font-weight:800; color:var(--pb-navy,#0B2545); font-size:15.5px; line-height:1.3; }
.prose .tab-vars .rot-resetar{ border:1px solid #F0C9A8; background:#fff; color:#8A4A00; border-radius:8px;
  padding:6px 11px; font-family:inherit; font-size:12.5px; font-weight:700; cursor:pointer; }
.prose .tab-vars .rot-resetar:hover{ background:#FFF6EC; }
.prose .tab-vars .rot-exportar{ background:var(--pb-blue,#2563EB); border-color:var(--pb-blue,#2563EB); color:#fff; }
.prose .tab-vars .rot-exportar:hover{ background:var(--pb-navy,#0B2545); }
.prose .tab-vars .tv-h{ font-weight:800; color:var(--pb-navy,#0B2545); font-size:14.5px; }
.prose .tab-vars .tv-sub{ font-size:12.5px; color:var(--pb-muted,#5A6A7E); margin:2px 0 10px; }
.prose .tab-vars table.tv-tab{ width:100%; border-collapse:collapse; margin:0; display:table; }
.prose .tab-vars table.tv-tab td{ border:0; padding:3px 0; vertical-align:middle; background:none; }
.prose .tab-vars td.tv-rot{ width:38%; font-size:12.5px; font-weight:700; color:var(--pb-navy,#0B2545);
  padding-right:10px; white-space:normal; }
.prose .tab-vars input.tv-in, .prose .tab-vars select.tv-in{ width:100%; box-sizing:border-box; border:1px solid #DCE6F7; border-radius:8px;
  padding:7px 9px; font-family:inherit; font-size:13px; color:var(--ink,#111827); background:#fff; }
.prose .tab-vars input.tv-in:focus, .prose .tab-vars select.tv-in:focus{ outline:2px solid var(--pb-orange,#E8821A); outline-offset:-2px; }
.prose .tab-vars .tv-linha{ display:flex; align-items:center; gap:4px; }
.prose .tab-vars .tv-linha .tv-in{ flex:1 1 auto; min-width:0; }
.prose .tab-vars .tv-menos{ border:0; background:transparent; color:#C0392B; opacity:.6; cursor:pointer;
  font-size:13px; padding:4px 6px; font-family:inherit; }
.prose .tab-vars .tv-menos:hover{ opacity:1; }
.prose .tab-vars .tv-acoes{ display:flex; flex-wrap:wrap; gap:8px; margin-top:10px; }
.prose .tab-vars .tv-acoes button{ border:1px solid #DCE6F7; background:#fff; color:var(--pb-navy,#0B2545);
  border-radius:8px; padding:6px 11px; font-family:inherit; font-size:12.5px; font-weight:700; cursor:pointer; }
.prose .tab-vars .tv-acoes button:hover{ background:#F2F5FA; }
.prose .tab-vars .tv-mais{ border-color:#F0C9A8; color:#8A4A00; }
.prose .tab-vars .rot-eco{ color:var(--pb-blue,#2563EB); font-weight:700; }

/* passo a passo para levar o roteiro ao Google Docs */
#rot-doc{ position:fixed; inset:0; z-index:9999; display:flex; align-items:center; justify-content:center; padding:16px; }
#rot-doc .rd-bd{ position:absolute; inset:0; background:rgba(11,37,69,.55); }
#rot-doc .rd-card{ position:relative; background:#fff; border-radius:14px; padding:18px; max-width:560px; width:100%;
  max-height:88vh; overflow:auto; box-shadow:0 18px 50px rgba(11,37,69,.3); font-family:inherit; color:var(--ink,#111827); }
#rot-doc .rd-top{ display:flex; align-items:center; gap:10px; font-size:16px; color:var(--pb-navy,#0B2545); }
#rot-doc .rd-top b{ flex:1; }
#rot-doc .rd-x{ border:0; background:transparent; font-size:15px; cursor:pointer; color:var(--pb-muted,#5A6A7E); }
#rot-doc .rd-p{ font-size:13.5px; line-height:1.6; color:var(--ink-2,#374151); margin:8px 0 14px; }
#rot-doc .rd-passo{ display:flex; gap:12px; padding:12px 0; border-top:1px solid var(--pb-line,#E3E8F0); }
#rot-doc .rd-n{ flex:0 0 26px; height:26px; border-radius:50%; background:var(--pb-navy,#0B2545); color:#fff;
  font-size:13px; font-weight:800; display:flex; align-items:center; justify-content:center; }
#rot-doc .rd-c{ flex:1; min-width:0; }
#rot-doc .rd-c b{ color:var(--pb-navy,#0B2545); font-size:14px; }
#rot-doc .rd-c p{ font-size:13px; line-height:1.6; color:var(--ink-2,#374151); margin:4px 0 8px; }
#rot-doc .rd-c button{ border:1px solid #DCE6F7; background:#fff; color:var(--pb-navy,#0B2545); border-radius:8px;
  padding:8px 13px; font-family:inherit; font-size:13px; font-weight:700; cursor:pointer; }
#rot-doc .rd-c button:hover{ background:#F2F5FA; }
#rot-doc .rd-criar{ background:var(--pb-blue,#2563EB) !important; border-color:var(--pb-blue,#2563EB) !important; color:#fff !important; }
#rot-doc .rd-criar:hover{ background:var(--pb-navy,#0B2545) !important; }
#rot-doc .rd-titulo{ background:#F2F5FA; border:1px solid var(--pb-line,#E3E8F0); border-radius:8px; padding:9px 11px;
  font-size:13px; font-weight:700; color:var(--pb-navy,#0B2545); margin:0 0 8px; word-break:break-word; }
#rot-doc .rd-aviso{ margin-top:12px; background:#FFF6EC; border:1px solid #F0C9A8; border-radius:8px; padding:9px 11px;
  font-size:12.5px; color:#8A4A00; }

/* roteiro em edição: célula clicável e o 🗑️ que tira a linha */
.prose table.rot-editando td{ cursor:text; }
.prose table.rot-editando td:hover{ background:#FFF6EC; }
.prose table.rot-editando td:focus{ outline:2px solid var(--pb-orange,#E8821A); outline-offset:-2px; background:#fff; }
.prose .rot-lixo{ float:left; border:0; background:transparent; padding:0 4px 2px 0; margin:0;
  font-size:13px; line-height:1; cursor:pointer; font-family:inherit; opacity:.65; }
.prose .rot-lixo:hover{ opacity:1; }

/* valor preenchido: fica visível que aquilo saiu da tabela de variáveis */
.prose .tv-on{ background:#FFF1DF; border-bottom:1px solid #F0C9A8; border-radius:3px; padding:0 2px; font-weight:700; }
@media (max-width:640px){
  .prose .tab-vars td.tv-rot{ width:42%; font-size:12px; }
}

/* dentro da planilha o código também desce de linha — nunca vaza para fora da coluna */
.prose table.tab-fix td code, .prose table.tab-fix th code{ white-space:normal; }
.prose .tab-move{ color:#fff; }
/* copiar item por item: um botão discreto ao lado de cada célula (ou de cada item da lista) */
.prose .tab-copia{ border:1px solid #DCE6F7; background:#fff; color:var(--pb-blue,#2563EB); opacity:.75;
  font-size:11px; line-height:1; padding:2px 5px; margin-left:6px; border-radius:5px;
  font-family:inherit; cursor:pointer; vertical-align:baseline; }
.prose .tab-copia:hover{ opacity:1; background:#EEF4FF; }
.prose .tab-copia.ok{ opacity:1; color:#146C43; border-color:#B7E0C8; background:#EAF7F0; }
.prose table.tab-fix td li{ margin:2px 0; }

/* divisória: arraste para mudar a largura da coluna */
.tab-puxa{ position:absolute; top:0; right:-5px; width:10px; height:100%; cursor:col-resize;
  touch-action:none; z-index:6; }
.tab-puxa:hover{ background:rgba(232,130,26,.55); }
table.tab-puxando{ user-select:none; -webkit-user-select:none; }
table.tab-puxando .tab-puxa{ background:rgba(232,130,26,.75); }
@media (max-width:720px){
  .tab-puxa{ width:18px; right:-9px; }

}

/* ===================== Playbook Comercial Interativo ===================== */
/* Conhecimento do Projeto: o questionário que alimenta a IA */
.prose [data-pb-projeto]{ margin:18px 0; }
.prose .pj-topo{ margin-bottom:12px; }
.prose .pj-titulo{ font-size:17px; font-weight:800; color:var(--pb-navy,#0B2545); }
.prose .pj-sub{ font-size:13.5px; line-height:1.6; color:var(--pb-muted,#5A6A7E); margin-top:3px; }
.prose .pj-progresso{ display:flex; align-items:center; flex-wrap:wrap; gap:10px; margin:0 0 16px;
  position:sticky; top:var(--dca-topo,120px); z-index:5; background:#fff; padding:8px 0; }
.prose .pj-barra{ flex:1 1 160px; height:8px; border-radius:99px; background:var(--line-2,#EDF1F7); overflow:hidden; min-width:120px; }
.prose .pj-barra i{ display:block; height:100%; background:var(--pb-orange,#E8821A); transition:width .25s; }
.prose .pj-conta{ font-size:12.5px; font-weight:700; color:var(--pb-navy,#0B2545); }
.prose .pj-eco{ font-size:12.5px; color:var(--pb-blue,#2563EB); font-weight:700; }
.prose .pj-bloco{ border:1px solid var(--pb-line,#E3E8F0); border-radius:12px; margin:0 0 14px; overflow:hidden; }
.prose .pj-bloco-h{ background:var(--pb-navy,#0B2545); color:#fff; padding:10px 14px; font-weight:800; font-size:14.5px; }
.prose .pj-bloco-h span{ display:block; font-weight:400; font-size:12.5px; color:#C9D6EA; margin-top:2px; }
.prose table.pj-tab{ width:100%; border-collapse:collapse; margin:0; display:table; }
.prose table.pj-tab td{ border:0; border-bottom:1px solid var(--pb-line,#E3E8F0); padding:9px 14px; vertical-align:top; background:none; }
.prose table.pj-tab tr:last-child td{ border-bottom:0; }
.prose td.pj-q{ width:34%; font-size:13px; font-weight:700; color:var(--pb-navy,#0B2545); }
.prose td.pj-a{ width:66%; }
.prose .pj-in{ width:100%; box-sizing:border-box; border:1px solid #DCE6F7; border-radius:8px; padding:8px 10px;
  font-family:inherit; font-size:13.5px; line-height:1.5; color:var(--ink,#111827); background:#fff; resize:vertical; }
.prose .pj-in:focus{ outline:2px solid var(--pb-orange,#E8821A); outline-offset:-2px; }
.prose .pj-envio{ display:flex; flex-wrap:wrap; align-items:center; gap:8px; padding:12px 14px; }
.prose .pj-envio button{ border:1px solid #DCE6F7; background:#fff; color:var(--pb-navy,#0B2545); border-radius:8px;
  padding:7px 12px; font-family:inherit; font-size:12.5px; font-weight:700; cursor:pointer; }
.prose .pj-envio button:hover{ background:#F2F5FA; }
.prose .pj-add-arq{ background:var(--pb-blue,#2563EB) !important; border-color:var(--pb-blue,#2563EB) !important; color:#fff !important; }
.prose .pj-link{ flex:1 1 220px; min-width:0; box-sizing:border-box; border:1px solid #DCE6F7; border-radius:8px;
  padding:7px 10px; font-family:inherit; font-size:13px; }
.prose .pj-itens-conta{ font-size:12.5px; font-weight:700; color:var(--pb-muted,#5A6A7E); }
.prose .pj-lista{ padding:0 14px 8px; }
.prose ul.pj-itens{ list-style:none; margin:0; padding:0; }
.prose ul.pj-itens li{ display:flex; align-items:center; gap:8px; padding:8px 0; border-top:1px solid var(--pb-line,#E3E8F0); margin:0; }
.prose .pj-ic{ flex:0 0 auto; font-size:15px; }
.prose .pj-nome{ flex:1 1 auto; min-width:0; font-size:13.5px; font-weight:700; color:var(--pb-blue,#2563EB);
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.prose .pj-nota{ font-size:12px; color:var(--pb-muted,#5A6A7E); }
.prose .pj-x{ border:0; background:transparent; color:#C0392B; opacity:.6; cursor:pointer; font-size:13px; padding:4px 6px; font-family:inherit; }
.prose .pj-x:hover{ opacity:1; }
.prose .pj-vazio{ font-size:13px; line-height:1.6; color:var(--pb-muted,#5A6A7E); padding:10px 0 4px; }
.prose .pj-dica{ font-size:12px; color:var(--pb-muted,#8C99AA); padding:0 14px 12px; }

/* A chave da Anthropic do aluno */
.prose [data-pb-ia]{ margin:18px 0; }
.prose .ia-caixa{ border:1px solid var(--pb-line,#E3E8F0); border-left:4px solid var(--pb-blue,#2563EB);
  border-radius:12px; background:#F8FBFF; padding:14px 16px; }
.prose .ia-titulo{ font-weight:800; font-size:15px; color:var(--pb-navy,#0B2545); }
.prose .ia-estado{ font-size:13px; color:var(--pb-muted,#5A6A7E); margin:6px 0 10px; }
.prose .ia-estado.ok{ color:#146C43; font-weight:700; }
.prose .ia-in{ width:100%; box-sizing:border-box; border:1px solid #DCE6F7; border-radius:8px; padding:9px 11px;
  font-family:ui-monospace,SFMono-Regular,Menlo,monospace; font-size:13px; }
.prose .ia-acoes{ display:flex; flex-wrap:wrap; gap:8px; margin-top:10px; }
.prose .ia-acoes button{ border:1px solid #DCE6F7; background:#fff; color:var(--pb-navy,#0B2545); border-radius:8px;
  padding:7px 12px; font-family:inherit; font-size:12.5px; font-weight:700; cursor:pointer; }
.prose .ia-remover{ border-color:#F3C9C4 !important; color:#C0392B !important; }
.prose .ia-eco{ font-size:13px; margin-top:10px; color:var(--pb-muted,#5A6A7E); line-height:1.5; }
.prose .ia-eco.ok{ color:#146C43; font-weight:700; }
.prose .ia-eco.ruim{ color:#C0392B; font-weight:700; }
.prose .ia-aviso{ font-size:12px; line-height:1.6; color:var(--pb-muted,#8C99AA); margin-top:10px; }

/* passo a passo ilustrado do tutorial (aula da API) */
.prose .tut{ counter-reset:tut; margin:16px 0; }
.prose .tut-p{ display:flex; gap:12px; padding:14px 0; border-top:1px solid var(--pb-line,#E3E8F0); }
.prose .tut-p:first-child{ border-top:0; }
.prose .tut-n{ flex:0 0 28px; height:28px; border-radius:50%; background:var(--pb-navy,#0B2545); color:#fff;
  font-size:13px; font-weight:800; display:flex; align-items:center; justify-content:center; }
.prose .tut-c{ flex:1; min-width:0; }
.prose .tut-c h4{ margin:2px 0 6px; font-size:15px; color:var(--pb-navy,#0B2545); }
.prose .tut-c p{ margin:0 0 8px; font-size:13.5px; line-height:1.65; }
.prose .tut-tela{ border:1px solid var(--pb-line,#E3E8F0); border-radius:10px; overflow:hidden; margin:8px 0 10px; background:#fff; }
.prose .tut-barra{ background:#0B2545; color:#C9D6EA; font-size:11.5px; padding:6px 10px;
  font-family:ui-monospace,SFMono-Regular,Menlo,monospace; display:flex; align-items:center; gap:6px; }
.prose .tut-barra b{ color:#fff; font-weight:700; }
.prose .tut-corpo{ padding:12px; font-size:12.5px; color:var(--ink-2,#374151); line-height:1.7; }
.prose .tut-menu{ display:flex; flex-wrap:wrap; gap:6px; margin-bottom:8px; }
.prose .tut-item{ border:1px solid var(--pb-line,#E3E8F0); border-radius:7px; padding:4px 9px; font-size:12px; color:var(--pb-muted,#5A6A7E); }
.prose .tut-item.on{ background:var(--pb-orange,#E8821A); border-color:var(--pb-orange,#E8821A); color:#fff; font-weight:700; }
.prose .tut-btn{ display:inline-block; background:var(--pb-blue,#2563EB); color:#fff; border-radius:7px;
  padding:5px 11px; font-size:12px; font-weight:700; }
@media (max-width:640px){
  .prose table.pj-tab, .prose table.pj-tab tbody, .prose table.pj-tab tr, .prose table.pj-tab td{ display:block; width:auto; }
  .prose td.pj-q{ width:auto; padding:10px 12px 2px; }
  .prose td.pj-a{ width:auto; padding:0 12px 10px; }
  .prose table.pj-tab tr{ border-bottom:1px solid var(--pb-line,#E3E8F0); }
  .prose table.pj-tab tr:last-child{ border-bottom:0; }
  .prose table.pj-tab td{ border-bottom:0; }
}

/* capítulo gerado pela IA do aluno */
.prose [data-pb-gerar]{ margin:16px 0; }
.prose .ger-barra{ display:flex; flex-wrap:wrap; align-items:center; gap:10px; margin-bottom:12px; }
.prose .ger-barra button{ border:1px solid #DCE6F7; background:#fff; color:var(--pb-navy,#0B2545); border-radius:8px;
  padding:8px 13px; font-family:inherit; font-size:13px; font-weight:700; cursor:pointer; }
.prose .ger-barra button:disabled{ opacity:.6; cursor:default; }
.prose .ger-limpar{ border-color:#F0C9A8 !important; color:#8A4A00 !important; }
.prose .ger-marca{ font-size:11.5px; font-weight:700; color:#146C43; background:#EAF7F0; border-radius:5px; padding:3px 8px; }
.prose .ger-eco{ flex:1 1 200px; font-size:12.5px; line-height:1.5; color:var(--pb-blue,#2563EB); font-weight:700; }
.prose .ger-eco.ruim{ color:#C0392B; }
.prose .ger-resumo{ border-left:4px solid var(--pb-orange,#E8821A); background:#FFFDF9; border-radius:0 10px 10px 0;
  padding:10px 14px; font-size:14px; font-weight:700; color:var(--pb-navy,#0B2545); margin:0 0 14px; line-height:1.55; }
.prose .msg-when{ font-size:12.5px; color:var(--pb-muted,#5A6A7E); padding:0 14px 2px; }

/* ---------------------------------------------------------------------------
   Conhecimento do Projeto — o banco de conhecimento no topo, o botão de
   análise e o selo que diz de onde veio cada resposta.
   --------------------------------------------------------------------------- */
.pj-banco { border-color: var(--accent, #1262f3); }
.pj-analise {
  margin-top: 14px; padding-top: 14px;
  border-top: 1px dashed var(--line, #2a3550);
}
.pj-analise .pj-gerar { font-size: 15px; padding: 11px 18px; }
.pj-analise .pj-gerar[disabled] { opacity: .45; cursor: not-allowed; }
.pj-trava {
  display: inline-block; margin-left: 10px; font-size: 12.5px;
  color: var(--muted, #93a2bd); vertical-align: middle;
}
.pj-analise-txt { margin-top: 8px; font-size: 12.5px; color: var(--muted, #93a2bd); line-height: 1.55; }
.pj-eco-analise { margin-top: 10px; font-size: 13px; line-height: 1.6; }
.pj-eco-analise.ruim { color: #ff8080; }
.pj-notas { margin: 8px 0 0; padding-left: 18px; font-size: 12.5px; color: var(--muted, #93a2bd); }
.pj-notas li { margin: 2px 0; }
.pj-conferir { margin-top: 8px; font-size: 12.5px; color: #ffc46b; }

.pj-selo {
  display: block; margin-top: 5px; font-size: 11.5px; line-height: 1.45;
  color: var(--muted, #93a2bd);
}
.pj-selo em { display: block; font-style: normal; opacity: .8; }
.pj-selo-material { color: #7fd6a4; }
.pj-selo-internet { color: #79b6ff; }
.pj-selo-estimativa { color: #ffc46b; }

.ia-casa {
  margin-top: 18px; padding-top: 16px;
  border-top: 1px dashed var(--line, #2a3550);
}
.ia-casa-in {
  width: 100%; margin-top: 8px; padding: 10px 12px;
  border: 1px solid var(--line, #2a3550); border-radius: 8px;
  background: var(--bg, #0d1424); color: var(--fg, #e8eefc); font-size: 14px;
}
.ger-trava { font-size: 12.5px; color: var(--muted, #93a2bd); }
.ger-rodar[disabled] { opacity: .45; cursor: not-allowed; }

/* o capítulo: modelo padrão, texto da IA ou a edição do próprio aluno */
.ger-marca-modelo { opacity: .75; }
.ger-editar { font-size: 12.5px; }
.ger-saida.ger-editando { outline: 2px dashed var(--accent, #1262f3); outline-offset: 6px; border-radius: 8px; }
.ger-saida.ger-editando [contenteditable="true"]:focus {
  outline: 2px solid var(--accent, #1262f3); outline-offset: 2px; border-radius: 4px;
}
/* gerar o playbook inteiro */
.pj-playbook { border-color: var(--accent, #1262f3); }
.pj-pb-barra {
  height: 6px; margin-top: 12px; border-radius: 99px;
  background: var(--line, #2a3550); overflow: hidden;
}
.pj-pb-barra i { display: block; height: 100%; background: var(--accent, #1262f3); transition: width .3s; }
.pj-pb-eco { margin-top: 8px; font-size: 13px; line-height: 1.6; }
.pj-pb-eco.ruim { color: #ff8080; }

/* ---- Tutorial WhatsApp OMNI: marcadores de print e anexos de código ---- */
.prose .wa-print {
  display: flex; flex-direction: column; gap: 4px;
  margin: 0 0 16px; padding: 12px 14px;
  border: 1px dashed var(--line, #2a3550); border-radius: 10px;
  background: transparent; font-size: 14px; line-height: 1.6;
}
.prose .wa-print span { font-size: 12.5px; opacity: .72; }
.prose .wa-cod {
  margin: 0 0 16px; border: 1px solid var(--line, #2a3550);
  border-radius: 10px; overflow: hidden;
}
.prose .wa-cod-h {
  padding: 8px 14px; font-size: 12.5px; font-weight: 700;
  letter-spacing: .02em; text-transform: uppercase;
  background: var(--line-2); border-bottom: 1px solid var(--line, #2a3550);
}
.prose .wa-cod pre {
  margin: 0; border-radius: 0; max-height: 60vh;
  white-space: pre; word-break: normal; overflow: auto;
}

/* ---- Avisar alunos: escolha do canal, mensagem e fila de envio ---- */
.ntf-canais { display: flex; gap: 8px; margin: 0 0 4px; }
.ntf-canal {
  flex: 1; padding: 10px 12px; border: 1.5px solid var(--line); border-radius: 10px;
  background: var(--card); color: var(--ink-2); font: inherit; font-size: 13.5px; font-weight: 700;
  cursor: pointer; transition: border-color .12s, background .12s, color .12s;
}
.ntf-canal:hover { border-color: var(--blue); }
.ntf-canal.on { border-color: var(--blue); background: var(--blue-50); color: var(--blue); }
.ntf-msg { width: 100%; resize: vertical; line-height: 1.55; font-size: 13.5px; }
.ntf-add { display: flex; gap: 8px; flex-wrap: wrap; }
.ntf-add .adm-input { flex: 1 1 140px; }
.ntf-fila { display: flex; flex-direction: column; gap: 6px; max-height: 320px; overflow: auto; }
.ntf-fila-item {
  display: flex; align-items: center; justify-content: space-between; gap: 10px;
  padding: 10px 12px; border: 1.5px solid var(--line); border-radius: 10px; font-size: 14px;
}
.ntf-fila-item.feito { border-color: var(--green, #16a34a); opacity: .72; }