.dash-shell{
min-height:100vh;
padding:154px 0 88px;
}

.dash-shell h1{
font-size:clamp(40px,7vw,68px);
line-height:1;
letter-spacing:-.05em;
margin-top:8px;
}

.dash-shell h1 span{ color:var(--blue); }

.dash-sub{
margin-top:12px;
color:var(--muted);
font-size:14px;
max-width:600px;
line-height:1.75;
}

.dash-status{
min-height:20px;
margin-top:14px;
color:#7fdcff;
font-size:12px;
}

.dash-status.error{ color:#ff9cac; }

/* ── Project grid ─────────────────────────────────────────────────────────── */

.project-grid{
display:grid;
grid-template-columns:repeat(auto-fill,minmax(320px,1fr));
gap:18px;
margin-top:36px;
}

.project-card{
border:1px solid var(--line);
border-radius:18px;
background:linear-gradient(145deg,rgba(13,24,43,.98),rgba(7,15,28,.98));
padding:24px;
cursor:pointer;
transition:border-color .2s,transform .2s;
text-decoration:none;
color:inherit;
display:block;
}

.project-card:hover{
border-color:rgba(0,162,255,.5);
transform:translateY(-2px);
}

.project-card-top{
display:flex;
justify-content:space-between;
align-items:flex-start;
gap:12px;
}

.project-card h2{
font-size:17px;
font-weight:600;
line-height:1.35;
}

.project-card p{
margin-top:8px;
color:var(--muted);
font-size:13px;
line-height:1.6;
display:-webkit-box;
-webkit-line-clamp:2;
-webkit-box-orient:vertical;
overflow:hidden;
}

.project-card-meta{
display:flex;
gap:14px;
margin-top:18px;
padding-top:16px;
border-top:1px solid var(--line);
}

.project-card-meta span{
color:var(--muted);
font-size:11px;
}

.project-card-meta strong{
color:var(--text);
font-size:12px;
display:block;
margin-top:2px;
}

/* ── Status badge ─────────────────────────────────────────────────────────── */

.status-badge{
display:inline-flex;
padding:6px 13px;
border-radius:999px;
font-size:11px;
font-weight:600;
letter-spacing:.08em;
text-transform:uppercase;
white-space:nowrap;
}

.status-badge.waiting{
border:1px solid rgba(255,200,70,.34);
background:rgba(255,200,70,.1);
color:#ffe080;
}

.status-badge.in_progress{
border:1px solid rgba(0,162,255,.34);
background:rgba(0,162,255,.1);
color:#7fdcff;
}

.status-badge.completed{
border:1px solid rgba(60,220,120,.34);
background:rgba(60,220,120,.1);
color:#7fffb8;
}

/* ── Project header ───────────────────────────────────────────────────────── */

.back-link{
display:inline-block;
margin-bottom:28px;
color:var(--muted);
font-size:13px;
}

.back-link:hover{ color:var(--blue); }

.project-header{
display:flex;
align-items:flex-start;
justify-content:space-between;
gap:20px;
flex-wrap:wrap;
}

/* ── Tabs ─────────────────────────────────────────────────────────────────── */

.tab-bar{
display:flex;
gap:6px;
margin-top:32px;
border-bottom:1px solid var(--line);
padding-bottom:0;
}

.tab-btn{
padding:10px 18px;
border:none;
background:none;
color:var(--muted);
font:inherit;
font-size:13px;
font-weight:500;
cursor:pointer;
border-bottom:2px solid transparent;
margin-bottom:-1px;
transition:color .18s,border-color .18s;
}

.tab-btn.active{
color:var(--blue);
border-bottom-color:var(--blue);
}

.tab-panel{
margin-top:24px;
}

/* ── Chat ─────────────────────────────────────────────────────────────────── */

.chat-box{
display:flex;
flex-direction:column;
gap:12px;
min-height:260px;
max-height:480px;
overflow-y:auto;
padding:20px;
border:1px solid var(--line);
border-radius:16px;
background:rgba(7,15,28,.7);
}

.chat-msg{
max-width:72%;
padding:11px 15px;
border-radius:14px;
font-size:13px;
line-height:1.65;
}

.chat-msg.from-admin{
align-self:flex-start;
background:rgba(0,162,255,.12);
border:1px solid rgba(0,162,255,.2);
color:var(--text);
}

.chat-msg.from-client{
align-self:flex-end;
background:rgba(13,24,43,.98);
border:1px solid var(--line);
color:var(--text);
}

.chat-msg-meta{
font-size:10px;
color:var(--muted);
margin-top:5px;
}

.chat-form{
display:flex;
gap:10px;
margin-top:14px;
align-items:flex-end;
}

.chat-form textarea{
flex:1;
resize:vertical;
min-height:52px;
background:rgba(7,15,28,.8);
border:1px solid var(--line);
border-radius:12px;
color:var(--text);
font:inherit;
font-size:13px;
padding:12px 14px;
}

.chat-form textarea:focus{
outline:none;
border-color:rgba(0,162,255,.5);
}

.chat-empty{
color:var(--muted);
font-size:13px;
text-align:center;
padding:40px 0;
}

/* ── Files ────────────────────────────────────────────────────────────────── */

.file-list{
display:grid;
gap:10px;
}

.file-item{
display:flex;
align-items:center;
gap:14px;
padding:14px 18px;
border:1px solid var(--line);
border-radius:14px;
background:rgba(13,24,43,.8);
}

.file-icon{
font-size:22px;
flex-shrink:0;
}

.file-info{
flex:1;
min-width:0;
}

.file-name{
font-size:13px;
font-weight:500;
white-space:nowrap;
overflow:hidden;
text-overflow:ellipsis;
}

.file-meta{
font-size:11px;
color:var(--muted);
margin-top:2px;
}

.file-dl{
padding:7px 14px;
border:1px solid var(--line);
border-radius:999px;
background:rgba(0,162,255,.07);
color:#cfeeff;
font-size:11px;
font-weight:500;
text-decoration:none;
white-space:nowrap;
}

.file-dl:hover{ background:rgba(0,162,255,.16); }

/* ── Invoices ─────────────────────────────────────────────────────────────── */

.invoice-list{
display:grid;
gap:10px;
}

.invoice-item{
display:flex;
align-items:center;
justify-content:space-between;
gap:16px;
padding:16px 20px;
border:1px solid var(--line);
border-radius:14px;
background:rgba(13,24,43,.8);
flex-wrap:wrap;
}

.invoice-desc{
font-size:13px;
font-weight:500;
}

.invoice-meta{
font-size:11px;
color:var(--muted);
margin-top:3px;
}

.invoice-amount{
font-size:20px;
font-weight:700;
color:var(--blue);
white-space:nowrap;
}

.invoice-status-paid{
color:#7fffb8;
font-size:11px;
font-weight:600;
letter-spacing:.06em;
text-transform:uppercase;
}

.invoice-status-pending{
color:#ffe080;
font-size:11px;
font-weight:600;
letter-spacing:.06em;
text-transform:uppercase;
}

.invoice-status-cancelled{
color:#ff9cac;
font-size:11px;
font-weight:600;
letter-spacing:.06em;
text-transform:uppercase;
}

/* ── Empty state ──────────────────────────────────────────────────────────── */

.dash-empty{
margin-top:48px;
text-align:center;
color:var(--muted);
font-size:14px;
}

.dash-empty a{ color:var(--blue); }

/* ── Responsive ───────────────────────────────────────────────────────────── */

@media(max-width:600px){
.project-header{ flex-direction:column; }
.chat-form{ flex-direction:column; }
.chat-form .btn{ align-self:flex-end; }
.tab-btn{ padding:8px 12px; font-size:12px; }
}