/* The same content, with a quiet daylight palette and a more expressive night palette. */
:root{color-scheme:light}
.project-meta{display:flex;align-items:baseline;justify-content:space-between;gap:15px;margin-top:8px}
.project-meta .project-kind{margin:0}
.project-year{font-size:12px;font-weight:500;color:var(--muted);font-variant-numeric:tabular-nums;flex-shrink:0;letter-spacing:.5px}
.theme-toggle{position:fixed;z-index:30;left:24px;bottom:24px;width:48px;height:48px;display:grid;place-items:center;border:1px solid var(--line);border-radius:50%;background:var(--canvas);color:var(--text);box-shadow:var(--s1);transition:background-color var(--t-state),border-color var(--t-fast),box-shadow var(--t-state)}
.theme-toggle>svg{width:22px;height:22px;stroke-width:1.45;grid-area:1/1}
.theme-toggle .theme-sun{display:none}
.theme-spark{stroke:var(--blue)}
.theme-tooltip{position:absolute;left:calc(100% + 12px);padding:5px 10px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--canvas);color:var(--ink);box-shadow:var(--s1);font-size:12px;line-height:1.6;white-space:nowrap;opacity:0;pointer-events:none;transform:translateX(-4px);transition:opacity var(--t-state),transform var(--t-state) var(--ease)}
.theme-toggle:focus-visible .theme-tooltip{opacity:1;transform:none}
@media(hover:hover){.theme-toggle:hover{border-color:var(--signal-line)}.theme-toggle:hover .theme-tooltip{opacity:1;transform:none}}
@media(max-width:600px){.theme-toggle{left:auto;right:64px;top:9px;bottom:auto;width:42px;height:42px;border-radius:50%;box-shadow:none}.theme-toggle>svg{width:19px;height:19px}.theme-tooltip{left:auto;right:0;top:calc(100% + 10px);transform:translateY(-4px)}}

