/* 暮燈城 chat: left column under the quest card, purple-black gothic with antique gold. */
.left-stack{position:absolute;left:20px;top:270px;bottom:132px;width:255px;display:flex;flex-direction:column;gap:10px;z-index:4;pointer-events:none}
.left-stack>.quest-card{position:static;left:auto;right:auto;top:auto;bottom:auto;width:auto;max-height:42%;flex:0 1 auto;pointer-events:auto}
.chatless-feed{display:none!important} /* activity notices now live in the chat's 動態 lines */

.chat-box{position:relative;flex:1 1 auto;min-height:150px;max-height:330px;display:flex;flex-direction:column;pointer-events:auto;
  background:linear-gradient(160deg,#241629ee,#130f1ee6);border:1px solid #caa36e8a;border-radius:10px;box-shadow:0 14px 34px #0d0818b8,inset 0 0 0 1px #9f74ab30;overflow:hidden;font-size:11px;color:#e7dbe6}
.chat-box.collapsed{flex:0 0 auto;min-height:0}
.chat-box.collapsed .chat-tabs,.chat-box.collapsed .chat-log,.chat-box.collapsed .chat-friends,.chat-box.collapsed .chat-input{display:none}
.chat-head{display:flex;align-items:center;gap:6px;padding:7px 8px 6px 10px;border-bottom:1px solid #caa36e33}
.chat-box.collapsed .chat-head{border-bottom:0}
.chat-title{flex:1;min-width:0;display:flex;align-items:center;gap:6px;color:#eccc9e;font-size:11px;letter-spacing:1px;text-align:left;cursor:default}
.chat-box.collapsed .chat-title{cursor:pointer}
.chat-box.collapsed .chat-title::after{content:attr(data-preview);flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#bfa9c4;font-size:10px;letter-spacing:0}
.chat-spark{font-size:9px;color:#e6b87d}
.chat-badge{min-width:16px;height:16px;padding:0 4px;border-radius:8px;background:#b0475e;color:#fff;font-size:9px;line-height:16px;text-align:center;font-weight:400}
.chat-friends-button{display:flex;align-items:center;gap:4px;padding:5px 9px;border:1px solid #caa36e66;border-radius:7px;color:#e3c99b;font-size:10px;min-height:28px}
.chat-friends-button.active,.chat-friends-button:hover{background:#4a2f4f}
.chat-collapse{width:28px;height:28px;border-radius:7px;color:#cbb59b;font-size:15px}
.chat-collapse:hover{background:#3a2740}
.chat-tabs{display:flex;gap:2px;padding:5px 6px 0;overflow-x:auto;scrollbar-width:none}
.chat-tabs button{flex:0 0 auto;padding:4px 7px;border-radius:6px 6px 0 0;color:#a995ad;font-size:10px}
.chat-tabs button.active{color:#f0d6a8;background:#3a2541;box-shadow:inset 0 -2px #d0a66a}
.chat-log{flex:1;min-height:60px;overflow-y:auto;padding:6px 9px;display:flex;flex-direction:column;gap:3px;scrollbar-width:thin;scrollbar-color:#6d4f72 transparent}
.chat-line{line-height:1.55;word-break:break-word;font-size:11px}
.chat-tag{display:inline-block;margin-right:4px;padding:0 4px;border-radius:4px;font-size:9px;line-height:15px;vertical-align:1px;background:#3b2b44;color:#cdb8d4}
.chat-world .chat-tag{background:#4b3a24;color:#f0d29c}
.chat-nearby .chat-tag{background:#2f3d35;color:#b9dcc4}
.chat-party .chat-tag{background:#2b3854;color:#b9cdf2}
.chat-whisper .chat-tag{background:#4d2945;color:#f1b8de}
.chat-whisper .chat-text{color:#f6d3ea}
.chat-system .chat-tag{background:#6b3a2c;color:#ffd9b0}
.chat-system .chat-text{color:#f1d9a8}
.chat-system.tone-victory .chat-text,.chat-system.tone-loot .chat-text{color:#ffe08f;font-weight:400}
.chat-local{opacity:.78}
.chat-local .chat-text{color:#c8b8cc}
.chat-name{color:#e8c48c;font-size:11px;padding:0;text-decoration:underline dotted #e8c48c66;text-underline-offset:2px}
.chat-name.mine{color:#bfa6d8}
.chat-colon{color:#9c879f}
.chat-empty{margin:8px 2px;color:#9f8ca4;font-size:10px;line-height:1.7}
.chat-input{display:flex;gap:4px;padding:6px;border-top:1px solid #caa36e33;background:#120d1acc}
.chat-channel{max-width:78px;flex:0 0 auto;background:#2a1d31;color:#e9cfa2;border:1px solid #caa36e55;border-radius:6px;font-size:10px;padding:0 3px;min-height:32px}
.chat-input input{flex:1;min-width:0;background:#1d1524;color:#f1e6ef;border:1px solid #6d527466;border-radius:6px;padding:0 8px;font-size:12px;min-height:32px}
.chat-input input:focus{outline:1px solid #d0a66a;border-color:#d0a66a}
.chat-send{flex:0 0 auto;padding:0 10px;border-radius:6px;background:linear-gradient(#b98d58,#8d6339);color:#1d1220;font-weight:400;font-size:11px;min-height:32px}
.chat-send:disabled{opacity:.5}
.chat-popup{position:absolute;z-index:6;display:flex;flex-direction:column;min-width:110px;padding:6px;border:1px solid #caa36e99;border-radius:8px;background:#21152a;box-shadow:0 8px 20px #000a}
.chat-popup b{padding:2px 6px 5px;color:#eccc9e;font-size:10px;border-bottom:1px solid #caa36e33;margin-bottom:3px}
.chat-popup button{text-align:left;padding:7px 8px;border-radius:5px;color:#e8dbe8;font-size:11px}
.chat-popup button:hover{background:#3d2846}
.chat-friends{flex:1;overflow-y:auto;padding:8px 9px;display:flex;flex-direction:column;gap:6px}
.chat-friends h4{margin:6px 0 0;color:#d8b680;font-size:10px;font-weight:400;letter-spacing:1px}
.friend-add{display:flex;gap:4px}
.friend-add input{flex:1;min-width:0;background:#1d1524;color:#f1e6ef;border:1px solid #6d527466;border-radius:6px;padding:0 8px;font-size:11px;min-height:30px}
.friend-add button,.friend-actions button,.friend-row>button{padding:0 8px;min-height:28px;border-radius:6px;border:1px solid #caa36e55;color:#e8cf9f;font-size:10px}
.friend-yes{background:#5a3d27}
.friend-row{display:flex;align-items:center;gap:6px;padding:5px 6px;border-radius:7px;background:#ffffff08}
.friend-row.online{background:#ffffff10}
.friend-info{flex:1;min-width:0;display:flex;flex-direction:column}
.friend-name{font-size:11px;color:#efe1ea;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.friend-row>.friend-name{flex:1}
.friend-row small{font-size:9px;color:#a893ab}
.friend-row.online small::before{content:"●";color:#8fd59f;margin-right:3px}
.friend-actions{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:3px}
.friend-row>.friend-actions:empty{flex:1}
.friend-actions .danger{color:#d99494;border-color:#a35c6a66}

@media (max-width:1250px){.left-stack{top:245px}}
@media (max-width:850px){.left-stack{left:12px;top:174px;width:200px;bottom:150px}.chat-box{max-height:260px}.chat-channel{max-width:64px}}
@media (max-width:520px){.left-stack{top:184px;width:190px;bottom:160px}.left-stack>.quest-card{max-height:34%}.chat-box{max-height:220px;min-height:120px}.chat-line{font-size:10px}.chat-tabs button{padding:4px 5px}}
@media (prefers-reduced-motion:reduce){.chat-box *{transition:none}}