:root
{
    --ink:#182e3c;
    --muted:#71818e;
    --line:#e6ebee;
    --bg:#f4f6f8;
    --nav:#142b3a;
    --red:#dc4f47;
    --red-dark:#be3c35;
    --green:#25856d;
    --blue:#377ca1;
    --shadow:0 3px 16px #142b3a05;
    font-family:'Segoe UI',Arial,sans-serif;
    color:var(--ink);
    font-size:14px;
    font-synthesis:none
}
*
{
    box-sizing:border-box
}
html,body
{
    margin:0;
    height:100%;
    overflow:hidden
}
body
{
    background:var(--bg)
}
a
{
    color:inherit;
    text-decoration:none
}
a:hover
{
    color:var(--red)
}
button,input,select,textarea
{
    font:inherit
}
button,a,input,select,textarea
{
    outline:none
}
button
{
    cursor:pointer
}
button:disabled
{
    opacity:.45;
    cursor:default
}
input,select,textarea
{
    width:100%;
    border:1px solid #dce3e7;
    border-radius:7px;
    background:white;
    color:var(--ink);
    padding:11px 12px;
    min-height:42px
}
input:focus,select:focus,textarea:focus
{
    border-color:var(--red);
    box-shadow:0 0 0 3px #dc4f4714
}
button:focus-visible,a:focus-visible
{
    box-shadow:0 0 0 3px #dc4f4740
}
input:disabled
{
    background:#f2f5f7;
    color:#87939d
}
textarea
{
    resize:vertical
}
label
{
    display:flex;
    flex-direction:column;
    gap:7px;
    font-weight:600;
    font-size:12px;
    color:#50616d
}
label small
{
    font-weight:400;
    line-height:1.5;
    color:var(--muted)
}
h1,h2,h3,p
{
    margin:0
}
h1
{
    font-size:29px;
    letter-spacing:-.9px;
    font-weight:650;
    line-height:1.25
}
h2
{
    font-size:17px;
    letter-spacing:-.3px;
    font-weight:650
}
h3
{
    font-size:15px
}
small,.small
{
    font-size:12px;
    line-height:1.6
}
p
{
    line-height:1.6
}
svg
{
    flex:none;
    vertical-align:middle
}
.muted
{
    color:var(--muted)
}
.eyebrow
{
    font-size:10px;
    font-weight:750;
    letter-spacing:1.8px;
    color:var(--red);
    margin-bottom:9px
}
.shell
{
    height:100dvh;
    display:grid;
    grid-template-columns:238px minmax(0,1fr);
    overflow:hidden
}
.sidebar
{
    background:var(--nav);
    color:#abc0cd;
    display:flex;
    flex-direction:column;
    min-height:0;
    padding:30px 17px 18px;
    z-index:30
}
.brand
{
    display:flex;
    gap:11px;
    align-items:center;
    color:white;
    padding:0 9px;
    margin-bottom:36px;
    font-size:22px;
    font-weight:650;
    letter-spacing:-.6px
}
.brand:hover
{
    color:white
}
.brand-icon
{
    background:var(--red);
    width:40px;
    height:42px;
    border-radius:11px;
    color:#fff;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    font-size:29px;
    font-weight:750;
    position:relative;
    letter-spacing:-4px;
    padding-right:6px
}
.brand-icon span
{
    position:absolute;
    right:6px;
    bottom:1px;
    font-size:22px;
    color:#142b3a
}
.brand-light
{
    font-weight:350
}
.brand small
{
    display:block;
    letter-spacing:1.5px;
    font-size:7px;
    font-weight:500;
    color:#91a7b6;
    margin-top:4px
}
.nav-caption
{
    font-size:9px;
    letter-spacing:1.5px;
    color:#6e8999;
    font-weight:650;
    padding:4px 15px 10px
}
.sidebar nav
{
    overflow-y:auto;
    scrollbar-width:thin
}
.sidebar nav a
{
    display:flex;
    gap:12px;
    padding:12px 14px;
    margin:3px 0;
    border-radius:7px;
    font-size:13px;
    align-items:center;
    transition:background .15s
}
.sidebar nav a:hover
{
    background:#ffffff08;
    color:white
}
.sidebar nav a.active
{
    background:#dc4f471d;
    color:#ff8880;
    box-shadow:inset 3px 0 var(--red)
}
.sidebar nav .nav-caption
{
    margin-top:26px
}
.sidebar-bottom
{
    margin-top:auto;
    padding:25px 12px 2px;
    font-size:11px;
    border-top:1px solid #ffffff0c
}
.sidebar-bottom small
{
    display:block;
    color:#7691a2;
    font-size:10px;
    margin:9px 0 20px 17px
}
.sidebar-bottom a
{
    display:block;
    font-size:12px
}
.status-dot
{
    display:inline-block;
    width:7px;
    height:7px;
    background:#37b490;
    border-radius:100%;
    box-shadow:0 0 0 4px #37b49012;
    vertical-align:middle;
    margin-right:8px
}
.status-dot.offline
{
    background:#d39a3f;
    box-shadow:0 0 0 4px #d39a3f12
}
.workspace
{
    display:flex;
    flex-direction:column;
    min-width:0;
    min-height:0
}
.topbar
{
    height:76px;
    flex:none;
    background:#fff;
    border-bottom:1px solid var(--line);
    padding:0 34px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:20px;
    z-index:20
}
.topbar-title,.topbar-user
{
    display:flex;
    align-items:center;
    gap:13px;
    font-size:12px
}
.topbar-title strong
{
    font-weight:500
}
.top-divider
{
    color:#d1dade
}
.topbar-user .demo
{
    margin-right:9px
}
.topbar-user form
{
    margin:0
}
.avatar
{
    width:31px;
    height:31px;
    display:grid;
    place-items:center;
    border-radius:100%;
    background:#eef2f5;
    font-weight:700;
    color:#506575
}
.menu-toggle
{
    display:none!important
}
.main-scroll
{
    padding:31px 34px 0;
    overflow:auto;
    flex:1;
    min-height:0;
    scrollbar-color:#c5cfd5 transparent;
    scrollbar-width:thin
}
.page-heading
{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:20px;
    margin-bottom:27px
}
.page-heading p:not(.eyebrow)
{
    font-size:13px;
    color:var(--muted);
    margin-top:8px
}
.toolbar
{
    display:flex;
    gap:10px;
    align-items:center;
    flex-wrap:wrap
}
.button
{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    border:1px solid transparent;
    border-radius:7px;
    padding:11px 16px;
    min-height:41px;
    font-weight:600;
    font-size:12px;
    white-space:nowrap;
    line-height:1.3
}
.button.primary
{
    background:var(--red);
    color:white;
    box-shadow:0 3px 5px #dc4f4715
}
.button.primary:hover
{
    background:var(--red-dark)
}
.button.secondary
{
    background:white;
    border-color:#dce4e9;
    color:#4c626f
}
.button.secondary:hover
{
    border-color:#b9c8d0
}
.button.text
{
    background:transparent;
    color:var(--red)
}
.button.danger-outline
{
    background:#fff;
    border-color:#f0bcb8;
    color:#c4473f
}
.wide
{
    width:100%
}
.icon-button
{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    width:32px;
    height:32px;
    padding:5px;
    border:0;
    background:transparent;
    color:#6f8390;
    border-radius:5px
}
.icon-button:hover
{
    background:#f4f6f8;
    color:var(--red)
}
.row-actions
{
    display:flex;
    justify-content:flex-end;
    gap:3px
}
.align-right
{
    text-align:right
}
.green-text
{
    color:var(--green)
}
.red-text
{
    color:var(--red)
}
.card
{
    background:white;
    border:1px solid var(--line);
    border-radius:11px;
    box-shadow:var(--shadow);
    margin-bottom:22px;
    min-width:0;
    overflow:hidden
}
.card-heading
{
    padding:23px 24px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:16px
}
.card-heading p
{
    font-size:12px;
    color:var(--muted);
    margin-top:5px
}
.card-heading a
{
    font-size:11px;
    color:var(--red);
    font-weight:600
}
.stats-grid
{
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:18px;
    margin-bottom:24px
}
.stat-card
{
    background:#fff;
    border:1px solid var(--line);
    border-radius:10px;
    padding:22px;
    position:relative;
    box-shadow:var(--shadow);
    display:flex;
    flex-direction:column;
    min-width:0
}
.stat-card>span:not(.stat-icon)
{
    font-size:12px;
    color:#667d8a;
    margin-top:19px
}
.stat-card strong
{
    font-size:30px;
    letter-spacing:-1px;
    font-weight:650;
    line-height:1.3;
    margin:7px 0
}
.stat-card small
{
    font-size:10px;
    color:#91a0ab
}
.stat-icon
{
    height:36px;
    width:36px;
    border-radius:10px;
    display:grid;
    place-items:center;
    font-size:21px;
    font-weight:500
}
.red
{
    background:#fff0ef;
    color:var(--red)
}
.amber
{
    background:#fff6e6;
    color:#c99139
}
.green
{
    background:#eaf6f1;
    color:var(--green)
}
.blue
{
    background:#eaf3f9;
    color:var(--blue)
}
.dashboard-grid
{
    display:grid;
    grid-template-columns:minmax(0,1.8fr) minmax(280px,1fr);
    gap:22px
}
.empty
{
    text-align:center;
    padding:45px 20px;
    color:var(--muted);
    font-size:12px
}
.empty>svg
{
    width:33px;
    height:33px;
    color:#b9c8d0;
    margin-bottom:14px
}
.empty h3
{
    color:#536c7b;
    font-size:14px;
    margin-bottom:9px
}
.empty a
{
    display:inline-block;
    margin-top:19px;
    color:var(--red)
}
.system-row
{
    display:flex;
    align-items:center;
    gap:12px;
    margin:0 24px;
    padding:14px 0;
    border-bottom:1px solid #eef1f3;
    font-size:12px;
    color:#728794
}
.system-row strong
{
    margin-left:auto;
    color:#334e5f;
    font-size:11px;
    font-weight:600
}
.info-panel
{
    margin:23px;
    padding:17px;
    border-radius:8px;
    background:#f5f8fa;
    font-size:12px
}
.info-panel p
{
    color:#7e8f9b;
    font-size:11px;
    margin:7px 0 15px
}
.table-wrap
{
    overflow-x:auto
}
table
{
    width:100%;
    border-collapse:collapse;
    text-align:left;
    font-size:12px
}
th
{
    background:#f9fbfc;
    color:#84949e;
    font-size:10px;
    font-weight:600;
    letter-spacing:.3px;
    padding:14px 22px;
    border-top:1px solid #edf1f3;
    border-bottom:1px solid #edf1f3;
    white-space:nowrap
}
td
{
    padding:17px 22px;
    border-bottom:1px solid #f0f3f5;
    vertical-align:middle;
    color:#587080
}
tbody tr:last-child td
{
    border-bottom:0
}
tbody tr:hover
{
    background:#fcfdfe
}
td small
{
    display:block;
    color:#93a1ab;
    font-size:10px;
    margin-top:4px
}
td.amount
{
    color:#2e4858;
    font-weight:650;
    white-space:nowrap
}
.plate
{
    display:inline-block;
    background:#f8fafb;
    color:#1c3444;
    border:1px solid #d7dfe4;
    border-left:5px solid #396caa;
    border-radius:4px;
    padding:6px 12px;
    font-size:19px;
    font-weight:700;
    letter-spacing:2px;
    white-space:nowrap
}
.small-plate
{
    font-size:12px;
    letter-spacing:.8px;
    padding:5px 9px;
    border-left-width:3px
}
.pill
{
    display:inline-flex;
    align-items:center;
    white-space:nowrap;
    border-radius:20px;
    padding:5px 9px;
    font-size:10px;
    font-weight:600;
    line-height:1.2
}
.pill.ativa,.pill.confirmado
{
    background:#eaf6ef;
    color:#33846c
}
.pill.resolvida
{
    background:#edf3f9;
    color:#5385a5
}
.pill.anulada,.pill.dispensado
{
    background:#f0f2f4;
    color:#87939e
}
.pill.pendente
{
    background:#fff0ee;
    color:#d9675d
}
.pill.demo
{
    background:#f5f1e8;
    color:#aa8850;
    font-size:8px;
    letter-spacing:1px
}
.duplicate
{
    color:#bd9857!important
}
.filter-bar
{
    display:flex;
    gap:14px;
    align-items:end;
    padding:22px 24px;
    border-bottom:1px solid var(--line);
    flex-wrap:wrap
}
.filter-bar label
{
    flex:1;
    min-width:115px;
    font-size:10px
}
.filter-bar input,.filter-bar select
{
    font-size:11px;
    min-height:38px;
    padding:9px
}
.filter-bar input[type=date]
{
    min-width:125px
}
.pagination
{
    display:flex;
    justify-content:space-between;
    align-items:center;
    padding:17px 22px;
    border-top:1px solid var(--line);
    font-size:11px;
    color:#7f919d
}
.pagination>div
{
    display:flex;
    align-items:center;
    gap:12px
}
.pagination label
{
    display:flex;
    flex-direction:row;
    align-items:center;
    font-size:11px;
    font-weight:400;
    gap:8px
}
.pagination select
{
    width:67px;
    min-height:32px;
    font-size:11px;
    padding:6px
}
.pagination .button
{
    min-height:30px;
    padding:6px 9px
}
.import-card
{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:25px;
    padding:22px 25px
}
.import-card p
{
    font-size:11px;
    color:var(--muted);
    margin:7px 0
}
.import-card a
{
    font-size:11px;
    color:var(--red)
}
.file-label
{
    font-size:11px;
    max-width:280px
}
.file-label input
{
    font-size:11px
}
.form-card
{
    padding:26px;
    max-width:1000px
}
.form-card h2
{
    margin-bottom:18px
}
.form-grid
{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:22px
}
.form-grid .full
{
    grid-column:1/-1
}
.form-footer
{
    border-top:1px solid var(--line);
    display:flex;
    justify-content:space-between;
    align-items:center;
    margin-top:28px;
    padding-top:23px;
    gap:15px
}
.form-footer>div
{
    display:flex;
    gap:9px
}
.form-card form>label,.login-card form>label,.side-editor>label
{
    margin-bottom:20px
}
.form-card>label
{
    margin-bottom:20px
}
.checkbox
{
    display:flex;
    flex-direction:row;
    align-items:center;
    gap:9px;
    line-height:1.5;
    font-weight:400
}
.checkbox input
{
    width:16px;
    height:16px;
    min-height:0;
    accent-color:var(--red);
    box-shadow:none
}
.checkbox+.checkbox
{
    margin-top:13px
}
fieldset
{
    border:1px solid var(--line);
    border-radius:7px;
    padding:16px;
    margin:23px 0
}
legend
{
    font-size:11px;
    color:#768a97;
    padding:0 6px
}
.detail-grid
{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:27px;
    margin:7px 0 30px
}
.detail-grid dt
{
    font-size:11px;
    color:var(--muted);
    margin-bottom:8px
}
.detail-grid dd
{
    margin:0;
    font-weight:500;
    font-size:14px;
    overflow-wrap:anywhere
}
.editor-grid
{
    display:grid;
    grid-template-columns:minmax(0,1fr) 310px;
    gap:22px;
    align-items:start
}
.side-editor
{
    padding:24px
}
.side-editor h2
{
    margin-bottom:24px
}
.side-editor p
{
    margin-top:19px
}
.side-editor a
{
    font-size:11px;
    color:var(--red);
    display:block;
    margin-top:14px
}
.compact-search
{
    max-width:220px;
    font-size:11px;
    min-height:35px;
    padding:8px
}
.settings-grid
{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:23px;
    align-items:start
}
.settings-grid .form-card
{
    max-width:none
}
.settings-grid p
{
    margin-bottom:20px
}
.message
{
    padding:15px 18px;
    margin-bottom:22px;
    border:1px solid transparent;
    border-radius:8px;
    font-size:12px;
    line-height:1.6;
    overflow-wrap:anywhere
}
.message.error
{
    background:#fff1ef;
    color:#ba443c;
    border-color:#ffddd7
}
.message.success
{
    background:#edf8f0;
    color:#30785a;
    border-color:#d7eddc
}
.message.warning
{
    background:#fffaee;
    color:#9c773b;
    border-color:#f6e8c8
}
.secret
{
    display:block;
    margin:13px 0;
    font-size:13px;
    overflow-wrap:anywhere
}
.validation-errors
{
    font-size:12px;
    color:var(--red);
    padding-left:17px;
    margin-bottom:20px
}
.invalid
{
    border-color:var(--red)
}
.connection
{
    display:flex;
    align-items:center;
    font-size:11px;
    color:#718b7e
}
.monitor-strip
{
    display:flex;
    justify-content:space-between;
    gap:20px;
    padding:15px 22px;
    background:#fff;
    border:1px solid var(--line);
    border-radius:8px;
    margin-bottom:23px;
    color:#85949f;
    font-size:11px
}
.monitor-strip strong
{
    color:var(--red);
    font-size:15px;
    margin-right:6px
}
.waiting
{
    padding:75px 20px;
    text-align:center
}
.waiting h2
{
    margin:25px 0 12px
}
.waiting p
{
    font-size:13px;
    color:var(--muted);
    margin-bottom:22px
}
.radar
{
    width:90px;
    height:90px;
    border-radius:50%;
    background:#eff6f3;
    box-shadow:0 0 0 15px #f7faf8;
    margin:auto;
    display:grid;
    place-items:center;
    color:#4e9a7e
}
.radar svg
{
    width:33px;
    height:33px
}
.alert-card
{
    border:1px solid #edc4bf;
    border-radius:10px;
    background:white;
    margin-bottom:23px;
    overflow:hidden;
    box-shadow:0 4px 18px #be3c3508
}
.alert-top
{
    padding:15px 24px;
    background:#fff3f1;
    display:flex;
    align-items:center;
    justify-content:space-between;
    color:#bd554b
}
.alert-top>span:first-child
{
    display:flex;
    gap:9px;
    align-items:center;
    font-size:10px;
    font-weight:700;
    letter-spacing:1px
}
.alert-main
{
    padding:25px;
    display:flex;
    align-items:center;
    gap:25px
}
.alert-main strong
{
    font-size:15px
}
.alert-main p
{
    font-size:12px;
    color:var(--muted);
    margin-top:7px
}
.alert-plate
{
    font-size:30px;
    padding:12px 19px;
    background:white
}
.alert-amount
{
    margin-left:auto;
    font-size:29px;
    color:#c94f46;
    letter-spacing:-1px;
    font-weight:650;
    white-space:nowrap
}
.alert-amount small
{
    display:block;
    font-size:10px;
    color:#a18b87;
    text-align:right;
    letter-spacing:0;
    margin-top:5px;
    font-weight:400
}
.alert-meta
{
    padding:0 26px 22px;
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:20px;
    font-size:11px;
    color:#607783
}
.alert-meta small
{
    display:block;
    font-size:8px;
    color:#95a2aa;
    letter-spacing:.8px;
    margin-bottom:7px
}
.alert-note
{
    font-size:11px;
    color:#a38b77;
    background:#fffaf3;
    margin:0 24px;
    padding:11px 15px;
    border-radius:6px
}
.alert-actions
{
    display:flex;
    align-items:center;
    gap:10px;
    padding:22px 25px
}
.alert-actions .text
{
    margin-left:auto
}
.modal-backdrop
{
    position:fixed;
    inset:0;
    background:#12233166;
    z-index:100;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:25px
}
.modal
{
    background:white;
    border-radius:13px;
    max-width:640px;
    width:100%;
    max-height:85dvh;
    overflow:auto;
    box-shadow:0 15px 80px #132c3c33;
    padding:22px
}
.modal .card-heading
{
    padding:0 0 20px
}
.detail-row
{
    display:flex;
    justify-content:space-between;
    gap:20px;
    padding:19px 3px;
    border-top:1px solid var(--line);
    font-size:12px
}
.detail-row small
{
    display:block;
    color:var(--muted)
}
.modal>p
{
    margin:15px 0
}
.simulator-grid
{
    display:grid;
    grid-template-columns:1.1fr 1fr;
    gap:22px;
    align-items:start
}
.simulator-grid .form-card
{
    max-width:none
}
.simulator-grid .form-card>.button
{
    margin-top:23px
}
.plate-input
{
    font-size:24px;
    letter-spacing:3px;
    font-weight:600;
    min-height:65px
}
.response-box
{
    background:#142b3a;
    color:#b5d7ca;
    padding:23px;
    min-height:210px;
    margin:0;
    font:12px/1.8 Consolas,monospace;
    white-space:pre-wrap;
    overflow-wrap:anywhere
}
.test-cases
{
    padding:24px
}
.test-cases h3
{
    margin-bottom:18px
}
.test-cases p
{
    font-size:11px;
    margin-bottom:14px
}
.test-cases .plate
{
    margin-right:8px
}
footer
{
    padding:26px 0 22px;
    color:#acb7bf;
    font-size:10px;
    display:flex;
    justify-content:space-between;
    gap:20px
}
#blazor-error-ui
{
    background:#fff2cc;
    color:#735f31;
    bottom:0;
    display:none;
    left:0;
    padding:14px 25px;
    position:fixed;
    width:100%;
    z-index:1000;
    font-size:12px
}
#blazor-error-ui a
{
    margin:0 20px;
    text-decoration:underline
}
#blazor-error-ui button
{
    float:right;
    border:0;
    background:transparent;
    color:inherit
}
.login-page
{
    height:100dvh;
    display:grid;
    grid-template-columns:1fr 1fr;
    background:white;
    overflow:auto
}
.login-story
{
    background:#142b3a;
    padding:8vh 10%;
    color:white;
    display:flex;
    flex-direction:column;
    justify-content:center
}
.login-story .eyebrow
{
    color:#f59487;
    margin:30px 0 17px
}
.login-story h1
{
    font-size:45px;
    line-height:1.15;
    letter-spacing:-2px;
    font-weight:550
}
.login-story>p:not(.eyebrow)
{
    color:#91a9b9;
    font-size:14px;
    max-width:350px;
    margin-top:23px
}
.login-illustration
{
    margin-top:55px;
    display:flex;
    align-items:center;
    gap:20px;
    border:1px solid #ffffff13;
    border-radius:14px;
    padding:27px;
    max-width:370px;
    background:#ffffff03
}
.login-illustration>svg
{
    height:40px;
    width:40px;
    color:#648b9f
}
.login-illustration .plate
{
    background:#e9f0f3;
    font-size:21px
}
.login-panel
{
    padding:50px;
    display:flex;
    justify-content:center;
    align-items:center
}
.login-card
{
    width:100%;
    max-width:360px
}
.login-card h2
{
    font-size:30px;
    margin:23px 0 9px;
    letter-spacing:-1px
}
.login-card>p
{
    font-size:13px;
    margin-bottom:32px
}
.login-card form>label
{
    font-size:11px
}
.login-card .button
{
    margin-top:7px;
    justify-content:space-between
}
.login-card>p.small
{
    margin-top:27px;
    font-size:10px
}
@media(min-width:1600px)
{
    .main-scroll
    {
        padding-left:45px;
        padding-right:45px
    }
    .stat-card
    {
        padding:25px
    }
    .topbar
    {
        padding:0 45px
    }
}
@media(max-width:1250px)
{
    .shell
    {
        grid-template-columns:210px minmax(0,1fr)
    }
    .sidebar
    {
        padding-left:12px;
        padding-right:12px
    }
    .brand
    {
        font-size:20px
    }
    .main-scroll
    {
        padding:25px 24px 0
    }
    .topbar
    {
        padding:0 24px
    }
    .stats-grid
    {
        gap:12px
    }
    .stat-card
    {
        padding:17px
    }
    .stat-card strong
    {
        font-size:26px
    }
    .topbar-user .demo
    {
        display:none
    }
    .editor-grid
    {
        grid-template-columns:minmax(0,1fr) 280px
    }
    th,td
    {
        padding-left:16px;
        padding-right:16px
    }
    .dashboard-grid
    {
        grid-template-columns:minmax(0,1.6fr) minmax(270px,1fr)
    }
    .alert-main
    {
        gap:18px
    }
    .alert-plate
    {
        font-size:24px
    }
    .alert-amount
    {
        font-size:24px
    }
    .alert-meta
    {
        grid-template-columns:repeat(2,1fr)
    }
}
@media(max-width:1000px)
{
    .stats-grid
    {
        grid-template-columns:repeat(2,minmax(0,1fr))
    }
    .dashboard-grid
    {
        grid-template-columns:1fr
    }
    .editor-grid
    {
        grid-template-columns:1fr
    }
    .side-editor
    {
        max-width:none
    }
    .settings-grid,.simulator-grid
    {
        grid-template-columns:1fr
    }
    .topbar-title .muted,.top-divider
    {
        display:none
    }
    .page-heading
    {
        align-items:flex-start
    }
    .alert-main
    {
        flex-wrap:wrap
    }
    .alert-main .alert-amount
    {
        width:100%;
        margin:0
    }
    .alert-amount small
    {
        text-align:left
    }
    .monitor-strip
    {
        flex-wrap:wrap
    }
    .login-story h1
    {
        font-size:36px
    }
}
@media(max-width:760px)
{
    .shell
    {
        grid-template-columns:1fr
    }
    .sidebar
    {
        position:fixed;
        inset:0 auto 0 0;
        width:238px;
        transform:translateX(-100%);
        transition:transform .2s;
        box-shadow:10px 0 60px #142b3a33
    }
    .menu-open .sidebar
    {
        transform:translateX(0)
    }
    .menu-toggle
    {
        display:inline-flex!important
    }
    .topbar
    {
        height:64px;
        padding:0 16px
    }
    .topbar-title strong
    {
        font-size:10px
    }
    .topbar-user
    {
        gap:7px
    }
    .topbar-user>a
    {
        max-width:90px;
        text-overflow:ellipsis;
        overflow:hidden;
        white-space:nowrap;
        font-size:11px
    }
    .main-scroll
    {
        padding:24px 16px 0
    }
    .page-heading
    {
        flex-direction:column;
        gap:17px
    }
    h1
    {
        font-size:26px
    }
    .stats-grid
    {
        gap:10px
    }
    .stat-card
    {
        padding:16px
    }
    .stat-card strong
    {
        font-size:25px
    }
    .stat-card small
    {
        font-size:9px
    }
    .card-heading
    {
        padding:20px
    }
    .form-grid
    {
        grid-template-columns:1fr
    }
    .form-grid .full
    {
        grid-column:auto
    }
    .filter-bar
    {
        padding:18px;
        gap:11px
    }
    .filter-bar label
    {
        flex:1 1 40%
    }
    .import-card
    {
        flex-direction:column;
        align-items:stretch
    }
    .file-label
    {
        max-width:none
    }
    .pagination
    {
        padding:15px;
        gap:10px;
        flex-wrap:wrap
    }
    .pagination>div
    {
        gap:8px
    }
    .pagination label
    {
        font-size:10px
    }
    .form-card
    {
        padding:21px
    }
    .detail-grid
    {
        grid-template-columns:1fr
    }
    .form-footer
    {
        align-items:start;
        flex-direction:column
    }
    .alert-top
    {
        padding:14px;
        font-size:9px;
        gap:10px
    }
    .alert-top>span:first-child
    {
        font-size:8px;
        letter-spacing:.4px
    }
    .alert-main
    {
        padding:22px 17px;
        gap:17px
    }
    .alert-meta
    {
        padding:0 18px 20px
    }
    .alert-note
    {
        margin:0 17px
    }
    .alert-actions
    {
        padding:20px 17px;
        flex-wrap:wrap
    }
    .alert-actions .text
    {
        margin:0
    }
    .monitor-strip span:last-child
    {
        display:none
    }
    footer span
    {
        max-width:220px;
        text-align:right
    }
    .login-page
    {
        grid-template-columns:1fr
    }
    .login-story
    {
        padding:35px;
        display:none
    }
    .login-panel
    {
        padding:30px
    }
    .login-card
    {
        max-width:350px
    }
    .card-heading .compact-search
    {
        max-width:140px
    }
    .modal-backdrop
    {
        padding:15px
    }
}
h1:focus
{
    outline:none
}
.photo-actions
{
    display:flex;
    gap:12px;
    margin:24px 0 17px;
    flex-wrap:wrap
}
.photo-picker
{
    position:relative;
    overflow:hidden;
    cursor:pointer;
    color:#4c626f;
    font-size:12px;
    flex-direction:row
}
.photo-picker input
{
    position:absolute;
    inset:0;
    opacity:0;
    cursor:pointer;
    width:100%;
    height:100%
}
.photo-preview
{
    background:#f7f9fb;
    border:1px dashed #dbe3e8;
    border-radius:8px;
    text-align:center;
    padding:20px;
    min-height:90px
}
.photo-preview img
{
    max-width:100%;
    max-height:310px;
    border-radius:6px;
    object-fit:contain
}
.photo-preview img[hidden]
{
    display:none
}
.photo-preview p
{
    margin-top:9px;
    overflow-wrap:anywhere
}
.photo-notice
{
    margin:17px 0 20px
}
.photo-result
{
    padding:5px 25px 22px
}
.photo-result>.plate
{
    margin-bottom:23px
}
.color-swatch
{
    display:inline-block;
    vertical-align:middle;
    width:20px;
    height:20px;
    border-radius:50%;
    border:1px solid #cbd5dc;
    margin-right:9px
}
.photo-result .message p
{
    margin-top:7px
}
fieldset.form-fields
{
    border:0;
    border-radius:0;
    margin:0;
    padding:0;
    min-width:0
}
.global-alarm
{
    display:flex;
    gap:12px;
    align-items:center;
    flex-wrap:wrap;
    margin-bottom:20px
}
.global-alarm.has-alerts
{
    border:1px solid #edb1aa;
    border-radius:8px;
    padding:12px;
    background:#fff1ef
}
.global-alarm .button
{
    font-size:11px
}
/* Profile menu and dedicated editors */
.profile-menu
{
    position:relative
}
.profile-menu summary
{
    display:flex;
    align-items:center;
    gap:10px;
    cursor:pointer;
    list-style:none
}
.profile-dropdown
{
    position:absolute;
    right:0;
    top:45px;
    width:240px;
    padding:12px;
    background:#fff;
    border:1px solid #dce2e7;
    border-radius:12px;
    box-shadow:0 10px 30px #142b3a26;
    z-index:100
}
.profile-dropdown>a
{
    display:block;
    padding:12px;
    color:#142b3a
}
.profile-dropdown form
{
    border-top:1px solid #eee;
    padding-top:8px
}
.form-card fieldset
{
    border:0;
    margin:0;
    padding:0;
    min-width:0
}
.form-card
{
    max-width:850px
}
.form-card form
{
    width:100%
}
.form-card textarea
{
    min-height:100px
}
/* Relatório independente da identidade visual do portal */
.site-signature
{
    justify-content:flex-end;
    opacity:.65
}
.report-actions
{
    display:flex;
    justify-content:flex-end;
    gap:12px;
    margin-bottom:20px
}
.complaint-report
{
    background:white;
    color:#202a33;
    max-width:850px;
    margin:0 auto 36px;
    padding:50px 58px;
    border:1px solid #dce1e5;
    font-family:Arial,sans-serif;
    font-size:13px;
    line-height:1.65
}
.report-header
{
    display:flex;
    justify-content:space-between;
    gap:24px;
    border-bottom:2px solid #243341;
    padding-bottom:24px;
    margin-bottom:25px
}
.report-header h1
{
    font-size:23px;
    letter-spacing:.5px;
    color:#202a33
}
.report-header p
{
    font-size:12px;
    margin-top:8px
}
.report-header>span
{
    text-align:right;
    font-size:11px;
    min-width:100px
}
.complaint-report h2
{
    font-size:14px;
    color:#202a33;
    margin:25px 0 13px;
    padding-bottom:6px;
    border-bottom:1px solid #cdd5da
}
.report-grid
{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:14px 28px
}
.report-grid dt
{
    font-size:11px;
    color:#596b77
}
.report-grid dd
{
    margin:3px 0 0;
    overflow-wrap:anywhere;
    font-size:13px
}
.report-notice,.report-disclaimer
{
    background:#f4f6f8;
    padding:13px 15px;
    font-size:11px
}
.report-observations
{
    white-space:pre-wrap
}
.report-signatures
{
    margin-top:60px;
    display:grid;
    gap:32px
}
.report-disclaimer
{
    margin-top:45px
}
.report-id
{
    font-size:11px
}
@media print
{
    @page
    {
        size:A4;
        margin:15mm
    }
    body,.workspace,.main-scroll
    {
        background:white!important;
        overflow:visible!important;
        height:auto!important
    }
    .sidebar,.topbar,.global-alarm,.report-actions,.site-signature,#blazor-error-ui
    {
        display:none!important
    }
    .shell
    {
        display:block!important
    }
    .workspace
    {
        display:block!important
    }
    .main-scroll
    {
        padding:0!important
    }
    .complaint-report
    {
        border:0;
        padding:0;
        margin:0;
        max-width:none;
        font-size:11pt;
        box-shadow:none
    }
    .complaint-report h2
    {
        break-after:avoid
    }
    .report-grid,.report-signatures
    {
        break-inside:avoid
    }
}
/* Header controls and application dialogs */
.bell-menu
{
    position:relative
}
.bell-menu summary
{
    list-style:none;
    cursor:pointer
}
.bell-menu summary::-webkit-details-marker
{
    display:none
}
.bell-dropdown
{
    position:absolute;
    right:0;
    top:42px;
    width:300px;
    padding:20px;
    background:white;
    color:#243746;
    border:1px solid #e1e7eb;
    border-radius:12px;
    box-shadow:0 12px 40px #122b3b30;
    z-index:1000
}
.bell-dropdown p
{
    margin:10px 0
}
.bell-dropdown a
{
    display:block;
    margin-top:15px
}
.app-dialog
{
    border:0;
    border-radius:16px;
    padding:28px;
    width:min(480px,90vw);
    color:#243746;
    box-shadow:0 20px 70px #0004
}
.app-dialog::backdrop
{
    background:#10253480
}
.app-dialog p
{
    line-height:1.6;
    margin:18px 0
}
.dialog-actions
{
    display:flex;
    justify-content:flex-end;
    gap:12px
}
.modal-backdrop
{
    z-index:2000
}
.modal
{
    max-height:85vh;
    overflow:auto
}
.topbar-user
{
    gap:16px
}
/* Spacious, centred create/edit pages */
.main-scroll>.editor-form
{
    width:100%;
    max-width:1120px;
    margin:0 auto 28px;
    padding:32px 40px
}
.editor-heading
{
    width:100%;
    max-width:1120px;
    margin-left:auto;
    margin-right:auto
}
.editor-form label
{
    margin-bottom:18px
}
.editor-form .form-fields,.editor-form form
{
    width:100%
}
.editor-form input:not([type=checkbox]),.editor-form select
{
    min-height:44px
}
.editor-form h2
{
    margin-bottom:24px
}
.sidebar-collapse
{
    align-self:flex-end;
    display:flex;
    align-items:center;
    justify-content:center;
    background:#ffffff12;
    color:#c5d5df;
    border:1px solid #ffffff20;
    border-radius:7px;
    width:32px;
    height:32px;
    cursor:pointer;
    margin:-22px 6px 16px
}
.sidebar-collapse:hover
{
    background:#ffffff24
}
.sidebar nav a svg
{
    flex-shrink:0
}
.shell
{
    transition:grid-template-columns .2s
}
@media(min-width:761px)
{
    .sidebar-collapsed .shell
    {
        grid-template-columns:76px minmax(0,1fr)
    }
    .sidebar-collapsed .sidebar
    {
        padding-left:10px;
        padding-right:10px
    }
    .sidebar-collapsed .brand
    {
        padding:0;
        justify-content:center
    }
    .sidebar-collapsed .brand-name,.sidebar-collapsed .nav-label,.sidebar-collapsed .nav-caption,.sidebar-collapsed .sidebar-bottom
    {
        display:none
    }
    .sidebar-collapsed .sidebar nav a
    {
        justify-content:center;
        padding:13px 8px
    }
    .sidebar-collapsed .sidebar-collapse
    {
        align-self:center;
        margin-right:0;
        margin-left:0
    }
    .sidebar-collapsed .sidebar-collapse svg
    {
        transform:rotate(180deg)
    }
}
@media(max-width:760px)
{
    .main-scroll>.editor-form
    {
        padding:24px 20px
    }
    .sidebar-collapse
    {
        display:none
    }
    .editor-heading
    {
        align-items:stretch
    }
    .editor-heading>.button
    {
        align-self:flex-start
    }
}
.main-scroll>.form-card:not(.editor-form)
{
    width:100%;
    max-width:1120px;
    margin-left:auto;
    margin-right:auto
}
/* Uniform content and compact navigation */
.main-scroll>.editor-form,.main-scroll>.form-card,.editor-heading,.asset-card
{
    width:100%;
    max-width:1440px;
    margin-left:auto;
    margin-right:auto
}
.main-scroll>.editor-form,.main-scroll>.form-card
{
    padding:32px
}
.asset-card
{
    scroll-margin-top:20px
}
.asset-card h2
{
    display:flex;
    align-items:center;
    gap:10px
}
.asset-card .empty
{
    padding:30px
}
.form-grid
{
    gap:24px
}
.form-grid>label
{
    margin:0;
    min-width:0
}
.form-grid>p,.form-grid>fieldset,.form-grid>.full
{
    grid-column:1/-1
}
.form-actions
{
    display:flex;
    flex-direction:row;
    justify-content:flex-end;
    align-items:center;
    gap:12px;
    margin-top:28px;
    padding-top:22px;
    border-top:1px solid var(--line)
}
.form-actions>.button
{
    width:auto
}
.form-card form p.small
{
    margin-top:20px
}
.row-actions
{
    display:flex;
    flex-direction:row;
    align-items:center;
    justify-content:flex-end;
    gap:8px;
    flex-wrap:nowrap
}
.row-actions .icon-button
{
    flex:none;
    width:36px;
    height:36px;
    border:1px solid var(--line);
    background:white
}
.position-editor
{
    width:min(1100px,94vw);
    max-width:1100px;
    padding:30px
}
.position-editor .card-heading
{
    padding:0 0 24px
}
.sidebar
{
    padding-top:20px;
    padding-bottom:10px
}
.brand
{
    margin-bottom:24px
}
.sidebar-collapse
{
    margin-top:-12px;
    margin-bottom:8px
}
.sidebar nav
{
    overflow:visible;
    flex:1;
    min-height:0;
    display:flex;
    flex-direction:column
}
.sidebar nav a
{
    padding:9px 12px;
    margin:1px 0;
    min-height:36px
}
.sidebar nav .nav-caption
{
    margin-top:12px;
    padding-bottom:5px
}
.sidebar-bottom
{
    padding:12px 8px 0
}
.sidebar-bottom small
{
    margin:5px 0 0 17px
}
.sidebar-collapsed .sidebar nav a
{
    padding:9px 8px
}
.profile-dropdown>a
{
    display:flex;
    align-items:center;
    gap:10px
}
.form-footer>div
{
    display:flex;
    gap:12px;
    align-items:center
}
@media(max-height:820px) and (min-width:761px)
{
    .sidebar
    {
        padding-top:12px
    }
    .brand
    {
        margin-bottom:18px
    }
    .sidebar nav a
    {
        padding-top:6px;
        padding-bottom:6px;
        min-height:32px
    }
    .sidebar nav .nav-caption
    {
        margin-top:8px
    }
    .sidebar-bottom
    {
        font-size:10px
    }
}
@media(max-height:650px) and (min-width:761px)
{
    .brand small,.sidebar-bottom
    {
        display:none
    }
    .brand
    {
        margin-bottom:12px
    }
    .sidebar nav a
    {
        min-height:28px;
        padding-top:4px;
        padding-bottom:4px
    }
    .sidebar .nav-caption
    {
        padding-top:0;
        padding-bottom:2px
    }
}
@media(max-width:760px)
{
    .main-scroll>.editor-form,.main-scroll>.form-card
    {
        padding:24px 20px
    }
    .form-actions
    {
        justify-content:flex-start;
        gap:8px
    }
    .form-actions .button
    {
        white-space:normal
    }
    .asset-card .card-heading
    {
        flex-wrap:wrap
    }
    .position-editor
    {
        padding:22px
    }
    .form-grid
    {
        grid-template-columns:1fr
    }
    .form-footer>div
    {
        flex-direction:row;
        flex-wrap:wrap
    }
}
.table-wrap td:has(.icon-button)
{
    text-align: right;
    white-space: nowrap;
}
.table-wrap td .icon-button + .icon-button
{
    margin-left: 6px;
}
.main-scroll > .card
{
    max-width: 1440px;
    margin-left: auto;
    margin-right: auto;
}
/* Editable complaint with a clean printable document */
.report-actions
{
    display:flex;
    flex-wrap:wrap;
    gap:12px;
    align-items:center;
    margin-bottom:24px;
}
.complaint-form
{
    max-width:1100px;
    margin:0 auto 36px;
    padding:40px;
}
.complaint-title
{
    text-align:center;
    margin-bottom:30px;
}
.complaint-title h1
{
    font-size:24px;
    color:#111;
}
.complaint-title p
{
    margin-top:10px;
    color:#444;
}
.complaint-section
{
    margin-bottom:28px;
}
.complaint-section h2
{
    margin:0 0 18px;
    color:#111;
    font-size:17px;
}
.complaint-fields
{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:18px 24px;
}
.complaint-field
{
    min-width:0;
}
.complaint-field.full
{
    grid-column:1/-1;
}
.complaint-label
{
    display:block;
    font-size:12px;
    font-weight:600;
    margin-bottom:8px;
    color:#344b59;
}
.complaint-field textarea
{
    resize:vertical;
    min-height:130px;
    line-height:1.65;
}
.complaint-field input[readonly]
{
    background:#f3f6f8;
    color:#344b59;
}
.complaint-signature
{
    margin-top:24px;
    color:#111;
}
.complaint-signature div
{
    margin-top:32px;
    overflow-wrap:anywhere;
}
.report-print-only
{
    display:none;
}
@media(max-width:760px)
{
    .complaint-form
    {
        padding:24px 20px;
    }
    .complaint-fields
    {
        grid-template-columns:1fr;
    }
    .complaint-title h1
    {
        font-size:20px;
    }
}
@media print
{
    @page
    {
        size:A4;
        margin:15mm;
    }
    .report-screen-only,.report-actions,.modal-backdrop,.profile-menu,.bell-menu
    {
        display:none !important;
    }
    .report-print-only
    {
        display:block !important;
    }
    .complaint-report.complaint-form
    {
        width:100%;
        max-width:none;
        padding:0;
        margin:0;
        border:0;
        box-shadow:none;
        font:11pt/1.4 Arial,sans-serif;
        color:#000;
    }
    .complaint-title
    {
        margin-bottom:8mm;
    }
    .complaint-title h1
    {
        font-size:15pt;
        margin:0 0 3mm;
    }
    .complaint-title p
    {
        font-size:11pt;
        color:#000;
        margin:0;
    }
    .complaint-section
    {
        margin:0 0 6mm;
    }
    .complaint-section h2
    {
        font-size:12pt;
        margin:0 0 3mm;
        break-after:avoid;
    }
    .complaint-fields
    {
        display:grid;
        grid-template-columns:repeat(2,minmax(0,1fr));
        gap:3mm 6mm;
    }
    .complaint-field
    {
        break-inside:avoid;
    }
    .complaint-label
    {
        font:9pt Arial,sans-serif;
        color:#000;
        margin-bottom:1mm;
    }
    .complaint-value
    {
        white-space:pre-wrap;
        overflow-wrap:anywhere;
        min-height:5mm;
        color:#000;
    }
    .complaint-value.narrative
    {
        min-height:10mm;
    }
    .complaint-field.check-field
    {
        font-size:10pt;
    }
    .complaint-signature
    {
        break-inside:avoid;
        margin-top:7mm;
    }
    .complaint-signature div
    {
        margin-top:7mm;
    }
    .main-scroll
    {
        overflow:visible!important;
    }
}
@media print
{
    html,body,.shell,.workspace,.main-scroll
    {
        height:auto !important;
        min-height:0 !important;
        overflow:visible !important;
    }
    .shell,.workspace
    {
        display:block !important;
    }
}
.complaint-section h2
{
    border:0;
    padding-bottom:0;
}
/* Shared full dashboard width and uniform table actions */
.main-scroll > .card,
.main-scroll > .form-card,
.main-scroll > .editor-form,
.editor-heading,
.asset-card,
.complaint-form
{
    width:100%;
    max-width:none;
    margin-left:0;
    margin-right:0;
}
.row-actions
{
    justify-content:flex-end;
    gap:8px;
}
.row-actions .icon-button,
.table-wrap td > .icon-button
{
    width:36px;
    height:36px;
    border:1px solid var(--line);
    background:#fff;
    color:#6f8390;
    border-radius:6px;
}
.row-actions .icon-button:hover,
.table-wrap td > .icon-button:hover
{
    border-color:var(--red);
    color:var(--red);
    background:#fff5f4;
}
.bell-indicator.is-active,
.bell-indicator[data-sound-active="true"]
{
    color:#258269;
    background:#eaf6ef;
}
.bell-indicator.is-inactive,
.bell-indicator[data-sound-active="false"]
{
    color:#7a8c97;
    background:#f0f3f5;
}
[data-sound-active="true"] > .bell-inactive,
[data-sound-active="false"] > .bell-active,
.alarm-toggle:not([data-sound-active]) > .bell-active
{
    display:none;
}
.bell-active,.bell-inactive
{
    display:inline-flex;
    align-items:center;
}
.logs-summary
{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:18px;
    margin-bottom:24px;
}
.logs-summary > div
{
    padding:20px 24px;
    background:white;
    border:1px solid var(--line);
    border-radius:10px;
}
.logs-summary span
{
    display:block;
    font-size:12px;
    color:var(--muted);
}
.logs-summary strong
{
    display:block;
    margin-top:10px;
    font-size:28px;
    color:#293f4d;
}
.logs-filters
{
    display:grid;
    grid-template-columns:2fr repeat(3,minmax(130px,1fr));
    gap:16px;
    align-items:end;
}
.logs-filters label
{
    min-width:0;
}
.filter-actions
{
    display:flex;
    gap:10px;
    align-items:center;
}
.log-date
{
    white-space:nowrap;
}
.logs-table .log-category
{
    max-width:280px;
    overflow-wrap:anywhere;
}
.logs-table .log-message
{
    min-width:280px;
    white-space:pre-wrap;
    overflow-wrap:anywhere;
    line-height:1.65;
}
.signature-line
{
    width:70%;
    max-width:100%;
    min-height:28px;
    border-bottom:1px solid #222;
}
@media(max-width:1100px)
{
    .logs-filters
    {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}
@media(max-width:760px)
{
    .logs-summary
    {
        grid-template-columns:1fr;
        gap:10px;
    }
    .logs-filters
    {
        grid-template-columns:1fr;
    }
}
@media print
{
    .logs-summary
    {
        display:none!important;
    }
    .complaint-report.complaint-form
    {
        font:10pt/1.3 Arial,sans-serif;
    }
    .complaint-title
    {
        margin-bottom:5mm;
    }
    .complaint-title h1
    {
        font-size:14pt;
    }
    .complaint-title p
    {
        font-size:10pt;
    }
    .complaint-section
    {
        margin-bottom:4mm;
        break-inside:avoid;
        page-break-inside:avoid;
    }
    .complaint-section h2
    {
        font-size:11pt;
        margin-bottom:2.5mm;
        padding:0;
    }
    .complaint-fields
    {
        gap:2mm 6mm;
    }
    .complaint-label
    {
        font-size:8.5pt;
        margin-bottom:0.6mm;
    }
    .complaint-value
    {
        min-height:4mm;
    }
    .complaint-value.is-empty
    {
        width:100%;
        min-width:0;
        border-bottom:0.6pt solid #555;
        height:4mm;
    }
    .complaint-value.narrative.is-empty
    {
        height:10mm;
    }
    .complaint-signature
    {
        margin-top:5mm;
    }
    .complaint-signature .signature-line
    {
        margin-top:5mm;
        min-height:5mm;
    }
}

.page-heading { position:relative; padding-right:54px; }
.page-help { position:absolute; right:0; top:0; z-index:18; }
.page-help > summary { display:grid; place-items:center; list-style:none; width:34px; height:34px; border:1px solid #d3dce3; border-radius:50%; color:#466578; background:#fff; cursor:pointer; font-size:19px; font-weight:700; }
.page-help > summary::-webkit-details-marker { display:none; }
.page-help[open] > summary { color:#fff; background:#16395c; border-color:#16395c; }
.page-help-panel { position:absolute; right:0; top:44px; width:min(480px,calc(100vw - 48px)); max-height:65vh; overflow:auto; background:white; padding:24px; border:1px solid #d9e1e7; border-radius:12px; box-shadow:0 14px 45px #10253426; color:#344b59; }
.page-help-panel h2 { font-size:16px; margin-bottom:14px; }
.page-help-panel p { font-size:13px!important; line-height:1.7; margin:0 0 12px!important; }
.logs-filters { display:block; }
.logs-basic { display:grid; grid-template-columns:minmax(240px,2fr) minmax(140px,1fr) auto; gap:18px; align-items:end; }
.logs-advanced { margin-top:18px; border-top:1px solid var(--line); padding-top:16px; }
.logs-advanced > summary { display:flex; gap:8px; align-items:center; width:fit-content; cursor:pointer; color:#466578; font-size:12px; font-weight:600; list-style:none; }
.logs-advanced > summary::-webkit-details-marker { display:none; }
.logs-advanced[open] > summary > svg { transform:rotate(45deg); }
.logs-extra-fields { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:16px; margin-top:18px; }
.complaint-title h1,.complaint-section h2 { color:#16395C; }
.complaint-section:first-of-type h2,.complaint-section:last-of-type h2 { color:#111; }
@media(max-width:1000px) { .logs-extra-fields { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:760px) { .logs-basic,.logs-extra-fields { grid-template-columns:1fr; } }
@media print {
    .page-help { display:none!important; }
    .complaint-title h1,.complaint-section h2 { color:#16395C!important; -webkit-print-color-adjust:exact; print-color-adjust:exact; }
    .complaint-section:first-of-type h2,.complaint-section:last-of-type h2 { color:#111!important; }
}

/* Compact help directly alongside each page title. */
.page-heading { padding-right:0; }
.heading-title { display:flex; align-items:center; gap:8px; }
.heading-title h1 { margin-bottom:0; }
.heading-title .page-help { position:relative; top:auto; right:auto; flex:0 0 auto; }
.heading-title .page-help > summary { width:20px; height:20px; font-size:12px; }
.heading-title .page-help-panel { top:28px; right:auto; left:0; font-weight:400; }
@media(max-width:650px) {
    .heading-title .page-help-panel { position:fixed; top:100px; left:16px; right:16px; width:auto; }
}

/* Pending audible alerts: a gentle red pulse across the whole viewport. */
#alarm-page-highlight {
    position:fixed;
    inset:0;
    z-index:1000000;
    pointer-events:none;
    background:#e32222;
    animation:alarm-page-pulse 1.8s ease-in-out infinite;
}
@keyframes alarm-page-pulse {
    0%,100% { opacity:0; }
    50% { opacity:.12; }
}
@media(prefers-reduced-motion:reduce) {
    #alarm-page-highlight { animation:none; opacity:.06; }
}
@media print {
    #alarm-page-highlight { display:none!important; }
}

#alert-lock-notice {
    position:fixed;
    left:50%;
    bottom:20px;
    transform:translateX(-50%);
    width:max-content;
    max-width:calc(100vw - 32px);
    z-index:10000;
    padding:12px 20px;
    border:1px solid #ebaaaa;
    border-radius:8px;
    background:#fff2f2;
    color:#8d1717;
    box-shadow:0 4px 20px #0002;
    font-size:14px;
    pointer-events:none;
}
@media print { #alert-lock-notice { display:none!important; } }

/* Field errors belong immediately beneath their input. */
.form-grid .validation-message {
    display:block;
    margin:5px 0 0;
    color:var(--red);
    font-size:12px;
    font-weight:400;
    line-height:1.4;
}

/* Commercial shell, language selection and public legal information. */
.language-picker { display:flex; align-items:center; gap:4px; }
.language-choice { display:flex; align-items:center; gap:5px; border:1px solid transparent; background:transparent; border-radius:6px; padding:6px; font-size:11px; color:#4c6474; cursor:pointer; }
.language-choice.selected { border-color:#c7d8e1; background:#edf5f8; color:#16395c; }
.language-choice img { display:block; border-radius:2px; }
.login-panel > .language-picker { position:absolute; top:24px; right:24px; }
.legal-links { display:flex; justify-content:center; flex-wrap:wrap; gap:12px 18px; padding:22px 8px; font-size:11px; color:#526b7b; }
.legal-links a,.legal-links button { color:inherit; background:none; border:0; padding:0; font:inherit; text-decoration:underline; cursor:pointer; }
.legal-page { max-width:1100px; margin:0 auto; padding:24px; }
.legal-header { display:flex; align-items:center; justify-content:space-between; gap:20px; padding:12px 0 28px; }
.legal-header > a { color:#16395c; font-size:22px; font-weight:700; }
.legal-document { padding:clamp(24px,5vw,64px); }
.legal-document h1 { margin-bottom:14px; }
.legal-document section { margin-top:30px; }
.legal-document section h2 { font-size:18px; margin-bottom:10px; }
.legal-document p { line-height:1.8; color:#3f596b; margin:12px 0; }
.legal-fields { margin:20px 0; }
.legal-fields > div { display:grid; grid-template-columns:minmax(170px,1fr) 2fr; padding:12px 0; border-bottom:1px solid #e2eaf0; gap:18px; }
.legal-fields dt { font-weight:600; font-size:13px; }
.legal-fields dd { margin:0; font-size:13px; white-space:pre-wrap; overflow-wrap:anywhere; }
.cookie-banner { position:fixed; bottom:16px; left:16px; right:16px; z-index:2000001; padding:22px 26px; background:#fff; color:#243f52; border:1px solid #cbdbe5; border-radius:12px; box-shadow:0 8px 40px #102a4233; display:flex; align-items:center; gap:26px; }
.cookie-banner[hidden] { display:none!important; }
.cookie-banner strong { font-size:16px; }
.cookie-banner p { font-size:12px; line-height:1.7; margin:6px 0; max-width:850px; }
.cookie-actions { display:flex; gap:10px; flex-wrap:wrap; align-items:center; }
.cookie-actions .button { font-size:12px; white-space:nowrap; }
.cookie-dialog { width:min(620px,calc(100vw - 32px)); border:0; border-radius:12px; padding:28px; color:#243f52; }
.cookie-dialog::backdrop { background:#102a4266; }
.cookie-dialog h2 { margin-bottom:18px; }
.cookie-dialog p { font-size:13px; line-height:1.8; margin:16px 0; }
.cookie-dialog .checkbox { align-items:flex-start; }
:focus-visible { outline:2px solid #245e7d; outline-offset:3px; }
@media(max-width:850px) { .cookie-banner { flex-direction:column; align-items:flex-start; gap:14px; } .cookie-banner .cookie-actions { width:100%; } }
@media(max-width:550px) { .legal-fields > div { grid-template-columns:1fr; gap:6px; } .topbar-user { gap:8px; } .language-choice { padding:4px; } .language-choice img { width:18px; } }
@media print { .cookie-banner,.cookie-dialog,.legal-links,.language-picker { display:none!important; } }

/* Global search occupies the free area of the top bar. */
.topbar-title { flex:1; min-width:0; }
.global-search { display:flex; align-items:center; gap:10px; width:min(620px,100%); border:1px solid #d9e4eb; border-radius:9px; background:#f4f7f9; padding:3px 8px 3px 14px; }
.global-search > svg { color:#7b919f; flex:0 0 auto; }
.global-search input { min-width:0; flex:1; border:0; box-shadow:none; background:transparent; padding:9px 0; font-size:13px; }
.global-search .icon-button { flex:0 0 auto; }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.search-page-form { margin-bottom:24px; }
.search-page-controls { display:flex; gap:12px; align-items:center; margin-top:8px; }
.search-page-controls input { min-width:0; flex:1; }
.search-result-heading { margin:0 0 18px; color:#627987; }
.search-result-section { margin-bottom:20px; }
.search-result-section h2 { font-size:16px; margin-bottom:10px; }
.global-search-result { display:flex; align-items:center; justify-content:space-between; gap:16px; border-bottom:1px solid #e8eef2; padding:15px 0; text-decoration:none; color:#27495e; }
.global-search-result:last-child { border:0; }
.global-search-result:hover { color:#c73e38; }
.global-search-result strong { font-size:14px; }
.global-search-result small { display:block; margin-top:5px; color:#718694; font-size:12px; }
@media(max-width:700px) { .topbar { gap:10px; } .global-search { padding-left:9px; gap:6px; } .global-search input { font-size:12px; } .global-search .icon-button { display:none; } .search-page-controls { flex-wrap:wrap; } .search-page-controls .button { flex:0 0 auto; } }

.agent-reading-dialog { width: min(92vw, 760px); max-height: 88vh; overflow: auto; margin: auto; }

.modal-overlay:has(.agent-reading-dialog) { position: fixed; inset: 0; z-index: 1200; display: flex; padding: 24px; background: rgba(15, 23, 42, .5); }

/* Footer remains in document flow; legal pages have their own full-height scroll. */
.main-scroll { padding-bottom:16px; }
.main-scroll > .legal-links { position:static; clear:both; width:100%; margin-top:24px; padding:12px 0 8px; }
.main-scroll > .site-signature { position:static; padding:8px 0; margin:0; }
.legal-page { width:100%; max-width:none; height:100dvh; overflow-y:auto; overflow-x:hidden; overscroll-behavior:contain; }
.legal-page > * { max-width:1052px; margin-left:auto; margin-right:auto; }
.legal-back { margin:0 0 20px; }
.legal-document > .legal-back:last-child { margin:24px 0 0; }
.topbar-title { flex:1; min-width:0; }
.topbar-user { flex:0 0 auto; }
.global-search-wrap { position:relative; flex:1; min-width:0; max-width:620px; }
.global-search { width:100%; margin:0; }
.global-search:focus-within { border-color:#377ca1; box-shadow:0 0 0 3px #377ca11a; }
.global-search input:focus,.global-search input:focus-visible { border:0; outline:0; box-shadow:none; }
.global-search-options { position:absolute; left:0; right:0; top:calc(100% + 8px); max-height:min(440px,65dvh); overflow-y:auto; background:#fff; border:1px solid #d9e4eb; border-radius:10px; box-shadow:0 12px 32px #142b3a24; z-index:100; padding:6px; }
.global-search-options a { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:12px; border-radius:6px; }
.global-search-options a:hover,.global-search-options a.selected,.global-search-options a:focus-visible { background:#edf5f8; color:#16395c; }
.global-search-options strong { font-size:13px; overflow-wrap:anywhere; }
.global-search-options small { display:block; color:#71818e; font-size:11px; margin-top:3px; }
.global-search-options > p { padding:12px; margin:0; font-size:12px; color:#71818e; }
.global-search-options .search-view-all { border-top:1px solid #e6ebee; border-radius:0; color:#245e7d; font-size:12px; }
@media(max-width:700px) { .global-search-options { min-width:min(340px,calc(100vw - 32px)); } }
@media print { .global-search-options { display:none!important; } .legal-page { height:auto; overflow:visible; } .legal-back { display:none!important; } }

.legal-document-actions
{
    display:flex;
    justify-content:flex-end;
    margin-bottom:20px;
}
.legal-document-actions .legal-back
{
    margin:0;
}

.camera-video-panel { margin-top:24px; }
.video-tests { flex-wrap:wrap; margin-top:20px; }
.video-reference { position:relative; width:min(100%,1100px); margin:20px auto; touch-action:none; cursor:crosshair; }
.video-reference img { display:block; width:100%; height:auto; border-radius:8px; }
.video-reference svg { position:absolute; inset:0; width:100%; height:100%; pointer-events:none; }
.video-reference rect { fill:rgba(37,133,109,.12); stroke:#25856d; stroke-width:.5; vector-effect:non-scaling-stroke; }
.video-status { display:grid; grid-template-columns:minmax(140px,1fr) 2fr; gap:10px 20px; }
.video-status dt { font-weight:600; } .video-status dd { margin:0; overflow-wrap:anywhere; }
.video-zone-fields { grid-template-columns:repeat(4,minmax(0,1fr)); }
@media(max-width:600px) { .video-zone-fields { grid-template-columns:repeat(2,minmax(0,1fr)); } }

.video-overview { margin-top:24px; }
.video-metrics { display:flex; flex-wrap:wrap; gap:24px; margin:16px 0; }
.video-metrics > div { display:grid; gap:6px; min-width:150px; }
.video-metrics strong { font-size:24px; } .video-metrics span { font-size:12px; color:var(--muted); }

/* Consistent inline help, list and dashboard geometry. */
.heading-title { display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.heading-title > h1,.heading-title > h2,.heading-title > h3 { margin:0; line-height:1.3; }
.heading-title > .page-help { display:inline-flex; align-self:center; margin:0; padding:0; line-height:1; }
.heading-title > .page-help > summary { width:20px; height:20px; padding:0; line-height:1; }
.main-scroll > .video-overview { width:100%; max-width:none; margin:24px 0 0; }
.form-section-title { margin:28px 0 16px!important; padding-top:20px; border-top:1px solid var(--border,#dce4ec); }
.agents-filters { padding:24px; margin:0; }
.agents-list .table-wrap { width:100%; }
.agents-list td { vertical-align:middle; }
.contract-table td { vertical-align:middle; }
.video-overview .table-wrap { margin-top:24px; }
.video-overview .heading-title { margin-bottom:24px; }

/* Review: shared list states and dashboard cards; no form sizing on camera summary. */
.main-scroll > .card.video-overview { width:100%; max-width:none; margin:24px 0 0; padding:0; }
.video-overview .card-heading .heading-title { margin:0; }
.video-overview .camera-summary-body { padding:24px; margin:0; }
.video-overview .table-wrap { margin:0; }
.card-actions,.page-actions,.integration-actions { display:flex; align-items:center; justify-content:flex-end; gap:12px; flex-wrap:wrap; }
.card-actions { padding:20px 24px; border-top:1px solid #edf1f3; }
.page-actions { margin:0; }
.camera-summary-note { margin:0; padding:24px; color:#587080; font-size:12px; }
.table-wrap .table-empty,.table-scroll .table-empty,table td.empty { text-align:center; vertical-align:middle; padding:32px 22px; color:#587080; font-size:12px; font-weight:400; background:transparent; }
.empty-table-row:hover { background:transparent; }
.table-wrap td .empty { padding:16px 0; color:#587080; font-size:12px; }
.table-wrap td .empty h3 { margin:0 0 6px; color:inherit; font-size:12px; font-weight:400; }
.table-wrap td .empty p { margin:0; color:inherit; font-size:12px; }
.integration-section { margin-top:24px; padding-top:24px; border-top:1px solid #edf1f3; }
.integration-section .heading-title { margin-bottom:16px; }
.integration-section .heading-title h2,.network-section-title { margin:0; font-size:16px; }
.integration-actions { justify-content:flex-start; }
.network-section-title { margin-bottom:24px; }
@media(max-width:760px) { .page-heading > .page-actions { width:100%; justify-content:flex-start; } }

/* Agent detail sections use list cards, not the constrained form-card layout. */
.main-scroll > .card.agent-data-card { width:100%; max-width:none; padding:0; margin:24px 0; }
.agent-data-card .card-heading { gap:16px; flex-wrap:wrap; }
.agent-data-card .heading-title { margin:0; }
.agent-data-card .heading-title h2 { margin:0; font-size:16px; }
.agent-card-filters { padding:20px 24px; margin:0; }
.agent-security-details { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:24px; margin:0; padding:24px; }
.agent-security-details > div { min-width:0; }
.agent-security-details dt { margin:0 0 10px; font-size:12px; font-weight:400; color:var(--muted); }
.agent-security-details dd { margin:0; font-size:14px; font-weight:600; color:#2e4858; overflow-wrap:anywhere; }
.agent-errors-filter { margin:0; }
.occurrence-import-panel { margin:0 0 24px; }
.occurrence-import-content { display:flex; align-items:center; justify-content:space-between; gap:24px; padding:24px; }
.occurrence-import-content p { margin:0 0 12px; color:var(--muted); font-size:12px; }
.occurrence-import-content .file-label { min-width:260px; }
@media(max-width:1000px) { .agent-security-details { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:600px) {
    .agent-security-details { grid-template-columns:1fr; gap:20px; }
    .occurrence-import-content { flex-direction:column; align-items:stretch; }
    .occurrence-import-content .file-label { min-width:0; }
}

.contract-notification-link { position:relative; }
.notification-count { position:absolute; right:-5px; top:-5px; min-width:17px; padding:2px 4px; border-radius:10px; background:var(--red,#d94b43); color:white; font-size:10px; line-height:1.2; text-align:center; }
.contract-document-section { padding-top:24px; margin-top:24px; border-top:1px solid #edf1f3; }
.contract-document-section h2 { font-size:16px; }
.contract-document-section .button { margin-top:12px; }

.station-picker { display:flex; align-items:center; gap:8px; margin:0; min-width:0; }
.station-picker label { margin:0; color:var(--muted); font-size:11px; white-space:nowrap; }
.station-picker select { width:clamp(140px,15vw,230px); min-height:36px; padding:7px 28px 7px 10px; margin:0; font-size:12px; }
.station-context-label { display:flex; align-items:center; gap:6px; max-width:230px; color:#587080; font-size:12px; }
@media(max-width:1200px) { .station-picker label { display:none; } .station-picker select { width:150px; } }
@media(max-width:760px) {
    .topbar { flex-wrap:wrap; height:auto; min-height:76px; }
    .topbar-user { flex-wrap:wrap; justify-content:flex-end; gap:8px; }
    .station-picker select { width:140px; }
    .station-context-label { max-width:140px; }
}

/* Permanent operational terminal, reusing the portal palette and controls. */
.terminal-shell { min-height:100dvh; background:var(--page-bg,#f4f7fb); }
.terminal-content { width:min(1440px,100%); margin:auto; padding:28px; }
.terminal-overlay { position:fixed; inset:70px 0 0; background:rgba(135,20,35,.12); display:flex; align-items:center; justify-content:center; padding:24px; z-index:1200; overflow:auto; }
.terminal-alert { width:min(680px,100%); margin:auto; border:2px solid #cc3345; }
.terminal-alert form { display:grid; gap:18px; }
.terminal-alert h2 { display:flex; gap:10px; align-items:center; }
.terminal-plate { text-align:center; font-size:clamp(32px,7vw,64px); font-weight:750; letter-spacing:.08em; }
.terminal-alert .button { justify-content:center; min-height:48px; }
@media(max-width:650px) { .terminal-content {padding:16px;} .terminal-overlay {padding:12px;} }

.pin-setup-page { min-height:100dvh; padding:32px 20px; display:grid; align-content:center; gap:16px; }
.pin-setup-page form { display:grid; gap:20px; }
.pin-setup-page .form-card { width:min(680px,100%); }

/* Dialogs inside table cells must not inherit nowrap or action-column alignment. */
.modal-backdrop, .modal-overlay { white-space:normal; text-align:left; }
.modal, .agent-reading-dialog {
    box-sizing:border-box;
    min-width:0;
    max-width:min(640px, calc(100vw - 32px));
    overflow-x:hidden;
    overflow-y:auto;
    white-space:normal;
    text-align:left;
    overflow-wrap:anywhere;
}
.modal :is(h1,h2,h3,p,strong,.message) { white-space:normal; max-width:100%; overflow-wrap:anywhere; }
.modal .form-actions { flex-wrap:wrap; }
.station-state-options { display:flex; gap:24px; flex-wrap:wrap; align-items:center; margin-top:24px; }
.station-state-options label { margin:0; }

.modal { font-size:14px; font-weight:400; }

.heading-actions { display:flex; align-items:center; justify-content:flex-end; gap:10px; flex-wrap:wrap; }