:root{
  --bg0:#070612;
  --panel:rgba(17,15,40,.72);
  --panel-soft:rgba(255,255,255,.04);
  --stroke:rgba(255,255,255,.10);

  --text:rgba(255,255,255,.92);
  --muted:rgba(255,255,255,.72);
  --muted2:rgba(255,255,255,.56);

  --gold:#f7d36a;
  --gold2:#ffea9a;
  --violet:#b287ff;
  --blue:#72b8ff;
  --brand-lily-green:#89ff72;
  --brand-lily-green-deep:#1ed760;
  --brand-lily-gold:#ffd86d;
  --brand-lily-gold-deep:#f1b53a;

  --radius:18px;
  --shadow:0 18px 50px rgba(0,0,0,.42);
  --shadow-soft:0 20px 60px rgba(0,0,0,.30);
  --topbar-h:138px;
  --logo-fit-scale:1.08;
  --logo-fit-shift-x:0%;
  --logo-fit-shift-y:0%;
}

*{box-sizing:border-box}
html,body{height:100%}
html{
  scroll-behavior:smooth;
  scroll-padding-top:calc(var(--topbar-h) + 28px);
}
section[id],
main[id]{
  scroll-margin-top:calc(var(--topbar-h) + 28px);
}

body{
  margin:0;
  font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
  background:var(--bg0);
  color:var(--text);
  overflow-x:hidden;
}

a{color:inherit;text-decoration:none}
button,input{font:inherit}

.wordmark-main,
.wordmark-short{
  display:inline-block;
  font:inherit;
  letter-spacing:inherit;
  line-height:inherit;
}

.wordmark-main{
  color:transparent;
  background:linear-gradient(180deg, #dcffb1 0%, var(--brand-lily-green) 46%, var(--brand-lily-green-deep) 100%);
  -webkit-background-clip:text;
  background-clip:text;
  -webkit-text-fill-color:transparent;
  text-shadow:
    0 0 10px rgba(137,255,114,.34),
    0 0 26px rgba(30,215,96,.28);
}

.wordmark-short{
  color:transparent;
  background:linear-gradient(180deg, #fff5b3 0%, var(--brand-lily-gold) 48%, var(--brand-lily-gold-deep) 100%);
  -webkit-background-clip:text;
  background-clip:text;
  -webkit-text-fill-color:transparent;
  text-shadow:
    0 0 10px rgba(255,216,109,.30),
    0 0 24px rgba(241,181,58,.24);
}

.container{
  width:min(1180px,92vw);
  margin:0 auto;
}

main{padding-top:var(--topbar-h)}

/* background */
.bg{
  position:fixed;
  inset:0;
  z-index:-1;
  pointer-events:none;
  overflow:hidden;
  contain:paint;
  background:
    radial-gradient(760px 420px at 12% 10%, rgba(137,255,114,.12), transparent 70%),
    radial-gradient(640px 360px at 86% 12%, rgba(255,216,109,.08), transparent 72%),
    radial-gradient(860px 420px at 50% 100%, rgba(30,215,96,.08), transparent 68%),
    linear-gradient(180deg, #08120d 0%, #090c13 38%, #07070e 100%);
}
.bg__aurora,
.bg__goblin-crowd,
.bg__goblin-eyes,
.bg__logo-art,
.bg__mascot-art,
.bg__smoke{
  position:absolute;
  pointer-events:none;
}
.bg__aurora{
  inset:-8% -10% auto -10%;
  height:58vh;
  background:
    radial-gradient(36% 44% at 18% 26%, rgba(137,255,114,.16), transparent 72%),
    radial-gradient(26% 38% at 48% 20%, rgba(255,216,109,.10), transparent 70%),
    radial-gradient(32% 46% at 82% 24%, rgba(62,154,88,.14), transparent 72%);
  opacity:.56;
  filter:blur(18px);
}
.bg__goblin-crowd{
  left:-8vw;
  right:-8vw;
  bottom:-2vh;
  height:min(48vh, 420px);
  background:
    linear-gradient(180deg, rgba(7,7,14,0) 0%, rgba(7,7,14,.18) 22%, rgba(7,7,14,.84) 100%),
    url("./assets/images/dobby-rope-cutout.png") 18% 100% / min(22vw, 250px) auto no-repeat,
    url("./assets/images/dobby-rope-cutout.png") 78% 100% / min(24vw, 280px) auto no-repeat;
  opacity:.18;
}
.bg__goblin-eyes{
  display:none;
}
.bg__logo-art{
  left:max(2vw, 24px);
  top:42vh;
  width:min(22vw, 270px);
  aspect-ratio:729 / 630;
  background:url("./assets/images/logo.png") center/contain no-repeat;
  opacity:.12;
  filter:drop-shadow(0 0 14px rgba(137,255,114,.10));
}
.bg__mascot-art{
  right:max(-8vw, -120px);
  bottom:max(-1vh, -16px);
  width:min(72vw, 920px);
  aspect-ratio:1065 / 444;
  background:url("./assets/images/dobby-rope-cropped.png") center/contain no-repeat;
  opacity:.2;
  filter:drop-shadow(0 18px 24px rgba(0,0,0,.28));
}
.bg__smoke{
  top:8%;
  left:16%;
  width:54vw;
  height:58vh;
  min-width:420px;
  min-height:480px;
  background:
    radial-gradient(42% 34% at 18% 26%, rgba(137,255,114,.16), transparent 70%),
    radial-gradient(34% 28% at 58% 28%, rgba(255,216,109,.10), transparent 72%),
    radial-gradient(30% 26% at 46% 62%, rgba(30,215,96,.12), transparent 74%);
  filter:blur(42px);
  opacity:.34;
  transform:none;
}
.bg::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(900px 460px at 50% -8%, rgba(255,255,255,.05), transparent 62%),
    linear-gradient(180deg, rgba(255,255,255,.02), rgba(255,255,255,0) 30%);
}
.bg::after{
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(180deg, rgba(3,8,5,.14), rgba(6,10,14,.52) 52%, rgba(7,7,14,.82)),
    linear-gradient(90deg, rgba(0,0,0,.10), rgba(0,0,0,0) 28%, rgba(0,0,0,.18) 100%);
}
.rope-mascot{
  position:fixed;
  top:calc(var(--topbar-h) + 12px);
  left:18px;
  bottom:18px;
  width:164px;
  z-index:41;
  pointer-events:none;
}
.rope-mascot__line{
  position:absolute;
  top:0;
  bottom:0;
  left:116px;
  width:4px;
  border-radius:999px;
  background:
    linear-gradient(180deg, rgba(248,226,167,.74), rgba(120,86,42,.46));
  box-shadow:
    0 0 0 1px rgba(60,32,12,.22),
    0 0 18px rgba(247,211,106,.08);
  opacity:.9;
}
.rope-mascot__line::before{
  content:"";
  position:absolute;
  top:0;
  bottom:0;
  left:-3px;
  width:10px;
  background:repeating-linear-gradient(
    180deg,
    rgba(94,60,26,.42) 0px,
    rgba(94,60,26,.42) 7px,
    rgba(248,226,167,.18) 7px,
    rgba(248,226,167,.18) 14px
  );
  opacity:.55;
  filter:blur(.3px);
}
.rope-mascot__shadow{
  position:absolute;
  left:18px;
  top:0;
  width:108px;
  height:26px;
  border-radius:50%;
  background:radial-gradient(circle, rgba(0,0,0,.36), transparent 72%);
  filter:blur(8px);
  opacity:.42;
  transform:translateY(20px) scale(1);
}
.rope-mascot__dobby{
  position:absolute;
  top:0;
  left:0;
  width:128px;
  height:134px;
  display:grid;
  place-items:center;
  transform:translate3d(0,0,0) rotate(0deg);
  transform-origin:118px 12px;
  transition:transform .14s linear;
}
.rope-mascot__dobby::before{
  content:none;
}
.rope-mascot__grip{
  position:absolute;
  top:39px;
  left:110px;
  width:18px;
  height:18px;
  border-radius:999px;
  border:2px solid rgba(255,228,173,.46);
  background:rgba(22,18,40,.12);
  box-shadow:0 3px 8px rgba(0,0,0,.14);
}
.rope-mascot__img{
  width:128px;
  height:134px;
  object-fit:contain;
  display:block;
  filter:
    drop-shadow(0 14px 18px rgba(0,0,0,.28))
    drop-shadow(0 4px 4px rgba(255,255,255,.04));
}

.media-rail{
  position:relative;
  width:100%;
  margin:0 0 24px;
  pointer-events:none;
}
.section--backed-by{
  padding-top:12px;
  padding-bottom:6px;
}
.backed-by{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:12px;
}
.backed-by__label{
  color:#ffeaa0;
  font-size:20px;
  font-weight:900;
  letter-spacing:.16em;
  text-transform:uppercase;
  text-align:center;
  background:
    linear-gradient(
      90deg,
      #fff8c7 0%,
      var(--brand-lily-gold) 24%,
      var(--brand-lily-green) 50%,
      var(--brand-lily-gold) 76%,
      #fff8c7 100%
    );
  background-size:220% 100%;
  -webkit-background-clip:text;
  background-clip:text;
  -webkit-text-fill-color:transparent;
  animation:backedByGlow 8.8s ease-in-out infinite;
  will-change:background-position, text-shadow;
}
.backed-by .media-rail{
  margin:0;
}
@keyframes backedByGlow{
  0%{
    background-position:0% 50%;
    text-shadow:
      0 0 10px rgba(247,211,106,.34),
      0 0 22px rgba(247,211,106,.18);
  }
  50%{
    background-position:100% 50%;
    text-shadow:
      0 0 10px rgba(137,255,114,.44),
      0 0 24px rgba(30,215,96,.22);
  }
  100%{
    background-position:0% 50%;
    text-shadow:
      0 0 10px rgba(247,211,106,.34),
      0 0 22px rgba(247,211,106,.18);
  }
}
.media-rail__inner{
  position:relative;
  width:100%;
  overflow:hidden;
  padding:14px;
  border-radius:28px;
  border:1px solid rgba(255,255,255,.08);
  background:
    linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.015)),
    rgba(12,10,28,.44);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.05),
    0 16px 40px rgba(0,0,0,.20);
}
.media-rail__inner::before,
.media-rail__inner::after{
  content:"";
  position:absolute;
  top:0;
  bottom:0;
  width:72px;
  z-index:2;
  pointer-events:none;
}
.media-rail__inner::before{
  left:0;
  background:linear-gradient(90deg, rgba(12,10,28,.98), transparent);
}
.media-rail__inner::after{
  right:0;
  background:linear-gradient(270deg, rgba(12,10,28,.98), transparent);
}
.media-rail__track{
  display:flex;
  align-items:center;
  width:max-content;
  gap:16px;
  animation:mediaRailScrollX 28s linear infinite;
  will-change:transform;
}
.media-rail__group{
  display:flex;
  align-items:center;
  gap:16px;
  flex-shrink:0;
}
.media-pill{
  display:flex;
  align-items:center;
  justify-content:center;
  min-width:188px;
  min-height:56px;
  padding:0 24px;
  border-radius:18px;
  border:1px solid rgba(255,255,255,.08);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.05),
    0 12px 22px rgba(0,0,0,.16);
  color:#f5f7fb;
  font-size:16px;
  font-weight:900;
  letter-spacing:.03em;
  white-space:nowrap;
}
.media-pill--kucoin{
  background:linear-gradient(180deg, rgba(45,213,190,.12), rgba(45,213,190,.04)), rgba(38,40,74,.94);
  color:#27d5bc;
}
.media-pill--coingecko{
  background:linear-gradient(180deg, rgba(255,214,96,.18), rgba(248,183,61,.08)), #ffc24b;
  color:#5a4823;
}
.media-pill--jupiter{
  background:linear-gradient(180deg, rgba(255,255,255,.02), rgba(255,255,255,.01)), #0d131b;
  color:#eef4fb;
}
.media-pill--meteora{
  background:linear-gradient(180deg, rgba(203,120,255,.08), rgba(255,125,84,.04)), #17121d;
  color:#f2e8ff;
}
.media-pill--coinmarketcap{
  min-width:220px;
  background:#f7f8fb;
  color:#14171d;
  font-size:15px;
  letter-spacing:.01em;
}
.media-pill--raydium{
  background:linear-gradient(135deg, rgba(68,127,255,.16), rgba(154,80,255,.12)), #4d558e;
  color:#eef2ff;
  letter-spacing:.12em;
}
@keyframes mediaRailScrollX{
  from{transform:translateX(0)}
  to{transform:translateX(calc(-50% - 8px))}
}
.spellbook,
.spellbook::after,
.token-card,
.token-card::after,
.claim-card,
.claim-card::after,
#tokenomics .card,
#tokenomics .card::after,
.roadmap-table,
.roadmap-table::after,
.faq-table,
.faq-table::after,
.parchment,
.parchment::after{
  backface-visibility:hidden;
  transform:translateZ(0);
  will-change:transform, opacity;
}
.parchment__title,
.claim-card__value,
.claim-stat__value,
.mini__value,
.card__title,
.badge,
.token-name,
.value,
.meter__value,
.pill-gold,
#tokenomics .card__title,
#tokenomics .chip,
#tokenomics .list b,
#tokenomics .bullets li,
.roadmap-phase__kicker,
.roadmap-date,
.roadmap-tag,
.faq-badge{
  will-change:transform, opacity;
}
@keyframes bgDobbyFloat{
  0%{
    transform:translate3d(0,0,0) scale(1);
  }
  100%{
    transform:translate3d(1.2%, -1.4%, 0) scale(1.03);
  }
}
@keyframes bgLogoFloat{
  0%{
    transform:translate3d(0,0,0) rotate(-4deg) scale(1);
    opacity:.12;
  }
  100%{
    transform:translate3d(2.4%, -2.2%, 0) rotate(3deg) scale(1.04);
    opacity:.18;
  }
}
@keyframes bgSmokeReveal{
  0%{
    opacity:1;
    transform:scale(1.04) translate3d(0,0,0);
    filter:blur(82px);
  }
  30%{
    opacity:.98;
    transform:scale(1.08) translate3d(1.5%, -1%, 0);
    filter:blur(74px);
  }
  58%{
    opacity:.92;
    transform:scale(1.14) translate3d(4%, -3%, 0);
    filter:blur(58px);
  }
  78%{
    opacity:.46;
    transform:scale(1.19) translate3d(6%, -4%, 0);
    filter:blur(40px);
  }
  100%{
    opacity:0;
    transform:scale(1.24) translate3d(8%, -5%, 0);
    filter:blur(28px);
  }
}
@keyframes bgAuroraDrift{
  0%{
    transform:translate3d(-2%, -1%, 0) scale(1);
  }
  100%{
    transform:translate3d(3%, 2%, 0) scale(1.08);
  }
}
@keyframes bgGoblinCrowd{
  0%{
    transform:translate3d(-1.5%, 0, 0) scale(1);
  }
  100%{
    transform:translate3d(1.5%, 1.2%, 0) scale(1.04);
  }
}
@keyframes bgEyesBlink{
  0%, 18%, 22%, 48%, 52%, 100%{
    opacity:.42;
  }
  20%, 50%{
    opacity:.08;
  }
}
@keyframes bgAmbientPulse{
  0%{
    opacity:1;
  }
  100%{
    opacity:.9;
  }
}

/* topbar */
.topbar{
  position:fixed;
  top:0; left:0; right:0;
  height:var(--topbar-h);
  display:flex;
  align-items:center;
  z-index:999;
  background:
    linear-gradient(180deg, rgba(12,10,28,.90), rgba(12,10,28,.68)),
    rgba(10,8,24,.74);
  border-bottom:1px solid rgba(255,255,255,.10);
  box-shadow:0 10px 30px rgba(0,0,0,.18);
  backdrop-filter:blur(16px);
}
.topbar__inner{
  width:100%;
  display:grid;
  grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);
  height:100%;
  align-items:center;
  gap:24px;
}

/* brand */
.brand{
  grid-column:1;
  justify-self:start;
  position:relative;
  display:flex;
  align-items:center;
  gap:16px;
  min-width:0;
  padding:0 0 0 40px;
}
.brand__logo-frame{
  width:74px;
  height:74px;
  display:grid;
  place-items:center;
  flex-shrink:0;
}
.brand__logo{
  width:100%;
  height:100%;
  border-radius:50%;
  object-fit:contain;
  display:block;
  transform:translate(var(--logo-fit-shift-x), var(--logo-fit-shift-y)) scale(var(--logo-fit-scale));
  transform-origin:center;
}
.brand__text{
  position:relative;
  display:flex;
  flex-direction:column;
  gap:7px;
  line-height:1.05;
  min-width:0;
  align-items:flex-start;
}
.brand__row{
  display:flex;
  align-items:flex-end;
  gap:14px;
  flex-wrap:wrap;
}
.brand__title-wrap{
  position:relative;
  display:inline-flex;
  justify-content:flex-start;
  width:max-content;
  padding-top:58px;
}
.brand__title{
  position:relative;
  z-index:1;
  font-weight:950;
  font-size:27px;
  letter-spacing:.12em;
  color:transparent;
  background:linear-gradient(180deg, #fff4bb 0%, #f7d36a 45%, #f3b449 100%);
  -webkit-background-clip:text;
  background-clip:text;
  text-shadow:
    0 0 18px rgba(247,211,106,.14),
    0 3px 18px rgba(0,0,0,.20);
}
.brand__mascot{
  position:absolute;
  left:50%;
  top:-8px;
  width:168px;
  max-width:none;
  height:auto;
  display:block;
  pointer-events:none;
  user-select:none;
  transform:translateX(-50%);
  transform-origin:center;
  z-index:2;
  filter:
    drop-shadow(0 12px 18px rgba(0,0,0,.34))
    drop-shadow(0 3px 10px rgba(137,255,114,.12));
}
.brand__slogan{
  display:inline-flex;
  align-items:center;
  gap:8px;
  width:max-content;
  max-width:100%;
  padding:6px 14px;
  border-radius:999px;
  border:1px solid rgba(247,211,106,.20);
  background:rgba(247,211,106,.08);
  font-size:13px;
  font-style:italic;
  font-weight:700;
  color:#ffe588;
  white-space:nowrap;
  margin-left:10px;
  margin-bottom:3px;
  text-shadow:
    0 0 6px rgba(247,211,106,.45),
    0 0 14px rgba(247,211,106,.35),
    0 0 22px rgba(178,135,255,.25);
}
.brand__slogan-logo{
  width:16px;
  height:16px;
  object-fit:contain;
  display:block;
  flex-shrink:0;
  border-radius:50%;
}

/* nav */
.nav{
  grid-column:2;
  justify-self:center;
  display:flex;
  align-items:center;
  justify-content:center;
}
.nav__links{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:20px;
}
.nav__links a{
  font-size:15px;
  color:var(--muted);
  padding:10px 14px;
  border-radius:14px;
  transition:.18s ease;
}
.nav__links a:hover{
  background:rgba(255,255,255,.06);
  color:#fff;
}
.nav__links .nav__buy{
  position:relative;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:96px;
  padding:13px 22px;
  border:1px solid rgba(137,255,114,.58);
  border-radius:999px;
  overflow:hidden;
  isolation:isolate;
  background:
    linear-gradient(135deg, rgba(223,255,176,.98), rgba(137,255,114,.96) 48%, rgba(30,215,96,.88));
  color:#0f1b12;
  font-weight:900;
  letter-spacing:.02em;
  transform:translateZ(0);
  will-change:transform, box-shadow;
  transition:
    transform .16s ease,
    box-shadow .16s ease,
    border-color .16s ease,
    color .16s ease;
  box-shadow:
    0 10px 24px rgba(30,215,96,.30),
    0 0 20px rgba(137,255,114,.24),
    inset 0 1px 0 rgba(255,255,255,.28);
}
.nav__links .nav__buy::before{
  content:"";
  position:absolute;
  inset:0;
  border-radius:inherit;
  background:linear-gradient(135deg, rgba(32,46,37,.98), rgba(23,33,27,.96) 48%, rgba(14,22,17,.94));
  opacity:0;
  transition:opacity .16s ease;
  z-index:0;
}
.nav__links .nav__buy-label{
  position:relative;
  z-index:1;
}
.nav__links .nav__buy:hover{
  color:#f3fff2;
  border-color:rgba(137,255,114,.32);
  transform:translateY(-1px) translateZ(0);
  box-shadow:
    0 14px 30px rgba(0,0,0,.28),
    0 0 18px rgba(137,255,114,.10),
    inset 0 1px 0 rgba(255,255,255,.06);
}
.nav__links .nav__buy:hover::before{
  opacity:1;
}
.pill{
  border:1px solid rgba(247,211,106,.35);
  background:rgba(247,211,106,.10);
  border-radius:999px;
}

.topbar__actions{
  grid-column:3;
  justify-self:end;
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:12px;
  min-width:0;
  padding-right:12px;
}
.topbar__wallet{
  position:relative;
  display:flex;
  align-items:center;
  min-width:0;
}
.topbar__actions .btn{
  transition:none;
}
.topbar__actions .btn[disabled]{
  cursor:default;
  opacity:1;
}
.topbar__actions .btn:hover{
  background:rgba(255,255,255,.05);
  border-color:rgba(255,255,255,.12);
}
.topbar__actions .btn[disabled]:hover{
  background:rgba(255,255,255,.05);
  border-color:rgba(255,255,255,.12);
}
.wallet-badge{
  display:inline-flex;
  align-items:center;
  gap:10px;
  min-height:46px;
  padding:0 16px 0 14px;
  border-radius:16px;
  border:1px solid rgba(164,178,208,.18);
  background:
    linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.015)),
    rgba(14,18,32,.84);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.06),
    0 14px 32px rgba(0,0,0,.24);
  color:#dbe5f6;
  font-size:12px;
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
  white-space:nowrap;
  flex-shrink:0;
}
.wallet-badge::before{
  content:"";
  width:8px;
  height:8px;
  border-radius:999px;
  background:#8a94ab;
  box-shadow:0 0 0 4px rgba(138,148,171,.15);
  flex-shrink:0;
}
.wallet-badge[data-state="idle"]{
  border-color:rgba(155,170,200,.18);
  color:#dbe5f6;
}
.wallet-badge[data-state="idle"]::before{
  background:#89a0c2;
  box-shadow:0 0 0 4px rgba(137,160,194,.15);
}
.wallet-badge[data-state="unavailable"]{
  border-color:rgba(255,216,109,.26);
  background:
    linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.015)),
    rgba(38,28,9,.82);
  color:#fff0bd;
}
.wallet-badge[data-state="unavailable"]::before{
  background:var(--brand-lily-gold);
  box-shadow:0 0 0 4px rgba(255,216,109,.16);
}
.wallet-badge[data-state="connected"]{
  border-color:rgba(137,255,114,.28);
  background:
    linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.015)),
    rgba(8,32,19,.80);
  color:#f1ffef;
  font-size:13px;
  letter-spacing:.04em;
  text-transform:none;
}
.wallet-badge[data-state="connected"]::before{
  background:var(--brand-lily-green);
  box-shadow:0 0 0 4px rgba(137,255,114,.18);
}
.wallet-message{
  margin-top:8px;
  color:var(--muted);
}
#btnMenu{display:none}

