*{margin:0;padding:0;box-sizing:border-box;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-touch-callout:none}
body{font-family:'Inter',sans-serif;background:#050508;min-height:100vh;overflow:hidden;color:#fff;-webkit-user-drag:none}
img,a,svg{-webkit-user-drag:none;pointer-events:auto}
.curtain{position:fixed;top:0;width:50%;height:100%;background:#050508;z-index:100}
.curtain-left{left:0;transition:transform 1.4s cubic-bezier(0.77,0,0.175,1)}
.curtain-right{right:0;transition:transform 1.4s cubic-bezier(0.77,0,0.175,1)}
.curtain-left.open{transform:translateX(-100%)}
.curtain-right.open{transform:translateX(100%)}
.loader{position:fixed;top:0;left:0;width:100%;height:100%;display:flex;justify-content:center;align-items:center;z-index:200;background:#050508;transition:opacity 0.6s ease}
.loader.hidden{opacity:0;pointer-events:none}
.bg-circles{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);pointer-events:none}
.circle{position:absolute;border-radius:50%;border:1px solid rgba(255,255,255,0.03);top:50%;left:50%;transform:translate(-50%,-50%)}
.circle-1{width:200px;height:200px;animation:pulse1 4s ease-in-out infinite}
.circle-2{width:350px;height:350px;animation:pulse2 5s ease-in-out infinite}
.circle-3{width:500px;height:500px;animation:pulse3 6s ease-in-out infinite}
@keyframes pulse1{0%,100%{transform:translate(-50%,-50%) scale(1);opacity:0.5}50%{transform:translate(-50%,-50%) scale(1.1);opacity:0.8}}
@keyframes pulse2{0%,100%{transform:translate(-50%,-50%) scale(1);opacity:0.3}50%{transform:translate(-50%,-50%) scale(1.05);opacity:0.5}}
@keyframes pulse3{0%,100%{transform:translate(-50%,-50%) scale(1);opacity:0.2}50%{transform:translate(-50%,-50%) scale(1.03);opacity:0.3}}
.garland{position:absolute;left:0;width:100%;height:80px}
.garland-top{top:8%}
.garland-bottom{bottom:8%}
.garland-wire{position:absolute;top:0;left:0;width:100%;height:100%}
.bulbs{position:absolute;top:0;left:0;width:100%;height:100%;display:flex;justify-content:space-around;padding:0 2%}
.bulb{width:12px;height:18px;border-radius:50% 50% 50% 50% / 30% 30% 70% 70%;transform-origin:top center;animation:sway 3s ease-in-out infinite,glow-bulb 1.8s ease-in-out infinite;position:relative}
.garland-top .bulb:nth-child(4n+1){margin-top:45px}
.garland-top .bulb:nth-child(4n+2){margin-top:25px}
.garland-top .bulb:nth-child(4n+3){margin-top:12px}
.garland-top .bulb:nth-child(4n){margin-top:25px}
.garland-bottom .bulb:nth-child(4n+1){margin-top:12px}
.garland-bottom .bulb:nth-child(4n+2){margin-top:25px}
.garland-bottom .bulb:nth-child(4n+3){margin-top:45px}
.garland-bottom .bulb:nth-child(4n){margin-top:25px}
.bulb:nth-child(1){animation-delay:0s,0s}.bulb:nth-child(2){animation-delay:0.08s,0.08s}.bulb:nth-child(3){animation-delay:0.16s,0.16s}.bulb:nth-child(4){animation-delay:0.24s,0.24s}.bulb:nth-child(5){animation-delay:0.32s,0.32s}.bulb:nth-child(6){animation-delay:0.4s,0.4s}.bulb:nth-child(7){animation-delay:0.48s,0.48s}.bulb:nth-child(8){animation-delay:0.56s,0.56s}.bulb:nth-child(9){animation-delay:0.64s,0.64s}.bulb:nth-child(10){animation-delay:0.72s,0.72s}.bulb:nth-child(11){animation-delay:0.8s,0.8s}.bulb:nth-child(12){animation-delay:0.88s,0.88s}.bulb:nth-child(13){animation-delay:0.96s,0.96s}.bulb:nth-child(14){animation-delay:1.04s,1.04s}.bulb:nth-child(15){animation-delay:1.12s,1.12s}.bulb:nth-child(16){animation-delay:1.2s,1.2s}.bulb:nth-child(17){animation-delay:1.28s,1.28s}.bulb:nth-child(18){animation-delay:1.36s,1.36s}.bulb:nth-child(19){animation-delay:1.44s,1.44s}.bulb:nth-child(20){animation-delay:1.52s,1.52s}.bulb:nth-child(21){animation-delay:1.6s,1.6s}.bulb:nth-child(22){animation-delay:1.68s,1.68s}.bulb:nth-child(23){animation-delay:1.76s,1.76s}.bulb:nth-child(24){animation-delay:1.84s,1.84s}
.bulb::before{content:'';position:absolute;top:-7px;left:50%;transform:translateX(-50%);width:6px;height:8px;background:linear-gradient(180deg,#555,#333);border-radius:2px 2px 1px 1px}
.bulb::after{content:'';position:absolute;top:3px;left:2px;width:4px;height:5px;background:rgba(255,255,255,0.4);border-radius:50%;filter:blur(1px)}
@keyframes sway{0%,100%{transform:rotate(-3deg)}50%{transform:rotate(3deg)}}
@keyframes glow-bulb{0%,100%{filter:brightness(0.5) drop-shadow(0 0 4px currentColor)}50%{filter:brightness(1.3) drop-shadow(0 0 12px currentColor) drop-shadow(0 0 25px currentColor)}}
.bulb:nth-child(6n+1){background:linear-gradient(180deg,#ff4444,#aa1111);color:#ff4444}
.bulb:nth-child(6n+2){background:linear-gradient(180deg,#ffcc00,#aa8800);color:#ffcc00}
.bulb:nth-child(6n+3){background:linear-gradient(180deg,#44dd55,#119922);color:#44dd55}
.bulb:nth-child(6n+4){background:linear-gradient(180deg,#4499ff,#1155cc);color:#4499ff}
.bulb:nth-child(6n+5){background:linear-gradient(180deg,#ff44cc,#aa1199);color:#ff44cc}
.bulb:nth-child(6n+6){background:linear-gradient(180deg,#ff7733,#aa4400);color:#ff7733}
.particles{position:absolute;top:0;left:0;width:100%;height:100%;overflow:hidden;pointer-events:none}
.particles span{position:absolute;width:3px;height:3px;background:rgba(255,255,255,0.3);border-radius:50%;animation:float 8s infinite ease-in-out}
.particles span:nth-child(1){left:10%;animation-delay:0s}.particles span:nth-child(2){left:20%;animation-delay:1s}.particles span:nth-child(3){left:30%;animation-delay:2s}.particles span:nth-child(4){left:40%;animation-delay:3s}.particles span:nth-child(5){left:50%;animation-delay:4s}.particles span:nth-child(6){left:60%;animation-delay:5s}.particles span:nth-child(7){left:70%;animation-delay:6s}.particles span:nth-child(8){left:80%;animation-delay:7s}.particles span:nth-child(9){left:90%;animation-delay:0.5s}.particles span:nth-child(10){left:15%;animation-delay:2.5s}
@keyframes float{0%{top:100%;opacity:0;transform:scale(0)}10%{opacity:1;transform:scale(1)}90%{opacity:1;transform:scale(1)}100%{top:-5%;opacity:0;transform:scale(0)}}
.loader-content{width:100%;max-width:320px;padding:0 30px;text-align:center;position:relative;z-index:10}
.loader-text{font-size:10px;font-weight:400;letter-spacing:6px;text-transform:uppercase;color:rgba(255,255,255,0.3);margin-bottom:25px;opacity:0;animation:fadeIn 0.8s ease 0.2s forwards}
.loader-hint{font-size:9px;font-weight:300;letter-spacing:4px;text-transform:uppercase;color:rgba(255,255,255,0.15);margin-top:30px;opacity:0;animation:fadeIn 0.8s ease 0.6s forwards,blink 2s ease-in-out 1.5s infinite}
@keyframes blink{0%,100%{opacity:0.2}50%{opacity:0.5}}
.progress-row{display:flex;align-items:center;gap:20px;opacity:0;animation:fadeIn 0.8s ease 0.4s forwards}
@keyframes fadeIn{to{opacity:1}}
.progress-line{flex:1;height:1px;background:rgba(255,255,255,0.1);position:relative;overflow:visible}
.progress-fill{height:100%;width:0%;background:#fff;transition:width 0.15s ease;position:relative;box-shadow:0 0 10px rgba(255,255,255,0.5)}
.progress-fill::after{content:'';position:absolute;right:0;top:50%;transform:translateY(-50%);width:6px;height:6px;background:#fff;border-radius:50%;box-shadow:0 0 15px #fff,0 0 30px rgba(255,255,255,0.5)}
.percent{font-size:20px;font-weight:200;color:rgba(255,255,255,0.9);min-width:50px;letter-spacing:1px;font-variant-numeric:tabular-nums}
.main-content{min-height:100vh;display:flex;justify-content:center;align-items:center;opacity:0;transition:opacity 1s ease;background:radial-gradient(ellipse at 20% 20%,rgba(168,85,247,0.15) 0%,transparent 50%),radial-gradient(ellipse at 80% 80%,rgba(236,72,153,0.12) 0%,transparent 50%),radial-gradient(ellipse at 50% 50%,rgba(59,130,246,0.08) 0%,transparent 60%),#050508;position:relative;overflow:hidden}
.main-content::before{content:'';position:absolute;top:0;left:0;width:100%;height:100%;background-image:radial-gradient(2px 2px at 20px 30px,rgba(255,255,255,0.3),transparent),radial-gradient(2px 2px at 40px 70px,rgba(255,255,255,0.2),transparent),radial-gradient(1px 1px at 90px 40px,rgba(255,255,255,0.4),transparent),radial-gradient(2px 2px at 130px 80px,rgba(255,255,255,0.2),transparent),radial-gradient(1px 1px at 160px 120px,rgba(255,255,255,0.5),transparent),radial-gradient(2px 2px at 200px 50px,rgba(255,255,255,0.3),transparent),radial-gradient(1px 1px at 250px 160px,rgba(255,255,255,0.2),transparent),radial-gradient(2px 2px at 300px 90px,rgba(255,255,255,0.4),transparent),radial-gradient(1px 1px at 350px 200px,rgba(255,255,255,0.3),transparent),radial-gradient(2px 2px at 400px 130px,rgba(255,255,255,0.2),transparent);background-size:400px 400px;animation:twinkle 8s ease-in-out infinite;pointer-events:none;z-index:0}
@keyframes twinkle{0%,100%{opacity:0.5}50%{opacity:1}}
.main-content::after{content:'';position:absolute;width:300px;height:300px;background:radial-gradient(circle,rgba(168,85,247,0.2) 0%,transparent 70%);border-radius:50%;top:10%;right:10%;animation:floatOrb 15s ease-in-out infinite;pointer-events:none;z-index:0}
@keyframes floatOrb{0%,100%{transform:translate(0,0) scale(1)}25%{transform:translate(-50px,30px) scale(1.1)}50%{transform:translate(-20px,-40px) scale(0.9)}75%{transform:translate(30px,20px) scale(1.05)}}
.main-content.visible{opacity:1}
#model-container{position:absolute;top:0;left:0;width:100%;height:100%;z-index:0}
#model-container canvas{display:block}
.content-wrapper{text-align:center;position:relative;z-index:1}
.main-content .title{font-family:'Russo One',sans-serif;font-size:clamp(50px,12vw,100px);font-weight:400;letter-spacing:8px;display:flex;justify-content:center;flex-wrap:wrap;margin-bottom:30px;perspective:1000px}
.main-content .letter{display:inline-block;position:relative;color:#fff;opacity:0;transform:translateZ(-200px) rotateY(90deg);transform-style:preserve-3d;text-shadow:0 1px 0 #ccc,0 2px 0 #bbb,0 3px 0 #aaa,0 4px 0 #999,0 5px 0 #888,0 6px 0 #777,0 7px 0 #666,0 8px 0 #555,0 9px 0 #444,0 10px 10px rgba(0,0,0,0.5),0 15px 20px rgba(0,0,0,0.3)}
.main-content .space{width:35px}
.main-content.visible .letter{animation:letter3D 1s cubic-bezier(0.175,0.885,0.32,1.275) forwards,letterFloat 3s ease-in-out 1.5s infinite}
.main-content.visible .letter:nth-child(1){animation-delay:0.05s}.main-content.visible .letter:nth-child(2){animation-delay:0.1s}.main-content.visible .letter:nth-child(3){animation-delay:0.15s}.main-content.visible .letter:nth-child(4){animation-delay:0.2s}.main-content.visible .letter:nth-child(5){animation-delay:0.25s}.main-content.visible .letter:nth-child(6){animation-delay:0.3s}.main-content.visible .letter:nth-child(8){animation-delay:0.45s}.main-content.visible .letter:nth-child(9){animation-delay:0.5s}.main-content.visible .letter:nth-child(10){animation-delay:0.55s}.main-content.visible .letter:nth-child(11){animation-delay:0.6s}.main-content.visible .letter:nth-child(12){animation-delay:0.65s}
@keyframes letter3D{0%{opacity:0;transform:translateZ(-200px) rotateY(90deg) scale(0.5);text-shadow:none}50%{text-shadow:0 1px 0 #ccc,0 2px 0 #bbb,0 3px 0 #aaa,0 4px 0 #999,0 5px 0 #888}100%{opacity:1;transform:translateZ(0) rotateY(0) scale(1);text-shadow:0 1px 0 #ccc,0 2px 0 #bbb,0 3px 0 #aaa,0 4px 0 #999,0 5px 0 #888,0 6px 0 #777,0 7px 0 #666,0 8px 0 #555,0 9px 0 #444,0 10px 10px rgba(0,0,0,0.5),0 15px 20px rgba(0,0,0,0.3)}}
@keyframes letterFloat{0%,100%{transform:translateY(0) rotateY(0deg)}50%{transform:translateY(-5px) rotateY(5deg)}}
.main-content .letter::before{content:attr(data-letter);position:absolute;top:0;left:0;background:linear-gradient(180deg,#fff 0%,#a855f7 40%,#ec4899 100%);-webkit-background-clip:text;background-clip:text;color:transparent;z-index:1}
.subtitle{font-size:16px;font-weight:300;letter-spacing:6px;color:rgba(255,255,255,0.4);text-transform:uppercase;margin-bottom:60px;opacity:0}
.main-content.visible .subtitle{animation:fadeUp 0.8s ease 1.2s forwards}
@keyframes fadeUp{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}
.social-buttons{display:flex;justify-content:center;gap:20px;flex-wrap:wrap;opacity:0}
.main-content.visible .social-buttons{animation:fadeUp 0.8s ease 1.5s forwards}
.social-btn{display:flex;align-items:center;gap:10px;padding:14px 28px;border-radius:50px;text-decoration:none;font-size:14px;font-weight:400;letter-spacing:1px;color:#fff;transition:all 0.3s ease;position:relative;overflow:hidden}
.social-btn svg{width:20px;height:20px}
.social-btn::before{content:'';position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,0.2),transparent);transition:left 0.5s ease}
.social-btn:hover::before{left:100%}
.social-btn:hover{transform:translateY(-3px);box-shadow:0 10px 30px rgba(0,0,0,0.3)}
.social-btn.tiktok{background:linear-gradient(135deg,#000 0%,#111 100%);border:1px solid rgba(255,255,255,0.15)}
.social-btn.tiktok:hover{background:linear-gradient(135deg,#111 0%,#1a1a1a 100%);border-color:rgba(255,255,255,0.3);box-shadow:0 10px 30px rgba(0,0,0,0.5)}
.social-btn.telegram{background:linear-gradient(135deg,#0088cc 0%,#00aaff 100%)}
.social-btn.telegram:hover{background:linear-gradient(135deg,#00aaff 0%,#00ccff 100%);box-shadow:0 10px 30px rgba(0,136,204,0.4)}
.social-btn.vk{background:linear-gradient(135deg,#4a76a8 0%,#5d8cc9 100%)}
.social-btn.vk:hover{background:linear-gradient(135deg,#5d8cc9 0%,#7aa3d9 100%);box-shadow:0 10px 30px rgba(74,118,168,0.4)}
.social-btn.donate{background:linear-gradient(135deg,#ff4444 0%,#ff6b6b 100%)}
.social-btn.donate:hover{background:linear-gradient(135deg,#ff6b6b 0%,#ff8888 100%);box-shadow:0 10px 30px rgba(255,68,68,0.4)}
@media(max-width:768px){.garland{display:none}.particles{display:none}.circle-2,.circle-3{display:none}.bg-circles{display:none}.main-content::before,.main-content::after{display:none}}