:root{
  --text:#f8e2ba;
  --muted:#e6be83;
  --line:rgba(255,140,42,.34);
  --line-strong:rgba(255,190,100,.75);
  --panel:rgba(17,4,2,.68);
  --panel-strong:rgba(22,6,3,.84);
  --deep:#110301;
  --ember:#ff8a24;
  --lava:#ff5a0d;
  --gold:#ffd694;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  font-family:Georgia,'Times New Roman',serif;
  color:var(--text);
  background:
    linear-gradient(rgba(8,1,0,.04),rgba(8,1,0,.14)),
    url('../images/background-dragon.png') center top / cover no-repeat fixed;
  min-height:100vh;
  overflow-x:hidden;
}
body::before{
  content:""; position:fixed; inset:0; pointer-events:none; z-index:-2;
  background:
    radial-gradient(circle at 50% 18%, rgba(255,154,76,.13), transparent 28%),
    radial-gradient(circle at 50% 62%, rgba(255,72,0,.07), transparent 34%),
    linear-gradient(to bottom, rgba(0,0,0,.02), rgba(0,0,0,.18));
}
.ember-layer{
  position:fixed; inset:0; pointer-events:none; z-index:-1; opacity:.75;
  background-image:
    radial-gradient(circle at 10% 20%, rgba(255,120,30,.22) 0 2px, transparent 3px),
    radial-gradient(circle at 80% 32%, rgba(255,170,80,.18) 0 1.5px, transparent 2.5px),
    radial-gradient(circle at 30% 76%, rgba(255,90,20,.15) 0 2px, transparent 3px),
    radial-gradient(circle at 58% 15%, rgba(255,190,96,.12) 0 1px, transparent 2px),
    radial-gradient(circle at 72% 86%, rgba(255,90,40,.12) 0 2px, transparent 3px);
  animation:embersDrift 18s linear infinite;
}
@keyframes embersDrift{0%{transform:translateY(0)}50%{transform:translateY(-16px)}100%{transform:translateY(0)}}
a{text-decoration:none;color:inherit}
.site-shell{width:min(1320px,calc(100% - 44px));margin:0 auto}
.topbar{
  margin-top:8px; padding:18px 8px; display:flex; justify-content:space-between; align-items:center; gap:20px;
  border-bottom:1px solid rgba(255,123,24,.26);
}
.brand-mini{display:block; width:170px; overflow:hidden; border-radius:26px}
.brand-mini img{
  width:170px; display:block;
  filter:drop-shadow(0 0 18px rgba(255,104,20,.22)) saturate(1.06) contrast(1.05);
  clip-path:inset(16% 8% 18% 8% round 24px);
  -webkit-mask-image:radial-gradient(ellipse at center, #000 0 58%, rgba(0,0,0,.96) 69%, rgba(0,0,0,.45) 82%, transparent 92%);
          mask-image:radial-gradient(ellipse at center, #000 0 58%, rgba(0,0,0,.96) 69%, rgba(0,0,0,.45) 82%, transparent 92%);
}
.nav-links{display:flex; gap:28px; align-items:center; flex-wrap:wrap; justify-content:flex-end}
.nav-links a{
  position:relative; font-size:18px; font-weight:700; letter-spacing:.4px; color:#f6ddb0;
  text-shadow:0 0 12px rgba(255,130,25,.12); transition:transform .25s ease,color .25s ease,text-shadow .25s ease;
}
.nav-links a::after{
  content:""; position:absolute; left:0; bottom:-6px; width:100%; height:2px;
  background:linear-gradient(90deg, transparent, rgba(255,145,42,.78), transparent);
  transform:scaleX(.2); opacity:0; transition:opacity .25s ease, transform .25s ease;
}
.nav-links a:hover{transform:translateY(-2px); color:#fff0ce; text-shadow:0 0 18px rgba(255,145,42,.34)}
.nav-links a:hover::after{opacity:1; transform:scaleX(1)}
.hero{padding:34px 0 14px}
.hero-content{display:flex; flex-direction:column; align-items:center; text-align:center}
.logo-stage{position:relative; display:inline-flex; justify-content:center; align-items:center; isolation:isolate; overflow:hidden; border-radius:48px}
.logo-stage.compact{margin-bottom:8px}
.logo-rune{
  position:absolute; width:min(720px,92vw); aspect-ratio:1/.42; border-radius:50%; z-index:-1;
  background:
    radial-gradient(ellipse at center, rgba(255,112,12,.24) 0%, rgba(255,90,10,.13) 32%, rgba(255,124,18,.05) 48%, transparent 70%),
    radial-gradient(circle at 50% 46%, rgba(0,0,0,.18), transparent 72%);
  filter:blur(16px); opacity:.95;
}
.hero-logo{width:min(720px,92%); display:block; position:relative;
  clip-path:inset(15% 7% 16% 7% round 40px);
  -webkit-mask-image:radial-gradient(ellipse at center, #000 0 57%, rgba(0,0,0,.96) 68%, rgba(0,0,0,.62) 78%, transparent 90%);
          mask-image:radial-gradient(ellipse at center, #000 0 57%, rgba(0,0,0,.96) 68%, rgba(0,0,0,.62) 78%, transparent 90%);
  filter:drop-shadow(0 0 26px rgba(255,96,0,.16)) saturate(1.08) contrast(1.06);
}
.hero-logo-small{width:min(520px,82%)}
.logo-animated img,.logo-animated{
  animation:logoFloat 5.8s ease-in-out infinite, logoGlow 4.4s ease-in-out infinite;
  transform-origin:center center;
}
.logo-animated::after{
  content:""; position:absolute; inset:14% 12%; border-radius:50%; pointer-events:none;
  background:linear-gradient(115deg, transparent 22%, rgba(255,223,176,.12) 44%, transparent 58%);
  mix-blend-mode:screen; opacity:0; animation:logoSweep 6.2s ease-in-out infinite;
}
.logo-animated.slow img,.logo-animated.slow{animation-duration:6.8s,5.4s}
@keyframes logoFloat{0%,100%{transform:translateY(0) scale(1)}50%{transform:translateY(-8px) scale(1.012)}}
@keyframes logoGlow{0%,100%{filter:drop-shadow(0 10px 20px rgba(0,0,0,.38)) drop-shadow(0 0 16px rgba(255,106,18,.13)) saturate(1.04) contrast(1.05)}50%{filter:drop-shadow(0 14px 28px rgba(0,0,0,.46)) drop-shadow(0 0 24px rgba(255,126,20,.2)) saturate(1.08) contrast(1.07)}}
@keyframes logoSweep{0%,68%,100%{opacity:0;transform:translateX(-24%) rotate(-8deg)}80%{opacity:.8}90%{opacity:.4;transform:translateX(22%) rotate(-6deg)}}
.hero-tagline,.inner-subtitle{margin:22px 0 10px; font-size:clamp(34px,4vw,54px); font-weight:700; text-shadow:0 3px 12px rgba(0,0,0,.48), 0 0 24px rgba(255,115,20,.16)}
.hero-subcopy,.auth-subtitle{max-width:760px; font-size:20px; line-height:1.7; color:#f4dab2; margin:0 0 18px}
.hero-buttons,.tab-switch,.dashboard-links{display:flex; gap:18px; flex-wrap:wrap; justify-content:center}
.hero-pills{display:flex; gap:12px; flex-wrap:wrap; justify-content:center; margin:20px 0 10px}
.hero-pills span{
  padding:10px 16px; border-radius:999px; background:rgba(20,5,2,.56); border:1px solid rgba(255,132,44,.24);
  box-shadow:inset 0 1px 0 rgba(255,227,178,.08), 0 0 0 1px rgba(255,100,0,.06), 0 0 18px rgba(255,110,0,.08);
}
.lava-btn{
  position:relative; display:inline-flex; justify-content:center; align-items:center; min-width:210px;
  padding:18px 34px; border:none; border-radius:18px; cursor:pointer; isolation:isolate;
  color:#fff0cc; font-size:24px; font-weight:700; letter-spacing:.2px;
  background:
    linear-gradient(180deg, rgba(255,216,164,.18) 0%, rgba(255,216,164,.03) 18%, transparent 22%),
    radial-gradient(circle at 50% 20%, rgba(255,175,88,.16), transparent 45%),
    linear-gradient(135deg, rgba(123,37,8,.98) 0%, rgba(77,18,6,.98) 40%, rgba(36,9,3,.98) 100%);
  box-shadow:
    inset 0 1px 0 rgba(255,231,193,.30),
    inset 0 -1px 0 rgba(255,122,22,.24),
    inset 12px 0 18px rgba(255,144,42,.08),
    inset -12px 0 18px rgba(0,0,0,.24),
    0 0 0 1px rgba(255,166,78,.42),
    0 0 26px rgba(255,95,0,.14);
  transform:perspective(900px) rotateX(18deg);
  transition:transform .22s ease, box-shadow .22s ease, filter .22s ease;
  overflow:hidden;
}
.lava-btn::before{
  content:""; position:absolute; inset:1px; border-radius:17px; z-index:-1;
  background:
    linear-gradient(180deg, rgba(255,246,222,.08), transparent 32%),
    linear-gradient(90deg, rgba(255,150,42,.11), transparent 18%, transparent 82%, rgba(255,150,42,.07));
}
.lava-btn::after{
  content:""; position:absolute; inset:2px; border-radius:16px; pointer-events:none;
  background:
    linear-gradient(125deg, transparent 10%, rgba(255,239,202,.18) 28%, transparent 42%),
    radial-gradient(circle at 18% 24%, rgba(255,124,20,.25) 0 8%, transparent 24%),
    radial-gradient(circle at 78% 78%, rgba(255,84,0,.18) 0 10%, transparent 26%);
  transform:translateX(-125%);
  transition:transform .6s ease;
}
.lava-btn:hover{
  transform:perspective(900px) rotateX(6deg) translateY(-3px) scale(1.02);
  box-shadow:
    inset 0 1px 0 rgba(255,239,206,.36),
    inset 0 -1px 0 rgba(255,130,32,.28),
    inset 18px 0 24px rgba(255,154,44,.11),
    inset -18px 0 24px rgba(0,0,0,.28),
    0 0 0 1px rgba(255,188,108,.5),
    0 0 34px rgba(255,98,0,.28);
  filter:saturate(1.08) brightness(1.02);
}
.lava-btn:hover::after{transform:translateX(118%)}
.lava-btn:active{transform:perspective(900px) rotateX(1deg) scale(.99)}
.lava-btn.secondary{background:linear-gradient(180deg, rgba(255,216,164,.14) 0%, rgba(255,216,164,.03) 18%, transparent 22%),radial-gradient(circle at 50% 20%, rgba(255,175,88,.15), transparent 45%),linear-gradient(135deg, rgba(112,31,13,.98) 0%, rgba(62,13,7,.98) 40%, rgba(30,8,4,.98) 100%)}
.lava-btn.accent{background:linear-gradient(180deg, rgba(255,216,164,.16) 0%, rgba(255,216,164,.03) 18%, transparent 22%),radial-gradient(circle at 50% 20%, rgba(255,175,88,.16), transparent 45%),linear-gradient(135deg, rgba(139,45,10,.98) 0%, rgba(78,20,6,.98) 40%, rgba(37,9,3,.98) 100%)}
.lava-btn.active{box-shadow:inset 0 1px 0 rgba(255,239,206,.36), inset 0 -1px 0 rgba(255,130,32,.28), inset 18px 0 24px rgba(255,154,44,.11), inset -18px 0 24px rgba(0,0,0,.28), 0 0 0 1px rgba(255,188,108,.54), 0 0 40px rgba(255,98,0,.3)}
.lava-btn.wide{width:100%; min-width:0; margin-top:18px}
.main-grid{display:grid; grid-template-columns:1fr 1.55fr 1fr; gap:28px; align-items:start; margin:28px 0 54px}
.panel{
  position:relative; border-radius:28px; padding:24px;
  background:
    linear-gradient(180deg, rgba(255,198,126,.06) 0%, transparent 12%),
    linear-gradient(180deg, rgba(40,11,5,.74), rgba(12,4,3,.84));
  border:1px solid rgba(255,132,44,.22);
  box-shadow:
    inset 0 1px 0 rgba(255,217,154,.08),
    inset 0 -24px 34px rgba(0,0,0,.18),
    0 0 0 1px rgba(255,145,44,.08),
    0 0 30px rgba(255,96,0,.10);
}
.lava-frame::before{
  content:""; position:absolute; inset:-1px; border-radius:28px; padding:1.8px; pointer-events:none;
  background:
    linear-gradient(135deg, rgba(255,213,141,.75), rgba(255,111,18,.76) 18%, rgba(95,27,3,.88) 42%, rgba(255,132,28,.72) 74%, rgba(255,226,162,.62));
  -webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite:xor; mask-composite:exclude;
  box-shadow:0 0 20px rgba(255,95,0,.12);
}
.lava-frame::after{
  content:""; position:absolute; inset:5px; border-radius:22px; pointer-events:none;
  background:
    radial-gradient(circle at 10% 14%, rgba(255,126,16,.16), transparent 18%),
    radial-gradient(circle at 90% 88%, rgba(255,94,0,.13), transparent 20%),
    linear-gradient(90deg, rgba(255,133,28,.04), transparent 16%, transparent 84%, rgba(255,133,28,.05));
  opacity:.95;
}
.panel-header,.section-title{font-size:34px; font-weight:700; margin-bottom:18px; position:relative; z-index:1}
.panel-header.sub{font-size:30px; margin-top:28px}
.story p,.story li,.simple-page p,.auth-info p,.mini-feature span{font-size:17px; line-height:1.7; color:#f1d7ae; position:relative; z-index:1}
.feature-list{margin:18px 0 0; padding-left:24px; display:grid; gap:8px}
.mini-table,.ranking-table,.data-table{width:100%; border-collapse:separate; border-spacing:0 10px; position:relative; z-index:1}
.data-table thead th{
  text-align:left; padding:0 16px 10px; font-size:18px; color:#ffdca5; text-transform:none;
  text-shadow:0 0 12px rgba(255,122,20,.12);
}
.data-table tbody tr{
  position:relative;
}
.data-table tbody td{
  padding:16px 16px; font-size:18px; background:
    linear-gradient(180deg, rgba(255,209,152,.05) 0%, transparent 26%),
    linear-gradient(180deg, rgba(28,8,4,.88), rgba(13,4,2,.90));
  border-top:1px solid rgba(255,176,96,.22);
  border-bottom:1px solid rgba(255,103,14,.14);
  box-shadow:inset 0 1px 0 rgba(255,228,186,.06), inset 18px 0 24px rgba(255,132,40,.03), inset -18px 0 24px rgba(0,0,0,.16), 0 0 0 1px rgba(255,115,16,.06), 0 0 18px rgba(255,92,0,.06);
}
.data-table tbody td:first-child{border-left:1px solid rgba(255,156,68,.18); border-radius:16px 0 0 16px}
.data-table tbody td:last-child{border-right:1px solid rgba(255,156,68,.18); border-radius:0 16px 16px 0}
.data-table tbody tr:hover td{
  transform:translateY(-1px);
  background:linear-gradient(180deg, rgba(255,209,152,.06) 0%, transparent 24%), linear-gradient(180deg, rgba(34,10,5,.92), rgba(15,4,2,.96));
  box-shadow:inset 0 1px 0 rgba(255,228,186,.08), inset 24px 0 24px rgba(255,142,40,.05), inset -22px 0 24px rgba(0,0,0,.18), 0 0 0 1px rgba(255,142,40,.10), 0 0 24px rgba(255,86,0,.12);
}
.table-link{color:#fff0cc; font-weight:700; text-shadow:0 0 10px rgba(255,118,16,.12)}
.table-link:hover{color:#fff7df; text-shadow:0 0 16px rgba(255,118,16,.22)}
.login-form{display:grid; gap:14px; position:relative; z-index:1}
.login-form input{
  width:100%; padding:18px 18px; border-radius:18px; border:1px solid rgba(255,132,44,.18); outline:none;
  background:linear-gradient(180deg, rgba(27,8,4,.72), rgba(14,4,2,.86)); color:#f6ddb0; font-size:19px;
  box-shadow:inset 0 1px 0 rgba(255,216,162,.04), inset 0 -8px 12px rgba(0,0,0,.18);
  transition:border-color .2s ease, box-shadow .2s ease, transform .2s ease;
}
.login-form input:focus{border-color:rgba(255,176,94,.66); box-shadow:0 0 22px rgba(255,106,0,.14), inset 0 1px 0 rgba(255,215,158,.08); transform:translateY(-1px)}
.hint-text{color:#efc98f; font-size:16px; line-height:1.6; margin:14px 4px 0}
.quick-user,.detail-card,.mini-feature,.auth-info,.shop-card,.server-info div{
  position:relative; overflow:hidden;
  background:linear-gradient(180deg, rgba(255,214,152,.04) 0%, transparent 18%), linear-gradient(180deg, rgba(28,8,4,.70), rgba(14,4,2,.82));
  border:1px solid rgba(255,138,39,.16);
  box-shadow:inset 0 1px 0 rgba(255,221,170,.08), inset 18px 0 24px rgba(255,130,44,.03), inset -18px 0 24px rgba(0,0,0,.16), 0 0 0 1px rgba(255,145,44,.05), 0 0 26px rgba(255,102,0,.08);
}
.quick-user::before,.detail-card::before,.mini-feature::before,.auth-info::before,.shop-card::before,.server-info div::before{
  content:""; position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(120deg, transparent 0 18%, rgba(255,211,159,.06) 28%, transparent 40%), radial-gradient(circle at 88% 18%, rgba(255,96,0,.12), transparent 18%);
}
.quick-user,.auth-info{padding:20px; display:flex; flex-direction:column; gap:10px}
.quick-user strong,.detail-card strong{font-size:24px}
.quick-actions{display:grid; gap:12px; margin-top:16px}
.server-info{display:grid; gap:12px; position:relative; z-index:1}
.server-info div{display:flex; justify-content:space-between; align-items:center; gap:16px; padding:14px 16px; border-radius:16px}
.server-info span{font-size:17px; color:#e8c593}
.server-info strong{font-size:20px}
.status-on{color:#7dff8b; text-shadow:0 0 14px rgba(125,255,139,.35)}
.inner-hero{padding:28px 0 14px; text-align:center}
.ranking-wrap,.simple-page{margin:18px 0 54px}
.detail-shell,.auth-shell,.dashboard-shell,.shop-shell{padding:28px}
.detail-grid{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:16px}
.compact-grid{grid-template-columns:repeat(5,minmax(0,1fr))}
.detail-card{padding:18px; border-radius:18px; display:flex; flex-direction:column; gap:8px}
.detail-card span{font-size:15px; color:#dfb87c; text-transform:uppercase; letter-spacing:.8px}
.auth-layout{display:grid; grid-template-columns:1.2fr .8fr; gap:18px; align-items:start}
.alert-box{padding:14px 16px; border-radius:16px; margin-bottom:16px; border:1px solid rgba(255,132,44,.28); background:rgba(56,13,4,.72); color:#ffd4a3}
.dashboard-top{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; margin-bottom:22px}
.shop-grid{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:22px; margin-top:20px}
.shop-card{padding:22px; border-radius:24px}
.shop-card h3{font-size:28px; margin:82px 0 10px; position:relative; z-index:1}
.shop-card p{font-size:17px; line-height:1.65; color:#f2d7ae; position:relative; z-index:1}
.shop-meta{display:flex; justify-content:space-between; align-items:center; margin:16px 0; position:relative; z-index:1}
.shop-meta span{color:#e6c18d}
.shop-meta strong{font-size:22px}
.shop-badge{position:absolute; top:14px; right:14px; padding:8px 12px; border-radius:999px; background:linear-gradient(180deg, rgba(255,130,30,.28), rgba(255,87,0,.22)); border:1px solid rgba(255,174,88,.24); color:#fff0cd; font-weight:700; z-index:2}
.shop-visual{
  position:absolute; inset:18px 18px auto 18px; height:110px; border-radius:18px; overflow:hidden;
  background:
    radial-gradient(circle at 22% 28%, rgba(255,216,162,.18), transparent 18%),
    radial-gradient(circle at 74% 74%, rgba(255,95,0,.22), transparent 22%),
    linear-gradient(135deg, rgba(120,34,8,.96), rgba(62,15,5,.96) 45%, rgba(25,7,3,.98));
  box-shadow:inset 0 1px 0 rgba(255,231,193,.12), inset 0 -18px 22px rgba(0,0,0,.26), 0 0 0 1px rgba(255,154,66,.14), 0 0 22px rgba(255,86,0,.10);
}
.shop-visual::before{
  content:""; position:absolute; inset:0;
  background:linear-gradient(120deg, transparent 12%, rgba(255,232,196,.08) 28%, transparent 42%), radial-gradient(circle at 24% 50%, rgba(255,120,20,.26) 0 14px, transparent 28px), radial-gradient(circle at 68% 42%, rgba(255,166,72,.18) 0 12px, transparent 26px);
}
.shop-visual::after{
  content:""; position:absolute; left:20px; right:20px; bottom:18px; height:28px; border-radius:999px;
  background:linear-gradient(90deg, rgba(255,76,0,.18), rgba(255,176,92,.24), rgba(255,76,0,.18));
  box-shadow:0 0 18px rgba(255,98,0,.18);
}
.shop-kind{position:absolute; left:22px; top:22px; font-size:18px; font-weight:700; color:#ffe2b4; z-index:1; letter-spacing:.4px}
.site-footer{padding:34px 0 44px; text-align:center; border-top:1px solid rgba(255,116,20,.20); margin-top:16px}
.footer-logo{display:block; width:220px; margin:0 auto; overflow:hidden; border-radius:34px}
.footer-logo img{
  width:220px; display:block; margin:0 auto;
  clip-path:inset(15% 7% 16% 7% round 30px);
  -webkit-mask-image:radial-gradient(ellipse at center, #000 0 57%, rgba(0,0,0,.96) 68%, rgba(0,0,0,.62) 78%, transparent 90%);
          mask-image:radial-gradient(ellipse at center, #000 0 57%, rgba(0,0,0,.96) 68%, rgba(0,0,0,.62) 78%, transparent 90%);
}
.footer-links{display:flex; gap:14px; justify-content:center; align-items:center; flex-wrap:wrap; margin:16px 0 10px}
.footer-links a,.footer-links span{font-size:18px; color:#f5d8a7}
.footer-copy{color:#d2a86f; font-size:16px}
.depth-btn{will-change:transform}
@media (max-width:1150px){.main-grid,.shop-grid,.auth-layout,.detail-grid,.compact-grid,.dashboard-top{grid-template-columns:1fr}}
@media (max-width:860px){
  .site-shell{width:min(100% - 24px,1320px)}
  .topbar{flex-direction:column}
  .nav-links{justify-content:center; gap:18px}
  .hero-tagline,.inner-subtitle{font-size:clamp(30px,7vw,42px)}
  .lava-btn{width:100%; min-width:0}
  .hero-buttons,.tab-switch,.dashboard-links{width:100%}
}


/* ===== V5 premium overrides ===== */
body{
  background:
    linear-gradient(rgba(8,1,0,.01),rgba(8,1,0,.10)),
    url('../images/background-dragon.png') center top / cover no-repeat fixed;
}
body::before{
  background:
    radial-gradient(circle at 50% 16%, rgba(255,166,60,.11), transparent 26%),
    radial-gradient(circle at 50% 56%, rgba(255,72,0,.06), transparent 32%),
    linear-gradient(to bottom, rgba(0,0,0,.01), rgba(0,0,0,.12));
}
.brand-mini,.footer-logo,.logo-stage{overflow:visible}
.brand-mini img,
.hero-logo,
.footer-logo img{
  clip-path:none;
  -webkit-mask-image:none;
  mask-image:none;
  filter:drop-shadow(0 0 24px rgba(255,92,0,.18)) drop-shadow(0 0 42px rgba(255,128,20,.10)) saturate(1.05) contrast(1.04);
}
.logo-stage{
  position:relative;
  padding:18px 34px 10px;
}
.logo-stage::before{
  content:"";
  position:absolute;
  inset:20% 14% 20%;
  border-radius:48% 52% 46% 54% / 54% 50% 50% 46%;
  background:
    radial-gradient(circle at 50% 50%, rgba(255,116,12,.16), rgba(255,116,12,.05) 45%, transparent 65%),
    radial-gradient(circle at 50% 50%, rgba(0,0,0,.26), transparent 70%);
  filter:blur(22px);
  z-index:-2;
}
.logo-rune{
  width:min(760px,96vw);
  aspect-ratio:1/.32;
  border-radius:999px;
  background:
    radial-gradient(ellipse at center, rgba(255,112,12,.22) 0%, rgba(255,90,10,.11) 30%, rgba(255,124,18,.03) 52%, transparent 72%);
  filter:blur(20px);
  opacity:.85;
}
.hero-logo{width:min(760px,96%);}
.hero-logo-small{width:min(560px,88%);}
.hero-pills-single{margin-top:22px;}
.hero-pills-single span{
  min-width:280px;
  justify-content:center;
  font-weight:700;
  letter-spacing:.8px;
  padding:14px 28px;
  background:
    linear-gradient(180deg, rgba(255,226,178,.12), rgba(255,226,178,.02) 20%, transparent 22%),
    linear-gradient(135deg, rgba(78,21,7,.88), rgba(26,7,3,.92));
  box-shadow:
    inset 0 1px 0 rgba(255,233,201,.18),
    inset 0 -1px 0 rgba(255,122,22,.22),
    0 0 0 1px rgba(255,166,78,.36),
    0 0 28px rgba(255,95,0,.16);
}
.panel, .shop-card, .detail-card, .quick-user, .auth-info, .server-info div{
  background:
    linear-gradient(180deg, rgba(255,210,150,.07) 0%, rgba(255,210,150,.02) 12%, transparent 16%),
    linear-gradient(180deg, rgba(38,10,5,.82), rgba(11,4,3,.92));
  box-shadow:
    inset 0 1px 0 rgba(255,217,154,.10),
    inset 0 -28px 38px rgba(0,0,0,.24),
    inset 18px 0 24px rgba(255,124,20,.05),
    inset -18px 0 26px rgba(0,0,0,.24),
    0 0 0 1px rgba(255,145,44,.10),
    0 0 32px rgba(255,96,0,.12);
}
.lava-frame::before{
  padding:2.2px;
  background:
    linear-gradient(135deg, rgba(255,226,160,.85), rgba(255,119,18,.82) 16%, rgba(84,19,0,.92) 36%, rgba(255,102,0,.70) 64%, rgba(255,230,165,.85));
}
.lava-frame::after{
  content:"";
  position:absolute;
  inset:10px;
  border-radius:22px;
  pointer-events:none;
  background:
    radial-gradient(circle at 2% 18%, rgba(255,110,26,.18) 0 2px, transparent 4px),
    radial-gradient(circle at 96% 74%, rgba(255,170,74,.16) 0 2px, transparent 4px),
    linear-gradient(90deg, transparent, rgba(255,145,44,.08), transparent);
  opacity:.9;
}
.molten-table{border-collapse:separate; border-spacing:0 12px;}
.data-table thead th{
  background:
    linear-gradient(180deg, rgba(255,225,185,.18), rgba(255,225,185,.02) 18%, transparent 20%),
    linear-gradient(135deg, rgba(92,23,7,.96), rgba(33,9,4,.98));
  box-shadow:
    inset 0 1px 0 rgba(255,235,205,.18),
    inset 0 -1px 0 rgba(255,130,32,.28),
    0 0 0 1px rgba(255,172,92,.20),
    0 0 20px rgba(255,92,0,.10);
}
.data-table tbody td{
  background:
    linear-gradient(180deg, rgba(255,214,152,.08) 0%, transparent 22%),
    linear-gradient(180deg, rgba(30,8,4,.92), rgba(10,3,2,.96));
}
.data-table tbody tr:hover td{
  box-shadow:
    inset 0 1px 0 rgba(255,228,186,.10),
    inset 24px 0 24px rgba(255,142,40,.08),
    inset -22px 0 24px rgba(0,0,0,.22),
    0 0 0 1px rgba(255,142,40,.12),
    0 0 28px rgba(255,86,0,.16);
}
.lava-btn{
  transform:none;
  border-radius:20px;
  background:
    linear-gradient(180deg, rgba(255,226,190,.18), rgba(255,226,190,.04) 18%, transparent 20%),
    radial-gradient(circle at 18% 22%, rgba(255,148,50,.18), transparent 18%),
    radial-gradient(circle at 82% 78%, rgba(255,88,0,.14), transparent 20%),
    linear-gradient(135deg, rgba(118,29,9,.98) 0%, rgba(74,18,6,.98) 44%, rgba(30,8,3,.98) 100%);
  box-shadow:
    inset 0 1px 0 rgba(255,241,211,.34),
    inset 0 -1px 0 rgba(255,125,24,.26),
    inset 18px 0 24px rgba(255,146,42,.10),
    inset -18px 0 24px rgba(0,0,0,.28),
    0 0 0 1px rgba(255,170,82,.42),
    0 10px 22px rgba(0,0,0,.18),
    0 0 30px rgba(255,95,0,.18);
}
.lava-btn::before{
  background:
    linear-gradient(180deg, rgba(255,246,222,.10), transparent 28%),
    linear-gradient(90deg, rgba(255,150,42,.14), transparent 18%, transparent 82%, rgba(255,150,42,.08));
}
.lava-btn::after{
  background:
    linear-gradient(125deg, transparent 10%, rgba(255,239,202,.22) 28%, transparent 42%),
    radial-gradient(circle at 14% 24%, rgba(255,124,20,.35) 0 8%, transparent 24%),
    radial-gradient(circle at 82% 76%, rgba(255,84,0,.24) 0 10%, transparent 26%),
    linear-gradient(90deg, transparent 0 18%, rgba(255,176,88,.08) 28%, transparent 40%);
}
.lava-btn:hover{transform:translateY(-3px) scale(1.02);}
.join-btn{
  position:relative;
  min-width:270px;
  overflow:hidden;
  padding-left:84px;
  background:
    linear-gradient(180deg, rgba(255,228,194,.20), rgba(255,228,194,.05) 18%, transparent 20%),
    radial-gradient(circle at 12% 30%, rgba(255,120,18,.35), transparent 18%),
    radial-gradient(circle at 84% 70%, rgba(255,92,0,.18), transparent 20%),
    linear-gradient(135deg, rgba(144,37,11,.98) 0%, rgba(88,21,7,.98) 42%, rgba(33,9,4,.98) 100%);
  animation:joinPulse 2.3s ease-in-out infinite;
}
.join-btn::before{
  background:
    linear-gradient(180deg, rgba(255,248,230,.12), transparent 26%),
    linear-gradient(90deg, rgba(255,170,72,.12), transparent 16%, transparent 84%, rgba(255,120,26,.10));
}
.join-btn__text{position:relative; z-index:2; text-transform:uppercase; letter-spacing:1.2px; text-shadow:0 0 14px rgba(255,118,16,.18);}
.join-btn__dragon{
  position:absolute; left:-22px; top:50%; width:92px; height:92px; transform:translateY(-50%) scale(.86);
  background:url('../images/dragon-btn.png') center/cover no-repeat; border-radius:50%;
  filter:drop-shadow(0 0 14px rgba(255,98,0,.28)) saturate(1.08) contrast(1.04);
  mix-blend-mode:screen; animation:dragonRun 4.2s ease-in-out infinite; z-index:1; opacity:.92;
}
.join-btn__dragon::after{
  content:""; position:absolute; inset:54% -4px auto 48%; width:64px; height:24px;
  background:linear-gradient(90deg, rgba(255,183,104,.16), rgba(255,95,0,.55), transparent 72%); filter:blur(6px); transform:rotate(8deg);
}
.join-btn__sparks{position:absolute; inset:0; pointer-events:none; z-index:1;}
.join-btn__sparks::before,
.join-btn__sparks::after{
  content:""; position:absolute; top:50%; left:12%; width:120px; height:40px;
  background:
    radial-gradient(circle, rgba(255,214,140,.88) 0 1px, transparent 2px) 10px 16px/30px 20px repeat-x,
    radial-gradient(circle, rgba(255,128,30,.72) 0 1.5px, transparent 2.4px) 0 6px/26px 18px repeat-x;
  filter:blur(.4px); opacity:.72; transform:translateY(-50%); animation:sparksTrail 4.2s ease-in-out infinite;
}
.join-btn__sparks::after{top:62%; height:26px; opacity:.4; animation-delay:.18s;}
.shop-shell{background: linear-gradient(180deg, rgba(255,210,150,.05) 0%, transparent 10%), linear-gradient(180deg, rgba(34,9,5,.78), rgba(11,4,3,.90));}
.shop-grid{gap:24px;}
.shop-card{border-radius:28px; padding:24px; overflow:hidden;}
.shop-card::after{content:""; position:absolute; inset:auto -18% -32% auto; width:220px; height:220px; border-radius:50%; background:radial-gradient(circle, rgba(255,102,0,.18), transparent 62%); filter:blur(14px); z-index:0;}
.shop-visual{
  height:122px;
  background:
    radial-gradient(circle at 18% 28%, rgba(255,216,162,.22), transparent 16%),
    radial-gradient(circle at 76% 72%, rgba(255,95,0,.25), transparent 18%),
    linear-gradient(135deg, rgba(116,31,8,.98), rgba(67,16,5,.98) 46%, rgba(20,6,3,.99));
  box-shadow:
    inset 0 1px 0 rgba(255,231,193,.14),
    inset 0 -18px 22px rgba(0,0,0,.32),
    inset 14px 0 24px rgba(255,132,44,.07),
    0 0 0 1px rgba(255,154,66,.18),
    0 0 30px rgba(255,86,0,.12);
}
.shop-visual::before{
  background:
    linear-gradient(120deg, transparent 8%, rgba(255,232,196,.10) 24%, transparent 40%),
    radial-gradient(circle at 18% 38%, rgba(255,120,20,.30) 0 18px, transparent 34px),
    radial-gradient(circle at 72% 40%, rgba(255,166,72,.18) 0 14px, transparent 28px);
}
.shop-visual::after{height:30px; background:linear-gradient(90deg, rgba(255,76,0,.20), rgba(255,176,92,.32), rgba(255,76,0,.20));}
.shop-card h3{font-size:30px; line-height:1.08;}
.shop-badge{box-shadow:0 0 0 1px rgba(255,200,126,.24), 0 0 22px rgba(255,108,0,.16), inset 0 1px 0 rgba(255,236,206,.14);}
.topbar{border-bottom:1px solid rgba(255,123,24,.18);}
@keyframes joinPulse{
  0%,100%{box-shadow:inset 0 1px 0 rgba(255,241,211,.34), inset 0 -1px 0 rgba(255,125,24,.26), inset 18px 0 24px rgba(255,146,42,.10), inset -18px 0 24px rgba(0,0,0,.28), 0 0 0 1px rgba(255,170,82,.42), 0 10px 22px rgba(0,0,0,.18), 0 0 30px rgba(255,95,0,.18)}
  50%{box-shadow:inset 0 1px 0 rgba(255,245,225,.42), inset 0 -1px 0 rgba(255,138,38,.34), inset 22px 0 30px rgba(255,156,52,.14), inset -18px 0 24px rgba(0,0,0,.28), 0 0 0 1px rgba(255,188,108,.54), 0 12px 26px rgba(0,0,0,.18), 0 0 42px rgba(255,95,0,.30)}
}
@keyframes dragonRun{
  0%{left:-16px; transform:translateY(-50%) scale(.82)}
  35%{left:26%; transform:translateY(-50%) scale(.9)}
  62%{left:56%; transform:translateY(-50%) scale(.88)}
  100%{left:82%; transform:translateY(-50%) scale(.80)}
}
@keyframes sparksTrail{
  0%{left:10%; opacity:0}
  15%{opacity:.9}
  55%{left:44%; opacity:.8}
  100%{left:74%; opacity:0}
}
@media (max-width:860px){
  .join-btn{padding-left:68px; min-width:0}
  .join-btn__dragon{width:74px;height:74px}
  .hero-pills-single span{min-width:0; width:100%}
}


/* ===== V5.1 premium polish ===== */
.hero-buttons{gap:22px}
.hero-tagline{margin-top:14px}
.logo-stage{padding:8px 24px 2px}
.logo-stage::before{inset:22% 15% 18%;filter:blur(26px);opacity:.95}
.logo-rune{opacity:.62; filter:blur(24px)}
.hero-logo{
  width:min(800px,98%);
  filter:drop-shadow(0 0 30px rgba(255,96,0,.24)) drop-shadow(0 0 60px rgba(255,120,20,.10)) saturate(1.08) contrast(1.08);
}
.brand-mini img,.footer-logo img{
  filter:drop-shadow(0 0 18px rgba(255,96,0,.24)) drop-shadow(0 0 34px rgba(255,120,20,.10)) saturate(1.05) contrast(1.06);
}
.lava-btn{
  border-radius:22px;
  background:
    linear-gradient(180deg, rgba(255,239,212,.22), rgba(255,239,212,.05) 16%, transparent 18%),
    radial-gradient(circle at 16% 18%, rgba(255,184,92,.24), transparent 16%),
    radial-gradient(circle at 84% 78%, rgba(255,72,0,.22), transparent 20%),
    linear-gradient(145deg, rgba(132,36,12,.98) 0%, rgba(88,24,10,.98) 36%, rgba(45,13,5,.98) 74%, rgba(18,5,2,.99) 100%);
  box-shadow:
    inset 0 1px 0 rgba(255,246,226,.38),
    inset 0 -1px 0 rgba(255,132,34,.30),
    inset 22px 0 28px rgba(255,154,52,.14),
    inset -22px 0 28px rgba(0,0,0,.30),
    0 0 0 1px rgba(255,180,96,.44),
    0 0 0 2px rgba(84,24,6,.55),
    0 12px 24px rgba(0,0,0,.12),
    0 0 36px rgba(255,98,0,.18);
}
.lava-btn::before{
  background:
    linear-gradient(180deg, rgba(255,248,230,.16), transparent 26%),
    linear-gradient(90deg, rgba(255,166,54,.16), transparent 18%, transparent 82%, rgba(255,110,26,.10)),
    linear-gradient(180deg, transparent 64%, rgba(0,0,0,.18));
}
.lava-btn::after{
  background:
    linear-gradient(125deg, transparent 8%, rgba(255,239,202,.20) 22%, transparent 38%),
    linear-gradient(90deg, transparent 10%, rgba(255,176,88,.10) 28%, transparent 44%),
    radial-gradient(circle at 18% 24%, rgba(255,140,20,.34) 0 8%, transparent 20%),
    radial-gradient(circle at 82% 76%, rgba(255,86,0,.28) 0 10%, transparent 24%);
}
.lava-btn:hover{
  transform:translateY(-4px) scale(1.025);
  box-shadow:
    inset 0 1px 0 rgba(255,246,226,.44),
    inset 0 -1px 0 rgba(255,144,44,.34),
    inset 24px 0 30px rgba(255,160,62,.16),
    inset -22px 0 28px rgba(0,0,0,.30),
    0 0 0 1px rgba(255,194,120,.50),
    0 0 0 2px rgba(98,30,8,.58),
    0 0 44px rgba(255,98,0,.26);
}
.join-btn{
  min-width:430px;
  padding-left:170px;
  justify-content:flex-end;
  background:
    linear-gradient(180deg, rgba(255,242,218,.24), rgba(255,242,218,.05) 15%, transparent 18%),
    radial-gradient(circle at 18% 50%, rgba(255,104,20,.26), transparent 24%),
    radial-gradient(circle at 88% 50%, rgba(255,160,62,.14), transparent 22%),
    linear-gradient(145deg, rgba(153,34,8,.99) 0%, rgba(102,22,7,.99) 36%, rgba(52,12,5,.99) 70%, rgba(20,5,2,.99) 100%);
  box-shadow:
    inset 0 1px 0 rgba(255,246,226,.42),
    inset 0 -1px 0 rgba(255,134,36,.34),
    inset 34px 0 42px rgba(255,162,58,.18),
    inset -24px 0 28px rgba(0,0,0,.30),
    0 0 0 1px rgba(255,196,118,.56),
    0 0 0 2px rgba(108,30,8,.65),
    0 0 52px rgba(255,94,0,.30);
}
.join-btn__text{
  font-size:27px;
  letter-spacing:1.8px;
  text-shadow:0 0 14px rgba(255,118,16,.24), 0 0 28px rgba(255,102,0,.16);
}
.join-btn__dragon{
  left:12px;
  top:50%;
  width:152px;
  height:78px;
  transform:translateY(-50%);
  background:url('../images/dragon-btn.png') left center/contain no-repeat;
  border-radius:0;
  mix-blend-mode:screen;
  filter:drop-shadow(0 0 10px rgba(255,98,0,.28)) drop-shadow(0 0 24px rgba(255,98,0,.12));
  opacity:.98;
  animation:dragonRunWide 5s ease-in-out infinite;
}
.join-btn__dragon::after{
  content:""; position:absolute; left:60%; top:50%; width:86px; height:30px; transform:translateY(-48%);
  background:linear-gradient(90deg, rgba(255,186,104,.10), rgba(255,96,0,.46), rgba(255,96,0,0));
  filter:blur(7px);
}
.join-btn__sparks::before,
.join-btn__sparks::after{
  left:18%; width:180px; height:48px;
  background:
    radial-gradient(circle, rgba(255,226,150,.98) 0 1px, transparent 2px) 10px 16px/34px 20px repeat-x,
    radial-gradient(circle, rgba(255,128,30,.78) 0 1.6px, transparent 2.6px) 0 6px/30px 18px repeat-x,
    radial-gradient(circle, rgba(255,84,0,.40) 0 2px, transparent 4px) 8px 20px/42px 24px repeat-x;
  filter:blur(.35px);
}
@keyframes dragonRunWide{
  0%{left:10px; transform:translateY(-50%) scale(.96)}
  50%{left:34px; transform:translateY(-50%) scale(1.02)}
  100%{left:18px; transform:translateY(-50%) scale(.98)}
}
@keyframes sparksTrail{
  0%{left:16%; opacity:0}
  12%{opacity:.88}
  52%{left:32%; opacity:.84}
  100%{left:42%; opacity:0}
}
.panel-header{position:relative; padding-bottom:10px; margin-bottom:16px}
.panel-header::after{
  content:""; position:absolute; left:0; bottom:0; width:120px; height:3px; border-radius:999px;
  background:linear-gradient(90deg, rgba(255,192,120,.88), rgba(255,92,0,.55), transparent);
  box-shadow:0 0 18px rgba(255,92,0,.18);
}
.data-table tbody td{
  border-top:1px solid rgba(255,176,96,.22);
  border-bottom:1px solid rgba(255,98,0,.18);
  box-shadow:
    inset 0 1px 0 rgba(255,228,186,.08),
    inset 12px 0 18px rgba(255,132,40,.04),
    inset -12px 0 18px rgba(0,0,0,.16),
    0 0 22px rgba(255,92,0,.04);
}
.data-table tbody td:first-child,
.data-table tbody td:last-child{position:relative}
.data-table tbody td:first-child::before,
.data-table tbody td:last-child::before{
  content:""; position:absolute; top:8px; bottom:8px; width:3px; border-radius:999px;
  background:linear-gradient(180deg, rgba(255,208,134,.80), rgba(255,92,0,.45), rgba(84,24,6,.60));
  box-shadow:0 0 14px rgba(255,92,0,.14);
}
.data-table tbody td:first-child::before{left:8px}
.data-table tbody td:last-child::before{right:8px}
.shop-shell{
  padding:34px;
  background:
    radial-gradient(circle at 50% 0%, rgba(255,148,52,.08), transparent 28%),
    linear-gradient(180deg, rgba(255,218,166,.06) 0%, transparent 10%),
    linear-gradient(180deg, rgba(36,9,5,.82), rgba(10,3,2,.94));
}
.shop-shell::before{
  content:""; position:absolute; inset:16px; border-radius:24px; pointer-events:none;
  background:linear-gradient(90deg, transparent, rgba(255,156,68,.05), transparent);
}
.shop-grid{grid-template-columns:repeat(3,minmax(260px,1fr)); gap:28px; margin-top:28px}
.shop-card{
  min-height:420px;
  padding:28px;
  border-radius:30px;
  box-shadow:
    inset 0 1px 0 rgba(255,217,154,.12),
    inset 0 -30px 42px rgba(0,0,0,.28),
    inset 18px 0 28px rgba(255,124,20,.06),
    inset -18px 0 28px rgba(0,0,0,.24),
    0 0 0 1px rgba(255,145,44,.12),
    0 0 40px rgba(255,96,0,.12);
}
.shop-card::before{
  content:""; position:absolute; inset:0; pointer-events:none;
  background:
    linear-gradient(135deg, transparent 0 14%, rgba(255,222,182,.06) 20%, transparent 28%),
    radial-gradient(circle at 84% 18%, rgba(255,108,0,.18), transparent 16%),
    radial-gradient(circle at 18% 82%, rgba(255,170,72,.08), transparent 14%);
}
.shop-badge{
  top:16px; right:16px; padding:9px 14px; letter-spacing:.4px;
  background:linear-gradient(180deg, rgba(255,170,72,.28), rgba(255,88,0,.24));
}
.shop-visual{height:146px; border-radius:22px; inset:20px 20px auto 20px}
.shop-kind{font-size:17px; letter-spacing:1px; text-transform:uppercase}
.shop-card h3{font-size:34px; margin:98px 0 12px}
.shop-card p{font-size:18px; min-height:84px}
.shop-meta{padding-top:8px; border-top:1px solid rgba(255,146,42,.14)}
.shop-meta strong{font-size:28px; text-shadow:0 0 18px rgba(255,92,0,.10)}
.shop-card .lava-btn{margin-top:auto}
.shop-card:hover{
  transform:translateY(-5px);
  box-shadow:
    inset 0 1px 0 rgba(255,217,154,.14),
    inset 0 -30px 42px rgba(0,0,0,.28),
    inset 18px 0 28px rgba(255,124,20,.08),
    inset -18px 0 28px rgba(0,0,0,.24),
    0 0 0 1px rgba(255,178,96,.18),
    0 0 52px rgba(255,96,0,.18);
}
.itemshop-headline{
  display:flex; justify-content:space-between; align-items:end; gap:20px; flex-wrap:wrap; margin-bottom:10px;
}
.itemshop-kpis{display:flex; gap:14px; flex-wrap:wrap}
.itemshop-kpis span{
  padding:12px 16px; border-radius:16px; min-width:150px;
  background:linear-gradient(180deg, rgba(255,216,162,.08), rgba(16,5,3,.82));
  border:1px solid rgba(255,146,42,.18);
  box-shadow:inset 0 1px 0 rgba(255,225,185,.10), 0 0 18px rgba(255,96,0,.06);
}
.itemshop-kpis strong{display:block; font-size:22px; margin-top:4px}
@media (max-width:860px){
  .join-btn{min-width:0; width:100%; padding-left:126px}
  .join-btn__dragon{width:120px; height:60px; left:6px}
  .join-btn__text{font-size:24px}
  .shop-grid{grid-template-columns:1fr}
}


/* ===== V5.2 final polish ===== */
.hero-buttons{align-items:center}
.hero-buttons .join-btn{flex:0 0 auto}
.join-btn{
  min-width:340px !important;
  width:340px;
  padding:18px 28px 18px 110px !important;
  justify-content:center;
  border-radius:20px;
  animation:joinPulseSmooth 3.2s ease-in-out infinite;
}
.join-btn__text{
  font-size:23px !important;
  letter-spacing:1.6px;
}
.join-btn__dragon{
  left:10px !important;
  width:110px !important;
  height:54px !important;
  background:url('../images/dragon-btn.png') left center/contain no-repeat !important;
  mix-blend-mode:screen;
  image-rendering:auto;
  transform:translate3d(0,-50%,0);
  will-change:transform;
  animation:dragonGlide 6.2s cubic-bezier(.42,0,.2,1) infinite !important;
}
.join-btn__dragon::after{
  left:64% !important;
  width:56px !important;
  height:20px !important;
  filter:blur(8px);
}
.join-btn__sparks::before,
.join-btn__sparks::after{
  left:19% !important;
  width:110px !important;
  height:26px !important;
  opacity:.78;
  background:
    radial-gradient(circle, rgba(255,222,150,.95) 0 1px, transparent 2px) 8px 10px/24px 14px repeat-x,
    radial-gradient(circle, rgba(255,138,36,.82) 0 1.4px, transparent 2.5px) 0 3px/20px 14px repeat-x,
    radial-gradient(circle, rgba(255,84,0,.52) 0 1.8px, transparent 3.2px) 8px 13px/34px 18px repeat-x;
  animation:sparksFollow 6.2s cubic-bezier(.42,0,.2,1) infinite !important;
}
.join-btn__sparks::after{opacity:.45; animation-delay:.18s !important;}
@keyframes dragonGlide{
  0%,12%{transform:translate3d(-6px,-50%,0) scale(.94); opacity:.92}
  30%{transform:translate3d(12px,-50%,0) scale(.985); opacity:1}
  55%{transform:translate3d(32px,-50%,0) scale(1); opacity:1}
  78%{transform:translate3d(14px,-50%,0) scale(.975); opacity:.98}
  100%{transform:translate3d(-4px,-50%,0) scale(.94); opacity:.92}
}
@keyframes sparksFollow{
  0%,10%{left:20%; opacity:0}
  18%{opacity:.78}
  48%{left:28%; opacity:.82}
  72%{left:34%; opacity:.58}
  100%{left:40%; opacity:0}
}
@keyframes joinPulseSmooth{
  0%,100%{box-shadow:inset 0 1px 0 rgba(255,246,226,.40), inset 0 -1px 0 rgba(255,134,36,.34), inset 34px 0 42px rgba(255,162,58,.16), inset -24px 0 28px rgba(0,0,0,.28), 0 0 0 1px rgba(255,196,118,.50), 0 0 0 2px rgba(108,30,8,.62), 0 0 38px rgba(255,94,0,.22)}
  50%{box-shadow:inset 0 1px 0 rgba(255,250,236,.48), inset 0 -1px 0 rgba(255,148,48,.40), inset 40px 0 46px rgba(255,170,66,.20), inset -24px 0 28px rgba(0,0,0,.28), 0 0 0 1px rgba(255,208,132,.62), 0 0 0 2px rgba(118,36,10,.68), 0 0 56px rgba(255,98,0,.34)}
}
.lava-btn{
  overflow:hidden;
}
.lava-btn .btn-label{position:relative;z-index:2}
.lava-btn::before{
  background:
    linear-gradient(180deg, rgba(255,248,230,.18), transparent 24%),
    linear-gradient(90deg, rgba(255,166,54,.22), transparent 16%, transparent 84%, rgba(255,110,26,.16)),
    radial-gradient(circle at 14% 50%, rgba(255,96,0,.20) 0 10%, transparent 18%),
    radial-gradient(circle at 86% 50%, rgba(255,194,116,.12) 0 10%, transparent 18%),
    linear-gradient(180deg, transparent 62%, rgba(0,0,0,.18));
}
.lava-btn::after{
  background:
    linear-gradient(115deg, transparent 6%, rgba(255,239,202,.18) 18%, transparent 30%),
    linear-gradient(90deg, transparent 0 14%, rgba(255,176,88,.14) 22%, transparent 34%),
    radial-gradient(circle at 10% 50%, rgba(255,140,20,.44) 0 6%, transparent 14%),
    radial-gradient(circle at 90% 50%, rgba(255,86,0,.36) 0 8%, transparent 16%),
    linear-gradient(90deg, transparent 0 8%, rgba(255,88,0,.08) 12%, transparent 16%, transparent 82%, rgba(255,184,96,.08) 88%, transparent 94%);
}
.data-table tbody td{
  background:
    linear-gradient(180deg, rgba(255,221,166,.07) 0%, rgba(255,126,20,.02) 16%, transparent 22%),
    linear-gradient(90deg, rgba(255,102,0,.08), transparent 14%, transparent 86%, rgba(255,164,88,.06)),
    linear-gradient(180deg, rgba(29,9,4,.92), rgba(12,4,2,.96)) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,228,186,.08),
    inset 10px 0 14px rgba(255,132,40,.06),
    inset -10px 0 14px rgba(0,0,0,.20),
    0 0 0 1px rgba(255,112,18,.08),
    0 0 22px rgba(255,92,0,.05) !important;
}
.data-table tbody td:first-child::before,
.data-table tbody td:last-child::before{
  width:4px;
  box-shadow:0 0 16px rgba(255,92,0,.18), 0 0 34px rgba(255,114,24,.08);
}
.panel.lava-frame::after{
  background:
    radial-gradient(circle at 8% 12%, rgba(255,126,16,.18), transparent 18%),
    radial-gradient(circle at 92% 84%, rgba(255,94,0,.16), transparent 20%),
    linear-gradient(90deg, rgba(255,133,28,.05), transparent 16%, transparent 84%, rgba(255,133,28,.05)),
    linear-gradient(180deg, transparent 0 82%, rgba(255,92,0,.04) 90%, transparent 100%);
}
.shop-shell{
  background:
    radial-gradient(circle at 50% 0%, rgba(255,148,52,.12), transparent 24%),
    linear-gradient(180deg, rgba(255,218,166,.06) 0%, transparent 10%),
    linear-gradient(180deg, rgba(36,9,5,.86), rgba(8,3,2,.96)) !important;
}
.itemshop-headline{
  padding:0 0 18px;
  border-bottom:1px solid rgba(255,138,39,.16);
  margin-bottom:18px;
}
.itemshop-headline .panel-header{font-size:42px}
.shop-grid{gap:30px !important}
.shop-card{
  min-height:460px !important;
  background:
    linear-gradient(180deg, rgba(255,218,166,.05), transparent 12%),
    linear-gradient(180deg, rgba(26,8,4,.84), rgba(10,3,2,.96));
}
.shop-card::after{width:260px !important; height:260px !important; opacity:.9}
.shop-visual{
  height:162px !important;
  box-shadow:
    inset 0 1px 0 rgba(255,231,193,.18),
    inset 0 -24px 26px rgba(0,0,0,.34),
    inset 18px 0 28px rgba(255,132,44,.10),
    0 0 0 1px rgba(255,154,66,.20),
    0 0 34px rgba(255,86,0,.16) !important;
}
.shop-card h3{font-size:36px !important}
.shop-meta strong{font-size:30px !important}
.shop-card .lava-btn{margin-top:8px}
@media (max-width:860px){
  .join-btn{width:100%; min-width:0; padding-left:106px !important}
  .join-btn__dragon{width:96px !important; height:48px !important}
  .join-btn__text{font-size:20px !important}
}


/* ==== v5d premium overrides ==== */
.hero-subcopy,.hint-text strong{display:none}
.hero-buttons{gap:18px; align-items:center}
.hero-buttons .lava-btn{min-width:230px; height:76px; font-size:25px; border-radius:24px}
.hero-buttons .join-btn{min-width:320px; width:320px; height:76px; padding:0 26px; justify-content:center}
.hero-buttons .join-btn .join-btn__text{position:relative; z-index:3; width:100%; text-align:center; text-transform:uppercase; letter-spacing:1px; font-size:24px; text-shadow:0 0 18px rgba(255,188,98,.28), 0 0 34px rgba(255,91,0,.22)}
.join-btn{overflow:hidden; isolation:isolate}
.join-btn__dragon{position:absolute; left:-8px; top:50%; width:118px; height:52px; transform:translateY(-50%); background:url('../images/dragon-btn.png') no-repeat center/contain; opacity:.92; z-index:1; filter:drop-shadow(0 0 14px rgba(255,113,20,.34)) saturate(1.08); animation:dragonCruise 6.8s cubic-bezier(.45,.03,.55,.97) infinite alternate; will-change:transform,left}
.join-btn__dragon::after{content:''; position:absolute; inset:auto -12px 14px 42px; height:12px; background:linear-gradient(90deg, rgba(255,140,46,.0), rgba(255,149,48,.42), rgba(255,91,0,.12), transparent 88%); filter:blur(8px); opacity:.75}
.join-btn__sparks{position:absolute; inset:0; pointer-events:none; z-index:2; overflow:hidden}
.join-btn__sparks::before,.join-btn__sparks::after{content:''; position:absolute; width:140px; height:40px; left:0; top:50%; transform:translateY(-50%); background:radial-gradient(circle at 16% 50%, rgba(255,202,132,.85) 0 2px, transparent 2.5px), radial-gradient(circle at 28% 46%, rgba(255,160,82,.72) 0 1.8px, transparent 2.4px), radial-gradient(circle at 44% 62%, rgba(255,111,22,.72) 0 1.7px, transparent 2.4px), radial-gradient(circle at 58% 38%, rgba(255,196,96,.65) 0 1.8px, transparent 2.4px), radial-gradient(circle at 76% 58%, rgba(255,120,20,.62) 0 1.8px, transparent 2.4px); filter:blur(.2px); animation:sparksCruise 6.8s cubic-bezier(.45,.03,.55,.97) infinite alternate; opacity:.72}
.join-btn__sparks::after{width:170px; height:48px; opacity:.38; animation-duration:7.6s; animation-delay:.15s; filter:blur(1.6px)}
@keyframes dragonCruise{0%{left:-6px; transform:translateY(-50%) translateX(0) scale(.94)}45%{transform:translateY(-50%) translateX(0) scale(1)}100%{left:206px; transform:translateY(-50%) translateX(0) scale(.96)}}
@keyframes sparksCruise{0%{left:6px; opacity:.25}50%{opacity:.82}100%{left:192px; opacity:.18}}
.hero-logo{width:min(680px,88%); filter:drop-shadow(0 0 26px rgba(255,128,36,.22)) drop-shadow(0 0 52px rgba(255,88,0,.12));}
.brand-mini img{clip-path:none; -webkit-mask-image:none; mask-image:none; filter:drop-shadow(0 0 18px rgba(255,108,22,.34)) saturate(1.12) contrast(1.08)}
.logo-stage{margin-bottom:8px}
.lava-btn,.server-info div,.quick-user,.detail-card,.mini-feature,.auth-info,.shop-card,.data-table tbody td,.panel{backdrop-filter:blur(2px)}
.lava-btn{background:linear-gradient(180deg, rgba(255,235,196,.22) 0%, rgba(255,214,151,.06) 18%, transparent 24%), radial-gradient(circle at 18% 28%, rgba(255,151,46,.28), transparent 24%), radial-gradient(circle at 78% 72%, rgba(255,86,0,.24), transparent 26%), linear-gradient(135deg, rgba(123,37,8,.98) 0%, rgba(77,18,6,.98) 42%, rgba(31,9,4,.98) 100%); box-shadow:inset 0 1px 0 rgba(255,245,223,.40), inset 0 -1px 0 rgba(255,120,16,.28), inset 0 0 30px rgba(255,108,24,.12), 0 0 0 1px rgba(255,178,96,.42), 0 0 22px rgba(255,94,0,.20), 0 10px 28px rgba(0,0,0,.18)}
.lava-btn::before{background:linear-gradient(180deg, rgba(255,255,255,.10), transparent 34%), radial-gradient(circle at 24% 18%, rgba(255,196,116,.22), transparent 18%), radial-gradient(circle at 78% 76%, rgba(255,89,0,.16), transparent 22%), linear-gradient(90deg, rgba(255,150,42,.12), transparent 18%, transparent 82%, rgba(255,150,42,.07))}
.lava-btn:hover{box-shadow:inset 0 1px 0 rgba(255,245,223,.48), inset 0 -1px 0 rgba(255,120,16,.34), inset 0 0 34px rgba(255,108,24,.16), 0 0 0 1px rgba(255,198,118,.56), 0 0 34px rgba(255,94,0,.26), 0 14px 32px rgba(0,0,0,.22)}
.panel{box-shadow:inset 0 1px 0 rgba(255,217,154,.10), inset 0 -28px 38px rgba(0,0,0,.22), 0 0 0 1px rgba(255,145,44,.10), 0 0 34px rgba(255,96,0,.14), 0 18px 42px rgba(0,0,0,.18)}
.lava-frame::before{padding:2.3px; background:linear-gradient(135deg, rgba(255,230,170,.84), rgba(255,132,24,.84) 16%, rgba(80,18,1,.92) 38%, rgba(255,101,10,.82) 72%, rgba(255,229,166,.70))}
.lava-frame::after{background:radial-gradient(circle at 10% 14%, rgba(255,126,16,.22), transparent 18%), radial-gradient(circle at 90% 88%, rgba(255,94,0,.18), transparent 20%), linear-gradient(90deg, rgba(255,133,28,.06), transparent 14%, transparent 86%, rgba(255,133,28,.07)), repeating-linear-gradient(115deg, rgba(255,120,24,.06) 0 2px, transparent 2px 18px)}
.data-table tbody td{background:linear-gradient(180deg, rgba(255,232,188,.07) 0%, rgba(255,134,34,.02) 26%), linear-gradient(180deg, rgba(28,8,4,.92), rgba(12,4,2,.95)); box-shadow:inset 0 1px 0 rgba(255,228,186,.08), inset 22px 0 24px rgba(255,132,40,.05), inset -18px 0 24px rgba(0,0,0,.18), 0 0 0 1px rgba(255,115,16,.08), 0 0 22px rgba(255,92,0,.08)}
.data-table tbody tr:hover td{box-shadow:inset 0 1px 0 rgba(255,228,186,.10), inset 24px 0 24px rgba(255,142,40,.08), inset -22px 0 24px rgba(0,0,0,.20), 0 0 0 1px rgba(255,142,40,.16), 0 0 28px rgba(255,86,0,.16)}
.itemshop-headline{padding:18px 20px 20px; border-radius:26px; background:linear-gradient(180deg, rgba(255,212,150,.08), transparent 22%), linear-gradient(135deg, rgba(46,12,6,.92), rgba(18,5,3,.96)); border:1px solid rgba(255,149,48,.22); box-shadow:inset 0 1px 0 rgba(255,226,185,.08), 0 0 26px rgba(255,90,0,.12); margin-bottom:24px}
.itemshop-headline .panel-header{margin-bottom:8px; text-shadow:0 0 16px rgba(255,118,16,.16)}
.shop-grid{gap:24px}
.shop-card{padding:24px; border-radius:28px; background:linear-gradient(180deg, rgba(255,216,152,.05) 0%, transparent 18%), linear-gradient(180deg, rgba(34,10,5,.84), rgba(12,4,2,.94)); border:1px solid rgba(255,138,39,.18); box-shadow:inset 0 1px 0 rgba(255,221,170,.08), inset 0 -30px 34px rgba(0,0,0,.18), inset 18px 0 24px rgba(255,130,44,.04), inset -18px 0 24px rgba(0,0,0,.18), 0 0 0 1px rgba(255,145,44,.06), 0 0 30px rgba(255,102,0,.10)}
.shop-card:hover{transform:translateY(-4px); box-shadow:inset 0 1px 0 rgba(255,221,170,.10), inset 0 -30px 34px rgba(0,0,0,.20), inset 18px 0 24px rgba(255,130,44,.06), inset -18px 0 24px rgba(0,0,0,.20), 0 0 0 1px rgba(255,175,84,.12), 0 0 38px rgba(255,102,0,.14)}
.shop-visual{height:158px; border-radius:24px; background:linear-gradient(180deg, rgba(255,226,180,.09), transparent 20%), linear-gradient(135deg, rgba(92,26,6,.96), rgba(27,7,3,.98)); border:1px solid rgba(255,153,58,.18); box-shadow:inset 0 1px 0 rgba(255,240,216,.10), inset 0 -16px 22px rgba(0,0,0,.18), 0 0 26px rgba(255,98,0,.14)}
.shop-visual::before{background:radial-gradient(circle at 22% 34%, rgba(255,193,112,.24), transparent 16%), radial-gradient(circle at 68% 62%, rgba(255,94,0,.20), transparent 18%), linear-gradient(120deg, transparent 0 18%, rgba(255,211,159,.08) 28%, transparent 40%)}
.shop-visual::after{height:38px; background:linear-gradient(90deg, rgba(255,76,0,.18), rgba(255,176,92,.40), rgba(255,76,0,.18)); filter:blur(12px)}
.shop-kind{font-size:16px; letter-spacing:1.2px; text-transform:uppercase; color:#ffdfb2; text-shadow:0 0 14px rgba(255,120,18,.18)}
.shop-extra{display:flex; flex-wrap:wrap; gap:8px; margin:6px 0 16px; position:relative; z-index:1}
.shop-extra span{padding:6px 10px; border-radius:999px; font-size:12px; text-transform:uppercase; letter-spacing:.9px; color:#ffe6be; border:1px solid rgba(255,167,80,.24); background:rgba(88,26,8,.58); box-shadow:inset 0 1px 0 rgba(255,214,154,.08), 0 0 16px rgba(255,94,0,.08)}
@media (max-width: 900px){.hero-buttons .join-btn{width:280px; min-width:280px}.join-btn__dragon{width:108px; height:48px}.hero-buttons .lava-btn{min-width:200px; height:70px}.join-btn__text{font-size:21px !important}}


/* v5e overrides */
.brand-mini{width:190px;border-radius:0;overflow:visible}
.brand-mini img,
.footer-logo img,
.hero-logo,
.hero-logo-small{
  clip-path:none !important;
  -webkit-mask-image:none !important;
  mask-image:none !important;
  filter:drop-shadow(0 0 22px rgba(255,108,16,.22)) saturate(1.08) contrast(1.04) !important;
}
.footer-logo{width:260px;overflow:visible;border-radius:0}
.footer-logo img{width:260px}
.hero-logo{width:min(760px,92%)}
.logo-stage{overflow:visible;border-radius:0}
.logo-rune{display:none}

.hero-buttons .lava-btn{position:relative;min-width:240px;height:72px;font-size:24px;border-radius:22px}
.hero-buttons .join-btn{min-width:280px !important;width:280px !important;height:68px !important;padding:0 20px !important;justify-content:center;border-radius:22px}
.hero-buttons .join-btn .join-btn__text{font-size:22px !important;letter-spacing:1px;text-align:center;z-index:3}
.join-btn{overflow:hidden;isolation:isolate}
.join-btn::before{content:'';position:absolute;inset:0;background:linear-gradient(120deg, rgba(255,178,74,.14), transparent 25%, transparent 70%, rgba(255,102,0,.15)), radial-gradient(circle at 24% 50%, rgba(255,136,32,.28), transparent 22%), radial-gradient(circle at 82% 46%, rgba(255,78,0,.16), transparent 20%);mix-blend-mode:screen;opacity:.88}
.join-btn__dragon{position:absolute;left:-44px !important;top:50%;width:170px !important;height:82px !important;transform:translateY(-50%);background:url('../images/dragon-btn.png') no-repeat center/contain;opacity:.92;z-index:1;filter:drop-shadow(0 0 16px rgba(255,113,20,.38)) saturate(1.05);animation:dragonCruiseSmooth 9.5s linear infinite;will-change:transform,left;background-size:contain}
.join-btn__dragon::after{content:'';position:absolute;left:62px;right:-24px;bottom:14px;height:16px;background:linear-gradient(90deg, rgba(255,168,74,0), rgba(255,158,52,.34) 28%, rgba(255,84,0,.18) 58%, transparent 92%);filter:blur(10px);opacity:.85}
.join-btn__sparks::before,.join-btn__sparks::after{width:190px !important;height:56px !important;animation:sparksCruiseSmooth 9.5s linear infinite !important;opacity:.9}
.join-btn__sparks::after{opacity:.48 !important;animation-delay:-4.75s !important}
@keyframes dragonCruiseSmooth{0%{left:-52px;transform:translateY(-50%) translateX(0)}50%{left:148px;transform:translateY(-50%) translateX(0)}100%{left:-52px;transform:translateY(-50%) translateX(0)}}
@keyframes sparksCruiseSmooth{0%{left:-20px;opacity:.15}10%{opacity:.9}50%{left:120px;opacity:.85}90%{opacity:.25}100%{left:-20px;opacity:.15}}

.panel,.shop-card,.quick-user,.detail-card,.mini-feature,.auth-info,.server-info div{box-shadow:inset 0 1px 0 rgba(255,221,170,.10), inset 0 -30px 34px rgba(0,0,0,.22), inset 22px 0 28px rgba(255,126,22,.04), inset -20px 0 26px rgba(0,0,0,.18), 0 0 0 1px rgba(255,145,44,.08), 0 0 34px rgba(255,96,0,.12)}
.panel::before,.shop-card::before,.quick-user::before,.detail-card::before,.mini-feature::before,.auth-info::before,.server-info div::before{background:linear-gradient(120deg, transparent 0 18%, rgba(255,211,159,.08) 28%, transparent 40%), radial-gradient(circle at 88% 18%, rgba(255,96,0,.15), transparent 18%), radial-gradient(circle at 14% 82%, rgba(255,170,54,.10), transparent 16%)}
.data-table tbody td{box-shadow:inset 0 1px 0 rgba(255,228,186,.08), inset 22px 0 26px rgba(255,132,40,.05), inset -18px 0 24px rgba(0,0,0,.18), 0 0 0 1px rgba(255,115,16,.08), 0 0 24px rgba(255,92,0,.10)}
.data-table tbody tr:hover td{box-shadow:inset 0 1px 0 rgba(255,228,186,.10), inset 24px 0 30px rgba(255,142,40,.08), inset -22px 0 26px rgba(0,0,0,.20), 0 0 0 1px rgba(255,142,40,.12), 0 0 30px rgba(255,86,0,.15)}

.shop-shell .panel-header,.shop-shell .section-title{font-size:40px}
.shop-grid{gap:26px}
.shop-card{padding:24px;border-radius:26px;background:linear-gradient(180deg, rgba(255,214,152,.06) 0%, transparent 16%), linear-gradient(180deg, rgba(36,10,5,.78), rgba(12,4,2,.90));border:1px solid rgba(255,138,39,.18)}
.shop-card h3{font-size:32px;margin:92px 0 10px}
.shop-card::after{content:'';position:absolute;inset:8px;border-radius:20px;pointer-events:none;background:linear-gradient(130deg, transparent 8%, rgba(255,225,178,.06) 22%, transparent 36%), radial-gradient(circle at 82% 14%, rgba(255,118,16,.16), transparent 16%), radial-gradient(circle at 18% 84%, rgba(255,154,42,.10), transparent 16%)}
.shop-badge{box-shadow:0 0 18px rgba(255,116,0,.18), inset 0 1px 0 rgba(255,216,160,.12)}


/* ===== v5f final fixes ===== */
body{background-position:center top;background-size:cover;}
.brand-mini{width:220px !important;overflow:visible !important;border-radius:0 !important;}
.brand-mini img{width:220px !important;height:auto !important;display:block;object-fit:contain;filter:drop-shadow(0 0 18px rgba(255,118,24,.32)) saturate(1.1) contrast(1.05) !important;}
.logo-stage{padding:8px 12px 0 !important;overflow:visible !important;}
.logo-stage::before,.logo-rune{display:none !important;}
.hero-logo{width:min(760px,90vw) !important;max-width:760px !important;height:auto !important;display:block;margin:0 auto;filter:drop-shadow(0 0 24px rgba(255,116,16,.24)) saturate(1.08) contrast(1.04) !important;}
.hero-logo-small{width:min(540px,80vw) !important;max-width:540px !important;}
.footer-logo{width:260px !important;overflow:visible !important;border-radius:0 !important;}
.footer-logo img{width:260px !important;height:auto !important;display:block;margin:0 auto;object-fit:contain;filter:drop-shadow(0 0 16px rgba(255,110,20,.24)) saturate(1.08) !important;}
.hero-buttons{gap:20px !important;}
.hero-buttons .join-btn{width:290px !important;min-width:290px !important;height:68px !important;padding:0 22px !important;justify-content:center !important;border-radius:22px !important;box-shadow:0 10px 24px rgba(0,0,0,.20), inset 0 1px 0 rgba(255,231,192,.18), inset 0 -18px 28px rgba(70,14,0,.32), 0 0 0 1px rgba(255,150,68,.12), 0 0 28px rgba(255,92,0,.14) !important;}
.hero-buttons .join-btn .join-btn__text{position:relative;z-index:3;font-size:21px !important;letter-spacing:1px !important;text-align:center;text-transform:uppercase;text-shadow:0 0 18px rgba(255,210,120,.38),0 0 36px rgba(255,102,0,.22) !important;}
.join-btn{overflow:hidden;isolation:isolate;}
.join-btn::before{content:"";position:absolute;inset:0;background:linear-gradient(120deg, rgba(255,184,82,.13), transparent 22%, transparent 70%, rgba(255,90,0,.12)), radial-gradient(circle at 20% 50%, rgba(255,142,40,.18), transparent 20%), radial-gradient(circle at 84% 46%, rgba(255,78,0,.14), transparent 22%);mix-blend-mode:screen;opacity:.92;z-index:0;}
.join-btn__dragon{position:absolute;left:-70px !important;top:50%;width:220px !important;height:96px !important;transform:translateY(-50%);background:url('../images/dragon-btn.png') no-repeat center/contain;background-size:contain;opacity:.96;z-index:1;filter:drop-shadow(0 0 18px rgba(255,118,20,.42)) saturate(1.12);animation:dragonCruiseUltra 11s cubic-bezier(.42,0,.2,1) infinite !important;will-change:left,transform;}
.join-btn__dragon::after{content:"";position:absolute;left:82px;right:-36px;bottom:16px;height:18px;background:linear-gradient(90deg, rgba(255,186,88,0), rgba(255,163,58,.42) 26%, rgba(255,92,0,.26) 54%, transparent 90%);filter:blur(10px);opacity:.92;}
.join-btn__sparks{position:absolute;inset:0;pointer-events:none;z-index:2;overflow:hidden;}
.join-btn__sparks::before,.join-btn__sparks::after{content:"";position:absolute;left:-30px;top:50%;width:220px;height:62px;transform:translateY(-50%);background:radial-gradient(circle at 10% 50%, rgba(255,238,188,.98) 0 2.6px, transparent 3.2px), radial-gradient(circle at 18% 38%, rgba(255,196,112,.95) 0 2.4px, transparent 3.2px), radial-gradient(circle at 28% 56%, rgba(255,146,52,.88) 0 2.2px, transparent 3px), radial-gradient(circle at 42% 34%, rgba(255,104,18,.86) 0 2.1px, transparent 2.8px), radial-gradient(circle at 58% 60%, rgba(255,192,88,.85) 0 2.3px, transparent 3px), radial-gradient(circle at 72% 44%, rgba(255,132,28,.82) 0 2px, transparent 2.7px), radial-gradient(circle at 86% 58%, rgba(255,88,0,.76) 0 1.9px, transparent 2.6px);filter:blur(.15px) drop-shadow(0 0 8px rgba(255,132,40,.28));opacity:.96;animation:sparksCruiseUltra 11s cubic-bezier(.42,0,.2,1) infinite !important;}
.join-btn__sparks::after{width:260px;height:72px;opacity:.54;filter:blur(2.4px);animation-delay:-5.5s !important;}
@keyframes dragonCruiseUltra{0%{left:-78px;transform:translateY(-50%) scale(.98)}12%{left:-20px;transform:translateY(-50%) scale(1)}50%{left:78px;transform:translateY(-50%) scale(1.02)}88%{left:126px;transform:translateY(-50%) scale(1)}100%{left:-78px;transform:translateY(-50%) scale(.98)}}
@keyframes sparksCruiseUltra{0%{left:-24px;opacity:.14}12%{opacity:.96}50%{left:88px;opacity:.92}88%{left:142px;opacity:.26}100%{left:-24px;opacity:.14}}
.lava-btn:not(.join-btn){background:linear-gradient(180deg, rgba(170,78,10,.96) 0%, rgba(103,34,5,.98) 40%, rgba(51,14,3,1) 100%) !important;border:1px solid rgba(255,169,78,.36) !important;box-shadow:inset 0 1px 0 rgba(255,229,180,.26), inset 0 -16px 28px rgba(59,12,0,.38), 0 0 0 1px rgba(255,122,20,.10), 0 12px 22px rgba(0,0,0,.18), 0 0 24px rgba(255,88,0,.10) !important;}
.lava-btn:not(.join-btn)::before{content:"";position:absolute;inset:0;border-radius:inherit;background:linear-gradient(120deg, rgba(255,210,136,.16), transparent 24%, transparent 72%, rgba(255,98,0,.18)), radial-gradient(circle at 18% 50%, rgba(255,156,54,.18), transparent 22%), radial-gradient(circle at 84% 42%, rgba(255,88,0,.12), transparent 20%);mix-blend-mode:screen;opacity:.95;pointer-events:none;}
.lava-btn .btn-label{position:relative;z-index:2;text-shadow:0 0 14px rgba(255,206,140,.20),0 0 28px rgba(255,96,0,.10);}
.lava-frame{box-shadow:inset 0 1px 0 rgba(255,217,154,.12), inset 0 -30px 40px rgba(0,0,0,.22), 0 0 0 1px rgba(255,145,44,.09), 0 0 36px rgba(255,96,0,.14) !important;}
.lava-frame::before{background:linear-gradient(135deg, rgba(255,222,160,.82), rgba(255,126,24,.86) 16%, rgba(98,28,2,.96) 42%, rgba(255,138,28,.80) 76%, rgba(255,230,170,.68)) !important;box-shadow:0 0 24px rgba(255,95,0,.18) !important;}
.lava-frame::after{background:radial-gradient(circle at 10% 14%, rgba(255,126,16,.20), transparent 18%), radial-gradient(circle at 90% 88%, rgba(255,94,0,.18), transparent 20%), linear-gradient(90deg, rgba(255,133,28,.07), transparent 16%, transparent 84%, rgba(255,133,28,.08)), linear-gradient(180deg, rgba(255,220,176,.04), transparent 20%, transparent 80%, rgba(255,95,0,.05)) !important;}
.data-table tbody td{box-shadow:inset 0 1px 0 rgba(255,228,186,.08), inset 20px 0 30px rgba(255,132,40,.05), inset -18px 0 24px rgba(0,0,0,.18), 0 0 0 1px rgba(255,115,16,.08), 0 0 22px rgba(255,92,0,.10) !important;}
.shop-card{box-shadow:inset 0 1px 0 rgba(255,221,170,.10), inset 20px 0 30px rgba(255,130,44,.04), inset -18px 0 24px rgba(0,0,0,.18), 0 0 0 1px rgba(255,145,44,.08), 0 0 32px rgba(255,102,0,.12) !important;}
@media (max-width:900px){.brand-mini{width:170px !important}.brand-mini img{width:170px !important}.hero-logo{width:min(540px,88vw) !important}.hero-buttons .join-btn{width:250px !important;min-width:250px !important;height:62px !important}.join-btn__dragon{width:180px !important;height:78px !important}.join-btn__text{font-size:19px !important}}


/* v5g fixes */
.brand-mini{width:150px;border-radius:0 !important;overflow:visible !important}
.brand-mini img,
.hero-logo,
.hero-logo-small,
.footer-logo img{
  clip-path:none !important;
  -webkit-mask-image:none !important;
  mask-image:none !important;
  border-radius:0 !important;
  background:transparent !important;
}
.brand-mini img{width:150px !important;filter:drop-shadow(0 0 16px rgba(255,110,18,.22)) saturate(1.03) contrast(1.02) !important}
.logo-stage{overflow:visible !important;border-radius:0 !important}
.logo-rune{display:none !important}
.hero-logo{width:min(760px,90%) !important;filter:drop-shadow(0 0 24px rgba(255,110,18,.18)) saturate(1.02) contrast(1.02) !important}
.hero-logo-small{width:min(520px,76%) !important}
.footer-logo{width:170px !important;border-radius:0 !important;overflow:visible !important}
.footer-logo img{width:170px !important;display:block;margin:0 auto;filter:drop-shadow(0 0 16px rgba(255,110,18,.18)) !important}
.logo-animated::after{display:none !important}
.hero-buttons .join-btn{min-width:290px !important;width:290px !important;height:72px !important;padding:0 24px !important}
.join-btn{overflow:hidden;isolation:isolate}
.join-btn__text{position:relative;z-index:3;font-size:23px !important;letter-spacing:1px;text-transform:uppercase;text-shadow:0 0 16px rgba(255,196,112,.28),0 0 28px rgba(255,99,0,.20)}
.join-btn__dragon{position:absolute !important;left:-82px !important;top:50% !important;width:152px !important;height:70px !important;transform:translateY(-50%);background:url('../images/dragon-btn.png') no-repeat center/contain !important;opacity:.95 !important;z-index:1 !important;filter:drop-shadow(0 0 12px rgba(255,112,20,.28)) saturate(1.05);will-change:transform;animation:dragonSmooth 5.4s ease-in-out infinite alternate !important;}
.join-btn__dragon::after{content:'';position:absolute;left:50px;right:-10px;top:34px;height:10px;background:linear-gradient(90deg, rgba(255,145,40,.0), rgba(255,146,42,.55), rgba(255,90,0,.18), transparent 82%);filter:blur(7px);opacity:.85;animation:trailPulse 1.3s ease-in-out infinite;}
.join-btn__sparks{position:absolute;inset:0;pointer-events:none;z-index:2;overflow:hidden}
.join-btn__sparks::before,.join-btn__sparks::after{content:'';position:absolute;left:12%;top:42%;width:76px;height:26px;background:radial-gradient(circle at 10% 50%, rgba(255,235,190,.95) 0 1px, transparent 2px),radial-gradient(circle at 26% 30%, rgba(255,178,85,.85) 0 1.6px, transparent 2.8px),radial-gradient(circle at 42% 60%, rgba(255,140,35,.9) 0 1.5px, transparent 2.6px),radial-gradient(circle at 68% 25%, rgba(255,200,120,.82) 0 1.2px, transparent 2.2px),radial-gradient(circle at 84% 72%, rgba(255,120,20,.95) 0 1.6px, transparent 2.8px);opacity:.86;filter:blur(.15px);animation:sparksDrift 1.2s linear infinite;}
.join-btn__sparks::after{top:52%;left:18%;opacity:.55;animation-duration:1.55s;animation-delay:.22s}
@keyframes dragonSmooth{0%{transform:translate(-6px,-50%)}100%{transform:translate(224px,-50%)}}
@keyframes trailPulse{0%,100%{opacity:.55}50%{opacity:.95}}
@keyframes sparksDrift{0%{transform:translateX(0) translateY(0);opacity:.15}20%{opacity:.92}100%{transform:translateX(214px) translateY(-10px);opacity:0}}
.lava-btn,.data-table tbody td,.shop-card,.server-info div,.quick-user,.detail-card,.mini-feature,.auth-info{background-image:linear-gradient(180deg, rgba(255,216,164,.20) 0%, rgba(255,216,164,.05) 16%, transparent 20%),radial-gradient(circle at 18% 26%, rgba(255,152,44,.18), transparent 16%),radial-gradient(circle at 84% 78%, rgba(255,90,0,.14), transparent 18%),linear-gradient(135deg, rgba(118,34,8,.98) 0%, rgba(72,18,6,.98) 42%, rgba(26,8,3,.98) 100%) !important;}
.lava-btn::before,.lava-frame::after,.shop-card::before,.server-info div::before,.quick-user::before,.detail-card::before,.mini-feature::before,.auth-info::before{background:linear-gradient(120deg, transparent 0 14%, rgba(255,223,176,.08) 24%, transparent 34%),radial-gradient(circle at 14% 18%, rgba(255,116,12,.12), transparent 12%),radial-gradient(circle at 88% 82%, rgba(255,84,0,.10), transparent 14%) !important;}


/* === v5h final cleanup === */
.brand-mini,.footer-logo,.logo-stage{overflow:visible !important;border-radius:0 !important;}
.brand-mini img,
.footer-logo img,
.hero-logo,
.hero-logo-small{
  filter:none !important;
  -webkit-filter:none !important;
  mix-blend-mode:normal !important;
  clip-path:none !important;
  -webkit-mask-image:none !important;
  mask-image:none !important;
  image-rendering:auto !important;
}
.logo-animated::after{display:none !important;content:none !important;}
.hero-logo{width:min(760px,90vw) !important;max-width:760px !important;}
.hero-logo-small{width:min(540px,78vw) !important;max-width:540px !important;}
.brand-mini{width:165px !important;}
.brand-mini img{width:165px !important;height:auto !important;display:block;}
.footer-logo{width:190px !important;}
.footer-logo img{width:190px !important;height:auto !important;display:block;margin:0 auto;}

.hero-buttons .join-btn{
  width:290px !important; min-width:290px !important; height:68px !important;
  border-radius:22px !important; overflow:hidden !important; isolation:isolate !important;
}
.hero-buttons .join-btn .join-btn__text{
  position:relative; z-index:4; width:100%; text-align:center;
  text-transform:uppercase; letter-spacing:1px; font-size:22px !important;
}
.join-btn__dragon{
  position:absolute !important;
  top:50% !important;
  left:-110px !important;
  width:240px !important;
  height:88px !important;
  transform:translateY(-50%) !important;
  background:url('../images/dragon-btn.png') no-repeat center/contain !important;
  background-size:contain !important;
  opacity:.98 !important;
  z-index:1 !important;
  filter:none !important;
  animation:dragonSmoothPass 7.2s linear infinite !important;
  will-change:transform,left !important;
}
.join-btn__dragon::after{
  content:'';
  position:absolute;
  left:90px;
  right:-42px;
  bottom:18px;
  height:18px;
  background:linear-gradient(90deg, rgba(255,180,80,0), rgba(255,163,58,.44) 26%, rgba(255,92,0,.30) 58%, transparent 94%);
  filter:blur(8px);
  opacity:.85;
}
.join-btn__sparks{position:absolute !important; inset:0 !important; z-index:3 !important; pointer-events:none !important; overflow:hidden !important;}
.join-btn__sparks::before,
.join-btn__sparks::after{
  content:'';
  position:absolute;
  top:50%; left:-120px;
  width:240px; height:70px;
  transform:translateY(-50%);
  background:
    radial-gradient(circle at 10% 52%, rgba(255,240,190,.95) 0 2.6px, transparent 3.1px),
    radial-gradient(circle at 18% 38%, rgba(255,210,120,.92) 0 2.3px, transparent 3px),
    radial-gradient(circle at 28% 58%, rgba(255,146,52,.90) 0 2.2px, transparent 2.9px),
    radial-gradient(circle at 40% 34%, rgba(255,104,18,.85) 0 2px, transparent 2.7px),
    radial-gradient(circle at 56% 60%, rgba(255,192,88,.82) 0 2.2px, transparent 2.9px),
    radial-gradient(circle at 68% 44%, rgba(255,132,28,.78) 0 2px, transparent 2.7px),
    radial-gradient(circle at 82% 58%, rgba(255,88,0,.76) 0 1.9px, transparent 2.6px);
  opacity:.92;
  filter:drop-shadow(0 0 7px rgba(255,140,40,.28));
  animation:sparksSmoothPass 7.2s linear infinite !important;
}
.join-btn__sparks::after{
  width:280px; height:82px; opacity:.5;
  filter:blur(1.4px) drop-shadow(0 0 10px rgba(255,120,30,.26));
  animation-delay:-3.6s !important;
}
@keyframes dragonSmoothPass{
  0%{left:-110px; transform:translateY(-50%) translateX(0) scale(.98);}
  50%{left:150px; transform:translateY(-50%) translateX(0) scale(1);}
  100%{left:-110px; transform:translateY(-50%) translateX(0) scale(.98);}
}
@keyframes sparksSmoothPass{
  0%{left:-120px; opacity:.08;}
  12%{opacity:.92;}
  50%{left:110px; opacity:.88;}
  88%{opacity:.12;}
  100%{left:-120px; opacity:.08;}
}
@media (max-width:900px){
  .brand-mini{width:140px !important}.brand-mini img{width:140px !important}
  .footer-logo{width:165px !important}.footer-logo img{width:165px !important}
  .hero-buttons .join-btn{width:250px !important;min-width:250px !important;height:62px !important}
  .join-btn__dragon{width:200px !important;height:72px !important}
  .hero-buttons .join-btn .join-btn__text{font-size:19px !important}
}


/* v5i final overrides */
.logo-animated::after{display:none !important;content:none !important;}
.brand-mini img,.footer-logo img,.hero-logo,.hero-logo-small{filter:none !important;clip-path:none !important;-webkit-mask-image:none !important;mask-image:none !important;}
.brand-mini{width:220px !important;border-radius:0 !important;overflow:visible !important;}
.footer-logo{width:240px !important;border-radius:0 !important;overflow:visible !important;}
.footer-logo img{width:240px !important;}
.hero-logo{width:min(760px,90vw) !important;max-width:760px !important;}
.hero-logo-small{width:min(520px,82vw) !important;max-width:520px !important;}
.story p:first-child{display:none !important;}
.hero-buttons .lava-btn{background:linear-gradient(180deg, rgba(255,205,130,.34) 0%, rgba(255,174,74,.18) 14%, rgba(169,58,14,.96) 48%, rgba(85,18,5,.98) 100%) !important;box-shadow:inset 0 1px 0 rgba(255,244,212,.34), inset 0 -1px 0 rgba(255,122,22,.34), inset 0 16px 28px rgba(255,168,56,.14), inset 0 -28px 38px rgba(42,8,2,.42), 0 0 0 1px rgba(255,174,88,.32), 0 0 36px rgba(255,95,0,.20) !important;}
.hero-buttons .lava-btn.secondary{background:linear-gradient(180deg, rgba(255,216,154,.28) 0%, rgba(255,188,88,.14) 12%, rgba(145,45,12,.96) 48%, rgba(73,16,5,.98) 100%) !important;}
.hero-buttons .lava-btn.accent{background:linear-gradient(180deg, rgba(255,224,156,.38) 0%, rgba(255,188,76,.20) 12%, rgba(190,68,16,.98) 50%, rgba(88,18,5,.99) 100%) !important;}
.hero-buttons .join-btn{width:300px !important;min-width:300px !important;height:72px !important;border-radius:22px !important;}
.join-btn__text{position:relative;z-index:4 !important;text-shadow:0 0 16px rgba(255,216,126,.45),0 0 28px rgba(255,96,0,.26) !important;}
.join-btn__dragon{position:absolute;left:-86px !important;top:50%;width:250px !important;height:112px !important;transform:translateY(-50%);background:url('../images/dragon-btn.png') no-repeat center/contain;background-size:contain;opacity:.98;z-index:1;filter:none !important;animation:dragonCruiseTrue 8.5s linear infinite !important;will-change:left,transform;}
.join-btn__dragon::after{content:'';position:absolute;left:88px;right:-48px;bottom:14px;height:22px;background:linear-gradient(90deg, rgba(255,196,116,0), rgba(255,170,74,.56) 22%, rgba(255,111,22,.36) 54%, transparent 88%);filter:blur(10px);opacity:.95;}
.join-btn__sparks{position:absolute;inset:0;overflow:hidden;z-index:3;pointer-events:none;}
.join-btn__sparks::before,.join-btn__sparks::after{content:'';position:absolute;left:-70px;top:50%;width:240px;height:84px;transform:translateY(-50%);background:
 radial-gradient(circle at 20% 45%, rgba(255,231,170,.95) 0 2.2px, transparent 2.8px),
 radial-gradient(circle at 28% 60%, rgba(255,180,92,.90) 0 2.4px, transparent 3px),
 radial-gradient(circle at 38% 38%, rgba(255,152,64,.92) 0 2px, transparent 2.8px),
 radial-gradient(circle at 50% 58%, rgba(255,122,28,.95) 0 2.2px, transparent 3px),
 radial-gradient(circle at 64% 34%, rgba(255,206,126,.88) 0 2px, transparent 2.8px),
 radial-gradient(circle at 78% 55%, rgba(255,144,30,.88) 0 2.1px, transparent 3px),
 radial-gradient(circle at 88% 42%, rgba(255,233,175,.90) 0 2.2px, transparent 2.9px);
opacity:.95;animation:sparksVisible 8.5s linear infinite !important;}
.join-btn__sparks::after{filter:blur(1.8px);opacity:.55;animation-delay:-4.25s !important;}
@keyframes dragonCruiseTrue{0%{left:-86px;}50%{left:122px;}100%{left:-86px;}}
@keyframes sparksVisible{0%{left:-46px;opacity:.18;}12%{opacity:1;}50%{left:150px;opacity:.95;}88%{opacity:.26;}100%{left:-46px;opacity:.18;}}


/* ===== v5k final fixes ===== */
.brand-mini img,
.hero-logo,
.hero-logo-small,
.footer-logo img{
  filter:none !important;
  clip-path:none !important;
  -webkit-mask-image:none !important;
  mask-image:none !important;
  image-rendering:auto;
}
.brand-mini{width:150px !important}
.brand-mini img{width:100%; height:auto; display:block}
.logo-stage{padding:8px 0 0 !important}
.logo-stage::before,.logo-rune{display:none !important}
.hero-logo{width:min(640px,90vw) !important; max-width:640px;}
.hero-logo-small{width:min(420px,74vw) !important; max-width:420px;}
.footer-logo{width:180px !important; border-radius:0 !important}
.footer-logo img{width:180px !important}
.footer-logo{overflow:visible !important}

.hero-buttons .lava-btn{
  background:
    linear-gradient(180deg, rgba(255,223,181,.28), rgba(255,173,70,.12) 20%, rgba(135,44,8,.12) 21%, transparent 22%),
    linear-gradient(135deg, #9b3908 0%, #662008 32%, #3c1205 62%, #882f08 100%) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,238,211,.36),
    inset 0 -12px 18px rgba(0,0,0,.26),
    inset 16px 0 20px rgba(255,124,16,.10),
    0 0 0 1px rgba(255,180,92,.28),
    0 10px 24px rgba(0,0,0,.18),
    0 0 30px rgba(255,92,0,.18) !important;
}
.hero-buttons .lava-btn:hover{
  filter:brightness(1.08) saturate(1.06);
  transform:translateY(-2px) scale(1.01);
}

.join-btn{
  min-width:320px !important;
  width:320px !important;
  padding:16px 24px 16px 112px !important;
  overflow:hidden;
  isolation:isolate;
}
.join-btn__text{font-size:26px !important; position:relative; z-index:3;}
.join-btn__dragon{
  position:absolute !important;
  left:-26px !important;
  top:50% !important;
  width:170px !important;
  height:86px !important;
  transform:translateY(-50%) translateX(0);
  background:url('../images/dragon-btn.png') no-repeat center / contain !important;
  opacity:.96 !important;
  z-index:2 !important;
  animation:dragonCruise 4.8s ease-in-out infinite !important;
  filter:drop-shadow(0 0 10px rgba(255,96,0,.28));
  will-change:transform;
}
.join-btn__dragon::after{display:none !important}
.join-btn__sparks{
  position:absolute !important; inset:0 !important; pointer-events:none; z-index:1 !important; overflow:hidden;
}
.join-btn__sparks::before,
.join-btn__sparks::after{
  content:""; position:absolute; left:36px; top:50%; width:180px; height:48px; transform:translateY(-50%);
  background:
    radial-gradient(circle at 8% 50%, rgba(255,236,179,.95) 0 2px, transparent 3px),
    radial-gradient(circle at 20% 36%, rgba(255,173,72,.92) 0 2px, transparent 3px),
    radial-gradient(circle at 30% 70%, rgba(255,120,18,.9) 0 2px, transparent 3px),
    radial-gradient(circle at 45% 40%, rgba(255,214,155,.9) 0 1.8px, transparent 3px),
    radial-gradient(circle at 62% 68%, rgba(255,94,0,.88) 0 2.2px, transparent 3px),
    radial-gradient(circle at 78% 32%, rgba(255,186,94,.9) 0 1.8px, transparent 3px),
    radial-gradient(circle at 95% 55%, rgba(255,246,221,.85) 0 1.6px, transparent 2.8px);
  opacity:.95;
  filter:blur(.2px) drop-shadow(0 0 6px rgba(255,118,18,.38));
  animation:sparksFollow 4.8s ease-in-out infinite !important;
}
.join-btn__sparks::after{animation-delay:-2.4s !important; opacity:.72; transform:translateY(-50%) translateY(8px) scale(.92);}
@keyframes dragonCruise{
  0%{transform:translateY(-50%) translateX(0px)}
  50%{transform:translateY(-50%) translateX(146px)}
  100%{transform:translateY(-50%) translateX(0px)}
}
@keyframes sparksFollow{
  0%{transform:translateY(-50%) translateX(0px); opacity:.25}
  15%{opacity:.95}
  50%{transform:translateY(-50%) translateX(138px); opacity:1}
  85%{opacity:.9}
  100%{transform:translateY(-50%) translateX(0px); opacity:.25}
}

/* more life on tables/cards */
.panel, .shop-card, .detail-card{
  box-shadow:
    inset 0 1px 0 rgba(255,231,194,.16),
    inset 0 -28px 40px rgba(0,0,0,.28),
    inset 22px 0 24px rgba(255,114,14,.07),
    inset -18px 0 24px rgba(0,0,0,.22),
    0 0 0 1px rgba(255,151,52,.18),
    0 0 34px rgba(255,90,0,.16) !important;
}
.data-table thead th{color:#ffe7be !important}
.data-table tbody td{box-shadow:inset 0 1px 0 rgba(255,194,128,.06), inset 0 -8px 16px rgba(0,0,0,.18)}

@media (max-width: 860px){
  .join-btn{width:100% !important; min-width:0 !important; padding-left:92px !important}
  .join-btn__dragon{width:138px !important; height:72px !important; left:-22px !important}
  .join-btn__text{font-size:22px !important}
  @keyframes dragonCruise{0%{transform:translateY(-50%) translateX(0)}50%{transform:translateY(-50%) translateX(110px)}100%{transform:translateY(-50%) translateX(0)}}
}


/* ===== V6 FIX7 CLEAN LOGO + HIGHER BG + NEW JOIN BUTTON ===== */

/* restore crisp logo rendering */
.brand-mini{
  width:188px !important;
  overflow:visible !important;
  border-radius:0 !important;
}
.brand-mini img{
  width:188px !important;
  display:block;
  filter:none !important;
  clip-path:none !important;
  -webkit-mask-image:none !important;
  mask-image:none !important;
}
.hero-logo{
  width:min(820px,95%) !important;
  clip-path:none !important;
  -webkit-mask-image:none !important;
  mask-image:none !important;
  filter:none !important;
}
.footer-logo img{
  filter:none !important;
  clip-path:none !important;
  -webkit-mask-image:none !important;
  mask-image:none !important;
}
.logo-animated,
.logo-animated img{
  filter:none !important;
}
.logo-animated::after{
  display:none !important;
}
.logo-rune{
  opacity:.22 !important;
  filter:blur(8px) !important;
}

/* move background higher */
body{
  background-image:
    linear-gradient(rgba(8,1,0,0.00), rgba(8,1,0,0.015)),
    url('../images/background-dragon.png');
  background-position:center -92px !important;
  background-size:cover;
  background-repeat:no-repeat;
  background-attachment:fixed;
  background-color:#120401;
}
body::before{
  background:
    radial-gradient(circle at 50% 18%, rgba(255,154,76,0.010), transparent 16%),
    radial-gradient(circle at 50% 52%, rgba(255,72,0,0.004), transparent 20%),
    linear-gradient(to bottom, rgba(0,0,0,0.00), rgba(0,0,0,0.010));
}
.ember-layer{opacity:.06;}

/* tighten spacing a touch */
.topbar{
  margin-top:2px !important;
  padding:7px 8px 7px !important;
}
.hero{
  padding:10px 0 2px !important;
}
.logo-stage{
  margin-bottom:2px !important;
}
.hero-buttons{
  margin-top:6px !important;
}
.hero-pills{
  margin-top:6px !important;
}
.main-grid{
  margin-top:6px !important;
}

/* entirely different join button effect */
.join-btn{
  position:relative;
  min-width:338px;
  padding:18px 30px 18px 118px;
  border-radius:22px;
  border:1px solid rgba(255,198,134,.46);
  overflow:hidden;
  isolation:isolate;
  background:
    linear-gradient(180deg, rgba(255,248,228,.26) 0%, rgba(255,232,192,.06) 14%, rgba(0,0,0,0) 15%),
    linear-gradient(135deg, rgba(182,78,28,1) 0%, rgba(124,42,15,1) 52%, rgba(67,22,8,1) 100%) !important;
  box-shadow:
    inset 0 2px 0 rgba(255,243,220,.34),
    inset 0 -3px 0 rgba(70,22,8,.82),
    inset 0 -14px 22px rgba(0,0,0,.18),
    0 0 0 1px rgba(255,206,142,.14),
    0 9px 0 rgba(79,25,9,.68),
    0 14px 22px rgba(0,0,0,.24);
  transition:transform .18s ease, box-shadow .18s ease, filter .18s ease;
  animation:none !important;
}
.join-btn:hover{
  transform:translateY(-2px) scale(1.01);
  box-shadow:
    inset 0 2px 0 rgba(255,243,220,.40),
    inset 0 -3px 0 rgba(70,22,8,.88),
    inset 0 -14px 22px rgba(0,0,0,.16),
    0 0 0 1px rgba(255,214,156,.20),
    0 11px 0 rgba(79,25,9,.72),
    0 18px 28px rgba(0,0,0,.28);
}
.join-btn:active{
  transform:translateY(3px);
  box-shadow:
    inset 0 2px 0 rgba(255,243,220,.28),
    inset 0 -2px 0 rgba(70,22,8,.78),
    inset 0 -10px 16px rgba(0,0,0,.14),
    0 7px 0 rgba(79,25,9,.62),
    0 10px 16px rgba(0,0,0,.18);
}
.join-btn::before{
  content:"";
  position:absolute;
  inset:4px;
  border-radius:18px;
  z-index:0;
  pointer-events:none;
  background:
    linear-gradient(180deg, rgba(255,255,255,.10), transparent 26%),
    radial-gradient(circle at 78% 50%, rgba(255,186,92,.14), transparent 22%);
}
.join-btn::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:0;
  pointer-events:none;
  background:
    linear-gradient(125deg, transparent 0 36%, rgba(255,219,164,.20) 48%, transparent 60%);
  transform:translateX(-62%);
  animation:bladeSweep 3.4s ease-in-out infinite;
}
.join-btn__dragon{
  position:absolute;
  left:16px;
  top:50%;
  width:92px;
  height:92px;
  transform:translateY(-50%);
  z-index:2;
  pointer-events:none;
  opacity:1 !important;
  background:url('../images/dragon-btn.png') center center / contain no-repeat;
  filter:brightness(1.55) saturate(1.35) contrast(1.18) drop-shadow(0 0 8px rgba(255,138,36,.34));
  mix-blend-mode:screen;
}
.join-btn__sparks{
  position:absolute;
  inset:0;
  z-index:1;
  pointer-events:none;
  background:none !important;
}
.join-btn__sparks::before{
  content:"";
  position:absolute;
  left:108px;
  right:20px;
  top:50%;
  height:1px;
  transform:translateY(-50%);
  background:linear-gradient(90deg, rgba(255,120,18,0), rgba(255,214,162,.85), rgba(255,120,18,0));
  box-shadow:
    0 -7px 18px rgba(255,170,78,.18),
    0 7px 18px rgba(255,102,18,.16);
  opacity:.95;
}
.join-btn__sparks::after{
  content:"";
  position:absolute;
  left:118px;
  right:34px;
  top:50%;
  height:28px;
  transform:translateY(-50%);
  border-radius:999px;
  background:radial-gradient(ellipse at center, rgba(255,196,116,.18) 0%, rgba(255,126,22,.10) 42%, rgba(255,126,22,0) 72%);
  filter:blur(8px);
  opacity:.78;
}
.join-btn__text{
  position:relative;
  z-index:3;
  display:block;
  font-size:19px;
  letter-spacing:1px;
  text-transform:uppercase;
  text-shadow:0 1px 0 rgba(86,24,8,.82), 0 0 6px rgba(255,218,170,.08);
}
@keyframes bladeSweep{
  0%,100%{transform:translateX(-62%) skewX(-20deg); opacity:.12;}
  45%{transform:translateX(10%) skewX(-20deg); opacity:.48;}
  55%{transform:translateX(16%) skewX(-20deg); opacity:.24;}
}

@media (min-width:1400px){
  body{background-position:center -104px !important;}
}
@media (min-width:1100px) and (max-width:1399px){
  body{background-position:center -88px !important;}
}
@media (min-width:768px) and (max-width:1099px){
  body{background-position:center -24px !important;}
}
@media (max-width:767px){
  body{background-position:center top !important;}
  .join-btn{
    min-width:290px;
    padding-left:96px;
  }
  .join-btn__dragon{
    width:74px;
    height:74px;
  }
}
/* ===== /V6 FIX7 CLEAN LOGO + HIGHER BG + NEW JOIN BUTTON ===== */



/* ===== V6 FIX8 REGISTER + STRONGER JOIN DRAGON ===== */
.join-btn__dragon{
  opacity:1 !important;
  width:104px !important;
  height:104px !important;
  left:12px !important;
  background:url('../images/dragon-btn.png') center center / contain no-repeat !important;
  filter:brightness(1.9) saturate(1.55) contrast(1.28) drop-shadow(0 0 14px rgba(255,145,42,.46)) !important;
  mix-blend-mode:screen !important;
}
.join-btn__dragon::after{
  content:"";
  position:absolute;
  left:34px;
  top:40px;
  width:48px;
  height:18px;
  border-radius:999px;
  background:linear-gradient(90deg, rgba(255,190,110,0.00), rgba(255,148,32,.78), rgba(255,78,0,0.00));
  filter:blur(5px);
  opacity:1;
}
@media (max-width:767px){
  .join-btn__dragon{
    width:82px !important;
    height:82px !important;
    left:10px !important;
  }
}
/* ===== /V6 FIX8 REGISTER + STRONGER JOIN DRAGON ===== */
/* ===== THOM2 ACCOUNT PATCH ONLY ===== */

.dashboard-top{
  display:flex;
  flex-wrap:wrap;
  gap:16px;
  margin-bottom:22px;
}

.dashboard-top .detail-card{
  flex:1 1 260px;
  min-height:110px;
  padding:18px;
  border-radius:18px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  gap:8px;
  overflow:visible;
}

.dashboard-top .detail-card span{
  font-size:15px;
  color:#dfb87c;
  text-transform:uppercase;
  letter-spacing:.8px;
}

.dashboard-top .detail-card strong{
  display:block;
  font-size:24px;
  line-height:1.2;
  font-weight:700;
  white-space:nowrap;
  overflow:visible;
}

.cash-value{
  display:block;
  font-size:32px !important;
  line-height:1.15 !important;
  white-space:nowrap;
  overflow:visible;
  color:#ffd694;
  text-shadow:0 0 12px rgba(255,170,60,.25);
}
/* ===== THOM2 PLAYER PREMIUM PATCH ===== */
.detail-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(220px, 1fr));
  gap:18px;
}

.detail-card{
  position:relative;
  padding:20px;
  border-radius:20px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  gap:6px;
  overflow:hidden;
  background:
    linear-gradient(180deg, rgba(255,210,150,.06), transparent 20%),
    linear-gradient(135deg, rgba(40,10,5,.95), rgba(12,4,2,.98)) !important;
  border:1px solid rgba(255,140,42,.18);
  box-shadow:
    inset 0 1px 0 rgba(255,220,170,.12),
    inset 0 -18px 28px rgba(0,0,0,.25),
    0 0 0 1px rgba(255,120,30,.06),
    0 0 22px rgba(255,90,0,.12) !important;
  transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}

.detail-card::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    linear-gradient(120deg, transparent 0 18%, rgba(255,211,159,.06) 28%, transparent 40%),
    radial-gradient(circle at 88% 18%, rgba(255,96,0,.10), transparent 18%);
  opacity:.9;
}

.detail-card:hover{
  transform:translateY(-4px) scale(1.02);
  border-color:rgba(255,170,72,.28);
  box-shadow:
    inset 0 1px 0 rgba(255,230,180,.16),
    inset 0 -22px 32px rgba(0,0,0,.28),
    0 0 0 1px rgba(255,160,60,.12),
    0 0 36px rgba(255,90,0,.20) !important;
}

.detail-card span{
  font-size:13px !important;
  letter-spacing:1px;
  opacity:.82;
  color:#dfb87c;
  text-transform:uppercase;
}

.detail-card strong{
  position:relative;
  z-index:1;
  font-size:26px !important;
  line-height:1.2;
  text-shadow:0 0 12px rgba(255,140,40,.18);
}

@media (max-width: 860px){
  .detail-grid{
    grid-template-columns:1fr;
  }

  .detail-card strong{
    font-size:23px !important;
  }
}
/* ===== /THOM2 PLAYER PREMIUM PATCH ===== */
/* ===== THOM2 ITEMSHOP PRO PATCH ===== */

.shop-shell-pro{
  position:relative;
}

.shop-tabs{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  margin:0 0 24px;
  position:relative;
  z-index:2;
}

.shop-tab{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:12px 18px;
  border-radius:999px;
  border:1px solid rgba(255,154,66,.18);
  background:
    linear-gradient(180deg, rgba(255,220,176,.08), rgba(255,220,176,.02) 18%, transparent 20%),
    linear-gradient(135deg, rgba(68,20,8,.92), rgba(22,7,3,.96));
  color:#ffe5bc;
  font-size:15px;
  font-weight:700;
  letter-spacing:.4px;
  box-shadow:inset 0 1px 0 rgba(255,236,206,.08), 0 0 16px rgba(255,98,0,.06);
  transition:transform .22s ease, box-shadow .22s ease, border-color .22s ease, color .22s ease;
}

.shop-tab:hover{
  transform:translateY(-2px);
  border-color:rgba(255,182,96,.32);
  box-shadow:inset 0 1px 0 rgba(255,236,206,.12), 0 0 24px rgba(255,98,0,.12);
  color:#fff2d6;
}

.shop-tab.is-active{
  border-color:rgba(255,198,116,.42);
  color:#fff6e3;
  box-shadow:inset 0 1px 0 rgba(255,242,216,.16), 0 0 28px rgba(255,98,0,.18);
}

.shop-grid-pro{
  align-items:stretch;
}

.shop-card-pro{
  display:flex;
  flex-direction:column;
  position:relative;
  min-height:520px !important;
  overflow:visible;
}

.shop-card-pro.is-featured{
  border-color:rgba(255,190,100,.28) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,234,198,.14),
    inset 0 -30px 34px rgba(0,0,0,.20),
    inset 18px 0 24px rgba(255,146,42,.06),
    inset -18px 0 24px rgba(0,0,0,.18),
    0 0 0 1px rgba(255,190,100,.12),
    0 0 40px rgba(255,116,0,.18) !important;
}

.shop-featured-ribbon{
  position:absolute;
  top:-12px;
  left:18px;
  z-index:4;
  padding:8px 12px;
  border-radius:999px;
  font-size:12px;
  font-weight:700;
  letter-spacing:1px;
  text-transform:uppercase;
  color:#2d0f02;
  background:linear-gradient(180deg, #ffd89a, #ffb347);
  box-shadow:0 0 18px rgba(255,184,72,.32);
}

.shop-visual-pro{
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
}

.shop-icon-wrap{
  position:absolute;
  inset:18px;
  display:flex;
  align-items:center;
  justify-content:center;
  z-index:2;
}

.shop-item-icon{
  width:84px;
  height:84px;
  object-fit:contain;
  image-rendering:auto;
  filter:drop-shadow(0 0 18px rgba(255,188,96,.18));
  transition:transform .25s ease, filter .25s ease;
}

.shop-card-pro:hover .shop-item-icon{
  transform:scale(1.08);
  filter:drop-shadow(0 0 24px rgba(255,188,96,.24));
}

.shop-content{
  position:relative;
  z-index:2;
  display:flex;
  flex-direction:column;
  flex:1 1 auto;
}

.shop-hover-preview{
  margin-top:6px;
  padding:14px;
  border-radius:18px;
  background:
    linear-gradient(180deg, rgba(255,224,180,.08), transparent 22%),
    linear-gradient(135deg, rgba(36,10,5,.92), rgba(10,3,2,.98));
  border:1px solid rgba(255,150,52,.14);
  box-shadow:inset 0 1px 0 rgba(255,226,185,.08), 0 0 18px rgba(255,88,0,.06);
  opacity:.94;
}

.shop-hover-preview__title{
  margin-bottom:10px;
  color:#ffe3b6;
  font-size:14px;
  font-weight:700;
  letter-spacing:.8px;
  text-transform:uppercase;
}

.shop-hover-preview__row{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:12px;
  padding:6px 0;
  border-bottom:1px solid rgba(255,146,42,.08);
}

.shop-hover-preview__row:last-child{
  border-bottom:none;
}

.shop-hover-preview__row span{
  color:#d8ad71;
  font-size:13px;
  text-transform:uppercase;
  letter-spacing:.7px;
}

.shop-hover-preview__row strong{
  color:#fff1d1;
  font-size:15px;
  font-weight:700;
  text-align:right;
}

.shop-card-pro .shop-extra{
  margin-bottom:16px;
}

.shop-card-pro form{
  margin-top:auto;
}

@media (max-width:860px){
  .shop-tabs{
    gap:10px;
  }

  .shop-tab{
    width:100%;
  }

  .shop-card-pro{
    min-height:unset !important;
  }

  .shop-item-icon{
    width:74px;
    height:74px;
  }

  .shop-hover-preview__row{
    flex-direction:column;
    align-items:flex-start;
  }

  .shop-hover-preview__row strong{
    text-align:left;
  }
}

/* ===== /THOM2 ITEMSHOP PRO PATCH ===== */