.app-header {
  background: #e8f2f8;
  border-bottom: 1px solid #c6dce9;
  padding: 1.5rem 0;
  margin-bottom: 1.5rem;
}
.app-header .app-brand { font-size: 2rem; font-weight: 600; line-height: 1.2; margin: 0 0 .5rem; }
.app-header .app-brand a { color: #183e56; }
.app-header p:last-child { margin-bottom: 0; }
.app-resources { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 250px), 1fr)); gap: 1rem; margin-bottom: 2rem; }
.app-resource { border: 1px solid #c6dce9; padding: 1.25rem; display: flex; flex-direction: column; }
.app-resource h3 { font-size: 1.4rem; }
.app-resource .button { margin-top: auto; margin-bottom: 0; align-self: flex-start; }
@media print { .app-header { display: none !important; } }

.resource-editor { width: min(64rem, 94vw); max-height: 90vh; overflow: auto; margin: auto; padding: 1.25rem; border: 1px solid #777; border-radius: .25rem; }
.resource-editor::backdrop { background: rgb(0 0 0 / 50%); }
@media print { .resource-editor, .resource-editor::backdrop { display: none !important; } }

/* Shared responsive application navigation */
.mrn-navigation { display:flex; align-items:center; flex-wrap:wrap; gap:.75rem; padding:.45rem 1rem; }
.mrn-nav-brand { font-weight:700; white-space:nowrap; }
.mrn-nav-groups { display:flex; flex-wrap:wrap; gap:.25rem; align-items:center; }
.mrn-nav-group { position:relative; }
.mrn-nav-group > summary { list-style:none; cursor:pointer; padding:.55rem .8rem; border-radius:.25rem; }
.mrn-nav-group > summary::-webkit-details-marker { display:none; }
.mrn-nav-group > summary::after { content:" ▾"; font-size:.75em; }
.mrn-nav-group.mrn-nav-active > summary { font-weight:700; background:#e8f2f8; }
.mrn-nav-group > ul { position:absolute; top:100%; left:0; z-index:100; min-width:12rem; margin:0; padding:.35rem 0; list-style:none; background:#fff; border:1px solid #c6dce9; box-shadow:0 3px 9px #0002; }
.mrn-nav-group li a { display:block; padding:.45rem .9rem; }
.mrn-nav-group a[aria-current="page"] { font-weight:700; background:#e8f2f8; border-left:3px solid #1779ba; }
.mrn-nav-group a:hover,.mrn-nav-group a:focus-visible,.mrn-nav-group summary:hover { background:#e8f2f8; }
.mrn-nav-toggle { display:none; padding:.4rem .7rem; border:1px solid #aaa; border-radius:.25rem; cursor:pointer; }
@media(max-width:750px) {
  .mrn-navigation { justify-content:space-between; }
  .mrn-nav-toggle { display:block; }
  .mrn-nav-groups { display:none; width:100%; flex-direction:column; align-items:stretch; }
  .mrn-nav-open .mrn-nav-groups { display:flex; }
  .mrn-nav-group > ul { position:static; box-shadow:none; border:0; border-left:2px solid #c6dce9; margin-left:.75rem; }
  .mrn-nav-group > summary { padding:.7rem .5rem; }
}
@media print { .mrn-navigation { display:none !important; } }

/* Mobile-first application shell: preserve print cards and desktop tables. */
:root { --mrn-ink:#17324a; --mrn-line:#cedce5; --mrn-soft:#f3f8fb; --mrn-accent:#16669b; }
*, *::before, *::after { box-sizing:border-box; }
html { -webkit-text-size-adjust:100%; }
body { overflow-x:hidden; }
:where(.grid-container, main, article, section) { min-width:0; }
:where(h1,h2,h3,p,td,th,label) { overflow-wrap:break-word; }
:where(input,select,textarea) { max-width:100%; }
:where(button,.button,input[type="submit"]) { touch-action:manipulation; }
:where(button,.button,a,input,select,textarea,summary):focus-visible { outline:3px solid #1676b4; outline-offset:2px; }
.mrn-navigation { background:#fff; border-bottom:1px solid var(--mrn-line); position:relative; z-index:30; }
.mrn-nav-brand { color:var(--mrn-ink); font-size:1.02rem; }
.mrn-nav-group > summary { color:var(--mrn-ink); }
.app-header { padding:1.15rem 0; margin-bottom:1rem; }
.app-header .app-brand { font-size:clamp(1.4rem,5vw,2rem); }
.app-resource { border-radius:.65rem; background:#fff; box-shadow:0 3px 12px #183e560d; }
.resource-editor, #waybill-editor { max-width:calc(100vw - 1rem); max-height:calc(100dvh - 1rem); }
.table-scroll, .waybill-list { max-width:100%; overflow-x:auto; -webkit-overflow-scrolling:touch; }
.table-scroll table, .waybill-list table { min-width:max-content; }
#app-build-label { pointer-events:none; }
@media (max-width:750px) {
  .mrn-navigation { padding:.55rem .85rem; gap:.5rem; }
  .mrn-nav-brand { white-space:normal; max-width:calc(100% - 7rem); line-height:1.3; }
  .mrn-nav-toggle { display:inline-flex; align-items:center; justify-content:center; min-height:44px; min-width:88px; padding:.5rem .75rem; background:#fff; color:var(--mrn-ink); border-color:var(--mrn-line); }
  .mrn-nav-groups { background:#fff; padding:.5rem 0; }
  .mrn-nav-group { width:100%; border-bottom:1px solid var(--mrn-line); }
  .mrn-nav-group > summary { min-height:44px; display:flex; align-items:center; justify-content:space-between; }
  .mrn-nav-group > ul { position:static; width:100%; min-width:0; box-shadow:none; border:0; margin:0; padding:0 0 .3rem .7rem; }
  .mrn-nav-group li a { min-height:44px; display:flex; align-items:center; padding:.65rem .8rem; }
  .grid-container { padding-left:1rem; padding-right:1rem; }
  h1 { font-size:clamp(1.55rem,6vw,2rem); line-height:1.2; }
  h2 { font-size:1.35rem; line-height:1.25; }
  .app-resources { grid-template-columns:1fr; gap:.75rem; }
  .app-resource { padding:1rem; }
  .app-resource .button { width:100%; text-align:center; }
  :where(main, article, section) :where(input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]),select,textarea) { min-height:44px; font-size:16px; }
  :where(main, article, section) :where(button,.button,input[type="submit"]) { min-height:44px; white-space:normal; }
  .button-group { display:flex; flex-wrap:wrap; gap:.5rem; }
  .button-group .button { margin:0; flex:1 1 auto; }
  .resource-fields { grid-template-columns:minmax(0,1fr); }
  .resource-editor, #waybill-editor { width:calc(100vw - .75rem); max-width:calc(100vw - .75rem); padding:.9rem; }
  dialog.resource-editor[open], dialog#waybill-editor[open] { inset:0; }
  #CarCardData, #CarCardImg { max-width:100%; }
  #CarRoster th, #CarRoster td { vertical-align:middle; }
  #CarRoster td .button { margin:.15rem; }
  #new-session, #new-job, #new-move { display:grid; gap:.35rem; }
  #new-session button, #new-job button, #new-move button { width:100%; }
  #job-areas { grid-template-columns:1fr; }
  #manifest { overflow-wrap:anywhere; }
  #app-build-label { font-size:10px!important; padding:2px 5px!important; opacity:.72!important; }
}
@media (min-width:751px) {
  .mrn-navigation { padding:.65rem clamp(1rem,3vw,3rem); }
  .mrn-nav-groups { margin-left:auto; }
  .app-resources { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (min-width:1100px) {
  .app-resources { grid-template-columns:repeat(4,minmax(0,1fr)); }
}
@media print {
  .mrn-navigation { display:none!important; }
  .app-resource { box-shadow:none; }
}
