/* ng-mobile-meeting-voice.css — aggressive compaction for meeting + voice views on mobile (2026-09-06).
 *
 * The revamp CSS handles chat. This file compacts the two views the user named as
 * way too crowded on iPhone: the meeting panel and the voice overlay.
 *
 * MEETING: header 12px->8px, body 14px->8px, foot 11px->6px, title 12px->10px,
 * section headers 14px->11px, transcript lines 13px->11px, audio player 40px->32px,
 * the 24px stage padding -> 8px.
 *
 * VOICE: the orb was min(38vw,168px) — on a 393px phone that's 150px, a full 18% of
 * the width and 18% of an 852px height. Drop to min(28vw,110px). The PTT was
 * 108px — drop to 80px. Chip padding 12px->8px. Live transcript bubbles 15px->13px.
 */

/* ---------------------------------------------------------------------------
 * MEETING — the full-screen sheet's three zones (head/body/foot) and its contents
 * --------------------------------------------------------------------------- */
@media (max-width: 1024px) {
  .mtg-stage { padding: 8px; }

  .mtg-panel {
    border-radius: 14px;
    max-height: calc(100vh - 16px);
  }

  /* head: drop padding, keep one row tight */
  .mtg-head { padding: 6px 10px; gap: 8px; }
  .mtg-title { font-size: 10px; letter-spacing: .12em; }
  .mtg-timer { font-size: 11px; gap: 5px; }
  .mtg-timer .mtg-dot { width: 7px; height: 7px; }
  .mtg-x { min-height: 28px; min-width: 28px; padding: 3px 6px; font-size: 10px; }

  /* body: the transcript — reclaim the 12px from head+foot + 12px from body */
  .mtg-body { padding: 6px 10px; }
  .mtg-line { font-size: 11px; line-height: 1.45; gap: 6px; margin: 0 0 6px; }
  .mtg-line .spk { min-width: 48px; max-width: 72px; font-size: 9.5px; }
  .mtg-line .ts { font-size: 8.5px; }
  .mtg-sect { font-size: 10px; margin: 10px 0 4px; }
  .mtg-sect-sub { font-size: 9px; }
  .mtg-note { margin: 0 0 8px; padding: 6px 8px; font-size: 10px; line-height: 1.4; }
  .mtg-recblock { padding: 8px 6px 6px; margin-bottom: 8px; gap: 4px; }
  .mtg-pausecard { margin: 0 0 8px; padding: 8px 10px; }
  .mtg-pausecard-s { font-size: 11px; }
  .mtg-gap { margin: 4px 0 6px; }

  /* audio player */
  .mtg-player audio, .mtg-li-player audio { height: 32px; max-width: 100%; }

  /* foot: the action row — tighter padding, buttons keep their touch targets */
  .mtg-foot { padding: 6px 10px; gap: 6px; }
  .mtg-btn2 { min-height: 32px; padding: 6px 10px; font-size: 9px; }
  .mtg-btn2.mtg-big { min-height: 38px; padding: 8px 12px; font-size: 10px; }
  .mtg-hint { font-size: 9px; }
  .mtg-hint-block { margin: 8px 0 0; font-size: 10px; }
}

/* iPad / tablet landscape: the panel is wider but the same compaction applies */
@media (min-width: 721px) and (max-width: 1024px) {
  .mtg-line { font-size: 12px; }
  .mtg-title { font-size: 11px; }
}

/* ---------------------------------------------------------------------------
 * VOICE — the full-screen overlay (nvm-root) and its orb, chip, PTT, live transcript
 * --------------------------------------------------------------------------- */
@media (max-width: 1024px) {
  #nvm-top { padding: calc(6px + env(safe-area-inset-top)) max(10px, env(safe-area-inset-right)) 4px max(10px, env(safe-area-inset-left)); }
  #nvm-top button { min-height: 38px; min-width: 38px; }

  /* the orb: was min(38vw,168px) — drop to min(26vw,100px) */
  #nvm-bit { width: min(26vw, 100px); height: min(26vw, 100px); }

  /* the status chip: tighter padding, smaller text */
  #nvm-chip { padding: 8px 12px; font-size: 12px; max-width: 50vw; }
  #nvm-chip i { width: 10px; height: 10px; }

  /* the live transcript area */
  #nvm-live { max-width: 100%; gap: 6px; padding: 1vh 12px 0; }
  #nvm-prog .nvm-dots i { width: 5px; height: 5px; }

  /* speech bubbles */
  #nvm-user, #nvm-bot { font-size: 13px; line-height: 1.4; padding: 8px 10px; border-radius: 12px; }
  #nvm-user { border-radius: 12px 12px 4px 12px; }
  #nvm-bot { border-radius: 12px 12px 12px 4px; }

  /* the push-to-talk button: was 108px — drop to 76px */
  #nvm-ptt { width: 76px; height: 76px; }
  #nvm-ptt .nvm-mic-glyph { font-size: 24px; }

  /* the sheet (conversation history) */
  #nvm-sheet { max-height: 72vh; }
  #nvm-grab { padding: 6px 0 4px; }
  #nvm-grab::before { width: 36px; height: 3px; }
  .nvm-tabs { padding: 2px 10px 6px; gap: 6px; }
  .nvm-tabs button { min-height: 38px; font-size: 10px; padding: 6px 10px; }
  #nvm-sheet-body { padding: 0 10px 10px; }
  .nvm-msg { margin: 0 0 6px; }
  .nvm-msg-meta { font-size: 8.5px; }
  .nvm-msg-text { font-size: 12px; padding: 6px 10px; }
  .nvm-sec { font-size: 8.5px; padding: 6px 2px 4px; }
  .nvm-conv-row { padding: 6px 8px; min-height: 44px; margin: 0 0 6px; }
  .nvm-conv-row .nvm-cmeta { font-size: 9px; }
}

/* phones: the orb and PTT shrink a touch more */
@media (max-width: 480px) {
  #nvm-bit { width: min(22vw, 80px); height: min(22vw, 80px); }
  #nvm-ptt { width: 68px; height: 68px; }
  #nvm-ptt .nvm-mic-glyph { font-size: 20px; }
  #nvm-chip { font-size: 11px; max-width: 44vw; }
  #nvm-user, #nvm-bot { font-size: 12px; }
}