:root{
    --ink:#17324d;
    --ink-2:#234967;
    --accent:#315f78;
    --accent-soft:#eaf2f5;
    --green:#3f8b68;
    --green-soft:#eaf6f0;
    --amber:#b98332;
    --amber-soft:#fff5e5;
    --red:#b85a5a;
    --red-soft:#fff0f0;
    --cream:#f7f6f2;
    --surface:#ffffff;
    --surface-2:#fbfaf7;
    --line:#e6e5e0;
    --line-2:#efeee9;
    --text:#243444;
    --muted:#7b8792;
    --shadow:0 8px 28px rgba(24,42,57,.055);
    --radius:14px;
}

*{box-sizing:border-box}

html{scroll-behavior:smooth}

body{
    margin:0;
    font-family:Inter,Segoe UI,Arial,sans-serif;
    color:var(--text);
    background:var(--cream);
    font-size:13px;
}

button,input,select,textarea{font:inherit}
button{cursor:pointer}

button:focus,
input:focus,
select:focus,
textarea:focus{
    outline:3px solid rgba(49,95,120,.10);
    border-color:#aebfc8!important;
}

/* =========================
   SIDEBAR
========================= */

.side{
    position:fixed;
    inset:0 auto 0 0;
    width:248px;
    background:#fff;
    border-right:1px solid var(--line);
    padding:20px 14px;
    display:flex;
    flex-direction:column;
    z-index:20;
}

.brand{
    display:flex;
    align-items:center;
    gap:11px;
    padding:2px 9px 21px;
    border-bottom:1px solid var(--line-2);
}

.brand img{
    width:48px;
    height:48px;
    object-fit:contain;
}

.brand b{
    display:block;
    font-size:17px;
    color:var(--ink);
    letter-spacing:-.02em;
}

.brand small{
    display:block;
    margin-top:3px;
    color:#9aa1a5;
    font-size:7px;
    line-height:1.35;
    letter-spacing:.13em;
    max-width:140px;
}

.label{
    font-size:8px;
    font-weight:800;
    color:#a1a7aa;
    letter-spacing:.16em;
    padding:20px 10px 7px;
}

.nav{
    border:0;
    background:transparent;
    width:100%;
    text-align:left;
    padding:10px 11px;
    border-radius:9px;
    color:#68747e;
    margin:1px 0;
    transition:.18s ease;
    display:flex;
    align-items:center;
    gap:9px;
}

.nav:hover{
    background:#f4f6f6;
    color:var(--ink);
}

.nav.active{
    background:var(--accent-soft);
    color:var(--ink);
    font-weight:700;
}

.nav .nav-count{
    margin-left:auto;
    font-size:9px;
    color:#9ca5aa;
}

.bottom{
    margin-top:auto;
}

.support{
    background:#f7f8f7;
    border:1px solid var(--line);
    border-radius:11px;
    padding:11px;
    font-size:10px;
    color:#6e7a82;
}

.support b{
    color:var(--ink);
}

.user{
    display:flex;
    gap:9px;
    align-items:center;
    padding:14px 4px 0;
}

.avatar{
    width:34px;
    height:34px;
    border-radius:50%;
    background:var(--ink);
    color:#fff;
    display:grid;
    place-items:center;
    font-weight:700;
    font-size:11px;
}

.user b{
    color:var(--ink);
    font-size:11px;
}

/* =========================
   MAIN
========================= */

.main{
    margin-left:248px;
    min-height:100vh;
    width:calc(100% - 248px);
    box-sizing:border-box;
}

.top{
    height:72px;
    background:rgba(255,255,255,.96);
    border-bottom:1px solid var(--line);
    display:flex;
    align-items:center;
    gap:14px;
    padding:0 30px;
    position:sticky;
    top:0;
    z-index:10;
    backdrop-filter:blur(10px);
}

.top-title{
    min-width:180px;
}

.top-title strong{
    display:block;
    color:var(--ink);
    font-size:13px;
}

