/* ---------- phone width ---------- */
@media (max-width: 699px) {
  #icons { height: auto; grid-auto-flow: row; grid-template-rows: none; grid-template-columns: repeat(auto-fill, minmax(76px, 1fr)); grid-auto-rows: 88px; }
  .icon { width: 100%; }
  .task { flex-basis: 40px; }
  .task span { display: none; }
  #startbtn { padding-right: 14px; }
  .explorer, .help-main { flex-direction: column; }
  .taskpane { width: auto; max-height: 40%; order: 2; }
  .help-nav { width: auto; flex-direction: row; flex-wrap: wrap; }
  #welcome { grid-template-rows: 44px minmax(0, 1fr) auto; }
  .wel-mid { flex-direction: column; justify-content: flex-start; gap: 18px; }
  .wel-left { flex: none; align-items: center; text-align: center; max-width: none; }
  .wel-div { display: none; }
  .wel-right { flex: none; width: 100%; max-width: 340px; }
  .wel-pass { margin-left: 0; }
  .wel-bot { flex-direction: column; padding-block: 12px; }
  .wel-bot p { text-align: center; }
  .word { font-size: 36px; }
}
@media (max-width: 440px) {
  .sm-cols { grid-template-columns: minmax(0, 1fr); }
  .sm-right { border-left: 0; border-top: 1px solid var(--menu-line); }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition: none !important; }
  .retro-marq span, .amp-marq span { padding-left: 0; }
}