/* 自巢弹幕共享样式 v1（2026-08-15）：书/影/诗词/童蒙 统一 */
.chat-panel{flex-shrink:0;height:24vh;min-height:140px;display:flex;flex-direction:column;border-top:1px solid var(--border);background:rgba(10,14,39,.55)}
.chat-panel .danmaku-title{margin:8px 16px 2px}
.chat-panel .danmaku-box{flex:1;overflow-y:auto;padding:8px 16px 12px;min-height:0}
.chat-panel.collapsed{height:auto;min-height:0}
.chat-panel.collapsed .danmaku-box{display:none}
/* 全屏弹幕：定义在 collapsed 之后以覆盖；内容区隐藏、弹幕区占满整个视口（输入栏保留在底部） */
body.dm-fullscreen #header,body.dm-fullscreen nav,body.dm-fullscreen .intro-scroll{display:none}
body.dm-fullscreen .chat-panel{flex:1;height:auto;max-height:none;min-height:0}
.chat-panel.large .danmaku-box{display:flex}
#chatToggle{cursor:pointer;user-select:none;display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:8px}
.chat-btn{display:none;background:rgba(124,108,255,.18);border:1px solid rgba(124,108,255,.45);border-radius:20px;padding:7px 20px;font-size:13px;color:#fff;font-weight:700;box-shadow:0 2px 10px rgba(124,108,255,.25)}
.chat-panel.collapsed #chatToggle{justify-content:center;margin:5px 0}
.chat-panel.collapsed .chat-btn{display:inline-block}
.chat-panel.collapsed .chat-main{display:none}
.chat-arrow{display:inline-block;font-size:10px;color:var(--muted);transition:transform .2s;margin-right:2px}
.chat-panel.collapsed .chat-arrow{transform:rotate(-90deg)}
.dm-info{font-size:11px;color:var(--muted);display:inline-flex;align-items:center;gap:6px}
.online-now{color:#8B90B5}
.ephemeral{font-size:12px;color:#5a5f8a}
.dm-ops{display:inline-flex;align-items:center;gap:6px;margin-left:8px}
.now-figs{display:inline-flex;align-items:center;gap:1px;overflow-x:auto;scrollbar-width:none;max-width:34vw;flex-shrink:1}
.now-figs::-webkit-scrollbar{display:none}
.now-figs .now-fig{flex-shrink:0;width:21px;height:21px;display:flex;align-items:flex-end;justify-content:center;background:rgba(255,255,255,.05);border-radius:6px 6px 3px 3px;line-height:0;overflow:hidden}
.now-figs .now-fig svg{width:19px;height:19px;display:block}
.collapse-btn{background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.16);color:#C9C4FF;border-radius:9px;padding:2px 9px;font-size:11px;cursor:pointer;flex-shrink:0;line-height:1.5}
.collapse-btn:hover{background:rgba(124,108,255,.25);color:#fff}
.hall-toggle{margin-left:auto;font-size:11px;color:var(--muted);background:rgba(255,255,255,.06);border:1px solid var(--border);border-radius:8px;padding:4px 10px;cursor:pointer;font-weight:600}
.hall-toggle.on{color:#6BCB77;border-color:rgba(107,203,119,.4)}
.size-btn{font-size:11px;color:var(--muted);background:rgba(255,255,255,.06);border:1px solid var(--border);border-radius:8px;padding:4px 10px;cursor:pointer;font-weight:600}
#danmaku-layer{position:fixed;top:0;left:0;right:0;bottom:0;z-index:100;pointer-events:none;overflow:hidden}
.dm-scroll{position:absolute;white-space:nowrap;font-size:16px;font-weight:700;letter-spacing:1px;display:inline-flex;align-items:center;text-shadow:-1px -1px 0 rgba(0,0,0,.7),1px -1px 0 rgba(0,0,0,.7),-1px 1px 0 rgba(0,0,0,.7),1px 1px 0 rgba(0,0,0,.7);animation:dmScroll 4s linear forwards}
.dm-scroll .dm-av{display:inline-flex;flex-shrink:0;margin-right:7px;line-height:0}
.dm-scroll .dm-av svg{display:block}
@keyframes dmScroll{from{transform:translateX(100vw)}to{transform:translateX(-100%)}}
.danmaku-box{display:flex;flex-direction:column;gap:6px}
.danmaku-box span{display:inline-flex;align-items:center;gap:6px;align-self:flex-start;color:#E8EAFF;font-size:13px;animation:dmSwoop .7s cubic-bezier(.18,.65,.3,1);max-width:90%;word-break:break-word;line-height:1.5}
.danmaku-box span .bubble{background:rgba(124,108,255,.15);border:1px solid rgba(124,108,255,.25);border-radius:12px;padding:5px 12px;line-height:1.6;flex-shrink:1;min-width:0;word-break:break-word}
.danmaku-box span.mine .bubble{background:rgba(77,150,255,.2);border:1px solid rgba(77,150,255,.35)}
.danmaku-box span.mine{align-self:flex-end}
.danmaku-box .dm-av{display:inline-flex;flex-shrink:0}
.danmaku-box .dm-av svg{display:block}
@keyframes dmSwoop{from{opacity:0;transform:translateX(34vw)}to{opacity:1;transform:translateX(0)}}
#input-bar{flex-shrink:0;background:rgba(10,14,39,.92);backdrop-filter:blur(20px);padding:10px 16px calc(8px + env(safe-area-inset-bottom));border-top:1px solid var(--border)}
html.pwa #input-bar{padding-bottom:calc(24px + env(safe-area-inset-bottom))}
#input-bar .row{display:flex;gap:8px;align-items:center}
#input-bar .row input{flex:1;background:rgba(255,255,255,.07);border:1px solid var(--border);border-radius:24px;padding:11px 18px;font-size:15px;outline:none;min-width:0;color:var(--text)}
#input-bar .row input:focus{border-color:rgba(124,108,255,.6)}
#input-bar .row button{background:linear-gradient(135deg,#7C6CFF,#4D96FF);border:none;color:#fff;border-radius:24px;padding:11px 22px;font-size:14px;font-weight:800;cursor:pointer;flex-shrink:0}
#input-bar .status{font-size:10px;color:#5a5f8a;text-align:right;margin-top:3px}
/* 底部在线头像排（展馆式输入栏 status 区内） */
.online-row{display:flex;align-items:center;gap:2px;overflow-x:auto;margin:0;flex-shrink:1;min-width:0;max-width:80%;scrollbar-width:none}
.online-row::-webkit-scrollbar{display:none}
.online-row .online-av{flex-shrink:0;line-height:0;display:inline-flex}
.online-row .online-av svg{width:20px;height:20px;display:block}
.toast{position:fixed;left:50%;top:14%;transform:translateX(-50%);z-index:900;display:none;background:linear-gradient(135deg,rgba(124,108,255,.95),rgba(77,150,255,.9));color:#fff;padding:12px 24px;border-radius:16px;font-size:13px;font-weight:700;box-shadow:0 12px 40px rgba(0,0,0,.45);letter-spacing:.5px;max-width:84vw;text-align:center}
