:root{color-scheme:dark;--bg:#0b0e18;--card:rgba(255,255,255,0.05);--border:rgba(255,255,255,0.10);--text:#e9ecff;--muted:rgba(233,236,255,0.78);--accent:#2a56ff;--radius:16px;}
*{box-sizing:border-box;}html,body{height:100%;}
body{margin:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial;background:var(--bg);color:var(--text);-webkit-text-size-adjust:100%;}
a{color:inherit;text-decoration:none;}
.wrap{max-width:1100px;margin:0 auto;padding:14px;}
.top{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 0 12px;}
.brand{font-weight:800;letter-spacing:.25px;}
.nav{display:flex;align-items:center;gap:10px;flex-wrap:wrap;justify-content:flex-end;}
.nav a{opacity:.92;}
.stickybar{position:sticky;top:0;z-index:5;background:linear-gradient(to bottom,rgba(11,14,24,.95),rgba(11,14,24,.70));backdrop-filter:blur(8px);border-bottom:1px solid rgba(255,255,255,.06);padding:10px 0;margin-bottom:10px;}
.row{display:flex;gap:10px;flex-wrap:wrap;}
.input,select{width:100%;background:rgba(255,255,255,.07);color:var(--text);border:1px solid var(--border);border-radius:14px;padding:12px;font-size:16px;outline:none;}
.btn{cursor:pointer;background:var(--accent);border:0;color:#fff;padding:12px 14px;border-radius:14px;font-weight:700;font-size:15px;display:inline-flex;align-items:center;justify-content:center;min-height:42px;}
.btn.secondary{background:rgba(255,255,255,.10);border:1px solid rgba(255,255,255,.12);}
.small{font-size:12px;color:var(--muted);}
.muted{color:var(--muted);font-size:13px;line-height:1.35;}
.cardgrid{display:grid;grid-template-columns:1fr;gap:12px;}
.card{background:var(--chat-bg,var(--card));border:1px solid rgba(255,255,255,.09);border-radius:var(--radius);padding:14px;color:var(--chat-text,var(--text));overflow:hidden;}
.card .muted{color:var(--chat-muted,var(--muted));}
.card .btn{background:var(--chat-primary,var(--accent));}
.card .btn.secondary{background:rgba(255,255,255,.10);border:1px solid rgba(255,255,255,.12);}
.card .badge{border-color:rgba(255,255,255,.14);background:rgba(0,0,0,.12);}
.card .cover{height:112px;border-radius:14px;margin:-14px -14px 12px;background-size:cover;background-position:center;position:relative;border-bottom:1px solid rgba(255,255,255,.08);}
.card .cover::after{content:"";position:absolute;inset:0;background:linear-gradient(to bottom,rgba(0,0,0,.06),rgba(0,0,0,.55));border-radius:14px;}
.card .headrow{display:flex;align-items:center;gap:10px;}
.card .roomimg{width:44px;height:44px;border-radius:12px;object-fit:cover;border:1px solid rgba(255,255,255,.16);background:rgba(255,255,255,.06);flex:0 0 auto;}
.card .titles{min-width:0;flex:1 1 auto;}
.card .titles h3{margin:0 0 6px;font-size:16px;}
.card h3{margin:0 0 6px;font-size:16px;}
.badges{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px;}
.badge{font-size:12px;padding:4px 8px;border-radius:999px;border:1px solid rgba(255,255,255,.14);opacity:.95;background:rgba(0,0,0,.12);}
hr{border:0;border-top:1px solid rgba(255,255,255,.08);margin:14px 0;}
.err{background:rgba(255,60,60,.12);border:1px solid rgba(255,60,60,.25);padding:10px 12px;border-radius:14px;}
.ok{background:rgba(60,255,160,.10);border:1px solid rgba(60,255,160,.20);padding:10px 12px;border-radius:14px;}
@media(min-width:700px){.wrap{padding:18px}.cardgrid{grid-template-columns:repeat(2,minmax(0,1fr))}.input.wide{flex:1 1 420px}select.wide{width:240px}}
@media(min-width:980px){.cardgrid{grid-template-columns:repeat(3,minmax(0,1fr))}}
.modal-backdrop{position:fixed;inset:0;background:rgba(0,0,0,.55);display:none;align-items:center;justify-content:center;padding:18px;z-index:50;}
.modal-backdrop.visible{display:flex;}
.modal{width:min(520px,100%);background:rgba(20,24,40,.98);border:1px solid rgba(255,255,255,.12);border-radius:18px;padding:14px;}
.modal h3{margin:0 0 8px;}
.modal-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:12px;}
pre{white-space:pre-wrap;background:rgba(0,0,0,.25);padding:10px;border-radius:12px;border:1px solid rgba(255,255,255,.08);}