/* DEC1136: Apple HIG-inspired web controls. Compact visible chrome without
 * shrinking a finger target below 44 CSS px. CSS px are the web layout unit,
 * not a claim of native UIKit/Dynamic Type support. Never scale the page/text.
 * Header, status rows and map controls share one vertical origin; the earlier
 * 82px map offset overlapped the 84px header and its invisible hit regions. */
body.orb-field {
  --field-header-size: 84px;
  --field-touch-size: 44px;
  --field-map-face: 29px;
  --field-control-gap: 4px;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
body.orb-field .top-header {
  height: calc(var(--field-header-size) + var(--safe-top, 0px));
  padding-left: max(12px, env(safe-area-inset-left));
  padding-right: max(12px, env(safe-area-inset-right));
}
body.orb-field .top-header .header-right { gap: var(--field-control-gap); flex-shrink: 0; }
body.orb-field .top-header .header-btn { width:44px; height:44px; min-width:44px; min-height:44px; }
body.orb-field .top-header .header-btn img { width:18px; height:18px; }
body.orb-field #aiBtn #aiIcon { width:40px!important; height:36px!important; }

/* 29px visible faces, 44px hit regions, and 4px between hit regions. Their
 * centres align with the last header action and the floating Add button. */
body.orb-field .map-controls {
  top: calc(var(--field-header-size) + var(--safe-top, 0px) + 20px);
  right: max(19.5px, calc(env(safe-area-inset-right) + 7.5px));
  gap:19px;
  align-items:center;
}
body.orb-field .map-area.banner-visible .map-controls {
  top: calc(var(--field-header-size) + var(--safe-top, 0px) + 60px);
}
body.orb-field #fieldCollectionZoom { gap:19px; }
body.orb-field .map-controls :is(.btn-icon, #compassIndicator, #fieldCollectionZoom button) {
  flex:0 0 var(--field-map-face);
  width:var(--field-map-face); height:var(--field-map-face);
  min-width:var(--field-map-face)!important; min-height:var(--field-map-face)!important;
  padding:0; margin:0; border-radius:8px;
}
body.orb-field .map-controls :is(.btn-icon, #compassIndicator, #fieldCollectionZoom button)::after {
  inset:auto; top:50%; left:50%; width:44px; height:44px;
  transform:translate(-50%,-50%);
}
body.orb-field #compassIndicator svg { width:25px; height:25px; }
body.orb-field #gpsBtn .field-gps-arrow { width:16px; height:16px; }
body.orb-field #fieldCollectionZoom button { font-size:18px; }
body.orb-field.field-short-viewport.field-collecting:not(.field-ai-open) .map-controls {
  left:max(19.5px, calc(env(safe-area-inset-left) + 7.5px));
  right:max(19.5px, calc(env(safe-area-inset-right) + 7.5px));
}
/* Rotation must leave the entire map-control hit row above the scrollable
 * sheet, even when a tall portrait sheet height was saved by the user. */
body.orb-field.field-short-viewport #collectionPanel:not(.minimized) {
  max-height:calc(var(--field-visible-height,100dvh) - var(--safe-top,0px) - 156px)!important;
}

/* Shared floor covers generated dialogs, configuration, tables and Rainbot.
 * Inline help already has its own 44px expanded hit region. Map controls use
 * the explicitly separated regions above, not a second overlapping target. */
