/* Profile page: hero, tabs, dialogs, settings, add news form, drafts, stats, notifications */

/* ── Profile hero, tabs, body, sidebar, settings, dialogs ── */
/* ---------- End DETAIL page ---------- */
.profile-hero{
  position:relative;
  margin:0 0 0;
  background:
    linear-gradient(180deg, transparent 0%, var(--bg) 100%),
    radial-gradient(circle at 25% 30%, rgba(255,92,41,.25) 0%, transparent 45%),
    radial-gradient(circle at 75% 70%, rgba(212,255,62,.2) 0%, transparent 50%),
    linear-gradient(135deg,#1a1915,#0b0b0a);
  padding:56px 0 0;
  border-bottom:1px solid var(--line);
}
.profile-hero::before{
  content:"";position:absolute;inset:0;
  background-image:repeating-linear-gradient(45deg, rgba(255,255,255,.02) 0 1px, transparent 1px 10px);
  mix-blend-mode:overlay;pointer-events:none;
}
.profile-hero-inner{
  max-width:1440px;margin:0 auto;padding:0 28px;position:relative;
  display:grid;grid-template-columns:auto 1fr auto;gap:28px;align-items:flex-end;
}
.profile-avatar-xl{
  width:120px;height:120px;border-radius:50%;flex-shrink:0;
  display:grid;place-items:center;
  font-family:"Fraunces",serif;font-weight:600;font-style:italic;font-size:52px;
  color:#0b0b0a;letter-spacing:-0.03em;
  border:4px solid var(--bg);
  box-shadow:0 16px 40px -10px rgba(0,0,0,.6);
}
.profile-avatar-xl.role-member{background:linear-gradient(135deg,#b9b2a1,#7a7466)}
.profile-avatar-xl.role-editor{background:linear-gradient(135deg,#00d4ff,#0099cc)}
.profile-avatar-xl.role-chief{background:linear-gradient(135deg,#a594f7,#6c5ce7)}
.profile-avatar-xl.role-admin{background:linear-gradient(135deg,#d4ff3e,#a8e018)}

.profile-identity{flex:1;min-width:0;padding-bottom:10px}
.profile-identity .eyebrow-mono{
  font-family:"JetBrains Mono",monospace;font-size:11px;letter-spacing:.22em;
  color:var(--ink-dim);text-transform:uppercase;display:block;margin-bottom:10px;
}
.profile-identity .eyebrow-mono::before{content:"";display:inline-block;width:24px;height:1px;background:var(--accent);vertical-align:middle;margin-right:10px}
.profile-identity h1{
  font-family:"Fraunces",serif;font-weight:400;font-size:52px;letter-spacing:-0.02em;
  margin:0 0 10px;line-height:1;
}
.profile-identity h1 em{font-style:italic;color:var(--accent);font-weight:300}
.profile-meta-row{
  display:flex;align-items:center;gap:14px;flex-wrap:wrap;
  color:var(--ink-soft);font-size:13px;
}
.profile-meta-row span{display:inline-flex;align-items:center;gap:5px}
.profile-meta-row svg{width:13px;height:13px;color:var(--ink-dim)}
.profile-meta-row .sep{color:var(--line-strong)}
.profile-role-badge{
  display:inline-flex;align-items:center;gap:6px;
  padding:4px 12px;border-radius:999px;
  font-family:"JetBrains Mono",monospace;font-size:10.5px;font-weight:700;
  letter-spacing:.14em;text-transform:uppercase;
}
.profile-role-badge::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor}
.profile-role-badge.role-member{background:rgba(185,178,161,.15);color:#c9c2b1;border:1px solid rgba(185,178,161,.35)}
.profile-role-badge.role-editor{background:rgba(0,212,255,.12);color:#00d4ff;border:1px solid rgba(0,212,255,.35)}
.profile-role-badge.role-chief{background:rgba(165,148,247,.15);color:#a594f7;border:1px solid rgba(165,148,247,.35)}
.profile-role-badge.role-admin{background:rgba(212,255,62,.12);color:var(--accent);border:1px solid rgba(212,255,62,.35)}

.profile-actions{padding-bottom:10px;display:flex;gap:10px;align-items:center}
.profile-actions .btn{padding:10px 18px}

/* Quick stats strip below hero */
.profile-stats{
  display:grid;grid-template-columns:repeat(5,1fr);gap:0;
  max-width:1440px;margin:0 auto;padding:0 28px;
  border-bottom:1px solid var(--line);
  background:var(--bg);
}
.p-stat{
  padding:22px 20px;text-align:left;
  border-right:1px solid var(--line);
  transition:background .15s;cursor:pointer;
  position:relative;
}
.p-stat:last-child{border-right:0}
.p-stat:hover{background:var(--surface)}
.p-stat b{
  font-family:"Fraunces",serif;font-weight:400;font-size:32px;letter-spacing:-0.02em;
  display:block;line-height:1;color:var(--ink);
}
.p-stat span{
  font-family:"JetBrains Mono",monospace;font-size:10.5px;letter-spacing:.18em;
  text-transform:uppercase;color:var(--ink-dim);margin-top:6px;display:block;
}
.p-stat.accent b{color:var(--accent)}

/* Tabs */
.profile-tabs{
  position:sticky;top:73px;z-index:20;
  background:rgba(11,11,10,.92);backdrop-filter:blur(12px);
  border-bottom:1px solid var(--line);
  overflow:visible;
}
body[data-theme="light"] .profile-tabs{
  background:rgba(250,250,247,.92);
}
body[data-theme="light"] .p-tab:hover{
  color:var(--ink);background:var(--bg-2);
}
body[data-theme="light"] .p-tab.active .c{
  background:rgba(139,170,30,.15);color:var(--accent);border-color:rgba(139,170,30,.4);
}
.profile-tabs-inner{
  max-width:1440px;margin:0 auto;padding:0 28px;
  display:flex;gap:2px;
  overflow:visible;
}
.profile-tabs-inner::-webkit-scrollbar{display:none}
.p-tab{
  display:inline-flex;align-items:center;gap:8px;
  padding:14px 18px;font-size:13.5px;
  color:var(--ink-dim);cursor:pointer;
  background:transparent;border:0;font-family:inherit;
  border-bottom:2px solid transparent;
  transition:color .15s, border-color .15s;
  white-space:nowrap;flex-shrink:0;
}
.p-tab:hover{color:var(--ink)}
.p-tab.active{color:var(--ink);border-bottom-color:var(--accent)}
.p-tab .c{
  font-family:"JetBrains Mono",monospace;font-size:10px;padding:2px 7px;
  background:var(--surface);border:1px solid var(--line);border-radius:999px;
  color:var(--ink-dim);
}
.p-tab.active .c{background:rgba(212,255,62,.12);color:var(--accent);border-color:rgba(212,255,62,.3)}
.p-tab svg{width:15px;height:15px}

/* Profile content layout */
.profile-body{
  max-width:1440px;margin:0 auto;padding:32px 28px 64px;
  display:grid;grid-template-columns:1fr 320px;gap:40px;
}
.profile-panel{display:none}
.profile-panel.active{display:block}

.panel-head{
  display:flex;justify-content:space-between;align-items:flex-end;gap:20px;
  margin-bottom:22px;padding-bottom:14px;flex-wrap:wrap;
}
.panel-head h2{
  font-family:"Fraunces",serif;font-weight:400;font-size:28px;letter-spacing:-0.02em;margin:0;
}
.panel-head h2 em{font-style:italic;color:var(--accent);font-weight:300}
.panel-head .subtitle{font-family:"JetBrains Mono",monospace;font-size:11px;letter-spacing:.15em;color:var(--ink-dim);text-transform:uppercase;display:block;margin-top:6px}
.panel-head .tools{display:flex;gap:8px;align-items:center;flex-wrap:wrap}

/* Overview — activity feed + stat cards */
.overview-grid{display:grid;grid-template-columns:1.4fr 1fr;gap:28px;margin-bottom:30px}
.stat-card{
  background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);
  padding:20px;
}
.stat-card h4{
  font-family:"JetBrains Mono",monospace;font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;
  color:var(--ink-dim);margin:0 0 16px;font-weight:600;
}
.stat-card .big{
  font-family:"Fraunces",serif;font-weight:400;font-size:42px;letter-spacing:-0.02em;line-height:1;
  color:var(--ink);
}
.stat-card .big em{font-style:italic;color:var(--accent);font-weight:300}
.stat-card .trend{
  display:inline-flex;align-items:center;gap:4px;margin-top:10px;
  font-family:"JetBrains Mono",monospace;font-size:11px;letter-spacing:.1em;
  color:var(--accent);
}
.stat-card .trend.down{color:var(--accent-2)}
.stat-card .trend svg{width:12px;height:12px}
.stat-card .caption{font-size:12.5px;color:var(--ink-soft);margin-top:8px}

/* Activity feed */
.activity-feed{
  background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);
  overflow:hidden;
}
.activity-feed .ah{
  padding:14px 20px;border-bottom:1px solid var(--line);
  display:flex;justify-content:space-between;align-items:center;
}
.activity-feed .ah h4{
  font-family:"JetBrains Mono",monospace;font-size:11px;letter-spacing:.2em;text-transform:uppercase;
  color:var(--ink-soft);margin:0;font-weight:600;
}
.activity-feed .ah a{font-size:11px;color:var(--ink-dim)}
.activity-feed .ah a:hover{color:var(--accent)}
.activity-list{padding:6px 0;max-height:460px;overflow-y:auto}
.activity-list::-webkit-scrollbar{width:6px}
.activity-list::-webkit-scrollbar-thumb{background:var(--line-strong);border-radius:3px}
.activity-item{
  display:flex;gap:12px;padding:12px 20px;align-items:flex-start;
  border-bottom:1px solid var(--line);transition:background .15s;
}
.activity-item:last-child{border-bottom:0}
.activity-item:hover{background:var(--surface-2)}
.activity-item .ico{
  width:32px;height:32px;border-radius:8px;flex-shrink:0;
  display:grid;place-items:center;
}
.activity-item .ico.fav{background:rgba(255,92,41,.12);color:var(--accent-2)}
.activity-item .ico.dl{background:rgba(212,255,62,.12);color:var(--accent)}
.activity-item .ico.comm{background:rgba(0,212,255,.12);color:#00d4ff}
.activity-item .ico.upload{background:rgba(165,148,247,.15);color:#a594f7}
.activity-item .ico svg{width:14px;height:14px}
.activity-item .body{flex:1;min-width:0}
.activity-item .body p{margin:0;font-size:13px;color:var(--ink);line-height:1.4}
.activity-item .body p b{color:var(--ink);font-weight:600}
.activity-item .body p a{color:var(--accent)}
.activity-item .body .time{
  display:block;margin-top:4px;
  font-family:"JetBrains Mono",monospace;font-size:9.5px;letter-spacing:.14em;
  color:var(--ink-dim);text-transform:uppercase;
}

/* Profile sidebar */
.profile-side{display:flex;flex-direction:column;gap:22px}
.side-card{
  background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);
  overflow:hidden;
}
.side-card .sh{
  padding:14px 18px;border-bottom:1px solid var(--line);
  font-family:"JetBrains Mono",monospace;font-size:11px;letter-spacing:.2em;text-transform:uppercase;
  color:var(--ink-soft);font-weight:600;
}
.side-card .sc-body{padding:16px 18px;font-size:13px;color:var(--ink-soft);line-height:1.6}
.side-card .sc-body p{margin:0 0 10px}
.side-card .sc-body p:last-child{margin:0}
.info-row{
  display:flex;gap:10px;padding:9px 18px;font-size:13px;
  border-bottom:1px solid var(--line);
  align-items:center;color:var(--ink-soft);
}
.info-row:last-child{border-bottom:0}
.info-row svg{width:13px;height:13px;color:var(--ink-dim);flex-shrink:0}
.info-row b{color:var(--ink);font-weight:500;margin-left:auto;font-family:"JetBrains Mono",monospace;font-size:11.5px;letter-spacing:.04em}

/* Badges grid */
.badges-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;padding:14px}
.badge-item{
  aspect-ratio:1;border-radius:10px;background:var(--bg-2);border:1px solid var(--line);
  display:grid;place-items:center;position:relative;
  transition:border-color .15s, background .15s;cursor:pointer;
}
.badge-item:hover{border-color:var(--line-strong);background:var(--surface-2)}
.badge-item svg{width:22px;height:22px;color:var(--ink-soft)}
.badge-item.unlocked svg{color:var(--accent)}
.badge-item.unlocked{border-color:rgba(212,255,62,.3);background:rgba(212,255,62,.04)}
.badge-item .tip{
  position:absolute;bottom:calc(100% + 6px);left:50%;transform:translateX(-50%);
  background:#0b0b0a;border:1px solid var(--line-strong);border-radius:6px;
  padding:4px 8px;font-size:10px;white-space:nowrap;
  font-family:"JetBrains Mono",monospace;letter-spacing:.1em;color:var(--ink);
  opacity:0;pointer-events:none;transition:opacity .15s;
  text-transform:uppercase;z-index:5;
}
.badge-item:hover .tip{opacity:1}

/* Favorites / Downloads / Comments / Uploads grid */
.p-cards{
  display:grid;grid-template-columns:repeat(3,1fr);gap:20px;
}
.p-cards .card{animation:rise .35s ease both}

.empty-state{
  padding:60px 20px;text-align:center;color:var(--ink-dim);
  background:var(--surface);border:1px dashed var(--line-strong);border-radius:var(--radius-lg);
}
.empty-state svg{width:44px;height:44px;margin:0 auto 14px;color:var(--ink-dim)}
.empty-state h3{font-family:"Fraunces",serif;font-weight:400;font-size:22px;margin:0 0 8px;color:var(--ink-soft)}
.empty-state p{margin:0;font-size:13px;max-width:360px;margin:0 auto}

/* Comments list */
.comment-list{display:flex;flex-direction:column;gap:14px}
.p-comment{
  background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);
  padding:16px 20px;display:flex;gap:14px;
}
.p-comment .on-res{flex-shrink:0;width:80px;height:60px;border-radius:8px;overflow:hidden;border:1px solid var(--line);position:relative}
.p-comment .on-res > div{position:absolute;inset:0}
.p-comment .ccontent{flex:1;min-width:0}
.p-comment .on{font-family:"JetBrains Mono",monospace;font-size:10.5px;letter-spacing:.14em;color:var(--ink-dim);text-transform:uppercase;margin-bottom:4px}
.p-comment .on a{color:var(--accent)}
.p-comment .ctxt{font-size:13.5px;color:var(--ink);line-height:1.5;margin:4px 0}
.p-comment .cfoot{font-family:"JetBrains Mono",monospace;font-size:10px;color:var(--ink-dim);letter-spacing:.14em;text-transform:uppercase}
.p-comment .cfoot .vote{color:var(--accent)}

/* Friends / Followers grid */
.friends-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.friend-card{
  background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);
  padding:16px;text-align:center;transition:border-color .15s, background .15s;
  cursor:pointer;
}
.friend-card:hover{border-color:var(--line-strong);background:var(--surface-2)}
.friend-card .fav{
  width:60px;height:60px;border-radius:50%;margin:0 auto 10px;
  display:grid;place-items:center;
  font-family:"Fraunces",serif;font-weight:600;font-style:italic;font-size:26px;
  color:#0b0b0a;border:2px solid rgba(0,0,0,.3);
}
.friend-card h5{font-family:"Fraunces",serif;font-weight:500;font-size:15px;margin:0 0 2px;letter-spacing:-0.01em}
.friend-card .frole{font-family:"JetBrains Mono",monospace;font-size:9.5px;letter-spacing:.14em;color:var(--ink-dim);text-transform:uppercase}
.friend-card .f-actions{
  margin-top:10px;display:flex;gap:6px;justify-content:center;align-items:center;
}
.friend-card .fbtn{
  padding:5px 12px;border-radius:999px;
  font-size:11.5px;border:1px solid var(--line-strong);color:var(--ink-soft);
  background:transparent;cursor:pointer;
  transition:background .15s, color .15s, border-color .15s;
  font-family:inherit;min-width:80px;
}
.friend-card .fbtn:hover{background:var(--surface-2);color:var(--ink);border-color:var(--ink-dim)}
.friend-card .fbtn.accent{background:var(--accent);color:#0b0b0a;border-color:var(--accent);font-weight:600}
.friend-card .fbtn.accent:hover{
  background:rgba(255,92,41,.12);color:var(--accent-2);border-color:var(--accent-2);
}
.friend-card .fbtn.accent:hover .label-following{display:none}
.friend-card .fbtn.accent .label-unfollow{display:none}
.friend-card .fbtn.accent:hover .label-unfollow{display:inline}

.friend-card .msg-btn{
  width:30px;height:30px;border-radius:50%;
  background:transparent;border:1px solid var(--line-strong);color:var(--ink-soft);
  display:grid;place-items:center;cursor:pointer;flex-shrink:0;
  transition:background .15s, color .15s, border-color .15s;
}
.friend-card .msg-btn:hover{background:var(--bg-2);color:var(--accent);border-color:var(--accent)}
.friend-card .msg-btn svg{width:13px;height:13px}

/* Settings panel */
.settings-group{
  background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);
  margin-bottom:20px;overflow:hidden;
}

.form-group .f-row h3 .helper-inline,
.form-group h3 .helper-inline{
  font-family:"Geist",sans-serif;font-size:11.5px;font-weight:400;
  color:var(--ink-dim);text-transform:none;letter-spacing:0;margin-left:8px;
}

/* Rich editor */
.editor-wrap{margin:0 20px 18px;border:1px solid var(--line);border-radius:8px;overflow:hidden;background:var(--bg-2)}
.editor-wrap:focus-within{border-color:var(--accent)}
.editor-toolbar{
  display:flex;gap:2px;align-items:center;padding:6px 8px;
  background:var(--surface);border-bottom:1px solid var(--line);flex-wrap:wrap;
}
.editor-toolbar button{
  width:30px;height:30px;border-radius:5px;
  background:transparent;border:0;color:var(--ink-soft);
  display:grid;place-items:center;cursor:pointer;font:inherit;font-size:13px;
  transition:background .12s, color .12s;padding:0;
}
.editor-toolbar button:hover{background:var(--bg-2);color:var(--ink)}
.editor-toolbar button.active{background:rgba(212,255,62,.14);color:var(--accent)}
.editor-toolbar button svg{width:14px;height:14px}
.editor-toolbar .divider{width:1px;height:18px;background:var(--line);margin:0 4px}
.editor-wrap > .editor{
  min-height:120px;padding:14px 16px;color:var(--ink);font-size:14px;line-height:1.6;
  outline:0;
}
.editor-wrap > .editor[data-placeholder]:empty::before{
  content:attr(data-placeholder);color:var(--ink-dim);pointer-events:none;
}
.editor-wrap > .editor h2{font-family:"Fraunces",serif;font-weight:500;font-size:22px;margin:16px 0 8px;letter-spacing:-0.01em}
.editor-wrap > .editor h3{font-family:"Fraunces",serif;font-weight:500;font-size:17px;margin:14px 0 6px;letter-spacing:-0.01em;color:var(--ink-soft)}
.editor-wrap > .editor pre{
  background:var(--bg-2);border:1px solid var(--line);border-radius:6px;
  padding:10px 14px;margin:10px 0;
  font-family:"JetBrains Mono",monospace;font-size:12.5px;line-height:1.5;
  color:var(--ink-soft);white-space:pre-wrap;
}
.editor-wrap > .editor hr{
  border:0;height:1px;background:var(--line-strong);margin:16px 0;
}
.editor-wrap > .editor blockquote{
  border-left:3px solid var(--accent);padding:4px 14px;margin:12px 0;
  color:var(--ink-soft);font-style:italic;background:rgba(212,255,62,.04);border-radius:0 6px 6px 0;
}
.editor-wrap > .editor ul, .editor-wrap > .editor ol{margin:8px 0 8px 22px}
.editor-wrap > .editor a{color:var(--accent);text-decoration:underline}
.editor-wrap > .editor img{max-width:100%;border-radius:8px;margin:10px 0;display:block}
.editor-wrap > .editor .video-embed{
  position:relative;background:#000;border-radius:8px;overflow:hidden;margin:10px 0;
}
.editor-wrap > .editor .video-embed video{width:100%;display:block}

/* Media block wrappers inside editor (for hover delete) */
.editor-wrap > .editor .media-block,
.editor-wrap > .editor .video-embed{position:relative}

/* Delete button overlay (injected by JS on hover) */
.editor-wrap > .editor .media-del-btn{
  position:absolute;top:8px;right:8px;
  width:30px;height:30px;border-radius:50%;
  background:rgba(0,0,0,.82);color:#fff;
  border:0;cursor:pointer;z-index:10;
  display:grid;place-items:center;
  opacity:0;transition:opacity .15s, background .15s;
  backdrop-filter:blur(4px);
}
.editor-wrap > .editor .media-block:hover .media-del-btn,
.editor-wrap > .editor .video-embed:hover .media-del-btn{opacity:1}
.editor-wrap > .editor .media-del-btn:hover{background:var(--accent-2);color:#fff}
.editor-wrap > .editor .media-del-btn svg{width:13px;height:13px}
.editor-foot{
  display:flex;justify-content:flex-end;padding:6px 12px;
  font-family:"JetBrains Mono",monospace;font-size:10.5px;color:var(--ink-dim);letter-spacing:.08em;
  border-top:1px solid var(--line);background:var(--surface);
}
.editor-foot.warn{color:var(--accent-2)}

/* Drop zones */
.drop-zone{
  margin:12px 20px 14px;padding:24px;
  border:2px dashed var(--line-strong);border-radius:10px;
  display:flex;align-items:center;gap:16px;
  background:var(--bg-2);cursor:pointer;
  transition:border-color .15s, background .15s;
}
.drop-zone:hover,
.drop-zone.drag-over{border-color:var(--accent);background:rgba(212,255,62,.04)}
.drop-zone.small{padding:18px}
.drop-zone svg{width:36px;height:36px;color:var(--ink-dim);flex-shrink:0}
.drop-zone > div{flex:1}
.drop-zone b{display:block;color:var(--ink);font-weight:500;font-size:14px;margin-bottom:3px}
.drop-zone span{font-size:12px;color:var(--ink-dim)}

/* Media gallery (simplified — upload only, insertion handled via editor toolbar) */
.media-gallery{
  display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:10px;
  padding:0 20px 6px;
}
.media-gallery:empty{display:none}
.media-item{
  position:relative;aspect-ratio:4/3;border-radius:8px;overflow:hidden;
  border:1px solid var(--line);background:var(--bg-2);
  transition:border-color .12s;
}
.media-item:hover{border-color:var(--accent)}
.media-item img{width:100%;height:100%;object-fit:cover;display:block;pointer-events:none}
.media-item .mi-del{
  position:absolute;top:6px;right:6px;
  width:26px;height:26px;border-radius:6px;
  background:rgba(0,0,0,.75);color:#fff;border:0;cursor:pointer;
  display:grid;place-items:center;backdrop-filter:blur(4px);
  transition:background .12s;
}
.media-item .mi-del:hover{background:var(--accent-2)}
.media-item .mi-del svg{width:12px;height:12px}
.media-item .mi-tag{
  position:absolute;bottom:6px;left:6px;padding:2px 7px;border-radius:4px;
  background:rgba(0,0,0,.7);color:var(--accent);
  font-family:"JetBrains Mono",monospace;font-size:9px;letter-spacing:.1em;font-weight:700;
  text-transform:uppercase;
}

.img-menu-btn{position:relative}
.img-menu-btn .mini-chev{width:8px !important;height:8px !important;margin-left:1px;opacity:.7}


/* ── Add News: Publishing options ── */
/* ---------- Publishing options ---------- */
.pub-options .pub-block{
  display:grid;grid-template-columns:140px 1fr;gap:20px;
  padding:16px 20px;margin:0 20px 10px;
  border:1px solid var(--line);border-radius:10px;background:var(--bg-2);
}
.pub-options .pub-block + .pub-block{margin-top:0}
.pub-label{
  font-family:"JetBrains Mono",monospace;font-size:10.5px;letter-spacing:.14em;
  color:var(--ink-soft);font-weight:600;text-transform:uppercase;
  padding-top:8px;
}
.pub-date-row{
  display:flex;gap:16px;align-items:center;flex-wrap:wrap;
}
.pub-date-row .inp{max-width:220px}
.pub-date-row .checkbox-row.compact{margin:0}

.pub-opts{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));
  gap:12px;
}
.pub-opt{
  display:flex;gap:10px;align-items:flex-start;
  padding:12px 14px;border-radius:8px;background:var(--bg);
  border:1px solid var(--line);cursor:pointer;
  transition:background .12s, border-color .12s;
  position:relative;
}
.pub-opt:hover{background:var(--surface);border-color:var(--line-strong)}
.pub-opt input[type="checkbox"]{position:absolute;opacity:0;pointer-events:none;width:0;height:0}
.pub-opt .checkbox-box{
  width:18px;height:18px;border:1.5px solid var(--line-strong);border-radius:4px;
  display:grid;place-items:center;transition:background .12s, border-color .12s;
  flex-shrink:0;margin-top:1px;
}
.pub-opt .checkbox-box svg{width:11px;height:11px;color:#0b0b0a;opacity:0;transition:opacity .1s}
.pub-opt input:checked + .checkbox-box{background:var(--accent);border-color:var(--accent)}
.pub-opt input:checked + .checkbox-box svg{opacity:1}
.pub-opt-text{display:flex;flex-direction:column;gap:2px;min-width:0;line-height:1.3;flex:1}
.pub-opt-text b{
  font-size:13px;font-weight:500;color:var(--ink);
  display:inline-flex;align-items:center;gap:6px;
}
.pub-opt-desc{
  font-size:11.5px;color:var(--ink-dim);
}
.pub-opt input:checked ~ .pub-opt-text b{color:var(--accent)}
.pub-opt .chief-only{
  font-family:"JetBrains Mono",monospace;font-size:9px;letter-spacing:.12em;
  padding:1px 6px;border-radius:4px;text-transform:uppercase;font-weight:700;
  background:rgba(165,148,247,.15);color:#a594f7;border:1px solid rgba(165,148,247,.35);
}
.pub-opt.chief-opt{
  border-color:rgba(196,110,255,.2);background:rgba(196,110,255,.04);
}
.pub-opt.chief-opt:hover{border-color:rgba(196,110,255,.4);background:rgba(196,110,255,.08)}

@media (max-width:720px){
  .pub-options .pub-block{grid-template-columns:1fr;gap:10px;padding:14px 16px;margin:0 14px 10px}
  .pub-label{padding-top:0}
  .pub-opts{grid-template-columns:1fr}
}


/* ── Add News: Download links editor ── */
/* ---------- Download links editor ---------- */
.dl-editor{margin:0 20px}
.dl-textarea{
  font-family:"JetBrains Mono",monospace;font-size:12.5px;line-height:1.55;
  resize:vertical;min-height:140px;
  tab-size:2;
}
.dl-actions{
  display:flex;gap:8px;margin-top:8px;flex-wrap:wrap;
}
.dl-actions .btn{display:inline-flex;align-items:center;gap:6px;padding:7px 12px;font-size:12px}

.dl-preview{
  margin:14px 20px 0;padding:14px;
  border:1px solid var(--line);border-radius:10px;background:var(--bg-2);
}
.dl-preview-head{
  display:flex;justify-content:space-between;align-items:center;
  padding-bottom:10px;margin-bottom:10px;border-bottom:1px solid var(--line);
}
.dl-preview-head span{
  font-family:"JetBrains Mono",monospace;font-size:11px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--ink-soft);font-weight:600;
}
.dl-preview-head span b{color:var(--accent);font-weight:700}

.dl-list{display:flex;flex-direction:column;gap:8px}
.dl-item{
  display:grid;grid-template-columns:auto 1fr auto auto;gap:12px;align-items:center;
  padding:10px 12px;border-radius:8px;background:var(--bg);
  border:1px solid var(--line);
}
.dl-item .dl-num{
  font-family:"Fraunces",serif;font-weight:500;font-size:18px;font-style:italic;
  color:var(--accent);width:28px;text-align:center;flex-shrink:0;
}
.dl-item .dl-info{min-width:0;overflow:hidden}
.dl-item .dl-label{
  font-size:13px;color:var(--ink);font-weight:500;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.dl-item .dl-url{
  font-family:"JetBrains Mono",monospace;font-size:10.5px;color:var(--ink-dim);letter-spacing:.04em;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  display:block;margin-top:2px;
}
.dl-item .dl-size{
  font-family:"JetBrains Mono",monospace;font-size:11px;color:var(--accent);font-weight:700;
  background:rgba(212,255,62,.1);padding:3px 8px;border-radius:5px;
  border:1px solid rgba(212,255,62,.25);
  white-space:nowrap;
}
.dl-item .dl-del{
  width:26px;height:26px;border-radius:6px;padding:0;
  background:transparent;border:1px solid var(--line);color:var(--ink-dim);
  cursor:pointer;display:grid;place-items:center;transition:all .12s;
}
.dl-item .dl-del:hover{border-color:var(--accent-2);color:var(--accent-2);background:rgba(255,92,41,.06)}
.dl-item .dl-del svg{width:12px;height:12px}

@media (max-width:600px){
  .dl-item{grid-template-columns:auto 1fr auto;gap:8px}
  .dl-item .dl-del{grid-column:1/-1;justify-self:end;margin-top:4px}
}
.toast-stack{
  position:fixed;top:80px;right:20px;z-index:10000;
  display:flex;flex-direction:column;gap:10px;
  pointer-events:none;
}
.toast{
  min-width:280px;max-width:420px;
  padding:14px 18px;padding-right:14px;
  background:var(--surface);
  border:1px solid var(--line-strong);border-left:3px solid var(--accent);

/* ── Profile: My Drafts ── */
/* ---------- MY DRAFTS ---------- */
.drafts-list{display:flex;flex-direction:column;gap:12px}
.draft-item{
  display:grid;grid-template-columns:90px 1fr auto;gap:18px;align-items:center;
  background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);
  padding:14px 18px;transition:border-color .15s, background .15s;
}
.draft-item:hover{border-color:var(--line-strong);background:var(--surface-2)}
.draft-thumb{
  width:90px;height:65px;border-radius:8px;
}
.draft-body{min-width:0}
.draft-cat{
  font-family:"JetBrains Mono",monospace;font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;
  color:var(--ink-dim);margin-bottom:4px;
}
.draft-cat span{color:var(--accent)}
.draft-body h3{
  font-family:"Fraunces",serif;font-weight:500;font-size:17px;letter-spacing:-0.01em;
  margin:0 0 8px;line-height:1.25;color:var(--ink);
}
.draft-meta{
  display:flex;align-items:center;gap:8px;flex-wrap:wrap;
  font-size:12px;color:var(--ink-dim);
}
.draft-meta b{color:var(--ink-soft);font-weight:500}
.draft-meta .sep{color:var(--line-strong)}
.draft-status{
  display:inline-flex;align-items:center;gap:5px;
  padding:3px 9px;border-radius:5px;
  font-family:"JetBrains Mono",monospace;font-size:9.5px;letter-spacing:.14em;text-transform:uppercase;font-weight:700;
}
.draft-status::before{content:"";width:5px;height:5px;border-radius:50%;background:currentColor}
.draft-status.status-draft{background:rgba(185,178,161,.12);color:#b9b2a1;border:1px solid rgba(185,178,161,.3)}
.draft-status.status-pending{background:rgba(255,190,85,.12);color:#ffbe55;border:1px solid rgba(255,190,85,.3)}

.draft-actions{display:flex;gap:8px;flex-shrink:0}
.draft-actions .btn{padding:8px 14px;display:inline-flex;align-items:center;gap:6px}
.draft-del{padding:8px !important;color:var(--ink-dim)}
.draft-del:hover{color:var(--accent-2) !important;border-color:var(--accent-2);background:rgba(255,92,41,.06)}


/* ── Profile: My Stats ── */
/* ---------- MY STATS ---------- */
.stats-grid{
  display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:24px;
}
.stats-grid .stat-card .big em{color:var(--accent);font-style:italic;font-weight:300}

.stats-chart{
  background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);
  padding:20px;margin-bottom:24px;
}
.stats-chart-head{
  display:flex;justify-content:space-between;align-items:center;margin-bottom:16px;
}
.stats-chart-head h4{
  font-family:"JetBrains Mono",monospace;font-size:11px;letter-spacing:.2em;text-transform:uppercase;
  color:var(--ink-soft);margin:0;font-weight:600;
}
.chart-legend{display:flex;gap:14px;font-size:11px;color:var(--ink-dim);font-family:"JetBrains Mono",monospace;letter-spacing:.1em;text-transform:uppercase}
.chart-legend span{display:inline-flex;align-items:center;gap:6px}
.chart-legend i{width:9px;height:9px;border-radius:50%;background:var(--accent);display:inline-block}
.chart-legend i.dot-2{background:#00d4ff;opacity:.6}
.chart-body{position:relative}
.chart-axis{
  display:flex;justify-content:space-between;margin-top:6px;
  font-family:"JetBrains Mono",monospace;font-size:9.5px;color:var(--ink-dim);letter-spacing:.1em;
}

.stats-split{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.stats-table{
  background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);
  overflow:hidden;
}
.stats-table-head{
  display:flex;justify-content:space-between;align-items:center;
  padding:14px 18px;border-bottom:1px solid var(--line);background:var(--bg-2);
}
.stats-table-head h4{
  font-family:"JetBrains Mono",monospace;font-size:11px;letter-spacing:.2em;text-transform:uppercase;
  color:var(--ink-soft);margin:0;font-weight:600;
}
.stats-table-head span{
  font-family:"JetBrains Mono",monospace;font-size:10px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--ink-dim);
}

.stats-row{
  display:grid;grid-template-columns:32px 50px 1fr auto;gap:14px;align-items:center;
  padding:11px 18px;border-bottom:1px solid var(--line);transition:background .15s;
}
.stats-row:last-child{border-bottom:0}
.stats-row:hover{background:var(--surface-2)}
.stats-rank{
  font-family:"Fraunces",serif;font-weight:500;font-size:20px;font-style:italic;
  color:var(--ink-dim);text-align:center;
}
.stats-thumb{
  width:50px;height:36px;border-radius:6px;
}
.stats-info{min-width:0}
.stats-info b{display:block;font-size:13px;color:var(--ink);font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.stats-info span{font-family:"JetBrains Mono",monospace;font-size:10px;letter-spacing:.1em;color:var(--ink-dim);text-transform:uppercase}
.stats-num{
  font-family:"JetBrains Mono",monospace;font-size:13px;font-weight:700;color:var(--accent);
}
.stats-num span{font-size:10px;color:var(--ink-dim);font-weight:500;margin-left:3px}

.cat-bar{padding:11px 18px;border-bottom:1px solid var(--line)}
.cat-bar:last-child{border-bottom:0}
.cat-bar-head{
  display:flex;justify-content:space-between;align-items:center;margin-bottom:6px;
  font-size:12.5px;color:var(--ink-soft);
}
.cat-bar-head b{color:var(--accent);font-weight:700;font-family:"JetBrains Mono",monospace;font-size:11.5px}
.cat-bar-track{
  height:5px;border-radius:3px;background:var(--bg-2);overflow:hidden;
}
.cat-bar-fill{
  height:100%;background:linear-gradient(90deg, var(--accent), #a8e018);
  border-radius:3px;transition:width .4s ease;
}

@media (max-width:960px){
  .stats-grid{grid-template-columns:repeat(2,1fr)}
  .stats-split{grid-template-columns:1fr}
}
@media (max-width:700px){
  .stats-grid{grid-template-columns:1fr}
  .draft-item{grid-template-columns:60px 1fr;gap:12px}
  .draft-thumb{width:60px;height:45px}
  .draft-actions{grid-column:1/-1;justify-content:flex-end}
}


/* ── Profile: Notifications full page list ── */
/* ---------- NOTIFICATIONS FULL PAGE LIST ---------- */
.notif-full-list{
  background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);
  overflow:hidden;
}
.notif-full-item{
  display:flex;gap:14px;padding:16px 20px;
  border-bottom:1px solid var(--line);
  transition:background .15s;position:relative;cursor:pointer;
}
.notif-full-item:last-child{border-bottom:0}
.notif-full-item:hover{background:var(--surface-2)}
.notif-full-item.unread::before{
  content:"";position:absolute;left:0;top:0;bottom:0;width:3px;
  background:var(--accent);
}
.notif-full-item .nf-ico{
  width:40px;height:40px;border-radius:10px;flex-shrink:0;
  display:grid;place-items:center;
}
.notif-full-item .nf-ico svg{width:18px;height:18px}
.notif-full-item .nf-ico.drop{background:rgba(212,255,62,.12);color:var(--accent)}
.notif-full-item .nf-ico.promo{background:rgba(255,92,41,.12);color:var(--accent-2)}
.notif-full-item .nf-ico.system{background:rgba(165,148,247,.12);color:#a594f7}
.notif-full-item .nf-ico.social{background:rgba(0,212,255,.12);color:#00d4ff}
.notif-full-item .nf-ico.recap{background:rgba(185,178,161,.12);color:#b9b2a1}
.notif-full-item .nf-body{flex:1;min-width:0}
.notif-full-item .nf-body p{
  margin:0;font-size:14px;line-height:1.5;color:var(--ink);
}
.notif-full-item .nf-body p b{color:var(--ink);font-weight:600}
.notif-full-item .nf-body p a,
.notif-full-item .nf-body p .link{
  color:var(--accent);cursor:pointer;text-decoration:none;
}
.notif-full-item .nf-body p a:hover,
.notif-full-item .nf-body p .link:hover{text-decoration:underline}
.notif-full-item .nf-time{
  display:block;margin-top:6px;
  font-family:"JetBrains Mono",monospace;font-size:10px;letter-spacing:.14em;
  color:var(--ink-dim);text-transform:uppercase;
}
.notif-full-item .nf-unread-dot{
  width:8px;height:8px;border-radius:50%;background:var(--accent);
  flex-shrink:0;margin-top:16px;
}
.notif-full-item:not(.unread) .nf-unread-dot{visibility:hidden}
.dialogs-wrap{
  max-width:100%;margin:0;padding:0;
  height:calc(100vh - 380px);min-height:540px;
  display:grid;grid-template-columns:340px 1fr;gap:20px;
}

/* When Dialogs tab is active, hide profile-side and use full width */
.profile-body.panel-dialogs{grid-template-columns:1fr}
.profile-body.panel-dialogs > .profile-side{display:none}

/* Left column: conversation list */
.dialog-list{
  background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);
  display:flex;flex-direction:column;overflow:hidden;
}
.dialog-list-head{
  padding:18px 20px 14px;border-bottom:1px solid var(--line);
  display:flex;align-items:center;justify-content:space-between;gap:10px;
}
.dialog-list-head h2{
  font-family:"Fraunces",serif;font-weight:500;font-size:22px;letter-spacing:-0.01em;
  margin:0;
}
.dialog-list-head h2 em{font-style:italic;color:var(--accent);font-weight:400}
.dialog-list-head .new-chat{
  width:32px;height:32px;border-radius:50%;
  background:var(--accent);color:#0b0b0a;
  display:grid;place-items:center;border:0;cursor:pointer;
  transition:background .15s;
}
.dialog-list-head .new-chat:hover{background:#c3f029}
.dialog-list-head .new-chat svg{width:15px;height:15px}

.dialog-search{
  padding:10px 16px;border-bottom:1px solid var(--line);
}
.dialog-search-inner{
  display:flex;align-items:center;gap:8px;
  padding:8px 12px;border-radius:999px;
  background:var(--bg-2);border:1px solid var(--line);
  transition:border-color .15s, background .15s;
}
.dialog-search-inner:focus-within{border-color:var(--accent);background:var(--surface-2)}
.dialog-search-inner svg{width:14px;height:14px;color:var(--ink-dim);flex-shrink:0}
.dialog-search-inner input{
  flex:1;background:transparent;border:0;outline:0;color:var(--ink);font:inherit;font-size:13px;
}
.dialog-search-inner input::placeholder{color:var(--ink-dim)}

.dialog-filters{
  display:flex;gap:6px;padding:10px 16px;border-bottom:1px solid var(--line);
  overflow-x:auto;scrollbar-width:none;
}
.dialog-filters::-webkit-scrollbar{display:none}
.dialog-filter{
  flex-shrink:0;padding:5px 11px;border-radius:999px;
  font-family:"JetBrains Mono",monospace;font-size:10px;letter-spacing:.14em;text-transform:uppercase;font-weight:600;
  background:var(--bg-2);border:1px solid var(--line);color:var(--ink-soft);
  cursor:pointer;transition:background .15s, color .15s, border-color .15s;
}
.dialog-filter:hover{color:var(--ink);border-color:var(--line-strong)}
.dialog-filter.active{background:var(--accent);color:#0b0b0a;border-color:var(--accent)}

.dialog-items{
  flex:1;overflow-y:auto;padding:6px 0;
}
.dialog-items::-webkit-scrollbar{width:6px}
.dialog-items::-webkit-scrollbar-thumb{background:var(--line-strong);border-radius:3px}

.dialog-item{
  display:flex;gap:12px;padding:12px 16px;cursor:pointer;position:relative;
  transition:background .15s;align-items:flex-start;
}
.dialog-item:hover{background:var(--surface-2)}
.dialog-item.active{background:var(--surface-2)}
.dialog-item.active::before{
  content:"";position:absolute;left:0;top:10px;bottom:10px;width:3px;
  background:var(--accent);border-radius:0 3px 3px 0;
}
.dialog-item .d-av{
  width:44px;height:44px;border-radius:50%;flex-shrink:0;
  display:grid;place-items:center;position:relative;
  font-family:"Fraunces",serif;font-weight:600;font-style:italic;font-size:18px;
  color:#0b0b0a;border:2px solid rgba(0,0,0,.3);
}
.dialog-item .d-av.role-member{background:linear-gradient(135deg,#b9b2a1,#7a7466)}
.dialog-item .d-av.role-editor{background:linear-gradient(135deg,#00d4ff,#0099cc)}
.dialog-item .d-av.role-chief{background:linear-gradient(135deg,#a594f7,#6c5ce7)}
.dialog-item .d-av.role-admin{background:linear-gradient(135deg,#d4ff3e,#a8e018)}
.online-dot{
  position:absolute;bottom:0;right:0;width:12px;height:12px;border-radius:50%;
  background:#7a7466;border:2px solid var(--surface);
}
.online-dot.on{background:var(--accent)}
.dialog-item.active .online-dot{border-color:var(--surface-2)}

.dialog-item .d-body{flex:1;min-width:0}
.dialog-item .d-top{display:flex;justify-content:space-between;align-items:center;gap:8px}
.dialog-item .d-name{
  font-size:14px;font-weight:600;color:var(--ink);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:160px;
}
.dialog-item .d-time{
  font-family:"JetBrains Mono",monospace;font-size:10px;letter-spacing:.02em;
  color:var(--ink-dim);flex-shrink:0;white-space:nowrap;
}
.dialog-item.unread .d-time{color:var(--accent);font-weight:700}
.dialog-item .d-preview{
  display:flex;justify-content:space-between;align-items:center;gap:8px;margin-top:3px;
}
.dialog-item .d-msg{
  font-size:12.5px;color:var(--ink-dim);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:200px;
}
.dialog-item.unread .d-msg{color:var(--ink-soft)}
.dialog-item .d-badge{
  flex-shrink:0;min-width:18px;height:18px;padding:0 6px;border-radius:999px;
  background:var(--accent);color:#0b0b0a;
  font-family:"JetBrains Mono",monospace;font-size:10px;font-weight:700;
  display:grid;place-items:center;
}
.dialog-item .d-ticks{
  font-family:"JetBrains Mono",monospace;font-size:12px;color:var(--ink-dim);flex-shrink:0;
}
.dialog-item .d-ticks.read{color:#00d4ff}

/* Right column: chat area */
.chat-panel{
  background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);
  display:flex;flex-direction:column;overflow:hidden;
  position:relative;
}
.chat-head{
  padding:14px 20px;border-bottom:1px solid var(--line);
  display:flex;align-items:center;gap:14px;
  background:linear-gradient(180deg,rgba(212,255,62,.02),transparent);
}
.chat-head .c-av{
  width:44px;height:44px;border-radius:50%;flex-shrink:0;
  display:grid;place-items:center;position:relative;
  font-family:"Fraunces",serif;font-weight:600;font-style:italic;font-size:18px;
  color:#0b0b0a;border:2px solid rgba(0,0,0,.3);
}
.chat-head .c-av.role-editor{background:linear-gradient(135deg,#00d4ff,#0099cc)}
.chat-head .c-av.role-chief{background:linear-gradient(135deg,#a594f7,#6c5ce7)}
.chat-head .c-av.role-member{background:linear-gradient(135deg,#b9b2a1,#7a7466)}
.chat-head .c-av.role-admin{background:linear-gradient(135deg,#d4ff3e,#a8e018)}
.chat-head .c-info{flex:1;min-width:0}
.chat-head .c-name{
  font-family:"Fraunces",serif;font-size:18px;font-weight:500;letter-spacing:-0.01em;margin:0;
  display:flex;align-items:center;gap:8px;
}
.chat-head .c-status{
  font-family:"JetBrains Mono",monospace;font-size:10.5px;letter-spacing:.14em;
  color:var(--ink-dim);text-transform:uppercase;margin-top:3px;
}
.chat-head .c-status.on{color:var(--accent)}
.chat-head .c-actions{display:flex;gap:6px}
.chat-head .c-btn{
  width:36px;height:36px;border-radius:10px;
  background:transparent;border:1px solid var(--line);color:var(--ink-soft);
  display:grid;place-items:center;cursor:pointer;
  transition:background .15s, border-color .15s, color .15s;
}
.chat-head .c-btn:hover{background:var(--bg-2);color:var(--ink);border-color:var(--line-strong)}
.chat-head .c-btn.soon{opacity:.5;cursor:not-allowed;position:relative}
.chat-head .c-btn.soon:hover{background:transparent;border-color:var(--line)}
.chat-head .c-btn.soon:hover::after{
  content:"Soon";position:absolute;bottom:calc(100% + 6px);left:50%;transform:translateX(-50%);
  font-family:"JetBrains Mono",monospace;font-size:9px;letter-spacing:.14em;text-transform:uppercase;
  padding:3px 7px;background:#0b0b0a;border:1px solid var(--line-strong);border-radius:5px;color:var(--accent);
  white-space:nowrap;
}
.chat-head .c-btn svg{width:15px;height:15px}

/* Messages scroll area */
.chat-body{
  flex:1;overflow-y:auto;padding:22px 20px;
  background:
    radial-gradient(circle at 15% 15%, rgba(212,255,62,.03), transparent 50%),
    radial-gradient(circle at 85% 85%, rgba(255,92,41,.02), transparent 50%),
    var(--bg);
  display:flex;flex-direction:column;gap:4px;
}
.chat-body::-webkit-scrollbar{width:6px}
.chat-body::-webkit-scrollbar-thumb{background:var(--line-strong);border-radius:3px}

.chat-day{
  text-align:center;margin:14px 0 10px;
  font-family:"JetBrains Mono",monospace;font-size:10px;letter-spacing:.18em;text-transform:uppercase;
  color:var(--ink-dim);position:relative;
}
.chat-day::before,.chat-day::after{
  content:"";position:absolute;top:50%;width:calc(50% - 60px);height:1px;background:var(--line);
}
.chat-day::before{left:0}.chat-day::after{right:0}

.msg{
  display:flex;gap:8px;margin-bottom:2px;max-width:78%;
  animation:msg-rise .25s ease both;
}
@keyframes msg-rise{
  from{opacity:0;transform:translateY(6px)}
  to{opacity:1;transform:translateY(0)}
}
.msg.out{align-self:flex-end;flex-direction:row-reverse}
.msg .m-av{
  width:30px;height:30px;border-radius:50%;flex-shrink:0;
  display:grid;place-items:center;
  font-family:"Fraunces",serif;font-weight:600;font-style:italic;font-size:13px;
  color:#0b0b0a;border:1px solid rgba(0,0,0,.3);align-self:flex-end;
  opacity:0;transition:opacity .15s;
}
.msg.show-av .m-av{opacity:1}
.msg .m-av.role-editor{background:linear-gradient(135deg,#00d4ff,#0099cc)}
.msg .m-av.role-chief{background:linear-gradient(135deg,#a594f7,#6c5ce7)}
.msg .m-av.role-member{background:linear-gradient(135deg,#b9b2a1,#7a7466)}
.msg .m-av.role-admin{background:linear-gradient(135deg,#d4ff3e,#a8e018)}

.m-bubble{
  background:var(--surface-2);border:1px solid var(--line);
  padding:9px 14px;border-radius:16px 16px 16px 6px;
  font-size:13.5px;line-height:1.45;color:var(--ink);
  position:relative;
}
.msg.out .m-bubble{
  background:var(--accent);color:#0b0b0a;border-color:var(--accent);
  border-radius:16px 16px 6px 16px;
}
.m-bubble a{color:inherit;text-decoration:underline}
.msg.out .m-bubble a{font-weight:600}

.msg.same .m-bubble{border-radius:16px}
.msg.out.same .m-bubble{border-radius:16px}

.m-meta{
  display:flex;align-items:center;gap:5px;margin-top:4px;
  font-family:"JetBrains Mono",monospace;font-size:9.5px;color:var(--ink-dim);letter-spacing:.06em;
}
.msg.out .m-meta{justify-content:flex-end}
.m-meta .ticks{font-weight:700}
.m-meta .ticks.read{color:#00d4ff}

/* Reply preview in bubble */
.m-reply{
  margin-bottom:5px;padding:6px 9px;border-left:2px solid var(--accent);
  background:rgba(212,255,62,.06);border-radius:4px;font-size:12px;
}
.msg.out .m-reply{background:rgba(0,0,0,.1);border-left-color:#0b0b0a}
.m-reply .r-name{font-weight:700;font-size:10.5px;display:block;opacity:.85}
.m-reply .r-text{opacity:.75;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:block}

/* Message actions on hover */
.m-wrap{position:relative;display:flex;flex-direction:column}
.m-actions{
  position:absolute;top:-8px;display:flex;gap:2px;
  background:var(--surface);border:1px solid var(--line-strong);border-radius:8px;
  padding:3px;
  opacity:0;pointer-events:none;transition:opacity .15s;
  z-index:5;
  box-shadow:0 4px 12px -2px rgba(0,0,0,.5);
}
.msg:hover .m-actions{opacity:1;pointer-events:auto}
.msg.in .m-actions{right:-70px}
.msg.out .m-actions{left:-70px}
.m-actions button{
  width:26px;height:26px;border-radius:5px;
  background:transparent;border:0;color:var(--ink-soft);
  display:grid;place-items:center;cursor:pointer;
  transition:background .15s, color .15s;
}
.m-actions button:hover{background:var(--bg-2);color:var(--accent)}
.m-actions button.danger:hover{color:var(--accent-2)}
.m-actions svg{width:13px;height:13px}

/* Typing indicator */
.typing{
  display:flex;align-items:center;gap:8px;padding:0 0 6px 38px;
  font-family:"JetBrains Mono",monospace;font-size:10px;letter-spacing:.14em;color:var(--ink-dim);text-transform:uppercase;
  animation:msg-rise .2s ease both;
}
.typing .dots{display:inline-flex;gap:3px}
.typing .dots span{
  width:5px;height:5px;border-radius:50%;background:var(--ink-dim);
  animation:typing-pulse 1s infinite;
}
.typing .dots span:nth-child(2){animation-delay:.15s}
.typing .dots span:nth-child(3){animation-delay:.3s}
@keyframes typing-pulse{0%,60%,100%{opacity:.3}30%{opacity:1}}

/* Reply preview above composer */
.reply-preview{
  margin:0 14px 0 14px;padding:10px 14px;
  background:var(--bg-2);border:1px solid var(--line);border-left:3px solid var(--accent);border-radius:8px;
  display:none;align-items:center;gap:10px;
  animation:msg-rise .2s ease both;
}
.reply-preview.on{display:flex}
.reply-preview .rp-content{flex:1;min-width:0}
.reply-preview .rp-name{font-size:11px;color:var(--accent);font-weight:700;margin-bottom:2px}
.reply-preview .rp-text{font-size:12.5px;color:var(--ink-soft);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.reply-preview .rp-close{
  width:24px;height:24px;border-radius:6px;
  background:transparent;border:0;color:var(--ink-dim);cursor:pointer;
  display:grid;place-items:center;transition:background .15s, color .15s;
}
.reply-preview .rp-close:hover{background:var(--surface-2);color:var(--accent-2)}
.reply-preview .rp-close svg{width:13px;height:13px}

/* Composer */
.composer{
  padding:12px 16px 16px;border-top:1px solid var(--line);
  background:var(--surface);
}
.composer-box{
  display:flex;align-items:flex-end;gap:8px;
  background:var(--bg-2);border:1px solid var(--line);border-radius:22px;
  padding:6px 6px 6px 10px;
  transition:border-color .15s;
}
.composer-box:focus-within{border-color:var(--accent)}
.composer-box .c-tool{
  width:34px;height:34px;border-radius:50%;
  background:transparent;border:0;color:var(--ink-dim);
  display:grid;place-items:center;cursor:pointer;flex-shrink:0;
  transition:background .15s, color .15s;
}
.composer-box .c-tool:hover{background:var(--surface-2);color:var(--ink)}
.composer-box .c-tool svg{width:17px;height:17px}
.composer-box .c-input{
  flex:1;min-height:34px;max-height:160px;
  background:transparent;border:0;outline:0;resize:none;
  color:var(--ink);font:inherit;font-size:14px;line-height:1.45;
  padding:7px 4px;
  font-family:"Geist",sans-serif;
}
.composer-box .c-input::placeholder{color:var(--ink-dim)}
.c-send{
  width:36px;height:36px;border-radius:50%;
  background:var(--accent);color:#0b0b0a;border:0;cursor:pointer;
  display:grid;place-items:center;flex-shrink:0;
  transition:background .15s, transform .1s;
}
.c-send:hover{background:#c3f029}
.c-send:active{transform:scale(.93)}
.c-send:disabled{background:var(--line);color:var(--ink-dim);cursor:default}
.c-send svg{width:15px;height:15px}

/* Emoji picker */
.emoji-picker{
  position:absolute;bottom:70px;left:16px;z-index:10;
  background:var(--surface);border:1px solid var(--line-strong);border-radius:12px;
  box-shadow:0 16px 40px -10px rgba(0,0,0,.7);
  width:280px;
  opacity:0;transform:translateY(10px) scale(.96);pointer-events:none;
  transition:opacity .15s, transform .15s;
}
.emoji-picker.open{opacity:1;transform:translateY(0) scale(1);pointer-events:auto}
.emoji-head{
  padding:10px 14px;border-bottom:1px solid var(--line);
  font-family:"JetBrains Mono",monospace;font-size:10px;letter-spacing:.2em;text-transform:uppercase;
  color:var(--ink-dim);font-weight:600;
}
.emoji-grid{
  display:grid;grid-template-columns:repeat(8,1fr);gap:2px;padding:10px;
  max-height:220px;overflow-y:auto;
}
.emoji-grid::-webkit-scrollbar{width:5px}
.emoji-grid::-webkit-scrollbar-thumb{background:var(--line-strong);border-radius:3px}
.emoji-grid button{
  aspect-ratio:1;border-radius:6px;background:transparent;border:0;cursor:pointer;
  font-size:18px;display:grid;place-items:center;
  transition:background .15s, transform .1s;
}
.emoji-grid button:hover{background:var(--bg-2);transform:scale(1.15)}

/* Empty chat state */
.chat-empty{
  flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;
  padding:40px;text-align:center;color:var(--ink-dim);
}
.chat-empty .ico{
  width:72px;height:72px;border-radius:50%;
  background:var(--bg-2);border:1px solid var(--line);
  display:grid;place-items:center;margin-bottom:16px;
}
.chat-empty .ico svg{width:30px;height:30px;color:var(--ink-dim)}
.chat-empty h3{
  font-family:"Fraunces",serif;font-weight:400;font-size:26px;letter-spacing:-0.02em;
  margin:0 0 8px;color:var(--ink-soft);
}
.chat-empty p{margin:0;font-size:13.5px;max-width:340px;line-height:1.5}

/* Responsive */
@media (max-width:960px){
  .dialogs-wrap{grid-template-columns:1fr;height:auto}
  .dialog-list{max-height:50vh}
  .chat-panel{min-height:60vh}
}

/* entry animation */
@keyframes rise{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}
.card{animation:rise .5s ease both}
.card:nth-child(1){animation-delay:.02s}
.card:nth-child(2){animation-delay:.06s}
.card:nth-child(3){animation-delay:.10s}
.card:nth-child(4){animation-delay:.14s}
.card:nth-child(5){animation-delay:.18s}
.card:nth-child(6){animation-delay:.22s}
.card:nth-child(7){animation-delay:.26s}
.card:nth-child(8){animation-delay:.30s}
.card:nth-child(9){animation-delay:.34s}