:root { color-scheme: dark; font-family: Inter, ui-sans-serif, system-ui, -apple-system, sans-serif; --bg:#060b12; --panel:#0d1622; --line:#213044; --text:#edf5ff; --muted:#8ba0b8; --mint:#60f0bf; --blue:#6e9cff; }
* { box-sizing: border-box; }
body { margin:0; min-height:100vh; background:radial-gradient(circle at 18% 18%,#10293a 0,transparent 31%),radial-gradient(circle at 90% 78%,#102338 0,transparent 26%),var(--bg); color:var(--text); }
button,input { font:inherit; }
button { cursor:pointer; }
.hidden { display:none!important; }
.shell { min-height:100vh; }
.topbar { height:76px; display:flex; align-items:center; justify-content:space-between; padding:0 clamp(24px,5vw,80px); border-bottom:1px solid #ffffff12; backdrop-filter:blur(18px); }
.brand { color:var(--text); display:flex; align-items:center; gap:12px; text-decoration:none; letter-spacing:.05em; font-size:1.05rem; }
.brand b,.eyebrow { color:var(--mint); }
.brand-mark { width:34px; height:34px; display:grid; place-items:center; border:1px solid #4acba1; border-radius:10px; font-weight:900; box-shadow:inset 0 0 20px #60f0bf22; }
.service-state { display:flex; align-items:center; gap:9px; color:var(--muted); font-size:.85rem; }
.pulse { width:8px; height:8px; border-radius:50%; background:var(--mint); box-shadow:0 0 14px var(--mint); }
.pulse.error { background:#ff6b76; box-shadow:0 0 14px #ff6b76; }
.auth-layout { min-height:calc(100vh - 76px); display:grid; grid-template-columns:minmax(0,1.15fr) minmax(380px,.7fr); gap:clamp(40px,8vw,120px); align-items:center; padding:60px clamp(24px,7vw,112px); }
.hero { max-width:760px; }
.eyebrow { font-size:.72rem; letter-spacing:.18em; font-weight:800; margin:0 0 16px; }
.hero h1 { margin:0; font-size:clamp(3.1rem,6.4vw,7rem); line-height:.92; letter-spacing:-.055em; }
.hero h1 span { color:transparent; -webkit-text-stroke:1px #9bb0c7; }
.hero-copy { max-width:650px; color:var(--muted); font-size:clamp(1rem,1.7vw,1.25rem); line-height:1.65; margin:32px 0 42px; }
.feature-list { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; }
.feature-list>div { padding:18px; border-top:1px solid var(--line); }
.feature-list span { color:var(--mint); font:700 .72rem monospace; }
.feature-list p { color:var(--muted); line-height:1.5; font-size:.86rem; }
.feature-list b { color:var(--text); }
.auth-card { background:#0c1521e8; border:1px solid var(--line); border-radius:24px; padding:12px 32px 32px; box-shadow:0 30px 90px #0008; }
.tabs { display:flex; gap:4px; border-bottom:1px solid var(--line); margin-bottom:28px; }
.tab { flex:1; color:var(--muted); background:none; border:0; border-bottom:2px solid transparent; padding:18px 8px 15px; }
.tab.active { color:var(--text); border-color:var(--mint); }
.form-panel { display:grid; gap:18px; }
.form-panel h2,dialog h2 { font-size:1.65rem; margin:3px 0 4px; }
label { display:grid; gap:8px; color:#bed0e1; font-size:.84rem; font-weight:650; }
input { width:100%; color:var(--text); background:#07101b; border:1px solid #26384c; border-radius:11px; padding:14px 15px; outline:none; }
input:focus { border-color:var(--mint); box-shadow:0 0 0 3px #60f0bf18; }
.primary,.secondary,.logout,.nav-item { border:0; border-radius:11px; }
.primary { display:flex; justify-content:space-between; align-items:center; padding:14px 17px; background:var(--mint); color:#04130e; font-weight:850; }
.primary:hover { background:#8affd9; }
.primary:disabled { opacity:.5; cursor:wait; }
.compact { width:auto; gap:20px; }
.secondary { padding:13px 17px; background:#172536; color:var(--text); }
.hint,.muted { color:var(--muted); }
.hint { margin:0; font-size:.75rem; }
.message { margin-top:18px; padding:12px 14px; border:1px solid #ff6b7655; border-radius:10px; background:#ff6b7612; color:#ffabb1; font-size:.85rem; }
.message.success { border-color:#60f0bf55; background:#60f0bf12; color:#8dffd9; }
.dashboard { min-height:calc(100vh - 76px); display:grid; grid-template-columns:270px 1fr; }
.sidebar { padding:38px 28px; border-right:1px solid var(--line); display:flex; flex-direction:column; gap:42px; background:#08111bdd; }
.sidebar h2 { margin:0 0 4px; }
.sidebar nav { display:grid; gap:8px; }
.nav-item { width:100%; text-align:left; padding:13px 14px; background:transparent; color:var(--muted); }
.nav-item span { display:inline-block; width:28px; color:var(--mint); }
.nav-item small { float:right; color:#62768d; }
.nav-item.active { color:var(--text); background:#142233; }
.nav-item.disabled { cursor:not-allowed; opacity:.65; }
.logout { margin-top:auto; color:#ff9ba4; background:#ff6b7610; padding:12px; }
.workspace { padding:clamp(34px,5vw,72px); }
.workspace-head { display:flex; justify-content:space-between; gap:24px; align-items:flex-start; border-bottom:1px solid var(--line); padding-bottom:30px; }
.workspace h1 { margin:0; font-size:clamp(2.2rem,5vw,4.2rem); letter-spacing:-.05em; }
.org-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); gap:18px; margin-top:32px; }
.org-card { padding:24px; border:1px solid var(--line); border-radius:16px; background:linear-gradient(145deg,#111e2d,#0b1420); }
.org-card h3 { margin:18px 0 8px; }
.org-card p { margin:0; }
.org-avatar { width:42px; height:42px; border-radius:12px; display:grid; place-items:center; background:#60f0bf18; color:var(--mint); font-weight:900; }
.role { display:inline-block; margin-top:18px; padding:6px 9px; border-radius:99px; background:#6e9cff17; color:#98b6ff; font-size:.7rem; text-transform:uppercase; }
.empty { min-height:390px; display:grid; place-content:center; justify-items:center; text-align:center; color:var(--muted); }
.empty h3 { color:var(--text); margin-bottom:5px; }
.empty p { max-width:490px; line-height:1.6; }
.empty-icon { width:70px; height:70px; display:grid; place-items:center; border:1px solid #60f0bf55; border-radius:20px; color:var(--mint); font-size:1.8rem; }
dialog { width:min(480px,calc(100% - 32px)); padding:0; color:var(--text); border:1px solid var(--line); border-radius:20px; background:#0d1723; box-shadow:0 40px 120px #000c; }
dialog::backdrop { background:#02050bcc; backdrop-filter:blur(8px); }
dialog form { display:grid; gap:22px; padding:30px; }
.dialog-actions { display:flex; justify-content:flex-end; gap:10px; }
.summary-grid { display:grid; grid-template-columns:repeat(5,minmax(130px,1fr)); gap:14px; margin:28px 0; }
.summary-card { padding:18px; border:1px solid var(--line); border-radius:14px; background:#0d1825; }
.summary-card strong { display:block; font-size:1.8rem; margin-bottom:4px; color:var(--mint); }
.summary-card span { color:var(--muted); font-size:.78rem; }
.admin-tabs { display:flex; gap:8px; margin:6px 0 18px; overflow:auto; }
.admin-tab { border:1px solid var(--line); border-radius:9px; background:#0b1520; color:var(--muted); padding:10px 14px; }
.admin-tab.active { color:#06120e; background:var(--mint); border-color:var(--mint); font-weight:800; }
.table-wrap { overflow:auto; border:1px solid var(--line); border-radius:14px; background:#0a141f; }
table { width:100%; border-collapse:collapse; min-width:760px; }
th,td { padding:14px 16px; border-bottom:1px solid #1b2a3b; text-align:left; font-size:.82rem; vertical-align:middle; }
th { color:#9cb0c5; font-size:.7rem; text-transform:uppercase; letter-spacing:.08em; background:#0e1a28; }
td strong { display:block; color:var(--text); }
td small { color:var(--muted); }
.status-pill { display:inline-block; padding:5px 8px; border-radius:99px; color:#80f5cf; background:#60f0bf14; font-size:.7rem; }
.status-pill.suspended { color:#ffabb1; background:#ff6b7614; }
.row-actions { display:flex; gap:7px; flex-wrap:wrap; }
.mini-button,select,.percent-input { color:var(--text); background:#132234; border:1px solid #29405a; border-radius:8px; padding:7px 9px; }
.mini-button.danger { color:#ffabb1; border-color:#6a2d38; }
.percent-input { width:70px; }
.feature-controls { display:grid; gap:10px; max-height:55vh; overflow:auto; }
.feature-control { display:grid; grid-template-columns:1fr 150px; gap:15px; align-items:center; padding:12px; border:1px solid var(--line); border-radius:10px; }
.feature-control strong { display:block; }
.feature-control small { color:var(--muted); }
.chat-workspace { padding:0; min-width:0; }
.chat-layout { min-height:calc(100vh - 76px); display:grid; grid-template-columns:280px minmax(0,1fr); }
.conversation-panel { padding:24px; border-right:1px solid var(--line); background:#09131e; }
.conversation-panel .primary { width:100%; margin-bottom:20px; }
.conversation-list { display:grid; gap:7px; }
.conversation-item { width:100%; text-align:left; border:1px solid transparent; border-radius:10px; background:transparent; color:var(--muted); padding:11px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.conversation-item.active { color:var(--text); border-color:var(--line); background:#132132; }
.chat-panel { min-width:0; display:grid; grid-template-rows:auto 1fr auto auto; height:calc(100vh - 76px); }
.chat-head { display:flex; justify-content:space-between; align-items:center; padding:22px 28px; border-bottom:1px solid var(--line); }
.chat-head h2 { margin:0; }
.model-badge { padding:7px 10px; border-radius:99px; background:#60f0bf15; color:var(--mint); font-size:.72rem; }
.chat-messages { overflow:auto; padding:28px max(24px,calc((100% - 860px)/2)); display:flex; flex-direction:column; gap:18px; }
.chat-welcome { margin:auto; text-align:center; color:var(--muted); }.chat-welcome h3 { color:var(--text); }
.chat-bubble { max-width:82%; padding:15px 17px; border-radius:15px; line-height:1.55; white-space:pre-wrap; overflow-wrap:anywhere; }
.chat-bubble.user { align-self:flex-end; color:#06140f; background:var(--mint); border-bottom-right-radius:4px; }
.chat-bubble.assistant { align-self:flex-start; background:#111e2d; border:1px solid var(--line); border-bottom-left-radius:4px; }
.chat-bubble small { display:block; opacity:.6; margin-top:8px; font-size:.66rem; }
.chat-bubble.typing { color:var(--muted); }
.chat-form { display:grid; grid-template-columns:1fr auto; gap:12px; padding:18px max(24px,calc((100% - 860px)/2)); border-top:1px solid var(--line); background:#08111bdd; }
textarea { resize:none; color:var(--text); background:#07101b; border:1px solid #26384c; border-radius:12px; padding:13px 15px; outline:none; font:inherit; }
textarea:focus { border-color:var(--mint); }
.chat-panel>.message { margin:0 24px 14px; }
@media(max-width:900px){.auth-layout{grid-template-columns:1fr}.hero h1{font-size:clamp(3rem,12vw,5.5rem)}.feature-list{display:none}.dashboard{grid-template-columns:1fr}.sidebar{border-right:0;border-bottom:1px solid var(--line);padding:24px}.sidebar nav{grid-template-columns:repeat(3,1fr)}.logout{margin-top:0}.workspace-head{flex-direction:column}}
@media(max-width:700px){.summary-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:760px){.chat-layout{grid-template-columns:1fr}.conversation-panel{display:none}.chat-panel{height:calc(100vh - 66px)}.chat-form{grid-template-columns:1fr}.chat-form .primary{justify-content:center}}
@media(max-width:560px){.topbar{height:66px}.service-state{font-size:0}.auth-layout{padding:34px 18px}.auth-card{padding:8px 20px 24px}.hero-copy{margin-bottom:10px}.sidebar nav{grid-template-columns:1fr}.workspace{padding:30px 18px}.chat-workspace{padding:0}.workspace-head .primary{width:100%;justify-content:center}.summary-grid{grid-template-columns:1fr 1fr}.feature-control{grid-template-columns:1fr}}