.top-title small{
    color:#9aa1a5;
    font-size:9px;
}

.context{
    display:flex;
    align-items:center;
    gap:8px;
    margin-left:auto;
}

.context-label{
    color:#8d979d;
    font-size:9px;
}

.library-filter{
    min-width:225px;
    border:1px solid var(--line);
    border-radius:9px;
    padding:9px 12px;
    background:#fff;
    color:var(--ink);
    font-weight:600;
    font-size:10px;
}

.period{
    border:1px solid var(--line);
    padding:9px 11px;
    border-radius:9px;
    color:#78838a;
    font-size:9px;
    background:#fff;
}

.content{
    padding:28px 32px 40px;
    width:100%;
    max-width:none;
    margin:0;
    box-sizing:border-box;
}

.page{display:none}
.page.active{display:block}

#acervo.page.active{
    display:flex;
    flex-direction:column;
    min-height:calc(100vh - 72px - 56px);
}

#acervo .panel.acervo-panel{
    flex:1;
    width:100%;
    min-height:calc(100vh - 290px);
    display:flex;
    flex-direction:column;
    overflow:auto;
}

#acervo .table{
    width:100%;
    table-layout:auto;
}

#acervo .toolbar{
    width:100%;
}

#acervo .toolbar .search{
    flex:1;
    min-width:220px;
}

.heading{
    display:flex;
    justify-content:space-between;
    gap:20px;
    align-items:flex-end;
    margin-bottom:23px;
}

.eyebrow{
    font-size:8px;
    color:#8c969b;
    font-weight:800;
    letter-spacing:.16em;
}

h1{
    font-size:27px;
    line-height:1.1;
    letter-spacing:-.035em;
    color:var(--ink);
    margin:5px 0 6px;
}

h3{
    color:var(--ink);
    margin:0;
    font-size:13px;
}

p{
    color:var(--muted);
    margin:0;
    font-size:10px;
    line-height:1.5;
}

.primary,
.outline{
    border-radius:9px;
    padding:10px 13px;
    font-size:10px;
    font-weight:700;
    transition:.18s ease;
}

.primary{
    background:var(--ink);
    color:#fff;
    border:1px solid var(--ink);
}

.primary:hover{
    background:#244965;
    transform:translateY(-1px);
}

.outline{
    background:#fff;
    color:#596872;
    border:1px solid var(--line);
}

.outline:hover{
    background:#f8f8f6;
    border-color:#cfd3d2;
}

/* =========================
   CONTEXT BANNER
========================= */

.context-banner{
    background:var(--surface);
    border:1px solid var(--line);
    border-radius:var(--radius);
    padding:13px 16px;
    margin-bottom:17px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:15px;
    box-shadow:0 4px 18px rgba(24,42,57,.025);
}

.context-main{
    display:flex;
    align-items:center;
    gap:11px;
}

.context-dot{
    width:9px;
    height:9px;
    border-radius:50%;
    background:var(--green);
}

.context-main strong{
    color:var(--ink);
    font-size:11px;
}

.context-main span{
    color:#91999d;
    font-size:9px;
    margin-left:5px;
}

/* =========================
   STATS
========================= */

.stats{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:13px;
    margin-bottom:15px;
}

.card,
.panel{
    background:var(--surface);
    border:1px solid var(--line);
    border-radius:var(--radius);
    padding:17px;
    box-shadow:var(--shadow);
}

.stat-card{
    position:relative;
    overflow:hidden;
}

.stat-card:after{
    content:"";
    position:absolute;
    width:70px;
    height:70px;
    right:-30px;
    top:-30px;
    border-radius:50%;
    background:var(--accent-soft);
}

.mut{
    font-size:9px;
    color:#8b959b;
}

.stat{
    font-size:25px;
    font-weight:800;
    letter-spacing:-.04em;
    color:var(--ink);
    margin:7px 0 5px;
}

.delta{
    font-size:9px;
}

