:root{--light-bg:#f5f5f5;--dark-bg:#1f1f1f;--light-text:#333;--dark-text:#f1f1f1;--light-surface:#fffffff0;--dark-surface:#1f1f1fdb;--card-shadow:0 4px 20px #0000001a;--transition:.3s ease}*{box-sizing:border-box}html,body{min-height:100%;margin:0;padding:0;overflow-x:hidden}html{background:#94c96f}html.dark{background:#123b25}body{min-height:100vh;color:var(--light-text);transition:background var(--transition), color var(--transition);background:linear-gradient(#b7e3fa 0%,#dff5ff 36%,#fbfdff 100%);font-family:sans-serif}body.dark,html.dark body{color:var(--dark-text);background:linear-gradient(#162a3a 0%,#1f1f1f 100%)}body:after{content:"";pointer-events:none;z-index:0;clip-path:polygon(0% 12%,8% 10%,16% 12%,24% 15%,32% 16%,40% 14%,48% 11%,56% 9%,64% 10%,72% 13%,80% 15%,88% 14%,96% 11%,100% 10%,100% 100%,0% 100%);background:radial-gradient(at 18% 2%,#ffffff38 0 18%,#0000 19%),radial-gradient(at 74% 6%,#ffffff1c 0 15%,#0000 16%),linear-gradient(#c7eaa5 0%,#a7d985 40%,#8ac56a 100%);width:100%;height:44vh;animation:6.5s ease-in-out infinite grass-wave;position:fixed;bottom:-2vh;left:0}html.dark body:after{opacity:1;background:radial-gradient(at 18% 2%,#ffffff14 0 18%,#0000 19%),radial-gradient(at 74% 6%,#ffffff0f 0 15%,#0000 16%),linear-gradient(#3f6b48 0%,#40794e 42%,#1e6333 100%)}@keyframes cloud-drift{0%{transform:translate(-22vw)}to{transform:translate(122vw)}}@keyframes grass-wave{0%,to{clip-path:polygon(0% 12%,8% 10%,16% 12%,24% 15%,32% 16%,40% 14%,48% 11%,56% 9%,64% 10%,72% 13%,80% 15%,88% 14%,96% 11%,100% 10%,100% 100%,0% 100%);transform:translateY(0)}50%{clip-path:polygon(0% 10%,8% 12%,16% 15%,24% 16%,32% 14%,40% 11%,48% 9%,56% 10%,64% 13%,72% 15%,80% 14%,88% 11%,96% 9%,100% 12%,100% 100%,0% 100%);transform:translateY(5px)}}button,a{font:inherit}.container{z-index:1;box-sizing:border-box;justify-content:center;align-items:flex-start;width:100%;min-height:100vh;padding:clamp(4.75rem,12vw,6.5rem) 1rem 1.5rem;display:flex;position:relative}.site-footer{left:50%;bottom:max(.8rem, env(safe-area-inset-bottom));z-index:2;color:#0000008f;letter-spacing:.04em;pointer-events:none;font-family:Quicksand,sans-serif;font-size:.82rem;font-weight:700;position:fixed;transform:translate(-50%)}body.dark .site-footer,html.dark .site-footer{color:#ffffff94}.cloud-field{pointer-events:none;z-index:0;height:48vh;position:fixed;inset:0 0 auto;overflow:hidden}.star-field{pointer-events:none;z-index:0;opacity:0;height:52vh;transition:opacity var(--transition);position:fixed;inset:0 0 auto;overflow:hidden}html.dark .star-field{opacity:1}.star{background:#fff;border-radius:50%;transition:transform .16s ease-out;animation:4.2s ease-in-out infinite star-twinkle;display:block;position:absolute;box-shadow:0 0 7px #ffffff9e}@keyframes star-twinkle{0%,to{filter:brightness(.82)}50%{filter:brightness(1.25)}}.cloud{opacity:.92;width:220px;height:96px;animation:linear infinite cloud-drift;position:absolute}.cloud span{background:#fffffff0;border-radius:999px;display:block;position:absolute}.cloud span:first-child{width:156px;height:48px;bottom:18px;left:18px}.cloud span:nth-child(2){width:72px;height:72px;bottom:28px;left:58px}.cloud span:nth-child(3){width:88px;height:88px;bottom:24px;left:112px}.cloud span:nth-child(4){width:72px;height:58px;bottom:18px;left:150px}.cloud span:nth-child(5){width:70px;height:42px;bottom:14px;left:0}.cloud-1{animation-duration:58s;top:12vh;left:-260px}.cloud-2{opacity:.82;width:280px;height:120px;animation-duration:78s;animation-delay:-22s;top:7vh;left:-420px}.cloud-2 span{transform:scale(1.18)}.cloud-3{opacity:.86;width:250px;animation-duration:70s;animation-delay:-44s;top:20vh;left:-360px}.cloud-3 span{transform:scale(.96)}.cloud-4{opacity:.76;width:180px;height:76px;animation-duration:64s;animation-delay:-14s;top:30vh;left:-220px}.cloud-4 span{transform:scale(.78)}html.dark .cloud-field{display:none}.card{box-shadow:var(--card-shadow);background:var(--light-surface);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);text-align:left;border-radius:clamp(16px,4vw,20px);width:min(100%,700px);max-width:700px;padding:clamp(1.5rem,5vw,3rem);position:relative}body.dark .card,html.dark .card{background:var(--dark-surface)}.card h1{margin-top:0;margin-bottom:1rem;font-size:1.75rem}.card p{font-optical-sizing:auto;margin:0 0 1.25rem;font-family:Quicksand,sans-serif;font-size:clamp(1.05rem,4.8vw,1.5rem);font-style:normal;font-weight:400;line-height:1.6}.home-intro{text-align:center;margin-bottom:1.75rem}.home-intro h1{color:#3f3f3f;margin:0 0 .8rem;font-family:Quicksand,sans-serif;font-size:clamp(3rem,9vw,5rem);font-weight:400;line-height:1}.home-intro h1 span{color:#2d8ed6;font-weight:700}.home-intro p{color:#4f4f4f;margin:.25rem 0 0;font-size:clamp(1rem,3vw,1.35rem);line-height:1.35}body.dark .home-intro h1,html.dark .home-intro h1,body.dark .home-intro p,html.dark .home-intro p{color:var(--dark-text)}body.dark .home-intro h1 span,html.dark .home-intro h1 span{color:#7fb8ff}.icon-container{flex-wrap:wrap;justify-content:center;gap:.75rem;margin-bottom:1.5rem;display:flex}.icon-container a{box-shadow:var(--card-shadow);transition:transform .2s, background var(--transition);background:#e0e0e0;border-radius:8px;justify-content:center;align-items:center;padding:.7rem;display:inline-flex}.icon-container a img{width:24px;height:24px;display:block}.icon-container a:hover{transform:scale(1.1)}body.dark .icon-container a,html.dark .icon-container a{background:#444}.btn-container{grid-template-columns:repeat(2,minmax(0,1fr));gap:.9rem;display:grid}.btn-container a,.btn-container button{width:100%;min-height:52px;box-shadow:var(--card-shadow);color:inherit;cursor:pointer;transition:background var(--transition), transform .2s;background:#e0e0e0;border:0;border-radius:8px;justify-content:center;align-items:center;padding:.9rem 1.2rem;text-decoration:none;display:inline-flex}.btn-container .section-launcher{min-width:76px;min-height:86px;box-shadow:none;background:0 0;flex-direction:column;gap:.35rem;padding:.55rem .65rem;font-family:Quicksand,sans-serif;font-size:.95rem;font-weight:700}.section-launcher img{object-fit:contain;width:48px;height:48px;display:block}.section-launcher span{line-height:1.1}.btn-container a:hover,.btn-container button:hover,.btn-container button:focus-visible{transform:scale(1.03)}.btn-container button:focus-visible,.section-window-close:focus-visible{outline-offset:3px;outline:2px solid}.section-button-active{transform:scale(1.03)}body.dark .btn-container a,body.dark .btn-container button,html.dark .btn-container a,html.dark .btn-container button{background:#444}body.dark .btn-container .section-launcher,html.dark .btn-container .section-launcher{background:0 0}.toggle-btn{top:max(.9rem, env(safe-area-inset-top));right:max(.9rem, env(safe-area-inset-right));cursor:pointer;width:44px;height:44px;box-shadow:none;transition:background var(--transition), transform .2s;z-index:1000;background:0 0;border:none;border-radius:50%;outline:none;justify-content:center;align-items:center;padding:.65rem;font-size:1.15rem;line-height:1;display:inline-flex;position:fixed}.volume-btn{left:max(.9rem, env(safe-area-inset-left));right:auto}.volume-btn img{object-fit:contain;width:22px;height:22px;display:block}.toggle-btn:hover{transform:scale(1.1)}body.dark .toggle-btn,html.dark .toggle-btn{background:0 0}.section-window{width:min(92vw,520px);max-height:min(72vh,620px);box-shadow:var(--card-shadow);color:var(--light-text);text-align:left;transform-origin:50% 42%;background:#fff;border-radius:clamp(16px,4vw,20px);animation:.18s cubic-bezier(.16,1,.3,1) window-open;position:absolute;overflow:hidden}.section-window-closing{pointer-events:none;animation:.14s ease-in forwards window-close}.section-window-about{width:min(92vw,720px)}.section-window-work{width:min(94vw,900px)}.section-window-projects{width:min(96vw,1500px);max-height:min(84vh,860px)}.section-window-projects .section-window-content{max-height:calc(min(84vh,860px) - 3.7rem);padding:clamp(1.15rem,2vw,2rem)}.section-window-contact{width:min(92vw,640px);max-height:none}.section-window-contact .section-window-content{max-height:none;padding-top:1.25rem;padding-bottom:1.25rem;overflow:visible}body.dark .section-window,html.dark .section-window{color:var(--dark-text);background:#1f1f1f}.section-window-header{cursor:grab;-webkit-user-select:none;user-select:none;touch-action:none;background:#e0e0e0;justify-content:space-between;align-items:center;gap:1rem;padding:.85rem 1rem;display:flex}.section-window-header:active{cursor:grabbing}body.dark .section-window-header,html.dark .section-window-header{background:#444}.section-window-title{margin:0;font-family:Quicksand,sans-serif;font-size:1rem;font-weight:700}.section-window-close{width:2rem;height:2rem;color:inherit;cursor:pointer;transition:background var(--transition), transform .2s;background:0 0;border:0;border-radius:50%;justify-content:center;align-items:center;display:inline-flex}.section-window-close:hover{background:#00000014;transform:scale(1.05)}body.dark .section-window-close:hover,html.dark .section-window-close:hover{background:#ffffff1f}.section-window-content{background:#fff;max-height:calc(min(72vh,620px) - 3.7rem);padding:clamp(1.1rem,4vw,1.75rem);overflow:auto}body.dark .section-window-content,html.dark .section-window-content{background:#1f1f1f}@keyframes window-open{0%{opacity:0;transform:translateY(10px)scale(.96)}to{opacity:1;transform:translateY(0)scale(1)}}@keyframes window-close{0%{opacity:1;transform:translateY(0)scale(1)}to{opacity:0;transform:translateY(8px)scale(.96)}}@media (prefers-reduced-motion:reduce){.section-window,.section-window-closing,.cloud,body:after{animation-duration:1ms;animation-iteration-count:1}}.section-copy,.section-list,.project-summary,.project-meta,.faq-answer{font-family:Quicksand,sans-serif}.section-copy{margin:0 0 1rem;font-size:1.05rem;line-height:1.65}.section-copy:last-child{margin-bottom:0}.about-profile{gap:1.35rem;display:grid}.about-hero{border-bottom:1px solid #00000014;grid-template-columns:120px minmax(0,1fr);align-items:center;gap:1.5rem;padding-bottom:1.35rem;display:grid}body.dark .about-hero,html.dark .about-hero{border-bottom-color:#ffffff1f}.about-avatar{width:120px;height:120px;box-shadow:var(--card-shadow);background-color:#ffffffb3;background-image:url(/assets/images/ay-logo-large-clear.png);background-position:50%;background-repeat:no-repeat;background-size:58%;border-radius:50%}body.dark .about-avatar,html.dark .about-avatar{background-color:#ffffff14}.about-name{color:#2d8ed6;margin:0 0 .35rem;font-family:Quicksand,sans-serif;font-size:clamp(2rem,7vw,3rem);font-weight:700;line-height:1}.about-role{opacity:.82;margin:.2rem 0 0;font-family:Quicksand,sans-serif;font-size:1rem;line-height:1.45}.about-highlight,.about-link{color:#2d8ed6;font-weight:700}.about-link{text-underline-offset:.18em;text-decoration:underline;text-decoration-thickness:.08em}.about-link:hover,.about-link:focus-visible{text-decoration-thickness:.12em}body.dark .about-highlight,body.dark .about-link,html.dark .about-highlight,html.dark .about-link{color:#7fb8ff}.about-block{gap:.7rem;display:grid}.about-heading{color:#3f3f3f;letter-spacing:.06em;text-transform:uppercase;margin:0;font-family:Quicksand,sans-serif;font-size:1.15rem;font-weight:700}body.dark .about-heading,html.dark .about-heading{color:var(--dark-text)}.about-callout{border-left:4px solid #2d8ed640;padding:.85rem 0 .85rem 1rem}.about-callout-title{margin:0 0 .25rem;font-family:Quicksand,sans-serif;font-size:1.05rem;font-weight:700}.about-callout-copy{opacity:.78;margin:0;font-family:Quicksand,sans-serif;line-height:1.55}.work-panel{gap:1.6rem;display:grid}.work-note{background:#fff7d6d1;border:1px solid #dab55638;border-radius:8px;padding:1rem 1.1rem}.work-note p{margin:0;font-family:Quicksand,sans-serif;line-height:1.55}body.dark .work-note,html.dark .work-note{background:#7fb8ff1f;border-color:#7fb8ff2e}.work-skill-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:1.4rem;display:grid}.work-heading{color:#3f3f3f;letter-spacing:.06em;text-transform:uppercase;margin:0 0 .7rem;font-family:Quicksand,sans-serif;font-size:1.15rem;font-weight:700}body.dark .work-heading,html.dark .work-heading{color:var(--dark-text)}.skill-chips{flex-wrap:wrap;gap:.55rem;display:flex}.skill-chips span{min-height:36px;transition:transform .12s ease, box-shadow .12s ease, background var(--transition);-webkit-user-select:none;user-select:none;background:#ffffffc2;border:1px solid #0000000f;border-radius:7px;align-items:center;padding:.45rem .7rem;font-family:Quicksand,sans-serif;font-size:.95rem;display:inline-flex;transform:translateY(0);box-shadow:0 3px #0000001a}.skill-chips span:hover,.skill-chips span:focus-visible{transform:translateY(2px);box-shadow:0 1px #0000001f}.skill-chips span:active{transform:translateY(3px);box-shadow:0 0 #0000001f}body.dark .skill-chips span,html.dark .skill-chips span{background:#ffffff14;border-color:#ffffff1a}.work-experience{border-top:1px solid #00000014;gap:.9rem;padding-top:1rem;display:grid}body.dark .work-experience,html.dark .work-experience{border-top-color:#ffffff1f}.experience-card{background:#e0e0e073;border-radius:12px;grid-template-columns:72px minmax(0,1fr);gap:1rem;padding:1rem;display:grid}body.dark .experience-card,html.dark .experience-card{background:#444444b3}.experience-card img{object-fit:contain;background:#fffc;border-radius:12px;width:72px;height:72px;padding:.55rem;display:block}.experience-header h4{margin:0 0 .25rem;font-family:Quicksand,sans-serif;font-size:1.05rem;font-weight:700}.experience-header p{opacity:.78;margin:0;font-family:Quicksand,sans-serif;line-height:1.45}.experience-card ul{gap:.45rem;margin:.8rem 0 0;padding-left:1.1rem;font-family:Quicksand,sans-serif;line-height:1.55;display:grid}.section-list{gap:.65rem;margin:0;padding-left:1.1rem;line-height:1.6;display:grid}.link-list{flex-wrap:wrap;justify-content:center;align-items:start;gap:1.6rem 1.1rem;padding:.5rem 0;display:flex}.link-list a{width:78px;min-height:92px;color:inherit;text-align:center;flex-direction:column;justify-content:flex-start;align-items:center;gap:.45rem;text-decoration:none;transition:transform .2s;display:inline-flex}.link-list a img{object-fit:contain;filter:drop-shadow(0 4px 2px #00000024);width:52px;height:52px;display:block}.link-list a span{font-family:Quicksand,sans-serif;font-size:.95rem;font-weight:700;line-height:1.15}.link-list a:hover,.link-list a:focus-visible{transform:translateY(-2px)scale(1.03)}.links-note{color:#00000094;text-align:center;border:1px solid #00000024;border-radius:8px;flex-basis:100%;width:min(100%,360px);margin:.25rem auto 0;padding:.8rem 1rem;font-family:Quicksand,sans-serif;font-size:.9rem}body.dark .links-note,html.dark .links-note{color:#ffffffad;border-color:#ffffff2e}.project-panel{gap:1rem;display:grid}.project-demo-tip{color:#000000ad;background:#2d8ed614;border:1px solid #2d8ed62e;border-radius:8px;margin:0;padding:.75rem .9rem;font-family:Quicksand,sans-serif;font-size:.94rem;line-height:1.45}.project-grid{grid-template-columns:repeat(auto-fit,minmax(360px,1fr));gap:1.3rem;display:grid}.project-card{background:#e0e0e08f;border-radius:14px;min-height:340px;position:relative;overflow:hidden;box-shadow:0 3px #00000014}body.dark .project-card,html.dark .project-card{background:#444444b3}.project-card img{display:block}.project-image-wrap{background:#f6f6f6;height:clamp(230px,19vw,300px);position:relative;overflow:hidden}.project-image-wrap>img{object-fit:contain;object-position:center top;width:100%;height:100%;transition:opacity .2s,transform .2s}.project-overlay{opacity:0;background:#ffffffe0;flex-direction:column;justify-content:center;gap:.75rem;padding:1rem;transition:opacity .2s;display:flex;position:absolute;inset:0}.project-card:hover .project-image-wrap>img,.project-card:focus-within .project-image-wrap>img{opacity:.22}.project-card:hover .project-overlay,.project-card:focus-within .project-overlay{opacity:1}.project-overlay p{margin:0;font-family:Quicksand,sans-serif;font-size:.98rem;font-weight:700;line-height:1.45}.project-overlay span{letter-spacing:.08em;text-transform:uppercase;opacity:.68;font-family:Quicksand,sans-serif;font-size:.82rem;font-weight:700}.project-card-body{padding:.95rem 3.25rem 1rem 1rem}.project-name{margin:0 0 .35rem;font-family:Quicksand,sans-serif;font-size:1rem;font-weight:700}.project-summary{margin:0 0 .5rem;font-size:.95rem;line-height:1.45}.project-meta{opacity:.8;margin:0;font-size:.82rem;line-height:1.4}.project-demo-button{color:#fff;letter-spacing:.06em;text-transform:uppercase;min-height:38px;box-shadow:var(--card-shadow);transition:background var(--transition), transform .2s;background:#2d8ed6;border-radius:8px;justify-content:center;align-self:flex-start;align-items:center;padding:.58rem .82rem;font-family:Quicksand,sans-serif;font-size:.82rem;font-weight:700;text-decoration:none;display:inline-flex}.project-demo-button:hover,.project-demo-button:focus-visible{background:#247bc0;transform:translateY(-1px)}.project-github-link{z-index:2;width:34px;height:34px;box-shadow:var(--card-shadow);transition:transform .2s, background var(--transition);background:#ffffffd1;border-radius:50%;justify-content:center;align-items:center;display:inline-flex;position:absolute;bottom:.8rem;right:.85rem}.project-github-link:hover,.project-github-link:focus-visible{transform:scale(1.08)}.project-github-link img{object-fit:contain;width:20px;height:20px}body.dark .project-overlay,html.dark .project-overlay{background:#1f1f1fe6}body.dark .project-demo-tip,html.dark .project-demo-tip{color:#ffffffb8;background:#7fb8ff1f;border-color:#7fb8ff2e}body.dark .project-github-link,html.dark .project-github-link{background:#ffffff24}.faq-list{gap:.85rem;display:grid}.faq-item{background:#fff7d6d1;border:1px solid #dab5562e;border-radius:8px;overflow:hidden}.faq-trigger{width:100%;min-height:58px;color:inherit;cursor:pointer;text-align:left;background:0 0;border:0;justify-content:space-between;align-items:center;gap:1rem;padding:1rem 1.1rem;font-family:Quicksand,sans-serif;font-size:1rem;font-weight:700;display:flex}.faq-trigger:focus-visible{outline-offset:-4px;outline:2px solid}.faq-chevron{flex:none;font-size:1.1rem;transition:transform .2s}.faq-item:not(.faq-item-open) .faq-chevron{transform:rotate(180deg)}.faq-answer{opacity:0;background:#fff;border-top:1px solid #dab55624;grid-template-rows:0fr;transition:grid-template-rows .24s,opacity .18s;display:grid}.faq-item-open .faq-answer{opacity:1;grid-template-rows:1fr}.faq-answer-inner{overflow:hidden}.faq-answer-inner p{padding:1rem 1.1rem 1.1rem}.faq-answer p{margin:0;font-family:Quicksand,sans-serif;line-height:1.65}body.dark .faq-item,html.dark .faq-item{background:#7fb8ff1f;border-color:#7fb8ff2e}body.dark .faq-answer,html.dark .faq-answer{background:#1f1f1f;border-top-color:#ffffff1a}.contact-card{text-align:center;justify-items:center;gap:.75rem;display:grid}.contact-card h3{letter-spacing:.04em;margin:0;font-family:Quicksand,sans-serif;font-size:clamp(1.8rem,6vw,2.4rem);font-weight:700}.contact-card p{max-width:520px;margin:0;font-family:Quicksand,sans-serif;line-height:1.65}.contact-card img{object-fit:contain;border-radius:18px;width:min(100%,300px);max-height:300px;margin:.2rem 0;display:block}.contact-cat-note{color:#00000094;font-size:.95rem}.contact-email a{color:#2d8ed6;font-weight:700}.contact-mail-button{color:#fff;min-height:46px;box-shadow:var(--card-shadow);transition:transform .2s, background var(--transition);background:#2d8ed6;border-radius:8px;justify-content:center;align-items:center;padding:.75rem 1.35rem;font-family:Quicksand,sans-serif;font-weight:700;text-decoration:none;display:inline-flex}.contact-mail-button:hover,.contact-mail-button:focus-visible{background:#247bc0;transform:scale(1.03)}body.dark .contact-cat-note,html.dark .contact-cat-note{color:#ffffffad}@media (min-width:721px){html,body{height:100%;overflow:hidden}.container{align-items:center;padding:1.5rem}.card{width:90%}.icon-container{gap:1rem}.btn-container{flex-wrap:wrap;justify-content:center;gap:1rem;display:flex}.btn-container a,.btn-container button{width:auto;min-height:0;padding:.75rem 1.5rem}.btn-container .section-launcher{min-height:86px;padding:.55rem .65rem}.toggle-btn{width:46px;height:46px;padding:.5rem;font-size:1.5rem;position:absolute;top:1rem;right:1rem}.volume-btn{left:1rem;right:auto}}@media (prefers-reduced-motion:reduce){.skill-chips span,.faq-answer{transition-duration:1ms}.skill-chips span:hover,.skill-chips span:focus-visible,.skill-chips span:active{transform:none}}@media (max-width:720px){.container{padding-inline:1.4rem}.section-window{width:92vw;max-height:70vh;position:fixed;top:7rem!important;left:4vw!important}.section-window-contact .section-window-content{max-height:calc(70vh - 3.7rem);overflow:auto}.work-skill-grid{grid-template-columns:1fr}}@media (max-width:420px){.container,.card{padding-inline:1.15rem}.icon-container a img{width:22px;height:22px}.project-grid{grid-template-columns:1fr}.about-hero{text-align:center;grid-template-columns:1fr}.about-avatar{margin:0 auto}.experience-card{grid-template-columns:1fr}.experience-card img{width:64px;height:64px}}
