@font-face{font-family:Inter;src:url('assets/inter-black.ttf') format('truetype');font-weight:900;font-style:normal;font-display:swap}
@font-face{font-family:Inter;src:url('assets/inter-regular.ttf') format('truetype');font-weight:400;font-style:normal;font-display:swap}
:root{--paper:#f9f9f6;--ink:#111110;--ease:cubic-bezier(.16,1,.3,1);--gutter:clamp(24px,3.2vw,64px)}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:var(--paper);color:var(--ink)}body{font-family:Inter,Arial,sans-serif;-webkit-font-smoothing:antialiased}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit}a{color:inherit;text-decoration:none}button{cursor:pointer}button:focus-visible,a:focus-visible{outline:2px solid currentColor;outline-offset:7px}::selection{background:var(--ink);color:var(--paper)}
.site-shell{min-height:100svh;position:relative;display:flex;flex-direction:column;padding:30px var(--gutter) 26px;overflow:hidden}.header,.footer{display:flex;align-items:center;justify-content:space-between;z-index:1}.header{height:43px}.monogram{font-size:39px;line-height:1;font-weight:900;letter-spacing:-4px}.monogram span{display:inline-block;margin-left:3px}.edition,.footer,.contact-trigger,.panel-top,.panel-bottom,.link-label{font-size:10px;letter-spacing:.11em}.edition{opacity:.5;padding-top:6px}main{flex:1;display:flex;align-items:center;position:relative;min-height:300px}.name-stage{width:100%;padding:0 24px 0 0;position:relative;transform:translateY(-8px)}.word{margin:0;display:flex;align-items:baseline;width:max-content;font-weight:900;font-size:24vw;line-height:1.13;letter-spacing:0;white-space:nowrap}.letter-mask{display:block;overflow:hidden;margin-right:-.055em;padding-bottom:.05em;margin-bottom:-.05em}.letter{display:block;transform-origin:bottom left}.word .letter-mask:last-child{margin-right:0}.contact-trigger{z-index:2;position:absolute;right:0;top:50%;display:flex;gap:12px;align-items:center;writing-mode:vertical-rl;border:0;background:none;padding:14px 8px;transform:translateY(-50%);transition:opacity .2s}.contact-trigger:hover{opacity:.5}.plus{font-size:22px;line-height:1;letter-spacing:0;transition:transform .4s var(--ease)}.contact-trigger:hover .plus{transform:rotate(90deg)}.footer{min-height:30px}.copyright{opacity:.5;font-size:9px}.replay{background:transparent;border:0;display:flex;align-items:center;gap:9px;padding:8px 0;font-size:9px;letter-spacing:.08em}.replay svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.2;transition:transform .6s var(--ease)}.replay:hover svg{transform:rotate(-65deg)}
.intro-curtain{position:fixed;inset:0;background:var(--ink);z-index:10;pointer-events:none;transform:scaleY(0);transform-origin:top}.js .intro-curtain{transform:scaleY(1)}.js:not(.ready) .letter{transform:translateY(118%) rotate(6deg)}.js:not(.ready) .header,.js:not(.ready) .footer,.js:not(.ready) .contact-trigger{opacity:0}.ready .intro-curtain{animation:curtain 1.1s var(--ease) both}.ready .letter{animation:letter-in 1.5s var(--ease) both;animation-delay:calc(.24s + var(--i)*.075s)}.ready .header,.ready .footer,.ready .contact-trigger{animation:details-in 1s ease both;animation-delay:1.1s}@keyframes curtain{to{transform:scaleY(0)}}@keyframes letter-in{from{transform:translateY(118%) rotate(6deg)}to{transform:translateY(0) rotate(0)}}@keyframes details-in{from{opacity:0}to{opacity:1}}
.contact-panel{border:0;margin:0 0 0 auto;padding:0;background:var(--ink);color:var(--paper);height:100dvh;max-height:100dvh;width:min(560px,100%);max-width:100%;position:fixed;inset:0;overflow-y:auto;overscroll-behavior:contain}.contact-panel::backdrop{background:rgba(17,17,16,.28);backdrop-filter:blur(5px)}.contact-panel[open]{animation:panel-in .65s var(--ease) both}.contact-panel[open]::backdrop{animation:backdrop-in .45s both}.contact-panel.closing{animation:panel-out .35s ease both}.contact-panel.closing::backdrop{animation:backdrop-out .35s both}.panel-inner{padding:32px 42px 28px;min-height:100%;display:flex;flex-direction:column}.panel-top,.panel-bottom{display:flex;justify-content:space-between;align-items:center}.panel-top>span{opacity:.5}.close{height:40px;width:40px;border:1px solid #ffffff45;background:transparent;border-radius:50%;display:grid;place-items:center;transition:background .2s,transform .4s}.close svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.3}.close:hover{background:#ffffff18;transform:rotate(90deg)}.contact-content{margin:auto 0;padding:50px 0 60px}h2{font-size:clamp(78px,10vw,120px);font-weight:900;line-height:.88;letter-spacing:-.065em;margin:0 0 60px}.period{color:#a5b7f0}.contact-links>a{display:flex;align-items:center;justify-content:space-between;padding:23px 0;border-top:1px solid #ffffff35}.contact-links>a:last-child{border-bottom:1px solid #ffffff35}.link-text{display:flex;flex-direction:column;gap:12px}.link-label{opacity:.5;font-size:9px}.link-value{font-size:clamp(21px,3vw,29px);letter-spacing:-.045em}.link-arrow{font-size:29px;font-weight:400;transition:transform .3s var(--ease),color .3s}.contact-links>a:hover .link-arrow{transform:translate(4px,-4px);color:#a5b7f0}.panel-bottom{opacity:.45;font-size:9px}@keyframes panel-in{from{transform:translateX(100%)}to{transform:translateX(0)}}@keyframes panel-out{to{transform:translateX(100%)}}@keyframes backdrop-in{from{opacity:0}to{opacity:1}}@keyframes backdrop-out{to{opacity:0}}
@media(min-width:1600px){.name-stage{padding-right:34px}}@media(max-width:600px){.site-shell{padding-top:20px;padding-bottom:20px}.header{height:35px}.monogram{font-size:34px}.edition{font-size:8px}.name-stage{padding-right:0;transform:translateY(-20px)}.contact-trigger{right:0;top:auto;bottom:calc(50% - 100px);writing-mode:horizontal-tb;transform:none;padding:12px 0;gap:10px;font-size:9px}.plus{font-size:18px}.panel-inner{padding:22px 26px}.contact-content{padding:45px 0}h2{margin-bottom:48px}.copyright,.replay{font-size:8px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}.intro-curtain{display:none}.js:not(.ready) .letter{transform:none}.js:not(.ready) .header,.js:not(.ready) .footer,.js:not(.ready) .contact-trigger{opacity:1}}
/* A separate ink surface lets pointer motion coexist with the entrance masks. */
.name-motion{position:absolute;left:-28px;top:-28px;pointer-events:none;opacity:0;transition:opacity .15s;z-index:1}
.name-motion.motion-ready{opacity:1}
.name-stage.motion-ready .word{opacity:0}
@media(prefers-reduced-motion:reduce){.name-motion{display:none}.name-stage.motion-ready .word{opacity:1}}

.about-section{width:min(100%,688px);margin:0;padding:100px var(--gutter) 150px}
.about-title{font-size:clamp(28px,4vw,38px);line-height:1.1;font-weight:900;letter-spacing:-.055em;margin:0 0 24px}
.about-box{width:100%;min-height:240px;border:1px solid rgba(17,17,16,.45)}
@media(max-width:600px){.about-section{padding-top:72px;padding-bottom:96px}.about-title{margin-bottom:20px}.about-box{min-height:210px}}

.about-box{padding:clamp(24px,4vw,38px)}
.about-box p{margin:0 0 22px;font-size:15px;line-height:1.8;letter-spacing:-.015em;color:#555550}
.about-box .about-intro{font-size:clamp(19px,2.5vw,23px);line-height:1.5;letter-spacing:-.035em;color:var(--ink);margin-bottom:28px}
.about-box .about-closing{color:var(--ink);margin:28px 0 0}

/* The reactive sheet is bounded by the opening screen, below its controls. */
.header,.footer{z-index:3}
.site-shell{-webkit-user-select:none;user-select:none}
/* Keep the arrow over the decorative lettering and liquid surface. */
.site-shell,.name-stage,.word,.word *,.name-motion{cursor:default}

.home-nav{display:flex;align-items:center;gap:28px}.home-nav .header-portfolio{display:inline-flex;align-items:center;gap:5px;padding:12px 0;font-size:10px;font-weight:400;letter-spacing:.1em;color:inherit;text-decoration:none;cursor:pointer;transition:opacity .2s}.home-nav .header-portfolio:hover{opacity:.55}.home-nav .header-portfolio:focus-visible{outline:1px solid currentColor;outline-offset:5px}@media(max-width:600px){.home-nav{gap:20px}.home-nav .header-portfolio{font-size:9px}}

.home-nav .header-link{border:0;background:none;padding:12px 0;font:400 10px Inter,Arial,sans-serif;letter-spacing:.1em;cursor:pointer;white-space:nowrap}.home-nav .header-link:hover{opacity:.55}.footer{position:relative}.hero-scroll-cue{position:absolute;left:50%;transform:translateX(-50%);font-size:9px;letter-spacing:.12em;white-space:nowrap;padding:12px 0;opacity:.65}.hero-scroll-cue:hover{opacity:1}.hero-scroll-cue span{display:inline-block;margin-left:6px}.specs-section{padding:90px var(--gutter);border-top:1px solid #11111020}.specs-heading{max-width:600px;margin-bottom:36px}.specs-heading h2{font-size:clamp(38px,5vw,64px);letter-spacing:-.055em;line-height:1.05;margin:12px 0 16px}.specs-heading>p{font-size:15px;line-height:1.6;color:#66665f}.specs-grid{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid #11111030}.spec-card{padding:28px 24px;border-right:1px solid #11111030}.spec-card:last-child{border:0}.spec-card>span{font-size:9px;letter-spacing:.12em;color:#777770}.spec-card h3{font-size:23px;letter-spacing:-.045em;font-weight:400;margin:24px 0 14px}.spec-card p{font-size:13px;line-height:1.8;color:#66665f;margin:0}.specs-footnote{display:flex;justify-content:space-between;gap:18px;margin-top:20px;font-size:8px;letter-spacing:.12em;color:#777770}#games{scroll-margin-top:20px}
@media(max-width:950px){.specs-grid{grid-template-columns:repeat(2,1fr)}.spec-card:nth-child(2){border-right:0}.spec-card:nth-child(-n+2){border-bottom:1px solid #11111030}}
@media(max-width:600px){.header{height:auto;min-height:44px;align-items:flex-start;gap:16px}.home-nav{gap:4px 16px;flex-wrap:wrap;justify-content:flex-end;max-width:270px}.home-nav .header-link,.home-nav .header-portfolio,.home-nav .header-contact{font-size:9px;padding:9px 0}.hero-scroll-cue{top:-34px;font-size:8px}.specs-section{padding:64px var(--gutter)}.specs-grid{grid-template-columns:1fr}.spec-card{padding:25px;border-right:0;border-bottom:1px solid #11111030}.spec-card:nth-child(3){border-bottom:1px solid #11111030}.specs-footnote{flex-direction:column;gap:10px}}

/* Keep the Specs-to-About transition compact rather than reserving another full screen. */
.specs-section{padding-bottom:40px}.specs-section+.about-layout{min-height:0;padding-top:32px;padding-bottom:80px}@media(max-width:600px){.specs-section{padding-bottom:32px}.specs-section+.about-layout{padding-top:28px;padding-bottom:64px}}