:root{
  /* ===== Z-INDEX TOKENS (single source of truth) ===== */
  --z-overlay: 9000;  /* 暗幕 layer */
  --z-sidebar: 9100;  /* サイドバー（モーダル本体） */
  --z-sticky:   500;  /* 章ヘッダー/タブ など */
  --z-menu:    1200;  /* 通常メニュー */
  --z-modal:   9200;  /* モーダル/ポップオーバー類（最前面） */
  --z-toast:  4000;

  --bg:#0b1020; --fg:#e8ecf1; --muted:#a8b0bb; --accent:#6633cc; --card:#141a33; --border:#27304d;
  --input-bg:#0f1530; --ghost-bg:#0f1530; --menu-bg:#0f1538; --toast-bg:#11193a; --dialog-bg:#0f1538;
  --floating-shadow:0 12px 28px rgba(0,0,0,.35);
  --overlay-shadow:0 10px 30px rgba(0,0,0,.4);
  --bg-overlay:rgba(11,16,32,.96);

  --header-height: 72px;
  --topbar-height: 0px;
  --chapter-header-height: 0px;
  --verse-head-height: 40px;

  /* 色バリエーション（weak / mid） */
  --bgY-weak: rgba(247,210,79, 0.18);
  --bgG-weak: rgba( 75,209,154,0.18);
  --bgP-weak: rgba(240,122,187,0.18);
  --bgB-weak: rgba(111,184,242,0.18);
  --bgO-weak: rgba(242,180,122,0.18);

  --bgY-mid:  rgba(247,210,79, 0.32);
  --bgG-mid:  rgba( 75,209,154,0.32);
  --bgP-mid:  rgba(240,122,187,0.32);
  --bgB-mid:  rgba(111,184,242,0.32);
  --bgO-mid:  rgba(242,180,122,0.32);
}
body.theme-dark{color-scheme:dark}
body.theme-light{
  color-scheme:light;
  --bg:#f5f7fb; --fg:#1f2436; --muted:#657089; --accent:#4b63d1; --card:#ffffff; --border:#d5d9e6;
  --input-bg:#f7f9ff; --ghost-bg:#eef1f8; --menu-bg:#ffffff; --toast-bg:#ffffff; --dialog-bg:#ffffff;
  --floating-shadow:0 12px 28px rgba(31,37,56,.12);
  --overlay-shadow:0 10px 30px rgba(31,37,56,.16);
  --bg-overlay:rgba(245,247,251,.96);
}
*{box-sizing:border-box}
body{margin:0;font-family:ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial;background:var(--bg);color:var(--fg)}
header{display:flex;align-items:center;gap:16px;justify-content:space-between;flex-wrap:wrap;padding:14px 16px;border-bottom:1px solid var(--border);position:sticky;top:0;background:linear-gradient(180deg,var(--bg),var(--bg-overlay));z-index:var(--z-sticky)}
#appHeader .header-left,#appHeader .header-right{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
#appHeader .header-left{flex:1 1 auto;min-width:0}
#appHeader .header-right{margin-left:auto;justify-content:flex-end;flex:1 1 auto;min-width:0}
#appHeader .header-right > *{flex:0 0 auto}
#appHeader .header-right #searchForm{flex:1 1 240px}
.reference-selects{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.reference-selects select{min-width:116px}
#selectChapter,#selectVerse{min-width:88px}
#searchForm{display:flex;align-items:center;gap:.5rem;flex:1 1 240px;min-width:200px}
#searchQuery{flex:1 1 auto;min-width:160px}
#booksHint{margin:0;color:var(--muted);min-height:1em}
#topBar{position:sticky;top:var(--header-height);z-index:var(--z-sticky);background:linear-gradient(180deg,var(--bg),var(--bg-overlay));border-bottom:1px solid var(--border);padding:12px 16px;display:flex;flex-direction:column;gap:12px}
.theme-light #topBar{border-bottom-color:rgba(0,0,0,.08);box-shadow:0 1px 0 rgba(0,0,0,.04)}
#titleLine{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px}
#titleText{font-size:20px;font-weight:700;line-height:1.3}
.brand{display:flex;align-items:center;gap:12px}
.logo{font-size:24px;margin:0;font-weight:700;letter-spacing:.6px}
.logo-link{color:inherit;text-decoration:none;display:inline-flex;align-items:center;line-height:1}
.logo-link:focus-visible{outline:2px solid var(--accent);outline-offset:4px;border-radius:6px;padding:0 2px}
.chapter-header{position:sticky;top:calc(var(--header-height) + var(--topbar-height));z-index:var(--z-sticky);background:var(--card);box-shadow:0 1px 0 rgba(0,0,0,.3);padding:8px 0;margin-bottom:12px}
.theme-light .chapter-header{box-shadow:0 1px 0 rgba(0,0,0,.08)}
.chapter-title{font-weight:700;font-size:1rem;padding:0 8px 6px}
.chapter-toolbar{display:flex;flex-wrap:wrap;gap:.5rem .75rem;align-items:center;padding:0 8px .5rem;border-top:1px solid rgba(0,0,0,.2);border-bottom:1px solid rgba(0,0,0,.2);background:var(--ghost-bg)}
.theme-light .chapter-toolbar{border-color:rgba(0,0,0,.06)}

.tag-chip{display:inline-flex;align-items:center;gap:6px;padding:.25rem .6rem;border-radius:9999px;border:1px solid rgba(0,0,0,.28);font-size:.85rem;line-height:1.1;user-select:none;white-space:nowrap;background:var(--card)}
.theme-light .tag-chip{border-color:rgba(0,0,0,.12)}
.tag-chip[data-variant="primary"]{border-color:rgba(59,130,246,.35)}
.tag-chip[data-variant="warn"]{border-color:rgba(245,158,11,.35)}
.row{display:flex;gap:12px;flex-wrap:wrap;align-items:center}
.ref-meta{align-items:center;justify-content:space-between}
.ref-info{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap}
.plan-hint{white-space:nowrap}
.card{background:var(--card);border:1px solid var(--border);border-radius:12px;padding:12px}
input,select,button{font-size:14px;border-radius:10px;border:1px solid var(--border);background:var(--input-bg);color:var(--fg);padding:8px 10px;outline:none}
button{background:var(--accent);border:0;color:white;cursor:pointer}
button.ghost{background:var(--ghost-bg);border:1px solid var(--border);color:var(--fg)}
button.small{padding:6px 10px;font-size:13px}
button:disabled{opacity:.5;cursor:not-allowed}

/* === AIみこと：暗幕＋ボトムシート（親の is-open だけで制御） === */
#modalBackdrop-aiWord {
  position: fixed; inset: 0;
  display: none;
  background: rgba(0,0,0,.45);
  z-index: 9400;
}
#modalBackdrop-aiWord.is-open { display: block; }