body.orb-field button:not(.map-controls button):not(.field-help-toggle) {
  min-height:var(--field-touch-size)!important;
  min-width:var(--field-touch-size)!important;
  touch-action:manipulation;
}
body.orb-field button[data-field-control="close"],
body.orb-field button[data-field-control="minimize"] { font-size:25px!important; }
body.orb-field #addBtn { width:44px; height:44px; min-width:44px; }
body.orb-field #addBtn[data-field-control="open"]::before { width:16px; height:16px; }
body.orb-field :is(#fieldStorageActions,#fieldStorageForm,#fieldFeatureVersions,#fieldSiteLibrary,#fieldProjects,#layerConfigView,#userManagementView,#ov) button:not([data-field-control="close"]):not(.field-help-toggle) {
  padding-block:7px; padding-inline:11px;
}
body.orb-field #collectionPanel .collection-header button:not([data-field-control="close"]) { padding-inline:9px; }
body.orb-field #collectionPanel :is(.template-list-item,.subtype-item) {
  min-height:50px!important; padding:9px;
}
body.orb-field #collectionPanel .collect-action-row .collect-action-btn {
  min-height:50px!important; padding:9px 7px;
}
body.orb-field #collectionPanel .collect-action-btn svg { width:20px; height:20px; }
body.orb-field :is(#fieldStartGuidance,#fieldPositionActions,#fieldAttachmentUndo) button,
body.orb-field #fieldEditVisit { padding:7px 11px; }
body.orb-field :is(#fieldSubmitReview,#fieldCollectionConfirm) button { padding:9px 14px; }
body.orb-field #overflowMenu button.field-menu-action { padding-block:8px; }
body.orb-field #aiPanel #canvasWelcome .review-starters button { padding:9px 12px!important; }
body.orb-field :is(button,summary,[role="button"]):focus-visible { outline:2px solid var(--brand-accent,#4ca6ea); outline-offset:2px; }
@media (max-width:600px) {
  /* Leave actual layer rows visible below Search, not only the list heading. */
  body.orb-field #layerConfigView .layer-config-sidebar { min-height:180px; max-height:40%; }
}
@media (prefers-reduced-motion:reduce) {
  body.orb-field :is(button,.slider-panel,.map-controls) { transition:none!important; }
}

/* DEC1138: truthful unavailable actions, a single phone navigation stack,
 * and compact notices that yield the map to active forms and Rainbot. */
body.orb-field button:disabled { opacity:.45!important; cursor:not-allowed!important; box-shadow:none!important; }
body.orb-field.field-collecting #addBtn { display:none!important; }
body.orb-field #fieldLayerBack { display:none; }
body.orb-field .user-item-email { white-space:normal; overflow-wrap:anywhere; text-overflow:clip; }
body.orb-field #gpsBtn[data-gps-issue="true"] { outline:2px solid #d99a38; }
body.orb-field #fieldGpsHelp { display:flex; align-items:center; gap:8px; max-width:400px; font-size:12px; padding:6px 10px; }
body.orb-field #fieldGpsHelp[hidden],body.orb-field.field-ai-open #fieldGpsHelp { display:none!important; }
body.orb-field #fieldWorkContext { cursor:pointer; }
body.orb-field #fieldProjectReadiness { color:var(--text-primary); background:var(--bg-surface); border:1px solid var(--border-subtle); border-radius:16px; width:min(520px,calc(100vw - 24px)); max-height:calc(100dvh - 32px); padding:20px; overflow:auto; }
body.orb-field #fieldProjectReadiness button { margin:4px; padding:8px 12px; color:var(--text-primary); background:var(--bg-card); border:1px solid var(--border-subtle); border-radius:8px; }
body.orb-field #fieldProjectReadiness li { padding:5px 0; overflow-wrap:anywhere; }
body.orb-field #fieldSubmitReview ul { max-height:220px; overflow:auto; padding-left:20px; overflow-wrap:anywhere; }
body.orb-field #fieldRainbotLocal { padding:8px 14px; }
body.orb-field #fieldRainbotLocal button { margin:3px; padding:8px 12px; border:1px solid var(--border-subtle); border-radius:8px; background:var(--bg-card); color:var(--text-primary); }
body.orb-field #fieldRainbotLocal p { font-size:12px; color:var(--text-secondary); }
@media(max-width:600px) {
 body.orb-field #layerConfigView #layersTabContent { flex-direction:column; min-height:0; }
 body.orb-field #layerConfigView .layer-config-sidebar { min-height:0; max-height:none; flex:1; width:100%; }
 body.orb-field #layerConfigView:not(.field-layer-detail) #layerConfigEditor { display:none; }
 body.orb-field #layerConfigView.field-layer-detail .layer-config-sidebar { display:none; }
 body.orb-field #layerConfigView.field-layer-detail #fieldLayerBack { display:block; align-self:flex-start; flex-shrink:0; margin:4px 12px; }
 body.orb-field #layerConfigView #layerConfigEditor { min-height:0; flex:1; overflow:auto; }
 body.orb-field #userManagementView .user-add-row { display:grid; grid-template-columns:minmax(0,1fr); }
 body.orb-field #userManagementView .user-add-row :is(input,select,button) { width:100%; min-width:0; box-sizing:border-box; }
 body.orb-field #userManagementView .user-item { display:grid; grid-template-columns:32px minmax(0,1fr); gap:8px; padding:12px; }
 body.orb-field #userManagementView .user-item-avatar { width:32px; height:32px; }
 body.orb-field #userManagementView .user-item-actions { grid-column:2; flex-wrap:wrap; }
 body.orb-field #userManagementView .user-item-actions select { flex:1; min-width:0; height:44px; }
}
body.orb-field #canvasWelcome .review-starters[hidden] { display:none!important; }
body.orb-field #fieldRainbotLocal summary { cursor:pointer; min-height:44px; display:flex; align-items:center; font-size:13px; color:var(--text-secondary); }
body.orb-field #fieldWorkContext { cursor:default; }
body.orb-field #fieldLayerBack { background:var(--bg-card);color:var(--text-primary);border:1px solid var(--border-subtle);border-radius:8px;padding:8px 12px; }
body.orb-field .field-config-instructions { flex-shrink:0; }
body.orb-field .field-config-instructions summary { min-height:44px; padding:10px 18px; box-sizing:border-box; color:var(--text-secondary);font-size:13px;cursor:pointer; }
@media(max-width:600px) {
 body.orb-field #layerConfigView.field-layer-detail .layer-config-actions button:not(#schemaSaveBtn) { display:none; }
 body.orb-field #layerConfigView.field-layer-detail .layer-config-header { flex-wrap:nowrap; }
 body.orb-field #layerConfigView.field-layer-detail .layer-config-actions { width:auto; margin-left:auto; }
 body.orb-field #layerConfigView.field-layer-detail .layer-config-header h2 { font-size:16px; }
}
body.orb-field #fieldUsersSignIn { background:var(--bg-surface);color:var(--text-primary);border:1px solid var(--border-subtle);border-radius:8px;padding:8px 12px;margin:6px 0; }
@media(max-width:600px) {
 body.orb-field #layerConfigView.field-layer-detail .layer-config-header { grid-template-columns:44px minmax(0,1fr) auto; }
 body.orb-field #layerConfigView.field-layer-detail .layer-config-actions { grid-column:auto; }
}
body.orb-field #aiPanel #canvasWelcome .review-starters[hidden] { display:none!important; }