@import"https://fonts.googleapis.com/css2?family=Noto+Sans+SC:wght@400;700;900&family=Orbitron:wght@700;900&display=swap";:root{--red: #ff2d55;--gold: #ffd700;--cyan: #00f0ff;--magenta: #ff00ff;--dark: #0a0a12;--darker: #050508}*{margin:0;padding:0;box-sizing:border-box}body,html{width:100%;height:100%;overflow:hidden;text-align:center;position:absolute;background:var(--dark);font-family:Noto Sans SC,Microsoft YaHei,sans-serif;color:#fff;-webkit-tap-highlight-color:transparent;user-select:none;-webkit-user-select:none}#view{width:100%;height:100%;position:fixed;top:0;z-index:1}#view canvas{width:100%;height:100%}#bts{margin:0;padding:0;width:100%;height:100%;position:absolute;z-index:2;display:none;pointer-events:auto;cursor:pointer}#bts.active{display:block}#bts div{line-height:0;height:25%}#bts div span{width:12.5%;height:100%;display:inline-block;visibility:hidden;border:1px solid rgba(255,45,85,.08);pointer-events:none;transition:background .05s}#bts div span:active,#bts div span.pressed{background:#ff2d5526;visibility:visible;border-color:#ff2d554d}@media screen and (orientation:portrait){#bts div{height:12.5%}#bts div span{width:25%}}#cover{position:absolute;z-index:10;background:var(--dark);width:100%;height:100%;pointer-events:none}#cover.fade-out{animation:fadeOut .8s ease-out forwards}.top{position:absolute;z-index:12;top:50%;left:50%;transform:translate(-50%,-50%);width:100%}.top h1{font-size:clamp(2rem,8vw,5rem);font-weight:900;letter-spacing:.3em;color:var(--red);text-shadow:0 0 20px rgba(255,45,85,.6),0 0 60px rgba(255,45,85,.3),0 0 100px rgba(255,45,85,.1);margin-bottom:8px;position:relative;z-index:1}.top .subtitle{font-family:Orbitron,monospace;font-size:clamp(.6rem,2vw,1rem);letter-spacing:.8em;color:var(--cyan);text-shadow:0 0 15px rgba(0,240,255,.5);margin-bottom:40px;opacity:.8}.top .bt{margin-bottom:24px;animation:pulse 1.5s ease-in-out infinite}.top .bt svg{width:clamp(60px,15vmin,120px);padding:1px;filter:drop-shadow(0 0 15px rgba(255,45,85,.5));cursor:pointer}.top .bt:hover svg{filter:drop-shadow(0 0 25px rgba(255,45,85,.8))}.top .atten{font-size:clamp(.55rem,1.5vw,.8rem);color:#fff6;letter-spacing:.15em}.top .share{margin-top:30px;font-size:clamp(.7rem,1.5vw,.9rem);color:#ffffff4d;letter-spacing:.5em}.top .share div{margin-top:10px}.top .share svg{width:clamp(24px,4vmin,36px);margin:0 6px;cursor:pointer;opacity:.5;transition:opacity .2s}.top .share svg:hover{opacity:1}.bts-nav{position:absolute;z-index:13;padding:clamp(8px,1.5vmin,16px);cursor:pointer;display:none}.bts-nav svg{width:clamp(28px,5vmin,48px);padding:1px;opacity:.6;transition:opacity .2s}.bts-nav:hover svg{opacity:1}#bt_back{top:0;left:0}#bt_about{top:0;right:0}.about{position:absolute;z-index:22;background:#0a0a12f2;border:1px solid rgba(255,45,85,.2);top:50%;left:50%;transform:translate(-50%,-50%);width:80%;max-width:500px;padding:clamp(24px,5vmin,48px);font-size:clamp(.7rem,1.5vw,.9rem);line-height:1.8;display:none;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px)}.about h2{font-size:clamp(1rem,2.5vw,1.4rem);color:var(--red);margin-bottom:16px;letter-spacing:.2em}.about p{color:#ffffffb3;margin-bottom:8px}.about .credit{margin-top:24px}.about .name{margin-top:12px;color:var(--cyan);font-size:.85em}#bt_close{margin-top:24px;padding:8px 24px;cursor:pointer;color:var(--red);border:1px solid var(--red);display:inline-block;letter-spacing:.1em;transition:all .2s}#bt_close:hover{background:var(--red);color:#fff}#finger{position:absolute;z-index:12;top:54%;left:50%;transform:translate(-50%,-50%);width:100%;display:none;pointer-events:none}#finger svg{fill:var(--red);width:clamp(36px,8vmin,60px);pointer-events:none;position:relative;animation:fingerBounce .8s ease-out infinite;filter:drop-shadow(0 0 10px rgba(255,45,85,.6))}#finger p{margin-top:16px;pointer-events:all;cursor:pointer;color:#fff9;font-size:clamp(.7rem,1.5vw,.9rem)}#finger p span{border-bottom:solid 1px rgba(255,255,255,.4)}#view:after{content:"";position:fixed;top:0;left:0;width:100%;height:100%;background:repeating-linear-gradient(0deg,transparent,transparent 2px,rgba(0,0,0,.03) 2px,rgba(0,0,0,.03) 4px);pointer-events:none;z-index:3}@keyframes fadeOut{0%{opacity:1}to{opacity:0;pointer-events:none}}@keyframes pulse{0%{transform:scale(1)}to{transform:scale(1.08)}}@keyframes fingerBounce{0%{top:18px;left:12px;opacity:0}40%{opacity:1}to{top:0;left:0;opacity:1}}@keyframes glitch{0%{transform:translate(0)}20%{transform:translate(-2px,2px)}40%{transform:translate(-2px,-2px)}60%{transform:translate(2px,2px)}80%{transform:translate(2px,-2px)}to{transform:translate(0)}}@keyframes neonFlicker{0%,19%,21%,23%,25%,54%,56%,to{text-shadow:0 0 20px rgba(255,45,85,.6),0 0 60px rgba(255,45,85,.3)}20%,24%,55%{text-shadow:none}}.top h1{animation:neonFlicker 3s infinite}
