:root{--navy:#0d2a4a;--blue:#1769aa;--bg:#f4f6f9;--border:#d0d5dd;--green:#1f8a4c;--red:#b42318;--orange:#b54708}*{box-sizing:border-box}body{margin:0;font-family:Arial,Helvetica,sans-serif;background:var(--bg);color:#101828}.login-wrap{min-height:100vh;display:grid;place-items:center;background:linear-gradient(135deg,#0d2a4a,#1769aa)}.login{width:min(440px,92vw);background:#fff;padding:28px;border-radius:18px;box-shadow:0 20px 60px #0004;text-align:center}.logo{width:120px;border-radius:22px}.field{display:grid;gap:6px;margin:12px 0;text-align:left}.field input,.field select,.field textarea{padding:12px;border:1px solid var(--border);border-radius:8px;font:inherit}.btn{border:0;border-radius:8px;padding:12px 16px;font-weight:700;cursor:pointer;background:var(--blue);color:#fff}.btn.secondary{background:var(--navy)}.btn.danger{background:var(--red)}.btn.light{background:#eef2f6;color:#101828}.layout{display:grid;grid-template-columns:250px 1fr;min-height:100vh}.side{background:var(--navy);color:#fff;padding:18px}.side img{width:86px;display:block;margin:auto}.side h2{text-align:center}.nav button{display:block;width:100%;padding:12px;margin:5px 0;background:transparent;color:#fff;border:0;border-radius:8px;text-align:left;font-size:15px}.nav button.active,.nav button:hover{background:#174a78}.main{padding:24px}.top{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px}.grid{display:grid;grid-template-columns:repeat(12,1fr);gap:16px}.card{background:#fff;border:1px solid var(--border);border-radius:14px;padding:16px}.span6{grid-column:span 6}.span4{grid-column:span 4}.span8{grid-column:span 8}.span12{grid-column:span 12}.row{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.kpi{font-size:30px;font-weight:800}.muted{color:#667085}.alert{padding:12px;border-radius:8px;margin:10px 0}.alert.green{background:#eaf7ef;color:#166534}.alert.red{background:#fef3f2;color:#b42318}.alert.blue{background:#eaf2fb;color:#0d2a4a}table{width:100%;border-collapse:collapse}th,td{padding:9px;border-bottom:1px solid #e5e7eb;text-align:left;font-size:14px}.badge{padding:4px 8px;border-radius:999px;background:#eef2f6;font-size:12px;font-weight:700}.badge.red{background:#fee4e2;color:#b42318}.badge.green{background:#dcfae6;color:#166534}.tabs{display:flex;gap:8px;margin-bottom:12px}.tabs button{padding:9px 12px;border:1px solid var(--border);background:#fff;border-radius:8px}.public-header{background:var(--navy);color:#fff;padding:20px}.public-wrap{max-width:1100px;margin:auto;padding:18px}.paybox{background:#fff7e6;border:1px solid #e7b85c;border-radius:10px;padding:14px}.ticket-print{background:#fff;color:#000;padding:.15in;width:8in;height:4in;overflow:hidden}.ticket-print .ticket-grid{display:grid;grid-template-columns:2fr 1fr;gap:12px}.ticket-print .banner{background:#0d2a4a;color:white;font-size:28px;font-weight:800;text-align:center;padding:8px}.courtbox{background:#eaf2fb;border:2px solid #0d2a4a;border-radius:8px;padding:8px}@media(max-width:900px){.layout{grid-template-columns:1fr}.side{position:static}.grid{display:block}.card{margin-bottom:12px}}@media print{body *{visibility:hidden}.print-area,.print-area *{visibility:visible}.print-area{position:absolute;left:0;top:0}@page{size:8in 4in landscape;margin:0}}
.grow{flex:1}.grow2{flex:2}.vehicle-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.small{font-size:12px}
@media(max-width:900px){.vehicle-grid{grid-template-columns:1fr 1fr}}



.evidence-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:12px;margin-top:12px}
.evidence-item{border:1px solid var(--border);border-radius:12px;padding:10px;background:#f8fafc}
.evidence-item img{display:block;width:100%;height:180px;object-fit:cover;border-radius:8px;background:#fff;margin-bottom:8px}
.evidence-item .evidence-caption{width:100%;padding:9px;border:1px solid var(--border);border-radius:7px;margin-bottom:8px}
.public-evidence img{height:230px;object-fit:contain;background:#fff}
@media(max-width:700px){
  .agency-launcher-wrap{
    padding:12px;
    align-items:flex-start;
    overflow-y:auto;
  }
  .agency-launcher-card{
    width:100%;
    min-height:auto;
    margin:0;
    border-radius:20px;
    padding:28px 20px 24px;
  }
  .agency-company-logo{
    width:min(100%,360px);
    margin:0 auto 16px;
  }
  .agency-test-banner{
    margin:0 auto 18px;
    padding:7px 13px;
    font-size:11px;
  }
  .agency-launcher-card h1{
    margin:0 0 12px;
    font-size:24px;
  }
  .agency-launcher-intro{
    margin:0 auto 22px;
    font-size:14px;
    line-height:1.5;
  }
  .agency-connect-divider{
    margin:0 0 20px;
  }
  .agency-saved-card{
    padding-right:72px;
  }
}
@media print{.no-print{display:none!important}}


.top-actions{display:flex;gap:10px;align-items:center}
.phone-mode-toggle{white-space:nowrap}
.phone-menu-button{display:none;white-space:nowrap}

body.phone-mode{background:#eef2f6}
body.phone-mode .layout{display:block;min-height:100vh}
body.phone-mode .main{padding:10px 10px 24px;max-width:760px;margin:0 auto}
body.phone-mode .top{position:sticky;top:0;z-index:25;background:#eef2f6;padding:8px 2px 10px;margin-bottom:8px}
body.phone-mode .top h1{font-size:23px;margin:0 0 2px}
body.phone-mode .top .muted{font-size:12px}
body.phone-mode .top .badge{display:none}
body.phone-mode .phone-mode-toggle{padding:10px 12px;background:#eef2f6;color:#101828}
body.phone-mode .phone-menu-button{display:inline-block;padding:10px 14px;background:var(--navy);color:#fff}
body.phone-mode .side{display:none}
body.phone-mode.phone-nav-open .side{
  display:block;
  position:fixed;
  left:10px;
  right:10px;
  top:74px;
  bottom:auto;
  z-index:60;
  max-height:calc(100vh - 90px);
  overflow-y:auto;
  padding:14px;
  border-radius:14px;
  background:var(--navy);
  box-shadow:0 12px 40px #0007
}
body.phone-mode.phone-nav-open::before{
  content:'';
  position:fixed;
  inset:0;
  z-index:50;
  background:#0008
}
body.phone-mode.phone-nav-open .side>img{width:58px;margin:0 auto 6px}
body.phone-mode.phone-nav-open .side>h2{font-size:18px;margin:6px 0 10px}
body.phone-mode.phone-nav-open .side>hr{display:none}
body.phone-mode.phone-nav-open .side>div:not(.nav),
body.phone-mode.phone-nav-open .side>#logout{display:none!important}
body.phone-mode.phone-nav-open .side .nav{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:8px
}
body.phone-mode.phone-nav-open .side .nav button{
  width:100%;
  margin:0;
  padding:14px 10px;
  min-height:50px;
  text-align:center;
  font-size:14px;
  background:#173d63;
  border:1px solid #ffffff22
}
body.phone-mode.phone-nav-open .side .nav button.active{background:#fff;color:var(--navy)}
body.phone-mode .grid{display:block}
body.phone-mode .card{margin-bottom:10px;padding:13px;border-radius:12px;overflow-x:auto}
body.phone-mode .row{display:grid;grid-template-columns:1fr;gap:8px;align-items:stretch}
body.phone-mode .field{margin:8px 0}
body.phone-mode .field input,
body.phone-mode .field select,
body.phone-mode .field textarea{width:100%;min-height:48px;font-size:16px;padding:12px}
body.phone-mode .btn{min-height:48px;font-size:15px}
body.phone-mode .card .btn{width:100%}
body.phone-mode .top .btn{width:auto}
body.phone-mode .vehicle-grid{grid-template-columns:1fr 1fr;gap:8px}
body.phone-mode table{min-width:620px}
body.phone-mode .evidence-grid{grid-template-columns:1fr}
body.phone-mode .evidence-item img{height:auto;max-height:360px;object-fit:contain}
body.phone-mode .kpi{font-size:26px}
@media(max-width:520px){
  body.phone-mode .vehicle-grid{grid-template-columns:1fr}
  body.phone-mode .top{align-items:flex-start;gap:8px}
  body.phone-mode .top-actions{display:flex;gap:6px}
  body.phone-mode .phone-mode-toggle,
  body.phone-mode .phone-menu-button{min-height:42px;padding:9px 10px;font-size:13px}
  body.phone-mode.phone-nav-open .side .nav{grid-template-columns:1fr}
}

.plate-entry-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;align-items:stretch}
.plate-entry-row input{min-width:0}
.plate-camera-btn{white-space:nowrap}
body.phone-mode .plate-entry-row{grid-template-columns:minmax(0,1fr) auto}
body.phone-mode .plate-camera-btn{width:auto;min-width:118px}
@media(max-width:520px){
  .plate-entry-row{grid-template-columns:1fr}
  body.phone-mode .plate-entry-row{grid-template-columns:1fr}
  body.phone-mode .plate-camera-btn{width:100%}
}


.plate-camera-modal{position:fixed;inset:0;z-index:120;background:#000d;display:flex;align-items:center;justify-content:center;padding:10px}
.plate-camera-modal[hidden]{display:none!important}
.plate-camera-panel{width:min(680px,100%);max-height:calc(100dvh - 20px);overflow:auto;background:#101828;color:#fff;border-radius:16px;padding:12px;box-shadow:0 20px 60px #0008}
.plate-camera-title{font-size:20px;font-weight:800;margin-bottom:3px}
.plate-camera-help{font-size:13px;color:#d0d5dd;margin-bottom:8px;line-height:1.3}
.plate-camera-stage{position:relative;width:100%;height:min(46dvh,340px);min-height:220px;background:#000;border-radius:12px;overflow:hidden}
.plate-camera-stage video{width:100%;height:100%;object-fit:cover;display:block}
.plate-camera-guide{position:absolute;left:8%;right:8%;top:35%;height:30%;border:4px solid #fff;border-radius:10px;box-shadow:0 0 0 9999px #0005,0 0 0 2px #0008 inset;display:flex;align-items:flex-start;justify-content:center;pointer-events:none}
.plate-camera-guide span{margin-top:-28px;background:#000c;color:#fff;border-radius:999px;padding:5px 9px;font-size:11px;font-weight:800;letter-spacing:.3px}
.plate-camera-actions{position:sticky;bottom:0;display:grid;grid-template-columns:2fr 1fr;gap:8px;margin-top:8px;padding-top:8px;background:#101828;z-index:2}
.plate-camera-actions .btn{min-height:48px;font-size:15px}
#capturePlateFrame{background:#1769aa}
#plateCameraLiveStatus{color:#e5e7eb;margin-top:6px;min-height:18px}

@media(max-width:700px){
  .plate-camera-modal{padding:8px;align-items:center}
  .plate-camera-panel{width:100%;max-height:calc(100dvh - 16px);min-height:0;border-radius:14px;padding:10px}
  .plate-camera-title{font-size:18px}
  .plate-camera-help{font-size:12px;margin-bottom:6px}
  .plate-camera-stage{height:min(44dvh,300px);min-height:210px;aspect-ratio:auto}
  .plate-camera-guide{left:6%;right:6%;top:36%;height:28%}
  .plate-camera-actions{grid-template-columns:2fr 1fr}
}

@media(max-width:430px){
  .plate-camera-stage{height:min(42dvh,270px);min-height:200px}
  .plate-camera-guide{left:5%;right:5%;top:37%;height:27%}
  .plate-camera-actions .btn{min-height:46px;font-size:14px;padding:10px}
}

.ticket-module-overlay{position:fixed;inset:0;z-index:150;background:#0008;display:flex;align-items:center;justify-content:center;padding:18px}
.ticket-module-shell{width:min(980px,100%);max-height:calc(100dvh - 36px);background:#f8fafc;border-radius:18px;box-shadow:0 24px 80px #0006;display:flex;flex-direction:column;overflow:hidden}
.ticket-module-header{display:flex;justify-content:space-between;gap:16px;align-items:flex-start;padding:18px 20px;background:#fff;border-bottom:1px solid var(--border)}
.ticket-module-header h2{margin:2px 0 4px;font-size:25px}
.ticket-module-eyebrow{font-size:12px;font-weight:800;color:var(--blue);text-transform:uppercase;letter-spacing:.6px}
.ticket-module-close{border:0;background:#eef2f6;color:#101828;width:42px;height:42px;border-radius:999px;font-size:28px;line-height:1;cursor:pointer;flex:0 0 auto}
.ticket-module-tabs{display:flex;gap:8px;padding:10px 14px;background:#fff;border-bottom:1px solid var(--border);overflow-x:auto}
.ticket-module-tab{border:1px solid var(--border);background:#fff;color:#344054;border-radius:10px;padding:10px 14px;font-weight:700;white-space:nowrap;cursor:pointer}
.ticket-module-tab.active{background:var(--navy);color:#fff;border-color:var(--navy)}
.ticket-module-body{padding:18px;overflow:auto}
.ticket-module-pane{display:none}
.ticket-module-pane.active{display:block}
.module-section-heading h3{margin:0 0 4px;font-size:22px}
.module-section-heading p{margin:0 0 14px}
.module-form{background:#fff;border:1px solid var(--border);border-radius:14px;padding:16px}
.ticket-module-officer-signature{display:grid;grid-template-columns:minmax(180px,.8fr) minmax(260px,1.2fr);gap:14px;align-items:center;background:#fff;border:1px solid var(--border);border-radius:14px;padding:14px 16px;margin:0 0 14px}
.ticket-module-officer-signature-label{display:flex;flex-direction:column;gap:4px}
.ticket-module-officer-signature-label b{font-size:15px}
.ticket-module-officer-signature-label span{font-size:12px;color:var(--muted)}
.ticket-module-officer-signature-image{min-height:78px;display:flex;align-items:center;justify-content:flex-start;background:#fff;border:1px solid #d0d5dd;border-radius:10px;padding:8px 12px}
.ticket-module-officer-signature-image img{display:block;max-width:280px;max-height:62px;object-fit:contain;object-position:left center}
.internal-ticket-signature-thumb{display:block;max-width:130px;max-height:38px;object-fit:contain;object-position:left center;background:#fff;margin-top:4px}
.module-grid{display:grid;gap:12px}
.module-grid.two{grid-template-columns:repeat(2,minmax(0,1fr))}
.module-form .field{margin:0}
.module-form input,.module-form select,.module-form textarea{width:100%}
.module-actions{display:flex;gap:10px;justify-content:flex-end;margin-top:16px;padding-top:14px;border-top:1px solid #e5e7eb}
.module-action-card{background:#fff;border:1px solid var(--border);border-radius:14px;padding:16px}
.module-action-card h4{margin:0 0 6px;font-size:18px}
.danger-zone{border-color:#f3b5af;background:#fffafa}
.danger-zone h4{color:var(--red)}

/* Full-screen Court case workspace */
.court-workspace-overlay{padding:0;align-items:stretch;background:#edf1f5}
.court-workspace-shell{width:100vw;height:100dvh;max-height:100dvh;border-radius:0;box-shadow:none}
.court-workspace-shell .ticket-module-body{flex:1;padding:18px 22px 28px}
.court-case-summary{background:#fff;border:1px solid var(--border);border-radius:14px;padding:16px 18px;margin-bottom:16px}
.court-case-summary-head{display:flex;justify-content:space-between;align-items:flex-start;gap:14px;margin-bottom:12px}
.court-case-summary-head h3{font-size:24px;margin:3px 0 0}
.court-case-facts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px 18px}
.court-case-facts>div{display:flex;flex-direction:column;gap:3px;min-width:0}
.court-case-facts>div.span-two{grid-column:span 2}
.court-case-facts span{font-size:11px;text-transform:uppercase;letter-spacing:.45px;font-weight:800;color:var(--muted)}
.court-case-facts b{font-size:14px;overflow-wrap:anywhere}
.court-workspace-grid{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(340px,.65fr);gap:18px;align-items:start}
.court-workspace-main{min-width:0}
.court-workspace-side{display:grid;gap:16px;min-width:0}
.court-side-card{background:#fff;border:1px solid var(--border);border-radius:14px;padding:15px}
.court-side-card-head{display:flex;justify-content:space-between;gap:12px;align-items:flex-start;margin-bottom:12px}
.court-side-card-head h3{margin:3px 0 0;font-size:20px}
.court-side-empty{padding:14px 4px}
.court-related-ticket{display:block;width:100%;text-align:left;border:1px solid var(--border);background:#fff;border-radius:11px;padding:11px 12px;margin:0 0 9px;cursor:pointer;color:inherit}
.court-related-ticket:hover{border-color:#98a2b3;background:#f8fafc}
.court-related-ticket:disabled{opacity:.65;cursor:wait}
.court-related-top,.court-related-bottom{display:flex;justify-content:space-between;gap:10px;align-items:center}
.court-related-plate{font-weight:750;margin-top:6px}
.court-related-owner,.court-related-meta{font-size:12px;color:var(--muted);margin-top:3px}
.court-related-bottom{margin-top:7px;padding-top:7px;border-top:1px solid #eaecf0;font-size:12px}
.court-note-form{border-bottom:1px solid var(--border);padding-bottom:13px;margin-bottom:12px}
.court-note-form textarea{width:100%;min-height:92px}
.court-note-actions{display:flex;justify-content:space-between;gap:10px;align-items:center;margin-top:8px}
.court-note-entry{border-left:4px solid var(--blue);background:#f8fafc;border-radius:9px;padding:10px 11px;margin-bottom:9px}
.court-note-entry-head{display:flex;justify-content:space-between;gap:12px;align-items:baseline}
.court-note-entry-head span{font-size:11px;color:var(--muted);white-space:nowrap}
.court-note-role{font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.45px;color:var(--blue);margin-top:2px}
.court-note-text{font-size:13px;line-height:1.45;margin-top:7px;overflow-wrap:anywhere}

@media(max-width:1050px){
  .court-workspace-grid{grid-template-columns:1fr}
  .court-case-facts{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:650px){
  .court-workspace-shell .ticket-module-body{padding:12px}
  .court-case-facts{grid-template-columns:1fr}
  .court-case-facts>div.span-two{grid-column:auto}
  .court-note-actions{align-items:stretch;flex-direction:column}
  .court-note-actions .btn{width:100%}
}
@media(max-width:700px){
  .ticket-module-overlay{padding:0;align-items:stretch}
  .ticket-module-shell{width:100%;max-height:100dvh;height:100dvh;border-radius:0}
  .ticket-module-header{padding:14px}
  .ticket-module-header h2{font-size:21px}
  .ticket-module-tabs{padding:8px}
  .ticket-module-body{padding:12px}
  .module-grid.two{grid-template-columns:1fr}
  .ticket-module-officer-signature{grid-template-columns:1fr}
  .ticket-module-officer-signature-image{min-height:68px}
  .module-form{padding:13px}
  .module-actions{display:grid;grid-template-columns:1fr}
  .module-actions .btn{width:100%}
}

.dashboard-scene{
  min-height:calc(100vh - 150px);
  border-radius:18px;
  overflow:hidden;
  background:
    url('/assets/hamilton-dashboard-exact.jpg?v=20260925-exact1') center center / cover no-repeat;
  box-shadow:0 14px 40px #0002;
  position:relative
}
.dashboard-scene-overlay{
  min-height:inherit;
  padding:34px;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  gap:26px;
  background:
    linear-gradient(180deg,rgba(4,21,39,0) 0%,rgba(4,21,39,.08) 52%,rgba(4,21,39,.42) 100%)
}
.dashboard-welcome{color:#fff;max-width:720px;text-shadow:0 2px 12px #0008}
.dashboard-kicker{font-size:13px;font-weight:800;letter-spacing:.7px;text-transform:uppercase;opacity:.9}
.dashboard-welcome h2{font-size:34px;margin:6px 0}
.dashboard-welcome p{margin:0;font-size:16px}
.dashboard-stat-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.dashboard-stat{
  appearance:none;
  border:1px solid #ffffff66;
  background:#fffffff0;
  color:#101828;
  border-radius:16px;
  padding:20px;
  text-align:left;
  cursor:pointer;
  box-shadow:0 10px 28px #0003;
  backdrop-filter:blur(7px);
  transition:transform .12s ease,box-shadow .12s ease,border-color .12s ease
}
.dashboard-stat:hover,.dashboard-stat:focus-visible{
  transform:translateY(-2px);
  box-shadow:0 14px 34px #0004;
  border-color:#fff;
  outline:none
}
.dashboard-stat-label{font-size:14px;color:#475467;font-weight:800;text-transform:uppercase;letter-spacing:.45px}
.dashboard-stat-number{font-size:29px;font-weight:900;margin-top:6px}
.dashboard-stat-value{margin-top:7px;font-size:17px;font-weight:800;color:#101828}
.dashboard-stat-owed{margin-top:3px;font-size:13px;color:#475467}
.dashboard-stat-open{margin-top:15px;font-weight:800;color:var(--blue)}
.dashboard-ticket-shell{width:min(1120px,100%)}
.dashboard-ticket-table-wrap{overflow:auto;background:#fff;border:1px solid var(--border);border-radius:12px}
.dashboard-ticket-table{min-width:820px}
.dashboard-ticket-row{cursor:pointer}
.dashboard-ticket-row:hover{background:#f0f6fb}
.dashboard-ticket-pager{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:14px}
.dashboard-ticket-pager .btn[disabled]{opacity:.45;cursor:not-allowed}

@media(max-width:1100px){
  .dashboard-stat-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}

body.phone-mode .dashboard-scene{min-height:calc(100dvh - 105px);border-radius:14px}
body.phone-mode .dashboard-scene-overlay{padding:16px;justify-content:flex-end;gap:16px}
body.phone-mode .dashboard-welcome h2{font-size:27px}
body.phone-mode .dashboard-stat-grid{grid-template-columns:1fr}
body.phone-mode .dashboard-stat{padding:16px}
body.phone-mode .dashboard-stat-number{font-size:25px}

@media(max-width:760px){
  .dashboard-scene-overlay{padding:20px}
  .dashboard-stat-grid{grid-template-columns:1fr}
  .dashboard-welcome h2{font-size:28px}
  .dashboard-ticket-pager{flex-wrap:wrap}
}

.workspace-hero{display:flex;justify-content:space-between;gap:18px;align-items:stretch;background:linear-gradient(135deg,#0d2a4a,#1769aa);color:#fff;border-radius:16px;padding:20px;margin-bottom:14px;box-shadow:0 10px 28px #0d2a4a22}
.workspace-hero h2{margin:0 0 6px;font-size:26px}
.workspace-hero p{margin:0;max-width:720px;color:#e7eff8}
.workspace-kpis{display:grid;grid-template-columns:repeat(3,minmax(120px,1fr));gap:10px;min-width:min(500px,45vw)}
.workspace-kpis>div{background:#ffffff17;border:1px solid #ffffff35;border-radius:12px;padding:12px 14px;backdrop-filter:blur(6px)}
.workspace-kpis span{display:block;font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.4px;color:#dce9f5}
.workspace-kpis b{display:block;font-size:24px;margin-top:4px}
.workspace-search-card input{border:1px solid var(--border);border-radius:8px;font:inherit}
.module-table-wrap{overflow:auto;border:1px solid #e2e8f0;border-radius:10px}
.module-table-wrap table{min-width:780px;background:#fff}
.module-table-wrap tbody tr:hover{background:#f8fbfe}
.module-empty{padding:22px;text-align:center;background:#f8fafc;border:1px dashed #cbd5e1;border-radius:10px}
.court-row-actions{display:flex;gap:6px;flex-wrap:wrap}
.court-row-actions .btn{padding:8px 10px;font-size:12px}
@media(max-width:900px){
  .workspace-hero{display:block}
  .workspace-kpis{min-width:0;margin-top:14px;grid-template-columns:repeat(3,1fr)}
}
@media(max-width:620px){
  .workspace-kpis{grid-template-columns:1fr}
  .workspace-hero{padding:15px}
  .workspace-hero h2{font-size:22px}
}


/* HPD UI consistency update */
.field label{font-weight:800;color:#1d2939}
.field input,.field select,.field textarea,
.module-form input,.module-form select,.module-form textarea,
.workspace-search-card input{
  border:2px solid #667085!important;
  background:#fff!important;
  color:#101828;
  font-weight:600;
  box-shadow:0 1px 2px #10182812,inset 0 0 0 1px #ffffff;
}
.field input:focus,.field select:focus,.field textarea:focus,
.module-form input:focus,.module-form select:focus,.module-form textarea:focus,
.workspace-search-card input:focus{
  border-color:var(--blue)!important;
  outline:3px solid #1769aa26;
  outline-offset:0;
}
.field input:disabled,.field select:disabled,.field textarea:disabled{
  background:#eef2f6!important;
  color:#475467;
}

/* Keep all conventional push buttons visually consistent. */
.btn,.btn.secondary,.btn.light,.btn.danger,
.tabs button,.ticket-module-tab,.ticket-module-close{
  background:var(--blue)!important;
  color:#fff!important;
  border:1px solid var(--navy)!important;
  box-shadow:0 1px 3px #0d2a4a22;
  font-weight:600;
  letter-spacing:0;
}
.btn:hover,.btn:focus-visible,
.tabs button:hover,.tabs button:focus-visible,
.ticket-module-tab:hover,.ticket-module-tab:focus-visible,
.ticket-module-close:hover,.ticket-module-close:focus-visible{
  background:var(--navy)!important;
  color:#fff!important;
  outline:3px solid #1769aa33;
  outline-offset:1px;
}
.btn[disabled]{opacity:.48;cursor:not-allowed}

/* Sidebar navigation uses the same button family while retaining the dark sidebar. */
.nav button{
  background:var(--blue);
  color:#fff;
  border:1px solid #ffffff55;
  font-weight:600;
  box-shadow:0 1px 3px #0002;
}
.nav button.active,.nav button:hover{background:#0b5792;border-color:#fff}

/* Transparent Hamilton PD patch supplied by HPD; display without filters or clipping. */
.side>img{
  width:100px;
  height:auto;
  display:block;
  margin:0 auto;
  background:transparent;
  border:0;
  box-shadow:none;
  mix-blend-mode:normal;
  filter:none;
  clip-path:none;
  object-fit:contain;
}
body.phone-mode.phone-nav-open .side>img{
  width:76px;
  height:auto;
  mix-blend-mode:normal;
  filter:none;
  clip-path:none;
  background:transparent;
}

.audit-filter-actions{margin-top:8px;padding:10px 0;border-top:1px solid #d0d5dd}
.audit-delete-filter{display:flex;align-items:center;gap:7px;padding:9px 12px;border:2px solid #667085;border-radius:8px;background:#fff}
.audit-delete-filter input{width:18px;height:18px}
.audit-deletion-row{background:#fff4f2}
.audit-deletion-row td{border-bottom-color:#f3b5af}

.public-qr-card{text-align:center}
.public-qr-wrap{display:flex;justify-content:center;align-items:center;padding:12px}
.public-qr-image{width:220px;max-width:70vw;height:auto;border:8px solid #fff;box-shadow:0 0 0 1px #cfd6df}
.ticket-qr-preview{display:flex;align-items:center;gap:16px;margin:14px 0;padding:12px;border:1px solid #cfd6df;border-radius:10px;background:#f8fafc}
.ticket-qr-preview img{width:150px;height:150px;object-fit:contain;background:#fff;border:6px solid #fff;box-shadow:0 0 0 1px #cfd6df}
@media(max-width:700px){.ticket-qr-preview{flex-direction:column;text-align:center}.ticket-qr-preview img{width:180px;height:180px}}


/* Integrated action icons */
.ui-icon{
  width:18px;
  height:18px;
  flex:0 0 18px;
  display:block;
  color:currentColor;
}
.btn,
.ticket-module-tab,
.nav button{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
}
.nav button{
  justify-content:flex-start;
}
.nav button .ui-icon{
  width:19px;
  height:19px;
  flex-basis:19px;
  opacity:.96;
}
.ticket-module-tab .ui-icon{
  width:20px;
  height:20px;
  flex-basis:20px;
}
.ticket-module-tab span,
.btn span,
.nav button span{
  line-height:1.15;
}
body.phone-mode.phone-nav-open .side .nav button{
  display:flex;
  justify-content:flex-start;
  text-align:left;
}
body.phone-mode .btn .ui-icon{
  width:20px;
  height:20px;
  flex-basis:20px;
}


/* Android Chrome mobile gate */
.browser-gate-wrap{
  min-height:100dvh;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:20px;
  background:#eef2f6
}
.browser-gate-card{
  width:min(520px,100%);
  background:#fff;
  border:1px solid var(--border);
  border-radius:18px;
  padding:24px;
  text-align:center;
  box-shadow:0 18px 45px #102f4f1f
}
.browser-gate-logo{
  display:block;
  width:100px;
  height:100px;
  object-fit:contain;
  margin:0 auto 10px
}
.browser-gate-kicker{
  color:var(--muted);
  font-size:12px;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.7px
}
.browser-gate-card h1{
  margin:8px 0 10px;
  font-size:26px;
  color:var(--navy)
}
.browser-gate-card p{
  line-height:1.45;
  margin:0 0 18px
}
.browser-gate-card .btn{
  width:100%;
  min-height:50px;
  margin-top:8px
}
.browser-gate-primary{
  font-size:16px
}
.browser-gate-help{
  margin-top:16px;
  color:var(--muted);
  font-size:12px;
  line-height:1.4
}
.install-app-button{
  white-space:nowrap
}
body.phone-mode .install-app-button{
  width:auto!important
}
@media(max-width:520px){
  .browser-gate-wrap{padding:12px}
  .browser-gate-card{padding:20px 16px;border-radius:14px}
  .browser-gate-logo{width:86px;height:86px}
  .browser-gate-card h1{font-size:23px}
  body.phone-mode .install-app-button{
    font-size:12px;
    padding:8px 9px
  }
}


/* iPhone Home Screen install */
.ios-install-shell{
  max-width:560px
}
.ios-install-steps{
  display:grid;
  gap:10px;
  margin:6px 0 16px
}
.ios-install-step{
  display:grid;
  grid-template-columns:34px 1fr;
  gap:10px;
  align-items:start;
  padding:10px;
  border:1px solid var(--border);
  border-radius:10px;
  background:#f8fafc
}
.ios-install-step>span{
  display:flex;
  width:30px;
  height:30px;
  align-items:center;
  justify-content:center;
  border-radius:50%;
  background:var(--navy);
  color:#fff;
  font-weight:800
}
.ios-install-step>div{
  padding-top:4px;
  line-height:1.35
}
body.phone-mode .ios-install-shell .btn{
  width:100%
}


/* Mobile header and Print Stations alignment fix */
body.phone-mode{
  overflow-x:hidden
}
body.phone-mode #app,
body.phone-mode .layout,
body.phone-mode .main,
body.phone-mode .top,
body.phone-mode #content{
  width:100%;
  max-width:100%;
  min-width:0
}
body.phone-mode .top{
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:8px;
  align-items:start;
  overflow:visible
}
body.phone-mode .top>div:first-child{
  width:100%;
  min-width:0
}
body.phone-mode .top h1{
  max-width:100%;
  overflow-wrap:anywhere
}
body.phone-mode .top-actions{
  width:100%;
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:8px;
  align-items:stretch
}
body.phone-mode .top-actions .btn{
  width:100%!important;
  min-width:0;
  max-width:100%;
  white-space:normal;
  text-align:center;
  justify-content:center;
  padding:10px 8px
}
body.phone-mode .install-app-button{
  grid-column:1 / -1
}
body.phone-mode .print-stations-table{
  display:block;
  width:100%;
  min-width:0!important;
  border-collapse:separate
}
body.phone-mode .print-stations-table thead{
  display:none
}
body.phone-mode .print-stations-table tbody{
  display:grid;
  gap:10px
}
body.phone-mode .print-stations-table tr{
  display:block;
  width:100%;
  border:1px solid var(--border);
  border-radius:12px;
  background:#fff;
  padding:6px 10px
}
body.phone-mode .print-stations-table td{
  display:grid;
  grid-template-columns:minmax(104px,36%) minmax(0,1fr);
  gap:10px;
  width:100%;
  padding:9px 0;
  border-bottom:1px solid var(--border);
  vertical-align:top;
  overflow-wrap:anywhere
}
body.phone-mode .print-stations-table td:last-child{
  border-bottom:0
}
body.phone-mode .print-stations-table td::before{
  content:attr(data-label);
  font-size:12px;
  font-weight:800;
  color:var(--muted);
  line-height:1.3
}
body.phone-mode .print-stations-table td .btn{
  width:100%!important;
  margin:0
}
body.phone-mode .zebra-stations-table td:nth-child(2) .badge{
  white-space:normal;
  display:inline-flex
}
@media(max-width:520px){
  body.phone-mode .top-actions{
    grid-template-columns:1fr 1fr
  }
  body.phone-mode .install-app-button{
    grid-column:1 / -1
  }
  body.phone-mode .print-stations-table td{
    grid-template-columns:96px minmax(0,1fr)
  }
}


/* 2026-09-24 quick actions + multi-violation update */
.top-role-badge{margin-left:8px;vertical-align:middle}
.top-actions.quick-actions-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(140px,1fr));
  gap:8px;
  align-items:stretch;
}
.top-actions.quick-actions-grid .btn{
  width:100%;
  min-height:46px;
  white-space:normal;
  text-align:center;
  justify-content:center;
}
.violation-heading-row{justify-content:space-between;align-items:flex-start}
.violation-heading-row>div:first-child{min-width:0}
.violation-heading-row h2{margin:0 0 4px}
.violation-heading-row p{margin:0}
.violation-heading-row #addViolationBtn{flex:0 0 auto}
.violation-rows{display:grid;gap:12px;margin-top:14px}
.violation-entry{
  border:1px solid var(--border);
  border-radius:12px;
  padding:14px;
  background:#f8fafc;
}
.violation-entry-header{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:10px;
  margin-bottom:10px;
}
.violation-entry-title{font-weight:900;font-size:16px;color:var(--navy)}
.violation-entry .remove-violation-btn{width:auto!important;min-width:92px}
.violation-entry .violation-fine-box{margin-top:10px}
.violation-entry .violation-status{margin-top:8px}
.violation-entry .violation-exp-fields{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px;
}

body.phone-mode .top-role-badge{
  display:inline-flex;
  margin-left:6px;
  vertical-align:middle;
}
body.phone-mode .top-actions.quick-actions-grid{
  width:100%;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:8px;
}
body.phone-mode .top-actions.quick-actions-grid .btn{
  width:100%!important;
  min-width:0;
  min-height:54px;
  padding:10px 8px;
  font-size:14px;
  line-height:1.15;
}
body.phone-mode .install-app-button{
  grid-column:auto!important;
}
body.phone-mode .violation-heading-row{
  display:grid;
  grid-template-columns:1fr;
  gap:10px;
}
body.phone-mode .violation-heading-row #addViolationBtn{width:100%!important}
body.phone-mode .violation-entry{padding:12px}
body.phone-mode .violation-entry-header{align-items:stretch}
body.phone-mode .violation-entry .remove-violation-btn{
  width:auto!important;
  min-height:42px;
  padding:8px 12px;
}
body.phone-mode .violation-entry .violation-exp-fields{grid-template-columns:1fr}
@media(max-width:520px){
  .top-actions.quick-actions-grid{grid-template-columns:1fr 1fr;min-width:0}
  .top-role-badge{display:inline-flex;margin-top:5px;margin-left:0}
}


/* Admin violation dropdown ordering */
.violation-order-controls{
  display:flex;
  gap:6px;
  align-items:center;
}
.violation-order-controls .btn{
  width:40px!important;
  min-width:40px;
  height:40px;
  min-height:40px;
  padding:0;
  font-size:20px;
  font-weight:900;
}
.violation-order-controls .vio-position{
  width:64px!important;
  min-width:64px;
  height:40px;
  min-height:40px;
  padding:5px 7px;
  text-align:center;
  font-weight:800;
  border:2px solid #667085;
  border-radius:8px;
  background:#fff;
}
.violation-order-controls .btn[disabled]{
  opacity:.3;
}
.violation-order-table td:first-child{
  text-align:center;
}
@media(max-width:700px){
  body.phone-mode .violation-order-wrap{
    overflow:visible;
    border:0;
  }
  body.phone-mode .violation-order-table{
    display:block;
    min-width:0;
  }
  body.phone-mode .violation-order-table thead{
    display:none;
  }
  body.phone-mode .violation-order-table tbody{
    display:grid;
    gap:10px;
  }
  body.phone-mode .violation-order-table tr{
    display:block;
    border:1px solid var(--border);
    border-radius:12px;
    padding:8px 12px;
    background:#fff;
  }
  body.phone-mode .violation-order-table td{
    display:grid;
    grid-template-columns:92px minmax(0,1fr);
    gap:10px;
    width:100%;
    padding:8px 0;
    border-bottom:1px solid var(--border);
    text-align:left;
  }
  body.phone-mode .violation-order-table td:last-child{
    border-bottom:0;
  }
  body.phone-mode .violation-order-table td::before{
    content:attr(data-label);
    font-size:12px;
    font-weight:800;
    color:var(--muted);
  }
  body.phone-mode .violation-order-controls{
    justify-content:flex-start;
  }
  body.phone-mode .violation-order-controls .btn{
    width:48px!important;
    min-width:48px;
    min-height:44px;
  }
  body.phone-mode .violation-order-controls .vio-position{
    width:70px!important;
    min-width:70px;
    min-height:44px;
    font-size:16px;
  }
}


/* Dashboard user breakdown */
.dashboard-section-label{
  color:#fff;
  font-size:13px;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.55px;
  margin-bottom:-12px;
}
.dashboard-user-breakdown{
  margin-top:18px;
  display:grid;
  gap:16px;
}
.dashboard-breakdown-heading{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:6px;
}
.dashboard-breakdown-heading h2{
  margin:0;
}
.dashboard-breakdown-heading p{
  margin:0;
}
.dashboard-user-block{
  background:#fff;
  border:1px solid var(--border);
  border-radius:16px;
  padding:16px;
  box-shadow:0 8px 24px #0000000d;
}
.dashboard-user-heading{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  margin-bottom:12px;
}
.dashboard-user-heading h3{
  margin:0 0 3px;
  font-size:19px;
}
.dashboard-user-total{
  flex:0 0 auto;
  border:1px solid var(--border);
  background:#f8fafc;
  border-radius:10px;
  padding:9px 12px;
  font-size:13px;
}
.dashboard-user-total b{
  font-size:18px;
  margin-right:4px;
}
.dashboard-user-stat-grid .dashboard-stat{
  box-shadow:none;
  border-color:#d9e1ea;
  background:#fdfefe;
}
@media(max-width:760px){
  .dashboard-breakdown-heading,
  .dashboard-user-heading{
    align-items:flex-start;
    flex-direction:column;
  }
  .dashboard-user-total{
    width:100%;
  }
}


/* Dashboard user dropdown */
.dashboard-user-picker{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:6px;
  margin-top:8px;
  padding:0;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
}
.dashboard-user-picker label{
  font-size:13px;
  font-weight:900;
  color:var(--navy);
  text-transform:uppercase;
  letter-spacing:.45px;
}
.dashboard-user-picker select{
  min-width:320px;
  max-width:420px;
  height:48px;
  border:2px solid var(--blue);
  border-radius:9px;
  background:#fff;
  padding:0 40px 0 14px;
  font:inherit;
  font-size:15px;
  font-weight:800;
  color:#101828;
  box-shadow:0 2px 8px #00000012;
}
.dashboard-user-picker select:focus{
  outline:3px solid #1769aa2e;
  outline-offset:2px;
}
#dashboardSelectedUser{
  min-width:0;
}
@media(max-width:760px){
  .dashboard-user-picker{
    width:100%;
    align-items:stretch;
    flex-direction:column;
  }
  .dashboard-user-picker select{
    width:100%;
    max-width:none;
    min-width:0;
  }
}


/* Public QR related tickets */
.public-related-tickets{
  border:2px solid #c9d9e8;
}
.public-related-tickets h2{
  margin-bottom:4px;
}
.public-related-table-wrap{
  margin-top:12px;
  overflow:auto;
  border:1px solid var(--border);
  border-radius:10px;
  background:#fff;
}
.public-related-table{
  min-width:720px;
}
.public-related-table th{
  background:#f1f5f9;
  font-weight:800;
}
.public-related-total{
  margin-top:12px;
  font-size:16px;
}
@media(max-width:700px){
  .public-related-table{
    min-width:640px;
  }
  .public-related-tickets{
    overflow:hidden;
  }
}


/* Public ticket branded header + outstanding ticket shortcut */
.public-header{
  background:#6f8f3f;
  color:#fff;
  padding:0;
}
.public-header-content{
  display:flex;
  align-items:center;
  gap:22px;
  padding-top:16px;
  padding-bottom:16px;
}
.public-village-logo{
  display:block;
  width:min(448px,48vw);
  max-height:150px;
  height:auto;
  object-fit:contain;
  border:0;
  border-radius:0;
  box-shadow:none;
}
.public-header-copy{
  min-width:0;
  flex:1;
}
.public-header-copy h1{
  margin:0 0 5px;
  font-size:30px;
  line-height:1.08;
}
.public-header-copy>div{
  font-size:16px;
  margin-bottom:14px;
}
.public-outstanding-link{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:44px;
  padding:10px 16px;
  border-radius:9px;
  background:#fff;
  color:#0d2a4a;
  font-weight:900;
  text-decoration:none;
  box-shadow:0 3px 12px #0003;
}
.public-outstanding-link:hover,
.public-outstanding-link:focus-visible{
  text-decoration:underline;
  outline:3px solid #ffffff66;
  outline-offset:2px;
}
.public-related-tickets{
  scroll-margin-top:18px;
}
.public-related-ticket-link{
  color:var(--blue);
  font-weight:800;
  text-decoration:underline;
}
@media(max-width:760px){
  .public-header-content{
    flex-direction:column;
    align-items:flex-start;
    gap:12px;
  }
  .public-village-logo{
    width:100%;
    max-width:448px;
  }
  .public-header-copy h1{
    font-size:26px;
  }
  .public-outstanding-link{
    width:100%;
  }
}


/* Keep violation reorder controls fully visible on desktop */
.violation-order-wrap{
  width:100%;
  max-width:100%;
  overflow-x:hidden;
}
.violation-order-table{
  width:100%;
  min-width:0!important;
  table-layout:fixed;
}
.violation-order-table th,
.violation-order-table td{
  overflow-wrap:anywhere;
}
.violation-order-table th:nth-child(1),
.violation-order-table td:nth-child(1){width:7%}
.violation-order-table th:nth-child(2),
.violation-order-table td:nth-child(2){width:17%}
.violation-order-table th:nth-child(3),
.violation-order-table td:nth-child(3){width:auto}
.violation-order-table th:nth-child(4),
.violation-order-table td:nth-child(4){width:11%}
.violation-order-table th:nth-child(5),
.violation-order-table td:nth-child(5){width:13%}
.violation-order-table th:nth-child(6),
.violation-order-table td:nth-child(6){width:9%}
.violation-order-table th:nth-child(7),
.violation-order-table td:nth-child(7){width:19%}
.violation-order-table th:nth-child(8),
.violation-order-table td:nth-child(8){width:9%}
.violation-order-controls{
  justify-content:center;
  gap:4px;
  flex-wrap:nowrap;
}
.violation-order-controls .btn{
  width:34px!important;
  min-width:34px;
  height:38px;
  min-height:38px;
}
.violation-order-controls .vio-position{
  width:50px!important;
  min-width:50px;
  height:38px;
  min-height:38px;
  padding:4px;
}
.violation-order-table .vio-edit{
  min-width:0!important;
  width:100%!important;
  padding:8px 6px!important;
  font-size:12px;
}
@media(max-width:1150px) and (min-width:701px){
  .violation-order-table th,
  .violation-order-table td{
    padding-left:6px;
    padding-right:6px;
    font-size:12px;
  }
  .violation-order-controls .btn{
    width:30px!important;
    min-width:30px;
  }
  .violation-order-controls .vio-position{
    width:44px!important;
    min-width:44px;
  }
}

@media(max-width:700px){
  body.phone-mode .violation-order-wrap{
    overflow:visible;
  }
  body.phone-mode .violation-order-table{
    display:block;
    width:100%;
    min-width:0!important;
    table-layout:auto;
  }
  body.phone-mode .violation-order-table th,
  body.phone-mode .violation-order-table td{
    width:100%!important;
  }
  body.phone-mode .violation-order-controls{
    justify-content:flex-start;
  }
  body.phone-mode .violation-order-controls .btn{
    width:48px!important;
    min-width:48px;
    min-height:44px;
  }
  body.phone-mode .violation-order-controls .vio-position{
    width:70px!important;
    min-width:70px;
    min-height:44px;
  }
}


/* Full-page violation editor */
.violation-editor-page{
  width:100%;
  max-width:1180px;
  margin:0 auto;
  display:grid;
  gap:16px;
}
.violation-editor-topbar{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:18px;
}
.violation-editor-topbar h2{
  margin:2px 0 6px;
  font-size:30px;
}
.violation-editor-topbar p{
  margin:0;
  max-width:820px;
  line-height:1.45;
}
.module-eyebrow{
  font-size:12px;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.6px;
  color:var(--blue);
}
.violation-editor-summary{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:10px;
}
.violation-editor-summary>div{
  background:#fff;
  border:1px solid var(--border);
  border-radius:12px;
  padding:12px 14px;
}
.violation-editor-summary span,
.violation-record-info span{
  display:block;
  font-size:11px;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.45px;
  color:#667085;
}
.violation-editor-summary b{
  display:block;
  margin-top:5px;
  font-size:18px;
}
.violation-editor-tabs{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  padding:8px;
  background:#eef2f6;
  border:1px solid var(--border);
  border-radius:12px;
}
.violation-editor-tab{
  border:1px solid transparent;
  border-radius:9px;
  background:transparent;
  color:#344054;
  padding:11px 14px;
  font:inherit;
  font-weight:800;
  cursor:pointer;
}
.violation-editor-tab.active{
  background:var(--navy);
  color:#fff;
  border-color:var(--navy);
}
.violation-editor-panel{
  display:none;
}
.violation-editor-panel.active{
  display:block;
}
.violation-editor-panel .card{
  padding:22px;
}
.violation-editor-panel h3{
  margin:0 0 14px;
  font-size:23px;
}
.violation-editor-form .span-two{
  grid-column:1 / -1;
}
.violation-editor-form textarea{
  width:100%;
  resize:vertical;
}
.violation-editor-check{
  display:flex;
  align-items:flex-start;
  gap:12px;
  padding:14px;
  margin-top:10px;
  border:1px solid var(--border);
  border-radius:10px;
  background:#f8fafc;
  cursor:pointer;
}
.violation-editor-check input{
  width:20px;
  height:20px;
  margin-top:1px;
}
.violation-editor-check span{
  display:grid;
  gap:4px;
}
.violation-editor-check small{
  color:#667085;
  line-height:1.35;
}
.violation-record-info{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:10px;
  margin-top:16px;
  padding-top:16px;
  border-top:1px solid var(--border);
}
.violation-record-info>div{
  background:#f8fafc;
  border-radius:9px;
  padding:10px 12px;
}
.violation-record-info b{
  display:block;
  margin-top:4px;
  font-size:13px;
  overflow-wrap:anywhere;
}
.violation-editor-actions{
  position:sticky;
  bottom:0;
  z-index:5;
  display:flex;
  justify-content:flex-end;
  gap:10px;
  padding:14px 0;
  background:linear-gradient(to bottom,#f4f6f900,#f4f6f9 24%);
}
.violation-editor-actions .btn{
  min-width:150px;
}
@media(max-width:760px){
  .violation-editor-topbar{
    flex-direction:column;
  }
  .violation-editor-topbar .btn{
    width:100%;
  }
  .violation-editor-summary{
    grid-template-columns:1fr 1fr;
  }
  .violation-editor-tabs{
    display:grid;
    grid-template-columns:1fr;
  }
  .violation-editor-tab{
    width:100%;
  }
  .violation-editor-panel .card{
    padding:14px;
  }
  .violation-editor-form .module-grid.two{
    grid-template-columns:1fr;
  }
  .violation-editor-form .span-two{
    grid-column:auto;
  }
  .violation-record-info{
    grid-template-columns:1fr;
  }
  .violation-editor-actions{
    display:grid;
    grid-template-columns:1fr;
  }
  .violation-editor-actions .btn{
    width:100%;
    min-width:0;
  }
}


/* Vehicle registration alignment */
#ticketForm .vehicle-registration-top{
  display:grid;
  grid-template-columns:minmax(150px,.85fr) minmax(0,2fr);
  gap:14px;
  align-items:start;
}
#ticketForm .vehicle-registration-top .field{
  min-width:0;
  width:100%;
  margin:12px 0;
}
#ticketForm .vehicle-registration-top .field select,
#ticketForm .vehicle-registration-top .field input{
  width:100%;
  min-width:0;
}
#ticketForm .plate-entry-row{
  width:100%;
  min-width:0;
}
#ticketForm .plate-entry-row input{
  width:100%;
  min-width:0;
}
#ticketForm .plate-camera-btn{
  min-width:150px;
}
#ticketForm .vehicle-grid{
  width:100%;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:12px;
  align-items:start;
}
#ticketForm .vehicle-grid .field{
  min-width:0;
  width:100%;
  margin:12px 0 0;
}
#ticketForm .vehicle-grid .field select,
#ticketForm .vehicle-grid .field input{
  display:block;
  width:100%;
  min-width:0;
  max-width:100%;
}
@media(max-width:1050px){
  #ticketForm .vehicle-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}
body.phone-mode #ticketForm .vehicle-registration-top{
  grid-template-columns:1fr;
  gap:4px;
}
body.phone-mode #ticketForm .plate-camera-btn{
  min-width:118px;
}
body.phone-mode #ticketForm .vehicle-grid{
  grid-template-columns:1fr 1fr;
  gap:8px;
}
@media(max-width:520px){
  body.phone-mode #ticketForm .vehicle-grid{
    grid-template-columns:1fr;
  }
}


/* 48-hour repeat-plate advisory */
.recent-ticket-overlay{
  z-index:185;
}
.recent-ticket-advisory-shell{
  width:calc(100vw - 48px)!important;
  max-width:720px!important;
  min-width:0!important;
  margin:auto!important;
  padding:26px!important;
  display:grid!important;
  gap:18px;
  overflow:auto;
}
.recent-ticket-advisory-icon{
  width:62px;
  height:62px;
  border-radius:999px;
  display:grid;
  place-items:center;
  background:#fff3cd;
  border:2px solid #e7b85c;
  color:#8a5a00;
  font-size:36px;
  font-weight:900;
}
.recent-ticket-advisory-copy h2{
  margin:4px 0 10px;
  font-size:27px;
}
.recent-ticket-advisory-copy p{
  margin:7px 0;
  line-height:1.45;
}
.recent-ticket-advisory-actions{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
}
.recent-ticket-advisory-actions .btn{
  min-height:52px;
}
.recent-ticket-review-shell{
  width:min(1120px,100%);
}
.recent-ticket-review-header{
  align-items:center;
}
.recent-ticket-review-header-actions{
  display:flex;
  gap:10px;
  flex:0 0 auto;
}
.recent-ticket-review-header .btn{
  flex:0 0 auto;
}
.recent-ticket-review-body{
  background:#f4f6f9;
}
.recent-ticket-list{
  display:grid;
  gap:12px;
}
.recent-ticket-card{
  background:#fff;
  border:1px solid var(--border);
  border-radius:14px;
  padding:16px;
  box-shadow:0 4px 14px #0000000b;
}
.recent-ticket-card-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:14px;
  margin-bottom:12px;
}
.recent-ticket-card-head h3{
  margin:2px 0 0;
  font-size:21px;
}
.recent-ticket-details{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:10px;
}
.recent-ticket-details>div{
  background:#f8fafc;
  border-radius:9px;
  padding:10px 12px;
  min-width:0;
}
.recent-ticket-details span{
  display:block;
  margin-bottom:4px;
  color:#667085;
  font-size:11px;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.4px;
}
.recent-ticket-details b{
  display:block;
  line-height:1.35;
  overflow-wrap:anywhere;
}
.recent-ticket-review-footer{
  display:flex;
  justify-content:flex-end;
  gap:10px;
  padding:14px 18px;
  border-top:1px solid var(--border);
  background:#fff;
}
.recent-ticket-review-footer .btn{
  min-width:190px;
}
@media(max-width:760px){
  .recent-ticket-advisory-shell{
    width:100%;
    min-height:100dvh;
    border-radius:0;
    align-content:center;
    padding:20px;
  }
  .recent-ticket-advisory-actions{
    grid-template-columns:1fr;
  }
  .recent-ticket-review-header{
    align-items:flex-start;
    flex-direction:column;
  }
  .recent-ticket-review-header-actions{
    width:100%;
    display:grid;
    grid-template-columns:1fr;
  }
  .recent-ticket-review-header .btn{
    width:100%;
  }
  .recent-ticket-details{
    grid-template-columns:1fr;
  }
  .recent-ticket-review-footer{
    display:grid;
    grid-template-columns:1fr;
  }
  .recent-ticket-review-footer .btn{
    width:100%;
    min-width:0;
  }
}


/* Repeat-ticket review primary choice bar */
.recent-ticket-review-choice{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
  margin:14px 0 18px;
  padding:14px;
  border:2px solid #cbd5e1;
  border-radius:12px;
  background:#fff;
  box-shadow:0 4px 16px #00000012;
}
.recent-ticket-review-choice .btn{
  min-height:56px;
  font-size:16px;
  font-weight:900;
}
.recent-ticket-cancel-main{
  border-width:2px!important;
}
@media(max-width:760px){
  .recent-ticket-review-choice{
    grid-template-columns:1fr;
    padding:12px;
  }
}


/* Repeat-ticket decision emphasis */
.recent-ticket-review-decision{
  margin:14px 0 18px;
  padding:18px;
  border:2px solid #9fb7cf;
  border-radius:14px;
  background:#ffffff;
  box-shadow:0 6px 20px #00000014;
}
.recent-ticket-review-decision-copy h3{
  margin:0 0 6px;
  font-size:20px;
}
.recent-ticket-review-decision-copy p{
  margin:0 0 14px;
  color:#475467;
  line-height:1.45;
}
.recent-ticket-review-decision .recent-ticket-review-choice{
  margin:0;
  padding:0;
  border:0;
  box-shadow:none;
}
.recent-ticket-cancel-main{
  background:#b42318!important;
  border-color:#b42318!important;
  color:#fff!important;
}
.recent-ticket-cancel-main:hover,
.recent-ticket-cancel-main:focus-visible{
  background:#912018!important;
  border-color:#912018!important;
}


/* Recent-ticket review: scroll the whole page, not just the middle */
.recent-ticket-review-shell{
  display:block!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  max-height:calc(100dvh - 36px)!important;
}
.recent-ticket-review-header{
  position:static!important;
}
.recent-ticket-review-body{
  overflow:visible!important;
}
.recent-ticket-review-footer{
  position:static!important;
}
@media(max-width:700px){
  .recent-ticket-review-shell{
    height:100dvh!important;
    max-height:100dvh!important;
    overflow-y:auto!important;
  }
  .recent-ticket-review-header,
  .recent-ticket-review-footer{
    position:static!important;
  }
  .recent-ticket-review-body{
    overflow:visible!important;
  }
}


/* Persistent 48-hour plate alert button */
.plate-input-alert-wrap{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:8px;
  min-width:0;
}
.plate-input-alert-wrap input{
  min-width:0;
  width:100%;
}
.recent-plate-alert-btn{
  width:auto!important;
  min-width:76px;
  min-height:58px;
  padding:6px 14px!important;
  background:#b42318!important;
  border-color:#b42318!important;
  color:#fff!important;
  font-weight:900!important;
  display:inline-flex!important;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:0;
  line-height:1;
}
.recent-plate-alert-word{
  display:block;
  font-size:12px;
  letter-spacing:.7px;
  font-weight:900;
}
.recent-plate-alert-mark{
  display:block;
  margin-top:2px;
  font-size:25px;
  line-height:.9;
  font-weight:900;
}
.recent-plate-alert-btn:hover,
.recent-plate-alert-btn:focus-visible{
  background:#912018!important;
  border-color:#912018!important;
}
.recent-plate-alert-btn[hidden]{
  display:none!important;
}
body.phone-mode .recent-plate-alert-btn{
  width:auto!important;
  min-width:76px;
}
@media(max-width:430px){
  .plate-input-alert-wrap{
    grid-template-columns:minmax(0,1fr) auto;
  }
  .recent-plate-alert-btn{
    min-width:70px;
    padding-left:10px!important;
    padding-right:10px!important;
  }
}


/* Recent-ticket clickable cards + evidence viewer */
.recent-ticket-card-clickable{
  cursor:pointer;
  transition:transform .12s ease,box-shadow .12s ease,border-color .12s ease;
}
.recent-ticket-card-clickable:hover,
.recent-ticket-card-clickable:focus-visible{
  transform:translateY(-1px);
  border-color:#8fb0cf;
  box-shadow:0 8px 22px #00000014;
  outline:3px solid #1769aa22;
  outline-offset:2px;
}
.recent-ticket-card-open{
  margin-top:12px;
  padding-top:12px;
  border-top:1px solid var(--border);
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  color:var(--blue);
}
.recent-ticket-photo-pill,
.recent-ticket-photo-count{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:30px;
  padding:5px 10px;
  border-radius:999px;
  font-size:12px;
  font-weight:900;
}
.recent-ticket-photo-pill.has-photos,
.recent-ticket-photo-count.has-photos{
  background:#e8f5e9;
  color:#176a2b;
  border:1px solid #aad8b3;
}
.recent-ticket-photo-pill.no-photos,
.recent-ticket-photo-count.no-photos{
  background:#f2f4f7;
  color:#667085;
  border:1px solid #d0d5dd;
}
.recent-ticket-photo-summary{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:10px;
  margin-bottom:16px;
}
.recent-ticket-photo-summary>div{
  background:#fff;
  border:1px solid var(--border);
  border-radius:10px;
  padding:11px 12px;
}
.recent-ticket-photo-summary span{
  display:block;
  margin-bottom:4px;
  color:#667085;
  font-size:11px;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.4px;
}
.recent-ticket-photo-heading{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:14px;
  margin-bottom:12px;
}
.recent-ticket-photo-heading h3{
  margin:0 0 4px;
  font-size:22px;
}
.recent-ticket-photo-heading p{
  margin:0;
}
.recent-ticket-photo-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:14px;
}
.recent-ticket-photo-card{
  display:block;
  overflow:hidden;
  border:1px solid var(--border);
  border-radius:12px;
  background:#fff;
  text-decoration:none;
  color:inherit;
}
.recent-ticket-photo-card img{
  display:block;
  width:100%;
  height:260px;
  object-fit:contain;
  background:#111;
}
.recent-ticket-photo-meta{
  display:grid;
  gap:4px;
  padding:10px 12px 12px;
}
.recent-ticket-photo-meta span{
  color:#667085;
  font-size:12px;
}
.recent-ticket-photo-open{
  color:var(--blue)!important;
  font-weight:800;
}
@media(max-width:760px){
  .recent-ticket-card-open{
    align-items:flex-start;
    flex-direction:column;
  }
  .recent-ticket-photo-summary{
    grid-template-columns:1fr;
  }
  .recent-ticket-photo-heading{
    flex-direction:column;
  }
  .recent-ticket-photo-grid{
    grid-template-columns:1fr;
  }
  .recent-ticket-photo-card img{
    height:auto;
    max-height:420px;
  }
}


/* Company agency launcher + agency switching (TEST MODE) */
.agency-launcher-wrap{
  min-height:100dvh;
  display:flex;
  align-items:flex-start;
  justify-content:center;
  padding:24px;
  overflow-y:auto;
  background:
    radial-gradient(circle at 18% 15%,#1f74b644 0 16%,transparent 17%),
    linear-gradient(145deg,#081d33,#0d2a4a 56%,#1769aa);
}
.agency-launcher-card{
  width:min(580px,100%);
  margin:auto 0;
  background:#fff;
  border-radius:24px;
  padding:34px 32px 30px;
  overflow:visible;
  box-shadow:0 26px 84px #0006;
}
.agency-launcher-header{
  display:flex;
  flex-direction:column;
  align-items:center;
  text-align:center;
}
.agency-company-logo{
  width:min(100%,430px);
  margin:0 auto 18px;
  display:block;
}
.agency-company-logo svg{
  display:block;
  width:100%;
  height:auto;
}
.agency-launcher-card h1{
  margin:0 0 14px;
  text-align:center;
  font-size:28px;
  line-height:1.18;
  color:#08244d;
}
.agency-launcher-intro{
  max-width:490px;
  margin:0 auto 28px;
  text-align:center;
  line-height:1.55;
  font-size:15px;
  color:#516173;
}
.agency-test-banner{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:auto;
  max-width:100%;
  margin:0 auto 22px;
  padding:8px 16px;
  border-radius:999px;
  background:#fff4d6;
  color:#805300;
  border:1px solid #e0b451;
  font-size:12px;
  line-height:1.2;
  font-weight:900;
  letter-spacing:.45px;
  text-align:center;
}
.agency-connect-section-title{
  margin:18px 0 8px;
  font-size:12px;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.55px;
  color:#475467;
}
.agency-saved-list{
  display:grid;
  gap:8px;
}
.agency-saved-card{
  position:relative;
  width:100%;
  border:1px solid var(--border);
  border-radius:12px;
  padding:13px 86px 13px 14px;
  text-align:left;
  background:#f8fafc;
  color:#101828;
  cursor:pointer;
}
.agency-saved-card:hover,
.agency-saved-card:focus-visible{
  border-color:#7aa6ce;
  background:#eef6fc;
  outline:3px solid #1769aa1f;
}
.agency-saved-name{
  font-weight:900;
  line-height:1.3;
}
.agency-saved-meta{
  margin-top:4px;
  color:#667085;
  font-size:12px;
}
.agency-saved-card .agency-test-badge{
  position:absolute;
  right:12px;
  top:50%;
  transform:translateY(-50%);
}
.agency-test-badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:4px 7px;
  border-radius:999px;
  background:#fff3cd;
  color:#7a4c00;
  border:1px solid #edc66c;
  font-size:10px;
  line-height:1;
  font-weight:900;
  letter-spacing:.45px;
  vertical-align:middle;
}
.agency-connect-divider{
  display:flex;
  align-items:center;
  gap:12px;
  margin:0 0 22px;
  color:#667085;
  font-size:12px;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.55px;
}
.agency-connect-divider::before,
.agency-connect-divider::after{
  content:"";
  height:1px;
  background:#d7dde6;
  flex:1;
}
.agency-connect-divider span{
  white-space:nowrap;
}
.agency-connect-primary{
  width:100%;
  min-height:50px;
  margin-top:4px;
}
.agency-test-password-help{
  margin-top:8px;
  font-size:13px;
  line-height:1.4;
  color:#5d6b7c;
}
.agency-launcher-note{
  margin-top:16px;
  line-height:1.5;
  text-align:center;
  font-size:13px;
  color:#5d6b7c;
}
.agency-user-login{
  position:relative;
}
.agency-login-badges{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:10px;
  margin-bottom:10px;
}
.agency-change-link{
  appearance:none;
  border:0;
  background:transparent;
  color:var(--blue);
  font:inherit;
  font-size:12px;
  font-weight:800;
  cursor:pointer;
  padding:4px;
}
.agency-change-link:hover{
  text-decoration:underline;
}
.agency-login-name{
  margin-top:10px;
  color:#344054;
  font-weight:800;
}
.agency-shell-test{
  width:max-content;
  margin:-8px auto 14px;
  padding:4px 8px;
  border-radius:999px;
  background:#fff3cd;
  color:#7a4c00;
  font-size:10px;
  font-weight:900;
  letter-spacing:.5px;
}
.agency-sidebar-user{
  line-height:1.45;
}
.agency-change-button{
  width:100%;
  margin-top:12px;
}
.agency-top-subtitle{
  display:flex;
  align-items:center;
  gap:7px;
  flex-wrap:wrap;
}
@media(max-width:700px){
  .agency-launcher-wrap{
    padding:0;
    align-items:flex-start;
    overflow-y:auto;
  }
  .agency-launcher-card{
    width:100%;
    min-height:100dvh;
    margin:0;
    border-radius:0;
    padding:20px;
  }
  .agency-launcher-card h1{
    font-size:27px;
  }
  .agency-saved-card{
    padding-right:72px;
  }
}


/* CitationLogic brand lockup v5 — flex-based alignment */
.citationlogic-brand{
  width:min(100%,440px);
  margin:0 auto 24px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:22px;
}
.citationlogic-mark{
  flex:0 0 104px;
  width:104px;
  height:104px;
  display:flex;
  align-items:center;
  justify-content:center;
}
.citationlogic-mark svg{
  display:block;
  width:104px;
  height:104px;
}
.citationlogic-wordmark{
  min-width:0;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  justify-content:center;
}
.citationlogic-name{
  display:flex;
  align-items:baseline;
  white-space:nowrap;
  font-family:Arial,Helvetica,sans-serif;
  font-size:46px;
  line-height:1;
  font-weight:800;
  letter-spacing:-2.1px;
}
.citationlogic-citation{color:#082b57}
.citationlogic-logic{color:#0879ee}
.citationlogic-tech{
  margin-top:11px;
  padding-left:3px;
  white-space:nowrap;
  color:#5c6f83;
  font-family:Arial,Helvetica,sans-serif;
  font-size:13px;
  line-height:1;
  font-weight:500;
  letter-spacing:7.6px;
}
@media(max-width:700px){
  .citationlogic-brand{
    width:min(100%,380px);
    margin:0 auto 20px;
    gap:14px;
  }
  .citationlogic-mark{
    flex-basis:82px;
    width:82px;
    height:82px;
  }
  .citationlogic-mark svg{
    width:82px;
    height:82px;
  }
  .citationlogic-name{
    font-size:36px;
    letter-spacing:-1.7px;
  }
  .citationlogic-tech{
    margin-top:9px;
    font-size:10.5px;
    letter-spacing:6px;
  }
}
@media(max-width:430px){
  .citationlogic-brand{gap:11px}
  .citationlogic-mark{
    flex-basis:72px;
    width:72px;
    height:72px;
  }
  .citationlogic-mark svg{
    width:72px;
    height:72px;
  }
  .citationlogic-name{
    font-size:31px;
    letter-spacing:-1.4px;
  }
  .citationlogic-tech{
    font-size:9px;
    letter-spacing:5px;
  }
}

/* Digital Chalk / ELSAG timed-parking workflow */
.digital-chalk-head{display:flex;justify-content:space-between;gap:18px;align-items:flex-start;margin-bottom:16px}
.digital-chalk-head h2{margin:3px 0 8px}
.dc-kv{display:flex;justify-content:space-between;gap:14px;align-items:flex-start;padding:8px 0;border-bottom:1px solid #e5e7eb}
.dc-kv span{color:#667085}
.dc-kv b{text-align:right}
.dc-stat-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:16px 0}
.dc-stat{border:1px solid var(--border);background:#f8fafc;border-radius:12px;padding:14px}
.dc-stat span{display:block;color:#667085;font-size:12px;font-weight:700;margin-bottom:5px}
.dc-stat b{font-size:26px;color:var(--navy)}
.dc-stat-red{background:#fff4f2;border-color:#f5b7b1}
.dc-stat-red b{color:var(--red)}
.dc-eligible-card{border:2px solid #efc1bd}
.dc-case-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:12px;margin-top:12px}
.dc-case{border:1px solid var(--border);border-radius:14px;background:#fff;padding:15px}
.dc-case h2{margin:0 0 8px;letter-spacing:.04em}
.dc-case-eligible{background:#fff9f8;border-color:#e9a9a2}
/* Car program 1.3.4: a cleared chalk opens from its row and can be reinstated. */
.dc-cleared-row{cursor:pointer}
.dc-cleared-row:hover td,.dc-cleared-open td{background:#f2f6fc}
.dc-case-cleared{margin-top:12px;background:#f8fafc;border-color:#b8c4d1}
@media(max-width:700px){
  .digital-chalk-head{display:block}
  .digital-chalk-head .btn{margin-top:10px}
  .dc-stat-grid{grid-template-columns:1fr}
  .dc-case-grid{grid-template-columns:1fr}
  .dc-kv{gap:8px}
}


/* Settings hub */
.settings-header{display:flex;justify-content:space-between;align-items:flex-end;gap:18px;margin-bottom:16px}
.settings-header h2{margin:3px 0 6px}
.settings-tabs{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}
.settings-tab{
  border:1px solid var(--border);
  background:#fff;
  color:#101828;
  border-radius:9px;
  padding:10px 13px;
  font-weight:800;
  cursor:pointer
}
.settings-tab.active{background:var(--navy);border-color:var(--navy);color:#fff}
.settings-zone-table-wrap{max-height:calc(100vh - 300px);overflow:auto}
.settings-zone-table{min-width:1150px}
.settings-zone-inactive{opacity:.58}
.settings-zone-editor{max-width:980px}
.appearance-choice-grid{display:grid;grid-template-columns:repeat(2,minmax(0,260px));gap:14px;margin-top:16px}
.appearance-choice{
  display:grid;
  gap:5px;
  text-align:left;
  padding:18px;
  border-radius:14px;
  border:1px solid var(--border);
  background:#fff;
  color:#101828;
  cursor:pointer
}
.appearance-choice:hover{border-color:var(--blue);box-shadow:0 8px 24px #1769aa18}
.appearance-choice-icon{font-size:28px}
.appearance-choice small{color:#667085}
.appearance-inline-toggle{
  border:1px solid #b7c3d0;
  background:#fff;
  color:#344054;
  border-radius:999px;
  padding:4px 9px;
  font:inherit;
  font-size:12px;
  font-weight:800;
  cursor:pointer;
  vertical-align:middle;
  margin-left:6px
}

/* Whole-application night mode */
body.night-mode{
  --bg:#08111c;
  --border:#314155;
  --navy:#071c31;
  --blue:#2f87d3;
  background:#08111c;
  color:#e7edf5;
  color-scheme:dark
}
body.night-mode .main,
body.night-mode.phone-mode,
body.night-mode.phone-mode .top{background:#08111c;color:#e7edf5}
body.night-mode .top{background:#08111c}
body.night-mode .card,
body.night-mode .module-form,
body.night-mode .ticket-module-officer-signature,
body.night-mode .court-case-summary,
body.night-mode .court-side-card,
body.night-mode .court-related-ticket,
body.night-mode .court-note-entry,
body.night-mode .ticket-module-shell,
body.night-mode .ticket-module-body,
body.night-mode .violation-editor-page,
body.night-mode .violation-editor-summary,
body.night-mode .workspace-hero,
body.night-mode .appearance-choice{
  background:#101c2a!important;
  color:#e7edf5!important;
  border-color:#314155!important
}
body.night-mode .ticket-module-header,
body.night-mode .public-header{background:#0b2743!important;color:#fff!important}
body.night-mode input,
body.night-mode select,
body.night-mode textarea,
body.night-mode .tabs button,
body.night-mode .ticket-module-tab,
body.night-mode .violation-editor-tab,
body.night-mode .settings-tab{
  background:#0a1521!important;
  color:#eef4fb!important;
  border-color:#3a4d63!important
}
body.night-mode input::placeholder,
body.night-mode textarea::placeholder{color:#8395aa}
body.night-mode .settings-tab.active,
body.night-mode .ticket-module-tab.active,
body.night-mode .violation-editor-tab.active{
  background:#1e6096!important;
  color:#fff!important;
  border-color:#68a7d6!important
}
body.night-mode th{
  background:#142235!important;
  color:#f4f7fb!important;
  border-color:#34465a!important
}
body.night-mode td{
  color:#dce6f2!important;
  border-color:#28394c!important
}
body.night-mode .muted{color:#9caec1!important}
body.night-mode .badge{background:#243348;color:#e6edf5}
body.night-mode .badge.green{background:#163d2a;color:#a9f0c4}
body.night-mode .btn.light{
  background:#1a2b3d!important;
  color:#edf4fb!important;
  border:1px solid #40536a
}
body.night-mode .alert.blue{background:#102d49;color:#cbe6ff}
body.night-mode .alert.green{background:#143625;color:#bde9ca}
body.night-mode .alert.red{background:#42201e;color:#ffd2ce}
.alert.amber{background:#fff4e5;color:#6b4100;border:1px solid #f0c36d}
body.night-mode .alert.amber{background:#3a2a0f;color:#ffd48a;border-color:#7a5a1f}
body.night-mode .paybox{background:#2e2918;color:#ffe7a2;border-color:#806f35}
body.night-mode .settings-zone-inactive{opacity:.48}
body.night-mode .appearance-inline-toggle{
  background:#132235;
  color:#dce8f5;
  border-color:#52667c
}
body.night-mode .user-row:hover{background:#16283b!important}
body.night-mode .ticket-module-overlay{background:#02070dbf}
body.night-mode .dashboard-scene::before{
  content:'';
  position:absolute;
  inset:0;
  background:#020a13a6;
  pointer-events:none;
  z-index:0
}
body.night-mode .dashboard-scene-overlay{position:relative;z-index:1}
body.night-mode .dashboard-stat{
  background:#101c2ae8!important;
  color:#edf4fb!important;
  border-color:#50637a!important
}
body.night-mode .dashboard-stat .muted{color:#adbdcd!important}

@media(max-width:900px){
  .settings-header{display:block}
  .settings-tabs{justify-content:flex-start;margin-top:12px}
}
body.phone-mode .settings-tabs{display:grid;grid-template-columns:1fr 1fr;gap:8px}
body.phone-mode .settings-tab{width:100%;min-height:44px}
body.phone-mode .appearance-choice-grid{grid-template-columns:1fr}
body.phone-mode .settings-zone-table-wrap{max-height:none}
body.phone-mode .appearance-inline-toggle{padding:4px 8px;font-size:11px}


/* Saved user signature */
.signature-settings-card{max-width:1100px}
.signature-two-panel{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:18px}
.signature-panel{min-width:0}
.signature-panel-heading{display:flex;justify-content:space-between;align-items:baseline;gap:10px;margin-bottom:8px}
.saved-signature-box,.signature-pad-wrap{height:230px;border:2px solid #98a2b3;border-radius:12px;background:#fff;overflow:hidden;box-shadow:inset 0 0 0 1px #fff}
.saved-signature-box{display:flex;align-items:center;justify-content:center;padding:14px}
.saved-signature-box img{display:block;max-width:100%;max-height:100%;object-fit:contain}
.saved-signature-empty{color:#667085;font-weight:800;text-align:center}
.signature-pad-wrap{margin-top:0}
.signature-pad{display:block;width:100%;height:100%;background:#fff;touch-action:none;cursor:crosshair}
.signature-pad-hint{margin-top:7px;font-size:12px;color:#667085}
.signature-actions{margin-top:16px}
body.night-mode .saved-signature-box,body.night-mode .signature-pad-wrap,body.night-mode .signature-pad{background:#fff}
@media(max-width:800px){
  .signature-two-panel{grid-template-columns:1fr}
  .saved-signature-box,.signature-pad-wrap{height:200px}
  .signature-actions .btn{flex:1 1 100%}
}

/* Digital Chalk live status, timers and over-limit alert */
.dc-live{display:inline-flex;align-items:center;gap:8px;padding:9px 16px;border-radius:999px;font-weight:800;font-size:15px;letter-spacing:.03em;border:2px solid transparent}
.dc-live::before{content:"";width:11px;height:11px;border-radius:50%;background:currentColor;flex:none}
.dc-live-ok{background:#dcfae6;color:#166534;border-color:#86d7a5}
.dc-live-wait{background:#eef2f6;color:#344054;border-color:#d0d5dd}
.dc-live-bad{background:#fee4e2;color:#b42318;border-color:#f5a39b}
.dc-live-status{font-weight:700}
.dc-st-ok{color:#166534}
.dc-st-near{color:#b54708}
.dc-st-limit{color:#b42318}
.dc-case-eligible.dc-new{animation:dcPulse 1.2s ease-in-out 6}
@keyframes dcPulse{0%,100%{box-shadow:0 0 0 0 rgba(180,35,24,0)}50%{box-shadow:0 0 0 8px rgba(180,35,24,.35)}}
@media (prefers-reduced-motion:reduce){.dc-case-eligible.dc-new{animation:none;outline:4px solid #b42318}}
.dc-day-picks{gap:8px}
.dc-day{display:inline-flex;align-items:center;gap:6px;padding:10px 12px;border:1px solid var(--border);border-radius:8px;background:#fff;font-weight:700;cursor:pointer}
.field .dc-day input[type=checkbox]{width:20px;height:20px;padding:0;margin:0;border:0;flex:none}
.dc-badge-estimate{background:#fef0c7;color:#93370d}
.dc-cam-block{margin-top:16px;padding-top:12px;border-top:1px solid #e5e7eb}
.dc-cam{display:inline-flex;align-items:center;gap:6px;padding:10px 12px;border:1px solid var(--border);border-radius:8px;background:#fff;font-weight:700;cursor:pointer}
.dc-cam input{width:18px;height:18px;margin:0}
/* Car program 1.3.3: on the car's own computer each camera shows ELSAG's newest picture from it. */
.dc-cam-card{flex-direction:column;align-items:stretch;align-self:flex-start;gap:8px;width:300px;max-width:100%;vertical-align:top}
.dc-cam-head{display:flex;align-items:flex-start;gap:6px}
.dc-cam-head input{flex:none;margin-top:2px}
.dc-cam-pic{display:flex;flex-direction:column;gap:4px;font-weight:400}
.dc-cam-pic img{display:block;width:100%;height:auto;max-height:220px;object-fit:contain;border-radius:6px;background:#0b1320}
.dc-cam-pic img[hidden],.dc-cam-pic a[hidden]{display:none}

/* Overdue notice letters (Police Clerk dashboard / Admin) */
.letters-page{display:grid;gap:16px}
.letters-page h3{margin:0 0 10px}
.letters-head{display:grid;gap:12px}
.letters-head h2{margin:4px 0 6px}
.letters-head p{margin:4px 0}
.letters-kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.letters-kpi{border:1px solid var(--border);border-radius:12px;padding:10px 12px;background:#f8fafc;font-size:13px;font-weight:700}
.letters-kpi .kpi{font-size:28px;line-height:1.1}
.letters-kpi.due{border-color:#1769aa;background:#eaf2fb;color:#0d2a4a}
.letters-kpi.warn{border-color:#e7b85c;background:#fff7e6;color:#7a4b00}
.letters-table td{vertical-align:top}
.letters-table .letter-actions{white-space:nowrap}
.letters-table .letter-actions .btn{padding:9px 12px;margin:0 4px 4px 0;display:inline-flex;align-items:center;gap:6px}
.letter-ticket-line{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin:0 0 4px}
.letter-new{font-size:11px;font-weight:800;color:#b54708;background:#fff4e5;border-radius:999px;padding:2px 7px}
.letter-badge{display:inline-block;padding:4px 9px;border-radius:999px;font-size:12px;font-weight:800;background:#eef2f6;white-space:nowrap}
.letter-badge.n30{background:#eaf2fb;color:#0d2a4a}
.letter-badge.n60{background:#fff4e5;color:#b54708}
.letter-badge.n90{background:#fee4e2;color:#b42318}
/* Notice badges since Oct 15 2026 (configurable notices): first / middle / final, in the old 30/60/90 colours. */
.letter-badge.n-first{background:#eaf2fb;color:#0d2a4a}
.letter-badge.n-middle{background:#fff4e5;color:#b54708}
.letter-badge.n-final{background:#fee4e2;color:#b42318}
.letter-wait{font-size:11px;font-weight:700;color:#475467;background:#f2f4f7;border-radius:999px;padding:2px 7px}
.letter-badge.printed{background:#dcfae6;color:#166534}
.letter-badge.returned{background:#fee4e2;color:#b42318}
.letter-row-printed{background:#f0fdf4}
.letter-row-returned{background:#fff8f7}
.letter-preview-shell{width:min(980px,100%)}
.letter-preview-frame{width:100%;height:min(72vh,900px);border:1px solid var(--border);border-radius:10px;background:#e5e7eb}
.letters-settings-card{max-width:820px}
body.night-mode .letters-kpi{background:#132033;border-color:#2a3a52;color:#e6edf5}
body.night-mode .letters-kpi.due{background:#102d49;color:#cbe6ff}
body.night-mode .letters-kpi.warn{background:#3a2a0f;color:#ffd48a}
body.night-mode .letter-row-printed{background:#10261a}
body.night-mode .letter-row-returned{background:#2b1414}
@media(max-width:900px){.letters-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}}
body.night-mode .letter-wait{background:#243348;color:#cbd5e1}
.letter-preview-toggle{display:flex;gap:6px;margin-right:auto;flex-wrap:wrap}
/* Settings > Late Fees & Letters: the overdue notice letters plan editor (part07 letterPlanEditor) */
.letters-settings-card.lplan-card{max-width:1120px}
.lplan-summary{margin:0 0 12px;padding:10px 12px;border-radius:10px;background:#eaf2fb;color:#0d2a4a;font-size:14px;display:grid;gap:3px}
.lplan-table{border:1px solid #e2e8f0;border-radius:10px;overflow:hidden}
.lplan-row{display:grid;grid-template-columns:96px minmax(90px,1fr) minmax(90px,.85fr) minmax(150px,2fr) auto auto auto;gap:8px;align-items:center;padding:8px 10px}
.lplan-head{background:#f2f4f7;font-size:12px;font-weight:800;color:#475467}
.lplan-btns{display:contents}
.lplan-notice{border-top:1px solid #e2e8f0}
.lplan-num{display:flex;align-items:center;gap:6px;min-width:0}
.lplan-num b{font-size:16px;min-width:18px}
.lplan-cell{display:grid;gap:3px;min-width:0;align-self:start}
.lplan-form .lplan-cell input{min-width:0;padding:8px 10px;border-radius:8px}
.lplan-label{display:none;font-size:12px;font-weight:800;color:#344054}
.lplan-title-hint{overflow-wrap:anywhere}
.lplan-row .btn{padding:9px 11px;display:inline-flex;align-items:center;justify-content:center;gap:6px;white-space:nowrap}
.lplan-row .btn .ui-icon{width:16px;height:16px}
.lplan-msgs{padding:0 10px 4px}
.lplan-msgs:empty{display:none}
.lplan-err{color:#b42318;font-size:13px;font-weight:700;margin:2px 0 4px}
.lplan-warn{color:#7a4b00;background:#fff4e5;border-left:3px solid #e7b85c;border-radius:6px;font-size:13px;padding:5px 8px;margin:2px 0 6px}
.lplan-wording{display:grid;gap:12px;margin:0 10px 10px;padding:12px;border:1px solid var(--border);border-radius:10px;background:#f8fafc}
.lplan-wording[hidden]{display:none}
.lplan-title-tools{display:flex;flex-wrap:wrap;gap:8px;align-items:center;justify-content:space-between}
.lplan-text{margin:0;min-width:0}
.lplan-form .lplan-text textarea{min-height:64px;resize:vertical;line-height:1.4;font-size:14px;font-weight:400}
.lplan-form .lplan-text input{font-weight:400}
.lplan-insert{min-width:0;flex:1 1 260px}
.lplan-insert summary{cursor:pointer;margin:2px 0 4px}
.lplan-text-foot{display:flex;flex-wrap:wrap;justify-content:space-between;gap:6px;align-items:flex-start}
.lplan-chips{display:flex;flex-wrap:wrap;gap:4px;align-items:center;min-width:0}
.lplan-chip{border:1px solid #b9d0ea;background:#eaf2fb;color:#0d2a4a;border-radius:999px;padding:3px 8px;font:700 12px Consolas,Menlo,monospace;cursor:pointer;max-width:100%;overflow-wrap:anywhere}
.lplan-chip:hover{background:#d5e6f8}
.lplan-text-tools{display:flex;gap:10px;align-items:center;margin-left:auto}
.lplan-link{border:0;background:none;color:var(--blue);font-weight:700;font-size:12px;padding:2px 0;cursor:pointer;text-decoration:underline}
.lplan-link:disabled{color:#98a2b3;cursor:default;text-decoration:none}
.lplan-count.over{color:#b42318;font-weight:800}
.lplan-flags:empty{display:none}
.lplan-flags u{text-decoration:underline wavy #b42318}
.lplan-add{margin:10px 0}
.lplan-shared{margin:14px 0;border:1px solid #e2e8f0;border-radius:10px;padding:10px 12px}
.lplan-shared summary,.lplan-help summary{cursor:pointer}
.lplan-shared-body{display:grid;gap:12px;margin-top:10px}
.lplan-help{margin:10px 0;font-size:13px}
.lplan-help summary{font-weight:700;color:var(--blue)}
.lplan-help dl{display:grid;grid-template-columns:auto 1fr;gap:4px 12px;margin:8px 0}
.lplan-help dt{font:700 12px Consolas,Menlo,monospace}
.lplan-help dd{margin:0}
/* Also while focused: the field the server (or Save) points at is focused, and .module-form's focus border would hide the mark. */
.lplan-form .lplan-error,.lplan-form .lplan-error:focus{border-color:#b42318!important;outline:3px solid #b4231833}
body.night-mode .lplan-summary{background:#102d49;color:#cbe6ff}
body.night-mode .lplan-table,body.night-mode .lplan-notice,body.night-mode .lplan-shared{border-color:#314155}
body.night-mode .lplan-head{background:#132033;color:#cbd5e1}
body.night-mode .lplan-label{color:#cbd5e1}
body.night-mode .lplan-wording{background:#0d1825;border-color:#314155}
body.night-mode .lplan-chip{background:#102d49;border-color:#2a4d73;color:#cbe6ff}
body.night-mode .lplan-warn{background:#3a2a0f;color:#ffd48a;border-left-color:#7a5a1f}
body.night-mode .lplan-err{color:#ff9b8f}
body.night-mode .lplan-link{color:#8cc4ff}
body.night-mode .lplan-link:disabled{color:#64748b;cursor:default;text-decoration:none}
@media(max-width:760px){
  .lplan-form{padding:10px}
  .lplan-head{display:none}
  .lplan-row{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:8px 10px;padding:8px}
  .lplan-cell{align-self:end}
  .lplan-num,.lplan-title-cell{grid-column:1/-1}
  .lplan-label{display:block}
  .lplan-btns{grid-column:1/-1;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
  .lplan-row .btn{padding:9px 6px;min-width:0}
  .lplan-wording{margin:0 4px 8px;padding:8px}
  .lplan-msgs{padding:0 6px 4px}
  .lplan-help dl{grid-template-columns:minmax(0,1fr)}
  .lplan-help dd{margin-bottom:6px}
  .lplan-text-tools{margin-left:0}
}
.late-fee-summary{margin:-4px 0 8px;padding:6px 10px;border-left:3px solid #b54708;background:#fff8ed;border-radius:6px}
body.night-mode .late-fee-summary{background:#2e2410;border-left-color:#f0a44b}
/* Court balance adjustments + action history */
.court-adjust{margin-top:18px;padding-top:14px;border-top:1px solid #e2e8f0}
.court-balance-breakdown{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin:8px 0}
.court-balance-breakdown div{border:1px solid var(--border);border-radius:10px;padding:8px 10px;background:#f8fafc;display:grid;gap:2px}
.court-balance-breakdown span{font-size:12px;color:#667085}
.court-balance-breakdown b{font-size:17px}
.court-adjust-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:10px}
.court-adjust-grid .module-action-card{border:1px solid var(--border);border-radius:12px;padding:12px;background:#fff}
.court-adjust-grid h4{margin:0 0 4px}
.court-adjust-past{font-size:13px;margin:6px 0}
.court-adjust-past ul{margin:4px 0 0 18px;padding:0}
.court-history-facts{display:grid;gap:2px;margin:4px 0;font-size:13px}
.court-history-facts div{display:flex;gap:6px}
.court-history-facts span{color:#667085;min-width:92px}
body.night-mode .court-balance-breakdown div,body.night-mode .court-adjust-grid .module-action-card{background:#132033;border-color:#2a3a52}
@media(max-width:900px){.court-adjust-grid,.court-balance-breakdown{grid-template-columns:1fr 1fr}}
.court-adjust-grid .module-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:4px 10px}
.court-adjust-grid .field{min-width:0}
.court-adjust-grid .field input,.court-adjust-grid .field select{width:100%;min-width:0;box-sizing:border-box}
.court-adjust-grid .module-action-card.wide{grid-column:1/-1}
.court-amount-note{color:#166534}
.letter-court{font-size:11px;font-weight:800;color:#166534;background:#dcfae6;border-radius:999px;padding:2px 7px}
body.night-mode .court-amount-note{color:#a9f0c4}

/* Payment Workspace: full window like the court workspace */
.payment-workspace-shell .ticket-module-body>.ticket-module-pane{max-width:1180px;margin:0 auto}
.payment-workspace-shell .module-section-heading{margin-bottom:10px}
@media(min-width:1000px){
  .payment-workspace-shell #paymentModuleForm .module-grid.two{grid-template-columns:repeat(3,minmax(0,1fr))}
  .court-adjust-grid .module-action-card.wide .module-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
}
.court-fullpay{border-color:#9cc3a6}
body.night-mode .court-adjust-grid .court-fullpay{border-color:#2f6b45}

/* Ticket location preview */
.location-preview{margin:4px 0 10px}

/* Flex (DMV) lookup on the New Citation screen */
.flex-lookup{margin:8px 0 10px}
.flex-lookup-row{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
/* An out-of-state plate's LICENSE TYPE (part 07 flexLicenseTypeControl). Tim, Oct 22 2026: "these buttons should line up,
   need fixing" (PC Passenger beside the label and TK Truck wrapped under it, in a narrow plate column). One row at every
   width: the label, then PC and TK as two tiles of the same width and height (the code over its word), each up to 116 px
   wide (the row as wide as before where it fitted on one line) and down to about 90 px (a 285 px plate column on a
   computer, a 360 px phone), as tall as the buttons were (40 px; 44 on a phone, part 08). */
.flex-license-type{display:inline-grid;grid-template-columns:auto minmax(0,116px) minmax(0,116px);justify-content:start;align-items:center;gap:6px;max-width:100%}
.flex-license-type[hidden]{display:none}
.flex-license-label{font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.4px;color:#667085;white-space:nowrap}
.flex-license-choice{align-self:stretch;min-width:0;min-height:40px;padding:2px 6px;border:2px solid var(--border);border-radius:10px;background:#fff;color:#101828;font:inherit;font-size:13px;font-weight:600;line-height:1.1;text-align:center;cursor:pointer}
.flex-license-choice b{display:block;font-size:16px;line-height:1.05;font-weight:800}
.flex-license-choice.on{border-color:var(--blue);background:#eaf2fb;color:#0d2a4a;box-shadow:0 0 0 2px #1769aa33}
.flex-license-choice:focus-visible{outline:3px solid var(--blue);outline-offset:2px}
body.night-mode .flex-license-choice{background:#1b2533;color:#e6ebf1;border-color:#344256}
body.night-mode .flex-license-choice.on{background:#102d49;color:#cbe6ff;border-color:#4d8fd1}
.flex-result{border:1px solid #9cc3a6;background:#f3faf5;border-radius:12px;padding:10px 12px;margin-top:8px}
.flex-result.bad{border-color:#e0a4a4;background:#fdf3f3}
.flex-result-head{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-bottom:6px}
.flex-result-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px 14px;margin-bottom:6px}
.flex-result-grid>div{display:flex;flex-direction:column;min-width:0}
.flex-result-grid>div.wide{grid-column:1/-1}
.flex-result-grid span{font-size:11px;text-transform:uppercase;letter-spacing:.4px;font-weight:800;color:var(--muted)}
.flex-result-grid b{overflow-wrap:anywhere}
body.night-mode .flex-result{background:#12261a;border-color:#2f6b45}
body.night-mode .flex-result.bad{background:#2a1515;border-color:#7a3b3b}
@media(max-width:520px){.flex-result-grid{grid-template-columns:1fr}}

/* Patrol car picker (after sign-in) */
.car-picker h1{margin:10px 0 4px}
.car-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:16px 0 12px}
.car-choice{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;min-height:74px;padding:12px 6px;border:2px solid var(--border);border-radius:12px;background:#fff;color:#101828;font:inherit;font-size:24px;font-weight:800;cursor:pointer}
.car-choice small{font-size:11px;font-weight:700;color:#667085;min-height:14px}
.car-choice.suggested{border-color:var(--blue);box-shadow:0 0 0 3px #1769aa33}
.car-choice:focus-visible,.car-none:focus-visible{outline:3px solid var(--blue);outline-offset:2px}
.car-none,.car-cancel{width:100%;margin-top:6px}
.car-badge{border:0;cursor:pointer;background:#eaf2fb;color:#0d2a4a;font:inherit;font-size:12px;font-weight:800}
body.night-mode .car-choice{background:#1b2533;color:#e6ebf1;border-color:#344256}

/* Digital Chalk: first / latest LPR overview pictures */
.dc-lpr-photos{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:10px 0 4px}
.dc-lpr-photos a{display:block;text-decoration:none;color:inherit}
.dc-lpr-photos img{display:block;width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:8px;border:1px solid #d0d5dd;background:#f2f4f7}
.dc-lpr-photos span{display:block;font-size:12px;color:#475467;margin-top:3px}
#lprEvidencePhotos{margin-top:10px}
/* Ticket GPS: "Retry GPS" right of Address # in the full version (after On Street in the page, so Tab goes
   Address # -> On Street -> Retry GPS); a phone keeps "Try GPS Again" after two failed tries */
#gpsRetryField{order:1;align-self:stretch;grid-template-rows:auto 1fr}
#onStreetField{order:2}
body.phone-mode #gpsRetryField{display:none!important}
body:not(.phone-mode) #gpsRetryRow{display:none!important}
#gpsRetryNow{font:inherit;font-weight:700;border:2px solid transparent;white-space:nowrap;min-width:7.5em}
#gpsRetryNow:disabled{opacity:.75;cursor:progress}
/* Ticket GPS: "GPS ports..." under the GPS line on a car computer, full version only (Print Agent 0.6.6, Oct 12 2026).
   Amber while the car GPS read doesn't work. Its window lists the COM ports ("Car GPS on this computer"). */
#gpsPortsRow{margin-top:6px}
body.phone-mode #gpsPortsRow{display:none!important}
.gps-ports-btn{font:inherit;font-size:13px;font-weight:700;line-height:1.2;min-height:32px;padding:6px 12px;border-radius:999px;border:1px solid #d0d5dd;background:#f8fafc;color:#0d2a4a;cursor:pointer}
.gps-ports-btn:hover,.gps-ports-btn:focus-visible{border-color:var(--blue);color:var(--blue);outline:2px solid #1769aa33;outline-offset:1px}
.gps-ports-btn.attention{background:#fff4e5;border-color:#e0a43a;color:#6b4100}
.gps-ports-overlay .ticket-module-shell{max-width:700px}
.gps-ports-status{margin:0 0 10px;font-weight:700}
.gps-ports-mode{display:flex;gap:10px;align-items:center;justify-content:space-between;flex-wrap:wrap;margin:0 0 10px}
.gps-ports-mode .btn{padding:8px 12px}
.gps-port-list{border-top:1px solid var(--border);background:#fff;border-radius:10px}
.gps-port-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:2px 12px;align-items:center;padding:10px 12px;border-bottom:1px solid var(--border)}
.gps-port-row.chosen{background:#eaf7ef}
.gps-port-row.skipped{color:#667085}
.gps-port-name{font-size:15px;overflow-wrap:anywhere}
.gps-port-name span{color:#475467}
.gps-port-status{font-size:14px;color:#475467}
.gps-port-status.fix{color:var(--green);font-weight:700}
.gps-port-status.nofix{color:var(--orange);font-weight:700}
.gps-port-action{grid-column:2;grid-row:1 / span 2;text-align:right}
.gps-port-action .btn{padding:8px 12px;white-space:nowrap}
.gps-port-used{display:inline-block;padding:6px 10px;border-radius:999px;background:#dcfae6;color:#166534;font-size:13px;font-weight:800;white-space:nowrap}
.gps-ports-overlay .module-actions{align-items:center}
.gps-ports-version{margin-right:auto}
body.night-mode .gps-ports-btn{background:#1a2b3d;border-color:#40536a;color:#edf4fb}
body.night-mode .gps-ports-btn.attention{background:#3a2a0f;border-color:#7a5a1f;color:#ffd48a}
body.night-mode .gps-port-list{background:#0d1824}
body.night-mode .gps-port-row.chosen{background:#143625}
body.night-mode .gps-port-name span,body.night-mode .gps-port-status,body.night-mode .gps-port-row.skipped{color:#9caec1}
body.night-mode .gps-port-status.fix{color:#7ee2a8}
body.night-mode .gps-port-status.nofix{color:#ffd48a}
body.night-mode .gps-port-used{background:#163d2a;color:#a9f0c4}
@media(max-width:700px){
  .gps-port-row{grid-template-columns:1fr}
  .gps-port-action{grid-column:1;grid-row:auto;text-align:left;margin-top:4px}
  .gps-ports-version{width:100%;margin:0}
}

/* ---- Night mode: text and boxes that kept their day colors (Oct 6 2026, Tim: "fix the night mode") ----
   Field labels were dark grey on the dark cards; some tables and boxes stayed white while their text
   turned light; buttons now use a slightly deeper blue so white text reads (4.6:1). */
body.night-mode .field label,
body.night-mode .dashboard-user-picker label{color:#dbe5f0}
body.night-mode .dashboard-stat-label,
body.night-mode .dashboard-stat-owed{color:#b4c2d4}
body.night-mode .dashboard-stat-value{color:#eef4fb}
body.night-mode .dashboard-stat-open{color:#8cc4f0}
body.night-mode .quick-vchips-more,
body.night-mode .ql-add-label,
body.night-mode .dc-kv span,
body.night-mode .signature-pad-hint,
body.night-mode .appearance-choice small{color:#b4c2d4}
body.night-mode .ticket-module-eyebrow{color:#8cc4f0}
body.night-mode .dashboard-ticket-table-wrap,
body.night-mode .module-table-wrap table,
body.night-mode .audit-delete-filter,
body.night-mode .ticket-qr-preview,
body.night-mode .dc-stat,
body.night-mode .dc-case,
body.night-mode .dc-day,
body.night-mode .dc-cam,
body.night-mode .evidence-item,
body.night-mode .ticket-module-tabs,
body.night-mode .module-action-card,
body.night-mode.phone-mode .print-stations-table tr{background:#101c2a;color:#e7edf5;border-color:#314155}
body.night-mode .module-empty{background:#0d1825;color:#c9d6e4;border-color:#3a4d63}
body.night-mode .danger-zone,
body.night-mode .module-action-card.danger-zone{background:#2a1515;border-color:#7a3b3b}
body.night-mode .danger-zone h4{color:#ff9b8f}
body.night-mode .violation-entry{background:#0d1825;border-color:#314155}
body.night-mode .violation-entry-title,
body.night-mode .dc-stat b{color:#eef4fb}
body.night-mode .login{background:#101c2a;color:#e7edf5}
body.night-mode .agency-login-name{color:#dbe5f0}
body.night-mode .dc-live-wait{background:#1a2b3d;color:#dbe5f0;border-color:#40536a}
body.night-mode .dc-cleared-row:hover td,body.night-mode .dc-cleared-open td{background:#16263a}
body.night-mode .letter-badge{background:#243348;color:#e6edf5}
/* The signature box stays white for the black ink, so its note stays dark. */
body.night-mode .ticket-module-officer-signature-image .muted{color:#475467!important}
body.night-mode .btn,
body.night-mode .btn.secondary,
body.night-mode .btn.danger,
body.night-mode .ticket-module-close{background:#2878c0!important}
body.night-mode .btn:hover,
body.night-mode .btn:focus-visible,
body.night-mode .ticket-module-close:hover,
body.night-mode .ticket-module-close:focus-visible{background:var(--navy)!important}
body.night-mode .nav button{background:#2878c0}
body.night-mode .nav button.active,
body.night-mode .nav button:hover{background:#0b5792}

/* Maximize on the small windows (Oct 23 2026, Tim): a button beside the x (src/app/part14.txt, hpdWindowMaximize) makes the
   window fill the pane to the right of the left menu (the menu stays; --hpd-pane-left is its right edge); the x still closes it. Ticket-module windows, the court case dialogs, Court night's bulk dialog and the
   Install App card; the court case side panel has its own (part 13). Not on a phone or a narrow window, full already. */
.hpd-win-btns{display:flex;flex-direction:row-reverse;gap:8px;align-items:flex-start;flex:0 0 auto}
.hpd-max-btn{display:inline-flex;align-items:center;justify-content:center;cursor:pointer;flex:0 0 auto;padding:0}
.ticket-module-header .hpd-max-btn{border:0;background:#eef2f6;color:#101828;width:42px;height:42px;border-radius:999px}
.ticket-module-header .hpd-max-btn:hover,.ticket-module-header .hpd-max-btn:focus-visible{background:var(--navy)!important;color:#fff!important;outline:3px solid #1769aa33;outline-offset:1px}
body.night-mode .ticket-module-header .hpd-max-btn{background:#2878c0!important;color:#fff!important}
body.night-mode .ticket-module-header .hpd-max-btn:hover,body.night-mode .ticket-module-header .hpd-max-btn:focus-visible{background:var(--navy)!important}
.ticket-module-overlay[data-max='1']{left:var(--hpd-pane-left,0px);padding:0;align-items:stretch;background:#edf1f5}
body.night-mode .ticket-module-overlay[data-max='1']{background:#0b1220}
.ticket-module-overlay[data-max='1'] .ticket-module-shell{width:100%!important;max-width:none!important;height:100dvh!important;max-height:100dvh!important;border-radius:0;box-shadow:none}
.ticket-module-overlay[data-max='1'] .ticket-module-body{flex:1 1 auto;min-height:0}
/* The court case dialogs, Court night's bulk dialog and the Install App card: the whole window, the words kept in a readable column. */
.cc-modal-back[data-max='1'],.cn-modal-back[data-max='1']{left:var(--hpd-pane-left,0px);padding:0;align-items:stretch;overflow:hidden}
.cc-modal-back[data-max='1'] .cc-modal,.cn-modal-back[data-max='1'] .cn-modal{width:100%!important;max-width:none!important;height:100dvh;max-height:none!important;border-radius:0;overflow:auto;padding-left:max(18px,calc((100% - 760px)/2));padding-right:max(18px,calc((100% - 760px)/2));padding-top:18px}
.cli-overlay[data-max='1']{left:var(--hpd-pane-left,0px);padding:0;align-items:stretch}
.cli-overlay[data-max='1'] .cli-panel{width:100%!important;max-width:none!important;height:100dvh;max-height:100dvh!important;border-radius:0}
.cc-mhead .hpd-max-btn,.cn-mhead .hpd-max-btn{width:44px;height:44px;flex:0 0 44px;border:0;border-radius:8px;background:none;font:inherit}
.cc-mhead .hpd-max-btn{color:var(--cc-ink)}
.cc-mhead .hpd-max-btn:hover{background:var(--cc-soft)}
.cn-mhead .hpd-max-btn{color:var(--cn-muted)}
.cn-mhead .hpd-max-btn:hover{background:var(--cn-soft,#eef2f6)}
.cc-mhead .hpd-win-btns,.cn-mhead .hpd-win-btns{gap:0;align-items:center}
.cli-head .hpd-win-btns{margin:2px 0 0}
.cli-head .hpd-max-btn{width:48px;height:48px;border-radius:50%;border:0;background:var(--cli-soft,#eef2f6);color:var(--cli-ink,#101828)}
/* While a window is maximized the left menu stays in view even when the page behind is scrolled. */
body.hpd-max-open .layout>.side{position:sticky;top:0;align-self:start;height:100vh;overflow-y:auto}
@media (max-width:760px){.hpd-max-btn{display:none}}

/* Pay several tickets (Village Clerk, Plate & Owner Account): one payment, a receipt for each ticket */
.multi-pay-shell{max-width:920px}
.multi-pay-table{width:100%;border-collapse:collapse}
.multi-pay-table th,.multi-pay-table td{padding:8px 10px;text-align:left;vertical-align:middle;border-bottom:1px solid #e5e7eb}
.multi-pay-table tfoot td{border-bottom:0;border-top:2px solid #cbd5e1}
.multi-pay-table .multi-pay-amt{width:110px;padding:8px}
.multi-pay-table input[type=checkbox]{width:20px;height:20px}
.multi-pay-receipts{margin:8px 0 0;padding-left:20px}
@media (max-width:760px){
  .multi-pay-table th:nth-child(3),.multi-pay-table td:nth-child(3){display:none}
  .multi-pay-table .multi-pay-amt{width:96px}
}

/* The ticket page's Payments: each payment, what has been paid so far, the balance */
.ticket-payments{margin:12px 0;padding:10px 12px;border:1px solid var(--border);border-radius:10px;background:#f8fafc}
.ticket-payments>div{margin-top:5px}
.ticket-payments>.alert{margin:0 0 8px}
.ticket-payments-sum{margin-top:8px;border-collapse:collapse;min-width:260px}
.ticket-payments-sum td{padding:2px 14px 2px 0;font-size:.92em}
.ticket-payments-sum td.num{text-align:right;white-space:nowrap}
.ticket-payments-sum tr.sum-orig td,.ticket-payments-sum tr.sum-now td{border-top:1px solid var(--border);padding-top:4px}

/* A window under a maximized one (Pay several tickets over the account) is not shown beside the menu */
[data-under-max='1']{visibility:hidden!important}

/* ---- Support page: the AI Support Desk (app part 16, Oct 26 2026) ---------------------------------------------- */
.support-page .support-kicker{font-size:12px;text-transform:uppercase;letter-spacing:.5px;font-weight:800;color:var(--blue)}
.support-intro p{margin:6px 0}
.support-warning{background:#fff7e6;border:1px solid #e7b85c;border-radius:8px;padding:8px 10px;font-size:14px;color:#5a3e00}
.support-tabs{justify-content:flex-start;margin-top:12px}
.support-thread{display:flex;flex-direction:column;gap:10px;max-height:56vh;overflow:auto;padding:4px 2px 8px}
.support-msg{max-width:min(720px,92%);padding:10px 14px;border-radius:14px;line-height:1.45;font-size:15px;overflow-wrap:anywhere}
.support-msg.person{align-self:flex-end;background:#eaf2fb;color:#0d2a4a;border-bottom-right-radius:4px}
.support-msg.assistant{align-self:flex-start;background:#f4f6f9;border:1px solid var(--border);border-bottom-left-radius:4px}
.support-msg.note{align-self:center;background:transparent;color:#667085;font-size:13px;text-align:center;max-width:100%}
.support-msg p{margin:0 0 8px}.support-msg p:last-child{margin-bottom:0}
.support-msg ol,.support-msg ul{margin:4px 0 8px;padding-left:22px}
.support-msg .support-meta{font-size:12px;color:#667085;margin-top:6px}
.support-msg .support-live{white-space:pre-wrap}
.support-error{color:var(--red)}
.support-mark{background:#fee4e2;color:#b42318;border-radius:4px;padding:0 4px;font-size:13px}
.support-msg.streaming::after{content:'\258D';animation:supportBlink 1s steps(1) infinite;color:#667085;margin-left:2px}
@keyframes supportBlink{50%{opacity:0}}
.support-form{margin-top:12px;display:grid;gap:8px}
.support-form textarea{width:100%;padding:12px;border:1px solid var(--border);border-radius:8px;font:inherit;min-height:72px;resize:vertical}
.support-actions{display:flex;gap:8px;flex-wrap:wrap}
.support-actions .btn.support-suggest{box-shadow:0 0 0 3px #e7b85c}
.support-small{font-size:13px}
.support-ticket-form{margin-top:12px;padding:14px;border:1px solid var(--border);border-radius:12px;background:#fafbfc;display:grid;gap:8px}
.support-ticket-form select,.support-ticket-form textarea{width:100%;padding:10px;border:1px solid var(--border);border-radius:8px;font:inherit;background:#fff}
.support-help-list{display:grid;gap:10px}
.support-help-item{text-align:left;padding:12px 14px;border:1px solid var(--border);border-radius:12px;background:#fff;cursor:pointer;font:inherit;color:inherit;display:grid;gap:3px}
.support-help-item:hover{border-color:var(--blue)}
.support-doc h2{margin:12px 0 4px}
.support-doc h3{margin:18px 0 6px;font-size:17px}
.support-doc ol,.support-doc ul{padding-left:22px}
.support-doc p{margin:6px 0}
.support-tickets td{vertical-align:top}
.support-ticket-summary{white-space:pre-wrap;font-size:13px;color:#344054;margin-top:4px;max-width:520px}
body.phone-mode .support-page{padding-bottom:84px} /* room under the quick New Ticket button (part 08's quick-fab) */
body.phone-mode .support-thread{max-height:none;overflow:visible}
body.phone-mode .support-msg{max-width:100%}
body.phone-mode .support-actions .btn{width:100%}
body.phone-mode .support-tickets table,body.phone-mode .support-tickets thead,body.phone-mode .support-tickets tbody,body.phone-mode .support-tickets tr,body.phone-mode .support-tickets td{display:block;width:100%}
body.phone-mode .support-tickets thead{display:none}
body.phone-mode .support-tickets td{border:0;padding:4px 0}
body.phone-mode .support-tickets tr{border-bottom:1px solid var(--border);padding:8px 0}
body.night-mode .support-msg.person{background:#163a5f;color:#e7edf5}
body.night-mode .support-msg.assistant{background:#0f1f33;border-color:#28405c;color:#e7edf5}
body.night-mode .support-msg.note,body.night-mode .support-msg .support-meta{color:#8fa3bb}
body.night-mode .support-warning{background:#2b2411;border-color:#7a5d1d;color:#f1e4c3}
body.night-mode .support-ticket-form{background:#0f1f33;border-color:#28405c}
body.night-mode .support-ticket-form select,body.night-mode .support-ticket-form textarea,body.night-mode .support-form textarea{background:#08111c;color:#e7edf5;border-color:#28405c}
body.night-mode .support-help-item{background:#0f1f33;border-color:#28405c;color:#e7edf5}
body.night-mode .support-mark{background:#4a1c1c;color:#ffb4a8}
body.night-mode .support-ticket-summary{color:#c9d4e2}
/* The free pieces (Oct 26 2026): the search, the common questions, the checks and fixes */
.support-search label{display:block;margin-bottom:6px}
.support-search-row{display:flex;gap:8px}
.support-search-row input{flex:1;min-width:0;padding:12px;border:1px solid var(--border);border-radius:8px;font:inherit;font-size:16px}
.support-results{display:grid;gap:8px;margin-top:12px}
.support-result{text-align:left;display:grid;gap:3px;padding:10px 12px;border:1px solid var(--border);border-radius:10px;background:#fff;cursor:pointer;font:inherit;color:inherit}
.support-result:hover{border-color:var(--blue)}
.support-result-where{font-size:12px;font-weight:800;color:var(--blue);text-transform:none}
.support-noresult{margin-top:12px}
.support-questions{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:8px;margin-top:10px}
.support-q{text-align:left;padding:10px 12px;border:1px solid var(--border);border-radius:10px;background:#f4f6f9;cursor:pointer;font:inherit;color:inherit}
.support-q:hover{border-color:var(--blue);background:#eaf2fb}
.support-here{background:#fff7e6;border-radius:6px;padding:2px 6px}
.support-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:12px;margin-top:10px}
.support-tool{border:1px solid var(--border);border-radius:12px;padding:12px 14px;background:#fff;display:grid;gap:8px;align-content:start;min-width:0}
.support-tool>*{min-width:0;max-width:100%} /* the card's own grid track never grows past the card: a wide table scrolls, the text wraps */
.support-tool p{margin:0}
.support-param{display:grid;gap:4px;font-size:13px}
.support-param input,.support-param select{padding:10px;border:1px solid var(--border);border-radius:8px;font:inherit;font-size:15px;background:#fff}
.support-result:empty{display:none}
.support-out{display:block;cursor:default} /* a check or fix result: a plain box, so a wide table scrolls inside it instead of widening it */
.support-out>*{max-width:100%}
.support-lines{margin:6px 0;padding-left:20px}
.support-lines li{margin:3px 0}
.support-table-wrap{overflow-x:auto;max-width:100%;margin-top:8px} /* a wide table scrolls inside its card (a block wrapper; display:block on the table itself still took its full width) */
.support-table{font-size:13px}
.support-table th,.support-table td{padding:6px 8px;font-size:13px;vertical-align:top}
.support-candidates{display:flex;gap:6px;flex-wrap:wrap}
.support-confirm{border:2px solid #e7b85c;border-radius:10px;padding:10px 12px;background:#fff7e6}
body.phone-mode .support-grid,body.phone-mode .support-questions{grid-template-columns:1fr}
body.phone-mode .support-search-row{flex-direction:column}
body.night-mode .support-result,body.night-mode .support-tool{background:#0f1f33;border-color:#28405c;color:#e7edf5}
body.night-mode .support-q{background:#0f1f33;border-color:#28405c;color:#e7edf5}
body.night-mode .support-q:hover,body.night-mode .support-result:hover{border-color:#5aa0e6;background:#163a5f}
body.night-mode .support-param input,body.night-mode .support-param select,body.night-mode .support-search-row input{background:#08111c;color:#e7edf5;border-color:#28405c}
body.night-mode .support-confirm,body.night-mode .support-here{background:#2b2411;border-color:#7a5d1d;color:#f1e4c3}

/* ---- Demo and training copies: an orange look and a banner that stays at the top (Test/Training Mode spec, Tim: yes, Oct 26 2026) ----
   Only a copy whose mode is DEMO or TRAINING gets html.cl-look-demo (src/app/part01.txt, clCopyLook); no other copy changes.
   The navy and blue of the chrome (side menu, buttons, tabs) become a dark and a burnt orange, both dark enough for white text.
   The banner is sticky and has no close button. Windows that fill the screen start just below it: --cl-banner-h is its height. */
html.cl-look-demo{--navy:#7c2d12;--blue:#c2410c;--cl-banner-h:0px}
#clCopyBanner{position:sticky;top:0;z-index:100;background:#f97316;color:#1c1917;border-bottom:2px solid #7c2d12;font:800 13px/1.35 Arial,Helvetica,sans-serif;letter-spacing:.2px;text-align:center;padding:6px 12px;overflow-wrap:anywhere;-webkit-print-color-adjust:exact;print-color-adjust:exact}
@media print{#clCopyBanner{display:none!important}}
html.cl-look-demo .login-wrap,html.cl-look-demo .agency-launcher-wrap,html.cl-look-demo .workspace-hero{background:linear-gradient(135deg,#7c2d12,#c2410c)}
html.cl-look-demo .layout{min-height:calc(100vh - var(--cl-banner-h))}
html.cl-look-demo .login-wrap{min-height:calc(100vh - var(--cl-banner-h))}
html.cl-look-demo body.phone-mode .layout{min-height:calc(100vh - var(--cl-banner-h))}
html.cl-look-demo body.phone-mode .top,html.cl-look-demo body.hpd-max-open .layout>.side{top:var(--cl-banner-h)}
/* The officer's phone screens (part 08's quick mode): their top bar sits under the banner and their blue buttons are orange. */
html.cl-look-demo body.quick-mode .quick-bar{top:var(--cl-banner-h)}
html.cl-look-demo body.quick-mode .main,html.cl-look-demo .qh{min-height:calc(100vh - var(--cl-banner-h))}
html.cl-look-demo .quick-fab,html.cl-look-demo .qh-new,html.cl-look-demo .hpdp-icon{background:#c2410c}
html.cl-look-demo .qh-new{box-shadow:0 10px 24px rgba(194,65,12,.28)}
html.cl-look-demo .qh-kicker,html.cl-look-demo .qh-full-text small{color:#fed7aa}
html.cl-look-demo .ql-n,html.cl-look-demo .quick-vchips-edit,html.cl-look-demo .hpdp-msg.info{color:#c2410c}
html.cl-look-demo .quick-vchip.on{border-color:#c2410c;background:#ffedd5}
html.cl-look-demo .quick-vchip.on .quick-vchip-mark{background:#c2410c;border-color:#c2410c}
html.cl-look-demo .hpdp-bluefy,html.cl-look-demo .hpd-app-update{border-color:#c2410c;background:#fff7ed}
html.cl-look-demo body.phone-mode.phone-nav-open .side{top:calc(74px + var(--cl-banner-h));max-height:calc(100vh - 90px - var(--cl-banner-h))}
html.cl-look-demo body.phone-mode.cn-court-shell.phone-nav-open .side{top:calc(66px + var(--cl-banner-h))}
html.cl-look-demo body.phone-mode.phone-nav-open::before{top:var(--cl-banner-h)}
html.cl-look-demo body.phone-mode.phone-nav-open .side .nav button:not(.active){background:#9a3412}
/* The two big blue panels: the dashboard's picture (the made-up agency's own, in blue) and the overnight parking strip. */
html.cl-look-demo .dashboard-scene.cl-generic-scene{background:radial-gradient(circle at 84% 16%,#fb923c59 0,#fb923c00 36%),radial-gradient(circle at 10% 92%,#2a0e04 0,#2a0e0400 48%),linear-gradient(135deg,#7c2d12 0%,#9a3412 54%,#c2410c 100%)}
html.cl-look-demo .ovd{background:#7c2d12;box-shadow:0 6px 18px rgba(124,45,18,.22)}
html.cl-look-demo body.night-mode .ovd{background:#2a0e04}
html.cl-look-demo .ovd-map{color:#7c2d12!important}
/* The states that name their blue outright (the side menu's current page and hover, hover and focus rings), in the same oranges. */
html.cl-look-demo .nav button.active,html.cl-look-demo .nav button:hover,html.cl-look-demo body.night-mode .nav button.active,html.cl-look-demo body.night-mode .nav button:hover{background:#9a3412;border-color:#fff}
html.cl-look-demo .btn:hover,html.cl-look-demo .btn:focus-visible,html.cl-look-demo .tabs button:hover,html.cl-look-demo .tabs button:focus-visible,html.cl-look-demo .ticket-module-tab:hover,html.cl-look-demo .ticket-module-tab:focus-visible,html.cl-look-demo .ticket-module-close:hover,html.cl-look-demo .ticket-module-close:focus-visible{outline-color:#c2410c55}
html.cl-look-demo .field input:focus,html.cl-look-demo .field select:focus,html.cl-look-demo .field textarea:focus,html.cl-look-demo .module-form input:focus,html.cl-look-demo .module-form select:focus,html.cl-look-demo .module-form textarea:focus{outline-color:#c2410c33}
html.cl-look-demo .recent-ticket-card-clickable:hover,html.cl-look-demo .recent-ticket-card-clickable:focus-visible{border-color:#fdba74;outline-color:#c2410c22}
html.cl-look-demo .flex-license-choice.on{background:#ffedd5;color:#7c2d12;box-shadow:0 0 0 2px #c2410c33}
html.cl-look-demo .car-choice.suggested{box-shadow:0 0 0 3px #c2410c33}
/* Windows and layers that fill the screen: below the banner, not under it. */
html.cl-look-demo .ticket-module-overlay,html.cl-look-demo .plate-camera-modal,html.cl-look-demo .cc-modal-back,html.cl-look-demo .cn-modal-back,html.cl-look-demo .cli-overlay,
html.cl-look-demo [style*="position:fixed;inset:0"],html.cl-look-demo [style*="position:fixed;top:0"]{top:var(--cl-banner-h)!important}
html.cl-look-demo .ticket-module-shell{max-height:calc(100dvh - var(--cl-banner-h) - 36px)}
html.cl-look-demo .recent-ticket-review-shell{max-height:calc(100dvh - var(--cl-banner-h) - 36px)!important}
html.cl-look-demo .plate-camera-panel{max-height:calc(100dvh - var(--cl-banner-h) - 20px)}
html.cl-look-demo .court-workspace-shell{height:calc(100dvh - var(--cl-banner-h));max-height:calc(100dvh - var(--cl-banner-h))}
html.cl-look-demo .ticket-module-overlay[data-max='1'] .ticket-module-shell{height:calc(100dvh - var(--cl-banner-h))!important;max-height:calc(100dvh - var(--cl-banner-h))!important}
html.cl-look-demo .cc-modal-back[data-max='1'] .cc-modal,html.cl-look-demo .cn-modal-back[data-max='1'] .cn-modal{height:calc(100dvh - var(--cl-banner-h))}
html.cl-look-demo .cli-overlay[data-max='1'] .cli-panel{height:calc(100dvh - var(--cl-banner-h));max-height:calc(100dvh - var(--cl-banner-h))!important}
@media(max-width:700px){
  html.cl-look-demo .ticket-module-shell{height:calc(100dvh - var(--cl-banner-h));max-height:calc(100dvh - var(--cl-banner-h))}
  html.cl-look-demo .recent-ticket-review-shell{height:calc(100dvh - var(--cl-banner-h))!important;max-height:calc(100dvh - var(--cl-banner-h))!important}
}

/* "Enter Test / Training Mode" and "Go Back to Live Mode" (Oct 26 2026, Tim; src/app/part01.txt, mountSwitchCopy): the first button in the top
   bar, over its full width, and on the phone's home screen. Amber going into the practice copy, green going back to the real one. The
   shared .btn rule above and night mode's use !important, so these do too. */
.btn.mode-switch,.qh-program.mode-switch{font-weight:800}
.btn.mode-switch.mode-switch-test,.qh-program.mode-switch.mode-switch-test,body.night-mode .btn.mode-switch.mode-switch-test{background:#b54708!important;color:#fff!important;border:2px solid #7c2d12!important}
.btn.mode-switch.mode-switch-live,.qh-program.mode-switch.mode-switch-live,body.night-mode .btn.mode-switch.mode-switch-live{background:#1f8a4c!important;color:#fff!important;border:2px solid #14532d!important}
.btn.mode-switch.mode-switch-test:hover,.btn.mode-switch.mode-switch-test:focus-visible,body.night-mode .btn.mode-switch.mode-switch-test:hover{background:#933a06!important;outline-color:#b5470855}
.btn.mode-switch.mode-switch-live:hover,.btn.mode-switch.mode-switch-live:focus-visible,body.night-mode .btn.mode-switch.mode-switch-live:hover{background:#176e3c!important;outline-color:#1f8a4c55}
.top-actions.quick-actions-grid .mode-switch,body.phone-mode .top-actions.quick-actions-grid .mode-switch{grid-column:1/-1}

/* The question before Enter Test / Training Mode and Go Back to Live Mode (Oct 26 2026): on the page, with the link to tap, so a phone never says "Pop-up blocked". */
.cl-ask-back{position:fixed;inset:0;z-index:2147483200;background:rgba(0,0,0,.55);display:grid;place-items:center;padding:16px}
.cl-ask{width:min(440px,100%);background:#fff;color:#101828;border-radius:16px;padding:20px;box-shadow:0 20px 60px rgba(0,0,0,.45);text-align:left}
body.night-mode .cl-ask{background:#10243a;color:#e6edf5}
.cl-ask h2{margin:0 0 8px;font-size:20px;line-height:1.25}
.cl-ask p{margin:0 0 14px;font-size:16px;line-height:1.45}
.cl-ask .btn{display:block;width:100%;margin:8px 0 0;padding:14px 16px;font-size:16px;text-align:center;text-decoration:none;box-sizing:border-box}
.cl-ask .btn.light{background:#eef2f6!important;color:#101828!important;border:1px solid #c9d3e0}
body.night-mode .cl-ask .btn.light{background:#1c3652!important;color:#e6edf5!important;border-color:#2c4a6b}

