/* OPLOT: блок «Все модули» (oplot-mods.js). Все классы с префиксом mods-, токены свои, чтобы работать в любом шаблоне. */
.mods{
  --mods-acc:#c3f53c; --mods-acc-ink:#10150a; --mods-acc-soft:rgba(195,245,60,.12);
  --mods-bg:#0b0d0a; --mods-panel:#12150f; --mods-line:rgba(255,255,255,.09);
  --mods-fg:#eef0ea; --mods-text:#c9cec3; --mods-mut:#8c9187;
  --mods-disp:"Unbounded","Manrope",system-ui,sans-serif;
  --mods-sans:"Manrope",system-ui,-apple-system,"Segoe UI",Arial,sans-serif;
  width:100%;max-width:1040px;margin:0 auto;text-align:left;color:var(--mods-text);font:14px/1.5 var(--mods-sans);box-sizing:border-box;
}
.mods *,.mods *::before,.mods *::after{box-sizing:border-box}
.mods[data-accent="red"]{--mods-acc:#ff4a3d;--mods-acc-ink:#fff;--mods-acc-soft:rgba(255,74,61,.14);--mods-disp:"Fira Sans Condensed","Unbounded",sans-serif}
.mods[data-accent="mono"]{--mods-acc:#f2f2f2;--mods-acc-ink:#0a0a0a;--mods-acc-soft:rgba(255,255,255,.1);--mods-bg:#0a0a0a;--mods-panel:#141414}

.mods-layout{display:grid;grid-template-columns:260px minmax(0,1fr);gap:22px;align-items:start}
.mods-cats{display:flex;flex-direction:column;gap:6px;min-width:0}
.mods-cat{appearance:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;text-align:left;
  border:1px solid transparent;background:transparent;color:var(--mods-text);padding:12px 14px;border-radius:12px;font:600 14px/1.25 var(--mods-sans);
  transition:background .2s,border-color .2s,color .2s}
.mods-cat:hover{background:rgba(255,255,255,.04);color:var(--mods-fg)}
.mods-cat-n{flex:none;font:600 12px/1 var(--mods-sans);font-variant-numeric:tabular-nums;color:var(--mods-mut);padding:4px 8px;border-radius:99px;background:rgba(255,255,255,.05)}
.mods-cat[aria-selected="true"]{background:var(--mods-acc-soft);border-color:var(--mods-acc);color:var(--mods-fg)}
.mods-cat[aria-selected="true"] .mods-cat-n{background:var(--mods-acc);color:var(--mods-acc-ink)}
.mods-cat:focus-visible,.mods-sw:focus-visible{outline:2px solid var(--mods-acc);outline-offset:3px}

.mods-panel{border:1px solid var(--mods-line);border-radius:16px;background:var(--mods-bg);padding:20px;min-width:0;box-shadow:0 24px 60px -34px rgba(0,0,0,.8)}
.mods-head{display:flex;align-items:baseline;justify-content:space-between;gap:12px 18px;flex-wrap:wrap;margin-bottom:16px}
.mods-title{margin:0;font:700 clamp(18px,2vw,22px)/1.2 var(--mods-disp);color:var(--mods-fg);letter-spacing:-.02em}
.mods-total{font:600 13px/1.2 var(--mods-sans);color:var(--mods-acc);font-variant-numeric:tabular-nums}
.mods-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.mods-card{display:flex;align-items:center;gap:12px;min-width:0;padding:12px 14px;border:1px solid var(--mods-line);border-radius:12px;background:var(--mods-panel);transition:border-color .2s,background .2s}
.mods-card.is-on{border-color:rgba(255,255,255,.2)}
.mods-ico{flex:none;width:38px;height:38px;border-radius:10px;display:grid;place-items:center;font-size:19px;line-height:1;background:rgba(255,255,255,.05)}
.mods-card.is-on .mods-ico{background:var(--mods-acc-soft)}
.mods-body{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.mods-name{font:700 14px/1.3 var(--mods-sans);color:var(--mods-fg);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mods-desc{font-size:12.5px;line-height:1.35;color:var(--mods-mut);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

.mods-sw{appearance:none;cursor:pointer;flex:none;position:relative;width:42px;height:24px;padding:0;border:0;border-radius:99px;background:rgba(255,255,255,.14);transition:background .2s}
.mods-sw i{position:absolute;top:3px;left:3px;width:18px;height:18px;border-radius:50%;background:#fff;transition:transform .2s}
.mods-sw[aria-pressed="true"]{background:var(--mods-acc)}
.mods-sw[aria-pressed="true"] i{transform:translateX(18px);background:var(--mods-acc-ink)}

@media (max-width:760px){
  .mods-layout{grid-template-columns:minmax(0,1fr);gap:14px}
  .mods-cats{flex-direction:row;overflow-x:auto;gap:8px;scrollbar-width:none;padding-bottom:2px;-webkit-overflow-scrolling:touch}
  .mods-cats::-webkit-scrollbar{display:none}
  .mods-cat{flex:none;width:auto;border-color:var(--mods-line);border-radius:99px;padding:9px 14px;white-space:nowrap}
  .mods-grid{grid-template-columns:minmax(0,1fr)}
  .mods-panel{padding:14px}
}
@media (prefers-reduced-motion:reduce){
  .mods *,.mods *::before,.mods *::after{transition:none!important;animation:none!important}
}

/* шаблон v3 (landing-v3) */
.mods-v3{padding:120px 0 40px}
.mods-v3-h{font-size:clamp(34px,5vw,72px);line-height:.95;font-weight:700;text-transform:uppercase;margin:28px 0 14px;letter-spacing:-.005em}
.mods-v3-sub{color:rgba(255,255,255,.55);max-width:52ch;margin:0 0 36px;font-size:16px}
.mods-v3 .mods{max-width:none}
@media (max-width:640px){.mods-v3{padding:80px 0 20px}.mods-v3 .wrap{padding:0 16px}}