/* Razel Manager — design system
   Identidade tirada do razel.net: fundo #04060B, dourado #D6B45C.
   Sem blur e sem sombra animada: as máquinas dos analistas são fracas (RNF-10). */

:root[data-t="dark"]{
 /* Escuro de trabalho, não escuro de vitrine: a tela fica aberta o dia inteiro,
    então o fundo é grafite azulado e não preto, e o texto secundário é alto. */
 --bg:#111823; --surf:#18212E; --surf2:#1E2836; --hover:#243040;
 --ink:#F4F7FB; --ink2:#AFBECF; --ink3:#7D8DA1;
 --line:rgba(255,255,255,.10); --line2:rgba(255,255,255,.065); --edge:rgba(255,255,255,.18);
 --gold:#D6B45C; --goldbg:rgba(214,180,92,.13); --goldln:rgba(214,180,92,.32);
 --btnbg:#D6B45C; --btnfg:#0A0E15; --btnbg2:#E7CB80;
 --hot:#FF6B6B; --hotbg:rgba(255,92,92,.16); --hotln:rgba(255,92,92,.38);
 --mid:#F5C044; --midbg:rgba(240,180,41,.14); --midln:rgba(240,180,41,.34);
 --loss:#3FDDB4; --lossbg:rgba(45,212,167,.13); --lossln:rgba(45,212,167,.32);
 --urgent:#FF2D78; --massive:#4C7DFF;
 --st-open-bg:rgba(45,212,167,.16);  --st-open-fg:#6EE7C4;  --st-open-ln:rgba(45,212,167,.45);
 --st-pause-bg:rgba(240,180,41,.17); --st-pause-fg:#F7CE6B; --st-pause-ln:rgba(240,180,41,.45);
 --st-done-bg:rgba(125,160,205,.15); --st-done-fg:#A9BDD6; --st-done-ln:rgba(140,175,215,.32);
 --modal-bg:#1F2A38; --modal-card:#273445; --modal-line:rgba(255,255,255,.13);
 --sh:0 1px 2px rgba(0,0,0,.38),0 8px 24px -10px rgba(0,0,0,.5);
}
:root[data-t="light"]{
 --bg:#F4F6F9; --surf:#FFFFFF; --surf2:#FAFBFD; --hover:#F1F4F8;
 --ink:#0A0E15; --ink2:#4B586B; --ink3:#8593A6;
 --line:rgba(10,20,40,.10); --line2:rgba(10,20,40,.055); --edge:rgba(10,20,40,.18);
 --gold:#7A5A12; --goldbg:rgba(214,180,92,.18); --goldln:rgba(150,115,30,.42);
 --btnbg:#0D1420; --btnfg:#E9D093; --btnbg2:#18222F;
 --hot:#C81E1E; --hotbg:rgba(200,30,30,.15); --hotln:rgba(200,30,30,.3);
 --mid:#A16207; --midbg:rgba(214,160,20,.20); --midln:rgba(180,120,10,.3);
 --loss:#047857; --lossbg:rgba(4,150,105,.15); --lossln:rgba(4,120,87,.26);
 --urgent:#C7005A; --massive:#1D4ED8;
 --st-open-bg:#D4EDDA;  --st-open-fg:#155724;  --st-open-ln:rgba(21,87,36,.18);
 --st-pause-bg:#FFF3CD; --st-pause-fg:#856404; --st-pause-ln:rgba(133,100,4,.2);
 --st-done-bg:#D1ECF1;  --st-done-fg:#0C5460;  --st-done-ln:rgba(12,84,96,.16);
 --modal-bg:#FFFFFF; --modal-card:#FAFBFD; --modal-line:rgba(10,20,40,.10);
 --sh:0 1px 2px rgba(16,24,40,.05),0 10px 28px -10px rgba(16,24,40,.18);
}
*{box-sizing:border-box;margin:0;padding:0}
body{background:var(--bg);color:var(--ink);font:400 14px/1.5 "Inter Tight",system-ui,sans-serif;
 -webkit-font-smoothing:antialiased}
a{color:inherit}
.mono{font-family:"JetBrains Mono",ui-monospace,monospace;font-variant-numeric:tabular-nums}

/* controles — vale para todo campo, e não só para os que estão dentro de .fld.
   Sem isto o navegador desenha o dele, que destoa do resto da tela. */
input,select,textarea,button{font-family:inherit}
input[type=text],input[type=email],input[type=password],input[type=date],input[type=time],
input[type=month],input[type=datetime-local],input[type=number],input[type=search],
input:not([type]),select,textarea{
 -webkit-appearance:none;appearance:none;
 background:var(--surf2);border:1px solid var(--line);border-radius:7px;
 padding:8px 10px;font-size:13px;color:var(--ink);outline:none;
 transition:border-color .12s,box-shadow .12s}
input[type=date],input[type=time],input[type=month],input[type=datetime-local]{
 font-family:"JetBrains Mono",ui-monospace,monospace;font-size:12.5px}
select{padding-right:30px;cursor:pointer;
 background-image:url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' fill='none' stroke='%238593A6' stroke-width='1.6' stroke-linecap='round'/%3E%3C/svg%3E");
 background-repeat:no-repeat;background-position:right 11px center}
