:root { --ink: #1f2933; --muted: #5f6b7a; --line: #e4e8ee; --bg: #f7f8fa; --card: #ffffff; --accent: #0b6e4f; --warn-bg: #fff6e5; --warn-ink: #7a4b00; }
  * { box-sizing: border-box; }
  body { margin: 0; background: var(--bg); color: var(--ink); font: 16px/1.5 -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif; }
  main { max-width: 720px; margin: 0 auto; padding: 16px; }
  header.topo h1 { font-size: 1.6rem; margin: 0 0 4px; }
  header.topo p { margin: 0; color: var(--muted); }
  .acoes { display: flex; gap: 8px; flex-wrap: wrap; margin: 12px 0 20px; }
  .botao { display: inline-block; padding: 8px 12px; border-radius: 8px; background: var(--accent); color: #fff; text-decoration: none; font-weight: 600; font-size: 0.95rem; }
  .botao.secundario { background: #fff; color: var(--accent); border: 1px solid var(--accent); }
  .aviso { background: var(--warn-bg); color: var(--warn-ink); border-radius: 10px; padding: 12px 14px; margin: 12px 0; }
  .aviso ul, .lista-simples { margin: 6px 0 0; padding-left: 18px; }
  section.dia { margin: 28px 0; }
  section.dia h2 { font-size: 1.25rem; margin: 0; }
  section.dia .data { color: var(--muted); font-size: 0.95rem; margin: 0 0 8px; }
  .clima { font-size: 0.95rem; color: var(--muted); margin: 0 0 12px; }
  article.parada { background: var(--card); border: 1px solid var(--line); border-radius: 12px; padding: 12px 14px; margin: 10px 0; }
  .horario { font-weight: 700; color: var(--accent); font-variant-numeric: tabular-nums; }
  .parada h3 { font-size: 1.05rem; margin: 2px 0 4px; }
  .parada p { margin: 4px 0; }
  .meta { font-size: 0.9rem; color: var(--muted); }
  .deslocamento { border-left: 3px solid var(--line); padding-left: 10px; margin: 8px 0; font-size: 0.95rem; }
  .ingresso { font-size: 0.95rem; }
  .ingresso strong { color: var(--warn-ink); }
  .links a { margin-right: 12px; font-size: 0.9rem; }
  .plano-b { background: #eef7f3; border-radius: 10px; padding: 10px 12px; margin: 10px 0; font-size: 0.95rem; }
  .alertas { font-size: 0.95rem; }
  .guia table { width: 100%; border-collapse: collapse; font-size: 0.95rem; }
  .guia th, .guia td { text-align: left; padding: 6px 4px; border-bottom: 1px solid var(--line); vertical-align: top; }
  details summary { cursor: pointer; color: var(--muted); }
  footer { color: var(--muted); font-size: 0.85rem; margin: 32px 0 16px; }
  a { color: var(--accent); word-break: break-word; }
  @media print {
    body { background: #fff; font-size: 11pt; }
    main { max-width: none; padding: 0; }
    .acoes, .so-tela { display: none; }
    section.dia { break-before: page; }
    section.dia:first-of-type { break-before: auto; }
    article.parada { break-inside: avoid; }
    a { color: var(--ink); text-decoration: none; }
    a[href^="http"]::after { content: ""; }
  }

/* --- Só na página de exemplo do site ---------------------------------------------- */
.exemplo-topo { background: #10283a; color: #fffaf2; }
.exemplo-topo .barra, .exemplo-topo .aviso-exemplo, .exemplo-rodape div {
  max-width: 720px; margin: 0 auto; padding: 0 16px; }
.exemplo-topo .barra { display: flex; align-items: center; gap: 8px; padding-top: 10px; }
.exemplo-topo .marca { display: inline-flex; align-items: center; gap: 8px; color: #fffaf2;
  font-weight: 800; font-size: 1.2rem; text-decoration: none; margin-right: auto; }
.exemplo-topo .social { display: inline-flex; align-items: center; justify-content: center;
  width: 38px; height: 38px; border-radius: 10px; color: #fffaf2; }
.exemplo-topo .social:hover, .exemplo-topo .social:focus-visible { background: #24435a; }
.exemplo-topo .aviso-exemplo { padding-top: 4px; padding-bottom: 12px; font-size: 0.95rem; }
.exemplo-topo .aviso-exemplo p { margin: 4px 0; }
.exemplo-topo a { color: #ffc23d; font-weight: 600; }
.exemplo-chamada { background: #fff; border: 2px solid #ff6233; border-radius: 14px;
  padding: 16px; margin: 32px 0 8px; text-align: center; }
.exemplo-chamada h2 { margin: 0 0 6px; font-size: 1.2rem; }
.exemplo-chamada p { margin: 0 0 12px; color: var(--muted); }
.exemplo-chamada .botao { background: #ff6233; font-size: 1rem; padding: 10px 16px; }
.exemplo-rodape { border-top: 1px solid var(--line); color: var(--muted); font-size: 0.85rem; }
.exemplo-rodape div { padding-top: 12px; padding-bottom: 24px; }
.exemplo-rodape p { margin: 4px 0; }
@media print { .exemplo-topo, .exemplo-chamada, .exemplo-rodape { display: none; } }