/* dofamart — люкс-слой (10.11.2026, слово Романа: без видеофона, воздушная анимация, дорогой магазин, очень минималистично).
   Грузится последним и перекрывает неон: всё держится на переменных, темы меняют только --a1/--a2/--a3/--bg. */
:root{
  color-scheme:light;
  --a1:#A8894F; --a2:#D8C39A; --a3:#765822; --bg:#F6F2EA;
  --fg:#1B1917; --mute:#5F584F; --dim:#736B60;
  --line:color-mix(in srgb,var(--fg) 10%,transparent); --line-2:color-mix(in srgb,var(--fg) 20%,transparent);
  --glass:color-mix(in srgb,var(--fg) 3.5%,transparent); --glass-2:color-mix(in srgb,var(--fg) 7%,transparent);
  --panel:color-mix(in srgb,var(--bg) 55%,#fff); --panel-2:color-mix(in srgb,var(--bg) 86%,var(--fg));
  --paper:#FFFFFF; --paper-ink:#1B1917; --paper-line:#D9D0BF;
  --ok:#4E7A5A; --warn:#A8483F; --black:var(--bg);
  --f-display:"EB Garamond","Times New Roman",Georgia,serif;
  --r-s:6px; --r-m:10px; --r-l:14px;
  --grad:linear-gradient(var(--fg),var(--fg));
  --grad-3:linear-gradient(var(--a1),var(--a1));
  --glow:0 24px 60px -34px color-mix(in srgb,var(--fg) 45%,transparent);
  --sh:0 30px 70px -40px color-mix(in srgb,var(--fg) 40%,transparent);
}
html[data-tone="dark"]{
  color-scheme:dark;
  --fg:#F1ECE2; --mute:#B3AA9B; --dim:#9A9184;
  --panel:color-mix(in srgb,var(--bg) 90%,#fff); --panel-2:color-mix(in srgb,var(--bg) 82%,#fff);
  --ok:#8FBF9B; --warn:#D98C82;
}
*{text-shadow:none!important}
body{font-size:15px;letter-spacing:.005em}
.emo{filter:grayscale(1);opacity:.75}

/* ---------- воздух на фоне ---------- */
#race,.bgv,.veil{display:none!important}
.air{position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden;background:
  radial-gradient(120% 90% at 50% -10%,color-mix(in srgb,var(--a2) 22%,transparent),transparent 60%),var(--bg)}
.air i{position:absolute;border-radius:50%;will-change:transform}
.air i:nth-child(-n+3){filter:blur(70px);opacity:.55}
.air i:nth-child(1){width:52vmax;height:52vmax;left:-14vmax;top:-18vmax;background:radial-gradient(closest-side,color-mix(in srgb,var(--a2) 60%,transparent),transparent);animation:air1 38s ease-in-out infinite alternate}
.air i:nth-child(2){width:44vmax;height:44vmax;right:-12vmax;top:22vh;background:radial-gradient(closest-side,color-mix(in srgb,var(--a1) 34%,transparent),transparent);animation:air2 46s ease-in-out infinite alternate}
.air i:nth-child(3){width:40vmax;height:40vmax;left:24vw;bottom:-22vmax;background:radial-gradient(closest-side,color-mix(in srgb,#fff 70%,var(--a2)),transparent);animation:air3 52s ease-in-out infinite alternate}
html[data-tone="dark"] .air i:nth-child(-n+3){opacity:.22}
/* тонкие кольца и пылинки, медленно всплывают */
.air i:nth-child(n+4){border:1px solid color-mix(in srgb,var(--a1) 38%,transparent);opacity:.5;animation:rise linear infinite}
.air i:nth-child(4){width:260px;height:260px;left:8vw;top:100vh;animation-duration:64s}
.air i:nth-child(5){width:120px;height:120px;left:62vw;top:100vh;animation-duration:48s;animation-delay:-20s}
.air i:nth-child(6){width:420px;height:420px;left:74vw;top:100vh;animation-duration:86s;animation-delay:-40s;opacity:.32}
.air i:nth-child(7){width:70px;height:70px;left:36vw;top:100vh;animation-duration:40s;animation-delay:-9s;background:color-mix(in srgb,var(--a2) 26%,transparent);border:0}
@keyframes air1{to{transform:translate(14vw,10vh) scale(1.15)}}
@keyframes air2{to{transform:translate(-16vw,-12vh) scale(.9)}}
@keyframes air3{to{transform:translate(-10vw,-14vh) scale(1.2)}}
@keyframes rise{from{transform:translate3d(0,0,0) rotate(0)}50%{transform:translate3d(4vw,-80vh,0) rotate(40deg)}to{transform:translate3d(-2vw,-160vh,0) rotate(80deg)}}
@media (prefers-reduced-motion:reduce){.air i{animation:none!important}}

/* ---------- шапка ---------- */
.topbar{background:transparent;border-bottom:1px solid var(--line);font-size:11.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--mute)}
.topbar b{color:var(--fg);font-weight:600}
.hdr{background:color-mix(in srgb,var(--bg) 78%,transparent);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)}
.hdr-row{padding-block:14px}
.logo{font:600 27px/1 var(--f-display);letter-spacing:.01em}
.logo-i{display:none}
.logo span b{background:none;color:var(--a3);-webkit-text-fill-color:currentColor}
.search{height:46px;border-radius:999px;background:transparent;border-color:var(--line-2)}
.search:focus-within{border-color:var(--fg);box-shadow:none}
.search kbd{display:none}
.ic,.pill{background:transparent;border-color:transparent;border-radius:999px;font-weight:500;letter-spacing:.02em}
.ic:hover,.pill:hover{background:var(--glass-2);border-color:transparent}
.ak-link{text-decoration:none;color:var(--fg);text-transform:uppercase;font-size:11.5px;letter-spacing:.16em;font-weight:600;border:1px solid var(--line-2)!important}
.ak-link:hover{background:var(--fg);color:var(--bg)}
.mx-pts{color:var(--fg);font-weight:600}
.mx-dia{width:7px;height:7px;background:var(--a1);transform:rotate(45deg);display:inline-block}
.mx-rt.pill{width:auto;padding:0 12px;font-size:11.5px;letter-spacing:.14em;text-transform:uppercase}
.tdots i{border-color:var(--bg)}
.cartbtn{height:44px;border-radius:999px;box-shadow:none;font-weight:600;padding:0 18px}
.badge{background:var(--a3);color:#fff;box-shadow:0 0 0 2px var(--bg)}
.dopa-lbl i{color:var(--fg)} .dopa-bar{height:2px;border-radius:0} .dopa-bar span{box-shadow:none;background:var(--a1)}
@media (max-width:660px){.logo{font-size:23px}.ak-link{padding:0 12px}}

/* ---------- кнопки ---------- */
.btn{border-radius:999px;font-weight:600;font-size:14px;letter-spacing:.03em;min-height:48px;padding:12px 26px}
.btn-main{box-shadow:none}
.btn-main:hover{box-shadow:none;background:color-mix(in srgb,var(--fg) 86%,var(--a1))}
.btn-ghost{background:transparent;border-color:var(--line-2)}
.btn-ghost:hover{background:var(--glass-2);border-color:var(--fg)}
.btn.sm{border-radius:999px}
.btn-danger{color:#fff}
:focus-visible{outline-color:var(--a1)}

/* ---------- первый экран ---------- */
.hero{padding-block:clamp(56px,10vh,120px) clamp(60px,10vh,120px)}
.eyebrow{color:var(--a3);letter-spacing:.26em;font-weight:600;font-size:11.5px}
.eyebrow::before{width:28px;height:1px;border-radius:0;background:var(--a1);box-shadow:none;animation:none}
h1{font:500 clamp(46px,7.2vw,104px)/.95 var(--f-display);letter-spacing:-.015em;margin:22px 0 26px}
h1 .l1{background:none;color:var(--fg);-webkit-text-fill-color:currentColor}
h1 .l2{color:var(--fg);font-style:italic}
h1 mark{background:none;color:var(--a3);padding:0;transform:none;box-shadow:none;border-radius:0;border-bottom:1px solid var(--a1)}
.lead{color:var(--mute);font-size:clamp(15.5px,1.3vw,18px);line-height:1.65}
.trust li{background:transparent;border:0;border-left:1px solid var(--line-2);border-radius:0;padding:2px 16px;backdrop-filter:none}
.trust li:first-child{border-left:0;padding-left:0}
.trust b{color:var(--fg);font:600 15px var(--f-mono)}
.hot-l{color:var(--mute);letter-spacing:.2em}
.hot-i{border-radius:50%;border:1px solid var(--line-2);box-shadow:none}
.hot-i:hover{border-color:var(--a1)}
.hot-i b{display:none}
.sticker{width:92px;height:92px;background:var(--bg);color:var(--a3);border:1px solid var(--a1);box-shadow:none;font:600 24px/1 var(--f-display);letter-spacing:0;outline:1px solid var(--a1);outline-offset:-6px}
.rc-wrap::before{background:radial-gradient(closest-side,color-mix(in srgb,var(--fg) 26%,transparent),transparent)}
.rc-head b{font:600 26px/1.1 var(--f-display);letter-spacing:.02em}

/* ---------- разделы ---------- */
.stage{background:none}
.sec-h{margin-bottom:26px;align-items:baseline}
.sec-h h2,.sale h2{font:500 clamp(32px,4vw,54px)/1.02 var(--f-display);letter-spacing:-.01em}
.count{color:var(--mute);font:500 12px var(--f-mono)}
.cats{padding-block:56px 40px}
.tiles{gap:14px}
.tile{border:0;border-radius:var(--r-m);background:var(--panel-2);aspect-ratio:1/1.05}
.tile::after{background:linear-gradient(180deg,transparent 45%,rgba(16,14,12,.62))}
.tile:hover{box-shadow:var(--sh)}
.tile .t-n{font:500 21px/1.05 var(--f-display);letter-spacing:0;color:#fff;bottom:30px}
.tile .t-c{color:rgba(255,255,255,.75);font-weight:500}
.tile.on{box-shadow:0 0 0 1px var(--bg),0 0 0 2px var(--fg)}
.tile.all{background:var(--fg);color:var(--bg)}
.tile.all .t-n{color:var(--bg)} .tile.all .t-c{color:color-mix(in srgb,var(--bg) 70%,transparent)}
.tile.all .big{font:500 54px/1 var(--f-display);letter-spacing:0}
@media (max-width:700px){.tile .t-n{font-size:16px}.tile.all .big{font-size:34px}}

.sale-box{background:transparent;border:0;border-top:1px solid var(--line-2);border-bottom:1px solid var(--line-2);border-radius:0;padding:40px 0}
.sale-box::before{display:none}
.timer{color:var(--fg);font:500 clamp(30px,3.6vw,46px)/1 var(--f-mono)}
.deal{background:transparent;border:0;border-top:1px solid var(--line);border-radius:0;padding:14px 0 0}
.deal:hover{background:transparent}
.deal .ph{border-radius:8px}
.deal-n{font-weight:500}
.deal-p{font:600 13.5px var(--f-mono)}

/* «Акции» — вход в симулятор */
.ak{padding-block:8px 36px}
.ak-box{position:relative;display:grid;gap:10px;padding:38px 34px;border-radius:var(--r-l);text-decoration:none;color:#F1ECE2;background:#0F0E0D;overflow:hidden;isolation:isolate;transition:transform .5s cubic-bezier(.2,.8,.2,1)}
.ak-box::before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(60% 120% at 85% 20%,rgba(200,169,106,.34),transparent 60%),radial-gradient(40% 90% at 10% 110%,rgba(200,169,106,.16),transparent 70%);animation:akglow 9s ease-in-out infinite alternate}
.ak-box::after{content:"";position:absolute;inset:10px;border:1px solid rgba(200,169,106,.35);border-radius:8px;pointer-events:none}
@keyframes akglow{to{transform:translate(-6%,4%) scale(1.12)}}
.ak-box:hover{transform:translateY(-3px)}
.ak-eye{font:600 11px/1 var(--f-body);letter-spacing:.28em;text-transform:uppercase;color:#C8A96A}
.ak-t{font:500 clamp(30px,4.4vw,58px)/1 var(--f-display);letter-spacing:-.01em}
.ak-s{max-width:56ch;color:#B3AA9B;font-size:15px;line-height:1.6}
.ak-go{margin-top:8px;font:600 12px/1 var(--f-body);letter-spacing:.2em;text-transform:uppercase;color:#E6D3A8}
@media (max-width:660px){.ak-box{padding:30px 24px}}

/* ---------- каталог ---------- */
.sort select{border-radius:999px;background:transparent;border-color:var(--line-2)}
.chip{background:transparent;border-color:var(--line-2);font-weight:500;letter-spacing:.02em}
.chip:hover{background:var(--glass-2)}
.chip.on{background:var(--fg);color:var(--bg)}
.grid{gap:34px 22px}
@media (max-width:780px){.grid{gap:24px 12px}}
.card{background:none;border:0;padding:0;gap:9px;border-radius:0}
.card:hover{transform:none;box-shadow:none}
.ph{border-radius:var(--r-m);aspect-ratio:1/1.12;background:var(--panel-2)}
.ph::after{display:none}
.ph img{z-index:0}
.card:hover .ph img{transform:scale(1.04)}
.disc{top:12px;left:12px;background:var(--bg);color:var(--fg);border-radius:999px;font:600 11px/1 var(--f-mono);letter-spacing:0;box-shadow:none;padding:6px 10px}
.stock{left:12px;bottom:12px;background:color-mix(in srgb,var(--bg) 86%,transparent);color:var(--fg);border-radius:999px;font-weight:500;backdrop-filter:blur(6px)}
.fav{top:8px;right:8px;width:44px;height:44px;background:color-mix(in srgb,var(--bg) 80%,transparent);border:0;color:var(--fg)}
.fav.on svg{fill:var(--a1);stroke:var(--a1)}
.nm{font:500 14.5px/1.35 var(--f-body);min-height:0;padding:0}
.nm button{min-height:44px;padding:0}
.nm button:hover{color:var(--a3)}
.price{padding:0}
.price b{background:none;color:var(--fg);-webkit-text-fill-color:currentColor;font:600 var(--pf,17px)/1.2 var(--f-body);letter-spacing:0}
.price.l2{--pf:15.5px}.price.l3{--pf:14px}.price.l4{--pf:13px}
.cap{color:var(--dim);font-weight:500;padding:0;margin-top:-4px}
.meta{padding:0;color:var(--dim)} .star{color:var(--a1)}
.add{background:transparent;border:1px solid var(--line-2);border-radius:999px;font-weight:600;font-size:13px;letter-spacing:.03em}
.add:hover,.card:hover .add{background:var(--fg);color:var(--bg);box-shadow:none}
.stepper{border-radius:999px}
@media (max-width:780px){.card{padding:0}.fav{top:4px;right:4px;width:44px;height:44px}.price{--pf:15px}}

.steps li{background:transparent;border:0;border-top:1px solid var(--line-2);border-radius:0;padding:26px 0 0}
.steps li::before{font:500 54px/1 var(--f-display);letter-spacing:0;background:none;color:var(--a3);-webkit-text-fill-color:currentColor}
.steps h3{font:600 24px/1.15 var(--f-display);letter-spacing:0}
.ftr{background:transparent;border-top:1px solid var(--line)}

/* ---------- окна ---------- */
dialog::backdrop{background:color-mix(in srgb,#14110D 46%,transparent);backdrop-filter:blur(8px)}
.modal .m-box,.m-box{background:var(--panel)!important;border:1px solid var(--line)!important;box-shadow:0 40px 100px -40px rgba(20,17,13,.55)!important;border-radius:var(--r-l);backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
.d-box{background:var(--panel)}
.x{background:transparent;border-color:var(--line-2)}
.m-title,.d-head h2{font:500 clamp(26px,3vw,34px)/1.05 var(--f-display)!important;letter-spacing:0}
.opt,.coin,.consent,.co-sum,.ach{background:transparent;border-color:var(--line-2);border-radius:var(--r-m)}
.opt[aria-pressed="true"],.coin[aria-pressed="true"]{border-color:var(--fg);box-shadow:0 0 0 1px var(--fg);background:var(--glass)}
.consent input{accent-color:var(--fg)}
.co-th{width:38px;height:38px;border-radius:8px;object-fit:cover;flex:none}
.fp-btn{margin-top:10px}
.spin{background:conic-gradient(var(--a1),var(--a2),var(--a1))}
.okmark{box-shadow:none;color:#fff;font-family:var(--f-body)}
.saved{font:500 clamp(30px,3.8vw,46px)/1.1 var(--f-display);letter-spacing:0}
.toast{background:var(--fg)!important;color:var(--bg)!important;border:0!important;border-radius:999px;box-shadow:var(--sh)!important;font-weight:500}
.toast .emo{display:none}
input:not([type=checkbox]):not([type=radio]):not([type=range]),select{border-radius:10px}

/* механики */
.mx-head{background:var(--panel)!important}
.mx-pts-big{background:var(--glass)!important;border-radius:var(--r-m)!important}
.mx-pts-big b{color:var(--fg);font:500 34px/1 var(--f-display)}
.mx-h{font:600 11.5px/1.2 var(--f-body)!important;letter-spacing:.2em}
.mx-ch,.mx-th,.mx-rt li,.pd-ship,.pd-sim{background:var(--glass)!important;border-radius:var(--r-m)!important}
.mx-ic{background:transparent!important}
.mx-bar{background:var(--glass-2)!important;height:2px!important}
.mx-rw,.mx-rt-me,.pd-sim small{color:var(--a3);font-family:var(--f-body);font-weight:600}
.mx-rt li.me{background:var(--glass-2)!important}
.mx-pos,.mx-rt b{font-family:var(--f-mono);font-weight:600}
.mx-help{border-color:var(--line-2)!important;font-family:var(--f-body)}
.mx-card-wrap{border:1px solid var(--line)!important;box-shadow:var(--sh)!important;border-radius:6px!important}
.pd-ph{background:var(--panel-2)!important}
.pd-th{background:var(--panel-2)!important}
.pd-th.on{box-shadow:inset 0 0 0 1.5px var(--fg)!important}
.pd-tabs button[aria-selected="true"]{border-bottom-color:var(--fg)}
.pd-stock{height:2px}

/* «Оплатит друг» */
.fp-wrap{margin:16px 22px 0;display:grid;place-items:center;padding:22px;border-radius:var(--r-m);background:var(--panel-2)}
.fp-wrap canvas{display:block;width:min(100%,340px);height:auto;box-shadow:0 30px 60px -30px rgba(20,17,13,.6);animation:fpin .7s cubic-bezier(.2,.8,.2,1) both}
@keyframes fpin{from{opacity:0;transform:translateY(18px) rotate(-2deg)}}
.fp-msg{margin:16px 22px 0;padding:14px 16px;border-left:2px solid var(--a1);background:var(--glass);font:500 14.5px/1.55 var(--f-body);color:var(--fg);border-radius:0 8px 8px 0}
.fp-reveal{font-size:16px!important;color:var(--fg)!important;margin-bottom:6px}
a.btn{text-decoration:none}

.tile .t-c{left:14px;right:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tile .t-n{left:14px;right:14px}
.opts:not(.three) .opt:last-child:nth-child(odd){grid-column:1/-1}
.opts.three:has(.opt:nth-child(2):last-child){grid-template-columns:1fr 1fr}
