/* ============================================
   LIVE STREAMING MODULE STYLES - V2
   黑白灰主色调，无渐变，SVG图标适配
   ============================================ */

/* ===== SVG图标通用 ===== */
.live-svg-icon { display:inline-flex; align-items:center; justify-content:center; vertical-align:middle; }
.live-svg-icon svg { width:100%; height:100%; }

/* ===== 直播广场 ===== */
#layer-live .nav-bar { background:#111 !important; border-bottom:1px solid #222 !important; backdrop-filter:none !important; -webkit-backdrop-filter:none !important; }
#layer-live .nav-bar .nav-title { color:#f0f0f0 !important; }
#layer-live .nav-bar .nav-icon { color:#f0f0f0 !important; }
#layer-live .nav-bar button.nav-icon { display:flex; align-items:center; justify-content:center; box-sizing:border-box; border:0; background:transparent; font:inherit; }

#live-plaza-scroll { background:#111 !important; padding:0 8px 80px; }
#live-plaza-scroll.is-loading::after { content:'正在刷新直播…'; position:fixed; left:50%; top:110px; transform:translateX(-50%); z-index:15; padding:8px 13px; border-radius:16px; background:rgba(35,35,35,.95); color:#ccc; font-size:12px; box-shadow:0 6px 24px rgba(0,0,0,.3); }

