@media (max-width: 768px) {
  .header { padding: 12px 16px; }
  .header h1 { font-size: 18px; }
  .header .tagline { display: none; }
  .header .progress-bar { width: 100px; }
  .header .progress-label { right: -42px; font-size: 10px; }

  .desk {
    padding-top: 60px;
    min-height: 1900px;
  }

  .zone {
    width: calc(100vw - 32px);
    max-width: 360px;
    left: 50% !important;
    transform: translateX(-50%);
  }

  .keyboard-hint { display: none; }
}

/* embed 모드 */
body.embed-mode .header,
body.embed-mode .footer { display: none; }
body.embed-mode .desk { padding-top: 16px; min-height: 720px; }
body.embed-mode .open-fullscreen-btn {
  display: inline-flex !important;
  position: fixed;
  bottom: 16px; right: 16px;
  background: var(--color-orange);
  color: var(--color-dark);
  padding: 8px 14px;
  border-radius: 20px;
  font-size: 13px;
  font-weight: 700;
  box-shadow: var(--shadow-warm);
  z-index: 60;
}

/* lite-mode */
body.lite-mode .object { filter: drop-shadow(0 4px 8px rgba(0,0,0,0.15)) !important; }
body.lite-mode .object:hover { transform: none !important; }
body.lite-mode .bug { transition: transform 0.05s linear !important; }