/* MSKMINER — Design Tokens (источник: сайт mskminer.com). НЕ менять без согласования. */
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@200;300;400;500;600;700;800;900&family=JetBrains+Mono:wght@400;500;700&display=swap');
:root{
  --cyan:#0ec0ce; --cyan-2:#82d8df; --cyan-3:#64b1b9; --cyan-4:#b1e5eb;
  --bg:#1c1d24; --bg-2:#26262f; --panel:#2c2d38; --panel-2:#323542; --line:#3a3e4d;
  --ink:#dedff2; --muted:#8998a7; --muted-2:#748497; --white:#ffffff; --red:#ff3e3e; --blue:#28578e;
  --font:"Montserrat",sans-serif; --mono:"JetBrains Mono",ui-monospace,monospace;
  --r:16px;
}
*{box-sizing:border-box}
body{margin:0;padding:34px;font-family:var(--font);color:var(--ink);
  background:radial-gradient(700px 380px at 88% -10%,rgba(14,192,206,.10),transparent 60%),linear-gradient(160deg,#20212a,var(--bg) 60%,var(--bg-2));}
.ds-title{font-family:var(--mono);font-size:.72rem;letter-spacing:.24em;text-transform:uppercase;color:var(--cyan);margin:0 0 20px}
/* swatches */
.swatches{display:flex;flex-wrap:wrap;gap:14px}
.sw{width:150px;border:1px solid var(--line);border-radius:12px;overflow:hidden;background:var(--panel)}
.sw .c{height:64px}
.sw .m{padding:9px 11px;font-size:.72rem}
.sw .m b{display:block;color:var(--white);font-weight:600}
.sw .m code{font-family:var(--mono);color:var(--muted);font-size:.68rem}
/* type */
h1,h2,h3{margin:.2em 0;letter-spacing:-.02em}
h1{font-size:3.4rem;font-weight:800;line-height:1.02}
h2{font-size:2.2rem;font-weight:700}
h3{font-size:1.15rem;font-weight:700}
.lead{font-size:1.2rem;color:var(--muted);max-width:60ch;line-height:1.55}
.eyebrow{font-family:var(--mono);font-size:.72rem;letter-spacing:.28em;text-transform:uppercase;color:var(--cyan);display:inline-flex;align-items:center;gap:.7em}
.eyebrow::before{content:"";width:26px;height:1px;background:var(--cyan)}
.mono{font-family:var(--mono)}
.accent{color:var(--cyan)}
/* buttons */
.btn{font-family:var(--mono);font-size:.85rem;letter-spacing:.05em;text-decoration:none;color:var(--ink);border:1px solid var(--line);border-radius:100px;padding:.85rem 1.5rem;display:inline-flex;gap:.6rem;align-items:center;cursor:pointer;transition:.25s;background:transparent}
.btn:hover{border-color:var(--cyan)}
.btn.primary{background:var(--cyan);color:#0a1416;border-color:var(--cyan);font-weight:700}
.btn.primary:hover{filter:brightness(1.08)}
/* card */
.card{background:linear-gradient(160deg,rgba(50,53,66,.75),rgba(38,38,47,.6));border:1px solid var(--line);border-radius:var(--r);padding:1.5rem;max-width:320px;transition:.3s}
.card:hover{border-color:rgba(14,192,206,.5);transform:translateY(-3px)}
.card .ic{width:42px;height:42px;border-radius:11px;display:grid;place-items:center;margin-bottom:1rem;background:rgba(14,192,206,.12);border:1px solid rgba(14,192,206,.35);color:var(--cyan);font-family:var(--mono);font-weight:700}
.card p{color:var(--muted);font-size:.92rem;line-height:1.5;margin:.4rem 0 0}
.card ul{list-style:none;margin:.7rem 0 0;padding:0;display:flex;flex-direction:column;gap:.4rem}
.card li{color:var(--muted);font-size:.86rem;padding-left:1.1rem;position:relative}
.card li::before{content:"";position:absolute;left:0;top:.55em;width:6px;height:6px;background:var(--cyan);border-radius:1px}
/* tag */
.tag{font-family:var(--mono);font-size:.66rem;letter-spacing:.14em;text-transform:uppercase;color:var(--cyan);border:1px solid rgba(14,192,206,.4);border-radius:100px;padding:.28rem .7rem;display:inline-block}
/* stat */
.stats{display:flex;gap:3rem;flex-wrap:wrap}
.stat .n{font-family:var(--mono);font-size:2.4rem;font-weight:700;color:var(--white);line-height:1}
.stat .n span{color:var(--cyan)}
.stat .l{color:var(--muted);font-size:.82rem;margin-top:.5rem;max-width:20ch}
.row{display:flex;gap:14px;flex-wrap:wrap;align-items:center}
.logo{height:64px;width:auto}
.note{font-family:var(--mono);font-size:.68rem;color:var(--muted-2);border-left:2px solid var(--red);padding-left:12px;margin-top:16px;line-height:1.6;max-width:60ch}