.pwa-offline { margin: 0; min-height: 100svh; display: grid; place-items: center; background: #e7e7e7; color: #111; font: 16px/1.6 system-ui, sans-serif; padding: 24px; box-sizing: border-box; }
.pwa-offline main { max-width: 440px; }
.pwa-offline img { display: block; margin-bottom: 28px; }
.pwa-offline h1 { font-size: 26px; line-height: 1.25; margin: 0 0 16px; }
.pwa-offline p { color: #505050; margin: 0 0 12px; }
.pwa-offline a { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: 0 18px; margin-top: 16px; background: #ff6a00; color: #111; border-radius: 6px; font-weight: 600; text-decoration: none; }
.pwa-offline a:focus-visible { outline: 3px solid #111; outline-offset: 4px; }
@media (display-mode: standalone) {
    .app-topbar { padding-top: max(8px, env(safe-area-inset-top)); }
    .app-shell { padding-right: env(safe-area-inset-right); padding-left: env(safe-area-inset-left); padding-bottom: env(safe-area-inset-bottom); }
}

/* Keep focus at the current scale; do not disable accessible pinch zoom. */
.pwa-mobile { overflow-x: clip; overscroll-behavior-x: none; background: #050505; -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
.pwa-mobile body { max-width: 100%; overflow-x: clip; overscroll-behavior-x: none; }
.pwa-mobile .app-shell, .pwa-mobile main { min-width: 0; max-width: 100%; }
.pwa-mobile :is(input:not([type="hidden"], [type="checkbox"], [type="radio"], [type="button"], [type="submit"], [type="reset"]), select, textarea, [contenteditable="true"]) { font-size: 16px !important; }
.pwa-mobile input.plate-input { font-size: 22px !important; }
.pwa-mobile :is(.app-topbar, .app-brand, .brand-symbol) { filter: none; -webkit-backdrop-filter: none; backdrop-filter: none; transform: none; opacity: 1; }
.pwa-mobile .app-topbar { background: #050505; isolation: isolate; }

/* Reflow wide management tables instead of clipping columns or actions. */
.pwa-mobile .user-list-panel { overflow: visible; border: 0; background: transparent; box-shadow: none; }
.pwa-mobile .wh-journal-page .wh-table-wrap { overflow: visible; }
.pwa-mobile :is(.user-list-table, .wh-journal-table) { display: block; width: 100%; min-width: 0 !important; }
.pwa-mobile :is(.user-list-table, .wh-journal-table) > thead { display: none; }
.pwa-mobile :is(.user-list-table, .wh-journal-table) > tbody { display: grid; width: 100%; gap: 12px; }
.pwa-mobile :is(.user-list-table, .wh-journal-table) > tbody > tr { display: grid; min-width: 0; padding: 12px; border: 1px solid #c9c9c9; border-radius: 8px; background: #fff; }
.pwa-mobile :is(.user-list-table, .wh-journal-table) > tbody > tr > td { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: 12px; width: auto; min-width: 0; padding: 7px 0; border: 0; background: none; box-shadow: none; font-size: 14px; text-align: left; overflow-wrap: anywhere; }
.pwa-mobile :is(.user-list-table, .wh-journal-table) td[data-label]::before { content: attr(data-label); color: #5f6368; font-size: 12px; font-weight: 500; }
.pwa-mobile :is(.user-list-table, .wh-journal-table) .pwa-cell-value { min-width: 0; overflow-wrap: anywhere; }
.pwa-mobile :is(.user-list-table, .wh-journal-table) td[colspan] { display: block; text-align: center; }
.pwa-mobile .user-list-table .btn { width: 100%; min-height: 44px; white-space: normal; }

.pwa-bottom-nav[hidden], .pwa-more-menu[hidden] { display: none !important; }
.pwa-bottom-nav { display: none; }
.pwa-icon { display: block; flex: 0 0 24px; width: 24px; height: 24px; }
.pwa-mobile-navigation { --pwa-nav-height: 70px; scroll-padding-bottom: calc(var(--pwa-nav-height) + env(safe-area-inset-bottom) + 16px); }
.pwa-mobile-navigation .app-shell { padding-left: env(safe-area-inset-left); padding-right: env(safe-area-inset-right); padding-bottom: calc(var(--pwa-nav-height) + env(safe-area-inset-bottom) + 16px); }
.pwa-mobile-navigation .app-topbar { padding-top: max(8px, env(safe-area-inset-top)); }
.pwa-mobile-navigation .app-topbar .navbar-toggler, .pwa-mobile-navigation #mainNav { display: none !important; }
.pwa-mobile-navigation .pwa-bottom-nav { display: block; position: fixed; inset: auto 0 0; z-index: 1040; padding: 0 env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left); background: #050505; border-top: 1px solid #333; }
.pwa-bottom-items { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); max-width: 640px; height: var(--pwa-nav-height); margin-inline: auto; }
.pwa-bottom-items-five { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.pwa-nav-link { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; min-width: 0; min-height: 48px; margin: 0; padding: 6px 2px; border: 0; border-radius: 0; background: transparent; color: #d6d6d6; font: 600 11px/16px system-ui, sans-serif; letter-spacing: 0; text-decoration: none; white-space: nowrap; -webkit-tap-highlight-color: transparent; }
.pwa-nav-link:hover, .pwa-nav-link:focus-visible, .pwa-nav-link.is-active { color: #ff6a00; }
.pwa-nav-link:active { background: #252525; }
.pwa-nav-link:focus-visible { outline: 2px solid #ff6a00; outline-offset: -4px; }
.pwa-create-symbol { display: flex; align-items: center; justify-content: center; width: 42px; height: 32px; border-radius: 6px; background: #ff6a00; color: #111; }
.pwa-nav-create { gap: 1px; color: #fff; }
.pwa-nav-create.is-active .pwa-create-symbol { outline: 2px solid #fff; outline-offset: 2px; }
.pwa-keyboard-open .pwa-bottom-nav { visibility: hidden; pointer-events: none; }
.pwa-more-menu { position: fixed; inset: auto 0 calc(var(--pwa-nav-height) + env(safe-area-inset-bottom) + 8px); width: min(480px, calc(100% - 24px)); max-height: calc(100dvh - var(--pwa-nav-height) - env(safe-area-inset-bottom) - env(safe-area-inset-top) - 32px); margin: 0 auto; padding: 16px 20px; overflow: auto; overscroll-behavior: contain; border: 1px solid #c9c9c9; border-radius: 8px; background: #fff; color: #111; }
.pwa-more-menu::backdrop { background: rgb(0 0 0 / 45%); }
.pwa-more-heading { position: sticky; top: 0; z-index: 1; display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 12px; background: #fff; }
.pwa-more-heading h2 { margin: 0; font-size: 21px; }
.pwa-menu-close { display: grid; place-items: center; flex: 0 0 44px; width: 44px; height: 44px; padding: 0; border: 0; border-radius: 6px; background: #f0f0f0; color: #111; }
.pwa-account { display: grid; gap: 4px; padding-bottom: 16px; border-bottom: 1px solid #dedede; overflow-wrap: anywhere; }
.pwa-account strong { font-size: 17px; line-height: 1.4; }
.pwa-account span { color: #5f6368; font-size: 13px; }
.pwa-more-links a, .pwa-logout button { display: flex; align-items: center; gap: 14px; min-height: 48px; width: 100%; padding: 10px 0; border: 0; border-bottom: 1px solid #e7e7e7; background: none; color: #111; font: 600 15px/1.5 system-ui, sans-serif; text-align: left; text-decoration: none; }
.pwa-more-links a.is-active { color: #9b3d00; }
.pwa-more-links a:hover, .pwa-more-links a:active, .pwa-logout button:hover { background: #fff0e5; }
.pwa-logout { margin: 8px 0 0; }
.pwa-logout button { border-bottom: 0; }
.pwa-menu-close:focus-visible, .pwa-more-links a:focus-visible, .pwa-logout button:focus-visible { outline: 2px solid #111; outline-offset: 2px; }
.pwa-menu-open, .pwa-menu-open body { overflow: hidden; }
@media print { .pwa-bottom-nav, .pwa-more-menu { display: none !important; } }