/* Compact mode and touch adjustments. Loaded last so these rules win over component defaults. */
html { touch-action: manipulation; }
@media (pointer: coarse), (max-width: 640px) {
  :root { --titlebar-h: 38px; --taskbar-h: 40px; }
  .win .tbtn { zoom: 1.5; }
  .win .rz.e, .win .rz.w { width: 12px; } .win .rz.n, .win .rz.s { height: 12px; }
  .win .rz.se, .win .rz.sw, .win .rz.ne, .win .rz.nw { width: 20px; height: 20px; }
  .menu .mi { padding-top: 7px; padding-bottom: 7px; }
  .task { height: 32px; }
  #startbtn { height: 34px; }
  #startmenu { width: min(390px, 100vw); }
  #startmenu .sm { min-height: 40px; }
}

/* compact mode (phones): same desktop idea, fewer decorations, bigger targets */
@media (max-width: 640px) {
  .ex-side { display: none; }
  .menubar { flex-wrap: wrap; }
  .task { flex: 0 0 44px; justify-content: center; }
  .task span { display: none; }
  .pm-row { grid-template-columns: 1.4fr 1fr; } .pm-row > span:nth-child(n+3) { display: none; }
  .ol-tree { width: 120px; }
  .ol-row { grid-template-columns: 18px 20px 1fr 1fr; } .ol-row > span:nth-child(5) { display: none; }
  .fc-main { flex-direction: column; } .fc-nav { width: auto; max-height: 34%; border-right: 0; border-bottom: 1px solid var(--cobalt-300); }
  .tabs .tab { padding: 8px 10px 6px; }
  .btn { min-height: 32px; }
}