:root{
  --bg:#02070d;--panel:#061523;--panel2:#091d2d;--blue:#28bfff;--blue2:#0c77cb;
  --gold:#e3b957;--text:#eaf7ff;--muted:#8ca5b7;--line:rgba(62,190,255,.25);
}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--text);font-family:Rajdhani,Arial,sans-serif;overflow-x:hidden}
body:before{content:"";position:fixed;inset:0;pointer-events:none;z-index:50;background:linear-gradient(90deg,rgba(0,190,255,.025) 1px,transparent 1px),linear-gradient(rgba(0,190,255,.02) 1px,transparent 1px);background-size:64px 64px;mask-image:linear-gradient(to bottom,black,transparent)}
h1,h2,h3{font-family:Cinzel,serif;margin:0}a{color:inherit;text-decoration:none}img{max-width:100%;display:block}
#particles{position:fixed;inset:0;z-index:3;pointer-events:none}
.preloader{position:fixed;inset:0;background:#01060a;z-index:9999;display:grid;place-items:center;transition:.7s}.preloader.hide{opacity:0;visibility:hidden}.preloader img{width:min(520px,70vw)}.preloader span{position:absolute;width:220px;height:2px;background:linear-gradient(90deg,transparent,var(--blue),transparent);animation:load 1.3s infinite}@keyframes load{from{transform:translateX(-240px)}to{transform:translateX(240px)}}
.topbar{height:78px;position:fixed;top:0;left:0;right:0;display:flex;align-items:center;justify-content:space-between;padding:0 5vw;z-index:100;background:linear-gradient(#02080ee8,#02080e66);border-bottom:1px solid var(--line);backdrop-filter:blur(12px)}
.brand img{width:150px}.topbar nav{display:flex;align-items:center;gap:28px}.topbar nav a{font-weight:700;letter-spacing:1px;color:#b9cfdd}.topbar nav a:hover{color:var(--blue)}.nav-download{padding:11px 19px;border:1px solid var(--gold);color:#ffe29d!important}.menu-btn{display:none;background:none;border:0}.menu-btn span{display:block;width:27px;height:2px;background:#fff;margin:6px}
.hero{min-height:100vh;position:relative;display:grid;place-items:center;overflow:hidden}.hero video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.38}.hero-shade{position:absolute;inset:0;background:radial-gradient(circle at 50% 42%,transparent 0,#02070d66 42%,#02070de6 86%),linear-gradient(to bottom,#02070d66,#02070d 98%)}.hero-content{position:relative;z-index:5;text-align:center;padding-top:55px;width:min(920px,92vw)}.hero-logo{width:min(680px,82vw);margin:auto;filter:drop-shadow(0 0 26px #087dc3)}.hero-kicker{letter-spacing:7px;color:#8edcff;font-weight:700;margin-top:-20px}.hero h1{font-size:clamp(34px,5vw,72px);margin:18px 0 12px;text-shadow:0 4px 25px #000}.hero h1 span{color:var(--gold);display:block;font-size:.52em;letter-spacing:10px}.hero p{font-size:20px;color:#b9cfdd}.countdown{display:flex;justify-content:center;gap:14px;margin:30px 0}.countdown div{width:112px;padding:14px 8px;background:#071622b8;border:1px solid var(--line);box-shadow:inset 0 0 25px #0a6ba522}.countdown b{font-size:34px;color:#fff}.countdown span{display:block;text-transform:uppercase;letter-spacing:2px;color:var(--blue);font-size:12px}.hero-actions{display:flex;justify-content:center;gap:14px;flex-wrap:wrap}.btn{display:inline-flex;align-items:center;justify-content:center;min-width:170px;padding:14px 24px;border:1px solid var(--blue);font-weight:700;letter-spacing:1.5px;text-transform:uppercase;transition:.25s}.btn.primary{background:linear-gradient(135deg,#167dc0,#1ac4ff);box-shadow:0 0 30px #128fc75c}.btn.ghost{background:#03101bb8}.btn:hover{transform:translateY(-3px);box-shadow:0 0 30px #1bc5ff88}.scroll-down{position:absolute;z-index:6;bottom:24px;font-size:11px;letter-spacing:3px;color:#89c9ec}.scroll-down i{display:block;width:1px;height:40px;background:linear-gradient(var(--blue),transparent);margin:8px auto}
.section{padding:110px 6vw;position:relative;background:linear-gradient(180deg,#02070d,#04111c,#02070d)}.section-head{text-align:center;max-width:900px;margin:0 auto 55px}.section-head small,.chapter,.system-copy>span,.scene-copy>span{color:var(--blue);letter-spacing:5px;font-weight:700}.section-head h2{font-size:clamp(38px,5vw,66px);margin:8px 0;background:linear-gradient(#fff,#70d8ff);-webkit-background-clip:text;color:transparent}.section-head p{font-size:20px;color:var(--muted)}
.feature-grid{max-width:1280px;margin:auto;display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.feature-grid article{min-height:92px;padding:21px 24px;border:1px solid var(--line);background:linear-gradient(145deg,#071a29cc,#03101acc);font-family:Cinzel,serif;font-size:19px;color:#fff;position:relative;overflow:hidden;transition:.25s}.feature-grid article:after{content:"";position:absolute;inset:auto -35px -55px auto;width:120px;height:120px;border:1px solid #1cbcff40;border-radius:50%}.feature-grid article:hover{transform:translateY(-5px);border-color:#5fd6ff;box-shadow:0 12px 45px #006aa533}.feature-grid span{display:block;font-family:Rajdhani;color:var(--gold);font-size:16px;margin-top:6px}
.story-section,.system-panel,.reward-scene{position:relative;overflow:hidden}.story-section{min-height:760px;display:flex;align-items:center}.story-bg,.system-bg,.scene-bg{position:absolute;inset:0;background-size:cover;background-position:center}.story-bg:after,.system-bg:after,.scene-bg:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#02070de8 0,#02070d55 47%,#02070de8 100%),linear-gradient(to bottom,#02070d,#02070d22 15%,#02070d 100%)}.story-inner{position:relative;z-index:2;width:min(1280px,90vw);margin:auto;display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:70px}.visual-stage{min-height:600px;display:grid;place-items:center;position:relative}.visual-stage img{max-height:560px;filter:drop-shadow(0 30px 25px #000) drop-shadow(0 0 30px #128bd455)}.blue-orbit{position:absolute;width:480px;height:480px;border:1px solid #31bfff77;border-radius:50%;box-shadow:0 0 80px #0782c766,inset 0 0 70px #0782c744;animation:orbit 8s linear infinite}.blue-orbit:after{content:"";position:absolute;inset:40px;border:1px dashed #ebc56e55;border-radius:50%}@keyframes orbit{to{transform:rotate(360deg)}}.story-copy{padding:45px;background:#03111bd9;border-left:3px solid var(--blue);box-shadow:0 20px 60px #0009}.story-copy h2,.system-copy h2{font-size:clamp(38px,5vw,65px);margin:12px 0}.story-copy p,.system-copy p,.scene-copy p{color:#c2d1db;font-size:21px;line-height:1.6}.story-copy ul{list-style:none;padding:0}.story-copy li{padding:10px 0;border-bottom:1px solid var(--line);color:#9ddfff}
.transforms{padding-top:82px;padding-bottom:82px;background:radial-gradient(circle at 50% 30%,#0b2b43,#02070d 65%)}
.transform-row{max-width:960px;margin:18px auto;padding:22px;border:1px solid var(--line);background:#06131ed9}
.transform-row h3{text-align:center;color:#fff;font-size:20px;margin-bottom:16px}
.transform-chain{display:flex;justify-content:center;align-items:center;gap:14px}
.transform-chain figure{margin:0;text-align:center}
.item-stage{width:148px;height:188px;display:grid;place-items:center;background:radial-gradient(circle,#0e496d88,#03101a 64%);border:1px solid #2ebfff55;clip-path:polygon(12% 0,88% 0,100% 10%,100% 90%,88% 100%,12% 100%,0 90%,0 10%);position:relative}
.item-stage:after{content:"";position:absolute;inset:7px;border:1px solid #e3b95733}
.item-stage img{max-height:145px;max-width:95px;object-fit:contain;filter:drop-shadow(0 12px 10px #000) drop-shadow(0 0 8px #4acbff);animation:itemFloat 3s ease-in-out infinite}
@keyframes itemFloat{50%{transform:translateY(-5px) rotateY(7deg)}}
.transform-chain figcaption{font-family:Cinzel;margin-top:8px;color:#ffe4a1;font-size:12px}
.arrow{font-size:27px;color:var(--blue);filter:drop-shadow(0 0 7px var(--blue))}
.compact .item-stage{height:150px}
.system-panel{min-height:700px;display:grid;grid-template-columns:1.15fr .85fr;align-items:center;padding:90px 8vw;gap:60px}.system-panel.reverse{grid-template-columns:.85fr 1.15fr}.system-panel.reverse .system-art{order:2}.system-panel.reverse .system-copy{order:1}.system-art,.system-copy{position:relative;z-index:2}.system-art{display:grid;place-items:center}.ui-shot{max-height:430px;filter:drop-shadow(0 28px 35px #000) drop-shadow(0 0 18px #12a4e866);transform:perspective(900px) rotateY(-5deg)}.ui-shot.large{max-height:500px}.system-copy{padding:42px;background:#020c14d9;border:1px solid var(--line)}.system-copy em{color:#7290a4}.auto-showcase{position:relative;width:min(520px,90vw);min-height:380px;display:grid;place-items:center}
.auto-glow{position:absolute;width:300px;height:300px;border-radius:50%;background:radial-gradient(circle,#45d8ff55 0,#0a77bd33 42%,transparent 72%);filter:blur(4px);animation:autoPulse 2.8s ease-in-out infinite}
.auto-main-icon{position:relative;z-index:2;width:170px;image-rendering:auto;filter:drop-shadow(0 0 18px #26c4ff) drop-shadow(0 22px 25px #000);transform:scale(1.25)}
.auto-mini-panel{position:absolute;z-index:3;right:4%;bottom:8%;width:270px;padding:20px 22px;background:linear-gradient(145deg,#071824ee,#03101aee);border:1px solid #39c9ff88;box-shadow:0 18px 50px #0008}
.auto-mini-panel b{display:block;font-family:Cinzel;font-size:22px}.auto-mini-panel span,.auto-mini-panel small{display:block;color:#abc6d7;margin-top:8px}.auto-mini-panel i{display:block;width:80px;height:2px;margin:13px 0;background:linear-gradient(90deg,var(--blue),transparent)}
@keyframes autoPulse{50%{transform:scale(1.08);opacity:.72}}
.dice-showcase{position:relative;display:grid;place-items:center;min-height:460px;width:min(620px,92vw)}
.dice-ring{position:absolute;width:380px;height:380px;border-radius:50%;border:1px solid #f0c45c66;box-shadow:0 0 60px #0eaee955,inset 0 0 45px #e7bb4b22;animation:diceSpin 14s linear infinite}
.dice-ring:before,.dice-ring:after{content:"";position:absolute;inset:28px;border:1px dashed #37c8ff55;border-radius:50%}.dice-ring:after{inset:76px;border-style:solid;border-color:#f0c45c44}
.dice-ui{position:relative;z-index:2;max-height:350px!important;transform:perspective(900px) rotateY(-4deg) rotateX(2deg)}
.dice-action{position:absolute;z-index:4;bottom:-18px;display:flex;align-items:center;gap:14px;padding:12px 14px;background:#03101be8;border:1px solid #2ac5ff55;box-shadow:0 14px 40px #0009;backdrop-filter:blur(10px)}
.web-die{position:relative;width:58px;height:58px;border-radius:13px;background:linear-gradient(145deg,#f9fdff,#b7d7e8);border:2px solid #8edcff;box-shadow:inset -7px -8px 12px #6f93a655,inset 6px 6px 10px #fff,0 0 20px #25c6ff88;transition:transform .15s ease}
.web-die.rolling{animation:webDiceRoll .8s cubic-bezier(.2,.8,.2,1)}
.pip{position:absolute;width:8px;height:8px;border-radius:50%;background:#06213a;box-shadow:inset 1px 1px 1px #0008}
.p1{left:10px;top:10px}.p2{right:10px;top:10px}.p3{left:10px;bottom:10px}.p4{right:10px;bottom:10px}.p5{left:25px;top:25px}.p6{left:25px;top:10px}
.web-die[data-value="1"] .pip:not(.p5){display:none}
.web-die[data-value="2"] .pip:not(.p1):not(.p4){display:none}
.web-die[data-value="3"] .pip:not(.p1):not(.p4):not(.p5){display:none}
.web-die[data-value="4"] .pip:not(.p1):not(.p2):not(.p3):not(.p4){display:none}
.web-die[data-value="5"] .pip:not(.p1):not(.p2):not(.p3):not(.p4):not(.p5){display:none}
.web-die[data-value="6"] .pip:not(.p1):not(.p2):not(.p3):not(.p4):not(.p5):not(.p6){display:block}
.dice-chip{position:relative;z-index:3;padding:11px 20px;background:linear-gradient(145deg,#0a2435,#061522);border:1px solid var(--gold);color:#ffe198;font-family:Cinzel;letter-spacing:2px;box-shadow:0 0 22px #d7a83b33;cursor:pointer;transition:.25s}
.dice-chip:hover{transform:translateY(-2px);box-shadow:0 0 28px #e7b84866}
.dice-chip:disabled{opacity:.55;cursor:wait}
.dice-result{min-width:170px;color:#a9c7d8;font-size:13px}
@keyframes webDiceRoll{
  0%{transform:rotate(0) scale(1)}
  25%{transform:rotate(110deg) scale(1.2)}
  50%{transform:rotate(240deg) scale(.88)}
  75%{transform:rotate(390deg) scale(1.12)}
  100%{transform:rotate(540deg) scale(1)}
}
@keyframes diceSpin{to{transform:rotate(360deg)}}
.rewards{background:#02070d;padding-top:100px}.reward-scene{min-height:620px;display:flex;align-items:center;padding:80px 9vw;margin-bottom:2px}.reward-scene .scene-bg{transition:transform 8s ease}.reward-scene:hover .scene-bg{transform:scale(1.05)}.scene-copy{position:relative;z-index:3;width:min(620px,80vw);padding:38px;background:linear-gradient(90deg,#020a11ef,#061727c7);border-left:3px solid var(--blue);box-shadow:0 25px 70px #000}.scene-copy h3{font-size:clamp(34px,5vw,62px);margin:12px 0}.scene-ui{position:absolute;z-index:3;right:8%;max-height:420px;filter:drop-shadow(0 25px 25px #000) drop-shadow(0 0 16px #2bc8ff)}.guild .scene-copy,.ronark .scene-copy{margin-left:auto}.guild .scene-bg:after,.ronark .scene-bg:after{background:linear-gradient(90deg,#02070dee,#02070d44,#02070ddd),linear-gradient(to bottom,#02070d,#02070d22,#02070d)}.metin-stone{position:absolute;z-index:2;width:230px;height:360px;background:linear-gradient(140deg,#384a56,#10151a 55%,#26333b);clip-path:polygon(50% 0,86% 14%,100% 55%,76% 100%,23% 94%,0 55%,15% 16%);box-shadow:0 0 45px #1e9fe2;opacity:.82}.metin-stone:after{content:"雷";position:absolute;inset:0;display:grid;place-items:center;font-size:84px;color:#31c7ff;text-shadow:0 0 25px #31c7ff}.metin-stone.left{left:8%;transform:rotate(-8deg)}.metin-stone.right{right:8%;transform:rotate(8deg)}.metin .scene-copy,.vs .scene-copy{margin:auto;text-align:center}.duel-silhouette{position:absolute;inset:0;z-index:2;display:flex;justify-content:space-between;align-items:end;padding:0 8%}.duel-silhouette i{width:230px;height:480px;background:linear-gradient(#1f5c85,#02070d);clip-path:polygon(42% 0,62% 4%,70% 18%,87% 29%,78% 50%,100% 72%,65% 68%,72% 100%,34% 100%,39% 65%,0 74%,25% 49%,18% 28%,38% 18%);opacity:.72;filter:drop-shadow(0 0 20px #2bbfff)}.duel-silhouette i:last-child{transform:scaleX(-1)}
.cta{text-align:center;padding:120px 20px;background:radial-gradient(circle,#0b304a,#02070d 65%)}.cta img{width:min(600px,75vw);margin:auto}.cta h2{font-size:clamp(35px,5vw,65px);margin:15px}.cta>div{display:flex;justify-content:center;gap:12px;flex-wrap:wrap}footer{text-align:center;padding:28px;color:#6f8797;border-top:1px solid var(--line)}
.reveal{opacity:0;transform:translateY(30px);transition:.8s ease}.reveal.visible{opacity:1;transform:none}
@media(max-width:900px){.topbar nav{position:absolute;top:78px;left:0;right:0;background:#020b12f5;display:none;flex-direction:column;padding:30px}.topbar nav.open{display:flex}.menu-btn{display:block}.feature-grid{grid-template-columns:1fr 1fr}.story-inner,.system-panel,.system-panel.reverse{grid-template-columns:1fr}.system-panel.reverse .system-art,.system-panel.reverse .system-copy{order:initial}.visual-stage{min-height:450px}.scene-ui{position:relative;right:auto;margin-left:30px;max-width:45%}.transform-chain{gap:8px}.item-stage{width:150px;height:220px}.arrow{font-size:25px}.metin-stone{width:150px;height:280px;opacity:.45}}
@media(max-width:600px){.brand img{width:115px}.hero-kicker{letter-spacing:3px;margin-top:0}.countdown div{width:76px}.countdown b{font-size:25px}.feature-grid{grid-template-columns:1fr}.section{padding:80px 20px}.story-section{padding:60px 0}.story-inner{width:92vw;gap:20px}.visual-stage{min-height:390px}.blue-orbit{width:320px;height:320px}.story-copy{padding:25px}.transform-row{padding:15px 6px}.transform-chain{flex-wrap:wrap;gap:8px}.item-stage{width:98px;height:132px}.item-stage img{max-height:98px;max-width:66px}.arrow{font-size:18px}.system-panel{padding:70px 20px}.auto-main-icon{width:115px}.auto-mini-panel{position:relative;right:auto;bottom:auto;margin-top:190px;width:min(290px,86vw)}.dice-ring{width:280px;height:280px}.dice-ui{max-height:265px!important}.reward-scene{min-height:650px;padding:70px 20px;align-items:flex-end}.scene-copy{width:100%;padding:24px}.scene-ui{position:absolute;right:5%;top:70px;max-width:70%;max-height:300px;opacity:.75}.metin-stone{top:80px}.duel-silhouette i{width:135px;height:330px}.guild .scene-copy,.ronark .scene-copy{margin-left:0}}

@media(max-width:600px){
  .dice-action{position:relative;bottom:auto;margin-top:-28px;flex-wrap:wrap;justify-content:center;width:min(330px,92vw)}
  .dice-result{width:100%;text-align:center;min-width:0}
}

/* V4: extra compact transformation presentation */
.transforms{padding-top:62px!important;padding-bottom:62px!important}
.transforms .section-head{margin-bottom:28px}
.transforms .section-head h2{font-size:clamp(32px,4vw,52px)}
.transform-row{max-width:760px!important;margin:12px auto!important;padding:15px 18px!important}
.transform-row h3{font-size:16px!important;margin-bottom:10px!important;letter-spacing:1px}
.transform-chain{gap:8px!important}
.item-stage{width:96px!important;height:116px!important}
.item-stage:after{inset:5px!important}
.item-stage img{max-height:80px!important;max-width:58px!important;animation:none!important;image-rendering:auto!important;filter:drop-shadow(0 8px 7px #000) drop-shadow(0 0 5px #4acbff)!important}
.transform-chain figcaption{font-size:9px!important;margin-top:5px!important;max-width:105px}
.arrow{font-size:19px!important}
.compact .item-stage{height:96px!important}
@media(max-width:600px){
  .transform-row{max-width:94vw!important;padding:12px 5px!important}
  .transform-chain{gap:4px!important}
  .item-stage{width:76px!important;height:96px!important}
  .item-stage img{max-height:64px!important;max-width:46px!important}
  .transform-chain figcaption{font-size:8px!important;max-width:80px}
  .arrow{font-size:15px!important}
}

/* Persistent Discord card */
.discord-float{
  position:fixed;right:20px;top:50%;transform:translateY(-50%);
  z-index:120;width:260px;padding:16px 16px 16px 78px;
  background:linear-gradient(145deg,rgba(13,23,45,.97),rgba(4,10,22,.98));
  border:1px solid rgba(89,145,255,.55);
  box-shadow:0 18px 55px #000b,0 0 28px rgba(58,113,255,.2);
  backdrop-filter:blur(14px);transition:.35s ease;
}
.discord-float:hover{transform:translateY(-50%) translateX(-5px);box-shadow:0 22px 65px #000d,0 0 40px rgba(86,126,255,.35)}
.discord-float.hidden{opacity:0;pointer-events:none;transform:translateY(-50%) translateX(120%)}
.discord-orb{
  position:absolute;left:14px;top:50%;transform:translateY(-50%);
  width:50px;height:50px;border-radius:17px;
  background:linear-gradient(145deg,#7c8cff,#4857d8);
  display:grid;place-items:center;box-shadow:0 0 24px #6678ff99;
}
.discord-orb:before,.discord-orb:after{content:"";position:absolute;width:13px;height:18px;border:3px solid #fff;border-top:0;border-radius:0 0 15px 15px;top:16px}
.discord-orb:before{left:7px;transform:rotate(16deg)}.discord-orb:after{right:7px;transform:rotate(-16deg)}
.discord-eyes{color:#fff;letter-spacing:8px;margin-left:7px;margin-top:-3px;font-weight:900}
.discord-copy b{display:block;font-family:Cinzel;color:#fff;font-size:15px;letter-spacing:1px}
.discord-copy small{display:block;color:#94a9c7;margin:5px 0 10px;line-height:1.2}
.discord-copy a{display:inline-block;padding:8px 12px;background:linear-gradient(135deg,#6676f5,#8391ff);color:#fff;font-weight:700;font-size:12px;border-radius:3px}
.discord-close{position:absolute;right:6px;top:4px;border:0;background:none;color:#75839e;font-size:18px;cursor:pointer}
.discord-close:hover{color:#fff}
@media(max-width:950px){.discord-float{right:10px;top:auto;bottom:18px;transform:none;width:235px}.discord-float:hover{transform:translateX(-4px)}.discord-float.hidden{transform:translateX(120%)}}
@media(max-width:560px){.discord-float{width:210px;padding-left:64px}.discord-orb{width:40px;height:40px}.discord-copy small{display:none}}

/* More vivid VS tournament scene */
.vs{isolation:isolate}
.vs:before{
  content:"";position:absolute;inset:0;z-index:2;pointer-events:none;
  background:
    radial-gradient(circle at 50% 50%,rgba(21,180,255,.19),transparent 30%),
    linear-gradient(120deg,transparent 35%,rgba(255,188,65,.08) 50%,transparent 65%);
  animation:vsPulse 3.5s ease-in-out infinite;
}
.vs-trophy-wrap{
  position:absolute;z-index:4;left:50%;top:48%;transform:translate(-50%,-50%);
  width:260px;pointer-events:none;
}
.vs-trophy-wrap img{
  width:100%;filter:drop-shadow(0 20px 30px #000) drop-shadow(0 0 22px rgba(43,190,255,.7));
  animation:trophyFloat 3s ease-in-out infinite;
}
.trophy-rays{
  position:absolute;inset:5%;border-radius:50%;
  background:repeating-conic-gradient(from 0deg,rgba(45,194,255,.25) 0 4deg,transparent 4deg 18deg);
  filter:blur(1px);animation:raySpin 18s linear infinite;
}
.vs .scene-copy{margin-left:auto;margin-right:auto;margin-top:330px;max-width:680px}
@keyframes trophyFloat{50%{transform:translateY(-12px) scale(1.03)}}
@keyframes raySpin{to{transform:rotate(360deg)}}
@keyframes vsPulse{50%{opacity:.55}}
@media(max-width:700px){
  .vs-trophy-wrap{width:180px;top:34%}
  .vs .scene-copy{margin-top:260px}
}


/* V5 refinements */
.transforms{padding-top:46px!important;padding-bottom:46px!important}
.transforms .section-head{margin-bottom:20px!important}
.transform-row{max-width:620px!important;margin:8px auto!important;padding:11px 12px!important}
.transform-row h3{font-size:14px!important;margin-bottom:7px!important}
.transform-chain{gap:5px!important}
.item-stage{width:72px!important;height:88px!important}
.item-stage img{max-height:58px!important;max-width:40px!important;filter:drop-shadow(0 5px 5px #000) drop-shadow(0 0 4px #4acbff)!important}
.transform-chain figcaption{font-size:7px!important;max-width:78px!important;margin-top:3px!important}
.arrow{font-size:15px!important}
.compact .item-stage{height:72px!important}
.discord-orb{
  overflow:hidden!important;
  border-radius:50%!important;
  background:#5865F2 url('assets/images/discord-icon.png') center/108% no-repeat!important;
  box-shadow:0 0 26px rgba(88,101,242,.78)!important;
}
.discord-orb:before,.discord-orb:after,.discord-eyes{display:none!important}
.discord-float{border-color:rgba(108,123,255,.7)!important}
.discord-copy a{background:linear-gradient(135deg,#5865F2,#7b88ff)!important}
.vs-trophy-wrap{width:300px!important}
.vs-trophy-wrap:after{content:'';position:absolute;left:50%;bottom:5%;width:190px;height:28px;transform:translateX(-50%);background:radial-gradient(ellipse,rgba(255,200,83,.62),transparent 70%);filter:blur(8px)}
.vs-trophy-wrap img{filter:drop-shadow(0 24px 35px #000) drop-shadow(0 0 26px rgba(255,194,62,.72)) drop-shadow(0 0 18px rgba(43,190,255,.7))!important}
.vs .scene-copy{background:linear-gradient(90deg,rgba(2,10,17,.96),rgba(8,31,49,.9))!important;border-left-color:#f0bd45!important}
.vs .scene-copy h3{text-shadow:0 0 24px rgba(42,192,255,.34)}
.dice-action{box-shadow:0 18px 48px #000b,0 0 26px rgba(42,198,255,.22)!important}
.web-die{transform-style:preserve-3d}
.web-die.rolling{animation:webDiceRollV5 .9s cubic-bezier(.17,.67,.27,1.2)!important}
@keyframes webDiceRollV5{0%{transform:rotate(0deg) rotateY(0deg) scale(1)}35%{transform:rotate(170deg) rotateY(220deg) scale(1.28)}70%{transform:rotate(410deg) rotateY(500deg) scale(.9)}100%{transform:rotate(720deg) rotateY(720deg) scale(1)}}
@media(max-width:600px){
 .transform-row{max-width:96vw!important;padding:8px 4px!important}
 .item-stage{width:58px!important;height:74px!important}
 .item-stage img{max-height:48px!important;max-width:34px!important}
 .transform-chain figcaption{font-size:6px!important;max-width:64px!important}
 .arrow{font-size:12px!important}
 .vs-trophy-wrap{width:205px!important}
}

.topbar{display:none!important}body{padding-left:112px}
.side-nav{position:fixed;left:0;top:0;bottom:0;width:112px;z-index:130;display:flex;flex-direction:column;align-items:center;background:linear-gradient(180deg,rgba(3,13,22,.98),rgba(2,7,13,.96));border-right:1px solid rgba(46,190,255,.22);box-shadow:12px 0 40px rgba(0,0,0,.36);backdrop-filter:blur(14px)}
.side-brand{padding:18px 10px 12px;border-bottom:1px solid var(--line);width:100%}.side-brand img{width:88px;margin:auto}.side-nav nav{display:flex;flex-direction:column;width:100%;margin-top:28px}.side-nav nav a{position:relative;display:flex;flex-direction:column;align-items:center;gap:4px;padding:16px 5px;color:#8ea8ba;font-size:12px;font-weight:700;letter-spacing:.8px;border-left:2px solid transparent;transition:.25s}.side-nav nav a span{font-size:9px;color:#2dbfff;letter-spacing:2px}.side-nav nav a:hover,.side-nav nav a.active{color:#fff;background:linear-gradient(90deg,rgba(24,167,232,.15),transparent);border-left-color:var(--blue);text-shadow:0 0 12px rgba(70,204,255,.55)}.side-download{margin-top:auto;margin-bottom:22px;padding:10px 14px;border:1px solid var(--gold);color:#ffe29b;font-family:Cinzel;font-size:11px;letter-spacing:1px}
@media(max-width:900px){body{padding-left:0}.side-nav{top:auto;right:0;bottom:0;width:auto;height:66px;flex-direction:row;border-right:0;border-top:1px solid rgba(46,190,255,.22)}.side-brand,.side-download{display:none}.side-nav nav{margin:0;flex-direction:row;justify-content:space-around;width:100%}.side-nav nav a{padding:10px 7px;min-width:64px;font-size:10px;border-left:0;border-top:2px solid transparent}.side-nav nav a.active,.side-nav nav a:hover{border-top-color:var(--blue);border-left-color:transparent}}
.discord-orb{background:url('assets/images/discord-icon.png') center/contain no-repeat!important;box-shadow:none!important;border-radius:0!important}.discord-orb:before,.discord-orb:after,.discord-eyes{display:none!important}
.auto-showcase.refined{min-height:460px;width:min(520px,92vw)}.auto-panel-image{position:relative;z-index:2;max-height:430px;max-width:300px;object-fit:contain;filter:drop-shadow(0 24px 30px #000) drop-shadow(0 0 18px rgba(35,188,255,.5));image-rendering:auto}.auto-tags{position:absolute;z-index:3;right:0;bottom:28px;display:flex;flex-direction:column;gap:8px}.auto-tags span{padding:8px 12px;background:rgba(3,16,27,.9);border:1px solid rgba(53,194,255,.35);color:#bfeeff;font-size:12px;letter-spacing:.6px;box-shadow:0 8px 22px #0007}@media(max-width:600px){.auto-panel-image{max-height:360px;max-width:240px}.auto-tags{position:relative;right:auto;bottom:auto;margin-top:-18px}}
.web-die[data-value="6"] .p1,.web-die[data-value="6"] .p2,.web-die[data-value="6"] .p3,.web-die[data-value="6"] .p4,.web-die[data-value="6"] .p6{display:block!important}.web-die[data-value="6"] .p5{display:none!important}.web-die[data-value="6"] .p6{left:25px;top:auto;bottom:10px}
.vs-trophy-wrap{left:auto!important;right:8%!important;top:50%!important;transform:translateY(-50%)!important;width:220px!important}.vs .scene-copy{margin-left:7%!important;margin-right:auto!important;margin-top:0!important;max-width:620px}@media(max-width:900px){.vs-trophy-wrap{right:4%!important;width:170px!important;opacity:.82}.vs .scene-copy{margin-left:0!important;max-width:72%}}@media(max-width:600px){.vs-trophy-wrap{top:28%!important;right:50%!important;transform:translateX(50%)!important;width:150px!important}.vs .scene-copy{margin-top:240px!important;max-width:100%}}
.back-to-top{position:fixed;right:24px;bottom:24px;z-index:125;width:48px;height:48px;border-radius:50%;border:1px solid rgba(75,203,255,.7);background:linear-gradient(145deg,#0a2537,#03101a);color:#dff7ff;font-size:22px;cursor:pointer;box-shadow:0 0 24px rgba(34,190,255,.3);opacity:0;pointer-events:none;transform:translateY(15px);transition:.3s}.back-to-top.show{opacity:1;pointer-events:auto;transform:none}.back-to-top:hover{transform:translateY(-4px);box-shadow:0 0 34px rgba(34,190,255,.55)}@media(max-width:900px){.back-to-top{bottom:82px;right:14px}}


/* V7 Loading */
.preloader{display:grid!important;place-items:center!important}
.loader-core{text-align:center;width:min(560px,82vw)}
.loader-core img{width:min(500px,72vw);margin:auto;filter:drop-shadow(0 0 30px #087fcf)}
.loader-core p{color:#8fdcff;letter-spacing:3px;text-transform:uppercase}
.loader-track{height:5px;background:#061725;border:1px solid #1f7fac;overflow:hidden;margin:18px 0 10px}
.loader-track i{display:block;height:100%;width:0;background:linear-gradient(90deg,#0c79bf,#53d8ff,#e3b957);box-shadow:0 0 18px #37c9ff;transition:width .18s}
.loader-core strong{font-family:Cinzel;color:#fff;letter-spacing:2px}

/* Stats */
.live-stats{display:grid;grid-template-columns:repeat(4,1fr);max-width:1200px;margin:-72px auto 0;position:relative;z-index:8;background:#03101bea;border:1px solid var(--line);box-shadow:0 28px 70px #000b}
.live-stats article{text-align:center;padding:26px 12px;border-right:1px solid var(--line)}
.live-stats article:last-child{border-right:0}
.live-stats b{display:block;font:700 38px Cinzel;color:#7bdcff;text-shadow:0 0 18px #19aee4}
.live-stats span{color:#a9bdca;letter-spacing:1px}
@media(max-width:700px){.live-stats{grid-template-columns:1fr 1fr;margin:-36px 12px 0}.live-stats article:nth-child(2){border-right:0}.live-stats article{border-bottom:1px solid var(--line)}}

/* Cursor particles */
.cursor-particles{position:fixed;inset:0;pointer-events:none;z-index:150}
.cursor-spark{position:absolute;width:6px;height:6px;border-radius:50%;background:#6de3ff;box-shadow:0 0 12px #23c8ff;animation:cursorSpark .72s ease-out forwards}
@keyframes cursorSpark{to{transform:translate(var(--dx),var(--dy)) scale(0);opacity:0}}

/* Meteors */
.meteor-layer{position:fixed;inset:0;overflow:hidden;pointer-events:none;z-index:4}
.meteor{position:absolute;width:180px;height:2px;background:linear-gradient(90deg,transparent,#55dcff,#fff);filter:drop-shadow(0 0 8px #2bc6ff);transform:rotate(-25deg);animation:meteorFly 1.5s linear forwards}
.meteor:after{content:"";position:absolute;right:-2px;top:-3px;width:8px;height:8px;border-radius:50%;background:#fff;box-shadow:0 0 18px #4fd8ff}
@keyframes meteorFly{from{transform:translate(0,0) rotate(-25deg);opacity:0}10%{opacity:1}to{transform:translate(-130vw,75vh) rotate(-25deg);opacity:0}}

/* Parallax */
.parallax-layer{will-change:transform;transition:transform .12s ease-out}

/* Transform animation */
.transform-row{position:relative}
.transform-play{display:block;margin:14px auto 0;padding:8px 15px;background:#061522;border:1px solid #2dbfff;color:#bfeeff;font:700 11px Cinzel;letter-spacing:1px;cursor:pointer}
.animated-chain figure{transition:.3s}
.animated-chain.playing figure{opacity:.2;transform:scale(.86)}
.animated-chain.playing figure.active{opacity:1;transform:scale(1.12);filter:drop-shadow(0 0 20px #2fc9ff)}
.animated-chain.playing .arrow{animation:arrowPulse .65s infinite alternate}
@keyframes arrowPulse{to{transform:translateX(6px);color:#fff}}

/* 3D Dice */
.dice-cube-wrap{width:74px;height:74px;perspective:700px;display:grid;place-items:center}
.dice-cube{position:relative;width:56px;height:56px;transform-style:preserve-3d;transform:rotateX(-18deg) rotateY(26deg);transition:transform .75s cubic-bezier(.2,.75,.2,1)}
.dice-cube.rolling{animation:cubeRoll .9s cubic-bezier(.15,.75,.2,1)}
.dice-face{position:absolute;inset:0;background:linear-gradient(145deg,#f9fdff,#b8d7e8);border:2px solid #7edfff;border-radius:10px;box-shadow:inset -5px -6px 10px #698ea355,inset 4px 4px 8px #fff,0 0 14px #23bfff66;display:grid;grid-template:repeat(3,1fr)/repeat(3,1fr);padding:8px}
.dice-face i{width:7px;height:7px;border-radius:50%;background:#071d31;align-self:center;justify-self:center}
.face-1{transform:translateZ(28px)}.face-2{transform:rotateY(90deg) translateZ(28px)}.face-3{transform:rotateY(180deg) translateZ(28px)}.face-4{transform:rotateY(-90deg) translateZ(28px)}.face-5{transform:rotateX(90deg) translateZ(28px)}.face-6{transform:rotateX(-90deg) translateZ(28px)}
.face-1 i{grid-area:2/2}.face-2 i:nth-child(1){grid-area:1/1}.face-2 i:nth-child(2){grid-area:3/3}
.face-3 i:nth-child(1){grid-area:1/1}.face-3 i:nth-child(2){grid-area:2/2}.face-3 i:nth-child(3){grid-area:3/3}
.face-4 i:nth-child(1){grid-area:1/1}.face-4 i:nth-child(2){grid-area:1/3}.face-4 i:nth-child(3){grid-area:3/1}.face-4 i:nth-child(4){grid-area:3/3}
.face-5 i:nth-child(1){grid-area:1/1}.face-5 i:nth-child(2){grid-area:1/3}.face-5 i:nth-child(3){grid-area:2/2}.face-5 i:nth-child(4){grid-area:3/1}.face-5 i:nth-child(5){grid-area:3/3}
.face-6 i:nth-child(1){grid-area:1/1}.face-6 i:nth-child(2){grid-area:2/1}.face-6 i:nth-child(3){grid-area:3/1}.face-6 i:nth-child(4){grid-area:1/3}.face-6 i:nth-child(5){grid-area:2/3}.face-6 i:nth-child(6){grid-area:3/3}
@keyframes cubeRoll{0%{transform:rotateX(0) rotateY(0)}50%{transform:rotateX(420deg) rotateY(520deg) scale(1.15)}100%{transform:rotateX(720deg) rotateY(900deg)}}

/* Reward card life */
.reward-scene .scene-copy{transition:.4s}
.reward-scene:hover .scene-copy{transform:translateY(-8px);box-shadow:0 25px 80px #000,0 0 36px #0aaee833}
.reward-scene:after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(115deg,transparent 30%,rgba(64,207,255,.08) 47%,transparent 64%);transform:translateX(-100%);transition:transform 1.1s}
.reward-scene:hover:after{transform:translateX(100%)}
.scene-ui,.vs-trophy-wrap img{animation:rewardFloat 4s ease-in-out infinite}
@keyframes rewardFloat{50%{transform:translateY(-10px)}}

/* Reduce motion */
@media(prefers-reduced-motion:reduce){.meteor,.cursor-spark,.scene-ui,.vs-trophy-wrap img{animation:none!important}.parallax-layer{transform:none!important}}

.item-orbit-section{min-height:900px;padding:80px 5vw}.item-orbit-layout{position:relative;z-index:3;width:min(1450px,94vw);margin:auto;display:grid;grid-template-columns:1.15fr .85fr;align-items:center;gap:70px}.item-orbit-stage{position:relative;min-height:700px;display:grid;place-items:center;isolation:isolate}.orbit-core{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:170px;height:170px;border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;background:radial-gradient(circle,#126f9c 0,#05263a 42%,#02080e 72%);border:1px solid #52d6ff;box-shadow:0 0 55px #149edc66,inset 0 0 40px #39cfff33;z-index:3}.orbit-core strong{font:700 27px Cinzel;letter-spacing:4px;color:#eafcff;text-shadow:0 0 18px #4dd8ff}.orbit-core small{color:#7fcff3}.core-glow{position:absolute;inset:-35px;border-radius:50%;background:radial-gradient(circle,#23c3ff26,transparent 67%);animation:corePulse 2.8s ease-in-out infinite}.orbit-ring{position:absolute;left:50%;top:50%;border-radius:50%;pointer-events:none}.ring-a{width:390px;height:390px;margin:-195px;border:1px solid #35c9ff88;box-shadow:0 0 35px #18aee944;animation:ringSpin 19s linear infinite}.ring-b{width:520px;height:520px;margin:-260px;border:1px dashed #dfba5866;animation:ringSpinReverse 26s linear infinite}.ring-c{width:650px;height:650px;margin:-325px;border:1px solid #2aa9e533;animation:ringSpin 34s linear infinite}@keyframes ringSpin{to{transform:rotate(360deg)}}@keyframes ringSpinReverse{to{transform:rotate(-360deg)}}@keyframes corePulse{50%{transform:scale(1.1);opacity:.55}}.orbit-item{--count:17;--angle:calc(360deg / var(--count) * var(--i));--radius:290px;position:absolute;left:50%;top:50%;width:68px;height:68px;margin:-34px;transform:rotate(var(--angle)) translateX(var(--radius)) rotate(calc(var(--angle) * -1));border:1px solid #35bde466;border-radius:14px;padding:8px;background:linear-gradient(145deg,#061928e8,#020a11ee);box-shadow:0 10px 22px #000b,0 0 12px #1fb8ec22;cursor:pointer;z-index:5;animation:itemOrbitFloat 3.8s ease-in-out infinite;animation-delay:calc(var(--i) * -.17s);transition:.25s}.orbit-item img{width:100%;height:100%;object-fit:contain;image-rendering:auto;filter:drop-shadow(0 6px 6px #000);transition:.25s}.orbit-item:before{content:"";position:absolute;inset:-12px;border-radius:50%;background:radial-gradient(circle,#47d9ff55 0,#19aee922 38%,transparent 70%);opacity:0;transform:scale(.7);transition:.3s;z-index:-1}.orbit-item:hover,.orbit-item.active{border-color:#8be9ff;box-shadow:0 12px 32px #000c,0 0 24px #2ac8ff99;z-index:20}.orbit-item:hover:before,.orbit-item.active:before{opacity:1;transform:scale(1.35)}.orbit-item:hover img,.orbit-item.active img{transform:scale(1.18);filter:drop-shadow(0 7px 7px #000) drop-shadow(0 0 10px #4fdcff)}@keyframes itemOrbitFloat{0%,100%{margin-top:-34px}50%{margin-top:-42px}}.item-info-panel>h2{font-size:clamp(46px,6vw,78px);margin:10px 0 25px}.item-info-card{min-height:330px;padding:40px 42px;background:linear-gradient(145deg,#03121edd,#061a29e8);border:1px solid #2abbe755;border-left:4px solid var(--blue);box-shadow:0 30px 80px #0009,0 0 35px #0a8fc52b}.item-info-card.flash{animation:infoFlash .38s ease}.item-info-card small{color:#40c9ff;letter-spacing:4px;font-weight:700}.item-info-card h3{font:700 clamp(27px,3vw,42px) Cinzel;margin:16px 0;color:#fff}.item-info-card p{font-size:22px;line-height:1.55;color:#bfd1dc;min-height:80px}.info-line{height:1px;background:linear-gradient(90deg,#3dd4ff,transparent);margin:22px 0}.item-info-card ul{list-style:none;padding:0}.item-info-card li{padding:9px 0;color:#8fd9f5;border-bottom:1px solid #2bb9e72b}@keyframes infoFlash{0%{transform:translateX(8px);box-shadow:0 0 50px #2acfff77}100%{transform:none}}@media(max-width:1100px){.item-orbit-layout{grid-template-columns:1fr;gap:20px}.item-orbit-stage{min-height:700px}.item-info-panel{max-width:760px;margin:auto;width:100%}}@media(max-width:760px){.item-orbit-stage{min-height:560px}.orbit-item{--radius:220px;width:54px;height:54px;margin:-27px}.ring-a{width:300px;height:300px;margin:-150px}.ring-b{width:400px;height:400px;margin:-200px}.ring-c{width:500px;height:500px;margin:-250px}.orbit-core{width:135px;height:135px}}@media(max-width:560px){.item-orbit-stage{min-height:470px}.orbit-item{--radius:180px;width:44px;height:44px;margin:-22px;padding:5px}.ring-a{width:250px;height:250px;margin:-125px}.ring-b{width:330px;height:330px;margin:-165px}.ring-c{width:410px;height:410px;margin:-205px}.orbit-core{width:110px;height:110px}.item-info-card{padding:28px 24px}}


/* V10 electric borders */
.electric-card,.electric-grid article{
  position:relative;
}
.electric-card:before,.electric-grid article:before{
  content:"";position:absolute;inset:-1px;pointer-events:none;z-index:5;
  background:
    linear-gradient(90deg,transparent 0 8%,#4edcff 11%,transparent 14% 46%,#1aa8ff 49%,transparent 53% 100%) top/180% 1px no-repeat,
    linear-gradient(180deg,transparent 0 22%,#5ce5ff 25%,transparent 29% 70%,#149cff 74%,transparent 78% 100%) right/1px 180% no-repeat,
    linear-gradient(270deg,transparent 0 18%,#39cfff 21%,transparent 24% 62%,#73e7ff 66%,transparent 70% 100%) bottom/180% 1px no-repeat,
    linear-gradient(0deg,transparent 0 28%,#31c7ff 31%,transparent 35% 76%,#52dcff 80%,transparent 84% 100%) left/1px 180% no-repeat;
  opacity:0;filter:drop-shadow(0 0 4px #2ac8ff);
}
.electric-card:hover:before,.electric-grid article:hover:before{
  opacity:1;animation:electricBorder .8s linear infinite;
}
@keyframes electricBorder{
  to{background-position:180% 0,100% 180%,0 100%,0 0}
}

/* Portal transition */
.portal-overlay{
  position:fixed;inset:0;z-index:9998;display:flex;flex-direction:column;align-items:center;justify-content:center;
  background:radial-gradient(circle at center,#0b6fa4 0,#03111d 32%,#01060a 70%);
  opacity:0;visibility:hidden;pointer-events:none;transition:.45s
}
.portal-overlay.active{opacity:1;visibility:visible;pointer-events:auto}
.portal-ring{position:relative;width:min(460px,70vw);height:min(460px,70vw);border-radius:50%;border:3px solid #57dfff;box-shadow:0 0 45px #2fcaff,0 0 120px #0d78ba,inset 0 0 60px #25bcff88;animation:portalPulse 1.4s ease-in-out infinite}
.portal-ring:before{content:"";position:absolute;inset:12%;border-radius:50%;border:2px dashed #c2f6ff;animation:portalSpin 2s linear infinite}
.portal-ring:after{content:"";position:absolute;inset:25%;border-radius:50%;background:radial-gradient(circle,#e8fbff 0,#45d8ff 18%,#0b7aba 48%,transparent 70%);filter:blur(2px);animation:portalCore 1s ease-in-out infinite alternate}
.portal-ring i{position:absolute;left:50%;top:50%;width:88%;height:3px;background:linear-gradient(90deg,transparent,#5ce6ff,transparent);transform-origin:center}
.portal-ring i:nth-child(1){transform:translate(-50%,-50%) rotate(20deg)}.portal-ring i:nth-child(2){transform:translate(-50%,-50%) rotate(140deg)}.portal-ring i:nth-child(3){transform:translate(-50%,-50%) rotate(260deg)}
.portal-overlay strong{margin-top:24px;font:700 38px Cinzel;letter-spacing:8px}.portal-overlay span{margin-top:8px;color:#9adcf6;letter-spacing:3px}
@keyframes portalSpin{to{transform:rotate(360deg)}}@keyframes portalPulse{50%{transform:scale(1.05);box-shadow:0 0 65px #63e5ff,0 0 150px #0e84c7,inset 0 0 80px #3acfff99}}@keyframes portalCore{to{transform:scale(1.15);opacity:.72}}

/* Crystal mouse trail */
.crystal-trail-layer{position:fixed;inset:0;z-index:151;pointer-events:none}
.crystal-shard{position:absolute;width:10px;height:18px;background:linear-gradient(160deg,#d9fbff,#39cfff 45%,#095c94 100%);clip-path:polygon(50% 0,100% 35%,72% 100%,20% 82%,0 32%);filter:drop-shadow(0 0 8px #37d6ff);animation:crystalFade .9s ease-out forwards}
@keyframes crystalFade{to{transform:translate(var(--dx),var(--dy)) rotate(var(--rot)) scale(.2);opacity:0}}

/* Large shooting stars */
.big-shooting-star{position:absolute;width:430px;height:4px;background:linear-gradient(90deg,transparent,#43d7ff,#fff);filter:drop-shadow(0 0 14px #30c8ff);transform:rotate(-22deg);animation:bigStarFly 2.2s linear forwards}
.big-shooting-star:after{content:"";position:absolute;right:-6px;top:-5px;width:14px;height:14px;border-radius:50%;background:white;box-shadow:0 0 28px #5be0ff}
@keyframes bigStarFly{from{transform:translate(0,0) rotate(-22deg);opacity:0}8%{opacity:1}to{transform:translate(-145vw,85vh) rotate(-22deg);opacity:0}}

/* Metin showcase */
.metin-showcase{position:absolute;inset:0;z-index:2;pointer-events:none}
.metin-wrap{position:absolute;top:50%;width:260px;transform:translateY(-50%);animation:metinFloat 4.5s ease-in-out infinite}
.metin-wrap img{width:100%;filter:drop-shadow(0 24px 28px #000) drop-shadow(0 0 18px currentColor)}
.metin-left{left:7%;color:#65ff8d}.metin-right{right:7%;color:#6fd6ff;animation-delay:-2.1s}
.metin-particles{position:absolute;inset:-40px;border-radius:50%;background:
  radial-gradient(circle at 15% 20%,currentColor 0 2px,transparent 3px),
  radial-gradient(circle at 75% 30%,currentColor 0 2px,transparent 3px),
  radial-gradient(circle at 30% 78%,currentColor 0 2px,transparent 3px),
  radial-gradient(circle at 85% 70%,currentColor 0 2px,transparent 3px),
  radial-gradient(circle at 50% 8%,#fff 0 1px,transparent 2px);
  background-size:90px 90px,120px 120px,110px 110px,130px 130px,80px 80px;
  animation:metinSpark 6s linear infinite;filter:drop-shadow(0 0 6px currentColor);opacity:.72
}
.metin-particles.green{color:#69ff84}.metin-particles.blue{color:#5ed8ff}
.metin .scene-copy{position:relative;z-index:4}
@keyframes metinFloat{50%{transform:translateY(calc(-50% - 12px)) rotate(2deg)}}@keyframes metinSpark{to{background-position:90px 90px,-120px 120px,110px -110px,-130px 130px,80px -80px}}
@media(max-width:900px){.metin-wrap{width:180px;opacity:.8}.metin-left{left:2%}.metin-right{right:2%}}
@media(max-width:600px){.metin-wrap{width:130px;top:28%}.metin .scene-copy{margin-top:180px}}

/* V11 interactive boss tracker */
.boss-tracker-widget{position:relative;z-index:3;width:min(660px,92vw);margin:auto}
.boss-screen{position:relative;width:100%;aspect-ratio:603/603;background:#050807;border:1px solid #397f63;box-shadow:0 28px 55px #000c,0 0 28px #0aa9752a;overflow:hidden}
.boss-screen>img{width:100%;height:100%;object-fit:contain;display:block;transition:opacity .24s ease,filter .24s ease,transform .34s ease}
.boss-screen.changing>img{opacity:.25;filter:blur(2px) brightness(1.35);transform:scale(1.015)}
.boss-hotspots{position:absolute;inset:0;z-index:5;pointer-events:none}
.boss-hotspots button{--top-start:6.7%;--row-gap:8.25%;position:absolute;left:3.1%;top:calc(var(--top-start) + var(--row) * var(--row-gap));width:50%;height:7.4%;border:0;background:transparent;cursor:pointer;pointer-events:auto}
.boss-hotspots button:focus-visible{outline:2px solid #71f7ba;outline-offset:-2px}
.boss-hotspots button:hover:not(.unavailable){background:linear-gradient(90deg,rgba(21,210,114,.12),rgba(21,210,114,.03));box-shadow:inset 0 0 0 1px rgba(74,255,165,.45)}
.boss-hotspots button.unavailable{cursor:not-allowed}
.boss-hotspots button.unavailable:hover:after{content:"Görsel bekleniyor";position:absolute;right:8%;top:50%;transform:translateY(-50%);padding:4px 8px;background:#120b0be8;color:#d58f8f;border:1px solid #8f3b3b;font-size:11px}
.boss-change-fx{position:absolute;inset:0;z-index:4;pointer-events:none;opacity:0;background:radial-gradient(circle at 70% 35%,rgba(65,255,170,.18),transparent 26%),linear-gradient(90deg,transparent 48%,rgba(85,255,190,.13) 60%,transparent 76%)}
.boss-change-fx.active{animation:bossFlash .48s ease}
@keyframes bossFlash{0%{opacity:0;transform:translateX(-15%)}40%{opacity:1}100%{opacity:0;transform:translateX(15%)}}
.boss-selection-label{display:flex;align-items:center;gap:14px;margin-top:14px;padding:12px 16px;background:linear-gradient(90deg,#04140fe8,#061b19e8);border-left:3px solid #32dd8f;border-top:1px solid #225d49}
.boss-selection-label span{font-size:10px;letter-spacing:3px;color:#54eca5}
.boss-selection-label b{font-family:Cinzel;color:#fff}
.boss-selection-label small{margin-left:auto;color:#7f9c91}
@media(max-width:700px){.boss-selection-label{flex-wrap:wrap}.boss-selection-label small{width:100%;margin-left:0}}

/* V14 Zindan dekoru */
.zindan-copy-wrap{position:relative;min-height:610px;display:flex;align-items:center;justify-content:center;isolation:isolate}
.zindan-boss-decor{position:absolute;inset:0;z-index:1;pointer-events:none;overflow:hidden}
.zindan-boss{position:absolute;bottom:0;width:245px;opacity:.4;filter:drop-shadow(0 22px 25px #000);animation:bossIdle 4.8s ease-in-out infinite}
.zindan-boss img{width:100%}
.jotun-decor{right:0;color:#4bd8ff}
.devil-decor{left:0;width:205px;color:#ab6cff;animation-delay:-2.2s}
.boss-aura{position:absolute;inset:-22px;border-radius:50%;background:
radial-gradient(circle at 20% 25%,currentColor 0 2px,transparent 3px),
radial-gradient(circle at 78% 20%,currentColor 0 1.8px,transparent 3px),
radial-gradient(circle at 30% 80%,currentColor 0 1.6px,transparent 3px),
radial-gradient(circle at 86% 74%,currentColor 0 2px,transparent 3px);
background-size:100px 100px,130px 130px,115px 115px,145px 145px;
filter:drop-shadow(0 0 7px currentColor);opacity:.45;animation:bossAuraMove 8s linear infinite}
.boss-aura.blue{color:#51d8ff}.boss-aura.violet{color:#a873ff}
.zindan-copy-wrap .system-copy{position:relative;z-index:3;background:rgba(2,12,20,.88);backdrop-filter:blur(3px)}
@keyframes bossIdle{50%{transform:translateY(-8px) scale(1.012)}}
@keyframes bossAuraMove{to{background-position:100px -100px,-130px 130px,115px -115px,-145px 145px}}
@media(max-width:800px){.zindan-boss{width:170px;opacity:.26}.devil-decor{width:145px}.zindan-copy-wrap{min-height:520px}}

/* V14 yalnız item adı tooltip */
.boss-drop-hotspots{position:absolute;left:59.4%;top:59.1%;width:36.8%;height:26.4%;z-index:7;pointer-events:none}
.drop-hotspot{position:absolute;width:15.1%;height:23.5%;border:0;background:transparent;pointer-events:auto;cursor:help}
.drop-hotspot:hover{box-shadow:inset 0 0 0 1px rgba(110,231,255,.75),0 0 10px rgba(56,207,255,.6)}
.boss-item-tooltip{position:absolute;z-index:12;min-width:150px;max-width:240px;padding:9px 12px;background:#0b0d10f2;border:1px solid #8e753f;box-shadow:0 12px 30px #000c;pointer-events:none;opacity:0;transform:translateY(5px);transition:.14s}
.boss-item-tooltip.show{opacity:1;transform:none}
.boss-item-tooltip b{color:#ffe39a;font-family:Cinzel;font-size:12px}


/* V15 — Ronark reward scene */
.ronark-reward-live{
  min-height:720px;
  isolation:isolate;
}
.ronark-reward-live .scene-bg{
  background-position:center 30%!important;
  background-size:cover!important;
  animation:ronarkSceneBreath 8s ease-in-out infinite;
}
.ronark-reward-live .scene-bg:after{
  background:
    radial-gradient(circle at 47% 46%,transparent 0 18%,rgba(2,7,13,.12) 42%,rgba(2,7,13,.78) 100%),
    linear-gradient(90deg,rgba(2,7,13,.86),rgba(2,7,13,.22) 42%,rgba(2,7,13,.7));
}
.ronark-reward-live .scene-copy{
  margin-left:auto;
  margin-right:3%;
  max-width:560px;
  background:linear-gradient(135deg,rgba(3,15,25,.9),rgba(13,16,27,.82));
  border-left-color:#5ed7ff;
  backdrop-filter:blur(6px);
}
.ronark-boss-glow{
  position:absolute;
  z-index:2;
  left:36%;
  top:22%;
  width:320px;
  height:440px;
  border-radius:48%;
  background:radial-gradient(ellipse,#51d8ff1f 0,#8d66ff14 35%,#ff9d3d0d 52%,transparent 72%);
  filter:blur(8px);
  animation:ronarkGlowPulse 4.2s ease-in-out infinite;
  pointer-events:none;
}
.ronark-particle-field{
  position:absolute;
  inset:0;
  z-index:3;
  pointer-events:none;
  overflow:hidden;
}
.ronark-particle-field i{
  position:absolute;
  width:7px;
  height:7px;
  border-radius:50%;
  opacity:.75;
  animation:ronarkParticle 6s linear infinite;
}
.ronark-particle-field i:nth-child(1){left:28%;top:74%;background:#53d8ff;box-shadow:0 0 12px #53d8ff;animation-delay:-.5s}
.ronark-particle-field i:nth-child(2){left:35%;top:82%;background:#9f7cff;box-shadow:0 0 12px #9f7cff;animation-delay:-2s}
.ronark-particle-field i:nth-child(3){left:42%;top:76%;background:#ffb34f;box-shadow:0 0 12px #ffb34f;animation-delay:-3.2s}
.ronark-particle-field i:nth-child(4){left:49%;top:85%;background:#4df0bd;box-shadow:0 0 12px #4df0bd;animation-delay:-1.2s}
.ronark-particle-field i:nth-child(5){left:56%;top:72%;background:#58dfff;box-shadow:0 0 12px #58dfff;animation-delay:-4.1s}
.ronark-particle-field i:nth-child(6){left:31%;top:60%;background:#ff8e45;box-shadow:0 0 12px #ff8e45;animation-delay:-2.7s}
.ronark-particle-field i:nth-child(7){left:51%;top:58%;background:#8e7cff;box-shadow:0 0 12px #8e7cff;animation-delay:-.9s}
.ronark-particle-field i:nth-child(8){left:45%;top:66%;background:#5ae5ff;box-shadow:0 0 12px #5ae5ff;animation-delay:-3.8s}

@keyframes ronarkSceneBreath{
  0%,100%{transform:scale(1.015)}
  50%{transform:scale(1.045) translateY(-5px)}
}
@keyframes ronarkGlowPulse{
  50%{transform:scale(1.08);opacity:.62}
}
@keyframes ronarkParticle{
  0%{transform:translateY(0) translateX(0) scale(.8);opacity:0}
  15%{opacity:.8}
  70%{opacity:.65}
  100%{transform:translateY(-220px) translateX(35px) scale(.2);opacity:0}
}

/* V15 — Larger transformation area */
.transforms{
  padding-top:88px!important;
  padding-bottom:88px!important;
}
.transform-row{
  max-width:1040px!important;
  padding:28px 30px!important;
  margin:22px auto!important;
}
.transform-row h3{
  font-size:22px!important;
  margin-bottom:20px!important;
}
.transform-chain{
  gap:20px!important;
}
.item-stage{
  width:176px!important;
  height:224px!important;
  perspective:800px;
  transition:transform .28s ease,box-shadow .28s ease,border-color .28s ease;
}
.compact .item-stage{
  height:180px!important;
}
.item-stage img{
  max-height:175px!important;
  max-width:118px!important;
  transition:transform .22s ease,filter .22s ease!important;
  transform-style:preserve-3d;
}
.transform-chain figcaption{
  font-size:13px!important;
  margin-top:10px!important;
}
.arrow{
  font-size:34px!important;
}
.transform-chain figure{
  transition:transform .25s ease;
}
.transform-chain figure:hover{
  transform:translateY(-8px);
}
.transform-chain figure:hover .item-stage{
  border-color:#8feaff!important;
  box-shadow:
    0 18px 40px #000b,
    0 0 28px #3bd1ff99,
    inset 0 0 32px #1ca8df2e;
  transform:rotateX(4deg) rotateY(-5deg) scale(1.035);
}
.transform-chain figure:hover .item-stage:before{
  content:"";
  position:absolute;
  inset:-22px;
  z-index:-1;
  border-radius:50%;
  background:radial-gradient(circle,#4bdcff40 0,#138fcc1c 38%,transparent 70%);
  animation:itemAuraPulse 1.5s ease-in-out infinite;
}
.transform-chain figure:hover .item-stage img{
  transform:scale(1.12) rotateY(7deg);
  filter:drop-shadow(0 16px 12px #000) drop-shadow(0 0 16px #5ee1ff)!important;
}
@keyframes itemAuraPulse{
  50%{transform:scale(1.12);opacity:.55}
}

@media(max-width:900px){
  .ronark-reward-live{min-height:650px}
  .ronark-reward-live .scene-copy{margin:320px auto 0;max-width:88%}
  .ronark-boss-glow{left:50%;transform:translateX(-50%);top:10%;width:240px;height:340px}
  .item-stage{width:140px!important;height:185px!important}
  .item-stage img{max-height:140px!important;max-width:94px!important}
}
@media(max-width:600px){
  .transform-row{padding:18px 8px!important}
  .transform-chain{gap:8px!important}
  .item-stage{width:98px!important;height:132px!important}
  .compact .item-stage{height:112px!important}
  .item-stage img{max-height:95px!important;max-width:65px!important}
  .transform-chain figcaption{font-size:9px!important}
  .arrow{font-size:20px!important}
}


/* V16 remove boss drop tooltips */
.boss-drop-hotspots,.boss-item-tooltip{display:none!important}

/* Cleaner pseudo-3D presentation for low-resolution item sprites */
.transform-row{
  background:
    radial-gradient(circle at 50% 25%,rgba(39,190,255,.09),transparent 38%),
    linear-gradient(145deg,rgba(5,23,37,.97),rgba(2,10,17,.97))!important;
  border-color:rgba(75,205,255,.34)!important;
}
.item-stage{
  width:190px!important;
  height:245px!important;
  background:
    radial-gradient(circle at 50% 38%,rgba(89,222,255,.22),transparent 36%),
    linear-gradient(145deg,#0a2638,#03101a 62%,#071d2a)!important;
  border:1px solid rgba(102,222,255,.65)!important;
  box-shadow:
    inset 0 0 34px rgba(34,181,235,.14),
    0 24px 45px rgba(0,0,0,.55);
  transform-style:preserve-3d;
}
.compact .item-stage{height:200px!important}
.item-stage:after{
  inset:9px!important;
  border:1px solid rgba(228,190,91,.28)!important;
  box-shadow:inset 0 0 18px rgba(228,190,91,.08);
}
.item-stage img{
  max-height:188px!important;
  max-width:126px!important;
  image-rendering:auto!important;
  filter:
    drop-shadow(0 18px 14px rgba(0,0,0,.9))
    drop-shadow(0 0 11px rgba(95,225,255,.72))!important;
  transform:translateZ(26px);
}
.transform-chain figure:hover .item-stage img{
  transform:translateZ(44px) scale(1.16) rotateY(8deg)!important;
}
.transform-chain figcaption{
  font-size:14px!important;
  letter-spacing:.4px;
}
@media(max-width:900px){
  .item-stage{width:150px!important;height:195px!important}
  .item-stage img{max-height:148px!important;max-width:98px!important}
}
@media(max-width:600px){
  .item-stage{width:102px!important;height:140px!important}
  .compact .item-stage{height:120px!important}
  .item-stage img{max-height:100px!important;max-width:68px!important}
}

/* Metin click-to-break */
.metin-breakable{
  border:0;background:transparent;padding:0;cursor:pointer;
  color:inherit;
}
.metin-breakable:focus-visible{outline:2px solid #74e7ff;outline-offset:10px}
.metin-breakable .metin-cracks{
  position:absolute;inset:10% 15%;opacity:0;pointer-events:none;
  background:
    linear-gradient(72deg,transparent 44%,#d8fbff 46% 48%,transparent 50%) 45% 35%/60% 42% no-repeat,
    linear-gradient(112deg,transparent 45%,#75ddff 47% 49%,transparent 51%) 58% 60%/72% 55% no-repeat,
    linear-gradient(25deg,transparent 46%,#fff 48% 49%,transparent 51%) 38% 74%/54% 45% no-repeat;
  filter:drop-shadow(0 0 6px currentColor);
}
.metin-breakable.breaking img{animation:metinBreak .72s ease}
.metin-breakable.breaking .metin-cracks{animation:crackFlash .72s ease}
.metin-breakable.breaking:after{
  content:"+50 TL";position:absolute;left:50%;top:38%;z-index:6;
  transform:translate(-50%,-50%);
  font:800 26px Cinzel;color:#ffe287;text-shadow:0 0 15px #ffca3d,0 4px 8px #000;
  animation:rewardRise 1s ease forwards
}
@keyframes metinBreak{
  0%{transform:scale(1)}
  28%{transform:scale(1.08) rotate(-2deg)}
  48%{transform:scale(.93) rotate(3deg);filter:brightness(1.7) drop-shadow(0 0 24px currentColor)}
  100%{transform:scale(1)}
}
@keyframes crackFlash{0%,100%{opacity:0}32%,62%{opacity:1}}
@keyframes rewardRise{0%{opacity:0;transform:translate(-50%,10px) scale(.7)}25%{opacity:1}100%{opacity:0;transform:translate(-50%,-80px) scale(1.15)}}

/* Silent blue dragon fly-by */
.dragon-flyby{
  position:fixed;left:110%;top:12%;z-index:90;width:min(520px,40vw);
  pointer-events:none;opacity:0;
  filter:drop-shadow(0 20px 24px #000) drop-shadow(0 0 24px #3fd8ff);
}
.dragon-flyby img{width:100%;animation:dragonWing 1.4s ease-in-out infinite}
.dragon-flyby.active{animation:dragonCross 7s linear forwards}
@keyframes dragonCross{
  0%{left:110%;top:18%;opacity:0;transform:scale(.65) rotate(-5deg)}
  10%{opacity:.92}
  50%{top:8%;transform:scale(1) rotate(2deg)}
  100%{left:-55%;top:20%;opacity:0;transform:scale(.72) rotate(-3deg)}
}
@keyframes dragonWing{50%{transform:translateY(-8px) scaleY(.97)}}

/* Animated energy edges */
.energy-card,.energy-grid article{
  position:relative;overflow:hidden
}
.energy-card:after,.energy-grid article:after{
  content:"";position:absolute;inset:-1px;pointer-events:none;z-index:8;
  background:
    linear-gradient(90deg,transparent,#64e2ff,transparent) top left/42% 1px no-repeat,
    linear-gradient(180deg,transparent,#38cfff,transparent) top right/1px 42% no-repeat,
    linear-gradient(270deg,transparent,#8cecff,transparent) bottom right/42% 1px no-repeat,
    linear-gradient(0deg,transparent,#2fbfff,transparent) bottom left/1px 42% no-repeat;
  opacity:.2;animation:energyEdge 4.4s linear infinite
}
.energy-card:hover:after,.energy-grid article:hover:after{
  opacity:1;filter:drop-shadow(0 0 6px #42d8ff)
}
@keyframes energyEdge{
  0%{background-position:-45% 0,100% -45%,145% 100%,0 145%}
  100%{background-position:145% 0,100% 145%,-45% 100%,0 -45%}
}

/* Cinematic opening title */
.cinematic-title span,.cinematic-title b{
  display:block;opacity:0
}
.hero-content.visible .cinematic-title span{
  animation:heroKickerIn 1.05s cubic-bezier(.2,.8,.2,1) .25s forwards
}
.hero-content.visible .cinematic-title b{
  animation:heroDateIn 1.25s cubic-bezier(.15,.85,.2,1) .65s forwards
}
.cinematic-title b{font:inherit}
@keyframes heroKickerIn{
  0%{opacity:0;letter-spacing:24px;filter:blur(10px);transform:translateY(-22px)}
  100%{opacity:1;letter-spacing:10px;filter:none;transform:none}
}
@keyframes heroDateIn{
  0%{opacity:0;transform:scale(1.18) translateY(18px);filter:blur(14px);text-shadow:0 0 45px #5ce3ff}
  55%{opacity:1}
  100%{opacity:1;transform:none;filter:none;text-shadow:0 4px 25px #000}
}


/* V17 remove blue dragon */
.dragon-flyby{display:none!important}

/* Persistent subtle glow after cinematic entrance */
.hero-content.visible .cinematic-title span{
  animation:
    heroKickerIn 1.05s cubic-bezier(.2,.8,.2,1) .25s forwards,
    heroTitleGlow 3.8s ease-in-out 1.5s infinite;
}
.hero-content.visible .cinematic-title b{
  animation:
    heroDateIn 1.25s cubic-bezier(.15,.85,.2,1) .65s forwards,
    heroDateGlow 4.2s ease-in-out 1.9s infinite;
}
@keyframes heroTitleGlow{
  0%,100%{
    text-shadow:0 0 8px rgba(82,219,255,.18),0 4px 22px #000;
    filter:brightness(1)
  }
  50%{
    text-shadow:0 0 18px rgba(88,224,255,.52),0 0 36px rgba(34,170,255,.22),0 4px 22px #000;
    filter:brightness(1.08)
  }
}
@keyframes heroDateGlow{
  0%,100%{
    text-shadow:0 0 10px rgba(227,185,87,.16),0 4px 25px #000;
    filter:brightness(1)
  }
  50%{
    text-shadow:0 0 20px rgba(255,218,126,.44),0 0 42px rgba(49,190,255,.18),0 4px 25px #000;
    filter:brightness(1.07)
  }
}

/* VS tournament video background */
.vs-video-scene{
  position:relative;
  min-height:700px;
  overflow:hidden;
  isolation:isolate;
}
.vs-bg-video{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  z-index:0;
  opacity:.62;
  filter:saturate(.9) contrast(1.08) brightness(.72);
}
.vs-video-shade{
  position:absolute;
  inset:0;
  z-index:1;
  background:
    radial-gradient(circle at 50% 45%,transparent 0 22%,rgba(2,7,13,.24) 52%,rgba(2,7,13,.82) 100%),
    linear-gradient(90deg,rgba(2,7,13,.76),rgba(2,7,13,.18) 46%,rgba(2,7,13,.68)),
    linear-gradient(to bottom,rgba(2,7,13,.22),rgba(2,7,13,.1) 40%,rgba(2,7,13,.78));
}
.vs-video-scene .scene-copy{
  position:relative;
  z-index:3;
  margin:0 auto;
  max-width:700px;
  text-align:center;
  background:linear-gradient(145deg,rgba(3,15,25,.88),rgba(6,21,34,.82));
  border-left:0;
  border-top:2px solid rgba(65,205,255,.55);
  backdrop-filter:blur(7px);
}
.vs-video-scene:before{
  content:"";
  position:absolute;
  inset:0;
  z-index:2;
  pointer-events:none;
  background:
    radial-gradient(circle at 30% 35%,rgba(41,190,255,.12),transparent 22%),
    radial-gradient(circle at 70% 62%,rgba(74,130,255,.11),transparent 26%);
  animation:vsVideoPulse 4.8s ease-in-out infinite;
}
@keyframes vsVideoPulse{
  50%{opacity:.55;transform:scale(1.025)}
}
@media(max-width:700px){
  .vs-video-scene{min-height:620px}
  .vs-video-scene .scene-copy{max-width:92%;margin-top:260px}
}


/* V18 — Guild War video background */
.guild-video-scene{
  position:relative;
  min-height:700px;
  overflow:hidden;
  isolation:isolate;
}
.guild-bg-video{
  position:absolute;
  inset:0;
  z-index:0;
  width:100%;
  height:100%;
  object-fit:cover;
  opacity:.66;
  filter:saturate(.9) contrast(1.08) brightness(.7);
}
.guild-video-shade{
  position:absolute;
  inset:0;
  z-index:1;
  background:
    radial-gradient(circle at 52% 42%,transparent 0 22%,rgba(2,7,13,.24) 52%,rgba(2,7,13,.84) 100%),
    linear-gradient(90deg,rgba(2,7,13,.72),rgba(2,7,13,.14) 48%,rgba(2,7,13,.68)),
    linear-gradient(to bottom,rgba(2,7,13,.22),rgba(2,7,13,.08) 42%,rgba(2,7,13,.78));
}
.guild-video-scene .scene-copy{
  position:relative;
  z-index:3;
  margin-left:auto;
  max-width:620px;
  background:linear-gradient(145deg,rgba(3,15,25,.9),rgba(7,19,31,.84));
  border-left-color:#5fdcff;
  backdrop-filter:blur(7px);
}
.guild-video-scene:before{
  content:"";
  position:absolute;
  inset:0;
  z-index:2;
  pointer-events:none;
  background:
    radial-gradient(circle at 24% 35%,rgba(55,202,255,.1),transparent 22%),
    radial-gradient(circle at 78% 60%,rgba(90,113,255,.1),transparent 25%);
  animation:guildVideoPulse 5s ease-in-out infinite;
}
@keyframes guildVideoPulse{
  50%{opacity:.55;transform:scale(1.02)}
}

/* V18 — Transformation sizing and centered captions */
.transform-chain figure{
  display:flex!important;
  flex-direction:column;
  align-items:center!important;
  justify-content:flex-start;
  text-align:center!important;
}
.transform-chain figcaption{
  display:block!important;
  width:100%!important;
  max-width:190px!important;
  min-height:34px;
  margin:10px auto 0!important;
  padding:0 4px;
  text-align:center!important;
  line-height:1.25;
}
.weapon-row .item-stage{
  width:190px!important;
  height:245px!important;
}
.weapon-row .item-stage img{
  max-height:188px!important;
  max-width:126px!important;
}
.armor-row .item-stage{
  width:142px!important;
  height:178px!important;
}
.armor-row .item-stage img{
  max-height:128px!important;
  max-width:86px!important;
}
.shield-row .item-stage{
  width:126px!important;
  height:140px!important;
}
.shield-row .item-stage img{
  max-height:98px!important;
  max-width:74px!important;
}
.armor-row .transform-chain,
.shield-row .transform-chain{
  gap:16px!important;
}
.armor-row .arrow,
.shield-row .arrow{
  font-size:27px!important;
}
@media(max-width:900px){
  .weapon-row .item-stage{width:150px!important;height:195px!important}
  .weapon-row .item-stage img{max-height:148px!important;max-width:98px!important}
  .armor-row .item-stage{width:116px!important;height:150px!important}
  .armor-row .item-stage img{max-height:105px!important;max-width:72px!important}
  .shield-row .item-stage{width:104px!important;height:120px!important}
  .shield-row .item-stage img{max-height:80px!important;max-width:62px!important}
}
@media(max-width:600px){
  .weapon-row .item-stage{width:102px!important;height:140px!important}
  .weapon-row .item-stage img{max-height:100px!important;max-width:68px!important}
  .armor-row .item-stage{width:82px!important;height:106px!important}
  .armor-row .item-stage img{max-height:74px!important;max-width:52px!important}
  .shield-row .item-stage{width:74px!important;height:90px!important}
  .shield-row .item-stage img{max-height:59px!important;max-width:46px!important}
  .transform-chain figcaption{max-width:95px!important;font-size:9px!important;min-height:28px}
}

/* V18 — Cinematic final */
.cinematic-final{
  position:relative;
  min-height:760px;
  display:grid;
  place-items:center;
  overflow:hidden;
  padding:110px 20px 80px;
  background:
    radial-gradient(circle at 50% 48%,rgba(19,112,165,.3),transparent 34%),
    linear-gradient(180deg,#02070d,#041522 45%,#010407);
  isolation:isolate;
}
.cinematic-final:before{
  content:"";
  position:absolute;
  inset:0;
  z-index:0;
  background:
    linear-gradient(90deg,transparent 49.8%,rgba(63,211,255,.15) 50%,transparent 50.2%),
    linear-gradient(rgba(44,187,242,.04) 1px,transparent 1px);
  background-size:100% 100%,100% 48px;
  mask-image:linear-gradient(to bottom,transparent,black 24%,black 80%,transparent);
}
.final-runes{
  position:absolute;
  left:50%;
  top:48%;
  width:620px;
  height:620px;
  margin:-310px;
  border:1px solid rgba(68,205,255,.22);
  border-radius:50%;
  box-shadow:0 0 80px rgba(25,149,214,.15),inset 0 0 60px rgba(36,179,235,.08);
  animation:finalRuneSpin 28s linear infinite;
}
.final-runes:before,
.final-runes:after{
  content:"";
  position:absolute;
  border-radius:50%;
  border:1px dashed rgba(227,185,87,.22);
}
.final-runes:before{inset:68px;animation:finalRuneReverse 22s linear infinite}
.final-runes:after{inset:145px;border-style:solid;border-color:rgba(72,215,255,.18)}
.final-mist{
  position:absolute;
  z-index:1;
  left:-15%;
  width:130%;
  height:310px;
  background:
    radial-gradient(ellipse at 20% 55%,rgba(157,205,221,.16),transparent 29%),
    radial-gradient(ellipse at 50% 48%,rgba(84,151,181,.2),transparent 32%),
    radial-gradient(ellipse at 82% 58%,rgba(149,196,215,.14),transparent 30%);
  filter:blur(28px);
  pointer-events:none;
}
.mist-a{bottom:3%;animation:finalMistA 13s ease-in-out infinite}
.mist-b{bottom:18%;opacity:.58;transform:scaleX(-1);animation:finalMistB 17s ease-in-out infinite}
.final-content{
  position:relative;
  z-index:4;
  width:min(900px,92vw);
  text-align:center;
}
.final-content small{
  display:block;
  color:#65d8ff;
  letter-spacing:7px;
  font-weight:700;
}
.final-content h2{
  margin:18px 0 8px;
  font-size:clamp(48px,8vw,104px);
  letter-spacing:5px;
  background:linear-gradient(180deg,#fff,#80dcff 58%,#2678aa);
  -webkit-background-clip:text;
  color:transparent;
  text-shadow:0 0 38px rgba(45,194,255,.18);
  animation:finalTitleGlow 4.2s ease-in-out infinite;
}
.final-content strong{
  display:block;
  font:700 clamp(22px,3vw,34px) Cinzel;
  color:#f1ce78;
  letter-spacing:10px;
  text-shadow:0 0 18px rgba(238,190,76,.32);
}
.final-content img{
  width:min(520px,72vw);
  margin:24px auto 12px;
  filter:drop-shadow(0 0 28px rgba(29,168,232,.48));
}
.final-actions{
  display:flex;
  justify-content:center;
  gap:14px;
  flex-wrap:wrap;
  margin-top:18px;
}
@keyframes finalRuneSpin{to{transform:rotate(360deg)}}
@keyframes finalRuneReverse{to{transform:rotate(-360deg)}}
@keyframes finalMistA{50%{transform:translateX(7%) scale(1.08);opacity:.68}}
@keyframes finalMistB{50%{transform:scaleX(-1) translateX(8%) scale(1.1);opacity:.42}}
@keyframes finalTitleGlow{
  0%,100%{filter:brightness(1);text-shadow:0 0 28px rgba(45,194,255,.15)}
  50%{filter:brightness(1.08);text-shadow:0 0 46px rgba(45,194,255,.42)}
}
.cinematic-final + footer{
  padding:26px 20px 90px;
  background:#010407;
}
@media(max-width:700px){
  .guild-video-scene{min-height:620px}
  .guild-video-scene .scene-copy{max-width:92%;margin:260px auto 0}
  .cinematic-final{min-height:650px}
  .final-runes{width:430px;height:430px;margin:-215px}
}


/* V19 — Remove cinematic final */
.cinematic-final{display:none!important}

/* V19 — Patron Ranking cinematic scene */
.boss-ranking-live{
  position:relative;
  min-height:780px;
  overflow:hidden;
  isolation:isolate;
  background:#02070d;
}
.boss-ranking-bg{
  position:absolute;
  inset:0;
  z-index:0;
  background:
    radial-gradient(circle at 50% 34%,rgba(47,139,187,.22),transparent 27%),
    linear-gradient(180deg,#07131e,#02070d 72%);
}
.boss-ranking-bg:after{
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(to bottom,rgba(1,5,9,.18),rgba(1,5,9,.56) 65%,rgba(1,5,9,.95)),
    radial-gradient(circle at 30% 70%,rgba(43,191,241,.08),transparent 25%),
    radial-gradient(circle at 74% 58%,rgba(226,180,77,.06),transparent 25%);
}
.boss-ranking-moon{
  position:absolute;
  z-index:1;
  left:50%;
  top:10%;
  width:410px;
  height:410px;
  transform:translateX(-50%);
  border-radius:50%;
  background:
    radial-gradient(circle at 38% 34%,#e4f7ff,#87c9e7 44%,#306c92 68%,#092033 100%);
  box-shadow:0 0 65px rgba(93,208,255,.3),0 0 140px rgba(27,135,194,.16);
  opacity:.78;
}
.boss-ranking-moon:after{
  content:"";
  position:absolute;
  inset:0;
  border-radius:50%;
  background:
    radial-gradient(circle at 30% 30%,rgba(20,45,65,.18) 0 7%,transparent 8%),
    radial-gradient(circle at 67% 42%,rgba(15,42,60,.16) 0 10%,transparent 11%),
    radial-gradient(circle at 42% 72%,rgba(18,52,70,.18) 0 8%,transparent 9%);
}
.boss-ranking-runes{
  position:absolute;
  z-index:2;
  left:50%;
  top:8%;
  width:450px;
  height:450px;
  transform:translateX(-50%);
  border-radius:50%;
  border:1px solid rgba(92,220,255,.3);
  box-shadow:0 0 35px rgba(48,197,255,.15);
  animation:rankingRunes 24s linear infinite;
}
.boss-ranking-runes:before,
.boss-ranking-runes:after{
  content:"";
  position:absolute;
  border-radius:50%;
  border:1px dashed rgba(224,182,78,.24);
}
.boss-ranking-runes:before{inset:44px;animation:rankingRunesReverse 18s linear infinite}
.boss-ranking-runes:after{inset:92px;border-color:rgba(92,220,255,.18)}
.boss-ranking-runes i{
  position:absolute;
  left:50%;
  top:-5px;
  width:9px;
  height:9px;
  border-radius:50%;
  background:#84e8ff;
  box-shadow:0 0 14px #4fdcff;
}
.boss-ranking-runes i:nth-child(2){top:50%;left:auto;right:-5px}
.boss-ranking-runes i:nth-child(3){top:auto;bottom:-5px}

.boss-ranking-figure{
  position:absolute;
  z-index:3;
  left:50%;
  top:9%;
  width:min(470px,38vw);
  transform:translateX(-50%);
  animation:rankingBossIdle 4.6s ease-in-out infinite;
}
.boss-ranking-figure img{
  display:block;
  width:100%;
  filter:drop-shadow(0 34px 30px #000) drop-shadow(0 0 22px rgba(55,198,255,.26));
}
.boss-ranking-aura{
  position:absolute;
  inset:8% -12% -5%;
  z-index:-1;
  border-radius:50%;
  background:
    radial-gradient(ellipse,rgba(69,209,255,.2),rgba(53,124,176,.08) 44%,transparent 72%);
  filter:blur(10px);
  animation:rankingAura 3.8s ease-in-out infinite;
}
.boss-ranking-particles{
  position:absolute;
  inset:-20px;
  background:
    radial-gradient(circle at 18% 25%,#60deff 0 2px,transparent 3px),
    radial-gradient(circle at 76% 20%,#e5c265 0 1.7px,transparent 3px),
    radial-gradient(circle at 24% 72%,#51cfff 0 1.7px,transparent 3px),
    radial-gradient(circle at 85% 68%,#a48dff 0 2px,transparent 3px),
    radial-gradient(circle at 56% 8%,#fff 0 1px,transparent 2px);
  background-size:120px 120px,150px 150px,130px 130px,170px 170px,90px 90px;
  opacity:.54;
  animation:rankingParticles 8s linear infinite;
  pointer-events:none;
}
.boss-ranking-eyes{
  position:absolute;
  left:46.6%;
  top:15.4%;
  width:40px;
  height:10px;
}
.boss-ranking-eyes i{
  position:absolute;
  top:2px;
  width:5px;
  height:3px;
  border-radius:50%;
  background:#55dcff;
  box-shadow:0 0 7px #55dcff,0 0 16px #278dd8;
  animation:rankingEyeBlink 3.3s infinite;
}
.boss-ranking-eyes i:first-child{left:6px}
.boss-ranking-eyes i:last-child{right:6px}

.boss-ranking-copy{
  position:absolute;
  z-index:5;
  left:50%;
  bottom:5%;
  width:min(760px,88vw);
  transform:translateX(-50%);
  text-align:center;
  padding:32px 40px;
  background:linear-gradient(145deg,rgba(2,13,22,.92),rgba(6,22,34,.88));
  border-top:2px solid rgba(88,219,255,.58);
  border-left:0;
  backdrop-filter:blur(8px);
  box-shadow:0 28px 60px #000b,0 0 38px rgba(24,171,229,.12);
}
.boss-ranking-copy>span{
  color:#59d8ff;
  letter-spacing:5px;
}
.boss-ranking-copy h3{
  font-size:clamp(34px,5vw,64px);
  margin:12px 0 14px;
}
.boss-ranking-copy p{
  max-width:620px;
  margin:0 auto;
}
.ranking-stone{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:22px;
  flex-wrap:wrap;
  margin:26px auto 0;
  padding:16px 20px;
  max-width:590px;
  background:
    linear-gradient(145deg,rgba(13,31,43,.9),rgba(5,13,20,.94));
  border:1px solid rgba(225,183,74,.38);
  box-shadow:inset 0 0 25px rgba(56,185,231,.08),0 12px 25px #0008;
}
.ranking-stone small{
  color:#9fc4d7;
  letter-spacing:2px;
}
.ranking-stone strong{
  font:700 26px Cinzel;
  color:#f4cf72;
  text-shadow:0 0 14px rgba(244,207,114,.34);
}
.ranking-stone em{
  color:#7fa8bb;
  font-style:normal;
}

@keyframes rankingRunes{to{transform:translateX(-50%) rotate(360deg)}}
@keyframes rankingRunesReverse{to{transform:rotate(-360deg)}}
@keyframes rankingBossIdle{50%{transform:translateX(-50%) translateY(-9px) scale(1.012)}}
@keyframes rankingAura{50%{transform:scale(1.08);opacity:.62}}
@keyframes rankingParticles{to{background-position:120px -120px,-150px 150px,130px -130px,-170px 170px,90px -90px}}
@keyframes rankingEyeBlink{
  0%,43%,49%,100%{transform:scaleY(1);opacity:1}
  46%{transform:scaleY(.15);opacity:.35}
}

.simple-footer{
  display:flex;
  align-items:center;
  justify-content:center;
  flex-direction:column;
  gap:12px;
  padding:38px 20px 96px;
  background:#010407;
  border-top:1px solid rgba(44,174,226,.14);
}
.simple-footer img{
  width:210px;
  filter:drop-shadow(0 0 16px rgba(37,175,233,.22));
}
.simple-footer p{
  color:#718796;
}
.simple-footer div{
  display:flex;
  gap:18px;
}
.simple-footer a{
  color:#89c9e3;
  font-size:13px;
}

@media(max-width:800px){
  .boss-ranking-live{min-height:700px}
  .boss-ranking-moon{width:310px;height:310px}
  .boss-ranking-runes{width:345px;height:345px}
  .boss-ranking-figure{width:min(360px,66vw)}
  .boss-ranking-copy{padding:26px 22px}
  .ranking-stone{gap:10px}
}
@media(max-width:520px){
  .boss-ranking-live{min-height:650px}
  .boss-ranking-moon{top:12%;width:245px;height:245px}
  .boss-ranking-runes{top:10%;width:275px;height:275px}
  .boss-ranking-figure{top:13%;width:275px}
  .boss-ranking-copy{bottom:3%}
  .boss-ranking-copy h3{font-size:31px}
}


/* V21 — live glass boss ranking */
.boss-ranking-live{
  min-height:900px!important;
}
.live-boss-ranking{
  position:absolute;
  z-index:6;
  left:4.5%;
  top:10%;
  width:min(620px,44vw);
  padding:18px;
  background:
    linear-gradient(145deg,rgba(8,14,18,.76),rgba(20,18,13,.68));
  border:1px solid rgba(193,157,86,.42);
  box-shadow:
    0 28px 70px rgba(0,0,0,.62),
    inset 0 0 40px rgba(126,96,44,.08);
  backdrop-filter:blur(12px) saturate(.85);
  -webkit-backdrop-filter:blur(12px) saturate(.85);
  overflow:hidden;
}
.live-boss-ranking:before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    linear-gradient(90deg,transparent,rgba(255,221,153,.05),transparent);
  transform:translateX(-100%);
  animation:rankingGlassSweep 6s linear infinite;
}
.ranking-header{
  position:relative;
  display:flex;
  align-items:center;
  gap:12px;
  padding:8px 8px 16px;
  border-bottom:1px solid rgba(182,149,84,.28);
}
.ranking-header span{
  color:#68d9ff;
  font-size:10px;
  font-weight:700;
  letter-spacing:3px;
}
.ranking-header strong{
  margin-left:auto;
  color:#f4e8c9;
  font:700 17px Cinzel;
}
.ranking-live-dot{
  width:8px;
  height:8px;
  border-radius:50%;
  background:#4de283;
  box-shadow:0 0 12px #4de283;
  animation:rankingLivePulse 1.6s ease-in-out infinite;
}
.ranking-columns,
.ranking-row{
  display:grid;
  grid-template-columns:64px 1.4fr 90px 120px;
  align-items:center;
}
.ranking-columns{
  padding:13px 12px 9px;
  color:#78909e;
  font-size:10px;
  text-transform:uppercase;
  letter-spacing:1.2px;
}
.ranking-columns span:last-child{text-align:right}
.ranking-row{
  position:relative;
  min-height:60px;
  margin:7px 0;
  padding:0 12px;
  color:#d9e0e3;
  background:
    linear-gradient(90deg,rgba(18,27,32,.68),rgba(18,22,23,.44));
  border:1px solid rgba(131,115,78,.28);
  box-shadow:inset 0 0 22px rgba(255,255,255,.015);
  transition:
    transform .52s cubic-bezier(.2,.8,.2,1),
    background .35s,
    border-color .35s,
    box-shadow .35s;
}
.ranking-row:after{
  content:"";
  position:absolute;
  left:0;
  bottom:0;
  height:2px;
  width:var(--bar,60%);
  background:linear-gradient(90deg,#37c9ff,#e5bd61);
  opacity:.55;
  transition:width .65s ease;
}
.ranking-row.moving{
  transform:translateX(9px) scale(1.012);
  border-color:rgba(99,212,255,.58);
  background:linear-gradient(90deg,rgba(19,48,62,.72),rgba(28,26,18,.55));
  box-shadow:0 0 20px rgba(46,183,238,.14);
}
.rank-number{
  font:700 18px Cinzel;
  color:#f1ce77;
}
.rank-player{
  font-size:16px;
  color:#f3f5f6;
  letter-spacing:.2px;
}
.rank-kingdom{text-align:center}
.kingdom{
  display:inline-grid;
  place-items:center;
  width:34px;
  height:22px;
  border-radius:2px;
  box-shadow:inset 0 0 10px rgba(0,0,0,.35),0 3px 8px rgba(0,0,0,.36);
}
.kingdom:before{
  content:"";
  width:16px;
  height:11px;
  clip-path:polygon(50% 0,100% 30%,82% 100%,18% 100%,0 30%);
  background:rgba(0,0,0,.5);
}
.kingdom.blue{background:linear-gradient(145deg,#2739b2,#1b226d)}
.kingdom.yellow{background:linear-gradient(145deg,#d79619,#8a5108)}
.kingdom.red{background:linear-gradient(145deg,#c43131,#741515)}
.rank-kills{
  text-align:right;
  font:700 17px Cinzel;
  color:#e9d6a3;
  transition:color .3s,transform .3s;
}
.ranking-row.moving .rank-kills{
  color:#6be3ff;
  transform:scale(1.08);
}
.rank-1{
  border-color:rgba(231,192,97,.52);
  background:linear-gradient(90deg,rgba(66,50,22,.58),rgba(28,27,22,.48));
}
.rank-1 .rank-number{
  color:#ffd878;
  text-shadow:0 0 12px rgba(255,216,120,.28);
}
.rank-2{border-color:rgba(173,189,197,.36)}
.rank-3{border-color:rgba(190,116,72,.36)}
.ranking-footer{
  display:flex;
  justify-content:flex-end;
  gap:8px;
  margin-top:11px;
  color:#72818a;
  font-size:10px;
}
.ranking-footer b{
  color:#72d8ff;
  font-weight:600;
}
.boss-ranking-copy{
  left:auto!important;
  right:4.5%!important;
  bottom:8%!important;
  width:min(560px,42vw)!important;
  transform:none!important;
}
.ranking-stone-compact{
  margin-top:18px!important;
  max-width:470px!important;
  padding:12px 16px!important;
}
@keyframes rankingGlassSweep{
  to{transform:translateX(100%)}
}
@keyframes rankingLivePulse{
  50%{opacity:.45;transform:scale(1.4)}
}
@media(max-width:1100px){
  .boss-ranking-live{min-height:1080px!important}
  .live-boss-ranking{
    left:50%;
    top:8%;
    width:min(680px,90vw);
    transform:translateX(-50%);
  }
  .boss-ranking-figure{
    top:44%!important;
    width:min(420px,58vw)!important;
  }
  .boss-ranking-moon{
    top:42%!important;
  }
  .boss-ranking-runes{
    top:40%!important;
  }
  .boss-ranking-copy{
    left:50%!important;
    right:auto!important;
    bottom:3%!important;
    width:min(700px,90vw)!important;
    transform:translateX(-50%)!important;
  }
}
@media(max-width:650px){
  .live-boss-ranking{padding:10px}
  .ranking-header{flex-wrap:wrap}
  .ranking-header strong{width:100%;margin-left:0;font-size:14px}
  .ranking-columns,
  .ranking-row{
    grid-template-columns:45px 1fr 56px 82px;
  }
  .ranking-columns{font-size:8px;padding-left:8px;padding-right:8px}
  .ranking-row{padding:0 8px;min-height:52px}
  .rank-player{font-size:13px}
  .rank-kills{font-size:14px}
  .kingdom{width:28px;height:19px}
}


/* V25 — interactive Automatic Hunt demo */
.auto-hunt-demo{position:relative;width:min(510px,92vw);margin:auto}
.auto-hunt-media{position:relative;width:100%;aspect-ratio:244/478;max-height:520px;margin:auto;overflow:hidden;background:#050706;border:1px solid rgba(96,208,255,.34);box-shadow:0 26px 55px rgba(0,0,0,.65),0 0 28px rgba(39,173,229,.14)}
.auto-hunt-image,.auto-hunt-video{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;display:block;transition:opacity .34s ease,filter .34s ease,transform .42s ease}
.auto-hunt-image{z-index:1;background:#050706}
.auto-hunt-video{z-index:2;opacity:0;background:#000;pointer-events:none}
.auto-hunt-demo.playing .auto-hunt-image{opacity:0;filter:blur(2px);transform:scale(1.02)}
.auto-hunt-demo.playing .auto-hunt-video{opacity:1}
.auto-hunt-start{position:absolute;z-index:5;left:50%;bottom:0.65%;width:24%;height:6.4%;min-width:76px;transform:translateX(-50%);border:1px solid rgba(192,168,102,.55);background:linear-gradient(180deg,rgba(45,41,30,.18),rgba(10,12,11,.08));color:transparent;cursor:pointer;transition:.25s}
.auto-hunt-start span{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);color:transparent;font-size:11px;transition:.25s}
.auto-hunt-start:hover{border-color:#78dcff;background:linear-gradient(180deg,rgba(17,112,154,.3),rgba(6,27,38,.18));box-shadow:0 0 16px rgba(50,196,248,.55),inset 0 0 12px rgba(50,196,248,.16);transform:translateX(-50%) translateY(-1px)}
.auto-hunt-start:hover span{color:#dff9ff;text-shadow:0 0 10px #5bdcff}
.auto-hunt-demo.playing .auto-hunt-start{opacity:0;pointer-events:none}
.auto-hunt-active{position:absolute;z-index:5;top:18px;right:18px;display:flex;align-items:center;gap:8px;padding:8px 11px;background:rgba(3,17,21,.78);border:1px solid rgba(74,219,170,.42);color:#7df0be;font-size:10px;letter-spacing:1.5px;opacity:0;transform:translateY(-7px);transition:.3s;backdrop-filter:blur(5px)}
.auto-hunt-active i{width:8px;height:8px;border-radius:50%;background:#4be58a;box-shadow:0 0 10px #4be58a;animation:autoHuntLive 1.3s ease-in-out infinite}
.auto-hunt-demo.playing .auto-hunt-active{opacity:1;transform:none}
.auto-hunt-progress{position:absolute;z-index:5;left:50%;bottom:18px;transform:translateX(-50%);width:76%;padding:8px 12px;text-align:center;background:linear-gradient(90deg,transparent,rgba(2,18,28,.82),transparent);color:#9adfff;font-size:11px;letter-spacing:.6px;opacity:0;transition:.3s}
.auto-hunt-demo.playing .auto-hunt-progress{opacity:1}
.auto-hunt-flash{position:absolute;inset:0;z-index:4;pointer-events:none;opacity:0;background:radial-gradient(circle at 50% 80%,rgba(82,221,255,.28),transparent 30%)}
.auto-hunt-demo.starting .auto-hunt-flash{animation:autoHuntFlash .6s ease}
.auto-hunt-hint{margin:15px auto 0;max-width:420px;text-align:center;color:#89b8cb;font-size:13px;line-height:1.6}
.auto-hunt-hint i{display:inline-block;margin-right:6px;color:#58d9ff;font-style:normal;animation:autoHintPulse 1.5s ease-in-out infinite}
.auto-hunt-hint strong{color:#d9f4ff}
.auto-hunt-demo.playing .auto-hunt-hint{opacity:.42}
@keyframes autoHuntLive{50%{opacity:.45;transform:scale(1.35)}}
@keyframes autoHuntFlash{0%{opacity:0;transform:scale(.75)}35%{opacity:1}100%{opacity:0;transform:scale(1.15)}}
@keyframes autoHintPulse{50%{transform:translateX(4px);text-shadow:0 0 9px #58d9ff}}
@media(max-width:700px){.auto-hunt-media{max-height:470px}.auto-hunt-active{top:10px;right:10px;font-size:8px}.auto-hunt-progress{bottom:10px;font-size:9px}}


/* V26 — refined Automatic Hunt Start hotspot */
.auto-hunt-start span{
  width:100%;
  height:100%;
  display:flex;
  align-items:center;
  justify-content:center;
  line-height:1;
}
.auto-hunt-start:active{
  transform:translateX(-50%) translateY(1px) scale(.97);
  box-shadow:
    0 0 20px rgba(50,196,248,.65),
    inset 0 0 18px rgba(50,196,248,.26);
}


/* V27 — new logo and effects */
.logo-fx{position:relative;display:inline-grid;place-items:center;isolation:isolate}
.logo-fx img{position:relative;z-index:3;width:min(720px,82vw);max-height:340px;object-fit:contain;filter:drop-shadow(0 22px 26px rgba(0,0,0,.72)) drop-shadow(0 0 18px rgba(77,211,255,.34));animation:logoBreath 4.8s ease-in-out infinite;transition:.35s}
.logo-fx:hover img{transform:scale(1.025);filter:drop-shadow(0 24px 28px rgba(0,0,0,.78)) drop-shadow(0 0 28px rgba(90,224,255,.58))}
.logo-aura{position:absolute;z-index:1;inset:10% 8%;border-radius:50%;background:radial-gradient(ellipse at 50% 58%,rgba(45,190,255,.23),rgba(29,91,151,.09) 42%,transparent 72%);filter:blur(18px);animation:logoAuraPulse 4.4s ease-in-out infinite}
.logo-shine{position:absolute;z-index:4;top:13%;bottom:13%;left:-22%;width:18%;pointer-events:none;transform:skewX(-18deg);background:linear-gradient(90deg,transparent,rgba(255,255,255,.52),rgba(113,221,255,.32),transparent);filter:blur(1px);mix-blend-mode:screen;animation:logoShinePass 7s ease-in-out infinite}
.logo-particles{position:absolute;z-index:2;inset:-6%;pointer-events:none;background:
radial-gradient(circle at 11% 71%,#a6f3ff 0 2px,transparent 3px),
radial-gradient(circle at 22% 24%,#47d8ff 0 1.7px,transparent 3px),
radial-gradient(circle at 42% 84%,#6ce8ff 0 2px,transparent 3px),
radial-gradient(circle at 64% 17%,#d9fbff 0 1.5px,transparent 3px),
radial-gradient(circle at 79% 74%,#48cfff 0 2px,transparent 3px),
radial-gradient(circle at 92% 36%,#8befff 0 1.6px,transparent 3px);
background-size:140px 140px,120px 120px,150px 150px,110px 110px,160px 160px,130px 130px;filter:drop-shadow(0 0 8px #42d8ff);opacity:.56;animation:logoParticlesDrift 8s linear infinite}
.logo-fx:hover .logo-particles{opacity:.82;animation-duration:5.2s}
.logo-shard{position:absolute;width:5px;height:9px;background:linear-gradient(180deg,#e7fcff,#4ed9ff 52%,#136ba9);clip-path:polygon(50% 0,100% 38%,70% 100%,18% 83%,0 28%);box-shadow:0 0 8px #4ed9ff;opacity:0;animation:logoShardFloat var(--dur) ease-in-out infinite}
@keyframes logoBreath{0%,100%{transform:translateY(0) scale(1)}50%{transform:translateY(-5px) scale(1.008)}}
@keyframes logoAuraPulse{0%,100%{opacity:.42;transform:scale(.96)}50%{opacity:.72;transform:scale(1.06)}}
@keyframes logoShinePass{0%,68%{left:-22%;opacity:0}74%{opacity:.95}89%{left:108%;opacity:.5}100%{left:108%;opacity:0}}
@keyframes logoParticlesDrift{to{background-position:0 -140px,120px -120px,-150px -150px,110px -110px,-160px -160px,130px -130px}}
@keyframes logoShardFloat{0%{opacity:0;transform:translate(0,10px) rotate(0deg) scale(.7)}20%{opacity:.8}80%{opacity:.55}100%{opacity:0;transform:translate(var(--dx),var(--dy)) rotate(220deg) scale(.2)}}
@media(max-width:700px){.logo-fx img{width:min(620px,92vw)}.logo-particles{opacity:.4}}

/* V28 — hero spacing fix after larger logo */
.hero{
  min-height:1120px!important;
  height:auto!important;
  padding-top:90px!important;
  padding-bottom:110px!important;
  overflow:visible!important;
}
.hero-content{
  position:relative!important;
  z-index:8!important;
  width:min(1180px,92vw)!important;
  margin:0 auto!important;
  padding-top:18px!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
}
.hero-logo-fx{
  margin:0 auto 10px!important;
  max-width:min(760px,84vw)!important;
}
.hero-logo-fx img{
  width:100%!important;
  max-height:300px!important;
}
.hero-content h1{
  margin:8px 0 16px!important;
  line-height:.98!important;
}
.hero-content p{
  margin:0 auto 20px!important;
  max-width:780px!important;
}
.hero-countdown,.countdown{
  position:relative!important;
  z-index:10!important;
  margin:18px auto 12px!important;
}
.hero-actions{
  position:relative!important;
  z-index:12!important;
  display:flex!important;
  justify-content:center!important;
  align-items:center!important;
  flex-wrap:wrap!important;
  gap:14px!important;
  margin:18px auto 20px!important;
  transform:none!important;
}
.hero-actions .btn{
  min-width:172px!important;
  opacity:1!important;
  visibility:visible!important;
}
.hero-stats,.stats-strip{
  position:relative!important;
  z-index:10!important;
  margin:24px auto 0!important;
  width:min(1200px,92vw)!important;
  transform:none!important;
}
.hero + section,#features{margin-top:0!important}
.countdown-label,.hero-countdown-label{
  margin:0 auto 8px!important;
  position:relative!important;
  z-index:11!important;
}
@media(max-width:900px){
  .hero{min-height:1040px!important;padding-top:72px!important;padding-bottom:90px!important}
  .hero-logo-fx{max-width:min(670px,90vw)!important}
  .hero-logo-fx img{max-height:255px!important}
}
@media(max-width:620px){
  .hero{min-height:980px!important;padding-top:64px!important;padding-bottom:78px!important}
  .hero-logo-fx{max-width:94vw!important}
  .hero-logo-fx img{max-height:210px!important}
  .hero-content h1{font-size:clamp(42px,13vw,72px)!important}
  .hero-actions{width:100%!important;gap:10px!important}
  .hero-actions .btn{min-width:145px!important;flex:1 1 145px!important}
  .hero-stats,.stats-strip{width:94vw!important;margin-top:18px!important}
}




/* V29 — Local-tested custom cursor with PNG fallback */
html, body, body *, body *::before, body *::after {
  cursor: url("cursor.cur") 0 0, url("cursor.png") 0 0, auto !important;
}