/* buttons */
.btn{
  padding:10px 14px;
  border-radius:12px;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.05);
  color:#fff;
  cursor:pointer;
  font-weight:800;
  transition:.18s ease;
  box-shadow:0 10px 30px rgba(0,0,0,.25);
}
.btn:hover{
  background:rgba(255,255,255,.10);
  border-color:rgba(255,255,255,.18);
}
.btn-primary{
  border:none;
  color:#fff;
  background:linear-gradient(135deg,var(--gold),var(--violet));
}
.btn-primary:hover{
  color:#fff;
  background:rgba(255,255,255,.14);
  border-color:rgba(255,255,255,.20);
}
.btn-secondary{
  border:none;
  color:#fff;
  background:linear-gradient(135deg,var(--blue),var(--violet));
}
.btn-secondary:hover{
  color:#fff;
}
.btn-whitepaper{
  border:none;
  color:#fff;
  background:linear-gradient(135deg,#ffb86b,#b287ff 55%, #72b8ff);
  box-shadow:
    0 10px 30px rgba(0,0,0,.25),
    0 0 0 1px rgba(255,255,255,.08) inset;
}
.btn-whitepaper:hover{
  color:#fff;
  background:rgba(255,255,255,.14);
  border-color:rgba(255,255,255,.20);
}
.btn-ghost{
  background:rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.12);
  color:#fff;
  padding:8px 14px;
  border-radius:12px;
  font-weight:800;
  cursor:pointer;
  transition:.18s ease;
}
.btn-ghost:hover{
  background:rgba(255,255,255,.10);
  border-color:rgba(255,255,255,.18);
}
.btn-wallet{
  min-height:46px;
  padding:0 20px;
  border-radius:16px;
  border:1px solid rgba(255,255,255,.12);
  background:
    linear-gradient(180deg, rgba(255,255,255,.07), rgba(255,255,255,.02)),
    rgba(18,16,42,.88);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.08),
    0 14px 32px rgba(0,0,0,.26);
  white-space:nowrap;
}
.btn-wallet{
  display:inline-flex;
  align-items:center;
  gap:10px;
}
.btn-wallet__avatar{
  width:28px;
  height:28px;
  display:none;
  align-items:center;
  justify-content:center;
  flex-shrink:0;
  border-radius:999px;
  background:
    radial-gradient(circle at 30% 30%, rgba(255,255,255,.22), rgba(255,255,255,.06) 42%, transparent 43%),
    linear-gradient(180deg, rgba(186,172,255,.88), rgba(126,156,255,.82));
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.20),
    0 6px 14px rgba(38,69,155,.26);
}
.btn-wallet__avatar-img{
  width:20px;
  height:20px;
  object-fit:contain;
  display:block;
  filter:drop-shadow(0 2px 4px rgba(0,0,0,.18));
}
.btn-wallet__label{
  display:block;
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
}
.btn-wallet__caret{
  display:none;
  width:8px;
  height:8px;
  flex-shrink:0;
  border-right:1.5px solid currentColor;
  border-bottom:1.5px solid currentColor;
  transform:rotate(45deg) translateY(-1px);
  opacity:.72;
}
.btn-wallet:hover{
  transform:translateY(-1px);
  background:
    linear-gradient(180deg, rgba(255,255,255,.10), rgba(255,255,255,.03)),
    rgba(24,21,54,.94);
  border-color:rgba(255,255,255,.18);
}
.btn-wallet[data-state="unavailable"]{
  border-color:rgba(255,216,109,.24);
  color:#fff0bd;
}
.btn-wallet[data-state="connected"]{
  min-height:50px;
  padding:0 14px 0 10px;
  border-color:rgba(117,142,255,.18);
  background:
    linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.02)),
    rgba(13,24,52,.94);
  color:#eef3ff;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.08),
    0 14px 30px rgba(4,10,26,.34),
    0 0 0 1px rgba(99,121,255,.10);
}
.btn-wallet[data-state="connected"] .btn-wallet__avatar,
.btn-wallet[data-state="connected"] .btn-wallet__caret{
  display:inline-flex;
}
.btn-wallet[data-state="connected"] .btn-wallet__label{
  max-width:96px;
  font-size:14px;
  font-weight:800;
  letter-spacing:.01em;
}
.btn-wallet[data-state="connected"]:hover{
  background:
    linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.03)),
    rgba(16,29,62,.98);
  border-color:rgba(132,154,255,.26);
}
.wallet-popover{
  position:absolute;
  top:calc(100% + 14px);
  right:0;
  width:min(320px, calc(100vw - 24px));
  z-index:1005;
}
.wallet-popover__card{
  position:relative;
  overflow:hidden;
  border-radius:24px;
  border:1px solid rgba(145,164,255,.14);
  background:
    linear-gradient(180deg, rgba(33,48,88,.98), rgba(24,33,63,.98) 62%, rgba(28,39,71,.98)),
    rgba(18,27,52,.98);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.06),
    0 24px 60px rgba(2,8,22,.52);
}
.wallet-popover__close{
  position:absolute;
  top:14px;
  right:14px;
  width:30px;
  height:30px;
  border:none;
  border-radius:999px;
  background:transparent;
  color:rgba(236,242,255,.78);
  font-size:26px;
  line-height:1;
  cursor:pointer;
  box-shadow:none;
}
.wallet-popover__close:hover{
  background:rgba(255,255,255,.06);
  color:#fff;
}
.wallet-popover__profile{
  display:flex;
  align-items:center;
  gap:14px;
  padding:24px 22px 18px;
}
.wallet-popover__avatar{
  width:44px;
  height:44px;
  display:grid;
  place-items:center;
  flex-shrink:0;
  border-radius:999px;
  background:
    radial-gradient(circle at 30% 30%, rgba(255,255,255,.24), rgba(255,255,255,.06) 42%, transparent 43%),
    linear-gradient(180deg, rgba(195,187,255,.92), rgba(141,169,255,.82));
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.22),
    0 8px 18px rgba(28,53,129,.34);
}
.wallet-popover__avatar-img{
  width:28px;
  height:28px;
  object-fit:contain;
  display:block;
}
.wallet-popover__identity{
  min-width:0;
}
.wallet-popover__address{
  color:#eef3ff;
  font-size:18px;
  font-weight:900;
  letter-spacing:.01em;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.wallet-popover__copy{
  margin-top:6px;
  padding:0;
  border:none;
  background:none;
  color:rgba(196,208,255,.76);
  font-size:12px;
  font-weight:700;
  cursor:pointer;
  box-shadow:none;
}
.wallet-popover__copy:hover{
  color:#fff;
}
.wallet-popover__divider{
  margin:0 16px;
  height:1px;
  background:linear-gradient(90deg, rgba(255,255,255,.10), rgba(255,255,255,.03));
}
.wallet-popover__section{
  padding:18px 22px 88px;
}
.wallet-popover__section-label{
  color:rgba(196,208,255,.62);
  font-size:12px;
  font-weight:800;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.wallet-popover__section-value{
  margin-top:10px;
  color:rgba(236,242,255,.84);
  font-size:14px;
  line-height:1.5;
}
.wallet-popover__disconnect{
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  min-height:60px;
  border:none;
  border-top:1px solid rgba(255,255,255,.08);
  border-radius:0 0 24px 24px;
  background:linear-gradient(180deg, rgba(112,132,198,.18), rgba(112,132,198,.28));
  color:#69e7ff;
  font-size:16px;
  font-weight:900;
  box-shadow:none;
}
.wallet-popover__disconnect:hover{
  background:linear-gradient(180deg, rgba(128,150,223,.22), rgba(128,150,223,.34));
  color:#9cf1ff;
}
.topbar__actions .btn-wallet[disabled],
.topbar__actions .btn-wallet[disabled]:hover{
  transform:none;
}
.btn[disabled]{
  opacity:.7;
  cursor:default;
}
.btn-small{
  padding:8px 10px;
  font-size:12px;
  border-radius:10px;
}
.w-full{width:100%}

/* hero */
.hero{
  position:relative;
  padding:72px 0 34px;
}
.hero::before,
.hero::after{
  content:"";
  position:absolute;
  pointer-events:none;
  border-radius:999px;
  filter:blur(12px);
}
.hero::before{
  top:12px;
  left:6%;
  width:220px;
  height:220px;
  background:radial-gradient(circle, rgba(247,211,106,.16), transparent 68%);
}
.hero::after{
  right:8%;
  top:44px;
  width:260px;
  height:260px;
  background:radial-gradient(circle, rgba(114,184,255,.12), transparent 70%);
}
.hero__grid,
.hero__grid--single{
  display:grid;
  grid-template-columns:1.12fr .88fr;
  gap:38px;
  align-items:stretch;
}
.hero__left{
  position:relative;
  padding:18px 0 8px;
}
.hero__right{
  position:relative;
  padding-left:24px;
}
.kicker{
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding:10px 16px;
  border-radius:999px;
  border:1px solid rgba(247,211,106,.18);
  background:
    linear-gradient(135deg, rgba(247,211,106,.12), rgba(114,184,255,.06)),
    rgba(255,255,255,.04);
  color:#f3e7b0;
  box-shadow:0 12px 28px rgba(0,0,0,.16);
  font-size:11px;
  font-weight:900;
  letter-spacing:.18em;
  text-transform:uppercase;
}
.title{
  margin:18px 0 14px;
  font-size:62px;
  line-height:1;
  letter-spacing:-.035em;
  max-width:none;
  display:flex;
  align-items:baseline;
  gap:.16em;
  flex-wrap:nowrap;
}
.accent{
  color:var(--gold2);
  text-shadow:0 0 24px rgba(247,211,106,.26);
}
.accent2{
  font-size:.72em;
  color:#cbb8ff;
  text-shadow:0 0 24px rgba(178,135,255,.22);
}
.subtitle{
  margin:0 0 24px;
  max-width:62ch;
  color:rgba(255,255,255,.80);
  line-height:1.8;
  font-size:15px;
}
.hero__cta{
  display:flex;
  gap:14px;
  flex-wrap:wrap;
  margin-bottom:24px;
}

/* stats */
.stats{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:14px;
}
.stat{
  position:relative;
  overflow:hidden;
  padding:16px 16px 15px;
  border-radius:18px;
  background:
    linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.025)),
    rgba(15,13,34,.58);
  border:1px solid rgba(255,255,255,.10);
  box-shadow:var(--shadow-soft);
  backdrop-filter:blur(10px);
}
.stat::before{
  content:"";
  position:absolute;
  inset:0 0 auto;
  height:1px;
  background:linear-gradient(90deg, transparent, rgba(255,255,255,.20), transparent);
}
.stat__label{
  color:rgba(255,255,255,.54);
  font-size:11px;
  margin-bottom:8px;
  font-weight:800;
  letter-spacing:.14em;
  text-transform:uppercase;
}
.stat__value{
  font-weight:950;
  letter-spacing:.01em;
  color:#fff;
}

/* generic card */
.card{
  position:relative;
  overflow:hidden;
  border-radius:24px;
  background:
    linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.015)),
    linear-gradient(135deg, rgba(17,15,40,.92), rgba(13,11,31,.84));
  border:1px solid rgba(255,255,255,.10);
  box-shadow:none;
}
.card::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    radial-gradient(520px 220px at 10% 0%, rgba(247,211,106,.12), transparent 60%),
    radial-gradient(440px 220px at 100% 100%, rgba(114,184,255,.08), transparent 60%);
  opacity:.85;
}
.card__head{
  padding:20px 20px 0;
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:10px;
}
.card__title{
  font-weight:950;
  letter-spacing:.04em;
  text-transform:uppercase;
}
.card__muted{
  font-size:12px;
  color:rgba(255,255,255,.56);
  margin-top:6px;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.badge{
  font-size:12px;
  padding:8px 11px;
  border-radius:999px;
  border:1px solid rgba(247,211,106,.25);
  background:rgba(247,211,106,.10);
}
.badge--logo{
  width:46px;
  height:46px;
  padding:0;
  border-radius:50%;
  display:grid;
  place-items:center;
  overflow:hidden;
}
.badge__img{
  width:100%;
  height:100%;
  object-fit:contain;
  display:block;
  border-radius:50%;
  transform:translate(var(--logo-fit-shift-x), var(--logo-fit-shift-y)) scale(var(--logo-fit-scale));
  transform-origin:center;
}
.spellbook{padding-bottom:16px}
.spellbook{
  position:relative;
  overflow:hidden;
  border-color:rgba(178,135,255,.18);
}
.spellbook::after{
  content:"";
  position:absolute;
  inset:-20%;
  pointer-events:none;
  background:linear-gradient(115deg, transparent 35%, rgba(255,255,255,.07) 50%, transparent 65%);
  transform:translateX(-45%) rotate(8deg);
  animation:parchmentShimmer 14s linear infinite;
}
.pad{padding:16px}

/* overview progress */
.progress{padding:18px 20px 10px}
.progress__row{
  display:flex;
  justify-content:space-between;
  align-items:center;
  color:rgba(255,255,255,.76);
  font-size:13px;
  margin-bottom:11px;
  font-weight:700;
}
.progress__row.small{
  font-size:12px;
  color:rgba(255,255,255,.50);
  margin-top:10px;
}
.progress__bar,
.meter__bar{
  height:14px;
  border-radius:999px;
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.08);
  overflow:hidden;
  box-shadow:inset 0 1px 6px rgba(0,0,0,.24);
}
.progress__fill,
.meter__fill{
  height:100%;
  width:0%;
  border-radius:999px;
  background:linear-gradient(90deg,var(--gold),var(--violet));
  transition:width .25s ease;
}

/* mini boxes */
.mini-grid{
  padding:2px 20px 0;
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
}
.mini{
  padding:14px;
  border-radius:18px;
  border:1px solid rgba(255,255,255,.10);
  background:
    linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.02)),
    rgba(255,255,255,.03);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04);
}
.mini__label{
  color:rgba(255,255,255,.48);
  font-size:11px;
  margin-bottom:8px;
  font-weight:800;
  letter-spacing:.14em;
  text-transform:uppercase;
}
.mini__value{font-weight:950}
.mini__value,
.card__title,
.badge{
  animation:parchmentGlow 10s ease-in-out infinite;
}
.note{
  padding:16px 20px 0;
  color:rgba(255,255,255,.54);
  font-size:12px;
  line-height:1.7;
}

/* sections */
.section{padding:56px 0}
.section__head{margin-bottom:18px}
.section__head h2{
  margin:0 0 10px;
  display:inline-block;
  max-width:100%;
  font-size:32px;
  letter-spacing:-.025em;
  color:#ffeaa0;
  background:
    linear-gradient(
      90deg,
      #fff8c7 0%,
      var(--brand-lily-gold) 24%,
      var(--brand-lily-green) 50%,
      var(--brand-lily-gold) 76%,
      #fff8c7 100%
    );
  background-size:220% 100%;
  -webkit-background-clip:text;
  background-clip:text;
  -webkit-text-fill-color:transparent;
  animation:backedByGlow 8.8s ease-in-out infinite;
  will-change:background-position, text-shadow;
}
.section__emoji{
  display:inline-block;
  margin-right:.18em;
  background:none;
  -webkit-background-clip:border-box;
  background-clip:border-box;
  -webkit-text-fill-color:initial;
  color:initial;
  font-family:"Apple Color Emoji","Segoe UI Emoji","Noto Color Emoji",sans-serif;
  text-shadow:none;
  animation:none;
  transform:translateY(-.03em);
  will-change:auto;
}
.section__head p{
  margin:0;
  color:rgba(255,255,255,.72);
  line-height:1.75;
}

/* grids */
.grid-2{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:16px;
}
.grid-3{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:16px;
}
#tokenomics .card{
  position:relative;
  overflow:hidden;
  animation:parchmentFloat 9s ease-in-out infinite;
}
#tokenomics .section__head{
  text-align:center;
}
#tokenomics .section__head p{
  display:block;
  margin-top:6px;
}
#tokenomics .card::after{
  content:"";
  position:absolute;
  inset:-20%;
  pointer-events:none;
  background:linear-gradient(115deg, transparent 35%, rgba(255,255,255,.07) 50%, transparent 65%);
  transform:translateX(-45%) rotate(8deg);
  animation:parchmentShimmer 8.5s linear infinite;
}
#tokenomics .card__title,
#tokenomics .chip,
#tokenomics .list b,
#tokenomics .bullets li{
  animation:parchmentGlow 5.2s ease-in-out infinite;
}

/* token card */
.token-card{
  position:relative;
  overflow:hidden;
  max-width:900px;
  margin:0 auto;
  padding:22px;
  border-color:rgba(114,184,255,.14);
}
.token-card--single{width:100%}
.token-card::after{
  content:"";
  position:absolute;
  inset:-20%;
  pointer-events:none;
  background:linear-gradient(115deg, transparent 35%, rgba(255,255,255,.07) 50%, transparent 65%);
  transform:translateX(-45%) rotate(8deg);
  animation:parchmentShimmer 14s linear infinite;
}
.token-card__top{
  display:flex;
  justify-content:flex-start;
  align-items:center;
  gap:14px;
  padding-bottom:16px;
  border-bottom:1px solid rgba(255,255,255,.09);
}
.token-icon{
  width:54px;
  height:54px;
  border-radius:50%;
  display:grid;
  place-items:center;
  font-weight:950;
  border:1px solid rgba(255,255,255,.08);
  background:transparent;
  flex-shrink:0;
  overflow:hidden;
}
.token-icon.dob{
  border-color:rgba(247,211,106,.22);
}
.token-icon__img{
  width:100%;
  height:100%;
  object-fit:contain;
  transform:translate(var(--logo-fit-shift-x), var(--logo-fit-shift-y)) scale(var(--logo-fit-scale));
  display:block;
  border-radius:50%;
  transform-origin:center;
}
.token-name{font-weight:950}
.token-name{
  font-size:22px;
  letter-spacing:-.01em;
}
.token-name,
.value,
.meter__value,
.pill-gold{
  animation:parchmentGlow 10s ease-in-out infinite;
}
.token-meta{
  font-size:12px;
  color:rgba(255,255,255,.52);
  margin-top:5px;
  letter-spacing:.06em;
  text-transform:uppercase;
}
.muted{
  color:var(--muted2);
  font-weight:750;
}
.token-card__body{padding-top:18px}

/* rows / input / fields */
.row{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:12px;
  margin-bottom:14px;
}
.label{
  color:rgba(255,255,255,.54);
  font-size:11px;
  font-weight:800;
  letter-spacing:.14em;
  text-transform:uppercase;
}
.value{font-weight:950}

.field{margin:16px 0 18px}
.field label{
  display:block;
  font-size:11px;
  color:rgba(255,255,255,.72);
  font-weight:800;
  margin-bottom:10px;
  letter-spacing:.14em;
  text-transform:uppercase;
}
.input{
  display:flex;
  align-items:center;
  gap:8px;
  padding:12px 12px 12px 14px;
  border-radius:18px;
  border:1px solid rgba(255,255,255,.10);
  background:
    linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.02)),
    rgba(255,255,255,.03);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04);
}
.input__prefix{
  color:rgba(255,255,255,.58);
  font-weight:950;
  letter-spacing:.12em;
}
.input input{
  width:100%;
  border:none;
  outline:none;
  background:transparent;
  color:#fff;
  font-size:15px;
  font-weight:900;
}
.hint{
  margin-top:10px;
  font-size:12px;
  color:rgba(255,255,255,.48);
  line-height:1.7;
}
.fineprint{
  margin-top:14px;
  font-size:12px;
  color:rgba(255,255,255,.50);
  line-height:1.7;
}
.celebration{
  position:fixed;
  inset:0;
  z-index:10000;
  display:grid;
  place-items:center;
  pointer-events:none;
  opacity:0;
  transition:opacity .2s ease;
}
.celebration.is-visible{
  opacity:1;
}
.celebration::before{
  content:"";
  position:absolute;
  inset:0;
  background:radial-gradient(circle at center, rgba(247,211,106,.16), rgba(7,6,18,.78));
  backdrop-filter:blur(6px);
}
.celebration__stage{
  position:relative;
  display:grid;
  justify-items:center;
  gap:16px;
  padding:28px 24px 22px;
  border-radius:28px;
  border:1px solid rgba(255,255,255,.12);
  background:linear-gradient(180deg, rgba(21,18,48,.92), rgba(12,10,28,.94));
  box-shadow:0 30px 80px rgba(0,0,0,.45);
}
.celebration__copy{
  position:relative;
  z-index:1;
  text-align:center;
}
.celebration__title{
  margin:0;
  font-size:32px;
  font-weight:950;
  letter-spacing:-.03em;
  color:#fff0b7;
}
.celebration__text{
  margin:8px 0 0;
  color:var(--muted);
  font-weight:700;
}
.celebration__lilygob{
  position:relative;
  width:240px;
  display:grid;
  justify-items:center;
}
.celebration__sparkle{
  position:absolute;
  inset:-22px;
  border-radius:50%;
  background:
    radial-gradient(circle at 20% 30%, rgba(247,211,106,.26), transparent 18%),
    radial-gradient(circle at 75% 20%, rgba(114,184,255,.20), transparent 18%),
    radial-gradient(circle at 82% 70%, rgba(247,211,106,.18), transparent 16%),
    radial-gradient(circle at 18% 78%, rgba(178,135,255,.18), transparent 16%);
  filter:blur(4px);
  animation:celebrationSparkle 1.8s ease-in-out infinite alternate;
}
.celebration__img{
  position:relative;
  z-index:1;
  width:240px;
  height:180px;
  object-fit:contain;
  filter:drop-shadow(0 16px 24px rgba(0,0,0,.30));
  transform-origin:center center;
}
.celebration__caption{
  position:relative;
  z-index:1;
  font-size:13px;
  font-weight:800;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:var(--gold2);
}
@keyframes celebrationBounce{
  from{transform:translateY(0) scale(1)}
  to{transform:translateY(-10px) scale(1.03)}
}
@keyframes celebrationTwerk{
  0%{transform:translateX(-10px) rotate(-5deg)}
  50%{transform:translateX(10px) rotate(5deg)}
  100%{transform:translateX(-10px) rotate(-5deg)}
}
@keyframes celebrationSparkle{
  from{transform:scale(.94); opacity:.75}
  to{transform:scale(1.06); opacity:1}
}
.claim-card{
  position:relative;
  overflow:hidden;
  max-width:860px;
  margin:0 auto;
  padding:30px 26px 24px;
  text-align:center;
  border-color:rgba(247,211,106,.16);
}
.claim-card::after{
  content:"";
  position:absolute;
  inset:-20%;
  pointer-events:none;
  background:linear-gradient(115deg, transparent 35%, rgba(255,255,255,.07) 50%, transparent 65%);
  transform:translateX(-45%) rotate(8deg);
  animation:parchmentShimmer 14s linear infinite;
}
.claim-card__hero{
  margin-bottom:22px;
}
.claim-card__eyebrow{
  font-size:11px;
  font-weight:800;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--gold);
  margin-bottom:10px;
}
.claim-card__title{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:14px;
  margin:0;
  font-size:44px;
  line-height:1;
  letter-spacing:-.03em;
  color:#f7f5ff;
}
.claim-card__logo{
  width:52px;
  height:52px;
  object-fit:contain;
  display:block;
  flex-shrink:0;
  border-radius:50%;
  transform:translate(var(--logo-fit-shift-x), var(--logo-fit-shift-y)) scale(var(--logo-fit-scale));
  transform-origin:center;
  filter:drop-shadow(0 10px 20px rgba(0,0,0,.28));
}
.claim-card__accent{
  color:var(--gold2);
  text-shadow:0 0 18px rgba(247,211,106,.22);
}
.claim-card__subtitle{
  margin:14px auto 0;
  max-width:560px;
  color:rgba(255,255,255,.74);
  line-height:1.75;
}
.claim-card__amount{
  padding:24px 22px;
  border-radius:22px;
  background:
    linear-gradient(180deg, rgba(114,184,255,.22), rgba(255,255,255,.06)),
    rgba(255,255,255,.03);
  border:1px solid rgba(114,184,255,.24);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.08),
    0 18px 34px rgba(0,0,0,.16);
}
.claim-card__label{
  font-size:11px;
  font-weight:800;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:rgba(255,255,255,.58);
  margin-bottom:12px;
}
.claim-card__value{
  font-size:42px;
  font-weight:950;
  letter-spacing:-.03em;
  color:#fff;
  animation:parchmentGlow 10s ease-in-out infinite;
}
.claim-grid{
  margin-top:18px;
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:14px;
}
.claim-stat{
  padding:16px 14px;
  border-radius:18px;
  background:
    linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.02)),
    rgba(255,255,255,.03);
  border:1px solid rgba(255,255,255,.10);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04);
}
.claim-stat__label{
  font-size:11px;
  color:rgba(255,255,255,.54);
  margin-bottom:10px;
  letter-spacing:.12em;
  text-transform:uppercase;
}
.claim-stat__value{
  font-size:22px;
  font-weight:900;
  animation:parchmentGlow 10s ease-in-out infinite;
}
.claim-card__button{
  margin-top:22px;
  width:100%;
}
.claim-card__foot{
  text-align:center;
  color:rgba(255,255,255,.54);
}

/* meter block */
.meter{margin:8px 0 14px}
.meter__row{
  display:flex;
  justify-content:space-between;
  align-items:center;
  font-size:12px;
  color:var(--muted);
  margin-bottom:8px;
}
.meter__label{
  color:var(--muted2);
  font-weight:850;
}
.meter__value{
  color:rgba(255,255,255,.90);
  font-weight:950;
}

/* list / chips */
.list{
  list-style:none;
  padding:0;
  margin:12px 0 0;
}
.list li{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:12px;
  padding:12px 0;
  border-bottom:1px solid rgba(255,255,255,.08);
}
.list li:last-child{border-bottom:0}

.chips{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-top:12px;
}
.chip{
  font-size:11px;
  padding:10px 12px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.10);
  background:
    linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.025)),
    rgba(255,255,255,.03);
  color:rgba(255,255,255,.78);
  letter-spacing:.10em;
  text-transform:uppercase;
}
.bullets{
  margin:12px 0 0;
  color:rgba(255,255,255,.76);
  line-height:1.95;
}

/* timeline simple */
.timeline{
  display:grid;
  gap:12px;
}
.step{
  display:grid;
  grid-template-columns:16px 1fr;
  gap:12px;
  padding:14px;
  border-radius:var(--radius);
  background:rgba(255,255,255,.04);
  border:1px solid rgba(255,255,255,.08);
}
.step__dot{
  width:14px;
  height:14px;
  border-radius:999px;
  margin-top:6px;
  border:2px solid rgba(255,255,255,.30);
  background:rgba(255,255,255,.10);
}
.step.done .step__dot{
  border-color:rgba(247,211,106,.55);
  background:rgba(247,211,106,.20);
}
.step__content h4{
  margin:0 0 6px;
}
.step__content p{
  margin:0;
  color:var(--muted);
  line-height:1.65;
}

#roadmap .timeline{
  display:none;
}
.roadmap-table{
  position:relative;
  overflow:hidden;
  border-radius:26px;
  border:1px solid rgba(255,255,255,.10);
  background:
    linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.015)),
    rgba(19,17,42,.60);
  box-shadow:
    0 24px 64px rgba(0,0,0,.24),
    inset 0 1px 0 rgba(255,255,255,.04);
}
#roadmap .section__head{
  text-align:center;
}
#roadmap .section__head p{
  display:block;
  margin-top:6px;
}
.roadmap-table::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  border-radius:inherit;
  background:linear-gradient(180deg, rgba(255,255,255,.04), transparent 32%);
}
.roadmap-table::after{
  content:"";
  position:absolute;
  inset:-20%;
  pointer-events:none;
  background:linear-gradient(115deg, transparent 35%, rgba(255,255,255,.07) 50%, transparent 65%);
  transform:translateX(-45%) rotate(8deg);
  animation:parchmentShimmer 14s linear infinite;
}
.roadmap-table__head,
.roadmap-row{
  display:grid;
  grid-template-columns:1.1fr .8fr 2fr 1fr;
}
.roadmap-table__head{
  padding:18px 20px;
  background:rgba(255,255,255,.05);
  color:rgba(255,255,255,.50);
  font-size:11px;
  font-weight:800;
  letter-spacing:.14em;
  text-transform:uppercase;
}
.roadmap-row{
  border-top:1px solid rgba(255,255,255,.08);
}
.roadmap-cell{
  padding:22px 20px;
  min-width:0;
}
.roadmap-cell:not(:last-child){
  border-right:1px solid rgba(255,255,255,.06);
}
.roadmap-cell--phase h3{
  margin:6px 0 0;
  font-size:30px;
  line-height:1.05;
}
.roadmap-phase__kicker{
  display:inline-flex;
  padding:6px 10px;
  border-radius:999px;
  background:rgba(247,211,106,.12);
  border:1px solid rgba(247,211,106,.24);
  color:var(--gold);
  font-size:12px;
  font-weight:800;
  letter-spacing:.06em;
  text-transform:uppercase;
  box-shadow:0 10px 24px rgba(0,0,0,.18);
  animation:parchmentGlow 10s ease-in-out infinite;
}
.roadmap-date{
  display:inline-flex;
  padding:8px 12px;
  border-radius:999px;
  background:rgba(114,184,255,.10);
  border:1px solid rgba(114,184,255,.20);
  color:#eef6ff;
  font-weight:800;
  white-space:nowrap;
  box-shadow:0 10px 24px rgba(0,0,0,.18);
  animation:parchmentGlow 10s ease-in-out infinite;
}
.roadmap-list{
  margin:0;
  padding-left:18px;
  color:rgba(255,255,255,.74);
  line-height:1.8;
}
.roadmap-list li + li{
  margin-top:4px;
}
.roadmap-tags{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}
.roadmap-tag{
  display:inline-flex;
  align-items:center;
  padding:8px 10px;
  border-radius:999px;
  background:rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.10);
  color:#fff;
  font-size:12px;
  font-weight:800;
  box-shadow:0 10px 24px rgba(0,0,0,.14);
  animation:parchmentGlow 10s ease-in-out infinite;
}