.delta.ok{color:var(--green)}
.delta.warn{color:var(--amber)}
.delta.bad{color:var(--red)}

.grid2{
    display:grid;
    grid-template-columns:1.45fr 1fr;
    gap:15px;
    margin-bottom:15px;
}

.grid3{
    display:grid;
    grid-template-columns:1.45fr 1fr;
    gap:15px;
}

.panel-head{
    display:flex;
    justify-content:space-between;
    align-items:flex-start;
    margin-bottom:13px;
}

.panel-head .sub{
    margin-top:3px;
}

/* =========================
   CHART
========================= */

.chart-wrap{
    height:225px;
    position:relative;
}

.chart{
    width:100%;
    height:100%;
}

.chart-grid{
    stroke:#edf0ef;
    stroke-width:1;
}

.chart-line{
    fill:none;
    stroke:var(--accent);
    stroke-width:3;
    stroke-linecap:round;
    stroke-linejoin:round;
}

.chart-line-2{
    fill:none;
    stroke:#b8c8cf;
    stroke-width:2.5;
    stroke-linecap:round;
    stroke-linejoin:round;
}

.chart-label{
    font-size:8px;
    fill:#a0a8ac;
}

/* =========================
   STATUS
========================= */

.network-list{
    margin-top:18px;
}

.network-row{
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding:11px 0;
    border-bottom:1px solid var(--line-2);
}

.network-row:last-child{
    border-bottom:0;
}

.network-label{
    display:flex;
    align-items:center;
    gap:8px;
    color:#66737b;
    font-size:10px;
}

.status-dot{
    width:7px;
    height:7px;
    border-radius:50%;
}

.status-dot.green{background:var(--green)}
.status-dot.amber{background:var(--amber)}
.status-dot.red{background:var(--red)}

.network-row b{
    color:var(--ink);
}

.progress{
    height:6px;
    background:#edf0ef;
    border-radius:20px;
    overflow:hidden;
    margin-top:16px;
}

.progress i{
    display:block;
    height:100%;
    background:var(--green);
    border-radius:20px;
}

/* =========================
   TABLE
========================= */

.table{
    width:100%;
    border-collapse:collapse;
    font-size:10px;
}

.table th{
    text-align:left;
    color:#9aa2a6;
    font-size:8px;
    font-weight:700;
    padding:10px 9px;
    border-bottom:1px solid var(--line);
    white-space:nowrap;
}

.table td{
    padding:12px 9px;
    border-bottom:1px solid var(--line-2);
    color:#5e6b74;
    vertical-align:middle;
}

.table tbody tr:hover{
    background:#fcfcfa;
}

.table td b{
    color:var(--ink);
}

.mini{
    font-size:8px;
    color:#a0a7aa;
}

.badge{
    display:inline-flex;
    align-items:center;
    gap:4px;
    padding:4px 8px;
    border-radius:20px;
    font-size:8px;
    font-weight:700;
}

.badge.ok{
    background:var(--green-soft);
    color:var(--green);
}

.badge.warn{
    background:var(--amber-soft);
    color:var(--amber);
}

.badge.bad{
    background:var(--red-soft);
    color:var(--red);
}

.badge.neutral{
    background:#f1f3f3;
    color:#727d82;
}

/* =========================
   ATTENTION
========================= */

.attention{
    border-left:3px solid var(--amber);
}

.attention-list{
    display:flex;
    flex-direction:column;
    gap:9px;
}

.attention-item{
    border:1px solid var(--line-2);
    border-radius:10px;
    padding:11px;
    display:flex;
    align-items:center;
    gap:10px;
}

.attention-icon{
    width:30px;
    height:30px;
    border-radius:9px;
    background:var(--amber-soft);
    display:grid;
    place-items:center;
    color:var(--amber);
}

.attention-item strong{
    display:block;
    color:var(--ink);
    font-size:10px;
}

.attention-item span{
    display:block;
    color:#969fa3;
    font-size:8px;
    margin-top:2px;
}

.attention-item button{
    margin-left:auto;
}

