/* ================================================================
   TradeCycle — Premium 3D Design System
   ================================================================ */

/* --- Reset & Foundation --- */
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--background,#07090d);color:var(--text,#f4f7fb);font-family:var(--font,Inter,system-ui,sans-serif);line-height:1.6;-webkit-font-smoothing:antialiased;font-size:var(--font-base);font-weight:var(--font-body-weight);overflow-x:hidden}
h1,h2,h3,h4,h5,h6{font-weight:var(--font-heading-weight)}

/* Ambient background orbs */
body::before{content:"";position:fixed;inset:0;pointer-events:none;background:
  radial-gradient(ellipse 600px 400px at 8% 15%,color-mix(in srgb,var(--primary) 9%,transparent),transparent),
  radial-gradient(ellipse 500px 350px at 92% 25%,color-mix(in srgb,var(--secondary) 8%,transparent),transparent),
  radial-gradient(ellipse 400px 400px at 50% 80%,color-mix(in srgb,var(--accent) 5%,transparent),transparent);z-index:-1}

a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit}
button{cursor:pointer}
img,canvas{max-width:100%}

/* --- Layout --- */
.container{width:min(calc(100% - 32px),var(--container,1240px));margin-inline:auto}
.narrow{max-width:860px}
.section{padding:var(--section-space,88px) 0}
.soft-section{background:color-mix(in srgb,var(--surface) 45%,transparent);border-block:1px solid color-mix(in srgb,var(--border) 50%,transparent)}

/* --- Accessibility --- */
.skip-link{position:fixed;left:12px;top:-80px;z-index:1000;background:var(--text);color:var(--background);padding:10px 14px;border-radius:8px}
.skip-link:focus{top:12px}
:focus-visible{outline:3px solid color-mix(in srgb,var(--secondary) 72%,white);outline-offset:3px}
.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}

/* --- Typography helpers --- */
.muted{color:var(--muted)}
.profit{color:var(--success)!important}
.loss-text{color:var(--danger)!important}
.eyebrow{color:var(--primary);font-size:.72rem;font-weight:800;letter-spacing:.18em;text-transform:uppercase;margin-bottom:6px}
.lead{font-size:clamp(1.05rem,2vw,1.22rem);color:var(--muted);max-width:640px;line-height:1.7}
.fine-print,.formula-note,.disclaimer-note{font-size:.82rem;color:var(--muted)}
h1,h2,h3,p{margin-top:0}
h1{font-size:clamp(2rem,5vw,4.4rem);line-height:1.04;letter-spacing:-.04em}
h2{font-size:clamp(1.4rem,3vw,2.4rem);line-height:1.14;letter-spacing:-.02em}
h3{line-height:1.25}

