/* ══ CHAT ROOM ══ */
#chatRoomView { position:fixed; inset:0; z-index:200; background:var(--bg); display:none; flex-direction:column; }
#chatRoomView.is-open { display:flex; }
.chat-topbar { height:56px; min-height:56px; background:rgba(12,12,16,0.96); backdrop-filter:blur(16px); border-bottom:1px solid var(--border); display:flex; align-items:center; padding:0 16px; gap:11px; flex-shrink:0; }
.chat-topbar__back { width:36px; height:36px; border-radius:9px; border:1px solid var(--border); background:var(--surface2); color:var(--text-dim); cursor:pointer; display:flex; align-items:center; justify-content:center; flex-shrink:0; transition:all .15s; }
.chat-topbar__back:hover { color:var(--accent); border-color:rgba(200,169,126,0.30); }
.chat-topbar__avatar { width:34px; height:34px; border-radius:9px; background:linear-gradient(135deg,#7dd3fc,#f9a8d4,#c4b5fd); display:flex; align-items:center; justify-content:center; font-size:14px; font-weight:700; color:#fff; flex-shrink:0; }
.chat-topbar__info { flex:1; min-width:0; }
.chat-topbar__name { font-size:14px; font-weight:700; color:var(--text); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.chat-topbar__sub { font-size:10px; color:var(--text-muted); font-family:'Space Mono',monospace; }
.chat-topbar__menu { width:36px; height:36px; border-radius:9px; border:1px solid var(--border); background:var(--surface2); color:var(--text-dim); cursor:pointer; display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.chat-topbar__delete { width:34px; height:34px; border-radius:50%; border:none; background:var(--surface2); color:var(--text-dim); display:inline-flex; align-items:center; justify-content:center; cursor:pointer; }
.chat-topbar__delete:hover { background:rgba(200,126,126,0.12); color:var(--danger); }
.chat-members-panel { position:absolute; top:56px; right:0; width:180px; background:var(--surface); border-left:1px solid var(--border); height:calc(100% - 56px); overflow-y:auto; z-index:5; padding:12px; }
.chat-members-panel__title { font-size:10px; font-weight:700; color:var(--text-muted); text-transform:uppercase; letter-spacing:1px; margin-bottom:9px; font-family:'Space Mono',monospace; }
.chat-messages { flex:1; overflow-y:auto; padding:14px; display:flex; flex-direction:column; gap:11px; }
.chat-messages::-webkit-scrollbar{width:3px;}.chat-messages::-webkit-scrollbar-thumb{background:rgba(200,169,126,0.14);border-radius:2px;}
.chat-msg { display:flex; gap:9px; align-items:flex-start; }
.chat-msg--self { flex-direction:row-reverse; }
.chat-msg__av { width:34px; height:34px; border-radius:9px; background:linear-gradient(135deg,var(--accent),var(--accent3)); display:flex; align-items:center; justify-content:center; font-size:13px; font-weight:700; color:#0c0c10; flex-shrink:0; }
.chat-msg__col { max-width:70vw; display:flex; flex-direction:column; gap:3px; }
.chat-msg__col--self { align-items:flex-end; }
.chat-msg__sender { font-size:10px; color:var(--text-muted); font-family:'Space Mono',monospace; }
.chat-msg__bubble { background:var(--surface); border:1px solid var(--border); border-radius:12px; padding:9px 13px; font-size:13px; color:var(--text); line-height:1.55; word-break:break-word; }
.chat-msg__bubble--self { background:linear-gradient(135deg,var(--accent),var(--accent3)); border:none; color:#0c0c10; border-radius:12px 12px 3px 12px; }
.chat-msg__time { font-size:9px; color:var(--text-muted); font-family:'Space Mono',monospace; }
.typing-dots{display:flex;gap:4px;align-items:center;height:14px;}.typing-dot{width:5px;height:5px;border-radius:50%;background:var(--text-muted);animation:typingPulse 1.2s ease-in-out infinite;}.typing-dot:nth-child(2){animation-delay:.2s}.typing-dot:nth-child(3){animation-delay:.4s}
@keyframes typingPulse{0%,80%,100%{transform:scale(.8);opacity:.4}40%{transform:scale(1.1);opacity:1}}
.chat-input-bar { position:fixed; left:max(8px,env(safe-area-inset-left)); right:max(8px,env(safe-area-inset-right)); bottom:var(--ucim-chat-keyboard-offset,0px); padding:9px 11px calc(9px + env(safe-area-inset-bottom)); background:rgba(12,12,16,0.96); backdrop-filter:blur(16px); border-top:1px solid var(--border); border-radius:18px 18px 0 0; display:flex; align-items:center; gap:7px; box-shadow:0 -4px 20px rgba(0,0,0,0.30); }
.chat-input-field { flex:1; background:var(--surface2); border:1px solid var(--border); border-radius:20px; padding:9px 15px; color:var(--text); font-size:13px; font-family:inherit; outline:none; transition:border-color .2s; }
.chat-input-field:focus { border-color:rgba(200,169,126,0.40); }
.chat-input-field::placeholder { color:var(--text-muted); }
.chat-route-btn { width:38px; height:38px; border-radius:50%; border:1px solid var(--border); background:var(--surface2); cursor:pointer; display:flex; align-items:center; justify-content:center; flex-shrink:0; transition:all .15s; }
.chat-route-btn__u { font-family:'Space Mono',monospace; font-size:12px; font-weight:700; color:var(--accent); }
.chat-route-btn:hover { border-color:rgba(200,169,126,0.35); }
.chat-input-tool--emoji { width:38px; height:38px; border-radius:50%; border:1px solid var(--border); background:var(--surface2); cursor:pointer; display:flex; align-items:center; justify-content:center; color:var(--text-dim); flex-shrink:0; transition:all .15s; }
.chat-input-tool--emoji:hover { color:var(--accent); }
.chat-send-btn { width:40px; height:40px; border-radius:50%; border:none; flex-shrink:0; background:linear-gradient(135deg,var(--accent),var(--accent3)); cursor:pointer; display:flex; align-items:center; justify-content:center; color:#0c0c10; box-shadow:0 3px 10px rgba(200,169,126,0.22); transition:all .18s var(--esp); }
.chat-send-btn:hover { transform:scale(1.08); filter:brightness(1.08); }
.chat-send-btn:active { transform:scale(.94); }
.chat-inline-status { position:fixed; left:50%; transform:translateX(-50%); bottom:calc(var(--ucim-chat-keyboard-offset,0px) + var(--ucim-chat-bar-height,80px) + 12px); z-index:625; display:none; align-items:center; justify-content:center; gap:7px; padding:7px 13px; border-radius:999px; background:rgba(20,20,26,0.92); border:1px solid var(--border); font-size:12px; font-weight:700; color:var(--text); box-shadow:var(--s3); }
#chatRoomView.is-loading-history .chat-inline-status,#chatRoomView.is-waiting-response .chat-inline-status,.chat-inline-status.is-visible{display:inline-flex;}
.chat-inline-status__spinner{width:13px;height:13px;border-radius:50%;border:2px solid rgba(200,169,126,0.22);border-top-color:var(--accent);animation:ucimSpin .75s linear infinite;}
@keyframes ucimSpin{to{transform:rotate(360deg)}}
:root{--ucim-chat-keyboard-offset:0px;--ucim-chat-bar-height:80px;}
body.chat-room-open{overflow:hidden !important;overscroll-behavior:none !important;}
.chat-room-skeleton{display:flex;flex-direction:column;gap:10px;width:100%;}.chat-room-skeleton__row{display:flex;gap:7px;align-items:flex-start;}.chat-room-skeleton__row--self{justify-content:flex-end;}.chat-room-skeleton__bubble{max-width:min(70vw,260px);min-height:40px;border-radius:14px;background:linear-gradient(90deg,rgba(255,255,255,.04) 25%,rgba(255,255,255,.08) 37%,rgba(255,255,255,.04) 63%);background-size:400% 100%;animation:ucimSkeletonShimmer 1.4s ease infinite;border:1px solid var(--border);}
@keyframes ucimSkeletonShimmer{0%{background-position:100% 0}100%{background-position:0 0}}
.chat-route-picker-sheet{position:fixed;left:50%;transform:translateX(-50%);bottom:calc(var(--ucim-chat-keyboard-offset,0px)+var(--ucim-chat-bar-height,80px)+8px);z-index:630;background:var(--surface);border:1px solid var(--border);border-radius:16px;padding:11px;box-shadow:var(--s4);display:flex;gap:7px;flex-wrap:wrap;max-width:min(380px,94vw);}
.chat-route-picker-sheet.hidden{display:none;}
.chat-route-option{padding:7px 14px;border-radius:10px;border:1px solid var(--border);background:var(--surface2);color:var(--text-dim);cursor:pointer;font-size:12px;font-weight:600;font-family:inherit;transition:all .15s;}
.chat-route-option.is-active{background:rgba(200,169,126,0.10);border-color:rgba(200,169,126,0.26);color:var(--accent);}

/* ══ DEV badge ══ */
#devIndicator{display:none;position:fixed;bottom:16px;right:16px;z-index:9999;padding:4px 10px;background:rgba(200,184,126,0.10);border:1px solid rgba(200,184,126,0.28);border-radius:999px;font-size:9px;font-weight:700;color:var(--p-wn);letter-spacing:.5px;text-transform:uppercase;pointer-events:none;animation:devPulse 2.4s ease-in-out infinite;}
#devIndicator.visible{display:block;}
.dev-badge{display:inline-flex;align-items:center;gap:3px;padding:2px 7px;background:rgba(200,184,126,0.10);border:1px solid rgba(200,184,126,0.22);border-radius:999px;font-size:9px;font-weight:700;color:var(--p-wn);letter-spacing:.4px;text-transform:uppercase;margin-left:7px;vertical-align:middle;}
@keyframes devPulse{0%,100%{opacity:.65}50%{opacity:1}}

/* ══ MISC ══ */
@keyframes fadeUp{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}
::-webkit-scrollbar{width:4px;height:4px;}::-webkit-scrollbar-track{background:transparent;}::-webkit-scrollbar-thumb{background:rgba(200,169,126,0.16);border-radius:4px;}::-webkit-scrollbar-thumb:hover{background:rgba(200,169,126,0.30);}
.stagger-1{animation-delay:.05s}.stagger-2{animation-delay:.10s}.stagger-3{animation-delay:.15s}.stagger-4{animation-delay:.20s}.stagger-5{animation-delay:.25s}.stagger-6{animation-delay:.30s}
