/* 新しいダッシュボードで使う返信箱の、携帯の見た目（2026-10-25 吉川さん「WAやLINEのように文章が見やすく、操作ボタンは小さく」）。元の返信箱（netlify）には効かない */
@media (max-width:820px){
  body{-webkit-text-size-adjust:100%}
  header{min-height:48px;padding:6px 10px}
  header .logo{width:30px;height:30px;font-size:12px}
  #m_home{display:inline-flex;align-items:center;gap:4px;font-size:13px;color:#fff;text-decoration:none;opacity:.9;margin-left:auto;padding:4px 8px;border:1px solid rgba(255,255,255,.35);border-radius:8px}
  /* 会話の上: 名前と状態の1行だけ。ほかは ⓘ で開く */
  #paneHead{padding:6px 10px!important;gap:4px!important;border-bottom:1px solid #e6e9f1;background:#fff}
  html:not(.m-sub) #backBtn{font-size:0!important;padding:2px 8px 2px 0!important;border:0!important;background:none!important;min-width:0!important}
  html:not(.m-sub) #backBtn::before{content:"‹";font-size:28px;line-height:1;color:#2563eb}
  #paneHead{display:flex!important;align-items:center;flex-wrap:wrap}
  #phL{flex:1;min-width:0}
  #convTop{font-size:15px!important;line-height:1.3}
  #convTop *{font-size:inherit}
  #convState{font-size:11.5px!important;margin-top:2px}
  #convState *{font-size:11.5px!important;padding:1px 6px!important}
  #convJam,#convWhy,#phR,#hadirBand{display:none!important}
  html.m-info #convJam,html.m-info #convWhy,html.m-info #hadirBand:not(.hidden){display:block!important}
  html.m-info #phR{display:block!important;flex-basis:100%}
  #m_info{flex:none;width:30px;height:30px;border-radius:50%;border:1px solid #e6e9f1;background:#fff;color:#5b6b85;font-size:15px;line-height:1;padding:0}
  html.m-info #m_info{background:#eef4ff;color:#2563eb;border-color:#2563eb}
  /* 会話: WhatsAppの色と、大きく読みやすい文字 */
  #msgs{background:#efeae2!important;padding:10px 8px!important}
  #msgs .bubble{font-size:16px!important;line-height:1.45!important;max-width:84%!important;border-radius:12px!important;box-shadow:0 1px .5px rgba(0,0,0,.13)!important;border:0!important;padding:7px 10px!important}
  #msgs .bubble.b-in{background:#fff!important}
  #msgs .bubble.b-out{background:#d9fdd3!important}
  #msgs .bubble.b-bot{background:#f3f4f6!important;border:0!important}
  #msgs .bubble .lbl{font-size:11px!important}
  /* 下: 1行の入力欄と小さいボタン */
  #replyWrap{padding:6px 8px calc(6px + env(safe-area-inset-bottom))!important;background:#f0f2f5!important;border-top:0!important}
  #replyRow{display:flex!important;align-items:flex-end;gap:6px!important}
  #replyText{min-height:42px!important;max-height:140px;font-size:16px!important;border-radius:21px!important;padding:10px 14px!important;border:1px solid #e6e9f1!important;background:#fff!important}
  #sendAct{flex:none}
  #sendAct small,#sendBtn .to{display:none!important}
  #sendBtn{width:44px!important;height:44px!important;min-width:0!important;border-radius:50%!important;padding:0!important;background:#16a34a!important;border:0!important;font-size:0!important;display:grid;place-items:center}
  #sendBtn .k{font-size:0!important}
  #sendBtn::after{content:"";width:20px;height:20px;background:no-repeat center/contain url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='white'%3E%3Cpath d='M3 20.5v-7l9-1.5-9-1.5v-7L22 12z'/%3E%3C/svg%3E")}
  #m_quick{flex:none;width:42px;height:42px;border-radius:50%;border:1px solid #e6e9f1;background:#fff;font-size:18px;padding:0}
  #actionsRow2,#actionsRow3{display:flex!important;gap:6px!important;overflow-x:auto;padding:6px 0 0!important;margin:0!important;flex-wrap:nowrap!important}
  #actionsRow2 .act,#actionsRow3 .act{flex:none!important;width:auto!important;min-width:0!important}
  #actionsRow2 small,#actionsRow3 small{display:none!important}
  #actionsRow2 .btn-s,#actionsRow3 .btn-s{font-size:12px!important;padding:4px 10px!important;min-height:0!important;height:28px;border-radius:14px!important;white-space:nowrap}
  #quickAct{display:none!important}
  #actionsRow3{display:none!important}
  html.m-more #actionsRow3{display:flex!important}
  #sendErr:empty{display:none}
}
@media (max-width:820px){
  header h1{font-size:16px!important;white-space:nowrap;min-width:0;overflow:hidden}
  header h1 small,#hdrInfo{display:none!important}
  header #teksLink,header #akunBtn{font-size:11.5px!important;padding:4px 8px!important;min-height:0!important;height:30px;border-radius:8px!important;display:inline-flex!important;align-items:center;gap:2px;white-space:nowrap}
  header #teksLink span{display:inline!important}
  #m_home{font-size:12px;padding:4px 8px;height:30px}
  #convTop .no,#convTop [class*="nomor"],#convTop small{font-size:11px!important}
}
@media (max-width:820px){header #teksLink{flex-direction:row!important}}
/* ===== 受信箱以外のページ（2026-10-25 吉川さん「他のページも最適化して」）: 中身の文字は大きめ、操作ボタン・説明は控えめ、見出しは1段 ===== */
@media (max-width:820px){
  /* 上の見出し: 1段。題名は入るだけ出し、ボタンは小さく右に */
  html.m-sub header{flex-wrap:nowrap!important;justify-content:flex-start!important;gap:6px!important;padding:6px 10px!important;min-height:46px}
  html.m-sub header h1{flex:1 1 auto;min-width:0;gap:6px!important}
  html.m-sub header h1>span:not(.logo){min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  html.m-sub header .logo{width:26px!important;height:26px!important;font-size:11px!important;flex:none}
  html.m-sub #outBtn,html.m-sub #backInbox,html.m-sub #langBtn{flex:none;min-height:0!important;height:30px;padding:0 8px!important;font-size:11.5px!important;border-radius:8px;white-space:nowrap;display:inline-flex;align-items:center}
  html.m-sub #m_home{flex:none;margin-left:0;font-size:11.5px;height:30px;padding:0 8px;white-space:nowrap}
  html.m-sub .hbtns{flex:none;gap:6px!important}

  /* ウェビナー: 人のカードの文字を大きく、ボタンは小さく */
  html.p-webinar .card .nm{font-size:17px}
  html.p-webinar .card .sm{font-size:14px;color:#3b4656}
  html.p-webinar .go{gap:6px;margin:6px 0 4px}
  html.p-webinar .go a{min-height:30px!important;padding:3px 10px!important;font-size:12px!important;border-radius:15px!important}
  html.p-webinar .go a .ja{display:none}
  html.p-webinar .kirim button{min-height:32px!important;font-size:12px!important;border-radius:16px!important;padding:0 12px!important}
  html.p-webinar .row2 button{min-height:38px}
  html.p-webinar .hub button{min-height:40px}
  html.p-webinar .filters{flex-wrap:nowrap;overflow-x:auto;-webkit-overflow-scrolling:touch;padding-bottom:2px}
  html.p-webinar .filters button{flex:none;min-height:30px!important;font-size:12px!important;border-radius:15px;white-space:nowrap;padding:0 12px}
  html.p-webinar .qrow input,html.p-webinar #selTgl{min-height:40px;padding:8px 10px}
  html.p-webinar .qrow button{min-height:40px;font-size:13px}
  html.p-webinar .qrow button .ja{display:none}
  html.p-webinar details.lain summary{min-height:28px;font-size:12px}
  html.p-webinar .tools button{min-height:32px;font-size:12px;border-radius:16px}
  html.p-webinar .today .ti{min-height:42px;padding:4px 0}
  html.p-webinar .today .ti span{font-size:14px}

  /* 候補者: 絞り込みは1段の小さいボタン（横に動かせる）、名前と中身は大きく、ランクの札は小さく */
  html.p-kandidat #cariBar{margin:8px 10px 0}
  html.p-kandidat #cariIn{min-height:40px}
  html.p-kandidat #chips{flex-wrap:nowrap;overflow-x:auto;-webkit-overflow-scrolling:touch;gap:6px;padding:8px 10px 4px}
  html.p-kandidat .fc{flex:none;min-height:30px!important;font-size:12px!important;padding:0 10px!important;border-width:1.5px!important;border-radius:15px;white-space:nowrap;box-shadow:none!important}
  html.p-kandidat .fc .ja{display:inline;margin-left:4px;font-size:10px}
  html.p-kandidat #cnt{padding:2px 12px 4px}
  html.p-kandidat .row{padding:11px 10px 11px 12px;gap:8px}
  html.p-kandidat .rName{font-size:17px}
  html.p-kandidat .rLine{font-size:14px;color:#3b4656}
  html.p-kandidat .rMemo{font-size:14px}
  html.p-kandidat .row .badge{min-width:0;padding:3px 8px;font-size:13px;border-width:1.5px;border-radius:12px}
  html.p-kandidat .row .badge .ja{display:none}
  html.p-kandidat .row .go{font-size:18px}
  html.p-kandidat .rbtns button{min-height:44px;font-size:14px}
  html.p-kandidat .btn-chat{min-height:36px;font-size:13px}

  /* 1人のページ: ランクのボタンと移動のボタンを小さく */
  html.p-orang .badge{min-width:0;padding:4px 8px;font-size:14px;border-width:1.5px}
  html.p-orang .go a{min-height:36px;flex-direction:row;gap:6px;font-size:13px}
  html.p-orang .go a .ja{font-size:10px}
  html.p-orang .rbtns{gap:6px}
  html.p-orang .rbtns button{min-height:40px;font-size:14px;border-width:1.5px;padding:2px 4px}
  html.p-orang .rbtns button .ja{font-size:9.5px}
  html.p-orang .kv{font-size:15px}
  html.p-orang .kv dd{font-weight:600}
  html.p-orang .sm,html.p-orang .hist{font-size:14px}
  html.p-orang .card .ttl{font-size:16px}
  html.p-orang .kirimlist{font-size:14px}

  /* SNS: 見出しは1段。アカウント・言語の切り替えは m.js で見出しの下の細い段へ移す */
  html.p-sns header{position:sticky}
  html.p-sns .hctl{flex:none;flex-wrap:nowrap!important;gap:6px!important}
  html.p-sns #m_snsbar{display:flex;justify-content:space-between;gap:6px;margin:0 0 8px}
  html.p-sns #m_snsbar .seg{flex:none;padding:2px;background:#e6eaf1;border-radius:9px}
  html.p-sns #m_snsbar .seg button{min-height:26px!important;font-size:11.5px!important;padding:0 9px!important;white-space:nowrap;color:#5b6677;border-radius:7px}
  html.p-sns #m_snsbar .seg button[aria-pressed="true"]{background:#16264C;color:#fff}
  html.p-sns main{padding:10px 10px 24px}
  html.p-sns .tabs{display:flex;margin-bottom:10px}
  html.p-sns .tab{flex:1;min-height:32px;font-size:13px;padding:0 10px}
  html.p-sns .card{padding:12px 12px;border-radius:14px}
  html.p-sns .verdict{padding:12px;gap:10px}
  html.p-sns .verdict .ico{width:32px;height:32px;font-size:16px}
  html.p-sns .pill{min-height:28px;font-size:12px}

  /* 分析: 見出しの言語ボタンを小さく */
  html.p-bunseki .seg2 button{min-height:34px;font-size:13px}

  /* Botの文: 戻るボタン・保存などを小さく、本文は読みやすく */
  html.p-teks #q{min-height:40px}
  html.p-teks .rKey{font-size:15px}
  html.p-teks #teksBody{font-size:16px}
  html.p-teks #waBubble{font-size:16px;line-height:1.45}
  html.p-teks .rowBtns button,html.p-teks #actions button{min-height:38px;font-size:14px}
  html.p-teks .vchip{min-height:30px}
}
@media (max-width:820px){html.p-bunseki header h1>span:not(.logo){display:none}}