/* VIPENVPN Web - base visual system */
/* Reusable site-wide tooltip system */
.ui-tooltip-trigger { position:relative; display:inline-grid; place-items:center; flex:0 0 auto; width:25px; height:25px; padding:0; border:1px solid #b98b31; border-radius:50%; background:radial-gradient(circle at 30% 24%,#fff9df 0%,#f5d98d 48%,#d5a94d 100%); color:#68440f; font:800 13px/1 ui-sans-serif,system-ui,sans-serif; cursor:help; box-shadow:0 2px 5px rgba(68,45,10,.22),inset 0 1px 0 rgba(255,255,255,.9); touch-action:manipulation; }
.ui-tooltip-trigger:hover,.ui-tooltip-trigger:focus-visible,.ui-tooltip-trigger.is-tooltip-open { filter:brightness(1.04); outline:2px solid rgba(222,180,83,.35); outline-offset:2px; }
.ui-tooltip-content { position:fixed; z-index:100000; display:block; width:max-content; max-width:min(300px,calc(100vw - 24px)); padding:11px 14px; border:1px solid rgba(177,130,39,.68); border-radius:12px; background:linear-gradient(145deg,#fffbe8 0%,#f9e8ad 48%,#f0d078 100%); color:#53370d; font-size:12px; font-weight:550; line-height:1.55; text-align:start; white-space:normal; box-shadow:0 14px 38px rgba(43,30,8,.30),0 3px 10px rgba(170,123,32,.16),inset 0 1px 0 rgba(255,255,255,.98),inset 0 -1px 0 rgba(176,128,32,.16); opacity:0; visibility:hidden; pointer-events:none; transform:translateY(5px) scale(.98); transform-origin:top left; transition:opacity .16s ease,transform .16s ease,visibility .16s; }
.ui-tooltip-content.is-visible { opacity:1; visibility:visible; transform:translateY(0) scale(1); }

:root { --ink:#101828; --muted:#667085; --line:#e4e7ec; --bg:#fff; --soft:#f7f9fc; --accent:#111827; --radius:22px; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--bg); color:var(--ink); font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; line-height:1.5; -webkit-font-smoothing:antialiased; }
a { color:inherit; }
.site-header { gap:28px }
.brand { font-size:22px; font-weight:800; letter-spacing:-.04em; text-decoration:none; white-space:nowrap }
.brand span { font-weight:500 }
.brand-logo-wrap { display:inline-flex; align-items:center; flex:0 0 auto; line-height:0; }
.brand-logo { display:block; width:210px; height:auto; max-width:100%; object-fit:contain; }
.nav { display:flex; align-items:center; gap:22px; font-size:13px }
.nav a { text-decoration:none; color:#475467 }
.nav a:hover { color:var(--ink) }
.nav .button { color:#fff }
.button { display:inline-flex; align-items:center; justify-content:center; min-height:42px; padding:10px 18px; border:0; border-radius:999px; background:var(--ink); color:#fff!important; text-decoration:none; font-weight:650; font-size:13px; cursor:pointer; transition:transform .15s ease,opacity .15s ease }
.button:hover { transform:translateY(-1px); opacity:.92 }
.button.large { min-height:50px; padding:13px 22px }
.menu { display:none; border:0; background:transparent; font-size:25px; cursor:pointer; color:var(--ink); }
main { overflow:hidden }
.hero { max-width:1180px; margin:0 auto; padding:100px 24px 110px; display:grid; grid-template-columns:1.05fr .95fr; align-items:center; gap:60px; min-height:620px }
.eyebrow { margin:0; color:var(--muted); font-size:11px; font-weight:750; letter-spacing:.16em; text-transform:uppercase }
.hero h1 { font-size:clamp(52px,7vw,86px); line-height:.98; letter-spacing:-.065em; margin:14px 0 24px; max-width:760px }
.lead { font-size:18px; line-height:1.7; color:var(--muted); max-width:650px }
.hero-actions { display:flex; align-items:center; gap:20px; margin-top:32px; flex-wrap:wrap }
.text-link { font-size:13px; font-weight:650; text-decoration:none }
.hero-visual { position:relative; min-height:390px; display:flex; align-items:center; justify-content:center }
.orb { width:330px; height:330px; border-radius:50%; background:radial-gradient(circle at 35% 30%,#fff 0,#dfe7f2 38%,#b9c5d5 72%,#8795a8 100%); box-shadow:0 35px 80px rgba(16,24,40,.18) }
.glass-card { position:absolute; right:5%; bottom:12%; width:230px; padding:22px; border:1px solid rgba(255,255,255,.75); border-radius:22px; background:rgba(255,255,255,.72); backdrop-filter:blur(18px); box-shadow:0 24px 55px rgba(16,24,40,.15); display:grid; gap:7px }
.glass-card strong { font-size:15px }
.glass-card span { font-size:12px; color:var(--muted) }
.glass-card b { font-size:42px; line-height:1; margin-top:8px; }
.section { max-width:1180px; margin:0 auto; padding:92px 24px }
.section h2 { font-size:42px; line-height:1.08; letter-spacing:-.045em; margin:10px 0 42px }
.grid { display:grid; grid-template-columns:repeat(3,1fr); gap:18px }
.grid article { border-top:1px solid var(--line); padding:24px 4px }
.grid article>span { font-size:11px; color:var(--muted); letter-spacing:.12em }
.grid h3 { font-size:21px; margin:16px 0 8px }
.grid p { color:var(--muted); line-height:1.7; margin:0 }
.soft { max-width:none; background:var(--soft); padding-left:max(24px,calc((100vw - 1132px)/2)); padding-right:max(24px,calc((100vw - 1132px)/2)) }
.steps { display:grid; grid-template-columns:repeat(3,1fr); gap:18px }
.steps>div { background:#fff; border:1px solid var(--line); border-radius:var(--radius); padding:28px }
.steps b { display:inline-grid; place-items:center; width:36px; height:36px; border-radius:50%; background:var(--ink); color:#fff; font-size:13px }
.steps h3 { margin:24px 0 8px }
.steps p { margin:0; color:var(--muted); line-height:1.7 }
.cta { max-width:900px; margin:0 auto; padding:110px 24px; text-align:center }
.cta h2 { font-size:48px; line-height:1.05; letter-spacing:-.05em; margin:0 0 14px }
.cta p { color:var(--muted); line-height:1.7; margin:0 auto 28px; max-width:620px }
.cta .button { display:inline-flex; }


/* VIPENVPN landing page - dedicated visual system */
.landing-page { background:#fff;color:#111827 }
.landing-page .site-header + .landing { margin:0!important;padding:0!important }
.landing-page .site-header + .landing > .landing-carousel { margin-block-start:0!important;padding-block-start:0!important }
.landing { --landing-heading-size:clamp(18px,3.5vw,36px);overflow:hidden;background:#fff;margin-block-start:0;padding-block-start:0 }
.landing-container { width:min(1180px,calc(100% - 48px));margin:0 auto }
.landing h1,.landing h2,.landing h3,.landing p { font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif }
.landing h1,.landing h2,.landing h3 { color:#111827 }
.landing h1 span,.landing h2 span,.landing-final h2 span { color:#ff6a35 }
.landing-eyebrow { margin:0 0 14px;color:#7d8794;font-size:10px;font-weight:850;letter-spacing:.19em;text-transform:uppercase }
.landing-body { max-width:570px;color:#687385;font-size:15px;line-height:1.82;margin:0 }
/* RESPONSIVE HERO CAROUSEL */
.landing-carousel { position:relative;isolation:isolate;overflow:hidden;display:block;width:100%;max-width:100%;margin:0!important;padding:0;background:#fff;border-bottom:1px solid #edf0f3;aspect-ratio:auto }
.landing-carousel-track { position:relative;display:flex;flex-direction:row;direction:ltr;align-items:stretch;width:100%;transform:translate3d(-100%,0,0);transition:transform .82s cubic-bezier(.22,.75,.25,1);will-change:transform;touch-action:pan-y; }
.landing-carousel-track.is-dragging { transition:none;cursor:grabbing }
.landing-carousel-slide { position:relative;display:block;flex:0 0 100%;width:100%;min-width:0;aspect-ratio:2/1;height:auto;min-height:0;overflow:hidden;background:#fff;isolation:isolate;container-type:inline-size }
.landing-carousel-slide.is-active { opacity:1 }
.landing-carousel-slide[aria-hidden="true"] { pointer-events:none }
.landing-carousel-image { position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:cover;object-position:center center;z-index:0;pointer-events:none;user-select:none;-webkit-user-drag:none;transform:scaleX(1) }
[dir="rtl"] .landing-carousel-image { transform:scaleX(-1) }
@media(max-width:680px) {
    .landing-carousel-image { top:0;height:100%;object-position:center top }
}
.landing-carousel .landing-carousel-copy { --carousel-copy-edge:clamp(20px,3.5vw,50px);position:absolute;z-index:2;top:var(--carousel-copy-edge);bottom:var(--carousel-copy-edge);left:2.5%;right:auto;width:38%;max-width:38%;display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-start;height:auto;min-height:0;margin:0;padding:0;text-align:left;box-sizing:border-box }
.landing-carousel .landing-carousel-copy .landing-eyebrow { width:100%;max-width:100%;margin-bottom:clamp(5px,.9cqw,14px);line-height:1.25 }
.landing-carousel h1,.landing-carousel h2 { width:100%;max-width:100%;margin:0 0 clamp(6px,1.2cqw,16px);color:#111827;font-size:var(--landing-heading-size);line-height:1;letter-spacing:-.055em;font-weight:820;text-wrap:balance;overflow-wrap:normal }
.landing-carousel h1 > .landing-carousel-word,.landing-carousel h2 > .landing-carousel-word { color:#111827 }
.landing-carousel h1 > .landing-accent-line,.landing-carousel h2 > .landing-accent-line { color:#ff6a35 }
.landing-carousel .landing-lead { display:block!important;width:100%;max-width:100%;max-height:none!important;margin:0;color:#626e7c;font-size:clamp(11px,1.7cqw,24px);line-height:1.8;overflow:visible;white-space:normal;overflow-wrap:break-word;-webkit-line-clamp:unset!important;-webkit-box-orient:initial }
.landing-carousel-word { display:inline-block; }
.landing-carousel-slide.is-text-pending .landing-carousel-word { opacity:0; }
.landing-carousel-slide.is-text-animating .landing-carousel-word { opacity:0;animation:landingCarouselWordReveal .28s cubic-bezier(.2,.7,.25,1) var(--word-delay,0s) both; }
@keyframes landingCarouselWordReveal {
    from { opacity:0;transform:translate3d(0,-.22em,0);filter:blur(2px) }
    to { opacity:1;transform:translate3d(0,0,0);filter:blur(0) }
}
.landing-carousel .landing-actions { display:flex;flex-wrap:wrap;gap:clamp(4px,.7vw,10px);margin-top:auto;width:100%;max-width:100%;padding-top:clamp(8px,1.2vw,18px) }
[dir="rtl"] .landing-carousel .landing-carousel-copy { left:auto;right:2.5%;align-items:flex-end;text-align:right }
[dir="rtl"] .landing-carousel .landing-actions { justify-content:flex-start;flex-direction:row-reverse }
.landing-carousel-controls { position:relative;z-index:10;display:flex;align-items:center;justify-content:center;padding:13px 0 15px;background:#fff;border-top:1px solid rgba(237,240,243,.7) }
.landing-carousel-controls button { cursor:pointer }
.landing-carousel .landing-button { font-size:clamp(12px,2vw,16px);text-decoration:none!important }
.landing-carousel .landing-button:hover,.landing-carousel .landing-button:focus-visible,.landing-carousel .landing-button:active { text-decoration:none!important }
.landing-carousel-dots { display:flex;align-items:center;justify-content:center;gap:7px;margin:0 auto;padding:6px 10px;border:0;border-radius:999px;background:transparent;box-shadow:none }
.landing-carousel-dots button { display:block;width:7px;height:7px;flex:0 0 auto;padding:0;border:0;border-radius:20px;background:#cfd5dc;box-shadow:none;cursor:pointer;transition:width .2s ease,background .2s ease }
.landing-carousel-dots button.is-active { width:25px;background:#ff6a35 }
/* FOUR-COLUMN RAIL */
.landing-feature-rail { border-top:1px solid #e9edf1;border-bottom:1px solid #e9edf1;background:#fff }
.landing-feature-grid { display:grid;grid-template-columns:repeat(4,1fr);width:100%;margin:0 }
.landing-feature-grid article { min-height:75px;display:flex;align-items:center;gap:12px;padding:13px 23px;border-right:1px solid #edf0f3 }
.landing-feature-grid article:last-child { border-right:0 }
.landing-feature-grid strong,.landing-feature-grid small { display:block }
.landing-feature-grid strong { font-size:15px;line-height:1.2;letter-spacing:-.025em }
.landing-feature-grid small { margin-top:6px;color:#8b94a1;font-size:12px;line-height:1.7 }
/* SHARED SPLIT SECTIONS */
.landing-section { position:relative;padding:25px;border-top:1px solid #eef0f3;background:#fff }
.landing-split { display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:30px;align-items:center }
.landing-content { position:relative;z-index:5 }
.landing-section-side-label { position:absolute;top:50%;z-index:12;display:block;max-width:calc(100% - 12px);color:#a0a8b3;font-size:8px;font-weight:850;line-height:1.2;letter-spacing:.18em;white-space:nowrap;writing-mode:vertical-rl;pointer-events:none;transform:translateY(-50%) rotate(180deg) }
.landing-privacy-side-label,.landing-devices-side-label,.landing-tools-side-label { right:8px }
.landing-global-side-label,.landing-fit-side-label { left:8px }
.landing-content h2 { max-width:600px;margin:0 0 18px;font-size:var(--landing-heading-size);line-height:.99;letter-spacing:-.06em;font-weight:800 }
.landing-content .landing-body { max-width:530px }
.landing-text-button { display:inline-flex;align-items:center;gap:10px;margin-top:26px;padding-bottom:7px;border-bottom:1px solid #cfd5dc;color:#18212e;text-decoration:none;font-size:11px;font-weight:800 }
.landing-text-button span { font-size:15px;color:#ff6a35 }
.landing-media { position:relative;min-width:0;min-height:0;width:100%;aspect-ratio:16/9;overflow:hidden }
.landing-media .landing-image { position:relative;inset:auto;display:block;width:100%;height:100%;aspect-ratio:16/9;object-fit:contain;object-position:center;z-index:1 }
/* GLOBAL */
.landing-privacy-side-label { right:12px }
.landing-global-side-label { left:12px }
.landing-devices-side-label { right:12px }
.landing-split-reverse .landing-content { order:1 }
.landing-split-reverse .landing-media { order:2 }
.landing-global-media { min-height:0;aspect-ratio:16/9 }
.landing-image-global { object-position:center;transform:none }

/* FULL-WIDTH HERO ROWS */
.landing-section-split,.landing-section-global { padding:0;overflow:hidden }
.landing-section-split .landing-split,.landing-section-global .landing-split { position:relative;display:block;width:100vw;max-width:none;height:auto;min-height:0;aspect-ratio:2/1;margin-left:calc(50% - 50vw);padding:30px max(7.5vw,32px);box-sizing:border-box }
.landing-section-split .landing-media,.landing-section-global .landing-media { position:absolute;inset:0;width:100%;height:100%;min-height:0;aspect-ratio:auto;overflow:hidden;z-index:1 }
.landing-section-split .landing-media .landing-image,.landing-section-global .landing-media .landing-image { position:absolute;inset:0;display:block;width:100%;height:100%;aspect-ratio:auto;object-fit:contain;object-position:center;max-width:none }
.landing-section-split .landing-content,.landing-section-global .landing-content { position:relative;z-index:5;width:min(48%,650px);margin:0 }
.landing-section-privacy .landing-content { position:absolute;top:30px;right:30px;bottom:30px;display:flex;flex-direction:column;width:min(40%,650px);margin:0 }
.landing-section-split.landing-section-privacy .landing-content .landing-text-button,.landing-section-global .landing-content .landing-text-button { align-self:flex-start;margin-top:auto;flex-shrink:0 }
.landing-section-global .landing-content { margin-left:auto;margin-right:0;display:flex;flex-direction:column;height:100% }
.landing-section-global .landing-split-reverse .landing-content { margin-left:-35px;margin-right:auto;order:initial }
/* DEVICES */
.landing-section-devices { padding-bottom:0; }
.landing-section-devices .landing-split { align-items:center }
.landing-devices-media { align-self:end;aspect-ratio:auto;overflow:visible }
.landing-devices-media .landing-image-apps { display:block;width:100%;max-width:none;height:auto;aspect-ratio:auto;object-fit:contain;object-position:center bottom;margin:0 }
/* EXPERIENCE / PROOF */
.landing-section-proof { position:relative;background:#fff;padding-bottom:0; }
.landing-proof-head { display:grid;grid-template-columns:1fr 1fr;gap:90px;align-items:end;margin-bottom:clamp(22px,3vw,36px) }
.landing-proof-head h2 { margin:0;font-size:var(--landing-heading-size);line-height:1;letter-spacing:-.06em }
.landing-proof-head .landing-body { justify-self:end; max-width:490px; }
.landing-proof-grid { display:grid; grid-template-columns:repeat(3,1fr); width:100vw; margin-left:calc((100% - 100vw) / 2); margin-right:0; border-top:1px solid #e4e8ed; border-bottom:1px solid #e4e8ed; }
.landing-proof-grid article { position:relative; min-height:0; padding:18px 20px; border-right:1px solid #e4e8ed; display:grid; grid-template-columns:44px minmax(0,1fr); grid-template-rows:auto auto; column-gap:12px; row-gap:18px; align-content:start; }
.landing-proof-grid article+article { padding-left:20px; }
.landing-proof-grid article:last-child { border-right:0; }
.landing-proof-grid article>span { grid-column:1; grid-row:1; justify-self:center; align-self:start; width:44px; text-align:center; color:#9ca5b0; font-size:9px; font-weight:850; letter-spacing:.14em; margin:2px 0 0; white-space:nowrap; }
.landing-proof-mark { width:44px; height:44px; display:grid; place-items:center; margin:0; border-radius:14px; background:#fff4ed; color:#ff6a35; font-size:22px; grid-column:1; grid-row:2; justify-self:center; align-self:start; }
.landing-proof-grid h3 { grid-column:2; grid-row:1; margin:0; font-size:19px; line-height:1.2; letter-spacing:-.025em; align-self:start; white-space:nowrap; }
.landing-proof-grid p { grid-column:2; grid-row:2; max-width:290px; margin:0; color:#77818e; font-size:12px; line-height:1.7; align-self:start; }
/* USE CASES */
.landing-section-heading { display:grid;grid-template-columns:minmax(0,1fr) minmax(260px,.75fr);gap:64px;align-items:end;margin-bottom:30px }
.landing-section-heading h2 { max-width:690px;margin:0;font-size:var(--landing-heading-size);line-height:1;letter-spacing:-.06em;font-weight:820 }
.landing-section-heading h2 span { color:#ff6a35 }
.landing-section-heading .landing-body { justify-self:end;max-width:490px }
.landing-usecase-grid { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:13px }
.landing-usecase-card { display:grid;grid-template-columns:42px minmax(0,1fr);grid-template-rows:auto auto auto;column-gap:14px;row-gap:0;align-content:start;min-width:0;padding:23px 22px 20px;border:1px solid #e9edf1;border-radius:17px;background:linear-gradient(145deg,#fff 0%,#fcfcfd 100%);box-shadow:0 8px 24px rgba(16,24,40,.025);transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease }
.landing-usecase-card:hover { transform:translateY(-3px);border-color:#f5c2ae;box-shadow:0 14px 28px rgba(16,24,40,.055) }
.landing-usecase-icon { display:grid;place-items:center;grid-column:1;grid-row:1;width:42px;height:42px;margin:0;border-radius:13px;background:#fff2eb;color:#f36b3b;font-size:23px;font-weight:800 }
.landing-usecase-card h3 { grid-column:2;grid-row:1;align-self:center;margin:0;font-size:17px;line-height:1.25;letter-spacing:-.025em }
.landing-usecase-card p { grid-column:1 / -1;grid-row:2;min-height:66px;margin:14px 0 0;color:#717c89;font-size:12px;line-height:1.7 }
.landing-usecase-card>a { grid-column:1 / -1;grid-row:3;display:inline-flex;align-items:center;gap:8px;margin-top:16px;color:#202936;text-decoration:none;font-size:11px;font-weight:800 }
.landing-usecase-card>a span { color:#ff6a35;font-size:15px }
.landing-usecase-note { max-width:860px;margin:18px 0 0;color:#8b94a1;font-size:10px;line-height:1.65 }
/* WEBSITE TOOLS */
.landing-tools-section { background:#fafbfc }
.landing-tools-grid { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px }
.landing-tool-card { display:flex;align-items:center;gap:15px;min-width:0;padding:18px 19px;border:1px solid #e8ebef;border-radius:15px;background:#fff;color:#18212e;text-decoration:none;transition:border-color .18s ease,transform .18s ease,box-shadow .18s ease }
.landing-tool-card:hover { border-color:#f2b49c;transform:translateY(-2px);box-shadow:0 10px 24px rgba(16,24,40,.05) }
.landing-tool-icon { display:grid;place-items:center;flex:0 0 43px;width:43px;height:43px;border-radius:13px;background:#fff1e9;color:#ff6a35;font-size:22px;font-weight:850 }
.landing-tool-copy { display:block;flex:1 1 auto;min-width:0 }
.landing-tool-copy strong,.landing-tool-copy small { display:block }
.landing-tool-copy strong { font-size:13px;line-height:1.4 }
.landing-tool-copy small { margin-top:4px;color:#7a8490;font-size:11px;line-height:1.6 }
.landing-tool-arrow { flex:0 0 auto;color:#ff6a35;font-size:17px }
/* GETTING STARTED */
.landing-steps-grid { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;border-top:1px solid #e5e9ee;border-bottom:1px solid #e5e9ee }
.landing-steps-grid article { display:grid;grid-template-columns:32px minmax(0,1fr);column-gap:14px;row-gap:12px;align-content:start;padding:23px 25px 24px;border-right:1px solid #e5e9ee }
.landing-steps-grid article:first-child { padding-left:0 }
.landing-steps-grid article:last-child { border-right:0 }
.landing-steps-grid article>span { display:grid;grid-column:1;grid-row:1;place-items:center;width:32px;height:32px;border-radius:10px;background:#fff1e9;color:#ff6a35;font-size:10px;font-weight:850;letter-spacing:.08em }
.landing-steps-grid h3 { grid-column:2;grid-row:1;align-self:center;margin:0;font-size:16px;letter-spacing:-.025em }
.landing-steps-grid p { grid-column:1 / -1;max-width:none;margin:0;color:#77818e;font-size:12px;line-height:1.7 }
.landing-how-link { margin-top:3px }
/* FAQ */
.landing-faq-section { background:#fafbfc }
.landing-faq-layout { display:grid;grid-template-columns:minmax(0,.78fr) minmax(0,1.22fr);gap:78px;align-items:start }
.landing-faq-layout .landing-content h2 { font-size:var(--landing-heading-size) }
.landing-faq-list { border-top:1px solid #e1e6eb }
.landing-faq-list details { border-bottom:1px solid #e1e6eb }
.landing-faq-list summary { position:relative;list-style:none;padding:18px 32px 18px 0;color:#202936;font-size:13px;font-weight:750;line-height:1.5;cursor:pointer }
.landing-faq-list summary::-webkit-details-marker { display:none }
.landing-faq-list summary::after { content:"+";position:absolute;right:2px;top:50%;transform:translateY(-50%);color:#ff6a35;font-size:20px;font-weight:500 }
.landing-faq-list details[open] summary::after { content:"−" }
.landing-faq-list details p { max-width:640px;margin:0;padding:0 24px 18px 0;color:#6f7a88;font-size:12px;line-height:1.75 }
[dir="rtl"] .landing-faq-list summary { padding:18px 0 18px 32px }
[dir="rtl"] .landing-faq-list summary::after { right:auto;left:2px }
[dir="rtl"] .landing-faq-list details p { padding:0 0 18px 24px }
/* FINAL CTA */
.landing-final { position:relative;overflow:hidden;background:#fff;padding:0;min-height:0;border-top:1px solid #e9edf1 }
.landing-final-inner { position:relative;display:flex;width:100vw;max-width:none;height:auto;min-height:0;aspect-ratio:2/1;margin-left:calc(50% - 50vw);padding:clamp(44px,6vw,86px) max(7.5vw,32px);box-sizing:border-box;align-items:center;justify-content:flex-end;gap:0 }
.landing-final-art { position:absolute;inset:0;width:100%;height:100%;aspect-ratio:auto;min-height:0;z-index:1 }
.landing-final-image-wrap { position:absolute;inset:0;z-index:1;display:block;width:100%;height:100%;overflow:hidden;border-radius:0;mask-image:none }
.landing-final-image { position:absolute;inset:0;display:block;width:100%;height:100%;aspect-ratio:auto;object-fit:cover;object-position:center }
.landing-final-copy { position:absolute;top:35px;z-index:5;width:min(40%,650px);margin:0 }
.landing-final h2 { max-width:650px;margin:0 0 17px;font-size:var(--landing-heading-size);line-height:.99;letter-spacing:-.06em }
.landing-final-copy>p:not(.landing-eyebrow) { max-width:540px;color:#747e8b;font-size:14px;line-height:1.75;margin:0 }
.landing-final-vertical { position:absolute;right:-10px;top:50%;z-index:6;transform:translateY(-50%) rotate(180deg);writing-mode:vertical-rl;color:#a2a9b3;font-size:8px;font-weight:850;letter-spacing:.18em }
/* RESPONSIVE */
@media(max-width:1000px) {
    .landing-page .site-header { width:100% }
    .landing-page .site-header .vp-premium-header-links { gap:15px }
    .landing-carousel { margin-top:0 }
    .landing-carousel-slide,.landing-carousel .landing-carousel-copy { min-height:0 }
    .landing-carousel .landing-carousel-copy { padding:0 }
    .landing-carousel .landing-lead { line-height:1.7 }
    .landing-carousel-controls { padding:12px 0 14px }
    .landing-body { font-size:14px;line-height:1.5; }    
}
@media(max-width:820px) {
    .landing-page .site-header { min-height:60px }
    .landing-page .site-header .brand-logo-wrap { width:125px }
    .landing-page .site-header .brand-logo-wrap::after { font-size:16px }
    .landing-page .site-header .vp-premium-header-links { gap:10px;font-size:10px }
    .landing-page .site-header .vp-premium-header-links a:not(.button) { display:none }
    .landing-page .site-header .vp-premium-header-links .button { min-height:38px;padding:9px 14px }
    .landing-carousel-slide,.landing-carousel .landing-carousel-copy { min-height:0 }
    .landing-carousel .landing-carousel-copy { left:2.5%;right:auto;padding:0;justify-content:flex-start }
    .landing-carousel h1,.landing-carousel h2 { width:100%;max-width:100%;line-height:1.04;letter-spacing:-.045em;margin-bottom:7px }
    .landing-carousel .landing-carousel-copy .landing-eyebrow { width:100%;letter-spacing:.04em;margin-bottom:6px }
    .landing-carousel .landing-lead { display:block;width:100%;max-width:100%;line-height:1.6;-webkit-line-clamp:unset }
    .landing-carousel .landing-actions { width:100%;max-width:100%;gap:4px;margin-top:auto }
    .landing-carousel .landing-button { min-height:0;padding:4px 5px;line-height:1.15 }
    .landing-carousel-controls { padding:12px 0 14px }
    .landing-feature-grid { grid-template-columns:repeat(2,1fr) }
    .landing-feature-grid article { border-bottom:1px solid #edf0f3 }
    .landing-feature-grid article:nth-child(2) { border-right:0 }
    .landing-feature-grid article:nth-child(3),.landing-feature-grid article:nth-child(4) { border-bottom:0 }
    .landing-split,.landing-proof-head,.landing-community-grid { grid-template-columns:1fr;gap:15px }
    .landing-section-devices .landing-split { display:grid;grid-template-columns:minmax(0,1fr);grid-template-areas:"content" "media";gap:24px;align-items:stretch }
    .landing-section-devices .landing-devices-media { grid-area:media;order:0;align-self:end;aspect-ratio:auto;overflow:visible;margin:0;padding:0 }
    .landing-section-devices .landing-content { grid-area:content;order:0;margin:0 }
    .landing-section-devices .landing-devices-media .landing-image-apps { display:block;width:100%;max-width:100%;height:auto;aspect-ratio:auto;margin:0;object-fit:contain;object-position:center bottom;vertical-align:bottom }
    .landing-split-reverse .landing-content,.landing-split-reverse .landing-media { order:initial }
    .landing-media { min-height:0;aspect-ratio:16/9 }
    .landing-global-media { min-height:0;aspect-ratio:16/9 }
    .landing-body { font-size:13px }
    .landing-proof-head .landing-body { justify-self:start }
    .landing-final-art { min-height:0;aspect-ratio:auto;order:2 }
    .landing-final-copy { order:1 }
    .landing-final-vertical { display:none }
}
@media(max-width:600px) {
    .landing-carousel { margin-top:0 }
    .landing-body { font-size:12px }    
    .landing-carousel-slide,.landing-carousel .landing-carousel-copy { min-height:0 }
    .landing-carousel .landing-carousel-copy { left:2.5%;right:auto;padding:0; }
    .landing-carousel .landing-eyebrow { width:100%;max-width:100%;margin-bottom:5px;letter-spacing:.025em }
    .landing-carousel h1,.landing-carousel h2 { width:100%;max-width:100%;line-height:1.03;margin-bottom:6px;letter-spacing:-.04em }
    .landing-carousel .landing-lead { width:100%;max-width:100%;line-height:1.5; }
    .landing-carousel .landing-actions { width:100%;max-width:100%;margin-top:auto;gap:3px }
    .landing-carousel .landing-button { padding:3px 4px;line-height:1.1 }
    .landing-carousel-controls { padding:8px 0 10px }
    .landing-carousel-dots { gap:6px;padding:5px 8px }
    .landing-page .site-header { width:100% }
    .landing-page .site-header .vp-premium-header-links { display:flex;margin-left:auto }
    .landing-page .site-header .vp-premium-header-links .button { font-size:9px }
    .landing-page .site-header .brand-logo-wrap { width:auto }
    .landing-page .site-header .brand-logo-wrap::after { font-size:15px }
    .landing-actions { margin-top:23px }
    .landing-button { min-height:42px;padding:10px 15px }
    .landing-community-note { margin-top:22px }
    .landing-feature-grid { grid-template-columns:repeat(2,minmax(0,1fr)) }
    .landing-feature-grid article,.landing-feature-grid article:nth-child(2),.landing-feature-grid article:nth-child(3) { border-right:1px solid #edf0f3;border-bottom:1px solid #edf0f3;padding:12px 8px }
    .landing-feature-grid article:nth-child(even) { border-right:0 }
    .landing-feature-grid article:nth-child(3),.landing-feature-grid article:nth-child(4) { border-bottom:0 }
    .landing-feature-grid strong { font-size:14px }
    .landing-feature-grid small { margin-top:5px;font-size:11px;line-height:1.55 }
    .landing-section:not(.landing-section-split):not(.landing-section-global) { padding:25px 0 }
    .landing-section:not(.landing-section-split):not(.landing-section-global).landing-section-devices { padding-bottom:0 }
    .landing-section-side-label { font-size:7px;letter-spacing:.14em }
    .landing-privacy-side-label,.landing-devices-side-label,.landing-tools-side-label { right:5px }
    .landing-global-side-label,.landing-fit-side-label { left:5px }
    .landing-section.landing-section-proof { padding:32px 0 0 }
    .landing-section-heading { grid-template-columns:1fr;gap:16px;margin-bottom:22px }
    .landing-section-heading .landing-body { justify-self:start }
    .landing-usecases { padding-top:25px;padding-bottom:25px }
    .landing-usecase-grid { gap:10px }
    .landing-usecase-card { padding:18px 16px }
    .landing-tools-grid { grid-template-columns:1fr }
    .landing-steps-grid { grid-template-columns:1fr }
    .landing-steps-grid article,.landing-steps-grid article:first-child { padding:19px 0;border-right:0;border-bottom:1px solid #e5e9ee }
    .landing-steps-grid article:last-child { border-bottom:0 }
    .landing-faq-layout { grid-template-columns:1fr;gap:28px }
    .landing-usecase-grid { grid-template-columns:1fr }
    .landing-usecase-card { display:grid;grid-template-columns:42px minmax(0,1fr);column-gap:13px;align-items:start }
    .landing-usecase-icon { grid-column:1;grid-row:1 / span 3;align-self:center;margin:0 }
    .landing-usecase-card h3 { grid-column:2;margin:1px 0 6px }
    .landing-usecase-card p { grid-column:2; min-height: 0; }
    .landing-usecase-card>a { grid-column:2;margin-top:10px }
    .landing-tool-card { gap:11px;padding:15px 13px }
    .landing-tool-icon { flex-basis:38px;width:38px;height:38px }
    .landing-tool-copy strong { font-size:12px }
    .landing-tool-copy small { font-size:10px }
    .landing-carousel .landing-button { font-size:11px; min-height: 0; }
    .landing-media { min-height:0;aspect-ratio:16/9 }
    .landing-global-media { min-height:0;aspect-ratio:16/9 }
    .landing-proof-grid { grid-template-columns:1fr;width:100%;margin-left:0;margin-right:0 }
    .landing-proof-grid article,.landing-proof-grid article+article { border-right:0;border-bottom:1px solid #e4e8ed;padding:18px 24px }
    .landing-proof-grid article:last-child { border-bottom:0;padding-bottom:18px }
}
/* HOMEPAGE FULL-WIDTH HERO ROWS — RESPONSIVE */
@media(max-width:900px) {
    .landing-section-split .landing-split,.landing-section-global .landing-split,.landing-final-inner { min-height:340px;padding:38px 28px }
    .landing-section-split .landing-content,.landing-section-global .landing-content,.landing-final-copy { width:min(40%,600px) }
}
@media(max-width:700px) {
    .landing-eyebrow { font-size:8px;letter-spacing:.14em }
    .landing-section-split .landing-split,.landing-section-global .landing-split { width:100vw;min-width:0;height:auto;min-height:0;aspect-ratio:2/1;margin-left:calc(50% - 50vw);margin-right:0;padding:0;box-sizing:border-box;overflow:hidden }
    .landing-section-split .landing-content,.landing-section-global .landing-content { position:absolute;left:20px;right:auto;top:20px;bottom:12px;width:42%;height:auto;max-width:none;max-height:none;display:flex;flex-direction:column;margin:0!important;padding:0;transform:none;z-index:5;box-sizing:border-box }
    .landing-section-privacy .landing-content { left:auto;right:20px;top:30px;bottom:12px;transform:none;max-height:none }
    .landing-section-split .landing-content h2,.landing-section-global .landing-content h2 { max-width:none;margin:0 0 6px;font-size:var(--landing-heading-size);line-height:1.02;letter-spacing:-.045em;overflow-wrap:normal }
    .landing-section-split .landing-content .landing-body,.landing-section-global .landing-content .landing-body { max-width:none;margin:0;font-size:clamp(9px,2.7vw,11px);line-height:1.5 }
    .landing-section-split .landing-content .landing-text-button,.landing-section-global .landing-content .landing-text-button { max-width:100%;gap:5px;margin-top:auto;padding-bottom:3px;font-size:clamp(9px,2.5vw,10px);line-height:1.2 }
    .landing-section-split .landing-content .landing-text-button span,.landing-section-global .landing-content .landing-text-button span { font-size:11px }
    .landing-section-side-label { display:none }
    .landing-section-proof { padding:30px 0 0 }
    .landing-final { min-height:0 }
    .landing-final-inner { display:block;height:auto;min-height:0;aspect-ratio:2/1;margin-right:0;padding:0;overflow:hidden }
    .landing-final-copy { position:absolute;top:20px;right:10px;left:auto;bottom:auto;width:42%;max-width:none;max-height:calc(100% - 16px);margin:0;padding:0;box-sizing:border-box;overflow:visible }
    .landing-final .landing-eyebrow { margin:0 0 4px;font-size:clamp(6px,1.8vw,8px);line-height:1.2;letter-spacing:.12em }
    .landing-final h2 { max-width:none;margin:0 0 6px;font-size:var(--landing-heading-size);line-height:1.02;letter-spacing:-.045em;overflow-wrap:normal }
    .landing-final-copy>p:not(.landing-eyebrow) { max-width:none;margin:0;font-size:clamp(9px,2.7vw,11px);line-height:1.3 }
    .landing-final-copy .landing-actions { display:flex;flex-wrap:wrap;gap:5px;margin-top:8px }
    .landing-final-copy .landing-button { min-height:0;padding:5px 7px;font-size:clamp(8px,2.3vw,10px);line-height:1.15 }
}
@media(max-width:380px) {
    .landing-section-privacy .landing-content,.landing-section-global .landing-content,.landing-final-copy { width:38%; }
    .landing-section-privacy .landing-content,.landing-section-global .landing-content { max-height:calc(100% - 12px) }
    .landing-section-split .landing-content .landing-body,.landing-section-global .landing-content .landing-body,.landing-final-copy>p:not(.landing-eyebrow) { font-size:9px;line-height:1.24 }
}

/* CLIENT DOWNLOAD CENTER */
.download-center-page { background:#f8fafc;color:#18212e }
.download-center-page main { overflow:hidden }
.download-center,.download-center * { box-sizing:border-box }
.download-center { width:min(1120px,calc(100% - 40px));margin:0 auto;padding:44px 0 76px }
.download-center-hero { position:relative;isolation:isolate;display:grid;grid-template-columns:minmax(0,1.1fr) minmax(250px,.9fr);align-items:center;gap:36px;min-height:310px;margin-bottom:26px;padding:38px 42px;overflow:hidden;border:1px solid #f1e2d9;border-radius:25px;background:linear-gradient(125deg,#fff 0%,#fff9f5 60%,#ffede3 100%);box-shadow:0 18px 44px rgba(31,41,55,.045) }
.download-center-hero h1 { margin:0 0 14px;color:#111827;font-size:clamp(36px,4.5vw,56px);line-height:1;letter-spacing:-.065em }
.download-center-hero h1 span { color:#ff6a35 }
.download-center-hero p:not(.download-center-eyebrow) { max-width:560px;margin:0;color:#687385;font-size:14px;line-height:1.8 }
.download-center-eyebrow { margin:0 0 13px;color:#7d8794;font-size:10px;font-weight:850;letter-spacing:.18em;text-transform:uppercase }
.download-center-hero-art { position:relative;min-height:205px;display:grid;place-items:center }
.download-center-globe { width:185px;height:185px;border:1px solid rgba(255,106,53,.26);border-radius:50%;background:radial-gradient(circle at 30% 25%,#fff 0%,#fff0e6 42%,#ffb27f 100%);box-shadow:0 0 0 18px rgba(255,106,53,.055),0 18px 40px rgba(255,106,53,.12);display:grid;place-items:center;color:#f56b38;font-size:68px }
.download-center-orbit { position:absolute;width:240px;height:95px;border:1px solid rgba(255,106,53,.45);border-radius:50%;transform:rotate(-24deg) }
.download-center-orbit:after { content:"";position:absolute;right:17px;top:5px;width:13px;height:13px;border-radius:50%;background:#ff6a35;box-shadow:0 0 0 7px rgba(255,106,53,.1) }
.download-center-section-head { display:flex;align-items:end;justify-content:space-between;gap:24px;margin:36px 0 18px }
.download-center-section-head h2 { margin:0;color:#111827;font-size:clamp(25px,3vw,34px);line-height:1.1;letter-spacing:-.05em }
.download-center-section-head p { max-width:530px;margin:0;color:#7a8490;font-size:12px;line-height:1.7 }
.download-center-grid { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px }
.download-client-card { display:flex;flex-direction:column;min-width:0;padding:22px;border:1px solid #e7ebf0;border-radius:18px;background:#fff;box-shadow:0 8px 24px rgba(16,24,40,.025) }
.download-client-top { display:flex;align-items:center;gap:13px;margin-bottom:17px }
.download-client-mark { display:grid;place-items:center;flex:0 0 46px;width:46px;height:46px;border-radius:14px;background:#fff0e7;color:#f46b3a;font-size:22px;font-weight:850 }
.download-client-top h3 { margin:0;color:#1d2734;font-size:16px;line-height:1.3 }
.download-client-top p { margin:4px 0 0;color:#87919e;font-size:10px }
.download-client-card>p { flex:1 1 auto;margin:0 0 18px;color:#6f7a88;font-size:12px;line-height:1.75 }
.download-client-tags { display:flex;flex-wrap:wrap;gap:6px;margin-bottom:18px }
.download-client-tags span { padding:5px 8px;border-radius:7px;background:#f3f5f7;color:#647080;font-size:9px;font-weight:750 }
.download-client-links { display:flex;flex-wrap:wrap;gap:8px;margin-top:auto }
.download-client-links a { display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:36px;padding:9px 12px;border:1px solid #e2e7ec;border-radius:10px;color:#202936;text-decoration:none;font-size:10px;font-weight:800 }
.download-client-links a.primary { border-color:#ff6a35;background:#ff6a35;color:#fff }
.download-center-note { margin-top:22px;padding:17px 19px;border:1px solid #f1e3d9;border-radius:14px;background:#fff9f5;color:#786b63;font-size:11px;line-height:1.75 }
.download-center-note strong { color:#4a3d35 }
.download-center-steps { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px }
.download-center-step { padding:18px;border:1px solid #e7ebf0;border-radius:15px;background:#fff }
.download-center-step span { display:inline-grid;place-items:center;width:30px;height:30px;border-radius:9px;background:#fff0e7;color:#f46b3a;font-size:10px;font-weight:850 }
.download-center-step h3 { margin:13px 0 7px;font-size:13px }
.download-center-step p { margin:0;color:#77818e;font-size:11px;line-height:1.7 }
@media(max-width:900px) {
    .download-center-hero { grid-template-columns:minmax(0,1.2fr) minmax(190px,.8fr);gap:15px;padding:30px }
    .download-center-grid { grid-template-columns:repeat(2,minmax(0,1fr)) }
}
@media(max-width:620px) {
    .download-center { width:calc(100% - 28px);padding:28px 0 54px }
    .download-center-hero { grid-template-columns:1fr;gap:4px;padding:25px 22px;border-radius:20px }
    .download-center-hero h1 { font-size:clamp(34px,9.5vw,45px) }
    .download-center-hero p:not(.download-center-eyebrow) { font-size:13px }
    .download-center-hero-art { min-height:150px }
    .download-center-globe { width:135px;height:135px;font-size:48px }
    .download-center-orbit { width:185px;height:70px }
    .download-center-section-head { display:block;margin-top:28px }
    .download-center-section-head p { margin-top:9px }
    .download-center-grid,.download-center-steps { grid-template-columns:1fr }
    .download-client-card { padding:19px }
    .download-center-note { font-size:10px }
}
.auth-page { --auth-navy:#06121f; --auth-navy-2:#0a2238; --auth-blue:#1678c9; --auth-cyan:#43c6e8; --auth-gold:#e4ad42; --auth-panel:#ffffff; --auth-field:#f8fafc; position:relative; isolation:isolate; min-height:100vh; background: radial-gradient(ellipse 52% 48% at 8% 28%,rgba(255,116,76,.52),transparent 68%), radial-gradient(ellipse 46% 55% at 92% 18%,rgba(63,177,244,.54),transparent 70%), radial-gradient(ellipse 48% 50% at 82% 88%,rgba(115,79,211,.46),transparent 72%), radial-gradient(ellipse 44% 44% at 18% 88%,rgba(22,126,205,.44),transparent 72%), linear-gradient(135deg,#e6e8ee 0%,#f8f9fc 36%,#eef3f8 66%,#e4eaf1 100%); }
.auth-page::before { content:""; position:fixed; z-index:-2; inset:-8vh -6vw; pointer-events:none; opacity:1; background: radial-gradient(ellipse at 26% 42%,rgba(255,168,128,.38),transparent 34%), radial-gradient(ellipse at 73% 38%,rgba(71,187,245,.42),transparent 36%), radial-gradient(ellipse at 58% 86%,rgba(116,95,220,.34),transparent 30%); filter:blur(2px); }
.auth-page::after { content:""; position:fixed; z-index:-1; inset:0; pointer-events:none; opacity:.84; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1600 1000' preserveAspectRatio='none'%3E%3Cg fill='none' stroke-linecap='round'%3E%3Cpath d='M-120 770 C180 430 360 900 720 540 S1250 130 1730 420' stroke='%235b7f9b' stroke-opacity='.18' stroke-width='2'/%3E%3Cpath d='M-80 900 C260 600 430 1040 820 690 S1300 290 1710 560' stroke='%23ffffff' stroke-opacity='.38' stroke-width='2'/%3E%3Cpath d='M120 60 C420 250 610 40 900 190 S1320 420 1690 190' stroke='%237b66d8' stroke-opacity='.11' stroke-width='2'/%3E%3Cpath d='M-100 300 C250 90 430 420 760 250 S1260 40 1710 270' stroke='%2347bfe8' stroke-opacity='.14' stroke-width='2'/%3E%3Cpath d='M70 1040 C280 720 510 930 760 790 S1260 610 1670 840' stroke='%235c9fc4' stroke-opacity='.13' stroke-width='2'/%3E%3C/g%3E%3Cg fill='%2355c8ec' fill-opacity='.34'%3E%3Ccircle cx='360' cy='640' r='4'/%3E%3Ccircle cx='1040' cy='300' r='4'/%3E%3Ccircle cx='1320' cy='690' r='4'/%3E%3C/g%3E%3C/svg%3E"); background-size:cover; background-position:center; }
.auth-page main { overflow:visible; }
.auth-wrap { position:relative; z-index:1; width:min(100%,1360px); margin:0 auto; padding:58px 24px 78px; display:flex; justify-content:center; }
.auth-shell { width:100%; min-height:650px; display:grid; grid-template-columns:minmax(0,1.02fr) minmax(470px,.98fr); gap:0; overflow:hidden; border:1px solid rgba(16,24,40,.08); border-radius:36px; background:var(--auth-navy); box-shadow:0 38px 90px rgba(16,24,40,.15),0 14px 34px rgba(16,24,40,.07); }
.auth-showcase { position:relative; isolation:isolate; min-height:650px; padding:38px 44px 34px; overflow:hidden; border:0; border-radius:0; color:#fff; background: radial-gradient(circle at 78% 18%,rgba(86,217,246,.18),transparent 24%), radial-gradient(circle at 18% 88%,rgba(35,137,223,.25),transparent 32%), linear-gradient(145deg,var(--auth-navy) 0%,#081827 48%,var(--auth-navy-2) 100%); }
.auth-showcase::before { content:""; position:absolute; z-index:-1; width:560px; height:560px; right:-220px; top:105px; border:1px solid rgba(122,202,255,.12); border-radius:50%; box-shadow:0 0 0 70px rgba(94,183,255,.022),0 0 0 140px rgba(94,183,255,.015); }
.auth-showcase::after { content:""; position:absolute; z-index:-2; inset:0; opacity:.38; 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:42px 42px; mask-image:linear-gradient(to bottom,transparent 0%,#000 18%,#000 78%,transparent 100%); }
.auth-showcase-top, .auth-showcase-foot { display:flex; align-items:center; justify-content:center; gap:18px; text-align:center; }
.auth-showcase-index { color:rgba(255,255,255,.60); font-size:10px; font-weight:800; letter-spacing:.13em; text-transform:uppercase; }
.auth-globe { position:absolute; z-index:-1; width:min(720px,96%); height:auto; right:-130px; top:84px; opacity:.84; pointer-events:none; filter:drop-shadow(0 0 24px rgba(73,194,255,.08)); }
.auth-showcase-copy { position:relative; z-index:1; width:min(100%,600px); margin:184px auto 0; text-align:center; }
.auth-showcase-kicker { display:inline-flex; align-items:center; justify-content:center; gap:9px; margin:0 0 18px; color:#b7d9ff; font-size:10px; font-weight:800; letter-spacing:.14em; text-transform:uppercase; }
.auth-showcase-kicker::before, .auth-showcase-kicker::after { content:""; width:24px; height:1px; background:linear-gradient(90deg,transparent,var(--auth-cyan)); }
.auth-showcase-kicker::after { background:linear-gradient(90deg,var(--auth-cyan),transparent); }
.auth-showcase-copy h2 { max-width:570px; color:#fff; font-family:Georgia,"Times New Roman",serif; font-size:clamp(31px,3.15vw,48px); line-height:1.08; letter-spacing:.012em; font-style:italic; font-weight:700; text-transform:none; text-wrap:balance; }
.auth-showcase-copy p:not(.auth-showcase-kicker) { max-width:500px; margin:19px auto 0; color:rgba(255,255,255,.68); font-size:14px; line-height:1.72; }
.auth-showcase-foot { position:absolute; left:44px; right:44px; bottom:34px; padding-top:18px; border-top:1px solid rgba(255,255,255,.10); flex-direction:column; gap:12px; }
.auth-showcase-foot > span:first-child { max-width:100%; color:rgba(255,255,255,.58); font-size:10px; font-weight:700; line-height:1.5; letter-spacing:.02em; }
.auth-network { position:relative; width:126px; height:24px; flex:0 0 24px; }
.auth-network::before, .auth-network::after { content:""; position:absolute; left:0; right:0; top:50%; height:1px; background:linear-gradient(90deg,transparent,rgba(84,216,255,.65),transparent); }
.auth-network::after { transform:rotate(11deg); opacity:.48; }
.auth-network i { position:absolute; top:8px; width:6px; height:6px; border-radius:50%; background:#9aeaff; box-shadow:0 0 14px rgba(84,216,255,.75); }
.auth-network i:nth-child(1) { left:13px }
.auth-network i:nth-child(2) { left:59px }
.auth-network i:nth-child(3) { right:12px }
.auth-panel { position:relative; z-index:2; display:flex; align-items:center; min-width:0; background:var(--auth-panel); border:0; border-radius:34px; box-shadow:-10px 0 30px rgba(16,24,40,.055),0 18px 45px rgba(16,24,40,.08); overflow:hidden; }
.auth-panel-inner { width:min(100%,500px); margin:0 auto; padding:72px 68px 64px; }
.auth-panel-switch { position:absolute; top:27px; right:30px; z-index:3; display:inline-flex; align-items:center; gap:7px; color:#344054; font-size:12px; font-weight:750; text-decoration:none; transition:color .18s ease,transform .18s ease; }
.auth-panel-switch:hover { color:#0b1422; transform:translateY(-1px); }
.auth-panel-switch svg { width:17px; height:17px; fill:none; stroke:currentColor; stroke-width:1.65; stroke-linecap:round; stroke-linejoin:round; }
.auth-panel h1 { max-width:100%; margin:0 0 12px; color:#0b1422; font-size:clamp(20px,2vw,27px); line-height:1.2; letter-spacing:.105em; font-weight:800; text-transform:uppercase; text-align:left; }
.auth-panel .auth-lead { max-width:440px; margin:0; color:#697586; font-size:14px; line-height:1.7; }
.auth-error { margin:20px 0 0; padding:12px 14px; border:1px solid #f0c7c7; border-radius:14px; background:#fff8f8; color:#a62b2b; font-size:12px; line-height:1.55; }
.auth-success { margin:20px 0 0; padding:12px 14px; border:1px solid #bfe7d2; border-radius:14px; background:#f1fbf5; color:#18704a; font-size:12px; line-height:1.55; }
.auth-submit-secondary { background:#111827; box-shadow:0 12px 26px rgba(16,24,40,.12); }
.auth-submit-secondary:hover { box-shadow:0 16px 30px rgba(16,24,40,.16); }
.auth-secondary-form { margin-top:11px!important; }
.auth-recovery-note { margin:18px 0 0; color:#667085; font-size:12px; line-height:1.6; }
.auth-recovery-note a { color:#101828; font-weight:700; text-underline-offset:2px; }
.auth-panel form { display:grid; gap:11px; margin-top:23px; }
.auth-field { position:relative; display:flex; align-items:center; min-height:52px; margin:0; padding:0 13px 0 15px; border:1px solid #dfe5ed; border-radius:999px; background:var(--auth-field); box-shadow:0 5px 16px rgba(16,24,40,.028); transition:border-color .2s ease,box-shadow .2s ease,transform .2s ease,background .2s ease; }
.auth-field:focus-within { border-color:rgba(255,103,69,.45); background:#fff; box-shadow:0 0 0 4px rgba(255,103,69,.07),0 10px 24px rgba(16,24,40,.05); transform:translateY(-1px); }
.auth-field-icon { width:30px; height:30px; flex:0 0 30px; display:grid; place-items:center; margin-right:10px; }
.auth-field-icon svg { width:26px; height:26px; display:block; overflow:visible; }
.auth-field input { width:100%; min-width:0; height:48px; border:0; border-radius:0; padding:0 4px; background:transparent; color:#101828; font:inherit; font-size:13px; outline:none; box-shadow:none!important; -webkit-text-fill-color:#101828; caret-color:#101828; }
.auth-field input:-webkit-autofill, .auth-field input:-webkit-autofill:hover, .auth-field input:-webkit-autofill:focus, .auth-field input:-webkit-autofill:active { -webkit-text-fill-color:#101828; -webkit-box-shadow:0 0 0 1000px transparent inset!important; box-shadow:0 0 0 1000px transparent inset!important; transition:background-color 99999s ease-in-out 0s; }
.auth-field input::placeholder { color:#9aa5b4; opacity:1; }
.auth-password-toggle { width:38px; height:38px; flex:0 0 38px; display:grid; place-items:center; margin-left:4px; padding:0; border:0; border-radius:50%; background:transparent; color:#64748b; cursor:pointer; transition:background .18s ease,color .18s ease,transform .18s ease; }
.auth-password-toggle:hover { background:rgba(255,103,69,.08); color:#d34b31; }
.auth-password-toggle:active { transform:scale(.94); }
.auth-password-toggle .auth-eye { width:24px;height:24px;display:none!important;overflow:visible; }
.auth-password-toggle:not(.is-visible) .auth-eye-closed { display:block!important; }
.auth-password-toggle.is-visible .auth-eye-open { display:block!important; }
.auth-submit { width:100%; min-height:50px; margin-top:7px; border:0; border-radius:999px; background:linear-gradient(105deg,#ff5738 0%,#ff7040 45%,#d94188 100%); box-shadow:0 15px 30px rgba(225,76,72,.22); font-size:13px; font-weight:800; letter-spacing:.02em; color:#fff; cursor:pointer; transition:transform .2s ease,box-shadow .2s ease,filter .2s ease; }
.auth-submit:hover { transform:translateY(-2px); box-shadow:0 19px 36px rgba(225,76,72,.27); filter:brightness(1.04); }
.auth-submit:active { transform:translateY(0); }
[dir="rtl"] .auth-field-icon { margin-right:0; margin-left:10px; }
[dir="rtl"] .auth-password-toggle { margin-left:0; margin-right:4px; }
[dir="rtl"] .auth-panel-switch { right:auto; left:30px; }
[dir="rtl"] .auth-panel h1, [dir="rtl"] .auth-panel .auth-lead { text-align:right; }
@media(max-width:1050px) {
    .auth-shell { grid-template-columns:minmax(0,1fr) minmax(420px,.92fr) }
    .auth-showcase { padding-left:34px;padding-right:34px }
    .auth-showcase-foot { left:34px;right:34px }
    .auth-panel-inner { padding:64px 48px 54px }
    .auth-panel-switch { right:24px }
    .auth-globe { right:-190px;opacity:.70 }
}
@media(max-width:800px) {
    .auth-page .site-header { background:#fff;backdrop-filter:none;-webkit-backdrop-filter:none;border-bottom:1px solid rgba(16,24,40,.06) }
    .auth-wrap { padding:14px 14px 52px }
    .auth-shell { display:block; min-height:0; overflow:visible; border-radius:32px; background:transparent; border:0; box-shadow:0 34px 80px rgba(16,24,40,.14),0 10px 30px rgba(16,24,40,.07); }
    .auth-showcase { min-height:500px; padding:24px 22px 26px; border-radius:32px 32px 0 0; z-index:1; }
    .auth-showcase-top { align-items:center }
    .auth-globe { width:560px;right:-235px;top:58px;opacity:.50 }
    .auth-showcase-copy { margin:88px auto 0;max-width:560px }
    .auth-showcase-kicker { margin-bottom:14px;font-size:8px;letter-spacing:.13em }
    .auth-showcase-copy h2 { font-size:clamp(25px,7vw,34px);letter-spacing:.008em;line-height:1.12;max-width:440px }
    .auth-showcase-copy p:not(.auth-showcase-kicker) { margin:14px auto 0;font-size:11px;line-height:1.62;max-width:420px }
    .auth-showcase-foot { left:22px;right:22px;bottom:45px;padding-top:13px }
    .auth-showcase-foot > span:first-child { font-size:8px;max-width:100% }
    .auth-network { width:106px;flex-basis:24px }
    .auth-network i:nth-child(1) { left:8px }
    .auth-network i:nth-child(2) { left:50px }
    .auth-network i:nth-child(3) { right:8px }
    .auth-network::after { transform:rotate(8deg) }
    .auth-panel { display:block; margin:-28px 0 0; border-radius:32px; z-index:2; box-shadow:0 -6px 24px rgba(16,24,40,.035),0 24px 55px rgba(16,24,40,.10); }
    .auth-panel-inner { width:100%;padding:50px 22px 34px }
    .auth-panel-switch { top:22px;right:22px;font-size:11px }
    .auth-panel h1 { font-size:clamp(19px,5.3vw,25px);letter-spacing:.085em;margin-bottom:9px }
    .auth-panel .auth-lead { font-size:12px;line-height:1.62 }
    .auth-panel form { margin-top:19px;gap:10px }
    .auth-field { min-height:50px;padding:0 12px 0 14px }
    .auth-field input { height:45px;font-size:13px }
    .auth-submit { min-height:50px }
}
@media(max-width:430px) {
    .auth-wrap { padding-left:10px;padding-right:10px }
    .auth-showcase { min-height:520px;padding:20px 18px 24px;border-radius:30px 30px 0 0 }
    .auth-globe { width:470px;right:-225px;top:46px;opacity:.44 }
    .auth-showcase-copy { margin-top:94px }
    .auth-showcase-kicker { font-size:7.5px }
    .auth-showcase-copy h2 { font-size:22px;line-height:1.13 }
    .auth-showcase-copy p:not(.auth-showcase-kicker) { font-size:10.5px;max-width:315px;line-height:1.58 }
    .auth-showcase-foot { left:18px;right:18px;bottom:41px }
    .auth-showcase-foot > span:first-child { font-size:7.5px;max-width:100% }
    .auth-network { width:92px; }
    .auth-network i:nth-child(1) { left:4px }
    .auth-network i:nth-child(2) { left:43px }
    .auth-network i:nth-child(3) { right:4px }
    .auth-panel-inner { padding:49px 17px 28px }
    .auth-panel-switch { top:20px;right:18px }
    .auth-panel h1 { font-size:18px;letter-spacing:.075em }
    .auth-field { min-height:49px;padding:0 11px 0 13px }
    .auth-field-icon { width:28px;height:28px;flex-basis:28px;margin-right:8px }
    .auth-field-icon svg { width:25px;height:25px }
    .auth-field input { font-size:12px }
    .auth-password-toggle { width:34px;height:34px;flex-basis:34px;margin-left:3px }
}

.error { margin:16px 0; padding:12px 14px; border:1px solid #f1c4c4; border-radius:12px; background:#fff7f7; color:#b42318; }
.small { font-size:12px!important; }
.dashboard { max-width:1180px; margin:0 auto; padding:90px 24px }
.dashboard h1 { font-size:48px; line-height:1.05; letter-spacing:-.05em; margin:10px 0 14px }
.dashboard>.grid { margin-top:48px; }
@media(max-width:1000px) {
    .hero { grid-template-columns:1fr;min-height:auto;padding-top:70px }
    .hero-visual { min-height:330px }
    .grid,.steps { grid-template-columns:1fr 1fr }
}
@media(max-width:800px) {
    .nav { display:none }
    .menu { display:block;margin-left:auto }
    .hero { padding:55px 18px 70px;gap:20px }
    .hero h1 { font-size:clamp(44px,13vw,66px) }
    .hero-visual { min-height:280px }
    .orb { width:245px;height:245px }
    .glass-card { right:3%;bottom:4%;width:190px }
    .section { padding:68px 18px }
    .grid,.steps { grid-template-columns:1fr }
    .cta { padding:80px 18px }
    .cta h2 { font-size:38px }
}
/* Web translation/header controls */
.selectors { display:flex; align-items:center }
.selector-form { margin:0 }
.dashboard-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; margin-top:42px }
.dashboard-card { border:1px solid var(--line); border-radius:var(--radius); padding:28px; background:#fff; display:flex; flex-direction:column; gap:8px }
.dashboard-card strong { font-size:20px }
.dashboard-card span { color:var(--muted); font-size:14px }
.nav.open { display:flex; position:absolute; top:76px; left:0; right:0; background:#fff; border-bottom:1px solid var(--line); padding:20px; flex-direction:column; align-items:stretch; gap:14px }
.nav.open .button { text-align:center }
@media(max-width:1000px) {
    .dashboard-grid { grid-template-columns:1fr 1fr }
}
@media(max-width:800px) {
    .selectors { margin-right:12px }
    .dashboard-grid { grid-template-columns:1fr }
    .site-header { gap:8px }
}
.selectors { margin-left:auto }
.selector-form { display:flex; gap:8px; align-items:center }
.selector-form select { border:1px solid var(--line); background:#fff; border-radius:999px; padding:8px 12px; font:inherit; font-size:12px; color:var(--ink); appearance: none; cursor: pointer; }
[dir=rtl] { text-align:right }
[dir=rtl] .nav,[dir=rtl] .selector-form { direction:rtl }
[dir=rtl] .glass-card { right:auto; left:5%; }
@media(max-width:1000px) {
    .site-header { flex-wrap:wrap }
    .selectors { order:2 }
    .nav { order:3;width:100%;justify-content:center; gap: 12px; }
}
@media(max-width:800px) {
    .menu { order:4 }
    .nav { order:5 }
    .selector-form select { padding:7px 9px }
}
/* Services UI */
.page-shell { max-width:1180px; margin:0 auto; padding:72px 24px }
.page-heading { max-width:760px }
.page-heading h1 { font-size:48px; line-height:1.05; margin:10px 0 16px }
.page-heading p,.section-head p { color:var(--muted); line-height:1.7 }
.section-block { margin-top:58px }
.section-head { display:flex; justify-content:space-between; align-items:end; gap:20px; margin-bottom:20px }
.section-head h2 { margin:0; font-size:28px }
.service-grid,.plan-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:18px }
.service-card,.plan-card,.empty-card { border:1px solid var(--line); border-radius:var(--radius); background:#fff; padding:24px; box-shadow:0 10px 30px rgba(20,30,50,.04) }
.service-card-top { display:flex; justify-content:space-between; gap:16px; align-items:flex-start }
.service-card h3,.plan-card h3 { margin:5px 0 0; font-size:20px }
.service-label,.plan-kicker { font-size:11px; color:var(--muted); text-transform:uppercase; letter-spacing:.08em }
.status-badge { font-size:11px; border:1px solid var(--line); border-radius:999px; padding:6px 9px }
.service-meta,.plan-meta { display:grid; gap:9px; margin-top:20px; color:var(--muted); font-size:13px }
.plan-price { margin-top:22px }
.plan-price strong { font-size:30px }
.plan-price span { color:var(--muted); font-size:13px }
.plan-card .button { width:100%; margin-top:22px }
.empty-card p { color:var(--muted); line-height:1.7 }
.empty-card .button { display:inline-block; margin-top:8px }
.button.secondary { background:#fff; color:var(--ink); border:1px solid var(--line) }
.button:disabled { opacity:.6; cursor:not-allowed }
@media(max-width:950px) {
    .service-grid,.plan-grid { grid-template-columns:1fr 1fr }
}
@media(max-width:650px) {
    .page-shell { padding:48px 18px }
    .page-heading h1 { font-size:36px }
    .service-grid,.plan-grid { grid-template-columns:1fr }
    .section-head { display:block }
    .section-head p { margin-top:8px }
}
/* Wallet & Payments */
.wallet-hero { margin-top:42px; border:1px solid var(--line); border-radius:28px; padding:34px; background:#fff; box-shadow:0 18px 50px rgba(20,30,50,.06); display:flex; justify-content:space-between; gap:28px; align-items:center }
.wallet-amount { font-size:46px; font-weight:800; letter-spacing:-.03em; margin-top:10px }
.wallet-hero p { color:var(--muted); margin:8px 0 0 }
.wallet-engine { max-width:330px; border:1px solid var(--line); border-radius:18px; padding:18px; display:grid; gap:7px }
.wallet-engine span { color:var(--muted); font-size:13px; line-height:1.6 }
.action-grid { display:grid; grid-template-columns:1fr 1fr; gap:18px }
.action-card { border:1px solid var(--line); border-radius:var(--radius); padding:24px; background:#fff; display:grid; gap:8px; text-decoration:none; color:inherit }
.action-card span { color:var(--muted); font-size:13px; line-height:1.6 }
.payment-list { display:grid; gap:12px }
.payment-row { display:grid; grid-template-columns:1.4fr 1fr auto; gap:20px; align-items:center; border:1px solid var(--line); border-radius:18px; padding:20px 22px; background:#fff }
.payment-main,.payment-info,.payment-side { display:grid; gap:5px }
.payment-main span,.payment-info span,.payment-side span:not(.status-badge) { color:var(--muted); font-size:12px }
.payment-amount { font-weight:750; font-size:18px; color:var(--ink)!important }
.payment-side { text-align:right; justify-items:end }
@media(max-width:760px) {
    .wallet-hero { display:block }
    .wallet-engine { margin-top:24px; max-width:none }
    .action-grid { grid-template-columns:1fr }
    .payment-row { grid-template-columns:1fr }
    .payment-side { text-align:left; justify-items:start }
}
/* Purchase flow */
.purchase-hero { max-width:760px }
.purchase-hero h1 { font-size:48px; line-height:1.05; margin:10px 0 16px }
.purchase-hero p { color:var(--muted); line-height:1.7 }
.purchase-grid { display:grid; grid-template-columns:1fr 1fr; gap:20px; margin-top:34px }
.purchase-card,.purchase-success { border:1px solid var(--line); border-radius:var(--radius); background:#fff; padding:28px; box-shadow:0 12px 34px rgba(20,30,50,.05) }
.purchase-card h2 { margin:0 0 18px }
.price-large { font-size:40px; font-weight:800 }
.points-reference { color:var(--muted); font-size:13px; margin-top:5px }
.purchase-specs { display:grid; gap:10px; margin:24px 0 0 }
.purchase-specs div { display:flex; justify-content:space-between; gap:20px; border-top:1px solid var(--line); padding-top:10px }
.purchase-specs dt { color:var(--muted) }
.purchase-specs dd { margin:0; font-weight:650 }
.server-choice-list { display:grid; gap:10px }
.server-choice { display:flex; gap:12px; align-items:center; border:1px solid var(--line); border-radius:14px; padding:14px; cursor:pointer }
.server-choice:has(input:checked) { border-color:var(--ink); box-shadow:0 0 0 2px rgba(20,30,50,.08) }
.server-choice input { accent-color:var(--ink) }
.server-choice-main { display:grid; gap:3px }
.server-choice-main small { color:var(--muted) }
.button-full { width:100%; margin-top:20px }
.form-note { color:var(--muted); font-size:13px; line-height:1.6 }
.alert { border:1px solid var(--line); border-radius:14px; padding:14px 16px; margin-top:22px }
.alert-error { background:#fff7f7 }
.purchase-success { max-width:860px; margin:0 auto }
.purchase-success h1 { font-size:42px; margin:10px 0 }
.purchase-success p { color:var(--muted); line-height:1.7 }
.purchase-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin:26px 0 }
.purchase-summary div { border:1px solid var(--line); border-radius:14px; padding:15px; display:grid; gap:5px }
.purchase-summary span { font-size:12px; color:var(--muted) }
.config-box { width:100%; min-height:150px; box-sizing:border-box; margin:8px 0 12px; border:1px solid var(--line); border-radius:14px; padding:14px; font:13px/1.6 ui-monospace,SFMono-Regular,Menlo,monospace; background:#fafafa; resize:vertical }
.action-row { display:flex; gap:10px; flex-wrap:wrap; margin-top:20px }
.button-secondary { background:#fff; color:var(--ink); border:1px solid var(--line); }
@media(max-width:760px) {
    .purchase-grid { grid-template-columns:1fr }
    .purchase-hero h1 { font-size:36px }
    .purchase-summary { grid-template-columns:1fr }
    .purchase-success h1 { font-size:34px }
}
/* VIPENVPN Pricing - premium blue pricing system */
.pricing-page { max-width:1240px; margin:0 auto; padding:0 24px 72px; }
.pricing-hero { position:relative; display:flex; align-items:center; min-height:0; margin:16px 0 24px; padding:30px 42px; overflow:hidden; border-radius:28px; background:linear-gradient(112deg,#08265e 0%,#104b91 48%,#1976c9 100%); color:#fff; box-shadow:0 18px 42px rgba(16,45,100,.14); }
.pricing-hero:before { content:""; position:absolute; inset:0; background:linear-gradient(115deg,rgba(255,255,255,0) 35%,rgba(255,255,255,.035) 62%,rgba(255,255,255,.015) 100%); pointer-events:none; }
.pricing-hero-copy { position:relative; z-index:2; width:100%; }
.pricing-hero .eyebrow { color:rgba(255,255,255,.72) }
.pricing-hero h1 { margin:7px 0 8px; font-size:clamp(32px,3.6vw,46px); line-height:1.08; letter-spacing:-.05em }
.pricing-hero p { max-width:760px; margin:0; color:rgba(255,255,255,.8); font-size:15px; line-height:1.6; }
.pricing-controls { margin:0 0 22px; padding:14px 16px; border:1px solid #d7e3f4; border-radius:18px; background:linear-gradient(180deg,#fafdff,#f2f7fd); box-shadow:0 8px 22px rgba(20,50,100,.045) }
.pricing-filter-form { display:grid; grid-template-columns:1fr 1fr; gap:14px }
.pricing-filter { display:flex; align-items:stretch; min-width:0; overflow:hidden; border:1px solid #d3dce8; border-radius:14px; background:#fff; transition:border-color .18s ease,box-shadow .18s ease }
.pricing-filter:focus-within { border-color:#3978c5; box-shadow:0 0 0 3px rgba(57,120,197,.1) }
.pricing-filter>span { display:flex; align-items:center; justify-content:flex-start; flex:0 0 150px; width:150px; padding:0 16px; background:#f1f3f6; border-right:1px solid #d8dee7; color:#68778b; font-size:12px; letter-spacing:.075em; text-transform:uppercase; white-space:nowrap }
.pricing-filter select { display:block; width:100%; min-width:0; appearance:none; border:0; border-radius:0; background-color:#fff; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3E%3Cpath d='m4 6 4 4 4-4' fill='none' stroke='%23677589' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:right 15px center; padding:12px 42px 12px 14px; font:inherit; color:#14213d; cursor:pointer; outline:none }
.pricing-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px }
.pricing-card { position:relative; overflow:hidden; border:1px solid #d8e2ef; border-radius:24px; background:#fff; box-shadow:0 15px 38px rgba(20,55,105,.08); transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease }
.pricing-card:hover { transform:translateY(-4px); border-color:#9dbde2; box-shadow:0 24px 52px rgba(20,55,105,.15) }
.pricing-card-head { position:relative; min-height:48px; display:flex; align-items:center; padding:12px 20px; background:linear-gradient(135deg,#08265e,#1264b7); color:#fff }
.pricing-card-head:after { content:""; position:absolute; right:-35px; top:-50px; width:120px; height:120px; border:1px solid rgba(255,255,255,.2); border-radius:50% }
.pricing-card-head span { display:block; position:relative; z-index:1; font-size:11px; font-weight:800; opacity:.82; text-transform:uppercase; letter-spacing:.12em }
.pricing-card-body { position:relative; padding:22px }
.pricing-period { position:absolute; top:22px; right:22px; display:inline-block; max-width:calc(100% - 44px); padding:5px 9px; border-radius:999px; background:#eef6ff; color:#15549a; font-size:11px; font-weight:750; white-space:nowrap; overflow:hidden; text-overflow:ellipsis }
.pricing-price-row { display:flex; align-items:baseline; justify-content:flex-start; gap:18px; margin:8px 0 22px; white-space:nowrap }
.pricing-price { font-size:35px; line-height:1; font-weight:850; letter-spacing:-.045em; color:#071b49 }
.pricing-per-month { text-align:left; color:#3f628c; font-size:12px; line-height:1.2; display:inline-flex; align-items:baseline; gap:4px }
.pricing-per-month small { display:inline; color:#7b8ba0; font-size:10px; margin:0 }
.pricing-specs { border-top:1px solid #e8eef6 }
.pricing-spec { display:flex; justify-content:space-between; gap:18px; padding:12px 0; border-bottom:1px solid #e8eef6; font-size:12px }
.pricing-spec span { color:#74839a }
.pricing-spec strong { text-align:right; color:#1a2c48 }
.pricing-buy { display:flex; align-items:center; justify-content:space-between; gap:10px; margin-top:20px; padding:12px 15px; border-radius:13px; background:linear-gradient(0deg,#2a7500,#4bdc47); color:#fff; text-decoration:none; font-size:13px; font-weight:750; box-shadow:0 8px 18px rgba(12,83,163,.2); transition:filter .15s ease,transform .15s ease }
.pricing-buy:hover { filter:brightness(1.06); transform:translateY(-1px) }
.pricing-buy span { font-size:17px }
.pricing-empty { padding:50px 24px; text-align:center; border:1px dashed #b9cbe2; border-radius:24px; background:#f8fbff }
.pricing-empty-icon { font-size:38px; color:#5790c9 }
.pricing-empty h2 { margin:8px 0 }
.pricing-empty p { margin:0; color:#6b7d95; }
[dir=rtl] .pricing-price-row { direction:rtl }
[dir=rtl] .pricing-per-month { text-align:right }
[dir=rtl] .pricing-spec strong { text-align:left }
[dir=rtl] .pricing-hero { text-align:right; }
[dir=rtl] .pricing-filter>span { border-right:0; border-left:1px solid #d8dee7; }
[dir=rtl] .pricing-period { right:auto; left:22px; }
@media(max-width:650px) {
    [dir=rtl] .pricing-period { left:18px; }
}
[dir=rtl] .pricing-filter select { background-position:left 15px center; padding-right:14px; padding-left:42px; }
@media(max-width:950px) {
    .pricing-hero { padding:28px 32px }
    .pricing-grid { grid-template-columns:1fr 1fr }
}
@media(max-width:650px) {
    .pricing-page { padding:0 18px 60px }
    .pricing-hero { margin-top:8px; margin-bottom:18px; padding:25px 22px; border-radius:22px }
    .pricing-hero h1 { font-size:clamp(16px,4.8vw,25px); line-height:1.15; white-space:nowrap; letter-spacing:-.04em }
    .pricing-hero p { font-size:14px }
    .pricing-controls { padding:12px; margin-bottom:18px }
    .pricing-filter-form { grid-template-columns:1fr; gap:10px }
    .pricing-filter>span { flex-basis:120px; width:120px; padding:0 12px; font-size:10px }
    .pricing-filter select { padding:11px 38px 11px 12px; background-position:right 12px center; font-size:13px }
    .pricing-grid { grid-template-columns:1fr; gap:16px }
    .pricing-card-head { min-height:44px; padding:10px 18px }
    .pricing-price { font-size:32px }
    .pricing-period { top:20px; right:18px }
}
/* VIPENVPN Server Location - premium purple location selector */
.server-location-page { background:#f7f7fb; }
.server-location-shell { max-width:1240px; margin:0 auto; padding:20px 24px 90px; }
.server-location-hero { position:relative; overflow:hidden; display:grid; grid-template-columns:minmax(0,1fr) minmax(220px,36%); align-items:center; margin:0 0 28px; border-radius:32px; background:linear-gradient(135deg,#1a103f 0%,#39206d 48%,#6946a9 100%); color:#fff; box-shadow:0 28px 70px rgba(61,35,111,.22); }
.server-location-hero:after { content:""; position:absolute; inset:0; z-index:-1; background:radial-gradient(circle at 80% 20%,rgba(255,255,255,.13),transparent 28%),radial-gradient(circle at 18% 100%,rgba(190,150,255,.16),transparent 34%); pointer-events:none; }
.server-location-hero-copy { position:relative; z-index:2; max-width:720px }
.server-location-hero .eyebrow { color:rgba(255,255,255,.68) }
.server-location-hero h1 { line-height:1; }
.server-location-hero p { margin:0; color:rgba(255,255,255,.78); }
.server-location-hero-lines { position:absolute; inset:-20% -5% -20% 42%; opacity:.16; background-image:linear-gradient(115deg,transparent 0 47%,rgba(255,255,255,.7) 48%,transparent 49%),linear-gradient(35deg,transparent 0 47%,rgba(255,255,255,.45) 48%,transparent 49%),linear-gradient(90deg,rgba(255,255,255,.2) 1px,transparent 1px),linear-gradient(rgba(255,255,255,.2) 1px,transparent 1px); background-size:180px 180px,220px 220px,42px 42px,42px 42px; transform:perspective(500px) rotateY(-14deg) rotateZ(-5deg); pointer-events:none; }
.server-location-hero-glow { position:absolute; border-radius:50%; filter:blur(4px); pointer-events:none }
.server-location-hero-glow-one { width:180px; height:180px; right:70px; top:-80px; background:rgba(255,255,255,.09) }
.server-location-hero-glow-two { width:240px; height:240px; right:-80px; bottom:-150px; background:rgba(151,107,255,.2); }
.server-location-plan { position:relative; border:1px solid rgba(255,255,255,.2); background:rgba(255,255,255,.09); box-shadow:inset 0 1px 0 rgba(255,255,255,.08) }
.server-location-plan-label { letter-spacing:.12em; color:rgba(255,255,255,.58); margin-bottom:8px }
.server-location-plan strong { display:block }
.server-location-plan-price { margin-top:18px; font-weight:800; }
.server-location-summary { display:grid; margin:0 0 30px }
.server-location-summary>div { border:1px solid #e6e3ee; border-radius:18px; padding:16px 18px; background:#fff; box-shadow:0 10px 28px rgba(40,28,65,.045) }
.server-location-summary span { color:#7b7788; margin-bottom:6px }
.server-location-catalog { padding:0 }
.server-location-filters { display:flex; gap:8px; flex-wrap:wrap; margin:0 0 22px }
.server-location-filter { border:1px solid #e0dce9; background:#fff; color:#625d70; border-radius:999px; padding:10px 17px; font:inherit; font-size:13px; font-weight:650; cursor:pointer; transition:.2s ease; box-shadow:0 4px 14px rgba(45,28,75,.035) }
.server-location-filter:hover { border-color:#b6a6d2; transform:translateY(-1px) }
.server-location-filter.is-active { border-color:#5b3c91; background:linear-gradient(135deg,#4d2f82,#7652ac); color:#fff; box-shadow:0 9px 22px rgba(91,60,145,.2); }
.server-location-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(min(100%,190px),1fr)); gap:12px }
.server-location-card { position:relative; display:grid; align-items:center; min-height:112px; width:100%; padding:10px 12px; border:1px solid #e5e1eb; border-radius:22px; background:#fff; color:#211c2c; text-align:left; cursor:pointer; box-shadow:0 12px 34px rgba(42,28,62,.055); transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease,background .22s ease }
.server-location-card:hover { transform:translateY(-4px); border-color:#cbbde0; box-shadow:0 18px 42px rgba(64,39,96,.11) }
.server-location-card.is-selected { border-color:#7250a7; background:linear-gradient(145deg,#f5efff 0%,#eee4ff 100%); box-shadow:0 16px 42px rgba(89,57,133,.13),0 0 0 2px rgba(114,80,167,.09); }
.server-location-flag-wrap { position:relative; display:grid; place-items:center; width:100px; height:70px; flex:0 0 100px; box-sizing:border-box; overflow:visible }
.server-location-flag { display:block; width:85px; height:60px; box-sizing:border-box; border-radius:14px; border:1px solid rgba(20,24,35,.10); box-shadow:0 8px 20px rgba(35,22,52,.08); overflow:hidden; transition:opacity .2s ease,transform .2s ease }
.server-location-check { position:absolute; display:grid; place-items:center; width:70px; height:70px; border-radius:50%; background:linear-gradient(145deg,#4d7fe8,#315ed1); color:#fff; font-size:30px; font-weight:800; opacity:0; transform:scale(.78); transition:opacity .2s ease,transform .2s ease; box-shadow:0 12px 28px rgba(49,94,209,.24) }
.server-location-card.is-selected .server-location-check { opacity:1; transform:scale(1) }
.server-location-card.is-selected .server-location-flag { opacity:0; transform:scale(.88); pointer-events:none; }
/* Rectangular country flags - no secondary flag is rendered in the card. */
.server-location-flag.flag-fr { background:linear-gradient(90deg,#0055a4 0 33.333%,#fff 33.333% 66.666%,#ef4135 66.666%); }
.server-location-flag.flag-de { background:linear-gradient(#000 0 33.333%,#dd0000 33.333% 66.666%,#ffce00 66.666%); }
.server-location-flag.flag-se { background:linear-gradient(90deg,transparent 0 30%,#ffcd00 30% 42%,transparent 42%),linear-gradient(transparent 0 37%,#ffcd00 37% 55%,transparent 55%),#006aa7; }
.server-location-flag.flag-us { background:linear-gradient(#b22234 0 7.69%,#fff 7.69% 15.38%,#b22234 15.38% 23.07%,#fff 23.07% 30.76%,#b22234 30.76% 38.45%,#fff 38.45% 46.14%,#b22234 46.14% 53.83%,#fff 53.83% 61.52%,#b22234 61.52% 69.21%,#fff 69.21% 76.90%,#b22234 76.90% 84.59%,#fff 84.59% 92.28%,#b22234 92.28% 100%); position:relative }
.server-location-flag.flag-us:after { content:""; position:absolute; left:0; top:0; width:43%; height:54%; background:#3c3b6e; }
.server-location-flag.flag-gb { background:linear-gradient(90deg,transparent 43%,#fff 43% 57%,transparent 57%),linear-gradient(transparent 40%,#fff 40% 60%,transparent 60%),linear-gradient(32deg,transparent 43%,#c8102e 43% 51%,transparent 51%),linear-gradient(-32deg,transparent 43%,#c8102e 43% 51%,transparent 51%),#012169; }
.server-location-flag.flag-ca { background:linear-gradient(90deg,#d52b1e 0 25%,#fff 25% 75%,#d52b1e 75%); }
.server-location-flag.flag-jp { background:radial-gradient(circle,#bc002d 0 27%,transparent 28%),#fff; }
.server-location-flag.flag-in { background:linear-gradient(#ff9933 0 33.333%,#fff 33.333% 66.666%,#138808 66.666%); position:relative }
.server-location-flag.flag-in:after { content:""; position:absolute; left:50%; top:50%; width:15px; height:15px; border:2px solid #000080; border-radius:50%; transform:translate(-50%,-50%); }
.server-location-flag.flag-it { background:linear-gradient(90deg,#009246 0 33.333%,#fff 33.333% 66.666%,#ce2b37 66.666%); }
.server-location-flag.flag-es { background:linear-gradient(#aa151b 0 25%,#f1bf00 25% 75%,#aa151b 75%); }
.server-location-flag.flag-ie { background:linear-gradient(90deg,#169b62 0 33.333%,#fff 33.333% 66.666%,#ff883e 66.666%); }
.server-location-flag.flag-be { background:linear-gradient(90deg,#000 0 33.333%,#fdda24 33.333% 66.666%,#ef3340 66.666%); }
.server-location-flag.flag-nl { background:linear-gradient(#ae1c28 0 33.333%,#fff 33.333% 66.666%,#21468b 66.666%); }
.server-location-flag.flag-fi { background:linear-gradient(90deg,transparent 0 31%,#003580 31% 43%,transparent 43%),linear-gradient(transparent 0 39%,#003580 39% 57%,transparent 57%),#fff; }
.server-location-flag.flag-no { background:linear-gradient(90deg,transparent 0 30%,#fff 30% 43%,#00205b 43% 55%,#fff 55% 68%,transparent 68%),linear-gradient(transparent 0 36%,#fff 36% 64%,#00205b 64% 100%),#ba0c2f; }
.server-location-flag.flag-dk { background:linear-gradient(90deg,transparent 0 31%,#fff 31% 43%,transparent 43%),linear-gradient(transparent 0 38%,#fff 38% 58%,transparent 58%),#c8102e; }
.server-location-flag.flag-ch { background:#d52b1e; position:relative }
.server-location-flag.flag-ch:after { content:"+"; position:absolute; inset:0; display:grid; place-items:center; color:#fff; font-size:46px; font-weight:700; }
.server-location-flag.flag-at { background:linear-gradient(#ed2939 0 33.333%,#fff 33.333% 66.666%,#ed2939 66.666%); }
.server-location-flag.flag-pl { background:linear-gradient(#fff 0 50%,#dc143c 50%); }
.server-location-flag.flag-pt { background:linear-gradient(90deg,#046a38 0 40%,#da291c 40%); }
.server-location-flag.flag-au { background:#012169; }
.server-location-flag.flag-sg { background:linear-gradient(#ed2939 0 50%,#fff 50%); }
.server-location-flag.flag-generic { background:linear-gradient(135deg,#e8e3ef,#cfc6df); }
.server-location-card-copy { min-width:0; max-width:100%; display:grid; gap:7px; overflow:hidden }
.server-location-card-copy strong { font-size:17px; line-height:1.2; white-space:nowrap; overflow:hidden; text-overflow:ellipsis }
.server-location-card-copy small { font-size:13px; color:#8b8795; line-height:1.3 }
.server-location-card-arrow { place-items:center; width:34px; height:34px; border-radius:50%; color:#aaa3b5; background:#f7f5f9; font-size:18px; transition:.2s ease }
.server-location-card.is-selected .server-location-card-arrow { color:#5d4092; background:#eee8f7; }
.server-location-action { display:flex; align-items:center; justify-content:space-between; gap:20px; margin-top:26px; padding:18px 0 0; border-top:1px solid #e7e3eb }
.server-location-action-note { display:flex; align-items:center; gap:10px; color:#777281; font-size:13px; line-height:1.5 }
.server-location-action-dot { width:8px; height:8px; border-radius:50%; background:#7050a4; box-shadow:0 0 0 5px rgba(112,80,164,.1); flex:0 0 auto }
.server-location-continue { min-width:210px; display:inline-flex; align-items:center; justify-content:center; gap:12px; box-shadow:0 12px 28px rgba(83,51,127,.2) }
.server-location-continue:hover { transform:translateY(-2px); box-shadow:0 16px 32px rgba(83,51,127,.25); }
.server-location-empty { max-width:620px; margin:60px auto; padding:40px 28px; border:1px solid #e5e1eb; border-radius:24px; background:#fff; text-align:center; box-shadow:0 14px 38px rgba(42,28,62,.06) }
.server-location-empty-inline { max-width:none; margin:10px 0 }
.server-location-empty-icon { display:grid; place-items:center; width:58px; height:58px; margin:0 auto 16px; border-radius:50%; background:#f0ebf8; color:#664494; font-size:30px }
.server-location-empty h2 { margin:0 0 8px }
.server-location-empty p { margin:0 0 22px; color:#777281; line-height:1.7; }
@media(max-width:1000px) {
    .server-location-summary { grid-template-columns:repeat(2,1fr) }
}
@media(max-width:680px) {
    .server-location-shell { padding:12px 16px 70px }
    .server-location-hero { min-height:0 }
    .server-location-card { min-height:112px;padding:10px 12px; }
    .server-location-flag-wrap { width:100px;height:70px;flex-basis:100px }
    .server-location-check { width:70px;height:70px;font-size:30px }
    .server-location-card-copy strong { font-size:15px }
    .server-location-continue { width:100%;min-width:0 }
}
@media(max-width:430px) {
    .server-location-filters { flex-wrap:nowrap;overflow:auto;padding-bottom:3px }
    .server-location-filter { white-space:nowrap }
    .server-location-card-arrow { display:none }
}
/* VIPENVPN Server Location - compact layout overrides. Keep all existing site/flag CSS intact. */
.server-location-hero { min-height:220px; padding:30px 38px; gap:28px; isolation: isolate; }
.server-location-hero h1 { margin:8px 0 9px; font-size:clamp(38px,5vw,56px); letter-spacing: -.055em; }
.server-location-hero p { font-size:15px; line-height:1.5; max-width: 650px; }
.server-location-plan { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:center; column-gap:16px; row-gap:2px; padding:14px 18px; border-radius:20px; z-index: 2; backdrop-filter: blur(16px); }
.server-location-plan-label { grid-column:1 / -1; margin:0; font-size:10px; text-transform: uppercase; }
.server-location-plan strong { min-width:0; font-size:18px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.server-location-plan-price { margin:0; font-size:24px; white-space:nowrap; letter-spacing: -.03em; }
.server-location-summary { grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; margin-bottom:26px; }
.server-location-summary > div { display:flex; align-items:center; justify-content:space-between; gap:10px; min-width:0; padding:12px 15px; border-radius:16px; }
.server-location-summary span { display:inline; flex:0 1 auto; margin:0; font-size:11px; white-space:nowrap; }
.server-location-summary strong { min-width:0; font-size:14px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.server-location-action-buttons { display:flex; align-items:center; justify-content:flex-end; gap:10px; direction:ltr; flex:0 0 auto; }
.server-location-change-plan, .server-location-continue { min-width:190px; min-height:50px; display:inline-flex; align-items:center; justify-content:center; gap:10px; border-radius:14px; text-decoration:none; box-sizing:border-box; }
.server-location-change-plan { color:#4e3184 !important; background:#fff; border:1px solid #d8d0e5; box-shadow:0 8px 22px rgba(83,51,127,.10); }
.server-location-change-plan:hover { transform:translateY(-2px); border-color:#bca9d6; box-shadow:0 12px 28px rgba(83,51,127,.16); }
.server-location-continue { background:linear-gradient(135deg,#4e3184,#7752ad); border:0; }
.server-location-action-icon { display:grid; place-items:center; width:30px; height:30px; flex:0 0 30px; border-radius:50%; background:#3f73df; color:#fff; line-height:0; }
.server-location-action-icon svg { display:block; width:16px; height:16px; margin:0; }
.server-location-action-icon path { fill:none; stroke:currentColor; stroke-width:2.6; stroke-linecap:round; stroke-linejoin:round; }
@media(max-width:1000px) {
    .server-location-hero { grid-template-columns:minmax(0,1fr) minmax(200px,38%); min-height:0; padding:34px 38px; }
    .server-location-plan { width:100%; max-width:none; box-sizing:border-box; }
    .server-location-grid { grid-template-columns:repeat(auto-fill,minmax(min(100%,190px),1fr)); }
}
@media(max-width:680px) {
    .server-location-hero { grid-template-columns:minmax(0,1fr) minmax(140px,42%); padding:25px 20px; gap:12px; border-radius:25px; }
    .server-location-hero h1 { font-size:30px; }
    .server-location-hero p { font-size:13px; }
    .server-location-plan { padding:13px 16px; }
    .server-location-plan strong { font-size:16px; }
    .server-location-plan-price { font-size:16px; }
    .server-location-summary { grid-template-columns:repeat(2,minmax(0,1fr)); gap:9px; margin-bottom:22px; }
    .server-location-summary > div { padding:10px 11px; gap:7px; }
    .server-location-summary span { font-size:10px; }
    .server-location-summary strong { font-size:12px; }
    .server-location-action { align-items:stretch; flex-direction:column; }
    .server-location-action-buttons { width:100%; justify-content:stretch; }
    .server-location-change-plan, .server-location-continue { min-width:0; flex:1; width:0; }
    .server-location-hero-lines { inset:-10% -20% 0 20%; }
}
@media(max-width:430px) {
    .server-location-summary > div { padding:9px 10px; }
    .server-location-summary span { font-size:9px; }
    .server-location-summary strong { font-size:11px; }
    .server-location-action-icon { width:28px; height:28px; flex-basis:28px; }
    .server-location-action-icon svg { width:15px; height:15px; }
}
/* VIPENVPN Payment - isolated premium checkout system */
.payment-page { padding: 0 0 86px; background: radial-gradient(circle at 88% 7%, rgba(236, 72, 153, .10), transparent 30%), radial-gradient(circle at 12% 22%, rgba(37, 99, 235, .08), transparent 28%), linear-gradient(180deg, #fbf9ff 0%, #ffffff 38%); }
.payment-page .payment-shell { width: min(1120px, calc(100% - 48px)); margin: 0 auto; }
.payment-page .payment-heading { max-width: 760px; margin: 34px auto 38px 0; }
.payment-page .payment-heading h1 { margin: 10px 0 12px; font-size: clamp(42px, 6vw, 62px); line-height: 1; letter-spacing: -.055em; }
.payment-page .payment-heading p { max-width: 620px; margin: 0; color: var(--muted); font-size: 16px; line-height: 1.75; }
.payment-page .payment-alert-section { margin: 0; }
.payment-page .payment-checkout-grid { display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(340px, .92fr); gap: 22px; align-items: start; }
.payment-page .payment-card { position: relative; overflow: hidden; display: flex; flex-direction: column; min-width: 0; height: 100%; border: 1px solid #e2dff0; border-radius: 26px; background: rgba(255, 255, 255, .97); box-shadow: 0 18px 50px rgba(48, 43, 84, .085); }
.payment-page .payment-card-header { display: flex; align-items: center; min-height: 45px; padding: 11px 28px; background: linear-gradient(110deg, #171b24 0%, #343b49 52%, #596171 100%); color: #fff; }
.payment-page .payment-card-header span { color: rgba(255, 255, 255, .96); font-size: 11px; font-weight: 800; letter-spacing: .14em; line-height: 1.2; text-transform: uppercase; }
.payment-page .payment-card-body { display: flex; flex: 1 1 auto; flex-direction: column; min-height: 0; padding: 30px; }
.payment-page .payment-review-card h2 { margin: 0 0 22px; color: var(--ink); font-size: 34px; line-height: 1.08; letter-spacing: -.045em; }
.payment-page .payment-server, .payment-page .payment-spec { display: flex; align-items: center; justify-content: space-between; gap: 18px; min-height: 52px; box-sizing: border-box; padding: 0 15px; border: 1px solid #e5e1ee; border-radius: 15px; background: linear-gradient(180deg, #ffffff 0%, #fbfaff 100%); }
.payment-page .payment-server { margin: 0 0 12px; }
.payment-page .payment-server span, .payment-page .payment-spec span { color: #747086; font-size: 11px; font-weight: 800; letter-spacing: .09em; line-height: 1.4; text-transform: uppercase; }
.payment-page .payment-server strong, .payment-page .payment-spec strong { min-width: 0; color: #27233a; font-size: 14px; font-weight: 800; line-height: 1.4; text-align: right; white-space: normal; overflow-wrap: anywhere; }
.payment-page .payment-specs { display: grid; grid-template-columns: 1fr; gap: 12px; margin: 0; }
.payment-page .payment-spec { min-width: 0; }
.payment-page .payment-total { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-top: auto; padding-top: 24px; border-top: 1px solid #e9e5ef; }
.payment-page .payment-total span { color: #777187; font-size: 13px; font-weight: 700; }
.payment-page .payment-total-prices { display:flex; align-items:baseline; justify-content:flex-end; flex-wrap:wrap; gap:10px; min-width:0; }
.payment-page .payment-total strong.payment-final-price { color:#5b21b6; font-size:36px; line-height:1; letter-spacing:-.045em; white-space:nowrap; }
.payment-page .payment-total .payment-original-price { color:#2878c7; font-size:21px; font-weight:750; line-height:1.15; letter-spacing:-.025em; text-decoration:line-through; text-decoration-thickness:2px; text-decoration-color:#2878c7; white-space:nowrap; opacity:.95; }
.payment-page .payment-method-option { display: flex; align-items: center; justify-content: space-between; gap: 22px; padding: 20px; border: 1px solid #e2deeb; border-radius: 19px; background: #fff; transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease; }
.payment-page .payment-method-option + .payment-method-option { margin-top: 12px; }
.payment-page .payment-method-option:first-child { border-color: #d7cef1; background: linear-gradient(180deg, #ffffff 0%, #faf8ff 100%); box-shadow: 0 10px 28px rgba(91, 33, 182, .07); }
.payment-page .payment-method-option:hover { border-color: #bdb0df; box-shadow: 0 10px 28px rgba(48, 43, 84, .08); transform: translateY(-1px); }
.payment-page .payment-method-option > div { display: grid; gap: 6px; min-width: 0; }
.payment-page .payment-method-option strong { color: var(--ink); font-size: 16px; line-height: 1.3; }
.payment-page .payment-method-option span:not(.status-badge) { color: var(--muted); font-size: 12px; line-height: 1.6; }
.payment-page .payment-method-option form { flex: 0 0 auto; }
.payment-page .payment-action-button { display: inline-flex; align-items: center; justify-content: center; min-width: 146px; min-height: 44px; padding: 12px 15px; border: 0; border-radius: 13px; background: linear-gradient(135deg, #5b21b6 0%, #2563eb 52%, #db2777 100%); color: #fff; font: inherit; font-size: 13px; font-weight: 800; line-height: 1.2; cursor: pointer; box-shadow: 0 9px 20px rgba(91, 33, 182, .20); transition: filter .15s ease, transform .15s ease, box-shadow .15s ease; }
.payment-page .payment-action-button:hover { filter: brightness(1.05); transform: translateY(-1px); box-shadow: 0 11px 24px rgba(91, 33, 182, .25); }
.payment-page .payment-method-option.is-secondary { background: #fcfbfe; }
.payment-page .status-badge { flex: 0 0 auto; padding: 8px 11px; border: 1px solid #e1dce9; border-radius: 999px; background: #fff; color: #625d70 !important; font-size: 11px !important; line-height: 1.2 !important; white-space: nowrap; }
.payment-page .payment-checkout-note { margin-top: 18px; padding: 17px 18px; border: 1px solid #e3deeb; border-radius: 17px; background: #faf9fc; }
.payment-page .payment-checkout-note strong { display: block; margin-bottom: 5px; color: #423b55; font-size: 12px; }
.payment-page .payment-checkout-note p { margin: 0; color: var(--muted); font-size: 12px; line-height: 1.65; }
.payment-page .payment-change-location { position: relative; display: flex; align-items: center; justify-content: center; gap: 10px; width: 100%; margin-top: 18px; box-sizing: border-box; border: 0; border-radius: 13px; font-size: 13px; font-weight: 800; line-height: 1.2; text-decoration: none; transition: filter .15s ease, transform .15s ease, box-shadow .15s ease; }
.payment-page .payment-change-location-arrow { position: absolute; left: 15px; top: 50%; display: inline-flex; align-items: center; justify-content: center; width: 20px; height: 20px; transform: translateY(-50%); font-size: 16px; line-height: 1; }
.payment-page .payment-change-location > span:nth-child(2) { text-align: center; }
.payment-page .payment-change-location:hover { transform: translateY(-1px); }
.payment-page .payment-error-card, .payment-page .payment-success-card { padding: 17px 19px; border-radius: 18px; }
.payment-page .payment-error-card { margin-top:15px; border: 1px solid #f1c4d8; background: #fff8fb; }
.payment-page .payment-success-card { border: 1px solid #c8d8f2; background: #f7faff; }
.payment-page .payment-error-card p, .payment-page .payment-success-card p { margin: 5px 0 0; color: var(--muted); font-size: 13px; }
[dir="rtl"] .payment-page .payment-heading { margin-left: 0; margin-right: 0; }
[dir="rtl"] .payment-page .payment-server strong, [dir="rtl"] .payment-page .payment-spec strong { text-align: left; }
[dir="rtl"] .payment-page .payment-change-location-arrow { left: auto; right: 15px; transform: translateY(-50%) rotate(180deg); }
@media(max-width:650px) {
    .payment-page { padding-bottom: 60px; }
    .payment-page .payment-shell { width: min(100% - 32px, 1120px); }
    .payment-page .payment-heading { margin: 28px 0 28px; }
    .payment-page .payment-heading h1 { font-size: 40px; }
    .payment-page .payment-review-card h2 { font-size: 29px; }
    .payment-page .payment-server, .payment-page .payment-spec { min-height: 52px; padding: 0 15px; }
    .payment-page .payment-method-option { align-items: flex-start; flex-direction: column; gap: 16px; }
    .payment-page .payment-method-option form, .payment-page .payment-action-button { width: 100%; }
    .payment-page .payment-action-button { min-width: 0; }
    .payment-page .payment-total strong.payment-final-price { font-size:31px; }
    .payment-page .payment-total .payment-original-price { font-size:18px; }
    .payment-page .payment-total-prices { gap:8px; }
}
@media(max-width:430px) {
    .payment-page .payment-shell { width: min(100% - 24px, 1120px); }
    .payment-page .payment-card { border-radius: 22px; }
    .payment-page .payment-card-header { min-height: 45px; padding: 11px 20px; }
    .payment-page .payment-card-body { padding: 20px; }
    .payment-page .payment-server, .payment-page .payment-spec { min-height: 50px; padding: 0 14px; }
    .payment-page .payment-server strong, .payment-page .payment-spec strong { max-width: 62%; }
    .payment-page .payment-change-location { min-height: 50px; }
}
/* VIPENVPN - Unified Responsive Header */
.site-header { position:sticky; top:0; z-index:1000; width:100%; max-width:none; min-height:86px; margin:0; padding:10px max(18px,calc((100% - 1180px) / 2 + 18px)); display:flex; align-items:center; justify-content:center; background:#fff; border-bottom:1px solid rgba(228,231,236,.92); box-shadow:0 8px 24px rgba(16,24,40,.04); backdrop-filter:none; -webkit-backdrop-filter:none; }
.site-header .brand-logo-wrap { position:relative; z-index:2; display:inline-flex; align-items:center; justify-content:center; flex:0 0 auto; line-height:0; }
.site-header .brand-logo { display:block; width:231px; height:auto; max-width:min(37vw,231px); object-fit:contain; }
.site-header .selectors { position:absolute; z-index:2; right:max(18px,calc((100% - 1180px) / 2 + 18px)); left:auto; margin:0; display:flex; align-items:center; }
.site-header .selector-form { display:flex; align-items:center; gap:8px; margin:0; }
.site-header .selector-form select { appearance:none; min-width:96px; border:1px solid var(--line); background:#fff; border-radius:999px; padding:10px 30px 10px 14px; font:inherit; font-size:13px; color:var(--ink); cursor:pointer; outline:none; transition:border-color .18s ease,box-shadow .18s ease; }
.site-header .selector-form select:hover, .site-header .selector-form select:focus { border-color:#c7cdd6; box-shadow:0 0 0 3px rgba(16,24,40,.05); }
.site-header .menu { position:absolute; z-index:1003; left:max(18px,calc((100% - 1180px) / 2 + 18px)); right:auto; top:50%; transform:translateY(-50%); width:46px; height:46px; margin:0; padding:0; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:5px; border:1px solid transparent; border-radius:14px; background:transparent; color:var(--ink); cursor:pointer; transition:background .18s ease,border-color .18s ease; }
.site-header .menu:hover { background:#f7f8fa; border-color:var(--line); }
.site-header .menu.is-open { opacity:0; pointer-events:none; transform:translateY(-50%); }
.site-header .menu-bar { display:block; width:24px; height:2.5px; border-radius:999px; background:currentColor; transition:transform .22s ease,opacity .18s ease; }
.site-header .menu.is-open .menu-bar { transform:none!important; opacity:1!important; }
.site-header .menu.is-open .menu-bar:nth-child(1) { transform:translateY(7.5px) rotate(45deg); }
.site-header .menu.is-open .menu-bar:nth-child(2) { opacity:0; }
.site-header .menu.is-open .menu-bar:nth-child(3) { transform:translateY(-7.5px) rotate(-45deg); }
.site-header .nav { position:fixed; z-index:1002; inset:0 auto 0 0; width:min(300px,88vw); height:100dvh; margin:0; padding:0; display:block; background:#fff; box-shadow:10px 0 20px rgb(50 50 50 / 50%); transform:translateX(-105%); visibility:hidden; opacity:0; transition:transform .28s cubic-bezier(.22,.61,.36,1),opacity .2s ease,visibility 0s linear .28s; overflow-y:auto; overscroll-behavior:contain; border-top-right-radius:24px; border-bottom-right-radius:24px; }
.site-header .nav.open { top:0; left:0; right:auto; display:block; transform:translateX(0); visibility:visible; opacity:1; transition:transform .28s cubic-bezier(.22,.61,.36,1),opacity .2s ease; }
.site-header .nav-inner { min-height:100%; padding:24px 22px 20px; display:flex; flex-direction:column; }
.site-header .nav-header { display:flex; align-items:center; justify-content:space-between; gap:16px; padding-bottom:20px; border-bottom:1px dashed var(--line); }
.site-header .nav-title { font-size:18px; font-weight:750; letter-spacing:-.03em; color:#7d7d7d; white-space:nowrap; }
.site-header .nav-close { width:36px; height:36px; border:1px solid var(--line); border-radius:12px; background:#fff; color:var(--ink); font-size:30px; line-height:1; cursor:pointer; transition:background .18s ease,border-color .18s ease; }
.site-header .nav-close:hover { background:#f7f8fa; border-color:#c7cdd6; }
.site-header .nav-links { display:flex; flex-direction:column; align-items:stretch; gap:2px; padding-top:15px; }
.site-header .nav-links a { display:flex; align-items:center; min-height:50px; padding:10px 12px; gap:13px; border-radius:14px; color:#344054; text-decoration:none; font-size:14px; font-weight:600; transition:background .16s ease,color .16s ease,transform .16s ease; }
.site-header .nav-links a:hover, .site-header .nav-links a:focus-visible { background:#f5f7fa; color:var(--ink); transform:translateX(3px); outline:none; }
.site-header .nav-icon { width:38px; height:38px; flex:0 0 38px; display:grid; place-items:center; border-radius:12px; background:linear-gradient(145deg,#edf5ff,#f8f1ff); box-shadow:inset 0 0 0 1px rgba(16,24,40,.05),0 5px 14px rgba(16,24,40,.06); }
.site-header .nav-icon svg { width:20px; height:20px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.site-header .nav-icon-features { color:#2563eb; background:linear-gradient(145deg,#eaf2ff,#f4f0ff); }
.site-header .nav-icon-how { color:#7c3aed; background:linear-gradient(145deg,#f1ebff,#edf4ff); }
.site-header .nav-icon-support { color:#0891b2; background:linear-gradient(145deg,#e8fbff,#eefaff); }
.site-header .nav-icon-services { color:#2563eb; background:linear-gradient(145deg,#eaf2ff,#f2f7ff); }
.site-header .nav-icon-download-center { color:#ea580c; background:linear-gradient(145deg,#fff0e8,#fff7f1); }
.site-header .nav-icon-pricing { color:#db2777; background:linear-gradient(145deg,#fff0f6,#fff4fa); }
.site-header .nav-icon-express-checkout { color:#ea580c; background:linear-gradient(145deg,#fff0e8,#fff7f1); }
.site-header .nav-icon-wallet { color:#059669; background:linear-gradient(145deg,#e8fff6,#effcf8); }
.site-header .nav-icon-transactions { color:#ea580c; background:linear-gradient(145deg,#fff0e8,#fff7f1); }
.site-header .nav-icon-affiliates { color:#7c3aed; background:linear-gradient(145deg,#f1ebff,#faf6ff); }
.site-header .nav-icon-dashboard { color:#c58b12; background:linear-gradient(145deg,#fff7dc,#fffaf0); }
.site-header .nav-icon-profile { color:#7c3aed; background:linear-gradient(145deg,#f1ebff,#faf6ff); }
.site-header .nav-icon-logout { color:#dc2626; background:linear-gradient(145deg,#ffeded,#fff5f5); }
.site-header .nav-icon-login { color:#2563eb; background:linear-gradient(145deg,#eaf2ff,#f4f8ff); }
.site-header .nav-item { --nav-active-color:#6257c9; --nav-active-bg:linear-gradient(135deg,#f1f5ff,#f8f3ff); --nav-active-shadow:rgba(98,87,201,.13); }
.site-header .nav-item-features { --nav-active-color:#2563eb; --nav-active-bg:linear-gradient(135deg,#eef5ff,#f7f5ff); --nav-active-shadow:rgba(37,99,235,.12); }
.site-header .nav-item-how { --nav-active-color:#7c3aed; --nav-active-bg:linear-gradient(135deg,#f5efff,#faf7ff); --nav-active-shadow:rgba(124,58,237,.12); }
.site-header .nav-item-support { --nav-active-color:#0891b2; --nav-active-bg:linear-gradient(135deg,#ecfbff,#f3fcfa); --nav-active-shadow:rgba(8,145,178,.12); }
.site-header .nav-item-services { --nav-active-color:#2563eb; --nav-active-bg:linear-gradient(135deg,#eef5ff,#f7faff); --nav-active-shadow:rgba(37,99,235,.12); }
.site-header .nav-item-pricing { --nav-active-color:#db2777; --nav-active-bg:linear-gradient(135deg,#fff0f6,#fff8fb); --nav-active-shadow:rgba(219,39,119,.12); }
.site-header .nav-item-express-checkout { --nav-active-color:#ea580c; --nav-active-bg:linear-gradient(135deg,#fff0e8,#fff8f2); --nav-active-shadow:rgba(234,88,12,.14); }
.site-header .nav-item-wallet { --nav-active-color:#059669; --nav-active-bg:linear-gradient(135deg,#edfff8,#f4fffb); --nav-active-shadow:rgba(5,150,105,.12); }
.site-header .nav-item-transactions { --nav-active-color:#ea580c; --nav-active-bg:linear-gradient(135deg,#fff0e8,#fff8f2); --nav-active-shadow:rgba(234,88,12,.12); }
.site-header .nav-item-dashboard { --nav-active-color:#c58b12; --nav-active-bg:linear-gradient(135deg,#fff7dc,#fffdf5); --nav-active-shadow:rgba(197,139,18,.12); }
.site-header .nav-item-profile { --nav-active-color:#7c3aed; --nav-active-bg:linear-gradient(135deg,#f3edff,#fbf8ff); --nav-active-shadow:rgba(124,58,237,.12); }
.site-header .nav-item-logout { --nav-active-color:#dc2626; --nav-active-bg:linear-gradient(135deg,#fff1f1,#fff8f8); --nav-active-shadow:rgba(220,38,38,.10); }
.site-header .nav-item-login { --nav-active-color:#2563eb; --nav-active-bg:linear-gradient(135deg,#eef5ff,#f8fbff); --nav-active-shadow:rgba(37,99,235,.12); }
.site-header .nav-links a.is-active { background:var(--nav-active-bg); color:var(--ink); box-shadow:inset 3px 0 0 var(--nav-active-color),0 7px 18px var(--nav-active-shadow); }
.site-header .nav-links a.is-active .nav-icon { box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--nav-active-color) 14%,transparent),0 5px 14px var(--nav-active-shadow); }
.site-header .nav-footer { margin-top:auto; padding-top:17px; border-top:1px dashed var(--line); }
.site-header .nav-footer-item { display:flex; align-items:center; gap:12px; min-height:54px; padding:8px 10px; border-radius:14px; color:inherit; text-decoration:none; background:linear-gradient(135deg,#f5efff,#fbf8ff); box-shadow:inset 0 0 0 1px rgba(124,58,237,.07); }
.site-header .nav-footer-item:hover { background:linear-gradient(135deg,#f0e8ff,#faf5ff); }
.site-header .nav-footer-icon { width:38px; height:38px; flex:0 0 38px; display:grid; place-items:center; border-radius:12px; background:linear-gradient(145deg,#eee5ff,#f7f1ff); color:#7c3aed; }
.site-header .nav-footer-icon svg { width:27px; height:27px; fill:none; stroke:currentColor; stroke-width:1.5; stroke-linecap:round; stroke-linejoin:round; }
.site-header .nav-footer-copy { display:grid; gap:2px; min-width:0; }
.site-header .nav-footer-copy strong { font-size:13px; }
.site-header .nav-footer-copy small { font-size:11px; color:var(--muted); }
.site-header .nav-footer-note { display:block; margin:10px 2px 0; color:#98a2b3; font-size:10px; letter-spacing:.08em; text-transform:uppercase; }
.site-header .menu-backdrop { position:fixed; z-index:1001; inset:0; background:rgba(16,24,40,.28); backdrop-filter:blur(2px); -webkit-backdrop-filter:blur(2px); opacity:0; visibility:hidden; pointer-events:none; transition:opacity .22s ease,visibility 0s linear .22s; }
.site-header .menu-backdrop.open { opacity:1; visibility:visible; pointer-events:auto; transition:opacity .22s ease; }
.site-header.menu-layer-open { z-index:9997; }
.site-header.menu-layer-open .menu-backdrop { z-index:9998; }
.site-header.menu-layer-open .nav { z-index:9999; }
.site-header.menu-layer-open .menu { z-index:10000; }
body.menu-is-open, body.currency-is-open, body.language-is-open { overflow:hidden; }
[dir="rtl"] .site-header .selectors { left:max(18px,calc((100% - 1180px) / 2 + 18px)); right:auto; }
[dir="rtl"] .site-header .menu { right:max(18px,calc((100% - 1180px) / 2 + 18px)); left:auto; }
[dir="rtl"] .site-header .nav { inset:0 0 0 auto; transform:translateX(105%); box-shadow:-18px 0 50px rgba(16,24,40,.14); border-top-right-radius:0; border-bottom-right-radius:0; border-top-left-radius:24px; border-bottom-left-radius:24px; }
[dir="rtl"] .site-header .nav.open { left:auto; right:0; transform:translateX(0); }
[dir="rtl"] .site-header .nav-links a:hover, [dir="rtl"] .site-header .nav-links a:focus-visible { transform:translateX(-3px); }
[dir="rtl"] .site-header .nav-links a.is-active { box-shadow:inset -3px 0 0 var(--nav-active-color),0 7px 18px var(--nav-active-shadow); }
.site-header .currency-trigger, .site-header .language-trigger { min-width:0; height:39px; display:inline-flex; align-items:center; justify-content:center; padding:7px 13px; border:1px solid var(--line); border-radius:999px; background:#fff; color:var(--ink); font:inherit; font-size:12px; font-weight:700; cursor:pointer; box-shadow:0 2px 8px rgba(16,24,40,.025); transition:border-color .18s ease,box-shadow .18s ease,transform .18s ease; }
.site-header .currency-trigger { min-width:92px; gap:8px; padding:7px 12px; }
.site-header .currency-trigger-code, .site-header .language-trigger-code { display:block; line-height:1; }
.site-header .currency-trigger:hover, .site-header .currency-trigger:focus-visible, .site-header .language-trigger:hover, .site-header .language-trigger:focus-visible { border-color:#c7cdd6; box-shadow:0 0 0 3px rgba(16,24,40,.05); outline:none; }
.currency-trigger-chevron { display:none!important; }
.language-backdrop, .currency-backdrop { position:fixed; inset:0; z-index:9998; width:100vw; height:100dvh; background:rgba(16,24,40,.22); backdrop-filter:blur(3px); -webkit-backdrop-filter:blur(3px); opacity:0; visibility:hidden; pointer-events:none; transition:opacity .2s ease,visibility 0s linear .2s; }
.language-backdrop.open, .currency-backdrop.open { opacity:1; visibility:visible; pointer-events:auto; transition:opacity .2s ease; }
.language-panel, .currency-panel { position:fixed; top:50%; left:50%; z-index:9999; width:min(390px,calc(100vw - 42px)); transform:translate(-50%,-50%) scale(.985); display:flex; flex-direction:column; overflow:hidden; border:1px solid rgba(255,255,255,.8); border-radius:24px; background:#fff; box-shadow:0 30px 80px rgba(16,24,40,.24); opacity:0; visibility:hidden; pointer-events:none; transition:transform .22s ease,opacity .18s ease,visibility 0s linear .22s; }
.language-panel { max-height:min(72vh,420px); }
.currency-panel { height:auto; max-height:min(78vh,530px); }
.language-panel.open, .currency-panel.open { transform:translate(-50%,-50%) scale(1); opacity:1; visibility:visible; pointer-events:auto; transition:transform .22s ease,opacity .18s ease; }
.language-panel-head, .currency-panel-head { position:relative; flex:0 0 62px; min-height:62px; height:62px; display:flex; align-items:center; justify-content:space-between; padding:10px 18px; color:#fff; background:linear-gradient(135deg,#0a3b8f 0%,#2169c8 50%,#7653d7 100%); overflow:hidden; }
.language-panel-head:after, .currency-panel-head:after { content:""; position:absolute; width:190px; height:190px; right:-55px; top:-105px; border:1px solid rgba(255,255,255,.17); border-radius:50%; box-shadow:0 0 0 26px rgba(255,255,255,.035),0 0 0 52px rgba(255,255,255,.025); pointer-events:none; }
.language-panel-head h2, .currency-panel-head h2 { position:relative; z-index:1; margin:0; font-size:20px; line-height:1.2; letter-spacing:-.035em; }
.currency-panel-head > div { display:flex; align-items:center; }
.currency-panel-head .currency-panel-eyebrow { display:none; }
.currency-panel-close, .language-panel-close { position:relative; z-index:2; width:40px; height:40px; flex:0 0 40px; border:1px solid rgba(255,255,255,.28); border-radius:50%; background:rgba(255,255,255,.10); color:#fff; font-size:25px; line-height:1; cursor:pointer; transition:background .18s ease,transform .18s ease; }
.currency-panel-close:hover, .language-panel-close:hover { background:rgba(255,255,255,.18); transform:rotate(3deg); }
.language-list, .currency-list { min-height:0; overflow-y:auto; padding:10px; overscroll-behavior:contain; }
.currency-list { max-height:calc(7 * 58px + 20px); scrollbar-gutter:stable; }
.language-option, .currency-option { width:100%; min-height:58px; display:flex; align-items:center; gap:12px; padding:8px 10px; border:0; border-radius:15px; background:transparent; color:var(--ink); text-align:left; cursor:pointer; font:inherit; transition:background .16s ease,transform .16s ease; }
.language-option:hover, .currency-option:hover { background:#f6f8fb; transform:translateX(2px); }
.language-option.is-selected, .currency-option.is-selected { background:linear-gradient(135deg,#f1f6ff,#f8f3ff); }
.language-flag, .currency-flag { display:grid; place-items:center; width:42px; height:28px; flex:0 0 42px; border-radius:5px; background:transparent; box-shadow:none; font-size:27px; line-height:1; overflow:hidden; clip-path:inset(0 round 5px); -webkit-clip-path:inset(0 round 5px); }
.language-flag { width:42px; height:28px; flex-basis:42px; }
.currency-flag { width:42px; height:28px; flex-basis:42px; }
.language-option-copy, .currency-option-copy { min-width:0; flex:1 1 auto; display:flex; align-items:baseline; gap:9px; white-space:nowrap; overflow:hidden; }
.language-option-copy strong, .currency-option-copy strong { flex:0 0 auto; font-size:13px; letter-spacing:.03em; }
.language-option-copy span, .currency-option-copy span { min-width:0; overflow:hidden; text-overflow:ellipsis; color:var(--muted); font-size:12px; }
.currency-radio, .language-radio { width:20px; height:20px; flex:0 0 20px; display:grid; place-items:center; border:1.5px solid #c7cdd6; border-radius:50%; }
.currency-radio span, .language-radio span { width:10px; height:10px; border-radius:50%; background:transparent; }
.currency-option.is-selected .currency-radio, .language-option.is-selected .language-radio { border-color:#1769c2; }
.currency-option.is-selected .currency-radio span, .language-option.is-selected .language-radio span { background:#1769c2; }
[dir="rtl"] .currency-option, [dir="rtl"] .language-option { text-align:right; }
[dir="rtl"] .currency-option:hover, [dir="rtl"] .language-option:hover { transform:translateX(-2px); }
[dir="rtl"] .currency-option-copy, [dir="rtl"] .language-option-copy { direction:rtl; }
@media(max-width:800px) {
    .brand-logo { width:150px }
    .site-header .nav { width:min(275px,80vw); }
    .site-header { min-height:76px; padding-top:8px; padding-bottom:8px; padding: 14px 18px; }
    .site-header .brand-logo { width:187px; max-width:48vw; }
    .site-header .currency-trigger { min-width:82px; height:36px; padding:6px 9px; font-size:11px; }
    .site-header .nav-inner { padding:20px 18px 18px; }
    .language-panel, .currency-panel { width:min(360px,calc(100vw - 34px)); }
    .language-panel-head, .currency-panel-head { min-height:58px; height:58px; flex-basis:58px; padding:9px 18px; }
    .language-panel-head h2, .currency-panel-head h2 { font-size:20px; }
    .language-option, .currency-option { min-height:56px; }
    .currency-panel { max-height:min(78vh,500px); }
    .currency-list { max-height:412px; }
}
@media(max-width:700px) {
    .site-header { min-height:76px; padding:8px 14px; }
    .site-header .menu { left:10px; width:42px; height:42px; }
    .site-header .selectors { right:10px; }
    .site-header .selector-form { gap:5px; }
    .site-header .selector-form select { min-width:0; padding:8px 10px; font-size:11px; }
    .site-header .nav-inner { padding:20px 18px 18px; }
    [dir="rtl"] .site-header .menu { right:10px; left:auto; }
    [dir="rtl"] .site-header .selectors { left:10px; right:auto; }
}
@media(max-width:480px) {
    .site-header .language-trigger, .site-header .currency-trigger { height:36px; padding:6px 9px; font-size:10px; }
    .site-header .currency-trigger { min-width:74px; }
    .site-header .brand-logo { width:141px; max-width:38vw; }
    .site-header .selector-form { gap:4px; }
    .site-header .selector-form select { padding:7px 7px; font-size:10px; }
    .site-header .menu { left:7px; }
    .site-header .selectors { right:7px; }
    .language-panel, .currency-panel { width:min(360px,calc(100vw - 34px)); }
    .currency-panel { max-height:min(78vh,520px); }
    .currency-list { max-height:calc(7 * 56px + 20px); }
    .language-panel-head, .currency-panel-head { min-height:58px; height:58px; padding:9px 16px; }
    .language-panel-head h2, .currency-panel-head h2 { font-size:19px; }
    .language-option-copy span, .currency-option-copy span { font-size:11px; }
    .currency-option-copy { gap:7px; }
    .language-flag, .currency-flag { width:40px; height:27px; flex-basis:40px; font-size:25px; border-radius:5px; }
    [dir="rtl"] .site-header .menu { right:7px; left:auto; }
    [dir="rtl"] .site-header .selectors { left:7px; right:auto; }
}
@media(max-width:420px) {
    .site-header .brand-logo { max-width:34vw; }
    .site-header .currency-trigger { padding:6px 7px; font-size:10px; }
    .site-header .menu { left:7px; }
    .site-header .selectors { right:7px; }
}
/* =========================================================
   VIPENVPN Wallet - page-local styles
   All selectors are scoped to .wallet-page so the shared
   header, sidebar, language picker and currency picker remain untouched.
   ========================================================= */
.wallet-page { max-width:1180px; margin:0 auto; padding-top:20px; padding-bottom:72px; }
.wallet-intro { max-width:780px; margin:0 auto 34px; text-align:center; }
.wallet-intro .eyebrow { margin-bottom:10px; }
.wallet-intro h1 { margin:0; letter-spacing:-.035em; }
.wallet-intro p { max-width:700px; margin:14px auto 0; color:#667085; line-height:1.8; }
.wallet-balance-card { position:relative; overflow:hidden; display:flex; align-items:center; justify-content:space-between; padding:34px 38px; border:1px solid rgba(30,73,145,.12); border-radius:28px; background:linear-gradient(135deg,#071f4f 0%,#0b438f 48%,#315fc1 100%); color:#fff; box-shadow:0 24px 60px rgba(17,54,112,.18), inset 0 1px 0 rgba(255,255,255,.16); }
.wallet-balance-glow { position:absolute; width:390px; height:390px; right:-120px; top:-200px; border-radius:50%; background:rgba(255,255,255,.11); filter:blur(2px); }
.wallet-balance-content { position:relative; z-index:1; display:flex; align-items:center; gap:20px; }
.wallet-balance-icon { width:58px; height:58px; display:grid; place-items:center; flex:0 0 58px; border:1px solid rgba(255,255,255,.2); border-radius:18px; background:rgba(255,255,255,.1); box-shadow:inset 0 1px 0 rgba(255,255,255,.16); }
.wallet-balance-icon svg { width:29px; height:29px; }
.wallet-balance-label { display:block; font-size:13px; font-weight:700; letter-spacing:.09em; text-transform:uppercase; color:rgba(255,255,255,.72); }
.wallet-balance-value { margin-top:4px; font-size:clamp(34px,5vw,54px); line-height:1.08; font-weight:800; letter-spacing:-.045em; }
.wallet-balance-note { display:block; margin-top:7px; font-size:13px; color:rgba(255,255,255,.7); }
.wallet-balance-status { position:relative; z-index:1; display:flex; align-items:center; gap:8px; align-self:flex-start; padding:9px 13px; border:1px solid rgba(255,255,255,.16); border-radius:999px; background:rgba(255,255,255,.09); font-size:12px; font-weight:700; color:rgba(255,255,255,.88); }
.wallet-status-dot { width:7px; height:7px; border-radius:50%; background:#a8f0c0; box-shadow:0 0 0 4px rgba(168,240,192,.12); }
.wallet-topup { margin-top:25px; }
.wallet-section-heading { display:flex; align-items:end; justify-content:space-between; gap:30px; margin-bottom:18px; }
.wallet-section-heading > div { display:flex; align-items:center; gap:13px; }
.wallet-section-kicker { display:grid; place-items:center; width:30px; height:30px; border-radius:10px; background:#edf4ff; color:#1757ae; font-size:12px; font-weight:800; }
.wallet-section-heading h2 { margin:0; font-size:27px; letter-spacing:-.025em; }
.wallet-section-heading p { max-width:570px; margin:0; color:#667085; line-height:1.7; text-align:right; }
[dir="rtl"] .wallet-section-heading p { text-align:left; }
.wallet-topup-card { border:1px solid #e8ecf2; border-radius:26px; background:#fff; box-shadow:0 14px 40px rgba(16,24,40,.07); }
.wallet-step-block { padding:29px 30px; }
.wallet-step-title { display:flex; align-items:center; gap:11px; margin-bottom:18px; }
.wallet-step-title > span { display:grid; place-items:center; width:28px; height:28px; border-radius:9px; background:#f1f5fb; color:#164f9e; font-size:12px; font-weight:800; }
.wallet-step-title h3 { margin:0; font-size:18px; }
.wallet-preset-grid { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:10px; }
.wallet-preset { min-height:58px; padding:10px 12px; border:1px solid #e3e8ef; border-radius:15px; background:#fff; color:#182230; font:inherit; font-weight:750; cursor:pointer; transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease,background .18s ease; }
.wallet-preset:hover { transform:translateY(-2px); border-color:#a8c2e7; box-shadow:0 8px 20px rgba(22,79,158,.08); }
.wallet-preset.is-selected { border-color:#2867c4; background:#f1f6ff; color:#1453a4; box-shadow:0 0 0 2px rgba(40,103,196,.08); }
.wallet-preset-empty { grid-column:1/-1; padding:15px; color:#667085; background:#f8fafc; border-radius:14px; text-align:center; }
.wallet-custom-field { display:flex; align-items:center; justify-content:space-between; gap:18px; margin-top:16px; padding:13px 15px; border:1px solid #e6eaf0; border-radius:15px; background:#fafbfc; }
.wallet-custom-field > span:first-child { font-size:13px; font-weight:700; color:#475467; }
.wallet-input-wrap { display:flex; align-items:center; gap:9px; min-width:190px; color:#667085; }
.wallet-input-wrap input { width:100%; border:0; outline:0; background:transparent; color:#182230; font:inherit; font-weight:700; text-align:end; }
.wallet-input-wrap input::placeholder { color:#98a2b3; font-weight:500; }
.wallet-step-divider { height:1px; margin:0 30px; background:#edf0f4; }
.wallet-method-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; }
.wallet-method { position:relative; display:flex; align-items:center; gap:11px; min-height:70px; padding:12px 13px; border:1px solid #e3e8ef; border-radius:15px; background:#fff; color:#182230; text-align:start; font:inherit; cursor:pointer; transition:border-color .18s ease,box-shadow .18s ease,transform .18s ease; }
.wallet-method:hover { transform:translateY(-2px); border-color:#b9c9e2; box-shadow:0 8px 20px rgba(16,24,40,.06); }
.wallet-method.is-selected { border-color:#2867c4; box-shadow:0 0 0 2px rgba(40,103,196,.08); background:#f8fbff; }
.wallet-method-mark { display:grid; place-items:center; width:39px; height:39px; flex:0 0 39px; border-radius:11px; background:#f2f4f7; color:#344054; font-size:18px; font-weight:800; }
.wallet-method-stripe { color:#635bff; background:#f1efff; }
.wallet-method-paypal { color:#0070ba; background:#eef8ff; }
.wallet-method-apple { color:#111; background:#f1f1f1; }
.wallet-method-google { color:#4285f4; background:#eff6ff; }
.wallet-method-copy { display:flex; min-width:0; flex:1; flex-direction:column; gap:3px; }
.wallet-method-copy strong { font-size:13px; }
.wallet-method-copy small { font-size:10px; color:#98a2b3; }
.wallet-method-check { opacity:0; display:grid; place-items:center; width:20px; height:20px; border-radius:50%; background:#2867c4; color:#fff; font-size:11px; }
.wallet-method.is-selected .wallet-method-check { opacity:1; }
.wallet-payment-button { display:flex; align-items:center; justify-content:space-between; width:100%; margin-top:20px; min-height:54px; padding:0 18px; border:0; border-radius:15px; background:linear-gradient(135deg,#1355a5,#3976d0); color:#fff; font:inherit; font-weight:800; cursor:pointer; box-shadow:0 10px 24px rgba(31,91,175,.18); }
.wallet-payment-button:disabled { opacity:.48; cursor:not-allowed; box-shadow:none; }
.wallet-payment-note { margin:10px 0 0; color:#98a2b3; font-size:11px; text-align:center; }
.wallet-secondary-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; margin-top:18px; }
.wallet-secondary-card { display:flex; align-items:center; gap:13px; min-height:82px; padding:15px 17px; border:1px solid #e8ecf2; border-radius:20px; background:#fff; color:#182230; text-decoration:none; box-shadow:0 8px 24px rgba(16,24,40,.045); transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease; }
a.wallet-secondary-card:hover { transform:translateY(-2px); border-color:#cbd8e9; box-shadow:0 13px 28px rgba(16,24,40,.07); }
.wallet-secondary-icon { display:grid; place-items:center; width:39px; height:39px; flex:0 0 39px; border-radius:12px; background:#f3f7fd; color:#2464b8; font-size:18px; font-weight:700; }
.wallet-secondary-card > span:nth-child(2) { display:flex; flex:1; min-width:0; flex-direction:column; gap:4px; }
.wallet-secondary-card strong { font-size:14px; }
.wallet-secondary-card small { color:#667085; font-size:11px; line-height:1.5; }
.wallet-secondary-card > span:last-child { color:#667085; font-size:18px; }
.wallet-secondary-link { padding:7px 10px; border-radius:9px; background:#f3f7fd; color:#1757ae; font-size:11px; font-weight:800; text-decoration:none; white-space:nowrap; }
.wallet-telegram-card.is-linked .wallet-secondary-icon { background:#edf9f2; color:#16834a; }
.wallet-telegram-card.is-linked .wallet-secondary-link { background:#edf9f2; color:#16834a; }
[dir="rtl"] .wallet-balance-status { flex-direction:row-reverse; }
[dir="rtl"] .wallet-custom-field { flex-direction:row-reverse; }
[dir="rtl"] .wallet-input-wrap input { text-align:start; }
[dir="rtl"] .wallet-method { text-align:right; }
[dir="rtl"] .wallet-secondary-card { flex-direction:row-reverse; }
@media (max-width:900px) {
    .wallet-page { padding-top:12px; }
    .wallet-balance-card { padding:28px; }
    .wallet-preset-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
    .wallet-method-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
    .wallet-section-heading { align-items:start; flex-direction:column; gap:10px; }
    .wallet-section-heading p, [dir="rtl"] .wallet-section-heading p { max-width:720px; text-align:start; }
}
@media (max-width:620px) {
    .wallet-page { padding-bottom:50px; }
    .wallet-intro { margin-bottom:24px; }
    .wallet-balance-card { padding:23px 20px; border-radius:22px; align-items:flex-start; flex-direction:column; gap:17px; }
    .wallet-balance-content { gap:13px; }
    .wallet-balance-icon { width:48px; height:48px; flex-basis:48px; border-radius:15px; }
    .wallet-balance-icon svg { width:25px; height:25px; }
    .wallet-balance-value { font-size:34px; }
    .wallet-balance-status { align-self:auto; }
    .wallet-step-block { padding:22px 17px; }
    .wallet-step-divider { margin:0 17px; }
    .wallet-preset-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
    .wallet-method-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
    .wallet-custom-field { align-items:stretch; flex-direction:column; gap:8px; }
    .wallet-input-wrap { width:100%; min-width:0; }
    .wallet-secondary-grid { grid-template-columns:1fr; }
}
@media (max-width:390px) {
    .wallet-preset { min-height:52px; font-size:12px; }
    .wallet-balance-value { font-size:30px; }
}
/* Location-only refinements: remove card arrows and keep 3 columns above mobile. */
.server-location-card-arrow { display:none !important; }
.server-location-card { grid-template-columns:100px minmax(0,1fr); gap:8px; }
@media(max-width:680px) {
    .server-location-grid { grid-template-columns:repeat(auto-fill,minmax(min(100%,190px),1fr)); gap:12px; }
    .server-location-card { grid-template-columns:100px minmax(0,1fr); gap:8px; }
}
@media(max-width:430px) {
}
/* VIPENVPN Wallet - final wallet UI layer */
/* =========================================================
   VIPENVPN Wallet - additive UI layer
   This file contains only the new Wallet rules introduced for the
   PayPal success state, payment SVGs, five-method layout and compact
   mobile custom amount field. The shared styles.css remains untouched.
   ========================================================= */
.wallet-method-grid-five { grid-template-columns:repeat(3,minmax(0,1fr)); }
.wallet-method-grid-five .wallet-method-mark svg { width:26px; height:26px; display:block; }
.wallet-method-grid-five .wallet-method-crypto { background:#fff5e8; color:#f7931a; }
.wallet-method-grid-five .wallet-method.is-disabled { cursor:not-allowed; opacity:.62; }
.wallet-method-grid-five .wallet-method.is-disabled .wallet-method-check { display:none; }
/* PayPal wallet checkout uses the same centered implementation as payment.php. */
.wallet-page .payment-paypal-panel { display:block; width:100%; box-sizing:border-box; margin-top:20px; padding:20px; border:1px solid #d9c8f4; border-radius:18px; background:linear-gradient(180deg,#fbf9ff 0%,#f7fbff 100%); box-shadow:0 10px 26px rgba(76,48,148,.07); }
.wallet-page .payment-paypal-panel[hidden] { display:none !important; }
.wallet-page .payment-paypal-copy strong { display:block; color:#172033; font-size:17px; }
.wallet-page .payment-paypal-copy p { margin:6px 0 14px; color:#6b7280; font-size:12px; line-height:1.6; }
.wallet-page .payment-paypal-amount { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:14px; padding:11px 13px; border:1px solid #e6eaf0; border-radius:12px; background:#fff; color:#667085; font-size:12px; }
.wallet-page .payment-paypal-amount b { color:#4c20a8; font-size:16px; }
.wallet-page .payment-paypal-buttons-wrap { width:min(100%,420px); margin:0 auto; }
.wallet-page .payment-paypal-status { min-height:20px; margin:10px 0 0; color:#667085; font-size:12px; line-height:1.5; text-align:center; }
.wallet-page .payment-paypal-status.is-processing { opacity:.72; }
.wallet-payment-success { display:flex; align-items:flex-start; gap:12px; margin:16px auto 0; width:min(100%,430px); padding:14px 16px; border:1px solid rgba(34,197,94,.24); border-radius:14px; background:rgba(34,197,94,.08); color:#166534; }
.wallet-payment-success[hidden] { display:none; }
.wallet-payment-success-icon { width:28px; height:28px; flex:0 0 28px; display:grid; place-items:center; border-radius:50%; background:#22c55e; color:#fff; }
.wallet-payment-success-icon svg { width:17px; height:17px; }
.wallet-payment-success > span:last-child { display:block; font-size:.84rem; opacity:.9; }
.wallet-payment-success strong { margin-bottom:3px; font-size:.95rem; }
.wallet-payment-processing { opacity:.72; }
.wallet-custom-field-inline { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:center; gap:14px; }
.wallet-custom-field-inline > span:first-child { text-transform:capitalize; white-space:nowrap; }
.wallet-custom-field-inline .wallet-input-wrap, .wallet-custom-field-inline input { min-width:0; }
.wallet-custom-field-inline input::placeholder { font-weight:400; }
@media (max-width:900px) {
    .wallet-method-grid-five { grid-template-columns:repeat(3,minmax(0,1fr)); }
}
@media (max-width:600px) {
    .wallet-method-grid-five { grid-template-columns:repeat(2,minmax(0,1fr)); }
    .wallet-payment-success { width:min(100%,360px); }
    .wallet-custom-field-inline { grid-template-columns:minmax(0,1fr) minmax(150px,44%); gap:10px; }
    .wallet-custom-field-inline > span:first-child { font-size:.9rem; }
}
@media (max-width:390px) {
    .wallet-custom-field-inline { grid-template-columns:minmax(0,1fr) minmax(132px,43%); gap:8px; }
    .wallet-custom-field-inline > span:first-child { font-size:.82rem; }
}
/* VIPENVPN Wallet - payment success line separation */
#wallet-payment-success-title { display:block; }
#wallet-payment-success-text { display:block; white-space:normal; }
/* VIPENVPN Payment - gateway selector and responsive gateway action area */
.payment-page .payment-gateway-panel-section { display:block; width:100%; max-width:none; margin:20px 0 0; clear:both; }
.payment-page .payment-gateway-panel-section > [hidden] { display:none !important; }
.payment-page .payment-gateway-panel-section > :not([hidden]) { width:100%; box-sizing:border-box; }
.payment-page .payment-method-heading { display:flex; align-items:center; gap:11px; margin:0 0 18px; }
.payment-page .payment-method-heading h2 { margin:0; color:var(--ink); letter-spacing:-.025em; }
.payment-page .payment-gateway-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
.payment-page .payment-gateway { position:relative; display:flex; align-items:center; gap:8px; min-height:70px; padding:12px 7px 12px 10px; border:1px solid #e3e8ef; border-radius:15px; background:#fff; color:#182230; text-align:start; font:inherit; cursor:pointer; transition:border-color .18s ease,box-shadow .18s ease,transform .18s ease,background .18s ease; }
.payment-page .payment-gateway:hover:not(:disabled) { transform:translateY(-2px); border-color:#b9c9e2; box-shadow:0 8px 20px rgba(16,24,40,.06); }
.payment-page .payment-gateway.is-selected { border-color:#2867c4; box-shadow:0 0 0 2px rgba(40,103,196,.08); background:#f8fbff; }
.payment-page .payment-gateway.is-disabled { cursor:not-allowed; opacity:.62; }
.payment-page .payment-gateway-mark { display:grid; place-items:center; width:39px; height:39px; flex:0 0 39px; border-radius:11px; background:#f2f4f7; color:#344054; font-size:18px; font-weight:800; }
.payment-page .payment-gateway-mark svg { width:26px; height:26px; display:block; }
.payment-page .payment-gateway-wallet { color:#2464b8; background:#f1f6ff; }
.payment-page .payment-gateway-stripe { color:#635bff; background:#f1efff; }
.payment-page .payment-gateway-paypal { color:#0070ba; background:#eef8ff; }
.payment-page .payment-gateway-crypto { color:#f7931a; background:#fff5e8; }
.payment-page .payment-gateway-google { background:#eff6ff; }
.payment-page .payment-gateway-apple { color:#111; background:#f1f1f1; }
.payment-page .payment-gateway-copy { display:flex; min-width:0; flex:1; flex-direction:column; gap:3px; }
.payment-page .payment-gateway-copy strong { font-size:13px; line-height:1.25; }
.payment-page .payment-gateway-copy small { color:#98a2b3; font-size:10px; line-height:1.35; }
.payment-page .payment-gateway-check { position:absolute; inset-inline-end:7px; top:7px; opacity:0; display:grid; place-items:center; width:20px; height:20px; border-radius:50%; background:#2867c4; color:#fff; font-size:11px; }
.payment-page .payment-gateway.is-selected .payment-gateway-check { opacity:1; }
.payment-page .payment-gateway.is-selected .payment-gateway-copy { padding-inline-end:18px; }
.payment-page .payment-wallet-confirmation { display:flex; align-items:flex-start; gap:13px; margin-top:0; padding:18px; border:1px solid rgba(34,197,94,.28); border-radius:18px; background:linear-gradient(180deg,#f5fff8 0%,#effbf3 100%); box-shadow:0 10px 26px rgba(34,197,94,.08); outline:none; }
.payment-page .payment-wallet-confirmation[hidden], .payment-page .payment-gateway-placeholder[hidden] { display:none; }
.payment-page .payment-wallet-confirmation-icon { display:grid; place-items:center; width:34px; height:34px; flex:0 0 34px; border-radius:50%; background:#22c55e; color:#fff; font-size:17px; font-weight:900; }
.payment-page .payment-wallet-confirmation-copy { min-width:0; flex:1; }
.payment-page .payment-wallet-confirmation-copy > strong { display:block; color:#166534; font-size:15px; line-height:1.3; }
.payment-page .payment-wallet-confirmation-copy > p { margin:5px 0 12px; color:#52705d; font-size:12px; line-height:1.6; }
.payment-page .payment-wallet-confirmation-meta { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; margin-bottom:13px; }
.payment-page .payment-wallet-confirmation-meta span { display:flex; justify-content:space-between; gap:8px; padding:9px 10px; border:1px solid rgba(34,197,94,.17); border-radius:11px; background:rgba(255,255,255,.72); color:#52705d; font-size:10px; }
.payment-page .payment-wallet-confirmation-meta b { color:#166534; white-space:nowrap; }
.payment-page .payment-wallet-form { margin:0; }
.payment-page .payment-wallet-confirm-button { display:flex; align-items:center; justify-content:center; width:100%; min-height:48px; padding:12px 16px; border:0; border-radius:13px; background:linear-gradient(135deg,#16a34a,#22c55e); color:#fff; font:inherit; font-size:13px; font-weight:800; line-height:1.2; cursor:pointer; box-shadow:0 9px 20px rgba(22,163,74,.20); transition:filter .15s ease,transform .15s ease,box-shadow .15s ease; }
.payment-page .payment-wallet-confirm-button:hover { filter:brightness(1.04); transform:translateY(-1px); box-shadow:0 11px 24px rgba(22,163,74,.25); }
.payment-page .payment-wallet-confirm-button:focus-visible, .payment-page .payment-gateway:focus-visible { outline:3px solid rgba(37,99,235,.22); outline-offset:2px; }
.payment-page .payment-wallet-insufficient { padding:11px 12px; border:1px solid #f2c8d4; border-radius:12px; background:#fff7fa; color:#a22a4a; font-size:12px; font-weight:700; text-align:center; }
.payment-page .payment-gateway-placeholder { margin-top:0; padding:20px; border:1px solid #f0c94b; border-radius:18px; background:#fffaf0; text-align:center; }
.payment-page .payment-gateway-placeholder strong { display:block; color:#172033; font-size:17px; }
.payment-page .payment-gateway-placeholder p { margin:7px 0 0; color:#6b7280; font-size:12px; line-height:1.6; }
@media(max-width:650px) {
    .payment-page .payment-gateway-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:9px; }
    .payment-page .payment-gateway { min-height:66px; padding:10px 6px 10px 8px; gap:7px; }
    .payment-page .payment-gateway-mark { width:37px; height:37px; flex-basis:37px; }
    .payment-page .payment-wallet-confirmation { padding:16px; }
    .payment-page .payment-wallet-confirmation-meta { grid-template-columns:1fr; }
}
@media(max-width:390px) {
    .payment-page .payment-gateway-copy strong { font-size:12px; }
    .payment-page .payment-gateway-copy small { font-size:9px; }
    .payment-page .payment-gateway-mark { width:34px; height:34px; flex-basis:34px; }
    .payment-page .payment-gateway-mark svg { width:23px; height:23px; }
}
[dir="rtl"] .payment-page .payment-gateway { text-align:right; }
/* Payment review refinements */
.payment-page .payment-review-card .payment-card-body { gap: 0; }
.payment-page .payment-review-card .payment-location-spec { margin: 0 0 12px; border-color: #b9cdea; background: linear-gradient(135deg, #f1f7ff 0%, #eef3ff 55%, #f8f3ff 100%); box-shadow: 0 8px 22px rgba(37, 99, 235, .08); }
.payment-page .payment-review-card .payment-location-spec span { color: #2458a6; }
.payment-page .payment-review-card .payment-location-spec strong { color: #173f7a; font-size: 15px; }
.payment-page .payment-review-card .payment-plan-name-spec { background: linear-gradient(180deg, #fff 0%, #fbfaff 100%); }
.payment-page .payment-review-card .payment-total { margin-top: 22px; padding-top: 22px; }
.payment-page .payment-review-card #payment-discount-feedback { margin-top:12px; }
/* PayPal service checkout panel */
.payment-page .payment-paypal-panel { display:block; width:100%; box-sizing:border-box; margin-top:0; padding:20px; border:1px solid #d9c8f4; border-radius:18px; background:linear-gradient(180deg,#fbf9ff 0%,#f7fbff 100%); box-shadow:0 10px 26px rgba(76,48,148,.07); }
.payment-page .payment-paypal-panel[hidden] { display:none !important; }
.payment-page .payment-paypal-copy strong { display:block; color:#172033; font-size:17px; }
.payment-page .payment-paypal-copy p { margin:6px 0 14px; color:#6b7280; font-size:12px; line-height:1.6; }
.payment-page .payment-paypal-amount { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:14px; padding:11px 13px; border:1px solid #e6eaf0; border-radius:12px; background:#fff; color:#667085; font-size:12px; }
.payment-page .payment-paypal-amount b { color:#4c20a8; font-size:16px; }
.payment-page .payment-paypal-buttons-wrap { width:min(100%,420px); margin:0 auto; }
.payment-page .payment-paypal-status { min-height:20px; margin:10px 0 0; color:#667085; font-size:12px; line-height:1.5; text-align:center; }
.payment-page .payment-paypal-status.is-processing { opacity:.72; }
@media(max-width:650px) {
    .payment-page .payment-paypal-panel { padding:16px; }
    .payment-page .payment-paypal-buttons-wrap { width:100%; }
}
/* ================================================================
   VIPENVPN Services - premium service management UI
   ================================================================ */
.services-page { background: radial-gradient(circle at 8% 4%, rgba(110,73,184,.08), transparent 28%), linear-gradient(180deg,#fbfaff 0%,#f7f7fb 48%,#fff 100%); }
.services-shell { width:min(1240px,calc(100% - 48px)); margin:0 auto; padding:20px 0 90px; }
.services-hero { position:relative; isolation:isolate; overflow:hidden; display:grid; grid-template-columns:minmax(0,1fr) 240px; align-items:center; gap:36px; padding:54px 56px; border-radius:34px; color:#fff; background:linear-gradient(135deg,#160d38 0%,#35206b 44%,#7046a9 100%); box-shadow:0 30px 78px rgba(54,29,102,.24); }
.services-hero:before { content:""; position:absolute; inset:0; z-index:-3; background: radial-gradient(circle at 78% 12%,rgba(255,255,255,.18),transparent 22%), radial-gradient(circle at 12% 115%,rgba(198,160,255,.17),transparent 35%), linear-gradient(120deg,transparent 0 54%,rgba(255,255,255,.055) 54.2%,transparent 54.7%); }
.services-hero-grid { position:absolute; inset:-25% -5% -25% 42%; z-index:-2; opacity:.16; background-image: linear-gradient(105deg,transparent 0 48%,rgba(255,255,255,.7) 49%,transparent 50%), linear-gradient(35deg,transparent 0 48%,rgba(255,255,255,.5) 49%,transparent 50%), linear-gradient(90deg,rgba(255,255,255,.25) 1px,transparent 1px), linear-gradient(rgba(255,255,255,.25) 1px,transparent 1px); background-size:190px 190px,240px 240px,46px 46px,46px 46px; transform:perspective(600px) rotateY(-16deg) rotateZ(-4deg); pointer-events:none; }
.services-hero-glow { position:absolute; border-radius:50%; pointer-events:none; filter:blur(4px); }
.services-hero-glow-one { width:210px;height:210px;right:100px;top:-105px;background:rgba(255,255,255,.08); }
.services-hero-glow-two { width:310px;height:310px;right:-130px;bottom:-210px;background:rgba(168,112,255,.18); }
.services-hero-copy { position:relative; z-index:2; max-width:750px; }
.services-hero-eyebrow { display:none; }
.services-hero h1 { margin:0 0 16px; font-size:clamp(36px,6vw,72px); line-height:.98; letter-spacing:-.06em; }
.services-hero p { max-width:650px;margin:0;color:rgba(255,255,255,.77);font-size:16px;line-height:1.75; }
.services-hero-stat { position:relative; z-index:2; display:grid; place-items:center; gap:5px; text-align:center; padding:23px 24px; border:1px solid rgba(255,255,255,.2); border-radius:24px; background:rgba(255,255,255,.09); backdrop-filter:blur(18px); box-shadow:inset 0 1px 0 rgba(255,255,255,.09); }
.services-hero-stat span { color:rgba(255,255,255,.68);font-size:10px;font-weight:750;letter-spacing:.1em;text-transform:uppercase; }
.services-hero-stat strong { font-size:52px;line-height:1;letter-spacing:-.05em; }
.services-hero-stat small { color:rgba(255,255,255,.66);font-size:11px; }
.services-alert { margin:18px 0 0;padding:14px 17px;border-radius:15px;border:1px solid #e5e1eb;font-size:13px;line-height:1.55;background:#fff; }
.services-alert-error { border-color:#f1c4c4;background:#fff7f7;color:#b42318; }
.services-alert-success { border-color:#b8dfc4;background:#f5fcf7;color:#176b2d; }
.services-list-section { margin-top:28px;padding:17px;border:1px solid #e8e3ee;border-radius:21px;background:linear-gradient(145deg,#fff,#fbf9ff);box-shadow:0 8px 24px rgba(42,28,62,.035); }
.services-section-head { display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:16px; }
.services-section-head h2 { margin:0;font-size:30px;line-height:1.05;letter-spacing:-.045em; }
.services-count { padding:8px 12px;border:1px solid #e3dfe9;border-radius:999px;background:#fff;color:#746f80;font-size:11px;font-weight:700; }
.services-list { display:grid; grid-template-columns:repeat(auto-fit,minmax(390px,1fr)); gap:10px; }
.service-row { min-width:0; position:relative; display:grid; grid-template-columns:auto minmax(88px,1.05fr) minmax(52px,.58fr) minmax(110px,1.45fr) auto; align-items:center; gap:8px; min-height:72px; padding:10px 12px; border:1px solid #e5e1eb;border-radius:17px;background:rgba(255,255,255,.94);color:#201a2d; text-decoration:none;box-shadow:0 8px 24px rgba(42,28,62,.035); transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease,background .18s ease; }
.service-row:hover { transform:translateY(-2px);border-color:#c8b8dc;box-shadow:0 14px 32px rgba(58,34,91,.09); }
.service-row.is-selected { border-color:#8d70b6;background:linear-gradient(105deg,#fff 0%,#fcfaff 100%);box-shadow:0 12px 34px rgba(77,48,117,.11),0 0 0 2px rgba(112,77,164,.07); }
.service-row-icon { display:grid;place-items:center;width:36px;height:36px;border-radius:11px;background:linear-gradient(145deg,#4c2b80,#8058ae);box-shadow:0 7px 16px rgba(76,43,128,.18); }
.service-row-icon span { width:13px;height:13px;border:2px solid rgba(255,255,255,.9);border-radius:50%;box-shadow:0 0 0 4px rgba(255,255,255,.08); }
.service-row-location { min-width:0;display:flex;align-items:center;gap:7px; }
.service-row-location strong { min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:12px;letter-spacing:-.01em; }
.service-row-flag { flex:none;font-size:15px;line-height:1; }
.service-row-plan { min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#4e475a;font-size:11px;font-weight:650; }
.service-row-usage { align-self:stretch;display:flex;flex-direction:column;justify-content:center;gap:4px;min-width:0; }
.service-row-usage>span { overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#6e687a;font-size:10px;font-weight:650; }
.service-row-usage i { display:block;height:5px;overflow:hidden;border-radius:999px;background:#ece8f1; }
.service-row-usage i b { display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#5b3b91,#9a73c5); }
.service-row-status,.service-detail-status { display:inline-flex;align-items:center;justify-content:center;min-width:58px;padding:6px 8px;border-radius:999px;border:1px solid #e1dde7;background:#fff;color:#696274;font-size:9px;font-weight:750;white-space:nowrap; }
.service-row-status { align-self:center; }
.service-status-active { border-color:#b8dfc4;background:#f3fbf5;color:#207238; }
.service-status-expired { border-color:#ead6ae;background:#fffaf0;color:#8a6116; }
.service-status-refunded { border-color:#d8d0e4;background:#f8f6fb;color:#695a7e; }
.service-status-deleted { border-color:#edc7c7;background:#fff7f7;color:#a33b3b; }
.service-detail { scroll-margin-top:28px;margin-top:28px;padding:30px;border:1px solid #e2ddea;border-radius:30px;background:rgba(255,255,255,.94);box-shadow:0 22px 60px rgba(42,28,62,.08); }
.service-detail-head { display:flex;align-items:flex-start;justify-content:space-between;gap:16px;padding-bottom:24px;border-bottom:1px solid #ebe7f0; }
.service-detail-head > div { min-width:0; }
.service-detail-head p { margin:0;color:#7b7586;font-size:12px; }
.service-detail-location { display:flex;align-items:center;gap:8px;font-weight:700; }
.service-detail-flag { font-size:18px;line-height:1; }
.service-detail-status { flex:0 0 auto;margin-top:0;align-self:flex-start; }
.service-metrics { display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:18px 0; }
.service-metrics>div { display:flex;align-items:center;justify-content:space-between;gap:10px;min-width:0;min-height:26px;padding:4px 10px;border:1px solid #e9e5ee;border-radius:12px;background:#fbfaff; }
.service-metrics span { color:#7d7788;font-size:9px;font-weight:700;text-transform:uppercase;letter-spacing:.06em; }
.service-metrics strong { color:#25202f;font-size:11px;letter-spacing:-.02em;text-align:right;white-space:nowrap; }
.service-detail-grid { display:grid;grid-template-columns:1fr 1fr;gap:14px; }
.service-panel { min-width:0;padding:22px;border:1px solid #e8e3ee;border-radius:21px;background:#fff; }
.service-panel-primary { background:linear-gradient(145deg,#fff,#fbf9ff); }
.service-panel-head h3 { margin:7px 0 0;font-size:20px;letter-spacing:-.025em; }
.service-fields-form { display:grid;gap:13px;margin-top:18px; }
.service-edit-field { position:relative;display:block; }
.service-edit-field>span { position:absolute;z-index:1;left:1px;top:1px;bottom:1px;width:42%;display:flex;align-items:center;padding:0 12px;box-sizing:border-box;border-right:1px solid #e3dee9;border-radius:12px 0 0 12px;background:#f7f5f9;color:#514a5c;font-size:12px;font-weight:750;pointer-events:none;white-space:nowrap; }
.service-edit-field input { width:100%;min-height:46px;padding:11px 13px 11px 46%;box-sizing:border-box;border:1px solid #ded8e7;border-radius:13px;outline:none;background:#fff;color:#211c2b;font:inherit;font-size:13px;transition:border-color .16s ease,box-shadow .16s ease; }
.service-edit-field input::placeholder { color:#a49dab;opacity:1; }
.service-edit-field input:focus { border-color:#8a6bb0;box-shadow:0 0 0 3px rgba(111,77,153,.11); }
.services-button { min-height:43px;border-radius:13px;padding:10px 17px; }
.service-spec-list { display:grid;margin:18px 0 0; }
.service-spec-list>div { display:flex;justify-content:space-between;align-items:baseline;gap:18px;padding:10px 0;border-top:1px solid #eeeaf2; }
.service-spec-list dt { color:#7c7685;font-size:11px; }
.service-spec-list dd { margin:0;color:#25202f;font-size:12px;font-weight:700;text-align:right; }
.service-spec-location { display:inline-flex;align-items:center;gap:7px; }
.service-spec-flag { font-size:16px;line-height:1; }
.service-actions { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:14px; }
.service-action-card { min-width:0;min-height:75px;display:flex;align-items:center;gap:11px;padding:16px;border:1px solid #e5e0eb;border-radius:18px;background:#fff;color:#241e2d;text-align:left;cursor:pointer;font:inherit;text-decoration:none;box-shadow:0 7px 20px rgba(42,28,62,.035);transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease; }
.service-action-copy { min-width:0;display:flex;flex-direction:column;justify-content:center;gap:4px; }
.service-panel-helper { margin:6px 0 0;color:#8a8491;font-size:10px;line-height:1.5; }
.service-configurations { padding:0;border:0;border-radius:0;background:transparent;box-shadow:none; }
.service-action-card:hover { transform:translateY(-2px);border-color:#c7b6da;box-shadow:0 13px 28px rgba(55,34,83,.08); }
.service-action-card strong { font-size:12px;line-height:1.35; }
.service-action-card small { color:#817b89;font-size:10px;line-height:1.5; }
.service-action-icon { flex:0 0 34px;display:grid;place-items:center;width:34px;height:34px;margin-bottom:0;border-radius:11px;background:#f2edf8;color:#63438e; }
.service-action-icon svg { width:19px;height:19px;display:block; }
.service-action-danger { border-color:#ead9d9; }
.service-action-danger .service-action-icon { background:#fff1f1;color:#b23d3d; }
.services-danger-button { background:linear-gradient(135deg,#c94d58 0%,#a93240 100%); }
.services-danger-button:hover { background:linear-gradient(135deg,#b9404c 0%,#922b38 100%); }
.services-empty { max-width:680px;margin:55px auto 0;padding:52px 30px;text-align:center;border:1px dashed #cfc4dc;border-radius:28px;background:rgba(255,255,255,.75); }
.services-empty-icon { font-size:42px;color:#8061a9; }
.services-empty h2 { margin:8px 0 8px;font-size:30px;letter-spacing:-.04em; }
.services-empty p { max-width:520px;margin:0 auto 24px;color:#7a7482;font-size:13px;line-height:1.75; }
.service-action-sections { display:grid;gap:14px;margin-top:16px; }
.service-action-section { scroll-margin-top:28px;min-width:0;padding:20px;border:1px solid #e8e3ee;border-radius:21px;background:linear-gradient(145deg,#fff,#fbf9ff); }
.service-action-section[hidden] { display:none; }
.service-action-section.is-open { display:block;animation:services-section-in .28s ease both; }
@keyframes services-section-in {
    from { opacity:0;transform:translateY(10px) }
    to { opacity:1;transform:translateY(0) }
}
.service-action-section-refund { border-color:#ead9d9;background:linear-gradient(145deg,#fff,#fffafa); }
.service-action-section-head { display:flex;align-items:flex-start;justify-content:space-between;gap:18px;margin-bottom:12px; }
.service-action-section-head h3 { margin:7px 0 7px;font-size:24px;line-height:1.1;letter-spacing:-.03em; }
.service-action-section-head p { max-width:720px;margin:0;color:#756f7f;font-size:12px;line-height:1.7; }
.service-config-grid { display:grid;grid-template-columns:1fr 1fr;gap:12px; }
.service-config-card { min-width:0;padding:17px;border:1px solid #e8e3ee;border-radius:18px;background:#fff; }
.service-config-card-head h4 { margin:7px 0 5px;font-size:17px;letter-spacing:-.02em;display:none; }
.service-config-card-head p { margin:0 0 12px;color:#756f7f;font-size:11px;line-height:1.6; }
.service-action-section-actions { display:flex;align-items:center;gap:9px;flex-wrap:wrap;margin-top:10px; }
.services-config-box { display:block;width:100%;min-height:122px;resize:vertical;box-sizing:border-box;padding:12px;border:1px solid #e3dfe9;border-radius:13px;background:#f9f8fb;color:#28222f;font:11px/1.55 ui-monospace,SFMono-Regular,Menlo,monospace;outline:none; }
.service-config-card .services-config-box { height:122px;overflow:auto; }
.services-copy-field { position:relative;width:100%; }
.services-copy-field .services-config-box { padding-right:45px;overflow:auto; }
.services-copy-icon { position:absolute;z-index:2;top:9px;right:9px;display:grid;place-items:center;width:29px;height:29px;padding:0;border:1px solid #e0d8ea;border-radius:9px;background:rgba(255,255,255,.94);color:#68468f;box-shadow:0 4px 12px rgba(52,34,72,.08);cursor:pointer;transition:transform .16s ease,background .16s ease,border-color .16s ease,color .16s ease; }
.services-copy-icon:hover { transform:translateY(-1px);background:#f8f4fc;border-color:#cdb9df;color:#553676; }
.services-copy-icon:focus-visible { outline:2px solid rgba(104,70,143,.25);outline-offset:2px; }
.services-copy-icon svg { width:16px;height:16px;display:block; }
.services-copy-icon.is-copied { background:#eef8f1;border-color:#b9d8c2;color:#36764b; }
.services-link-field { max-width:100%; }
.services-link-field .services-copy-icon { top:7px;right:10px; }
.services-link-row { display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:stretch;gap:10px; }
.services-link-box { min-height:44px;height:44px;resize:none;padding:10px 45px 10px 12px;line-height:22px;overflow:hidden;background:linear-gradient(135deg,#f5f0fb 0%,#f3f7ff 100%);border-color:#ddd2ea;color:#30253d; }
.services-link-row .services-button { min-width:110px;align-self:stretch; }
.services-qr-wrap { margin:13px 0 0;display:flex;justify-content:center; }
.services-qr-wrap img,.services-qr-static img { max-width:100%;border:1px solid #e8e3ed;border-radius:15px;padding:10px;background:#fff; }
.services-qr-static { display:flex;justify-content:center;margin:16px 0 2px; }
.services-inline-note { padding:13px 14px;border:1px dashed #d8d0e1;border-radius:13px;background:#faf8fc;color:#746d80;font-size:11px;line-height:1.6; }
.refund-review-grid { display:grid;grid-template-columns:1fr 1fr;gap:12px; }
.refund-review-grid section { min-width:0;padding:17px;border:1px solid #e8e3ee;border-radius:18px;background:#fbfaff; }
.refund-review-grid h4 { margin:0 0 11px;font-size:13px;letter-spacing:-.01em; }
.refund-review-grid dl { margin:0;display:grid; }
.refund-review-grid dl>div { display:flex;justify-content:space-between;gap:15px;padding:7px 0;border-top:1px solid #eeeaf2; }
.refund-review-grid dt { color:#817a89;font-size:10px; }
.refund-review-grid dd { margin:0;color:#2b2533;font-size:11px;font-weight:700;text-align:right; }
.refund-flag { font-size:15px; }
.refund-eligible-row { display:flex;align-items:center;justify-content:space-between;gap:15px;margin-top:11px;padding:7px 12px;border:1px solid #cdbbe0;border-radius:13px;background:#f8f4fd; }
.refund-eligible-row span { color:#6d627d;font-size:10px;font-weight:700; }
.refund-eligible-row strong { color:#3d2758;font-size:17px; }
.services-refund-warning { margin-top:12px;padding:13px 15px;border-radius:14px;border:1px solid #edd4d4;background:#fff7f7;color:#873838;font-size:11px;line-height:1.65; }
.services-confirm-form { width:100%;display:flex;justify-content:center;gap:9px;flex-wrap:wrap;margin-top:16px; }
.services-confirm-form .services-danger-button { width:100%;background:linear-gradient(135deg,#c94d58 0%,#a93240 100%);box-shadow:0 8px 18px rgba(169,50,64,.16); }
.services-confirm-form .services-danger-button:hover { background:linear-gradient(135deg,#b9404c 0%,#922b38 100%); }
[dir=rtl] .services-hero,[dir=rtl] .services-section-head,[dir=rtl] .service-detail-head { text-align:right; }
[dir=rtl] .service-row { direction:rtl; }
[dir=rtl] .service-spec-list dd,[dir=rtl] .refund-review-grid dd { text-align:left; }
[dir=rtl] .service-action-card { text-align:right; }
[dir="rtl"] .service-edit-field>span { left:auto;right:1px;border-right:0;border-left:1px solid #e3dee9;border-radius:0 12px 12px 0; }
[dir="rtl"] .service-edit-field input { padding-left:13px;padding-right:46%; }
[dir="rtl"] .services-copy-icon { right:auto;left:9px; }
[dir="rtl"] .services-copy-field .services-config-box { padding-right:12px;padding-left:45px; }
[dir="rtl"] .services-link-box { padding-right:12px;padding-left:45px; }
@media(max-width:1050px) {
    .services-hero { grid-template-columns:1fr 190px;padding:44px }
    .services-list { grid-template-columns:repeat(auto-fit,minmax(360px,1fr)) }
}
@media(max-width:850px) {
    .services-shell { width:min(100% - 36px,1240px);padding-top:10px }
    .services-hero { grid-template-columns:1fr;gap:24px;min-height:0;padding:38px 32px;border-radius:27px }
    .services-hero-stat { width:220px;max-width:100%;justify-self:center }
    .services-list { grid-template-columns:1fr }
    .service-detail-grid { grid-template-columns:1fr }
    .service-row { grid-template-columns:auto minmax(82px,1fr) minmax(64px,.75fr) minmax(75px,1fr) auto;gap:8px }
    .service-row-status { min-width:52px;padding:6px 7px }
}
@media(max-width:600px) {
    .services-shell { width:calc(100% - 28px);padding-bottom:55px }
    .services-hero { padding:31px 23px;border-radius:23px }
    .services-hero h1 { font-size:32px }
    .services-hero p { font-size:14px }
    .services-section-head { align-items:center;display:flex;gap:10px }
    .services-count { display:inline-flex;margin-top:0;flex:0 0 auto }
    .service-row { grid-template-columns:auto minmax(72px,1fr) minmax(58px,.68fr) minmax(64px,1fr) auto;gap:6px;min-height:66px;padding:9px 10px;border-radius:15px }
    .service-row-icon { width:34px;height:34px;border-radius:10px }
    .service-row-location { gap:5px }
    .service-row-location strong { font-size:10px }
    .service-row-flag { font-size:13px }
    .service-row-plan { font-size:9px }
    .service-row-usage>span { font-size:9px }
    .service-row-status { min-width:0;padding:5px 6px;font-size:8px }
    .service-detail { padding:20px 15px;border-radius:22px }
    .service-detail-head { display:flex;align-items:flex-start;justify-content:space-between;gap:10px }
    .service-detail-status { flex:0 0 auto;margin-top:0 }
    .service-metrics { gap:6px }
    .service-metrics>div { min-height:26px;padding:4px 6px;gap:5px }
    .service-metrics span { font-size:7px }
    .service-metrics strong { font-size:10px }
    .service-panel { padding:17px }
    .service-actions { grid-template-columns:repeat(3,minmax(0,1fr));gap:7px }
    .service-action-card { min-height:75px;padding:8px;border-radius:15px;gap:4px }
    .service-action-card strong { font-size:10px }
    .service-action-card small { font-size:8px;line-height:1.4 }
    .service-action-icon { width:27px;height:27px;border-radius:9px }
    .service-action-icon svg { width:16px;height:16px }
    .service-action-section { padding:18px 15px;border-radius:18px }
    .service-action-section-head { display:block;margin-bottom:12px }
    .service-action-section-head h3 { font-size:22px }
    .service-config-grid { grid-template-columns:1fr }
    .services-link-row { display:block }
    .services-link-box { height:44px;min-height:44px;padding:10px 45px 10px 10px;line-height:22px }
    .refund-review-grid { grid-template-columns:1fr }
}
@media(max-width:420px) {
    .services-hero h1 { font-size:28px }
    .service-row-location strong { font-size:9px }
    .service-row-plan { font-size:8px }
    .service-row-status { font-size:7px;padding-inline:5px }
    .service-action-card { padding:7px }
    .service-action-card strong { font-size:9px }
    .service-action-card small { font-size:8px }
    .service-metrics span { font-size:6.5px }
    .service-metrics strong { font-size:9px }
}
/* VIPENVPN - transactions page */
.transactions-page { width:min(1180px, calc(100% - 36px)); margin:0 auto; padding:0 0 80px; }
.transactions-hero { position:relative; min-height:300px; display:grid; grid-template-columns:minmax(0,1.15fr) minmax(280px,.85fr); gap:36px; align-items:center; padding:46px 48px; border:1px solid rgba(43,76,130,.12); border-radius:32px; overflow:hidden; background: radial-gradient(circle at 84% 18%,rgba(79,70,229,.28),transparent 32%), radial-gradient(circle at 8% 92%,rgba(14,165,233,.18),transparent 34%), linear-gradient(135deg,#f5f9ff 0%,#f1f4ff 48%,#ffffff 100%); box-shadow:0 26px 76px rgba(30,64,175,.12); }
.transactions-hero::before, .transactions-hero::after { content:""; position:absolute; border-radius:999px; filter:blur(2px); pointer-events:none; }
.transactions-hero::before { width:220px;height:220px;right:-70px;top:-92px; background:rgba(79,70,229,.16); }
.transactions-hero::after { width:150px;height:150px;left:-52px;bottom:-68px; background:rgba(14,165,233,.11); }
.transactions-hero-copy { position:relative;z-index:1; }
.transactions-hero-copy h1 { margin:8px 0 14px; font-size:clamp(34px,5vw,56px); line-height:1.02; letter-spacing:-.045em; }
.transactions-hero-copy p:not(.eyebrow) { max-width:680px; margin:0; color:var(--muted); font-size:16px; line-height:1.8; }
.transactions-hero-visual { position:relative; min-height:210px; display:grid; place-items:center; z-index:1; }
.transactions-orbit { width:208px;height:208px; border-radius:50%; border:1px solid rgba(79,70,229,.20); background: radial-gradient(circle at 35% 30%,#ffffff 0%,#f7f8ff 44%,rgba(224,231,255,.66) 70%,rgba(255,255,255,.08) 74%), linear-gradient(145deg,rgba(99,102,241,.18),rgba(14,165,233,.10)); box-shadow:0 30px 70px rgba(49,46,129,.16),inset 0 0 0 10px rgba(255,255,255,.48),inset 0 0 0 1px rgba(255,255,255,.82); display:grid; place-items:center; }
.transactions-orbit::before { content:""; position:absolute; border-radius:50%; pointer-events:none; width:236px;height:236px; border:1px dashed rgba(79,70,229,.18); }
.transactions-orbit-content { position:relative; z-index:1; width:100%; padding:18px; text-align:center; }
.transactions-orbit-content .eyebrow { display:block; margin:0 0 7px; color:#5963b8; font-size:10px; letter-spacing:.12em; }
.transactions-orbit-content strong { display:block; font-size:46px; line-height:1; letter-spacing:-.06em; color:#25245a; }
.transactions-orbit-content small { display:block; margin-top:8px; color:#667085; font-size:11px; font-weight:700; letter-spacing:.08em; }
.transactions-section { margin-top:25px; }
.transactions-overview-head { padding:10px 18px; border-radius:16px; background:linear-gradient(90deg, #000000 0%, #5092f1 50%, #f8fbff 100%); box-shadow:0 8px 22px rgba(59,130,246,.06); }
.transactions-overview-head .eyebrow { color:white; }
.transactions-section-heading { display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:14px; }
.transactions-section-heading h2 { margin:0;font-size:24px;letter-spacing:-.025em; }
.transactions-section-heading p { margin:0;color:var(--muted);font-size:13px; }
.transactions-list { overflow:hidden; border:1px solid var(--line); border-radius:20px; background:#fff; box-shadow:0 14px 36px rgba(16,24,40,.055); }
.transaction-row { width:100%; position:relative; display:grid; grid-template-columns:1.5fr .75fr .75fr .75fr 1.5fr 1.5fr; align-items:center; column-gap:0; row-gap:0; padding:16px 20px; border:0; border-bottom:1px solid #eef1f5; background:#fff; color:inherit; text-align:inherit; font:inherit; cursor:pointer; transition:background .18s ease,transform .18s ease,box-shadow .18s ease; }
.transaction-row:last-child { border-bottom:0; }
.transaction-row:hover, .transaction-row:focus-visible { background:#fafbff;outline:none; }
.transaction-row.is-selected { background:linear-gradient(90deg,#f7f9ff,#fff); box-shadow:inset 3px 0 0 #6257c9; }
[dir="rtl"] .transaction-row.is-selected { box-shadow:inset -3px 0 0 #6257c9; }
.transaction-main { min-width:0;display:flex;align-items:center;gap:12px;text-align:left; }
.transaction-icon { width:40px;height:40px;flex:0 0 40px;display:grid;place-items:center;border-radius:13px; color:#5b4bb7;background:linear-gradient(145deg,#eef1ff,#f7efff); }
.transaction-icon svg { width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round; }
.transaction-icon-wallet { color:#2563eb;background:linear-gradient(145deg,#eaf2ff,#eef7ff); }
.transaction-icon-service { color:#7c3aed;background:linear-gradient(145deg,#f1eaff,#f8f0ff); }
.transaction-icon-payment { color:#0f766e;background:linear-gradient(145deg,#e8fbf7,#effcfb); }
.transaction-icon-telegram { color:#1684d8;background:linear-gradient(145deg,#e9f7ff,#eef3ff); }
.transaction-main-copy { min-width:0; }
.transaction-main-copy strong { display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:14px; }
.transaction-main-copy span,.transaction-main-created { display:block;margin-top:3px;color:var(--muted);font-size:11px; }
.transaction-cell { min-width:0;text-align:center; }
.transaction-date-cell { text-align:left; }
.transaction-status-cell { text-align:center; }
.transaction-status-cell .transaction-cell-label { text-align:center; }
.transaction-cell-label { display:block;margin-bottom:4px;color:#98a2b3;font-size:10px;text-transform:uppercase;letter-spacing:.07em; }
.transaction-cell-value { display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:13px;font-weight:650; }
.transaction-uppercase { text-transform:uppercase; }
.transaction-status { display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:6px 9px;border-radius:999px;font-size:11px;font-weight:700;white-space:nowrap; }
.transaction-status::before { content:"";width:6px;height:6px;flex:0 0 6px;border-radius:50%;background:currentColor; }
.transaction-status-success { color:#087443;background:#ecfdf3; }
.transaction-status-pending { color:#9a6700;background:#fff8e1; }
.transaction-status-failed { color:#b42318;background:#fff1f0; }
.transaction-status-neutral { color:#475467;background:#f2f4f7; }
.transaction-row-arrow { position:absolute;right:20px;top:50%;transform:translateY(-50%);color:#98a2b3;font-size:18px;transition:transform .18s ease; }
.transaction-row:hover .transaction-row-arrow { transform:translate(3px,-50%); }
[dir="rtl"] .transaction-row:hover .transaction-row-arrow { transform:translate(-3px,-50%); }
.transactions-empty { padding:42px 24px;text-align:center;color:var(--muted); }
.transactions-empty strong { display:block;margin-bottom:7px;color:var(--ink);font-size:15px; }
.transaction-detail-wrap { margin-top:22px; }
.transaction-detail { overflow:hidden; border:1px solid rgba(91,75,183,.12); border-radius:24px; background:linear-gradient(145deg,#fff,#fbfbff); box-shadow:0 22px 55px rgba(31,41,55,.08); opacity:0; transform:translateY(12px) scale(.992); max-height:0; pointer-events:none; transition:opacity .28s ease,transform .28s ease,max-height .36s ease; }
.transaction-detail.is-visible { opacity:1;transform:translateY(0) scale(1);max-height:900px;pointer-events:auto; }
.transaction-detail-head { display:flex;align-items:flex-start;justify-content:space-between;gap:18px;padding:24px 26px 18px;border-bottom:1px solid #eef1f5; }
.transaction-detail-head h3 { margin:0;font-size:21px;letter-spacing:-.02em; }
.transaction-detail-head p { margin:6px 0 0;color:var(--muted);font-size:12px; }
.transaction-detail-badge { flex:0 0 auto; }
.transaction-detail-grid { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;background:#eef1f5; }
.transaction-detail-item { padding:15px 18px;background:#fff;min-width:0; }
.transaction-detail-item span { display:block;color:#98a2b3;font-size:11px;margin-bottom:6px; }
.transaction-detail-item strong { display:block;overflow-wrap:anywhere;font-size:14px;line-height:1.55; }
.transaction-detail-note { padding:16px 22px;color:var(--muted);font-size:12px;line-height:1.7;background:#fbfcfe; }
.transaction-detail-note:empty { display:none; }
.transactions-pagination { display:flex; align-items:center; justify-content:center; gap:8px; margin:14px 0 0; }
.transactions-pagination-pages { display:flex; align-items:center; justify-content:center; gap:6px; flex-wrap:wrap; }
.transactions-pagination-page, .transactions-pagination-control { display:inline-flex; align-items:center; justify-content:center; min-width:34px; height:34px; padding:0 9px; border:1px solid #e2e6ec; border-radius:999px; background:#fff; color:#667085; font-size:11px; font-weight:750; line-height:1; text-decoration:none; box-shadow:0 4px 12px rgba(16,24,40,.04); transition:background .16s ease,border-color .16s ease,color .16s ease,transform .16s ease; }
.transactions-pagination-page:hover, .transactions-pagination-control:hover { border-color:#cfd6df; color:var(--ink); background:#f8fafc; transform:translateY(-1px); }
.transactions-pagination-page.is-current { border-color:#6257c9; background:#6257c9; color:#fff; box-shadow:0 6px 16px rgba(98,87,201,.18); }
.transactions-pagination-control { min-width:34px; padding:0; font-size:18px; }
@media(max-width:600px) {
    .transactions-pagination { gap:5px; margin-top:12px; }
    .transactions-pagination-pages { gap:4px; }
    .transactions-pagination-page, .transactions-pagination-control { min-width:31px;height:31px;padding:0 7px;font-size:10px; }
    .transactions-pagination-control { font-size:16px; }
}
.transactions-page .eyebrow { margin-bottom:0; }
.transactions-page .small-muted { color:var(--muted);font-size:12px; }
@media(min-width:851px) {
    .transaction-row { cursor:default; }
    .transaction-row:hover, .transaction-row:focus-visible { background:#fff; }
    .transaction-row:hover .transaction-row-arrow { transform:none; }
    .transaction-detail-wrap { display:none; }
}
@media(max-width:850px) {
    .transactions-hero { grid-template-columns:1fr;min-height:0;padding:34px 28px; }
    .transactions-hero-visual { display:none; }
    .transaction-row { grid-template-columns:1.7fr .70fr .75fr .70fr 1.5fr; column-gap:0; row-gap:0; padding:13px 14px; }
    .transaction-row .transaction-created-date-cell { display:none; }
    .transaction-row .transaction-row-arrow { position:absolute;right:8px;top:50%;transform:translateY(-50%);font-size:16px;display:block; }
    .transaction-row .transaction-completed-date-cell { display:block; }
    .transaction-row .transaction-cell-label { font-size:8px;letter-spacing:.045em;margin-bottom:3px; }
    .transaction-row .transaction-cell-value { font-size:11px; }
    .transaction-row .transaction-status { max-width:100%;padding:5px 6px;font-size:9px;gap:4px; }
    .transaction-row .transaction-status::before { width:5px;height:5px;flex-basis:5px; }
    .transaction-main { gap:8px; }
    .transaction-main-copy { display:block;min-width:0; }
    .transaction-main-copy strong { font-size:12px; }
    .transaction-main-copy span, .transaction-main-created { font-size:9px; }
    .transaction-detail-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
    .transaction-detail-item { display:flex; align-items:center; justify-content:space-between; gap:14px; padding:13px 16px; }
    .transaction-detail-item span { flex:0 0 auto;margin:0;font-size:10px; }
    .transaction-detail-item strong { min-width:0;text-align:end;font-size:12px;line-height:1.45; }
    [dir="rtl"] .transaction-detail-item strong { text-align:start; }
}
@media(max-width:600px) {
    .transactions-page { width:min(100% - 24px,1180px);padding:0 0 58px; }
    .transactions-hero { padding:28px 22px;border-radius:24px; }
    .transactions-hero-copy h1 { font-size:38px; }
    .transactions-section { margin-top:12px; }
    .transactions-overview-head { padding:8px 15px; border-radius:14px; }
    .transactions-section-heading { align-items:flex-start;flex-direction:column;gap:5px; }
    .transactions-list { border-radius:17px; }
    .transaction-row { grid-template-columns:1.7fr .70fr .75fr .70fr 1.5fr;column-gap:0;row-gap:0;padding:12px 10px; }
    .transaction-icon { width:32px;height:32px;flex-basis:32px;border-radius:10px; }
    .transaction-icon svg { width:17px;height:17px; }
    .transaction-row .transaction-cell-label { font-size:7.5px; }
    .transaction-row .transaction-cell-value { font-size:10px; }
    .transaction-row .transaction-status { font-size:8.5px;padding:4px 5px; }
    .transaction-row-arrow { position:absolute;right:12px;top:50%;transform:translateY(-50%);font-size:16px; }
    .transaction-detail-head { padding:18px 16px 14px; }
    .transaction-detail-head h3 { font-size:12px;letter-spacing:.08em; }
    .transaction-detail-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
    .transaction-detail-item { padding:12px 14px; }
    .transaction-detail-item strong { font-size:12px; }
}
@media(max-width:390px) {
    .transaction-row { grid-template-columns:1.7fr .70fr .75fr .70fr 1.5fr;padding-left:8px;padding-right:8px; }
    .transaction-row .transaction-cell-label { font-size:7px; }
    .transaction-row .transaction-cell-value { font-size:9.5px; }
    .transaction-row .transaction-status { font-size:8px;padding:4px 4px; }
}
/* =========================================================
   VIPENVPN Profile - Premium Account Center
   Additive styles. Existing site components remain untouched.
   ========================================================= */
.profile-page { width: min(1180px, calc(100% - 48px)); margin: 0 auto; padding: 18px 0 76px; color: var(--ink); }
.profile-hero { position: relative; overflow: hidden; display: grid; grid-template-columns: minmax(0, 1fr) minmax(340px, 460px); align-items: stretch; gap: 28px; min-height: 250px; padding: 34px; border: 1px solid rgba(20, 30, 48, .09); border-radius: 28px; background: radial-gradient(circle at 86% 16%, rgba(255, 224, 117, .24), transparent 30%), radial-gradient(circle at 8% 94%, rgba(233, 177, 55, .16), transparent 34%), linear-gradient(135deg, #141a2b 0%, #202941 52%, #343a4d 100%); box-shadow: 0 28px 76px rgba(17, 23, 38, .20); }
.profile-hero-copy { position: relative; z-index: 2; align-self: center; max-width: 650px; }
.profile-hero-copy .eyebrow { margin-bottom: 10px; }
.profile-hero-copy h1 { margin: 0; font-size: clamp(44px, 6vw, 72px); line-height: .98; }
.profile-hero-copy > p:last-child { max-width: 620px; margin: 18px 0 0; color: rgba(255,255,255,.72); font-size: 16px; line-height: 1.65; }
.profile-hero-copy .eyebrow { color: rgba(255, 229, 143, .86); }
.profile-hero-copy h1 { color: #fff; letter-spacing: -.055em; }
.profile-hero-art { position: absolute; z-index: 1; width: min(43%, 430px); height: 100%; right: 2%; top: var(--profile-hero-art-top, 0); display: grid; place-items: center; pointer-events: none; opacity: .98; }
.profile-hero-art svg { width: 100%; height: 100%; overflow: visible; }
.profile-hero-glow { position: absolute; border-radius: 999px; filter: blur(4px); pointer-events: none; }
.profile-hero-glow-one { width: 250px; height: 250px; right: -80px; top: -130px; background: rgba(101, 68, 171, .11); }
.profile-hero-glow-two { width: 190px; height: 190px; left: 38%; bottom: -140px; background: rgba(31, 115, 173, .08); }
.profile-connection-badge, .profile-status-line { display: inline-flex; align-items: center; gap: 7px; }
.profile-status-dot { width: 7px; height: 7px; flex: 0 0 7px; border-radius: 50%; background: currentColor; box-shadow: 0 0 0 4px rgba(22, 131, 74, .09); }
.profile-section { margin-top: 34px; }
.profile-section-heading { margin-bottom: 12px; }
.profile-section-heading .eyebrow { margin: 0; }
.profile-metric-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.profile-metric-grid.has-telegram-wallet { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.profile-metric-grid.has-telegram-wallet .profile-metric-card { min-width: 0; }
.profile-metric-card { position: relative; display: grid; grid-template-columns: 44px minmax(0, 1fr) auto; align-items: center; gap: 13px; min-height: 108px; padding: 19px; color: inherit; text-decoration: none; border: 1px solid var(--line); border-radius: 21px; background: #fff; box-shadow: 0 10px 30px rgba(20, 28, 40, .045); transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease; }
.profile-metric-card:hover { transform: translateY(-3px); border-color: rgba(77, 62, 111, .18); box-shadow: 0 18px 38px rgba(20, 28, 40, .09); }
.profile-metric-icon { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 15px; color: #4e3c74; background: linear-gradient(145deg, #f4f1fa, #e9e5f2); }
.profile-metric-icon svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.profile-metric-copy { min-width: 0; display: flex; flex-direction: column; gap: 4px; }
.profile-metric-copy > span { color: var(--muted); font-size: 11px; font-weight: 720; letter-spacing: .02em; }
.profile-metric-copy strong { font-size: 22px; line-height: 1.1; letter-spacing: -.035em; }
.profile-metric-copy small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--muted); font-size: 10px; }
.profile-card-arrow { color: #98a2b3; font-size: 17px; transition: transform .2s ease, color .2s ease; }
.profile-metric-card:hover .profile-card-arrow { color: #4e3c74; transform: translate(2px, -2px); }
.profile-service-summary { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 20px; margin-top: 12px; padding: 17px 20px; border: 1px solid rgba(105, 81, 155, .13); border-radius: 19px; background: radial-gradient(circle at 100% 0, rgba(118, 92, 174, .10), transparent 38%), linear-gradient(135deg, #fbfaff, #f7f8fb); }
.profile-service-summary .eyebrow { margin-bottom: 6px; }
.profile-service-summary strong { display: block; font-size: 14px; letter-spacing: -.01em; }
.profile-service-healthy { display: inline-flex; align-items: center; gap: 8px; }
.profile-service-healthy svg { width: 18px; height: 18px; flex: 0 0 18px; fill: none; stroke: #16834a; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }
.profile-service-summary-meta { display: flex; flex-direction: column; align-items: flex-end; gap: 4px; color: var(--muted); font-size: 11px; }
.profile-service-summary-meta strong { color: var(--ink); font-size: 13px; }
.profile-card-grid { display: grid; gap: 14px; }
.profile-card-grid-two { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.profile-card { min-width: 0; border: 1px solid var(--line); border-radius: 21px; background: #fff; box-shadow: 0 10px 30px rgba(20, 28, 40, .045); }
.profile-form-card, .profile-security-card { padding: 23px; }
.profile-card-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; margin-bottom: 19px; }
.profile-card-head h2, .profile-telegram-topline h2, .profile-danger-card h2 { margin: 0; font-size: 17px; letter-spacing: -.025em; }
.profile-card-head p, .profile-danger-card p, .profile-telegram-main > p { margin: 6px 0 0; color: var(--muted); font-size: 12px; line-height: 1.55; }
.profile-field-list { display: grid; gap: 0; }
.profile-field, .profile-readonly-field { display: grid; grid-template-columns: minmax(110px, .52fr) minmax(0, 1.48fr); align-items: center; gap: 18px; min-height: 67px; padding: 13px 0; border-bottom: 1px solid #edf0f4; }
.profile-field:last-child, .profile-readonly-field:last-child { border-bottom: 0; padding-bottom: 0; }
.profile-field:first-child, .profile-readonly-field:first-child { padding-top: 0; }
.profile-field.profile-autosave-field { grid-template-columns: minmax(0, 1fr); }
.profile-email-field { grid-template-columns: minmax(0, 1fr); }
.profile-email-field .profile-embedded-field, .profile-phone-verification { width: 100%; grid-template-columns: minmax(0, 30%) minmax(0, 1fr) !important; }
.profile-field-label { color: #667085; font-size: 10px; font-weight: 780; letter-spacing: .075em; text-transform: uppercase; }
.profile-input-wrap { position: relative; min-width: 0; }
.profile-embedded-field { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: stretch; overflow: hidden; min-height: 45px; border: 1px solid #e1e5eb; border-radius: 13px; background: #fbfcfd; }
.profile-embedded-field > .profile-field-label { display: flex; align-items: center; min-width: 0; padding: 0 12px; border-right: 1px solid #dfe3e8; background: #f3f5f7; white-space: nowrap; }
.profile-embedded-field input { min-width: 0; border: 0 !important; border-radius: 0 !important; background: transparent !important; box-shadow: none !important; }
.profile-embedded-field:focus-within { border-color: rgba(87, 66, 128, .52); box-shadow: 0 0 0 4px rgba(87, 66, 128, .08); background: #fff; }
.profile-phone-verification-field { grid-template-columns: minmax(0, 1fr); }
.profile-phone-verify-action { width: 100%; min-height: 43px; border: 0; border-radius: 0; box-shadow: none; padding-inline: 14px; }
.profile-phone-verify-action:hover { box-shadow: none; }
.profile-phone-verify-action:disabled { opacity: .72; cursor: wait; transform: none; }
.profile-phone-verified-value { min-width: 0; display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 0 12px; }
.profile-phone-verified-value strong { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 13px; }
.profile-input-wrap input, .profile-preference-select { width: 100%; min-height: 45px; box-sizing: border-box; border: 1px solid #e1e5eb; border-radius: 13px; outline: 0; background: #fbfcfd; color: var(--ink); font: inherit; font-size: 13px; transition: border-color .2s ease, box-shadow .2s ease, background .2s ease, transform .2s ease; }
.profile-input-wrap input { padding: 0 44px 0 13px; }
.profile-input-wrap input:hover, .profile-preference-select:hover { border-color: #cbd1da; background: #fff; }
.profile-input-wrap input:focus, .profile-preference-select:focus { border-color: rgba(87, 66, 128, .52); background: #fff; box-shadow: 0 0 0 4px rgba(87, 66, 128, .08); }
.profile-input-wrap input.is-saved { border-color: rgba(22, 131, 74, .42); box-shadow: 0 0 0 4px rgba(22, 131, 74, .055); }
.profile-input-wrap input.is-invalid { border-color: rgba(180, 35, 24, .42); box-shadow: 0 0 0 4px rgba(180, 35, 24, .055); }
.profile-save-state { position: absolute; right: 12px; top: 50%; transform: translateY(-50%); max-width: 150px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 9px; font-weight: 750; }
.profile-save-state.is-saving { color: #667085; }
.profile-save-state.is-saved { color: #16834a; }
.profile-save-state.is-error { color: #b42318; }
.profile-readonly-value { min-width: 0; display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.profile-readonly-value.profile-embedded-field { display: grid; grid-template-columns: minmax(0, 30%) minmax(0, 1fr) auto; align-items: center; justify-content: initial; gap: 0; padding: 0; }
.profile-readonly-value.profile-embedded-field > .profile-field-label { align-self: stretch; display: flex; align-items: center; padding: 0 12px; border-right: 1px solid #dfe3e8; background: #f3f5f7; white-space: nowrap; }
.profile-email-content { min-width: 0; display: flex; align-items: center; justify-content: space-between; flex-wrap: nowrap; gap: 10px; padding: 0 12px; }
.profile-email-content strong { min-width: 0; }
.profile-email-content .profile-status-line { margin-inline-start: auto; flex: 0 0 auto; white-space: nowrap; }
.profile-verified-icon { width: 15px; height: 15px; flex: 0 0 15px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.profile-readonly-value > span { min-width: 0; }
.profile-readonly-value strong { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 13px; }
.profile-member-since-value { font-size: 13px !important; }
.profile-copy-button, .profile-inline-action, .profile-secondary-action, .profile-primary-action, .profile-danger-action { display: inline-flex; align-items: center; justify-content: center; gap: 7px; min-height: 36px; padding: 0 13px; border-radius: 11px; box-sizing: border-box; font: inherit; font-size: 10px; font-weight: 780; text-decoration: none; cursor: pointer; transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease, background .2s ease, color .2s ease, opacity .2s ease; }
.profile-copy-button, .profile-secondary-action { border: 1px solid #e0e4ea; background: #fff; color: #475467; }
.profile-copy-button { width: 36px; min-width: 36px; padding: 0; }
.profile-copy-button svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.profile-copy-button:hover, .profile-secondary-action:hover { transform: translateY(-1px); border-color: #c9cfd8; box-shadow: 0 8px 18px rgba(20, 28, 40, .07); }
.profile-copy-button.is-copied { color: #16834a; border-color: rgba(22, 131, 74, .24); background: #f3fbf6; }
.profile-inline-action { min-height: 32px; border: 1px solid rgba(180, 83, 9, .18); background: #fff9ef; color: #a34f08; }
.profile-inline-action:hover { transform: translateY(-1px); background: #fff4df; }
.profile-primary-action { border: 1px solid #4f3d72; color: #fff; background: linear-gradient(145deg, #151923, #51406f); box-shadow: 0 10px 24px rgba(65, 51, 91, .17); }
.profile-security-row .profile-secondary-action { border-color: rgba(91, 74, 124, .15); background: linear-gradient(135deg, #faf8ff, #f0ecf8); color: #51406f; }
.profile-primary-action:hover { transform: translateY(-1px); box-shadow: 0 14px 28px rgba(65, 51, 91, .23); }
.profile-danger-action { border: 1px solid rgba(180, 35, 24, .16); color: #b42318; background: #fff8f7; }
.profile-danger-action:hover { transform: translateY(-1px); background: #fff2f0; border-color: rgba(180, 35, 24, .25); }
.profile-field-hint { grid-column: 2; margin-top: -4px; color: #98a2b3; font-size: 10px; }
.profile-field-hint.is-success { color: #16834a; }
.profile-status-line { margin-top: 0; color: #98a2b3; font-size: 10px; font-weight: 730; }
.profile-status-line.is-success { color: #16834a; }
.profile-status-line.is-warning { color: #a34f08; }
.profile-email-value { align-items: flex-start; }
.profile-email-value > span { min-width: 0; }
.profile-preferences-card { padding: 20px 22px 3px; }
.profile-preference-row { display: grid; grid-template-columns: minmax(0, 1fr) 220px; align-items: center; gap: 24px; min-height: 77px; }
.profile-preference-copy { min-width: 0; display: flex; flex-direction: column; gap: 5px; }
.profile-preference-copy strong { font-size: 13px; letter-spacing: -.01em; }
.profile-preference-copy span { color: var(--muted); font-size: 11px; line-height: 1.45; }
.profile-preference-select { appearance: none; -webkit-appearance: none; padding: 0 44px 0 16px; background-image: url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 width=%2720%27 height=%2720%27 viewBox=%270 0 24 24%27 fill=%27none%27 stroke=%27%235b6472%27 stroke-width=%272%27 stroke-linecap=%27round%27 stroke-linejoin=%27round%27%3E%3Cpath d=%27m7 9 5 5 5-5%27/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 14px center; background-size: 18px 18px; }
.profile-preference-row > .profile-secondary-action { font-size: 12px; }
.profile-preference-divider { height: 1px; background: #edf0f4; }
.profile-telegram-card { position: relative; display: grid; grid-template-columns: minmax(0, 1fr); gap: 18px; padding: 24px; overflow: hidden; }
.profile-telegram-card::after { content: ""; position: absolute; width: 240px; height: 240px; right: -100px; top: -130px; border-radius: 50%; background: radial-gradient(circle, rgba(37, 164, 232, .13), transparent 67%); pointer-events: none; }
.profile-telegram-mark { position: absolute; z-index: 2; top: 20px; inset-inline-end: 20px; display: grid; place-items: center; width: 52px; height: 52px; border-radius: 50%; overflow: hidden; background: #2AABEE; box-shadow: 0 10px 24px rgba(42, 171, 238, .22), inset 0 0 0 1px rgba(255,255,255,.35); }
.profile-telegram-mark svg { width: 52px; height: 52px; display: block; }
.profile-telegram-main { position: relative; z-index: 1; min-width: 0; }
/* Keep only the heading/copy clear of the Telegram icon.
   Let the connected details and action rows use the full card width
   below the icon instead of leaving an empty column on the right. */
.profile-telegram-topline, .profile-telegram-main > p { padding-inline-end: 70px; }
.profile-telegram-topline { display: flex; align-items: center; justify-content: flex-start; gap: 10px; }
.profile-connection-badge { padding: 6px 9px; border-radius: 999px; font-size: 9px; font-weight: 800; }
.profile-connection-badge.is-connected { color: #16834a; background: #eefaf3; }
.profile-connection-badge.is-disconnected { color: #667085; background: #f2f4f7; }
.profile-telegram-details { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; margin-top: 18px; }
.profile-telegram-details > div { min-width: 0; display: grid; grid-template-columns: minmax(0, 38%) minmax(0, 1fr); align-items: stretch; height: 36px; min-height: 36px; padding: 0; border: 1px solid #e1e5eb; border-radius: 13px; overflow: hidden; background: #fbfcfd; }
.profile-telegram-details span { display: flex; align-items: center; min-width: 0; margin: 0; padding: 0 10px; color: #667085; background: #f1f3f6; border-right: 1px solid #dfe3e8; font-size: 11px; font-weight: 780; letter-spacing: .05em; text-transform: uppercase; white-space: nowrap; }
.profile-telegram-details strong { display: flex; align-items: center; min-width: 0; overflow: hidden; padding: 0 10px; text-overflow: ellipsis; white-space: nowrap; font-size: 13px; font-weight: 400; }
.profile-telegram-details > .profile-telegram-group-title { grid-column: 1 / -1; display: flex; align-items: center; height: auto; min-height: 0; margin-top: 8px; padding: 5px 2px 1px; border: 0; border-radius: 0; overflow: visible; background: transparent; color: #667085; font-size: 10px; font-weight: 850; letter-spacing: .08em; line-height: 1.2; text-transform: uppercase; }
.profile-telegram-password-value { justify-content: space-between; gap: 8px; }
.profile-telegram-password-value > span { min-width: 0; overflow: hidden; padding: 0; border: 0; background: transparent; color: inherit; font-size: inherit; font-weight: inherit; letter-spacing: normal; text-transform: none; text-overflow: ellipsis; white-space: nowrap; }
.profile-telegram-password-toggle { display: grid; place-items: center; width: 26px; min-width: 26px; height: 26px; padding: 0; border: 0; border-radius: 8px; color: #667085; background: transparent; cursor: pointer; }
.profile-telegram-password-toggle:hover { color: #344054; background: #eef1f4; }
.profile-telegram-password-toggle:disabled { opacity: .55; cursor: wait; }
.profile-telegram-contact-value { gap: 8px; justify-content: space-between; }
.profile-telegram-contact-value .profile-status-line { display: inline-flex; flex: 0 0 auto; align-items: center; gap: 6px; margin: 0; padding: 0; border: 0; color: #16834a; background: transparent; font-size: 10px; font-weight: 730; letter-spacing: normal; text-transform: none; white-space: nowrap; }
.profile-telegram-password-toggle svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.profile-telegram-verification-value { gap: 6px; }
.profile-telegram-verification-value .profile-verified-icon { width: 15px; height: 15px; }
.profile-telegram-actions { display: flex; justify-content: flex-end; margin-top: 15px; }
.profile-telegram-actions .profile-danger-action { width: 100%; }
.profile-telegram-connect-note { display: none; flex-direction: column; gap: 4px; margin-top: 17px; padding: 14px 15px; border: 1px solid rgba(25, 143, 208, .12); border-radius: 14px; background: #f7fbfe; }
.profile-telegram-connect-note.is-visible { display: flex; animation: profile-phone-note-in .24s ease-out both; }
@keyframes profile-phone-note-in {
    from { opacity: 0; transform: translateY(-6px); }
    to { opacity: 1; transform: translateY(0); }
}
.profile-telegram-connect-note strong { font-size: 11px; }
.profile-telegram-connect-note span { color: var(--muted); font-size: 10px; line-height: 1.55; }
.profile-telegram-card.is-unlinked .profile-primary-action { width: 100%; margin-top: 13px; }
.profile-security-icon { display: grid; place-items: center; width: 42px; min-width: 42px; height: 42px; padding: 0; border-radius: 13px; color: #5b4a7c; background: linear-gradient(145deg, #f4f1fa, #ece8f5); box-shadow: inset 0 0 0 1px rgba(91, 74, 124, .06); }
.profile-security-icon svg { width: 21px; height: 21px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.profile-security-row { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding-top: 15px; border-top: 1px solid #edf0f4; }
.profile-security-row > div, .profile-activity-grid > div { display: flex; flex-direction: column; gap: 5px; }
.profile-security-status { flex-direction: row !important; align-items: center; flex-wrap: nowrap; }
.profile-security-row strong, .profile-activity-grid strong { font-size: 12px; }
.profile-activity-grid { display: grid; grid-template-columns: 1fr; gap: 10px; padding-top: 15px; border-top: 1px solid #edf0f4; }
.profile-activity-grid > div { height: 36px; min-height: 36px; display: grid; grid-template-columns: minmax(105px, 105px) minmax(0, 1fr); align-items: stretch; padding: 0; overflow: hidden; border: 1px solid #edf0f4; border-radius: 14px; background: #fbfcfd; }
.profile-activity-grid > div:nth-child(2) { display: none; }
.profile-activity-grid span { color: #98a2b3; font-size: 8px; font-weight: 750; letter-spacing: .06em; text-transform: uppercase; }
.profile-activity-grid > div > span { display: flex; align-items: center; padding: 0 10px; background: #f1f3f6; border-right: 1px solid #dfe3e8; white-space: nowrap; }
.profile-activity-grid > div > strong { display: flex; align-items: center; min-width: 0; padding: 0 10px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.is-success { color: #16834a !important; }
.is-warning { color: #a34f08 !important; }
.profile-danger-zone { margin-top: 30px; }
.profile-danger-card { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 19px 22px; background: #fcfcfd; }
.profile-danger-card .profile-secondary-action { border-color: rgba(180, 35, 24, .14); color: #a83227; background: linear-gradient(135deg, #fff9f8, #fdeeed); }
.profile-toast { position: fixed; z-index: 10000; left: 50%; bottom: 24px; transform: translate(-50%, 18px); width: min(430px, calc(100% - 30px)); padding: 12px 15px; border: 1px solid rgba(22, 131, 74, .16); border-radius: 14px; color: #12683d; background: rgba(246, 253, 249, .96); box-shadow: 0 18px 44px rgba(20, 28, 40, .14); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); font-size: 11px; font-weight: 720; opacity: 0; pointer-events: none; transition: opacity .2s ease, transform .2s ease; }
.profile-toast.is-visible { opacity: 1; transform: translate(-50%, 0); }
.profile-toast.is-error { color: #a72318; border-color: rgba(180, 35, 24, .15); background: rgba(255, 248, 247, .97); }
.profile-toast-server { position: static; transform: none; width: auto; margin-bottom: 14px; opacity: 1; pointer-events: auto; }
.profile-modal-backdrop { position: fixed; z-index: 9997; inset: 0; background: rgba(12, 16, 24, .44); backdrop-filter: blur(7px); -webkit-backdrop-filter: blur(7px); opacity: 0; transition: opacity .18s ease; }
.profile-modal-backdrop.is-open { opacity: 1; }
.profile-modal { position: fixed; z-index: 9998; left: 50%; top: 50%; width: min(500px, calc(100% - 30px)); max-height: calc(100vh - 30px); overflow: auto; box-sizing: border-box; padding: 23px; border: 1px solid rgba(255,255,255,.76); border-radius: 23px; background: rgba(255,255,255,.97); box-shadow: 0 30px 90px rgba(12, 16, 24, .24); transform: translate(-50%, calc(-50% + 12px)) scale(.985); opacity: 0; transition: opacity .18s ease, transform .18s ease; }
.profile-modal.is-open { opacity: 1; transform: translate(-50%, -50%) scale(1); }
.profile-modal-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; margin-bottom: 18px; }
.profile-modal-head .eyebrow { margin-bottom: 6px; }
.profile-modal-head h2 { margin: 0; font-size: 22px; letter-spacing: -.04em; }
.profile-modal-close { display: grid; place-items: center; width: 34px; height: 34px; flex: 0 0 34px; border: 1px solid #e3e7ec; border-radius: 11px; color: #667085; background: #fff; font-size: 21px; line-height: 1; cursor: pointer; }
.profile-modal-form { display: grid; gap: 13px; }
.profile-modal-form label { display: grid; gap: 7px; }
.profile-modal-form label > span { color: #667085; font-size: 10px; font-weight: 760; letter-spacing: .06em; text-transform: uppercase; }
.profile-modal-form input { width: 100%; min-height: 47px; box-sizing: border-box; padding: 0 13px; border: 1px solid #dfe4ea; border-radius: 13px; outline: 0; background: #fbfcfd; color: var(--ink); font: inherit; font-size: 13px; }
.profile-modal-form input:focus { border-color: rgba(87, 66, 128, .52); box-shadow: 0 0 0 4px rgba(87, 66, 128, .08); background: #fff; }
.profile-password-guidance { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 2px; }
.profile-password-guidance span { padding: 6px 8px; border-radius: 999px; color: #667085; background: #f2f4f7; font-size: 9px; font-weight: 700; }
.profile-modal-message { min-height: 18px; color: #667085; font-size: 10px; line-height: 1.5; }
.profile-modal-message.is-success { color: #16834a; }
.profile-modal-message.is-error { color: #b42318; }
.profile-modal-submit { width: 100%; min-height: 47px; }
.profile-confirm-modal > p { margin: 0; color: var(--muted); font-size: 12px; line-height: 1.65; }
.profile-modal-actions { display: flex; justify-content: flex-end; gap: 9px; margin-top: 20px; }
body.profile-modal-open { overflow: hidden; }
[dir="rtl"] .profile-hero, [dir="rtl"] .profile-metric-card, [dir="rtl"] .profile-telegram-card, [dir="rtl"] .profile-preference-row, [dir="rtl"] .profile-danger-card { direction: rtl; }
[dir="rtl"] .profile-card-arrow { transform: scaleX(-1); }
[dir="rtl"] .profile-metric-card:hover .profile-card-arrow { transform: scaleX(-1) translate(2px, -2px); }
[dir="rtl"] .profile-save-state { right: auto; left: 12px; }
[dir="rtl"] .profile-input-wrap input { padding-left: 44px; padding-right: 13px; }
[dir="rtl"] .profile-embedded-field { direction: rtl; }
[dir="rtl"] .profile-embedded-field > .profile-field-label, [dir="rtl"] .profile-readonly-value.profile-embedded-field > .profile-field-label { border-right: 0; border-left: 1px solid #dfe3e8; }
[dir="rtl"] .profile-email-content { direction: rtl; }
[dir="rtl"] .profile-telegram-details > div > span, [dir="rtl"] .profile-activity-grid > div > span { border-right: 0; border-left: 1px solid #dfe3e8; }
[dir="rtl"] .profile-service-summary-meta { align-items: flex-start; }
@media (max-width: 980px) {
    .profile-metric-grid.has-telegram-wallet { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .profile-metric-grid.has-telegram-wallet .profile-metric-card:first-child { grid-column: auto; }
    .profile-hero { grid-template-columns: 1fr; min-height: 0; }
    .profile-metric-grid { grid-template-columns: 1fr 1fr; }
    .profile-metric-card:first-child { grid-column: 1 / -1; }
    .profile-telegram-details { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 720px) {
    .profile-page { width: min(100% - 28px, 680px); padding-top: 12px; padding-bottom: 54px; }
    .profile-hero { padding: 26px 20px; border-radius: 24px; gap: 18px; --profile-hero-art-top: 0px; }
    .profile-hero-copy h1 { font-size: 46px; }
    .profile-hero-copy > p:last-child { margin-top: 14px; font-size: 14px; }
    .profile-section { margin-top: 25px; }
    .profile-card-grid-two { grid-template-columns: 1fr; }
    .profile-metric-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
    .profile-service-summary { grid-template-columns: 1fr; gap: 10px; }
    .profile-service-summary-meta { align-items: flex-start; }
    .profile-field { grid-template-columns: 1fr; gap: 8px; min-height: 0; padding: 15px 0; }
    .profile-readonly-field { gap: 8px; min-height: 0; padding: 15px 0; }
    .profile-field-hint { grid-column: auto; margin-top: -3px; }
    .profile-readonly-value { width: 100%; }
    .profile-embedded-field { width: 100%; }
    .profile-readonly-value.profile-embedded-field { grid-template-columns: minmax(0, 30%) minmax(0, 1fr) auto; }
    .profile-email-content { min-width: 0; flex-wrap: nowrap; }
    .profile-email-content strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
    .profile-preference-row { grid-template-columns: 1fr; gap: 11px; padding: 15px 0; }
    .profile-preference-select { max-width: 100%; }
    .profile-telegram-card { grid-template-columns: minmax(0, 1fr); gap: 13px; padding: 19px; }
    .profile-telegram-mark { top: 16px; inset-inline-end: 16px; width: 48px; height: 48px; }
    .profile-telegram-mark svg { width: 48px; height: 48px; }
    .profile-telegram-topline { align-items: center; flex-direction: row; gap: 9px; }
    .profile-telegram-details { grid-template-columns: 1fr; }
    .profile-telegram-details > div { grid-template-columns: minmax(0, 40%) minmax(0, 1fr); height: 36px; min-height: 36px; }
    .profile-telegram-details > .profile-telegram-group-title { grid-template-columns: 1fr; height: auto; margin-top: 7px; padding: 5px 1px 1px; }
    .profile-telegram-actions { justify-content: flex-start; }
    .profile-security-row, .profile-danger-card { align-items: stretch; flex-direction: column; }
    .profile-activity-grid { grid-template-columns: 1fr; }
    .profile-activity-grid > div:nth-child(2) { display: grid; }
    .profile-activity-grid > div { height: 36px; min-height: 36px; grid-template-columns: minmax(105px, 26%) minmax(0, 1fr); }
    .profile-modal { padding: 19px; border-radius: 20px; }
}
@media (max-width: 430px) {
    .profile-page { width: calc(100% - 22px); }
    .profile-hero { padding: 22px 17px; }
    .profile-hero-copy h1 { font-size: 39px; }
    .profile-form-card, .profile-security-card, .profile-telegram-card { padding: 17px; }
    .profile-preferences-card { padding: 15px 17px 2px; }
    .profile-metric-card { min-height: 92px; padding: 14px; gap: 9px; }
    .profile-metric-card:not(:first-child) { grid-template-columns: 34px minmax(0, 1fr) auto; }
    .profile-metric-card:not(:first-child) .profile-metric-icon { width: 34px; height: 34px; border-radius: 11px; }
    .profile-metric-card:not(:first-child) .profile-metric-icon svg { width: 16px; height: 16px; }
    .profile-metric-copy strong { font-size: 20px; }
    .profile-copy-button, .profile-inline-action, .profile-secondary-action, .profile-primary-action, .profile-danger-action { font-size: 9px; }
    .profile-danger-card { padding: 17px; }
}

.profile-telegram-login-wrap { display: flex; align-items: center; justify-content: space-between; gap: 18px; margin-top: 18px; padding: 13px 15px; border: 1px solid #e8eef2; border-radius: 14px; background: #fbfdfe; }
.profile-telegram-widget-note { display: block; margin-top: 8px; color: #98a2b3; font-size: 9px; line-height: 1.5; }
.profile-telegram-connect-note.is-success { border-color: rgba(22, 131, 74, .13); background: #f3fbf6; }
.profile-telegram-connect-note.is-success strong { color: #16834a; }
.profile-telegram-connect-note.is-error { border-color: rgba(180, 35, 24, .13); background: #fff8f7; }
.profile-telegram-connect-note.is-error strong { color: #b42318; }
@media (max-width: 520px) {
    .profile-telegram-login-wrap { align-items: flex-start; flex-direction: column; gap: 9px; }
}
/* Wallet page redesign: hero, dual balances, wallet selection and stable mobile layout. */
.wallet-page .wallet-hero { position:relative; grid-template-columns:minmax(0,1fr) minmax(280px,420px); align-items:center; gap:30px; min-height:260px; margin:4px 0 24px; padding:34px 38px; overflow:hidden; border:1px solid rgba(37,99,235,.10); border-radius:30px; }
.wallet-page .wallet-hero::before, .wallet-page .wallet-hero::after { content:""; position:absolute; border-radius:50%; pointer-events:none; }
.wallet-page .wallet-hero::after { width:120px; height:120px; left:-50px; top:-54px; border:1px solid rgba(59,130,246,.12); }
.wallet-page .wallet-hero-copy { position:relative; z-index:2; max-width:620px; }
.wallet-page .wallet-hero-copy .eyebrow { margin-bottom:9px; }
.wallet-page .wallet-hero-copy h1 { margin:0; font-size:clamp(38px,5vw,58px); line-height:1.02; }
.wallet-page .wallet-hero-copy p { margin:16px 0 0; font-size:16px; line-height:1.75; }
.wallet-page .wallet-hero-art { position:relative; z-index:2; width:100%; max-width:420px; justify-self:end; }
.wallet-page .wallet-hero-art svg { width:100%; height:auto; }
.wallet-page .wallet-balance-card { position:relative; padding:34px 38px; overflow:hidden; border-radius:30px; display:flex; align-items:flex-start; gap:30px; }
.wallet-page .wallet-balance-content { position:relative; z-index:2; align-items:flex-start; }
.wallet-page .wallet-balance-main { min-width:0; }
.wallet-page .wallet-balance-side { position:relative; display:flex; flex-direction:column; align-items:flex-end; gap:14px; flex:0 0 auto; }
.wallet-page .wallet-balance-status { margin:0; order:0; align-self:auto; }
.wallet-page .wallet-balance-telegram { display:flex; align-items:center; gap:9px; min-height:40px; padding:8px 13px; border:1px solid rgba(255,255,255,.20); border-radius:13px; background:rgba(255,255,255,.09); color:rgba(255,255,255,.82); font-size:11px; line-height:1.2; white-space:nowrap; }
.wallet-page .wallet-balance-telegram strong { color:#fff; font-size:14px; font-weight:800; }
.wallet-page .wallet-wallet-choice-block { padding-top:25px; padding-bottom:25px; }
.wallet-page .wallet-wallet-choice { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:13px; margin-top:18px; }
.wallet-page .wallet-wallet-option { position:relative; display:flex; align-items:center; gap:13px; min-height:76px; padding:15px 17px; border:1px solid #e4eaf2; border-radius:17px; background:#fff; }
.wallet-page .wallet-wallet-option:hover { transform:translateY(-1px); border-color:#bfd3ef; box-shadow:0 9px 24px rgba(28,73,130,.07); }
.wallet-page .wallet-wallet-option.is-selected { border-color:#6b9fe4; background:#f7fbff; box-shadow:0 9px 25px rgba(37,99,235,.09); }
.wallet-page .wallet-wallet-option input { position:absolute; }
.wallet-page .wallet-wallet-radio { width:19px; height:19px; flex:0 0 19px; border:2px solid #b9c5d4; border-radius:50%; display:grid; place-items:center; }
.wallet-page .wallet-wallet-option.is-selected .wallet-wallet-radio { border-color:#2563eb; }
.wallet-page .wallet-wallet-option.is-selected .wallet-wallet-radio::after { content:""; width:9px; height:9px; border-radius:50%; background:#2563eb; }
.wallet-page .wallet-wallet-option-copy { min-width:0; display:flex; flex-direction:column; gap:4px; }
.wallet-page .wallet-wallet-option-copy strong { color:#142033; font-size:14px; line-height:1.3; }
.wallet-page .wallet-wallet-option-copy small { color:#738093; font-size:12px; line-height:1.3; }
[dir="rtl"] .wallet-page .wallet-balance-side { align-items:flex-start; }
[dir="rtl"] .wallet-page .wallet-wallet-option { text-align:right; }
@media (max-width:900px) {
    .wallet-page .wallet-hero { grid-template-columns:minmax(0,1fr) 300px; padding:28px; }
    .wallet-page .wallet-hero-art { max-width:300px; }
    .wallet-page .wallet-balance-card { padding:28px; }
}
@media (max-width:620px) {
    .wallet-page .wallet-hero { grid-template-columns:1fr; margin-bottom:18px; padding:25px 21px 18px; border-radius:24px; gap:6px; }
    .wallet-page .wallet-hero-copy h1 { font-size:39px; }
    .wallet-page .wallet-hero-copy p { margin-top:11px; font-size:14px; line-height:1.65; }
    .wallet-page .wallet-hero-art { width:78%; margin-top:-5px; margin-right:-6px; }
    /* Keep Available now pinned at the top-right on mobile, like desktop. */
    .wallet-page .wallet-balance-card { border-radius:22px; display:block; }
    .wallet-page .wallet-balance-side { top:22px; right:20px; gap:10px; }
    .wallet-page .wallet-wallet-option { padding:10px; }
}
@media (max-width:390px) {
    .wallet-page .wallet-balance-content { padding-right:108px; }
    .wallet-page .wallet-balance-side { right:15px; max-width:104px; }
    .wallet-page .wallet-balance-status { font-size:10px; padding:7px 9px; }
    .wallet-page .wallet-balance-telegram { max-width:126px; }
    .wallet-page .wallet-balance-value { font-size:30px; }
    .wallet-page .wallet-wallet-choice { grid-template-columns:1fr; }
}
.wallet-page .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; }
/* =========================================================
   Wallet page refinement - strong hero, responsive dual balance,
   smooth step transitions and full-width payment feedback.
   ========================================================= */
.wallet-page .wallet-hero { display:none; border-color:rgba(255,255,255,.10); background: radial-gradient(circle at 86% 12%, rgba(91, 214, 194, .22), transparent 30%), radial-gradient(circle at 12% 92%, rgba(132, 76, 196, .24), transparent 34%), linear-gradient(135deg, #10262f 0%, #17484c 48%, #3b2b59 100%); box-shadow:0 28px 76px rgba(20,35,46,.24); }
.wallet-page .wallet-hero::before { width:300px; height:300px; right:12%; bottom:-205px; background:rgba(83,220,201,.12); }
.wallet-page .wallet-hero::after { border-color:rgba(129,226,214,.16); }
.wallet-page .wallet-hero-copy .eyebrow { color:rgba(174,245,231,.88); }
.wallet-page .wallet-hero-copy h1 { color:#fff; letter-spacing: -.045em; }
.wallet-page .wallet-hero-copy p { color:rgba(255,255,255,.76); max-width: 590px; }
.wallet-page .wallet-hero-art { filter:drop-shadow(0 20px 35px rgba(3,22,29,.16)); }
/* Clip the curved lower SVG layer to the same rounded card boundary. */
.wallet-page .wallet-hero-art svg { overflow:visible; display: block; }
.wallet-page .wallet-balance-card { box-shadow:0 24px 58px rgba(20,55,112,.16); justify-content: space-between; }
.wallet-page .wallet-balance-value { white-space:nowrap; }
.wallet-page .wallet-balance-side { min-width:245px; z-index: 4; }
.wallet-page .wallet-balance-telegram { justify-content:space-between; }
.wallet-page .wallet-balance-telegram span { font-weight:650; }
.wallet-page .wallet-step-block, .wallet-page #wallet-payment-success, .wallet-page #wallet-paypal-status { scroll-margin-top:110px; }
.wallet-page .wallet-wallet-option { -webkit-tap-highlight-color:transparent; user-select:none; cursor: pointer; transition: border-color .16s ease,box-shadow .16s ease,transform .16s ease,background .16s ease; }
.wallet-page .wallet-wallet-option input { pointer-events:none; opacity: 0; }
.wallet-page .wallet-wallet-option:focus-within { border-color:#6b9fe4; box-shadow:0 0 0 3px rgba(37,99,235,.10); }
.wallet-page .wallet-wallet-option.is-selected { transition:background .24s ease,border-color .24s ease,box-shadow .24s ease,transform .24s ease; }
.wallet-page .wallet-payment-note.wallet-payment-error { color:#b42318; }
.wallet-page .wallet-payment-success { width:100%; max-width:none; box-sizing:border-box; margin:18px 0 0; border-radius:16px; opacity:0; transform:translateY(8px); transition:opacity .35s ease,transform .35s ease; }
.wallet-page .wallet-payment-success.is-visible { opacity:1; transform:translateY(0); }
@media (max-width:900px) {
    .wallet-page .wallet-balance-side { min-width:205px; }
}
@media (max-width:620px) {
    .wallet-page .wallet-hero { background: radial-gradient(circle at 84% 12%, rgba(91,214,194,.24), transparent 32%), radial-gradient(circle at 14% 92%, rgba(132,76,196,.25), transparent 38%), linear-gradient(145deg,#10262f 0%,#17484c 50%,#3b2b59 100%); min-height: 0; }
    .wallet-page .wallet-hero-copy .eyebrow { color:rgba(174,245,231,.92); }
    .wallet-page .wallet-balance-card { padding:23px 20px 70px; }
    .wallet-page .wallet-balance-content { display:flex; gap:13px; padding-right:0; }
    .wallet-page .wallet-balance-side { position:static; min-width:0; max-width:none; display:contents; align-items: flex-end; }
    .wallet-page .wallet-balance-status { position:absolute; top:22px; right:20px; z-index:5; }
    .wallet-page .wallet-balance-telegram { position:absolute; left:20px; right:20px; bottom:17px; top:auto; width:auto; max-width:none; min-height:42px; box-sizing:border-box; padding:8px 12px; flex-direction:row; align-items:center; gap:14px; border-radius:13px; white-space:nowrap; text-align:start; }
    .wallet-page .wallet-balance-telegram span { font-size:12px; line-height:1.25; }
    .wallet-page .wallet-balance-telegram strong { font-size:15px; white-space:nowrap; }
    .wallet-page .wallet-balance-value { font-size:34px; }
    .wallet-page .wallet-payment-success { margin-top:16px; padding:15px; }
}
@media (max-width:390px) {
    .wallet-page .wallet-balance-card { padding-bottom:67px; }
    .wallet-page .wallet-balance-status { right:15px; }
    .wallet-page .wallet-balance-telegram { left:15px; right:15px; bottom:15px; }
    .wallet-page .wallet-balance-telegram span { font-size:11px; }
    .wallet-page .wallet-balance-telegram strong { font-size:14px; }
}

/* VIPENVPN Wallet - database-driven gateways and wallet-to-wallet transfer */
.wallet-page .wallet-method.wallet-method-wallet-transfer { border-color:#d8e4f3; gap:8px; padding-left:13px; padding-right:13px; }
.wallet-page .wallet-method.wallet-method-wallet-transfer .wallet-method-copy strong { white-space:nowrap; font-size:12.5px; }
.wallet-page .wallet-method-wallet-transfer.wallet-method-mark { color:#2563eb; background:#eef5ff; }
.wallet-page .wallet-method-wallet-transfer.wallet-method-mark svg { width:26px; height:26px; display:block; }
.wallet-page .wallet-method-wallet-transfer .wallet-method-copy small { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.wallet-page .wallet-method:not(.is-disabled) .wallet-method-copy small[data-gateway-status] { color:#748196; }
.wallet-page .wallet-transfer-submit { display:flex; align-items:center; justify-content:center; width:100%; min-height:46px; margin-top:12px; padding:11px 16px; border:0; border-radius:13px; background:linear-gradient(135deg,#2563eb,#4f46e5); color:#fff; font:inherit; font-size:13px; font-weight:800; cursor:pointer; box-shadow:0 9px 20px rgba(37,99,235,.18); opacity:1; transition:background .35s ease,filter .2s ease,transform .2s ease,box-shadow .35s ease,opacity .2s ease; }
.wallet-page .wallet-transfer-submit[hidden] { display:none !important; }
.wallet-page .wallet-transfer-submit:hover:not(:disabled) { filter:brightness(1.04); transform:translateY(-1px); box-shadow:0 11px 24px rgba(37,99,235,.22); }
.wallet-page .wallet-transfer-submit:disabled { cursor:not-allowed; }
.wallet-page .wallet-transfer-submit.is-processing { background:linear-gradient(135deg,#f59e0b,#fbbf24); box-shadow:0 9px 22px rgba(245,158,11,.24); cursor:wait; }
.wallet-page .wallet-transfer-submit.is-success { background:linear-gradient(135deg,#16a34a,#22c55e); color:#fff; box-shadow:0 9px 22px rgba(34,197,94,.24); cursor:default; }
.wallet-page .wallet-method.is-disabled .wallet-method-copy small { color:#a5adba; }
@media (max-width:650px) {
    .wallet-page .payment-paypal-panel { padding:16px; }
    .wallet-page .payment-paypal-buttons-wrap { width:100%; }
}
/* Wallet transfer success state: keep the completed button display-only. */
.wallet-page .wallet-transfer-submit.is-success, .wallet-page .wallet-transfer-submit.is-success:disabled, .wallet-page .wallet-transfer-submit.is-success[disabled] { color: #fff !important; -webkit-text-fill-color: #fff !important; cursor: default; }
/* VIPENVPN Services - status filters */
.services-status-filter { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:9px; margin-top:28px; padding:7px; border:1px solid #e5e0eb; border-radius:18px; background:rgba(255,255,255,.9); box-shadow:0 8px 24px rgba(42,28,62,.035); }
.services-status-radio { min-width:0; display:flex; align-items:center; justify-content:center; gap:8px; min-height:42px; padding:9px 12px; box-sizing:border-box; border:1px solid transparent; border-radius:13px; background:transparent; color:#6e687a; font-size:11px; font-weight:750; line-height:1.2; text-align:center; text-decoration:none; transition:background .16s ease,border-color .16s ease,color .16s ease,box-shadow .16s ease,transform .16s ease; }
.services-status-radio:hover { color:#332b40; background:#faf8fc; border-color:#e8e2ee; }
.services-status-radio.is-selected { color:#4b2d70; background:#f5effb; border-color:#cdbbe0; box-shadow:0 6px 16px rgba(76,43,128,.08); }
.services-status-radio-dot { position:relative; flex:0 0 15px; width:15px; height:15px; box-sizing:border-box; border:1.5px solid #b8b0c2; border-radius:50%; background:#fff; }
.services-status-radio.is-selected .services-status-radio-dot { border-color:#68468f; }
.services-status-radio.is-selected .services-status-radio-dot::after { content:""; position:absolute; width:7px; height:7px; left:50%; top:50%; border-radius:50%; background:#68468f; transform:translate(-50%,-50%); }
.services-pagination { margin-top:14px; }
@media(max-width:650px) {
    .services-status-filter { grid-template-columns:repeat(2,minmax(0,1fr)); gap:6px; margin-top:20px; padding:6px; border-radius:16px; }
    .services-status-radio { min-height:40px; padding:8px 7px; font-size:10px; gap:6px; }
    .services-status-radio-dot { flex-basis:14px;width:14px;height:14px; }
    .services-status-radio.is-selected .services-status-radio-dot::after { width:6px;height:6px; }
}
/* ================================================================
   Support Center - VIPENVPN
   ================================================================ */
.support-page { background:linear-gradient(180deg,#f8fbfd 0,#f4f7fb 45%,#f8fafc 100%); }
.support-shell { width:min(1160px,calc(100% - 40px));margin:0 auto;padding:20px 0 90px; }
.support-hero { position:relative;isolation:isolate;overflow:hidden;min-height:285px;border-radius:30px;background:linear-gradient(135deg,#0b1d2a 0%,#123a4d 48%,#10243c 100%);box-shadow:0 24px 70px rgba(17,44,62,.18);padding:40px 50px;display:flex;align-items:center;justify-content:space-between;color:#fff; }
.support-hero-grid { position:absolute;inset:0;opacity:.24;background-image:linear-gradient(rgba(255,255,255,.08) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.08) 1px,transparent 1px);background-size:44px 44px;mask-image:linear-gradient(90deg,#000,transparent 82%);pointer-events:none; }
.support-hero-glow { position:absolute;border-radius:999px;filter:blur(8px);pointer-events:none;z-index:-1; }
.support-hero-glow-one { width:300px;height:300px;right:15%;top:-190px;background:radial-gradient(circle,rgba(80,205,231,.3),transparent 68%); }
.support-hero-glow-two { width:420px;height:420px;right:-160px;bottom:-260px;background:radial-gradient(circle,rgba(224,177,73,.22),transparent 68%); }
.support-hero-copy { position:relative;z-index:2;max-width:680px; }
.support-eyebrow,.support-section-kicker { display:inline-flex;align-items:center;gap:8px;font-size:10px;letter-spacing:.18em;font-weight:800;color:#70d5e9; }
.support-eyebrow:before { content:"";width:24px;height:1px;background:currentColor;opacity:.8; }
.support-hero h1 { margin:12px 0 10px;font-size:clamp(31px,4vw,48px);line-height:1.02;letter-spacing:-.035em;color:#fff; }
.support-hero p { margin:0;max-width:610px;color:rgba(235,247,250,.76);font-size:15px;line-height:1.7; }
.support-hero-action { display:inline-flex;align-items:center;gap:9px;margin-top:22px;border:1px solid rgba(255,255,255,.14);border-radius:13px;padding:11px 15px;background:rgba(255,255,255,.08);color:#fff;font:inherit;font-size:13px;font-weight:750;cursor:pointer;transition:transform .2s ease,background .2s ease,border-color .2s ease; }
.support-hero-action:hover { transform:translateY(-2px);background:rgba(255,255,255,.13);border-color:rgba(255,255,255,.24); }
.support-hero-action svg { width:16px;height:16px; }
.support-hero-art { position:relative;width:260px;height:205px;flex:0 0 260px;display:grid;place-items:center;margin-inline-end:4px; }
.support-hero-core { width:112px;height:112px;display:grid;place-items:center;border-radius:50%;color:#fff;background:radial-gradient(circle at 35% 25%,rgba(255,245,190,.14),rgba(255,255,255,.045) 48%,rgba(255,255,255,.02) 100%);border:1px solid rgba(255,255,255,.2);box-shadow:0 20px 45px rgba(0,0,0,.2),inset 0 0 0 8px rgba(255,255,255,.025),inset 0 1px 0 rgba(255,255,255,.12);animation:supportFloat 5s ease-in-out infinite; }
.support-hero-core svg { width:100px;height:100px;overflow:visible;filter:drop-shadow(0 8px 14px rgba(0,0,0,.16)); }
.support-hero-spark { animation:supportSpark 2.8s ease-in-out infinite;transform-origin:center; }
.support-orbit { position:absolute;border:1px solid rgba(147,223,235,.22);border-radius:50%;transform:rotate(-18deg); }
.support-orbit-one { width:172px;height:102px;animation:supportOrbit 8s linear infinite; }
.support-orbit-two { width:112px;height:172px;transform:rotate(55deg);border-color:rgba(226,188,91,.2);animation:supportOrbit 10s linear infinite reverse; }
@keyframes supportFloat {
    50% { transform:translateY(-5px) rotate(1deg) }
}
@keyframes supportSpark {
    0%,100% { opacity:.45;transform:scale(.88) }
    50% { opacity:1;transform:scale(1.12) }
}
@keyframes supportOrbit {
    to { transform:rotate(342deg) }
}
/* Support benefit cards */
.support-benefits { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-top:18px; }
.support-benefit-card { min-width:0;display:flex;align-items:center;gap:13px;min-height:82px;padding:15px 17px;border:1px solid rgba(16,45,61,.09);border-radius:20px;background:rgba(255,255,255,.9);box-shadow:0 10px 30px rgba(20,39,53,.055); }
.support-benefit-icon { width:46px;height:46px;flex:0 0 46px;display:grid;place-items:center;border-radius:14px;border:1px solid rgba(20,137,164,.08); }
.support-benefit-icon svg { width:23px;height:23px; }
.support-benefit-icon.is-cyan { color:#16a1bd;background:linear-gradient(145deg,#e4faff,#eefcff); }
.support-benefit-icon.is-gold { color:#d29b22;background:linear-gradient(145deg,#fff7df,#fffaf0); }
.support-benefit-icon.is-purple { color:#7563c6;background:linear-gradient(145deg,#f1efff,#f8f6ff); }
.support-benefit-card>div:last-child { min-width:0;display:flex;flex-direction:column;gap:4px; }
.support-benefit-card strong { color:#263742;font-size:14px;line-height:1.25;font-weight:800;letter-spacing:-.01em; }
.support-benefit-card span { color:#89979f;font-size:11px;line-height:1.45; }
/* Direct Telegram support card */
.support-telegram-card { display:grid;grid-template-columns:48px minmax(0,1fr) auto;align-items:center;gap:13px;margin-top:18px;padding:16px 17px;border:1px solid rgba(44,151,190,.16);border-radius:20px;background:linear-gradient(135deg,rgba(238,250,255,.92),rgba(247,251,255,.94));box-shadow:0 12px 34px rgba(29,112,144,.06); }
.support-telegram-icon { width:48px;height:48px;display:grid;place-items:center;border-radius:15px;color:#1988b0;background:linear-gradient(145deg,#e4f6ff,#eef3ff);border:1px solid rgba(25,136,176,.09); }
.support-telegram-icon svg { width:29px;height:29px; }
.support-telegram-copy { min-width:0;display:grid;gap:3px; }
.support-telegram-copy .support-section-kicker { font-size:9px; }
.support-telegram-copy strong { color:#263742;font-size:14px;line-height:1.25;font-weight:800; }
.support-telegram-copy>span:last-child { color:#82919a;font-size:11px;line-height:1.45; }
.support-telegram-action { display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:40px;padding:0 15px;border:1px solid rgba(18,133,169,.08);border-radius:12px;background:linear-gradient(145deg,#1599ba,#137b9d);color:#fff;text-decoration:none;font:inherit;font-size:11px;font-weight:800;box-shadow:0 8px 18px rgba(19,123,157,.14);transition:transform .2s ease,filter .2s ease,box-shadow .2s ease; }
.support-telegram-action:hover { transform:translateY(-2px);filter:brightness(1.04);box-shadow:0 12px 24px rgba(19,123,157,.18); }
.support-telegram-action svg { width:16px;height:16px; }
.support-section-head { display:flex;align-items:flex-end;justify-content:space-between;gap:30px;margin:42px 2px 17px; }
.support-section-head h2 { margin:6px 0 7px;font-size:26px;letter-spacing:-.025em;color:var(--ink,#14202b); }
.support-section-head p { margin:0;max-width:650px;color:var(--muted,#667085);font-size:13px;line-height:1.65; }
.support-section-kicker { color:#178da8; }
.support-ai-card,.support-ticket-card { border:1px solid rgba(16,45,61,.09);border-radius:24px;background:rgba(255,255,255,.88);box-shadow:0 18px 55px rgba(20,39,53,.08);overflow:hidden;backdrop-filter:blur(12px); }
.support-ai-topline { min-height:48px;padding:0 18px;display:flex;align-items:center;gap:8px;border-bottom:1px solid rgba(16,45,61,.07);font-size:11px;font-weight:700;color:#52606d; }
.support-ai-status-dot { width:7px;height:7px;border-radius:50%;background:#22b983;box-shadow:0 0 0 4px rgba(34,185,131,.1); }
.support-ai-topline-spacer { flex:1; }
.support-ai-secure { display:inline-flex;align-items:center;gap:5px;color:#82909b;font-weight:600; }
.support-ai-secure svg { width:13px;height:13px; }
.support-ai-messages { height:390px;overflow:auto;padding:24px 22px;display:flex;flex-direction:column;gap:16px;scroll-behavior:smooth;background:linear-gradient(180deg,rgba(247,251,253,.86),rgba(251,252,253,.72)); }
.support-ai-message { display:flex;align-items:flex-end;gap:9px;max-width:min(78%,720px);animation:supportMessageIn .25s ease both; }
.support-ai-message.is-user { align-self:flex-start; }
.support-ai-message.is-ai { align-self:flex-end;flex-direction:row-reverse; }
[dir="rtl"] .support-ai-message.is-user { align-self:flex-end; }
[dir="rtl"] .support-ai-message.is-ai { align-self:flex-start; }
.support-ai-avatar { width:29px;height:29px;flex:0 0 29px;border-radius:10px;display:grid;place-items:center;color:#1689a4;background:linear-gradient(145deg,#e6f9fd,#fff4d9);border:1px solid rgba(20,137,164,.1); }
.support-ai-avatar svg { width:17px;height:17px; }
.support-ai-bubble { padding:11px 14px;border-radius:16px;line-height:1.65;font-size:13px;white-space:normal;overflow-wrap:anywhere; }
.support-ai-message.is-user .support-ai-bubble { border-bottom-left-radius:5px;background:#17394b;color:#fff;box-shadow:0 8px 22px rgba(17,54,72,.12); }
.support-ai-message.is-ai .support-ai-bubble { border-bottom-right-radius:5px;background:#fff;color:#273743;border:1px solid rgba(19,54,71,.08);box-shadow:0 8px 22px rgba(20,39,53,.055); }
[dir="rtl"] .support-ai-message.is-user .support-ai-bubble { border-bottom-left-radius:16px;border-bottom-right-radius:5px; }
[dir="rtl"] .support-ai-message.is-ai .support-ai-bubble { border-bottom-right-radius:16px;border-bottom-left-radius:5px; }
.support-ai-message.is-pending .support-ai-bubble { min-width:70px; }
.support-thinking { display:inline-flex;gap:4px;align-items:center;height:15px; }
.support-thinking i { width:5px;height:5px;border-radius:50%;background:#5d95a5;animation:supportDots 1.1s infinite ease-in-out; }
.support-thinking i:nth-child(2) { animation-delay:.15s }
.support-thinking i:nth-child(3) { animation-delay:.3s }
@keyframes supportDots {
    0%,60%,100% { opacity:.28;transform:translateY(0) }
    30% { opacity:1;transform:translateY(-3px) }
}
@keyframes supportMessageIn {
    from { opacity:0;transform:translateY(7px) }
    to { opacity:1;transform:none }
}
.support-ai-empty,.support-ticket-empty { height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;color:#63727d;padding:35px 20px; }
.support-ai-empty-icon,.support-ticket-empty-icon { width:54px;height:54px;border-radius:18px;display:grid;place-items:center;color:#158ca8;background:linear-gradient(145deg,#e8faff,#fff5dc);border:1px solid rgba(21,140,168,.09);margin-bottom:13px; }
.support-ai-empty-icon svg,.support-ticket-empty-icon svg { width:27px;height:27px; }
.support-ai-empty strong,.support-ticket-empty strong { font-size:15px;color:#263742; }
.support-ai-empty p,.support-ticket-empty p { max-width:420px;margin:7px 0 0;font-size:12px;line-height:1.6; }
.support-ticket-empty .support-primary-button { margin-top:20px; }
.support-ai-composer,.support-ticket-composer { display:flex;align-items:flex-end;gap:10px;margin:0 14px;padding:11px 0 10px;border-top:1px solid rgba(16,45,61,.07); }
.support-ai-composer textarea,.support-ticket-composer textarea { flex:1;min-width:0;resize:none;max-height:180px;border:0;outline:0;background:transparent;color:#1e303b;font:inherit;font-size:13px;line-height:1.55;padding:8px 7px; }
.support-ai-composer textarea::placeholder,.support-ticket-composer textarea::placeholder { color:#9aa7af; }
.support-send-button { width:42px;height:42px;flex:0 0 42px;display:grid;place-items:center;border:0;border-radius:13px;background:linear-gradient(145deg,#168ba7,#17657d);color:#fff;cursor:pointer;box-shadow:0 9px 20px rgba(23,101,125,.17);transition:transform .2s ease,filter .2s ease,opacity .2s ease; }
.support-send-button:hover { transform:translateY(-2px);filter:brightness(1.05); }
.support-send-button:disabled { opacity:.45;cursor:not-allowed;transform:none; }
.support-send-button.is-loading svg { animation:supportSendSpin 1s linear infinite; }
.support-send-button svg { width:18px;height:18px; }
@keyframes supportSendSpin {
    to { transform:rotate(360deg) }
}
.support-ai-footer { display:flex;align-items:center;justify-content:space-between;gap:16px;padding:0 18px 13px;color:#96a2aa;font-size:10px; }
.support-ai-footer button,.support-quiet-button { border:0;background:transparent;color:#178ba7;font:inherit;font-size:11px;font-weight:750;cursor:pointer;padding:4px 0; }
.support-quiet-button { padding:7px 0;color:#667983; }
.support-quiet-button:hover,.support-ai-footer button:hover { color:#0d718b; }
.support-secondary-button { min-height:42px;padding:9px 16px;border:1px solid rgba(20,137,164,.16);border-radius:12px;background:linear-gradient(145deg,#ffffff,#f4fafc);color:#147f97;font:inherit;font-size:12px;font-weight:800;line-height:1.2;cursor:pointer;box-shadow:0 7px 16px rgba(20,87,108,.07);transition:transform .2s ease,background .2s ease,border-color .2s ease,color .2s ease,box-shadow .2s ease; }
.support-secondary-button:hover { transform:translateY(-1px);border-color:rgba(20,137,164,.30);background:#f8fdff;color:#0e718a;box-shadow:0 10px 20px rgba(20,87,108,.10); }
.support-secondary-button:active { transform:none; }
.support-secondary-button:disabled { opacity:.5;cursor:not-allowed;transform:none; }
.support-primary-button { border:1px solid rgba(24,125,151,.12);border-radius:12px;padding:10px 14px;background:linear-gradient(145deg,#168ca8,#126d86);color:#fff;font:inherit;font-size:12px;font-weight:800;cursor:pointer;box-shadow:0 9px 20px rgba(23,109,134,.12);transition:transform .2s ease,filter .2s ease,opacity .2s ease; }
.support-primary-button:hover { transform:translateY(-2px);filter:brightness(1.04); }
.support-primary-button:disabled { opacity:.5;cursor:not-allowed;transform:none; }
/* Ticket Center list */
.support-ticket-section { margin-top:18px; }
.support-ticket-header-box { margin:0;min-height:0;padding:0;overflow:hidden;border-bottom:1px solid rgba(16,45,61,.07); }
.support-ticket-header-box .support-ticket-head { margin:0;padding:11px 22px 10px;align-items:center;gap:14px; }
.support-ticket-head-title { display:flex;align-items:center;gap:13px;min-width:0; }
.support-ticket-head-icon { width:34px;height:34px;flex:0 0 34px;display:grid;place-items:center;border-radius:11px;color:#1593ad;background:linear-gradient(145deg,#e7faff,#fff6dd);border:1px solid rgba(21,147,173,.10); }
.support-ticket-head-icon svg { width:19px;height:19px; }
.support-ticket-header-box .support-ticket-head>div { min-width:0; }
.support-ticket-header-box .support-ticket-head h2 { margin:0 0 5px; }
.support-ticket-title-eyebrow { display:block;color:#263742;font-family:inherit;font-size:15px;line-height:1.2;font-style:normal;font-weight:700;letter-spacing:-.005em;text-transform:none; }
.support-ticket-header-box .support-ticket-head p { max-width:760px;margin:2px 0 0;color:#697780;font-size:10.5px;line-height:1.45; }
.support-ticket-toolbar { display:flex;align-items:center;justify-content:space-between;gap:16px;padding:16px 22px 14px;border-bottom:1px solid rgba(16,45,61,.07);background:rgba(250,252,253,.72); }
.support-ticket-toolbar-actions { display:flex;align-items:center;justify-content:flex-end;gap:9px;min-width:0;flex:1 1 auto;overflow-x:auto;scrollbar-width:none; }
.support-ticket-toolbar-actions::-webkit-scrollbar { display:none; }
.support-ticket-search { width:min(310px,100%);height:42px;display:flex;align-items:center;gap:9px;padding:0 12px;border:1px solid rgba(16,45,61,.11);border-radius:12px;background:#f8fafc;color:#9aa8b0;box-shadow:inset 0 1px 0 rgba(255,255,255,.7); }
.support-ticket-search:focus-within { border-color:rgba(20,137,164,.38);box-shadow:0 0 0 4px rgba(20,137,164,.07);background:#fff; }
.support-ticket-search svg { width:18px;height:18px;flex:0 0 18px; }
.support-ticket-search input { width:100%;min-width:0;border:0;outline:0;background:transparent;color:#263742;font:inherit;font-size:12px; }
.support-ticket-search input::placeholder { color:#9aa8b0; }
.support-ticket-filters { display:flex;align-items:center;justify-content:flex-end;gap:7px;min-width:max-content;padding:2px; }
.support-ticket-filter { min-height:36px;flex:0 0 auto;padding:7px 12px;border:1px solid rgba(16,45,61,.11);border-radius:10px;background:#fff;color:#65747d;font:inherit;font-size:10.5px;font-weight:750;cursor:pointer;transition:color .18s ease,border-color .18s ease,background .18s ease,box-shadow .18s ease,transform .18s ease; }
.support-ticket-create-button { min-height:36px;flex:1 1 auto;min-width:140px;padding:7px 13px;border-radius:10px;font-size:10.5px;font-weight:800;white-space:nowrap; }
.support-ticket-filter:hover { transform:translateY(-1px);border-color:rgba(20,137,164,.24);color:#178da8; }
.support-ticket-filter.is-active { color:#138aa5;border-color:#32b9cd;background:linear-gradient(145deg,#f2fdff,#fff);box-shadow:0 0 0 2px rgba(50,185,205,.08); }
.support-ticket-table { min-width:0; }
.support-ticket-table-head,.support-ticket-row { display:grid;grid-template-columns:88px minmax(180px,1fr) 92px 138px 52px;align-items:center;column-gap:14px; }
.support-ticket-table-head { min-height:44px;padding:0 22px;background:#f2f5fa;color:#8495a0;font-size:9px;font-weight:850;letter-spacing:.12em;text-transform:uppercase; }
.support-ticket-table-head>span:nth-child(3) { text-align:center; }
.support-ticket-list { padding:0 10px; }
.support-ticket-row { width:100%;min-height:62px;padding:11px 12px;border:0;border-bottom:1px solid rgba(16,45,61,.065);border-radius:0;background:transparent;color:inherit;text-align:start;cursor:pointer;transition:background .18s ease,transform .18s ease; }
.support-ticket-row:last-child { border-bottom:0; }
.support-ticket-row:hover { background:#f7fbfc;transform:translateX(2px); }
[dir="rtl"] .support-ticket-row { text-align:right; }
[dir="rtl"] .support-ticket-row:hover { transform:translateX(-2px); }
.support-ticket-row[hidden] { display:none; }
.support-ticket-id { font-size:11px;font-weight:800;color:#7d8d97;white-space:nowrap; }
.support-ticket-subject { min-width:0;overflow-x:auto;overflow-y:hidden;white-space:nowrap;scrollbar-width:none;-ms-overflow-style:none; }
.support-ticket-subject::-webkit-scrollbar { display:none; }
.support-ticket-subject strong { display:inline-block;min-width:100%;color:#263742;font-size:13px;font-weight:750; }
.support-ticket-row[data-status="closed"] .support-ticket-subject strong { font-weight:400; }
.support-ticket-status { display:inline-flex;align-items:center;justify-content:center;justify-self:center;min-width:76px;padding:6px 9px;border-radius:999px;font-size:9.5px;font-weight:800;background:#eef3f5;color:#66757e;white-space:nowrap; }
.support-ticket-status.is-open { background:#e8f6ff;color:#17769b; }
.support-ticket-status.is-pending { background:#fff4df;color:#a36c11; }
.support-ticket-status.is-answered { background:#e7f8f0;color:#14825d; }
.support-ticket-status.is-closed { background:#eef0f2;color:#68747d; }
.support-ticket-updated { min-width:0;color:#8b989f;font-size:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis; }
.support-ticket-view { width:32px;height:32px;display:grid;place-items:center;justify-self:end;border-radius:10px;color:#1594ae;background:#e9faff;transition:transform .18s ease,background .18s ease; }
.support-ticket-view svg { width:16px;height:16px; }
[dir="rtl"] .support-ticket-view { transform:rotate(180deg); }
.support-ticket-row:hover .support-ticket-view { transform:translateX(2px) rotate(0deg); background: #dff6fb; }
[dir="rtl"] .support-ticket-row:hover .support-ticket-view { transform:translateX(-2px) rotate(180deg); }
.support-ticket-no-results { padding:35px 20px;text-align:center;color:#7a8991;font-size:12px; }
.support-ticket-guest { min-height:250px;display:grid;place-items:center;padding:36px 24px;text-align:center;background:linear-gradient(180deg,#fbfdff,#f7fafc); }
.support-ticket-guest-inner { max-width:430px; }
.support-ticket-guest-icon { width:54px;height:54px;margin:0 auto 13px;display:grid;place-items:center;border-radius:17px;color:#2563eb;background:linear-gradient(145deg,#eaf2ff,#f5f8ff);border:1px solid rgba(37,99,235,.10);box-shadow:0 10px 24px rgba(37,99,235,.08); }
.support-ticket-guest-icon svg { width:25px;height:25px; }
.support-ticket-guest strong { display:block;color:#263742;font-size:15px;font-weight:800; }
.support-ticket-guest p { margin:7px auto 16px;color:#71808a;font-size:11px;line-height:1.65; }
.support-ticket-guest .support-primary-button { min-width:170px;display:inline-flex;align-items:center;justify-content:center;text-decoration:none; }
.support-ticket-workspace { position:relative;background:linear-gradient(180deg,#fbfdfe,#f7fafb); }
.support-ticket-workspace-head { display:grid;grid-template-columns:1fr minmax(160px,1.8fr) 1fr;align-items:center;gap:15px;padding:15px 18px;border-bottom:1px solid rgba(16,45,61,.07); }
.support-back-button { justify-self:start;border:0;background:transparent;color:#5f707b;font:inherit;font-size:11px;font-weight:750;display:inline-flex;align-items:center;gap:5px;cursor:pointer;padding:5px 0; }
.support-back-button svg { width:16px;height:16px; }
.support-ticket-workspace-title { text-align:center;min-width:0; }
.support-ticket-workspace-title h3 { margin:5px 0 0;color:#263742;font-size:15px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }
.support-ticket-workspace-head>.support-ticket-status { justify-self:end; }
.support-ticket-state-actions { position:absolute;inset-inline-end:110px;top:25px;z-index:2;align-items:center;gap:8px;padding:0; }
.support-ticket-messages { height:390px;overflow:auto;padding:22px;display:flex;flex-direction:column;gap:14px; }
.support-ticket-message { display:flex;align-items:flex-end;gap:8px;max-width:min(76%,680px);animation:supportMessageIn .22s ease both; }
.support-ticket-message.is-user { align-self:flex-start;flex-direction:column;align-items:flex-start; }
.support-ticket-message.is-support { align-self:flex-end;flex-direction:column;align-items:flex-end; }
[dir="rtl"] .support-ticket-message.is-user { align-self:flex-end;align-items:flex-end; }
[dir="rtl"] .support-ticket-message.is-support { align-self:flex-start;align-items:flex-start; }
.support-ticket-bubble { padding:10px 13px;border-radius:15px;font-size:12.5px;line-height:1.65;overflow-wrap:anywhere; }
.support-ticket-message.is-user .support-ticket-bubble { background:#fff;border:1px solid rgba(17,53,71,.08);color:#30414b;border-bottom-left-radius:4px; }
.support-ticket-message.is-support .support-ticket-bubble { background:#17394b;color:#fff;border-bottom-right-radius:4px;box-shadow:0 8px 20px rgba(17,54,72,.1); }
[dir="rtl"] .support-ticket-message.is-user .support-ticket-bubble { border-bottom-left-radius:15px;border-bottom-right-radius:4px; }
[dir="rtl"] .support-ticket-message.is-support .support-ticket-bubble { border-bottom-right-radius:15px;border-bottom-left-radius:4px; }
.support-ticket-message time { font-size:9px;color:#9aa5ac;padding:0 3px; }
.support-ticket-loading { height:100%;min-height:170px;display:grid;place-items:center;grid-auto-flow:column;align-content:center;gap:5px; }
.support-ticket-loading span { width:6px;height:6px;border-radius:50%;background:#6f9aaa;animation:supportDots 1.1s infinite ease-in-out; }
.support-ticket-loading span:nth-child(2) { animation-delay:.15s }
.support-ticket-loading span:nth-child(3) { animation-delay:.3s }
.support-ticket-error { text-align:center;color:#a24b43;font-size:12px;padding:50px 20px; }
.support-modal[hidden] { display:none; }
.support-modal { position:fixed;inset:0;z-index:1000;display:grid;place-items:center;padding:20px;opacity:0;transition:opacity .18s ease; }
.support-modal.is-open { opacity:1; }
.support-modal-backdrop { position:absolute;inset:0;background:rgba(9,28,39,.48);backdrop-filter:blur(5px); }
.support-modal-card { position:relative;width:min(520px,100%);border:1px solid rgba(16,45,61,.09);border-radius:22px;background:#fff;box-shadow:0 30px 90px rgba(9,28,39,.22);padding:25px;transform:translateY(8px);transition:transform .2s ease; }
.support-modal.is-open .support-modal-card { transform:none; }
.support-modal-head { display:flex;justify-content:space-between;gap:20px;align-items:flex-start;margin-bottom:20px; }
.support-modal-head h2 { margin:6px 0 0;color:#263742;font-size:23px;letter-spacing:-.025em; }
.support-modal-close { width:34px;height:34px;border:0;border-radius:10px;background:#f2f5f6;color:#65747d;font-size:22px;line-height:1;cursor:pointer; }
.support-modal-card form { display:grid;gap:15px; }
.support-modal-card label { display:grid;gap:7px; }
.support-priority-field select { appearance:auto; }
.support-modal-card label>span { font-size:11px;font-weight:800;color:#51636e; }
.support-modal-card input,.support-modal-card select,.support-modal-card textarea { width:100%;box-sizing:border-box;border:1px solid rgba(16,45,61,.11);border-radius:12px;background:#f9fbfc;color:#23353f;font:inherit;font-size:13px;outline:none;padding:11px 12px;transition:border-color .2s ease,box-shadow .2s ease,background .2s ease; }
.support-modal-card textarea { resize:vertical;min-height:130px; }
.support-modal-card input:focus,.support-modal-card select:focus,.support-modal-card textarea:focus { border-color:rgba(20,137,164,.45);box-shadow:0 0 0 4px rgba(20,137,164,.08);background:#fff; }
.support-modal-error { min-height:16px;margin:0;color:#ad4d42;font-size:11px; }
[dir="rtl"] .support-hero { text-align:right; }
[dir="rtl"] .support-ticket-workspace-title { text-align:center; }
@media (min-width:821px) {
    .support-ticket-state-actions .support-secondary-button { min-height:28px;height:28px;padding:5px 12px;font-size:9.5px;line-height:1.1; }
}
@media (max-width:820px) {
    .support-shell { width:min(100% - 24px,680px);padding-top:10px; }
    .support-hero { padding:20px 25px;border-radius:24px; }
    .support-hero-art { position:absolute;right:-12px;bottom:-20px;opacity:.9;transform:scale(.72); }
    [dir="rtl"] .support-hero-art { right:auto;left:12px; }
    .support-section-head { align-items:flex-start;flex-direction:column;gap:13px;margin-top:32px; }
    .support-section-head .support-primary-button,.support-section-head .support-quiet-button { align-self:flex-start; }
    .support-benefits { grid-template-columns:1fr;gap:11px;margin-top:15px; }
    .support-benefit-card { padding:15px 16px;border-radius:18px; }
    .support-benefit-icon { width:48px;height:48px;flex-basis:48px;border-radius:15px; }
    .support-telegram-card { margin-top:14px;padding:15px 16px;border-radius:18px;align-items:center; }
    .support-telegram-action { padding:0 14px; }
    .support-ticket-section { margin-top:16px; }
    .support-ticket-header-box { margin-top:0;margin-bottom:0; }
    .support-ticket-header-box .support-ticket-head { margin:0;padding:11px 18px 10px; }
    .support-ticket-toolbar { align-items:stretch;flex-direction:column;gap:10px;padding:13px 15px; }
    .support-ticket-search { width:100%; }
    .support-ticket-toolbar-actions { justify-content:flex-start;overflow-x:auto;overflow-y:hidden;width:100%;gap:8px;scrollbar-width:none; }
    .support-ticket-toolbar-actions::-webkit-scrollbar { display:none; }
    .support-ticket-filters { justify-content:flex-start;flex:1 1 auto;min-width:0;overflow-x:auto;scrollbar-width:none; }
    .support-ticket-filters::-webkit-scrollbar { display:none; }
    .support-ticket-create-button { min-width:auto;width:auto;max-width:160px; }
    .support-ticket-table-head,.support-ticket-row { grid-template-columns:55px minmax(150px,1fr) 72px 96px 38px;column-gap:9px; }
    .support-ticket-table-head { padding:0 13px;font-size:8px; }
    .support-ticket-list { padding:0 6px; }
    .support-ticket-row { padding:10px 7px; }
    .support-ticket-updated { font-size:9px; }
    .support-ticket-view { width:29px;height:29px;border-radius:9px; }
    .support-ticket-head-icon { width:35px;height:35px;flex-basis:35px; }
    .support-ticket-state-actions { position:static;inset-inline-end:auto;top:auto;z-index:auto;padding:0 15px 12px;justify-content:stretch; }
    .support-ticket-state-actions .support-secondary-button { flex:1; }
    .support-ai-messages,.support-ticket-messages { height:350px;padding:18px 15px; }
    .support-ai-message,.support-ticket-message { max-width:88%; }
    .support-ticket-workspace-head { grid-template-columns:1fr auto; }
    .support-ticket-workspace-title { text-align:start;grid-column:1 / -1;grid-row:1; }
    .support-back-button { grid-column:1;grid-row:2; }
    .support-ticket-workspace-head>.support-ticket-status { grid-column:2;grid-row:2; }
}
@media (max-width:560px) {
    .support-shell { width:calc(100% - 16px);padding-bottom:55px; }
    .support-hero { padding:18px 24px;border-radius:21px; }
    .support-hero h1 { font-size:34px;max-width:320px; }
    .support-hero p { font-size:13px;max-width:330px; }
    [dir="rtl"] .support-hero-art { left:-4px; }
    .support-section-head h2 { font-size:22px; }
    .support-ai-card,.support-ticket-card { border-radius:19px; }
    .support-telegram-card { display:grid;grid-template-columns:48px minmax(0,1fr);gap:12px; }
    .support-ticket-section { margin-top:16px; }
    .support-telegram-action { grid-column:1 / -1;width:100%;margin:2px 0 0; }
    .support-hero-art { right:-4px;bottom:-2px;transform:scale(.56); }
    .support-ai-messages,.support-ticket-messages { height:330px;padding:15px 11px; }
    .support-ai-message,.support-ticket-message { max-width:94%; }
    .support-ai-footer { align-items:flex-start;flex-direction:column;gap:4px;padding-bottom:11px; }
    .support-ticket-table-head,.support-ticket-row { grid-template-columns:48px minmax(130px,1fr) 68px 88px 34px;column-gap:7px; }
    .support-ticket-table-head { padding:0 9px;font-size:7.5px;letter-spacing:.08em; }
    .support-ticket-list { padding:0 4px; }
    .support-ticket-row { padding:10px 5px;min-height:58px; }
    .support-ticket-status { min-width:58px;padding:5px 5px;font-size:8px; }
    .support-ticket-id { font-size:9.5px; }
    .support-ticket-subject strong { font-size:11.5px; }
    .support-ticket-updated { font-size:8.5px; }
    .support-ticket-view { width:27px;height:27px; }
    .support-ticket-workspace-head { padding:13px 13px; }
    .support-ticket-header-box .support-ticket-head { padding:10px 14px 9px;gap:10px; }
    .support-ticket-title-eyebrow { font-size:12px;line-height:1; }
    .support-ticket-header-box .support-ticket-head p { font-size:10.5px;line-height:1; }
    .support-ticket-state-actions { display:grid;grid-template-columns:1fr;gap:8px;padding:0 11px 11px; }
    .support-ticket-state-actions .support-secondary-button { width:100%; }
    .support-modal { padding:10px; }
    .support-modal-card { padding:20px;border-radius:19px; }
}
/* ================================================================
   Global AI Support - floating website assistant
   ================================================================ */
.support-float { position:fixed;inset-inline-end:30px;bottom:calc(30px + var(--support-float-footer-offset, 0px));z-index:1200;pointer-events:none;font-family:inherit;transition:inset-inline-end .2s ease,bottom .2s ease; }
.support-float-launcher { position:relative;pointer-events:auto;width:72px;height:72px;padding:0;border:0;border-radius:50%;display:grid;place-items:center;background:transparent;color:#fff;box-shadow:none;cursor:pointer;overflow:visible;transition:transform .28s cubic-bezier(.2,.75,.25,1),filter .28s ease; }
.support-float-launcher:hover { transform:translateY(-3px);filter:drop-shadow(0 9px 12px rgba(20,45,70,.18)); }
.support-float-launcher:active { transform:translateY(-1px) scale(.97); }
.support-float-launcher-icon { position:relative;z-index:2;width:72px;height:72px;display:block;transition:transform .24s ease,opacity .2s ease; }
.support-float-launcher-chat { width:72px;height:72px;background-image:url("/assets/ai.chat.sprite.webp");background-repeat:no-repeat;background-size:216px 72px;background-position:0 0;transform:scaleX(-1);transform-origin:center; }
.support-float-launcher.is-blinking .support-float-launcher-chat { background-position:-72px 0; }
.support-float-launcher.is-activating .support-float-launcher-chat,.support-float-launcher.is-open .support-float-launcher-chat { background-position:-144px 0;animation:supportFloatRobotPop .42s ease both; }
[dir="rtl"] .support-float-launcher-chat { transform:none; }
@keyframes supportFloatRobotPop {
    0% { scale:1; }
    35% { scale:1.08; }
    100% { scale:1; }
}
.support-float-launcher-close { display:none!important; }
.support-float-launcher.is-open .support-float-launcher-chat { opacity:1;transform:scaleX(-1); }
[dir="rtl"] .support-float-launcher.is-open .support-float-launcher-chat { transform:none; }
.support-float-launcher-glow { display:none; }
.support-float-panel { pointer-events:auto;position:absolute;inset-inline-end:0;bottom:82px;width:min(390px,calc(100vw - 28px));height:min(600px,calc(100vh - 112px));min-height:390px;display:flex;flex-direction:column;overflow:hidden;border:1px solid rgba(17,58,76,.12);border-radius:24px;background:rgba(249,252,253,.97);box-shadow:0 30px 90px rgba(8,38,53,.25),0 8px 25px rgba(10,52,68,.12);backdrop-filter:blur(20px);opacity:0;visibility:hidden;transform:translateY(18px) scale(.96);transform-origin:bottom right;transition:opacity .22s ease,transform .28s cubic-bezier(.2,.75,.25,1),visibility .22s ease; }
.support-float-panel.is-open { opacity:1;visibility:visible;transform:none; }
[dir="rtl"] .support-float-panel { transform-origin:bottom left; }
.support-float-head { position:relative;display:flex;align-items:center;gap:11px;min-height:82px;padding:14px 14px 13px;color:#fff;background:linear-gradient(135deg,#102d3e 0%,#15546a 57%,#116f84 100%);overflow:hidden; }
.support-float-head::after { content:"";position:absolute;width:170px;height:170px;right:-75px;top:-90px;border-radius:50%;background:radial-gradient(circle,rgba(255,218,115,.28),rgba(255,218,115,0) 68%);pointer-events:none; }
.support-float-head-art { position:relative;z-index:1;flex:0 0 43px;width:43px;height:43px;border-radius:14px;display:grid;place-items:center;color:#fff3c3;background:linear-gradient(145deg,rgba(255,255,255,.13),rgba(255,218,115,.13));border:1px solid rgba(255,255,255,.16);box-shadow:inset 0 0 0 5px rgba(255,255,255,.025); }
.support-float-head-art svg { width:25px;height:25px; }
.support-float-head-art span { position:absolute;right:-1px;top:-1px;width:8px;height:8px;border-radius:50%;background:#55e0aa;box-shadow:0 0 0 4px rgba(85,224,170,.12); }
.support-float-head-copy { position:relative;z-index:1;min-width:0;display:grid;gap:2px; }
.support-float-kicker { font-size:8px;letter-spacing:.17em;font-weight:850;color:#8be5ee; }
.support-float-head-copy strong { font-size:16px;line-height:1.15;letter-spacing:-.02em; }
.support-float-head-copy>span:last-child { max-width:280px;color:rgba(237,248,250,.7);font-size:10px;line-height:1.45;overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }
.support-float-new { position:relative;z-index:2;margin-inline-start:auto;flex:0 0 31px;width:31px;height:31px;border:1px solid rgba(255,255,255,.16);border-radius:10px;display:grid;place-items:center;background:rgba(255,255,255,.07);color:rgba(255,255,255,.82);cursor:pointer;transition:background .2s ease,transform .2s ease,color .2s ease; }
.support-float-new:hover { background:rgba(255,255,255,.15);color:#fff;transform:rotate(90deg); }
.support-float-new svg { width:16px;height:16px; }
.support-float-messages { flex:1;min-height:0;overflow:auto;padding:17px 14px 13px;display:flex;flex-direction:column;gap:12px;scroll-behavior:smooth;background:linear-gradient(180deg,rgba(246,251,253,.95),rgba(251,252,253,.88)); }
.support-float-messages::-webkit-scrollbar { width:5px; }
.support-float-messages::-webkit-scrollbar-thumb { border-radius:99px;background:rgba(56,105,121,.2); }
.support-float-message { display:flex;align-items:flex-end;gap:7px;max-width:88%;animation:supportFloatMessageIn .22s ease both; }
.support-float-message.is-user { align-self:flex-start; }
.support-float-message.is-ai { align-self:flex-end;flex-direction:row-reverse; }
[dir="rtl"] .support-float-message.is-user { align-self:flex-end; }
[dir="rtl"] .support-float-message.is-ai { align-self:flex-start; }
.support-float-avatar { width:25px;height:25px;flex:0 0 25px;border-radius:9px;display:grid;place-items:center;color:#5b50c7;background:linear-gradient(145deg,#eeebff,#f5f2ff);border:1px solid rgba(91,80,199,.10); }
.support-float-avatar svg { width:16px;height:16px; }
.support-float-bubble { padding:9px 12px;border-radius:15px;font-size:12px;line-height:1.65;overflow-wrap:anywhere;box-shadow:0 6px 18px rgba(15,47,61,.05); }
.support-float-message.is-user .support-float-bubble { background:#173d50;color:#fff;border-bottom-left-radius:4px; }
.support-float-message.is-ai .support-float-bubble { background:#fff;color:#2d414b;border:1px solid rgba(17,55,72,.08);border-bottom-right-radius:4px; }
[dir="rtl"] .support-float-message.is-user .support-float-bubble { border-bottom-left-radius:15px;border-bottom-right-radius:4px; }
[dir="rtl"] .support-float-message.is-ai .support-float-bubble { border-bottom-right-radius:15px;border-bottom-left-radius:4px; }
.support-float-message.is-pending .support-float-bubble { min-width:62px; }
.support-float-thinking { display:inline-flex;align-items:center;gap:4px;height:13px; }
.support-float-thinking i { width:6px;height:6px;border-radius:50%;background:#5d97a7;transform:translateY(0);animation:supportFloatDots .78s infinite cubic-bezier(.45,0,.55,1);will-change:transform,opacity; }
.support-float-thinking i:nth-child(2) { animation-delay:.13s }
.support-float-thinking i:nth-child(3) { animation-delay:.26s }
@keyframes supportFloatMessageIn {
    from { opacity:0;transform:translateY(7px) }
    to { opacity:1;transform:none }
}
@keyframes supportFloatDots {
    0%,55%,100% { opacity:.38;transform:translateY(0) }
    27% { opacity:1;transform:translateY(-5px) }
}
.support-float-empty { margin:auto;max-width:min(520px,100%);width:100%;text-align:center;color:#71818a;padding:18px 10px; }
.support-float-empty-icon { width:52px;height:52px;margin:0 auto 11px;border-radius:17px;display:grid;place-items:center;color:#5b50c7;background:linear-gradient(145deg,#eeebff,#f7f5ff);border:1px solid rgba(91,80,199,.09);box-shadow:0 10px 24px rgba(91,80,199,.07); }
.support-float-empty-icon svg { width:27px;height:27px; }
.support-float-empty strong { display:block;color:#2b404b;font-size:13px; }
.support-float-empty p { margin:6px auto 0;font-size:10.5px;line-height:1.65; }
.support-float-composer { display:flex;align-items:flex-end;gap:8px;margin:0 10px;padding:9px 0;border-top:1px solid rgba(16,45,61,.08); }
.support-float-composer textarea { flex:1;min-width:0;max-height:120px;resize:none;border:1px solid rgba(20,70,87,.08);border-radius:15px;background:#fff;color:#263943;font:inherit;font-size:12px;line-height:1.55;outline:none;padding:9px 11px;box-shadow:0 4px 12px rgba(17,54,72,.035);transition:border-color .2s ease,box-shadow .2s ease; }
.support-float-composer textarea:focus { border-color:rgba(91,80,199,.30);box-shadow:0 0 0 4px rgba(91,80,199,.07); }
.support-float-composer textarea::placeholder { color:#9aa8af; }
.support-float-send { width:40px;height:40px;flex:0 0 40px;display:grid;place-items:center;border:0;border-radius:13px;background:linear-gradient(145deg,#6758d9,#4f46b8);color:#fff;cursor:pointer;box-shadow:0 9px 20px rgba(79,70,184,.18);transition:transform .2s ease,filter .2s ease,opacity .2s ease; }
.support-float-send:hover { transform:translateY(-2px);filter:brightness(1.05); }
.support-float-send:disabled { opacity:.48;cursor:not-allowed;transform:none; }
.support-float-send.is-loading svg { animation:supportFloatSendSpin .9s linear infinite; }
.support-float-send svg { width:18px;height:18px; }
@keyframes supportFloatSendSpin {
    to { transform:rotate(360deg) }
}
.support-float-foot { display:flex;align-items:center;justify-content:space-between;gap:10px;padding:0 14px 11px;color:#9aa6ad;font-size:9px; }
.support-float-foot button { border:0;padding:2px 0;background:transparent;color:#5b50c7;font:inherit;font-size:10px;font-weight:800;cursor:pointer; }
.support-float-foot button:hover { color:#43389f; }
@media(max-width:560px) {
    .support-float { inset-inline-end:15px;bottom:calc(15px + var(--support-float-footer-offset, 0px)); }
    .support-float-launcher { width:50px;height:50px; }
    .support-float-launcher-icon,.support-float-launcher-chat { width:50px;height:50px; }
    .support-float-launcher-chat { background-size:150px 50px; }
    .support-float-launcher.is-blinking .support-float-launcher-chat { background-position:-50px 0; }
    .support-float-launcher.is-activating .support-float-launcher-chat,.support-float-launcher.is-open .support-float-launcher-chat { background-position:-100px 0; }
    .support-float-panel { inset-inline-end:0;bottom:72px;width:min(390px,calc(100vw - 20px));height:min(620px,calc(100vh - 96px));min-height:360px;border-radius:22px;transform-origin:bottom right; }
    .support-float-head { min-height:76px;padding:12px; }
    .support-float-messages { padding:14px 11px 11px; }
    .support-float-message { max-width:92%; }
    .support-float-composer { margin:0 9px; }
}

/* ================================================================
   VIPENVPN Dashboard - premium account command center
   ================================================================ */
.dashboard-page { background:linear-gradient(180deg,#f7f5ff 0%,#f5f7ff 34%,#fff 100%) }
.dashboard-shell { width:min(1180px,calc(100% - 36px));margin:0 auto;padding:12px 0 78px }
.dashboard-welcome { position:relative;overflow:hidden;display:flex;align-items:center;justify-content:space-between;gap:28px;min-height:130px;padding:18px 24px;border:1px solid rgba(76,48,142,.28);border-radius:24px;background:linear-gradient(115deg,#35206f 0%,#5b35a1 48%,#3b70c9 100%);box-shadow:0 20px 48px rgba(67,43,133,.24) }
.dashboard-welcome:before,.dashboard-welcome:after { content:"";position:absolute;border-radius:50%;pointer-events:none;filter:blur(2px) }
.dashboard-welcome:before { width:330px;height:330px;right:13%;top:-235px;background:radial-gradient(circle,rgba(205,181,255,.34),rgba(205,181,255,0) 70%) }
.dashboard-welcome:after { width:300px;height:300px;right:-70px;bottom:-230px;background:radial-gradient(circle,rgba(101,188,255,.30),rgba(101,188,255,0) 70%) }
.dashboard-welcome>div { position:relative;z-index:1 }
.dashboard-welcome h1 { margin:0 0 8px;color:#fff;font-size:clamp(28px,3.5vw,42px);line-height:1;letter-spacing:-.055em }
.dashboard-welcome p { max-width:650px;margin:0;color:rgba(255,255,255,.78);font-size:13px;line-height:1.6 }
.dashboard-account-state { display:flex;align-items:center;gap:10px;flex:0 0 auto;padding:10px 13px;border:1px solid rgba(255,255,255,.34);border-radius:14px;background:rgba(255,255,255,.13);box-shadow:0 9px 24px rgba(20,10,55,.16);backdrop-filter:blur(14px) }
.dashboard-account-state strong,.dashboard-account-state small { display:block }
.dashboard-account-state strong { color:#fff;font-size:11px }
.dashboard-account-state small { margin-top:2px;color:rgba(255,255,255,.68);font-size:9px }
.dashboard-state-dot { width:8px;height:8px;border-radius:50%;background:#67e0ae;box-shadow:0 0 0 4px rgba(103,224,174,.16) }
.dashboard-snapshot { margin-top:16px;padding:18px;border:1px solid #e0dced;border-radius:22px;background:linear-gradient(145deg,#fff 0%,#faf8ff 55%,#f7fbff 100%);box-shadow:0 14px 38px rgba(63,48,105,.08) }
.dashboard-section-head { margin-bottom:13px }
.dashboard-section-kicker { display:block;color:#697386;font-size:10px;font-weight:800;letter-spacing:.18em;line-height:1.3 }
.dashboard-stat-grid { display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:9px }
.dashboard-stat { position:relative;display:block;min-height:116px;padding:15px 16px 14px;border:1px solid #e6e4ee;border-radius:16px;background:linear-gradient(145deg,#fff 0%,#fbfaff 100%);text-decoration:none;transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease }
.dashboard-stat:nth-child(2) { background:linear-gradient(145deg,#fff 0%,#f4edff 100%);border-color:#e0d5f1 }
.dashboard-stat:nth-child(3) { background:linear-gradient(145deg,#fff 0%,#fff9ee 100%);border-color:#eee3d1 }
.dashboard-stat:nth-child(4) { background:linear-gradient(145deg,#fff 0%,#eef6ff 100%);border-color:#dbe7f5 }
.dashboard-stat:hover { transform:translateY(-2px);box-shadow:0 13px 28px rgba(49,39,85,.10);border-color:#d6d0e4 }
.dashboard-stat-label { display:block;color:#687386;font-size:10px;font-weight:750 }
.dashboard-stat strong { display:block;margin-top:12px;color:#111827;font-size:27px;line-height:1;letter-spacing:-.045em }
.dashboard-stat small { display:block;margin-top:7px;color:#9099a8;font-size:9px;line-height:1.35 }
.dashboard-stat-arrow { position:absolute;right:13px;bottom:11px;color:#7651bd;font-size:13px }
.dashboard-alert { display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:12px;margin-top:12px;padding:13px 15px;border:1px solid #eadfc3;border-radius:16px;background:linear-gradient(135deg,#fffaf0,#fffdf7);box-shadow:0 9px 22px rgba(131,91,21,.05) }
.dashboard-alert-icon { display:grid;place-items:center;width:31px;height:31px;border-radius:10px;background:#f3dfad;color:#6d4e09;font-size:12px;font-weight:850 }
.dashboard-alert strong,.dashboard-alert p { display:block }
.dashboard-alert strong { margin-top:3px;color:#3f3218;font-size:12px }
.dashboard-alert p { margin:2px 0 0;color:#7d6a43;font-size:10px;line-height:1.5 }
.dashboard-alert a { color:#4c20a8;font-size:10px;font-weight:750;text-decoration:none;white-space:nowrap }
.dashboard-main-grid { display:grid;grid-template-columns:minmax(0,1.55fr) minmax(300px,.75fr);gap:12px;margin-top:14px }
.dashboard-lower-grid { display:grid;grid-template-columns:minmax(0,1.55fr) minmax(300px,.75fr);gap:12px;margin-top:12px }
.dashboard-panel { min-width:0;padding:18px;border:1px solid #e3e1eb;border-radius:20px;background:linear-gradient(145deg,#fff 0%,#fcfbff 72%,#f8fbff 100%);box-shadow:0 12px 32px rgba(52,43,83,.07) }
.dashboard-main-grid .dashboard-panel:first-child { background:linear-gradient(145deg,#fff 0%,#fbf9ff 62%,#f6f9ff 100%) }
.dashboard-wallet-panel { background:linear-gradient(145deg,#fff 0%,#f6efff 56%,#f1f8ff 100%) }
.dashboard-lower-grid .dashboard-panel:first-child { background:linear-gradient(145deg,#fff 0%,#f7f9ff 100%) }
.dashboard-support-panel { background:linear-gradient(145deg,#fff 0%,#fff9ff 56%,#f3f8ff 100%) }
.dashboard-panel-head { display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:14px }
.dashboard-panel-head>a { margin-top:0;color:#667085;font-size:10px;font-weight:700;text-decoration:none;white-space:nowrap }
.dashboard-panel-head>a span { margin-inline-start:3px }
.dashboard-service-list { display:grid;border-top:1px solid rgba(224,226,235,.8) }
.dashboard-service-row { display:grid;grid-template-columns:34px minmax(0,1fr) minmax(0,1fr) minmax(0,2.25fr) max-content 14px;align-items:center;column-gap:18px;padding:12px 1px;border-bottom:1px solid rgba(224,226,235,.72);text-decoration:none;transition:background .15s ease }
.dashboard-service-row:hover { background:rgba(244,240,252,.55) }
.dashboard-service-icon { display:grid;place-items:center;width:32px;height:32px;border:1px solid #ded8eb;border-radius:10px;background:linear-gradient(145deg,#fff,#f3effa);box-shadow:inset 0 1px 0 #fff }
.dashboard-service-icon span { width:12px;height:12px;border:2px solid #75639a;border-radius:50% }
.dashboard-service-main strong,.dashboard-service-main small,.dashboard-service-meta strong,.dashboard-service-meta small { display:block }
.dashboard-service-main strong { color:#1a2233;font-size:11px;font-weight:800 }
.dashboard-service-main strong span { margin-inline-start:3px }
.dashboard-service-main small,.dashboard-service-meta small { margin-top:2px;color:#8a93a2;font-size:9px }
.dashboard-service-meta { text-align:start }
.dashboard-service-meta strong { color:#394254;font-size:9px;font-weight:750 }
.dashboard-service-usage { min-width:0;color:#687386;font-size:8px }
.dashboard-service-usage i { display:block;height:3px;margin-top:5px;overflow:hidden;border-radius:99px;background:#e9eaf1 }
.dashboard-service-usage i b { display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#7050b8,#438ed4) }
.dashboard-service-status { width:max-content;min-width:0;box-sizing:border-box;padding:5px 11px;border-radius:999px;background:#edf8f2;color:#18794e;font-size:8px;font-weight:800;white-space:nowrap }
.dashboard-service-status.is-attention { background:#fff3d7;color:#8a650d }
.dashboard-row-arrow { color:#8c7ab0;font-size:13px }
.dashboard-empty { padding:27px 10px;text-align:center }
.dashboard-empty strong { display:block;color:#1c2433;font-size:13px }
.dashboard-empty p { max-width:420px;margin:6px auto 14px;color:#7d8797;font-size:10px;line-height:1.65 }
.dashboard-empty-compact { padding:22px 10px }
.dashboard-primary-action { display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:37px;padding:0 14px;border:1px solid #ddd2ee;border-radius:11px;background:linear-gradient(135deg,#fbf8ff,#f0e8ff);color:#4c20a8;font-size:10px;font-weight:800;text-decoration:none;box-shadow:0 5px 14px rgba(76,32,168,.07) }
.dashboard-wallet-panel { display:flex;flex-direction:column }
.dashboard-wallet-grid { display:grid;grid-template-columns:1fr;gap:10px;padding:7px 0 14px }
.dashboard-wallet-item { border:1px solid rgba(220,214,235,.9);border-radius:13px;background:linear-gradient(145deg,rgba(255,255,255,.9),rgba(248,244,255,.86)) }
.dashboard-wallet-item span,.dashboard-wallet-item small { display:block;color:#818b9b;font-size:9px }
.dashboard-wallet-telegram small { margin-top:2px;color:#9290a0;font-size:8px }
.dashboard-wallet-action { width:100%;margin-top:auto }
.dashboard-wallet-note { display:flex;align-items:center;gap:5px;margin:9px 0 0;color:#7e8795;font-size:9px }
.dashboard-wallet-note span { color:#7350bd }
.dashboard-activity-head { display:grid;grid-template-columns:30px minmax(110px,1.2fr) minmax(65px,.55fr) minmax(82px,.75fr) auto auto;align-items:center;gap:10px;padding:0 0 8px;color:#98a0ad;font-size:7px;font-weight:800;letter-spacing:.11em }
.dashboard-activity-list { display:grid;border-top:1px solid rgba(224,226,235,.8) }
.dashboard-activity-row { display:grid;grid-template-columns:30px minmax(110px,1.2fr) minmax(65px,.55fr) minmax(82px,.75fr) auto auto;align-items:center;gap:10px;min-height:68px;border-bottom:1px solid rgba(224,226,235,.72);text-decoration:none;transition:background .15s ease }
.dashboard-activity-row:hover { background:rgba(244,240,252,.55) }
.dashboard-activity-icon { display:grid;place-items:center;width:28px;height:28px;border:1px solid #ddd8e8;border-radius:9px;background:linear-gradient(145deg,#fff,#f5f1fb);color:#7350bd;font-size:12px }
.dashboard-activity-main strong,.dashboard-activity-main small { display:block }
.dashboard-activity-main strong { color:#273044;font-size:10px;font-weight:800 }
.dashboard-activity-main small { margin-top:3px;color:#969eab;font-size:8px }
.dashboard-activity-gateway,.dashboard-activity-date { color:#7f8999;font-size:8px;white-space:nowrap }
.dashboard-activity-date { font-variant-numeric:tabular-nums }
.dashboard-activity-status { padding:4px 7px;border-radius:999px;font-size:7px;font-weight:800;white-space:nowrap }
.dashboard-activity-status.is-success { background:#edf8f2;color:#18794e }
.dashboard-activity-status.is-pending { background:#fff7df;color:#8a650d }
.dashboard-activity-status.is-failed { background:#fff0f0;color:#a33a3a }
.dashboard-activity-status.is-refunded { background:#f2effa;color:#6745a0 }
.dashboard-activity-status.is-neutral { background:#f1f3f6;color:#687386 }
.dashboard-activity-amount { color:#263044;font-size:10px;white-space:nowrap }
.dashboard-support-state { display:flex;align-items:flex-start;gap:10px;padding:4px 0 12px }
.dashboard-support-icon { display:grid;place-items:center;flex:0 0 34px;width:34px;height:34px;border-radius:11px;background:#edf8f2;color:#18794e;font-weight:850 }
.dashboard-support-state.is-attention .dashboard-support-icon { background:#fff2d8;color:#9a6c09 }
.dashboard-support-state strong { display:block;color:#273044;font-size:12px }
.dashboard-support-state p { margin:5px 0 0;color:#7e8795;font-size:10px;line-height:1.55 }
.dashboard-ticket-list { display:grid;margin:2px 0 13px;border-top:1px solid rgba(224,226,235,.8) }
.dashboard-ticket-row { display:grid;grid-template-columns:7px minmax(0,1fr) auto;align-items:center;gap:9px;min-height:48px;border-bottom:1px solid rgba(224,226,235,.72);text-decoration:none }
.dashboard-ticket-status { width:7px;height:7px;border-radius:50%;background:#a8b0bc }
.dashboard-ticket-status.is-answered { background:#6e4bb5;box-shadow:0 0 0 4px rgba(110,75,181,.08) }
.dashboard-ticket-status.is-pending { background:#d69a2d }
.dashboard-ticket-status.is-open { background:#29966c }
.dashboard-ticket-status.is-closed { background:#a8b0bc }
.dashboard-ticket-main strong,.dashboard-ticket-main small { display:block }
.dashboard-ticket-main strong { overflow:hidden;color:#30384a;font-size:9px;font-weight:800;text-overflow:ellipsis;white-space:nowrap }
.dashboard-ticket-main small { margin-top:2px;color:#929aaa;font-size:8px }
.dashboard-ticket-arrow { color:#8c7ab0;font-size:11px }
.dashboard-support-panel .dashboard-primary-action { width:100% }
@media(max-width:900px) {
    .dashboard-stat-grid { grid-template-columns:repeat(2,minmax(0,1fr)) }
    .dashboard-main-grid,.dashboard-lower-grid { grid-template-columns:1fr }
}
@media(max-width:650px) {
    .dashboard-shell { width:min(100% - 30px,560px);padding:10px 0 60px }
    .dashboard-welcome { display:block;min-height:0;padding:16px 18px;border-radius:18px }
    .dashboard-welcome h1 { font-size:25px }
    .dashboard-welcome p { font-size:12px;line-height:1.6 }
    .dashboard-account-state { width:max-content;margin-top:14px }
    .dashboard-snapshot { margin-top:12px;padding:14px;border-radius:18px }
    .dashboard-section-head { margin-bottom:10px }
    .dashboard-stat-grid { gap:7px }
    .dashboard-stat { min-height:108px;padding:13px;border-radius:14px }
    .dashboard-stat strong { margin-top:10px;font-size:24px }
    .dashboard-stat-arrow { right:11px;bottom:10px }
    .dashboard-alert { grid-template-columns:auto minmax(0,1fr);padding:12px }
    .dashboard-alert a { grid-column:2 }
    .dashboard-main-grid,.dashboard-lower-grid { gap:10px;margin-top:11px }
    .dashboard-panel { padding:15px;border-radius:18px }
    .dashboard-service-row { grid-template-columns:29px minmax(0,1fr) minmax(0,1fr) minmax(0,2.15fr) max-content 11px;column-gap:10px;padding:12px 0 }
    .dashboard-service-meta,.dashboard-service-usage { display:block }
    .dashboard-service-meta { text-align:start }
    .dashboard-service-meta strong { font-size:8px }
    .dashboard-service-meta small { font-size:7px }
    .dashboard-service-usage { font-size:7px }
    .dashboard-service-usage i { height:3px;margin-top:4px }
    .dashboard-service-main strong { font-size:10px }
    .dashboard-service-main small { font-size:8px }
    .dashboard-service-icon { width:29px;height:29px;border-radius:9px }
    .dashboard-service-status { font-size:7px;padding:5px 9px }
    .dashboard-activity-head { grid-template-columns:29px minmax(78px,1fr) 42px 58px 45px 50px;gap:5px;padding-bottom:7px;font-size:6px;letter-spacing:.08em }
    .dashboard-activity-head span:nth-child(1) { grid-column:2 }
    .dashboard-activity-head span:nth-child(2) { grid-column:3 }
    .dashboard-activity-head span:nth-child(3) { grid-column:4 }
    .dashboard-activity-head span:nth-child(4) { grid-column:5 }
    .dashboard-activity-head span:nth-child(5) { grid-column:6 }
    .dashboard-activity-row { grid-template-columns:29px minmax(78px,1fr) 42px 58px 45px 50px;gap:5px;min-height:68px }
    .dashboard-activity-gateway,.dashboard-activity-date { font-size:7px }
    .dashboard-activity-status { display:block;padding:3px 4px;font-size:6px;text-align:center }
    .dashboard-activity-amount { font-size:9px }
    .dashboard-wallet-item strong { font-size:27px }
    .dashboard-wallet-telegram strong { font-size:21px }
    .dashboard-ticket-row { min-height:46px }
}
@media(max-width:390px) {
    .dashboard-shell { width:calc(100% - 24px) }
    .dashboard-welcome h1 { font-size:22px }
    .dashboard-stat { min-height:102px;padding:12px 11px }
    .dashboard-stat strong { font-size:22px }
    .dashboard-stat-label { font-size:9px }
    .dashboard-panel { padding-inline:12px }
    .dashboard-service-row { grid-template-columns:27px minmax(0,1fr) minmax(0,1fr) minmax(0,2.05fr) max-content 9px;column-gap:7px }
    .dashboard-service-icon { width:27px;height:27px }
    .dashboard-service-status { font-size:6.5px;padding:5px 7px }
    .dashboard-service-main strong { font-size:9px }
    .dashboard-service-main small { font-size:7px }
    .dashboard-service-meta strong { font-size:7px }
    .dashboard-service-meta small { font-size:6.5px }
    .dashboard-service-usage { font-size:6.5px }
    .dashboard-activity-head { grid-template-columns:27px minmax(65px,1fr) 38px 52px 42px 47px;gap:4px;font-size:5.5px }
    .dashboard-activity-row { grid-template-columns:27px minmax(65px,1fr) 38px 52px 42px 47px;gap:4px }
    .dashboard-activity-icon { width:27px;height:27px }
    .dashboard-activity-main strong { font-size:8px }
    .dashboard-activity-main small { font-size:6.5px }
    .dashboard-activity-gateway,.dashboard-activity-date { font-size:6.5px }
    .dashboard-activity-status { font-size:5.5px;padding:3px }
    .dashboard-activity-amount { font-size:8px }
}
/* Dashboard refinement: compact mobile hero, balanced wallet values and aligned payments. */
.dashboard-stat-total-wallet { display:flex!important;align-items:baseline;justify-content:flex-start;gap:7px;text-align:left }
.dashboard-stat-total-wallet-number { display:inline-block;font-size:30px!important;font-weight:850!important;letter-spacing:-.05em!important;line-height:1!important;margin:0!important }
.dashboard-stat-total-wallet-currency { display:inline-block;font-size:22px!important;font-weight:500!important;letter-spacing:.01em!important;line-height:1!important;margin:0!important;color:#303746 }
.dashboard-wallet-grid.has-telegram { grid-template-columns:1fr;gap:8px }
.dashboard-wallet-item { display:grid;grid-template-columns:minmax(92px,38%) minmax(0,1fr);align-items:stretch;padding:0;overflow:hidden; min-width: 0; }
.dashboard-wallet-item span { display:flex;align-items:center;padding:11px 12px;background:rgba(112,80,184,.07);border-right:1px solid rgba(220,214,235,.95);color:#687386;font-size:9px;font-weight:750 }
.dashboard-wallet-item strong { display:flex;align-items:center;justify-content:flex-end;margin:0;padding:10px 12px;color:#161d2c;font-size:20px;line-height:1;letter-spacing:-.045em;font-weight:800;white-space:nowrap }
.dashboard-wallet-telegram { background:linear-gradient(145deg,rgba(255,255,255,.9),rgba(242,234,255,.9));border-color:#dcd0ef }
.dashboard-wallet-telegram strong { color:#33264e;font-size:20px }
.dashboard-activity-head,.dashboard-activity-row { grid-template-columns:30px minmax(96px,1.05fr) minmax(70px,.7fr) minmax(92px,.8fr) 74px minmax(76px,.65fr) }
.dashboard-activity-head span:nth-child(2) { grid-column:3 }
.dashboard-activity-head span:nth-child(3) { grid-column:4 }
.dashboard-activity-head span:nth-child(4) { grid-column:5 }
.dashboard-activity-gateway,.dashboard-activity-date,.dashboard-activity-status { text-align:center }
@media(max-width:650px) {
    .dashboard-account-state { display:none }
    .dashboard-welcome { padding-block:14px }
    .dashboard-activity-head,.dashboard-activity-row { grid-template-columns:29px minmax(82px,1fr) 48px 68px 48px 62px;gap:5px }
    .dashboard-stat-total-wallet-number { font-size:28px!important }
    .dashboard-stat-total-wallet-currency { font-size:20px!important }
    .dashboard-wallet-web strong,.dashboard-wallet-telegram strong { font-size:19px }
}
@media(max-width:390px) {
    .dashboard-stat-total-wallet-number { font-size:26px!important }
    .dashboard-stat-total-wallet-currency { font-size:19px!important }
    .dashboard-wallet-web strong,.dashboard-wallet-telegram strong { font-size:18px }
    .dashboard-activity-head,.dashboard-activity-row { grid-template-columns:27px minmax(68px,1fr) 43px 54px 43px 54px;gap:4px }
}
/* Dashboard recent payments: five equal-width columns */
.dashboard-activity-head, .dashboard-activity-row { grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 0; }
.dashboard-activity-head span { min-width: 0; text-align: center; }
.dashboard-activity-head span:first-child { grid-column: auto; text-align: left; }
.dashboard-activity-head span:nth-child(2), .dashboard-activity-head span:nth-child(3), .dashboard-activity-head span:nth-child(4) { grid-column: auto; text-align: center; }
.dashboard-activity-head span:nth-child(5) { grid-column: auto; text-align: right; }
.dashboard-activity-payment { min-width: 0; display: flex; align-items: center; gap: 10px; }
.dashboard-activity-gateway, .dashboard-activity-date, .dashboard-activity-status { min-width: 0; justify-self: center; text-align: center; }
.dashboard-activity-amount { min-width: 0; justify-self: end; text-align: right; }
@media (max-width: 650px) {
    .dashboard-activity-head, .dashboard-activity-row { gap: 0; }
    .dashboard-activity-head span:first-child { text-align: left; }
    .dashboard-activity-head span:nth-child(2), .dashboard-activity-head span:nth-child(3), .dashboard-activity-head span:nth-child(4) { text-align: center; }
    .dashboard-activity-head span:nth-child(5) { text-align: right; }
    .dashboard-activity-payment { gap: 6px; }
    .dashboard-activity-gateway, .dashboard-activity-date, .dashboard-activity-status { justify-self: center; text-align: center; }
    .dashboard-activity-amount { justify-self: end; text-align: right; }
}
@media (max-width: 390px) {
    .dashboard-activity-payment { gap: 4px; }
}
/* START: VIPENVPN Premium Black Header - isolated namespace */
.vp-premium-header-root { display: block; position: sticky; top: 0; z-index: 1000; width: 100%; max-width: none; margin: 0; padding: 0; box-sizing: border-box; background: transparent; border: 0; box-shadow: none; backdrop-filter: none; -webkit-backdrop-filter: none; }
.vp-premium-header-root, .vp-premium-header-root * { box-sizing: border-box; }
.vp-premium-header-root .vp-premium-header-bar { min-height: 76px; width: 100%; display: flex; flex-direction: row; align-items: center; gap: clamp(16px, 2vw, 30px); padding: 9px 22px; color: #f8fafc; background: linear-gradient(180deg, #292929 0%, #171717 100%); border-radius: 0 0 30px 30px; box-shadow: 0 8px 16px rgba(0, 0, 0, .75), 0 14px 26px rgba(0, 0, 0, .55); }
.vp-premium-header-root .vp-premium-header-menu-button { display: flex; order: 0; flex: 0 0 auto; width: 38px; height: 38px; padding: 7px; flex-direction: column; align-items: center; justify-content: center; gap: 4px; color: #fff; background: #343638; border: 1px solid rgba(255,255,255,.055); border-radius: 50%; box-shadow: inset 3px 3px 6px rgba(0,0,0,.72), inset -3px -3px 6px rgba(255,255,255,.075), 0 1px 2px rgba(0,0,0,.22); cursor: pointer; -webkit-tap-highlight-color: transparent; appearance: none; -webkit-appearance: none; outline: none; transition: background .16s ease, box-shadow .16s ease; }
.vp-premium-header-root .vp-premium-header-menu-button span { display: block; width: 19px; height: 2px; background: currentColor; border-radius: 2px; }
.vp-premium-header-root .vp-premium-header-brand { order: 1; flex: 0 0 auto; color: #fff; background: transparent !important; background-color: transparent !important; box-shadow: none !important; text-decoration: none; white-space: nowrap; font-size: clamp(22px, 2.4vw, 34px); line-height: 1; font-weight: 850; letter-spacing: -.055em; -webkit-tap-highlight-color: transparent; }
.vp-premium-header-root .vp-premium-header-brand:hover, .vp-premium-header-root .vp-premium-header-brand:focus, .vp-premium-header-root .vp-premium-header-brand:focus-visible, .vp-premium-header-root .vp-premium-header-brand:active { color: #fff; background: transparent !important; background-color: transparent !important; box-shadow: none !important; outline-color: transparent; }
.vp-premium-header-root .vp-premium-header-brand sup { color: #ff623c; letter-spacing: 0; margin-left: 2px; }
.vp-premium-header-root .vp-premium-header-links { order: 2; flex: 1 1 auto; min-width: 0; display: flex; align-items: center; justify-content: center; gap: clamp(12px, 2.2vw, 34px); }
.vp-premium-header-root .vp-premium-header-links a { position: relative; display: inline-flex; align-items: center; min-height: 38px; color: #bfc0c4; background: transparent; box-shadow: none; text-decoration: none; white-space: nowrap; font-size: clamp(13px, 1.55vw, 19px); font-weight: 500; transition: color .18s ease; -webkit-tap-highlight-color: transparent; }
.vp-premium-header-root .vp-premium-header-links a:hover, .vp-premium-header-root .vp-premium-header-links a:focus, .vp-premium-header-root .vp-premium-header-links a:focus-visible, .vp-premium-header-root .vp-premium-header-links a:active { color: #bfc0c4; background: transparent; background-color: transparent; box-shadow: none; outline-color: transparent; }
.vp-premium-header-root .vp-premium-header-links a.is-active, .vp-premium-header-root .vp-premium-header-links a.is-active:hover, .vp-premium-header-root .vp-premium-header-links a.is-active:focus, .vp-premium-header-root .vp-premium-header-links a.is-active:focus-visible, .vp-premium-header-root .vp-premium-header-links a.is-active:active { color: #fff; background: radial-gradient(ellipse at center, rgba(255,255,255,.12) 0%, rgba(255,255,255,.055) 58%, rgba(255,255,255,0) 100%); background-color: transparent; border-radius: 999px; box-shadow: 0 0 22px 5px rgba(255,255,255,.09), inset 0 0 10px rgba(255,255,255,.025); }
.vp-premium-header-root .vp-premium-header-links a.is-active::after { content: ""; position: absolute; left: 50%; bottom: -6px; width: 7px; height: 7px; border-radius: 50%; background: #ff623c; transform: translateX(-50%); }
.vp-premium-header-root .vp-premium-header-actions { order: 3; flex: 0 0 auto; display: flex; flex-direction: row; direction: ltr; align-items: center; gap: 8px; }
.vp-premium-header-root .vp-premium-header-account-button { order: 2; }
.vp-premium-header-root .vp-premium-header-profile { order: 2; }
.vp-premium-header-root .vp-premium-header-settings { order: 3; }
.vp-premium-header-root .vp-premium-header-logout { order: 4; color: #fff; background: #ff623c; box-shadow: inset 4px 4px 8px rgba(150,32,8,.48), inset -3px -3px 7px rgba(255,205,180,.24); }
.vp-premium-header-root .vp-premium-header-actions > .selectors { position: static; inset: auto; margin: 0; padding: 0; display: block; order: 1; }
.vp-premium-header-root .vp-premium-header-actions > .selectors .selector-form { display: flex; align-items: center; gap: 6px; }
.vp-premium-header-root .vp-premium-header-actions > .selectors .language-trigger, .vp-premium-header-root .vp-premium-header-actions > .selectors .currency-trigger { min-width: 38px; width: 38px; height: 38px; padding: 0; display: inline-flex; align-items: center; justify-content: center; gap: 4px; border: 1px solid rgba(255,255,255,.055); border-radius: 50%; color: #f8fafc; background: #343638; background-image: none; box-shadow: inset 3px 3px 6px rgba(0,0,0,.72), inset -3px -3px 6px rgba(255,255,255,.075), 0 1px 2px rgba(0,0,0,.22); font: inherit; cursor: pointer; -webkit-tap-highlight-color: transparent; appearance: none; -webkit-appearance: none; outline: none; transition: background .16s ease, box-shadow .16s ease; }
.vp-premium-header-root .vp-premium-header-control-icon { display: block; width: 20px; height: 20px; flex: 0 0 auto; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.vp-premium-header-root .language-trigger-code, .vp-premium-header-root .currency-trigger-code { display: none; }
.vp-premium-header-root .vp-premium-header-account-button, .vp-premium-header-root .vp-premium-header-logout { flex: 0 0 auto; width: 38px; min-width: 38px; height: 38px; display: inline-flex; align-items: center; justify-content: center; color: #f8fafc; background: #343638; background-image: none; border: 1px solid rgba(255,255,255,.055); box-shadow: inset 3px 3px 6px rgba(0,0,0,.72), inset -3px -3px 6px rgba(255,255,255,.075), 0 1px 2px rgba(0,0,0,.22); border-radius: 50%; text-decoration: none; -webkit-tap-highlight-color: transparent; appearance: none; -webkit-appearance: none; outline: none; transition: background .16s ease, box-shadow .16s ease; }
.vp-premium-header-root .vp-premium-header-menu-button:hover, .vp-premium-header-root .vp-premium-header-actions > .selectors .language-trigger:hover, .vp-premium-header-root .vp-premium-header-actions > .selectors .currency-trigger:hover, .vp-premium-header-root .vp-premium-header-account-button:hover { background: #303234; background-image: none; box-shadow: inset 4px 4px 8px rgba(0,0,0,.78), inset -2px -2px 5px rgba(255,255,255,.055); }
.vp-premium-header-root .vp-premium-header-menu-button:active, .vp-premium-header-root .vp-premium-header-actions > .selectors .language-trigger:active, .vp-premium-header-root .vp-premium-header-actions > .selectors .currency-trigger:active, .vp-premium-header-root .vp-premium-header-account-button:active { color: #fff; background: #191a1b !important; background-color: #191a1b !important; background-image: none !important; border-color: rgba(0,0,0,.3); box-shadow: inset 5px 5px 10px rgba(0,0,0,.9), inset -2px -2px 5px rgba(255,255,255,.025) !important; outline: none !important; }
.vp-premium-header-root .vp-premium-header-menu-button:focus, .vp-premium-header-root .vp-premium-header-menu-button:focus-visible, .vp-premium-header-root .vp-premium-header-actions > .selectors .language-trigger:focus, .vp-premium-header-root .vp-premium-header-actions > .selectors .language-trigger:focus-visible, .vp-premium-header-root .vp-premium-header-actions > .selectors .currency-trigger:focus, .vp-premium-header-root .vp-premium-header-actions > .selectors .currency-trigger:focus-visible, .vp-premium-header-root .vp-premium-header-account-button:focus, .vp-premium-header-root .vp-premium-header-account-button:focus-visible { outline: none !important; }
.vp-premium-header-root .vp-premium-header-logout, .vp-premium-header-root .vp-premium-header-logout:hover, .vp-premium-header-root .vp-premium-header-logout:focus, .vp-premium-header-root .vp-premium-header-logout:focus-visible, .vp-premium-header-root .vp-premium-header-logout:active { color: #fff; background: #ff623c !important; background-color: #ff623c !important; background-image: none !important; box-shadow: inset 4px 4px 8px rgba(150,32,8,.58), inset -3px -3px 7px rgba(255,200,178,.28) !important; outline: none !important; }
.vp-premium-header-root .vp-premium-header-account-button svg, .vp-premium-header-root .vp-premium-header-logout svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.vp-premium-header-root > .nav, .vp-premium-header-root > .menu-backdrop { z-index: 1002; }
@media (max-width: 1100px) {
    .vp-premium-header-root .vp-premium-header-bar { gap: 12px; padding-left: 16px; padding-right: 16px; }
    .vp-premium-header-root .vp-premium-header-links { gap: 11px; }
    .vp-premium-header-root .vp-premium-header-links a { font-size: 13px; }
    .vp-premium-header-root .vp-premium-header-brand { font-size: 25px; }
    .vp-premium-header-root .vp-premium-header-actions { gap: 6px; }
    .vp-premium-header-root .vp-premium-header-menu-button { width: 33px; min-width: 33px; height: 33px; }
    .vp-premium-header-root .vp-premium-header-actions > .selectors .language-trigger, .vp-premium-header-root .vp-premium-header-actions > .selectors .currency-trigger, .vp-premium-header-root .vp-premium-header-account-button, .vp-premium-header-root .vp-premium-header-logout { width: 33px; min-width: 33px; height: 33px; border-radius: 50%; }
    .vp-premium-header-root .vp-premium-header-control-icon, .vp-premium-header-root .vp-premium-header-account-button svg, .vp-premium-header-root .vp-premium-header-logout svg { width: 18px; height: 18px; }
}
@media (max-width: 820px) {
    .vp-premium-header-root .vp-premium-header-bar { min-height: 62px; padding: 8px 14px; gap: 10px; border-radius: 0 0 24px 24px; }
    .vp-premium-header-root .vp-premium-header-links { gap: 8px; }
    .vp-premium-header-root .vp-premium-header-links a { font-size: 12px; min-height: 33px; }
    .vp-premium-header-root .vp-premium-header-brand { font-size: 22px; }
}
@media (max-width: 680px) {
    .vp-premium-header-root .vp-premium-header-bar { min-height: 56px; padding: 8px 12px; gap: 7px; }
    .vp-premium-header-root .vp-premium-header-links { display: none; }
    .vp-premium-header-root .vp-premium-header-actions { margin-left: auto; gap: 5px; }
    .vp-premium-header-root .vp-premium-header-menu-button { display: flex; order: 0; width: 30px; min-width: 30px; height: 30px; padding: 4px; gap: 3px; }
    .vp-premium-header-root .vp-premium-header-menu-button span { width: 17px; }
    .vp-premium-header-root .vp-premium-header-account-button, .vp-premium-header-root .vp-premium-header-logout { display: inline-flex; width: 30px; min-width: 30px; height: 30px; }
    .vp-premium-header-root .vp-premium-header-actions > .selectors .language-trigger, .vp-premium-header-root .vp-premium-header-actions > .selectors .currency-trigger { width: 30px; min-width: 30px; height: 30px; }
    .vp-premium-header-root .vp-premium-header-control-icon, .vp-premium-header-root .vp-premium-header-account-button svg, .vp-premium-header-root .vp-premium-header-logout svg { width: 17px; height: 17px; }
}
/* END: VIPENVPN Premium Black Header - isolated namespace */
/* START: VIPENVPN Premium Single-Line Footer */
.site-footer, .site-footer * { box-sizing: border-box; }
.site-footer { width: 100%; margin: 0; padding: 0; color: #c5c6ca; background: linear-gradient(180deg, #292938 20%, #171701 80%); border: 0; box-shadow: none; border-radius: 0; font-size: 16px; line-height: 1.25; }
.site-footer .site-footer-inner { width: 100%; max-width: none; min-height: 68px; margin: 0 auto; padding: 12px clamp(20px, 4.8vw, 76px); display: flex; flex-flow: row nowrap; align-items: center; justify-content: space-between; gap: clamp(12px, 1.8vw, 28px); }
.site-footer .site-footer-main { display: contents; }
.site-footer .site-footer-main > div:first-child { flex: 0 0 auto; min-width: 0; }
.site-footer .site-footer-brand { display: inline-flex; align-items: flex-start; color: #fff; text-decoration: none; white-space: nowrap; font-size: clamp(22px, 2.5vw, 34px); line-height: 1; font-weight: 850; letter-spacing: -.055em; }
.site-footer .site-footer-brand:hover, .site-footer .site-footer-brand:focus, .site-footer .site-footer-brand:active { color: #fff; text-decoration: none; }
.site-footer .site-footer-brand-main { display: inline-block; position: relative; font-size: 0; line-height: 1; white-space: nowrap; }
.site-footer .site-footer-brand-main::before { content: "VIPENVPN"; display: inline; color: #fff; font-size: clamp(22px, 2.5vw, 34px); line-height: 1; }
.site-footer .site-footer-brand-main::after { content: "™"; display: inline-block; position: relative; margin-left: 2px; color: #ff623c; font-family: Arial, sans-serif; font-size: 18px; font-weight: 800; letter-spacing: 0; line-height: 1; vertical-align: top; opacity: 1; visibility: visible; }
.site-footer .site-footer-links { display: none; }
.site-footer .site-footer-bottom { display: contents; }
.site-footer .site-footer-bottom-primary { display: flex; flex: 1 1 auto; min-width: 0; align-items: center; gap: clamp(10px, 1.5vw, 24px); white-space: nowrap; }
.site-footer .site-footer-aws-note { color: #c5c6ca; font-weight: 500; }
.site-footer .site-footer-bottom-primary > span:nth-child(2) { color: #a9aaaf; font-weight: 400; white-space: nowrap; }
.site-footer .site-footer-meta { display: flex; flex: 0 0 auto; align-items: center; justify-content: flex-end; gap: clamp(10px, 1.4vw, 22px); margin: 0; padding: 0; white-space: nowrap; }
.site-footer .site-footer-meta > span { color: #ff795d; font-weight: 500; }
.site-footer .site-footer-meta > span:last-child { color: #bfc0c4; font-weight: 400; }
/* Responsive Footer */
@media (max-width: 900px) {
    .site-footer .site-footer-inner { min-height: 58px; padding: 9px 16px; gap: 9px; }
    .site-footer .site-footer-brand-main::before { font-size: 21px; }
    .site-footer .site-footer-brand-main::after { font-size: 10px; }
    .site-footer .site-footer-bottom-primary { gap: 7px; }
    .site-footer .site-footer-aws-note, .site-footer .site-footer-bottom-primary > span:nth-child(2), .site-footer .site-footer-meta { font-size: 12px; }
    .site-footer .site-footer-meta { gap: 8px; }
    .site-footer .site-footer-bottom-primary > span:nth-child(2) { display: none !important; visibility: hidden !important; }
}
@media (max-width: 600px) {
    .site-footer .site-footer-inner { min-height: 50px; padding: 7px 10px; gap: 6px; }
    .site-footer .site-footer-brand-main::before { font-size: 18px; }
    .site-footer .site-footer-brand-main::after { font-size: 9px; }
    .site-footer .site-footer-bottom-primary { gap: 4px; }
    .site-footer .site-footer-aws-note, .site-footer .site-footer-meta { font-size: 10px; }
    .site-footer .site-footer-meta { gap: 5px; }
}
@media (max-width: 430px) {
    .site-footer .site-footer-inner { min-height: 46px; padding: 6px 7px; gap: 4px; }
    .site-footer .site-footer-brand-main::before { font-size: 16px; letter-spacing: -.06em; }
    .site-footer .site-footer-brand-main::after { font-size: 8px; margin-left: 1px; }
    .site-footer .site-footer-bottom-primary { gap: 3px; }
    .site-footer .site-footer-aws-note, .site-footer .site-footer-meta { font-size: 9px; }
    .site-footer .site-footer-meta { gap: 3px; }
}
/* END: VIPENVPN Premium Single-Line Footer */
/* START: VIPENVPN User Settings Page */
.settings-body { background: #f5f7fa; }
.settings-page, .settings-page * { box-sizing: border-box; }
.settings-page { --settings-ink: #f4f6fb; --settings-muted: #b9c2d2; --settings-line: #343d50; --settings-orange: #ff8868; width: 100%; min-height: 60vh; padding: 12px 22px 58px; color: var(--settings-ink); }
.settings-shell { width: min(1120px, 100%); margin: 0 auto; }
.settings-hero { display: flex; align-items: center; justify-content: space-between; gap: 24px; margin: 0 0 24px; padding: 20px 24px; overflow: hidden; border: 1px solid #30394d; border-radius: 18px; background: linear-gradient(125deg,#171c2b 0%,#202a42 58%,#29334a 100%); box-shadow: 5px 8px 22px rgba(10,15,28,.2); }
.settings-hero-copy { min-width: 0; }
.settings-eyebrow { margin: 0 0 9px; color: #ffad91; font-size: 11px; font-weight: 800; letter-spacing: .16em; }
.settings-hero h1 { margin: 0; color: #ffffff; font-size: clamp(30px, 4vw, 42px); line-height: 1.12; font-weight: 800; letter-spacing: -.045em; }
.settings-hero-copy > p:last-child { max-width: 650px; margin: 12px 0 0; color: #c2cada; font-size: 14px; line-height: 1.7; }
.settings-hero-mark { display: grid; flex: 0 0 150px; width: 150px; height: 130px; place-items: center; overflow: hidden; border: 0; border-radius: 0; color: #d77c65; background: transparent; box-shadow: none; }
.settings-hero-mark svg { width: 150px; height: 130px; overflow: hidden; filter: drop-shadow(0 5px 7px rgba(0,0,0,.2)); }
.settings-alert { display: flex; align-items: center; gap: 11px; margin: 0 0 18px; padding: 13px 16px; border: 1px solid transparent; border-radius: 13px; font-size: 13px; line-height: 1.55; }
.settings-alert.is-success { color: #176947; border-color: #c8ead9; background: #effaf4; }
.settings-alert.is-error { color: #a52c2c; border-color: #f1cccc; background: #fff3f3; }
.settings-alert-icon { display: grid; flex: 0 0 23px; width: 23px; height: 23px; place-items: center; border-radius: 50%; background: #fff; font-weight: 800; }
.settings-account-strip { position: relative; display: flex; align-items: center; gap: 15px; min-width: 0; margin-bottom: 19px; padding: 18px 20px; border: 1px solid #e6e9ef; border-radius: 17px; background: linear-gradient(125deg,#fff,#f8f9fb); box-shadow: 6px 6px 16px #e3e6ec,-5px -5px 15px #fff; }
.settings-avatar { display: grid; flex: 0 0 48px; width: 48px; height: 48px; place-items: center; border: 1px solid #ffd1c5; border-radius: 15px; color: #e9502d; background: linear-gradient(145deg,#fff5f1,#ffe4dc); font-size: 20px; font-weight: 800; }
.settings-account-main { display: flex; flex: 1 1 auto; flex-direction: column; min-width: 0; gap: 4px; }
.settings-account-name { overflow: hidden; color: #202530; font-size: 15px; font-weight: 800; text-overflow: ellipsis; white-space: nowrap; }
.settings-account-email { overflow: hidden; color: #788191; font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.settings-account-badges { display: flex; flex: 0 0 auto; flex-direction: column; align-items: flex-end; gap: 7px; align-self: flex-start; margin-left: auto; }
.settings-status { display: inline-flex; align-items: center; gap: 7px; padding: 7px 11px; border: 1px solid #d6eadf; border-radius: 999px; color: #27744f; background: #e8f6ee; font-size: 11px; font-weight: 750; white-space: nowrap; }
.settings-status i { display: inline-block; width: 7px; height: 7px; border-radius: 50%; background: #9aa2af; }
.settings-status.is-good { border-color: #cde8d8; color: #24754d; background: #e8f6ee; }
.settings-status.is-good i { background: #20a36b; box-shadow: 0 0 0 3px #d7efdf; }
.settings-status.is-pending i, .settings-status.is-warning i { background: #e3a12c; box-shadow: 0 0 0 3px #fff3d9; }
.settings-member-since { color: #9098a5; font-size: 11px; }
.settings-quicknav { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 20px; }
.settings-quicknav a { display: inline-flex; align-items: center; min-height: 34px; padding: 7px 13px; border: 1px solid #e3e7ed; border-radius: 9px; color: #555f70; background: #f7f8fa; font-size: 12px; font-weight: 700; text-decoration: none; transition: border-color .18s ease,color .18s ease,background .18s ease; }
.settings-quicknav a:hover, .settings-quicknav a:focus-visible { border-color: #ffc2b3; color: #dc4e2c; background: #fff7f4; outline: none; }
.settings-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); align-items: start; gap: 18px; }
.settings-card { min-width: 0; padding: 23px; border: 1px solid #e5e8ee; border-radius: 17px; background: #fff; box-shadow: 5px 6px 18px rgba(31,42,61,.045); scroll-margin-top: 24px; }
.settings-card-wide { grid-column: 1 / -1; }
.settings-card-heading { display: flex; align-items: center; gap: 13px; margin-bottom: 22px; }
.settings-card-icon { display: grid; flex: 0 0 42px; width: 42px; height: 42px; place-items: center; border: 1px solid #f0e1dc; border-radius: 13px; color: #f15a38; background: linear-gradient(145deg,#fff8f5,#fff0ea); }
.settings-card-icon svg { width: 22px; height: 22px; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.settings-card-heading h2 { margin: 0; color: #202530; font-size: 17px; line-height: 1.3; font-weight: 800; letter-spacing: -.02em; }
.settings-card-heading p { margin: 5px 0 0; color: #818998; font-size: 12px; line-height: 1.5; }
.settings-form { display: flex; flex-direction: column; gap: 17px; }
.settings-field { display: grid; grid-template-columns: 150px minmax(0,1fr); align-items: start; min-width: 0; gap: 0; color: #4c5564; font-size: 12px; font-weight: 750; }
.settings-field > span { display: flex; align-self: start; align-items: center; min-height: 43px; height: 43px; box-sizing: border-box; padding: 0 10px; border: 1px solid #dfe3e9; border-right: 0; border-radius: 9px 0 0 9px; color: #4b5564; background: #e9ecf1; line-height: 1.35; }
.settings-field input, .settings-field select { display: block; width: 100%; min-width: 0; height: 43px; margin: 0; padding: 0 15px; border: 1px solid #dfe3e9; border-radius: 0 9px 9px 0; outline: none; color: #222936; background: #f7f8fa; box-shadow: inset 2px 2px 5px rgba(24,35,51,.045),inset -2px -2px 5px rgba(255,255,255,.9); font: inherit; font-size: 13px; font-weight: 500; transition: border-color .18s ease,box-shadow .18s ease,background .18s ease; }
.settings-field select { appearance: none; padding-right: 38px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%23747d8c' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 14px center; }
[dir="rtl"] .settings-field > span { border-right: 1px solid #dfe3e9; border-left: 0; border-radius: 0 9px 9px 0; }
[dir="rtl"] .settings-field input, [dir="rtl"] .settings-field select { border-radius: 9px 0 0 9px; }
[dir="rtl"] .settings-field select { padding-right: 12px; padding-left: 38px; background-position: left 14px center; }
.settings-field input:focus, .settings-field select:focus { border-color: #ff9b82; background: #fff; box-shadow: 0 0 0 3px rgba(255,98,60,.11); }
.settings-field.is-autosaved input, .settings-field.is-autosaved select { background-color: #e5f7e9; border-color: #9ddab4; box-shadow: 0 0 0 3px rgba(77,180,111,.16),inset 0 0 12px rgba(118,209,142,.14); }
.settings-toggle-row.is-autosaved { background: #e5f7e9; border-radius: 9px; box-shadow: 0 0 0 4px rgba(77,180,111,.12); }
.settings-field input[readonly] { color: #858d9a; background: #f1f3f6; cursor: default; }
.settings-field small { grid-column: 1 / -1; padding: 6px 2px 0; color: #9299a5; font-size: 11px; font-weight: 450; line-height: 1.55; }
.settings-form-actions { display: flex; justify-content: center; padding-top: 2px; }
.settings-button { display: inline-flex; align-items: center; justify-content: center; min-height: 40px; padding: 10px 16px; border: 1px solid transparent; border-radius: 9px; font-size: 12px; font-weight: 800; line-height: 1.2; cursor: pointer; transition: transform .16s ease,box-shadow .16s ease,background .16s ease; }
.settings-button-primary { border-color: #ed5837; color: #fff; background: linear-gradient(145deg,#ff704d,#f55331); box-shadow: 0 4px 10px rgba(239,85,52,.19),inset 0 1px 0 rgba(255,255,255,.2); }
.settings-button-primary:hover { background: linear-gradient(145deg,#f75d3b,#e94c2b); box-shadow: 0 5px 13px rgba(239,85,52,.24); transform: translateY(-1px); }
.settings-button:focus-visible { outline: 3px solid rgba(255,98,60,.25); outline-offset: 2px; }
.settings-email-health { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 14px; margin: -3px 0 18px; padding: 12px 14px; border: 1px solid #e9edf1; border-radius: 10px; background: #fafbfc; }
.settings-email-health > span:last-child { color: #7c8593; font-size: 11px; line-height: 1.55; }
.settings-email-form { gap: 15px; }
.settings-toggle-row { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 4px 0 8px; cursor: pointer; }
.settings-toggle-copy { display: flex; flex-direction: column; gap: 6px; }
.settings-toggle-copy strong { color: #343b48; font-size: 13px; font-weight: 800; }
.settings-toggle-copy small { max-width: 720px; color: #858d9a; font-size: 12px; font-weight: 450; line-height: 1.65; }
.settings-switch { position: relative; display: inline-flex; flex: 0 0 46px; width: 46px; height: 26px; }
.settings-switch input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.settings-switch > span { position: absolute; inset: 0; border: 1px solid #d7dce4; border-radius: 20px; background: #e7eaf0; box-shadow: inset 2px 2px 4px rgba(25,35,48,.08); transition: background .2s ease,border-color .2s ease; }
.settings-switch > span::before { position: absolute; top: 3px; left: 3px; width: 18px; height: 18px; border-radius: 50%; background: #fff; box-shadow: 1px 2px 4px rgba(22,31,44,.2); content: ''; transition: transform .2s ease; }
.settings-switch input:checked + span { border-color: #f65c3a; background: #ff704e; }
.settings-switch input:checked + span::before { transform: translateX(20px); }
.settings-switch input:focus-visible + span { outline: 3px solid rgba(255,98,60,.24); outline-offset: 3px; }
.settings-security-meta { display: flex; flex-wrap: nowrap; gap: 12px; margin: -3px 0 21px; }
.settings-security-meta > div { display: flex; flex: 1 1 0; min-width: 0; flex-direction: row; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 14px; border: 1px solid #eceff3; border-radius: 10px; background: #fafbfc; }
.settings-security-meta span { color: #858d9a; font-size: 11px; }
.settings-security-meta strong { color: #343b48; font-size: 12px; font-weight: 800; text-align: right; }
.settings-security-meta > div:nth-child(2) strong { display: inline-flex; align-items: center; gap: 5px; color: #218653; }
.settings-security-meta > div:nth-child(2) strong::before { content: '✓'; font-size: 14px; font-weight: 900; }
.settings-password-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 15px; }
.settings-autosave-status { min-height: 16px; margin: 12px 0 0; color: #27744f; font-size: 12px; text-align: center; }
.settings-autosave-status.is-error { color: #b83232; }
.settings-footnote { margin: 19px 3px 0; color: #8a92a0; font-size: 11px; line-height: 1.7; text-align: center; }
[dir="rtl"] .settings-account-badges { align-items: flex-start; }
[dir="rtl"] .settings-switch > span::before { left: auto; right: 3px; }
[dir="rtl"] .settings-switch input:checked + span::before { transform: translateX(-20px); }
@media (max-width: 760px) {
    .settings-page { padding: 4px 15px 42px; }
    .settings-hero { margin-bottom: 18px; }
    .settings-account-strip { flex-wrap: wrap; padding: 15px; }
    .settings-account-main { flex-basis: calc(100% - 70px); }
    .settings-account-badges { position: absolute; top: 12px; right: 12px; flex-basis: auto; flex-direction: column; align-items: flex-end; justify-content: flex-start; padding: 0; }
    [dir="rtl"] .settings-account-badges { right: auto; left: 12px; padding: 0; }
    .settings-grid { grid-template-columns: minmax(0,1fr); gap: 14px; }
    .settings-card-wide { grid-column: auto; }
    .settings-card { padding: 19px; }
    .settings-password-grid { grid-template-columns: minmax(0,1fr); }
    .settings-password-grid .settings-field:last-child { grid-column: auto; }
}
@media (max-width: 480px) {
    .settings-page { padding: 3px 11px 34px; }
    .settings-hero { align-items: flex-start; gap: 10px; }
    .settings-hero h1 { font-size: 32px; }
    .settings-hero-copy > p:last-child { font-size: 13px; }
    .settings-account-strip { gap: 11px; }
    .settings-account-badges { top: 10px; right: 10px; padding: 0; }
    [dir="rtl"] .settings-account-badges { left: 10px; }
    .settings-quicknav { gap: 6px; }
    .settings-quicknav a { min-height: 32px; padding: 6px 10px; font-size: 11px; }
    .settings-card { padding: 16px; border-radius: 14px; }
    .settings-card-heading { gap: 10px; margin-bottom: 18px; }
    .settings-card-icon { flex-basis: 37px; width: 37px; height: 37px; border-radius: 11px; }
    .settings-card-heading h2 { font-size: 15px; }
    .settings-card-heading p { font-size: 11px; }
    .settings-password-grid { grid-template-columns: minmax(0,1fr); }
    .settings-toggle-row { align-items: flex-start; }
    .settings-switch { margin-top: 2px; }
    .settings-button { width: auto; max-width: 100%; }
    .settings-form-actions { width: 100%; }
    .settings-field { grid-template-columns: 150px minmax(0,1fr); }
    .settings-field > span { padding: 0 8px; font-size: 11px; }
    .settings-email-health { align-items: flex-start; flex-direction: column; }
}

/* END: VIPENVPN User Settings Page */
/* START: VIPENVPN Admin Console — isolated styles */
.admin-page, .admin-page * { box-sizing:border-box; }
.admin-page { --adm-bg:#0b0d12; --adm-sidebar:#101319; --adm-surface:#151922; --adm-surface-2:#1b202a; --adm-border:#292f3a; --adm-text:#f4f6fa; --adm-muted:#969eae; --adm-accent:#ff623c; --adm-accent-soft:rgba(255,98,60,.13); margin:0; min-height:100vh; background:var(--adm-bg); color:var(--adm-text); font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; font-size:14px; line-height:1.5; transition:background .2s,color .2s; }
.admin-page a { color:inherit; text-decoration:none; }
.admin-page button, .admin-page input { font:inherit; }
.admin-page button { cursor:pointer; }
.admin-page h1 { font-size:clamp(26px,3vw,34px); letter-spacing:-.035em; line-height:1.15; margin-bottom:8px; }
.admin-page h2 { letter-spacing:-.015em; margin-bottom:5px; }
.admin-page p { margin-bottom:0; }
.admin-page small { font-size:11px; }
.admin-muted { color:var(--adm-muted); font-size:13px; }
.admin-brand-mark { display:grid; place-items:center; width:39px; height:39px; flex:0 0 39px; border-radius:12px; background:linear-gradient(145deg,#ff805f,#ed4928); color:#fff; font-weight:900; font-size:22px; box-shadow:0 7px 18px rgba(255,98,60,.22); }
.admin-login-wrap { display:grid; place-items:center; min-height:100vh; padding:30px 18px; background:radial-gradient(ellipse 52% 48% at 8% 28%,rgba(255,116,76,.52),transparent 68%),radial-gradient(ellipse 46% 55% at 92% 18%,rgba(63,177,244,.54),transparent 70%),radial-gradient(ellipse 48% 50% at 82% 88%,rgba(115,79,211,.46),transparent 72%),radial-gradient(ellipse 44% 44% at 18% 88%,rgba(22,126,205,.44),transparent 72%),linear-gradient(135deg,#e6e8ee 0%,#f8f9fc 36%,#eef3f8 66%,#e4eaf1 100%); }
.admin-login-card { width:min(100%,560px); padding:42px 44px; border:1px solid rgba(16,24,40,.08); border-radius:30px; background:#fff; box-shadow:0 30px 80px rgba(16,24,40,.13); }
.admin-login-brand, .admin-sidebar-brand { display:flex; align-items:center; gap:16px; }
.admin-login-logo { display:block; width:64px; height:64px; flex:0 0 64px; object-fit:contain; }
.admin-login-brand strong, .admin-sidebar-brand strong { display:block; font-size:16px; letter-spacing:.12em; color:#202634; }
.admin-login-brand small, .admin-sidebar-brand small { display:block; color:#7a8493; font-size:10px; letter-spacing:.19em; margin-top:4px; }
.admin-login-eyebrow, .admin-eyebrow { color:#c65b42; font-size:11px; font-weight:800; letter-spacing:.17em; margin:34px 0 10px; }
.admin-login-card h1 { font-size:clamp(27px,4vw,34px); color:#202634; }
.admin-login-lead { color:#697586; font-size:14px; margin-bottom:25px!important; }
.admin-login-form { display:grid; gap:16px; }
.admin-login-form .admin-login-field { position:relative; display:flex; align-items:center; min-height:52px; margin:0; padding:0 13px 0 15px; border:1px solid #dfe5ed; border-radius:999px; background:#f8fafc; box-shadow:0 5px 16px rgba(16,24,40,.028); transition:border-color .2s ease,box-shadow .2s ease,transform .2s ease,background .2s ease; }
.admin-login-form .admin-login-field:focus-within { border-color:rgba(255,103,69,.45); background:#fff; box-shadow:0 0 0 4px rgba(255,103,69,.07),0 10px 24px rgba(16,24,40,.05); transform:translateY(-1px); }
.admin-login-form .admin-login-field input { width:100%; min-width:0; height:48px; padding:0 4px; border:0; border-radius:0; background:transparent; color:#101828; font:inherit; font-size:13px; outline:none; box-shadow:none!important; caret-color:#101828; }
.admin-login-form .admin-login-field input::placeholder { color:#9aa5b4; opacity:1; }
.admin-login-form .admin-login-field input:focus { border:0; box-shadow:none; }
.admin-login-form .admin-login-password input { padding-right:4px; }
.admin-login-form .admin-password-toggle { position:static; width:38px; height:38px; flex:0 0 38px; display:grid; place-items:center; margin-left:4px; padding:0; border:0; border-radius:50%; background:transparent; color:#64748b; cursor:pointer; }
.admin-login-form .admin-password-toggle .auth-eye { width:24px; height:24px; display:none!important; overflow:visible; }
.admin-login-form .admin-password-toggle:not(.is-visible) .auth-eye-closed { display:block!important; }
.admin-login-form .admin-password-toggle.is-visible .auth-eye-open { display:block!important; }
.admin-login-form .admin-password-toggle:hover { background:rgba(255,103,69,.08); color:#d34b31; }
.admin-login-form .admin-login-field input:-webkit-autofill, .admin-login-form .admin-login-field input:-webkit-autofill:hover, .admin-login-form .admin-login-field input:-webkit-autofill:focus { -webkit-text-fill-color:#101828; -webkit-box-shadow:0 0 0 1000px transparent inset!important; box-shadow:0 0 0 1000px transparent inset!important; transition:background-color 99999s ease-in-out 0s; }
.admin-login-page { --adm-text:#202634; --adm-muted:#697586; --adm-border:#dfe5ed; --adm-accent:#e95432; --adm-accent-soft:rgba(233,84,50,.09); }
.admin-login-page .admin-login-foot { color:#697586; border-top-color:#e4e7ec; }
.admin-login-page .admin-login-copyright { color:#697586; }
.admin-login-page .admin-login-submit { width:100%; min-height:50px; border-radius:13px; font-size:14px; font-weight:700; }
.admin-btn { display:inline-flex; align-items:center; justify-content:center; gap:9px; min-height:39px; padding:0 15px; border:1px solid transparent; border-radius:9px; font-size:12px; font-weight:800; white-space:nowrap; }
.admin-btn-primary { background:linear-gradient(135deg,#ff754f,#f4512d); color:#fff; box-shadow:0 6px 16px rgba(255,98,60,.15); }
.admin-btn-primary:hover { filter:brightness(1.07); }
.admin-btn-secondary { background:var(--adm-surface-2); border-color:var(--adm-border); color:var(--adm-text); }
.admin-login-submit { height:47px; margin-top:4px; }
.admin-login-foot { display:flex; align-items:center; justify-content:space-between; margin-top:25px; padding-top:18px; border-top:1px solid var(--adm-border); color:var(--adm-muted); font-size:10px; }
.admin-security-dot, .admin-live-indicator i, .admin-status-pill i { display:inline-block; width:7px; height:7px; border-radius:50%; background:#32c987; }
.admin-login-copyright { margin-top:20px; color:#777f8d; font-size:10px; text-align:center; }
.admin-alert { padding:12px 14px; border:1px solid var(--adm-border); border-radius:10px; margin:0 0 18px; font-size:12px; overflow-wrap:anywhere; }
.admin-alert-error { border-color:rgba(255,92,92,.35); background:rgba(255,92,92,.08); color:#ffaaaa; }
.admin-alert-info { border-color:rgba(95,161,255,.3); background:rgba(95,161,255,.08); color:#b9d8ff; }
.admin-app { display:flex; min-height:100vh; }
.admin-sidebar { position:fixed; z-index:40; inset:0 auto 0 0; display:flex; flex-direction:column; width:252px; padding:23px 15px 16px; border-right:1px solid var(--adm-border); background:var(--adm-sidebar); overflow-y:auto; }
.admin-sidebar-brand { padding:0 8px 25px; border-bottom:1px solid var(--adm-border); }
.admin-nav-label, .admin-nav-group-title { color:#697283; font-size:9px; font-weight:900; letter-spacing:.17em; }
.admin-nav-label { padding:22px 10px 9px; }
.admin-nav { display:grid; gap:18px; }
.admin-nav-group { display:grid; gap:4px; }
.admin-nav-group-title { padding:0 10px 5px; }
.admin-nav-link { display:flex; align-items:center; gap:11px; min-height:40px; padding:0 10px; border:1px solid transparent; border-radius:9px; color:#aab1bf; font-size:12px; font-weight:650; transition:background .15s,color .15s; }
.admin-nav-link:hover { background:var(--adm-surface-2); color:var(--adm-text); }
.admin-nav-link.is-active { background:var(--adm-accent-soft); border-color:rgba(255,98,60,.18); color:var(--adm-accent); }
.admin-nav-icon { display:grid; place-items:center; width:21px; font-size:17px; }
.admin-nav-count { margin-left:auto; padding:1px 6px; border-radius:20px; background:var(--adm-surface-2); color:var(--adm-muted); }
.admin-sidebar-bottom { margin-top:auto; padding-top:17px; border-top:1px solid var(--adm-border); }
.admin-user-chip { display:flex; align-items:center; gap:10px; padding:0 5px 13px; }
.admin-avatar { display:grid; place-items:center; width:34px; height:34px; flex:0 0 34px; border:1px solid rgba(255,98,60,.24); border-radius:50%; background:var(--adm-accent-soft); color:var(--adm-accent); font-weight:900; }
.admin-user-chip strong, .admin-user-chip small { display:block; }
.admin-user-chip strong { font-size:11px; }
.admin-user-chip small { color:var(--adm-muted); font-size:10px; }
.admin-logout-button { width:100%; height:37px; padding:0 10px; border:1px solid var(--adm-border); border-radius:8px; background:transparent; color:#c4c9d3; text-align:left; font-size:11px; font-weight:700; }
.admin-logout-button span { margin-right:8px; color:var(--adm-accent); }
.admin-main { min-width:0; width:calc(100% - 252px); margin-left:252px; }
.admin-topbar { position:sticky; top:0; z-index:25; display:flex; align-items:center; justify-content:space-between; gap:20px; min-height:65px; padding:0 32px; border-bottom:1px solid var(--adm-border); background:color-mix(in srgb,var(--adm-bg) 90%,transparent); backdrop-filter:blur(16px); }
.admin-breadcrumb { display:flex; align-items:center; gap:11px; color:var(--adm-muted); font-size:11px; }
.admin-breadcrumb b { color:#555e6d; }
.admin-breadcrumb strong { color:var(--adm-text); font-weight:750; }
.admin-topbar-actions { display:flex; align-items:center; gap:20px; }
.admin-live-indicator { display:flex; align-items:center; gap:7px; color:#9ca6b6; font-size:9px; font-weight:800; letter-spacing:.08em; }
.admin-live-indicator i { width:6px; height:6px; }
.admin-view-site { color:var(--adm-muted)!important; font-size:11px; font-weight:700; }
.admin-view-site:hover { color:var(--adm-accent)!important; }
.admin-mobile-menu { display:none; border:1px solid var(--adm-border); border-radius:8px; background:var(--adm-surface); width:36px; height:34px; }
.admin-content { max-width:1680px; margin:0 auto; padding:30px 32px 18px; }
.admin-page-heading { display:flex; align-items:flex-end; justify-content:space-between; gap:20px; margin-bottom:24px; }
.admin-page-heading .admin-eyebrow { margin:0 0 8px; }
.admin-heading-meta { display:grid; justify-items:end; gap:8px; color:var(--adm-muted); font-size:10px; }
.admin-stats-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; margin-bottom:20px; }
.admin-stat-card { display:grid; gap:18px; min-width:0; padding:19px; border:1px solid var(--adm-border); border-radius:14px; background:linear-gradient(145deg,var(--adm-surface),color-mix(in srgb,var(--adm-surface) 80%,var(--adm-bg))); transition:transform .15s,border-color .15s; }
.admin-stat-card:hover { transform:translateY(-2px); border-color:rgba(255,98,60,.45); }
.admin-stat-top { display:flex; align-items:center; justify-content:space-between; gap:10px; color:var(--adm-muted); font-size:11px; font-weight:650; }
.admin-stat-icon { display:grid; place-items:center; width:33px; height:33px; border:1px solid rgba(255,98,60,.16); border-radius:10px; background:var(--adm-accent-soft); color:var(--adm-accent); font-size:18px; }
.admin-stat-card>strong { font-size:30px; letter-spacing:-.04em; line-height:1.1; }
.admin-stat-link { display:flex; justify-content:space-between; color:var(--adm-muted); font-size:10px; }
.admin-stat-link b { color:var(--adm-accent); font-size:14px; }
.admin-content-grid { display:grid; grid-template-columns:minmax(0,1.6fr) minmax(280px,1fr); gap:16px; align-items:start; }
.admin-panel { min-width:0; margin-bottom:17px; border:1px solid var(--adm-border); border-radius:14px; background:var(--adm-surface); overflow:hidden; }
.admin-panel-heading { display:flex; align-items:center; justify-content:space-between; gap:14px; padding:18px 19px; border-bottom:1px solid var(--adm-border); }
.admin-panel-heading p { color:var(--adm-muted); font-size:11px; }
.admin-panel-heading>a { color:var(--adm-accent); font-size:11px; font-weight:800; white-space:nowrap; }
.admin-table-wrap { width:100%; overflow:auto; }
.admin-table { width:100%; border-collapse:collapse; text-align:left; white-space:nowrap; }
.admin-table th { padding:12px 15px; background:color-mix(in srgb,var(--adm-surface-2) 55%,transparent); color:#818b9c; font-size:9px; font-weight:900; letter-spacing:.09em; text-transform:uppercase; }
.admin-table td { padding:13px 15px; border-top:1px solid color-mix(in srgb,var(--adm-border) 75%,transparent); color:var(--adm-text); font-size:11px; }
.admin-table tbody tr:hover { background:color-mix(in srgb,var(--adm-surface-2) 55%,transparent); }
.admin-cell-sub { display:block; margin-top:3px; color:var(--adm-muted); font-size:10px; }
.admin-table-action { color:var(--adm-accent)!important; font-size:11px; font-weight:800; text-decoration:none; cursor:pointer; }
.admin-table-action:hover { color:var(--adm-text)!important; text-decoration:none; }
.admin-status-pill { display:inline-flex; align-items:center; gap:6px; min-height:22px; padding:3px 8px; border:1px solid var(--adm-border); border-radius:30px; background:var(--adm-surface-2); color:var(--adm-muted); font-size:9px; font-weight:850; white-space:nowrap; }
.admin-status-pill.is-good { border-color:rgba(50,201,135,.2); background:rgba(50,201,135,.08); color:#53d99d; }
.admin-status-pill.is-good i { background:#32c987; }
.admin-status-pill.is-warn { border-color:rgba(245,181,65,.2); background:rgba(245,181,65,.08); color:#f5c56a; }
.admin-status-pill.is-bad { border-color:rgba(255,99,99,.2); background:rgba(255,99,99,.08); color:#ff8585; }
.admin-status-pill.is-neutral { color:var(--adm-muted); }
.admin-count-badge { display:grid; place-items:center; min-width:27px; height:27px; padding:0 8px; border-radius:8px; background:var(--adm-surface-2); color:var(--adm-muted); font-size:10px; font-weight:800; }
.admin-empty-state { display:grid; justify-items:center; gap:7px; padding:38px 20px; text-align:center; }
.admin-empty-state>span { display:grid; place-items:center; width:38px; height:38px; border-radius:11px; background:var(--adm-surface-2); color:var(--adm-accent); font-size:19px; }
.admin-empty-state strong { font-size:12px; }
.admin-empty-state p, .admin-inline-empty { color:var(--adm-muted); font-size:11px; }
.admin-inline-empty { padding:20px; }
.admin-quick-link { display:flex; align-items:center; gap:12px; padding:15px 18px; border-bottom:1px solid var(--adm-border); }
.admin-quick-link:last-child { border-bottom:0; }
.admin-quick-link>span { display:grid; place-items:center; width:35px; height:35px; border-radius:10px; background:var(--adm-surface-2); color:var(--adm-accent); font-size:18px; }
.admin-quick-link>div { display:grid; gap:3px; min-width:0; }
.admin-quick-link strong { font-size:11px; }
.admin-quick-link small { color:var(--adm-muted); font-size:10px; }
.admin-quick-link>b { margin-left:auto; color:var(--adm-muted); }
.admin-searchbar { display:flex; align-items:center; gap:10px; margin-bottom:17px; }
.admin-search-input { display:flex; align-items:center; gap:10px; flex:1; min-width:0; height:42px; padding:0 12px; border:1px solid var(--adm-border); border-radius:9px; background:var(--adm-surface); color:var(--adm-muted); }
.admin-search-input>span { font-size:20px; }
.admin-search-input input { width:100%; min-width:0; border:0; outline:0; background:transparent; color:var(--adm-text); font-size:11px; }
.admin-search-input input::placeholder { color:#737d8d; }
.admin-pagination { display:flex; justify-content:space-between; gap:12px; padding:14px 18px; }
.admin-pagination a { color:var(--adm-accent); font-size:11px; font-weight:800; }
.admin-user-hero { display:flex; align-items:center; gap:15px; margin-bottom:18px; padding:20px; border:1px solid var(--adm-border); border-radius:14px; background:var(--adm-surface); }
.admin-avatar-large { width:53px; height:53px; flex-basis:53px; font-size:20px; }
.admin-user-hero-main { flex:1; min-width:0; }
.admin-user-hero-main h2 { font-size:18px; }
.admin-user-hero-main p { margin-bottom:8px; color:var(--adm-muted); font-size:11px; }
.admin-detail-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; margin-bottom:18px; }
.admin-detail-card { display:grid; gap:8px; padding:16px; border:1px solid var(--adm-border); border-radius:11px; background:var(--adm-surface); }
.admin-detail-card small { color:var(--adm-muted); font-size:10px; }
.admin-detail-card strong { font-size:12px; overflow-wrap:anywhere; }
.admin-report-card { display:flex; gap:16px; padding:22px; }
.admin-report-icon { display:grid; place-items:center; width:48px; height:48px; flex:0 0 48px; border-radius:13px; background:var(--adm-accent-soft); color:var(--adm-accent); font-size:24px; }
.admin-report-card p { max-width:900px; color:var(--adm-muted); font-size:12px; line-height:1.8; }
.admin-report-meta { display:flex; flex-wrap:wrap; gap:10px 22px; margin-top:16px; color:var(--adm-muted); font-size:10px; }
.admin-report-meta code { color:var(--adm-accent); }
.admin-check-list { padding:0 18px; }
.admin-check-list>div { display:flex; align-items:center; justify-content:space-between; gap:15px; padding:14px 0; border-bottom:1px solid var(--adm-border); font-size:11px; }
.admin-check-list>div:last-child { border-bottom:0; }
.admin-theme-options { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; padding:18px; }
.admin-theme-option { display:grid; gap:9px; padding:10px; border:1px solid var(--adm-border); border-radius:11px; background:var(--adm-surface-2); color:var(--adm-text); text-align:left; }
.admin-theme-option.is-selected { border-color:var(--adm-accent); box-shadow:0 0 0 2px var(--adm-accent-soft); }
.admin-theme-option strong { font-size:11px; }
.admin-theme-option small { color:var(--adm-muted); font-size:9px; }
.admin-theme-preview { display:flex; align-items:flex-start; gap:4px; height:75px; padding:7px; border:1px solid var(--adm-border); border-radius:7px; background:#0b0d12; }
.admin-theme-preview i { display:block; height:100%; border-radius:3px; background:#252a35; }
.admin-theme-preview i:first-child { width:27%; }
.admin-theme-preview i:nth-child(2) { width:60%; background:#171b24; }
.admin-theme-preview i:nth-child(3) { width:13%; background:#ff623c; }
.theme-preview-light { background:#f4f6fa; }
.theme-preview-light i { background:#d8dde6; }
.theme-preview-light i:nth-child(2) { background:#fff; }
.theme-preview-flat { background:#151922; border-radius:0; }
.theme-preview-flat i { border-radius:0; background:#303744; }
.theme-preview-3d { background:#151922; box-shadow:inset 2px 2px 4px #333,inset -2px -2px 4px #050608; }
.theme-preview-3d i { box-shadow:2px 2px 4px #050608,-1px -1px 3px #3a414d; }
.admin-theme-note { padding:0 18px 18px; font-size:10px; }
.audio-studio-sound-tabs { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; padding:14px; }
.audio-studio-sound-tabs>a { display:flex; align-items:center; gap:12px; min-width:0; padding:14px; border:1px solid var(--adm-border); border-radius:11px; background:var(--adm-surface-2); color:var(--adm-text); text-decoration:none; }
.audio-studio-sound-tabs>a.is-active { border-color:var(--adm-accent); background:var(--adm-accent-soft); }
.audio-tab-icon { display:grid; place-items:center; width:38px; height:38px; flex:0 0 38px; border-radius:10px; background:var(--adm-surface); color:var(--adm-accent); font-size:22px; }
.audio-studio-sound-tabs>a>span:last-child { display:grid; gap:4px; }
.audio-studio-sound-tabs strong { font-size:12px; }
.audio-studio-sound-tabs small { color:var(--adm-muted); font-size:10px; }
.audio-studio-form .admin-panel-heading { align-items:center; }
.audio-enabled-toggle { display:flex; align-items:center; gap:8px; color:var(--adm-text); font-size:11px; white-space:nowrap; }
.audio-enabled-toggle input { accent-color:var(--adm-accent); width:16px; height:16px; }
.audio-studio-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr)); gap:10px; padding:16px; }
.audio-control { display:grid; grid-template-columns:minmax(0,44%) minmax(0,1fr); align-items:stretch; gap:0; min-width:0; min-height:42px; overflow:hidden; border:1px solid var(--adm-border); border-radius:9px; background:var(--adm-surface-2); color:var(--adm-muted); font-size:11px; }
.audio-studio-grid-main .audio-control:nth-child(n+5), .audio-studio-grid-special .audio-control { grid-template-columns:minmax(0,56%) minmax(0,1fr); }
.audio-control>span { display:flex; justify-content:space-between; align-items:center; gap:5px; min-width:0; padding:8px 9px; border-right:1px solid var(--adm-border); background:color-mix(in srgb,var(--adm-border) 42%,var(--adm-surface-2)); color:var(--adm-text); font-weight:700; line-height:1.25; overflow-wrap:anywhere; }
.audio-control output { color:var(--adm-accent); font-variant-numeric:tabular-nums; }
.audio-control input:not([type=range]), .audio-control select { width:100%; min-width:0; height:100%; min-height:40px; padding:0 9px; border:0; border-radius:0; outline:none; background:transparent; color:var(--adm-text); font:inherit; }
.audio-control input[type=range] { width:calc(100% - 16px); margin:0 8px; accent-color:var(--adm-accent); }
.audio-control input:focus, .audio-control select:focus { box-shadow:inset 0 0 0 1px var(--adm-accent); }
.audio-studio-actions { display:flex; flex-wrap:wrap; align-items:center; gap:12px; margin:0 0 20px; }
.audio-studio-actions #audio-preview-status { color:var(--adm-muted); font-size:11px; }
.audio-studio-actions button:disabled { opacity:.6; cursor:wait; }
.admin-alert-success { margin-bottom:16px; padding:13px 15px; border:1px solid rgba(50,201,135,.24); border-radius:10px; background:rgba(50,201,135,.08); color:#53d99d; font-size:12px; }
.admin-mobile-menu { color:var(--adm-text); }
.admin-theme-light { --adm-bg:#f3f5f8; --adm-sidebar:#fff; --adm-surface:#fff; --adm-surface-2:#f1f3f6; --adm-border:#dfe3e9; --adm-text:#202634; --adm-muted:#697386; --adm-accent:#e95432; --adm-accent-soft:rgba(233,84,50,.09); }
.admin-theme-light .admin-login-card { background:#fff; box-shadow:0 24px 70px rgba(23,34,53,.12); }
.admin-theme-light .admin-login-form input { background:#f8f9fb; color:#202634; border-color:#dfe3e9; }
.admin-theme-light .admin-nav-link { color:#5d6676; }
.admin-theme-light .admin-nav-link.is-active { color:var(--adm-accent); }
.admin-theme-light .admin-stat-card { background:#fff; }
.admin-theme-light .admin-table th { background:#f7f8fa; }
.admin-theme-flat .admin-panel, .admin-theme-flat .admin-stat-card, .admin-theme-flat .admin-detail-card, .admin-theme-flat .admin-login-card, .admin-theme-flat .admin-theme-option { border-radius:2px; box-shadow:none; background:var(--adm-surface); }
.admin-theme-flat .admin-btn, .admin-theme-flat .admin-status-pill, .admin-theme-flat .admin-brand-mark { border-radius:2px; box-shadow:none; }
.admin-theme-3d .admin-panel, .admin-theme-3d .admin-stat-card, .admin-theme-3d .admin-detail-card, .admin-theme-3d .admin-login-card { box-shadow:5px 5px 12px rgba(0,0,0,.24),-3px -3px 10px rgba(255,255,255,.025); }
.admin-theme-3d .admin-btn, .admin-theme-3d .admin-nav-link { box-shadow:inset 1px 1px 0 rgba(255,255,255,.035),2px 2px 5px rgba(0,0,0,.15); }
@media(max-width:1100px) {
    .audio-studio-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; padding:14px; }
    .admin-content { padding:24px 20px 15px; }
    .admin-topbar { padding:0 20px; }
    .admin-stats-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
    .admin-content-grid { grid-template-columns:1fr; }
    .admin-theme-options { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media(max-width:760px) {
    .audio-studio-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:7px; padding:11px; }
    .audio-control { grid-template-columns:minmax(0,46%) minmax(0,1fr); font-size:10px; min-height:40px; }
    .audio-studio-grid-main .audio-control:nth-child(n+5), .audio-studio-grid-special .audio-control { grid-template-columns:minmax(0,58%) minmax(0,1fr); }
    .audio-control>span { padding:7px 6px; }
    .audio-control input:not([type=range]), .audio-control select { padding:0 6px; min-height:38px; }
    .audio-studio-sound-tabs { grid-template-columns:1fr; padding:12px; }
    .audio-studio-actions { align-items:stretch; flex-direction:column; }
    .audio-studio-actions .admin-btn { justify-content:center; }
    .audio-studio-form .admin-panel-heading { align-items:flex-start; flex-direction:column; }
    .admin-sidebar { transform:translateX(-102%); transition:transform .2s ease; box-shadow:12px 0 35px rgba(0,0,0,.24); }
    .admin-sidebar.is-open { transform:translateX(0); }
    .admin-main { width:100%; margin-left:0; }
    .admin-topbar { min-height:58px; gap:10px; padding:0 13px; }
    .admin-mobile-menu { display:block; flex:0 0 36px; }
    .admin-breadcrumb { gap:7px; font-size:10px; }
    .admin-live-indicator { display:none; }
    .admin-view-site { font-size:10px; }
    .admin-content { padding:21px 13px 14px; }
    .admin-page-heading { align-items:flex-start; flex-direction:column; gap:12px; margin-bottom:18px; }
    .admin-heading-meta { justify-items:start; }
    .admin-stats-grid { gap:9px; }
    .admin-stat-card { padding:14px; gap:14px; }
    .admin-stat-card>strong { font-size:25px; }
    .admin-stat-top { font-size:10px; }
    .admin-stat-icon { width:29px; height:29px; }
    .admin-panel-heading { padding:15px; }
    .admin-table th, .admin-table td { padding:11px 12px; }
    .admin-searchbar { flex-wrap:wrap; }
    .admin-search-input { flex-basis:100%; }
    .admin-searchbar .admin-btn { flex:1; }
    .admin-detail-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:9px; }
    .admin-user-hero { flex-wrap:wrap; padding:15px; }
    .admin-user-hero .admin-btn { width:100%; }
    .admin-report-card { padding:16px; }
    .admin-footer { font-size:8px; }
    .admin-login-card { padding:27px 22px; }
    .admin-login-wrap { padding:20px 13px; }
}
@media(max-width:420px) {
    .admin-stats-grid { grid-template-columns:1fr 1fr; }
    .admin-stat-card { padding:12px; }
    .admin-stat-top { align-items:flex-start; }
    .admin-stat-top>span:first-child { max-width:100px; }
    .admin-stat-card>strong { font-size:22px; }
    .admin-stat-link { font-size:9px; }
    .admin-detail-grid { grid-template-columns:1fr 1fr; }
    .admin-theme-options { grid-template-columns:1fr 1fr; }
    .admin-breadcrumb>span { display:none; }
    .admin-breadcrumb>b { display:none; }
    .admin-view-site { display:none; }
    .admin-check-list>div { align-items:flex-start; }
    .admin-check-list>div strong { white-space:normal; }
}
/* END: VIPENVPN Admin Console — isolated styles */
/* START: VIPENVPN Admin Login Layout Fixes */
.admin-login-page .auth-wrap { flex-wrap:wrap; align-content:flex-start; }
.admin-login-page .admin-login-copyright { position:static; flex:0 0 100%; width:100%; margin:22px auto 0; text-align:center; }
.admin-login-page .auth-panel h1#admin-login-title { margin-right:0; margin-left:0; color: #494949; font-size:clamp(21px,2.1vw,27px); font-weight:700; line-height:1.15; letter-spacing:-.025em; white-space:nowrap; }
@media(max-width:700px) {
    .admin-login-page .auth-wrap { padding:14px 14px 30px; }
    .admin-login-page .auth-shell { display:block; width:100%; min-height:0; overflow:hidden; border:1px solid rgba(16,24,40,.08); border-radius:32px; background:#fff; box-shadow:0 34px 80px rgba(16,24,40,.14),0 10px 30px rgba(16,24,40,.07); }
    .admin-login-page .auth-panel { display:block; min-height:0; border-radius:30px; box-shadow:none; }
    .admin-login-page .auth-panel-inner { width:100%; max-width:none; padding:38px 28px 32px; }
    .admin-login-page .auth-panel h1#admin-login-title { font-size:clamp(19px,5.1vw,24px); letter-spacing:-.035em; }
    .admin-login-page .admin-login-copyright { margin-top:18px; }
}
@media(max-width:380px) {
    .admin-login-page .auth-panel-inner { padding-right:20px; padding-left:20px; }
    .admin-login-page .auth-panel h1#admin-login-title { font-size:19px; letter-spacing:-.045em; }
}
/* END: VIPENVPN Admin Login Layout Fixes */
/* VIPENVPN ADMIN EDITORS AND GLOBAL PREFERENCES */
.admin-topbar-actions { flex-wrap:wrap; }
.admin-preferences-form { display:flex; align-items:center; gap:7px; margin:0; }
.admin-preference-control select { max-width:92px; min-width:66px; height:31px; padding:0 8px; border:1px solid var(--adm-border); border-radius:8px; background:var(--adm-surface); color:var(--adm-text); font:600 10px/1.2 sans-serif; }
.admin-sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.admin-editor-panel { padding:22px; }
.admin-form-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:17px; }
.admin-form-field { display:flex; flex-direction:column; gap:7px; min-width:0; color:var(--adm-muted); font-size:11px; font-weight:750; }
.admin-form-field input, .admin-form-field select { width:100%; min-width:0; min-height:40px; padding:9px 11px; border:1px solid var(--adm-border); border-radius:9px; background:var(--adm-surface-2); color:var(--adm-text); font:500 12px/1.4 sans-serif; }
.admin-form-field input:focus, .admin-form-field select:focus { outline:2px solid color-mix(in srgb,var(--adm-accent) 25%,transparent); border-color:var(--adm-accent); }
.admin-form-field small { color:var(--adm-muted); font-size:10px; font-weight:500; }
.admin-form-actions { display:flex; flex-wrap:wrap; gap:9px; margin-top:22px; padding-top:18px; border-top:1px solid var(--adm-border); }
.admin-btn-small { min-height:29px; padding:6px 10px; font-size:10px; }
html[dir="rtl"] .admin-sidebar { inset:0 0 0 auto; border-right:0; border-left:1px solid var(--adm-border); }
html[dir="rtl"] .admin-main { margin-left:0; margin-right:252px; }
html[dir="rtl"] .admin-nav-link, html[dir="rtl"] .admin-sidebar-brand, html[dir="rtl"] .admin-user-chip { text-align:right; }
html[dir="rtl"] .admin-nav-icon { margin-left:0; }
html[dir="rtl"] .admin-breadcrumb { direction:rtl; }
@media(max-width:1100px) {
    .admin-form-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media(max-width:760px) {
    .admin-topbar-actions { gap:7px; }
    .admin-preferences-form { gap:4px; }
    .admin-preference-control select { min-width:55px; max-width:72px; height:29px; padding:0 4px; font-size:9px; }
    .admin-form-grid { grid-template-columns:1fr; gap:13px; }
    .admin-editor-panel { padding:15px; }
    html[dir="rtl"] .admin-sidebar { transform:translateX(102%); }
    html[dir="rtl"] .admin-sidebar.is-open { transform:translateX(0); }
    html[dir="rtl"] .admin-main { margin-right:0; }
}
/* START: VIPENVPN Affiliate Center */
.affiliates-page { background:#f6f8fb; color:#172033; }
.affiliates-shell { width:min(100% - 44px,1180px); margin:0 auto; padding:34px 0 56px; }
.affiliates-hero { position:relative; display:flex; align-items:center; justify-content:space-between; min-height:218px; overflow:hidden; padding:30px 36px; border:1px solid #242830; border-radius:20px; background:radial-gradient(circle at 84% 18%,rgba(255,98,60,.17),transparent 30%),linear-gradient(118deg,#17191f 0%,#20242d 58%,#15171c 100%); color:#fff; box-shadow:0 14px 34px rgba(18,24,38,.12); }
.affiliates-hero-copy { position:relative; z-index:2; max-width:670px; }
.affiliates-eyebrow { display:inline-flex; align-items:center; gap:8px; color:#ff9a80; font-size:10px; font-weight:850; letter-spacing:.15em; }
.affiliates-eyebrow-dot { width:6px; height:6px; border-radius:50%; background:#ff623c; box-shadow:0 0 0 4px rgba(255,98,60,.13); }
.affiliates-hero h1 { margin:13px 0 7px; color:#fff; font-size:clamp(28px,3.1vw,39px); font-weight:800; letter-spacing:-.045em; line-height:1.08; }
.affiliates-hero p { max-width:560px; margin:0; color:#b8bec9; font-size:13px; line-height:1.7; }
.affiliates-hero-meta { display:flex; align-items:center; gap:11px; margin-top:20px; color:#c7cbd3; font-size:10px; font-weight:650; }
.affiliates-status-pill { display:inline-flex; align-items:center; gap:6px; padding:6px 9px; border:1px solid rgba(255,255,255,.1); border-radius:99px; background:rgba(255,255,255,.06); color:#d9dee5; }
.affiliates-status-pill i { width:6px; height:6px; border-radius:50%; background:#9ca3af; }
.affiliates-status-pill.is-active i { background:#45d49b; box-shadow:0 0 0 3px rgba(69,212,155,.13); }
.affiliates-status-pill.is-pending i { background:#f7b955; }
.affiliates-meta-divider { width:1px; height:14px; background:rgba(255,255,255,.18); }
.affiliates-hero-art { position:relative; display:grid; flex:0 0 210px; width:210px; height:166px; place-items:center; margin-right:16px; }
.affiliates-orbit { position:absolute; width:150px; height:150px; border:1px solid rgba(255,255,255,.12); border-radius:50%; transform:rotate(-28deg) scaleY(.72); }
.affiliates-orbit-two { width:190px; height:190px; border-color:rgba(255,98,60,.22); transform:rotate(34deg) scaleY(.55); }
.affiliates-hero-token { display:grid; width:82px; height:82px; place-items:center; border:1px solid rgba(255,255,255,.25); border-radius:24px; background:linear-gradient(145deg,#ff795a,#d94328); color:#fff; box-shadow:0 15px 34px rgba(255,81,48,.23),inset 0 1px rgba(255,255,255,.35); transform:rotate(-8deg); }
.affiliates-hero-token svg { width:48px; height:48px; }
.affiliates-art-spark { position:absolute; width:7px; height:7px; border-radius:50%; background:#ff9a80; box-shadow:0 0 0 5px rgba(255,98,60,.12); }
.affiliates-art-spark-one { top:25px; right:28px; }
.affiliates-art-spark-two { bottom:24px; left:26px; width:5px; height:5px; background:#fff; }
.affiliates-setup-notice { display:flex; align-items:flex-start; gap:13px; margin-top:18px; padding:15px 17px; border:1px solid #f0d7a8; border-radius:13px; background:#fffaf0; color:#805b1a; }
.affiliates-notice-icon { display:grid; flex:0 0 25px; width:25px; height:25px; place-items:center; border-radius:50%; background:#f8e8c4; font-size:13px; font-weight:800; }
.affiliates-setup-notice strong { display:block; font-size:12px; }
.affiliates-setup-notice p { margin:4px 0; font-size:11px; line-height:1.6; }
.affiliates-setup-notice small { color:#9a7635; font-size:10px; line-height:1.5; }
.affiliates-link-card { display:grid; grid-template-columns:auto minmax(0,1fr) 175px; align-items:start; align-content:start; grid-auto-rows:max-content; gap:17px; margin-top:20px; padding:22px 23px; border:1px solid #e4e8ef; border-radius:17px; background:#fff; box-shadow:0 5px 18px rgba(22,34,56,.035); }
.affiliates-link-icon { display:grid; width:48px; height:48px; place-items:center; border:1px solid #ffddd3; border-radius:14px; background:#fff4f0; color:#e95738; }
.affiliates-link-icon svg { width:24px; height:24px; }
.affiliates-link-copy { min-width:0; }
.affiliates-card-kicker { display:block; color:#8b94a4; font-size:9px; font-weight:850; letter-spacing:.13em; }
.affiliates-link-copy h2,.affiliates-panel-heading h2 { margin:5px 0 4px; color:#1b2435; font-size:17px; font-weight:800; letter-spacing:-.025em; }
.affiliates-link-copy p { margin:0 0 12px; color:#7c8594; font-size:11px; line-height:1.6; }
.affiliates-link-field { display:flex; align-items:center; gap:9px; min-height:42px; padding:4px 5px 4px 13px; border:1px solid #e4e8ef; border-radius:10px; background:#f8fafc; }
.affiliates-link-field > span { overflow:hidden; flex:1; min-width:0; color:#404b5e; font-family:ui-monospace,SFMono-Regular,Menlo,monospace; font-size:11px; text-overflow:ellipsis; white-space:nowrap; }
.affiliates-link-field.is-unavailable { color:#929baa; }
.affiliates-copy-button { display:inline-flex; flex:0 0 auto; align-items:center; justify-content:center; gap:6px; min-height:32px; padding:0 10px; border:1px solid #ffd3c7; border-radius:7px; background:#fff; color:#df4e30; font:750 10px/1.2 inherit; cursor:pointer; transition:background .16s,border-color .16s,color .16s; }
.affiliates-copy-button:hover { border-color:#ff9c83; background:#fff5f1; }
.affiliates-copy-button svg { width:15px; height:15px; }
.affiliates-copy-button.is-copied { border-color:#a7e8cc; background:#edfff6; color:#14865b; }
.affiliates-copy-feedback { display:block; min-height:13px; margin-top:4px; color:#16865a; font-size:10px; }
.affiliates-link-side { display:flex; flex-direction:column; align-items:flex-start; justify-content:flex-start; align-self:start; padding-left:20px; border-left:1px solid #edf0f4; }
.affiliates-link-side-label { color:#939baa; font-size:9px; font-weight:850; letter-spacing:.12em; }
.affiliates-link-side strong { margin-top:4px; color:#e95738; font-size:30px; font-weight:850; letter-spacing:-.05em; line-height:1.1; }
.affiliates-link-side > span:not(.affiliates-link-side-label) { margin-top:5px; color:#8b94a3; font-size:10px; }
.affiliates-link-side-divider { width:100%; height:1px; margin:12px 0 9px; background:#edf0f4; }
.affiliates-link-side small { color:#7c8594; font-size:10px; }
.affiliates-link-side small b { margin-left:4px; color:#273347; font-weight:800; }
.affiliates-stats-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; margin-top:16px; }
.affiliates-stat-card { min-width:0; padding:17px 18px 15px; border:1px solid #e5e9f0; border-radius:14px; background:#fff; box-shadow:0 4px 14px rgba(22,34,56,.025); }
.affiliates-stat-top { display:flex; align-items:center; justify-content:space-between; gap:8px; }
.affiliates-stat-icon { display:grid; width:35px; height:35px; place-items:center; border-radius:10px; }
.affiliates-stat-icon svg { width:20px; height:20px; }
.affiliates-stat-icon.referrals { background:#eef4ff; color:#4776d0; }
.affiliates-stat-icon.earned { background:#eafaf2; color:#229969; }
.affiliates-stat-icon.pending { background:#fff6e7; color:#c58a24; }
.affiliates-stat-icon.paid { background:#fff0ec; color:#e35b3d; }
.affiliates-stat-caption { color:#a0a7b3; font-size:8px; font-weight:850; letter-spacing:.12em; }
.affiliates-stat-value { display:block; overflow:hidden; margin-top:15px; color:#202a3b; font-size:clamp(23px,2.3vw,30px); font-weight:850; letter-spacing:-.05em; text-overflow:ellipsis; white-space:nowrap; }
.affiliates-stat-label { display:block; margin-top:3px; color:#4c5668; font-size:11px; font-weight:750; }
.affiliates-stat-foot { display:block; margin-top:10px; color:#969eac; font-size:9px; line-height:1.5; }
.affiliates-content-grid { display:grid; grid-template-columns:minmax(0,1.13fr) minmax(0,.87fr); gap:16px; margin-top:16px; }
.affiliates-panel { min-width:0; padding:21px 22px; border:1px solid #e4e8ef; border-radius:15px; background:#fff; box-shadow:0 4px 15px rgba(22,34,56,.025); }
.affiliates-panel-heading { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.affiliates-panel-heading h2 { margin-top:5px; margin-bottom:0; }
.affiliates-count-badge,.affiliates-history-note { flex:0 0 auto; padding:6px 8px; border:1px solid #e9edf3; border-radius:7px; background:#fafbfd; color:#828b9a; font-size:9px; font-weight:700; }
.affiliates-empty-state { display:flex; min-height:220px; flex-direction:column; align-items:center; justify-content:center; padding:25px 16px; text-align:center; }
.affiliates-empty-icon { display:grid; width:48px; height:48px; place-items:center; border:1px solid #e8edf4; border-radius:15px; background:#f8fafc; color:#a1aab8; }
.affiliates-empty-icon svg { width:25px; height:25px; }
.affiliates-empty-state strong { margin-top:13px; color:#354054; font-size:12px; font-weight:800; }
.affiliates-empty-state p { max-width:290px; margin:6px 0 0; color:#929baa; font-size:10px; line-height:1.7; }
.affiliates-table-wrap { width:100%; overflow-x:auto; margin-top:17px; }
.affiliates-table { width:100%; border-collapse:collapse; text-align:left; white-space:nowrap; }
.affiliates-table th { padding:10px 8px; border-bottom:1px solid #edf0f4; color:#939baa; font-size:9px; font-weight:800; }
.affiliates-table td { padding:12px 8px; border-bottom:1px solid #f0f2f6; color:#657084; font-size:10px; }
.affiliates-table tbody tr:last-child td { border-bottom:0; }
.affiliates-table td:first-child,.affiliates-table th:first-child { padding-left:0; }
.affiliates-referral-avatar { display:inline-grid; width:27px; height:27px; place-items:center; margin-right:8px; border-radius:9px; background:#fff0eb; color:#dd5639; font-size:10px; font-weight:850; vertical-align:middle; }
.affiliates-referral-name { color:#394458; font-size:10px; font-weight:750; vertical-align:middle; }
.affiliates-mini-status { display:inline-flex; align-items:center; padding:5px 7px; border-radius:6px; background:#f2f5f9; color:#737e8f; font-size:9px; font-weight:750; }
.affiliates-mini-status.is-neutral { background:#eef4ff; color:#4c75bd; }
.affiliates-mini-status.is-pending { background:#fff5df; color:#a97816; }
.affiliates-mini-status.is-approved { background:#eafaf2; color:#19865b; }
.affiliates-mini-status.is-paid { background:#eafaf2; color:#19865b; }
.affiliates-mini-status.is-reversed,.affiliates-mini-status.is-cancelled { background:#fff0ed; color:#bd4c36; }
.affiliates-rules-mark { display:grid; width:30px; height:30px; place-items:center; border:1px solid #d8f3e6; border-radius:9px; background:#effcf6; color:#2ca574; font-size:15px; font-weight:800; }
.affiliates-rule-list { margin-top:18px; }
.affiliates-rule-item { display:grid; grid-template-columns:28px minmax(0,1fr); gap:11px; padding:13px 0; border-bottom:1px solid #f0f2f6; }
.affiliates-rule-item:last-child { border-bottom:0; }
.affiliates-rule-number { display:grid; width:27px; height:27px; place-items:center; border:1px solid #f5d7ce; border-radius:8px; background:#fff6f2; color:#df5b3d; font-size:9px; font-weight:850; }
.affiliates-rule-item strong { display:block; color:#374256; font-size:11px; font-weight:800; }
.affiliates-rule-item p { margin:4px 0 0; color:#8b94a3; font-size:10px; line-height:1.65; }
.affiliates-help-strip { display:flex; align-items:center; gap:10px; margin-top:15px; padding:12px; border:1px solid #e8edf5; border-radius:10px; background:#f8fafc; }
.affiliates-help-icon { display:grid; flex:0 0 25px; width:25px; height:25px; place-items:center; border-radius:8px; background:#eaf0fb; color:#4c70b5; font-size:12px; font-weight:850; }
.affiliates-help-strip > div { flex:1; min-width:0; }
.affiliates-help-strip strong { display:block; color:#475368; font-size:10px; }
.affiliates-help-strip p { margin:3px 0 0; color:#939baa; font-size:9px; line-height:1.5; }
.affiliates-help-strip a { display:grid; width:25px; height:25px; place-items:center; border:1px solid #e1e7f0; border-radius:7px; background:#fff; color:#6b7890; font-size:13px; text-decoration:none; }
.affiliates-history-panel { margin-top:16px; }
.affiliates-history-empty { display:flex; align-items:center; gap:13px; min-height:92px; margin-top:14px; padding:16px; border:1px dashed #e2e7ef; border-radius:11px; background:#fbfcfe; }
.affiliates-history-empty-icon { display:grid; flex:0 0 39px; width:39px; height:39px; place-items:center; border-radius:11px; background:#f0f4fa; color:#8592a5; }
.affiliates-history-empty-icon svg { width:20px; height:20px; }
.affiliates-history-empty strong { display:block; color:#4b566a; font-size:11px; }
.affiliates-history-empty p { margin:4px 0 0; color:#969eac; font-size:10px; line-height:1.6; }
.affiliates-footnote { margin:15px 2px 0; color:#9aa2af; font-size:9px; line-height:1.6; text-align:center; }
html[dir="rtl"] .affiliates-link-side { padding-right:20px; padding-left:0; border-right:1px solid #edf0f4; border-left:0; }
html[dir="rtl"] .affiliates-link-field { padding-right:13px; padding-left:5px; }
html[dir="rtl"] .affiliates-table { text-align:right; }
html[dir="rtl"] .affiliates-table td:first-child,html[dir="rtl"] .affiliates-table th:first-child { padding-right:0; padding-left:8px; }
html[dir="rtl"] .affiliates-referral-avatar { margin-right:0; margin-left:8px; }
html[dir="rtl"] .affiliates-help-strip { text-align:right; }
@media(max-width:900px) {
    .affiliates-shell { width:min(100% - 32px,1180px); padding-top:24px; }
    .affiliates-hero { min-height:205px; padding:27px 26px; }
    .affiliates-hero-art { flex-basis:155px; width:155px; margin-right:0; transform:scale(.88); }
    .affiliates-link-card { grid-template-columns:auto minmax(0,1fr); }
    .affiliates-link-side { grid-column:2; display:grid; grid-template-columns:auto auto minmax(0,1fr); align-items:center; gap:7px 10px; padding:11px 0 0; border-top:1px solid #edf0f4; border-left:0; }
    .affiliates-link-side strong { margin:0; font-size:22px; }
    .affiliates-link-side > span:not(.affiliates-link-side-label) { margin:0; }
    .affiliates-link-side-divider { display:none; }
    .affiliates-link-side small { grid-column:1/-1; }
    html[dir="rtl"] .affiliates-link-side { padding:11px 0 0; border-right:0; }
    .affiliates-stats-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
    .affiliates-content-grid { grid-template-columns:1fr; }
    .affiliates-empty-state { min-height:180px; }
}
@media(max-width:560px) {
    .affiliates-discount-code-box { grid-template-columns:minmax(145px,38%) minmax(0,1fr); }
    .affiliates-discount-code-box label { padding:0 9px; font-size:9px; }
    .affiliates-discount-code-box input[type=text] { padding:0 9px; font-size:12px; }
    .affiliates-shell { width:calc(100% - 24px); padding:16px 0 32px; }
    .affiliates-hero { min-height:0; padding:23px 20px; border-radius:16px; }
    .affiliates-hero-copy { max-width:100%; }
    .affiliates-hero h1 { font-size:29px; }
    .affiliates-hero p { max-width:360px; font-size:11px; }
    .affiliates-hero-meta { flex-wrap:wrap; gap:8px; margin-top:15px; font-size:9px; }
    .affiliates-hero-art { position:absolute; right:-73px; bottom:-54px; width:170px; height:170px; opacity:.22; transform:scale(.9); }
    html[dir="rtl"] .affiliates-hero-art { right:auto; left:-73px; }
    .affiliates-link-card { grid-template-columns:42px minmax(0,1fr); align-items:start; gap:7px 12px; margin-top:12px; padding:17px 15px; border-radius:13px; }
    .affiliates-link-icon { grid-column:1; grid-row:1 / span 2; align-self:start; width:39px; height:39px; border-radius:11px; }
    .affiliates-link-copy { display:contents; }
    .affiliates-link-copy > .affiliates-card-kicker { grid-column:2; grid-row:1; align-self:end; }
    .affiliates-link-copy h2 { grid-column:2; grid-row:2; margin:2px 0 0; }
    .affiliates-link-copy h2 { font-size:16px; align-self: start; }
    .affiliates-link-copy p { margin-bottom:10px; grid-column: 1 / -1; grid-row: 3; margin: 5px 0 10px; }
    .affiliates-link-field { gap:5px; min-height:40px; padding-left:9px; grid-column: 1 / -1; grid-row: 4; }
    .affiliates-link-field > span { font-size:9px; }
    .affiliates-copy-button { min-height:30px; gap:4px; padding:0 7px; font-size:9px; }
    .affiliates-copy-button svg { width:13px; height:13px; }
    .affiliates-link-side { grid-column:1 / -1; grid-row:5; display:grid; grid-template-columns:auto auto minmax(0,1fr) auto; align-items:baseline; gap:7px 9px; min-width:0; padding:12px 0 0; }
    .affiliates-link-side-label { grid-column:1; grid-row:1; min-width:0; font-size:8px; white-space:nowrap; }
    .affiliates-link-side strong { grid-column:2; grid-row:1; margin:0; font-size:20px; white-space:nowrap; }
    .affiliates-link-side > span:not(.affiliates-link-side-label) { grid-column:3; grid-row:1; min-width:0; font-size:9px; line-height:1.35; overflow-wrap:normal; }
    .affiliates-link-side small { grid-column:4; grid-row:1; min-width:0; font-size:10px; line-height:1.4; white-space:nowrap; }
    .affiliates-link-side small b { margin-inline-start:4px; font-size:13px; }
    .affiliates-stats-grid { gap:9px; margin-top:12px; }
    .affiliates-stat-card { padding:13px 12px 12px; border-radius:12px; }
    .affiliates-stat-icon { width:31px; height:31px; border-radius:9px; }
    .affiliates-stat-icon svg { width:18px; height:18px; }
    .affiliates-stat-caption { font-size:7px; }
    .affiliates-stat-value { margin-top:12px; font-size:24px; }
    .affiliates-stat-label { font-size:10px; }
    .affiliates-stat-foot { margin-top:7px; font-size:8px; }
    .affiliates-content-grid { gap:12px; margin-top:12px; }
    .affiliates-panel { padding:16px 14px; border-radius:13px; }
    .affiliates-panel-heading h2 { font-size:15px; }
    .affiliates-card-kicker { font-size:8px; }
    .affiliates-table th { padding:9px 7px; font-size:8px; }
    .affiliates-table td { padding:10px 7px; font-size:9px; }
    .affiliates-referral-avatar { width:23px; height:23px; margin-right:5px; }
    html[dir="rtl"] .affiliates-referral-avatar { margin-right:0; margin-left:5px; }
    .affiliates-rule-item { gap:8px; padding:11px 0; }
    .affiliates-rule-item p { font-size:9px; }
    .affiliates-help-strip { gap:8px; padding:10px; }
    .affiliates-history-panel { margin-top:12px; }
    .affiliates-history-empty { align-items:flex-start; padding:12px; }
    .affiliates-footnote { font-size:8px; }
    .affiliates-setup-notice { gap:10px; padding:12px; }
}
@media(max-width:360px) {
    .affiliates-shell { width:calc(100% - 18px); }
    .affiliates-hero { padding:20px 15px; }
    .affiliates-hero h1 { font-size:26px; }
    .affiliates-stat-card { padding:11px 9px; }
    .affiliates-stat-value { font-size:21px; }
    .affiliates-link-field > span { font-size:8px; }
    .affiliates-copy-button { padding:0 5px; }
    .affiliates-link-side { grid-template-columns:auto auto minmax(0,1fr); }
    .affiliates-link-side small { grid-column:1 / -1; grid-row:2; white-space:normal; font-size:11px; }
}
/* END: VIPENVPN Affiliate Center */
/* START: VIPENVPN Affiliate Discount Checkout */
.payment-page .payment-compact-hero { position:relative; display:flex; align-items:center; justify-content:space-between; gap:28px; max-width:none; min-height:190px; margin:20px 0 28px; padding:28px 36px; overflow:hidden; isolation:isolate; border:1px solid rgba(255,255,255,.2); border-radius:22px; background:linear-gradient(118deg,#101827 0%,#203a68 43%,#4d2c83 74%,#9d2d78 100%); box-shadow:0 18px 42px rgba(25,34,73,.18); }
.payment-page .payment-compact-hero .eyebrow,.payment-page .payment-compact-hero h1 { color:#fff; }
.payment-page .payment-compact-hero h1 { margin:7px 0 9px; font-size:clamp(32px,4.5vw,48px); line-height:1.05; letter-spacing:-.045em; }
.payment-page .payment-compact-hero p { max-width:660px; margin:0; color:rgba(255,255,255,.78); font-size:13px; line-height:1.6; }
.payment-page .payment-hero-copy { position:relative; z-index:1; min-width:0; }
.payment-page .payment-hero-art { position:relative; z-index:1; display:flex; flex:0 0 min(30%,250px); align-items:center; justify-content:center; width:min(30%,250px); min-width:150px; }
.payment-page .payment-hero-art svg { display:block; width:100%; max-width:250px; height:auto; overflow:visible; filter:drop-shadow(0 10px 20px rgba(0,0,0,.12)); }
.payment-page .payment-review-card { grid-column:1; grid-row:1; }
.payment-page .payment-methods-card { grid-column:2; grid-row:1; }
.payment-page .payment-method-heading { margin-bottom:16px; }
.payment-page .payment-method-heading h2 { font-size:21px; }
.payment-page .payment-discount-inline { margin:18px 0 0; }
.payment-page .payment-discount-inline-form { display:grid; grid-template-columns:minmax(0,1fr) minmax(142px,180px); align-items:stretch; gap:10px; min-width:0; margin:0; }
.payment-page .payment-discount-inline-field { position:relative; display:grid; grid-template-columns:minmax(0,1fr); flex:1 1 auto; min-width:0; box-sizing:border-box; border-radius:15px; overflow:hidden; }
.payment-page .payment-discount-inline-field input { width:100%; height:42px; box-sizing:border-box; border:0; border-radius:0; outline:0; padding:0 34px 0 12px; font-size:13px; text-transform:none; cursor:text; pointer-events:auto; }
.payment-page .payment-discount-inline-field input[aria-invalid="true"] { color:#a52d39; }
.payment-page .payment-discount-inline-field-check { position:absolute; right:10px; top:50%; display:grid; width:19px; height:19px; place-items:center; transform:translateY(-50%); border-radius:50%; background:#d8f8e5; color:#168653; font-size:12px; font-weight:900; }
.payment-page .payment-discount-inline.is-confirmed .payment-discount-inline-field { border-color:#9bdcb8; background:#f5fff8; }
.payment-page .payment-discount-inline.has-error .payment-discount-inline-field { border-color:#edb5b9; background:#fff8f8; }
.payment-page .payment-discount-inline-form > button { display:block; width:100%; min-width:0; box-sizing:border-box; align-self:stretch; height:42px; margin:0; padding:0 8px; border:0; border-radius:15px; background:linear-gradient(115deg,#ffda63 0%,#ffb23b 48%,#f47728 100%); color:#38210b; font:inherit; font-size:12px; font-weight:800; white-space:nowrap; cursor:pointer; box-shadow:0 5px 12px rgba(235,143,32,.16); }
.payment-page .payment-discount-inline-form > button.is-applied { background:linear-gradient(115deg,#d8f8e5 0%,#b8efce 100%); color:#166534; box-shadow:none; }
.payment-page .payment-change-location { min-height:42px; margin:0 0 12px; padding:9px 38px; background:linear-gradient(115deg,#ffda63 0%,#ffb23b 48%,#f47728 100%); color:#38210b; box-shadow:0 8px 18px rgba(235,143,32,.22); }
.payment-page .payment-change-location:hover { filter:brightness(1.035); box-shadow:0 10px 22px rgba(235,143,32,.28); }
[dir="rtl"] .payment-page .payment-discount-inline-field input { padding-right:12px; padding-left:34px; }
[dir="rtl"] .payment-page .payment-discount-inline-field-check { right:auto; left:10px; }
@media(max-width:900px) {
    .payment-page .payment-checkout-grid { grid-template-columns:1fr; }
    .payment-page .payment-review-card,.payment-page .payment-methods-card { grid-column:1; grid-row:auto; }
    .payment-page .payment-methods-card { order:2; }
}
@media(max-width:650px) {
    .payment-page .payment-compact-hero { min-height:150px; gap:10px; margin:16px 0 20px; padding:22px 21px; border-radius:17px; }
    .payment-page .payment-compact-hero h1 { font-size:34px; }
    .payment-page .payment-compact-hero p { max-width:360px; font-size:12px; }
    .payment-page .payment-hero-art { flex-basis:34%; width:34%; min-width:100px; margin-right:-7px; }
    .payment-page .payment-card-header { min-height:45px; padding:11px 20px; }
    .payment-page .payment-card-body { padding:20px; }
    .payment-page .payment-discount-inline-form { grid-template-columns:minmax(0,1fr) minmax(126px,40%); gap:6px; }
    .payment-page .payment-discount-inline-field { grid-template-columns:minmax(0,1fr); border-radius:15px; }
    .payment-page .payment-discount-inline-field input { font-size:11px; }
    .payment-page .payment-discount-inline-form > button { padding:0 8px; font-size:11px; }
    [dir="rtl"] .payment-page .payment-discount-inline-field input { padding-right:8px; padding-left:26px; }
}
@media(max-width:390px) {
    .payment-page .payment-compact-hero { padding:18px 15px; }
    .payment-page .payment-compact-hero h1 { font-size:30px; }
    .payment-page .payment-hero-art { min-width:82px; }
    .payment-page .payment-discount-inline-form { grid-template-columns:minmax(0,1fr) minmax(112px,38%); align-items:stretch; gap:5px; }
    .payment-page .payment-discount-inline-field { min-width:0; }
    .payment-page .payment-discount-inline-form > button { font-size:10px; }
}
/* END: VIPENVPN Affiliate Discount Checkout */
/* START: VIPENVPN Affiliate Discount Code Center */
.affiliates-discount-panel { margin:22px 0; }
.affiliates-discount-panel .affiliates-panel-heading h2 { display:flex; align-items:center; gap:9px; }
.affiliates-discount-summary { max-width:720px; margin:8px 0 0; color:#667085; font-size:12px; line-height:1.7; }
.affiliates-info-button { display:inline-grid; place-items:center; width:20px; height:20px; padding:0; border:1px solid #c8d7f0; border-radius:50%; background:#f3f7ff; color:#2458a6; font:700 12px/1 inherit; cursor:pointer; }
.affiliates-discount-fields { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; margin-top:14px; }
.affiliates-discount-field { display:flex; min-width:0; flex-direction:column; gap:8px; }
.affiliates-discount-field label { display:flex; justify-content:space-between; gap:10px; color:#344054; font-size:12px; font-weight:700; }
.affiliates-discount-field label strong { color:#2458a6; }
.affiliates-discount-code-box { display:grid; grid-template-columns:minmax(145px,38%) minmax(0,1fr); align-items:stretch; min-height:38px; overflow:hidden; border:1px solid #d7deea; border-radius:11px; background:#fff; }
.affiliates-discount-code-box label { display:flex; align-items:center; padding:0 13px; border-inline-end:1px solid #d7deea; background:#f0f3f8; color:#475467; font-size:10px; font-weight:750; white-space:nowrap; }
.affiliates-discount-code-divider { display:none; }
.affiliates-discount-code-input-wrap { position:relative; display:flex; min-width:0; align-items:center; background:#fff; }
.affiliates-discount-code-box input[type=text] { display:block; width:100%; min-width:0; min-height:38px; box-sizing:border-box; padding:0 13px; border:0; border-radius:0; outline-offset:-2px; background:transparent; color:#172033; font:inherit; font-size:13px; text-transform:uppercase; }
.affiliates-discount-code-box.is-confirmed { border-color:#9ad9b7; box-shadow:0 0 0 1px rgba(34,153,105,.06); }
.affiliates-discount-code-box.is-confirmed .affiliates-discount-code-input-wrap { background:#edfff5; }
.affiliates-discount-code-box.is-confirmed input[type=text] { color:#176c48; }
.affiliates-discount-code-confirmation { display:grid; flex:0 0 25px; width:25px; height:25px; margin-inline-end:10px; place-items:center; border-radius:50%; background:#d7f7e5; color:#168653; font-size:15px; font-weight:900; }
.affiliates-discount-code-confirmation[hidden] { display:none; }
.affiliates-discount-feedback { display:flex; flex-direction:column; gap:3px; margin:13px 0; padding:10px 12px; border:1px solid; border-radius:10px; font-size:11px; line-height:1.55; }
.affiliates-discount-feedback strong { font-size:11px; }
.affiliates-discount-feedback.is-error { border-color:#f0d7a8; background:#fffaf0; color:#805b1a; }
.affiliates-discount-feedback.is-success { border-color:#b7e7ce; background:#effcf5; color:#16734b; }
.affiliates-discount-field input[type=range] { display:block; width:100%; height:22px; margin:0; padding:0; box-sizing:border-box; accent-color:#2867c4; direction:ltr; }
.affiliates-discount-field small,.affiliates-discount-toggle small { color:#98a2b3; font-size:10px; line-height:1.5; }
.affiliates-discount-toggle { display:flex; align-items:center; gap:10px; margin:18px 0; }
.affiliates-discount-toggle input { width:17px; height:17px; accent-color:#2867c4; }
.affiliates-discount-toggle span { display:flex; flex-direction:column; gap:3px; }
.affiliates-discount-toggle strong { color:#344054; font-size:12px; }
.affiliates-discount-save { min-height:42px; padding:0 17px; border:0; border-radius:11px; background:linear-gradient(135deg,#2458a6,#2867c4); color:#fff; font:inherit; font-size:12px; font-weight:800; cursor:pointer; }
.affiliates-discount-save:disabled { opacity:.45; cursor:not-allowed; }
.affiliates-discount-actions { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); align-items:center; gap:20px; margin-top:18px; }
.affiliates-discount-actions .affiliates-discount-toggle { margin:0; }
.affiliates-discount-save-wrap { display:flex; justify-content:flex-end; }
.affiliates-discount-guide { margin-top:18px; padding:18px; border:1px solid #e0e7f1; border-radius:13px; background:#f8faff; }
.affiliates-discount-guide[hidden] { display:none; }
.affiliates-discount-guide h3 { margin:0 0 8px; color:#172033; font-size:17px; }
.affiliates-discount-guide h4 { margin:15px 0 5px; color:#344054; font-size:12px; }
.affiliates-discount-guide p { margin:5px 0; color:#667085; font-size:11px; line-height:1.7; }
.affiliates-discount-guide .affiliates-discount-notice { padding-top:9px; border-top:1px solid #e0e7f1; }
@media(max-width:600px) {
    .affiliates-discount-fields { grid-template-columns:1fr; gap:15px; }
    .affiliates-discount-actions { grid-template-columns:1fr; gap:14px; }
    .affiliates-discount-save-wrap { justify-content:center; }
    .affiliates-discount-save { min-width:min(100%,240px); }
    .affiliates-discount-guide { padding:14px; }
}
/* END: VIPENVPN Affiliate Discount Code Center */
/* START: VIPENVPN Ruby Navigation */
.vp-ruby-navigation { position:fixed; z-index:1200; top:50%; right:0; display:flex; flex-direction:column; align-items:flex-end; gap:10px; width:160px; max-height:calc(100vh - 162px); overflow:visible; transform:translateY(-50%); direction:ltr; pointer-events:none; }
.vp-ruby-navigation .vp-ruby-dashboard { --ruby-color:#d99b35; }
.vp-ruby-navigation .vp-ruby-services { --ruby-color:#168dff; }
.vp-ruby-navigation .vp-ruby-download-center { --ruby-color:#ef554b; }
.vp-ruby-navigation .vp-ruby-pricing { --ruby-color:#9b59e8; }
.vp-ruby-navigation .vp-ruby-express-checkout { --ruby-color:#ff861f; }
.vp-ruby-navigation .vp-ruby-wallet { --ruby-color:#00b981; }
.vp-ruby-navigation .vp-ruby-transactions { --ruby-color:#f2b92e; }
.vp-ruby-navigation .vp-ruby-affiliates { --ruby-color:#e944a9; }
.vp-ruby-navigation .vp-ruby-support { --ruby-color:#10b9d2; }
.vp-ruby-navigation .vp-ruby-profile { --ruby-color:#83c92c; }
.vp-ruby-navigation .vp-ruby-login { --ruby-color:#7957e8; }
.vp-ruby-navigation .vp-ruby-logout { --ruby-color:#e74747; }
.vp-ruby-navigation .vp-ruby-item { position:relative; display:flex; align-items:center; justify-content:flex-start; gap:9px; width:160px; height:32px; box-sizing:border-box; padding:3px 10px 3px 5px; border:0; border-radius:17px 0 0 17px; overflow:hidden; color:white; text-decoration:none; white-space:nowrap; font-family:inherit; font-size:calc(var(--eyebrow-font-size, 11px) - 2px); font-weight:var(--eyebrow-font-weight,500); letter-spacing:var(--eyebrow-letter-spacing,.12em); text-transform:uppercase; line-height:1; cursor:pointer; -webkit-tap-highlight-color:transparent; -webkit-appearance:none; appearance:none; background:linear-gradient(180deg,#343537 0%,#292a2c 24%,#202123 62%,#292a2c 100%); box-shadow:inset 0 2px 3px rgba(255,255,255,.12),inset 0 5px 9px rgba(0,0,0,.66),inset 0 -2px 4px rgba(255,255,255,.055),0 5px 12px rgba(0,0,0,.32); transform:translateX(125px); opacity:.4; transition:transform 500ms cubic-bezier(.22,1,.36,1),opacity 180ms ease,box-shadow 180ms ease; pointer-events:auto; will-change:transform; }
.vp-ruby-navigation .vp-ruby-icon { position:relative; z-index:1; display:grid; flex:0 0 22px; width:22px; height:22px; place-items:center; border-radius:50%; color:#fff; background:var(--ruby-color); box-shadow:inset 0 1px 1px rgba(255,255,255,.25),inset 0 -2px 3px rgba(0,0,0,.2); }
.vp-ruby-navigation .vp-ruby-icon svg { display:block; width:14px; height:14px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.vp-ruby-navigation .vp-ruby-icon-express-checkout svg { fill:currentColor; stroke:none; }
.vp-ruby-navigation .vp-ruby-label { position:relative; z-index:1; display:block; flex:1 1 auto; min-width:0; overflow:hidden; text-align:left; text-overflow:clip; opacity:0; pointer-events:none; transition:opacity 160ms ease; }
.vp-ruby-navigation .vp-ruby-item:hover,.vp-ruby-navigation .vp-ruby-item:focus-visible,.vp-ruby-navigation .vp-ruby-item.is-touch-open { transform:translateX(0); opacity:1; background:linear-gradient(90deg, #5b5f67 0%, #515357 50%, #383d49 90%, white 100%); box-shadow:0 1px 7px rgba(0, 0, 0, 0.75), 0 1px 7px rgba(0, 0, 0, 1); }
.vp-ruby-navigation .vp-ruby-item:hover .vp-ruby-label,.vp-ruby-navigation .vp-ruby-item:focus-visible .vp-ruby-label,.vp-ruby-navigation .vp-ruby-item.is-touch-open .vp-ruby-label { opacity:1; }
.vp-ruby-navigation .vp-ruby-item.is-active { background:linear-gradient(90deg, #44484f 0%, #216bff 50% 36%, #001a4d 100%, #2a2b2d 100%); }
.vp-ruby-navigation .vp-ruby-item:focus-visible { outline:1px solid rgba(255,255,255,.4); outline-offset:2px; }
.vp-ruby-navigation .vp-ruby-item:active,.vp-ruby-navigation .vp-ruby-item:focus:not(:focus-visible) { -webkit-tap-highlight-color:transparent; outline:none; }
@media (hover:none),(pointer:coarse) {
    .vp-ruby-navigation .vp-ruby-item { transform:translateX(155px); opacity:.4; transition:transform 200ms cubic-bezier(.22,1,.36,1); transition-delay:var(--ruby-delay,0ms); }
    .vp-ruby-navigation.is-open .vp-ruby-item.is-touch-open { transform:translateX(0); opacity:1; }
    .vp-ruby-navigation.is-open .vp-ruby-item.is-touch-open .vp-ruby-label { opacity:1; }
    .vp-ruby-navigation.is-open .vp-ruby-item { transition-delay:var(--ruby-delay,0ms); }
}
@media (max-height:340px) and (min-width:768px) {
    .vp-ruby-navigation { transform:translateY(-50%); gap:5px; }
    .vp-ruby-navigation .vp-ruby-item { min-height:26px; height:26px; }
    .vp-ruby-navigation .vp-ruby-icon { flex-basis:20px; width:20px; height:20px; }
    .vp-ruby-navigation .vp-ruby-icon svg { width:13px; height:13px; }
}
/* END: VIPENVPN Ruby Navigation */
/* START: VIPENVPN Express Checkout */
.express-checkout-page { padding:18px 0 72px; background:radial-gradient(circle at 88% 7%,rgba(236,72,153,.08),transparent 29%),radial-gradient(circle at 12% 22%,rgba(37,99,235,.06),transparent 28%),linear-gradient(180deg,#fbf9ff 0%,#fff 42%); }
.express-checkout-shell { width:min(1240px,calc(100% - 48px)); margin:0 auto; }
.express-checkout-hero { position:relative; display:flex; align-items:center; justify-content:space-between; gap:28px; min-height:190px; margin:0 0 28px; padding:28px 36px; overflow:hidden; isolation:isolate; border:1px solid rgba(255,255,255,.2); border-radius:24px; background:linear-gradient(118deg,#101827 0%,#203a68 43%,#4d2c83 74%,#9d2d78 100%); box-shadow:0 18px 42px rgba(25,34,73,.16); }
.express-checkout-hero:before { content:""; position:absolute; z-index:-1; inset:0; background:radial-gradient(circle at 82% 18%,rgba(255,255,255,.15),transparent 24%),linear-gradient(125deg,transparent 45%,rgba(255,255,255,.045) 70%,transparent); pointer-events:none; }
.express-checkout-hero-copy { position:relative; z-index:1; min-width:0; }
.express-checkout-hero .eyebrow,.express-checkout-hero h1 { color:#fff; }
.express-checkout-hero h1 { margin:8px 0 12px; font-size:clamp(34px,4.5vw,50px); line-height:1.05; letter-spacing:-.05em; }
.express-checkout-hero p { max-width:660px; margin:0; color:rgba(255,255,255,.8); font-size:14px; line-height:1.65; }
.express-checkout-hero-art { position:relative; z-index:1; display:flex; flex:0 0 250px; align-items:center; justify-content:center; width:250px; }
.express-checkout-hero-art svg { display:block; width:100%; height:auto; overflow:visible; filter:drop-shadow(0 10px 20px rgba(0,0,0,.12)); }
.express-checkout-step { min-width:0; margin:0 0 26px; padding:24px; border:1px solid #e1e7f0; border-radius:24px; background:rgba(255,255,255,.96); box-shadow:0 14px 36px rgba(26,48,89,.055); scroll-margin-top:22px; }
.express-checkout-step.is-locked { opacity:.76; }
.express-step-heading { display:flex; align-items:center; gap:13px; margin:0 0 20px; }
.express-step-heading>span { display:grid; flex:0 0 38px; width:38px; height:38px; place-items:center; border-radius:12px; background:linear-gradient(135deg,#102f6b,#2375c8); color:#fff; font-size:12px; font-weight:850; box-shadow:0 7px 16px rgba(30,89,160,.16); }
.express-step-heading h2 { margin:0 0 3px; color:#17233a; font-size:clamp(20px,2.4vw,26px); line-height:1.2; letter-spacing:-.035em; }
.express-step-heading p { margin:0; color:#7b8494; font-size:12px; line-height:1.5; }
.express-filter-form { grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; margin:0 0 22px; }
.express-plan-carousel { display:grid; grid-template-columns:42px minmax(0,1fr) 42px; align-items:center; gap:12px; min-width:0; }
.express-plan-track { display:grid; grid-auto-columns:320px; grid-auto-flow:column; gap:16px; min-width:0; padding:5px 3px 14px; overflow-x:auto; overflow-y:hidden; background:transparent!important; border:0!important; box-shadow:none!important; overscroll-behavior-x:contain; scroll-snap-type:x mandatory; scrollbar-width:thin; scrollbar-color:#b9c9df transparent; }
.express-plan-card { min-width:0; width:320px; max-width:100%; scroll-snap-align:center; cursor:pointer; background:#fff; box-shadow:none!important; -webkit-tap-highlight-color:transparent; background-clip:padding-box; }
.express-plan-card.is-selected { background:#edf5ff; box-shadow:none!important; }
.express-plan-card:active,.express-checkout-page .express-server-grid .server-location-card:active { -webkit-tap-highlight-color:transparent; }
.express-plan-card .pricing-card-body { display:flex; flex-direction:column; min-height:100%; }
.express-plan-card .pricing-buy { width:100%; box-sizing:border-box; margin-top:20px; border:0; font-family:inherit; cursor:pointer; }
.express-carousel-arrow { display:grid; width:42px; height:42px; place-items:center; padding:0; border:1px solid #dbe4ef; border-radius:50%; background:#fff; color:#244a7b; font-size:27px; line-height:1; cursor:pointer; box-shadow:0 7px 18px rgba(20,55,105,.09); }
.express-carousel-arrow:hover:not(:disabled) { background:#173e78; color:#fff; }
.express-carousel-arrow:disabled { opacity:.38; cursor:default; box-shadow:none; }
.express-region-filters { gap:10px; margin:0 0 20px; }
.express-server-grid { grid-template-columns:repeat(auto-fill,minmax(min(100%,190px),1fr)); gap:12px; }
.express-server-grid [hidden],.express-plan-card[hidden] { display:none!important; }
.express-checkout-page .express-server-grid .server-location-card { width:100%; max-width:none; min-width:0; min-height:112px; padding:10px 12px; gap:8px; grid-template-columns:100px minmax(0,1fr); justify-self:stretch; -webkit-tap-highlight-color:transparent; background-clip:padding-box; }
.payment-page .payment-checkout-grid.express-payment-grid { display:block; margin:0; padding:0; border:0; background:transparent; box-shadow:none; }
.express-checkout-page .payment-discount-inline { margin:0 0 16px; }
.express-checkout-page .payment-discount-inline-form { display:flex; align-items:stretch; gap:12px; }
.express-checkout-page .payment-discount-inline-field { min-width:0; flex: 1 1 auto; grid-template-columns: minmax(0,1fr); }
.express-checkout-page .payment-discount-inline-form > button { flex:0 0 180px; width:180px; min-width:180px; box-sizing:border-box; padding:0 8px; font-size:11px; white-space:nowrap; }
.express-checkout-page .payment-gateway-grid { margin-top:0; }
.express-checkout-page .payment-gateway-panel-section { margin-top:18px; }
.express-checkout-page .payment-error-card,.express-checkout-page .payment-success-card { margin:20px 0 0; }
.express-checkout-page .payment-error-card strong,.express-checkout-page .payment-success-card strong { font-size:17px; line-height:1.35; }
.express-checkout-page .payment-error-card p,.express-checkout-page .payment-success-card p { margin-top:7px; font-size:12px; line-height:1.55; }
[dir="rtl"] .express-checkout-hero { text-align:right; }
[dir="rtl"] .express-plan-track { direction:rtl; }
@media(max-width:1000px) {
    .express-server-grid { grid-template-columns:repeat(auto-fill,minmax(min(100%,190px),1fr)); }
}
@media(max-width:850px) {
    .express-plan-track { grid-auto-columns:300px; }
    .express-plan-card { width:300px; }
    .express-server-grid { grid-template-columns:repeat(auto-fill,minmax(min(100%,190px),1fr)); }
}
@media(max-width:700px) {
    .express-checkout-shell { width:calc(100% - 32px); }
    .express-checkout-page { padding-top:8px; }
    .express-checkout-hero { min-height:150px; gap:8px; margin:0 0 22px; padding:22px 20px; border-radius:18px; }
    .express-checkout-hero h1 { font-size:clamp(28px,7vw,36px); }
    .express-checkout-hero p { max-width:360px; font-size:12px; }
    .express-checkout-hero-art { flex-basis:34%; width:34%; min-width:90px; }
    .express-checkout-step { padding:18px 16px; margin-bottom:22px; border-radius:19px; }
    .express-filter-form { grid-template-columns:1fr; gap:10px; margin-bottom:16px; }
    .express-plan-carousel { grid-template-columns:34px minmax(0,1fr) 34px; gap:7px; }
    .express-carousel-arrow { width:34px; height:34px; font-size:23px; }
    .express-plan-track { grid-auto-columns:100%; gap:12px; padding:4px 2px 12px; }
    .express-plan-card { width:100%; }
    .express-server-grid { grid-template-columns:repeat(auto-fill,minmax(min(100%,190px),1fr)); gap:12px; }
    .express-checkout-page .express-server-grid .server-location-card-copy { gap:7px; }
    .express-checkout-page .express-server-grid .server-location-card-arrow { display:none; }
    .express-checkout-page .payment-discount-inline-form { gap:8px; }
    .express-checkout-page .payment-discount-inline-field input { padding:0 20px; font-size:12px; }
    .express-checkout-page .payment-discount-inline-form > button { flex-basis:136px; width:136px; min-width:136px; padding:0 6px; font-size:10px; }
}
@media(max-width:390px) {
    .express-checkout-shell { width:calc(100% - 24px); }
    .express-checkout-hero { padding:19px 15px; }
    .express-checkout-hero-art { min-width:72px; }
    .express-checkout-step { padding:15px 12px; }
    .express-plan-carousel { grid-template-columns:30px minmax(0,1fr) 30px; gap:5px; }
    .express-carousel-arrow { width:30px; height:30px; }
    .express-checkout-page .payment-discount-inline-form { gap:6px; }
    .express-checkout-page .payment-discount-inline-form > button { flex-basis:124px; width:124px; min-width:124px; padding:0 5px; font-size:9px; }
}
@media(min-width:701px) {
    .express-checkout-page .payment-gateway-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
    .express-checkout-page .express-lucky-wheel-trigger { flex:0 0 180px; width:180px; min-width:180px; box-sizing:border-box; white-space:nowrap; }
    .express-checkout-page .payment-discount-inline-form > button { flex:0 0 180px; width:180px; min-width:180px; margin-inline-end:16px; box-sizing:border-box; white-space:nowrap; }
}
/* END: VIPENVPN Express Checkout */
/* START: WHEEL OF FORTUNE */
.lucky-wheel-page { --wheel-size:66%; --wheel-position-x:16.2%; --wheel-position-y:17.5%; --wheel-center-x:252; --wheel-center-y:268; --wheel-radius:247; --wheel-hub-radius:79.5; --wheel-hub-offset-x:0; --wheel-hub-offset-y:0; --wheel-center-size:168; --wheel-center-offset-x:0; --wheel-center-offset-y:0; --wheel-pointer-width:68; --wheel-pointer-offset-x:0; --wheel-pointer-offset-y:-38; --wheel-slice-red:#e51e35; --wheel-slice-red-dark:#bd0b24; --wheel-slice-red-light:#ff5265; --wheel-slice-cream:#f4d47c; --wheel-slice-cream-dark:#e4bd58; --wheel-slice-cream-light:#fff0b7; --wheel-slice-border:#5c3517; --wheel-slice-cream-text:#5a2810; --wheel-slice-red-text:#fff0bf; --wheel-pointer-shadow:0 10px 5px rgba(50,50,50,.7); --wheel-center-shadow:0 0px 20px rgb(0 0 0 / 100%); --wheel-outer-shadow-color:#3b1d08; --wheel-outer-shadow-blur:5px; --wheel-inner-shadow:0 10px 5px rgba(50,50,50,.7); min-height:100vh; margin:0; overflow-x:hidden; background:#fff; color:#242424; }
.lucky-wheel-page .lucky-wheel-shell { display:flex; align-items:flex-start; justify-content:center; width:min(calc(100% - 32px),420px); min-height:0; margin:12px auto; padding:0; box-sizing:border-box; border:0; border-radius:20px; background:transparent; box-shadow:none; }
.lucky-wheel-page .lucky-wheel-layout { display:flex; flex-direction:column; align-items:center; gap:0; width:100%; min-width:0; }
.lucky-wheel-page .lucky-wheel-art { position:relative; width:100%; aspect-ratio:768/1536; flex:0 0 auto; isolation:isolate; overflow:hidden; border:1px solid rgba(142,102,31,.24); border-radius:18px; background:#d7ad60; box-shadow:0 16px 38px rgba(29,24,15,.2),inset 0 1px 0 rgba(255,255,255,.8); }
.lucky-wheel-page .lucky-wheel-background { position:absolute; inset:0; z-index:0; display:block; width:100%; height:100%; object-fit:fill; }
.lucky-wheel-page .lucky-wheel-celebration { position:absolute; inset:0; z-index:10; display:block; width:100%; height:100%; pointer-events:none; }
.lucky-wheel-page .lucky-wheel-art.is-celebrating { animation:lucky-wheel-celebration-glow .48s ease-out 2; }
@keyframes lucky-wheel-celebration-glow {
    0%,100% { filter:none; }
    45% { filter:drop-shadow(0 0 12px rgba(255,210,87,.7)) brightness(1.035); }
}
.lucky-wheel-page .lucky-wheel-svg { position:absolute; z-index:2; left:var(--wheel-position-x); top:var(--wheel-position-y); display:block; width:calc(var(--wheel-size) + 4.05%); height:auto; overflow:visible; transform:rotate(0deg); transform-origin:50% 50%; will-change:transform; }
.lucky-wheel-page .lucky-wheel-center { position:absolute; z-index:3; display:block; max-width:none; object-fit:fill; pointer-events:none; user-select:none; filter:drop-shadow(var(--wheel-center-shadow)); transform:rotate(0deg); transform-origin:50% 50%; will-change:transform; }
.lucky-wheel-page .lucky-wheel-pointer { position:absolute; z-index:4; display:block; max-width:none; object-fit:fill; pointer-events:none; user-select:none; filter:drop-shadow(var(--wheel-pointer-shadow)); }
.lucky-wheel-page .lucky-wheel-panel { position:absolute; z-index:4; left:6%; bottom:6%; display:grid; gap:12px; width:88%; padding:0; box-sizing:border-box; border:0; border-radius:0; background:transparent; box-shadow:none; }
.lucky-wheel-page .lucky-wheel-spin { position:relative; display:flex; align-items:center; justify-content:center; gap:9px; width:100%; min-height:42px; margin:0; padding:8px 12px; touch-action:none; -webkit-touch-callout:none; -webkit-user-select:none; user-select:none; border:1px solid #b58a36; border-radius:10px; background:linear-gradient(135deg,#fff0b1 0%,#c9a14b 43%,#f5df96 100%); color:#2b210e; font:inherit; font-size:12px; font-weight:900; letter-spacing:.07em; cursor:pointer; box-shadow:0 4px 12px rgba(91,58,8,.2),inset 0 1px 0 rgba(255,255,255,.85); transition:transform .18s ease,filter .18s ease,box-shadow .18s ease; }
.lucky-wheel-page .lucky-wheel-spin:hover:not(:disabled) { transform:translateY(-1px); filter:brightness(1.05); }
.lucky-wheel-page .lucky-wheel-spin:focus-visible { outline:3px solid rgba(245,218,143,.75); outline-offset:3px; }
.lucky-wheel-page .lucky-wheel-spin:disabled { cursor:not-allowed; opacity:.78; filter:saturate(.72); }
.lucky-wheel-page .lucky-wheel-spin.is-pressing { transform:translateY(1px) scale(.99); filter:brightness(.96); box-shadow:0 2px 6px rgba(91,58,8,.24),inset 0 2px 5px rgba(91,58,8,.16); }
.lucky-wheel-page .lucky-wheel-hold-progress { display:block; width:100%; height:7px; margin:0 0 -4px; overflow:hidden; border:1px solid rgba(83,52,12,.55); border-radius:999px; background:rgba(63,43,14,.28); box-shadow:inset 0 1px 3px rgba(54,30,4,.35),0 1px 2px rgba(255,255,255,.28); }
.lucky-wheel-page .lucky-wheel-hold-progress[hidden] { display:none; }
.lucky-wheel-page .lucky-wheel-hold-progress-fill { display:block; width:100%; height:100%; border-radius:inherit; background:linear-gradient(90deg,#16a34a 0%,#16a34a 100%); transform:scaleX(0); transform-origin:left center; will-change:transform; }
.lucky-wheel-page .lucky-wheel-instructions { display:flex; position:relative; align-items:center; justify-content:center; flex-wrap:wrap; gap:6px; margin:0 2px 7px; color:#fff3d0; font-size:10px; font-weight:600; line-height:1.45; text-align:center; text-shadow:0 1px 4px rgba(54,30,4,.9); user-select:none; }
.lucky-wheel-page .lucky-wheel-instructions strong { color:#fff0bd; font-size:12px; font-weight:900; letter-spacing:.025em; }
.lucky-wheel-page .lucky-wheel-help { width:19px; height:19px; font-size:11px; }
.lucky-wheel-page .lucky-wheel-instructions .ui-tooltip-content { text-shadow:none; user-select:text; }
.lucky-wheel-page .lucky-wheel-svg, .lucky-wheel-page .lucky-wheel-center { touch-action:none; user-select:none; -webkit-user-select:none; }
.lucky-wheel-page .lucky-wheel-svg > g { transform-box:view-box; will-change:transform; }
.lucky-wheel-page .lucky-wheel-svg { cursor:grab; aspect-ratio: 1; }
.lucky-wheel-page .lucky-wheel-svg:active { cursor:grabbing; }
.lucky-wheel-page .lucky-wheel-button-icon { display:grid; place-items:center; width:23px; height:23px; border:1px solid rgba(61,42,14,.25); border-radius:50%; font-size:18px; line-height:1; }
.lucky-wheel-page .lucky-wheel-status { min-height:0; margin:1px 0 3px; color:#fff8e4; font-size:11px; font-weight:700; line-height:1.35; text-align:center; text-shadow:0 1px 4px rgba(54,30,4,.8); }
.lucky-wheel-page .lucky-wheel-current-prize { display:grid; grid-template-columns:1fr auto; gap:3px 10px; align-items:center; padding:8px 10px; border:1px solid rgba(255,230,165,.78); border-radius:10px; background:rgba(77,47,11,.76); box-shadow:0 4px 12px rgba(58,34,6,.18),inset 0 1px 0 rgba(255,255,255,.22); backdrop-filter:blur(3px); -webkit-backdrop-filter:blur(3px); }
.lucky-wheel-page .lucky-wheel-current-prize>span { color:#fff0c4; font-size:9px; font-weight:900; letter-spacing:.12em; }
.lucky-wheel-page .lucky-wheel-current-prize strong { grid-column:2; grid-row:1 / span 2; color:#fff1b3; font-size:22px; font-weight:950; letter-spacing:-.04em; }
.lucky-wheel-page .lucky-wheel-current-prize small { color:#fff6df; font-size:10px; line-height:1.4; }
.lucky-wheel-page .lucky-wheel-current-prize.is-active { border-color:#f5d98a; background:rgba(91,59,14,.84); }
.lucky-wheel-page .lucky-wheel-current-prize.is-active strong { color:#ffe69a; }
.lucky-wheel-modal-page { min-height:0; height:auto; overflow-x:hidden; overflow-y:hidden; background:transparent; }
.lucky-wheel-modal-page .lucky-wheel-shell { width:100%; max-width:none; min-height:0; margin:0 auto; padding:0; }
.lucky-wheel-modal-page .lucky-wheel-layout { gap:0; }
.lucky-wheel-modal-page .lucky-wheel-art { width:100%; }
.lucky-wheel-modal-page .lucky-wheel-panel { width:88%; }
[dir="rtl"] .lucky-wheel-page .lucky-wheel-panel { text-align:right; }
@media(max-width:700px) {
    .lucky-wheel-page .lucky-wheel-shell { width:calc(100% - 32px); margin:8px auto; }
    .lucky-wheel-page .lucky-wheel-art { border-radius:15px; }
    .lucky-wheel-page .lucky-wheel-svg { left:var(--wheel-position-x); top:var(--wheel-position-y); width:calc(var(--wheel-size) + 4.05%); }
    .lucky-wheel-page .lucky-wheel-spin { min-height:38px; padding:6px 9px; font-size:11px; }
    .lucky-wheel-page .lucky-wheel-status { font-size:10px; }
    .lucky-wheel-page .lucky-wheel-instructions { gap:4px; margin-bottom:6px; font-size:9px; line-height:1.4; }
    .lucky-wheel-page .lucky-wheel-instructions strong { font-size:11px; }
    .lucky-wheel-page .lucky-wheel-current-prize { padding:7px 9px; }
    .lucky-wheel-page .lucky-wheel-current-prize strong { font-size:19px; }
    .lucky-wheel-modal-page .lucky-wheel-shell { width:100%; margin:0 auto; }
}
@media(max-height:700px) {
    .lucky-wheel-page .lucky-wheel-shell { width:min(calc(100% - 32px),calc((100dvh - 24px)/2),420px); margin:8px auto; }
    .lucky-wheel-page .lucky-wheel-svg { left:var(--wheel-position-x); top:var(--wheel-position-y); width:calc(var(--wheel-size) + 4.05%); }
    .lucky-wheel-modal-page .lucky-wheel-shell { width:100%; max-width:none; }
}

/* END: WHEEL OF FORTUNE */
/* START: EXPRESS CHECKOUT LUCKY WHEEL MODAL */
.express-lucky-wheel-entry { display:flex; align-items:center; justify-content:space-between; gap:18px; margin:0 0 16px; padding:15px 17px; border:1px solid #e9dfc5; border-radius:16px; background:linear-gradient(115deg,#fffdf6 0%,#fff 58%,#f9f4e7 100%); }
.express-lucky-wheel-copy { display:grid; gap:4px; min-width:0; }
.express-lucky-wheel-copy strong { color:#29261f; font-size:13px; font-weight:850; }
.express-lucky-wheel-copy span { color:#777168; font-size:11px; line-height:1.5; }
.express-wheel-discount-applied { display:flex; align-items:flex-start; gap:12px; margin:0 0 14px; padding:15px 17px; border:1px solid #a9dec6; border-radius:15px; background:linear-gradient(120deg,#f0fff7 0%,#fff 58%,#f1fbf6 100%); color:#174b37; box-shadow:0 5px 18px rgba(24,117,78,.07); }
.express-wheel-discount-applied .payment-discount-applied-mark { display:grid; place-items:center; flex:0 0 28px; width:28px; height:28px; border-radius:50%; background:linear-gradient(135deg,#26a66a,#087c4a); color:#fff; font-weight:900; box-shadow:0 3px 9px rgba(8,124,74,.2); }
.express-wheel-discount-applied>div { display:grid; gap:5px; min-width:0; }
.express-wheel-discount-applied strong { color:#12633f; font-size:13px; font-weight:850; line-height:1.4; }
.express-wheel-discount-applied small { color:#416657; font-size:12px; line-height:1.65; overflow-wrap:anywhere; }
.express-lucky-wheel-cooldown { display:grid; gap:5px; flex:0 1 55%; min-width:0; padding:11px 14px; border:1px solid #d8e3f0; border-radius:12px; background:linear-gradient(135deg,#f7faff,#edf4fc); color:#274363; }
.express-lucky-wheel-cooldown strong { font-size:12px; font-weight:850; line-height:1.45; }
.express-lucky-wheel-cooldown time { font-size:12px; font-weight:750; color:#315f94; line-height:1.5; }
.express-wheel-refresh-error { margin:10px 0; }
.express-lucky-wheel-trigger { display:inline-flex; align-items:center; justify-content:center; gap:9px; flex:0 0 auto; min-height:42px; padding:10px 15px; border:1px solid #a77c2e; border-radius:12px; background:linear-gradient(135deg,#f9e8a7 0%,#d1a64e 48%,#f2d781 100%); color:#2e220d; font:inherit; font-size:12px; font-weight:900; cursor:pointer; box-shadow:0 6px 15px rgba(151,111,38,.16),inset 0 1px 0 rgba(255,255,255,.8); transition:transform .16s ease,filter .16s ease,box-shadow .16s ease; }
.express-lucky-wheel-trigger:hover { transform:translateY(-1px); filter:brightness(1.035); box-shadow:0 9px 18px rgba(151,111,38,.22),inset 0 1px 0 rgba(255,255,255,.8); }
.express-lucky-wheel-trigger>span { font-size:17px; line-height:1; }
.express-lucky-wheel-modal[hidden] { display:none !important; }
.express-lucky-wheel-modal { position:fixed; z-index:2000; inset:0; display:grid; place-items:center; padding:16px; box-sizing:border-box; }
.express-lucky-wheel-backdrop { position:absolute; inset:0; width:100%; height:100%; padding:0; border:0; background:rgba(14,16,22,.62); backdrop-filter:blur(3px); -webkit-backdrop-filter:blur(3px); cursor:pointer; }
.express-lucky-wheel-dialog { position:relative; z-index:1; display:flex; flex-direction:column; width:min(420px,calc(100vw - 32px)); height:auto; max-height:calc(100dvh - 24px); overflow:visible; border:0; border-radius:0; background:transparent; box-shadow:none; animation:none; }
.express-lucky-wheel-close { position:absolute; z-index:3; top:14px; right:14px; display:grid; place-items:center; width:28px; height:28px; padding:0 0 2px; border:1px solid rgba(177,130,39,.72); border-radius:50%; background:radial-gradient(circle at 30% 24%,#fff9df 0%,#f5d98d 48%,#d5a94d 100%); color:#a52a24; font:700 22px/1 Arial,sans-serif; box-shadow:0 2px 5px rgba(68,45,10,.22),inset 0 1px 0 rgba(255,255,255,.9); cursor:pointer; -webkit-tap-highlight-color:transparent; }
.express-lucky-wheel-close:focus-visible { outline:2px solid #fff; outline-offset:2px; }
.express-lucky-wheel-frame { display:block; width:100%; height:760px; min-height:0; flex:0 0 auto; border:0; background:transparent; transition:none; }
body.express-lucky-wheel-open { overflow:hidden; }
@keyframes express-lucky-wheel-enter {
    from { opacity:1; transform:none; }
    to { opacity:1; transform:none; }
}
[dir="rtl"] .express-lucky-wheel-entry { text-align:right; }
@media(max-width:700px) {
    .express-lucky-wheel-entry { align-items:stretch; flex-direction:column; gap:12px; padding:14px; }
    .express-lucky-wheel-trigger { width:100%; }
    .express-lucky-wheel-modal { padding:12px; }
    .express-lucky-wheel-dialog { width:min(420px,calc(100vw - 56px)); max-width:420px; }
    .express-lucky-wheel-close { width:28px; height:28px; font-size:22px; }
    .express-lucky-wheel-frame { height:min(840px,calc((100dvh - 24px))); }
    .express-checkout-page .express-server-grid { grid-template-columns:repeat(auto-fill,minmax(min(100%,190px),1fr)); gap:12px; }
    .express-checkout-page .express-server-grid .server-location-card { gap:8px; padding:10px 12px; }
    .express-checkout-page .express-server-grid .server-location-flag-wrap { width:100px; height:70px; flex-basis:100px; }
    .express-checkout-page .express-server-grid .express-checkout-page .express-server-grid .server-location-check { width:70px; height:70px; font-size:30px; }
    .express-checkout-page .express-server-grid .express-checkout-page .express-server-grid .server-location-card-copy small { font-size:13px; }
}


/* END: EXPRESS CHECKOUT LUCKY WHEEL MODAL */
/* VIPENVPN purchase-page tap feedback fix */
.pricing-page button,.pricing-page a,.server-location-page button,.server-location-page a,.payment-page button,.payment-page a { -webkit-tap-highlight-color:transparent; background-clip:padding-box; }
.pricing-page button,.server-location-page button,.payment-page button { -webkit-appearance:none; appearance:none; }
.server-location-page .server-location-grid .server-location-card[hidden] { display:none!important; }
.pricing-page button:active,.pricing-page a:active,.server-location-page button:active,.server-location-page a:active,.payment-page button:active,.payment-page a:active { -webkit-tap-highlight-color:transparent; }
/* Checkout discount input focus: replace browser's sharp default outline with a soft, rounded focus ring. */
.express-checkout-page .payment-discount-inline-field:focus-within,.payment-page .payment-discount-inline-field:focus-within { border-color:#9bbce8; border-radius:15px; box-shadow:0 0 0 3px rgba(59,130,246,.13); }
.express-checkout-page .payment-discount-inline-field input:focus,.payment-page .payment-discount-inline-field input:focus { outline:none!important; box-shadow:none!important; }

/* START: VIPENVPN SESSION REPLAY ENGINE */
/* Session replay viewer and admin index: responsive controls, safe replay canvas, metadata and pagination. */
.session-replay-shell { width:min(1540px,100%); margin:0 auto; padding:30px 32px 42px; }
.session-replay-heading { align-items:center; flex-wrap:wrap; }
.session-replay-heading-actions { display:flex; align-items:center; justify-content:flex-end; gap:10px; flex-wrap:wrap; }
.session-replay-meta { padding:16px 18px; }
.session-replay-meta-grid { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:14px; }
.session-replay-meta-grid>div { display:grid; gap:5px; min-width:0; padding:12px; border:1px solid var(--adm-border); border-radius:10px; background:var(--adm-surface-2); }
.session-replay-meta-grid span { color:var(--adm-muted); font-size:10px; font-weight:700; }
.session-replay-meta-grid strong { min-width:0; color:var(--adm-text); font-size:12px; overflow-wrap:anywhere; }
.session-replay-player-panel { padding:18px; }
.session-replay-toolbar { display:flex; align-items:center; gap:14px; flex-wrap:wrap; }
.session-replay-main-controls { display:flex; align-items:center; gap:8px; }
.session-replay-speed-label { display:flex; align-items:center; gap:8px; margin-left:auto; color:var(--adm-muted); font-size:11px; font-weight:750; }
.session-replay-speed-label select { min-height:36px; padding:0 10px; border:1px solid var(--adm-border); border-radius:8px; background:var(--adm-surface-2); color:var(--adm-text); }
.session-replay-time { color:var(--adm-text); font-size:11px; font-variant-numeric:tabular-nums; font-weight:800; }
.session-replay-timeline { display:block; width:100%; height:24px; margin:17px 0; accent-color:var(--adm-accent); cursor:pointer; }
.session-replay-stage { position:relative; display:block; width:100%; max-width:100%; min-height:0; margin-inline:auto; overflow:hidden; border:1px solid var(--adm-border); border-radius:11px; background:#fff; isolation:isolate; box-sizing:border-box; }
.session-replay-stage.is-no-snapshot { background:var(--adm-surface-2,#171b24); }
.session-replay-stage.is-no-snapshot .session-replay-frame,.session-replay-stage.is-no-snapshot .session-replay-no-snapshot { display:none; }
.session-replay-frame { display:block; width:100%; height:100%; min-height:0; border:0; background:#fff; }
.session-replay-no-snapshot { position:absolute; z-index:2; inset:0; display:flex; align-items:center; justify-content:center; padding:24px; color:#596273; background:#f7f8fa; font-size:13px; font-weight:700; text-align:center; }
.session-replay-cursor { position:absolute; z-index:4; display:none; width:17px; height:17px; border:2px solid #fff; border-radius:50%; background:rgba(255,98,60,.72); box-shadow:0 0 0 2px rgba(255,98,60,.65),0 2px 8px rgba(0,0,0,.25); pointer-events:none; transform:translate(-50%,-50%); }
.session-replay-event-status { display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin-top:14px; padding:12px 14px; border:1px solid var(--adm-border); border-radius:9px; background:var(--adm-surface-2); }
.session-replay-event-status strong { color:var(--adm-accent); font-size:11px; text-transform:capitalize; }
.session-replay-event-status span { min-width:0; color:var(--adm-muted); font-size:11px; overflow-wrap:anywhere; }
.session-replay-note { margin:12px 0 0; color:var(--adm-muted); font-size:10px; line-height:1.65; }
.session-replay-list-panel .admin-panel-heading { align-items:center; flex-wrap:wrap; }
.session-replay-search { display:flex; align-items:center; gap:7px; flex-wrap:wrap; }
.session-replay-search input[type="search"] { width:min(260px,60vw); min-height:39px; padding:0 11px; border:1px solid var(--adm-border); border-radius:9px; background:var(--adm-surface-2); color:var(--adm-text); font-size:11px; }
.session-replay-search input[type="search"]::placeholder { color:var(--adm-muted); }
.session-replay-path { display:block; max-width:190px; overflow:hidden; text-overflow:ellipsis; }
.session-replay-table th,.session-replay-table td { vertical-align:middle; }
.session-replay-table { min-width:1450px; }
.session-replay-country,.session-replay-device { display:inline-block; white-space:nowrap; font-size:11px; font-weight:650; }
.session-replay-country { min-width:190px; }
.session-replay-device { min-width:145px; }
.session-replay-pagination { display:flex; align-items:center; justify-content:center; gap:14px; padding:15px; border-top:1px solid var(--adm-border); color:var(--adm-muted); font-size:11px; }
@media (max-width:900px) { .session-replay-shell { padding:22px 18px 32px; } .session-replay-meta-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } .session-replay-toolbar { gap:10px; } .session-replay-speed-label { margin-left:0; } }
@media (max-width:560px) { .session-replay-shell { padding:18px 12px 26px; } .session-replay-player-panel { padding:12px; } .session-replay-meta { padding:11px; } .session-replay-meta-grid { gap:8px; } .session-replay-meta-grid>div { padding:10px; } .session-replay-heading-actions { justify-content:flex-start; } .session-replay-toolbar { align-items:flex-start; } .session-replay-main-controls { width:100%; } .session-replay-speed-label { flex:1; } .session-replay-time { margin-left:auto; } .session-replay-stage,.session-replay-frame { min-height:0; } .session-replay-list-panel .admin-panel-heading { align-items:stretch; } .session-replay-search { width:100%; } .session-replay-search input[type="search"] { flex:1; min-width:120px; width:auto; } .session-replay-pagination { gap:7px; flex-wrap:wrap; } }
/* END: VIPENVPN SESSION REPLAY ENGINE */

/* VIPENVPN ADMIN SESSION REPLAY TABLE AND MOBILE SIDEBAR FIXES */
.session-replay-country { min-width:130px; }
.session-replay-device { min-width:118px; }
.session-replay-table th:nth-child(2),.session-replay-table td:nth-child(2) { width:145px; max-width:145px; }
.session-replay-table th:nth-child(3),.session-replay-table td:nth-child(3) { width:135px; max-width:135px; }
.admin-sidebar-overlay { display:none; }
@media(max-width:760px) {
.admin-sidebar-overlay { display:block; position:fixed; z-index:39; inset:0; width:100%; height:100%; padding:0; border:0; background:rgba(17,24,39,.42); opacity:0; visibility:hidden; pointer-events:none; transition:opacity .2s ease,visibility .2s ease; }
.admin-sidebar-overlay.is-visible { opacity:1; visibility:visible; pointer-events:auto; }
.admin-sidebar { z-index:40; }
html[dir="rtl"] .admin-sidebar-overlay { inset:0; }
}

/* START: VIPENVPN website AI voice messages and archive */
.support-float-mic{width:40px;height:40px;flex:0 0 40px;display:grid;place-items:center;border:1px solid rgba(20,70,87,.11);border-radius:13px;background:#fff;color:#536b77;cursor:pointer;transition:background .2s ease,color .2s ease,border-color .2s ease,transform .2s ease}.support-float-mic svg{width:19px;height:19px}.support-float-mic:hover{background:#eefbfc;color:#126a7b;border-color:rgba(18,106,123,.25)}.support-float-mic:disabled{opacity:.45;cursor:not-allowed}.support-float-mic.is-recording{background:#fff0ef;color:#d74739;border-color:rgba(215,71,57,.32);animation:supportFloatMicPulse 1.1s ease-in-out infinite}.support-float-recording,.support-float-voice-preview{margin:0 10px 8px;padding:9px 11px;border:1px solid rgba(18,106,123,.14);border-radius:13px;background:#f0fafb;color:#294650;font-size:11px}.support-float-recording{display:flex;align-items:center;gap:8px}.support-float-recording[hidden],.support-float-voice-preview[hidden]{display:none!important}.support-float-recording-dot{width:8px;height:8px;flex:0 0 8px;border-radius:50%;background:#e64d43;box-shadow:0 0 0 4px rgba(230,77,67,.12);animation:supportFloatMicPulse 1s ease-in-out infinite}.support-float-recording button,.support-float-voice-preview button{border:0;border-radius:8px;padding:6px 9px;background:#e5f2f4;color:#24515e;font:inherit;font-weight:750;cursor:pointer}.support-float-recording button:first-of-type,.support-float-voice-preview button:first-child{margin-inline-start:auto;background:#5b50c7;color:#fff}.support-float-recording button:disabled,.support-float-voice-preview button:disabled{opacity:.5;cursor:not-allowed}.support-float-voice-preview{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.support-float-voice-preview audio{width:100%;height:34px}.support-float-voice-preview>div{display:flex;justify-content:flex-end;gap:7px;width:100%}.support-float-voice-label{display:block;font-weight:800;margin-bottom:5px}.support-float-bubble audio{display:block;width:min(250px,62vw);max-width:100%;height:34px;margin-top:3px}.support-float-message.is-user .support-float-bubble audio{filter:invert(.9) hue-rotate(155deg) saturate(.65)}@keyframes supportFloatMicPulse{0%,100%{box-shadow:0 0 0 0 rgba(215,71,57,0)}50%{box-shadow:0 0 0 4px rgba(215,71,57,.11)}}
.admin-ai-log-heading{margin-top:34px}.admin-ai-log-panel{overflow:hidden}.admin-ai-log-list{display:grid;gap:14px}.admin-ai-log-item{padding:18px;border:1px solid var(--admin-border,rgba(20,45,65,.12));border-radius:14px;background:var(--admin-card,#fff)}.admin-ai-log-meta,.admin-ai-log-meta>div,.admin-ai-log-identifiers{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.admin-ai-log-meta{justify-content:space-between;gap:12px;margin-bottom:10px;color:var(--admin-muted,#667887);font-size:12px}.admin-ai-log-meta>div{min-width:0}.admin-ai-log-meta strong{color:var(--admin-text,#172c3a)}.admin-ai-log-kind{font-size:10px;font-weight:850;letter-spacing:.08em;color:#156b7b}.admin-ai-log-identifiers{font-size:11px;color:var(--admin-muted,#667887);margin-bottom:15px}.admin-ai-log-identifiers code{overflow-wrap:anywhere}.admin-ai-log-columns{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:14px}.admin-ai-log-columns>section{min-width:0;padding:13px;border-radius:10px;background:var(--admin-soft,#f6f8fa)}.admin-ai-log-columns h3{margin:0 0 7px;font-size:12px;color:var(--admin-text,#233c4b)}.admin-ai-log-columns p{margin:0;max-height:260px;overflow:auto;white-space:normal;overflow-wrap:anywhere;font-size:12px;line-height:1.65;color:var(--admin-muted,#526675)}.admin-ai-log-audio{margin-top:12px;padding-top:10px;border-top:1px solid rgba(20,45,65,.1);font-size:11px;color:var(--admin-text,#233c4b)}.admin-ai-audio{display:block;width:100%;max-width:440px;height:36px;margin-top:8px}.admin-ai-diagnostics{margin-top:12px;font-size:11px}.admin-ai-diagnostics summary{cursor:pointer;font-weight:750;color:var(--admin-accent,#5146ba)}.admin-ai-diagnostics pre{max-height:260px;overflow:auto;padding:10px;border-radius:8px;background:#101c27;color:#e2f1f8;font:10px/1.55 ui-monospace,SFMono-Regular,Consolas,monospace;white-space:pre-wrap;overflow-wrap:anywhere}@media(max-width:760px){.admin-ai-log-item{padding:12px}.admin-ai-log-columns{grid-template-columns:minmax(0,1fr)}.admin-ai-log-meta{align-items:flex-start}.admin-ai-log-identifiers{display:grid;gap:5px}.support-float-recording{flex-wrap:wrap}.support-float-recording button{padding:6px 8px}}
/* END: VIPENVPN website AI voice messages and archive */
/* VIPENVPN AI chat refinements: always animate the typing indicator and make new-chat action unmistakable. */
.support-float-thinking{display:inline-flex!important;align-items:center!important;justify-content:center!important;gap:5px!important;min-width:34px!important;height:16px!important;overflow:visible!important}
.support-float-thinking i{display:block!important;flex:0 0 7px!important;width:7px!important;height:7px!important;min-width:7px!important;min-height:7px!important;border-radius:50%!important;background:#278da2!important;opacity:1!important;transform:translateY(0)!important;animation:supportFloatDotsForce .72s ease-in-out infinite!important;animation-play-state:running!important;will-change:transform!important}
.support-float-thinking i:nth-child(2){animation-delay:.14s!important}
.support-float-thinking i:nth-child(3){animation-delay:.28s!important}
@keyframes supportFloatDotsForce{0%,60%,100%{transform:translate3d(0,2px,0) scale(.82);opacity:.48}30%{transform:translate3d(0,-8px,0) scale(1.18);opacity:1}}
.support-float-new{flex:0 0 48px!important;width:48px!important;height:48px!important;display:grid!important;place-items:center!important;padding:0!important;border:0!important;border-radius:0!important;background:transparent!important;color:#fff!important;box-shadow:none!important;cursor:pointer!important;position:relative!important;isolation:isolate!important;transition:transform .22s ease,filter .3s ease!important}.support-float-new::before,.support-float-new::after{content:none!important;display:none!important}.support-float-new svg{width:46px!important;height:46px!important;overflow:visible}.support-float-new svg circle{animation:supportFloatNewBadgeBlink 1.35s ease-in-out infinite;transform-box:fill-box;transform-origin:center}.support-float-new:hover{transform:translateY(-1px) scale(1.04)!important;filter:brightness(1.08)!important}.support-float-new:focus,.support-float-new:focus-visible,.support-float-new:active{outline:0!important;outline-offset:0!important;box-shadow:none!important}.support-float-new:active{transform:scale(.96)!important}@keyframes supportFloatNewBadgeBlink{0%,100%{filter:brightness(.92);opacity:.88;transform:scale(.96)}50%{filter:brightness(1.2);opacity:1;transform:scale(1.06)}}.support-float-empty-icon{width:clamp(290px,84%,460px)!important;max-width:100%!important;height:auto!important;aspect-ratio:auto!important;margin:0 auto 14px!important;padding:0!important;border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important;color:inherit!important}.support-float-empty-icon img{display:block;width:100%;height:auto;max-height:500px;object-fit:contain;object-position:center bottom}
.support-float-new svg{display:block!important;width:48px!important;height:48px!important;overflow:visible!important;filter:drop-shadow(0 2px 2px rgba(68,54,17,.22))!important}
.support-float-head-art{flex:0 0 43px!important;width:43px!important;height:43px!important;border-radius:14px!important;background:linear-gradient(145deg,rgba(111,224,236,.18),rgba(255,218,115,.12))!important;border:1px solid rgba(139,229,238,.35)!important;box-shadow:inset 0 0 0 1px rgba(255,255,255,.07),0 5px 16px rgba(0,0,0,.12)!important}
.support-float-head-art svg{width:25px!important;height:25px!important}