.live-plaza-tabs { display:flex; padding:10px 8px 6px; gap:12px; position:sticky; top:0; z-index:3; background:#111; align-items:center; }
.live-plaza-tab { min-height:40px; color:#888; font-size:14px; padding:6px 12px; cursor:pointer; border:0; border-radius:16px; background:transparent; transition:all 0.2s; display:flex; align-items:center; gap:4px; }
.live-plaza-tab.active { color:#f0f0f0; background:rgba(255,255,255,0.08); font-weight:600; }
.live-plaza-tab svg { width:10px; height:10px; }

.live-tabs { display:flex; padding:10px 8px 6px; gap:12px; position:sticky; top:44px; z-index:2; background:#111; overflow-x:auto; flex-wrap:nowrap; -webkit-overflow-scrolling:touch; scrollbar-width:none; }
.live-tabs::-webkit-scrollbar { display:none; }
.live-tab { min-height:44px; color:#888; font:inherit; font-size:14px; padding:4px 2px; border:0; background:transparent; cursor:pointer; position:relative; white-space:nowrap; flex-shrink:0; }
.live-tab.active { color:#f0f0f0; font-weight:600; }
.live-tab.active::after { content:''; position:absolute; bottom:-2px; left:50%; transform:translateX(-50%); width:20px; height:3px; background:#ff4d6a; border-radius:2px; }

.live-search-bar { display:none; padding:8px 8px 4px; background:#111; }
.live-search-bar.show { display:block; }
.live-search-bar input { width:100%; padding:10px 14px; border-radius:20px; border:none; background:#1e1e1e; color:#f0f0f0; font-size:14px; box-sizing:border-box; outline:none; }
.live-search-bar input::placeholder { color:#555; }
.live-plaza-actions { display:grid; grid-template-columns:1fr 1fr; gap:8px; margin:8px 0; }
.live-plaza-actions button { min-height:40px; border:1px solid #2d2d2d; border-radius:12px; background:#1c1c1c; color:#bbb; font-size:12px; }
.live-plaza-actions button:last-child { color:#c4a7ff; }
.live-plaza-actions svg { width:13px; height:13px; vertical-align:-2px; }

.live-grid { display:grid; grid-template-columns:1fr 1fr; gap:8px; padding:8px 0; }

.live-card { position:relative; border-radius:10px; overflow:hidden; cursor:pointer; aspect-ratio:3/4; background:#1e1e1e; }
.live-card:active { opacity:0.9; transform:scale(0.98); }
/* 卡片删除按钮（删除主播 / 删除直播间） */
.live-card-del { position:absolute; bottom:8px; right:8px; width:24px; height:24px; line-height:22px; text-align:center; border-radius:50%; background:rgba(0,0,0,0.45); color:rgba(255,255,255,0.92); font-size:13px; z-index:3; border:1px solid rgba(255,255,255,0.25); cursor:pointer; -webkit-backdrop-filter:blur(2px); backdrop-filter:blur(2px); transition:background .15s, transform .1s; }
.live-card-del:active { background:rgba(255,77,106,0.92); transform:scale(0.88); }

/* 内置直播指南 */
.live-guide-overlay { position:fixed; inset:0; z-index:10060; background:rgba(0,0,0,.72); display:flex; align-items:center; justify-content:center; padding:22px; box-sizing:border-box; backdrop-filter:blur(6px); }
.live-confirm-overlay { z-index:10065; }
.live-guide-card { position:relative; width:min(390px,100%); min-height:330px; max-height:calc(100vh - 44px); overflow-y:auto; box-sizing:border-box; border-radius:24px; padding:32px 24px 22px; background:#191919; color:#f5f5f5; border:1px solid rgba(255,255,255,.1); box-shadow:0 24px 70px rgba(0,0,0,.5); display:flex; flex-direction:column; justify-content:center; }
.live-guide-close { position:absolute; right:14px; top:12px; width:44px; height:44px; border:0; border-radius:50%; background:rgba(255,255,255,.07); color:#aaa; font-size:24px; cursor:pointer; }
.live-guide-kicker { color:#ff6b82; font-size:12px; font-weight:700; letter-spacing:.04em; margin-bottom:14px; }
.live-guide-card h2 { margin:0 0 14px; font-size:23px; line-height:1.3; }
.live-guide-card p { margin:0; color:#bbb; font-size:15px; line-height:1.8; min-height:108px; }
.live-guide-tip { margin-top:12px; padding:10px 12px; border-radius:12px; color:#ffd6dd; background:rgba(255,77,106,.12); font-size:13px; }
.live-guide-preview { position:relative; min-height:72px; margin-top:14px; padding:12px; box-sizing:border-box; overflow:hidden; border:1px solid rgba(255,255,255,.09); border-radius:14px; background:#222; color:#aaa; font-size:11px; }
.live-guide-preview-welcome,.live-guide-preview-growth,.live-guide-preview-stream { height:100%; display:flex; align-items:center; justify-content:center; gap:8px; flex-wrap:wrap; }
.live-guide-preview-welcome b { padding:7px 10px; border-radius:9px; background:#ff4d6a; color:#fff; letter-spacing:.12em; }
.live-guide-preview-tabs,.live-guide-preview-cats,.live-guide-preview-toolbar,.live-guide-preview-room { display:flex; min-height:46px; align-items:center; gap:7px; }
.live-guide-preview-tabs span,.live-guide-preview-tabs b,.live-guide-preview-cats span,.live-guide-preview-cats b { padding:6px 9px; border-radius:12px; font-style:normal; white-space:nowrap; }
.live-guide-preview-tabs b,.live-guide-preview-cats b { background:rgba(255,255,255,.09); color:#fff; }
.live-guide-preview-tabs i { padding:5px 7px; border:1px solid #3d3d3d; border-radius:8px; font-style:normal; }
.live-guide-preview-tabs em { margin-left:auto; color:#ff7186; font-style:normal; }
.live-guide-preview-cats { overflow:hidden; }
.live-guide-preview-cards { position:absolute; right:12px; bottom:7px; display:flex; gap:5px; opacity:.45; }
.live-guide-preview-cards i { width:26px; height:31px; border-radius:5px; background:linear-gradient(145deg,#555,#333); }
.live-guide-preview-room i { display:grid; width:34px; height:34px; place-items:center; border-radius:50%; background:#444; color:#fff; font-style:normal; }
.live-guide-preview-room span { display:flex; flex:1; flex-direction:column; }.live-guide-preview-room small { margin-top:2px; color:#777; }
.live-guide-preview-room em { padding:5px 8px; border-radius:11px; background:#333; font-style:normal; }.live-guide-preview-room strong { display:grid; width:28px; height:28px; place-items:center; border-radius:50%; background:#333; color:#fff; }
.live-guide-preview-toolbar span { flex:1; padding:8px; border-radius:12px; background:#303030; color:#777; }.live-guide-preview-toolbar b,.live-guide-preview-toolbar i,.live-guide-preview-toolbar em { padding:8px; border-radius:10px; background:#333; color:#ddd; font-style:normal; white-space:nowrap; }.live-guide-preview-toolbar em { color:#ff8ca0; }
.live-guide-preview-toolbar u { position:absolute; right:7px; width:38px; height:38px; border:2px solid #ff7186; border-radius:50%; text-decoration:none; animation:liveGuidePulse 1.4s ease-in-out infinite; }
.live-guide-preview-growth span,.live-guide-preview-growth b,.live-guide-preview-growth i,.live-guide-preview-stream span,.live-guide-preview-stream b { padding:8px 10px; border-radius:10px; background:#303030; color:#bbb; font-style:normal; }.live-guide-preview-growth b,.live-guide-preview-stream b { background:rgba(255,77,106,.15); color:#ff9aac; }
@keyframes liveGuidePulse { 0%,100%{transform:scale(.82);opacity:.35} 50%{transform:scale(1.08);opacity:1} }
html.live-a11y-reduce-motion .live-guide-preview-toolbar u { animation:none; }
.live-guide-dots { display:flex; justify-content:center; gap:6px; margin:20px 0 16px; }
.live-guide-dots i { width:6px; height:6px; border-radius:6px; background:#444; transition:.2s; }
.live-guide-dots i.active { width:20px; background:#ff4d6a; }
.live-guide-actions { display:flex; gap:10px; }
.live-guide-actions button { flex:1; min-height:44px; border:0; border-radius:14px; background:#2b2b2b; color:#ccc; font-size:14px; cursor:pointer; }
.live-guide-actions button.primary { background:#ff4d6a; color:#fff; font-weight:700; }
.live-task-card { margin:10px 0 4px; border:1px solid rgba(255,255,255,.08); border-radius:14px; background:#191919; overflow:hidden; }
.live-task-head { display:flex; align-items:center; color:#eee; font-size:13px; }
.live-task-head b { margin-left:5px; color:#ff6b82; }
.live-task-toggle { min-width:0; min-height:44px; flex:1; display:flex; align-items:center; justify-content:space-between; padding:8px 7px 8px 14px; border:0; background:transparent; color:#eee; font:inherit; text-align:left; }
.live-task-toggle>span:last-child { color:#777; font-size:11px; }
.live-task-head .live-task-dismiss { width:44px; min-width:44px; height:44px; padding:0; border:0; border-radius:50%; background:transparent; color:#888; font-size:18px; line-height:44px; }
.live-task-list { display:grid; grid-template-columns:1fr 1fr; gap:0 12px; padding:0 14px 8px; }
.live-task-item { display:flex; align-items:center; gap:7px; min-height:31px; color:#aaa; font-size:12px; }
.live-task-item i { color:#666; font-style:normal; }
.live-task-item.done { color:#666; text-decoration:line-through; }
.live-task-item.done i { color:#45c978; }
.live-task-reward { padding:9px 14px; border-top:1px solid rgba(255,255,255,.06); color:#c0a040; font-size:11px; }
.live-context-tip { position:fixed; left:16px; right:16px; bottom:max(86px,calc(env(safe-area-inset-bottom) + 72px)); z-index:10018; max-width:420px; margin:auto; display:flex; align-items:center; gap:12px; padding:12px 14px; box-sizing:border-box; border-radius:14px; background:rgba(28,28,28,.96); color:#eee; box-shadow:0 10px 35px rgba(0,0,0,.42); font-size:13px; line-height:1.5; border:1px solid rgba(255,255,255,.1); }
.live-context-tip span { flex:1; }
.live-context-tip button { flex-shrink:0; border:0; border-radius:10px; background:#ff4d6a; color:#fff; padding:7px 10px; font-size:12px; }
.live-history-actions { flex-shrink:0; min-width:34px; min-height:34px; display:flex; align-items:center; justify-content:center; border-radius:50%; color:#aaa; font-weight:700; letter-spacing:1px; }
.live-history-actions:active { background:rgba(255,255,255,.08); }
.live-pinned-badge { display:inline-block; padding:1px 5px; margin-right:3px; border-radius:6px; background:rgba(255,77,106,.15); color:#ff6b82; font-size:9px; vertical-align:1px; }
.live-schedule-actions { flex-shrink:0; display:flex; flex-direction:column; gap:5px; }
.live-schedule-actions button { min-width:44px; min-height:40px; border:0; border-radius:8px; padding:5px 8px; background:#2a2a2a; color:#aaa; font-size:11px; }
.live-schedule-actions button.danger { color:#ff7186; }
.live-editor-overlay { position:fixed; inset:0; z-index:10022; display:flex; align-items:flex-end; justify-content:center; background:rgba(0,0,0,.7); }
.live-editor-card { width:100%; max-width:440px; max-height:88vh; overflow-y:auto; box-sizing:border-box; padding:20px 18px max(22px,env(safe-area-inset-bottom)); border-radius:22px 22px 0 0; background:#1d1d1d; color:#eee; box-shadow:0 -15px 50px rgba(0,0,0,.4); }
.live-editor-title { display:flex; justify-content:space-between; align-items:center; margin-bottom:18px; font-size:18px; font-weight:700; }
.live-editor-title>button { width:44px; min-width:44px; height:44px; min-height:44px; padding:0; border:0; border-radius:50%; background:#292929; color:#999; font-size:20px; }
.live-editor-card>label { display:block; margin:0 0 14px; color:#999; font-size:12px; }
.live-editor-card input:not([type=checkbox]),.live-editor-card select { display:block; width:100%; height:44px; box-sizing:border-box; margin-top:7px; padding:0 12px; border:1px solid #373737; border-radius:11px; outline:0; background:#262626; color:#eee; font-size:14px; color-scheme:dark; }
.live-editor-card textarea { display:block; width:100%; box-sizing:border-box; margin-top:7px; padding:10px 12px; border:1px solid #373737; border-radius:11px; outline:0; resize:vertical; background:#262626; color:#eee; font:14px/1.6 inherit; }
.live-nested-editor { z-index:10024; }
.live-editor-check { display:flex!important; align-items:center; gap:9px; min-height:44px; color:#ccc!important; font-size:13px!important; }
.live-editor-check input { width:18px; height:18px; accent-color:#ff4d6a; }
.live-editor-actions,.live-editor-secondary { display:flex; gap:10px; margin-top:16px; }
.live-editor-actions button,.live-editor-secondary button { flex:1; min-height:43px; border:0; border-radius:12px; background:#292929; color:#bbb; font-size:13px; }
.live-editor-actions button.primary { background:#ff4d6a; color:#fff; font-weight:700; }
.live-editor-secondary button.danger { color:#ff7186; background:rgba(255,77,106,.09); }
.live-editor-summary { margin:8px 0; padding:12px; border-radius:12px; background:#252525; color:#aaa; font-size:12px; line-height:1.6; }
.live-editor-summary b { color:#ddd; }
.live-editor-summary p { margin:6px 0 0; }
.live-trash-list h3 { margin:16px 0 8px; color:#888; font-size:12px; font-weight:600; }
.live-trash-item { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:12px 0; border-bottom:1px solid #2d2d2d; }
.live-trash-item>div:first-child { flex:1; min-width:0; }
.live-trash-item b { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:#e8e8e8; font-size:13px; }
.live-trash-item span { display:block; margin-top:4px; color:#666; font-size:10px; }
.live-trash-item>div:last-child { display:flex; gap:6px; flex-shrink:0; }
.live-trash-item button { min-height:36px; padding:0 10px; border:0; border-radius:9px; background:#292929; color:#bbb; font-size:11px; }
.live-trash-item button.danger { color:#ff7186; background:rgba(255,77,106,.08); }
.live-trash-empty { padding:50px 10px; text-align:center; color:#666; font-size:13px; }
.live-admin-list { max-height:65vh; overflow-y:auto; }
.live-admin-row { display:flex; align-items:center; justify-content:space-between; gap:10px; padding:11px 2px; border-bottom:1px solid #2c2c2c; }
.live-admin-row>div { flex:1; min-width:0; }
.live-admin-row b,.live-admin-row span { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.live-admin-row b { color:#eee; font-size:13px; }.live-admin-row span { margin-top:4px; color:#777; font-size:10px; }
.live-admin-row button { min-height:36px; padding:0 12px; border:0; border-radius:9px; background:#2c2c2c; color:#bbb; }
.live-section-mgr-item { gap:8px; }
.live-section-mgr-item-name small { padding:1px 4px; border-radius:5px; background:#333; color:#999; font-size:9px; }
.live-section-mgr-item-actions { max-width:145px; justify-content:flex-end; gap:4px; flex-wrap:wrap; }
.live-section-mgr-item-actions button { min-height:28px; padding:3px 7px; border:1px solid #444; border-radius:6px; background:#292929; color:#aaa; font-size:10px; }
.live-section-mgr-item-actions button.danger { color:#ff7186; border-color:rgba(255,77,106,.35); }
.live-card-bg { position:absolute; top:0; left:0; right:0; bottom:0; background-size:cover; background-position:center; }
.live-card-gradient { position:absolute; top:0; left:0; right:0; bottom:0; display:flex; flex-direction:column; align-items:center; justify-content:center; padding:20px; text-align:center; }
.live-card-gradient .live-card-desc { color:rgba(255,255,255,0.9); font-size:16px; font-weight:600; line-height:1.5; word-break:break-all; }
.live-card-top { position:absolute; top:8px; left:8px; right:8px; display:flex; justify-content:space-between; align-items:center; z-index:1; }
.live-badge { display:flex; align-items:center; gap:4px; background:rgba(255,60,80,0.85); color:#fff; font-size:11px; padding:2px 8px; border-radius:10px; font-weight:500; }
.live-badge svg { width:8px; height:8px; }
.live-viewers { display:flex; align-items:center; gap:3px; background:rgba(0,0,0,0.5); color:#fff; font-size:11px; padding:2px 8px; border-radius:10px; }
.live-viewers svg { width:12px; height:12px; }
.live-card-bottom { position:absolute; bottom:0; left:0; right:0; padding:30px 10px 10px; background:linear-gradient(transparent, rgba(0,0,0,0.7)); z-index:1; }
.live-card-host { display:flex; align-items:center; gap:8px; }
.live-card-avatar { width:28px; height:28px; border-radius:50%; object-fit:cover; border:1.5px solid rgba(255,255,255,0.3); flex-shrink:0; }
.live-card-avatar-placeholder { width:28px; height:28px; border-radius:50%; background:#333; display:flex; align-items:center; justify-content:center; color:#aaa; font-size:13px; font-weight:600; flex-shrink:0; border:1.5px solid #444; }
.live-card-name { color:#fff; font-size:13px; font-weight:500; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.live-card-title { color:rgba(255,255,255,0.85); font-size:12px; margin-top:4px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.live-card-category { display:inline-block; background:rgba(255,255,255,0.12); color:rgba(255,255,255,0.7); font-size:10px; padding:1px 6px; border-radius:6px; margin-top:4px; }

/* 开播按钮 — [FIX-弹性保护带] bottom从保护带出发 */
.live-start-btn { position:fixed; min-height:48px; bottom:calc(var(--guard-bottom, 12px) + 18px); left:50%; transform:translateX(-50%); background:#ff4d6a; color:#fff; padding:12px 32px; border-radius:25px; font:inherit; font-size:15px; font-weight:600; cursor:pointer; box-shadow:0 4px 15px rgba(255,45,85,0.3); z-index:10; display:flex; align-items:center; gap:8px; border:none; }
.live-start-btn:active { transform:translateX(-50%) scale(0.95); }
.live-start-btn svg { width:10px; height:10px; }

/* ===== 直播间房间 ===== */
#layer-live-room { background:#000 !important; padding:0 !important; }
#layer-live-room > #live-room-content { flex:1 1 auto; width:100%; min-height:0; position:relative; overflow:hidden; }
.live-room { position:relative; width:100%; height:100%; overflow:hidden; contain:layout style; }
.live-room-bg { position:absolute; top:0; left:0; right:0; bottom:0; background-size:cover; background-position:center; }
.live-room-bg-overlay { position:absolute; top:0; left:0; right:0; bottom:0; background:rgba(0,0,0,0.3); }
.live-room-bg-default { position:absolute; top:0; left:0; right:0; bottom:0; }

/* 顶部信息栏 */
.live-room-header { position:absolute; top:0; left:0; right:0; padding:12px 14px; display:flex; justify-content:space-between; align-items:center; z-index:10; padding-top:max(12px, env(safe-area-inset-top)); }
.live-room-host-info { display:flex; align-items:center; gap:8px; background:rgba(0,0,0,0.5); padding:4px 12px 4px 4px; border-radius:20px; max-width:60%; }
.live-room-host-avatar { width:36px; height:36px; border-radius:50%; object-fit:cover; flex-shrink:0; }
.live-room-host-name { color:#f0f0f0; font-size:14px; font-weight:500; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.live-room-host-sub { color:rgba(255,255,255,0.5); font-size:11px; }
.live-room-viewers { min-height:40px; display:flex; align-items:center; gap:4px; background:rgba(0,0,0,0.5); padding:6px 12px; border:0; border-radius:16px; color:#f0f0f0; font-size:13px; cursor:pointer; }
.live-room-viewers svg { width:14px; height:14px; }
.live-room-close { width:40px; height:40px; border-radius:50%; background:rgba(0,0,0,0.5); display:flex; align-items:center; justify-content:center; color:#f0f0f0; cursor:pointer; }
.live-room-close svg { width:14px; height:14px; }

/* NPC头像圆 */
.live-npc-avatar-circle { width:36px; height:36px; border-radius:50%; background:#2a2a2a; border:1.5px solid #444; display:flex; align-items:center; justify-content:center; color:#ccc; font-size:16px; font-weight:600; flex-shrink:0; }

/* 公告 */
.live-announcement { position:absolute; left:14px; right:14px; top:calc(56px + max(0px, env(safe-area-inset-top))); background:rgba(255,200,0,0.1); color:#c0a040; font-size:12px; padding:6px 12px; border-radius:8px; z-index:9; display:flex; align-items:center; gap:6px; }
.live-announcement svg { width:14px; height:14px; flex-shrink:0; }

/* 粉丝信息条 */
.live-fan-bar { position:absolute; left:14px; top:calc(56px + max(0px, env(safe-area-inset-top))); display:flex; align-items:center; gap:8px; z-index:9; }
.live-announcement + .live-fan-bar, .live-room:has(.live-announcement) .live-fan-bar { top:calc(84px + max(0px, env(safe-area-inset-top))); }
.live-fan-badge-big { font-size:11px; font-weight:600; background:rgba(0,0,0,0.5); padding:3px 10px; border-radius:12px; }
.live-fan-badge { display:inline-flex; align-items:center; gap:2px; font-size:10px; padding:1px 6px; border-radius:8px; font-weight:600; flex-shrink:0; margin-right:2px; }

/* ===== [FIX-直播间文字重叠v2] flex 容器：包裹行为描述+弹幕，彻底消除绝对定位重叠 ===== */
.live-content-flow { position:absolute; top:calc(108px + max(0px, env(safe-area-inset-top))); bottom:calc(60px + max(0px, env(safe-area-inset-bottom))); left:0; right:0; display:flex; flex-direction:column; z-index:5; pointer-events:none; }
.live-content-flow > * { pointer-events:auto; }
.live-room:has(.live-announcement) .live-content-flow { top:calc(136px + max(0px, env(safe-area-inset-top))); }
.live-room:has(.live-fan-bar) .live-content-flow { top:calc(128px + max(0px, env(safe-area-inset-top))); }
.live-room:has(.live-announcement):has(.live-fan-bar) .live-content-flow { top:calc(148px + max(0px, env(safe-area-inset-top))); }

/* 主播行为状态展示区 — flex 子元素，固定最大高度，超出可滚动 */
.live-host-activity-bar { position:relative; margin:0 14px 6px; background:rgba(0,0,0,0.32); padding:12px 16px; border-radius:14px; z-index:9; display:flex; align-items:flex-start; gap:8px; font-size:15px; line-height:1.7; color:rgba(255,255,255,0.9); backdrop-filter:blur(4px); -webkit-backdrop-filter:blur(4px); border:1px solid rgba(255,255,255,0.08); max-height:18vh; overflow-y:auto; scrollbar-width:none; flex-shrink:0; }
.live-host-activity-bar::-webkit-scrollbar { display:none; }
.live-host-activity-bar #live-host-activity { flex:1; word-break:break-word; }
.live-host-activity-dot { width:7px; height:7px; border-radius:50%; background:#66ff66; flex-shrink:0; margin-top:8px; animation:liveActivityPulse 2s ease infinite; }
@keyframes liveActivityPulse { 0%,100%{opacity:0.5;} 50%{opacity:1;} }

/* 弹幕区域 — flex:1 自适应剩余空间，不再与行为描述重叠 */
.live-danmaku-area { position:relative; flex:1; min-height:0; padding:0 14px; overflow-y:auto; z-index:5; display:flex; flex-direction:column; justify-content:flex-end; gap:6px; mask-image:linear-gradient(transparent 0%, black 20%); -webkit-mask-image:linear-gradient(transparent 0%, black 20%); scrollbar-width:none; contain:layout; will-change:transform; }
.live-danmaku-area::-webkit-scrollbar { display:none; }
.live-danmaku-item { display:inline-flex; align-items:flex-start; gap:6px; background:rgba(0,0,0,0.4); padding:6px 10px; border-radius:14px; max-width:85%; animation:liveDanmakuIn 0.3s ease; align-self:flex-start; }
@keyframes liveDanmakuIn { from{opacity:0;transform:translateY(10px);} to{opacity:1;transform:translateY(0);} }
.live-danmaku-name { font-size:12px; font-weight:600; white-space:nowrap; flex-shrink:0; }
.live-danmaku-text { font-size:13px; color:#f0f0f0; line-height:1.4; word-break:break-all; }
.live-danmaku-system { color:rgba(255,255,255,0.4); font-size:12px; padding:4px 10px; align-self:center; background:none; }
.live-danmaku-system svg { width:12px; height:12px; vertical-align:middle; }
.live-danmaku-host .live-danmaku-name { color:#c0a040; }
.live-danmaku-user .live-danmaku-name { color:#5bf; }
.live-danmaku-virtual .live-danmaku-name { color:#666; }
.live-danmaku-entry-effect { background:rgba(255,215,0,0.08); border:1px solid rgba(255,215,0,0.15); align-self:center; font-weight:600; font-size:13px; animation:liveEntryEffect 0.5s ease; }
@keyframes liveEntryEffect { 0%{opacity:0;transform:scale(0.5);} 50%{transform:scale(1.1);} 100%{opacity:1;transform:scale(1);} }

/* 超级弹幕层 */
.live-super-danmaku-layer { position:absolute; top:35%; left:0; right:0; z-index:15; pointer-events:none; display:flex; justify-content:center; }
.live-super-danmaku { background:rgba(255,77,106,0.15); padding:10px 30px; animation:liveSuperDanmaku 4s ease forwards; white-space:nowrap; display:flex; align-items:center; gap:10px; }
.live-super-danmaku-name { color:#c0a040; font-size:14px; font-weight:600; }
.live-super-danmaku-text { color:#fff; font-size:18px; font-weight:700; text-shadow:0 0 10px var(--sd-color, #ff4d6a); }
@keyframes liveSuperDanmaku { 0%{opacity:0;transform:translateX(100%);} 10%{opacity:1;transform:translateX(0);} 80%{opacity:1;transform:translateX(0);} 100%{opacity:0;transform:translateX(-100%);} }

/* 底部工具栏 */
.live-room-toolbar { position:absolute; bottom:0; left:0; right:0; padding:10px; padding-left:max(10px, env(safe-area-inset-left)); padding-right:max(10px, env(safe-area-inset-right)); padding-bottom:max(10px, env(safe-area-inset-bottom)); display:flex; align-items:center; gap:6px; z-index:20; overflow-x:auto; overscroll-behavior-x:contain; -webkit-overflow-scrolling:touch; scrollbar-width:none; flex-wrap:nowrap; touch-action:pan-x; background:linear-gradient(transparent, rgba(0,0,0,0.4)); }
.live-room-toolbar::-webkit-scrollbar { display:none; }
/* [FIX-直播底部按钮溢出] 输入框改为可伸缩(flex:1)且可收窄(min-width:0)，
   吸收剩余空间，保证发送/点赞/礼物/余额/更多等固定按钮始终留在屏幕内，不再溢出右侧、无需横向滑动 */
.live-room-input { flex:1 1 0; min-width:0; width:0; background:rgba(255,255,255,0.1); border:1px solid rgba(255,255,255,0.08); border-radius:20px; padding:10px 14px; color:#f0f0f0; font-size:14px; outline:none; }
.live-room-input::placeholder { color:rgba(255,255,255,0.3); }
.live-room-tool-btn { width:42px; height:42px; min-width:42px; min-height:42px; padding:0; border:0; border-radius:50%; background:rgba(255,255,255,0.1); display:flex; align-items:center; justify-content:center; color:#f0f0f0; cursor:pointer; flex-shrink:0; }
.live-room-tool-btn:active { background:rgba(255,255,255,0.2); }
.live-room-tool-btn svg { width:16px; height:16px; }
.live-toolbar-balance { min-width:44px; height:44px; flex-shrink:0; display:flex; align-items:center; gap:4px; padding:0 9px; border:0; border-radius:22px; background:rgba(192,160,64,.18); color:#e3c46d; font-size:11px; }
.live-toolbar-balance svg { width:14px; height:14px; }
.live-room-more-btn { width:44px; min-width:44px; height:44px; flex-shrink:0; border:0; border-radius:50%; background:rgba(255,255,255,.1); color:#fff; font-weight:800; letter-spacing:1px; }
.live-room-more-overlay { position:fixed; inset:0; z-index:10021; display:flex; align-items:flex-end; justify-content:center; background:rgba(0,0,0,.65); }
/* [FIX-更多功能按钮点不到] 底部弹出的"更多功能"面板按 flex-end 贴底，功能项多时(观看NPC主播可达16+项/6行)
   会顶出屏幕上沿，顶部按钮无法点击。加 max-height + 竖向滚动，保证所有按钮都能滑到并点击。 */
.live-room-more-sheet { width:100%; max-width:440px; max-height:82vh; overflow-y:auto; overscroll-behavior:contain; -webkit-overflow-scrolling:touch; padding:18px 16px max(20px,env(safe-area-inset-bottom)); box-sizing:border-box; border-radius:22px 22px 0 0; background:#1d1d1d; }
.live-room-more-head { display:flex; align-items:center; justify-content:space-between; color:#eee; margin-bottom:14px; }
.live-room-more-head button { width:44px; height:44px; border:0; border-radius:50%; background:#292929; color:#999; font-size:20px; }
.live-room-more-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:9px; }
.live-room-more-grid button { min-height:50px; padding:8px; border:1px solid #303030; border-radius:13px; background:#252525; color:#ccc; font-size:12px; }
.live-card-menu-list { display:flex; flex-direction:column; gap:7px; }
.live-card-menu-list button { min-height:44px; border:0; border-radius:12px; background:#262626; color:#ddd; font-size:14px; }
.live-card-menu-list button.danger { color:#ff7186; background:rgba(255,77,106,.09); }
.live-host-typing { opacity:.8; }
.live-host-typing .live-danmaku-text>span { display:inline-block; animation:liveTypingDots 1s infinite; }
@keyframes liveTypingDots { 0%,100%{opacity:.25} 50%{opacity:1} }

/* 点赞动画 */
.live-like-float { position:absolute; bottom:calc(80px + env(safe-area-inset-bottom)); right:14px; animation:liveLikeFloat 1.5s ease forwards; pointer-events:none; z-index:8; }
.live-like-float svg { width:24px; height:24px; }
@keyframes liveLikeFloat { 0%{opacity:1;transform:translateY(0) scale(1);} 50%{opacity:1;transform:translateY(-60px) scale(1.2);} 100%{opacity:0;transform:translateY(-120px) scale(0.8);} }

/* 礼物面板 */
.live-gift-panel { position:absolute; bottom:0; left:0; right:0; background:#1e1e1e; border-radius:16px 16px 0 0; padding:16px 14px; padding-bottom:max(16px, env(safe-area-inset-bottom)); z-index:20; transform:translateY(100%); transition:transform 0.3s ease; border-top:1px solid #333; }
.live-gift-panel.show { transform:translateY(0); }
.live-gift-panel-title { color:#f0f0f0; font-size:15px; font-weight:600; margin-bottom:14px; display:flex; justify-content:space-between; align-items:center; }
.live-gift-panel-title svg { width:14px; height:14px; }
.live-gift-panel-close { width:44px; min-width:44px; height:44px; padding:0; border:0; border-radius:50%; background:transparent; color:#888; cursor:pointer; display:flex; align-items:center; justify-content:center; }
.live-gift-grid { display:grid; grid-template-columns:repeat(4, 1fr); gap:10px; }
.live-gift-item { min-height:64px; display:flex; flex-direction:column; align-items:center; gap:4px; cursor:pointer; padding:8px 4px; border:1px solid transparent; border-radius:12px; background:transparent; color:inherit; font:inherit; transition:background 0.2s; }
.live-gift-item:active { background:rgba(255,255,255,0.06); }
.live-gift-item.selected { background:rgba(255,77,106,0.12); border:1px solid rgba(255,77,106,0.3); }
.live-gift-icon { display:flex; align-items:center; justify-content:center; }
.live-gift-icon svg { width:30px; height:30px; }
.live-gift-name { color:#ccc; font-size:11px; }
.live-gift-cost { color:#c0a040; font-size:10px; }
.live-gift-send-btn { margin-top:12px; width:100%; padding:12px; background:#ff4d6a; color:#fff; border:none; border-radius:22px; font-size:15px; font-weight:600; cursor:pointer; }

/* 礼物全屏动画 */
.live-gift-fullscreen { position:absolute; top:0; left:0; right:0; bottom:0; display:flex; align-items:center; justify-content:center; z-index:30; pointer-events:none; animation:liveGiftFullscreen 2.2s ease forwards; }
.live-gift-fullscreen-inner svg { width:80px; height:80px; }
.live-gift-fullscreen-text { color:#fff; font-size:18px; font-weight:600; margin-top:10px; text-align:center; }
@keyframes liveGiftFullscreen { 0%{opacity:0;transform:scale(0.3);} 20%{opacity:1;transform:scale(1.2);} 40%{transform:scale(1);} 80%{opacity:1;} 100%{opacity:0;transform:scale(0.8) translateY(-30px);} }

/* 礼物连击combo */
.live-combo-area { position:absolute; left:14px; bottom:130px; z-index:12; pointer-events:none; transition:opacity 0.3s ease; }
.live-combo-area.fade-out { opacity:0; }
.live-combo { display:flex; align-items:center; gap:8px; background:rgba(0,0,0,0.5); padding:8px 16px; border-radius:20px; animation:liveComboIn 0.3s ease; }
.live-combo-glow { box-shadow:0 0 15px rgba(255,77,106,0.3); background:rgba(255,77,106,0.15); }
.live-combo-sender { color:#5bf; font-size:13px; font-weight:600; }
.live-combo-gift svg { width:28px; height:28px; }
.live-combo-count { color:#ff4d6a; font-weight:900; font-style:italic; text-shadow:0 0 8px rgba(255,77,106,0.4); animation:liveComboCount 0.3s ease; }
@keyframes liveComboIn { from{opacity:0;transform:translateX(-20px);} to{opacity:1;transform:translateX(0);} }
@keyframes liveComboCount { 0%{transform:scale(1.5);} 100%{transform:scale(1);} }

/* 排行榜面板 */
.live-rank-panel { position:absolute; bottom:0; left:0; right:0; background:#1e1e1e; border-radius:16px 16px 0 0; padding:16px 14px 30px; z-index:20; transform:translateY(100%); transition:transform 0.3s ease; max-height:50vh; overflow-y:auto; border-top:1px solid #333; }
.live-rank-panel.show { transform:translateY(0); }
.live-rank-item { display:flex; align-items:center; gap:10px; padding:10px 8px; border-bottom:1px solid rgba(255,255,255,0.04); }
.live-rank-medal { font-size:14px; width:30px; text-align:center; font-weight:700; }
.live-rank-name { flex:1; color:#f0f0f0; font-size:14px; }
.live-rank-value { color:#c0a040; font-size:13px; font-weight:600; }

/* 装修面板 */
.live-decor-panel { position:absolute; bottom:0; left:0; right:0; background:#1e1e1e; border-radius:16px 16px 0 0; padding:16px 14px 30px; z-index:20; transform:translateY(100%); transition:transform 0.3s ease; max-height:60vh; overflow-y:auto; border-top:1px solid #333; }
.live-decor-panel.show { transform:translateY(0); }
.live-decor-title { color:#f0f0f0; font-size:15px; font-weight:600; margin-bottom:14px; display:flex; justify-content:space-between; align-items:center; }
.live-decor-close { width:44px; min-width:44px; height:44px; padding:0; border:0; border-radius:50%; background:transparent; color:#888; cursor:pointer; display:flex; align-items:center; justify-content:center; }
.live-decor-close svg { width:14px; height:14px; }
.live-decor-section { margin-bottom:16px; }
.live-decor-label { color:#888; font-size:13px; margin-bottom:8px; }
.live-decor-themes { display:flex; gap:10px; overflow-x:auto; padding-bottom:4px; }
.live-decor-theme-item { width:56px; height:56px; padding:0; border-radius:12px; flex-shrink:0; cursor:pointer; border:2px solid transparent; background:transparent; color:inherit; font:inherit; position:relative; }
.live-decor-theme-item.active { border-color:#ff4d6a; }
.live-decor-theme-item.active::after { content:''; position:absolute; bottom:2px; right:2px; background:#ff4d6a; width:16px; height:16px; border-radius:50%; }
.live-decor-upload-btn { display:flex; width:100%; min-height:44px; align-items:center; justify-content:center; gap:8px; padding:12px; border:0; background:rgba(255,255,255,0.06); border-radius:12px; color:#ccc; font:inherit; font-size:14px; cursor:pointer; }
.live-bg-preview { height:80px; margin-bottom:8px; overflow:hidden; border-radius:8px; background-position:center; background-size:cover; position:relative; }
.live-bg-clear { position:absolute; top:2px; right:2px; width:44px; height:44px; padding:0; border:0; border-radius:50%; background:rgba(0,0,0,.58); color:#fff; display:flex; align-items:center; justify-content:center; }
.live-bg-clear svg { width:14px; height:14px; }
.live-decor-upload-btn svg { width:16px; height:16px; }
.live-decor-input { width:100%; padding:10px 14px; background:rgba(255,255,255,0.06); border:1px solid #333; border-radius:10px; color:#f0f0f0; font-size:14px; box-sizing:border-box; outline:none; }
.live-decor-input::placeholder { color:#555; }

/* 氛围特效层 */
.live-atmosphere-layer { position:absolute; top:0; left:0; right:0; bottom:0; z-index:1; pointer-events:none; overflow:hidden; }
.live-atmo-particle { position:absolute; top:-30px; animation:liveAtmoFall linear forwards; pointer-events:none; color:rgba(255,255,255,0.4); will-change:transform,opacity; } /* [PERF] 提升到合成层，减少主线程重绘 */
@keyframes liveAtmoFall { 0%{transform:translateY(0) rotate(0deg);opacity:1;} 100%{transform:translateY(110vh) rotate(360deg);opacity:0.2;} }

/* 互动区域容器 */
#live-interactive-area { position:absolute; bottom:60px; left:0; right:0; z-index:15; pointer-events:none; }
#live-interactive-area > * { pointer-events:auto; }

/* 投票面板 */
.live-vote-panel { position:relative; margin:0 14px; background:rgba(0,0,0,0.7); border-radius:12px; padding:12px; z-index:15; backdrop-filter:blur(8px); animation:liveDanmakuIn 0.3s ease; border:1px solid rgba(255,255,255,0.06); }
.live-vote-title { color:#f0f0f0; font-size:14px; font-weight:600; margin-bottom:10px; display:flex; align-items:center; gap:6px; }
.live-vote-title svg { width:14px; height:14px; }
.live-vote-option { position:relative; width:100%; min-height:44px; padding:10px 12px; margin-bottom:6px; border:0; border-radius:8px; background:rgba(255,255,255,0.05); color:inherit; font:inherit; text-align:left; cursor:pointer; overflow:hidden; display:flex; justify-content:space-between; align-items:center; }
.live-vote-option:disabled { cursor:default; opacity:.82; }
.live-vote-option:active { background:rgba(255,255,255,0.1); }
.live-vote-bar { position:absolute; top:0; left:0; bottom:0; background:rgba(91,187,255,0.15); border-radius:8px; transition:width 0.3s ease; }
.live-vote-label { color:#f0f0f0; font-size:13px; position:relative; z-index:1; }
.live-vote-pct { color:#5bf; font-size:13px; font-weight:600; position:relative; z-index:1; }

/* 小游戏面板 */
.live-game-panel { position:relative; margin:0 14px; background:rgba(0,0,0,0.7); border-radius:12px; padding:12px; z-index:15; backdrop-filter:blur(8px); animation:liveDanmakuIn 0.3s ease; border:1px solid rgba(255,255,255,0.06); }
.live-game-title { color:#66ff66; font-size:14px; font-weight:600; margin-bottom:6px; display:flex; align-items:center; gap:6px; }
.live-game-title svg { width:14px; height:14px; }
.live-game-hint { color:#888; font-size:12px; }

/* 红包雨 */
.live-redpacket { position:absolute; top:-44px; width:44px; height:44px; box-sizing:border-box; display:inline-flex; align-items:center; justify-content:center; padding:6px; border:0; background:transparent; cursor:pointer; animation:liveRedpacketFall 3s linear forwards; z-index:25; transition:transform 0.2s; color:#ff4444; }
.live-redpacket svg { width:32px; height:32px; }
.live-redpacket:active { transform:scale(1.3); }
.live-redpacket.grabbed { color:#c0a040; font-size:18px; font-weight:700; animation:liveRedpacketGrab 0.8s ease forwards; }
@keyframes liveRedpacketFall { 0%{transform:translateY(0);opacity:1;} 100%{transform:translateY(100vh);opacity:0.5;} }
@keyframes liveRedpacketGrab { 0%{opacity:1;transform:scale(1.3);} 100%{opacity:0;transform:scale(2) translateY(-30px);} }

/* 历史回放列表 */
.live-history-list { padding:8px 0; }
.live-history-item { display:flex; align-items:center; gap:12px; padding:12px 8px; border-bottom:1px solid rgba(255,255,255,0.04); cursor:pointer; }
.live-history-item:active { background:rgba(255,255,255,0.03); }
.live-history-item.past { opacity:0.5; }
.live-history-avatar { width:44px; height:44px; border-radius:50%; background:#2a2a2a; display:flex; align-items:center; justify-content:center; color:#aaa; font-size:18px; font-weight:600; flex-shrink:0; }
.live-history-avatar svg { width:16px; height:16px; }
.live-history-info { flex:1; min-width:0; }
.live-history-name { color:#f0f0f0; font-size:14px; font-weight:500; }
.live-history-title { color:rgba(255,255,255,0.5); font-size:12px; margin-top:2px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.live-history-meta { color:#666; font-size:11px; margin-top:2px; }

/* 预告添加按钮 */
.live-schedule-add { display:flex; width:100%; min-height:44px; align-items:center; justify-content:center; gap:8px; padding:14px; background:rgba(255,255,255,0.04); border-radius:12px; color:#ff4d6a; font-size:14px; cursor:pointer; border:1px dashed rgba(255,77,106,0.2); }
.live-schedule-add svg { width:14px; height:14px; }
.live-schedule-add:active { background:rgba(255,77,106,0.06); }

/* 回放标记条 */
.live-replay-bar { position:absolute; top:0; left:0; right:0; background:rgba(255,77,106,0.85); color:#fff; font-size:12px; font-weight:600; text-align:center; padding:6px 14px; padding-top:max(6px, env(safe-area-inset-top)); z-index:20; display:flex; align-items:center; justify-content:center; gap:6px; }
.live-replay-bar svg { width:14px; height:14px; }

/* 超级弹幕按钮 */
.live-super-danmaku-btn { background:#ff4d6a !important; box-shadow:0 2px 8px rgba(255,77,106,0.3); }
.live-super-danmaku-btn:active { transform:scale(0.92); }

/* 开播设置面板 */
.live-stream-setup { position:fixed; top:0; left:0; right:0; bottom:0; background:rgba(0,0,0,0.6); z-index:10003; display:flex; align-items:flex-end; justify-content:center; }
.live-stream-setup-panel { background:#1e1e1e; border-radius:16px 16px 0 0; padding:20px 16px 30px; width:100%; max-width:420px; max-height:80vh; overflow-y:auto; animation:liveSlideUp 0.3s ease; border-top:1px solid #333; }
@keyframes liveSlideUp { from{transform:translateY(100%);} to{transform:translateY(0);} }
.live-setup-title { color:#f0f0f0; font-size:17px; font-weight:600; text-align:center; margin-bottom:20px; }
.live-setup-field { margin-bottom:16px; }
.live-setup-label { color:#888; font-size:13px; margin-bottom:6px; }
.live-setup-input { width:100%; padding:12px 14px; background:rgba(255,255,255,0.05); border:1px solid #333; border-radius:10px; color:#f0f0f0; font-size:14px; box-sizing:border-box; outline:none; }
.live-setup-input::placeholder { color:#555; }
.live-setup-types { display:flex; gap:8px; flex-wrap:wrap; max-height:160px; overflow-y:auto; }
.live-setup-type { min-height:44px; flex:0 0 calc(25% - 6px); box-sizing:border-box; padding:10px 5px; background:rgba(255,255,255,0.04); color:inherit; font:inherit; border-radius:10px; text-align:center; cursor:pointer; border:2px solid transparent; transition:all 0.2s; }
.live-setup-type.active { border-color:#ff4d6a; background:rgba(255,77,106,0.08); }
.live-setup-type svg { width:24px; height:24px; color:#ccc; display:block; margin:0 auto 6px; }
.live-setup-type span { color:#aaa; font-size:12px; }
.live-setup-contacts { display:flex; flex-wrap:wrap; gap:8px; max-height:150px; overflow-y:auto; }
.live-setup-contact { min-height:44px; display:flex; align-items:center; gap:6px; padding:6px 12px; background:rgba(255,255,255,0.04); color:inherit; font:inherit; border-radius:22px; cursor:pointer; border:1.5px solid transparent; }
.live-setup-contact.selected { border-color:#ff4d6a; background:rgba(255,77,106,0.1); }
.live-setup-contact img { width:24px; height:24px; border-radius:50%; object-fit:cover; }
.live-setup-contact span { color:#ccc; font-size:13px; }
.live-setup-go-btn { width:100%; padding:14px; background:#ff4d6a; color:#fff; border:none; border-radius:25px; font-size:16px; font-weight:600; cursor:pointer; margin-top:10px; display:flex; align-items:center; justify-content:center; gap:8px; }
.live-setup-go-btn svg { width:10px; height:10px; }
.live-setup-cancel { width:100%; padding:12px; background:none; color:#666; border:none; font-size:14px; cursor:pointer; margin-top:6px; }

/* 空状态 */
.live-empty { text-align:center; padding:60px 20px; color:#555; }
.live-empty svg { width:48px; height:48px; margin-bottom:16px; color:#333; }
.live-empty p { font-size:14px; line-height:1.6; }

/* ===== NPC资料卡 ===== */
.live-npc-profile-overlay { position:fixed; top:0; left:0; right:0; bottom:0; background:rgba(0,0,0,0.7); z-index:10004; display:flex; align-items:center; justify-content:center; animation:liveFadeIn 0.2s ease; }
@keyframes liveFadeIn { from{opacity:0;} to{opacity:1;} }
.live-npc-profile { background:#1e1e1e; border-radius:16px; width:90%; max-width:380px; max-height:80vh; overflow-y:auto; border:1px solid #333; animation:liveSlideUp 0.3s ease; }
.live-npc-profile-header { text-align:center; padding:20px 16px 16px; position:relative; border-bottom:1px solid #2a2a2a; }
.live-npc-profile-close { position:absolute; top:6px; right:6px; color:#888; cursor:pointer; width:44px; height:44px; padding:0; border:0; display:flex; align-items:center; justify-content:center; border-radius:50%; background:rgba(255,255,255,0.05); }
.live-npc-profile-close svg { width:14px; height:14px; }
.live-npc-avatar-big { width:64px; height:64px; border-radius:50%; background:#2a2a2a; border:2px solid #444; display:flex; align-items:center; justify-content:center; color:#ccc; font-size:28px; font-weight:600; margin:0 auto 10px; }
.live-npc-profile img.live-npc-avatar-big { object-fit:cover; }
.live-npc-profile-name { color:#f0f0f0; font-size:18px; font-weight:600; }
.live-npc-profile-rel { font-size:13px; margin-top:4px; font-weight:500; }
.live-npc-profile-bar { width:80%; max-width:200px; height:6px; background:#2a2a2a; border-radius:3px; margin:10px auto 4px; overflow:hidden; }
.live-npc-profile-bar-fill { height:100%; background:#ff4d6a; border-radius:3px; transition:width 0.3s ease; }
.live-npc-profile-bar-label { color:#666; font-size:11px; }

.live-npc-info-section { padding:12px 16px; border-bottom:1px solid #2a2a2a; }
.live-npc-info-section:last-of-type { border-bottom:none; }
.live-npc-info-title { color:#aaa; font-size:13px; font-weight:600; margin-bottom:8px; display:flex; align-items:center; gap:6px; }
.live-npc-info-title svg { width:12px; height:12px; }
.live-npc-info-row { display:flex; justify-content:space-between; padding:4px 0; }
.live-npc-info-key { color:#888; font-size:13px; }
.live-npc-info-val { color:#f0f0f0; font-size:13px; }
.live-npc-info-locked { color:#444; font-size:13px; font-style:italic; padding:4px 0; }

.live-npc-profile-actions { display:flex; gap:10px; padding:16px; }
.live-npc-action-btn { flex:1; padding:10px; border-radius:10px; text-align:center; cursor:pointer; font-size:13px; font-weight:500; display:flex; align-items:center; justify-content:center; gap:6px; transition:all 0.2s; background:rgba(255,255,255,0.06); color:#ccc; border:1px solid #333; }
.live-npc-action-btn:active { background:rgba(255,255,255,0.1); }
.live-npc-action-btn svg { width:14px; height:14px; }
.live-npc-action-wechat { background:rgba(76,175,80,0.1); color:#4caf50; border-color:rgba(76,175,80,0.3); }
.live-npc-action-done { background:rgba(76,175,80,0.08); color:#4caf50; border-color:rgba(76,175,80,0.2); opacity:0.7; cursor:default; }
.live-npc-action-disabled { color:#555; cursor:default; opacity:0.5; }

/* ===== NPC私聊 ===== */
.live-npc-chat-overlay { position:fixed; top:0; left:0; right:0; bottom:0; background:rgba(0,0,0,0.7); z-index:10005; display:flex; align-items:center; justify-content:center; animation:liveFadeIn 0.2s ease; }
.live-npc-chat { background:#1a1a1a; border-radius:16px; width:90%; max-width:400px; height:70vh; max-height:500px; display:flex; flex-direction:column; border:1px solid #333; animation:liveSlideUp 0.3s ease; overflow:hidden; }
.live-npc-chat-header { display:flex; align-items:center; gap:8px; padding:12px 16px; background:#1e1e1e; border-bottom:1px solid #2a2a2a; color:#f0f0f0; font-size:15px; font-weight:500; flex-shrink:0; }
.live-npc-avatar-sm { width:28px; height:28px; border-radius:50%; background:#2a2a2a; border:1px solid #444; display:flex; align-items:center; justify-content:center; color:#ccc; font-size:13px; font-weight:600; flex-shrink:0; }
.live-npc-chat-close { min-width:44px; min-height:44px; margin-left:auto; padding:0; border:0; background:transparent; color:#999; cursor:pointer; display:flex; align-items:center; justify-content:center; }
.live-npc-chat-close svg { width:14px; height:14px; }
.live-npc-chat-messages { flex:1; overflow-y:auto; padding:12px 16px; display:flex; flex-direction:column; gap:10px; }
.live-npc-msg { display:flex; }
.live-npc-msg-user { justify-content:flex-end; }
.live-npc-msg-npc { justify-content:flex-start; }
.live-npc-msg-bubble { max-width:75%; padding:8px 12px; border-radius:12px; font-size:14px; line-height:1.5; word-break:break-all; }
.live-npc-msg-user .live-npc-msg-bubble { background:#333; color:#f0f0f0; border-bottom-right-radius:4px; }
.live-npc-msg-npc .live-npc-msg-bubble { background:#2a2a2a; color:#ddd; border-bottom-left-radius:4px; }
.live-npc-chat-input-bar { display:flex; align-items:center; gap:8px; padding:10px 16px; background:#1e1e1e; border-top:1px solid #2a2a2a; flex-shrink:0; }
.live-npc-chat-input { flex:1; padding:10px 14px; background:rgba(255,255,255,0.06); border:1px solid #333; border-radius:20px; color:#f0f0f0; font-size:14px; outline:none; }
.live-npc-chat-input::placeholder { color:#555; }
.live-npc-chat-send { width:44px; min-width:44px; height:44px; padding:0; border:0; border-radius:50%; background:#ff4d6a; display:flex; align-items:center; justify-content:center; cursor:pointer; color:#fff; flex-shrink:0; }
.live-npc-chat-send svg { width:14px; height:14px; }

/* ===== 回放摘要 ===== */
.live-history-summary { color:#999; font-size:11px; line-height:1.4; margin-top:3px; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }

/* ===== 热度指示 ===== */
.live-heat-indicator { position:absolute; top:8px; right:60px; display:flex; align-items:center; gap:4px; background:rgba(0,0,0,0.5); padding:2px 8px; border-radius:10px; font-size:11px; z-index:1; }
.live-heat-fire { color:#ff6b35; }
.live-heat-hot { color:#ff9800; }
.live-heat-warm { color:#ffc107; }
.live-heat-cold { color:#666; }

/* ===== 关注标签 ===== */
.live-card-follow-tag { position:absolute; top:8px; left:8px; background:rgba(255,77,106,0.85); color:#fff; font-size:10px; padding:2px 8px; border-radius:8px; font-weight:600; z-index:2; }

/* ===== 弹幕表情包 ===== */
.live-emoji { font-size:1.3em; vertical-align:middle; display:inline; line-height:1; }

/* ===== 金币余额显示 ===== */
.live-coins-display { display:inline-flex; align-items:center; gap:4px; background:rgba(192,160,64,0.12); color:#c0a040; font-size:12px; padding:3px 10px; border-radius:12px; font-weight:600; }

/* ===== 改进的氛围粒子 ===== */
.live-atmo-particle { position:absolute; top:-30px; animation:liveAtmoFall linear forwards; pointer-events:none; text-shadow:0 0 6px rgba(255,255,255,0.3); user-select:none; }

/* ===== NPC直播间状态描述 ===== */
.live-card-desc { color:rgba(255,255,255,0.9); font-size:15px; font-weight:600; line-height:1.5; word-break:break-all; text-shadow:0 1px 3px rgba(0,0,0,0.5); }

/* ===== 礼物面板金币不足样式 ===== */
.live-gift-item.cant-afford { opacity:0.5; }
.live-gift-item.cant-afford .live-gift-cost { color:#ff4d6a; }

/* ===== 刷新按钮动画 ===== */
#live-refresh-icon.spinning { animation:liveSpin 1s linear; }
@keyframes liveSpin { from{transform:rotate(0deg);} to{transform:rotate(360deg);} }

/* ===== 关注按钮高亮 ===== */
.live-room-tool-btn.followed { background:rgba(255,77,106,0.2) !important; }

/* ===== 弹幕输入框表情提示 ===== */
.live-room-input::placeholder { font-size:13px; }

/* ===== NPC 资料卡关注按钮 ===== */
.live-npc-action-follow { background:rgba(255,77,106,0.1); color:#ff4d6a; border-color:rgba(255,77,106,0.3); }
.live-npc-action-followed { background:rgba(255,77,106,0.06); color:#ff4d6a; border-color:rgba(255,77,106,0.15); opacity:0.8; }

/* ============================================
   充值系统样式 - RECHARGE SYSTEM
   ============================================ */

/* 充值面板（从底部弹出） */
.live-recharge-overlay { position:fixed; top:0; left:0; right:0; bottom:0; background:rgba(0,0,0,0.6); z-index:10006; display:flex; align-items:flex-end; justify-content:center; animation:liveFadeIn 0.2s ease; }
.live-recharge-panel { background:#1a1a1a; border-radius:20px 20px 0 0; width:100%; max-width:420px; max-height:85vh; overflow-y:auto; animation:liveSlideUp 0.3s ease; border-top:1px solid #333; }

/* 充值面板头部 */
.live-recharge-header { padding:16px 16px 12px; border-bottom:1px solid #2a2a2a; display:flex; justify-content:space-between; align-items:center; position:sticky; top:0; background:#1a1a1a; z-index:2; border-radius:20px 20px 0 0; }
.live-recharge-title { color:#f0f0f0; font-size:17px; font-weight:600; }
.live-recharge-close { color:#888; cursor:pointer; width:44px; min-width:44px; height:44px; padding:0; border:0; display:flex; align-items:center; justify-content:center; border-radius:50%; background:rgba(255,255,255,0.06); }
.live-recharge-close svg { width:14px; height:14px; }

/* 当前余额卡片 */
.live-recharge-balance { margin:16px; padding:20px; background:linear-gradient(135deg, #2a2000 0%, #1a1500 100%); border-radius:16px; border:1px solid rgba(192,160,64,0.2); position:relative; overflow:hidden; }
.live-recharge-balance::before { content:''; position:absolute; top:-30px; right:-30px; width:100px; height:100px; border-radius:50%; background:rgba(192,160,64,0.06); }
.live-recharge-balance-label { color:rgba(192,160,64,0.7); font-size:12px; margin-bottom:6px; }
.live-recharge-balance-amount { color:#c0a040; font-size:32px; font-weight:700; display:flex; align-items:baseline; gap:4px; }
.live-recharge-balance-amount small { font-size:14px; font-weight:400; color:rgba(192,160,64,0.6); }
.live-recharge-balance-wallet { color:rgba(255,255,255,0.4); font-size:11px; margin-top:8px; display:flex; align-items:center; gap:4px; }
.live-recharge-balance-wallet svg { width:12px; height:12px; }

/* 充值档位网格 */
.live-recharge-section-title { color:#888; font-size:13px; padding:0 16px; margin-bottom:10px; display:flex; align-items:center; gap:6px; }
.live-recharge-grid { display:grid; grid-template-columns:repeat(3, 1fr); gap:10px; padding:0 16px; margin-bottom:16px; }

/* 单个充值档位卡片 */
.live-recharge-card { position:relative; width:100%; min-height:92px; background:#222; color:inherit; font:inherit; border-radius:14px; padding:16px 10px; text-align:center; cursor:pointer; border:2px solid transparent; transition:all 0.2s; overflow:hidden; }
.live-recharge-card:active { transform:scale(0.97); }
.live-recharge-card.selected { border-color:#c0a040; background:#2a2400; }
.live-recharge-card.popular { border-color:rgba(255,77,106,0.4); }
.live-recharge-card.popular::before { content:'热门'; position:absolute; top:0; right:0; background:#ff4d6a; color:#fff; font-size:9px; padding:2px 8px; border-radius:0 12px 0 8px; font-weight:600; }
.live-recharge-card.first-buy::before { content:'首充双倍'; position:absolute; top:0; right:0; background:#c0a040; color:#1a1a1a; font-size:9px; padding:2px 8px; border-radius:0 12px 0 8px; font-weight:600; }
.live-recharge-card-coins { color:#c0a040; font-size:22px; font-weight:700; margin-bottom:2px; display:flex; align-items:center; justify-content:center; gap:4px; }
.live-recharge-card-coins svg { width:16px; height:16px; }
.live-recharge-card-coins-unit { font-size:12px; font-weight:400; color:rgba(192,160,64,0.6); }
.live-recharge-card-price { color:#f0f0f0; font-size:15px; font-weight:600; margin-top:4px; }
.live-recharge-card-bonus { color:#ff4d6a; font-size:10px; margin-top:3px; font-weight:500; }
.live-recharge-card-original { color:#666; font-size:10px; text-decoration:line-through; margin-top:2px; }

/* 自定义金额 */
.live-recharge-custom { margin:0 16px 16px; }
.live-recharge-custom-btn { display:flex; width:100%; min-height:44px; align-items:center; justify-content:center; gap:8px; padding:12px; background:rgba(255,255,255,0.04); border-radius:12px; color:#888; font:inherit; font-size:14px; cursor:pointer; border:1px dashed #333; }
.live-recharge-custom-btn:active { background:rgba(255,255,255,0.08); }
.live-recharge-custom-input-row { display:flex; align-items:center; gap:10px; }
.live-recharge-custom-input { flex:1; padding:12px 14px; background:#222; border:1px solid #333; border-radius:10px; color:#f0f0f0; font-size:16px; outline:none; box-sizing:border-box; text-align:center; }
.live-recharge-custom-input::placeholder { color:#555; }
.live-recharge-custom-hint { color:#888; font-size:12px; text-align:center; margin-top:6px; }
.live-recharge-custom-coins { color:#c0a040; font-size:14px; text-align:center; margin-top:4px; font-weight:600; }

/* 支付方式选择 */
.live-recharge-pay-section { padding:0 16px; margin-bottom:16px; }
.live-recharge-pay-method { display:flex; width:100%; min-height:60px; align-items:center; gap:12px; padding:14px; background:#222; color:inherit; font:inherit; text-align:left; border-radius:12px; cursor:pointer; border:2px solid transparent; transition:all 0.2s; }
.live-recharge-pay-method.active { border-color:#07c160; }
.live-recharge-pay-icon { width:32px; height:32px; border-radius:8px; display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.live-recharge-pay-icon.wechat { background:#07c160; color:#fff; }
.live-recharge-pay-icon.wechat svg { width:20px; height:20px; }
.live-recharge-pay-icon.wallet { background:#1a1a1a; border:1px solid #333; color:#c0a040; }
.live-recharge-pay-icon.wallet svg { width:18px; height:18px; }
.live-recharge-pay-info { flex:1; }
.live-recharge-pay-name { color:#f0f0f0; font-size:14px; font-weight:500; }
.live-recharge-pay-desc { color:#888; font-size:11px; margin-top:2px; }
.live-recharge-pay-check { width:20px; height:20px; border-radius:50%; border:2px solid #444; display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.live-recharge-pay-check.checked { border-color:#07c160; background:#07c160; }
.live-recharge-pay-check.checked svg { width:12px; height:12px; color:#fff; }

/* 充值确认按钮 */
.live-recharge-confirm-area { padding:10px 16px 20px; padding-bottom:max(20px, env(safe-area-inset-bottom)); position:sticky; bottom:0; background:#1a1a1a; border-top:1px solid #2a2a2a; }
.live-recharge-confirm-btn { width:100%; padding:14px; border:none; border-radius:25px; font-size:16px; font-weight:600; cursor:pointer; display:flex; align-items:center; justify-content:center; gap:8px; transition:all 0.2s; background:#c0a040; color:#1a1a1a; }
.live-recharge-confirm-btn:active { transform:scale(0.98); opacity:0.9; }
.live-recharge-confirm-btn:disabled { background:#333; color:#666; cursor:not-allowed; }
.live-recharge-confirm-btn .price-tag { background:rgba(0,0,0,0.15); padding:2px 10px; border-radius:12px; font-size:13px; }

/* 充值记录入口 */
.live-recharge-history-link { display:block; width:100%; min-height:44px; text-align:center; padding:10px; border:0; background:transparent; color:#888; font:inherit; font-size:12px; cursor:pointer; }
.live-recharge-history-link:active { color:#888; }

/* ============================================
   模拟微信支付弹窗
   ============================================ */
.live-pay-dialog-overlay { position:fixed; top:0; left:0; right:0; bottom:0; background:rgba(0,0,0,0.7); z-index:10007; display:flex; align-items:center; justify-content:center; animation:liveFadeIn 0.15s ease; }
.live-pay-dialog { background:#fff; border-radius:12px; width:85%; max-width:320px; overflow:hidden; animation:livePayDialogIn 0.3s ease; }
@keyframes livePayDialogIn { from{opacity:0;transform:scale(0.9);} to{opacity:1;transform:scale(1);} }

.live-pay-dialog-header { background:#07c160; padding:20px 16px; text-align:center; position:relative; }
.live-pay-dialog-header-title { color:#fff; font-size:16px; font-weight:600; }
.live-pay-dialog-header-close { position:absolute; top:4px; right:4px; color:rgba(255,255,255,0.8); cursor:pointer; width:44px; height:44px; padding:0; border:0; border-radius:50%; background:transparent; display:flex; align-items:center; justify-content:center; }
.live-pay-dialog-header-close svg { width:14px; height:14px; }
.live-pay-dialog-amount { color:#fff; font-size:36px; font-weight:700; margin-top:8px; }
.live-pay-dialog-amount small { font-size:16px; font-weight:400; }
.live-pay-dialog-merchant { color:rgba(255,255,255,0.7); font-size:12px; margin-top:4px; }

.live-pay-dialog-body { padding:20px 16px; }
.live-pay-dialog-label { color:#999; font-size:13px; text-align:center; margin-bottom:16px; }

/* ============================================
   支付处理中 & 支付成功动画
   ============================================ */
.live-pay-processing { text-align:center; padding:40px 20px; }
.live-pay-processing-spinner { width:48px; height:48px; border:3px solid #e5e5e5; border-top-color:#07c160; border-radius:50%; animation:livePaySpin 0.8s linear infinite; margin:0 auto 16px; }
@keyframes livePaySpin { to{transform:rotate(360deg);} }
.live-pay-processing-text { color:#666; font-size:14px; }

.live-pay-success { text-align:center; padding:30px 20px 20px; }
.live-pay-success-icon { width:64px; height:64px; border-radius:50%; background:#07c160; display:flex; align-items:center; justify-content:center; margin:0 auto 16px; animation:livePaySuccessPop 0.5s ease; }
@keyframes livePaySuccessPop { 0%{transform:scale(0);} 60%{transform:scale(1.2);} 100%{transform:scale(1);} }
.live-pay-success-icon svg { width:32px; height:32px; color:#fff; }
.live-pay-success-text { color:#333; font-size:18px; font-weight:600; margin-bottom:4px; }
.live-pay-success-detail { color:#999; font-size:13px; margin-bottom:4px; }
.live-pay-success-coins { color:#c0a040; font-size:24px; font-weight:700; margin:12px 0; display:flex; align-items:center; justify-content:center; gap:6px; animation:livePayCoinsIn 0.6s ease 0.3s both; }
@keyframes livePayCoinsIn { from{opacity:0;transform:translateY(20px);} to{opacity:1;transform:translateY(0);} }
.live-pay-success-btn { width:100%; padding:12px; border:none; border-radius:25px; background:#07c160; color:#fff; font-size:15px; font-weight:600; cursor:pointer; margin-top:16px; }
.live-pay-success-btn:active { opacity:0.9; }

/* 金币飘落动画 */
.live-coin-rain { position:fixed; top:0; left:0; right:0; bottom:0; pointer-events:none; z-index:10008; overflow:hidden; }
.live-coin-particle { position:absolute; top:-30px; color:#c0a040; animation:liveCoinFall 1.5s ease forwards; font-size:20px; }
@keyframes liveCoinFall { 0%{transform:translateY(0) rotate(0deg);opacity:1;} 70%{opacity:1;} 100%{transform:translateY(80vh) rotate(720deg);opacity:0;} }

/* ============================================
   充值记录面板
   ============================================ */
.live-recharge-records { padding:16px; }
.live-recharge-record-item { display:flex; align-items:center; gap:12px; padding:12px 0; border-bottom:1px solid #2a2a2a; }
.live-recharge-record-item:last-child { border-bottom:none; }
.live-recharge-record-icon { width:36px; height:36px; border-radius:50%; display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.live-recharge-record-icon.income { background:rgba(192,160,64,0.1); color:#c0a040; }
.live-recharge-record-icon.spend { background:rgba(255,77,106,0.1); color:#ff4d6a; }
.live-recharge-record-info { flex:1; min-width:0; }
.live-recharge-record-desc { color:#f0f0f0; font-size:13px; }
.live-recharge-record-time { color:#666; font-size:11px; margin-top:2px; }
.live-recharge-record-amount { font-size:14px; font-weight:600; }
.live-recharge-record-amount.income { color:#c0a040; }
.live-recharge-record-amount.spend { color:#ff4d6a; }

/* 礼物面板中的充值按钮 */
.live-gift-recharge-btn { min-height:44px; display:flex; align-items:center; justify-content:center; gap:6px; padding:8px 16px; background:rgba(192,160,64,0.12); border:1px solid rgba(192,160,64,0.25); border-radius:22px; color:#c0a040; font:inherit; font-size:12px; font-weight:600; cursor:pointer; margin-left:auto; transition:all 0.2s; }
.live-gift-recharge-btn:active { background:rgba(192,160,64,0.2); }
.live-gift-recharge-btn svg { width:12px; height:12px; }

/* 金币不足提示条 */
.live-gift-insufficient { background:rgba(255,77,106,0.08); color:#ff4d6a; font-size:12px; padding:8px 14px; border-radius:10px; margin-bottom:10px; display:flex; align-items:center; justify-content:space-between; gap:8px; animation:liveDanmakuIn 0.3s ease; }
.live-gift-insufficient-btn { background:#ff4d6a; color:#fff; border:none; padding:4px 14px; border-radius:12px; font-size:11px; font-weight:600; cursor:pointer; flex-shrink:0; }
.live-gift-insufficient-btn:active { opacity:0.8; }

/* 广场金币余额栏 */
.live-plaza-coins-bar { display:flex; align-items:center; justify-content:space-between; padding:10px 16px; margin:0 0 4px; }
.live-plaza-coins-info { display:flex; align-items:center; gap:8px; }
.live-plaza-coins-amount { color:#c0a040; font-size:16px; font-weight:700; }
.live-plaza-coins-label { color:#888; font-size:12px; }
.live-plaza-recharge-btn { padding:6px 16px; background:rgba(192,160,64,0.15); border:1px solid rgba(192,160,64,0.3); border-radius:16px; color:#c0a040; font-size:12px; font-weight:600; cursor:pointer; display:flex; align-items:center; gap:4px; }
.live-plaza-recharge-btn:active { background:rgba(192,160,64,0.25); }

/* ========== [开播通知] 黑白灰韩系弹窗 ========== */
.live-golive-overlay{
  position:fixed; inset:0; z-index:99999;
  display:flex; align-items:center; justify-content:center;
  background:rgba(20,20,22,0.32);
  backdrop-filter:blur(3px); -webkit-backdrop-filter:blur(3px);
  opacity:0; transition:opacity .22s ease;
  padding:32px;
}
.live-golive-overlay.live-golive-show{ opacity:1; }
.live-golive-card{
  width:100%; max-width:300px;
  background:#fafafa; border-radius:24px;
  padding:28px 24px 20px; text-align:center;
  box-shadow:0 18px 50px rgba(0,0,0,.18), 0 2px 8px rgba(0,0,0,.06);
  transform:translateY(14px) scale(.96);
  transition:transform .26s cubic-bezier(.2,.8,.2,1);
}
.live-golive-show .live-golive-card{ transform:translateY(0) scale(1); }
.live-golive-livetag{
  display:inline-flex; align-items:center; gap:5px;
  font-size:11px; font-weight:700; letter-spacing:1px;
  color:#1a1a1a; background:#fff;
  border:1px solid #ececec; border-radius:999px;
  padding:4px 11px; margin-bottom:16px;
}
.live-golive-dot{
  width:6px; height:6px; border-radius:50%; background:#ff4d6a;
  box-shadow:0 0 0 0 rgba(255,77,106,.5);
  animation:liveGoLivePulse 1.6s infinite;
}
@keyframes liveGoLivePulse{
  0%{ box-shadow:0 0 0 0 rgba(255,77,106,.45); }
  70%{ box-shadow:0 0 0 7px rgba(255,77,106,0); }
  100%{ box-shadow:0 0 0 0 rgba(255,77,106,0); }
}
.live-golive-avatar{
  width:72px; height:72px; border-radius:50%;
  object-fit:cover; margin:0 auto 14px; display:block;
  border:3px solid #fff; box-shadow:0 4px 14px rgba(0,0,0,.1);
}
.live-golive-avatar-ph{
  display:flex; align-items:center; justify-content:center;
  background:#ededed; color:#9a9a9a; font-size:30px; font-weight:600;
}
.live-golive-name{ font-size:18px; font-weight:700; color:#1a1a1a; letter-spacing:.5px; }
.live-golive-sub{
  font-size:12.5px; color:#9a9a9a; margin-top:6px; line-height:1.5;
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
}
.live-golive-btns{ display:flex; gap:10px; margin-top:22px; }
.live-golive-btn{
  flex:1; padding:12px 0; border-radius:999px;
  font-size:14px; font-weight:600; cursor:pointer;
  border:none; transition:transform .12s ease, background .15s ease, opacity .15s ease;
}
.live-golive-btn:active{ transform:scale(.97); }
.live-golive-btn-ghost{ background:transparent; color:#9a9a9a; border:1px solid #e2e2e2; }
.live-golive-btn-ghost:active{ background:#f0f0f0; }
.live-golive-btn-primary{ background:#1a1a1a; color:#fff; }
.live-golive-btn-primary:active{ opacity:.85; }

/* 2026-07 完整体验补丁：弹幕、连麦、撤销与快捷开播 */
.live-restart-stream { display:block; width:calc(100% - 28px); min-height:42px; margin:10px 14px 4px; border:1px solid rgba(255,255,255,.12); border-radius:13px; background:rgba(255,255,255,.06); color:#ddd; font-size:13px; }
.live-danmaku-new-count { position:absolute; z-index:26; right:14px; bottom:78px; min-height:44px; padding:0 14px; border:1px solid rgba(255,255,255,.18); border-radius:22px; background:rgba(25,25,25,.92); color:#fff; box-shadow:0 8px 24px rgba(0,0,0,.3); opacity:0; visibility:hidden; transform:translateY(8px); transition:.18s ease; }
.live-danmaku-new-count.show { opacity:1; visibility:visible; transform:none; }
.live-phrase-card h3 { margin:15px 0 8px; color:#aaa; font-size:12px; font-weight:600; }
.live-phrase-list { display:flex; flex-wrap:wrap; gap:8px; }
.live-phrase-list small { color:#777; }
.live-phrase-chip { display:inline-flex; overflow:hidden; border:1px solid rgba(255,255,255,.1); border-radius:18px; background:#2a2a2a; }
.live-phrase-chip button { min-height:34px; padding:0 10px 0 13px; border:0; background:transparent; color:#eee; font-size:13px; }
.live-phrase-chip .live-phrase-remove { display:flex; width:40px; min-width:40px; min-height:40px; padding:0; align-items:center; justify-content:center; color:#888; cursor:pointer; }
.live-phrase-add { display:flex; gap:8px; margin-top:12px; }
.live-phrase-add input { flex:1; min-width:0; min-height:40px; padding:0 11px; border:1px solid #444; border-radius:10px; background:#202020; color:#fff; }
.live-phrase-add button { min-width:58px; border:0; border-radius:10px; background:#444; color:#fff; }
.live-guest-list { display:flex; max-height:55vh; flex-direction:column; gap:7px; overflow:auto; }
.live-guest-row { display:flex; min-height:46px; align-items:center; justify-content:space-between; padding:0 13px; border:1px solid rgba(255,255,255,.08); border-radius:11px; background:#292929; color:#eee; text-align:left; }
.live-guest-row i { color:#999; font-size:12px; font-style:normal; }
.live-guest-row.selected { border-color:rgba(255,77,106,.42); background:rgba(255,77,106,.1); }
.live-guest-row.selected i { color:#ff8295; }
.live-npc-chat-retry { width:38px; height:38px; margin-left:auto; border:0; border-radius:50%; background:transparent; color:#aaa; font-size:21px; }
.live-npc-chat-retry + .live-npc-chat-close { margin-left:0; }
.live-npc-msg-failed .live-npc-msg-bubble { border:1px solid rgba(255,90,110,.25); color:#aaa; }
.live-npc-msg-failed button { margin-left:7px; border:0; background:transparent; color:#ff7186; font:inherit; }
.live-undo-bar { position:fixed; z-index:10040; left:50%; bottom:calc(22px + env(safe-area-inset-bottom)); display:flex; width:min(calc(100% - 28px),420px); min-height:48px; box-sizing:border-box; align-items:center; justify-content:space-between; gap:12px; padding:8px 10px 8px 16px; border:1px solid rgba(255,255,255,.12); border-radius:14px; background:rgba(30,30,30,.97); color:#eee; box-shadow:0 14px 38px rgba(0,0,0,.45); opacity:0; transform:translate(-50%,16px); transition:.2s ease; }
.live-undo-bar.show { opacity:1; transform:translate(-50%,0); }
.live-undo-bar button { min-width:62px; min-height:34px; border:0; border-radius:9px; background:rgba(255,77,106,.14); color:#ff7186; font-weight:700; }
.live-pay-confirm-actions { display:flex; gap:10px; margin-top:24px; }
.live-pay-confirm-actions button { flex:1; min-height:44px; border:0; border-radius:12px; background:#eee; color:#444; font-size:14px; }
.live-pay-confirm-actions button.primary { background:#111; color:#fff; font-weight:700; }
.live-gift-confirm-setting { display:flex; min-height:44px; align-items:center; justify-content:flex-end; gap:7px; padding:0 14px; color:#888; font-size:11px; }
.live-gift-confirm-setting input { accent-color:#ff4d6a; }
.live-section-match-preview { margin-top:12px; padding:10px 11px; border:1px solid rgba(179,136,255,.25); border-radius:9px; background:rgba(179,136,255,.08); color:#c8a9ff; font-size:12px; line-height:1.5; }
@media (max-width:420px) { .live-room-more-grid { grid-template-columns:repeat(3,minmax(0,1fr)); } .live-phrase-card { max-height:76vh; overflow:auto; } }

/* App 内时间选择器与统一触控热区 */
.live-datetime-trigger { display:flex; width:100%; min-height:46px; align-items:center; justify-content:space-between; box-sizing:border-box; margin-top:7px; padding:0 13px; border:1px solid #3b3b3b; border-radius:11px; background:#262626; color:#eee; font-size:14px; text-align:left; }
.live-datetime-trigger::after { content:'选择'; color:#ff7186; font-size:12px; font-weight:700; }
.live-datetime-picker { max-width:440px; }
.live-datetime-picker-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; }
.live-datetime-picker-grid label { min-width:0; color:#999; font-size:12px; }
.live-datetime-picker-grid select { display:block; width:100%; height:46px; box-sizing:border-box; margin-top:7px; padding:0 9px; border:1px solid #3b3b3b; border-radius:11px; background:#262626; color:#eee; color-scheme:dark; font-size:15px; }
.live-delete-choice-actions { flex-wrap:wrap; }
.live-delete-choice-actions button { min-width:110px; }
.live-panel-close { min-width:40px; min-height:40px; padding:0; border:0; border-radius:50%; background:transparent; color:#999; font-size:22px; }
.live-room-close { min-width:44px; width:44px; height:44px; padding:0; border:0; font:inherit; }
.live-history-actions { min-width:44px; min-height:44px; padding:0; border:0; background:transparent; font:inherit; }
.live-task-head button,.live-context-tip button,.live-trash-item button,.live-admin-row button,.live-section-mgr-item-actions button,.live-phrase-chip button,.live-undo-bar button,.live-npc-chat-retry,.live-npc-msg-failed button { min-width:40px !important; min-height:40px !important; }
#layer-live button,#layer-live-room button,.live-editor-overlay button,.live-guide-overlay button { touch-action:manipulation; }
#layer-live button:focus-visible,#layer-live-room button:focus-visible,.live-editor-overlay button:focus-visible,.live-guide-overlay button:focus-visible { outline:2px solid #ff8ca0; outline-offset:2px; }
.live-plaza-recharge-btn { min-height:40px; }
.live-plaza-menu-action:focus-visible,.live-plaza-menu-close:focus-visible { outline:2px solid #ff6b82; outline-offset:-3px; }
@media (max-width:360px) { .live-datetime-picker-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }