/* ==== pages.css — дэд хуудсууд ба нийтлэг нэмэлт ====
   0 · Нийтлэг: нав холбоос, утасны доод цэс, загварын тэмдэг, алдааны бичиг
   1 · Сугалааны дэлгэрэнгүй (lot.html)
   2 · Худалдан авах самбар
   3 · Дугаар шалгах (check.html)
   4 · Тохирол (draw.html)
   Бүх өнгө site.css-ийн хувьсагчаас — шууд hex зөвхөн цагаан/хар гадаргуунд. */

/* ==== 0 · НИЙТЛЭГ ==== */
.err{color:#FF8A80}
.adm-link{display:inline-block;padding-block:12px;color:var(--muted)}
.foot{display:flex;justify-content:space-between;gap:6px 16px;flex-wrap:wrap;align-items:center}
.foot a{color:inherit}
.foot a[href^="tel"]{display:inline-block;padding-block:12px}
/* Сугалааны нэмэлт зургууд */
.thumbs{display:flex;gap:8px;margin-top:16px;overflow-x:auto;scrollbar-width:none}
.thumbs button{flex:1 1 0;max-width:72px;min-width:44px;aspect-ratio:3/2;height:auto;padding:0;border-radius:10px;overflow:hidden;border:2px solid transparent;background:none;cursor:pointer;opacity:.7;transition:opacity .2s,border-color .2s}
.thumbs button[aria-current="true"]{border-color:var(--cyan);opacity:1}
.thumbs img{width:100%;height:100%;object-fit:cover}
.lot-img{transition:opacity .22s}
/* hidden шинж чанарыг .form{display:flex} гэх мэт дүрэм дарж болохгүй */
[hidden]{display:none!important}
/* Товшилтын талбай ≥ 40px (veb-standart §7) */
.wm{display:inline-flex;align-items:center;gap:.45em;padding-block:12px}
.field input{min-height:46px}
/* Цэг өөрөө жижиг, товшилтын талбай нь том: харагдах хэсэг ::before-д */
.dots{gap:0;flex-wrap:wrap}
.dots button,.dots button[aria-current="true"]{width:auto;height:auto;padding:16px 5px;background:none;box-shadow:none}
.dots button::before{content:"";display:block;width:8px;height:8px;border-radius:4px;background:rgba(255,255,255,.35);transition:width .4s var(--ease),background .4s}
.dots button[aria-current="true"]::before{width:28px;background:var(--cyan);box-shadow:0 0 12px color-mix(in srgb,var(--cyan) 70%,transparent)}
.crumbs a{padding-block:10px}
.links a{white-space:nowrap}
a.search{text-decoration:none}
a.icon-btn{text-decoration:none}
/* Карт бүхэлдээ товшигдоно — товчны ::after картыг бүрхэнэ */
a.c-btn{text-decoration:none}
a.c-btn::after{content:"";position:absolute;inset:0;border-radius:inherit}
.demo-flag{display:inline-flex;align-items:center;gap:8px;font:700 .75rem/1.3 var(--f-t);letter-spacing:.06em;text-transform:uppercase;color:#FFD27A;background:rgba(255,190,80,.1);border:1px solid rgba(255,190,80,.3);padding:7px 11px;border-radius:var(--pill);margin-bottom:16px}
.demo-flag::before{content:"";width:6px;height:6px;border-radius:50%;background:#FFD27A}
.panel{border:1px solid var(--line-2);border-radius:var(--r);padding:20px;background:linear-gradient(180deg,var(--bg-2),var(--panel))}
.h3{font:600 1.2rem/1.2 var(--f-d);text-transform:uppercase;letter-spacing:.02em;margin-bottom:14px}
.more{display:inline-block;margin-top:6px;color:var(--cyan);font-weight:700;text-decoration:none;padding-block:12px}
.link{appearance:none;background:none;border:0;color:var(--muted);font:600 .88rem var(--f-t);cursor:pointer;padding:12px 0 2px;display:block;margin:0 auto}
.link:hover{color:var(--ink)}
.wide{width:100%;justify-content:center}

/* Утасны доод цэс — нав дээрх холбоос утсанд нуугддаг тул энд гарна (апп шиг) */
.tabbar{display:none}
@media (max-width:900px){
  body{padding-bottom:calc(68px + env(safe-area-inset-bottom,0px))}
  .tabbar{display:grid;grid-template-columns:repeat(4,1fr);position:fixed;left:0;right:0;bottom:0;z-index:20;
    padding:6px max(8px,env(safe-area-inset-left,0px)) calc(6px + env(safe-area-inset-bottom,0px));
    background:rgba(20,21,24,.9);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-top:1px solid var(--line)}
  .tabbar a{display:grid;justify-items:center;gap:4px;padding:6px 0;min-height:52px;color:var(--muted);text-decoration:none;font:700 .75rem/1 var(--f-t)}
  .tabbar svg{width:22px;height:22px}
  .tabbar a[aria-current="page"]{color:var(--cyan)}
  .tabbar a[aria-current="page"] svg{filter:drop-shadow(0 0 8px color-mix(in srgb,var(--cyan) 60%,transparent))}
}

/* Утсан дээр «Идэвхтэй сугалаанууд» гарчиг ба тоо нэг мөрөнд */
@media (max-width:560px){.row-head .h2{font-size:1.3rem;flex-wrap:nowrap}.arrows{display:none}}

/* ==== 1 · СУГАЛААНЫ ДЭЛГЭРЭНГҮЙ ==== */
.lot-hero{position:relative;min-height:clamp(380px,58vh,620px);display:grid;align-items:end;overflow:hidden;padding:0;border-bottom:1px solid var(--line)}
.lot-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:60% 55%;animation:lotIn 1.6s var(--ease) both}
@keyframes lotIn{from{transform:scale(1.08);opacity:0}to{transform:none;opacity:1}}
.lot-hero::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,var(--bg) 0%,rgba(24,25,28,.55) 34%,transparent 62%),linear-gradient(90deg,rgba(18,19,22,.7),transparent 55%);pointer-events:none}
.lot-hero-in{position:relative;z-index:1;width:100%;padding-block:40px 34px}
.crumbs{display:flex;align-items:center;gap:8px;font:600 .82rem var(--f-t);color:#C3C8CF;margin-bottom:14px}
.crumbs a{color:inherit;text-decoration:none;display:inline-block;padding-block:11px}
.crumbs a:hover{color:var(--cyan)}
.lot-name{font:700 clamp(2.2rem,6vw,4.4rem)/1 var(--f-d);text-transform:uppercase;letter-spacing:.01em;max-width:14ch;filter:drop-shadow(0 6px 24px rgba(0,0,0,.6))}
.lot-chips{display:flex;gap:10px;flex-wrap:wrap;margin-top:16px}
.lot-chips span{font:600 .82rem/1 var(--f-t);color:#D3D7DD;background:rgba(10,12,14,.55);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid var(--line-2);border-radius:var(--pill);padding:9px 14px}
.lot-chips b{font:600 1.1rem/1 var(--f-d);color:var(--cyan);margin-left:4px}

.lot-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,400px);gap:24px;align-items:start;padding-block:32px 24px}
@media (max-width:900px){.lot-grid{grid-template-columns:1fr}.buy{order:-1}}
.lot-info{display:grid;gap:16px}
.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:14px}
.stats small{display:block;color:var(--muted);font-size:.8rem}
.stats b{font:600 clamp(1.3rem,3.4vw,1.8rem)/1.1 var(--f-d);letter-spacing:.02em}
.bar.big{height:10px;background:rgba(255,255,255,.08)}
.bar.big span{transition:width 1.6s var(--ease)}
.duo{display:grid;grid-template-columns:1fr 1fr;gap:16px}
@media (max-width:620px){.duo{grid-template-columns:1fr}}
.ic{display:flex;gap:14px;align-items:flex-start}
.ic svg{flex:none;width:34px;height:34px;color:var(--cyan);filter:drop-shadow(0 0 8px color-mix(in srgb,var(--cyan) 50%,transparent))}
.ic b{display:block;font:600 1.05rem/1.2 var(--f-d);text-transform:uppercase;letter-spacing:.02em}
.ic p{margin:4px 0 0;color:var(--muted);font-size:.9rem}
.fair{list-style:none;margin:0;padding:0;display:grid;gap:12px;counter-reset:f}
.fair li{counter-increment:f;display:grid;grid-template-columns:34px 1fr;column-gap:12px}
.fair li::before{content:counter(f);grid-row:span 2;width:34px;height:34px;border-radius:50%;display:grid;place-items:center;font:600 1rem/1 var(--f-d);color:var(--on-cyan);background:linear-gradient(180deg,var(--cyan),var(--cyan-2))}
.fair b{font-weight:800}
.fair span{color:var(--muted);font-size:.9rem}
.others-sec{padding-block:24px 56px}
.others{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(220px,1fr);gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:8px;scrollbar-width:thin}
.o-card{scroll-snap-align:start;position:relative;display:block;border-radius:var(--r);overflow:hidden;aspect-ratio:4/3;color:var(--ink);text-decoration:none;border:1px solid var(--line-2);transition:border-color .3s,transform .3s var(--ease)}
.o-card:hover{border-color:var(--cyan);transform:translateY(-3px)}
.o-card img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.o-card::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(10,11,13,.92) 0%,transparent 60%)}
.o-b{position:absolute;left:12px;right:12px;bottom:10px;z-index:1;display:grid;gap:2px}
.o-b small{font:700 .75rem var(--f-t);color:var(--cyan);letter-spacing:.06em}
.o-b b{font:600 1.05rem/1.15 var(--f-d);text-transform:uppercase}
.o-b i{font-style:normal;font-size:.8rem;color:#C3C8CF}

/* ==== 2 · ХУДАЛДАН АВАХ САМБАР ====
   Компьютерт баруун талд наалддаг (sticky); утсанд мэдээллээс дээр гарна. */
.buy{position:sticky;top:84px;border-radius:20px;padding:20px;background:linear-gradient(180deg,#24272C,#1B1D21);border:1px solid color-mix(in srgb,var(--cyan) 35%,var(--line-2));box-shadow:0 30px 60px -30px rgba(0,0,0,.9),0 0 40px -18px color-mix(in srgb,var(--cyan) 60%,transparent)}
@media (max-width:900px){.buy{position:relative;top:0}}
.b-step{display:flex;align-items:center;gap:10px;font:800 .92rem var(--f-t);margin:18px 0 10px}
.b-step:first-of-type{margin-top:4px}
.b-n{width:24px;height:24px;border-radius:50%;display:grid;place-items:center;font:600 .82rem/1 var(--f-d);color:var(--on-cyan);background:var(--cyan)}
.qty{display:grid;grid-template-columns:52px 1fr 52px;gap:8px}
.q-btn{appearance:none;border:1px solid var(--line-2);background:rgba(255,255,255,.04);color:var(--ink);border-radius:14px;font:500 1.5rem/1 var(--f-t);cursor:pointer;min-height:52px;transition:border-color .2s,background .2s}
.q-btn:hover{border-color:var(--cyan);background:color-mix(in srgb,var(--cyan) 10%,transparent)}
.qty input{min-width:0;text-align:center;border:1px solid var(--line-2);background:rgba(0,0,0,.3);color:var(--ink);border-radius:14px;font:600 1.6rem/1 var(--f-d);outline:none}
.qty input:focus{border-color:var(--cyan)}
.q-quick{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:8px}
.q-quick button{appearance:none;border:1px solid var(--line-2);background:none;color:var(--muted);border-radius:var(--pill);min-height:40px;font:700 .88rem var(--f-t);cursor:pointer;transition:all .2s}
.q-quick button[aria-pressed="true"]{color:var(--on-cyan);background:var(--cyan);border-color:var(--cyan)}
.buy .field{flex:none}
.buy .note{margin:8px 2px 0}
.seg{display:grid;grid-template-columns:1fr 1fr;gap:4px;padding:4px;border-radius:var(--pill);background:rgba(0,0,0,.35);border:1px solid var(--line-2)}
.seg button{appearance:none;border:0;background:none;color:var(--muted);border-radius:var(--pill);min-height:42px;font:800 .9rem var(--f-t);cursor:pointer;transition:background .3s,color .3s}
.seg button[aria-selected="true"]{background:linear-gradient(180deg,var(--cyan),var(--cyan-2));color:var(--on-cyan)}
.total{display:flex;justify-content:space-between;align-items:baseline;margin:20px 2px 12px;padding-top:16px;border-top:1px solid var(--line)}
.total span{color:var(--muted)}
.total b{font:600 1.9rem/1 var(--f-d);letter-spacing:.02em}
.buy .msg{text-align:center;margin-top:10px}
.qr-wrap{position:relative;width:min(240px,100%);margin:6px auto 14px;padding:12px;border-radius:18px;background:#fff;box-shadow:0 0 0 4px color-mix(in srgb,var(--cyan) 40%,transparent),0 20px 40px -20px rgba(0,0,0,.8)}
.qr svg{display:block;width:100%;height:auto}
.qr-tag{position:absolute;left:50%;bottom:-11px;translate:-50% 0;font:700 .75rem/1 var(--f-t);color:var(--on-cyan);background:var(--cyan);padding:5px 10px;border-radius:var(--pill);white-space:nowrap}
.pay-hint{text-align:center;color:#C9CED5;margin:14px 0}
.wait{display:flex;align-items:center;justify-content:center;gap:10px;color:var(--muted);font-weight:700;margin-bottom:14px}
.wait i{width:10px;height:10px;border-radius:50%;background:var(--cyan);animation:pulse 1.2s ease-in-out infinite}
@keyframes pulse{0%,100%{box-shadow:0 0 0 0 color-mix(in srgb,var(--cyan) 60%,transparent)}50%{box-shadow:0 0 0 8px transparent}}
.acc{margin:0 0 12px;display:grid;gap:8px}
.acc div{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:10px 12px;border-radius:12px;background:rgba(255,255,255,.04);border:1px solid var(--line)}
.acc dt{color:var(--muted);font-size:.85rem}
.acc dd{margin:0;display:flex;align-items:center;gap:8px;font:600 1.02rem/1.2 var(--f-d);letter-spacing:.04em;text-align:right}
.acc em{font:700 .75rem var(--f-t);font-style:normal;color:#FFD27A;letter-spacing:0}
.acc .hl{border-color:var(--cyan);background:color-mix(in srgb,var(--cyan) 10%,transparent)}
.acc .hl dd{font-size:1.3rem;color:var(--cyan)}
.copy{appearance:none;border:1px solid var(--line-2);background:none;color:var(--ink);border-radius:var(--pill);padding:0 10px;min-height:32px;font:700 .75rem var(--f-t);cursor:pointer}
.copy:hover{border-color:var(--cyan)}
.done-ic{width:64px;height:64px;margin:4px auto 10px;border-radius:50%;display:grid;place-items:center;color:var(--on-cyan);background:linear-gradient(180deg,var(--cyan),var(--cyan-2));box-shadow:0 0 30px color-mix(in srgb,var(--cyan) 60%,transparent);animation:pop .6s var(--ease) both}
.done-ic svg{width:32px;height:32px}
@keyframes pop{from{transform:scale(.4);opacity:0}}
.done-h{text-align:center;font:600 1.5rem/1.1 var(--f-d);text-transform:uppercase;margin-bottom:14px}
.tix{display:flex;flex-wrap:wrap;gap:6px;justify-content:center}
.tix span{font:600 1.3rem/1 var(--f-d);letter-spacing:.08em;padding:10px 12px;border-radius:10px;color:var(--cyan);background:color-mix(in srgb,var(--cyan) 10%,transparent);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--cyan) 40%,transparent);animation:tixIn .5s var(--ease) both;animation-delay:calc(var(--i,0) * 70ms)}
@keyframes tixIn{from{transform:translateY(10px) scale(.9);opacity:0}}
.sms{margin:16px 0;padding:12px 14px;border-radius:18px 18px 18px 4px;background:#2C3036;border:1px solid var(--line-2)}
.sms small{color:var(--muted);font-size:.75rem}
.sms p{margin:4px 0 0;font-size:.9rem}

/* ==== 3 · ДУГААР ШАЛГАХ ==== */
.page-head{padding-block:48px 24px;border-bottom:1px solid var(--line);background:radial-gradient(60% 120% at 100% 0%,color-mix(in srgb,var(--cyan) 14%,transparent),transparent 60%)}
.page-h{font:700 clamp(2.2rem,5.4vw,3.6rem)/1 var(--f-d);text-transform:uppercase}
.page-sub{color:var(--muted);max-width:52ch;margin:12px 0 22px}
.seg-lg{max-width:440px;margin-bottom:14px}
.big-form{max-width:640px}
.field.sel{flex:1 1 100%;min-width:0}
.field select{flex:1;min-width:0;width:100%;text-overflow:ellipsis;border:0;background:transparent;color:var(--ink);font:600 .95rem var(--f-t);outline:none;min-height:48px}
.field select option{background:#202226}
.res-sec{padding-block:28px 56px}
.sum{color:var(--muted);margin:0 0 14px}
.sum b{color:var(--ink);font:600 1.15rem var(--f-d)}
.grp{display:grid;grid-template-columns:220px 1fr;border-radius:var(--r);overflow:hidden;border:1px solid color-mix(in srgb,var(--cyan) 40%,var(--line-2));background:var(--panel);margin-bottom:14px;animation:tixIn .6s var(--ease) both;animation-delay:calc(var(--gi,0) * 90ms)}
.grp img{width:100%;height:100%;min-height:150px;object-fit:cover}
.grp-b{padding:16px 18px}
.grp-b small{color:var(--cyan);font:700 .75rem var(--f-t);letter-spacing:.06em}
.grp-b h3{font:600 1.3rem/1.15 var(--f-d);text-transform:uppercase;margin:4px 0 12px}
.grp .tix{justify-content:flex-start}
.grp-f{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;margin-top:14px;font-size:.85rem}
.grp-f a{color:var(--cyan);font-weight:700;text-decoration:none;padding-block:8px}
.st{display:inline-flex;align-items:center;gap:8px;color:var(--muted)}
.st i{width:8px;height:8px;border-radius:50%;background:#FFD27A}
.owner{margin:14px 0 4px}
.codes{max-width:640px;margin-top:10px;line-height:1.7}
.codes b{color:var(--cyan)}
.grp.one{max-width:640px}
@media (max-width:620px){.grp{grid-template-columns:1fr}.grp img{height:150px}}

/* ==== 4 · ТОХИРОЛ ==== */
.near{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
@media (max-width:1000px){.near{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:620px){.near{grid-template-columns:1fr}}
.n-card{position:relative;display:flex;align-items:center;gap:14px;padding:14px;border-radius:var(--r);overflow:hidden;text-decoration:none;color:var(--ink);border:1px solid var(--line-2);background:var(--panel);min-height:108px;transition:border-color .3s,transform .3s var(--ease)}
.n-card:hover{border-color:var(--cyan);transform:translateY(-3px)}
.n-card img{position:absolute;right:0;top:0;width:55%;height:100%;object-fit:cover;opacity:.55;-webkit-mask:linear-gradient(90deg,transparent,#000 70%);mask:linear-gradient(90deg,transparent,#000 70%)}
.ring{position:relative;z-index:1;flex:none;width:64px;height:64px;display:grid;place-items:center}
.ring svg{position:absolute;inset:0;transform:rotate(-90deg)}
.ring circle{fill:none;stroke:rgba(255,255,255,.1);stroke-width:4}
.ring circle.v{stroke:var(--cyan);stroke-linecap:round;stroke-dasharray:var(--pp) 100;filter:drop-shadow(0 0 4px var(--cyan))}
.ring b{font:600 1rem/1 var(--f-d)}
.n-b{position:relative;z-index:1;display:grid;gap:2px;text-shadow:0 1px 8px rgba(0,0,0,.7)}
.n-b small{color:var(--cyan);font:700 .75rem var(--f-t);letter-spacing:.06em}
.n-b b{font:600 1.1rem/1.15 var(--f-d);text-transform:uppercase;max-width:12ch}
.n-b i{font-style:normal;font-size:.8rem;color:#C3C8CF}
.fair-lg{grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.fair-lg li{display:block;border:1px solid var(--line-2);border-radius:var(--r);padding:18px;background:var(--panel)}
.fair-lg li::before{margin-bottom:12px}
.fair-lg b{display:block;font:600 1.05rem/1.2 var(--f-d);text-transform:uppercase;margin-bottom:6px}
@media (max-width:1000px){.fair-lg{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.fair-lg{grid-template-columns:1fr}}
.extra{display:flex;align-items:center;gap:18px;margin-top:16px;border-color:color-mix(in srgb,var(--cyan) 40%,var(--line-2))}
.ex-n{flex:none;font:700 2.6rem/1 var(--f-d);color:var(--cyan);text-shadow:0 0 20px color-mix(in srgb,var(--cyan) 50%,transparent)}
.extra p{margin:4px 0 0;color:var(--muted)}
.extra p b{color:var(--ink)}
.past{margin-top:14px;border:1px dashed var(--line-2);border-radius:var(--r);padding:18px;opacity:.75}
.sample-tag{display:inline-block;font:700 .75rem var(--f-t);color:#FFD27A;margin-bottom:12px}
.past-row{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
@media (max-width:620px){.past-row{grid-template-columns:1fr 1fr}}
.past small,.hash small{display:block;color:var(--muted);font-size:.75rem}
.past b{font:600 1.05rem/1.2 var(--f-d)}
.past .win{color:var(--cyan);font-size:1.4rem;letter-spacing:.08em}
.hash{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:14px;padding-top:14px;border-top:1px solid var(--line)}
.hash code{font:500 .85rem ui-monospace,Consolas,monospace;color:#C3C8CF}
.hash a{color:var(--muted);font-size:.85rem;pointer-events:none;padding-block:6px}
section > .wrap > .h2:first-child,section.wrap > .h2{margin-top:0}
section.wrap{padding-block:36px 8px}

/* ==== 5 · ЗАРЛАЛ, ТООЛУУР, ҮЗҮҮЛЭЛТ, ШУУД ДАМЖУУЛАЛТ, АСУУЛТ, СОШИАЛ ==== */
/* Дээд талын зарлалын мөр — машины өнгөөр, гүйдэг гэрэлтэй */
.ann{position:relative;overflow:hidden;display:flex;align-items:center;justify-content:center;gap:10px;flex-wrap:wrap;padding:8px 16px;font:700 .82rem/1.3 var(--f-t);text-align:center;color:var(--on-cyan);background:linear-gradient(90deg,var(--cyan-2),var(--cyan),var(--cyan-2))}
.ann::after{content:"";position:absolute;inset:0;background:linear-gradient(100deg,transparent 30%,rgba(255,255,255,.35) 50%,transparent 70%);transform:translateX(-100%);animation:annShine 4.5s ease-in-out infinite;pointer-events:none}
@keyframes annShine{60%,100%{transform:translateX(100%)}}
.ann a{color:inherit;text-decoration:underline;text-underline-offset:3px;display:inline-block;padding-block:9px;margin-block:-6px}
.ann-dot{width:8px;height:8px;border-radius:50%;background:currentColor;animation:pulse 1.4s ease-in-out infinite}

/* Тоолуур: цифр солигдох бүрд дээрээс доош эргэнэ */
.cd{display:flex;gap:8px}
.cd-u{display:grid;justify-items:center;gap:4px;min-width:54px;padding:10px 6px 8px;border-radius:12px;background:rgba(255,255,255,.05);border:1px solid var(--line-2)}
.cd-u b{font:600 1.7rem/1 var(--f-d);letter-spacing:.04em;color:var(--ink);display:block}
.cd-u small{font:700 .75rem var(--f-t);color:var(--muted)}
.cd b.flip{animation:flip .45s var(--ease)}
@keyframes flip{from{transform:translateY(-55%) rotateX(70deg);opacity:0;color:var(--cyan)}}
.cd-sm{gap:4px;margin-top:2px}
.cd-sm .cd-u{min-width:0;padding:0;background:none;border:0;display:inline-flex;align-items:baseline;gap:2px}
.cd-sm .cd-u b{font-size:1.5rem;color:var(--ink)}
.cd-sm .cd-u small{font-size:.75rem}
.cd.done{opacity:.5}

/* Машины үзүүлэлт */
.hero-spec{margin:10px 0 0!important;font:600 .95rem var(--f-t);color:#D3D7DD;letter-spacing:.02em}
.hero-spec:empty{display:none}
.c-spec{font-size:.8rem;color:var(--metal-muted);margin-top:-4px}
.c-cnt{font:600 .8rem var(--f-d);letter-spacing:.03em;color:var(--metal-muted);text-align:right;margin-top:-4px}
.lot-spec{margin:10px 0 0;font:600 1rem var(--f-t);color:#D3D7DD}
.lot-spec:empty{display:none}
.lot-cd{display:grid;gap:8px;margin-top:16px;padding-top:14px;border-top:1px solid var(--line)}
.lot-cd small{color:var(--muted);font-weight:700}
@media (max-width:420px){.cd-u{min-width:0;flex:1}.cd-u b{font-size:1.4rem}}

/* Шууд дамжуулалт */
.live{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:24px;align-items:center;padding:clamp(14px,2vw,20px);border:1px solid var(--line-2);border-radius:20px;background:radial-gradient(80% 120% at 0% 100%,color-mix(in srgb,var(--cyan) 12%,transparent),transparent 60%),var(--panel)}
@media (max-width:860px){.live{grid-template-columns:1fr}}
.live-media{position:relative;aspect-ratio:16/9;border-radius:14px;overflow:hidden;background:#000}
.live-media iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.live-ph{position:absolute;inset:0;background:center/cover;display:grid;place-items:center}
.live-ph::before{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(10,11,13,.85),rgba(10,11,13,.35))}
.live-play{position:relative;width:76px;height:76px;border-radius:50%;display:grid;place-items:center;color:var(--on-cyan);background:var(--cyan);box-shadow:0 0 0 10px color-mix(in srgb,var(--cyan) 25%,transparent),0 0 40px var(--cyan);animation:livePulse 2.4s ease-in-out infinite}
.live-play svg{width:30px;height:30px;margin-left:4px}
@keyframes livePulse{50%{box-shadow:0 0 0 18px color-mix(in srgb,var(--cyan) 10%,transparent),0 0 60px var(--cyan)}}
.live-tag{position:absolute;left:12px;bottom:12px;font:700 .75rem var(--f-t);padding:6px 10px;border-radius:var(--pill);background:rgba(0,0,0,.6)}
.live-tag::before{content:"";display:inline-block;width:7px;height:7px;border-radius:50%;background:#FF4D4D;margin-right:6px;animation:pulse 1.2s infinite}
.live-b{display:grid;gap:10px;justify-items:start}
.live-b .kicker{margin:0}
.live-h{font:700 clamp(1.8rem,3.6vw,2.6rem)/1.05 var(--f-d);text-transform:uppercase}
.live-h em{font-style:normal;color:var(--cyan)}
.live-b p{margin:0;color:var(--muted)}
.live-next{color:#D3D7DD!important}

/* Түгээмэл асуулт */
.faq-wrap{max-width:860px}
.faq{display:grid;gap:8px}
.faq-i{border:1px solid var(--line-2);border-radius:var(--r);background:var(--panel);transition:border-color .3s}
.faq-i[open]{border-color:color-mix(in srgb,var(--cyan) 45%,var(--line-2))}
.faq-i summary{list-style:none;display:flex;justify-content:space-between;align-items:center;gap:12px;padding:16px 18px;min-height:52px;font-weight:800;cursor:pointer}
.faq-i summary::-webkit-details-marker{display:none}
.faq-i summary i{position:relative;flex:none;width:16px;height:16px}
.faq-i summary i::before,.faq-i summary i::after{content:"";position:absolute;left:0;right:0;top:7px;height:2px;border-radius:1px;background:var(--cyan);transition:transform .3s var(--ease)}
.faq-i summary i::after{transform:rotate(90deg)}
.faq-i[open] summary i::after{transform:rotate(0)}
.faq-i p{margin:0;padding:0 18px 16px;color:var(--muted)}

/* Сошиал */
.soc{display:flex;gap:4px}
.soc a{width:40px;height:40px;display:grid;place-items:center;border-radius:50%;color:var(--muted);transition:color .2s,background .2s}
.soc a:hover{color:var(--cyan);background:rgba(255,255,255,.05)}
.soc svg{width:22px;height:22px}

/* ==== 6 · МАШИНЫ МЭДЭЭЛЭЛ ==== */
.specs{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px;margin:0}
.specs div{padding:12px 14px;border-radius:12px;background:rgba(255,255,255,.04);border:1px solid var(--line);box-shadow:inset 3px 0 0 color-mix(in srgb,var(--cyan) 60%,transparent);animation:tixIn .5s var(--ease) both;animation-delay:calc(var(--i,0) * 50ms)}
.specs dt{font:700 .75rem var(--f-t);letter-spacing:.04em;color:var(--muted)}
.specs div{min-width:0}
.specs dd{margin:4px 0 0;font:600 1.1rem/1.2 var(--f-d);letter-spacing:.02em;overflow-wrap:anywhere}
.car-desc{margin:14px 0 0;color:#C9CED5;line-height:1.65}
@media (max-width:420px){.specs{grid-template-columns:repeat(2,minmax(0,1fr))}.specs dd{font-size:1rem}}

/* Өмнөх тохирлын бодит бичлэг */
.past.real{opacity:1;border-style:solid;border-color:color-mix(in srgb,var(--cyan) 40%,var(--line-2));margin-top:0;margin-bottom:12px}
.ex-wins{margin-top:12px}
.ex-wins small{display:block;color:var(--muted);font-size:.75rem;margin-bottom:6px}
.ex-wins div{display:flex;flex-wrap:wrap;gap:6px}
.ex-wins span{display:grid;padding:6px 10px;border-radius:10px;background:rgba(255,255,255,.04);font-size:.75rem;color:var(--muted)}
.ex-wins b{font:600 .95rem var(--f-d);color:var(--ink);letter-spacing:.04em}
.past.real .hash code{word-break:break-all}

/* Борлуулалт хаагдсан */
.closed{display:grid;gap:10px;text-align:center;padding:10px 0}
.closed b{font:700 1.5rem/1.1 var(--f-d);text-transform:uppercase;color:var(--cyan)}
.closed p{margin:0;color:var(--muted)}

/* ==== ЛОГО ТЭМДЭГ ====
   Захиалагчийн логоноос салгасан машин + зам + од (img/logo-emblem.webp, тунгалаг дэвсгэр).
   Зургийг маск болгож, өнгийг нь машины --cyan → --cyan-2 өнгөөр будна → машин солигдоход лого дагаж хувирна.
   Гялбаа: өнгөний градиент зөөлөн гүйнэ (хөдөлгөөн багасгах тохиргоотой үед зогсоно). */
.wm-ic{flex:none;width:3.1em;height:1.46em;margin-block:-.2em;
  background:linear-gradient(110deg,var(--cyan) 0%,var(--cyan-2) 38%,color-mix(in srgb,var(--cyan-l) 55%,#fff) 50%,var(--cyan-2) 62%,var(--cyan) 100%) 0 0/260% 100%;
  -webkit-mask:url(img/logo-emblem.webp) center/contain no-repeat;mask:url(img/logo-emblem.webp) center/contain no-repeat;
  filter:drop-shadow(0 0 8px color-mix(in srgb,var(--cyan) 55%,transparent));animation:wm-shine 6s ease-in-out infinite}
@keyframes wm-shine{0%,60%{background-position:100% 0}90%,100%{background-position:0 0}}
@media (prefers-reduced-motion:reduce){.wm-ic{animation:none;background-position:100% 0}}
@media (max-width:360px){.wm-ic{width:2.6em;height:1.22em}}

/* ==== КАРТЫН «ТАСАЛБАР АВАХ» ТОВЧ — машины өнгөөр дүүргэсэн, бараан бичигтэй (админы «Засах» товчтой ижил хэв маяг, 2026-10-25) ====
   Өмнөх хувилбар: хар бал + машины өнгөт гэрэл (C). --car, --car2: карт бүрт index.js-ээс тухайн машины өнгө. Хөдөлгөөн (долгио) нь cta.css-д. */
.card .c-btn{background:linear-gradient(180deg,color-mix(in srgb,var(--car,var(--cyan)) 82%,#fff),var(--car,var(--cyan)));color:#101215;
  box-shadow:0 0 0 1.5px var(--car,var(--cyan)),0 0 18px -4px var(--car,var(--cyan))}
.card .c-btn:hover,.card:hover .c-btn{background:linear-gradient(180deg,color-mix(in srgb,var(--car,var(--cyan)) 68%,#fff),color-mix(in srgb,var(--car,var(--cyan)) 90%,#fff));color:#101215;
  box-shadow:0 0 0 2px var(--car,var(--cyan)),0 0 26px -2px var(--car,var(--cyan))}
.card .c-btn.off{background:linear-gradient(180deg,#B6BBC3,#8E949D);color:var(--metal-ink);box-shadow:none}

/* ==== «БУЦАХ» ТОВЧ (дэд хуудсууд) — лого дээр дарж буцдагийг олон хүн мэддэггүй тул ====
   Сум + «Буцах» бичиг; 375px-ээс нарийн утсанд зөвхөн дугуй сум (толгой хэсэгт багтаахын тулд) */
.back{display:inline-flex;align-items:center;gap:8px;min-height:42px;padding:0 16px 0 12px;margin-right:-6px;border-radius:var(--pill);
  border:1px solid var(--line-2);color:var(--ink);font:700 .88rem/1 var(--f-t);text-decoration:none;flex:none;
  transition:border-color .2s,background .2s,transform .2s}
.back svg{width:18px;height:18px;transition:transform .25s var(--ease)}
.back:hover{border-color:var(--cyan);background:color-mix(in srgb,var(--cyan) 12%,transparent)}
.back:hover svg{transform:translateX(-3px)}
.back:active{transform:scale(.96)}
@media (max-width:560px){.back{padding:0 12px 0 10px;gap:6px;margin-right:-10px}}
@media (max-width:374px){.back{width:42px;padding:0;justify-content:center}.back span{display:none}}
/* Таблет, жижиг дэлгэцтэй компьютерт цэс + хайлт + буцах багтахгүй тул буцах товч дугуй сум болно */
@media (min-width:561px) and (max-width:1180px){.back{width:42px;padding:0;justify-content:center;margin-right:-8px}.back span{display:none}.nav:has(.back) .wrap{gap:14px}}

/* ==== «ТУН УДАХГҮЙ» СУГАЛАА (soon:1) — сайтад харагдана, тасалбар зарахгүй (2026-10-25) ====
   Нүүрний карт: зураг бага зэрэг бүдэг, дээр нь шар тэмдэг; товч саарал «Тун удахгүй»; явцын мөрөнд судал (хөдөлгөөн нь cta.css-д).
   Сугалааны хуудас: тоо, мөр нуугдаж, худалдан авах маягтын оронд мэдэгдэл + нээлттэй сугалааны товч. */
.card.soon .c-img img{filter:saturate(.55) brightness(.92);opacity:.82}
.card.soon:hover .c-img img{filter:none;opacity:1}
.c-soon{position:absolute;right:10px;top:10px;display:inline-flex;align-items:center;gap:6px;font:700 .74rem/1 var(--f-t);letter-spacing:.06em;text-transform:uppercase;
  padding:7px 10px;border-radius:var(--pill);color:#1A1406;background:linear-gradient(180deg,#FFD978,#F2B53A);box-shadow:0 4px 14px -4px rgba(242,181,58,.7)}
.c-soon::before{content:"";width:6px;height:6px;border-radius:50%;background:#1A1406}
.soon-bar span{width:100%;opacity:.55;box-shadow:none;
  background:repeating-linear-gradient(-45deg,rgba(20,22,26,.18) 0 8px,rgba(20,22,26,.06) 8px 16px);background-size:22.6px 100%}
.card .c-btn.soon{background:linear-gradient(180deg,#3A3D44,#25282E);color:#E7C46A;box-shadow:inset 0 0 0 1px rgba(231,196,106,.35)}
.card:hover .c-btn.soon{background:linear-gradient(180deg,#43474F,#2B2E35);color:#FFD978}
/* Сугалааны хуудас */
.is-soon .lot-info .bar.big,.is-soon .lot-info .note{display:none}
.soon-box{gap:12px}
.soon-box b{color:#F2B53A}
.soon-pill{justify-self:center;font:700 .74rem/1 var(--f-t);letter-spacing:.08em;text-transform:uppercase;padding:7px 12px;border-radius:var(--pill);color:#1A1406;background:linear-gradient(180deg,#FFD978,#F2B53A)}
.soon-box .btn{text-decoration:none}
.is-soon .buy .demo-flag{display:none}

/* ==== QPay банкны апп-ын товчнууд (бодит систем) — утсан дээр дарахад тухайн банкны апп нээгдэж төлбөр бөглөгдөнө ==== */
.q-apps{margin:4px 0 12px}
.q-apps small{display:block;color:var(--muted);font-size:.8rem;margin-bottom:8px;text-align:center}
.q-apps>div{display:grid;grid-template-columns:repeat(auto-fill,minmax(72px,1fr));gap:8px}
.q-apps a{display:grid;justify-items:center;gap:5px;padding:8px 4px;border-radius:12px;background:rgba(255,255,255,.04);border:1px solid var(--line);color:var(--ink);text-decoration:none;font-size:.68rem;line-height:1.2;text-align:center}
.q-apps a:hover{border-color:var(--cyan)}
.q-apps i{position:relative;display:grid;place-items:center;width:40px;height:40px;border-radius:10px;background:var(--bg-2);font:700 1rem/1 var(--f-d);font-style:normal;color:var(--muted)}
.q-apps i::before{content:attr(data-l)}
.q-apps img{position:absolute;inset:0;width:40px;height:40px;border-radius:10px;object-fit:cover;opacity:0;transition:opacity .25s}
.q-apps img.ok{opacity:1;background:#fff}  /* ачаалагдтал (эсвэл ачаалагдахгүй бол) банкны эхний үсэг харагдана */
.q-more{display:block;margin:10px auto 0}
@media (min-width:900px){.q-apps{display:none}}   /* компьютер дээр QR уншуулна */
