:root{
  --navy:#192C52; --teal:#3E9BA3; --teal-deep:#2B7A82; --orange:#FF5000;
  --bg:#F4F7F8; --bg2:#FFFFFF; --bg3:#E8F0F2; --ink:#15213A; --ink2:#48586F; --ink3:#7A889C; --line:#D5DFE4; --line2:#BFCCD4;
  --good:#2E8B57; --good-s:#E3F3EA; --warn:#B8860B; --warn-s:#FBF1D9; --crit:#B83227; --crit-s:#F9E3E0; --accent-s:#E2F1F2;
  --r:8px; --fd:"Bricolage Grotesque","IBM Plex Sans",system-ui,sans-serif; --fb:"IBM Plex Sans",system-ui,-apple-system,"Segoe UI",sans-serif;
  color-scheme:light;
}
@media (prefers-color-scheme: dark){ :root{ --bg:#0E1524; --bg2:#141D30; --bg3:#1B2740; --ink:#E8EEF4; --ink2:#B6C2D2; --ink3:#8593A8; --line:#26334B; --line2:#33425C; --navy:#DCE6F5; --teal:#5FBCC3; --teal-deep:#7CCBD1; --good:#5CC48A; --good-s:#163526; --warn:#E0B24A; --warn-s:#3A2F12; --crit:#F0766B; --crit-s:#3E1A17; --accent-s:#173A40; color-scheme:dark; } }
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--fb);font-size:15.5px;line-height:1.5;-webkit-font-smoothing:antialiased}
a{color:var(--teal-deep)}
h1,h2,h3{font-family:var(--fd);color:var(--navy);margin:0;line-height:1.15;text-wrap:balance}
h1{font-size:clamp(24px,3.6vw,34px);font-weight:800} h2{font-size:20px;font-weight:800} h3{font-size:16px;font-weight:600}
button,input,select,textarea{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--teal);outline-offset:2px}
.top{position:sticky;top:0;z-index:10;background:var(--bg2);border-bottom:1px solid var(--line)}
.top-in{max-width:1180px;margin:0 auto;padding:0 clamp(16px,3vw,28px);min-height:56px;display:flex;align-items:center;gap:16px}
.brand{display:flex;align-items:center;gap:10px;font-family:var(--fd);font-weight:800;font-size:18px;color:var(--navy);text-decoration:none;white-space:nowrap}
.brand .dot{width:10px;height:10px;border-radius:50%;background:var(--teal)} .brand .sub{font-family:var(--fb);font-weight:500;font-size:12.5px;color:var(--ink3)}
.nav{margin-left:auto;display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.nav a{color:var(--ink2);text-decoration:none;padding:8px 10px;border-radius:var(--r);font-weight:500}
.nav a.on{background:var(--accent-s);color:var(--navy);font-weight:600}
.who{font-size:12.5px;color:var(--ink3);margin:0 6px}
.wrap{max-width:1180px;margin:0 auto;padding:clamp(16px,3vw,28px)}
.loading{color:var(--ink3);padding:40px 0}
.btn{appearance:none;border:1px solid var(--teal);background:var(--teal);color:#fff;border-radius:var(--r);padding:9px 14px;font-weight:600;cursor:pointer;display:inline-flex;align-items:center;gap:8px}
.btn:hover{filter:brightness(.95)} .btn:disabled{opacity:.6;cursor:not-allowed}
.btn.ghost{background:transparent;color:var(--ink2);border-color:var(--line2)} .btn.ghost:hover{color:var(--ink);background:var(--bg3)}
.btn.small{padding:6px 10px;font-size:13px} .btn.danger{background:var(--crit);border-color:var(--crit)} .btn.rec{background:var(--orange);border-color:var(--orange)}
.card{background:var(--bg2);border:1px solid var(--line);border-radius:var(--r);padding:16px}
.login{max-width:420px;margin:8vh auto 0}
.login h1{margin-bottom:6px} .login p{color:var(--ink2);margin:0 0 18px}
.field{display:grid;gap:5px;margin:0 0 12px} .field label{font-size:12.5px;font-weight:600;color:var(--ink2);letter-spacing:.02em}
.field input,.field select,.field textarea{padding:10px 12px;border:1px solid var(--line2);border-radius:var(--r);background:var(--bg2);color:var(--ink);width:100%}
.field textarea{min-height:120px;resize:vertical}
.err{color:var(--crit);font-size:13.5px;margin:6px 0 0}
.hint{color:var(--ink3);font-size:12.5px}
.tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:10px;margin:14px 0 18px}
.tile{background:var(--bg2);border:1px solid var(--line);border-radius:var(--r);padding:12px 14px;text-decoration:none;color:inherit;display:grid;gap:4px}
.tile:hover{border-color:var(--teal)} .tile .n{font-family:var(--fd);font-size:24px;font-weight:800;color:var(--navy);font-variant-numeric:tabular-nums}
.tile .l{font-size:13px;color:var(--ink2);font-weight:600} .tile .s{font-size:12px;color:var(--ink3)}
.bar{height:6px;background:var(--bg3);border-radius:3px;overflow:hidden} .bar i{display:block;height:100%;background:var(--teal)}
.filters{display:flex;flex-wrap:wrap;gap:8px;margin:10px 0 14px;align-items:center}
.filters select,.filters input{padding:8px 10px;border:1px solid var(--line2);border-radius:var(--r);background:var(--bg2);color:var(--ink);min-width:150px}
.filters input{flex:1;min-width:200px}
.count{font-size:13px;color:var(--ink3);margin:0 0 8px}
.q{display:grid;gap:6px;background:var(--bg2);border:1px solid var(--line);border-radius:var(--r);padding:12px 14px;margin:0 0 8px;text-decoration:none;color:inherit}
.q:hover{border-color:var(--teal)}
.q .h{display:flex;flex-wrap:wrap;gap:6px;align-items:center;font-size:12px;color:var(--ink3)}
.q .t{font-weight:600;color:var(--navy);font-size:15px}
.q .m{display:flex;gap:10px;font-size:12.5px;color:var(--ink3)}
.pill{display:inline-block;font-size:11px;font-weight:700;letter-spacing:.04em;padding:2px 8px;border-radius:999px;text-transform:uppercase;white-space:nowrap}
.pill.bloqueante{background:var(--crit-s);color:var(--crit)} .pill.alta{background:var(--warn-s);color:var(--warn)} .pill.media,.pill.baixa{background:var(--bg3);color:var(--ink2)}
.pill.st{background:var(--bg3);color:var(--ink2);text-transform:none;letter-spacing:0;font-weight:600} .pill.st.respondida{background:var(--accent-s);color:var(--navy)} .pill.st.decidida,.pill.st.implementada{background:var(--good-s);color:var(--good)}
.pill.mod{background:transparent;border:1px solid var(--line2);color:var(--ink3);text-transform:none;letter-spacing:0;font-weight:500}
.detail h1{font-size:clamp(20px,2.6vw,26px);margin:8px 0 12px}
.meta{display:flex;flex-wrap:wrap;gap:6px;align-items:center;font-size:12.5px;color:var(--ink3)}
.kv{display:grid;gap:10px;margin:14px 0}
.kv .k{font-size:11.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--ink3);margin-bottom:2px}
.kv .v{color:var(--ink2)}
.opts{display:grid;gap:6px;margin:6px 0 0}
.opts label{display:flex;gap:10px;align-items:flex-start;background:var(--bg3);border:1px solid var(--line);border-radius:var(--r);padding:8px 10px;cursor:pointer}
.opts input{margin-top:3px}
.thread{display:grid;gap:10px;margin:14px 0}
.ans{background:var(--bg2);border:1px solid var(--line);border-radius:var(--r);padding:12px 14px}
.ans .by{font-size:12.5px;color:var(--ink3);margin-bottom:4px} .ans .by b{color:var(--ink)}
.ans p{margin:0;white-space:pre-wrap}
.atts{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}
.atts img{max-width:260px;max-height:200px;border-radius:6px;border:1px solid var(--line)}
.atts audio{max-width:320px}
.atts a{font-size:13px}
.decision{border-left:3px solid var(--good);background:var(--good-s);padding:10px 12px;border-radius:0 var(--r) var(--r) 0}
.form{display:grid;gap:10px;margin-top:14px}
.form .row{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.rec{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.rec .time{font-variant-numeric:tabular-nums;color:var(--ink2)}
.files{display:flex;flex-wrap:wrap;gap:6px}
.files span{font-size:12.5px;background:var(--bg3);border:1px solid var(--line);border-radius:999px;padding:2px 9px}
.files span button{border:0;background:none;cursor:pointer;color:var(--crit);margin-left:4px}
.toast{position:fixed;left:50%;bottom:22px;transform:translateX(-50%);background:var(--navy);color:#fff;padding:10px 16px;border-radius:var(--r);box-shadow:0 8px 24px rgba(0,0,0,.2);font-size:14px;z-index:50;max-width:90vw}
table{border-collapse:collapse;width:100%;font-size:13.5px} th,td{padding:8px 10px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top} th{color:var(--navy);font-size:12.5px;background:var(--bg3)}
.tbl{overflow-x:auto;border:1px solid var(--line);border-radius:var(--r);background:var(--bg2)}
.grid2{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:14px}
.chk{display:flex;flex-wrap:wrap;gap:8px} .chk label{display:flex;gap:6px;align-items:center;font-size:13.5px;background:var(--bg3);border:1px solid var(--line);border-radius:999px;padding:4px 10px;cursor:pointer}
.back{font-size:13.5px;color:var(--ink3);text-decoration:none} .back:hover{color:var(--ink)}
.empty{color:var(--ink3);padding:20px 0}
@media (max-width:640px){ .top-in{flex-wrap:wrap;padding-block:8px;gap:6px} .brand .sub{display:none} .nav{margin-left:0;width:100%;flex-wrap:nowrap;overflow-x:auto;gap:2px;scrollbar-width:none} .nav a{padding:6px 8px;font-size:14px;white-space:nowrap} .nav .who{display:none} .tiles{grid-template-columns:1fr 1fr} .filters select,.filters input{min-width:0;flex:1 1 45%} .atts img{max-width:100%} }