/* Scoped purchase UI: does not restyle WHMCS checkout or standard_cart. */
.cloud-vps-scope {
    --cloud-bg: #f3f6fb;
    --cloud-line: #e3e8f1;
    --cloud-line-soft: #eef1f6;
    --cloud-text: #101828;
    --cloud-body: #344054;
    --cloud-muted: #667085;
    --cloud-faint: #98a2b3;
    --cloud-accent: #e12d3f;
    --cloud-accent-dark: #c81f31;
    --cloud-tint: #fff4f5;
    --cloud-navy: #081426;
    --cloud-green: #12804a;
    --cloud-shadow: 0 18px 46px rgba(16, 29, 50, .06);
    color: var(--cloud-text);
    background: radial-gradient(circle at 50% -10%, #fff 0, var(--cloud-bg) 52%, #eef2f8 100%);
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif;
    font-size: 14px;
    line-height: 1.6;
    -webkit-font-smoothing: antialiased;
}
#order-standard_cart .cart-body.cloud-vps-scope { width: 100%; float: none; padding: 0; min-width: 0; }
.cloud-vps-scope *, .cloud-vps-scope *::before, .cloud-vps-scope *::after { box-sizing: border-box; }
.cloud-vps-scope [hidden] { display: none !important; }
.cloud-vps-scope button { font-family: inherit; cursor: pointer; line-height: 1.5; }
.cloud-vps-scope button:disabled { cursor: not-allowed; }
.cloud-vps-scope button:focus-visible, .cloud-vps-scope a:focus-visible, .cloud-vps-order:focus-visible { outline: 3px solid #2866c7; outline-offset: 4px; }
.cloud-vps-sr { position: absolute !important; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.cloud-vps-shell { max-width: 1500px; margin: 0 auto; padding: 10px 8px 38px; }

/* Hero */
.cloud-vps-hero { position: relative; display: flex; align-items: center; justify-content: space-between; overflow: hidden; min-height: 252px; padding: 34px 46px; color: #fff; background: linear-gradient(120deg, #071321 0%, #0b1a30 58%, #122643 100%); border: 1px solid rgba(255,255,255,.06); border-radius: 18px; box-shadow: 0 20px 58px rgba(8, 20, 38, .18); }
.cloud-vps-hero::before { content: ""; position: absolute; inset: 0; background: radial-gradient(circle at 86% 16%, rgba(225,45,63,.26), transparent 25%), radial-gradient(circle at 58% 110%, rgba(42,117,214,.22), transparent 36%), linear-gradient(105deg, transparent 0 58%, rgba(255,255,255,.025) 58% 58.2%, transparent 58.2% 100%); pointer-events: none; }
.cloud-vps-hero::after { content: ""; position: absolute; left: 46px; right: 46px; bottom: 0; height: 1px; background: linear-gradient(90deg, transparent, rgba(225,45,63,.75), transparent); opacity: .7; }
.cloud-vps-hero-copy { position: relative; z-index: 1; max-width: 700px; }
.cloud-vps-brand { display: flex; align-items: center; gap: 5px; font-size: 17px; font-weight: 800; letter-spacing: 1px; }
.cloud-vps-brand b { color: #ff3946; }
.cloud-vps-brand > span { margin-left: 12px; padding-left: 16px; border-left: 1px solid #384154; color: #b5c0d1; font-size: 12px; font-weight: 400; letter-spacing: 0; }
.cloud-vps-hero-kicker { display: inline-flex; align-items: center; gap: 7px; margin-top: 20px; padding: 5px 11px; border: 1px solid rgba(255,255,255,.13); border-radius: 999px; color: #dbe4f1; background: rgba(255,255,255,.06); font-size: 11px; letter-spacing: .2px; }
.cloud-vps-hero-kicker i { color: #ff5963; }
.cloud-vps-hero h1 { margin: 14px 0 8px; color: #fff; font-size: clamp(30px, 3.5vw, 44px); font-weight: 800; letter-spacing: .4px; line-height: 1.25; text-shadow: 0 8px 20px rgba(0,0,0,.18); }
.cloud-vps-hero-lead { margin: 0; font-size: 18px; font-weight: 600; color: #f7f9fc; }
.cloud-vps-hero-lead > span { margin-left: 16px; font-size: 14px; color: #c1cbd9; font-weight: 400; }
.cloud-vps-trust { display: flex; flex-wrap: wrap; gap: 28px; padding: 0; margin: 26px 0 0; list-style: none; }
.cloud-vps-trust li { display: flex; align-items: center; gap: 10px; font-size: 13px; color: #e5eaf2; }
.cloud-vps-trust i { display: grid; place-items: center; width: 32px; height: 32px; color: #ff3946; background: rgba(225,45,63,.14); border: 1px solid rgba(255,89,99,.18); border-radius: 50%; font-size: 14px; }
.cloud-vps-hero-art { position: relative; z-index: 1; width: 250px; min-width: 200px; height: 205px; margin: 0 12px 0 28px; filter: drop-shadow(0 18px 28px rgba(0,0,0,.2)); }
.cloud-vps-rack { position: absolute; top: 0; right: 18px; width: 105px; height: 173px; padding: 12px 10px; border: 2px solid #3b4d66; border-radius: 5px; background: #101d32; transform: skewY(-6deg); box-shadow: 12px 12px 0 #081222; }
.cloud-vps-rack > span { display: block; height: 21px; margin-bottom: 6px; border: 1px solid #37465e; border-left: 3px solid var(--cloud-accent); background: repeating-linear-gradient(90deg, #1f2c40 0 4px, #101d32 4px 7px); }
.cloud-vps-rack b { display: block; color: #ff3946; text-align: center; font-size: 13px; line-height: 1.2; letter-spacing: 1px; }
.cloud-vps-rack-back { right: 123px; top: 23px; width: 82px; height: 147px; opacity: .5; }
.cloud-vps-art-caption { position: absolute; bottom: 0; right: 0; color: #7e8da3; font-size: 11px; letter-spacing: 1px; white-space: nowrap; }

/* Layout */
.cloud-vps-layout { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 20px; align-items: start; margin-top: 20px; }
.cloud-vps-config, .cloud-vps-order { min-width: 0; border: 1px solid rgba(214, 222, 234, .95); border-radius: 16px; background: #fff; box-shadow: var(--cloud-shadow); }
.cloud-vps-config { padding: 0 30px 30px; }

/* Progress: the connector is a flex item inside each step, so it never crosses the next step's text. */
.cloud-vps-progress { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; padding: 21px 0; border-bottom: 1px solid var(--cloud-line); }
.cloud-vps-progress a { display: flex; align-items: center; gap: 11px; min-width: 0; color: var(--cloud-text); text-decoration: none; }
.cloud-vps-progress a:not(:last-child)::after { content: ""; flex: 1 1 auto; min-width: 12px; height: 1px; margin-left: 4px; background: #e6eaf1; }
.cloud-vps-progress a.done:not(:last-child)::after { background: #f2a7ae; }
.cloud-vps-progress a.active:not(:last-child)::after { background: linear-gradient(90deg, var(--cloud-accent), #e6eaf1); }
.cloud-vps-progress b { display: grid; place-items: center; width: 34px; height: 34px; flex: 0 0 34px; border-radius: 50%; color: var(--cloud-muted); background: #edf0f5; box-shadow: 0 0 0 5px #f7f9fc; font-size: 15px; transition: background .2s, color .2s; }
.cloud-vps-progress span { flex: 0 1 auto; min-width: 0; font-size: 13px; font-weight: 700; }
.cloud-vps-progress small { display: block; margin-top: 2px; color: var(--cloud-muted); font-size: 11px; font-weight: 400; }
.cloud-vps-progress a.done b { color: var(--cloud-accent); background: #ffe7ea; }
.cloud-vps-progress a.active { color: var(--cloud-accent); }
.cloud-vps-progress a.active b { color: #fff; background: var(--cloud-accent); box-shadow: 0 0 0 5px #fff0f1, 0 6px 12px rgba(225,45,63,.2); }

/* Sections */
.cloud-vps-step { padding-top: 26px; scroll-margin-top: 24px; }
.cloud-vps-section-head { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-bottom: 16px; }
.cloud-vps-number { display: grid; place-items: center; flex: 0 0 26px; width: 26px; height: 26px; border-radius: 50%; color: #fff; background: var(--cloud-accent); font-size: 13px; font-weight: 700; }
.cloud-vps-section-head h2 { margin: 0; color: var(--cloud-text); font-size: 17px; font-weight: 750; line-height: 1.5; }
.cloud-vps-section-head p { margin: 0 0 0 2px; color: var(--cloud-muted); font-size: 12px; }
.cloud-vps-result-count { margin-left: auto; color: var(--cloud-muted); font-size: 12px; }

/* Choice cards */
.cloud-vps-choices, .cloud-vps-billing { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
.cloud-vps-choice, .cloud-vps-billing-btn, .cloud-vps-game-choice { position: relative; min-width: 0; border: 1px solid var(--cloud-line); border-radius: 12px; color: var(--cloud-text); background: linear-gradient(180deg, #fff, #fbfcfe); transition: border-color .18s, background .18s, transform .18s, box-shadow .18s; }
.cloud-vps-choice { min-height: 108px; padding: 18px 12px 14px; text-align: center; }
.cloud-vps-choice-icon { display: block; color: #172640; font-size: 24px; line-height: 1; margin-bottom: 11px; }
.cloud-vps-choice strong { display: block; font-size: 13px; font-weight: 700; overflow-wrap: anywhere; }
.cloud-vps-choice small { display: block; margin-top: 6px; color: var(--cloud-muted); font-size: 11px; line-height: 1.6; overflow-wrap: anywhere; }
.cloud-vps-choice.platform { min-height: 88px; padding: 15px 12px; text-align: left; }
.cloud-vps-choice.platform .cloud-vps-choice-icon { float: left; margin: 3px 9px 8px 0; font-size: 20px; }
.cloud-vps-choice.platform small { clear: both; }
.cloud-vps-choice.active, .cloud-vps-billing-btn.active, .cloud-vps-game-choice.active { border-color: var(--cloud-accent); background: linear-gradient(180deg, #fff7f7, #fff1f2); box-shadow: 0 10px 22px rgba(225,45,63,.1), inset 0 0 0 .5px var(--cloud-accent); }
.cloud-vps-choice.active strong, .cloud-vps-choice.active .cloud-vps-choice-icon, .cloud-vps-billing-btn.active strong { color: var(--cloud-accent); }
.cloud-vps-choice.active::after, .cloud-vps-game-choice.active::after { content: "✓"; position: absolute; top: -1px; right: -1px; display: grid; place-items: center; width: 20px; height: 20px; border-radius: 0 11px 0 8px; color: #fff; background: var(--cloud-accent); font-size: 12px; font-weight: 700; }

/* Billing */
.cloud-vps-billing-btn { min-height: 70px; padding: 11px 6px 10px; text-align: center; }
.cloud-vps-billing-btn strong { display: block; font-size: 14px; }
.cloud-vps-billing-btn small { display: block; margin-top: 3px; color: var(--cloud-muted); font-size: 11px; overflow-wrap: anywhere; }
.cloud-vps-billing-btn em { position: absolute; top: -9px; right: 8px; padding: 1px 7px; border-radius: 999px; color: var(--cloud-green); background: #e8f6ee; border: 1px solid #c6ead5; font-size: 10px; font-style: normal; font-weight: 700; line-height: 1.6; white-space: nowrap; }
.cloud-vps-billing-btn:disabled { color: var(--cloud-faint); background: #f8f9fb; border-style: dashed; }
.cloud-vps-billing-btn:disabled small { color: var(--cloud-faint); }

/* Games */
.cloud-vps-game-choices { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
.cloud-vps-game-choice { display: flex; flex-direction: column; padding: 0; overflow: hidden; text-align: center; }
.cloud-vps-game-choice img { display: block; width: 100%; height: auto; aspect-ratio: 16 / 10; object-fit: cover; object-position: center 40%; background: #edf0f5; }
.cloud-vps-game-label { display: grid; place-items: center; flex: 1; min-height: 46px; padding: 8px 6px; font-size: 12px; font-weight: 650; overflow-wrap: anywhere; }

/* Plans */
.cloud-vps-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.cloud-vps-plan { position: relative; display: flex; flex-direction: column; min-width: 0; padding: 20px 18px 18px; border: 1px solid #e0e6ef; border-radius: 14px; background: linear-gradient(180deg, #fff, #fbfcfe); box-shadow: 0 6px 18px rgba(16,29,50,.03); cursor: pointer; transition: border-color .18s, transform .18s, box-shadow .18s, opacity .18s; }
.cloud-vps-plan.featured { border-color: #efb4ba; box-shadow: 0 8px 22px rgba(225,45,63,.07); }
.cloud-vps-plan.active { border-color: var(--cloud-accent); background: linear-gradient(180deg, #fff6f7 0%, #fff 72%); box-shadow: 0 16px 32px rgba(225,45,63,.13), inset 0 0 0 .5px var(--cloud-accent); }
.cloud-vps-plan.soldout { cursor: default; background: #fafbfc; box-shadow: none; }
.cloud-vps-plan.soldout > :not(.cloud-vps-buy):not(.cloud-vps-stock) { opacity: .55; filter: grayscale(.6); }
.cloud-vps-plan-badge { position: absolute; top: -1px; right: -1px; padding: 3px 10px; border-radius: 0 13px 0 9px; color: #fff; background: var(--cloud-accent); font-size: 10px; font-weight: 700; }
.cloud-vps-plan-limit { display: inline-flex; align-items: center; gap: 5px; align-self: flex-start; margin: 0 0 8px; padding: 2px 8px; border-radius: 999px; color: #1d7a3f; background: #e9f7ee; font-size: 11px; font-weight: 700; }
.cloud-vps-plan-limit i { font-size: 10px; }
.cloud-vps-plan.soldout > .cloud-vps-plan-limit.cloud-vps-plan-limit { opacity: 1; filter: none; color: #b42318; background: #fdecec; }
.cloud-vps-plan-code { margin: 0 0 4px; color: var(--cloud-faint); font-size: 11px; letter-spacing: .3px; overflow-wrap: anywhere; }
.cloud-vps-plan h3 { margin: 0; color: var(--cloud-text); font-size: 19px; font-weight: 800; line-height: 1.4; letter-spacing: -.15px; overflow-wrap: anywhere; }
.cloud-vps-plan-sub { margin: 4px 0 0; color: var(--cloud-muted); font-size: 12px; line-height: 1.6; overflow-wrap: anywhere; }
.cloud-vps-specs { margin: 16px 0 0; padding: 4px 12px; list-style: none; border: 1px solid var(--cloud-line-soft); border-radius: 11px; background: #f8fafc; }
.cloud-vps-plan.active .cloud-vps-specs { border-color: #f6d9dc; background: #fff; }
.cloud-vps-specs li { display: flex; align-items: center; gap: 10px; min-width: 0; padding: 8px 0; border-bottom: 1px dashed #e5e9f0; font-size: 12px; line-height: 1.5; }
.cloud-vps-specs li:last-child { border-bottom: 0; }
.cloud-vps-spec-icon { display: grid; place-items: center; flex: 0 0 26px; width: 26px; height: 26px; border-radius: 7px; color: #5b6b82; background: #fff; box-shadow: inset 0 0 0 1px #e3e8f0; font-size: 11px; }
.cloud-vps-plan.active .cloud-vps-spec-icon { color: var(--cloud-accent); background: var(--cloud-tint); box-shadow: none; }
.cloud-vps-spec-label { flex: 0 0 auto; min-width: 30px; color: var(--cloud-faint); font-size: 11px; white-space: nowrap; }
.cloud-vps-spec-value { flex: 1; min-width: 0; color: var(--cloud-muted); text-align: right; overflow-wrap: anywhere; }
.cloud-vps-spec-value strong { color: var(--cloud-text); font-size: 14px; font-weight: 800; letter-spacing: -.2px; }
.cloud-vps-spec-value small { display: block; margin-top: 1px; color: var(--cloud-faint); font-size: 11px; line-height: 1.45; }
.cloud-vps-notes { margin: 12px 0 0; padding: 0 2px; list-style: none; }
.cloud-vps-notes li { position: relative; padding-left: 13px; color: var(--cloud-muted); font-size: 11px; line-height: 1.65; overflow-wrap: anywhere; }
.cloud-vps-notes li + li { margin-top: 3px; }
.cloud-vps-notes li::before { content: ""; position: absolute; left: 2px; top: .62em; width: 4px; height: 4px; border-radius: 50%; background: #c3cad6; }
.cloud-vps-plan .cloud-vps-price { padding-top: 16px; }
.cloud-vps-price { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px; color: var(--cloud-accent); }
.cloud-vps-plan .cloud-vps-price { margin-top: auto; }
.cloud-vps-price strong { min-width: 0; font-size: clamp(26px, 2.5vw, 32px); font-weight: 800; line-height: 1.25; letter-spacing: -.6px; overflow-wrap: anywhere; }
.cloud-vps-price > span { flex: 0 0 auto; font-size: 12px; white-space: nowrap; }
.cloud-vps-equiv { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; min-height: 20px; margin-top: 3px; color: var(--cloud-muted); font-size: 11px; }
.cloud-vps-equiv:empty { display: none; }
.cloud-vps-equiv b { padding: 0 6px; border-radius: 4px; color: var(--cloud-green); background: #e8f6ee; font-weight: 700; }
.cloud-vps-stock { display: flex; align-items: center; gap: 6px; margin: 10px 0; font-size: 11px; }
.cloud-vps-stock::before { content: ""; width: 6px; height: 6px; flex: 0 0 6px; border-radius: 50%; background: currentColor; }
.cloud-vps-stock.in { color: var(--cloud-green); }
.cloud-vps-stock.out { color: #8490a3; }
.cloud-vps-buy { width: 100%; min-height: 42px; padding: 8px; border: 1px solid var(--cloud-accent); border-radius: 10px; color: var(--cloud-accent); background: #fff; font-size: 13px; font-weight: 700; }
.cloud-vps-plan.active .cloud-vps-buy { color: #fff; background: var(--cloud-accent); }
.cloud-vps-buy:disabled { border-color: #e4e7ec; color: var(--cloud-faint); background: #f2f4f7; }
.cloud-vps-empty { grid-column: 1 / -1; padding: 22px 16px; border: 1px dashed #d2d9e4; border-radius: 10px; color: var(--cloud-muted); background: #f8fafc; font-size: 13px; line-height: 1.8; }

/* Order summary */
.cloud-vps-order { position: sticky; top: 24px; display: flex; flex-direction: column; max-height: calc(100vh - 48px); max-height: calc(100dvh - 48px); padding: 24px; scroll-margin-top: 20px; overflow: hidden; }
.cloud-vps-order::before { content: ""; display: block; position: absolute; top: 0; left: 0; right: 0; height: 4px; background: linear-gradient(90deg, var(--cloud-accent), #ff7a7f); }
.cloud-vps-order > * { flex-shrink: 0; }
.cloud-vps-order-head { display: flex; align-items: center; gap: 9px; padding-bottom: 16px; border-bottom: 1px solid var(--cloud-line); }
.cloud-vps-order-head i { color: var(--cloud-accent); font-size: 18px; }
.cloud-vps-order-head h2 { margin: 0; color: var(--cloud-text); font-size: 19px; font-weight: 750; }
.cloud-vps-order-head > span { margin-left: auto; font-size: 11px; color: var(--cloud-muted); white-space: nowrap; }
.cloud-vps-order-details { margin: 4px 0 0; min-height: 70px; overflow-y: auto; flex-shrink: 1; }
.cloud-vps-order-details > div { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; padding: 11px 0; border-bottom: 1px solid var(--cloud-line-soft); font-size: 12px; }
.cloud-vps-order-details dt { flex: 0 0 54px; margin: 0; font-weight: 400; color: var(--cloud-muted); }
.cloud-vps-order-details dd { min-width: 0; margin: 0; font-weight: 650; text-align: right; line-height: 1.7; overflow-wrap: anywhere; }
.cloud-vps-order-details .cloud-vps-config-row { border: 0; padding-bottom: 0; }
.cloud-vps-config-row dd { color: var(--cloud-muted); font-weight: 400; font-size: 11px; }
.cloud-vps-summary-specs { margin: 0; padding: 0; list-style: none; }
.cloud-vps-summary-specs li { display: flex; justify-content: flex-end; align-items: baseline; gap: 8px; line-height: 1.55; }
.cloud-vps-summary-specs li + li { margin-top: 3px; }
.cloud-vps-summary-specs span { flex: 0 0 auto; color: var(--cloud-faint); }
.cloud-vps-summary-specs b { min-width: 0; color: var(--cloud-body); font-weight: 600; overflow-wrap: anywhere; }
.cloud-vps-total { margin-top: 18px; padding: 15px 16px 13px; border: 1px solid #ffd8dc; border-radius: 12px; background: linear-gradient(180deg, #fff7f7, #fff); }
.cloud-vps-total > span { font-size: 12px; font-weight: 700; color: var(--cloud-body); }
.cloud-vps-order-price { margin: 4px 0 2px; }
.cloud-vps-order-price strong { font-size: 34px; }
.cloud-vps-total .cloud-vps-equiv { margin: 0 0 6px; }
.cloud-vps-total > small { display: block; color: var(--cloud-muted); font-size: 11px; line-height: 1.7; }
.cloud-vps-checkout { display: flex; align-items: center; justify-content: center; gap: 12px; width: 100%; min-height: 50px; margin-top: 16px; padding: 10px 14px; border: 0; border-radius: 11px; color: #fff; background: linear-gradient(135deg, #e12d3f, #f04b5a 72%, #ff6e78); box-shadow: 0 10px 22px rgba(225,45,63,.22); font-size: 16px; font-weight: 750; transition: transform .15s, box-shadow .15s, background .15s; }
.cloud-vps-checkout > span { font-size: 20px; line-height: 1; }
.cloud-vps-checkout:disabled { color: #8893a4; background: #e9edf3; box-shadow: none; }
.cloud-vps-note { margin: 10px 0 0; color: var(--cloud-muted); font-size: 11px; text-align: center; line-height: 1.7; }
.cloud-vps-order-status { margin: 10px 0 0; padding: 8px 10px; border-radius: 8px; color: #9a3412; background: #fff7ed; border: 1px solid #fed7aa; font-size: 12px; line-height: 1.6; overflow-wrap: anywhere; }
.cloud-vps-order-status.quiet { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.cloud-vps-mobile-bar { display: none; }

@media (hover: hover) {
    .cloud-vps-choice:hover, .cloud-vps-game-choice:hover, .cloud-vps-billing-btn:hover:not(:disabled) { border-color: #f58189; transform: translateY(-2px); box-shadow: 0 8px 18px rgba(16,29,50,.06); }
    .cloud-vps-plan:not(.soldout):hover { border-color: #f58189; transform: translateY(-3px); box-shadow: 0 12px 24px rgba(16,29,50,.08); }
    .cloud-vps-buy:hover:not(:disabled) { background: var(--cloud-tint); }
    .cloud-vps-plan.active .cloud-vps-buy:hover, .cloud-vps-checkout:hover:not(:disabled) { color: #fff; background: var(--cloud-accent-dark); }
    .cloud-vps-checkout:hover:not(:disabled) { transform: translateY(-1px); box-shadow: 0 14px 26px rgba(225,45,63,.28); }
}
@media (min-width: 1280px) {
    .cloud-vps-game-choices { grid-template-columns: repeat(5, minmax(0, 1fr)); }
}
@media (max-width: 1100px) and (min-width: 901px) {
    .cloud-vps-config { padding: 0 18px 22px; }
    .cloud-vps-layout { grid-template-columns: minmax(0, 1fr) 272px; gap: 16px; }
    .cloud-vps-order { padding: 18px; }
    .cloud-vps-category-choices, .cloud-vps-platform-choices { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .cloud-vps-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .cloud-vps-hero-art { transform: scale(.9); transform-origin: right center; margin-left: 0; }
    .cloud-vps-trust { gap: 18px; }
    .cloud-vps-progress small { display: none; }
}
@media (max-width: 900px) {
    .cloud-vps-shell { padding: 0 0 calc(100px + env(safe-area-inset-bottom, 0px)); }
    .cloud-vps-layout { grid-template-columns: minmax(0, 1fr); gap: 18px; }
    .cloud-vps-order { position: static; max-height: none; }
    .cloud-vps-order-details { overflow: visible; }
    .cloud-vps-hero-art { display: none; }
    .cloud-vps-mobile-bar { position: fixed; bottom: 0; left: 0; right: 0; z-index: 1000; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 11px 20px calc(11px + env(safe-area-inset-bottom, 0px)); border-top: 1px solid var(--cloud-line); color: var(--cloud-text); background: rgba(255,255,255,.94); -webkit-backdrop-filter: blur(16px); backdrop-filter: blur(16px); box-shadow: 0 -10px 30px rgba(16,29,50,.1); }
    .cloud-vps-mobile-bar > div { min-width: 0; }
    .cloud-vps-mobile-bar small { display: block; color: var(--cloud-muted); font-size: 10px; }
    .cloud-vps-mobile-price { display: flex; flex-wrap: wrap; align-items: baseline; gap: 3px; color: var(--cloud-accent); }
    .cloud-vps-mobile-price strong { font-size: 25px; font-weight: 800; line-height: 1.3; overflow-wrap: anywhere; }
    .cloud-vps-mobile-price span { font-size: 11px; white-space: nowrap; }
    .cloud-vps-mobile-bar .cloud-vps-checkout { width: 138px; min-height: 44px; flex: 0 0 138px; margin: 0; font-size: 15px; }
}
@media (max-width: 620px) {
    .cloud-vps-hero { min-height: 0; padding: 24px 20px 25px; border-radius: 12px; box-shadow: 0 12px 28px rgba(8,20,38,.14); }
    .cloud-vps-hero::after { left: 20px; right: 20px; }
    .cloud-vps-brand { font-size: 15px; }
    .cloud-vps-brand > span { display: none; }
    .cloud-vps-hero-kicker { margin-top: 16px; font-size: 10px; }
    .cloud-vps-hero h1 { font-size: 31px; margin-top: 13px; }
    .cloud-vps-hero-lead { font-size: 16px; }
    .cloud-vps-hero-lead > span { display: block; margin: 5px 0 0; font-size: 12px; }
    .cloud-vps-trust { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px 18px; margin-top: 20px; }
    .cloud-vps-trust li { font-size: 12px; gap: 8px; }
    .cloud-vps-trust i { width: 27px; height: 27px; font-size: 12px; }
    .cloud-vps-layout { margin-top: 14px; }
    .cloud-vps-config { padding: 0 16px 22px; }
    .cloud-vps-progress { gap: 6px; padding: 16px 0; }
    .cloud-vps-progress a { gap: 6px; }
    .cloud-vps-progress a:not(:last-child)::after { min-width: 6px; margin-left: 2px; }
    .cloud-vps-progress b { width: 25px; height: 25px; flex-basis: 25px; font-size: 12px; box-shadow: none; }
    .cloud-vps-progress a.active b { box-shadow: 0 4px 10px rgba(225,45,63,.22); }
    .cloud-vps-progress span { font-size: 12px; white-space: nowrap; }
    .cloud-vps-progress small { display: none; }
    .cloud-vps-step { padding-top: 22px; }
    .cloud-vps-section-head { gap: 8px; margin-bottom: 12px; }
    .cloud-vps-section-head h2 { font-size: 16px; }
    .cloud-vps-section-head p { flex-basis: 100%; margin-left: 34px; font-size: 11px; }
    .cloud-vps-result-count { margin-left: 34px; }
    .cloud-vps-category-choices, .cloud-vps-platform-choices, .cloud-vps-game-choices { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .cloud-vps-choice { min-height: 82px; padding: 13px 10px 11px; }
    .cloud-vps-choice-icon { font-size: 20px; margin-bottom: 7px; }
    .cloud-vps-choice small { margin-top: 3px; line-height: 1.5; }
    .cloud-vps-choice.platform { min-height: 74px; padding: 12px 10px; }
    .cloud-vps-billing { gap: 6px; padding-top: 4px; }
    .cloud-vps-billing-btn { min-height: 64px; padding: 10px 3px 8px; }
    .cloud-vps-billing-btn strong { font-size: 13px; }
    .cloud-vps-billing-btn small { font-size: 10px; }
    .cloud-vps-billing-btn em { right: 50%; transform: translateX(50%); padding: 0 5px; font-size: 9px; }
    .cloud-vps-grid { grid-template-columns: minmax(0, 1fr); gap: 14px; }
    .cloud-vps-plan { padding: 20px 18px 16px; border-radius: 16px; }
    .cloud-vps-plan h3 { font-size: 20px; }
    .cloud-vps-specs { margin-top: 14px; }
    .cloud-vps-price strong { font-size: 30px; }
    .cloud-vps-buy { min-height: 44px; }
    .cloud-vps-order { padding: 20px; }
    .cloud-vps-order-details > div { font-size: 13px; }
    .cloud-vps-order-details dt { flex-basis: 58px; }
    .cloud-vps-mobile-bar { padding-left: 16px; padding-right: 16px; }
}
@media (prefers-reduced-motion: reduce) { .cloud-vps-scope * { transition: none !important; } }

/* Real-name verification (categories flagged realname by the hook) */
.cloud-vps-choice-tag { display: inline-flex; align-items: center; gap: 4px; margin-top: 7px; padding: 1px 8px; border-radius: 999px; color: #b54708; background: #fff4e5; font-size: 11px; font-weight: 700; line-height: 1.7; }
.cloud-vps-choice-tag i { font-size: 10px; }
.cloud-vps-realname { display: flex; align-items: center; gap: 12px; margin: 0 0 14px; padding: 12px 14px; border: 1px solid #fedf89; border-radius: 12px; background: linear-gradient(90deg, #fffaeb, #fffdf6); }
.cloud-vps-realname[hidden] { display: none; }
.cloud-vps-realname-icon { display: grid; place-items: center; flex: 0 0 36px; width: 36px; height: 36px; border-radius: 10px; color: #b54708; background: #fef0c7; font-size: 15px; }
.cloud-vps-realname > div { flex: 1; min-width: 0; }
.cloud-vps-realname strong { display: block; color: #7a2e0e; font-size: 13px; font-weight: 750; }
.cloud-vps-realname p { margin: 1px 0 0; color: #93370d; font-size: 12px; line-height: 1.6; }
.cloud-vps-realname-link { flex: 0 0 auto; padding: 7px 14px; border-radius: 9px; color: #fff; background: #dc6803; font-size: 12px; font-weight: 700; text-decoration: none; white-space: nowrap; }
.cloud-vps-realname-link:hover, .cloud-vps-realname-link:focus { color: #fff; background: #b54708; text-decoration: none; }
.cloud-vps-summary-realname { display: flex; align-items: center; gap: 7px; margin: 14px 0 0; padding: 8px 11px; border-radius: 9px; color: #93370d; background: #fffaeb; font-size: 12px; }
.cloud-vps-summary-realname[hidden] { display: none; }
.cloud-vps-summary-realname i { color: #dc6803; }
.cloud-vps-summary-realname a { color: #dc6803; font-weight: 700; text-decoration: underline; }
@media (max-width: 600px) {
    .cloud-vps-realname { flex-wrap: wrap; }
    .cloud-vps-realname-link { width: 100%; text-align: center; }
}