input:focus,select:focus,textarea:focus{border-color:var(--goldln);box-shadow:0 0 0 3px var(--goldbg)}
input::placeholder,textarea::placeholder{color:var(--ink3)}
input:disabled,select:disabled,textarea:disabled{opacity:.6;cursor:not-allowed}
/* o seletor de data nativo some no escuro se o navegador não souber o esquema */
:root[data-t="dark"] input[type=date],:root[data-t="dark"] input[type=time],
:root[data-t="dark"] input[type=month],:root[data-t="dark"] input[type=datetime-local]{
 color-scheme:dark}
input[type=checkbox],input[type=radio]{accent-color:var(--gold);width:15px;height:15px;
 vertical-align:-2px;cursor:pointer}
/* campo dentro de tabela ocupa a coluna e alinha com o número */
td input,td select{width:100%;padding:6px 9px;font-size:12.5px}
td select{padding-right:26px;background-position:right 8px center}
td input.mono{text-align:right}
label{cursor:default}
.serif{font-family:"Instrument Serif",Georgia,serif;font-weight:400}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
/* Modo discreto: some com valor na tela sem mexer em permissão. É para quando
   o admin está trabalhando ao lado da equipe. */
:root[data-priv="on"] .fin{display:none!important}
:root[data-priv="on"] #privToggle{background:var(--goldbg);color:var(--gold);
 box-shadow:inset 0 0 0 1px var(--goldln)}

/* topo */
.top{background:var(--surf);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:20}
.top-in{max-width:1680px;margin:0 auto;padding:0 24px;display:flex;align-items:center;gap:26px;height:58px}
.logo{height:19px;width:auto;opacity:.95;flex:none}
:root[data-t="light"] .logo{filter:invert(1) brightness(.2)}
.nav{display:flex;gap:3px;flex:1}
.nav a{padding:8px 15px;border-radius:7px;font-size:13.5px;font-weight:500;color:var(--ink2);
 text-decoration:none;letter-spacing:.01em}
.nav a:hover{background:var(--hover);color:var(--ink)}
.nav a.on{background:var(--goldbg);color:var(--gold);font-weight:600;box-shadow:inset 0 0 0 1px var(--goldln)}
.tools{display:flex;align-items:center;gap:10px;flex:none}
.sbox{position:relative;width:210px}
.sbox input{width:100%;padding:7px 11px 7px 31px;font-family:"Inter Tight";font-weight:400}
.sbox input:focus{border-color:var(--goldln);box-shadow:0 0 0 3px var(--goldbg)}
.sbox svg{position:absolute;left:10px;top:8px;opacity:.4}
.ico{width:32px;height:32px;border-radius:7px;border:1px solid var(--line);background:var(--surf2);
 color:var(--ink2);display:grid;place-items:center;cursor:pointer;font-size:14px}
