:root{--bg:#071018;--panel:#0b1822;--muted:#89a9c4;--text:#e6f3ff;--accent:#5cc8ff;--danger:#ff6b6b;--border:#123044}
*{box-sizing:border-box} html,body{height:100%} body{margin:0;font-family:system-ui,Segoe UI,Roboto,Inter,Arial;background:var(--bg);color:var(--text)}
.hidden{display:none!important} .muted{color:#9ec0df} .sm{font-size:.9rem} .container{max-width:1100px;margin:0 auto;padding:16px}
.header{position:sticky;top:0;z-index:10;display:flex;justify-content:space-between;align-items:center;padding:10px 16px;border-bottom:1px solid var(--border);background:#0a1520cc;backdrop-filter:blur(6px)}
.brand{display:flex;align-items:center;gap:10px} .logo{width:36px;height:36px;border-radius:10px;box-shadow:0 8px 30px #5cc8ff44;background:linear-gradient(135deg,#5cc8ff,#8ef3ff)}
.badge{margin-left:6px;padding:2px 8px;border-radius:999px;background:#5cc8ff33;border:1px solid #2b9bd833;color:#c6ecff;font-size:.8rem}
.header-actions{display:flex;align-items:center;gap:8px}
.header input[type=email]{width:260px;padding:8px;border:1px solid var(--border);border-radius:10px;background:#0b1822;color:var(--text)}
.btn{padding:8px 12px;border-radius:10px;border:1px solid #1a405a;background:#123b58;color:#d7f1ff;cursor:pointer}
.btn:hover{filter:brightness(1.1)} .btn-secondary{background:#0e2433;border-color:#1b3e5b;color:#bfe6ff}
.btn-danger{background:#3b0f14;border-color:#7a1f29;color:#ffd8d8}
.card{background:var(--panel);border:1px solid var(--border);border-radius:14px;padding:12px;margin-top:16px}
.grid{display:grid;gap:12px} .row{display:flex;gap:8px;align-items:center;justify-content:space-between}
.tabs{display:flex;gap:8px;border-bottom:1px solid var(--border);padding-bottom:8px;margin-bottom:12px}
.tab{background:#0e2433;border:1px solid #1b3e5b;color:#bfe6ff;padding:8px 10px;border-radius:10px;cursor:pointer} .tab.active{background:#123b58}
.panel{display:none} .panel.active{display:block}
.form textarea{min-height:110px;background:#0b1822;border:1px solid var(--border);border-radius:10px;color:var(--text);padding:8px}
.form input[type=file], .form select, .form input[type=text]{background:#0b1822;border:1px solid var(--border);border-radius:10px;color:var(--text);padding:8px}
.right{display:flex;justify-content:flex-end}
.post{border:1px solid var(--border);background:#091521;border-radius:14px;padding:12px}
.post .topic{border:1px solid #2e6e97;background:#113a55;color:#bfe6ff;border-radius:999px;padding:2px 8px}
.post .time{color:#98b6cf;font-size:.85rem}
.post .text{white-space:pre-wrap;line-height:1.6;margin-top:8px}
.media{margin-top:10px;overflow:hidden;border-radius:12px;border:1px solid #10354c}
.media img, .media video{width:100%;max-height:360px;object-fit:cover;background:#06111b}
.comments{margin-top:12px}
.comments-list .comment{border:1px solid #0f2a3b;background:#0a1620;border-radius:10px;padding:8px;margin-top:6px}
dialog::backdrop{background:#0008} dialog{border:none;border-radius:14px;padding:0}
.config{background:#0b1822;color:var(--text);border:1px solid var(--border);border-radius:14px;padding:16px;min-width:360px}
.config input, .config textarea{width:100%;background:#0a1620;border:1px solid var(--border);border-radius:10px;color:var(--text);padding:8px}
.tests .ok{color:#9af2c2} .tests .warn{color:#ffd28a} .tests .err{color:#ff9aa0}
.footer{padding:10px 16px;opacity:.9}