/* TIENGHANTOPIK — Student Dashboard (prototype). Reuses tokens.css, site.css, library.css, results.css, skills.css. */
.dash{padding:var(--s-8) 0 0}
.dash h1{font-size:clamp(1.75rem,1.2rem + 2vw,2.5rem)}
.dash .priv{display:flex;gap:var(--s-2);align-items:flex-start;color:var(--text-secondary);font-size:var(--fs-14);margin:0 0 var(--s-6)}
.d-h{font-size:var(--fs-24);margin:0 0 var(--s-4)}
.dash section{margin:0 0 var(--s-8)}
.ovgrid{display:grid;grid-template-columns:3fr 2fr;gap:var(--s-5)}
.ovg{background:var(--bg-surface);border:1px solid var(--border-strong);border-radius:var(--r-lg);padding:var(--s-5)}
.ovg h3{font-size:var(--fs-16);color:var(--text-secondary);margin:0 0 var(--s-3)}
.mts{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(9rem,1fr));gap:var(--s-4)}
.mt{display:flex;flex-direction:column;gap:2px;min-width:0}
.mv{font-size:var(--fs-32);font-weight:700;line-height:1.1}
.ml{font-weight:600}
.ms{font-size:var(--fs-12);color:var(--text-secondary);overflow-wrap:anywhere}
.cogrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr));gap:var(--s-5)}
.co{background:var(--bg-tint);border:1px solid var(--coral-300);border-radius:var(--r-lg);padding:var(--s-5);display:flex;flex-direction:column;gap:var(--s-2);align-items:flex-start}
.co h3{font-size:var(--fs-14);color:var(--text-secondary);margin:var(--s-1) 0 0}
.co .cot{font-size:var(--fs-20);font-weight:700;margin:0;overflow-wrap:anywhere}
.co p{margin:0}
.coa{display:flex;flex-wrap:wrap;gap:var(--s-2) var(--s-3);align-items:center;margin-top:var(--s-3)!important}
.cn{display:flex;gap:var(--s-2);align-items:flex-start;color:var(--text-secondary);font-size:var(--fs-14);margin:var(--s-3) 0 0}
.dgrid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:var(--s-5);align-items:start;margin-bottom:var(--s-8)}
.panel{background:var(--bg-surface);border:1px solid var(--border-strong);border-radius:var(--r-lg);padding:var(--s-5);min-width:0}
.panel .ph{display:flex;flex-wrap:wrap;gap:var(--s-3);justify-content:space-between;align-items:center;margin-bottom:var(--s-4)}
.panel .ph .d-h{margin:0}
.sub{font-size:var(--fs-16);margin:var(--s-5) 0 var(--s-3)}
.rows{list-style:none;margin:0;padding:0;display:grid;gap:var(--s-3)}
.row{border:1px solid var(--border);border-radius:var(--r-md);padding:var(--s-4);display:grid;gap:var(--s-2);background:var(--bg-surface);min-width:0}
.row .rh{display:flex;flex-wrap:wrap;gap:var(--s-2);align-items:center;justify-content:space-between}
.row .rt{font-size:var(--fs-18);margin:0;overflow-wrap:anywhere}
.row p{margin:0}
.row .sc{display:flex;gap:var(--s-2);align-items:baseline;flex-wrap:wrap}
.row .sc b{font-size:var(--fs-20)}
.row .sc.muted{align-items:center}
.row .ra{display:flex;flex-wrap:wrap;gap:var(--s-2);align-items:center;margin-top:var(--s-1)}
.chips{display:flex;flex-wrap:wrap;gap:var(--s-2)}
.rchip.pst-prog{border-color:var(--n-900);background:var(--bg-surface);color:var(--n-900)}
.btn-proposal{border-style:dashed}
.prop-tag{display:inline-flex;align-items:center;font-size:var(--fs-12);font-weight:700;color:var(--amber-800);background:var(--state-flag-bg);border:1px dashed var(--amber-800);border-radius:var(--r-pill);padding:2px 9px}
.none{display:flex;gap:var(--s-3);align-items:center;color:var(--text-secondary);border:1px dashed var(--border-strong);border-radius:var(--r-md);padding:var(--s-5);margin:0}
.sks{list-style:none;margin:0;padding:0;display:grid;gap:var(--s-4)}
.skh{display:flex;justify-content:space-between;gap:var(--s-3);flex-wrap:wrap;margin-bottom:6px}
.sbar{display:flex;height:10px;border-radius:var(--r-pill);background:var(--n-100);border:1px solid var(--border-strong);overflow:hidden}
.sb-c{background:var(--n-900)}
.sb-p{background:repeating-linear-gradient(45deg,var(--n-500) 0 4px,var(--n-100) 4px 8px)}
.sks .muted{margin:4px 0 0}
.tgs{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:var(--s-2)}
.tgc{display:inline-flex;gap:var(--s-2);align-items:baseline;border:1px solid var(--n-900);border-radius:var(--r-md);padding:4px 12px;font-weight:600;background:var(--bg-surface)}
.tgc.zero{border-color:var(--border-strong);border-style:dashed;color:var(--text-secondary);font-weight:500}
.tgn{margin:var(--s-2) 0 0}
.panel .muted svg{vertical-align:-3px;margin-right:6px}
.recent .tl{list-style:none;margin:0;padding:0;display:grid;gap:0}
.tl li{display:grid;grid-template-columns:auto 1fr auto;gap:var(--s-3);align-items:center;padding:var(--s-3) 0;border-bottom:1px solid var(--border)}
.tl li:last-child{border-bottom:0}
.tl .tx{overflow-wrap:anywhere}
.tl time{white-space:nowrap}
.emp-cta{display:flex;flex-wrap:wrap;gap:var(--s-3);justify-content:center}
.dgrid .sk{min-height:260px}
@media (max-width:960px){.ovgrid,.dgrid{grid-template-columns:1fr}}
@media (max-width:480px){
  .tl li{grid-template-columns:1fr auto}
  .tl li .badge{grid-column:1/-1}
  .ovg{padding:var(--s-4)}.panel{padding:var(--s-4)}
  .mts{grid-template-columns:1fr 1fr}
}