/* Phone layout: the tool panel becomes a bottom sheet (peek / half / full) so the map stays visible above it. */
#sheetHandle { display: none; }

.map-tool-button { pointer-events:auto; border:1px solid #475569; border-radius:.5rem; background:rgba(15,23,42,.94); padding:.5rem .75rem; color:#e2e8f0; font-size:.75rem; font-weight:700; box-shadow:0 8px 16px #02061766; }
.price-toggle { border-color:#bef264; color:#d9f99d; }
.price-legend { pointer-events:auto; display:flex; align-items:center; gap:5px; border:1px solid #475569; border-radius:.5rem; background:rgba(2,6,23,.95); padding:6px 9px; color:#f1f5f9; font-size:10px; }
.price-legend[hidden] { display:none; }
.price-legend i { width:12px; height:12px; border:1px solid #ffffff40; border-radius:3px; }
.help-toggle { border-color:#7dd3fc; color:#bae6fd; }
.help-sheet { position:fixed; z-index:1300; left:50%; bottom:1rem; box-sizing:border-box; width:min(680px,calc(100vw - 2rem)); max-width:100vw; max-height:85vh; overflow:auto; transform:translateX(-50%); border:1px solid #7dd3fc66; border-radius:18px; background:rgba(2,6,23,.98); padding:16px; color:#f8fafc; box-shadow:0 18px 50px #000b; }
.help-sheet[hidden] { display:none; }
.help-inner { max-width:760px; margin:auto; }
.help-header,.help-footer { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.help-kicker { margin:0; color:#7dd3fc; font-size:11px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; }
.help-header h2 { margin:4px 0 0; font-size:18px; font-weight:800; }
.help-close,.help-skip,.help-done { border:0; border-radius:8px; padding:8px 12px; cursor:pointer; }
.help-close,.help-skip { background:#1e293b; color:#e2e8f0; }
.help-done { background:#7dd3fc; color:#082f49; font-size:12px; font-weight:800; }
.help-steps { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; margin:14px 0; }
.help-steps article { display:flex; align-items:flex-start; gap:10px; min-width:0; border:1px solid #334155; border-radius:12px; background:#0f172a; padding:10px; }
.help-steps article>span { display:grid; width:36px; height:36px; flex:0 0 36px; place-items:center; border-radius:50%; background:#1e293b; font-size:18px; }
.help-steps p { margin:0; font-size:12px; line-height:1.5; overflow-wrap:anywhere; }
.help-quick .help-more { display:none; }
.help-footer { justify-content:flex-end; }

@media (max-width: 767px) {
  .help-sheet { left:0; right:0; bottom:0; width:100%; max-width:100vw; max-height:78dvh; transform:none; border-radius:18px 18px 0 0; padding:14px 14px calc(14px + env(safe-area-inset-bottom)); }
  .help-steps { grid-template-columns:minmax(0,1fr); }
  #topFloatingToolbar { max-width:100vw; }
  #sidebarPanel {
    top: auto !important; left: 0 !important; right: 0 !important; bottom: 0 !important;
    width: 100vw !important; height: 92vh !important; height: 92dvh !important;
    border-right: 0 !important; border-top: 1px solid rgba(250, 204, 21, 0.4);
    border-radius: 18px 18px 0 0; overflow: hidden;
    transform: translateY(var(--sheet-y, 0px)) !important;
    transition: transform 0.28s cubic-bezier(0.2, 0.8, 0.2, 1);
    box-shadow: 0 -12px 32px rgba(0, 0, 0, 0.55);
  }
  #sidebarPanel.sheet-dragging { transition: none; }
  #sheetHandle {
    display: flex; flex-direction: column; align-items: center; gap: 2px;
    padding: 8px 0 2px; touch-action: none; cursor: grab; flex-shrink: 0;
  }
  #sheetHandle::before { content: ''; width: 44px; height: 5px; border-radius: 999px; background: #94a3b8; }
  #sheetHandle span { font-size: 10px; color: #94a3b8; line-height: 1.2; }
  #sidebarPanel[data-sheet='peek'] #kmzStatusContainer { display: none; }
  #btnOpenSidebar, #btnOpenEstimate { display: none !important; }
  #btnCollapseSidebar span:last-child { display: none; }

  /* Keep map controls and floating panels above the visible part of the sheet. */
  .leaflet-bottom { bottom: var(--sheet-visible, 140px); transition: bottom 0.28s; }
  #parcelActionSheet, #drawParcelControls {
    position: fixed !important; left: 8px !important; right: 8px !important; top: auto !important;
    bottom: calc(var(--sheet-visible, 140px) + 8px) !important;
    width: auto !important; transform: none !important; z-index: 1060 !important;
  }
}