/* Chat di HP lebih lega (masukan penguji: "terlihat numpuk"). Dimuat paling akhir.
   1) Satu bilah atas di percakapan: bilah mode disembunyikan, tombol menu & chat baru pindah ke bilah judul.
   2) Aksi pesan pengguna di bawah gelembung, tidak menimpa label jawaban.
   3) Satu indikator "menulis": tanpa titik ganda dan tanpa maskot 3D (hemat baterai).
   4) Tipografi jawaban sedikit lebih ringkas dan berjarak rapi. */
@media (max-width: 640px) {
  .app .unified-chat:has(> .chat.chat-existing) > .chat-mode-bar { display: none; }
  .app .unified-chat > .chat.chat-existing > .topbar { display: flex; align-items: center; gap: 2px; height: 50px; min-height: 50px; padding: 0 6px; border-bottom: 1px solid var(--line-soft, var(--line)); background: var(--bg); }
  .app .unified-chat > .chat.chat-existing > .topbar .mobile-only { display: inline-flex !important; }
  .app .unified-chat > .chat.chat-existing > .topbar .topbar-title { flex: 1; min-width: 0; text-align: left; font-size: 15px; font-weight: 600; }
  .app .unified-chat > .chat.chat-existing > .topbar .topbar-title button { max-width: 100%; text-align: left; }

  .app .chat .thread-inner { padding-left: 16px; padding-right: 16px; }
  .app .chat .msg.user { margin-bottom: 2px; }
  .app .chat .msg.user .msg-actions { position: static; display: flex; justify-content: flex-end; gap: 2px; min-height: 0; margin: 2px 0 0; opacity: .7; }
  /* 40px agar mudah diketuk; margin bawah negatif dicabut supaya tombol yang lebih tinggi tidak menimpa pesan berikutnya. */
  .app .chat .msg.user .msg-actions .btn.icon { width: 40px; height: 40px; min-height: 40px; }
  .app .chat .msg.ai { margin-top: 0; }
  .app .chat .msg.ai .ai-head { margin-bottom: 6px; }

  .app .chat .status-line.buddy .mascot-slot { display: none; }
  .app .chat .status-line.buddy.with-mascot { margin-left: 0; gap: 8px; min-height: 0; padding: 4px 0; }
  .app .chat .status-line.buddy .col { flex-direction: row; flex-wrap: wrap; align-items: baseline; gap: 2px 6px; }
  .app .chat .status-line.buddy .buddy-sub::before { content: "· "; }
  .app .chat .msg.ai .streaming-caret:has(+ .status-line) { display: none; }

  .app .chat .msg.ai .prose { font-size: 16.5px; line-height: 1.62; }
  .app .chat .msg.ai .prose h1 { font-size: 1.38rem; margin: 1em 0 .45em; }
  .app .chat .msg.ai .prose h2 { font-size: 1.22rem; margin: 1.1em 0 .45em; }
  .app .chat .msg.ai .prose h3 { font-size: 1.07rem; margin: 1em 0 .4em; }
  .app .chat .msg.ai .prose > :first-child { margin-top: 0; }
  .app .chat .msg.ai .prose p { margin: 0 0 .75em; }
  .app .chat .msg.ai .prose :is(ol, ul) { padding-left: 1.3em; margin: .3em 0 .85em; }
  .app .chat .msg.ai .prose li + li { margin-top: .3em; }
  .app .chat .msg.ai .prose table { font-size: 14px; }
  .app .chat .msg.ai .prose :is(pre, code) { font-size: 13px; }
  .app .chat .msg.ai .prose blockquote { margin: .6em 0 .9em; padding-left: .9em; }
}

/* Kode yang sedang ditulis tampil langsung di kartu file (seperti Claude/ChatGPT) */
.art-live-code { margin: 6px 0 2px; max-height: 196px; overflow: hidden; padding: 10px 12px; border-radius: 10px; border: 1px solid var(--line, rgba(127,127,127,.18)); background: var(--code-bg, rgba(127,127,127,.07)); font: 12px/1.55 var(--mono, ui-monospace, SFMono-Regular, Menlo, monospace); white-space: pre; color: var(--text-2, inherit); -webkit-mask-image: linear-gradient(to bottom, transparent 0, #000 34%); mask-image: linear-gradient(to bottom, transparent 0, #000 34%); }
.art-live-code code { font: inherit; background: none; padding: 0; }
@media (max-width: 640px) { .art-live-code { font-size: 11px; max-height: 150px; } }

/* ui-mobile-polish: area sentuh >=40px untuk kontrol yang sering diketuk di HP. Berkas ini dimuat setelah settings-refinement, two-modes
   dan suvi-signature, jadi min-height/min-width di sini menang tanpa !important. Lebar tombol bar mode & dok kanvas sengaja tidak
   dinaikkan (bisa meluap di 360px); cukup tingginya. */
@media (max-width: 760px) and (pointer: coarse) {
  .app .unified-chat .chat-mode-bar > :is(.btn.sm, .btn.icon) { min-height: 40px; }
  .app .wc-dock .wc-tool { min-height: 40px; }
  .app .preferences-page .theme-segments button { min-width: 44px; min-height: 40px; height: auto; }
}