/* ── Reset & base ──────────────────────────────────────────── */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
:root{
  --blue:#2563eb;--blue-dk:#1d4ed8;--cyan:#06b6d4;
  --dark:#0f172a;--slate:#1e293b;--gray:#64748b;
  --light:#f1f5f9;--border:#e2e8f0;--success:#10b981;
  --danger:#ef4444;--radius:10px;--shadow:0 4px 24px rgba(0,0,0,.08);
  --card:#fff;          /* поверхности: карточки, шапка, чат, тосты */
}
/* ── Тёмная тема: переопределяем токены, остальное наследует ── */
:root[data-theme="dark"]{
  color-scheme:dark;    /* системные скроллбары/контролы в тёмной гамме */
  --dark:#e7edf5;       /* основной текст */
  --gray:#9aa7b8;       /* приглушённый текст */
  --light:#0b1220;      /* фон страницы */
  --border:#26344a;     /* границы */
  --card:#131f33;       /* поверхности */
  --shadow:0 4px 24px rgba(0,0,0,.45);
}
:root[data-theme="dark"] .role-owner{background:#3a1d1d;color:#fca5a5}
:root[data-theme="dark"] .btn-ghost:hover{background:#1e293b}
:root[data-theme="dark"] .error-msg{background:#3a1d1d;border-color:#7f1d1d}
:root[data-theme="dark"] .login-notice,
:root[data-theme="dark"] .flash-info{background:#16263f;border-color:#1e3a8a;color:#bfdbfe}
:root[data-theme="dark"] .msg.own{background:#1c3151;border-color:#2c4a73}
:root[data-theme="dark"] .msg-act:hover{background:rgba(255,255,255,.1)}
:root[data-theme="dark"] .msg-body.md code{background:rgba(255,255,255,.1)}
:root[data-theme="dark"] .emoji-item:hover{background:#1e293b}
:root[data-theme="dark"] input,
:root[data-theme="dark"] select,
:root[data-theme="dark"] textarea{background:#0e1a2b;color:var(--dark);border-color:var(--border)}
:root[data-theme="dark"] input::placeholder,
:root[data-theme="dark"] textarea::placeholder{color:#5f7186}
:root[data-theme="dark"] .scroll-down:hover{background:#1e293b}
body{transition:background .2s,color .2s}
html{font-size:15px}
body{font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;
     background:var(--light);color:var(--dark);line-height:1.5}
a{color:var(--blue);text-decoration:none}
a:hover{text-decoration:underline}
button{cursor:pointer;border:none;font-family:inherit;font-size:1rem}
input,select{font-family:inherit;font-size:16px}  /* 16px — iOS не зумит поле при фокусе */
.hidden{display:none!important}
.muted{color:var(--gray);font-size:.85rem}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:.4rem;
  padding:.48rem 1rem;font-size:.92rem;border-radius:var(--radius);font-weight:600;transition:all .18s;
  white-space:nowrap;text-decoration:none}
.btn:hover{text-decoration:none}
.btn-primary{background:var(--blue);color:#fff}
.btn-primary:hover{background:var(--blue-dk)}
.btn-ghost{background:transparent;color:var(--blue);border:1.5px solid var(--blue)}
.btn-ghost:hover{background:#eff6ff}
.btn-ghost-gold{background:transparent;color:#b45309;border:1.5px solid #f59e0b}
.btn-ghost-gold:hover{background:#fffbeb}
.btn-ghost-red{background:transparent;color:#dc2626;border:1.5px solid #f87171}
.btn-ghost-red:hover{background:#fef2f2}
.btn-danger{background:var(--danger);color:#fff}
.btn-danger:hover{background:#dc2626}
.btn-block{width:100%}
.btn-sm{padding:.34rem .7rem;font-size:.8rem}
.btn-logout-link{background:var(--light);color:var(--gray)}
.btn-logout-link:hover{background:#e2e8f0;color:var(--danger)}

/* ═══════════════════════════════════════════════════════════
   СТРАНИЦА ВХОДА
═══════════════════════════════════════════════════════════ */
.login-body{background:linear-gradient(150deg,#1e3a8a 0%,#2563eb 60%,#06b6d4 100%)}
.login-screen{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:1.5rem}
.login-card{background:var(--card);width:100%;max-width:380px;border-radius:18px;
  padding:2.5rem 2.25rem;box-shadow:0 20px 60px rgba(0,0,0,.25)}
.login-logo{display:flex;flex-direction:column;align-items:center;gap:.5rem;margin-bottom:2rem;
  color:var(--blue);font-size:1.5rem;font-weight:800}
.login-logo span{color:var(--dark)}

.form-group{margin-bottom:1.1rem}
.form-group label{display:block;margin-bottom:.4rem;font-weight:600;font-size:.88rem}
.form-group input{width:100%;padding:.7rem .9rem;border:1.5px solid var(--border);
  border-radius:var(--radius);transition:border-color .18s}
.form-group input:focus{outline:none;border-color:var(--blue)}
.error-msg{background:#fef2f2;color:var(--danger);font-size:.86rem;font-weight:500;
  padding:.6rem .8rem;border-radius:8px;margin-bottom:1rem;border:1px solid #fecaca}
.login-notice{background:#eff6ff;color:#1d4ed8;font-size:.86rem;font-weight:500;
  padding:.6rem .8rem;border-radius:8px;margin-bottom:1.25rem;border:1px solid #bfdbfe;text-align:center}
.login-foot{text-align:center;margin-top:1.5rem;color:var(--gray);font-size:.9rem}
.login-games-hint{margin-bottom:.5rem;font-size:.85rem;color:var(--gray)}
/* Змейка требует клавиатуру — на сенсорных устройствах её прячем */
@media (pointer:coarse){ .game-pick[data-game="snake"]{display:none} }
.login-games{display:flex;flex-direction:column;gap:.5rem}
.login-games .game-pick{width:100%;justify-content:center;font-size:.95rem;padding:.6rem 1rem}

/* ── Модальное окно игры ───────────────────────────────────── */
.modal-overlay{position:fixed;inset:0;background:rgba(15,23,42,.6);display:flex;
  align-items:center;justify-content:center;z-index:500;backdrop-filter:blur(5px);padding:1rem}
.game-modal{background:#0f172a;border-radius:20px;padding:2rem;border:1px solid #1e293b;
  box-shadow:0 20px 70px rgba(0,0,0,.5);animation:popIn .22s ease;max-width:100%}
@keyframes popIn{from{transform:scale(.92);opacity:0}to{transform:none;opacity:1}}
.game-modal-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:1.25rem;color:#fff}
.game-modal-head h3{font-size:1.2rem;font-weight:800}
.game-close{background:none;color:#64748b;font-size:1.6rem;line-height:1;padding:.1rem .5rem;border-radius:8px;transition:all .18s}
.game-close:hover{background:rgba(255,255,255,.08);color:#fff}
.game-hud{display:flex;justify-content:space-around;margin-bottom:1rem;color:#fff}
.game-hud .stat{text-align:center}
.game-hud .stat span{display:block;font-size:.68rem;text-transform:uppercase;letter-spacing:.08em;color:var(--gray)}
.game-hud .stat strong{font-size:1.4rem;font-weight:800}
.game-canvas-wrap{position:relative;display:flex;justify-content:center}
#snake-canvas{display:block;border-radius:12px;border:1px solid #1e293b;max-width:100%}
.game-overlay{position:absolute;inset:0;border-radius:12px;background:rgba(15,23,42,.9);
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1rem;color:#fff}
.game-overlay h3{font-size:1.5rem;font-weight:800}
.game-overlay p{color:#94a3b8;font-size:.9rem;text-align:center;padding:0 1rem}
.game-controls{margin-top:1rem;color:#475569;font-size:.8rem;text-align:center}

/* поле имени игрока */
.name-input{width:80%;max-width:220px;padding:.55rem .8rem;border-radius:8px;
  border:1px solid #334155;background:#1e293b;color:#fff;text-align:center;font-size:.95rem}
.name-input:focus{outline:none;border-color:var(--blue)}
.name-input::placeholder{color:#64748b}

/* таблица лидеров */
.leaderboard{list-style:none;width:90%;max-width:240px;margin:.1rem 0;padding:0;
  display:flex;flex-direction:column;gap:.3rem}
.leaderboard li{display:flex;align-items:center;gap:.6rem;background:rgba(255,255,255,.06);
  border-radius:8px;padding:.35rem .6rem;font-size:.85rem;color:#e2e8f0}
.lb-rank{width:1.3rem;text-align:center;font-weight:800;color:var(--cyan)}
.lb-name{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:left}
.lb-score{font-weight:800}
.lb-empty,.lb-loading{justify-content:center;color:#94a3b8}
.lb-verified{display:inline-block;margin-left:.3rem;color:#fff;background:var(--blue,#2563eb);
  font-size:.62rem;line-height:1;width:14px;height:14px;border-radius:50%;text-align:center;
  vertical-align:middle;padding-top:2px;box-sizing:border-box}

/* страница мини-игр для авторизированных пользователей */
.games-area{max-width:520px;margin:0 auto;padding:1.5rem 1rem 3rem}
.games-pick{display:flex;gap:.5rem;justify-content:center;margin-bottom:1.25rem;flex-wrap:wrap}
.game-pick{padding:.5rem .95rem;border-radius:99px;border:1px solid var(--border);background:var(--card);
  color:var(--gray);font-weight:600;font-size:.9rem;cursor:pointer;transition:all .15s}
.game-pick:hover{border-color:var(--blue)}
.game-pick.active{background:var(--blue);border-color:var(--blue);color:#fff}
.game-card{background:#0f172a;border-radius:20px;padding:1.75rem;border:1px solid #1e293b;
  box-shadow:0 20px 70px rgba(0,0,0,.4)}
#game-canvas{display:block;border-radius:12px;border:1px solid #1e293b;max-width:100%}

/* предупреждение о русской раскладке в пароле */
.cyr-warn{color:#b45309;background:#fef3c7;border:1px solid #fde68a;border-radius:8px;
  padding:.5rem .7rem;font-size:.8rem;margin-top:.6rem;line-height:1.35}

/* ═══════════════════════════════════════════════════════════
   ЧАТ
═══════════════════════════════════════════════════════════ */
body.chat-page{display:flex;flex-direction:column;height:100vh;height:100dvh;overflow:hidden;background:var(--card)}
body.chat-page .topbar{flex:0 0 auto}
.chat-main{flex:1;min-height:0;width:100%;max-width:860px;margin:0 auto;
  padding:.55rem .7rem .35rem;display:flex;flex-direction:column}

.room-bar{display:flex;align-items:center;gap:.5rem;margin-bottom:.2rem;flex:0 0 auto}
.typing-bar{font-size:.72rem;color:var(--gray);font-style:italic;min-height:.9rem;
  padding:0 .3rem .2rem;flex:0 0 auto;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.typing-bar.hidden{display:none}

/* голосовые сообщения */
.chat-mic{flex:0 0 auto;min-width:2.2rem;justify-content:center;font-size:1rem;line-height:1;padding:.28rem}
.chat-mic.recording{color:var(--danger);animation:micPulse .8s ease-in-out infinite alternate}
.mic-timer{flex:0 0 auto;font-size:.78rem;font-weight:700;color:var(--danger);min-width:2.2rem;text-align:center;font-variant-numeric:tabular-nums}
@keyframes micPulse{from{opacity:.6}to{opacity:1}}
/* кастомный плеер голосового */
.voice-player{display:flex;align-items:center;gap:.55rem;margin:.25rem 0;width:100%;max-width:300px}
.vp-play{flex:0 0 auto;width:2rem;height:2rem;border-radius:50%;background:var(--blue);color:#fff;border:none;
  font-size:.85rem;line-height:1;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:background .15s}
.vp-play:hover{background:var(--blue-dk)}
.vp-bar{flex:1;min-width:0;height:6px;background:var(--border);border-radius:99px;cursor:pointer;overflow:hidden;position:relative}
.vp-fill{height:100%;width:0%;background:var(--blue);border-radius:99px;transition:width .1s linear}
.vp-time{flex:0 0 auto;font-size:.74rem;color:var(--gray);font-variant-numeric:tabular-nums;white-space:nowrap;min-width:3.8rem}
/* старый нативный плеер — скрыт */
.msg-audio{display:none!important}
.voice-player audio{display:none!important}
.room-tabs{display:flex;gap:.4rem;overflow-x:auto;flex:1;min-width:0;padding-bottom:.15rem}
.room-tab{flex:0 0 auto;padding:.4rem .85rem;border-radius:99px;border:1px solid var(--border);
  background:var(--card);color:var(--gray);font-weight:600;font-size:.85rem;white-space:nowrap}
.room-tab.active{background:var(--blue);color:#fff;border-color:var(--blue)}
.room-actions{display:flex;gap:.35rem;flex:0 0 auto}
.room-select{display:none;flex:1;min-width:0;padding:.45rem .8rem;border:1px solid var(--border);
  border-radius:99px;background:var(--card);font-weight:600;font-size:.9rem;color:var(--dark)}
.room-select:focus{outline:none;border-color:var(--blue)}

/* тосты-уведомления на сайте (как ВК) */
/* Общий стек справа внизу: и тосты уведомлений, и виджет загрузки —
   располагаются друг над другом и не накладываются. */
#cv-stack{position:fixed;right:1rem;bottom:calc(1rem + env(safe-area-inset-bottom, 0px));
  z-index:9999;display:flex;flex-direction:column;gap:.5rem;align-items:flex-end;max-width:calc(100vw - 2rem)}
.cv-toast{width:340px;max-width:100%;background:var(--card);border:1px solid var(--border);border-left:4px solid var(--blue);border-radius:10px;
  box-shadow:0 8px 30px rgba(0,0,0,.18);padding:.7rem .85rem;cursor:pointer;animation:cvIn .25s ease}
.cv-toast.out{opacity:0;transform:translateX(20px);transition:all .3s}
.cv-toast-title{font-weight:700;font-size:.9rem;margin-bottom:.15rem}
.cv-toast-text{font-size:.85rem;color:var(--gray);overflow:hidden;display:-webkit-box;
  -webkit-line-clamp:2;-webkit-box-orient:vertical}
@keyframes cvIn{from{opacity:0;transform:translateX(30px)}to{opacity:1;transform:none}}

/* футер модалки участников — по центру, равные кнопки */
#mm-actions{justify-content:center}
#mm-actions .btn{flex:1 1 0;max-width:180px}

.chat-box{flex:1;display:flex;flex-direction:column;background:var(--card);position:relative;
  border:1px solid var(--border);border-radius:14px;overflow:hidden;min-height:0}

/* кнопка «к последнему сообщению» (как в Telegram) */
.scroll-down{position:absolute;right:.7rem;bottom:4.6rem;z-index:25;width:2.2rem;height:2.2rem;
  border-radius:50%;background:var(--card);border:1px solid var(--border);box-shadow:0 4px 14px rgba(0,0,0,.2);
  font-size:1.15rem;color:var(--blue);display:flex;align-items:center;justify-content:center;cursor:pointer}
.scroll-down:hover{background:var(--light)}
.scroll-down.hidden{display:none}
@media (pointer:fine){
  .scroll-down{right:1.45rem;bottom:6.8rem}   /* ПК, обычный чат: выше textarea */
  #ai-scroll-down{bottom:7rem}               /* ПК, ИИ: чуть выше (подсказка в 2 строки) */
}

/* эмодзи (ПК): кнопка + панель */
.chat-emoji{flex:0 0 auto;min-width:2.2rem;justify-content:center;font-size:1rem;line-height:1;padding:.28rem}
@media(pointer:coarse){ .chat-emoji{display:none} }
.emoji-panel{position:absolute;left:.6rem;bottom:3.6rem;z-index:30;width:19rem;max-width:calc(100% - 1.2rem);
  max-height:14rem;overflow-y:auto;overflow-x:hidden;background:var(--card);border:1px solid var(--border);border-radius:12px;
  box-shadow:0 8px 30px rgba(0,0,0,.2);padding:.4rem;display:grid;grid-template-columns:repeat(8,1fr);gap:.05rem}
.emoji-panel.hidden{display:none}
.emoji-item{background:none;border:none;font-size:1.3rem;line-height:1;padding:.2rem;border-radius:6px;cursor:pointer}
.emoji-item:hover{background:var(--light)}
.chat-messages{flex:1;overflow-y:auto;padding:.55rem .6rem;display:flex;flex-direction:column;gap:.28rem}
.chat-empty{margin:auto;color:var(--gray);text-align:center;font-size:.85rem;max-width:34rem;line-height:1.4}
.msg{max-width:82%;align-self:flex-start;background:var(--light);position:relative;
  border:1px solid var(--border);border-radius:10px;padding:.3rem .55rem}
.msg.own{align-self:flex-end;background:#eff6ff;border-color:#bfdbfe}
.msg-head{display:flex;align-items:center;gap:.35rem;margin-bottom:.05rem;flex-wrap:wrap;
  padding-right:1.35rem}  /* отступ под кнопку ⋮ — время/галочки не залезают под неё */
.msg-name{font-weight:700;font-size:.76rem}
.msg-time{color:var(--gray);font-size:.66rem;margin-left:auto;padding-left:.5rem}
.msg-body{font-size:.84rem;line-height:1.35;white-space:pre-wrap;word-break:break-word}
.msg-edited{color:var(--gray);font-size:.7rem;font-style:italic}

/* «⋮» — вызов меню действий. ПК: появляется при наведении; сенсор: скрыта (там long-press). */
.msg-menu-btn{position:absolute;top:.15rem;right:.2rem;opacity:0;background:none;color:var(--gray);
  font-size:1.05rem;line-height:1;padding:.05rem .28rem;border-radius:6px;transition:opacity .15s,background .15s}
.msg:hover .msg-menu-btn{opacity:.65}
.msg-menu-btn:hover{opacity:1;background:rgba(0,0,0,.07)}
@media (pointer:coarse){ .msg-menu-btn{display:none} .msg{user-select:none;-webkit-user-select:none;-webkit-touch-callout:none} }

/* меню действий — выпадает по «⋮» (ПК) или long-press (сенсор) */
.msg-actions{position:absolute;top:1.5rem;right:.2rem;z-index:100;flex-direction:column;gap:.05rem;
  min-width:9.5rem;padding:.25rem;background:var(--card);border:1px solid var(--border);
  border-radius:10px;box-shadow:var(--shadow);display:none}
.msg-actions.open{display:flex;animation:menuPop .12s ease}
@keyframes menuPop{from{opacity:0;transform:scale(.92) translateY(-4px)}to{opacity:1;transform:none}}
.msg-actions.up{top:auto;bottom:1.5rem}
/* Бэкдроп-размытие при открытом меню (только сенсор) */
.msg-backdrop{position:absolute;inset:0;z-index:90;backdrop-filter:blur(3px) brightness(.75);
  -webkit-backdrop-filter:blur(3px) brightness(.75);background:rgba(0,0,0,.15);animation:lbIn .15s ease}
.cv-rc-status{background:none;border:none;font-size:.8rem;font-weight:700;color:#9ca3af;padding:0;min-width:0;line-height:1.55}
.cv-rc-status.read{color:var(--blue)}
/* у чужих сообщений (слева) меню открывается от левого края пузыря — не вылезает за экран */
.msg:not(.own) .msg-actions{right:auto;left:0}
/* разделитель и строка читателей в long-press меню (только сенсор) */
.mact-sep{height:1px;background:var(--border);margin:.2rem .1rem}
.mact-readers{font-size:.74rem;color:var(--gray);padding:.3rem .5rem;cursor:default}
.mact-readers:hover{background:transparent}
/* реакции: ряд выбора в меню + чипы под сообщением */
.react-row{display:flex;gap:.1rem;padding:.1rem .05rem .3rem;margin-bottom:.2rem;
  border-bottom:1px solid var(--border);justify-content:space-between}
.react-pick{background:none;font-size:1.15rem;line-height:1;padding:.2rem .3rem;border-radius:8px;
  transition:transform .1s,background .15s}
.react-pick:hover{background:rgba(0,0,0,.07);transform:scale(1.15)}
.msg-reacts{display:flex;flex-wrap:wrap;gap:.25rem;margin-top:.3rem}
.react-chip{display:inline-flex;align-items:center;gap:.15rem;font-size:.76rem;font-weight:600;line-height:1;
  padding:.18rem .45rem;border-radius:99px;border:1px solid var(--border);background:var(--card);color:var(--dark);cursor:pointer}
.react-chip.mine{border-color:var(--blue);background:#eff6ff;color:var(--blue-dk)}
:root[data-theme="dark"] .react-chip.mine{background:#1c3151;color:#bfdbfe}
:root[data-theme="dark"] .react-pick:hover{background:rgba(255,255,255,.1)}
.msg-act{background:none;font-size:.82rem;color:var(--dark);text-align:left;width:100%;
  padding:.42rem .55rem;border-radius:7px}
.msg-act:hover{background:rgba(0,0,0,.07)}

/* удалённое сообщение */
.msg.deleted{background:#f8fafc;border-style:dashed}
:root[data-theme="dark"] .msg.deleted{background:#1e293b}
.msg-deleted-note{font-size:.86rem;color:var(--gray);font-style:italic}
.msg-orig{margin-top:.25rem;font-size:.82rem;color:var(--gray);white-space:pre-wrap;
  word-break:break-word;border-left:2px solid var(--border);padding-left:.5rem}
.msg-deleter{margin-top:.15rem;font-size:.72rem;color:#b91c1c;font-weight:600}

.edit-banner{display:none;align-items:center;gap:.5rem;padding:.45rem .8rem;
  background:#eff6ff;border-top:1px solid #bfdbfe;font-size:.82rem;color:var(--blue-dk)}
.edit-banner.on{display:flex}
.edit-banner .cancel{margin-left:auto;background:none;color:var(--danger);font-weight:700}
.reply-banner .reply-banner-info{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.reply-banner-info strong{color:var(--blue-dk)}

/* галочки прочтения (свои сообщения): ✓ отправлено, ✓✓ прочитано */
.msg-check{font-size:.7rem;color:var(--gray);margin-left:.1rem;letter-spacing:-2px}
.msg-check.read{color:var(--blue)}

/* цитата сообщения, на которое отвечают */
.msg-reply{border-left:3px solid var(--blue);background:rgba(37,99,235,.06);border-radius:5px;
  padding:.15rem .45rem;margin:.1rem 0 .3rem;cursor:pointer;max-width:100%;overflow:hidden}
.msg.own .msg-reply{border-left-color:var(--blue-dk);background:rgba(37,99,235,.1)}
.msg-reply-name{font-weight:700;font-size:.74rem;color:var(--blue-dk);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.msg-reply-text{font-size:.76rem;color:var(--gray);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* разделитель дат (как в Telegram) */
.date-sep{align-self:center;margin:.4rem 0 .35rem;flex:0 0 auto}
.date-sep span{background:rgba(15,23,42,.55);color:#fff;font-size:.72rem;font-weight:600;
  padding:.13rem .7rem;border-radius:99px}

/* подсветка сообщения при переходе по ответу */
.msg-flash{animation:msgFlash 1.4s ease}
@keyframes msgFlash{0%,45%{background:#fde68a;border-color:#f59e0b}}

/* список «Прочитано кем» (попап по ℹ️) */
.read-list{list-style:none;margin:.2rem 0 0;padding:0;display:flex;flex-direction:column;
  gap:.1rem;max-height:50vh;overflow-y:auto}
.read-list li{font-size:.92rem;font-weight:600;padding:.32rem .1rem;border-bottom:1px solid var(--border)}
.read-list li:last-child{border-bottom:none}
.read-list li.muted{font-weight:400}

.chat-input{display:flex;gap:.4rem;padding:.5rem;border-top:1px solid var(--border);background:var(--card);align-items:center}
.chat-input input,.chat-input textarea{flex:1;min-width:0;padding:.5rem .85rem;border:1.5px solid var(--border);border-radius:14px;font-family:inherit;font-size:.82rem;line-height:1.4}
.chat-input textarea{resize:none;overflow-y:hidden;min-height:2.1rem;max-height:8rem;display:block}
.chat-input input:focus,.chat-input textarea:focus{outline:none;border-color:var(--blue)}
.chat-send{flex:0 0 auto;min-width:2.4rem;justify-content:center;font-size:1.05rem;line-height:1}
.chat-clip{flex:0 0 auto;min-width:2.4rem;justify-content:center;font-size:1.05rem;line-height:1}
/* ── Inner wrapper: emoji · textarea · clip ───────────────── */
.chat-input-inner{flex:1;min-width:0;display:flex;align-items:flex-end;border:1.5px solid var(--border);border-radius:14px;background:var(--card);padding:.1rem .25rem;transition:border-color .15s}
.chat-input-inner:focus-within{border-color:var(--blue)}
.chat-input .chat-input-inner textarea{flex:1;min-width:0;border:none;background:transparent;padding:.42rem .35rem;font-family:inherit;font-size:.82rem;line-height:1.4;resize:none;overflow-y:hidden;min-height:2.1rem;max-height:8rem;display:block;outline:none}
.chat-input-inner .chat-emoji,.chat-input-inner .chat-clip{flex-shrink:0;align-self:flex-end;min-width:2.2rem;font-size:1rem;line-height:1;padding:.28rem}
.chat-note{text-align:center;color:var(--gray);font-size:.7rem;margin:.3rem 0 .15rem;flex:0 0 auto;line-height:1.3}

/* картинки в сообщениях */
.msg-img{max-width:180px;max-height:180px;border-radius:10px;display:block;border:1px solid var(--border);cursor:pointer}
.msg-img-link{display:inline-block;margin-bottom:.25rem}
.chat-box.drag-over{outline:2px dashed var(--blue);outline-offset:-6px}
.img-preview{display:flex;flex-direction:column;gap:.4rem;padding:.5rem .7rem;border-top:1px solid var(--border);background:var(--light,#f8fafc)}
.img-preview-top{display:flex;align-items:center;gap:.6rem}
.img-preview img{width:44px;height:44px;object-fit:cover;border-radius:8px;border:1px solid var(--border)}
.img-preview-name{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.8rem}
.img-preview-x{flex:0 0 auto;background:none;border:none;font-size:1.3rem;line-height:1;color:var(--gray);cursor:pointer;padding:.1rem .4rem}
.img-preview-x:hover{color:#b91c1c}
.img-up-bar{height:6px;background:#e2e8f0;border-radius:99px;overflow:hidden}
.img-up-bar.hidden{display:none}
.img-up-fill{height:100%;width:0;background:var(--blue);transition:width .15s}
.img-up-row{display:flex;align-items:center;gap:.6rem;margin-top:.2rem}
.img-up-row.hidden{display:none}
.img-up-row .img-up-bar{flex:1}

/* превью прикреплённых картинок для ИИ (несколько) */
.ai-thumbs{display:flex;gap:.5rem;flex-wrap:wrap}
.ai-thumb{position:relative;width:56px;height:56px;flex:0 0 auto}
.ai-thumb img{width:56px;height:56px;object-fit:cover;border-radius:8px;border:1px solid var(--border)}
.ai-thumb-x{position:absolute;top:-6px;right:-6px;width:18px;height:18px;border-radius:50%;border:none;
  background:#ef4444;color:#fff;font-size:.8rem;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center}

/* список участников со статусом присутствия */
.presence-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.1rem;max-height:60vh;overflow-y:auto}
.presence-row{display:flex;align-items:center;gap:.6rem;padding:.45rem .4rem;border-radius:8px}
.presence-row:hover{background:var(--light,#f8fafc)}
.presence-dot{flex:0 0 auto;width:10px;height:10px;border-radius:50%}
.dot-online{background:#22c55e}
.dot-away{background:#f59e0b}
.dot-offline{background:#cbd5e1}
.presence-name{flex:1;min-width:0;font-weight:600;font-size:.9rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.presence-state{flex:0 0 auto;font-size:.76rem;color:var(--gray)}
.state-online{color:#16a34a}
.state-away{color:#d97706}

/* ИИ-сообщения */
.ai-img{max-width:220px;max-height:220px;border-radius:10px;margin-top:.35rem;display:block;border:1px solid var(--border);cursor:pointer}
.msg.ai-typing{opacity:.75}
.msg.ai-typing .msg-body{font-style:italic;color:var(--gray)}

/* участники комнаты */
.member-list{list-style:none;display:flex;flex-direction:column;gap:.4rem;
  margin:.25rem 0 .75rem;max-height:240px;overflow-y:auto}
.member-list li{display:flex;align-items:center;gap:.5rem;padding:.4rem .6rem;
  background:var(--light);border-radius:8px;font-size:.88rem}
.member-list .rm{margin-left:auto}

/* ═══════════════════════════════════════════════════════════
   ОБЩИЙ ВЕРХНИЙ БАР (files / admin)
═══════════════════════════════════════════════════════════ */
.topbar{display:flex;align-items:center;justify-content:space-between;gap:.4rem .7rem;
  padding:.35rem 1.25rem;min-height:50px;flex-wrap:wrap;background:var(--card);
  border-bottom:1px solid var(--border);position:sticky;top:0;z-index:50}
.topbar-brand{display:flex;align-items:center;gap:.45rem;font-weight:800;font-size:1.05rem;color:var(--dark);min-width:0}
.topbar-brand svg{color:var(--blue);flex:0 0 auto;width:20px;height:20px}
.topbar-right{display:flex;align-items:center;gap:.4rem;flex-wrap:wrap}

/* чип пользователя: «логин (роль)», цвет по роли */
.user-chip{font-size:.74rem;font-weight:700;padding:.2rem .6rem;border-radius:99px;
  white-space:nowrap;max-width:46vw;overflow:hidden;text-overflow:ellipsis}
.role-owner{background:#fee2e2;color:#b91c1c}
.role-admin{background:#ede9fe;color:#7c3aed}
.role-moderator{background:#dcfce7;color:#15803d}
.role-user{background:#dbeafe;color:#1d4ed8}

/* ── files.php ─────────────────────────────────────────────── */
.files-main{display:flex;align-items:center;justify-content:center;min-height:calc(100vh - 60px);padding:2rem}
.empty-card{background:var(--card);border-radius:16px;border:1px solid var(--border);
  padding:3.5rem 3rem;text-align:center;max-width:420px;box-shadow:var(--shadow)}
.empty-icon{color:var(--blue);opacity:.6;margin-bottom:1rem}
.empty-card h2{font-size:1.3rem;margin-bottom:.4rem}
.empty-card p{color:var(--gray);margin-bottom:1.5rem}

/* ═══════════════════════════════════════════════════════════
   admin.php
═══════════════════════════════════════════════════════════ */
.admin-main{max-width:1200px;margin:0 auto;padding:1.75rem}
.storage-cell{font-size:.78rem}
.flash{padding:.8rem 1.1rem;border-radius:10px;font-weight:600;margin-bottom:1.25rem}
.flash-success{background:#ecfdf5;color:#047857;border:1px solid #a7f3d0}
.flash-error{background:#fef2f2;color:#b91c1c;border:1px solid #fecaca}

.admin-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(108px,1fr));gap:.75rem;margin-bottom:1.5rem}
.stat-box{background:var(--card);border:1px solid var(--border);border-radius:12px;padding:1rem .55rem;
  text-align:center;font-size:.74rem;color:var(--gray);font-weight:600;min-width:0}
.stat-box span{display:block;font-size:1.8rem;font-weight:800;color:var(--dark);line-height:1.1}

.panel{background:var(--card);border:1px solid var(--border);border-radius:14px;padding:1.5rem;margin-bottom:1.5rem}
.panel h2{font-size:1.05rem;margin-bottom:1rem}

.add-form{display:flex;flex-wrap:wrap;gap:.75rem}
.add-form input,.add-form select{padding:.6rem .8rem;border:1.5px solid var(--border);
  border-radius:8px;flex:1;min-width:140px}
.add-form input:focus,.add-form select:focus{outline:none;border-color:var(--blue)}

/* форма управления хранилищами */
.storage-form .sf-grid{display:flex;flex-wrap:wrap;gap:1rem;margin-bottom:1rem}
.sf-field{display:flex;flex-direction:column;gap:.35rem;flex:1;min-width:180px}
.sf-field>span{font-size:.82rem;font-weight:600;color:var(--gray)}
.sf-field input{padding:.6rem .8rem;border:1.5px solid var(--border);border-radius:8px}
.sf-field input:focus{outline:none;border-color:var(--blue)}
.sf-field small{font-size:.74rem}
.sf-actions{display:flex;gap:.6rem;flex-wrap:wrap}
@media(max-width:560px){ .sf-field{min-width:0;flex-basis:100%} }

.table-wrap{overflow-x:auto}
table{width:100%;border-collapse:collapse}
.admin-main .actions{white-space:nowrap}
th{padding:.7rem .9rem;text-align:left;font-size:.72rem;font-weight:700;text-transform:uppercase;
  letter-spacing:.05em;color:var(--gray);background:var(--light);white-space:nowrap}
td{padding:.8rem .9rem;border-top:1px solid var(--border);font-size:.9rem;vertical-align:middle}
.badge{display:inline-block;padding:.15rem .55rem;border-radius:99px;font-size:.72rem;font-weight:700}
.badge-admin{background:#ede9fe;color:#7c3aed}
.badge-moderator{background:#dcfce7;color:#15803d}
.badge-user{background:#dbeafe;color:var(--blue)}
.actions{display:flex;flex-wrap:nowrap;gap:.35rem;align-items:center}
.actions .btn{padding:.35rem .5rem;font-size:.85rem;min-width:2rem;justify-content:center;flex:0 0 auto}
.role-select{padding:.15rem .55rem;border:1.5px solid var(--border);border-radius:99px;
  font-size:.72rem;font-weight:700;background:var(--card);color:var(--dark);
  height:1.55rem;line-height:1.15rem;box-sizing:border-box}
.role-select:focus{outline:none;border-color:var(--blue)}
/* единая высота form-элементов в строках admin-панели */
.actions .btn,.actions .role-select,.actions input:not([type="checkbox"]),
.chat-mgmt-row .btn,.chat-mgmt-row input:not([type="checkbox"]){height:2rem;box-sizing:border-box;padding-top:0;padding-bottom:0}
.inline{display:flex}
.nowrap{white-space:nowrap}
.hint{color:var(--gray);font-size:.8rem;margin-top:.75rem;line-height:1.4}

/* ── Адаптив ──────────────────────────────────────────────── */
/* планшеты/телефоны: прячем текст кнопок, оставляем иконки */
/* узкое окно: логотип сверху, кнопки по центру под ним */
@media(max-width:1000px){
  .topbar{flex-direction:column;align-items:center;gap:.35rem}
  .topbar-brand{justify-content:center;width:100%;flex-wrap:wrap}
  .topbar-right{justify-content:center;width:100%}
}
@media(max-width:760px){
  .topbar{padding:.3rem .7rem;min-height:auto}
  .topbar .btn-sm{padding:.34rem .5rem}
  .btn-lbl{display:none}
  .brand-lbl{display:none}
  .topbar-brand{font-size:1rem}
  .user-chip{max-width:70vw}
  .chat-main{padding:.4rem .45rem .3rem}
  .chat-messages{padding:.45rem .5rem;gap:.25rem}
}
@media(max-width:640px){
  .room-tabs{display:none}
  .room-select{display:block}
}
@media(max-width:560px){
  .add-form{flex-direction:column}
  .add-form input,.add-form select{min-width:0}
  .msg{max-width:92%}
  .upload-form{flex-direction:column;align-items:stretch}
  .upload-form input[type=file]{width:100%}
  .upload-form .btn{width:100%;justify-content:center}
  .tab-bar{justify-content:center}
  .files-head{flex-direction:column;align-items:center;text-align:center}
  .storage-line{width:100%;max-width:340px;text-align:center}
  #cv-stack{right:.5rem;left:.5rem;bottom:calc(1.6rem + env(safe-area-inset-bottom, 0px));max-width:none;align-items:stretch}
  #cv-stack .cv-toast,#cv-stack .cv-up-widget{width:auto}
}

/* настройки уведомлений */
.notif-row{display:flex;align-items:center;gap:.5rem;padding:.45rem 0;font-size:.95rem;cursor:pointer}
.notif-row input{width:18px;height:18px}
.notif-sub{padding-left:calc(18px + .5rem);font-size:.9rem}
/* большие экраны / ТВ: чуть крупнее и не растягиваем контент */
@media(min-width:1600px){
  html{font-size:18px}
}

/* ═══════════════════════════════════════════════════════════
   ВНУТРЯНКА ПОЛЬЗОВАТЕЛЯ (имитация облака) + модалка пароля
═══════════════════════════════════════════════════════════ */
.files-area{max-width:1000px;margin:0 auto;padding:1.75rem}
.files-head{display:flex;flex-direction:column;align-items:center;text-align:center;
  gap:.5rem;margin-bottom:1.25rem}
.files-head h1{font-size:1.3rem;font-weight:800}
.storage-line{width:100%;max-width:420px}
.storage-line .bar{background:var(--border);border-radius:99px;height:8px;margin:.35rem 0;overflow:hidden}
.storage-line .bar>div{height:100%;border-radius:99px;background:linear-gradient(90deg,var(--blue),var(--cyan))}
.storage-line small{color:var(--gray);font-size:.8rem}

.fgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:1rem}
.fcard{background:var(--card);border:1px solid var(--border);border-radius:12px;padding:1.4rem 1rem;
  text-align:center;position:relative;user-select:none}
.fcard-ico{font-size:2.6rem;margin-bottom:.5rem;line-height:1}
.fcard-name{font-size:.82rem;font-weight:600;word-break:break-word}
.fcard-meta{font-size:.72rem;color:var(--gray);margin-top:.2rem}
.fcard .shared{position:absolute;top:.5rem;right:.5rem;font-size:.72rem}

.modal-card{background:var(--card);border-radius:16px;padding:1.75rem;width:100%;max-width:440px;
  box-shadow:0 20px 60px rgba(0,0,0,.25);animation:popIn .2s ease;max-height:90vh;overflow-y:auto}
.modal-card h2{font-size:1.2rem;margin-bottom:1.25rem;text-align:center}
.modal-card.members-card{max-width:520px}
.modal-actions{display:flex;gap:.75rem;justify-content:flex-end;align-items:center;margin-top:1.25rem;flex-wrap:wrap}

/* модалка участников: списки с чекбоксами */
.mm-h{font-size:.78rem;color:var(--gray);margin:.6rem 0 .25rem;text-transform:uppercase;letter-spacing:.05em;font-weight:700}
.check-list{list-style:none;display:flex;flex-direction:column;gap:.15rem;margin:0 0 .5rem;
  max-height:200px;overflow-y:auto;border:1px solid var(--border);border-radius:8px;padding:.35rem}
.check-list label{display:flex;align-items:center;justify-content:flex-start;gap:.55rem;padding:.32rem .45rem;border-radius:6px;cursor:pointer}
.check-list label:hover{background:var(--light)}
.check-list .cl-name{flex:1;font-size:.9rem;font-weight:500}
.check-list li.muted{padding:.4rem .45rem;font-size:.85rem}
.mm-act-btn{width:100%;margin-bottom:.4rem}
.topbar-right{flex-wrap:wrap}

/* роль Владельца + кнопка передачи */
.badge-owner{background:#fee2e2;color:#b91c1c}
.btn-warn{background:#f59e0b;color:#fff}
.btn-warn:hover{background:#d97706}

/* пустое хранилище */
.empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;
  text-align:center;min-height:calc(100vh - 60px - 3.5rem);gap:.2rem}
.empty-ico{color:var(--blue);opacity:.35;margin-bottom:.5rem}
.empty-state h1{font-size:1.5rem;font-weight:800}
.empty-state p{color:var(--gray);margin-top:.3rem}
.empty-storage{margin-top:1.75rem;width:240px;max-width:80%}
.empty-storage .bar{background:var(--border);border-radius:99px;height:8px;margin:.4rem 0;overflow:hidden}
.empty-storage .bar>div{height:100%;border-radius:99px;background:linear-gradient(90deg,var(--blue),var(--cyan))}
.empty-storage small{color:var(--gray);font-size:.8rem}

/* ═══════════════════════════════════════════════════════════
   УВЕДОМЛЕНИЯ ЧАТА + ФАЙЛОВОЕ ХРАНИЛИЩЕ
═══════════════════════════════════════════════════════════ */
/* кружок-счётчик непрочитанного */
.nav-badge,.tab-badge{display:inline-flex;align-items:center;justify-content:center;
  min-width:1.1rem;height:1.1rem;padding:0 .32rem;border-radius:99px;background:var(--danger);
  color:#fff;font-size:.68rem;font-weight:800;line-height:1}
.nav-badge{margin-left:.35rem}
.tab-badge{margin-left:.4rem;vertical-align:middle}

/* загрузка файлов */
.upload-form{display:flex;gap:.6rem;align-items:center;flex-wrap:wrap;
  background:var(--card);border:1px solid var(--border);border-radius:12px;padding:.8rem 1rem;margin-bottom:.5rem}
.upload-form input[type=file]{flex:1;min-width:0;font-size:.9rem}
.up-bar{display:none;width:100%;height:8px;background:var(--border);border-radius:99px;overflow:hidden;margin-top:.2rem}
.up-bar.on{display:block}
.up-bar-fill{height:100%;width:0;border-radius:99px;background:linear-gradient(90deg,var(--blue),var(--cyan));transition:width .2s}
.upload-hint{text-align:center;color:var(--gray);font-size:.8rem;margin:.2rem 0 1rem}
#upload-msg{margin-bottom:1.25rem}

/* список файлов */
.file-list{display:flex;flex-direction:column;gap:.5rem}
.file-row{display:flex;align-items:center;gap:.75rem;background:var(--card);border:1px solid var(--border);
  border-radius:10px;padding:.55rem .85rem}
.file-ico{font-size:1.4rem;flex:0 0 auto;line-height:1}
.file-name{flex:1;min-width:0;font-weight:600;font-size:.92rem;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.file-size{min-width:72px;text-align:right;font-size:.82rem}
.file-date{min-width:84px;text-align:right;font-size:.82rem}
.file-del-date{min-width:84px;text-align:right;font-size:.82rem}
.file-user{min-width:120px;flex:0 0 auto;font-weight:500;font-size:.8rem;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.file-act{flex:0 0 auto;min-width:34px;text-align:center}
.file-check{width:18px;height:18px;flex:0 0 auto;cursor:pointer}
.file-check-spacer{width:18px;flex:0 0 auto}
/* шапка таблицы файлов */
.file-head-row{display:flex;align-items:center;gap:.75rem;padding:.2rem .85rem .35rem;
  font-size:.72rem;text-transform:uppercase;letter-spacing:.03em;color:var(--gray);font-weight:700}
.file-head-row .fh-name{flex:1;min-width:0}
.file-head-row .file-size,.file-head-row .file-date,.file-head-row .file-del-date{font-size:.72rem}
.file-bulk{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-top:.85rem;flex-wrap:wrap}
.file-bulk-actions{display:flex;align-items:center;gap:.6rem;flex-wrap:wrap}
.select-all{display:flex;align-items:center;gap:.45rem;font-size:.85rem;color:var(--gray);cursor:pointer}
.select-all input{width:18px;height:18px}
.dl-wrap{position:relative}
.dl-menu{position:absolute;bottom:calc(100% + .4rem);left:0;z-index:20;display:flex;flex-direction:column;gap:.3rem;
  background:var(--card);border:1px solid var(--border);border-radius:10px;padding:.4rem;
  box-shadow:0 8px 24px rgba(0,0,0,.14);min-width:230px}
.dl-menu .btn{justify-content:flex-start;text-align:left}
@media(max-width:560px){ .file-date,.file-del-date{display:none} .file-user{min-width:84px} }

/* вкладки «Мои файлы / Общая папка» */
.tab-bar{display:flex;gap:.5rem;margin-bottom:1rem;flex-wrap:wrap}
.tab{padding:.45rem .9rem;border-radius:99px;border:1px solid var(--border);background:var(--card);
  color:var(--gray);font-weight:600;font-size:.88rem;text-decoration:none}
.tab:hover{text-decoration:none;color:var(--dark)}
.tab.active{background:var(--blue);color:#fff;border-color:var(--blue)}

/* мини-полоса хранилища в таблице админки */
.cell-storage{min-width:150px}
.cell-storage .bar{background:var(--border);border-radius:99px;height:6px;overflow:hidden;margin-bottom:.2rem}
.cell-storage .bar>div{height:100%;border-radius:99px;background:linear-gradient(90deg,var(--blue),var(--cyan))}
.cell-storage small{font-size:.74rem;color:var(--gray)}

/* активная кнопка (доступ к общей папке) */
.btn-on{background:#dcfce7;color:#15803d;border:1.5px solid #86efac}
.btn-on:hover{background:#bbf7d0}

/* личный кабинет: две крупные кнопки в модалке по центру */
.cab-actions{display:flex;flex-direction:column;gap:.6rem;margin:.4rem 0 1rem}
.cab-actions .btn{justify-content:flex-start;font-size:.95rem;padding:.7rem 1rem}

/* виджет фоновой загрузки (справа внизу) */
.cv-up-widget{width:300px;max-width:100%;
  background:var(--card);border:1px solid var(--border);border-radius:12px;box-shadow:0 12px 40px rgba(0,0,0,.18);overflow:hidden}
.cv-up-widget.hidden{display:none}
.cv-up-head{display:flex;align-items:center;justify-content:space-between;padding:.55rem .8rem;
  background:var(--blue);color:#fff;font-weight:700;font-size:.85rem}
.cv-up-min{background:none;border:none;color:#fff;font-size:1rem;cursor:pointer;line-height:1;padding:.1rem .35rem}
.cv-up-widget.collapsed .cv-up-list{display:none}
.cv-up-list{max-height:260px;overflow-y:auto;padding:.5rem .7rem;display:flex;flex-direction:column;gap:.65rem}
.cv-up-item{font-size:.8rem}
.cv-up-row{display:flex;align-items:center;gap:.5rem;margin-bottom:.25rem}
.cv-up-name{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cv-up-pct{flex:0 0 auto;font-weight:700;color:var(--gray)}
.cv-up-cancel{flex:0 0 auto;background:none;border:none;color:var(--gray);font-size:1.1rem;line-height:1;
  cursor:pointer;padding:0 .2rem;border-radius:6px}
.cv-up-cancel:hover{color:#dc2626;background:#fee2e2}
.cv-up-bar{height:6px;background:var(--light);border-radius:99px;overflow:hidden}
.cv-up-fill{height:100%;width:0;background:var(--blue);transition:width .2s}
.cv-up-item.done.ok .cv-up-fill{background:#22c55e}
.cv-up-item.done.err .cv-up-fill{background:#ef4444}
.cv-up-item.done.ok .cv-up-pct{color:#16a34a}
.cv-up-item.done.err .cv-up-pct{color:#dc2626}
.cv-up-status{margin-top:.2rem;color:var(--gray);font-size:.74rem}

/* ═══════════════════════════════════════════════════════════
   КОМПАКТНЫЙ РЕЖИМ
   Общее уменьшение размеров: админка и хранилища — существенно,
   чат (обычный и ИИ) — ещё плотнее, всплывающие окна — компактнее.
   Блок в конце файла, чтобы перекрывать базовые правила; адаптивные
   медиа-запросы (выше) при этом продолжают работать на мобильных.
═══════════════════════════════════════════════════════════ */
/* HTML-атрибут hidden должен реально скрывать даже элементы с .btn
   (иначе у Groq, где скрепка скрыта через hidden, она всё равно видна,
   потому что .btn{display:inline-flex} перебивает UA-правило [hidden]). */
[hidden]{display:none!important}

/* кнопки и текст — чуть компактнее на всех страницах */
.btn{padding:.4rem .85rem;font-size:.86rem}
.btn-sm{padding:.3rem .6rem;font-size:.76rem}

/* ── Админ-панель: существенно компактнее ── */
.admin-main{padding:1.1rem}
.admin-stats{gap:.5rem;margin-bottom:1rem}
.stat-box{padding:.7rem .45rem;font-size:.72rem}
.stat-box span{font-size:1.55rem}
.panel{padding:1rem 1.1rem;margin-bottom:1rem}
.panel h2{font-size:.95rem;margin-bottom:.7rem}
.add-form{gap:.5rem}
.add-form input,.add-form select{padding:.45rem .6rem}
.sf-grid{gap:.7rem;margin-bottom:.7rem}
.sf-field input{padding:.45rem .6rem}
.sf-field>span{font-size:.78rem}
.admin-main input:not(.role-select),.admin-main select:not(.role-select){font-size:16px}
/* статус-бар свободного места на сервере */
.disk-head{display:flex;align-items:center;justify-content:space-between;gap:.5rem 1rem;flex-wrap:wrap;margin-bottom:.5rem}
.disk-head h2{margin-bottom:0}
.disk-panel .storage-line{max-width:none}
/* разбивка использования внутри окна «Место на сервере» */
.disk-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(155px,1fr));gap:.35rem 1rem;margin-top:.8rem}
.disk-grid>div{display:flex;align-items:center;justify-content:space-between;gap:.6rem;
  font-size:.78rem;border-top:1px solid var(--border);padding-top:.32rem}
.disk-grid .dg-k{color:var(--gray);display:flex;align-items:center;gap:.35rem;min-width:0;white-space:nowrap}
.disk-grid .dg-v{flex:0 0 auto;font-weight:700;white-space:nowrap}
.disk-dot{flex:0 0 auto;width:9px;height:9px;border-radius:50%}
/* счётчики на телефоне — аккуратным квадратом 2×2; разбивку — в 2 колонки,
   одиночную последнюю ячейку («База данных») центрируем под двумя верхними */
@media(max-width:560px){
  .admin-stats{grid-template-columns:repeat(2,1fr)}
  .disk-grid{grid-template-columns:repeat(2,1fr)}
  .disk-grid>div:last-child:nth-child(odd){grid-column:1 / -1;justify-content:center;gap:1.4rem}
  /* панель действий под файлами — по центру в столбик */
  .file-bulk{flex-direction:column;align-items:center;gap:.65rem;text-align:center}
  .select-all{justify-content:center;align-self:center;background:var(--card);border:1px solid var(--border);
    border-radius:99px;padding:.4rem 1rem;color:var(--dark)}
  .file-bulk-actions{justify-content:center;width:100%}
  .file-bulk-actions .btn{flex:1 1 0;min-width:0}   /* строго равная ширина */
}
th{padding:.45rem .6rem;font-size:.68rem}
td{padding:.45rem .6rem;font-size:.82rem}

.actions .btn{padding:.3rem .45rem;font-size:.82rem}
.hint{font-size:.76rem;margin-top:.6rem}
.storage-cell,.cell-storage small{font-size:.74rem}

/* ── Хранилища (Мои файлы / Общая папка): существенно компактнее ── */
/* снизу учитываем «полоску home» на телефоне (safe-area), чтобы панель
   действий не липла к краю экрана */
.files-area{padding:1.1rem;padding-bottom:calc(1.1rem + env(safe-area-inset-bottom,0px))}
.files-head{margin-bottom:.9rem}
.files-head h1{font-size:1.1rem}
.storage-line small{font-size:.76rem}
.tab-bar{margin-bottom:.8rem}
.tab{padding:.36rem .75rem;font-size:.82rem}
.upload-form{padding:.55rem .8rem;margin-bottom:.4rem}
.upload-form input[type=file]{font-size:.82rem}
.upload-hint{font-size:.76rem;margin:.15rem 0 .8rem}
.file-list{gap:.4rem}
.file-row{padding:.4rem .65rem;gap:.6rem}
/* иконка формата — фиксированной ширины, чтобы шапка таблицы совпадала по колонкам */
.file-ico{font-size:1.2rem;flex:0 0 auto;width:1.6rem;text-align:center}
.fh-ico{flex:0 0 auto;width:1.6rem}
.file-head-row{gap:.6rem;padding:.2rem .65rem .35rem}
.file-name{font-size:.84rem}
.file-size,.file-date,.file-del-date{font-size:.78rem}
.empty-state h1{font-size:1.2rem}
.fcard{padding:1rem .8rem}
.fcard-ico{font-size:2.1rem}

/* переключатель вида (Таблица / Значки) */
.view-toggle{display:flex;gap:.25rem;margin-left:auto}
.vt-btn{padding:.3rem .55rem;border:1px solid var(--border);background:var(--card);border-radius:8px;
  color:var(--gray);font-size:.95rem;line-height:1}
.vt-btn.active{background:var(--blue);border-color:var(--blue);color:#fff}
/* в табличном виде миниатюра скрыта (показывается только в «значках») */
.file-thumb{display:none}

/* вид «Значки» (как в Проводнике): карточки с миниатюрой/крупной иконкой */
.files-area.view-grid .file-head-row{display:none}
.files-area.view-grid .file-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(128px,1fr));gap:.7rem}
.files-area.view-grid .file-row{flex-direction:column;align-items:stretch;text-align:center;
  position:relative;padding:.6rem .5rem;gap:.35rem;cursor:pointer}
.files-area.view-grid .file-check,
.files-area.view-grid .file-check-spacer{position:absolute;top:.45rem;left:.45rem;margin:0;z-index:2}
.files-area.view-grid .file-thumb{display:block;width:100%;height:92px;object-fit:cover;
  border-radius:8px;background:var(--light);border:1px solid var(--border)}
.files-area.view-grid .file-ico{width:100%;height:92px;font-size:3rem;
  display:flex;align-items:center;justify-content:center}
.files-area.view-grid .file-row.has-thumb .file-ico{display:none}
.files-area.view-grid .file-name{white-space:normal;word-break:break-word;font-size:.78rem;line-height:1.25;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.files-area.view-grid .file-size{text-align:center;font-size:.72rem}
.files-area.view-grid .file-date,
.files-area.view-grid .file-del-date,
.files-area.view-grid .file-user{display:none}

/* ── Чат и ИИ-ассистенты: ещё плотнее ── */
/* снизу учитываем «полоску home» (safe-area) — поле ввода и подсказка не липнут к краю */
.chat-main{padding-bottom:0}
.room-tab{padding:.32rem .7rem;font-size:.8rem}
.room-select{padding:.4rem .7rem;font-size:.84rem}
.chat-messages{gap:.22rem;padding-bottom:.15rem}
/* первое сообщение прижато к низу: при малом числе сообщений они у поля ввода
   (как в мессенджерах), при переполнении margin-top:auto схлопывается и работает скролл */
.chat-messages > :first-child{margin-top:auto}
/* нижний спейсер-контент: padding-bottom скролл-контейнера Chrome игнорирует в самом низу,
   поэтому последнее сообщение подлезало под поле ввода — спейсер даёт реальный отступ */
.chat-messages::after{content:'';flex:0 0 auto;height:.12rem}
.msg{padding:.26rem .5rem}
.msg-name{font-size:.72rem}
.msg-time{font-size:.62rem}
.msg-body{font-size:.8rem;line-height:1.3}
.msg-act{font-size:.7rem}
.msg-deleted-note,.msg-orig{font-size:.78rem}
.chat-input{padding:.4rem .4rem .35rem}
.chat-input input,.chat-input textarea{padding:.42rem .75rem;font-size:16px}  /* 16px — без зума на iOS */
.chat-input .chat-input-inner textarea{padding:.38rem .3rem;font-size:16px}
.chat-send,.chat-clip{min-width:2.2rem;font-size:1rem}
/* Мобильная скрепка: скрыта на десктопе, видна на мобайле (вне chat-input-inner, слева) */
.chat-clip-mobile{display:none}
/* chat-send на десктопе скрыт (Enter отправляет), на мобайле показан */
.chat-send-mobile{display:none}
@media(pointer:coarse){
  .chat-clip-mobile{display:inline-flex;flex:0 0 auto;min-width:2.2rem;justify-content:center;font-size:1rem;line-height:1}
  .chat-input-inner .chat-clip{display:none}   /* скрепка внутри chat-input-inner на мобайле скрыта */
  .chat-send-mobile{display:inline-flex}
  input:focus,select:focus,textarea:focus{font-size:16px!important}  /* iOS: без зума при фокусе */
}
.chat-note{font-size:.66rem;margin:.05rem 0 .3rem}  /* симметрично: сверху мало, снизу не липнет к краю карточки */
.msg-img{max-width:150px;max-height:150px}
.ai-img{max-width:180px;max-height:180px}

/* ── Всплывающие окна (личный кабинет, уведомления, участники/настройки) ── */
.modal-card{padding:1.2rem;max-width:400px}
.modal-card h2{font-size:1.05rem;margin-bottom:.9rem}
.modal-card.members-card{max-width:460px}
.modal-actions{margin-top:1rem}
.cab-actions{gap:.5rem;margin:.3rem 0 .8rem}
.cab-actions .btn{font-size:.88rem;padding:.55rem .8rem}
.notif-row{font-size:.86rem;padding:.35rem 0}
.notif-row input{width:16px;height:16px}
.notif-sub{padding-left:calc(16px + .5rem)}
.form-group{margin-bottom:.85rem}
.form-group label{font-size:.84rem}
.form-group input{padding:.55rem .75rem}
.check-list .cl-name{font-size:.84rem}
.check-list label{padding:.28rem .4rem}
.presence-name{font-size:.84rem}
.presence-state{font-size:.72rem}
.mm-h{font-size:.74rem}

/* ═══════════════════════════════════════════════════════════
   ГЛАВНАЯ СТРАНИЦА (home.php)
═══════════════════════════════════════════════════════════ */
/* ── Светлая главная (переменные, как у всего сайта) ── */
body.home-page{background:var(--light);color:var(--dark);min-height:100vh;display:flex;flex-direction:column}
:root[data-theme="dark"] body.home-page{background:#0f172a;color:#e2e8f0}

.home-wrap{display:flex;flex-direction:column;min-height:100vh;max-width:680px;margin:0 auto;
  padding:0 1rem calc(1.5rem + env(safe-area-inset-bottom,0px));width:100%}

/* ── Шапка ── */
.home-header{display:flex;align-items:center;justify-content:space-between;
  padding:calc(1.1rem + env(safe-area-inset-top,0px)) 0 1rem}
.home-user{display:flex;flex-direction:column;gap:.1rem}
.home-site{font-size:.72rem;color:var(--gray);letter-spacing:.08em;text-transform:uppercase;font-weight:600}
.home-username{font-size:1.35rem;font-weight:800;color:var(--dark);line-height:1.1}
:root[data-theme="dark"] .home-username{color:#f1f5f9}
.home-role{font-size:.75rem;font-weight:700;border-radius:99px;
  padding:.15rem .55rem;display:inline-block;margin-top:.2rem;width:fit-content}

.home-header-icons{display:flex;gap:.4rem;align-items:center}
.home-icon-btn{background:var(--border);border:none;color:var(--gray);border-radius:12px;
  width:2.4rem;height:2.4rem;font-size:1.1rem;display:flex;align-items:center;justify-content:center;
  cursor:pointer;transition:background .18s,color .18s}
.home-icon-btn:hover{background:#d1d5db;color:var(--dark)}
:root[data-theme="dark"] .home-icon-btn{background:rgba(255,255,255,.08);color:#94a3b8}
:root[data-theme="dark"] .home-icon-btn:hover{background:rgba(255,255,255,.14);color:#e2e8f0}
.home-icon-btn.btn-on{background:#dbeafe;color:var(--blue)}
:root[data-theme="dark"] .home-icon-btn.btn-on{background:rgba(37,99,235,.3);color:#93c5fd}

/* ── Карточки ── */
.home-main{display:flex;flex-direction:column;gap:.75rem;flex:1}

.home-card{display:flex;align-items:center;justify-content:space-between;
  background:#fff;border:1px solid var(--border);
  border-radius:18px;padding:1.15rem 1.25rem;text-decoration:none;color:var(--dark);
  transition:background .18s,transform .15s,box-shadow .15s;
  box-shadow:0 2px 8px rgba(0,0,0,.05)}
.home-card:hover{background:#f8faff;transform:translateY(-1px);box-shadow:0 4px 16px rgba(37,99,235,.12);
  text-decoration:none;color:var(--dark)}
.home-card:active{transform:scale(.98)}
:root[data-theme="dark"] .home-card{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.09);color:#f1f5f9}
:root[data-theme="dark"] .home-card:hover{background:rgba(255,255,255,.1);color:#fff}

.home-card-left{display:flex;align-items:center;gap:1rem}
.home-card-ico{font-size:2rem;line-height:1;flex:0 0 auto}
.home-card-title{font-size:1.05rem;font-weight:700;margin-bottom:.15rem}
.home-card-sub{font-size:.78rem;color:var(--gray)}

.home-badge{background:#ef4444;color:#fff;font-size:.7rem;font-weight:800;
  min-width:1.3rem;height:1.3rem;border-radius:99px;padding:0 .3rem;
  display:flex;align-items:center;justify-content:center}

/* ── Маленькие кнопки ── */
.home-small-row{display:grid;grid-template-columns:repeat(2,1fr);gap:.75rem;margin-top:.25rem}
.home-small-btn{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.4rem;
  background:#fff;border:1px solid var(--border);border-radius:16px;
  padding:.9rem .5rem;color:var(--gray);text-decoration:none;font-size:.8rem;font-weight:600;
  transition:background .18s,color .18s;cursor:pointer;box-shadow:0 2px 8px rgba(0,0,0,.04)}
.home-small-btn:hover{background:#f1f5f9;color:var(--dark);text-decoration:none}
.home-small-btn:active{transform:scale(.97)}
:root[data-theme="dark"] .home-small-btn{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.09);color:#94a3b8}
:root[data-theme="dark"] .home-small-btn:hover{background:rgba(255,255,255,.1);color:#e2e8f0}
.home-small-ico{font-size:1.4rem;line-height:1}
.home-small-exit{color:#ef4444}
.home-small-exit:hover{background:#fef2f2;color:#dc2626}
:root[data-theme="dark"] .home-small-exit{color:#f87171}
:root[data-theme="dark"] .home-small-exit:hover{background:rgba(239,68,68,.15);color:#fca5a5}

/* ── Простой topbar для внутренних страниц ── */
.topbar-inner{display:flex;align-items:center;gap:.5rem;padding:.35rem 1rem;min-height:46px;
  background:var(--card);border-bottom:1px solid var(--border);
  position:sticky;top:0;z-index:50;padding-top:calc(.35rem + env(safe-area-inset-top,0px))}
.topbar-home{display:flex;align-items:center;gap:.45rem;text-decoration:none;
  color:var(--dark);font-weight:800;font-size:1rem;transition:transform .18s,opacity .18s}
.topbar-home:hover{transform:scale(.94);opacity:.8;text-decoration:none}
.topbar-home svg{color:var(--blue);flex:0 0 auto;width:20px;height:20px}
.topbar-home-lbl{color:var(--dark)}
.topbar-back{display:flex;align-items:center;justify-content:center;width:2rem;height:2rem;
  border-radius:8px;color:var(--gray);text-decoration:none;font-size:1.1rem;
  transition:background .15s;flex:0 0 auto}
.topbar-back:hover{background:var(--light);text-decoration:none;color:var(--dark)}
.topbar-inner .user-chip{margin-left:auto}

/* ── Markdown в ответах ассистента ── */
.msg-body.md{white-space:normal}
.msg-body.md>:first-child{margin-top:0}
.msg-body.md>:last-child{margin-bottom:0}
.msg-body.md h1,.msg-body.md h2,.msg-body.md h3,
.msg-body.md h4,.msg-body.md h5,.msg-body.md h6{font-size:.85rem;font-weight:650;margin:.45rem 0 .15rem}
.msg-body.md p{margin:.25rem 0}
.msg-body.md ul,.msg-body.md ol{margin:.2rem 0 .2rem 1.15rem}
.msg-body.md li{margin:.1rem 0}
/* жирный — помягче, чтобы не «кричал» */
.msg-body.md strong{font-weight:600}
.msg-body.md a{text-decoration:underline}
.msg-body.md code{background:rgba(0,0,0,.07);padding:.04rem .3rem;border-radius:5px;
  font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:.92em}
.msg-body.md pre{background:#0f172a;color:#e2e8f0;padding:.5rem .65rem;border-radius:8px;
  overflow-x:auto;margin:.3rem 0}
.msg-body.md pre code{background:none;padding:0;color:inherit}

/* ═══════════════════════════════════════════════════════════
   ЛАЙТБОКС (просмотр фото поверх страницы)
═══════════════════════════════════════════════════════════ */
.msg-img,.ai-img{cursor:zoom-in}
.lightbox{position:fixed;inset:0;z-index:1000;display:flex;align-items:center;justify-content:center;
  background:rgba(8,12,20,.92);padding:1.5rem;animation:lbIn .18s ease;cursor:zoom-out}
.lightbox.hidden{display:none}
.lightbox-img{max-width:100%;max-height:100%;border-radius:10px;box-shadow:0 20px 70px rgba(0,0,0,.6);
  object-fit:contain;cursor:default}
.lightbox-close{position:absolute;top:.8rem;right:1rem;width:2.4rem;height:2.4rem;border-radius:50%;
  background:rgba(255,255,255,.12);color:#fff;font-size:1.3rem;line-height:1;display:flex;
  align-items:center;justify-content:center;transition:background .15s}
.lightbox-close:hover{background:rgba(255,255,255,.25)}
@keyframes lbIn{from{opacity:0}to{opacity:1}}
body.lb-open{overflow:hidden}

/* кнопка переключения темы в шапке */
.theme-toggle{min-width:2.2rem;justify-content:center;font-size:1rem;line-height:1;padding-left:.5rem;padding-right:.5rem}

/* ═══════════════════════════════════════════════════════════
   ПРЕДЛОЖЕНИЯ АДМИНУ (статусы, списки)
═══════════════════════════════════════════════════════════ */
.sg-status{font-size:.7rem;font-weight:700;padding:.12rem .55rem;border-radius:99px;white-space:nowrap}
.sg-new{background:#dbeafe;color:#1d4ed8}
.sg-prog{background:#fef3c7;color:#b45309}
.sg-done{background:#dcfce7;color:#15803d}
.sg-rej{background:#fee2e2;color:#b91c1c}
:root[data-theme="dark"] .sg-new{background:#16263f;color:#93c5fd}
:root[data-theme="dark"] .sg-prog{background:#3a2e12;color:#fcd34d}
:root[data-theme="dark"] .sg-done{background:#13301f;color:#86efac}
:root[data-theme="dark"] .sg-rej{background:#3a1d1d;color:#fca5a5}

/* список в модалке кабинета */
/* зона ввода предложений (textarea + картинки + кнопка файла) */
.sg-drop-zone{border:1.5px solid var(--border);border-radius:10px;overflow:hidden;transition:border-color .15s}
.sg-drop-zone:focus-within,.sg-drop-zone.drag-over{border-color:var(--blue)}
.sg-drop-zone.drag-over{background:rgba(37,99,235,.05)}
.sg-body{width:100%;padding:.55rem .75rem .25rem;border:none;resize:none;
  font-family:inherit;font-size:16px;background:transparent;color:var(--dark);
  overflow-y:hidden;min-height:2.4rem;max-height:8rem;display:block}
.sg-body:focus{outline:none}
.sg-img-bar{display:flex;flex-wrap:wrap;gap:.35rem;padding:.25rem .5rem;min-height:0}
.sg-img-bar:empty{padding:0}
.sg-thumb-wrap{position:relative;display:inline-block}
.sg-thumb{width:56px;height:56px;object-fit:cover;border-radius:8px;border:1px solid var(--border);display:block}
.sg-thumb-rm{position:absolute;top:-6px;right:-6px;width:18px;height:18px;border-radius:50%;
  background:var(--danger);color:#fff;font-size:.7rem;line-height:1;display:flex;align-items:center;
  justify-content:center;cursor:pointer;border:none}
.sg-item-imgs{display:flex;flex-wrap:wrap;gap:.3rem;margin-top:.35rem}
.sg-actions-row{display:flex;align-items:center;gap:.3rem;padding:.25rem .4rem .3rem}
.sg-clip{padding:.2rem .5rem;font-size:.95rem}
.sg-admin-imgs{display:flex;flex-wrap:wrap;gap:.35rem;margin-bottom:.4rem}
/* sg-item-head: badge слева, дата посередине, кнопка удаления справа */
.sg-item-head{display:flex;align-items:center;gap:.4rem;margin-bottom:.25rem}
.sg-date{font-size:.72rem;color:var(--gray);margin-left:auto}   /* прижимаем дату к кнопке */
.sg-del-btn{width:1.5rem;height:1.5rem;border-radius:50%;border:1.5px solid var(--danger);
  background:none;font-size:.72rem;display:flex;align-items:center;justify-content:center;
  cursor:pointer;flex-shrink:0;color:var(--danger);line-height:1}
.sg-del-btn:hover{background:rgba(239,68,68,.1)}
/* sg-item подсветка при изменённом статусе */
.sg-item-new{border-left:3px solid var(--blue)!important;padding-left:calc(.65rem - 2px)}
/* бейдж со счётчиком в заголовке модалки предложений */
.sg-modal-badge{display:inline-flex;align-items:center;justify-content:center;
  min-width:1.35rem;height:1.35rem;padding:0 .35rem;border-radius:99px;
  background:var(--danger);color:#fff;font-size:.7rem;font-weight:700;
  vertical-align:middle;margin-left:.35rem}
/* лайтбокс для картинок предложений */
.sg-lightbox{cursor:zoom-in}
/* точка-бейдж на кнопке кабинета */
/* красная точка на кнопке 👤 (главная страница) */
.cab-dot{position:absolute;top:-1px;right:-1px;width:9px;height:9px;
  border-radius:50%;background:var(--danger);border:2px solid var(--card);pointer-events:none}
#hm-cab{position:relative}
/* кнопка «Предложения / замечания» — текст слева, бейдж справа */
.cab-suggest{justify-content:space-between!important}
/* inline-счётчик внутри кнопки «Предложения / замечания» */
.sg-cab-n{display:inline-flex;align-items:center;justify-content:center;
  min-width:1.15rem;height:1.15rem;padding:0 .28rem;border-radius:99px;
  background:var(--danger);color:#fff;font-size:.62rem;font-weight:700;
  margin-left:auto;line-height:1;pointer-events:none}
/* отступ между зоной ввода и flash-сообщениями в модалке предложений */
/* выравненные отступы в модалке предложений */
.sg-drop-zone{margin-bottom:.6rem}
.sg-drop-zone + .acct-msg,.acct-msg + .modal-actions{margin-top:.6rem}
.sg-list{margin-top:.7rem;display:flex;flex-direction:column;gap:.5rem;max-height:14rem;overflow-y:auto}
/* раздел «Управление чатами» в admin */
.panel-sub-h{font-size:.95rem;font-weight:700;margin-bottom:.55rem;color:var(--gray)}
.chat-mgmt-list{display:flex;flex-direction:column;gap:.4rem}
.chat-mgmt-row{display:flex;align-items:center;gap:.5rem}
.chat-mgmt-row .sg-cb{flex-shrink:0}
/* мобилка: всё в одну строку, но order чуть меньше + 16px чтобы iOS не зумил */
@media(max-width:600px){.cm-order{width:3.2rem;min-width:0;font-size:16px}.cm-name{min-width:0;font-size:16px}}
/* мобилка: сетка sf-grid в один столбец */
@media(max-width:600px){.sf-grid.sf-grid--chat{grid-template-columns:1fr!important}}
.cm-order{width:4rem;text-align:center;padding:.4rem .5rem;border:1.5px solid var(--border);border-radius:8px;font-size:.9rem;background:var(--card);color:var(--dark)}
.cm-name{flex:1;padding:.4rem .65rem;border:1.5px solid var(--border);border-radius:8px;font-size:.9rem;background:var(--card);color:var(--dark)}
/* bulk-бар заголовка предложений */
.sg-bulk-bar{display:flex;align-items:center;gap:.65rem;flex-wrap:wrap;margin-bottom:.75rem;padding-left:.85rem}
.sg-bulk-bar h2{flex:1;min-width:0}
.sg-bulk-tools{display:flex;align-items:center;gap:.4rem;flex-wrap:wrap}
.sg-check-all{display:flex;align-items:center;cursor:pointer;flex-shrink:0;width:18px;height:18px;margin:0}
/* убираем отдельные кнопки actions у item */
.sg-admin-actions{display:none}
/* отступ кнопок под textarea (модалка предложений) */
.modal-actions{margin-top:.75rem!important}
.sg-item{border:1px solid var(--border);border-radius:10px;padding:.5rem .65rem;background:var(--light)}
.sg-item-head{display:flex;align-items:center;justify-content:space-between;gap:.5rem;margin-bottom:.25rem}
.sg-date{font-size:.72rem;color:var(--gray)}
.sg-item-body{font-size:.85rem;line-height:1.35;white-space:pre-wrap;word-break:break-word}

/* список у админа */
.sg-admin{display:flex;flex-direction:column;gap:.6rem}
.sg-admin-item{border:1px solid var(--border);border-radius:12px;padding:.7rem .85rem .7rem .85rem;background:var(--light)}
.sg-admin-top{display:grid;grid-template-columns:18px auto auto 1fr;align-items:center;gap:.55rem;margin-bottom:.35rem}
.sg-cb{width:18px;height:18px;cursor:pointer;margin:0}
.sg-author{font-size:.85rem}
.sg-admin-body{font-size:.9rem;line-height:1.4;white-space:pre-wrap;word-break:break-word;margin-bottom:.5rem}
.sg-admin-actions{display:flex;align-items:center;gap:.5rem}
.sg-sel{padding:.3rem .55rem;border:1.5px solid var(--border);border-radius:8px;font-size:.82rem;
  background:var(--card);color:var(--dark)}

/* ═══════════════════════════════════════════════════════════
   CHANGELOG (история изменений)
═══════════════════════════════════════════════════════════ */
.topbar-cl-btn{position:relative;background:none;border:none;padding:.25rem .4rem;border-radius:8px;
  font-size:1.1rem;line-height:1;cursor:pointer;color:var(--dark);transition:background .15s;flex:0 0 auto}
.topbar-cl-btn:hover{background:var(--light)}
.topbar-cl-badge{position:absolute;top:-2px;right:-4px;background:#ef4444;color:#fff;
  font-size:.6rem;font-weight:700;line-height:1;padding:2px 4px;border-radius:99px;
  min-width:14px;text-align:center;pointer-events:none}
.cl-modal-card{max-width:560px}
.cl-list{display:flex;flex-direction:column;gap:.6rem;max-height:52vh;overflow-y:auto;margin-bottom:.25rem}
.cl-entry{padding:.65rem .75rem;border-radius:10px;background:var(--light);border:1px solid var(--border)}
.cl-entry-new{border-left:3px solid var(--blue);padding-left:calc(.75rem - 2px)}
.cl-entry-head{display:flex;align-items:center;gap:.45rem;flex-wrap:nowrap}
.cl-entry-title{font-weight:700;font-size:.92rem;flex:1;min-width:0;word-break:break-word}
.cl-new-tag{font-size:.65rem;font-weight:700;background:var(--blue);color:#fff;
  padding:1px 6px;border-radius:99px;white-space:nowrap;flex-shrink:0}
.cl-del-btn{background:none;border:none;cursor:pointer;padding:.15rem .3rem;border-radius:6px;
  font-size:.85rem;color:var(--gray);flex-shrink:0;line-height:1}
.cl-del-btn:hover{background:#fee2e2;color:#dc2626}
.cl-entry-body{font-size:.86rem;color:var(--gray);margin-top:.3rem;white-space:pre-wrap;word-break:break-word}
.cl-entry-date{font-size:.72rem;color:var(--gray);margin-top:.25rem;opacity:.7}
.cl-add-sep{border:none;border-top:1px solid var(--border);margin:.9rem 0 .7rem}
.cl-add-form{display:flex;flex-direction:column;gap:.45rem}
.cl-add-form input,.cl-add-form textarea{padding:.42rem .6rem;border:1.5px solid var(--border);
  border-radius:8px;background:var(--card);color:var(--dark);font-size:.9rem;font-family:inherit;resize:none}
.cl-add-form input:focus,.cl-add-form textarea:focus{outline:none;border-color:var(--blue)}
:root[data-theme="dark"] .cl-entry{background:#1e293b;border-color:#334155}
:root[data-theme="dark"] .cl-add-form input,:root[data-theme="dark"] .cl-add-form textarea{background:#1e293b;border-color:#334155;color:#f1f5f9}

/* ═══════════════════════════════════════════════════════════
   REDESIGNED CHAT LAYOUT (сессия 7)
═══════════════════════════════════════════════════════════ */
.chat-main{padding:.65rem;max-width:none!important;width:100%;overflow:visible}
.cv-chat-layout{display:grid;grid-template-columns:300px 1fr;height:calc(100vh - 52px - 1.3rem);overflow:hidden;border-radius:14px;box-shadow:var(--shadow)}
.chat-input{padding-bottom:.35rem}
/* ── Sidebar ─────────────────────────────────────────────── */
.cv-sidebar{display:flex;flex-direction:column;border-right:1px solid var(--border);overflow:hidden;background:var(--card)}
.cv-sidebar-head{display:flex;align-items:center;justify-content:center;padding:0 1rem;height:48px;font-weight:700;font-size:.75rem;letter-spacing:.08em;text-transform:uppercase;color:var(--gray);border-bottom:1px solid var(--border);flex-shrink:0;position:relative}
.cv-sidebar-head .btn{position:absolute;right:.75rem}
.cv-room-list{flex:1;overflow-y:auto}
.cv-room-empty{padding:1.25rem 1rem;color:var(--gray);font-size:.875rem}
/* ── Room cards ──────────────────────────────────────────── */
.cv-room-card{display:grid;grid-template-columns:1fr auto;grid-template-rows:auto auto;padding:.7rem 1rem;cursor:pointer;border-bottom:1px solid var(--border);column-gap:.5rem;row-gap:.15rem;transition:background .1s;user-select:none}
.cv-room-card:hover{background:var(--light)}
.cv-room-card.active{background:#eff6ff}
[data-theme=dark] .cv-room-card:hover{background:#1e293b}
[data-theme=dark] .cv-room-card.active{background:rgba(37,99,235,.18)}
.cv-rc-name{font-weight:600;font-size:.9rem;grid-column:1;grid-row:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--dark)}
.cv-room-card.has-unread .cv-rc-name{font-weight:700}
.cv-rc-preview{font-size:.78rem;color:var(--gray);grid-column:1;grid-row:2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cv-rc-preview.cv-rc-typing{color:var(--blue);font-style:italic}
.cv-rc-time{font-size:.73rem;color:var(--gray);white-space:nowrap}
.cv-rc-badge{background:var(--blue);color:#fff;font-size:.68rem;font-weight:700;padding:.1em .5em;border-radius:99px;min-width:1.4em;text-align:center;line-height:1.55}
.cv-rc-meta{grid-column:2;grid-row:1/3;align-self:center;justify-self:end;display:flex;flex-direction:column;align-items:flex-end;gap:.15rem}
/* ── Chat area ───────────────────────────────────────────── */
.cv-chat-area{display:flex;flex-direction:column;overflow:hidden;min-width:0;background:var(--light)}
/* Placeholder «Выберите чат» по центру chat-box */
.cv-no-room{display:flex;flex-direction:column;align-items:center;justify-content:center;
  flex:1;text-align:center;gap:.4rem;color:var(--gray)}
.cv-no-room.hidden{display:none}
.cv-no-room-ico{font-size:3rem;opacity:.35;line-height:1}
.cv-no-room-title{font-size:1.15rem;font-weight:700;color:var(--dark);opacity:.55}
.cv-no-room-hint{font-size:.82rem;max-width:22rem;line-height:1.4}
[data-theme=dark] .cv-no-room-title{color:#e2e8f0}
/* ── Chat header ─────────────────────────────────────────── */
.cv-chat-header{display:flex;align-items:center;gap:.35rem;padding:.25rem .65rem;height:48px;border-bottom:1px solid var(--border);flex-shrink:0;background:var(--card);position:relative}
.cv-back-btn{display:none;background:none;border:none;font-size:1.15rem;padding:.25rem .45rem;border-radius:8px;color:var(--dark);line-height:1;transition:background .15s}
.cv-back-btn:hover{background:var(--light)}
.cv-room-title-btn{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:0;background:none;padding:.15rem .35rem;min-width:0;overflow:hidden}
.cv-room-name{font-weight:600;font-size:.97rem;color:var(--dark);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-align:center;max-width:100%}
.cv-room-count{font-size:.73rem;color:var(--gray);white-space:nowrap;flex-shrink:0;height:1.05rem;line-height:1.05rem;overflow:hidden}
.cv-room-count.hidden{display:none}
.cv-room-title-btn .typing-bar{font-size:.73rem;color:var(--gray);font-style:italic;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%;text-align:center;min-height:0;height:1.05rem;line-height:1.05rem}
.cv-room-title-btn .typing-bar.hidden{display:none}
.cv-header-right{flex-shrink:0}
.cv-menu-btn{background:none;border:none;font-size:1.2rem;padding:.25rem .5rem;border-radius:8px;color:var(--dark);line-height:1;transition:background .15s}
.cv-menu-btn:hover{background:var(--light)}
.cv-header-menu{position:absolute;right:.35rem;top:calc(100% + 4px);background:var(--card);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);z-index:200;min-width:0;overflow:hidden}
.cv-hmenu-item{display:block;width:100%;padding:.6rem .9rem;text-align:left;background:none;border:none;cursor:pointer;font-size:.88rem;color:var(--dark);transition:background .1s;white-space:nowrap}
.cv-hmenu-item:hover{background:var(--light)}
.cv-hmenu-danger{color:#dc2626}
[data-theme=dark] .cv-back-btn:hover,[data-theme=dark] .cv-room-title-btn:hover,[data-theme=dark] .cv-menu-btn:hover{background:#1e293b}
[data-theme=dark] .cv-hmenu-item:hover{background:#1e293b}
/* ── Grouped messages ────────────────────────────────────── */
.msg.msg-grouped{margin-top:.1rem}
.msg.msg-grouped .msg-head{justify-content:flex-end}
/* ── Mobile ──────────────────────────────────────────────── */
@media(max-width:680px){
  .chat-main{padding:0}
  .cv-chat-layout{grid-template-columns:1fr;position:relative;height:calc(100dvh - 52px - env(safe-area-inset-bottom,0px));border-radius:0;box-shadow:none}
  .cv-sidebar{position:absolute;inset:0;z-index:10;background:var(--card);transition:opacity .2s,transform .2s}
  .cv-chat-area{position:absolute;inset:0;z-index:5;opacity:0;pointer-events:none;transform:translateX(24px);transition:opacity .2s,transform .2s}
  .cv-chat-layout.cv-show-chat .cv-sidebar{opacity:0;pointer-events:none;transform:translateX(-24px)}
  .cv-chat-layout.cv-show-chat .cv-chat-area{opacity:1;pointer-events:auto;transform:none}
  .cv-back-btn{display:block}
}

/* === СОБЫТИЯ (events.php) === */
.events-area{max-width:1100px;margin:0 auto;padding:1rem 1rem 3rem}

/* Countdown bar на главной */
.event-countdown-bar{background:var(--blue);color:#fff;border-radius:12px;padding:.6rem 1rem;font-weight:600;font-size:.88rem;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:.5rem;margin-bottom:.75rem;text-decoration:none;text-align:center}
.event-countdown-label{width:100%;display:flex;align-items:center;justify-content:center;gap:.45rem;text-align:center}
.event-countdown-emoji{flex:0 0 auto;font-size:1rem;line-height:1}
.event-countdown-text{display:block}
.event-detail-back-wrap{margin-bottom:.65rem}
.event-detail-back{display:inline-flex;align-items:center;gap:.35rem;padding:.45rem .8rem;border-radius:999px;border:1px solid var(--border);background:var(--card);color:var(--dark);text-decoration:none;font-size:.84rem;font-weight:600}
.event-detail-back:hover{background:var(--light)}
.event-countdown-bar:hover{filter:brightness(1.08)}
:root[data-theme="dark"] .event-countdown-bar{background:var(--blue-dk)}

/* Карточка поездки в списке */
.event-card{background:var(--card);border:1px solid var(--border);border-radius:18px;padding:1rem 1.15rem;display:flex;align-items:center;justify-content:space-between;gap:.75rem;margin-bottom:.65rem;cursor:pointer;text-decoration:none;color:var(--dark);transition:background .15s,transform .15s}
.event-card:hover{background:#f8faff;transform:translateY(-1px);box-shadow:0 4px 16px rgba(37,99,235,.12)}
.event-card:active{transform:scale(.98)}
:root[data-theme="dark"] .event-card{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.09);color:#f1f5f9}
:root[data-theme="dark"] .event-card:hover{background:rgba(255,255,255,.1)}
.event-card-info{display:flex;flex-direction:column;gap:.2rem}
.event-card-title{font-size:1.05rem;font-weight:700}
.event-card-meta{font-size:.78rem;color:var(--gray)}
.event-card-tag{font-size:.72rem;font-weight:700;padding:.2rem .6rem;border-radius:99px;white-space:nowrap}
.event-card-tag.active{background:#dcfce7;color:#15803d}
.event-card-tag.inactive{background:var(--light);color:var(--gray)}
:root[data-theme="dark"] .event-card-tag.active{background:rgba(34,197,94,.15);color:#4ade80}
:root[data-theme="dark"] .event-card-tag.inactive{background:rgba(255,255,255,.06);color:#94a3b8}

/* Детали поездки */
.event-detail-header{margin-bottom:.5rem}
.event-detail-title{font-size:1.3rem;font-weight:800}
.event-detail-dates{font-size:.85rem;color:var(--gray);margin-top:.15rem}
.event-detail-dest{font-size:.85rem;color:var(--gray)}
.event-detail-actions{display:flex;gap:.5rem;margin-top:.5rem;flex-wrap:wrap}

/* Участники — секция */
.event-members-section{margin:.75rem 0}
.event-members-row{display:flex;gap:.4rem;flex-wrap:wrap;align-items:center}
.event-member-chip{font-size:.78rem;border-radius:99px;padding:.2rem .55rem;background:var(--light);display:flex;align-items:center;gap:.25rem;font-weight:600;position:relative;transition:background .15s}
.event-member-chip:hover{background:var(--border)}
:root[data-theme="dark"] .event-member-chip{background:rgba(255,255,255,.08)}
:root[data-theme="dark"] .event-member-chip:hover{background:rgba(255,255,255,.14)}
.event-member-chip.organizer{background:#eff6ff;border:1px solid #bfdbfe}
:root[data-theme="dark"] .event-member-chip.organizer{background:rgba(59,130,246,.12);border-color:rgba(59,130,246,.3)}
.chip-avatar{width:22px;height:22px;border-radius:50%;background:var(--blue);color:#fff;display:flex;align-items:center;justify-content:center;font-size:.65rem;font-weight:700;flex-shrink:0}
.chip-name{font-size:.78rem}
.chip-role{font-size:.6rem;padding:.05rem .35rem;border-radius:99px;font-weight:700;letter-spacing:.02em}
.chip-role.role-org{background:#dbeafe;color:#1d4ed8}
.chip-role.role-resp{background:#fef3c7;color:#92400e}
.chip-role.role-mem{background:var(--light);color:var(--gray)}
:root[data-theme="dark"] .chip-role.role-org{background:rgba(59,130,246,.2);color:#93c5fd}
:root[data-theme="dark"] .chip-role.role-resp{background:rgba(245,158,11,.15);color:#fbbf24}
:root[data-theme="dark"] .chip-role.role-mem{background:rgba(255,255,255,.08);color:#94a3b8}
.chip-menu-toggle{cursor:pointer;opacity:.35;font-size:.75rem;padding:0 .15rem;transition:opacity .15s}
.chip-menu-toggle:hover{opacity:1;color:var(--blue)}

/* Chip context menu */
.chip-context-menu{position:absolute;top:100%;left:0;background:var(--card);border:1px solid var(--border);border-radius:10px;padding:.3rem 0;box-shadow:0 8px 24px rgba(0,0,0,.15);z-index:1000;min-width:180px;margin-top:.25rem;opacity:1;pointer-events:auto}
:root[data-theme="dark"] .chip-context-menu{background:#1e293b;border-color:rgba(255,255,255,.12);box-shadow:0 8px 24px rgba(0,0,0,.4)}
.ctx-item{padding:.45rem .75rem;font-size:.82rem;cursor:pointer;transition:background .1s}
.ctx-item:hover{background:var(--light)}
:root[data-theme="dark"] .ctx-item:hover{background:rgba(255,255,255,.08)}
.ctx-item.ctx-danger{color:var(--danger)}
.ctx-item.ctx-danger:hover{background:#fef2f2}
:root[data-theme="dark"] .ctx-item.ctx-danger:hover{background:rgba(239,68,68,.12)}

/* Dropdown + Участник */
.event-add-member-wrap{position:relative}
.event-add-member{font-size:.78rem;border-radius:99px;padding:.3rem .65rem;border:1px dashed var(--border);color:var(--gray);cursor:pointer;background:transparent;transition:border-color .15s,color .15s}
.event-add-member:hover{border-color:var(--blue);color:var(--blue)}
.event-member-dropdown{position:absolute;top:100%;left:0;margin-top:.35rem;background:var(--card);border:1px solid var(--border);border-radius:12px;padding:.4rem 0;box-shadow:0 12px 32px rgba(0,0,0,.18);z-index:200;min-width:220px;max-height:260px;overflow-y:auto}
:root[data-theme="dark"] .event-member-dropdown{background:#1e293b;border-color:rgba(255,255,255,.12);box-shadow:0 12px 32px rgba(0,0,0,.5)}
.dropdown-item{display:flex;align-items:center;gap:.4rem;padding:.5rem .75rem;cursor:pointer;font-size:.85rem;transition:background .1s}
.dropdown-item:hover{background:var(--light)}
:root[data-theme="dark"] .dropdown-item:hover{background:rgba(255,255,255,.08)}
.dropdown-empty{padding:.75rem;text-align:center;color:var(--gray);font-size:.82rem}

/* Табы */
.event-tabs{display:flex;gap:.5rem;margin:1rem 0 .75rem}
.event-tab{padding:.5rem .95rem;border-radius:99px;border:1px solid var(--border);background:var(--card);color:var(--gray);font-weight:600;font-size:.88rem;cursor:pointer;transition:background .15s}
.event-tab.active{background:var(--blue);border-color:var(--blue);color:#fff}
.event-tab:hover:not(.active){background:var(--light)}
:root[data-theme="dark"] .event-tab{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.09)}
:root[data-theme="dark"] .event-tab.active{background:var(--blue-dk)}
:root[data-theme="dark"] .event-tab:hover:not(.active){background:rgba(255,255,255,.1)}

/* Задачи — карточки */
.event-task-list{display:flex;flex-direction:column;gap:.55rem}
.event-task-card{background:var(--light);border-radius:12px;padding:.65rem .75rem;transition:background .15s,border-color .15s}
.event-task-card.done{background:rgba(148,163,184,.08)}
.event-task-card.done .event-task-text{text-decoration:line-through}
.event-task-card.done .task-badge,
.event-task-card.done .item-assignee,
.event-task-card.done .chip-context-menu{opacity:1;pointer-events:auto}
:root[data-theme="dark"] .event-task-card{background:rgba(255,255,255,.05)}
.task-card-header{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap}
.event-task-check{width:18px;height:18px;accent-color:var(--blue);flex:0 0 auto;cursor:pointer}
.event-task-text{flex:1;font-size:.88rem;font-weight:600;word-break:break-word}
.task-badge{font-size:.68rem;padding:.15rem .4rem;border-radius:99px;font-weight:700;white-space:nowrap}
.task-badge.assignee{background:#f3e8ff;color:#7c3aed}
.task-badge.clickable{cursor:pointer}
.task-badge.clickable:hover{opacity:.8}
.task-badge.progress{background:#dcfce7;color:#15803d}
.task-badge.empty{background:var(--light);color:var(--gray);cursor:pointer;border:1px dashed var(--border);transition:background .15s}
.task-badge.empty:hover{background:var(--border)}
:root[data-theme="dark"] .task-badge.assignee{background:rgba(139,92,246,.2);color:#c4b5fd}
:root[data-theme="dark"] .task-badge.progress{background:rgba(34,197,94,.15);color:#4ade80}
:root[data-theme="dark"] .task-badge.empty{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.12);color:#94a3b8}
:root[data-theme="dark"] .task-badge.empty:hover{background:rgba(255,255,255,.1)}
.event-task-del{background:none;border:none;color:var(--gray);cursor:pointer;font-size:.85rem;opacity:.3;flex:0 0 auto}
.event-task-del:hover{opacity:1;color:var(--danger)}

/* Прогресс-бар задачи */
.task-progress-bar{height:4px;background:var(--border);border-radius:99px;margin:.35rem 0 .25rem;overflow:hidden}
:root[data-theme="dark"] .task-progress-bar{background:rgba(255,255,255,.1)}
.task-progress-fill{height:100%;background:var(--blue);border-radius:99px;transition:width .3s ease}

/* Чеклист внутри задачи */
.task-checklist{padding-left:1.2rem;display:flex;flex-direction:column;gap:.15rem}
.checklist-item{display:flex;align-items:center;gap:.4rem;font-size:.82rem;padding:.15rem 0;padding-left:1.8rem;transition:opacity .15s}
.checklist-item.done{opacity:.5}
.checklist-item.done .checklist-text{text-decoration:line-through}
.checklist-item input[type="checkbox"]{width:15px;height:15px;accent-color:var(--blue);flex:0 0 auto;cursor:pointer}
.checklist-text{flex:1;word-break:break-word}
.item-assignee{font-size:.65rem;padding:1px 5px;border-radius:8px;background:#ede9fe;color:#6d28d9;white-space:nowrap;cursor:default}
.item-assignee.clickable{cursor:pointer}
.item-assignee.empty{background:var(--light);color:var(--gray);border:1px dashed var(--border);cursor:pointer}
.item-assignee.empty:hover{background:var(--border)}
:root[data-theme="dark"] .item-assignee{background:rgba(139,92,246,.15);color:#c4b5fd}
:root[data-theme="dark"] .item-assignee.empty{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.12);color:#94a3b8}
:root[data-theme="dark"] .item-assignee.empty:hover{background:rgba(255,255,255,.1)}
.checklist-del{background:none;border:none;color:var(--gray);cursor:pointer;font-size:.72rem;opacity:.2;flex:0 0 auto}
.checklist-del:hover{opacity:1;color:var(--danger)}
.checklist-add{margin-top:.2rem;padding-left:1.2rem;display:flex;gap:.35rem;align-items:center}
.checklist-add input{flex:1;border:none;border-bottom:1px solid var(--border);background:transparent;padding:.2rem 0;font-size:.82rem;color:var(--dark);outline:none;min-width:0}
.checklist-add input:focus{border-color:var(--blue)}
:root[data-theme="dark"] .checklist-add input{color:#e2e8f0}
.checklist-add-btn{width:24px;height:24px;border-radius:50%;border:1px solid var(--border);background:var(--card);color:var(--blue);font-size:1rem;font-weight:700;cursor:pointer;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:background .15s}
.checklist-add-btn:hover{background:var(--blue);color:#fff}
:root[data-theme="dark"] .checklist-add-btn{border-color:rgba(255,255,255,.12);background:rgba(255,255,255,.06)}
:root[data-theme="dark"] .checklist-add-btn:hover{background:var(--blue-dk);color:#fff}

/* Расходы — таблица */
.event-expense-table-wrap{overflow-x:auto;border-radius:12px;border:1px solid var(--border);margin-bottom:.75rem}
:root[data-theme="dark"] .event-expense-table-wrap{border-color:rgba(255,255,255,.09)}
.event-expense-table{width:100%;border-collapse:collapse;font-size:.85rem}
.event-expense-table thead{background:var(--light)}
:root[data-theme="dark"] .event-expense-table thead{background:rgba(255,255,255,.06)}
.event-expense-table th{text-align:left;padding:.55rem .75rem;font-weight:700;font-size:.78rem;color:var(--gray);white-space:nowrap}
.event-expense-table td{padding:.5rem .75rem;border-top:1px solid var(--border)}
:root[data-theme="dark"] .event-expense-table td{border-color:rgba(255,255,255,.06)}
.event-expense-table .exp-payer{font-weight:600}
.event-expense-table .exp-amount{font-weight:700;white-space:nowrap}
.exp-per-person{font-weight:400;color:var(--gray);font-size:.75rem;margin-left:.35rem}
.event-expense-table .exp-pct{color:var(--gray);font-size:.8rem;white-space:nowrap}
.event-expense-table .exp-share{color:var(--gray);white-space:nowrap}
.event-expense-table .exp-total-row{background:var(--light);font-size:.9rem}
:root[data-theme="dark"] .event-expense-table .exp-total-row{background:rgba(255,255,255,.06)}
.event-expense-table.balance-table{table-layout:fixed}
.event-expense-table.balance-table th,.event-expense-table.balance-table td{vertical-align:top}
.event-expense-table.balance-table .balance-amount,.event-expense-table.balance-table .balance-phone{white-space:nowrap}
.event-expense-del{background:none;border:none;color:var(--gray);cursor:pointer;font-size:.85rem;opacity:.3;flex:0 0 auto}
.event-expense-del:hover{opacity:1;color:var(--danger)}

/* Расходы — мобильные карточки (скрыты на десктопе) */
.event-expense-cards{display:none}
.expense-card{background:var(--light);border-radius:12px;padding:.6rem .75rem;margin-bottom:.45rem}
:root[data-theme="dark"] .expense-card{background:rgba(255,255,255,.05)}
.expense-card-top{display:flex;align-items:center;gap:.5rem}
.expense-card-payer{font-weight:600;font-size:.85rem}
.expense-card-amount{font-weight:700;margin-left:auto;white-space:nowrap}
.expense-card-desc{font-size:.8rem;color:var(--gray);margin-top:.2rem}
.expense-card-total{display:flex;justify-content:space-between;font-weight:700;font-size:.95rem;background:var(--border)}
:root[data-theme="dark"] .expense-card-total{background:rgba(255,255,255,.08)}

/* Балансы */
.expense-subtabs{display:flex;gap:.4rem;margin-bottom:.75rem}
.expense-subtab{padding:.35rem .85rem;border-radius:99px;border:1px solid var(--border);background:var(--card);color:var(--gray);font-size:.82rem;font-weight:600;cursor:pointer;transition:background .15s;display:flex;align-items:center;gap:.35rem}
.expense-subtab.active{background:var(--blue);border-color:var(--blue);color:#fff}
.expense-subtab:hover:not(.active){background:var(--light)}
:root[data-theme="dark"] .expense-subtab{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.09)}
:root[data-theme="dark"] .expense-subtab.active{background:var(--blue-dk)}
:root[data-theme="dark"] .expense-subtab:hover:not(.active){background:rgba(255,255,255,.1)}
.expense-subtab-cnt{background:rgba(0,0,0,.1);border-radius:99px;padding:.05rem .4rem;font-size:.75rem;min-width:1.2rem;text-align:center}
.expense-subtab.active .expense-subtab-cnt{background:rgba(255,255,255,.25)}
.exp-empty{color:var(--gray);font-size:.85rem;padding:.75rem;text-align:center}
.exp-inbal-cell{text-align:center;width:2rem}
.exp-inbal-static{color:var(--gray);font-size:.82rem}
.expense-inbal-btn{width:1.5rem;height:1.5rem;font-size:.75rem}
.expense-card-bottom{display:flex;align-items:center;justify-content:space-between;margin-top:.25rem;gap:.5rem}
.expense-card-bottom .expense-card-desc{font-size:.8rem;color:var(--gray)}
.event-balances{margin-top:1rem;padding:.85rem 1rem;background:var(--light);border-radius:12px}
:root[data-theme="dark"] .event-balances{background:rgba(255,255,255,.05)}
.event-balances-title{font-size:.88rem;font-weight:700;margin-bottom:.5rem}

/* Персональные балансы — grid */
.balance-groups{display:flex;flex-direction:column;gap:.7rem;margin-bottom:.75rem}
.balance-personal-grid.two-cols{grid-template-columns:1fr;row-gap:5px}
.balance-col{display:flex;flex-direction:column;gap:.55rem}
.balance-col-title{font-size:.76rem;font-weight:700;color:var(--gray);text-transform:uppercase;letter-spacing:.04em}
.balance-personal-card{border-radius:10px;padding:.35rem .5rem;display:flex;flex-direction:row;align-items:center;justify-content:space-between;gap:.5rem;transition:transform .15s;border:1px solid transparent}
.balance-personal-card:hover{transform:translateY(-1px)}
.balance-personal-card.positive{background:#dcfce7 !important;color:#15803d !important;border-color:#86efac !important}
.balance-personal-card.negative{background:#fef2f2 !important;color:#dc2626 !important;border-color:#fca5a5 !important}
.balance-personal-card.zero{background:var(--card);color:var(--gray);border:1px solid var(--border)}
:root[data-theme="dark"] .balance-personal-card.positive{background:rgba(34,197,94,.12) !important;color:#4ade80 !important}
:root[data-theme="dark"] .balance-personal-card.negative{background:rgba(239,68,68,.12) !important;color:#f87171 !important}
:root[data-theme="dark"] .balance-personal-card.zero{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.08);color:#94a3b8}
.bp-name{font-size:.78rem;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bp-amount{font-size:.82rem;font-weight:700;white-space:nowrap}

/* Переводы */
.balance-transfers-title{font-size:.78rem;font-weight:600;color:var(--gray);margin-bottom:.35rem;text-transform:uppercase;letter-spacing:.04em}
.balance-transfers{display:flex;flex-direction:column;gap:.25rem}
.event-balance-row{display:grid;grid-template-columns:minmax(80px,1fr) auto minmax(80px,1fr) auto;align-items:center;gap:.45rem;padding:.45rem .6rem;border-radius:8px;font-size:.85rem;background:rgba(255,255,255,.5);border:1px solid var(--border)}
:root[data-theme="dark"] .event-balance-row{background:rgba(255,255,255,.04)}
.event-balance-row.owes{color:var(--danger)}
.event-balance-row.gets{color:var(--success)}
.balance-avatar{width:22px;height:22px;border-radius:50%;background:var(--border);display:flex;align-items:center;justify-content:center;font-size:.6rem;font-weight:700;flex-shrink:0}
:root[data-theme="dark"] .balance-avatar{background:rgba(255,255,255,.12)}
.balance-arrow{color:var(--gray);font-size:.85rem}
.balance-amount{margin-left:0;font-weight:700}
.balance-phone{font-size:.78rem;color:var(--blue);font-weight:600}
.balance-bank{grid-column:1 / -1;font-size:.74rem;color:var(--gray);margin-top:-.15rem}

/* Inline-формы добавления */
.event-add-form{display:flex;gap:.5rem;flex-wrap:wrap;margin-top:.75rem;padding:.75rem;background:var(--light);border-radius:12px;align-items:center}
:root[data-theme="dark"] .event-add-form{background:rgba(255,255,255,.05)}
.event-add-form input,.event-add-form select{flex:1;min-width:90px;padding:.45rem .6rem;border-radius:8px;border:1px solid var(--border);background:var(--card);color:var(--dark);font-size:.85rem}
:root[data-theme="dark"] .event-add-form input,:root[data-theme="dark"] .event-add-form select{background:rgba(255,255,255,.08);color:#e2e8f0;border-color:rgba(255,255,255,.12)}
.event-add-form .btn{flex:0 0 auto}

/* Мобильная адаптация */
.balance-phone,.balance-bank,.copyable{font-size:.78rem}
.form-group .check-list input[type="checkbox"],
.event-member-option input[type="checkbox"]{width:auto !important;flex:0 0 auto;padding:0;min-width:18px;max-width:18px;height:18px;margin:0}
.event-member-option{display:flex;align-items:center;justify-content:flex-start;gap:.55rem;padding:.28rem .45rem;cursor:pointer}
.event-member-option input{margin:0 0 0 .1rem;flex:0 0 auto}
#event-modal input[type="date"],#event-modal input[type="text"]{max-width:100%;width:100%}
#event-modal .form-group > div{min-width:0}
.chip-context-menu,.chip-context-menu *{opacity:1 !important;pointer-events:auto}
@media(max-width:560px){
  #event-modal .form-group[style*="display:flex"]{display:block !important}
  #event-modal .form-group[style*="display:flex"] > div{margin-bottom:.6rem;width:100%}
  .event-add-form{flex-direction:column}
  .event-add-form input,.event-add-form select{min-width:0}
  .event-expense-table-wrap{display:block !important;overflow-x:auto;-webkit-overflow-scrolling:touch}
  .event-expense-table{min-width:640px}
  .event-expense-cards{display:none !important}
  .event-balances{padding:.65rem}
  .task-card-header{gap:.35rem}
  .task-badge.responsive-hide{display:none}
  .chip-role{font-size:.55rem}
  .chip-avatar{width:18px;height:18px;font-size:.55rem}
  .balance-table-wrap{display:block !important;overflow-x:auto;-webkit-overflow-scrolling:touch}
  .balance-table{min-width:640px}
  .event-expense-table th,.event-expense-table td{padding:.45rem .5rem}
}