/* Phone layout (<= 600 px) for the shell, forms, lists and dialogs. */
@media(max-width:600px){
  /* kopbalk op één rij: logo's kleiner, thema = één knop (de andere stand), uitloggen = icoon */
  .top{padding:0 10px;gap:6px;min-height:54px}
  .top .brand{gap:6px;flex:1;min-width:0;overflow:hidden}
  .top .brand img{flex:none}
  .top .who,.top .ptag,.top .viewtog,.top .bx,.top .sp{display:none}
  .foot b{font-size:9px;letter-spacing:.14em}
  .top .lg-as{height:16px;margin-bottom:0}.top .lg-bl{height:16px;margin-bottom:1px}.top .lg-si{height:19px;margin-bottom:2px}.top .bar{height:18px}
  .subtabs{mask-image:linear-gradient(90deg,#000 calc(100% - 36px),transparent);-webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 36px),transparent);padding-right:36px}
  .subtabs.end{mask-image:none;-webkit-mask-image:none}
  .top .thema{padding:0;background:transparent}.top .thema button{width:34px;height:34px;border:1px solid rgba(255,255,255,.22);border-radius:50%}
  .top .thema button[aria-pressed=true]{display:none}
  .top .help{width:34px;height:34px}
  .top a.out{width:34px;height:34px;padding:0;border-radius:50%;display:grid;place-items:center;font-size:0}
  .top a.out svg{display:block}
  .hero{padding:22px 16px 20px}.hero h1{font-size:24px;margin-bottom:2px}
  .hero .in{gap:18px}
  .kpis{width:100%}.kpi{padding:0 14px;flex:1}.kpi .n{font-size:21px}.kpi .l{font-size:9.5px;letter-spacing:.08em}
  .wrap{padding-left:16px;padding-right:16px}
  .card{padding:18px 16px}
  .plhead-top{flex-wrap:wrap}
  .plactions{width:100%;justify-content:flex-start;margin-top:4px}
  .plbar{flex-direction:column;align-items:stretch;gap:10px;min-width:0}
  .plfilters{overflow-x:auto;flex-wrap:nowrap;-webkit-overflow-scrolling:touch;scrollbar-width:none;padding-bottom:2px;min-width:0}
  .plfilters::-webkit-scrollbar{display:none}
  .plf{flex-shrink:0}
  .oppbar{flex-wrap:wrap;gap:8px}
  .modal{padding:0;align-items:stretch}
  .modal-card{padding:22px 18px;width:100%;max-height:none;border-radius:0;border:0;min-height:100%}
  .modal-actions{flex-wrap:wrap}.modal-actions .btn,.modal-actions .lnk{flex:1 1 auto;text-align:center}
  .modal-actions .sp{display:none}
  .ldsum{font-size:14px}
  .pgrid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .pcard .pn{font-size:12.5px;padding:11px 10px 0;letter-spacing:-.01em}.pcard .ps{padding:0 10px 12px}.pcard .pds{padding:0 10px 12px}.pcard img,.pcard .ph{height:104px}
  .foot{padding:9px 14px}.foot span{display:none}
}