#faq .accordion{
  display:none;
}
.faq-table{
  position:relative;
  overflow:hidden;
  border-radius:26px;
  border:1px solid rgba(255,255,255,.10);
  background:
    linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.015)),
    rgba(19,17,42,.60);
  box-shadow:
    0 24px 64px rgba(0,0,0,.24),
    inset 0 1px 0 rgba(255,255,255,.04);
}
#whitepaper .section__head,
#Presale\ Rules .section__head{
  text-align:center;
}
#whitepaper .section__head p,
#Presale\ Rules .section__head p{
  display:block;
  margin-top:6px;
}
#faq .section__head{
  text-align:center;
}
#faq .section__head p{
  display:block;
  margin-top:6px;
}
.faq-table::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  border-radius:inherit;
  background:linear-gradient(180deg, rgba(255,255,255,.04), transparent 32%);
}
.faq-table::after{
  content:"";
  position:absolute;
  inset:-20%;
  pointer-events:none;
  background:linear-gradient(115deg, transparent 35%, rgba(255,255,255,.07) 50%, transparent 65%);
  transform:translateX(-45%) rotate(8deg);
  animation:parchmentShimmer 14s linear infinite;
}
.faq-table__head,
.faq-row{
  display:grid;
  grid-template-columns:1fr 2fr;
}
.faq-table__head{
  padding:18px 20px;
  background:rgba(255,255,255,.05);
  color:rgba(255,255,255,.50);
  font-size:11px;
  font-weight:800;
  letter-spacing:.14em;
  text-transform:uppercase;
}
.faq-row{
  border-top:1px solid rgba(255,255,255,.08);
}
.faq-cell{
  padding:22px 20px;
  min-width:0;
}
.faq-cell:not(:last-child){
  border-right:1px solid rgba(255,255,255,.06);
}
.faq-cell--question{
  display:flex;
  flex-direction:column;
  gap:10px;
}
.faq-cell--question h3{
  margin:0;
  font-size:24px;
  line-height:1.15;
}
.faq-cell p{
  margin:0;
  color:rgba(255,255,255,.74);
  line-height:1.85;
}
.faq-badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:42px;
  height:42px;
  border-radius:50%;
  border:1px solid rgba(247,211,106,.28);
  background:rgba(247,211,106,.10);
  color:var(--gold2);
  font-size:12px;
  font-weight:900;
  letter-spacing:.08em;
  box-shadow:0 10px 24px rgba(0,0,0,.18);
  animation:parchmentGlow 10s ease-in-out infinite;
}
.whitepaper-table{
  margin-top:6px;
}
.whitepaper-table .roadmap-table__head,
.whitepaper-table .roadmap-row{
  grid-template-columns:1.05fr .95fr 2.15fr 1fr;
}
.whitepaper-table .roadmap-cell{
  display:flex;
  flex-direction:column;
  justify-content:flex-start;
}
.whitepaper-table .roadmap-cell--phase h3{
  font-size:26px;
}
.whitepaper-thesis{
  display:inline-flex;
  align-items:flex-start;
  padding:12px 14px;
  border-radius:18px;
  background:
    linear-gradient(135deg, rgba(114,184,255,.12), rgba(178,135,255,.14)),
    rgba(255,255,255,.03);
  border:1px solid rgba(255,255,255,.12);
  color:#eef6ff;
  font-weight:850;
  line-height:1.55;
  white-space:normal;
  box-shadow:0 12px 28px rgba(0,0,0,.16);
}
.whitepaper-quote{
  margin-top:18px;
  padding:24px 28px;
  border-radius:24px;
  border:1px solid rgba(247,211,106,.18);
  background:
    radial-gradient(620px 220px at 0% 0%, rgba(247,211,106,.12), transparent 55%),
    radial-gradient(520px 240px at 100% 100%, rgba(114,184,255,.12), transparent 55%),
    linear-gradient(135deg, rgba(18,16,38,.94), rgba(31,27,58,.84));
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.05),
    0 22px 54px rgba(0,0,0,.24);
  text-align:center;
}
.whitepaper-quote__eyebrow{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:7px 12px;
  border-radius:999px;
  border:1px solid rgba(247,211,106,.22);
  background:rgba(247,211,106,.10);
  color:var(--gold2);
  font-size:11px;
  font-weight:900;
  letter-spacing:.14em;
  text-transform:uppercase;
}
.whitepaper-quote blockquote{
  margin:16px 0 10px;
  font-size:32px;
  line-height:1.1;
  font-weight:950;
  color:#fff8d6;
  text-shadow:0 0 18px rgba(247,211,106,.14);
}
.whitepaper-quote p{
  max-width:760px;
  margin:0 auto;
  color:rgba(255,255,255,.74);
  line-height:1.8;
}

/* alternate roadmap timeline */
.roadmap{padding:20px 0 0}
.roadmap-title{
  text-align:center;
  font-size:36px;
  margin:0 0 46px;
}
.timeline-item{
  display:flex;
  align-items:flex-start;
  position:relative;
  margin-bottom:40px;
}
.timeline::before{
  content:"";
  position:absolute;
  left:20px;
  top:0;
  width:2px;
  height:100%;
  background:linear-gradient(var(--gold),var(--violet));
}
.timeline-dot{
  width:14px;
  height:14px;
  border-radius:50%;
  background:var(--gold);
  position:absolute;
  left:14px;
  top:8px;
}
.timeline-content{
  margin-left:60px;
  background:rgba(255,255,255,.05);
  padding:20px;
  border-radius:12px;
  border:1px solid rgba(255,255,255,.08);
  width:100%;
}
.timeline-content h3{
  margin:0 0 10px;
  color:var(--gold2);
}
.timeline-content ul{
  padding-left:20px;
  line-height:1.8;
  color:#ddd;
}

/* faq */
.accordion{
  display:grid;
  gap:10px;
}
.qa{
  border-radius:var(--radius);
  border:1px solid rgba(255,255,255,.10);
  background:rgba(255,255,255,.04);
  padding:12px 14px;
}
.qa summary{
  cursor:pointer;
  font-weight:950;
}
.qa p{
  margin:10px 0 0;
  color:var(--muted);
  line-height:1.65;
}

/* parchment */
.parchment{
  position:relative;
  overflow:hidden;
  padding:24px;
  border-radius:28px;
  border:1px solid rgba(247,211,106,.22);
  background:
    radial-gradient(700px 220px at 8% 0%, rgba(247,211,106,.14), transparent 55%),
    radial-gradient(640px 240px at 100% 100%, rgba(178,135,255,.14), transparent 50%),
    repeating-linear-gradient(
      90deg,
      rgba(255,255,255,.03) 0px,
      rgba(255,255,255,.03) 2px,
      rgba(0,0,0,0) 6px,
      rgba(0,0,0,0) 12px
    ),
    linear-gradient(135deg, rgba(18,16,38,.96), rgba(31,27,58,.88));
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.06),
    0 22px 60px rgba(0,0,0,.28);
}
.parchment::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  border-radius:inherit;
  background:linear-gradient(180deg, rgba(255,255,255,.04), transparent 32%);
}
.parchment::after{
  content:"";
  position:absolute;
  inset:-20%;
  pointer-events:none;
  background:linear-gradient(115deg, transparent 35%, rgba(255,255,255,.08) 50%, transparent 65%);
  transform:translateX(-45%) rotate(8deg);
  animation:parchmentShimmer 14s linear infinite;
}
.parchment__title{
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:44px;
  padding:0 16px;
  border-radius:999px;
  border:1px solid rgba(247,211,106,.18);
  background:rgba(247,211,106,.08);
  color:#fff3c3;
  font-weight:950;
  letter-spacing:.02em;
  margin-bottom:18px;
  box-shadow:0 10px 24px rgba(0,0,0,.18);
  animation:parchmentGlow 10s ease-in-out infinite;
  position:relative;
  width:max-content;
  max-width:100%;
  margin-left:auto;
  margin-right:auto;
}
.parchment__list{
  line-height:1.95;
  margin:0;
  padding:18px 18px 18px 24px;
  border-radius:20px;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(255,255,255,.035);
}
.parchment__list li + li{
  margin-top:8px;
}
.parchment__actions{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  margin-top:18px;
}
@keyframes parchmentFloat{
  0%,100%{transform:translate3d(0,0,0)}
  50%{transform:translate3d(0,-3px,0)}
}
@keyframes parchmentShimmer{
  0%{transform:translate3d(-55%,0,0) rotate(8deg); opacity:.55}
  100%{transform:translate3d(55%,0,0) rotate(8deg); opacity:.9}
}
@keyframes parchmentGlow{
  0%,100%{opacity:1; transform:translate3d(0,0,0) scale(1)}
  50%{opacity:.9; transform:translate3d(0,0,0) scale(1.015)}
}

/* footer */
.footer{
  margin-top:48px;
  padding:22px 24px;
  border-radius:26px 26px 0 0;
  border:1px solid rgba(255,255,255,.08);
  background:
    linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.015)),
    rgba(10,8,24,.48);
  box-shadow:0 20px 44px rgba(0,0,0,.18);
}
.footer__grid{
  display:grid;
  grid-template-columns:1fr 1fr 1fr;
  gap:26px;
}
.footer__brand{
  font-weight:950;
  font-size:18px;
  letter-spacing:.12em;
  color:#fff3c3;
}
.footer__muted{
  font-size:12px;
  color:rgba(255,255,255,.54);
  line-height:1.75;
}
.footer__socials{
  display:flex;
  align-items:flex-start;
  gap:12px;
  flex-wrap:wrap;
  margin-top:16px;
}
.social-link-group{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:6px;
}
.social-link{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:42px;
  height:42px;
  border-radius:14px;
  border:1px solid rgba(255,255,255,.10);
  background:
    linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.02)),
    rgba(255,255,255,.03);
  color:rgba(255,255,255,.86);
  transition:.18s ease;
  box-shadow:0 10px 24px rgba(0,0,0,.18);
}
.social-link:hover{
  color:#fff;
  background:linear-gradient(135deg, rgba(247,211,106,.20), rgba(178,135,255,.22));
  border-color:rgba(247,211,106,.24);
}
.social-link svg{
  width:20px;
  height:20px;
  display:block;
}
.social-link__note{
  font-size:11px;
  line-height:1.2;
  color:rgba(255,255,255,.6);
  text-align:center;
  white-space:nowrap;
}
.footer__links{
  display:flex;
  flex-direction:column;
  gap:10px;
}
.footer__links a{
  color:rgba(255,255,255,.76);
  transition:color .18s ease, transform .18s ease;
}
.footer__links a:hover{
  color:#fff3c3;
  transform:translateX(2px);
}
.footer__right{text-align:right}

/* helpers */
.brand__crest{
  display:flex;
  align-items:center;
  justify-content:center;
}
.topbar__actions{
  display:flex;
  align-items:center;
  gap:10px;
}

/* mobile */
@media (max-width:980px){
  .rope-mascot{
    display:none;
  }
  .hero__grid,
  .hero__grid--single{
    grid-template-columns:1fr;
  }
  .hero__right{
    padding-left:0;
  }
  .wallet-badge{
    display:none;
  }
  .title{
    font-size:44px;
    gap:.14em;
  }
  .grid-2,
  .grid-3{
    grid-template-columns:1fr;
  }
  .stats{
    grid-template-columns:1fr;
  }
  .claim-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  .media-pill{
    min-width:164px;
    min-height:52px;
    padding:0 20px;
    font-size:14px;
  }
  .media-pill--coinmarketcap{
    min-width:198px;
    font-size:14px;
  }
  .roadmap-table__head{
    display:none;
  }
  .roadmap-row{
    grid-template-columns:1fr 1fr;
  }
  .roadmap-cell:nth-child(2){
    border-right:0;
  }
  .roadmap-cell:nth-child(3),
  .roadmap-cell:nth-child(4){
    border-top:1px solid rgba(255,255,255,.06);
  }
  .faq-table__head{
    display:none;
  }
  .faq-row{
    grid-template-columns:1fr;
  }
  .faq-cell:not(:last-child){
    border-right:0;
    border-bottom:1px solid rgba(255,255,255,.06);
  }
}

@media (max-width:980px){
  .section--backed-by{
    padding-top:8px;
  }
  .bg__aurora{
    inset:-10% -14% auto -14%;
    height:44vh;
    opacity:.44;
  }
  .bg__goblin-crowd{
    left:-18vw;
    right:-18vw;
    height:34vh;
    background:
      linear-gradient(180deg, rgba(7,7,14,0) 0%, rgba(7,7,14,.24) 24%, rgba(7,7,14,.88) 100%),
      url("./assets/images/dobby-rope-cutout.png") 18% 100% / 170px auto no-repeat,
      url("./assets/images/dobby-rope-cutout.png") 82% 100% / 180px auto no-repeat;
    opacity:.16;
  }
  .bg__goblin-eyes{
    display:none;
  }
  .bg__logo-art{
    top:48vh;
    left:12px;
    width:210px;
    opacity:.09;
  }
  .bg__mascot-art{
    right:-22vw;
    bottom:1vh;
    width:108vw;
    opacity:.2;
  }
  .bg__smoke{
    left:8%;
    width:84vw;
    min-width:0;
  }
}

@media (max-width:820px){
  .backed-by{
    gap:10px;
  }
  .backed-by__label{
    font-size:17px;
    letter-spacing:.14em;
  }
  .bg__aurora{
    inset:-14% -18% auto -18%;
    height:38vh;
    filter:blur(16px);
  }
  .bg__goblin-crowd{
    left:-22vw;
    right:-22vw;
    bottom:1vh;
    height:26vh;
    background:
      linear-gradient(180deg, rgba(7,7,14,0) 0%, rgba(7,7,14,.3) 30%, rgba(7,7,14,.9) 100%),
      url("./assets/images/dobby-rope-cutout.png") 18% 100% / 132px auto no-repeat,
      url("./assets/images/dobby-rope-cutout.png") 84% 100% / 136px auto no-repeat;
    opacity:.14;
  }
  .bg__goblin-eyes{
    display:none;
  }
  .bg__logo-art{
    top:52vh;
    left:10px;
    width:160px;
    opacity:.06;
  }
  .media-rail__inner{
    padding:12px;
  }
  .media-rail__track,
  .media-rail__group{
    gap:12px;
  }
  .media-pill{
    min-width:148px;
    min-height:48px;
    padding:0 18px;
    font-size:13px;
  }
  .media-pill--coinmarketcap{
    min-width:178px;
    font-size:13px;
  }
  .bg__mascot-art{
    right:-34vw;
    bottom:6vh;
    width:138vw;
    opacity:.16;
  }
  .bg__smoke{
    top:14%;
    left:-4%;
    width:106vw;
    height:64vh;
    min-height:0;
    opacity:.62;
  }
  .whitepaper-quote{
    padding:20px 18px;
  }
  :root{
    --topbar-h:146px;
  }
  .whitepaper-quote blockquote{
    font-size:26px;
  }
  .topbar__actions{
    padding-right:0;
  }
  .wallet-popover{
    right:0;
    width:min(300px, calc(100vw - 16px));
  }
  .nav{display:none}
  #btnMenu{display:inline-flex}
  .nav.open{
    display:flex;
    position:absolute;
    top:calc(var(--topbar-h) - 8px);
    left:4vw;
    right:4vw;
    flex-direction:column;
    padding:10px;
    background:rgba(10,8,24,.92);
    border:1px solid rgba(255,255,255,.12);
    border-radius:16px;
    backdrop-filter:blur(10px);
  }
  .nav.open .nav__links{
    width:100%;
    flex-direction:column;
    align-items:stretch;
    gap:6px;
  }
  .nav.open .nav__buy{
    width:100%;
  }
  .brand__logo-frame{
    width:60px;
    height:60px;
  }
  .hero{
    padding-top:54px;
  }
  .kicker{
    letter-spacing:.10em;
  }
  .brand{
    gap:12px;
    padding:0 0 0 28px;
  }
  .brand__row{
    gap:10px;
  }
  .brand__title-wrap{
    padding-top:44px;
  }
  .brand__mascot{
    top:-2px;
    width:132px;
  }
  .brand__title{font-size:22px}
  .brand__slogan{
    margin-left:6px;
    margin-bottom:0;
    font-size:11px;
    padding:5px 12px;
    max-width:220px;
    white-space:normal;
  }
  .claim-card{
    padding:22px 16px 18px;
  }
  .claim-card__title{
    font-size:30px;
  }
  .claim-card__logo{
    width:42px;
    height:42px;
  }
  .claim-card__value{
    font-size:30px;
  }
  .claim-grid{
    grid-template-columns:1fr;
  }
  .roadmap-row{
    grid-template-columns:1fr;
  }
  .roadmap-cell{
    padding:16px;
  }
  .roadmap-cell:not(:last-child){
    border-right:0;
    border-bottom:1px solid rgba(255,255,255,.06);
  }
  .roadmap-cell--phase h3{
    font-size:24px;
  }
  .faq-cell{
    padding:16px;
  }
  .faq-cell--question h3{
    font-size:20px;
  }
  .footer__grid{
    grid-template-columns:1fr;
  }
  .footer__right{text-align:left}
}

