:root{--ink: #0d1b1e;--ink-2: #12262a;--ink-3: #17323779;--fog: #b8ccce;--paper: #eaf3f2;--amber: #e8b84b;--amber-dim: #e8b84b22;--in: #16302f;--out: #1d3b2e;--danger: #e07a5f;--sans: ui-sans-serif, system-ui, "Segoe UI", Roboto, Inter, sans-serif;--mono: ui-monospace, "SF Mono", "JetBrains Mono", Menlo, Consolas, monospace}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{font-family:var(--sans);color:var(--paper);background:radial-gradient(1200px 600px at 20% -10%,#123035,var(--ink));-webkit-font-smoothing:antialiased}.boot{display:grid;place-items:center;height:100%;color:var(--fog)}.app{display:grid;grid-template-columns:300px 1fr;height:100%}.sidebar{background:var(--ink-2);border-right:1px solid var(--ink-3);display:flex;flex-direction:column;min-height:0}.me{display:grid;grid-template-columns:auto 1fr auto;gap:10px;align-items:center;padding:16px;border-bottom:1px solid var(--ink-3)}.seal{color:var(--amber);font-size:20px}.me-name{font-weight:600}.ghost{background:none;border:1px solid var(--ink-3);color:var(--fog);border-radius:8px;padding:4px 8px;cursor:pointer;font-size:12px}.ghost:hover{color:var(--danger);border-color:var(--danger)}.add{display:flex;gap:6px;padding:12px}.add input{flex:1}.add button{width:40px;font-size:20px;line-height:1}.contacts{list-style:none;margin:0;padding:4px;overflow-y:auto;flex:1}.contacts li{display:flex;align-items:center;gap:10px;padding:12px;border-radius:10px;cursor:pointer;color:var(--fog)}.contacts li:hover{background:#ffffff08}.contacts li.on{background:var(--amber-dim);color:var(--paper)}.contacts .dot{color:var(--amber);opacity:.6;font-size:12px}.contacts .empty{color:#6f8688;font-size:13px;text-align:center;padding:28px 16px;cursor:default;line-height:1.6}.chat{display:flex;flex-direction:column;min-height:0}.placeholder{margin:auto;text-align:center;color:var(--fog)}.placeholder .lock{font-size:42px;color:var(--amber);opacity:.5}.placeholder p{line-height:1.7}.placeholder span{color:#6f8688;font-size:13px}.chat-head{display:flex;justify-content:space-between;align-items:center;padding:14px 18px;border-bottom:1px solid var(--ink-3);background:var(--ink-2)}.fp{display:block;font-family:var(--mono);font-size:11px;color:#6f8688;margin-top:3px;letter-spacing:.5px}.thread{flex:1;overflow-y:auto;padding:20px;display:flex;flex-direction:column;gap:8px}.bubble{max-width:68%;padding:9px 12px;border-radius:14px;line-height:1.4;word-wrap:break-word}.bubble.in{align-self:flex-start;background:var(--in);border-bottom-left-radius:4px}.bubble.out{align-self:flex-end;background:var(--out);border-bottom-right-radius:4px}.bubble time{display:block;font-family:var(--mono);font-size:10px;color:#fff5;margin-top:4px;text-align:right}.bubble .state{color:var(--amber);font-style:normal}.composer{display:flex;gap:10px;padding:14px;border-top:1px solid var(--ink-3);background:var(--ink-2)}.composer input{flex:1}.onboard{display:grid;place-items:center;height:100%;padding:20px}.card{width:100%;max-width:380px;background:var(--ink-2);border:1px solid var(--ink-3);border-radius:18px;padding:28px}.brand{font-size:22px;font-weight:700;display:flex;align-items:center;gap:8px}.tag{color:var(--fog);font-size:14px;line-height:1.6;margin:8px 0 20px}.tabs{display:flex;gap:6px;margin-bottom:18px}.tabs button{flex:1;background:none;border:1px solid var(--ink-3);color:var(--fog)}.tabs button.on{border-color:var(--amber);color:var(--amber);background:var(--amber-dim)}.card label{display:block;font-size:12px;color:var(--fog);margin:12px 0 6px}.card label small{color:#6f8688}.err{color:var(--danger);font-size:13px;margin-top:12px}.fine{color:#6f8688;font-size:11px;line-height:1.6;margin-top:16px}input{width:100%;background:var(--ink);border:1px solid var(--ink-3);color:var(--paper);border-radius:10px;padding:10px 12px;font-family:var(--sans);font-size:14px;outline:none}input:focus{border-color:var(--amber)}input:disabled{opacity:.5}button{cursor:pointer;border-radius:10px;border:none;padding:10px 14px;font-size:14px;font-family:var(--sans);background:#ffffff10;color:var(--paper)}button:hover:not(:disabled){background:#ffffff1c}button:disabled{opacity:.4;cursor:default}button.primary,button.composer>button{width:100%;margin-top:20px;background:var(--amber);color:#1a1204;font-weight:700}.composer button{width:auto;margin:0;background:var(--amber);color:#1a1204;font-weight:700}button.primary:hover:not(:disabled){filter:brightness(1.06)}.pill{font-family:var(--mono);font-size:11px;padding:2px 8px;border-radius:999px}.pill.online{color:#86e0b0;background:#86e0b018}.pill.offline{color:var(--danger);background:#e07a5f18}.pill.connecting{color:var(--amber);background:var(--amber-dim)}@media(max-width:720px){.app{grid-template-columns:1fr}.sidebar{display:var(--show-sidebar, flex)}}@media(prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}.head-actions{display:flex;align-items:center;gap:8px}.icon{background:#ffffff10;border-radius:10px;padding:6px 10px;font-size:15px;line-height:1}.icon:hover:not(:disabled){background:#ffffff1c}.icon.rec{background:var(--danger);color:#fff;animation:pulse 1s infinite}@keyframes pulse{50%{opacity:.55}}.composer .icon{flex:0 0 auto}.media-img{max-width:260px;max-height:320px;border-radius:10px;display:block}.media-audio{width:240px;height:40px}.media-file{color:var(--amber);text-decoration:none}.media-file small{color:#fff7}.media-loading{color:var(--fog);font-size:13px;font-style:italic}.call-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#06110f;display:grid;place-items:center;z-index:50}.call-overlay .remote{width:100%;height:100%;object-fit:contain;background:#000;position:absolute;top:0;right:0;bottom:0;left:0}.call-overlay .local{position:absolute;right:18px;bottom:110px;width:180px;max-width:34vw;border-radius:12px;border:1px solid #ffffff33;object-fit:cover;background:#111;z-index:2}.call-info{position:absolute;top:24px;left:0;right:0;text-align:center;z-index:2}.call-info p{display:inline-block;background:#0006;padding:8px 16px;border-radius:999px}.call-controls{position:absolute;bottom:32px;left:0;right:0;display:flex;justify-content:center;gap:14px;z-index:2}.call-btn{background:#ffffff1c;padding:14px 22px;border-radius:999px;font-weight:600}.call-btn.accept{background:#2ea36b;color:#fff}.call-btn.end{background:var(--danger);color:#fff}@media(max-width:720px){.call-overlay .local{width:120px;bottom:96px}.media-img{max-width:70vw}}.me-actions{display:flex;align-items:center;gap:6px}.invite-card{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);z-index:3;width:92%;max-width:440px;background:#0f2327ee;border:1px solid var(--ink-3);border-radius:18px;padding:24px;text-align:center;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.invite-card h3{margin:0 0 6px;font-size:18px}.invite-hint{color:var(--fog);font-size:13px;line-height:1.6;margin:0 0 16px}.invite-or{color:#6f8688;font-size:12px;margin:16px 0 12px;position:relative}.invite-codes{display:flex;gap:10px}.invite-codes .copyfield{flex:1}.invite-wait{color:var(--amber);font-size:13px;margin:18px 0 0}.copyfield{text-align:left}.copyfield.big{margin-bottom:4px}.cf-label{display:block;font-size:11px;color:var(--fog);margin-bottom:5px}.cf-row{display:flex;gap:6px}.cf-row input{background:#0005;border-color:#ffffff2a;font-family:var(--mono);font-size:12px;padding:9px 10px;letter-spacing:.5px}.cf-row button{background:var(--amber);color:#1a1204;font-weight:700;white-space:nowrap;padding:9px 12px}.copyfield.big .cf-row input{font-size:11px}.linklike{background:none;color:var(--amber);width:100%;margin-top:10px;font-size:13px}.linklike:hover{background:none;text-decoration:underline}.card.wide{max-width:440px}.apikeys{min-height:100%;display:grid;place-items:start center;padding:32px 16px;overflow-y:auto}.ak-card{width:100%;max-width:560px;background:var(--ink-2);border:1px solid var(--ink-3);border-radius:18px;padding:28px}.ak-gen{display:flex;gap:8px;margin:16px 0}.ak-gen input{flex:1}.ak-gen .primary{width:auto;margin:0}.ak-new{background:var(--amber-dim);border:1px solid var(--amber);border-radius:12px;padding:14px;margin-bottom:16px}.ak-new p{font-size:13px;margin:0 0 8px;color:var(--paper)}.ak-list{margin:8px 0 20px}.ak-item{display:flex;justify-content:space-between;align-items:center;padding:10px 0;border-bottom:1px solid var(--ink-3)}.ak-item .fp{display:block;margin-top:2px}.ak-doc{border-top:1px solid var(--ink-3);padding-top:16px}.ak-doc h4{margin:0 0 8px;font-size:14px}.ak-doc pre{background:#0005;border:1px solid var(--ink-3);border-radius:10px;padding:12px;font-family:var(--mono);font-size:11px;overflow-x:auto;white-space:pre;color:var(--fog)}.ak-doc code{font-family:var(--mono);color:var(--amber);font-size:12px}
