/* Duas folhas A4 (pré-anestésica e transoperatório) desenhadas em milímetros: o mesmo desenho vira SVG na tela e vetor no PDF. A moldura segue o tema; as folhas são sempre papel branco. */
:root {
  --bg: #D9E1DF; --surface: #FFFFFF; --surface-2: #F0F4F3; --sheet: #FFFFFF; --ink: #132220; --muted: #586A67;
  --line: #C6D1CF; --line-strong: #95A7A3; --accent: #1D6A64; --accent-ink: #FFFFFF; --accent-soft: #D9EAE7;
  --warn: #9E500A; --warn-soft: #FAE8D3; --ok: #2B7448; --ok-soft: #DCEFE2;
  --shadow: 0 1px 2px rgba(19, 34, 32, .06), 0 8px 24px rgba(19, 34, 32, .08);
  --paper-shadow: 0 1px 3px rgba(19, 34, 32, .14), 0 14px 36px rgba(19, 34, 32, .16);
  --font-label: "Barlow Semi Condensed", "Arial Narrow", system-ui, sans-serif;
  --font-body: "Atkinson Hyperlegible", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-data: "JetBrains Mono", ui-monospace, "SF Mono", Menlo, Consolas, monospace;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --bg: #0B1110; --surface: #141E1D; --surface-2: #1B2726; --ink: #E0EAE8; --muted: #93A6A2; --line: #2A3836; --line-strong: #46564F;
    --accent: #6BC2B9; --accent-ink: #0C1312; --accent-soft: #1B3431; --warn: #F2A65A; --warn-soft: #3A2814; --ok: #7DD29A; --ok-soft: #162E1F;
    --shadow: 0 1px 2px rgba(0,0,0,.4), 0 8px 24px rgba(0,0,0,.35); --paper-shadow: 0 0 0 1px rgba(255,255,255,.05), 0 14px 36px rgba(0,0,0,.55);
    color-scheme: dark;
  }
}
:root[data-theme="dark"] {
  --bg: #0B1110; --surface: #141E1D; --surface-2: #1B2726; --ink: #E0EAE8; --muted: #93A6A2; --line: #2A3836; --line-strong: #46564F;
  --accent: #6BC2B9; --accent-ink: #0C1312; --accent-soft: #1B3431; --warn: #F2A65A; --warn-soft: #3A2814; --ok: #7DD29A; --ok-soft: #162E1F;
  --shadow: 0 1px 2px rgba(0,0,0,.4), 0 8px 24px rgba(0,0,0,.35); --paper-shadow: 0 0 0 1px rgba(255,255,255,.05), 0 14px 36px rgba(0,0,0,.55);
  color-scheme: dark;
}
* { box-sizing: border-box; }
[hidden] { display: none !important; }
body { background: var(--bg); color: var(--ink); font-family: var(--font-body); font-size: 15px; line-height: 1.45; }
body::before { content: ""; position: fixed; top: 0; right: 0; left: 0; height: env(safe-area-inset-top, 0px); z-index: 10; background: var(--surface); }
button, input, textarea { font: inherit; color: inherit; }
:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }

.bar { position: sticky; top: env(safe-area-inset-top, 0px); z-index: 8; background: var(--surface); border-bottom: 1px solid var(--line);
  padding-left: max(16px, env(safe-area-inset-left, 0px)); padding-right: max(16px, env(safe-area-inset-right, 0px)); padding-top: 8px; padding-bottom: 8px; }
