*{box-sizing:border-box}


:root{
  --fs-cap:11px;    
  --fs-sm:12px;     
  --fs-md:13px;     
  --fs-base:15px;   
  --fs-lg:18px;     
  --fs-xl:22px;     
  --fs-xxl:28px;    
  
  --fs-field:16px;
  --lh-tight:1.2;   
  --lh-text:1.5;    
  
  --r-card:12px;    
  --r-in:10px;      
  --r-pill:999px;   
  
  --sh-card:0 8px 20px -12px rgba(0,0,0,.6);
  --sh-lift:0 14px 30px -14px rgba(0,0,0,.66);
  
  --fo-line:color-mix(in oklab, var(--lamp) 45%, transparent);
  --fo-ring:0 0 0 3px color-mix(in oklab, var(--lamp) 18%, transparent);
}


[hidden]{display:none !important}
body{margin:0; color:var(--cream); font-family:var(--font); font-size:var(--fs-base);
  line-height:var(--lh-text); -webkit-font-smoothing:antialiased;
  padding-bottom:calc(24px + env(safe-area-inset-bottom))}

body::before{content:""; position:fixed; inset:0; z-index:-2; pointer-events:none;
  
  background:url("img/mine-sm.jpg?v=ce4117df") 50% 40% / cover no-repeat}
body::after{content:""; position:fixed; inset:0; z-index:-1; pointer-events:none;
  background:
    linear-gradient(180deg, color-mix(in oklab, var(--deep) 16%, transparent) 0%,
      color-mix(in oklab, var(--deep) 28%, transparent) 34%,
      color-mix(in oklab, var(--deep) 38%, transparent) 68%,
      color-mix(in oklab, var(--deep) 46%, transparent) 100%),
    radial-gradient(120% 76% at 52% 26%, transparent 42%,
      color-mix(in oklab, var(--deep) 32%, transparent) 100%)}
.head{position:relative}
.hidden{display:none!important}
button{font:inherit; color:inherit; border:0; background:none; cursor:pointer}
.app{position:relative; z-index:1; padding:0 16px}
button,.ore{-webkit-tap-highlight-color:transparent; touch-action:manipulation;
  -webkit-user-select:none; user-select:none}
:focus-visible{outline:2px solid var(--fo-line); outline-offset:2px;
  border-radius:var(--r-in)}
.screen{display:none}
.screen.show{display:block}

.head{padding:10px 2px 16px; position:relative}

.head h1{margin:0 0 5px; font-size:var(--fs-xxl); line-height:var(--lh-tight); letter-spacing:-.03em;
  text-wrap:balance}
.head p{margin:0; color:var(--sand); font-size:var(--fs-md); text-wrap:pretty}


.head img{display:block; width:min(78%, 300px); height:auto; margin:2px auto -6px;
  filter:drop-shadow(0 16px 26px rgba(0,0,0,.72))}


.head::after{content:""; position:absolute; left:50%; translate:-50% 0; top:96px;
  width:min(88%, 340px); height:110px; pointer-events:none; z-index:-1; filter:blur(22px);
  background:radial-gradient(54% 58% at 50% 40%,
    color-mix(in oklab, var(--zhar) 30%, transparent) 0%,
    color-mix(in oklab, var(--zhar-lo) 10%, transparent) 48%, transparent 78%)}

.games{display:flex; gap:7px; overflow-x:auto; padding:14px 0 4px; scrollbar-width:none}
.games::-webkit-scrollbar{display:none}
.chip{flex:none; display:flex; align-items:center; gap:7px; white-space:nowrap;
  padding:8px 13px; border-radius:var(--r-pill); font-size:var(--fs-md);
  border:1px solid var(--seam); background:var(--stone); color:var(--sand);
  transition:transform var(--t-press) var(--ease-out)}
.chip i{width:6px;height:6px;border-radius:50%}
.chip.on{color:var(--cream); border-color:var(--lamp-lo); background:var(--stone-2)}
.chip.soon{opacity:.4}
.chip:not(.soon):active{transform:scale(.97)}

.grid{display:grid; grid-template-columns:1fr 1fr; gap:9px; margin-top:12px}
.ore{position:relative; text-align:left; padding:15px 14px 13px; border-radius:var(--r-card);
  border:1px solid var(--seam);
  background:linear-gradient(168deg, var(--stone) 0%, var(--stone-deep) 100%);
  -webkit-tap-highlight-color:transparent;
  box-shadow:inset 0 1px 0 color-mix(in oklab, var(--lamp-hi) 8%, transparent);
    font-variant-numeric:tabular-nums;
  transition:scale var(--t-press) var(--ease-out), border-color 200ms var(--ease-out);
  opacity:0; translate:0 8px;
  animation:rise 260ms var(--ease-out) forwards}
@keyframes rise{to{opacity:1; translate:0 0}}
.ore:not(.spent):active{scale:.972; transition-duration:60ms}
.ore.picked{border-color:transparent; outline:1px solid var(--lamp-lo); outline-offset:-1px;
  box-shadow:inset 0 1px 0 color-mix(in oklab, var(--lamp-hi) 18%, transparent); translate:0 -2px}
.ore.spent{opacity:1; background:var(--deep);
  border-color:color-mix(in oklab, var(--seam) 55%, transparent); filter:saturate(.2)}
.ore.spent .qty b,.ore.spent .cost{color:var(--sand-dim)}
.ore .qty{display:flex; align-items:baseline; gap:5px; letter-spacing:-.02em}
.ore .qty b{font-size:var(--fs-lg); font-weight:700}
.ore .qty u{text-decoration:none; font-size:var(--fs-cap); font-weight:700; color:var(--lamp)}
.ore .cost{margin-top:8px; font-size:var(--fs-base); font-weight:600}
.ore .unit{margin-top:2px; font-size:var(--fs-cap); color:var(--sand-dim)}
.ore .tagline{position:relative; height:16px; margin-bottom:8px}
.ore .mark,.ore .gone{display:inline-flex; align-items:center; gap:4px; padding:3px 7px;
  border-radius:var(--r-in); font-size:var(--fs-cap); font-weight:700; letter-spacing:.08em;
  text-transform:uppercase; white-space:nowrap}
.ore .mark .ic{width:9px;height:9px}
.ore .mark{color:var(--on-lamp);
  background:var(--metal);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.5),
    0 3px 8px -3px color-mix(in oklab, var(--lamp) 70%, transparent)}
.ore .gone{background:var(--seam); color:var(--sand-dim)}
.sig{margin-top:18px; font-size:var(--fs-cap); color:var(--sand-dim); text-align:center;
  line-height:var(--lh-text); opacity:.75}

.panel{border-radius:var(--r-card); border:1px solid var(--seam);
  box-shadow:var(--sh-card);
  background:linear-gradient(180deg,
    color-mix(in oklab, var(--stone-2) 80%, transparent) 0%,
    color-mix(in oklab, var(--rock) 90%, transparent) 100%);
  padding:16px; margin:18px 0}
.line{display:flex; justify-content:space-between; align-items:baseline; padding:8px 0;
  font-size:var(--fs-base)}
.line + .line{border-top:0; background:linear-gradient(90deg,transparent,
  color-mix(in oklab, var(--seam-2) 85%, transparent) 12%,
    color-mix(in oklab, var(--seam-2) 85%, transparent) 88%,
    transparent) top/100% 1px no-repeat}
.line dd{font-variant-numeric:tabular-nums}
.line dt{color:var(--sand-dim); margin:0}
.line dd{margin:0}
.line.pay dd{font-size:var(--fs-lg); font-weight:700; color:var(--lamp-hi); letter-spacing:-.02em}

.field{margin-bottom:14px}
.field label{display:block; font-size:var(--fs-sm); color:var(--sand-dim); margin-bottom:7px}
.field input{width:100%; font:var(--fs-field)/var(--lh-text) var(--font); color:var(--cream);
  background:color-mix(in oklab, var(--deep) 60%, transparent);
    border:1px solid var(--seam); border-radius:var(--r-in);
  padding:13px; outline:none; transition:border-color var(--t-hover) ease}
.field input::placeholder{color:var(--sand-dim)}
.field input:-webkit-autofill,.field input:-webkit-autofill:focus{
  -webkit-text-fill-color:var(--cream); caret-color:var(--lamp);
  -webkit-box-shadow:0 0 0 100px color-mix(in oklab, var(--deep) 98%, transparent) inset;
  transition:background-color 0s 600000s}
.field input:focus{border-color:var(--fo-line); box-shadow:var(--fo-ring)}
.field input.wrong{border-color:var(--rust)}
.field .say{margin-top:7px; font-size:var(--fs-sm); color:var(--sand-dim); line-height:var(--lh-text)}
.oops{font-size:var(--fs-md); color:var(--rust); min-height:18px}

.act{position:relative; overflow:hidden; width:100%; margin-top:8px; padding:15px;
  border-radius:var(--r-in); font-size:var(--fs-base); font-weight:650;
  font-variant-numeric:tabular-nums; color:var(--on-lamp);
  background:linear-gradient(140deg,var(--lamp-hi) 0%,var(--lamp) 52%,var(--lamp-mid) 100%);
  box-shadow:0 12px 28px -16px color-mix(in oklab, var(--lamp) 85%, transparent),
    inset 0 1px 0 rgba(255,255,255,.28);
  transition:scale var(--t-press) var(--ease-out), opacity var(--t-hover) ease}
.act:active{scale:.972}
.act:disabled:not(.busy){opacity:.4; box-shadow:none}
.act-face,.act-work{display:flex; align-items:center; justify-content:center; gap:8px;
  transition:opacity 200ms ease, filter 200ms ease}
.act-work{position:absolute; inset:0; opacity:0; filter:blur(3px)}
.act.busy .act-face{opacity:0; filter:blur(3px)}
.act.busy .act-work{opacity:1; filter:none}

.trail{list-style:none; margin:20px 0 0; padding:0}
.trail li{display:flex; gap:11px; padding:9px 0; font-size:var(--fs-md); color:var(--sand-dim)}
.trail .pip{width:19px;height:19px;border-radius:50%;flex:none;margin-top:1px;
  border:1px solid var(--seam-2); display:grid; place-items:center; font-size:var(--fs-cap)}
.trail li.now{color:var(--cream)} .trail li.now .pip{border-color:var(--lamp); color:var(--lamp)}
.trail li.was{color:var(--sand)}
.trail li.was .pip{background:var(--ore); border-color:var(--ore); color:var(--on-ore)}
.trail li.lost{color:var(--rust)}
.trail li.lost .pip{background:var(--rust); border-color:var(--rust); color:var(--on-rust)}
.lamp-spin{display:inline-block;width:10px;height:10px;border-radius:50%;
  border:1.5px solid var(--lamp); border-top-color:transparent;
  animation:turn .7s linear infinite}
@keyframes turn{to{transform:rotate(360deg)}}
.told{margin-top:14px; padding:13px; border-radius:var(--r-card); font-size:var(--fs-md);
  line-height:var(--lh-text); border:1px solid var(--seam);
    background:color-mix(in oklab, var(--deep) 50%, transparent)}
.told.good{border-color:color-mix(in oklab, var(--ore) 28%, transparent);
  background:color-mix(in oklab, var(--on-ore) 28%, transparent)}
.told.bad{border-color:color-mix(in oklab, var(--rust) 30%, transparent);
  background:color-mix(in oklab, var(--on-rust) 30%, transparent)}
.told code{display:block; margin-top:9px; font-size:var(--fs-base); letter-spacing:.06em;
  word-break:break-all; color:var(--lamp-hi)}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important; transition-duration:.01ms!important}
  .ore{opacity:1; translate:none}
  
  .lamp-spin{border-top-color:currentColor; animation:pulse 1.6s ease-in-out infinite!important;
    animation-duration:1.6s!important; animation-iteration-count:infinite!important}
}
@keyframes pulse{50%{opacity:.3}}


.dock{position:fixed; left:0; right:0; bottom:0; z-index:60;
  padding:10px 12px calc(10px + env(safe-area-inset-bottom));
  background:linear-gradient(180deg, color-mix(in oklab, var(--deep) 70%, transparent) 0%,
    color-mix(in oklab, var(--deep) 96%, transparent) 44%, var(--deep) 100%);
  backdrop-filter:blur(18px) saturate(160%); -webkit-backdrop-filter:blur(18px) saturate(160%)}
