/* ========================================================
   PRODUCT PAGE: glass + sci-fi HUD
   ======================================================== */
@keyframes tkGridMove{from{background-position:0 0,0 0}to{background-position:0 48px,48px 0}}
@keyframes tkScan{0%{top:-10%}100%{top:110%}}
@keyframes tkSweep{0%{transform:translateX(-130%) skewX(-18deg)}55%,100%{transform:translateX(330%) skewX(-18deg)}}
@keyframes tkBorder{to{transform:rotate(360deg)}}
@keyframes tkStripe{to{background-position:28px 0}}
@keyframes tkBlink{0%,100%{opacity:1}50%{opacity:.25}}
@keyframes tkFloat{0%,100%{transform:translate(0,0)}50%{transform:translate(24px,-30px)}}
@keyframes tkShimmer{to{background-position:200% 0}}
@keyframes tkRipple{0%{transform:scale(.9);opacity:.7}100%{transform:scale(1.35);opacity:0}}
@keyframes tkPulseNum{0%,100%{text-shadow:0 0 6px rgba(242,169,0,.25)}50%{text-shadow:0 0 16px rgba(242,169,0,.8)}}

/* animated grid + scan line + orbs behind the page */
.page-buy-order{position:relative;isolation:isolate}
.page-buy-order::before{content:"";position:fixed;inset:0;z-index:-2;pointer-events:none;
  background-image:linear-gradient(rgba(242,169,0,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(242,169,0,.06) 1px,transparent 1px);
  background-size:48px 48px;animation:tkGridMove 6s linear infinite;
  -webkit-mask-image:radial-gradient(ellipse at 50% 30%,#000 30%,transparent 80%);mask-image:radial-gradient(ellipse at 50% 30%,#000 30%,transparent 80%)}
.page-buy-order::after{content:"";position:fixed;left:0;right:0;height:140px;z-index:-1;pointer-events:none;
  background:linear-gradient(180deg,transparent,rgba(242,169,0,.07),transparent);animation:tkScan 7s linear infinite}
.page-buy-order .page-content{position:relative}
.page-buy-order .page-content::before,.page-buy-order .page-content::after{content:"";position:fixed;z-index:-1;border-radius:50%;filter:blur(80px);pointer-events:none}
.page-buy-order .page-content::before{width:280px;height:280px;left:-90px;top:25%;background:rgba(242,169,0,.28);animation:tkFloat 12s ease-in-out infinite}
.page-buy-order .page-content::after{width:320px;height:320px;right:-110px;bottom:5%;background:rgba(70,110,255,.30);animation:tkFloat 15s ease-in-out infinite reverse}

/* hero headline */
.page-buy-order .hero-headline{font-size:30px!important;font-weight:800!important;letter-spacing:-.3px;
  background:linear-gradient(90deg,#fff 0%,#FFD76A 30%,#fff 60%,#F2A900 100%)!important;background-size:200% 100%!important;
  -webkit-background-clip:text!important;background-clip:text!important;-webkit-text-fill-color:transparent!important;animation:tkShimmer 5s linear infinite}
.page-buy-order .hero-headline::before{content:"// ASSIGNMENT.TERMINAL \25CF ONLINE";display:block;font:600 10.5px/1 'JetBrains Mono',monospace;letter-spacing:2px;color:#F2A900;-webkit-text-fill-color:#F2A900;margin-bottom:10px;animation:tkBlink 2.4s ease-in-out infinite}
.page-buy-order .hero-desc{color:#a9b6cc!important}

/* glass panels */
.page-buy-order .membership-tier-card,
.page-buy-order .animated-pulse-card,
.page-buy-order .stat-mini-box,
.page-buy-order .rules-matrix-card{
  position:relative;overflow:hidden;
  background:linear-gradient(135deg,rgba(255,255,255,.14),rgba(255,255,255,.04))!important;
  backdrop-filter:blur(18px) saturate(160%);-webkit-backdrop-filter:blur(18px) saturate(160%);
  border:1px solid rgba(255,255,255,.2)!important;border-radius:20px!important;
  box-shadow:0 14px 34px -12px rgba(0,0,0,.7),inset 0 1px 0 rgba(255,255,255,.3)!important}
.page-buy-order .membership-tier-card::before,
.page-buy-order .animated-pulse-card::before,
.page-buy-order .stat-mini-box::before,
.page-buy-order .rules-matrix-card::before{content:"";position:absolute;top:-50%;left:-30%;width:45%;height:200%;pointer-events:none;
  background:linear-gradient(100deg,transparent,rgba(255,255,255,.13),transparent);animation:tkSweep 6s ease-in-out infinite}
/* HUD corner brackets */
.page-buy-order .animated-pulse-card::after,
.page-buy-order .rules-matrix-card::after{content:"";position:absolute;inset:8px;pointer-events:none;border-radius:14px;
  background:
   linear-gradient(#F2A900,#F2A900) top left/16px 2px,linear-gradient(#F2A900,#F2A900) top left/2px 16px,
   linear-gradient(#F2A900,#F2A900) top right/16px 2px,linear-gradient(#F2A900,#F2A900) top right/2px 16px,
   linear-gradient(#F2A900,#F2A900) bottom left/16px 2px,linear-gradient(#F2A900,#F2A900) bottom left/2px 16px,
   linear-gradient(#F2A900,#F2A900) bottom right/16px 2px,linear-gradient(#F2A900,#F2A900) bottom right/2px 16px;
  background-repeat:no-repeat;opacity:.75;filter:drop-shadow(0 0 4px rgba(242,169,0,.8))}
.page-buy-order .stat-mini-box{transition:transform .25s ease,border-color .25s ease}
.page-buy-order .stat-mini-box:hover{transform:translateY(-3px);border-color:rgba(242,169,0,.5)!important}
.page-buy-order .mini-box-value{font-family:'JetBrains Mono',monospace!important;animation:tkPulseNum 3s ease-in-out infinite}
.page-buy-order .mini-box-label{letter-spacing:.8px;text-transform:uppercase;font-size:10.5px!important;color:#9fb0c9!important}

/* tier badge float */
.page-buy-order .tier-badge-box img{animation:vipFloat 3s ease-in-out infinite;filter:drop-shadow(0 4px 8px rgba(0,0,0,.5)) drop-shadow(0 0 8px rgba(242,169,0,.4))}

/* mission tracker */
.page-buy-order .mission-tracker-box{background:rgba(0,10,30,.45)!important;border:1px solid rgba(255,255,255,.14)!important;border-radius:16px!important;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.page-buy-order .progress-bar-track{background:rgba(255,255,255,.1)!important;border-radius:10px!important;overflow:hidden;box-shadow:inset 0 1px 3px rgba(0,0,0,.5)}
.page-buy-order .progress-bar-fill{background:repeating-linear-gradient(115deg,#FFD76A 0 10px,#F2A900 10px 20px)!important;background-size:28px 100%;animation:tkStripe .9s linear infinite;box-shadow:0 0 14px rgba(242,169,0,.85);border-radius:10px!important}
.page-buy-order .pulse-icon-wrapper{background:rgba(242,169,0,.14)!important;border:1px solid rgba(242,169,0,.6)!important;box-shadow:0 0 18px rgba(242,169,0,.45);animation:ciNum 2s ease-out infinite}

/* hold-to-grab reactor */
.page-buy-order .circle-hold-trigger{filter:drop-shadow(0 0 18px rgba(242,169,0,.25))}
.page-buy-order .circle-hold-trigger::before{content:"";position:absolute;inset:-14px;border-radius:50%;border:1px solid rgba(242,169,0,.5);animation:tkRipple 2.6s ease-out infinite;pointer-events:none}
.page-buy-order .circle-hold-trigger::after{content:"";position:absolute;inset:-6px;border-radius:50%;pointer-events:none;
  background:conic-gradient(from 0deg,transparent 0 70%,rgba(242,169,0,.9) 100%);
  -webkit-mask:radial-gradient(farthest-side,transparent calc(100% - 3px),#000 calc(100% - 2px));mask:radial-gradient(farthest-side,transparent calc(100% - 3px),#000 calc(100% - 2px));
  animation:tkBorder 3.2s linear infinite}
.page-buy-order .circle-pulse-ring{border-color:rgba(242,169,0,.55)!important}
.page-buy-order .circle-svg-track{stroke:rgba(255,255,255,.14)!important}
.page-buy-order .circle-svg-progress{stroke:#F2A900!important;filter:drop-shadow(0 0 8px rgba(242,169,0,.9))!important}
.page-buy-order .circle-inner-core{background:radial-gradient(circle at 35% 30%,rgba(255,255,255,.2),rgba(10,26,54,.85) 70%)!important;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.3)!important;box-shadow:0 8px 26px rgba(0,0,0,.6),inset 0 2px 6px rgba(255,255,255,.25),0 0 22px rgba(242,169,0,.25)!important}
.page-buy-order .circle-text-main{color:#FFD76A!important;font-family:'JetBrains Mono',monospace!important;letter-spacing:2px}
.page-buy-order .circle-hint{color:#9fb0c9!important}

/* modals: glass */
.page-buy-order .popup-content,#popup-task .popup-content{background:linear-gradient(135deg,rgba(32,48,80,.82),rgba(10,26,54,.9))!important;backdrop-filter:blur(22px) saturate(160%);-webkit-backdrop-filter:blur(22px) saturate(160%);border:1px solid rgba(255,255,255,.22)!important;border-radius:22px!important;box-shadow:0 24px 60px rgba(0,0,0,.7),inset 0 1px 0 rgba(255,255,255,.3)!important}
.page-buy-order .ai-scanner-card{background:linear-gradient(135deg,rgba(32,48,80,.8),rgba(10,26,54,.88))!important;backdrop-filter:blur(22px);-webkit-backdrop-filter:blur(22px);border:1px solid rgba(242,169,0,.45)!important;border-radius:22px!important;box-shadow:0 0 40px rgba(242,169,0,.25),0 24px 60px rgba(0,0,0,.7)!important}
.page-buy-order .rating-container{background:rgba(255,255,255,.06)!important;border-color:rgba(255,255,255,.18)!important}
.page-buy-order .primary-button,.page-buy-order .btn-confirm-booking-custom{background:linear-gradient(135deg,#FFD76A,#F2A900)!important;color:#1a1200!important;box-shadow:0 0 22px rgba(242,169,0,.55)!important}
@media (prefers-reduced-motion:reduce){.page-buy-order *,.page-buy-order::before,.page-buy-order::after{animation:none!important}}
.page-buy-order .brand-header-zone{background:none!important;background-image:none!important}

/* VIP details button: even padding + full-width in both cards */
.page-buy-order .rules-matrix-card{padding:20px!important}
.page-buy-order .mobile-only-details{background:none!important;border:none!important;padding:0!important;box-shadow:none!important}
.page-buy-order .vip-details-cta{margin:18px 0 0!important;padding:0!important;background:none!important;border:none!important;width:100%;text-align:center}
.page-buy-order .view-vip-details-btn{display:flex!important;width:100%;box-sizing:border-box;height:50px;padding:0 22px!important;margin:0!important;border-radius:14px!important}
.page-buy-order .rules-matrix-card .vip-details-cta{position:relative;z-index:2}