/* Legal Works | Nexo mobile compact overlay v407
   Scope: mobile presentation only. Desktop and guide engine unchanged.
*/

@media (max-width: 700px) {
  /*
   * Leave a permanent visual corridor on the left for the application
   * navigation and keep the guide as a compact lower-right card.
   */
  html body .lw-nexo-root.is-open .lw-nexo-stage {
    position: fixed !important;
    inset:
      auto
      6px
      calc(
        env(safe-area-inset-bottom, 0px) +
        6px
      )
      70px !important;
    width: auto !important;
    max-width: 330px !important;
    height: auto !important;
    max-height: none !important;
    margin: 0 !important;
    transform: none !important;
    overflow: visible !important;
    pointer-events: none !important;
  }

  html body .lw-nexo-root.is-open .lw-nexo-dialog {
    position: relative !important;
    inset: auto !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: min(34dvh, 300px) !important;
    margin: 0 !important;
    padding: 9px 10px 8px !important;
    border-radius: 15px !important;
    box-sizing: border-box !important;
    display: flex !important;
    flex-direction: column !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    overscroll-behavior: contain !important;
    transform: none !important;
    pointer-events: auto !important;
  }

  /*
   * The full body avatar stays hidden so the highlighted application
   * element remains visible. Nexo remains present through the compact
   * floating face button positioned above the guide.
   */
  html body .lw-nexo-root.is-open
  .lw-nexo-avatar-shell,
  html body .lw-nexo-root.is-open
  .lw-nexo-gesture-frame,
  html body .lw-nexo-root.is-open
  .lw-nexo-professional-composite,
  html body .lw-nexo-root.is-open
  .lw-nexo-rive-canvas,
  html body .lw-nexo-root.is-open
  .lw-nexo-avatar,
  html body .lw-nexo-root.is-open
  .lw-nexo-vector-avatar {
    display: none !important;
  }

  html body .lw-nexo-help {
    position: fixed !important;
    top: auto !important;
    left: auto !important;
    right: 8px !important;
    bottom:
      calc(
        34dvh +
        env(safe-area-inset-bottom, 0px) +
        16px
      ) !important;
    z-index: 2147483646 !important;
    width: 48px !important;
    min-width: 48px !important;
    max-width: 48px !important;
    height: 48px !important;
    min-height: 48px !important;
    max-height: 48px !important;
    margin: 0 !important;
    padding: 4px !important;
    border-radius: 50% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    overflow: hidden !important;
    pointer-events: auto !important;
  }

  html body .lw-nexo-help > span,
  html body .lw-nexo-help > b,
  html body .lw-nexo-help-text {
    display: none !important;
  }

  html body .lw-nexo-help-face {
    width: 38px !important;
    min-width: 38px !important;
    height: 38px !important;
    min-height: 38px !important;
    margin: 0 !important;
    transform: none !important;
  }

  html body .lw-nexo-root.is-open .lw-nexo-topline {
    position: sticky !important;
    top: 0 !important;
    z-index: 4 !important;
    min-height: 28px !important;
    margin: 0 0 3px !important;
    padding: 0 !important;
  }

  html body .lw-nexo-root.is-open .lw-nexo-step {
    font-size: 9px !important;
    line-height: 1.15 !important;
    letter-spacing: .035em !important;
  }

  html body .lw-nexo-root.is-open .lw-nexo-close {
    width: 34px !important;
    min-width: 34px !important;
    height: 34px !important;
    min-height: 34px !important;
    margin: 0 !important;
  }

  html body .lw-nexo-root.is-open .lw-nexo-title {
    margin: 0 0 3px !important;
    font-size: 15px !important;
    line-height: 1.18 !important;
  }

  html body .lw-nexo-root.is-open .lw-nexo-copy {
    margin: 0 0 4px !important;
    padding: 0 !important;
    max-height: 8.5dvh !important;
    overflow-y: auto !important;
    font-size: 11px !important;
    line-height: 1.32 !important;
  }

  /*
   * Secondary hints are omitted on mobile while a universal guide is
   * running. The actual instruction and highlighted target remain.
   */
  html[data-lw-nexo-universal-guide]
  body .lw-nexo-root.is-open .lw-nexo-hint,
  html body .lw-nexo-root.is-open
  .lw-nexo-universal-running .lw-nexo-hint {
    display: none !important;
  }

  html body .lw-nexo-root.is-open .lw-nexo-hint {
    margin: 2px 0 !important;
    padding: 4px 6px !important;
    font-size: 9px !important;
    line-height: 1.2 !important;
  }

  /*
   * Once the guide starts, the intent input is no longer needed. Hiding
   * it recovers space without altering interpretation or guide logic.
   */
  html body .lw-nexo-root.is-open
  .lw-nexo-intent.is-guide-running {
    display: none !important;
  }

  html body .lw-nexo-root.is-open .lw-nexo-intent {
    margin: 3px 0 4px !important;
    padding: 5px !important;
  }

  html body .lw-nexo-root.is-open .lw-nexo-intent label {
    margin-bottom: 2px !important;
    font-size: 9px !important;
  }

  html body .lw-nexo-root.is-open .lw-nexo-intent > div {
    grid-template-columns:
      minmax(0, 1fr) auto !important;
    gap: 4px !important;
  }

  html body .lw-nexo-root.is-open .lw-nexo-intent input {
    width: 100% !important;
    min-width: 0 !important;
    height: 32px !important;
    padding: 0 7px !important;
    font-size: 11px !important;
  }

  html body .lw-nexo-root.is-open .lw-nexo-intent button {
    min-width: 62px !important;
    height: 32px !important;
    padding: 0 7px !important;
    font-size: 10px !important;
  }

  html body .lw-nexo-root.is-open .lw-nexo-intent p {
    min-height: 0 !important;
    margin: 3px 0 0 !important;
    font-size: 8px !important;
    line-height: 1.15 !important;
  }

  html body .lw-nexo-root.is-open .lw-nexo-progress-track {
    flex: 0 0 auto !important;
    height: 3px !important;
    margin: 3px 0 5px !important;
  }

  html body .lw-nexo-root.is-open .lw-nexo-actions {
    position: sticky !important;
    bottom: -1px !important;
    z-index: 4 !important;
    flex: 0 0 auto !important;
    display: grid !important;
    grid-template-columns:
      minmax(58px, .8fr)
      minmax(64px, .95fr)
      minmax(78px, 1.2fr) !important;
    gap: 4px !important;
    margin: 2px 0 0 !important;
    padding: 3px 0 0 !important;
  }

  html body .lw-nexo-root.is-open .lw-nexo-button {
    width: 100% !important;
    min-width: 0 !important;
    min-height: 40px !important;
    height: auto !important;
    padding: 5px 5px !important;
    border-radius: 9px !important;
    font-size: 10px !important;
    line-height: 1.1 !important;
    white-space: normal !important;
  }

  html body .lw-nexo-root.is-open .lw-nexo-guide-line {
    display: none !important;
  }

  html body .lw-nexo-toast {
    left: 70px !important;
    right: 6px !important;
    bottom:
      calc(
        env(safe-area-inset-bottom, 0px) +
        6px
      ) !important;
    width: auto !important;
    max-width: 330px !important;
    padding: 7px 9px !important;
    font-size: 10px !important;
    line-height: 1.25 !important;
  }

  .lw-nexo-v406-target {
    scroll-margin:
      78px 10px 190px !important;
  }
}