.dock-in{display:flex; align-items:center; gap:11px; padding:9px 12px;
  border-radius:var(--r-card); border:1px solid var(--seam);
  background:linear-gradient(180deg, color-mix(in oklab, var(--stone-2) 94%, transparent),
    color-mix(in oklab, var(--rock) 96%, transparent));
  box-shadow:inset 0 1px 0 color-mix(in oklab, var(--lamp-hi) 8%, transparent),
    0 14px 34px -20px #000}
.dock-in > .ic{color:var(--lamp); width:19px; height:19px; flex:none}
.dock-sum{flex:1; min-width:0; line-height:var(--lh-tight)}
.dock-sum b{display:block; font-size:var(--fs-lg); font-weight:800; letter-spacing:-.02em;
  color:var(--lamp-hi); font-variant-numeric:tabular-nums}

.dock-sum > span{display:block; font-size:var(--fs-sm); color:var(--sand-dim)}
.dock .act{width:auto; flex:none; margin:0; padding:11px 15px; font-size:var(--fs-base)}

.screen[data-screen="catalog"]{padding-bottom:96px}


.cart-lines{display:flex; flex-direction:column; gap:7px; margin:16px 0 0}
.cart-line{display:flex; align-items:center; gap:10px; padding:10px 11px;
  border-radius:var(--r-in); border:1px solid var(--seam);
    background:color-mix(in oklab, var(--deep) 45%, transparent)}
.cart-line b{flex:1; font-size:var(--fs-base); font-weight:600; font-variant-numeric:tabular-nums}

.line-game{display:inline-block; margin-left:8px; font-size:var(--fs-cap); font-weight:500;
  color:var(--sand-dim); font-variant-numeric:normal; white-space:nowrap}
.cart-line .sum{font-size:var(--fs-md); color:var(--sand-dim); min-width:64px; text-align:right;
  font-variant-numeric:tabular-nums}
.stepper{display:flex; align-items:center; gap:2px; flex:none}
.stepper button{width:30px; height:30px; border-radius:var(--r-in); display:grid;
  place-items:center; font-size:var(--fs-base); line-height:var(--lh-tight); color:var(--sand);
  border:1px solid var(--seam); background:color-mix(in oklab, var(--stone) 80%, transparent);
  transition:scale var(--t-press) var(--ease-out)}
.stepper button:active{scale:.9}
.stepper .n{min-width:22px; text-align:center; font-size:var(--fs-base); font-weight:600;
  font-variant-numeric:tabular-nums}


.ore .take{display:block; margin-top:11px; width:100%; padding:9px; border-radius:var(--r-in); font-size:var(--fs-sm);
  font-weight:650; border:1px solid var(--seam); color:var(--sand);
  background:color-mix(in oklab, var(--stone) 70%, transparent);
    transition:background 180ms var(--ease-out)}
.ore.incart .take{border-color:transparent; color:var(--on-lamp);
  background:linear-gradient(140deg,var(--lamp-hi),var(--lamp))}
.ore.spent .take{opacity:.5}




.motes{position:fixed; inset:0; overflow:hidden; pointer-events:none; z-index:0}
.motes i{position:absolute; width:var(--s); height:var(--s); border-radius:50%;
  background:var(--lamp-hi); opacity:0; will-change:transform, opacity;
  box-shadow:0 0 calc(var(--s) * 2.2) color-mix(in oklab, var(--lamp-hi) 65%, transparent);
  animation:var(--path) var(--t) var(--ease, linear) var(--delay) infinite}


@keyframes drift-a{
  0%  {transform:translate3d(0,0,0) scale(.85);                    opacity:0}
  10% {opacity:var(--o)}
  35% {transform:translate3d(calc(var(--sway) * 1), -32vh, 0) scale(1)}
  70% {transform:translate3d(calc(var(--sway) * -.4), -68vh, 0) scale(.95)}
  90% {opacity:calc(var(--o) * .5)}
  100%{transform:translate3d(calc(var(--sway) * .6), -108vh, 0) scale(.8); opacity:0}
}

@keyframes drift-b{
  0%  {transform:translate3d(0,0,0) scale(.9);                     opacity:0}
  14% {opacity:var(--o)}
  40% {transform:translate3d(calc(var(--sway) * -1.2), -38vh, 0) scale(1.05)}
  62% {transform:translate3d(calc(var(--sway) * -.3), -58vh, 0) scale(.9)}
  86% {opacity:calc(var(--o) * .6)}
  100%{transform:translate3d(calc(var(--sway) * -1.6), -104vh, 0) scale(.85); opacity:0}
}

@keyframes drift-c{
  0%  {transform:translate3d(0,0,0);                               opacity:0}
  18% {opacity:var(--o)}
  30% {transform:translate3d(var(--sway), -18vh, 0)}
  55% {transform:translate3d(calc(var(--sway) * -1), -40vh, 0)}
  80% {transform:translate3d(var(--sway), -64vh, 0); opacity:calc(var(--o) * .7)}
  100%{transform:translate3d(0, -96vh, 0);                         opacity:0}
}
@media (prefers-reduced-motion:reduce){ .motes{display:none} }


.about-head{padding:20px 2px 12px}
.about-head h2{margin:0 0 4px; font-size:var(--fs-lg); letter-spacing:-.02em}
.about-head p{margin:0; color:var(--sand-dim); font-size:var(--fs-md)}

.steps{list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:9px}
.steps li{position:relative; padding:16px 15px; border-radius:var(--r-card);
  border:1px solid var(--seam); background:linear-gradient(168deg,var(--stone),var(--stone-deep));
  box-shadow:inset 0 1px 0 color-mix(in oklab, var(--lamp-hi) 8%, transparent)}
.step-n{display:grid; place-items:center; width:25px; height:25px; border-radius:50%;
  margin-bottom:6px; font-size:var(--fs-sm); font-weight:700; color:var(--lamp);
  border:1px solid var(--lamp-lo); background:color-mix(in oklab, var(--lamp) 7%, transparent)}
.steps b{display:block; font-size:var(--fs-base); font-weight:600; margin-bottom:10px}
.steps p{margin:0; font-size:var(--fs-md); color:var(--sand-dim); line-height:var(--lh-text)}

.asks{display:flex; flex-direction:column; gap:8px}
.asks details{border:1px solid var(--seam); border-radius:var(--r-card);
  background:color-mix(in oklab, var(--rock) 60%, transparent); overflow:hidden;
  transition:border-color 200ms var(--ease-out)}
.asks details[open]{border-color:var(--seam-2)}
.asks summary{display:flex; align-items:center; gap:11px; padding:14px 15px;
  font-size:var(--fs-base); font-weight:500; cursor:pointer; list-style:none;
  -webkit-tap-highlight-color:transparent; user-select:none}
.asks summary::-webkit-details-marker{display:none}
.asks summary::after{content:""; flex:none; margin-left:auto; width:8px; height:8px;
  border-right:1.6px solid var(--sand-dim); border-bottom:1.6px solid var(--sand-dim);
  border-radius:1px; rotate:45deg; translate:0 -2px;
  transition:rotate 220ms var(--ease-out), border-color 180ms var(--ease-out)}
.asks details[open] summary::after{rotate:225deg; translate:0 2px; border-color:var(--lamp)}
.asks p{margin:0; padding:0 15px 15px; font-size:var(--fs-md); color:var(--sand); line-height:var(--lh-text)}
.asks p b{color:var(--cream); font-weight:600}

.vows{display:flex; gap:9px; margin:16px 0 8px}
.vows div{flex:1; padding:13px 12px; border-radius:var(--r-card); border:1px solid var(--seam);
  background:color-mix(in oklab, var(--rock) 55%, transparent)}
.vows .ic{color:var(--lamp); width:17px; height:17px; margin-bottom:8px}
.vows b{display:block; font-size:var(--fs-md); font-weight:600}
.vows span{display:block; font-size:var(--fs-sm); color:var(--sand-dim)}



.who-chip{display:flex; align-items:center; gap:8px; width:100%;
  margin:0 0 12px; padding:10px 12px; border-radius:var(--r-card);
  border:1px solid color-mix(in oklab, var(--lamp) 26%, transparent);
  background:color-mix(in oklab, var(--lamp) 9%, rgba(0,0,0,.34));
  color:var(--cream); font:inherit; text-align:left; cursor:pointer;
  transition:background .2s var(--ease-out)}
.who-chip:active{background:color-mix(in oklab, var(--lamp) 15%, rgba(0,0,0,.34))}
.who-chip.hidden{display:none}
.who-chip > svg{width:15px; height:15px; flex:none; color:var(--lamp)}
.who-txt{flex:1; min-width:0; color:var(--sand-dim)}

.who-кому{display:block; font-size:var(--fs-md); font-weight:800; letter-spacing:.04em;
  text-transform:uppercase; color:var(--cream); line-height:1.25}
.who-кому span, .who-кому i{white-space:nowrap}
.who-кому i{font-style:normal; font-variant-numeric:tabular-nums}
.who-txt u{display:block; text-decoration:none; font-size:var(--fs-cap); opacity:.6;
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.who-edit{flex:none; font-size:var(--fs-sm); color:var(--lamp); opacity:.85}


.who-state{display:flex; align-items:center; gap:7px; margin-top:7px;
  font-size:var(--fs-sm); line-height:var(--lh-tight); animation:who-in .22s var(--ease-out)}
.who-state svg{width:13px; height:13px; flex:none}
.who-state b{font-weight:650}
.who-state.ok{color:var(--ore)}
.who-state.bad{color:var(--rust)}
.who-state.hmm,.who-state.wait{color:var(--sand-dim)}
.who-state .lamp-spin{width:12px; height:12px; flex:none}
@keyframes who-in{from{opacity:0; transform:translateY(-3px)} to{opacity:1; transform:none}}


.take.picked{display:flex; align-items:center; justify-content:space-between;
  gap:6px; padding-left:6px; padding-right:6px}
.take.picked i{flex:none; width:26px; height:26px; display:grid; place-items:center;
  border-radius:var(--r-in); font-style:normal; font-size:var(--fs-lg); line-height:var(--lh-tight);
  background:rgba(0,0,0,.28); transition:background .15s var(--ease-out)}
.take.picked i:active{background:rgba(0,0,0,.5)}
.take.picked b{font-variant-numeric:tabular-nums; font-weight:700}


.ord-list{display:grid; gap:8px; padding:0 2px 28px}
.ord{display:grid; grid-template-columns:auto 1fr auto; gap:2px 10px;
  align-items:center; width:100%; padding:12px 14px; border-radius:var(--r-card);
  border:1px solid var(--seam); background:var(--stone); color:var(--cream);
  font:inherit; text-align:left; cursor:pointer}
.ord:active{background:color-mix(in oklab, var(--lamp) 8%, var(--stone))}
.ord-n{font-size:var(--fs-sm); color:var(--sand-dim); font-variant-numeric:tabular-nums}
.ord-what{font-size:var(--fs-sm); color:var(--sand-dim); text-align:right;
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.ord-sum{grid-column:1; font-size:var(--fs-base); font-weight:700}
.ord-st{grid-column:3; justify-self:end; font-size:var(--fs-sm); padding:3px 9px;
  border-radius:var(--r-pill); background:rgba(255,255,255,.07); color:var(--sand-dim)}
.ord-st.s-done{background:color-mix(in oklab, var(--ore) 16%, transparent); color:var(--ore)}
.ord-st.s-failed,
  .ord-st.s-canceled{background:color-mix(in oklab, var(--rust) 16%, transparent);
  color:var(--rust)}
.empty{padding:22px 4px; color:var(--sand-dim); font-size:var(--fs-md); text-align:center}
.screen.пусто .about-head p{display:none}
.пусто-плита{display:grid; justify-items:center; gap:6px; margin-top:8px;
  padding:28px 20px 22px; border-radius:var(--r-card);
  border:1px solid var(--seam); text-align:center;
  background:linear-gradient(168deg,
    color-mix(in oklab, var(--stone) 84%, transparent) 0%,
    color-mix(in oklab, var(--stone-deep) 90%, transparent) 100%);
  box-shadow:inset 0 1px 0 color-mix(in oklab, var(--cream) 14%, transparent),
    var(--sh-card)}
.пусто-плита .ic{width:26px; height:26px; margin-bottom:4px; color:var(--lamp-lo)}
.пусто-плита b{font-size:var(--fs-lg); letter-spacing:-.01em}
.пусто-плита span{max-width:30ch; font-size:var(--fs-md); line-height:var(--lh-text); color:var(--sand-dim)}
.пусто-плита .act{width:auto; margin-top:14px; padding:12px 22px}
.menu-tag{margin-left:auto; min-width:20px; padding:1px 7px; border-radius:var(--r-pill);
  font-size:var(--fs-sm); background:color-mix(in oklab, var(--lamp) 22%, transparent);
  color:var(--lamp)}
.menu-tag.hidden{display:none}



.grid{grid-template-columns:repeat(3, 1fr); gap:7px}
.ore{padding:9px 8px 8px; border-radius:var(--r-card); overflow:hidden}
.ore .qty{display:flex; align-items:center; gap:5px; letter-spacing:-.02em}
.ore .qty b{font-size:var(--fs-base); font-weight:700}
.ore .uc{width:17px; height:17px; flex:none}
.ore .cost{margin-top:3px; font-size:var(--fs-sm); font-weight:600; color:var(--sand)}

.ore .take{margin-top:8px; height:30px; display:grid; place-items:center;
  padding:0 4px; font-size:var(--fs-sm); border-radius:var(--r-in)}
.take.picked{display:flex; padding-left:2px; padding-right:2px}
.take.picked i{width:22px; height:22px; border-radius:var(--r-in); font-size:var(--fs-base)}

.ore .mark,.ore .gone{position:absolute; top:0; right:0; padding:2.5px 5px;
  border-radius:0 var(--r-card) 0 var(--r-in); font-size:var(--fs-cap); font-weight:800; letter-spacing:.08em;
  line-height:var(--lh-tight); white-space:nowrap}
.ore .tagline{display:none}

@media (min-width: 620px){
  
  html:not([data-телефон]) .grid{grid-template-columns:repeat(4, 1fr); gap:9px}
  html:not([data-телефон]) .ore{padding:11px 10px 10px}
  html:not([data-телефон]) .ore .qty b{font-size:var(--fs-base)}
  html:not([data-телефон]) .ore .uc{width:19px; height:19px}
  
  html:not([data-телефон]) .ore .pile.one .uc{width:100%; height:100%}
  html:not([data-телефон]) .ore .cost{font-size:var(--fs-md)}
}



.tabs{display:flex; gap:6px; margin:14px 0 2px; overflow-x:auto;
  scrollbar-width:none; -webkit-overflow-scrolling:touch}
.tabs::-webkit-scrollbar{display:none}
.tabs.hidden{display:none}
.tab{flex:none; padding:8px 14px; border-radius:var(--r-pill); font-size:var(--fs-md); font-weight:600;
  color:var(--sand); border:1px solid var(--seam); background:rgba(0,0,0,.25);
  transition:color 180ms var(--ease-out), border-color 180ms var(--ease-out),
             background 180ms var(--ease-out)}
.tab.on{color:var(--on-lamp); border-color:transparent;
  background:var(--metal)}
.tab:not(.on):active{background:color-mix(in oklab, var(--lamp) 10%, transparent)}


.ore.item{padding:0 0 8px}
.ore.item .pic{display:block; aspect-ratio:1/1; overflow:hidden; border-radius:var(--r-card) var(--r-card) 0 0;
  background:radial-gradient(120% 90% at 50% 15%,
    color-mix(in oklab, var(--lamp) 14%, transparent), rgba(0,0,0,.35))}
.ore.item .pic img{width:100%; height:100%; object-fit:cover; display:block}
.ore.item .name{display:block; margin:7px 8px 0; font-size:var(--fs-sm); font-weight:650;
  line-height:var(--lh-tight); overflow:hidden; display:-webkit-box; -webkit-line-clamp:2;
  -webkit-box-orient:vertical}
.ore.item .cost{margin:3px 8px 0}
.ore.item .take{margin:7px 8px 0}

.heat{display:flex; gap:2px; margin:5px 8px 0; align-items:center}
.heat i,.heat u{display:block; width:9px; height:3px; border-radius:2px}
.heat i{background:var(--lamp)}
.heat u{background:var(--seam-2)}




.bar{position:sticky; top:0; z-index:20; display:flex; align-items:center;
  justify-content:space-between; gap:8px;
  margin:0 -16px; padding:9px 16px 10px;
  background:linear-gradient(180deg, var(--deep) 74%, transparent)}
.pill{display:inline-flex; align-items:center; gap:6px; padding:8px 12px;
  border-radius:var(--r-pill); font-size:var(--fs-sm); font-weight:650; white-space:nowrap;
  color:var(--on-lamp); border:1px solid transparent;
  background:var(--metal);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.45),
    0 4px 12px -6px color-mix(in oklab, var(--lamp) 80%, transparent);
  transition:scale var(--t-press) var(--ease-out)}
.pill:active{scale:.95}
.pill .ic{width:14px; height:14px}
.pill.ghost{color:var(--sand); background:rgba(0,0,0,.3); border-color:var(--seam);
  box-shadow:none}

.logo{display:flex; align-items:center; gap:6px; color:var(--sand);
  font-size:var(--fs-cap); font-weight:800; letter-spacing:.16em;
  min-width:0; overflow:hidden}

.logo svg{width:20px; height:20px; flex:none; color:var(--lamp)}

.logo b{min-width:0; overflow:hidden; text-overflow:ellipsis}




.line1{display:block; text-align:center; letter-spacing:-.01em}
.line1 b{display:block; font-size:var(--fs-sm); font-weight:700; white-space:nowrap;
  color:var(--cream)}
.line1 span{display:block; margin-top:1px; font-size:var(--fs-cap); font-weight:700;
  white-space:nowrap; color:var(--lamp)}




.crown{position:relative; margin:0 -16px; z-index:1; height:196px; overflow:hidden}

.stage{position:absolute; left:50%; bottom:0; translate:-50% 0;
  height:100%; aspect-ratio:2000/640}
.stage img{position:absolute; inset:0; width:100%; height:100%; display:block}

.stage .bed{z-index:1}
.stage .fan{z-index:2}
.stage .guz{z-index:3}

.stage .blow{z-index:2; mix-blend-mode:screen; opacity:0; will-change:opacity;
  -webkit-mask-image:radial-gradient(40% 125% at 72% 100%, #000 4%, transparent 68%);
  mask-image:radial-gradient(40% 125% at 72% 100%, #000 4%, transparent 68%);
  animation:blow 4.2s linear infinite}
.stage .pile{z-index:4}
.stage .guz:last-of-type{z-index:5}
.stage .zzz{z-index:6}


.guz{position:absolute; inset:0; transform-origin:50% 100%; will-change:transform;
  animation:breathe 4.2s linear infinite,
            twitch 11.7s var(--ease-out) infinite}


.stage .tongue{transform-origin:63.7% 60.3%; will-change:transform;
  animation:loll 8.4s linear infinite}


.fan{position:absolute; left:0; right:0; bottom:0; height:74%; pointer-events:none;
  mix-blend-mode:screen;
  background:
    radial-gradient(13% 52% at 69% 100%,
      color-mix(in oklab, var(--lamp-hi) 82%, transparent), transparent 66%),
    radial-gradient(26% 92% at 70% 100%,
      color-mix(in oklab, var(--lamp) 78%, transparent), transparent 70%),
    radial-gradient(54% 140% at 74% 100%,
      color-mix(in oklab, var(--rust) 80%, transparent), transparent 76%);
  animation:fan 4.2s linear infinite}




.zzz{position:absolute; left:66%; top:32%; pointer-events:none}
.zzz i{position:absolute; font-style:normal; font-weight:800; line-height:1;
  color:var(--lamp-hi); opacity:0; text-shadow:0 2px 10px rgba(0,0,0,.85);
  animation:zzz 4.2s var(--ease-out) infinite}
.zzz i:nth-child(1){font-size:var(--fs-sm); animation-delay:.1s}
.zzz i:nth-child(2){font-size:var(--fs-base); animation-delay:1.4s}
.zzz i:nth-child(3){font-size:var(--fs-lg); animation-delay:2.8s}
@keyframes zzz{
  0%  {opacity:0;   translate:0 0;       rotate:-10deg; scale:.7}
  18% {opacity:.9;                       scale:1}
  70% {opacity:.42}
  100%{opacity:0;   translate:26px -44px; rotate:14deg;  scale:1.1}
}


@keyframes twitch{
  0%,86%,100%{rotate:0deg}
  89%{rotate:.65deg}
  92%{rotate:-.5deg}
  96%{rotate:.2deg}
}


.puff{position:absolute; left:59%; top:50%; width:12%; height:9%; z-index:5;
  pointer-events:none; border-radius:50%; opacity:0;
  background:radial-gradient(closest-side,
    color-mix(in oklab, var(--lamp-top) 26%, transparent), transparent 74%);
  filter:blur(5px); animation:puff 8.4s var(--ease-out) infinite}
@keyframes puff{
  0%,22%{opacity:0;  translate:0 0;    scale:.5 .5}
  31%   {opacity:.45; scale:1 1}
  45%   {opacity:0;  translate:14px 5px; scale:1.5 1.3}
  46%,68%{opacity:0; translate:0 0;    scale:.5 .5}
  77%   {opacity:.7;  scale:1.2 1.1}
  93%   {opacity:0;  translate:20px 7px; scale:1.9 1.5}
  100%  {opacity:0}
}


.sparks{position:absolute; inset:0; z-index:4; pointer-events:none}
.sparks i{position:absolute; bottom:16%; width:3px; height:3px; border-radius:50%;
  background:var(--lamp-hi);
    box-shadow:0 0 7px color-mix(in oklab, var(--lamp-hi) 85%, transparent); opacity:0;
  animation:spark 5.4s linear infinite}
.sparks i:nth-child(1){left:24%; animation-delay:0s}
.sparks i:nth-child(2){left:41%; animation-delay:1.7s; animation-duration:6.6s}
.sparks i:nth-child(3){left:57%; animation-delay:3.1s; animation-duration:4.8s}
.sparks i:nth-child(4){left:72%; animation-delay:.9s;  animation-duration:6.1s}
.sparks i:nth-child(5){left:86%; animation-delay:4.2s; animation-duration:5.7s}
@keyframes spark{
  0%  {opacity:0;  translate:0 0;        scale:.6}
  12% {opacity:.9}
  70% {opacity:.35}
  100%{opacity:0;  translate:13px -70px; scale:.25}
}




.stage .pile{transform-origin:51.5% 100%;
  scale:calc(1 + var(--klad, 0) * .16);
  transition:scale 900ms var(--ease-out)}

.zhar{position:absolute; left:30%; top:62%; width:44%; height:38%; z-index:4;
  pointer-events:none; mix-blend-mode:screen; border-radius:50%;
  opacity:calc(var(--klad, 0) * .6);
  background:radial-gradient(closest-side,
    color-mix(in oklab, var(--lamp-hi) 90%, transparent), transparent 70%);
  transition:opacity 900ms var(--ease-out)}


.stage.hap .pile{animation:hap 640ms var(--ease-out)}
@keyframes hap{
  0%  {translate:0 0}
  22% {translate:0 -7px}
  48% {translate:0 2px}
  74% {translate:0 -2px}
  100%{translate:0 0}
}
.blesk{position:absolute; left:46%; top:44%; width:40%; height:46%; z-index:5;
  pointer-events:none; opacity:0; border-radius:50%;
  background:radial-gradient(closest-side,
    color-mix(in oklab, var(--cream) 55%, transparent), transparent 72%)}
.stage.hap .blesk{animation:blesk 640ms var(--ease-out)}
@keyframes blesk{
  0%  {opacity:0; scale:.35}
  26% {opacity:1; scale:1}
  100%{opacity:0; scale:1.55}
}


.stage.wake .zzz{opacity:0; transition:opacity 240ms}
.stage.wake .body{animation:ochnulsya 920ms var(--ease-out)}
@keyframes ochnulsya{
  0%  {translate:0 0;    rotate:0deg}
  18% {translate:0 -7px; rotate:-1.2deg}
  42% {translate:1px -2px; rotate:.8deg}
  66% {translate:0 -3px; rotate:-.4deg}
  100%{translate:0 0;    rotate:0deg}
}
.stage.wake .sparks i{animation-duration:2.4s}
.stage.wake .puff{animation-duration:4.2s}



.kormlenie{position:fixed; z-index:66; width:26px; height:26px;
  margin:-13px 0 0 -13px; pointer-events:none;
  background:var(--cur, url("img/coin.webp?v=7ce42990")) center / contain no-repeat;
  animation:letit var(--dur) var(--del, 0ms) both,
            vertet var(--spin) linear var(--del, 0ms) infinite}
@keyframes letit{
  0%  {translate:0 0; scale:.55; opacity:0;
       animation-timing-function:cubic-bezier(.3,.58,.5,1)}
  9%  {opacity:1; scale:1}
  52% {translate:calc(var(--dx) * .5) var(--apex);
       animation-timing-function:cubic-bezier(.5,0,.82,.58)}
  90% {opacity:1}
  100%{translate:var(--dx) var(--dy); scale:.5; opacity:0}
}

@media (prefers-reduced-motion: reduce){
  .guz, .stage .tongue, .fan, .stage .blow, .zzz i, .puff, .sparks i{animation:none !important}
  .zzz, .puff, .sparks{display:none}
  .stage.hap .pile,.stage.wake .body,.stage.hap .blesk{animation:none}
  .stage .pile{transition:none}
}
@media (min-width:620px){ html:not([data-телефон]) .crown{height:260px} }
.crown::after{content:""; position:absolute; left:0; right:0; bottom:-46px; height:92px;
  background:radial-gradient(58% 100% at 50% 0,
    color-mix(in oklab, var(--rust) 26%, transparent), transparent 72%);
  pointer-events:none}
@media (prefers-reduced-motion: no-preference){
  .crown img{animation:crown-in 620ms var(--ease-out) both}
}
@keyframes crown-in{from{opacity:0; translate:0 10px} to{opacity:1; translate:0 0}}

.line.cut dt{color:var(--lamp)}
.line.cut dd{color:var(--lamp); font-weight:700}


.line.cut.личная,.screen[data-screen="order"] .line.cut.личная{margin:6px 0;padding:8px 12px;border:1px solid var(--zhar);border-radius:var(--r);background:color-mix(in srgb,var(--zhar) 12%,transparent)}
.line.cut.личная dt,.line.cut.личная dd,.screen[data-screen="order"] .line.cut.личная dt,.screen[data-screen="order"] .line.cut.личная dd{color:var(--zhar);font-weight:700}
.line.cut.личная dt::before{content:"★ "}

.bindbox{margin-top:12px; padding:16px 16px 15px; border-radius:var(--r-card);
  background:linear-gradient(180deg,
    color-mix(in oklab, var(--stone-deep) 92%, transparent),
    color-mix(in oklab, var(--deep) 95%, transparent));
  border:1px solid color-mix(in oklab, var(--lamp-hi) 20%, transparent)}
.bindbox h2{margin:0 0 5px; font-size:var(--fs-base); letter-spacing:-.01em}
.bindbox p{margin:0 0 12px; font-size:var(--fs-sm); line-height:var(--lh-text); color:var(--sand-dim);
  text-wrap:pretty}
.bindbox .who-state{margin-top:9px}

.bindbox > .act.mini{width:100%; margin-top:11px}
.act.mini.ghost{color:var(--sand); background:color-mix(in oklab, var(--cream) 8%, transparent);
  border:1px solid color-mix(in oklab, var(--lamp-hi) 18%, transparent); box-shadow:none}
.act.mini[disabled]{opacity:.55}


.bind{display:flex; align-items:center; gap:12px; margin-top:12px;
  padding:14px 15px; border-radius:var(--r-card);
  background:color-mix(in oklab, var(--cream) 6%, transparent);
    border:1px solid color-mix(in oklab, var(--lamp-hi) 16%, transparent)}
.bind div{flex:1}
.bind b{display:block; font-size:var(--fs-md)}
.bind span{display:block; margin-top:3px; font-size:var(--fs-sm); line-height:var(--lh-text);
  color:var(--sand-dim)}
.bind .ic{width:20px; height:20px; color:var(--ore); flex:none}
.bind.done{border-color:color-mix(in oklab, var(--ore) 34%, transparent);
  background:color-mix(in oklab, var(--ore) 9%, transparent)}
.act.mini{width:auto; margin:0; flex:none; padding:10px 14px; font-size:var(--fs-sm)}


.vip-now{display:grid; justify-items:center; gap:6px; text-align:center;
  margin-top:6px; padding:26px 18px 22px; border-radius:var(--r-card);
  background:linear-gradient(168deg, color-mix(in oklab, var(--lamp) 16%, transparent),
    color-mix(in oklab, var(--stone-deep) 94%, transparent));
  border:1px solid color-mix(in oklab, var(--lamp-hi) 28%, transparent);
  box-shadow:inset 0 1px 0 color-mix(in oklab, var(--cream) 24%, transparent),
    var(--sh-lift)}
.vip-now .ic{width:34px; height:34px; color:var(--lamp);
  filter:drop-shadow(0 3px 7px rgba(0,0,0,.5))}
.vip-now b{font-size:var(--fs-xl); letter-spacing:-.02em}
.vip-now > span{font-size:var(--fs-sm); color:var(--sand-dim)}
.vip-now em{margin-top:2px; padding:5px 12px; border-radius:var(--r-pill); font-style:normal;
  font-size:var(--fs-sm); font-weight:700; color:var(--on-lamp);
  background:var(--metal)}
.vip-bar{width:100%; max-width:260px; height:6px; margin-top:12px; border-radius:var(--r-pill);
  background:rgba(0,0,0,.45); overflow:hidden}
.vip-bar i{display:block; height:100%; border-radius:var(--r-pill);
  background:linear-gradient(90deg, var(--lamp-lo), var(--lamp-hi));
  transition:width 800ms var(--ease-out)}
.vip-left{font-size:var(--fs-sm); color:var(--sand); text-wrap:balance}

.ord-вход{display:block; width:100%; margin-top:12px; padding:12px 14px; border-radius:var(--r-in);
  border:1px dashed var(--seam-2); background:transparent; color:var(--sand); font-size:var(--fs-sm);
  font-weight:650; text-align:center; cursor:pointer}

.выйти-кн{padding:7px 12px; border:1px solid var(--seam-2); border-radius:var(--r-pill);
  background:transparent; color:var(--sand-dim); font-size:var(--fs-sm); font-weight:650; cursor:pointer}
.ямоя-строка .выйти-кн{margin-left:auto}
.ord-list > .выйти-кн,
#vipBox > .выйти-кн{display:block; margin:12px 0 12px auto}

.меню-устарело{font-size:var(--fs-sm); color:var(--sand-dim); text-wrap:balance}
.меню-устарело a{color:var(--sand); text-decoration:underline; text-underline-offset:2px}

.вход{position:fixed; inset:0; z-index:130; display:grid; place-items:end center;
  padding:12px 12px calc(12px + env(safe-area-inset-bottom)); background:rgba(0,0,0,.62)}
.вход[hidden]{display:none}
.вход-лист{position:relative; width:min(440px, 100%); display:grid; justify-items:center; gap:10px;
  padding:26px 20px 20px; border-radius:var(--r-card); text-align:center;
  background:var(--stone); border:1px solid var(--seam)}
.вход-закрыть{position:absolute; top:8px; right:8px; width:36px; height:36px; border:0; border-radius:50%;
  background:transparent; color:var(--sand-dim); font-size:26px; line-height:1; cursor:pointer}
.вход-знак{width:46px; height:46px; color:var(--lamp)}
.вход-что{font-size:var(--fs-lg); font-weight:800; color:var(--cream); text-wrap:balance}
.вход-зачем{margin:0; font-size:var(--fs-md); line-height:var(--lh-text); color:var(--sand); text-wrap:balance}
.вход-да{display:block; width:100%; margin-top:6px; padding:14px; border-radius:var(--r-in);
  font-weight:800; text-decoration:none; color:var(--on-lamp); background:var(--lamp); cursor:pointer}
.вход-да.ждёт{opacity:.5; pointer-events:none}
.вход-ждём{font-size:var(--fs-sm); color:var(--sand-dim); text-wrap:balance}

.вход-код{display:grid; justify-items:center; gap:2px; margin-top:2px}
.вход-код[hidden]{display:none}
.вход-код span{font-size:var(--fs-sm); color:var(--sand)}
.вход-код b{font-size:44px; line-height:1.05; font-weight:800; letter-spacing:.08em;
  font-variant-numeric:tabular-nums; color:var(--cream)}
@media (min-width:744px){
  html:not([data-телефон]) .вход,
  html[data-телефон] .вход{place-items:center}
}

.vip-путь{position:relative; width:100%; max-width:520px; margin:14px 0 2px; padding:0 16px 28px;
  box-sizing:border-box}
.vip-путь-полоса{position:relative; height:8px; border-radius:var(--r-pill); background:rgba(0,0,0,.45);
  box-shadow:inset 0 0 0 1px color-mix(in oklab, var(--cream) 8%, transparent)}
.vip-путь-свет{position:absolute; inset:0; overflow:hidden; border-radius:inherit; transform-origin:0 50%;
  transform:scaleX(var(--доля)); background:linear-gradient(90deg, var(--lamp-lo), var(--lamp-hi));
  animation:путь-свет 900ms var(--ease-out) 120ms both}
.vip-путь-свет::after{content:""; position:absolute; top:0; bottom:0; left:0; width:30%;
  background:linear-gradient(90deg, transparent, rgba(255,255,255,.5), transparent);
  transform:translateX(-100%); animation:путь-блик 5.5s linear 1.4s infinite}
.vip-путь-ход{position:absolute; inset:0; pointer-events:none;
  transform:translateX(calc(var(--доля) * 100%)); animation:путь-ход 900ms var(--ease-out) 120ms both}
.vip-путь-ход::after{content:""; position:absolute; left:0; top:50%; width:16px; height:16px; margin:-8px 0 0 -8px;
  border-radius:50%; background:radial-gradient(circle, #fff 0 18%, var(--lamp-hi) 42%, transparent 70%)}
.vip-путь.пусто .vip-путь-свет,
.vip-путь.пусто .vip-путь-ход{display:none}
.vip-путь-ступени{position:absolute; left:16px; right:16px; top:0; height:8px; margin:0; padding:0; list-style:none}
.vip-путь-ступени li{position:absolute; left:calc(var(--x) * 100%); top:0; display:grid; justify-items:center;
  gap:6px; translate:-50% -5px; white-space:nowrap}
.vip-путь-ступени b{width:18px; height:18px; border-radius:50%; background:var(--stone-deep);
  box-shadow:inset 0 0 0 2px var(--seam-2)}
.vip-путь-ступени .пройдена b,
.vip-путь-ступени .здесь b{background:var(--lamp); box-shadow:inset 0 0 0 2px var(--lamp-hi)}
.vip-путь-ступени .здесь b{box-shadow:0 0 0 4px color-mix(in oklab, var(--lamp) 26%, transparent), inset 0 0 0 2px var(--lamp-hi)}
.vip-путь-ступени u{text-decoration:none; font-size:var(--fs-cap); font-weight:700; color:var(--sand-dim)}
.vip-путь-ступени .пройдена u{color:var(--sand)}
.vip-путь-ступени .здесь u{color:var(--lamp)}
.vip-путь-ступени span{display:none; margin-top:-3px; font-size:10px; color:var(--sand-dim)}
@media (min-width:744px){
  html:not([data-телефон]) .vip-путь{padding-bottom:42px}
  html:not([data-телефон]) .vip-путь-ступени span{display:block}
}
@keyframes путь-свет{from{transform:scaleX(0)}}
@keyframes путь-ход{from{transform:translateX(0)}}
@keyframes путь-блик{0%{transform:translateX(-100%)} 40%,100%{transform:translateX(340%)}}
@media (prefers-reduced-motion:reduce){
  .vip-путь-свет,.vip-путь-ход,.vip-путь-свет::after{animation:none}
}
.vip-now.empty-id{background:linear-gradient(168deg,
  color-mix(in oklab, var(--cream) 7%, transparent),
  color-mix(in oklab, var(--stone-deep) 94%, transparent));
  border-color:color-mix(in oklab, var(--lamp-hi) 16%, transparent)}


.vip-sheet{margin:18px 0 26px; padding:18px 16px 20px; border-radius:var(--r-card);
  background:linear-gradient(180deg,
    color-mix(in oklab, var(--stone-deep) 93%, transparent),
    color-mix(in oklab, var(--deep) 96%, transparent));
  border:1px solid var(--seam)}
.vip-h{margin:2px 0 8px; font-size:var(--fs-lg); letter-spacing:-.01em}
.vip-p{margin:0 0 12px; font-size:var(--fs-md); line-height:var(--lh-text); color:var(--sand);
  text-wrap:pretty}
.vip-p.small{font-size:var(--fs-sm); color:var(--sand-dim); margin-top:14px}
.vip-p b{color:var(--cream)}

.vip-table{display:grid; gap:7px; margin:14px 0 4px}
.vip-row{display:grid; grid-template-columns:auto auto 1fr; gap:2px 10px;
  padding:13px 14px; border-radius:var(--r-card);
  background:color-mix(in oklab, var(--cream) 5%, transparent);
    border:1px solid color-mix(in oklab, var(--lamp-hi) 12%, transparent)}
.vip-row b{font-size:var(--fs-base)}
.vip-row u{justify-self:start; text-decoration:none; font-size:var(--fs-sm); color:var(--sand-dim)}
.vip-row span{grid-column:3; grid-row:1; justify-self:end; font-size:var(--fs-base);
  font-weight:700; color:var(--lamp)}
.vip-row em{grid-column:1 / -1; font-style:normal; font-size:var(--fs-sm); line-height:var(--lh-text);
  color:var(--sand-dim); margin-top:4px}

.vip-row.on{border-color:color-mix(in oklab, var(--lamp-hi) 40%, transparent);
  background:color-mix(in oklab, var(--lamp) 12%, transparent);
  box-shadow:inset 0 1px 0 color-mix(in oklab, var(--cream) 20%, transparent)}

.vip-row.on b::after{content:"вы здесь"; display:block; margin-top:1px;
  font-weight:500; font-size:var(--fs-sm); color:var(--sand-dim)}


.fine{display:flex; flex-direction:column; gap:6px; align-items:center;
  margin:26px 0 10px; padding-bottom:8px}
.fine button{font-size:var(--fs-cap); color:var(--sand-dim); opacity:.5;
  text-decoration:underline; text-underline-offset:3px;
  text-decoration-color:color-mix(in oklab, var(--sand-dim) 40%, transparent);
  transition:opacity 180ms var(--ease-out)}
.fine button:active{opacity:.85}


.legal-body{padding:18px 16px 26px; margin-bottom:26px; border-radius:var(--r-card);
  font-size:var(--fs-base); line-height:var(--lh-text); color:var(--sand);
  background:linear-gradient(180deg,
    color-mix(in oklab, var(--stone-deep) 93%, transparent),
    color-mix(in oklab, var(--deep) 96%, transparent));
  border:1px solid var(--seam)}
.legal-body h1{margin:10px 0 6px; font-size:var(--fs-xl); line-height:var(--lh-tight);
  letter-spacing:-.02em; color:var(--cream)}
.legal-body h2{margin:26px 0 8px; font-size:var(--fs-lg); letter-spacing:-.01em; color:var(--cream)}
.legal-body h3{margin:18px 0 6px; font-size:var(--fs-base); color:var(--cream)}
.legal-body p{margin:0 0 11px; text-wrap:pretty}
.legal-body ul,.legal-body ol{margin:0 0 12px; padding-left:20px}
.legal-body li{margin-bottom:6px}
.legal-body .legal-note{font-size:var(--fs-sm); color:var(--sand-dim);
  border-left:2px solid var(--seam-2); padding-left:11px; margin:14px 0}



.digger{display:grid; justify-items:center; gap:5px; margin-top:6px;
  padding:24px 16px 20px; border-radius:var(--r-card); text-align:center;
  background:linear-gradient(180deg, color-mix(in oklab, var(--stone) 93%, transparent),
    color-mix(in oklab, var(--deep) 96%, transparent));
  border:1px solid color-mix(in oklab, var(--lamp-hi) 18%, transparent);
  box-shadow:inset 0 1px 0 color-mix(in oklab, var(--cream) 14%, transparent),
    0 16px 34px -20px #000}
.digger.hidden{display:none}
.digger b{font-size:var(--fs-base); letter-spacing:-.01em}
.digger > span{max-width:280px; font-size:var(--fs-sm); line-height:var(--lh-text);
  color:var(--sand); text-wrap:balance}

.digger-face{position:relative; width:146px; height:82px; margin-bottom:4px}


.pick{position:absolute; left:6px; top:9px;
  width:66px; height:58px; transform-origin:36% 98%;
  background:url("img/pickaxe.webp?v=7ce4361e") center / contain no-repeat;
  filter:drop-shadow(0 3px 6px rgba(0,0,0,.5));
  animation:swing 1.15s var(--ease-in-out) infinite}
.pick > *{display:none}
@keyframes swing{
  0%  {rotate:-48deg}
  34% {rotate:12deg}
  40% {rotate:16deg}
  48% {rotate:6deg}
  100%{rotate:-48deg}
}


.chips{position:absolute; left:75px; bottom:37px; width:0; height:0}
.chips i{position:absolute; width:4px; height:4px; border-radius:1px;
  background:var(--lamp-hi);
    box-shadow:0 0 6px color-mix(in oklab, var(--lamp-hi) 80%, transparent); opacity:0;
  animation:chip 1.15s var(--ease-out) infinite}
.chips i:nth-child(1){--dx:-24px; --dy:-28px}
.chips i:nth-child(2){--dx:-13px; --dy:-34px; animation-delay:.03s}
.chips i:nth-child(3){--dx:4px;   --dy:-31px; animation-delay:.06s}
.chips i:nth-child(4){--dx:-30px; --dy:-14px; animation-delay:.02s}
.chips i:nth-child(5){--dx:14px;  --dy:-20px; animation-delay:.05s}
@keyframes chip{
  0%,34%{opacity:0; translate:0 0; scale:.5}
  40%   {opacity:1; scale:1}
  72%   {opacity:.45}
  100%  {opacity:0; translate:var(--dx) var(--dy); scale:.25}
}

.rock{position:absolute; right:6px; bottom:2px; width:74px; height:44px;
  background:url("img/rock.webp?v=7ce42344") center / contain no-repeat;
  filter:drop-shadow(0 4px 6px rgba(0,0,0,.6));
  animation:rock-hit 1.15s var(--ease-out) infinite}
@keyframes rock-hit{
  0%,33%{translate:0 0; scale:1}
  36%   {translate:1px 2px; scale:1.035 .955}
  45%   {translate:0 0; scale:1}
  100%  {translate:0 0; scale:1}
}



.rock-l,.rock-r{position:absolute; right:6px; bottom:2px; width:74px; height:44px;
  background-position:center; background-size:contain; background-repeat:no-repeat;
  opacity:0}
.rock-l{background-image:url("img/rock-l.webp?v=7ce4171e")}
.rock-r{background-image:url("img/rock-r.webp?v=7ce4241e")}

.digger.crack .rock{opacity:0}
.digger.crack .rock-l{opacity:1; animation:skol-l 820ms var(--ease-out) both}
.digger.crack .rock-r{opacity:1; animation:skol-r 820ms var(--ease-out) both}

@keyframes skol-l{
  0%  {translate:0 0; rotate:0deg; opacity:1}
  14% {translate:2px -1px; rotate:3deg}
  100%{translate:-44px 30px; rotate:-34deg; opacity:0}
}
@keyframes skol-r{
  0%  {translate:0 0; rotate:0deg; opacity:1}
  14% {translate:-2px -1px; rotate:-3deg}
  100%{translate:46px 26px; rotate:40deg; opacity:0}
}
.digger.crack .pick{animation:otdacha 520ms var(--ease-out) both}
@keyframes otdacha{
  0%  {rotate:16deg}
  30% {rotate:-8deg}
  100%{rotate:-30deg}
}
.digger.crack .digger-face{animation:tolchok 360ms var(--ease-out) both}
@keyframes tolchok{
  0%{translate:0 0}      12%{translate:2px -3px}  26%{translate:-3px 2px}
  46%{translate:2px 1px} 66%{translate:-1px -1px} 100%{translate:0 0}
}



.proboy{position:fixed; inset:0; z-index:64; pointer-events:none;
  contain:layout paint style; perspective:620px}

.proboy .zarevo{position:absolute; left:var(--ox); top:var(--oy);
  width:300px; height:300px; margin:-150px 0 0 -150px; border-radius:50%;
  background:radial-gradient(circle, color-mix(in oklab, var(--cream) 95%, transparent),
    color-mix(in oklab, var(--lamp) 52%, transparent) 32%,
    color-mix(in oklab, var(--lamp-lo) 17%, transparent) 56%, transparent 72%);
  animation:zarevo 1150ms var(--ease-out) both}
@keyframes zarevo{
  0%  {scale:.12; opacity:0}
  10% {scale:.72; opacity:1}
  34% {scale:1.55; opacity:.6}
  100%{scale:2.7; opacity:0}
}


.proboy .zerno,.proboy .oskol{position:absolute; left:var(--ox); top:var(--oy);
  background-position:center; background-size:contain; background-repeat:no-repeat;
  animation:vylet var(--dur) var(--del) both,
            vertet var(--spin) linear var(--del) infinite}
.proboy .zerno{width:26px; height:26px; margin:-13px 0 0 -13px;
  background-image:url("img/coin.webp?v=7ce42990")}
.proboy .oskol{width:18px; height:12px; margin:-6px 0 0 -9px;
  background-image:url("img/rock-r.webp?v=7ce4241e"); animation-name:vylet, kuvyrk}
@keyframes vylet{
  0%  {translate:0 0; scale:.3; opacity:0;
       animation-timing-function:cubic-bezier(.12,.72,.34,1)}
  7%  {opacity:1}
  46% {translate:calc(var(--dx) * .58) var(--apex); scale:var(--sc);
       animation-timing-function:cubic-bezier(.55,.05,.85,.5)}
  86% {opacity:1}
  100%{translate:var(--dx) var(--dy); scale:calc(var(--sc) * .8); opacity:0}
}
@keyframes vertet{to{rotate:y 1turn}}
@keyframes kuvyrk{to{rotate:1turn}}


.plita{position:relative; overflow:hidden; margin-top:12px; padding:20px 16px 16px;
  border-radius:var(--r-card); text-align:center;
  background:linear-gradient(168deg, color-mix(in oklab, var(--on-lamp) 96%, transparent),
    color-mix(in oklab, var(--rock) 98%, transparent));
  border:1px solid color-mix(in oklab, var(--lamp-hi) 34%, transparent);
  box-shadow:inset 0 1px 0 color-mix(in oklab, var(--cream) 18%, transparent),
    0 20px 40px -26px #000;
  animation:plita-vverh 600ms 300ms var(--ease-out) both}
@keyframes plita-vverh{
  0%  {translate:0 28px; scale:.94; opacity:0}
  100%{translate:0 0; scale:1; opacity:1}
}

.plita::after{content:""; position:absolute; inset:0 auto 0 -55%; width:42%;
  background:linear-gradient(100deg, transparent,
    color-mix(in oklab, var(--cream) 20%, transparent), transparent);
  animation:blik 1400ms 820ms var(--ease-out) both}

@keyframes blik{to{translate:400% 0}}
.plita-top{display:block; font-size:var(--fs-sm); font-weight:700; letter-spacing:.18em;
  text-transform:uppercase; color:var(--lamp)}
.plita-uc{display:block; margin:6px 0 2px; font-size:var(--fs-xxl); line-height:var(--lh-tight);
  font-weight:800; letter-spacing:-.03em; font-variant-numeric:tabular-nums;
  background:linear-gradient(150deg,var(--lamp-top),var(--lamp) 62%,var(--lamp-lo));
  -webkit-background-clip:text; background-clip:text; color:transparent}
.plita-uc i{font-style:normal; font-size:var(--fs-lg); letter-spacing:0}
.plita-id{display:block; font-size:var(--fs-sm); color:var(--sand-dim)}
.plita code{display:block; margin:14px 0 0; padding:12px 10px; border-radius:var(--r-card);
  font-family:ui-monospace, SFMono-Regular, monospace; font-size:var(--fs-base);
  letter-spacing:.06em; word-break:break-all; color:var(--cream);
  background:rgba(0,0,0,.42); border:1px solid var(--seam-2)}
.plita-copy{width:100%; margin-top:10px; padding:13px; border:0; border-radius:var(--r-in);
  font:inherit; font-size:var(--fs-base); font-weight:700; color:var(--on-lamp); cursor:pointer;
  background:var(--metal);
  transition:scale var(--t-press) var(--ease-out)}
.plita-copy:active{scale:.98}
.plita-copy.ok{background:linear-gradient(140deg,var(--ore-hi),var(--ore))}



.вопрос{position:fixed; inset:0; z-index:80; display:flex; align-items:center;
  justify-content:center; padding:22px 16px; overflow-y:auto;
  
  background:var(--deep); -webkit-overflow-scrolling:touch;
  animation:вопрос-войти 220ms var(--ease-out) both}
@keyframes вопрос-войти{from{opacity:0} to{opacity:1}}
.вопрос-тело{position:relative; width:100%; max-width:420px; text-align:center}
.вопрос-тело h2{margin:0 0 16px; font-size:var(--fs-xl); line-height:var(--lh-tight);
  letter-spacing:-.02em; color:var(--cream)}
.вопрос-тело p{margin:0 0 20px; font-size:var(--fs-md); line-height:var(--lh-text);
  color:var(--sand)}
.вопрос-да,.вопрос-нет,.вопрос-мимо{display:block; width:100%; margin-top:10px;
  padding:15px; border:1px solid transparent; border-radius:var(--r-in); font:inherit; font-size:var(--fs-base);
  font-weight:700; cursor:pointer;
  transition:scale var(--t-press) var(--ease-out)}
.вопрос-да:active,.вопрос-нет:active,.вопрос-мимо:active{scale:.98}
.вопрос-да{color:var(--on-lamp); background:var(--metal)}
.вопрос-нет{color:var(--cream); background:rgba(255,255,255,.09);
  border:1px solid var(--seam-2)}

.вопрос-мимо{margin-top:4px; padding:9px; font-weight:500; font-size:var(--fs-md);
  color:var(--sand-dim); background:transparent}


.вопрос-глубь{position:absolute; inset:0; overflow:hidden; pointer-events:none}
.вопрос-глубь .шар{position:absolute; left:50%; top:-42%; width:150vw;
  aspect-ratio:1; translate:-50% 0; border-radius:50%;
  background:radial-gradient(circle at 50% 62%,
    color-mix(in oklab, var(--lamp) 16%, transparent),
    color-mix(in oklab, var(--lamp) 5%, transparent) 58%, transparent 70%)}
.вопрос-глубь .метка{position:absolute; left:50%; top:16%; width:22px;
  height:22px; translate:-50% 0; border-radius:50% 50% 50% 0;
  rotate:-45deg; background:var(--lamp); opacity:.55}


.вопрос-тело.шаги{text-align:left}
.вопрос-тело.шаги h2{text-align:center}
.шаги-список{margin:0 0 18px; padding:0; list-style:none}
.шаги-список li{display:flex; gap:12px; margin-top:16px}
.шаги-список li span{flex:0 0 28px; height:28px; display:grid; place-items:center;
  border-radius:var(--r-in); font-size:var(--fs-md); font-weight:800; color:var(--on-lamp);
  background:var(--metal)}
.шаги-список li div{flex:1; min-width:0}
.шаги-список li b{display:block; font-size:var(--fs-base); color:var(--cream)}
.шаги-список li p{margin:4px 0 0; font-size:var(--fs-sm); color:var(--sand-dim)}

.шаги-список input{width:100%; margin-top:8px; padding:12px;
  border-radius:var(--r-in); border:1px solid var(--seam-2); font:inherit;
  font-size:var(--fs-field); color:var(--cream); background:rgba(0,0,0,.34)}
.шаги-список .вопрос-да{margin-top:8px}
.помощь-итог{margin-top:10px; padding:10px 12px; border-radius:var(--r-in);
  font-size:var(--fs-sm); line-height:var(--lh-text)}
.помощь-итог.да{color:var(--cream); background:color-mix(in oklab, var(--ore) 16%, transparent);
  border:1px solid color-mix(in oklab, var(--ore) 34%, transparent)}
.помощь-итог.нет{color:var(--cream); background:color-mix(in oklab, var(--rust) 16%, transparent);
  border:1px solid color-mix(in oklab, var(--rust) 36%, transparent)}
.помощь-итог.идёт,.помощь-итог.мимо{color:var(--sand);
  background:rgba(0,0,0,.3); border:1px solid var(--seam-2)}


.важно-шапка{display:block; margin-bottom:14px; font-size:var(--fs-md); font-weight:800;
  letter-spacing:.16em; text-transform:uppercase; color:var(--rust)}
.важно-список{margin:0 0 20px; padding-left:22px; text-align:left}
.важно-список li{margin-top:10px; font-size:var(--fs-md); line-height:var(--lh-text);
  color:var(--sand)}
.важно-список li b{color:var(--cream)}

#официальныйПачка{margin-bottom:14px; font-weight:700; color:var(--cream)}

.важно-список.одна{padding-left:0; list-style:none}


.официальный-арт{position:relative; width:150px; height:120px; margin:0 auto 16px}
.официальный-арт::before{content:""; position:absolute; left:-24%; right:-24%;
  top:12%; bottom:-34%; border-radius:50%; pointer-events:none;
  background:radial-gradient(closest-side,
    color-mix(in oklab, var(--lamp-hi) 24%, transparent),
    color-mix(in oklab, var(--lamp) 8%, transparent) 55%, transparent);
  animation:оф-свет 3.4s ease-in-out infinite alternate}
@keyframes оф-свет{from{opacity:.55; transform:scale(.9)} to{opacity:1; transform:scale(1)}}
.официальный-предмет{position:absolute; inset:0; perspective:600px}

.официальный-предмет .вертушка{inset:0}

.официальный-предмет:not(.объём) .art3d{animation:парение 4.6s ease-in-out infinite alternate}
@media (prefers-reduced-motion:reduce){
  .официальный-арт::before,
  .официальный-предмет .art3d{animation:none}
  
  .официальный-предмет .лента{animation:none !important}
}
#официальный{align-items:flex-start}


#официальный .оф-назад{position:sticky; top:4px; z-index:3; display:flex; width:fit-content;
  margin:0 auto 10px 0; background:color-mix(in oklab, var(--deep) 90%, transparent)}
#официальный .вопрос-тело{margin-block:auto}
.официальный-форма{margin:0 0 18px; text-align:left}
.официальный-форма .field:last-child{margin-bottom:0}


.официальный-форма .field label{display:flex; align-items:baseline; justify-content:space-between; gap:10px}
.оф-пометка{font-size:var(--fs-sm); font-weight:500; color:var(--sand-dim); text-align:right}


.оф-корзина{margin:0 0 18px; text-align:left; border:1px solid var(--seam-2);
  border-radius:var(--r-card); overflow:hidden; background:rgba(0,0,0,.2)}
.оф-ряд{display:flex; align-items:center; gap:8px; padding:6px 8px 6px 14px;
  border-bottom:1px solid var(--seam); transition:background-color 180ms var(--ease-out)}
.оф-ряд.взят{background:color-mix(in oklab, var(--lamp) 10%, transparent)}
.оф-что{flex:1; min-width:0; display:flex; align-items:baseline; justify-content:space-between;
  gap:10px; padding:8px 0; border:0; background:none; font:inherit; color:inherit;
  text-align:left; cursor:pointer}
.оф-что b{font-size:var(--fs-base); font-weight:700; color:var(--sand)}
.оф-ряд.взят .оф-что b{color:var(--cream)}
.оф-что u{text-decoration:none; font-weight:700; color:var(--lamp); white-space:nowrap}
.оф-шаг{display:flex; align-items:center; flex:none}
.оф-шаг button{width:36px; height:36px; display:grid; place-items:center;
  border-radius:var(--r-in); border:1px solid var(--seam-2); background:rgba(255,255,255,.06);
  font:inherit; font-size:20px; font-weight:600; line-height:1; color:var(--cream); cursor:pointer;
  transition:scale var(--t-press) var(--ease-out)}
.оф-шаг button:active{scale:.92}
.оф-шаг button:disabled{opacity:.3; cursor:default; scale:1}
.оф-шаг output{min-width:28px; text-align:center; font-weight:800; color:var(--cream)}
.оф-ряд:not(.взят) .оф-шаг output{color:var(--sand-dim)}
.оф-итог{display:flex; align-items:baseline; justify-content:space-between; gap:12px;
  padding:12px 14px; font-size:var(--fs-md); color:var(--sand)}
.оф-итог b{font-size:var(--fs-base); font-weight:800; color:var(--cream); text-align:right}


.код-автора{position:relative; margin:2px 0 18px; padding:16px 16px 14px; text-align:left;
  border-radius:var(--r-card); border:2px solid var(--lamp);
  background:color-mix(in oklab, var(--lamp) 12%, var(--deep))}
.код-автора::after{content:""; position:absolute; inset:-3px; border-radius:inherit;
  pointer-events:none; box-shadow:0 0 26px 2px color-mix(in oklab, var(--lamp) 70%, transparent);
  opacity:.35; animation:ка-пульс 1.6s ease-in-out infinite alternate}
@keyframes ка-пульс{to{opacity:1}}
.ка-шапка{display:flex; align-items:center; gap:8px; font-size:var(--fs-base); font-weight:900;
  letter-spacing:.06em; text-transform:uppercase; color:var(--lamp-hi)}
.ка-шапка::before{content:"\26A0"; font-size:1.3em; line-height:1}
.вопрос-тело .код-автора p.ка-зачем{margin:8px 0 12px; font-size:var(--fs-md); color:var(--cream)}
.ка-код{display:flex; align-items:center; justify-content:space-between; gap:12px; width:100%;
  padding:12px 14px; border-radius:var(--r-in); cursor:pointer; font:inherit;
  border:1.5px dashed color-mix(in oklab, var(--lamp-hi) 75%, transparent); background:rgba(0,0,0,.38);
  transition:scale var(--t-press) var(--ease-out)}
.ка-код:active{scale:.98}
.ка-код b{font-size:var(--fs-xxl); font-weight:900; letter-spacing:.16em; color:var(--lamp-hi);
  user-select:all}
.ка-код span{font-size:var(--fs-sm); font-weight:700; color:var(--cream); opacity:.85}
.ка-путь{margin:12px 0 14px; padding-left:20px}
.ка-путь li{margin-top:6px; font-size:var(--fs-md); line-height:var(--lh-text); color:var(--cream)}

.ка-выбор{display:grid; grid-template-columns:1fr 1.6fr; align-items:center; gap:8px}
.ка-да,.ка-нет{border-radius:var(--r-in); border:1px solid transparent; font:inherit;
  font-weight:800; cursor:pointer; transition:scale var(--t-press) var(--ease-out)}
.ка-да:active,.ка-нет:active{scale:.97}
.ка-да{padding:10px 8px; font-size:var(--fs-md); color:var(--cream);
  background:rgba(255,255,255,.08); border-color:var(--seam-2)}
.ка-нет{padding:15px 10px; font-size:var(--fs-base); color:var(--on-ore); background:var(--ore)}

.вопрос-тело .код-автора p.ка-тряска{margin:12px 0 0; text-align:center; color:var(--rust);
  text-shadow:0 0 12px color-mix(in oklab, var(--rust) 55%, transparent)}
.ка-тряска b{display:block; font-size:var(--fs-lg); font-weight:900; line-height:var(--lh-tight);
  text-transform:uppercase; letter-spacing:.02em}
.ка-тряска span{display:block; margin-top:4px; font-size:var(--fs-md); font-weight:700}
.код-автора.трясётся,
.ка-тряска.трясётся{animation:ка-тряска 640ms cubic-bezier(.36,.07,.19,.97) both}
@keyframes ка-тряска{
  10%,90%{transform:translateX(-2px)} 20%,80%{transform:translateX(4px)}
  30%,50%,70%{transform:translateX(-9px) rotate(-1deg)} 40%,60%{transform:translateX(9px) rotate(1deg)}}

.код-автора.введён{padding:12px 14px; border-width:1px;
  border-color:color-mix(in oklab, var(--ore) 60%, transparent);
  background:color-mix(in oklab, var(--ore) 8%, var(--deep))}
.код-автора.введён::after{content:none}
.код-автора.введён > :not(.ка-готово){display:none}
.ка-готово{display:flex; align-items:center; gap:8px; font-weight:800; color:var(--ore)}
.ка-готово .ic{width:18px; height:18px; flex:none}
.ка-готово button{margin-left:auto; padding:4px 0; border:0; background:none; font:inherit;
  font-size:var(--fs-sm); font-weight:500; color:var(--sand); text-decoration:underline; cursor:pointer}

.оф-оплата.закрыто{cursor:not-allowed}
#официальный .оф-оплата.закрыто > .вопрос-да{opacity:.35; pointer-events:none; box-shadow:none}
@media (prefers-reduced-motion:reduce){
  .код-автора::after{animation:none; opacity:.6}
  .код-автора.трясётся,.ка-тряска.трясётся{animation:none}
}
.официальный-статус{margin:0 0 4px; font-size:var(--fs-sm); line-height:var(--lh-text);
  text-align:left; color:var(--sand-dim)}
.официальный-статус.ok{color:var(--ore)}
.официальный-статус.bad{color:var(--rust)}
#официальный .вопрос-да:disabled{opacity:.6; cursor:progress}
#официальный .field input:disabled{opacity:.6}

.важно-красным{color:var(--rust) !important; font-weight:600}
.как-ссылка{padding:0; border:0; background:none; font:inherit;
  color:var(--lamp); text-decoration:underline; cursor:pointer}


.выдача{margin-top:14px; padding-top:14px; text-align:left;
  border-top:1px solid var(--seam-2)}
.plita .выдача:first-of-type{border-top:0; padding-top:0}
.выдача-имя{display:block; font-size:var(--fs-sm); font-weight:700; color:var(--lamp)}
.выдача .plita-copy{margin-top:8px}


.выдача-сбой{display:block; margin:2px 0 10px; padding:9px 11px; border-radius:var(--r-in);
  font-size:var(--fs-sm); line-height:var(--lh-text); color:var(--cream);
  background:rgba(0,0,0,.26); border:1px solid var(--seam-2)}


.выдача-как{display:block; margin-top:9px; font-size:var(--fs-md); line-height:var(--lh-text);
  color:var(--sand)}

.выдача-итог{display:block; margin-top:6px; font-size:var(--fs-md); line-height:var(--lh-text);
  color:var(--cream)}


@media (prefers-reduced-motion:reduce){
  .plita,.plita::after{animation:none}
  .digger.crack .rock-l,.digger.crack .rock-r{opacity:0}
  .digger.crack .rock{opacity:1}
}

.digger-bar{width:100%; max-width:230px; height:5px; margin-top:10px;
  border-radius:var(--r-pill); background:rgba(0,0,0,.42); overflow:hidden}
.digger-bar i{display:block; height:100%; width:10%; border-radius:var(--r-pill);
  background:linear-gradient(90deg, var(--lamp-lo), var(--lamp-hi));
  transition:width 700ms var(--ease-out)}
.digger.done .pick,.digger.done .chips i,.digger.done .rock,
.digger.bad .rock{animation:none}
.digger.done .pick{rotate:-14deg; color:var(--ore)}
.digger.bad .pick{animation:none; rotate:24deg; color:var(--rust)}


.trail{margin-top:12px; padding:8px 16px; border-radius:var(--r-card);
  background:linear-gradient(180deg,
    color-mix(in oklab, var(--stone-deep) 90%, transparent),
    color-mix(in oklab, var(--deep) 94%, transparent));
  border:1px solid var(--seam)}
.trail li div b{display:block; font-size:var(--fs-md); color:inherit}

.trail li div > span{display:block; margin-top:1px; font-size:var(--fs-sm); color:var(--sand-dim)}


.crown.still *{animation-play-state:paused !important}


.soon-pill{flex:none; font-style:normal; font-size:var(--fs-cap); font-weight:700;
  letter-spacing:.11em; text-transform:uppercase; padding:4px 9px;
  border-radius:var(--r-pill); color:var(--lamp);
  background:color-mix(in oklab, var(--lamp) 13%, transparent);
  border:1px solid color-mix(in oklab, var(--lamp) 17%, transparent)}


.back{display:inline-flex; align-items:center; gap:6px; margin:12px 0 8px;
  padding:8px 13px 8px 9px; border-radius:var(--r-pill); font-size:var(--fs-md); font-weight:600;
  color:var(--sand); background:color-mix(in oklab, var(--cream) 7%, transparent);
  border:1px solid color-mix(in oklab, var(--lamp-hi) 16%, transparent);
  transition:scale var(--t-press) var(--ease-out), background 160ms var(--ease-out)}
.back .ic{width:16px; height:16px}
.back:active{scale:.955; background:color-mix(in oklab, var(--cream) 12%, transparent)}



.tabs{position:sticky; top:52px; z-index:15; margin:12px -16px 2px; padding:2px 16px 8px;
  background:linear-gradient(180deg, var(--deep) 58%, transparent);
  -webkit-mask-image:linear-gradient(90deg, transparent 0, #000 14px,
    #000 calc(100% - 26px), transparent 100%);
  mask-image:linear-gradient(90deg, transparent 0, #000 14px,
    #000 calc(100% - 26px), transparent 100%)}
.tab{display:inline-flex; align-items:center; gap:6px}
.tab .ic{width:14px; height:14px}

.tab .зн{width:19px; height:19px; object-fit:contain; margin:-2px 0}


.tab.страна .зн{width:27px; height:27px; margin:-5px 0}
.tab.страна{gap:8px; padding-right:13px}


.grid > .home,.grid > .empty{grid-column:1 / -1}


.home{display:grid; gap:22px}
.promises span{display:block; font-size:var(--fs-cap); color:var(--sand-dim); margin-top:3px;
  line-height:var(--lh-tight); text-wrap:balance}

.row h3{display:flex; align-items:center; gap:8px; margin:0 0 10px;
  font-size:var(--fs-base); font-weight:700; letter-spacing:-.01em}
.row h3 .ic{width:15px; height:15px; color:var(--lamp)}
.row .more{margin-left:auto; padding:5px 10px; border-radius:var(--r-pill);
  font-size:var(--fs-sm); font-weight:600; color:var(--lamp);
  background:color-mix(in oklab, var(--lamp) 12%, transparent)}
.row .more:active{background:color-mix(in oklab, var(--lamp) 22%, transparent)}

.more-n{display:none}
.row-in{display:grid; grid-template-columns:repeat(3, 1fr); gap:7px}


.field{margin-bottom:16px}
.field label{display:block; font-size:var(--fs-sm); font-weight:600; letter-spacing:.01em;
  color:var(--sand); margin-bottom:8px}
.field input{width:100%; font:var(--fs-field)/var(--lh-text) var(--font); font-weight:550; color:var(--cream);
  background:color-mix(in oklab, var(--cream) 7%, transparent);
  border:1px solid color-mix(in oklab, var(--lamp-hi) 20%, transparent); border-radius:var(--r-in);
  padding:14px 14px; outline:none;
  box-shadow:inset 0 1px 0 color-mix(in oklab, var(--cream) 10%, transparent),
    inset 0 -1px 0 rgba(0,0,0,.3);
  transition:border-color var(--t-hover) ease, background var(--t-hover) ease,
             box-shadow var(--t-hover) ease}
.field input::placeholder{color:var(--sand-dim)}
.field input:hover{background:color-mix(in oklab, var(--cream) 10%, transparent)}
.field input:focus{border-color:var(--fo-line);
  background:color-mix(in oklab, var(--cream) 12%, transparent);
  box-shadow:inset 0 1px 0 color-mix(in oklab, var(--cream) 16%, transparent),
             var(--fo-ring)}
.field input.bad,.field input.wrong{border-color:var(--rust);
  box-shadow:0 0 0 3px color-mix(in oklab, var(--rust) 20%, transparent)}
.field .say,.say{color:var(--sand-dim)}
.field input:-webkit-autofill,.field input:-webkit-autofill:focus{
  -webkit-box-shadow:0 0 0 100px var(--stone) inset}


.lines{background:color-mix(in oklab, var(--cream) 5.5%, transparent);
  border:1px solid color-mix(in oklab, var(--lamp-hi) 14%, transparent);
  border-radius:var(--r-card); padding:12px 14px; margin:0 0 16px}


.ore{
  border:1px solid color-mix(in oklab, var(--lamp-hi) 13%, transparent);
  
  
  background:linear-gradient(168deg, color-mix(in oklab, var(--cream) 7.5%, transparent) 0%,
    color-mix(in oklab, var(--cream) 3.5%, transparent) 100%);
  
  box-shadow:
    inset 0 1px 0 color-mix(in oklab, var(--cream) 17%, transparent),
    inset 0 -1px 0 rgba(0,0,0,.4),
    var(--sh-card);
}
.ore.spent{background:linear-gradient(168deg,
  color-mix(in oklab, var(--rock) 50%, transparent),
  color-mix(in oklab, var(--deep) 62%, transparent));
  border-color:color-mix(in oklab, var(--seam) 40%, transparent);
    box-shadow:inset 0 1px 0 color-mix(in oklab, var(--cream) 8%, transparent)}
.ore.incart{border-color:color-mix(in oklab, var(--lamp) 42%, transparent);
  background:linear-gradient(168deg,
    color-mix(in oklab, var(--lamp) 13%, transparent) 0%,
    color-mix(in oklab, var(--deep) 55%, transparent) 100%);
  box-shadow:
    inset 0 1px 0 color-mix(in oklab, var(--cream) 30%, transparent),
    inset 0 -1px 0 rgba(0,0,0,.4),
    0 12px 28px -14px color-mix(in oklab, var(--lamp) 35%, transparent)}


.ore .take{
  border:1px solid color-mix(in oklab, var(--lamp-hi) 20%, transparent);
  background:linear-gradient(180deg, color-mix(in oklab, var(--cream) 13%, transparent),
    color-mix(in oklab, var(--cream) 6%, transparent));
  color:var(--cream);
  box-shadow:inset 0 1px 0 color-mix(in oklab, var(--cream) 26%, transparent),
    0 3px 9px -6px rgba(0,0,0,.7);
  transition:background 180ms var(--ease-out), border-color 180ms var(--ease-out)}
.ore:not(.spent):active .take{background:linear-gradient(180deg,
  color-mix(in oklab, var(--lamp-hi) 26%, transparent),
    color-mix(in oklab, var(--lamp-hi) 10%, transparent))}
.ore.spent .take{background:rgba(0,0,0,.22);
  border-color:color-mix(in oklab, var(--seam) 50%, transparent);
  box-shadow:none; opacity:.55}


.tab:not(.on){background:color-mix(in oklab, var(--cream) 7.5%, transparent);
  border-color:color-mix(in oklab, var(--lamp-hi) 12%, transparent);
  box-shadow:inset 0 1px 0 color-mix(in oklab, var(--cream) 12%, transparent)}
.who-chip{box-shadow:inset 0 1px 0 color-mix(in oklab, var(--cream) 14%, transparent)}


@media (prefers-reduced-transparency: reduce){
  .ore, .ore.incart, .tab:not(.on), .who-chip{
    backdrop-filter:none; -webkit-backdrop-filter:none}
  .ore{background:linear-gradient(168deg, var(--stone) 0%, var(--stone-deep) 100%)}
  .ore.incart{background:linear-gradient(168deg, var(--stone-2) 0%, var(--rock) 100%)}
  .tab:not(.on){background:var(--stone)}
  .who-chip{background:var(--stone)}
}




.pile{display:block; position:relative; height:44px; margin-bottom:5px;
  perspective:300px}
.pile .uc{position:absolute; left:50%; bottom:0; flex:none;
  translate:calc(-50% + var(--x)) var(--y);
  filter:drop-shadow(0 2px 3px rgba(0,0,0,.55));
  transition:scale 300ms var(--ease-out), rotate 300ms var(--ease-out),
             filter 300ms var(--ease-out);
  transition-delay:calc(var(--c) * 22ms)}

.pile.lvl1 .uc{width:24px; height:24px}
.pile.lvl2 .uc{width:18px; height:18px}
.pile.lvl3 .uc{width:15px; height:15px}
.pile.lvl4 .uc{width:13px; height:13px}

@media (hover:hover){
  .ore:not(.spent):hover .pile .uc{scale:1.12;
    filter:drop-shadow(0 5px 7px rgba(0,0,0,.7)) brightness(1.12)}
  .ore:not(.spent):hover .pile .uc:nth-child(odd){rotate:-9deg}
  .ore:not(.spent):hover .pile .uc:nth-child(even){rotate:9deg}
}
.ore:not(.spent):active .pile .uc{scale:.96; rotate:0deg; transition-duration:70ms;
  transition-delay:0ms}


.pile.clink .uc{animation:coin-flip 620ms linear both;
  animation-delay:calc(var(--c) * 42ms)}
.pile.unclink .uc{animation:coin-back 560ms linear both;
  animation-delay:calc((var(--n) - 1 - var(--c)) * 36ms)}
.pile.wave .uc{animation:coin-flip 560ms linear both;
  animation-delay:calc(var(--d, 0) * 30ms + var(--c, 0) * 42ms)}

@media (prefers-reduced-motion: reduce){
  .pile .uc, .pile.clink .uc, .pile.unclink .uc, .pile.wave .uc{
    animation:none !important; transition:none !important; scale:1; rotate:0deg}
}


.pile.пачка{height:74px; margin-bottom:4px; perspective:none}

.пачка-тело{position:absolute; inset:0; transform-origin:50% 94%;
  transition:translate var(--t-hover) ease, scale var(--t-hover) ease,
    rotate var(--t-hover) ease}
.пачка-вид{position:absolute; inset:0; width:100%; height:100%; object-fit:contain}
.пачка-блеск{position:absolute; inset:0; overflow:hidden; pointer-events:none;
  -webkit-mask:var(--m) center / contain no-repeat; mask:var(--m) center / contain no-repeat}
.пачка-блеск::before{content:""; position:absolute; top:-30%; bottom:-30%; left:-55%; width:42%;
  background:linear-gradient(100deg, transparent 0%, rgba(255,248,222,.8) 50%, transparent 100%);
  rotate:14deg; opacity:0}
@media (hover:hover) and (pointer:fine){
  .ore:not(.spent):hover .пачка-тело{translate:0 -3px; scale:1.04; rotate:-1.5deg}
}
.ore:not(.spent):active .пачка-тело{translate:0 0; scale:.95; rotate:0deg;
  transition-duration:80ms}
.pile.пачка.clink .пачка-тело{animation:пачка-взять 640ms linear}
.pile.пачка.clink .пачка-блеск::before{animation:пачка-блеск 720ms var(--ease-out) 120ms}
.pile.пачка.unclink .пачка-тело{animation:пачка-снять 420ms linear}

.pile.пачка.wave .пачка-тело{animation:пачка-волна 460ms var(--ease-out) backwards;
  animation-delay:calc(var(--d, 0) * 55ms)}

.пачка-единицы{position:absolute; inset:0; pointer-events:none}
.пачка-единицы b{position:absolute; left:50%; top:20%; width:22%; aspect-ratio:1;
  translate:-50% 0; background:var(--u) center / contain no-repeat; opacity:0}
.пачка-единицы b:nth-child(1){--o:-1; --k:-1; --c:0}
.пачка-единицы b:nth-child(2){--o:1; --k:1; --c:1}
.пачка-единицы b:nth-child(3){--o:.25; --k:-1; --c:2}
.pile.пачка.clink .пачка-единицы b{animation:пачка-единица 720ms linear backwards;
  animation-delay:calc(80ms + var(--c) * 50ms)}
.pile.пачка.unclink .пачка-единицы b{animation:пачка-единица 520ms linear backwards reverse;
  animation-delay:calc(var(--c) * 40ms)}
@keyframes пачка-волна{from{transform:translateY(10px) scale(.95); opacity:0}
  to{transform:none; opacity:1}}
@keyframes пачка-блеск{0%{transform:translateX(0); opacity:0} 14%{opacity:1}
  100%{transform:translateX(390%); opacity:0}}
@keyframes пачка-взять{
  0%{transform:translateY(0.00px) rotate(0.00deg) scale(1.0000,1.0000)}
  4%{transform:translateY(0.85px) rotate(-0.56deg) scale(1.0312,0.9548)}
  8%{transform:translateY(1.69px) rotate(-1.27deg) scale(1.0650,0.9067)}
  12%{transform:translateY(0.94px) rotate(-1.60deg) scale(1.0611,0.9136)}
  16%{transform:translateY(-1.69px) rotate(-1.09deg) scale(1.0145,0.9834)}
  20%{transform:translateY(-4.95px) rotate(0.04deg) scale(0.9639,1.0590)}
  24%{transform:translateY(-7.50px) rotate(1.30deg) scale(0.9468,1.0854)}
  28%{transform:translateY(-9.07px) rotate(2.22deg) scale(0.9593,1.0684)}
  32%{transform:translateY(-10.15px) rotate(2.34deg) scale(0.9828,1.0350)}
  36%{transform:translateY(-10.50px) rotate(1.67deg) scale(1.0000,1.0100)}
  40%{transform:translateY(-10.04px) rotate(0.59deg) scale(0.9988,1.0100)}
  44%{transform:translateY(-8.86px) rotate(-0.52deg) scale(0.9864,1.0247)}
  48%{transform:translateY(-7.00px) rotate(-1.28deg) scale(0.9745,1.0384)}
  52%{transform:translateY(-3.87px) rotate(-1.32deg) scale(0.9751,1.0354)}
  56%{transform:translateY(-0.46px) rotate(-0.75deg) scale(1.0000,1.0000)}
  60%{transform:translateY(1.10px) rotate(0.04deg) scale(1.0597,0.9177)}
  64%{transform:translateY(1.20px) rotate(0.67deg) scale(1.0768,0.8946)}
  68%{transform:translateY(-0.08px) rotate(0.78deg) scale(1.0258,0.9657)}
  72%{transform:translateY(-1.93px) rotate(0.47deg) scale(0.9800,1.0300)}
  76%{transform:translateY(-2.35px) rotate(0.02deg) scale(0.9791,1.0335)}
  80%{transform:translateY(-1.30px) rotate(-0.30deg) scale(0.9963,1.0124)}
  84%{transform:translateY(0.01px) rotate(-0.32deg) scale(1.0100,0.9950)}
  88%{transform:translateY(0.52px) rotate(-0.16deg) scale(1.0080,0.9969)}
  92%{transform:translateY(0.34px) rotate(0.04deg) scale(0.9992,1.0065)}
  96%{transform:translateY(0.00px) rotate(0.14deg) scale(0.9933,1.0116)}
  100%{transform:translateY(0.00px) rotate(0.00deg) scale(1.0000,1.0000)}
}
@keyframes пачка-снять{
  0%{transform:translateY(0.00px) rotate(0.00deg) scale(1.0000,1.0000)}
  4%{transform:translateY(0.50px) rotate(0.27deg) scale(1.0078,0.9874)}
  8%{transform:translateY(1.25px) rotate(0.73deg) scale(1.0194,0.9688)}
  12%{transform:translateY(2.07px) rotate(1.27deg) scale(1.0321,0.9487)}
  16%{transform:translateY(2.77px) rotate(1.77deg) scale(1.0430,0.9313)}
  20%{transform:translateY(3.17px) rotate(2.12deg) scale(1.0494,0.9210)}
  24%{transform:translateY(3.08px) rotate(2.20deg) scale(1.0484,0.9224)}
  28%{transform:translateY(2.45px) rotate(1.91deg) scale(1.0394,0.9364)}
  32%{transform:translateY(1.46px) rotate(1.31deg) scale(1.0252,0.9586)}
  36%{transform:translateY(0.35px) rotate(0.53deg) scale(1.0090,0.9840)}
  40%{transform:translateY(-0.68px) rotate(-0.28deg) scale(0.9939,1.0079)}
  44%{transform:translateY(-1.41px) rotate(-1.00deg) scale(0.9829,1.0253)}
  48%{transform:translateY(-1.66px) rotate(-1.49deg) scale(0.9788,1.0320)}
  52%{transform:translateY(-1.51px) rotate(-1.62deg) scale(0.9802,1.0306)}
  56%{transform:translateY(-1.10px) rotate(-1.44deg) scale(0.9850,1.0239)}
  60%{transform:translateY(-0.57px) rotate(-1.06deg) scale(0.9916,1.0145)}
  64%{transform:translateY(-0.03px) rotate(-0.56deg) scale(0.9983,1.0047)}
  68%{transform:translateY(0.38px) rotate(-0.05deg) scale(1.0035,0.9972)}
  72%{transform:translateY(0.56px) rotate(0.36deg) scale(1.0057,0.9940)}
  76%{transform:translateY(0.53px) rotate(0.60deg) scale(1.0052,0.9946)}
  80%{transform:translateY(0.38px) rotate(0.61deg) scale(1.0032,0.9975)}
  84%{transform:translateY(0.17px) rotate(0.48deg) scale(1.0004,1.0014)}
  88%{transform:translateY(-0.04px) rotate(0.28deg) scale(0.9979,1.0049)}
  92%{transform:translateY(-0.18px) rotate(0.09deg) scale(0.9963,1.0067)}
  96%{transform:translateY(-0.19px) rotate(-0.03deg) scale(0.9967,1.0055)}
  100%{transform:translateY(0.00px) rotate(0.00deg) scale(1.0000,1.0000)}
}
@keyframes пачка-единица{
  0%{transform:translate(calc(var(--o) * 0.00px),8.00px) rotate(calc(var(--k) * 0.0deg)) scale(0.4000); opacity:0.000}
  4%{transform:translate(calc(var(--o) * 0.95px),4.82px) rotate(calc(var(--k) * 13.9deg)) scale(0.5254); opacity:0.453}
  8%{transform:translate(calc(var(--o) * 2.03px),-0.18px) rotate(calc(var(--k) * 29.1deg)) scale(0.7018); opacity:1.000}
  12%{transform:translate(calc(var(--o) * 3.28px),-5.00px) rotate(calc(var(--k) * 45.1deg)) scale(0.8500); opacity:1.000}
  16%{transform:translate(calc(var(--o) * 4.80px),-9.14px) rotate(calc(var(--k) * 61.6deg)) scale(0.9366); opacity:1.000}
  20%{transform:translate(calc(var(--o) * 6.66px),-13.21px) rotate(calc(var(--k) * 78.3deg)) scale(0.9888); opacity:1.000}
  24%{transform:translate(calc(var(--o) * 8.75px),-16.92px) rotate(calc(var(--k) * 94.7deg)) scale(1.0191); opacity:1.000}
  28%{transform:translate(calc(var(--o) * 10.91px),-20.00px) rotate(calc(var(--k) * 110.5deg)) scale(1.0396); opacity:1.000}
  32%{transform:translate(calc(var(--o) * 13.02px),-22.42px) rotate(calc(var(--k) * 125.4deg)) scale(1.0593); opacity:1.000}
  36%{transform:translate(calc(var(--o) * 14.96px),-24.32px) rotate(calc(var(--k) * 140.1deg)) scale(1.0673); opacity:1.000}
  40%{transform:translate(calc(var(--o) * 16.88px),-25.61px) rotate(calc(var(--k) * 154.7deg)) scale(1.0637); opacity:1.000}
  44%{transform:translate(calc(var(--o) * 18.77px),-26.23px) rotate(calc(var(--k) * 169.0deg)) scale(1.0516); opacity:1.000}
  48%{transform:translate(calc(var(--o) * 20.58px),-26.24px) rotate(calc(var(--k) * 183.0deg)) scale(1.0342); opacity:1.000}
  52%{transform:translate(calc(var(--o) * 22.24px),-25.59px) rotate(calc(var(--k) * 196.5deg)) scale(1.0145); opacity:1.000}
  56%{transform:translate(calc(var(--o) * 23.71px),-24.19px) rotate(calc(var(--k) * 209.6deg)) scale(0.9953); opacity:1.000}
  60%{transform:translate(calc(var(--o) * 25.02px),-21.94px) rotate(calc(var(--k) * 222.0deg)) scale(0.9751); opacity:1.000}
  64%{transform:translate(calc(var(--o) * 26.18px),-19.11px) rotate(calc(var(--k) * 233.4deg)) scale(0.9520); opacity:1.000}
  68%{transform:translate(calc(var(--o) * 27.22px),-16.00px) rotate(calc(var(--k) * 243.5deg)) scale(0.9255); opacity:0.954}
  72%{transform:translate(calc(var(--o) * 28.15px),-12.46px) rotate(calc(var(--k) * 252.7deg)) scale(0.8951); opacity:0.848}
  76%{transform:translate(calc(var(--o) * 29.00px),-8.51px) rotate(calc(var(--k) * 261.3deg)) scale(0.8601); opacity:0.728}
  80%{transform:translate(calc(var(--o) * 29.66px),-4.69px) rotate(calc(var(--k) * 269.7deg)) scale(0.8200); opacity:0.601}
  84%{transform:translate(calc(var(--o) * 30.09px),-1.29px) rotate(calc(var(--k) * 278.1deg)) scale(0.7528); opacity:0.472}
  88%{transform:translate(calc(var(--o) * 30.43px),2.50px) rotate(calc(var(--k) * 287.1deg)) scale(0.6589); opacity:0.350}
  92%{transform:translate(calc(var(--o) * 30.78px),5.97px) rotate(calc(var(--k) * 296.8deg)) scale(0.5716); opacity:0.151}
  96%{transform:translate(calc(var(--o) * 31.26px),8.14px) rotate(calc(var(--k) * 307.7deg)) scale(0.5242); opacity:0.000}
  100%{transform:translate(calc(var(--o) * 32.00px),8.00px) rotate(calc(var(--k) * 320.0deg)) scale(0.5500); opacity:0.000}
}

.пачка-ореол{position:absolute; inset:-8% -2%; pointer-events:none; border-radius:50%;
  background:radial-gradient(closest-side, rgba(255,200,80,.62), rgba(255,170,40,.2) 55%, transparent);
  opacity:.8; animation:пачка-дышит 3.6s ease-in-out infinite alternate}

.pile.пачка.clink .пачка-ореол{animation:пачка-дышит 3.6s ease-in-out infinite alternate,
  пачка-вспышка 700ms var(--ease-out)}
.пачка-искры{position:absolute; inset:0; pointer-events:none}
.пачка-искры b{position:absolute; width:4px; height:4px; border-radius:50%;
  background:rgba(255,241,194,.95); box-shadow:0 0 6px 2px rgba(255,196,80,.75); opacity:0;
  animation:пачка-искра 2.8s ease-in-out infinite}
.пачка-искры b:nth-child(1){left:12%; top:20%}
.пачка-искры b:nth-child(2){right:10%; top:8%; animation-delay:.95s}
.пачка-искры b:nth-child(3){right:22%; bottom:10%; animation-delay:1.9s}

.пачка.сияет-синий .пачка-ореол{background:radial-gradient(closest-side,
  rgba(70,150,255,.6), rgba(47,123,255,.2) 55%, transparent)}
.пачка.сияет-синий .пачка-искры b{background:rgba(232,244,255,.95);
  box-shadow:0 0 6px 2px rgba(90,165,255,.75)}
@keyframes пачка-дышит{from{opacity:.62} to{opacity:1}}
@keyframes пачка-вспышка{30%{transform:scale(1.18)} to{transform:none}}
@keyframes пачка-искра{0%, 100%{opacity:0; transform:scale(.4)} 50%{opacity:1; transform:scale(1)}}
@media (prefers-reduced-motion: reduce){
  
  .пачка-тело{transition:none}
  .pile.пачка.clink .пачка-тело, .pile.пачка.unclink .пачка-тело, .pile.пачка.wave .пачка-тело,
  .pile.пачка.clink .пачка-блеск::before{animation:none}
  .пачка-единицы{display:none}
  .пачка-ореол, .pile.пачка.clink .пачка-ореол{animation:none; opacity:.75}
  .пачка-искры b{animation:none; opacity:.6; transform:none}
}


@keyframes breathe{
  0%{scale:1.0000 1.0000; translate:0 0.00px}
  4%{scale:1.0012 1.0026; translate:0 -0.40px}
  8%{scale:1.0028 1.0060; translate:0 -0.92px}
  12%{scale:1.0045 1.0098; translate:0 -1.50px}
  16%{scale:1.0064 1.0138; translate:0 -2.12px}
  20%{scale:1.0083 1.0178; translate:0 -2.73px}
  24%{scale:1.0101 1.0217; translate:0 -3.32px}
  28%{scale:1.0117 1.0250; translate:0 -3.83px}
  32%{scale:1.0129 1.0277; translate:0 -4.24px}
  36%{scale:1.0137 1.0294; translate:0 -4.51px}
  40%{scale:1.0140 1.0300; translate:0 -4.60px}
  44%{scale:1.0138 1.0297; translate:0 -4.56px}
  48%{scale:1.0134 1.0288; translate:0 -4.43px}
  52%{scale:1.0126 1.0272; translate:0 -4.18px}
  56%{scale:1.0112 1.0243; translate:0 -3.74px}
  60%{scale:1.0089 1.0193; translate:0 -2.97px}
  64%{scale:1.0059 1.0127; translate:0 -1.96px}
  68%{scale:1.0027 1.0057; translate:0 -0.87px}
  72%{scale:0.9997 0.9991; translate:0 0.16px}
  76%{scale:0.9973 0.9938; translate:0 0.96px}
  80%{scale:0.9960 0.9910; translate:0 1.40px}
  84%{scale:0.9959 0.9907; translate:0 1.44px}
  88%{scale:0.9965 0.9922; translate:0 1.22px}
  92%{scale:0.9976 0.9946; translate:0 0.84px}
  96%{scale:0.9988 0.9974; translate:0 0.40px}
  100%{scale:1.0000 1.0000; translate:0 0.00px}
}

@keyframes loll{
  0%{rotate:0.00deg; scale:1.0000 1.0000; translate:0.00px 0.00px}
  4%{rotate:-1.50deg; scale:0.9880 0.9705; translate:-0.13px 0.13px}
  8%{rotate:-2.65deg; scale:0.9770 0.9449; translate:-0.47px 0.47px}
  12%{rotate:-0.97deg; scale:0.9888 0.9722; translate:-0.95px 0.95px}
  16%{rotate:2.85deg; scale:1.0174 1.0388; translate:-1.48px 1.48px}
  20%{rotate:5.00deg; scale:1.0330 1.0770; translate:-2.01px 2.01px}
  24%{rotate:3.08deg; scale:1.0176 1.0463; translate:-2.45px 2.45px}
  28%{rotate:1.00deg; scale:1.0000 1.0110; translate:-2.73px 2.73px}
  32%{rotate:2.23deg; scale:1.0038 1.0251; translate:-2.77px 2.77px}
  36%{rotate:3.70deg; scale:1.0110 1.0440; translate:-2.50px 2.50px}
  40%{rotate:3.14deg; scale:1.0142 1.0389; translate:-1.86px 1.86px}
  44%{rotate:1.48deg; scale:1.0101 1.0178; translate:-0.75px 0.75px}
  48%{rotate:-1.02deg; scale:0.9801 0.9727; translate:0.94px -0.94px}
  52%{rotate:-4.60deg; scale:0.9231 0.9004; translate:3.12px -3.12px}
  56%{rotate:-7.06deg; scale:0.8827 0.8511; translate:4.73px -4.73px}
  60%{rotate:-8.11deg; scale:0.8655 0.8320; translate:5.62px -5.66px}
  64%{rotate:-2.80deg; scale:0.9301 0.9340; translate:3.40px -3.05px}
  68%{rotate:6.56deg; scale:1.0476 1.1127; translate:-0.94px 1.92px}
  72%{rotate:7.97deg; scale:1.0697 1.1384; translate:-2.35px 3.34px}
  76%{rotate:3.19deg; scale:1.0170 1.0439; translate:-1.00px 1.40px}
  80%{rotate:4.15deg; scale:1.0223 1.0511; translate:0.16px -0.23px}
  84%{rotate:6.60deg; scale:1.0440 1.0880; translate:0.50px -0.74px}
  88%{rotate:3.79deg; scale:1.0202 1.0467; translate:0.50px -0.75px}
  92%{rotate:0.89deg; scale:0.9973 1.0057; translate:0.32px -0.48px}
  96%{rotate:0.33deg; scale:0.9981 1.0025; translate:0.11px -0.16px}
  100%{rotate:0.00deg; scale:1.0000 1.0000; translate:0.00px 0.00px}
}

@keyframes fan{
  0%{opacity:0.130; translate:0.00px 0; scale:1.0000 1.0000}
  4%{opacity:0.087; translate:-2.75px 0; scale:0.9706 0.9873}
  8%{opacity:0.076; translate:-4.80px 0; scale:0.9494 0.9788}
  12%{opacity:0.087; translate:-6.21px 0; scale:0.9359 0.9742}
  16%{opacity:0.113; translate:-6.99px 0; scale:0.9294 0.9731}
  20%{opacity:0.143; translate:-7.19px 0; scale:0.9296 0.9750}
  24%{opacity:0.170; translate:-6.84px 0; scale:0.9359 0.9797}
  28%{opacity:0.191; translate:-5.97px 0; scale:0.9477 0.9867}
  32%{opacity:0.215; translate:-4.61px 0; scale:0.9645 0.9956}
  36%{opacity:0.245; translate:-2.81px 0; scale:0.9859 1.0060}
  40%{opacity:0.285; translate:-0.60px 0; scale:1.0112 1.0176}
  44%{opacity:0.340; translate:2.00px 0; scale:1.0400 1.0300}
  48%{opacity:0.432; translate:5.89px 0; scale:1.0825 1.0474}
  52%{opacity:0.563; translate:11.37px 0; scale:1.1423 1.0716}
  56%{opacity:0.711; translate:17.49px 0; scale:1.2087 1.0982}
  60%{opacity:0.850; translate:23.27px 0; scale:1.2711 1.1231}
  64%{opacity:0.956; translate:27.77px 0; scale:1.3189 1.1421}
  68%{opacity:1.005; translate:30.02px 0; scale:1.3415 1.1508}
  72%{opacity:0.978; translate:29.20px 0; scale:1.3297 1.1457}
  76%{opacity:0.898; translate:26.07px 0; scale:1.2915 1.1300}
  80%{opacity:0.785; translate:21.99px 0; scale:1.2431 1.1099}
  84%{opacity:0.643; translate:17.97px 0; scale:1.1969 1.0898}
  88%{opacity:0.460; translate:13.33px 0; scale:1.1451 1.0665}
  92%{opacity:0.300; translate:8.39px 0; scale:1.0910 1.0416}
  96%{opacity:0.200; translate:3.75px 0; scale:1.0406 1.0184}
  100%{opacity:0.130; translate:0.00px 0; scale:1.0000 1.0000}
}

@keyframes blow{
  0%{opacity:0.000}
  4%{opacity:0.000}
  8%{opacity:0.000}
  12%{opacity:0.000}
  16%{opacity:0.000}
  20%{opacity:0.000}
  24%{opacity:0.027}
  28%{opacity:0.051}
  32%{opacity:0.072}
  36%{opacity:0.098}
  40%{opacity:0.133}
  44%{opacity:0.186}
  48%{opacity:0.267}
  52%{opacity:0.407}
  56%{opacity:0.578}
  60%{opacity:0.749}
  64%{opacity:0.885}
  68%{opacity:0.952}
  72%{opacity:0.924}
  76%{opacity:0.824}
  80%{opacity:0.690}
  84%{opacity:0.545}
  88%{opacity:0.375}
  92%{opacity:0.220}
  96%{opacity:0.098}
  100%{opacity:0.000}
}

@keyframes coin-flip{
  0%{transform:rotateY(0.0deg) translateY(0.00px)}
  4%{transform:rotateY(-9.6deg) translateY(-1.36px)}
  8%{transform:rotateY(44.2deg) translateY(-3.45px)}
  12%{transform:rotateY(96.0deg) translateY(-5.69px)}
  16%{transform:rotateY(123.1deg) translateY(-7.50px)}
  20%{transform:rotateY(147.4deg) translateY(-8.92px)}
  24%{transform:rotateY(170.4deg) translateY(-10.16px)}
  28%{transform:rotateY(193.2deg) translateY(-10.91px)}
  32%{transform:rotateY(217.0deg) translateY(-10.84px)}
  36%{transform:rotateY(240.9deg) translateY(-9.87px)}
  40%{transform:rotateY(264.7deg) translateY(-8.37px)}
  44%{transform:rotateY(288.3deg) translateY(-6.74px)}
  48%{transform:rotateY(312.7deg) translateY(-5.20px)}
  52%{transform:rotateY(341.4deg) translateY(-3.20px)}
  56%{transform:rotateY(368.8deg) translateY(-1.26px)}
  60%{transform:rotateY(387.8deg) translateY(-0.08px)}
  64%{transform:rotateY(391.9deg) translateY(-0.41px)}
  68%{transform:rotateY(383.3deg) translateY(-2.13px)}
  72%{transform:rotateY(372.0deg) translateY(-3.40px)}
  76%{transform:rotateY(360.9deg) translateY(-3.07px)}
  80%{transform:rotateY(352.0deg) translateY(-1.96px)}
  84%{transform:rotateY(368.6deg) translateY(-1.00px)}
  88%{transform:rotateY(377.7deg) translateY(-0.37px)}
  92%{transform:rotateY(301.5deg) translateY(0.19px)}
  96%{transform:rotateY(131.1deg) translateY(0.41px)}
  100%{transform:rotateY(0.0deg) translateY(0.00px)}
}

@keyframes coin-back{
  0%{transform:rotateY(0.0deg) translateY(0.00px)}
  4%{transform:rotateY(9.6deg) translateY(0.79px)}
  8%{transform:rotateY(-44.2deg) translateY(2.03px)}
  12%{transform:rotateY(-96.0deg) translateY(3.37px)}
  16%{transform:rotateY(-123.1deg) translateY(4.50px)}
  20%{transform:rotateY(-147.4deg) translateY(5.45px)}
  24%{transform:rotateY(-170.4deg) translateY(6.33px)}
  28%{transform:rotateY(-193.2deg) translateY(6.91px)}
  32%{transform:rotateY(-217.0deg) translateY(6.93px)}
  36%{transform:rotateY(-240.9deg) translateY(6.38px)}
  40%{transform:rotateY(-264.7deg) translateY(5.47px)}
  44%{transform:rotateY(-288.3deg) translateY(4.47px)}
  48%{transform:rotateY(-312.7deg) translateY(3.48px)}
  52%{transform:rotateY(-341.4deg) translateY(2.17px)}
  56%{transform:rotateY(-368.8deg) translateY(0.87px)}
  60%{transform:rotateY(-387.8deg) translateY(0.06px)}
  64%{transform:rotateY(-391.9deg) translateY(0.26px)}
  68%{transform:rotateY(-383.3deg) translateY(1.37px)}
  72%{transform:rotateY(-372.0deg) translateY(2.20px)}
  76%{transform:rotateY(-360.9deg) translateY(2.03px)}
  80%{transform:rotateY(-352.0deg) translateY(1.38px)}
  84%{transform:rotateY(-368.6deg) translateY(0.80px)}
  88%{transform:rotateY(-377.7deg) translateY(0.39px)}
  92%{transform:rotateY(-301.5deg) translateY(-0.01px)}
  96%{transform:rotateY(-131.1deg) translateY(-0.20px)}
  100%{transform:rotateY(0.0deg) translateY(0.00px)}
}




.pile .uc{
  background:var(--cur, url("img/coin.webp?v=7ce42990")) center / contain no-repeat;
  filter:drop-shadow(0 2px 3px rgba(0,0,0,.55))}
.pile .uc > *{display:none}          


.game-warn{position:relative; margin:0 0 12px; padding:11px 13px 11px 34px;
  border-radius:var(--r-card);
  font-size:var(--fs-sm); line-height:var(--lh-text); color:var(--cream);
  background:color-mix(in oklab, var(--lamp) 10%, transparent);
  border:1px solid color-mix(in oklab, var(--lamp) 26%, transparent)}
.game-warn::before{content:"\26A0"; position:absolute; left:12px; top:10px;
  color:var(--lamp); font-size:var(--fs-md); line-height:var(--lh-text)}
.game-warn.hidden{display:none}



.pile.one{display:grid; place-items:center; height:66px}

.pile.one .uc{position:static; translate:0; width:100%; height:100%;
  background-size:contain;
  filter:drop-shadow(0 3px 5px rgba(0,0,0,.5))}


.pile.клад .uc{position:static; translate:0; width:100%; height:100%;
  background:none; color:var(--lamp); overflow:visible; filter:none}
.pile.клад .uc > *{display:inline}   



.pile.клад .кам{transform-box:view-box; transform-origin:0 0;
  translate:var(--x) var(--y);
  transition:scale 300ms var(--ease-out), rotate 300ms var(--ease-out);
  transition-delay:calc(var(--c) * 22ms)}


@media (hover:hover){
  .ore:not(.spent):hover .pile.клад .uc{rotate:0deg; scale:1; filter:none}
  .ore:not(.spent):hover .pile.клад .кам{scale:1.08}
  .ore:not(.spent):hover .pile.клад .кам:nth-of-type(odd){rotate:-7deg}
  .ore:not(.spent):hover .pile.клад .кам:nth-of-type(even){rotate:7deg}
}

.ore:not(.spent):active .pile.клад .кам{scale:1; rotate:0deg;
  transition-duration:70ms; transition-delay:0ms}



.pile.клад.clink .uc,.pile.клад.unclink .uc,.pile.клад.wave .uc{animation:none}

.pile.клад.clink .кам{animation:подброс 600ms linear both;
  animation-delay:calc((var(--n) - 1 - var(--c)) * 26ms)}
.pile.клад.unclink .кам{animation:подброс 520ms linear both reverse;
  animation-delay:calc(var(--c) * 22ms)}
.pile.клад.wave .кам{animation:подброс 600ms linear both;
  animation-delay:calc(var(--d, 0) * 30ms + (var(--n) - 1 - var(--c)) * 26ms)}

@media (prefers-reduced-motion: reduce){
  .pile.клад .кам{animation:none !important; transition:none !important;
    scale:1; rotate:0deg}
}
@keyframes подброс{
  0%{transform:translate(calc(var(--o) * 0.00px),0.00px) rotate(calc(var(--k) * 0.0deg)) scale(1.0000,1.0000)}
  4%{transform:translate(calc(var(--o) * -0.23px),0.87px) rotate(calc(var(--k) * -9.0deg)) scale(1.0332,0.9602)}
  8%{transform:translate(calc(var(--o) * -0.43px),1.40px) rotate(calc(var(--k) * -18.3deg)) scale(1.0600,0.9300)}
  12%{transform:translate(calc(var(--o) * -0.23px),-0.02px) rotate(calc(var(--k) * -6.1deg)) scale(1.0306,0.9671)}
  16%{transform:translate(calc(var(--o) * 0.44px),-2.85px) rotate(calc(var(--k) * 30.8deg)) scale(0.9731,1.0410)}
  20%{transform:translate(calc(var(--o) * 1.35px),-6.01px) rotate(calc(var(--k) * 77.3deg)) scale(0.9400,1.1000)}
  24%{transform:translate(calc(var(--o) * 2.24px),-8.40px) rotate(calc(var(--k) * 118.0deg)) scale(0.9628,1.1234)}
  28%{transform:translate(calc(var(--o) * 2.92px),-9.91px) rotate(calc(var(--k) * 148.2deg)) scale(1.0193,1.1294)}
  32%{transform:translate(calc(var(--o) * 3.56px),-11.02px) rotate(calc(var(--k) * 174.8deg)) scale(1.0811,1.1258)}
  36%{transform:translate(calc(var(--o) * 4.10px),-11.50px) rotate(calc(var(--k) * 198.9deg)) scale(1.1200,1.1200)}
  40%{transform:translate(calc(var(--o) * 4.40px),-11.21px) rotate(calc(var(--k) * 222.0deg)) scale(1.1208,1.1159)}
  44%{transform:translate(calc(var(--o) * 4.37px),-10.25px) rotate(calc(var(--k) * 243.7deg)) scale(1.0976,1.1096)}
  48%{transform:translate(calc(var(--o) * 4.09px),-8.83px) rotate(calc(var(--k) * 263.5deg)) scale(1.0661,1.0974)}
  52%{transform:translate(calc(var(--o) * 3.66px),-7.03px) rotate(calc(var(--k) * 282.6deg)) scale(1.0417,1.0755)}
  56%{transform:translate(calc(var(--o) * 3.20px),-4.61px) rotate(calc(var(--k) * 302.0deg)) scale(1.0400,1.0400)}
  60%{transform:translate(calc(var(--o) * 2.66px),-2.10px) rotate(calc(var(--k) * 323.9deg)) scale(1.0751,0.9736)}
  64%{transform:translate(calc(var(--o) * 2.03px),0.13px) rotate(calc(var(--k) * 346.7deg)) scale(1.1226,0.8963)}
  68%{transform:translate(calc(var(--o) * 1.44px),1.80px) rotate(calc(var(--k) * 365.5deg)) scale(1.1400,0.8600)}
  72%{transform:translate(calc(var(--o) * 1.00px),0.24px) rotate(calc(var(--k) * 376.5deg)) scale(1.0945,0.9065)}
  76%{transform:translate(calc(var(--o) * 0.66px),-2.58px) rotate(calc(var(--k) * 381.3deg)) scale(1.0191,0.9941)}
  80%{transform:translate(calc(var(--o) * 0.40px),-2.92px) rotate(calc(var(--k) * 381.2deg)) scale(0.9700,1.0500)}
  84%{transform:translate(calc(var(--o) * 0.20px),-0.99px) rotate(calc(var(--k) * 375.4deg)) scale(0.9765,1.0369)}
  88%{transform:translate(calc(var(--o) * 0.09px),0.70px) rotate(calc(var(--k) * 368.0deg)) scale(1.0026,1.0007)}
  92%{transform:translate(calc(var(--o) * 0.07px),0.78px) rotate(calc(var(--k) * 359.7deg)) scale(1.0097,0.9893)}
  96%{transform:translate(calc(var(--o) * 0.06px),0.20px) rotate(calc(var(--k) * 357.3deg)) scale(0.9996,1.0004)}
  100%{transform:translate(calc(var(--o) * 0.00px),0.00px) rotate(calc(var(--k) * 360.0deg)) scale(1.0000,1.0000)}
}


.gcards{display:grid; grid-template-columns:1fr 1fr; gap:9px; margin-top:14px}
.gcard{position:relative; overflow:hidden; display:grid; align-content:end;
  min-height:126px; padding:12px; border-radius:var(--r-card); text-align:left;
  color:var(--cream); cursor:pointer;
  border:1px solid color-mix(in oklab, var(--g) 20%, var(--seam));
  background:
    
    radial-gradient(76% 62% at 50% 26%,
      color-mix(in oklab, var(--g) 26%, transparent) 0%, transparent 74%),
    linear-gradient(168deg, color-mix(in oklab, var(--cream) 7.5%, transparent) 0%,
    color-mix(in oklab, var(--cream) 3%, transparent) 100%),
    linear-gradient(168deg,
      color-mix(in oklab, var(--stone) 84%, transparent) 0%,
      color-mix(in oklab, var(--stone-deep) 90%, transparent) 100%);
  
  box-shadow:
    inset 0 1px 0 color-mix(in oklab, var(--cream) 14%, transparent),
    inset 0 -1px 0 rgba(0,0,0,.38),
    var(--sh-card);
  transition:scale var(--t-press) var(--ease-out),
             border-color var(--t-hover) var(--ease-out);
  
  opacity:0; translate:0 10px;
  animation:rise 300ms var(--ease-out) forwards;
  animation-delay:calc(var(--i, 0) * 24ms);
  contain:layout paint style}
.gcard.big{grid-column:1 / -1; min-height:140px; padding:14px;
  background:
    radial-gradient(58% 88% at 82% 50%,
      color-mix(in oklab, var(--g) 26%, transparent) 0%, transparent 72%),
    linear-gradient(168deg, color-mix(in oklab, var(--cream) 7.5%, transparent) 0%,
    color-mix(in oklab, var(--cream) 3%, transparent) 100%),
    linear-gradient(168deg,
      color-mix(in oklab, var(--stone) 84%, transparent) 0%,
      color-mix(in oklab, var(--stone-deep) 90%, transparent) 100%)}
.gcard:not(.soon):active{scale:.975; transition-duration:60ms}
.gcard.now{border-color:color-mix(in oklab, var(--g) 52%, transparent);
  box-shadow:
    inset 0 1px 0 color-mix(in oklab, var(--cream) 26%, transparent),
    inset 0 -1px 0 rgba(0,0,0,.38),
    0 12px 30px -14px color-mix(in oklab, var(--g) 40%, transparent)}



.gcard-art{position:absolute; top:8px; left:50%; translate:-50% 0;
  width:66px; height:66px; pointer-events:none; perspective:420px}
.gcard.big .gcard-art{width:118px; height:118px; left:auto; right:12px;
  top:50%; translate:0 -50%; perspective:700px}


.art3d{position:absolute; inset:0; transform-style:preserve-3d;
  will-change:transform}

.art3d img{position:absolute; inset:0; width:100%; height:100%;
  object-fit:contain; backface-visibility:hidden}
.art3d .изнанка{transform:rotateY(180deg)}



.вертушка{position:absolute; inset:calc((1 - var(--доля, 1)) * 50%) 0; overflow:hidden}

.art3d .лента{position:absolute; top:0; left:0; right:auto; bottom:auto;
  width:calc(var(--кол) * 100%); height:calc(var(--ряд) * 100%);
  object-fit:fill; will-change:transform}
@keyframes кадр-х{to{transform:translateX(-100%)}}
@keyframes кадр-у{to{translate:0 -100%}}


.объём .art3d{animation:парение-ровно 4.6s ease-in-out infinite alternate;
  
  animation-delay:calc(var(--i, 0) * 0.26s)}


.art3d{animation:оборот 7.5s cubic-bezier(.5,0,.5,1) infinite,
                 парение 4.6s ease-in-out infinite alternate}

.gcard-art,.art3d,.искра::before{animation-delay:calc(var(--i, 0) * 0.26s)}
.art3d{animation-delay:calc(var(--i, 0) * 0.26s), calc(var(--i, 0) * 0.26s)}


.искра{position:absolute; inset:0; overflow:hidden; pointer-events:none;
  backface-visibility:hidden; opacity:0}
@supports (mask-image: linear-gradient(#000, #000)) or
          (-webkit-mask-image: linear-gradient(#000, #000)){
  .искра{opacity:1;
    -webkit-mask:var(--m) center / contain no-repeat;
    mask:var(--m) center / contain no-repeat}
}

.искра::before{content:""; position:absolute; top:-45%; bottom:-45%;
  left:-70%; width:60%;
  background:linear-gradient(97deg, transparent 0%,
    color-mix(in oklab, var(--cream) 26%, transparent) 46%,
    color-mix(in oklab, var(--cream) 26%, transparent) 54%, transparent 100%);
  rotate:-14deg; will-change:transform;
  animation:блик 7.5s cubic-bezier(.5,0,.5,1) infinite}



.живой-блик .искра::before{
  animation:none; opacity:.68;
  transform:translateX(calc(150% + var(--наклон, 0) * 190%))}


.gcard[data-game="steam"] .искра,
.gcard[data-game="psn"] .искра,
.gcard[data-game="appstore"] .искра,
.gcard[data-game="gplay"] .искра{display:none}



@keyframes оборот{
  0%{transform:rotateY(0deg); animation-timing-function:linear}
  46%{transform:rotateY(0deg); animation-timing-function:cubic-bezier(.55,0,.3,1)}
  100%{transform:rotateY(360deg)}}

@keyframes парение{
  from{translate:0 4%; rotate:x -3deg}
  to{translate:0 -5%; rotate:x 3deg}}

@keyframes парение-ровно{
  from{transform:translate3d(0, 4%, 0)}
  to{transform:translate3d(0, -5%, 0)}}

@keyframes блик{
  0%,8%{transform:translateX(0)}
  30%{transform:translateX(360%)}
  100%{transform:translateX(360%)}}

.gcard-txt{display:grid; gap:2px; position:relative}
.gcard-txt b{font-size:var(--fs-base); font-weight:700; letter-spacing:-.015em;
  line-height:var(--lh-tight); text-wrap:balance}
.gcard.big .gcard-txt b{font-size:var(--fs-xl); letter-spacing:-.03em}

.gcard.big .gcard-txt{max-width:calc(100% - 116px)}
.gcard-txt u{font-size:var(--fs-sm); color:var(--sand); text-decoration:none;
  line-height:var(--lh-tight)}
.gcard.big .gcard-txt u{font-size:var(--fs-md)}


.gcard.soon{cursor:default}
.gcard.soon .gcard-txt b{color:var(--sand)}
.gcard.soon .gcard-art img{filter:saturate(.35) brightness(.92)
  drop-shadow(0 3px 6px rgba(0,0,0,.5)); opacity:.8}
.gcard .soon-pill{position:absolute; right:10px; bottom:11px}
.gcard.big .soon-pill{right:14px; bottom:14px}


@media (max-width:340px){
  .gcards{grid-template-columns:1fr}
  .gcard{min-height:104px}
  .gcard-art{width:58px; height:58px}
}
@media (prefers-reduced-motion: reduce){
  .gcard{opacity:1; translate:0 0; animation:none}
  .art3d{animation:none; transform:none}
  
  .искра{opacity:0}
}



.pill.big{padding:9px; border-radius:var(--r-in)}
.pill.big .ic{width:24px; height:24px}


.row h3 .cur{width:26px; height:26px; flex:none; margin:-4px 0;
  background:var(--cur-h, var(--cur, url("img/coin.webp?v=7ce42990"))) center / contain no-repeat;
  filter:drop-shadow(0 2px 3px rgba(0,0,0,.5))}


.home-head{display:grid; justify-items:center; gap:5px; text-align:center;
  padding:2px 0 4px}
.home-mark{width:46px; height:46px; color:var(--lamp);
  filter:drop-shadow(0 6px 14px rgba(0,0,0,.6))}
.home-head h2{margin:0; font-size:var(--fs-lg); font-weight:800; letter-spacing:.18em;
  text-transform:uppercase}
.home-head p{margin:0; color:var(--sand); font-size:var(--fs-md)}



.lobby{display:grid; grid-auto-flow:column; grid-auto-columns:1fr; gap:8px;
  margin:12px 0 2px}
.lob{position:relative; display:grid; justify-items:center; gap:5px;
  padding:12px 8px 11px; border-radius:var(--r-card); text-align:center;
  color:var(--cream); border:1px solid var(--seam);
  background:linear-gradient(168deg,
    color-mix(in oklab, var(--stone) 84%, transparent) 0%,
    color-mix(in oklab, var(--stone-deep) 90%, transparent) 100%);
  box-shadow:inset 0 1px 0 color-mix(in oklab, var(--cream) 12%, transparent);
  transition:scale var(--t-press) var(--ease-out)}
.lob:active{scale:.96}
.lob .ic{width:20px; height:20px; color:var(--sand)}
.lob b{font-size:var(--fs-sm); font-weight:650; line-height:var(--lh-tight); text-wrap:balance}


.lob.gold{border-color:color-mix(in oklab, var(--lamp) 34%, transparent);
  background:linear-gradient(168deg,
    color-mix(in oklab, var(--lamp) 16%, transparent) 0%,
    color-mix(in oklab, var(--deep) 62%, transparent) 100%);
  box-shadow:inset 0 1px 0 color-mix(in oklab, var(--cream) 26%, transparent),
             0 10px 24px -16px color-mix(in oklab, var(--lamp) 60%, transparent)}
.lob.gold .ic{color:var(--lamp)}


.lob .menu-tag{position:absolute; top:6px; right:7px}


.home-brand{display:block; font-size:var(--fs-cap); font-weight:700; letter-spacing:.2em;
  text-transform:uppercase; color:var(--sand-dim)}
.home-head h2{margin:0; font-size:var(--fs-xl); font-weight:800; letter-spacing:-.02em}


.say.кому.есть{color:var(--ore)}
.say.кому.нет{color:var(--lamp)}


.howto{margin:2px 0 12px; padding:10px 12px; border-radius:var(--r-card);
  font-size:var(--fs-sm); line-height:var(--lh-text); color:var(--sand);
  border:1px solid var(--seam);
  background:color-mix(in oklab, var(--stone) 70%, transparent)}


.pill{height:32px; padding:0 12px}
.pill.big{height:42px; padding:0 12px 0 10px; gap:7px}
.pill.big span{font-size:var(--fs-sm); font-weight:700}




.screen[data-screen="order"]::before{content:""; position:fixed; inset:0;
  z-index:-1; pointer-events:none;
  background:linear-gradient(180deg, var(--rock) 0%, var(--deep) 100%)}


.screen[data-screen="order"] .back{background:var(--stone);
  border-color:var(--seam)}
.screen[data-screen="order"] .back:active{background:var(--stone-2)}


.screen[data-screen="order"] .order-head{margin:2px 0 12px}
.screen[data-screen="order"] .order-head h2{margin:0; font-size:var(--fs-xl);
  font-weight:800; letter-spacing:-.02em}
.screen[data-screen="order"] .order-head p{margin:4px 0 0; font-size:var(--fs-sm);
  color:var(--sand-dim)}


.screen[data-screen="order"] .cart-lines{gap:8px; margin-top:0}
.screen[data-screen="order"] .cart-line{padding:12px 13px; border-radius:var(--r-card);
  border:1px solid var(--seam); background:var(--stone)}
.screen[data-screen="order"] .cart-line .sum{color:var(--cream);
  font-weight:600}
.screen[data-screen="order"] .stepper button{color:var(--cream);
  border-color:var(--seam-2); background:var(--stone-2)}


.screen[data-screen="order"] .panel{margin:14px 0 20px; padding:15px 16px;
  border:1px solid var(--seam-2); border-radius:var(--r-card);
  background:var(--stone-deep)}
.screen[data-screen="order"] .line{padding:6px 0}
.screen[data-screen="order"] .line dt{color:var(--sand)}

.screen[data-screen="order"] .line.cut dd{color:var(--ore); font-weight:600}

.screen[data-screen="order"] .line:not(.hidden) + .line{background:none;
  margin-top:6px; padding-top:12px; border-top:1px solid var(--seam)}
.screen[data-screen="order"] .line.pay{align-items:center}
.screen[data-screen="order"] .line.pay dt{font-size:var(--fs-base); color:var(--sand)}
.screen[data-screen="order"] .line.pay dd{font-size:var(--fs-xxl); font-weight:800;
  color:var(--cream); letter-spacing:-.03em}


.screen[data-screen="order"] .field{margin-bottom:14px}
.screen[data-screen="order"] .field label{color:var(--sand); margin-bottom:7px}
.screen[data-screen="order"] .field input{border-radius:var(--r-in);
  background:var(--stone-deep); border:1px solid var(--seam-2);
  box-shadow:none}
.screen[data-screen="order"] .field input:hover{background:var(--stone-deep)}
.screen[data-screen="order"] .field input:focus{background:var(--stone-deep);
  border-color:var(--fo-line); box-shadow:var(--fo-ring)}
.screen[data-screen="order"] .field input.bad,
.screen[data-screen="order"] .field input.wrong{border-color:var(--rust);
  box-shadow:0 0 0 3px color-mix(in oklab, var(--rust) 18%, transparent)}

.screen[data-screen="order"] .field input:-webkit-autofill,
.screen[data-screen="order"] .field input:-webkit-autofill:focus{
  -webkit-box-shadow:0 0 0 100px var(--stone-deep) inset}


.game-box + .game-box{margin-top:18px; padding-top:16px;
  border-top:1px solid var(--seam)}
.game-name{margin-bottom:10px; font-size:var(--fs-sm); font-weight:700;
  letter-spacing:.06em; text-transform:uppercase; color:var(--sand-dim)}


.screen[data-screen="order"] .game-warn{
  background:color-mix(in oklab, var(--lamp) 9%, var(--stone-deep));
  border-color:color-mix(in oklab, var(--lamp) 30%, transparent)}
.screen[data-screen="order"] .howto{background:var(--stone);
  border-color:var(--seam)}


.screen[data-screen="order"] .act{margin-top:14px; padding:16px;
  border-radius:var(--r-in); font-size:var(--fs-base)}


.dock{padding:10px 14px calc(12px + env(safe-area-inset-bottom));
  background:var(--deep); border-top:1px solid var(--seam);
  backdrop-filter:none; -webkit-backdrop-filter:none}
.dock-in{gap:12px; padding:0; border:0; border-radius:0;
  background:none; box-shadow:none}

.dock-sum b{font-size:var(--fs-lg); color:var(--cream)}

.dock-sum > span{color:var(--sand-dim)}
.dock .act{padding:12px 18px; border-radius:var(--r-in)}


.своя{grid-column:1 / -1; min-width:0; display:grid; gap:7px; padding:12px 13px;
  border-radius:var(--r-card); border:1px solid var(--seam-2);
  background:linear-gradient(168deg, var(--stone) 0%, var(--stone-deep) 100%);
  box-shadow:inset 0 1px 0 color-mix(in oklab, var(--cream) 10%, transparent)}
.своя label{font-size:var(--fs-sm); font-weight:650; color:var(--sand)}

.своя-строка{display:flex; gap:8px; min-width:0}

.своя input{flex:1; min-width:0; width:0; padding:10px 12px; border-radius:var(--r-in);
  font:inherit; font-size:var(--fs-field); color:var(--cream);
  border:1px solid var(--seam-2); background:var(--deep)}
.своя input:focus{outline:none; border-color:var(--fo-line); box-shadow:var(--fo-ring)}
.своя .take{flex:none; padding:0 16px; height:auto; border-radius:var(--r-in);
  font-size:var(--fs-sm)}
.своя .say{font-size:var(--fs-sm)}
.своя .say.есть{color:var(--cream)}
.своя .say.есть b{color:var(--lamp)}
.своя .say.нет{color:var(--rust)}

.своя .разбор{display:block; margin-top:2px; font-size:var(--fs-cap); color:var(--sand-dim)}


.ямоя{display:grid; gap:7px; margin-bottom:12px; padding:12px 13px;
  border-radius:var(--r-card);
  border:1px solid color-mix(in oklab, var(--ore) 30%, transparent);
  background:linear-gradient(168deg,
    color-mix(in oklab, var(--ore) 12%, transparent) 0%,
    color-mix(in oklab, var(--deep) 60%, transparent) 100%)}
.ямоя-имя{display:flex; align-items:center; gap:7px}
.ямоя-имя .ic{width:16px; height:16px; color:var(--ore)}
.ямоя-имя b{font-size:var(--fs-base); letter-spacing:-.01em}
.ямоя span{font-size:var(--fs-sm); color:var(--sand); line-height:var(--lh-text)}
.ямоя-строка{display:flex; align-items:center; gap:10px; flex-wrap:wrap;
  margin-top:2px}
.ямоя-кн{padding:7px 12px; border-radius:var(--r-pill); font-size:var(--fs-sm); font-weight:650;
  color:var(--cream); border:1px solid var(--seam-2); background:var(--stone)}
.ямоя-кн:active{scale:.96}
.ямоя-ид{font-size:var(--fs-sm); color:var(--sand-dim)}


.где{display:flex; align-items:baseline; gap:8px; padding:14px 2px 2px;
  flex-wrap:wrap}
.где b{font-size:var(--fs-lg); font-weight:800; letter-spacing:-.02em; color:var(--cream)}
.где span{font-size:var(--fs-sm); color:var(--sand)}


.gcard.жмём{scale:.965; border-color:color-mix(in oklab, var(--g) 60%, transparent)}





.screen.show{animation:screen-in 170ms var(--ease-out) both}
@keyframes screen-in{from{opacity:0; translate:0 6px}}


.screen[data-screen="order"].show{animation-name:screen-fade}
@keyframes screen-fade{from{opacity:0}}



.dock{transform:translateY(0);
  transition:transform 280ms var(--ease-drawer), visibility 0s}
.dock.away{transform:translateY(115%); visibility:hidden;
  transition:transform 280ms var(--ease-drawer), visibility 0s linear 280ms}



.зн-цифра{display:inline-block; overflow:hidden; vertical-align:bottom}
.зн-цифра.кат.вверх{animation:разряд-вверх 260ms var(--ease-out) both}
.зн-цифра.кат.вниз{animation:разряд-вниз 260ms var(--ease-out) both}
@keyframes разряд-вверх{from{opacity:0; translate:0 90%}}
@keyframes разряд-вниз{from{opacity:0; translate:0 -90%}}



.tab-pill{position:absolute; left:0; top:0; border-radius:var(--r-pill);
  background:var(--metal); pointer-events:none; z-index:0;
  transition:transform 260ms var(--ease-in-out), width 260ms var(--ease-in-out)}
.tab{position:relative; z-index:1}
.tab.on{background:transparent}



.ежели{margin:0}
.ежели summary{cursor:pointer; list-style:none; display:inline-flex; gap:6px;
  align-items:center; font-size:var(--fs-sm); color:var(--sand-dim);
  text-decoration:underline; text-underline-offset:3px;
  text-decoration-color:color-mix(in oklab, var(--sand-dim) 45%, transparent)}
.ежели summary::-webkit-details-marker{display:none}
.ежели summary::after{content:"›"; display:inline-block; font-size:15px;
  line-height:1; transition:rotate 160ms var(--ease-out)}
.ежели[open] summary::after{rotate:90deg}
.ежели summary:hover{color:var(--cream)}
.ежели > div{margin-top:7px}



.обещание{display:flex; align-items:center; justify-content:space-between;
  gap:10px; margin-top:9px; padding-top:9px;
  border-top:1px solid color-mix(in oklab, var(--seam) 70%, transparent);
  font-size:var(--fs-sm)}
.обещание .когда{display:inline-flex; align-items:center; gap:6px;
  color:var(--sand); min-width:0}
.обещание .когда .ic{width:14px; height:14px; flex:none; color:var(--ore)}
.обещание .кому{flex:none; color:var(--lamp); text-decoration:underline;
  text-underline-offset:3px}
.обещание .кому[hidden]{display:none}
.обещание .кому:hover{color:var(--lamp-hi)}



.строка-регион{display:flex; align-items:baseline; gap:8px; flex-wrap:wrap;
  margin:2px 0 12px; font-size:var(--fs-sm); color:var(--sand-dim);
  line-height:var(--lh-text)}
.строка-регион[hidden]{display:none}
.строка-регион button{padding:0; border:0; background:none; cursor:pointer;
  font:inherit; color:var(--lamp); text-decoration:underline;
  text-underline-offset:3px}
.строка-регион button:hover{color:var(--lamp-hi)}





.home-о{margin:8px auto 0; max-width:30ch; text-align:center;
  font-size:var(--fs-md); color:var(--sand); line-height:var(--lh-text)}
.home-о:empty{display:none}
.home-vows{margin-top:14px}



.ore .выгода{display:flex; align-items:baseline; justify-content:center;
  gap:7px; margin-top:1px; line-height:1.15}
.ore .выгода s{font-size:var(--fs-cap); color:var(--sand-dim);
  text-decoration-thickness:1px}
.ore .выгода b{font-size:var(--fs-cap); font-weight:700; color:var(--ore)}



.ошибка-поля{margin-top:5px; font-size:var(--fs-sm); color:var(--rust);
  line-height:var(--lh-text)}
.ошибка-поля[hidden]{display:none}



.откуда-цена{margin:10px 0 0; font-size:var(--fs-cap); color:var(--sand-dim);
  text-align:center}
.откуда-цена[hidden]{display:none}





.home-vows{flex-wrap:wrap}
.лоб-уровни{flex:1 1 100%; padding:13px 12px; border-radius:var(--r-card);
  text-align:left; cursor:pointer; position:relative;
  border:1px solid color-mix(in oklab, var(--lamp) 30%, transparent);
  background:color-mix(in oklab, var(--lamp) 9%, transparent)}
.лоб-уровни .ic{color:var(--lamp); width:17px; height:17px; margin-bottom:8px;
  display:block}
.лоб-уровни b{display:block; font-size:var(--fs-md); font-weight:700;
  color:var(--cream)}
.лоб-уровни > span{display:block; font-size:var(--fs-sm); color:var(--sand-dim)}
.лоб-уровни:hover{background:color-mix(in oklab, var(--lamp) 14%, transparent)}
.home-vows div{flex:1 1 0; min-width:0}

@media (min-width:560px){
  
  html:not([data-телефон]) .лоб-уровни{flex:1 1 0}
}


.лоб-уровни{padding-right:46px;
  border-color:color-mix(in oklab, var(--lamp) 55%, transparent);
  background:linear-gradient(180deg, color-mix(in oklab, var(--lamp) 16%, transparent),
    color-mix(in oklab, var(--lamp) 7%, transparent));
  box-shadow:inset 0 1px 0 color-mix(in oklab, var(--cream) 18%, transparent),
    inset 0 -2px 0 rgba(0,0,0,.3), 0 10px 22px -14px var(--lamp);
  transition:scale var(--t-press) var(--ease-out)}
.лоб-уровни:active{scale:.97}
.лоб-шеврон{position:absolute; right:18px; top:50%; width:10px; height:10px; margin-top:-5px;
  border:solid var(--lamp); border-width:0 2.5px 2.5px 0; border-radius:0 1px 2px 1px;
  rotate:-45deg; pointer-events:none; transition:translate var(--t-press) var(--ease-out)}
.лоб-уровни:active .лоб-шеврон{translate:3px 0}

.лоб-уровни > .лоб-лесенка{display:none}
.home-vows > div{display:grid; grid-template-columns:auto minmax(0, 1fr); column-gap:10px;
  align-items:center; padding:6px 2px; text-align:left;
  border-color:transparent; box-shadow:none;
  
  background:radial-gradient(closest-side, rgba(0,0,0,.42), rgba(0,0,0,.22) 55%, transparent);
  text-shadow:0 1px 6px rgba(0,0,0,.65)}
.home-vows > div .ic{grid-row:1 / span 2; width:22px; height:22px; margin:0}
.home-vows > div b,
.home-vows > div span{grid-column:2}
@media (prefers-reduced-motion: reduce){
  .лоб-уровни,.лоб-шеврон{transition:none}
}



.ore .сложение{display:block; margin-top:1px; font-size:var(--fs-cap);
  color:var(--sand-dim); line-height:1.2}

.ore .впервые{display:block; margin-top:1px; font-size:var(--fs-cap);
  color:var(--lamp); line-height:1.2}




.grid .ore:not(.item){display:flex; flex-direction:column; height:100%;
  overflow:hidden}
.grid .ore:not(.item) > .take{margin-top:auto}
.grid .ore .line1 b{overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
  display:block; max-width:100%}

.grid .ore.item{overflow:hidden}
.grid .ore.item > *{max-width:100%}
.grid .ore.item .take{width:auto}

@media (prefers-reduced-motion:reduce){
  
  .screen.show, .screen[data-screen="order"].show{animation:none}
  
  .gcard-art,.art3d,.искра::before{animation:none}
  .накрыльцо{transition:none}
  .наэкран{transition:none}
  .ежели summary::after{transition:none}
  .dock, .tab-pill{transition:none}
  .dock.away{visibility:hidden; transition:none}
  .зн-цифра.кат.вверх, .зн-цифра.кат.вниз{animation:none}
}


.замок{grid-column:1/-1; display:grid; justify-items:center; gap:12px;
  padding:30px 20px 26px; border-radius:var(--r-card); text-align:center;
  border:1px solid var(--seam); background:color-mix(in oklab, var(--stone) 72%, transparent);
  backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px)}
.замок .ic{width:30px; height:30px; color:var(--lamp)}
.замок b{font-size:var(--fs-lg); letter-spacing:-.01em}
.замок p{margin:0; max-width:34ch; font-size:var(--fs-md); line-height:var(--lh-text);
  color:var(--sand-dim); text-wrap:pretty}
.замок .act{width:auto; padding:12px 20px; text-decoration:none}
.замок-сноска{max-width:34ch; font-size:var(--fs-sm); line-height:var(--lh-text);
  color:var(--sand-dim); opacity:.8}


#gameWarn b, #gameRedeem b{display:block; margin:8px 0 2px; font-size:var(--fs-sm);
  letter-spacing:.04em; text-transform:uppercase; color:var(--lamp)}
#gameWarn b:first-child, #gameRedeem b:first-child{margin-top:0}
#gameWarn span, #gameRedeem span{display:block}
#gameWarn a{color:inherit; font-weight:600; text-decoration:underline; text-underline-offset:2px}


html, body{touch-action:manipulation; -webkit-text-size-adjust:100%}


.field label .чья{color:var(--lamp-hi); font-weight:800; letter-spacing:.01em;
  white-space:nowrap}

.game-name{color:var(--lamp-hi); font-weight:800; letter-spacing:.05em;
  text-transform:uppercase; font-size:var(--fs-sm); margin:16px 0 8px}
.game-box:first-child .game-name{margin-top:4px}



.регионы[hidden]{display:none}
.регионы{position:fixed; inset:0; z-index:120; display:flex; flex-direction:column;
  background:var(--deep); animation:регионы-в 220ms var(--ease-out)}
@keyframes регионы-в{from{opacity:0; translate:0 10px}}
.регионы-верх{display:flex; align-items:center; gap:12px; flex:none;
  padding:calc(10px + env(safe-area-inset-top)) 16px 10px;
  border-bottom:1px solid var(--seam)}
.регионы-верх b{font-size:var(--fs-lg)}
.назад{width:34px; height:34px; flex:none; border-radius:var(--r-in); font-size:var(--fs-base);
  color:var(--sand); border:1px solid var(--seam); background:rgba(0,0,0,.25)}
.регионы-поиск{flex:none; padding:12px 16px 8px}

.регионы-поиск input{width:100%; padding:13px 14px; border-radius:var(--r-in);
  font:var(--fs-field)/var(--lh-text) var(--font); color:var(--sand); border:1px solid var(--seam);
  background:rgba(0,0,0,.3)}
.регионы-поиск input::placeholder{color:var(--sand-dim)}

.регионы-список{flex:1; overflow-y:auto; padding:4px 16px
  calc(18px + env(safe-area-inset-bottom)); display:grid; gap:7px;
  align-content:start; grid-auto-rows:max-content}
.регион{display:flex; align-items:center; gap:12px; width:100%; padding:11px 13px;
  border-radius:var(--r-card); text-align:left; color:var(--sand);
  border:1px solid var(--seam); background:color-mix(in oklab, var(--cream) 5%, transparent)}
.регион img{width:26px; height:26px; flex:none; object-fit:contain}
.регион i{width:26px; height:26px; flex:none}
.регион b{flex:1; font-size:var(--fs-base); font-weight:600}

.регион u{flex:none; font-size:var(--fs-sm); letter-spacing:.08em; text-decoration:none;
  color:var(--sand-dim); font-variant-numeric:tabular-nums}
.регион.on{border-color:transparent; color:var(--on-lamp); background:var(--metal)}
.регион.on u{color:rgba(0,0,0,.55)}
.регион:not(.on):active{background:color-mix(in oklab, var(--lamp) 12%, transparent)}


.pic-своя{display:block; width:100%; height:100%;
  background:var(--cur) center / contain no-repeat}


[data-brand-title],
.home-brand,
.home-head h2,
.about-head h2,
.screen[data-screen="order"] .order-head h2,
.screen[data-screen="order"] .line.pay dd,
.plita-uc,
.dock-sum b,
.где b,
.vip-now b,
#digTitle{font-family:var(--font-display)}


.накрыльцо{position:fixed; left:12px; right:12px; bottom:calc(12px + var(--док, 0px));
  
  z-index:59; display:flex; align-items:center; gap:11px;
  padding:10px 12px; border-radius:var(--r-card);
  background:color-mix(in oklab, var(--stone) 92%, transparent);
  border:1px solid color-mix(in oklab, var(--lamp) 22%, transparent);
  box-shadow:var(--sh-lift); backdrop-filter:blur(10px);
  translate:0 130%; opacity:0;
  transition:translate 320ms var(--ease-out), opacity 240ms var(--ease-out)}
.накрыльцо[hidden]{display:none}
.накрыльцо.видно{translate:0 0; opacity:1}
.накрыльцо-знак{width:34px; height:34px; flex:none; color:var(--lamp)}
.накрыльцо-текст{flex:1; min-width:0; line-height:var(--lh-tight)}
.накрыльцо-текст b{display:block; font-size:var(--fs-md); font-weight:700;
  color:var(--cream); overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.накрыльцо-текст span{display:block; margin-top:2px; font-size:var(--fs-cap);
  color:var(--sand-dim)}
.накрыльцо-да{flex:none; padding:9px 14px; border-radius:var(--r-in);
  font-size:var(--fs-md); font-weight:700; color:var(--on-lamp);
  background:var(--metal); border:0;
  box-shadow:inset 0 1px 0 color-mix(in oklab, #fff 40%, transparent)}
.накрыльцо-да[hidden]{display:none}
.накрыльцо-нет{flex:none; width:30px; height:30px; border-radius:50%; border:0;
  font-size:19px; line-height:1; color:var(--sand-dim);
  background:color-mix(in oklab, var(--cream) 7%, transparent)}
.накрыльцо-нет:hover{color:var(--cream)}


.наэкран{position:fixed; left:12px; right:12px;
  bottom:calc(12px + env(safe-area-inset-bottom)); z-index:70;
  translate:0 120%; opacity:0;
  transition:translate 340ms var(--ease-out), opacity 240ms var(--ease-out)}
.наэкран[hidden]{display:none}
.наэкран.видно{translate:0 0; opacity:1}
.наэкран-лист{position:relative; display:grid; gap:10px; padding:16px 16px 14px;
  border-radius:var(--r-card); background:color-mix(in oklab, var(--stone) 96%, transparent);
  border:1px solid color-mix(in oklab, var(--lamp) 26%, transparent); box-shadow:var(--sh-lift)}
.наэкран-закрыть{position:absolute; top:8px; right:8px; width:30px; height:30px;
  border-radius:50%; border:0; font-size:19px; line-height:1; color:var(--sand-dim);
  background:color-mix(in oklab, var(--cream) 7%, transparent)}
.наэкран-голова{display:flex; align-items:center; gap:12px; padding-right:34px}
.наэкран-значок{width:46px; height:46px; flex:none; border-radius:11px;
  box-shadow:0 4px 14px rgba(0,0,0,.45)}
.наэкран-что{font-size:var(--fs-lg); font-weight:800; color:var(--cream);
  line-height:var(--lh-tight)}
.наэкран-зачем{margin:0; font-size:var(--fs-md); color:var(--sand); line-height:var(--lh-text)}
.наэкран-шаги{margin:0; padding:0 0 0 22px; display:grid; gap:6px;
  font-size:var(--fs-md); color:var(--cream); line-height:var(--lh-text)}
.наэкран-шаги li::marker{color:var(--lamp); font-weight:800}
.наэкран-поделиться{width:18px; height:18px; vertical-align:-3px; color:var(--lamp)}
.наэкран-кнопки{display:flex; gap:8px; margin-top:2px}
.наэкран-да{flex:1; padding:12px 14px; border-radius:var(--r-in); border:0;
  font-size:var(--fs-md); font-weight:800; color:var(--on-lamp); background:var(--metal);
  box-shadow:inset 0 1px 0 color-mix(in oklab, #fff 40%, transparent)}
.наэкран-нет{flex:none; padding:12px 12px; border-radius:var(--r-in);
  font-size:var(--fs-sm); color:var(--sand-dim); background:transparent;
  border:1px solid color-mix(in oklab, var(--cream) 12%, transparent)}

@media (min-width:744px){
  html:not([data-телефон]) .наэкран,
  html[data-телефон] .наэкран{left:50%; right:auto; width:min(440px, calc(100vw - 32px));
    translate:-50% 120%; bottom:calc(104px + env(safe-area-inset-bottom))}
  html:not([data-телефон]) .наэкран.видно,
  html[data-телефон] .наэкран.видно{translate:-50% 0}
}
@media (min-width:1100px){
  html:not([data-телефон]) .наэкран{left:24px; width:400px; translate:0 120%; bottom:24px}
  html:not([data-телефон]) .наэкран.видно{translate:0 0}
}


@media (max-width:380px){
  .накрыльцо{gap:9px; padding:9px 10px}
  .накрыльцо-текст span{display:none}
  .накрыльцо-знак{width:28px; height:28px}
}






.hero-art,.banner-art{position:relative; margin:0 -16px; overflow:hidden;
  -webkit-tap-highlight-color:transparent}
.hero-art:empty,.banner-art:empty{display:none}
.арт{display:block; width:100%; height:100%}

.hero-art{height:min(300px, 80vw)}

.banner-art{height:clamp(72px, 29.9vw, 112px); max-height:15vh; max-height:15svh}


.hero-art:not(:empty) + .home-head{position:relative; z-index:1; margin-top:-64px}
.hero-art:not(:empty) + .home-head .home-mark{display:none}

[data-screen="home"] > .back{position:relative; z-index:2}
[data-screen="home"] > .back:not([hidden]) + .hero-art:not(:empty){margin-top:-58px}


.hero-kicker{display:block; font:700 var(--fs-cap)/1.2 var(--font-display);
  letter-spacing:.24em; text-transform:uppercase; color:var(--lamp)}
.hero-kicker:empty{display:none}
.hero-note{margin:2px auto 0; max-width:32ch; font-size:var(--fs-sm);
  line-height:var(--lh-text); color:var(--sand-dim); text-wrap:balance}
.hero-note:empty{display:none}




.home-слово{display:block; width:auto; height:30px; max-width:min(300px, 84vw);
  color:var(--cream); overflow:visible}
.logo .слово{flex:0 1 auto; min-width:0; width:auto; height:15px; max-width:136px;
  color:var(--cream); overflow:visible}
.logo .слово ~ svg{display:none}

.logo:has(> .слово){overflow:visible}
.logo .слово ~ b,.home-слово ~ .home-brand{position:absolute; width:1px; height:1px;
  overflow:hidden; clip-path:inset(50%); white-space:nowrap}




.арт .hx-glow{animation:hx-glow 3.2s ease-in-out infinite alternate}
@keyframes hx-glow{from{opacity:.55} to{opacity:1}}

.арт .hx-blink{transform-box:fill-box; transform-origin:center;
  animation:hx-blink 5.5s linear infinite}
@keyframes hx-blink{0%,97.4%{transform:scale(1,1)} 98.7%{transform:scale(1,.08)} 100%{transform:scale(1,1)}}
.арт .hx-float{animation:hx-float 6s ease-in-out infinite alternate}
@keyframes hx-float{from{transform:translate(0,0)} to{transform:translate(0,-4px)}}

.арт .hx-sway{transform-box:fill-box; transform-origin:50% 100%;
  animation:hx-sway 7s ease-in-out infinite alternate}
@keyframes hx-sway{from{transform:rotate(-1.5deg)} to{transform:rotate(1.5deg)}}

.арт .hx-ember{transform-box:fill-box; transform-origin:center; opacity:0;
  animation:hx-ember calc(4s + min(var(--i, 0), 8) * .375s) ease-out infinite;
  animation-delay:calc(var(--i, 0) * -.83s)}
@keyframes hx-ember{0%{transform:translate(0,0); opacity:0} 15%{opacity:1} 70%{opacity:.7}
  100%{transform:translate(0,-40px); opacity:0}}

.арт .hx-glint{animation:hx-glint 7.5s cubic-bezier(.5,0,.5,1) infinite}
@keyframes hx-glint{0%{transform:translateX(calc(var(--glint, 240) * -.5px)); opacity:0}
  5%{opacity:1} 22%{transform:translateX(calc(var(--glint, 240) * .5px)); opacity:0}
  100%{transform:translateX(calc(var(--glint, 240) * .5px)); opacity:0}}

.арт .hx-look{translate:calc(var(--lx, 0) * var(--look, 4) * 1px)
  calc(var(--ly, 0) * var(--look, 4) * 1px)}
.арт .hx-depth1{translate:calc(var(--lx, 0) * 2px) calc(var(--ly, 0) * 2px)}
.арт .hx-depth2{translate:calc(var(--lx, 0) * 5px) calc(var(--ly, 0) * 5px)}
.арт .hx-depth3{translate:calc(var(--lx, 0) * 9px) calc(var(--ly, 0) * 9px)}

.hx-стоп .арт *{animation-play-state:paused}

.hx-ура .hx-glow{animation:hx-вспых 1.1s var(--ease-out) 2}
@keyframes hx-вспых{0%{opacity:.6} 30%{opacity:1} 100%{opacity:.85}}
.hx-ура .hx-blink{animation:hx-мырг 1.1s linear 2}
@keyframes hx-мырг{0%,30%,46%,100%{transform:scale(1,1)} 38%{transform:scale(1,.1)} 54%{transform:scale(1,.1)} 62%{transform:scale(1,1)}}



.fx{position:absolute; inset:0; overflow:hidden; pointer-events:none; container-type:size}

.fx + .арт{position:relative}
.fx-фон{position:absolute; inset:0}

.fx-сцена{position:absolute; left:50%; top:50%; width:100%;
  width:max(100cqw, calc(100cqh * var(--fx-доля, 1.25))); aspect-ratio:var(--fx-доля, 1.25);
  translate:-50% -50%}
.fx-стая,.fx-светы{position:absolute; inset:0}


.fx-свет,.fx-ура{position:absolute; aspect-ratio:1; translate:-50% -50%; border-radius:50%;
  background:radial-gradient(closest-side, var(--ц), transparent)}
.fx-светы.м1{animation:fx-мерцание-1 2.7s ease-in-out infinite}
.fx-светы.м2{animation:fx-мерцание-2 2.7s ease-in-out infinite}
.fx-светы.м3{animation:fx-мерцание-3 2.7s ease-in-out infinite}
@keyframes fx-мерцание-1{0%,100%{opacity:1} 14%{opacity:.93} 29%{opacity:.98} 43%{opacity:.9}
  61%{opacity:.97} 77%{opacity:.92} 90%{opacity:.99}}
@keyframes fx-мерцание-2{0%,100%{opacity:1} 14%{opacity:.84} 29%{opacity:.96} 43%{opacity:.78}
  61%{opacity:.93} 77%{opacity:.81} 90%{opacity:.97}}
@keyframes fx-мерцание-3{0%,100%{opacity:1} 14%{opacity:.72} 29%{opacity:.94} 43%{opacity:.6}
  61%{opacity:.88} 77%{opacity:.66} 90%{opacity:.96}}


.fx-окно{position:absolute; overflow:hidden; transform-origin:50% 100%}
.fx-окно.зеркало{scale:-1 1}
.fx-лента{position:absolute; top:0; left:0; max-width:none;
  width:calc(var(--кол) * 100%); height:calc(var(--ряд) * 100%);
  animation-name:fx-кадр-х, fx-кадр-у; animation-iteration-count:infinite;
  transition:opacity .6s var(--ease-out)}
@keyframes fx-кадр-х{to{transform:translateX(-100%)}}
@keyframes fx-кадр-у{to{translate:0 -100%}}

.fx-ждём .fx-лента:not(.есть){opacity:0}


.fx-клуб-место{position:absolute}
.fx-клуб{display:block; width:100%; opacity:0; background-repeat:no-repeat;
  animation-timing-function:cubic-bezier(.33,.4,.6,1); animation-iteration-count:infinite}
.fx-клуб.влево{animation-name:fx-клуб-влево}
.fx-клуб.вверх{animation-name:fx-клуб-вверх}
.fx-клуб.вправо{animation-name:fx-клуб-вправо}
@keyframes fx-клуб-влево{0%{transform:translate(0,0) scale(.8) rotate(0deg); opacity:0} 22%{opacity:1}
  68%{opacity:.85} 100%{transform:translate(-16%,-78%) scale(1.45) rotate(-9deg); opacity:0}}
@keyframes fx-клуб-вверх{0%{transform:translate(0,0) scale(.8) rotate(0deg); opacity:0} 22%{opacity:1}
  68%{opacity:.85} 100%{transform:translate(0,-85%) scale(1.4) rotate(4deg); opacity:0}}
@keyframes fx-клуб-вправо{0%{transform:translate(0,0) scale(.8) rotate(0deg); opacity:0} 22%{opacity:1}
  68%{opacity:.85} 100%{transform:translate(16%,-78%) scale(1.45) rotate(9deg); opacity:0}}


.fx-искра,.fx-пепел{position:absolute; aspect-ratio:1; opacity:0;
  background-image:var(--fx-лист); background-repeat:no-repeat;
  animation-timing-function:linear; animation-iteration-count:infinite}
.fx-искра.и1{animation-name:fx-и1} .fx-искра.и2{animation-name:fx-и2} .fx-искра.и3{animation-name:fx-и3}
.fx-искра.и4{animation-name:fx-и4} .fx-искра.и5{animation-name:fx-и5} .fx-искра.и6{animation-name:fx-и6}
.fx-пепел.п1{animation-name:fx-п1} .fx-пепел.п2{animation-name:fx-п2}
.fx-пепел.п3{animation-name:fx-п3} .fx-пепел.п4{animation-name:fx-п4}
@keyframes fx-и1{0%{transform:translate(0%,0%) scale(0.5); opacity:0} 10%{transform:translate(22%,-218%) scale(1); opacity:1} 20%{transform:translate(28%,-424%) scale(0.9); opacity:1} 30%{transform:translate(-23%,-616%) scale(0.9); opacity:1} 40%{transform:translate(-39%,-793%) scale(0.8); opacity:1} 50%{transform:translate(5%,-955%) scale(0.7); opacity:1} 60%{transform:translate(49%,-1100%) scale(0.6); opacity:1} 70%{transform:translate(33%,-1226%) scale(0.6); opacity:0.8} 80%{transform:translate(-18%,-1330%) scale(0.5); opacity:0.5} 90%{transform:translate(-34%,-1409%) scale(0.4); opacity:0.2} 100%{transform:translate(10%,-1450%) scale(0.3); opacity:0}}
@keyframes fx-и2{0%{transform:translate(0%,0%) scale(0.5); opacity:0} 10%{transform:translate(-13%,-208%) scale(1); opacity:1} 20%{transform:translate(-44%,-404%) scale(0.9); opacity:1} 30%{transform:translate(-91%,-586%) scale(0.9); opacity:1} 40%{transform:translate(-125%,-755%) scale(0.8); opacity:1} 50%{transform:translate(-139%,-909%) scale(0.7); opacity:1} 60%{transform:translate(-141%,-1047%) scale(0.6); opacity:1} 70%{transform:translate(-151%,-1166%) scale(0.6); opacity:0.8} 80%{transform:translate(-181%,-1266%) scale(0.5); opacity:0.5} 90%{transform:translate(-226%,-1341%) scale(0.4); opacity:0.2} 100%{transform:translate(-271%,-1380%) scale(0.3); opacity:0}}
@keyframes fx-и3{0%{transform:translate(0%,0%) scale(0.5); opacity:0} 10%{transform:translate(25%,-208%) scale(1); opacity:1} 20%{transform:translate(30%,-404%) scale(0.9); opacity:1} 30%{transform:translate(51%,-586%) scale(0.9); opacity:1} 40%{transform:translate(92%,-755%) scale(0.8); opacity:1} 50%{transform:translate(140%,-909%) scale(0.7); opacity:1} 60%{transform:translate(175%,-1047%) scale(0.6); opacity:1} 70%{transform:translate(190%,-1166%) scale(0.6); opacity:0.8} 80%{transform:translate(192%,-1266%) scale(0.5); opacity:0.5} 90%{transform:translate(201%,-1341%) scale(0.4); opacity:0.2} 100%{transform:translate(230%,-1380%) scale(0.3); opacity:0}}
@keyframes fx-и4{0%{transform:translate(0%,0%) scale(0.5); opacity:0} 10%{transform:translate(6.2%,-286%) scale(1); opacity:1} 20%{transform:translate(-16%,-556%) scale(0.9); opacity:1} 30%{transform:translate(-2.3%,-807%) scale(0.9); opacity:1} 40%{transform:translate(18%,-1039%) scale(0.8); opacity:1} 50%{transform:translate(-8.6%,-1251%) scale(0.7); opacity:1} 60%{transform:translate(-12%,-1441%) scale(0.6); opacity:1} 70%{transform:translate(16%,-1606%) scale(0.6); opacity:0.8} 80%{transform:translate(2.3%,-1743%) scale(0.5); opacity:0.5} 90%{transform:translate(-18%,-1846%) scale(0.4); opacity:0.2} 100%{transform:translate(8.6%,-1900%) scale(0.3); opacity:0}}
@keyframes fx-и5{0%{transform:translate(0%,0%) scale(0.5); opacity:0} 10%{transform:translate(38%,-200%) scale(1); opacity:1} 20%{transform:translate(98%,-389%) scale(0.9); opacity:1} 30%{transform:translate(72%,-565%) scale(0.9); opacity:1} 40%{transform:translate(11%,-727%) scale(0.8); opacity:1} 50%{transform:translate(-63%,-876%) scale(0.7); opacity:1} 60%{transform:translate(-124%,-1009%) scale(0.6); opacity:1} 70%{transform:translate(-152%,-1124%) scale(0.6); opacity:0.8} 80%{transform:translate(-138%,-1220%) scale(0.5); opacity:0.5} 90%{transform:translate(-89%,-1293%) scale(0.4); opacity:0.2} 100%{transform:translate(-27%,-1330%) scale(0.3); opacity:0}}
@keyframes fx-и6{0%{transform:translate(0%,0%) scale(0.5); opacity:0} 10%{transform:translate(15%,-143%) scale(1); opacity:1} 20%{transform:translate(-1%,-278%) scale(0.9); opacity:1} 30%{transform:translate(-25%,-403%) scale(0.9); opacity:1} 40%{transform:translate(-23%,-520%) scale(0.8); opacity:1} 50%{transform:translate(4.1%,-626%) scale(0.7); opacity:0.8} 60%{transform:translate(36%,-720%) scale(0.6); opacity:0.5} 70%{transform:translate(49%,-803%) scale(0.6); opacity:0.2} 80%{transform:translate(32%,-872%) scale(0.5); opacity:0} 90%{transform:translate(2.5%,-923%) scale(0.4); opacity:0} 100%{transform:translate(-14%,-950%) scale(0.3); opacity:0}}
@keyframes fx-п1{0%{transform:translate(0%,0%) rotate(0deg) scale(1,1); opacity:0} 10%{transform:translate(127%,300%) rotate(30deg) scale(1,0.9); opacity:0.8} 20%{transform:translate(174%,600%) rotate(60deg) scale(1,0.5); opacity:0.8} 30%{transform:translate(127%,900%) rotate(90deg) scale(1,0.5); opacity:0.8} 40%{transform:translate(49%,1200%) rotate(120deg) scale(1,0.9); opacity:0.8} 50%{transform:translate(30%,1500%) rotate(150deg) scale(1,1); opacity:0.8} 60%{transform:translate(109%,1800%) rotate(180deg) scale(1,0.9); opacity:0.8} 70%{transform:translate(247%,2100%) rotate(210deg) scale(1,0.5); opacity:0.8} 80%{transform:translate(354%,2400%) rotate(240deg) scale(1,0.5); opacity:0.8} 90%{transform:translate(367%,2700%) rotate(270deg) scale(1,0.9); opacity:0.5} 100%{transform:translate(300%,3000%) rotate(300deg) scale(1,1); opacity:0}}
@keyframes fx-п2{0%{transform:translate(120%,0%) rotate(0deg) scale(1,1); opacity:0} 10%{transform:translate(38%,300%) rotate(-30deg) scale(1,0.9); opacity:0.8} 20%{transform:translate(-100%,600%) rotate(-60deg) scale(1,0.5); opacity:0.8} 30%{transform:translate(-205%,900%) rotate(-90deg) scale(1,0.5); opacity:0.8} 40%{transform:translate(-215%,1200%) rotate(-120deg) scale(1,0.9); opacity:0.8} 50%{transform:translate(-146%,1500%) rotate(-150deg) scale(1,1); opacity:0.8} 60%{transform:translate(-81%,1800%) rotate(-180deg) scale(1,0.9); opacity:0.8} 70%{transform:translate(-97%,2100%) rotate(-210deg) scale(1,0.5); opacity:0.8} 80%{transform:translate(-206%,2400%) rotate(-240deg) scale(1,0.5); opacity:0.8} 90%{transform:translate(-343%,2700%) rotate(-270deg) scale(1,0.9); opacity:0.5} 100%{transform:translate(-420%,3000%) rotate(-300deg) scale(1,1); opacity:0}}
@keyframes fx-п3{0%{transform:translate(122%,0%) rotate(0deg) scale(1,1); opacity:0} 10%{transform:translate(150%,300%) rotate(-33deg) scale(1,0.8); opacity:0.8} 20%{transform:translate(-29%,600%) rotate(-66deg) scale(1,0.3); opacity:0.8} 30%{transform:translate(-168%,900%) rotate(-99deg) scale(1,0.8); opacity:0.8} 40%{transform:translate(-75%,1200%) rotate(-132deg) scale(1,1); opacity:0.8} 50%{transform:translate(122%,1500%) rotate(-165deg) scale(1,0.8); opacity:0.8} 60%{transform:translate(150%,1800%) rotate(-198deg) scale(1,0.3); opacity:0.8} 70%{transform:translate(-29%,2100%) rotate(-231deg) scale(1,0.8); opacity:0.8} 80%{transform:translate(-168%,2400%) rotate(-264deg) scale(1,1); opacity:0.8} 90%{transform:translate(-75%,2700%) rotate(-297deg) scale(1,0.8); opacity:0.5} 100%{transform:translate(122%,3000%) rotate(-330deg) scale(1,0.3); opacity:0}}
@keyframes fx-п4{0%{transform:translate(47%,0%) rotate(0deg) scale(1,1); opacity:0} 10%{transform:translate(34%,260%) rotate(9deg) scale(1,0.9); opacity:0.8} 20%{transform:translate(18%,520%) rotate(18deg) scale(1,0.7); opacity:0.8} 30%{transform:translate(14%,780%) rotate(27deg) scale(1,0.4); opacity:0.8} 40%{transform:translate(35%,1040%) rotate(36deg) scale(1,0.5); opacity:0.8} 50%{transform:translate(83%,1300%) rotate(45deg) scale(1,0.8); opacity:0.8} 60%{transform:translate(148%,1560%) rotate(54deg) scale(1,1); opacity:0.8} 70%{transform:translate(216%,1820%) rotate(63deg) scale(1,1); opacity:0.8} 80%{transform:translate(272%,2080%) rotate(72deg) scale(1,0.9); opacity:0.8} 90%{transform:translate(303%,2340%) rotate(81deg) scale(1,0.6); opacity:0.5} 100%{transform:translate(307%,2600%) rotate(90deg) scale(1,0.3); opacity:0}}


.hx-стоп .fx *,.fx.fx-стоп *{animation-play-state:paused}


.fx-ура{opacity:0}
.hx-ура .fx-окно{animation:fx-взвиться 1.2s var(--ease-out) 2}
@keyframes fx-взвиться{0%,100%{transform:scale(1, 1)} 30%{transform:scale(1.08, 1.3)}}
.hx-ура .fx-ура{animation:fx-вспых 1.2s var(--ease-out) 2}
@keyframes fx-вспых{0%{opacity:0} 25%{opacity:.85} 100%{opacity:0}}



.лицо-заказа{position:absolute; inset:0; display:grid; place-items:center}
.лз{grid-area:1/1; width:72px; height:72px; color:var(--lamp); opacity:0;
  filter:drop-shadow(0 6px 14px rgba(0,0,0,.55))}
.лз.ждём{opacity:1; animation:лз-ждём 2.6s var(--ease-in-out) infinite}
@keyframes лз-ждём{0%,100%{translate:0 0; scale:1} 50%{translate:0 -4px; scale:1.04}}
.digger.done .лз.ждём,.digger.bad .лз.ждём{opacity:0; animation:none}
.digger.done .лз.готово{opacity:1; color:var(--ore); animation:лз-ура 720ms var(--ease-out) both}
@keyframes лз-ура{0%{scale:.6; opacity:0} 55%{scale:1.12; opacity:1} 100%{scale:1; opacity:1}}
.digger.bad .лз.беда{opacity:1; color:var(--rust); animation:лз-увы 640ms var(--ease-out) both}
@keyframes лз-увы{0%{rotate:0deg; opacity:0} 30%{rotate:-8deg; opacity:1} 55%{rotate:6deg}
  78%{rotate:-3deg} 100%{rotate:0deg; opacity:1}}



.vip-now.новая-ступень .ic{transform-origin:50% 80%;
  animation:ступень-выросла 900ms var(--ease-out) 150ms both}
@keyframes ступень-выросла{0%{transform:scale(.55) rotate(-14deg); opacity:0}
  55%{transform:scale(1.16) rotate(3deg); opacity:1} 100%{transform:none; opacity:1}}
@media (prefers-reduced-motion: reduce){
  .vip-now.новая-ступень .ic{animation:none}
}



.proboy .zerno.глиф{width:auto; height:auto; margin:-.5em 0 0 -.35em; background:none;
  font:800 26px/1 var(--font-display); color:var(--lamp);
  text-shadow:0 2px 10px rgba(0,0,0,.45)}
.proboy .zerno.глиф.г1{color:var(--lamp-hi)}


.стример{display:grid; gap:12px; margin:14px 0 6px; padding:14px 14px 13px;
  border-radius:var(--r-card); border:1px solid var(--seam);
  background:linear-gradient(168deg, color-mix(in oklab, var(--stone) 84%, transparent),
    color-mix(in oklab, var(--stone-deep) 90%, transparent));
  box-shadow:inset 0 1px 0 color-mix(in oklab, var(--cream) 10%, transparent)}
.стример[hidden]{display:none}
.стример-кто{display:flex; align-items:center; gap:12px; min-width:0}
.стример-лицо{width:52px; height:52px; flex:none; border-radius:50%; object-fit:cover;
  border:1px solid color-mix(in oklab, var(--lamp) 42%, transparent)}
svg.стример-лицо{padding:11px; color:var(--lamp); background:var(--stone-deep)}
.стример-имя{display:grid; gap:2px; min-width:0}
.стример-имя b{font:800 var(--fs-md)/1.2 var(--font-display); color:var(--cream);
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.стример-имя span{font-size:var(--fs-sm); color:var(--sand-dim)}

.стример-ссылки{display:grid; grid-template-columns:1fr 1fr; gap:8px}
.стример-ссылка:last-child:nth-child(odd){grid-column:1 / -1}
.стример-ссылка{min-width:0; display:inline-flex; align-items:center; justify-content:center;
  gap:6px; min-height:40px; padding:8px 12px; border-radius:var(--r-pill);
  font-size:var(--fs-sm); font-weight:650; color:var(--sand); text-decoration:none;
  border:1px solid var(--seam); background:rgba(0,0,0,.25);
  transition:scale var(--t-press) var(--ease-out)}
.стример-ссылка:active{scale:.96}
.стример-ссылка .ic{width:16px; height:16px; flex:none; color:var(--lamp)}



.пасхалка{position:fixed; left:50%; z-index:90;
  bottom:calc(20px + var(--док, 0px) + env(safe-area-inset-bottom));
  max-width:min(340px, calc(100vw - 32px)); padding:11px 16px; border-radius:var(--r-card);
  font-size:var(--fs-sm); font-weight:650; line-height:var(--lh-tight); text-align:center;
  text-wrap:balance;
  color:var(--cream); background:color-mix(in oklab, var(--stone-deep) 94%, transparent);
  border:1px solid color-mix(in oklab, var(--lamp) 45%, transparent);
  box-shadow:0 14px 30px -16px #000; pointer-events:none;
  translate:-50% 12px; opacity:0;
  transition:opacity 220ms var(--ease-out), translate 220ms var(--ease-out)}
.пасхалка.видно{opacity:1; translate:-50% 0}

@media (prefers-reduced-motion: reduce){
  
  .арт .hx-glow,.арт .hx-blink,.арт .hx-float,.арт .hx-sway,.арт .hx-ember,
  .арт .hx-glint,.hx-ура .hx-glow,.hx-ура .hx-blink{animation:none}
  .арт .hx-ember,.арт .hx-glint{opacity:0}
  .лз.ждём,.digger.done .лз.готово,.digger.bad .лз.беда{animation:none}
  .пасхалка,.стример-ссылка{transition:none}
  
  .fx *,.hx-ура .fx *{animation:none}
  .fx-искра,.fx-пепел{display:none}
  .fx-клуб{opacity:.8}
  .fx-лента{transition:none}
  
  .fx-окно.зеркало .fx-лента{translate:0 -50%}
}


.note{margin:14px 0 0; padding:14px 15px; border-radius:var(--r-card);
  font-size:var(--fs-md); line-height:var(--lh-text); color:var(--cream);
  border:1px solid var(--seam);
  background:color-mix(in oklab, var(--stone) 88%, transparent)}
.note.bad{border-color:color-mix(in oklab, var(--rust) 55%, transparent);
  background:color-mix(in oklab, var(--rust) 12%, var(--stone))}


#trackRetry{margin-top:12px}
#trackRetry:disabled{opacity:.55}
.retry-err{margin:10px 0 0; font-size:var(--fs-sm); color:var(--sand-dim)}


.ore .take.picked{min-height:36px; padding-top:3px; padding-bottom:3px}
.ore .take.picked i{width:30px; height:30px; font-size:var(--fs-lg)}
.stepper{gap:4px}
.stepper button{width:40px; height:40px; font-size:var(--fs-lg)}



.шапка-сайта,.герой-сцена,.dock-шапка,.dock-строки,.кадр-катсцены,.лампа-курсора,.полка-все{display:none}
.полка-бок,.заказ-итог,.регионы-окно{display:contents}

.фон-сцены{position:fixed; inset:0; z-index:-1; pointer-events:none}


@media (min-width:600px){
  html[data-телефон]{--телефон-ширина:430px;
    --телефон-поле:max(0px, calc((100vw - var(--телефон-ширина)) / 2))}
  
  html[data-телефон]{background:var(--deep)}
  html[data-телефон] body{background:transparent}
  html[data-телефон] .app{max-width:var(--телефон-ширина); margin:0 auto;
    box-sizing:border-box; min-height:100vh;
    box-shadow:0 0 0 1px color-mix(in oklab, var(--cream) 8%, transparent),
      0 0 120px -20px #000}
  html[data-телефон] .dock,
  html[data-телефон] .регионы,
  html[data-телефон] .вопрос,
  html[data-телефон] .screen[data-screen="order"]::before{
    left:var(--телефон-поле); right:var(--телефон-поле)}
  html[data-телефон] .накрыльцо{left:calc(var(--телефон-поле) + 12px);
    right:calc(var(--телефон-поле) + 12px)}
}


.lobby:has(> .lob-бот:not([hidden])){grid-auto-flow:row; grid-template-columns:repeat(2, minmax(0, 1fr))}
.lob-бот{grid-column:1 / -1}
.lob-бот[hidden]{display:none}
.lob-ник{font-size:var(--fs-cap); color:var(--sand-dim)}


.lob-помощь[hidden], .трек-помощь[hidden]{display:none}
.lobby:has(> .lob-помощь:not([hidden])){grid-auto-flow:row; grid-template-columns:repeat(2, minmax(0, 1fr))}
.lob-помощь{grid-column:1 / -1}
.трек-помощь{display:flex; align-items:center; justify-content:center; gap:8px;
  margin:16px auto 0; padding:10px 14px; font-size:var(--fs-sm); color:var(--lamp);
  text-decoration:none}
.трек-помощь .ic{width:17px; height:17px; flex:none}
.трек-помощь:active{opacity:.7}

.who-chip.who-пусто .who-edit{white-space:normal; max-width:9.5em; text-align:right;
  line-height:1.2; opacity:1}


.способы{margin:18px 0 6px}
.способы[hidden]{display:none}
.способы-что{display:block; margin:0 0 10px; font-size:var(--fs-cap); font-weight:700;
  letter-spacing:.2em; text-transform:uppercase; color:var(--sand)}
.способы-ряд{display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:8px}
.способ{position:relative; display:grid; gap:3px; align-content:start; text-align:left;
  padding:12px 12px 11px; border-radius:var(--r-in); color:var(--cream);
  background:rgba(0,0,0,.28); border:1.5px solid rgba(255,255,255,.12);
  transition:border-color .15s, background .15s}
.способ:not(.скоро):active{scale:.98}
.способ.on{border-color:var(--lamp); background:color-mix(in oklab, var(--lamp) 14%, rgba(0,0,0,.4))}
.способ.on::after{content:""; position:absolute; top:10px; right:10px; width:8px; height:8px;
  border-radius:50%; background:var(--lamp)}
.способ-имя{font-size:15px; font-weight:750; padding-right:14px}
.способ-про{font-size:var(--fs-cap); color:var(--sand-dim); line-height:1.25}
.способ-сумма{margin-top:6px; font-size:18px; font-weight:800; color:#fff;
  font-variant-numeric:tabular-nums}
.способ.скоро{cursor:default}
.способ.скоро .способ-имя, .способ.скоро .способ-про{opacity:.6}
.способ-скоро{margin-top:6px; font-style:normal; font-size:12px; font-weight:800;
  letter-spacing:.16em; color:var(--lamp)}


.lob-отзывы[hidden], .о-отзывы[hidden]{display:none}
.lob-отзывы .ic{color:var(--lamp)}
.lobby:has(> .lob-отзывы:not([hidden])){grid-auto-flow:row; grid-template-columns:repeat(2, minmax(0, 1fr))}
.lobby:has(> .lob-отзывы:not([hidden])) > .lob-помощь{grid-column:auto}
.lobby:has(> .lob-отзывы:not([hidden])):not(:has(> .lob-помощь:not([hidden]))) > .lob-отзывы{grid-column:1 / -1}
.о-отзывы{margin:18px 0 6px}
.о-отзывы .lob{width:100%; margin-top:10px}
.отзыв-просьба{display:grid; gap:10px; margin-top:12px; padding:14px 14px 12px;
  border-radius:var(--r-card); border:1px solid var(--seam); text-align:center;
  background:color-mix(in oklab, var(--stone) 70%, transparent)}
.отзыв-просьба > span{font-size:var(--fs-sm); line-height:var(--lh-tight); color:var(--cream)}


.нет-игры[hidden]{display:none}
.нет-игры{display:grid; gap:14px; margin:14px 0 6px; padding:16px 16px 14px;
  border-radius:var(--r-card); border:1px solid var(--seam);
  background:linear-gradient(180deg, rgba(255,255,255,.04), rgba(0,0,0,.18))}
.нет-игры-ряд{display:grid; grid-template-columns:auto minmax(0, 1fr); gap:12px; align-items:start}
.нет-игры-знак{display:grid; place-items:center; width:42px; height:42px; border-radius:12px;
  color:var(--lamp); border:1px solid color-mix(in oklab, var(--lamp) 45%, var(--seam));
  background:color-mix(in oklab, var(--lamp) 10%, rgba(0,0,0,.3))}
.нет-игры-знак svg{width:26px; height:26px}
.нет-игры-текст{display:grid; gap:3px}
.нет-игры-текст b{font-size:var(--fs-base); color:var(--cream); letter-spacing:.01em}
.нет-игры-текст span{font-size:var(--fs-sm); color:var(--sand); line-height:1.4; text-wrap:pretty}
.нет-игры-ссылка{display:flex; align-items:center; justify-content:center; gap:8px; padding:12px 16px;
  border-radius:var(--r-pill); font-weight:700; font-size:var(--fs-sm); text-decoration:none;
  color:var(--on-lamp); background:var(--metal); text-align:center;
  transition:scale var(--t-press) var(--ease-out)}
.нет-игры-ссылка:active{scale:.97}
.нет-игры-ссылка .ic{width:16px; height:16px; rotate:180deg}


.акция-плашка[hidden]{display:none}
.акция-плашка{display:grid; grid-template-columns:auto minmax(0, 1fr) auto; align-items:center; gap:12px;
  margin:14px 0 6px; padding:12px 14px; border-radius:var(--r-card); color:#fff;
  background:var(--rust)}
.акция-огонь svg{width:30px; height:30px; display:block}
.акция-цена{display:flex; align-items:center; justify-content:center; gap:6px; font-size:var(--fs-cap)}
.акция-цена s{opacity:.6}
.акция-цена b{padding:2px 6px; border-radius:6px; color:#fff; background:var(--rust)}
.акция-ярлык{position:absolute; left:10px; top:10px; z-index:3; display:grid; gap:1px; padding:5px 9px;
  border-radius:8px; font-style:normal; color:#fff; background:var(--rust)}
.акция-ярлык b{font-size:11px; letter-spacing:.12em}
.акция-ярлык span{font-size:13px; font-weight:800; font-variant-numeric:tabular-nums; white-space:nowrap}
.акция-крик{font-size:var(--fs-sm); font-weight:800; text-transform:uppercase; line-height:1.25; letter-spacing:.02em}


.вход-совет{display:grid; grid-template-columns:auto minmax(0, 1fr) auto; gap:12px; align-items:center;
  margin:14px 0 0; padding:12px 14px; border-radius:var(--r-card);
  border:1px solid color-mix(in oklab, var(--lamp) 45%, transparent);
  background:color-mix(in oklab, var(--lamp) 10%, var(--stone))}
.вход-совет[hidden]{display:none}
.вход-совет .ic{width:34px; height:34px; color:var(--lamp)}
.вход-совет b{display:block; font-size:var(--fs-md); color:var(--cream)}
.вход-совет span{display:block; margin-top:2px; font-size:var(--fs-sm); line-height:var(--lh-text); color:var(--sand)}
.вход-совет-да{padding:9px 14px; border-radius:var(--r-in); font-weight:700; font-size:var(--fs-sm);
  color:var(--on-lamp); background:var(--lamp)}


.line.pts{align-items:center; gap:12px}
.line.pts dt{display:grid; gap:2px; min-width:0}
.line.pts dt small{font-size:var(--fs-sm); color:var(--sand-dim)}
.line.pts dt small:empty{display:none}
.line.pts dd{flex:none}
.pts-sw{position:relative; width:46px; height:28px; border-radius:14px; padding:0;
  background:rgba(0,0,0,.35); border:1.5px solid rgba(255,255,255,.2); transition:background .15s, border-color .15s}
.pts-sw[hidden]{display:none}
.pts-sw i{position:absolute; top:3px; left:3px; width:19px; height:19px; border-radius:50%;
  background:var(--sand); transition:transform .15s, background .15s}
.pts-sw.on{background:var(--lamp); border-color:var(--lamp)}
.pts-sw.on i{transform:translateX(18px); background:var(--on-lamp, #000)}
.pts-sw:active i{scale:.92}
@media (prefers-reduced-motion: reduce){ .pts-sw, .pts-sw i{transition:none} }


.вход-стим{display:block; width:100%; margin-top:2px; padding:12px; border-radius:var(--r-in); font-weight:700;
  color:var(--cream); background:var(--stone); border:1px solid var(--seam-2); cursor:pointer}
.вход-стим[hidden]{display:none}
.вход-стим:disabled{opacity:.5; pointer-events:none}
.ямоя-ник{display:grid; gap:6px; margin-top:4px}
.ямоя-ник label{font-size:var(--fs-sm); font-weight:650; color:var(--cream)}
.ямоя-ник-ряд{display:flex; gap:8px; align-items:center}
.ямоя-ник input{flex:1 1 auto; min-width:0; padding:8px 10px; border-radius:var(--r-in); border:1px solid var(--seam-2);
  background:var(--deep); color:var(--cream); font:inherit; font-size:var(--fs-base)}
.ямоя-ник-ответ{font-size:var(--fs-sm); color:var(--sand)}
.ямоя-ник-ответ.беда{color:var(--rust)}