:root{color-scheme:dark;--bg:#06101c;--panel:#0b1726;--panel2:#102036;--panel3:#152941;--line:#243a54;--text:#f7f9fc;--muted:#9cafc7;--accent:#39c8b8;--accentink:#03110f;--danger:#ff7580;--warning:#ffc866;--safe-top:env(safe-area-inset-top);--safe-bottom:env(safe-area-inset-bottom)}*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:var(--bg);color:var(--text);font:15px/1.45 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}body{overflow:hidden}button,input,textarea,select{font:inherit}button{touch-action:manipulation}a{color:#8fd4ff}.hidden{display:none!important}.eyebrow{text-transform:uppercase;letter-spacing:.12em;font-size:11px;color:var(--muted);font-weight:800}
.landing-shell{min-height:100dvh;overflow:auto;padding:calc(18px + var(--safe-top)) 16px calc(18px + var(--safe-bottom));display:flex;align-items:center;justify-content:center}.landing-card{width:min(100%,470px);padding:22px;border:1px solid var(--line);border-radius:24px;background:linear-gradient(180deg,#0d1929,#0a1523);box-shadow:0 24px 70px #0006}.brand-row{display:flex;align-items:center;gap:14px}.brand-mark{width:52px;height:52px;border-radius:16px;background:var(--accent);color:var(--accentink);display:grid;place-items:center;font-weight:950;font-size:24px}h1{font-size:30px;line-height:1.05;margin:4px 0 0}.landing-copy{color:var(--muted);margin:20px 0}.form-stack{display:grid;gap:14px}label{display:grid;gap:7px;font-weight:750}label span{display:flex;justify-content:space-between;gap:8px}label em{font-style:normal;color:var(--muted);font-weight:500;font-size:12px}input,textarea,select{width:100%;border:1px solid var(--line);background:#071421;color:var(--text);border-radius:14px;padding:13px 14px;outline:none}input:focus,textarea:focus,select:focus{border-color:var(--accent);box-shadow:0 0 0 3px #39c8b824}.registered-details{border:1px solid var(--line);border-radius:14px;padding:12px 14px;background:#081522}.registered-details summary{cursor:pointer;font-weight:750}.registered-details[open] label{margin-top:12px}.primary-btn,.secondary-btn,.drawer-action,.send-btn,.tool-btn{border:0;border-radius:14px;padding:13px 16px;font-weight:850;cursor:pointer}.primary-btn,.send-btn{background:var(--accent);color:var(--accentink)}.primary-btn{width:100%}.secondary-btn{background:var(--panel2);color:var(--text);border:1px solid var(--line)}.landing-links{display:flex;flex-wrap:wrap;gap:12px 18px;margin-top:20px;font-size:13px}
.app-shell{height:100dvh;display:grid;grid-template-columns:1fr;background:var(--bg);overflow:hidden}.chat-pane{height:100dvh;min-width:0;display:grid;grid-template-rows:auto minmax(0,1fr) auto}.topbar{min-height:64px;padding:calc(8px + var(--safe-top)) 8px 8px;display:grid;grid-template-columns:48px minmax(0,1fr) 48px;align-items:center;border-bottom:1px solid var(--line);background:#07121fee;backdrop-filter:blur(16px);z-index:4}.icon-btn{width:44px;height:44px;border:0;border-radius:13px;background:transparent;color:var(--text);display:grid;place-items:center;font-size:21px;cursor:pointer}.icon-btn:hover{background:var(--panel2)}.title-wrap{min-width:0;text-align:center}.title-wrap strong,.title-wrap small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.title-wrap strong{font-size:17px}.title-wrap small{color:var(--muted);font-size:12px;margin-top:2px}.messages{overflow:auto;overscroll-behavior:contain;padding:14px 12px 22px;scrollbar-width:thin;scrollbar-color:var(--line) transparent}.msg{margin:0 0 13px}.msg-row{display:grid;grid-template-columns:auto minmax(0,1fr);gap:5px 9px;align-items:baseline}.msg-meta{display:flex;align-items:center;gap:7px;min-width:0}.msg time{font-size:11px;color:var(--muted)}.msg .nick{font-weight:850;cursor:pointer;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.msg .body{grid-column:2;overflow-wrap:anywhere;white-space:pre-wrap}.msg .body a{word-break:break-all}.msg.system{color:var(--muted);font-size:13px;padding:2px 0}.msg.notice{border-left:3px solid var(--accent);padding-left:10px}.msg.error{color:#ffb0b6}.msg.action{color:#c7b4ff}.msg.highlight{background:#39c8b814;border-radius:10px;padding:8px}.composer{display:grid;grid-template-columns:minmax(0,1fr) 50px;gap:8px;padding:9px 10px calc(9px + var(--safe-bottom));border-top:1px solid var(--line);background:var(--panel)}.composer textarea{resize:none;min-height:46px;max-height:130px;padding:12px 13px}.send-btn{padding:0;font-size:20px}
.drawer{position:fixed;top:0;bottom:0;z-index:30;width:min(88vw,340px);background:var(--panel);overflow:auto;padding:calc(14px + var(--safe-top)) 12px calc(14px + var(--safe-bottom));transition:transform .2s ease;box-shadow:0 0 35px #0006}.drawer-left{left:0;transform:translateX(-104%);border-right:1px solid var(--line)}.drawer-right{right:0;transform:translateX(104%);border-left:1px solid var(--line)}.drawer.open{transform:none}.drawer-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px}.drawer-head strong{font-size:20px}.connection-card{display:flex;align-items:center;gap:10px;background:#071421;border:1px solid var(--line);border-radius:14px;padding:12px;margin-bottom:16px}.connection-card small{display:block;color:var(--muted)}.connection-dot{width:10px;height:10px;border-radius:50%;background:var(--warning);box-shadow:0 0 0 4px #ffc86614}.connection-dot.online{background:var(--accent);box-shadow:0 0 0 4px #39c8b81a}.connection-dot.offline{background:var(--danger);box-shadow:0 0 0 4px #ff75801a}.section-label{font-size:11px;text-transform:uppercase;letter-spacing:.11em;color:var(--muted);font-weight:850;padding:7px 8px}.buffer-list{display:grid;gap:3px}.buffer{width:100%;border:0;background:transparent;color:var(--text);display:flex;align-items:center;justify-content:space-between;gap:10px;padding:11px;border-radius:11px;text-align:left;cursor:pointer}.buffer:hover,.buffer.active{background:var(--panel2)}.buffer-main{display:flex;align-items:center;gap:9px;min-width:0}.buffer-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.buffer-icon{width:22px;color:var(--muted);text-align:center}.badge{min-width:22px;height:22px;border-radius:999px;background:var(--accent);color:var(--accentink);display:grid;place-items:center;font-size:11px;font-weight:950;padding:0 6px}.drawer-actions{display:grid;gap:7px;margin-top:15px;padding-top:14px;border-top:1px solid var(--line)}.drawer-action{width:100%;background:var(--panel2);color:var(--text);border:1px solid var(--line);text-align:left}.link-action{text-decoration:none;display:block}.prefix-legend{display:grid;grid-template-columns:1fr 1fr;gap:7px;padding:10px;margin-bottom:12px;border:1px solid var(--line);border-radius:13px;background:#071421;color:var(--muted);font-size:12px}.prefix-legend b{color:var(--accent);display:inline-block;width:13px}.user-list{display:grid;gap:2px}.user{width:100%;display:flex;align-items:center;gap:9px;border:0;background:transparent;color:var(--text);padding:10px;border-radius:11px;text-align:left;cursor:pointer}.user:hover{background:var(--panel2)}.user-prefix{width:20px;text-align:center;font-weight:950;color:var(--accent)}.user-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.scrim{display:none}.scrim.show{display:block;position:fixed;z-index:20;inset:0;background:#000a}
.modal{width:min(92vw,540px);max-height:min(84dvh,760px);overflow:auto;border:1px solid var(--line);border-radius:20px;background:var(--panel);color:var(--text);padding:0}.modal::backdrop{background:#000b}.modal form{padding:18px}.modal-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}.modal-head h2{margin:4px 0 0;font-size:21px}.modal-body{display:grid;gap:10px;margin:18px 0}.modal-body label{margin:0}.modal menu{display:flex;justify-content:flex-end;gap:8px;padding:0;margin:18px 0 0}.modal menu .primary-btn{width:auto}.tool-grid{display:grid;grid-template-columns:1fr;gap:8px}.tool-btn{background:var(--panel2);color:var(--text);border:1px solid var(--line);text-align:left}.tool-btn small{display:block;color:var(--muted);font-weight:500;margin-top:2px}
@media(min-width:900px){.app-shell{grid-template-columns:270px minmax(0,1fr) 250px}.drawer{position:static;width:auto;transform:none!important;box-shadow:none;z-index:auto}.drawer-left{grid-column:1;border-right:1px solid var(--line)}.chat-pane{grid-column:2;grid-row:1}.drawer-right{grid-column:3;border-left:1px solid var(--line)}.drawer-close,.topbar #openLeft,.topbar #openRight{display:none}.scrim{display:none!important}.messages{padding:18px 22px 28px}.msg-row{grid-template-columns:145px minmax(0,1fr)}.msg-meta{justify-content:flex-end}.msg .body{grid-column:2}.topbar{grid-template-columns:1fr}.title-wrap{text-align:left;padding:0 10px}.composer{padding:11px 14px calc(11px + var(--safe-bottom))}}@media(min-width:1250px){.app-shell{grid-template-columns:300px minmax(0,1fr) 280px}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}

/* ===== Mobile composer v2 ===== */
.composer{
  display:grid;
  grid-template-columns:1fr;
  gap:5px;
}

.composer-box{
  position:relative;
  display:flex;
  align-items:flex-end;
  width:100%;
  min-height:52px;
  background:#071421;
  border:1px solid var(--line);
  border-radius:18px;
}

.composer-box:focus-within{
  border-color:var(--accent);
  box-shadow:0 0 0 3px rgba(57,200,184,.14);
}

.composer-box textarea{
  width:100%;
  min-height:50px;
  max-height:130px;
  border:0;
  background:transparent;
  box-shadow:none!important;
  padding:13px 58px 12px 14px;
  resize:none;
}

.composer-box .send-btn{
  position:absolute;
  right:5px;
  bottom:5px;
  width:42px;
  height:42px;
  padding:0;
  border-radius:14px;
  display:grid;
  place-items:center;
}

.keyboard-toggle{
  justify-self:center;
  border:0;
  background:transparent;
  color:var(--muted);
  padding:2px 12px;
  font-size:12px;
  font-weight:750;
  cursor:pointer;
}

/* =========================================================
   MOBILE-FIRST COMPOSER
   ========================================================= */

.composer{
  display:grid !important;
  grid-template-columns:1fr !important;
  gap:4px !important;
}

.composer-box{
  position:relative;
  width:100%;
  min-height:52px;
  display:flex;
  align-items:flex-end;
  background:#071421;
  border:1px solid var(--line);
  border-radius:18px;
}

.composer-box:focus-within{
  border-color:var(--accent);
  box-shadow:0 0 0 3px rgba(57,200,184,.14);
}

.composer-box #input{
  width:100%;
  min-height:50px;
  max-height:130px;
  resize:none;
  border:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  padding:13px 58px 12px 14px !important;
}

.composer-box .send-btn{
  position:absolute !important;
  right:5px;
  bottom:5px;
  width:42px !important;
  height:42px !important;
  padding:0 !important;
  border-radius:14px;
  display:grid;
  place-items:center;
  font-size:19px;
}

.keyboard-toggle{
  justify-self:center;
  border:0;
  background:transparent;
  color:var(--muted);
  padding:3px 14px 1px;
  font-size:12px;
  font-weight:750;
  cursor:pointer;
}