.reiwa-comic3-root{
  --rc-paper:#F2ECD8;
  --rc-ink:#1A1A1A;
  --rc-red:#E4432B;
  --rc-yellow:#F3C531;
  --rc-panel-bg:#FFFDF5;
  --rc3-font-scale:1; /* v3.2.0: 訪問者が文字サイズを変更できる機能で使う倍率 */
  max-width:920px;
  margin:0 auto;
  padding:16px;
  background:
    radial-gradient(circle, rgba(0,0,0,0.06) 1px, transparent 1.2px) 0 0/14px 14px,
    var(--rc-paper);
  color:var(--rc-ink);
  font-family:"Hiragino Sans","Yu Gothic",sans-serif;
  box-sizing:border-box;
}
.reiwa-comic3-root *{box-sizing:border-box;}

/* JS側は要素の表示・非表示をel.hidden=true/falseで切り替えている箇所が複数ある
   (スレッド作成フォーム、タブバー、顔文字一覧など)。本来ブラウザは[hidden]属性
   だけで自動的にdisplay:noneにしてくれるが、[hidden]の詳細度は低いため、
   このファイル内の他のセレクタ(例:.rc3-thread-form{display:flex})の方が
   詳細度で勝ってしまうと、hidden属性を付けても表示され続けてしまう事故が起きる。
   それを避けるため、[hidden]を常に最優先にしておく。 */
.reiwa-comic3-root [hidden]{
  display:none !important;
}