@media (prefers-reduced-motion:reduce){
  *{
    animation-duration:.001ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.001ms !important;
  }
  .celebration{
    transition:none;
  }
  .parchment,
  .parchment::after,
  .parchment__title,
  .claim-card,
  .claim-card::after,
  .claim-card__value,
  .claim-stat__value,
  .spellbook,
  .spellbook::after,
  .mini__value,
  .card__title,
  .badge,
  .token-card,
  .token-card::after,
  .token-name,
  .value,
  .meter__value,
  .pill-gold,
  #tokenomics .card,
  #tokenomics .card::after,
  #tokenomics .card__title,
  #tokenomics .chip,
  #tokenomics .list b,
  #tokenomics .bullets li,
  .roadmap-table,
  .roadmap-table::after,
  .roadmap-phase__kicker,
  .roadmap-date,
  .roadmap-tag,
  .faq-table,
  .faq-table::after,
  .faq-badge{
    animation:none !important;
  }
}
.section__head--center{
  text-align:center;
  margin-bottom:28px;
}

.section__head--center h2{
  margin:0;
  font-size:28px;
  font-weight:800;
  letter-spacing:-0.01em;
}

/* temporary no-shadow mode */
*,
*::before,
*::after{
  box-shadow:none !important;
}

/* ===== ZIRVE TASARIM EFEKTLERİ ===== */

/* Particle Canvas Arka Plan */
.particles-container{
  position:fixed;
  inset:0;
  z-index:-2;
  pointer-events:none;
  overflow:hidden;
}

.particle{
  position:absolute;
  width:4px;
  height:4px;
  background:var(--brand-lily-green);
  border-radius:50%;
  opacity:0;
  animation:particleFloat 15s ease-in-out infinite;
  filter:blur(0.5px);
}

.particle:nth-child(3n){
  background:var(--brand-lily-gold);
  width:6px;
  height:6px;
}

.particle:nth-child(5n){
  background:var(--violet);
  width:3px;
  height:3px;
}

@keyframes particleFloat{
  0%{
    opacity:0;
    transform:translateY(100vh) scale(0);
  }
  10%{
    opacity:0.6;
  }
  90%{
    opacity:0.6;
  }
  100%{
    opacity:0;
    transform:translateY(-20vh) scale(1);
  }
}

/* Neon Glow Efektleri */
.neon-glow{
  position:relative;
}

.neon-glow::before{
  content:"";
  position:absolute;
  inset:-2px;
  border-radius:inherit;
  background:linear-gradient(135deg, var(--brand-lily-green), var(--brand-lily-gold), var(--violet));
  z-index:-1;
  opacity:0;
  filter:blur(8px);
  transition:opacity 0.3s ease;
}

.neon-glow:hover::before{
  opacity:0.7;
}

/* Glassmorphism Enhanced Cards */
.card-glass{
  background:
    linear-gradient(135deg, rgba(255,255,255,0.1) 0%, rgba(255,255,255,0.05) 100%),
    linear-gradient(135deg, rgba(17,15,40,0.95) 0%, rgba(13,11,31,0.9) 100%) !important;
  backdrop-filter:blur(20px) saturate(180%);
  -webkit-backdrop-filter:blur(20px) saturate(180%);
  border:1px solid rgba(255,255,255,0.18) !important;
  box-shadow:
    0 8px 32px 0 rgba(0,0,0,0.37),
    inset 0 1px 0 rgba(255,255,255,0.1) !important;
}

/* Animasyonlu Border */
.animated-border{
  position:relative;
  background:var(--panel);
  border-radius:var(--radius);
}

.animated-border::before{
  content:"";
  position:absolute;
  inset:-2px;
  border-radius:calc(var(--radius) + 2px);
  background:linear-gradient(90deg, var(--brand-lily-green), var(--brand-lily-gold), var(--violet), var(--brand-lily-green));
  background-size:300% 100%;
  z-index:-1;
  animation:borderGradient 4s linear infinite;
}

.animated-border::after{
  content:"";
  position:absolute;
  inset:0;
  border-radius:var(--radius);
  background:var(--panel);
  z-index:0;
}

@keyframes borderGradient{
  0%{background-position:0% 50%;}
  100%{background-position:300% 50%;}
}

/* Shimmer Efekti */
.shimmer{
  position:relative;
  overflow:hidden;
}

.shimmer::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(90deg, transparent, rgba(255,255,255,0.15), transparent);
  transform:translateX(-100%);
  animation:shimmer 3s infinite;
}

@keyframes shimmer{
  100%{transform:translateX(100%);}
}

/* Pulse Glow */
.pulse-glow{
  animation:pulseGlow 2s ease-in-out infinite;
}

@keyframes pulseGlow{
  0%,100%{
    box-shadow:0 0 20px rgba(137,255,114,0.3), 0 0 40px rgba(137,255,114,0.1) !important;
  }
  50%{
    box-shadow:0 0 30px rgba(137,255,114,0.5), 0 0 60px rgba(137,255,114,0.2) !important;
  }
}

/* Gold Pulse */
.pulse-gold{
  animation:pulseGold 2s ease-in-out infinite;
}

@keyframes pulseGold{
  0%,100%{
    box-shadow:0 0 20px rgba(247,211,106,0.3), 0 0 40px rgba(247,211,106,0.1) !important;
  }
  50%{
    box-shadow:0 0 30px rgba(247,211,106,0.5), 0 0 60px rgba(247,211,106,0.2) !important;
  }
}

/* Hover Lift Efekti */
.hover-lift{
  transition:transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1), box-shadow 0.3s ease;
}

.hover-lift:hover{
  transform:translateY(-8px) scale(1.02);
  box-shadow:0 20px 40px rgba(0,0,0,0.3), 0 0 30px rgba(137,255,114,0.15) !important;
}

/* 3D Tilt Efekti */
.tilt-3d{
  transform-style:preserve-3d;
  perspective:1000px;
  transition:transform 0.1s ease;
}

/* Text Gradient Animation */
.text-gradient-anim{
  background:linear-gradient(90deg, var(--brand-lily-green), var(--brand-lily-gold), var(--violet), var(--brand-lily-green));
  background-size:300% 100%;
  -webkit-background-clip:text;
  background-clip:text;
  -webkit-text-fill-color:transparent;
  animation:textGradient 5s linear infinite;
}

@keyframes textGradient{
  0%{background-position:0% 50%;}
  100%{background-position:300% 50%;}
}

/* Floating Animation */
.floating{
  animation:floating 6s ease-in-out infinite;
}

@keyframes floating{
  0%,100%{transform:translateY(0px);}
  50%{transform:translateY(-20px);}
}

/* Orbit Animasyonu */
.orbit{
  animation:orbit 20s linear infinite;
}

@keyframes orbit{
  from{transform:rotate(0deg) translateX(30px) rotate(0deg);}
  to{transform:rotate(360deg) translateX(30px) rotate(-360deg);}
}

/* Glow Background */
.glow-bg{
  position:relative;
}

.glow-bg::before{
  content:"";
  position:absolute;
  inset:-50%;
  background:
    radial-gradient(circle at 30% 30%, rgba(137,255,114,0.15) 0%, transparent 50%),
    radial-gradient(circle at 70% 70%, rgba(247,211,106,0.15) 0%, transparent 50%),
    radial-gradient(circle at 50% 50%, rgba(178,135,255,0.1) 0%, transparent 50%);
  filter:blur(60px);
  z-index:-1;
  animation:glowPulse 8s ease-in-out infinite;
}

@keyframes glowPulse{
  0%,100%{opacity:0.5; transform:scale(1);}
  50%{opacity:0.8; transform:scale(1.1);}
}

/* Progress Bar Glow */
.progress-glow .progress__fill,
.progress-glow .meter__fill{
  box-shadow:0 0 10px var(--brand-lily-green), 0 0 20px rgba(137,255,114,0.5) !important;
}

/* Button Shine Efekti */
.btn-shine{
  position:relative;
  overflow:hidden;
}

.btn-shine::before{
  content:"";
  position:absolute;
  top:0;
  left:-100%;
  width:100%;
  height:100%;
  background:linear-gradient(90deg, transparent, rgba(255,255,255,0.4), transparent);
  transition:left 0.5s ease;
}

.btn-shine:hover::before{
  left:100%;
}

/* Card Hover Glow */
.card-hover-glow{
  transition:all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

.card-hover-glow:hover{
  transform:translateY(-5px);
  box-shadow:
    0 25px 50px -12px rgba(0,0,0,0.5),
    0 0 30px rgba(137,255,114,0.2),
    0 0 60px rgba(247,211,106,0.1) !important;
  border-color:rgba(137,255,114,0.3) !important;
}

/* Parallax Scroll Container */
.parallax-container{
  transform-style:preserve-3d;
  perspective:1px;
  overflow-x:hidden;
  overflow-y:auto;
}

/* Neon Text */
.neon-text{
  color:#fff;
  text-shadow:
    0 0 5px var(--brand-lily-green),
    0 0 10px var(--brand-lily-green),
    0 0 20px var(--brand-lily-green),
    0 0 40px rgba(137,255,114,0.5);
}

/* Magnetic Button Efekti */
.magnetic-btn{
  transition:transform 0.3s cubic-bezier(0.23, 1, 0.32, 1);
}

/* Aurora Background Enhanced */
.aurora-bg{
  position:relative;
  overflow:hidden;
}

.aurora-bg::before{
  content:"";
  position:absolute;
  inset:-100%;
  background:
    radial-gradient(ellipse at 20% 20%, rgba(137,255,114,0.15) 0%, transparent 50%),
    radial-gradient(ellipse at 80% 80%, rgba(247,211,106,0.15) 0%, transparent 50%),
    radial-gradient(ellipse at 50% 50%, rgba(178,135,255,0.1) 0%, transparent 50%);
  animation:auroraMove 20s ease-in-out infinite;
  z-index:-1;
}

@keyframes auroraMove{
  0%,100%{transform:translate(0, 0) rotate(0deg);}
  33%{transform:translate(30px, -30px) rotate(5deg);}
  66%{transform:translate(-20px, 20px) rotate(-5deg);}
}

/* Scroll Progress Indicator */
.scroll-progress{
  position:fixed;
  top:0;
  left:0;
  height:3px;
  background:linear-gradient(90deg, var(--brand-lily-green), var(--brand-lily-gold));
  z-index:10000;
  transition:width 0.1s ease;
}

/* Reveal Animation Classes */
.reveal{
  opacity:0;
  transform:translateY(30px);
  transition:all 0.8s cubic-bezier(0.4, 0, 0.2, 1);
}

.reveal.active{
  opacity:1;
  transform:translateY(0);
}

.reveal-left{
  opacity:0;
  transform:translateX(-50px);
  transition:all 0.8s cubic-bezier(0.4, 0, 0.2, 1);
}

.reveal-left.active{
  opacity:1;
  transform:translateX(0);
}

.reveal-right{
  opacity:0;
  transform:translateX(50px);
  transition:all 0.8s cubic-bezier(0.4, 0, 0.2, 1);
}

.reveal-right.active{
  opacity:1;
  transform:translateX(0);
}

.reveal-scale{
  opacity:0;
  transform:scale(0.8);
  transition:all 0.8s cubic-bezier(0.4, 0, 0.2, 1);
}

.reveal-scale.active{
  opacity:1;
  transform:scale(1);
}

/* Stagger Animation Delays */
.stagger-1{transition-delay:0.1s;}
.stagger-2{transition-delay:0.2s;}
.stagger-3{transition-delay:0.3s;}
.stagger-4{transition-delay:0.4s;}
.stagger-5{transition-delay:0.5s;}

/* Stats Counter Animation */
.counter-anim{
  display:inline-block;
  font-variant-numeric:tabular-nums;
}

/* Token Card Enhanced */
.token-card-enhanced{
  position:relative;
  background:
    linear-gradient(135deg, rgba(17,15,40,0.98) 0%, rgba(13,11,31,0.95) 100%) !important;
  border:1px solid rgba(137,255,114,0.2) !important;
  overflow:hidden;
}

.token-card-enhanced::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(circle at 0% 0%, rgba(137,255,114,0.1) 0%, transparent 30%),
    radial-gradient(circle at 100% 100%, rgba(247,211,106,0.1) 0%, transparent 30%);
  pointer-events:none;
}

/* Claim Card Enhanced */
.claim-card-enhanced{
  background:
    linear-gradient(135deg, rgba(17,15,40,0.98) 0%, rgba(13,11,31,0.95) 100%) !important;
  border:1px solid rgba(247,211,106,0.25) !important;
  box-shadow:
    0 20px 60px rgba(0,0,0,0.4),
    0 0 40px rgba(247,211,106,0.1) !important;
}

