:root{--bg:#0a0f1e;--panel:#111a2c;--panel2:#172238;--line:#26344d;--text:#edf2ff;--muted:#8d9ab3;--accent:#8c72ff;--accent2:#55d6be;--danger:#ff8497}*{box-sizing:border-box}body{margin:0;font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif;color:var(--text);background:var(--bg)}button,input,textarea{font:inherit}button{cursor:pointer}.auth-bg{min-height:100vh;display:grid;place-items:center;padding:24px;background:radial-gradient(ellipse at 20% 10%,#202754 0,transparent 48%),radial-gradient(ellipse at 90% 90%,#173b43 0,transparent 45%),#090e1b}.auth-card{width:min(440px,100%);padding:38px;border:1px solid #303b59;border-radius:28px;background:rgba(17,26,44,.91);box-shadow:0 28px 90px #0006}.brand-mark{width:54px;height:54px;display:grid;place-items:center;border-radius:18px;background:linear-gradient(135deg,#9a80ff,#5d50d9);font-size:27px;box-shadow:0 8px 30px #7962ff40}.brand-mark.small{width:42px;height:42px;font-size:20px;border-radius:14px}.eyebrow{font-size:10px;letter-spacing:2.2px;color:#9b8aff;font-weight:800;margin:22px 0 10px}.auth-card h1{font-size:29px;letter-spacing:-1px;margin:0 0 10px}.muted{color:var(--muted)}.auth-card>p{line-height:1.7}.auth-card label{display:block;font-size:12px;color:#b6c1d6;margin:20px 0 8px}.auth-card input{width:100%;padding:14px 15px;background:#0b1221;border:1px solid #2d3a54;border-radius:12px;color:white;outline:none}.auth-card input:focus,textarea:focus{border-color:#8c72ff}.primary,.send-btn{background:linear-gradient(135deg,#9b80ff,#7058ef);color:white;border:0;border-radius:12px;font-weight:700;padding:13px 18px}.full{width:100%;margin-top:22px}.link-btn{background:none;border:0;color:#b8aaff;margin-top:17px;padding:8px 0}.tiny{font-size:11px;line-height:1.6}.error{padding:10px;background:#502532;border-radius:10px;color:#ffc3cc;margin:12px 0}.chat-bg{height:100vh;overflow:hidden;background:radial-gradient(ellipse at 70% 0,#182344 0,transparent 40%),#0a0f1e}.app-shell{display:grid;grid-template-columns:310px minmax(0,1fr);height:100vh;max-width:1800px;margin:auto;border-inline:1px solid #202c43}.sidebar{background:rgba(14,22,38,.95);border-right:1px solid var(--line);display:flex;flex-direction:column;min-height:0}.side-top{padding:22px 20px 18px;display:flex;justify-content:space-between;align-items:center}.brand{display:flex;align-items:center;gap:12px}.brand b{display:block;font-size:17px}.brand small{display:block;color:#7585a3;font-size:9px;letter-spacing:2px;margin-top:4px}.icon-btn{width:38px;height:38px;border-radius:12px;background:#252b4b;border:1px solid #3a4168;color:#dcd5ff;font-size:25px}.me-card{display:flex;align-items:center;gap:11px;padding:14px 18px;margin:0 14px 20px;background:#182238;border:1px solid #283651;border-radius:16px}.avatar,.msg-avatar,.conv-avatar{display:grid;place-items:center;flex-shrink:0;background:linear-gradient(135deg,#8c72ff,#3b8fbb);border-radius:13px;font-weight:700}.avatar{width:40px;height:40px}.me-info{min-width:0;flex:1}.me-info b,.me-info small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.me-info small{font-size:11px;color:#91a0ba;margin-top:5px}.logout{font-size:11px;color:#a5b1c9;text-decoration:none}.section-title{display:flex;justify-content:space-between;align-items:center;padding:0 21px 12px;color:#8796b1;font-size:12px}.text-btn{border:0;background:none;color:#b8aaff;font-size:12px}.conversation-list{overflow-y:auto;flex:1;padding:0 10px}.conversation{width:100%;display:flex;align-items:center;gap:11px;padding:12px 10px;border:1px solid transparent;background:transparent;border-radius:14px;color:var(--text);text-align:left;margin-bottom:4px}.conversation:hover,.conversation.active{background:#1c2942;border-color:#2b3b59}.conv-avatar{width:42px;height:42px;background:linear-gradient(135deg,#334e71,#745dba)}.conv-content{min-width:0;flex:1}.conv-content b,.conv-content small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.conv-content b{font-size:13px}.conv-content small{font-size:11px;color:#8999b4;margin-top:5px}.conv-type{font-size:10px;color:#8798b7;background:#26344b;border-radius:6px;padding:4px}.empty-small{color:#7585a3;text-align:center;padding:35px 15px;font-size:12px;line-height:2}.side-bottom{padding:15px 18px;border-top:1px solid var(--line);font-size:10px;color:#8492ab}.side-bottom a{float:right;color:#a99bff;text-decoration:none}.online-dot{display:inline-block;width:6px;height:6px;background:#55d6be;border-radius:50%;margin-right:6px}.chat-main{display:flex;flex-direction:column;min-width:0;min-height:0}.chat-header{height:95px;flex-shrink:0;display:flex;align-items:center;justify-content:space-between;padding:0 34px;border-bottom:1px solid var(--line);background:#0e1728b8}.chat-header .eyebrow{margin:0 0 6px;font-size:9px}.chat-header h2{margin:0;font-size:20px}.chat-header p{margin:5px 0 0;font-size:11px}.secure-label{border:1px solid #2b4252;background:#142b36;border-radius:20px;padding:8px 12px;font-size:10px;color:#76d9c6}.messages{flex:1;overflow-y:auto;padding:28px clamp(16px,4vw,60px);display:flex;flex-direction:column;gap:20px}.welcome{margin:auto;text-align:center;max-width:450px;color:#a9b5cc}.welcome-orb{width:80px;height:80px;display:grid;place-items:center;margin:0 auto 24px;border-radius:27px;background:linear-gradient(145deg,#31355e,#1b4d58);box-shadow:0 0 65px #7761ff24;font-size:36px;color:#c7bcff}.welcome h2{font-size:22px;line-height:1.6;color:#e7eaff}.welcome p{font-size:13px;line-height:1.8}.message-row{display:flex;align-items:flex-start;gap:10px;max-width:78%}.message-row.mine{align-self:flex-end;flex-direction:row-reverse}.msg-avatar{width:30px;height:30px;border-radius:10px;font-size:12px;background:linear-gradient(135deg,#476889,#4c8c91)}.msg-stack{min-width:0}.msg-meta{font-size:10px;color:#a1aec5;margin:0 0 7px}.msg-meta span{margin-left:8px;color:#667792}.mine .msg-meta{text-align:right}.bubble{padding:12px 14px;background:#1a2740;border:1px solid #293954;border-radius:4px 16px 16px 16px;max-width:100%;overflow-wrap:anywhere}.mine-bubble{background:linear-gradient(135deg,#6554c5,#4d4fa7);border-color:#8272e3;border-radius:16px 4px 16px 16px}.bubble-text{font-size:13px;line-height:1.7;white-space:normal}.media-image{display:block;max-width:min(360px,100%);max-height:380px;border-radius:10px;cursor:zoom-in}.media-video{display:block;width:min(380px,100%);max-height:320px;border-radius:10px}.media-audio{width:min(280px,65vw);height:38px}.flash-card{display:flex;flex-direction:column;gap:8px;background:#2b2453;color:#e9e4ff;border:1px solid #8272e3;padding:15px;border-radius:12px}.flash-card small{font-size:10px;color:#bcb2ef}.flash-open-image{display:block;max-width:300px;max-height:300px;border-radius:12px}.composer-wrap{padding:15px clamp(14px,3vw,40px) 18px;border-top:1px solid var(--line);background:#0f1829}.composer-tools{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:12px}.tool-btn{border:1px solid #2b3953;background:#18243a;color:#aab8d1;border-radius:9px;padding:8px 11px;font-size:11px}.tool-btn:hover,.tool-btn.selected{border-color:#8c72ff;color:#d8d0ff;background:#282448}.composer{display:flex;align-items:flex-end;gap:12px;background:#172238;border:1px solid #30405c;border-radius:16px;padding:8px 9px 8px 16px}.composer textarea{flex:1;resize:vertical;min-height:42px;max-height:130px;background:transparent;border:0;color:white;outline:none;padding:10px 0;font-size:13px}.send-btn{padding:12px 17px;white-space:nowrap}.send-btn:disabled{opacity:.5}.composer-foot{font-size:10px;color:#667792;text-align:center;margin-top:10px}.flash-notice{font-size:11px;color:#d0c5ff;padding:0 0 10px}.admin-bg{min-height:100vh;padding:30px 4vw;background:radial-gradient(ellipse at 10% 0,#20264b 0,transparent 40%),#0a0f1e}.admin-shell{max-width:1400px;margin:auto}.admin-head{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:25px}.admin-head .eyebrow{margin:0 0 8px}.admin-head h1{font-size:28px;margin:0}.admin-head p{font-size:12px}.secondary-btn{padding:11px 15px;color:#dcd5ff;border:1px solid #3b4162;background:#1b2340;border-radius:10px;text-decoration:none;font-size:12px}.filter-form{display:flex;gap:10px;flex-wrap:wrap;padding:16px;background:#121b2e;border:1px solid #27354f;border-radius:14px;margin-bottom:18px}.filter-form input{min-width:150px;flex:1;background:#0b1322;color:white;border:1px solid #30405c;padding:11px;border-radius:9px}.table-wrap{overflow:auto;border:1px solid #293650;border-radius:14px;background:#111a2b}table{width:100%;border-collapse:collapse;min-width:750px}th,td{text-align:left;padding:13px 15px;border-bottom:1px solid #26334b;font-size:12px;vertical-align:top}th{color:#aebbd3;background:#19243a;font-weight:600}td{color:#d4dced}td small{display:block;color:#8292ae;margin-top:4px}td a{color:#b8aaff}.admin-shell>.tiny{margin-top:15px}@media(max-width:760px){.app-shell{grid-template-columns:78px minmax(0,1fr)}.side-top{padding:15px 12px;justify-content:center}.brand{gap:0}.brand>div,.icon-btn,.me-info,.logout,.section-title,.conv-content,.conv-type,.side-bottom{display:none}.me-card{margin:0 8px 14px;padding:8px;justify-content:center;border:0;background:transparent}.avatar{width:42px;height:42px}.conversation-list{padding:0 7px}.conversation{padding:8px;justify-content:center}.conv-avatar{width:43px;height:43px}.chat-header{padding:0 16px;height:78px}.chat-header h2{font-size:17px}.secure-label{display:none}.messages{padding:18px 12px}.message-row{max-width:94%}.composer-wrap{padding:12px 10px}.tool-btn{padding:7px 8px;font-size:10px}.composer{padding-left:10px}.send-btn{padding:11px}.admin-head{align-items:flex-start}.auth-card{padding:28px}}

.vip-rgb{font-weight:800;animation:vipRgb 1.4s linear infinite}@keyframes vipRgb{0%{color:#ff4d6d}25%{color:#ffe66d}50%{color:#55f2b8}75%{color:#58a6ff}100%{color:#d66bff}}.user-title{color:#ff5964;font-weight:800}.msg-avatar-img{width:30px;height:30px;object-fit:cover;border-radius:10px;flex-shrink:0}

/* 用户中心显示修复：底部导航分隔与消息头像/头衔/VIP */
.side-bottom{display:flex;align-items:center;justify-content:flex-start;flex-wrap:wrap;gap:8px 12px;line-height:1.8;padding:14px 16px;font-size:11px}
.side-bottom a{float:none;display:inline-flex;align-items:center;white-space:nowrap;padding:3px 0;margin:0;color:#b9adff}
.side-bottom a:hover{color:#fff;text-decoration:underline}
.side-bottom .online-dot{flex:0 0 6px;margin-right:0}
.side-bottom .nav-links{display:flex;flex-wrap:wrap;align-items:center;gap:6px 12px;width:100%;padding-left:12px}
.side-bottom .nav-links a{padding:2px 0}
.msg-meta{display:flex;align-items:center;gap:7px;flex-wrap:wrap;line-height:1.7}
.msg-meta .msg-nickname{display:inline-block;margin:0;color:#a1aec5}
.msg-meta .msg-time{margin-left:auto;color:#667792;font-size:10px;white-space:nowrap}
.message-row.mine .msg-meta{justify-content:flex-end}
.message-row.mine .msg-meta .msg-time{margin-left:4px}
.vip-rgb{font-weight:900!important;animation:vipRgb .9s linear infinite;text-shadow:0 0 8px #ffffff22}
.user-title{display:inline-block;color:#ff5964!important;font-weight:800;white-space:nowrap}
.msg-avatar-img{display:block;width:30px;height:30px;object-fit:cover;border-radius:10px;flex-shrink:0;border:1px solid #53627e}
@media(max-width:760px){.side-bottom{display:none}}
.dynamic-id-badge{display:inline-block!important;margin-left:7px!important;padding:2px 6px;border-radius:6px;border:1px solid #a98bff;background:linear-gradient(110deg,#5637a6,#234e6a,#744a9e);color:#fff!important;font-size:9px;font-weight:800;letter-spacing:.2px;box-shadow:0 0 12px #9275ff40;animation:id-shimmer 2.4s ease-in-out infinite}.user-id-badge{display:inline-block!important;margin-left:7px!important;padding:2px 5px;border-radius:5px;background:#26344b;color:#94a6c4!important;font-size:9px}@keyframes id-shimmer{0%,100%{filter:brightness(1)}50%{filter:brightness(1.35)}}
/* v3.1 mobile chat action fix: keep new-chat controls visible above the compact sidebar */
@media(max-width:760px){
  .side-top{position:relative;overflow:visible;min-height:70px}
  #newPrivate.icon-btn{display:grid!important;place-items:center;position:fixed;left:18px;bottom:calc(20px + env(safe-area-inset-bottom));z-index:1000;width:48px;height:48px;padding:0;border-radius:50%;border:1px solid #7767d8;background:linear-gradient(135deg,#6554c5,#3d6f88);color:#fff;font-size:25px;line-height:1;box-shadow:0 10px 30px #0008,0 0 0 4px #7866d51c}
  #newPrivate.icon-btn:active{transform:scale(.96)}
  .section-title{display:flex!important;position:fixed;left:12px;bottom:calc(76px + env(safe-area-inset-bottom));z-index:999;padding:0;font-size:0}
  #newGroup.text-btn{display:grid!important;place-items:center;width:58px;height:34px;padding:0;border:1px solid #334564;border-radius:17px;background:#17243a;color:#cfc8ff;font-size:11px;box-shadow:0 8px 24px #0006}
  #newGroup.text-btn::first-letter{font-size:14px}
  .conversation-list{padding-bottom:132px}
}


/* v3.3 mobile layout: true phone layout + always-visible private-chat action */
.mobile-private-label{display:none}
@media(max-width:1024px){
  html,body.chat-bg{width:100%;max-width:100%;overflow:hidden}
  .app-shell{width:100%;max-width:none;grid-template-columns:68px minmax(0,1fr);height:100dvh;margin:0;border:0}
  .sidebar{width:68px;min-width:68px;overflow:visible;position:relative;z-index:30}
  .side-top{padding:12px 8px 8px;min-height:62px;justify-content:center;overflow:visible}
  .brand{gap:0}.brand>div,.me-info,.logout,.section-title,.conv-content,.conv-type,.side-bottom{display:none!important}
  .brand-mark.small{width:44px;height:44px;border-radius:15px}
  .me-card{margin:4px 7px 10px;padding:6px;justify-content:center;border:0;background:transparent}
  .avatar{width:44px;height:44px}
  .conversation-list{padding:0 6px 110px;overflow-x:hidden}
  .conversation{padding:6px;margin:2px 0;justify-content:center}
  .conv-avatar{width:44px;height:44px}
  .chat-main{width:100%;min-width:0;overflow:hidden}
  .chat-header{height:auto;min-height:82px;padding:12px 12px;gap:8px;align-items:flex-start}
  .chat-header>div:first-child{min-width:0;flex:1}
  .chat-header h2{font-size:18px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .chat-header p{line-height:1.35;max-width:240px}
  .header-actions{display:flex;gap:6px;flex:0 0 auto;max-width:46%;overflow-x:auto;scrollbar-width:none}
  .header-actions::-webkit-scrollbar{display:none}
  .header-actions .secure-label{display:none}
  .header-actions .secondary-btn{padding:8px 9px;border-radius:10px;font-size:0;min-width:38px;height:38px;display:grid;place-items:center}
  .header-actions .secondary-btn[href="music.php"]::before{content:'♫';font-size:18px}
  .header-actions .secondary-btn[href="fun.php"]::before{content:'✦';font-size:16px}
  .messages{padding:16px 10px 18px;gap:16px}
  .message-row{max-width:96%}.bubble{padding:10px 12px}.bubble-text{font-size:14px}
  .composer-wrap{padding:9px 8px calc(10px + env(safe-area-inset-bottom));background:#0f1829}
  .composer-tools{gap:6px;margin-bottom:8px;overflow-x:auto;flex-wrap:nowrap;scrollbar-width:none}
  .composer-tools::-webkit-scrollbar{display:none}.tool-btn{flex:0 0 auto;padding:7px 9px}
  .composer{gap:7px;padding:6px 7px 6px 10px;border-radius:14px}.composer textarea{font-size:14px;min-height:38px;padding:8px 0}.send-btn{padding:10px 12px}.composer-foot{display:none}
  #newPrivate.icon-btn{display:grid!important;place-items:center;position:fixed;left:10px;bottom:calc(18px + env(safe-area-inset-bottom));z-index:2000;width:48px;height:48px;padding:0;border-radius:16px;border:1px solid #8d7aff;background:linear-gradient(135deg,#8068f5,#3c8cab);color:#fff;font-size:28px;line-height:1;box-shadow:0 10px 28px #0009,0 0 0 3px #7c68ef26}
  #newPrivate.icon-btn::after{content:'私聊';position:absolute;left:52px;white-space:nowrap;font-size:10px;font-weight:700;color:#e8e4ff;background:#202a45;border:1px solid #3b4a6d;border-radius:7px;padding:4px 6px;box-shadow:0 5px 14px #0007}
  #newGroup.text-btn{display:none!important}
}
@media(max-width:420px){
  .app-shell{grid-template-columns:60px minmax(0,1fr)}.sidebar{width:60px;min-width:60px}.brand-mark.small,.avatar,.conv-avatar{width:40px;height:40px}.chat-header{padding:10px}.chat-header p{max-width:180px}.header-actions{max-width:88px}.messages{padding-inline:8px}.send-btn span{display:none}
  #newPrivate.icon-btn{left:6px;width:46px;height:46px}
}
\n/* v3.4: mobile viewport/browser-toolbar fix */\n@media(max-width:1024px){\n  html,body.chat-bg{height:var(--app-height,100dvh);min-height:var(--app-height,100dvh);overscroll-behavior:none}\n  .app-shell{height:var(--app-height,100dvh);min-height:0}\n  .chat-main{height:var(--app-height,100dvh);min-height:0}\n  .messages{min-height:0}\n  .composer-wrap{flex:0 0 auto;position:relative;z-index:60;padding-bottom:calc(14px + env(safe-area-inset-bottom,0px));}\n}\n
/* Miyang Anime Academy theme v1 — site-wide skin */
:root{--bg:#160f2b!important;--panel:#251a40!important;--panel2:#31204f!important;--line:#76528f!important;--text:#fff4fb!important;--muted:#d0b9e5!important;--accent:#ff82c5!important;--accent2:#8fe8f2!important;--danger:#ff789b!important}
html{background:#160f2b}
body{color:#fff4fb!important;background:radial-gradient(ellipse at 10% 0%,#63346c 0,transparent 34%),radial-gradient(ellipse at 100% 15%,#204b6a 0,transparent 32%),linear-gradient(145deg,#160f2b,#201535 55%,#101c34)!important}
body:before{content:"";position:fixed;inset:0;z-index:0;pointer-events:none;background:linear-gradient(120deg,#1a0d2870,#142b4660);opacity:.45}
.auth-bg{background:radial-gradient(ellipse at 15% 10%,#663665 0,transparent 48%),radial-gradient(ellipse at 90% 90%,#164a62 0,transparent 45%),#160f2b!important}
.auth-card,.admin-shell,.uc,.music-card,.music-top,.me-card,.conversation,.conv-item,.composer,.messages,.chat-header,.fun-card,.table-wrap,.music-admin-card,.filter-form,.profile-card{border-color:#78558f!important;box-shadow:0 18px 55px #09031370,0 0 0 1px #ffb8df0c!important}
.auth-card{background:linear-gradient(145deg,#342047f2,#1b203cf2)!important;backdrop-filter:blur(14px);border-radius:28px!important}
.brand-mark,.avatar,.msg-avatar,.conv-avatar{background:linear-gradient(135deg,#ff8fc9,#aa8cff 58%,#73dbe8)!important;box-shadow:0 8px 28px #ff85c533!important}
.primary,.send-btn,.play,.auth-card .primary{background:linear-gradient(120deg,#ff83c4,#bd8cff 55%,#8be6ef)!important;color:#251338!important;border:1px solid #ffd2eb66!important;box-shadow:0 8px 25px #f77dc32b!important}
.secondary-btn,.tool-btn,.icon-btn,.text-btn,.link-btn,.logout,.nav-links a,.store-link,.official-links a{border-color:#8a65a5!important;background:linear-gradient(135deg,#39264f,#292644)!important;color:#ffe9f7!important}
input,textarea,select,.track-search,.provider-select,.auth-card input,.uc input,.music-admin-card input,.music-admin-card textarea{background:#151128eF!important;color:#fff4fb!important;border-color:#76538f!important}
input:focus,textarea:focus,select:focus{outline:none!important;border-color:#ff91cc!important;box-shadow:0 0 0 3px #ff8bc522!important}
.sidebar{background:linear-gradient(180deg,#211832f5,#12192df5)!important;border-color:#76528f!important;backdrop-filter:blur(16px)}
.me-card,.conversation-item,.conversation,.conv-item,.chat-header,.composer-wrap,.composer,.music-admin-card,.uc-card,.fun-card,.table-wrap,.filter-form{background:linear-gradient(140deg,#302044f0,#1a2039f2)!important}
.chat-main{background:linear-gradient(145deg,#171126d9,#101a2bd9)!important}
.messages{background:radial-gradient(ellipse at 70% 20%,#58316422,transparent 50%)!important}
.bubble,.message-bubble{border-color:#8a6aa0!important;box-shadow:0 8px 22px #08041230!important}
.track{background:linear-gradient(100deg,#382449,#22223f)!important;border-color:#6b4d81!important;color:#fff4fb!important}
.track:hover,.track.active{background:linear-gradient(100deg,#693c6b,#30375c)!important;border-color:#ff9bcf!important}
.music-top{background:linear-gradient(115deg,#4b2858f2,#1a3550f2)!important}
.music-card{background:linear-gradient(155deg,#302044f7,#19172ff7)!important}
.admin-head,.chat-header,.music-top{position:relative;overflow:hidden}
.admin-head:after,.chat-header:after{content:"✦ ｡ﾟ☆  ♡  ☆ﾟ｡ ✦";position:absolute;right:20px;bottom:8px;color:#ffb8df7a;letter-spacing:5px;pointer-events:none}
.eyebrow{color:#ffa8d7!important;text-shadow:0 0 18px #ff86c844}
.muted,.tiny,.music-note,.hint{color:#d0b9e5!important}
.nav-links a:hover,.secondary-btn:hover,.tool-btn:hover,.official-links a:hover{border-color:#ff9bcf!important;box-shadow:0 0 20px #ff8bc51c!important;transform:translateY(-1px)}
.status-msg{background:#203f49!important;color:#b8f8ee!important}.status-err,.error{background:#542541!important;color:#ffd1e4!important}
@media(max-width:1024px){body:before{opacity:.32}}
@media(max-width:760px){body:before{opacity:.24}.auth-card{padding:25px!important}.admin-shell,.uc,.music-layout{padding-left:12px!important;padding-right:12px!important}.music-top,.music-card{border-radius:20px!important}}

body>*{position:relative;z-index:1}


/* V3.13 fix: keep anime art inside the chat panel; never overflow viewport */
.app-shell{position:relative;isolation:isolate;overflow:hidden}
.chat-main{position:relative;isolation:isolate;overflow:hidden}
.chat-main::before{content:"";position:absolute;z-index:0;pointer-events:none;right:0;bottom:76px;width:min(34vw,520px);height:min(72vh,760px);background:url('anime-schoolgirl.png') right bottom / contain no-repeat;opacity:.105;filter:saturate(.9);mask-image:linear-gradient(to left,black 55%,transparent 100%)}
.chat-main>*{position:relative;z-index:1}
@media(max-width:1024px){.chat-main::before{width:min(42vw,360px);height:56vh;bottom:76px;opacity:.075}}
@media(max-width:760px){.chat-main::before{width:220px;height:42vh;right:-12px;bottom:76px;opacity:.055;mask-image:linear-gradient(to left,black 35%,transparent 100%)}}


/* V3.15 mobile viewport + composer fix */
@media (max-width: 1024px) {
  html, body.chat-bg {
    width: 100%;
    height: var(--app-height, 100dvh) !important;
    min-height: 0 !important;
    max-height: var(--app-height, 100dvh);
    overflow: hidden !important;
  }
  body.chat-bg {
    position: fixed !important;
    top: var(--app-top, 0px);
    left: 0;
    right: 0;
    margin: 0;
  }
  body.chat-bg > .app-shell {
    width: 100%;
    height: var(--app-height, 100dvh) !important;
    min-height: 0 !important;
    max-height: var(--app-height, 100dvh);
    overflow: hidden;
    grid-template-rows: minmax(0, 1fr);
  }
  .chat-main {
    height: 100% !important;
    min-height: 0 !important;
    max-height: 100%;
    overflow: hidden;
  }
  .messages {
    flex: 1 1 0;
    min-height: 0;
    overflow-y: auto;
    overscroll-behavior: contain;
  }
  .composer-wrap {
    flex-shrink: 0;
    padding-top: 10px !important;
    padding-bottom: calc(10px + env(safe-area-inset-bottom, 0px)) !important;
  }
  .composer-tools { max-width: 100%; }
  .composer { min-width: 0; }
  .composer textarea { min-width: 0; max-height: 96px; }
}
@media (max-width: 760px) {
  .chat-header { min-height: 72px; height: auto; padding: 10px 12px; gap: 8px; }
  .chat-header h2 { font-size: 16px; }
  .chat-header p { font-size: 10px; line-height: 1.35; }
  .header-actions { display: flex; align-items: center; gap: 5px; }
  .header-actions .secure-label { display: none; }
  .header-actions .secondary-btn { font-size: 10px; padding: 7px 8px; white-space: nowrap; }
  .composer-tools { margin-bottom: 7px; }
  .tool-btn { padding: 7px 8px; }
  .composer textarea { font-size: 14px; }
  .composer-foot { display: none; }
}


/* V3.16: mobile header cleanup, pause music entry, remove chat anime wallpaper */
.chat-main::before{display:none!important;content:none!important;background:none!important}
.chat-header:after{pointer-events:none}
.music-dev-badge{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:38px;padding:8px 12px;border:1px solid #8a65a5;border-radius:10px;background:linear-gradient(135deg,#39264f,#292644);color:#ffe9f7;opacity:.92;cursor:pointer;white-space:nowrap;text-decoration:none;transition:opacity .15s,border-color .15s,box-shadow .15s,transform .15s}
.music-dev-badge:hover{opacity:1;border-color:#ff9bcf;box-shadow:0 0 20px #ff8bc51c;transform:translateY(-1px)}
.music-dev-badge b{font-size:17px;line-height:1}
.music-dev-badge small{font-size:11px;color:#e4c8f3}
.nav-music-dev{display:inline-flex;align-items:center;gap:4px;color:#c6a9da;padding:2px 0;opacity:.8;cursor:pointer}
.nav-music-link{color:#ffe9f7!important;padding:2px 0}
@media(max-width:1024px){
  .chat-header{position:relative;display:flex;align-items:center;gap:8px;overflow:hidden}
  .chat-header>div:first-child{min-width:0;flex:1}
  .header-actions{display:flex;align-items:center;justify-content:flex-end;gap:6px;min-width:0;max-width:none;flex:0 0 auto;overflow:visible}
  .header-actions .music-dev-badge{width:58px;min-width:58px;height:38px;min-height:38px;padding:3px 2px;display:flex;flex-direction:column;gap:1px;border-radius:10px}
  .header-actions .music-dev-badge b{font-size:16px}
  .header-actions .music-dev-badge small{font-size:9px;line-height:1.1}
  .header-actions .secondary-btn[href="fun.php"]{width:38px;min-width:38px;height:38px;padding:0;font-size:0;display:grid;place-items:center}
  .header-actions .secondary-btn[href="fun.php"]::before{content:'✦';font-size:17px}
  .chat-header:after{display:none!important;content:none!important}
}
@media(max-width:420px){
  .chat-header{min-height:78px;padding:9px 8px;gap:5px}
  .chat-header>div:first-child{max-width:calc(100% - 108px)}
  .chat-header h2{font-size:15px;max-width:100%}
  .chat-header p{font-size:10px;max-width:100%;overflow-wrap:anywhere}
  .header-actions{gap:4px;max-width:none}
  .header-actions .music-dev-badge{width:54px;min-width:54px;height:36px;min-height:36px}
  .header-actions .secondary-btn[href="fun.php"]{width:35px;min-width:35px;height:36px}
}


/* V3.17: ephemeral dice game cards and winner-only prompt modal */
.dice-game-btn{border-color:#d58bd2;background:linear-gradient(135deg,#38244d,#263956);color:#ffe2f4;white-space:nowrap}
.dice-game-btn:disabled{opacity:.7}
.dice-game-result{align-self:center;width:min(420px,96%);padding:14px 16px;border:1px solid #a979c8;border-radius:18px;background:linear-gradient(145deg,#2a1d40f5,#172a42f5);box-shadow:0 12px 35px #09031365;color:#f9eaff;animation:diceCardIn .28s ease-out}
.dice-game-top{display:flex;align-items:center;justify-content:space-between;gap:10px;font-weight:800;font-size:13px;color:#ffd6f0}
.dice-game-top small{font-size:10px;color:#bba8d6;font-weight:400}
.dice-vs-row{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:10px;margin:15px 0 10px}
.dice-player{display:flex;flex-direction:column;align-items:center;gap:6px;min-width:0}.dice-label{font-size:11px;color:#d9c9ee;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.dice-face{display:grid;place-items:center;width:66px;height:66px;border-radius:17px;border:1px solid #b995ec;background:linear-gradient(145deg,#6d4ba1,#344f78);font-size:42px;color:#fff;box-shadow:inset 0 0 20px #fff1,0 5px 18px #0003}.dice-face.rolling{animation:diceRoll .16s linear infinite}.dice-player b{font-size:12px}.dice-vs{font-size:13px;font-weight:900;color:#ff9bd2;text-shadow:0 0 15px #ff8ddc80}.dice-game-outcome{text-align:center;font-size:13px;font-weight:800;color:#ffe0a9;padding:9px 5px;border-top:1px solid #ffffff16}.dice-game-foot{text-align:center;font-size:10px;line-height:1.5;color:#a99bc5}
.dice-prompt-backdrop{position:fixed;inset:0;z-index:5000;display:grid;place-items:center;padding:20px;background:#090713c9;backdrop-filter:blur(9px)}.dice-prompt-modal{width:min(420px,100%);padding:25px 22px 22px;text-align:center;border:1px solid #d88dc7;border-radius:24px;background:radial-gradient(ellipse at top,#533568,#201a39 65%);box-shadow:0 25px 90px #0009;color:#fff4fb;animation:diceCardIn .25s ease-out}.dice-prompt-spark{font-size:27px;color:#ffc3e8}.dice-prompt-kicker{font-size:9px;letter-spacing:2px;color:#d6b6f4;font-weight:800}.dice-prompt-modal h2{font-size:21px;margin:12px 0 17px}.dice-prompt-question{padding:18px 14px;border:1px solid #9264b0;border-radius:15px;background:#120f28;color:#ffe4f5;font-size:17px;line-height:1.8;font-weight:700}.dice-prompt-note{font-size:11px;line-height:1.7;color:#c7b5d9;margin:14px 0 18px}.dice-prompt-close{width:100%;border-radius:12px}
@keyframes diceRoll{0%{transform:rotate(-8deg) scale(.96)}50%{transform:rotate(8deg) scale(1.04)}100%{transform:rotate(-8deg) scale(.96)}}@keyframes diceCardIn{from{opacity:0;transform:translateY(8px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}
@media(max-width:760px){.dice-game-btn{font-size:10px;padding:7px 9px}.dice-game-result{padding:12px;width:100%}.dice-face{width:54px;height:54px;font-size:35px;border-radius:14px}.dice-vs-row{gap:6px}.dice-prompt-modal{padding:22px 17px}.dice-prompt-modal h2{font-size:19px}}

/* V3.18 group chat management */
.section-actions{display:flex;align-items:center;gap:8px}.group-id-chip{display:inline-flex;align-items:center;white-space:nowrap;padding:3px 8px;border-radius:7px;border:1px solid #b58ce7;background:#382653;color:#f4dfff;font-size:10px;font-weight:800}.small-group-id{font-size:9px;padding:2px 5px;margin-left:5px}.group-info-toggle{white-space:nowrap}.group-info-panel{flex:0 0 auto;max-height:34vh;overflow:auto;padding:12px 20px 14px;border-bottom:1px solid #76528f;background:linear-gradient(120deg,#261a3cfa,#17233bf5);box-shadow:0 8px 24px #0002}.group-info-top{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:9px}.group-info-top>div{display:flex;align-items:center;gap:9px;min-width:0}.group-info-top b{font-size:13px}.group-announcement{padding:9px 12px;border:1px solid #674d7c;background:#1a1730;border-radius:10px;margin-bottom:10px}.group-announcement b{font-size:11px;color:#ffc2e1}.group-announcement p{margin:5px 0 0;font-size:12px;line-height:1.55;white-space:pre-wrap;overflow-wrap:anywhere;color:#e7dff5}.group-admin-controls{display:flex;gap:7px;flex-wrap:wrap;margin-bottom:10px}.danger-tool{border-color:#9e4b6c!important;color:#ffb6c8!important}.group-info-columns{display:grid;grid-template-columns:minmax(180px,1fr) minmax(180px,1fr);gap:12px}.group-info-block{min-width:0;border:1px solid #443354;background:#18172b;border-radius:10px;padding:9px 10px}.group-info-block> b{display:block;font-size:11px;margin-bottom:7px;color:#e6d6fa}.group-members,.group-files{display:flex;flex-direction:column;gap:5px}.group-member-row{display:flex;align-items:center;gap:8px;min-width:0;padding:5px 0;border-bottom:1px solid #ffffff0b}.group-member-avatar{width:28px;height:28px;display:grid;place-items:center;flex:0 0 28px;border-radius:9px;background:linear-gradient(135deg,#d17ab8,#7789e8);font-size:11px;font-weight:800}.group-member-name{min-width:0;flex:1}.group-member-name b,.group-member-name small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.group-member-name b{font-size:11px}.group-member-name small{font-size:9px;color:#b9a7ce;margin-top:3px}.group-mute-btn{flex:0 0 auto;border:1px solid #77598e;background:#2a203d;color:#f0c9ed;border-radius:7px;padding:5px 7px;font-size:10px}.group-file-row{display:flex;align-items:center;gap:8px;text-decoration:none;color:#e9dfff;padding:6px 4px;border-bottom:1px solid #ffffff0b;min-width:0}.group-file-row>span:nth-child(2){min-width:0;flex:1}.group-file-row b,.group-file-row small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.group-file-row b{font-size:10px}.group-file-row small{font-size:9px;color:#b9a7ce;margin-top:3px}.group-file-row>span:last-child{font-size:10px;color:#ffb8df}.group-info-panel[hidden]{display:none!important}
@media(max-width:760px){.section-actions{gap:5px}.group-info-panel{max-height:36vh;padding:9px 8px}.group-info-columns{grid-template-columns:1fr;gap:7px}.group-info-block{padding:8px}.group-info-toggle{font-size:10px;padding:7px 8px}.group-info-top b{font-size:12px}.group-announcement{padding:8px}.group-admin-controls .tool-btn{font-size:10px;padding:6px 7px}.group-member-row{gap:6px}.group-info-panel .group-files{max-height:95px;overflow:auto}}
@media(max-width:760px){.section-title{display:flex!important;position:static!important;width:0;height:0;min-height:0;padding:0!important;overflow:visible!important;font-size:0}.section-actions{display:block!important}#newGroup{display:none!important}#searchGroup{display:grid!important;position:fixed;left:7px;bottom:calc(72px + env(safe-area-inset-bottom));z-index:1999;width:46px;height:31px;place-items:center;padding:0;border:1px solid #5c4a86;border-radius:11px;background:#241a3a;color:#ead8ff;font-size:0;box-shadow:0 6px 18px #0006}#searchGroup::before{content:'⌕';font-size:21px}}
