:root{--ink:#172033;--muted:#5b6473;--blue:#0b5ed7;--soft:#f5f8fc;--line:#dce4ef}*{box-sizing:border-box}body{margin:0;background:#fff;color:var(--ink);font-family:Inter,Arial,sans-serif}.navbar{background:#0b4f9c!important;box-shadow:0 2px 10px rgba(0,0,0,.08)}.navbar-brand{font-weight:700}.nav-link{color:#fff!important}.nav-link:hover,.nav-link.active{color:#dbeafe!important}.hero{padding:64px 20px 72px;max-width:980px;margin:auto;text-align:center}.profile-img{width:170px;height:170px;border-radius:50%;object-fit:cover;border:4px solid #fff;box-shadow:0 8px 30px rgba(23,32,51,.18);margin-bottom:24px}.eyebrow{font-size:.82rem!important;font-weight:700;letter-spacing:.09em;color:var(--blue)!important;margin-bottom:8px!important}.hero h1,.about h1,.projects h1,.resume h1{font-size:2.5rem;font-weight:800;color:var(--ink)}.hero h2{font-size:1.35rem;color:#344054;margin:12px auto 22px}.lead-copy{font-size:1.15rem;max-width:820px;margin:auto;color:#344054;line-height:1.7}.description{max-width:820px;margin:22px auto;color:var(--muted);line-height:1.7}.quick-facts{display:flex;justify-content:center;gap:10px;flex-wrap:wrap;margin:22px 0}.quick-facts span,.tag{background:#eaf2ff;color:#0b4f9c;border-radius:999px;padding:7px 12px;font-size:.88rem;font-weight:700}.social-links{display:flex;justify-content:center;gap:10px;flex-wrap:wrap;margin-top:28px}.about,.projects,.resume{padding:55px 20px 70px;max-width:1050px;margin:auto}.about h1,.projects h1,.resume h1{text-align:center;margin-bottom:30px}.about-box,.project{background:#fff;border:1px solid var(--line);border-radius:14px;padding:24px;margin-bottom:20px;box-shadow:0 8px 24px rgba(23,32,51,.06)}.about-box h2,.project h2{font-size:1.35rem;font-weight:750;margin-bottom:14px}.about-box h3{font-size:1.05rem;font-weight:700;margin-top:20px}.about-box h3 span{float:right;font-weight:500;color:var(--muted);font-size:.92rem}.about-box p,.about-box li,.project p,.project li{color:#3d4654;line-height:1.65}.about-box ul,.project ul{padding-left:22px}.course-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px 18px}.course-grid span{background:var(--soft);border-radius:8px;padding:9px 11px;color:#3d4654}.section-intro{text-align:center;color:var(--muted);margin:-16px auto 30px}.project .tag{display:inline-block;margin-bottom:12px}.resume{text-align:center}.resume iframe{border:1px solid var(--line);border-radius:10px;box-shadow:0 8px 24px rgba(23,32,51,.08)}@media(max-width:700px){.hero h1,.about h1,.projects h1,.resume h1{font-size:2rem}.hero{padding-top:42px}.course-grid{grid-template-columns:1fr}.about-box h3 span{float:none;display:block;margin-top:4px}.resume iframe{height:650px}}

/* Experience hierarchy */
.experience-entry{margin:0 0 26px}.experience-entry:last-child{margin-bottom:0}.experience-entry h3{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr) auto;gap:10px 18px;align-items:baseline;margin-bottom:10px}.experience-entry .role-title{font-weight:800;color:var(--ink);font-size:1.08rem}.experience-entry .company-name{font-family:Georgia,"Times New Roman",serif;font-weight:600;font-style:italic;color:#334155;font-size:1rem}.experience-entry .experience-date{float:none;font-family:"Courier New",monospace;font-weight:700;color:var(--blue);font-size:.88rem;white-space:nowrap}.course-grid span{display:block}.course-grid strong{color:#0b4f9c}@media(max-width:700px){.experience-entry h3{grid-template-columns:1fr;gap:2px}.experience-entry .experience-date{display:block;margin-top:2px}}

/* Experience layout fix */
.experience-entry h3 span{float:none!important;display:block;margin:0!important}.experience-entry h3{display:grid!important;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr) auto;gap:10px 18px;align-items:baseline;margin:0 0 10px}.experience-entry .role-title{grid-column:1}.experience-entry .company-name{grid-column:2}.experience-entry .experience-date{grid-column:3;text-align:right}.experience-entry ul{clear:both;margin-top:8px}@media(max-width:700px){.experience-entry h3{grid-template-columns:1fr!important;gap:3px}.experience-entry .role-title,.experience-entry .company-name,.experience-entry .experience-date{grid-column:1;text-align:left}}


