/* Тема «Чёрно-фиолетовая» (гамма test.rumivpn.com) и общий отклик интерфейса. Размеры и отступы MiniApp не меняются */
:root[data-theme="rumi-violet"],:root[data-color-scheme="dark"][data-theme="rumi-violet"],.theme-option[data-theme="rumi-violet"],:root[data-color-scheme="dark"] .theme-option[data-theme="rumi-violet"]{color-scheme:dark;--bg:#08070d;--card:#120f1b;--ink:#f5f2fc;--muted:#aaa2bb;--line:#2a2337;--accent:#7940f6;--soft:#1d1533;--surface:#1c1729;--field:#0f0c17;--accent-text:#c1a0f0;--strong-surface:#6230d4;--glow-rgb:121,64,246;--strong-bg:var(--accent);--primary-bg:var(--accent);--strong-line:#ffffff38;--strong-muted:#fff;--strong-accent:#fff;--selected-muted:var(--muted);--note-ink:var(--muted);--green:#7df0c0;--swatch-color:#7940f6;--accent-icon-filter:hue-rotate(32deg) saturate(.6) brightness(1.75);--hero-art:none}
:root[data-theme="rumi-violet"]{background:#08070d}
:root[data-theme="rumi-violet"] .card{background:linear-gradient(180deg,#171224,#0e0b16);border-top-color:#463a60}
:root[data-theme="rumi-violet"] .primary-button,:root[data-theme="rumi-violet"] .action-row.primary{box-shadow:0 0 0 1px rgba(255,255,255,.08) inset,0 16px 40px -18px rgba(121,64,246,.95)}
:root[data-theme="rumi-violet"] dialog{background:linear-gradient(180deg,#171224,#0e0b16);border-top:1px solid #463a60;box-shadow:0 -30px 80px -20px #000}
:root[data-theme="rumi-violet"] dialog::backdrop{background:rgba(4,3,8,.68)}
:root[data-theme="rumi-violet"] .sticky-pay{background:rgba(8,7,13,.86);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px)}
:root[data-theme="rumi-violet"] .theme-option[aria-checked="true"]{border-color:var(--line);box-shadow:none}

/* Космонавт тестового сайта вместо рисованного; орбит и планеты нет */
:root[data-theme="rumi-violet"] .hero{overflow:visible}
:root[data-theme="rumi-violet"] .hero::before{content:"";position:absolute;left:50%;top:46%;width:min(420px,112vw);aspect-ratio:1;transform:translate(-50%,-50%);border-radius:50%;background:radial-gradient(circle,rgba(121,64,246,.4) 0%,rgba(121,64,246,.12) 42%,rgba(121,64,246,0) 68%);pointer-events:none;z-index:0;transition:opacity 1.1s cubic-bezier(.2,.8,.2,1)}
:root[data-theme="rumi-violet"] .hero .orbit-sphere{display:none}
:root[data-theme="rumi-violet"] .hero{align-items:flex-start}
:root[data-theme="rumi-violet"] .status-card,:root[data-theme="rumi-violet"] .screen-intro{position:relative;z-index:1}
:root[data-theme="rumi-violet"] .hero .hero-art,:root[data-theme="rumi-violet"] .is-home>.hero .hero-art{content:url("astronaut-violet.webp");aspect-ratio:4/5;width:auto;height:clamp(236px,76vw,330px);max-height:none;max-width:none;margin-top:4px;animation:none;background:none;filter:none;-webkit-mask-image:linear-gradient(180deg,#000 66%,transparent 98%);mask-image:linear-gradient(180deg,#000 66%,transparent 98%);transition:filter 1.1s cubic-bezier(.2,.8,.2,1)}
:root[data-theme="rumi-violet"] main:has(.status-head .dot.expired) .hero .hero-art,:root[data-theme="rumi-violet"] main:has(.status-head .dot.none) .hero .hero-art{filter:grayscale(1) brightness(.45)}
:root[data-theme="rumi-violet"] main:has(.status-head .dot.expired) .hero::before,:root[data-theme="rumi-violet"] main:has(.status-head .dot.none) .hero::before{opacity:.1}
:root[data-theme="rumi-violet"] .avatar-fallback img{content:url("astronaut-violet.webp");width:100%!important;height:100%!important;object-fit:cover;object-position:50% 18%}
:root[data-theme="rumi-violet"] .cosmic-avatar::after{border-color:rgba(193,160,240,.2)}
:root[data-theme="rumi-violet"] #rumi-splash{background:#08070d}
:root[data-theme="rumi-violet"] #rumi-splash.gone{background:transparent}
:root[data-theme="rumi-violet"] .splash-glow{width:min(420px,112vw);height:auto;aspect-ratio:1;background:radial-gradient(circle,rgba(121,64,246,.4) 0%,rgba(121,64,246,.12) 42%,rgba(121,64,246,0) 68%)}
:root[data-theme="rumi-violet"] .splash-bob,:root[data-theme="rumi-violet"] .splash-tilt{animation:none}
:root[data-theme="rumi-violet"] .splash-tilt img{content:url("astronaut-violet.webp");aspect-ratio:4/5;width:min(300px,72vw);-webkit-mask-image:linear-gradient(180deg,#000 66%,transparent 98%);mask-image:linear-gradient(180deg,#000 66%,transparent 98%)}
:root[data-theme="rumi-violet"] #rumi-stars{display:none}

/* Отклик с момента касания — для всех тем */
button,a.primary-button,a.secondary-button,a.action-row{transition:transform .12s ease-out,filter .12s ease-out}
.rm-down{transform:scale(.97)!important;filter:brightness(1.12)}
.rm-ghost{position:fixed;margin:0;pointer-events:none;z-index:3}
/* Появление блоков по очереди: после заставки и при получении данных */
.rm-stagger>*,.rm-stagger>.actions>*{animation:rm-rise .7s cubic-bezier(.16,1,.3,1) both}
.rm-stagger>.hero{animation:none}
.rm-stagger>:nth-child(2){animation-delay:.05s}.rm-stagger>:nth-child(3){animation-delay:.1s}.rm-stagger>:nth-child(4){animation-delay:.15s}
.rm-stagger>.actions{animation:none}
.rm-stagger>.actions>:nth-child(1){animation-delay:.1s}.rm-stagger>.actions>:nth-child(2){animation-delay:.15s}.rm-stagger>.actions>:nth-child(3){animation-delay:.2s}.rm-stagger>.actions>:nth-child(4){animation-delay:.25s}.rm-stagger>.actions>:nth-child(n+5){animation-delay:.3s}
@keyframes rm-rise{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
/* Окно снизу выезжает, фон затемняется плавно */
dialog[open]{animation:rm-sheet .42s cubic-bezier(.16,1,.3,1)}
dialog[open]::backdrop{animation:rm-fade .3s ease}
@keyframes rm-sheet{from{transform:translateY(56%);opacity:.4}to{transform:none;opacity:1}}
@keyframes rm-fade{from{opacity:0}to{opacity:1}}
@media (prefers-reduced-motion:reduce){.rm-stagger>*,.rm-stagger>.actions>*,dialog[open],dialog[open]::backdrop{animation:none!important}.rm-down{transform:none!important}}

/* Выпуск 2: крупный срок поверх космонавта, композиция тянется на высоту экрана */
.hero-status{display:none}
:root[data-theme="rumi-violet"] main.is-home{--rm-top:clamp(0px,calc((100dvh - 620px)*.2),64px);padding-bottom:calc(14px + var(--safe))}
:root[data-theme="rumi-violet"] main.is-home::after{flex:0 0 0px;max-height:0}
:root[data-theme="rumi-violet"] .is-home>.hero.has-status{align-items:flex-end;justify-content:flex-end;min-height:150px}
:root[data-theme="rumi-violet"] .is-home>.hero.has-status .hero-art{height:calc(100% + 34px - var(--rm-top));max-height:450px;min-height:0;margin:0 -34px -34px 0}
:root[data-theme="rumi-violet"] .hero.has-status::before{left:68%;top:52%}
:root[data-theme="rumi-violet"] .hero-status{display:flex;flex-direction:column;align-items:flex-start;position:absolute;left:6px;bottom:26px;z-index:2;max-width:58%;text-align:left}
:root[data-theme="rumi-violet"] .hero-eyebrow{display:flex;align-items:center;gap:9px;font-size:14px;font-weight:500;color:var(--accent-text)}
:root[data-theme="rumi-violet"] .hero-eyebrow .dot{width:8px;height:8px;background:#7df0c0;box-shadow:0 0 0 5px rgba(125,240,192,.16)}
:root[data-theme="rumi-violet"] .hero-eyebrow .dot.soon{background:#f2b34c;box-shadow:0 0 0 5px rgba(242,179,76,.18)}
:root[data-theme="rumi-violet"] .hero-eyebrow .dot.expired,:root[data-theme="rumi-violet"] .hero-eyebrow .dot.none{background:#8a8296;box-shadow:0 0 0 5px rgba(138,130,150,.16)}
:root[data-theme="rumi-violet"] .hero-big{margin-top:9px;font-size:clamp(30px,10vw,40px);line-height:1.02;font-weight:720;letter-spacing:-.045em;font-variant-numeric:tabular-nums;color:var(--ink)}
:root[data-theme="rumi-violet"] .hero-until{margin-top:7px;font-size:15px;color:var(--muted)}
:root[data-theme="rumi-violet"] .hero-big:empty,:root[data-theme="rumi-violet"] .hero-until:empty{display:none}
:root[data-theme="rumi-violet"] .is-home .status-card .status-head{display:none}
:root[data-theme="rumi-violet"] main:has(.hero-eyebrow .dot.expired) .hero .hero-art,:root[data-theme="rumi-violet"] main:has(.hero-eyebrow .dot.none) .hero .hero-art{filter:grayscale(1) brightness(.45)}
:root[data-theme="rumi-violet"] main:has(.hero-eyebrow .dot.expired) .hero::before,:root[data-theme="rumi-violet"] main:has(.hero-eyebrow .dot.none) .hero::before{opacity:.1}

/* Окно выбора срока */
.rm-plans{display:flex;flex-direction:column;gap:8px}
.rm-plan{display:flex;align-items:center;gap:12px;width:100%;min-height:60px;padding:8px 14px;border:1.5px solid var(--line);border-radius:15px;background:var(--field);color:var(--ink);text-align:left}
.rm-plan.selected{border-color:var(--accent);background:var(--soft)}
.rm-plan .radio{width:20px;height:20px;border:1.5px solid var(--muted);border-radius:50%;flex:none}
.rm-plan.selected .radio{border:6px solid var(--accent)}
.rm-plan-main{flex:1;min-width:0}
.rm-plan strong{display:block;font-size:16px;font-weight:650}
.rm-plan small{display:block;margin-top:2px;font-size:13px;color:var(--muted)}
.rm-plan-price{text-align:right;font-variant-numeric:tabular-nums}
.rm-plan-price strong{font-size:17px}
.rm-plan-price small{color:var(--accent-text)}
.rm-plans-more{display:block;width:100%;text-align:center;margin-top:4px}
/* «Доступ продлён» */
.rm-ok{display:flex;flex-direction:column;align-items:center;gap:14px;padding:6px 0 16px;text-align:center}
.rm-ok strong{font-size:22px;letter-spacing:-.03em}
.rm-ok-ring{width:76px;height:76px;border-radius:50%;display:grid;place-items:center;background:#16281f;border:1px solid #2f6a55;box-shadow:0 0 0 10px rgba(125,240,192,.07);animation:rm-pop .6s cubic-bezier(.3,1.5,.5,1) both}
.rm-ok-ring img{width:34px;height:34px;filter:brightness(0) saturate(100%) invert(86%) sepia(22%) saturate(741%) hue-rotate(95deg) brightness(101%)}
@keyframes rm-pop{from{transform:scale(.5);opacity:0}to{transform:none;opacity:1}}
/* Ручка окна и закрытие */
#sheet .sheet-heading{position:relative;padding-top:12px}
#sheet .sheet-heading::before{content:"";position:absolute;top:-4px;left:50%;width:40px;height:5px;margin-left:-20px;border-radius:3px;background:var(--muted);opacity:.4;pointer-events:none}
dialog.rm-closing::backdrop{opacity:0;transition:opacity .24s ease}
dialog.rm-dragging{animation:none!important}
@media (prefers-reduced-motion:reduce){.rm-ok-ring{animation:none!important}}