:root[data-theme=dark]{color-scheme:dark;--canvas:#111a29;--mist:#152031;--mist-deep:#18243a;--line:#24324a;--line-strong:#33445f;--ink:#e8eef8;--text:#b3c0d3;--muted:#93a2b8;--blue:#7fdcf0;--signal-soft:#15303c;--signal-line:#3f8597;--signal-deep:#c6f4fc;--seg-on:#26354d;--dot:#3a4a63;--navy:#7fdcf0;--surface:var(--mist);--panel:#111a29;--raised:#18243a;--violet:#b9aaff;--s1:0 1px 2px rgb(0 0 0/.4),0 4px 12px rgb(0 0 0/.28);--s2:0 1px 2px rgb(0 0 0/.35),0 18px 44px -14px rgb(0 0 0/.65);--s2h:0 1px 2px rgb(0 0 0/.4),0 24px 54px -14px rgb(0 0 0/.78);--s3:0 2px 8px rgb(0 0 0/.4),0 40px 110px -20px rgb(0 0 0/.8);--hi:inset 0 1px 0 rgb(255 255 255/.05)}
:root[data-theme=dark] body{background-color:#080d17;background-image:radial-gradient(ellipse at 96% 0%,#7056dc17,transparent 45%),radial-gradient(ellipse at 0% 90%,#16b6d40a,transparent 45%);background-attachment:fixed}
:root[data-theme=dark] ::selection{background:#20465b;color:#effcff}
:root[data-theme=dark] :is(a,button,[tabindex]):focus-visible{outline-color:var(--blue)}
:root[data-theme=dark] .site-header{background:rgb(8 13 23/.82);border-bottom-color:var(--line)}
:root[data-theme=dark] .nav-link{color:var(--text)}
:root[data-theme=dark] :is(.nav-link.active,.nav-link:hover){background:var(--raised);color:var(--ink)}
:root[data-theme=dark] .header-resume span{background:var(--raised);color:var(--muted)}
:root[data-theme=dark] .mobile-menu:not([hidden]){background:rgb(8 13 23/.96)}
:root[data-theme=dark] .mobile-menu a{color:var(--text)}
:root[data-theme=dark] .portrait{box-shadow:0 0 0 1px var(--line),var(--s1)}
:root[data-theme=dark] .intro-copy strong{color:var(--ink)}
:root[data-theme=dark] :is(.profile-study,.location,.file-label,.section-kicker,.project-kind,.preview-chrome,.preview-type,.preview-footer,.preview-switch button,.education-row .education-detail,.education-row .education-date,.education-date>span,.footer-bottom,[id=dialog-eyebrow],.project-facts span,.live-address,.live-options button,.detail-metrics span,.detail-pipeline p,.frame-loading,.experience-date,.experience-context,.site-footer>p,.detail-note,.screenshot-header,.screenshot-position,.screenshot-options button>span){color:var(--muted)}
:root[data-theme=dark] .project-year{color:var(--muted)}
:root[data-theme=dark] .section-kicker{color:var(--muted)}
:root[data-theme=dark] .availability{color:var(--text)}
:root[data-theme=dark] .tags>span{border-color:var(--line-strong);color:var(--text);background:transparent}
:root[data-theme=dark] .project-preview{background:var(--canvas);border-color:var(--line);box-shadow:var(--s2)}
:root[data-theme=dark] :is(.project-preview:hover,.project-row:has(.details-button:hover) .project-preview){border-color:var(--line-strong);box-shadow:var(--s2h)}
:root[data-theme=dark] .preview-chrome{background:var(--mist);border-bottom-color:var(--line)}
:root[data-theme=dark] .window-dots i{background:var(--dot)}
:root[data-theme=dark] :is(.preview-image,.cardio-image.atlas-selected,.geography-image,.wholeviz-image){background:var(--mist)}
:root[data-theme=dark] .preview-hover{background:var(--canvas);border-color:var(--line-strong);box-shadow:var(--s1);color:var(--ink)}
:root[data-theme=dark] .expand-icon{border-color:var(--text)}
:root[data-theme=dark] .expand-icon:after{background:var(--canvas)}
:root[data-theme=dark] .preview-footer{background:var(--mist);border-top-color:var(--line)}
:root[data-theme=dark] .live-indicator{background:var(--blue);box-shadow:0 0 0 3px var(--signal-soft)}
:root[data-theme=dark] .preview-switch{background:var(--mist-deep);border-color:var(--line)}
:root[data-theme=dark] .preview-switch button[aria-pressed=true]{background:var(--seg-on);color:var(--ink);box-shadow:var(--s1)}
:root[data-theme=dark] .experience-row h3>span{color:var(--muted)}
:root[data-theme=dark] .education-row .honours{color:var(--text)}
:root[data-theme=dark] :is(.footer-bottom>a,.copy-email){color:var(--text)}
:root[data-theme=dark] .copy-email:hover{background:var(--raised);color:var(--blue)}
:root[data-theme=dark] .skip-link{background:var(--blue);color:#071723}

/* App chrome follows the theme; source images and external websites retain their colors. */
:root[data-theme=dark] .project-dialog{background:var(--canvas);border-color:var(--line-strong);box-shadow:var(--s3)}
:root[data-theme=dark] .project-dialog::backdrop{background:#010511b3}
:root[data-theme=dark] :is(.dialog-mark,.close-dialog){background:var(--raised);border-color:var(--line-strong)}
:root[data-theme=dark] .close-dialog{color:var(--text)}
:root[data-theme=dark] .close-dialog:hover{background:var(--seg-on);color:var(--ink)}
:root[data-theme=dark] .dialog-toolbar{border-color:var(--line)}
:root[data-theme=dark] .dialog-tabs button{color:var(--text)}
:root[data-theme=dark] .dialog-tabs button[aria-selected=true]{background:var(--seg-on);color:var(--ink);box-shadow:var(--s1)}
:root[data-theme=dark] .open-website{color:var(--blue)}
:root[data-theme=dark] :is(.live-panel,.details-panel,.frame-loading){background:var(--canvas)}
:root[data-theme=dark] .details-panel{scrollbar-color:var(--line-strong) transparent}
:root[data-theme=dark] .live-address{background:var(--mist)}
:root[data-theme=dark] .live-options button[aria-pressed=true]{background:var(--seg-on);border-color:var(--line-strong);color:var(--ink)}
:root[data-theme=dark] .loader{border-color:var(--line);border-top-color:var(--blue)}
:root[data-theme=dark] .details-intro{color:var(--ink)}
:root[data-theme=dark] .project-facts>div{color:var(--ink)}
:root[data-theme=dark] .detail-note{border-left-color:var(--line-strong)}
:root[data-theme=dark] .detail-links a{background:var(--raised);border-color:var(--line-strong);color:var(--ink)}
:root[data-theme=dark] .detail-links a:hover{background:var(--seg-on);border-color:var(--signal-line)}
:root[data-theme=dark] .detail-links a:first-child{background:var(--blue);border-color:var(--blue);color:#0a101c}
:root[data-theme=dark] .detail-links a:first-child:hover{background:#a3e8f6;border-color:#a3e8f6}
:root[data-theme=dark] .detail-pipeline>div{background:var(--mist);border-color:transparent}
:root[data-theme=dark] .detail-pipeline h4{color:var(--ink)}
:root[data-theme=dark] .screenshot-viewer{background:#0a1321}
:root[data-theme=dark] :is(.screenshot-header,.screenshot-bottom){background:var(--canvas)}
:root[data-theme=dark] :is(.screenshot-header button,.screenshot-navigation>button){background:var(--raised);border-color:var(--line-strong)}
:root[data-theme=dark] .screenshot-navigation>button:hover{background:var(--seg-on)}
:root[data-theme=dark] .screenshot-options{background:var(--mist-deep)}
:root[data-theme=dark] .screenshot-options button{color:var(--text)}
:root[data-theme=dark] .screenshot-options button[aria-pressed=true]{background:var(--seg-on);color:var(--ink)}
:root[data-theme=dark] .screenshot-caption{color:var(--text)}
:root[data-theme=dark] .toast{background:var(--raised);border-color:var(--line-strong);color:var(--ink)}
#project-frame{color-scheme:light}

:root[data-theme=dark] .theme-toggle{background:var(--canvas);border-color:var(--line-strong);color:var(--violet);box-shadow:var(--hi),var(--s1)}
@media(max-width:600px){:root[data-theme=dark] .theme-toggle{box-shadow:var(--hi)}}
:root[data-theme=dark] .theme-toggle .theme-moon{display:none}
:root[data-theme=dark] .theme-toggle .theme-sun{display:block}
:root[data-theme=dark] .theme-tooltip{background:var(--raised);color:var(--ink)}
@media(hover:hover){:root[data-theme=dark] .theme-toggle:hover{border-color:rgb(185 170 255/.5)}}
@media(prefers-reduced-motion:no-preference){body,.site-header,.project-dialog,.details-panel,.preview-chrome,.preview-footer{transition:background-color var(--t-state),color var(--t-state),border-color var(--t-state)}}
@media(prefers-reduced-motion:reduce){.theme-toggle,.theme-tooltip{transition:none}}