@media(hover:hover) and (pointer:fine){
.yd-reflect{position:relative;isolation:isolate}
.yd-reflect::after{content:'';position:absolute;inset:0;z-index:5;pointer-events:none;border-radius:inherit;padding:1px;background:radial-gradient(180px circle at var(--reflect-x,50%) var(--reflect-y,50%),rgba(255,255,255,.95),rgba(207,218,189,.5) 24%,rgba(182,160,237,.28) 45%,transparent 72%);-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask-composite:exclude;opacity:0;transition:opacity .65s ease}
.yd-reflect:hover::after{opacity:1;animation:yd-edge-breathe 3.8s ease-in-out infinite alternate}
html[data-theme=light] .yd-reflect::after,html:not([data-theme]) .yd-reflect::after{background:radial-gradient(180px circle at var(--reflect-x,50%) var(--reflect-y,50%),rgba(255,255,255,1),rgba(132,149,99,.65) 25%,rgba(151,126,197,.4) 45%,transparent 72%)}
.hero h1 em.yd-reflect::after{inset:1px;border-radius:2px;padding:1.5px}
.ticker.yd-reflect::after{border-radius:0;background:radial-gradient(230px circle at var(--reflect-x,50%) var(--reflect-y,50%),#eaffb7aa,transparent 72%)}
@keyframes yd-edge-breathe{from{opacity:.65}to{opacity:1}}
}
@media(prefers-reduced-motion:reduce){.yd-reflect::after{animation:none!important;transition:none!important}}
@property --yd-edge-angle{syntax:'<angle>';initial-value:0deg;inherits:false}
@media(hover:hover) and (pointer:fine){
html .yd-reflect::after,html[data-theme] .yd-reflect::after,html:not([data-theme]) .yd-reflect::after{padding:1.2px;background:conic-gradient(from var(--yd-edge-angle),#9bcfff90,#b9a4f7c0,#eab8dba0,#ffe4b080,#c7efb890,#9bcfff90);opacity:0;transition:opacity .8s ease;animation:yd-edge-orbit 7s linear infinite;animation-play-state:paused}
html .yd-reflect:hover::after{opacity:.9;animation:yd-edge-orbit 7s linear infinite}
@keyframes yd-edge-orbit{to{--yd-edge-angle:360deg}}
}
@media(prefers-reduced-motion:reduce){html .yd-reflect:hover::after{animation:none!important}}
html #project-viewer[open]{animation:none!important}
.hero h1 em::after{display:none!important}
.hero h1 .yd-letter{display:inline-block;transition:translate .65s cubic-bezier(.22,1,.36,1),rotate .65s cubic-bezier(.22,1,.36,1),text-shadow .65s ease;transform-origin:50% 80%}
.hero h1 .yd-word{display:inline-block;white-space:nowrap}
@media(hover:hover) and (pointer:fine){
.hero h1 .yd-letter:hover{translate:0 -.09em;rotate:-5deg;text-shadow:0 .06em .1em #00000015;animation:yd-letter-float 2.4s ease-in-out infinite}
@keyframes yd-letter-float{0%,100%{translate:0 -.09em;rotate:-5deg}50%{translate:0 -.13em;rotate:3deg}}
}
@media(prefers-reduced-motion:reduce){.hero h1 .yd-letter{transition:none!important;animation:none!important}}
html .yd-intro{background:rgba(20,26,22,.42)!important;backdrop-filter:blur(28px) saturate(1.3);-webkit-backdrop-filter:blur(28px) saturate(1.3)}
html .yd-intro .intro-word{color:#f5f3eb!important}
html .yd-intro small{color:#f5f3eb99}
.nav-controls{position:relative}
.yd-mode-note{position:absolute;right:0;top:calc(100% + 14px);width:max-content;max-width:260px;padding:10px 13px;border-radius:12px;border:1px solid #ffffff28;background:#252c24b8;color:#f5f3eb;font-size:10px;line-height:1.6;font-weight:400;letter-spacing:0;backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);box-shadow:0 8px 24px #0002;pointer-events:none;animation:yd-note-in .65s cubic-bezier(.22,1,.36,1) both}
.yd-mode-note.is-hiding{animation:yd-note-out .6s cubic-bezier(.4,0,.2,1) both}
@keyframes yd-note-in{from{opacity:0;transform:translateY(-7px) scale(.96);filter:blur(5px)}to{opacity:1;transform:none;filter:blur(0)}}
@keyframes yd-note-out{to{opacity:0;transform:translateY(-5px) scale(.98);filter:blur(6px)}}
@media(prefers-reduced-motion:reduce){.yd-mode-note{animation:none}.yd-mode-note.is-hiding{opacity:0;animation:none}}
html .compact-qr:hover{translate:none;filter:none;box-shadow:none;animation:none}
html .compact-qr::after{display:none!important}
html .compact-qr:hover img{transform:none!important;filter:none!important}
.yd-music-note{position:fixed;top:auto;right:auto;z-index:100;max-width:calc(100vw - 28px)}