: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 !important;
}

.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;
	}
}