@font-face{font-family:Journey Serif;src:local("Iowan Old Style"),local("Palatino Linotype"),local("Book Antiqua"),local("Georgia");font-display:swap}
:root{color-scheme:dark;--cream:#f9ead3;--muted:#ddc4a3;--gold:#d9ad73;--ink:#402e24;--scene-x:0px;--scene-y:0px;--storm-density:0;font-family:"Segoe UI",Arial,sans-serif;font-synthesis:none}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:#38271f}body{height:100svh;overflow:hidden;color:var(--cream)}button,a,summary{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer;color:inherit;border:0}a{color:inherit}button:focus-visible,a:focus-visible,summary:focus-visible{outline:2px solid #ffdfa3;outline-offset:7px}button:disabled{cursor:wait}[hidden]{display:none!important}.sr-only{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}.skip-link{position:fixed;left:20px;top:-100px;z-index:100;background:#f8e5bf;color:#33241a;padding:15px}.skip-link:focus{top:15px}
.site-header{position:fixed;top:0;left:0;width:100%;padding:33px 5.3%;z-index:35;display:flex;align-items:center;justify-content:space-between;gap:24px}.brand{display:flex;gap:15px;align-items:center;text-decoration:none;font-size:11px;font-weight:600;letter-spacing:2px;text-shadow:0 1px 10px #41271c66}.brand svg{width:38px;height:38px;fill:none;stroke:var(--cream);stroke-width:1}.brand small{display:block;font-size:8px;font-weight:400;letter-spacing:2.5px;margin-top:7px;color:#ecd7bb}
main,.scene{position:absolute;inset:0;overflow:clip}main:focus{outline:none}.scene-art{width:100%;height:100%;object-fit:cover;display:block}.landscape{position:absolute;left:50%;top:50%;width:max(100vw,177.778svh);height:max(100svh,56.25vw);transform:translate(calc(-50% + var(--scene-x)),calc(-50% + var(--scene-y))) scale(1.035);transition:transform 1.1s cubic-bezier(.3,.1,.25,1);will-change:transform}.scene-shade{position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,#251e1a65 0%,#2b231c12 45%,transparent 66%),linear-gradient(0deg,#2a1b1c9e 0%,transparent 27%,transparent 70%,#241d1845)}.introduction{position:absolute;left:8.4%;top:29%;pointer-events:none;max-width:580px;transition:opacity 1.1s,transform 1.1s}.eyebrow{font-size:9px;font-weight:500;letter-spacing:3px;display:flex;align-items:center;gap:12px;margin:0 0 25px;color:#f2d7b3}.eyebrow>span{width:25px;height:1px;background:#e5be8b}h1,h2,h3,p{margin-top:0}h1,h2,h3{font-family:"Journey Serif",Georgia,serif;font-weight:400}h1{font-size:clamp(72px,7.8vw,122px);line-height:.98;letter-spacing:-4px;margin:0 0 29px;text-shadow:0 3px 45px #3c241f22}h1>span{display:block}.title-period{color:#dfaa6d}.welcome{font-family:Georgia,serif;font-size:16px;line-height:1.85;color:#f0d7bb;letter-spacing:.2px;margin-bottom:25px}.horizon-note{position:absolute;right:7%;bottom:16%;font-family:Georgia,serif;font-style:italic;font-size:12px;letter-spacing:.2px;color:#e4c9a4;opacity:.8}
.scene-footer{position:fixed;left:5.3%;right:5.3%;bottom:29px;display:flex;align-items:center;justify-content:space-between;z-index:10;font-size:8px;letter-spacing:2px;color:#ead4b7;pointer-events:none}.scene-footer>span{display:flex;align-items:center;gap:15px}.footer-rule{width:31px;height:1px;background:#ddbb8b88}.footer-right{font-family:Georgia,serif;letter-spacing:.3px;font-size:11px}.footer-right svg{width:30px;height:30px;margin-left:19px;fill:none;stroke:#d7b382;stroke-width:1}
#sand{position:fixed;inset:0;pointer-events:none;z-index:23;width:100%;height:100%}#storm{position:fixed;inset:-5%;z-index:21;pointer-events:none;opacity:var(--storm-density);background:linear-gradient(110deg,#c49766e8,#d8af7de0 45%,#bc8f61ed);overflow:hidden}.dust-cloud{position:absolute;inset:-40%;background:radial-gradient(ellipse at 30% 50%,#f1d3a4ad,transparent 42%),radial-gradient(ellipse at 70% 20%,#926e4b99,transparent 50%);filter:blur(35px);transform:rotate(-18deg);animation:cloud-drift 3s linear infinite}.cloud-two{opacity:.8;animation-direction:reverse;animation-duration:4s;background:radial-gradient(ellipse at 60% 70%,#f7debaaa,transparent 50%)}@keyframes cloud-drift{from{translate:-14% 5%}to{translate:14% -5%}}.skip-intro{position:fixed;left:50%;bottom:80px;transform:translateX(-50%);z-index:40;background:#523c2c80;border:1px solid #f2d2a566;border-radius:30px;padding:12px 21px;font-size:11px;letter-spacing:1px;backdrop-filter:blur(8px)}.skip-intro span{margin-left:17px}.intro-active .introduction{opacity:0;transform:translateY(15px)}.intro-active .tent-hotspot{opacity:0;pointer-events:none}.intro-active .horizon-note{opacity:0}.transition-veil{position:fixed;inset:0;z-index:29;background:#27170e;opacity:0;pointer-events:none;transition:opacity .4s}.entering .introduction,.entering .tent-label{opacity:0}.scene-changing .transition-veil{opacity:1}
.interior-art{position:absolute;width:100%;height:100%;object-fit:cover;object-position:center 57%}.interior-shade{position:absolute;inset:0;background:linear-gradient(0deg,#1e100d99,transparent 40%,#170e0b66),radial-gradient(ellipse at center,#30180c00 30%,#1b0c0b5e)}
dialog{padding:0;border:1px solid #cba975;border-radius:3px;background:#f1e1c4;color:var(--ink);width:min(670px,calc(100vw - 36px));max-height:calc(100svh - 70px);overflow-y:auto;box-shadow:0 25px 100px #10090599;scrollbar-color:#b2946d #eddec3}dialog::backdrop{background:#20150fe0;backdrop-filter:blur(9px)}dialog[open]{animation:panel-in .25s ease-out}@keyframes panel-in{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.panel-paper{padding:49px 49px 25px;background-image:radial-gradient(ellipse at 80% 5%,#fff9e87a,transparent 60%),repeating-linear-gradient(22deg,#78562e03 0px,#78562e03 1px,transparent 1px,transparent 4px);min-height:350px}.close-panel{position:absolute;right:18px;top:16px;width:34px;height:34px;display:grid;place-items:center;background:none;border:1px solid #a2876355;border-radius:50%;font-size:24px;font-weight:300;color:#6e5235}.close-panel:hover{background:#a77e3f15}.panel-paper .eyebrow{color:#98734a;font-size:8px;letter-spacing:2.6px;margin-bottom:17px}.panel-paper h2{font-size:42px;line-height:1.12;letter-spacing:-1px;margin-bottom:27px;color:#4a3020}.panel-paper h3{font-size:25px;line-height:1.25;margin-bottom:12px}.panel-paper p{font-size:14px;line-height:1.85;color:#68533d;margin-bottom:18px}.panel-paper .editable-note{font-size:10px;line-height:1.6;letter-spacing:.2px;color:#8d7254;border-left:2px solid #ba955e;padding-left:13px;margin-bottom:26px}.paper-footer{display:flex;align-items:center;justify-content:space-between;border-top:1px solid #b796633e;margin-top:36px;padding-top:18px;font-family:Georgia,serif;font-size:11px;color:#8d704d}.project-entry+.project-entry{border-top:1px solid #b7966355;padding-top:27px;margin-top:30px}.project-image{width:100%;height:auto;max-height:260px;object-fit:cover;border-radius:2px;margin-bottom:20px}.technologies{display:flex;flex-wrap:wrap;gap:7px;margin:16px 0}.technologies span{font-size:10px;border:1px solid #b18c573f;border-radius:20px;padding:5px 10px;color:#81603a}.panel-links{display:flex;flex-wrap:wrap;gap:12px;margin:22px 0}.panel-links a{display:inline-flex;align-items:center;gap:12px;border:1px solid #b18a53;padding:11px 15px;font-size:11px;text-decoration:none;color:#583c25}.panel-links a:hover{background:#dfc9a4}.resume-item{margin-bottom:24px}.resume-item h3{font-size:21px}.contact-email{font-family:Georgia,serif;font-size:clamp(18px,4vw,29px);overflow-wrap:anywhere}.panel-paper :focus-visible{outline-color:#81542c}.placeholder-hint{font-size:12px!important;color:#8e7659!important}.noscript-note{position:fixed;bottom:65px;left:20px;right:20px;z-index:50;background:#f3dfb9;color:#382719;padding:20px}
@media(min-aspect-ratio:19/10){.introduction{top:24%}h1{font-size:15svh}.welcome{font-size:14px}}
@media(max-width:800px){.site-header{padding:25px 6%}.brand{font-size:9px;letter-spacing:1.4px;gap:10px}.brand small{font-size:7px;letter-spacing:1.5px}.introduction{left:7%;top:29%}h1{font-size:80px}.scene-footer{left:6%;right:6%}.horizon-note{display:none}}
@media(max-width:600px){.site-header{padding:22px 6%;gap:14px}.brand svg{width:29px;height:29px}.brand{font-size:8px;letter-spacing:1.3px}.brand small{font-size:6px;letter-spacing:1.4px}.landscape{transform:translate(calc(-77% + var(--scene-x)),calc(-50% + var(--scene-y))) scale(1.035)}.scene-shade{background:linear-gradient(180deg,#251c1c45,transparent 20%,transparent 60%,#2d1b1baa),linear-gradient(90deg,#2b22202b,transparent)}.introduction{left:8%;top:19%;max-width:85%}.eyebrow{font-size:7px;letter-spacing:2.5px;margin-bottom:19px;gap:9px}.eyebrow>span{width:17px}h1{font-size:clamp(61px,13.7vw,83px);letter-spacing:-3px;line-height:.98;margin-bottom:20px}.welcome{font-size:13px;line-height:1.7;margin-bottom:14px}.scene-footer{bottom:23px;font-size:7px;letter-spacing:1.6px}.scene-footer>span{gap:9px}.footer-rule{width:22px}.footer-right{font-size:0}.footer-right svg{width:25px;height:25px;margin:0}.interior-art{object-position:50% 50%}.interior-shade{background:linear-gradient(0deg,#1e100db0 10%,#2b160f44 45%,#170e0b88)}.panel-paper{padding:49px 27px 23px}.panel-paper h2{font-size:35px}.panel-paper p{font-size:13px}.skip-intro{bottom:72px}}
@media(max-height:650px) and (max-width:600px){.introduction{top:19%}h1{font-size:57px;margin-bottom:12px}.welcome{font-size:12px}.introduction .eyebrow{margin-bottom:13px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.landscape{will-change:auto}#sand,#storm{display:none}.intro-active .introduction,.intro-active .tent-hotspot{opacity:1;transform:none}}.close-panel{width:44px;height:44px;right:12px;top:10px}

/* Keep the tent visible on portrait tablets as well as phones. */
@media (min-width:601px) and (max-aspect-ratio:6/5){
 .landscape{transform:translate(calc(-72% + var(--scene-x)),calc(-50% + var(--scene-y))) scale(1.035)}
 .introduction{top:16%;left:7%}
}
.site-header{background:linear-gradient(#25171044,transparent)}

.horizon-note{bottom:12%}

/* Aladdin-style lettering, served locally with the rest of the site. */
@font-face{font-family:"Aladdin";src:url("assets/fonts/Aladdin.ttf") format("truetype");font-weight:400;font-style:normal;font-display:swap}
.introduction h1{font-family:"Aladdin",Georgia,serif;font-size:clamp(76px,8.3vw,130px);line-height:1.03;letter-spacing:0;margin-bottom:25px;text-shadow:0 2px 24px #3b241f33}
.introduction h1>span{white-space:nowrap}
.title-period{margin-left:3px}
/* The canvas now supplies textured, advected dust instead of a flat color wash. */
#storm{background:none}
.dust-cloud{display:none}
@media(min-aspect-ratio:19/10){.introduction h1{font-size:14svh}}
@media(max-width:800px){.introduction h1{font-size:clamp(65px,10vw,90px)}}
@media(max-width:600px){.introduction h1{font-size:clamp(57px,14vw,83px);line-height:1.04;margin-bottom:20px;letter-spacing:0}}
@media(max-height:650px) and (max-width:600px){.introduction h1{font-size:54px;margin-bottom:12px}}

/* The world behaves as an illustration; opened pages retain normal text selection. */
.scene,.site-header,.scene-footer,#intro-cinema,#storm,#entry-curtains,.sound-toggle{-webkit-user-select:none;user-select:none}
.scene img,.scene svg,.scene canvas{-webkit-user-drag:none}
#content-panel{-webkit-user-select:text;user-select:text}
#content-panel button{-webkit-user-select:none;user-select:none}
.sound-toggle{position:fixed;top:32px;right:5.3%;z-index:40;display:flex;align-items:center;justify-content:center;gap:9px;min-width:94px;min-height:44px;padding:9px 13px;color:#f1d9b2;background:#38251dba;border:1px solid #c89c5a80;font-size:9px;letter-spacing:1px;box-shadow:0 3px 0 #26170d44}
.sound-toggle svg{width:20px;height:20px;fill:currentColor}
.sound-toggle .sound-slash{display:none}
.sound-toggle[aria-pressed="false"]{color:#c4ad8d}
.sound-toggle[aria-pressed="false"] .sound-waves{display:none}
.sound-toggle[aria-pressed="false"] .sound-slash{display:block}
.sound-toggle:hover{background:#553822}
.sound-toggle:active{translate:0 2px;box-shadow:none}
.entering .sound-toggle,.scene-changing .sound-toggle{opacity:0;pointer-events:none}
@media(max-width:600px){.sound-toggle{top:17px;right:6%;min-width:44px;padding:10px}.sound-toggle span{display:none}}

/* A brass-framed invitation sits beneath the entrance, on the same scene anchor. */
.tent-hotspot{position:absolute;left:61%;top:33%;width:36%;height:45%;padding:0;background:none;border-radius:45% 45% 10% 10%;transition:opacity 1s .3s;touch-action:manipulation}
.tent-hotspot:focus-visible{outline:none}
.tent-label{position:absolute;top:89%;left:45%;translate:-50% 0;width:248px;min-height:80px;display:flex;align-items:center;justify-content:space-between;gap:15px;padding:17px 22px 17px 26px;text-align:left;white-space:nowrap;color:#4a2d20;filter:drop-shadow(0 4px 0 #26170d66);transform:translateY(0);transition:transform .16s steps(2,end),opacity .22s;isolation:isolate}
.tent-label::before{content:"";position:absolute;left:50%;bottom:calc(100% + 3px);width:1px;height:16px;background:#c99b5f}
.tent-label::after{content:"";position:absolute;left:calc(50% - 3px);bottom:calc(100% + 20px);width:6px;height:6px;border:1px solid #e6bd7d;background:#744329;transform:rotate(45deg)}
.tent-frame{position:absolute;inset:0;width:100%;height:100%;z-index:-2;overflow:visible}
.tent-frame-edge{stroke-width:1;transition:stroke .3s,stroke-width .3s}
.tent-copy{display:flex;flex-direction:column;gap:6px}
.tent-kicker{font-size:7px;font-weight:600;line-height:1;letter-spacing:2.1px;color:#805631}
.tent-title{font-family:Georgia,"Times New Roman",serif;font-size:22px;font-weight:400;line-height:1.12;letter-spacing:-.55px;text-shadow:0 1px #fff0ce66}
.tent-arrow{width:35px;height:35px;flex:0 0 35px;display:grid;place-items:center;border:1px solid #7d512c;border-radius:0;background:#503023;box-shadow:inset 0 2px #9a6b43;clip-path:polygon(4px 0,calc(100% - 4px) 0,calc(100% - 4px) 4px,100% 4px,100% calc(100% - 4px),calc(100% - 4px) calc(100% - 4px),calc(100% - 4px) 100%,4px 100%,4px calc(100% - 4px),0 calc(100% - 4px),0 4px,4px 4px)}
.tent-arrow svg{width:21px;height:21px;fill:#f5d6a0;stroke:none;transition:transform .16s steps(2,end)}
.tent-hotspot:focus-visible .tent-label{filter:drop-shadow(0 6px 0 #26170d80);transform:translateY(-4px)}
.tent-hotspot:focus-visible .tent-frame-edge{stroke:#fff2cd;stroke-width:2}
.tent-hotspot:focus-visible .tent-arrow svg{transform:translateX(2px)}
@media(hover:hover) and (pointer:fine){
 .tent-hotspot:hover .tent-label{transform:translateY(-4px);filter:drop-shadow(0 6px 0 #26170d80)}
 .tent-hotspot:hover .tent-arrow{background:#6a4229}
 .tent-hotspot:hover .tent-arrow svg{transform:translateX(2px)}
}
.tent-hotspot:active .tent-label{transform:translateY(2px);transition-duration:.12s}
.horizon-note{bottom:8.5%}
.landscape{transition:transform .3s ease-out}
@media(max-width:600px){.tent-label{width:224px;min-height:74px;padding:15px 19px 15px 23px;top:92%}.tent-title{font-size:20px}.tent-kicker{font-size:6.5px;letter-spacing:1.8px}.tent-copy{gap:5px}.tent-arrow{width:32px;height:32px;flex-basis:32px}}
@media(max-height:650px) and (max-width:600px){.tent-label{top:83%;width:216px;min-height:68px;padding:13px 18px 13px 22px}.tent-title{font-size:19px}}
@media(max-height:500px) and (min-width:601px){.tent-label{width:220px;min-height:64px;padding:11px 20px 11px 23px;top:79%}.tent-title{font-size:20px}.tent-kicker{font-size:6px}.tent-label::before{height:13px}.tent-label::after{bottom:calc(100% + 16px)}.horizon-note,.footer-right{visibility:hidden}}

/* Cached low-resolution cloth, moved on whole pixels by two compositor layers. */
#entry-curtains{position:fixed;inset:0;z-index:45;overflow:hidden;pointer-events:none;contain:strict}
.entry-drape{position:absolute;top:0;image-rendering:pixelated;will-change:transform}
.entry-drape-left{left:0;z-index:2}
.entry-drape-right{right:0;z-index:1}
.entering .site-header,.entering .scene-footer{opacity:0;transition:opacity .22s}
.entering .introduction,.entering .tent-label{transition:opacity .22s}

/* The collection shares the exterior's pixel grid, brass edges and parchment. */
.back-button{position:absolute;left:5.3%;top:116px;min-height:44px;display:inline-flex;align-items:center;gap:10px;padding:11px 16px;background:none;color:#ecd3a6;font-size:10px;letter-spacing:.5px;isolation:isolate}
.back-button::before{content:"";position:absolute;inset:0;z-index:-1;background:#302019e8;border:1px solid #c2955d;clip-path:polygon(5px 0,calc(100% - 5px) 0,calc(100% - 5px) 5px,100% 5px,100% calc(100% - 5px),calc(100% - 5px) calc(100% - 5px),calc(100% - 5px) 100%,5px 100%,5px calc(100% - 5px),0 calc(100% - 5px),0 5px,5px 5px)}
.back-button svg{width:16px;height:16px;fill:currentColor}.back-button:hover::before{background:#51342a}
.interior-heading{position:absolute;top:20%;left:6%;right:6%;text-align:center;pointer-events:none;text-shadow:0 2px 0 #28160f,0 4px 12px #28160f80}
.interior-heading .eyebrow{justify-content:center;gap:16px;font-size:8px;letter-spacing:3.2px;margin-bottom:18px;color:#e4c18a}
.interior-heading .eyebrow::before,.interior-heading .eyebrow::after{content:"";width:30px;height:1px;background:#bc8d53}
.interior-heading h2{font-family:"Aladdin",Georgia,serif;font-size:clamp(44px,4.5vw,72px);font-weight:400;line-height:1.12;letter-spacing:0;margin-bottom:13px;color:#fae8c9}
.interior-heading>p:last-child{font-family:Georgia,serif;font-style:italic;font-size:15px;line-height:1.6;letter-spacing:.2px;color:#e2c69c;margin-bottom:0}
.collection{--object-size:148px;position:absolute;left:50%;bottom:15%;translate:-50% 0;width:min(960px,84vw);display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(18px,2.5vw,42px);align-items:end}
.collection-object{position:relative;display:flex;flex-direction:column;align-items:center;padding:0;background:none;color:inherit;touch-action:manipulation}
.object-art{display:block;width:var(--object-size);height:var(--object-size);margin:0 auto 12px;overflow:visible;shape-rendering:crispEdges;image-rendering:pixelated;transition:transform .16s steps(2,end)}
.object-caption{position:relative;isolation:isolate;display:flex;flex-direction:column;justify-content:center;gap:6px;width:100%;max-width:190px;min-height:64px;padding:12px 46px 12px 14px;text-align:left;color:#482b20;filter:drop-shadow(0 4px 0 #24150d80);transition:transform .16s steps(2,end)}
.object-caption::before,.object-caption::after{content:"";position:absolute;clip-path:polygon(7px 0,calc(100% - 7px) 0,calc(100% - 7px) 4px,100% 4px,100% calc(100% - 4px),calc(100% - 7px) calc(100% - 4px),calc(100% - 7px) 100%,7px 100%,7px calc(100% - 4px),0 calc(100% - 4px),0 4px,7px 4px)}
.object-caption::before{inset:0;z-index:-2;background:#c59b61;border:2px solid #43281e}
.object-caption::after{inset:4px;z-index:-1;background:#ecd3a4;border-top:2px solid #fae5bd;border-bottom:2px solid #b88c56}
.object-caption small{font-size:6.5px;line-height:1.2;font-weight:500;letter-spacing:1.6px;color:#795333}
.object-caption strong{font-family:Georgia,serif;font-size:20px;line-height:1.1;font-weight:400;white-space:nowrap}
.caption-arrow{position:absolute;right:13px;top:50%;translate:0 -50%;width:23px;height:23px;display:grid;place-items:center;background:#5a3726;color:#f4ddb0;clip-path:polygon(3px 0,calc(100% - 3px) 0,calc(100% - 3px) 3px,100% 3px,100% calc(100% - 3px),calc(100% - 3px) calc(100% - 3px),calc(100% - 3px) 100%,3px 100%,3px calc(100% - 3px),0 calc(100% - 3px),0 3px,3px 3px)}
.caption-arrow svg{width:16px;height:16px;transition:transform .16s steps(2,end)}
.collection-object:focus-visible{outline:none}.collection-object:focus-visible .object-caption::before{background:#fff0cd;border-color:#fff0cd}.collection-object:focus-visible .object-caption::after{background:#fae6bc}.collection-object:focus-visible .object-art{transform:translateY(-8px)}
@media(hover:hover) and (pointer:fine){.collection-object:hover .object-art{transform:translateY(-8px)}.collection-object:hover .object-caption{transform:translateY(-2px)}.collection-object:hover .object-caption::after{background:#f8e2b6}.collection-object:hover .caption-arrow svg{transform:translateX(2px)}}
.collection-object:active .object-caption{transform:translateY(2px)}
#panel-title{font-family:"Aladdin",Georgia,serif;letter-spacing:0;line-height:1.18;font-size:48px}
.close-panel{border-radius:0;background:#dfc79d;box-shadow:2px 2px 0 #ae8a5840}
@media(min-width:601px) and (max-width:900px){.collection{--object-size:124px;width:88vw;gap:20px;bottom:17%}.object-caption{padding-left:12px;padding-right:37px}.object-caption strong{font-size:18px}.object-caption small{font-size:6px;letter-spacing:1.1px}.caption-arrow{width:20px;height:20px;right:10px}}
@media(max-width:600px){
 .back-button{top:84px;left:6%;font-size:9px;padding:10px 13px}
 .interior-heading{top:19%;left:5%;right:5%}.interior-heading .eyebrow{font-size:6.5px;letter-spacing:2px;margin-bottom:15px;gap:10px}.interior-heading .eyebrow::before,.interior-heading .eyebrow::after{width:20px}
 .interior-heading h2{font-size:clamp(32px,9vw,44px);line-height:1.16;margin-bottom:11px}.interior-heading>p:last-child{font-size:12px}
 .collection{--object-size:104px;bottom:11%;width:calc(100% - 48px);max-width:390px;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 18px}
 .object-caption{min-height:60px;padding:12px 38px 12px 12px}.object-caption strong{font-size:18px}.object-caption small{font-size:6px;letter-spacing:1.3px}.caption-arrow{width:21px;height:21px;right:11px}
 #panel-title{font-size:38px}
}
@media(min-height:651px) and (max-height:740px) and (max-width:600px){.collection{--object-size:88px;bottom:12%;row-gap:18px}.object-art{margin-bottom:10px}.object-caption{min-height:56px}}
@media(max-height:650px) and (max-width:600px){
 .back-button{top:73px;min-height:38px}.interior-heading{top:22%}.interior-heading .eyebrow{margin-bottom:10px;font-size:5.5px}.interior-heading h2{font-size:29px;line-height:1.12;margin-bottom:7px}.interior-heading>p:last-child{font-size:11px}
 .collection{--object-size:72px;bottom:14%;width:calc(100% - 40px);gap:14px 16px}.object-art{margin-bottom:8px}.object-caption{min-height:50px;padding:8px 34px 8px 11px;gap:4px}.object-caption strong{font-size:16px}.object-caption small{font-size:5.5px;letter-spacing:1.1px}.caption-arrow{width:19px;height:19px;right:9px}
}
@media(max-height:500px) and (min-aspect-ratio:6/5){
 .back-button{top:87px;left:5.3%;min-height:38px;font-size:8px}.interior-heading{top:19%;left:21%;right:21%}.interior-heading .eyebrow{font-size:6px;margin-bottom:8px}.interior-heading h2{font-size:36px;margin-bottom:6px}.interior-heading>p:last-child{font-size:11px}
 .collection{--object-size:70px;bottom:18%;width:min(740px,88vw);max-width:none;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}.object-art{margin-bottom:8px}.object-caption{min-height:48px;padding:8px 32px 8px 11px;gap:4px}.object-caption strong{font-size:16px}.object-caption small{font-size:5.5px;letter-spacing:1px}.caption-arrow{width:18px;height:18px;right:9px}
}
@media(max-height:350px) and (min-aspect-ratio:6/5){.back-button{top:70px}.interior-heading{top:18%}.interior-heading h2{font-size:29px}.interior-heading .eyebrow{font-size:5px}.collection{--object-size:56px;gap:12px;bottom:18%}.object-art{margin-bottom:6px}.object-caption{min-height:44px;padding-left:9px;padding-right:25px}.object-caption strong{font-size:14px}.object-caption small{font-size:5px;letter-spacing:.6px}.caption-arrow{width:16px;height:16px;right:7px}}
@media(prefers-reduced-motion:reduce){.collection-object:hover .object-art,.collection-object:focus-visible .object-art,.collection-object:hover .object-caption{transform:none}}

/* A single clock in app.js conducts the opening and every reveal. */
.scene-plate{position:absolute;inset:0;transform:scale(var(--intro-zoom,1));transform-origin:72% 56%;filter:brightness(var(--intro-light,1));overflow:hidden}
.scene-art,.interior-art{image-rendering:pixelated}
.intro-active .scene-plate{will-change:transform}
#intro-cinema{position:fixed;inset:0;z-index:24;pointer-events:none;isolation:isolate}
.intro-darkness{position:fixed;inset:0;z-index:20;pointer-events:none;opacity:var(--intro-cover,1);background:radial-gradient(ellipse at 50% 44%,#6a482be6 0%,#37241bf5 60%,#251b17 100%);mask-image:radial-gradient(ellipse at 67% 53%,transparent calc(var(--intro-opening,0)*140% - 20%),#000 calc(var(--intro-opening,0)*140% + 7%))}
.intro-active #storm{background:radial-gradient(ellipse at 52% 47%,#b28a5860,#654329ad 70%,#523924d9);mask-image:radial-gradient(ellipse at 67% 53%,transparent calc(var(--intro-opening,0)*145% - 28%),#000 calc(var(--intro-opening,0)*145% + 12%))}
.intro-active .dust-cloud{opacity:.48}
.intro-halo{position:absolute;inset:-30%;z-index:-1;opacity:calc(var(--intro-cover,1)*.8);background:radial-gradient(ellipse at 50% 48%,#edb55b3d,transparent 46%);transform:scale(calc(1.3 - var(--intro-draw,0)*.3));mix-blend-mode:screen}
.intro-story{position:absolute;inset:0;text-align:center;opacity:var(--intro-story,0);transform:translateY(var(--intro-story-y,20px));color:#f6dfb8;text-shadow:0 3px 32px #100905}
.intro-compass{position:absolute;left:50%;top:10%;translate:-50% 0;width:clamp(54px,9svh,88px);height:auto;stroke:#e9bf7c;stroke-width:.8;overflow:visible;filter:drop-shadow(0 0 18px #d79b425c)}
.compass-orbit{stroke-dasharray:403;stroke-dashoffset:calc(403*(1 - var(--intro-draw,0)));transform:rotate(-90deg);transform-origin:center}
.compass-ring{stroke-dasharray:2 7;opacity:.5}
.compass-ticks{opacity:.65}
.compass-needle{transform:rotate(var(--intro-turn,-110deg));transform-origin:center}
.compass-fill{fill:#e7b668;stroke:none}
.intro-kicker{position:absolute;left:20px;right:20px;top:22%;font-size:8px;letter-spacing:4px;color:#e5c394;line-height:1.8}
.intro-whisper{position:absolute;left:24px;right:24px;top:73%;font:italic clamp(13px,1.2vw,18px) Georgia,serif;color:#f2d6ac;letter-spacing:.6px}
.intro-orbits{position:absolute;left:50%;top:47%;width:max(54vw,76svh);height:auto;translate:-50% -50%;stroke:#e8bc74;stroke-width:.5;opacity:calc(var(--intro-ring,0)*.52);transform:rotate(calc(var(--intro-draw,0)*28deg - 14deg)) scale(var(--intro-ring-scale,.82));overflow:visible}
.orbit-fine{opacity:.32}
.orbit-dashes{stroke-dasharray:1 13;opacity:.55;stroke-width:2}
.orbit-drawing{stroke-width:1;stroke-dasharray:2175;stroke-dashoffset:calc(2175*(1 - var(--intro-draw,0)));transform:rotate(-90deg);transform-origin:center;filter:drop-shadow(0 0 6px #e9b565)}
.orbit-diamond{fill:#ecc78d;stroke:none}
.intro-sunbreak{position:absolute;inset:-25%;opacity:var(--intro-flare,0);background:radial-gradient(ellipse at 61% 52%,#fff1caad 0%,#ffd59066 6%,#f5b05c20 26%,transparent 48%),conic-gradient(from 240deg at 61% 52%,transparent 0deg,#ffd39022 13deg,transparent 25deg,#ffd39018 33deg,transparent 49deg,#ffe1a526 60deg,transparent 76deg);mix-blend-mode:screen;transform:scale(calc(.6 + var(--intro-opening,0)*1.1));filter:blur(3px)}
.intro-progress{position:absolute;left:0;right:0;bottom:0;height:2px;background:#e5bf7f0a;opacity:calc(1 - var(--intro-chrome,0))}
.intro-progress span{display:block;height:100%;transform-origin:left;transform:scaleX(var(--intro-progress,0));background:linear-gradient(90deg,#b2874f77,#f4d7a5);box-shadow:0 0 14px #eabe76}
.intro-active .site-header,.intro-active .scene-footer{opacity:var(--intro-chrome,0);transition:none}
.intro-active .introduction{opacity:1;transform:none;transition:none}
.intro-active .introduction h1{opacity:1}
.intro-active .name-first{--line-reveal:var(--intro-first,0)}
.intro-active .name-last{--line-reveal:var(--intro-last,0)}
.intro-active .name-line{opacity:var(--line-reveal);clip-path:inset(-15% calc((1 - var(--line-reveal))*110%) -40% -15%);transform:translateY(calc((1 - var(--line-reveal))*24px));filter:blur(calc((1 - var(--line-reveal))*5px));background:linear-gradient(110deg,#f4dfbf 30%,#fff8df 43%,#ffe0a2 48%,#f4dfbf 57%);background-size:250% 100%;background-position:calc(130% - var(--intro-sweep,0)*180%) 0;background-clip:text;-webkit-background-clip:text;color:transparent}
.intro-active .introduction .eyebrow,.intro-active .welcome{opacity:var(--intro-details,0);transform:translateY(calc((1 - var(--intro-details,0))*12px))}
.intro-active .tent-hotspot,.intro-active .horizon-note{opacity:var(--intro-chrome,0);transition:none}
.intro-active .tent-hotspot{pointer-events:none}
.intro-active .scene-footer,.intro-active .site-header{pointer-events:none}
.replay-intro{pointer-events:auto;background:none;padding:12px;font-size:9px;letter-spacing:1px;color:#e2c398;min-height:44px;opacity:.8}
.replay-intro span{font-size:16px;margin-left:8px;vertical-align:-1px}
.replay-intro:hover{opacity:1;color:#fff0d0}
.skip-intro{background:#23170f85;border-color:#d7b07a66}
@media(max-width:600px){.intro-compass{width:66px;top:17%}.intro-kicker{font-size:6px;letter-spacing:2.2px;top:29%}.intro-whisper{top:67%;font-size:13px}.intro-orbits{width:130vw}.skip-intro{bottom:54px}.replay-intro{font-size:8px;letter-spacing:.4px;padding:8px}.replay-intro span{margin-left:5px}}
@media(max-height:500px) and (min-width:601px){.intro-compass{top:5%;width:43px}.intro-kicker{top:19%;font-size:6px}.intro-whisper{top:77%;font-size:12px}.skip-intro{bottom:20px}}
@media(prefers-reduced-motion:reduce){#intro-cinema,#intro-atmosphere,.replay-intro{display:none}.scene-plate{transform:none;filter:none}}

/* Layered sky: the cloud sheets move behind the transparent, fixed landscape. */
.living-sky{position:absolute;inset:0;background:linear-gradient(180deg,#9d7188 0%,#bf7d88 16%,#e99379 32%,#f6aa63 43%,#ffb449 54%,#e79962 65%,#bf795e 100%)}
.cloud-layer{position:absolute;left:-100%;top:0;width:200%;height:100%;display:flex;pointer-events:none;will-change:transform;animation:living-cloud-drift 160s linear infinite}
.cloud-layer img{display:block;flex:0 0 50%;width:50%;height:100%;object-fit:fill;image-rendering:pixelated;mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent)}
.clouds-far{top:-8%;height:86%;opacity:.36;animation-duration:290s;animation-delay:-97s}
.clouds-near{opacity:.9;animation-delay:-18s}
@keyframes living-cloud-drift{from{transform:translateX(0)}to{transform:translateX(50%)}}
.scene-still,.fabric-motion{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.fabric-motion{visibility:hidden}
.scenery-ready .fabric-motion{visibility:visible}
.scenery-ready .scene-still{opacity:0}
.lantern-glow{position:absolute;pointer-events:none;transform:translate(-50%,-50%);mix-blend-mode:screen;background:radial-gradient(ellipse,#ffd4834f 0%,#fbb84a26 24%,#ee8c2314 45%,transparent 72%);animation:lantern-flicker 2.7s linear infinite}
.outside-lantern{width:9%;height:17%;top:59.6%}
.lantern-left{left:67.9%}
.lantern-right{left:83.4%;animation-duration:3.4s;animation-delay:-1.7s}
.warm-doorway{position:absolute;left:71%;top:59%;width:13%;height:16%;pointer-events:none;mix-blend-mode:screen;background:radial-gradient(ellipse at 50% 80%,#faba4e24,transparent 68%);animation:lantern-flicker 4.3s ease-in-out infinite;animation-delay:-1s}
.interior-backdrop{position:absolute;left:50%;top:50%;width:max(100vw,177.778svh);height:max(100svh,56.25vw);transform:translate(-50%,-50%)}
.interior-backdrop .interior-art{object-position:center}
.inside-lantern{width:14%;height:25%;top:23%}
.inside-left{left:15.5%;animation-delay:-.8s}
.inside-right{left:85.8%;animation-delay:-1.9s;animation-duration:3.6s}
@keyframes lantern-flicker{0%,100%{opacity:.6}11%{opacity:.86}19%{opacity:.65}31%{opacity:.92}42%{opacity:.74}47%{opacity:.82}58%{opacity:.58}71%{opacity:.84}86%{opacity:.69}93%{opacity:.88}}
.scenery-paused .cloud-layer,.scenery-paused .lantern-glow,.scenery-paused .warm-doorway{animation-play-state:paused}
/* One shared text column for education, experience, and project entries. */
#panel-body,.resume-group,.resume-item,.project-entry{min-width:0;text-align:left;margin-inline:0;padding-inline:0}
.collection-object{text-decoration:none}
.resume-group{padding-block:24px 0;border-top:1px solid #b7966355;margin-top:28px}
.panel-paper .resume-group-title{font-family:"Segoe UI",Arial,sans-serif;font-size:10px;font-weight:600;letter-spacing:1.6px;text-transform:uppercase;margin:0 0 20px;color:#86603d}
.resume-item h4{font-family:Georgia,serif;font-size:21px;line-height:1.3;font-weight:400;margin:0 0 12px;color:#4a3020}
.resume-item:last-child{margin-bottom:0}.resume-item p{margin-inline:0}
.project-preview{display:block}.project-image{display:block;max-height:none;aspect-ratio:1280/900;object-fit:contain;border:1px solid #b7966355;background:#e2cba8}
.project-entry h3 a{text-decoration:none;text-underline-offset:5px}.project-entry h3 a:hover{text-decoration:underline}
@media(prefers-reduced-motion:reduce){.cloud-layer,.lantern-glow,.warm-doorway{animation:none!important;will-change:auto}}