html, body { height: 100%; }
.zc-body { margin: 0; font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Inter,Arial,sans-serif; background: #0b0b12; color: #fff; }

.zc-auth { min-height: 100vh; display:flex; align-items:center; justify-content:center; padding: 24px; }
.zc-card { width: 100%; max-width: 420px; background: rgba(255,255,255,0.05); border: 1px solid rgba(255,255,255,0.10); border-radius: 18px; padding: 22px; box-shadow: 0 18px 60px rgba(0,0,0,0.45); }
.zc-card-wide { max-width: 920px; }
.zc-card-header { display:flex; flex-direction:column; gap:6px; margin-bottom: 14px; }
.zc-brand { font-size: 12px; letter-spacing: .12em; text-transform: uppercase; color: rgba(255,255,255,0.65); }
.zc-title { font-size: 22px; font-weight: 700; }

.zc-alert { border-radius: 12px; padding: 10px 12px; font-size: 13px; margin-bottom: 10px; }
.zc-alert-error { background: rgba(244,63,94,0.10); border: 1px solid rgba(244,63,94,0.25); color: #fecdd3; }
.zc-alert-ok { background: rgba(16,185,129,0.10); border: 1px solid rgba(16,185,129,0.25); color: #d1fae5; }

.zc-form { display:flex; flex-direction:column; gap: 10px; }
.zc-form-inline { flex-direction: row; align-items: center; gap: 10px; }
.zc-form-wide { max-width: 520px; }
.zc-label { font-size: 12px; font-weight: 600; color: rgba(255,255,255,0.75); }
.zc-input, .zc-textarea { width: 100%; border-radius: 12px; border: 1px solid rgba(255,255,255,0.10); background: rgba(255,255,255,0.05); color: #fff; padding: 10px 12px; outline: none; }
.zc-input:focus, .zc-textarea:focus { border-color: rgba(255,255,255,0.22); box-shadow: 0 0 0 3px rgba(255,255,255,0.06); }
.zc-textarea { resize: none; min-height: 44px; }
.zc-grid { display:grid; grid-template-columns: 1fr 1fr; gap: 10px; }
@media (max-width: 640px){ .zc-grid { grid-template-columns: 1fr; } }

.zc-btn { border: 1px solid rgba(255,255,255,0.18); background: rgba(255,255,255,0.08); color: #fff; border-radius: 12px; padding: 10px 12px; cursor: pointer; font-weight: 600; }
.zc-btn:hover { background: rgba(255,255,255,0.12); }
.zc-btn-primary { background: #fff; border-color: #fff; color: #000; }
.zc-btn-primary:hover { background: rgba(255,255,255,0.92); }
.zc-link { color: rgba(255,255,255,0.9); text-decoration: none; font-weight: 600; }
.zc-muted { margin-top: 12px; font-size: 13px; color: rgba(255,255,255,0.65); }

.zc-shell { display:flex; height: 100vh; }
.zc-sidebar { width: 320px; border-right: 1px solid rgba(255,255,255,0.10); background: #0b0b12; display:flex; flex-direction:column; }
.zc-main { flex: 1; display:flex; flex-direction:column; min-width: 0; }
@media (max-width: 900px){ .zc-sidebar { width: 280px; } }
@media (max-width: 760px){ .zc-shell { flex-direction:column; } .zc-sidebar { width: 100%; border-right: 0; border-bottom: 1px solid rgba(255,255,255,0.10); } }

.zc-sidebar-brand { display:flex; align-items:center; gap: 10px; padding: 16px; border-bottom: 1px solid rgba(255,255,255,0.10); }
.zc-logo { width: 36px; height: 36px; border-radius: 10px; display:flex; align-items:center; justify-content:center; background: rgba(255,255,255,0.10); border: 1px solid rgba(255,255,255,0.12); font-weight: 800; }
.zc-name { font-size: 14px; font-weight: 700; letter-spacing: 0.02em; }

.zc-nav { display:flex; gap: 6px; padding: 12px 12px 6px; }
.zc-nav-link { flex: 1; text-align:center; padding: 10px 10px; border-radius: 12px; background: rgba(255,255,255,0.05); border: 1px solid rgba(255,255,255,0.10); color:#fff; text-decoration:none; font-weight: 700; font-size: 12px; }
.zc-nav-link.active, .zc-nav-link:hover { background: rgba(255,255,255,0.10); }

.zc-search { padding: 10px 12px 0; position: relative; }
.zc-search-results { position:absolute; left: 12px; right: 12px; top: 58px; background: #0f0f18; border: 1px solid rgba(255,255,255,0.12); border-radius: 12px; overflow:hidden; z-index: 50; }
.zc-search-item { padding: 10px 12px; cursor:pointer; border-bottom: 1px solid rgba(255,255,255,0.08); }
.zc-search-item:hover { background: rgba(255,255,255,0.06); }
.zc-search-item:last-child { border-bottom: 0; }
.zc-search-name { font-weight: 700; font-size: 13px; }
.zc-search-sub { font-size: 12px; color: rgba(255,255,255,0.65); margin-top: 2px; }

.zc-list-header { padding: 12px 16px 8px; font-size: 12px; font-weight: 800; color: rgba(255,255,255,0.60); letter-spacing: .10em; text-transform: uppercase; }
.zc-conv-list { padding: 0 10px 14px; overflow:auto; }
.zc-conv { display:flex; align-items:center; justify-content:space-between; gap: 10px; padding: 12px; border-radius: 14px; background: rgba(255,255,255,0.05); border: 1px solid rgba(255,255,255,0.10); cursor:pointer; margin-bottom: 8px; }
.zc-conv:hover { background: rgba(255,255,255,0.08); }
.zc-conv.active { background: rgba(255,255,255,0.10); }
.zc-conv-title { font-weight: 800; font-size: 13px; }
.zc-conv-last { font-size: 12px; color: rgba(255,255,255,0.65); margin-top: 3px; }
.zc-badge { min-width: 22px; height: 22px; border-radius: 11px; background: rgba(255,255,255,0.92); color: #000; display:flex; align-items:center; justify-content:center; font-size: 12px; font-weight: 800; }

.zc-topbar { display:flex; align-items:center; justify-content:space-between; padding: 14px 18px; border-bottom: 1px solid rgba(255,255,255,0.10); }
.zc-topbar-title { font-weight: 900; font-size: 14px; }
.zc-topbar-meta { font-size: 12px; color: rgba(255,255,255,0.65); }

.zc-thread { flex: 1; overflow:auto; padding: 18px; }
.zc-empty { height: 100%; display:flex; flex-direction:column; align-items:center; justify-content:center; border-radius: 18px; border: 1px dashed rgba(255,255,255,0.12); background: rgba(255,255,255,0.03); }
.zc-empty-title { font-size: 16px; font-weight: 900; }
.zc-empty-sub { margin-top: 6px; font-size: 13px; color: rgba(255,255,255,0.65); }

.zc-msg { max-width: 76%; margin-bottom: 10px; padding: 10px 12px; border-radius: 16px; border: 1px solid rgba(255,255,255,0.10); background: rgba(255,255,255,0.08); }
.zc-msg.mine { margin-left: auto; background: rgba(255,255,255,0.92); color: #000; border-color: rgba(255,255,255,0.92); }
.zc-msg-meta { margin-top: 6px; font-size: 11px; color: rgba(255,255,255,0.65); display:flex; justify-content:space-between; gap: 10px; }
.zc-msg.mine .zc-msg-meta { color: rgba(0,0,0,0.60); }

.zc-composer { padding: 12px 18px; border-top: 1px solid rgba(255,255,255,0.10); display:flex; gap: 10px; }
.zc-composer .zc-textarea { flex: 1; }

.zc-content { padding: 18px; }
.zc-kv { display:flex; flex-direction:column; gap: 10px; margin-bottom: 14px; }
.zc-kv-row { display:flex; justify-content:space-between; gap: 12px; padding: 10px 12px; border-radius: 12px; background: rgba(255,255,255,0.04); border: 1px solid rgba(255,255,255,0.08); }
.zc-kv-k { font-size: 12px; font-weight: 800; color: rgba(255,255,255,0.65); }
.zc-kv-v { font-size: 12px; font-weight: 700; }

.zc-table-wrap { overflow:auto; margin-top: 14px; }
.zc-table { width: 100%; border-collapse: collapse; }
.zc-table th, .zc-table td { text-align:left; padding: 10px 10px; border-bottom: 1px solid rgba(255,255,255,0.10); font-size: 13px; }
.zc-table th { font-size: 12px; letter-spacing: .08em; text-transform: uppercase; color: rgba(255,255,255,0.65); }