@media (max-width: 380px) {
  html body .lw-nexo-root.is-open .lw-nexo-stage {
    left: 56px !important;
    right: 5px !important;
    bottom:
      calc(
        env(safe-area-inset-bottom, 0px) +
        5px
      ) !important;
  }

  html body .lw-nexo-root.is-open .lw-nexo-dialog {
    max-height: min(32dvh, 250px) !important;
    padding: 8px 8px 7px !important;
    border-radius: 13px !important;
  }

  html body .lw-nexo-help {
    right: 6px !important;
    bottom:
      calc(
        32dvh +
        env(safe-area-inset-bottom, 0px) +
        13px
      ) !important;
    width: 44px !important;
    min-width: 44px !important;
    height: 44px !important;
    min-height: 44px !important;
  }

  html body .lw-nexo-help-face {
    width: 34px !important;
    min-width: 34px !important;
    height: 34px !important;
    min-height: 34px !important;
  }

  html body .lw-nexo-root.is-open .lw-nexo-title {
    font-size: 14px !important;
  }

  html body .lw-nexo-root.is-open .lw-nexo-copy {
    max-height: 7dvh !important;
    font-size: 10px !important;
  }

  html body .lw-nexo-root.is-open .lw-nexo-actions {
    grid-template-columns:
      1fr 1fr !important;
  }

  html body .lw-nexo-root.is-open
  .lw-nexo-button.is-primary {
    grid-column: 1 / -1 !important;
  }

  html body .lw-nexo-toast {
    left: 56px !important;
    right: 5px !important;
  }
}

@media (max-width: 700px) and (max-height: 620px) {
  html body .lw-nexo-root.is-open .lw-nexo-dialog {
    max-height: min(30dvh, 190px) !important;
  }

  html body .lw-nexo-help {
    bottom:
      calc(
        30dvh +
        env(safe-area-inset-bottom, 0px) +
        12px
      ) !important;
  }

  html body .lw-nexo-root.is-open .lw-nexo-copy {
    max-height: 5.5dvh !important;
  }
}