Spaces:
Sleeping
Sleeping
| :root{ | |
| --bg:#070b16; | |
| --panel:rgba(15, 23, 42, 0.82); | |
| --panel-border:rgba(148, 163, 184, 0.18); | |
| --text:#e5eefb; | |
| --muted:#94a3b8; | |
| --primary:#7c3aed; | |
| --accent:#22c55e; | |
| --accent-soft:rgba(34, 197, 94, 0.16); | |
| --danger:#fb7185; | |
| --shadow:0 24px 70px rgba(2, 6, 23, 0.45); | |
| --radius-xl:24px; | |
| } | |
| *{ | |
| box-sizing:border-box; | |
| } | |
| html, | |
| body{ | |
| margin:0; | |
| min-height:100%; | |
| font-family:Inter, Arial, sans-serif; | |
| background: | |
| radial-gradient(circle at top left, rgba(124, 58, 237, 0.25), transparent 28%), | |
| radial-gradient(circle at top right, rgba(56, 189, 248, 0.16), transparent 24%), | |
| linear-gradient(180deg, #040816 0%, #0a1020 100%); | |
| color:var(--text); | |
| } | |
| body{ | |
| min-height:100vh; | |
| } | |
| button, | |
| input{ | |
| font:inherit; | |
| } | |
| button{ | |
| border:none; | |
| cursor:pointer; | |
| transition:transform 0.2s ease, box-shadow 0.2s ease, background 0.2s ease; | |
| } | |
| button:hover{ | |
| transform:translateY(-1px); | |
| } | |
| input{ | |
| width:100%; | |
| padding:14px 16px; | |
| border-radius:14px; | |
| border:1px solid rgba(148, 163, 184, 0.15); | |
| background:rgba(15, 23, 42, 0.9); | |
| color:var(--text); | |
| outline:none; | |
| } | |
| input:focus{ | |
| border-color:rgba(56, 189, 248, 0.45); | |
| box-shadow:0 0 0 4px rgba(56, 189, 248, 0.12); | |
| } | |
| .auth-page{ | |
| display:flex; | |
| align-items:center; | |
| justify-content:center; | |
| padding:32px; | |
| } | |
| .auth-shell{ | |
| width:min(1180px, 100%); | |
| display:grid; | |
| grid-template-columns:1.3fr 0.9fr; | |
| gap:24px; | |
| align-items:stretch; | |
| } | |
| .glass-panel{ | |
| background:var(--panel); | |
| backdrop-filter:blur(16px); | |
| border:1px solid var(--panel-border); | |
| box-shadow:var(--shadow); | |
| border-radius:var(--radius-xl); | |
| } | |
| .auth-hero, | |
| .login-container, | |
| .topbar, | |
| .hero-banner, | |
| .chat-panel, | |
| .card-section, | |
| .sidebar, | |
| .profile-drawer{ | |
| padding:22px; | |
| } | |
| .auth-hero, | |
| .login-container{ | |
| padding:40px; | |
| } | |
| .auth-hero{ | |
| display:flex; | |
| flex-direction:column; | |
| justify-content:space-between; | |
| min-height:540px; | |
| } | |
| .brand-badge{ | |
| display:inline-flex; | |
| align-items:center; | |
| gap:8px; | |
| padding:8px 12px; | |
| border-radius:999px; | |
| background:rgba(255, 255, 255, 0.06); | |
| border:1px solid rgba(255, 255, 255, 0.08); | |
| color:#dbeafe; | |
| font-size:0.85rem; | |
| letter-spacing:0.03em; | |
| } | |
| .auth-hero h1, | |
| .section-heading h2, | |
| .hero-banner h3, | |
| .topbar h2, | |
| .sidebar-title{ | |
| margin:0; | |
| } | |
| .auth-hero h1{ | |
| font-size:clamp(2.4rem, 4vw, 4.3rem); | |
| line-height:1.05; | |
| max-width:12ch; | |
| margin-top:18px; | |
| } | |
| .auth-hero p, | |
| .hero-copy, | |
| .section-heading p, | |
| .muted-text, | |
| .sidebar-item small, | |
| .empty-state, | |
| .empty-chat-state p, | |
| .message-sources-label, | |
| .input-label, | |
| .metric-label, | |
| .stat-label, | |
| .table-meta, | |
| .analytics-kicker, | |
| .profile-meta, | |
| .auth-footer, | |
| .pill, | |
| .eyebrow, | |
| .loading-pill, | |
| #error, | |
| .profile-button small{ | |
| color:var(--muted); | |
| } | |
| .auth-hero > p{ | |
| max-width:58ch; | |
| font-size:1.02rem; | |
| line-height:1.7; | |
| } | |
| .hero-metrics, | |
| .hero-stats, | |
| .admin-grid{ | |
| display:grid; | |
| gap:16px; | |
| } | |
| .hero-metrics{ | |
| grid-template-columns:repeat(3, minmax(0, 1fr)); | |
| margin-top:28px; | |
| } | |
| .metric-card, | |
| .stat-card{ | |
| padding:18px; | |
| border-radius:18px; | |
| background:rgba(255, 255, 255, 0.04); | |
| border:1px solid rgba(255, 255, 255, 0.06); | |
| } | |
| .metric-value, | |
| .stat-card strong{ | |
| display:block; | |
| font-size:1.2rem; | |
| font-weight:700; | |
| color:#f8fafc; | |
| margin-bottom:6px; | |
| } | |
| .login-container{ | |
| display:flex; | |
| flex-direction:column; | |
| justify-content:center; | |
| gap:20px; | |
| } | |
| .section-heading.compact h2{ | |
| font-size:2rem; | |
| margin-top:8px; | |
| } | |
| .eyebrow{ | |
| display:block; | |
| margin-bottom:8px; | |
| font-size:0.76rem; | |
| font-weight:700; | |
| text-transform:uppercase; | |
| letter-spacing:0.1em; | |
| } | |
| .form-stack{ | |
| display:flex; | |
| flex-direction:column; | |
| gap:8px; | |
| } | |
| .input-label{ | |
| font-size:0.92rem; | |
| } | |
| .primary-btn, | |
| .ghost-btn, | |
| .profile-button, | |
| .danger-btn{ | |
| border-radius:14px; | |
| padding:13px 18px; | |
| } | |
| .primary-btn{ | |
| background:linear-gradient(135deg, #7c3aed, #2563eb); | |
| color:white; | |
| box-shadow:0 12px 28px rgba(79, 70, 229, 0.35); | |
| } | |
| .ghost-btn{ | |
| background:rgba(255, 255, 255, 0.05); | |
| color:var(--text); | |
| border:1px solid rgba(255, 255, 255, 0.08); | |
| } | |
| .ghost-btn.small{ | |
| padding:10px 14px; | |
| font-size:0.92rem; | |
| } | |
| .danger-btn{ | |
| background:rgba(251, 113, 133, 0.14); | |
| color:#fecdd3; | |
| border:1px solid rgba(251, 113, 133, 0.24); | |
| padding:10px 14px; | |
| } | |
| .auth-footer{ | |
| display:flex; | |
| align-items:center; | |
| gap:10px; | |
| font-size:0.92rem; | |
| } | |
| .status-dot{ | |
| width:10px; | |
| height:10px; | |
| border-radius:50%; | |
| background:var(--accent); | |
| box-shadow:0 0 0 6px rgba(34, 197, 94, 0.15); | |
| } | |
| .error-text{ | |
| min-height:22px; | |
| margin:0; | |
| color:#fca5a5 ; | |
| } | |
| .dashboard-page{ | |
| padding:14px; | |
| font-size:14px; | |
| } | |
| .dashboard-page .topbar, | |
| .dashboard-page .hero-banner, | |
| .dashboard-page .chat-panel, | |
| .dashboard-page .card-section, | |
| .dashboard-page .sidebar{ | |
| padding:14px; | |
| } | |
| .dashboard-page .stat-card, | |
| .dashboard-page .metric-card{ | |
| padding:12px; | |
| } | |
| .dashboard-page .stat-card strong, | |
| .dashboard-page .metric-value{ | |
| font-size:1.05rem; | |
| } | |
| .dashboard-shell{ | |
| display:grid; | |
| grid-template-columns:280px minmax(0, 1fr); | |
| gap:14px; | |
| min-height:calc(100vh - 28px); | |
| } | |
| .sidebar{ | |
| display:flex; | |
| flex-direction:column; | |
| gap:12px; | |
| position:sticky; | |
| top:14px; | |
| max-height:calc(100vh - 28px); | |
| overflow:hidden; | |
| } | |
| .sidebar-top, | |
| .section-heading-row, | |
| .topbar, | |
| .topbar-actions, | |
| .drawer-header, | |
| .upload-box, | |
| .table-item, | |
| .analytics-list-item, | |
| .profile-summary{ | |
| display:flex; | |
| align-items:center; | |
| justify-content:space-between; | |
| gap:14px; | |
| } | |
| .sidebar-title{ | |
| font-size:1.05rem; | |
| margin-top:8px; | |
| } | |
| .sidebar-section{ | |
| display:flex; | |
| flex-direction:column; | |
| gap:12px; | |
| min-height:0; | |
| } | |
| .sidebar-section h3, | |
| .section-heading-row h3, | |
| .drawer-header h3, | |
| .empty-chat-state h4, | |
| .analytics-block h4{ | |
| margin:0; | |
| } | |
| .pill, | |
| .loading-pill, | |
| .profile-badge{ | |
| display:inline-flex; | |
| align-items:center; | |
| justify-content:center; | |
| padding:7px 10px; | |
| border-radius:999px; | |
| background:rgba(255, 255, 255, 0.06); | |
| border:1px solid rgba(255, 255, 255, 0.08); | |
| font-size:0.82rem; | |
| } | |
| .pill.accent{ | |
| color:#bbf7d0; | |
| background:var(--accent-soft); | |
| border-color:rgba(34, 197, 94, 0.22); | |
| } | |
| .stack-list, | |
| .table-list, | |
| .analytics-panel, | |
| .profile-content{ | |
| display:flex; | |
| flex-direction:column; | |
| gap:8px; | |
| } | |
| .stack-list{ | |
| overflow:auto; | |
| padding-right:6px; | |
| } | |
| .sidebar-item, | |
| .table-item, | |
| .analytics-block, | |
| .profile-card, | |
| .message-sources, | |
| .result-source-chip{ | |
| border-radius:16px; | |
| background:rgba(255, 255, 255, 0.04); | |
| border:1px solid rgba(255, 255, 255, 0.07); | |
| } | |
| .sidebar-item, | |
| .table-item, | |
| .analytics-block, | |
| .profile-card{ | |
| padding:10px; | |
| } | |
| .sidebar-item strong, | |
| .table-item strong, | |
| .profile-card strong{ | |
| display:block; | |
| margin-bottom:6px; | |
| } | |
| .workspace-main{ | |
| display:flex; | |
| flex-direction:column; | |
| gap:12px; | |
| min-width:0; | |
| } | |
| .profile-button{ | |
| display:flex; | |
| align-items:center; | |
| gap:12px; | |
| background:rgba(255, 255, 255, 0.05); | |
| color:var(--text); | |
| border:1px solid rgba(255, 255, 255, 0.08); | |
| } | |
| .profile-button strong, | |
| .profile-button small{ | |
| display:block; | |
| text-align:left; | |
| } | |
| .profile-avatar{ | |
| width:36px; | |
| height:36px; | |
| display:inline-flex; | |
| align-items:center; | |
| justify-content:center; | |
| border-radius:11px; | |
| background:linear-gradient(135deg, rgba(124, 58, 237, 0.75), rgba(37, 99, 235, 0.85)); | |
| color:white; | |
| font-weight:700; | |
| } | |
| .hero-banner{ | |
| display:grid; | |
| grid-template-columns:minmax(0, 1.4fr) minmax(300px, 0.9fr); | |
| gap:12px; | |
| } | |
| .compact-hero{ | |
| grid-template-columns:minmax(0, 1.2fr) minmax(0, 1fr); | |
| } | |
| .hero-stats{ | |
| grid-template-columns:repeat(3, minmax(0, 1fr)); | |
| } | |
| .stats-grid-4{ | |
| grid-template-columns:repeat(4, minmax(0, 1fr)); | |
| } | |
| .chat-panel{ | |
| display:flex; | |
| flex-direction:column; | |
| gap:12px; | |
| min-height:0; | |
| flex:1; | |
| } | |
| .chat-box{ | |
| flex:1; | |
| min-height:320px; | |
| max-height:calc(100vh - 255px); | |
| overflow-y:auto; | |
| padding:4px; | |
| display:flex; | |
| flex-direction:column; | |
| gap:10px; | |
| } | |
| .empty-chat-state{ | |
| margin:auto; | |
| text-align:center; | |
| padding:36px 18px; | |
| max-width:460px; | |
| } | |
| .message{ | |
| max-width:min(84%, 760px); | |
| padding:12px 14px; | |
| border-radius:20px; | |
| line-height:1.45; | |
| white-space:pre-wrap; | |
| box-shadow:0 12px 24px rgba(2, 6, 23, 0.18); | |
| display:block; | |
| } | |
| .user-msg{ | |
| align-self:flex-end; | |
| background:linear-gradient(135deg, rgba(59, 130, 246, 0.95), rgba(124, 58, 237, 0.92)); | |
| color:white; | |
| border-bottom-right-radius:8px; | |
| } | |
| .ai-msg{ | |
| align-self:flex-start; | |
| background:rgba(15, 23, 42, 0.95); | |
| border:1px solid rgba(148, 163, 184, 0.16); | |
| border-bottom-left-radius:8px; | |
| color:var(--text); | |
| } | |
| .message-body{ | |
| display:block; | |
| color:inherit; | |
| overflow-wrap:anywhere; | |
| } | |
| .message-header{ | |
| display:flex; | |
| align-items:center; | |
| justify-content:space-between; | |
| gap:12px; | |
| margin-bottom:6px; | |
| font-size:0.78rem; | |
| color:#cbd5e1; | |
| } | |
| .input-area{ | |
| display:flex; | |
| gap:8px; | |
| } | |
| .input-area input{ | |
| flex:1; | |
| padding:11px 12px; | |
| } | |
| .message-sources{ | |
| margin-top:14px; | |
| padding:14px; | |
| } | |
| .match-metrics{ | |
| margin-top:12px; | |
| display:flex; | |
| flex-wrap:wrap; | |
| gap:8px; | |
| } | |
| .metric-pill{ | |
| display:inline-flex; | |
| align-items:center; | |
| padding:7px 10px; | |
| border-radius:999px; | |
| background:rgba(56, 189, 248, 0.12); | |
| border:1px solid rgba(56, 189, 248, 0.24); | |
| color:#bae6fd; | |
| font-size:0.82rem; | |
| } | |
| .source-chip-wrap, | |
| .profile-badges, | |
| .quick-actions{ | |
| display:flex; | |
| flex-wrap:wrap; | |
| gap:10px; | |
| } | |
| .result-source-chip{ | |
| padding:9px 12px; | |
| font-size:0.86rem; | |
| color:#dbeafe; | |
| display:inline-flex; | |
| align-items:center; | |
| gap:8px; | |
| } | |
| .admin-grid{ | |
| grid-template-columns:repeat(2, minmax(0, 1fr)); | |
| } | |
| .analytics-block p{ | |
| margin:0 0 10px; | |
| } | |
| .analytics-list-item{ | |
| padding:10px 0; | |
| border-top:1px solid rgba(255, 255, 255, 0.06); | |
| } | |
| .analytics-list-item:first-child{ | |
| border-top:none; | |
| padding-top:0; | |
| } | |
| .table-item-content{ | |
| min-width:0; | |
| } | |
| .table-item strong, | |
| .sidebar-item strong{ | |
| overflow-wrap:anywhere; | |
| } | |
| .drawer-overlay{ | |
| position:fixed; | |
| inset:0; | |
| background:rgba(2, 6, 23, 0.55); | |
| backdrop-filter:blur(4px); | |
| opacity:0; | |
| visibility:hidden; | |
| transition:opacity 0.2s ease, visibility 0.2s ease; | |
| z-index:30; | |
| } | |
| .profile-drawer{ | |
| position:fixed; | |
| top:24px; | |
| right:24px; | |
| width:min(420px, calc(100vw - 32px)); | |
| height:calc(100vh - 48px); | |
| transform:translateX(110%); | |
| transition:transform 0.24s ease; | |
| z-index:31; | |
| overflow:auto; | |
| } | |
| .drawer-open .drawer-overlay{ | |
| opacity:1; | |
| visibility:visible; | |
| } | |
| .drawer-open .profile-drawer{ | |
| transform:translateX(0); | |
| } | |
| .profile-content{ | |
| margin-top:18px; | |
| } | |
| .profile-card{ | |
| display:flex; | |
| flex-direction:column; | |
| gap:10px; | |
| } | |
| .profile-meta{ | |
| font-size:0.92rem; | |
| line-height:1.6; | |
| } | |
| .empty-state{ | |
| padding:18px; | |
| border-radius:16px; | |
| background:rgba(255, 255, 255, 0.04); | |
| border:1px dashed rgba(148, 163, 184, 0.16); | |
| text-align:center; | |
| } | |
| .table-meta{ | |
| display:block; | |
| line-height:1.5; | |
| } | |
| @media (max-width: 1180px){ | |
| .auth-shell, | |
| .hero-banner, | |
| .compact-hero, | |
| .dashboard-shell, | |
| .admin-grid{ | |
| grid-template-columns:1fr; | |
| } | |
| .sidebar{ | |
| position:relative; | |
| top:auto; | |
| max-height:none; | |
| } | |
| .chat-box{ | |
| max-height:none; | |
| } | |
| } | |
| @media (max-width: 760px){ | |
| .auth-page, | |
| .dashboard-page{ | |
| padding:16px; | |
| } | |
| .auth-hero, | |
| .login-container, | |
| .topbar, | |
| .hero-banner, | |
| .chat-panel, | |
| .card-section, | |
| .sidebar, | |
| .profile-drawer{ | |
| padding:18px; | |
| } | |
| .hero-metrics, | |
| .hero-stats, | |
| .stats-grid-4, | |
| .input-area, | |
| .topbar, | |
| .topbar-actions, | |
| .table-item, | |
| .upload-box, | |
| .section-heading-row, | |
| .drawer-header{ | |
| flex-direction:column; | |
| align-items:stretch; | |
| } | |
| .message{ | |
| max-width:100%; | |
| } | |
| } | |
| /* ---------- Clean dashboard refresh (keeps all existing features) ---------- */ | |
| .dashboard-page{ | |
| font-size:13.5px; | |
| background: | |
| radial-gradient(circle at 8% 0%, rgba(56, 189, 248, 0.08), transparent 30%), | |
| radial-gradient(circle at 100% 0%, rgba(124, 58, 237, 0.10), transparent 28%), | |
| linear-gradient(180deg, #060b18 0%, #0a1224 100%); | |
| } | |
| .dashboard-shell{ | |
| grid-template-columns:270px minmax(0, 1fr); | |
| gap:12px; | |
| } | |
| .dashboard-page .glass-panel{ | |
| border-radius:18px; | |
| border:1px solid rgba(148, 163, 184, 0.12); | |
| background:linear-gradient(180deg, rgba(10, 18, 40, 0.88), rgba(10, 17, 35, 0.84)); | |
| box-shadow:0 10px 30px rgba(2, 6, 23, 0.22); | |
| } | |
| .dashboard-page .sidebar, | |
| .dashboard-page .topbar, | |
| .dashboard-page .hero-banner, | |
| .dashboard-page .chat-panel, | |
| .dashboard-page .card-section{ | |
| padding:12px; | |
| } | |
| .sidebar{ | |
| gap:10px; | |
| } | |
| .sidebar-title{ | |
| font-size:0.98rem; | |
| line-height:1.28; | |
| } | |
| .sidebar-section h3, | |
| .chat-panel h3, | |
| .section-heading-row h3{ | |
| font-size:0.95rem; | |
| font-weight:600; | |
| } | |
| .stack-list{ | |
| gap:6px; | |
| padding-right:3px; | |
| } | |
| .stack-list::-webkit-scrollbar, | |
| .chat-box::-webkit-scrollbar{ | |
| width:7px; | |
| } | |
| .stack-list::-webkit-scrollbar-thumb, | |
| .chat-box::-webkit-scrollbar-thumb{ | |
| background:rgba(148, 163, 184, 0.35); | |
| border-radius:999px; | |
| } | |
| .sidebar-item, | |
| .table-item, | |
| .profile-card, | |
| .analytics-block, | |
| .message-sources, | |
| .result-source-chip{ | |
| border-radius:12px; | |
| border:1px solid rgba(148, 163, 184, 0.12); | |
| background:rgba(148, 163, 184, 0.06); | |
| } | |
| .sidebar-item, | |
| .table-item, | |
| .profile-card, | |
| .analytics-block{ | |
| padding:9px 10px; | |
| } | |
| .sidebar-item strong, | |
| .table-item strong, | |
| .message-body{ | |
| font-size:0.96rem; | |
| line-height:1.4; | |
| } | |
| .table-meta, | |
| .sidebar-item small, | |
| .profile-meta, | |
| .eyebrow, | |
| .message-header, | |
| .metric-pill, | |
| .result-source-chip, | |
| .pill, | |
| .loading-pill{ | |
| font-size:0.78rem; | |
| } | |
| .hero-banner{ | |
| gap:10px; | |
| } | |
| .hero-copy{ | |
| line-height:1.45; | |
| max-width:64ch; | |
| } | |
| .hero-stats{ | |
| gap:10px; | |
| } | |
| .stat-card{ | |
| padding:10px; | |
| border-radius:12px; | |
| } | |
| .stat-card strong{ | |
| font-size:1.02rem; | |
| } | |
| .chat-panel{ | |
| gap:10px; | |
| } | |
| .chat-box{ | |
| min-height:360px; | |
| max-height:calc(100vh - 230px); | |
| padding:2px; | |
| gap:8px; | |
| } | |
| .message{ | |
| max-width:min(78%, 700px); | |
| padding:10px 12px; | |
| border-radius:14px; | |
| box-shadow:none; | |
| } | |
| .user-msg{ | |
| background:linear-gradient(135deg, rgba(79, 110, 220, 0.95), rgba(104, 74, 220, 0.93)); | |
| color:#f8fbff; | |
| } | |
| .ai-msg{ | |
| background:rgba(10, 22, 50, 0.92); | |
| } | |
| .message-header{ | |
| margin-bottom:5px; | |
| color:#aebbd2; | |
| } | |
| .match-metrics, | |
| .source-chip-wrap{ | |
| gap:6px; | |
| } | |
| .metric-pill{ | |
| padding:5px 8px; | |
| background:rgba(56, 189, 248, 0.10); | |
| border:1px solid rgba(56, 189, 248, 0.20); | |
| } | |
| .result-source-chip{ | |
| padding:6px 8px; | |
| } | |
| .input-area{ | |
| gap:8px; | |
| position:sticky; | |
| bottom:0; | |
| padding-top:8px; | |
| background:linear-gradient(180deg, rgba(9, 17, 37, 0), rgba(9, 17, 37, 0.95) 55%); | |
| } | |
| .input-area input{ | |
| padding:10px 12px; | |
| border-radius:12px; | |
| } | |
| .primary-btn, | |
| .ghost-btn, | |
| .danger-btn, | |
| .profile-button{ | |
| padding:10px 12px; | |
| border-radius:12px; | |
| } | |
| .topbar-actions{ | |
| gap:8px; | |
| } | |
| @media (max-width: 1180px){ | |
| .dashboard-shell{ | |
| grid-template-columns:1fr; | |
| } | |
| .sidebar{ | |
| max-height:none; | |
| } | |
| .message{ | |
| max-width:92%; | |
| } | |
| .chat-box{ | |
| max-height:none; | |
| } | |
| } |