@media (max-width: 720px) {
  .mobile-quick button:first-child {
    position: sticky;
    left: 0;
    z-index: 4;
    flex-shrink: 0;
    background: #0b2233;
    border-color: #34779a;
    box-shadow: 8px 0 14px #07111e;
  }
  .mobile-task-row.idle .state-lamp {
    border: 0;
    background: var(--amber);
    box-shadow: 0 0 11px #ffc46b99;
    animation: idle-lamp-breathe 2.2s ease-in-out infinite;
  }
  :root { --mobile-header: calc(50px + env(safe-area-inset-top)); }

  html,
  body {
    width: 100%;
    height: var(--app-height, 100dvh);
    min-height: 0;
    overflow: hidden;
    overscroll-behavior: none;
  }

  body {
    position: fixed;
    inset: 0;
    display: block;
    overflow: hidden;
  }

  header {
    position: fixed;
    inset: 0 0 auto;
    width: 100%;
    height: var(--mobile-header);
    min-height: 0;
    overflow: visible;
  }

  header .status-cell {
    min-height: 50px;
    padding-top: 4px;
    padding-bottom: 4px;
  }

  main {
    position: fixed;
    inset: var(--mobile-header) 0 0;
    width: 100%;
    height: auto;
    min-height: 0;
    padding: 0;
    overflow: hidden;
  }

  .mobile-terminal {
    height: 100%;
    min-height: 0;
    grid-template-rows: 61px minmax(0, 1fr) 238px !important;
    overflow: hidden;
  }

  .mobile-quick {
    scroll-snap-type: x mandatory;
    scroll-padding-inline: 12px;
  }

  .mobile-quick button {
    flex: 0 0 calc((100% - 24px) / 4);
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    scroll-snap-align: start;
    scroll-snap-stop: always;
  }

  .mobile-quick,
  .mobile-focus,
  .mobile-task-list {
    min-width: 0;
    -webkit-overflow-scrolling: touch;
  }

  body,
  button,
  input,
  select,
  .mobile-terminal,
  .mobile-terminal * {
    font-family: -apple-system, BlinkMacSystemFont, "SF Pro Text", "PingFang SC", sans-serif !important;
  }

  .terminal-card .task-name { font-size: 15px; line-height: 1.3; }
  .terminal-card .result { font-size: 12px; line-height: 1.55; }
  .terminal-card .task-channel,
  .terminal-card time,
  .terminal-card .status { font-size: 9px; letter-spacing: 0; }
  .mobile-task-row b { font-size: 11px; }
  .mobile-task-row small { font-size: 9px; }

  .mobile-focus {
    height: 100%;
    overflow-x: hidden;
    overflow-y: auto;
    scroll-padding-bottom: 76px;
    overscroll-behavior-y: contain;
    touch-action: pan-y;
  }

  .terminal-card {
    display: flex;
    flex-direction: column;
    width: 100%;
    height: 100%;
    min-height: 0;
    overflow-y: auto;
    scroll-padding-bottom: 76px;
    padding-bottom: 4px;
  }

  .terminal-card .follow {
    position: sticky;
    bottom: 0;
    z-index: 3;
    flex: 0 0 auto;
    margin-top: auto;
    padding: 10px 0 8px;
    background: linear-gradient(180deg, transparent, #081725 22%);
  }

  .terminal-card .approval,
  .terminal-card .result,
  .terminal-card .send-feedback { scroll-margin-bottom: 76px; }
  .terminal-card .approval-actions { position:relative;z-index:1;padding-bottom:2px; }

  .terminal-card .follow input {
    min-height: 44px;
    font-size: 16px;
  }

  .terminal-card details { display: none; }

  .mobile-task-list {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    grid-auto-rows: 64px;
    align-content: start;
    gap: 6px;
    contain: layout paint;
    overscroll-behavior: contain;
    touch-action: pan-y;
    overflow-y: auto;
    scroll-snap-type: y mandatory;
    scroll-padding-top: 7px;
  }

  .mobile-task-row {
    width: 100%;
    height: 64px;
    min-height: 64px;
    grid-template-columns: 14px minmax(0, 1fr);
    grid-template-rows: minmax(0, 1fr) auto;
    column-gap: 6px;
    row-gap: 2px;
    padding: 7px 8px;
    border-color: #142a3e;
    background: #071421;
    scroll-snap-align: start;
    scroll-snap-stop: always;
  }
  .mobile-task-row + .mobile-task-row { margin-top: 0; }
  .mobile-task-row .state-lamp { grid-row: 1 / 3; }
  .mobile-task-row b { white-space: normal; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; line-height: 1.25; }
  .mobile-task-row small { overflow: hidden; text-overflow: ellipsis; }

  body.keyboard-open {
    --mobile-header: calc(50px + env(safe-area-inset-top));
  }

  body.keyboard-open .status-cell {
    min-height: 50px;
    padding-top: 4px;
    padding-bottom: 4px;
  }

  body.keyboard-open .mobile-terminal {
    grid-template-rows: 0 minmax(0, 1fr) 54px;
  }

  body.keyboard-open .mobile-quick {
    visibility: hidden;
    padding: 0;
    border: 0;
  }

  body.keyboard-open .mobile-task-list {
    display: block;
    padding: 4px 8px calc(4px + env(safe-area-inset-bottom));
    overflow: hidden;
  }

  body.keyboard-open .mobile-task-row:not(.selected) { display: none; }
  body.keyboard-open .mobile-task-row { min-height: 44px; padding-top: 4px; padding-bottom: 4px; }
}
@keyframes idle-lamp-breathe {
  0%, 100% { opacity: 1; transform: scale(1); box-shadow: 0 0 11px #ffc46b99; }
  50% { opacity: .48; transform: scale(.82); box-shadow: 0 0 5px #ffc46b55; }
}

@media (min-width: 480px) and (max-width: 720px) {
  .mobile-task-list { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

@media (max-width: 720px) and (orientation: landscape) {
  :root { --mobile-header: calc(46px + env(safe-area-inset-top)); }
  .status-cell { min-height: 46px; padding-top: 3px; padding-bottom: 3px; }
  .mobile-terminal { grid-template-rows: auto minmax(0, 1fr) 76px; }
}
