@import"https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=JetBrains+Mono:wght@400;500&display=swap";:root{--bg: #f3f4f6;--surface: #ffffff;--surface-2: #f8fafc;--surface-3: #eef1f5;--rail: #1e293b;--rail-hover: #334155;--rail-active: #2563eb;--text: #1e293b;--text-muted: #64748b;--text-inverse: #f8fafc;--border: #e2e8f0;--border-strong: #cbd5e1;--brand: #2563eb;--brand-hover: #1d4ed8;--brand-soft: #dbeafe;--danger: #dc2626;--danger-soft: #fee2e2;--success: #16a34a;--signal-online: #22c55e;--signal-away: #f59e0b;--signal-busy: #ef4444;--signal-offline: #94a3b8;--bubble-own: #2563eb;--bubble-own-text: #ffffff;--bubble-other: #eef1f5;--bubble-other-text: #1e293b;--shadow-sm: 0 1px 2px rgba(15,23,42,.06);--shadow-md: 0 4px 12px rgba(15,23,42,.08);--shadow-lg: 0 12px 32px rgba(15,23,42,.16);--font-ui: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--font-mono: "JetBrains Mono", ui-monospace, monospace;--radius: 8px}[data-theme=dark]{--bg: #0f172a;--surface: #1e293b;--surface-2: #172033;--surface-3: #263449;--rail: #0b1220;--rail-hover: #1e293b;--rail-active: #2563eb;--text: #e2e8f0;--text-muted: #94a3b8;--text-inverse: #f8fafc;--border: #334155;--border-strong: #475569;--brand: #3b82f6;--brand-hover: #60a5fa;--brand-soft: #1e3a8a;--bubble-other: #263449;--bubble-other-text: #e2e8f0}*{box-sizing:border-box}html,body,#root{height:100%}body{margin:0;font-family:var(--font-ui);background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased}button:focus-visible,input:focus-visible,[tabindex]:focus-visible{outline:2px solid var(--brand);outline-offset:2px}.app-shell{display:flex;height:100vh;overflow:hidden}.teams-rail{width:68px;background:var(--rail);flex-shrink:0;display:flex;flex-direction:column;align-items:center;padding:12px 0;gap:6px}.teams-rail-logo{margin-bottom:10px}.team-icon{width:44px;height:44px;border-radius:12px;display:flex;align-items:center;justify-content:center;background:var(--rail-hover);color:var(--text-inverse);font-weight:700;font-size:15px;cursor:pointer;position:relative;transition:border-radius .15s,background .15s}.team-icon:hover{border-radius:14px;background:#3f4d63}.team-icon.active{background:var(--rail-active);border-radius:14px}.team-icon.active:before{content:"";position:absolute;left:-12px;top:50%;transform:translateY(-50%);width:4px;height:24px;background:#fff;border-radius:0 4px 4px 0}.teams-rail-spacer{flex:1}.teams-rail-btn{width:44px;height:44px;border-radius:12px;background:transparent;color:#94a3b8;display:flex;align-items:center;justify-content:center;padding:0}.teams-rail-btn:hover{background:var(--rail-hover);color:#fff}.list-pane{width:300px;background:var(--surface);flex-shrink:0;border-right:1px solid var(--border);display:flex;flex-direction:column}.list-pane-header{padding:16px 18px 12px;border-bottom:1px solid var(--border)}.list-pane-header h1{font-size:18px;margin:0 0 2px;letter-spacing:-.01em}.list-pane-header .subtitle{font-size:12px;color:var(--text-muted)}.list-search{margin:12px 14px;position:relative}.list-search input{width:100%;padding:8px 12px 8px 34px;border-radius:var(--radius);border:1px solid var(--border);background:var(--surface-2);color:var(--text);font-size:13px;font-family:var(--font-ui)}.list-search svg{position:absolute;left:10px;top:50%;transform:translateY(-50%);color:var(--text-muted)}.list-section-label{padding:10px 18px 4px;font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.06em;color:var(--text-muted);display:flex;align-items:center;justify-content:space-between}.list-section-label button{background:transparent;color:var(--text-muted);padding:2px;border-radius:4px}.list-section-label button:hover{background:var(--surface-3);color:var(--text)}.channel-scroll{flex:1;overflow-y:auto;padding-bottom:12px}.channel-item{padding:8px 14px;margin:1px 8px;cursor:pointer;display:flex;align-items:center;gap:10px;border-radius:var(--radius);position:relative}.channel-item:hover{background:var(--surface-3)}.channel-item.active{background:var(--brand-soft)}.channel-item.active .channel-name{color:var(--brand);font-weight:600}.channel-hash{color:var(--text-muted);font-size:15px;width:18px;text-align:center;flex-shrink:0}.channel-item-text{flex:1;min-width:0}.channel-name{font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.channel-preview{font-size:12px;color:var(--text-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.channel-unread-dot{width:8px;height:8px;border-radius:50%;background:var(--brand);flex-shrink:0}.channel-menu-btn{opacity:0;padding:4px;border-radius:6px;background:transparent;color:var(--text-muted)}.channel-item:hover .channel-menu-btn{opacity:.8}.channel-menu-btn:hover{opacity:1!important;background:var(--surface)}.pin-indicator{color:var(--brand);flex-shrink:0}.list-pane-footer{border-top:1px solid var(--border);padding:10px 14px;display:flex;align-items:center;gap:10px}.list-pane-footer .who{flex:1;min-width:0}.list-pane-footer .who .name{font-size:13px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.list-pane-footer .who .status{font-size:11px;color:var(--text-muted)}.footer-actions{display:flex;gap:2px}.presence-dot{width:10px;height:10px;border-radius:50%;display:inline-block;flex-shrink:0;background:var(--signal-offline);border:2px solid var(--surface);box-sizing:content-box}.presence-dot.online{background:var(--signal-online);box-shadow:0 0 6px color-mix(in srgb,var(--signal-online) 80%,transparent)}.presence-dot.away{background:var(--signal-away);box-shadow:0 0 6px color-mix(in srgb,var(--signal-away) 80%,transparent)}.presence-dot.busy{background:var(--signal-busy);box-shadow:0 0 6px color-mix(in srgb,var(--signal-busy) 80%,transparent)}.presence-dot.offline,.presence-dot.invisible{background:var(--signal-offline)}.avatar{border-radius:50%;flex-shrink:0;display:flex;align-items:center;justify-content:center;font-weight:600;color:#fff;font-size:12px}.avatar-wrap{position:relative;display:inline-flex}.avatar-wrap .presence-dot{position:absolute;bottom:-1px;right:-1px}.content-pane{flex:1;display:flex;flex-direction:column;min-width:0;background:var(--bg)}.content-header{height:60px;padding:0 20px;border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;background:var(--surface)}.content-header-title{display:flex;align-items:center;gap:12px}.content-header-title .title{font-weight:600;font-size:16px}.content-header-title .sub{font-size:12px;color:var(--text-muted)}.content-header-actions{display:flex;gap:4px}.icon-btn{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:var(--radius);background:transparent;color:var(--text-muted);padding:0;border:none;cursor:pointer}.icon-btn:hover{background:var(--surface-3);color:var(--text)}.icon-btn.danger:hover{background:var(--danger-soft);color:var(--danger)}.icon-btn.primary{background:var(--brand);color:#fff}.icon-btn.primary:hover{background:var(--brand-hover)}.message-thread{flex:1;overflow-y:auto;padding:20px;display:flex;flex-direction:column;gap:2px}.thread-empty{margin:auto;text-align:center;color:var(--text-muted)}.thread-empty h2{color:var(--text);font-size:18px;margin-bottom:6px}.message-row{display:flex;gap:10px;max-width:74%;margin-top:6px}.message-row.own{align-self:flex-end;flex-direction:row-reverse}.message-row.other{align-self:flex-start}.message-row.grouped{margin-top:1px}.message-bubble-col{display:flex;flex-direction:column;gap:3px;min-width:0}.message-row.own .message-bubble-col{align-items:flex-end}.message-sender-label{font-size:12px;font-weight:600;color:var(--text-muted)}.message-bubble{padding:9px 13px;border-radius:14px;font-size:14px;line-height:1.45;white-space:pre-wrap;word-break:break-word;box-shadow:var(--shadow-sm)}.message-row.own .message-bubble{background:var(--bubble-own);color:var(--bubble-own-text);border-bottom-right-radius:4px}.message-row.other .message-bubble{background:var(--bubble-other);color:var(--bubble-other-text);border-bottom-left-radius:4px}.message-meta{display:flex;align-items:center;gap:6px;font-family:var(--font-mono);font-size:10px;color:var(--text-muted)}.message-row.own .message-meta{flex-direction:row-reverse}.message-attachment{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:10px;background:var(--surface);border:1px solid var(--border);font-size:13px;text-decoration:none;color:inherit}.message-attachment:hover{background:var(--surface-2)}.message-image{max-width:280px;max-height:320px;border-radius:12px;display:block;object-fit:cover;cursor:pointer}.read-by-btn{background:transparent;color:var(--text-muted);padding:0 2px;width:18px;height:16px;display:inline-flex;align-items:center;justify-content:center}.read-by-btn:hover{color:var(--text);background:transparent}.read-by-list{background:var(--surface);border:1px solid var(--border);border-radius:10px;box-shadow:var(--shadow-md);padding:10px 12px;margin-top:4px;max-width:240px}.reaction-row{display:flex;gap:4px;flex-wrap:wrap;margin-top:3px;align-items:center}.reaction-chip{display:inline-flex;align-items:center;gap:4px;padding:2px 8px;border-radius:12px;background:var(--surface);border:1px solid var(--border);font-size:12px;cursor:pointer}.reaction-chip.mine{border-color:var(--brand);background:var(--brand-soft);color:var(--brand)}.reaction-add-btn{padding:2px 7px;border-radius:12px;background:transparent;color:var(--text-muted);border:1px solid var(--border);cursor:pointer}.reaction-add-btn:hover{background:var(--surface-3)}.typing-indicator-row{align-self:flex-start;margin-top:4px}.typing-bubble{background:var(--bubble-other);border-radius:14px 14px 14px 4px;padding:11px 14px;display:inline-flex;gap:4px}.typing-dot{width:6px;height:6px;border-radius:50%;background:var(--text-muted);animation:tb 1.2s infinite ease-in-out}.typing-dot:nth-child(2){animation-delay:.15s}.typing-dot:nth-child(3){animation-delay:.3s}@keyframes tb{0%,60%,to{transform:translateY(0);opacity:.5}30%{transform:translateY(-4px);opacity:1}}@media (prefers-reduced-motion: reduce){.typing-dot{animation:none}}.composer{border-top:1px solid var(--border);padding:12px 16px 14px;background:var(--surface);position:relative}.composer-box{display:flex;align-items:center;gap:4px;border:1px solid var(--border-strong);border-radius:12px;background:var(--surface-2);padding:4px 6px;transition:border-color .15s,box-shadow .15s}.composer-box:focus-within{border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-soft);background:var(--surface)}.composer-box input{flex:1;border:none;background:transparent;outline:none;padding:9px 8px;color:var(--text);font-family:var(--font-ui);font-size:14px}.composer-box .icon-btn{width:34px;height:34px}.composer-send{width:34px;height:34px;border-radius:8px;background:var(--brand);color:#fff;display:flex;align-items:center;justify-content:center;padding:0;flex-shrink:0}.composer-send:hover{background:var(--brand-hover)}.composer-send:disabled{background:var(--border-strong);color:var(--text-muted);cursor:not-allowed}.mention-picker{position:absolute;bottom:60px;left:16px;z-index:500;min-width:220px;background:var(--surface);border:1px solid var(--border);border-radius:10px;box-shadow:var(--shadow-md);padding:5px;display:flex;flex-direction:column}.mention-item{display:flex;align-items:center;gap:9px;padding:7px 9px;border-radius:6px;cursor:pointer;font-size:14px}.mention-item:hover{background:var(--surface-3)}.mention-token{color:var(--brand);font-weight:600;background:var(--brand-soft);padding:0 3px;border-radius:4px}.unread-badge{min-width:18px;height:18px;padding:0 5px;border-radius:9px;background:var(--brand);color:#fff;font-size:11px;font-weight:700;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0}.team-icon .unread-badge{position:absolute;top:-3px;right:-3px;border:2px solid var(--rail)}button{cursor:pointer;border:none;border-radius:var(--radius);padding:9px 16px;background:var(--brand);color:#fff;font-weight:600;font-family:var(--font-ui);font-size:14px;display:inline-flex;align-items:center;gap:6px}button:hover{background:var(--brand-hover)}button.secondary{background:var(--surface-3);color:var(--text)}button.secondary:hover{background:var(--border)}button:disabled{opacity:.5;cursor:not-allowed}.auth-page{display:flex;align-items:center;justify-content:center;min-height:100vh;background:linear-gradient(135deg,#1e293b,#2563eb);padding:20px}.auth-card{width:400px;max-width:100%;padding:36px;border-radius:16px;background:var(--surface);box-shadow:var(--shadow-lg)}.auth-card .auth-logo{display:flex;justify-content:center;margin-bottom:20px}.auth-card h2{text-align:center;margin:0 0 24px}.auth-card input{width:100%;padding:12px 14px;margin-bottom:12px;border-radius:10px;border:1px solid var(--border);background:var(--surface-2);color:var(--text);font-size:14px}.auth-card .error{color:var(--danger);font-size:13px;margin-bottom:12px;padding:10px 12px;background:var(--danger-soft);border-radius:8px}.auth-card button[type=submit]{width:100%;justify-content:center;padding:12px}.auth-tabs{display:flex;gap:8px;margin-bottom:20px}.auth-tabs button{flex:1;justify-content:center}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#0f172a80;display:flex;align-items:center;justify-content:center;z-index:1000;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);padding:20px}.modal-card{background:var(--surface);border-radius:14px;padding:24px;width:420px;max-width:100%;box-shadow:var(--shadow-lg)}.modal-card h3{margin-top:0}.modal-card input,.modal-card select{width:100%;padding:10px 12px;border-radius:8px;border:1px solid var(--border);background:var(--surface-2);color:var(--text);font-size:14px;margin-bottom:12px}.modal-actions{display:flex;gap:8px;justify-content:flex-end;margin-top:8px}.dropdown-menu{position:absolute;z-index:500;min-width:170px;background:var(--surface);border:1px solid var(--border);border-radius:10px;box-shadow:var(--shadow-md);padding:5px;display:flex;flex-direction:column}.dropdown-item{display:flex;align-items:center;gap:9px;padding:9px 11px;border-radius:6px;background:transparent;color:var(--text);font-weight:400;font-size:13px;text-align:left;justify-content:flex-start}.dropdown-item:hover{background:var(--surface-3)}.dropdown-item.danger{color:var(--danger)}.dropdown-item.danger:hover{background:var(--danger-soft)}.search-results{max-height:300px;overflow-y:auto;margin-top:4px}.search-result-row{display:flex;align-items:center;gap:10px;padding:9px;border-radius:8px;cursor:pointer}.search-result-row:hover{background:var(--surface-3)}.emoji-picker{position:absolute;bottom:58px;left:12px;z-index:500;background:var(--surface);border:1px solid var(--border);border-radius:12px;box-shadow:var(--shadow-md);padding:10px;width:300px;display:grid;grid-template-columns:repeat(8,1fr);gap:4px}.emoji-picker button{padding:5px;font-size:18px;background:transparent;border-radius:6px}.emoji-picker button:hover{background:var(--surface-3)}.admin-page{max-width:960px;margin:0 auto;padding:32px 24px;width:100%;overflow-y:auto}.admin-section{margin-bottom:32px;background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:20px}.admin-table{width:100%;border-collapse:collapse;font-size:14px}.admin-table th{text-align:left;padding:8px 10px;color:var(--text-muted);font-size:11px;text-transform:uppercase;letter-spacing:.05em;border-bottom:1px solid var(--border)}.admin-table td{padding:10px;border-bottom:1px solid var(--border)}.role-badge{font-family:var(--font-mono);font-size:11px;padding:2px 8px;border-radius:6px;background:var(--surface-3);text-transform:uppercase}.role-badge.admin{background:var(--danger-soft);color:var(--danger)}.role-badge.internal{background:var(--brand-soft);color:var(--brand)}.call-room{flex:1;display:flex;flex-direction:column;background:#0b1220;position:relative;overflow:hidden}.call-stage{flex:1;display:flex;align-items:stretch;justify-content:center;padding:16px;overflow:hidden;min-height:0}.call-grid{display:grid;gap:12px;width:100%;height:100%;align-content:stretch;justify-items:stretch}.call-tile{position:relative;background:#1a2334;border-radius:12px;overflow:hidden;min-height:0;min-width:0}.call-tile video{width:100%;height:100%;object-fit:cover;display:block}.call-tile.no-video{display:flex;align-items:center;justify-content:center}.call-tile-label{position:absolute;bottom:8px;left:10px;font-size:12px;color:#fff;background:#0000008c;padding:3px 9px;border-radius:6px;z-index:2}.call-tile-waiting{color:#64748b;text-align:center}.call-tile-waiting .big{font-size:18px;color:#94a3b8;margin-bottom:4px}.call-stage.has-share{display:grid;grid-template-columns:1fr 220px;gap:12px}.call-stage.has-share .call-share{min-height:0}.call-stage.has-share .call-filmstrip{display:flex;flex-direction:column;gap:10px;overflow-y:auto}.call-stage.has-share .call-filmstrip .call-tile{aspect-ratio:16/9;flex-shrink:0}@media (max-width: 700px){.call-stage.has-share{grid-template-columns:1fr;grid-template-rows:1fr 90px}.call-stage.has-share .call-filmstrip{flex-direction:row}.call-stage.has-share .call-filmstrip .call-tile{height:100%;width:auto}}.call-controls{display:flex;gap:10px;justify-content:center;padding:18px;background:#131c2e}.call-ctrl{width:48px;height:48px;border-radius:50%;background:#263449;color:#fff;display:flex;align-items:center;justify-content:center;padding:0}.call-ctrl:hover{background:#34455f}.call-ctrl.active{background:var(--brand)}.call-ctrl.hangup{background:var(--danger)}.call-ctrl.hangup:hover{background:#b91c1c}.unmute-banner{position:absolute;top:14px;left:50%;transform:translate(-50%);background:var(--brand);color:#fff;padding:9px 16px;border-radius:8px;font-size:13px;font-weight:600;z-index:20;cursor:pointer;border:none}.mobile-back-btn{display:none}@media (max-width: 820px){.app-shell{height:100vh;height:100dvh}.teams-rail{width:56px}.list-pane{width:100%;position:absolute;top:0;right:0;bottom:0;left:56px;z-index:20}.app-shell.viewing-content .list-pane{display:none}.content-pane{position:absolute;top:0;right:0;bottom:0;left:0;z-index:30}.app-shell:not(.viewing-content) .content-pane{display:none}.mobile-back-btn{display:inline-flex}.message-row{max-width:88%}.emoji-picker{width:calc(100vw - 40px)}.composer-box input,.auth-card input,.modal-card input,.modal-card select,.list-search input{font-size:16px}.composer{padding-bottom:calc(14px + env(safe-area-inset-bottom))}}@media (max-width: 480px){.teams-rail{width:100%;height:calc(56px + env(safe-area-inset-bottom));padding:0 10px env(safe-area-inset-bottom);flex-direction:row;position:absolute;bottom:0;top:auto;z-index:40;align-items:center}.teams-rail-logo,.teams-rail-spacer{display:none}.teams-rail{gap:4px;overflow-x:auto}.team-icon{width:40px;height:40px;flex-shrink:0}.list-pane,.content-pane{inset:0 0 calc(56px + env(safe-area-inset-bottom)) 0}.composer{padding-bottom:12px}.modal-card{width:100%}.call-controls{padding-bottom:calc(18px + env(safe-area-inset-bottom))}}
