:root {
  color: #142d55;
  background: #f1f5f9;
  font: 16px/1.55 "Segoe UI", system-ui, sans-serif;
  color-scheme: light;
}
* { box-sizing: border-box; }
body { margin: 0; }
a { color: #174eaf; text-underline-offset: 4px; }
:focus-visible { outline: 3px solid #508bfa; outline-offset: 4px; }
.auth-header { display: flex; justify-content: space-between; align-items: center; gap: 20px; padding: 18px clamp(18px, 5vw, 64px); background: white; border-bottom: 1px solid #d9e3ef; }
.auth-brand { font-size: 25px; font-weight: 850; letter-spacing: -.055em; text-decoration: none; color: #142d55; }
.auth-brand span { color: #2563eb; }
.auth-header nav { display: flex; align-items: center; gap: clamp(12px, 4vw, 24px); font-size: 14px; }
.auth-header nav a { padding: 7px 2px; }
.panel-page .auth-header nav { flex-wrap: wrap; justify-content: flex-end; gap: 4px 16px; }
.panel-page .auth-header nav a[aria-current="page"] { font-weight: 750; }
.panel-icon { width: 1.15em; height: 1.15em; flex: none; vertical-align: middle; }
.auth-header nav a:has(.panel-icon), .panel-sidebar nav a, .panel-sidebar button, .driver-panel .file-tabs a { display: inline-flex; align-items: center; gap: 8px; }
.panel-sidebar button { justify-content: center; }
.auth-main { width: min(100% - 32px, 560px); margin: clamp(24px, 7vw, 88px) auto 64px; }
.auth-main.wide { width: min(100% - 32px, 960px); }
.auth-intro { padding: clamp(22px, 4vw, 36px); background: #142d55; color: white; border-radius: 18px 18px 0 0; }
.auth-version { font-size: 13px; font-weight: 700; letter-spacing: .04em; color: #bad2ff; overflow-wrap: anywhere; }
h1, h2, p { margin: 0; }
h1 { font-size: clamp(29px, 5.5vw, 42px); line-height: 1.13; letter-spacing: -.037em; margin-top: 7px; }
h2 { font-size: 24px; line-height: 1.2; }
.auth-intro p { color: #dce9fd; margin-top: 12px; }
.auth-card { display: grid; gap: 11px; padding: clamp(22px, 4vw, 36px); background: #fff; border: 1px solid #d9e3ef; border-top: 0; border-radius: 0 0 18px 18px; }
.auth-card.issued { margin-top: 20px; border: 1px solid #d9e3ef; border-radius: 18px; }
.auth-email { justify-self: center; color: #1d4ed8; font-weight: 700; text-underline-offset: 3px; }
.auth-card p { color: #455d7d; }
label { font-size: 15px; font-weight: 700; }
input, textarea { font: inherit; color: #142d55; border: 1px solid #a8bbd3; border-radius: 8px; background: white; min-height: 48px; padding: 10px 12px; width: 100%; }
input + label { margin-top: 8px; }
textarea { resize: vertical; }
button, .auth-button { font: inherit; font-weight: 700; min-height: 48px; padding: 10px 18px; border-radius: 9px; border: 1px solid transparent; background: #2563eb; color: white; cursor: pointer; text-align: center; text-decoration: none; }
.auth-card button, .auth-button { margin-top: 8px; }
button:hover, .auth-button:hover { background: #174eaf; }
button:disabled { cursor: wait; opacity: .66; }
button.secondary { background: white; color: #142d55; border-color: #a8bbd3; }
button.secondary:hover { background: #edf4ff; }
button.danger-secondary { background: #fff; color: #9d1438; border-color: #e7aabc; }
button.danger-secondary:hover { background: #fff1f2; }
.auth-card .auth-error { color: #9d1438; padding: 10px 12px; background: #fff1f2; border-radius: 8px; font-size: 14px; }
.panel-top { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 18px; }
.auth-back { display: inline-block; color: #dce9fd; margin-bottom: 8px; }
#issued-code, #owner-code { font-family: ui-monospace, monospace; font-size: 14px; }

.panel-page { display: flex; flex-direction: column; min-height: 100vh; min-height: 100dvh; }
.auth-main.panel-shell { display: grid; flex: 1; width: 100%; margin: 0; }
.panel-app { display: grid; grid-template-columns: 220px minmax(0, 1fr); }
.panel-sidebar { padding: 18px; background: #142d55; color: white; }
.panel-identity { display: grid; gap: 3px; padding: 4px 9px 16px; overflow-wrap: anywhere; }
.panel-identity span { color: #c6d9f5; font-size: 13px; }
.panel-sidebar nav { display: grid; gap: 4px; }
.panel-sidebar nav a { padding: 9px 10px; color: #e5eeff; border-radius: 7px; text-decoration: none; font-weight: 600; }
.panel-sidebar nav a[aria-current="page"] { background: #fff; color: #142d55; }
.panel-sidebar nav a:not([aria-current="page"]):hover { background: #2a4975; }
.panel-sidebar form { margin-top: 16px; border-top: 1px solid #ffffff35; padding-top: 12px; }
.panel-sidebar button { width: 100%; border-color: #ffffff65; background: transparent; color: white; min-height: 42px; }
.panel-sidebar button:hover { background: #2a4975; }
.panel-content { min-width: 0; padding: clamp(12px, 2vw, 28px); }
.panel-content h1 { margin: 0 0 19px; font-size: clamp(30px, 4vw, 42px); }
.panel-grid { display: grid; grid-template-columns: minmax(0, 1.38fr) minmax(0, 1fr); align-items: start; gap: 18px; }
.panel-grid.one { grid-template-columns: minmax(0, 1fr); }
.panel-card { min-width: 0; padding: clamp(16px, 2.4vw, 26px); border: 1px solid #d9e3ef; border-radius: 14px; background: white; }
.panel-card h2 { font-size: 21px; overflow-wrap: anywhere; margin: 0 0 17px; }
.panel-form { display: grid; gap: 13px; }
.panel-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.stop-dates { grid-template-columns: repeat(auto-fit, minmax(min(100%, 125px), 1fr)); }
.stop-dates input { min-width: 0; }
.panel-stops { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 218px), 1fr)); gap: 12px; }
.panel-stop { display: grid; gap: 10px; min-width: 0; margin: 0; padding: 12px; border: 1px solid #d9e3ef; border-radius: 10px; }
.panel-stop legend { padding: 0 5px; font-size: 15px; font-weight: 750; }
.panel-stops h3 { font-size: 16px; margin: 0 0 10px; }
.panel-field { display: grid; gap: 5px; align-content: start; min-width: 0; }
.panel-field select { min-width: 0; width: 100%; min-height: 48px; padding: 9px 10px; border: 1px solid #a8bbd3; border-radius: 8px; background: #fff; color: #142d55; font: inherit; }
.panel-actions { display: flex; flex-wrap: wrap; gap: 9px; align-items: start; }
.panel-actions button { padding-inline: 13px; }
.panel-secondary-action { margin-top: 15px; padding-top: 15px; border-top: 1px solid #dce5f1; }
.panel-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.panel-list li { min-width: 0; }
.panel-list a { display: flex; gap: 8px 12px; align-items: flex-start; justify-content: space-between; flex-wrap: wrap; background: #f5f8fc; border: 1px solid #e0e8f1; border-radius: 9px; padding: 12px; color: #142d55; text-decoration: none; }
.panel-list a:hover { border-color: #88aef4; }
.list-main { display: grid; min-width: 0; gap: 2px; overflow-wrap: anywhere; }
.list-main > span, .panel-account-name, .panel-empty { color: #455d7d; font-size: 14px; }
.panel-list .order-list-link { display: grid; grid-template-columns: minmax(0, 1fr); }
.order-list-details { display: grid; gap: 7px; overflow-wrap: anywhere; }
.order-list-row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: end; gap: 8px 12px; }
.order-list-row > span { white-space: pre-line; }
.order-list-label { display: block; color: #455d7d; font-size: 13px; }
.order-list-vehicle { align-items: start; border-top: 1px solid #dce5f1; padding-top: 7px; }
.panel-tags { display: flex; flex-wrap: wrap; gap: 5px; }
.panel-tags span { border-radius: 20px; padding: 3px 8px; background: #e9edf3; color: #334963; font-size: 12px; }
.order-status.ready, .panel-tags .ready { --status-bg: #eaf3ff; --status-border: #a8c7f4; --status-tag: #d8e8ff; --status-text: #174eaf; }
.order-status.in_progress, .panel-tags .in_progress { --status-bg: #fff8de; --status-border: #e8ca72; --status-tag: #ffedb1; --status-text: #664900; }
.order-status.picked_up, .panel-tags .picked_up { --status-bg: #f4edff; --status-border: #cdb1ef; --status-tag: #ebdbfc; --status-text: #613391; }
.order-status.completed, .panel-tags .completed { --status-bg: #eaf8ef; --status-border: #a4d6b4; --status-tag: #d7f1e0; --status-text: #195c48; }
.panel-card.order-status { background: var(--status-bg, #fff); border-color: var(--status-border, #d9e3ef); }
.panel-list .order-status { background: var(--status-bg, #f5f8fc); border-color: var(--status-border, #d9e3ef); }
.panel-list a.order-status:hover { border-color: var(--status-text, #88aef4); }
.panel-tags span[class] { background: var(--status-tag, #e9edf3); color: var(--status-text, #334963); }
.panel-pagination { display: flex; align-items: center; gap: 12px; margin-top: 14px; }
.panel-link { display: inline-block; margin-bottom: 13px; font-weight: 650; }
.panel-notice { margin: 0 0 13px; border-radius: 8px; padding: 10px 12px; background: #dff5eb; color: #195c48; }
.panel-notice.error { background: #fff1f2; color: #9d1438; }
.panel-check { display: flex; align-items: center; gap: 8px; }
.panel-check input { width: 18px; min-height: 18px; }
.panel-summary { margin: 0 0 17px; display: grid; gap: 10px; }
.panel-summary dt { font-weight: 700; }
.panel-summary dd { margin: 0; white-space: pre-wrap; overflow-wrap: anywhere; }
.settings-card { max-width: 620px; }
.panel-account-name { margin-bottom: 17px; }
.order-files { background: #f7faff; }
.file-source, .file-control { display: grid; align-content: start; gap: 7px; min-width: 0; }
.file-source { gap: 10px; }
.file-control span { font-size: .88rem; font-weight: 700; }
.file-control button { justify-self: start; }
.file-picker { width: min(100% - 32px, 520px); max-height: 82vh; padding: 20px; border: 1px solid #d9e3ef; border-radius: 14px; background: #fff; color: #142d55; }
.file-picker::backdrop { background: #142d5599; }
.file-picker-header { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 8px; margin-bottom: 12px; }
.file-picker-header h3 { margin: 0; font-size: 1rem; }
.file-picker .file-list, .file-picker [data-file-more] { margin-top: 10px; }
.order-files [data-file-status], .file-picker [data-file-picker-status] { margin: 0; overflow-wrap: anywhere; }
.order-files [data-file-status]:empty, .file-picker [data-file-picker-status]:empty, .file-list:empty { display: none; }
.file-tabs { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 20px; }
.file-tabs a { border-radius: 8px; padding: 8px 14px; font-weight: 700; background: #edf4ff; text-decoration: none; }
.file-tabs a[aria-current=page] { background: #2355be; color: white; }
.file-upload-form { padding-bottom: 18px; border-bottom: 1px solid #dce5f1; }
.file-search { display: flex; flex-wrap: wrap; align-items: end; gap: 8px; margin: 16px 0; }
.file-search label { flex: 1 1 190px; }
.file-list { display: grid; gap: 6px; margin: 0; padding: 0; list-style: none; }
.file-list li { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 6px 12px; padding: 7px 9px; border-radius: 7px; background: #edf4ff; }
.file-list a, .file-list li > span { min-width: 0; overflow-wrap: anywhere; }
.file-list button { padding: 4px 9px; min-height: 36px; }
.panel-field input:disabled { opacity: .58; cursor: not-allowed; }
.customer-picker-status { color: #455d7d; font-size: 14px; }
.customer-picker-status:empty { display: none; }
.customer-save { display: grid; justify-items: start; gap: 5px; }
.customer-save dialog .panel-actions { margin-top: 10px; }
.trash-entry { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: start; gap: 12px; padding: 12px; background: #f5f8fc; border: 1px solid #d9e3ef; border-radius: 9px; }
.driver-view { max-width: 650px; }
.driver-picker { display: flex; flex-wrap: wrap; align-items: end; gap: 10px; margin-bottom: 18px; }
.driver-picker label { flex: 1 1 205px; }
.driver-orders h3 { margin: 0 0 12px; }
.driver-orders .panel-stops { grid-template-columns: minmax(0, 1fr); }
.driver-order-stops, .driver-orders .driver-order-stops { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.driver-order-stops > section { min-width: 0; border: 1px solid var(--status-border, #d9e3ef); border-radius: 9px; padding: clamp(7px, 1.7vw, 14px); }
.driver-panel > .panel-top, .admin-panel > .panel-top { margin-bottom: 16px; }
.order-file-actions { display: flex; flex-wrap: wrap; gap: 8px 13px; }
.driver-photo-gallery { margin-top: 14px; }
.driver-photo-gallery h3, .driver-photo-gallery .file-list { margin: 0 0 8px; }
.driver-photo-upload { display: flex; flex-wrap: wrap; align-items: end; gap: 8px; margin-top: 9px; }
.driver-photo-upload > label { flex: 1 1 230px; }
.driver-photo-upload [role=status] { flex-basis: 100%; }
.vehicle-edit-row { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 7px; align-items: end; padding: 8px 0; }
.vehicle-edit-row + .vehicle-edit-row { border-top: 1px solid #d9e3ef; }
.vehicle-edit-row .panel-actions { grid-column: 1 / -1; }
.driver-copy-actions { margin-top: 6px; }
.driver-copy-actions button { padding: 5px 8px; min-height: 34px; font-size: .8rem; }
.driver-copy-actions [role=status] { width: 100%; }
.office-document, .document-preview { display: grid; gap: 10px; min-width: 0; }
.office-document [data-doc-preview][hidden] { display: none; }
.document-preview { border: 1px solid #d9e3ef; border-radius: 8px; background: #fff; padding: 18px; overflow-wrap: anywhere; }
.document-preview h1 { font-size: 1.5rem; margin: 0; }
.document-preview h2 { font-size: 1.15rem; }
.document-preview p { white-space: pre-wrap; }
.document-preview :is(p, h2, h3, h4, ul, ol) { margin: 0 0 .65em; }
@media print {
  .document-printing { background: white; color: black; }
  .document-printing :is(.auth-header,.panel-sidebar,.panel-content > h1,.file-tabs,.panel-link,.panel-grid > section:not(:has([data-doc-preview])),.panel-card > h2,form > :not([data-office-document]),[data-office-document] > :not([data-doc-preview])) { display: none !important; }
  .document-printing :is(.auth-main,.panel-app,.panel-content,.panel-grid,.panel-card,[data-office-form],[data-office-document]) { display: block; margin: 0; padding: 0; width: auto; border: 0; box-shadow: none; }
  .document-printing .office-document [data-doc-preview] { display: block !important; border: 0; padding: 0; }
}
.week-create summary { font-weight: 650; cursor: pointer; }
.week-create .panel-actions { align-items: end; margin-top: 8px; }
.admin-application p { margin-bottom: 14px; }
.calendar-grid { display: grid; grid-template-columns: repeat(7,minmax(0,1fr)); gap: 5px; margin-top: 12px; }
.calendar-weekday { text-align: center; font-weight: 700; font-size: 13px; color: #50617a; }
.calendar-day { min-width: 0; min-height: 57px; padding: 5px; border: 1px solid #d9e3ef; border-radius: 7px; color: inherit; text-decoration: none; }
.calendar-day > span { display: flex; flex-wrap: wrap; gap: 2px; }
.calendar-day:hover, .calendar-day[aria-current=date] { background: #eaf3ff; border-color: #437ad2; }
.calendar-day.today > strong { text-decoration: underline; text-underline-offset: 3px; }
.calendar-pickup, .calendar-delivery { font-size: .75rem; font-weight: 650; border-radius: 5px; padding-inline: 4px; }
.calendar-pickup { color: #18467a; background: #dbeafe; }
.calendar-delivery { color: #155534; background: #dcfce7; }
.calendar-legend { display: flex; gap: 8px; margin-top: 9px; }
.calendar-link { font-weight: 650; }
.calendar-selection { margin: 14px 0 8px; }
.calendar-schedule, .stats-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; }
.stats-grid { grid-template-columns: repeat(auto-fit,minmax(min(100%, 185px),1fr)); }
.stats-grid article > strong { font-size: 32px; line-height: 1.15; }
.stats-grid article > h2 { font-size: 1rem; }
@media (max-width: 620px) {
  .calendar-schedule { grid-template-columns: minmax(0,1fr); }
  .calendar-grid { gap: 3px; }
  .calendar-day { padding: 3px; min-height: 49px; }
  .calendar-pickup, .calendar-delivery { padding-inline: 2px; }
}
.driver-order-lane + .driver-order-lane { margin-top: 18px; }
.driver-order-lane h3 { margin: 0 0 6px; }
.driver-order-scroll { overflow-x: auto; padding: 2px 2px 10px; }
.driver-order-scroll .panel-list { grid-auto-flow: column; grid-auto-columns: max(186px, calc((100% - 36px) / 5)); grid-template-columns: none; gap: 9px; }
.driver-order-scroll .order-list-link { height: 100%; align-content: start; padding: 9px; font-size: 13px; }
.driver-order-scroll .order-list-row { gap: 6px; }
.driver-order-scroll .order-list-label { font-size: 11px; }
.notice-count { display: inline-grid; place-items: center; min-width: 21px; padding: 1px 6px; border-radius: 999px; background: #1d4ed8; color: #fff; font-size: 12px; font-weight: 700; }
.notice-count[hidden] { display: none; }
.notice-section { max-width: 980px; margin-bottom: 14px; }
.notice-section h2 { margin-bottom: 10px; }
.notice-section > form, .notice-section .notice-events { margin-top: 12px; }
.notice-events time { color: #455d7d; font-size: 13px; }
.notice-events li > div { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 8px; padding: 12px; border: 1px solid #d9e3ef; border-radius: 9px; }
.notice-events .unread > :is(a, div) { background: #edf4ff; border-color: #acc8f0; }
.chat-driver-list { max-height: 280px; overflow: auto; }
.chat-room { max-width: 920px; }
.driver-chat .chat-room { margin-top: 0; }
.driver-chat > .panel-top { margin-bottom: 15px; }
.chat-participants { margin-bottom: 12px; }
.chat-participants summary, .mail-connection summary { cursor: pointer; font-weight: 700; overflow-wrap: anywhere; }
.chat-participants .file-list, .chat-participants .panel-form, .mail-connection .panel-form { margin-top: 10px; }
.chat-history-nav { display: flex; flex-wrap: wrap; gap: 12px; }
.chat-messages { display: grid; align-content: start; gap: 8px; min-height: 90px; max-height: 53vh; overflow-y: auto; padding: 10px; margin: 0 0 14px; border-radius: 9px; background: #f1f5f9; list-style: none; }
.chat-message { justify-self: start; max-width: min(85%, 620px); border: 1px solid #d9e3ef; padding: 8px 11px; border-radius: 9px; background: #fff; overflow-wrap: anywhere; }
.chat-message.own { justify-self: end; background: #eaf3ff; }
.chat-message > div { display: flex; flex-wrap: wrap; gap: 3px 10px; font-size: 13px; }
.chat-message > div span { color: #455d7d; }
.chat-message p { white-space: pre-wrap; }
.mail-connection { margin-bottom: 16px; max-width: 920px; }
.mail-connection p { margin-top: 8px; color: #455d7d; }
[data-office-sheet] { min-width: 0; }
.sheet-scroll { overflow: auto; max-height: 55vh; margin: 10px 0; border: 1px solid #d9e3ef; border-radius: 8px; }
.office-sheet { border-collapse: collapse; min-width: 100%; background: #fff; font-size: 14px; }
.office-sheet th, .office-sheet td { border: 1px solid #d9e3ef; padding: 0; }
.office-sheet th { min-width: 35px; padding: 5px; background: #edf4ff; text-align: center; }
.office-sheet td input { min-height: 36px; min-width: 106px; padding: 4px 7px; border: 0; border-radius: 0; }
.office-sheet td input:focus-visible { position: relative; outline-offset: -3px; }
.office-sheet output { display: block; padding: 0 7px 4px; color: #174eaf; font-weight: 700; }
.office-sheet output:empty { display: none; }
@media (max-width: 1040px) { .panel-grid { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 690px) {
  .panel-page .auth-header { padding: 12px; gap: 12px; }
  .panel-page .auth-header nav { font-size: 13px; gap: 2px 10px; }
  .panel-app { grid-template-columns: minmax(0, 1fr); grid-template-rows: auto 1fr; }
  .panel-sidebar nav { display: flex; flex-wrap: wrap; }
  .panel-sidebar button { width: auto; }
}
@media (max-width: 460px) { .panel-fields, .trash-entry { grid-template-columns: minmax(0, 1fr); } }
