:root{--paper:#f4f3ed;--ink:#303d37;--muted:#747f76;--sage:#a6b6a1;--orange:#b76e4b;--wood:#c8b69a}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font:15px/1.6 system-ui,-apple-system,sans-serif}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;cursor:pointer;border:0;background:none}button:focus-visible,a:focus-visible{outline:3px solid var(--orange);outline-offset:5px}a{color:inherit;text-decoration:none}header{height:80px;margin:0 6%;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #dcded5}.wordmark{font-size:27px;font-weight:700;letter-spacing:-2px}.wordmark span{font-size:13px;font-weight:400;letter-spacing:0;margin-left:12px}nav{display:flex;gap:32px}nav button{font-size:13px}.location{font-size:11px;color:var(--muted)}i,.live-dot{display:inline-block;width:6px;height:6px;border-radius:100%;background:#7c9574;margin-left:8px}main{max-width:1440px;margin:auto;padding:0 6%}.intro{padding:30px 0 25px;position:relative}.eyebrow{font-size:10px;font-weight:600;letter-spacing:2px;color:var(--muted)}h1{font-size:clamp(38px,4vw,56px);line-height:1.08;letter-spacing:-2.4px;font-weight:500;margin:15px 0}h1 span{color:var(--orange)}.intro>p:last-child{position:absolute;right:0;bottom:30px;font-size:13px;color:var(--muted);line-height:1.8}
/* A straight-on back wall, then a clean desk entering the foreground. */
.room{position:relative;height:620px;isolation:isolate}.back-wall{position:absolute;inset:0 0 210px;background:#eeeee6;border:1px solid #e4e5db;border-radius:12px 12px 0 0;z-index:0}.back-wall:before,.back-wall:after{content:'';position:absolute;top:0;bottom:0;width:1px;background:#e0e3d8}.back-wall:before{left:5%}.back-wall:after{right:5%}.room-floor{position:absolute;left:0;right:0;top:405px;bottom:0;background:#e7e5da;border-top:6px solid #d6d7ca;z-index:0}.window{position:absolute;right:21%;top:30px;width:23%;height:180px;border:8px solid #d9dfd2;border-radius:65px 65px 2px 2px;background:#e1ebe6;z-index:1;overflow:hidden}.window:after{content:'';position:absolute;left:49%;height:100%;border-left:5px solid #d9dfd2}.sun{width:30px;height:30px;border-radius:50%;background:#e3cba0;position:absolute;left:22%;top:28px}.hills{position:absolute;background:#c0ccba;width:140%;height:150px;bottom:-100px;left:-20%;border-radius:50%;transform:rotate(-12deg)}.window-sill{position:absolute;bottom:0;left:0;right:0;height:5px;background:#c2cdb9}.wall-note{position:absolute;right:8%;top:50px;font-size:8px;letter-spacing:1.5px;color:#98a18f;line-height:2.3;writing-mode:vertical-rl}
/* The upper row holds projects, the row immediately below holds hobbies. */
.bookshelf{position:absolute;left:11%;top:52px;width:31%;height:273px;border:9px solid var(--wood);border-radius:3px;background:#e8e4d7;box-shadow:5px 5px 0 #303d3706;z-index:2}.shelf-area{position:absolute;left:0;right:0;top:0;height:98px}.shelf-label{padding:12px 10px 0;font-size:9px;letter-spacing:1.4px;color:var(--muted)}.shelf-label span{float:right;font-size:9px;letter-spacing:0}#shelf{display:flex;align-items:end;justify-content:space-evenly;height:72px;padding:0 5px}.shelf-board{height:9px;background:var(--wood)}.shelf-project{display:flex;flex-direction:column;align-items:center;padding:0 3px 0;transition:transform .2s}.shelf-project:hover{transform:translateY(-5px)}.shelf-project[aria-pressed=true]{opacity:.45}.shelf-project svg{width:58px;height:51px;overflow:visible}.shelf-project small{font-size:9px;white-space:nowrap}.lower-shelf{position:absolute;left:0;right:0;top:98px;height:78px;border-bottom:9px solid var(--wood);display:flex;align-items:end;justify-content:space-around;padding:0 12px 0}#games-slot,#paint-slot{position:relative;display:flex;align-items:end;height:100%}.bookcase-base{position:absolute;bottom:0;left:0;right:0;height:4px;background:#d5c7b0}
/* The bed and bear sit behind the working surface, below the window. */
.bed{position:absolute;right:13%;top:260px;width:39%;height:105px;border-radius:5px;background:#dedfd4;z-index:2}.headboard{position:absolute;left:-5px;right:-5px;top:-36px;height:70px;background:#c3b39a;border-radius:9px 9px 0 0;z-index:-1}.pillow{position:absolute;left:7%;top:6px;width:28%;height:39px;background:#f8f5ea;border:1px solid #e0decf;border-radius:10px;transform:rotate(-4deg)}.blanket{position:absolute;right:0;left:38%;top:3px;bottom:8px;background:#a9b9a2;border-radius:4px 4px 7px 0;border-top:15px solid #b8c7b0}.blanket:after{content:'';position:absolute;top:0;bottom:0;left:12px;border-left:1px solid #8da18555}.bed-frame{position:absolute;bottom:-8px;left:0;right:0;height:15px;background:#baa98c;border-radius:0 0 3px 3px}#bear-slot{position:absolute;left:14%;top:-18px;z-index:2}
.desk{position:absolute;left:7%;right:7%;bottom:0;height:160px;background:#dbceb8;border:1px solid #cabaa0;border-radius:7px 7px 0 0;z-index:3;box-shadow:0 -7px 24px #303d3706}.mat{position:absolute;left:27%;right:27%;top:20px;bottom:48px;background:#bcc9b4;border:1px solid #acbda4;border-radius:5px}.desk-edge{position:absolute;bottom:0;left:0;right:0;height:7px;background:#ccbaa0}#viewer{position:absolute;left:22%;right:22%;top:321px;bottom:57px;z-index:4;cursor:grab;touch-action:none}#viewer:active{cursor:grabbing}canvas{display:block;width:100%;height:100%}#viewer-fallback{position:absolute;top:65%;left:30%;max-width:40%;z-index:5}.desk-caption{position:absolute;bottom:21px;left:9%;display:flex;align-items:center;gap:9px;font-size:11px;z-index:5}.live-dot{margin:0}.placeholder{font-size:8px;letter-spacing:1px;border:1px solid #b6bda9;padding:2px 6px;border-radius:3px;color:#69755f}.interaction-hint{position:absolute;bottom:58px;left:0;right:0;text-align:center;font-size:10px;color:#69755f;z-index:5;pointer-events:none}.interaction-hint span{padding:0 8px}.viewer-tools{position:absolute;bottom:21px;right:9%;display:flex;gap:12px;z-index:5}.viewer-tools button{font-size:11px}.viewer-tools button[aria-pressed=true]{color:var(--orange)}.room-discovery-hint{position:absolute;left:2%;top:380px;margin:0;font-size:9px;color:#7a8576;z-index:2}
/* Personal objects retain their own clickable areas outside the model canvas. */
.personal-objects{position:absolute;inset:0;pointer-events:none;z-index:2}.room-object{position:absolute;padding:0;pointer-events:auto;line-height:1;transition:transform .2s;isolation:isolate}.room-object svg{display:block;width:100%;height:100%}.room-object:hover,.room-object:focus-visible{transform:translateY(-4px);z-index:10}.object-label{position:absolute;left:50%;bottom:100%;transform:translate(-50%,-6px);background:var(--paper);color:#56664f;border:1px solid #d5dbce;padding:5px 8px;border-radius:5px;white-space:nowrap;font-size:10px;line-height:1.4;opacity:0;visibility:hidden;pointer-events:none;box-shadow:0 3px 10px #303d3708}.room-object:hover .object-label,.room-object:focus-visible .object-label{opacity:1;visibility:visible}.object-games{position:relative;width:94px;height:66px;margin-bottom:-3px}.object-paint{position:relative;width:62px;height:62px;margin-bottom:-5px}.object-bear{position:relative;width:68px;height:78px}.object-bear svg{transform:rotate(-65deg)}.object-guitar{left:1%;top:198px;width:76px;height:166px;transform:rotate(-8deg)}.object-guitar:hover,.object-guitar:focus-visible{transform:translateY(-4px) rotate(-5deg)}.object-hockey{right:2%;top:176px;width:68px;height:180px}.object-skates{right:5%;top:335px;width:75px;height:73px}
.project-detail{border-top:1px solid #dcded5;border-bottom:1px solid #dcded5;padding:25px 0;display:grid;grid-template-columns:1fr 1fr;gap:10%;margin-top:25px}h2{font-size:23px;font-weight:500;letter-spacing:-.7px;margin:7px 0}.project-detail p:not(.eyebrow){font-size:12px;color:var(--muted);max-width:440px}.detail-right{padding-top:12px}#part-message{min-height:20px}#part-controls{display:flex;gap:8px;flex-wrap:wrap}#part-controls button{border:1px solid #ccd4c6;border-radius:5px;padding:6px 12px;font-size:11px}#part-controls button:hover{background:#e5e9df}.text-link{padding:12px 0 0;font-size:11px;color:var(--orange)}footer{display:flex;justify-content:space-between;padding:20px 0;font-size:9px;color:var(--muted)}dialog{border:1px solid #d4dacd;border-radius:12px;background:var(--paper);color:var(--ink);padding:40px;max-width:620px;width:90%;max-height:85vh}dialog::backdrop{background:#303d3755;backdrop-filter:blur(4px)}dialog h2{font-size:29px}dialog p,dialog li{font-size:14px}.close{position:absolute;right:14px;top:7px;font-size:28px}.project-list-button{display:block;text-align:left;border-bottom:1px solid #dcded5;width:100%;padding:16px 0}.project-list-button strong{display:block}.project-list-button span{font-size:12px;color:var(--muted)}


/* Three snug shelf rows. Objects meet the board beneath them. */
.third-shelf{position:absolute;left:0;right:0;top:176px;height:79px;display:flex;align-items:end;justify-content:space-evenly;border-bottom:7px solid var(--wood);padding:0 10px}
.sketchbooks{width:63px;height:26px;display:flex;flex-direction:column-reverse;gap:3px;margin-bottom:2px}.sketchbooks span{height:10px;border-radius:2px;background:#b5bba6;border-bottom:2px solid #f0eddf}.sketchbooks span:last-child{width:55px;background:#c6ae90}
.desk-object{position:absolute;padding:0;z-index:1;line-height:1}.desk-object svg{width:100%;height:100%;display:block}.desk-plant{right:4%;top:-68px;width:68px;height:96px}.desk-notebook{left:5%;top:24px;width:108px;height:79px;transform:rotate(-7deg)}.desk-pencils{left:5%;top:-37px;width:48px;height:69px}.plant-flower{opacity:0;transition:opacity .3s}.desk-plant[aria-pressed=true] .plant-flower{opacity:1}.pencil-bundle{transform-origin:32px 55px;transition:transform .25s}.desk-pencils.shuffled .pencil-bundle{transform:rotate(9deg)}
/* Soft silhouette outlines indicate interaction, including keyboard focus. */
.shelf-project:hover,.shelf-project:focus-visible,.room-object:hover,.room-object:focus-visible{transform:none}
.shelf-project svg,.room-object svg,.desk-object svg{transition:filter .18s ease}
.shelf-project:hover svg,.shelf-project:focus-visible svg,.room-object:hover svg,.room-object:focus-visible svg,.desk-object:hover svg,.desk-object:focus-visible svg{filter:drop-shadow(1px 0 0 #fff) drop-shadow(-1px 0 0 #fff) drop-shadow(0 1px 0 #fff) drop-shadow(0 -1px 0 #fff) drop-shadow(0 0 4px #ffffffb0)}
.object-guitar:hover,.object-guitar:focus-visible{transform:rotate(-8deg)}

.shelf-label{height:22px;padding:4px 10px 0;line-height:14px}#shelf{height:67px}.shelf-project small{line-height:14px}

/* Warm board-game palette: parchment, woodland, clay, and a little plum. */
:root{--paper:#f3eddf;--ink:#3f4035;--muted:#7c7c68;--sage:#7d8f65;--orange:#aa6547;--wood:#b49a74}
header,.project-detail{border-color:#dbd0b9}.wordmark{color:#45533d}h1,h2{font-family:Georgia,'Times New Roman',serif;font-weight:400}h1{letter-spacing:-1.7px}.eyebrow{color:#73775e}.back-wall{background:#eae4d4;border-color:#ddd5c1}.back-wall:before,.back-wall:after{background:#d8d2bd}.room-floor{background:#ded4be;border-top-color:#c6b99a}.window{border-color:#b7bda0;background:#dbe3d2}.window:after{border-color:#b7bda0}.window-sill{background:#9da985}.sun{background:#dab66c}.hills{background:#9ead80}.bookshelf{background:#dfd3bb;box-shadow:5px 5px 0 #5145300a}.bookcase-base{background:#a78b63}.shelf-label{color:#6a6b54}.sketchbooks span{background:#859171}.sketchbooks span:last-child{background:#9b7b69}.desk{background:#d6c5a4;border-color:#b9a17d}.desk-edge{background:#bfa581}.mat{background:#a0ae88;border-color:#8b9b73}.placeholder{border-color:#a9ae8c;color:#566347}.desk-caption,.viewer-tools{color:#49573f}.interaction-hint{color:#596449}#part-controls button{border-color:#c4c8a8}#part-controls button:hover{background:#e0e4cc}.wall-note,.room-discovery-hint{color:#85856d}dialog{border-color:#c7bea6}dialog::backdrop{background:#3e3a3055}.text-link{color:#986043}
/* Bed runs away from the viewer toward the window; bear sits at the head. */
.bed{right:20%;top:239px;width:25%;height:173px;background:#e5dcc7;border-radius:10px 10px 5px 5px;border:1px solid #c4b18e;box-shadow:5px 6px 0 #6b614415}.headboard{left:-6px;right:-6px;top:-23px;height:61px;border-radius:8px 8px 0 0;background:#b6a17e;border-top:5px solid #c5b18b}.pillow{left:9%;top:11px;width:56%;height:43px;transform:none;border-radius:8px;background:#f6efdf;border-color:#d5cbb4}.blanket{left:0;right:0;top:68px;bottom:8px;background:#8e9d76;border-radius:2px 2px 4px 4px;border-top:17px solid #a5b28d}.blanket:after{top:0;left:12%;right:12%;bottom:15px;border:1px solid #c1caa34d;border-top:0}.bed-frame{left:-2px;right:-2px;bottom:-8px;background:#a98d67}#bear-slot{left:12%;top:-12px}.object-bear{width:62px;height:72px}.object-bear svg{transform:none}.object-games{width:91px;height:68px;margin-bottom:0}
/* A full-height guitar, leaning on the left side of the bookcase. */
.object-guitar{left:3.2%;top:145px;width:123px;height:230px;transform:rotate(10deg);transform-origin:50% 100%}.object-guitar svg{width:100%;height:100%}.object-guitar:hover,.object-guitar:focus-visible{transform:rotate(10deg)}
.desk-decoration{position:absolute;padding:0;line-height:1;pointer-events:none}.desk-decoration svg{display:block;width:100%;height:100%}.plant-flower{display:none}.desk-decoration .pencil-bundle{transform:none}


/* The room is the homepage: no introductory banner or promotional heading. */
.wordmark{font-size:21px;font-weight:500;letter-spacing:0;color:var(--ink);font-family:Georgia,'Times New Roman',serif}.room{margin-top:28px}header{height:76px}nav{gap:28px}nav button{font-size:13px}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.resume-dialog{max-width:870px;width:94vw;padding:28px;max-height:94vh}.resume-heading{display:flex;align-items:center;justify-content:space-between;padding-right:24px;gap:20px;margin-bottom:14px}.resume-heading h2{margin:0;font-size:25px}.resume-actions{display:flex;gap:18px;font-size:12px}.resume-actions a{color:var(--orange);border-bottom:1px solid #c9b79d;padding:4px 0}.resume-preview{display:block;width:100%;height:min(70vh,850px);border:1px solid #d7cdb7;border-radius:3px;background:#fff}.resume-fallback{font-size:10px!important;color:var(--muted);margin:10px 0 0}


/* Every room object uses the same 1100 × 620 coordinate system. */
.room-viewport{position:relative;width:100%;max-width:1100px;aspect-ratio:1100 / 620;margin:28px auto 0;overflow:hidden;border-radius:12px 12px 0 0}
.room{position:absolute;left:0;top:0;width:1100px;height:620px;margin:0;transform:scale(var(--room-scale,1));transform-origin:top left;visibility:hidden}
.room[data-sized]{visibility:visible}#shelf{height:89px}.shelf-project{padding:0 3px}.shelf-project svg{width:67px;height:60px}.shelf-board{height:9px}
#part-message:empty{display:none}
@media(max-width:760px){header{height:auto;min-height:68px;gap:12px;flex-wrap:wrap;padding:14px 0}.wordmark{font-size:18px}nav{gap:13px}nav button{font-size:11px;padding:5px 0}.room-viewport{margin-top:20px}.project-detail{grid-template-columns:1fr;gap:0;margin-top:20px;padding:18px 0}.detail-right{padding-top:0}footer{gap:20px}.resume-dialog{padding:24px 15px 15px}.resume-heading{align-items:start;flex-direction:column;gap:6px;margin-bottom:12px}.resume-actions{gap:18px}.resume-preview{height:66vh}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}

/* Furniture meets the common floor baseline at scene y=405. */
.bookshelf{top:132px}.bed{top:239px;height:158px}.object-guitar{top:175px;width:162px;height:240px}
.desk-caption{left:25%;right:25%;bottom:22px;justify-content:center;text-align:center;pointer-events:none;font-size:12px;font-weight:400}.viewer-tools{right:9%;bottom:21px}

@font-face{font-family:Nunito;src:url('./assets/nunito-latin-500-normal.woff2') format('woff2');font-style:normal;font-weight:500;font-display:swap}
.notebook-title{font-family:Nunito,sans-serif;fill:#c7cbbd;font-weight:500}
/* Guitar artwork clears the left side of the bookcase. */
.object-guitar{left:-23px;pointer-events:none}.object-guitar svg{pointer-events:visiblePainted}
.third-shelf{justify-content:space-evenly;gap:12px;padding-left:12px;padding-right:12px}
#skates-slot{position:relative;display:flex;align-items:end;height:100%}
.third-shelf .object-games{width:72px;height:54px;margin-bottom:0}
.third-shelf .object-skates{position:relative;left:auto;right:auto;top:auto;bottom:auto;width:76px;height:74px;margin-bottom:-2px}

.wordmark{font-family:Nunito,sans-serif;font-weight:500;letter-spacing:0;font-size:22px;line-height:1.3}
#project-origin{letter-spacing:1.2px}
@media(max-width:760px){.wordmark{font-size:19px}}

/* Keep the home desk compact and the shelf controls above the transparent canvas. */
.desk{left:17%;right:17%}.viewer-tools{right:19%}
.bookshelf{z-index:auto}.shelf-area,.third-shelf{z-index:6}.shelf-project{position:relative}
nav a{font-size:13px;padding:2px 6px}nav a[aria-current=page]{color:var(--orange)}
@media(max-width:760px){nav a{font-size:11px;padding:5px 0}}

/* Keep the contact shadow horizontal on the floor, outside the leaning SVG. */
.object-guitar{top:186px}
.guitar-floor-shadow{position:absolute;left:27px;top:412px;width:66px;height:7px;border-radius:50%;background:#51463226;filter:blur(1.4px);pointer-events:none}

nav a[aria-current=page]{color:inherit}
.desk{left:22%;right:22%;height:145px}.viewer-tools{right:24%}
.room-object[aria-pressed=true]{opacity:.65}

@font-face{font-family:Geist;src:url('./assets/geist-latin-500-normal.woff2') format('woff2');font-style:normal;font-weight:500;font-display:swap}
.wordmark{font-family:Geist,system-ui,sans-serif;font-weight:500;letter-spacing:-.35px}

.shelf-project:hover .object-label,.shelf-project:focus-visible .object-label{opacity:1;visibility:visible}
.shelf-project:hover,.shelf-project:focus-visible{z-index:10}
.object-guitar .object-label{transform:translate(-50%,-6px) rotate(-10deg)}

.location{display:inline-flex;align-items:center;white-space:nowrap;font-size:11px;color:var(--muted)}
@media(max-width:760px){.location{flex-basis:100%;justify-content:flex-end;font-size:10px}}

/* The mattress recedes toward the wall; its foot and shadow sit on the floor. */
.bed{right:18%;left:auto;top:298px;width:290px;height:180px;background:transparent;border:0;border-radius:0;box-shadow:none;z-index:auto}
.bed-scene{position:relative;display:block;width:100%;height:100%;z-index:1}
#bear-slot{left:65px;top:26px;z-index:6}

/* Raise the mattress and headboard while the feet stay on the same floor. */
.bed-scene{overflow:visible}#bear-slot{top:6px}

/* Flat room illustration: simple fills and outlines, without extruded shadows. */
.bookshelf{top:142px;box-shadow:none}.desk{box-shadow:none}

/* More canvas padding preserves model corners during rotation. */
#viewer{top:279px;bottom:15px}
/* The bed shares the window's horizontal center in the 1100px room. */
.bed{left:597.5px;right:auto}

/* Optional model shadow: independent from the model, lighting, and room artwork. */
.model-contact-shadow{position:absolute;z-index:0;transform:translate(-50%,-50%);background:radial-gradient(ellipse at center,#423a2b26 0%,#423a2b14 35%,#423a2b00 72%);pointer-events:none}
#viewer canvas{position:relative;z-index:1}

.model-contact-shadow{background:radial-gradient(ellipse at center,#423a2b30 0%,#423a2b1a 40%,#423a2b00 92%)}

.model-contact-shadow{border-radius:50%;background:radial-gradient(ellipse closest-side at center,#423a2b30 0%,#423a2b18 45%,#423a2b00 100%);filter:blur(2px)}

/* A slightly rolled Poké Ball rests at the middle shelf's right end. */
.lower-shelf{z-index:6}#pokemon-slot{position:absolute;right:8px;bottom:0;display:flex;align-items:flex-end}
.object-pokemon{position:relative;width:50px;height:50px;margin-bottom:-1px}.object-pokemon svg{transform:rotate(18deg)}

.botanical-poster{position:absolute;right:5%;top:75px;width:145px;height:193px;z-index:1;display:block}

/* Cropped artwork is bottom-aligned to each shelf surface. */
.third-shelf .object-games,.third-shelf .object-paint,.third-shelf .object-skates,.object-pokemon{margin-bottom:0}

.botanical-poster{right:3%;top:154px}

/* Quiet shelf categories appear only while a row is being explored. */
.shelf-row::before{content:'';position:absolute;inset:0;z-index:0;background:#ffffff12;box-shadow:inset 0 0 18px #ffffff14;opacity:0;transition:opacity .2s ease;pointer-events:none}
.shelf-area::before{bottom:9px}
.shelf-category{position:absolute;left:8px;top:3px;z-index:3;font-family:Nunito,system-ui,sans-serif;font-size:10px;font-weight:500;letter-spacing:.5px;line-height:14px;color:#fff;opacity:0;transform:translateY(2px);transition:opacity .2s ease,transform .2s ease;pointer-events:none;text-shadow:0 1px 2px #66553c22}
.shelf-row:hover::before{opacity:1}
.shelf-row:hover>.shelf-category{opacity:1;transform:translateY(0)}
.shelf-row:focus-visible{outline:1px solid #ffffff88;outline-offset:-2px}
#shelf{position:relative;z-index:1}
.third-shelf{justify-content:space-between;gap:8px;padding-left:3px;padding-right:3px}
.third-shelf>div{flex-shrink:0;z-index:1}
.third-shelf #pokemon-slot{position:relative;right:auto;bottom:auto;height:100%;align-items:flex-end}
.third-shelf .object-pokemon{width:46px;height:46px}

/* Unscaled labels remain readable even when the room shrinks. */
.object-label{display:none!important}
.room-item-tooltip{position:fixed;z-index:1000;max-width:min(340px,calc(100vw - 20px));padding:4px 6px;border:1px solid #c8cbb7;border-radius:4px;background:#f5efe3;color:#374231;font-family:Nunito,system-ui,sans-serif;font-size:8px;font-weight:500;line-height:1.4;text-align:center;box-shadow:0 3px 10px #3c422412;pointer-events:none}
.room-item-tooltip[hidden]{display:none}
.shelf-row::before{background:#ffffff14;box-shadow:inset 0 0 0 1.5px #ffffffb3,inset 0 0 13px #ffffff66,0 0 7px #ffffff22;border-radius:2px}
.shelf-wall-label{position:absolute;left:11%;top:142px;width:31%;z-index:9;transform:translateY(calc(-100% - 12px));font-family:Nunito,system-ui,sans-serif;font-size:calc(22px / var(--room-scale,1));font-weight:500;line-height:1.25;text-align:center;letter-spacing:.4px;color:#fff;text-shadow:0 1px 3px #776b4d33;opacity:0;transition:opacity .18s ease;pointer-events:none}
.shelf-wall-label.is-visible{opacity:.75}

/* A larger, slightly higher model with zoom-driven depth of field. */
#viewer{top:247px;bottom:15px}
.room>:not(#viewer):not(.viewer-tools):not(#viewer-fallback):not(.shelf-wall-label):not(.model-render-layer){filter:blur(var(--room-focus-blur,0px));transition:filter .15s ease-out}
/* Keep shelf items clickable above the transparent viewer area. */
.bookshelf{z-index:6}
@media(prefers-reduced-motion:reduce){.room>:not(#viewer):not(.viewer-tools):not(#viewer-fallback):not(.shelf-wall-label):not(.model-render-layer){transition:none}}

/* Zoom brings the selected model from the desk toward the center of the room. */
#viewer{transform:translateY(var(--model-focus-lift,0px));transition:transform .15s ease-out}
.room.is-model-zoomed #viewer{z-index:7}
@media(prefers-reduced-motion:reduce){#viewer{transition:none}}

/* Rendering padding prevents clipped corners; the interaction area stays compact. */
#viewer{overflow:visible}
#viewer canvas{position:absolute;pointer-events:none}

/* Keep the complete bedroom visible on arrival, including shorter screens. */
header{height:auto;min-height:48px;padding:7px 0;gap:6px 18px;flex-wrap:wrap}
.wordmark{font-size:22px;line-height:1.25}
nav{gap:20px;align-items:center;line-height:1.3}
nav a,nav button{font-size:12px;padding:5px 0}
.location{font-size:10px;line-height:1.3;white-space:nowrap}
.room-viewport{width:min(100%,var(--room-fit-width,1100px));margin-top:10px}
.viewer-tools{bottom:24px;right:25.5%}
.viewer-tools #reset{font-size:calc(7px / var(--room-scale,1));font-weight:600;line-height:1.25;padding:calc(4px / var(--room-scale,1)) calc(6px / var(--room-scale,1));min-height:calc(20px / var(--room-scale,1));border:1px solid #b7aa9166;border-radius:4px;background:#dfd0b4b3;color:#374231;white-space:nowrap}
.viewer-tools #reset:hover{background:#e6d8bd}
.room.is-model-zoomed .shelf-row,.room.is-model-zoomed .shelf-project,.room.is-model-zoomed .room-object,.room.is-model-zoomed .room-object svg{pointer-events:none!important}
@media(max-width:760px){header{min-height:48px;padding:7px 0;gap:5px 12px}.wordmark{font-size:19px}nav{gap:14px}.room-viewport{margin-top:8px}}

/* Keep the model visually above the room without covering shelf click targets. */
.room>.model-render-layer{position:absolute;z-index:7;pointer-events:none;transform:translateY(var(--model-focus-lift,0px));transition:transform .15s ease-out}
.viewer-tools{z-index:8}
@media(prefers-reduced-motion:reduce){.room>.model-render-layer{transition:none}}

/* Empty viewer space passes through to room objects; model input uses hit testing. */
#viewer{pointer-events:none;touch-action:auto}

@font-face{font-family:Montserrat;src:url('./assets/montserrat-500.ttf') format('truetype');font-style:normal;font-weight:500;font-display:swap}
.shelf-wall-label,.shelf-category{font-family:Montserrat,Geist,system-ui,sans-serif;font-weight:500}



.contact-email{display:inline-block;color:#56664d;text-decoration:underline;text-underline-offset:4px;overflow-wrap:anywhere}

/* Three small work objects sit directly on the middle shelf. */
.lower-shelf{padding:0 7px;justify-content:space-evenly;gap:8px}
.lower-shelf .job-item{padding:0;flex:0 0 auto}
.lower-shelf .job-item svg{display:block;width:83px;height:60px}

.contact-links{display:flex;flex-direction:column;align-items:flex-start;gap:12px}.contact-links a:focus-visible{outline:2px solid currentColor;outline-offset:5px;border-radius:2px}

.contact-email-row{display:flex;align-items:center;flex-wrap:wrap;gap:12px}.contact-address{user-select:text;overflow-wrap:anywhere}.copy-email{padding:7px 12px;border:1px solid #9ca58c;border-radius:6px;background:transparent;color:inherit;font:inherit;font-size:13px;cursor:pointer}.copy-email:hover{background:#91a17e22}.copy-email:focus-visible{outline:2px solid currentColor;outline-offset:3px}.copy-email-status{font-size:12px;color:var(--muted)}.copy-email-status:empty{display:none}

.project-gallery{display:grid;gap:18px}.project-gallery figure{margin:0}.project-gallery img{display:block;width:100%;height:auto;border-radius:6px}.project-gallery figcaption{font-size:12px;color:var(--muted);margin-top:7px}

/* Readable page typography, independent of the room's scene scale. */
header{min-height:48px;padding:7px 0;gap:6px 18px}
.wordmark{font-size:clamp(27px,2.5vw,34px);line-height:1.25}
nav{gap:20px}nav a,nav button{font-size:16px;line-height:1.3;padding:5px 0}
.location{font-size:13px;line-height:1.5}
.room-viewport{width:100%;margin-top:10px}
.project-detail{grid-template-columns:minmax(0,760px) auto;gap:40px;margin-top:36px;padding:36px 0 42px;align-items:start}
.project-detail .eyebrow{font-size:13px;line-height:1.5;letter-spacing:1.4px;margin:0 0 12px}
.project-detail h2{font-size:clamp(29px,3vw,38px);line-height:1.2;letter-spacing:-.6px;margin:0 0 20px}
.project-detail p:not(.eyebrow){font-size:18px;line-height:1.75;max-width:68ch;margin:0}
.detail-right{padding-top:27px;justify-self:end}.detail-right .text-link{font-size:15px;line-height:1.5;padding:10px 0;white-space:nowrap}
footer{font-size:13px;line-height:1.6;padding:24px 0 32px;gap:20px;flex-wrap:wrap}
dialog p,dialog li{font-size:16px;line-height:1.75}.contact-address,.contact-email{font-size:16px}.copy-email{font-size:14px}.copy-email-status{font-size:13px}
@media(max-width:900px){header{gap:6px 18px}.location{flex-basis:auto;margin-top:0}.project-detail{grid-template-columns:minmax(0,1fr);gap:18px}.detail-right{padding-top:0;justify-self:start}}
@media(max-width:600px){header{padding:7px 0;gap:5px 12px}.wordmark{font-size:28px;flex-basis:auto}nav{gap:14px}nav a,nav button{font-size:16px}.location{font-size:13px}.room-viewport{margin-top:8px}.project-detail{margin-top:26px;padding:28px 0 32px}.project-detail p:not(.eyebrow){font-size:17px;line-height:1.75}.project-detail h2{font-size:30px}footer{font-size:12px}}

/* Keep copy in the left column, with space reserved for future photos. */
.project-detail{grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:48px;row-gap:14px;height:auto;max-height:none;overflow:visible}
.project-detail>div:first-child{grid-column:1;min-width:0}
.project-detail p:not(.eyebrow){max-width:100%;height:auto;max-height:none;overflow:visible;overflow-wrap:break-word}
.detail-right{grid-column:1;justify-self:start;padding-top:0}
header{min-height:44px;padding:4px 0;gap:4px 16px}
nav{gap:22px}nav a,nav button{font-size:19px;padding:2px 0;line-height:1.3}
.location{font-size:16px;line-height:1.3}
.room-viewport{width:min(100%,var(--room-fit-width,1100px));margin-top:6px}
@media(max-width:900px){.project-detail{grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:32px}}
@media(max-width:600px){header{padding:4px 0;gap:4px 12px}nav{gap:18px}nav a,nav button{font-size:18px}.location{font-size:15px}.room-viewport{margin-top:6px}.project-detail{grid-template-columns:minmax(0,1fr);gap:14px}}

/* Clearer supporting text at all screen sizes. */
footer{font-size:16px;line-height:1.6}
.project-detail .eyebrow{font-size:16px;line-height:1.5;letter-spacing:1px}

/* A legible desktop reset control; retain the compact control on smaller views. */
@media(min-width:1000px){.viewer-tools #reset{font-size:calc(12px / var(--room-scale,1));padding:calc(6px / var(--room-scale,1)) calc(10px / var(--room-scale,1));min-height:calc(30px / var(--room-scale,1));border-radius:calc(5px / var(--room-scale,1))}}

/* The compact header can be tuned independently of the desktop header. */
@media(max-width:760px){
 header{display:grid;grid-template-columns:minmax(0,1fr) max-content;column-gap:10px;row-gap:2px;padding:6px 0;align-items:center}
 header .wordmark{grid-column:1;grid-row:1 / 3;font-size:clamp(18px,4.6vw,26px);line-height:1.2;white-space:nowrap}
 header nav{grid-column:2;grid-row:1;justify-self:end;justify-content:flex-end;gap:12px}
 header nav a,header nav button{font-size:12px;line-height:1.3;padding:4px 0}
 header .location{grid-column:2;grid-row:2;justify-self:end;font-size:11px;line-height:1.3;text-align:right;white-space:nowrap}
 header .location i{width:5px;height:5px;margin-left:5px}
}
@media(max-width:360px){header{column-gap:6px}header nav{gap:9px}header nav a,header nav button{font-size:11px}header .location{font-size:10px}}

/* Small screens: identity on the left, navigation on the right, footer on one row. */
@media(max-width:760px){
 header .wordmark{grid-column:1;grid-row:1}
 header .location{grid-column:1;grid-row:2;justify-self:start;text-align:left;font-size:11px}
 header nav{grid-column:2;grid-row:1 / 3;align-self:center;gap:clamp(9px,2vw,16px)}
 header nav a,header nav button{font-size:clamp(12px,3.6vw,16px);line-height:1.35}
 footer{display:flex;flex-wrap:nowrap;justify-content:space-between;align-items:center;gap:10px;font-size:clamp(9px,2.8vw,13px)}
 footer>a,footer>span{white-space:nowrap}
 footer>span{text-align:right}
}

/* Smart Window documentation stays alongside the description on desktop. */
.project-detail.has-project-images{grid-template-rows:min-content 1fr}
.smart-window-images{grid-column:2;grid-row:1 / span 2;display:flex;flex-direction:column;gap:24px;min-width:0}
.smart-window-images[hidden]{display:none}
.smart-window-images figure{margin:0;min-width:0}
.smart-window-images img{display:block;width:100%;height:auto;max-height:440px;object-fit:contain;border-radius:8px}
.smart-window-images figcaption{margin-top:8px;font-size:13px;line-height:1.5;color:var(--muted)}
@media(max-width:760px){
 .project-detail.has-project-images{grid-template-columns:minmax(0,1fr);grid-template-rows:auto;gap:16px}
 .smart-window-images{grid-column:1;grid-row:auto;margin-top:8px;gap:22px}
 .smart-window-images img{max-height:none}
}

/* One image at a time, with quiet side controls. */
.smart-window-images{display:grid;grid-template-columns:34px minmax(0,1fr) 34px;gap:8px;align-items:center}
.smart-window-images figure{grid-column:2;grid-row:1}
.smart-window-images figure[hidden]{display:none}
.smart-window-images img{height:clamp(240px,32vw,420px);max-height:none;width:100%;object-fit:contain}
.smart-window-images figcaption{text-align:center}
.gallery-arrow{grid-row:1;align-self:center;width:34px;height:40px;border-radius:20px;font-size:28px;line-height:1;color:var(--ink);background:color-mix(in srgb,var(--ink) 5%,transparent);cursor:pointer}
.gallery-arrow:hover{background:color-mix(in srgb,var(--ink) 12%,transparent)}
.gallery-arrow:focus-visible{outline:2px solid var(--orange);outline-offset:3px}
.gallery-arrow.previous{grid-column:1}.gallery-arrow.next{grid-column:3}
.gallery-position{grid-column:2;text-align:center;color:var(--muted);font-size:12px;margin:0}
@media(max-width:760px){.smart-window-images{gap:8px}.smart-window-images img{height:300px}}

@media(min-width:761px){.shelf-wall-label{font-size:calc(40px / var(--room-scale,1))}}

@media(min-width:761px){.room-item-tooltip{font-size:11.2px}}

@media(min-width:761px){.project-detail #detail-description{font-size:20px}}

.shelf-row.is-linked-hover::before{opacity:1}