/* Bone, cobalt and chartreuse; charcoal, periwinkle and softened lime at night. */
:root{color-scheme:light;--paper:#f6f3eb;--ink:#1b241f;--muted:#6a7567;--line:#d5dccd;--acid:#d5ed87;--dark:#18221c;--surface:#ecefe4;--surface-raised:#fbfcf6;--accent:#385469;--accent-soft:#e2e8eb;--on-accent:#fff;--soft-ink:#53634e;--subtle:#74816b;--hero-field:#e2e8ce;--poster:#3b54c7;--positive:#486b2f;--error:#9b3d28}
:root[data-theme=dark]{color-scheme:dark;--paper:#101712;--ink:#f0f2e9;--muted:#a2b29b;--line:#354633;--acid:#d6ee89;--dark:#0b130e;--surface:#19251c;--surface-raised:#213025;--accent:#abc1cf;--accent-soft:#25323a;--on-accent:#14203b;--soft-ink:#bac8b0;--subtle:#a0b394;--hero-field:#263823;--poster:#586bdd;--positive:#d2ec8c;--error:#ffb899}
body{background:var(--paper);color:var(--ink)}
::selection{background:var(--acid);color:#1b2817}
.dark-section{--paper:#f2f1e8;--ink:#18221c;--line:#3a4937;--muted:#b4beaa;color:#f2f1e8}
[data-theme=dark] .journey-section{background:#16251b}
[data-theme=dark] .about-section{background:#0b130e}
[data-theme=dark] .contact-section{background:#0b1510}
.theme-switching body,.theme-switching :is(.site-header,.identity-art,.credentials-section,.certificate-card,.chapter-dock,dialog,.dialog-toolbar,.project-visual,.dark-section,.theme-toggle,.header-contact){transition:background-color .3s,color .3s,border-color .3s}
button:focus-visible,a:focus-visible,summary:focus-visible{outline-color:var(--accent)}
.brand-dot{color:var(--accent)}
.site-header{height:86px;padding-top:18px;padding-bottom:18px;gap:24px}
.site-header nav{font-size:12px;gap:28px;margin-left:auto;margin-right:14px}
.header-actions{display:flex;align-items:center;gap:12px}
.header-contact{margin:0;white-space:nowrap;font-size:12px;border-color:var(--line)}
.header-contact:hover{background:var(--acid);color:#1b2817}
.theme-toggle{height:39px;display:flex;align-items:center;gap:8px;padding:0 13px 0 10px;border:1px solid var(--line);border-radius:25px;font:11px var(--sans);background:var(--surface);color:var(--ink)}
.theme-toggle:hover{border-color:var(--accent)}
.theme-icon{height:19px;width:19px;position:relative;display:block;color:var(--accent)}
.theme-icon svg{position:absolute;inset:0;width:19px;height:19px;transition:transform .4s,opacity .3s}
.theme-moon{opacity:0;transform:rotate(-60deg) scale(.5)}
[data-theme=dark] .theme-moon{opacity:1;transform:none}
[data-theme=dark] .theme-sun{opacity:0;transform:rotate(60deg) scale(.5)}
#theme-system{font:inherit;color:inherit;padding:0;text-decoration:underline;text-underline-offset:4px}
#theme-system:disabled{opacity:.8;text-decoration:none;cursor:default}

/* A personal introduction, composed like a small editorial cover. */
.identity-hero{padding-top:20px;overflow:clip}
.identity-topline{display:flex;justify-content:space-between;align-items:center;gap:24px;border-top:1px solid var(--line);padding:17px 0;font:10px/1.5 var(--mono);letter-spacing:.045em}
.identity-topline .availability{font-size:9px}
.identity-topline .availability i{background:var(--accent);box-shadow:none}
.identity-layout{display:grid;grid-template-columns:1.13fr 1fr;align-items:center;gap:46px;padding:34px 0 52px;min-height:620px}
.identity-copy{position:relative;z-index:3;padding-bottom:8px}
.identity-eyebrow{display:flex;align-items:center;gap:10px;font:10px var(--mono);letter-spacing:.08em;color:var(--soft-ink);margin-bottom:24px}
.identity-eyebrow>span{color:var(--accent);font:24px/1 Georgia,serif}
.identity-hero h1{font:750 clamp(84px,9.1vw,136px)/.92 var(--display);letter-spacing:-.075em;text-align:left;margin:0 0 22px;position:static;color:var(--ink)}
.identity-hero h1>span{display:inline;white-space:normal;color:var(--accent)}
.identity-copy h2{font:500 clamp(34px,3.6vw,52px)/1.12 var(--display);letter-spacing:-.055em;margin:0 0 24px}
.identity-copy h2 em{color:var(--accent);font-size:1.12em;line-height:1}
.identity-copy>p{font:16px/1.8 var(--sans);color:var(--soft-ink);max-width:425px;margin-bottom:28px;letter-spacing:-.012em}
.identity-actions{display:flex;align-items:center;gap:25px;flex-wrap:wrap}
.identity-primary{display:inline-flex;align-items:center;gap:25px;background:var(--accent);color:var(--on-accent);border-radius:6px;padding:14px 16px 14px 20px;font-size:12px;font-weight:550;transition:transform .25s,box-shadow .25s}
.identity-primary>span{font-size:18px;line-height:1}
.identity-primary:hover{transform:translateY(-3px);box-shadow:0 9px 25px #38546926}
.identity-resume{font-size:12px;border-bottom:1px solid var(--line);padding:10px 0;white-space:nowrap}
.identity-resume>span{margin-left:12px;color:var(--accent)}
.identity-resume:hover{border-color:var(--accent)}
.identity-socials{display:flex;gap:23px;margin-top:30px;font:11px var(--sans);color:var(--soft-ink)}
.identity-socials a:hover{color:var(--accent)}
.identity-art{position:relative;justify-self:center;width:100%;max-width:480px;height:535px;isolation:isolate}
.portrait-guide{position:absolute;left:8%;right:6%;top:0;bottom:14%;border:1px solid var(--line);border-radius:3px;pointer-events:none}
.portrait-guide:after{content:'';position:absolute;left:-1px;top:8%;width:1px;height:24%;background:var(--accent);opacity:.65;animation:portrait-edge 10s ease-in-out infinite;animation-play-state:paused}
.identity-art.is-onstage:not(.portrait-paused) .portrait-guide:after{animation-play-state:running}
@keyframes portrait-edge{0%,100%{top:8%;opacity:.3}50%{top:66%;opacity:.8}}
.identity-portrait{position:absolute;left:12%;right:10%;top:4%;bottom:10%;margin:0;background:var(--surface-raised);border:1px solid var(--line);border-radius:3px;transform:none;box-shadow:0 18px 45px #0a171214;overflow:hidden;z-index:1}
.identity-portrait>img{width:100%;height:calc(100% - 58px);object-fit:cover;object-position:50% 38%;border-radius:0;filter:none;transform:none}
.identity-art:hover .identity-portrait{transform:none}
.identity-photo-caption{height:58px;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:0 15px;background:var(--surface-raised);color:var(--ink);border-top:1px solid var(--line)}
.identity-photo-caption strong{display:block;font:500 12px/1.4 var(--sans);letter-spacing:-.02em}
.identity-photo-caption small{display:block;font:8px/1.5 var(--mono);letter-spacing:.06em;color:var(--soft-ink);margin-top:3px}
.identity-photo-caption>span:last-child{font:8px var(--mono);color:var(--soft-ink);white-space:nowrap}
.identity-art-label{position:absolute;top:0;left:12%;transform:translateY(-16px);font:8px var(--mono);letter-spacing:.08em;color:var(--soft-ink)}
#portrait-motion{position:absolute;right:4%;bottom:0;border:0;border-bottom:1px solid var(--line);border-radius:0;background:none;color:var(--soft-ink);font:9px var(--mono);height:auto;width:auto;padding:9px 0;display:flex;align-items:center;gap:16px;z-index:4}
#portrait-motion:hover{background:none;color:var(--accent)}
.identity-footer{display:flex;align-items:center;justify-content:space-between;gap:20px;border-top:1px solid var(--line);padding:21px 0 26px;font:9px var(--mono);letter-spacing:.04em;color:var(--soft-ink)}
.identity-footer>span:first-child{display:flex;align-items:center;gap:8px}
.identity-footer i{display:block;height:5px;width:5px;background:var(--accent);border-radius:50%}
.identity-footer>a{display:flex;align-items:center;gap:17px;color:var(--ink)}
.identity-footer>a>span{font-size:18px;color:var(--accent)}
.identity-footer>a:hover>span{transform:translateY(3px)}
.idea-route .route-beam{fill:none;stroke:var(--acid);stroke-width:1.6;stroke-linecap:round;filter:drop-shadow(0 0 4px #d5ed8780)}
.idea-route .route-traveller{fill:#f6ffdd;stroke:none}
.idea-route .route-halo{fill:var(--acid);fill-opacity:.12;stroke:none}
.idea-route .route-node{transition:fill .4s,stroke .4s}
.idea-route .route-node.is-lit{fill:var(--acid);stroke:#f6ffdd}
.idea-route text{font-size:10px}
.route-motion-control{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-top:9px;color:#a9b59d;font:7px var(--mono);letter-spacing:.035em}
#route-motion{font:8px var(--mono);color:#c0ceb2;display:flex;align-items:center;gap:14px;white-space:nowrap;padding:8px 0}
#route-motion:hover{color:var(--acid)}

/* Shared surfaces and type use the same palette in both themes. */
.muted{color:var(--subtle)}
.section-heading>p,.project-card>p,.project-meta,.repository-link>span,.skill-accordions details p,.credential-info>p,.gallery-hint,.credential-note,.detail-hero>p,.detail-body p,.detail-body li,.detail-footer p,.contact-dialog-heading>p,.contact-form label,.contact-privacy,.contact-success p{color:var(--soft-ink)}
.project-filters button,.certificate-filters button{color:var(--soft-ink)}
.project-filters button:hover,.certificate-filters button:hover{background:var(--surface)}
.project-filters button[aria-pressed=true],.certificate-filters button[aria-pressed=true]{background:var(--ink);color:var(--paper)}
.project-visual{background:var(--surface)}
[data-theme=dark] .project-card:nth-child(2n) .project-visual{background:#26382b}
[data-theme=dark] .project-visual:before{background-image:linear-gradient(#92ac7414 1px,transparent 1px),linear-gradient(90deg,#92ac7414 1px,transparent 1px)}
[data-theme=dark] .project-visual:after{background:radial-gradient(ellipse at 20% 20%,#8fbf5a0a,transparent 70%)}
.image-type{color:var(--soft-ink)}
.tags>span{color:var(--soft-ink)}
.project-toolbar>.eyebrow,.work-track-footer>.eyebrow,#work-position{color:var(--soft-ink)}
.work-progress{background:var(--line)}.work-progress>span{background:var(--accent)}
.project-visual .project-open{background:var(--paper);color:var(--ink)}
.project-visual:hover .project-open{background:var(--acid);color:#1b2817}
.circle-button:hover{background:var(--acid);color:#1b2817}
.credentials-section{background:var(--surface)}
.certificate-card{background:var(--surface-raised);border-color:var(--line)}
.certificate-card:hover{background:var(--paper)}
.certificate-card small,.certificate-card .certificate-arrow,.credential-toolbar>.eyebrow{color:var(--soft-ink)}
.certificate-emblem{border-color:var(--line);color:var(--accent)}
.credential-toolbar{border-color:var(--line)}
.credential-dots button:after{background:var(--line)}
.credential-dots button[aria-pressed=true]:after,.credential-dots button:hover:after{background:var(--accent)}
.skill-accordions summary>span{color:var(--soft-ink)}
.chapter-dock{background:var(--surface-raised);border-color:var(--line);color:var(--ink)}
.chapter-dock>a{background:var(--surface);color:var(--ink)}
.chapter-dock>a:hover{background:var(--acid);color:#1b2817}
#chapter-number{color:var(--soft-ink)}
.detail-image,.certificate-detail .detail-image{background:var(--surface)}
.solid-link{background:var(--ink);color:var(--paper)}
.solid-link:hover{background:var(--acid);color:#1b2817}
.contact-form input,.contact-form select,.contact-form textarea{color:var(--ink);border-color:var(--line)}
.contact-form select option{background:var(--surface-raised);color:var(--ink)}
.contact-form input:focus,.contact-form select:focus,.contact-form textarea:focus{border-color:var(--accent);box-shadow:0 1px var(--accent)}
.contact-form input::placeholder,.contact-form textarea::placeholder{color:var(--subtle)}
.form-status{color:var(--positive)}.form-status.error{color:var(--error)}
.success-symbol{color:#1b2817}
.contact-form .send-message:disabled{background:var(--surface);color:var(--soft-ink)}
[data-theme=dark] .site-header nav.open{background:var(--surface-raised);border-color:var(--line)}
.reading-progress{background:var(--accent)}

@media(max-width:1150px){.site-header{padding-left:38px;padding-right:38px;gap:18px}.site-header nav{gap:20px;margin-right:0}.header-actions{gap:8px}.header-contact{padding:9px 13px;gap:13px}.identity-layout{gap:25px;min-height:565px}.identity-hero h1{font-size:clamp(80px,9vw,115px)}.identity-copy h2{font-size:40px}.identity-copy>p{font-size:14px;max-width:370px}.identity-art{height:470px}.identity-primary{font-size:11px;padding:13px 15px;gap:18px}.identity-actions{gap:18px}.identity-footer{font-size:8px}}
@media(max-width:900px){.site-header{height:78px;gap:14px}.site-header nav{font-size:11px;gap:16px}.header-actions{gap:8px}.header-contact{font-size:10px;padding:8px 12px;gap:10px}.theme-toggle{padding:0 10px;height:34px}.theme-toggle #theme-label{display:none}.identity-layout{grid-template-columns:1.08fr 1fr;gap:20px;padding-top:30px;padding-bottom:35px;min-height:510px}.identity-hero h1{font-size:80px}.identity-copy h2{font-size:34px}.identity-copy>p{font-size:13px;line-height:1.8;margin-bottom:22px}.identity-eyebrow{font-size:8px;margin-bottom:20px}.identity-art{height:425px}.identity-portrait{left:13%;right:8%}.identity-art-label{font-size:7px;left:10%}.identity-actions{gap:14px}.identity-primary{font-size:10px;padding:12px 13px;gap:13px}.identity-resume{font-size:11px}.identity-socials{margin-top:24px;font-size:10px}.identity-photo-caption{gap:10px;padding:0 8px}.identity-photo-caption>span:nth-child(2){font-size:7px}.identity-topline{font-size:9px}.identity-topline .availability{font-size:8px}.identity-footer{font-size:7px;gap:12px}}
@media(max-width:700px){.identity-layout{grid-template-columns:1fr;gap:32px;padding:28px 0 35px}.identity-copy{max-width:600px;padding:0}.identity-hero h1{font-size:clamp(83px,16vw,110px);margin-bottom:18px}.identity-copy h2{font-size:clamp(36px,6.5vw,46px);margin-bottom:21px}.identity-copy>p{font-size:15px;max-width:440px;line-height:1.75}.identity-art{max-width:460px;height:485px;margin:0 auto}.identity-portrait{left:17%;right:9%;top:8%;bottom:6%}.identity-art-label{left:12%;font-size:8px}.identity-photo-caption>span:nth-child(2){font-size:8px}.identity-primary{font-size:12px;padding:14px 17px;gap:20px}.identity-resume{font-size:12px}.identity-socials{font-size:12px;gap:24px}.identity-topline .availability{font-size:7px;max-width:145px}.identity-topline{font-size:9px}.identity-footer>span:nth-child(2){display:none}.identity-footer{font-size:8px;padding:19px 0 22px}}
@media(max-width:600px){.site-header{height:74px;padding:14px 22px;gap:13px}.site-header nav{font-size:22px;margin:0;gap:18px}.header-actions{margin-left:auto;gap:8px}.header-contact{font-size:10px;padding:8px 11px;gap:9px}.theme-toggle{height:34px;width:34px;padding:0;justify-content:center}.theme-icon,.theme-icon svg{height:17px;width:17px}.menu-toggle{width:27px;min-width:27px;padding:2px}.identity-hero{padding-top:10px}.identity-topline{align-items:start;gap:15px;padding:15px 0;font-size:8px;line-height:1.6}.identity-topline>span:first-child{max-width:160px}.identity-topline .availability{font-size:7px;max-width:130px;gap:7px}.identity-topline .availability i{min-width:4px}.identity-layout{padding-top:24px;gap:30px}.identity-eyebrow{font-size:9px;margin-bottom:19px}.identity-hero h1{font-size:clamp(77px,18.2vw,105px);letter-spacing:-.075em}.identity-copy h2{font-size:38px}.identity-copy>p{font-size:14px;line-height:1.8;margin-bottom:24px;max-width:350px}.identity-actions{gap:20px}.identity-primary{font-size:11px;padding:13px 15px;gap:15px}.identity-resume{font-size:11px}.identity-socials{font-size:11px;margin-top:24px}.identity-art{height:420px;max-width:380px}.identity-art-label{font-size:7px;left:12%}.identity-photo-caption>span:nth-child(2){font-size:7px}.identity-portrait{border-width:4px}.identity-footer{font-size:7px;gap:12px;padding:18px 0 20px}.identity-footer>a{gap:10px}#portrait-motion{font-size:8px}.footer-meta{font-size:8px;line-height:1.8;gap:16px}.contact-privacy{font-size:10px}.certificate-card small{font-size:10px}}
@media(max-width:360px){.site-header{gap:10px}.header-actions{gap:6px}.header-contact{font-size:9px;gap:8px;padding:8px 10px}.identity-copy h2{font-size:34px}.identity-actions{gap:15px}.identity-primary{font-size:10px;padding:12px 13px;gap:10px}.identity-art{height:375px}.identity-photo-caption{gap:8px;padding:0 7px}.identity-photo-caption>span:nth-child(2){font-size:6px}.identity-art-label{font-size:6px}.identity-topline{font-size:7px}.identity-topline .availability{font-size:6px;max-width:113px}}
@media(min-width:901px) and (max-height:800px){.identity-hero{padding-top:4px}.identity-topline{padding:12px 0}.identity-layout{padding:22px 0 28px;min-height:0}.identity-hero h1{font-size:clamp(85px,8vw,116px);margin-bottom:17px}.identity-copy h2{font-size:38px;margin-bottom:18px}.identity-eyebrow{margin-bottom:19px}.identity-copy>p{font-size:14px;line-height:1.75;margin-bottom:22px}.identity-socials{margin-top:23px}.identity-art{height:min(64vh,480px)}.identity-art-label{font-size:7px}.identity-footer{padding:15px 0 19px;font-size:8px}}
.identity-copy,.identity-art{min-width:0}
@media(max-width:700px){.identity-layout{grid-template-columns:minmax(0,1fr)}}
@media(max-width:360px){.identity-hero h1{font-size:clamp(64px,21.8vw,77px)}}
@media(min-width:901px) and (max-height:800px){.identity-art{width:min(100%,64vh)}}
@media(prefers-reduced-motion:reduce){.identity-portrait,.identity-primary,.theme-icon svg{transition:none!important}.theme-switching *{transition:none!important}}

/* The portrait stays upright and free of stickers at every breakpoint. */
.identity-portrait{left:12%;right:10%;top:4%;bottom:10%;border-width:1px;border-radius:3px}
.identity-photo-caption{gap:12px;padding:0 15px}
.identity-photo-caption>span:last-child{font-size:8px}
@media(max-width:600px){.identity-photo-caption{padding:0 11px;gap:8px}.identity-photo-caption strong{font-size:11px}.identity-photo-caption small{font-size:7px}.identity-photo-caption>span:last-child{font-size:7px}}
@media(max-width:360px){.identity-photo-caption strong{font-size:10px}.identity-photo-caption>span:last-child{display:none}}
@media(prefers-reduced-motion:reduce){.portrait-guide:after{animation:none!important}}
