@import url('https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=DM+Sans:wght@400;450;500;600;700&display=swap');

:root{color-scheme:light;--paper:#eeeee5;--ink:#273b30;--muted:#6b7266;--orange:#df572d;--line:#ccd0c2;--mono:'DM Mono',monospace}
*{box-sizing:border-box}
body{margin:0;background:var(--paper);color:var(--ink);font-family:'DM Sans',sans-serif;-webkit-font-smoothing:antialiased}
body::before{content:'';position:fixed;inset:0;pointer-events:none;opacity:.035;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='%23000' filter='url(%23n)' opacity='.6' d='M0 0h180v180H0z'/%3E%3C/svg%3E")}
.page{max-width:1600px;min-height:100svh;margin:auto;padding:0 6.2%;display:flex;flex-direction:column}
header{height:126px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}
a{color:inherit}
.wordmark{display:inline-flex;align-items:center;gap:12px;font:500 17px var(--mono);letter-spacing:-.5px;text-decoration:none}.name-marker{width:10px;height:16px;border:1.5px solid var(--orange);box-shadow:3px 3px 0 var(--orange);transform:rotate(-8deg)}
.header-note,.eyebrow,.machine-top,.machine-caption,footer{font-family:var(--mono);font-size:11px}.header-note{color:var(--muted)}
main{flex:1;display:grid;grid-template-columns:1.45fr 1fr;align-items:center;gap:6%;padding:100px 0 110px}
.eyebrow{text-transform:uppercase;letter-spacing:1.5px;display:flex;align-items:center;gap:12px;margin:0 0 29px}.accent-dash{width:16px;height:3px;background:var(--orange)}
h1{font-family:'DM Sans',sans-serif;font-size:clamp(40px,4.6vw,68px);font-weight:600;letter-spacing:-.045em;line-height:1.1;margin:0 0 30px}h1>span{display:block}
.bio{font-size:15px;line-height:1.9;color:var(--muted);margin:0 0 36px}.socials{display:flex;flex-wrap:wrap;gap:10px}.contact{display:inline-flex;gap:20px;align-items:center;text-decoration:none;border:1px solid var(--line);border-radius:6px;padding:11px 15px;font-size:13px;font-weight:500;min-height:44px;transition:background .15s,border-color .15s}.link-arrow{display:block;width:15px;height:15px;flex:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;color:var(--muted)}.contact:hover{background:#e2e5d9;border-color:#a8b09e}.contact:hover .link-arrow{color:var(--orange)}
.machine{max-width:392px;width:100%;justify-self:end;transform:rotate(-3deg);padding-top:15px}.machine-top{display:flex;justify-content:space-between;letter-spacing:1px;font-size:9px;margin-bottom:15px;color:var(--muted)}
.monitor{background:#d9dccd;padding:19px 19px 0;border:1px solid #bcc2b1;border-radius:13px;box-shadow:3px 6px 0 #c6cbbd,5px 9px 0 #b9c0ae,12px 22px 35px #273b3010}
.screen{background:#273b30;color:#d9e9a7;border:5px solid #bec6b2;border-radius:9px;padding:15px 16px 13px;box-shadow:inset 0 2px 12px #101f2660;position:relative;overflow:hidden}.screen::after{content:'';position:absolute;inset:0;pointer-events:none;background:repeating-linear-gradient(transparent 0 3px,#0000000a 3px 4px)}
.screen-top,.screen-bottom{display:flex;justify-content:space-between;font:8px var(--mono);letter-spacing:.5px;color:#9cac85}.screen-top>span:first-child{display:flex;align-items:center;gap:5px}.screen-top i{display:block;width:5px;height:5px;background:#d9e9a7;border-radius:50%}
.face{height:145px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px}.eyes{display:flex;gap:33px}.eyes span{width:13px;height:22px;background:#d9e9a7;border-radius:2px}.mouth{width:32px;height:12px;border:3px solid #d9e9a7;border-top:0;border-radius:0 0 8px 8px}.screen p{font:10px var(--mono);text-align:center;min-height:27px;margin:0 0 16px;line-height:1.6}.cursor{animation:blink 1.3s steps(1) infinite}.monitor-bottom{display:flex;align-items:center;justify-content:space-between;height:35px}.vents{width:58px;height:9px;background:repeating-linear-gradient(90deg,#a6af9b 0 2px,transparent 2px 5px)}.power{width:6px;height:6px;background:var(--orange);border-radius:50%;margin-right:6px}
.controls{display:flex;align-items:center;justify-content:space-between;padding:27px 2px 0;font:10px/1.6 var(--mono);color:var(--muted)}button{font:10px var(--mono);background:var(--orange);color:#fff8e8;border:1px solid #be4420;border-radius:4px;padding:12px 14px;box-shadow:0 3px 0 #ae4829;cursor:pointer;transition:transform .15s,box-shadow .15s}button span{margin-left:13px}button:hover{background:#ce4d25}button:active{transform:translateY(3px);box-shadow:none}.machine-caption{margin-top:37px;text-align:center;font-size:9px;color:var(--muted)}.machine-caption>span{font-size:16px;margin-right:8px}
footer{display:flex;align-items:center;justify-content:space-between;border-top:1px solid var(--line);min-height:85px;color:var(--muted);font-size:10px}
:focus-visible{outline:2px solid var(--orange);outline-offset:6px}.working .eyes span{height:6px}.working .mouth{width:18px;border-radius:0}.working .face{gap:24px}
@keyframes blink{50%{opacity:0}}
@media(min-width:1500px){main{gap:9%}}
@media(max-width:1000px){.page{padding:0 5%}main{gap:5%;grid-template-columns:1.2fr 1fr}h1{font-size:clamp(30px,4.5vw,45px)}.desktop-break{display:none}.bio{max-width:360px}.screen{padding:12px}.controls{font-size:9px}button{padding:11px 9px}}
@media(max-width:700px){header{height:87px}.header-note{font-size:9px}.wordmark{font-size:16px}.page{padding:0 7%}main{grid-template-columns:1fr;padding:60px 0 65px;gap:58px}.eyebrow{font-size:10px;margin-bottom:22px}h1{font-size:clamp(28px,8.2vw,54px);margin-bottom:25px}.bio{font-size:14px;max-width:420px;margin-bottom:27px}.machine{justify-self:center;max-width:340px;transform:rotate(-2deg)}.machine-caption{margin-top:27px}footer{align-items:flex-start;gap:16px;padding:23px 0;font-size:9px;line-height:1.8}footer>span{max-width:155px}footer>span:last-child{text-align:right}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}