.bar-in { max-width: 1180px; margin: 0 auto; display: flex; align-items: center; gap: 8px 10px; flex-wrap: wrap; }
.bar-in + .bar-in { margin-top: 8px; }
.brand { display: flex; align-items: baseline; gap: 10px; margin-right: auto; min-width: 0; }
.brand b { font-family: var(--font-label); font-weight: 700; font-size: 20px; }
.brand span { font-family: var(--font-label); font-size: 13px; color: var(--muted); letter-spacing: .04em; text-transform: uppercase; }
.pill { display: inline-flex; align-items: center; gap: 6px; padding: 5px 11px; border-radius: 999px; font-size: 13px; border: 1px solid var(--line); background: var(--surface-2); cursor: pointer; white-space: nowrap; font-family: var(--font-data); }
.pill.cfm.ok { background: var(--ok-soft); border-color: var(--ok); color: var(--ok); }
.pill.cfm.no { background: var(--warn-soft); border-color: var(--warn); color: var(--warn); }
.btn { border: 1px solid var(--line-strong); background: var(--surface); border-radius: 8px; padding: 8px 14px; cursor: pointer; font-weight: 700; }
.btn:hover { background: var(--surface-2); }
.btn.primary { background: var(--accent); color: var(--accent-ink); border-color: var(--accent); }
.btn.small { padding: 5px 10px; font-size: 13.5px; font-weight: 600; }
.btn.danger { color: var(--warn); border-color: var(--warn); }
.seg { display: inline-flex; border: 1px solid var(--line-strong); border-radius: 8px; overflow: hidden; flex-wrap: wrap; }
.seg button { border: 0; border-right: 1px solid var(--line); background: var(--surface); padding: 7px 11px; font-weight: 600; font-size: 14px; cursor: pointer; }
.seg button:last-child { border-right: 0; }
.seg button[aria-pressed="true"] { background: var(--accent); color: var(--accent-ink); }
.seg.pages button { font-family: var(--font-label); font-size: 15px; letter-spacing: .02em; }
.seg.hours span { display: inline-flex; align-items: center; padding: 0 10px; font-size: 13.5px; font-weight: 600; font-family: var(--font-data); border-right: 1px solid var(--line); background: var(--surface-2); white-space: nowrap; }
.seg.hours button:disabled { color: var(--line-strong); cursor: default; }
.zoom { margin-left: auto; }
.hintbar { max-width: 1180px; margin: 6px auto 0; font-size: 13.5px; color: var(--muted); }
@media (max-width: 700px) { .bar { position: static; } .hintbar, .brand span { display: none; } .seg button { padding: 6px 8px; font-size: 13px; } }

