/* ========================================================================== 
   Stake + Shuffle VIP progress calculators.
   CasinoDrop app shell layered on crash-tracker.css; everything is scoped
   under .crx.vpx so the two tools cannot leak into the rest of the theme.
   ========================================================================== */

.vpx{
	--vpx-accent:var(--cyan,#4FC7EA);
	--vpx-soft:rgba(79,199,234,.1);
	--vpx-line:rgba(79,199,234,.34);
}
.vpx-shuffle{
	--vpx-accent:var(--hi,#A78BFA);
	--vpx-soft:rgba(167,139,250,.1);
	--vpx-line:rgba(167,139,250,.36);
}
.vpx .crx-live.vpx-local{background:rgba(79,199,234,.1);color:var(--cyan,#4FC7EA);border-color:rgba(79,199,234,.3)}
.vpx .crx-live.vpx-local i{box-shadow:0 0 0 3px rgba(79,199,234,.18);animation:none}
.vpx-fact-short{display:none}
.vpx .crx-ident-text,.vpx-app,.vpx-grid,.vpx-card,.vpx-result-body{min-width:0}
.vpx-app{display:grid;gap:16px}
.vpx-app>script{display:none}

/* ---------- shared cards ---------- */
.vpx-grid{display:grid;grid-template-columns:minmax(320px,390px) minmax(0,1fr);gap:16px;align-items:stretch}
.vpx-card{padding:0;overflow:hidden}
.vpx-card-head{display:flex;align-items:center;justify-content:space-between;gap:10px 18px;min-height:66px;padding:13px 16px 12px;border-bottom:1px solid var(--hair)}
.vpx-card-head>div{min-width:0}
.vpx-card-head h2{font-size:16px;font-weight:700;color:#fff}
.vpx-card-head p{margin-top:3px;font-size:12.5px;line-height:1.5;color:var(--ink-3)}
.vpx-eyebrow{display:block;margin-bottom:3px;font-size:10.5px;font-weight:800;line-height:1.2;letter-spacing:.1em;text-transform:uppercase;color:var(--vpx-accent)}
.vpx-method,.vpx-visible{flex:0 0 auto;padding:5px 10px;border:1px solid var(--hair);border-radius:999px;background:var(--card-2);font-size:12px;font-weight:600;color:var(--ink-3);white-space:nowrap}
.vpx-visible b{color:#fff}
.vpx-body{display:grid;gap:16px;padding:16px}
.vpx .vpx-chip{display:inline-flex;align-items:center;justify-content:center;padding:6px 11px;border:1px solid var(--hair);border-radius:999px;background:var(--card-2);font-size:12.5px;font-weight:600;color:var(--ink-2);transition:background .15s,border-color .15s,color .15s}
.vpx .vpx-chip:hover{background:var(--surface-3,#293046);border-color:var(--hair-2);color:#fff}

/* ---------- inputs ---------- */
.vpx-field,.vpx-fieldset{display:grid;gap:7px;min-width:0}
.vpx-fieldset{margin:0;padding:0;border:0}
.vpx-field>label,.vpx-fieldset>legend{width:100%;padding:0;font-size:12.5px;font-weight:650;color:var(--ink-3)}
.vpx-field>label{display:flex;align-items:baseline;justify-content:space-between;gap:10px}
.vpx-field>label span:last-child{color:var(--vpx-accent);font-variant-numeric:tabular-nums}
.vpx-select-wrap,.vpx-number-wrap{position:relative;display:flex;align-items:center;width:100%;min-width:0;border:1px solid var(--hair);border-radius:10px;background:var(--card-2);transition:border-color .15s,box-shadow .15s}
.vpx-select-wrap:focus-within,.vpx-number-wrap:focus-within{border-color:var(--vpx-accent);box-shadow:0 0 0 3px var(--vpx-soft)}
.vpx-select-wrap::after{content:"";position:absolute;right:13px;top:50%;width:7px;height:7px;border-right:1.5px solid var(--ink-3);border-bottom:1.5px solid var(--ink-3);transform:translateY(-70%) rotate(45deg);pointer-events:none}
.vpx select,.vpx input[type="number"]{width:100%;min-width:0;border:0;outline:0;border-radius:10px;background:transparent;color:var(--ink);font:inherit;font-size:14px;font-weight:650;font-variant-numeric:tabular-nums}
.vpx select{appearance:none;padding:11px 38px 11px 12px;cursor:pointer}
.vpx select option{background:#1B2030;color:#ECEEF6}
.vpx-number-wrap input[type="number"]{padding:10px 40px 10px 12px}
.vpx-number-wrap>span{position:absolute;right:12px;font-size:13px;font-weight:700;color:var(--ink-4);pointer-events:none}
.vpx input[type="number"]::-webkit-inner-spin-button,.vpx input[type="number"]::-webkit-outer-spin-button{opacity:.45}
.vpx-hint{font-size:12px;line-height:1.5;color:var(--ink-4)}
.vpx-slider{--vpx-pct:0%;width:100%;height:5px;margin:5px 0 0;padding:0;appearance:none;border:0;border-radius:999px;background:linear-gradient(90deg,var(--vpx-accent) 0 var(--vpx-pct),var(--card-2) var(--vpx-pct) 100%);cursor:pointer}
.vpx-slider::-webkit-slider-thumb{width:17px;height:17px;appearance:none;border:3px solid var(--card);border-radius:50%;background:var(--vpx-accent);box-shadow:0 0 0 1px var(--vpx-line),0 4px 12px -4px rgba(0,0,0,.8)}
.vpx-slider::-moz-range-thumb{width:12px;height:12px;border:3px solid var(--card);border-radius:50%;background:var(--vpx-accent);box-shadow:0 0 0 1px var(--vpx-line),0 4px 12px -4px rgba(0,0,0,.8)}
.vpx-scale{display:flex;justify-content:space-between;margin-top:-2px;font-size:10.5px;color:var(--ink-4);font-variant-numeric:tabular-nums}
.vpx-modes{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.vpx .vpx-mode{display:flex;flex-direction:column;align-items:flex-start;gap:2px;min-width:0;padding:10px 12px;border:1px solid var(--hair);border-radius:10px;background:var(--card-2);text-align:left;color:var(--ink-2);transition:border-color .15s,background .15s,color .15s}
.vpx .vpx-mode span{font-size:13.5px;font-weight:700}
.vpx .vpx-mode small{font-size:11.5px;font-weight:600;color:var(--ink-4)}
.vpx .vpx-mode:hover{border-color:var(--hair-2);color:#fff}
.vpx .vpx-mode.is-on{border-color:var(--vpx-line);background:var(--vpx-soft);color:#fff;box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--vpx-accent) 18%,transparent)}
.vpx .vpx-mode.is-on small{color:var(--vpx-accent)}
.vpx .crx-btn.vpx-example{width:100%;justify-content:center;border-radius:10px}

/* ---------- result board ---------- */
.vpx-results-card{background:radial-gradient(72% 80% at 100% 0%,var(--vpx-soft),transparent 72%),linear-gradient(180deg,rgba(255,255,255,.025),transparent 45%),var(--card)}
.vpx-result-body{grid-template-columns:1fr;align-content:start}
.vpx-result-hero{display:grid;gap:4px;padding:18px;border:1px solid var(--vpx-line);border-radius:13px;background:linear-gradient(135deg,var(--vpx-soft),rgba(255,255,255,.015) 68%),var(--card-2)}
.vpx-result-hero>span{font-size:12.5px;font-weight:650;color:var(--ink-3)}
.vpx-result-hero>strong{font-family:var(--font-display,"Sora",sans-serif);font-size:clamp(42px,5vw,62px);font-weight:800;line-height:1;letter-spacing:-.045em;color:var(--vpx-accent);white-space:nowrap;text-shadow:0 12px 30px color-mix(in srgb,var(--vpx-accent) 24%,transparent)}
.vpx-result-hero>strong.is-long{font-size:clamp(34px,4.2vw,52px)}
.vpx-result-hero>strong.is-xl{font-size:clamp(28px,3.6vw,44px)}
.vpx-result-hero p{font-size:13px;line-height:1.55;color:var(--ink-3)}
.vpx-result-hero p b{color:#fff;font-weight:700}
.vpx-progress{display:grid;gap:8px;padding:2px 2px 0}
.vpx-progress-labels{display:grid;grid-template-columns:1fr auto 1fr;align-items:end;gap:12px}
.vpx-progress-labels>span{display:grid;gap:1px;min-width:0}
.vpx-progress-labels>span:last-child{text-align:right}
.vpx-progress-labels small{font-size:10.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-4)}
.vpx-progress-labels b{overflow:hidden;font-size:13px;font-weight:700;color:#fff;text-overflow:ellipsis;white-space:nowrap}
.vpx-progress-labels .vpx-progress-pct{display:block;align-self:center;padding:3px 8px;border-radius:999px;background:var(--vpx-soft);font-size:11.5px;font-weight:800;color:var(--vpx-accent);font-variant-numeric:tabular-nums}
.vpx-progress-track{height:9px;overflow:hidden;border:1px solid var(--hair);border-radius:999px;background:var(--card-2)}
.vpx-progress-fill{width:0;height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--cyan,#4FC7EA),var(--vpx-accent));box-shadow:0 0 14px color-mix(in srgb,var(--vpx-accent) 38%,transparent);transition:width .18s ease-out}
.vpx-kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.vpx-kpis .crx-kpi{min-width:0;padding:12px}
.vpx-kpis .crx-kpi>b{display:block;overflow:hidden;font-size:19px;font-weight:750;line-height:1.1;letter-spacing:-.025em;color:#fff;text-overflow:ellipsis;white-space:nowrap}
.vpx-kpis .crx-kpi:last-child>b{color:var(--vpx-accent)}
.vpx-kpis .crx-kpi .lbl{font-size:12px}
.vpx-kpis .crx-kpi .sub{font-size:11px}
.vpx-formula{display:flex;align-items:center;gap:8px 12px;flex-wrap:wrap;padding:11px 12px;border:1px solid var(--hair);border-radius:10px;background:rgba(0,0,0,.08)}
.vpx-formula>span{font-size:10.5px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--vpx-accent)}
.vpx-formula code{font-family:var(--font-mono,"JetBrains Mono",monospace);font-size:11.5px;line-height:1.55;color:var(--ink-2);white-space:normal}
.vpx-rounding{font-size:12px;line-height:1.5;color:var(--ink-4)}

/* ---------- tier ladder ---------- */
.vpx-tier-card{margin-top:0}
.vpx-tier-head{align-items:flex-end}
.vpx-filters{display:flex;gap:7px;overflow-x:auto;padding:11px 14px;border-bottom:1px solid var(--hair);scrollbar-width:thin}
.vpx .vpx-filters button{flex:0 0 auto;padding:6px 11px;border:1px solid var(--hair);border-radius:999px;background:var(--card-2);font-size:12px;font-weight:650;color:var(--ink-3);white-space:nowrap;transition:border-color .15s,background .15s,color .15s}
.vpx .vpx-filters button b{margin-left:4px;color:var(--ink-4);font-size:11px}
.vpx .vpx-filters button:hover{border-color:var(--hair-2);color:#fff}
.vpx .vpx-filters button.is-on{border-color:var(--vpx-line);background:var(--vpx-soft);color:#fff}
.vpx .vpx-filters button.is-on b{color:var(--vpx-accent)}
.vpx-table-wrap{width:100%;max-width:100%;max-height:590px;overflow:auto}
.vpx-table{min-width:760px}
.vpx-table tbody th{position:static;z-index:auto;padding:9px 14px;border-bottom:1px solid var(--hair);background:transparent;text-align:left;white-space:nowrap;vertical-align:middle;color:var(--ink);font-size:13.5px;font-weight:700}
.vpx-table tbody th small{display:block;margin:1px 0 0 15px;font-size:10.5px;font-weight:600;color:var(--ink-4)}
.vpx-rank-dot{display:inline-block;width:7px;height:7px;margin-right:8px;border-radius:50%;background:var(--ink-4);vertical-align:1px}
.vpx-table tbody tr.is-current>*{background:rgba(255,255,255,.025)}
.vpx-table tbody tr.is-current>th{box-shadow:inset 3px 0 0 var(--ink-3)}
.vpx-table tbody tr.is-current .vpx-rank-dot{background:var(--ink-2)}
.vpx-table tbody tr.is-next>*{background:var(--vpx-soft);color:#fff}
.vpx-table tbody tr.is-next>th{box-shadow:inset 3px 0 0 var(--vpx-accent)}
.vpx-table tbody tr.is-next .vpx-rank-dot{background:var(--vpx-accent);box-shadow:0 0 0 3px var(--vpx-soft)}

/* ---------- method, limits and FAQ ---------- */
.vpx-info-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.vpx-steps{counter-reset:vpx-step;display:grid;gap:0;margin:0;padding:4px 16px 10px;list-style:none}
.vpx-steps li{counter-increment:vpx-step;position:relative;display:grid;gap:2px;min-height:72px;padding:14px 4px 14px 48px;border-bottom:1px solid var(--hair)}
.vpx-steps li:last-child{border-bottom:0}
.vpx-steps li::before{content:counter(vpx-step);position:absolute;left:2px;top:14px;display:grid;place-items:center;width:30px;height:30px;border:1px solid var(--vpx-line);border-radius:9px;background:var(--vpx-soft);font-size:12px;font-weight:800;color:var(--vpx-accent)}
.vpx-steps b{font-size:13.5px;font-weight:700;color:#fff}
.vpx-steps span{font-size:12.5px;line-height:1.55;color:var(--ink-3)}
.vpx-prose{display:grid;gap:12px;padding:16px;font-size:13px;line-height:1.65;color:var(--ink-3)}
.vpx-prose p{margin:0}
.vpx-prose p:first-child{color:var(--ink-2)}
.vpx-source{padding:11px 12px;border:1px solid var(--hair);border-radius:10px;background:var(--card-2)}
.vpx-source b{color:#fff;font-weight:700}
.vpx-source a{color:var(--vpx-accent);text-decoration:underline;text-decoration-color:color-mix(in srgb,var(--vpx-accent) 45%,transparent);text-underline-offset:3px}
.vpx-faq-list{display:grid;gap:8px;padding:12px}
.vpx-faq-list details{overflow:hidden;border:1px solid var(--hair);border-radius:11px;background:var(--card-2)}
.vpx-faq-list summary{display:flex;align-items:center;gap:10px;padding:12px 14px;list-style:none;cursor:pointer;font-size:13.5px;font-weight:650;color:var(--ink);transition:color .15s}
.vpx-faq-list summary::-webkit-details-marker{display:none}
.vpx-faq-list summary::before{content:"";width:6px;height:6px;flex:0 0 auto;border-right:1.5px solid var(--vpx-accent);border-bottom:1.5px solid var(--vpx-accent);transform:rotate(-45deg);transition:transform .15s}
.vpx-faq-list details[open] summary::before{transform:rotate(45deg)}
.vpx-faq-list summary:hover{color:#fff}
.vpx-faq-list p{padding:0 14px 13px 30px;font-size:13px;line-height:1.65;color:var(--ink-3)}
.vpx .crx-note{margin-top:0}

/* ---------- responsive ---------- */
@media (max-width:1240px){
	.vpx-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:1040px){
	.vpx-grid{grid-template-columns:1fr}
	.vpx-result-hero>strong{font-size:clamp(42px,8vw,62px)}
}
@media (max-width:760px){
	.vpx-card-head{min-height:62px}
	.vpx-info-grid{grid-template-columns:1fr}
	.vpx-result-hero>strong{font-size:clamp(38px,11vw,54px)}
	.vpx-result-hero>strong.is-long{font-size:clamp(31px,9vw,46px)}
	.vpx-result-hero>strong.is-xl{font-size:clamp(26px,7.6vw,38px)}
	.vpx-table-wrap{max-height:520px}
	.vpx-tier-head{align-items:center}
}
@media (max-width:560px){
	.vpx .crx-ident{align-items:flex-start}
	.vpx .crx-mark{width:50px;height:50px;border-radius:14px}
	.vpx .crx-facts{display:flex;align-items:baseline;flex-wrap:nowrap;gap:0;margin-top:7px;font-size:11px;line-height:1.25;letter-spacing:-.01em}
	.vpx .crx-facts li{white-space:nowrap}
	.vpx .crx-facts li+li::before{display:inline;margin:0 5px}
	.vpx .crx-facts b{font-size:11px}
	.vpx .vpx-fact-wide{display:none}
	.vpx .vpx-fact-short{display:inline}
	.vpx-card-head{padding-inline:13px}
	.vpx-body{padding:13px}
	.vpx-result-hero{padding:15px}
	.vpx-kpis .crx-kpi{padding:10px}
	.vpx-kpis .crx-kpi>b{font-size:17px}
	.vpx-progress-labels{gap:7px}
	.vpx-progress-labels b{font-size:12px}
	.vpx-method{display:none}
	.vpx-visible{font-size:11px}
	.vpx-faq-list{padding:9px}
}
@media (prefers-reduced-motion:reduce){
	.vpx *{scroll-behavior:auto!important}
	.vpx-progress-fill,.vpx .vpx-mode,.vpx .vpx-chip,.vpx .vpx-filters button{transition:none!important}
}