/* ==========================================================================
   Ferramentas Digitais: folha de estilos única
   --------------------------------------------------------------------------
   Seções:
     1. PORTAL        (index.html, 404.html)          -> escopo html.page-portal
     2. FERRAMENTAS   (base das páginas em /ferramentas) -> escopo html.page-tool
     3. CONVERSOR PDF (específico do conversor-pdf)   -> escopo html.page-conversor-pdf

   O escopo é definido por uma classe no <html> de cada página. Ele impede que
   o reset/body/header/footer do portal e os das ferramentas colidam depois de
   unidos num único arquivo, mantendo o visual idêntico ao original.
   Ao criar uma ferramenta nova: use <html class="page-tool"> e, se precisar de
   estilos próprios, acrescente uma seção 4 escopada com sua própria classe.
   ========================================================================== */

/* ===== 1. PORTAL ===== */
/* Portal de Ferramentas: CSS puro equivalente ao layout original (Tailwind) */
html.page-portal {
  --navy-deep:#03265B;--navy:#08396F;--blue-mid:#0E5389;--blue:#2085BD;--sky:#66C4EA;--ice:#DFF1F9;
  --page:rgba(223,241,249,.4);--text:#03265B;--sub:#0E5389;
  --bar:rgba(255,255,255,.8);--bar-line:rgba(102,196,234,.3);
  --logo-bg:#fff;--accent-text:#2085BD;--tagline:rgba(14,83,137,.8);
  --tbtn-bg:#DFF1F9;--tbtn-text:#03265B;--tbtn-line:rgba(102,196,234,.4);
  --card:#fff;--card-line:rgba(102,196,234,.4);--card-shadow:0 1px 2px rgba(0,0,0,.05);
  --desc:rgba(14,83,137,.9);--badge-bg:#DFF1F9;--badge-text:#03265B;--badge-line:rgba(102,196,234,.5);
  --go-bg:#2085BD;--go-hover-bg:#0E5389;--go-hover-text:#fff;
  --soon-card:rgba(255,255,255,.5);--soon-line:rgba(102,196,234,.2);--soon-title:rgba(3,38,91,.8);
  --soon-badge-bg:rgba(223,241,249,.8);--soon-badge-text:#0E5389;--soon-desc:rgba(14,83,137,.7);
  --soon-btn-bg:#DFF1F9;--soon-btn-text:rgba(14,83,137,.6);
  --foot-bg:rgba(255,255,255,.5);--foot-text:#0E5389;--foot-hover:#2085BD;
}
html.page-portal.dark {
  --page:#03265B;--text:#fff;--sub:rgba(223,241,249,.8);
  --bar:rgba(8,57,111,.6);--bar-line:rgba(14,83,137,.4);
  --logo-bg:rgba(223,241,249,.9);--accent-text:#66C4EA;--tagline:rgba(223,241,249,.7);
  --tbtn-bg:#03265B;--tbtn-text:#66C4EA;--tbtn-line:#0E5389;
  --card:#08396F;--card-line:rgba(14,83,137,.5);--card-shadow:none;
  --desc:rgba(223,241,249,.8);--badge-bg:rgba(102,196,234,.15);--badge-text:#66C4EA;--badge-line:rgba(102,196,234,.5);
  --go-hover-bg:#66C4EA;--go-hover-text:#03265B;
  --soon-card:rgba(8,57,111,.4);--soon-line:rgba(14,83,137,.3);--soon-title:rgba(255,255,255,.8);
  --soon-badge-bg:#03265B;--soon-badge-text:rgba(102,196,234,.7);--soon-desc:rgba(223,241,249,.6);
  --soon-btn-bg:#03265B;--soon-btn-text:rgba(102,196,234,.4);
  --foot-bg:rgba(8,57,111,.3);--foot-text:rgba(223,241,249,.7);--foot-hover:#66C4EA;
}
html.page-portal, html.page-portal *, html.page-portal::before, html.page-portal *::before, html.page-portal::after, html.page-portal *::after {box-sizing:border-box;margin:0;border:0 solid}
html.page-portal {line-height:1.5;-webkit-text-size-adjust:100%}
html.page-portal body {min-height:100vh;display:flex;flex-direction:column;background:var(--page);color:var(--text);
  font-family:ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;transition:background-color .2s,color .2s}
