:root{color-scheme:dark;font-family:Inter,ui-sans-serif,system-ui,sans-serif;--gold:#e59a32;--ink:#070706;--scroll:0}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;overflow-x:hidden;background:#070706;color:#f4f0e8}a{color:inherit}.hero{position:relative;min-height:100svh;display:grid;place-items:center;align-content:center;gap:18px;overflow:hidden;padding:48px 20px;text-align:center}.hero-room{position:absolute;inset:-8%;background:linear-gradient(#05050542,#050505d9),url('/game-room.png') center/cover no-repeat;transform:translateY(calc(var(--scroll)*.13px)) scale(1.08);filter:brightness(.6) saturate(.7)}.hero-glow{position:absolute;width:min(80vw,880px);aspect-ratio:1;border-radius:50%;background:#e2861833;filter:blur(90px)}.logo{position:relative;width:min(680px,76vw);filter:drop-shadow(0 22px 35px #000) drop-shadow(0 0 38px #f90a);animation:logo-in .9s ease-out both}.hero>p{position:relative;margin:0;text-transform:uppercase;letter-spacing:.36em;color:#cbc6bd;font-size:11px}.hero-actions{position:relative;display:flex;justify-content:center;flex-wrap:wrap;gap:10px}.button,.links a{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:12px 20px;border:1px solid #5e5549;text-decoration:none;font-weight:850;transition:.2s}.button.primary,.links .vk{border-color:var(--gold);background:var(--gold);color:#0b0907}.button.ghost{background:#090909aa}.button:hover,.links a:hover{transform:translateY(-3px);filter:brightness(1.15);border-color:#ffd28b}.scroll{position:absolute;bottom:4%;font-size:28px;text-decoration:none;animation:bob 1s ease-in-out infinite alternate}@keyframes bob{to{transform:translateY(8px)}}@keyframes logo-in{from{opacity:0;transform:scale(.8);filter:blur(12px)}to{opacity:1;transform:none}} main{width:min(1180px,92vw);margin:auto}section{position:relative;min-height:70vh;padding:clamp(70px,10vw,150px) 0;border-top:1px solid #29241f}.release{display:grid;grid-template-columns:minmax(280px,44%) 1fr;gap:clamp(32px,7vw,100px);align-items:center}.cover-wrap{position:relative}.cover-wrap::before{content:"";position:absolute;inset:-12%;background:#1aaae92a;filter:blur(55px)}.release-cover{position:relative;display:block;width:100%;aspect-ratio:1;object-fit:cover;border-radius:7%;box-shadow:0 28px 90px #000}.eyebrow{margin:0;color:var(--gold);letter-spacing:.27em;font-weight:900;font-size:10px}h1,h2{margin:.15em 0;font-size:clamp(48px,8vw,104px);line-height:.86;letter-spacing:-.055em;text-transform:uppercase}h2{font-size:clamp(44px,7vw,92px)}.lead,.game-copy>p,.artist-copy>p{max-width:620px;color:#b9b7b0;font-size:clamp(16px,1.5vw,21px);line-height:1.55}.links{display:flex;gap:9px;flex-wrap:wrap;margin-top:25px}.links a{min-height:44px;background:#0e0f0e}.section-title{display:flex;align-items:end;justify-content:space-between;gap:20px}.cards{display:grid;grid-template-columns:repeat(2,1fr);gap:20px;margin-top:40px}.card{position:relative;min-height:390px;overflow:hidden;display:flex;flex-direction:column;justify-content:flex-end;padding:30px;border:1px solid #36302a;background-position:center;background-size:cover;text-decoration:none;transition:.25s}.card::before{content:"";position:absolute;inset:0;background:linear-gradient(transparent 10%,#050505f2 88%);transition:.25s}.card>*{position:relative}.card span,.card small{color:#ffc369;letter-spacing:.13em}.card strong{max-width:650px;margin:8px 0;font-size:clamp(30px,4vw,58px);line-height:.96}.card:hover{transform:translateY(-7px);border-color:var(--gold)}.card:hover::before{background:linear-gradient(transparent,#050505df 90%)}.minecraft{background-image:url('/clip-1000.jpg')}.circle{background-image:url('/clip-youtube.jpg')} .game-section{width:100vw;left:50%;margin-left:-50vw;display:grid;grid-template-columns:1.35fr .65fr;align-items:center;gap:clamp(25px,6vw,90px);padding-left:max(4vw,calc((100vw - 1180px)/2));padding-right:max(4vw,calc((100vw - 1180px)/2));overflow:hidden;background:radial-gradient(circle at 24% 50%,#3e160d,transparent 45%),#050505}.game-scene{position:relative;min-height:min(60vw,720px);perspective:900px}.game-room{position:absolute;inset:7% 0;width:100%;height:86%;object-fit:cover;filter:brightness(.56) saturate(.7);box-shadow:0 25px 100px #000}.game-vor,.game-monster,.game-pirate{position:absolute;bottom:5%;height:68%;filter:brightness(.52) drop-shadow(0 20px 16px #000);transition:transform .4s;will-change:transform}.game-vor{z-index:2;left:-3%;height:64%;transform:translateY(calc(var(--scroll)*-.006px))}.game-monster{z-index:1;left:31%;height:72%;transform:translateY(calc(var(--scroll)*-.01px))}.game-pirate{z-index:2;right:-4%;height:67%;transform:scaleX(-1) translateY(calc(var(--scroll)*.008px))}.game-copy{position:relative;z-index:3}.game-copy small{display:block;max-width:480px;margin-top:15px;color:#858782;line-height:1.4}.artist{display:grid;grid-template-columns:1fr minmax(240px,38%);align-items:center;min-height:90vh;overflow:hidden}.avatar{position:relative;z-index:1;align-self:end;display:block;width:100%;max-height:78vh;object-fit:contain;object-position:bottom;filter:drop-shadow(0 30px 45px #000) drop-shadow(0 0 28px #d9812330);transform:translateY(calc(var(--scroll)*-.012px));will-change:transform}.artist::before{content:"";position:absolute;right:-10%;width:55%;aspect-ratio:1;border-radius:50%;background:#e28a1830;filter:blur(80px)}footer{min-height:260px;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:55px max(4vw,calc((100vw - 1180px)/2));border-top:1px solid #29241f;color:#777}footer img{width:150px;opacity:.72}footer nav{display:flex;gap:18px}.reveal{opacity:0;transform:translateY(55px);transition:opacity .75s,transform .75s}.reveal.visible{opacity:1;transform:none} @media(max-width:760px){.hero{min-height:88svh}.logo{width:88vw}.hero-actions{width:100%}.hero-actions .button{width:min(100%,340px)}main{width:min(92vw,620px)}section{min-height:0;padding:80px 0}.release{grid-template-columns:1fr}.release-cover{max-width:460px}.cards{grid-template-columns:1fr}.card{min-height:260px}.game-section{grid-template-columns:1fr;padding-top:70px;padding-bottom:80px}.game-scene{min-height:72vw}.game-vor{left:-7%;height:61%}.game-monster{left:29%;height:70%}.game-pirate{right:-9%;height:63%}.game-copy{order:-1}.artist{grid-template-columns:1fr}.avatar{max-height:620px;width:min(90%,430px);margin:auto}footer{min-height:220px;flex-direction:column;text-align:center}.section-title{display:block}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.reveal{opacity:1;transform:none;transition:none}.hero-room,.game-vor,.game-monster,.game-pirate,.avatar{transform:none!important}.scroll{animation:none}} .reveal,.reveal.visible{opacity:1!important;transform:none!important} /* v63: lightweight loading with restored parallax and a viewport-wide transition */ .hero-room,.game-vor,.game-monster,.game-pirate,.avatar{will-change:transform}.hero-glow{display:none}.cover-wrap::before{filter:none;background:radial-gradient(circle,#1aaae930,transparent 70%)}.game-room{opacity:.58}.game-vor,.game-monster,.game-pirate{opacity:.82}.release,.clips,.game-section,.artist{content-visibility:auto;contain-intrinsic-size:900px;contain:layout style}.minecraft,.circle{background-image:none}.clips.entered .minecraft{background-image:url('/clip-1000.jpg')}.clips.entered .circle{background-image:url('/clip-youtube.jpg')} .cloud-gate{position:fixed;z-index:9000;inset:0;width:100vw;height:100svh;overflow:hidden;pointer-events:none;visibility:hidden;opacity:0}.cloud-gate.is-opening{visibility:visible;opacity:1;animation:cloud-gate-life 1.05s both}.cloud-gate i{position:absolute;left:-10vw;width:68vw;height:38vh;min-height:190px;opacity:.98;will-change:transform,opacity;background:radial-gradient(ellipse at 18% 62%,#eef7fa 0 22%,transparent 23%),radial-gradient(ellipse at 43% 40%,#d9ebf3 0 33%,transparent 34%),radial-gradient(ellipse at 73% 60%,#e8f4f8 0 28%,transparent 29%),linear-gradient(transparent 29%,#d9ebf3 30% 80%,transparent 81%);filter:drop-shadow(0 18px 28px #7fa5b84d)}.cloud-gate i.right{left:auto;right:-10vw;transform:scaleX(-1)}.cloud-gate .cloud-0{top:-13vh}.cloud-gate .cloud-1{top:13vh}.cloud-gate .cloud-2{top:39vh}.cloud-gate .cloud-3{top:65vh}.cloud-gate.is-opening i.left{animation:cloud-left-open .84s cubic-bezier(.2,.78,.2,1) var(--delay) both}.cloud-gate.is-opening i.right{animation:cloud-right-open .84s cubic-bezier(.2,.78,.2,1) var(--delay) both}@keyframes cloud-left-open{0%,16%{transform:translate3d(0,0,0) scale(1.18);opacity:.98}100%{transform:translate3d(-120vw,-4vh,0) scale(1.42);opacity:0}}@keyframes cloud-right-open{0%,16%{transform:scaleX(-1) scale(1.18);opacity:.98}100%{transform:translate3d(120vw,4vh,0) scaleX(-1) scale(1.42);opacity:0}}@keyframes cloud-gate-life{0%,84%{visibility:visible;opacity:1}100%{visibility:hidden;opacity:0}} .pickaxe{display:none;position:fixed;z-index:9999;top:0;left:0;width:58px;height:58px;pointer-events:none;opacity:0;transform:translate3d(-100px,-100px,0)}.pickaxe-tool{position:absolute;inset:0;transform:rotate(-24deg);transform-origin:8px 8px}.pickaxe i{position:absolute;left:27px;top:20px;width:10px;height:47px;background:#76502f;box-shadow:inset 3px 0 #ad7944;transform:rotate(-38deg);image-rendering:pixelated}.pickaxe b{position:absolute;left:5px;top:6px;width:48px;height:13px;background:#8ee4ed;clip-path:polygon(0 0,100% 0,100% 45%,64% 45%,64% 100%,45% 100%,45% 45%,0 45%);box-shadow:inset 0 -4px #277c94}.mining-ready .pickaxe{display:block}.mining-ready .pickaxe.is-visible{opacity:1}.mining-ready,.mining-ready *{cursor:none!important}.pickaxe.swing .pickaxe-tool{animation:pickaxe-swing .24s ease-out}.mined{animation:mined-hit .3s steps(2)}.block-chip{position:fixed;z-index:9998;width:9px;height:9px;pointer-events:none;box-shadow:inset -2px -2px #0004;animation:chip-fly .62s ease-out forwards}@keyframes pickaxe-swing{0%{transform:rotate(-24deg)}48%{transform:rotate(48deg) scale(1.1)}100%{transform:rotate(-24deg)}}@keyframes mined-hit{50%{filter:brightness(1.55)}}@keyframes chip-fly{to{transform:translate(var(--dx),var(--dy)) rotate(240deg);opacity:0}} @media(max-width:760px){.cloud-gate i{width:78vw;height:34vh;left:-18vw}.cloud-gate i.right{left:auto;right:-18vw}.release,.clips,.game-section,.artist{contain-intrinsic-size:720px}.hero-room{background-attachment:scroll}.logo{filter:none}.card,.button{transition:none}} /* v64: full-width chapters, a lighter cloud curtain and a short stationary pickaxe hit. */ main{width:100%;margin:0} main>section{padding-left:max(4vw,calc((100vw - 1180px)/2));padding-right:max(4vw,calc((100vw - 1180px)/2))} .game-section{width:100%;left:auto;margin-left:0} .music-player{margin-top:22px;width:min(100%,620px);overflow:hidden;border:1px solid #3a342d;border-radius:14px;background:#111} .music-player iframe{display:block;width:100%;height:240px;border:0;color-scheme:dark} .cloud-gate i{left:-13vw;width:66vw;height:35vh;min-height:180px;border-radius:50%;background:radial-gradient(ellipse at 15% 66%,#eef7fa 0 19%,transparent 20%),radial-gradient(ellipse at 31% 42%,#f8fcfd 0 27%,transparent 28%),radial-gradient(ellipse at 53% 55%,#dcecf2 0 33%,transparent 34%),radial-gradient(ellipse at 76% 39%,#f4fafc 0 26%,transparent 27%),radial-gradient(ellipse at 88% 68%,#d9ebf3 0 21%,transparent 22%),radial-gradient(ellipse at 50% 74%,#e5f1f5 0 43%,transparent 44%);filter:none} .cloud-gate i.right{left:auto;right:-13vw} .cloud-gate .cloud-0{top:-10vh}.cloud-gate .cloud-1{top:-10vh}.cloud-gate .cloud-2{top:28vh}.cloud-gate .cloud-3{top:28vh}.cloud-gate .cloud-4{top:65vh}.cloud-gate .cloud-5{top:65vh} .pickaxe{transition:opacity .12s}.pickaxe:not(.can-hit){opacity:.38!important}.pickaxe.can-hit b{filter:drop-shadow(0 0 5px #8ee4ed)} @keyframes pickaxe-swing{0%{transform:rotate(-18deg)}52%{transform:rotate(16deg) scale(1.035)}100%{transform:rotate(-18deg)}} @media(max-width:760px){main>section{padding-left:4vw;padding-right:4vw}.music-player iframe{height:210px}.cloud-gate i{width:72vw;height:32vh;left:-17vw}.cloud-gate i.right{left:auto;right:-17vw}.hero-room,.game-vor,.game-monster,.game-pirate,.avatar{will-change:auto}.game-vor,.game-monster,.game-pirate,.avatar{transform:none!important;filter:none}} .mining-controls{position:fixed;z-index:10001;right:18px;bottom:18px;display:flex;gap:8px}.mining-controls[hidden]{display:none}.mining-controls button{min-height:42px;padding:9px 13px;border:1px solid #7e725f;background:#0c0c0ce8;color:#f5efe6;font-weight:900;letter-spacing:.06em;cursor:pointer;box-shadow:0 8px 24px #0008}.mining-controls button:hover,.mining-controls button.active{border-color:#8ee4ed;color:#8ee4ed}.mining-ready .can-hit::after{content:"";position:absolute;z-index:20;inset:0;pointer-events:none;outline:1px dashed #8ee4ed66;outline-offset:-3px}.mine-hit-1{filter:brightness(1.08) contrast(1.05)}.mine-hit-2{filter:brightness(.86) contrast(1.18);transform:translate(1px,1px)}.mine-broken{pointer-events:none!important;animation:site-break .68s cubic-bezier(.35,.02,.8,.2) forwards!important}@keyframes site-break{25%{transform:translate(-5px,3px) rotate(-1deg)}100%{transform:translate(18px,80vh) rotate(13deg);opacity:0}}@media(max-width:760px),(hover:none),(pointer:coarse){.mining-controls,.pickaxe{display:none!important}} .mining-ready .mining-controls,.mining-ready .mining-controls *{cursor:pointer!important} /* v65: guaranteed full-screen cloud cover and one-click Google-style destruction. */ .cloud-gate::before,.cloud-gate::after{content:"";position:absolute;z-index:-1;top:-8vh;bottom:-8vh;width:58vw;background:radial-gradient(ellipse at 18% 12%,#f9fcfd 0 16%,transparent 17%),radial-gradient(ellipse at 62% 9%,#d8eaf1 0 23%,transparent 24%),radial-gradient(ellipse at 42% 31%,#eef7fa 0 28%,transparent 29%),radial-gradient(ellipse at 78% 45%,#dcecf2 0 25%,transparent 26%),radial-gradient(ellipse at 28% 58%,#f5fafc 0 30%,transparent 31%),radial-gradient(ellipse at 68% 74%,#d8e9f0 0 31%,transparent 32%),radial-gradient(ellipse at 34% 94%,#edf6f9 0 27%,transparent 28%),#dfeef3;will-change:transform,opacity}.cloud-gate::before{left:-4vw}.cloud-gate::after{right:-4vw;transform:scaleX(-1)}.cloud-gate.is-opening::before{animation:cloud-bank-left .92s cubic-bezier(.2,.78,.2,1) .05s both}.cloud-gate.is-opening::after{animation:cloud-bank-right .92s cubic-bezier(.2,.78,.2,1) .05s both}@keyframes cloud-bank-left{0%,15%{transform:translate3d(0,0,0)}100%{transform:translate3d(-112vw,-3vh,0);opacity:0}}@keyframes cloud-bank-right{0%,15%{transform:scaleX(-1) translate3d(0,0,0)}100%{transform:scaleX(-1) translate3d(-112vw,3vh,0);opacity:0}} .pickaxe{width:64px;height:64px}.pickaxe-tool{inset:0;transform:rotate(-14deg);transform-origin:11px 11px}.pickaxe svg{display:block;width:64px;height:64px;overflow:visible;filter:drop-shadow(0 5px 3px #0008);image-rendering:pixelated}.pick-handle{fill:#704728;stroke:#3b2415;stroke-width:2}.pick-head{fill:#54d3e5;stroke:#17677d;stroke-width:2;stroke-linejoin:miter}.pick-shine{fill:#c5f9ff}.pickaxe.can-hit svg{filter:drop-shadow(0 0 5px #bdfbff) drop-shadow(0 5px 3px #0008)} .pickaxe i,.pickaxe b{display:none!important}.pickaxe.swing .pickaxe-tool{animation:pickaxe-hit-v65 .18s ease-out}@keyframes pickaxe-hit-v65{0%{transform:rotate(-14deg)}48%{transform:rotate(10deg) translate(1px,1px)}100%{transform:rotate(-14deg)}} .mine-breaking{animation:mine-crack .13s steps(2)!important}.mine-broken{pointer-events:none!important;animation:mine-collapse .56s cubic-bezier(.4,0,.9,.35) forwards!important}@keyframes mine-crack{50%{filter:brightness(1.8) contrast(1.5);clip-path:polygon(0 0,47% 0,50% 19%,46% 38%,52% 59%,48% 78%,55% 100%,0 100%)}}@keyframes mine-collapse{0%{opacity:1}20%{transform:translate(-3px,3px) rotate(-1deg)}100%{transform:translate(12px,72vh) rotate(16deg) scale(.72);opacity:0}} /* v66: full-width voxel cloud curtain. */ .cloud-gate.is-opening{animation:cloud-gate-life-v66 2.35s both}.cloud-gate::before,.cloud-gate::after{z-index:0;top:0;bottom:0;width:58vw;background:linear-gradient(90deg,#c9dde6aa 1px,transparent 1px),linear-gradient(#c9dde6aa 1px,transparent 1px),linear-gradient(135deg,#f8fcfd 0 25%,#e4f1f5 25% 50%,#d7e8ef 50% 75%,#eef7fa 75%);background-size:44px 44px,44px 44px,176px 176px;clip-path:polygon(0 0,91% 0,91% 7%,100% 7%,100% 19%,95% 19%,95% 31%,100% 31%,100% 44%,92% 44%,92% 58%,100% 58%,100% 71%,95% 71%,95% 84%,100% 84%,100% 94%,91% 94%,91% 100%,0 100%)}.cloud-gate::before{left:0}.cloud-gate::after{right:0}.cloud-gate.is-opening::before{animation:voxel-bank-left 1.95s cubic-bezier(.2,.72,.16,1) .12s both}.cloud-gate.is-opening::after{animation:voxel-bank-right 1.95s cubic-bezier(.2,.72,.16,1) .12s both} .cloud-gate i{z-index:1;width:48vw;height:24vh;min-height:130px;border-radius:0;filter:none;background:linear-gradient(90deg,#b9d2dc77 2px,transparent 2px),linear-gradient(#b9d2dc77 2px,transparent 2px),linear-gradient(135deg,#f7fcfd 0 25%,#dcecf2 25% 50%,#cfe3eb 50% 75%,#edf7fa 75%);background-size:36px 36px,36px 36px,144px 144px;clip-path:polygon(0 18%,12% 18%,12% 7%,31% 7%,31% 0,57% 0,57% 9%,76% 9%,76% 21%,94% 21%,94% 34%,100% 34%,100% 81%,88% 81%,88% 94%,63% 94%,63% 100%,37% 100%,37% 91%,15% 91%,15% 79%,0 79%)}.cloud-gate i.left{left:-9vw}.cloud-gate i.right{right:-9vw}.cloud-gate .cloud-0,.cloud-gate .cloud-1{top:-5vh}.cloud-gate .cloud-2,.cloud-gate .cloud-3{top:36vh}.cloud-gate .cloud-4,.cloud-gate .cloud-5{top:75vh}.cloud-gate.is-opening i.left{animation:voxel-piece-left 1.72s cubic-bezier(.2,.72,.16,1) calc(.18s + var(--delay)) both}.cloud-gate.is-opening i.right{animation:voxel-piece-right 1.72s cubic-bezier(.2,.72,.16,1) calc(.18s + var(--delay)) both} @keyframes voxel-bank-left{0%,18%{transform:translate3d(0,0,0)}55%{transform:translate3d(-18vw,0,0)}100%{transform:translate3d(-112vw,-2vh,0);opacity:0}}@keyframes voxel-bank-right{0%,18%{transform:scaleX(-1) translate3d(0,0,0)}55%{transform:scaleX(-1) translate3d(-18vw,0,0)}100%{transform:scaleX(-1) translate3d(-112vw,2vh,0);opacity:0}}@keyframes voxel-piece-left{0%,16%{transform:translate3d(0,0,0) scale(1.06)}62%{transform:translate3d(-34vw,var(--piece-y,0),0) scale(1.12)}100%{transform:translate3d(-125vw,var(--piece-y,0),0) scale(1.18);opacity:0}}@keyframes voxel-piece-right{0%,16%{transform:scaleX(-1) translate3d(0,0,0) scale(1.06)}62%{transform:scaleX(-1) translate3d(-34vw,var(--piece-y,0),0) scale(1.12)}100%{transform:scaleX(-1) translate3d(-125vw,var(--piece-y,0),0) scale(1.18);opacity:0}}@keyframes cloud-gate-life-v66{0%,91%{visibility:visible;opacity:1}100%{visibility:hidden;opacity:0}} /* v67: simple original voxel clouds, material mining and left-aligned layout. */ .hero{place-items:start;justify-items:start;text-align:left;padding-left:max(4vw,calc((100vw - 1180px)/2));padding-right:max(4vw,calc((100vw - 1180px)/2))}.hero-actions{justify-content:flex-start}.scroll{left:max(4vw,calc((100vw - 1180px)/2))}.release-copy,.section-title,.game-copy,.artist-copy{text-align:left}.section-title{display:block}footer{justify-content:flex-start;flex-wrap:wrap}footer nav{margin-left:auto} .cloud-gate::before,.cloud-gate::after{display:none!important}.cloud-gate.is-opening{animation:cloud-gate-life-v67 1.95s both}.cloud-gate i{z-index:1;left:-9vw!important;width:63vw!important;height:42vh!important;min-height:210px!important;border-radius:0!important;background:#d9ebf3!important;box-shadow:10vw 3vw 0 #e8f4f8,18vw -4vw 0 #bfd8e5,-9vw 7vw 0 #eef7fa!important;clip-path:polygon(0 28%,14% 28%,14% 9%,39% 9%,39% 0,65% 0,65% 18%,86% 18%,86% 37%,100% 37%,100% 100%,0 100%)!important;opacity:.98}.cloud-gate i.right{left:auto!important;right:-9vw!important;transform:scaleX(-1)}.cloud-gate .cloud-0,.cloud-gate .cloud-1{top:-8vh!important}.cloud-gate .cloud-2,.cloud-gate .cloud-3{top:29vh!important}.cloud-gate .cloud-4,.cloud-gate .cloud-5{top:66vh!important}.cloud-gate.is-opening i.left{animation:original-cloud-left 1.55s cubic-bezier(.2,.78,.2,1) calc(.1s + var(--delay)) both}.cloud-gate.is-opening i.right{animation:original-cloud-right 1.55s cubic-bezier(.2,.78,.2,1) calc(.1s + var(--delay)) both}@keyframes original-cloud-left{0%,18%{transform:translate3d(0,0,0) scale(1.12)}100%{transform:translate3d(-125vw,-5vh,80px) scale(1.5);opacity:0}}@keyframes original-cloud-right{0%,18%{transform:scaleX(-1) translate3d(0,0,0) scale(1.12)}100%{transform:scaleX(-1) translate3d(-125vw,5vh,80px) scale(1.5);opacity:0}}@keyframes cloud-gate-life-v67{0%,90%{visibility:visible;opacity:1}100%{visibility:hidden;opacity:0}} .pickaxe{width:78px;height:78px}.pickaxe-tool{inset:0;transform:none;transform-origin:18px 16px}.pickaxe svg{width:78px;height:78px}.pick-handle-edge{fill:#2d1a0f}.pick-handle{fill:#8f5d32}.pick-head-edge{fill:#124e60}.pick-head{fill:#55d9ea}.pick-shine{fill:#d4fbff}.pickaxe.swing .pickaxe-tool{animation:pickaxe-hit-v67 .2s ease-out}@keyframes pickaxe-hit-v67{0%{transform:rotate(-2deg)}50%{transform:rotate(25deg) translate(2px,2px)}100%{transform:rotate(-2deg)}} .mining-ready iframe{pointer-events:none}.mine-crack-layer{position:absolute;z-index:9997;pointer-events:none;color:#161918;background-repeat:no-repeat;opacity:.72;filter:drop-shadow(0 1px 1px #fff4)}.mine-crack-layer.material-glass{color:#d9fbff;mix-blend-mode:screen}.mine-crack-layer.material-wood{color:#2e1709;mix-blend-mode:multiply}.mine-crack-layer.material-stone{color:#111;mix-blend-mode:multiply}.mine-crack-layer.crack-1{background-image:linear-gradient(58deg,transparent 48.8%,currentColor 49% 50.2%,transparent 50.5%);background-size:55% 65%;background-position:center}.mine-crack-layer.crack-2{background-image:linear-gradient(58deg,transparent 48.8%,currentColor 49% 50.5%,transparent 50.8%),linear-gradient(118deg,transparent 49%,currentColor 49.3% 50.4%,transparent 50.7%);background-size:65% 75%,45% 55%;background-position:center,52% 47%}.mine-crack-layer.crack-3{background-image:linear-gradient(58deg,transparent 48.5%,currentColor 48.8% 50.8%,transparent 51%),linear-gradient(118deg,transparent 48.8%,currentColor 49% 50.8%,transparent 51%),linear-gradient(22deg,transparent 49%,currentColor 49.3% 50.6%,transparent 51%);background-size:78% 88%,65% 78%,55% 62%;background-position:center,center,48% 56%}.mine-crack-layer.crack-4{background-image:linear-gradient(58deg,transparent 47.8%,currentColor 48% 51.3%,transparent 51.5%),linear-gradient(118deg,transparent 48%,currentColor 48.3% 51.1%,transparent 51.4%),linear-gradient(22deg,transparent 48.4%,currentColor 48.7% 51%,transparent 51.3%),linear-gradient(153deg,transparent 48.7%,currentColor 49% 51%,transparent 51.3%);background-size:92% 96%,82% 92%,72% 80%,61% 70%;background-position:center}.mine-crack-layer.falling{animation:crack-fall .5s ease-in forwards}.mine-damage-1{filter:contrast(1.08) brightness(.96)!important}.mine-damage-2{animation:mine-shudder .16s steps(2)!important;filter:contrast(1.2) brightness(.84)!important}.mine-material-glass.mine-broken{animation:glass-break .48s ease-in forwards!important}.mine-material-wood.mine-broken{animation:wood-break .62s ease-in forwards!important}.mine-material-stone.mine-broken{animation:stone-break .55s ease-in forwards!important}@keyframes mine-shudder{50%{transform:translate(2px,-1px)}}@keyframes glass-break{to{transform:scale(.82);filter:blur(2px);opacity:0}}@keyframes wood-break{to{transform:translate(16px,70vh) rotate(18deg);opacity:0}}@keyframes stone-break{to{transform:translateY(34px) scale(.7);filter:grayscale(1);opacity:0}}@keyframes crack-fall{to{transform:translateY(55vh) rotate(12deg);opacity:0}} .tool-drop{position:absolute;z-index:10002;width:58px;height:58px;border:2px solid #ffd36a;background:#24170bea;color:#fff;font-size:24px;cursor:pointer!important;box-shadow:0 0 24px #ffad27;animation:tool-drop-in 6.5s ease-out forwards}.mining-ready .tool-drop{cursor:pointer!important}@keyframes tool-drop-in{0%{transform:translateY(-25px) scale(.4);opacity:0}8%,78%{transform:none;opacity:1}100%{transform:translateY(35px);opacity:0}} @media(max-width:760px){.hero{padding-left:5vw;padding-right:5vw}.hero-actions{justify-content:flex-start}footer nav{margin-left:0}.cloud-gate i{width:76vw!important;height:43vh!important;left:-18vw!important}.cloud-gate i.right{left:auto!important;right:-18vw!important}} /* v68: exact original per-section cloud behavior restored from backup. */ main>section>.cloud-gate{position:absolute!important;z-index:12!important;inset:-5vw -12vw!important;width:auto!important;height:auto!important;overflow:hidden!important;pointer-events:none!important;perspective:700px!important;visibility:visible!important;opacity:1!important;animation:none!important;background:none!important} main>section>.cloud-gate::before,main>section>.cloud-gate::after{display:none!important} main>section>.cloud-gate i{--side:-1;position:absolute!important;left:8%!important;right:auto!important;width:42vw!important;height:18vw!important;max-height:230px!important;min-height:110px!important;background:#d9ebf3!important;box-shadow:8vw 2vw 0 #e8f4f8,15vw -2vw 0 #bfd8e5,-7vw 5vw 0 #eef7fa!important;clip-path:polygon(0 28%,14% 28%,14% 9%,39% 9%,39% 0,65% 0,65% 18%,86% 18%,86% 37%,100% 37%,100% 100%,0 100%)!important;opacity:.97!important;transform:translate3d(0,0,0) scale(1.25)!important;transition:transform .95s cubic-bezier(.2,.78,.2,1),opacity .65s!important;transition-delay:var(--delay)!important;animation:none!important} main>section>.cloud-gate i.right{--side:1;left:auto!important;right:7%!important;transform:scaleX(-1) scale(1.25)!important}main>section>.cloud-gate .cloud-0{top:2%!important}main>section>.cloud-gate .cloud-1{top:25%!important}main>section>.cloud-gate .cloud-2{top:48%!important}main>section>.cloud-gate .cloud-3{top:70%!important} main>section.entered>.cloud-gate i.left{transform:translate3d(-115vw,-8vh,120px) scale(1.8)!important;opacity:0!important}main>section.entered>.cloud-gate i.right{transform:translate3d(115vw,8vh,120px) scaleX(-1) scale(1.8)!important;opacity:0!important} @media(max-width:760px){main>section>.cloud-gate i:nth-child(n+5){display:none!important}main>section>.cloud-gate i{width:64vw!important;height:28vw!important;min-height:90px!important;box-shadow:12vw 3vw 0 #e8f4f8,22vw -3vw 0 #bfd8e5,-10vw 7vw 0 #eef7fa!important}} /* v69: recorded impact sounds and compact cracks at the exact hit point. */ .mine-crack-layer{background:none!important;overflow:visible;opacity:.92;filter:drop-shadow(0 1px 0 #fff2) drop-shadow(0 1px 2px #0008)} .mine-crack-layer svg{display:block;width:100%;height:100%;overflow:visible} .mine-crack-layer path,.mine-crack-layer circle{fill:none;stroke:currentColor;stroke-width:1.35;stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke;opacity:0} .mine-crack-layer circle{fill:currentColor;stroke-width:0;transform-origin:80px 80px;transform:scale(.65)} .mine-crack-layer.material-glass{color:#d9f8ff;mix-blend-mode:screen;filter:drop-shadow(0 0 1px #052c38) drop-shadow(0 0 3px #d7fbff88)} .mine-crack-layer.material-wood{color:#271307;mix-blend-mode:multiply} .mine-crack-layer.material-stone{color:#111312;mix-blend-mode:multiply} .mine-crack-layer.material-gold{color:#5c3c00;mix-blend-mode:multiply;filter:drop-shadow(0 0 2px #ffe071)} .mine-crack-layer.crack-1 path:nth-child(-n+4),.mine-crack-layer.crack-1 circle{opacity:.82} .mine-crack-layer.crack-2 path:nth-child(-n+8),.mine-crack-layer.crack-2 circle{opacity:.88} .mine-crack-layer.crack-3 path:nth-child(-n+12),.mine-crack-layer.crack-3 circle{opacity:.93} .mine-crack-layer.crack-4 path,.mine-crack-layer.crack-4 circle{opacity:1} .mine-crack-layer.crack-2 path,.mine-crack-layer.crack-3 path,.mine-crack-layer.crack-4 path{stroke-width:1.55} /* v70: restore the intended composition; only platform links stay left-aligned. */ .hero{place-items:center;justify-items:center;text-align:center;padding:48px 20px} .hero-actions{justify-content:center} .scroll{left:auto} .release-copy,.game-copy,.artist-copy{text-align:left} .section-title{display:flex;text-align:left} footer{justify-content:space-between;flex-wrap:nowrap} footer nav{margin-left:0} @media(max-width:760px){ .hero{padding-left:20px;padding-right:20px} .hero-actions{justify-content:center} .section-title{display:block} footer{flex-wrap:wrap} } /* v71: mining score, hardness and tool durability. */ .mine-status{position:relative;display:flex;align-items:center;min-height:42px;padding:8px 13px;border:1px solid #4c7d83;background:#071113ee;color:#bff7ff;font-size:11px;font-weight:900;letter-spacing:.04em;box-shadow:0 8px 24px #0008;white-space:nowrap}.mine-status::after{content:attr(data-message);position:absolute;right:0;bottom:calc(100% + 7px);padding:7px 10px;background:#070a09ee;border:1px solid #d3a845;color:#ffe39a;opacity:1;transition:opacity .18s;white-space:nowrap}.mine-status[data-message=""]::after,.mine-status:not([data-message])::after{opacity:0} .mine-material-gold.mine-broken{animation:stone-break .75s ease-in forwards!important} .pickaxe.tool-broken .pick-pixels{animation:tool-break-v71 .75s ease-in forwards} @keyframes tool-break-v71{20%{transform:rotate(-34deg) translate(3px,-2px)}55%{transform:rotate(-62deg) translate(-8px,8px);opacity:.72}100%{transform:rotate(-88deg) translate(-22px,52px);opacity:0}} @media(max-width:980px){.mining-controls{max-width:calc(100vw - 36px);flex-wrap:wrap;justify-content:flex-end}.mine-status{order:-1;width:100%;justify-content:center}} main>section>.cloud-gate i{top:31%!important} main>section>.cloud-gate i.right{top:31%!important} /* v74: a full-height block-cloud curtain, game inventory and progressive mining damage. */ main>section>.cloud-gate{inset:-8vh -8vw!important;min-height:calc(100% + 16vh)!important} main>section>.cloud-gate i{top:6%!important;width:69vw!important;height:88%!important;max-height:none!important;min-height:520px!important;left:-12vw!important;border-radius:0!important;background-color:#d9ebf3!important;background-image:linear-gradient(90deg,#fff8 0 8%,transparent 8% 18%,#abcbd955 18% 30%,transparent 30% 44%,#f5fbfd99 44% 57%,transparent 57% 72%,#b9d5e266 72% 83%,transparent 83%),linear-gradient(#f8fcfd88 0 12%,transparent 12% 28%,#a9cad866 28% 39%,transparent 39% 58%,#eef8fb88 58% 73%,transparent 73%)!important;background-size:168px 126px!important;box-shadow:11vw 0 0 #e8f4f8,22vw 3vh 0 #bfd8e5,-8vw 5vh 0 #eef7fa,0 18px 46px #05131c48!important;clip-path:polygon(0 5%,12% 5%,12% 0,30% 0,30% 4%,52% 4%,52% 0,73% 0,73% 7%,91% 7%,91% 3%,100% 3%,100% 96%,88% 96%,88% 100%,65% 100%,65% 95%,41% 95%,41% 100%,18% 100%,18% 96%,0 96%)!important;opacity:.99!important;transition:transform 1.55s cubic-bezier(.24,.72,.18,1),opacity 1.1s!important;transition-delay:.18s!important} main>section>.cloud-gate i.right{left:auto!important;right:-12vw!important;top:6%!important} main>section.entered:not(.cloud-open)>.cloud-gate i.left{transform:translate3d(0,0,0) scale(1.12)!important;opacity:.99!important} main>section.entered:not(.cloud-open)>.cloud-gate i.right{transform:scaleX(-1) scale(1.12)!important;opacity:.99!important} main>section.cloud-open>.cloud-gate i.left{transform:translate3d(-116vw,-2vh,80px) scale(1.38)!important;opacity:0!important} main>section.cloud-open>.cloud-gate i.right{transform:translate3d(116vw,2vh,80px) scaleX(-1) scale(1.38)!important;opacity:0!important} .mine-status{gap:6px;padding:6px 8px;background:#080b0dee;border-color:#53606a}.resource-slot{position:relative;display:grid;place-items:center;width:52px;height:52px;border:2px solid #6d7477;background:linear-gradient(135deg,#24282a,#0e1011);box-shadow:inset 0 0 0 2px #050607,0 4px 8px #0008}.resource-slot>i{display:block;width:29px;height:29px;image-rendering:pixelated;box-shadow:inset -5px -5px #0005,inset 4px 4px #fff3}.resource-slot.glass>i{background:linear-gradient(135deg,#eaffff,#72cadb 45%,#287587);border:2px solid #c8f8ff}.resource-slot.wood>i{background:repeating-linear-gradient(90deg,#a7662b 0 6px,#713d17 6px 9px);border:2px solid #d39651}.resource-slot.stone>i{background:linear-gradient(135deg,#a4aaa8 0 26%,#626866 27% 55%,#393e3c 56%);border:2px solid #bec3c1}.resource-slot.gold>i{background:linear-gradient(135deg,#fff19a,#e3a51d 46%,#8d5705);border:2px solid #ffe68a}.resource-slot b{position:absolute;right:2px;bottom:1px;min-width:17px;padding:0 3px;background:#050505;color:#fff;text-align:center;font-size:12px;text-shadow:1px 1px #000}.resource-slot small{position:absolute;left:50%;bottom:-15px;transform:translateX(-50%);font-size:7px;color:#aab1b1;letter-spacing:.04em}.pick-readout{display:grid;gap:4px;min-width:104px;padding:5px 7px}.pick-readout strong{font-size:9px;color:#d6edf0}.pick-readout em{display:block;width:100%;height:6px;background:#271313;border:1px solid #534343}.pick-readout em i{display:block;height:100%;background:linear-gradient(90deg,#ce3d32,#f4c746,#77de7a)}.score-pill{padding:8px;color:#ffe18a;font-weight:950}.pickaxe.skin-wood b{background:#99602d;box-shadow:inset 0 -4px #4f2b12}.pickaxe.skin-stone b{background:#858b89;box-shadow:inset 0 -4px #414645}.pickaxe.skin-iron b{background:#e2e7e6;box-shadow:inset 0 -4px #747c7a}.pickaxe.skin-gold b{background:#f5c542;box-shadow:inset 0 -4px #9a6507;filter:drop-shadow(0 0 4px #ffc928)}.pickaxe.skin-diamond b{background:#8ee4ed;box-shadow:inset 0 -4px #277c94;filter:drop-shadow(0 0 5px #8ee4ed)}.bandit-pain{position:fixed;z-index:10020;pointer-events:none;color:#fff1c7;font-size:24px;font-weight:1000;text-shadow:2px 3px #7c1111;animation:bandit-pain-fly .68s ease-out forwards}@keyframes bandit-pain-fly{to{transform:translate(-8px,-70px) rotate(-9deg) scale(1.35);opacity:0}} .mine-material-gold.mine-broken{animation:gold-collapse-v74 1s cubic-bezier(.38,.02,.88,.24) forwards!important}@keyframes gold-collapse-v74{0%{opacity:1;filter:brightness(1.6)}18%{transform:translate(-4px,2px) rotate(-1deg)}42%{transform:translate(6px,9px) rotate(2deg) scale(.96);filter:brightness(.65)}100%{transform:translate(34px,76vh) rotate(19deg) scale(.38);filter:blur(3px);opacity:0}} @media(max-width:760px){main>section>.cloud-gate{inset:-5vh -14vw!important}main>section>.cloud-gate i{top:3%!important;width:78vw!important;height:92%!important;min-height:440px!important;left:-17vw!important;background-size:116px 94px!important}main>section>.cloud-gate i.right{left:auto!important;right:-17vw!important;top:3%!important}} .minecraft-avatar{-webkit-mask:url('/d3mid-avatar-mask.svg') center/contain no-repeat;mask:url('/d3mid-avatar-mask.svg') center/contain no-repeat;filter:drop-shadow(0 24px 30px #000) drop-shadow(0 0 22px #5fa94038)} /* v79: clean Minecraft-style cloud plates, built from flat pixel rectangles. */ main>section>.cloud-gate i{width:52vw!important;height:21vh!important;max-height:210px!important;min-height:118px!important;left:1%!important;background:linear-gradient(#f8fbfc 0 0) 0 38%/100% 38% no-repeat,linear-gradient(#fff 0 0) 8% 20%/22% 22% no-repeat,linear-gradient(#eef3f5 0 0) 26% 10%/28% 34% no-repeat,linear-gradient(#fff 0 0) 52% 24%/20% 22% no-repeat,linear-gradient(#e9eff2 0 0) 69% 13%/24% 31% no-repeat,linear-gradient(#c5cdd1 0 0) 4% 70%/89% 14% no-repeat!important;background-color:transparent!important;box-shadow:none!important;filter:drop-shadow(0 7px 0 #9da8ae) drop-shadow(0 13px 0 #6f7c83aa)!important;clip-path:polygon(0 8%,100% 8%,100% 25%,94% 25%,94% 39%,100% 39%,100% 55%,89% 55%,89% 70%,97% 70%,97% 86%,82% 86%,82% 100%,0 100%)!important;transform:translate3d(0,0,0) scale(1.12)!important;transition:transform 1.5s cubic-bezier(.18,.72,.18,1),opacity .95s!important} main>section>.cloud-gate i.right{left:auto!important;right:1%!important;transform:scaleX(-1) scale(1.12)!important} main>section>.cloud-gate .cloud-0{top:-2%!important}main>section>.cloud-gate .cloud-1{top:24%!important}main>section>.cloud-gate .cloud-2{top:50%!important}main>section>.cloud-gate .cloud-3{top:76%!important} main>section>.cloud-gate i::after{right:0!important;top:31%!important;width:8%!important;height:18%!important;background:#f8fbfc!important;box-shadow:-2.8vw 5vh 0 #dfe6e9,1.2vw 10vh 0 #fff,-1vw 15vh 0 #bcc6cb!important} main>section.cloud-open>.cloud-gate i.left{transform:translate3d(-112vw,-5vh,0) scale(1.34)!important;opacity:0!important}main>section.cloud-open>.cloud-gate i.right{transform:translate3d(112vw,5vh,0) scaleX(-1) scale(1.34)!important;opacity:0!important} @media(max-width:760px){main>section>.cloud-gate i{width:61vw!important;height:20vh!important;min-height:104px!important;left:-5%!important;filter:drop-shadow(0 5px 0 #9da8ae) drop-shadow(0 10px 0 #6f7c83aa)!important}main>section>.cloud-gate i.right{left:auto!important;right:-5%!important}} /* v80: ground the transparent D3MID character after background removal. */ .artist{align-items:end;isolation:isolate}.artist::after{content:"";position:absolute;z-index:0;right:-1%;bottom:clamp(34px,5vw,72px);width:42%;height:7%;border-radius:50%;background:radial-gradient(ellipse at center,#000d 0 22%,#0009 45%,transparent 74%);filter:blur(8px);transform:scaleY(.48)}.artist .avatar{z-index:2;margin-bottom:-38px;filter:drop-shadow(0 20px 18px #000b) drop-shadow(0 0 22px #5fa94038)} @media(max-width:760px){.artist .avatar{margin-bottom:-18px}.artist::after{right:18%;bottom:42px;width:64%;height:6%}} /* v81: D3MID stands on a lit stage instead of floating in empty space. */ .artist{overflow:hidden;background:radial-gradient(ellipse at 79% 92%,#d87b1726 0 18%,transparent 43%),linear-gradient(180deg,#080908,#030303)}.artist::before{content:"";position:absolute;z-index:0;inset:-8% -5% 0 43%;width:auto;height:auto;aspect-ratio:auto;border-radius:0;background:conic-gradient(from 157deg at 24% 0,#ffd99200 0deg,#ffd99238 10deg,#fff2c56b 18deg,#ffd99225 27deg,#ffd99200 39deg),conic-gradient(from 193deg at 78% 0,#fff1c600 0deg,#fff1c64f 12deg,#ffd27475 20deg,#ffd27424 29deg,#ffd27400 41deg);filter:blur(10px);opacity:.9}.artist::after{content:"";position:absolute;z-index:1;right:-2%;bottom:clamp(22px,3.2vw,48px);width:45%;height:11%;border-radius:0;clip-path:polygon(8% 0,92% 0,100% 45%,94% 100%,6% 100%,0 45%);background:linear-gradient(#47443d 0 14%,#161718 15% 54%,#050606 55%),repeating-linear-gradient(90deg,transparent 0 12%,#df9a281f 12% 13%);box-shadow:0 18px 34px #000,0 -5px 22px #e59a3233;filter:none;transform:none}.artist .avatar{z-index:2;margin-bottom:clamp(28px,4.8vw,68px);filter:drop-shadow(0 21px 13px #000c) drop-shadow(0 0 22px #efaa4242)}.artist-copy{position:relative;z-index:3} @media(max-width:760px){.artist::before{inset:35% -20% 0 -20%}.artist::after{right:9%;bottom:24px;width:82%;height:8%}.artist .avatar{margin-bottom:44px}} .mine-status[hidden]{display:none!important} /* v83: visible tool variants, no cursor box, and a breakable game headline. */ .pickaxe{width:86px;height:86px;background:none!important;border:0!important;outline:0!important;box-shadow:none!important} .pickaxe::before,.pickaxe::after{content:none!important;display:none!important} .pickaxe svg{width:86px;height:86px;overflow:visible;background:none!important} .pick-variant{display:none}.pickaxe.skin-wood .pick-wood,.pickaxe.skin-stone .pick-stone,.pickaxe.skin-iron .pick-iron,.pickaxe.skin-gold .pick-gold,.pickaxe.skin-diamond .pick-diamond{display:block} .pick-handle-shadow{fill:#321b0d}.pick-handle-main{fill:#8b552a}.pick-handle-light{fill:#c48645} .pick-wood .head-edge{fill:#38200d}.pick-wood .head-main{fill:#9b5b25}.pick-wood .head-detail{fill:#d48b40} .pick-stone .head-edge{fill:#292d2d}.pick-stone .head-main{fill:#7d8582}.pick-stone .head-detail{fill:#b9c0bd} .pick-iron .head-edge{fill:#424b4d}.pick-iron .head-main{fill:#c8d1d2}.pick-iron .head-detail{fill:#f4ffff} .pick-gold .head-edge{fill:#80540a}.pick-gold .head-main{fill:#edb51f}.pick-gold .head-detail{fill:#fff19a} .pick-diamond .head-edge{fill:#116274}.pick-diamond .head-main{fill:#52dce7}.pick-diamond .head-detail{fill:#d3ffff} .pickaxe.skin-stone .pick-handle-main{fill:#755032}.pickaxe.skin-iron .pick-handle-main{fill:#6f4a2b}.pickaxe.skin-gold .pick-handle-main{fill:#9a602b}.pickaxe.skin-diamond .pick-handle-main{fill:#6f4828} .pickaxe.skin-gold svg{filter:drop-shadow(0 0 7px #f4c642aa) drop-shadow(0 5px 3px #0009)}.pickaxe.skin-diamond svg{filter:drop-shadow(0 0 8px #74edffb8) drop-shadow(0 5px 3px #0009)} .night-title{position:relative;isolation:isolate}.night-title.mine-material-wood.mine-broken{animation:headline-break-v83 .72s cubic-bezier(.28,.04,.82,.22) forwards!important}@keyframes headline-break-v83{18%{transform:translate(-5px,2px) rotate(-1deg)}45%{transform:translate(5px,8px) rotate(2deg);letter-spacing:-.07em}100%{transform:translate(22px,65vh) rotate(11deg) scale(.7);filter:blur(2px);opacity:0}} /* v84: music modal and social subscriptions. */ .modal-open{overflow:hidden}.music-modal{width:min(940px,calc(100vw - 32px));max-height:min(760px,calc(100dvh - 32px));padding:0;border:1px solid #63513d;border-radius:18px;background:#090a09;color:#f5f2eb;box-shadow:0 35px 130px #000;overflow:auto}.music-modal::backdrop{background:#020202dc;backdrop-filter:blur(8px)}.music-modal[open]{display:grid;grid-template-columns:minmax(250px,38%) 1fr;animation:modal-in-v84 .24s ease-out}.music-modal-close{position:fixed;z-index:3;top:max(24px,calc((100dvh - min(760px,calc(100dvh - 32px)))/2 + 14px));right:max(24px,calc((100vw - min(940px,calc(100vw - 32px)))/2 + 14px));display:grid;place-items:center;width:44px;height:44px;padding:0;border:1px solid #776a59;border-radius:50%;background:#090909dd;color:#fff;font-size:30px;line-height:1;cursor:pointer}.music-modal-cover{min-height:100%;background:#111}.music-modal-cover img{display:block;width:100%;height:100%;object-fit:cover}.music-modal-content{padding:clamp(30px,5vw,64px)}.music-modal-content h2{font-size:clamp(40px,6vw,72px)}.music-modal-player{min-height:160px;margin:24px 0 0;border-radius:12px;overflow:hidden;background:#151515}.music-modal-player iframe{display:block;width:100%;height:170px;border:0}.subscribe-links{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:25px}.subscribe-links>a,.subscribe-links>span{display:grid;grid-template-columns:44px 1fr;align-items:center;gap:10px;min-height:58px;padding:8px 12px;border:1px solid #343434;background:#0c0d0c;text-decoration:none}.subscribe-links b{display:grid;place-items:center;width:40px;height:40px;background:#252525;color:#fff;font-size:13px}.subscribe-links span span,.subscribe-links a span{color:#c6c5c0;font-size:12px}.social-vk b{background:#267bea}.social-youtube b{background:#e21b20}.subscribe-links .social-pending{opacity:.42;cursor:not-allowed}@keyframes modal-in-v84{from{opacity:0;transform:translateY(18px) scale(.98)}to{opacity:1;transform:none}} @media(max-width:680px){.music-modal{width:100%;max-width:none;max-height:91dvh;margin:auto 0 0;border-radius:18px 18px 0 0}.music-modal[open]{grid-template-columns:1fr}.music-modal-cover{display:none}.music-modal-content{padding:34px 18px 24px}.music-modal-close{position:sticky;float:right;top:10px;margin:10px 10px -54px auto}.music-modal-player iframe{height:190px}.subscribe-links{grid-template-columns:1fr}} /* v85: true block-built clouds and compact standard social icons. */ main>section>.cloud-gate i{width:54vw!important;height:22vh!important;max-height:220px!important;min-height:124px!important;left:-2vw!important;border-radius:0!important;clip-path:none!important;box-shadow:none!important;background:linear-gradient(#f8fbfc 0 0) 0 48%/26% 34% no-repeat,linear-gradient(#edf3f5 0 0) 17% 24%/31% 59% no-repeat,linear-gradient(#fff 0 0) 43% 8%/29% 76% no-repeat,linear-gradient(#e8eff2 0 0) 67% 29%/23% 55% no-repeat,linear-gradient(#f9fcfd 0 0) 84% 48%/16% 35% no-repeat,linear-gradient(#c4d0d5 0 0) 8% 82%/84% 18% no-repeat!important;filter:drop-shadow(0 8px 0 #96a7af) drop-shadow(0 15px 0 #63768088)!important;overflow:visible!important} main>section>.cloud-gate i.right{left:auto!important;right:-2vw!important} main>section>.cloud-gate i::before{content:""!important;position:absolute!important;left:27%!important;top:15%!important;width:18%!important;height:19%!important;background:#fff!important;box-shadow:13vw 7vh 0 #dce7eb,-9vw 9vh 0 #eef5f7!important;opacity:1!important;transform:none!important} main>section>.cloud-gate i::after{content:""!important;position:absolute!important;right:18%!important;top:65%!important;width:12%!important;height:17%!important;background:#d5e0e5!important;box-shadow:-21vw 1vh 0 #edf4f6!important;opacity:1!important;transform:none!important;transition:none!important} main>section.cloud-open>.cloud-gate i.left::after,main>section.cloud-open>.cloud-gate i.right::after{transform:none!important;opacity:1!important} main>section>.cloud-gate .cloud-0{top:-3%!important}main>section>.cloud-gate .cloud-1{top:23%!important}main>section>.cloud-gate .cloud-2{top:49%!important}main>section>.cloud-gate .cloud-3{top:75%!important} .subscribe-label{margin:28px 0 10px!important;color:#8f918d!important;font-size:10px!important;font-weight:900;letter-spacing:.24em}.subscribe-links{display:flex!important;grid-template-columns:none!important;gap:10px;margin:0}.subscribe-links>a,.subscribe-links>span{display:grid!important;place-items:center;width:48px;height:48px;min-height:0;padding:0;border:1px solid #3b3e3d;border-radius:50%;background:#111;text-decoration:none;transition:transform .18s,filter .18s,border-color .18s}.subscribe-links svg{display:block;width:25px;height:25px;fill:#fff}.subscribe-links>a:hover{transform:translateY(-4px) scale(1.06);filter:brightness(1.15);border-color:#fff}.subscribe-links .social-vk{background:#2787f5;border-color:#2787f5}.subscribe-links .social-youtube{background:#f00;border-color:#f00}.subscribe-links .social-instagram{background:radial-gradient(circle at 68% 70%,#ffda55 0 15%,#ff4b55 34%,#c02cb3 61%,#5146d8)}.subscribe-links .social-telegram{background:#27a7e7}.subscribe-links .social-pending{opacity:.48;cursor:not-allowed} @media(max-width:760px){main>section>.cloud-gate i{width:66vw!important;height:19vh!important;min-height:110px!important;left:-9vw!important}main>section>.cloud-gate i.right{left:auto!important;right:-9vw!important}.subscribe-links{grid-template-columns:none!important}} /* v86: clean spotlight portrait with a real contact shadow, no platform. */ .artist{align-items:end;background:radial-gradient(ellipse at 79% 80%,#d98a2424 0 19%,transparent 44%),linear-gradient(180deg,#090a09,#030303)!important} .artist::before{content:""!important;position:absolute!important;z-index:0!important;inset:-7% -4% 0 42%!important;width:auto!important;height:auto!important;border-radius:0!important;background:conic-gradient(from 158deg at 25% 0,#ffe3ad00 0deg,#ffe3ad33 10deg,#fff1c16b 18deg,#ffe3ad20 27deg,#ffe3ad00 39deg),conic-gradient(from 194deg at 78% 0,#fff2ce00 0deg,#fff2ce3d 11deg,#ffd48768 20deg,#ffd48720 29deg,#ffd48700 41deg)!important;filter:blur(11px)!important;opacity:.88!important} .artist::after{content:""!important;position:absolute!important;z-index:1!important;right:4%!important;bottom:clamp(24px,3.8vw,52px)!important;width:36%!important;height:5.5%!important;border-radius:50%!important;clip-path:none!important;background:radial-gradient(ellipse at center,#000f 0 23%,#000b 42%,#0005 62%,transparent 76%)!important;box-shadow:none!important;filter:blur(6px)!important;transform:scaleY(.45)!important} .artist .avatar{position:relative!important;z-index:2!important;margin-bottom:clamp(20px,3.7vw,52px)!important;filter:drop-shadow(0 17px 10px #000c) drop-shadow(0 0 21px #efaa4238)!important} @media(max-width:760px){.artist::before{inset:35% -18% 0 -18%!important}.artist::after{right:17%!important;bottom:29px!important;width:66%!important;height:4.5%!important}.artist .avatar{margin-bottom:38px!important}} /* v87: a quiet tool-switch hint and a short recoil after every hit. */ .pick-readout small{display:flex;align-items:center;gap:4px;color:#858f91;font-size:7px;font-style:normal;font-weight:800;letter-spacing:.05em;text-transform:uppercase}.pick-readout kbd{padding:1px 4px;border:1px solid #657174;border-bottom-width:2px;border-radius:3px;background:#1d2325;color:#d8f7fb;font:inherit}.pickaxe.swing .pickaxe-tool{animation:pickaxe-hit-v87 .23s cubic-bezier(.25,.7,.35,1)!important}@keyframes pickaxe-hit-v87{0%{transform:rotate(-3deg) translate(0)}43%{transform:rotate(23deg) translate(3px,2px)}68%{transform:rotate(-9deg) translate(-2px,-2px)}100%{transform:rotate(-3deg) translate(0)}} /* v88: stable music modal, platform choices and beveled social cubes. */ .music-modal{position:fixed!important;inset:0!important;margin:auto!important;width:min(920px,calc(100vw - 36px))!important;max-height:min(650px,calc(100dvh - 36px))!important;overflow:hidden!important}.music-modal[open]{display:grid!important;grid-template-columns:minmax(260px,40%) 1fr!important}.music-modal-close{position:absolute!important;top:14px!important;right:14px!important;margin:0!important}.music-modal-cover{position:relative;display:grid;place-items:end center;min-height:0!important;overflow:hidden;background:radial-gradient(circle at 50% 35%,#f4b44d31,transparent 43%),linear-gradient(180deg,#171a17,#050605)!important}.music-modal-cover::before{content:"";position:absolute;inset:-20% -25% 0;background:conic-gradient(from 164deg at 30% 0,#ffe6ae00,#ffe6ae55,#ffe6ae00 34deg),conic-gradient(from 194deg at 75% 0,#ffda8a00,#ffda8a44,#ffda8a00 35deg);filter:blur(9px)}.music-modal-cover::after{content:"";position:absolute;left:18%;right:18%;bottom:4%;height:7%;border-radius:50%;background:radial-gradient(ellipse,#000f 0 28%,#0008 52%,transparent 73%);filter:blur(5px);transform:scaleY(.45)}.music-modal-cover img{position:relative;z-index:1;width:96%!important;height:92%!important;object-fit:contain!important;object-position:center bottom!important;filter:drop-shadow(0 16px 11px #000c)}.music-modal-content{overflow:auto;padding:clamp(34px,5vw,62px)!important}.music-modal-lead{margin:24px 0 12px;color:#a8aaa5}.music-platform-grid{display:grid;gap:10px}.music-platform-grid a{display:grid;grid-template-columns:48px 1fr;align-items:center;gap:12px;min-height:62px;padding:8px 14px;border:1px solid #3f403d;border-radius:10px;background:linear-gradient(#1b1d1c,#0e0f0e);color:#fff;text-decoration:none;box-shadow:inset 0 1px #ffffff1f,0 5px 0 #020202,0 10px 24px #0008;transition:transform .15s,filter .15s}.music-platform-grid a:hover{transform:translateY(-3px);filter:brightness(1.18)}.music-platform-grid b{display:grid;place-items:center;width:44px;height:44px;border-radius:9px;color:#fff;box-shadow:inset 0 2px #ffffff42,inset 0 -3px #0003}.music-platform-grid span{font-weight:900}.music-vk b{background:#2787f5}.music-yandex b{background:#ffcc00;color:#161616}.music-apple b{background:#e8e8e8;color:#111}.subscribe-links>a,.subscribe-links>span{position:relative;width:49px!important;height:49px!important;border-radius:9px!important;box-shadow:inset 0 2px #ffffff4d,inset 0 -4px #0003,0 4px 0 #050505,0 8px 15px #0008!important}.subscribe-links>a:hover{transform:translateY(-3px) scale(1.04)!important;box-shadow:inset 0 2px #ffffff55,inset 0 -3px #0003,0 2px 0 #050505,0 6px 12px #0008!important}.subscribe-links .social-group{background:#176fce!important}.social-group small{position:absolute;right:2px;bottom:0;display:grid;place-items:center;width:16px;height:16px;border-radius:4px;background:#fff;color:#176fce;font-size:12px;font-weight:1000}.watch-platforms{position:relative;z-index:3;display:flex;gap:7px;flex-wrap:wrap;margin-top:18px}.watch-platforms a{min-height:36px;padding:8px 12px;border:1px solid #ffffff38;border-radius:7px;background:#080909d9;color:#fff;font-size:11px;font-weight:900;text-decoration:none;box-shadow:inset 0 1px #fff2,0 3px 0 #000}.watch-platforms a:hover{transform:translateY(-2px);filter:brightness(1.2)}.watch-platforms .watch-vk{background:#176fce}.watch-platforms .watch-youtube{background:#be1118}.watch-platforms .watch-rutube{background:#161616;border-color:#e6313f}.card-copy{position:relative;z-index:2;display:flex;flex-direction:column}.card-copy strong{display:block} @media(max-width:680px){.music-modal{inset:auto 0 0!important;margin:auto 0 0!important;width:100%!important;max-height:92dvh!important;border-radius:18px 18px 0 0!important;overflow:auto!important}.music-modal[open]{display:block!important}.music-modal-cover{height:250px}.music-modal-cover img{width:72%!important;height:100%!important}.music-modal-content{padding:30px 18px 24px!important}.music-modal-close{position:absolute!important;top:10px!important;right:10px!important}.music-platform-grid a{min-height:56px}.watch-platforms{gap:5px}.watch-platforms a{flex:1;padding:7px 5px;text-align:center}} /* v76: exact first cloud curtain restored from the earliest saved build. */ main>section>.cloud-gate{position:absolute!important;z-index:12!important;inset:-5vw -12vw!important;width:auto!important;height:auto!important;min-height:0!important;overflow:hidden!important;pointer-events:none!important;perspective:700px!important;visibility:hidden!important;opacity:0!important;background:none!important;transition:opacity .12s!important} main>section.cloud-current>.cloud-gate{visibility:visible!important;opacity:1!important} /* v128 FINAL CASCADE: only the generated RGBA cloud banks survive here. */ main>section>.cloud-gate .voxel-curtain.front, main>section>.cloud-gate .voxel-curtain.back{display:none!important} main>section>.cloud-gate .voxel-curtain.near, main>section>.cloud-gate .voxel-curtain.mid, main>section>.cloud-gate .voxel-curtain.far{display:block!important;inset:0!important} main>section>.cloud-gate .voxel-panel{ width:110vw!important;height:min(62vw,72svh)!important;min-height:220px!important;max-height:none!important; bottom:auto!important;right:auto!important;overflow:visible!important; clip-path:none!important;-webkit-mask:none!important;mask:none!important; background:transparent url('/cloud-voxel-v1.png?v=1') center/contain no-repeat!important; box-shadow:none!important;filter:drop-shadow(0 18px 20px #17313c38)!important; } main>section>.cloud-gate .voxel-panel.right{display:none!important} main>section>.cloud-gate .voxel-panel::before, main>section>.cloud-gate .voxel-panel::after{display:none!important;content:none!important;box-shadow:none!important} main>section>.cloud-gate .voxel-curtain.near .voxel-panel.left{ top:-2svh!important;left:50%!important;opacity:var(--cloud-near-opacity,1)!important; transform:translate3d(-50%,0,var(--cloud-near-z,35px)) scale(var(--cloud-near-scale,.74))!important } main>section>.cloud-gate .voxel-curtain.mid .voxel-panel.left{ top:25svh!important;left:50%!important;opacity:var(--cloud-mid-opacity,1)!important; transform:translate3d(-50%,0,var(--cloud-mid-z,-85px)) scale(var(--cloud-mid-scale,.62))!important } main>section>.cloud-gate .voxel-curtain.far .voxel-panel.left{ top:52svh!important;left:50%!important;opacity:var(--cloud-far-opacity,1)!important; transform:translate3d(-50%,0,var(--cloud-far-z,-205px)) scale(var(--cloud-far-scale,.52))!important } @media(max-width:760px){main>section>.cloud-gate .voxel-panel{width:126vw!important;height:70vw!important;min-height:150px!important}} /* Symmetric 35px voxel arrow replaces the thin typographic scroll mark. */ .scroll{ width:35px!important;height:35px!important;font-size:0!important; background:center/35px 35px no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='35' height='35' viewBox='0 0 35 35' shape-rendering='crispEdges'%3E%3Cpath fill='%23090908' d='M10 0h15v15h10v10h-5v5h-5v5H10v-5H5v-5H0V15h10z'/%3E%3Cpath fill='%23f3e4bd' d='M15 5h5v15h5v5h-5v5h-5v-5h-5v-5h5z'/%3E%3Cpath fill='%23fff8df' d='M15 5h3v15h-5v3h2z'/%3E%3C/svg%3E")!important; image-rendering:pixelated;filter:drop-shadow(0 4px 0 #0008) drop-shadow(0 0 7px #f2c37255) } /* v118: generated top-view voxel clouds with real alpha and open passages. */ main>section>.cloud-gate .voxel-panel{ width:110vw!important;height:min(62vw,72svh)!important;min-height:220px!important;max-height:none!important; clip-path:none!important;-webkit-mask-image:none!important;mask-image:none!important; overflow:visible!important;background-color:transparent!important; background-image:url('/cloud-voxel-v1.png')!important;background-repeat:no-repeat!important; background-size:contain!important;background-position:center!important; filter:drop-shadow(0 18px 20px #17313c38)!important; } main>section>.cloud-gate .voxel-panel.right{display:none!important} main>section>.cloud-gate .voxel-panel::before,main>section>.cloud-gate .voxel-panel::after{display:none!important;content:none!important} main>section>.cloud-gate .voxel-curtain.front,main>section>.cloud-gate .voxel-curtain.back{display:none!important} main>section>.cloud-gate .voxel-curtain.near .voxel-panel.left{top:-2svh!important;left:50%!important;transform:translate3d(-50%,0,var(--cloud-near-z,35px)) scale(var(--cloud-near-scale,.74))!important} main>section>.cloud-gate .voxel-curtain.mid .voxel-panel.left{top:25svh!important;left:50%!important;transform:translate3d(-50%,0,var(--cloud-mid-z,-85px)) scale(var(--cloud-mid-scale,.62))!important} main>section>.cloud-gate .voxel-curtain.far .voxel-panel.left{top:52svh!important;left:50%!important;transform:translate3d(-50%,0,var(--cloud-far-z,-205px)) scale(var(--cloud-far-scale,.52))!important} @media(max-width:760px){main>section>.cloud-gate .voxel-panel{width:126vw!important;height:70vw!important;min-height:150px!important}} /* v127: each chapter travels as one composition instead of split columns. */ .release,.game-section,.artist{display:block!important} .chapter-content{position:relative;width:100%;min-width:0} .release>.chapter-content{display:grid;grid-template-columns:minmax(280px,44%) 1fr;gap:clamp(32px,7vw,100px);align-items:center} .game-section>.chapter-content{display:grid;grid-template-columns:1.35fr .65fr;align-items:center;gap:clamp(25px,6vw,90px)} .artist>.chapter-content{display:grid;grid-template-columns:1fr minmax(240px,38%);align-items:center;min-height:calc(90vh - clamp(140px,20vw,300px))} @media(max-width:760px){.release>.chapter-content,.game-section>.chapter-content,.artist>.chapter-content{grid-template-columns:1fr}.artist>.chapter-content{min-height:0}} main>section>.cloud-gate i{--side:-1;position:absolute!important;left:8%!important;right:auto!important;width:42vw!important;height:18vw!important;max-height:230px!important;min-height:110px!important;border-radius:0!important;background:#d9ebf3!important;background-image:none!important;background-size:auto!important;box-shadow:8vw 2vw 0 #e8f4f8,15vw -2vw 0 #bfd8e5,-7vw 5vw 0 #eef7fa!important;clip-path:polygon(0 28%,14% 28%,14% 9%,39% 9%,39% 0,65% 0,65% 18%,86% 18%,86% 37%,100% 37%,100% 100%,0 100%)!important;opacity:.97!important;transform:translate3d(0,0,0) scale(1.25)!important;transition:transform 1.55s cubic-bezier(.2,.78,.2,1),opacity 1.05s!important;transition-delay:var(--delay)!important} main>section>.cloud-gate i.right{--side:1;left:auto!important;right:7%!important;transform:scaleX(-1) scale(1.25)!important} main>section>.cloud-gate .cloud-0{top:2%!important}main>section>.cloud-gate .cloud-1{top:25%!important}main>section>.cloud-gate .cloud-2{top:48%!important}main>section>.cloud-gate .cloud-3{top:70%!important} main>section.cloud-open>.cloud-gate i.left{transform:translate3d(-115vw,-8vh,120px) scale(1.8)!important;opacity:0!important}main>section.cloud-open>.cloud-gate i.right{transform:translate3d(115vw,8vh,120px) scaleX(-1) scale(1.8)!important;opacity:0!important} @media(max-width:760px){main>section>.cloud-gate{inset:-5vw -12vw!important}main>section>.cloud-gate i:nth-child(n+5){display:none!important}main>section>.cloud-gate i{width:64vw!important;height:28vw!important;min-height:90px!important;left:8%!important;box-shadow:12vw 3vw 0 #e8f4f8,22vw -3vw 0 #bfd8e5,-10vw 7vw 0 #eef7fa!important}main>section>.cloud-gate i.right{left:auto!important;right:7%!important}} /* v77: preserve the first clouds, but tear their inner seam while opening. */ main>section>.cloud-gate i{overflow:visible!important;clip-path:polygon(0 28%,14% 28%,14% 9%,39% 9%,39% 0,65% 0,65% 18%,86% 18%,86% 34%,100% 39%,92% 47%,100% 55%,89% 64%,100% 72%,93% 81%,100% 91%,96% 100%,0 100%)!important} main>section>.cloud-gate i::after{content:"";position:absolute;z-index:2;right:1%;top:42%;width:7%;height:9%;background:#eef7fa;box-shadow:-3vw 4.5vw 0 #bfd8e5,1.5vw 8.5vw 0 #e8f4f8,-1vw 13vw 0 #d9ebf3;opacity:.95;transition:transform .72s cubic-bezier(.15,.7,.25,1),opacity .48s;transition-delay:calc(var(--delay) + .08s)} main>section>.cloud-gate i.right::after{right:1%} main>section.cloud-open>.cloud-gate i.left::after{transform:translate3d(-22vw,-5vh,0) rotate(-24deg) scale(.55);opacity:0}main>section.cloud-open>.cloud-gate i.right::after{transform:translate3d(-22vw,5vh,0) rotate(24deg) scale(.55);opacity:0} /* v89: one cloud style only — square Minecraft shutters with 90-degree stepped seams. */ main>section>.cloud-gate i{ width:72vw!important; height:31%!important; min-height:150px!important; max-height:none!important; left:-11vw!important; width:58vw!important; height:24vh!important; min-height:132px!important; max-height:250px!important; left:-7vw!important; overflow:hidden!important; border:0!important; border-radius:0!important; -webkit-mask:none!important; mask:none!important; clip-path:polygon( 0 0,86% 0, 86% 13%,94% 13%, 94% 28%,100% 28%, 100% 43%,91% 43%, 91% 58%,97% 58%, 97% 73%,88% 73%, 88% 87%,96% 87%, 96% 100%,0 100% )!important; background-color:#dcebf1!important; background-image: linear-gradient(90deg,#7896a333 2px,transparent 2px), linear-gradient(#7896a333 2px,transparent 2px), linear-gradient(135deg,#ffffffb8 0 38%,#e4f0f4 39% 58%,#b6ced8 59% 78%,#d4e5eb 79% 100%)!important; background-size:46px 46px,46px 46px,92px 92px!important; box-shadow:none!important; filter:drop-shadow(0 9px 0 #91a5ae) drop-shadow(0 16px 0 #53697370)!important; } main>section>.cloud-gate i.right{ left:auto!important; right:-7vw!important; } main>section>.cloud-gate i::before, main>section>.cloud-gate i::after{ content:none!important; display:none!important; } main>section>.cloud-gate .cloud-0{top:-5%!important} main>section>.cloud-gate .cloud-1{top:21%!important} main>section>.cloud-gate .cloud-2{top:47%!important} main>section>.cloud-gate .cloud-3{top:73%!important} @media(max-width:760px){ main>section>.cloud-gate i{ width:68vw!important; height:25vh!important; min-height:118px!important; left:-15vw!important; background-size:34px 34px,34px 34px,68px 68px!important; } main>section>.cloud-gate i.right{left:auto!important;right:-15vw!important} } /* v89: the modal character stands just above the contact shadow. */ .music-modal-cover::after{ bottom:-1%!important; left:15%!important; right:15%!important; height:8%!important; } .music-modal-cover img{transform:translateY(-2.5%)!important} /* v90: one clip-platform switch, stronger subscribe calls and a grounded artist. */ .clip-platform-switch{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end;margin-bottom:8px} .clip-platform-switch button{min-height:44px;padding:10px 16px;border:1px solid #514b42;border-radius:8px;background:#0c0d0c;color:#a7a7a2;font:900 11px/1 system-ui;letter-spacing:.08em;cursor:pointer;box-shadow:inset 0 1px #ffffff18,0 4px 0 #030303;transition:transform .16s,color .16s,border-color .16s,background .16s} .clip-platform-switch button:hover{transform:translateY(-2px);color:#fff} .clip-platform-switch button.active{border-color:#ffc369;background:#32200d;color:#ffc369;box-shadow:inset 0 1px #fff2,0 4px 0 #130b03,0 0 25px #ffad3528} .clip-card{color:#fff}.clip-destination{position:relative;z-index:2;display:block;margin-top:16px;color:#fff!important;font-size:12px;font-weight:900;letter-spacing:.08em!important} .subscribe-label{display:flex!important;align-items:center;gap:9px;margin:32px 0 15px!important;color:#d9b66b!important;font-size:13px!important;letter-spacing:.18em!important} .subscribe-links{gap:15px!important} .subscribe-links>a,.subscribe-links>span{width:58px!important;height:58px!important;border-radius:12px!important} .subscribe-links svg{width:29px!important;height:29px!important} .hero-subscribe{position:relative;z-index:3;display:flex;flex-direction:column;align-items:center;margin-top:20px} .hero-subscribe .subscribe-label{margin:0 0 13px!important;color:#f0d49a!important} .hero-subscribe .subscribe-links{justify-content:center} .subscribe-links>a{animation:subscribe-nudge-v90 6s ease-in-out infinite} .subscribe-links>a:nth-child(2){animation-delay:1s}.subscribe-links>a:nth-child(3){animation-delay:2s}.subscribe-links>a:nth-child(4){animation-delay:3s}.subscribe-links>a:nth-child(5){animation-delay:4s} @keyframes subscribe-nudge-v90{0%,7%,100%{transform:translateY(0);filter:brightness(1)}3%{transform:translateY(-7px) scale(1.06);filter:brightness(1.22)}} .artist{min-height:74vh!important;padding-top:clamp(70px,7vw,105px)!important;padding-bottom:clamp(70px,7vw,105px)!important} .artist .avatar{transform:none!important} @media(prefers-reduced-motion:reduce){.subscribe-links>a{animation:none!important}} @media(max-width:760px){.section-title{align-items:flex-start;flex-direction:column}.clip-platform-switch{justify-content:flex-start}.clip-platform-switch button{padding:9px 12px}.subscribe-links{gap:12px!important}.subscribe-links>a,.subscribe-links>span{width:54px!important;height:54px!important}.hero-subscribe{margin-top:16px}.artist{min-height:0!important}} /* v90: Minecraft cloud slabs — varied rectangular voxels and only right-angle edges. */ main>section>.cloud-gate i{ clip-path:polygon( 0 18%,12% 18%,12% 8%,29% 8%,29% 0,51% 0,51% 7%,70% 7%,70% 2%,86% 2%, 86% 13%,94% 13%,94% 28%,100% 28%,100% 43%,91% 43%,91% 58%,97% 58%, 97% 73%,88% 73%,88% 87%,96% 87%,96% 94%,79% 94%,79% 100%,56% 100%, 56% 95%,34% 95%,34% 100%,13% 100%,13% 91%,0 91% )!important; background-color:#dbe9ee!important; background-image: linear-gradient(#ffffff 0 0), linear-gradient(#edf5f7 0 0), linear-gradient(#c4d7de 0 0), linear-gradient(#f8fcfd 0 0), linear-gradient(#afc6cf 0 0), linear-gradient(#e7f1f4 0 0), linear-gradient(180deg,#ffffff 0 15%,#e6f0f3 16% 70%,#b1c6ce 71% 86%,#8fa8b2 87% 100%)!important; background-repeat:no-repeat!important; background-position:8% 24%,28% 42%,51% 22%,69% 46%,84% 65%,16% 70%,0 0!important; background-size:17% 25%,24% 29%,19% 33%,13% 22%,16% 23%,21% 18%,100% 100%!important; filter:drop-shadow(0 7px 0 #8298a1) drop-shadow(0 14px 0 #4158636b)!important; } main>section>.cloud-gate .cloud-1, main>section>.cloud-gate .cloud-3{background-position:15% 30%,37% 16%,56% 50%,72% 25%,87% 58%,24% 73%,0 0!important} main>section>.cloud-gate i.right{left:auto!important;right:-11vw!important} main>section>.cloud-gate .cloud-0{top:-5%!important} main>section>.cloud-gate .cloud-1{top:21%!important} main>section>.cloud-gate .cloud-2{top:47%!important} main>section>.cloud-gate .cloud-3{top:73%!important} @media(max-width:760px){ main>section>.cloud-gate i{width:86vw!important;height:31%!important;min-height:125px!important;left:-21vw!important;background-position:8% 24%,28% 42%,51% 22%,69% 46%,84% 65%,16% 70%,0 0!important;background-size:17% 25%,24% 29%,19% 33%,13% 22%,16% 23%,21% 18%,100% 100%!important} main>section>.cloud-gate i.right{left:auto!important;right:-21vw!important} } /* v91: a slower rear cloud bank adds depth behind the foreground voxel slabs. */ main>section>.cloud-gate .cloud-bank{ position:absolute; z-index:0; top:-4%; bottom:-4%; left:-8%; width:66%; opacity:.94; border:0; clip-path:polygon( 0 5%,17% 5%,17% 0,41% 0,41% 4%,65% 4%,65% 0,86% 0, 86% 11%,95% 11%,95% 26%,100% 26%,100% 43%,93% 43%,93% 60%, 100% 60%,100% 76%,91% 76%,91% 91%,97% 91%,97% 96%,78% 96%, 78% 100%,54% 100%,54% 95%,31% 95%,31% 100%,9% 100%,9% 94%,0 94% ); background-color:#c9dde5; background-image: linear-gradient(#f4fafc 0 0),linear-gradient(#dcebf0 0 0), linear-gradient(#aec8d2 0 0),linear-gradient(#edf6f8 0 0), linear-gradient(180deg,#f7fbfc 0 17%,#d6e6ec 18% 74%,#9db5bf 75% 100%); background-repeat:no-repeat; background-position:9% 17%,32% 39%,58% 18%,76% 57%,0 0; background-size:21% 19%,25% 27%,17% 31%,18% 22%,100% 100%; filter:drop-shadow(0 9px 0 #738b96) drop-shadow(0 18px 18px #102b3755); transform:translate3d(0,0,-70px) scale(1.04); transition:transform 2.15s cubic-bezier(.22,.7,.16,1),opacity 1.65s; transition-delay:.08s; will-change:transform,opacity; } main>section>.cloud-gate .cloud-bank.right{left:auto;right:-8%;transform:translate3d(0,0,-70px) scaleX(-1) scale(1.04)} main>section.cloud-open>.cloud-gate .cloud-bank.left{transform:translate3d(-118vw,-2vh,-70px) scale(1.15);opacity:0} main>section.cloud-open>.cloud-gate .cloud-bank.right{transform:translate3d(118vw,2vh,-70px) scaleX(-1) scale(1.15);opacity:0} main>section>.cloud-gate i{z-index:1!important;transition-duration:1.45s,.95s!important} @media(max-width:760px){main>section>.cloud-gate .cloud-bank{left:-14%;width:72%}main>section>.cloud-gate .cloud-bank.right{left:auto;right:-14%}} /* v92: keep the block-cut top and bottom visible instead of clipping them flat. */ main>section>.cloud-gate i{ display:block!important; height:28%!important; min-height:0!important; } main>section>.cloud-gate .cloud-0{top:0!important} main>section>.cloud-gate .cloud-1{top:24%!important} main>section>.cloud-gate .cloud-2{top:48%!important} main>section>.cloud-gate .cloud-3{top:72%!important} main>section>.cloud-gate .cloud-bank{top:0!important;bottom:0!important} @media(max-width:760px){ main>section>.cloud-gate i:nth-child(n){display:block!important} main>section>.cloud-gate i{height:28%!important;min-height:0!important} } /* v93: contact shadow is anchored to the artist image, not to the section. */ .artist::after{content:none!important;display:none!important} .artist-figure{position:relative;z-index:2;align-self:end;width:100%;margin-bottom:clamp(18px,3vw,42px);isolation:isolate} .artist-figure::after{content:"";position:absolute;z-index:0;left:20%;right:20%;bottom:1.6%;height:5.2%;border-radius:50%;background:radial-gradient(ellipse at center,#000f 0 24%,#000b 45%,#0005 64%,transparent 77%);filter:blur(5px);transform:scaleY(.48);transform-origin:center;pointer-events:none} .artist-figure .avatar{position:relative!important;z-index:1!important;display:block!important;width:100%!important;height:auto!important;margin:0!important;transform:none!important} @media(max-width:760px){.artist-figure{width:min(88vw,520px);margin:0 auto 20px}.artist-figure::after{left:19%;right:19%;bottom:1.4%}} /* v94: pronounced voxel cut-outs on the top, bottom and inner cloud seams. */ main>section>.cloud-gate i{ clip-path:polygon( 0 22%,10% 22%,10% 10%,23% 10%,23% 0,42% 0,42% 14%,57% 14%,57% 5%,74% 5%,74% 18%,86% 18%, 86% 10%,94% 10%,94% 29%,100% 29%,100% 43%,90% 43%,90% 57%,97% 57%,97% 72%, 88% 72%,88% 85%,96% 85%,96% 92%,80% 92%,80% 100%,63% 100%,63% 88%,47% 88%, 47% 97%,30% 97%,30% 86%,13% 86%,13% 100%,0 100% )!important; } main>section>.cloud-gate .cloud-bank{top:6%!important;bottom:6%!important} /* Cloud curtain rebuild: whole voxel doors with carved top, bottom and centre edges. */ main>section>.cloud-gate>.cloud-bank, main>section>.cloud-gate>i{display:none!important} main>section>.cloud-gate .voxel-curtain{position:absolute;inset:0;z-index:2;pointer-events:none;transform-style:preserve-3d} main>section>.cloud-gate .voxel-curtain.back{z-index:1;inset:4.5% 0;opacity:.82;filter:saturate(.78) brightness(.82)} main>section>.cloud-gate .voxel-panel{ position:absolute!important; top:0!important; bottom:0!important; left:0!important; display:block!important; width:56%!important; height:auto!important; min-height:0!important; max-height:none!important; margin:0!important; border:0!important; border-radius:0!important; overflow:hidden!important; clip-path:polygon( 0 19%,10% 19%,10% 8%,24% 8%,24% 0,41% 0,41% 13%,57% 13%,57% 4%,73% 4%,73% 17%,87% 17%, 87% 9%,96% 9%,96% 25%,100% 25%,100% 39%,93% 39%,93% 54%,98% 54%,98% 69%, 92% 69%,92% 84%,100% 84%,100% 91%,88% 91%,88% 97%,73% 97%,73% 100%,56% 100%, 56% 89%,40% 89%,40% 97%,23% 97%,23% 87%,9% 87%,9% 100%,0 100% )!important; background-color:#d6e6ec!important; background-image: linear-gradient(#ffffff 0 0),linear-gradient(#e5f0f4 0 0),linear-gradient(#b6cbd4 0 0), linear-gradient(#f5fafb 0 0),linear-gradient(#a5bdc7 0 0),linear-gradient(#deebf0 0 0), linear-gradient(180deg,#ffffff 0 13%,#e2eef2 14% 69%,#b3c8d0 70% 86%,#829ba6 87% 100%)!important; background-repeat:no-repeat!important; background-position:8% 23%,27% 42%,48% 19%,65% 50%,81% 30%,19% 72%,0 0!important; background-size:17% 22%,22% 27%,16% 31%,17% 21%,14% 28%,24% 16%,100% 100%!important; box-shadow:none!important; filter:drop-shadow(0 10px 0 #718995) drop-shadow(0 20px 22px #16313d55)!important; transform:translate3d(0,0,35px)!important; transition:transform 1.48s cubic-bezier(.2,.72,.16,1),opacity 1.05s!important; will-change:transform,opacity; } main>section>.cloud-gate .voxel-panel.right{left:auto!important;right:0!important;transform:translate3d(0,0,35px) scaleX(-1)!important} main>section>.cloud-gate .voxel-curtain.back .voxel-panel{width:58%!important;background-color:#b9d0d9!important;filter:drop-shadow(0 8px 0 #687f8a) drop-shadow(0 16px 18px #10283244)!important;transform:translate3d(0,0,-55px) scale(.98)!important;transition-duration:2.18s,1.62s!important} main>section>.cloud-gate .voxel-curtain.back .voxel-panel.right{transform:translate3d(0,0,-55px) scaleX(-1) scale(.98)!important} main>section.cloud-open>.cloud-gate .voxel-curtain.front .voxel-panel.left{transform:translate3d(-118vw,-3vh,90px) scale(1.12)!important;opacity:0!important} main>section.cloud-open>.cloud-gate .voxel-curtain.front .voxel-panel.right{transform:translate3d(118vw,3vh,90px) scaleX(-1) scale(1.12)!important;opacity:0!important} main>section.cloud-open>.cloud-gate .voxel-curtain.back .voxel-panel.left{transform:translate3d(-118vw,2vh,-55px) scale(1.07)!important;opacity:0!important} main>section.cloud-open>.cloud-gate .voxel-curtain.back .voxel-panel.right{transform:translate3d(118vw,-2vh,-55px) scaleX(-1) scale(1.07)!important;opacity:0!important} @media(max-width:760px){main>section>.cloud-gate .voxel-panel{width:60%!important}main>section>.cloud-gate .voxel-curtain.back .voxel-panel{width:62%!important}} /* Scroll-through depth: three cloud planes approach at different speeds. */ main>section>.cloud-gate .voxel-curtain.front{z-index:3} main>section>.cloud-gate .voxel-curtain.mid{z-index:2;inset:2.2% 0;opacity:.9;filter:saturate(.88) brightness(.93)} main>section>.cloud-gate .voxel-curtain.back{z-index:1;inset:5% 0;opacity:.75;filter:saturate(.7) brightness(.78)} main>section>.cloud-gate .voxel-curtain.front .voxel-panel{transform:translate3d(0,0,var(--cloud-front-z,-30px)) scale(var(--cloud-front-scale,.86))!important} main>section>.cloud-gate .voxel-curtain.front .voxel-panel.right{transform:translate3d(0,0,var(--cloud-front-z,-30px)) scaleX(-1) scale(var(--cloud-front-scale,.86))!important} main>section>.cloud-gate .voxel-curtain.mid .voxel-panel{width:57%!important;background-color:#c6dae2!important;opacity:.94;filter:drop-shadow(0 8px 0 #778e98) drop-shadow(0 17px 18px #17303a44)!important;transform:translate3d(0,0,var(--cloud-mid-z,-85px)) scale(var(--cloud-mid-scale,.8))!important;transition-duration:1.78s,1.28s!important} main>section>.cloud-gate .voxel-curtain.mid .voxel-panel.right{transform:translate3d(0,0,var(--cloud-mid-z,-85px)) scaleX(-1) scale(var(--cloud-mid-scale,.8))!important} main>section>.cloud-gate .voxel-curtain.back .voxel-panel{transform:translate3d(0,0,var(--cloud-back-z,-145px)) scale(var(--cloud-back-scale,.74))!important} main>section>.cloud-gate .voxel-curtain.back .voxel-panel.right{transform:translate3d(0,0,var(--cloud-back-z,-145px)) scaleX(-1) scale(var(--cloud-back-scale,.74))!important} main>section>.cloud-gate .voxel-panel::before,main>section>.cloud-gate .voxel-panel::after{content:""!important;display:block!important;position:absolute!important;z-index:2!important;width:13%!important;height:8%!important;border-radius:0!important;opacity:.62!important;pointer-events:none!important;transition:transform .08s linear!important} main>section>.cloud-gate .voxel-panel::before{left:31%!important;top:31%!important;background:#ffffff!important;box-shadow:17vw 8vh 0 #bacfd7,-12vw 19vh 0 #edf5f7!important;transform:translate3d(var(--cloud-block-shift,0),var(--cloud-block-shift-y,0),20px)!important} main>section>.cloud-gate .voxel-panel::after{right:24%!important;bottom:24%!important;background:#9eb7c1!important;box-shadow:-18vw -7vh 0 #dce9ee,8vw -18vh 0 #f6fafb!important;transform:translate3d(var(--cloud-block-shift-back,0),var(--cloud-block-shift,0),34px)!important} main>section.cloud-open>.cloud-gate .voxel-curtain.front .voxel-panel.left{transform:translate3d(-118vw,-3vh,110px) scale(1.14)!important;opacity:0!important} main>section.cloud-open>.cloud-gate .voxel-curtain.front .voxel-panel.right{transform:translate3d(118vw,3vh,110px) scaleX(-1) scale(1.14)!important;opacity:0!important} main>section.cloud-open>.cloud-gate .voxel-curtain.mid .voxel-panel.left{transform:translate3d(-118vw,1vh,10px) scale(1.08)!important;opacity:0!important} main>section.cloud-open>.cloud-gate .voxel-curtain.mid .voxel-panel.right{transform:translate3d(118vw,-1vh,10px) scaleX(-1) scale(1.08)!important;opacity:0!important} main>section.cloud-open>.cloud-gate .voxel-curtain.back .voxel-panel.left{transform:translate3d(-118vw,2vh,-70px) scale(1.03)!important;opacity:0!important} main>section.cloud-open>.cloud-gate .voxel-curtain.back .voxel-panel.right{transform:translate3d(118vw,-2vh,-70px) scaleX(-1) scale(1.03)!important;opacity:0!important} /* Cinematic section entrance: the whole slide rises toward the camera on a shallow arc. */ main>section.reveal{ opacity:var(--section-opacity,0)!important; transform:perspective(1300px) translate3d(var(--section-x,0),var(--section-y,148px),var(--section-z,-260px)) rotateX(var(--section-rx,0deg)) rotateZ(var(--section-rz,0deg)) scale(var(--section-scale,.74))!important; transform-origin:50% 100%!important; filter:blur(var(--section-blur,7px)); transition:none!important; will-change:transform,opacity,filter; } main>section.reveal.visible{opacity:var(--section-opacity,0)!important;transform:perspective(1300px) translate3d(var(--section-x,0),var(--section-y,148px),var(--section-z,-260px)) rotateX(var(--section-rx,0deg)) rotateZ(var(--section-rz,0deg)) scale(var(--section-scale,.74))!important} main>section>.cloud-gate .voxel-curtain.front{opacity:.56} main>section>.cloud-gate .voxel-curtain.mid{opacity:.38} main>section>.cloud-gate .voxel-curtain.back{opacity:.24} @media(prefers-reduced-motion:reduce){main>section.reveal,main>section.reveal.visible{opacity:1!important;transform:none!important;filter:none!important}} @media(max-width:760px){main>section.reveal{filter:blur(var(--section-blur,7px))}} /* True scroll sequence: clouds first, section content second. */ main>section.reveal,main>section.reveal.visible{opacity:1!important;transform:none!important;filter:none!important;transition:none!important} main>section.reveal>:not(.cloud-gate){opacity:var(--section-opacity,0)!important;transform:perspective(1300px) translate3d(0,var(--section-y,92px),var(--section-z,-210px)) scale(var(--section-scale,.82))!important;transform-origin:50% 100%!important;filter:blur(var(--section-blur,6px));transition:none!important;will-change:transform,opacity,filter} main>section>.cloud-gate .voxel-panel{transition:none!important} main>section>.cloud-gate .voxel-curtain.front .voxel-panel.left{opacity:var(--cloud-front-opacity,1)!important;transform:translate3d(var(--cloud-front-left,0),-3vh,var(--cloud-front-z,-30px)) scale(var(--cloud-front-scale,.86))!important} main>section>.cloud-gate .voxel-curtain.front .voxel-panel.right{opacity:var(--cloud-front-opacity,1)!important;transform:translate3d(var(--cloud-front-right,0),3vh,var(--cloud-front-z,-30px)) scaleX(-1) scale(var(--cloud-front-scale,.86))!important} main>section>.cloud-gate .voxel-curtain.mid .voxel-panel.left{opacity:var(--cloud-mid-opacity,1)!important;transform:translate3d(var(--cloud-mid-left,0),1vh,var(--cloud-mid-z,-85px)) scale(var(--cloud-mid-scale,.8))!important} main>section>.cloud-gate .voxel-curtain.mid .voxel-panel.right{opacity:var(--cloud-mid-opacity,1)!important;transform:translate3d(var(--cloud-mid-right,0),-1vh,var(--cloud-mid-z,-85px)) scaleX(-1) scale(var(--cloud-mid-scale,.8))!important} main>section>.cloud-gate .voxel-curtain.back .voxel-panel.left{opacity:var(--cloud-back-opacity,1)!important;transform:translate3d(var(--cloud-back-left,0),2vh,var(--cloud-back-z,-145px)) scale(var(--cloud-back-scale,.74))!important} main>section>.cloud-gate .voxel-curtain.back .voxel-panel.right{opacity:var(--cloud-back-opacity,1)!important;transform:translate3d(var(--cloud-back-right,0),-2vh,var(--cloud-back-z,-145px)) scaleX(-1) scale(var(--cloud-back-scale,.74))!important} @media(prefers-reduced-motion:reduce){main>section.reveal>:not(.cloud-gate){opacity:1!important;transform:none!important;filter:none!important}} /* Fly-through cloud pass: layers grow past the lens instead of opening like doors. */ main>section>.cloud-gate{perspective:1050px!important} main>section>.cloud-gate .voxel-curtain.front{opacity:1!important;filter:blur(var(--cloud-front-blur,0))!important} main>section>.cloud-gate .voxel-curtain.mid{opacity:1!important;filter:blur(var(--cloud-mid-blur,0)) saturate(.88) brightness(.93)!important} main>section>.cloud-gate .voxel-curtain.back{opacity:1!important;filter:blur(var(--cloud-back-blur,0)) saturate(.72) brightness(.8)!important} main>section>.cloud-gate .voxel-panel.left{transform-origin:100% 50%!important} main>section>.cloud-gate .voxel-panel.right{transform-origin:0 50%!important} /* Four-sided cloud tunnel: no single bank can dominate the fly-through. */ main>section>.cloud-gate .voxel-panel.top, main>section>.cloud-gate .voxel-panel.bottom{ left:7%!important;right:7%!important;width:86%!important;height:38%!important;min-height:0!important;bottom:auto!important; clip-path:polygon(0 0,100% 0,100% 74%,91% 74%,91% 88%,76% 88%,76% 79%,60% 79%,60% 96%,43% 96%,43% 84%,27% 84%,27% 100%,12% 100%,12% 89%,0 89%)!important; transform-origin:50% 100%!important; } main>section>.cloud-gate .voxel-panel.bottom{top:auto!important;bottom:0!important;transform-origin:50% 0!important} main>section>.cloud-gate .voxel-curtain.front .voxel-panel.left{transform:translate3d(var(--cloud-front-left,0),0,var(--cloud-front-z,-30px)) scale(var(--cloud-front-scale,.86))!important} main>section>.cloud-gate .voxel-curtain.front .voxel-panel.right{transform:translate3d(var(--cloud-front-right,0),0,var(--cloud-front-z,-30px)) scaleX(-1) scale(var(--cloud-front-scale,.86))!important} main>section>.cloud-gate .voxel-curtain.front .voxel-panel.top{opacity:var(--cloud-front-opacity,1)!important;transform:translate3d(0,-2vh,var(--cloud-front-z,-30px)) scale(var(--cloud-front-scale,.86))!important} main>section>.cloud-gate .voxel-curtain.front .voxel-panel.bottom{opacity:var(--cloud-front-opacity,1)!important;transform:translate3d(0,2vh,var(--cloud-front-z,-30px)) scaleY(-1) scale(var(--cloud-front-scale,.86))!important} main>section>.cloud-gate .voxel-curtain.mid .voxel-panel.top{opacity:var(--cloud-mid-opacity,1)!important;transform:translate3d(0,-1vh,var(--cloud-mid-z,-85px)) scale(var(--cloud-mid-scale,.8))!important} main>section>.cloud-gate .voxel-curtain.mid .voxel-panel.bottom{opacity:var(--cloud-mid-opacity,1)!important;transform:translate3d(0,1vh,var(--cloud-mid-z,-85px)) scaleY(-1) scale(var(--cloud-mid-scale,.8))!important} main>section>.cloud-gate .voxel-curtain.back .voxel-panel.top{opacity:var(--cloud-back-opacity,1)!important;transform:translate3d(0,0,var(--cloud-back-z,-145px)) scale(var(--cloud-back-scale,.74))!important} main>section>.cloud-gate .voxel-curtain.back .voxel-panel.bottom{opacity:var(--cloud-back-opacity,1)!important;transform:translate3d(0,0,var(--cloud-back-z,-145px)) scaleY(-1) scale(var(--cloud-back-scale,.74))!important} /* Restored split transition: both cloud halves fly cleanly left and right. */ main>section>.cloud-gate .voxel-panel.left, main>section>.cloud-gate .voxel-panel.right{transform-origin:50% 50%!important} /* Five split planes: the next section becomes visible while clouds still cross it. */ main>section>.cloud-gate .voxel-curtain.near{z-index:5;inset:-3% -2%;opacity:1!important;filter:brightness(1.08)!important} main>section>.cloud-gate .voxel-curtain.front{z-index:4} main>section>.cloud-gate .voxel-curtain.mid{z-index:3} main>section>.cloud-gate .voxel-curtain.back{z-index:2} main>section>.cloud-gate .voxel-curtain.far{z-index:1;inset:7% 0;opacity:1!important;filter:saturate(.62) brightness(.68)!important} main>section>.cloud-gate .voxel-curtain.near .voxel-panel.left{opacity:var(--cloud-near-opacity,1)!important;transform:translate3d(var(--cloud-near-left,0),0,var(--cloud-near-z,35px)) scale(var(--cloud-near-scale,1.08))!important} main>section>.cloud-gate .voxel-curtain.near .voxel-panel.right{opacity:var(--cloud-near-opacity,1)!important;transform:translate3d(var(--cloud-near-right,0),0,var(--cloud-near-z,35px)) scaleX(-1) scale(var(--cloud-near-scale,1.08))!important} main>section>.cloud-gate .voxel-curtain.far .voxel-panel.left{opacity:var(--cloud-far-opacity,1)!important;transform:translate3d(var(--cloud-far-left,0),0,var(--cloud-far-z,-205px)) scale(var(--cloud-far-scale,.84))!important} main>section>.cloud-gate .voxel-curtain.far .voxel-panel.right{opacity:var(--cloud-far-opacity,1)!important;transform:translate3d(var(--cloud-far-right,0),0,var(--cloud-far-z,-205px)) scaleX(-1) scale(var(--cloud-far-scale,.84))!important} /* Compact icon footer. */ footer{min-height:190px!important;display:grid!important;grid-template-columns:auto 1fr;align-items:center!important;gap:clamp(20px,4vw,56px)!important;padding-top:42px!important;padding-bottom:42px!important;background:linear-gradient(180deg,#090a09,#030403)!important;border-top:1px solid #3b3328!important} .footer-brand{display:block}.footer-brand img{display:block;width:clamp(118px,13vw,160px)!important;opacity:.9!important} footer>p{margin:0;color:#777d78;font-size:12px;font-weight:800;letter-spacing:.12em;text-align:right} .footer-icons{display:flex!important;align-items:center;gap:10px!important;margin:0!important} .footer-icon{display:grid;place-items:center;width:46px;height:46px;border:1px solid #ffffff35;border-radius:10px;box-shadow:inset 0 2px #ffffff45,inset 0 -4px #0004,0 4px 0 #000,0 10px 22px #0007;transition:transform .16s,filter .16s,box-shadow .16s} .footer-icon svg{display:block;width:25px;height:25px;fill:#fff} .footer-icon:hover{transform:translateY(-3px);filter:brightness(1.16);box-shadow:inset 0 2px #ffffff55,inset 0 -3px #0004,0 2px 0 #000,0 7px 16px #0008} .footer-vk{background:#2787f5}.footer-youtube{background:#e60012}.footer-instagram{background:radial-gradient(circle at 68% 70%,#ffda55 0 15%,#ff4b55 34%,#c02cb3 61%,#5146d8)}.footer-telegram{background:#27a7e7}.footer-game{background:linear-gradient(145deg,#a92d23,#5a0b08)} @media(max-width:760px){footer{grid-template-columns:1fr!important;justify-items:center!important;text-align:center!important;gap:20px!important}.footer-icons{justify-content:center!important;flex-wrap:wrap}.footer-icon{width:48px;height:48px}} /* Keep the original carved cloud silhouette; lift it without stretching its edges. */ main>section>.cloud-gate{inset:-5vw -12vw!important;transform:translateY(-16vh)} @media(max-width:760px){main>section>.cloud-gate{inset:-5vw -12vw!important;transform:translateY(-12vh)}} /* Direct depth approach: the slide comes toward the viewer and settles. */ main>section.reveal>:not(.cloud-gate){transform:perspective(1300px) translate3d(0,var(--section-y,-30px),var(--section-z,-280px)) scale(var(--section-scale,.78))!important;transform-origin:50% 58%!important} /* Preserve the carved silhouette: no depth plane may be clipped by the gate edge. */ main>section>.cloud-gate .voxel-curtain.near{inset:3% 0!important} main>section>.cloud-gate .voxel-curtain.front{inset:5.5% 0!important} main>section>.cloud-gate .voxel-curtain.mid{inset:8% 0!important} main>section>.cloud-gate .voxel-curtain.back{inset:10.5% 0!important} main>section>.cloud-gate .voxel-curtain.far{inset:13% 0!important} /* Each plane opens lower than the previous one, following the scroll direction. */ main>section>.cloud-gate .voxel-curtain.near .voxel-panel.left{transform:translate3d(var(--cloud-near-left,0),-3vh,var(--cloud-near-z,35px)) scale(var(--cloud-near-scale,1.08))!important} main>section>.cloud-gate .voxel-curtain.near .voxel-panel.right{transform:translate3d(var(--cloud-near-right,0),-3vh,var(--cloud-near-z,35px)) scaleX(-1) scale(var(--cloud-near-scale,1.08))!important} main>section>.cloud-gate .voxel-curtain.front .voxel-panel.left{transform:translate3d(var(--cloud-front-left,0),2vh,var(--cloud-front-z,-20px)) scale(var(--cloud-front-scale,1.03))!important} main>section>.cloud-gate .voxel-curtain.front .voxel-panel.right{transform:translate3d(var(--cloud-front-right,0),2vh,var(--cloud-front-z,-20px)) scaleX(-1) scale(var(--cloud-front-scale,1.03))!important} main>section>.cloud-gate .voxel-curtain.mid .voxel-panel.left{transform:translate3d(var(--cloud-mid-left,0),8vh,var(--cloud-mid-z,-85px)) scale(var(--cloud-mid-scale,.96))!important} main>section>.cloud-gate .voxel-curtain.mid .voxel-panel.right{transform:translate3d(var(--cloud-mid-right,0),8vh,var(--cloud-mid-z,-85px)) scaleX(-1) scale(var(--cloud-mid-scale,.96))!important} main>section>.cloud-gate .voxel-curtain.back .voxel-panel.left{transform:translate3d(var(--cloud-back-left,0),15vh,var(--cloud-back-z,-145px)) scale(var(--cloud-back-scale,.9))!important} main>section>.cloud-gate .voxel-curtain.back .voxel-panel.right{transform:translate3d(var(--cloud-back-right,0),15vh,var(--cloud-back-z,-145px)) scaleX(-1) scale(var(--cloud-back-scale,.9))!important} main>section>.cloud-gate .voxel-curtain.far .voxel-panel.left{transform:translate3d(var(--cloud-far-left,0),22vh,var(--cloud-far-z,-205px)) scale(var(--cloud-far-scale,.84))!important} main>section>.cloud-gate .voxel-curtain.far .voxel-panel.right{transform:translate3d(var(--cloud-far-right,0),22vh,var(--cloud-far-z,-205px)) scaleX(-1) scale(var(--cloud-far-scale,.84))!important} /* Real transparent voxel holes reveal the deeper cloud planes and the slide. */ main>section>.cloud-gate .voxel-panel{ -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cmask id='m'%3E%3Crect width='100' height='100' fill='white'/%3E%3Cpath d='M15 25h14v6h6v9H25v6H15zM55 12h10v5h7v11H61v-4h-6zM70 54h18v7h-5v12H70v-5h-7v-9h7zM32 70h11v5h7v12H39v-4h-7z' fill='black'/%3E%3C/mask%3E%3Crect width='100' height='100' fill='white' mask='url(%23m)'/%3E%3C/svg%3E"); -webkit-mask-size:100% 100%;-webkit-mask-repeat:no-repeat; mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cmask id='m'%3E%3Crect width='100' height='100' fill='white'/%3E%3Cpath d='M15 25h14v6h6v9H25v6H15zM55 12h10v5h7v11H61v-4h-6zM70 54h18v7h-5v12H70v-5h-7v-9h7zM32 70h11v5h7v12H39v-4h-7z' fill='black'/%3E%3C/mask%3E%3Crect width='100' height='100' fill='white' mask='url(%23m)'/%3E%3C/svg%3E"); mask-size:100% 100%;mask-repeat:no-repeat; } main>section>.cloud-gate .voxel-curtain.near .voxel-panel{-webkit-mask-size:108% 106%;-webkit-mask-position:0 0;mask-size:108% 106%;mask-position:0 0} main>section>.cloud-gate .voxel-curtain.front .voxel-panel{-webkit-mask-size:114% 109%;-webkit-mask-position:35% 18%;mask-size:114% 109%;mask-position:35% 18%} main>section>.cloud-gate .voxel-curtain.mid .voxel-panel{-webkit-mask-size:110% 116%;-webkit-mask-position:78% 42%;mask-size:110% 116%;mask-position:78% 42%} main>section>.cloud-gate .voxel-curtain.back .voxel-panel{-webkit-mask-size:118% 112%;-webkit-mask-position:16% 72%;mask-size:118% 112%;mask-position:16% 72%} main>section>.cloud-gate .voxel-curtain.far .voxel-panel{-webkit-mask-size:112% 120%;-webkit-mask-position:86% 100%;mask-size:112% 120%;mask-position:86% 100%} /* Minecraft-like cloud sheets are laid out against the viewport, not the section box. */ main>section>.cloud-gate{position:fixed!important;inset:0!important;width:100vw!important;height:100svh!important;min-height:0!important;transform:none!important;overflow:hidden!important} main>section.reveal,main>section.reveal.visible{will-change:auto!important;contain:none!important;content-visibility:visible!important} main>section>.cloud-gate .voxel-curtain.near, main>section>.cloud-gate .voxel-curtain.front, main>section>.cloud-gate .voxel-curtain.mid, main>section>.cloud-gate .voxel-curtain.back, main>section>.cloud-gate .voxel-curtain.far{inset:0!important} main>section>.cloud-gate .voxel-panel{bottom:auto!important;width:62vw!important;height:31svh!important;min-height:150px!important;max-height:none!important;image-rendering:pixelated} main>section>.cloud-gate .voxel-curtain.near .voxel-panel{top:6svh!important} main>section>.cloud-gate .voxel-curtain.front .voxel-panel{top:13svh!important} main>section>.cloud-gate .voxel-curtain.mid .voxel-panel{top:30svh!important} main>section>.cloud-gate .voxel-curtain.back .voxel-panel{top:47svh!important} main>section>.cloud-gate .voxel-curtain.far .voxel-panel{top:65svh!important} main>section>.cloud-gate .voxel-curtain.near .voxel-panel.left{transform:translate3d(var(--cloud-near-left,0),0,var(--cloud-near-z,35px)) scale(var(--cloud-near-scale,1.08))!important} main>section>.cloud-gate .voxel-curtain.near .voxel-panel.right{transform:translate3d(var(--cloud-near-right,0),0,var(--cloud-near-z,35px)) scaleX(-1) scale(var(--cloud-near-scale,1.08))!important} main>section>.cloud-gate .voxel-curtain.front .voxel-panel.left{transform:translate3d(var(--cloud-front-left,0),0,var(--cloud-front-z,-20px)) scale(var(--cloud-front-scale,1.03))!important} main>section>.cloud-gate .voxel-curtain.front .voxel-panel.right{transform:translate3d(var(--cloud-front-right,0),0,var(--cloud-front-z,-20px)) scaleX(-1) scale(var(--cloud-front-scale,1.03))!important} main>section>.cloud-gate .voxel-curtain.mid .voxel-panel.left{transform:translate3d(var(--cloud-mid-left,0),0,var(--cloud-mid-z,-85px)) scale(var(--cloud-mid-scale,.96))!important} main>section>.cloud-gate .voxel-curtain.mid .voxel-panel.right{transform:translate3d(var(--cloud-mid-right,0),0,var(--cloud-mid-z,-85px)) scaleX(-1) scale(var(--cloud-mid-scale,.96))!important} main>section>.cloud-gate .voxel-curtain.back .voxel-panel.left{transform:translate3d(var(--cloud-back-left,0),0,var(--cloud-back-z,-145px)) scale(var(--cloud-back-scale,.9))!important} main>section>.cloud-gate .voxel-curtain.back .voxel-panel.right{transform:translate3d(var(--cloud-back-right,0),0,var(--cloud-back-z,-145px)) scaleX(-1) scale(var(--cloud-back-scale,.9))!important} main>section>.cloud-gate .voxel-curtain.far .voxel-panel.left{transform:translate3d(var(--cloud-far-left,0),0,var(--cloud-far-z,-205px)) scale(var(--cloud-far-scale,.84))!important} main>section>.cloud-gate .voxel-curtain.far .voxel-panel.right{transform:translate3d(var(--cloud-far-right,0),0,var(--cloud-far-z,-205px)) scaleX(-1) scale(var(--cloud-far-scale,.84))!important} @media(max-width:760px){main>section>.cloud-gate .voxel-panel{width:70vw!important;height:29svh!important;min-height:118px!important}} /* v112: carved outer cloud edges and a curved, non-linear slide approach. */ main>section.reveal>:not(.cloud-gate){ transform:perspective(1300px) translate3d(var(--section-x,0),var(--section-y,168px),var(--section-z,-680px)) rotateX(var(--section-rx,4deg)) scale(var(--section-scale,.74))!important; transform-origin:50% 58%!important; } main>section>.cloud-gate .voxel-panel{ -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpath fill='white' d='M0 19H8V11H18V4H30V12H42V0H55V8H68V3H80V14H90V8H100V31H94V43H100V58H92V70H100V82H92V89H83V97H70V88H56V100H42V92H27V97H14V86H0Z'/%3E%3Cpath fill='black' d='M15 27h14v6h6v9H25v6H15zM55 16h10v5h7v11H61v-4h-6zM70 55h18v7h-5v12H70v-5h-7v-9h7zM32 70h11v5h7v12H39v-4h-7z'/%3E%3C/svg%3E")!important; -webkit-mask-repeat:no-repeat!important; mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpath fill='white' d='M0 19H8V11H18V4H30V12H42V0H55V8H68V3H80V14H90V8H100V31H94V43H100V58H92V70H100V82H92V89H83V97H70V88H56V100H42V92H27V97H14V86H0Z'/%3E%3Cpath fill='black' d='M15 27h14v6h6v9H25v6H15zM55 16h10v5h7v11H61v-4h-6zM70 55h18v7h-5v12H70v-5h-7v-9h7zM32 70h11v5h7v12H39v-4h-7z'/%3E%3C/svg%3E")!important; mask-repeat:no-repeat!important; } main>section>.cloud-gate{visibility:hidden!important;opacity:0!important} main>section.cloud-active:not(.cloud-current)>.cloud-gate{visibility:hidden!important;opacity:0!important} main>section.cloud-current>.cloud-gate{visibility:visible!important;opacity:1!important} /* v177: compact clip titles; the longer title stays on one line. */ .clip-card .card-copy strong{font-size:clamp(24px,3.1vw,46px);line-height:1;letter-spacing:-.035em;white-space:nowrap}