/* =========================
   ACTIVITY
========================= */

.activity{
    display:flex;
    flex-direction:column;
}

.activity-item{
    display:flex;
    gap:10px;
    padding:10px 0;
    border-bottom:1px solid var(--line-2);
}

.activity-item:last-child{
    border-bottom:0;
}

.activity-dot{
    width:7px;
    height:7px;
    border-radius:50%;
    background:var(--accent);
    margin-top:4px;
}

.activity-item strong{
    display:block;
    font-size:9px;
    color:var(--ink);
}

.activity-item span{
    display:block;
    font-size:8px;
    color:#969fa3;
    margin-top:2px;
}

/* =========================
   TOOLBAR
========================= */

.toolbar{
    display:flex;
    gap:8px;
    margin-bottom:14px;
    flex-wrap:wrap;
}

.toolbar input,
.toolbar select,
input,
select,
textarea{
    border:1px solid var(--line);
    border-radius:9px;
    padding:10px;
    outline:none;
    background:#fff;
    color:var(--text);
    font-size:10px;
}

.search{
    flex:1;
    min-width:200px;
}

/* =========================
   LIBRARIES
========================= */

.libraries{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:14px;
}

.library-card{
    position:relative;
    transition:.18s ease;
}

.library-card:hover{
    transform:translateY(-2px);
    box-shadow:0 14px 35px rgba(24,42,57,.08);
}

.library-top{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:10px;
}

.library-mark{
    width:38px;
    height:38px;
    border-radius:10px;
    background:var(--accent-soft);
    color:var(--accent);
    display:grid;
    place-items:center;
    font-weight:800;
    font-size:11px;
}

.library-name{
    margin-top:13px;
    font-size:14px;
    color:var(--ink);
}

.library-city{
    margin-top:3px;
}

.library-stats{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:8px;
    margin:18px 0;
}

.library-stats span{
    display:block;
    color:#9aa2a6;
    font-size:8px;
}

.library-stats b{
    display:block;
    color:var(--ink);
    font-size:13px;
    margin-top:3px;
}

.library-actions{
    display:flex;
    gap:7px;
}

/* =========================
   TEAM / REPORTS
========================= */

.team{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:14px;
}

.person{
    text-align:center;
}

.person .avatar{
    margin:0 auto 10px;
}

.person h3{
    margin-bottom:4px;
}

.reports{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:14px;
}

.report-card{
    min-height:150px;
    display:flex;
    flex-direction:column;
}

.report-card .outline{
    margin-top:auto;
    align-self:flex-start;
}

/* =========================
   MODAL
========================= */

