/* 0.12: мобильная надёжность, колесо реакций, медиаплееры и личные задания */
[hidden] { display:none !important; }
[data-theme="light"] { --ink:#101936; --muted:#505a72; }
[data-theme="light"] .tab.active,
[data-theme="light"] .button.ghost,
[data-theme="light"] .button.secondary,
[data-theme="light"] .poll-option,
[data-theme="light"] .message-reaction { color:#101936; }

.message { position:relative; overflow:visible; }
.message-quick-forward { position:absolute; z-index:2; right:-43px; bottom:4px; width:36px; height:36px; display:grid; place-items:center; padding:0; border:1px solid color-mix(in srgb,var(--line) 78%,transparent); border-radius:50%; color:var(--primary); background:color-mix(in srgb,var(--white) 92%,transparent); box-shadow:0 7px 22px rgba(16,25,54,.14); cursor:pointer; opacity:.82; transition:transform .18s ease,opacity .18s ease,box-shadow .18s ease; backdrop-filter:blur(12px); }
.message-quick-forward:hover,.message-quick-forward:focus-visible { opacity:1; transform:scale(1.08); box-shadow:0 9px 27px rgba(16,25,54,.2); }
.message-quick-forward .ui-icon { width:18px; height:18px; }
.message.mine .message-quick-forward { right:-43px; left:auto; }
.message.reaction-pop .message-body { animation:reaction-pop .42s cubic-bezier(.2,.9,.28,1.35); }
@keyframes reaction-pop { 0%,100%{transform:scale(1)} 45%{transform:scale(1.045)} }

.message-actions-content { position:relative; min-height:360px; padding-right:96px !important; }
.reaction-wheel-shell { position:absolute; z-index:4; top:70px; right:18px; width:64px; height:292px; display:grid; grid-template-rows:1fr auto; overflow:hidden; border:1px solid rgba(255,255,255,.07); border-radius:34px; color:#fff; background:linear-gradient(180deg,#17263c,#0e1a2b); box-shadow:0 18px 45px rgba(8,14,29,.36); }
.reaction-wheel-shell::before,.reaction-wheel-shell::after { content:""; position:absolute; z-index:2; left:0; right:0; height:62px; pointer-events:none; }
.reaction-wheel-shell::before { top:0; background:linear-gradient(#17263c,rgba(23,38,60,0)); }
.reaction-wheel-shell::after { bottom:28px; background:linear-gradient(rgba(14,26,43,0),#0e1a2b); }
.reaction-wheel-shell > small { z-index:3; padding:5px 2px 8px; color:rgba(255,255,255,.55); text-align:center; font-size:6px; line-height:1.15; }
.reaction-picker { min-height:0; height:100%; display:flex; flex-direction:column; align-items:center; gap:4px; overflow-x:hidden; overflow-y:auto; margin:0; padding:110px 8px; scroll-snap-type:y mandatory; overscroll-behavior:contain; scrollbar-width:none; -webkit-overflow-scrolling:touch; }
.reaction-picker::-webkit-scrollbar { display:none; }
.reaction-picker button { width:45px; height:45px; min-height:45px; flex:0 0 45px; display:grid; place-items:center; padding:0; border:0; border-radius:50%; color:inherit; background:transparent; cursor:pointer; scroll-snap-align:center; font-size:25px; line-height:1; filter:saturate(.9); opacity:.54; transform:scale(.72); transition:transform .16s ease,opacity .16s ease,background .16s ease,filter .16s ease; }
.reaction-picker button.centered,.reaction-picker button:focus-visible { background:rgba(255,255,255,.11); filter:saturate(1.12); opacity:1; transform:scale(1.12); outline:none; }

.attachment.circle { position:relative; width:min(232px,70vw); padding:0; }
.recording-mirror { margin-top:12px; }
.message.circle-only { --chat-circle-size:min(232px,70vw); }
.message.circle-only .message-body { min-width:0; overflow:visible; padding:0; color:var(--ink) !important; background:transparent !important; box-shadow:none; }
.message.circle-only .chat-attachments,.message.circle-only .chat-attachments.single { width:var(--chat-circle-size); max-width:var(--chat-circle-size) !important; grid-template-columns:var(--chat-circle-size) !important; margin:0 !important; }
.message.circle-only .attachment.circle,.message.circle-only .circle-media { width:var(--chat-circle-size); }
.message.circle-only .message-author { position:absolute; z-index:6; left:14px; top:14px; max-width:calc(var(--chat-circle-size) - 72px); overflow:hidden; margin:0; padding:4px 8px; border-radius:999px; color:#fff !important; background:rgba(10,18,40,.58); text-overflow:ellipsis; white-space:nowrap; backdrop-filter:blur(8px); }
.message.circle-only .message-time { position:absolute; z-index:6; top:calc(var(--chat-circle-size) - 34px); right:10px; display:flex; max-width:calc(var(--chat-circle-size) - 20px); margin:0; padding:4px 6px; border-radius:999px; color:#fff !important; background:rgba(10,18,40,.58); opacity:1; backdrop-filter:blur(8px); }
.message.circle-only .message-read-at { display:none; }
.message.circle-only .message-status { color:#fff !important; }
.message.circle-only .message-readers-trigger { color:#fff; }
.message.circle-only .message-pin-label { position:absolute; z-index:7; left:14px; top:46px; color:#fff; text-shadow:0 1px 3px rgba(0,0,0,.45); }
.message.circle-only .message-reactions { width:var(--chat-circle-size); }

.edit-selected-image { width:max-content; max-width:100%; margin:7px 5px 0 0; padding:8px 11px; border:1px solid color-mix(in srgb,var(--primary) 32%,var(--line)); border-radius:10px; color:var(--primary); background:var(--primary-soft); cursor:pointer; font-size:10px; font-weight:850; }
.image-editor-overlay { position:fixed; z-index:260; inset:0; display:grid; place-items:center; padding:18px; background:rgba(8,13,29,.84); backdrop-filter:blur(10px); }
.image-editor-card { width:min(980px,100%); max-height:calc(100dvh - 36px); overflow:auto; border:1px solid rgba(255,255,255,.13); border-radius:26px; color:var(--ink); background:var(--white); box-shadow:0 35px 110px rgba(0,0,0,.5); }
.image-editor-card > header,.image-editor-card > footer { position:sticky; z-index:3; display:flex; align-items:center; justify-content:space-between; gap:14px; padding:15px 18px; background:color-mix(in srgb,var(--white) 95%,transparent); backdrop-filter:blur(16px); }
.image-editor-card > header { top:0; border-bottom:1px solid var(--line); }
.image-editor-card > footer { bottom:0; justify-content:flex-end; border-top:1px solid var(--line); }
.image-editor-card > header h2 { max-width:70vw; overflow:hidden; margin:0; text-overflow:ellipsis; white-space:nowrap; font-size:17px; }
.image-editor-card > header button { width:38px; height:38px; border:0; border-radius:12px; color:var(--ink); background:var(--soft); cursor:pointer; font-size:23px; }
.image-editor-work { min-height:360px; display:grid; place-items:center; padding:18px; background:#0e1424; }
.image-editor-work canvas { display:block; max-width:100%; max-height:58dvh; border-radius:10px; box-shadow:0 12px 35px rgba(0,0,0,.35); touch-action:none; }
.image-editor-tools { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:9px; padding:15px 18px; }
.image-editor-tools > button,.image-editor-tools > label { min-width:0; min-height:46px; margin:0; padding:9px 11px; border:1px solid var(--line); border-radius:12px; color:var(--ink); background:var(--surface-alt); font-size:10px; font-weight:750; }
.image-editor-tools > button { cursor:pointer; }
.image-editor-tools label input,.image-editor-tools label select { margin-top:5px; padding:6px; }
.image-editor-tools .image-marker-toggle { display:flex; align-items:center; gap:8px; }
.image-editor-tools .image-marker-toggle input { width:17px; height:17px; margin:0; }

.personal-task-summary { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.personal-task-card { position:relative; overflow:hidden; }
.personal-task-card::after { content:""; position:absolute; right:-24px; bottom:-29px; width:92px; height:92px; border-radius:50%; background:color-mix(in srgb,var(--primary) 11%,transparent); }
.personal-task-meta { display:flex; align-items:center; justify-content:space-between; gap:8px; margin:12px 0 4px; padding-top:10px; border-top:1px solid var(--line); color:var(--muted); font-size:9px; }
.personal-task-meta b { color:var(--primary); }
.personal-report { display:grid; gap:9px; margin:10px 0; padding:12px; border:1px solid var(--line); border-radius:15px; background:var(--surface-alt); }
.personal-report.is-expired { opacity:.65; background:transparent; }
.personal-report > div:first-child { display:flex; align-items:center; gap:9px; }
.personal-report > div:first-child span { display:grid; gap:2px; }
.personal-report small { color:var(--muted); }
.personal-report p { margin:0; font-size:11px; line-height:1.5; }
.personal-activeiki-badge { display:grid; justify-items:center; gap:2px; margin:12px 0; padding:12px; border:1px solid color-mix(in srgb,var(--primary) 25%,var(--line)); border-radius:15px; color:var(--primary); background:linear-gradient(135deg,var(--primary-soft),color-mix(in srgb,var(--cyan) 9%,var(--white))); }
.personal-activeiki-badge b { font-size:25px; }
.personal-activeiki-badge span { font-size:9px; font-weight:850; }
.personal-task-admin-hero { display:flex; align-items:center; justify-content:space-between; gap:22px; margin-bottom:16px; padding:22px; border-color:color-mix(in srgb,var(--primary) 24%,var(--line)); background:linear-gradient(135deg,var(--primary-soft),color-mix(in srgb,var(--cyan) 8%,var(--white))); }
.personal-task-admin-hero h2,.personal-task-admin-hero p { margin:4px 0; }
.personal-task-admin-hero > div { max-width:720px; }
.personal-wallet-card { margin-top:18px; padding:22px; overflow:hidden; background:radial-gradient(circle at 92% 0,color-mix(in srgb,var(--cyan) 18%,transparent),transparent 35%),var(--white); }
.personal-wallet-head { display:flex; align-items:flex-start; justify-content:space-between; gap:18px; }
.personal-wallet-head h2 { margin:4px 0; font-size:22px; }
.personal-wallet-head h2 b { color:var(--primary); font-size:34px; }
.personal-wallet-head p { max-width:720px; margin:0; color:var(--muted); }
.personal-wallet-coin { width:62px; height:62px; flex:0 0 62px; display:grid; place-items:center; border:6px double rgba(255,255,255,.78); border-radius:50%; color:#4b3500; background:linear-gradient(145deg,#ffe69a,#ffc52f); box-shadow:0 10px 25px rgba(210,143,0,.25); font-size:24px; font-weight:950; }
.personal-wallet-stats { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; margin:18px 0; }
.personal-wallet-stats > div { display:grid; gap:3px; padding:12px; border:1px solid var(--line); border-radius:14px; background:var(--surface-alt); }
.personal-wallet-stats b { color:var(--primary); font-size:18px; }
.personal-wallet-stats span { color:var(--muted); font-size:9px; font-weight:800; }
.personal-wallet-actions { display:flex; flex-wrap:wrap; gap:9px; }
.wallet-assignment-note { margin:10px 0 0; color:var(--muted); font-size:10px; }
.wallet-history { margin-top:16px; border-top:1px solid var(--line); }
.wallet-history summary { padding:14px 0 8px; cursor:pointer; color:var(--primary); font-size:11px; font-weight:850; }
.wallet-history-row { display:flex; align-items:center; gap:10px; padding:9px 0; border-top:1px solid color-mix(in srgb,var(--line) 65%,transparent); }
.wallet-history-row > div { display:grid; gap:2px; }
.wallet-history-row small { color:var(--muted); font-size:8px; }
.wallet-history-sign { min-width:48px; padding:7px 8px; border-radius:11px; color:#087a58; background:color-mix(in srgb,#21c795 12%,var(--white)); text-align:center; font-weight:900; }
.wallet-history-sign.negative { color:#b33b45; background:color-mix(in srgb,#ef6170 12%,var(--white)); }

@media (max-width:760px) {
  .message { max-width:calc(100% - 48px); }
  .message-quick-forward { right:-41px; width:34px; height:34px; }
  .message.mine .message-quick-forward { right:-41px; left:auto; }
  .message-actions-content { min-height:430px; padding-right:82px !important; }
  .reaction-wheel-shell { position:sticky; z-index:6; float:right; top:64px; right:0; width:60px; height:300px; margin:4px -65px 0 8px; }
  .reaction-picker { padding-inline:6px; }
  .reaction-picker button { width:43px; height:43px; min-height:43px; flex-basis:43px; font-size:24px; }
  .attachment.circle { width:min(232px,70vw); }
  .scheduled-notification-list { grid-template-columns:1fr; }
  .scheduled-notification-card > header { grid-template-columns:36px minmax(0,1fr); }
  .scheduled-notification-card > header .pill { grid-column:2; justify-self:start; }
  .quick-recording-dock { grid-template-columns:minmax(62px,.8fr) minmax(105px,1.3fr) minmax(62px,.8fr); gap:4px; padding:7px 66px 7px 6px; }
  .quick-recording-cancel,.quick-recording-lock { padding:7px 4px; font-size:8px; }
  .quick-recording-main b { font-size:14px; }
  .quick-recording-main small { max-width:126px; font-size:7px; }
  .quick-recording-dock.locked { padding-right:66px; }
  .image-editor-overlay { padding:0; place-items:end center; }
  .image-editor-card { width:100%; max-height:96dvh; border-radius:24px 24px 0 0; }
  .image-editor-work { min-height:270px; padding:10px; }
  .image-editor-work canvas { max-height:47dvh; }
  .image-editor-tools { grid-template-columns:repeat(2,minmax(0,1fr)); padding:12px; }
  .personal-task-summary { grid-template-columns:1fr; }
  .personal-task-admin-hero { align-items:stretch; flex-direction:column; padding:17px; }
  .personal-wallet-card { padding:17px; }
  .personal-wallet-stats { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .personal-wallet-actions .button { width:100%; }
}

/* 0.13 precedence over earlier compatibility layers */
.chat-main { position:relative; grid-template-rows:auto auto minmax(0,1fr) auto; }
.message-actions-content { min-height:0; padding-right:24px !important; }
.message-quick-forward,.message.mine .message-quick-forward { right:-44px; left:auto; bottom:2px; }
@media (max-width:760px) {
  body.chat-page .topbar,body.chat-page .mobile-nav { display:none !important; }
  body.chat-page .app { height:var(--app-height,100dvh); padding-bottom:0; }
  body.chat-page .content.chat-content { height:var(--app-height,100dvh); padding:0; }
  body.chat-page .chat-layout { border-radius:0; }
  .desktop-chat-action { display:none !important; }
  .mobile-chat-search { display:grid; }
  .chat-message-search { display:none; }
  .chat-message-search.open { display:flex; }
  .message-quick-forward,.message.mine .message-quick-forward { right:-42px; left:auto; bottom:2px; }
  .message-actions-content { min-height:0; padding:14px 13px calc(18px + env(safe-area-inset-bottom)) !important; }
}

/* 0.13.2: видимая область мобильной клавиатуры и «Кто посмотрел» */
.message-time { display:flex; align-items:center; justify-content:flex-end; gap:5px; }
.message-time > span { min-width:0; }
.message-readers-trigger { position:relative; display:inline-flex; align-items:center; gap:2px; min-width:24px; min-height:20px; justify-content:center; margin:-4px -5px -4px 0; padding:3px 5px; border:0; border-radius:8px; color:inherit; background:transparent; cursor:pointer; opacity:.72; vertical-align:middle; }
.message-readers-trigger:hover,.message-readers-trigger:focus-visible { opacity:1; background:color-mix(in srgb,currentColor 12%,transparent); outline:none; }
.message-readers-trigger .ui-icon { width:13px; height:13px; }
.message-readers-trigger > b { font-size:8px; line-height:1; }
.message-readers-popover { position:absolute; z-index:30; right:0; bottom:calc(100% + 8px); width:max-content; min-width:225px; max-width:min(300px,72vw); display:grid; gap:7px; padding:11px; border:1px solid var(--line); border-radius:14px; color:var(--ink); background:var(--surface-overlay); box-shadow:0 16px 42px rgba(12,22,52,.23); opacity:0; pointer-events:none; text-align:left; transform:translateY(5px); transition:opacity .15s ease,transform .15s ease; backdrop-filter:blur(16px); }
.message:not(.mine) .message-readers-popover { right:auto; left:0; }
.message-readers-trigger:hover .message-readers-popover,.message-readers-trigger:focus-visible .message-readers-popover { opacity:1; transform:none; }
.message-readers-popover > strong { color:var(--primary); font-size:10px; }
.message-readers-popover > span { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:center; gap:12px; }
.message-readers-popover > span b { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:9px; }
.message-readers-popover > span small { color:var(--muted); white-space:nowrap; font-size:8px; }
.message-readers-popover > em { color:var(--muted); font-size:9px; font-style:normal; }
.message-readers-popover > i { padding-top:4px; border-top:1px solid var(--line); color:var(--muted); font-size:7px; font-style:normal; }

@media (max-width:760px) {
  body.chat-page { position:fixed; inset:0; width:100%; height:100%; overflow:hidden; }
  body.chat-page .app { position:fixed; top:var(--viewport-top,0px); right:auto; bottom:auto; left:var(--viewport-left,0px); width:100%; height:var(--app-height,100dvh); min-height:0; overflow:hidden; }
  body.chat-page .app-column,body.chat-page .content.chat-content,body.chat-page .chat-layout,body.chat-page .chat-main { min-height:0; overflow:hidden; }
  body.chat-page.keyboard-open .content.chat-content { height:var(--app-height,100dvh); padding:0; }
  body.chat-page .message-form { position:relative; bottom:auto; flex-shrink:0; }
  body.chat-page.keyboard-open .message-form { padding-bottom:max(8px,env(safe-area-inset-bottom)); }
  .message-readers-trigger { min-width:32px; min-height:26px; margin:-6px -7px -6px 0; }
  .message-readers-trigger .ui-icon { width:15px; height:15px; }
  .message-readers-popover { display:none; }
}

/* Keep the 0.18 gift layout after legacy responsive rules. */
.gift-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
@media (max-width:760px) {
  .gift-grid { grid-template-columns:1fr; }
}

/* Mobile viewport and recording controls — 0.21.0 */
@media (max-width:760px) {
  img,video,audio,canvas,iframe { max-width:100%; }
  .card,.modal-card,#modal-content,#modal-content form,.form-grid,.detail-grid,.toolbar,.section-heading { min-width:0; }
  .tabs { max-width:100%; overflow-x:auto; overscroll-behavior-x:contain; scrollbar-width:none; }
  .tabs::-webkit-scrollbar { display:none; }
  .tabs .tab { flex:0 0 auto; }
  .podium { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .podium-place { min-width:0; }
  .chat-head,.message-form { width:100%; max-width:100%; min-width:0; }
  .chat-head-main { overflow:hidden; }
  .chat-head-main h3,.chat-head-main p { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  .gift-hero { align-items:stretch; flex-direction:column; gap:15px; padding:18px; }
  .gift-hero > div:first-child { max-width:none; }
  .gift-hero .form-actions { width:100%; grid-template-columns:repeat(2,minmax(0,1fr)); }
  .song-review-heading { display:grid; grid-template-columns:1fr; align-items:stretch; }
  .song-review-heading > .button { width:100%; }
  .modal { width:100%; height:100dvh; min-height:100svh; overflow:hidden; padding:0; place-items:end center; }
  .modal-card { width:100%; max-width:100%; max-height:min(94svh,var(--app-height,94dvh)); overflow-x:hidden; overflow-y:auto; overscroll-behavior:contain; border-radius:26px 26px 0 0; }
  #modal-content { width:100%; padding:20px max(16px,env(safe-area-inset-right)) calc(18px + env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left)); }
  #modal-content input[type="range"] { max-width:100%; }
  .form-actions { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(132px,100%),1fr)); align-items:stretch; justify-content:stretch; gap:8px; }
  .form-actions > .button { width:100%; min-width:0; min-height:44px; padding-inline:11px; white-space:normal; }
  .recording-preview-eyebrow { margin-bottom:4px; padding-right:42px; }
  .recording-preview-content .modal-title { margin-bottom:9px; font-size:22px; }
  .recording-preview-circle { width:min(264px,72vw,36svh); margin-block:8px 12px; }
  .recording-preview-circle-controls { right:12%; bottom:11px; left:12%; }
  .recording-preview-audio { margin-block:9px 13px; padding:11px 12px; }
  .recording-trim-grid { gap:8px; }
  .recording-trim-control { padding:9px 10px; }
  .recording-trim-control input { min-height:27px; }
  .recording-trim-note { margin-top:9px; }
  .recording-preview-actions { grid-template-columns:repeat(2,minmax(0,1fr)); margin-top:11px; }
  .recording-preview-actions .button.primary { grid-column:1 / -1; grid-row:1; }
  .recording-preview-actions .button.danger,
  .recording-preview-actions .button.secondary { grid-row:2; }
  .quick-recording-dock { box-sizing:border-box; grid-template-columns:64px minmax(82px,1fr) 58px; gap:2px; padding:7px 80px max(7px,env(safe-area-inset-bottom)) max(7px,env(safe-area-inset-left)); }
  .quick-recording-cancel,.quick-recording-lock { overflow:hidden; padding:6px 2px; text-overflow:ellipsis; white-space:nowrap; font-size:7px; }
  .quick-recording-main { gap:1px; }
  .quick-recording-main b { font-size:14px; }
  .quick-recording-main small { max-width:none; white-space:nowrap; font-size:7px; }
  .quick-recording-dock.locked { padding-right:80px; }
  .quick-recording-dock.locked .quick-recording-actions { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); width:100%; }
}

@media (max-width:360px) {
  .topbar { padding-inline:10px; }
  .topbar-title { overflow:hidden; }
  .topbar-title .eyebrow,.topbar-title h1 { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  .topbar-actions { gap:4px; }
  .test-mode-label { padding:7px; }
  .test-mode-label span { display:none; }
  .topbar:has(.topbar-back:not(.hidden)) .topbar-page-icon { display:none; }
  .topbar-back { margin-right:6px; }
  .knowledge-hero { min-height:0; padding:18px; }
  .knowledge-hero > span { display:none; }
  .knowledge-hero h2 { font-size:28px; }
  .role-grid { grid-template-columns:1fr; }
  .podium-place { padding-inline:5px; }
  .podium-place small { font-size:8px; }
  .chat-head { gap:4px; padding-inline:6px; }
  .chat-head-actions { gap:2px; }
  .chat-head-actions .chat-design-button { display:none; }
  .message-form { gap:3px; padding-inline:5px; }
  .message-form textarea { padding-inline:8px; }
  .chat-tool { width:29px; }
  .message-form .send-button { width:40px; }
  .gift-hero .form-actions { grid-template-columns:1fr; }
  .recording-trim-grid { grid-template-columns:1fr; }
  .recording-preview-circle { width:min(238px,68vw,34svh); }
  .quick-recording-dock { grid-template-columns:54px minmax(76px,1fr) 52px; padding-right:72px; }
  .quick-recording-main small { font-size:6px; }
  .quick-recording-dock.locked { padding-right:72px; }
}

/* 0.23 — стабильные видеокружки и более выразительные чаты */
.circle-media,
.recording-box:has(.recording-circle),
.recording-preview-circle,
.composer-voice:has(.recording-button-preview) {
  isolation:isolate;
  contain:paint;
}
.attachment.circle video,
.recording-circle,
.recording-button-preview,
.recording-preview-circle .recording-result {
  backface-visibility:hidden;
  -webkit-backface-visibility:hidden;
  will-change:transform;
}
.attachment.circle video,
.recording-preview-circle .recording-result {
  transform:translateZ(0);
}
.circle-frame-recovering video { filter:brightness(.82); }
.circle-frame-recovering::after {
  content:"Обновляем кадр…";
  position:absolute;
  z-index:8;
  left:50%;
  bottom:38px;
  padding:5px 8px;
  border-radius:999px;
  color:#fff;
  background:rgba(10,18,40,.72);
  font-size:7px;
  font-weight:850;
  transform:translateX(-50%);
  pointer-events:none;
}
.recording-button-preview.live-preview-ready,
.recording-circle.live-preview-ready { opacity:1; }

.thread-list { padding:7px; }
.thread-section-title {
  display:flex;
  align-items:center;
  gap:8px;
  margin:0;
  padding:16px 9px 6px;
  color:color-mix(in srgb,var(--primary) 78%,var(--muted));
  font-size:8px;
  letter-spacing:.13em;
}
.thread-section-title::after {
  height:1px;
  flex:1;
  content:"";
  background:linear-gradient(90deg,color-mix(in srgb,var(--primary) 20%,var(--line)),transparent);
}
.thread-item {
  position:relative;
  width:calc(100% - 8px);
  min-height:61px;
  margin:3px 4px;
  gap:11px;
  padding:9px 10px;
  overflow:hidden;
  border:1px solid transparent;
  border-radius:17px;
  transition:background .18s,border-color .18s,box-shadow .18s,transform .18s;
}
.thread-item::before {
  position:absolute;
  inset:10px auto 10px 0;
  width:3px;
  border-radius:0 4px 4px 0;
  content:"";
  background:linear-gradient(var(--primary),var(--cyan));
  opacity:0;
  transform:scaleY(.45);
  transition:opacity .18s,transform .18s;
}
.thread-item:hover {
  border-color:color-mix(in srgb,var(--primary) 12%,var(--line));
  background:linear-gradient(110deg,color-mix(in srgb,var(--primary-soft) 58%,var(--white)),var(--white));
}
.thread-item.active {
  border-color:color-mix(in srgb,var(--primary) 22%,var(--line));
  background:linear-gradient(115deg,color-mix(in srgb,var(--primary-soft) 88%,var(--white)),color-mix(in srgb,var(--cyan) 7%,var(--white)));
  box-shadow:0 8px 22px rgba(36,35,112,.09);
}
.thread-item.active::before { opacity:1; transform:scaleY(1); }
.thread-item.has-unread:not(.active) { background:color-mix(in srgb,var(--primary-soft) 26%,var(--white)); }
.thread-item > .avatar {
  width:43px;
  height:43px;
  flex:0 0 43px;
  border-radius:15px;
  box-shadow:0 6px 16px rgba(22,32,72,.13);
}
.thread-item .saved-avatar { color:#fff; background:linear-gradient(135deg,#6752e8,#2fb9c5); }
.thread-copy { min-width:0; display:grid; flex:1; gap:5px; }
.thread-title-row,.thread-preview-row { min-width:0; display:flex; align-items:center; gap:6px; }
.thread-title-row b {
  min-width:0;
  overflow:hidden;
  flex:1;
  color:var(--ink);
  text-overflow:ellipsis;
  white-space:nowrap;
  font-size:11px;
}
.thread-title-row time {
  flex:0 0 auto;
  color:var(--muted);
  font-size:8px;
  font-variant-numeric:tabular-nums;
}
.thread-preview {
  min-width:0;
  overflow:hidden;
  flex:1;
  color:var(--muted);
  text-overflow:ellipsis;
  white-space:nowrap;
  font-size:9px;
}
.thread-item.has-unread .thread-preview { color:color-mix(in srgb,var(--ink) 72%,var(--muted)); font-weight:700; }
.thread-preview-row .thread-marks { align-items:center; }
.thread-preview-row .thread-unread {
  min-width:20px;
  height:20px;
  padding-inline:6px;
  background:linear-gradient(135deg,var(--primary),#7657ef);
  box-shadow:0 5px 13px color-mix(in srgb,var(--primary) 25%,transparent);
}

.message-actions-content {
  position:relative;
  min-height:0;
  padding-right:24px !important;
}
.message-context-sheet { gap:11px; }
.message-context-heading {
  min-width:0;
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:12px;
  padding-right:42px;
}
.message-context-heading p { margin:0 0 3px; }
.message-context-heading b { display:block; font-size:13px; }
.message-context-heading > small { flex:0 0 auto; color:var(--muted); font-size:8px; }
.message-context-reactions {
  margin:0;
  padding:8px 5px 11px;
  overscroll-behavior-x:contain;
  scroll-padding-inline:8px;
  -webkit-overflow-scrolling:touch;
}
.message-context-reactions button {
  flex-basis:44px;
  width:44px;
  height:44px;
  background:linear-gradient(145deg,var(--white),var(--surface-alt));
  box-shadow:0 5px 14px rgba(17,26,61,.06);
}
.message-context-grid button {
  min-height:70px;
  background:linear-gradient(145deg,var(--white),color-mix(in srgb,var(--surface-alt) 55%,var(--white)));
  transition:transform .16s,background .16s,border-color .16s;
}
.message-context-grid button:hover,.message-context-grid button:focus-visible {
  border-color:color-mix(in srgb,var(--primary) 34%,var(--line));
  background:var(--primary-soft);
  transform:translateY(-1px);
}
.message-context-grid .context-primary-action {
  border-color:color-mix(in srgb,var(--primary) 28%,var(--line));
  color:var(--primary);
  background:color-mix(in srgb,var(--primary-soft) 74%,var(--white));
}
.message-context-grid .danger-action {
  border-color:color-mix(in srgb,var(--red) 24%,var(--line));
  background:color-mix(in srgb,var(--red) 7%,var(--white));
}

@media (max-width:760px) {
  .thread-item { min-height:65px; padding:10px; }
  .thread-item > .avatar { width:45px; height:45px; flex-basis:45px; }
  .thread-title-row b { font-size:12px; }
  .thread-preview { font-size:9px; }
  .message-actions-content {
    min-height:0;
    padding:16px max(14px,env(safe-area-inset-right)) calc(18px + env(safe-area-inset-bottom)) max(14px,env(safe-area-inset-left)) !important;
  }
  .message-context-heading { align-items:flex-start; flex-direction:column; gap:2px; padding-right:48px; }
  .message-context-heading > small { display:none; }
  .message-context-reactions {
    margin:0;
    padding:8px 4px 10px;
    border:0;
    border-radius:0;
    background:transparent;
    box-shadow:none;
  }
  .message-context-preview { border-radius:15px; }
}

@media (max-width:360px) {
  .message-context-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .message-context-grid button { min-height:65px; }
}

/* 0.24 — полный поиск, материалы чата и постоянные черновики */
.chat-message-search { display:none; }
.chat-message-search.open { display:flex; }
.chat-search-results {
  max-height:min(46vh,430px);
  overflow:auto;
  margin:7px 12px 9px;
  border:1px solid var(--line);
  border-radius:15px;
  background:var(--surface-overlay);
  box-shadow:0 16px 38px rgba(17,28,67,.14);
  overscroll-behavior:contain;
}
.chat-search-results[hidden] { display:none; }
.chat-search-summary,.chat-search-more,.chat-search-state {
  display:block;
  padding:10px 13px;
  color:var(--muted);
  font-size:9px;
  font-weight:800;
}
.chat-search-state { text-align:center; }
.chat-search-state.error { color:var(--red); }
.chat-search-result {
  width:100%;
  display:grid;
  grid-template-columns:auto minmax(0,1fr) auto;
  align-items:center;
  gap:10px;
  padding:10px 12px;
  border:0;
  border-top:1px solid var(--line);
  color:var(--ink);
  background:transparent;
  text-align:left;
  cursor:pointer;
}
.chat-search-result:hover,.chat-search-result:focus-visible { background:var(--primary-soft); }
.chat-search-result > span { min-width:0; display:grid; gap:3px; }
.chat-search-result b,.chat-search-result small { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.chat-search-result b { font-size:10px; }
.chat-search-result small { color:var(--muted); font-size:9px; }
.chat-search-result time { color:var(--muted); font-size:8px; }
.mini-spinner {
  width:14px;
  height:14px;
  display:inline-block;
  vertical-align:-3px;
  margin-right:6px;
  border:2px solid color-mix(in srgb,var(--primary) 20%,transparent);
  border-top-color:var(--primary);
  border-radius:50%;
  animation:chat-spin .75s linear infinite;
}
@keyframes chat-spin { to { transform:rotate(360deg); } }

.chat-library-modal { width:min(760px,100%); }
.chat-library-tabs {
  display:flex;
  gap:6px;
  overflow-x:auto;
  margin:14px 0;
  padding-bottom:2px;
}
.chat-library-tabs button {
  flex:0 0 auto;
  padding:9px 12px;
  border:1px solid var(--line);
  border-radius:999px;
  color:var(--muted);
  background:var(--surface-alt);
  cursor:pointer;
  font-size:9px;
  font-weight:850;
}
.chat-library-tabs button.active { color:#fff; border-color:var(--primary); background:var(--primary); }
.chat-library-loading { padding:34px 15px; color:var(--muted); text-align:center; font-size:10px; }
.chat-library-list { display:grid; gap:9px; max-height:min(65vh,620px); overflow:auto; padding:2px; overscroll-behavior:contain; }
.chat-library-card { overflow:hidden; border:1px solid var(--line); border-radius:15px; background:var(--surface-alt); }
.chat-library-jump {
  width:100%;
  display:grid;
  grid-template-columns:auto minmax(0,1fr) auto;
  align-items:center;
  gap:10px;
  padding:11px 12px;
  border:0;
  color:var(--ink);
  background:transparent;
  text-align:left;
  cursor:pointer;
}
.chat-library-jump:hover,.chat-library-jump:focus-visible { background:var(--primary-soft); }
.chat-library-jump > span { min-width:0; display:grid; gap:3px; }
.chat-library-jump b,.chat-library-jump small { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.chat-library-jump b { font-size:10px; }
.chat-library-jump small,.chat-library-jump time { color:var(--muted); font-size:8px; }
.chat-library-assets { display:grid; gap:6px; padding:0 10px 10px 54px; }
.chat-library-file {
  min-width:0;
  display:grid;
  grid-template-columns:auto minmax(0,1fr) auto;
  align-items:center;
  gap:9px;
  padding:9px 10px;
  border:1px solid var(--line);
  border-radius:11px;
  color:var(--ink);
  background:var(--white);
  text-decoration:none;
}
.chat-library-file > .ui-icon { width:18px; color:var(--primary); }
.chat-library-file > span { min-width:0; display:grid; gap:2px; }
.chat-library-file b,.chat-library-file small { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.chat-library-file b { font-size:9px; }
.chat-library-file small { color:var(--muted); font-size:8px; }

@media (max-width:760px) {
  .chat-search-results { max-height:40vh; margin:6px 7px 8px; border-radius:13px; }
  .chat-library-list { max-height:none; }
  .chat-library-assets { padding-left:10px; }
  .chat-library-jump { grid-template-columns:auto minmax(0,1fr); }
  .chat-library-jump time { grid-column:2; }
}

/* 0.21 — погода, заявки по датам и семидневный челлендж */
.weather-home-card,.mood-home-card { display:grid; grid-template-columns:auto minmax(0,1fr) auto; align-items:center; gap:16px; padding:19px 21px; cursor:pointer; }
.weather-home-card { border-color:color-mix(in srgb,#38a9dd 32%,var(--line)); background:linear-gradient(135deg,color-mix(in srgb,#dff6ff 72%,var(--white)),var(--white)); }
.weather-home-card > .ui-icon,.mood-home-card > .ui-icon { width:22px; height:22px; color:var(--primary); }
.weather-home-icon,.mood-home-icon { width:62px; height:62px; display:grid; place-items:center; border-radius:21px; background:rgba(255,255,255,.78); box-shadow:0 10px 25px rgba(19,71,122,.1); font-size:34px; }
.weather-home-card h2,.weather-home-card p,.mood-home-card h2,.mood-home-card p { margin:2px 0; }
.challenge-home-card { padding:20px 22px; border-color:color-mix(in srgb,#ff9d42 32%,var(--line)); background:radial-gradient(circle at 90% 0,color-mix(in srgb,#ffbd70 20%,transparent),transparent 38%),var(--white); }
.challenge-home-top { display:flex; align-items:center; gap:13px; }
.challenge-home-top > div { min-width:0; flex:1; }
.challenge-home-top h2 { margin:2px 0; }
.challenge-flame { font-size:34px; }
.challenge-frozen { padding:8px 11px; border-radius:12px; color:#a04a00; background:#fff0d9; font-size:10px; font-weight:900; }
.challenge-progress { height:10px; overflow:hidden; margin:15px 0 9px; border-radius:999px; background:var(--surface-alt); }
.challenge-progress i { display:block; height:100%; border-radius:inherit; background:linear-gradient(90deg,#ffad38,#ef476f); }
.challenge-progress.mini { height:6px; margin-top:7px; }
.challenge-today { display:flex; justify-content:space-between; gap:12px; color:var(--muted); font-size:10px; font-weight:800; }
.challenge-home-card > p { margin:10px 0 0; color:var(--muted); font-size:10px; }
.home-birthday-alert { width:100%; display:grid; grid-template-columns:auto minmax(0,1fr) auto; align-items:center; gap:13px; margin:0 0 16px; padding:14px 17px; border-color:color-mix(in srgb,#ec5d86 35%,var(--line)); color:var(--ink); background:color-mix(in srgb,#ffe6ef 72%,var(--white)); cursor:pointer; text-align:left; }
.home-birthday-alert > span { font-size:28px; }
.home-birthday-alert > div { display:grid; gap:3px; }
.home-birthday-alert small { color:var(--muted); }
.home-birthday-alert > .ui-icon { width:20px; color:#c93f69; }

.weather-hero { display:flex; align-items:center; justify-content:space-between; gap:22px; min-height:180px; padding:27px; overflow:hidden; color:#fff; border:0; background:radial-gradient(circle at 85% 15%,rgba(255,226,124,.55),transparent 28%),linear-gradient(135deg,#2567b8,#25a7c8); }
.weather-hero h2 { margin:5px 0; font-size:32px; }
.weather-hero p { margin:0; opacity:.82; }
.weather-hero-reading { display:grid; min-width:150px; text-align:right; }
.weather-hero-reading strong { font-size:52px; line-height:1; }
.weather-hero-reading span { margin-top:7px; font-size:10px; font-weight:800; opacity:.82; }
.weather-location-tools { display:flex; align-items:center; justify-content:space-between; gap:18px; margin:15px 0; padding:15px 17px; }
.weather-location-tools > div:first-child { display:grid; gap:3px; }
.weather-location-tools span { color:var(--muted); font-size:10px; }
.weather-warning { display:flex; align-items:center; gap:12px; padding:15px; color:#9c3f30; border-color:#f0c1b8; background:#fff1ed; }
.weather-warning > .ui-icon { width:25px; }
.weather-warning > div { display:grid; gap:2px; }
.weather-warning span { font-size:10px; }
.weather-comparison { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; margin-bottom:15px; }
.weather-provider-card { padding:18px; }
.weather-provider-card > header { display:grid; grid-template-columns:42px minmax(0,1fr) auto; align-items:center; gap:10px; }
.weather-provider-card > header > span { width:42px; height:42px; display:grid; place-items:center; border-radius:13px; color:#fff; background:var(--primary); font-size:17px; font-weight:950; }
.weather-provider-card header h3 { margin:0; }
.weather-provider-card header a { color:var(--primary); font-size:9px; font-weight:800; }
.weather-provider-card header i { color:#a34545; font-size:8px; font-style:normal; font-weight:850; text-transform:uppercase; }
.weather-provider-card header i.online { color:#148267; }
.weather-temperature { display:flex; align-items:end; justify-content:space-between; gap:12px; margin:18px 0; }
.weather-temperature b { font-size:42px; line-height:1; }
.weather-temperature span { color:var(--muted); font-size:11px; font-weight:800; text-align:right; }
.weather-provider-card dl { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; margin:0; }
.weather-provider-card dl div { padding:10px; border-radius:12px; background:var(--surface-alt); }
.weather-provider-card dt { color:var(--muted); font-size:8px; font-weight:800; }
.weather-provider-card dd { margin:3px 0 0; font-size:12px; font-weight:900; }
.provider-empty { display:grid; gap:5px; min-height:120px; place-content:center; color:var(--muted); text-align:center; }
.provider-empty span { font-size:10px; }
.ventusky-section { margin-bottom:12px; }
.ventusky-frame { width:100%; height:520px; border:1px solid var(--line); border-radius:17px; background:var(--surface-alt); }
.weather-freshness { margin:0 4px; color:var(--muted); font-size:9px; line-height:1.5; }
.weather-main-settings { margin-bottom:16px; }
.weather-admin-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:13px; }
.weather-provider-admin { align-self:start; }
.weather-provider-admin h3 { margin:0; }

.birthday-hero { display:flex; align-items:center; justify-content:space-between; gap:20px; padding:25px; color:#fff; border:0; background:linear-gradient(135deg,#7d52d9,#ef5d86); }
.birthday-hero h2,.birthday-hero p { margin:4px 0; }
.birthday-hero > span { font-size:70px; filter:drop-shadow(0 12px 20px rgba(67,21,89,.24)); }
.birthday-layout { display:grid; grid-template-columns:minmax(270px,.78fr) minmax(0,1.4fr); align-items:start; gap:16px; margin-top:16px; }
.birthday-form { position:sticky; top:92px; }
.birthday-date-limit { display:flex; align-items:center; gap:7px; margin:10px 0 13px; padding:10px; border-radius:12px; color:var(--muted); background:var(--surface-alt); font-size:9px; }
.birthday-date-limit .ui-icon { width:17px; color:var(--primary); }
.birthday-request-list,.admin-birthday-list { display:grid; gap:10px; }
.birthday-request-card { display:grid; grid-template-columns:auto minmax(0,1fr) auto; align-items:start; gap:14px; padding:16px; }
.birthday-request-date { width:68px; display:grid; place-items:center; gap:2px; padding:10px 7px; border-radius:17px; color:#8e2f59; background:#ffe4ef; text-align:center; }
.birthday-request-date span { font-size:27px; font-weight:950; }
.birthday-request-date small { font-size:7px; }
.birthday-request-card h3,.birthday-request-card p { margin:3px 0; }
.birthday-request-card > div:nth-child(2) > small { color:var(--muted); font-size:8px; }
.birthday-request-card blockquote,.admin-birthday-card blockquote { margin:9px 0 0; padding:8px 10px; border-left:3px solid var(--primary); border-radius:0 10px 10px 0; background:var(--surface-alt); font-size:9px; }
.birthday-request-actions { display:flex; flex-direction:column; align-items:stretch; gap:6px; }
.birthday-status { justify-content:center; }
.status-accepted .birthday-status { color:#087a58; background:#e1f8ef; }
.status-rejected .birthday-status { color:#a04a00; background:#fff0d9; }
.status-cancelled { opacity:.68; }
.admin-birthday-card { display:grid; grid-template-columns:auto minmax(0,1fr) auto; align-items:center; gap:13px; padding:15px; }
.admin-birthday-icon { font-size:30px; }
.admin-birthday-card h3,.admin-birthday-card p { margin:2px 0; }
.admin-birthday-card small { color:var(--muted); }

.wellbeing-date-groups { display:grid; gap:11px; }
.wellbeing-date-group { overflow:hidden; }
.wellbeing-date-group > summary { display:grid; grid-template-columns:105px minmax(0,1fr) auto; align-items:center; gap:14px; padding:14px 16px; cursor:pointer; list-style:none; }
.wellbeing-date-group > summary::-webkit-details-marker { display:none; }
.wellbeing-date-group > summary > time { display:grid; }
.wellbeing-date-group > summary > time b { color:var(--primary); font-size:26px; }
.wellbeing-date-group > summary > time span { color:var(--muted); font-size:8px; }
.wellbeing-date-summary { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; }
.wellbeing-date-summary > span { display:grid; grid-template-columns:auto 1fr; align-items:center; gap:2px 6px; padding:9px; border-radius:12px; background:var(--surface-alt); }
.wellbeing-date-summary b { font-size:13px; }
.wellbeing-date-summary small { grid-column:1 / -1; color:var(--muted); font-size:7px; }
.wellbeing-date-group > summary > .ui-icon { width:18px; transition:transform .2s; }
.wellbeing-date-group[open] > summary > .ui-icon { transform:rotate(90deg); }
.wellbeing-date-content { display:grid; gap:15px; padding:2px 16px 16px; border-top:1px solid var(--line); }
.wellbeing-date-content h3 { margin:14px 0 7px; font-size:12px; }
.wellbeing-entry-list { display:grid; gap:7px; }
.wellbeing-entry { display:grid; grid-template-columns:auto minmax(0,1fr) auto; align-items:center; gap:10px; padding:10px; border-radius:13px; background:var(--surface-alt); }
.wellbeing-entry-icon { font-size:22px; }
.wellbeing-entry > div:nth-child(2) { display:grid; gap:2px; }
.wellbeing-entry small { color:var(--muted); font-size:8px; }
.dashboard-daily-list { display:grid; gap:7px; }
.dashboard-daily-list > div { display:grid; grid-template-columns:minmax(95px,1.2fr) repeat(2,minmax(70px,.8fr)) minmax(90px,1fr); align-items:center; gap:8px; padding:9px 10px; border-radius:11px; background:var(--surface-alt); font-size:9px; }
.dashboard-daily-list time { font-weight:900; }
.dashboard-daily-list small { color:var(--muted); text-align:right; }
.challenge-rule-preview { margin:10px 0 13px; padding:11px; border-radius:12px; color:#884b11; background:#fff2df; font-size:10px; line-height:1.5; }

@media (max-width:760px) {
  .weather-home-card,.mood-home-card { gap:11px; padding:15px; }
  .weather-home-icon,.mood-home-icon { width:50px; height:50px; border-radius:16px; font-size:28px; }
  .challenge-home-top { display:grid; grid-template-columns:auto minmax(0,1fr); }
  .challenge-frozen { grid-column:1 / -1; justify-self:start; }
  .challenge-today { display:grid; gap:4px; }
  .weather-hero { align-items:flex-start; min-height:0; padding:20px; }
  .weather-hero h2 { font-size:25px; }
  .weather-hero-reading { min-width:90px; }
  .weather-hero-reading strong { font-size:38px; }
  .weather-location-tools { align-items:stretch; flex-direction:column; }
  .weather-location-tools .form-actions { grid-template-columns:1fr; }
  .weather-comparison,.weather-admin-grid { grid-template-columns:1fr; }
  .ventusky-frame { height:430px; }
  .birthday-hero { padding:19px; }
  .birthday-hero > span { font-size:52px; }
  .birthday-layout { grid-template-columns:1fr; }
  .birthday-form { position:static; }
  .birthday-request-card { grid-template-columns:58px minmax(0,1fr); gap:10px; padding:13px; }
  .birthday-request-date { width:58px; }
  .birthday-request-actions { grid-column:1 / -1; display:grid; grid-template-columns:repeat(auto-fit,minmax(110px,1fr)); }
  .wellbeing-date-group > summary { grid-template-columns:70px minmax(0,1fr) auto; gap:8px; padding:12px; }
  .wellbeing-date-summary { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .wellbeing-date-summary > span:last-child { grid-column:1 / -1; }
  .wellbeing-date-content { padding-inline:12px; }
  .dashboard-daily-list > div { grid-template-columns:1fr 1fr; }
  .dashboard-daily-list small { text-align:left; }
  .admin-birthday-card { grid-template-columns:auto minmax(0,1fr); }
  .admin-birthday-card > .button { grid-column:1 / -1; width:100%; }
}

@media (max-width:360px) {
  .weather-hero { display:grid; }
  .weather-hero-reading { text-align:left; }
  .weather-provider-card { padding:14px; }
  .weather-provider-card > header { grid-template-columns:38px minmax(0,1fr); }
  .weather-provider-card header i { grid-column:2; }
  .weather-provider-card dl { grid-template-columns:1fr; }
  .ventusky-section .section-heading { display:grid; grid-template-columns:1fr; }
  .ventusky-section .section-heading .button { width:100%; min-width:0; white-space:normal; }
  .ventusky-frame { height:380px; }
  .birthday-hero > span { display:none; }
  .wellbeing-date-group > summary { grid-template-columns:54px minmax(0,1fr) auto; }
  .wellbeing-date-summary { grid-template-columns:1fr; }
  .wellbeing-date-summary > span:last-child { grid-column:auto; }
}

/* 0.28 — единые темы, доступность и мобильный PWA на iPhone */
[data-theme="light"] { --ink:#172033; --muted:#58657b; }

.chat-head-main h3,
.chat-head-main p,
.chat-sidebar-head h2 {
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.ranking-empty {
  position:relative;
  z-index:1;
  min-height:145px;
  display:grid;
  place-content:center;
  gap:7px;
  padding:20px;
  text-align:center;
}
.ranking-empty b { font-size:16px; }
.ranking-empty span { color:var(--muted); font-size:11px; }

.plan-toolbar { grid-template-columns:repeat(3,minmax(150px,1fr)) auto; }
.plan-toolbar-actions { display:flex; align-items:end; gap:8px; }

.activity-footer-actions {
  display:flex;
  align-items:center;
  justify-content:flex-end;
  flex-wrap:wrap;
  gap:9px;
  margin-top:22px;
}
.action-menu { position:relative; }
.action-menu > summary { list-style:none; }
.action-menu > summary::-webkit-details-marker { display:none; }
.action-menu-panel {
  position:absolute;
  z-index:40;
  top:calc(100% + 8px);
  right:0;
  min-width:210px;
  display:grid;
  gap:7px;
  padding:9px;
  border:1px solid var(--line);
  border-radius:16px;
  background:var(--surface-overlay);
  box-shadow:0 18px 45px rgba(18,28,61,.18);
  backdrop-filter:blur(16px);
}
.action-menu-panel .button { width:100%; justify-content:flex-start; }
.activity-footer-actions .action-menu-panel { top:auto; bottom:calc(100% + 8px); }

@media (max-width:760px) {
  .button,.tab,.icon-button { min-height:44px; }
  .topbar {
    height:auto;
    min-height:calc(76px + env(safe-area-inset-top));
    padding:calc(12px + env(safe-area-inset-top)) max(14px,env(safe-area-inset-right)) 12px max(14px,env(safe-area-inset-left));
  }
  .topbar-title { overflow:hidden; }
  .topbar-actions { flex:0 0 auto; gap:4px; }
  .topbar-actions .icon-button { width:44px; height:44px; flex-basis:44px; }
  .content { padding-left:max(14px,env(safe-area-inset-left)); padding-right:max(14px,env(safe-area-inset-right)); }
  .tabs { width:100%; }
  .tab { min-height:44px; }

  .plan-toolbar { grid-template-columns:1fr; }
  .plan-toolbar > label { grid-column:1; }
  .plan-toolbar-actions { display:grid; grid-template-columns:1fr 1fr auto; align-items:stretch; }
  .plan-toolbar-actions > .button { width:100%; }
  .plan-toolbar-actions .action-menu > summary { width:48px; min-width:48px; padding-inline:0; }
  .plan-toolbar-actions .action-menu > summary span { display:none; }
  .plan-toolbar-actions .action-menu-panel { width:min(250px,calc(100vw - 28px)); }

  .activity-footer-actions { display:grid; grid-template-columns:minmax(0,1fr) auto; }
  .activity-footer-actions > .button { width:100%; }
  .activity-footer-actions .action-menu > summary { min-width:48px; padding-inline:12px; }
  .activity-footer-actions .action-menu > summary span { display:none; }
  .activity-footer-actions .action-menu-panel { width:min(250px,calc(100vw - 28px)); }

  body.chat-page .chat-sidebar-head {
    min-height:calc(64px + env(safe-area-inset-top));
    padding:calc(12px + env(safe-area-inset-top)) max(12px,env(safe-area-inset-right)) 12px max(12px,env(safe-area-inset-left));
  }
  body.chat-page .chat-head {
    min-height:calc(64px + env(safe-area-inset-top));
    gap:5px;
    padding:calc(10px + env(safe-area-inset-top)) max(8px,env(safe-area-inset-right)) 10px max(8px,env(safe-area-inset-left));
  }
  .chat-head-main { min-width:0; }
  .chat-head-actions { flex:0 0 auto; gap:0; }
  .chat-head-actions .icon-button,
  .chat-back,
  .avatar-button { width:44px; min-width:44px; height:44px; }
  .chat-head-actions .icon-button .ui-icon { width:18px; height:18px; }
  .messages { padding:14px 52px 18px max(10px,env(safe-area-inset-left)); }
  .message { max-width:min(82%,calc(100% - 45px)); }
  .message-text { font-size:14px; line-height:1.45; }
}

@media (max-width:390px) {
  .topbar-page-icon { width:40px; height:40px; margin-right:7px; }
  .topbar h1 { font-size:19px; }
  .topbar .eyebrow { max-width:125px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  .connection:not(.offline):not(.syncing) { display:none; }
}
