/* Phase 4: public screens, built on the shared foundation. */
[hidden] { display: none !important; }
html .public-map-page .map-panel { background: var(--eco-surface); color: var(--eco-text); border-color: var(--eco-border); box-shadow: var(--eco-shadow-2); }
html .public-map-page .map-panel :is(.eyebrow, .map-message, .update-row, .map-counts span, .incident-list small, .panel-body label) { color: var(--eco-muted); }
html .public-map-page .map-panel :is(.map-modes button, .incident-list button, .offline-reports-link, .track-link, .dark-button) { color: var(--eco-text); border-color: var(--eco-border); }
html .public-map-page .map-modes button[aria-pressed=true] { color: var(--eco-blue); border-color: var(--eco-blue); }
html .public-map-page .map-panel :is(select, .selected-detail button) { background: var(--eco-surface); color: var(--eco-text); border-color: var(--eco-control-border); }
html .public-map-page .map-panel :is(.map-modes, .update-row, .selected-detail, .map-counts > div + div) { border-color: var(--eco-border); }
html .public-map-page .map-panel .incident-list button:hover { background: var(--eco-surface-alt); }
html .public-map-page .map-panel .incident-status { color: var(--eco-pending); }
html .public-map-page .map-panel .incident-status.closed { color: var(--eco-closed); }
html .public-map-page .map-message { line-height: 1.6; }
html .public-map-page #routeButton { margin-top: 12px; }
html .public-map-page #routeButton { min-height: 44px; padding: 10px 14px; background: var(--eco-surface); color: var(--eco-blue); border: 1px solid var(--eco-control-border); border-radius: 6px; }
html .public-map-page #routeButton:disabled { display: none; }
.map-bottom-actions .map-secondary { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 48px; padding: 0 18px; border: 1px solid var(--eco-border); border-radius: 6px; color: var(--eco-text); background: var(--eco-surface); font-size: 14px; text-decoration: none; white-space: nowrap; }
.type-picker { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin: 16px 0; }
.type-picker button { position: relative; display: flex; flex-direction: column; gap: 8px; min-height: 104px; padding: 12px 8px; white-space: normal; overflow-wrap: anywhere; background: var(--eco-surface); color: var(--eco-text); border: 2px solid var(--eco-control-border); border-radius: 6px; font-size: 14px; }
.type-picker i { font-size: 24px; color: var(--eco-blue); }
.type-picker button[aria-pressed=true] { border: 2px solid var(--eco-blue); background: var(--eco-verified-bg); }
.type-picker .choice-check { position: absolute; right: 6px; top: 6px; font-size: 16px; color: var(--eco-blue); visibility: hidden; }
.type-picker button[aria-pressed=true] .choice-check { visibility: visible; }
.report-progress-meter { width: 100%; height: 6px; accent-color: var(--eco-blue); display: block; margin: 8px 0 16px; }
.report-shell .report-progress { position: relative; }
.report-shell .report-progress li { font-size: 12px; color: var(--eco-muted); }
.report-shell #incidentForm { border: 0; padding-inline: 0; background: transparent !important; }
.report-shell [data-report-step] h2 { font-size: 20px; margin-bottom: 20px; }
.report-shell .form-actions { position: sticky; bottom: 0; background: var(--eco-bg); padding-bottom: max(12px, env(safe-area-inset-bottom)); z-index: 400; }
.report-shell :is(.form-actions button, .location-actions button, .camera-label, .offline-item-actions a, .offline-item-actions button) { min-height: 44px; }
.report-shell .photo-preview button { min-width: 44px; min-height: 44px; }
.report-shell .camera-label:has(+ #cameraInput:focus-visible) { outline: 3px solid var(--eco-focus); outline-offset: 3px; }
.draft-status { color: var(--eco-muted); font-size: 12px; margin: 8px 0; min-height: 18px; }
.field-error { color: var(--eco-urgent); font-size: 14px; margin: 8px 0; }
.report-receipt { padding-block: 24px; }
.report-receipt > i { font-size: 36px; color: var(--eco-closed); }
.report-receipt.local > i { color: var(--eco-pending); }
.report-receipt h2 { margin: 16px 0; font-size: 24px; }
.receipt-code { display: block; font-size: 20px; color: var(--eco-text); padding: 16px 0; overflow-wrap: anywhere; font-variant-numeric: tabular-nums; }
.receipt-actions { display: flex; flex-wrap: wrap; gap: 8px; margin: 20px 0; }
.receipt-actions :is(a, button) { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 44px; padding: 10px 14px; border: 1px solid var(--eco-control-border); border-radius: 6px; color: var(--eco-blue); text-decoration: none; background: var(--eco-surface); font-size: 14px; }
.receipt-actions .primary { background: var(--eco-blue); color: var(--eco-surface); }
.tracking-headline { padding-block: 16px; border-bottom: 1px solid var(--eco-border); }
.tracking-headline h2 { font-size: 24px; margin-bottom: 8px; }
.tracking-headline .eco-status { margin-bottom: 12px; }
.public-timeline { list-style: none; margin: 24px 0; padding: 0; }
.public-timeline li { position: relative; padding: 0 0 24px 40px; border-left: 2px solid var(--eco-border); margin-left: 16px; }
.public-timeline li:last-child { padding-bottom: 0; border-left-color: transparent; }
.public-timeline .timeline-icon { position: absolute; left: -17px; top: 0; width: 32px; height: 32px; border-radius: 999px; display: grid; place-items: center; background: var(--eco-surface-alt); border: 1px solid var(--eco-control-border); color: var(--eco-text); }
.public-timeline [aria-current=step] .timeline-icon { background: var(--eco-verified-bg); color: var(--eco-verified); border-color: var(--eco-verified); }
.public-timeline strong { font-size: 16px; display: block; }
.public-timeline time, .public-timeline p { font-size: 14px; color: var(--eco-muted); margin: 6px 0 0; line-height: 1.5; }
body.public-auth { background: var(--eco-bg) !important; min-height: 100dvh; overflow: auto; }
body.public-auth::before, .public-auth .login-left::after { display: none; }
.public-auth .login-card { border: 1px solid var(--eco-border); border-radius: 8px; box-shadow: var(--eco-shadow-2); backdrop-filter: none; }
.public-auth .login-left { min-height: 560px; background-size: contain; background-color: #142d46; }
.public-auth .login-right { padding: 32px; flex: 1; min-width: 0; background: var(--eco-surface); }
.public-auth .form-header h3 { font-size: 24px; color: var(--eco-text); }
.public-auth .form-header p { color: var(--eco-muted); font-size: 14px; }
.public-auth .login-brand { display: flex; align-items: center; gap: 12px; margin-bottom: 24px; color: var(--eco-text); text-decoration: none; }
.public-auth .login-brand img { width: 48px; height: 48px; object-fit: contain; }
.public-auth .login-brand strong { display: block; font-size: 24px; }
.public-auth .login-brand small { display: block; color: var(--eco-muted); font-size: 12px; }
.public-auth .form-control { font-size: 16px; }
.public-auth .form-label { color: var(--eco-text); }
.public-auth .text-primary { color: var(--eco-blue) !important; }
html[data-theme=dark] :is(.public-auth .form-label, .public-registration .form-label) { color: var(--eco-text) !important; }
html[data-theme=dark] :is(.report-shell, .report-progress) { background: transparent !important; }
.public-auth .caps-lock { min-height: 21px; margin-top: 8px; font-size: 14px; color: var(--eco-pending); }
.public-auth .recovery-note { color: var(--eco-muted); font-size: 14px; margin-bottom: 20px; }
.public-auth .auth-wrapper { background: var(--eco-bg); }
.public-auth .auth-card { backdrop-filter: none; border: 1px solid var(--eco-border); box-shadow: var(--eco-shadow-2) !important; }
.public-auth .auth-logo img { width: 64px; height: 64px; object-fit: contain; }
.public-form-progress { display: flex; align-items: center; justify-content: space-between; gap: 12px; font-size: 14px; color: var(--eco-muted); margin-block: 20px; }
.public-form-progress progress { width: 45%; height: 6px; accent-color: var(--eco-blue); }
.public-form-navigation { display: flex; gap: 12px; justify-content: space-between; margin: 24px 0; }
.public-form-navigation button { min-height: 44px; }
.public-auth .eco-password-strength { background: var(--eco-surface-alt); border-color: var(--eco-border); }
.public-auth :is(.eco-password-title, .eco-password-rule) { color: var(--eco-muted); }
.public-auth .eco-password-rule.valid { color: var(--eco-closed); }
.public-auth:has(.eco-password-strength) .password-requirements { display: none; }
.public-registration .registration-card { background: var(--eco-surface); color: var(--eco-text); border-radius: 8px; border-color: var(--eco-border); box-shadow: var(--eco-shadow-2); }
.public-registration :is(.registration-header h1, .form-section h2) { color: var(--eco-text); }
.public-registration :is(.registration-header p, .form-text, .registration-footer, .registration-footer span) { color: var(--eco-muted); }
.public-registration .consent-panel { background: var(--eco-surface-alt); color: var(--eco-text); border-color: var(--eco-border); }
@media(max-width:900px) {
  html .public-map-page #connectionStatus { display: block; position: fixed; top: 78px; left: 12px; padding: 8px 12px; font-size: 12px; background: var(--eco-surface); color: var(--eco-text); }
  html .public-map-page .map-panel { bottom: 84px; max-height: none; height: 45dvh; transition: height var(--eco-motion); }
  html .public-map-page .map-panel[data-snap=peek] { height: 96px; }
  html .public-map-page .map-panel[data-snap=full] { height: calc(100dvh - 184px); }
  html .public-map-page .map-panel .panel-heading { flex-shrink: 0; }
  html .public-map-page .map-panel .panel-body { min-height: 0; }
  html .public-map-page .sheet-handle { min-height: 44px; touch-action: none; }
  html .public-map-page .map-bottom-actions { bottom: max(16px, env(safe-area-inset-bottom)); }
  html .public-map-page .map-bottom-actions :is(button, a) { flex: 1; padding: 0 10px; font-size: 12px; }
  html .public-map-page .map-bottom-actions .report-button { flex: 2; }
  .public-auth .login-left { display: none; }
  .public-auth .login-container { max-width: 540px; }
}
@media(max-width:600px) {
  .report-header { padding-inline: 12px; gap: 8px; height: auto; min-height: 76px; flex-wrap: wrap; }
  .report-header .report-brand { margin-right: auto; }
  .report-header .report-brand small { max-width: 125px; }
  .report-header .call-action { font-size: 12px; padding: 8px 10px; }
  .report-shell { margin-top: 20px; }
  .report-shell .form-actions button { font-size: 14px; padding-inline: 10px; }
  .report-shell .form-actions #saveDraft { margin-right: auto; }
  .report-shell .form-actions #previousStep { margin-right: 0; }
  .report-shell .report-progress li { font-size: 12px; min-height: 68px; }
  .public-auth .login-right { padding: 24px 20px; }
  .public-auth .login-brand strong { font-size: 24px; }
  .public-auth .auth-card .card-body { padding: 24px 16px !important; }
  .public-registration .registration-header { grid-template-columns: 36px 48px minmax(0,1fr); }
}
@media print { .receipt-actions, .public-form-navigation { display: none !important; } }