/* ============================================================
   ROYAL RP — магазин. Кольори й елементи Royal Menu / лаунчера:
   темне скло, золото, «пілюля» навігації, неон, що біжить по обводках.
   Побудова — мінімалістична: корона по центру, багато повітря, анімації.
   ============================================================ */

/* Шрифти: Fixel (MacPaw, український гротеск 2023, OFL) — текст і кнопки;
   Unbounded (Google Fonts, index.html) — заголовки, великі цифри, ціни. Обидва з повною українською. */
@font-face{font-family:Fixel;src:url(https://cdn.jsdelivr.net/gh/MacPaw/Fixel@514fd02ea7d70668ed3dd09fb2674ba6f70d61ee/fonts/webfonts/FixelText-Regular.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:Fixel;src:url(https://cdn.jsdelivr.net/gh/MacPaw/Fixel@514fd02ea7d70668ed3dd09fb2674ba6f70d61ee/fonts/webfonts/FixelText-Medium.woff2) format("woff2");font-weight:500;font-display:swap}
@font-face{font-family:Fixel;src:url(https://cdn.jsdelivr.net/gh/MacPaw/Fixel@514fd02ea7d70668ed3dd09fb2674ba6f70d61ee/fonts/webfonts/FixelText-SemiBold.woff2) format("woff2");font-weight:600;font-display:swap}
@font-face{font-family:Fixel;src:url(https://cdn.jsdelivr.net/gh/MacPaw/Fixel@514fd02ea7d70668ed3dd09fb2674ba6f70d61ee/fonts/webfonts/FixelText-Bold.woff2) format("woff2");font-weight:700;font-display:swap}
@font-face{font-family:Fixel;src:url(https://cdn.jsdelivr.net/gh/MacPaw/Fixel@514fd02ea7d70668ed3dd09fb2674ba6f70d61ee/fonts/webfonts/FixelText-ExtraBold.woff2) format("woff2");font-weight:800;font-display:swap}

@property --hx{syntax:'<percentage>';inherits:false;initial-value:0%}
@property --hy{syntax:'<percentage>';inherits:false;initial-value:0%}
@property --p{syntax:'<number>';inherits:false;initial-value:1}
@property --ang{syntax:'<angle>';inherits:false;initial-value:0deg}

:root{
  --primary-color:#E0B858; --primary-rgb:224,184,88; --primary-bright:#F2C75C;
  --btn-glow:.5; --neon:1;
  --font:Fixel,"Segoe UI",system-ui,sans-serif;
  --font-d:Unbounded,Fixel,"Segoe UI",sans-serif;
  --brand-yellow:#FFCF0F;   /* жовтий корони з логотипа */
  --card:linear-gradient(180deg,rgba(10,10,10,.9),rgba(10,10,10,.6));
  --inner:rgba(255,255,255,.02); --inner2:rgba(255,255,255,.04); --inner3:rgba(255,255,255,.06);
  --line:rgba(255,255,255,.06); --line2:rgba(255,255,255,.1); --line3:rgba(255,255,255,.15);
  --iconbox:linear-gradient(0deg,var(--primary-bright) -15.18%,rgba(var(--primary-rgb),.28) 95.97%);
  --iconbox-shadow:0 0 calc(2.125rem * var(--btn-glow)) rgba(var(--primary-rgb),calc(.3 * var(--btn-glow)));
  --glass:linear-gradient(96.22deg,rgba(242,242,242,.14) -8.6%,rgba(217,217,217,.1) 103.41%);
  --r:.4375rem; --r2:.5rem; --r3:.875rem;
  --text:#fff; --txt2:rgba(255,255,255,.68); --txt3:rgba(255,255,255,.48); --txt4:rgba(255,255,255,.32); --txt5:rgba(255,255,255,.18);
  --green:#22c55e; --red:#ef4444; --red2:#FF5555;
  --ease:cubic-bezier(.2,.7,.2,1); --out:cubic-bezier(.16,1,.3,1); --spring:cubic-bezier(.34,1.56,.64,1);
  --gut:clamp(1rem,3vw,2.5rem);
}

*,*::before,*::after{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;}
/* масштаб усього сайту: розміри задані в rem і ростуть разом зі шрифтом html.
   Ноутбук і телефон (до 1366px) — 16px, як було; Full HD (1920) — 20px (×1.25); 2K і більше — до 23px */
html{font-size:clamp(16px,calc(6.14px + .722vw),23px);}
html,body{margin:0;padding:0;background:#050507;}
body{color:var(--text);font-family:var(--font);font-size:.9375rem;line-height:1.5;-webkit-font-smoothing:antialiased;min-height:100vh;overflow-x:hidden;}
body.lock{overflow:hidden;}
img{max-width:100%;display:block;}
a{color:inherit;text-decoration:none;}
button{font:inherit;color:inherit;background:none;border:0;padding:0;margin:0;cursor:pointer;-webkit-tap-highlight-color:transparent;}
input,select,textarea{font:inherit;color:inherit;}
[hidden]{display:none !important;}
::selection{background:rgba(var(--primary-rgb),.35);color:#fff;}
:focus-visible{outline:2px solid var(--primary-bright);outline-offset:.1875rem;}
.ic{width:1em;height:1em;display:inline-block;flex:none;vertical-align:middle;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;}
.ic.fill{fill:currentColor;stroke:none;}
.rel{position:relative;}
html{scrollbar-width:thin;scrollbar-color:rgba(var(--primary-rgb),.5) #050507;}
::-webkit-scrollbar{width:.5rem;height:.5rem;}
::-webkit-scrollbar-track{background:#050507;}
::-webkit-scrollbar-thumb{background:rgba(var(--primary-rgb),.45);border-radius:.625rem;border:2px solid #050507;}

/* ─────────── ФОН ─────────── */
#bg{position:fixed;inset:0;z-index:0;overflow:hidden;pointer-events:none;background:#050507;}
.bg-stage{position:absolute;inset:-3%;transform:translate3d(var(--px,0),var(--py,0),0);transition:transform 1.4s var(--out);}
.bg-slide{position:absolute;inset:0;overflow:hidden;}
.bg-slide .kb{position:absolute;inset:0;background-size:cover;background-position:center;
  transform:translate3d(var(--fx,0),var(--fy,0),0) scale(var(--fs,1.06));animation:kb var(--kbd,14s) cubic-bezier(.33,.08,.67,.92) forwards;}
@keyframes kb{to{transform:translate3d(var(--tx,0),var(--ty,0),0) scale(var(--ts,1.15))}}
.bg-slide.first{animation:bgFirst 2.6s var(--out) both;}
@keyframes bgFirst{from{opacity:0;filter:blur(1.25rem) brightness(1.8)}to{opacity:1;filter:none}}
.bg-slide.in{z-index:2;}
.bg-slide.out{z-index:1;animation:bgOut var(--T,1.8s) ease both;}
@keyframes bgOut{to{filter:brightness(.45) saturate(.8);transform:scale(1.05)}}
@keyframes pmask{from{--p:0}to{--p:1}}
.bg-slide.in.fx-sweep{-webkit-mask-image:linear-gradient(100deg,#000 calc(var(--p) * 130% - 30%),transparent calc(var(--p) * 130%));mask-image:linear-gradient(100deg,#000 calc(var(--p) * 130% - 30%),transparent calc(var(--p) * 130%));animation:pmask var(--T,1.8s) cubic-bezier(.65,0,.35,1) both;}
.bg-flare{position:absolute;top:-20%;bottom:-20%;width:20vw;z-index:3;left:0;
  background:linear-gradient(90deg,rgba(var(--primary-rgb),0),rgba(255,226,140,.3) 45%,rgba(255,244,210,.6) 50%,rgba(255,226,140,.3) 55%,rgba(var(--primary-rgb),0));
  mix-blend-mode:screen;filter:blur(.375rem);animation:flare var(--T,1.8s) cubic-bezier(.65,0,.35,1) both;}
@keyframes flare{0%{transform:translate3d(-30vw,0,0) rotate(10deg);opacity:0}15%{opacity:1}85%{opacity:1}100%{transform:translate3d(120vw,0,0) rotate(10deg);opacity:0}}
.bg-slide.in.fx-iris{-webkit-mask-image:radial-gradient(circle at 50% 42%,#000 calc(var(--p) * 90%),transparent calc(var(--p) * 90% + 14%));mask-image:radial-gradient(circle at 50% 42%,#000 calc(var(--p) * 90%),transparent calc(var(--p) * 90% + 14%));animation:pmask var(--T,1.8s) cubic-bezier(.65,0,.35,1) both;}
.bg-slide.in.fx-glide{animation:glideIn var(--T,1.8s) var(--out) both;}
@keyframes glideIn{from{opacity:0;filter:blur(1.375rem) brightness(1.6);transform:scale(1.08)}to{opacity:1;filter:none;transform:none}}
.bg-slide.in.fx-blinds{-webkit-mask-image:repeating-linear-gradient(90deg,#000 0,#000 calc(var(--p) * 9vw),transparent calc(var(--p) * 9vw),transparent 9vw);mask-image:repeating-linear-gradient(90deg,#000 0,#000 calc(var(--p) * 9vw),transparent calc(var(--p) * 9vw),transparent 9vw);animation:pmask var(--T,1.8s) cubic-bezier(.65,0,.35,1) both;}
/* затемнення: угорі кадр видно, нижче (каталог) — темніше; --sd росте з прокруткою */
.bg-shade{position:absolute;inset:0;z-index:4;background:
  radial-gradient(ellipse 85% 70% at 50% 40%,rgba(5,5,7,calc(.3 + var(--sd,0) * .45)) 0%,rgba(5,5,7,calc(.78 + var(--sd,0) * .14)) 78%),
  linear-gradient(180deg,rgba(5,5,7,.6) 0%,rgba(5,5,7,.15) 26%,rgba(5,5,7,.55) 70%,rgba(5,5,7,.92) 100%);transition:background .2s linear;}
/* золоті засвіти */
.leak{position:absolute;z-index:5;border-radius:50%;mix-blend-mode:screen;pointer-events:none;}
.l1{width:80vmax;height:80vmax;left:-38vmax;top:-44vmax;background:radial-gradient(closest-side,rgba(255,176,72,.26),rgba(255,176,72,0));animation:leak1 26s ease-in-out infinite alternate;}
.l2{width:70vmax;height:70vmax;right:-34vmax;bottom:-40vmax;background:radial-gradient(closest-side,rgba(var(--primary-rgb),.2),rgba(var(--primary-rgb),0));animation:leak2 34s ease-in-out infinite alternate;}
.l3{width:46vmax;height:46vmax;left:34%;top:18%;background:radial-gradient(closest-side,rgba(255,226,160,.09),rgba(255,226,160,0));animation:leak3 40s ease-in-out infinite alternate;}
@keyframes leak1{to{transform:translate3d(22vw,14vh,0) scale(1.2)}}
@keyframes leak2{to{transform:translate3d(-24vw,-12vh,0) scale(.9)}}
@keyframes leak3{to{transform:translate3d(-18vw,26vh,0) scale(1.25)}}
#waves{position:absolute;inset:0;z-index:6;width:100%;height:100%;opacity:0;animation:fadeIn 2.4s .6s ease forwards;}
@keyframes fadeIn{to{opacity:1}}
.bg-grain{position:absolute;inset:-10%;z-index:7;opacity:.06;mix-blend-mode:overlay;animation:grain .9s steps(5) infinite;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)'/%3E%3C/svg%3E");}
@keyframes grain{0%{transform:translate(0,0)}20%{transform:translate(-3%,2%)}40%{transform:translate(2%,-3%)}60%{transform:translate(-2%,-1%)}80%{transform:translate(3%,3%)}100%{transform:translate(0,0)}}
.cursor-glow{position:fixed;left:0;top:0;z-index:1;width:35rem;height:35rem;margin:-17.5rem 0 0 -17.5rem;border-radius:50%;pointer-events:none;opacity:0;
  background:radial-gradient(closest-side,rgba(var(--primary-rgb),.1),rgba(var(--primary-rgb),0));transform:translate3d(var(--cx,-999px),var(--cy,-999px),0);transition:opacity .5s;}
.cursor-glow.on{opacity:1;}
.progress{position:fixed;top:0;left:0;z-index:45;width:100%;height:2px;transform-origin:0 50%;transform:scaleX(var(--sp,0));
  background:linear-gradient(90deg,rgba(var(--primary-rgb),.3),var(--primary-bright));box-shadow:0 0 .75rem rgba(var(--primary-rgb),.8);pointer-events:none;}

/* ─────────── НЕОН (1:1 з Royal Menu: кільце + «блукаюча» гаряча точка) ─────────── */
.p-card,.p-nav{position:relative;}
.p-card::before,.p-nav::before{content:"";position:absolute;inset:0;border-radius:inherit;padding:1px;pointer-events:none;z-index:1;
  background:linear-gradient(180deg,rgba(var(--primary-rgb),calc(.55 * var(--neon))),rgba(var(--primary-rgb),calc(.08 * var(--neon))) 55%,rgba(var(--primary-rgb),calc(.25 * var(--neon))));
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);mask-composite:exclude;}
.p-card::after,.p-nav::after{content:"";position:absolute;inset:0;border-radius:inherit;padding:2px;pointer-events:none;z-index:1;
  background:radial-gradient(circle 10rem at var(--hx) var(--hy),rgba(var(--primary-rgb),calc(.95 * var(--neon))),rgba(var(--primary-rgb),calc(.35 * var(--neon))) 35%,rgba(var(--primary-rgb),0) 70%);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);mask-composite:exclude;
  animation:neon-wander 12s ease-in-out infinite;}
@keyframes neon-wander{0%{--hx:0%;--hy:0%;opacity:0}8%{opacity:1}26%{--hx:100%;--hy:0%;opacity:1}34%{opacity:0}40%{--hx:100%;--hy:100%;opacity:0}48%{opacity:1}66%{--hx:0%;--hy:100%;opacity:1}74%{opacity:0}80%{--hx:0%;--hy:40%;opacity:0}88%{opacity:1}100%{--hx:0%;--hy:0%;opacity:0}}
.p-card{background:var(--card);border:1px solid rgba(var(--primary-rgb),calc(.22 * var(--neon)));border-radius:var(--r3);
  box-shadow:0 0 calc(1.375rem * var(--neon)) rgba(var(--primary-rgb),calc(.14 * var(--neon))),0 1.875rem 3.75rem -1.25rem rgba(0,0,0,.6);}
.p-card > *,.p-nav > *{position:relative;z-index:2;}
/* «промінь»: світло біжить по обводці кнопки/рамки */
.beam{position:relative;isolation:isolate;}
.beam > .bm{position:absolute;inset:0;border-radius:inherit;padding:1.5px;pointer-events:none;z-index:3;
  background:conic-gradient(from var(--ang),rgba(var(--primary-rgb),.18) 0deg,rgba(var(--primary-rgb),.18) 230deg,rgba(255,236,190,.95) 290deg,var(--primary-bright) 310deg,rgba(var(--primary-rgb),.18) 350deg);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);mask-composite:exclude;
  animation:beam var(--bd,4.5s) linear infinite;}
.beam > .bm::after{content:"";position:absolute;inset:-.5rem;border-radius:inherit;z-index:-1;filter:blur(.625rem);opacity:.55;
  background:conic-gradient(from var(--ang),transparent 0deg 250deg,rgba(var(--primary-rgb),.9) 305deg,transparent 350deg);}
@keyframes beam{to{--ang:360deg}}

/* ─────────── КНОПКИ ───────────
   Золота: об'ємна (світлий край зверху, тінь знизу), відблиск при наведенні, ціна — у темній плашці.
   Скляна: напівпрозора, неон біжить по обводці. Текст звичайними літерами — читається краще за КАПС. */
.btn{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:.625rem;height:3rem;padding:0 1.375rem;border-radius:.75rem;white-space:nowrap;
  font-family:var(--font);font-weight:700;font-size:.9375rem;letter-spacing:.005em;text-transform:none;color:#1a1206;
  background:linear-gradient(180deg,#FFE58F 0%,#F5CC5E 46%,#DDA636 100%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.7),inset 0 -2px 0 rgba(120,78,0,.35),0 0 0 1px rgba(255,214,120,.35),0 .75rem 1.75rem -.75rem rgba(var(--primary-rgb),.85),0 0 calc(1.625rem * var(--btn-glow)) rgba(var(--primary-rgb),calc(.3 * var(--btn-glow)));
  transition:transform .3s var(--out),filter .2s,background .25s,box-shadow .3s,color .2s,border-color .25s;overflow:hidden;}
.btn .ic{font-size:1.125rem;stroke-width:2.2;}
.btn:hover{transform:translateY(-2px);filter:brightness(1.05) saturate(1.05);box-shadow:inset 0 1px 0 rgba(255,255,255,.75),inset 0 -2px 0 rgba(120,78,0,.35),0 0 0 1px rgba(255,220,130,.55),0 1rem 2.125rem -.75rem rgba(var(--primary-rgb),.95),0 0 calc(2.75rem * var(--btn-glow)) rgba(var(--primary-rgb),calc(.5 * var(--btn-glow)));}
.btn:active{transform:translateY(0) scale(.97);filter:brightness(.97);}
.btn:disabled{opacity:.35;filter:grayscale(1);cursor:default;transform:none;}
.btn > .sh{position:absolute;top:0;bottom:0;left:-60%;width:38%;background:linear-gradient(100deg,rgba(255,255,255,0),rgba(255,255,255,.7),rgba(255,255,255,0));transform:skewX(-18deg);pointer-events:none;}
.btn:hover > .sh{animation:btnShine .85s var(--ease);}
@keyframes btnShine{from{left:-60%}to{left:130%}}
/* ціна всередині кнопки */
.btn .chip{height:2rem;margin-right:-.75rem;padding:0 .75rem;border-radius:.5625rem;display:inline-flex;align-items:center;background:rgba(14,11,4,.9);color:var(--primary-bright);
  font-family:var(--font-d);font-weight:700;font-size:.8125rem;letter-spacing:0;box-shadow:inset 0 0 0 1px rgba(var(--primary-rgb),.35);}
.btn.lg{height:3.5rem;padding:0 1.75rem;font-size:1rem;border-radius:.875rem;}
.btn.lg .chip{height:2.25rem;margin-right:-1rem;font-size:.875rem;border-radius:.625rem;}
.btn.sm{height:2.5rem;padding:0 1rem;font-size:.875rem;border-radius:.625rem;}
.btn.block{width:100%;}
.btn.glass{color:#fff;font-weight:600;background:linear-gradient(180deg,rgba(255,255,255,.1),rgba(255,255,255,.03));border:1px solid rgba(255,255,255,.18);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.14),0 .75rem 1.875rem -.875rem rgba(0,0,0,.7);backdrop-filter:blur(.625rem);-webkit-backdrop-filter:blur(.625rem);}
.btn.glass:hover{filter:none;border-color:rgba(var(--primary-rgb),.55);background:linear-gradient(180deg,rgba(var(--primary-rgb),.16),rgba(var(--primary-rgb),.04));box-shadow:inset 0 1px 0 rgba(255,255,255,.14),0 0 1.625rem rgba(var(--primary-rgb),.22);}
.btn.ghost{color:var(--txt2);background:rgba(255,255,255,.04);border:1px solid var(--line2);box-shadow:none;}
.btn.ghost:hover{background:rgba(255,255,255,.09);color:#fff;}
.btn.icon{width:2.875rem;padding:0;}
.btn.is-busy{pointer-events:none;color:transparent !important;}
.btn.is-busy::before{content:"";position:absolute;width:1.125rem;height:1.125rem;left:50%;top:50%;margin:-.5625rem 0 0 -.5625rem;border-radius:50%;border:2px solid rgba(0,0,0,.25);border-top-color:#000;animation:spin .7s linear infinite;z-index:4;}
.btn.glass.is-busy::before,.btn.ghost.is-busy::before{border-color:rgba(255,255,255,.2);border-top-color:#fff;}
@keyframes spin{to{transform:rotate(360deg)}}
[data-magnet]{transition:transform .5s var(--spring),background .25s,box-shadow .3s,color .2s;}
.px{width:2.5rem;height:2.5rem;border-radius:.4375rem;display:flex;align-items:center;justify-content:center;color:var(--red2);font-size:1.25rem;flex:none;
  background:linear-gradient(0deg,rgba(21,20,25,.68),rgba(21,20,25,.68)),radial-gradient(79.03% 79.03% at 50% 20.97%,rgba(255,85,85,.25) 0%,rgba(255,85,85,.06) 100%);
  border:.5px solid var(--red2);transition:transform .2s;}
.px .ic{transition:transform .3s var(--spring);}
.px:hover .ic{transform:rotate(90deg);}
.px:active{transform:scale(.94);}
.tag{display:inline-flex;align-items:center;gap:.3125rem;padding:.25rem .5625rem;border-radius:.3125rem;background:rgba(var(--primary-rgb),.14);border:1px solid rgba(var(--primary-rgb),.35);color:var(--primary-color);font-size:.5938rem;font-weight:900;letter-spacing:.12em;text-transform:uppercase;white-space:nowrap;}
.tag .ic{font-size:.75rem;}
.tag.solid{background:var(--primary-bright);border-color:transparent;color:#000;}
.tag.demo{background:rgba(96,165,250,.12);border-color:rgba(96,165,250,.35);color:#93c5fd;}
.label{font-size:.6562rem;font-weight:900;letter-spacing:.24em;text-transform:uppercase;color:var(--txt3);}

/* ─────────── НАВІГАЦІЯ: пілюля з короною ─────────── */
.head{position:fixed;top:0;left:0;right:0;z-index:30;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:1rem;padding:1.125rem var(--gut) 0;pointer-events:none;transition:padding .45s var(--out);}
.head > *{pointer-events:auto;}
.head.scrolled{padding-top:.625rem;}
/* скляні «пігулки» в шапці: лаунчер (зліва) і кошик (справа) — золоте коло з іконкою + текст, неон по обводці */
.dl,.cartbtn{position:relative;display:flex;align-items:center;gap:.75rem;height:3.25rem;padding:0 1.25rem 0 .4375rem;border-radius:999px;color:#fff;white-space:nowrap;
  background:linear-gradient(180deg,rgba(16,16,19,.84),rgba(16,16,19,.58));border:1px solid rgba(var(--primary-rgb),.3);backdrop-filter:blur(.75rem);-webkit-backdrop-filter:blur(.75rem);
  box-shadow:0 0 1.375rem rgba(var(--primary-rgb),.16),inset 0 1px 0 rgba(255,255,255,.08),0 1rem 2.25rem -1.125rem rgba(0,0,0,.8);transition:transform .35s var(--spring),box-shadow .3s,border-color .3s;}
.dl:hover,.cartbtn:hover{transform:translateY(-2px);border-color:rgba(var(--primary-rgb),.7);box-shadow:0 0 2.125rem rgba(var(--primary-rgb),.34),inset 0 1px 0 rgba(255,255,255,.1);}
.dl .dl-ic,.cartbtn .cb-ic{position:relative;width:2.375rem;height:2.375rem;flex:none;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:1.125rem;color:#1a1206;
  background:linear-gradient(180deg,#FFE58F,#F5CC5E 46%,#DDA636);box-shadow:inset 0 1px 0 rgba(255,255,255,.75),0 0 1.125rem rgba(var(--primary-rgb),.55);}
.dl .dl-ic .ic,.cartbtn .cb-ic .ic{stroke-width:2.3;}
.dl .dl-ic .ic{animation:dlBob 2.4s ease-in-out infinite;}
@keyframes dlBob{0%,100%{transform:translateY(-1px)}50%{transform:translateY(2px)}}
.dl .dl-t{display:flex;flex-direction:column;line-height:1.18;text-align:left;}
.dl .dl-t b{font-size:.8438rem;font-weight:700;}
.dl .dl-t small{font-size:.6875rem;font-weight:600;color:var(--txt3);}
.dl{justify-self:start;animation:uiIn .9s .7s var(--out) both;}
.dl > .bm,.cartbtn > .bm{--bd:5.5s;}
.pill{display:flex;align-items:center;gap:.25rem;height:3.875rem;padding:0 .625rem;border-radius:.75rem;
  background:linear-gradient(180deg,rgba(10,10,10,.88),rgba(10,10,10,.62));backdrop-filter:blur(.875rem) saturate(140%);-webkit-backdrop-filter:blur(.875rem) saturate(140%);
  box-shadow:0 0 calc(1.5rem * var(--neon)) rgba(var(--primary-rgb),calc(.18 * var(--neon))),inset 0 0 0 1px rgba(var(--primary-rgb),calc(.22 * var(--neon))),0 1.25rem 3.125rem -1.25rem rgba(0,0,0,.8);
  animation:pillIn 1.2s .15s var(--out) both;transition:transform .45s var(--out);}
.p-nav::after{animation-duration:14s;animation-delay:-2.2s;}
@keyframes pillIn{from{clip-path:inset(0 46% 0 46% round .75rem);opacity:0}30%{opacity:1}to{clip-path:inset(-3.75rem -3.75rem -3.75rem -3.75rem round .75rem);opacity:1}}
.head.scrolled .pill{transform:scale(.95);}
/* position:static — щоб бігунок рахувався від самої пілюлі (інакше .p-nav > * робить блок відносним і бігунок з'їжджає) */
.pill .pill-side{position:static;display:flex;align-items:center;gap:.25rem;}
.pl{position:relative;z-index:2;height:2.625rem;padding:0 1.25rem;display:flex;align-items:center;gap:.5rem;border-radius:.5625rem;white-space:nowrap;
  font-size:.875rem;font-weight:600;letter-spacing:.01em;color:var(--txt2);transition:color .3s;animation:plIn .7s var(--out) both;animation-delay:calc(.75s + var(--i,0) * 70ms);}
@keyframes plIn{from{opacity:0;transform:translateY(.375rem)}to{opacity:1;transform:none}}
.pl .ic{font-size:.9375rem;}
.pl:hover{color:#fff;}
.pl.active{color:#000;}
.pl.ext .ic{color:#8f9bff;transition:color .3s;}
.pl.ext:hover .ic{color:#fff;}
.pill-ind{position:absolute;z-index:1;top:0;left:0;width:0;height:2.625rem;border-radius:.5625rem;background:linear-gradient(180deg,#FFE58F,#F5CC5E 46%,#DDA636);box-shadow:inset 0 1px 0 rgba(255,255,255,.7),0 0 1.375rem rgba(var(--primary-rgb),.45);
  transition:transform .6s var(--spring),width .6s var(--spring),opacity .35s;opacity:0;pointer-events:none;}
.pill-ind.on{opacity:1;}
.pill-ind.no-anim{transition:none;}
.mark{position:relative;z-index:3;width:5.75rem;height:3.875rem;margin:0 .375rem;display:flex;align-items:center;justify-content:center;}
.mark::before{content:"";position:absolute;width:6.875rem;height:6.875rem;border-radius:50%;background:radial-gradient(closest-side,rgba(var(--primary-rgb),.35),rgba(var(--primary-rgb),0));animation:markGlow 4s ease-in-out infinite;}
.mark img{position:relative;width:5.375rem;height:5.375rem;object-fit:contain;filter:drop-shadow(0 0 .875rem rgba(var(--primary-rgb),.55)) drop-shadow(0 .5rem .875rem rgba(0,0,0,.6));
  animation:markIn 1.1s .1s var(--spring) both,markFloat 6s 1.4s ease-in-out infinite;transition:transform .45s var(--spring);}
.mark:hover img{transform:scale(1.08) rotate(-4deg);}
@keyframes markIn{from{opacity:0;transform:scale(.3) rotate(-25deg);filter:blur(.625rem) brightness(2)}to{opacity:1;transform:none}}
@keyframes markFloat{0%,100%{translate:0 0}50%{translate:0 -.1875rem}}
@keyframes markGlow{0%,100%{opacity:.7;transform:scale(1)}50%{opacity:1;transform:scale(1.12)}}
.head-actions{justify-self:end;display:flex;align-items:center;gap:.625rem;animation:uiIn .9s .8s var(--out) both;}
@keyframes uiIn{from{opacity:0;transform:translate3d(0,-.625rem,0);filter:blur(.375rem)}to{opacity:1;transform:none;filter:none}}
.cartbtn .cb-n,.cart-m .cm-n{position:absolute;top:-.375rem;right:-.4375rem;min-width:1.25rem;height:1.25rem;padding:0 .3125rem;border-radius:.625rem;background:#0b0b0d;color:var(--primary-bright);font-family:var(--font-d);font-size:.6562rem;font-weight:700;
  display:flex;align-items:center;justify-content:center;border:1.5px solid var(--primary-bright);box-shadow:0 0 .75rem rgba(var(--primary-rgb),.6);transform:scale(0);transition:transform .45s var(--spring);}
.cartbtn .cb-n.on,.cart-m .cm-n.on{transform:scale(1);}
.cartbtn .cb-t{display:flex;flex-direction:column;line-height:1.15;text-align:left;}
.cartbtn .cb-t small{font-size:.6875rem;font-weight:600;color:var(--txt3);}
.cartbtn .cb-sum{font-family:var(--font-d);font-size:.9062rem;font-weight:700;color:var(--primary-bright);font-variant-numeric:tabular-nums;}
.cartbtn:not(.has) > .bm{opacity:0;}
.cartbtn > .bm{transition:opacity .4s;}
.bump{animation:bump .65s var(--spring);}
@keyframes bump{0%{transform:scale(1)}30%{transform:scale(1.12) rotate(-2deg)}60%{transform:scale(.96) rotate(1deg)}100%{transform:scale(1)}}
.head-actions .btn.glass{height:3.25rem;border-radius:999px;padding:0 1.375rem;}
.userchip{display:flex;align-items:center;gap:.625rem;height:3.25rem;padding:0 1.125rem 0 .4375rem;border-radius:999px;border:1px solid rgba(255,255,255,.14);
  background:linear-gradient(180deg,rgba(16,16,19,.84),rgba(16,16,19,.58));backdrop-filter:blur(.75rem);transition:border-color .25s,box-shadow .25s;}
.userchip:hover{border-color:rgba(var(--primary-rgb),.6);box-shadow:0 0 1.625rem rgba(var(--primary-rgb),.25);}
.ava{width:2.375rem;height:2.375rem;border-radius:50%;flex:none;display:flex;align-items:center;justify-content:center;background:rgba(0,0,0,.45);border:1.5px solid rgba(var(--primary-rgb),.6);color:var(--primary-bright);font-family:var(--font-d);font-weight:700;font-size:.875rem;text-transform:uppercase;}
.u-tx{display:flex;flex-direction:column;line-height:1.15;text-align:left;}
.u-n{font-size:.7812rem;font-weight:700;max-width:8.125rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.u-s{font-size:.5938rem;font-weight:900;letter-spacing:.14em;text-transform:uppercase;color:var(--green);display:flex;align-items:center;gap:.3125rem;}
.u-s::before{content:"";width:.375rem;height:.375rem;border-radius:50%;background:var(--green);box-shadow:0 0 .5rem var(--green);}
.menu-pop{position:absolute;right:0;top:calc(100% + .625rem);min-width:13.75rem;padding:.375rem;border-radius:.625rem;background:rgba(10,10,12,.97);border:1px solid rgba(var(--primary-rgb),.3);
  box-shadow:0 1.25rem 3.125rem rgba(0,0,0,.6),0 0 1.375rem rgba(var(--primary-rgb),.12);z-index:40;transform-origin:top right;animation:popIn .25s var(--out);}
@keyframes popIn{from{opacity:0;transform:translateY(-.375rem) scale(.96)}to{opacity:1;transform:none}}
.menu-pop button,.menu-pop a{width:100%;display:flex;align-items:center;gap:.625rem;padding:.625rem .75rem;border-radius:.375rem;font-size:.7812rem;font-weight:700;color:var(--txt2);text-align:left;}
.menu-pop button:hover,.menu-pop a:hover{background:rgba(255,255,255,.06);color:#fff;}
.menu-pop .mp-h{padding:.5rem .75rem .625rem;font-size:.625rem;font-weight:900;letter-spacing:.16em;text-transform:uppercase;color:var(--txt4);border-bottom:1px solid var(--line);margin-bottom:.25rem;}
/* мобільне меню */
.only-m{display:none !important;}
.burger{width:2.625rem;height:2.625rem;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.3125rem;border-radius:.5rem;}
.burger i{display:block;width:1.125rem;height:2px;border-radius:2px;background:#fff;transition:transform .35s var(--spring),opacity .2s;}
.head.open .burger i:nth-child(1){transform:translateY(.4375rem) rotate(45deg);}
.head.open .burger i:nth-child(2){opacity:0;}
.head.open .burger i:nth-child(3){transform:translateY(-.4375rem) rotate(-45deg);}
.cart-m{position:relative;width:2.625rem;height:2.625rem;display:flex;align-items:center;justify-content:center;border-radius:50%;color:#1a1206;font-size:1.1875rem;
  background:linear-gradient(180deg,#FFE58F,#F5CC5E 46%,#DDA636);box-shadow:inset 0 1px 0 rgba(255,255,255,.75),0 0 1.125rem rgba(var(--primary-rgb),.55);}
.cart-m .cm-ic{display:flex;}
.mnav{grid-column:1/-1;display:none;}

/* ─────────── ПЕРШИЙ ЕКРАН ─────────── */
main{position:relative;z-index:2;}
.hero{position:relative;min-height:max(40rem,92vh);display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:9.375rem var(--gut) 6.875rem;overflow:hidden;}
.hero::before{content:"";position:absolute;left:0;right:0;top:48%;height:2px;margin-top:-1px;pointer-events:none;
  background:linear-gradient(90deg,rgba(var(--primary-rgb),0),rgba(255,240,200,.9),rgba(var(--primary-rgb),0));filter:blur(1px);box-shadow:0 0 1.875rem .375rem rgba(var(--primary-rgb),.5);
  transform:translateX(-100%);animation:streak 1.6s 1.1s cubic-bezier(.65,0,.35,1) forwards;opacity:.9;}
@keyframes streak{0%{transform:translateX(-100%) scaleX(.4);opacity:0}20%{opacity:1}100%{transform:translateX(100%) scaleX(1);opacity:0}}
.hero-in{position:relative;max-width:56.25rem;}
.kick{display:inline-flex;align-items:center;gap:1rem;font-size:.75rem;font-weight:700;letter-spacing:.38em;text-transform:uppercase;color:var(--primary-bright);}
.kick::before,.kick::after{content:"";width:2.75rem;height:1.5px;background:linear-gradient(90deg,rgba(var(--primary-rgb),0),var(--primary-color));transform-origin:right;animation:lineIn 1s .9s var(--out) both;}
.kick::after{transform-origin:left;background:linear-gradient(90deg,var(--primary-color),rgba(var(--primary-rgb),0));}
@keyframes lineIn{from{transform:scaleX(0)}to{transform:scaleX(1)}}
.hero .kick{animation:uiIn .9s .8s var(--out) both;}
.hero h1{margin:1.5rem 0 0;font-family:var(--font-d);font-size:clamp(2.625rem,7vw,6.25rem);font-weight:800;line-height:1.02;letter-spacing:-.025em;text-shadow:0 .625rem 2.5rem rgba(0,0,0,.55);}
.hero h1 .tr{display:block;overflow:hidden;padding:0 .06em .08em;}
.w{display:inline-block;animation:wordUp 1.1s var(--out) both;animation-delay:calc(.9s + var(--i) * 110ms);}
@keyframes wordUp{from{transform:translate3d(0,105%,0) rotate(4deg);opacity:0}to{transform:none;opacity:1}}
/* «RP» — жовтий корони з логотипа, як у фірмовому написі ROYAL RP */
.hero h1 .rp{color:var(--brand-yellow);text-shadow:0 0 2.375rem rgba(255,207,15,.45),0 .625rem 2.5rem rgba(0,0,0,.55);}
.gold{color:var(--brand-yellow);text-shadow:0 0 1.875rem rgba(255,207,15,.35);}
.hero p{margin:1.5rem auto 0;max-width:37.5rem;font-size:1.0625rem;line-height:1.65;color:var(--txt2);animation:uiIn 1s 1.35s var(--out) both;}
.hero-cta{display:flex;flex-wrap:wrap;justify-content:center;gap:.875rem;margin-top:2.125rem;animation:uiIn 1s 1.5s var(--out) both;}
.trust{display:flex;flex-wrap:wrap;justify-content:center;gap:.625rem 1.625rem;margin:2.125rem 0 0;padding:0;list-style:none;animation:uiIn 1s 1.65s var(--out) both;}
.trust li{display:flex;align-items:center;gap:.5625rem;font-size:.8438rem;font-weight:600;color:var(--txt2);}
.trust .ic{font-size:1rem;color:var(--primary-color);}
.scroll-hint{position:absolute;left:50%;bottom:2.125rem;width:1.625rem;height:2.625rem;margin-left:-.8125rem;border-radius:.875rem;border:1.5px solid rgba(255,255,255,.35);animation:uiIn 1s 2s var(--out) both;}
.scroll-hint span{position:absolute;left:50%;top:.5rem;width:.25rem;height:.5rem;margin-left:-2px;border-radius:2px;background:var(--primary-bright);box-shadow:0 0 .5rem var(--primary-bright);animation:wheel 1.8s ease-in-out infinite;}
@keyframes wheel{0%{transform:translateY(0);opacity:0}25%{opacity:1}80%{transform:translateY(.875rem);opacity:0}100%{opacity:0}}
.scroll-hint:hover{border-color:var(--primary-bright);}

/* модулі Tebex (ціль спільноти тощо) */
.mods{position:relative;z-index:2;display:flex;flex-wrap:wrap;justify-content:center;gap:.75rem;max-width:56.25rem;margin:-1.875rem auto 0;padding:0 var(--gut);}
.mod{flex:1 1 16.25rem;max-width:27.5rem;padding:.875rem 1.125rem;border-radius:.75rem;background:rgba(10,10,12,.6);border:1px solid rgba(var(--primary-rgb),.22);backdrop-filter:blur(.625rem);}
.mod-h{display:flex;align-items:center;justify-content:space-between;gap:.625rem;font-size:.6875rem;font-weight:900;letter-spacing:.14em;text-transform:uppercase;color:var(--txt3);}
.mod-h b{font-size:.875rem;letter-spacing:.02em;color:var(--primary-bright);font-variant-numeric:tabular-nums;}
.mod-bar{margin-top:.625rem;height:.3125rem;border-radius:.3125rem;background:rgba(255,255,255,.08);overflow:hidden;}
.mod-bar i{display:block;height:100%;width:0;border-radius:inherit;background:linear-gradient(90deg,var(--primary-color),var(--primary-bright));box-shadow:0 0 .75rem rgba(var(--primary-rgb),.7);transition:width 1.8s var(--out);}
.mod-bar.striped i{background:repeating-linear-gradient(-45deg,var(--primary-bright) 0 .5rem,var(--primary-color) .5rem 1rem);background-size:1.4125rem 100%;}
.mod-bar.anim i{animation:stripes 1s linear infinite;}
@keyframes stripes{to{background-position:1.4125rem 0}}
.mod-sub{margin-top:.5rem;font-size:.75rem;color:var(--txt3);}
.mod-feed{display:flex;flex-direction:column;gap:.3125rem;margin-top:.625rem;font-size:.75rem;color:var(--txt3);}
.mod-feed b{color:#fff;}

/* ─────────── СЕКЦІЇ ─────────── */
.sec{position:relative;max-width:75rem;margin:0 auto;padding:7.5rem var(--gut) .625rem;}
.sh{position:relative;text-align:center;max-width:47.5rem;margin:0 auto 3.75rem;}
.sh::before{content:"";position:absolute;left:50%;top:40%;width:32.5rem;height:13.75rem;margin:-6.875rem 0 0 -16.25rem;border-radius:50%;pointer-events:none;z-index:-1;
  background:radial-gradient(closest-side,rgba(var(--primary-rgb),.14),rgba(var(--primary-rgb),0));opacity:0;transition:opacity 1.4s ease .2s;}
.sh.on::before{opacity:1;}
.sh h2{margin:1.125rem 0 0;font-family:var(--font-d);font-size:clamp(1.875rem,3.9vw,3.25rem);font-weight:800;line-height:1.08;letter-spacing:-.02em;}
.sh h2 .tr{display:block;overflow:hidden;padding:0 .06em .1em;}
.sh h2 .tr > span{display:inline-block;transform:translate3d(0,105%,0);transition:transform 1.1s var(--out) .15s;}
.sh.on h2 .tr > span{transform:none;}
.sh p{margin:1rem auto 0;max-width:35rem;font-size:.9375rem;color:var(--txt3);}
.sh .ln{display:block;width:6.875rem;height:2px;margin:1.5rem auto 0;background:linear-gradient(90deg,rgba(var(--primary-rgb),0),var(--primary-bright),rgba(var(--primary-rgb),0));
  transform:scaleX(0);transition:transform 1.2s var(--out) .45s;box-shadow:0 0 .75rem rgba(var(--primary-rgb),.6);}
.sh.on .ln{transform:scaleX(1);}
.sh .kick{opacity:0;transition:opacity .8s ease;}
.sh.on .kick{opacity:1;}
.sub-h{display:flex;align-items:center;gap:.875rem;max-width:67.5rem;margin:5rem auto 1.875rem;}
.sub-h h3{margin:0;font-family:var(--font-d);font-size:1.25rem;font-weight:700;letter-spacing:-.01em;}
.sub-h::after{content:"";flex:1;height:1px;background:linear-gradient(90deg,rgba(var(--primary-rgb),.4),transparent);}
.sub-h .ibox{width:2.5rem;height:2.5rem;font-size:1.1875rem;}
.ibox{width:2.75rem;height:2.75rem;flex:none;border-radius:var(--r);display:flex;align-items:center;justify-content:center;color:#000;font-size:1.3125rem;
  background:var(--iconbox);border:1px solid var(--primary-color);box-shadow:var(--iconbox-shadow);}
.ibox .ic{stroke-width:2.2;}

/* поява при прокрутці */
.rv{opacity:0;transform:translate3d(0,2.125rem,0);filter:blur(.5rem);transition:opacity .9s var(--out),transform 1.1s var(--out),filter .9s var(--out);transition-delay:calc(var(--i,0) * 90ms);}
.rv.on{opacity:1;transform:none;filter:none;}

/* ─────────── КОНСТРУКТОР КОЇНІВ ─────────── */
.coins{max-width:68.75rem;margin:0 auto;padding:2.125rem 2.5rem 1.875rem;overflow:hidden;
  background:radial-gradient(circle 35rem at 26% 42%,rgba(var(--tier-rgb,224,184,88),.13),rgba(var(--tier-rgb,224,184,88),0) 70%),linear-gradient(180deg,rgba(10,10,12,.82),rgba(10,10,12,.55));
  backdrop-filter:blur(.875rem) saturate(130%);-webkit-backdrop-filter:blur(.875rem) saturate(130%);transition:background .9s var(--out);}
.coins-main{display:grid;grid-template-columns:1fr 1fr;gap:1.875rem;align-items:center;}
.stage{position:relative;aspect-ratio:1.15;max-height:26.25rem;cursor:pointer;}
.stage::before{content:"";position:absolute;inset:2%;border-radius:50%;z-index:-1;
  background:repeating-radial-gradient(circle,rgba(var(--primary-rgb),.13) 0 1px,rgba(var(--primary-rgb),0) 1.5px 1.625rem);
  -webkit-mask:radial-gradient(circle,#000 22%,transparent 70%);mask:radial-gradient(circle,#000 22%,transparent 70%);animation:radar 6s ease-in-out infinite;}
@keyframes radar{0%,100%{transform:scale(.96);opacity:.7}50%{transform:scale(1.04);opacity:1}}
.stage::after{content:"";position:absolute;left:16%;right:16%;bottom:6%;height:14%;border-radius:50%;z-index:-1;background:radial-gradient(closest-side,rgba(var(--tier-rgb,224,184,88),.4),rgba(0,0,0,0));filter:blur(.625rem);}
.stage .art{position:absolute;inset:0;width:100%;height:100%;}
.stage .art.enter{animation:artIn .75s var(--spring) both;}
.stage .art.leave{animation:artOut .35s ease both;}
@keyframes artIn{from{opacity:0;transform:scale(.55) rotate(-10deg);filter:blur(.75rem) brightness(1.9)}to{opacity:1;transform:none;filter:none}}
@keyframes artOut{to{opacity:0;transform:scale(1.18) rotate(8deg);filter:blur(.875rem)}}
.burst{position:absolute;left:50%;top:50%;width:.375rem;height:.375rem;margin:-.1875rem;border-radius:50%;background:var(--c,#FFE27A);box-shadow:0 0 .75rem var(--c,#FFE27A);pointer-events:none;animation:burst .95s var(--out) forwards;}
@keyframes burst{from{transform:translate(0,0) scale(1);opacity:1}to{transform:translate(var(--dx),var(--dy)) scale(.2);opacity:0}}
.coins-info{min-width:0;}
.coins-top{display:flex;align-items:center;gap:.625rem;flex-wrap:wrap;}
.amount{display:flex;align-items:baseline;gap:.875rem;margin-top:.75rem;}
.odo{display:inline-flex;font-family:var(--font-d);font-size:clamp(3.125rem,6vw,5.5rem);font-weight:700;line-height:1;letter-spacing:-.03em;font-variant-numeric:tabular-nums;filter:drop-shadow(0 .375rem 1.875rem rgba(var(--primary-rgb),.3));}
.odo .d{display:inline-block;height:1.1em;position:relative;clip-path:inset(0 -.2em);}
.odo .d > span{display:flex;flex-direction:column;transition:transform .9s var(--out);transition-delay:calc(var(--k,0) * 45ms);}
.odo .d i{font-style:normal;height:1.1em;line-height:1.1;display:block;text-align:center;background:linear-gradient(180deg,#fff 0%,#FFF1C4 55%,var(--primary-bright) 100%);-webkit-background-clip:text;background-clip:text;color:transparent;}
.odo .s{display:inline-block;width:.22em;}
.amount-u{font-family:var(--font-d);font-size:.9375rem;font-weight:700;letter-spacing:.06em;color:var(--primary-bright);}
.price-row{display:flex;align-items:baseline;gap:.875rem;flex-wrap:wrap;margin-top:.75rem;}
.price{font-family:var(--font-d);font-size:1.875rem;font-weight:700;line-height:1;letter-spacing:-.02em;font-variant-numeric:tabular-nums;}
.price-old{font-family:var(--font-d);font-size:.875rem;font-weight:500;color:var(--txt4);text-decoration:line-through;}
.unit{font-size:.8125rem;font-weight:600;color:var(--txt3);}
.value{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:.875rem;margin-top:1.375rem;}
.value .label{font-size:.625rem;}
.meter{position:relative;height:.25rem;border-radius:.25rem;background:rgba(255,255,255,.08);overflow:hidden;}
.meter i{position:absolute;left:0;top:0;bottom:0;width:0;border-radius:inherit;background:linear-gradient(90deg,rgba(var(--primary-rgb),.4),var(--primary-bright));box-shadow:0 0 .875rem rgba(var(--primary-rgb),.8);transition:width 1s var(--out);}
.value b{font-size:.9375rem;color:var(--primary-bright);font-variant-numeric:tabular-nums;min-width:2.75rem;text-align:right;}
.value-sub{margin-top:.625rem;font-size:.8125rem;color:var(--txt2);min-height:1.25rem;}
.value-sub b{color:#fff;}
.coins-cta{display:flex;gap:.75rem;margin-top:1.625rem;flex-wrap:wrap;}
.coins-cta .btn{flex:1;min-width:11.25rem;}
/* шкала вибору: доріжка + мітки під нею (нативний повзунок прозорий зверху) */
.scale{--n:5;--i:0;position:relative;margin-top:1.875rem;padding-top:.375rem;}
.scale .track,.scale .fill{position:absolute;top:.9375rem;height:.25rem;border-radius:.25rem;}
.scale .track{left:calc(50% / var(--n));right:calc(50% / var(--n));background:rgba(255,255,255,.1);}
.scale .fill{left:calc(50% / var(--n));width:calc(100% / var(--n) * var(--i));background:linear-gradient(90deg,rgba(var(--primary-rgb),.35),var(--primary-bright));box-shadow:0 0 .875rem rgba(var(--primary-rgb),.7);transition:width .6s var(--spring);}
.scale .tick{position:absolute;top:.75rem;left:calc(100% / var(--n) * (var(--j) + .5));width:.625rem;height:.625rem;margin-left:-.3125rem;border-radius:50%;background:#141418;border:2px solid rgba(255,255,255,.22);transition:background .3s,border-color .3s,box-shadow .3s;}
.scale .tick.on{background:var(--primary-bright);border-color:var(--primary-bright);box-shadow:0 0 .625rem rgba(var(--primary-rgb),.8);}
.scale .knob{position:absolute;top:.4375rem;left:calc(100% / var(--n) * (var(--i) + .5));width:1.25rem;height:1.25rem;margin-left:-.625rem;border-radius:50%;z-index:2;pointer-events:none;
  background:radial-gradient(circle at 50% 30%,#FFF1C4,var(--primary-bright) 45%,var(--primary-color) 80%,#A8812F);
  box-shadow:0 0 0 .375rem rgba(var(--primary-rgb),.16),0 0 1.375rem rgba(var(--primary-rgb),.9);transition:left .6s var(--spring),transform .2s;}
.scale input{position:absolute;top:.25rem;height:1.5rem;left:calc(50% / var(--n) - .625rem);right:calc(50% / var(--n) - .625rem);width:auto;margin:0;opacity:0;cursor:pointer;z-index:3;-webkit-appearance:none;appearance:none;background:transparent;}
.scale input::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:1.25rem;height:1.25rem;}
.scale input::-moz-range-thumb{width:1.25rem;height:1.25rem;border:0;}
.scale input:focus-visible ~ .knob{outline:2px solid #fff;outline-offset:.1875rem;}
.scale input:active ~ .knob{transform:scale(1.2);}
/* картки пакетів під шкалою: скло, нахил за курсором, відблиск; у вибраної — неон по обводці */
.packs{position:relative;display:grid;grid-template-columns:repeat(var(--n),1fr);margin-top:1.625rem;}
.pk{position:relative;margin:0 .375rem;display:flex;flex-direction:column;align-items:center;gap:1px;padding:.75rem .375rem .875rem;border-radius:.75rem;isolation:isolate;overflow:hidden;
  background:linear-gradient(180deg,rgba(255,255,255,.05),rgba(255,255,255,.012));border:1px solid rgba(255,255,255,.08);
  transform:perspective(43.75rem) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg)) translateY(var(--ty,0px));transition:transform .5s var(--out),border-color .3s,background .35s,box-shadow .35s;}
.pk::before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(circle 7.5rem at var(--mx,50%) var(--my,0%),rgba(255,255,255,.1),transparent 70%);opacity:0;transition:opacity .3s;}
.pk::after{content:"";position:absolute;top:-20%;bottom:-20%;left:-70%;width:45%;z-index:3;pointer-events:none;background:linear-gradient(100deg,rgba(255,255,255,0),rgba(255,255,255,.22),rgba(255,255,255,0));transform:skewX(-16deg);}
.pk:hover{--ty:-.3125rem;border-color:rgba(var(--primary-rgb),.4);}
.pk:hover::before{opacity:1;}
.pk:hover::after{animation:pkGlint .9s var(--ease);}
@keyframes pkGlint{from{left:-70%}to{left:130%}}
.pk .art{width:6.25rem;height:5rem;margin:-.375rem 0 -.5rem;transition:transform .55s var(--spring);}
.pk:hover .art{transform:scale(1.1) rotate(-6deg);}
.pk b{margin-top:2px;font-family:var(--font-d);font-size:1rem;font-weight:700;letter-spacing:-.02em;color:#fff;font-variant-numeric:tabular-nums;transition:color .3s,text-shadow .3s;}
.pk > span:not(.bm){font-size:.8125rem;font-weight:600;color:var(--txt3);transition:color .3s;}
.pk em{position:absolute;top:.4375rem;right:.4375rem;font-style:normal;font-family:var(--font-d);font-size:.5938rem;font-weight:700;padding:2px .375rem;border-radius:.375rem;background:rgba(0,0,0,.55);border:1px solid rgba(var(--primary-rgb),.45);color:var(--primary-bright);}
.pk.on{--ty:-.4375rem;border-color:transparent;background:linear-gradient(180deg,rgba(var(--primary-rgb),.2),rgba(var(--primary-rgb),.04));box-shadow:0 .875rem 2.25rem -.75rem rgba(var(--primary-rgb),.5),inset 0 0 1.375rem rgba(var(--primary-rgb),.1);}
.pk.on b{color:var(--primary-bright);text-shadow:0 0 1.25rem rgba(var(--primary-rgb),.65);}
.pk.on > span:not(.bm){color:var(--txt2);}
.pk.on .art{animation:pkBob 2.6s ease-in-out infinite;}
@keyframes pkBob{0%,100%{transform:translateY(0) scale(1.06)}50%{transform:translateY(-.25rem) scale(1.06)}}
.pk > .bm{opacity:0;transition:opacity .35s;}
.pk.on > .bm{opacity:1;}
.pk:active{transform:perspective(43.75rem) scale(.97);}

/* ─────────── ТАРИФИ — скляні картки ─────────── */
.plans{display:grid;grid-template-columns:repeat(auto-fit,minmax(15.625rem,1fr));gap:1.125rem;max-width:68.75rem;margin:0 auto;}
.plan{position:relative;display:flex;flex-direction:column;align-items:center;text-align:center;padding:1.5rem 1.5rem 1.625rem;border-radius:1rem;isolation:isolate;
  background:linear-gradient(180deg,rgba(14,14,17,.72),rgba(10,10,12,.5));border:1px solid rgba(255,255,255,.08);backdrop-filter:blur(.75rem);-webkit-backdrop-filter:blur(.75rem);
  transform:perspective(56.25rem) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg)) translateY(var(--ty,0px));transition:transform .55s var(--out),border-color .35s,box-shadow .4s;}
.plan::after{content:"";position:absolute;inset:0;border-radius:inherit;z-index:-1;pointer-events:none;background:radial-gradient(circle 16.25rem at var(--mx,50%) var(--my,0%),rgba(var(--primary-rgb),.12),transparent 72%);opacity:0;transition:opacity .35s;}
.plan:hover{--ty:-.5rem;border-color:rgba(var(--primary-rgb),.4);box-shadow:0 1.875rem 3.75rem -1.5rem rgba(0,0,0,.8),0 0 1.875rem rgba(var(--primary-rgb),.14);}
.plan:hover::after{opacity:1;}
.plan.best{background:linear-gradient(180deg,rgba(var(--primary-rgb),.13),rgba(10,10,12,.55) 58%);border-color:transparent;box-shadow:0 0 2.125rem rgba(var(--primary-rgb),.16);}
.plan .flag{position:absolute;top:-.6875rem;left:50%;transform:translateX(-50%);z-index:4;}
.plan .art{width:11.875rem;height:9.375rem;cursor:pointer;}
.plan .dur{margin-top:.375rem;font-size:.75rem;font-weight:700;letter-spacing:.26em;text-transform:uppercase;color:var(--primary-bright);}
.plan h3{margin:.5rem 0 0;font-family:var(--font-d);font-size:1.1875rem;font-weight:700;letter-spacing:-.01em;}
.plan .pp{display:flex;align-items:baseline;justify-content:center;gap:.625rem;margin-top:1rem;}
.plan .pp .price{font-size:2rem;}
.plan .per{margin-top:.375rem;font-size:.75rem;color:var(--txt3);min-height:1.125rem;}
.plan ul{list-style:none;margin:1.25rem 0 1.5rem;padding:0;display:flex;flex-direction:column;gap:.5625rem;flex:1;text-align:left;}
.plan li{display:flex;gap:.625rem;font-size:.8125rem;color:var(--txt2);line-height:1.45;}
.plan li .ic{flex:none;font-size:.9375rem;color:var(--primary-color);margin-top:2px;}
.plan .desc{margin:1rem 0 1.375rem;font-size:.8125rem;color:var(--txt3);flex:1;}
.plan .btns{display:flex;gap:.5rem;width:100%;}
.plan .btns .btn:first-child{flex:1;}

/* ─────────── ІНШІ ТОВАРИ — анімовані картки ─────────── */
.items{display:grid;grid-template-columns:repeat(auto-fit,minmax(15rem,18.75rem));justify-content:center;gap:1.125rem;max-width:68.75rem;margin:0 auto;}
.item{position:relative;display:flex;flex-direction:column;border-radius:1rem;overflow:hidden;isolation:isolate;
  background:linear-gradient(180deg,rgba(14,14,17,.72),rgba(10,10,12,.5));border:1px solid rgba(255,255,255,.08);backdrop-filter:blur(.75rem);-webkit-backdrop-filter:blur(.75rem);
  transform:perspective(56.25rem) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg)) translateY(var(--ty,0px));transition:transform .55s var(--out),border-color .35s,box-shadow .4s;}
.item::after{content:"";position:absolute;top:-10%;bottom:-10%;left:-70%;width:40%;z-index:3;pointer-events:none;background:linear-gradient(100deg,rgba(255,255,255,0),rgba(255,255,255,.14),rgba(255,255,255,0));transform:skewX(-16deg);}
.item:hover{--ty:-.5rem;border-color:rgba(var(--primary-rgb),.4);box-shadow:0 1.875rem 3.75rem -1.5rem rgba(0,0,0,.8),0 0 1.875rem rgba(var(--primary-rgb),.14);}
.item:hover::after{animation:pkGlint 1s var(--ease);}
.item-art{position:relative;height:10.625rem;cursor:pointer;background:radial-gradient(circle 9.375rem at 50% 45%,rgba(var(--primary-rgb),.12),transparent 70%);}
.item-art .art,.item-art img{width:100%;height:100%;object-fit:cover;transition:transform .6s var(--out);}
.item:hover .item-art .art,.item:hover .item-art img{transform:scale(1.07);}
.item-tags{position:absolute;top:.75rem;left:.75rem;right:.75rem;display:flex;justify-content:space-between;gap:.375rem;z-index:2;pointer-events:none;}
.item-b{display:flex;flex-direction:column;flex:1;padding:.375rem 1.125rem 1.125rem;}
.item h3{margin:0;font-family:var(--font-d);font-size:.9688rem;font-weight:700;letter-spacing:-.01em;line-height:1.3;cursor:pointer;}
.item p{margin:.5rem 0 0;font-size:.8438rem;line-height:1.5;color:var(--txt3);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
.item-f{display:flex;align-items:center;justify-content:space-between;gap:.625rem;margin-top:auto;padding-top:1rem;}
.item-f .price{font-size:1.3125rem;}

/* сцена з монетою нахиляється за курсором; при додаванні в кошик монета «розчиняється» */
.stage{transform:perspective(62.5rem) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg));transition:transform .6s var(--out);}
.art.poof{animation:poof .5s cubic-bezier(.5,0,.75,0) forwards;}
.art.respawn{animation:artIn .75s var(--spring) both;}
@keyframes poof{0%{transform:scale(1);filter:none;opacity:1}30%{transform:scale(1.1) rotate(-6deg);filter:brightness(1.6)}100%{transform:scale(.2) rotate(20deg);filter:blur(.625rem) brightness(2);opacity:0}}

/* політ у кошик: неоновий жетон (темне скло, золоте світне кільце, лого) + світловий шлейф */
.fcoin{position:fixed;left:0;top:0;z-index:95;width:2.75rem;height:2.75rem;margin:-1.375rem 0 0 -1.375rem;border-radius:50%;pointer-events:none;will-change:transform,opacity;
  background:radial-gradient(circle at 50% 35%,#211c10 0%,#0c0b09 72%);
  box-shadow:0 0 0 1.5px var(--primary-bright),0 0 .75rem 2px rgba(var(--primary-rgb),.9),0 0 2.125rem .375rem rgba(var(--primary-rgb),.45),inset 0 0 .75rem rgba(var(--primary-rgb),.45);}
.fcoin img{position:absolute;left:18%;top:16%;width:64%;height:64%;object-fit:contain;filter:drop-shadow(0 0 .375rem rgba(var(--primary-rgb),.8));}
.fitem{position:fixed;left:0;top:0;z-index:95;width:5.25rem;height:4.375rem;margin:-2.1875rem 0 0 -2.625rem;pointer-events:none;will-change:transform,opacity;filter:drop-shadow(0 .625rem 1.25rem rgba(0,0,0,.5)) drop-shadow(0 0 1rem rgba(var(--primary-rgb),.7));}
.fitem .art,.fitem img{width:100%;height:100%;object-fit:cover;border-radius:.625rem;}
.spark{position:fixed;left:0;top:0;z-index:94;width:.4375rem;height:.4375rem;margin:-.2188rem;border-radius:50%;pointer-events:none;
  background:radial-gradient(circle,#fff 0%,var(--primary-bright) 40%,rgba(var(--primary-rgb),0) 72%);box-shadow:0 0 .625rem rgba(var(--primary-rgb),.8);animation:spark .7s ease-out forwards;}
@keyframes spark{from{opacity:.95;transform:translate(var(--x),var(--y)) scale(var(--s,1))}to{opacity:0;transform:translate(calc(var(--x) + var(--dx,0px)),calc(var(--y) + var(--dy,0px))) scale(.15)}}
.cart-ring{position:fixed;left:0;top:0;z-index:94;width:4rem;height:4rem;margin:-2rem;border-radius:50%;pointer-events:none;border:2px solid var(--primary-bright);box-shadow:0 0 1.375rem rgba(var(--primary-rgb),.85),inset 0 0 .75rem rgba(var(--primary-rgb),.5);animation:cartRing .65s ease-out forwards;}
@keyframes cartRing{from{transform:translate(var(--x),var(--y)) scale(.35);opacity:1}to{transform:translate(var(--x),var(--y)) scale(1.9);opacity:0}}
.plus{position:fixed;left:0;top:0;z-index:96;pointer-events:none;white-space:nowrap;font-family:var(--font-d);font-weight:700;font-size:1.0625rem;color:var(--primary-bright);
  text-shadow:0 0 1rem rgba(var(--primary-rgb),.85),0 2px .375rem rgba(0,0,0,.7);animation:plusUp 1.5s var(--out) forwards;}
@keyframes plusUp{0%{transform:translate(var(--x),var(--y)) translate(-50%,0) scale(.5);opacity:0}18%{transform:translate(var(--x),calc(var(--y) - var(--pop,1rem))) translate(-50%,0) scale(1.15);opacity:1}100%{transform:translate(var(--x),calc(var(--y) - var(--rise,4.375rem))) translate(-50%,0) scale(1);opacity:0}}
.gulp{animation:gulp .5s var(--spring);}
@keyframes gulp{0%{transform:scale(1)}30%{transform:scale(1.2,.84)}55%{transform:scale(.9,1.12)}100%{transform:scale(1)}}
.ripple{position:absolute;border-radius:50%;pointer-events:none;background:rgba(255,255,255,.45);transform:scale(0);animation:ripple .6s ease-out forwards;z-index:0;}
@keyframes ripple{to{transform:scale(1);opacity:0}}

.empty{display:flex;flex-direction:column;align-items:center;gap:.875rem;padding:3.75rem 1.25rem;text-align:center;color:var(--txt3);font-size:.875rem;}
.empty .ic{font-size:2.5rem;color:var(--txt5);}
.sk{position:relative;overflow:hidden;background:rgba(255,255,255,.04);border-radius:.875rem;}
.sk::after{content:"";position:absolute;inset:0;transform:translateX(-100%);background:linear-gradient(90deg,transparent,rgba(var(--primary-rgb),.1),rgba(255,255,255,.06),transparent);animation:sk 1.4s ease-in-out infinite;}
@keyframes sk{to{transform:translateX(100%)}}

/* ─────────── ЯК КУПИТИ ─────────── */
.steps{position:relative;display:grid;grid-template-columns:repeat(4,1fr);gap:1.875rem;max-width:68.75rem;margin:0 auto;}
.steps::before{content:"";position:absolute;left:12.5%;right:12.5%;top:1.9375rem;height:1px;background:linear-gradient(90deg,rgba(var(--primary-rgb),.15),rgba(var(--primary-rgb),.7),rgba(var(--primary-rgb),.15));
  transform-origin:left;transform:scaleX(0);transition:transform 1.6s var(--out) .3s;box-shadow:0 0 .625rem rgba(var(--primary-rgb),.5);}
.steps.on::before{transform:scaleX(1);}
.step{position:relative;text-align:center;}
.step .n{position:relative;z-index:1;width:3.875rem;height:3.875rem;margin:0 auto;border-radius:50%;display:flex;align-items:center;justify-content:center;font-family:var(--font-d);font-size:1.1875rem;font-weight:700;color:var(--primary-bright);
  background:radial-gradient(circle at 50% 30%,rgba(var(--primary-rgb),.18),#0b0b0d 70%);border:1px solid rgba(var(--primary-rgb),.35);box-shadow:0 0 1.625rem rgba(var(--primary-rgb),.22);}
.step .n .bm{--bd:6s;}
.step .n .ic{position:absolute;right:-.375rem;bottom:-.25rem;width:1.625rem;height:1.625rem;padding:.3125rem;border-radius:.4375rem;background:var(--iconbox);border:1px solid var(--primary-color);color:#000;stroke-width:2.2;}
.step h3{margin:1.375rem 0 .5rem;font-family:var(--font-d);font-size:.9688rem;font-weight:700;letter-spacing:-.01em;}
.step p{margin:0 auto;max-width:15.625rem;font-size:.875rem;line-height:1.65;color:var(--txt3);}
.center-cta{display:flex;flex-wrap:wrap;justify-content:center;gap:.75rem;margin-top:3.125rem;}

/* ─────────── ПИТАННЯ ─────────── */
.faq{max-width:52.5rem;margin:0 auto;border-top:1px solid rgba(255,255,255,.09);}
.qa{border-bottom:1px solid rgba(255,255,255,.09);}
.qa-q{width:100%;display:flex;align-items:center;gap:1.125rem;padding:1.375rem .375rem;text-align:left;font-size:1.0625rem;font-weight:600;transition:color .3s;}
.qa-q:hover{color:var(--primary-bright);}
.qa-q span{flex:1;}
.pm{position:relative;width:1.125rem;height:1.125rem;flex:none;}
.pm::before,.pm::after{content:"";position:absolute;left:0;top:.5rem;width:1.125rem;height:2px;border-radius:2px;background:var(--primary-bright);transition:transform .45s var(--spring);}
.pm::after{transform:rotate(90deg);}
.qa.open .pm::after{transform:rotate(0deg);}
.qa.open .qa-q{color:var(--primary-bright);}
.qa-a{display:grid;grid-template-rows:0fr;transition:grid-template-rows .5s var(--out);}
.qa.open .qa-a{grid-template-rows:1fr;}
.qa-a > div{overflow:hidden;}
.qa-a p{margin:0;padding:0 2.625rem 1.5rem .375rem;font-size:.9062rem;line-height:1.7;color:var(--txt2);}
.qa-a a{color:var(--primary-bright);text-decoration:underline;}

/* ─────────── ПІДВАЛ ─────────── */
.foot{position:relative;z-index:2;max-width:68.75rem;margin:7.5rem auto 0;padding:3.125rem var(--gut) 2.5rem;text-align:center;border-top:1px solid rgba(255,255,255,.07);}
.foot .f-mark{width:4rem;height:4rem;margin:0 auto;filter:drop-shadow(0 0 1rem rgba(var(--primary-rgb),.45));}
.foot nav{display:flex;flex-wrap:wrap;justify-content:center;gap:.625rem 1.625rem;margin-top:1.375rem;}
.foot nav a,.foot nav button{font-size:.875rem;font-weight:600;color:var(--txt2);transition:color .25s;}
.foot nav a:hover,.foot nav button:hover{color:var(--primary-bright);}
.foot .f-dl{margin-top:1.625rem;}
/* умови Tebex — дрібним шрифтом */
.foot .legal-note{max-width:47.5rem;margin:1.625rem auto 0;font-size:.7188rem;line-height:1.7;color:var(--txt4);}
.foot .legal-links{display:flex;flex-wrap:wrap;justify-content:center;gap:.25rem 1rem;margin-top:.5rem;font-size:.7188rem;}
.foot .legal-links a,.foot .legal-links button{color:var(--txt3);text-decoration:underline;text-underline-offset:.1875rem;text-decoration-color:rgba(255,255,255,.2);transition:color .25s;}
.foot .legal-links a:hover,.foot .legal-links button:hover{color:var(--primary-bright);}
.foot .copy{margin-top:.875rem;font-size:.6875rem;color:var(--txt5);}

/* ─────────── КОШИК ─────────── */
.scrim{position:fixed;inset:0;z-index:40;background:rgba(3,4,7,.55);backdrop-filter:blur(.25rem);-webkit-backdrop-filter:blur(.25rem);opacity:0;visibility:hidden;transition:opacity .35s,visibility 0s linear .35s;}
.scrim.on{opacity:1;visibility:visible;transition:opacity .35s;}
.drawer{position:fixed;top:0;right:0;bottom:0;z-index:50;width:min(27.5rem,100%);display:flex;flex-direction:column;
  background:rgba(7,7,9,.97);border-left:1px solid rgba(var(--primary-rgb),.45);box-shadow:-1.5rem 0 4.5rem rgba(0,0,0,.6),0 0 1.75rem rgba(var(--primary-rgb),.15);
  transform:translateX(105%);visibility:hidden;transition:transform .5s var(--out),visibility 0s linear .5s;}
.drawer.open{transform:none;visibility:visible;transition:transform .5s var(--out);}
.dr-head{display:flex;align-items:center;gap:.75rem;padding:1.375rem 1.375rem 1rem;border-bottom:1px solid var(--line);}
.dr-head h3{margin:0;font-family:var(--font-d);font-size:1.1875rem;font-weight:700;}
.dr-head p{margin:2px 0 0;font-size:.75rem;color:var(--txt3);}
.dr-head .px{margin-left:auto;}
.dr-body{flex:1;overflow-y:auto;padding:1rem 1.375rem;scrollbar-width:thin;}
.dr-user{display:flex;align-items:center;gap:.625rem;padding:.625rem .75rem;margin-bottom:.75rem;border-radius:.625rem;background:rgba(34,197,94,.06);border:1px solid rgba(34,197,94,.25);font-size:.8125rem;color:var(--txt2);}
.dr-user b{color:#fff;}
.dr-user button{margin-left:auto;font-size:.6875rem;font-weight:700;color:var(--txt3);text-decoration:underline;}
.dr-user button:hover{color:#fff;}
.dr-user.guest{background:rgba(var(--primary-rgb),.06);border-color:rgba(var(--primary-rgb),.3);}
.dr-hint{display:flex;gap:.5625rem;align-items:flex-start;margin:-.25rem 0 .75rem;padding:.625rem .75rem;border-radius:.625rem;background:rgba(255,255,255,.03);border:1px dashed rgba(var(--primary-rgb),.3);font-size:.7812rem;line-height:1.55;color:var(--txt3);}
.dr-hint .ic{flex:none;font-size:.875rem;color:var(--primary-color);margin-top:1px;}
.lines{display:flex;flex-direction:column;gap:.5rem;}
.line{display:grid;grid-template-columns:3.875rem 1fr auto;gap:.75rem;align-items:center;padding:.625rem;border-radius:.625rem;background:var(--inner);border:1px solid var(--line2);transition:opacity .25s,transform .3s;}
.line.new{animation:lineIn .5s var(--out) both;animation-delay:calc(var(--i,0) * 60ms);}
.line.out{opacity:0;transform:translateX(1.875rem) scale(.97);}
@keyframes lineIn{from{opacity:0;transform:translateX(1.75rem)}to{opacity:1;transform:none}}
.line-art{width:3.875rem;height:3.375rem;border-radius:.4375rem;overflow:hidden;background:radial-gradient(79% 79% at 50% 21%,#ffffff14,#99999905);}
.line-art .art,.line-art img{width:100%;height:100%;object-fit:cover;}
.line-n{font-size:.875rem;font-weight:600;line-height:1.3;}
.line-g{font-size:.6875rem;color:var(--primary-color);margin-top:2px;}
.line-p{margin-top:.375rem;display:flex;align-items:center;gap:.625rem;}
.line-r{display:flex;flex-direction:column;align-items:flex-end;gap:.5rem;}
.line-t{font-family:var(--font-d);font-size:.875rem;font-weight:700;font-variant-numeric:tabular-nums;}
.rm{width:1.75rem;height:1.75rem;border-radius:.375rem;display:flex;align-items:center;justify-content:center;color:var(--txt4);border:1px solid var(--line);transition:color .2s,border-color .2s,background .2s;}
.rm:hover{color:var(--red2);border-color:rgba(255,85,85,.5);background:rgba(255,85,85,.08);}
.qty{display:inline-flex;align-items:center;height:1.75rem;border-radius:.375rem;border:1px solid var(--line2);background:rgba(0,0,0,.3);}
.qty button{width:1.625rem;height:100%;display:flex;align-items:center;justify-content:center;color:var(--txt3);font-size:.8125rem;transition:color .2s;}
.qty button:hover{color:var(--primary-bright);}
.qty span{min-width:1.375rem;text-align:center;font-size:.8125rem;font-weight:700;font-variant-numeric:tabular-nums;}
.qty.lg{height:2.625rem;}
.qty.lg button{width:2.5rem;font-size:1rem;}
.qty.lg span{min-width:2.25rem;font-size:.9375rem;}
.dr-empty{display:flex;flex-direction:column;align-items:center;text-align:center;gap:.625rem;padding:3.5rem .625rem;color:var(--txt3);font-size:.8125rem;}
.dr-empty .ic{font-size:2.875rem;color:var(--txt5);animation:floaty 3s ease-in-out infinite;}
@keyframes floaty{0%,100%{transform:translateY(0)}50%{transform:translateY(-.375rem)}}
.codes{margin-top:1rem;border-radius:.625rem;border:1px solid var(--line2);background:var(--inner);}
.codes-t{width:100%;display:flex;align-items:center;gap:.625rem;padding:.8125rem .875rem;font-size:.875rem;font-weight:600;color:var(--txt2);}
.codes-t .ic{color:var(--primary-color);font-size:1rem;}
.codes-t .chev{margin-left:auto;color:var(--txt4);transition:transform .35s var(--spring);}
.codes.open .codes-t .chev{transform:rotate(180deg);}
.codes-b{display:grid;grid-template-rows:0fr;transition:grid-template-rows .4s var(--out);}
.codes.open .codes-b{grid-template-rows:1fr;}
.codes-b > div{overflow:hidden;}
.codes-in{padding:0 .875rem .875rem;}
.seg{position:relative;display:flex;padding:.1875rem;border-radius:var(--r);background:rgba(0,0,0,.35);border:1px solid var(--line);}
.seg button{position:relative;z-index:2;flex:1;height:2rem;border-radius:.375rem;font-size:.7812rem;font-weight:600;color:var(--txt3);transition:color .25s;}
.seg button.on{color:#000;}
.seg-ind{position:absolute;z-index:1;top:0;left:0;border-radius:.3125rem;background:var(--primary-bright);box-shadow:0 0 .875rem rgba(var(--primary-rgb),.35);transition:transform .45s var(--spring),width .45s var(--spring);}
.seg-ind.no-anim{transition:none;}
.code-row{display:flex;gap:.5rem;margin-top:.625rem;}
.code-row .btn{height:2.625rem;padding:0 1rem;}
.input{flex:1;min-width:0;height:2.625rem;padding:0 .75rem;border-radius:.625rem;background:rgba(255,255,255,.04);border:1px solid var(--line2);color:#fff;font-size:.875rem;outline:none;transition:border-color .2s,background .2s;}
.input:focus{border-color:rgba(var(--primary-rgb),.55);background:rgba(255,255,255,.06);}
.input::placeholder{color:var(--txt5);}
.input.shake{animation:shake .45s;border-color:rgba(239,68,68,.6);}
@keyframes shake{20%,60%{transform:translateX(-.3125rem)}40%,80%{transform:translateX(.3125rem)}}
.applied{display:flex;flex-wrap:wrap;gap:.375rem;margin-top:.625rem;}
.applied .tag{text-transform:none;letter-spacing:.02em;font-size:.6875rem;padding:.3125rem .375rem .3125rem .5625rem;}
.applied .tag button{display:flex;color:inherit;opacity:.7;}
.applied .tag button:hover{opacity:1;}
.dr-foot{padding:1rem 1.375rem 1.375rem;border-top:1px solid var(--line);background:linear-gradient(180deg,rgba(10,10,12,.2),rgba(10,10,12,.9));}
.get{display:flex;align-items:center;gap:.5625rem;margin-bottom:.875rem;padding:.6875rem .8125rem;border-radius:.625rem;background:linear-gradient(90deg,rgba(var(--primary-rgb),.14),rgba(var(--primary-rgb),.03));border:1px solid rgba(var(--primary-rgb),.32);font-size:.875rem;font-weight:600;color:var(--txt2);}
.get .ic{font-size:1.125rem;color:var(--primary-bright);}
.get b{margin-left:auto;font-family:var(--font-d);font-size:1rem;font-weight:700;color:var(--primary-bright);text-shadow:0 0 .875rem rgba(var(--primary-rgb),.5);}
.sum{display:flex;flex-direction:column;gap:.375rem;margin-bottom:.875rem;}
.sum div{display:flex;justify-content:space-between;font-size:.8438rem;color:var(--txt3);font-variant-numeric:tabular-nums;}
.sum .disc{color:#86efac;}
.sum .tot{margin-top:.25rem;padding-top:.625rem;border-top:1px dashed var(--line2);font-size:.9375rem;font-weight:600;color:#fff;align-items:baseline;}
.sum .tot b{font-family:var(--font-d);font-size:1.5rem;font-weight:700;color:var(--primary-bright);}
.pay-note{display:flex;align-items:center;justify-content:center;gap:.5rem;margin-top:.625rem;font-size:.75rem;color:var(--txt4);text-align:center;}
.pay-note .ic{font-size:.8125rem;color:var(--green);}
/* після «Купити» кошик відкривається, а «Оплатити» двічі м'яко пульсує — наступний крок */
.btn.nudge{animation:nudge 1.1s var(--out) 2;}
@keyframes nudge{50%{transform:translateY(-.125rem) scale(1.025);box-shadow:inset 0 1px 0 rgba(255,255,255,.75),0 0 0 .375rem rgba(var(--primary-rgb),.22),0 0 2.75rem rgba(var(--primary-rgb),.75);}}

/* ─────────── ВІКНА ─────────── */
.modal{position:fixed;inset:0;z-index:60;display:flex;align-items:center;justify-content:center;padding:1.25rem;visibility:hidden;transition:visibility 0s linear .45s;}
.modal.open{visibility:visible;transition:none;}
.modal .scrim{position:absolute;z-index:0;visibility:inherit;opacity:0;transition:opacity .4s;}
.modal.open .scrim{opacity:1;}
.md-win{position:relative;z-index:1;width:min(58.75rem,100%);max-height:calc(100vh - 2.5rem);display:flex;flex-direction:column;
  background:linear-gradient(180deg,rgba(10,10,12,.97),rgba(10,10,12,.93));
  opacity:0;transform:translateY(1.5rem) scale(.96);filter:blur(.5rem);transition:opacity .4s var(--out),transform .55s var(--out),filter .4s;}
.modal.open .md-win{opacity:1;transform:none;filter:none;}
.md-win.sm{width:min(29.375rem,100%);}
.md-head{display:flex;align-items:center;gap:.875rem;padding:1.125rem 1.125rem .875rem;border-bottom:1px solid var(--line);}
.md-head h3{margin:0;font-family:var(--font-d);font-size:1.0625rem;font-weight:700;letter-spacing:-.01em;line-height:1.2;}
.md-head p{margin:.1875rem 0 0;font-size:.7188rem;color:var(--txt3);letter-spacing:.04em;}
.md-head .px{margin-left:auto;}
.md-body{overflow-y:auto;padding:1.375rem;scrollbar-width:thin;}
.pd{display:grid;grid-template-columns:1fr 1fr;gap:1.625rem;}
.pd-art{position:relative;border-radius:.75rem;overflow:hidden;aspect-ratio:1.15;background:radial-gradient(79% 79% at 50% 21%,#ffffff12,#99999905);}
.pd-art .art{width:100%;height:100%;}
.pd-art img{width:100%;height:100%;object-fit:cover;}
.pd-thumbs{display:flex;gap:.5rem;margin-top:.625rem;overflow-x:auto;}
.pd-thumbs button{width:4rem;height:3rem;flex:none;border-radius:.375rem;overflow:hidden;border:1px solid var(--line2);opacity:.6;transition:opacity .2s,border-color .2s;}
.pd-thumbs button.on,.pd-thumbs button:hover{opacity:1;border-color:var(--primary-color);}
.pd-thumbs img{width:100%;height:100%;object-fit:cover;}
.pd-info{display:flex;flex-direction:column;min-width:0;}
.pd-price{display:flex;align-items:baseline;gap:.75rem;flex-wrap:wrap;margin-top:.375rem;}
.pd-price .price{font-size:2rem;}
.pd-desc{margin-top:1rem;font-size:.9062rem;line-height:1.7;color:var(--txt2);}
.pd-desc p{margin:0 0 .625rem;}
.pd-desc ul,.pd-desc ol{margin:0 0 .625rem;padding-left:1.25rem;}
.pd-desc li{margin:.25rem 0;}
.pd-desc li::marker{color:var(--primary-color);}
.pd-desc a{color:var(--primary-bright);text-decoration:underline;}
.pd-desc img{border-radius:.375rem;margin:.5rem 0;}
.pd-desc b,.pd-desc strong{color:#fff;}
.pd-opts{display:flex;flex-direction:column;gap:.75rem;margin-top:1rem;padding-top:1rem;border-top:1px solid var(--line);}
.opt-row{display:flex;align-items:center;justify-content:space-between;gap:.75rem;}
.field{display:flex;flex-direction:column;gap:.375rem;}
.check{display:flex;align-items:center;gap:.625rem;font-size:.875rem;font-weight:600;color:var(--txt2);cursor:pointer;}
.check input{accent-color:var(--primary-bright);width:1.0625rem;height:1.0625rem;margin:0;}
.pd-cta{display:flex;gap:.625rem;margin-top:auto;padding-top:1.25rem;}
.pd-cta .btn{flex:1;}
.pd-note{display:flex;align-items:center;gap:.5rem;margin-top:.75rem;font-size:.7188rem;color:var(--txt4);}
.pd-note .ic{color:var(--primary-color);font-size:.875rem;}
.center{text-align:center;}
.big-ibox{width:4.625rem;height:4.625rem;margin:.375rem auto 0;border-radius:1rem;font-size:2.125rem;}
.md-title{margin:1.25rem 0 .5rem;font-family:var(--font-d);font-size:1.375rem;font-weight:700;letter-spacing:-.01em;}
.md-text{margin:0 auto;max-width:23.75rem;font-size:.9062rem;line-height:1.65;color:var(--txt2);}
.md-cta{display:flex;flex-direction:column;gap:.5rem;margin-top:1.5rem;}
.md-small{margin-top:.875rem;font-size:.75rem;color:var(--txt4);line-height:1.55;}
.md-x{position:absolute;top:.875rem;right:.875rem;z-index:3;}
.terms{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:.75rem;counter-reset:t;}
.terms li{position:relative;padding-left:2.5rem;font-size:.8438rem;line-height:1.65;color:var(--txt2);counter-increment:t;}
.terms li::before{content:counter(t,decimal-leading-zero);position:absolute;left:0;top:1px;font-family:var(--font-d);font-size:.8125rem;font-weight:700;color:var(--primary-bright);}
.legal{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:1.25rem;}
.okmark{width:5.875rem;height:5.875rem;margin:.25rem auto 0;position:relative;}
.okmark svg{width:100%;height:100%;}
.okmark circle{fill:rgba(var(--primary-rgb),.1);stroke:var(--primary-bright);stroke-width:3;stroke-dasharray:283;stroke-dashoffset:283;animation:draw .9s var(--out) forwards;}
.okmark path{fill:none;stroke:var(--primary-bright);stroke-width:5;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:70;stroke-dashoffset:70;animation:draw .5s .7s var(--out) forwards;}
.okmark::after{content:"";position:absolute;inset:-.875rem;border-radius:50%;border:1px solid rgba(var(--primary-rgb),.5);animation:ringOut 1.6s .6s ease-out infinite;}
@keyframes draw{to{stroke-dashoffset:0}}
@keyframes ringOut{from{transform:scale(.8);opacity:1}to{transform:scale(1.4);opacity:0}}
.demo-pay{margin-top:.25rem;padding:.875rem;border-radius:.625rem;border:1px dashed rgba(96,165,250,.45);background:rgba(96,165,250,.06);font-size:.7812rem;color:#bfdbfe;line-height:1.55;}
.pay-sum{display:flex;justify-content:space-between;align-items:baseline;margin-top:1rem;padding:.875rem;border-radius:.625rem;background:rgba(0,0,0,.3);border:1px solid var(--line2);}
.pay-sum b{font-size:1.625rem;color:var(--primary-bright);}
#confetti{position:fixed;inset:0;z-index:70;pointer-events:none;width:100%;height:100%;}

/* ─────────── СПОВІЩЕННЯ ─────────── */
.toasts{position:fixed;left:50%;bottom:1.75rem;z-index:80;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:.5rem;pointer-events:none;}
.toast{display:flex;align-items:center;gap:.625rem;padding:.75rem 1.125rem;border-radius:.625rem;font-size:.7812rem;font-weight:700;max-width:min(32.5rem,calc(100vw - 1.875rem));
  box-shadow:0 .875rem 2.5rem rgba(0,0,0,.5);backdrop-filter:blur(.5rem);-webkit-backdrop-filter:blur(.5rem);animation:toastIn .5s var(--spring) both;pointer-events:auto;}
.toast .ic{font-size:1.0625rem;flex:none;}
.toast.ok{background:rgba(20,40,26,.86);border:1px solid rgba(34,197,94,.4);color:#86efac;}
.toast.err{background:rgba(48,16,16,.88);border:1px solid rgba(239,68,68,.45);color:#fca5a5;}
.toast.info{background:rgba(30,26,14,.9);border:1px solid rgba(var(--primary-rgb),.45);color:#fff3d6;}
.toast.bye{animation:toastOut .3s ease both;}
@keyframes toastIn{from{opacity:0;transform:translateY(1.25rem) scale(.9)}to{opacity:1;transform:none}}
@keyframes toastOut{to{opacity:0;transform:translateY(.625rem) scale(.96)}}
.flyer{position:fixed;left:0;top:0;z-index:90;width:5.25rem;height:4.375rem;pointer-events:none;filter:drop-shadow(0 .625rem 1.25rem rgba(0,0,0,.5)) drop-shadow(0 0 1rem rgba(var(--primary-rgb),.6));}
.flyer .art{width:100%;height:100%;}
.demo-bar{position:fixed;top:0;left:0;right:0;z-index:31;display:flex;align-items:center;justify-content:center;gap:.625rem;padding:.4375rem .875rem;font-size:.75rem;font-weight:700;color:#bfdbfe;text-align:center;
  background:linear-gradient(90deg,rgba(37,99,235,.18),rgba(37,99,235,.34),rgba(37,99,235,.18));border-bottom:1px solid rgba(96,165,250,.35);}
.demo-bar .ic{font-size:.9375rem;flex:none;}
body.has-demo .head{top:2.125rem;}

/* SVG-арт */
.art-label{font:700 11px Unbounded,Fixel,sans-serif;letter-spacing:.04em;}
.art-float{animation:artFloat 5s ease-in-out infinite;transform-box:fill-box;transform-origin:center;}
@keyframes artFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}
.art-glint{animation:glint 4.5s ease-in-out infinite;}
@keyframes glint{0%,55%{transform:translateX(0) rotate(18deg)}85%,100%{transform:translateX(300px) rotate(18deg)}}
.art-spark{transform-box:fill-box;transform-origin:center;animation:twinkle 2.6s ease-in-out infinite;}
@keyframes twinkle{0%,100%{opacity:.15;scale:.5}50%{opacity:1;scale:1}}
.art-aura{animation:aura 4s ease-in-out infinite;transform-box:fill-box;transform-origin:center;}
@keyframes aura{0%,100%{opacity:.75}50%{opacity:1}}
.art-run{transform-box:view-box;transform-origin:120px 100px;animation:artRun 3.8s linear infinite;}
@keyframes artRun{to{transform:rotate(360deg)}}

/* ─────────── ПРАВИЛА СЕРВЕРА ─────────── */
/* пошук-«пігулка»: відкриває читалку з курсором у полі пошуку */
.rl-find{display:flex;align-items:center;gap:.875rem;width:min(41.25rem,100%);height:3.625rem;margin:0 auto;padding:0 1.375rem;border-radius:999px;text-align:left;color:var(--txt3);font-size:.9062rem;
  background:linear-gradient(180deg,rgba(16,16,19,.84),rgba(16,16,19,.58));border:1px solid rgba(var(--primary-rgb),.28);backdrop-filter:blur(.75rem);-webkit-backdrop-filter:blur(.75rem);
  box-shadow:0 0 1.375rem rgba(var(--primary-rgb),.12),inset 0 1px 0 rgba(255,255,255,.06);transition:border-color .3s,box-shadow .3s,color .3s,transform .4s var(--spring);}
.rl-find > .ic:first-child{font-size:1.25rem;color:var(--primary-bright);}
.rl-find > .ic:last-child{font-size:1.0625rem;color:var(--primary-bright);opacity:0;transform:translateX(-.5rem);transition:opacity .3s,transform .4s var(--out);}
.rl-find span{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.rl-find:hover{color:var(--txt2);border-color:rgba(var(--primary-rgb),.6);box-shadow:0 0 2.25rem rgba(var(--primary-rgb),.26),inset 0 1px 0 rgba(255,255,255,.08);transform:translateY(-2px);}
.rl-find:hover > .ic:last-child{opacity:1;transform:none;}
/* «головне за хвилину» */
.rq-h{display:flex;align-items:center;justify-content:center;gap:.625rem;margin:4.375rem 0 1.5rem;font-size:.6875rem;font-weight:800;letter-spacing:.3em;text-transform:uppercase;color:var(--primary-bright);}
.rq-h .ic{font-size:.9375rem;}
.rq{display:grid;grid-template-columns:repeat(5,1fr);gap:.875rem;}
.rq-c{position:relative;padding:1.375rem 1.125rem 1.25rem;border-radius:.875rem;background:linear-gradient(180deg,rgba(255,255,255,.04),rgba(255,255,255,.012));border:1px solid var(--line2);
  transition:opacity .9s var(--out),transform 1.1s var(--out),filter .9s var(--out),border-color .35s,background .35s;transition-delay:calc(var(--i,0) * 90ms),calc(var(--i,0) * 90ms),calc(var(--i,0) * 90ms),0s,0s;}
.rq-c.on:hover{border-color:rgba(var(--primary-rgb),.45);background:linear-gradient(180deg,rgba(var(--primary-rgb),.09),rgba(255,255,255,.012));transform:translateY(-.25rem);transition-delay:0s;}
.rq-i{width:2.75rem;height:2.75rem;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:1.1875rem;color:var(--primary-bright);
  border:1.5px solid rgba(var(--primary-rgb),.6);box-shadow:0 0 1rem rgba(var(--primary-rgb),.25),inset 0 0 .625rem rgba(var(--primary-rgb),.18);}
.rq-c b{display:block;margin:1rem 0 .375rem;font-family:var(--font-d);font-size:.9062rem;font-weight:700;letter-spacing:-.01em;}
.rq-c p{margin:0;font-size:.8125rem;line-height:1.6;color:var(--txt3);}
/* документи: категорії з бігунком + список у дві колонки */
.rl-list{margin-top:4.375rem;}
.rl-cats{position:relative;display:flex;gap:.25rem;width:max-content;max-width:100%;margin:0 auto 1.625rem;padding:.25rem;border-radius:999px;background:rgba(0,0,0,.4);border:1px solid var(--line2);overflow-x:auto;scrollbar-width:none;}
.rl-cats::-webkit-scrollbar{display:none;}
.rl-cat{position:relative;z-index:2;flex:none;height:2.375rem;padding:0 1rem;border-radius:999px;display:flex;align-items:center;gap:.5rem;font-size:.8438rem;font-weight:600;color:var(--txt3);transition:color .25s;}
.rl-cat em{font-style:normal;font-family:var(--font-d);font-size:.6562rem;font-weight:700;opacity:.7;}
.rl-cat:hover{color:#fff;}
.rl-cat.on{color:#000;}
.rl-cats-ind{position:absolute;z-index:1;top:0;left:0;border-radius:999px;background:linear-gradient(180deg,#FFE58F,#F5CC5E 46%,#DDA636);box-shadow:inset 0 1px 0 rgba(255,255,255,.7),0 0 1.125rem rgba(var(--primary-rgb),.4);
  opacity:0;pointer-events:none;transition:transform .5s var(--spring),width .5s var(--spring),opacity .3s;}
.rl-cats-ind.on{opacity:1;}
.rl-cats-ind.no-anim{transition:none;}
.rl-docs{display:grid;grid-template-columns:1fr 1fr;column-gap:2.125rem;max-width:62.5rem;margin:0 auto;}
.rl-doc{display:flex;align-items:center;gap:.875rem;width:100%;min-width:0;padding:1rem .625rem;text-align:left;border-bottom:1px solid rgba(255,255,255,.09);border-radius:0;
  transition:opacity .9s var(--out),transform 1.1s var(--out),filter .9s var(--out),background .3s,padding .4s var(--out);transition-delay:calc(var(--i,0) * 60ms),calc(var(--i,0) * 60ms),calc(var(--i,0) * 60ms),0s,0s;}
.rl-doc:nth-child(-n+2){border-top:1px solid rgba(255,255,255,.09);}
.rl-di{width:2.5rem;height:2.5rem;flex:none;border-radius:.625rem;display:flex;align-items:center;justify-content:center;font-size:1.125rem;color:var(--primary-bright);background:rgba(var(--primary-rgb),.08);border:1px solid rgba(var(--primary-rgb),.25);transition:background .3s,color .3s,box-shadow .3s;}
.rl-dt{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px;}
.rl-dt b{font-size:.9375rem;font-weight:600;line-height:1.3;transition:color .3s;}
.rl-dt small{font-size:.7812rem;color:var(--txt4);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.rl-doc em{font-style:normal;font-family:var(--font-d);font-size:.75rem;font-weight:700;color:var(--txt4);}
.rl-doc > .ic{font-size:1rem;color:var(--primary-bright);opacity:0;transform:translateX(-.375rem);transition:opacity .3s,transform .4s var(--out);}
.rl-doc.on:hover{background:linear-gradient(90deg,rgba(var(--primary-rgb),.09),rgba(var(--primary-rgb),0) 80%);padding-left:1rem;transition-delay:0s;}
.rl-doc:hover .rl-dt b{color:var(--primary-bright);}
.rl-doc:hover .rl-di{background:var(--primary-bright);color:#000;box-shadow:0 0 1.125rem rgba(var(--primary-rgb),.45);}
.rl-doc:hover > .ic{opacity:1;transform:none;}
.rl-skel{display:grid;grid-template-columns:1fr 1fr;gap:.75rem 2.125rem;max-width:62.5rem;margin:0 auto;}
.rl-skel i{height:3.875rem;border-radius:.625rem;background:linear-gradient(90deg,rgba(255,255,255,.03),rgba(255,255,255,.07),rgba(255,255,255,.03));background-size:200% 100%;animation:rlSkel 1.4s linear infinite;}
@keyframes rlSkel{to{background-position:-200% 0}}
.rl-empty{display:flex;flex-direction:column;align-items:center;gap:.625rem;padding:2.5rem .625rem;text-align:center;color:var(--txt3);font-size:.875rem;}
.rl-empty .ic{font-size:1.625rem;color:var(--primary-color);}
.rl-empty button{color:var(--primary-bright);text-decoration:underline;}

/* читалка правил (велике вікно) */
.md-win.xl{width:min(73.75rem,100%);height:min(55rem,calc(100vh - 2.5rem));}
.rl{flex:1;min-height:0;display:grid;grid-template-columns:18.75rem 1fr;}
.rl-side{position:relative;display:flex;flex-direction:column;min-height:0;border-right:1px solid var(--line);}
.rl-search{display:flex;align-items:center;gap:.625rem;height:2.75rem;margin:1rem 1rem .5rem;padding:0 .5rem 0 .75rem;border-radius:.625rem;background:rgba(255,255,255,.04);border:1px solid var(--line2);transition:border-color .2s,background .2s,box-shadow .2s;}
.rl-search:focus-within{border-color:rgba(var(--primary-rgb),.55);background:rgba(255,255,255,.06);box-shadow:0 0 1.125rem rgba(var(--primary-rgb),.15);}
.rl-search > .ic{font-size:1.0625rem;color:var(--primary-bright);}
.rl-search input{flex:1;min-width:0;height:100%;background:none;border:0;outline:none;color:#fff;font-size:.875rem;}
.rl-search input::placeholder{color:var(--txt5);}
.rl-search input::-webkit-search-cancel-button{display:none;}
.rl-qx{width:1.75rem;height:1.75rem;border-radius:.4375rem;display:flex;align-items:center;justify-content:center;color:var(--txt3);font-size:.9375rem;flex:none;}
.rl-qx:hover{color:#fff;background:rgba(255,255,255,.08);}
.rl-pick{display:none;}
.rl-nav{flex:1;min-height:0;overflow-y:auto;padding:0 .625rem 1rem;scrollbar-width:thin;}
.rl-cat-h{display:flex;align-items:center;gap:.5rem;margin:1rem .5rem .375rem;font-size:.6562rem;font-weight:800;letter-spacing:.2em;text-transform:uppercase;color:var(--txt4);}
.rl-cat-h .ic{font-size:.8125rem;color:var(--primary-color);}
.rl-it{display:flex;align-items:center;gap:.625rem;width:100%;padding:.5625rem .625rem;border-radius:.5rem;text-align:left;font-size:.8438rem;font-weight:500;line-height:1.35;color:var(--txt2);transition:background .2s,color .2s,box-shadow .2s;}
.rl-it span{flex:1;min-width:0;}
.rl-it em{font-style:normal;font-family:var(--font-d);font-size:.6562rem;font-weight:700;color:var(--txt4);}
.rl-it:hover{background:rgba(255,255,255,.05);color:#fff;}
.rl-it.on{background:rgba(var(--primary-rgb),.13);color:var(--primary-bright);box-shadow:inset 2px 0 0 var(--primary-bright);}
.rl-it.on em{color:var(--primary-color);}
.rl-main{position:relative;min-height:0;overflow-y:auto;padding:1.625rem 2.25rem 2.75rem;scrollbar-width:thin;outline:none;}
.rl-dh{padding-bottom:1.125rem;margin-bottom:.375rem;border-bottom:1px solid var(--line);}
.rl-dh h2{margin:.75rem 0 .375rem;font-family:var(--font-d);font-size:clamp(1.25rem,2.2vw,1.6875rem);font-weight:800;letter-spacing:-.015em;line-height:1.2;}
.rl-dh p{margin:0;font-size:.8125rem;color:var(--txt3);}
.ra-sec{margin:1.875rem 0 .25rem;padding-left:.75rem;border-left:.1875rem solid var(--primary-bright);font-family:var(--font-d);font-size:.9375rem;font-weight:700;line-height:1.35;}
.ra{display:grid;grid-template-columns:4.625rem 1fr;gap:.75rem;padding:.875rem .5rem .875rem 0;border-bottom:1px solid rgba(255,255,255,.05);border-radius:.5rem;}
.ra-num{position:relative;align-self:start;justify-self:start;min-width:3.125rem;height:1.75rem;padding:0 .5625rem;border-radius:.4375rem;display:inline-flex;align-items:center;justify-content:center;
  font-family:var(--font-d);font-size:.75rem;font-weight:700;color:var(--primary-bright);background:rgba(var(--primary-rgb),.1);border:1px solid rgba(var(--primary-rgb),.3);transition:background .2s,color .2s,box-shadow .2s;}
.ra-num .ic{position:absolute;left:calc(100% + .3125rem);top:50%;margin-top:-.4375rem;font-size:.875rem;color:var(--primary-bright);opacity:0;transition:opacity .2s;}
.ra-num:hover{background:var(--primary-bright);color:#000;box-shadow:0 0 1rem rgba(var(--primary-rgb),.45);}
.ra-num:hover .ic{opacity:1;}
.ra-num mark{background:none;color:inherit;text-decoration:underline;}
.ra-dot{justify-self:start;width:.4375rem;height:.4375rem;margin:.625rem 0 0 1.3125rem;border-radius:50%;background:var(--primary-color);box-shadow:0 0 .625rem rgba(var(--primary-rgb),.6);}
.ra-b{min-width:0;font-size:.9062rem;line-height:1.7;color:var(--txt2);}
.ra-b h4{margin:1px 0 .25rem;font-size:.9375rem;font-weight:700;color:#fff;}
.ra-b p{margin:2px 0 0;}
.ra-b ul{margin:.5rem 0 0;padding-left:1.25rem;}
.ra-b li{margin:.25rem 0;}
.ra-b li::marker{color:var(--primary-color);}
.ra-notes{margin-top:.625rem;padding:.625rem .875rem;border-radius:.5625rem;background:rgba(96,165,250,.06);border:1px solid rgba(96,165,250,.22);font-size:.8438rem;}
.ra-notes b{display:flex;align-items:center;gap:.4375rem;font-size:.6562rem;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:#93c5fd;}
.ra-notes ul{margin:.375rem 0 0;}
.ra-notes li::marker{color:#93c5fd;}
.ra-pen{display:flex;gap:.625rem;margin-top:.625rem;padding:.625rem .875rem;border-radius:.5625rem;background:rgba(239,68,68,.07);border:1px solid rgba(239,68,68,.25);font-size:.8438rem;line-height:1.6;color:#fecaca;}
.ra-pen > .ic{flex:none;margin-top:.1875rem;font-size:.9375rem;color:#f87171;}
.ra-pen b{display:block;font-size:.6562rem;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:#f87171;}
.ra-pen i{font-style:normal;margin:0 .4375rem;color:rgba(248,113,113,.5);}
.ra mark{background:rgba(var(--primary-rgb),.35);color:#fff;border-radius:.1875rem;padding:0 1px;}
.ra.flash{animation:raFlash 2.4s var(--out);}
@keyframes raFlash{0%,35%{background:rgba(var(--primary-rgb),.13);box-shadow:inset .1875rem 0 0 var(--primary-bright)}100%{background:rgba(var(--primary-rgb),0);box-shadow:inset .1875rem 0 0 rgba(var(--primary-rgb),0)}}
.ra.go{cursor:pointer;transition:background .2s;}
.ra.go:hover{background:rgba(255,255,255,.03);}
.ra-src{display:flex;align-items:center;gap:.5rem;margin:1.625rem 0 2px;font-size:.7188rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--primary-bright);text-align:left;}
.ra-src .ic{font-size:.875rem;flex:none;}
.ra-src:hover{color:#fff;}
.rl-next{position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:.25rem;width:100%;margin-top:1.875rem;padding:1.125rem 3.5rem 1.125rem 1.25rem;border-radius:.75rem;text-align:left;border:1px solid var(--line2);background:rgba(255,255,255,.02);transition:border-color .3s,background .3s;}
.rl-next small{font-size:.6562rem;font-weight:800;letter-spacing:.2em;text-transform:uppercase;color:var(--txt4);}
.rl-next b{font-size:.9688rem;font-weight:600;}
.rl-next > .ic{position:absolute;right:1.25rem;top:50%;margin-top:-.5625rem;font-size:1.125rem;color:var(--primary-bright);transition:transform .4s var(--spring);}
.rl-next:hover{border-color:rgba(var(--primary-rgb),.5);background:rgba(var(--primary-rgb),.06);}
.rl-next:hover > .ic{transform:translateX(.3125rem);}
.pl.ico{padding:0 .875rem;}
.pl.ico .ic{font-size:1.125rem;}
@media (max-width:1100px){
  .rq{grid-template-columns:repeat(6,1fr);}
  .rq-c{grid-column:span 2;}
  .rq-c:nth-child(4),.rq-c:nth-child(5){grid-column:span 3;}
}
@media (max-width:860px){
  .rl{grid-template-columns:1fr;grid-template-rows:auto 1fr;}
  .rl-side{border-right:0;border-bottom:1px solid var(--line);}
  .rl-search{margin:.75rem .75rem .5rem;}
  .rl-pick{display:flex;align-items:center;gap:.625rem;height:2.625rem;margin:0 .75rem .75rem;padding:0 .875rem;border-radius:.625rem;background:rgba(var(--primary-rgb),.1);border:1px solid rgba(var(--primary-rgb),.3);font-size:.8438rem;font-weight:600;color:var(--primary-bright);text-align:left;}
  .rl-pick span{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
  .rl-pick .ic{flex:none;transition:transform .3s;}
  .rl.pick .rl-pick .ic{transform:rotate(180deg);}
  .rl-nav{position:absolute;left:.75rem;right:.75rem;top:calc(100% - .375rem);z-index:5;max-height:min(60vh,27.5rem);padding:.25rem .375rem .625rem;border-radius:.75rem;background:rgba(12,12,14,.98);border:1px solid rgba(var(--primary-rgb),.3);box-shadow:0 1.5rem 3.75rem rgba(0,0,0,.75);display:none;}
  .rl.pick .rl-nav{display:block;}
  .rl-main{padding:1.125rem 1rem 1.875rem;}
  .ra{grid-template-columns:1fr;gap:.5rem;padding-right:0;}
  .ra-dot{display:none;}
}
@media (max-width:640px){
  .md-win.xl{height:94vh;height:94dvh;max-height:none;}
  .rl-find{height:3.25rem;padding:0 1.125rem;font-size:.8438rem;}
  .rq-h{margin-top:3.375rem;}
  .rq{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:.75rem;margin:0 calc(var(--gut) * -1);padding:.25rem var(--gut) .75rem;scrollbar-width:none;}
  .rq::-webkit-scrollbar{display:none;}
  .rq-c{flex:0 0 78%;scroll-snap-align:center;}
  .rl-list{margin-top:3.375rem;}
  .rl-cats{width:100%;border-radius:.875rem;}
  .rl-cat{padding:0 .8125rem;font-size:.8125rem;}
  .rl-docs,.rl-skel{grid-template-columns:1fr;}
  .rl-doc:nth-child(2){border-top:0;}
  .rl-doc{padding:.875rem .25rem;}
}

/* ─────────── АДАПТИВ ─────────── */
@media (max-width:1320px){
  .dl .dl-t{display:none;}
  .dl{padding:0 .375rem;}
  .pl{padding:0 .9375rem;}
}
@media (max-width:1100px){
  .cartbtn .cb-t small,.u-tx{display:none;}
  .head-actions .btn.glass{width:3.25rem;padding:0;}
  .head-actions .btn.glass > span:not(.bm){display:none;}
}
@media (max-width:960px){
  .only-m{display:flex !important;}
  .head{grid-template-columns:1fr;padding:.75rem .75rem 0;}
  .dl,.head-actions{display:none;}
  .pill{justify-content:space-between;width:100%;height:3.625rem;padding:0 .5rem;}
  .pill .pill-side,.pill-ind{display:none;}
  .mark{width:5rem;height:3.625rem;}
  .mark img{width:4.625rem;height:4.625rem;}
  .mnav{display:block;overflow:hidden;max-height:0;opacity:0;transition:max-height .5s var(--out),opacity .3s;}
  .head.open .mnav{max-height:32.5rem;opacity:1;}
  .mnav-in{margin-top:.625rem;padding:.625rem;border-radius:.75rem;background:rgba(10,10,12,.96);border:1px solid rgba(var(--primary-rgb),.3);display:flex;flex-direction:column;gap:.25rem;}
  .mnav-in a,.mnav-in button{display:flex;align-items:center;gap:.75rem;padding:.8125rem .875rem;border-radius:.625rem;font-size:.9375rem;font-weight:600;color:var(--txt2);text-align:left;}
  .mnav-in a:hover,.mnav-in button:hover,.mnav-in .active{background:rgba(var(--primary-rgb),.12);color:var(--primary-bright);}
  .mnav-in .ic{font-size:1.0625rem;color:var(--primary-color);}
  .coins{padding:1.5rem 1.375rem 1.375rem;}
  .coins-main{grid-template-columns:1fr;gap:.375rem;}
  .stage{max-height:18.75rem;}
  .steps{grid-template-columns:repeat(2,1fr);row-gap:2.75rem;}
  .steps::before{display:none;}
  .pd{grid-template-columns:1fr;}
}
@media (max-width:640px){
  body{font-size:.875rem;}
  .hero{min-height:max(35rem,88vh);padding:7.5rem 1.125rem 6.25rem;}
  .hero p{font-size:.9375rem;}
  .hero-cta .btn{width:100%;}
  .trust{gap:.5rem 1rem;}
  .trust li{font-size:.7188rem;}
  .sec{padding-top:5.625rem;}
  .sh{margin-bottom:2.5rem;}
  .coins{padding:1.25rem 1rem 1.125rem;border-radius:.75rem;}
  .coins-cta{flex-direction:column;}
  .coins-cta .btn{flex:none;min-width:0;width:100%;}
  .value{grid-template-columns:1fr auto;}
  .value .label{grid-column:1/-1;}
  .scale .track,.scale .fill,.scale .tick,.scale .knob,.scale input{display:none;}
  .scale{margin-top:1.125rem;padding-top:0;}
  .packs{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;margin:0 -.375rem;padding:.75rem 2px .5rem;scrollbar-width:none;}
  .packs::-webkit-scrollbar{display:none;}
  .pk{flex:0 0 7.25rem;scroll-snap-align:center;}
  .plans{grid-template-columns:1fr;gap:1rem;}
  .items{grid-template-columns:1fr;}
  .steps{grid-template-columns:1fr;}
  .qa-q{font-size:.9375rem;padding:1.125rem .25rem;}
  .modal{padding:0;align-items:flex-end;}
  .md-win{width:100%;max-height:92vh;border-radius:1rem 1rem 0 0;transform:translateY(3.125rem);}
  .md-win.sm{width:100%;}
  .toasts{bottom:1rem;}
  .demo-bar{font-size:.6875rem;padding:.375rem .625rem;}
  body.has-demo .head{top:2.75rem;}
}

/* ?still (лише локально) — без анімацій, для скриншотів */
html.still *,html.still *::before,html.still *::after{animation:none !important;transition:none !important;}
html.still .rv{opacity:1;transform:none;filter:none;}
html.still .sh h2 .tr > span{transform:none;}
html.still .sh .ln,html.still .steps::before{transform:scaleX(1);}
html.still #waves{opacity:1;}
html.still .hero::before{display:none;}
html.still .hero{min-height:60rem;}

/* менше руху — для тих, хто вимкнув анімації в системі */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important;}
  .rv{opacity:1;transform:none;filter:none;}
  .sh h2 .tr > span{transform:none;}
}
