/* Web-only declaration/notification UI. Export markup is outside these roots. */
@media screen {
  :is(#registrationDetailsModal, #registrationEditorModal, #notificationPanel) { color: #1e293b; }
  :is(#registrationDetailsModal, #registrationEditorModal, #notificationPanel) button { min-height: 44px; }
  :is(#registrationDetailsModal, #registrationEditorModal, #notificationPanel) :is(button, input, summary):focus-visible {
    outline: 2px solid #2563eb; outline-offset: 3px;
  }
  :is(#registrationDetailsModal, #registrationEditorModal) input { font-size: 16px; }
  #registrationDetailsBody td { overflow-wrap: anywhere; }
  #registrationDetailsBody table { table-layout: fixed; width: 100%; }
  #registrationDetailsBody th:first-child { width: 30%; }
  #registrationEditorBody label { display: block; }
  .dark :is(#registrationDetailsModal, #registrationEditorModal, #notificationPanel) { color: #e2e8f0; }
  .dark :is(#registrationDetailsModal, #registrationEditorModal, #notificationPanel) :is(.text-slate-800,.text-slate-600,.text-slate-700) { color: #e2e8f0; }
  .dark :is(#registrationDetailsModal, #registrationEditorModal, #notificationPanel) .text-slate-500 { color: #cbd5e1; }
  .dark :is(#registrationDetailsModal, #registrationEditorModal, #notificationPanel) :is(input, button.bg-white) { background: #0f172a; color: #e2e8f0; border-color: #475569; }
  .dark :is(#registrationDetailsModal, #registrationEditorModal, #notificationPanel) :is(.border-slate-200,.border-slate-100) { border-color: #334155; }
  .dark :is(#registrationDetailsModal, #registrationEditorModal, #notificationPanel) .text-orange-600 { color: #fdba74; }
  #registrationDetailsModal > div, #registrationEditorModal > div, #notificationPanel > div { animation: declaration-enter 160ms ease-out; }
  @keyframes declaration-enter { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: translateY(0); } }
  @media (max-width: 639px) {
    :is(#registrationDetailsModal, #registrationEditorModal, #notificationPanel) { align-items: flex-end; padding: 0; }
    :is(#registrationDetailsModal, #registrationEditorModal, #notificationPanel) > div { margin: 0; max-width: none; max-height: 92dvh; border-radius: 16px 16px 0 0; padding-bottom: env(safe-area-inset-bottom); }
    #registrationDetailsBody thead { display: none; }
    #registrationDetailsBody :is(table, tbody, tr) { display: block; }
    #registrationDetailsBody tr { padding: 8px 0; }
    #registrationDetailsBody td { display: flex; align-items: center; justify-content: space-between; text-align: left; padding: 6px 0; }
    #registrationDetailsBody td::before { content: attr(data-label); font-weight: 500; color: #64748b; margin-right: 12px; }
    .dark #registrationDetailsBody td::before { color: #cbd5e1; }
  }
  @media (prefers-reduced-motion: reduce) {
    #registrationDetailsModal > div, #registrationEditorModal > div, #notificationPanel > div { animation: none; }
  }
}