:root{--paper:#fff6e9;--ink:#141414;--pink:#ff8fb1;--yellow:#ffd23f;--blue:#7c9eff;--green:#9ee86f;--orange:#ff8a4c;--purple:#c9a7ff;--border:3px solid var(--ink);--font-head:"Space Grotesk", sans-serif;--font-mono:"Space Mono", monospace}*{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}body{font-family:var(--font-head);background:var(--paper);color:var(--ink);background-image:linear-gradient(#1414140b 1px,#0000 1px),linear-gradient(90deg,#1414140b 1px,#0000 1px);background-size:28px 28px;overflow-x:hidden}::selection{background:var(--pink);color:var(--ink)}body:after{content:"";pointer-events:none;z-index:999;opacity:.05;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='200' height='200' filter='url(%23n)'/%3E%3C/svg%3E");position:fixed;inset:0}h1,h2,h3{letter-spacing:-.02em;line-height:1}a{color:inherit}section{max-width:1200px;margin:0 auto;padding:96px 6%}.hs{box-shadow:5px 5px 0 var(--ink)}.hs-sm{box-shadow:3px 3px 0 var(--ink)}.btn{font-family:var(--font-head);border:var(--border);box-shadow:4px 4px 0 var(--ink);cursor:pointer;-webkit-user-select:none;user-select:none;background:#fff;align-items:center;gap:8px;padding:12px 22px;font-size:15px;font-weight:700;text-decoration:none;transition:transform .15s,box-shadow .15s;display:inline-flex}.btn:hover{box-shadow:6px 6px 0 var(--ink);transform:translate(-2px,-2px)}.btn:active{box-shadow:2px 2px 0 var(--ink);transform:translate(2px,2px)}.btn-pink{background:var(--pink)}.btn-yellow{background:var(--yellow)}.btn-green{background:var(--green)}.tag{font-family:var(--font-mono);border:2px solid var(--ink);background:#fff;padding:4px 10px;font-size:12px;font-weight:700;display:inline-block}.tag-loc{background:var(--yellow);align-items:center;gap:6px;display:inline-flex}.tag-loc svg{flex-shrink:0}.section-head{margin-bottom:56px}.section-kicker{font-family:var(--font-mono);letter-spacing:.12em;text-transform:uppercase;border:var(--border);background:var(--yellow);box-shadow:3px 3px 0 var(--ink);margin-bottom:18px;padding:6px 12px;font-size:13px;font-weight:700;display:inline-block;transform:rotate(-2deg)}.section-title{font-size:clamp(34px,6vw,56px);font-weight:700}.section-title .hl{background:linear-gradient(transparent 55%, var(--green) 55%);white-space:nowrap;padding:0 6px}.section-title .hl-pink{background:linear-gradient(transparent 55%, var(--pink) 55%)}.nav{z-index:100;background:var(--paper);border-bottom:var(--border);justify-content:space-between;align-items:center;padding:14px 6%;display:flex;position:sticky;top:0}.nav-logo{font-family:var(--font-mono);align-items:center;gap:10px;font-size:18px;font-weight:700;text-decoration:none;display:flex}.nav-logo .dot{background:var(--ink);width:34px;height:34px;color:var(--paper);border:var(--border);place-items:center;font-size:15px;transition:transform .2s;display:grid;box-shadow:3px 3px #14141440}.nav-links{align-items:center;gap:6px;list-style:none;display:flex}.nav-links a{font-family:var(--font-mono);border:2px solid #0000;padding:8px 14px;font-size:13px;font-weight:700;text-decoration:none;transition:all .15s}.nav-links a:hover{border:2px solid var(--ink);box-shadow:3px 3px 0 var(--ink);background:#fff}.nav-cta{padding:9px 16px;font-size:13px}.hero{flex-direction:column;justify-content:center;min-height:calc(100vh - 66px);padding-top:40px;display:flex;position:relative}.hero-meta{font-family:var(--font-mono);flex-wrap:wrap;gap:10px;margin-bottom:28px;font-size:13px;display:flex}.hero-title{text-transform:uppercase;font-size:clamp(52px,11vw,140px);font-weight:700;line-height:.92}.hero-title .outline{color:#0000;-webkit-text-stroke:3px var(--ink);display:block}.hero-sub{font-family:var(--font-mono);max-width:560px;margin-top:30px;font-size:clamp(15px,2.4vw,20px);line-height:1.55}.hero-sub b{background:var(--yellow);padding:0 5px}.hero-btns{flex-wrap:wrap;gap:16px;margin-top:36px;display:flex}.sticker{font-family:var(--font-mono);border:var(--border);box-shadow:4px 4px 0 var(--ink);padding:10px 16px;font-size:13px;font-weight:700;animation:4s ease-in-out infinite wobble;position:absolute}.sticker-1{background:var(--green);top:16%;right:12%;transform:rotate(6deg)}.sticker-2{background:var(--pink);animation-delay:-2s;top:42%;right:22%;transform:rotate(-8deg)}.sticker-3{background:var(--blue);animation-delay:-1s;top:68%;right:8%;transform:rotate(4deg)}@keyframes wobble{0%,to{margin-top:0}50%{margin-top:-12px}}.hero-scroll{font-family:var(--font-mono);align-items:center;gap:10px;font-size:12px;display:flex;position:absolute;bottom:28px;left:6%}.hero-scroll .arrow{animation:1.4s infinite bounce;display:inline-block}@keyframes bounce{0%,to{transform:translateY(0)}50%{transform:translateY(6px)}}.marquee{border-top:var(--border);border-bottom:var(--border);background:var(--ink);color:var(--paper);padding:14px 0;overflow:hidden;transform:rotate(-1deg)scale(1.02)}.marquee-track{gap:0;width:max-content;animation:22s linear infinite scroll;display:flex}.marquee-track span{font-family:var(--font-mono);text-transform:uppercase;white-space:nowrap;padding:0 22px;font-size:16px;font-weight:700}.marquee-track .star{color:var(--yellow)}@keyframes scroll{to{transform:translate(-50%)}}.about-grid{grid-template-columns:1.1fr .9fr;align-items:center;gap:64px;display:grid}.about-copy p{margin-bottom:18px;font-size:17px;line-height:1.7}.about-copy .mono{font-family:var(--font-mono);font-size:14px}.about-copy mark{background:var(--yellow);padding:0 4px}.about-copy mark.pink{background:var(--pink)}.idcard{border:var(--border);box-shadow:8px 8px 0 var(--ink);background:#fff;padding:26px;transition:transform .25s;position:relative;transform:rotate(3deg)}.idcard:hover{transform:rotate(0)}.tape{background:#ffd23fd9;border-left:2px dashed #14141433;border-right:2px dashed #14141433;width:100px;height:28px;position:absolute;top:-16px;left:50%;transform:translate(-50%)rotate(-4deg)}.idcard-head{font-family:var(--font-mono);letter-spacing:.1em;border-bottom:2px dashed var(--ink);justify-content:space-between;margin-bottom:18px;padding-bottom:12px;font-size:11px;font-weight:700;display:flex}.idcard-body{align-items:center;gap:18px;display:flex}.idcard-photo{border:var(--border);background:var(--yellow);flex-shrink:0;place-items:center;width:84px;height:84px;display:grid;overflow:hidden}.idcard-photo img{object-fit:cover;width:100%;height:100%;display:block}.idcard-info{font-family:var(--font-mono);font-size:13px;line-height:1.9}.idcard-info b{font-size:16px}.barcode{background:repeating-linear-gradient(90deg, var(--ink) 0 2px, transparent 2px 5px, var(--ink) 5px 8px, transparent 8px 11px, var(--ink) 11px 12px, transparent 12px 16px, var(--ink) 16px 19px, transparent 19px 22px);height:34px;margin-top:20px}.idcard-no{font-family:var(--font-mono);letter-spacing:.3em;margin-top:6px;font-size:10px}.skills-groups{gap:34px;display:grid}.skill-group-name{font-family:var(--font-mono);text-transform:uppercase;letter-spacing:.1em;align-items:center;gap:12px;margin-bottom:14px;font-size:13px;font-weight:700;display:flex}.skill-group-name:after{content:"";border-top:2px dashed var(--ink);flex:1}.chips{flex-wrap:wrap;gap:12px;display:flex}.chip{font-family:var(--font-mono);border:var(--border);box-shadow:4px 4px 0 var(--ink);cursor:default;background:#fff;padding:10px 20px;font-size:15px;font-weight:700;transition:transform .15s,box-shadow .15s}.chip:nth-child(3n+1){transform:rotate(-1.5deg)}.chip:nth-child(3n+2){transform:rotate(1deg)}.chip:hover{box-shadow:6px 6px 0 var(--ink);transform:rotate(0)translate(-2px,-2px)}.chip.c-pink{background:var(--pink)}.chip.c-yellow{background:var(--yellow)}.chip.c-blue{background:var(--blue)}.chip.c-green{background:var(--green)}.chip.c-orange{background:var(--orange)}.chip.c-purple{background:var(--purple)}.projects-grid{gap:28px;display:grid}.project{border:var(--border);box-shadow:6px 6px 0 var(--ink);background:#fff;grid-template-columns:90px 1fr auto;align-items:center;gap:28px;padding:30px 34px;transition:transform .18s,box-shadow .18s;display:grid;position:relative}.project:hover{box-shadow:10px 10px 0 var(--ink);transform:translate(-3px,-3px)rotate(-.5deg)}.project-num{font-family:var(--font-mono);color:#0000;-webkit-text-stroke:2px var(--ink);font-size:44px;font-weight:700}.project h3{margin-bottom:8px;font-size:26px}.project h3 .pin{border:2px solid var(--ink);width:12px;height:12px;margin-right:10px;display:inline-block}.project p{max-width:560px;margin-bottom:14px;font-size:15px;line-height:1.6}.project-tags{flex-wrap:wrap;gap:8px;display:flex}.project-side{flex-direction:column;align-items:flex-end;gap:12px;display:flex}.project-status{font-family:var(--font-mono);text-transform:uppercase;border:2px solid var(--ink);padding:5px 12px;font-size:11px;font-weight:700;transform:rotate(3deg)}.st-live{background:var(--green)}.st-shipped{background:var(--blue)}.st-wip{background:var(--orange)}.project-link{font-family:var(--font-mono);border-bottom:3px solid var(--ink);padding-bottom:2px;font-size:14px;font-weight:700;text-decoration:none;transition:all .15s}.project-link:hover{background:var(--yellow)}.now-list{grid-template-columns:repeat(3,1fr);gap:22px;display:grid}.now-item{border:var(--border);box-shadow:5px 5px 0 var(--ink);background:#fff;padding:24px;transition:transform .18s,box-shadow .18s}.now-item:hover{box-shadow:7px 7px 0 var(--ink);transform:rotate(0)translate(-2px,-2px)}.now-item:first-child{transform:rotate(-1deg)}.now-item:nth-child(2){transform:rotate(1deg)}.now-item:nth-child(3){transform:rotate(-.5deg)}.now-item .k{font-family:var(--font-mono);text-transform:uppercase;letter-spacing:.1em;border:2px solid var(--ink);margin-bottom:10px;padding:4px 10px;font-size:11px;font-weight:700;display:inline-block}.now-item .v{font-size:16px;font-weight:600;line-height:1.45}.contact{border-top:var(--border);background:var(--ink);color:var(--paper);text-align:center;padding:90px 6% 40px}.contact-title{text-transform:uppercase;font-size:clamp(40px,8vw,92px);font-weight:700;line-height:.95}.contact-title .fill{color:var(--yellow)}.contact-sub{font-family:var(--font-mono);color:#c9c9c9;max-width:480px;margin:26px auto 40px;font-size:15px}.contact-btns{flex-wrap:wrap;justify-content:center;gap:16px;display:flex}.contact .btn{border-color:var(--paper);box-shadow:4px 4px 0 var(--paper)}.contact .btn:hover{box-shadow:6px 6px 0 var(--paper)}.contact .btn:active{box-shadow:2px 2px 0 var(--paper)}.contact-bottom{font-family:var(--font-mono);color:#9a9a9a;border-top:2px dashed #fff6e94d;flex-wrap:wrap;justify-content:space-between;gap:10px;margin-top:80px;padding-top:24px;font-size:12px;display:flex}.contact-bottom b{color:var(--green);font-weight:400}@media (max-width:900px){.about-grid{grid-template-columns:1fr;gap:48px}.idcard{max-width:420px;margin:0 auto}.now-list{grid-template-columns:1fr}.project{grid-template-columns:1fr;gap:16px}.project-side{flex-direction:row;justify-content:space-between;align-items:center}.sticker-2,.sticker-3{display:none}.sticker-1{top:10%;right:4%}.nav-links{display:none}}@keyframes pop-in{0%{opacity:0;transform:translateY(34px)scale(.96)}to{opacity:1;transform:none}}.hero-meta,.hero-sub,.hero-btns{opacity:0;animation:.7s cubic-bezier(.22,1.4,.36,1) forwards pop-in}.hero-sub{animation-delay:.18s}.hero-btns{animation-delay:.3s}.name-line{display:block}.lt{cursor:default;transition:transform .18s cubic-bezier(.22,1.4,.36,1),text-shadow .18s;animation:.55s cubic-bezier(.22,1.6,.36,1) backwards letter-pop;display:inline-block}.lt:hover{text-shadow:5px 5px 0 var(--yellow);transform:translateY(-12px)rotate(-6deg)}@keyframes letter-pop{0%{opacity:0;transform:translateY(50px)rotate(10deg)scale(.6)}to{opacity:1;transform:none}}.hero-title .outline{animation:.7s cubic-bezier(.22,1.4,.36,1) .6s backwards pop-in}.sticker{opacity:0;animation:.6s cubic-bezier(.22,1.4,.36,1) .55s forwards pop-in,4s ease-in-out 1.3s infinite wobble}.reveal{opacity:0;will-change:opacity, transform;transition:opacity .65s cubic-bezier(.22,1.2,.36,1),transform .65s cubic-bezier(.22,1.2,.36,1);transform:translateY(36px)}.reveal.in{opacity:1;transform:translateY(0)}.marquee:hover .marquee-track{animation-play-state:paused}.typewriter{font-family:var(--font-mono);border:var(--border);width:fit-content;min-width:24ch;min-height:52px;box-shadow:5px 5px 0 var(--ink);opacity:0;background:#fff;align-items:center;gap:10px;margin-top:28px;padding:12px 18px;font-size:clamp(15px,2.2vw,20px);font-weight:700;animation:.7s cubic-bezier(.22,1.4,.36,1) .26s forwards pop-in;display:flex}.tw-prompt{background:var(--green);border:2px solid var(--ink);flex-shrink:0;padding:0 7px}.tw-caret{background:var(--ink);flex-shrink:0;width:10px;height:1.15em;animation:1s step-end infinite caret-blink}@keyframes caret-blink{50%{opacity:0}}.nav-logo .dot{transition:transform .35s cubic-bezier(.22,1.4,.36,1)}.nav-logo:hover .dot{transform:rotate(-360deg)}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}.reveal{opacity:1!important;transform:none!important}}