/* Hero Title Enhanced */
.hero-title-enhanced{
  font-size:68px !important;
  line-height:1.1 !important;
  letter-spacing:-0.04em !important;
  background:linear-gradient(135deg, #fff 0%, var(--brand-lily-gold) 50%, var(--brand-lily-green) 100%);
  -webkit-background-clip:text;
  background-clip:text;
  -webkit-text-fill-color:transparent;
  filter:drop-shadow(0 0 30px rgba(137,255,114,0.3));
}

/* Roadmap Timeline Enhanced */
.timeline-enhanced .step__dot{
  box-shadow:0 0 20px var(--brand-lily-green) !important;
  animation:dotPulse 2s ease-in-out infinite;
}

@keyframes dotPulse{
  0%,100%{box-shadow:0 0 20px rgba(137,255,114,0.5) !important;}
  50%{box-shadow:0 0 30px rgba(137,255,114,0.8) !important;}
}

/* FAQ Accordion Enhanced */
.qa-enhanced{
  border:1px solid rgba(255,255,255,0.1) !important;
  transition:all 0.3s ease;
}

.qa-enhanced:hover{
  border-color:rgba(137,255,114,0.3) !important;
  box-shadow:0 10px 30px rgba(0,0,0,0.2) !important;
}

.qa-enhanced[open]{
  border-color:rgba(137,255,114,0.5) !important;
  box-shadow:0 0 30px rgba(137,255,114,0.1) !important;
}

/* Presale Terminal Enhanced */
.presale-terminal{
  position:relative;
  background:
    linear-gradient(135deg, rgba(17,15,40,0.98), rgba(13,11,31,0.95)) !important;
  border:1px solid rgba(137,255,114,0.25) !important;
}

.presale-terminal::before{
  content:"";
  position:absolute;
  inset:-1px;
  border-radius:inherit;
  padding:1px;
  background:linear-gradient(135deg, var(--brand-lily-green), var(--brand-lily-gold), var(--violet));
  -webkit-mask:
    linear-gradient(#fff 0 0) content-box,
    linear-gradient(#fff 0 0);
  -webkit-mask-composite:xor;
  mask-composite:exclude;
  opacity:0.5;
  pointer-events:none;
}

/* Input Focus Glow */
.input-glow:focus-within{
  box-shadow:0 0 20px rgba(137,255,114,0.3) !important;
  border-color:rgba(137,255,114,0.5) !important;
}

/* Button Primary Enhanced */
.btn-primary-enhanced{
  position:relative;
  background:linear-gradient(135deg, var(--brand-lily-green) 0%, var(--brand-lily-green-deep) 100%) !important;
  border:none !important;
  overflow:hidden;
}

.btn-primary-enhanced::before{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(90deg, transparent, rgba(255,255,255,0.3), transparent);
  transform:translateX(-100%);
  transition:transform 0.6s ease;
}

.btn-primary-enhanced:hover::before{
  transform:translateX(100%);
}

.btn-primary-enhanced:hover{
  box-shadow:0 10px 30px rgba(137,255,114,0.4), 0 0 20px rgba(137,255,114,0.3) !important;
}

/* Whitepaper Section Enhanced */
.whitepaper-enhanced{
  background:
    linear-gradient(180deg, rgba(17,15,40,0.95) 0%, rgba(13,11,31,0.98) 100%) !important;
  position:relative;
  overflow:hidden;
}

.whitepaper-enhanced::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(circle at 20% 50%, rgba(137,255,114,0.05) 0%, transparent 40%),
    radial-gradient(circle at 80% 50%, rgba(247,211,106,0.05) 0%, transparent 40%);
  pointer-events:none;
}

/* Social Links Enhanced */
.social-enhanced{
  transition:all 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.social-enhanced:hover{
  transform:translateY(-5px) scale(1.1);
  filter:drop-shadow(0 0 10px var(--brand-lily-green));
}

/* Footer Enhanced */
.footer-enhanced{
  position:relative;
  background:linear-gradient(180deg, rgba(13,11,31,0.98) 0%, rgba(7,6,18,1) 100%) !important;
  border-top:1px solid rgba(137,255,114,0.1) !important;
}

/* Loading Spinner */
.spinner{
  width:40px;
  height:40px;
  border:3px solid rgba(137,255,114,0.3);
  border-top-color:var(--brand-lily-green);
  border-radius:50%;
  animation:spin 1s linear infinite;
}

@keyframes spin{
  to{transform:rotate(360deg);}
}

/* Success Checkmark Animation */
.checkmark{
  width:50px;
  height:50px;
  border-radius:50%;
  background:linear-gradient(135deg, var(--brand-lily-green), var(--brand-lily-green-deep));
  position:relative;
  animation:checkmarkPop 0.5s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.checkmark::after{
  content:"✓";
  position:absolute;
  inset:0;
  display:grid;
  place-items:center;
  color:#fff;
  font-size:28px;
  font-weight:bold;
}

@keyframes checkmarkPop{
  0%{transform:scale(0); opacity:0;}
  70%{transform:scale(1.2);}
  100%{transform:scale(1); opacity:1;}
}

/* Confetti Canvas */
#confetti-canvas{
  position:fixed;
  inset:0;
  pointer-events:none;
  z-index:9999;
}

/* Stats Grid Enhanced */
.stats-enhanced .stat{
  position:relative;
  overflow:hidden;
}

.stats-enhanced .stat::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(135deg, rgba(137,255,114,0.05) 0%, transparent 50%);
  opacity:0;
  transition:opacity 0.3s ease;
}

.stats-enhanced .stat:hover::after{
  opacity:1;
}

/* Mini Grid Enhanced */
.mini-grid-enhanced .mini{
  transition:all 0.3s ease;
}

.mini-grid-enhanced .mini:hover{
  transform:translateY(-3px);
  box-shadow:0 10px 25px rgba(0,0,0,0.2) !important;
}

/* Roadmap Row Enhanced */
.roadmap-row-enhanced{
  transition:all 0.3s ease;
  border-left:3px solid transparent;
}

.roadmap-row-enhanced:hover{
  border-left-color:var(--brand-lily-green);
  background:rgba(137,255,114,0.05) !important;
  transform:translateX(5px);
}

/* Media Rail Enhanced */
.media-rail-enhanced .media-pill{
  transition:all 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.media-rail-enhanced .media-pill:hover{
  transform:scale(1.05);
  box-shadow:0 10px 30px rgba(0,0,0,0.3) !important;
}

/* Topbar Enhanced */
.topbar-enhanced{
  background:
    linear-gradient(180deg, rgba(12,10,28,0.95) 0%, rgba(12,10,28,0.85) 100%),
    rgba(10,8,24,0.9) !important;
  backdrop-filter:blur(20px) saturate(180%);
  -webkit-backdrop-filter:blur(20px) saturate(180%);
  border-bottom:1px solid rgba(137,255,114,0.1) !important;
  box-shadow:0 4px 30px rgba(0,0,0,0.2) !important;
}

/* Nav Link Enhanced */
.nav-link-enhanced{
  position:relative;
  overflow:hidden;
}

.nav-link-enhanced::after{
  content:"";
  position:absolute;
  bottom:0;
  left:50%;
  width:0;
  height:2px;
  background:linear-gradient(90deg, var(--brand-lily-green), var(--brand-lily-gold));
  transition:all 0.3s ease;
  transform:translateX(-50%);
}

.nav-link-enhanced:hover::after{
  width:80%;
}

/* Scroll to Top Button */
.scroll-to-top{
  position:fixed;
  bottom:30px;
  right:30px;
  width:50px;
  height:50px;
  border-radius:50%;
  background:linear-gradient(135deg, var(--brand-lily-green), var(--brand-lily-green-deep));
  border:none;
  cursor:pointer;
  z-index:9998;
  display:flex;
  align-items:center;
  justify-content:center;
  opacity:0;
  visibility:hidden;
  transition:all 0.3s ease;
  box-shadow:0 4px 15px rgba(137,255,114,0.3) !important;
}

.scroll-to-top.visible{
  opacity:1;
  visibility:visible;
}

.scroll-to-top:hover{
  transform:translateY(-5px);
  box-shadow:0 8px 25px rgba(137,255,114,0.5) !important;
}

.scroll-to-top svg{
  width:24px;
  height:24px;
  stroke:#fff;
  stroke-width:2;
  fill:none;
}

/* Tooltip Enhanced */
.tooltip{
  position:relative;
}

.tooltip::before{
  content:attr(data-tooltip);
  position:absolute;
  bottom:100%;
  left:50%;
  transform:translateX(-50%) translateY(-8px);
  padding:8px 16px;
  border-radius:8px;
  background:rgba(17,15,40,0.95);
  border:1px solid rgba(137,255,114,0.3);
  color:#fff;
  font-size:12px;
  white-space:nowrap;
  opacity:0;
  visibility:hidden;
  transition:all 0.3s ease;
  z-index:1000;
}

.tooltip:hover::before{
  opacity:1;
  visibility:visible;
  transform:translateX(-50%) translateY(-4px);
}

/* Notification Toast */
.toast-container{
  position:fixed;
  top:100px;
  right:20px;
  z-index:10000;
  display:flex;
  flex-direction:column;
  gap:10px;
}

.toast{
  padding:16px 24px;
  border-radius:12px;
  background:linear-gradient(135deg, rgba(17,15,40,0.98), rgba(13,11,31,0.98));
  border:1px solid rgba(137,255,114,0.3);
  color:#fff;
  font-weight:600;
  box-shadow:0 10px 40px rgba(0,0,0,0.3), 0 0 20px rgba(137,255,114,0.1) !important;
  transform:translateX(100%);
  opacity:0;
  transition:all 0.4s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.toast.show{
  transform:translateX(0);
  opacity:1;
}

.toast.success{
  border-color:rgba(137,255,114,0.5);
}

.toast.error{
  border-color:rgba(255,100,100,0.5);
}

/* ===== PREMIUM BUTON EFEKTLERİ ===== */

/* Liquid Button Effect */
.btn-liquid{
  position:relative;
  overflow:hidden;
  z-index:1;
}

.btn-liquid::before{
  content:"";
  position:absolute;
  top:50%;
  left:50%;
  width:0;
  height:0;
  border-radius:50%;
  background:rgba(255,255,255,0.2);
  transform:translate(-50%, -50%);
  transition:width 0.6s ease, height 0.6s ease;
  z-index:-1;
}

.btn-liquid:hover::before{
  width:300%;
  height:300%;
}

/* Ripple Effect */
.btn-ripple{
  position:relative;
  overflow:hidden;
}

.btn-ripple .ripple{
  position:absolute;
  border-radius:50%;
  background:rgba(255,255,255,0.4);
  transform:scale(0);
  animation:rippleEffect 0.6s ease-out;
  pointer-events:none;
}

@keyframes rippleEffect{
  to{
    transform:scale(4);
    opacity:0;
  }
}

/* Glowing Border Button */
.btn-glow-border{
  position:relative;
  background:transparent !important;
  border:2px solid transparent !important;
  background-clip:padding-box;
  overflow:visible;
}

.btn-glow-border::before{
  content:"";
  position:absolute;
  inset:-2px;
  border-radius:inherit;
  padding:2px;
  background:linear-gradient(135deg, var(--brand-lily-green), var(--brand-lily-gold), var(--violet), var(--brand-lily-green));
  background-size:300% 100%;
  -webkit-mask:
    linear-gradient(#fff 0 0) content-box,
    linear-gradient(#fff 0 0);
  -webkit-mask-composite:xor;
  mask-composite:exclude;
  animation:borderGradient 3s linear infinite;
  z-index:-1;
}

.btn-glow-border::after{
  content:"";
  position:absolute;
  inset:0;
  border-radius:inherit;
  background:linear-gradient(135deg, rgba(17,15,40,0.95), rgba(13,11,31,0.95));
  z-index:-1;
}

/* Neon Pulse Button */
.btn-neon-pulse{
  animation:neonPulse 2s ease-in-out infinite;
}

@keyframes neonPulse{
  0%,100%{
    box-shadow:
      0 0 5px var(--brand-lily-green),
      0 0 10px var(--brand-lily-green),
      0 0 20px var(--brand-lily-green),
      0 0 40px rgba(137,255,114,0.3) !important;
  }
  50%{
    box-shadow:
      0 0 10px var(--brand-lily-green),
      0 0 20px var(--brand-lily-green),
      0 0 40px var(--brand-lily-green),
      0 0 80px rgba(137,255,114,0.5) !important;
  }
}

/* 3D Press Button */
.btn-3d{
  transition:transform 0.1s ease, box-shadow 0.1s ease;
  box-shadow:
    0 6px 0 rgba(30,215,96,0.5),
    0 10px 20px rgba(0,0,0,0.3) !important;
}

.btn-3d:active{
  transform:translateY(6px);
  box-shadow:
    0 0 0 rgba(30,215,96,0.5),
    0 4px 10px rgba(0,0,0,0.2) !important;
}

/* Gradient Text Button */
.btn-text-gradient{
  background:transparent !important;
  border:2px solid rgba(255,255,255,0.2) !important;
  position:relative;
  overflow:hidden;
}

.btn-text-gradient span{
  background:linear-gradient(90deg, var(--brand-lily-green), var(--brand-lily-gold), var(--violet));
  -webkit-background-clip:text;
  background-clip:text;
  -webkit-text-fill-color:transparent;
  font-weight:900;
}

/* Arrow Slide Button */
.btn-arrow-slide{
  position:relative;
  padding-right:50px !important;
  overflow:hidden;
}

.btn-arrow-slide::after{
  content:"→";
  position:absolute;
  right:20px;
  top:50%;
  transform:translateY(-50%);
  transition:transform 0.3s ease;
}

.btn-arrow-slide:hover::after{
  transform:translateY(-50%) translateX(5px);
}

/* Scale & Glow Button */
.btn-scale-glow{
  transition:all 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.btn-scale-glow:hover{
  transform:scale(1.05);
  box-shadow:
    0 15px 35px rgba(137,255,114,0.4),
    0 0 30px rgba(137,255,114,0.3) !important;
}

/* ===== PREMIUM INPUT EFEKTLERİ ===== */

/* Floating Label Input */
.input-floating{
  position:relative;
  margin-top:20px;
}

.input-floating input{
  width:100%;
  padding:16px 14px;
  background:rgba(255,255,255,0.05);
  border:2px solid rgba(255,255,255,0.1);
  border-radius:12px;
  color:#fff;
  font-size:16px;
  transition:all 0.3s ease;
}

.input-floating input:focus{
  outline:none;
  border-color:var(--brand-lily-green);
  box-shadow:0 0 20px rgba(137,255,114,0.2);
}

.input-floating label{
  position:absolute;
  left:14px;
  top:50%;
  transform:translateY(-50%);
  color:rgba(255,255,255,0.5);
  pointer-events:none;
  transition:all 0.3s ease;
}

.input-floating input:focus + label,
.input-floating input:not(:placeholder-shown) + label{
  top:-10px;
  left:10px;
  font-size:12px;
  color:var(--brand-lily-green);
  background:var(--bg0);
  padding:0 6px;
}

/* Neon Input */
.input-neon{
  position:relative;
}

.input-neon input{
  background:rgba(17,15,40,0.8);
  border:2px solid rgba(137,255,114,0.3);
  box-shadow:0 0 10px rgba(137,255,114,0.1);
  transition:all 0.3s ease;
}

.input-neon input:focus{
  border-color:var(--brand-lily-green);
  box-shadow:
    0 0 20px rgba(137,255,114,0.3),
    inset 0 0 20px rgba(137,255,114,0.05);
}

/* Animated Underline Input */
.input-underline{
  position:relative;
}

.input-underline::after{
  content:"";
  position:absolute;
  bottom:0;
  left:50%;
  width:0;
  height:2px;
  background:linear-gradient(90deg, var(--brand-lily-green), var(--brand-lily-gold));
  transition:all 0.3s ease;
  transform:translateX(-50%);
}

.input-underline:focus-within::after{
  width:100%;
}

/* ===== PREMIUM PROGRESS & METER ===== */

/* Shiny Progress Bar */
.progress-shiny .progress__bar,
.progress-shiny .meter__bar{
  background:rgba(255,255,255,0.1);
  overflow:hidden;
  position:relative;
}

.progress-shiny .progress__fill,
.progress-shiny .meter__fill{
  background:linear-gradient(90deg, var(--brand-lily-green), var(--brand-lily-gold)) !important;
  position:relative;
  overflow:hidden;
}

.progress-shiny .progress__fill::after,
.progress-shiny .meter__fill::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(90deg, transparent, rgba(255,255,255,0.4), transparent);
  animation:shimmerBar 2s infinite;
}

@keyframes shimmerBar{
  0%{transform:translateX(-100%);}
  100%{transform:translateX(100%);}
}

/* Glowing Progress */
.progress-glow-animate .progress__fill,
.progress-glow-animate .meter__fill{
  animation:progressGlow 2s ease-in-out infinite;
}

@keyframes progressGlow{
  0%,100%{filter:brightness(1);}
  50%{filter:brightness(1.2);}
}

/* Gradient Border Progress */
.progress-gradient-border{
  padding:4px;
  border-radius:999px;
  background:linear-gradient(135deg, var(--brand-lily-green), var(--brand-lily-gold));
}

.progress-gradient-border .progress__bar,
.progress-gradient-border .meter__bar{
  background:var(--bg0);
  border-radius:999px;
  margin:0;
}

/* ===== PREMIUM CARD EFEKTLERİ ===== */

/* Holographic Card */
.card-holo{
  position:relative;
  background:linear-gradient(135deg, rgba(17,15,40,0.95), rgba(13,11,31,0.95)) !important;
  overflow:hidden;
}

.card-holo::before{
  content:"";
  position:absolute;
  inset:-100%;
  background:
    linear-gradient(45deg, transparent 40%, rgba(255,255,255,0.1) 45%, rgba(255,255,255,0.2) 50%, rgba(255,255,255,0.1) 55%, transparent 60%);
  transform:rotate(45deg) translateY(-100%);
  transition:transform 0.6s ease;
  pointer-events:none;
}

.card-holo:hover::before{
  transform:rotate(45deg) translateY(100%);
}

/* Spotlight Card */
.card-spotlight{
  position:relative;
  overflow:hidden;
}

.card-spotlight::before{
  content:"";
  position:absolute;
  width:200px;
  height:200px;
  border-radius:50%;
  background:radial-gradient(circle, rgba(137,255,114,0.3), transparent 70%);
  pointer-events:none;
  opacity:0;
  transition:opacity 0.3s ease;
  transform:translate(-50%, -50%);
}

.card-spotlight:hover::before{
  opacity:1;
}

/* Floating Card */
.card-float{
  animation:floatCard 6s ease-in-out infinite;
}

@keyframes floatCard{
  0%,100%{transform:translateY(0) rotate(0deg);}
  25%{transform:translateY(-10px) rotate(1deg);}
  50%{transform:translateY(-5px) rotate(0deg);}
  75%{transform:translateY(-15px) rotate(-1deg);}
}

/* Glass Card with Noise */
.card-glass-noise{
  background:
    url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.65' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%' height='100%' filter='url(%23noise)' opacity='0.05'/%3E%3C/svg%3E"),
    linear-gradient(135deg, rgba(255,255,255,0.1), rgba(255,255,255,0.05)) !important;
  backdrop-filter:blur(20px);
}

/* ===== NAV & TOPBAR PREMIUM ===== */

/* Glowing Nav Link */
.nav-link-glow{
  position:relative;
  padding:10px 16px;
  transition:all 0.3s ease;
}

.nav-link-glow::before{
  content:"";
  position:absolute;
  inset:0;
  border-radius:12px;
  background:linear-gradient(135deg, rgba(137,255,114,0.1), rgba(247,211,106,0.1));
  opacity:0;
  transition:opacity 0.3s ease;
  z-index:-1;
}

.nav-link-glow:hover::before{
  opacity:1;
}

.nav-link-glow:hover{
  color:var(--brand-lily-green);
  text-shadow:0 0 10px rgba(137,255,114,0.5);
}

/* Active Nav Indicator */
.nav-link-active{
  position:relative;
}

.nav-link-active::after{
  content:"";
  position:absolute;
  bottom:-4px;
  left:50%;
  width:6px;
  height:6px;
  border-radius:50%;
  background:var(--brand-lily-green);
  box-shadow:0 0 10px var(--brand-lily-green);
  transform:translateX(-50%);
}

/* Topbar Glass Enhanced */
.topbar-glass{
  background:
    linear-gradient(180deg, rgba(12,10,28,0.85) 0%, rgba(12,10,28,0.75) 100%),
    rgba(10,8,24,0.8) !important;
  backdrop-filter:blur(30px) saturate(200%);
  -webkit-backdrop-filter:blur(30px) saturate(200%);
  border-bottom:1px solid rgba(137,255,114,0.15) !important;
}

/* ===== FOOTER PREMIUM ===== */

/* Social Icons Glow */
.social-glow{
  transition:all 0.3s ease;
}

.social-glow:hover{
  transform:translateY(-5px) scale(1.15);
  filter:drop-shadow(0 0 15px var(--brand-lily-green));
  color:var(--brand-lily-green);
}

/* Footer Link Underline Animation */
.footer-link-anim{
  position:relative;
  display:inline-block;
}

.footer-link-anim::after{
  content:"";
  position:absolute;
  bottom:-2px;
  left:0;
  width:0;
  height:1px;
  background:linear-gradient(90deg, var(--brand-lily-green), var(--brand-lily-gold));
  transition:width 0.3s ease;
}

.footer-link-anim:hover::after{
  width:100%;
}

/* ===== TEXT EFEKTLERİ ===== */

/* Gradient Text Shine */
.text-shine{
  background:linear-gradient(90deg, #fff 0%, var(--brand-lily-gold) 25%, var(--brand-lily-green) 50%, var(--brand-lily-gold) 75%, #fff 100%);
  background-size:200% auto;
  -webkit-background-clip:text;
  background-clip:text;
  -webkit-text-fill-color:transparent;
  animation:textShine 3s linear infinite;
}

@keyframes textShine{
  0%{background-position:200% center;}
  100%{background-position:-200% center;}
}

/* Glitch Text Effect */
.text-glitch{
  position:relative;
  animation:glitch 3s infinite;
}

@keyframes glitch{
  0%,90%,100%{transform:translate(0);}
  92%{transform:translate(-2px, 2px);}
  94%{transform:translate(2px, -2px);}
  96%{transform:translate(-2px, -2px);}
  98%{transform:translate(2px, 2px);}
}

/* Typewriter Cursor */
.typewriter::after{
  content:"|";
  animation:blink 1s infinite;
  color:var(--brand-lily-green);
}

@keyframes blink{
  0%,50%{opacity:1;}
  51%,100%{opacity:0;}
}

/* ===== BADGE & PILL EFEKTLERİ ===== */

/* Glowing Badge */
.badge-glow{
  animation:badgePulse 2s ease-in-out infinite;
}

@keyframes badgePulse{
  0%,100%{box-shadow:0 0 5px rgba(247,211,106,0.3) !important;}
  50%{box-shadow:0 0 20px rgba(247,211,106,0.6) !important;}
}

/* Animated Border Badge */
.badge-animated-border{
  position:relative;
  background:var(--panel) !important;
  z-index:1;
}

.badge-animated-border::before{
  content:"";
  position:absolute;
  inset:-2px;
  border-radius:inherit;
  padding:2px;
  background:linear-gradient(90deg, var(--brand-lily-green), var(--brand-lily-gold), var(--violet), var(--brand-lily-green));
  background-size:300% 100%;
  animation:borderRotate 3s linear infinite;
  -webkit-mask:
    linear-gradient(#fff 0 0) content-box,
    linear-gradient(#fff 0 0);
  -webkit-mask-composite:xor;
  mask-composite:exclude;
  z-index:-1;
}

@keyframes borderRotate{
  0%{background-position:0% 50%;}
  100%{background-position:300% 50%;}
}

/* ===== LOADING & STATUS ===== */

/* Pulsing Dot */
.pulse-dot{
  width:8px;
  height:8px;
  border-radius:50%;
  background:var(--brand-lily-green);
  box-shadow:0 0 0 0 rgba(137,255,114,0.7);
  animation:pulseDot 2s infinite;
}

@keyframes pulseDot{
  0%{transform:scale(0.95); box-shadow:0 0 0 0 rgba(137,255,114,0.7);}
  70%{transform:scale(1); box-shadow:0 0 0 10px rgba(137,255,114,0);}
  100%{transform:scale(0.95); box-shadow:0 0 0 0 rgba(137,255,114,0);}
}

/* Spinner Ring */
.spinner-ring{
  display:inline-block;
  width:40px;
  height:40px;
}

.spinner-ring::after{
  content:" ";
  display:block;
  width:32px;
  height:32px;
  margin:4px;
  border-radius:50%;
  border:3px solid transparent;
  border-top-color:var(--brand-lily-green);
  border-right-color:var(--brand-lily-gold);
  animation:spinnerRing 1.2s linear infinite;
}

@keyframes spinnerRing{
  0%{transform:rotate(0deg);}
  100%{transform:rotate(360deg);}
}

/* Success Animation */
.success-bounce{
  animation:successBounce 0.6s cubic-bezier(0.34, 1.56, 0.64, 1);
}

@keyframes successBounce{
  0%{transform:scale(0);}
  50%{transform:scale(1.2);}
  100%{transform:scale(1);}
}

/* ===== SCROLLBAR STYLING ===== */

/* Custom Scrollbar */
::-webkit-scrollbar{
  width:8px;
  height:8px;
}

::-webkit-scrollbar-track{
  background:rgba(17,15,40,0.5);
  border-radius:4px;
}

::-webkit-scrollbar-thumb{
  background:linear-gradient(180deg, var(--brand-lily-green), var(--brand-lily-green-deep));
  border-radius:4px;
}

::-webkit-scrollbar-thumb:hover{
  background:linear-gradient(180deg, var(--brand-lily-gold), var(--brand-lily-green));
}

/* ===== SELECTION STYLING ===== */

::selection{
  background:rgba(137,255,114,0.3);
  color:#fff;
  text-shadow:0 0 10px rgba(137,255,114,0.5);
}

/* ===== FOCUS STYLES ===== */

:focus-visible{
  outline:2px solid var(--brand-lily-green);
  outline-offset:2px;
  box-shadow:0 0 20px rgba(137,255,114,0.3);
}

/* ===== IMAGE EFEKTLERİ ===== */

/* Image Glow on Hover */
.img-glow{
  transition:all 0.3s ease;
}

.img-glow:hover{
  filter:drop-shadow(0 0 20px rgba(137,255,114,0.5));
  transform:scale(1.05);
}

/* Image Shine */
.img-shine{
  position:relative;
  overflow:hidden;
}

.img-shine::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(45deg, transparent 40%, rgba(255,255,255,0.2) 50%, transparent 60%);
  transform:translateX(-100%);
  transition:transform 0.6s ease;
}

.img-shine:hover::after{
  transform:translateX(100%);
}

/* ===== TABLE EFEKTLERİ ===== */

/* Table Row Hover Glow */
.table-row-glow tr{
  transition:all 0.3s ease;
}

.table-row-glow tr:hover{
  background:rgba(137,255,114,0.05) !important;
  box-shadow:inset 3px 0 0 var(--brand-lily-green);
}

/* ===== DIVIDER EFEKTLERİ ===== */

/* Gradient Line */
.divider-gradient{
  height:1px;
  background:linear-gradient(90deg, transparent, var(--brand-lily-green), var(--brand-lily-gold), transparent);
  border:none;
  margin:30px 0;
}

/* Animated Dots Divider */
.divider-dots{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  margin:30px 0;
}

.divider-dots span{
  width:6px;
  height:6px;
  border-radius:50%;
  background:var(--brand-lily-green);
  animation:dividerDot 1.4s ease-in-out infinite both;
}

.divider-dots span:nth-child(1){animation-delay:-0.32s;}
.divider-dots span:nth-child(2){animation-delay:-0.16s;}

@keyframes dividerDot{
  0%,80%,100%{transform:scale(0);}
  40%{transform:scale(1);}
}


