/* Shared phone shell. Desktop keeps the full workspace; phones use app bars
   and bottom tabs with room for iOS and Android gesture areas. */
.app-tabbar,.app-wordmark { display:none; }
@media screen and (max-width:850px) {
  body.c-body,body.cool-admin-body { background:#f4f7f5; -webkit-tap-highlight-color:transparent; }
  .c-shell,.cool-admin-shell { min-height:100dvh; }
  .c-main,.cool-admin-main { padding-bottom:calc(88px + env(safe-area-inset-bottom,0px)); }
  .c-topbar,.cool-admin-topbar {
    position:sticky; top:0; z-index:20; min-height:76px;
    padding:calc(10px + env(safe-area-inset-top,0px)) max(16px,env(safe-area-inset-right,0px)) 10px max(16px,env(safe-area-inset-left,0px));
    background:#fff; border-bottom:1px solid #e5ece7; gap:10px;
  }
  .app-wordmark { display:flex; align-items:center; gap:7px; color:#17251c; font:700 15px/1.3 ui-sans-serif,system-ui,sans-serif; letter-spacing:-.4px; white-space:nowrap; }
  .app-wordmark img { display:block; width:24px; height:24px; flex:none; }
  .app-header-copy { min-width:0; }
  .c-topbar-title,.cool-admin-topbar h1 { margin:3px 0 0; color:#6b7c71; font:500 11px/1.3 ui-sans-serif,system-ui,sans-serif; letter-spacing:0; }
  .cool-admin-topbar .cool-admin-eyebrow { display:none; }
  .topbar-leading,.c-topbar-start { gap:10px; }
  .c-menu-btn,.mobile-menu { width:40px; min-width:40px; height:44px; border:0; background:#f1f6f3; border-radius:13px; color:#356245; }
  .c-topbar-end > .c-icon-btn { display:none; }
  .c-profile-btn { padding:4px; border:0; background:none; }
  .c-profile-btn > svg,.c-profile-name { display:none; }
  .c-avatar { width:38px; height:38px; border-radius:14px; }
  .c-profile-menu { right:0; max-width:calc(100vw - 32px); }
  .topbar-actions .button.secondary { font-size:11px; border-radius:12px; padding:8px 10px; }
  .c-content,.cool-admin-content { padding:20px max(16px,env(safe-area-inset-right,0px)) 16px max(16px,env(safe-area-inset-left,0px)); }
  .c-footer,.admin-footer { display:none; }
  .app-tabbar {
    position:fixed; bottom:0; left:0; right:0; z-index:25; display:grid; grid-template-columns:repeat(5,minmax(0,1fr));
    padding:8px max(8px,env(safe-area-inset-right,0px)) calc(8px + env(safe-area-inset-bottom,0px)) max(8px,env(safe-area-inset-left,0px));
    border-top:1px solid #e2ebe5; background:#fff; box-shadow:0 -5px 24px #1c493008;
  }
  .app-tab { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:4px; min-width:0; min-height:54px; padding:6px 2px; border:0; border-radius:16px; background:transparent; color:#78867d; font:500 10px/1.3 ui-sans-serif,system-ui,sans-serif; text-decoration:none; cursor:pointer; }
  .app-tab svg { display:block; width:22px; height:22px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
  .app-tab[aria-current],.app-tab.is-current,.app-tab[aria-expanded="true"] { color:#15803d; background:#e8f7ed; font-weight:700; }
  .app-tab:active { background:#ddf3e4; }
  .app-tab:focus-visible { outline:2px solid #16a34a; outline-offset:-2px; }
  .c-sidebar,.cool-admin-sidebar { border-radius:0 24px 24px 0; padding-bottom:calc(24px + env(safe-area-inset-bottom,0px)); }
  .c-card,.panel { border:1px solid #e5ece7; border-radius:20px; background:#fff; box-shadow:0 3px 12px #17402b03; }
  .c-grid,.dashboard-grid,.insights-grid { gap:16px; }
  .c-card-head h3,.panel h3 { font-size:16px; }
  .c-card-head p,.panel p.cool-muted { font-size:12px; line-height:1.5; }
  .c-ph { margin:0 0 20px; }
  .c-ph-cover,.c-ph-emoji,.c-ph-props { display:none; }
  .c-ph-body { padding:0; }
  .c-ph-row { margin:0; gap:16px; }
  .c-ph-copy { flex-basis:100%; }
  .c-ph-date { font-size:12px; color:#6b7c71; }
  .c-ph-title { margin:7px 0 8px; font-size:30px; line-height:1.15; }
  .c-ph-lead { font-size:13px; line-height:1.5; max-width:36ch; }
  .c-ph-actions { margin-top:16px; gap:10px; }
  .c-btn,.c-btn.small { min-height:46px; border-radius:14px; font-size:13px; box-shadow:none; }
  .c-ph-actions > .c-btn { flex:1; }
  .c-ph-setup { display:grid; grid-template-columns:1fr auto; width:100%; gap:8px 12px; padding:16px; border:1px solid #cfe9d7; border-radius:18px; background:#eaf7ee; }
  .c-ph-setup > strong { font-size:22px; grid-column:2; grid-row:1 / span 2; align-self:center; }
  .c-ph-setup .c-progress { grid-column:1; margin:0; }
  .c-ph-setup-note { grid-column:1; }
  .c-ph-setup .c-link { grid-column:1 / -1; padding-top:4px; }
  .c-stats,.stats-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
  .c-stat,.stat-card { min-width:0; padding:16px; border:1px solid #e5ece7; border-radius:18px; box-shadow:none; background:#fff; }
  .c-stat-value,.stat-value { font-size:26px; line-height:1.2; overflow-wrap:anywhere; }
  .c-stat-icon { width:34px; height:34px; border-radius:12px; margin-bottom:10px; }
  .c-stat-label,.stat-label { font-size:12px; }
  .c-stat-note,.stat-note { font-size:11px; line-height:1.4; }
  .c-quick { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; }
  .c-quick-item { flex-direction:column; justify-content:flex-start; gap:8px; padding:12px 4px; font-size:11px; line-height:1.4; text-align:center; border-radius:16px; background:#f5f8f6; }
  .c-quick-item::after { display:none; }
  .c-quick-icon { width:42px; height:42px; border:0; border-radius:14px; background:#e8f7ed; box-shadow:none; }
  .c-empty.small { padding:20px 8px; }
  .dashboard-heading { margin-bottom:20px; }
  .dashboard-heading h2 { font-size:28px; }
  .dashboard-heading p { font-size:13px; max-width:none; }
  .dashboard-kicker { font-size:9px; letter-spacing:1px; }
  .dashboard-date { display:none; }
  .dashboard-banner { min-height:0; border-radius:20px; margin-bottom:22px; }
  .banner-copy { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:center; gap:12px; width:100%; padding:20px; }
  .banner-copy h3 { font-size:20px; margin:0; }
  .banner-copy p { display:none; }
  .banner-eyebrow,.banner-art { display:none; }
  .banner-link { margin-top:0; min-height:44px; font-size:12px; border-radius:12px; gap:8px; white-space:nowrap; }
  .metrics-heading h3 { font-size:15px; }
  .stat-icon { border-radius:10px; width:28px; height:28px; }
  .quick-link { min-height:64px; }
  .quick-icon { width:40px; height:40px; border-radius:13px; }
  .cool-admin-table-wrap,.c-table-wrap { -webkit-overflow-scrolling:touch; }
  #account { scroll-margin-top:100px; }
  /* Sign-in becomes a branded mobile welcome screen with a raised form sheet. */
  .nx-layout { background:#edf8f0; min-height:100dvh; }
  .nx-form-col { background:transparent; padding:calc(12px + env(safe-area-inset-top,0px)) 20px max(24px,env(safe-area-inset-bottom,0px)); }
  .nx-topbar { min-height:52px; align-items:center; }
  .nx-brand-mark { width:38px; height:38px; border-radius:13px; background:#fff; }
  .nx-brand-mark img { width:30px; height:30px; }
  .nx-brand-name { font-size:16px; }
  .nx-top-link { font-size:12px; }
  .nx-top-muted { display:none; }
  .nx-form-wrap { max-width:460px; margin:24px auto; padding:28px 22px; background:#fff; border:1px solid #e3eee6; border-radius:28px; box-shadow:0 12px 40px #17402b08; }
  .nx-page-icon { display:none; }
  .nx-title { font-size:32px; line-height:1.1; }
  .nx-title-soft { font-size:25px; line-height:1.2; margin-top:8px; }
  .nx-lead { font-size:13px; line-height:1.5; margin-bottom:24px; }
  .nx-input input { min-height:52px; border-radius:14px; background:#f8faf9; font-size:16px; }
  .nx-social-btn { min-height:48px; border-radius:14px; font-size:13px; }
  .nx-submit { min-height:52px; border-radius:16px; font-size:15px; }
  .nx-eye { width:44px; height:44px; }
  .nx-check { font-size:12px; line-height:1.5; }
  .nx-footer { padding:0 8px 8px; font-size:11px; }
}
@media screen and (max-width:359px) {
  .app-wordmark { font-size:13px; gap:4px; }
  .app-wordmark img { width:20px; height:20px; }
  .c-topbar,.cool-admin-topbar { padding-left:12px; padding-right:12px; }
  .c-stat,.stat-card { padding:12px; }
  .stat-value,.c-stat-value { font-size:22px; }
  .nx-form-col { padding-left:12px; padding-right:12px; }
  .nx-form-wrap { padding:24px 18px; }
  .nx-topbar { gap:6px; }
  .nx-brand-name { font-size:14px; }
}
@media print { .app-tabbar,.app-wordmark { display:none!important; } }