:root{}html[data-theme=night]{}
body #language-toggle,body #time,body .top-cv,body .social-link,body .quick-overview-trigger{border-width:1px!important;border-style:solid!important;backdrop-filter:none!important;opacity:1;min-height:46px;font:600 14px var(--font-ui);cursor:pointer}
body #language-toggle,body #time{border-radius:12px;padding:12px 15px;margin:0;white-space:nowrap}
.top-cv{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:12px 16px;border-radius:12px;text-decoration:none;white-space:nowrap}.cv-mobile{display:none}
.content-study>header{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);gap:0;direction:ltr!important}.content-study>header .location{grid-column:1;grid-row:1;justify-self:end;min-width:0;margin:0 20px 0 0;text-align:right;line-height:1.6}.content-study>header .header-actions{grid-column:2;grid-row:1;display:flex;align-items:center;gap:12px;direction:ltr}
body .hero-actions{display:flex;flex-wrap:wrap;align-items:center;gap:12px}
body .social-link{width:52px;height:52px;min-width:52px;padding:0;display:inline-flex;align-items:center;justify-content:center;border-radius:50%;text-decoration:none}
.social-link svg{width:23px;height:23px;fill:currentColor}.social-link svg.mail-icon{fill:none;stroke:currentColor;stroke-width:1.8}.social-link .linkedin-mark{font:bold 25px var(--font-ui);letter-spacing:-1px}
.quick-overview-trigger{padding:14px 19px;border-radius:12px;display:inline-flex;align-items:center;gap:8px}
a:focus-visible,button:focus-visible{outline-width:3px;outline-style:solid;outline-offset:4px}
.page-loader{position:fixed;inset:0;z-index:9999;background:#102c38;color:#f5f4ed;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:20px;padding:30px;text-align:center;transition:opacity .3s}.page-loader.finished{opacity:0;pointer-events:none}.loader-mark{font:700 44px var(--font-ui);letter-spacing:-3px}.loader-track{width:160px;height:3px;border-radius:4px;background:#ffffff26;overflow:hidden}.loader-track:after{content:"";display:block;width:45%;height:100%;background:#dfc586;animation:loading-drift 1.2s ease-in-out infinite alternate}.loader-name{font:600 18px var(--font-ui)}.loader-status{font:14px var(--font-ui);color:#becdce}.loader-skip{margin-top:12px;border:1px solid #91a8aa;background:#203f48;color:#f4f3ed;border-radius:9px;padding:12px 18px;cursor:pointer}.page-loading{overflow:hidden}.page-loader~*{scroll-margin-top:22px}
@keyframes loading-drift{to{transform:translateX(125%)}}
.world{position:fixed;inset:0;z-index:-1;overflow:hidden;background:linear-gradient(#315d89,#a4bdcf)}#scene,#scene canvas{position:absolute;inset:0;width:100%;height:100%}.city-back{position:absolute;inset:0;--night:0;background:none!important;visibility:hidden}.city-back:after{display:none!important}.candidate-composite{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center bottom}.readability{position:absolute;inset:0;background:linear-gradient(90deg,#071b3055,transparent 70%)}html[data-scene-fallback=true] .world{background:linear-gradient(#375f7d,#aac2ce)}html[data-scene-fallback=true] .city-back:not([data-candidate=ready]){visibility:visible!important;background:url(/assets/riyadh-candidate-day-cutout-v1.png) center bottom/cover no-repeat!important}
.detail-page{color:var(--control-ink)}.detail-page:before{display:none!important}.detail-page>main{border-width:1px;border-style:solid;position:relative;z-index:1}html[data-theme=night] .detail-page>main{}html[data-theme=night] .detail-page p,html[data-theme=night] .detail-page figcaption{}html[data-theme=night] .detail-page a,html[data-theme=night] .detail-page button{}html[data-theme=night] .detail-page .notice{}.detail-page header{align-items:center;gap:12px;flex-wrap:wrap}.detail-page header .detail-actions{display:flex;gap:9px;align-items:center;margin-left:auto}
.quick-overview{width:min(760px,calc(100vw - 32px));max-height:85dvh;padding:30px;border:1px solid var(--control-border);border-radius:20px;color:var(--control-ink);background:var(--control-bg);overflow:auto}.quick-overview::backdrop{backdrop-filter:blur(5px)}.overview-heading{display:flex;justify-content:space-between;align-items:center;gap:20px}.overview-heading h2{font-size:28px;margin:0}.overview-close{width:44px;height:44px;border:1px solid var(--control-border);border-radius:50%;color:inherit;font-size:25px;cursor:pointer}.overview-lead{line-height:1.7;font-size:17px}.overview-facts{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:22px 0}.overview-facts>div{border:1px solid var(--control-border);border-radius:12px;padding:16px}.overview-facts dt{font-size:13px;opacity:.8;margin-bottom:9px}.overview-facts dd{margin:0;line-height:1.6;font-size:17px;font-weight:600}.overview-stack{line-height:1.9;font-size:16px}.overview-actions{display:flex;flex-wrap:wrap;gap:10px}.overview-actions a{background:var(--control-ink);color:var(--control-bg);padding:13px 18px;border-radius:9px;text-decoration:none;font-size:15px}
@media(max-width:800px){.content-study>header{padding:18px 18px;gap:0}.content-study>header .header-actions{gap:8px}.content-study>header .location{display:none}.content-study>header .wordmark{margin-right:auto;font-size:23px}.content-study>header #language-toggle,.content-study>header #time,.top-cv{font-size:12px;padding:11px 10px;min-height:44px}.cv-desktop{display:none}.cv-mobile{display:inline}.content-study .hero{height:auto;min-height:100svh;max-height:none;padding:145px 24px 90px}.content-study .hero h1{font-size:clamp(35px,8.8vw,52px);line-height:1.14;letter-spacing:-1.6px;overflow-wrap:normal}.content-study .professional-focus{font-size:21px;line-height:1.4;margin-top:20px}.content-study .hero p{font-size:16px;line-height:1.7;max-width:34em;margin-bottom:25px}.content-study .hero-footer{left:24px;right:24px;bottom:26px;font-size:8px;gap:20px}.content-study .hero-footer>span:last-child{max-width:90px;text-align:end}.content-study .hero-actions{gap:10px}.quick-overview-trigger{font-size:13px!important;padding:13px 15px}.social-link{width:48px!important;height:48px!important;min-width:48px!important}.content-study .content{width:calc(100% - 24px)}.content-study .panel-body{padding:30px 20px}.content-study h2{font-size:32px}.content-study .readable-project .work-copy{padding:23px 18px 0}.content-study .readable-project h3{font-size:23px;line-height:1.4}.content-study .readable-project .work-copy>p:not(.project-domain){font-size:16px;line-height:1.7}.content-study .tags span{font-size:12px;padding:7px 9px}.animated-project-cover iframe{aspect-ratio:2}.detail-page>main{margin:12px!important;padding:20px!important;max-width:calc(100% - 24px);overflow:hidden}.detail-page h1{font-size:28px;overflow-wrap:anywhere}.detail-page h2{font-size:23px}.detail-page p{font-size:16px;line-height:1.8}.detail-page header{gap:10px}.detail-page header a,.detail-page header button{font-size:12px;padding:11px 10px}.detail-page iframe{aspect-ratio:1.55;min-height:220px}.quick-overview{padding:22px}.overview-facts{grid-template-columns:1fr}.overview-heading h2{font-size:24px}html[dir=rtl] .content-study .hero h1{font-size:38px;line-height:1.3;letter-spacing:0}}
@media(prefers-reduced-motion:reduce){.loader-track:after{animation:none}.page-loader{transition:none}}

.diagram-scroll{overflow:auto;max-width:100%;border-radius:16px}.diagram-tools{display:flex;gap:12px;justify-content:space-between;align-items:center;margin-top:10px;color:var(--control-ink);font:13px var(--font-ui)}.diagram-tools a{padding:9px 12px;font-size:13px!important;white-space:nowrap}.swipe-hint{display:none}@media(max-width:800px){.diagram-scroll{overflow-x:auto;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch}.detail-page .diagram-scroll iframe{width:950px;min-width:950px;aspect-ratio:2;height:475px;border-radius:12px}.swipe-hint{display:inline;font-size:12px;line-height:1.5}.diagram-tools{align-items:flex-start}.detail-page>main{overflow:visible}.detail-page .tags{min-width:0}.diagram-scroll:focus-visible{outline-width:3px;outline-style:solid;outline-offset:3px}}
html[data-theme=night][data-scene-fallback=true] .world{background:#07142a}html[data-theme=night][data-scene-fallback=true] .city-back:not([data-candidate=ready]){background-image:url(/assets/riyadh-candidate-night-fewer-lights-v2.png)!important}

/* Local midnight-slate review; retain the accepted scene and card geometry. */
html[data-theme=night] .content-study{}
html[data-theme=night] .content-study .work-card,
html[data-theme=night] .content-study .readable-skills article,
html[data-theme=night] .content-study .clear-cert-grid article,
html[data-theme=night] .content-study .boot-card{}
html[data-theme=night] .content-study .skill-items span,
html[data-theme=night] .content-study .tags span{}
html[data-theme=night] .skill-inline-choice{}
html[data-theme=night] .skill-motion-hint{}
html[data-theme=night] .skill-group-art{}
html[data-theme=night] .detail-page>main,
html.detail-background-trial[data-theme=night] .detail-page>main{}
html[data-theme=night] .detail-page p,html[data-theme=night] .detail-page figcaption{}
html[data-theme=night] .detail-page a,html[data-theme=night] .detail-page button{}
html[data-theme=night] .detail-page .notice{}
html.detail-background-trial[data-theme=night] .detail-page .tags>span{}

/* Fixed bilingual footprints: labels fade, while button surfaces stay still. */
.content-study>header .top-cv{width:150px;flex:0 0 150px}
.content-study>header #language-toggle{width:92px;flex:0 0 92px}
.content-study>header #time{width:150px;flex:0 0 150px}
.content-study>header #language-toggle,.content-study>header #time{display:inline-flex;align-items:center;justify-content:center}
.header-control-label{display:inline-block;white-space:nowrap}
.quick-overview .overview-heading,.architecture-viewer .viewer-toolbar{position:sticky;top:-1px;z-index:2;background:var(--control-bg);padding-block:8px}
body header .wordmark{min-width:44px;min-height:44px;display:inline-flex;align-items:center}
body footer>a{min-height:44px;display:inline-flex;align-items:center;padding-inline:4px}
@media(max-width:800px){
 .hero-actions .quick-overview-trigger{width:110px;justify-content:center;flex-shrink:0}
 .content-study>header .top-cv{width:50px;flex-basis:50px}
 .content-study>header #language-toggle{width:78px;flex-basis:78px}
 .content-study>header #time{width:126px;flex-basis:126px}
}
@media(max-width:360px){
 .content-study>header{padding-inline:10px;gap:0}.content-study>header .header-actions{gap:4px}
 .content-study>header .top-cv{width:44px;flex-basis:44px;padding-inline:6px}
 .content-study>header #language-toggle{width:66px;flex-basis:66px;padding-inline:6px}
 .content-study>header #time{width:114px;flex-basis:114px;padding-inline:6px}
}

/* Theme surfaces interpolate together; scene timing and geometry stay independent. */
:root{--surface-fade:1200ms}
:is(.panel,.panel-title,.work-card,.boot-card,.readable-skills article,.clear-cert-grid article,.tags span,.skill-inline-choice,.top-cv,#language-toggle,#time,.social-link,.quick-overview-trigger,.quick-overview,.overview-heading,.overview-facts>div,.overview-actions a,.architecture-viewer,.viewer-toolbar,.detail-page>main,.notice,.detail-page header a,.detail-return a,.mobile-architecture,.mobile-map-node,.mobile-map-open,.mobile-preview-switcher,.mobile-preview-switcher a){transition:background-color var(--surface-fade) ease,color var(--surface-fade) ease,border-color var(--surface-fade) ease,box-shadow var(--surface-fade) ease}
:is(.panel,.detail-page,.quick-overview,.architecture-viewer) :is(h1,h2,h3,h4,p,figcaption,strong,.header-control-label,.skill-tag-label,.credential-state,.program-provider,.program-hours){transition:color var(--surface-fade) ease,background-color var(--surface-fade) ease,border-color var(--surface-fade) ease}
@media(prefers-reduced-motion:reduce){:root{--surface-fade:0ms}}