@font-face{font-family:Code Mono;src:url(fonts/code-regular.ttf) format('truetype');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:Code Mono;src:url(fonts/code-bold.ttf) format('truetype');font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:Classic Mono;src:url(fonts/classic-regular.otf) format('opentype');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:Classic Mono;src:url(fonts/classic-bold.otf) format('opentype');font-weight:700;font-style:normal;font-display:swap}
:root{--background:#0b0d0f;--foreground:#eff2f3;--mx:0;--my:0;--name-font:"Code Mono";color-scheme:dark}
html[data-font="classic"]{--name-font:"Classic Mono"}
*,*:before,*:after{box-sizing:border-box}
html{background:var(--background);min-width:280px}
body{margin:0;min-height:100svh;background:var(--background);color:var(--foreground);font-family:'Code Mono','Courier New',monospace;-webkit-font-smoothing:antialiased;isolation:isolate}
button,a{-webkit-tap-highlight-color:transparent;touch-action:manipulation}
button{font:inherit;color:inherit;cursor:pointer}
a{color:inherit;text-decoration:none}
button:focus-visible,a:focus-visible{outline:1px solid #d6e5eb;outline-offset:7px}
::selection{background:#b8cbd0;color:#0a1114}
.sr-only{position:absolute;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;width:1px;height:1px;padding:0;margin:-1px;border:0}
.stage{position:fixed;inset:0;z-index:-1;overflow:hidden;background:radial-gradient(ellipse at 70% 35%,#242a2b 0%,#0e1113 38%,#090b0d 78%)}
.ambient-light{position:absolute;inset:-15%;background:radial-gradient(ellipse at 75% 40%,rgba(108,135,147,.1),transparent 48%)}
#field{position:absolute;inset:0;width:100%;height:100%;opacity:.95}
.portrait-scene{position:absolute;aspect-ratio:1;width:min(52vw,940px);right:3vw;top:50%;opacity:.88;pointer-events:none;mask-image:radial-gradient(ellipse 64% 65% at 52% 46%,#000 38%,rgba(0,0,0,.94) 54%,rgba(0,0,0,.5) 68%,transparent 87%);-webkit-mask-image:radial-gradient(ellipse 64% 65% at 52% 46%,#000 38%,rgba(0,0,0,.94) 54%,rgba(0,0,0,.5) 68%,transparent 87%);transform:translate(calc(var(--mx)*-7px),calc(-50% + var(--my)*-5px));transition:transform 1.1s ease-out;animation:portrait-enter 1.8s ease-out both}
.portrait{display:block;width:100%;height:100%;object-fit:cover;filter:grayscale(1) contrast(1.08) brightness(.84)}
.scene-shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(7,10,12,.45),rgba(7,10,12,.14) 37%,transparent 68%),linear-gradient(0deg,rgba(7,9,11,.76),transparent 24%,transparent 84%,rgba(7,9,11,.25))}
.grain{position:absolute;inset:0;opacity:.016;pointer-events:none;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.93' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='%23fff' filter='url(%23noise)' d='M0 0h180v180H0z'/%3E%3C/svg%3E");background-size:180px}
.page-shell{width:100%;min-height:100svh;display:flex;align-items:center;padding:80px 9.8vw 96px}
main{min-width:0;width:100%}
.intro{position:relative;z-index:1;width:max-content;max-width:100%;animation:intro-enter 1.3s .1s both}
h1{font-family:var(--name-font),'Courier New',monospace;font-size:clamp(72px,7.2vw,124px);font-weight:400;letter-spacing:-.045em;line-height:1.13;margin:0;color:#eff2f3;white-space:nowrap;text-shadow:0 2px 30px rgba(0,0,0,.2)}
h1>span{font-weight:700}
.terminal-block{width:min(42ch,80vw);max-width:100%;font-size:clamp(16px,1.2vw,19px);line-height:1.7;letter-spacing:.1px;color:#c1cdd4;margin:25px 0 0 4px}
.terminal-visual{display:none;align-items:flex-start;gap:.6em;min-height:3.4em;margin:0}
.terminal-prompt{flex:none;color:#8da9b8;user-select:none}
.terminal-copy{flex:1;min-width:0;white-space:pre-wrap;overflow-wrap:anywhere}
.terminal-cursor{display:inline-block;width:.5em;height:1em;margin-left:.08em;background:#c4dce8;vertical-align:-.13em;animation:cursor-blink 1.15s steps(1,end) infinite}
.terminal-statements{list-style:none;padding:0;margin:0}
.terminal-statements li+li{margin-top:.3em}
.terminal-block.is-animated .terminal-visual{display:flex}
.terminal-block.is-animated .terminal-statements{position:absolute;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;width:1px;height:1px;padding:0;margin:-1px;border:0}
@keyframes cursor-blink{0%,48%,100%{opacity:1}49%,99%{opacity:0}}
.connection-row{display:flex;align-items:center;margin:34px 0 0 4px}
.socials{display:flex;gap:13px;align-items:center}
.social{position:relative;display:grid;place-items:center;width:48px;height:48px;border:1px solid rgba(167,191,201,.25);background:rgba(21,28,33,.28);color:#bdcbd2;border-radius:50%;padding:13px;transition:background .3s,color .3s,border-color .3s,box-shadow .3s,transform .3s;backdrop-filter:blur(12px)}
.social:hover,.social:focus-visible{color:#edf9ff;border-color:rgba(190,222,235,.65);background:rgba(87,114,125,.2);box-shadow:0 0 24px rgba(161,214,238,.07);transform:translateY(-3px)}
.social svg{display:block;width:100%;height:100%;flex-shrink:0}
.social-tooltip{position:absolute;top:calc(100% + 11px);left:50%;transform:translate(-50%,-3px);font-family:'Code Mono',monospace;font-size:13px;line-height:1.5;white-space:nowrap;color:#b9c8d0;pointer-events:none;opacity:0;transition:opacity .2s,transform .2s}
.social-tooltip>span{font-size:12px;margin-left:2px}
.social:hover .social-tooltip,.social:focus-visible .social-tooltip{opacity:1;transform:translate(-50%,0)}
.motion-toggle{position:fixed;right:5vw;bottom:25px;z-index:4;display:grid;place-items:center;width:40px;height:40px;padding:12px;border:1px solid transparent;border-radius:50%;color:#9eafb8;background:transparent;transition:border-color .2s,color .2s}
.motion-toggle:hover{color:#eef7fa;border-color:#596870}
.motion-toggle>svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.2;stroke-linecap:round}
.motion-toggle .play-symbol{display:none;fill:currentColor;stroke:none}
.motion-toggle[aria-pressed="true"] .play-symbol{display:block}
.motion-toggle[aria-pressed="true"] .pause-symbol{display:none}
.notice{position:fixed;left:50%;bottom:30px;transform:translate(-50%,12px);z-index:10;background:rgba(24,31,35,.95);border:1px solid #3c4b53;border-radius:5px;padding:15px 20px;color:#d4dfe5;font-family:'Code Mono',monospace;font-size:14px;line-height:1.6;max-width:calc(100vw - 38px);width:max-content;opacity:0;pointer-events:none;transition:opacity .3s,transform .3s;backdrop-filter:blur(16px);box-shadow:0 10px 45px #0005}
.notice.visible{opacity:1;transform:translate(-50%,0)}
body.motion-paused{--mx:0;--my:0}
body.motion-paused .portrait-scene{transition:none}
@keyframes intro-enter{from{opacity:0;translate:0 12px}to{opacity:1;translate:0 0}}
@keyframes portrait-enter{from{opacity:0}to{opacity:.88}}
@media(min-width:1800px){.page-shell{padding-inline:max(9.8vw,calc((100vw - 1500px)/2))}.portrait-scene{right:calc((100vw - 1820px)/2)}h1{font-size:132px}}
@media(max-width:1100px){.page-shell{padding-inline:8vw}.portrait-scene{width:64vw;right:-2vw}.scene-shade{background:linear-gradient(90deg,rgba(7,10,12,.5),rgba(7,10,12,.17) 46%,transparent 78%),linear-gradient(0deg,rgba(7,9,11,.8),transparent 32%)}h1{font-size:clamp(72px,7.2vw,100px)}}
@media(max-width:800px){.page-shell{align-items:end;padding:250px 7vw max(100px,13svh)}.portrait-scene{width:min(100vw,680px);right:0;top:7svh;transform:translate(calc(var(--mx)*-5px),calc(var(--my)*-4px));mask-image:radial-gradient(ellipse 61% 61% at 52% 44%,#000 30%,rgba(0,0,0,.9) 49%,rgba(0,0,0,.5) 64%,transparent 87%);-webkit-mask-image:radial-gradient(ellipse 61% 61% at 52% 44%,#000 30%,rgba(0,0,0,.9) 49%,rgba(0,0,0,.5) 64%,transparent 87%)}.scene-shade{background:linear-gradient(0deg,rgba(7,9,11,.88),rgba(7,9,11,.6) 29%,rgba(7,9,11,.2) 49%,transparent 74%)}h1{font-size:clamp(58px,10.4vw,84px)}.terminal-block{font-size:17px;margin-top:20px;margin-left:2px}.connection-row{margin-top:29px;margin-left:2px}.social{width:47px;height:47px;padding:13px}.motion-toggle{right:6vw;bottom:22px}}
@media(max-width:480px){.page-shell{padding:230px 7vw max(92px,13svh)}.portrait-scene{width:118vw;right:-18vw;top:8svh}.portrait{filter:grayscale(1) contrast(1.08) brightness(.86)}h1{font-size:clamp(40px,12.2vw,60px);letter-spacing:-.045em}.terminal-block{font-size:17px;line-height:1.7;margin-top:17px;letter-spacing:0}.connection-row{margin-top:28px}.socials{gap:12px}.social{width:46px;height:46px;padding:12px}.social-tooltip{font-size:12px}.motion-toggle{right:6vw;bottom:18px}.notice{bottom:75px;font-size:14px;padding:12px 16px}}
@media(max-width:360px){.page-shell{padding-inline:6vw}.terminal-block{font-size:16px}.portrait-scene{width:120vw;right:-18vw}.social{width:44px;height:44px;padding:12px}}
@media(max-width:800px) and (max-height:700px) and (orientation:portrait){.portrait-scene{width:108vw;right:-12vw;top:5svh}.page-shell{padding-top:210px;padding-bottom:84px}.terminal-block{margin-top:14px}.connection-row{margin-top:23px}}
@media(max-width:800px) and (orientation:landscape){.page-shell{align-items:center;padding:58px 7vw}.portrait-scene{width:62vw;right:2vw;top:50%;transform:translate(calc(var(--mx)*-5px),calc(-50% + var(--my)*-4px))}h1{font-size:clamp(45px,8vw,65px)}.terminal-block{font-size:15px;margin-top:15px}.connection-row{margin-top:22px}.scene-shade{background:linear-gradient(90deg,rgba(7,10,12,.55),transparent),linear-gradient(0deg,rgba(7,9,11,.65),transparent 45%)}.motion-toggle{bottom:15px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}.portrait-scene{--mx:0;--my:0}.social:hover,.social:focus-visible{transform:none}}