.page { padding-left: max(16px, env(safe-area-inset-left, 0px)); padding-right: max(16px, env(safe-area-inset-right, 0px)); padding-top: 16px; padding-bottom: 40px; }
.notice { max-width: 1000px; margin: 0 auto 14px; display: flex; gap: 12px; align-items: center; flex-wrap: wrap; background: var(--accent-soft); border: 1px solid var(--line); border-radius: 10px; padding: 10px 14px; font-size: 14px; }
.notice p { margin: 0; flex: 1 1 260px; min-width: 0; }
.stage { overflow-x: auto; padding-bottom: 6px; }
.paper { position: relative; margin: 0 auto; background: var(--sheet); box-shadow: var(--paper-shadow); border-radius: 2px; }
.paper svg { display: block; width: 100%; height: auto; font-family: Helvetica, Arial, sans-serif; user-select: none; -webkit-user-select: none; }
.gBase, .gData { pointer-events: none; }
.hit { fill: transparent; cursor: pointer; }
.hit:hover { fill: rgba(29, 106, 100, .08); }
.hit.chart { cursor: crosshair; }
.hit.chart:hover { fill: transparent; }
.hit.row:hover { fill: rgba(29, 106, 100, .05); }
.hit.txt:hover { fill: rgba(29, 106, 100, .10); }
.m-line .hit.row, .m-text svg, .m-text .hit { cursor: crosshair; }
.m-pen svg { cursor: crosshair; touch-action: none; }
.m-pen .gHits, .m-pen .gTxt { pointer-events: none; }
.readout { position: absolute; transform: translate(-50%, -135%); background: var(--ink); color: var(--surface); font-family: var(--font-data); font-size: 13px; padding: 3px 8px; border-radius: 6px; pointer-events: none; white-space: nowrap; z-index: 3; }
.sel { position: absolute; border: 1.5px dashed #1D6A64; background: rgba(29, 106, 100, .06); z-index: 4; touch-action: none; cursor: move; }
.sel i { position: absolute; width: 22px; height: 22px; display: grid; place-items: center; touch-action: none; }
.sel i::after { content: ""; width: 11px; height: 11px; background: #FFFFFF; border: 2px solid #1D6A64; border-radius: 3px; }
.sel .nw { left: -12px; top: -12px; cursor: nwse-resize; } .sel .ne { right: -12px; top: -12px; cursor: nesw-resize; }
.sel .sw { left: -12px; bottom: -12px; cursor: nesw-resize; } .sel .se { right: -12px; bottom: -12px; cursor: nwse-resize; }

.about { max-width: 1000px; margin: 18px auto 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 12px; }
.about div { background: var(--surface); border: 1px solid var(--line); border-radius: 10px; padding: 12px 14px; font-size: 14px; min-width: 0; }
.about b { display: block; font-family: var(--font-label); font-size: 15px; letter-spacing: .03em; text-transform: uppercase; margin-bottom: 4px; }
.about p { margin: 0; color: var(--muted); }

.editor { position: fixed; left: 0; right: 0; bottom: 0; z-index: 15; background: var(--surface); border-top: 1px solid var(--line-strong); box-shadow: 0 -10px 30px rgba(0,0,0,.14);
  padding: 12px max(16px, env(safe-area-inset-right, 0px)) calc(14px + env(safe-area-inset-bottom, 0px)) max(16px, env(safe-area-inset-left, 0px)); max-height: 60vh; overflow-y: auto; }
.ed-in { max-width: 780px; margin: 0 auto; display: grid; gap: 10px; }
.ed-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.ed-k { display: block; font-family: var(--font-label); font-weight: 700; font-size: 18px; }
.ed-sub { display: block; font-size: 13px; color: var(--muted); }
.ed-grid { display: grid; gap: 10px; grid-template-columns: minmax(0, 1fr); align-items: start; }
@media (min-width: 720px) { .ed-grid.kpm { grid-template-columns: minmax(0, 1fr) 300px; } }
.ed-col { display: grid; gap: 8px; min-width: 0; align-content: start; }
.ed-input { width: 100%; font-size: 17px; padding: 9px 12px; border: 1.5px solid var(--line-strong); border-radius: 8px; background: var(--surface-2); }
textarea.ed-input { resize: vertical; min-height: 70px; }
.ed-note { font-size: 13px; color: var(--muted); margin: 0; }
.ed-cap { font-family: var(--font-label); font-size: 12.5px; font-weight: 600; letter-spacing: .05em; text-transform: uppercase; color: var(--muted); }
.ed-actions { display: flex; gap: 8px; flex-wrap: wrap; }
.chips { display: flex; flex-wrap: wrap; gap: 6px; }
.chip { border: 1.5px solid var(--line-strong); background: var(--surface); border-radius: 999px; padding: 6px 12px; cursor: pointer; font-size: 14.5px; line-height: 1.2; }
.chip[aria-pressed="true"] { background: var(--accent); border-color: var(--accent); color: var(--accent-ink); font-weight: 700; }
.chip.prev { border-style: dashed; }
.chip.nav { font-family: var(--font-data); font-size: 13px; }
.kp-disp { display: flex; align-items: baseline; gap: 8px; padding: 6px 12px; border-radius: 8px; background: var(--surface-2); border: 1px solid var(--line); min-height: 48px; }
.kp-v { font-family: var(--font-data); font-size: 26px; }
.kp-u { color: var(--muted); font-size: 14px; }
.kp { display: grid; grid-template-columns: repeat(4, 1fr); gap: 6px; }
.kp button { height: 46px; font-size: 19px; border-radius: 8px; border: 1px solid var(--line-strong); background: var(--surface); font-family: var(--font-data); cursor: pointer; }
.kp button:hover { background: var(--surface-2); }
.kp .w2 { grid-column: span 2; }
.kp .txt { font-family: var(--font-body); font-size: 14px; font-weight: 600; }
.kp .ok { background: var(--accent); color: var(--accent-ink); border-color: var(--accent); font-family: var(--font-body); font-weight: 700; font-size: 16px; }
.kp .off { visibility: hidden; }
.evs { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 8px; }
.evs button { text-align: left; border: 1.5px solid var(--line-strong); background: var(--surface); border-radius: 10px; padding: 9px 12px; cursor: pointer; }
.evs button[aria-pressed="true"] { border-color: var(--accent); background: var(--accent-soft); }
.evs b { font-family: var(--font-data); color: var(--accent); margin-right: 6px; }
.evs small { display: block; color: var(--muted); font-family: var(--font-data); }
.sigpad { width: 100%; height: 150px; aspect-ratio: 3.2 / 1; border: 1.5px dashed var(--line-strong); border-radius: 8px; background: var(--sheet); touch-action: none; display: block; cursor: crosshair; }

.overlay { position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: 20; background: rgba(8, 14, 13, .45); display: grid; place-items: center;
  padding: max(16px, env(safe-area-inset-top, 0px)) max(16px, env(safe-area-inset-right, 0px)) max(16px, env(safe-area-inset-bottom, 0px)) max(16px, env(safe-area-inset-left, 0px)); }
.dialog { background: var(--surface); border: 1px solid var(--line); border-radius: 12px; box-shadow: var(--shadow); width: min(540px, 100%); max-height: 85vh; overflow: auto; padding: 18px 20px; display: grid; gap: 12px; }
.dialog h3 { margin: 0; font-family: var(--font-label); font-size: 19px; font-weight: 700; }
.dialog h4 { margin: 4px 0 0; font-family: var(--font-label); font-size: 14px; letter-spacing: .05em; text-transform: uppercase; color: var(--muted); }
.dialog p { margin: 0; }
.dialog .actions { display: flex; gap: 8px; justify-content: flex-end; flex-wrap: wrap; }
.checks { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; font-size: 14px; }
.checks li { display: grid; grid-template-columns: 18px 1fr; gap: 8px; }
.checks .ic { width: 16px; height: 16px; border-radius: 50%; margin-top: 2px; display: grid; place-items: center; font-size: 11px; font-weight: 700; font-family: var(--font-data); }
.checks li.ok .ic { background: var(--ok-soft); color: var(--ok); border: 1px solid var(--ok); }
.checks li.no .ic { background: var(--warn-soft); color: var(--warn); border: 1px solid var(--warn); }
.checks small { display: block; color: var(--warn); font-size: 12.5px; }
.result { display: grid; gap: 4px; background: var(--ok-soft); border: 1px solid var(--ok); border-radius: 8px; padding: 10px 12px; font-size: 14px; font-family: var(--font-data); }
.fine { font-size: 12.5px; color: var(--muted); }
.toast { position: fixed; left: 50%; transform: translateX(-50%); bottom: calc(20px + env(safe-area-inset-bottom, 0px)); z-index: 30; background: var(--ink); color: var(--surface); padding: 10px 16px; border-radius: 8px; font-size: 14px; box-shadow: var(--shadow); max-width: calc(100% - 32px); }

/* ---------- site: páginas, formulários, rodapé ---------- */
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; }
a { color: var(--accent); }
a.brand { text-decoration: none; color: inherit; }
.btn[disabled], .seg button[disabled] { opacity: .55; cursor: default; }
a.btn { display: inline-flex; align-items: center; gap: 6px; text-decoration: none; color: inherit; }
.acct { font-family: var(--font-data); font-size: 12px; color: var(--muted); max-width: 180px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
@media (max-width: 900px) { .acct { display: none; } }
.pill.low { background: var(--warn-soft); border-color: var(--warn); color: var(--warn); }
.warnbox { background: var(--warn-soft); border: 1px solid var(--warn); border-radius: 8px; padding: 10px 12px; font-size: 14px; }
.dialog label.check, label.check { display: grid; grid-template-columns: 22px 1fr; gap: 8px; align-items: start; font-size: 14.5px; margin: 8px 0; }
label.check input { width: 18px; height: 18px; margin: 2px 0 0; accent-color: var(--accent); }

.site-header { background: var(--surface); border-bottom: 1px solid var(--line); padding-left: max(16px, env(safe-area-inset-left, 0px)); padding-right: max(16px, env(safe-area-inset-right, 0px)); padding-top: 12px; padding-bottom: 12px; }
.site-header .in { max-width: 1040px; margin: 0 auto; display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.site-header .brand { margin-right: auto; }
.wrap { max-width: 1040px; margin: 0 auto; padding-left: max(16px, env(safe-area-inset-left, 0px)); padding-right: max(16px, env(safe-area-inset-right, 0px)); padding-top: 28px; padding-bottom: 48px; }
.narrow { max-width: 520px; }
.card { background: var(--surface); border: 1px solid var(--line); border-radius: 12px; padding: 20px; box-shadow: var(--shadow); }
.card + .card { margin-top: 16px; }
h1, h2, h3 { font-family: var(--font-label); line-height: 1.15; text-wrap: balance; }
h1 { font-size: clamp(30px, 5vw, 46px); margin: 0 0 12px; }
h2 { font-size: 24px; margin: 0 0 10px; }
.lead { font-size: 18px; color: var(--muted); max-width: 62ch; }
form .field { display: grid; gap: 4px; margin-bottom: 12px; }
form .field label { font-family: var(--font-label); font-size: 13px; font-weight: 600; letter-spacing: .05em; text-transform: uppercase; color: var(--muted); }
input[type=email], input[type=password], input[type=text], .field select { width: 100%; font-size: 17px; padding: 10px 12px; border: 1.5px solid var(--line-strong); border-radius: 8px; background: var(--surface-2); color: var(--ink); }
input:focus { outline: 2px solid var(--accent); outline-offset: 1px; }
.row2 { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
@media (max-width: 520px) { .row2 { grid-template-columns: 1fr; } }
.tabs { display: flex; gap: 4px; border-bottom: 1px solid var(--line); margin-bottom: 16px; flex-wrap: wrap; }
.tabs button { border: 0; background: none; padding: 10px 12px; font-weight: 700; cursor: pointer; color: var(--muted); border-bottom: 3px solid transparent; }
.tabs button[aria-selected="true"] { color: var(--ink); border-bottom-color: var(--accent); }
.msg { border-radius: 8px; padding: 10px 12px; margin: 0 0 12px; background: var(--surface-2); border: 1px solid var(--line); font-size: 14.5px; }
.msg.err { background: var(--warn-soft); border-color: var(--warn); color: var(--ink); }
.msg.ok { background: var(--ok-soft); border-color: var(--ok); }
.hero { display: grid; gap: 18px; padding-top: 18px; padding-bottom: 8px; }
.cta { display: flex; gap: 10px; flex-wrap: wrap; }
.btn.big { padding: 12px 20px; font-size: 17px; }
.grid3 { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 14px; margin-top: 24px; }
.grid3 .card h3 { margin: 0 0 6px; font-size: 18px; }
.grid3 .card p { margin: 0; color: var(--muted); }
.grid3 > .card { margin-top: 0; }
.grid3 + .card { margin-top: 24px; }
.packs { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 12px; }
.pack { display: grid; gap: 6px; border: 1px solid var(--line); border-radius: 10px; padding: 14px; background: var(--surface-2); }
.pack .price { font-family: var(--font-data); font-size: 22px; }
.kv { display: grid; grid-template-columns: max-content 1fr; gap: 6px 16px; margin: 0; }
.kv dt { color: var(--muted); }
.kv dd { margin: 0; font-weight: 700; overflow-wrap: anywhere; }
.big-num { font-family: var(--font-data); font-size: 34px; }
.tablewrap { overflow-x: auto; }
table.list { width: 100%; border-collapse: collapse; font-size: 14.5px; }
table.list th, table.list td { text-align: left; padding: 8px 6px; border-bottom: 1px solid var(--line); }
table.list .num { text-align: right; font-family: var(--font-data); }
table.list .neg { color: var(--warn); }
table.list .pos { color: var(--ok); }
.status.ok { border-color: var(--ok); }
.status.err { border-color: var(--warn); }
.legal { max-width: 760px; }
.legal h2 { margin-top: 28px; font-size: 21px; }
.legal p, .legal li { line-height: 1.6; }
#siteFooter { border-top: 1px solid var(--line); background: var(--surface); }
#siteFooter .foot-in { max-width: 1040px; margin: 0 auto; padding: 18px max(16px, env(safe-area-inset-right, 0px)) 28px max(16px, env(safe-area-inset-left, 0px)); font-size: 14px; color: var(--muted); }
#siteFooter p { margin: 6px 0; }
.toast[hidden] { display: none !important; }
#captcha:empty { display: none; }
#captcha { margin: 6px 0 12px; }

/* ---------- a ficha da tela é rascunho: marca d'água e sem impressão pelo navegador ---------- */
.paper::after { content: ""; position: absolute; top: 0; right: 0; bottom: 0; left: 0; pointer-events: none; z-index: 2;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='340' height='210'%3E%3Ctext x='170' y='112' text-anchor='middle' transform='rotate(-28 170 105)' font-family='Helvetica,Arial,sans-serif' font-size='18' font-weight='700' letter-spacing='1' fill='rgb(179,38,30)' fill-opacity='0.16'%3ERASCUNHO %C2%B7 SEM VALIDADE%3C/text%3E%3C/svg%3E");
  background-size: 340px 210px; }
@media print {
  body.app > * { display: none !important; }
  body.app::before { content: "A ficha na tela é um rascunho e não é um documento. Para imprimir, use o botão Gerar PDF: o PDF sai com o número do documento e o código de conferência."; display: block; padding: 30mm 20mm; font: 16pt/1.5 Helvetica, Arial, sans-serif; color: #000; }
}
.modelos { max-width: 920px; margin: 0 auto 10px; display: flex; gap: 10px; align-items: center; flex-wrap: wrap; font-size: 14px; color: var(--muted); }
.mono { font-family: var(--font-data); overflow-wrap: anywhere; }
.paper.pen svg { cursor: crosshair; touch-action: none; }
.paper.pen .gHits { pointer-events: none; }
.kp .w3 { grid-column: span 3; }
.kp button:disabled { visibility: hidden; }

/* ---------- toque (celular e tablet, Android e iOS) ---------- */
html { -webkit-tap-highlight-color: transparent; }
button, .btn, .pill, .chip, a.btn, .seg button, .kp button, .evs button { touch-action: manipulation; }
.paper svg { touch-action: manipulation; }   /* sem zoom de toque duplo sobre a folha; o gesto de pinça continua */
@supports (aspect-ratio: 1) { .sigpad { height: auto; } }
@media (pointer: coarse) { .btn.small, .pill { min-height: 36px; } }
/* celular deitado: a barra de cima não fica presa, para sobrar altura para a folha */
@media (max-height: 520px) { .bar { position: static; } .hintbar { display: none; } }