:root{
    --navy:#003071; --navy-dark:#001f4d; --orange:#ff8732; --green:#4CAF50; --green-dark:#3d8b40;
    --text:#1b2540; --muted:#5a6580; --border:#c8d0e0;
}
*,*::before,*::after{ box-sizing:border-box; margin:0; padding:0; }
body{
    font-family: Inter, system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    background: linear-gradient(160deg, var(--navy) 0%, var(--navy-dark) 100%) fixed;
    color:#fff; min-height:100vh; line-height:1.5; padding-bottom:40px;
}
h2{ color:var(--orange); font-size:1.6rem; line-height:1.2; }
h3{ color:#fff; font-weight:500; font-size:1rem; opacity:.9; }
.page-title{ font-size:1.4rem; font-weight:600; margin-bottom:16px; }
nav{
    display:flex; justify-content:space-between; align-items:center; gap:16px;
    max-width:1100px; margin:0 auto; padding:20px 24px;
}
#logo{ height:auto; width:180px; max-width:45%; object-fit:contain; }
.container{ max-width:640px; margin:0 auto; padding:0 16px; }
.container.narrow{ max-width:420px; }
.container.wide{ max-width:1200px; }
form{
    background:#fff; color:var(--text); border-radius:14px; padding:28px;
    box-shadow:0 12px 40px rgba(0,0,0,.35); margin:8px 0 0;
}
.form-grid{ display:grid; grid-template-columns:repeat(12,1fr); gap:16px 14px; }
.form-group{ grid-column:span 12; min-width:0; display:flex; flex-direction:column; justify-content:flex-end; }
.form-group,.form-grid>.field-error{ grid-column:1 / -1; }
label,.label{ display:block; font-size:.85rem; font-weight:600; color:var(--text); margin-bottom:6px; }
input:not([type=submit]),select,textarea{
    width:100%; height:44px; padding:0 12px; font:inherit; font-size:1rem; color:var(--text);
    background:#fff; border:1px solid var(--border); border-radius:8px;
    transition:border-color .2s, box-shadow .2s;
}
input::placeholder{ color:#8a93a8; }
input:focus{ outline:none; border-color:var(--orange); box-shadow:0 0 0 3px rgba(255,135,50,.35); }
.field-error{ color:#b3261e; font-size:.8rem; margin-top:4px; }
.form-errors, .errorlist{ list-style:none; color:#b3261e; font-size:.85rem; }
.form-errors{ background:#fdecea; border-radius:8px; padding:10px 12px; margin-bottom:16px; }
form p{ margin-bottom:16px; }
form p .errorlist{ margin-bottom:4px; }
#bnt{
    display:block; width:100%; margin:24px 0 0; padding:14px 24px; font:inherit; font-size:1rem; font-weight:700;
    background:var(--green); color:#fff; border:none; border-radius:8px; cursor:pointer;
    box-shadow:0 4px 12px rgba(0,0,0,.2); transition:background-color .2s, transform .2s;
}
#bnt:hover{ background:var(--green-dark); transform:translateY(-2px); }
#bnt:active{ transform:translateY(1px); }
#bnt:focus-visible,a:focus-visible{ outline:3px solid var(--orange); outline-offset:2px; }
.messages{ list-style:none; margin:0 0 16px; }
.messages li{ padding:12px 14px; border-radius:8px; margin-bottom:8px; font-weight:500; }
.messages .success{ background:#d4edda; color:#155724; }
.messages .warning{ background:#fff3cd; color:#664d03; }
.messages .error{ background:#f8d7da; color:#721c24; }
a{ color:#fff; }
.btn-link{
    display:inline-block; margin:0 0 16px; padding:10px 18px; background:var(--green); color:#fff;
    border-radius:8px; text-decoration:none; font-weight:600; transition:background-color .2s;
}
.btn-link:hover{ background:var(--green-dark); }
.table-wrap{ overflow-x:auto; background:#fff; border-radius:12px; box-shadow:0 12px 40px rgba(0,0,0,.35); }
table{ width:100%; border-collapse:collapse; color:var(--text); font-size:.9rem; }
th,td{ padding:10px 14px; text-align:left; white-space:nowrap; border-bottom:1px solid #e3e8f2; }
th{ background:var(--orange); color:#1b1b1b; position:sticky; top:0; font-size:.8rem; text-transform:uppercase; letter-spacing:.03em; }
tbody tr:nth-child(even) td, tr:nth-child(even) td{ background:#f4f6fb; }
tr:hover td{ background:#fff1e6; }
@media (max-width:600px){
    nav{ padding:16px; }
    h2{ font-size:1.3rem; }
    #logo{ width:140px; }
    form{ padding:20px 16px; }
}
.scan-box{ margin-top:8px; }
.btn-scan{
    width:100%; padding:10px 16px; font:inherit; font-weight:600; background:var(--orange); color:#1b1b1b;
    border:none; border-radius:8px; cursor:pointer; transition:filter .2s;
}
.btn-scan:hover{ filter:brightness(.95); }
.btn-scan:disabled{ opacity:.6; cursor:wait; }
.btn-scan:focus-visible{ outline:3px solid var(--orange); outline-offset:2px; }
.scan-preview{ display:block; max-width:100%; max-height:160px; margin:10px auto 0; border-radius:8px; border:1px solid var(--border); }
.scan-preview[hidden],.scan-placeholder[hidden]{ display:none; }
.scan-placeholder{
    display:flex; flex-direction:column; align-items:center; justify-content:center; gap:8px; text-align:center;
    min-height:160px; margin:10px 0 0; padding:16px; color:#666; background:#f4f6fb;
    border:2px dashed var(--border); border-radius:8px;
}
.scan-placeholder svg{ width:48px; height:48px; }
.scan-placeholder p{ margin:0; font-size:.85rem; }
.btn-danger{
    padding:6px 12px; font:inherit; font-size:.85rem; font-weight:600; background:#c62828; color:#fff;
    border:none; border-radius:6px; cursor:pointer; transition:background-color .2s;
}
.btn-danger:hover{ background:#a31f1f; }
.btn-danger:focus-visible{ outline:3px solid var(--orange); outline-offset:2px; }
.scan-status{ font-size:.85rem; margin:6px 0 0; min-height:1.2em; color:var(--text); }
.scan-status.ok{ color:#155724; }
.scan-status.erro{ color:#b3261e; }
.valor-locked{ background:#eee; color:#444; cursor:not-allowed; border-style:dashed; }
.valor-hint{ font-size:.8rem; margin:4px 0 0; color:#666; }
#bnt:disabled{ opacity:.5; cursor:not-allowed; }
form.filtro{
    display:flex; flex-wrap:wrap; align-items:flex-end; gap:12px 16px; margin:0 0 12px; padding:16px;
}
.filtro-campo{ display:flex; flex-direction:column; min-width:150px; }
.filtro-campo label{ margin-bottom:4px; }
.filtro-acoes{ display:flex; align-items:center; gap:12px; }
.btn-filtrar{
    height:44px; padding:0 20px; font:inherit; font-weight:700; background:var(--orange); color:#1b1b1b;
    border:none; border-radius:8px; cursor:pointer; transition:filter .2s;
}
.btn-filtrar:hover{ filter:brightness(.95); }
.btn-filtrar:focus-visible{ outline:3px solid var(--navy); outline-offset:2px; }
.btn-limpar{ color:var(--navy); font-weight:600; padding:10px 4px; }
.filtro-resumo{ margin:0 0 12px; font-size:.9rem; opacity:.9; }
@media (max-width:600px){
    form.filtro{ flex-direction:column; align-items:stretch; }
    .filtro-campo{ min-width:0; }
    .filtro-acoes{ justify-content:space-between; }
    .btn-filtrar{ flex:1; }
}