html.page-portal a {color:inherit;text-decoration:none}
html.page-portal img, html.page-portal svg {display:block}
html.page-portal button {font:inherit;color:inherit;background:none;cursor:pointer}
html.page-portal :focus-visible {outline:2px solid var(--sky);outline-offset:2px}
html.page-portal .container {max-width:64rem;margin:0 auto;padding-inline:1rem;width:100%}

html.page-portal .topbar {border-bottom-width:1px;border-color:var(--bar-line);background:var(--bar);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);padding-block:1rem;transition:background-color .2s,border-color .2s}
html.page-portal .topbar .container {display:flex;justify-content:space-between;align-items:center}
html.page-portal .brand {display:flex;align-items:center;gap:.75rem}
html.page-portal .brand-logo {width:2.75rem;height:2.75rem;flex:none;border-radius:50%;background:var(--logo-bg);padding:2px;display:flex;align-items:center;justify-content:center;
  border:1px solid rgba(102,196,234,.3);box-shadow:0 1px 2px rgba(0,0,0,.05);transition:transform .15s}
html.page-portal .brand:hover .brand-logo {transform:scale(1.05)}
html.page-portal .brand-logo img {width:100%;height:100%;object-fit:contain}
html.page-portal .brand h1 {font-size:1.25rem;line-height:1.25;font-weight:700;letter-spacing:-.025em}
html.page-portal .brand h1 span {color:var(--accent-text)}
html.page-portal .tagline {display:none;font-size:.75rem;line-height:1rem;color:var(--tagline)}
@media (min-width:640px) {html.page-portal .tagline {display:block}}

html.page-portal .theme-btn {padding:.5rem;border-radius:.5rem;border-width:1px;border-color:var(--tbtn-line);background:var(--tbtn-bg);color:var(--tbtn-text);transition:border-color .15s}
html.page-portal .theme-btn:hover {border-color:var(--blue)}
html.page-portal .theme-btn svg {width:1.25rem;height:1.25rem}
html.page-portal .icon-sun {display:none}
html.page-portal.dark .icon-sun {display:block}
html.page-portal.dark .icon-moon {display:none}

html.page-portal main.container {padding-block:2rem;flex:1}
html.page-portal .intro {margin-bottom:2rem}
html.page-portal .intro h2 {font-size:1.5rem;line-height:2rem;font-weight:700;letter-spacing:-.025em}
html.page-portal .intro p {font-size:.875rem;line-height:1.25rem;margin-top:.25rem;color:var(--sub)}

