*{box-sizing:border-box}body{margin:0;background:#000;color:#f2f2ef;font-family:Arial,sans-serif}header{display:flex;justify-content:space-between;align-items:center;padding:32px 5vw}.brand{font-size:20px;letter-spacing:5px}a{color:inherit;text-decoration:none}nav{display:flex;gap:32px;font-size:12px;letter-spacing:2px}nav [aria-current]{border-bottom:1px solid #fff;padding-bottom:8px}main{width:min(1200px,90vw);margin:20px auto}.artwork{background:#000;border:14px solid #000}#face-art{display:block;width:100%;aspect-ratio:855.26/548.92;pointer-events:auto}.caption{display:flex;justify-content:space-between;gap:20px;align-items:center;margin:24px 14px;font-size:10px;letter-spacing:2px;color:#aaa}button{font:inherit;letter-spacing:1px;color:#ddd;background:none;border:1px solid #555;padding:12px 16px;cursor:pointer}button:hover{border-color:white}a:focus-visible,button:focus-visible{outline:2px solid white;outline-offset:6px}footer{text-align:center;font-size:9px;letter-spacing:3px;color:#777;padding:25px}@media(max-width:600px){header{padding:25px 6vw}main{width:96vw;margin:40px auto}.artwork{border-width:5px}.caption{flex-direction:column;text-align:center;line-height:1.8}nav{gap:20px}}

body{min-height:100svh;display:flex;flex-direction:column}header{padding:24px 3.5vw}main{width:100%;margin:0 auto;flex:1}.artwork{border:0;width:100%;padding:0 1vw}#face-art{width:100%;height:calc(100svh - 125px);min-height:300px;aspect-ratio:auto}.caption{margin:0 3.5vw 12px;justify-content:flex-end}.caption>span:empty,footer:empty{display:none}footer{padding:0}button{font-size:10px;border:0;padding:8px;color:#aaa}@media(max-width:600px){main{margin:0 auto;width:100%}.artwork{padding:0}#face-art{min-height:0;height:auto;aspect-ratio:1610/910;margin:12vh 0}.caption{align-items:flex-end}}

/* Text palette supplied by Hedieh. */
body, .brand, nav a, .caption, button, footer{color:#E8E8E6}nav [aria-current]{border-bottom-color:#E8E8E6}

header{position:absolute;z-index:2;top:0;left:0;width:100%;display:flex;align-items:center;padding:3.2vw 3.55vw;gap:5vw}
.brand{font-size:clamp(16px,1.1vw,22px);letter-spacing:5px}
nav{display:flex;align-items:center;margin-left:auto;gap:2.75vw}
nav a,nav button{font-size:clamp(11px,.78vw,15px);letter-spacing:2px;padding:0;position:relative}
nav [aria-current]:after{content:'';width:5px;height:5px;background:var(--white);position:absolute;top:31px;left:50%}
.menu{width:43px;padding:0;display:grid;gap:12px}
.menu span{height:1px;background:var(--white);width:100%}
#mobile-nav{position:absolute;right:3.5%;top:100px;z-index:5;background:#111;border:1px solid #444;padding:24px;min-width:180px}
#mobile-nav:not([hidden]){display:grid;gap:22px}
#mobile-nav button{text-align:left;padding:0}
dialog{width:min(90%,540px);border:1px solid #555;background:#0c0c0c;color:var(--white);padding:50px}
dialog::backdrop{background:#000b;backdrop-filter:blur(5px)}
dialog h2{font:400 46px 'Cormorant Garamond',Georgia,serif;margin:0 0 20px}
.dialog-copy{line-height:1.8;color:#bbb}
.close{position:absolute;right:18px;top:12px;font-size:30px}
.dismiss{margin-top:20px;border-bottom:1px solid #888;padding:8px 0}
header{position:relative;flex:none;justify-content:initial}nav [aria-current]{border:0;padding:0}header button,#mobile-nav button,dialog button{border:0;background:none;color:inherit;font:inherit;cursor:pointer}nav button:hover{border:0}header,.menu span{color:#E8E8E6}nav [aria-current]:after,.menu span{background:#E8E8E6}body{font-family:Inter,Arial,sans-serif}#face-art{height:calc(100svh - 165px)}@media(max-width:900px){header{padding:28px 7%;gap:24px}nav{display:none}.menu{margin-left:auto;width:32px}}

:root{--white:#E8E8E6}header nav a,header nav button{font-size:clamp(10px,.68vw,13px)}