:root{color-scheme:dark;font-family:-apple-system,BlinkMacSystemFont,"Helvetica Neue","PingFang SC","Microsoft YaHei",sans-serif;color:#f5f5f3;background:#090a0b;font-synthesis:none;-webkit-font-smoothing:antialiased;--scene-height:max(780px,100svh);--scroll-travel:clamp(180px,28svh,260px)}
*{box-sizing:border-box}html{margin:0;min-width:320px}body{margin:0}a{color:inherit}
.portrait-home{position:relative;isolation:isolate;min-height:calc(var(--scene-height) + var(--scroll-travel));background:#090a0b}
.backdrop{position:fixed;z-index:0;top:0;left:0;right:0;height:var(--scene-height);overflow:hidden;pointer-events:none;contain:paint;--depth:0}
.portrait{position:absolute;z-index:0;right:0;top:0;width:74%;height:100%;object-fit:cover;object-position:50% 35%;filter:brightness(calc(.88 - var(--depth)*.07)) blur(calc(var(--depth)*6px));transform:translateZ(0);will-change:filter;mask-image:linear-gradient(90deg,transparent,#000 26%);-webkit-mask-image:linear-gradient(90deg,transparent,#000 26%)}
.film-grain{position:absolute;z-index:1;inset:-24px;background:url('/assets/film-grain.svg') repeat 0 0/128px 128px;opacity:.065;mix-blend-mode:soft-light;pointer-events:none;animation:grain-shift .83s steps(1,end) infinite;will-change:transform}
.film-grain::after{content:"";position:absolute;inset:-12px;background:inherit;background-size:147px 147px;opacity:.45;animation:grain-shift 1.37s steps(1,end) infinite reverse}
.cigarette-smoke{position:absolute;z-index:2;left:var(--tip-x);top:var(--tip-y);width:var(--smoke-width,60px);aspect-ratio:80/180;transform:translate(-50%,-98.89%);opacity:0;pointer-events:none}.cigarette-smoke.is-positioned{opacity:.72}.cigarette-smoke svg{display:block;width:100%;height:100%;overflow:visible}.smoke-drift{transform-origin:50% 100%;animation:smoke-drift 9.7s ease-in-out infinite alternate}.smoke-wisp{transform-box:view-box;transform-origin:40px 178px;stroke-width:1.8;stroke-dasharray:82 168;animation:smoke-rise 7.9s linear infinite}.wisp-two{stroke-width:2.5;stroke-dasharray:60 195;opacity:.6;animation-duration:10.3s;animation-delay:-4.3s}.wisp-three{stroke-width:1.1;stroke-dasharray:98 152;opacity:.48;animation-duration:8.9s;animation-delay:-6.1s}
.shade{position:absolute;inset:0;z-index:3;pointer-events:none;background:linear-gradient(90deg,#090a0b 4%,rgba(9,10,11,.88) 23%,rgba(9,10,11,.2) 61%,rgba(9,10,11,.08)),linear-gradient(0deg,#090a0b 0%,rgba(9,10,11,.75) 12%,transparent 54%),linear-gradient(180deg,rgba(0,0,0,.32),transparent 28%)}
.foreground{position:relative;height:var(--scene-height)}
.glass{border:1px solid rgba(255,255,255,.2);background:linear-gradient(125deg,rgba(255,255,255,.12),rgba(255,255,255,.035));backdrop-filter:blur(24px) saturate(.3);-webkit-backdrop-filter:blur(24px) saturate(.3);box-shadow:inset 0 1px rgba(255,255,255,.07),0 14px 40px rgba(0,0,0,.17)}
.site-header{position:absolute;z-index:10;top:clamp(24px,4vh,40px);left:clamp(24px,4vw,64px);right:clamp(24px,4vw,64px);display:flex;align-items:center;justify-content:space-between;gap:20px;padding:18px 26px;border-radius:100px}.wordmark{font-size:.8125rem;line-height:1.5;letter-spacing:.13em;font-weight:500;text-decoration:none;display:inline-flex;flex-wrap:wrap}.wordmark span{color:#bdbdbf}.wordmark:focus-visible{outline:none;filter:brightness(1.15);border-radius:2px}.page-label{font-size:.875rem;line-height:1.5;color:#ddd;white-space:nowrap;letter-spacing:.1em}
.identity{position:absolute;z-index:20;left:9%;bottom:378px;width:clamp(168px,13vw,190px);display:flex;align-items:center;flex-direction:column;mix-blend-mode:screen}.logo-crop{position:relative;width:clamp(93.789px,8.709vw,127.285px);aspect-ratio:396/587;overflow:hidden;opacity:.76}.logo-crop img{position:absolute;width:323.2323%;max-width:none;height:auto;left:-111.6162%;top:-60.4770%;filter:invert(1) brightness(16)}
.content-area{position:absolute;z-index:30;bottom:68px;left:clamp(24px,4vw,64px);right:clamp(24px,4vw,64px)}.welcome{position:relative;min-height:124px;display:flex;align-items:center;justify-content:center;padding:28px 30px;border-radius:30px}h1{font-size:clamp(1.5rem,2.1vw,2rem);line-height:1.45;letter-spacing:.035em;font-weight:400;color:#f2f2f0;text-align:center;text-wrap:balance;margin:0}.glass-actions{position:relative;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-top:16px}.glass-button{appearance:none;min-height:54px;padding:14px 18px;border-radius:22px;font:inherit;font-size:.9375rem;line-height:1.4;letter-spacing:.025em;color:#f2f2f0;background-color:rgba(18,18,20,.2);transition:background-color 300ms ease,border-color 300ms ease,transform 300ms ease}.glass-button:disabled{opacity:1;cursor:default;-webkit-text-fill-color:#f2f2f0}.glass-button:hover{background-color:rgba(255,255,255,.07);border-color:rgba(255,255,255,.34);transform:translateY(-2px)}.glass-button:active{background-color:rgba(255,255,255,.1);transform:translateY(-1px)}
footer{position:absolute;z-index:10;bottom:23px;left:24px;right:24px;text-align:center;font-size:.75rem;line-height:1.5;letter-spacing:.14em;color:#a0a0a5}
@keyframes grain-shift{0%,100%{transform:translate(0,0)}13%{transform:translate(-8px,11px)}29%{transform:translate(13px,-7px)}41%{transform:translate(-16px,-3px)}57%{transform:translate(5px,16px)}68%{transform:translate(17px,5px)}83%{transform:translate(-4px,-14px)}94%{transform:translate(9px,-10px)}}
@keyframes smoke-rise{from{stroke-dashoffset:250}to{stroke-dashoffset:0}}@keyframes smoke-drift{0%{transform:skewX(-3deg) scaleX(.96)}37%{transform:skewX(2deg) scaleX(1.03)}72%{transform:skewX(-1deg) scaleX(1.06)}100%{transform:skewX(4deg) scaleX(1.02)}}
.motion-paused .film-grain,.motion-paused .film-grain::after,.motion-paused .smoke-drift,.motion-paused .smoke-wisp{animation-play-state:paused}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){.glass{background:rgba(35,36,37,.94)}}
@media(min-width:1600px){.portrait{width:69%;object-position:50% 35%}.identity{left:13%}}
@media(max-width:600px){:root{--scene-height:max(800px,100svh)}.portrait{width:100%;height:88%;object-position:55% 15%;mask-image:none;-webkit-mask-image:none}.shade{background:linear-gradient(0deg,#090a0b 2%,rgba(9,10,11,.94) 18%,rgba(9,10,11,.2) 46%,transparent 67%),linear-gradient(90deg,rgba(0,0,0,.12),transparent 70%),linear-gradient(180deg,rgba(0,0,0,.4),transparent 25%)}.site-header{left:20px;right:20px;top:max(20px,env(safe-area-inset-top));padding:15px 17px;gap:12px}.wordmark{font-size:.75rem;letter-spacing:.05em}.page-label{font-size:.75rem;letter-spacing:.04em}.identity{left:50%;transform:translateX(-50%);bottom:330px;width:auto}.logo-crop{width:62.973px}.content-area{bottom:68px;left:20px;right:20px}.welcome{min-height:108px;padding:23px 20px;border-radius:26px}h1{font-size:1.35rem;letter-spacing:.018em}.glass-actions{gap:12px;margin-top:14px}.glass-button{min-height:52px;padding:13px 10px;font-size:.875rem;border-radius:20px}footer{font-size:.75rem;letter-spacing:.1em}}
@media(max-width:359px){.site-header{left:14px;right:14px;padding:14px}.wordmark{letter-spacing:0}.content-area{left:14px;right:14px}.page-label{font-size:.75rem}.glass-actions{gap:10px}.glass-button{font-size:.8125rem}}
@media(prefers-reduced-motion:reduce){.portrait{filter:brightness(.88);will-change:auto}.film-grain,.film-grain::after{animation:none;will-change:auto}.cigarette-smoke{display:none}.glass-button{transition:none;transform:none}}
@media(prefers-reduced-transparency:reduce){.glass{background:rgba(30,31,32,.96)}.film-grain{display:none}}
@media(forced-colors:active){.glass{border:1px solid CanvasText}.portrait,.shade,.film-grain,.cigarette-smoke{display:none}.identity{mix-blend-mode:normal}.logo-crop{display:none}}

/* Editorial typography: navigation intentionally retains its original font. */
@font-face{font-family:"IBM Plex Mono";font-style:normal;font-weight:400;font-display:swap;src:url('/assets/ibm-plex-mono-regular.ttf') format('truetype')}
.site-header{justify-content:center}
.welcome h1{font-family:"IBM Plex Mono","Courier New",monospace;font-weight:400}
.welcome h1{font-size:clamp(1.125rem,1.6vw,1.5rem);letter-spacing:.025em;line-height:1.6}
.typewriter-letter{visibility:hidden;position:relative}
.typewriter-letter.is-visible{visibility:visible}
.typewriter-letter.is-cursor::after{content:"";position:absolute;left:100%;top:.15em;width:1px;height:1.05em;background:currentColor;opacity:.7;animation:cursor-blink 1s ease-in-out infinite}
.typewriter-letter.cursor-fading::after{animation:cursor-fade .5s ease forwards}
@keyframes cursor-blink{0%,100%{opacity:.15}45%,65%{opacity:.7}}
@keyframes cursor-fade{from{opacity:.6}to{opacity:0}}
@media(max-width:600px){.welcome h1{font-size:1.0625rem;letter-spacing:.02em}}
@media(max-width:359px){.welcome h1{font-size:1rem}}
@media(prefers-reduced-motion:reduce){.typewriter-letter{visibility:visible}.typewriter-letter.is-cursor::after{display:none;animation:none}}
.typewriter-word{display:inline-block;white-space:nowrap}

/* Edge-only shading preserves the brightness of the face. */
.shade::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(0deg,rgba(0,0,0,.12),transparent 38%),linear-gradient(90deg,rgba(0,0,0,.07),transparent 25%,transparent 85%,rgba(0,0,0,.04))}


/* Cinematic entrance: black hold, portrait, card, typing, then choices. */
html,body,.portrait-home{background:#000}
.backdrop{opacity:0;transition:opacity 2000ms ease-in-out}
.portrait-revealed .backdrop{opacity:1}
.welcome{opacity:0;transform:translateY(8px);transition:opacity 1400ms cubic-bezier(.22,1,.36,1),transform 1400ms cubic-bezier(.22,1,.36,1)}
.card-revealed .welcome{opacity:1;transform:translateY(0)}
.glass-button{font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","SF Pro Display","Helvetica Neue",Arial,sans-serif}
.glass-actions{opacity:0;visibility:hidden;transform:translateY(10px);transition:opacity 2200ms cubic-bezier(.22,1,.36,1),transform 2200ms cubic-bezier(.22,1,.36,1)}
.glass-actions.is-revealed{opacity:1;visibility:visible;transform:translateY(0)}
.intro-complete .backdrop,.intro-complete .welcome,.intro-complete .glass-actions{opacity:1;visibility:visible;transform:none;transition:none}
@media(prefers-reduced-motion:reduce){.backdrop,.welcome,.glass-actions{opacity:1;visibility:visible;transform:none;transition:none}}

/* Two complete title breaths; all later stages are coordinated in typewriter.js. */
.identity .logo-crop{animation:logo-breathe 3500ms ease-in-out 1 both}
@keyframes logo-breathe{0%,100%{transform:scale(.9);opacity:.55}50%{transform:scale(1.06);opacity:1}}
footer{opacity:0;transition:opacity 800ms ease}
.footer-revealed footer{opacity:1}
.site-header{left:50%;right:auto;width:calc(100% - 2 * clamp(24px,4vw,64px));height:57.5px;transform:translateX(-50%);padding:0;overflow:hidden;transition:width 3000ms cubic-bezier(.22,1,.36,1),height 3000ms cubic-bezier(.22,1,.36,1),border-radius 3000ms cubic-bezier(.22,1,.36,1)}
.wordmark{position:absolute;inset:0;align-items:center;justify-content:center;flex-wrap:nowrap}
.wordmark .address-label{color:inherit;white-space:nowrap;transition:opacity 650ms ease}
.wordmark:focus-visible{outline-offset:-5px;border-radius:inherit}
.header-logo{position:absolute;inset:0;display:grid;place-items:center;padding:0;margin:0;line-height:0;opacity:0;mix-blend-mode:screen;pointer-events:none;transition:opacity 1200ms ease}
.header-logo svg{display:block;width:35%;height:auto;aspect-ratio:450/644;margin:0;overflow:hidden}
.bar-condensed .site-header{width:56px;height:56px;border-radius:28px}
.bar-condensed .address-label{opacity:0}
.bar-condensed .header-logo{opacity:.85;transition-delay:1400ms}
.intro-complete footer{opacity:1;transition:none}
.intro-complete .site-header,.intro-complete .address-label,.intro-complete .header-logo{transition:none}
.intro-complete .identity .logo-crop{animation:none}
@media(max-width:600px){.site-header{width:calc(100% - 40px);height:50px;padding:0}}
@media(max-width:359px){.site-header{width:calc(100% - 28px);height:48px;padding:0}}
@media(prefers-reduced-motion:reduce){.identity .logo-crop{animation:none}footer{opacity:1;transition:none}.site-header,.address-label,.header-logo{transition:none}}

.glass-button:not(:disabled){cursor:pointer}

/* Fine silver-grain scan: original photograph remains full-resolution. */
.portrait{filter:contrast(.94) brightness(calc(.94 - var(--depth)*.07)) saturate(.78) sepia(.035) blur(calc(var(--depth)*6px))}
.film-scan{position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(145deg,rgba(213,201,180,.025),transparent 42%,rgba(116,132,151,.028));}
.film-scan::before{content:"";position:absolute;inset:0;background:url('/assets/film-grain.svg') repeat 0 0/210px 210px;opacity:.018;mix-blend-mode:soft-light}
.film-scan::after{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at 0% 78%,rgba(172,66,28,.065),rgba(115,39,19,.02) 28%,transparent 56%);mix-blend-mode:screen;animation:leak-breathe 19s ease-in-out infinite alternate}
.film-grain{background-size:96px 96px;opacity:.09;mix-blend-mode:soft-light;animation:grain-shift 1.63s steps(1,end) infinite}
.film-grain::after{background-size:113px 113px;opacity:.5;animation-duration:2.17s}
.film-dust{position:absolute;inset:0;z-index:2;pointer-events:none;overflow:hidden}
.film-dust::before,.film-dust::after{content:"";position:absolute;inset:0;opacity:0;pointer-events:none;will-change:opacity}
.film-dust::before{background:radial-gradient(circle at 16% 37%,rgba(244,238,227,.4) 0 .45px,transparent 1px),radial-gradient(circle at 82% 64%,rgba(244,238,227,.28) 0 .5px,transparent 1.1px),radial-gradient(circle at 37% 81%,rgba(244,238,227,.3) 0 .35px,transparent .9px);animation:dust-flicker 11.7s steps(1,end) infinite}
.film-dust::after{background:linear-gradient(178deg,transparent,rgba(224,217,200,.17),transparent) 9% 59%/0.6px 29px no-repeat,radial-gradient(circle at 89% 24%,rgba(244,238,227,.3) 0 .4px,transparent 1px);animation:dust-flicker 17.3s steps(1,end) -7s infinite}
.shade::before{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at 54% 39%,transparent 39%,rgba(0,0,0,.12) 100%);pointer-events:none}
@keyframes leak-breathe{0%{opacity:.3}48%{opacity:.65}100%{opacity:1}}
@keyframes dust-flicker{0%,12%,49%,81%,100%{opacity:0;transform:translate(0,0)}10%{opacity:.55;transform:translate(2px,-4px)}47%{opacity:.4;transform:translate(-11px,17px)}79%{opacity:.6;transform:translate(8px,-15px)}}
.motion-paused .film-scan::after,.motion-paused .film-dust::before,.motion-paused .film-dust::after{animation-play-state:paused}
@media(prefers-reduced-motion:reduce){.portrait{filter:contrast(.94) brightness(.94) saturate(.78) sepia(.035)}.film-grain,.film-grain::after,.film-scan::after,.film-dust::before,.film-dust::after{animation:none;will-change:auto}.dialog-close{transition:none}}
@media(prefers-reduced-transparency:reduce){.film-scan,.film-dust{display:none}.dialog-close{background:#343434}}
@media(forced-colors:active){.film-scan,.film-dust{display:none}}

/* Secondary link sits in the existing scroll area, without moving hero content. */
.social-entry{position:absolute;z-index:30;top:calc(100% + 18px);left:0;right:0;display:flex;justify-content:center;opacity:0;visibility:hidden;transform:translateY(8px);transition:opacity 800ms ease,transform 800ms ease}
.social-revealed .social-entry{opacity:1;visibility:visible;transform:translateY(0)}
.instagram-button{display:grid;place-items:center;flex:none;width:48px;aspect-ratio:1;border-radius:50%;padding:0;color:#fff;border-color:rgba(255,255,255,.15);background-color:rgba(255,255,255,.025);cursor:pointer;transition:transform 350ms ease-out,background-color 350ms ease-out,border-color 350ms ease-out}
.instagram-button svg{display:block;width:20px;height:20px;opacity:.85;transition:opacity 350ms ease-out}
@media(hover:hover){.instagram-button:hover{transform:scale(1.05);background-color:rgba(255,255,255,.07);border-color:rgba(255,255,255,.3)}.instagram-button:hover svg{opacity:1}}
.instagram-button:active{transform:scale(.96)}
.instagram-button:focus-visible{outline:none;background-color:#ffffff18}
@media(max-width:600px){.instagram-button{width:44px}.instagram-button svg{width:19px;height:19px}}
.intro-complete .social-entry{opacity:1;visibility:visible;transform:none;transition:none}
@media(prefers-reduced-motion:reduce){.social-entry{opacity:1;visibility:visible;transform:none;transition:none}.instagram-button,.instagram-button svg{transition:none}.instagram-button:hover,.instagram-button:active{transform:none}}



html.modal-scroll-lock{overflow:hidden}body.modal-scroll-lock{position:fixed;top:var(--modal-scroll-top,0px);left:0;right:0;width:100%;overflow:hidden}

button:focus,a:focus,input:focus{outline:none}button:focus-visible,a:focus-visible{filter:brightness(1.15)}
