@font-face{font-family:Space;src:url('assets/SpaceGrotesk.ttf');font-weight:300 700}*{box-sizing:border-box}body{margin:0;background:#f3e4cb;color:#17150f;font-family:Space,Arial,sans-serif}.desktop{max-width:1440px;margin:auto;padding:7vh 4.65% 2vh}.rules{height:5px;display:flex;justify-content:space-between;margin:0 0 32px}.rules:before,.rules:after{content:'';width:32.4%;background:#ac8a68}.window{border:5px solid #ac8a68;outline:7px solid #0007cd;outline-offset:-12px;background:#f3e4cb}header{height:82px;background:#0007cd;display:flex;justify-content:space-between;padding:20px 20px 0 8px;border-bottom:12px solid #9a9a9a}nav{display:flex;align-items:end;gap:5vw}nav a{min-width:130px;text-align:center;color:black;font-size:24px;font-weight:700;text-decoration:none;padding:12px 22px;background:#d9d9d9 url('assets/tab.svg') center/100% 100% no-repeat;text-shadow:0 3px 3px #0003;white-space:nowrap}nav a.active{background:#f3e4cb;position:relative;top:12px;padding-bottom:24px}.lights{display:flex;gap:12px;align-items:flex-start}.lights i{display:block;width:30px;height:30px;background:#8ee917}.lights i:nth-child(2){background:#e1a80c}.lights i:last-child{background:#e72020}.orbit{height:clamp(330px,43vw,600px);position:relative;isolation:isolate;overflow:hidden;touch-action:pan-y;outline:none}.orbit:focus-visible{box-shadow:inset 0 0 0 2px #ac8a68}.planet{position:absolute;width:66%;aspect-ratio:861.536/450;left:14.85%;top:18%;z-index:5;pointer-events:none}.body{position:absolute;width:100%;height:100%}.grid{position:absolute;left:25.987%;top:0;width:51.154%;height:97.22%;transform:rotate(-.27deg)}.grid img{position:absolute;left:.26%;top:2.69%;width:92.85%;height:97.02%}.cover{position:absolute;left:0;top:0;width:clamp(100px,14vw,190px);aspect-ratio:4/5;padding:0;border:3px solid #f3e4cb;box-shadow:6px 8px 0 #7d3d2a38;background:#d6a282;cursor:pointer;will-change:transform;transform-origin:center;overflow:hidden}.cover img{width:100%;height:100%;object-fit:cover;display:block}.cover.selected{outline:3px solid #0007cd;outline-offset:4px}.cover:focus-visible{outline:4px solid #0007cd}.badge{position:absolute;top:6px;left:6px;font-size:10px;background:#f3e4cb;color:#7d3d2a;padding:3px 6px}footer{text-align:center;padding:0 20px 28px}.work-heading{display:flex;align-items:center;justify-content:center;gap:30px}button{font-family:inherit}footer button{border:0;background:none;cursor:pointer;font-size:26px;color:inherit}#workname{font-size:36px;font-weight:700;max-width:75%;overflow-wrap:anywhere}#counter,.hint{font-size:12px;color:#7d3d2a;margin:10px 0 0}.hint{opacity:.7}.outside{display:flex;justify-content:space-between;margin-top:25px;font-size:12px}a{color:inherit}#empty{position:absolute;inset:70% 5% 0;text-align:center;z-index:10}#empty a{display:block;margin-top:12px}dialog{border:3px solid #ac8a68;background:#f3e4cb;color:#17150f;padding:0;width:min(900px,92vw);max-height:90vh}dialog::backdrop{background:#17150fb3}#close{position:sticky;top:10px;float:right;margin:10px;background:#f3e4cb;border:1px solid #7d3d2a;font-size:28px;cursor:pointer;width:40px;z-index:2}#detail-cover{width:100%;max-height:55vh;object-fit:contain;background:#e6d2b3}.detail-copy{padding:30px}#detail-content{white-space:pre-wrap;line-height:1.8;overflow-wrap:anywhere}#detail-meta{font-size:12px;color:#7d3d2a}@media(max-width:650px){.desktop{padding:5vh 4%}.rules{margin-bottom:20px}header{height:65px;padding:10px 8px 0}nav{gap:8px}nav a{font-size:16px;min-width:0;padding:10px}.lights{gap:5px}.lights i{width:12px;height:12px}.orbit{height:390px}.planet{width:95%;left:0;top:25%}.cover{width:115px}.work-heading{gap:10px}#workname{font-size:25px}.hint{font-size:11px}footer{padding:0 12px 25px}}
.lights .home-button{display:block;flex:none;width:30px;height:30px;background:#e72020;cursor:pointer}.lights .home-button:hover{background:#fa4444}.lights .home-button:focus-visible{outline:3px solid white;outline-offset:3px}@media(max-width:650px){.lights .home-button{width:12px;height:12px;position:relative}.lights .home-button:after{content:"";position:absolute;inset:-10px}}
/* Shared Figma canvas: 1440 x 1000; window: 1306 x 795. */
.desktop{position:relative;width:min(100%,1440px);max-width:1440px;aspect-ratio:1440/1000;margin:0 auto;padding:0;container-type:inline-size}
.rules{position:absolute;left:4.65278%;top:9.9%;width:90.69444%;height:.5%;margin:0}
.window{position:absolute;left:4.65278%;top:13.7%;width:90.69444%;height:79.5%;border-width:.34722cqw;outline-width:.55556cqw;outline-offset:-.83333cqw}
.window header{position:absolute;left:0;top:0;width:100%;height:10.31447%;padding:1.38889cqw 1.38889cqw 0 .55556cqw;border-bottom-width:.83333cqw}
.window nav{gap:5.34722cqw}.window nav a{width:11.7361cqw;min-width:0;height:3.88889cqw;font-size:1.66667cqw;padding:.83333cqw 0;display:flex;align-items:center;justify-content:center}
.window nav a.active{top:.83333cqw;padding-bottom:1.66667cqw;height:4.72222cqw}
.lights{gap:.83333cqw}.lights i,.lights .home-button{width:2.56944cqw;height:2.56944cqw}
.window .orbit{position:absolute;top:11.44654%;left:0;width:100%;height:73%;min-height:0}
.window .planet{width:66%;left:14.85%;top:18%}
.window footer{position:absolute;bottom:3.5%;left:0;width:100%;height:9%;padding:0 1.38889cqw;display:flex;align-items:center;justify-content:center;flex-direction:column}
#workname{font-size:2.5cqw}.work-heading{width:100%;gap:0}#error{font-size:1cqw;margin:0}
.home-orbit{position:absolute;inset:0;width:100%;height:100%;overflow:visible}.letter{font:700 42px Space,Arial,sans-serif;fill:#8de8ff;stroke:#000;stroke-width:1.5;paint-order:stroke fill;stroke-linejoin:round}
[hidden]{display:none!important}.lights .home-button:after{display:none}
/* Keep the separator inside the blue frame and underneath the active tab. */
.window header{border-bottom-color:transparent}
.window header::after{content:"";position:absolute;left:.55556cqw;right:.55556cqw;bottom:-.83333cqw;height:.83333cqw;background:#9a9a9a;pointer-events:none;z-index:0}
.window header nav,.window header .lights{position:relative;z-index:1}
/* Tablet and phone layouts share the same shell on every public page. */
@media(max-width:900px){
.desktop{width:100%;aspect-ratio:auto;padding:24px 16px 20px;min-height:100svh}
.rules{position:relative;inset:auto;width:100%;height:3px;margin:0 0 20px}
.window{position:relative;inset:auto;width:100%;height:auto;min-height:min(760px,calc(100svh - 87px));display:flex;flex-direction:column;border-width:3px;outline-width:5px;outline-offset:-8px}
.window header{position:relative;flex:none;inset:auto;width:100%;height:76px;padding:18px 12px 0 5px;border-bottom-width:8px;gap:10px}
.window header::after{left:5px;right:5px;bottom:-8px;height:8px}
.window nav{gap:clamp(8px,3vw,28px);min-width:0}
.window nav a{font-size:clamp(14px,2.25vw,20px);width:auto;min-width:70px;height:44px;padding:8px 15px;text-shadow:0 2px 2px #0003}
.window nav a.active{top:8px;height:52px;padding-bottom:16px}
.lights{gap:8px;align-items:center;align-self:flex-start;margin-top:8px;flex:none}.lights i,.lights .home-button{width:22px;height:22px}
.lights .home-button{position:relative}.lights .home-button:after{display:block;content:'';position:absolute;inset:-9px}
.window .orbit{position:relative;inset:auto;flex:1 0 auto;width:100%;height:clamp(320px,56vw,510px);min-height:320px}
.window .planet{width:86%;left:7%;top:50%;transform:translateY(-50%)}
.cover{width:clamp(108px,20vw,166px)}
.window footer{position:relative;inset:auto;flex:none;width:100%;height:auto;min-height:96px;padding:15px 22px 24px}
#workname{font-size:clamp(24px,3.5vw,32px);max-width:100%;line-height:1.2;min-height:44px;padding:4px 0}
#error{font-size:13px}.detail-copy{padding:22px}dialog{max-height:90svh}#close{min-width:44px;min-height:44px}
}
@media(max-width:480px){
.desktop{padding:20px 10px 16px}.rules{margin-bottom:16px}
.window{min-height:calc(100svh - 75px)}
.window header{height:70px;padding:12px 8px 0 5px;gap:6px}
.window nav{gap:6px}.window nav a{font-size:14px;min-width:0;padding:8px 10px}.window nav a.active{padding-bottom:16px}
.lights{gap:5px;margin-top:10px}.lights i,.lights .home-button{width:14px;height:14px}.lights .home-button:after{inset:-12px}
.window .planet{width:96%;left:2%}.cover{width:clamp(98px,28vw,130px);border-width:2px;box-shadow:3px 5px 0 #7d3d2a38}
.window footer{min-height:90px;padding:12px 16px 24px}.detail-copy{padding:18px}
}
@media(max-height:500px) and (max-width:900px){.desktop{padding-top:14px}.window .orbit{height:340px}.window{min-height:0}}
/* Large screens: 120% of the original 1440px Figma canvas. */
@media(min-width:1441px){
.desktop{width:min(100%,1728px);max-width:1728px}
.cover{width:13.19444cqw;border-width:.20833cqw;box-shadow:.41667cqw .55556cqw 0 #7d3d2a38}
.cover.selected{outline-width:.20833cqw;outline-offset:.27778cqw}
.badge{font-size:.69444cqw;top:.41667cqw;left:.41667cqw;padding:.20833cqw .41667cqw}
}
/* Retrofuturist exterior; the window interior retains its original cream. */
body{min-height:100svh;background:#171a19 url('assets/retro-space-background.png') center center/cover no-repeat fixed}
.desktop{background:transparent}
@media(min-width:901px){
.desktop{width:min(100%,1920px);max-width:1920px}
.window{left:3%;top:11%;width:94%;height:82.4%}
.rules{left:3%;top:7.5%;width:94%}
}
@media(max-width:900px){body{background-attachment:scroll;background-size:cover}}
/* Y2K satin aluminium tabs: subtle machining, shallow edges, crisp type. */
.window nav a{
background-color:#c9c9c3;
background-image:repeating-linear-gradient(0deg,rgba(255,255,255,.13) 0,rgba(255,255,255,.13) 1px,rgba(55,59,61,.035) 1px,rgba(55,59,61,.035) 2px),linear-gradient(105deg,#bcbeb9 0%,#e0dfd7 37%,#d1d2cc 62%,#bfc2be 100%);
border:1px solid #8b918d;border-top-color:#ecece4;border-left-color:#e1e3db;border-radius:2px 2px 0 0;
box-shadow:inset 0 1px 0 rgba(255,255,255,.45),inset -1px 0 0 rgba(58,65,62,.12),0 1px 1px rgba(12,18,30,.18);
font-weight:600;letter-spacing:.012em;color:#202825;text-shadow:0 1px 0 rgba(255,255,255,.55);
transition:filter .14s ease,background-color .14s ease;
}
.window nav a:hover{filter:brightness(1.045)}
.window nav a.active{
background-color:#f3e4cb;
background-image:linear-gradient(180deg,rgba(255,255,255,.26),rgba(255,255,255,0) 45%);
border-color:transparent;border-top-color:#fff2db;border-left-color:#dfd1b8;
box-shadow:inset 0 1px 0 rgba(255,255,255,.25);color:#272923;text-shadow:none;
}
.window header::after{
background-color:#afb3ae;
background-image:repeating-linear-gradient(0deg,rgba(255,255,255,.12) 0,rgba(255,255,255,.12) 1px,transparent 1px,transparent 2px),linear-gradient(180deg,#deded5 0%,#bfc2bb 22%,#aeb3ad 78%,#c9cbc2 100%);
box-shadow:inset 0 1px 0 #edece3,inset 0 -1px 0 #8e958e;
}
@media(prefers-reduced-motion:reduce){.window nav a{transition:none}}
/* Align the first tab exactly with the inner edge of the window frame. */
.window header{padding-left:.48611cqw}
.window header::after{left:.48611cqw;right:.48611cqw}
.window nav a.active{border-radius:0;border-left-color:transparent}
@media(max-width:900px){.window header{padding-left:2px}.window header::after{left:2px;right:2px}}

/* Portfolio polish: paper-mounted covers and restrained desktop details. */
.window{box-shadow:0 16px 48px #080c162b}
.cover{border-width:clamp(3px,.28cqw,5px);box-shadow:1px 2px 0 #ac8a6880,4px 7px 12px #48281824;transition:box-shadow .18s ease}
.cover.selected{outline:2px solid #0007cd;outline-offset:4px;box-shadow:1px 2px 0 #ac8a6890,5px 10px 20px #48281830}
.cover:hover{box-shadow:1px 2px 0 #ac8a6890,5px 10px 24px #48281840}
.cover:focus-visible{outline:2px dashed #0007cd;outline-offset:5px}
#workname{font-weight:600;letter-spacing:-.035em;line-height:1.15;text-wrap:balance;text-underline-offset:.18em;text-decoration-thickness:1px}
#workname:hover{text-decoration:underline;text-decoration-color:#ac8a68}
.window nav a:focus-visible,#workname:focus-visible,#close:focus-visible{outline:1px dashed currentColor;outline-offset:-5px}
.badge{letter-spacing:.03em;border:1px solid #ac8a6840}
#detail{border-width:1px;box-shadow:0 0 0 4px #0007cd,0 24px 90px #0006;scrollbar-color:#ac8a68 #f3e4cb;overscroll-behavior:contain}
#detail::backdrop{background:#17150fc4;backdrop-filter:blur(3px)}
#close{width:40px;height:40px;line-height:1;margin:12px;box-shadow:1px 2px 0 #ac8a6870}
#close:hover{background:#e6d2b3}
#detail-cover{display:block;padding:clamp(16px,4vw,40px);max-height:60svh}
.detail-copy{max-width:72ch;margin:0 auto;padding:clamp(24px,4vw,48px)}
#detail-meta{letter-spacing:.1em;text-transform:uppercase;margin:0 0 14px}
#detail-title{font-size:clamp(28px,4vw,48px);font-weight:600;line-height:1.12;letter-spacing:-.035em;margin:0 0 24px;overflow-wrap:anywhere}
#detail-content{font-size:16px;line-height:1.9;margin:0;text-wrap:pretty}
@media(prefers-reduced-motion:reduce){.cover{transition:none}}
/* Compact navigation proportions; retain comfortable phone tap targets. */
@media(min-width:901px){
.window header{height:5cqw;padding-top:.9cqw;border-bottom-width:.55cqw}
.window header::after{bottom:-.55cqw;height:.55cqw}
.window nav{gap:3.6cqw}
.window nav a{width:9.4cqw;height:3cqw;font-size:1.35cqw;padding:.6cqw 0}
.window nav a.active{top:.55cqw;height:3.55cqw;padding-bottom:1.15cqw}
.lights{gap:.65cqw}.lights i,.lights .home-button{width:2cqw;height:2cqw}
}
@media(min-width:481px) and (max-width:900px){
.window header{height:66px;padding-top:10px;border-bottom-width:6px}
.window header::after{bottom:-6px;height:6px}
.window nav{gap:clamp(8px,2vw,18px)}
.window nav a{font-size:16px;padding:8px 12px}
.window nav a.active{top:6px;height:50px;padding-bottom:14px}
.lights i,.lights .home-button{width:18px;height:18px}
}
/* Windows XP Luna property-sheet tabs. */
.window nav a{
font-family:Tahoma,'Microsoft Sans Serif',Arial,sans-serif;font-weight:400;letter-spacing:0;color:#17213a;text-shadow:none;
background-color:#ece9d8;background-image:linear-gradient(180deg,#fffefb 0%,#f7f6ef 40%,#ece9d8 100%);
border:1px solid #919b9c;border-bottom:0;border-radius:4px 4px 0 0;
box-shadow:inset 1px 1px 0 #fff,inset -1px 0 0 #d5d1bd;
}
.window nav a:hover{filter:none;background-image:linear-gradient(180deg,#fffefb,#f8f6ed 65%,#eeeadd);box-shadow:inset 0 3px 0 #ffc73c,inset 1px 1px 0 #fff,inset -1px 0 0 #d5d1bd}
.window nav a.active{
background-color:#f3e4cb;background-image:linear-gradient(180deg,#fffefb 0%,#faf6e9 40%,#f3e4cb 100%);
border:1px solid #919b9c;border-bottom:0;border-top-color:#e59700;border-left-color:#919b9c;border-radius:4px 4px 0 0;
box-shadow:inset 0 3px 0 #ffc73c,inset 1px 0 0 #fff,inset -1px 0 0 #fff;color:#17213a;text-shadow:none;
}
.window header::after{background:#f3e4cb;background-image:linear-gradient(180deg,#fffefb,#f3e4cb);box-shadow:inset 0 1px 0 #919b9c,inset 0 2px 0 #fff}
.window nav a:focus-visible{outline:1px dotted #17213a;outline-offset:-6px}
/* Classic Internet Explorer toolbar chrome. */
.window header{background:linear-gradient(180deg,#4290ed 0%,#1262d6 9%,#0052ce 32%,#0755c8 70%,#003caa 100%);box-shadow:inset 0 1px 0 #78b7ff}
.window header nav{align-self:stretch;align-items:center;gap:4px;padding:3px 8px 3px 12px;background:#ece9d8;border-top:1px solid #fff;border-left:1px solid #fff;border-right:1px solid #aca899;box-shadow:inset 0 -1px 0 #aca899}
.window header nav::before{content:'';width:3px;height:20px;flex:none;margin-right:7px;border-left:1px solid #aca899;border-right:1px solid #fff;box-shadow:2px 0 0 #aca899}
.window nav a,.window nav a.active{position:relative;top:0;width:auto;min-width:0;height:auto;padding:6px 16px;font-size:clamp(14px,1.1cqw,19px);font-weight:400;line-height:1.2;border:1px solid transparent;border-radius:0;background:transparent;box-shadow:none;color:#171717;text-shadow:none}
.window nav a:hover{background:#f6f4e9;border-color:#fff #aca899 #aca899 #fff;box-shadow:none;filter:none}
.window nav a.active{background:#dedbcc;border-color:#aca899 #fff #fff #aca899;box-shadow:inset 1px 1px 0 #c8c4b5}
.window header::after{background:#ece9d8;background-image:none;box-shadow:inset 0 1px 0 #fff,inset 0 -1px 0 #aca899}
@media(min-width:901px){.window header{padding-top:1.1cqw;height:4.6cqw}.window header nav{margin-right:auto}}
@media(max-width:900px){.window header nav{padding:3px 4px;gap:2px}.window header nav::before{margin-right:3px}.window nav a,.window nav a.active{font-size:14px;padding:8px 9px;min-height:40px}}
@media(max-width:480px){.window header nav{padding:2px;gap:0}.window header nav::before{display:none}.window nav a,.window nav a.active{padding:8px 6px;font-size:13px}}
/* Full-width menu strip beneath the narrow blue title band. */
.window header{background:linear-gradient(180deg,#4290ed 0%,#1262d6 10%,#0052ce 30%,#0755c8 100%)}
.window header nav{position:absolute;left:.48611cqw;right:.48611cqw;bottom:0;height:2.7cqw;padding-top:0;padding-bottom:0}
.window header .lights{position:absolute;right:1cqw;top:.3cqw;margin-top:0;gap:.35cqw}
.window header .lights i,.window header .lights .home-button{width:1.25cqw;height:1.25cqw;border:1px solid #ffffffaa;box-shadow:inset 1px 1px 0 #ffffff55;border-radius:2px}
@media(max-width:900px){.window header nav{left:2px;right:2px;height:42px}.window header .lights{top:3px;right:8px;gap:5px}.window header .lights i,.window header .lights .home-button{width:14px;height:14px}}
/* Recessed XP-style indicators, contained within the title band. */
.window header .lights{top:.18cqw;right:.75cqw;gap:.25cqw;align-items:center}
.window header .lights i,.window header .lights .home-button{position:relative;width:1.15cqw;height:1.15cqw;min-width:14px;min-height:14px;border:1px solid #fff;border-radius:3px;box-shadow:inset 1px 1px 1px #ffffffa0,inset -1px -1px 1px #0005;background:linear-gradient(135deg,#78b1f3,#286bcc 60%,#1755ad)}
.window header .lights i:nth-child(2){background:linear-gradient(135deg,#78b1f3,#286bcc 60%,#1755ad)}
.window header .lights i:first-child::before{content:'';position:absolute;left:24%;right:24%;bottom:23%;height:2px;background:white}
.window header .lights i:nth-child(2)::before{content:'';position:absolute;inset:23%;border:1px solid white;border-top-width:2px}
.window header .lights .home-button{background:linear-gradient(135deg,#f4ad96,#dc593c 55%,#ba3522)}
.window header .lights .home-button::before{content:'×';position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:#fff;font:700 clamp(12px,1.05cqw,20px)/1 Arial,sans-serif;text-shadow:0 1px 0 #832a1b}
.window header .lights .home-button:hover{filter:brightness(1.15)}
@media(max-width:900px){.window header .lights{top:2px;right:8px;gap:3px}.window header .lights i,.window header .lights .home-button{width:15px;height:15px;min-width:0;min-height:0}}

/* XP frame and photography masonry. */
.window{outline-color:#0755c8}
.window header{height:calc(2.7cqw + 32px)}
.window header .lights{top:4px;right:8px;gap:4px}
.window header .lights i,.window header .lights .home-button{width:22px;height:22px;min-width:22px;min-height:22px}
.window header .lights .home-button::before{font-size:19px}
.photography .planet,.photography footer{display:none}
.window.photography{height:auto;min-height:75vh;position:relative;top:auto;padding-top:calc(2.7cqw + 40px);padding-bottom:20px}
.desktop:has(.photography){padding-top:7.64%;aspect-ratio:auto;min-height:100svh;padding-bottom:40px}
.window.photography .orbit{position:relative;inset:auto;height:auto;min-height:380px;overflow:visible;padding:24px;touch-action:auto}
.photography #covers{columns:3;column-gap:20px}
.photo-card{display:inline-block;width:100%;margin:0 0 20px;padding:0;border:1px solid #ac8a6866;background:#faf4e7;break-inside:avoid;cursor:pointer;text-align:left;color:inherit;box-shadow:0 2px 5px #48281818}
.photo-card img{display:block;width:100%;height:auto}.photo-caption{display:block;padding:12px 14px;font-size:15px;line-height:1.4;overflow-wrap:anywhere}
.photo-card .badge{display:none}.photo-card:hover{box-shadow:0 4px 12px #48281830}.photo-card:focus-visible{outline:2px solid #0755c8;outline-offset:3px}
.photography #empty{position:static;padding:100px 12px}
@media(max-width:900px){.window header{height:78px}.window header nav{height:42px}.desktop:has(.photography){padding-top:24px}.window.photography{padding-top:0;min-height:calc(100svh - 87px)}.photography #covers{columns:2;column-gap:12px}.window.photography .orbit{padding:16px}.photo-card{margin-bottom:12px}.window nav a,.window nav a.active{font-size:13px;padding:8px 7px}}
@media(max-width:480px){.window nav a,.window nav a.active{font-size:12px;padding:8px 5px}.window.photography .orbit{padding:12px}.photo-caption{padding:9px;font-size:13px}}
@media(max-width:360px){.photography #covers{columns:1}}

#detail-gallery{display:grid;gap:20px;padding:0 clamp(16px,4vw,40px) 40px}#detail-gallery:empty{display:none}#detail-gallery img{width:100%;height:auto;display:block}
/* Photography uses the same window dimensions as the orbit pages. */
@media(min-width:901px){
.desktop:has(.photography){padding:0;aspect-ratio:1440/1000;min-height:0}
.window.photography{position:absolute;left:3%;top:11%;width:94%;height:82.4%;min-height:0;padding:0}
.window.photography .orbit{position:absolute;top:calc(2.7cqw + 40px);bottom:12px;left:12px;width:calc(100% - 24px);height:auto;min-height:0;overflow-y:auto;overflow-x:hidden;scrollbar-color:#ac8a68 #f3e4cb;scrollbar-width:thin}
}
@media(max-width:900px){
.desktop:has(.photography){padding:24px 16px 20px;min-height:100svh}
.window.photography{height:min(760px,calc(100svh - 87px));min-height:0;padding:0}
.window.photography .orbit{flex:1 1 0;min-height:0;height:auto;overflow-y:auto;overflow-x:hidden}
}
@media(max-width:480px){
.desktop:has(.photography){padding:20px 10px 16px}
.window.photography{height:calc(100svh - 75px)}
}

/* Figma 42:4: Space Grotesk Bold, warm brown wordmark. */
.site-name{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);white-space:nowrap;font-family:Space,Arial,sans-serif;font-size:4.44444cqw;font-weight:700;line-height:1.15;color:#ac8a68;text-shadow:0 4px 4px #00000040}
@media(max-width:900px){.rules{margin-top:18px;margin-bottom:32px}.site-name{font-size:clamp(24px,4.44444cqw,40px)}.rules:before,.rules:after{width:29%}}
@media(max-width:480px){.rules:before,.rules:after{width:24%}.site-name{font-size:26px}}
/* Give the wordmark breathing room above the window. */
@media(min-width:901px){.rules{top:5.8%}}
@media(max-width:900px){.rules{margin-bottom:42px}}
.site-name{-webkit-text-stroke:1px #513b2b;paint-order:stroke fill}

/* Contact: an address book inside the shared XP window. */
.window header nav{overflow-x:auto;overflow-y:hidden}
.window nav a{flex-shrink:0}
.contact-content{position:absolute;inset:calc(2.7cqw + 58px) 4% 5%;display:grid;grid-template-columns:1fr 1.3fr;gap:6%;align-items:center;overflow:auto;scrollbar-color:#ac8a68 #f3e4cb}
.contact-kicker{font:12px Tahoma,Arial,sans-serif;letter-spacing:.12em;color:#75543c;margin:0 0 24px}
.contact-intro h1{font-size:clamp(36px,5.2cqw,86px);font-weight:600;line-height:1.02;letter-spacing:-.055em;margin:0}
.contact-note{font-size:clamp(14px,1.1cqw,19px);line-height:1.9;margin:28px 0 0;color:#75543c}
.contact-directory{min-width:0;border:1px solid #aca899;background:#faf5e9;box-shadow:inset 1px 1px #fff,3px 3px 0 #ac8a6830;padding:clamp(18px,2.4cqw,42px)}
.contact-group + .contact-group{margin-top:28px}
.contact-group h2{font:13px Tahoma,Arial,sans-serif;color:#75543c;margin:0 0 8px;display:flex;gap:12px;align-items:center}
.contact-group h2 span{font-size:10px;color:#94775e}
.contact-entry{display:flex;gap:12px;justify-content:space-between;align-items:center;border-bottom:1px solid #ac8a6850;padding:12px 0;font-size:clamp(15px,1.4cqw,24px);text-decoration:none;min-width:0}
.contact-entry>span:first-child{overflow-wrap:anywhere;min-width:0}
a.contact-entry:hover{color:#0755c8;border-bottom-color:#0755c8}
.contact-copy{flex-shrink:0;font:12px Tahoma,Arial,sans-serif;padding:6px 9px;border:1px solid #919b9c;background:linear-gradient(#fffefb,#ece9d8);color:#17213a;box-shadow:inset 1px 1px white;cursor:pointer}
.contact-help,#contact-status{font-size:12px;color:#75543c;line-height:1.6;margin:8px 0 0}
#contact-status{min-height:20px}
.contact-entry:focus-visible,.contact-copy:focus-visible{outline:2px solid #0755c8;outline-offset:3px}
@media(max-width:900px){
.contact-content{position:relative;inset:auto;grid-template-columns:1fr;gap:30px;padding:32px 24px;overflow:visible}
.contact-intro h1{font-size:clamp(38px,7vw,60px)}
.contact-intro h1 br{display:none}
.contact-note{margin-top:16px}
.contact-kicker{margin-bottom:16px}
.contact-directory{padding:22px}
}
@media(max-width:480px){
.contact-content{padding:28px 16px;gap:24px}
.contact-directory{padding:16px}
.contact-entry{font-size:15px}
.contact-group + .contact-group{margin-top:22px}
}

#detail-gallery video{display:block;width:100%;max-height:75svh;background:#171a19;object-fit:contain}