/* dofamart — стили механик (09–10.11.2026): баллы, челленджи, темы, рейтинг, подсказки, страница товара */
.mx-pts{color:var(--a3);font-weight:800}
.mx-rt{width:44px;justify-content:center;padding:0}
.mx-head{position:sticky;top:0;z-index:3;background:var(--panel);}
.mx-hd-r{display:flex;align-items:center;gap:8px}
.mx-help{width:34px;height:34px;border-radius:50%;border:1px solid var(--line-2);background:var(--glass);color:var(--fg);font:800 16px/1 var(--f-display);cursor:pointer}
.mx-help:hover{background:var(--glass-2)}
.mx-pts-big{display:flex;align-items:center;justify-content:space-between;margin:18px 22px 4px;padding:16px 18px;border-radius:18px;background:var(--grad);color:var(--black)}
.mx-pts-big span{font:800 14px/1 var(--f-body);text-transform:uppercase;letter-spacing:.04em}
.mx-pts-big b{font:900 30px/1 var(--f-display);letter-spacing:-.02em}
.mx-h{margin:22px 22px 10px;display:flex;align-items:baseline;gap:10px;font:800 14px/1.2 var(--f-display);text-transform:uppercase;letter-spacing:.01em;color:var(--mute)}
.mx-h small{font:600 12px/1 var(--f-body);text-transform:none;color:var(--dim)}
.mx-list{list-style:none;margin:0 22px;padding:0;display:grid;gap:8px}
.mx-ch{display:grid;grid-template-columns:40px minmax(0,1fr) auto;gap:12px;align-items:center;padding:12px 14px;border-radius:16px;background:var(--glass);border:1px solid var(--line)}
.mx-ch.done{opacity:.6}
.mx-ic{width:40px;height:40px;border-radius:12px;display:grid;place-items:center;font-size:20px;background:var(--panel-2,rgba(255,255,255,.08))}
.mx-ct{min-width:0;display:grid;gap:3px}
.mx-ct b{font:700 15px/1.2 var(--f-body)}
.mx-ct small{font:500 13px/1.3 var(--f-body);color:var(--mute)}
.mx-bar{height:6px;border-radius:9px;background:var(--glass-2);overflow:hidden;margin-top:6px}
.mx-bar i{display:block;height:100%;background:var(--grad);border-radius:9px;transition:width .4s}
.mx-rw{font:900 15px/1 var(--f-display);color:var(--a3);white-space:nowrap}
.mx-themes{display:grid;gap:8px;margin:0 22px 22px}
.mx-th{display:grid;grid-template-columns:28px minmax(0,1fr) auto;gap:12px;align-items:center;padding:10px 14px;border-radius:16px;background:var(--glass);border:1px solid var(--line)}
.mx-sw{width:28px;height:28px;border-radius:50%;background:linear-gradient(135deg,var(--a1),var(--a2));box-shadow:0 0 0 2px var(--bg)}
.mx-own{font:700 13px/1 var(--f-body);color:var(--ok)}
.mx-sub{margin:14px 22px 0;color:var(--mute);font:500 15px/1.5 var(--f-body)}
.mx-card-wrap{margin:16px 22px 0;border-radius:18px;overflow:hidden;border:1px solid var(--line-2);box-shadow:var(--glow)}
.mx-card-wrap canvas{display:block;width:100%;height:auto}
.mx-acts{display:flex;flex-wrap:wrap;gap:10px;margin:16px 22px 22px}
.mx-acts .btn{flex:1 1 150px}
.mx-empty{padding:30px 22px;color:var(--mute)}
.mx-rt-me{margin:16px 22px 0;font:800 18px/1.2 var(--f-display);color:var(--a3)}
.mx-rt{list-style:none;margin:12px 22px 22px;padding:0;display:grid;gap:6px}
.mx-rt li{display:grid;grid-template-columns:36px minmax(0,1fr) auto;gap:10px;align-items:center;padding:10px 14px;border-radius:14px;background:var(--glass);border:1px solid var(--line)}
.mx-rt li.me{border-color:var(--a1);background:color-mix(in srgb,var(--a1) 16%,transparent)}
.mx-pos{font:900 15px/1 var(--f-display);color:var(--mute)}
.mx-nm{font:600 15px/1.2 var(--f-body);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mx-rt b{font:800 14px/1 var(--f-display)}
.mx-video{display:block;width:calc(100% - 44px);margin:18px 22px 0;border-radius:18px;background:#000;aspect-ratio:16/9;object-fit:cover}
.mx-cap{margin:14px 22px 0;color:var(--mute);font:500 15px/1.5 var(--f-body)}
.mx .mx-acts{margin-bottom:22px}
.mx-share{margin-bottom:12px}

/* страница товара: галерея слева, покупка справа, вкладки и похожие */
.pd-gal{display:grid;gap:12px;min-width:0}
.pd-ph{overflow:hidden}
.pd-ph img, .pd-emo{transform:scale(var(--zoom,1));transition:transform .35s ease;transform-origin:50% 50%}
.pd-emo{font-size:min(38cqi,180px)}
.pd-ths{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.pd-th{position:relative;aspect-ratio:1;border-radius:12px;overflow:hidden;border:1px solid var(--line);background:var(--glass);display:grid;place-items:center;cursor:pointer;padding:0}
.pd-th.on{border-color:var(--a1);box-shadow:0 0 0 2px color-mix(in srgb,var(--a1) 40%,transparent)}
.pd-th .emo{font-size:26px}
.pd-th img{width:100%;height:100%;object-fit:cover;display:block}
.pd-crumb{font:500 13px/1.3 var(--f-body);color:var(--dim)}
.pd-info h2{margin:2px 0 0}
.pd-rate{font:600 14px/1.3 var(--f-body);color:var(--mute);display:flex;flex-wrap:wrap;gap:4px;align-items:center}
.pd-stock{height:8px;border-radius:9px;background:var(--glass-2);overflow:hidden}
.pd-stock i{display:block;height:100%;background:var(--grad);border-radius:9px}
.pd-ship{list-style:none;margin:0;padding:12px 14px;border-radius:16px;background:var(--glass);border:1px solid var(--line);display:grid;gap:8px;font:600 14px/1.3 var(--f-body);color:var(--mute)}
.pd-tabs{display:flex;gap:6px;margin-top:6px;border-bottom:1px solid var(--line)}
.pd-tabs button{padding:12px 14px;background:none;border:0;border-bottom:2px solid transparent;color:var(--mute);font:700 14px/1 var(--f-body);cursor:pointer;min-height:44px}
.pd-tabs button[aria-selected="true"]{color:var(--fg);border-bottom-color:var(--a1)}
.pd-sims{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.pd-sim{display:grid;gap:6px;text-align:left;padding:8px;border-radius:16px;background:var(--glass);border:1px solid var(--line);cursor:pointer;color:var(--fg)}
.pd-sim-ph{aspect-ratio:1;border-radius:12px;overflow:hidden;display:grid;place-items:center;background:var(--panel-2,rgba(255,255,255,.06))}
.pd-sim-ph img{width:100%;height:100%;object-fit:cover}
.pd-sim-ph .emo{font-size:36px}
.pd-sim b{font:700 14px/1.2 var(--f-body)}
.pd-sim small{font:800 14px/1 var(--f-display);color:var(--a3)}
@media (max-width:780px){
  .pd-grid{grid-template-columns:1fr;gap:18px;padding:20px 16px}
  .pd-sims{grid-template-columns:repeat(2,minmax(0,1fr))}
}

@media (max-width:660px){.mx-rt.pill{display:none}}

/* ---------- минимализм: цвета и фон окон теперь в lux.css ---------- */
.mx-head{border-bottom:0!important;padding:20px 22px 6px!important}
.mx-ch,.mx-th,.mx-rt li,.pd-ship,.pd-sim{border:0!important;box-shadow:none!important}
.mx-ch.done{opacity:.45}
.mx-acts .btn{min-height:44px}
.mx-help{background:transparent!important;width:30px!important;height:30px!important}
.pd-th{border:0!important}
.pd-tabs{border-bottom:0!important}
.pd-tabs button{font-weight:600!important}
.pd-ship{font-weight:500!important;font-size:13px!important}