.ico:hover{background:var(--hover);color:var(--ink)}
.av{width:30px;height:30px;border-radius:50%;background:linear-gradient(140deg,#D6B45C,#B08C2E);
 color:#0B0F16;display:grid;place-items:center;font:700 11px "Inter Tight";text-decoration:none}

.wrap{max-width:1680px;margin:0 auto;padding:26px 24px 70px}
.head{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;flex-wrap:wrap;margin-bottom:20px}
h1{font-family:"Instrument Serif",Georgia,serif;font-size:34px;font-weight:400;letter-spacing:-.01em;line-height:1}
.sub{color:var(--ink3);font-size:13px;margin-top:7px}
.sub b{color:var(--ink2);font-weight:500}
.btn{background:var(--btnbg);color:var(--btnfg);border:0;border-radius:7px;padding:9px 16px;
 font:600 13px "Inter Tight";cursor:pointer;letter-spacing:.01em;text-decoration:none;display:inline-block}
.btn:hover{background:var(--btnbg2)}
.btn.gh{background:var(--surf);color:var(--ink2);border:1px solid var(--line)}
.btn.gh:hover{background:var(--hover);color:var(--ink);border-color:var(--edge)}
.btn.dg{background:transparent;color:var(--hot);border:1px solid var(--hotln)}
.btn.dg:hover{background:var(--hotbg)}
.btn.sm{padding:6px 12px;font-size:12px}

.tabs{display:flex;gap:2px;border-bottom:1px solid var(--line)}
.tab{padding:10px 15px;font-size:13px;font-weight:500;color:var(--ink3);cursor:pointer;
 border-bottom:2px solid transparent;margin-bottom:-1px;display:flex;align-items:center;gap:7px;
 text-decoration:none}
.tab:hover{color:var(--ink)}
.tab.on{color:var(--gold);border-bottom-color:var(--gold);font-weight:600}
.cnt{background:var(--line2);color:var(--ink2);border-radius:20px;padding:1px 7px;font:600 11px "JetBrains Mono"}
.tab.on .cnt{background:var(--goldbg);color:var(--gold)}
.filters{display:flex;gap:7px;padding:13px 0;flex-wrap:wrap;align-items:center}
.chip{background:var(--surf);border:1px solid var(--line);border-radius:7px;padding:6px 11px;
 font-size:12.5px;color:var(--ink2);cursor:pointer;display:flex;align-items:center;gap:6px;
 text-decoration:none}
.chip:hover{border-color:var(--edge);color:var(--ink)}
.chip.on{background:var(--goldbg);border-color:var(--goldln);color:var(--gold);font-weight:600}
.chip select,.chip input{background:transparent;border:0;color:inherit;font:inherit;outline:none;
 cursor:pointer;padding:0;padding-right:16px;box-shadow:none}
.chip select{background-position:right 0 center}
.chip input:focus,.chip select:focus{box-shadow:none}
.sep{flex:1}

.panel{background:var(--surf);border:1px solid var(--line);border-radius:11px;box-shadow:var(--sh);overflow:hidden}
.tw{overflow-x:auto}
table{width:100%;border-collapse:collapse;min-width:1180px}
thead th{text-align:left;font:600 10.5px "Inter Tight";letter-spacing:.09em;text-transform:uppercase;
 color:var(--ink3);padding:11px 14px;background:var(--surf2);border-bottom:1px solid var(--line);white-space:nowrap}
thead th.r{text-align:right}
thead th a{text-decoration:none;display:block}
thead th.s{cursor:pointer;user-select:none}
thead th.s:hover{color:var(--ink);background:var(--hover)}
thead th.act{color:var(--gold)}
.ar{margin-left:5px;opacity:.4;font-size:9px}
thead th.act .ar{opacity:1}
tbody tr{border-bottom:1px solid var(--line2);cursor:pointer}
tbody tr:last-child{border-bottom:0}
td{padding:13px 14px;font-size:13.5px;vertical-align:middle}
td.r{text-align:right}
td:first-child{padding-left:20px}
tr.hot{background:var(--hotbg);box-shadow:inset 5px 0 0 var(--hot)}
tr.mid{background:var(--midbg);box-shadow:inset 5px 0 0 var(--mid)}
tr.loss{background:var(--lossbg);box-shadow:inset 5px 0 0 var(--loss)}
tr.none{box-shadow:inset 5px 0 0 var(--line)}
tr.done{box-shadow:inset 5px 0 0 transparent}
tr.done:hover{background:var(--hover)}
tr.done .cli{color:var(--ink2)}
tr.hot:hover{background:color-mix(in srgb,var(--hotbg) 60%,var(--hover))}
tr.mid:hover{background:color-mix(in srgb,var(--midbg) 60%,var(--hover))}
tr.loss:hover{background:color-mix(in srgb,var(--lossbg) 60%,var(--hover))}
tr.none:hover{background:var(--hover)}
.tid{font:500 12px "JetBrains Mono";color:var(--ink3)}
.cli{font-weight:600;font-size:14px;letter-spacing:-.005em}
.desc{color:var(--ink2);font-size:12.5px;display:block;margin-top:2px;max-width:420px;
 overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rh{font:600 13px "JetBrains Mono"}
.rh.hot{color:var(--hot)} .rh.mid{color:var(--mid)} .rh.loss{color:var(--loss)} .rh.none{color:var(--ink3)}
.who{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--ink2)}
.dotu{width:22px;height:22px;border-radius:50%;display:grid;place-items:center;
 font:700 9.5px "Inter Tight";color:#06080D;flex:none}
.pill{font:500 10.5px "Inter Tight";padding:3px 8px;border-radius:5px;background:var(--line2);
 color:var(--ink3);white-space:nowrap;letter-spacing:.02em}
.badge{font:700 10px "Inter Tight";padding:3.5px 8px;border-radius:5px;letter-spacing:.06em;
 text-transform:uppercase;color:#fff;white-space:nowrap}
.b-urgent{background:var(--urgent)}
.b-massive{background:var(--massive)}
.b-warn{background:transparent;color:var(--mid);box-shadow:inset 0 0 0 1px var(--midln)}
/* Status: pílula cheia, como no sistema atual. Contorno fino não destacava. */
.tag{display:inline-block;font:600 11.5px "Inter Tight";padding:4.5px 13px;border-radius:20px;
 white-space:nowrap;letter-spacing:.01em}
.t-open{background:var(--st-open-bg);color:var(--st-open-fg);box-shadow:inset 0 0 0 1px var(--st-open-ln)}
.t-paused{background:var(--st-pause-bg);color:var(--st-pause-fg);box-shadow:inset 0 0 0 1px var(--st-pause-ln)}
.t-finished{background:var(--st-done-bg);color:var(--st-done-fg);box-shadow:inset 0 0 0 1px var(--st-done-ln)}
.sla{font:600 12.5px "JetBrains Mono"}
.sla.dentro{color:var(--ink2)} .sla.risco{color:var(--mid)} .sla.violado{color:var(--hot)}
.sla.impactado_por_massiva{color:var(--massive)} .sla.sem_sla{color:var(--ink3)}
.prio{font:600 11.5px "Inter Tight"}
.prio.hot{color:var(--hot)} .prio.mid{color:var(--mid)}
.prio.loss{color:var(--loss)} .prio.none{color:var(--ink3)}

.leg{display:flex;gap:22px;padding:13px 20px;background:var(--surf2);border-top:1px solid var(--line);
 font-size:11.5px;color:var(--ink3);flex-wrap:wrap;align-items:center}
.leg b{color:var(--ink2);font-weight:600}
.leg i{width:14px;height:10px;border-radius:3px;display:inline-block;vertical-align:-1px;margin-right:6px}
.empty{padding:60px 20px;text-align:center;color:var(--ink3);font-size:13px}
.empty b{display:block;color:var(--ink2);font-size:15px;margin-bottom:6px;font-weight:600}

/* formulário e detalhe */
.card{background:var(--surf);border:1px solid var(--line);border-radius:11px;box-shadow:var(--sh);
 padding:22px 24px;margin-bottom:18px}
.sec{font:600 10.5px "Inter Tight";letter-spacing:.09em;text-transform:uppercase;color:var(--ink3);
 margin:0 0 12px;display:flex;align-items:center;gap:9px}
.sec:after{content:"";flex:1;height:1px;background:var(--line)}
.row{display:flex;gap:14px;flex-wrap:wrap;margin-bottom:16px}
.fld{flex:1;min-width:150px}
.fld label{display:block;font-size:11px;color:var(--ink3);margin-bottom:5px;font-weight:500}
.fld input,.fld select,.fld textarea{width:100%}
.fld input{font-family:"JetBrains Mono",ui-monospace,monospace;font-weight:500}
.fld select,.fld textarea{font-family:"Inter Tight";font-weight:400}
.fld textarea{resize:vertical;min-height:72px;line-height:1.5}
.fld input[type=checkbox]{width:auto}
.kv{display:flex;justify-content:space-between;align-items:baseline;gap:16px;padding:8px 0;
 border-bottom:1px solid var(--line2);font-size:13px}
.kv:last-child{border-bottom:0}
.kv>span:first-child{color:var(--ink3);flex:1 1 auto;min-width:0}
.kv>span:last-child{flex:0 0 auto;text-align:right;max-width:60%;overflow-wrap:anywhere}
.kv .mono{white-space:nowrap}
/* Valor comprido, como título de contrato, ocupa a linha inteira em vez de
   quebrar em três pedaços alinhados à direita. */
.kv.stack{display:block}
.kv.stack>span:first-child{display:block;margin-bottom:3px}
.kv.stack>span:last-child{display:block;max-width:100%;text-align:left;color:var(--ink)}
.alert{border-radius:9px;padding:13px 15px;margin-bottom:16px;font-size:12.8px;color:var(--ink2);
 box-shadow:inset 0 0 0 1px var(--edge)}
.alert.u{background:rgba(255,45,120,.11);box-shadow:inset 0 0 0 1px var(--urgent)}
.alert.m{background:rgba(76,125,255,.10);box-shadow:inset 0 0 0 1px var(--massive)}
.alert.ok{background:var(--lossbg);box-shadow:inset 0 0 0 1px var(--lossln)}
.alert b{display:block;margin-bottom:4px;font-size:12.5px;letter-spacing:.02em}
.alert.u b{color:var(--urgent)} .alert.m b{color:var(--massive)}
.prog{height:7px;background:var(--line2);border-radius:4px;overflow:hidden;margin-top:9px}
.prog i{display:block;height:100%;border-radius:4px}
.apt{display:flex;gap:8px;align-items:flex-end;margin-bottom:9px}
.rm{width:32px;height:34px;flex:none;border-radius:7px;border:1px solid var(--line);background:transparent;
 color:var(--ink3);cursor:pointer;font-size:15px;line-height:1}
.rm:hover{color:var(--hot);border-color:var(--hotln);background:var(--hotbg)}
.tot{display:flex;justify-content:space-between;padding:11px 13px;background:var(--goldbg);
 border-radius:8px;margin-top:12px;box-shadow:inset 0 0 0 1px var(--goldln)}
.tot b{font:600 15px "JetBrains Mono";color:var(--gold)}
.cmt{border:1px solid var(--line);border-radius:9px;padding:11px 13px;margin-bottom:10px;background:var(--surf2)}
.cmt-h{display:flex;align-items:center;gap:9px;font-size:11.5px;color:var(--ink3);margin-bottom:5px}
.cmt-h b{color:var(--ink2);font-weight:600;font-size:12px}
.cmt-a{margin-left:auto;display:flex;gap:4px}
.cmt-b{color:var(--ink2);font-size:13px;white-space:pre-wrap}
.att{display:inline-flex;align-items:center;gap:6px;margin-top:9px;margin-right:7px;padding:5px 9px;
 border-radius:6px;border:1px solid var(--line);font-size:11.5px;color:var(--ink2);background:var(--surf);
 text-decoration:none}
.att:hover{border-color:var(--goldln);color:var(--gold)}
.grid2{display:grid;grid-template-columns:1.05fr .95fr;gap:26px}
/* Item de grid e de flex nasce com min-width:auto, entao um filho largo, como
   tabela, estica a coluna em vez de deixar o .tw rolar por dentro. Sem isto,
   uma tabela de sete colunas empurrava a pagina inteira para o lado e cortava
   o cabecalho. */
.grid2 > *{min-width:0}
.row > *{min-width:0}
@media (max-width:1100px){.grid2{grid-template-columns:1fr}}
@media(max-width:900px){.grid2{grid-template-columns:1fr}}
.actions{display:flex;gap:9px;align-items:center;flex-wrap:wrap;margin-top:6px}
.flash{border-radius:9px;padding:11px 15px;margin-bottom:16px;font-size:13px}
.flash.success{background:var(--lossbg);color:var(--loss);box-shadow:inset 0 0 0 1px var(--lossln)}
.flash.error{background:var(--hotbg);color:var(--hot);box-shadow:inset 0 0 0 1px var(--hotln)}
.pag{display:flex;gap:6px;justify-content:center;padding:16px;background:var(--surf2);
 border-top:1px solid var(--line)}
.pag a,.pag span{padding:5px 11px;border-radius:6px;font-size:12.5px;color:var(--ink2);
 text-decoration:none;border:1px solid var(--line)}
.pag a:hover{border-color:var(--edge);color:var(--ink)}
.pag .cur{background:var(--goldbg);color:var(--gold);border-color:var(--goldln);font-weight:600}

/* Modal do chamado: centralizado e sem blur, que deixa a máquina do analista lenta. */
.ovl{position:fixed;inset:0;background:rgba(3,5,9,.72);display:none;z-index:60;
 align-items:center;justify-content:center;padding:24px}
.ovl.on{display:flex}
.modal{position:relative;background:var(--modal-bg);border:1px solid var(--edge);border-radius:13px;
 box-shadow:var(--sh);width:1000px;max-width:100%;max-height:92vh;display:flex;flex-direction:column;
 overflow:hidden}
.modal .m-b{padding:24px 26px 26px;overflow-y:auto;flex:1}
.modal .head{margin-bottom:18px;padding-right:40px}
.modal h1{font-size:28px}
.modal .card{background:var(--modal-card);border-color:var(--modal-line)}
.modal .fld input,.modal .fld select,.modal .fld textarea{background:var(--modal-bg)}
.modal .cmt{background:var(--modal-bg);border-color:var(--modal-line)}
.modal .sub,.modal .fld label,.modal .kv>span:first-child,.modal .sec{color:var(--ink2)}
.modal .sec:after,.modal .kv{border-color:var(--modal-line)}
.modal .kv{border-bottom-color:var(--modal-line)}
.modal .pill{background:rgba(255,255,255,.07);color:var(--ink2)}
.x{position:absolute;top:14px;right:16px;z-index:2;background:none;border:0;color:var(--ink3);
 font-size:26px;line-height:1;cursor:pointer;padding:0 6px;border-radius:6px}
.x:hover{color:var(--ink);background:var(--hover)}
tbody tr[data-ticket-url]{cursor:pointer}
a.tid:hover{color:var(--gold);text-decoration:underline!important}
@media(max-width:900px){.modal{width:100%;max-height:96vh}.modal .m-b{padding:18px}}

/* ---------------------------------------------------------------- impressão
   Relatório que sai da empresa precisa sair legível no papel e no PDF do
   navegador. Sem biblioteca de PDF: html2canvas rasteriza a página inteira e
   trava máquina fraca (RNF-10). Imprimir para PDF sai com texto de verdade,
   que dá para copiar e pesquisar. */

@media print {
    .no-print,
    .rm-top, .rm-nav, .rm-menu,
    .filters:not(.keep-print),
    .btn, button { display: none !important; }

    :root {
        --bg: #fff; --surf: #fff; --surf2: #fff;
        --ink: #111; --ink2: #333; --ink3: #666; --line: #ccc;
    }

    body { background: #fff !important; color: #111 !important; }

    .wrap, .rm-main { max-width: none; padding: 0; margin: 0; }

    .card, .panel {
        background: #fff !important;
        border: 1px solid #ccc !important;
        box-shadow: none !important;
        break-inside: avoid;
        page-break-inside: avoid;
    }

    table { font-size: 10.5px; }
    thead { display: table-header-group; }
    tr { break-inside: avoid; page-break-inside: avoid; }

    /* A cor da faixa vira só um traço na lateral: fundo colorido gasta tinta
       e some na impressão em preto e branco. */
    tr.hot, tr.mid, tr.loss, tr.none { background: #fff !important; }
    tr.hot td:first-child { border-left: 3px solid #b00 !important; }
    tr.mid td:first-child { border-left: 3px solid #b80 !important; }

    a { color: #111 !important; text-decoration: none !important; }

    .head { border-bottom: 2px solid #111; padding-bottom: 8px; margin-bottom: 14px; }
    .head h1 { font-size: 20px; }

    @page { margin: 14mm 10mm; }
}


/* Matriz de permissão: três estados por módulo, num controle só. */
.perm{display:inline-flex;border:1px solid var(--line);border-radius:7px;overflow:hidden}
.perm label{display:block;cursor:pointer;margin:0}
.perm input{position:absolute;opacity:0;pointer-events:none}
.perm span{display:block;padding:4px 9px;font-size:11.5px;color:var(--ink3);
    background:var(--surf);border-right:1px solid var(--line);white-space:nowrap;
    transition:background .12s,color .12s}
.perm label:last-child span{border-right:0}
.perm label:hover span{color:var(--ink)}
.perm input:checked + span{background:var(--btnbg);color:var(--btnfg);font-weight:600}
.perm input:focus-visible + span{outline:2px solid var(--gold);outline-offset:-2px}

/* Reset de senha na matriz: fica fechado até alguém precisar dele. */
.pwbox{display:inline-block;text-align:left}
.pwbox summary{list-style:none;cursor:pointer;font-size:11.5px;color:var(--ink3);
    border:1px solid var(--line);border-radius:7px;padding:4px 10px;display:inline-block}
.pwbox summary::-webkit-details-marker{display:none}
.pwbox summary:hover{color:var(--ink);border-color:var(--goldln)}
.pwbox[open] summary{color:var(--gold);border-color:var(--goldln)}
.pwform{margin-top:8px;padding:10px;background:var(--surf2);border:1px solid var(--line);
    border-radius:9px;display:flex;flex-direction:column;gap:8px}
.pwform input[type=text]{width:100%;font-family:"JetBrains Mono",monospace;font-size:12px}
.pwform label{display:flex;gap:6px;align-items:flex-start;font-size:11px;color:var(--ink3);
    line-height:1.35;cursor:pointer}
.pwform label input{margin-top:1px;flex:0 0 auto}

/* ═══════════════════════════════ Kanban de projetos ═══════════════════════ */

/* --- lista de projetos --- */
.pgrid{display:grid;gap:12px;grid-template-columns:repeat(auto-fill,minmax(290px,1fr))}
.pcard{display:flex;background:var(--surf);border:1px solid var(--line);border-radius:9px;
    overflow:hidden;text-decoration:none;color:inherit;transition:border-color .12s}
.pcard:hover{border-color:var(--goldln)}
.pcard > i{flex:0 0 4px}
.pc-in{padding:13px 15px;flex:1;min-width:0}
.pc-top{display:flex;align-items:baseline;gap:9px;justify-content:space-between}
.pc-top b{font-size:14.5px;color:var(--ink);line-height:1.3}
.pc-desc{margin:7px 0 0;font-size:12.5px;color:var(--ink3);line-height:1.45}
.pc-foot{display:flex;flex-wrap:wrap;gap:12px;margin-top:11px;font-size:11.5px;color:var(--ink3)}
.pc-foot .late{color:var(--hot)}
.pdot{width:11px;height:11px;border-radius:3px;display:inline-block;flex:none}

/* --- quadro --- */
.kb{display:flex;gap:12px;align-items:flex-start;overflow-x:auto;padding-bottom:14px;
    min-height:60vh}
.kb-col{flex:0 0 288px;background:var(--surf);border:1px solid var(--line);border-radius:10px;
    display:flex;flex-direction:column;max-height:calc(100vh - 250px)}
.kb-col.over{border-color:var(--gold)}
.kb-h{display:flex;align-items:center;gap:8px;padding:11px 13px 9px;border-bottom:1px solid var(--line)}
.kb-name{font:600 13px/1.3 inherit;color:var(--ink);flex:1;min-width:0;outline:0;border-radius:4px;
    padding:2px 4px;margin:-2px -4px}
.kb-name:focus{background:var(--surf2);box-shadow:0 0 0 1px var(--goldln)}
.kb-n{font-family:"JetBrains Mono",monospace;font-size:11px;color:var(--ink3);flex:none}
.kb-x{background:none;border:0;color:var(--ink3);cursor:pointer;font-size:15px;line-height:1;
    padding:0 2px;flex:none;opacity:0;transition:opacity .12s}
.kb-h:hover .kb-x,.cl-h:hover .kb-x,.cl-i:hover .kb-x{opacity:1}
.kb-x:hover{color:var(--hot)}
.kb-cards{padding:9px;display:flex;flex-direction:column;gap:8px;overflow-y:auto;flex:1;min-height:26px}
.kb-card{background:var(--surf2);border:1px solid var(--line);border-radius:7px;padding:10px 11px;
    cursor:pointer;transition:border-color .12s,transform .06s}
.kb-card:hover{border-color:var(--goldln)}
.kb-card.drag{opacity:.4}
.kb-card.late{border-left:3px solid var(--hot)}
.kb-t{font-size:13px;line-height:1.4;color:var(--ink)}
.kb-tags{display:flex;gap:4px;margin-bottom:7px}
.kb-tag{width:26px;height:5px;border-radius:3px;display:block}
.kb-meta{display:flex;flex-wrap:wrap;align-items:center;gap:9px;margin-top:9px;
    font-size:11px;color:var(--ink3)}
.kb-meta .late{color:var(--hot)}
.kb-meta .done{color:var(--loss)}
.kb-meta .tk{font-family:"JetBrains Mono",monospace;color:var(--gold)}
.kb-meta .who{margin-left:auto;width:19px;height:19px;border-radius:50%;background:var(--goldln);
    color:var(--bg);display:grid;place-items:center;font-size:10px;font-weight:600}
.kb-add{padding:0 9px 10px}
.kb-add textarea,.kb-new input{width:100%;background:transparent;border:1px dashed var(--line);
    border-radius:7px;padding:8px 10px;font:inherit;font-size:12.5px;color:var(--ink2);resize:none}
.kb-add textarea:focus,.kb-new input:focus{border-style:solid;border-color:var(--goldln);
    background:var(--surf2);color:var(--ink);outline:0}
.kb-new{flex:0 0 250px;background:transparent;border-style:dashed;padding:10px}
.kb-hint{font-size:11.5px;color:var(--ink3);margin-top:4px}
.kb-ph{border:1px dashed var(--gold);border-radius:7px;height:34px;flex:none}

/* --- modal do cartão --- */
.cardmodal{display:flex;flex-direction:column;max-height:88vh}
.cardmodal > header{display:flex;gap:14px;align-items:flex-start;padding:19px 22px 15px;
    border-bottom:1px solid var(--line)}
.cm-crumb{font-size:11.5px;color:var(--ink3);margin-bottom:5px}
.cardmodal h2{margin:0;font-size:19px;line-height:1.3;color:var(--ink);outline:0;
    border-radius:5px;padding:2px 5px;margin:-2px -5px;flex:1}
.cardmodal h2:focus{background:var(--surf2);box-shadow:0 0 0 1px var(--goldln)}
.cm-close{background:none;border:0;color:var(--ink3);font-size:22px;line-height:1;cursor:pointer;flex:none}
.cm-close:hover{color:var(--ink)}
.cm-body{display:flex;gap:0;overflow:hidden;flex:1}
.cm-main{flex:1;padding:18px 22px 24px;overflow-y:auto;min-width:0}
.cm-side{flex:0 0 235px;padding:18px 22px 24px;border-left:1px solid var(--line);overflow-y:auto;
    background:var(--surf)}
.cm-sec{font:600 10.5px/1 inherit;letter-spacing:.09em;text-transform:uppercase;color:var(--ink3);
    margin:16px 0 8px;display:flex;align-items:center;gap:8px}
.cm-sec:first-child{margin-top:0}
.cm-mini{background:none;border:0;color:var(--gold);font-size:11px;cursor:pointer;
    text-transform:none;letter-spacing:0}
.cm-desc{font-size:13.5px;line-height:1.55;color:var(--ink2);min-height:42px;outline:0;
    border-radius:6px;padding:8px 10px;margin:0 -10px;white-space:pre-wrap}
.cm-desc:focus{background:var(--surf2);box-shadow:0 0 0 1px var(--goldln);color:var(--ink)}
.cm-desc:empty::before{content:attr(data-empty);color:var(--ink3)}
.cm-none{font-size:12.5px;color:var(--ink3);margin:0}
.cm-tip{font-size:11px;color:var(--ink3);line-height:1.45;margin:8px 0 0}
.cm-link{display:block;margin-top:6px;font-size:11.5px;color:var(--gold)}
.cm-side select,.cm-side input[type=date],.cm-side input[type=number]{width:100%}
.cm-side input.late{border-color:var(--hot)}
.cm-tags{display:flex;flex-wrap:wrap;gap:5px}
.cm-tag{display:inline-flex;align-items:center;gap:6px;background:transparent;border:1px solid var(--line);
    border-radius:6px;padding:4px 9px;font-size:11.5px;color:var(--ink3);cursor:pointer}
.cm-tag i{width:9px;height:9px;border-radius:2px}
.cm-tag.on{color:var(--ink);background:var(--surf2)}

/* --- checklist --- */
.cl{margin-bottom:16px}
.cl-h{display:flex;align-items:center;gap:8px;margin-bottom:7px}
.cl-h b{font-size:13px;color:var(--ink);flex:1}
.cl-n{font-family:"JetBrains Mono",monospace;font-size:11px;color:var(--ink3)}
.cl-i{display:flex;align-items:flex-start;gap:9px;padding:5px 6px;border-radius:5px;
    font-size:13px;color:var(--ink2);cursor:pointer;line-height:1.45}
.cl-i:hover{background:var(--surf2)}
.cl-i input{margin-top:2px;flex:none}
.cl-i span{flex:1}
.cl-i.done span{text-decoration:line-through;color:var(--ink3)}
.cl form input,.kb-add textarea{margin-top:5px}
.cl form input{width:100%;background:transparent;border:1px dashed var(--line);border-radius:6px;
    padding:6px 9px;font:inherit;font-size:12.5px;color:var(--ink2)}

/* --- comentário --- */
.cm-c{border-top:1px solid var(--line2,var(--line));padding:11px 0}
.cm-c-h{display:flex;gap:9px;align-items:baseline;font-size:11.5px;color:var(--ink3);margin-bottom:4px}
.cm-c-h b{color:var(--ink);font-size:12.5px}
.cm-c p{margin:0;font-size:13px;line-height:1.5;color:var(--ink2)}

/* --- minha conta: escolha do modulo inicial --- */
.homeopts{display:flex;flex-direction:column;gap:7px}
.homeopt{display:flex;align-items:flex-start;gap:11px;padding:11px 13px;border:1px solid var(--line);
    border-radius:8px;cursor:pointer;transition:border-color .12s,background .12s}
.homeopt:hover{border-color:var(--goldln)}
.homeopt.on{border-color:var(--gold);background:var(--surf2)}
.homeopt input{margin-top:3px;flex:none}
.homeopt b{display:block;font-size:13.5px;color:var(--ink);font-weight:600}
.homeopt span{display:block;font-size:11.5px;color:var(--ink3);margin-top:2px;
    font-family:"JetBrains Mono",monospace}

/* O menu da conta (.rm-me) é do cabeçalho compartilhado: mora em header.css,
   não aqui. Só o Ticket carregava esta regra, e o CRM ficava sem ela. */

/* --- cartao dentro do modal da casa --- */
.modal .cardmodal{display:flex;flex-direction:column}
.modal .cardmodal .cm-crumb{font-size:11.5px;color:var(--ink3);margin-bottom:5px}
.modal .cardmodal h2{margin:0 0 16px;font-size:22px;line-height:1.3;color:var(--ink);
    outline:0;border-radius:5px;padding:3px 6px;margin-left:-6px}
.modal .cardmodal h2:focus{background:var(--surf2);box-shadow:0 0 0 1px var(--goldln)}
.modal .cm-body{display:flex;gap:26px;align-items:flex-start}
@media (max-width:820px){.modal .cm-body{flex-direction:column;gap:14px}}
.modal .cm-main{flex:1;min-width:0}
.modal .cm-side{flex:0 0 218px;border-left:1px solid var(--modal-line);padding-left:20px}
@media (max-width:820px){.modal .cm-side{flex:1;border-left:0;border-top:1px solid var(--modal-line);
    padding-left:0;padding-top:14px;width:100%}}

/* --- anexos --- */
.anx-fotos{display:grid;gap:9px;grid-template-columns:repeat(auto-fill,minmax(132px,1fr));margin-bottom:11px}
.anx-foto{margin:0;border:1px solid var(--modal-line);border-radius:8px;overflow:hidden;background:var(--surf)}
.anx-foto img{display:block;width:100%;height:96px;object-fit:cover}
.anx-foto figcaption{display:flex;align-items:center;gap:6px;padding:6px 8px;font-size:11px;
    color:var(--ink3);line-height:1.3}
.anx-foto figcaption .kb-x{margin-left:auto;opacity:1}
.anx-arq{display:flex;align-items:center;gap:10px;padding:8px 10px;border:1px solid var(--modal-line);
    border-radius:7px;margin-bottom:6px;background:var(--surf)}
.anx-arq a{font-size:13px;color:var(--gold);text-decoration:none;flex:none;max-width:52%;
    overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.anx-arq span{font-size:11px;color:var(--ink3);flex:1;min-width:0;
    overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.anx-arq .kb-x{opacity:1}

/* --- membros do cartao --- */
.mem{display:flex;flex-direction:column;gap:4px}
.mem-i{display:flex;align-items:center;gap:8px;width:100%;padding:6px 8px;background:transparent;
    border:1px solid transparent;border-radius:7px;font:inherit;font-size:12.5px;color:var(--ink3);
    cursor:pointer;text-align:left}
.mem-i:hover{background:var(--surf2)}
.mem-i i{width:21px;height:21px;border-radius:50%;background:var(--line);color:var(--ink3);
    display:grid;place-items:center;font-size:10.5px;font-weight:600;font-style:normal;flex:none}
.mem-i.on{color:var(--ink);border-color:var(--line);background:var(--surf2)}
.mem-i.on i{background:var(--goldln);color:var(--bg)}
.mem-i.pri{border-color:var(--goldln)}
.mem-i em{margin-left:auto;font-style:normal;font-size:10px;color:var(--gold);
    text-transform:uppercase;letter-spacing:.06em}
.mem-i:disabled{cursor:default}

/* --- bolinhas de membro no cartao do quadro --- */
.kb-who{display:flex;margin-left:auto}
.kb-who span{width:19px;height:19px;border-radius:50%;background:var(--goldln);color:var(--bg);
    display:grid;place-items:center;font-size:10px;font-weight:600;
    border:1.5px solid var(--surf2);margin-left:-6px}
.kb-who span:first-child{margin-left:0}
.kb-cover{margin:-10px -11px 9px;border-radius:7px 7px 0 0;overflow:hidden;background:var(--surf)}
.kb-cover img{display:block;width:100%;height:104px;object-fit:cover}

/* --- markdown renderizado --- */
.md{font-size:13.5px;line-height:1.6;color:var(--ink2)}
.md > :first-child{margin-top:0}
.md > :last-child{margin-bottom:0}
.md p{margin:0 0 9px}
.md h3{font-size:16px;margin:16px 0 7px;color:var(--ink)}
.md h4{font-size:14.5px;margin:14px 0 6px;color:var(--ink)}
.md h5{font-size:13px;margin:12px 0 5px;color:var(--ink)}
.md ul,.md ol{margin:0 0 9px;padding-left:21px}
.md li{margin-bottom:3px}
.md a{color:var(--gold)}
.md code{font-family:"JetBrains Mono",monospace;font-size:11.5px;background:var(--surf);
    border:1px solid var(--modal-line,var(--line));border-radius:4px;padding:1px 5px}
.md .md-pre{background:var(--surf);border:1px solid var(--modal-line,var(--line));border-radius:7px;
    padding:11px 13px;overflow-x:auto;margin:0 0 10px}
.md .md-pre code{border:0;background:none;padding:0;font-size:12px;line-height:1.5}
.md blockquote{margin:0 0 9px;padding:2px 0 2px 13px;border-left:3px solid var(--goldln);
    color:var(--ink3)}
.md hr{border:0;border-top:1px solid var(--modal-line,var(--line));margin:14px 0}
.md del{color:var(--ink3)}
.cm-desc.md:empty::before{content:attr(data-empty);color:var(--ink3);font-size:13px}

/* --- caixa de escrita da descricao --- */
.cm-edit textarea{width:100%;min-height:130px;font-family:"JetBrains Mono",monospace;
    font-size:12.5px;line-height:1.55;resize:vertical}

/* --- historico do cartao --- */
.hist{margin-top:20px;border-top:1px solid var(--modal-line,var(--line));padding-top:12px}
.hist > summary{list-style:none;cursor:pointer;font:600 10.5px/1 inherit;letter-spacing:.09em;
    text-transform:uppercase;color:var(--ink3);padding:3px 0}
.hist > summary::-webkit-details-marker{display:none}
.hist > summary:hover{color:var(--ink)}
.hist-i{display:flex;gap:8px;align-items:baseline;padding:5px 0;font-size:12px;
    border-bottom:1px solid var(--modal-line,var(--line))}
.hist-i:last-child{border-bottom:0}
.hist-i .q{color:var(--ink);font-weight:500;flex:none}
.hist-i .o{color:var(--ink3);flex:1;min-width:0}
.hist-i .d{color:var(--ink3);font-family:"JetBrains Mono",monospace;font-size:10.5px;flex:none}

/* --- coluna sendo arrastada --- */
.kb-col.drag{opacity:.45}
.kb-h[draggable="true"]{cursor:grab}
.kb-h[draggable="true"]:active{cursor:grabbing}

/* --- linha de arquivado --- */
.card.arq{display:flex;align-items:center;gap:16px;padding:13px 16px;margin-bottom:9px}