.toast{
    position:fixed;
    right:22px;
    bottom:22px;
    background:var(--ink);
    color:#fff;
    padding:0;
    border-radius:12px;
    display:none;
    z-index:50;
    box-shadow:0 16px 40px rgba(0,0,0,.2);
    font-size:11px;
    min-width:280px;
    max-width:380px;
    overflow:hidden;
    border:1px solid rgba(255,255,255,.06);
}
.toast.show{
    display:flex;
    align-items:flex-start;
    gap:0;
    animation:toastIn .28s ease;
}
@keyframes toastIn{
    from{opacity:0;transform:translateY(12px)}
    to{opacity:1;transform:translateY(0)}
}
.toast-icon{
    flex:none;
    width:42px;
    align-self:stretch;
    display:grid;
    place-items:center;
    font-weight:800;
    font-size:14px;
    background:rgba(255,255,255,.08);
}
.toast-body{
    padding:12px 14px 12px 0;
    padding-right:14px;
    display:flex;
    flex-direction:column;
    gap:3px;
}
.toast-body strong{
    display:block;
    font-size:12px;
    letter-spacing:-.01em;
}
.toast-body span{
    display:block;
    color:rgba(255,255,255,.78);
    font-size:11px;
    line-height:1.45;
}
.toast-success{background:#1a3d32}
.toast-success .toast-icon{background:#2f7a5b;color:#eafff4}
.toast-error{background:#4a2222}
.toast-error .toast-icon{background:#a34848;color:#fff}
.toast-warn{background:#4a3a1c}
.toast-warn .toast-icon{background:#b8892f;color:#fff8e8}
.toast-info{background:#1c3344}
.toast-info .toast-icon{background:#315f78;color:#eaf4f8}

.reader-select{
    width:100%;
    min-height:140px;
    border:1px solid var(--line);
    border-radius:9px;
    padding:6px;
    background:#fff;
}
.reader-select option{padding:6px 8px;border-radius:6px}
.hold-libs{display:flex;flex-direction:column;gap:6px;max-height:340px;overflow:auto;padding-right:4px}
.hold-lib-row{
  display:grid;
  grid-template-columns:18px 1.4fr 70px 70px 70px;
  gap:8px;
  align-items:center;
  padding:8px 10px;
  border:1px solid var(--line);
  border-radius:10px;
  background:#fff;
  font-size:11px;
  color:#54606a;
  font-weight:600;
}
.hold-lib-row input[type="number"],
.hold-lib-row input[type="text"]{
  width:100%;
  border:1px solid var(--line);
  border-radius:7px;
  padding:6px 7px;
  font-size:11px;
}
.hold-head{
  display:grid;
  grid-template-columns:18px 1.4fr 70px 70px 70px;
  gap:8px;
  padding:0 10px 6px;
  color:#9aa1a5;
  font-weight:700;
}
.badge.inactive{background:#eef0f2;color:#6a737a}
.library-filter:disabled{
    opacity:.75;
    cursor:not-allowed;
    background:#f3f5f5;
}

.modal{
    position:fixed;
    inset:0;
    background:rgba(20,34,45,.42);
    display:none;
    align-items:center;
    justify-content:center;
    padding:20px;
    z-index:40;
    backdrop-filter:blur(4px);
}

.modal.open{
    display:flex;
}

.dialog{
    background:#fff;
    border-radius:16px;
    padding:21px;
    width:min(760px,100%);
    max-height:90vh;
    overflow:auto;
    box-shadow:0 25px 70px rgba(20,34,45,.18);
}

.modalhead{
    display:flex;
    justify-content:space-between;
    align-items:flex-start;
    margin-bottom:18px;
}

.modalhead h3{
    font-size:15px;
    margin-bottom:4px;
}

.x{
    border:0;
    background:#f1f2f1;
    border-radius:7px;
    width:30px;
    height:30px;
    color:#657078;
}

.form{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:11px;
}

.field label{
    display:block;
    font-size:8px;
    color:#717b82;
    margin-bottom:5px;
    font-weight:800;
}

.field input,
.field select,
.field textarea{
    width:100%;
}

.field textarea{
    min-height:80px;
    resize:vertical;
}

.full{
    grid-column:1/-1;
}

.actions{
    display:flex;
    justify-content:flex-end;
    gap:8px;
    margin-top:5px;
}

/* =========================
   MOBILE
========================= */

@media(max-width:1050px){
    .side{
        width:220px;
    }

    .main{
        margin-left:220px;
        width:calc(100% - 220px);
    }

    .stats{
        grid-template-columns:1fr 1fr;
    }

    .libraries{
        grid-template-columns:1fr 1fr;
    }

    .team,
    .reports{
        grid-template-columns:1fr 1fr;
    }
}

@media(max-width:800px){
    .side{
        transform:translateX(-100%);
    }

    .main{
        margin-left:0;
        width:100%;
    }

    .top{
        padding:0 16px;
    }

    .content{
        padding:20px 15px;
    }

    .grid2,
    .grid3{
        grid-template-columns:1fr;
    }

    .context-label,
    .period{
        display:none;
    }

    .library-filter{
        min-width:180px;
    }
}

@media(max-width:600px){
    .stats,
    .libraries,
    .team,
    .reports,
    .form{
        grid-template-columns:1fr;
    }

    .heading{
        align-items:flex-start;
        flex-direction:column;
    }

    .top{
        height:auto;
        min-height:65px;
    }

    .top-title{
        min-width:0;
    }

    .context{
        margin-left:auto;
    }

    .library-filter{
        min-width:150px;
        max-width:180px;
    }

    .full{
        grid-column:auto;
    }

    .context-banner{
        align-items:flex-start;
        flex-direction:column;
    }
}


/* ===== SGB 2026 — auth, sync, pesquisa, comprovativos ===== */
#loginScreen{
  position:fixed;inset:0;z-index:100;
  display:flex;align-items:center;justify-content:center;
  background:
    radial-gradient(ellipse at 20% 20%,rgba(49,95,120,.18),transparent 50%),
    radial-gradient(ellipse at 80% 80%,rgba(63,139,104,.12),transparent 45%),
    linear-gradient(160deg,#eef3f5 0%,#f7f6f2 45%,#e8eef1 100%);
  padding:24px;
}
#loginScreen.hidden{display:none}
.login-card{
  width:min(420px,100%);background:#fff;border:1px solid var(--line);
  border-radius:18px;padding:32px 28px;box-shadow:0 24px 60px rgba(24,42,57,.1);
}
.login-brand{display:flex;align-items:center;gap:12px;margin-bottom:22px}
.login-brand .mark{
  width:48px;height:48px;border-radius:12px;
  background:linear-gradient(145deg,#17324d,#315f78);color:#fff;
  display:grid;place-items:center;font-weight:800;font-size:14px;letter-spacing:-.04em;
}
.login-brand b{display:block;font-size:16px;color:var(--ink)}
.login-brand small{display:block;color:var(--muted);font-size:10px;margin-top:3px;letter-spacing:.08em}
.login-card h1{font-size:20px;margin:0 0 6px;color:var(--ink);letter-spacing:-.03em}
.login-card .lead{margin:0 0 18px;color:var(--muted);font-size:12px;line-height:1.5}
.login-card .field{margin-bottom:12px}
.login-card .field label{display:block;font-size:10px;font-weight:700;color:#6b7782;margin-bottom:5px}
.login-card input,.login-card select{
  width:100%;border:1px solid var(--line);border-radius:9px;padding:10px 12px;background:#fff
}
.login-hint{margin-top:14px;padding:10px 12px;background:var(--accent-soft);border-radius:10px;font-size:10px;color:var(--ink-2);line-height:1.45}
.login-error{display:none;margin-bottom:10px;padding:8px 10px;background:var(--red-soft);color:var(--red);border-radius:8px;font-size:11px}
.login-error.show{display:block}
.app-shell.locked .side,.app-shell.locked .main{filter:blur(2px);pointer-events:none}

.sync-bar{
  display:flex;align-items:center;gap:8px;padding:8px 11px;margin-bottom:10px;
  background:#f7f8f7;border:1px solid var(--line);border-radius:10px;font-size:10px;color:#68747e
}
.sync-dot{width:8px;height:8px;border-radius:50%;background:var(--green);flex:none}
.sync-dot.off{background:var(--amber)}
.sync-bar button{margin-left:auto;border:1px solid var(--line);background:#fff;border-radius:7px;padding:5px 8px;font-size:9px;font-weight:700;color:var(--ink)}

.nav[disabled],.nav.is-locked{opacity:.38;pointer-events:none}
.perm-grid{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-top:6px}
.perm-grid label{display:flex;align-items:center;gap:6px;font-size:10px;color:#54606a;font-weight:600}
.boolean-box{
  background:#fff;border:1px solid var(--line);border-radius:12px;padding:14px;margin-bottom:14px
}
.boolean-box code{font-size:10px;background:var(--accent-soft);padding:2px 6px;border-radius:4px;color:var(--ink)}
.search-results .hit{padding:12px 0;border-bottom:1px solid var(--line-2)}
.search-results .hit:last-child{border-bottom:0}
.search-results .hit b{color:var(--ink);font-size:12px}
.search-results .hit span{display:block;color:var(--muted);font-size:10px;margin-top:3px}
.report-builder{display:grid;grid-template-columns:1.2fr 1fr;gap:15px;margin-top:15px}
.report-out{
  background:#fff;border:1px solid var(--line);border-radius:12px;padding:16px;min-height:220px;
  font-size:11px;line-height:1.55;color:#44525c;white-space:pre-wrap
}
.chip-row{display:flex;gap:7px;flex-wrap:wrap;margin-top:10px}
.chip-row .outline.active{background:var(--accent-soft);border-color:#c5d5dd;color:var(--ink);font-weight:700}
.receipt-paper{
  background:#fff;border:1px dashed #c9d0d4;border-radius:12px;padding:18px;font-size:11px;line-height:1.6
}
.receipt-paper h3{margin:0 0 8px;font-size:14px;color:var(--ink)}
.history-item{padding:10px 0;border-bottom:1px solid var(--line-2);font-size:11px}
.history-item:last-child{border-bottom:0}
.history-item strong{display:block;color:var(--ink);margin-bottom:2px}
.badge.inactive{background:#eef0f2;color:#6a737a}
.user-actions{display:flex;gap:6px;margin-top:8px}
.logout-btn{border:0;background:transparent;color:#9aa1a5;font-size:9px;font-weight:700;cursor:pointer;padding:0}
.top-meta{display:flex;align-items:center;gap:10px}
@media(max-width:850px){
  .report-builder{grid-template-columns:1fr}
  .login-card{padding:24px 18px}
}

/* ===== Sincronização Central ===== */
.sync-hero{
  display:flex;justify-content:space-between;gap:16px;align-items:center;
  padding:14px 16px;border:1px solid var(--line);border-radius:12px;
  background:linear-gradient(120deg,#f4f8f9,#fff);margin-bottom:15px;
}
.sync-hero strong{display:block;color:var(--ink);font-size:13px;margin-bottom:4px}
.sync-hero span{display:block;color:var(--muted);font-size:11px;line-height:1.45;max-width:640px}
.sync-hero-meta{font-size:10px;color:#7b8792;white-space:nowrap}
.sync-grid{display:grid;grid-template-columns:1fr 1fr;gap:15px}
.sync-card .sync-steps{display:flex;flex-direction:column;gap:8px;margin:4px 0 14px}
.sync-step{display:flex;gap:10px;align-items:center;font-size:11px;color:#54606a}
.sync-step b{
  width:22px;height:22px;border-radius:50%;display:grid;place-items:center;
  background:var(--accent-soft);color:var(--ink);font-size:10px;flex:none;
}
.sync-form{display:grid;grid-template-columns:1fr 1fr 1fr;gap:10px;margin-bottom:12px}
.sync-form .field label{display:block;font-size:9px;font-weight:700;color:#6b7782;margin-bottom:5px}
.sync-form .field input,.sync-form .field select{
  width:100%;border:1px solid var(--line);border-radius:8px;padding:8px 10px;background:#fff
}
.sync-actions{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:12px}
.sync-file-btn{display:inline-flex;align-items:center;cursor:pointer}
.sync-result{
  background:#f7f8f7;border:1px dashed #d7dcde;border-radius:10px;padding:12px;
  font-size:11px;color:#44525c;line-height:1.55;min-height:72px
}
.sync-progress{margin:8px 0 12px}
.sync-progress-bar{height:8px;background:#eef1f3;border-radius:20px;overflow:hidden;margin-bottom:6px}
.sync-progress-bar i{display:block;height:100%;width:0;background:var(--accent);border-radius:20px;transition:width .25s ease}
.sync-progress span{font-size:10px;color:#7b8792}
@media(max-width:900px){
  .sync-grid{grid-template-columns:1fr}
  .sync-form{grid-template-columns:1fr}
  .sync-hero{flex-direction:column;align-items:flex-start}
}