/* v2 interaction layer. Base theme variables remain in app.css. */
.admin-layout.has-room { grid-template-columns:var(--sidebar) minmax(0,1fr); }
@media (min-width:1200px) {
  .admin-layout.has-room.profile-open { grid-template-columns:var(--sidebar) minmax(0,1fr) var(--profile); }
  .profile-header>.icon-button { display:inline-flex; }
}
.send-button { min-width:70px; width:auto; height:40px; border-radius:11px; padding:0 15px; font-size:14px; font-weight:650; flex-shrink:0; }
.guest-brand-mark { display:grid; place-items:center; color:var(--primary); padding-right:8px; }
.avatar-image { object-fit:cover; }
.avatar img { width:100%; height:100%; object-fit:cover; border-radius:inherit; }
.account-avatar-button { padding:0; border-radius:50%; flex-shrink:0; }
.account-avatar-button .avatar { width:42px; height:42px; }
.admin-summary { min-width:0; }
.admin-summary strong { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; max-width:190px; }
.context-menu { position:fixed; z-index:1000; min-width:220px; max-width:calc(100vw - 16px); padding:6px; border:1px solid var(--line); border-radius:12px; background:var(--surface); box-shadow:0 10px 40px #172d3c33; }
.context-item { display:flex; width:100%; align-items:center; gap:12px; padding:11px 12px; border-radius:7px; text-align:left; font-size:13px; }
.context-item .icon { width:19px; height:19px; color:var(--muted); }
.context-item>span { flex:1; }
.context-item:hover,.context-item:focus-visible { background:var(--surface-soft); outline:none; }
.context-item kbd { font-family:inherit; font-size:11px; color:var(--muted); }
.context-divider { height:1px; margin:5px 2px; background:var(--line); }
.danger-text,.context-item.danger-text .icon { color:var(--danger); }
.selection-bar { display:flex; align-items:center; gap:8px; padding:7px 18px; border-bottom:1px solid var(--line); background:var(--surface); flex-shrink:0; }
.selection-bar>strong { flex:1; font-size:13px; }
.selection-bar .text-button { display:flex; align-items:center; gap:5px; font-size:12px; }
.selection-bar .icon { width:19px; height:19px; }
.selection-check { display:none; width:22px; height:22px; border:2px solid #8ca8a1; background:var(--surface); border-radius:50%; flex-shrink:0; align-items:center; justify-content:center; margin:10px 5px; }
.selection-check .icon { width:17px; height:17px; opacity:0; }
.selecting .selection-check { display:flex; }
.selecting .message-row { cursor:pointer; border-radius:12px; }
.message-selected { background:#3390ec20; }
.message-selected .selection-check { background:var(--primary); color:white; border-color:var(--primary); }
.message-selected .selection-check .icon { opacity:1; }
.edit-mark { font-size:9px; opacity:.8; }
.message-bubble:focus-visible { outline:2px solid var(--primary); outline-offset:3px; }
.quoted-message { display:flex; flex-direction:column; gap:4px; border-left:3px solid var(--primary); padding:7px 10px; border-radius:4px; background:#3390ec12; margin-bottom:7px; max-width:100%; width:100%; text-align:left; min-width:130px; }
.quoted-message>strong { font-size:11px; color:var(--primary); }
.quoted-message>span { display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; font-size:12px; line-height:1.5; overflow-wrap:anywhere; }
.quoted-message.missing { border-color:var(--muted); opacity:.75; }
.invalid-message { border:1px dashed var(--danger); }
.jump-highlight .message-bubble { animation:message-jump 1.8s ease-out; }
@keyframes message-jump { 0%,40% { box-shadow:0 0 0 5px #3390ec66; } 100% { box-shadow:0 0 0 0 #3390ec00; } }
.composer-context { display:flex; align-items:center; gap:10px; padding:10px 13px; background:var(--surface); border-radius:12px 12px 0 0; border-bottom:1px solid var(--line); }
.composer-context-text { border-left:3px solid var(--primary); padding-left:10px; flex:1; min-width:0; display:flex; flex-direction:column; gap:3px; }
.composer-context-text>strong { color:var(--primary); font-size:12px; }
.composer-context-text>span { font-size:12px; white-space:nowrap; text-overflow:ellipsis; overflow:hidden; max-height:36px; }
.composer-context:not([hidden])~.composer,.attachment-tray:not([hidden])~.composer { border-top-left-radius:0; border-top-right-radius:0; }
.attachment-tray { display:flex; gap:9px; overflow-x:auto; padding:12px; background:var(--surface); border-radius:12px 12px 0 0; border-bottom:1px solid var(--line); }
.attachment-preview { position:relative; width:100px; height:90px; border-radius:9px; overflow:hidden; flex-shrink:0; background:var(--surface-soft); }
.attachment-preview>img { width:100%; height:100%; object-fit:cover; }
.attachment-preview>.icon-button { position:absolute; top:3px; right:3px; width:24px; height:24px; color:white; background:#152c3cb8; }
.attachment-preview>.icon-button>.icon { width:17px; height:17px; }
.attachment-number { position:absolute; left:5px; bottom:5px; border-radius:5px; background:#152c3caa; color:white; padding:2px 5px; font-size:10px; }
.composer-wrap.drag-over .composer { outline:3px dashed var(--primary); }
.message-images { display:grid; grid-template-columns:1fr 1fr; gap:4px; width:min(390px,60vw); margin-bottom:5px; border-radius:8px; overflow:hidden; }
.message-images.count-1 { grid-template-columns:1fr; }
.message-images.count-3>.message-image:first-child { grid-column:span 2; }
.message-image { display:block; position:relative; padding:0; overflow:hidden; min-height:100px; background:#172d3c0c; }
.message-image>img { width:100%; height:100%; max-height:290px; object-fit:cover; display:block; }
.message-images.count-1 .message-image>img { object-fit:contain; max-height:400px; }
.image-loading { display:grid; place-items:center; position:absolute; inset:0; padding:10px; color:var(--muted); font-size:11px; }
.image-modal { max-width:min(960px,96vw); }
.lightbox-stage { display:flex; align-items:center; justify-content:center; min-height:160px; max-height:65dvh; background:var(--surface-soft); border-radius:10px; }
.lightbox-image { display:block; max-width:100%; max-height:65dvh; object-fit:contain; }
.lightbox-image:not([src]) { display:none; }
.lightbox-footer { display:flex; align-items:center; gap:10px; padding-top:14px; }
.lightbox-status { flex:1; font-size:12px; color:var(--muted); text-align:center; }
.avatar-full { display:block; width:100%; max-height:65dvh; object-fit:contain; border-radius:12px; }
.account-form { display:flex; flex-direction:column; gap:14px; padding-bottom:22px; border-bottom:1px solid var(--line); margin-bottom:20px; }
.account-form>h3 { font-size:15px; }
.avatar-editor { display:flex; align-items:center; gap:20px; }
.settings-avatar { width:74px; height:74px; flex-shrink:0; border-radius:50%; overflow:hidden; background:var(--primary-soft); color:var(--primary); display:grid; place-items:center; font-size:26px; }
.settings-avatar img { width:100%; height:100%; object-fit:cover; }
.settings-name { display:flex; flex-direction:column; gap:9px; font-size:12px; color:var(--muted); }
.sound-selector { display:flex; gap:10px; align-items:center; padding:12px 0; }
.sound-selector select { flex:1; }
.volume-row { display:flex; align-items:center; gap:12px; padding:0 0 20px; }
.volume-row input { flex:1; accent-color:var(--primary); }
.volume-row span { font-size:12px; color:var(--muted); min-width:35px; }
.vault-note { color:var(--muted); font-size:12px; line-height:1.8; margin:18px 0 9px; }
.gate-card .stack-form { text-align:left; margin-top:20px; }
@media (max-width:767px) {
  .send-button { min-width:62px; padding:0 10px; }
  .composer { gap:2px; }
  .composer>.icon-button { width:32px; }
  .message-images { width:min(310px,62vw); }
  .selection-bar { padding:6px 8px; gap:2px; }
  .selection-bar .text-button { font-size:11px; padding:7px; }
  .context-menu { min-width:200px; }
}

.sound-selector>label { display:flex; align-items:center; gap:10px; flex:1; }
.settings-tools { display:flex; flex-wrap:wrap; gap:10px; margin:20px 0 15px; }