/* --- Buttons --- */
.button-row,.header-actions,.topbar-actions,.danger-zone{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.button{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:10px 18px;border:1px solid transparent;border-radius:var(--button-radius,12px);background:linear-gradient(var(--gradient-angle,120deg),var(--gradient-start,var(--primary)),var(--gradient-end,#f59e0b));color:#111;font-weight:800;position:relative;overflow:hidden;transition:transform .3s cubic-bezier(.16,1,.3,1),box-shadow .3s,filter .3s;box-shadow:0 6px 24px color-mix(in srgb,var(--primary) calc(var(--glow,0.28)*60%),transparent),0 2px 8px rgba(0,0,0,.2)}
.button:hover{filter:brightness(1.1);transform:translateY(-2px);box-shadow:0 10px 36px color-mix(in srgb,var(--primary) calc(var(--glow,0.28)*80%),transparent),0 4px 12px rgba(0,0,0,.25)}
.button.ghost{background:color-mix(in srgb,var(--surface) 75%,transparent);border:1px solid var(--border);color:var(--text);box-shadow:none;backdrop-filter:blur(8px)}
.button.ghost:hover{background:color-mix(in srgb,var(--surface) 95%,transparent);border-color:var(--primary);box-shadow:0 0 20px color-mix(in srgb,var(--primary) 12%,transparent)}
.button.danger{background:var(--danger);border-color:var(--danger);color:#fff}
.button.small{min-height:34px;padding:5px 10px;font-size:.84rem}
html[data-button-style="solid"] .button{background:var(--primary)}
html[data-button-style="outline"] .button{background:transparent;color:var(--primary);border:1px solid var(--primary)}

/* Ripple */
.button .tc-ripple{position:absolute;width:10px;height:10px;border-radius:50%;background:rgba(255,255,255,.5);transform:translate(-50%,-50%) scale(0);pointer-events:none;animation:tc-ripple-grow .6s ease-out}
@keyframes tc-ripple-grow{to{transform:translate(-50%,-50%) scale(22);opacity:0}}

/* --- Icon button --- */
.icon-button{width:42px;height:42px;border:1px solid var(--border);border-radius:10px;background:var(--surface);color:var(--text);transition:border-color .25s,background .25s}
.icon-button:hover{border-color:var(--primary)}

/* --- Brand --- */
.brand{display:inline-flex;align-items:center;gap:10px;font-weight:850;letter-spacing:-.02em}
.brand-mark{display:inline-grid;place-items:center;width:38px;height:38px;border-radius:10px;background:linear-gradient(var(--gradient-angle,135deg),var(--gradient-start,var(--primary)),var(--gradient-end,#f59e0b));color:#15100a;font-size:.8rem;box-shadow:0 0 22px color-mix(in srgb,var(--primary) 28%,transparent);transition:transform .4s cubic-bezier(.34,1.56,.64,1)}
.brand-logo{max-width:160px;max-height:48px;object-fit:contain}

/* --- Site Header --- */
.site-header{position:sticky;top:0;z-index:100;border-bottom:1px solid color-mix(in srgb,var(--border) 60%,transparent);background:color-mix(in srgb,var(--background) 78%,transparent);backdrop-filter:blur(20px) saturate(1.3)}
.header-inner{min-height:72px;display:flex;align-items:center;justify-content:space-between;gap:26px}
.site-header nav{display:flex;gap:22px;margin-left:auto}
.site-header nav a{color:var(--muted);font-size:.9rem;transition:color .25s}
.site-header nav a:hover{color:var(--text)}
.site-header .brand:hover .brand-mark{transform:rotate(-8deg) scale(1.08)}
.nav-toggle,.sidebar-toggle{display:none}

/* --- Announcement --- */
.announcement{display:flex;justify-content:center;align-items:center;gap:16px;padding:8px 16px;background:color-mix(in srgb,var(--primary) 10%,var(--background));border-bottom:1px solid color-mix(in srgb,var(--primary) 22%,transparent);font-size:.82rem}
.announcement a{color:var(--primary);font-weight:800}

/* ================================================================
   HERO — immersive depth
   ================================================================ */
.hero{min-height:calc(100vh - 72px);display:grid;align-items:center;overflow:hidden;position:relative}
.hero::after{content:"";position:absolute;inset:-15% -10%;z-index:-1;pointer-events:none;
  background:
    radial-gradient(420px circle at var(--mx,18%) var(--my,22%),color-mix(in srgb,var(--primary) 14%,transparent),transparent 65%),
    radial-gradient(380px circle at calc(100% - var(--mx,18%)) calc(100% - var(--my,22%)),color-mix(in srgb,var(--secondary) 11%,transparent),transparent 62%);
  transition:background .2s linear;animation:orb-drift 14s ease-in-out infinite alternate}
@keyframes orb-drift{from{filter:blur(0)}to{filter:blur(6px)}}

.hero-grid{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(340px,.95fr);align-items:center;gap:clamp(32px,7vw,80px)}
.hero h1{max-width:820px;background:linear-gradient(var(--gradient-angle,110deg),var(--text) 10%,var(--gradient-start,var(--primary)) 70%,var(--gradient-end,#f59e0b));-webkit-background-clip:text;background-clip:text;color:transparent}

/* ================================================================
   3D CARD SYSTEM — glass + depth + spotlight
   ================================================================ */
.terminal-card,.panel,.chart-card,.rule-card,.feature-card,.cta-card,.auth-card,.install-card,.risk-card{
  border:1px solid color-mix(in srgb,var(--border) 80%,transparent);
  background:linear-gradient(145deg,color-mix(in srgb,var(--surface) calc(var(--glass-opacity,0.72)*100%),transparent),color-mix(in srgb,var(--background) 82%,transparent));
  border-radius:var(--card-radius,20px);
  box-shadow:var(--shadow,0 25px 70px rgba(0,0,0,.28));
  backdrop-filter:blur(var(--glass-blur,16px));
  transition:transform .45s cubic-bezier(.16,1,.3,1),box-shadow .45s,border-color .35s}

/* Tilt card — 3D perspective on hover */
.tilt-card{position:relative;transform:perspective(1200px) rotateX(var(--ry,0deg)) rotateY(var(--rx,0deg)) translateZ(0);will-change:transform}
.terminal-card.tilt-card{transform:perspective(1200px) rotateX(calc(2deg + var(--ry,0deg))) rotateY(calc(-4deg + var(--rx,0deg))) translateZ(0)}
.tilt-card:hover{box-shadow:0 30px 80px rgba(0,0,0,.35),0 0 0 1px color-mix(in srgb,var(--primary) 20%,transparent)}
/* Spotlight overlay */
.tilt-card::before{content:"";position:absolute;inset:0;border-radius:inherit;background:radial-gradient(280px circle at var(--mx,50%) var(--my,50%),color-mix(in srgb,var(--primary) 14%,transparent),transparent 62%);opacity:0;transition:opacity .4s ease;pointer-events:none;z-index:1}
.tilt-card:hover::before{opacity:1}

/* --- Terminal card (hero) --- */
.terminal-card{padding:22px;transform:perspective(1000px) rotateY(-4deg) rotateX(2deg);box-shadow:20px 32px 80px rgba(0,0,0,.45),0 0 50px color-mix(in srgb,var(--primary) 10%,transparent)}
.terminal-bar{display:flex;align-items:center;gap:7px;padding-bottom:14px;border-bottom:1px solid var(--border)}
.terminal-bar span{width:9px;height:9px;border-radius:50%;background:var(--danger)}
.terminal-bar span:nth-child(2){background:var(--warning)}
.terminal-bar span:nth-child(3){background:var(--success)}
.terminal-bar b{font-size:.74rem;margin-left:auto;color:var(--muted);font-family:ui-monospace,monospace}
.terminal-kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:22px 0}
.terminal-kpis div{padding:14px;background:rgba(255,255,255,.02);border-radius:12px;border:1px solid color-mix(in srgb,var(--border) 40%,transparent);transition:border-color .3s,background .3s}
.terminal-kpis div:hover{border-color:color-mix(in srgb,var(--primary) 40%,var(--border));background:rgba(255,255,255,.04)}
.terminal-kpis span,.kpi-grid span{display:block;color:var(--muted);font-size:.73rem;text-transform:uppercase;letter-spacing:.08em}
.terminal-kpis strong{font-size:1.4rem}

/* Equity spark bars */
.equity-spark{height:170px;display:flex;align-items:end;gap:8px;padding:16px;border:1px solid var(--border);border-radius:14px;background:linear-gradient(180deg,transparent,color-mix(in srgb,var(--success) 5%,transparent))}
.equity-spark i{flex:1;min-height:5px;background:linear-gradient(0deg,color-mix(in srgb,var(--success) 15%,transparent),var(--success));border-radius:5px 5px 0 0;transform-origin:bottom;animation:bar-grow .8s cubic-bezier(.16,1,.3,1) backwards}
.equity-spark i:nth-child(1){animation-delay:.02s}.equity-spark i:nth-child(2){animation-delay:.06s}.equity-spark i:nth-child(3){animation-delay:.1s}.equity-spark i:nth-child(4){animation-delay:.14s}.equity-spark i:nth-child(5){animation-delay:.18s}.equity-spark i:nth-child(6){animation-delay:.22s}.equity-spark i:nth-child(7){animation-delay:.26s}.equity-spark i:nth-child(8){animation-delay:.3s}.equity-spark i:nth-child(9){animation-delay:.34s}.equity-spark i:nth-child(10){animation-delay:.38s}
@keyframes bar-grow{from{transform:scaleY(0);opacity:0}to{transform:scaleY(1);opacity:1}}

.terminal-status{margin-top:14px;font-size:.78rem;color:var(--muted)}
.dot{display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:7px}
.dot.success{background:var(--success);box-shadow:0 0 10px var(--success)}

/* ================================================================
   PRINCIPLES — ribbon bar
   ================================================================ */
.principles{border-block:1px solid color-mix(in srgb,var(--primary) 25%,var(--border));background:color-mix(in srgb,var(--primary) 3%,var(--background))}
.principles-row{display:grid;grid-template-columns:repeat(4,1fr);text-align:center}
.principles-row span{padding:16px;font-weight:750;text-transform:uppercase;letter-spacing:.1em;font-size:.74rem;transition:color .3s,background .3s}
.principles-row span:hover{color:var(--primary);background:color-mix(in srgb,var(--primary) 5%,transparent)}
.principles-row span+span{border-left:1px solid color-mix(in srgb,var(--border) 60%,transparent)}

/* ================================================================
   SECTION HEADINGS
   ================================================================ */
.section-heading{text-align:center;max-width:740px;margin:0 auto 42px}
.section-heading.left{text-align:left;margin-left:0}
.section-heading h2{position:relative;display:inline-block}
.section-heading h2::after{content:"";position:absolute;left:50%;bottom:-10px;height:3px;width:0;transform:translateX(-50%);background:linear-gradient(var(--gradient-angle,120deg),var(--gradient-start,var(--primary)),var(--gradient-end,#f59e0b));border-radius:2px;transition:width .6s cubic-bezier(.16,1,.3,1)}
.section-heading.is-visible h2::after{width:56px}

/* ================================================================
   RULES — 3D cards with glow
   ================================================================ */
.rule-banner{display:flex;justify-content:center;align-items:center;gap:14px;margin:0 auto 22px;padding:14px 20px;border:1px solid color-mix(in srgb,var(--primary) 30%,var(--border));border-radius:var(--radius);text-transform:uppercase;background:color-mix(in srgb,var(--primary) 4%,var(--surface));backdrop-filter:blur(8px)}
.rule-banner strong{color:var(--primary)}
.rules-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:var(--card-gap)}
.rule-card{padding:26px;position:relative;overflow:hidden;transition:transform .4s cubic-bezier(.16,1,.3,1),box-shadow .4s,border-color .35s}
.rule-card::after{content:"";position:absolute;inset:auto -20% -50% 20%;height:120px;background:var(--rule-color,var(--danger));filter:blur(60px);opacity:.14;transition:opacity .4s}
.rule-card:hover::after{opacity:.24}
.rule-card:hover{transform:translateY(-8px);box-shadow:0 24px 60px rgba(0,0,0,.3),0 0 30px color-mix(in srgb,var(--rule-color,var(--danger)) 12%,transparent)}
.rule-card h3{color:var(--rule-color,var(--danger));margin-bottom:8px;position:relative;display:inline-block}
.rule-card h3::after{content:"";position:absolute;left:0;bottom:-4px;height:2px;width:0;background:var(--rule-color,var(--danger));transition:width .45s cubic-bezier(.16,1,.3,1)}
.rule-card:hover h3::after{width:36px}
.rule-card strong{display:block;font-size:1.5rem}
.rule-card span:last-child{color:var(--muted)}
.rule-icon{font-size:2rem;color:var(--rule-color,var(--danger))}

/* ================================================================
   WORKFLOW — numbered steps with connecting line
   ================================================================ */
.workflow{display:grid;grid-template-columns:repeat(5,1fr);list-style:none;padding:0;margin:0;counter-reset:steps}
.workflow li{position:relative;text-align:center;padding:22px 12px}
.workflow li:not(:last-child)::after{content:"→";position:absolute;right:-5px;top:33px;color:var(--muted);font-size:1.1rem}
.workflow li span{display:grid;place-items:center;width:52px;height:52px;border:1px solid var(--primary);border-radius:50%;margin:0 auto 12px;color:var(--primary);font-weight:900;background:color-mix(in srgb,var(--primary) 6%,var(--surface));transition:background .3s,box-shadow .3s,transform .3s}
.workflow li:hover span{background:color-mix(in srgb,var(--primary) 14%,var(--surface));box-shadow:0 0 24px color-mix(in srgb,var(--primary) 20%,transparent);transform:translateY(-3px)}

/* ================================================================
   DEMO — interactive sandbox
   ================================================================ */
.demo-panel{padding:clamp(18px,4vw,32px);border:1px solid var(--border);border-radius:var(--card-radius);background:color-mix(in srgb,var(--surface) 90%,transparent);backdrop-filter:blur(12px);transition:transform .4s cubic-bezier(.16,1,.3,1),box-shadow .4s}
.demo-slots{display:grid;grid-template-columns:repeat(10,1fr);gap:8px}
.demo-slot{padding:13px 6px;border:1px solid var(--border);border-radius:12px;background:var(--background);color:var(--text);transition:transform .3s cubic-bezier(.16,1,.3,1),border-color .3s,box-shadow .3s}
.demo-slot small,.demo-slot span{display:block;color:var(--muted);font-size:.68rem}
.demo-slot strong{font-size:1.2rem}
.demo-slot:hover{transform:translateY(-3px) scale(1.04);box-shadow:0 8px 20px rgba(0,0,0,.2)}
.demo-slot.active{border-color:var(--primary);box-shadow:0 0 20px color-mix(in srgb,var(--primary) 20%,transparent)}
.demo-slot[data-state="stop_loss"]{border-color:var(--danger)}
.demo-slot[data-state="impulse"]{border-color:var(--success)}
.demo-controls{display:flex;justify-content:center;align-items:end;gap:12px;margin:22px 0}

/* ================================================================
   PREVIEW — charts & KPIs
   ================================================================ */
.preview-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--card-gap)}
.kpi-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:var(--card-gap);margin-bottom:var(--card-gap)}
.kpi-grid article{padding:20px;border:1px solid var(--border);border-radius:var(--radius);background:color-mix(in srgb,var(--surface) 80%,transparent);transition:transform .35s cubic-bezier(.16,1,.3,1),box-shadow .35s,border-color .35s}
.kpi-grid article:hover{transform:translateY(-5px);box-shadow:0 16px 40px rgba(0,0,0,.25);border-color:color-mix(in srgb,var(--primary) 25%,var(--border))}
.kpi-grid strong{font-size:clamp(1.25rem,2.5vw,2rem);line-height:1.2}
.kpi-grid small{display:block;color:var(--muted);margin-top:6px}
.kpi-grid.compact{grid-template-columns:repeat(auto-fit,minmax(135px,1fr))}
.kpi-grid.compact article{padding:14px}
.kpi-grid .wide{grid-column:span 2}
.chart-card{padding:20px;min-height:260px}
.chart-card h2{font-size:1rem}
.chart-card h2 small{color:var(--muted);font-weight:400}
.chart-grid,.breakdown-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--card-gap)}
.chart-empty{height:200px;display:grid;place-items:center;text-align:center;color:var(--muted);padding:30px;border:1px dashed var(--border);border-radius:var(--radius)}

/* ================================================================
   FEATURES — horizontal card with icon
   ================================================================ */
.feature-section{padding:18px 0}
.feature-card{display:grid;grid-template-columns:90px 1fr;gap:24px;align-items:center;padding:32px;transition:transform .4s cubic-bezier(.16,1,.3,1),box-shadow .4s}
.feature-card:hover{transform:translateY(-6px) scale(1.005);box-shadow:0 24px 60px rgba(0,0,0,.3)}
.feature-icon{display:grid;place-items:center;width:72px;height:72px;border-radius:18px;background:color-mix(in srgb,var(--secondary) 10%,var(--surface));color:var(--secondary);font-size:2rem;transition:transform .4s cubic-bezier(.34,1.56,.64,1),box-shadow .3s}
.feature-card:hover .feature-icon{transform:scale(1.1) rotate(-4deg);box-shadow:0 0 30px color-mix(in srgb,var(--secondary) 18%,transparent)}

/* ================================================================
   CONTENT CALLOUT
   ================================================================ */
.principle-callout .container{display:grid;grid-template-columns:90px 1fr auto;align-items:center;gap:24px;padding:34px;border:1px solid color-mix(in srgb,var(--primary) 35%,var(--border));border-radius:var(--card-radius);background:color-mix(in srgb,var(--primary) 4%,var(--surface))}
.target-icon{font-size:3rem;color:var(--primary)}
.principle-callout ul{list-style:"◆  ";color:var(--success)}

/* ================================================================
   BENEFITS — grid with check icons
   ================================================================ */
.benefit-grid,.testimonial-grid,.media-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--card-gap)}
.benefit-grid article{padding:22px;border:1px solid var(--border);border-radius:var(--radius);background:color-mix(in srgb,var(--surface) 80%,transparent);transition:transform .35s cubic-bezier(.16,1,.3,1),box-shadow .35s,border-color .35s}
.benefit-grid article:hover{transform:translateY(-6px);box-shadow:0 18px 44px rgba(0,0,0,.28);border-color:color-mix(in srgb,var(--success) 30%,var(--border))}
.benefit-grid span{color:var(--success)}

/* ================================================================
   TESTIMONIALS
   ================================================================ */
.testimonial-grid blockquote{margin:0;padding:26px;border:1px solid var(--border);border-radius:var(--radius);background:color-mix(in srgb,var(--surface) 80%,transparent);transition:transform .35s cubic-bezier(.16,1,.3,1),box-shadow .35s}
.testimonial-grid blockquote:hover{transform:translateY(-5px);box-shadow:0 16px 40px rgba(0,0,0,.25)}
.testimonial-grid footer{color:var(--primary)}
.testimonial-avatar{width:56px;height:56px;object-fit:cover;border-radius:50%;margin-bottom:12px;border:2px solid color-mix(in srgb,var(--primary) 30%,var(--border))}

/* ================================================================
   FAQ — accordion
   ================================================================ */
.faq-list details{border-bottom:1px solid color-mix(in srgb,var(--border) 60%,transparent);padding:18px 4px;transition:background .3s}
.faq-list details[open]{background:color-mix(in srgb,var(--primary) 3%,transparent);border-radius:var(--radius);padding:18px 16px;margin-bottom:4px}
.faq-list summary{cursor:pointer;font-weight:800;transition:color .25s;list-style:none;display:flex;align-items:center;justify-content:space-between;gap:12px}
.faq-list summary::after{content:"＋";font-size:1.2rem;color:var(--primary);transition:transform .35s}
.faq-list details[open] summary::after{transform:rotate(45deg)}
.faq-list summary:hover{color:var(--primary)}
.faq-list summary::-webkit-details-marker{display:none}
.faq-list p{color:var(--muted);padding-top:12px}

/* ================================================================
   CTA — glowing card
   ================================================================ */
.cta-card{text-align:center;padding:clamp(32px,7vw,72px);position:relative;overflow:hidden;
  background:radial-gradient(ellipse at 50% 0%,color-mix(in srgb,var(--primary) 12%,transparent),transparent 55%),var(--surface)}
.cta-card::before{content:"";position:absolute;inset:-50%;background:conic-gradient(from 120deg,transparent,color-mix(in srgb,var(--primary) 8%,transparent),transparent 30%);animation:cta-rotate 12s linear infinite;pointer-events:none}
@keyframes cta-rotate{to{transform:rotate(360deg)}}

/* --- Disclaimer --- */
.disclaimer{padding:24px 0;border-top:1px solid var(--border);background:color-mix(in srgb,var(--warning) 3%,var(--background))}
.disclaimer .container{display:flex;gap:18px}
.disclaimer p{margin:0;color:var(--muted)}

/* --- Footer --- */
.site-footer{padding:54px 0 30px}
.footer-grid{display:grid;grid-template-columns:1fr auto;gap:22px}
.footer-grid small{grid-column:1/-1;color:var(--muted)}
.social-links{display:flex;gap:18px}
.social-links a{transition:color .25s}
.social-links a:hover{color:var(--primary)}

/* ================================================================
   AUTH PAGES
   ================================================================ */
.auth-page{min-height:calc(100vh - 72px);display:grid;place-items:center;padding:60px 16px}
.auth-card{width:min(100%,480px);padding:clamp(24px,5vw,40px)}
.auth-card h1{font-size:2.2rem}
.stack{display:grid;gap:16px}
.auth-links{display:flex;justify-content:space-between;margin-top:18px}

/* ================================================================
   INSTALLER
   ================================================================ */
.install-shell{min-height:100vh;display:grid;place-items:center;padding:40px 16px;background:var(--background,#07090d)}
.install-card{width:min(100%,880px);padding:clamp(24px,5vw,48px)}
.center{text-align:center}
.success-orb{display:grid;place-items:center;width:80px;height:80px;margin:auto;border-radius:50%;background:color-mix(in srgb,var(--success) 15%,var(--surface));color:var(--success);font-size:2rem}
.check-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:10px;margin:24px 0}
.check{display:flex;gap:10px;padding:12px;border:1px solid var(--border,#2a3342);border-radius:10px;background:var(--surface,#11161e)}
.check.ok span{color:var(--success,#4ed43b)}
.check.bad span{color:var(--danger,#ef4444)}

/* ================================================================
   FORMS
   ================================================================ */
label{display:grid;gap:6px;color:var(--muted);font-size:.85rem}
input,select,textarea{width:100%;border:1px solid var(--border);border-radius:10px;background:color-mix(in srgb,var(--background) 76%,var(--surface));color:var(--text);padding:10px 12px;min-height:44px;transition:border-color .25s,box-shadow .25s}
input:focus,select:focus,textarea:focus{border-color:var(--primary);box-shadow:0 0 0 3px color-mix(in srgb,var(--primary) 12%,transparent)}
textarea{resize:vertical}
.check-row{display:flex;align-items:center}
.check-row input{width:auto;min-height:0}
.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.form-grid h2,.form-grid .span-2{grid-column:1/-1}
.form-grid h2{font-size:1.1rem;padding-top:10px;margin-bottom:-4px}
.color-input{display:grid;grid-template-columns:52px 1fr;gap:8px}
.color-input input[type=color]{padding:4px}

/* ================================================================
   APP SHELL — sidebar + topbar + main (admin fix)
   ================================================================ */
.app-shell{padding-left:240px}
.sidebar{position:fixed;left:0;top:0;bottom:0;width:240px;padding:18px 12px;border-right:1px solid var(--border);background:color-mix(in srgb,#0a0e14 95%,var(--surface));z-index:200;overflow-y:auto;overflow-x:hidden}
.sidebar .brand{padding:0 8px 20px;font-size:.92rem}
.sidebar nav{display:grid;gap:2px}
.sidebar nav a{padding:8px 10px;border-radius:8px;color:var(--muted);font-size:.84rem;position:relative;transition:color .25s,padding-left .25s,background .25s}
.sidebar nav a::before{content:"";position:absolute;left:0;top:50%;width:3px;height:0;border-radius:2px;background:linear-gradient(var(--gradient-angle,120deg),var(--gradient-start,var(--primary)),var(--gradient-end,#f59e0b));transform:translateY(-50%);transition:height .25s}
.sidebar nav a:hover,.sidebar nav a:focus-visible{color:var(--text);background:color-mix(in srgb,var(--surface) 60%,transparent);padding-left:14px}
.sidebar nav a:hover::before,.sidebar nav a:focus-visible::before{height:55%}

.app-topbar{position:sticky;top:0;z-index:150;height:56px;display:flex;align-items:center;justify-content:space-between;padding:0 20px;border-bottom:1px solid var(--border);background:color-mix(in srgb,var(--background) 88%,transparent);backdrop-filter:blur(16px);font-size:.9rem}

/* ADMIN MAIN — constrained sizing */
.app-main{padding:20px 24px;max-width:1600px;margin:auto}
.app-main>.flash{margin-top:0}

/* Admin page head — compact */
.page-head{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:20px}
.page-head h1{font-size:clamp(1.6rem,3.5vw,2.4rem);margin-bottom:2px;line-height:1.15}
.page-head p{font-size:.88rem}

/* Admin panels — reduced padding */
.panel{padding:clamp(16px,2.5vw,24px);margin-bottom:var(--card-gap)}

/* Admin tables — tighter */
.filter-bar{display:flex;align-items:end;gap:10px;flex-wrap:wrap;padding:12px;margin-bottom:16px;border:1px solid var(--border);border-radius:var(--radius);background:var(--surface)}
.filter-bar label{min-width:125px}
.filter-bar .grow{flex:1;min-width:220px}
.table-wrap{overflow:auto;border:1px solid var(--border);border-radius:var(--radius);margin-bottom:16px}
table{width:100%;border-collapse:collapse;min-width:750px;background:color-mix(in srgb,var(--surface) 80%,transparent);font-size:.87rem}
th,td{padding:10px 12px;text-align:left;border-bottom:1px solid var(--border);vertical-align:middle}
th{position:sticky;top:0;background:#131920;color:var(--muted);font-size:.72rem;text-transform:uppercase;letter-spacing:.07em}
.table-wrap table tbody tr{transition:background-color .25s}
.table-wrap table tbody tr:hover{background:color-mix(in srgb,var(--primary) 4%,transparent)}

/* Status chips */
.status,.chip{display:inline-flex;padding:3px 8px;border:1px solid var(--border);border-radius:999px;font-size:.72rem;background:var(--surface)}
.status.impulse,.status.completed,.status.in_progress{color:var(--success);border-color:color-mix(in srgb,var(--success) 40%,var(--border))}
.status.stop_loss{color:var(--danger);border-color:color-mix(in srgb,var(--danger) 40%,var(--border))}
.status.open{color:var(--secondary)}
.status.draft,.status.cancelled{color:var(--muted)}

/* Pagination */
.pagination{display:flex;gap:6px}
.pagination a{display:grid;place-items:center;width:34px;height:34px;border:1px solid var(--border);border-radius:8px;transition:background .25s}
.pagination a.active{background:var(--primary);color:#111}

/* Empty state */
.empty-state{text-align:center;display:grid;place-items:center;align-content:center;min-height:70vh;padding:30px}
.empty-state.inline{min-height:260px;border:1px dashed var(--border);border-radius:var(--card-radius);margin:20px 0}
.display-number{font-size:5rem;font-weight:900;color:var(--primary)}

/* Detail grids */
.detail-grid,.settings-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--card-gap)}
.detail-grid .span-2{grid-column:1/-1}
dl{display:grid;gap:0}
dl div{display:flex;justify-content:space-between;gap:18px;padding:9px 0;border-bottom:1px solid var(--border);font-size:.88rem}
dt{color:var(--muted)}
dd{margin:0;text-align:right}

/* Danger zone */
.danger-zone{justify-content:flex-end;padding:14px;border:1px solid color-mix(in srgb,var(--danger) 30%,var(--border));border-radius:var(--radius)}

/* Cycle panel */
.cycle-panel{margin-bottom:20px}
.cycle-head,.section-row{display:flex;align-items:flex-start;justify-content:space-between;gap:16px}
.impulse-breakdown{border-top:1px solid var(--border);padding-top:16px}
.impulse-breakdown .chip{margin-right:8px}

/* Score rings */
@property --score{syntax:'<number>';inherits:true;initial-value:0}
.score-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.score-grid article{text-align:center}
.score-ring{--score:0;width:100px;height:100px;margin:auto;border-radius:50%;display:grid;place-items:center;background:radial-gradient(circle,var(--surface) 56%,transparent 58%),conic-gradient(var(--secondary) calc(var(--score)*1%),var(--border) 0);transition:--score 1.1s cubic-bezier(.16,1,.3,1)}
.score-ring strong{font-size:1.4rem}

/* Mini table */
.mini-table>div{display:flex;justify-content:space-between;gap:14px;padding:8px 0;border-bottom:1px solid var(--border);font-size:.88rem}
.mini-table small{display:block;color:var(--muted)}

/* Risk cards */
.risk-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:var(--card-gap);margin-bottom:var(--card-gap)}
.risk-card{padding:18px;transition:transform .35s cubic-bezier(.16,1,.3,1),box-shadow .35s}
.risk-card:hover{transform:translateY(-5px);box-shadow:0 18px 44px rgba(0,0,0,.28)}
.risk-card strong{display:block;font-size:1.3rem}
.risk-card.limit-exceeded{border-color:var(--danger)}
.risk-card.warning{border-color:var(--warning)}
.progress{height:6px;border-radius:20px;background:var(--border);overflow:hidden;margin:10px 0}
.progress i{display:block;height:100%;background:var(--success);transition:width .8s cubic-bezier(.16,1,.3,1)}
.risk-card.warning .progress i{background:var(--warning)}
.risk-card.limit-exceeded .progress i{background:var(--danger)}

/* Theme editor */
.theme-editor{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(280px,.7fr);gap:var(--card-gap)}
.theme-preview{position:sticky;top:78px;height:max-content}

/* Section list */
.section-list{display:grid;gap:12px}
.section-list .panel{margin:0}
.section-list pre{white-space:pre-wrap;max-height:280px;overflow:auto;padding:12px;border-radius:10px;background:#05070a;font-size:.82rem}

/* Media */
.media-placeholder{height:120px;display:grid;place-items:center;border:1px dashed var(--border);border-radius:var(--radius);font-size:2rem;color:var(--muted)}
.media-thumb{width:100%;aspect-ratio:16/10;object-fit:contain;background:var(--background);border-radius:var(--radius)}

/* Flash messages */
.flash{max-width:1100px;margin:14px auto;padding:12px 16px;border:1px solid;border-radius:10px;font-size:.9rem}
.flash.success{color:var(--success);border-color:color-mix(in srgb,var(--success) 45%,var(--border));background:color-mix(in srgb,var(--success) 5%,var(--surface))}
.flash.danger{color:#ff9b9b;border-color:color-mix(in srgb,var(--danger) 45%,var(--border));background:color-mix(in srgb,var(--danger) 5%,var(--surface))}
.flash ul{margin:6px 0}

/* Theme switcher */
.theme-switcher{display:flex;gap:4px}

/* Misc */
.file-row{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin:.75rem 0}
.file-row form{margin:0}
.chart-table{margin-top:12px;font-size:.82rem}
.chart-table th,.chart-table td{padding:6px 10px}

/* ================================================================
   SCROLL REVEAL — fade-up on enter
   ================================================================ */
.reveal-init{opacity:0;transform:translateY(22px) scale(.99)}
.reveal-init.is-visible{opacity:1;transform:none;transition:opacity .65s cubic-bezier(.16,1,.3,1),transform .65s cubic-bezier(.16,1,.3,1)}

/* ================================================================
   RESPONSIVE — tablet (1024px)
   ================================================================ */
@media(max-width:1024px){
  .site-header nav{display:none;position:absolute;left:16px;right:16px;top:68px;padding:18px;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);flex-direction:column}
  .site-header nav.open{display:flex}
  .nav-toggle{display:block}
  .hero-grid{grid-template-columns:1fr}
  .terminal-card{transform:none}
  .workflow{grid-template-columns:1fr}
  .workflow li{text-align:left;display:flex;align-items:center;gap:16px}
  .workflow li span{margin:0;flex-shrink:0}
  .workflow li:not(:last-child)::after{content:"↓";left:23px;top:auto;bottom:-10px;right:auto}
  .demo-slots{grid-template-columns:repeat(5,1fr)}
  .preview-grid,.chart-grid,.breakdown-grid,.theme-editor{grid-template-columns:1fr}
  .benefit-grid,.testimonial-grid,.media-grid{grid-template-columns:repeat(2,1fr)}
  .principle-callout .container{grid-template-columns:70px 1fr}
  .principle-callout ul{grid-column:2}
  .app-shell{padding-left:0}
  .sidebar{transform:translateX(-102%);transition:transform .25s ease}
  .sidebar.open{transform:translateX(0)}
  .sidebar-toggle{display:block}
  .theme-preview{position:static}
}

/* ================================================================
   RESPONSIVE — mobile (720px)
   ================================================================ */
@media(max-width:720px){
  .container{width:min(calc(100% - 20px),var(--container))}
  .header-actions .button.ghost{display:none}
  .header-inner{gap:10px}
  .hero{min-height:auto}
  .section{padding:48px 0}
  .principles-row{grid-template-columns:repeat(2,1fr)}
  .principles-row span:nth-child(3){border-left:0;border-top:1px solid var(--border)}
  .principles-row span:nth-child(4){border-top:1px solid var(--border)}
  .demo-slots{grid-template-columns:repeat(2,1fr)}
  .demo-controls{align-items:stretch;flex-direction:column}
  .benefit-grid,.testimonial-grid,.media-grid,.detail-grid,.settings-grid,.form-grid{grid-template-columns:1fr}
  .form-grid h2,.form-grid .span-2,.detail-grid .span-2{grid-column:1}
  .feature-card{grid-template-columns:54px 1fr;padding:20px}
  .feature-icon{width:50px;height:50px}
  .principle-callout .container{grid-template-columns:1fr}
  .principle-callout ul{grid-column:1}
  .target-icon{display:none}
  .disclaimer .container{display:block}
  .footer-grid{grid-template-columns:1fr}
  .app-main{padding:14px 10px}
  .app-topbar{padding:0 10px;height:50px;font-size:.84rem}
  .hide-mobile{display:none}
  .page-head{align-items:stretch;flex-direction:column}
  .page-head h1{font-size:1.5rem}
  .page-head>.button-row,.page-head>.button{align-self:flex-start}
  .score-grid{grid-template-columns:repeat(2,1fr)}
  .responsive-table{min-width:0}
  .responsive-table thead{position:absolute;clip:rect(0 0 0 0)}
  .responsive-table tbody,.responsive-table tr,.responsive-table td{display:block;width:100%}
  .responsive-table tr{padding:10px;border-bottom:1px solid var(--border)}
  .responsive-table td{display:flex;justify-content:space-between;gap:20px;border:0;padding:6px}
  .responsive-table td::before{content:attr(data-label);color:var(--muted);font-size:.74rem;text-transform:uppercase}
  .terminal-kpis{grid-template-columns:1fr}
  .kpi-grid .wide{grid-column:1}
  .chart-card{padding:12px}
  .auth-links{flex-direction:column;gap:8px}
  .disclaimer-note{padding:0 12px}
  .display-number{font-size:4rem}
}

/* Mobile trade cards */
.trade-cards{display:none}
@media(max-width:720px){
  .journal-table{display:none}
  .trade-cards{display:grid;gap:12px}
  .trade-cards .panel{padding:14px}
  .trade-cards dl{display:grid;grid-template-columns:1fr 1fr;gap:8px}
  .trade-cards dl div{display:block}
  .trade-cards dt{color:var(--muted);font-size:.7rem;text-transform:uppercase}
  .trade-cards dd{margin:0}
  .filter-bar{align-items:stretch}
  .filter-bar label,.filter-bar .grow{min-width:100%}
  .tc-chart{width:100%!important;min-height:220px}
  .chart-table{display:block;overflow-x:auto}
}

/* ================================================================
   REDUCED MOTION
   ================================================================ */
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
  .hero::after{animation:none}
}
html[data-motion="always"] *,html[data-motion="always"] *::before,html[data-motion="always"] *::after{animation-duration:.01ms!important;transition-duration:.01ms!important}

/* Touch devices — disable tilt */
@media(pointer:coarse){
  .tilt-card{transform:none!important}
  .tilt-card::before{display:none}
}

/* ================================================================
   ADMIN — extra density overrides for Chrome 100% zoom
   ================================================================ */
.admin-shell .page-head{margin-bottom:16px}
.admin-shell .page-head h1{font-size:clamp(1.4rem,3vw,2rem)}
.admin-shell .page-head .eyebrow{font-size:.68rem;margin-bottom:4px}
.admin-shell .panel{padding:clamp(14px,2vw,22px);margin-bottom:14px}
.admin-shell .form-grid{gap:12px}
.admin-shell .form-grid h2{font-size:1rem;padding-top:6px}
.admin-shell label{font-size:.82rem;gap:4px}
.admin-shell input,
.admin-shell select,
.admin-shell textarea{min-height:38px;padding:8px 10px;font-size:.88rem}
.admin-shell .button{min-height:38px;padding:8px 14px;font-size:.86rem}
.admin-shell .button.small{min-height:30px;padding:4px 8px;font-size:.8rem}
.admin-shell .section-list{gap:10px}
.admin-shell .section-list pre{max-height:240px;font-size:.78rem;padding:10px}
.admin-shell .section-row{gap:12px;flex-wrap:wrap}
.admin-shell .button-row{gap:6px}
.admin-shell table{min-width:680px;font-size:.84rem}
.admin-shell th,
.admin-shell td{padding:8px 10px}
.admin-shell .kpi-grid{gap:12px}
.admin-shell .kpi-grid article{padding:14px}
.admin-shell .kpi-grid strong{font-size:1.4rem}
.admin-shell .media-grid{grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:14px}
.admin-shell .theme-editor{grid-template-columns:minmax(0,1.4fr) minmax(240px,.6fr);gap:14px}
.admin-shell .color-input input[type=color]{height:38px}
.admin-shell .danger-zone{padding:10px}
.admin-shell .flash{font-size:.86rem;padding:10px 14px}
/* Live performance feed */
.performance-feed-section{position:relative;overflow:hidden;padding:clamp(64px,7vw,100px) 0;background:radial-gradient(circle at 50% 0%,color-mix(in srgb,var(--primary) 12%,transparent),transparent 38%),var(--background)}
.performance-feed-heading{max-width:720px;margin:0 auto 30px;text-align:center}
.performance-feed-heading h2{margin:8px 0 10px;font-size:clamp(1.9rem,4vw,3rem)}
.performance-feed-heading p{margin:0;color:var(--muted)}
.performance-board{position:relative;overflow:hidden;border:1px solid color-mix(in srgb,var(--border) 75%,transparent);border-radius:20px;background:linear-gradient(145deg,color-mix(in srgb,var(--surface) 92%,black),color-mix(in srgb,var(--background) 96%,black));box-shadow:0 24px 80px rgba(0,0,0,.38),inset 0 1px 0 rgba(255,255,255,.04)}
.performance-board::before{content:"";position:absolute;inset:0;z-index:3;pointer-events:none;border-radius:inherit;background:linear-gradient(to bottom,var(--background),transparent 13%,transparent 86%,var(--background))}
.performance-board-header,.performance-feed-row{display:grid;grid-template-columns:minmax(155px,1.4fr) minmax(120px,1fr) minmax(105px,.8fr) minmax(115px,.95fr) minmax(100px,.8fr) minmax(120px,.95fr) minmax(120px,.95fr);gap:14px;align-items:center}
.performance-board-header{position:relative;z-index:5;padding:14px 20px;border-bottom:1px solid color-mix(in srgb,var(--border) 65%,transparent);background:color-mix(in srgb,var(--surface) 96%,black)}
.performance-board-header span{color:var(--muted);font-size:.67rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase}
.performance-feed-window{position:relative;z-index:2;height:390px;overflow:hidden}
.performance-feed-track{will-change:transform;animation:performanceFeedScroll 55s linear infinite}
.performance-feed-window:hover .performance-feed-track{animation-play-state:paused}
.performance-feed-list{display:block}
.performance-feed-row{min-height:65px;padding:10px 20px;border-bottom:1px solid color-mix(in srgb,var(--border) 38%,transparent);color:color-mix(in srgb,var(--text) 78%,transparent);font-size:.82rem;transition:background 180ms ease,transform 180ms ease,border-color 180ms ease}
.performance-feed-row:hover{z-index:2;border-color:color-mix(in srgb,var(--primary) 45%,transparent);background:color-mix(in srgb,var(--primary) 8%,transparent);transform:translateX(4px)}
.performance-trader{display:flex;gap:10px;align-items:center;min-width:0}
.performance-trader strong{overflow:hidden;color:var(--text);text-overflow:ellipsis;white-space:nowrap}
.performance-status-dot{display:inline-block;flex:0 0 auto;width:7px;height:7px;border-radius:50%;background:var(--success);box-shadow:0 0 12px color-mix(in srgb,var(--success) 85%,transparent)}
.performance-positive{color:var(--success);font-weight:750}
.performance-negative{color:var(--danger);font-weight:750}
.performance-board-footer{position:relative;z-index:5;display:flex;justify-content:space-between;gap:20px;padding:11px 20px;border-top:1px solid color-mix(in srgb,var(--border) 60%,transparent);background:color-mix(in srgb,var(--surface) 96%,black);color:var(--muted);font-size:.7rem}
.performance-board-footer span{display:flex;gap:8px;align-items:center}
.mobile-feed-label{display:none}
@keyframes performanceFeedScroll{from{transform:translateY(0)}to{transform:translateY(-50%)}}
@media(max-width:1050px){.performance-board{overflow-x:auto}.performance-board-header,.performance-feed-row{min-width:980px}}
@media(max-width:720px){
.performance-feed-section{padding:46px 0}
.performance-feed-section .container{width:100%;max-width:100%;padding-left:8px;padding-right:8px}
.performance-feed-heading{padding:0 10px;margin-bottom:20px}
.performance-feed-heading h2{font-size:clamp(1.65rem,7vw,2.2rem)}
.performance-board{width:100%;max-width:100%;overflow:hidden;border-radius:14px}
.performance-board-header,.performance-feed-row{display:grid;grid-template-columns:1.25fr .9fr .7fr .82fr .7fr .82fr .82fr;gap:3px;width:100%;min-width:0}
.performance-board-header{padding:10px 5px}
.performance-board-header span{min-width:0;overflow:hidden;font-size:.43rem;line-height:1.15;letter-spacing:.02em;text-align:center;text-overflow:ellipsis;white-space:normal}
.performance-board-header span:first-child{text-align:left}
.performance-feed-window{width:100%;min-width:0;height:324px;overflow:hidden}
.performance-feed-row{min-height:54px;padding:7px 5px;font-size:.55rem}
.performance-feed-row>div{display:flex;min-width:0;align-items:center;justify-content:center;overflow:hidden;line-height:1.15;text-align:center;text-overflow:ellipsis;white-space:nowrap}
.performance-feed-row>div:first-child{justify-content:flex-start;text-align:left}
.performance-trader{grid-column:auto;gap:4px;padding:0;border:0}
.performance-trader strong{max-width:100%;font-size:.57rem;font-weight:750}
.performance-status-dot{width:5px;height:5px}
.performance-positive,.performance-negative{display:flex;width:auto;padding:3px 2px;border-radius:5px;font-size:.51rem}
.performance-feed-row>div:nth-child(3) b{padding:3px 4px;border-radius:5px;font-size:.51rem}
.performance-feed-row>div:nth-child(5){font-size:.53rem}
.mobile-feed-label{display:none}
.performance-board-footer{width:100%;min-width:0;padding:8px 7px;font-size:.55rem}
}
@media(prefers-reduced-motion:reduce){.performance-feed-track{animation:none}.performance-feed-window{overflow-y:auto}}
.performance-board{border:1px solid color-mix(in srgb,var(--primary) 25%,var(--border));background:linear-gradient(145deg,color-mix(in srgb,var(--surface) 94%,#08101f),color-mix(in srgb,var(--background) 96%,#02040a));box-shadow:0 30px 90px rgba(0,0,0,.46),0 0 0 1px rgba(255,255,255,.025),inset 0 1px 0 rgba(255,255,255,.06)}
.performance-board-header{background:linear-gradient(90deg,color-mix(in srgb,var(--primary) 10%,var(--surface)),color-mix(in srgb,#8b5cf6 7%,var(--surface)));backdrop-filter:blur(18px)}
.performance-feed-row{position:relative;background:linear-gradient(90deg,rgba(255,255,255,.018),transparent);transition:transform .22s ease,background .22s ease,box-shadow .22s ease}
.performance-feed-row::before{content:"";position:absolute;left:0;top:10px;bottom:10px;width:2px;border-radius:10px;background:linear-gradient(to bottom,transparent,var(--primary),transparent);opacity:0;transition:opacity .22s ease}
.performance-feed-row:hover{background:linear-gradient(90deg,color-mix(in srgb,var(--primary) 11%,transparent),color-mix(in srgb,#8b5cf6 5%,transparent));box-shadow:inset 0 0 30px color-mix(in srgb,var(--primary) 6%,transparent);transform:translateX(3px)}
.performance-feed-row:hover::before{opacity:1}
.performance-trader strong{font-size:.84rem;font-weight:800;letter-spacing:.01em}
.performance-status-dot{width:8px;height:8px;animation:performancePulse 1.8s ease-in-out infinite}
.performance-feed-row>div:nth-child(3) b{display:inline-flex;align-items:center;padding:5px 10px;border:1px solid color-mix(in srgb,var(--primary) 32%,transparent);border-radius:999px;background:color-mix(in srgb,var(--primary) 11%,transparent);color:color-mix(in srgb,var(--primary) 72%,white);font-size:.72rem}
.performance-feed-row>div:nth-child(5){font-weight:800;color:color-mix(in srgb,var(--text) 90%,var(--primary))}
.performance-positive{display:inline-flex;align-items:center;width:max-content;padding:5px 9px;border:1px solid color-mix(in srgb,var(--success) 26%,transparent);border-radius:999px;background:color-mix(in srgb,var(--success) 9%,transparent);box-shadow:inset 0 0 12px color-mix(in srgb,var(--success) 5%,transparent)}
.performance-negative{display:inline-flex;align-items:center;width:max-content;padding:5px 9px;border:1px solid color-mix(in srgb,var(--danger) 28%,transparent);border-radius:999px;background:color-mix(in srgb,var(--danger) 9%,transparent);box-shadow:inset 0 0 12px color-mix(in srgb,var(--danger) 5%,transparent)}
.performance-board-footer{background:linear-gradient(90deg,color-mix(in srgb,var(--surface) 96%,black),color-mix(in srgb,var(--primary) 6%,var(--surface)));backdrop-filter:blur(15px)}
@keyframes performancePulse{0%,100%{opacity:.6;transform:scale(.85);box-shadow:0 0 7px color-mix(in srgb,var(--success) 60%,transparent)}50%{opacity:1;transform:scale(1.15);box-shadow:0 0 16px color-mix(in srgb,var(--success) 95%,transparent)}}
@media(max-width:480px){
.performance-board-header,.performance-feed-row{grid-template-columns:1.28fr .82fr .68fr .78fr .68fr .78fr .78fr;gap:2px}
.performance-board-header{padding-left:3px;padding-right:3px}
.performance-feed-row{padding-left:3px;padding-right:3px;font-size:.5rem}
.performance-board-header span{font-size:.39rem}
.performance-trader strong{font-size:.52rem}
.performance-positive,.performance-negative,.performance-feed-row>div:nth-child(3) b{font-size:.46rem;padding:2px}

}
.country-short{display:none}
@media(max-width:720px){
.country-full{display:none}
.country-short{display:inline}
}
/* Mobile performance feed final size and dot fix */
@media(max-width:720px){
.performance-feed-section .container{padding-left:4px;padding-right:4px}
.performance-board-header,.performance-feed-row{grid-template-columns:1.42fr .76fr .68fr .78fr .66fr .78fr .78fr;gap:1px}
.performance-board-header{padding:10px 3px}
.performance-board-header span{font-size:.5rem;line-height:1.1;letter-spacing:0}
.performance-board-header span:first-child{padding-left:4px}
.performance-feed-row{min-height:56px;padding:7px 3px;font-size:.66rem}
.performance-feed-row>div{font-size:.66rem;line-height:1.1}
.performance-feed-row>div:first-child{padding-left:3px}
.performance-trader{display:flex!important;gap:5px!important;align-items:center!important;justify-content:flex-start!important;overflow:visible!important}
.performance-trader strong{max-width:calc(100% - 11px);overflow:hidden;font-size:.67rem;font-weight:800;text-overflow:ellipsis;white-space:nowrap}
.performance-status-dot{display:inline-block!important;flex:0 0 6px!important;width:6px!important;height:6px!important;min-width:6px!important;border-radius:50%;background:#48df61!important;box-shadow:0 0 8px rgba(72,223,97,.9)!important}
.performance-positive,.performance-negative{display:flex;width:auto;padding:3px 1px;font-size:.61rem;line-height:1;border-radius:4px}
.performance-feed-row>div:nth-child(3) b{padding:3px 2px;font-size:.61rem;line-height:1;border-radius:4px}
.performance-feed-row>div:nth-child(5){font-size:.63rem}
.country-short{font-size:.65rem;font-weight:700}
.performance-board-footer{padding:8px 6px;font-size:.64rem}
}
/* Mobile performance table balanced column spacing */
@media(max-width:720px){

.performance-board-header,
.performance-feed-row{
    grid-template-columns:
        1.38fr  /* Trader */
        .72fr   /* Country */
        .68fr   /* Current Cycle */
        .86fr   /* Cycle Gain */
        .68fr   /* Total Cycles */
        .92fr   /* Total Gain */
        .92fr;  /* Total Loss */

    column-gap:4px;
    width:100%;
    min-width:0;
}

.performance-board-header{
    padding:10px 6px;
}

.performance-board-header span{
    padding:0 2px;
    text-align:center;
}

.performance-board-header span:first-child{
    padding-left:5px;
    text-align:left;
}

.performance-feed-row{
    padding:8px 6px;
}

.performance-feed-row>div{
    min-width:0;
    padding:0 2px;
    overflow:hidden;
    text-align:center;
    text-overflow:ellipsis;
    white-space:nowrap;
}

.performance-feed-row>div:first-child{
    padding-left:4px;
    padding-right:3px;
    text-align:left;
}

.performance-trader{
    display:flex!important;
    align-items:center!important;
    justify-content:flex-start!important;
    gap:5px!important;
}

.performance-trader strong{
    min-width:0;
    max-width:calc(100% - 11px);
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
}

.performance-feed-row>div:nth-child(2){
    padding-left:1px;
    padding-right:3px;
}

.performance-feed-row>div:nth-child(3){
    padding-left:2px;
    padding-right:3px;
}

.performance-feed-row>div:nth-child(4){
    padding-left:3px;
    padding-right:4px;
}

.performance-feed-row>div:nth-child(5){
    padding-left:3px;
    padding-right:4px;
}

.performance-feed-row>div:nth-child(6){
    padding-left:4px;
    padding-right:5px;
}

.performance-feed-row>div:nth-child(7){
    padding-left:5px;
    padding-right:2px;
}

.performance-positive,
.performance-negative{
    width:100%;
    max-width:100%;
    justify-content:center;
    box-sizing:border-box;
    padding:4px 2px;
}

.performance-feed-row>div:nth-child(3) b{
    width:auto;
    max-width:100%;
    box-sizing:border-box;
}

}
/* Exact mobile performance layout with separator dots */
@media(max-width:720px){

.performance-feed-section .container{
    width:100%;
    max-width:100%;
    padding-left:6px;
    padding-right:6px;
}

.performance-board{
    width:100%;
    max-width:100%;
    overflow:hidden;
}

/* Header columns */
.performance-board-header{
    display:grid;
    grid-template-columns:
        1.45fr
        .72fr
        .82fr
        1fr
        .78fr
        1fr
        1fr;
    column-gap:2px;
    width:100%;
    min-width:0;
    padding:11px 6px;
    box-sizing:border-box;
}

.performance-board-header span{
    display:flex;
    min-width:0;
    align-items:center;
    justify-content:center;
    overflow:visible;
    padding:0 1px;
    font-size:.48rem;
    line-height:1.1;
    letter-spacing:0;
    text-align:center;
    text-overflow:clip;
    white-space:normal;
    word-break:normal;
}

.performance-board-header span:first-child{
    justify-content:flex-start;
    padding-left:4px;
    text-align:left;
}

/* Data rows */
.performance-feed-row{
    display:grid;
    grid-template-columns:
        1.45fr
        .72fr
        .82fr
        1fr
        .78fr
        1fr
        1fr;
    column-gap:2px;
    width:100%;
    min-width:0;
    min-height:66px;
    padding:8px 6px;
    box-sizing:border-box;
    font-size:.62rem;
}

.performance-feed-row>div{
    position:relative;
    display:flex;
    min-width:0;
    align-items:center;
    justify-content:center;
    overflow:visible;
    padding:0 3px;
    line-height:1.1;
    text-align:center;
    text-overflow:clip;
    white-space:nowrap;
}

/* Separator dots between every value */
.performance-feed-row>div:not(:last-child)::after{
    content:"•";
    position:absolute;
    top:50%;
    right:-3px;
    z-index:5;
    color:rgba(210,220,240,.78);
    font-size:.62rem;
    line-height:1;
    transform:translateY(-50%);
}

/* Trader column */
.performance-feed-row>div:first-child{
    justify-content:flex-start;
    padding-left:4px;
    padding-right:5px;
    text-align:left;
}

.performance-trader{
    display:flex!important;
    min-width:0;
    align-items:center!important;
    justify-content:flex-start!important;
    gap:6px!important;
    overflow:hidden!important;
}

.performance-trader strong{
    min-width:0;
    max-width:calc(100% - 13px);
    overflow:hidden;
    font-size:.66rem;
    font-weight:800;
    text-overflow:ellipsis;
    white-space:nowrap;
}

/* Green live dot */
.performance-status-dot{
    display:inline-block!important;
    flex:0 0 6px!important;
    width:6px!important;
    height:6px!important;
    min-width:6px!important;
    border-radius:50%;
    background:#35dc5a!important;
    box-shadow:0 0 8px rgba(53,220,90,.9)!important;
}

/* Country */
.performance-feed-row>div:nth-child(2){
    font-size:.64rem;
    font-weight:700;
}

/* Current cycle */
.performance-feed-row>div:nth-child(3) b{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    max-width:100%;
    padding:4px 5px;
    border-radius:5px;
    font-size:.61rem;
    line-height:1;
}

/* Cycle gain */
.performance-feed-row>div:nth-child(4){
    padding-left:5px;
    padding-right:5px;
}

/* Total cycles */
.performance-feed-row>div:nth-child(5){
    font-size:.64rem;
    font-weight:800;
}

/* Total gain and total loss */
.performance-feed-row>div:nth-child(6),
.performance-feed-row>div:nth-child(7){
    padding-left:5px;
    padding-right:5px;
}

.performance-positive,
.performance-negative{
    display:flex;
    width:100%;
    max-width:100%;
    align-items:center;
    justify-content:center;
    box-sizing:border-box;
    padding:4px 2px;
    border-radius:5px;
    font-size:.59rem;
    line-height:1;
    white-space:nowrap;
}

/* Hide mobile mini labels inside rows */
.mobile-feed-label{
    display:none!important;
}

/* Footer */
.performance-board-footer{
    width:100%;
    min-width:0;
    padding:9px 10px;
    box-sizing:border-box;
    font-size:.62rem;
}

}
/* ==================================================
   FINAL MOBILE PERFORMANCE TABLE FIX
   ================================================== */
@media (max-width:720px){

/* Section and board */
.performance-feed-section .container{
    width:100%!important;
    max-width:100%!important;
    padding-left:6px!important;
    padding-right:6px!important;
}

.performance-board{
    width:100%!important;
    max-width:100%!important;
    overflow:hidden!important;
    border-radius:15px!important;
}

/* Same columns for header and rows */
.performance-board-header,
.performance-feed-row{
    display:grid!important;
    grid-template-columns:
        minmax(0,1.70fr)  /* Trader */
        minmax(0,.60fr)   /* Country */
        minmax(0,.70fr)   /* Current cycle */
        minmax(0,.95fr)   /* Cycle gain */
        minmax(0,.62fr)   /* Total cycles */
        minmax(0,1.02fr)  /* Total gain */
        minmax(0,1.02fr)!important; /* Total loss */

    width:100%!important;
    min-width:0!important;
    column-gap:4px!important;
    box-sizing:border-box!important;
}

/* Header */
.performance-board-header{
    padding:11px 5px!important;
}

.performance-board-header span{
    display:flex!important;
    min-width:0!important;
    align-items:center!important;
    justify-content:center!important;
    overflow:visible!important;
    padding:0!important;
    font-size:.45rem!important;
    font-weight:800!important;
    line-height:1.08!important;
    letter-spacing:0!important;
    text-align:center!important;
    text-overflow:clip!important;
    white-space:normal!important;
    word-break:normal!important;
}

.performance-board-header span:first-child{
    justify-content:flex-start!important;
    padding-left:4px!important;
    text-align:left!important;
}

/* Feed area */
.performance-feed-window{
    width:100%!important;
    min-width:0!important;
    height:390px!important;
    overflow:hidden!important;
}

/* Rows */
.performance-feed-row{
    min-height:65px!important;
    padding:8px 5px!important;
    font-size:.60rem!important;
}

/* Reset all old separator pseudo-elements */
.performance-feed-row > div::before,
.performance-feed-row > div::after{
    content:none!important;
    display:none!important;
}

/* Every cell */
.performance-feed-row > div{
    position:relative!important;
    display:flex!important;
    min-width:0!important;
    align-items:center!important;
    justify-content:center!important;
    overflow:visible!important;
    padding:0 5px 0 1px!important;
    font-size:.60rem!important;
    line-height:1!important;
    text-align:center!important;
    text-overflow:clip!important;
    white-space:nowrap!important;
    box-sizing:border-box!important;
}

/* Stable separator dot between columns */
.performance-feed-row > div:not(:last-child){
    background-image:radial-gradient(
        circle,
        rgba(205,214,230,.90) 0,
        rgba(205,214,230,.90) 1.4px,
        transparent 1.6px
    )!important;
    background-position:right center!important;
    background-repeat:no-repeat!important;
    background-size:4px 4px!important;
}
/* Cycle Gain ke baad wala separator 8px right */
.performance-feed-row > div:nth-child(4){
    background-position:calc(100% + px) center!important;
}

/* Total Gain ke baad wala separator 3px right */
.performance-feed-row > div:nth-child(6){
    background-position:calc() center!important;
}
/* Trader cell */
.performance-feed-row > div:first-child{
    justify-content:flex-start!important;
    padding-left:4px!important;
    padding-right:7px!important;
    text-align:left!important;
}

.performance-trader{
    display:flex!important;
    min-width:0!important;
    width:100%!important;
    align-items:center!important;
    justify-content:flex-start!important;
    gap:5px!important;
    overflow:visible!important;
    padding:0!important;
    border:0!important;
}

/* Full trader name */
.performance-trader strong{
    display:block!important;
    min-width:0!important;
    max-width:none!important;
    overflow:visible!important;
    font-size:.61rem!important;
    font-weight:800!important;
    line-height:1!important;
    text-overflow:clip!important;
    white-space:nowrap!important;
}

/* Green live dot */
.performance-status-dot{
    display:inline-block!important;
    flex:0 0 6px!important;
    width:6px!important;
    height:6px!important;
    min-width:6px!important;
    border-radius:50%!important;
    background:#35dc5a!important;
    box-shadow:0 0 8px rgba(53,220,90,.95)!important;
}

/* Country */
.performance-feed-row > div:nth-child(2){
    padding-left:2px!important;
    padding-right:7px!important;
    font-size:.59rem!important;
    font-weight:700!important;
}

/* Current cycle */
.performance-feed-row > div:nth-child(3){
    padding-left:2px!important;
    padding-right:7px!important;
}

.performance-feed-row > div:nth-child(3) b{
    display:inline-flex!important;
    width:auto!important;
    max-width:100%!important;
    align-items:center!important;
    justify-content:center!important;
    padding:4px 4px!important;
    border-radius:5px!important;
    font-size:.58rem!important;
    line-height:1!important;
    box-sizing:border-box!important;
}

/* Cycle gain */
.performance-feed-row > div:nth-child(4){
    padding-left:3px!important;
    padding-right:8px!important;
}

/* Total cycles */
.performance-feed-row > div:nth-child(5){
    padding-left:2px!important;
    padding-right:8px!important;
    font-size:.61rem!important;
    font-weight:800!important;
}

/* Total gain */
.performance-feed-row > div:nth-child(6){
    padding-left:4px!important;
    padding-right:9px!important;
}

/* Total loss */
.performance-feed-row > div:nth-child(7){
    padding-left:5px!important;
    padding-right:2px!important;
}

/* Gain and loss badges */
.performance-positive,
.performance-negative{
    display:inline-flex!important;
    width:auto!important;
    max-width:100%!important;
    min-width:0!important;
    align-items:center!important;
    justify-content:center!important;
    margin:0!important;
    padding:4px 3px!important;
    border-radius:5px!important;
    font-size:.56rem!important;
    line-height:1!important;
    text-align:center!important;
    white-space:nowrap!important;
    box-sizing:border-box!important;
}

/* Do not show row labels */
.mobile-feed-label{
    display:none!important;
}

/* Use short country codes on mobile */
.country-full{
    display:none!important;
}

.country-short{
    display:inline!important;
    overflow:visible!important;
    font-size:.59rem!important;
    font-weight:700!important;
    text-overflow:clip!important;
    white-space:nowrap!important;
}

/* Footer */
.performance-board-footer{
    width:100%!important;
    min-width:0!important;
    padding:9px 10px!important;
    box-sizing:border-box!important;
    font-size:.61rem!important;
}

}
/* Hide Hero Terminal only on mobile */
@media (max-width:720px){

.hero-grid{
    grid-template-columns:1fr !important;
}

.hero-grid .terminal-card{
    display:none !important;
}

}
/* Desktop graph custom colors */
@media (min-width:721px){

/* 1st bar */
.equity-spark i:nth-child(1){
    background:linear-gradient(to top,#5f1111,#ff4b4b)!important;
}

/* 5th bar */
.equity-spark i:nth-child(5){
    background:linear-gradient(to top,#5f1111,#ff4b4b)!important;
}

/* 8th bar */
.equity-spark i:nth-child(8){
    background:linear-gradient(to top,#5f1111,#ff4b4b)!important;
}

}
/* Mobile header order: Logo | Get Started | Menu */
@media(max-width:720px){

.site-header .header-inner{
    display:flex!important;
    align-items:center!important;
    gap:10px!important;
}

.site-header .brand{
    flex:0 0 auto!important;
}

.site-header .header-actions{
    display:contents!important;
}

/* Get Started / Login button logo ke baad */
.site-header .header-actions .button{
    order:2!important;
    margin-left:auto!important;
    padding:12px 16px!important;
    white-space:nowrap!important;
}

/* Hamburger bilkul right side */
.site-header .nav-toggle{
    order:3!important;
    flex:0 0 auto!important;
    margin-left:0!important;
}

/* Navigation dropdown apni jagah */
.site-header #site-nav{
    order:4!important;
}

}
/* ==================================================
   FLOATING WHATSAPP WIDGET
   ================================================== */

.whatsapp-float{
    position:fixed;
    right:22px;
    bottom:22px;
    z-index:9999;
    display:flex;
    align-items:center;
    gap:12px;
    pointer-events:none;
}

.whatsapp-float-button{
    position:relative;
    display:grid;
    flex:0 0 58px;
    width:58px;
    height:58px;
    place-items:center;
    border:1px solid rgba(255,255,255,.18);
    border-radius:50%;
    background:linear-gradient(145deg,#38e675,#1bb855);
    color:#fff;
    box-shadow:
        0 15px 38px rgba(37,211,102,.38),
        inset 0 1px 0 rgba(255,255,255,.3);
    pointer-events:auto;
    transition:
        transform .22s ease,
        box-shadow .22s ease;
    animation:whatsappButtonPulse 2.2s ease-in-out infinite;
}

.whatsapp-float-button::before{
    content:"";
    position:absolute;
    inset:-7px;
    z-index:-1;
    border:1px solid rgba(37,211,102,.42);
    border-radius:50%;
    opacity:0;
    animation:whatsappRing 2.2s ease-out infinite;
}

.whatsapp-float-button:hover{
    color:#fff;
    transform:translateY(-3px) scale(1.05);
    box-shadow:
        0 20px 48px rgba(37,211,102,.48),
        inset 0 1px 0 rgba(255,255,255,.35);
}

.whatsapp-float-button svg{
    width:30px;
    height:30px;
}

.whatsapp-float-popup{
    display:flex;
    min-width:165px;
    flex-direction:column;
    padding:11px 14px;
    border:1px solid color-mix(in srgb,var(--border) 82%,transparent);
    border-radius:14px;
    background:
        linear-gradient(
            145deg,
            color-mix(in srgb,var(--surface) 95%,black),
            color-mix(in srgb,var(--background) 92%,black)
        );
    box-shadow:
        0 18px 45px rgba(0,0,0,.38),
        inset 0 1px 0 rgba(255,255,255,.05);
    opacity:0;
    pointer-events:none;
    transform:translateX(14px) scale(.96);
    animation:whatsappPopupCycle 5.5s ease-in-out infinite;
}

.whatsapp-float-popup::after{
    content:"";
    position:absolute;
    right:-6px;
    top:50%;
    width:11px;
    height:11px;
    border-top:1px solid color-mix(in srgb,var(--border) 82%,transparent);
    border-right:1px solid color-mix(in srgb,var(--border) 82%,transparent);
    background:color-mix(in srgb,var(--surface) 96%,black);
    transform:translateY(-50%) rotate(45deg);
}

.whatsapp-float-popup{
    position:relative;
}

.whatsapp-float-popup strong{
    color:var(--text);
    font-size:.86rem;
    font-weight:800;
    line-height:1.2;
}

.whatsapp-float-popup span{
    margin-top:3px;
    color:var(--muted);
    font-size:.72rem;
    line-height:1.25;
}

.whatsapp-float:hover .whatsapp-float-popup{
    opacity:1;
    transform:translateX(0) scale(1);
    animation-play-state:paused;
}

@keyframes whatsappButtonPulse{
    0%,100%{
        transform:scale(1);
    }

    50%{
        transform:scale(1.07);
    }
}

@keyframes whatsappRing{
    0%{
        opacity:.6;
        transform:scale(.82);
    }

    70%,100%{
        opacity:0;
        transform:scale(1.35);
    }
}

@keyframes whatsappPopupCycle{
    0%,10%{
        opacity:0;
        transform:translateX(14px) scale(.96);
    }

    18%,68%{
        opacity:1;
        transform:translateX(0) scale(1);
    }

    78%,100%{
        opacity:0;
        transform:translateX(14px) scale(.96);
    }
}

@media(max-width:720px){

    .whatsapp-float{
        right:12px;
        bottom:14px;
        gap:9px;
    }

    .whatsapp-float-button{
        flex-basis:52px;
        width:52px;
        height:52px;
    }

    .whatsapp-float-button svg{
        width:27px;
        height:27px;
    }

    .whatsapp-float-popup{
        min-width:145px;
        padding:9px 11px;
        border-radius:12px;
    }

    .whatsapp-float-popup strong{
        font-size:.78rem;
    }

    .whatsapp-float-popup span{
        font-size:.66rem;
    }

}

@media(prefers-reduced-motion:reduce){

    .whatsapp-float-button,
    .whatsapp-float-button::before,
    .whatsapp-float-popup{
        animation:none!important;
    }

    .whatsapp-float-popup{
        opacity:1;
        transform:none;
    }

}
/* ==================================================
   CLIENT REVIEWS — ANIMATED SPLIT EXPERIENCE
   ================================================== */

.client-reviews-section{
    position:relative;
    overflow:hidden;
    isolation:isolate;
    padding-block:clamp(72px,8vw,120px);
}

.client-reviews-section::before{
    content:"";
    position:absolute;
    width:620px;
    height:620px;
    top:-270px;
    left:-250px;
    z-index:-2;
    border-radius:50%;
    background:
        radial-gradient(
            circle,
            color-mix(in srgb,var(--primary) 18%,transparent),
            transparent 66%
        );
    filter:blur(10px);
    animation:reviewsOrbLeft 14s ease-in-out infinite alternate;
}

.client-reviews-section::after{
    content:"";
    position:absolute;
    width:680px;
    height:680px;
    right:-320px;
    bottom:-340px;
    z-index:-2;
    border-radius:50%;
    background:
        radial-gradient(
            circle,
            rgba(37,211,102,.14),
            transparent 67%
        );
    filter:blur(15px);
    animation:reviewsOrbRight 16s ease-in-out infinite alternate;
}

.client-reviews-heading{
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    gap:30px;
    margin-bottom:30px;
}

.client-reviews-heading h2{
    max-width:760px;
    margin:.45rem 0 .7rem;
    font-size:clamp(2.2rem,5vw,4.7rem);
    line-height:.94;
    letter-spacing:-.055em;
}

.client-reviews-heading p{
    max-width:720px;
    margin:0;
    color:var(--muted);
    font-size:clamp(.95rem,1.4vw,1.08rem);
}

.reviews-live-pill{
    display:inline-flex;
    flex:0 0 auto;
    align-items:center;
    gap:9px;
    padding:10px 14px;
    border:1px solid rgba(37,211,102,.22);
    border-radius:999px;
    background:rgba(37,211,102,.07);
    color:#62e990;
    font-size:.76rem;
    font-weight:800;
    letter-spacing:.04em;
    text-transform:uppercase;
    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.05),
        0 12px 30px rgba(0,0,0,.2);
}

.reviews-live-pill i{
    width:8px;
    height:8px;
    border-radius:50%;
    background:#36df72;
    box-shadow:0 0 0 0 rgba(54,223,114,.48);
    animation:reviewsLivePulse 1.8s ease-out infinite;
}

.client-reviews-layout{
    position:relative;
    display:grid;
    grid-template-columns:minmax(0,1fr) minmax(0,1fr);
    gap:22px;
}

.client-reviews-layout::before{
    content:"";
    position:absolute;
    top:8%;
    bottom:8%;
    left:50%;
    width:1px;
    z-index:2;
    background:
        linear-gradient(
            to bottom,
            transparent,
            color-mix(in srgb,var(--primary) 45%,transparent),
            rgba(37,211,102,.38),
            transparent
        );
    transform:translateX(-50%);
    box-shadow:
        0 0 22px color-mix(in srgb,var(--primary) 28%,transparent);
}

.reviews-panel{
    position:relative;
    min-width:0;
    overflow:hidden;
    border:
        1px solid
        color-mix(in srgb,var(--border) 88%,transparent);
    border-radius:28px;
    background:
        linear-gradient(
            145deg,
            color-mix(in srgb,var(--surface) 96%,transparent),
            color-mix(in srgb,var(--background) 90%,black)
        );
    box-shadow:
        0 28px 75px rgba(0,0,0,.34),
        inset 0 1px 0 rgba(255,255,255,.045);
    transform:translateZ(0);
}

.reviews-panel::before{
    content:"";
    position:absolute;
    inset:0;
    z-index:0;
    pointer-events:none;
    background:
        linear-gradient(
            115deg,
            transparent 20%,
            rgba(255,255,255,.035) 42%,
            transparent 62%
        );
    transform:translateX(-130%);
    animation:reviewsPanelShine 8s ease-in-out infinite;
}

.reviews-panel::after{
    content:"";
    position:absolute;
    inset:0;
    z-index:5;
    pointer-events:none;
    border-radius:inherit;
    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.05),
        inset 0 -55px 70px
        color-mix(in srgb,var(--background) 62%,transparent);
}

.reviews-panel-header{
    position:relative;
    z-index:6;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:20px;
    padding:24px 25px 20px;
    border-bottom:
        1px solid
        color-mix(in srgb,var(--border) 72%,transparent);
    background:
        linear-gradient(
            to bottom,
            color-mix(in srgb,var(--surface) 98%,transparent),
            color-mix(in srgb,var(--surface) 90%,transparent)
        );
    backdrop-filter:blur(18px);
}

.reviews-panel-header h3{
    margin:6px 0 0;
    font-size:clamp(1.15rem,2vw,1.55rem);
    letter-spacing:-.025em;
}

.reviews-panel-badge{
    color:color-mix(in srgb,var(--primary) 88%,white);
    font-size:.66rem;
    font-weight:900;
    letter-spacing:.14em;
    text-transform:uppercase;
}

.reviews-count{
    display:grid;
    width:42px;
    height:42px;
    place-items:center;
    border:1px solid
        color-mix(in srgb,var(--primary) 28%,var(--border));
    border-radius:14px;
    background:
        color-mix(in srgb,var(--primary) 8%,var(--surface));
    color:var(--text);
    font-size:.78rem;
    font-weight:900;
}

.reviews-scroll-window,
.image-reviews-window{
    position:relative;
    height:680px;
    overflow:hidden;
    padding:20px;
}

.reviews-scroll-window::before,
.image-reviews-window::before,
.reviews-scroll-window::after,
.image-reviews-window::after{
    content:"";
    position:absolute;
    left:0;
    right:0;
    z-index:5;
    height:90px;
    pointer-events:none;
}

.reviews-scroll-window::before,
.image-reviews-window::before{
    top:0;
    background:
        linear-gradient(
            to bottom,
            color-mix(in srgb,var(--surface) 98%,transparent),
            transparent
        );
}

.reviews-scroll-window::after,
.image-reviews-window::after{
    bottom:0;
    background:
        linear-gradient(
            to top,
            color-mix(in srgb,var(--background) 96%,transparent),
            transparent
        );
}

.text-reviews-track{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:14px;
    animation:clientTextReviewsScroll 46s linear infinite;
    will-change:transform;
}

.image-reviews-track{
    display:flex;
    flex-direction:column;
    gap:17px;
    animation:clientImageReviewsScroll 54s linear infinite;
    will-change:transform;
}

.reviews-panel:hover .text-reviews-track,
.reviews-panel:hover .image-reviews-track{
    animation-play-state:paused;
}

.client-text-review{
    position:relative;
    display:flex;
    min-height:205px;
    flex-direction:column;
    justify-content:space-between;
    overflow:hidden;
    padding:19px;
    border:
        1px solid
        color-mix(in srgb,var(--border) 88%,transparent);
    border-radius:20px;
    background:
        linear-gradient(
            145deg,
            color-mix(in srgb,var(--surface) 95%,black),
            color-mix(in srgb,var(--background) 88%,black)
        );
    box-shadow:
        0 14px 35px rgba(0,0,0,.22),
        inset 0 1px 0 rgba(255,255,255,.035);
    transition:
        transform .35s cubic-bezier(.2,.8,.2,1),
        border-color .35s ease,
        box-shadow .35s ease;
}

.client-text-review::before{
    content:"";
    position:absolute;
    width:110px;
    height:110px;
    top:-62px;
    right:-52px;
    border-radius:50%;
    background:
        radial-gradient(
            circle,
            color-mix(in srgb,var(--primary) 18%,transparent),
            transparent 70%
        );
    transition:transform .5s ease;
}

.client-text-review:hover{
    z-index:3;
    border-color:
        color-mix(in srgb,var(--primary) 55%,var(--border));
    transform:translateY(-6px) rotateX(2deg) rotateY(-2deg);
    box-shadow:
        0 24px 48px rgba(0,0,0,.32),
        0 0 0 1px
        color-mix(in srgb,var(--primary) 9%,transparent);
}

.client-text-review:hover::before{
    transform:scale(1.45);
}

.review-stars{
    display:flex;
    gap:3px;
    color:#f6c954;
    font-size:.72rem;
    text-shadow:0 0 14px rgba(246,201,84,.3);
}

.client-text-review blockquote{
    margin:15px 0 20px;
    color:var(--text);
    font-size:.85rem;
    line-height:1.64;
}

.client-text-review footer{
    display:flex;
    align-items:center;
    gap:10px;
}

.client-text-review footer img,
.review-avatar{
    display:grid;
    width:38px;
    height:38px;
    flex:0 0 38px;
    place-items:center;
    border:
        1px solid
        color-mix(in srgb,var(--primary) 34%,var(--border));
    border-radius:13px;
    background:
        linear-gradient(
            145deg,
            color-mix(in srgb,var(--primary) 22%,var(--surface)),
            color-mix(in srgb,var(--surface) 92%,black)
        );
    object-fit:cover;
    color:var(--text);
    font-size:.78rem;
    font-weight:900;
}

.client-text-review footer div{
    display:flex;
    min-width:0;
    flex-direction:column;
}

.client-text-review footer strong{
    overflow:hidden;
    color:var(--text);
    font-size:.77rem;
    text-overflow:ellipsis;
    white-space:nowrap;
}

.client-text-review footer small{
    overflow:hidden;
    margin-top:2px;
    color:var(--muted);
    font-size:.65rem;
    text-overflow:ellipsis;
    white-space:nowrap;
}

.client-image-review{
    position:relative;
    width:100%;
    max-width:var(--review-image-width);
    margin-inline:auto;
    overflow:hidden;
    border:
        1px solid
        color-mix(in srgb,var(--border) 86%,transparent);
    border-radius:22px;
    background:
        color-mix(in srgb,var(--surface) 95%,black);
    box-shadow:
        0 18px 45px rgba(0,0,0,.3),
        inset 0 1px 0 rgba(255,255,255,.045);
    transition:
        transform .38s cubic-bezier(.2,.8,.2,1),
        border-color .38s ease,
        box-shadow .38s ease;
}

.client-image-review:hover{
    z-index:4;
    border-color:rgba(37,211,102,.5);
    transform:translateY(-6px) scale(1.012);
    box-shadow:
        0 30px 62px rgba(0,0,0,.42),
        0 0 38px rgba(37,211,102,.1);
}

.client-image-review img,
.review-image-placeholder{
    display:block;
    width:100%;
    height:min(
        var(--review-image-height),
        430px
    );
}

.client-image-review img{
    background:#fff;
}

.review-image-placeholder{
    position:relative;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:10px;
    overflow:hidden;
    padding:30px;
    background:
        linear-gradient(
            135deg,
            color-mix(in srgb,var(--primary) 9%,var(--surface)),
            color-mix(in srgb,#25d366 7%,var(--background))
        );
    text-align:center;
}

.review-image-placeholder::before{
    content:"";
    position:absolute;
    width:220px;
    height:220px;
    border:
        1px solid
        color-mix(in srgb,var(--primary) 18%,transparent);
    border-radius:50%;
    animation:reviewPlaceholderOrbit 9s linear infinite;
}

.review-image-placeholder::after{
    content:"";
    position:absolute;
    width:120px;
    height:120px;
    border:
        1px dashed
        rgba(37,211,102,.27);
    border-radius:34px;
    animation:reviewPlaceholderOrbitReverse 7s linear infinite;
}

.review-image-placeholder span,
.review-image-placeholder strong,
.review-image-placeholder small{
    position:relative;
    z-index:2;
}

.review-image-placeholder span{
    color:#62e990;
    font-size:.6rem;
    font-weight:900;
    letter-spacing:.17em;
}

.review-image-placeholder strong{
    max-width:280px;
    font-size:1.15rem;
}

.review-image-placeholder small{
    color:var(--muted);
    font-size:.72rem;
}

.review-image-caption{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:16px;
    padding:13px 16px;
    border-top:
        1px solid
        color-mix(in srgb,var(--border) 72%,transparent);
}

.review-image-caption span{
    overflow:hidden;
    color:var(--text);
    font-size:.73rem;
    font-weight:750;
    text-overflow:ellipsis;
    white-space:nowrap;
}

.review-image-caption i{
    display:grid;
    width:27px;
    height:27px;
    flex:0 0 27px;
    place-items:center;
    border-radius:9px;
    background:rgba(37,211,102,.09);
    color:#62e990;
    font-style:normal;
    transition:transform .25s ease;
}

.client-image-review:hover .review-image-caption i{
    transform:translate(2px,-2px);
}

@keyframes clientTextReviewsScroll{
    from{
        transform:translate3d(0,0,0);
    }

    to{
        transform:translate3d(0,-50%,0);
    }
}

@keyframes clientImageReviewsScroll{
    from{
        transform:translate3d(0,0,0);
    }

    to{
        transform:translate3d(0,-50%,0);
    }
}

@keyframes reviewsLivePulse{
    0%{
        box-shadow:0 0 0 0 rgba(54,223,114,.5);
    }

    70%{
        box-shadow:0 0 0 10px rgba(54,223,114,0);
    }

    100%{
        box-shadow:0 0 0 0 rgba(54,223,114,0);
    }
}

@keyframes reviewsPanelShine{
    0%,62%{
        transform:translateX(-130%);
    }

    82%,100%{
        transform:translateX(130%);
    }
}

@keyframes reviewsOrbLeft{
    from{
        transform:translate3d(0,0,0) scale(.9);
    }

    to{
        transform:translate3d(105px,70px,0) scale(1.12);
    }
}

@keyframes reviewsOrbRight{
    from{
        transform:translate3d(0,0,0) scale(.92);
    }

    to{
        transform:translate3d(-100px,-60px,0) scale(1.1);
    }
}

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

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

/* Tablet */
@media(max-width:1050px){

    .client-reviews-layout{
        grid-template-columns:1fr;
    }

    .client-reviews-layout::before{
        display:none;
    }

    .reviews-scroll-window,
    .image-reviews-window{
        height:620px;
    }

}

/* Mobile */
@media(max-width:720px){

    .client-reviews-section{
        padding-block:64px;
    }

    .client-reviews-heading{
        align-items:flex-start;
        flex-direction:column;
        margin-bottom:20px;
    }

    .client-reviews-heading h2{
        font-size:clamp(2.35rem,12vw,3.7rem);
    }

    .client-reviews-layout{
        gap:16px;
    }

    .reviews-panel{
        border-radius:21px;
    }

    .reviews-panel-header{
        padding:18px 17px 15px;
    }

    .reviews-count{
        width:36px;
        height:36px;
        border-radius:11px;
    }

    .reviews-scroll-window,
    .image-reviews-window{
        height:570px;
        padding:13px;
    }

    .text-reviews-track{
        grid-template-columns:1fr;
        gap:11px;
        animation-duration:58s;
    }

    .image-reviews-track{
        gap:13px;
        animation-duration:62s;
    }

    .client-text-review{
        min-height:170px;
        padding:16px;
        border-radius:17px;
    }

    .client-text-review blockquote{
        margin:11px 0 15px;
        font-size:.82rem;
    }

    .client-image-review{
        max-width:100%;
        border-radius:18px;
    }

    .client-image-review img,
    .review-image-placeholder{
        height:min(
            var(--review-image-height),
            360px
        );
    }

}

/* Very small mobile */
@media(max-width:390px){

    .reviews-panel-header h3{
        font-size:1rem;
    }

    .reviews-panel-badge{
        font-size:.57rem;
    }

    .reviews-scroll-window,
    .image-reviews-window{
        height:535px;
    }

}

/* Accessibility */
@media(prefers-reduced-motion:reduce){

    .text-reviews-track,
    .image-reviews-track,
    .reviews-panel::before,
    .reviews-live-pill i,
    .client-reviews-section::before,
    .client-reviews-section::after,
    .review-image-placeholder::before,
    .review-image-placeholder::after{
        animation:none!important;
    }

}
.review-rating{
    position:relative;
    display:inline-flex;
    align-items:center;
    width:max-content;
    gap:8px;
    line-height:1;
}

.review-rating-track,
.review-rating-fill{
    display:block;
    font-size:.85rem;
    letter-spacing:2px;
    white-space:nowrap;
}

.review-rating-track{
    color:rgba(255,255,255,.18);
}

.review-rating-fill{
    position:absolute;
    top:0;
    left:0;
    width:var(--rating-width);
    overflow:hidden;
    color:#f8c94c;
    text-shadow:0 0 8px rgba(248,201,76,.3);
}

.review-rating strong{
    margin-left:3px;
    color:#f8d76e;
    font-size:.7rem;
}
.verified-badge{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    width:15px;
    height:15px;
    margin-right:6px;
    vertical-align:middle;
}

.verified-badge svg{
    display:block;
}
.verified-badge{
    display:inline-flex;
    margin-left:5px;
    vertical-align:middle;
}

.verified-badge svg{
    width:15px;
    height:15px;
    display:block;
}
.verified-badge{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    margin-left:6px;
    vertical-align:middle;
}

.client-text-review strong{
    display:flex;
    align-items:center;
    gap:6px;
}
/* =========================================================
   TWO-WAY IMAGE REVIEW COLUMNS
   ========================================================= */

.image-reviews-window{
    position:relative;
    height:620px;
    overflow:hidden;
    border-radius:18px;
}

.image-reviews-window::before,
.image-reviews-window::after{
    content:"";
    position:absolute;
    left:0;
    right:0;
    z-index:5;
    height:70px;
    pointer-events:none;
}

.image-reviews-window::before{
    top:0;
    background:linear-gradient(
        to bottom,
        var(--surface, #0b1018),
        transparent
    );
}

.image-reviews-window::after{
    bottom:0;
    background:linear-gradient(
        to top,
        var(--surface, #0b1018),
        transparent
    );
}

.image-reviews-columns{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:12px;
    height:100%;
}

.image-review-column{
    position:relative;
    min-width:0;
    height:100%;
    overflow:hidden;
}

.image-review-column-track{
    display:flex;
    flex-direction:column;
    gap:12px;
    will-change:transform;
}

/* Left column: neeche se upar */
.image-review-column-up .image-review-column-track{
    animation:imageReviewMoveUp 24s linear infinite;
}

/* Right column: upar se neeche */
.image-review-column-down .image-review-column-track{
    animation:imageReviewMoveDown 27s linear infinite;
}

.image-review-column:hover .image-review-column-track{
    animation-play-state:paused;
}

@keyframes imageReviewMoveUp{
    from{
        transform:translateY(0);
    }

    to{
        transform:translateY(calc(-50% - 6px));
    }
}

@keyframes imageReviewMoveDown{
    from{
        transform:translateY(calc(-50% - 6px));
    }

    to{
        transform:translateY(0);
    }
}

/* Review card */
.image-reviews-columns .client-image-review{
    position:relative;
    width:100%;
    min-width:0;
    flex:none;
    overflow:hidden;
    border:1px solid rgba(148,163,184,.18);
    border-radius:16px;
    background:rgba(9,14,23,.88);
}

/*
 * Mobile screenshot:
 * narrow portrait card.
 */
.image-reviews-columns .review-image-portrait{
    max-width:100%;
}

/*
 * Desktop screenshot:
 * automatically landscape frame.
 */
.image-reviews-columns .review-image-landscape{
    grid-column:auto;
}

/* Image frame */
.image-reviews-columns .review-image-frame{
    position:relative;
    display:flex;
    align-items:center;
    justify-content:center;
    width:100%;
    overflow:hidden;
    background:#05080e;
}

/* Portrait/mobile screenshots */
.image-reviews-columns
.review-image-portrait
.review-image-frame{
    aspect-ratio:9/16;
    width:100%;
    max-height:none;
}

/* Desktop/landscape screenshots */
.image-reviews-columns
.review-image-landscape
.review-image-frame{
    aspect-ratio:16/9;
    min-height:145px;
}

/* Full screenshot ko cut na karo */
.image-reviews-columns .review-image-frame img{
    display:block;
    width:100%;
    height:100%;
    object-position:center;
}

/* Caption */
.image-reviews-columns .review-image-caption{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:8px;
    padding:10px 12px;
}

.image-reviews-columns .review-image-caption span{
    min-width:0;
    overflow:hidden;
    font-size:12px;
    line-height:1.35;
    white-space:nowrap;
    text-overflow:ellipsis;
}

.image-reviews-columns .review-image-caption i{
    flex:none;
    font-style:normal;
}

/* Placeholder */
.image-reviews-columns .review-image-placeholder{
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:6px;
    width:100%;
    height:100%;
    padding:20px 10px;
    text-align:center;
}

/* Mobile */
@media (max-width:767px){

    .image-reviews-window{
        height:520px;
    }

    .image-reviews-columns{
        gap:8px;
    }

    .image-review-column-track{
        gap:8px;
    }

    .image-reviews-columns
    .review-image-portrait
    .review-image-frame{
        aspect-ratio:9/16;
        max-height:320px;
    }

    .image-reviews-columns
    .review-image-landscape
    .review-image-frame{
        aspect-ratio:16/10;
        min-height:95px;
    }

    .image-reviews-columns .client-image-review{
        border-radius:12px;
    }

    .image-reviews-columns .review-image-caption{
        padding:7px 8px;
    }

    .image-reviews-columns .review-image-caption span{
        font-size:10px;
    }
}

/* Motion accessibility */
@media (prefers-reduced-motion:reduce){

    .image-review-column-track{
        animation:none !important;
    }
}
/* =========================================================
   MOBILE REVIEW SCREENSHOT DISPLAY FIX
   ========================================================= */

/* Mobile/portrait screenshot card */
.image-reviews-columns .review-image-portrait{
    width:100%;
    max-width:100%;
}

/* Portrait frame ko mobile screen jaisi shape do */
.image-reviews-columns
.review-image-portrait
.review-image-frame{
    position:relative;
    width:100%;
    aspect-ratio:9 / 16;
    max-height:none;
    overflow:hidden;
    background:#070b12;
}

/*
 * Mobile screenshot ko chhota contain karne ke bajaye
 * frame ke andar zoom karke clearly show karo.
 */
.image-reviews-columns
.review-image-portrait
.review-image-frame img{
    display:block;
    width:100%;
    height:100%;
    padding:0 !important;
    object-fit:cover !important;
    object-position:center top;
}

/* Desktop screenshot apni landscape shape mein rahe */
.image-reviews-columns
.review-image-landscape
.review-image-frame{
    width:100%;
    aspect-ratio:16 / 9;
    overflow:hidden;
    background:#070b12;
}

.image-reviews-columns
.review-image-landscape
.review-image-frame img{
    display:block;
    width:100%;
    height:100%;
    padding:0 !important;
    object-fit:contain;
    object-position:center;
}

/* Mobile device par cards ko readable size do */
@media (max-width:767px){

    .image-reviews-columns
    .review-image-portrait
    .review-image-frame{
        aspect-ratio:9 / 16;
        min-height:260px;
    }

    .image-reviews-columns
    .review-image-landscape
    .review-image-frame{
        aspect-ratio:16 / 10;
        min-height:100px;
    }
}
/* =========================================================
   TRADER CYCLE SYSTEM
   ========================================================= */

.trader-cycle-section{
    position:relative;
    overflow:hidden;
    isolation:isolate;
}

.trader-cycle-section::before{
    content:"";
    position:absolute;
    inset:-20%;
    z-index:-2;

    background:
        radial-gradient(circle,#00d4ff22 0%,transparent 28%),
        radial-gradient(circle,#7b61ff22 0%,transparent 30%),
        radial-gradient(circle,#00ff9d18 0%,transparent 25%);

    background-size:
        380px 380px,
        320px 320px,
        260px 260px;

    animation:cycleBackgroundFloat 18s linear infinite;
    filter:blur(35px);
    opacity:.85;
}

.trader-cycle-section::after{
    content:"";
    position:absolute;
    inset:0;
    z-index:-1;

    background:
        linear-gradient(
            120deg,
            transparent,
            rgba(0,212,255,.04),
            transparent
        );

    animation:cycleGlowMove 8s ease-in-out infinite;
}

@keyframes cycleBackgroundFloat{

    0%{
        transform:translate(-6%,-4%) rotate(0deg);
    }

    50%{
        transform:translate(8%,6%) rotate(180deg);
    }

    100%{
        transform:translate(-6%,-4%) rotate(360deg);
    }

}

@keyframes cycleGlowMove{

    0%,100%{
        opacity:.25;
    }

    50%{
        opacity:.9;
    }

}
.trader-cycle-heading{
    max-width:850px;
    margin:0 auto 28px;
    text-align:center;
}

.trader-cycle-heading h2{
    margin:6px 0 12px;
    font-size:clamp(2rem,5vw,4.4rem);
    line-height:1;
    letter-spacing:-.045em;
}

.trader-cycle-heading p{
    margin:0;
    color:var(--muted);
}

.trader-cycle-system{
    position:relative;
    padding:20px;
    border:1px solid var(--border);
    border-radius:var(--card-radius);
    background:
        radial-gradient(
            circle at 50% 0%,
            color-mix(
                in srgb,
                var(--primary) 10%,
                transparent
            ),
            transparent 45%
        ),
        color-mix(
            in srgb,
            var(--surface) 94%,
            transparent
        );
    overflow:hidden;
}

.trader-cycle-message{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:16px;
    width:min(100%,760px);
    margin:0 auto 20px;
    padding:9px 18px;
    background:rgba(10,16,28,.85);

border:1px solid rgba(90,130,255,.28);

color:#dbe8ff;

font-weight:700;

box-shadow:
0 0 22px
rgba(0,140,255,.12);
    text-align:center;
}

.trader-cycle-message span{
    flex:none;
    font-size:1.25rem;
}
.trader-cycle-message strong{
    color:#ffffff;
    letter-spacing:.02em;
}
.trader-selector-label{
    margin-bottom:10px;
    color:var(--muted);
    font-size:.78rem;
    font-weight:800;
    letter-spacing:.08em;
    text-transform:uppercase;
}
.trader-cycle-message span{
    flex:none;
    font-size:1.25rem;
    color:#5ecbff;
    font-weight:700;
}
.trader-selector{
    display:flex;
    gap:10px;
    padding-bottom:8px;
    overflow-x:auto;
    overscroll-behavior-inline:contain;
    scrollbar-width:thin;
    scroll-snap-type:x proximity;
}

.trader-selector-button{
    display:flex;
    flex:0 0 105px;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    min-height:88px;
    padding:10px 8px;
    border:1px solid var(--border);
    border-radius:12px;
    background:color-mix(
        in srgb,
        var(--background) 88%,
        transparent
    );
    color:var(--text);
    cursor:pointer;
    scroll-snap-align:start;
    transition:
        transform .25s ease,
        border-color .25s ease,
        box-shadow .25s ease,
        background .25s ease;
}

.trader-selector-button:hover{
    transform:translateY(-3px);
    border-color:color-mix(
        in srgb,
        var(--primary) 60%,
        var(--border)
    );
}

.trader-selector-button.active{
    border-color:var(--primary);
    background:color-mix(
        in srgb,
        var(--primary) 11%,
        var(--background)
    );
    box-shadow:
        0 0 0 1px
        color-mix(
            in srgb,
            var(--primary) 30%,
            transparent
        ),
        0 0 25px
        color-mix(
            in srgb,
            var(--primary) 18%,
            transparent
        );
}

.trader-selector-icon{
    display:grid;
    place-items:center;
    width:27px;
    height:27px;
    margin-bottom:5px;
   color:#ffffff;
opacity:.95;
font-size:1.35rem;
filter:
    drop-shadow(0 0 8px rgba(255,255,255,.25));
    font-size:1.25rem;
}

.trader-selector-name{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:4px;
    max-width:100%;
    font-size:.88rem;
    font-weight:800;
}

.trader-selector-button small{
    display:block;
    max-width:100%;
    margin-top:3px;
    overflow:hidden;
    color:var(--muted);
    font-size:.58rem;
    white-space:nowrap;
    text-overflow:ellipsis;
}

.trader-verified-badge{
    display:inline-grid;
    flex:none;
    place-items:center;
    width:14px;
    height:14px;
    border-radius:50%;
    background:#1688ff;
    color:#fff;
    font-size:9px;
    font-weight:900;
    line-height:1;
    box-shadow:0 0 12px rgba(22,136,255,.35);
}

.trader-cycle-panels{
    margin-top:24px;
}

.trader-cycle-panel{
    animation:traderPanelReveal .35s ease;
}

.trader-cycle-panel[hidden]{
    display:none !important;
}

@keyframes traderPanelReveal{
    from{
        opacity:0;
        transform:translateY(10px);
    }

    to{
        opacity:1;
        transform:translateY(0);
    }
}

.cycle-trades-grid{
    display:grid;
    grid-template-columns:repeat(10,minmax(90px,1fr));
    gap:10px;
}

.cycle-trade-card{
    position:relative;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    min-height:172px;
    padding:16px 8px;
    overflow:hidden;
    border:1px solid var(--border);
    border-radius:12px;
    background:var(--background);
    text-align:center;
    transition:
        transform .25s ease,
        box-shadow .25s ease;
}

.cycle-trade-card:hover{
    transform:translateY(-4px);
}

.cycle-trade-card > span{
    color:var(--muted);
    font-size:.72rem;
}

.cycle-trade-card > strong{
    margin:6px 0 11px;
    font-size:2rem;
    line-height:1;
}

.cycle-trade-card > b{
    display:block;
    width:100%;
    padding:7px 5px;
    border:1px solid currentColor;
    border-radius:7px;
    font-size:.72rem;
}

.cycle-trade-card > small{
    margin-top:12px;
    color:var(--muted);
    font-size:.68rem;
}

.cycle-trade-card.loss{
    border-color:color-mix(
        in srgb,
        var(--danger) 78%,
        var(--border)
    );
    box-shadow:
        inset 0 0 24px
        color-mix(
            in srgb,
            var(--danger) 5%,
            transparent
        );
}

.cycle-trade-card.loss > b{
    color:var(--danger);
    background:color-mix(
        in srgb,
        var(--danger) 14%,
        transparent
    );
}

.cycle-trade-card.profit{
    border-color:color-mix(
        in srgb,
        var(--success) 70%,
        var(--border)
    );
    box-shadow:
        inset 0 0 24px
        color-mix(
            in srgb,
            var(--success) 7%,
            transparent
        );
}

.cycle-trade-card.profit > b{
    color:var(--success);
    background:color-mix(
        in srgb,
        var(--success) 14%,
        transparent
    );
}

.cycle-trade-card.strong-profit{
    box-shadow:
        0 0 22px
        color-mix(
            in srgb,
            var(--success) 22%,
            transparent
        ),
        inset 0 0 25px
        color-mix(
            in srgb,
            var(--success) 8%,
            transparent
        );
}

.cycle-trade-card.breakeven > b{
    color:var(--muted);
}

.trader-cycle-stats{
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:10px;
    margin-top:22px;
}

.trader-cycle-stats article{
    display:flex;
    align-items:center;
    min-width:0;
    gap:11px;
    padding:14px;
    border:1px solid var(--border);
    border-radius:12px;
    background:color-mix(
        in srgb,
        var(--background) 80%,
        transparent
    );
}

.cycle-stat-icon{
    display:grid;
    flex:0 0 45px;
    place-items:center;
    width:45px;
    height:45px;
    border:1px solid
        color-mix(
            in srgb,
            var(--primary) 45%,
            var(--border)
        );
    border-radius:50%;
    background:color-mix(
        in srgb,
        var(--primary) 15%,
        transparent
    );
    color:var(--primary);
    font-size:1.3rem;
}

.cycle-stat-icon.profit-icon{
    border-color:color-mix(
        in srgb,
        var(--success) 50%,
        var(--border)
    );
    background:color-mix(
        in srgb,
        var(--success) 14%,
        transparent
    );
    color:var(--success);
}

.cycle-stat-icon.loss-icon{
    border-color:color-mix(
        in srgb,
        var(--danger) 55%,
        var(--border)
    );
    background:color-mix(
        in srgb,
        var(--danger) 14%,
        transparent
    );
    color:var(--danger);
}

.cycle-stat-icon.trophy-icon{
    color:#b96cff;
}

.trader-cycle-stats article > div{
    min-width:0;
}

.trader-cycle-stats small{
    display:block;
    margin-bottom:4px;
    overflow:hidden;
    color:var(--muted);
    font-size:.62rem;
    letter-spacing:.04em;
    text-transform:uppercase;
    white-space:nowrap;
    text-overflow:ellipsis;
}

.trader-cycle-stats strong{
    display:block;
    overflow:hidden;
    font-size:clamp(.9rem,1.4vw,1.25rem);
    white-space:nowrap;
    text-overflow:ellipsis;
}

/* Tablet */
@media (max-width:1100px){

    .cycle-trades-grid{
        display:flex;
        overflow-x:auto;
        scroll-snap-type:x mandatory;
        padding-bottom:10px;
    }

    .cycle-trade-card{
        flex:0 0 112px;
        scroll-snap-align:start;
    }

    .trader-cycle-stats{
        grid-template-columns:repeat(3,minmax(0,1fr));
    }
}

/* Mobile */
@media (max-width:767px){

    .trader-cycle-system{
        padding:12px;
        border-radius:16px;
    }

    .trader-cycle-heading{
        margin-bottom:18px;
    }

    .trader-cycle-message{
        gap:7px;
        padding:8px 10px;
        border-radius:12px;
        font-size:.72rem;
    }

    .trader-cycle-message span{
        font-size:.85rem;
    }

    .trader-selector{
        margin-right:-12px;
        padding-right:12px;
    }

    .trader-selector-button{
        flex-basis:86px;
        min-height:78px;
        padding:8px 6px;
    }

    .trader-selector-name{
        font-size:.76rem;
    }

    .cycle-trades-grid{
        gap:8px;
    }

    .cycle-trade-card{
        flex-basis:96px;
        min-height:150px;
        padding:12px 7px;
    }

    .cycle-trade-card > strong{
        font-size:1.65rem;
    }

    .trader-cycle-stats{
        grid-template-columns:repeat(2,minmax(0,1fr));
        gap:8px;
    }

    .trader-cycle-stats article{
        gap:8px;
        padding:10px;
    }

    .cycle-stat-icon{
        flex-basis:36px;
        width:36px;
        height:36px;
        font-size:1rem;
    }

    .trader-cycle-stats small{
        font-size:.52rem;
    }

    .trader-cycle-stats strong{
        font-size:.82rem;
    }
}

@media (max-width:390px){

    .trader-cycle-stats article{
        display:block;
    }

    .cycle-stat-icon{
        margin-bottom:7px;
    }
}

@media (prefers-reduced-motion:reduce){

    .trader-cycle-panel{
        animation:none;
    }

    .trader-selector-button,
    .cycle-trade-card{
        transition:none;
    }
}
/* =========================================================
   PREMIUM HOME HERO
   ========================================================= */

.premium-home-hero{
    position:relative;
    min-height:calc(100vh - 72px);
    isolation:isolate;
    overflow:hidden;
    background:
        radial-gradient(
            circle at 78% 35%,
            rgba(28,91,255,.11),
            transparent 34%
        ),
        radial-gradient(
            circle at 18% 70%,
            rgba(0,219,255,.06),
            transparent 35%
        );
}

.premium-home-hero::before{
    content:"";
    position:absolute;
    width:460px;
    height:460px;
    top:8%;
    right:5%;
    z-index:-1;
    border-radius:50%;
    background:
        radial-gradient(
            circle,
            rgba(34,111,255,.16),
            transparent 68%
        );
    filter:blur(28px);
    animation:premiumHeroGlow 8s ease-in-out infinite;
}

.premium-home-hero::after{
    content:"";
    position:absolute;
    inset:0;
    z-index:-2;
    pointer-events:none;
    opacity:.18;
    background-image:
        linear-gradient(
            rgba(255,255,255,.025) 1px,
            transparent 1px
        ),
        linear-gradient(
            90deg,
            rgba(255,255,255,.025) 1px,
            transparent 1px
        );
    background-size:46px 46px;
    mask-image:
        linear-gradient(
            to bottom,
            rgba(0,0,0,.8),
            transparent 95%
        );
}

@keyframes premiumHeroGlow{
    0%,
    100%{
        transform:
            translate3d(0,0,0)
            scale(1);
        opacity:.65;
    }

    50%{
        transform:
            translate3d(-30px,20px,0)
            scale(1.12);
        opacity:1;
    }
}

.premium-hero-grid{
    grid-template-columns:
        minmax(0,1.08fr)
        minmax(390px,.92fr);
    gap:clamp(42px,7vw,90px);
}

.premium-hero-content{
    position:relative;
    z-index:2;
}

.premium-hero-eyebrow{
    margin-bottom:17px;
    color:#7184bd;
    font-size:.69rem;
    font-weight:800;
    letter-spacing:.18em;
}

.premium-hero-title{
    max-width:760px;
    margin:0;
    background:none!important;
    color:inherit!important;
    font-size:clamp(2.65rem,5.2vw,5.2rem);
    line-height:.96;
    letter-spacing:-.05em;
}

.premium-hero-title span{
    display:block;
}

.premium-title-white{
    color:#f8fafc;
}

.premium-title-gradient{
    margin-top:5px;
    background:
        linear-gradient(
            105deg,
            #55e9ff 0%,
            #2095ff 55%,
            #3574ff 100%
        );
    -webkit-background-clip:text;
    background-clip:text;
    color:transparent;
}

.premium-title-gradient::after{
    content:"";
    display:block;
    width:280px;
    max-width:52%;
    height:3px;
    margin-top:18px;
    border-radius:99px;
    background:
        linear-gradient(
            90deg,
            #3fe6ff,
            #247cff,
            transparent
        );
    animation:premiumUnderline 3s ease-in-out infinite;
}

@keyframes premiumUnderline{
    0%,
    100%{
        transform:scaleX(.72);
        transform-origin:left;
        opacity:.55;
    }

    50%{
        transform:scaleX(1);
        transform-origin:left;
        opacity:1;
    }
}

.premium-hero-description{
    max-width:690px;
    margin-top:28px;
    color:#9da8bb;
    font-size:clamp(.96rem,1.4vw,1.08rem);
    line-height:1.75;
}

.premium-hero-buttons{
    display:flex;
    flex-wrap:wrap;
    gap:12px;
    margin-top:26px;
}

.premium-join-button{
    min-width:120px;
    justify-content:center;
    background:
        linear-gradient(
            135deg,
            #31a8ff,
            #2862e8
        );
    border-color:transparent;
    box-shadow:
        0 13px 32px rgba(38,100,234,.28);
}

.premium-join-button:hover{
    transform:translateY(-3px);
    box-shadow:
        0 18px 38px rgba(38,100,234,.4);
}

.premium-trader-button{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:10px;
    min-width:220px;
    background:
        linear-gradient(
            145deg,
            rgba(18,25,39,.92),
            rgba(8,13,23,.92)
        );
    border-color:rgba(114,140,190,.25);
    color:#f8fafc;
}

.premium-trader-button span{
    transition:transform .3s ease;
}

.premium-trader-button:hover span{
    transform:translate(4px,-3px);
}

.premium-hero-disclaimer{
    margin-top:16px;
    color:#8590a3;
}

/* =========================================================
   PREMIUM DESKTOP CYCLE TERMINAL
   ========================================================= */

.premium-cycle-terminal{
    position:relative;
    padding:22px;
    overflow:hidden;
    border:
        1px solid rgba(90,115,170,.18);
    background:
        linear-gradient(
            145deg,
            rgba(14,21,35,.97),
            rgba(5,10,18,.98)
        );
    box-shadow:
        0 35px 90px rgba(0,0,0,.5),
        0 0 60px rgba(30,98,255,.1);
    animation:
        premiumTerminalFloat 6s
        ease-in-out infinite;
}

.premium-cycle-terminal::after{
    content:"";
    position:absolute;
    width:180px;
    height:180px;
    top:-90px;
    right:-70px;
    border-radius:50%;
    background:
        rgba(30,107,255,.13);
    filter:blur(35px);
    pointer-events:none;
}

@keyframes premiumTerminalFloat{
    0%,
    100%{
        transform:
            perspective(1100px)
            rotateY(-3deg)
            translateY(0);
    }

    50%{
        transform:
            perspective(1100px)
            rotateY(-1deg)
            translateY(-8px);
    }
}

.premium-cycle-terminal .terminal-kpis div{
    min-width:0;
    padding:16px 13px;
    background:
        linear-gradient(
            145deg,
            rgba(26,35,53,.85),
            rgba(13,20,34,.85)
        );
}

.premium-cycle-terminal .terminal-kpis strong{
    display:block;
    margin-top:6px;
    font-size:clamp(.92rem,1.4vw,1.3rem);
    line-height:1.2;
}

.premium-cycle-terminal
.terminal-kpis
div:nth-child(2)
strong{
    font-size:clamp(.76rem,1.1vw,1rem);
    white-space:nowrap;
}

.premium-equity-spark{
    position:relative;
    height:180px;
    padding:20px;
    background:
        linear-gradient(
            180deg,
            rgba(7,17,28,.4),
            rgba(0,115,63,.08)
        );
    box-shadow:
        inset 0 0 30px
        rgba(0,0,0,.25);
}

.premium-equity-spark i{
    position:relative;
    overflow:hidden;
}

.premium-equity-spark i::after{
    content:"";
    position:absolute;
    inset:0;
    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(255,255,255,.2),
            transparent
        );
    transform:translateX(-120%);
    animation:
        premiumBarShine 3s ease-in-out infinite;
}

@keyframes premiumBarShine{
    0%,
    45%{
        transform:translateX(-120%);
    }

    70%,
    100%{
        transform:translateX(120%);
    }
}

.premium-equity-spark
.cycle-profit-bar{
    background:
        linear-gradient(
            to top,
            #087c31,
            #48df35
        )!important;
    box-shadow:
        0 0 16px rgba(72,223,53,.16);
}

.premium-equity-spark
.cycle-loss-bar{
    background:
        linear-gradient(
            to top,
            #8b1212,
            #ff4747
        )!important;
    box-shadow:
        0 0 16px rgba(255,71,71,.15);
}

.premium-terminal-status{
    display:flex;
    align-items:center;
    margin-top:14px;
    color:#99a5b9;
}

/* =========================================================
   PREMIUM 3D PRINCIPLE CARDS
   ========================================================= */

.premium-principles{
    position:relative;
    padding:18px 0 38px;
    border:0;
    background:
        linear-gradient(
            180deg,
            rgba(5,9,16,.95),
            rgba(8,13,23,.95)
        );
}

.premium-principles-grid{
    display:grid;
    grid-template-columns:
        repeat(4,minmax(0,1fr));
    gap:14px;
}

.premium-principle-card{
    position:relative;
    min-height:190px;
    padding:22px;
    overflow:hidden;
    border:
        1px solid rgba(100,124,168,.2);
    border-radius:18px;
    background:
        linear-gradient(
            145deg,
            rgba(18,25,40,.96),
            rgba(7,12,21,.98)
        );
    transform:
        perspective(900px)
        rotateX(0)
        rotateY(0)
        translateY(0);
    transform-style:preserve-3d;
    box-shadow:
        0 15px 38px rgba(0,0,0,.25);
    transition:
        transform .45s cubic-bezier(.16,1,.3,1),
        border-color .4s ease,
        box-shadow .4s ease;
}

.premium-principle-card:hover{
    transform:
        perspective(900px)
        rotateX(4deg)
        rotateY(-4deg)
        translateY(-9px);
    border-color:
        rgba(50,139,255,.5);
    box-shadow:
        0 28px 58px rgba(0,0,0,.4),
        0 0 30px rgba(39,121,255,.12);
}

.premium-principle-glow{
    position:absolute;
    width:140px;
    height:140px;
    top:-80px;
    right:-60px;
    border-radius:50%;
    background:
        rgba(40,127,255,.15);
    filter:blur(20px);
    transition:
        transform .5s ease,
        opacity .5s ease;
}

.premium-principle-card:hover
.premium-principle-glow{
    transform:scale(1.45);
    opacity:1;
}

.premium-principle-icon{
    position:relative;
    z-index:2;
    display:grid;
    place-items:center;
    width:46px;
    height:46px;
    margin-bottom:19px;
    border:
        1px solid rgba(60,145,255,.32);
    border-radius:13px;
    background:
        linear-gradient(
            145deg,
            rgba(30,112,255,.2),
            rgba(21,48,112,.08)
        );
    color:#4ebdff;
    font-size:1.35rem;
    box-shadow:
        inset 0 0 15px
        rgba(36,125,255,.12);
    transform:translateZ(24px);
}

.premium-principle-card h3{
    position:relative;
    z-index:2;
    margin:0 0 10px;
    color:#f8fafc;
    font-size:1rem;
    letter-spacing:.05em;
    text-transform:uppercase;
    transform:translateZ(18px);
}

.premium-principle-card p{
    position:relative;
    z-index:2;
    margin:0;
    color:#8f9caf;
    font-size:.8rem;
    line-height:1.55;
    transform:translateZ(12px);
}

.premium-principle-line{
    position:absolute;
    left:22px;
    right:22px;
    bottom:14px;
    height:2px;
    border-radius:10px;
    background:
        linear-gradient(
            90deg,
            #38c9ff,
            #316dff,
            transparent
        );
    transform:scaleX(.25);
    transform-origin:left;
    opacity:.45;
    transition:
        transform .45s ease,
        opacity .45s ease;
}

.premium-principle-card:hover
.premium-principle-line{
    transform:scaleX(1);
    opacity:1;
}

/* =========================================================
   TABLET
   ========================================================= */

@media(max-width:1024px){

    .premium-hero-grid{
        grid-template-columns:1fr;
    }

    .premium-cycle-terminal{
        max-width:720px;
        margin:0 auto;
    }

    .premium-principles-grid{
        grid-template-columns:
            repeat(2,minmax(0,1fr));
    }
}

/* =========================================================
   MOBILE
   ========================================================= */

@media(max-width:720px){

    .premium-home-hero{
        min-height:auto;
    }

    .premium-hero-grid{
        display:block;
    }

    .premium-cycle-terminal{
        display:none!important;
    }

    .premium-hero-content{
        padding:10px 0 20px;
    }

    .premium-hero-eyebrow{
        margin-bottom:13px;
        font-size:.57rem;
        line-height:1.5;
    }

    .premium-hero-title{
        font-size:clamp(2.15rem,10.5vw,3.05rem);
        line-height:1.02;
    }

    .premium-title-gradient{
        margin-top:8px;
    }

    .premium-title-gradient::after{
        width:180px;
        max-width:62%;
        margin-top:14px;
    }

    .premium-hero-description{
        margin-top:22px;
        font-size:.94rem;
        line-height:1.7;
    }

    .premium-hero-buttons{
        display:grid;
        grid-template-columns:
            minmax(0,.8fr)
            minmax(0,1.45fr);
        gap:9px;
        width:100%;
    }

    .premium-hero-buttons .button{
        min-width:0;
        padding:
            12px 10px;
        font-size:.78rem;
        white-space:nowrap;
    }

    .premium-trader-button{
        gap:5px;
    }

    .premium-hero-disclaimer{
        margin-top:12px;
        font-size:.76rem;
        line-height:1.55;
    }

    .premium-principles{
        padding:10px 0 30px;
    }

    .premium-principles-grid{
        grid-template-columns:
            repeat(2,minmax(0,1fr));
        gap:9px;
    }

    .premium-principle-card{
        min-height:168px;
        padding:15px 13px;
        border-radius:14px;
    }

    .premium-principle-card:hover{
        transform:translateY(-4px);
    }

    .premium-principle-icon{
        width:38px;
        height:38px;
        margin-bottom:13px;
        border-radius:10px;
        font-size:1.05rem;
    }

    .premium-principle-card h3{
        margin-bottom:8px;
        font-size:.72rem;
        line-height:1.35;
    }

    .premium-principle-card p{
        font-size:.66rem;
        line-height:1.45;
    }

    .premium-principle-line{
        left:13px;
        right:13px;
        bottom:10px;
    }
}

@media(max-width:380px){

    .premium-hero-buttons{
        grid-template-columns:1fr;
    }

    .premium-principles-grid{
        grid-template-columns:1fr;
    }

    .premium-principle-card{
        min-height:150px;
    }
}

@media(prefers-reduced-motion:reduce){

    .premium-home-hero::before,
    .premium-cycle-terminal,
    .premium-title-gradient::after,
    .premium-equity-spark i::after{
        animation:none!important;
    }

    .premium-principle-card{
        transition:none;
    }
}
/* =========================================================
   PREMIUM CYCLE RESULT / BUY NOW SECTION
   ========================================================= */

.premium-result-section{
    position:relative;
    isolation:isolate;
    overflow:hidden;
    padding:
        clamp(72px,9vw,130px)
        0;
    background:
        radial-gradient(
            circle at 15% 20%,
            rgba(32,112,255,.12),
            transparent 34%
        ),
        radial-gradient(
            circle at 90% 70%,
            rgba(34,220,177,.08),
            transparent 32%
        ),
        linear-gradient(
            180deg,
            #060b13,
            #080e18
        );
}

.premium-result-section::before{
    content:"";
    position:absolute;
    inset:0;
    z-index:-3;
    opacity:.17;
    pointer-events:none;
    background-image:
        linear-gradient(
            rgba(255,255,255,.035) 1px,
            transparent 1px
        ),
        linear-gradient(
            90deg,
            rgba(255,255,255,.035) 1px,
            transparent 1px
        );
    background-size:48px 48px;
    mask-image:
        linear-gradient(
            to bottom,
            transparent,
            #000 18%,
            #000 82%,
            transparent
        );
}

.premium-result-orb{
    position:absolute;
    z-index:-2;
    border-radius:50%;
    pointer-events:none;
    filter:blur(18px);
}

.premium-result-orb-one{
    width:360px;
    height:360px;
    top:-170px;
    right:7%;
    background:
        radial-gradient(
            circle,
            rgba(40,117,255,.22),
            transparent 68%
        );
    animation:
        premiumResultOrbOne
        11s ease-in-out infinite;
}

.premium-result-orb-two{
    width:310px;
    height:310px;
    bottom:-170px;
    left:4%;
    background:
        radial-gradient(
            circle,
            rgba(44,225,172,.13),
            transparent 68%
        );
    animation:
        premiumResultOrbTwo
        13s ease-in-out infinite;
}

@keyframes premiumResultOrbOne{
    0%,
    100%{
        transform:translate3d(0,0,0) scale(1);
    }

    50%{
        transform:
            translate3d(-50px,35px,0)
            scale(1.18);
    }
}

@keyframes premiumResultOrbTwo{
    0%,
    100%{
        transform:translate3d(0,0,0) scale(1);
    }

    50%{
        transform:
            translate3d(55px,-30px,0)
            scale(1.15);
    }
}

.premium-result-layout{
    display:grid;
    grid-template-columns:
        minmax(0,1fr)
        minmax(390px,.9fr);
    align-items:center;
    gap:
        clamp(45px,7vw,100px);
}

.premium-result-content{
    position:relative;
    z-index:2;
}

.premium-result-eyebrow{
    display:flex;
    align-items:center;
    gap:10px;
    margin-bottom:18px;
    color:#6d90d9;
    font-size:.7rem;
    font-weight:800;
    letter-spacing:.18em;
}

.premium-result-eyebrow span{
    width:34px;
    height:2px;
    border-radius:20px;
    background:
        linear-gradient(
            90deg,
            #38d9ff,
            #3672ff
        );
    box-shadow:
        0 0 15px
        rgba(56,160,255,.45);
}

.premium-result-title{
    max-width:760px;
    margin:0;
    color:#f8fafc;
    font-size:
        clamp(2.4rem,5vw,5rem);
    line-height:.98;
    letter-spacing:-.052em;
}

.premium-result-title span{
    display:block;
    margin-top:7px;
    background:
        linear-gradient(
            105deg,
            #4de7ff,
            #2c89ff 56%,
            #526cff
        );
    -webkit-background-clip:text;
    background-clip:text;
    color:transparent;
}

.premium-result-description{
    max-width:690px;
    margin:27px 0 0;
    color:#96a3b7;
    font-size:
        clamp(.96rem,1.4vw,1.08rem);
    line-height:1.78;
}

.premium-result-highlights{
    display:grid;
    gap:11px;
    margin-top:28px;
}

.premium-result-highlights article{
    display:flex;
    align-items:center;
    gap:13px;
    padding:13px 15px;
    border:
        1px solid rgba(104,133,185,.16);
    border-radius:14px;
    background:
        linear-gradient(
            145deg,
            rgba(18,27,43,.72),
            rgba(8,14,24,.78)
        );
    transition:
        transform .3s ease,
        border-color .3s ease,
        background .3s ease;
}

.premium-result-highlights article:hover{
    transform:translateX(6px);
    border-color:
        rgba(56,144,255,.38);
    background:
        linear-gradient(
            145deg,
            rgba(24,38,61,.86),
            rgba(10,17,29,.88)
        );
}

.premium-result-check{
    display:grid;
    flex:0 0 34px;
    place-items:center;
    width:34px;
    height:34px;
    border:
        1px solid rgba(38,220,156,.35);
    border-radius:10px;
    background:
        rgba(26,197,134,.11);
    color:#3ade9e;
    font-weight:900;
    box-shadow:
        inset 0 0 15px
        rgba(32,215,148,.09);
}

.premium-result-highlights strong{
    display:block;
    color:#f1f5f9;
    font-size:.86rem;
}

.premium-result-highlights small{
    display:block;
    margin-top:3px;
    color:#8290a5;
    font-size:.72rem;
    line-height:1.45;
}

.premium-result-actions{
    display:flex;
    align-items:center;
    flex-wrap:wrap;
    gap:13px;
    margin-top:28px;
}

.premium-buy-now-button{
    position:relative;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:12px;
    min-width:160px;
    overflow:hidden;
    border:1px solid transparent;
    background:
        linear-gradient(
            135deg,
            #27c975,
            #149c59
        );
    color:#fff;
    box-shadow:
        0 18px 40px
        rgba(20,156,89,.26);
    transition:
        transform .3s ease,
        box-shadow .3s ease;
}

.premium-buy-now-button::before{
    content:"";
    position:absolute;
    inset:0;
    background:
        linear-gradient(
            105deg,
            transparent 20%,
            rgba(255,255,255,.27),
            transparent 80%
        );
    transform:translateX(-130%);
    animation:
        premiumBuyButtonShine
        3.5s ease-in-out infinite;
}

.premium-buy-now-button span,
.premium-buy-now-button i{
    position:relative;
    z-index:2;
}

.premium-buy-now-button i{
    font-style:normal;
    transition:transform .3s ease;
}

.premium-buy-now-button:hover{
    transform:translateY(-4px);
    box-shadow:
        0 23px 52px
        rgba(20,156,89,.38);
}

.premium-buy-now-button:hover i{
    transform:translate(4px,-3px);
}

.premium-buy-now-disabled{
    opacity:.45;
    pointer-events:none;
}

@keyframes premiumBuyButtonShine{
    0%,
    50%{
        transform:translateX(-130%);
    }

    75%,
    100%{
        transform:translateX(130%);
    }
}

.premium-result-action-note{
    color:#758298;
    font-size:.72rem;
}

/* Right visual */

.premium-result-visual{
    position:relative;
    min-width:0;
    perspective:1200px;
}

.premium-result-dashboard{
    position:relative;
    z-index:2;
    padding:22px;
    overflow:hidden;
    border:
        1px solid rgba(87,120,178,.23);
    border-radius:24px;
    background:
        linear-gradient(
            145deg,
            rgba(17,26,42,.97),
            rgba(5,10,19,.99)
        );
    transform:
        rotateY(-5deg)
        rotateX(2deg);
    transform-style:preserve-3d;
    box-shadow:
        0 38px 90px rgba(0,0,0,.54),
        0 0 65px rgba(31,105,255,.1);
    animation:
        premiumResultDashboardFloat
        6s ease-in-out infinite;
}

.premium-result-dashboard::after{
    content:"";
    position:absolute;
    width:190px;
    height:190px;
    top:-100px;
    right:-80px;
    border-radius:50%;
    background:
        rgba(40,119,255,.15);
    filter:blur(35px);
    pointer-events:none;
}

@keyframes premiumResultDashboardFloat{
    0%,
    100%{
        transform:
            rotateY(-5deg)
            rotateX(2deg)
            translateY(0);
    }

    50%{
        transform:
            rotateY(-2deg)
            rotateX(1deg)
            translateY(-9px);
    }
}

.premium-result-dashboard-top{
    position:relative;
    z-index:2;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
}

.premium-result-dashboard-top small{
    display:block;
    color:#77859a;
    font-size:.65rem;
    letter-spacing:.08em;
    text-transform:uppercase;
}

.premium-result-dashboard-top strong{
    display:block;
    margin-top:4px;
    color:#f8fafc;
    font-size:1rem;
}

.premium-result-live{
    display:inline-flex;
    align-items:center;
    gap:7px;
    padding:7px 10px;
    border:
        1px solid rgba(47,218,148,.25);
    border-radius:999px;
    background:
        rgba(30,185,122,.09);
    color:#44dc9f;
    font-size:.68rem;
    font-weight:800;
}

.premium-result-live i{
    width:7px;
    height:7px;
    border-radius:50%;
    background:#39dc99;
    box-shadow:
        0 0 12px
        rgba(57,220,153,.75);
    animation:
        premiumResultLivePulse
        1.8s ease-in-out infinite;
}

@keyframes premiumResultLivePulse{
    0%,
    100%{
        transform:scale(.82);
        opacity:.65;
    }

    50%{
        transform:scale(1.25);
        opacity:1;
    }
}

.premium-result-score{
    position:relative;
    z-index:2;
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    gap:14px;
    margin-top:25px;
    padding-bottom:15px;
    border-bottom:
        1px solid rgba(120,143,181,.13);
}

.premium-result-score > span{
    color:#7c899d;
    font-size:.72rem;
}

.premium-result-score strong{
    color:#f8fafc;
    font-size:
        clamp(1.25rem,2.2vw,1.9rem);
}

.premium-result-score small{
    color:#526276;
}

.premium-result-bars{
    position:relative;
    z-index:2;
    display:flex;
    align-items:flex-end;
    gap:8px;
    height:210px;
    margin-top:20px;
    padding:15px;
    border-radius:15px;
    background:
        linear-gradient(
            180deg,
            rgba(4,12,21,.52),
            rgba(3,31,23,.16)
        );
    box-shadow:
        inset 0 0 30px
        rgba(0,0,0,.28);
}

.premium-result-bar{
    position:relative;
    flex:1;
    min-width:7px;
    overflow:hidden;
    border-radius:5px 5px 2px 2px;
    transform-origin:bottom;
    animation:
        premiumResultBarGrow
        1.1s
        cubic-bezier(.16,1,.3,1)
        both;
}

.premium-result-bar::after{
    content:"";
    position:absolute;
    inset:0;
    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(255,255,255,.22),
            transparent
        );
    transform:translateX(-130%);
    animation:
        premiumResultBarShine
        3s ease-in-out infinite;
}

.premium-result-bar-profit{
    background:
        linear-gradient(
            to top,
            #087841,
            #3ddd8f
        );
    box-shadow:
        0 0 14px
        rgba(61,221,143,.16);
}

.premium-result-bar-loss{
    background:
        linear-gradient(
            to top,
            #811e2a,
            #ff5265
        );
    box-shadow:
        0 0 14px
        rgba(255,82,101,.15);
}

@keyframes premiumResultBarGrow{
    from{
        transform:scaleY(.08);
        opacity:0;
    }

    to{
        transform:scaleY(1);
        opacity:1;
    }
}

@keyframes premiumResultBarShine{
    0%,
    50%{
        transform:translateX(-130%);
    }

    80%,
    100%{
        transform:translateX(130%);
    }
}

.premium-result-summary{
    position:relative;
    z-index:2;
    display:grid;
    grid-template-columns:
        repeat(3,minmax(0,1fr));
    gap:8px;
    margin-top:13px;
}

.premium-result-summary article{
    min-width:0;
    padding:11px;
    border:
        1px solid rgba(102,129,173,.14);
    border-radius:11px;
    background:
        rgba(13,22,36,.76);
}

.premium-result-summary small{
    display:block;
    overflow:hidden;
    color:#738198;
    font-size:.55rem;
    text-transform:uppercase;
    white-space:nowrap;
    text-overflow:ellipsis;
}

.premium-result-summary strong{
    display:block;
    margin-top:5px;
    overflow:hidden;
    color:#eaf0f8;
    font-size:.78rem;
    white-space:nowrap;
    text-overflow:ellipsis;
}

.premium-result-summary
article:first-child strong{
    color:#42dd98;
}

.premium-result-floating-card{
    position:absolute;
    z-index:4;
    display:flex;
    align-items:center;
    gap:10px;
    right:-24px;
    bottom:-28px;
    width:min(235px,70%);
    padding:13px 15px;
    border:
        1px solid rgba(73,146,255,.28);
    border-radius:15px;
    background:
        linear-gradient(
            145deg,
            rgba(19,32,55,.97),
            rgba(7,15,27,.98)
        );
    box-shadow:
        0 22px 48px rgba(0,0,0,.4);
    animation:
        premiumFloatingCard
        5s ease-in-out infinite;
}

.premium-result-floating-card > span{
    display:grid;
    flex:0 0 34px;
    place-items:center;
    width:34px;
    height:34px;
    border-radius:10px;
    background:
        rgba(46,127,255,.14);
    color:#4bc9ff;
}

.premium-result-floating-card small{
    display:block;
    color:#73839b;
    font-size:.58rem;
    text-transform:uppercase;
}

.premium-result-floating-card strong{
    display:block;
    margin-top:3px;
    color:#eef4fb;
    font-size:.75rem;
}

@keyframes premiumFloatingCard{
    0%,
    100%{
        transform:translateY(0);
    }

    50%{
        transform:translateY(-9px);
    }
}

.premium-result-arrow{
    position:absolute;
    z-index:5;
    top:-42px;
    left:-34px;
    transform:rotate(28deg);
    pointer-events:none;
}

.premium-result-arrow span{
    display:block;
    color:#40b8ff;
    font-size:4.2rem;
    line-height:1;
    opacity:.5;
    filter:
        drop-shadow(
            0 0 17px
            rgba(53,154,255,.4)
        );
    animation:
        premiumResultArrowMove
        3.6s ease-in-out infinite;
}

@keyframes premiumResultArrowMove{
    0%,
    100%{
        transform:translate3d(0,0,0);
        opacity:.35;
    }

    50%{
        transform:translate3d(8px,-8px,0);
        opacity:.8;
    }
}

/* Tablet */

@media(max-width:1024px){

    .premium-result-layout{
        grid-template-columns:1fr;
    }

    .premium-result-visual{
        width:min(100%,700px);
        margin:15px auto 0;
    }

    .premium-result-dashboard{
        transform:none;
    }

    @keyframes premiumResultDashboardFloat{
        0%,
        100%{
            transform:translateY(0);
        }

        50%{
            transform:translateY(-8px);
        }
    }
}

/* Mobile */

@media(max-width:720px){

    .premium-result-section{
        padding:65px 0 80px;
    }

    .premium-result-layout{
        gap:42px;
    }

    .premium-result-title{
        font-size:
            clamp(2.1rem,10.5vw,3.1rem);
        line-height:1.02;
    }

    .premium-result-description{
        margin-top:21px;
        font-size:.92rem;
        line-height:1.7;
    }

    .premium-result-highlights{
        margin-top:22px;
    }

    .premium-result-highlights article{
        align-items:flex-start;
        padding:12px;
    }

    .premium-result-actions{
        display:block;
    }

    .premium-buy-now-button{
        width:100%;
    }

    .premium-result-action-note{
        display:block;
        margin-top:10px;
        text-align:center;
    }

    .premium-result-dashboard{
        padding:14px;
        border-radius:18px;
    }

    .premium-result-bars{
        height:160px;
        gap:5px;
        padding:11px;
    }

    .premium-result-summary{
        gap:5px;
    }

    .premium-result-summary article{
        padding:8px 6px;
    }

    .premium-result-summary small{
        font-size:.46rem;
    }

    .premium-result-summary strong{
        font-size:.65rem;
    }

    .premium-result-floating-card{
        position:relative;
        right:auto;
        bottom:auto;
        width:100%;
        margin-top:11px;
    }

    .premium-result-arrow{
        display:none;
    }
}

@media(max-width:380px){

    .premium-result-score{
        display:block;
    }

    .premium-result-score strong{
        display:block;
        margin-top:8px;
    }
}

@media(prefers-reduced-motion:reduce){

    .premium-result-orb,
    .premium-result-dashboard,
    .premium-result-live i,
    .premium-result-bar,
    .premium-result-bar::after,
    .premium-result-floating-card,
    .premium-result-arrow span,
    .premium-buy-now-button::before{
        animation:none!important;
    }
}
/* =========================================================
   ADVANCE FOUNDATION COURSE
   ========================================================= */

.afc-section{
    position:relative;
    isolation:isolate;
    overflow:hidden;
    padding:clamp(72px,8vw,120px) 0;
    background:#0b0f19;
    color:#f8fafc;
}

.afc-grid-bg{
    position:absolute;
    inset:0;
    z-index:-3;
    opacity:.16;
    background-image:
        linear-gradient(
            rgba(56,189,248,.08) 1px,
            transparent 1px
        ),
        linear-gradient(
            90deg,
            rgba(56,189,248,.08) 1px,
            transparent 1px
        );
    background-size:48px 48px;
    mask-image:
        linear-gradient(
            to bottom,
            transparent,
            #000 18%,
            #000 82%,
            transparent
        );
}

.afc-orb{
    position:absolute;
    z-index:-2;
    border-radius:50%;
    filter:blur(30px);
    pointer-events:none;
}

.afc-orb-a{
    width:420px;
    height:420px;
    top:-180px;
    right:4%;
    background:rgba(56,189,248,.14);
    animation:
        afcFloatOrb
        11s ease-in-out infinite;
}

.afc-orb-b{
    width:340px;
    height:340px;
    bottom:-180px;
    left:2%;
    background:rgba(16,185,129,.10);
    animation:
        afcFloatOrb
        13s ease-in-out infinite reverse;
}

@keyframes afcFloatOrb{

    50%{
        transform:
            translate3d(-35px,25px,0)
            scale(1.12);
    }

}

.afc-header{
    max-width:940px;
    margin:0 auto 34px;
    text-align:center;
}

.afc-label-row{
    display:flex;
    align-items:center;
    justify-content:center;
    flex-wrap:wrap;
    gap:10px;
    margin-bottom:18px;
}

.afc-recent,
.afc-badge{
    display:inline-flex;
    align-items:center;
    border-radius:999px;
    font-size:.68rem;
    font-weight:900;
    letter-spacing:.16em;
}

.afc-recent{
    padding:7px 11px;
    background:rgba(16,185,129,.12);
    border:
        1px solid rgba(16,185,129,.28);
    color:#54e6ae;
    box-shadow:
        0 0 22px rgba(16,185,129,.10);
}

.afc-badge{
    padding:8px 14px;
    background:rgba(56,189,248,.10);
    border:
        1px solid rgba(56,189,248,.28);
    color:#70d4ff;
}

.afc-header h2{
    margin:0;
    font-size:
        clamp(2.35rem,5.4vw,5.4rem);
    line-height:.98;
    letter-spacing:-.055em;
    background:
        linear-gradient(
            105deg,
            #f8fafc 0%,
            #d9f4ff 44%,
            #38bdf8 100%
        );
    -webkit-background-clip:text;
    background-clip:text;
    color:transparent;
}

.afc-header p{
    max-width:780px;
    margin:24px auto 0;
    color:#9aa8bd;
    font-size:
        clamp(.96rem,1.5vw,1.1rem);
    line-height:1.75;
}

.afc-info-strip{
    display:grid;
    grid-template-columns:
        repeat(4,minmax(0,1fr));
    gap:10px;
    margin:0 0 22px;
}

.afc-info-strip article{
    padding:17px 18px;
    border:
        1px solid rgba(124,157,197,.16);
    border-radius:16px;
    background:
        linear-gradient(
            145deg,
            rgba(18,28,45,.78),
            rgba(8,14,24,.84)
        );
    box-shadow:
        inset 0 1px rgba(255,255,255,.025),
        0 15px 38px rgba(0,0,0,.18);
    transition:
        transform .3s ease,
        border-color .3s ease,
        box-shadow .3s ease;
}

.afc-info-strip article:hover{
    transform:translateY(-5px);
    border-color:
        rgba(56,189,248,.38);
    box-shadow:
        0 22px 46px rgba(0,0,0,.28),
        0 0 26px rgba(56,189,248,.08);
}

.afc-info-strip small{
    display:block;
    color:#718096;
    font-size:.62rem;
    letter-spacing:.11em;
    text-transform:uppercase;
}

.afc-info-strip strong{
    display:block;
    margin-top:7px;
    color:#f4f8fc;
    font-size:1rem;
}

.afc-main-grid{
    display:grid;
    grid-template-columns:
        minmax(0,1.35fr)
        minmax(320px,.65fr);
    gap:18px;
    align-items:stretch;
}

.afc-feature-grid{
    display:grid;
    grid-template-columns:
        repeat(2,minmax(0,1fr));
    gap:14px;
}

.afc-feature-card{
    position:relative;
    min-height:235px;
    padding:24px;
    overflow:hidden;
    border:
        1px solid rgba(112,148,194,.17);
    border-radius:21px;
    background:
        linear-gradient(
            145deg,
            rgba(18,28,46,.92),
            rgba(7,13,23,.97)
        );
    transform-style:preserve-3d;
    box-shadow:
        0 24px 58px rgba(0,0,0,.26);
    transition:
        transform .45s
            cubic-bezier(.16,1,.3,1),
        border-color .4s ease,
        box-shadow .4s ease;
}

.afc-feature-card:hover{
    transform:
        perspective(900px)
        rotateX(3deg)
        rotateY(-3deg)
        translateY(-8px);
    border-color:
        rgba(56,189,248,.42);
    box-shadow:
        0 32px 70px rgba(0,0,0,.38),
        0 0 34px rgba(56,189,248,.10);
}

.afc-card-glow{
    position:absolute;
    width:150px;
    height:150px;
    top:-85px;
    right:-65px;
    border-radius:50%;
    background:rgba(56,189,248,.15);
    filter:blur(22px);
    transition:transform .45s ease;
}

.afc-feature-card:hover
.afc-card-glow{
    transform:scale(1.45);
}

.afc-icon{
    position:relative;
    z-index:2;
    display:grid;
    place-items:center;
    width:52px;
    height:52px;
    border-radius:15px;
    border:
        1px solid rgba(56,189,248,.32);
    background:
        linear-gradient(
            145deg,
            rgba(56,189,248,.18),
            rgba(22,67,110,.08)
        );
    color:#73d8ff;
    font-size:1.35rem;
    box-shadow:
        inset 0 0 18px
            rgba(56,189,248,.12),
        0 12px 28px
            rgba(0,0,0,.18);
    transform:translateZ(24px);
}

.afc-icon-vault{
    color:#63e6b5;
    border-color:
        rgba(16,185,129,.34);
    background:
        rgba(16,185,129,.10);
}

.afc-card-number{
    position:absolute;
    top:22px;
    right:22px;
    color:rgba(148,163,184,.26);
    font-size:.72rem;
    font-weight:900;
    letter-spacing:.15em;
}

.afc-feature-card h3{
    position:relative;
    z-index:2;
    margin:21px 0 10px;
    color:#f8fafc;
    font-size:1.05rem;
    transform:translateZ(18px);
}

.afc-feature-card p{
    position:relative;
    z-index:2;
    margin:0;
    color:#8e9db1;
    font-size:.84rem;
    line-height:1.65;
    transform:translateZ(12px);
}

.afc-price-card{
    position:relative;
    overflow:hidden;
    padding:28px;
    border:
        1px solid rgba(56,189,248,.28);
    border-radius:24px;
    background:
        linear-gradient(
            150deg,
            rgba(17,30,49,.98),
            rgba(5,12,22,.99)
        );
    box-shadow:
        0 35px 85px rgba(0,0,0,.42),
        0 0 50px rgba(56,189,248,.09);
    animation:
        afcPriceFloat
        6s ease-in-out infinite;
}

.afc-price-card::before{
    content:"";
    position:absolute;
    width:210px;
    height:210px;
    top:-125px;
    right:-90px;
    border-radius:50%;
    background:rgba(56,189,248,.15);
    filter:blur(24px);
}

@keyframes afcPriceFloat{

    50%{
        transform:translateY(-8px);
    }

}

.afc-shield{
    position:relative;
    z-index:2;
    display:grid;
    place-items:center;
    width:64px;
    height:72px;
    margin-bottom:21px;
    clip-path:
        polygon(
            50% 0,
            92% 16%,
            84% 72%,
            50% 100%,
            16% 72%,
            8% 16%
        );
    background:
        linear-gradient(
            145deg,
            rgba(56,189,248,.30),
            rgba(16,185,129,.17)
        );
    box-shadow:
        0 0 35px
        rgba(56,189,248,.22);
}

.afc-shield span{
    display:grid;
    place-items:center;
    width:43px;
    height:50px;
    clip-path:inherit;
    background:#0b1320;
    color:#63e6b5;
    font-weight:900;
}

.afc-price-card > small{
    position:relative;
    z-index:2;
    color:#7fcff3;
    font-size:.68rem;
    font-weight:800;
    letter-spacing:.1em;
    text-transform:uppercase;
}

.afc-price{
    position:relative;
    z-index:2;
    display:flex;
    align-items:flex-start;
    margin:12px 0 8px;
}

.afc-price sup{
    margin-top:11px;
    color:#73d8ff;
    font-size:1.25rem;
}

.afc-price strong{
    font-size:
        clamp(3.7rem,6vw,5.6rem);
    line-height:.9;
    letter-spacing:-.06em;
    color:#fff;
}

.afc-price-card p{
    position:relative;
    z-index:2;
    color:#8796aa;
    font-size:.82rem;
    line-height:1.55;
}

.afc-price-card ul{
    position:relative;
    z-index:2;
    display:grid;
    gap:10px;
    margin:22px 0 24px;
    padding:0;
    list-style:none;
}

.afc-price-card li{
    display:flex;
    align-items:center;
    gap:10px;
    color:#d9e2ee;
    font-size:.82rem;
}

.afc-price-card li span{
    display:grid;
    place-items:center;
    width:21px;
    height:21px;
    border-radius:7px;
    background:
        rgba(16,185,129,.12);
    color:#55e3aa;
}

.afc-cta{
    position:relative;
    z-index:2;
    display:flex;
    width:100%;
    align-items:center;
    justify-content:center;
    gap:12px;
    overflow:hidden;
    border-color:transparent;
    background:
        linear-gradient(
            135deg,
            #38bdf8,
            #1679d8
        );
    color:#fff;
    box-shadow:
        0 18px 42px
        rgba(56,189,248,.25);
}

.afc-cta::before{
    content:"";
    position:absolute;
    inset:0;
    background:
        linear-gradient(
            105deg,
            transparent 20%,
            rgba(255,255,255,.25),
            transparent 80%
        );
    transform:translateX(-130%);
    animation:
        afcCtaShine
        3.6s ease-in-out infinite;
}

.afc-cta span,
.afc-cta b{
    position:relative;
    z-index:2;
}

.afc-cta:hover{
    transform:translateY(-4px);
    box-shadow:
        0 24px 52px
        rgba(56,189,248,.36);
}

@keyframes afcCtaShine{

    60%,
    100%{
        transform:translateX(130%);
    }

}

.afc-cta-disabled{
    opacity:.45;
    pointer-events:none;
}

.afc-cta-note{
    position:relative;
    z-index:2;
    display:block!important;
    margin-top:11px;
    text-align:center!important;
    color:#748398!important;
    font-size:.66rem!important;
    letter-spacing:0!important;
    text-transform:none!important;
}

.afc-metrics{
    display:grid;
    grid-template-columns:
        repeat(3,minmax(0,1fr));
    gap:10px;
    margin-top:18px;
}

.afc-metrics article{
    display:flex;
    align-items:center;
    gap:13px;
    padding:18px 20px;
    border:
        1px solid rgba(16,185,129,.16);
    border-radius:16px;
    background:
        linear-gradient(
            145deg,
            rgba(10,29,30,.68),
            rgba(7,14,23,.82)
        );
}

.afc-metrics strong{
    color:#54e6ae;
    font-size:1.25rem;
    white-space:nowrap;
}

.afc-metrics span{
    color:#a3afc0;
    font-size:.76rem;
    line-height:1.4;
}

@media(max-width:980px){

    .afc-main-grid{
        grid-template-columns:1fr;
    }

    .afc-price-card{
        max-width:680px;
        width:100%;
        margin:0 auto;
    }

    .afc-info-strip{
        grid-template-columns:
            repeat(2,minmax(0,1fr));
    }

}

@media(max-width:680px){

    .afc-section{
        padding:64px 0;
    }

    .afc-header{
        text-align:left;
        margin-bottom:25px;
    }

    .afc-label-row{
        justify-content:flex-start;
    }

    .afc-header h2{
        font-size:
            clamp(2.15rem,10.6vw,3.25rem);
    }

    .afc-header p{
        font-size:.92rem;
        margin-top:19px;
    }

    .afc-info-strip{
        grid-template-columns:
            repeat(2,minmax(0,1fr));
        gap:8px;
    }

    .afc-info-strip article{
        padding:13px 12px;
    }

    .afc-info-strip small{
        font-size:.52rem;
    }

    .afc-info-strip strong{
        font-size:.79rem;
    }

    .afc-feature-grid{
        grid-template-columns:
            repeat(2,minmax(0,1fr));
        gap:9px;
    }

    .afc-feature-card{
        min-height:215px;
        padding:15px 13px;
        border-radius:16px;
    }

    .afc-icon{
        width:41px;
        height:41px;
        border-radius:12px;
        font-size:1.05rem;
    }

    .afc-card-number{
        top:14px;
        right:12px;
        font-size:.58rem;
    }

    .afc-feature-card h3{
        margin-top:16px;
        font-size:.78rem;
        line-height:1.35;
    }

    .afc-feature-card p{
        font-size:.66rem;
        line-height:1.5;
    }

    .afc-price-card{
        padding:21px 17px;
    }

    .afc-metrics{
        grid-template-columns:1fr;
    }

    .afc-metrics article{
        padding:14px;
    }

    .afc-price strong{
        font-size:4.4rem;
    }

}

@media(max-width:380px){

    .afc-feature-grid,
    .afc-info-strip{
        grid-template-columns:1fr;
    }

    .afc-feature-card{
        min-height:180px;
    }

}

@media(
    prefers-reduced-motion:reduce
){

    .afc-orb,
    .afc-price-card,
    .afc-cta::before{
        animation:none!important;
    }

}
/* =========================================================
   ADVANCE COURSE — VERIFIED SUCCESS STORY
   ========================================================= */

.afc-success-story{
    position:relative;
    margin-top:clamp(54px,7vw,92px);
    padding:clamp(24px,4vw,44px);
    overflow:hidden;
    border:1px solid rgba(56,189,248,.24);
    border-radius:28px;
    background:
        radial-gradient(
            circle at 8% 4%,
            rgba(56,189,248,.13),
            transparent 31%
        ),
        radial-gradient(
            circle at 92% 88%,
            rgba(16,185,129,.1),
            transparent 32%
        ),
        linear-gradient(
            145deg,
            rgba(15,26,43,.97),
            rgba(5,11,20,.99)
        );
    box-shadow:
        0 42px 105px rgba(0,0,0,.46),
        inset 0 1px rgba(255,255,255,.04),
        0 0 50px rgba(56,189,248,.06);
    scroll-margin-top:110px;
}

.afc-success-story::before{
    content:"";
    position:absolute;
    inset:0;
    pointer-events:none;
    opacity:.12;
    background-image:
        linear-gradient(
            rgba(56,189,248,.14) 1px,
            transparent 1px
        ),
        linear-gradient(
            90deg,
            rgba(56,189,248,.14) 1px,
            transparent 1px
        );
    background-size:42px 42px;
    mask-image:
        linear-gradient(
            to bottom,
            #000,
            transparent 92%
        );
}

.afc-ss-head{
    position:relative;
    z-index:2;
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    gap:24px;
    margin-bottom:30px;
}

.afc-ss-head > div{
    max-width:760px;
}

.afc-ss-eyebrow{
    display:inline-block;
    margin-bottom:11px;
    color:#51e0a8;
    font-size:.66rem;
    font-weight:900;
    letter-spacing:.17em;
}

.afc-ss-head h3{
    margin:0;
    color:#f8fafc;
    font-size:clamp(1.95rem,4vw,3.8rem);
    line-height:1.03;
    letter-spacing:-.045em;
}

.afc-ss-head p{
    max-width:720px;
    margin:16px 0 0;
    color:#8f9db0;
    font-size:.92rem;
    line-height:1.7;
}

.afc-ss-cycle-label{
    flex:0 0 auto;
    padding:11px 14px;
    border:1px solid rgba(56,189,248,.25);
    border-radius:12px;
    background:rgba(56,189,248,.08);
    color:#72d8ff;
    font-size:.64rem;
    font-weight:850;
    letter-spacing:.08em;
}

.afc-ss-grid{
    position:relative;
    z-index:2;
    display:grid;
    grid-template-columns:
        minmax(280px,.42fr)
        minmax(0,1fr);
    gap:18px;
}

.afc-ss-profile,
.afc-ss-performance{
    border:1px solid rgba(111,146,191,.17);
    border-radius:22px;
    background:
        linear-gradient(
            145deg,
            rgba(19,30,48,.93),
            rgba(7,13,23,.98)
        );
    box-shadow:
        0 24px 60px rgba(0,0,0,.29),
        inset 0 1px rgba(255,255,255,.025);
}

.afc-ss-profile{
    padding:22px;
}

.afc-ss-person{
    display:flex;
    align-items:center;
    gap:14px;
}

.afc-ss-avatar{
    flex:0 0 70px;
    width:70px;
    height:70px;
}

.afc-ss-avatar img,
.afc-ss-avatar span{
    display:grid;
    place-items:center;
    width:100%;
    height:100%;
    border:2px solid rgba(56,189,248,.42);
    border-radius:20px;
    object-fit:cover;
    background:
        linear-gradient(
            145deg,
            #17354f,
            #081521
        );
    color:#7cddff;
    font-size:1.45rem;
    font-weight:900;
    box-shadow:
        0 14px 34px rgba(0,0,0,.31),
        0 0 24px rgba(56,189,248,.11);
}

.afc-ss-person h4{
    display:flex;
    align-items:center;
    gap:7px;
    margin:0;
    color:#fff;
    font-size:1.32rem;
}

.afc-ss-person p{
    margin:6px 0 0;
    color:#8493a7;
    font-size:.76rem;
}

.afc-ss-tick{
    display:inline-grid;
    place-items:center;
    width:19px;
    height:19px;
    border-radius:50%;
    background:#2089ff;
    color:#fff;
    font-size:.65rem;
    box-shadow:
        0 0 14px rgba(32,137,255,.55);
}

.afc-ss-badges{
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    margin-top:19px;
}

.afc-ss-badges span{
    display:inline-flex;
    align-items:center;
    gap:6px;
    padding:7px 10px;
    border-radius:10px;
    font-size:.64rem;
    font-weight:850;
}

.afc-ss-badges .verified{
    border:1px solid rgba(32,137,255,.3);
    background:rgba(32,137,255,.1);
    color:#75baff;
}

.afc-ss-badges .achievement{
    border:1px solid rgba(244,183,55,.28);
    background:rgba(244,183,55,.09);
    color:#f5c45e;
}

.afc-ss-benefit{
    margin-top:19px;
    padding:16px;
    border:1px solid rgba(16,185,129,.17);
    border-radius:14px;
    background:rgba(16,185,129,.055);
}

.afc-ss-benefit small{
    color:#4edca5;
    font-size:.64rem;
    font-weight:850;
    letter-spacing:.08em;
    text-transform:uppercase;
}

.afc-ss-benefit p{
    margin:8px 0 0;
    color:#9fabbc;
    font-size:.76rem;
    line-height:1.6;
}

.afc-ss-highlight{
    margin-top:19px;
    padding-top:18px;
    border-top:1px solid rgba(120,150,190,.14);
}

.afc-ss-highlight span,
.afc-ss-highlight small{
    display:block;
    color:#718197;
    font-size:.6rem;
}

.afc-ss-highlight strong{
    display:block;
    margin:5px 0;
    color:#55e4ac;
    font-size:2rem;
    line-height:1;
}

.afc-ss-performance{
    padding:21px;
}

.afc-ss-trades{
    display:grid;
    grid-template-columns:
        repeat(5,minmax(0,1fr));
    gap:8px;
}

.afc-ss-trade{
    min-width:0;
    padding:12px 7px;
    border-radius:11px;
    text-align:center;
}

.afc-ss-trade.win{
    border:1px solid rgba(16,185,129,.22);
    background:
        linear-gradient(
            145deg,
            rgba(16,185,129,.12),
            rgba(6,30,28,.38)
        );
}

.afc-ss-trade.loss{
    border:1px solid rgba(239,68,68,.24);
    background:
        linear-gradient(
            145deg,
            rgba(239,68,68,.12),
            rgba(35,8,15,.4)
        );
}

.afc-ss-trade span,
.afc-ss-trade small{
    display:block;
    color:#8191a7;
    font-size:.56rem;
    font-weight:700;
    letter-spacing:.02em;
}

.afc-ss-trade strong{
    display:block;
    margin:6px 0 4px;
    color:#54e4aa;
    font-size:.96rem;
    font-weight:900;
    letter-spacing:.01em;
}

.afc-ss-trade.loss strong{
    color:#ff7777;
}

.afc-ss-trade.impulse-2 strong{
    color:#62d7ff;
}

.afc-ss-trade.impulse-3 strong{
    color:#bd91ff;
}

.afc-ss-stats{
    display:grid;
    grid-template-columns:
        repeat(3,minmax(0,1fr));
    gap:8px;
    margin-top:14px;
}

.afc-ss-stats article{
    min-width:0;
    padding:13px;
    border:1px solid rgba(111,145,187,.14);
    border-radius:11px;
    background:rgba(7,14,24,.66);
}

.afc-ss-stats span{
    display:block;
    color:#7f90a6;
    font-size:.6rem;
    font-weight:700;
    letter-spacing:.04em;
    text-transform:uppercase;
}

.afc-ss-stats strong{
    display:block;
    margin-top:6px;
    overflow:hidden;
    color:#eef5fc;
    font-size:1.08rem;
    font-weight:850;
    white-space:nowrap;
    text-overflow:ellipsis;
}

.afc-ss-stats .positive{
    color:#50dfa6;
}

.afc-ss-stats .negative{
    color:#ff7777;
}

.afc-ss-targets{
    display:grid;
    grid-template-columns:
        repeat(4,minmax(0,1fr));
    gap:8px;
    margin-top:14px;
}

.afc-ss-targets span{
    padding:11px 7px;
    border:1px solid rgba(110,144,187,.13);
    border-radius:10px;
    background:rgba(12,21,34,.58);
    color:#8b9bb0;
    font-size:.6rem;
    font-weight:700;
    text-align:center;
}

.afc-ss-targets b{
    display:block;
    margin-top:5px;
    color:#f3f7fb;
    font-size:1.08rem;
    font-weight:900;
}

.afc-ss-disclaimer{
    position:relative;
    z-index:2;
    max-width:820px;
    margin:17px auto 0;
    color:#63748a;
    font-size:.6rem;
    line-height:1.55;
    text-align:center;
}

@media(max-width:980px){

    .afc-ss-grid{
        grid-template-columns:1fr;
    }

}

@media(max-width:680px){

    .afc-success-story{
        margin-top:45px;
        padding:18px 12px;
        border-radius:20px;
    }

    .afc-ss-head{
        display:block;
    }

    .afc-ss-cycle-label{
        display:inline-block;
        margin-top:15px;
    }

    .afc-ss-head h3{
        font-size:clamp(1.6rem,8vw,2.3rem);
    }

    .afc-ss-profile,
    .afc-ss-performance{
        padding:15px 12px;
        border-radius:16px;
    }

    .afc-ss-avatar{
        flex-basis:56px;
        width:56px;
        height:56px;
    }

    .afc-ss-avatar img,
    .afc-ss-avatar span{
        border-radius:15px;
        font-size:1.05rem;
    }

    .afc-ss-person h4{
        font-size:1.05rem;
    }

    .afc-ss-trades{
        grid-template-columns:
            repeat(5,minmax(0,1fr));
        gap:5px;
    }

    .afc-ss-trade{
        padding:9px 3px;
    }

    .afc-ss-trade span,
    .afc-ss-trade small{
        font-size:.39rem;
    }

    .afc-ss-trade strong{
        font-size:.66rem;
    }

    .afc-ss-stats{
        grid-template-columns:
            repeat(2,minmax(0,1fr));
    }

    .afc-ss-targets{
        grid-template-columns:
            repeat(2,minmax(0,1fr));
    }

}

@media(max-width:390px){

    .afc-ss-trades{
        grid-template-columns:
            repeat(2,minmax(0,1fr));
    }

    .afc-ss-trade:last-child{
        grid-column:span 2;
    }

}
/* Success Story profitability state */

.afc-ss-highlight strong.positive{
    color:#55e4ac;
    text-shadow:
        0 0 20px rgba(16,185,129,.22);
}

.afc-ss-highlight strong.negative{
    color:#ff7777;
    text-shadow:
        0 0 20px rgba(239,68,68,.18);
}
/* =========================================================
   PRIVATE MEMBER ACCESS / LOCKED REGISTRATION
   ========================================================= */

.member-lock-page,
.member-activation-page{
    position:relative;
    display:grid;
    min-height:
        calc(100vh - 80px);
    place-items:center;
    overflow:hidden;
    padding:
        clamp(55px,8vw,100px)
        18px;
    background:
        radial-gradient(
            circle at 14% 12%,
            rgba(56,189,248,.13),
            transparent 34%
        ),
        radial-gradient(
            circle at 87% 82%,
            rgba(16,185,129,.09),
            transparent 32%
        ),
        linear-gradient(
            150deg,
            #070d17,
            #0a1220 48%,
            #050a12
        );
}

.member-lock-page::before,
.member-activation-page::before{
    content:"";
    position:absolute;
    inset:0;
    pointer-events:none;
    opacity:.14;
    background-image:
        linear-gradient(
            rgba(56,189,248,.09) 1px,
            transparent 1px
        ),
        linear-gradient(
            90deg,
            rgba(56,189,248,.09) 1px,
            transparent 1px
        );
    background-size:
        46px 46px;
    mask-image:
        radial-gradient(
            circle at center,
            #000,
            transparent 78%
        );
}

.member-lock-effects{
    position:absolute;
    inset:0;
    pointer-events:none;
}

.member-lock-effects span{
    position:absolute;
    border-radius:50%;
    filter:blur(25px);
    animation:
        memberAccessFloat
        10s ease-in-out infinite;
}

.member-lock-effects span:nth-child(1){
    width:260px;
    height:260px;
    top:-100px;
    right:5%;
    background:
        rgba(56,189,248,.13);
}

.member-lock-effects span:nth-child(2){
    width:220px;
    height:220px;
    bottom:-100px;
    left:4%;
    background:
        rgba(16,185,129,.1);
    animation-delay:-4s;
}

.member-lock-effects span:nth-child(3){
    width:140px;
    height:140px;
    top:42%;
    left:18%;
    background:
        rgba(123,92,255,.08);
    animation-delay:-7s;
}

@keyframes memberAccessFloat{

    50%{
        transform:
            translate3d(
                30px,
                -28px,
                0
            )
            scale(1.14);
    }

}

.member-lock-card,
.member-activation-card{
    position:relative;
    z-index:2;
    width:min(100%,610px);
    padding:
        clamp(27px,5vw,48px);
    overflow:hidden;
    border:
        1px solid rgba(56,189,248,.24);
    border-radius:28px;
    background:
        radial-gradient(
            circle at 80% 0,
            rgba(56,189,248,.1),
            transparent 34%
        ),
        linear-gradient(
            145deg,
            rgba(18,30,49,.96),
            rgba(6,12,22,.985)
        );
    box-shadow:
        0 45px 110px rgba(0,0,0,.5),
        inset 0 1px rgba(255,255,255,.045),
        0 0 50px rgba(56,189,248,.07);
    text-align:center;
}

.member-lock-card::before,
.member-activation-card::before{
    content:"";
    position:absolute;
    width:200px;
    height:200px;
    top:-130px;
    right:-95px;
    border-radius:50%;
    background:
        rgba(56,189,248,.16);
    filter:blur(30px);
}

.member-lock-icon{
    position:relative;
    width:82px;
    height:92px;
    margin:
        0 auto 24px;
    filter:
        drop-shadow(
            0 18px 25px
            rgba(0,0,0,.32)
        );
    animation:
        memberLockHover
        4.8s ease-in-out infinite;
}

.member-lock-shackle{
    position:absolute;
    width:50px;
    height:52px;
    top:0;
    left:16px;
    border:
        8px solid #5bd5ff;
    border-bottom:0;
    border-radius:
        30px 30px 0 0;
    box-shadow:
        0 0 22px
        rgba(56,189,248,.33);
}

.member-lock-body{
    position:absolute;
    display:grid;
    width:82px;
    height:62px;
    bottom:0;
    place-items:center;
    border:
        1px solid rgba(99,218,255,.48);
    border-radius:18px;
    background:
        linear-gradient(
            145deg,
            #249bd0,
            #1767b4
        );
    box-shadow:
        inset 0 0 22px
            rgba(255,255,255,.11),
        0 16px 32px
            rgba(10,105,179,.3);
}

.member-lock-body span{
    position:relative;
    width:10px;
    height:22px;
    border-radius:8px;
    background:#071522;
}

.member-lock-body span::before{
    content:"";
    position:absolute;
    width:16px;
    height:16px;
    top:-4px;
    left:-3px;
    border-radius:50%;
    background:#071522;
}

@keyframes memberLockHover{

    50%{
        transform:
            translateY(-8px)
            rotateY(8deg);
    }

}

.member-lock-card .eyebrow,
.member-activation-card .eyebrow{
    color:#6dd9ff;
}

.member-lock-card h1,
.member-activation-card h1{
    margin:
        12px 0 0;
    color:#f8fafc;
    font-size:
        clamp(2rem,5vw,3.25rem);
    line-height:1.04;
    letter-spacing:-.045em;
}

.member-lock-description{
    max-width:510px;
    margin:
        18px auto 0;
    color:#98a6b9;
    font-size:.94rem;
    line-height:1.72;
}

.member-lock-steps{
    display:grid;
    gap:10px;
    margin-top:28px;
    text-align:left;
}

.member-lock-steps article{
    display:flex;
    align-items:center;
    gap:14px;
    padding:14px;
    border:
        1px solid rgba(114,149,193,.15);
    border-radius:14px;
    background:
        linear-gradient(
            145deg,
            rgba(16,27,44,.75),
            rgba(8,15,26,.84)
        );
    transition:
        transform .3s ease,
        border-color .3s ease;
}

.member-lock-steps article:hover{
    transform:
        translateX(5px);
    border-color:
        rgba(56,189,248,.34);
}

.member-lock-steps article > span{
    display:grid;
    flex:0 0 42px;
    place-items:center;
    width:42px;
    height:42px;
    border:
        1px solid rgba(56,189,248,.25);
    border-radius:12px;
    background:
        rgba(56,189,248,.08);
    color:#68d9ff;
    font-size:.72rem;
    font-weight:900;
}

.member-lock-steps strong{
    display:block;
    color:#edf5fc;
    font-size:.87rem;
}

.member-lock-steps small{
    display:block;
    margin-top:4px;
    color:#74859b;
    font-size:.7rem;
    line-height:1.45;
}

.member-lock-whatsapp{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:10px;
    width:100%;
    min-height:54px;
    margin-top:25px;
    border-color:
        rgba(74,222,128,.28);
    background:
        linear-gradient(
            135deg,
            #21c66b,
            #13984e
        );
    color:#fff;
    box-shadow:
        0 19px 42px
        rgba(22,174,90,.24);
}

.member-lock-whatsapp:hover{
    transform:
        translateY(-4px);
    box-shadow:
        0 26px 52px
        rgba(22,174,90,.34);
}

.member-whatsapp-mark{
    font-size:1.2rem;
}

.member-lock-disabled{
    opacity:.45;
    pointer-events:none;
}

.member-lock-divider{
    display:grid;
    grid-template-columns:
        1fr auto 1fr;
    align-items:center;
    gap:11px;
    margin:24px 0 18px;
}

.member-lock-divider span{
    height:1px;
    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(129,157,192,.24)
        );
}

.member-lock-divider span:last-child{
    background:
        linear-gradient(
            90deg,
            rgba(129,157,192,.24),
            transparent
        );
}

.member-lock-divider small{
    color:#66788f;
    font-size:.56rem;
    font-weight:850;
    letter-spacing:.12em;
}

.member-lock-login{
    display:inline-flex;
    align-items:center;
    gap:9px;
    color:#75d9ff;
    font-size:.78rem;
    font-weight:800;
    text-decoration:none;
}

.member-lock-login span{
    transition:
        transform .25s ease;
}

.member-lock-login:hover span{
    transform:
        translateX(5px);
}

/* =========================================================
   MEMBER ACTIVATION FORM
   ========================================================= */

.member-activation-icon{
    display:grid;
    width:76px;
    height:76px;
    margin:
        0 auto 22px;
    place-items:center;
    border-radius:22px;
    font-size:2rem;
    font-weight:900;
}

.member-activation-icon.valid{
    border:
        1px solid rgba(16,185,129,.35);
    background:
        rgba(16,185,129,.12);
    color:#51e2a8;
    box-shadow:
        0 0 28px
        rgba(16,185,129,.14);
}

.member-activation-icon.invalid{
    border:
        1px solid rgba(239,68,68,.35);
    background:
        rgba(239,68,68,.1);
    color:#ff7a7a;
    box-shadow:
        0 0 28px
        rgba(239,68,68,.12);
}

.member-activation-form{
    margin-top:27px;
    text-align:left;
}

.member-activation-form label{
    color:#cfd8e5;
    font-size:.75rem;
    font-weight:750;
}

.member-activation-form input{
    margin-top:7px;
    border-color:
        rgba(115,150,195,.22);
    background:
        rgba(6,13,23,.78);
}

.member-activation-form input:focus{
    border-color:
        rgba(56,189,248,.55);
    box-shadow:
        0 0 0 4px
        rgba(56,189,248,.09);
}

.member-activation-form small{
    display:block;
    margin-top:6px;
    color:#66788f;
    font-size:.62rem;
}

.member-activate-button{
    width:100%;
    min-height:52px;
    margin-top:5px;
    background:
        linear-gradient(
            135deg,
            #38bdf8,
            #2674e8
        );
    box-shadow:
        0 20px 44px
        rgba(35,118,225,.25);
}

.member-activation-security{
    margin:18px 0 0;
    color:#71839a;
    font-size:.63rem;
    line-height:1.5;
}

/* =========================================================
   ADMIN MEMBER ACCESS
   ========================================================= */

.member-access-admin-head{
    align-items:flex-start;
}

.member-access-admin-grid{
    display:grid;
    grid-template-columns:
        minmax(0,1fr)
        minmax(300px,.72fr);
    gap:18px;
    margin-bottom:18px;
}

.member-generated-link{
    display:flex;
    align-items:flex-start;
    gap:18px;
    margin-bottom:18px;
    border-color:
        rgba(16,185,129,.28);
    background:
        radial-gradient(
            circle at 5% 0,
            rgba(16,185,129,.1),
            transparent 27%
        ),
        var(--surface);
}

.member-generated-icon{
    display:grid;
    flex:0 0 54px;
    place-items:center;
    width:54px;
    height:54px;
    border-radius:16px;
    background:
        rgba(16,185,129,.12);
    color:#50e0a6;
    font-size:1.25rem;
    font-weight:900;
}

.member-generated-content{
    flex:1;
    min-width:0;
}

.member-generated-content h2{
    margin:
        5px 0 0;
}

.member-generated-copy{
    display:grid;
    grid-template-columns:
        minmax(0,1fr)
        auto;
    gap:9px;
    margin-top:17px;
}

.member-generated-copy input{
    min-width:0;
    font-family:
        ui-monospace,
        SFMono-Regular,
        Menlo,
        monospace;
    font-size:.72rem;
}

.member-invite-create,
.member-invite-guide,
.member-invite-list{
    position:relative;
    overflow:hidden;
}

.member-invite-create::before{
    content:"";
    position:absolute;
    width:180px;
    height:180px;
    top:-110px;
    right:-80px;
    border-radius:50%;
    background:
        rgba(56,189,248,.1);
    filter:blur(25px);
}

.member-security-badge{
    padding:7px 10px;
    border:
        1px solid rgba(56,189,248,.24);
    border-radius:9px;
    background:
        rgba(56,189,248,.07);
    color:#6cd9ff;
    font-size:.58rem;
    font-weight:850;
}

.member-invite-information{
    display:flex;
    gap:11px;
    padding:13px;
    border:
        1px solid rgba(16,185,129,.16);
    border-radius:12px;
    background:
        rgba(16,185,129,.05);
}

.member-invite-information span{
    font-size:1rem;
}

.member-invite-information p{
    margin:0;
    color:#8090a5;
    font-size:.68rem;
    line-height:1.52;
}

.member-create-link-button{
    width:100%;
    min-height:49px;
}

.member-access-steps{
    display:grid;
    gap:10px;
    margin-top:18px;
}

.member-access-steps article{
    display:flex;
    gap:12px;
    padding:12px;
    border:
        1px solid rgba(112,146,190,.13);
    border-radius:12px;
    background:
        rgba(8,15,25,.52);
}

.member-access-steps article > span{
    display:grid;
    flex:0 0 36px;
    place-items:center;
    width:36px;
    height:36px;
    border-radius:10px;
    background:
        rgba(56,189,248,.08);
    color:#68d8ff;
    font-size:.62rem;
    font-weight:900;
}

.member-access-steps strong{
    display:block;
    color:#ecf3fb;
    font-size:.76rem;
}

.member-access-steps p{
    margin:4px 0 0;
    color:#718197;
    font-size:.64rem;
    line-height:1.45;
}

.member-invite-status{
    display:inline-flex;
    align-items:center;
    padding:5px 8px;
    border-radius:8px;
    font-size:.59rem;
    font-weight:850;
    text-transform:capitalize;
}

.member-invite-status.status-pending{
    background:
        rgba(56,189,248,.1);
    color:#6bd8ff;
}

.member-invite-status.status-used{
    background:
        rgba(16,185,129,.1);
    color:#50dfa6;
}

.member-invite-status.status-revoked,
.member-invite-status.status-expired{
    background:
        rgba(239,68,68,.1);
    color:#ff7a7a;
}

.member-empty-invites{
    display:grid;
    place-items:center;
    min-height:220px;
    text-align:center;
}

.member-empty-invites > span{
    font-size:2rem;
}

.member-empty-invites strong{
    margin-top:10px;
    color:#eaf2fb;
}

.member-empty-invites p{
    margin:6px 0 0;
    color:#74859a;
    font-size:.72rem;
}

/* =========================================================
   RESPONSIVE MEMBER ACCESS
   ========================================================= */

@media(max-width:900px){

    .member-access-admin-grid{
        grid-template-columns:1fr;
    }

}

@media(max-width:650px){

    .member-lock-page,
    .member-activation-page{
        padding:
            42px 12px;
    }

    .member-lock-card,
    .member-activation-card{
        padding:
            28px 17px;
        border-radius:21px;
    }

    .member-lock-card h1,
    .member-activation-card h1{
        font-size:
            clamp(1.85rem,9vw,2.55rem);
    }

    .member-lock-description{
        font-size:.84rem;
    }

    .member-generated-link{
        display:block;
    }

    .member-generated-icon{
        margin-bottom:13px;
    }

    .member-generated-copy{
        grid-template-columns:1fr;
    }

    .member-generated-copy .button{
        width:100%;
    }

    .member-invite-list .table-wrap{
        overflow-x:auto;
    }

    .member-invite-list table{
        min-width:760px;
    }

}

@media(
    prefers-reduced-motion:reduce
){

    .member-lock-effects span,
    .member-lock-icon{
        animation:none!important;
    }

}
/* =========================================================
   ADMIN MULTIPLE PRIVATE VIDEO UPLOAD
   ========================================================= */

.dashboard-video-upload-panel{
    position:relative;
    overflow:hidden;
    margin-bottom:18px;
}

.dashboard-video-main-fields{
    display:grid;
    grid-template-columns:
        minmax(0,1fr)
        minmax(220px,.42fr);
    gap:14px;
}

.dashboard-private-badge{
    display:inline-flex;
    align-items:center;
    padding:7px 10px;
    border:1px solid rgba(16,185,129,.22);
    border-radius:9px;
    background:rgba(16,185,129,.07);
    color:#50dfa6;
    font-size:.6rem;
    font-weight:850;
}

.dashboard-video-upload-list{
    display:grid;
    gap:12px;
}

.dashboard-video-upload-row{
    position:relative;
    display:grid;
    grid-template-columns:
        45px minmax(0,1fr) 34px;
    align-items:start;
    gap:12px;
    padding:15px;
    border:1px solid rgba(110,146,191,.16);
    border-radius:15px;
    background:
        linear-gradient(
            145deg,
            rgba(13,23,38,.82),
            rgba(7,13,23,.9)
        );
}

.dashboard-upload-number{
    display:grid;
    width:45px;
    height:45px;
    place-items:center;
    border:1px solid rgba(56,189,248,.22);
    border-radius:12px;
    background:rgba(56,189,248,.08);
    color:#6bd9ff;
    font-size:.7rem;
    font-weight:900;
}

.dashboard-upload-fields{
    display:grid;
    grid-template-columns:
        minmax(180px,1fr)
        minmax(220px,1.1fr)
        minmax(100px,.3fr);
    align-items:end;
    gap:12px;
}

.dashboard-upload-fields input[type="file"]{
    padding:10px;
    border:1px dashed rgba(56,189,248,.3);
    background:rgba(56,189,248,.04);
}

.dashboard-upload-fields
input[type="file"]::file-selector-button{
    margin-right:10px;
    padding:8px 11px;
    border:0;
    border-radius:8px;
    background:rgba(56,189,248,.14);
    color:#72dcff;
    font-weight:800;
    cursor:pointer;
}

.dashboard-remove-upload{
    display:grid;
    width:34px;
    height:34px;
    place-items:center;
    padding:0;
    border:1px solid rgba(239,68,68,.2);
    border-radius:10px;
    background:rgba(239,68,68,.06);
    color:#ff7b7b;
    font-size:1.15rem;
    cursor:pointer;
}

.dashboard-remove-upload:hover{
    border-color:rgba(239,68,68,.42);
    background:rgba(239,68,68,.12);
}

.dashboard-add-video-button{
    width:100%;
    min-height:46px;
    border-style:dashed;
}

.dashboard-upload-information{
    display:flex;
    align-items:flex-start;
    gap:11px;
    padding:13px;
    border:1px solid rgba(16,185,129,.16);
    border-radius:12px;
    background:rgba(16,185,129,.05);
}

.dashboard-upload-information p{
    margin:0;
    color:#7f90a5;
    font-size:.68rem;
    line-height:1.55;
}

.dashboard-upload-all-button{
    width:100%;
    min-height:51px;
}

.dashboard-video-empty-state{
    display:grid;
    min-height:220px;
    place-items:center;
    align-content:center;
    text-align:center;
}

.dashboard-video-empty-state > span{
    font-size:2rem;
}

.dashboard-video-empty-state h3{
    margin:12px 0 0;
}

.dashboard-video-empty-state p{
    margin:6px 0 0;
    color:#73849a;
    font-size:.72rem;
}

@media(max-width:950px){

    .dashboard-video-main-fields,
    .dashboard-upload-fields{
        grid-template-columns:1fr;
    }

}

@media(max-width:650px){

    .dashboard-video-upload-row{
        grid-template-columns:38px minmax(0,1fr);
        padding:12px 9px;
    }

    .dashboard-upload-number{
        width:38px;
        height:38px;
    }

    .dashboard-remove-upload{
        position:absolute;
        top:10px;
        right:9px;
    }

    .dashboard-upload-fields{
        padding-right:29px;
    }

}
/* =========================================================
   FINAL ADMIN 100% FIT
   ========================================================= */

body.app-shell{
    min-width:0;
    overflow-x:hidden;
}

body.app-shell .app-topbar,
body.app-shell .app-main{
    width:100%;
    min-width:0;
}

body.admin-shell .app-main{
    max-width:none;
    margin:0;
    padding:
        18px
        clamp(14px,2vw,24px)
        28px;
}

body.admin-shell .app-main > *,
body.admin-shell .panel,
body.admin-shell .page-head,
body.admin-shell .table-wrap{
    min-width:0;
    max-width:100%;
}

body.admin-shell .page-head{
    flex-wrap:wrap;
}

body.admin-shell .table-wrap{
    overflow-x:auto;
}


/* =========================================================
   ADMIN PRIVATE MEDIA UPLOAD
   ========================================================= */

.dashboard-media-upload-panel,
.dashboard-media-library-panel{
    position:relative;
    overflow:hidden;
}

.dashboard-media-main-fields{
    display:grid;
    grid-template-columns:
        minmax(0,1fr)
        minmax(220px,.4fr);
    gap:14px;
}

.dashboard-private-badge{
    display:inline-flex;
    align-items:center;
    padding:7px 10px;
    border:
        1px solid
        rgba(16,185,129,.24);
    border-radius:10px;
    background:
        rgba(16,185,129,.08);
    color:#54e2a9;
    font-size:.62rem;
    font-weight:850;
}

.dashboard-media-upload-list{
    display:grid;
    gap:12px;
}

.dashboard-media-upload-row{
    position:relative;
    display:grid;
    grid-template-columns:
        44px
        minmax(0,1fr)
        34px;
    align-items:start;
    gap:12px;
    padding:15px;
    border:
        1px solid
        rgba(110,146,191,.16);
    border-radius:15px;
    background:
        linear-gradient(
            145deg,
            rgba(14,24,39,.86),
            rgba(7,13,23,.94)
        );
}

.dashboard-upload-number{
    display:grid;
    width:44px;
    height:44px;
    place-items:center;
    border:
        1px solid
        rgba(56,189,248,.24);
    border-radius:12px;
    background:
        rgba(56,189,248,.08);
    color:#70dcff;
    font-size:.68rem;
    font-weight:900;
}

.dashboard-upload-fields{
    display:grid;
    grid-template-columns:
        minmax(120px,.45fr)
        minmax(180px,1fr)
        minmax(240px,1.1fr)
        minmax(95px,.3fr);
    align-items:end;
    gap:12px;
}

.dashboard-upload-fields
input[type="file"]{
    padding:10px;
    border:
        1px dashed
        rgba(56,189,248,.32);
    background:
        rgba(56,189,248,.045);
}

.dashboard-upload-fields
input[type="file"]::file-selector-button{
    margin-right:10px;
    padding:8px 11px;
    border:0;
    border-radius:8px;
    background:
        rgba(56,189,248,.15);
    color:#74ddff;
    font-weight:800;
    cursor:pointer;
}

.dashboard-remove-upload{
    display:grid;
    width:34px;
    height:34px;
    place-items:center;
    padding:0;
    border:
        1px solid
        rgba(239,68,68,.24);
    border-radius:10px;
    background:
        rgba(239,68,68,.07);
    color:#ff8181;
    font-size:1.15rem;
    cursor:pointer;
}

.dashboard-add-media-button,
.dashboard-upload-all-button{
    width:100%;
    min-height:48px;
}

.dashboard-add-media-button{
    border-style:dashed;
}

.dashboard-upload-information{
    display:flex;
    align-items:flex-start;
    gap:11px;
    padding:13px;
    border:
        1px solid
        rgba(16,185,129,.17);
    border-radius:12px;
    background:
        rgba(16,185,129,.055);
}

.dashboard-upload-information p{
    margin:0;
    color:#8091a6;
    font-size:.7rem;
    line-height:1.58;
}

.dashboard-admin-media-list{
    display:grid;
    gap:10px;
}

.dashboard-admin-media-card{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:16px;
    padding:15px;
    border:
        1px solid
        rgba(110,146,191,.15);
    border-radius:14px;
    background:
        rgba(8,15,25,.6);
}

.dashboard-media-badges{
    display:flex;
    flex-wrap:wrap;
    gap:6px;
}

.dashboard-video-language,
.dashboard-media-type,
.dashboard-media-state{
    display:inline-flex;
    padding:5px 8px;
    border-radius:8px;
    font-size:.57rem;
    font-weight:850;
}

.dashboard-video-language.language-english{
    background:
        rgba(56,189,248,.1);
    color:#70dcff;
}

.dashboard-video-language.language-hindi{
    background:
        rgba(245,158,11,.1);
    color:#f6c35d;
}

.dashboard-video-language.language-urdu{
    background:
        rgba(16,185,129,.1);
    color:#54e1a8;
}

.dashboard-media-type.type-video{
    background:
        rgba(139,92,246,.1);
    color:#b89aff;
}

.dashboard-media-type.type-audio{
    background:
        rgba(236,72,153,.1);
    color:#ff94ca;
}

.dashboard-media-state.is-visible{
    background:
        rgba(16,185,129,.1);
    color:#54e1a8;
}

.dashboard-media-state.is-hidden{
    background:
        rgba(239,68,68,.1);
    color:#ff8585;
}

.dashboard-admin-media-card h3{
    margin:8px 0 0;
    color:#edf5fc;
    font-size:.9rem;
}

.dashboard-admin-media-card p{
    margin:5px 0 0;
    color:#74859a;
    font-size:.66rem;
}

.dashboard-media-empty-state{
    display:grid;
    min-height:220px;
    place-items:center;
    align-content:center;
    text-align:center;
}

.dashboard-media-empty-state > span{
    font-size:2rem;
}

.dashboard-media-empty-state h3{
    margin:12px 0 0;
}

.dashboard-media-empty-state p{
    margin:6px 0 0;
    color:#75869a;
    font-size:.72rem;
}

.danger-button{
    border-color:
        rgba(239,68,68,.25)
        !important;
    color:#ff8585!important;
}


/* =========================================================
   PREMIUM USER MEDIA DASHBOARD
   ========================================================= */

.member-media-dashboard{
    position:relative;
    min-height:
        calc(100vh - 96px);
    overflow:hidden;
    padding:
        clamp(18px,3vw,38px);
    background:
        radial-gradient(
            circle at 10% 8%,
            rgba(56,189,248,.11),
            transparent 31%
        ),
        radial-gradient(
            circle at 94% 90%,
            rgba(139,92,246,.1),
            transparent 32%
        ),
        linear-gradient(
            145deg,
            #07101b,
            #081321 52%,
            #050a12
        );
}

.member-media-orb{
    position:absolute;
    border-radius:50%;
    filter:blur(24px);
    pointer-events:none;
    animation:
        memberMediaFloat
        10s ease-in-out infinite;
}

.member-media-orb.orb-one{
    width:260px;
    height:260px;
    top:-150px;
    right:8%;
    background:
        rgba(56,189,248,.14);
}

.member-media-orb.orb-two{
    width:220px;
    height:220px;
    bottom:-130px;
    left:4%;
    background:
        rgba(139,92,246,.12);
    animation-delay:-4s;
}

@keyframes memberMediaFloat{

    50%{
        transform:
            translate3d(
                28px,
                -22px,
                0
            )
            scale(1.12);
    }

}

.member-media-hero{
    position:relative;
    z-index:2;
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    gap:22px;
    margin-bottom:24px;
}

.member-media-hero h1{
    margin:7px 0 0;
    color:#f7fbff;
    font-size:
        clamp(2rem,4vw,3.45rem);
    line-height:1.03;
    letter-spacing:-.045em;
}

.member-media-hero p{
    max-width:650px;
    margin:12px 0 0;
    color:#8fa0b6;
    font-size:.9rem;
    line-height:1.65;
}

.member-secure-pill{
    display:flex;
    align-items:center;
    gap:8px;
    flex:0 0 auto;
    padding:9px 13px;
    border:
        1px solid
        rgba(16,185,129,.25);
    border-radius:999px;
    background:
        rgba(16,185,129,.075);
    color:#55e3aa;
    font-size:.67rem;
    font-weight:850;
}

.member-secure-pill span{
    width:8px;
    height:8px;
    border-radius:50%;
    background:#10b981;
    box-shadow:
        0 0 15px
        rgba(16,185,129,.8);
}

.member-media-shell{
    position:relative;
    z-index:2;
    display:grid;
    grid-template-columns:
        minmax(260px,.34fr)
        minmax(0,1fr);
    gap:18px;
}

.member-media-sidebar,
.member-media-stage{
    min-width:0;
    border:
        1px solid
        rgba(112,149,194,.18);
    border-radius:23px;
    background:
        linear-gradient(
            145deg,
            rgba(18,30,49,.95),
            rgba(6,12,22,.985)
        );
    box-shadow:
        0 28px 75px
            rgba(0,0,0,.36),
        inset 0 1px
            rgba(255,255,255,.035);
}

.member-media-sidebar{
    padding:20px;
}

.member-media-stage{
    padding:20px;
}

.member-media-heading small,
.member-media-stage-head small{
    color:#6edcff;
    font-size:.58rem;
    font-weight:900;
    letter-spacing:.13em;
}

.member-media-heading h2{
    margin:6px 0 0;
    color:#f2f7fc;
    font-size:1.35rem;
}

.member-language-control{
    display:block;
    margin-top:20px;
}

.member-language-control > span{
    display:block;
    margin-bottom:7px;
    color:#8292a7;
    font-size:.66rem;
    font-weight:780;
}

.member-language-control select{
    min-height:47px;
    border-color:
        rgba(56,189,248,.28);
    background:#091522;
    color:#edf6fc;
    font-weight:800;
}

.member-media-tabs{
    display:grid;
    grid-template-columns:
        1fr 1fr;
    gap:8px;
    margin-top:14px;
}

.member-media-tab{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:7px;
    min-height:42px;
    border:
        1px solid
        rgba(112,149,194,.16);
    border-radius:11px;
    background:
        rgba(8,15,26,.62);
    color:#8495aa;
    font-weight:820;
    cursor:pointer;
}

.member-media-tab.active,
.member-media-tab:hover{
    border-color:
        rgba(56,189,248,.38);
    background:
        rgba(56,189,248,.09);
    color:#72ddff;
}

.member-media-lists{
    margin-top:14px;
}

.member-media-list{
    display:grid;
    gap:8px;
}

.member-media-item{
    display:grid;
    grid-template-columns:
        34px
        minmax(0,1fr)
        22px;
    align-items:center;
    gap:10px;
    width:100%;
    padding:11px;
    border:
        1px solid
        rgba(112,149,194,.13);
    border-radius:12px;
    background:
        rgba(7,14,24,.7);
    color:#fff;
    text-align:left;
    cursor:pointer;
    transition:
        transform .24s ease,
        border-color .24s ease,
        background .24s ease;
}

.member-media-item:hover,
.member-media-item.active{
    transform:
        translateX(4px);
    border-color:
        rgba(56,189,248,.4);
    background:
        rgba(56,189,248,.09);
}

.member-media-index{
    display:grid;
    width:34px;
    height:34px;
    place-items:center;
    border-radius:10px;
    background:
        rgba(56,189,248,.09);
    color:#72dcff;
    font-size:.62rem;
    font-weight:900;
}

.member-media-item strong{
    overflow:hidden;
    color:#edf4fb;
    font-size:.75rem;
    line-height:1.35;
    white-space:nowrap;
    text-overflow:ellipsis;
}

.member-media-item i{
    color:#71dcff;
    font-size:.72rem;
    font-style:normal;
}

.member-media-empty-list{
    padding:16px;
    border:
        1px dashed
        rgba(112,149,194,.19);
    border-radius:12px;
    color:#74859b;
    font-size:.72rem;
    line-height:1.5;
    text-align:center;
}

.member-media-stage-head{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:14px;
    margin-bottom:14px;
}

.member-media-stage-head h2{
    margin:5px 0 0;
    color:#f4f8fc;
    font-size:1.12rem;
}

.member-media-stage-head > span{
    padding:7px 10px;
    border:
        1px solid
        rgba(56,189,248,.2);
    border-radius:9px;
    background:
        rgba(56,189,248,.06);
    color:#70dcff;
    font-size:.58rem;
    font-weight:850;
}

.member-media-player{
    position:relative;
    display:grid;
    width:100%;
    min-height:430px;
    overflow:hidden;
    border:
        1px solid
        rgba(56,189,248,.19);
    border-radius:18px;
    background:#02060b;
    box-shadow:
        0 26px 65px
            rgba(0,0,0,.46),
        0 0 38px
            rgba(56,189,248,.055);
}

.member-media-player.is-video{
    min-height:0;
    aspect-ratio:16/9;
}

.member-media-player video{
    display:block;
    width:100%;
    height:100%;
    object-fit:contain;
    background:#000;
}

.member-media-player.is-audio{
    align-content:center;
    gap:22px;
    padding:
        clamp(22px,5vw,54px);
    background:
        radial-gradient(
            circle at center,
            rgba(56,189,248,.12),
            transparent 40%
        ),
        linear-gradient(
            145deg,
            #07101b,
            #02060b
        );
}

.member-media-player audio{
    width:100%;
}

.member-audio-visual{
    position:relative;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    min-height:220px;
}

.member-audio-visual span{
    width:9px;
    height:55px;
    border-radius:999px;
    background:
        linear-gradient(
            #70dcff,
            #8b5cf6
        );
    box-shadow:
        0 0 20px
        rgba(56,189,248,.22);
    animation:
        memberAudioBars
        1.15s ease-in-out
        infinite alternate;
}

.member-audio-visual span:nth-child(2){
    height:95px;
    animation-delay:-.3s;
}

.member-audio-visual span:nth-child(3){
    height:135px;
    animation-delay:-.6s;
}

.member-audio-visual span:nth-child(4){
    height:82px;
    animation-delay:-.2s;
}

.member-audio-visual span:nth-child(5){
    height:48px;
    animation-delay:-.5s;
}

.member-audio-visual strong{
    position:absolute;
    bottom:0;
    color:#dceaf5;
    font-size:.83rem;
}

@keyframes memberAudioBars{

    to{
        transform:
            scaleY(.55);
        opacity:.7;
    }

}

.member-media-empty-stage{
    display:grid;
    min-height:430px;
    place-items:center;
    align-content:center;
    text-align:center;
}

.member-media-empty-stage > span{
    display:grid;
    width:70px;
    height:70px;
    place-items:center;
    border-radius:50%;
    background:
        rgba(56,189,248,.1);
    color:#72dcff;
    font-size:1.35rem;
}

.member-media-empty-stage h2{
    margin:15px 0 0;
    color:#eef5fc;
}

.member-media-empty-stage p{
    margin:7px 0 0;
    color:#75869b;
    font-size:.75rem;
}

@media(max-width:1100px){

    .dashboard-upload-fields{
        grid-template-columns:
            1fr 1fr;
    }

}

@media(max-width:950px){

    .dashboard-media-main-fields,
    .member-media-shell{
        grid-template-columns:1fr;
    }

}

@media(max-width:650px){

    body.admin-shell .app-main{
        padding:
            14px 10px 24px;
    }

    .dashboard-media-upload-row{
        grid-template-columns:
            38px minmax(0,1fr);
        padding:12px 9px;
    }

    .dashboard-upload-number{
        width:38px;
        height:38px;
    }

    .dashboard-upload-fields{
        grid-template-columns:1fr;
        padding-right:28px;
    }

    .dashboard-remove-upload{
        position:absolute;
        top:10px;
        right:9px;
    }

    .dashboard-admin-media-card{
        align-items:flex-start;
        flex-direction:column;
    }

    .member-media-dashboard{
        padding:16px 9px;
    }

    .member-media-hero{
        display:block;
    }

    .member-secure-pill{
        display:inline-flex;
        margin-top:14px;
    }

    .member-media-sidebar,
    .member-media-stage{
        padding:13px 10px;
        border-radius:17px;
    }

    .member-media-stage-head{
        display:block;
    }

    .member-media-stage-head > span{
        display:inline-block;
        margin-top:8px;
    }

    .member-media-player{
        min-height:300px;
    }

    .member-media-player.is-video{
        min-height:0;
    }

}

@media(
    prefers-reduced-motion:reduce
){

    .member-media-orb,
    .member-audio-visual span{
        animation:none!important;
    }

}
/* ===== PREMIUM CLARITY CARDS ===== */


.clarity-grid{

display:grid;
grid-template-columns:repeat(3,1fr);
gap:24px;

}



.clarity-card{

background:
linear-gradient(
145deg,
rgba(15,23,42,.9),
rgba(2,6,23,.8)
);

border:1px solid rgba(56,189,248,.25);

border-radius:26px;

padding:30px;

transition:.4s;

position:relative;

overflow:hidden;

}



.clarity-card:hover{

transform:translateY(-10px);

box-shadow:
0 20px 60px rgba(56,189,248,.25);

}



.clarity-icon{

font-size:42px;

color:#38bdf8;

margin-bottom:20px;

}



.clarity-card h3{

color:#fff;

font-size:22px;

}



.clarity-card p{

color:#94a3b8;

line-height:1.6;

}



/* SUCCESS STORY */


.success-result-grid{

display:grid;

grid-template-columns:repeat(4,1fr);

gap:18px;

margin-top:30px;

}



.result-box{

padding:22px;

border-radius:20px;

background:
rgba(16,185,129,.12);

border:1px solid rgba(16,185,129,.25);

}



.result-box strong{

display:block;

font-size:32px;

color:#10b981;

}



.result-box span{

color:#cbd5e1;

}



.verified-result-badge{

display:inline-block;

padding:8px 15px;

border-radius:50px;

background:#2563eb;

color:#fff;

font-size:13px;

}



@media(max-width:768px){


.clarity-grid{

grid-template-columns:1fr;

}



.success-result-grid{

grid-template-columns:1fr 1fr;

}


}



@media(max-width:480px){


.success-result-grid{

grid-template-columns:1fr;

}


}
.afc-financial-result{
display:grid;
grid-template-columns:repeat(4,1fr);
gap:14px;
margin:25px 0;
}


.afc-financial-card{
background:rgba(255,255,255,.04);
border:1px solid rgba(255,255,255,.08);
border-radius:18px;
padding:18px;
backdrop-filter:blur(15px);
}


.afc-financial-card span{
display:block;
font-size:12px;
opacity:.7;
margin-bottom:8px;
}


.afc-financial-card strong{
font-size:26px;
color:#38f2a1;
}


.afc-financial-card.loss strong{
color:#ff6878;
}


.afc-financial-card.net strong{
color:#38bdf8;
}


@media(max-width:768px){

.afc-financial-result{
grid-template-columns:repeat(2,1fr);
}

}


@media(max-width:480px){

.afc-financial-result{
grid-template-columns:1fr;
}

}
.afc-financial-result{
display:grid;
grid-template-columns:repeat(4,1fr);
gap:15px;
margin:25px 0;
position:relative;
z-index:2;
}


.afc-financial-result article{
background:#101827;
border:1px solid rgba(255,255,255,.08);
border-radius:16px;
padding:18px;
}


.afc-financial-result span{
font-size:12px;
display:block;
opacity:.7;
}


.afc-financial-result strong{
font-size:24px;
margin-top:8px;
display:block;
color:#34d399;
}


.afc-financial-result .loss strong{
color:#fb7185;
}


@media(max-width:768px){

.afc-financial-result{
grid-template-columns:repeat(2,1fr);
}

}

/* Keep financial cards inside each success-story column. */
.afc-ss-profile .afc-financial-result{
    grid-template-columns:repeat(2,minmax(0,1fr));
}

.afc-ss-performance > .afc-financial-result{
    grid-template-columns:repeat(4,minmax(0,1fr));
}

.afc-financial-result > *{
    min-width:0;
}

.afc-financial-result strong{
    overflow-wrap:anywhere;
    font-size:clamp(1.05rem,1.8vw,1.5rem);
}

@media(max-width:1100px){
    .afc-ss-performance > .afc-financial-result{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media(max-width:768px){
    .afc-ss-profile .afc-financial-result,
    .afc-ss-performance > .afc-financial-result{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media(max-width:360px){
    .afc-ss-profile .afc-financial-result,
    .afc-ss-performance > .afc-financial-result{
        grid-template-columns:1fr;
    }
}

/* Final Built For Clarity layout: one admin-managed 3 × 2 grid. */
.premium-principles-heading{
    max-width:760px;
    margin:0 auto 34px;
    text-align:center;
}

.premium-principles-heading h2{
    margin:8px 0 12px;
}

.premium-principles-heading p{
    margin:0 auto;
    color:#93a1b5;
    line-height:1.7;
}

.premium-principles-grid{
    grid-template-columns:repeat(3,minmax(0,1fr));
}

@media(max-width:1024px){
    .premium-principles-grid{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media(max-width:380px){
    .premium-principles-grid{
        grid-template-columns:1fr;
    }
}

/* Admin-managed dashboard language list. */
.dashboard-language-manager-panel{
    margin-bottom:24px;
}

.dashboard-language-list{
    display:grid;
    gap:12px;
}

.dashboard-language-row{
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    gap:14px;
    align-items:end;
    padding:14px;
    border:1px solid rgba(118,148,190,.22);
    border-radius:15px;
    background:rgba(10,18,30,.55);
}

.dashboard-language-row label{
    margin:0;
}

.dashboard-language-code{
    min-width:150px;
    padding:12px 14px;
    border-radius:12px;
    border:1px solid rgba(56,189,248,.2);
    background:rgba(14,116,144,.08);
    color:#8fdcff;
    font-size:.82rem;
    overflow-wrap:anywhere;
}

.dashboard-language-actions{
    justify-content:space-between;
    align-items:center;
}

.dashboard-remove-language{
    width:42px;
    height:42px;
    border-radius:12px;
    border:1px solid rgba(248,113,113,.38);
    background:rgba(127,29,29,.16);
    color:#ff8d99;
    cursor:pointer;
    font-size:1.25rem;
}

.dashboard-remove-language:hover{
    background:rgba(127,29,29,.28);
}

.member-media-empty-stage:empty{
    min-height:clamp(260px,45vw,560px);
}

@media(max-width:700px){
    .dashboard-language-row{
        grid-template-columns:1fr;
        align-items:stretch;
    }

    .dashboard-language-code{
        min-width:0;
    }

    .dashboard-language-actions{
        align-items:stretch;
    }

    .dashboard-language-actions .button{
        width:100%;
    }
}

.dashboard-chunk-progress{
    display:grid;
    gap:10px;
    padding:15px 17px;
    border:1px solid rgba(56,189,248,.28);
    border-radius:15px;
    background:rgba(14,116,144,.08);
}

.dashboard-chunk-progress[hidden]{
    display:none;
}

.dashboard-chunk-progress-head{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
}

.dashboard-chunk-progress-head strong{
    color:#d9f4ff;
}

.dashboard-chunk-progress-head span{
    color:#7dd3fc;
    font-weight:800;
}

.dashboard-chunk-progress progress{
    width:100%;
    height:12px;
    accent-color:#38bdf8;
}

.dashboard-chunk-progress small{
    color:#8fa7bd;
    line-height:1.55;
}




/* User dashboard media controls must always remain clickable. */
.member-media-sidebar{
    position:relative;
    isolation:isolate;
}

.member-media-lists,
.member-media-list,
.member-media-item{
    position:relative;
    z-index:6;
    pointer-events:auto;
}

.member-media-item{
    touch-action:manipulation;
    user-select:none;
}

/* ================================================================
   COMPLETE MEDIA LIST FIX
   ================================================================ */


.member-media-list{
    max-height:460px;
    overflow-y:auto;
    overscroll-behavior:contain;
    scrollbar-width:thin;
    padding-right:3px;
}

.member-media-item{
    position:relative;
    z-index:8;
    pointer-events:auto!important;
}

.member-media-item strong{
    white-space:normal;
    overflow-wrap:anywhere;
    text-overflow:clip;
}

@media(max-width:720px){
    .member-media-list{
        max-height:none;
        overflow:visible;
        padding-right:0;
    }
}

/* ================================================================
   FINAL COMMON FONT RESTORE — desktop + mobile + admin + member area
   ================================================================ */
:root{
    --font:'Inter','Noto Sans Devanagari','Noto Sans Arabic',
        system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',Arial,sans-serif;
}

html,
body,
body.app-shell,
body.admin-shell{
    font-family:'Inter','Noto Sans Devanagari','Noto Sans Arabic',
        system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',Arial,sans-serif!important;
    font-feature-settings:normal!important;
    font-optical-sizing:auto;
    font-synthesis:weight style;
}

p,
span,
a,
label,
table,
th,
td,
li,
small,
strong,
button,
input,
select,
textarea,
option,
h1,
h2,
h3,
h4,
h5,
h6,
.brand,
.eyebrow,
.button,
.sidebar nav a,
.app-topbar,
.member-media-tab,
.member-media-item,
.metric strong,
.stat strong,
.kpi-value{
    font-family:inherit!important;
}


/* ================================================================
   CRYPTOMUS CHECKOUT + VERIFIED RECEIPT
   ================================================================ */
.payment-shell{
    width:min(1120px,calc(100% - 32px));
    margin:clamp(44px,7vw,96px) auto;
    display:grid;
    grid-template-columns:minmax(0,1.55fr) minmax(280px,.75fr);
    gap:22px;
    align-items:start;
}
.payment-card{
    position:relative;
    overflow:hidden;
    border:1px solid color-mix(in srgb,var(--primary) 24%,var(--border));
    border-radius:calc(var(--card-radius) + 4px);
    background:
        radial-gradient(circle at 92% 8%,color-mix(in srgb,var(--primary) 15%,transparent),transparent 34%),
        color-mix(in srgb,var(--surface) 96%,transparent);
    box-shadow:var(--shadow);
}
.payment-card-main{padding:clamp(26px,5vw,54px)}
.payment-side-card{padding:30px;position:sticky;top:92px}
.payment-kicker{font-size:.74rem;font-weight:800;letter-spacing:.18em;color:var(--primary);margin-bottom:10px}
.payment-card h1{margin:0;max-width:780px;font-size:clamp(2rem,5vw,4.5rem);line-height:.98;letter-spacing:-.045em}
.payment-headline{max-width:760px;margin:18px 0 0;color:var(--muted);font-size:clamp(1rem,1.8vw,1.18rem);line-height:1.7}
.payment-summary{margin:32px 0 22px;border:1px solid var(--border);border-radius:18px;overflow:hidden;background:color-mix(in srgb,var(--background) 35%,transparent)}
.payment-summary>div{display:flex;gap:18px;align-items:center;justify-content:space-between;padding:16px 18px;border-bottom:1px solid var(--border)}
.payment-summary>div:last-child{border-bottom:0}
.payment-summary span{color:var(--muted);font-size:.84rem}
.payment-summary strong{text-align:right;overflow-wrap:anywhere}
.payment-trust-row{display:flex;flex-wrap:wrap;gap:10px;margin:18px 0 28px}
.payment-trust-row span{padding:8px 11px;border:1px solid color-mix(in srgb,var(--success) 28%,var(--border));border-radius:999px;background:color-mix(in srgb,var(--success) 7%,transparent);font-size:.78rem}
.payment-action-form{margin:0}
.payment-primary{min-height:52px;justify-content:center;gap:10px}
.payment-primary b{font-size:1.1rem}
.payment-fineprint{margin:14px 0 0;color:var(--muted);font-size:.78rem;line-height:1.6}
.payment-unavailable{display:grid;gap:5px;margin-top:26px;padding:18px;border:1px solid color-mix(in srgb,var(--warning) 32%,var(--border));border-radius:16px;background:color-mix(in srgb,var(--warning) 8%,transparent)}
.payment-unavailable span{color:var(--muted)}
.payment-icon-lock,.payment-status-orb{display:grid;place-items:center;width:58px;height:58px;border:1px solid color-mix(in srgb,var(--primary) 45%,var(--border));border-radius:18px;background:color-mix(in srgb,var(--primary) 10%,transparent);color:var(--primary);font-size:1.35rem;margin-bottom:24px;box-shadow:inset 0 0 24px color-mix(in srgb,var(--primary) 8%,transparent)}
.payment-side-card h2{margin:0 0 12px;font-size:1.28rem}
.payment-side-card p{color:var(--muted);line-height:1.65}
.payment-steps{list-style:none;padding:0;margin:22px 0 0;display:grid;gap:18px}
.payment-steps li{display:grid;grid-template-columns:34px 1fr;gap:12px;align-items:start;color:var(--muted);line-height:1.55}
.payment-steps b{display:grid;place-items:center;width:32px;height:32px;border-radius:10px;background:color-mix(in srgb,var(--primary) 11%,transparent);border:1px solid color-mix(in srgb,var(--primary) 28%,var(--border));color:var(--primary)}
.payment-success-shell .payment-card-main{text-align:left}
.payment-status-orb{border-radius:50%;width:68px;height:68px;font-size:1.65rem}
.payment-status-orb.is-paid{color:var(--success);border-color:color-mix(in srgb,var(--success) 46%,var(--border));background:color-mix(in srgb,var(--success) 10%,transparent)}
.payment-status-orb.is-pending{color:var(--warning);border-color:color-mix(in srgb,var(--warning) 42%,var(--border));animation:paymentPulse 1.8s ease-in-out infinite}
.payment-order-summary{display:grid;grid-template-columns:1fr 1fr}
.payment-order-summary>div:nth-child(odd){border-right:1px solid var(--border)}
.payment-order-summary>div:nth-last-child(-n+2){border-bottom:0}
.payment-success-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:24px}
.payment-success-actions[hidden],.payment-access-note[hidden],.payment-pending-note[hidden]{display:none!important}
.payment-whatsapp{border-color:color-mix(in srgb,var(--success) 36%,var(--border))}
.payment-access-note{display:grid;gap:5px;margin-top:18px;padding:16px 18px;border:1px solid color-mix(in srgb,var(--success) 28%,var(--border));border-radius:16px;background:color-mix(in srgb,var(--success) 7%,transparent)}
.payment-access-note span{color:var(--muted);line-height:1.55;font-size:.88rem}
.payment-pending-note{display:flex;align-items:center;gap:10px;margin-top:20px;color:var(--muted)}
.payment-spinner{width:18px;height:18px;border:2px solid var(--border);border-top-color:var(--primary);border-radius:50%;animation:paymentSpin .8s linear infinite}
@keyframes paymentSpin{to{transform:rotate(360deg)}}
@keyframes paymentPulse{50%{transform:scale(1.045);box-shadow:0 0 0 10px color-mix(in srgb,var(--warning) 5%,transparent)}}
@media(max-width:820px){
    .payment-shell{grid-template-columns:1fr;width:min(100% - 22px,720px);margin:28px auto 56px}
    .payment-side-card{position:relative;top:auto}
    .payment-order-summary{grid-template-columns:1fr}
    .payment-order-summary>div{border-right:0!important;border-bottom:1px solid var(--border)!important}
    .payment-order-summary>div:last-child{border-bottom:0!important}
    .payment-success-actions{display:grid}
    .payment-success-actions .button{width:100%;justify-content:center}
}

/* ================================================================
   ADMIN CONTROL CENTER V2 — permanent dark workspace + premium 3D UI
   ================================================================ */
body.admin-shell{
    --background:#05070b;
    --surface:#0d1219;
    --text:#f3f6fb;
    --muted:#8f9bad;
    --border:#202a37;
    --admin-surface:#0c1118;
    --admin-surface-2:#111823;
    --admin-line:rgba(148,163,184,.13);
    --admin-soft-line:rgba(148,163,184,.075);
    --admin-shadow:0 22px 55px rgba(0,0,0,.28);
    --admin-rx:0deg;
    --admin-ry:0deg;
    --admin-mx:50%;
    --admin-my:50%;
    background:#05070b!important;
    color:#f3f6fb;
    color-scheme:dark;
}

@media(min-width:1025px){
    body.admin-shell{padding-left:268px}
    body.admin-shell .sidebar{width:268px}
}

body.admin-shell .sidebar{
    background:
        radial-gradient(circle at 28px 50px,color-mix(in srgb,var(--primary) 10%,transparent),transparent 170px),
        linear-gradient(180deg,#090d13 0%,#070a0f 58%,#05070b 100%);
    border-right:1px solid rgba(148,163,184,.12);
    padding:18px 12px 26px;
    box-shadow:18px 0 48px rgba(0,0,0,.16);
    scrollbar-width:thin;
    scrollbar-color:rgba(148,163,184,.25) transparent;
}

body.admin-shell .sidebar::-webkit-scrollbar{width:7px}
body.admin-shell .sidebar::-webkit-scrollbar-track{background:transparent}
body.admin-shell .sidebar::-webkit-scrollbar-thumb{background:rgba(148,163,184,.22);border-radius:999px}

body.admin-shell .sidebar .brand{
    min-height:54px;
    padding:3px 9px 20px;
    color:var(--text);
    font-weight:650;
    letter-spacing:-.015em;
}

body.admin-shell .sidebar .brand-mark{
    box-shadow:0 10px 30px color-mix(in srgb,var(--secondary) 24%,transparent);
}

.admin-icon-sprite{
    position:absolute;
    width:0;
    height:0;
    overflow:hidden;
    pointer-events:none;
}

body.admin-shell .sidebar nav{
    display:block;
}

body.admin-shell .sidebar-group{
    display:grid;
    gap:3px;
    margin:0 0 17px;
}

body.admin-shell .sidebar-group-label{
    padding:0 11px 6px;
    color:#59677a;
    font-size:.64rem;
    font-weight:600;
    letter-spacing:.15em;
    text-transform:uppercase;
}

body.admin-shell .sidebar nav a.admin-nav-link{
    display:grid;
    grid-template-columns:31px minmax(0,1fr) 8px;
    align-items:center;
    gap:9px;
    min-height:42px;
    padding:5px 10px 5px 7px;
    border:1px solid transparent;
    border-radius:11px;
    color:#8997aa;
    font-size:.81rem;
    font-weight:500;
    line-height:1.22;
    letter-spacing:0;
    background:transparent;
    transition:
        color .24s ease,
        border-color .24s ease,
        background .24s ease,
        transform .24s cubic-bezier(.16,1,.3,1),
        box-shadow .24s ease;
}

body.admin-shell .sidebar nav a.admin-nav-link::before{display:none}

body.admin-shell .admin-nav-icon{
    width:31px;
    height:31px;
    display:grid;
    place-items:center;
    border:1px solid rgba(148,163,184,.10);
    border-radius:9px;
    background:rgba(255,255,255,.022);
    color:#74839a;
    transition:
        transform .28s cubic-bezier(.16,1,.3,1),
        color .25s ease,
        border-color .25s ease,
        background .25s ease,
        box-shadow .25s ease;
}

body.admin-shell .admin-nav-icon svg{
    width:17px;
    height:17px;
    fill:none;
    stroke:currentColor;
    stroke-width:1.7;
    stroke-linecap:round;
    stroke-linejoin:round;
    overflow:visible;
}

body.admin-shell .admin-nav-dot{
    width:5px;
    height:5px;
    border-radius:999px;
    background:transparent;
    box-shadow:none;
    transition:background .25s ease,box-shadow .25s ease,transform .25s ease;
}

body.admin-shell .sidebar nav a.admin-nav-link:hover,
body.admin-shell .sidebar nav a.admin-nav-link:focus-visible{
    padding-left:7px;
    color:#e9eef7;
    background:rgba(255,255,255,.035);
    border-color:rgba(148,163,184,.10);
    transform:translateX(2px);
}

body.admin-shell .sidebar nav a.admin-nav-link:hover .admin-nav-icon,
body.admin-shell .sidebar nav a.admin-nav-link:focus-visible .admin-nav-icon{
    color:color-mix(in srgb,var(--primary) 72%,#fff);
    border-color:color-mix(in srgb,var(--primary) 25%,rgba(148,163,184,.12));
    background:color-mix(in srgb,var(--primary) 7%,rgba(255,255,255,.025));
    transform:translateY(-1px) rotate(-3deg) scale(1.04);
}

body.admin-shell .sidebar nav a.admin-nav-link.active{
    color:#f7f9fc;
    background:
        linear-gradient(90deg,color-mix(in srgb,var(--primary) 10%,transparent),rgba(255,255,255,.025));
    border-color:color-mix(in srgb,var(--primary) 20%,rgba(148,163,184,.11));
    box-shadow:inset 0 0 26px color-mix(in srgb,var(--primary) 4%,transparent);
}

body.admin-shell .sidebar nav a.admin-nav-link.active .admin-nav-icon{
    color:color-mix(in srgb,var(--primary) 76%,#fff);
    border-color:color-mix(in srgb,var(--primary) 34%,var(--border));
    background:color-mix(in srgb,var(--primary) 10%,#0a0f16);
    box-shadow:0 7px 20px color-mix(in srgb,var(--primary) 10%,transparent);
}

body.admin-shell .sidebar nav a.admin-nav-link.active .admin-nav-dot{
    background:var(--primary);
    box-shadow:0 0 12px color-mix(in srgb,var(--primary) 70%,transparent);
    transform:scale(1.15);
}

body.admin-shell .app-topbar{
    height:62px;
    padding:0 clamp(14px,2vw,24px);
    background:rgba(5,7,11,.78);
    border-bottom:1px solid rgba(148,163,184,.11);
    backdrop-filter:blur(22px) saturate(135%);
    -webkit-backdrop-filter:blur(22px) saturate(135%);
    box-shadow:0 10px 32px rgba(0,0,0,.12);
}

body.admin-shell .topbar-title-wrap{
    display:flex;
    align-items:center;
    gap:10px;
    min-width:0;
}

body.admin-shell .topbar-title{
    color:#dfe6f1;
    font-size:.83rem;
    font-weight:520;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
}

body.admin-shell .topbar-live-dot{
    width:7px;
    height:7px;
    flex:0 0 auto;
    border-radius:999px;
    background:var(--success);
    box-shadow:0 0 0 4px color-mix(in srgb,var(--success) 8%,transparent),0 0 14px color-mix(in srgb,var(--success) 38%,transparent);
    animation:adminLivePulse 2.6s ease-in-out infinite;
}

body.admin-shell .admin-user-chip{
    display:inline-flex;
    align-items:center;
    gap:8px;
    padding:4px 9px 4px 5px;
    border:1px solid rgba(148,163,184,.12);
    border-radius:999px;
    background:rgba(255,255,255,.025);
    color:#9ba8ba;
    font-size:.76rem;
    font-weight:500;
}

body.admin-shell .admin-user-avatar{
    width:27px;
    height:27px;
    display:grid;
    place-items:center;
    border-radius:50%;
    background:linear-gradient(135deg,color-mix(in srgb,var(--secondary) 80%,#111),color-mix(in srgb,var(--primary) 76%,#111));
    color:#fff;
    font-size:.67rem;
    font-weight:650;
    box-shadow:0 5px 16px rgba(0,0,0,.22);
}

body.admin-shell .app-main{
    position:relative;
    isolation:isolate;
    min-height:calc(100vh - 62px);
    padding:24px clamp(14px,2.2vw,30px) 40px;
    background:
        radial-gradient(circle at 12% -10%,color-mix(in srgb,var(--secondary) 6%,transparent),transparent 30%),
        radial-gradient(circle at 88% 5%,color-mix(in srgb,var(--primary) 5%,transparent),transparent 28%),
        #05070b;
}

body.admin-shell .app-main::before{
    content:"";
    position:fixed;
    z-index:-1;
    inset:62px 0 0 0;
    pointer-events:none;
    background-image:
        linear-gradient(rgba(148,163,184,.026) 1px,transparent 1px),
        linear-gradient(90deg,rgba(148,163,184,.026) 1px,transparent 1px);
    background-size:44px 44px;
    -webkit-mask-image:linear-gradient(to bottom,rgba(0,0,0,.72),transparent 82%);
    mask-image:linear-gradient(to bottom,rgba(0,0,0,.72),transparent 82%);
    animation:adminGridDrift 22s linear infinite;
}

@media(min-width:1025px){
    body.admin-shell .app-main::before{left:268px}
}

body.admin-shell .page-head{
    position:relative;
    z-index:1;
    align-items:center;
    min-height:76px;
    margin:0 0 18px;
    padding:4px 2px 10px;
}

body.admin-shell .page-head h1{
    margin:0;
    color:#f4f7fb;
    font-size:clamp(1.55rem,2.7vw,2.15rem);
    font-weight:620!important;
    line-height:1.08;
    letter-spacing:-.035em;
}

body.admin-shell .page-head p{
    max-width:820px;
    margin:7px 0 0;
    color:#8290a4;
    font-size:.84rem;
    font-weight:400;
    line-height:1.6;
}

body.admin-shell .eyebrow{
    margin:0 0 7px;
    color:color-mix(in srgb,var(--primary) 74%,#cbd5e1);
    font-size:.64rem;
    font-weight:600!important;
    letter-spacing:.16em;
}

body.admin-shell h2,
body.admin-shell h3,
body.admin-shell h4{
    color:#edf2f8;
    font-weight:600!important;
    letter-spacing:-.018em;
}

body.admin-shell h2{font-size:clamp(1.08rem,2vw,1.42rem)}
body.admin-shell h3{font-size:1rem}

body.admin-shell p,
body.admin-shell li,
body.admin-shell td,
body.admin-shell label,
body.admin-shell small{
    font-weight:400;
}

body.admin-shell strong{
    font-weight:620;
}

body.admin-shell .panel,
body.admin-shell .filter-bar,
body.admin-shell .table-wrap{
    border-color:rgba(148,163,184,.12);
    background:
        linear-gradient(145deg,rgba(255,255,255,.034),rgba(255,255,255,.012) 45%,rgba(255,255,255,.018)),
        #0a0f16;
    box-shadow:var(--admin-shadow),inset 0 1px 0 rgba(255,255,255,.025);
}

body.admin-shell .panel{
    position:relative;
    border-radius:18px;
}

body.admin-shell .panel::after{
    content:"";
    position:absolute;
    inset:0;
    pointer-events:none;
    border-radius:inherit;
    background:radial-gradient(360px circle at var(--admin-mx) var(--admin-my),color-mix(in srgb,var(--primary) 6%,transparent),transparent 62%);
    opacity:0;
    transition:opacity .28s ease;
}

body.admin-shell .panel.admin-motion-surface:hover::after{opacity:1}

body.admin-shell .panel.admin-motion-surface{
    transform:perspective(1500px) rotateX(var(--admin-rx)) rotateY(var(--admin-ry)) translateZ(0);
    transform-style:preserve-3d;
    transition:
        transform .28s cubic-bezier(.16,1,.3,1),
        border-color .28s ease,
        box-shadow .28s ease;
}

body.admin-shell .panel.admin-motion-surface:hover{
    border-color:color-mix(in srgb,var(--primary) 18%,rgba(148,163,184,.12));
    box-shadow:0 28px 70px rgba(0,0,0,.34),0 0 0 1px color-mix(in srgb,var(--primary) 3%,transparent),inset 0 1px 0 rgba(255,255,255,.035);
}

body.admin-shell .panel.admin-motion-surface:focus-within{
    transform:none!important;
}

body.admin-shell input,
body.admin-shell select,
body.admin-shell textarea{
    min-height:42px;
    border:1px solid rgba(148,163,184,.15);
    border-radius:11px;
    background:#080d13;
    color:#e8edf5;
    font-size:.86rem;
    font-weight:400;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.018);
}

body.admin-shell input::placeholder,
body.admin-shell textarea::placeholder{color:#566477}

body.admin-shell input:hover,
body.admin-shell select:hover,
body.admin-shell textarea:hover{
    border-color:rgba(148,163,184,.25);
}

body.admin-shell input:focus,
body.admin-shell select:focus,
body.admin-shell textarea:focus{
    border-color:color-mix(in srgb,var(--secondary) 52%,var(--border));
    box-shadow:0 0 0 3px color-mix(in srgb,var(--secondary) 10%,transparent),0 8px 24px rgba(0,0,0,.16);
    outline:none;
}

body.admin-shell label{
    color:#8d9bae;
    font-size:.79rem;
    font-weight:450;
}

body.admin-shell .button{
    min-height:40px;
    border-radius:11px;
    font-size:.82rem;
    font-weight:620;
    letter-spacing:.005em;
    box-shadow:0 8px 24px color-mix(in srgb,var(--primary) 10%,transparent),0 3px 10px rgba(0,0,0,.2);
}

body.admin-shell .button.ghost{
    border-color:rgba(148,163,184,.14);
    background:rgba(255,255,255,.025);
    color:#b5c0ce;
    box-shadow:none;
}

body.admin-shell .button.ghost:hover,
body.admin-shell .button.ghost:focus-visible{
    color:#f1f5f9;
    border-color:rgba(148,163,184,.25);
    background:rgba(255,255,255,.05);
}

body.admin-shell .table-wrap{
    border-radius:16px;
}

body.admin-shell table{
    background:transparent;
    color:#cbd5e1;
}

body.admin-shell th{
    background:#0a0f16;
    color:#6f7d90;
    border-color:rgba(148,163,184,.11);
    font-size:.68rem;
    font-weight:600;
    letter-spacing:.08em;
}

body.admin-shell td{
    border-color:rgba(148,163,184,.08);
    color:#c4cedb;
}

body.admin-shell .table-wrap table tbody tr:hover{
    background:color-mix(in srgb,var(--primary) 3.5%,rgba(255,255,255,.012));
}

body.admin-shell code,
body.admin-shell pre{
    border-color:rgba(148,163,184,.10);
    color:#aebbd0;
    background:#070b10;
}

body.admin-shell .flash{
    border:1px solid rgba(148,163,184,.14);
    border-radius:13px;
    background:#0a0f16;
    box-shadow:0 12px 34px rgba(0,0,0,.2);
}

body.admin-shell .flash.success{
    color:#87e8a7;
    border-color:rgba(74,222,128,.22);
    background:rgba(22,101,52,.11);
}

body.admin-shell .flash.danger{
    color:#ff9aa5;
    border-color:rgba(248,113,113,.24);
    background:rgba(127,29,29,.12);
}

body.admin-shell .status,
body.admin-shell .chip{
    background:#090e14;
    border-color:rgba(148,163,184,.14);
    font-weight:500;
}

body.admin-shell details{
    color:#aeb8c7;
}

body.admin-shell summary{
    font-weight:550;
}

.admin-reveal-init{
    opacity:0;
    transform:translateY(12px) scale(.995);
}

.admin-reveal-init.admin-reveal-visible{
    opacity:1;
    transform:none;
    transition:
        opacity .52s cubic-bezier(.16,1,.3,1),
        transform .52s cubic-bezier(.16,1,.3,1);
}

@keyframes adminGridDrift{
    from{background-position:0 0,0 0}
    to{background-position:44px 44px,44px 44px}
}

@keyframes adminLivePulse{
    0%,100%{opacity:.72;transform:scale(.9)}
    50%{opacity:1;transform:scale(1.08)}
}

@media(max-width:1024px){
    body.admin-shell .sidebar{width:min(86vw,278px)}
    body.admin-shell .app-main::before{left:0}
    body.admin-shell .app-topbar{height:56px}
    body.admin-shell .app-main{min-height:calc(100vh - 56px);padding-top:18px}
    body.admin-shell .app-main::before{inset:56px 0 0 0}
}

@media(max-width:720px){
    body.admin-shell .app-topbar{padding:0 10px}
    body.admin-shell .topbar-live-dot{display:none}
    body.admin-shell .page-head{min-height:0;padding-top:2px}
    body.admin-shell .panel{border-radius:14px}
    body.admin-shell .sidebar-group-label{font-size:.61rem}
    body.admin-shell .sidebar nav a.admin-nav-link{min-height:44px}
}

@media(prefers-reduced-motion:reduce){
    body.admin-shell .topbar-live-dot,
    body.admin-shell .app-main::before{animation:none!important}
    body.admin-shell .panel.admin-motion-surface{transform:none!important}
    .admin-reveal-init,
    .admin-reveal-init.admin-reveal-visible{opacity:1;transform:none;transition:none}
}