.reiwa-comic3-root .rc3-title{
  display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:10px;
  margin-bottom:12px;
}
.reiwa-comic3-root .rc3-title h2{
  font-size:clamp(20px,5vw,30px);
  margin:0;
  letter-spacing:1px;
  transform:rotate(-2deg);
  background:var(--rc-yellow);
  display:inline-block;
  padding:6px 16px;
  border:3px solid var(--rc-ink);
  box-shadow:5px 5px 0 var(--rc-ink);
}
.reiwa-comic3-root .rc3-subtitle{font-size:12px;opacity:.75;margin-top:14px;line-height:1.6;}
.reiwa-comic3-root .rc3-ai-status{
  border:2px solid var(--rc-ink);
  background:var(--rc-panel-bg);
  padding:6px 12px;
  font-size:12px;
  font-weight:bold;
  box-shadow:3px 3px 0 var(--rc-ink);
}
.reiwa-comic3-root .rc3-ai-status.on{background:var(--rc-red);color:#fff;}

.reiwa-comic3-root .rc3-clear-log-btn{
  border:2px solid var(--rc-ink);
  background:#fff;
  color:var(--rc-ink);
  font-size:11px;
  font-weight:bold;
  padding:6px 10px;
  cursor:pointer;
  border-radius:4px;
  box-shadow:2px 2px 0 var(--rc-ink);
}
.reiwa-comic3-root .rc3-clear-log-btn:active{transform:translate(1px,1px);box-shadow:1px 1px 0 var(--rc-ink);}
.reiwa-comic3-root .rc3-clear-log-btn:disabled{opacity:.5;cursor:not-allowed;}

/* ---------- スレッドトーン(スレッドごとの背景色替え。v2.01の「背景の連続感」トーンをスレッド単位に拡張) ---------- */
.reiwa-comic3-root[data-rc3-tone="sunset"]{ --rc-paper:#F6DEC8; --rc-panel-bg:#FFF4E8; --rc-yellow:#F0A94E; }
.reiwa-comic3-root[data-rc3-tone="night"]{ --rc-paper:#D9DCE6; --rc-panel-bg:#EFF1F7; --rc-yellow:#9FB3D9; --rc-ink:#20242E; }
.reiwa-comic3-root[data-rc3-tone="sakura"]{ --rc-paper:#F7E1E8; --rc-panel-bg:#FFF3F6; --rc-yellow:#F5B3C6; }
.reiwa-comic3-root[data-rc3-tone="mint"]{ --rc-paper:#DCEEE4; --rc-panel-bg:#F0FAF4; --rc-yellow:#8FD6B0; }

/* ---------- スレッドバー(タブ切替) ---------- */
.reiwa-comic3-root .rc3-thread-bar{
  display:flex;align-items:center;gap:8px;flex-wrap:wrap;
  margin-bottom:10px;
}
.reiwa-comic3-root .rc3-thread-tabs{
  display:flex;gap:6px;flex-wrap:wrap;flex:1;
}
.reiwa-comic3-root .rc3-thread-tab{
  display:flex;align-items:stretch;
  border:2px solid var(--rc-ink);
  background:var(--rc-panel-bg);
  border-radius:6px 6px 0 0;
  overflow:hidden;
}
.reiwa-comic3-root .rc3-thread-tab.selected{
  background:var(--rc-yellow);
  box-shadow:2px 2px 0 var(--rc-ink);
}
.reiwa-comic3-root .rc3-thread-tab-click{
  display:flex;flex-direction:column;align-items:flex-start;gap:2px;
  border:none;background:none;
  padding:5px 10px;
  font-size:11px;font-weight:bold;font-family:inherit;color:var(--rc-ink);
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
}
.reiwa-comic3-root .rc3-thread-tab-tag{
  font-size:9px;font-weight:normal;opacity:.7;
}
.reiwa-comic3-root .rc3-thread-del-btn{
  border:none;border-left:2px solid var(--rc-ink);
  background:rgba(0,0,0,0.05);
  color:var(--rc-ink);
  font-size:12px;font-weight:bold;
  padding:0 8px;
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
}
.reiwa-comic3-root .rc3-thread-del-btn:hover{background:var(--rc-red);color:#fff;}
.reiwa-comic3-root .rc3-thread-new-btn{
  border:2px dashed var(--rc-ink);background:none;color:var(--rc-ink);
  font-size:11px;font-weight:bold;padding:6px 10px;border-radius:6px;
  cursor:pointer;white-space:nowrap;
}
.reiwa-comic3-root .rc3-thread-form{
  display:flex;gap:6px;flex-wrap:wrap;align-items:center;
  border:2px dashed var(--rc-ink);background:var(--rc-panel-bg);
  padding:8px 10px;margin-bottom:10px;
}
.reiwa-comic3-root .rc3-thread-form input[type=text]{
  border:2px solid var(--rc-ink);padding:6px 8px;font-size:12px;border-radius:6px;
  font-family:inherit;
}
.reiwa-comic3-root .rc3-thread-form select{
  border:2px solid var(--rc-ink);padding:6px 8px;font-size:12px;border-radius:6px;
  font-family:inherit;
}
.reiwa-comic3-root .rc3-thread-form button{
  border:2px solid var(--rc-ink);background:#fff;color:var(--rc-ink);
  font-size:11px;font-weight:bold;padding:6px 10px;cursor:pointer;border-radius:6px;
}
.reiwa-comic3-root #rc3ThreadCreateBtn{background:var(--rc-red);color:#fff;}

/* ---------- ロスター(キャラ選択) ---------- */
.reiwa-comic3-root .rc3-roster{
  display:flex;gap:8px;flex-wrap:wrap;
  padding:10px;border:3px solid var(--rc-ink);background:var(--rc-panel-bg);
  box-shadow:4px 4px 0 var(--rc-ink);
  margin-bottom:14px;
}
.reiwa-comic3-root .rc3-char-btn{
  width:64px;
  min-height:44px;
  background:none;border:2px solid transparent;border-radius:8px;
  cursor:pointer;padding:4px;text-align:center;
  -webkit-tap-highlight-color:transparent;
}
.reiwa-comic3-root .rc3-char-btn svg,
.reiwa-comic3-root .rc3-char-btn img.rc3-avatar-img{width:48px;height:48px;display:block;margin:0 auto;}
.reiwa-comic3-root .rc3-char-btn span{font-size:10px;display:block;margin-top:2px;font-weight:bold;}
.reiwa-comic3-root .rc3-char-btn.selected{border-color:var(--rc-ink);background:var(--rc-yellow);}
.reiwa-comic3-root .rc3-char-btn:disabled{opacity:.35;cursor:not-allowed;}
.reiwa-comic3-root .rc3-char-btn .rc3-ai-badge{font-size:9px;color:var(--rc-red);font-weight:bold;}

/* ---------- ニックネーム欄 ---------- */
.reiwa-comic3-root .rc3-nickname-row{
  display:flex;align-items:center;gap:8px;flex-wrap:wrap;
  padding:8px 10px;margin-bottom:14px;
  border:2px dashed var(--rc-ink);background:var(--rc-panel-bg);
  font-size:12px;
}
.reiwa-comic3-root .rc3-nickname-row label{font-weight:bold;white-space:nowrap;}
.reiwa-comic3-root .rc3-nickname-row input[type=text]{
  flex:1;min-width:120px;border:2px solid var(--rc-ink);padding:6px 8px;font-size:13px;border-radius:6px;
  font-family:inherit;
}

/* ---------- コマ(ストリップ) ---------- */
.reiwa-comic3-root .rc3-strip{
  display:flex;flex-direction:column;gap:14px;
  padding:16px;
  border:3px solid var(--rc-ink);
  background:
    repeating-linear-gradient(135deg, rgba(0,0,0,0.025) 0 2px, transparent 2px 8px),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='320' height='150' viewBox='0 0 320 150'%3E%3Cpolygon points='0,150 30,70 70,115 120,35 170,100 220,55 270,110 320,60 320,150' fill='%231A1A1A' opacity='0.06'/%3E%3C/svg%3E") repeat-x top / 320px 150px,
    var(--rc-panel-bg);
  min-height:220px;
  margin-bottom:14px;
  max-height:60vh;
  overflow-y:auto;
}
.reiwa-comic3-root .rc3-empty-hint{margin:auto;font-size:13px;opacity:.6;text-align:center;padding:30px;}

/* 1つの「コマ」。中に複数キャラ(actor)が横並びで入る。
   背景をやや透ける薄い地色にして、ストリップ全体の山並みが奥にうっすら続いて見えるようにしている。 */
.reiwa-comic3-root .rc3-panel{
  background:rgba(255,253,245,0.86);
  border:3px solid var(--rc-ink);
  padding:10px;
  position:relative;
  align-self:flex-start;
  max-width:100%;
  animation:rc3-pop .28s ease-out;
}
@media (prefers-reduced-motion: reduce){ .reiwa-comic3-root .rc3-panel{animation:none;} }
@keyframes rc3-pop{
  from{transform:scale(.85) rotate(0deg);opacity:0;}
  to{transform:scale(1) rotate(var(--rc-tilt));opacity:1;}
}

.reiwa-comic3-root .rc3-panel-row{
  display:flex;
  gap:14px;
  align-items:flex-end;
  flex-wrap:wrap;
}

/* コマの中の1キャラ分(アバター+その子の吹き出しの束) */
.reiwa-comic3-root .rc3-actor{
  display:flex;flex-direction:column;align-items:center;gap:6px;
  width:150px;
  position:relative;
  transform-origin:bottom center;
}
/* 2人目以降は少しだけ縮小・奥へ下げて重なりを持たせ、手前/奥の遠近感を出す
   (吹き出しの文字は読めるよう、重なるのはアバター側の余白程度にとどめている) */
.reiwa-comic3-root .rc3-panel-row .rc3-actor:nth-child(1){ z-index:4; }
.reiwa-comic3-root .rc3-panel-row .rc3-actor:nth-child(2){ z-index:3; transform:scale(0.94) translateY(4px); margin-left:-10px; }
.reiwa-comic3-root .rc3-panel-row .rc3-actor:nth-child(3){ z-index:2; transform:scale(0.88) translateY(8px); margin-left:-12px; }
.reiwa-comic3-root .rc3-panel-row .rc3-actor:nth-child(4){ z-index:1; transform:scale(0.82) translateY(12px); margin-left:-12px; }

.reiwa-comic3-root .rc3-nameplate{
  align-self:flex-start;
  background:var(--rc-ink);color:#fff;
  font-size:10px;font-weight:bold;
  padding:2px 8px;
  transform:rotate(-1deg);
}
.reiwa-comic3-root .rc3-actor svg,
.reiwa-comic3-root .rc3-actor img.rc3-avatar-img{width:64px;height:64px;flex-shrink:0;}

.reiwa-comic3-root .rc3-bubble-stack{display:flex;flex-direction:column;gap:5px;width:100%;}
.reiwa-comic3-root .rc3-bubble{
  position:relative;
  background:#fff;
  border-radius:16px;
  padding:8px 10px;
  font-size:calc(12.5px * var(--rc3-font-scale));
  line-height:1.4;
  width:100%;
  min-height:32px;
  word-break:break-word;
  display:flex;
  align-items:flex-end;
  gap:6px;
  flex-wrap:wrap;
  /* 縁取り(黒枠)は使わず、吹き出し本体としっぽを1枚のシルエットとして
     drop-shadowで縁取る方式にした。box-shadowは要素自身の矩形にしか
     付かないが、drop-shadowは::after(しっぽ)を含めた透明部分の形に
     沿って影が付くので、本体としっぽの継ぎ目に関する調整が一切不要になる。
     吹き出しの背景(#fff)とコマ本体の背景(--rc-panel-bg、ほぼ白に近い
     クリーム色)は色がかなり近く、特にPC版はしっぽがコマ本体の背景に
     浮いた状態になるため、影が弱いと輪郭ごと見えなくなってしまっていた。
     そのため、にじませた影を少し強め、輪郭用のシャープな影もはっきり
     させて、背景色が近い場所でもしっぽ・本体の形が判別できるようにした。 */
  filter:
    drop-shadow(0 2px 4px rgba(34,24,14,.38))
    drop-shadow(0 0 1.5px rgba(34,24,14,.55));
}
.reiwa-comic3-root .rc3-bubble-text{flex:1;min-width:0;}
.reiwa-comic3-root .rc3-bubble-time{
  font-size:9.5px;
  opacity:.55;
  white-space:nowrap;
  flex-shrink:0;
  padding-bottom:1px;
}
.reiwa-comic3-root .rc3-bubble::after{
  content:"";
  position:absolute;top:-12px;left:27px;
  border:7px solid transparent;
  border-bottom-color:#fff;
}

/* ---------- 入力欄 ---------- */
.reiwa-comic3-root .rc3-composer{
  position:sticky;
  bottom:8px;
  z-index:2;
  border:3px solid var(--rc-ink);
  background:var(--rc-panel-bg);
  padding:10px;
  box-shadow:4px 4px 0 var(--rc-ink);
  max-width:100%;
}
/* 入力欄の行(rc3-compose-row)と顔文字一覧の行(rc3-kaomoji-row)は、どちらか
   片方だけを表示する「同じ1行分の場所」。以前は顔文字一覧を別枠として上に
   積み重ねていたが、開いた時にコマ漫画の表示エリアを圧迫してしまうという
   指摘を受け、入れ替え(裏返し)方式に変更した。 */
.reiwa-comic3-root .rc3-compose-row,
.reiwa-comic3-root .rc3-kaomoji-row{
  display:flex;gap:6px;
  align-items:stretch;
}
/* 顔文字ボタンを入力欄に重ねる方式は、実機(特にiOSのSafari)でボタンが
   入力欄にタップを取られてしまい反応しないことがあったため、v3.2.0では
   独立した(重ならない)小さなボタンに戻した。横幅を最小限にするため、
   表示ラベルは1文字の絵文字にし、パディングも切り詰めている。 */
.reiwa-comic3-root .rc3-composer input[type=text]{
  flex:1 1 auto;
  min-width:0; /* flexアイテムは既定でmin-width:autoのため、これが無いと入力欄が縮まずにコンポーザー全体が横にはみ出す */
  border:2px solid var(--rc-ink);padding:12px 10px;font-size:16px;border-radius:6px;
  font-family:inherit;
}
.reiwa-comic3-root .rc3-composer button{
  flex-shrink:0;
  border:2px solid var(--rc-ink);background:var(--rc-red);color:#fff;
  font-weight:bold;padding:0 20px;cursor:pointer;border-radius:6px;
  box-shadow:3px 3px 0 var(--rc-ink);
  min-width:64px;
  white-space:nowrap;
  -webkit-tap-highlight-color:transparent;
}
.reiwa-comic3-root .rc3-composer button:active{transform:translate(2px,2px);box-shadow:1px 1px 0 var(--rc-ink);}
.reiwa-comic3-root .rc3-composer button:disabled{opacity:.4;cursor:not-allowed;}

/* 顔文字ボタン・戻るボタンは「送信」ボタンと違って独立した列の幅を最小限で
   よいので、共通の.rc3-composer buttonルール(赤背景・min-width:64px等)を
   上書きし、白背景の小さなアイコンボタンにする。色も控えめにして、「送信」
   だけが赤=本命の操作として目立つようにする。
   幅は「文字を入れてpaddingで広げる」のではなく、width固定+中身を中央寄せに
   している。絵文字や矢印記号は端末やフォントによって実際の描画幅が想定より
   広くなることがあり、それが原因で入力欄側にしわ寄せがいって横幅オーバーに
   なることがあったため、ボタンの外枠の幅を常に一定にして影響を受けないように
   している(はみ出す分はoverflow:hiddenで内側に収める)。 */
.reiwa-comic3-root .rc3-composer .rc3-kaomoji-btn,
.reiwa-comic3-root .rc3-composer .rc3-kaomoji-back{
  min-width:auto;
  width:44px;
  padding:0;
  font-size:18px;
  flex-shrink:0;
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  line-height:1;
  border:2px solid var(--rc-ink);
  background:#fff;
  box-shadow:2px 2px 0 var(--rc-ink);
  color:var(--rc-ink);
}
.reiwa-comic3-root .rc3-composer .rc3-kaomoji-btn:active,
.reiwa-comic3-root .rc3-composer .rc3-kaomoji-back:active{
  transform:translate(1px,1px);
  box-shadow:1px 1px 0 var(--rc-ink);
}

/* 顔文字一覧は縦に並べず、横1行にしてスクロールで見せる(スレッドタブ等と
   同じ「横スクロール一覧」の考え方)。これによりコンポーザーの高さは
   入力欄1行ぶんのままで、何個ボタンを増やしても縦方向を圧迫しない。 */
.reiwa-comic3-root .rc3-kaomoji-scroll{
  display:flex;gap:6px;
  align-items:center;
  flex:1 1 auto;
  min-width:0;
  overflow-x:auto;
  -webkit-overflow-scrolling:touch;
  scroll-snap-type:x proximity;
  touch-action:pan-x;
  overscroll-behavior-x:contain;
  padding:2px 1px;
}
/* .rc3-composer buttonという共通ルール(赤背景)よりも詳細度で勝つよう、
   あえて.rc3-composerを頭に付けて上書きしている(付けないと、ボタンである
   .rc3-kaomoji-itemが赤いままになってしまう)。 */
.reiwa-comic3-root .rc3-composer .rc3-kaomoji-item{
  flex:0 0 auto;
  scroll-snap-align:start;
  border:2px solid var(--rc-ink);background:#fff;color:var(--rc-ink);
  border-radius:6px;
  font-size:13px;padding:0 10px;font-weight:normal;
  box-shadow:none;min-width:auto;cursor:pointer;
  -webkit-tap-highlight-color:transparent;
}
.reiwa-comic3-root .rc3-composer .rc3-kaomoji-item:active{
  background:var(--rc-yellow);
  transform:none;
}

/* プレースホルダー(未入力時のグレーの案内文)だけ本文より少し小さくする。
   入力欄本体のfont-size(16px)はiOS Safariの自動ズーム防止のために必要なので、
   ::placeholderだけを対象にすればズーム防止を崩さずに見た目の窮屈さを減らせる。 */
.reiwa-comic3-root .rc3-composer input[type=text]::placeholder{
  font-size:13px;
  opacity:.75;
}

/* ---------- 「↓最新へ」ボタン ----------
   .rc3-composerは既にposition:stickyなので、その子要素をposition:absolute;
   bottom:100%で置くと、入力欄の高さがPC/スマホで違っても常に「入力欄のすぐ
   上」に浮かぶ(コンポーザーの高さを気にする計算が要らない)。古いログを
   読んでいて画面の下端(=最新の発言)から離れている時だけ現れる。 */
/* 「.rc3-composer button」という共通ルール(赤背景・min-width:64px等、モバイル
   版では別途padding/min-widthの上書きもある)より詳細度で勝つよう、あえて
   .rc3-composerを頭に付けている(付けないと、丸ピル型のデザインが効かなくなる)。 */
.reiwa-comic3-root .rc3-composer .rc3-jump-latest{
  position:absolute;
  right:10px;
  bottom:100%;
  margin-bottom:8px;
  display:flex;
  align-items:center;
  gap:6px;
  border:2px solid var(--rc-ink);
  background:var(--rc-yellow);
  color:var(--rc-ink);
  font-weight:bold;
  font-size:12px;
  padding:7px 12px;
  min-width:auto;
  border-radius:999px;
  box-shadow:3px 3px 0 var(--rc-ink);
  cursor:pointer;
  white-space:nowrap;
  z-index:3;
  -webkit-tap-highlight-color:transparent;
}
.reiwa-comic3-root .rc3-composer .rc3-jump-latest:active{transform:translate(2px,2px);box-shadow:1px 1px 0 var(--rc-ink);}
.reiwa-comic3-root .rc3-jump-badge{
  display:inline-block;
  min-width:18px;
  padding:0 5px;
  border-radius:999px;
  background:var(--rc-red);
  color:#fff;
  font-size:11px;
  line-height:18px;
  text-align:center;
}

.reiwa-comic3-root .rc3-status{font-size:11px;opacity:.65;margin-top:6px;text-align:right;}

/* ---------- モバイル最適化 ---------- */
@media (max-width: 640px){
  .reiwa-comic3-root{
    padding:10px;
    /* iOSのノッチ/ホームバー分の余白を確保 */
    padding-bottom:max(10px, env(safe-area-inset-bottom));
  }
  .reiwa-comic3-root .rc3-title{margin-bottom:8px;}
  .reiwa-comic3-root .rc3-title h2{font-size:20px;padding:5px 12px;}
  /* スマホでも説明文は表示するが、行間を少し詰めて縦スペースを節約する */
  .reiwa-comic3-root .rc3-subtitle{font-size:11px;margin-top:10px;line-height:1.5;}

  .reiwa-comic3-root .rc3-roster{
    flex-wrap:nowrap;
    overflow-x:auto;
    -webkit-overflow-scrolling:touch;
    padding:8px;
    scroll-snap-type:x proximity;
    touch-action:pan-x;
    overscroll-behavior-x:contain;
  }
  .reiwa-comic3-root .rc3-char-btn{
    flex:0 0 auto;
    width:58px;
    scroll-snap-align:start;
  }

  .reiwa-comic3-root .rc3-strip{
    max-height:none;
    padding:10px;
    gap:10px;
  }

  /* 1コマ内の複数キャラを横並びから縦積みにして、画面幅で潰れないようにする。
     奥行き表現(縮小・重なり)はこのレイアウトだと崩れるので無効化する。 */
  .reiwa-comic3-root .rc3-panel{width:100%;align-self:stretch;}
  .reiwa-comic3-root .rc3-panel-row{flex-direction:column;align-items:stretch;gap:10px;}
  .reiwa-comic3-root .rc3-panel-row .rc3-actor{
    transform:none !important;
    margin-left:0 !important;
  }
  .reiwa-comic3-root .rc3-actor{
    width:100%;
    flex-direction:row;
    align-items:flex-start;
    gap:10px;
  }
  .reiwa-comic3-root .rc3-actor .rc3-actor-head{
    display:flex;flex-direction:column;align-items:center;flex-shrink:0;width:56px;
  }
  .reiwa-comic3-root .rc3-actor svg,
  .reiwa-comic3-root .rc3-actor img.rc3-avatar-img{width:52px;height:52px;}
  .reiwa-comic3-root .rc3-bubble-stack{flex:1;}
  /* topは吹き出しのborder-radius(16px)より内側(14px)にあると、角の丸みに
     三角のとがった先端が食い込んで見えてしまい邪魔な印象になっていた。
     半径の外側(直線部分)に収まるよう、16pxより少し余裕を持たせている。
     吹き出しの縁取り(黒枠)自体を廃止したので、しっぽも「黒い外枠+白い
     中身」の二重三角形ではなく、吹き出しと同じ白1色の単純な三角形1枚に
     した。付け根を吹き出し本体に2pxほど重ねて隙間なくつなげているが、
     色が同じ白同士なので重なりは見えず、境目のない一体形状になる。
     輪郭はどちらも親要素(.rc3-bubble)のdrop-shadowが本体・しっぽ込みの
     シルエットに沿って付くので、ここでは影を個別に用意する必要はない。 */
  .reiwa-comic3-root .rc3-bubble::after{
    top:9px;left:-21px;border-width:11px;
    border-top-color:transparent;border-bottom-color:transparent;
    border-right-color:#fff;border-left-color:transparent;
  }

  /* スマホでは「顔文字ボタン+入力欄+送信ボタン」を横1列に並べる。顔文字ボタンは
     1文字の絵文字だけの極小ボタンにして専有幅を切り詰め、入力欄をできるだけ広く
     保ちつつ、行数は増やさない(顔文字一覧を開いた時も、同じ1行の場所の中で
     入れ替わるだけなので、コマ漫画の表示エリアを圧迫しない)。 */
  .reiwa-comic3-root .rc3-composer{
    position:sticky;bottom:0;
    padding:8px;
    padding-bottom:max(8px, env(safe-area-inset-bottom));
  }
  .reiwa-comic3-root .rc3-compose-row,
  .reiwa-comic3-root .rc3-kaomoji-row{
    gap:5px;
  }
  .reiwa-comic3-root .rc3-composer input[type=text]{
    font-size:16px;padding:10px 8px; /* iOSの自動ズーム防止 */
  }
  .reiwa-comic3-root .rc3-composer button{padding:0 14px;min-width:56px;}
  .reiwa-comic3-root .rc3-composer .rc3-kaomoji-btn,
  .reiwa-comic3-root .rc3-composer .rc3-kaomoji-back{width:38px;padding:0;font-size:16px;min-width:auto;}

  .reiwa-comic3-root .rc3-nickname-row{font-size:13px;}

  .reiwa-comic3-root .rc3-thread-bar{gap:6px;}
  .reiwa-comic3-root .rc3-thread-tabs{
    flex-wrap:nowrap;overflow-x:auto;-webkit-overflow-scrolling:touch;
    touch-action:pan-x;overscroll-behavior-x:contain;
  }
  .reiwa-comic3-root .rc3-thread-tab{flex:0 0 auto;}
  .reiwa-comic3-root .rc3-thread-form{flex-direction:column;align-items:stretch;}
  .reiwa-comic3-root .rc3-thread-form input[type=text],
  .reiwa-comic3-root .rc3-thread-form select{width:100%;}
}

/* =========================================================
   v3.2.0 追加分
   ========================================================= */

/* ---------- タイトル横のボタン群(文字サイズ・通知音) ---------- */
.reiwa-comic3-root .rc3-title-actions{display:flex;gap:6px;align-items:center;}
.reiwa-comic3-root .rc3-font-btn,
.reiwa-comic3-root .rc3-sound-btn{
  border:2px solid var(--rc-ink);background:#fff;color:var(--rc-ink);
  font-size:12px;font-weight:bold;padding:6px 10px;cursor:pointer;border-radius:4px;
  box-shadow:2px 2px 0 var(--rc-ink);
}

/* ---------- スレッドのメタ情報(オンライン人数) ---------- */
.reiwa-comic3-root .rc3-thread-meta{font-size:11px;opacity:.7;margin-bottom:6px;min-height:14px;}

/* ---------- スレッドタブのバッジ(お知らせ専用・アーカイブ) ---------- */
.reiwa-comic3-root .rc3-thread-tab-badge{margin-left:4px;font-size:10px;}
.reiwa-comic3-root .rc3-thread-archived{opacity:.6;}

/* ---------- 過去ログ「もっと見る」 ---------- */
.reiwa-comic3-root .rc3-load-more-btn{
  display:block;width:100%;margin-bottom:8px;
  border:2px dashed var(--rc-ink);background:none;color:var(--rc-ink);
  font-size:11px;font-weight:bold;padding:6px;border-radius:6px;cursor:pointer;
}
.reiwa-comic3-root .rc3-load-more-btn:disabled{opacity:.4;cursor:not-allowed;}

/* ---------- 入力中インジケーター・保留バナー ---------- */
.reiwa-comic3-root .rc3-typing-row{font-size:11px;opacity:.7;min-height:14px;margin-top:4px;}
.reiwa-comic3-root .rc3-pending-banner{
  font-size:12px;background:var(--rc-yellow);border:2px solid var(--rc-ink);
  border-radius:6px;padding:6px 10px;margin-top:6px;
}

/* ---------- 顔文字ピッカー ---------- */
/* 顔文字ボタン・戻るボタン・横スクロール一覧(.rc3-kaomoji-scroll/.rc3-kaomoji-item)の
   見た目は、いずれも「入力欄」セクションでコンポーザー本体とまとめて定義している
   (同じ1行の中で入れ替える構造のため)。 */

/* ---------- リアクション ---------- */
.reiwa-comic3-root .rc3-reactions-row{
  display:flex;flex-wrap:wrap;gap:4px;width:100%;margin-top:4px;
}
.reiwa-comic3-root .rc3-reaction-btn{
  border:1.5px solid var(--rc-ink);background:#fff;border-radius:12px;
  font-size:11px;padding:1px 8px;cursor:pointer;line-height:1.6;
}
.reiwa-comic3-root .rc3-reaction-btn.has-count{background:var(--rc-yellow);font-weight:bold;}

/* ---------- 通報・編集・削除ツール ---------- */
.reiwa-comic3-root .rc3-tools-row{
  display:flex;flex-wrap:wrap;gap:6px;width:100%;margin-top:4px;
}
.reiwa-comic3-root .rc3-tool-btn{
  border:none;background:none;color:var(--rc-ink);opacity:.6;
  font-size:10.5px;cursor:pointer;padding:2px 4px;text-decoration:underline;
}
.reiwa-comic3-root .rc3-tool-btn:hover{opacity:1;}
.reiwa-comic3-root .rc3-report-form{
  display:flex;flex-wrap:wrap;gap:4px;align-items:center;width:100%;margin-top:4px;
  background:#fff8e6;border:1px dashed var(--rc-ink);border-radius:6px;padding:6px;
}
.reiwa-comic3-root .rc3-report-form select,
.reiwa-comic3-root .rc3-report-form input[type=text]{
  font-size:11px;padding:3px 6px;border:1px solid var(--rc-ink);border-radius:4px;
}
.reiwa-comic3-root .rc3-report-form button{
  font-size:11px;border:1px solid var(--rc-ink);border-radius:4px;background:#fff;
  padding:3px 8px;cursor:pointer;
}

.reiwa-comic3-root .rc3-edited-mark{font-size:9.5px;opacity:.5;flex-shrink:0;}
.reiwa-comic3-root .rc3-deleted-bubble{opacity:.55;font-style:italic;}
.reiwa-comic3-root .rc3-edit-input{
  flex:1;min-width:0;font-size:inherit;font-family:inherit;
  border:1px solid var(--rc-ink);border-radius:4px;padding:2px 4px;
}

/* ---------- カスタムアバター画像(SVGの代わりにアップロード画像を使う場合) ---------- */
.reiwa-comic3-root .rc3-avatar-img{
  width:100%;height:100%;object-fit:cover;border-radius:50%;
  border:2px solid var(--rc-ink);display:block;
}

/* ---------- 感情に応じたコマ演出(v3.2.0新設・管理画面でON/OFF可能) ---------- */
.reiwa-comic3-root .rc3-bubble.rc3-effect-angry{
  box-shadow:0 0 0 3px rgba(228,67,43,0.25);
}
.reiwa-comic3-root .rc3-bubble.rc3-effect-surprised{
  box-shadow:0 0 0 3px rgba(243,197,49,0.35);
}
.reiwa-comic3-root .rc3-panel:has(.rc3-effect-angry){
  background-image:repeating-conic-gradient(from 0deg, rgba(228,67,43,0.05) 0deg 4deg, transparent 4deg 12deg);
}

/* ---------- アクセシビリティ:キーボードフォーカスを見えるようにする ---------- */
.reiwa-comic3-root button:focus-visible,
.reiwa-comic3-root input:focus-visible,
.reiwa-comic3-root select:focus-visible{
  outline:3px solid #2271b1;outline-offset:1px;
}

@media (max-width: 640px){
  .reiwa-comic3-root .rc3-title-actions{order:3;width:100%;justify-content:flex-end;}
}