/* Identidade ShieldSign: marrom #59492f e amarelo #faa61a */
:root { --brown:#59492f; --brown-dark:#3f3321; --yellow:#faa61a; --yellow-dark:#d98a0a; --link:#8a5a00; --on-yellow:#2b1d00;
  --navy:var(--brown); --blue:var(--brown); --orange:var(--yellow); --green:#3f8f4b; --red:#c0392b; --bg:#fff; --fg:#2b2518; --muted:#7b7263; --line:#e4dccb; --soft:#f6f2ea; }
:root { color-scheme: light; }
* { box-sizing: border-box; }
body { margin:0; font:14px/1.45 system-ui, "Segoe UI", sans-serif; color:var(--fg); background:var(--bg); }
a { color:var(--link); text-decoration:none; } a:hover { text-decoration:underline; }
code { background:var(--soft); padding:1px 5px; border-radius:3px; word-break:break-all; }
h1 { font-size:26px; font-weight:400; margin:18px 0 12px; } h2 { font-size:20px; font-weight:400; margin:26px 0 10px; } h3 { margin:0 0 10px; } h4 { margin:16px 0 0; font-size:14px; }
.muted { color:var(--muted); } .center { text-align:center; }
nav.top { background:var(--brown); color:#fff; display:flex; align-items:center; gap:4px; padding:0 20px; flex-wrap:wrap; border-bottom:3px solid var(--yellow); }
nav.top .brand { font-weight:700; letter-spacing:.12em; margin-right:18px; padding:10px 0; color:#fff; display:inline-flex; align-items:center; gap:10px; }
nav.top .brand img { width:28px; height:28px; }
nav.top a { color:#fff; padding:15px 9px; display:inline-block; white-space:nowrap; } nav.top a:hover, nav.top a.active { background:var(--brown-dark); text-decoration:none; box-shadow:inset 0 -3px 0 var(--yellow); }
nav.top .spacer { flex:1; } nav.top a.who { opacity:.85; max-width:230px; overflow:hidden; text-overflow:ellipsis; font-size:13px; }
.banner { background:#fff7e6; border-bottom:1px solid #f0d9a8; padding:8px 20px; }
main { max-width:1160px; margin:0 auto; padding:0 20px 60px; }
.panel { border:1px solid var(--blue); border-radius:3px; margin:14px 0; } .panel > .head { background:var(--brown); color:#fff; border-bottom:3px solid var(--yellow); padding:12px 16px; font-size:16px; }
.panel > .body { padding:16px; display:flex; gap:20px; justify-content:space-between; flex-wrap:wrap; }
.cards { display:grid; grid-template-columns:repeat(auto-fit,minmax(210px,1fr)); gap:14px; margin:10px 0; align-items:start; }
.card { border:1px solid var(--orange); border-radius:3px; overflow:hidden; } .card.green { border-color:var(--green); }
.card .top { background:var(--yellow); color:var(--on-yellow); padding:14px 16px; display:flex; justify-content:space-between; align-items:center; gap:10px; min-height:84px; }
.card.green .top { background:var(--green); color:#fff; } .card .num { font-size:32px; } .card .lbl { text-align:right; }
.card .icon { font-size:30px; opacity:.9; }
.card .num.long { font-size:22px; line-height:1.2; } .card .cap { overflow-wrap:anywhere; font-size:13px; }
.btn { border:1px solid #d6ccb6; background:linear-gradient(#fff,#f1ebdd); border-radius:3px; padding:8px 14px; cursor:pointer; font:inherit; color:var(--fg); }
.btn:hover:not(:disabled) { background:#efe6d2; border-color:var(--yellow); } .btn:disabled { opacity:.55; cursor:default; }
.btn.primary { background:var(--yellow); border-color:var(--yellow-dark); color:var(--on-yellow); font-weight:600; } .btn.primary:hover:not(:disabled) { background:var(--yellow-dark); }
.btn.danger { background:var(--red); border-color:#962d22; color:#fff; } .btn.danger:hover:not(:disabled) { background:#962d22; }
.btn.small { padding:3px 9px; font-size:12px; } .btn.wide { padding:12px 22px; font-size:16px; }
.table-wrap { overflow-x:auto; } table { border-collapse:collapse; width:100%; }
th { text-align:left; background:var(--soft); border-bottom:1px solid var(--line); padding:8px; white-space:nowrap; } td { padding:8px; border-bottom:1px solid var(--line); vertical-align:top; }
tr:nth-child(even) td { background:#fcfaf6; } td.num, th.num { text-align:right; }
.mono { font-family:ui-monospace, Consolas, monospace; font-size:12px; }
.yes { color:var(--green); font-weight:700; } .no { color:var(--red); font-weight:700; }
.badge { display:inline-block; padding:2px 8px; border-radius:10px; font-size:12px; background:#e5e7eb; color:#374151; }
.badge.ok { background:#dcfce7; color:#166534; } .badge.err { background:#fee2e2; color:#991b1b; } .badge.warn { background:#fef3c7; color:#92400e; }
.tabs { display:flex; border-bottom:1px solid var(--line); margin:14px 0; } .tabs button { background:none; border:0; border-bottom:3px solid transparent; padding:10px 22px; cursor:pointer; font:inherit; color:var(--link); }
.tabs button.on { border-bottom-color:var(--yellow); color:var(--fg); font-weight:600; }
.filters { display:flex; gap:24px; flex-wrap:wrap; align-items:center; margin:10px 0; } .filters .group { display:flex; align-items:center; gap:8px; } .filters .group > span { font-weight:600; }
.seg { display:inline-flex; } .seg button { border:1px solid #d6ccb6; background:#fff; padding:6px 12px; cursor:pointer; font:inherit; margin-left:-1px; } .seg button.on { background:var(--brown); color:#fff; border-color:var(--brown-dark); }
.pager { display:flex; justify-content:space-between; align-items:center; margin:12px 0; flex-wrap:wrap; gap:8px; }
.pager .btn { margin-right:2px; }
.field { display:block; margin:10px 0; } .field > span { display:block; font-weight:600; margin-bottom:3px; } .field small { display:block; margin-top:2px; }
input[type=text], input[type=email], input[type=password], input[type=number], select { width:100%; padding:8px; border:1px solid #d6ccb6; border-radius:3px; font:inherit; }
input:focus, select:focus { outline:2px solid var(--yellow); border-color:var(--yellow); }
.auth { max-width:420px; margin:70px auto; padding:26px; border:1px solid var(--line); border-radius:6px; box-shadow:0 4px 18px #0001; }
.auth { border-top:4px solid var(--yellow); } .auth h1 { text-align:center; font-size:22px; margin-top:0; } .auth .brand { text-align:center; color:var(--brown); font-weight:700; letter-spacing:.14em; margin-bottom:6px; }
.auth .brand img { display:block; margin:0 auto 8px; width:64px; height:64px; }
.err-text { color:var(--red); margin:8px 0; } .ok-text { color:var(--green); }
.overlay { position:fixed; inset:0; background:#0007; display:flex; align-items:center; justify-content:center; z-index:50; padding:16px; }
.modal { background:#fff; border-radius:6px; padding:20px; width:min(560px,100%); max-height:90vh; overflow:auto; } .modal .actions { display:flex; justify-content:flex-end; gap:8px; margin-top:16px; }
.secret { display:flex; gap:8px; align-items:center; background:var(--soft); border:1px dashed #bfb39a; padding:10px; border-radius:4px; margin:8px 0; } .secret code { flex:1; background:none; }
.warn-box { background:#fff4de; border:1px solid #f4d49b; border-left:4px solid var(--yellow); padding:10px 12px; border-radius:4px; margin:10px 0; }
.toast { position:fixed; right:18px; bottom:18px; padding:11px 16px; border-radius:4px; color:#fff; z-index:60; max-width:420px; } .toast.ok { background:#166534; } .toast.err { background:#991b1b; }
.row { display:flex; gap:10px; align-items:center; flex-wrap:wrap; } .right { margin-left:auto; }
.qr { display:block; margin:10px auto; image-rendering:pixelated; width:200px; height:200px; }
.totals td { font-weight:600; background:var(--soft) !important; }
@media (max-width:640px) { nav.top a { padding:10px 8px; } .panel > .body { flex-direction:column; } }
