:root{
  --bg:#f7fbff;
  --card:#ffffff;
  --muted:#6b7280;
  --accent:#2563eb;
  --text:#0f172a;
  --radius:12px;
  --shadow: 0 6px 18px rgba(15,23,42,0.08);
  color-scheme: light;
}
*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;font-family:Inter,system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial;
  background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased;
}
.container{max-width:1000px;margin:28px auto;padding:22px}
.header{background:linear-gradient(90deg,#fff,#fbfdff);padding:18px;border-radius:var(--radius);box-shadow:var(--shadow);}
.profile{display:flex;gap:16px;align-items:center}
.avatar{flex:0 0 120px;display:flex;justify-content:center;align-items:center}
.avatar img{width:120px;height:120px;border-radius:16px;object-fit:cover;display:block}
.meta h1{margin:0;font-size:1.6rem}
.role{margin:6px 0;color:var(--muted)}
.actions{margin-top:10px;display:flex;gap:8px}
.btn{background:var(--accent);color:white;border:0;padding:8px 12px;border-radius:8px;cursor:pointer}
.btn.alt{background:transparent;color:var(--accent);border:1px solid var(--accent)}
.main-grid{display:grid;grid-template-columns:1fr 2fr;gap:18px;margin-top:18px}
.panel{background:var(--card);padding:18px;border-radius:12px;box-shadow:var(--shadow)}
.about{grid-column:1/2}
.experience{grid-column:2/3}
.education{grid-column:1/2}
.skills{grid-column:2/3}
.extras{grid-column:1/3}
.item{margin-bottom:12px}
.muted{color:var(--muted);font-size:0.9rem}
.skills-list{display:flex;flex-wrap:wrap;gap:8px;list-style:none;padding:0;margin:8px 0}
.skills-list li{background:#f1f7ff;padding:8px 10px;border-radius:8px;color:var(--accent);font-weight:600}
.contact{list-style:none;padding:0;margin-top:10px}
.contact li{margin:6px 0;color:var(--muted)}
.footer{margin-top:16px;text-align:center;color:var(--muted)}

/* Responsive */
@media (max-width:880px){
  .main-grid{grid-template-columns:1fr}
  .extras{grid-column:1/2}
}

/* Dark mode */
body.dark{background:#071028;color:#e6eef8}
body.dark .header, body.dark .panel{background:#071635}
body.dark .skills-list li{background:#072244;color:#a8d1ff}
body.dark .btn.alt{color:#a8d1ff;border-color:#1e6be0}

/* Print friendly */
@media print{
  body{background:white;color:black}
  .btn, #themeToggle{display:none}
  .container{max-width:800px;margin:0}
}