:root{--Custom:"Comic Relief",sans-serif;--loader-color:#16407a;--loader-bg:#ede4b3}#loading-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background-color:var(--loader-bg);display:flex;justify-content:center;align-items:center;z-index:9999;transition:opacity .5s ease-out}#loading-overlay.hidden{opacity:0;pointer-events:none}.loading-spinner{width:60px;height:60px;border:4px solid rgba(22,64,122,.1);border-top:4px solid var(--loader-color);border-radius:50%;animation:spin-loader 1s linear infinite}@keyframes spin-loader{0%{transform:rotate(0)}100%{transform:rotate(360deg)}}.loading-text{position:absolute;bottom:40px;font-family:var(--Custom);color:var(--loader-color);font-size:18px;letter-spacing:2px}.ninja-wrapper{position:absolute;bottom:2%;left:42%;height:32vh;width:auto;pointer-events:none}.eyes-container{position:absolute;left:31%;top:18%;width:12vh;height:6vh;pointer-events:auto}.eye{position:absolute;width:6vh;height:6vh;background:#ede4b3;border-radius:50%;left:0;bottom:0;transition:transform .2s cubic-bezier(.4, 2, .6, 1);overflow:hidden}.eye.right{left:6.5vh}.pupil{position:absolute;width:4vh;height:4vh;background:#222;border-radius:50%;top:1vh;left:1vh;transition:left 80ms,top 80ms}body{margin:0;overflow:hidden!important;position:fixed;width:100vw;height:100vh;scroll-behavior:none;background-color:#ede4b3;text-align:center}img{filter:drop-shadow(-8px 8px 3px rgba(0, 0, 0, .35))}p{font-size:3.5vh;text-align:center;font-family:var(--Custom);color:#000;margin:5vw}.pc-tree{position:absolute;height:78vh;width:auto}.button-img{width:150px;height:75px;margin:10px;transition:transform .2s}.button-text{position:relative;top:-50%;left:0;font-family:var(--Custom);font-size:25px;font-weight:700;pointer-events:none;text-shadow:none;white-space:nowrap;text-decoration:none;letter-spacing:1px;transition:transform .2s}.button{transition:transform .2s;text-align:center;text-decoration:none;background:0 0;border:none;padding:0;cursor:pointer;margin-bottom:5vh}.button-container{z-index:1000}.button:hover{transform:scale(1.2) translate(0,15px);z-index:10}@media (max-width:700px){.pc{display:none}.pc-ninja{translate:25vw 0vh}.pc-tree{position:absolute;translate:-22vw 0;opacity:.6}.button-container{display:flex;flex-direction:column;align-items:flex-start;position:absolute;top:0;left:0;height:100vh;width:40vw;z-index:1000}.button:hover{transform:scale(1.2) translate(10px,0);z-index:10}.button.pressed,.button:active{transform:scale(1.2) translate(10px,0);z-index:10}@media (hover:none){.button:hover{transform:none}.button{-webkit-tap-highlight-color:transparent}}.button-text{top:-7.5vh;left:-3.5vh;font-size:3.8vh;margin:-15px;rotate:270deg}.button-img{margin-top:4vh;margin-left:-30px;width:20vh;height:10vh;rotate:270deg}.content-inner-h1{font-size:6vh!important;position:absolute;top:8vh;left:-35px;width:auto;text-align:right;z-index:-1}.content-inner-p{position:absolute;bottom:-4vh;right:-20vw;width:auto;text-align:left}.content-inner{position:relative;min-height:100vh;justify-content:center;top:40%;left:50%}.contact-img{width:50vw;height:auto}.contact-label{display:none}}#decoration img{transition:transform .7s cubic-bezier(0, 1, .6, 1);transform:none}#orig-sun{position:absolute;top:-225px;right:-225px;left:auto;width:450px;height:auto;transition:transform 1.5s}#orig-sun2{position:absolute;top:-175px;right:-175px;left:auto;width:350px;height:auto;transition:transform 1.5s}#orig-cloud1{position:absolute;top:5%;right:30%;left:auto;height:10vh;width:auto}#orig-cloud2{position:absolute;top:10%;right:18%;left:auto;height:15vh;width:auto}#decoration #tree1{transition:transform 1.5s}#decoration #tree2{transition:transform 1.5s;transform:scaleX(-1)}#decoration .slide-wrapper{transition:transform .7s cubic-bezier(0, 1, .6, 1);height:auto;width:auto}#decoration.slide-out #sun-wrapper{transform:translate(50vw,-50vh)}#decoration.slide-out #sun2-wrapper{transform:translate(50vw,-50vh)}#decoration.slide-out #cloud1-wrapper{transform:translate(0,-30vh)}#decoration.slide-out #cloud2-wrapper{transform:translate(0,-30vh)}#decoration.slide-out #tree1{transition:transform 3s;transform:translate(90vw,0)}#decoration.slide-out #tree2{transition:transform 3s;transform:translate(-90vw,0) scaleX(-1)}#decoration.slide-out .ninja-wrapper{transform:scaleX(0);transition:transform .7s cubic-bezier(0, 1, .6, 1)}#decoration .ninja-wrapper{transition:transform .7s cubic-bezier(0, 1, .6, 1)}@media (max-width:600px){.sun1{opacity:.6}.pc-ninja{translate:20vw 0vh}#decoration.slide-out #tree2{transition:transform 2s,opacity 2s;transform:translate(-240vw,0) scaleX(-1)}}#resume-iframe{transition:transform .5s ease-in-out}#resume-iframe.slide-in{transform:translateY(-80vh)}#about-card{transition:transform .5s ease-in-out}#about-card.slide-in{transform:translateY(-60vh)}.resume-class{border:none;box-shadow:0 4px 16px rgba(0,0,0,.15);position:absolute;top:110vh;width:45vw;height:80vh}.hover-link{transition:.3s;z-index:10;display:inline-block}.hover-link:hover{transition:.5s cubic-bezier(.4, 0, .2, 1);transform-origin:center center;transform:scale(1.4)}.about-class{width:40vw;height:60vh;position:absolute;box-shadow:0 4px 16px rgba(0,0,0,.15);top:110vh}.phone-font{font-size:3vh}@media (max-width:700px){#about-card.slide-in{transform:translateY(-100vh)}.about-class{border:none;box-shadow:0 4px 16px rgba(0,0,0,.15);position:absolute;top:110vh;right:10px;width:62vw;height:100vh}.phone-font{font-size:3vh}}#contact-btns{position:absolute;top:20px;right:-90vw;display:flex;flex-direction:column;align-items:center;z-index:200;transition:transform .7s cubic-bezier(.4, 1, .6, 1)}#contact-btns.slide-in{transform:translateX(-100vw);pointer-events:auto}#contact-card{transition:transform .7s cubic-bezier(.4, 1, .6, 1)}#contact-card.slide-in{transform:translate(0,-70vh)}.contact-img{width:25vh;max-width:50vw;height:auto}.contact-card-lineup-img{top:110vh;left:10vw;width:40vw;height:60vh;position:absolute}.contact-card-lineup-p{position:absolute;top:50%;left:-40vw;width:40vw;height:60vh;justify-content:center;align-items:center}@media screen and (max-width:850px){.contact-tray{margin-top:80px}@media screen and (max-width:700px){.contact-tray{margin-top:0}.contact-card-lineup-img{display:none}.contact-card-lineup-p{display:none}}}.project-tray{position:absolute;width:100vw;height:100vh;top:120%;left:0;display:grid;grid-template-columns:repeat(auto-fit,max(20vw,200px));column-gap:3vw;row-gap:8vh;overflow-y:scroll;overflow-x:hidden;padding:30vh 40px 40px 40px;box-sizing:border-box;scroll-behavior:smooth;scroll-snap-type:y proximity;scroll-padding-top:30vh}.project-tray::-webkit-scrollbar{width:8px}.project-tray::-webkit-scrollbar-track{background:rgba(0,0,0,.1)}.project-tray::-webkit-scrollbar-thumb{background:#16407a;border-radius:4px}.project-tray::-webkit-scrollbar-thumb:hover{background:#0a1f4a}#project-tray{transition:transform .7s cubic-bezier(.4, 1, .6, 1)}#project-tray.slide-in{transform:translateY(-120vh)}.proj-card-img{width:20vw;height:20vw;object-fit:cover;object-position:center;position:absolute;transform:translate(-50%,-50%);top:25%;left:50%}.proj-card{width:20vw;height:30vw;position:relative;transition:.5s ease-in-out;text-decoration:none;flex-shrink:0;display:flex;flex-direction:column;justify-content:center;align-items:center;scroll-snap-align:center;scroll-snap-stop:always}.desc-paper{width:90%;height:50%;position:absolute;top:78%;left:50%;transform:translate(-50%,-50%)}.proj-card h1{position:absolute;top:54%;left:0;right:0;font-family:var(--Custom);font-size:2vw;color:#1a237e;margin:0;text-align:center;z-index:3}.proj-card p{position:absolute;top:64%;left:3vw;right:3vw;font-size:1vw;margin:0;z-index:3;text-align:center;line-height:1.5}.proj-card:hover{transform:scale(1.03);z-index:2}.mask-size{width:20vw;height:20vw}@media screen and (max-width:700px){#project-tray{transition:transform .7s cubic-bezier(.4, 1, .6, 1)}#project-tray.slide-in{transform:translateY(-170vh)}.project-tray{width:100%;height:100vh;position:absolute;top:170vh;left:0;transform:translateX(0);display:flex;flex-direction:column;gap:40vh;overflow-y:auto;overflow-x:hidden;align-items:flex-end;padding-top:2vh;scroll-padding-top:2vh;padding-right:2vw;box-sizing:border-box;scroll-behavior:smooth;scroll-snap-type:y mandatory}.proj-card-img{width:60vw;height:60vw;object-fit:cover;object-position:center;position:absolute;transform:translate(-50%,-50%);top:25%;left:50%}.mask-size{width:60vw;height:60vw}.desc-paper{height:60%;top:70%}.proj-card{width:70vw;height:80vh;position:relative;padding-top:10vh;transition:.5s ease-in-out;text-decoration:none;flex-shrink:0;display:flex;flex-direction:column;justify-content:center;align-items:center;scroll-snap-align:start;scroll-snap-stop:always}.proj-card h1{position:absolute;top:44%;left:0;right:0;font-family:var(--Custom);font-size:1.2em;color:#1a237e;margin:0;text-align:center}.proj-card p{position:absolute;top:52%;left:30px;right:30px;font-size:.9em;margin:0;text-align:center;line-height:1.2}}.content-section{display:none;position:absolute;top:40%;left:50%;transform:translate(-50%,-50%);text-align:center;filter:blur(0);transition:opacity .5s cubic-bezier(.4, 1, .6, 1),transform .5s cubic-bezier(.4, 1, .6, 1),filter .5s cubic-bezier(.4, 1, .6, 1);z-index:10}.content-section.show{display:block;transform:translate(-50%,-50%)}.content-section.hide{opacity:0;transform:translate(-50%,calc(-50% - 40px)) rotate(-3deg) scale(.98);pointer-events:none;transition:opacity .5s cubic-bezier(.4, 1, .6, 1),transform .5s cubic-bezier(.4, 1, .6, 1)}@keyframes spin{from{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes spin-counter{from{transform:rotate(360deg)}to{transform:rotate(0)}}@keyframes cloud1-drift{0%{transform:translateY(0) translateX(0) scale(1)}20%{transform:translateY(-10px) translateX(10px) scale(1.03)}40%{transform:translateY(5px) translateX(20px) scale(1)}60%{transform:translateY(-8px) translateX(10px) scale(.97)}80%{transform:translateY(10px) translateX(0) scale(1)}100%{transform:translateY(0) translateX(0) scale(1)}}@keyframes cloud2-drift{0%{transform:translateY(0) translateX(0) scale(1)}20%{transform:translateY(8px) translateX(-8px) scale(1.02)}40%{transform:translateY(-12px) translateX(-16px) scale(1)}60%{transform:translateY(6px) translateX(-8px) scale(.98)}80%{transform:translateY(-8px) translateX(0) scale(1)}100%{transform:translateY(0) translateX(0) scale(1)}}#orig-cloud1{animation:cloud1-drift 19s ease-in-out infinite}#orig-cloud2{animation:cloud2-drift 23s ease-in-out infinite}.spinning{animation:spin 25s linear infinite}.spinning-counter{animation:spin-counter 25s linear infinite}