#modalBackdrop-aiWord .bottom-sheet{
  position: fixed; left: 0; right: 0; bottom: 0;
  transform: translateY(100%);
  transition: transform .28s ease-out;
  max-height: 85vh; min-height: clamp(360px, 70vh, 720px);
  overflow: hidden;
  border-radius: 16px 16px 0 0;
  background: transparent;
  color: inherit;
  box-shadow: none;
  display: flex; justify-content: center; align-items: stretch; padding: 16px;
}
/* 親が is-open のときだけ上がる —— 子に is-open は付けない */
#modalBackdrop-aiWord.is-open .bottom-sheet { transform: translateY(0); }

/* 中央1カラム＆透け防止 */
#aiWordPanelMount > #mikoto-panel,
#aiWordPanelMount > .mikoto-chat-root,
#aiWordPanelMount > [data-mikoto-root]{ width: min(720px, 96vw); margin: 0 auto; }

/* 背景スクロール抑止 */
body.no-scroll { overflow: hidden; }

#modalBackdrop-aiWord .close-btn{
  position:absolute;right:12px;top:12px;
  cursor:pointer;
  background:transparent;
  border:none;
  font-size:20px;
  line-height:1;
  color:inherit;
}
#modalBackdrop-aiWord .close-btn:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:999px}
#aiWordPanel{padding:48px 16px 16px}
#aiWordPanel .mikoto-panel{
  position:static;
  right:auto;left:auto;bottom:auto;
  width:100%;
  max-width:none;
  max-height:none;
  border-radius:0;
  background:transparent;
  box-shadow:none;
  color:inherit;
  opacity:1;
  visibility:visible;
  pointer-events:auto;
  transform:none;
  transition:none;
}
#aiWordPanel .mikoto-messages{max-height:none}

/* バーガー初期スタイル（ベース）。最終の EOF で上書き保証 */
button.burger{
  display:flex;align-items:center;gap:8px;background:var(--ghost-bg);border:1px solid var(--border);color:var(--fg);
  border-radius:999px;padding:8px 14px;font-weight:600;position:fixed;left:16px;bottom:16px;z-index:var(--z-menu);box-shadow:var(--floating-shadow)
}

