.vehicle-secret-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
}
.vin-search-status{font-size:12px;color:var(--muted);margin:10px 0}
.permission-options{border:1px solid var(--line);padding:12px;margin:18px 0 0;display:grid;grid-template-columns:1fr 1fr;gap:10px}
.permission-options legend{font-size:13px;font-weight:700;color:var(--ink);padding:0 6px}
#dialogFields .permission-options label{display:flex;align-items:center;gap:8px;margin:0;font-size:13px;color:var(--ink)}
#dialogFields .permission-options input{width:16px;height:16px;margin:0;padding:0;accent-color:var(--green);box-shadow:none;flex-shrink:0}
.permission-tags{display:flex;flex-wrap:wrap;gap:4px;max-width:360px}
.vin-search-results{max-height:220px;overflow-y:auto;display:grid;gap:4px}
.vin-search-results button{padding:10px 12px;border:1px solid var(--line);background:#fff8f0;text-align:left;font:13px Consolas,monospace;color:var(--ink)}
.vin-search-results button:hover,.vin-search-results button:focus-visible{background:#ffead5;border-color:#de772b;outline:none}

.app{grid-template-columns:180px minmax(0,1fr)}
#access-vehicles{min-width:0;overflow:hidden;padding:20px}
#access-vehicles .panel-head{margin-bottom:14px}
.vehicle-scroll-hint{margin:0 0 8px;font-size:12px;color:var(--muted)}
#vehiclesTable{width:100%;max-height:max(220px,calc(100vh - 440px));overflow:auto;overscroll-behavior:contain;scrollbar-color:#b68b6c #f6ebe2;scrollbar-width:auto}
#access-vehicles .toolbar input{min-width:0;flex:1;width:auto}
#access-vehicles .toolbar button{white-space:nowrap;flex-shrink:0}
#vehiclesTable.dragging{cursor:grabbing;user-select:none}
#vehiclesTable:focus-visible{outline:2px solid #de772b;outline-offset:2px}
#vehiclesTable::-webkit-scrollbar{height:12px;width:12px}
#vehiclesTable::-webkit-scrollbar-thumb{background:#b68b6c;border:2px solid #f6ebe2;border-radius:7px}
#vehiclesTable::-webkit-scrollbar-track{background:#f6ebe2}
.vehicle-table{width:max-content;min-width:100%;border-collapse:separate;border-spacing:0;font-size:12px}
.vehicle-table th,.vehicle-table td{white-space:nowrap;padding:6px 10px;height:33px;border-right:1px solid #eee0d6}
.vehicle-table th{position:sticky;top:0;z-index:2;font-size:11px;letter-spacing:0;background:#faf1e9}
.vehicle-table td{background:#fff}
.vehicle-table code{font:11px Consolas,monospace}
.vehicle-table .vehicle-id{position:sticky;left:0;min-width:56px;width:56px;max-width:56px;z-index:1}
.vehicle-table .vehicle-vin{position:sticky;left:56px;min-width:175px;z-index:1;box-shadow:2px 0 0 #e7d8cc}
.vehicle-table th.vehicle-id,.vehicle-table th.vehicle-vin{z-index:3}
.vehicle-table .action{font-size:12px;padding:2px 6px}
#access-vehicles>.toolbar:last-child{max-width:none;margin:10px 0 0;align-items:center;font-size:12px}
#access-vehicles>.toolbar:last-child .ghost{padding:7px 12px}
.vehicle-record{position:relative}
.vehicle-node,.dtc-node{position:relative;margin:9px 0;border:1px solid var(--line);border-radius:9px;background:#fff;box-shadow:0 2px 8px #4c26100a}
.vehicle-node>summary,.dtc-node>summary{list-style:none;display:flex;flex-wrap:wrap;align-items:center;gap:12px;min-height:58px;padding:12px 210px 12px 18px;cursor:pointer}
.vehicle-node>summary::-webkit-details-marker,.dtc-node>summary::-webkit-details-marker{display:none}
.vehicle-node>summary:before,.dtc-node>summary:before{content:'▸';color:#c76520;font-size:18px}
.vehicle-node[open]>summary:before,.dtc-node[open]>summary:before{content:'▾'}
.vehicle-node b,.dtc-node b{font:700 14px Consolas,monospace;color:var(--ink)}
.vehicle-node .vehicle-meta,.dtc-node .vehicle-meta{font-size:12px;color:var(--muted)}
.vehicle-actions{position:absolute;right:14px;top:13px;display:flex;gap:6px}
.vehicle-body,.dtc-body{padding:8px 16px 18px;border-top:1px solid var(--line)}
.report-toolbar{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin:8px 0 15px;font-size:12px;color:var(--muted)}
.report-toolbar select{max-width:360px;padding:7px;border:1px solid var(--line);border-radius:5px;background:#fff}
.ecu-tree{margin:8px 0;border:1px solid #eadbd0;border-radius:6px;background:#fffaf6}
.ecu-tree>summary{padding:10px 13px;cursor:pointer;font-weight:700}
.ecu-tree>div{padding:0 12px 12px;overflow-x:auto}
.did-table,.dtc-table{width:100%;border-collapse:collapse;font-size:12px}
.did-table th,.did-table td,.dtc-table th,.dtc-table td{padding:8px;border-bottom:1px solid #efe5dd;text-align:left;vertical-align:top}
.did-table code,.dtc-table code{font:12px Consolas,monospace}
.did-value{max-width:520px;overflow-wrap:anywhere;white-space:pre-wrap}
.report-muted{color:var(--muted);font-size:12px}
@media(max-width:700px){.vehicle-node>summary,.dtc-node>summary{padding-right:18px;padding-bottom:48px}.vehicle-actions{top:auto;bottom:8px;left:18px;right:auto}}
@media(max-width:900px){.app{grid-template-columns:64px minmax(0,1fr)}}

@media (max-width: 540px) {
  .app{grid-template-columns:54px minmax(0,1fr)}
  #access-vehicles{padding:12px}
  .vehicle-table .vehicle-id,.vehicle-table .vehicle-vin{position:static}
  .vehicle-secret-grid {
    grid-template-columns: 1fr;
  }
}

/* Dense vehicle/ECU/DID tree for large scan reports. */
.app #vehiclesTable{max-height:max(240px,calc(100vh - 255px))}
.app .vehicle-node,.app .dtc-node{margin:4px 0;border-radius:5px;box-shadow:none}
.app .vehicle-node>summary,.app .dtc-node>summary{min-height:35px;padding:5px 145px 5px 10px;gap:7px}
.app .vehicle-node>summary:before,.app .dtc-node>summary:before{font-size:12px}
.app .vehicle-node b,.app .dtc-node b{font-size:11px}
.app .vehicle-node .vehicle-meta,.app .dtc-node .vehicle-meta{font-size:10px}
.app .vehicle-actions{top:5px;right:8px;gap:3px}
.app .vehicle-body,.app .dtc-body{padding:4px 8px 9px}
.app .report-toolbar{gap:5px 9px;margin:3px 0 7px;font-size:10px;line-height:1.25}
.app .report-toolbar b{font-size:10px}
.app .report-toolbar select{max-width:230px;padding:3px 5px;font-size:10px}
.app .report-toolbar .action{font-size:10px}
.app .ecu-tree{margin:4px 0;border-radius:4px}
.app .ecu-tree>summary{padding:5px 8px;font-size:11px;line-height:1.2}
.app .ecu-tree>div{padding:0 7px 5px}
.app .did-table,.app .dtc-table{font-size:10px;line-height:1.2;table-layout:fixed}
.app .did-table th,.app .did-table td,.app .dtc-table th,.app .dtc-table td{padding:4px 5px;overflow-wrap:anywhere}
.app .did-table th:first-child{width:47px}
.app .did-table th:nth-child(2){width:31%}
.app .did-table th:nth-child(3){width:72px}
.app .did-table th:nth-child(5){width:174px}
.app .did-table code,.app .dtc-table code{font-size:10px}
.app .did-value{max-width:none;white-space:normal}
.app .did-payload>summary{cursor:pointer;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.app .did-payload pre{white-space:pre-wrap;overflow-wrap:anywhere;max-height:180px;overflow:auto;font:10px/1.35 Consolas,monospace;margin:4px 0}
.app .report-muted{font-size:10px;margin:4px 0}
@media(max-width:700px){.app .vehicle-node>summary,.app .dtc-node>summary{padding-right:8px;padding-bottom:31px}.app .vehicle-actions{top:auto;bottom:5px;left:10px;right:auto}.app .did-table,.app .dtc-table{min-width:660px}}
