:root{--k:230,103,32;--bg:#E66720;--ink:#fff}
body{height:100vh;display:grid;place-items:center;padding:8px}
#wrap{position:relative}
/* pack 欄(主筆 10-19: pp-bin pack-menu-kit 的列, 換成 sra 的黑透明 + 白字). 上 = pack, 下 = 這個 pack 的場 */
#packs{position:absolute;right:calc(100% + 2px);top:0;width:150px;max-height:min(448px,calc(100vh - 16px));overflow-y:auto;display:flex;flex-direction:column;gap:2px;scrollbar-width:thin}
#packList,#sceneList{background:rgba(0,0,0,.18);border:1px solid rgba(255,255,255,.18);padding:1px 2px}
.pk,.sc{display:grid;grid-template-columns:14px 1fr;column-gap:3px;padding:1px;border-bottom:1px solid rgba(255,255,255,.12);font-family:ui-monospace,"SF Mono",Menlo,monospace;font-size:10px;line-height:1.3;letter-spacing:.03em;cursor:pointer;user-select:none}
.pk:last-child,.sc:last-child{border-bottom:none}
.pk:hover,.sc:hover{background:rgba(255,255,255,.14)}
.pk.on,.sc.on{background:rgba(0,0,0,.30);box-shadow:inset 0 0 0 1px rgba(255,255,255,.35);text-shadow:0 0 8px rgba(255,255,255,.35)}
.grp{padding:3px 1px 1px;font-family:ui-monospace,"SF Mono",Menlo,monospace;font-size:10px;opacity:.55}
#packT{display:none}
@media (max-width:560px){
 #packs{display:none;left:0;right:0;top:22px;width:auto;z-index:6;background:rgba(230,103,32,.96)}
 #packs.open{display:flex}
 #packT{display:inline-block}
}
#win{width:min(368px,calc(100vw - 48px));height:min(448px,calc(100vh - 16px));display:flex;flex-direction:column;background:rgba(0,0,0,.18)}
#top{padding:2px 6px;background:rgba(255,255,255,.08);display:flex;gap:4px;align-items:center}
#title{margin-right:auto}
#log{flex:1;overflow-y:auto;padding:6px;display:flex;flex-direction:column;gap:5px;scrollbar-width:thin}
.npc{max-width:88%;opacity:.7}
.me{align-self:flex-end;text-align:right;max-width:88%;padding:0 1px}
.me:hover{background:rgba(255,255,255,.10)}
.me.hid .say{filter:blur(4px)}
/* hover 就翻開(主筆 10-20「不要做成點擊才取消模糊 用hover」) */
.me.hid:hover .say{filter:none}
.br{padding:0 2px}
.br:hover{background:rgba(255,255,255,.14)}
.br.on{background:rgba(255,255,255,.24);opacity:1}
/* claude 自作的場: 白藍字(主筆 2026-10-14) */
.me.cl{color:#cfdcff}
.sc.cl .nm{color:#cfdcff}
rt{font-size:7px;letter-spacing:-.5px;opacity:.75}
.term{cursor:pointer;opacity:1;padding:0 1px}
.term:hover{background:rgba(255,255,255,.10)}
.me.lv{align-self:stretch;text-align:left;max-width:none;cursor:default;padding-left:10px}
.phase{opacity:.55;padding-top:6px}
/* ★ 句法模組: ANSI 亮黃(主筆 2026-10-14) */
.hl{color:#ffff55}
/* 短句: hover 底色微透亮起, 點了念 */
.cl-on{cursor:pointer}
.cl-on:hover{background:rgba(255,255,255,.18)}
.cl-on:active{background:rgba(255,255,255,.26)}
/* 中文翻譯: 照 rel3 scrib(PD+FC/relive3/float/scrib.css) -- 原文下一行, 同字號; 對方 系統黃綠, 自己 亮一點的黃綠. 糊住時譯文不糊(看中文講日文) */
.zh{display:block;color:#ccf527}
.me .zh{color:#e4ff70}
.me.hid .zh{filter:none}
.npc{opacity:1}
/* 英文詞 hover: 下方小紅字顯示日本語(主筆 2026-10-14; 同日改: 更小 7px / 更貼 -3px / 偏白的亮紅 #ff9e9e, 純紅在橙底看不清) */
.en{position:relative}
.en .jp{display:none;position:absolute;left:0;top:calc(100% - 3px);z-index:5;font-size:7px;line-height:1;color:#ff9e9e;white-space:nowrap;pointer-events:none}
.en:hover .jp{display:block}
.me.hid .en .jp{filter:none}
/* ✗ 主筆不用的說法: 偏白的亮紅 + 刪除線(跟英文詞 hover 的小紅字同一顆, 橙底上看得清) */
.ng{color:#ff9e9e;text-decoration:line-through}