/* Light / dark theme toggle */
:root{color-scheme:light;--page:#ffffff;--card:#ffffff;--ink:#172033;--muted:#5b6473;--soft:#f5f8fc;--line:#dce4ef;--nav:#0b4f9c;--copy:#3d4654;--subhead:#344054;--chip:#eaf2ff;--chip-ink:#0b4f9c;--shadow:rgba(23,32,51,.08)}
html[data-theme="dark"]{color-scheme:dark;--page:#0b1120;--card:#111827;--ink:#f3f4f6;--muted:#aeb8c8;--soft:#182235;--line:#2b3a52;--nav:#0a3567;--copy:#d2d8e2;--subhead:#d9e1ec;--chip:#17365f;--chip-ink:#bfdbfe;--shadow:rgba(0,0,0,.30)}
body{background:var(--page);color:var(--ink);transition:background-color .2s ease,color .2s ease}.navbar{background:var(--nav)!important}.hero h1,.about h1,.projects h1,.resume h1{color:var(--ink)}.hero h2,.lead-copy{color:var(--subhead)}.description,.section-intro{color:var(--muted)}.about-box,.project{background:var(--card);border-color:var(--line);box-shadow:0 8px 24px var(--shadow)}.about-box p,.about-box li,.project p,.project li{color:var(--copy)}.course-grid span{background:var(--soft);color:var(--copy)}.quick-facts span,.tag{background:var(--chip);color:var(--chip-ink)}.experience-entry .role-title{color:var(--ink)}.experience-entry .company-name{color:var(--subhead)}.resume iframe{border-color:var(--line);box-shadow:0 8px 24px var(--shadow)}
.theme-toggle{display:inline-flex;align-items:center;gap:7px;border:1px solid rgba(255,255,255,.55);background:rgba(255,255,255,.10);color:#fff;border-radius:999px;padding:6px 11px;font:inherit;font-size:.9rem;font-weight:650;cursor:pointer;transition:background .18s ease,border-color .18s ease,transform .18s ease}.theme-toggle:hover{background:rgba(255,255,255,.20);border-color:#fff}.theme-toggle:active{transform:translateY(1px)}.theme-toggle:focus-visible{outline:3px solid rgba(255,255,255,.55);outline-offset:2px}.theme-toggle i{width:14px;text-align:center}
html[data-theme="dark"] .btn-outline-dark{color:#f3f4f6;border-color:#cbd5e1}html[data-theme="dark"] .btn-outline-dark:hover{color:#111827;background:#f3f4f6}html[data-theme="dark"] .btn-dark{background:#e5e7eb;border-color:#e5e7eb;color:#111827}html[data-theme="dark"] a:not(.btn):not(.nav-link):not(.navbar-brand){color:#8ec5ff}
@media(max-width:991px){.theme-toggle{margin:8px 0 4px}}


/* v8: true dark-mode surface overrides (loaded after Bootstrap) */
html,body{min-height:100%;background-color:var(--page)!important;color:var(--ink)!important}
html[data-theme="dark"],html[data-theme="dark"] body{background:#0b1120!important;color:#f3f4f6!important}
html[data-theme="dark"] .hero,html[data-theme="dark"] .about,html[data-theme="dark"] .projects,html[data-theme="dark"] .resume,html[data-theme="dark"] main{background:transparent!important}
html[data-theme="dark"] .text-dark{color:#f3f4f6!important}
html[data-theme="dark"] .text-muted{color:#aeb8c8!important}
html[data-theme="dark"] .bg-white,html[data-theme="dark"] .bg-light{background-color:#111827!important}
html[data-theme="dark"] .card{background-color:#111827!important;color:#f3f4f6!important;border-color:#2b3a52!important}
html[data-theme="dark"] .btn-outline-primary{color:#8ec5ff;border-color:#60a5fa}
html[data-theme="dark"] .btn-outline-primary:hover{background:#2563eb;color:#fff}
html[data-theme="dark"] .profile-img{border-color:#334155;box-shadow:0 8px 30px rgba(0,0,0,.45)}


/* v9: consistent full-page dark theme on every page */
html[data-theme="dark"] body,
html[data-theme="dark"] section,
html[data-theme="dark"] .about,
html[data-theme="dark"] .projects,
html[data-theme="dark"] .resume,
html[data-theme="dark"] .hero,
html[data-theme="dark"] main {
  background-color:#0b1120 !important;
  color:#f3f4f6 !important;
}
html[data-theme="dark"] .container { color:#f3f4f6; }
html[data-theme="dark"] .about h1,
html[data-theme="dark"] .projects h1,
html[data-theme="dark"] .resume h1,
html[data-theme="dark"] .about-box h2,
html[data-theme="dark"] .about-box h3,
html[data-theme="dark"] .project h2,
html[data-theme="dark"] .project h3 {
  color:#f3f4f6 !important;
}
html[data-theme="dark"] .about-box,
html[data-theme="dark"] .project {
  background:#111827 !important;
  border:1px solid #334155 !important;
  color:#f3f4f6 !important;
  box-shadow:0 8px 24px rgba(0,0,0,.28) !important;
}
html[data-theme="dark"] .about-box p,
html[data-theme="dark"] .about-box li,
html[data-theme="dark"] .project p,
html[data-theme="dark"] .project li,
html[data-theme="dark"] .course-grid span {
  color:#dbe4f0 !important;
}
html[data-theme="dark"] .about-box strong,
html[data-theme="dark"] .project strong { color:#f8fafc !important; }
html[data-theme="dark"] .experience-entry .role-title { color:#f8fafc !important; }
html[data-theme="dark"] .experience-entry .company-name { color:#dbe4f0 !important; }
html[data-theme="dark"] .experience-entry .experience-date { color:#60a5fa !important; }
html[data-theme="dark"] .course-grid span {
  background:#182235 !important;
  border:1px solid #2b3a52;
}
html[data-theme="dark"] .course-grid strong { color:#93c5fd !important; }
html[data-theme="dark"] .section-intro { color:#b8c3d4 !important; }

/* v10: softer layered surfaces in both themes */
:root{
  --page:#f4f8fd;
  --card:#ffffff;
  --soft:#edf4fd;
  --line:#cddced;
  --shadow:rgba(30,64,105,.09);
}
body{background:linear-gradient(180deg,#f8fbff 0%,var(--page) 100%)!important;}
.about-box,.project{
  background:var(--card)!important;
  border:1px solid var(--line)!important;
  box-shadow:0 8px 24px var(--shadow)!important;
}
/* Give major About-page cards a subtle blue wash rather than pure white */
.about .about-box{background:linear-gradient(145deg,#ffffff 0%,#f5f9ff 100%)!important;}
.course-grid span{
  background:#eaf2fb!important;
  border:1px solid #d9e7f6!important;
}
html[data-theme="dark"]{
  --page:#0b1120;
  --card:#111b2c;
  --soft:#17243a;
  --line:#2d405b;
  --shadow:rgba(0,0,0,.28);
}
html[data-theme="dark"] body{background:linear-gradient(180deg,#09101d 0%,#0b1120 100%)!important;}
html[data-theme="dark"] .about .about-box,
html[data-theme="dark"] .project{
  background:linear-gradient(145deg,#111b2c 0%,#101827 100%)!important;
  border:1px solid #31445f!important;
  box-shadow:0 8px 24px rgba(0,0,0,.25)!important;
}
html[data-theme="dark"] .course-grid span{
  background:#172640!important;
  border:1px solid #2e4668!important;
}