@font-face{
  font-family:'AeonikTrial';
  src:
    local('Aeonik Trial'),
    local('AeonikTrial'),
    url('/assets/font/AeonikTRIAL-Regular.otf') format('opentype');
  font-weight:400;
  font-style:normal;
  font-display:optional;
}

@font-face{
  font-family:'AeonikTrial';
  src:
    local('Aeonik Trial Bold'),
    local('AeonikTrial Bold'),
    url('/assets/font/AeonikTRIAL-Bold.otf') format('opentype');
  font-weight:700;
  font-style:normal;
  font-display:optional;
}

.blur-code{filter:blur(7px);user-select:none}
.hero-icons{position:absolute;inset:0;pointer-events:none;overflow:hidden;contain:layout;z-index:0}
.hero-icons__mesh{
  position:absolute;inset:-25% -10%;
  background:
    radial-gradient(ellipse 52% 48% at 12% 28%, rgba(22,163,74,.11), transparent 55%),
    radial-gradient(ellipse 48% 42% at 92% 18%, rgba(5,150,105,.08), transparent 52%),
    radial-gradient(ellipse 45% 38% at 78% 88%, rgba(16,185,129,.07), transparent 50%),
    radial-gradient(ellipse 40% 36% at 8% 85%, rgba(34,197,94,.06), transparent 48%);
  opacity:.85;
}
.hero-float{
  position:absolute;
  color:#16a34a;
  font-size:clamp(1.15rem,2.8vw,2.1rem);
  line-height:1;
  opacity:.06;
  animation:heroFloatDrift ease-in-out infinite;
  transform:translate3d(0,0,0);
}
.hero-float--alt{animation-name:heroFloatDriftRev}
.hero-float--late{display:none}
.hero-icons.is-paused .hero-float{animation-play-state:paused!important}
@media (min-width:768px){
  .hero-float--late{display:block}
}
@keyframes heroFloatDrift{
  0%,100%{transform:translate3d(0,0,0) rotate(-5deg);opacity:.05}
  33%{transform:translate3d(16px,-22px,0) rotate(7deg);opacity:.09}
  66%{transform:translate3d(-12px,-10px,0) rotate(-3deg);opacity:.065}
}
@keyframes heroFloatDriftRev{
  0%,100%{transform:translate3d(0,0,0) rotate(4deg);opacity:.055}
  33%{transform:translate3d(-14px,-18px,0) rotate(-8deg);opacity:.085}
  66%{transform:translate3d(10px,-14px,0) rotate(5deg);opacity:.07}
}
.redeem-btn{position:relative;overflow:hidden;background:#4861e2;color:#fff;border-radius:8px;padding:.82rem 2.1rem .82rem 1.35rem;font-size:.92rem;font-weight:700;line-height:1;transition:transform .25s ease, background-color .25s ease, box-shadow .25s ease;box-shadow:0 6px 14px rgba(72,97,226,.24)}
.redeem-btn:hover{background:#3f56d4;box-shadow:0 9px 18px rgba(63,86,212,.3)}
.redeem-btn::before{border:1px dashed #fff;border-left:none;border-bottom:none;width:16px;height:100%;transition:all .3s ease;content:"";position:absolute;top:0;right:0;display:block;background-image:linear-gradient(67deg, rgba(0,0,0,0), rgba(0,0,0,0) 50%, #a6b79d 51%, #e9ffdd 66%)}
.redeem-btn::after{content:"";position:absolute;inset:0;transform:translateX(-120%);background:linear-gradient(110deg, transparent 0%, rgba(255,255,255,.18) 45%, rgba(255,255,255,.45) 50%, rgba(255,255,255,.18) 55%, transparent 100%);transition:transform .55s ease;pointer-events:none}
.code-card{cursor:pointer}
:root{--bg:#f5f6f8;--gold:#f5d547}
.coupon-card{overflow:visible !important}
.coupon-card::before,.coupon-card::after{content:"";position:absolute;top:50%;width:20px;height:20px;border-radius:50%;background:var(--bg);z-index:3;transform:translateY(-50%)}
.coupon-card::before{right:-10px;box-shadow:inset 2px 0 4px rgba(0,0,0,.04)}
.coupon-card::after{left:-10px;box-shadow:inset -2px 0 4px rgba(0,0,0,.04)}
.coupon-old{color:#ef4444;text-decoration:line-through;font-weight:600;font-size:.95rem}
.coupon-new{color:#16a34a;font-weight:800;font-size:1.9rem;line-height:1}
.coupon-side .c1{width:100%}
.coupon-side .coupon-c1-right{
  padding:14px 28px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;
  border-top:2px dashed #eee;min-width:0;width:100%;box-sizing:border-box;
}
@media (min-width:768px){
  .coupon-side .coupon-c1-right{
    border-top:none;border-left:2px dashed #eee;min-width:160px;width:auto;
    padding-top:0;padding-bottom:0;padding-left:28px;padding-right:28px;
  }
}
.coupon-side .coupon-c1-right .old{font-size:14px;color:#e63946;text-decoration:line-through;font-weight:600}
.coupon-side .coupon-c1-right .free{font-family:'Manrope',system-ui,sans-serif;font-size:38px;font-weight:800;color:#16a34a;line-height:1;letter-spacing:.02em}
.coupon-side .coupon-c1-right .btn1{
  position:relative;display:inline-flex;align-items:center;justify-content:center;width:100%;max-width:220px;
  background:linear-gradient(180deg,#4ade80,#22c55e,#16a34a);
  border:none;border-radius:50px;padding:11px 28px;cursor:pointer;overflow:hidden;
  font-family:'Manrope',system-ui,sans-serif;font-weight:800;font-size:11px;letter-spacing:1.5px;text-transform:uppercase;color:#ffffff;
  box-shadow:0 3px 0 #15803d,0 6px 20px rgba(22,163,74,.3);
  transition:transform .25s,box-shadow .25s,filter .2s;-webkit-tap-highlight-color:transparent;
}
.coupon-side .coupon-c1-right .btn1::before{content:'';position:absolute;top:0;left:-100%;width:70%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.45),transparent);transition:left .5s}
.coupon-side .coupon-c1-right .btn1:hover:not(:disabled):not(.btn1--claimed):not(.btn1--disabled)::before{left:120%}
.coupon-side .coupon-c1-right .btn1:hover:not(:disabled):not(.btn1--claimed):not(.btn1--disabled){transform:translateY(-2px);box-shadow:0 5px 0 #15803d,0 10px 28px rgba(22,163,74,.4)}
.coupon-side .coupon-c1-right .btn1:active:not(:disabled):not(.btn1--claimed){transform:translateY(1px);box-shadow:0 1px 0 #15803d}
.coupon-side .coupon-c1-right .btn1--disabled,.coupon-side .coupon-c1-right .btn1:disabled{
  cursor:not-allowed;filter:grayscale(.88);opacity:.82;box-shadow:0 2px 0 #78716c,0 4px 14px rgba(0,0,0,.12);
}
.coupon-side .coupon-c1-right .btn1--claimed{
  max-width:100%;background:linear-gradient(180deg,#34d399,#059669);color:#fff;box-shadow:0 3px 0 #047857,0 8px 22px rgba(5,150,105,.35);
  gap:.5rem;letter-spacing:.06em;
}
.coupon-side .coupon-c1-right .btn1--claimed:hover{transform:none;box-shadow:0 3px 0 #047857,0 8px 22px rgba(5,150,105,.35)}
.coupon-side .coupon-c1-right .btn1--claimed::before{display:none}
.coupon-side .coupon-c1-right .btn1 .btn1-claimed-label{font-size:12px;font-weight:800}
@media (prefers-reduced-motion:reduce){
  .coupon-side .coupon-c1-right .btn1,.coupon-side .coupon-c1-right .btn1::before{transition:none}
  .coupon-side .coupon-c1-right .btn1:hover:not(:disabled):not(.btn1--claimed):not(.btn1--disabled){transform:none}
}
.cp-flow-panel .claim-btn.btn1,
.home-session-modal-btn.claim-btn.btn1{
  position:relative;display:inline-flex;align-items:center;justify-content:center;width:100%;gap:.5rem;
  background:linear-gradient(180deg,#4ade80,#22c55e,#16a34a);
  border:none;border-radius:50px;padding:11px 28px;cursor:pointer;overflow:hidden;
  font-family:'Manrope',system-ui,sans-serif;font-weight:800;font-size:11px;letter-spacing:1.5px;text-transform:uppercase;color:#ffffff;
  box-shadow:0 3px 0 #15803d,0 6px 20px rgba(22,163,74,.3);
  transition:transform .25s,box-shadow .25s,filter .2s;-webkit-tap-highlight-color:transparent;
}
.cp-flow-panel .claim-btn.btn1::before,.home-session-modal-btn.claim-btn.btn1::before{content:'';position:absolute;top:0;left:-100%;width:70%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.45),transparent);transition:left .5s}
.cp-flow-panel .claim-btn.btn1:hover:not(:disabled):not(.btn1--claimed):not(.btn1--disabled)::before,.home-session-modal-btn.claim-btn.btn1:hover:not(:disabled):not(.btn1--claimed):not(.btn1--disabled)::before{left:120%}
.cp-flow-panel .claim-btn.btn1:hover:not(:disabled):not(.btn1--claimed):not(.btn1--disabled),.home-session-modal-btn.claim-btn.btn1:hover:not(:disabled):not(.btn1--claimed):not(.btn1--disabled){transform:translateY(-2px);box-shadow:0 5px 0 #15803d,0 10px 28px rgba(22,163,74,.4)}
.cp-flow-panel .claim-btn.btn1:active:not(:disabled):not(.btn1--claimed),.home-session-modal-btn.claim-btn.btn1:active:not(:disabled):not(.btn1--claimed){transform:translateY(1px);box-shadow:0 1px 0 #15803d}
.cp-flow-panel .claim-btn.btn1--disabled,.cp-flow-panel .claim-btn.btn1:disabled,.home-session-modal-btn.claim-btn.btn1--disabled,.home-session-modal-btn.claim-btn.btn1:disabled{
  cursor:not-allowed;filter:grayscale(.88);opacity:.82;box-shadow:0 2px 0 #78716c,0 4px 14px rgba(0,0,0,.12);
}
@media (prefers-reduced-motion:reduce){
  .cp-flow-panel .claim-btn.btn1,.cp-flow-panel .claim-btn.btn1::before,.home-session-modal-btn.claim-btn.btn1,.home-session-modal-btn.claim-btn.btn1::before{transition:none}
  .cp-flow-panel .claim-btn.btn1:hover:not(:disabled):not(.btn1--claimed):not(.btn1--disabled),.home-session-modal-btn.claim-btn.btn1:hover:not(:disabled):not(.btn1--claimed):not(.btn1--disabled){transform:none}
}
.cp-flow-panel .cp-flow-btn-spinner{display:inline-block;width:1rem;height:1rem;flex-shrink:0;border:2px solid #1a1a2e;border-top-color:transparent;border-radius:9999px;animation:cpFlowSpin .7s linear infinite}
@keyframes cpFlowSpin{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){
  .cp-flow-panel .cp-flow-btn-spinner{animation:none;border-top-color:#1a1a2e;opacity:.65}
}
.recent-marquee{position:relative;overflow:hidden}
.recent-track{display:flex;gap:.75rem;width:max-content;animation:recentTicker 34s linear infinite}
.recent-marquee:hover .recent-track{animation-play-state:paused}
.recent-marquee--paused .recent-track{animation-play-state:paused!important}
.recent-item{min-width:290px}
@keyframes recentTicker{0%{transform:translateX(0)}100%{transform:translateX(-50%)}}
.hero-codes-btn{animation:codesCtaPulse 1.8s ease-in-out infinite}
@keyframes codesCtaPulse{0%,100%{transform:translateY(0)}50%{transform:translateY(-2px);box-shadow:0 10px 20px rgba(22,163,74,.28)}}
.nav-active{background:#ecfdf5;color:#166534}
.code-card:hover .redeem-btn:not(.redeem-btn-v2){transform:translateY(-2px)}
.code-card:hover .redeem-btn:not(.redeem-btn-v2)::before{width:24px;right:-3px}
.code-card:hover .redeem-btn:not(.redeem-btn-v2)::after{transform:translateX(120%)}
.redeem-btn.redeem-btn-v2{
  position:relative;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.45rem;
  overflow:visible;
  padding:.88rem 1.55rem .98rem;
  font-size:.8rem;
  font-weight:800;
  letter-spacing:.055em;
  text-transform:uppercase;
  color:#4a2b0c !important;
  border:2px solid #24150c;
  border-radius:9999px;
  background:linear-gradient(180deg,#fff59d 0%,#ffe135 24%,#ffb300 54%,#f57c00 86%,#e65100 100%) !important;
  box-shadow:
    inset 0 2px 1px rgba(255,255,255,.72),
    inset 0 -9px 16px rgba(160,52,6,.4),
    0 6px 0 #5d3114,
    0 12px 22px rgba(0,0,0,.26);
  transition:transform .18s ease,box-shadow .18s ease,filter .18s ease;
  text-shadow:0 1px 0 rgba(255,240,180,.92),0 2px 1px rgba(90,40,8,.28);
}
.redeem-btn.redeem-btn-v2 i{font-size:.72em;opacity:.92;color:#5c3610}
.redeem-btn.redeem-btn-v2:hover{
  background:linear-gradient(180deg,#fffde5 0%,#ffec52 22%,#ffc107 52%,#fb8c00 84%,#ef6c00 100%) !important;
  filter:brightness(1.04);
  box-shadow:
    inset 0 2px 1px rgba(255,255,255,.78),
    inset 0 -9px 16px rgba(160,52,6,.42),
    0 5px 0 #5d3114,
    0 14px 26px rgba(0,0,0,.3);
}
.code-card:hover .redeem-btn.redeem-btn-v2{transform:translateY(-3px)}
.redeem-btn.redeem-btn-v2:active:not(:disabled){
  transform:translateY(2px) !important;
  box-shadow:
    inset 0 2px 1px rgba(255,255,255,.55),
    inset 0 -5px 12px rgba(160,52,6,.48),
    0 3px 0 #5d3114,
    0 7px 14px rgba(0,0,0,.22);
}
.redeem-btn.redeem-btn-v2::before{
  content:"";
  position:absolute;
  inset:0;
  border-radius:inherit;
  border:none;
  width:auto;
  height:auto;
  right:auto;
  display:block;
  background:linear-gradient(102deg,transparent 0%,transparent 56%,rgba(255,255,255,.55) 70%,rgba(255,255,255,.14) 84%,transparent 98%);
  pointer-events:none;
  mix-blend-mode:soft-light;
  opacity:.55;
  transition:opacity .25s ease;
}
.code-card:hover .redeem-btn.redeem-btn-v2::before{opacity:.78}
.redeem-btn.redeem-btn-v2::after{
  content:"";
  position:absolute;
  left:4%;
  right:4%;
  bottom:2px;
  height:10px;
  pointer-events:none;
  background:
    radial-gradient(circle at 7% 118%,#1a0f08 0 3px,transparent 3.5px),
    radial-gradient(circle at 13% 118%,#1a0f08 0 3px,transparent 3.5px),
    radial-gradient(circle at 85% 118%,#1a0f08 0 3px,transparent 3.5px),
    radial-gradient(circle at 91% 118%,#1a0f08 0 3px,transparent 3.5px),
    radial-gradient(circle at 97% 118%,#1a0f08 0 3px,transparent 3.5px);
  transform:none !important;
  transition:opacity .2s ease;
}
.code-card:hover .redeem-btn.redeem-btn-v2::after{transform:none !important}
.claim-lock-preload .claim-btn{visibility:hidden}
.code-pool-guest-gate{min-height:9rem}
.code-pool-guest-blurcol .code-card{
  filter:blur(3px) saturate(0.96);
  -webkit-filter:blur(3px) saturate(0.96);
  opacity:.98;
  transform:scale(0.999);
  pointer-events:none;
  user-select:none;
  -webkit-user-select:none;
}
.code-pool-guest-overlay-root{
  background:linear-gradient(180deg,rgba(248,250,252,.15) 0%,rgba(148,163,184,.12) 50%,rgba(100,116,139,.18) 100%);
  border-radius:1.25rem;
}
@media (prefers-reduced-motion:reduce){
  .code-pool-guest-blurcol .code-card{filter:blur(2.5px) saturate(0.97);-webkit-filter:blur(2.5px) saturate(0.97)}
}
#codes{scroll-margin-top:96px}
.codes-focus{animation:codesPop .7s ease}
@keyframes codesPop{0%{transform:translateY(6px);opacity:.75}100%{transform:translateY(0);opacity:1}}
@media (prefers-reduced-motion: reduce){
  .recent-track{animation:none}
  .codes-focus{animation:none}
  .hero-codes-btn{animation:none}
  .hero-float{animation:none!important;opacity:.06!important;transform:none!important}
}
#codePoolTabs.code-pool-tabs-rail{
  scrollbar-width:thin;
  scrollbar-color:rgba(148,163,184,.85) transparent;
}
#codePoolTabs.code-pool-tabs-rail::-webkit-scrollbar{height:7px}
#codePoolTabs.code-pool-tabs-rail::-webkit-scrollbar-track{background:transparent;border-radius:999px}
#codePoolTabs.code-pool-tabs-rail::-webkit-scrollbar-thumb{background:rgba(148,163,184,.65);border-radius:999px}
#codePoolTabs.code-pool-tabs-rail:hover::-webkit-scrollbar-thumb{background:rgba(100,116,139,.85)}
#codePoolTabs.code-pool-tabs--dragging{cursor:grabbing !important}
#codePoolTabs.code-pool-tabs--dragging .code-filter-tab{cursor:grabbing}
/* Tab rail edge fades: inline CSS so gradients exist on first paint (Tailwind CDN utilities can apply late). */
.code-pool-tabs-fade{
  position:absolute;
  inset-block:0;
  width:3.5rem;
  z-index:2;
  pointer-events:none;
  opacity:0;
  transition:opacity .18s ease;
}
.code-pool-tabs-fade.is-visible{opacity:1}
.code-pool-tabs-fade--left{
  left:0;
  background:linear-gradient(90deg,#fff 0%,rgba(255,255,255,.92) 42%,rgba(255,255,255,0) 100%);
}
.code-pool-tabs-fade--right{
  right:0;
  background:linear-gradient(270deg,#fff 0%,rgba(255,255,255,.92) 42%,rgba(255,255,255,0) 100%);
}
@media (prefers-reduced-motion: reduce){
  .code-pool-tabs-fade{transition:none}
}
#mobileBottomNav{
  box-shadow:0 -1px 0 rgba(0,0,0,.06),0 -8px 24px rgba(15,23,42,.04);
}
.mobile-bottom-tab{font-weight:700;letter-spacing:.01em}
.mobile-bottom-tab.is-active{color:#16a34a}
.mobile-bottom-tab.is-active .mobile-bottom-tab-icon{color:#16a34a}
.mobile-bottom-tab:not(.is-active){color:#64748b}
.mobile-bottom-tab:not(.is-active) .mobile-bottom-tab-icon{color:#64748b}
.home-guides-reveal{padding:.1rem .1rem .35rem}
.home-guides-reveal-track{
  display:grid;
  grid-auto-flow:column;
  grid-auto-columns:100%;
  gap:12px;
  overflow-x:auto;
  scroll-snap-type:x mandatory;
  scroll-behavior:smooth;
  padding-bottom:.35rem;
}
.home-guides-reveal-track::-webkit-scrollbar{height:7px}
.home-guides-reveal-track::-webkit-scrollbar-thumb{background:rgba(148,163,184,.65);border-radius:999px}
.home-guides-reveal-track{scrollbar-width:thin;scrollbar-color:rgba(148,163,184,.65) transparent}
.home-guides-reveal-slide{scroll-snap-align:start;height:auto}
@media (min-width:768px){
  .home-guides-reveal-track{grid-auto-columns:calc((100% - 14px) / 2);gap:14px}
}
@media (min-width:1024px){
  .home-guides-reveal-track{grid-auto-columns:calc((100% - 32px) / 3);gap:16px}
}
@media (min-width:1280px){
  .home-guides-reveal-track{grid-auto-columns:calc((100% - 48px) / 4);gap:16px}
}
.guide-swiper-card {
  height: 100%;
  box-shadow: 0 4px 16px rgba(15, 23, 42, 0.06);
  transition: transform 360ms ease-in-out, box-shadow 360ms ease-in-out, border-color 240ms ease-in-out;
  will-change: transform, opacity;
}
.home-guides-nav {
  height:34px;
  width:34px;
  border-radius: 9999px;
  border: 1px solid #e5e7eb;
  background: rgba(255, 255, 255, 0.94);
  color: #334155;
  display:inline-flex;
  align-items:center;
  justify-content:center;
}
.home-guides-controls{display:flex;justify-content:flex-end;gap:.5rem;margin-top:.75rem}
.home-guides-reveal-slide.reveal-item .guide-swiper-card{opacity:.9;transform:translateY(4px)}
.home-guides-reveal-slide.reveal-item.is-visible .guide-swiper-card{opacity:1;transform:translateY(0)}
@media (max-width: 768px) {
  .home-guides-controls{display:none}
}
.img-progressive{
  background:linear-gradient(110deg,#f1f5f9 8%,#e2e8f0 22%,#f1f5f9 36%);
  background-size:220% 100%;
  animation:imgSkeleton 1.25s linear infinite;
  filter: blur(10px);
  transform: scale(1.02);
  opacity: .92;
  transition: filter .16s ease, transform .16s ease, opacity .16s ease;
}
.img-progressive.is-loaded{
  animation:none;
  background:transparent;
  filter: blur(0);
  transform: scale(1);
  opacity: 1;
}
@keyframes imgSkeleton{
  0%{background-position:100% 0}
  100%{background-position:-100% 0}
}
.page-shell{
  opacity:1;
  transform:translateY(0);
  will-change: auto;
  transition:none;
}
html.is-page-transitioning .page-shell{
  opacity:1;
  transform:none;
}
@media (prefers-reduced-motion: reduce){
  .page-shell{transition:none}
  html.is-page-transitioning .page-shell{opacity:1;transform:none}
}
[x-cloak]{
  display:none !important;
}
#app-main.htmx-swapping{
  opacity:1;
  transform:none;
}
#app-main.htmx-settling{
  opacity:1;
  transform:translateY(0);
}
