/* Touch-friendly additions; the original navy/teal visual system is retained. */
html { -webkit-text-size-adjust: 100%; scroll-padding-top: 7rem; }
body { overflow-wrap: anywhere; }
*, *::before, *::after { box-sizing: border-box; }
main, section, main .grid > *, main .flex > * { min-width: 0; }
input, select, textarea { max-width: 100%; }
button, label:has(input[type="file"]) { touch-action: manipulation; }
button { min-height: 40px; }
button:disabled { opacity: .6; cursor: wait; }
:is(button, input, select, textarea, summary, a):focus-visible {
  outline: 3px solid #00a88f !important; outline-offset: 3px;
}
input[aria-invalid="true"] { border-color: #be123c !important; }
textarea { resize: vertical; min-height: 110px; }
html[dir="ltr"] [id^="tab-"] { text-align: left; }
.app-tools { display: flex; align-items: center; justify-content: space-between; gap: 1rem; flex-wrap: wrap; padding: .85rem 1rem; border: 1px solid #dbe5eb; border-radius: 1rem; background: #fff; }
.app-save-copy { flex: 1 1 250px; }
.app-save-status { color: #096d5e; font-size: .82rem; font-weight: 800; }
.app-save-status[data-state="error"] { color: #be123c; }
.app-local-note { margin-top: .2rem; color: #64748b; font-size: .72rem; line-height: 1.7; }
.app-tool-actions { display: flex; gap: .45rem; flex-wrap: wrap; }
.app-tool-button { padding: .5rem .75rem; border: 1px solid #dce3e9; border-radius: .65rem; font-weight: 700; font-size: .75rem; background: #f8fafc; color: #1b1464; }
.app-help { width: 100%; border-top: 1px solid #e2e8f0; padding-top: .6rem; font-size: .8rem; line-height: 1.8; }
.app-help summary { cursor: pointer; color: #1b1464; font-weight: 800; }
.app-help p { margin: .5rem 0; }
.app-message { width: 100%; color: #9f1239; font-size: .8rem; line-height: 1.7; white-space: pre-line; }
.app-message:empty { display: none; }
.app-file-label { position: relative; }
/* Keep native file inputs in the accessibility tree and keyboard tab order. */
label > input[type="file"].hidden { display: block !important; position: absolute; width: 1px; height: 1px; overflow: hidden; opacity: 0; clip-path: inset(50%); }
label:has(input[type="file"]):focus-within { outline: 3px solid #00a88f; outline-offset: 3px; }
.app-photo-remove { position: absolute; top: .25rem; inset-inline-end: .25rem; min-width: 36px; min-height: 36px; border: 2px solid white; border-radius: 50%; background: #be123c; color: white; font-size: 16px; font-weight: 800; box-shadow: 0 2px 6px #0002; }
.app-field-label { display: block; margin-bottom: .3rem; font-size: .72rem; color: #475569; font-weight: 700; }
.app-room-actions { display: flex; flex-wrap: wrap; gap: .5rem; }
.app-item-row { display: grid; grid-template-columns: minmax(0, 5fr) minmax(72px, 1fr) minmax(0, 4fr) 40px; align-items: end; gap: .65rem; background: #fff; border: 1px solid #e2e8f0; border-radius: .75rem; padding: .75rem; }
.app-item-row input, .app-item-row select { width: 100%; padding: .55rem .65rem; border: 1px solid #cbd5e1; border-radius: .5rem; background: white; font-size: .85rem; }
.app-delete-item { color: #be123c; background: #fff1f2; border-radius: .5rem; }
.app-blank-row-note { font-size: .75rem; color: #64748b; }
@media (max-width: 767px) {
  input:not([type="file"]), select, textarea { font-size: 16px !important; min-height: 44px; }
  button, label:has(input[type="file"]) { min-height: 44px; }
  .app-photo-remove { min-height: 36px; }
  .app-item-row { grid-template-columns: minmax(0, 1fr) 80px; }
  .app-item-status { grid-column: 1; }
  .app-delete-item { grid-column: 2; }
}
@media (max-width: 639px) {
  body > header { position: static !important; }
  body > header > div { display: grid !important; grid-template-columns: minmax(0, 1fr); gap: .65rem !important; padding: .65rem 1rem !important; }
  body > header > div > :first-child { justify-content: center; }
  body > header > div > :last-child { display: grid !important; grid-template-columns: auto auto minmax(0, 1fr); gap: .45rem !important; }
  body > header > div > :last-child button { justify-content: center; padding: .55rem .6rem !important; font-size: 11px !important; line-height: 1.6; }
  body > header > div > :last-child button:last-child { font-size: 12px !important; }
  main { padding-inline: .8rem !important; padding-top: 1rem !important; }
  main > section, main > div > section { border-radius: 1rem !important; }
  .app-tools { gap: .65rem; padding: .8rem; }
  .app-tool-actions { width: 100%; }
  .app-tool-button { flex: 1 1 auto; }
  #mapUrl { min-width: 0; }
  #nlRoundMode { max-width: 150px; }
}
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { scroll-behavior: auto !important; transition: none !important; } }
@media print { .app-tools, .app-message { display: none !important; } }
