@font-face{font-family:'Circle Pizza';src:url('fonts/circle-pizza.otf') format('opentype');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'Naughty Cartoons';src:url('fonts/naughty-cartoons.ttf') format('truetype');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'Brown Beige';src:url('fonts/brown-beige.ttf') format('truetype');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'Matcha Style';src:url('fonts/matcha-style.ttf') format('truetype');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'Matcha World';src:url('fonts/matcha-world.ttf') format('truetype');font-weight:400;font-style:normal;font-display:swap}
:root{--bg:#fcfeff;--panel:#f0f8ff;--ink:#193b55;--muted:#536e80;--acid:#946811;--line:#d5e6f0;--gold:#e2b64e;--gold-light:#fff6d6;--sky:#a7daf8;--max:1400px;--heading:'Circle Pizza',Arial,sans-serif;--copy:'Matcha Style',Arial,sans-serif;--punch:'Matcha World',Arial,sans-serif;--technical:monospace}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:30px}body{margin:0;color:var(--ink);background:linear-gradient(180deg,#eff9ff 0%,#fff 42%,#f2faff 78%,#fff 100%);font-family:Arial,Helvetica,sans-serif}::selection{background:#f0d68e;color:#193b55}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer}a{color:inherit;text-decoration:none}button:focus-visible,a:focus-visible{outline:3px solid var(--acid);outline-offset:5px}p{font-family:var(--copy);font-weight:400}h2,h3{font-family:var(--heading);font-weight:400;font-synthesis:none}h2{font-size:clamp(42px,5.7vw,80px);letter-spacing:0;line-height:1.08;margin:0}h3{line-height:1.2}.symbol{font-family:Arial,sans-serif}.wrap{max-width:var(--max);padding:0 5%;margin:auto}.skip-link{position:fixed;left:20px;top:10px;background:#fff6dc;padding:14px 20px;z-index:50;transform:translateY(-160%)}.skip-link:focus{transform:none}
/* Original hero typography and illustration are preserved. */
header{height:88px;border-bottom:1px solid var(--line);position:relative;z-index:10;background:#ffffffdc;box-shadow:0 2px 25px #71aaca0a}nav{height:100%;display:flex;align-items:center;justify-content:space-between;gap:25px}.brand{color:#244c67;font-size:23px;font-weight:900;letter-spacing:-1px;display:flex;align-items:center;gap:10px}.brand svg{width:34px;fill:#b18a36}.brand sup{font:10px var(--technical);letter-spacing:0;margin-left:2px;color:#916812}.navlinks{display:flex;gap:26px;font:11px var(--technical);text-transform:uppercase;letter-spacing:1px}.navlinks a{color:#496b81;transition:color .2s}.navlinks a:hover{color:#8c641b}.mode{border:1px solid #d9bd77;background:linear-gradient(125deg,#fff,#fff9e8);color:#6f551d;box-shadow:0 3px 15px #b9903310;border-radius:30px;padding:12px 17px;display:flex;gap:10px;align-items:center;font:11px var(--technical);text-transform:uppercase;white-space:nowrap}.dot{width:7px;height:7px;background:#d9ae48;border-radius:100%;box-shadow:0 0 12px #e0b44670}
.hero{position:relative;min-height:780px;height:calc(100svh - 88px);max-height:1050px;isolation:isolate;overflow:hidden;background:linear-gradient(180deg,#d9f0ff 0%,#bde4fd 26%,#dff2ff 58%,#fff 100%)}.hero:before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at 53% 39%,#ffffffcc,transparent 55%),radial-gradient(ellipse at 89% 10%,#fff5d8b3,transparent 36%);z-index:-2}.hero:after{content:'';position:absolute;inset:0;pointer-events:none;background:linear-gradient(115deg,transparent 30%,#ffffff40 42%,transparent 48%,#fffdf533 51%,transparent 62%);z-index:-1}.hero-top{display:flex;justify-content:space-between;padding-top:32px;font:11px var(--technical);letter-spacing:1.5px;color:#4c7791;gap:20px}.hero-top span:first-child{color:#4a6b82}.hero-title{font-family:Arial,Helvetica,sans-serif;text-align:center;position:absolute;top:78px;left:0;width:100%;margin:0;font-size:clamp(112px,23.8vw,355px);font-weight:900;letter-spacing:-.085em;line-height:1;padding-right:.085em;background:linear-gradient(170deg,#fff 15%,#fff 38%,#fff7df 57%,#edcf80 84%,#a77920 100%);background-clip:text;color:transparent;-webkit-text-stroke:1px #c89c3e66;filter:drop-shadow(0 5px 0 #af823624) drop-shadow(0 15px 24px #4f92bc24)}
.hero-art{position:absolute;left:50%;top:48%;width:min(58vw,780px);transform:translate(-50%,-50%);z-index:2;filter:drop-shadow(0 28px 28px #6eabd14d)}.hero-art svg{width:100%;overflow:visible;animation:float 6s ease-in-out infinite}.cloud-tilt{transform:translate(var(--cloud-x,0px),var(--cloud-y,0px)) rotate(var(--cloud-angle,0deg));transition:transform .7s cubic-bezier(.2,.8,.2,1)}.orbit{position:absolute;border:1px solid #bd983d66;width:80%;height:38%;left:10%;top:35%;border-radius:50%;transform:rotate(-15deg);z-index:-1;box-shadow:0 0 0 7px #ffffff12}.orbit:after{content:'✦';position:absolute;right:8%;top:11%;font-size:35px}.orbit:after,.star{color:#c29530;text-shadow:0 2px 0 #fff,0 0 30px #fff4c5}.star{position:absolute;font-size:60px;top:39%;right:12%;animation:rotate 30s linear infinite}.smallstar{top:60%;left:7%;font-size:26px}.tag{position:absolute;z-index:3;color:#735214;background:linear-gradient(120deg,#fffefb 3%,#fff3ce 48%,#f5d788 100%);border:1px solid #cca755;box-shadow:4px 5px 0 #ac7c2426;border-radius:4px;padding:14px 20px;font:700 13px var(--technical);transform:rotate(-10deg);top:46%;left:10%}.tag2{top:58%;left:auto;right:8%;transform:rotate(8deg);color:#3d657f;background:linear-gradient(135deg,#fff,#edf8ff);border-color:#bdd8e9;box-shadow:4px 5px 0 #709fbc26}.hero-bottom{position:absolute;bottom:47px;width:90%;max-width:1260px;display:flex;justify-content:space-between;align-items:end;gap:25px}.hero-copy h2{font-size:clamp(30px,3vw,46px);line-height:1.12;margin:0 0 18px;color:#163f5b}.hero-copy p{font-size:16px;line-height:1.7;margin:0;max-width:390px;color:#527085}.hero-copy .dev-mark{font:11px var(--technical);color:#8a6218;letter-spacing:1px;margin-bottom:16px}.hero-actions{display:flex;flex-direction:column;align-items:end;gap:22px}.cta{background:linear-gradient(115deg,#fff6dc,#edcc72 63%,#f7e9b9);border:1px solid #c69a3a;color:#533d13;box-shadow:0 7px 20px #c99e3720;border-radius:7px;padding:19px 24px;font-weight:700;font-size:13px;display:inline-flex;gap:35px;align-items:center;transition:transform .2s,box-shadow .2s}.cta:hover{transform:translateY(-3px);box-shadow:0 11px 25px #bd933d30}.tiny{font:10px var(--technical);color:#607b8e;letter-spacing:1px}
.sky-banks{position:absolute;inset:0;z-index:-1;overflow:hidden;pointer-events:none}.sky-bank{position:absolute;width:620px;height:240px;opacity:.75;filter:blur(3px);background:radial-gradient(ellipse 19% 34% at 22% 57%,#fff 92%,transparent 100%),radial-gradient(ellipse 22% 49% at 43% 42%,#fff 92%,transparent 100%),radial-gradient(ellipse 24% 39% at 67% 55%,#fff 92%,transparent 100%),radial-gradient(ellipse 42% 22% at 47% 75%,#fff 94%,transparent 100%);animation:cloud-drift 18s ease-in-out infinite alternate}.sky-bank:first-child{left:-220px;top:31%;transform:rotate(-5deg)}.sky-bank:nth-child(2){right:-250px;top:20%;opacity:.6;animation-delay:-8s}.sky-bank:nth-child(3){width:900px;height:260px;left:12%;top:48%;opacity:.35;animation-delay:-4s;filter:blur(12px)}
.stats-strip{background:linear-gradient(100deg,#fff,#f0f9ff 65%,#fffaf0);border-block:1px solid #d8e7ee}.stats-inner{display:grid;grid-template-columns:repeat(3,1fr)}.stat{padding:36px 0}.stat+.stat{border-left:1px solid #d8e7ee;padding-left:50px}.stat strong{display:block;font-size:48px;letter-spacing:-2px;color:#244e69}.stat:first-child strong{color:#946a16}.stat span{display:block;font:10px var(--technical);letter-spacing:1px;margin-top:9px;color:#587388}
.eyebrow{font:11px var(--technical);letter-spacing:2px;color:#896316;display:flex;gap:14px;align-items:center}.eyebrow:before{content:'';width:20px;height:1px;background:currentColor}.section-head{display:grid;grid-template-columns:1.3fr 1fr;gap:70px;align-items:end;margin:28px 0 52px}.section-head>*{min-width:0}.outline{color:#668ba5}.section-head p{color:var(--muted);line-height:1.8;font-size:17px;max-width:370px;justify-self:end;margin:0}.projects{padding:95px 0;background:linear-gradient(180deg,#fff 10%,#f4faff 100%)}.project-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:28px}.project{background:linear-gradient(150deg,#fff,#f7fbff);border:1px solid #d2e4ef;border-radius:15px;box-shadow:0 12px 35px #397fa10c;overflow:hidden;display:flex;flex-direction:column;transition:translate .3s,box-shadow .3s}.project-image{position:relative;aspect-ratio:500/280;display:block;overflow:hidden;background:#e0f1fc}.project-image img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s}.project-image:hover img{transform:scale(1.035)}.project-index{position:absolute;left:18px;top:18px;background:#fffffff0;color:#3d6178;border:1px solid #ffffffbb;border-radius:4px;box-shadow:0 3px 13px #15344321;font:10px var(--technical);letter-spacing:1px;padding:10px 12px}.project-body{padding:30px;display:flex;flex-direction:column;flex:1}.project-label{font:10px var(--technical);color:#8c6419;letter-spacing:1.5px;margin-bottom:14px}.project h3{color:#244d66;font-size:clamp(24px,2.7vw,37px);margin:0 0 20px;line-height:1.15;letter-spacing:0}.project .drtt-title{font-family:'Naughty Cartoons',Arial,sans-serif;font-size:clamp(24px,2.25vw,32px)}.project .aetherfall-title{font-family:'Brown Beige',Georgia,serif}.project p{font-size:16px;color:var(--muted);line-height:1.8;margin:0 0 30px;max-width:500px}.project-links{display:flex;gap:13px;margin-top:auto;flex-wrap:wrap}.project-links a{font-size:12px;padding:14px 16px;border:1px solid #b9d3e4;color:#305c78;border-radius:6px;background:#fff;display:flex;gap:17px;align-items:center;transition:transform .2s,box-shadow .2s}.project-links a:first-child{background:linear-gradient(120deg,#fff7df,#f1d389);color:#62491a;border-color:#c8a65b;font-weight:700}.project-links a:hover{transform:translateY(-2px);box-shadow:0 5px 16px #7fabc226}
.ticker{padding:21px 0;background:linear-gradient(100deg,#fff9e9,#f2d78d 35%,#fff6dc 65%,#e7c570);color:#705420;border-block:1px solid #dabc74;overflow:hidden;white-space:nowrap;font-family:var(--punch);font-size:18px}.ticker-track{display:flex;width:max-content;animation:marquee 28s linear infinite}.ticker span{padding-right:38px}.ticker b{padding:0 32px;font:20px Arial,sans-serif;color:#a07924}.ticker:hover .ticker-track{animation-play-state:paused}
.skills{background:radial-gradient(ellipse at 85% 5%,#fff9e9 0%,transparent 40%),linear-gradient(150deg,#edf8ff,#fff 55%,#e4f3fc);padding:85px 0}.skills-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid #cfdfeb;border-left:1px solid #cfdfeb;border-radius:12px;overflow:hidden;box-shadow:0 12px 30px #6e9fb70c}.skill{border-right:1px solid #cfdfeb;border-bottom:1px solid #cfdfeb;background:#ffffff88;padding:30px;min-height:280px;display:flex;flex-direction:column;transition:background .25s}.skill.primary{background:linear-gradient(145deg,#fffdf7,#fff3d330,#fff);box-shadow:inset 0 3px #d6b05a}.skill-top{display:flex;justify-content:space-between;align-items:center;color:#637e8e;font:10px var(--technical);letter-spacing:1px}.skill.primary .skill-top{color:#8c671e}.skill-icon{font:22px Arial,sans-serif;color:#a58235}.skill h3{font-size:24px;margin:26px 0 10px;color:#264f69}.skill p{font-size:15px;color:var(--muted);line-height:1.7;margin:0 0 25px}.experience{margin-top:auto}.experience strong{font-family:Arial,sans-serif;font-size:30px;font-weight:600;letter-spacing:-1px;display:block;color:#264d66}.experience .detail{display:block;font:10px var(--technical);font-variant-numeric:tabular-nums;letter-spacing:.5px;color:#84601b;margin-top:9px;min-height:15px}.live{display:inline-flex;gap:7px;align-items:center;font:10px var(--technical);letter-spacing:1px}.live:before{content:'';width:6px;height:6px;background:#bc9033;border-radius:50%;box-shadow:0 0 9px #dec77d88}.timer-note{font:11px/1.8 var(--technical);color:#60778b;margin-top:24px;max-width:810px}
.approach{padding:95px 0;background:linear-gradient(180deg,#fff,#f4faff)}.approach .section-head p{max-width:430px}.traits{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-block:1px solid var(--line)}.trait{padding:38px 30px 35px 0;position:relative;min-height:295px}.trait+.trait{border-left:1px solid var(--line);padding-left:30px}.trait-number{font:11px var(--technical);color:#728998}.trait-icon{position:absolute;right:30px;top:28px;font:36px Arial,sans-serif;color:#b48b31}.trait h3{font-size:24px;margin:50px 0 16px}.trait p{font-size:16px;line-height:1.85;color:var(--muted);margin:0}.punch{font-family:var(--punch);font-weight:400;font-synthesis:none;color:#8c6419;text-decoration:underline;text-decoration-color:#dcb65366;text-decoration-thickness:2px;text-underline-offset:4px;box-decoration-break:clone;-webkit-box-decoration-break:clone}.creativity{display:inline-block;color:#668ba5;text-decoration:none;position:relative}.creativity:after{content:'';position:absolute;left:2%;bottom:-8px;width:88%;height:5px;background:linear-gradient(90deg,#e2b64e,#e2b64e20);border-radius:50%;transform:rotate(-2deg);transform-origin:left;scale:0 1;transition:scale .8s .3s cubic-bezier(.2,.8,.2,1)}.visible .creativity:after{scale:1 1}.punch.is-punching{animation:punch-in .55s cubic-bezier(.16,1,.3,1) both;animation-delay:var(--punch-delay,0ms)}
.community{background:radial-gradient(ellipse at 80% 4%,#fff 0%,transparent 50%),linear-gradient(115deg,#e2f3ff 0%,#fff 47%,#fff4d3 82%,#f0d38a 100%);color:#294d66;border-block:1px solid #d4e5ee;padding:80px 0}.community-inner{display:grid;grid-template-columns:1.3fr 1fr;gap:70px;align-items:center}.community h2{margin:25px 0}.community p{max-width:460px;font-size:17px;line-height:1.7;color:#546e7c}.community-links{display:flex;flex-direction:column;gap:15px}.community-links a{display:flex;justify-content:space-between;gap:15px;padding:24px;border:1px solid #d3b86f;border-radius:9px;align-items:center;font-family:var(--heading);font-size:19px;background:#ffffffa6;box-shadow:0 8px 24px #b6923610;transition:transform .2s,box-shadow .2s}.community-links small{display:block;font:10px var(--technical);margin-bottom:8px;letter-spacing:1px;color:#8b6724}.community-links a>.symbol{color:#ab8433}.community-links a:hover{background:#fff;transform:translateX(4px);box-shadow:0 8px 30px #b6923623}footer{padding:30px 0;background:#fff}.footer-inner{display:flex;justify-content:space-between;align-items:center;gap:25px}.footer-inner p{font:10px var(--technical);letter-spacing:1px;color:#607b8e}.backtop{font:11px var(--technical);color:#5c7b8f}.toast{position:fixed;bottom:26px;left:50%;transform:translate(-50%,25px);background:linear-gradient(120deg,#fff,#fff7df);border:1px solid #d3b56e;color:#5e4b25;box-shadow:0 8px 35px #446d8730;padding:15px 25px;z-index:25;font:12px var(--technical);border-radius:4px;opacity:0;pointer-events:none;transition:.3s;max-width:90vw;text-align:center}.toast.show{opacity:1;transform:translate(-50%,0)}
/* All content is visible by default, including if JavaScript is unavailable. */
.reveal{opacity:1;transform:none}.js-motion .reveal{opacity:0;transform:translateY(18px);transition:opacity .7s,transform .7s}.js-motion .reveal.visible{opacity:1;transform:none}
body.overdrive{--acid:#896018;--ink:#34455a;--muted:#656c75;--line:#e8deca;background:linear-gradient(180deg,#fff8e9,#fff 45%,#edf8ff 85%)}body.overdrive .hero{background:linear-gradient(180deg,#e2f2ff,#e3eff8 26%,#fff1ca 70%,#fffdf7)}body.overdrive .hero:before{background:radial-gradient(ellipse at 76% 14%,#fff8d5,transparent 55%)}
@media(hover:hover) and (pointer:fine){.project:hover{translate:0 -5px;box-shadow:0 18px 42px #397fa11b}.skill:hover{background:#fff}}
@keyframes float{50%{transform:translateY(-18px) rotate(2deg)}}@keyframes rotate{to{transform:rotate(360deg)}}@keyframes marquee{to{transform:translateX(-50%)}}@keyframes cloud-drift{from{translate:-12px 0}to{translate:25px -10px}}@keyframes punch-in{0%{filter:opacity(.4);translate:0 6px}55%{filter:opacity(1);translate:0 -2px}100%{filter:opacity(1);translate:0 0}}
@media(min-width:1500px){.hero-title{font-size:355px}}
@media(max-width:1000px){.navlinks{gap:15px;font-size:10px}}
@media(max-width:900px){.hero{min-height:780px;max-height:900px}.hero-title{top:115px}.hero-art{top:43%;width:68vw}.tag{left:5%;top:39%;font-size:10px;padding:11px}.tag2{left:auto;right:5%;top:56%}.star{right:5%;top:28%}.section-head{gap:35px}.stat+.stat{padding-left:25px}.skills-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.skill{padding:22px}.project-body{padding:24px}.community-inner{gap:35px}.hero-copy h2{font-size:36px}.trait{padding-right:20px}.trait+.trait{padding-left:20px}.trait h3{font-size:20px}.trait-icon{right:15px}.project h3{font-size:29px}.navlinks a:nth-child(3){display:none}}
@media(max-width:620px){header{height:72px}.wrap{padding:0 6%}.navlinks{display:none}.brand{font-size:21px}.mode{font-size:8px;padding:10px 12px}.hero{height:calc(100svh - 72px);min-height:810px;max-height:950px}.hero-top{font-size:8px;letter-spacing:.5px;gap:15px}.hero-title{font-size:24vw;top:83px;-webkit-text-stroke:.75px #bb954a66}.hero-art{width:88vw;top:30%}.orbit{top:23%;height:25%;width:110%;left:-5%}.tag{top:27%;left:5%;font-size:8px;padding:9px 11px}.tag2{top:40%;left:auto;right:5%}.star{top:18%;font-size:35px;right:7%}.smallstar{top:43%;left:8%;font-size:23px}.hero-bottom{bottom:28px;display:block;width:88%}.hero-copy h2{font-size:36px}.hero-copy p{font-size:15px;line-height:1.7;max-width:340px}.hero-copy .dev-mark{font-size:9px;margin-bottom:12px}.hero-actions{align-items:start;margin-top:20px;gap:15px}.hero-actions .tiny{display:none}.cta{padding:16px 21px;font-size:12px}.ticker{font-size:17px;padding:17px 0}.sky-bank{width:390px;height:160px}.sky-bank:first-child{left:-200px;top:26%}.sky-bank:nth-child(2){right:-220px;top:16%}.sky-bank:nth-child(3){width:550px;left:-35%;top:38%}.hero-art{filter:drop-shadow(0 18px 20px #6eabd14d)}.stat{padding:25px 0}.stat+.stat{padding-left:13px}.stat strong{font-size:34px;letter-spacing:-1.5px}.stat span{font-size:8px;line-height:1.6;letter-spacing:.3px;max-width:80px}.projects,.skills,.approach{padding:65px 0}.section-head{grid-template-columns:1fr;gap:25px;margin:24px 0 35px}.section-head h2{font-size:45px}.section-head p{justify-self:start;max-width:100%;font-size:16px}.project-grid{grid-template-columns:1fr;gap:25px}.project h3{font-size:29px}.project-body{padding:24px}.project p{font-size:16px}.project{border-radius:12px}.skills-grid{grid-template-columns:1fr}.skill{min-height:235px;padding:25px}.skill h3{margin-top:20px}.experience strong{font-size:32px}.experience .detail{font-size:11px}.timer-note{font-size:10px}.traits{grid-template-columns:1fr}.trait,.trait+.trait{padding:30px 0;min-height:auto;border-left:0}.trait+.trait{border-top:1px solid var(--line)}.trait h3{font-size:24px;margin-top:40px}.trait-icon{right:10px}.community-inner{grid-template-columns:1fr;gap:25px}.community{padding:65px 0}.community h2{font-size:45px}.community-links a{padding:20px}.footer-inner{flex-wrap:wrap}.footer-inner p{order:3;width:100%;line-height:1.8}.creativity{max-width:100%}}
@media(max-width:360px){.mode{padding:9px;font-size:7px;gap:6px}.brand{font-size:19px;gap:6px}.hero{min-height:850px}.hero-copy h2,.section-head h2{font-size:39px}.project-links{gap:10px}.project-links a{padding:12px;font-size:11px}.project h3{font-size:26px}.trait h3{font-size:22px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}.js-motion .reveal{opacity:1;transform:none}.cloud-tilt{transform:none}.creativity:after{scale:1 1}}