html,body,#root{position:fixed;top:0;left:0;width:100%;height:100%;overflow:hidden;background-color:#000}@font-face{font-family:cardinal;src:url(/fonts/Cardinal.ttf)}@font-face{font-family:germanica;src:url(/fonts/plain_germanica.ttf)}.music-player{background:#140f0a59;border:1px solid #8b735550;border-radius:4px;padding:12px 16px;box-shadow:0 4px 20px #00000080;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);font-family:germanica;animation:fadeInPlayer 1.4s ease}@keyframes fadeInPlayer{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.music-player-content{display:flex;flex-direction:column;gap:2px}.scroll-container{width:100%;overflow:hidden;position:relative;height:24px;-webkit-mask-image:linear-gradient(to right,transparent,black 10%,black 90%,transparent);mask-image:linear-gradient(to right,transparent,black 10%,black 90%,transparent)}.scroll-text{display:flex;width:max-content;gap:0;white-space:nowrap;color:#d4c4a8;letter-spacing:.5px}.scroll-text.scrolling{animation:scroll 24s linear infinite}@keyframes scroll{0%{transform:translate(0)}to{transform:translate(-50%)}}.scroll-text span{padding-right:3rem}.controls{display:flex;justify-content:center;align-items:center;gap:12px}.control-btn{background:#8b735533;border:1px solid #8b7355;border-radius:50%;display:flex;align-items:center;justify-content:center;cursor:pointer;color:#d4c4a8;transition:all .2s ease;padding:0}.web-button-size{width:30px;height:30px}.mobile-button-size{width:20px;height:20px}.control-btn:hover{background:#8b735566;border-color:#a08968;transform:scale(1.05)}.control-btn:active{transform:scale(.95)}.play-btn{background:#8b73554d}.play-btn:hover{background:#8b735580}.underline-btn{position:relative}.underline-btn:after{content:"";position:absolute;left:4px;bottom:12px;width:calc(100% - 8px);height:2px;background:#dddd;transform:scaleX(0);transform-origin:left;transition:transform .5s ease}.underline-btn:hover:after{transform:scaleX(1)}.press-instruction{position:absolute;top:45%;left:50%;transform:translate(-50%,-50%);display:flex;flex-direction:column;align-items:center;gap:0;pointer-events:none;animation:fadeInInstruction 1.5s ease;transition:opacity 1.5s ease,transform .8s ease;z-index:100}.press-instruction.fade-out{opacity:0;transform:translate(-50%,-50%) scale(.95)}@keyframes fadeInInstruction{0%{opacity:0;transform:translate(-50%,-50%) scale(.9)}to{opacity:1;transform:translate(-50%,-50%) scale(1)}}.instruction-text{background:#d4c4a81a;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);padding:.5rem 1.25rem;font-family:cardinal;font-size:1.1rem;color:#000d;text-shadow:0 2px 8px rgba(0,0,0,.3);letter-spacing:.05em;border-radius:.5rem;animation:pulse 2.5s ease-in-out infinite}@keyframes pulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.8;transform:scale(1.01)}}.instruction-arrow{position:absolute;bottom:-19px;animation:bounce 2.5s ease-in-out infinite}@keyframes bounce{0%,to{transform:translateY(0)}50%{transform:translateY(2px)}}.instruction-arrow svg{filter:drop-shadow(0 2px 4px rgba(0,0,0,.3))}.arrow-shadow{position:absolute;bottom:-27px;left:50%;transform:translate(-50%);width:24px;height:8px;background:radial-gradient(ellipse at center,rgba(0,0,0,.3) 0%,rgba(0,0,0,.1) 50%,transparent 100%);border-radius:50%;filter:blur(2px)}.about-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:#04010ed9;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;z-index:10000;pointer-events:auto;animation:fadeIn .3s ease}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.about-modal{background:linear-gradient(135deg,#2a2520f2,#1e1b18f2);border:2px solid #8b7355;border-radius:8px;padding:3rem 2.5rem;padding-bottom:0;max-width:600px;max-height:80vh;overflow-y:auto;position:relative;box-shadow:0 10px 50px #00000080;animation:slideUp .4s ease}@keyframes slideUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}.about-close{position:absolute;top:1rem;right:1rem;background:transparent;border:none;color:#8b7355;font-size:2rem;cursor:pointer;width:2.5rem;height:2.5rem;display:flex;align-items:center;justify-content:center;transition:all .2s ease;border-radius:4px}.about-close:hover{background:#8b735533;color:#a08968;transform:rotate(90deg)}.about-content{color:#d4c4a8;font-family:gothic,serif;line-height:1.6}.about-section{margin-bottom:2rem}.about-section h3{font-family:germanica;font-size:1.3rem;color:#8b7355;margin-bottom:1.25rem;text-align:center;letter-spacing:.1em;border-bottom:1px solid rgba(139,115,85,.3);padding-bottom:0rem}.about-section p{margin:0;opacity:.9;font-size:1rem}.credit-item{display:flex;flex-direction:column;gap:.3rem;margin-bottom:1rem;padding:.8rem;background:#8b73551a;border-radius:4px;border:1px solid #8b735577;justify-content:center;align-items:center}.credit-item strong{font-size:.9rem;color:#a08968;font-family:germanica;letter-spacing:.05em}.credit-item a{color:#d4c4a8;text-decoration:none;transition:color .2s ease;font-size:1rem}.credit-item a:hover{color:#e4d4b8;text-decoration:underline}.credit-detail{font-size:.85rem;opacity:.7;font-style:italic}.tech-list{color:#8b7355;font-size:.95rem;text-align:center}.about-modal::-webkit-scrollbar{width:8px}.about-modal::-webkit-scrollbar-track{background:#8b73551a;border-radius:4px}.about-modal::-webkit-scrollbar-thumb{background:#8b7355;border-radius:4px}.about-modal::-webkit-scrollbar-thumb:hover{background:#a08968}