.messages-page { min-height:calc(100vh - 88px); padding:34px clamp(24px,4vw,64px) 64px; background:#fff; }
.messages-page .sr-only { position:absolute!important; width:1px!important; height:1px!important; padding:0!important; overflow:hidden!important; clip:rect(0,0,0,0)!important; white-space:nowrap!important; border:0!important; }
.messages-head { display:flex; margin-top:32px; align-items:end; justify-content:space-between; gap:24px; }
.messages-head h1 { margin:0; color:var(--cab-ink); font-size:clamp(42px,5vw,62px); font-weight:560; line-height:.98; letter-spacing:-.045em; }
.messages-head p { margin:14px 0 0; color:var(--cab-copy); font-size:17px; }
.messages-head > strong { color:var(--cab-brand); font:650 13px/1.3 'Iosevka Charon Mono',monospace; }
.messages-shell { display:grid; grid-template-columns:minmax(280px,34%) minmax(0,1fr); height:min(780px,calc(100vh - 156px)); min-height:560px; overflow:hidden; border:1px solid var(--cab-line-strong); border-radius:12px; background:#fff; }
.inbox-panel { min-width:0; border-right:1px solid var(--cab-line-strong); }
.inbox-search { display:block; padding:16px; border-bottom:1px solid var(--cab-line); }
.inbox-search input { width:100%; min-height:44px; padding:0 14px; border:1px solid var(--cab-line-strong); border-radius:8px; background:#fff; color:var(--cab-ink); font:inherit; font-size:15px; }
.inbox-search input::placeholder { color:var(--cab-muted); }
.inbox-list { height:calc(100% - 77px); overflow-y:auto; }
.inbox-item { display:grid; width:100%; min-height:104px; padding:17px 16px; grid-template-columns:44px minmax(0,1fr) auto; align-items:start; gap:12px; border:0; border-bottom:1px solid var(--cab-line); background:#fff; color:var(--cab-copy); text-align:left; cursor:pointer; }
.inbox-item:hover { background:#fafafb; }
.inbox-item.is-active { background:#fff1f2; }
.inbox-avatar,.conversation-avatar { display:grid; width:44px; height:44px; place-items:center; border-radius:50%; background:#f0f1f3; color:var(--cab-ink); font-size:17px; font-weight:700; }
.inbox-item-main { min-width:0; }
.inbox-item-main strong { display:block; overflow:hidden; color:var(--cab-ink); font-size:16px; text-overflow:ellipsis; white-space:nowrap; }
.inbox-item-main span { display:block; margin-top:5px; overflow:hidden; color:var(--cab-copy); font-size:15px; line-height:1.35; text-overflow:ellipsis; white-space:nowrap; }
.inbox-item-meta { display:grid; justify-items:end; gap:9px; color:var(--cab-muted); font-size:13px; }
.inbox-item-meta b { display:grid; min-width:24px; height:24px; padding:0 6px; place-items:center; border-radius:999px; background:var(--cab-brand); color:#fff; font:650 13px/1 'Iosevka Charon Mono',monospace; }
.inbox-empty,.inbox-no-results { padding:42px 24px; text-align:center; }
.inbox-empty strong,.inbox-no-results strong,.conversation-placeholder strong { color:var(--cab-ink); font-size:19px; }
.inbox-empty p,.inbox-no-results p,.conversation-placeholder p { margin:9px 0 0; font-size:15px; line-height:1.45; }
.conversation-panel { display:grid; min-width:0; grid-template-rows:auto auto minmax(0,1fr) auto; }
.conversation-head { display:flex; min-height:77px; padding:14px 20px; align-items:center; gap:12px; border-bottom:1px solid var(--cab-line); }
.conversation-head > div { display:grid; min-width:0; }
.conversation-head strong { overflow:hidden; color:var(--cab-ink); font-size:17px; text-overflow:ellipsis; white-space:nowrap; }
.conversation-head small { margin-top:2px; overflow:hidden; color:var(--cab-muted); font-size:15px; text-overflow:ellipsis; white-space:nowrap; }
.conversation-back { display:none; width:40px; height:40px; border:1px solid var(--cab-line); border-radius:8px; background:#fff; color:var(--cab-ink); cursor:pointer; }
.conversation-blocked { display:flex; padding:12px 20px; align-items:center; gap:12px; border-bottom:1px solid var(--cab-line); background:#f7f7f8; }
.conversation-blocked strong { color:var(--cab-ink); font-size:15px; }
.conversation-blocked span { font-size:15px; }
.message-stream { padding:24px; overflow-y:auto; background:#fff; }
.message-day { margin:4px 0 18px; color:var(--cab-muted); font:600 13px/1.3 'Iosevka Charon Mono',monospace; text-align:center; }
.message-row { display:flex; margin-top:12px; }
.message-row.is-outgoing { justify-content:flex-end; }
.message-bubble { max-width:min(580px,78%); padding:13px 15px 9px; border:1px solid var(--cab-line); border-radius:10px 10px 10px 2px; background:#f7f7f8; }
.message-row.is-outgoing .message-bubble { border-color:#ffd0d3; border-radius:10px 10px 2px 10px; background:#fff1f2; }
.message-bubble p { margin:0; color:var(--cab-ink); font-size:15px; line-height:1.5; white-space:pre-wrap; overflow-wrap:anywhere; }
.message-bubble footer { display:flex; margin-top:6px; justify-content:flex-end; gap:7px; color:var(--cab-muted); font-size:13px; }
.message-file { display:flex; min-width:210px; align-items:center; gap:10px; }
.message-file i { display:grid; width:38px; height:38px; place-items:center; border:1px solid var(--cab-line); border-radius:7px; background:#fff; font-style:normal; }
.message-composer { padding:14px 16px; border-top:1px solid var(--cab-line-strong); background:#fff; }
.composer-row { display:grid; grid-template-columns:minmax(0,1fr) 44px auto; align-items:end; gap:9px; }
.composer-field textarea { display:block; width:100%; min-height:44px; max-height:120px; padding:11px 13px; resize:none; border:1px solid var(--cab-line-strong); border-radius:8px; color:var(--cab-ink); font:inherit; font-size:15px; line-height:1.4; }
.attach-button { display:grid; width:44px; height:44px; place-items:center; border:1px solid var(--cab-line-strong); border-radius:8px; color:var(--cab-ink); font-size:23px; cursor:pointer; }
.attach-button input { position:absolute; width:1px; height:1px; overflow:hidden; opacity:0; }
.send-button { min-height:44px; padding:0 18px; border:1px solid var(--cab-brand); border-radius:8px; background:var(--cab-brand); color:#fff; font-weight:700; cursor:pointer; }
.send-button:hover { background:var(--cab-brand-hover); }
.send-button:disabled,.attach-button.is-disabled { opacity:.55; cursor:not-allowed; }
.attachment-preview { display:grid; margin-bottom:10px; padding:10px; grid-template-columns:34px minmax(0,1fr) auto auto; align-items:center; gap:9px; border:1px solid var(--cab-line); border-radius:8px; }
.attachment-preview > div { font-size:20px; }
.attachment-preview > div img { display:block; width:34px; height:34px; border-radius:6px; object-fit:cover; }
.attachment-preview span { display:grid; min-width:0; }
.attachment-preview strong { overflow:hidden; color:var(--cab-ink); font-size:15px; text-overflow:ellipsis; white-space:nowrap; }
.attachment-preview small { color:var(--cab-muted); font-size:13px; }
.attachment-preview.is-failed { border-color:var(--cab-danger,#ef4444); }
.attachment-preview button { min-height:34px; padding:0 10px; border:1px solid var(--cab-line-strong); border-radius:7px; background:#fff; color:var(--cab-ink); cursor:pointer; }
.composer-status { min-height:18px; margin:5px 0 0; color:var(--cab-copy); font-size:13px; }
.conversation-placeholder { display:grid; place-content:center; padding:30px; text-align:center; }
.conversation-blocked { display:flex; padding:12px 20px; align-items:center; gap:12px; justify-content:space-between; }
.conversation-blocked strong { color:var(--cab-ink); font-size:15px; }
.conversation-blocked span { font-size:15px; flex:1 1 auto; }
.conversation-unblock { flex:0 0 auto; min-height:40px; padding:0 14px; border:1px solid var(--cab-line-strong); border-radius:8px; background:#fff; color:var(--cab-ink); font:650 15px/1 'Finlandica Text',sans-serif; cursor:pointer; }
.conversation-unblock:hover { border-color:var(--cab-ink); color:var(--cab-brand); }
.conversation-unblock:focus-visible { outline:2px solid var(--cab-brand); outline-offset:2px; }
.conversation-actions { display:flex; padding:6px 16px 0; gap:10px; }
.conversation-report { min-height:40px; padding:0; border:0; background:transparent; color:var(--cab-muted); font:650 14px/1 'Finlandica Text',sans-serif; text-decoration:underline; text-underline-offset:3px; cursor:pointer; }
.conversation-report:hover { color:var(--cab-brand); }
.conversation-report:focus-visible { outline:2px solid var(--cab-brand); outline-offset:2px; }
/* Модальные окна – стили в cabinet-modals.css */
@media (max-width:900px) { .messages-shell { grid-template-columns:280px minmax(0,1fr); } .message-bubble { max-width:88%; } }
@media (max-width:640px) { .messages-page { min-height:0; padding:16px 16px 48px; } .messages-shell { display:block; height:calc(100dvh - 104px); min-height:520px; } .inbox-panel { height:100%; border-right:0; } .conversation-panel { display:none; height:100%; } .messages-shell.is-conversation-open .inbox-panel { display:none; } .messages-shell.is-conversation-open .conversation-panel { display:grid; } .conversation-back { display:grid; place-items:center; flex:0 0 auto; } .conversation-head { padding-inline:12px; } .message-stream { padding:18px 12px; } .message-bubble { max-width:92%; } .composer-row { grid-template-columns:minmax(0,1fr) 44px; } .send-button { grid-column:1/-1; } .attachment-preview { grid-template-columns:30px minmax(0,1fr) auto; } .attachment-preview [data-attachment-retry] { grid-column:2; justify-self:start; } }