/* ==================== Tablet ==================== */
@media (max-width: 1024px) {
  .os-window--wide { width: 90vw !important; }
  .split-list { width: 200px; }
}

/* ==================== Mobile ==================== */
@media (max-width: 768px) {
  :root {
    --taskbar-h: 44px;
  }

  /* Desktop icons as grid */
  .desktop-icons {
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
    padding: 20px 12px;
    gap: 6px;
  }

  .desktop-icon { width: 64px; }
  .dicon-img { width: 32px; height: 32px; font-size: 20px; }
  .dicon-label { font-size: 11px; }

  /* Windows become fullscreen */
  .os-window {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: var(--taskbar-h) !important;
    width: auto !important;
    height: auto !important;
    transform: none !important;
    border-width: 0;
    box-shadow: none;
    z-index: 30 !important;
  }

  .os-window[hidden] { display: none !important; }
  .os-window.win-minimized {
    transform: none !important;
    display: none !important;
  }

  /* No drag on mobile */
  .window-titlebar { cursor: default; }

  /* Split view → stack */
  .window-body--split {
    flex-direction: column;
  }

  .split-list {
    width: 100%;
    max-height: 180px;
    border-right: none;
    border-bottom: 2px solid var(--win-lolo);
  }

  .split-preview {
    margin-left: 0;
    margin-top: -2px;
  }

  /* Taskbar */
  .taskbar {
    padding: 2px 6px;
    gap: 4px;
  }

  .taskbar-tabs { display: none; }

  .taskbar-tray {
    gap: 6px;
    font-size: 11px;
    overflow: hidden;
  }

  .taskbar-tray .tray-item:not(.tray-status) { display: none; }

  /* Start menu wider */
  .start-menu {
    width: calc(100vw - 8px);
    max-width: 280px;
  }

  /* Welcome dialog adjustments */
  .welcome-footer { flex-direction: column; gap: 8px; }
  .welcome-title { font-size: 18px; }

  /* Gallery grid 2 cols */
  .gallery-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  /* Stat grid 1 col */
  .stat-grid { grid-template-columns: 1fr; }

  /* Chat compose */
  .chat-fields { flex-direction: column; }
}

/* ==================== Small phone ==================== */
@media (max-width: 480px) {
  .welcome-title { font-size: 16px; }
  .gallery-grid { grid-template-columns: 1fr 1fr; gap: 4px; }
  .desktop-icon { width: 56px; }
  .dicon-img { width: 28px; height: 28px; font-size: 18px; }
}