html.page-portal .grid {display:grid;grid-template-columns:1fr;gap:1.5rem}
@media (min-width:768px) {html.page-portal .grid {grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:1024px) {html.page-portal .grid {grid-template-columns:repeat(3,minmax(0,1fr))}}

html.page-portal .tool {display:flex;flex-direction:column;justify-content:space-between;padding:1.25rem;border-radius:.75rem;border-width:1px}
html.page-portal .tool-head {display:flex;justify-content:space-between;align-items:flex-start;gap:.5rem;margin-bottom:.75rem}
html.page-portal .tool h3 {font-size:1.125rem;line-height:1.75rem;font-weight:600}
html.page-portal .badge {font-size:.75rem;line-height:1rem;padding:.125rem .625rem;border-radius:999px;font-weight:500}
html.page-portal .tool p {font-size:.875rem;line-height:1.625;margin-bottom:1.5rem}
html.page-portal .tool-btn {display:flex;align-items:center;justify-content:center;gap:.5rem;width:100%;text-align:center;font-size:.875rem;line-height:1.25rem;padding-block:.625rem;border-radius:.5rem}

html.page-portal .tool.active {background:var(--card);border-color:var(--card-line);box-shadow:var(--card-shadow);transition:all .2s}
html.page-portal .tool.active:hover {border-color:var(--sky);transform:translateY(-2px)}
html.page-portal .tool.active h3 {color:var(--text)}
html.page-portal .tool.active .badge {background:var(--badge-bg);color:var(--badge-text);border:1px solid var(--badge-line)}
html.page-portal .tool.active p {color:var(--desc)}
html.page-portal .tool.active .tool-btn {background:var(--go-bg);color:#fff;font-weight:600;box-shadow:0 1px 2px rgba(0,0,0,.05);transition:background-color .15s,color .15s}
html.page-portal .tool.active .tool-btn:hover {background:var(--go-hover-bg);color:var(--go-hover-text)}

html.page-portal .tool.soon {background:var(--soon-card);border-color:var(--soon-line);opacity:.6}
html.page-portal .tool.soon h3 {color:var(--soon-title)}
html.page-portal .tool.soon .badge {background:var(--soon-badge-bg);color:var(--soon-badge-text)}
html.page-portal .tool.soon p {color:var(--soon-desc)}
html.page-portal .tool.soon .tool-btn {background:var(--soon-btn-bg);color:var(--soon-btn-text);font-weight:500;cursor:not-allowed;border:1px solid transparent}

html.page-portal .foot {border-top-width:1px;border-color:var(--bar-line);background:var(--foot-bg);padding-block:1.5rem;font-size:.875rem;line-height:1.25rem;color:var(--foot-text);transition:background-color .2s,color .2s}
html.page-portal .foot .container {display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:1rem}
html.page-portal .foot nav {display:flex;gap:1rem}
html.page-portal .foot nav a {transition:color .15s}
html.page-portal .foot nav a:hover {color:var(--foot-hover)}
@media (prefers-reduced-motion:reduce) {html.page-portal, html.page-portal *, html.page-portal::before, html.page-portal *::before, html.page-portal::after, html.page-portal *::after {transition:none!important}}

/* ===== 2. FERRAMENTAS (base) ===== */
html.page-tool {
  --navy-900:#03265B;--navy-800:#08396F;--navy-600:#0E5389;--blue:#2085BD;--sky:#66C4EA;--ice:#DFF1F9;--white:#FFFFFF;
  --bg:#FFFFFF;--panel:#FFFFFF;--panel-soft:#F3FAFD;--chip:#DFF1F9;--ink:#03265B;--mute:#46607F;--line:#C6E2EF;--line-strong:#9FCFE4;
  --acc:#2085BD;--acc-hover:#0E5389;--acc-ink:#FFFFFF;--stat:#2085BD;--warn:#B4541F;--grid:#DFF1F9;
  --shadow:0 1px 2px rgba(3,38,91,.05),0 4px 16px rgba(3,38,91,.05);
  --field:#FFFFFF;--toast-bg:#03265B;--toast-ink:#DFF1F9;
  box-sizing:border-box;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px);color-scheme:light
}
@media (prefers-color-scheme:dark) {html.page-tool:not([data-theme="light"]) {
  --bg:#03265B;--panel:#08396F;--panel-soft:#0A3F7A;--chip:#0B4580;--ink:#DFF1F9;--mute:#A9CBE2;--line:#1A5690;--line-strong:#2A6CA6;
  --acc:#66C4EA;--acc-hover:#8DD4F0;--acc-ink:#03265B;--stat:#66C4EA;--warn:#F2A06F;--grid:#0A3268;
  --shadow:0 1px 2px rgba(0,0,0,.2),0 6px 20px rgba(0,0,0,.2);--field:#062F63;--toast-bg:#DFF1F9;--toast-ink:#03265B;color-scheme:dark}}
html.page-tool[data-theme="dark"] {
  --bg:#03265B;--panel:#08396F;--panel-soft:#0A3F7A;--chip:#0B4580;--ink:#DFF1F9;--mute:#A9CBE2;--line:#1A5690;--line-strong:#2A6CA6;
  --acc:#66C4EA;--acc-hover:#8DD4F0;--acc-ink:#03265B;--stat:#66C4EA;--warn:#F2A06F;--grid:#0A3268;
  --shadow:0 1px 2px rgba(0,0,0,.2),0 6px 20px rgba(0,0,0,.2);--field:#062F63;--toast-bg:#DFF1F9;--toast-ink:#03265B;color-scheme:dark}
html.page-tool {scroll-padding-top:env(safe-area-inset-top,0px)}
html.page-tool, html.page-tool *, html.page-tool::before, html.page-tool *::before, html.page-tool::after, html.page-tool *::after {box-sizing:border-box}
html.page-tool body {margin:0;min-height:100vh;background-color:var(--bg);background-image:linear-gradient(var(--grid) 1px,transparent 1px),linear-gradient(90deg,var(--grid) 1px,transparent 1px);background-size:28px 28px;color:var(--ink);font:400 15px/1.55 "Inter",system-ui,sans-serif;position:relative;overflow-x:hidden}
html.page-tool body::before {content:"";position:fixed;top:-160px;right:-200px;width:720px;height:720px;background:url(../assets/logo.png) center/contain no-repeat;opacity:.05;pointer-events:none;z-index:0}
html.page-tool .wrap {position:relative;z-index:1;max-width:1240px;margin:0 auto;padding:32px 20px 40px;animation:enter .5s ease-out both}
@keyframes enter{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce) {html.page-tool .wrap {animation:none}}

html.page-tool header {display:flex;justify-content:space-between;align-items:center;gap:16px 24px;flex-wrap:wrap;margin-bottom:24px}
html.page-tool .brand {display:flex;align-items:center;gap:16px;min-width:0}
html.page-tool .brand img {height:48px;width:48px;flex:none;background:#fff;border-radius:12px;padding:3px;border:1px solid var(--line)}
html.page-tool h1 {font:800 clamp(24px,4.2vw,40px)/1.08 "Sora",system-ui,sans-serif;margin:0;letter-spacing:-.025em;color:var(--ink);text-wrap:balance}
html.page-tool header p {margin:6px 0 0;color:var(--mute);max-width:65ch;text-wrap:pretty}

html.page-tool button, html.page-tool select, html.page-tool input, html.page-tool textarea {font:inherit;color:inherit}
html.page-tool .btn {display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:38px;background:var(--panel);border:1px solid var(--line-strong);border-radius:8px;padding:7px 14px;cursor:pointer;font-weight:500;color:var(--ink);transition:background-color .15s,border-color .15s,color .15s}
html.page-tool .btn:hover {border-color:var(--acc);background:var(--panel-soft)}
html.page-tool .btn:active {background:var(--chip)}
html.page-tool .btn:disabled {opacity:.5;cursor:not-allowed}
html.page-tool .btn.main {background:var(--acc);color:var(--acc-ink);border-color:var(--acc);font-weight:700;padding-inline:20px;box-shadow:0 2px 8px rgba(32,133,189,.3)}
html.page-tool .btn.main:hover {background:var(--acc-hover);border-color:var(--acc-hover)}
html.page-tool .btn.main:active {transform:translateY(1px)}
html.page-tool .btn svg {width:16px;height:16px;flex:none}
html.page-tool :focus-visible {outline:2px solid var(--sky);outline-offset:2px}

html.page-tool .card {background:var(--panel);border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow)}

html.page-tool .opts {display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;margin-bottom:18px;overflow:hidden}
@media (max-width:1080px) {html.page-tool .opts {grid-template-columns:repeat(2,minmax(0,1fr))}}
html.page-tool .grp {min-width:0;border-right:1px solid var(--line);border-bottom:1px solid var(--line)}
html.page-tool .grp>summary {list-style:none;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:16px 18px 6px;font:700 15px/1.3 "Sora",sans-serif;color:var(--ink);cursor:default}
html.page-tool .grp>summary::-webkit-details-marker {display:none}
html.page-tool .grp>summary .num {display:inline-grid;place-items:center;width:24px;height:24px;border-radius:6px;background:var(--chip);color:var(--acc);font:600 12px "JetBrains Mono",monospace;margin-right:8px}
html.page-tool .grp>summary .ttl {display:flex;align-items:center}
html.page-tool .grp>summary .chev {display:none;flex:none;width:20px;height:20px;stroke-linecap:round;stroke-linejoin:round;color:var(--mute);transition:transform .2s}
html.page-tool fieldset {border:0;margin:0;padding:6px 18px 18px;min-width:0}
html.page-tool legend {position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
@media (min-width:1081px) {html.page-tool .grp:nth-child(4n) {border-right:0}html.page-tool .grp {border-bottom:0}}
@media (max-width:1080px) and (min-width:761px) {html.page-tool .grp:nth-child(2n) {border-right:0}html.page-tool .grp:nth-child(n+3) {border-bottom:0}}
@media (max-width:760px) {
  html.page-tool .opts {grid-template-columns:1fr}
  html.page-tool .grp {border-right:0}
  html.page-tool .grp:last-child {border-bottom:0}
  html.page-tool .grp>summary {cursor:pointer;padding:14px 16px;min-height:52px}
  html.page-tool .grp>summary:hover {background:var(--panel-soft)}
  html.page-tool .grp>summary .chev {display:block}
  html.page-tool .grp[open]>summary .chev {transform:rotate(180deg)}
  html.page-tool fieldset {padding:4px 16px 16px}
}
@media (prefers-reduced-motion:reduce) {html.page-tool .grp>summary .chev {transition:none}}

html.page-tool .chk {display:flex;gap:10px;align-items:center;padding:5px 0;cursor:pointer;color:var(--ink);min-height:32px}
html.page-tool .chk input {accent-color:var(--acc);width:18px;height:18px;margin:0;flex:none;cursor:pointer}
html.page-tool label.f {display:block;margin-bottom:10px;color:var(--mute);font-size:13px;font-weight:500}
html.page-tool label.f select, html.page-tool label.f input {display:block;width:100%;margin-top:4px;background:var(--field);border:1px solid var(--line-strong);border-radius:8px;padding:8px 10px;min-height:40px;color:var(--ink);font-size:14px;font-weight:400;transition:border-color .15s}
html.page-tool label.f select:hover, html.page-tool label.f input:hover {border-color:var(--sky)}
html.page-tool label.f select:focus-visible, html.page-tool label.f input:focus-visible {border-color:var(--acc)}
html.page-tool label.f input::placeholder {color:var(--mute);opacity:.8}

html.page-tool .presets {display:flex;gap:8px;flex-wrap:wrap;margin-bottom:18px;align-items:center}
html.page-tool .presets span {color:var(--mute);font-size:13px;font-weight:500;margin-right:4px}
html.page-tool .presets .btn {border-radius:999px;background:var(--chip);border-color:transparent;font-size:14px;padding:6px 16px;color:var(--ink)}
html.page-tool .presets .btn:hover {border-color:var(--sky);background:var(--chip)}
html.page-tool .presets .btn:active {background:var(--sky);color:var(--navy-900)}

html.page-tool .panes {display:grid;grid-template-columns:1fr 1fr;gap:18px}
@media (max-width:760px) {html.page-tool .panes {grid-template-columns:1fr}}
html.page-tool .pane {display:flex;flex-direction:column;min-width:0;overflow:hidden}
html.page-tool .pane.result {border-top:3px solid var(--acc)}
html.page-tool .ph {display:flex;justify-content:space-between;align-items:center;gap:10px;padding:12px 14px;border-bottom:1px solid var(--line);flex-wrap:wrap;background:var(--panel-soft)}
html.page-tool .ph b {font:700 16px "Sora",sans-serif;display:flex;align-items:center;gap:8px}
html.page-tool .ph b svg {width:18px;height:18px;color:var(--acc)}
html.page-tool .ph div {display:flex;gap:6px;flex-wrap:wrap}
html.page-tool .ph .btn {padding:5px 11px;font-size:13px;min-height:34px}
html.page-tool .ph .btn.main {font-size:14px;padding:6px 18px}
html.page-tool textarea {width:100%;min-height:360px;resize:vertical;border:0;background:var(--panel);padding:14px;font:400 13.5px/1.6 "JetBrains Mono",ui-monospace,monospace;white-space:pre;overflow:auto;color:var(--ink);display:block}
html.page-tool textarea::placeholder {color:var(--mute);opacity:.8}
html.page-tool textarea:focus-visible {outline-offset:-2px}
html.page-tool #out {background:var(--panel-soft)}

html.page-tool .stats {display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-top:18px}
@media (max-width:760px) {html.page-tool .stats {grid-template-columns:repeat(2,minmax(0,1fr))}}
html.page-tool .stat {padding:14px 16px;display:flex;flex-direction:column;gap:2px;position:relative;overflow:hidden}
html.page-tool .stat::after {content:"";position:absolute;right:-18px;top:-18px;width:64px;height:64px;border-radius:50%;border:1px dashed var(--line-strong);opacity:.8}
html.page-tool .stat b {display:block;font:800 clamp(26px,3.4vw,34px)/1.1 "Sora",sans-serif;color:var(--stat);font-variant-numeric:tabular-nums}
html.page-tool .stat small {color:var(--mute);font-size:13px;font-weight:500}
html.page-tool .stat.hl {background:var(--chip);border-color:var(--sky)}

html.page-tool footer {position:relative;z-index:1;text-align:center;color:var(--mute);font-size:13px;padding:8px 20px 32px;display:flex;justify-content:center;align-items:center;gap:8px}
html.page-tool footer svg {width:15px;height:15px;color:var(--acc)}

html.page-tool #toast {position:fixed;left:50%;bottom:calc(20px + env(safe-area-inset-bottom,0px));transform:translateX(-50%) translateY(20px);background:var(--toast-bg);color:var(--toast-ink);padding:10px 18px;border-radius:10px;opacity:0;pointer-events:none;transition:.2s;font-weight:500;box-shadow:0 8px 24px rgba(3,38,91,.25);border-left:3px solid var(--sky);z-index:10;max-width:calc(100vw - 32px)}
html.page-tool #toast.on {opacity:1;transform:translateX(-50%)}
@media (prefers-reduced-motion:reduce) {html.page-tool #toast {transition:none}}

@media (max-width:760px) {
  html.page-tool .wrap {padding:22px 14px 32px}
  html.page-tool .brand {gap:12px}
  html.page-tool .brand img {height:40px;width:40px;border-radius:10px}
  html.page-tool body::before {width:420px;height:420px;top:-100px;right:-160px}
  html.page-tool .btn, html.page-tool .ph .btn, html.page-tool .ph .btn.main, html.page-tool .presets .btn {min-height:44px}
  html.page-tool label.f select, html.page-tool label.f input {min-height:44px}
  html.page-tool .chk {min-height:44px}
  html.page-tool textarea {min-height:260px}
}

html.page-tool a.btn {text-decoration:none}
html.page-tool .hdr-actions {display:flex;gap:8px;flex-wrap:wrap}

/* ===== 3. CONVERSOR PDF ===== */
html.page-conversor-pdf #drop {
  border: 2px dashed var(--line, #c9ced4);
  background: var(--panel, #fff);
  border-radius: 8px;
  padding: 34px 16px;
  text-align: center;
  cursor: pointer;
  transition: border-color .15s, background .15s;
}
html.page-conversor-pdf #drop.over, html.page-conversor-pdf #drop:focus-visible {
  border-color: var(--acc, #1d4ed8);
  outline: none;
}
html.page-conversor-pdf #drop strong { display: block; font-size: 1.1rem; margin-bottom: 4px; }
html.page-conversor-pdf #drop span { color: var(--mut, #5b6570); font-size: .9rem; }

html.page-conversor-pdf ol#list { list-style: none; margin: 20px 0; padding: 0; display: flex; flex-direction: column; gap: 8px; }
html.page-conversor-pdf ol#list li {
  display: flex;
  align-items: center;
  gap: 10px;
  background: var(--panel, #fff);
  border: 1px solid var(--line, #c9ced4);
  border-radius: 6px;
  padding: 10px 14px;
}
html.page-conversor-pdf ol#list li .n { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 500; }
html.page-conversor-pdf ol#list li small { color: var(--mut, #5b6570); margin-left: 4px; }
html.page-conversor-pdf .st { font-size: .85rem; color: var(--mut, #5b6570); white-space: nowrap; font-weight: 600; }
html.page-conversor-pdf .st.ok { color: var(--ok, #15803d); }
html.page-conversor-pdf .st.err { color: var(--err, #b91c1c); }

html.page-conversor-pdf .bar { display: flex; flex-wrap: wrap; gap: 16px; align-items: center; justify-content: space-between; margin-top: 20px; padding: 16px 20px; }
html.page-conversor-pdf .modes { display: flex; gap: 16px; flex-wrap: wrap; }
html.page-conversor-pdf .modes label { display: flex; align-items: center; gap: 6px; cursor: pointer; font-size: .95rem; font-weight: 500; }
html.page-conversor-pdf .empty { color: var(--mut, #5b6570); text-align: center; margin: 24px 0; font-size: .95rem; }

/* área de renderização (fora da tela) para HTML → imagem → PDF */
html.page-conversor-pdf .sheet { position: absolute; left: -10000px; top: 0; width: 700px; background: #fff; color: #111; font: 14px/1.5 "Segoe UI", system-ui, sans-serif; }
html.page-conversor-pdf .sheet img { max-width: 100%; }
html.page-conversor-pdf .sheet pre { white-space: pre-wrap; word-break: break-word; font: 12px/1.45 Consolas, monospace; margin: 0; }
html.page-conversor-pdf .sheet table { border-collapse: collapse; width: 100%; font-size: 12px; }
html.page-conversor-pdf .sheet td, html.page-conversor-pdf .sheet th { border: 1px solid #999; padding: 3px 6px; text-align: left; vertical-align: top; word-break: break-word; }

html.page-conversor-pdf .bar-btns { display: flex; gap: 8px; }

/* ===== 4. CALCULADORA DE SALÁRIO LÍQUIDO ===== */
html.page-calc .calc {display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:18px;align-items:start}
html.page-calc .calc .result {position:sticky;top:16px}
@media (max-width:860px) {html.page-calc .calc {grid-template-columns:1fr}html.page-calc .calc .result {position:static}}
html.page-calc .pbody {padding:16px 18px 18px}
html.page-calc .row2 {display:grid;grid-template-columns:1fr 1fr;gap:12px}
@media (max-width:480px) {html.page-calc .row2 {grid-template-columns:1fr}}
html.page-calc .sub {margin:2px 0 14px 28px;padding:12px 14px 4px;background:var(--panel-soft);border:1px solid var(--line);border-radius:8px}
html.page-calc .sub[hidden] {display:none}
html.page-calc .note {color:var(--mute);font-size:13px;margin:0 0 10px}
html.page-calc .chips {display:flex;gap:6px;flex-wrap:wrap;align-items:center;margin-bottom:10px;font-size:13px;color:var(--mute);font-weight:500}
html.page-calc .chips .btn {border-radius:999px;background:var(--chip);border-color:transparent;padding:4px 14px;min-height:34px}
html.page-calc .chips .btn:hover {border-color:var(--sky)}
html.page-calc .big {font:800 clamp(34px,6vw,48px)/1.1 "Sora",sans-serif;color:var(--stat);font-variant-numeric:tabular-nums;margin:2px 0 14px}
html.page-calc .rows {margin-bottom:10px}
html.page-calc .r {display:flex;justify-content:space-between;gap:12px;padding:9px 0;border-bottom:1px dashed var(--line);font-variant-numeric:tabular-nums}
html.page-calc .r.neg b {color:var(--warn)}
html.page-calc .r.tot {border-bottom:0;border-top:2px solid var(--acc);margin-top:4px;font:700 17px "Sora",sans-serif}
html.page-calc article.txt {margin-top:18px}
html.page-calc .txt h2 {font:700 20px/1.3 "Sora",sans-serif;margin:24px 0 8px}
html.page-calc .txt h2:first-child {margin-top:0}
html.page-calc .txt h3 {font:600 16px/1.4 "Sora",sans-serif;margin:16px 0 4px}
html.page-calc .txt p {margin:0 0 10px;max-width:75ch}
html.page-calc .tblw {overflow-x:auto;margin:0 0 12px}
html.page-calc .tblw table {border-collapse:collapse;width:100%;max-width:520px;font-size:14px}
html.page-calc .tblw th, html.page-calc .tblw td {text-align:left;padding:8px 12px;border:1px solid var(--line)}
html.page-calc .tblw th {background:var(--panel-soft)}

/* ===== 5. PÁGINAS INSTITUCIONAIS E AJUSTES DE CABEÇALHO ===== */
html.page-portal .brand .site-name {font-size:1.25rem;line-height:1.25;font-weight:700;letter-spacing:-.025em}
html.page-portal .brand .site-name span {color:var(--accent-text)}
html.page-portal .intro h1 {font-size:1.5rem;line-height:2rem;font-weight:700;letter-spacing:-.025em}
html.page-portal .doc {max-width:48rem;background:var(--card);border:1px solid var(--card-line);border-radius:.75rem;padding:1.5rem;box-shadow:var(--card-shadow)}
html.page-portal .doc h2 {font-size:1.125rem;line-height:1.75rem;font-weight:600;margin:1.5rem 0 .5rem}
html.page-portal .doc h2:first-child {margin-top:0}
html.page-portal .doc p, html.page-portal .doc li {font-size:.9375rem;line-height:1.7;color:var(--desc)}
html.page-portal .doc p {margin-bottom:.75rem}
html.page-portal .doc ul {margin-bottom:.75rem;padding-left:1.25rem;list-style:disc}
html.page-portal .doc a {color:var(--accent-text);text-decoration:underline}
html.page-portal .doc .upd {font-size:.8125rem;margin:1.5rem 0 0;opacity:.8}
html.page-tool footer {flex-wrap:wrap}
html.page-tool .flinks {display:flex;gap:6px 16px;flex-wrap:wrap;justify-content:center;width:100%}
html.page-tool .flinks a {color:inherit;text-decoration:underline}

/* ===== 6. GUIAS E SEÇÕES DE APOIO ===== */
html.page-portal .crumb {font-size:.8125rem;margin-bottom:1rem;color:var(--sub)}
html.page-portal .crumb a {text-decoration:underline}
html.page-portal .doc .cta {background:var(--badge-bg);border:1px solid var(--badge-line);border-radius:.5rem;padding:1rem;margin:1.5rem 0}
html.page-portal .doc .cta p {margin-bottom:.5rem;color:var(--text)}
html.page-portal .doc a.btnlink {display:inline-block;padding:.5rem 1rem;background:var(--go-bg);color:#fff;border-radius:.5rem;font-weight:600;text-decoration:none}
html.page-portal .doc a.btnlink:hover {background:var(--go-hover-bg);color:var(--go-hover-text)}
html.page-portal .doc .tblw {overflow-x:auto;margin-bottom:.75rem}
html.page-portal .doc table {border-collapse:collapse;width:100%;font-size:.875rem}
html.page-portal .doc th, html.page-portal .doc td {text-align:left;padding:.5rem .75rem;border:1px solid var(--card-line);vertical-align:top}
html.page-portal .doc th {background:var(--badge-bg);color:var(--text)}
html.page-portal .doc td {color:var(--desc)}
html.page-portal .doc h2 + ul {margin-top:.25rem}
html.page-tool article.txt {margin-top:18px;padding:16px 18px 18px}
html.page-tool .txt h2 {font:700 20px/1.3 "Sora",sans-serif;margin:24px 0 8px}
html.page-tool .txt h2:first-child {margin-top:0}
html.page-tool .txt h3 {font:600 16px/1.4 "Sora",sans-serif;margin:16px 0 4px}
html.page-tool .txt p {margin:0 0 10px;max-width:75ch}
html.page-tool .txt code {font:13px "JetBrains Mono",monospace;background:var(--chip);padding:1px 5px;border-radius:4px}

/* ===== 7. CAPA DOS CARDS DE GUIA (imagem 1200x630) ===== */
html.page-portal .tool .cover {display:block;margin:-1.25rem -1.25rem 1rem;overflow:hidden;border-radius:.75rem .75rem 0 0;background:var(--badge-bg)}
html.page-portal .tool .cover img {width:100%;height:auto;aspect-ratio:1200/630;object-fit:cover;transition:transform .3s}
html.page-portal .tool:hover .cover img {transform:scale(1.03)}
@media (prefers-reduced-motion:reduce) {html.page-portal .tool .cover img {transition:none}}

/* ===== 8. GERADOR DE DADOS FICTÍCIOS ===== */
html.page-gen .gcard {padding:16px 18px 18px;margin-bottom:18px}
html.page-gen .gres {margin-bottom:18px}
html.page-gen .row3 {display:grid;grid-template-columns:160px 1fr;gap:12px;margin-bottom:6px}
@media (max-width:560px) {html.page-gen .row3 {grid-template-columns:1fr}}
html.page-gen fieldset {border:0;padding:0;margin:0 0 12px}
html.page-gen legend {font:600 13px "Inter",sans-serif;color:var(--mute);margin-bottom:6px;padding:0}
html.page-gen .fields {display:flex;flex-wrap:wrap;gap:6px 18px}
html.page-gen .acts {display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
html.page-gen .note {color:var(--mute);font-size:13px}
html.page-gen .gnote {margin:0 18px 14px}
html.page-gen .out {overflow:auto;max-height:480px;margin:0 18px 12px;border:1px solid var(--line);border-radius:8px;background:var(--panel-soft)}
html.page-gen .out table {border-collapse:collapse;width:100%;font-size:13px;white-space:nowrap}
html.page-gen .out th, html.page-gen .out td {text-align:left;padding:7px 10px;border-bottom:1px solid var(--line)}
html.page-gen .out th {position:sticky;top:0;background:var(--chip)}
html.page-gen pre.code {margin:0;padding:12px;font:13px "JetBrains Mono",monospace;white-space:pre}
html.page-gen .ph {display:flex;align-items:center;justify-content:space-between}

/* ===== 9. CALCULADORAS TRABALHISTAS (férias, 13º, rescisão) ===== */
html.page-calc .rows .hd {font:600 12px "Inter",sans-serif;letter-spacing:.04em;text-transform:uppercase;color:var(--mute);margin:14px 0 2px}
html.page-calc .rows .hd:first-child {margin-top:0}
html.page-calc .r.sum {font-weight:600}
html.page-calc .r.info b {color:var(--stat)}
html.page-calc .txt ul {margin:0 0 10px;padding-left:1.25rem;list-style:disc;max-width:75ch}
html.page-calc .txt li {margin-bottom:4px}
html.page-calc .txt a {text-decoration:underline}