.ref-inline{border:0;background:transparent;color:#2563eb;text-decoration:underline;cursor:pointer;padding:0;font:inherit}
.ref-inline:hover{opacity:.8}
.burger-icon{font-size:18px;line-height:1}
.burger-label{line-height:1}
main{padding:16px}
main#app-main{display:grid;grid-template-columns: 1fr;gap:16px}
.layout{display:grid;grid-template-columns: 1fr;gap:16px}
.layout > .reader-main,.layout > .sidebar{grid-column:1;grid-row:1}

/* 本文は動かさない（保険で強制） */
.reader-area{min-width:0;width:100%;max-width:100%;transform:none !important}

/* サイドバー＝モーダル本体（固定配置・画面外→内へ） */
.sidebar{
  position:fixed;
  top:calc(var(--header-height, 72px) + var(--topbar-height, 0px));
  left:0;
  bottom:0;
  width:clamp(280px, 88vw, 420px);
  max-height:calc(100vh - (var(--header-height, 72px) + var(--topbar-height, 0px)));
  overflow:auto;
  -webkit-overflow-scrolling:touch;

  display:flex;
  flex-direction:column;
  gap:12px;
  padding:16px;

  background:var(--menu-bg);
  color:var(--fg);
  border:1px solid var(--border);
  border-left:none;
  box-shadow:var(--floating-shadow);
  z-index:var(--z-sidebar);

  transform:translateX(-100%);
  opacity:0;
  visibility:hidden;
  pointer-events:none;

  transition:transform .24s ease, opacity .24s ease, visibility 0s linear .24s;
  will-change: transform;
}

body.sidebar-open .sidebar{
  transform:translateX(0);
  opacity:1;
  visibility:visible;
  pointer-events:auto;
  transition:transform .24s ease, opacity .24s ease;
}

/* 暗幕（本文の上、サイドバーの下） */
.sidebar-dim{
  position:fixed; inset:0;
  background:rgba(0,6,20,.46);
  z-index:var(--z-overlay);
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transition:opacity .22s ease;
}
body.sidebar-open .sidebar-dim{ opacity:1; visibility:visible; pointer-events:auto; }

/* iOSセーフエリア配慮（ノッチ端末） */
@supports (padding-left: env(safe-area-inset-left)){
  .sidebar{ padding-left:calc(16px + max(0px, env(safe-area-inset-left))); }
}

/* 低モーション環境の配慮 */
@media (prefers-reduced-motion: reduce){
  .sidebar, .sidebar-dim{ transition:none !important; }
}

.status{font-size:12px;color:var(--muted)}
.pill{display:inline-flex;align-items:center;padding:4px 8px;border-radius:999px;border:1px solid var(--border);gap:6px}

/* ===== Auth/Admin/Reader（元のまま） ===== */
.auth-card{display:flex;flex-direction:column;gap:10px}
.auth-status{display:flex;justify-content:space-between;align-items:center;gap:8px;flex-wrap:wrap}
.auth-fields{display:flex;flex-direction:column;gap:8px}
.auth-actions{display:flex;flex-wrap:wrap;gap:8px}
.auth-actions button{flex:1 1 120px}
.auth-secondary{display:flex;flex-wrap:wrap;gap:8px;margin-top:4px}
.auth-secondary button{flex:1 1 140px}

.cols{display:grid;gap:12px;grid-template-columns: 60px 1fr 1fr 1fr 1fr 1fr}
.verses-grid{display:flex;flex-direction:column;gap:12px}
.verse-head{position:sticky;top:calc(var(--header-height) + var(--topbar-height) + var(--chapter-header-height));z-index:var(--z-sticky);background:var(--card);padding:8px 0;border-top:1px solid var(--border);border-bottom:1px solid var(--border);box-shadow:none}
.verse-head .verse-head-cell{font-weight:700;display:flex;align-items:center;white-space:nowrap}
.verse-head .verse-head-cell:first-child{justify-content:center}
.verse-body .markable{scroll-margin-top:calc(var(--header-height) + var(--topbar-height) + var(--chapter-header-height) + var(--verse-head-height) + 16px)}
.verse{white-space:pre-wrap;line-height:1.6}
.muted{color:var(--muted)}
.hr{height:1px;background:var(--border);margin:8px 0}

/* ---------- Admin dashboard ---------- */
.admin-body{
  --bg:#080b16; --fg:#f5f6ff; --muted:#8a92ac; --border:#1d233a; --card:#101528; --accent:#5360ff;
  font-family:ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial;
  background:var(--bg); color:var(--fg); margin:0; min-height:100vh;
}
.admin-header{display:flex;justify-content:space-between;align-items:center;padding:20px 28px;border-bottom:1px solid var(--border);background:rgba(12,17,32,.92);backdrop-filter:blur(8px)}
.admin-header h1{margin:0;font-size:22px}
.admin-status{margin-top:6px;font-size:13px;color:var(--muted)}
.admin-status[data-type="success"]{color:#4ad6a6}
.admin-status[data-type="error"]{color:#ff7a8a}
.admin-status[data-type="warning"]{color:#f6c860}
.admin-main{display:flex;flex-direction:column;gap:18px;padding:24px;max-width:1200px;margin:0 auto}
.admin-user{display:flex;align-items:center;gap:12px}
.admin-user-email{font-size:13px;color:var(--muted)}
.admin-card{background:var(--card);border:1px solid var(--border);border-radius:12px;padding:18px;display:flex;flex-direction:column;gap:14px;box-shadow:0 10px 30px rgba(0,0,0,.28)}
.admin-form{display:flex;flex-direction:column;gap:12px}
.admin-form label{display:flex;flex-direction:column;gap:6px;font-size:14px}
.admin-form input{padding:10px;border-radius:10px;border:1px solid var(--border);background:#0d1326;color:var(--fg)}
.admin-actions{display:flex;gap:12px;flex-wrap:wrap}
.admin-actions button{flex:0 0 auto}
.admin-tabs{display:flex;gap:10px;flex-wrap:wrap}
.admin-tab-btn{padding:10px 14px;border-radius:999px;border:1px solid var(--border);background:#0f162b;color:var(--fg);cursor:pointer;font-size:14px}
.admin-tab-btn.active{background:var(--accent);border-color:var(--accent);color:#fff}
.admin-tab{display:none}
.admin-tab.active{display:block}
.catalog-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px}
.catalog-item{background:#0f1528;border:1px solid var(--border);border-radius:10px;padding:16px;display:flex;flex-direction:column;gap:10px}
.catalog-item label{display:flex;flex-direction:column;gap:6px;font-size:13px}
.catalog-item textarea,.catalog-item input{width:100%;padding:8px;border-radius:8px;border:1px solid var(--border);background:#0c1223;color:var(--fg)}
.catalog-header{display:flex;justify-content:space-between;align-items:center}
.catalog-row{display:flex;gap:10px;flex-wrap:wrap}
.admin-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;align-items:start}
.admin-grid textarea{width:100%;border-radius:10px;border:1px solid var(--border);background:#0c1223;color:var(--fg);padding:10px;font-family:"JetBrains Mono",ui-monospace,Menlo,monospace}
.admin-table{width:100%;border-collapse:collapse;font-size:13px}
.admin-table th,.admin-table td{border:1px solid var(--border);padding:8px;text-align:left;vertical-align:top}
.admin-table pre{margin:0;font-family:"JetBrains Mono",ui-monospace,Menlo,monospace;font-size:12px;white-space:pre-wrap;word-break:break-word}
.monospace{font-family:"JetBrains Mono",ui-monospace,Menlo,monospace;font-size:13px}
.monospace.block{background:#0b1121;border:1px solid var(--border);border-radius:8px;padding:12px;max-height:420px;overflow:auto}
.diff-list{list-style:disc;padding-left:20px;max-height:200px;overflow:auto;font-size:12px;line-height:1.4}
.preview-controls{display:flex;gap:10px;align-items:center}
.preview-controls input{flex:1;border-radius:8px;border:1px solid var(--border);background:#0c1223;color:var(--fg);padding:8px}
.translation-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px}
.translation-item{background:#0f1528;border:1px solid var(--border);border-radius:10px;padding:12px;display:flex;flex-direction:column;gap:8px}
.translation-item input{padding:8px;border-radius:8px;border:1px solid var(--border);background:#0c1223;color:var(--fg)}
.override-controls{display:flex;gap:10px;align-items:center}
.override-controls input{flex:1;border-radius:8px;border:1px solid var(--border);background:#0c1223;color:var(--fg);padding:8px}
.override-controls button{flex:0 0 auto}
.override-preview pre{background:#0b1121}
.admin-flex{display:flex;justify-content:space-between;align-items:flex-end;gap:12px;flex-wrap:wrap}
.admin-card select{border-radius:8px;border:1px solid var(--border);background:#0c1223;color:var(--fg);padding:8px}
.admin-card button.primary{background:var(--accent);color:#fff;border:0}

@media (max-width: 1024px){
  .admin-grid{grid-template-columns:1fr;}
}
.toast{position:fixed;right:12px;bottom:12px;background:var(--toast-bg);border:1px solid var(--border);color:var(--fg);padding:10px 12px;border-radius:10px;box-shadow:var(--overlay-shadow);max-width:60ch}

/* マーカー：番号セルは“mid”、本文セルは“weak”で統一 */
.markable{position:relative}
.verse-num{position:relative}
.verse-num.row-yellow{ background: var(--bgY-mid); }
.verse-num.row-green { background: var(--bgG-mid); }
.verse-num.row-pink  { background: var(--bgP-mid); }
.verse-num.row-blue  { background: var(--bgB-mid); }
.verse-num.row-orange{ background: var(--bgO-mid); }
.verse.row-yellow{ background: var(--bgY-weak); }
.verse.row-green { background: var(--bgG-weak); }
.verse.row-pink  { background: var(--bgP-weak); }
.verse.row-blue  { background: var(--bgB-weak); }
.verse.row-orange{ background: var(--bgO-weak); }
.v-highlight{outline:3px solid rgba(255,200,0,.9);outline-offset:2px;transition:outline-color .4s ease;}
.bible-verse.flash-target,
.verse.flash-target,
.bible-verse.v-highlight,
.verse.v-highlight{animation:verseFlash 2s ease-out 1;box-shadow:0 0 0 3px rgba(255,165,0,.85);background:rgba(255,235,59,.25)}
@keyframes verseFlash{
  0%{box-shadow:0 0 0 3px rgba(255,165,0,.85);background:rgba(255,235,59,.25);}
  100%{box-shadow:0 0 0 0 rgba(255,165,0,0);background:transparent;}
}

/* hover */
.markable:hover { outline: 1px dashed #445; outline-offset: 2px; }

/* アクションメニュー */
.action-menu{
  position:fixed; z-index:50; background:var(--menu-bg); border:1px solid var(--border); padding:8px;
  border-radius:10px; min-width:240px; box-shadow:var(--overlay-shadow)
}
.colors{gap:8px;flex-wrap:wrap}
.swatch{width:28px;height:28px;border-radius:6px;border:1px solid var(--border);cursor:pointer;display:inline-block}
.swatch.yellow{background:#f7d24f}
.swatch.green {background:#4bd19a}
.swatch.pink  {background:#f07abb}
.swatch.blue  {background:#6fb8f2}
.swatch.orange{background:#f2b47a}
.swatch.clear{
  background: repeating-linear-gradient(45deg,#233,#233 6px,#1a223f 6px,#1a223f 12px);
  position:relative;
}
.swatch.clear::after{
  content:"×"; position:absolute; inset:0; display:grid; place-items:center; font-weight:700;
  color:#d4d8e1; font-size:16px;
}

/* 伝説（ラベル） */
.legend{display:flex;gap:.5rem .75rem;flex-wrap:wrap;align-items:center}
.legend .item{display:inline-flex;align-items:center;gap:6px}
.legend .item.tag-chip{background:var(--card)}
.legend .dot{width:10px;height:10px;border-radius:50%}
.legend .yellow{background:#f7d24f}
.legend .green {background:#4bd19a}
.legend .pink  {background:#f07abb}
.legend .blue  {background:#6fb8f2}
.legend .orange{background:#f2b47a}

/* モーダル */
dialog::backdrop{background:rgba(0,0,0,.5)}
dialog{border:1px solid var(--border);border-radius:12px;background:var(--dialog-bg);color:var(--fg)}
.settings h3{margin:0 0 8px 0}
.settings .row{align-items:center}
.auth-form{display:flex;flex-direction:column;gap:12px;min-width:280px}
.auth-form h3{margin:0}
.auth-form .field{display:flex;flex-direction:column;gap:4px;font-size:13px}
.auth-form .field input{width:100%}
.auth-form .actions{justify-content:flex-end}

/* 訳の並び替えUI */
.version-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.version-item{display:flex;align-items:center;gap:10px;border:1px solid var(--border);border-radius:10px;padding:8px;background:var(--ghost-bg)}
.version-item .handle{cursor:grab;font-weight:700}
.version-item input[type="checkbox"]{transform:translateY(1px)}

/* 検索ハイライト */
mark{background:#ffd54a;color:#000;padding:0 .1em;border-radius:2px}

/* バーガー & モバイルサイドバー */
.close-row{display:none}

.theme-toggle{display:inline-flex;align-items:center;gap:12px;padding:6px 14px;border:1px solid var(--border);border-radius:999px;background:var(--ghost-bg)}
.theme-label{display:flex;align-items:center;gap:8px;margin:0;font-size:14px;font-weight:600}
.theme-label strong{font-size:14px;font-weight:700}
.mode-text{font-size:13px;color:var(--muted)}
.switch{position:relative;display:inline-block;width:48px;height:26px}
.switch input{opacity:0;width:0;height:0}
.slider{position:absolute;cursor:pointer;inset:0;background:var(--border);border-radius:999px;transition:.2s background}
.slider::before{content:"";position:absolute;height:20px;width:20px;left:3px;top:3px;background:var(--fg);border-radius:50%;transition:.2s transform, .2s background}
.switch input:checked + .slider{background:var(--accent)}
.switch input:checked + .slider::before{transform:translateX(22px);background:#fff}


.row-selects{gap:12px;align-items:flex-start}
.select-block{display:flex;flex-direction:column;gap:6px;flex:1;min-width:120px;font-size:13px}
.select-block span{font-weight:600}
.select-block select{width:100%}

@media (max-width: 900px){
  button.burger{padding:8px 12px;left:12px;bottom:12px}
  .close-row{display:flex;justify-content:flex-end;position:sticky;top:0;padding-bottom:8px;background:linear-gradient(180deg,var(--bg),var(--bg-overlay));z-index:1}
}

@media (max-width: 420px){
  .theme-toggle{width:100%;justify-content:space-between}
  .theme-label{font-size:13px}
  .theme-label strong{font-size:13px}
  .mode-text{font-size:12px}
}

/* ==========================
   みこと チャット UI
   ========================== */
.aiword-fab{
  position:fixed;
  right:20px;
  bottom:20px;
  width:56px;
  height:56px;
  border:1.5px solid rgba(0,0,0,.15);
  border-radius:50%;
  padding:0;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background:#fff;
  box-shadow:0 4px 12px rgba(0,0,0,.2);
  cursor:pointer;
  z-index:calc(var(--z-menu) + 2);
  transition:transform .18s ease, box-shadow .18s ease;
  overflow:hidden;
}
.aiword-fab img{
  width:100%;
  height:100%;
  object-fit:cover;
  border-radius:50%;
  display:block;
}
.aiword-fab:hover{
  transform:translateY(-1px);
  box-shadow:0 6px 18px rgba(0,0,0,.24);
}
.aiword-fab:focus,
.aiword-fab:focus-visible{
  outline:2px solid Highlight;
  outline-offset:2px;
}
.mikoto-launcher{
  background:linear-gradient(140deg,var(--accent),#8b5cf6);
  color:#fff;
}
.mikoto-launcher-fallback{
  display:none;
  width:100%;
  height:100%;
  border-radius:50%;
  align-items:center;
  justify-content:center;
  font-size:24px;
  font-weight:700;
  background:rgba(255,255,255,.18);
  color:#fff;
  pointer-events:none;
  user-select:none;
}
.mikoto-launcher.fallback .mikoto-launcher-fallback{display:inline-flex;}

.mikoto-panel{
  position:fixed;
  right:20px;
  bottom:100px;
  width:clamp(300px,32vw,420px);
  max-height:clamp(420px,70vh,640px);
  display:flex;
  flex-direction:column;
  border-radius:20px;
  background:rgba(247,248,255,.96);
  color:#151934;
  box-shadow:0 28px 66px rgba(15,20,45,.35);
  overflow:hidden;
  z-index:calc(var(--z-menu) + 3);
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transform:translateY(12px);
  transition:transform .24s ease, opacity .24s ease;
}

.mikoto-panel.is-open{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
  transform:translateY(0);
}

body.theme-dark .aiword-fab{
  border:1.5px solid rgba(255,255,255,.24);
  background:rgba(18,22,44,.92);
  box-shadow:0 4px 16px rgba(0,0,0,.4);
}
body.theme-dark .aiword-fab:hover{
  box-shadow:0 8px 22px rgba(0,0,0,.46);
}
body.theme-dark .mikoto-launcher{
  background:linear-gradient(140deg,#1e1f4a,#4b63ff);
}
body.theme-dark .mikoto-launcher-fallback{background:rgba(255,255,255,.14);}
body.theme-dark .mikoto-panel{
  background:rgba(16,20,42,.96);
  color:#e8ecf7;
  box-shadow:0 30px 80px rgba(2,4,16,.72);
}

@media (max-width: 720px){
  .aiword-fab{
    right:14px;
    bottom:16px;
    width:48px;
    height:48px;
  }
  .mikoto-panel{
    right:12px;
    left:12px;
    bottom:88px;
    width:auto;
    max-width:none;
  }
}

@media (max-width: 520px){
  .mikoto-panel{
    inset:auto 0 0 0;
    width:100%;
    border-radius:20px 20px 0 0;
    max-height:90vh;
    transform:translateY(24px);
  }
  .mikoto-panel.is-open{transform:translateY(0);}
}

.mikoto-header{
  display:flex;
  align-items:center;
  gap:10px;
  padding:14px 16px;
  background:rgba(236,238,255,.86);
  border-bottom:1px solid rgba(40,48,80,.08);
}
.mikoto-avatar{
  width:34px;
  height:34px;
  border-radius:50%;
}
.mikoto-avatar-fallback{
  display:none;
  width:34px;
  height:34px;
  border-radius:50%;
  align-items:center;
  justify-content:center;
  font-size:18px;
  font-weight:700;
  background:var(--accent);
  color:#fff;
  pointer-events:none;
  user-select:none;
}
.mikoto-header.fallback .mikoto-avatar-fallback{display:inline-flex;}
.mikoto-title{font-weight:600;font-size:14px;letter-spacing:.02em;}
.mikoto-close{
  margin-left:auto;
  border:none;
  background:transparent;
  color:inherit;
  font-size:22px;
  line-height:1;
  border-radius:6px;
  padding:2px 6px;
  cursor:pointer;
}
.mikoto-close:hover,.mikoto-close:focus-visible{background:rgba(20,24,56,.12);}

body.theme-dark .mikoto-header{background:rgba(24,30,64,.88);border-bottom:1px solid rgba(255,255,255,.08);}
body.theme-dark .mikoto-close:hover,
body.theme-dark .mikoto-close:focus-visible{background:rgba(232,236,255,.12);}
body.theme-dark .mikoto-header.fallback .mikoto-avatar-fallback{background:var(--accent);}

.mikoto-messages{
  flex:1;
  padding:16px;
  display:flex;
  flex-direction:column;
  gap:12px;
  overflow-y:auto;
  background:rgba(249,250,255,.74);
}
.mikoto-messages:focus-visible{outline:none;}
.mikoto-messages::-webkit-scrollbar{width:6px;}
.mikoto-messages::-webkit-scrollbar-thumb{background:rgba(92,104,160,.45);border-radius:999px;}
body.theme-dark .mikoto-messages{background:rgba(10,14,32,.82);}

.mikoto-bubble{
  max-width:80%;
  padding:12px 16px;
  border-radius:18px;
  font-size:14px;
  line-height:1.6;
  white-space:pre-wrap;
  word-break:break-word;
  position:relative;
  box-shadow:0 4px 14px rgba(18,22,40,.08);
}
.mikoto-bubble.user{
  margin-left:auto;
  background:linear-gradient(135deg,#e8f0ff,#f7faff);
  color:#111c3a;
  border-top-right-radius:6px;
}
.mikoto-bubble.bot{
  margin-right:auto;
  background:rgba(238,239,252,.92);
  color:#171c3a;
  display:flex;
  gap:10px;
  align-items:flex-start;
  border-top-left-radius:6px;
}
.mikoto-bubble .avatar{
  width:26px;
  height:26px;
  border-radius:50%;
  flex:0 0 auto;
  margin-top:2px;
}
.mikoto-bubble .bubble-body{flex:1;}

body.theme-dark .mikoto-bubble.user{
  background:linear-gradient(135deg,#223b7b,#1e2d66);
  color:#f2f4ff;
}
body.theme-dark .mikoto-bubble.bot{
  background:rgba(24,30,64,.88);
  color:#e5e9ff;
}

.mikoto-bubble.error{
  border:1px solid rgba(220,70,70,.38);
  background:rgba(255,235,238,.92);
  color:#631a20;
}
body.theme-dark .mikoto-bubble.error{
  background:rgba(86,24,30,.82);
  color:#ffd6d9;
  border-color:rgba(255,140,150,.42);
}

.mikoto-retry,
.mikoto-actions{
  margin-top:8px;
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  align-items:center;
  font-size:12px;
  color:#4a4c62;
}
.mikoto-error-text{line-height:1.5;}
.mikoto-retry span{line-height:1.4;}
.mikoto-retry button,
.mikoto-actions button{
  padding:6px 11px;
  font-size:12px;
  border-radius:8px;
  border:none;
  background:#3555ff;
  color:#fff;
  cursor:pointer;
}
.mikoto-retry button:disabled,
.mikoto-actions button:disabled{
  opacity:.55;
  cursor:not-allowed;
}
.mikoto-retry button:hover:not(:disabled),
.mikoto-retry button:focus-visible:not(:disabled),
.mikoto-actions button:hover:not(:disabled),
.mikoto-actions button:focus-visible:not(:disabled){filter:brightness(1.05);}
body.theme-dark .mikoto-retry,
body.theme-dark .mikoto-actions{color:#c7cbe8;}
body.theme-dark .mikoto-retry button,
body.theme-dark .mikoto-actions button{background:#4b63ff;}

.mikoto-countdown{font-weight:600;font-variant-numeric:tabular-nums;}
.mikoto-quota{
  padding:0 14px 14px;
  font-size:12px;
  line-height:1.55;
  color:#4a4f74;
  text-align:center;
}
body.theme-dark .mikoto-quota{color:#d1d6ff;}

.mikoto-form{
  display:grid;
  grid-template-columns:1fr auto;
  gap:10px;
  padding:14px;
  border-top:1px solid rgba(40,48,80,.08);
  background:rgba(240,241,255,.92);
}
.mikoto-form textarea{
  resize:none;
  width:100%;
  min-height:52px;
  max-height:140px;
  padding:10px 12px;
  border-radius:12px;
  border:1px solid rgba(40,48,80,.18);
  background:#fff;
  color:inherit;
  font-family:inherit;
  line-height:1.55;
}
.mikoto-form textarea:focus-visible{outline:2px solid var(--accent);outline-offset:2px;}
.mikoto-form button{
  padding:12px 18px;
  border-radius:12px;
  border:none;
  background:var(--accent);
  color:#fff;
  font-weight:600;
  cursor:pointer;
  align-self:flex-end;
  transition:transform .18s ease, filter .18s ease;
}
.mikoto-form button:disabled{opacity:.6;cursor:progress;}
.mikoto-form button:hover:not(:disabled),
.mikoto-form button:focus-visible:not(:disabled){transform:translateY(-1px);filter:brightness(1.05);}
body.theme-dark .mikoto-form{background:rgba(20,24,52,.9);border-top:1px solid rgba(255,255,255,.08);}
body.theme-dark .mikoto-form textarea{background:rgba(14,18,40,.86);border-color:rgba(255,255,255,.14);color:inherit;}

.mikoto-typing{font-style:italic;opacity:.78;}
.mikoto-typing .dots{display:inline-flex;gap:4px;margin-left:4px;}
.mikoto-typing .dots span{
  width:6px;
  height:6px;
  border-radius:50%;
  background:currentColor;
  opacity:.3;
  animation:mikotoDots 1.2s infinite ease-in-out;
}
.mikoto-typing .dots span:nth-child(2){animation-delay:.18s;}
.mikoto-typing .dots span:nth-child(3){animation-delay:.36s;}
@keyframes mikotoDots{0%,80%,100%{opacity:.2;transform:translateY(0);}40%{opacity:1;transform:translateY(-2px);}}

.mikoto-panel[hidden]{display:none;}


/* 既存の見出し・タブは z を抑える（最前面にしない） */
.reader-tabs, .tab-bar, .chapter-header{
  position: sticky; z-index: var(--z-sticky) !important;
}

/* クリッピング回避（必要最小限） */
.chapter-header, .chapter-toolbar{ overflow: visible !important; }

/* === Dropdown / Menu（サイドバーより前面に） ====== */
.chapter-toolbar { position: relative; } /* メニューの基準 */
.chapter-toolbar .dropdown,
.chapter-toolbar .dropdown-menu,
.chapter-toolbar .menu,
.chapter-toolbar .menu-panel,
.chapter-toolbar .select-menu,
.chapter-toolbar .select-dropdown,
.chapter-toolbar .listbox,
.chapter-toolbar .autocomplete,
.chapter-toolbar .autocomplete-panel,
.chapter-toolbar .popover,
.chapter-toolbar .popper,
.chapter-toolbar .tippy-box{
  position: absolute !important;
  z-index: var(--z-modal) !important;  /* overlay(9000)/sidebar(9100) より上 */
}

/* ====== EOF 固定：サイドバー／ボタン挙動を保証 ====== */

/* ベース：左下固定。サイドバー(9100)と暗幕(9000)より常に上 */
button.burger{
  position: fixed !important;
  left: 16px !important;
  bottom: 16px !important;
  z-index: 9200 !important;                 /* ← 9100/9000 より前面 */
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  visibility: visible !important;
  pointer-events: auto !important;
}

/* 開いている間も“消さない”＋見た目を「閉じる」風に */
body.sidebar-open button.burger{
  display: inline-flex !important;
  background: var(--ghost-bg) !important;
  border: 1px solid var(--border) !important;
  color: var(--fg) !important;
}

/* ラベルを「閉じる」に見せる（JSの syncBurgerLabel と二重化しても OK・保険） */
body.sidebar-open button.burger .burger-label{
  position: relative !important;
  font-size: 0 !important; /* 元テキストは視覚的に隠す */
  line-height: 1 !important;
}
body.sidebar-open button.burger .burger-label::after{
  content: "閉じる";
  font-size: 14px;
  line-height: 1;
}
body.sidebar-open button.burger .burger-icon{
  display: none !important;

}

/* 念のため：スライドアウトも確実にアニメ（他のtransitionに勝つ） */
.sidebar{
  transition: transform .24s ease, opacity .24s ease, visibility 0s linear .24s !important;
}
body.sidebar-open .sidebar{
  transition: transform .24s ease, opacity .24s ease, visibility 0s linear 0s !important;
}

/* 暗幕の可視状態も明示（保険） */
.sidebar-dim{ visibility: hidden !important; }
body.sidebar-open .sidebar-dim{ visibility: visible !important; }

button.burger{
  position: fixed !important;
  left: 16px !important;
  bottom: 16px !important;
  z-index: 9300 !important; /* overlay(9000)/sidebar(9100) より上。9200でもOKだが余裕を持たせる */
  display: inline-flex !important;
  visibility: visible !important;
  pointer-events: auto !important;

}


/* AIみこと開時は、画面上の他チャットUIを隠す（必要最低限のグローバル抑止） */
.aiword-open .mikoto-floating-chat { display: none !important; }

/* ===========================================
 * AIみこと（ボトムシート）修正オーバーライド
 * - モーダル配下では固定配置/非表示を解除
 * - ボトムシートの前面化＆スライド強制
 * =========================================== */

/* ボトムシートが確実に前面に出る＆スムーズに動く */
#modalBackdrop-aiWord .bottom-sheet{
  z-index: var(--z-modal, 2147483646);
  will-change: transform;
}
#modalBackdrop-aiWord.is-open .bottom-sheet{
  transform: translateY(0) !important;
}

/* モーダル配下ではフローティング用の固定/非表示を全面解除 */
#modalBackdrop-aiWord .mikoto-panel,
#aiWordPanel .mikoto-panel,
#aiWordPanelMount .mikoto-panel{
  position: static !important;
  right: auto !important;
  left: auto !important;
  bottom: auto !important;
  width: 100%;
  max-width: none;
  max-height: none;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  color: inherit;
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
  transform: none !important;
}

/* 中央寄せ・幅調整（Mount直下） */
#aiWordPanelMount > #mikoto-panel,
#aiWordPanelMount > .mikoto-chat-root,
#aiWordPanelMount > [data-mikoto-root]{
  width: min(720px, 96vw);
  margin: 16px auto;
  max-height: 75vh;
}

/* モバイル時の見た目（必要に応じて） */
@media (max-width: 520px){
  #aiWordPanelMount > #mikoto-panel{
    width: 100%;
    max-height: 90vh;
    border-radius: 20px 20px 0 0;
  }
}
