/* Portal V2 mobile contract.
   Fingerprint: portal-v2-mobile-hydration-responsive-contract-v1.
   Loaded after shell/theme CSS. Critical phone geometry is deliberately
   protected with narrow-scope !important rules because several legacy/V2
   modules still mount or restyle shared controls asynchronously. */

@media (max-width:760px){
  html,body{max-width:100%;overflow-x:hidden}
  body{padding-bottom:calc(88px + env(safe-area-inset-bottom))}
  .main{width:100%;max-width:100%;padding:18px 16px 28px}

  .topbar{display:grid!important;grid-template-columns:1fr!important;gap:8px!important;margin:0 0 14px!important}
  .welcome{min-width:0}
  .welcome h1{font-size:clamp(28px,8vw,34px);line-height:1.04;letter-spacing:-.045em;overflow-wrap:anywhere}
  .welcome p{font-size:15px;line-height:1.4;margin-top:8px}
  .topactions{display:grid!important;width:100%!important;gap:8px!important;justify-items:stretch!important;min-width:0!important}
  .topactions .searchrow{display:grid!important;grid-template-columns:minmax(0,1fr) repeat(3,44px)!important;gap:8px!important;width:100%!important;min-width:0!important;align-items:center!important;flex-wrap:nowrap!important}
  .topactions .searchrow .search{width:100%!important;min-width:0!important;height:44px!important;font-size:14px;padding-inline:12px}
  .topactions .searchrow>.smallbtn{width:44px!important;min-width:44px!important;height:44px!important;min-height:44px!important;padding:0!important;display:grid!important;place-items:center!important}
  .topactions .actionrow{display:grid!important;grid-template-columns:minmax(0,1fr) auto!important;gap:8px!important;width:100%!important;min-width:0!important;align-items:stretch!important;flex-wrap:nowrap!important}
  .topactions .actionrow>.smallbtn{height:44px!important;min-height:44px!important;min-width:0!important;padding-inline:12px!important;white-space:nowrap}
  .topactions .actionrow>.smallbtn.ai{width:100%!important;overflow:hidden;text-overflow:ellipsis}

  /* Root cause guard: desktop/global utilities are mounted asynchronously.
     They must never expand the mobile header into a vertical wall of buttons. */
  .v2utilities{display:none!important}
  .v2globalstatus{display:none!important}

  .kpis{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px!important;margin:0 0 14px!important;padding:0!important;overflow:visible!important;scroll-snap-type:none!important}
  .kpi{min-width:0!important;padding:14px!important;border-radius:18px}
  .kpihead{font-size:12px;line-height:1.25;align-items:flex-start}
  .kpi .num{font-size:clamp(32px,10vw,44px);line-height:1;margin-top:12px}
  .kpi .num small{font-size:.48em}
  .delta{font-size:11px;line-height:1.3}

  .braincard{padding:16px;border-radius:20px}
  .brainhead h2{font-size:clamp(24px,7vw,30px);line-height:1.05}
  .brainhead p{font-size:14px;line-height:1.35}
  .brainflow{grid-template-columns:1fr!important;gap:10px}
  .brainnode{min-width:0;min-height:92px;padding:14px;grid-template-columns:48px minmax(0,1fr);gap:12px}
  .brainnode .nodeicon{width:44px;height:44px}
  .brainnode strong{font-size:14px}
  .brainnode small{font-size:12px;line-height:1.35;overflow-wrap:anywhere}
  .brainselectors,.right,.lower,.activities .items{grid-template-columns:1fr!important}
  .modules{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .quick{grid-template-columns:repeat(4,minmax(0,1fr))!important}
  .dv{padding:14px!important}
  .dv-lijst{grid-template-columns:1fr!important}

  .previewflag{display:none!important}
  .mobilebar{display:grid!important;position:fixed!important;left:0!important;right:0!important;bottom:0!important;z-index:85;grid-template-columns:repeat(5,minmax(0,1fr))!important;padding:8px 8px calc(8px + env(safe-area-inset-bottom))!important;background:rgba(255,255,255,.97);border-top:1px solid #e3e8f2;box-shadow:0 -8px 28px rgba(20,34,70,.08);backdrop-filter:blur(18px)}
  .mobilebar button{min-width:0!important;min-height:52px!important;padding:6px 2px!important;border:0;background:transparent;font-size:11px;line-height:1.15;white-space:nowrap}

  .allpages{padding:0;align-items:end}
  .allpages .sheet{width:100%;max-width:none;max-height:calc(100dvh - 72px);border-radius:22px 22px 0 0;padding:16px 14px calc(24px + env(safe-area-inset-bottom))}
  .groups{grid-template-columns:1fr!important}
}

@media (max-width:430px){
  .main{padding-inline:12px}
  .topactions .searchrow{gap:6px!important}
  .topactions .actionrow{grid-template-columns:1fr!important}
  .topactions .actionrow>.smallbtn{width:100%!important}
  .kpi{padding:12px!important}
  .kpihead{gap:6px;font-size:11px}
  .kpiicon{width:30px;height:30px;flex:0 0 30px}
  .kpi .num{font-size:38px}
  .quick{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .mobilebar{padding-inline:4px!important}
  .mobilebar button{font-size:10px}
}

@media (max-width:350px){
  .kpis{grid-template-columns:1fr!important}
  .topactions .searchrow{grid-template-columns:minmax(0,1fr) repeat(3,40px)!important}
  .topactions .searchrow>.smallbtn{width:40px!important;min-width:40px!important}
}