/* ════════════════════════════════════
RESPONSIVE
════════════════════════════════════ */
.mobile-menu-btn {
display:none; position:fixed; top:max(10px, env(safe-area-inset-top, 10px)); left:max(10px, env(safe-area-inset-left, 10px)); z-index:1001;
width:40px; height:40px; border:none; border-radius:8px;
background:var(--accent); color:white; font-size:20px;
cursor:pointer; align-items:center; justify-content:center; line-height:1;
}
.mobile-overlay { display:none; position:fixed; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,0.6); z-index:999; }
.mobile-overlay.open { display:block; }
@media(max-width:900px) {
.sidebar { display:none; }
.docs-flyout { display:none !important; }
.main { margin-left: 0 !important; }
.content { padding:16px max(16px, env(safe-area-inset-right, 16px)) 40px max(16px, env(safe-area-inset-left, 16px)); }
.page-header { padding:max(14px, env(safe-area-inset-top, 14px)) 16px 10px max(56px, calc(env(safe-area-inset-left, 0px) + 56px)); z-index:10; }
.ticker-wrap { margin-left:0; margin-right:0; padding-left:0; padding-right:0; -webkit-mask-image:none; mask-image:none; }
.helm-body { grid-template-columns: 1fr; }
.helm-quick-row { flex-wrap: wrap; }
.helm-quick-row .qa-btn { flex: 1 1 calc(50% - 4px); }
.two-col { grid-template-columns:1fr; }
.zone-strip { grid-template-columns:1fr 1fr; }
.blend-strip { flex-direction:column; }
.sched { grid-template-columns:1fr; }
.pillar-grid { grid-template-columns:1fr 1fr; }
.mobile-menu-btn { display:flex; }
.sidebar.mobile-open {
  display:flex; position:fixed; top:0; left:0; z-index:1000;
  height:100vh; width:220px; border-radius:0 12px 12px 0;
  box-shadow:4px 0 24px rgba(0,0,0,0.5);
  padding:16px 14px; align-items:stretch;
  transform:none; /* override centered translateY */
}
.sidebar.mobile-open .nav-item { width:auto; height:40px; justify-content:flex-start; padding:0 12px; gap:12px; }
.sidebar.mobile-open .nav-group-items .nav-item { width:auto; height:36px; padding:0 12px 0 28px; }
.sidebar.mobile-open .nav-group-items .nav-icon { width:var(--nav-icon-size); height:var(--nav-icon-size); }
.sidebar.mobile-open .nav-group-items .nav-icon svg { width:var(--nav-icon-size); height:var(--nav-icon-size); }
.sidebar.mobile-open .nav-group-items { display:flex; max-height:260px; opacity:1; }
.sidebar.mobile-open .docs-flyout { display:none !important; }
.sidebar.mobile-open .nav-item::after { display:none; }
.sidebar.mobile-open .nav-item::before { content:attr(data-tooltip); font-size:13px; font-weight:400; color:var(--sidebar-text-2); order:1; }
.sidebar.mobile-open .nav-item:hover::before { color:var(--sidebar-text-1); }
.sidebar.mobile-open .nav-item.active::before { color:var(--accent); }
.sidebar.mobile-open .sidebar-brand-mark { width:36px; height:36px; font-size:17px; }
.sidebar.mobile-open .nav-group-indicator { display:none; }
.roast-timer { font-size:48px; }
.roast-milestones { grid-template-columns:1fr 1fr 1fr; gap:8px; }
.ms-btn { min-height:80px; }
.roast-form-grid { grid-template-columns:1fr; }
.roast-summary { grid-template-columns:repeat(2,1fr); }
.hist-detail-grid { grid-template-columns:1fr 1fr; }
.roast-controls-row { flex-direction:column; }
.roast-graph-canvas { height:200px; }
.roast-milestones-compact { flex-direction:column; }
.adj-row { grid-template-columns:1fr; }
.sched-d { border-right:none; border-bottom:1px solid var(--border-1); }
.sched-d:last-child { border-bottom:none; }
}
@media(max-width:480px) {
.roast-timer { font-size:40px; }
.roast-milestones { grid-template-columns:1fr; }
.ms-btn { min-height:70px; }
.rf-profile-btns { gap:6px; }
.rf-profile-btn { padding:6px 12px; font-size:12px; }
.roast-graph-canvas { height:180px; }
.roast-timer-compact .roast-timer { font-size:36px; }
}
@media(max-width:400px) {
  .helm-quick-row .qa-btn { flex: 0 0 100%; }
  .qa-label { font-size: 9px; letter-spacing: 1px; }
}
/* ── Helm Grid Mobile ── */
@media (max-width: 768px) {
  .helm-body { grid-template-columns: 1fr; }
  .helm-quick-row { flex-wrap: wrap; }
  .helm-quick-row .qa-btn { flex: 0 1 calc(50% - 4px); }
  .rdl-modal-card { max-width: calc(100vw - 32px); margin: 16px; }
  .doc-cards { grid-template-columns: 1fr; }
  .sales-ref-visual { grid-template-columns: 1fr; }
  .helm-cal-panel .cal-day { min-height: 60px; }
  /* Tab bar mobile */
  .tab-bar { flex-wrap: wrap; gap: 0; }
  .tab-btn { padding: 8px 10px; font-size: 10px; }
  .tab-bar .add-trigger { flex-basis: 100%; margin-left: 0; margin-top: 8px; justify-content: center; }
  /* Metric row mobile */
  .metric { border-right: none; margin-right: 0; padding-right: 0; padding-bottom: 12px; border-bottom: 1px solid var(--border-1); margin-bottom: 0; flex: 0 0 50%; box-sizing: border-box; padding-right: 12px; }
  .metric:last-child { border-bottom: none; }
  .metric:nth-child(even) { padding-left: 12px; padding-right: 0; }
  .metric-val { font-size: 22px; }
  /* Font size floor */
  .rf-label, .metric-lbl, .hud-tla, .hud-ms-label, .hud-phase-detail, .hud-watermark, .hud-log-toggle, .n-table th { font-size: 10px; }
  /* Filter pills horizontal scroll */
  .filter-pills { flex-wrap: nowrap; overflow-x: auto; -webkit-overflow-scrolling: touch; padding-bottom: 4px; }
  .filter-pills::-webkit-scrollbar { display: none; }
  /* Responsive table columns */
  .col-sm { width: 60px; }
  .col-md { width: 75px; }
  .col-action { width: 80px; }
  .n-table th, .n-table td { padding: 10px 8px; font-size: 12px; }
  .line-items-table .col-sm { width: 60px; }
  .line-items-table .col-md { width: 75px; }
}
/* ── Analytics + Search + Toast Mobile ── */
@media (max-width: 768px) {
  #page-analytics .metric { flex: 0 0 50%; }
  #page-analytics .card canvas { max-width: 100%; height: auto !important; }
  .search-card { max-width: calc(100vw - 32px); margin: 0 16px; }
  .search-result-sub { display: none; }
  .toast { font-size: 12px; padding: 10px 14px; }
}
@media (max-width: 480px) {
  #page-analytics .metric { flex: 0 0 100%; }
  .search-overlay { padding-top: 60px; }
}
/* ── iPad Breakpoint ── */
@media (max-width:1024px) and (min-width:901px) {
  .helm-body { grid-template-columns: 1fr 1fr; gap: 20px; }
  .content { padding: 20px 20px 40px calc(var(--sidebar-w) + var(--sidebar-inset)*2 + 12px); }
  .pillar-grid { grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); }
  .sales-ref-visual { grid-template-columns: 1fr 1fr; }
  .two-col { grid-template-columns: 1fr 1fr; gap: 16px; }
  .metric-val { font-size: 22px; }
  .doc-cards { grid-template-columns: 1fr 1fr; }
}