/* Base, foco, seleção e variantes estruturais (data-nav/input/btn/card). Carregar ANTES de componentes.css. */
/* ======================= BASE ======================= */
*{box-sizing:border-box;margin:0}
html,body{height:100%}
body{font-family:var(--font);font-size:calc(13px * 1);line-height:1.45;color:var(--text);background:var(--bg);background-image:var(--bg-img);background-size:var(--bg-size,auto);background-position:var(--bg-pos,0 0);background-repeat:var(--bg-rep,repeat);background-attachment:fixed;-webkit-font-smoothing:antialiased;overflow:hidden}
.ic{width:16px;height:16px;flex-shrink:0;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.num{font-variant-numeric:tabular-nums}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
:focus-visible{outline:2px solid var(--pri);outline-offset:2px}
/* seleção de texto: cor principal com o texto de contraste garantido (nunca branco sobre claro) */
::selection{background:var(--pri);color:var(--pri-ink)}
input::selection,textarea::selection{background:var(--pri);color:var(--pri-ink)}
/* painéis que abrem por cima da moldura não herdam a cor do menu (nome branco sobre painel branco) */
.usrpop,.pop{color:var(--text)}
.usrpop .usrgrp{color:var(--text-2)!important}
/* textos sobre fundos cinza (segmentado, contadores, cabeçalho de tabela) usam tons que passam também sobre o cinza */
.ph .seg button:not(.on){color:var(--text)}
.it .cont{color:var(--text)!important}
th{color:var(--text-2)!important}
.screen{position:fixed;inset:0;display:none}
.screen.on{display:block}
@media (prefers-reduced-motion:reduce){*{animation-duration:.01ms!important;transition-duration:.01ms!important}}

/* ---------- variantes estruturais ---------- */
.card{background:var(--surface);border-radius:var(--r-l)}
[data-card="shadow"] .card{box-shadow:var(--sh-card)}
[data-card="border"] .card{border:1px solid var(--border)}
[data-card="glass"] .card{border:1px solid var(--border);box-shadow:var(--sh-card);backdrop-filter:blur(20px) saturate(150%);-webkit-backdrop-filter:blur(20px) saturate(150%)}
[data-card="neu"] .card{box-shadow:var(--sh-card)}
.card.hov{transition:transform .2s ease,box-shadow .2s ease,border-color .2s}
.card.hov:hover{box-shadow:var(--sh-card-h);transform:translateY(-2px)}
[data-card="border"] .card.hov:hover{transform:none;border-color:var(--border-2)}

.inp{width:100%;height:calc(34px * var(--dens));padding:0 11px;font:inherit;color:var(--text);background:var(--surface);border:1px solid var(--border-2);border-radius:var(--r-m);transition:border-color .15s,box-shadow .15s,background .15s;outline:none}
.inp::placeholder{color:var(--text-3)}
/* contorno do campo ≥ 3:1 contra o cartão (regra de contorno de controle); no escuro o fundo do campo destaca do cartão */
.inp{border-color:var(--campo-b)}
[data-mode="dark"] .inp{background-color:color-mix(in srgb,var(--text) 6%,var(--surface))}
.inp:hover{border-color:color-mix(in srgb,var(--text) 70%,var(--surface))}
.inp:focus{border-color:var(--pri);box-shadow:0 0 0 3px color-mix(in srgb,var(--pri) 22%,transparent)}
[data-input="filled"] .inp{background:var(--surface-2);border-color:transparent transparent var(--campo-b)}
[data-mode="dark"][data-input="filled"] .inp{background:color-mix(in srgb,var(--text) 10%,var(--surface))}
[data-input="filled"] .inp:focus{background:var(--surface);box-shadow:0 0 0 2px var(--pri)}
[data-input="underline"] .inp{border-color:var(--border);border-bottom-color:var(--campo-b);border-radius:var(--r-s)}
[data-input="underline"] .inp:focus{box-shadow:inset 0 -2px 0 var(--pri);border-bottom-color:var(--pri)}
[data-input="inset"] .inp{background:var(--surface);border:0;border-bottom:1px solid var(--campo-b);box-shadow:inset 3px 3px 6px var(--sh-lo),inset -3px -3px 6px var(--sh-hi)}
[data-input="inset"] .inp:focus{box-shadow:inset 3px 3px 6px var(--sh-lo),inset -3px -3px 6px var(--sh-hi),0 0 0 2px var(--pri)}
[data-theme="contraste"] .inp{border-width:2px}

.btn{height:calc(34px * var(--dens));padding:0 16px;display:inline-flex;align-items:center;justify-content:center;gap:7px;font-weight:600;border-radius:var(--r-m);transition:transform .12s ease,box-shadow .18s,background .18s,filter .18s;white-space:nowrap}
.btn:active{transform:translateY(1px) scale(.99)}
.bp{background:var(--pri);color:var(--pri-ink)}
.bp:hover{background:var(--pri-2)}
[data-btn="gradient"] .bp{background:linear-gradient(180deg,var(--pri-2),var(--pri));box-shadow:inset 0 1px 0 rgba(255,255,255,.22),0 4px 12px -2px color-mix(in srgb,var(--pri) 45%,transparent)}
[data-btn="gradient"] .bp:hover{filter:brightness(1.06);box-shadow:inset 0 1px 0 rgba(255,255,255,.22),0 8px 18px -4px color-mix(in srgb,var(--pri) 55%,transparent)}
[data-btn="pill"] .btn{border-radius:999px;padding:0 20px}
[data-btn="ink"] .bp{background:var(--text);color:var(--surface)}
[data-btn="ink"] .bp:hover{filter:brightness(1.25)}
[data-btn="neu"] .bp{box-shadow:4px 4px 10px var(--sh-lo),-4px -4px 10px var(--sh-hi)}
.bs{background:var(--surface);color:var(--text);box-shadow:inset 0 0 0 1px var(--border-2)}
.bs:hover{background:var(--surface-2)}
[data-btn="pill"] .bs{background:var(--pri-soft);color:var(--pri-soft-ink);box-shadow:none}
[data-btn="neu"] .bs{box-shadow:4px 4px 10px var(--sh-lo),-4px -4px 10px var(--sh-hi)}
.bi{width:calc(34px * var(--dens));padding:0;color:var(--text-2);border-radius:var(--r-m);position:relative}
.bi:hover{background:var(--surface-2);color:var(--text)}