*,*::before,*::after{box-sizing:border-box}

/* Recursive — вариативная. Ось MONO даёт моноширинный набор из ТОГО ЖЕ
   файла, поэтому цифры знаков не требуют третьей гарнитуры:
   `font-variation-settings:"MONO" 1`. */
@font-face{font-family:'WrDis';src:url('/assets/fonts/wrdis.woff2')format('woff2');
  font-weight:400 900;font-style:normal;font-display:swap}
@font-face{font-family:'WrText';src:url('/assets/fonts/wrtext.woff2')format('woff2');
  font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'WrText';src:url('/assets/fonts/wrtextb.woff2')format('woff2');
  font-weight:700;font-style:normal;font-display:swap}

html{-webkit-text-size-adjust:100%;font-size:100%;background:#faf7f2;
  scroll-behavior:smooth}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}
  *{animation:none!important;transition:none!important}}

body{margin:0;color:#16130f;background:#faf7f2;
  font-family:'WrText',Georgia,'Times New Roman',serif;
  font-size:1.0625rem;line-height:1.68;font-weight:400;
  font-variant-numeric:lining-nums;-webkit-font-smoothing:antialiased}

h1,h2,h3{font-family:'WrDis',system-ui,-apple-system,sans-serif;
  font-weight:800;letter-spacing:-.022em;line-height:1.04;margin:0}
a{color:inherit}
img,svg{max-width:100%}

.wr-skip{position:absolute;left:-9999px}
.wr-skip:focus{left:.6rem;top:.6rem;z-index:40;background:#16130f;
  color:#faf7f2;padding:.55rem .9rem;border-radius:6px}

.wr-wrap{max-width:72rem;margin:0 auto;padding:0 1.5rem;width:100%}

/* Надстрочная метка. На листе — redd, на чернилах — redl: один и тот
   же #c9342b даёт на листе 4.90:1 и мелким текстом ненадёжен. */
.wr-eb{margin:0 0 1rem;font-family:'WrDis',system-ui,sans-serif;
  font-size:.72rem;font-weight:700;letter-spacing:.15em;
  text-transform:uppercase;color:#9a2219}

/* ---------------------------------------------------------------- */
/*  Липкая шапка                                                     */
/* ---------------------------------------------------------------- */
.wr-nav{position:sticky;top:0;z-index:30;background:rgba(250,247,242,.9);
  backdrop-filter:saturate(140%) blur(10px);
  -webkit-backdrop-filter:saturate(140%) blur(10px);
  border-bottom:1px solid #e3ddd2}
.wr-nav__in{max-width:72rem;margin:0 auto;padding:.72rem 1.5rem;
  display:flex;gap:.6rem 1.4rem;align-items:center}
.wr-nav__b{font-family:'WrDis',system-ui,sans-serif;font-weight:800;
  font-size:1.22rem;letter-spacing:-.02em;line-height:1;
  text-decoration:none;white-space:nowrap;margin-right:auto}
.wr-nav nav{display:flex;flex-wrap:wrap;gap:.4rem 1.15rem;align-items:center}
.wr-nav nav a{font-family:'WrDis',system-ui,sans-serif;font-size:.88rem;
  font-weight:600;color:#4e483f;text-decoration:none;padding:.3rem 0;
  border-bottom:2px solid transparent}
.wr-nav nav a:hover,.wr-nav nav a[aria-current]{color:#16130f;
  border-bottom-color:#c9342b}
.wr-nav__cta{display:inline-block;background:#c9342b;color:#fff;
  font-family:'WrDis',system-ui,sans-serif;font-size:.86rem;font-weight:700;
  text-decoration:none;padding:.5rem 1.05rem;border-radius:999px;
  white-space:nowrap}
.wr-nav__cta:hover{background:#9a2219}

/* ---------------------------------------------------------------- */
/*  Герой и низкая шапка — чернила                                   */
/* ---------------------------------------------------------------- */
.wr-hero,.wr-head{background:#1b1713;color:#f6f0e6;
  background-image:radial-gradient(circle at 80% 14%,
    rgba(201,52,43,.20),transparent 48%),
    radial-gradient(circle at 8% 90%,rgba(246,240,230,.06),transparent 50%)}
.wr-hero .wr-eb,.wr-head .wr-eb{color:#f0836f}
.wr-hero__in{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  gap:2.6rem;align-items:center;padding-top:4.2rem;padding-bottom:1.6rem}
.wr-hero h1{font-size:clamp(2.5rem,5.8vw,4.2rem);color:#f6f0e6}
.wr-hero__l{margin:1.5rem 0 0;font-size:1.1rem;line-height:1.62;
  color:#c4bbac;max-width:34rem}
.wr-hero__in--one{grid-template-columns:minmax(0,1fr)}
.wr-hero__in--one .wr-hero__t{max-width:46rem}
.wr-head{padding:3rem 0 0}
.wr-head h1{font-size:clamp(2rem,4.4vw,3rem);color:#f6f0e6;max-width:26ch}
.wr-head__d{margin:1rem 0 0;font-size:1.04rem;color:#c4bbac;max-width:52ch}

.wr-go{display:flex;flex-wrap:wrap;gap:.7rem;margin:2rem 0 0}
.wr-go a{display:inline-block;padding:.72rem 1.35rem;border-radius:999px;
  font-family:'WrDis',system-ui,sans-serif;font-size:.95rem;font-weight:700;
  text-decoration:none;border:1.5px solid transparent}
.wr-go a:first-child{background:#c9342b;color:#fff}
.wr-go a:first-child:hover{background:#e04438}
.wr-go a+a{border-color:#413830;color:#f6f0e6}
.wr-go a+a:hover{border-color:#f0836f;color:#f0836f}

/* Лист клеток */
.wr-fig{margin:0}
.wr-sheet{display:block;width:100%}
.wr-key{display:flex;flex-wrap:wrap;gap:.4rem 1.2rem;margin:1.1rem 0 0;
  font-family:'WrDis',system-ui,sans-serif;font-size:.73rem;font-weight:600;
  color:#c4bbac}
.wr-key span{display:flex;align-items:center;gap:.45rem}
.wr-key s{display:block;width:.85rem;height:.6rem;border-radius:2px;
  text-decoration:none;flex:none}

/* ---------------------------------------------------------------- */
/*  Полосы                                                           */
/* ---------------------------------------------------------------- */
.wr-band{padding:4.2rem 0}
.wr-band--c{background:#eceef2}
.wr-band--w{background:#f3ede2}
.wr-band__h{max-width:42rem;margin:0 0 2.4rem}
.wr-band__h h2{font-size:clamp(1.9rem,3.4vw,2.6rem)}
.wr-band__h p{margin:.9rem 0 0;color:#4e483f;font-size:1.04rem}

.wr-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));
  gap:1.2rem;border-top:1px solid #c5bcac;padding-top:1.6rem}
.wr-stats div{min-width:0}
.wr-stats b{display:block;font-family:'WrDis',system-ui,sans-serif;
  font-weight:800;font-size:clamp(2rem,4vw,2.9rem);line-height:1;
  letter-spacing:-.03em;font-variation-settings:"MONO" 1}
.wr-stats span{display:block;margin-top:.5rem;font-size:.86rem;
  line-height:1.45;color:#4e483f}
.wr-caveat{margin:2.2rem 0 0;max-width:62rem;font-size:.92rem;
  line-height:1.62;color:#4e483f}

/* ---------------------------------------------------------------- */
/*  Карточки                                                         */
/* ---------------------------------------------------------------- */
.wr-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(17rem,1fr));
  gap:1.1rem}
.wr-card{display:flex;flex-direction:column;background:#ffffff;
  border:1px solid #e3ddd2;border-radius:16px;
  padding:1.5rem 1.4rem 1.3rem;overflow:hidden;
  box-shadow:0 1px 2px rgba(27,23,19,.04),0 8px 22px rgba(27,23,19,.05);
  transition:transform .16s ease,box-shadow .16s ease}
.wr-card:hover{transform:translateY(-3px);
  box-shadow:0 2px 4px rgba(27,23,19,.07),0 16px 34px rgba(27,23,19,.1)}
.wr-card__m{display:flex;align-items:center;justify-content:center;
  margin:-1.5rem -1.4rem 1.25rem;height:6.4rem;background:#f3ede2;
  border-bottom:1px solid #eadfcc;color:#9a2219}
.wr-mot{display:block;width:10rem}
.wr-card h3{font-size:1.32rem;margin:0 0 .6rem}
.wr-card h3 a{text-decoration:none}
.wr-card h3 a:hover{color:#9a2219}
.wr-card p{margin:0;font-size:.95rem;line-height:1.58;color:#4e483f}
.wr-card__k{margin:0 0 .9rem!important;font-family:'WrDis',system-ui,sans-serif;
  font-size:.7rem;font-weight:700;letter-spacing:.14em;
  text-transform:uppercase;color:#9a2219}
.wr-card__c{margin-top:auto!important;padding-top:1.1rem;font-size:.84rem;
  font-weight:700;color:#16130f}

/* ---------------------------------------------------------------- */
/*  Тёмная панель знака — и в шапке, и в статье                      */
/* ---------------------------------------------------------------- */
.wr-b,.wr-p{background:#2a241e;color:#f6f0e6;border:1px solid #413830;
  border-radius:16px;padding:1.5rem 1.5rem 1.3rem;margin:0 0 1.4rem}
/* z-index обязателен: отрицательное поле выводит панель за край тёмной
   полосы, но следующая полоса — сосед ПОЗЖЕ в потоке и рисует свой фон
   поверх. transform для нахлёста не годится вовсе: он не отнимает
   высоту, и нахлёста не возникает. */
.wr-hero .wr-b,.wr-head .wr-b{position:relative;z-index:2}
.wr-hero .wr-b{margin:1.8rem 0 -3.8rem}
.wr-head .wr-b{margin:1.8rem 0 -3.2rem}
.wr-hero+.wr-band,.wr-head+.wr-doc{padding-top:6.2rem}
.wr-p{margin:2rem 0}
/* Знак ШИРЕ меры чтения: внутри 38rem колонка полос съедает столько,
   что подпись строки ломается на три. Видно только на СТАТЬЕ. */
.wr-body>.wr-p{width:min(60rem,calc(100vw - 3rem));margin-left:50%;
  transform:translateX(-50%)}
.wr-p__t{margin:0 0 1rem;padding-bottom:.8rem;
  border-bottom:1px solid #413830;
  font-family:'WrDis',system-ui,sans-serif;font-size:.95rem;font-weight:700;
  line-height:1.42;color:#f6f0e6}
.wr-p__k{margin:1rem 0 0;padding-top:.75rem;border-top:1px solid #413830;
  font-family:'WrDis',system-ui,sans-serif;font-size:.68rem;font-weight:700;
  letter-spacing:.12em;text-transform:uppercase;color:#f0836f}
.wr-p__n{margin:.6rem 0 0;font-size:.86rem;line-height:1.52;color:#c4bbac}
.wr-p__n b{color:#f6f0e6;font-weight:700}
.wr-lg{display:flex;flex-wrap:wrap;gap:.35rem 1.2rem;margin:1rem 0 0;
  font-family:'WrDis',system-ui,sans-serif;font-size:.7rem;font-weight:600;
  color:#c4bbac}
.wr-lg span{display:flex;align-items:center;gap:.45rem}
.wr-lg s{display:block;width:.9rem;height:.7rem;border-radius:2px;
  text-decoration:none;flex:none}
.wr-lg__d{border-radius:50%!important;width:.7rem!important}
.wr-lg__w{width:.3rem!important}

/* --- Знак 1: цена и выигрыш по разные стороны черты --- */
.wr-w__h{display:grid;grid-template-columns:1fr 22rem 7rem;gap:.7rem;
  margin:0 0 .4rem}
.wr-w__h>b{font-family:'WrDis',system-ui,sans-serif;font-size:.64rem;
  font-weight:700;letter-spacing:.13em;text-transform:uppercase;
  color:#c4bbac}
.wr-w__h>b:last-child{text-align:right}
.wr-w__r{display:grid;grid-template-columns:1fr 22rem 7rem;gap:.7rem;
  align-items:center;padding:.5rem 0;border-bottom:1px solid #413830}
.wr-w__r:last-of-type{border-bottom:0}
.wr-w__q{margin:0;font-size:.93rem;line-height:1.35}
/* Центральная черта — отдельный элемент во всю высоту строки, а не
   граница самой полосы. Первый вариант рисовал её как border-right у
   левой половины: она была высотой в полосу, то есть ниже строки, и
   читалась как ряд отдельных засечек, а не как черта, по разные
   стороны которой лежат цена и выигрыш. Заодно убран border-left у
   ячейки: он стоял у левого края и принимался за центр. */
.wr-w__d{position:relative;display:flex;align-items:stretch;height:1.15rem}
.wr-w__d::before{content:"";position:absolute;left:50%;top:-.5rem;
  bottom:-.5rem;width:2px;margin-left:-1px;background:#c4bbac;
  opacity:.65}
.wr-w__l,.wr-w__rt{flex:1 1 50%;display:flex;min-width:0}
.wr-w__l{justify-content:flex-end}
.wr-w__a{display:block;background:#c9342b;border-radius:2px 0 0 2px}
.wr-w__b{display:block;background:#f6f0e6;border-radius:0 2px 2px 0}
.wr-w__x{display:block;width:.5rem;background:#8b8276;
  border-radius:0 2px 2px 0}
.wr-w__n{font-family:'WrDis',system-ui,sans-serif;font-size:.78rem;
  font-weight:600;color:#c4bbac;text-align:right;
  font-variation-settings:"MONO" 1}
.wr-w__n b{color:#f6f0e6;font-weight:700}
.wr-w__w{grid-column:1/-1;margin:.3rem 0 0;font-size:.84rem;line-height:1.48;
  color:#c4bbac}

/* --- Знак 2: когда читали --- */
.wr-r__r{display:grid;grid-template-columns:1fr 22rem 6rem;gap:.7rem;
  align-items:center;padding:.55rem 0;border-bottom:1px solid #413830}
.wr-r__r:last-of-type{border-bottom:0}
.wr-r__q{margin:0;font-size:.93rem;line-height:1.35}
.wr-r__t{position:relative;display:block;height:1.6rem}
.wr-r__line{position:absolute;top:.52rem;left:0;right:0;height:2px;
  background:#413830;border-radius:1px}
.wr-r__w{position:absolute;top:.1rem;width:3px;height:.9rem;
  background:#c9342b;border-radius:1px;transform:translateX(-1px)}
/* Кольцо цветом панели: отметка написания и первое чтение часто
   приходятся на одну неделю, и без кольца они сливаются в пятно. */
.wr-r__d{position:absolute;top:.3rem;width:.45rem;height:.45rem;
  background:#f6f0e6;border-radius:50%;transform:translateX(-50%);
  box-shadow:0 0 0 2px #2a241e}
.wr-r__x{position:absolute;top:.3rem;left:1.1rem;right:0;height:1px;
  background:repeating-linear-gradient(90deg,#8b8276 0 4px,
    transparent 4px 8px)}
.wr-r__t--never .wr-r__line{background:none}
.wr-ru{position:absolute;top:1rem;left:0;right:0;height:.6rem;display:block}
.wr-ru s{position:absolute;top:0;width:1px;height:.22rem;
  background:#413830;text-decoration:none}
.wr-ru b{position:absolute;top:.16rem;
  font-family:'WrDis',system-ui,sans-serif;font-size:.56rem;font-weight:600;
  letter-spacing:.08em;text-transform:uppercase;color:#c4bbac}
.wr-ru__e{transform:translateX(-100%)}
.wr-r__n{font-family:'WrDis',system-ui,sans-serif;font-size:.74rem;
  font-weight:600;letter-spacing:.04em;text-transform:uppercase;
  color:#c4bbac;text-align:right}
.wr-r__n b{color:#f6f0e6;font-weight:700;
  font-variation-settings:"MONO" 1}
/* Пояснение строки — ОТДЕЛЬНЫЙ класс. Первый вариант называл его
   `wr-r__w`, как отметку написания, и абзац получал абсолютное
   позиционирование и ширину в три пикселя. Один класс на два разных
   элемента — ошибка, которая выглядит безупречно в коде. */
.wr-r__note{grid-column:1/-1;margin:.3rem 0 0;font-size:.84rem;
  line-height:1.48;color:#c4bbac}

/* --- Знак 3: ненаписанное --- */
.wr-s__r{display:grid;grid-template-columns:1fr 9rem 5.4rem;gap:.8rem;
  align-items:start;padding:.6rem 0;border-bottom:1px solid #413830}
.wr-s__r:last-of-type{border-bottom:0}
.wr-s__c{min-width:0}
.wr-s__q{margin:0;font-size:.95rem;line-height:1.4}
.wr-s__why{margin:.25rem 0 0;font-size:.84rem;line-height:1.48;
  color:#c4bbac}
.wr-s__w{margin:.25rem 0 0;font-size:.82rem;line-height:1.48;
  color:#c4bbac;opacity:.85}
.wr-s__m{display:flex;flex-wrap:wrap;gap:.22rem;align-items:center;
  padding-top:.3rem}
.wr-s__m i{display:block;width:.42rem;height:.95rem;background:#8b8276;
  border-radius:1px}
.wr-s__m em{font-family:'WrDis',system-ui,sans-serif;font-size:.68rem;
  font-weight:700;font-style:normal;color:#c4bbac;margin-left:.15rem}
.wr-s__n{font-family:'WrDis',system-ui,sans-serif;font-size:.74rem;
  font-weight:600;letter-spacing:.04em;text-transform:uppercase;
  color:#c4bbac;text-align:right;padding-top:.3rem}
.wr-s__n b{color:#f0836f;font-weight:700;font-variation-settings:"MONO" 1}

/* ---------------------------------------------------------------- */
/*  Списки разделов                                                  */
/* ---------------------------------------------------------------- */
.wr-sec{padding:2.6rem 0;border-top:1px solid #e3ddd2}
.wr-sec:first-of-type{border-top:0}
.wr-sec__h{display:grid;grid-template-columns:minmax(0,19rem) minmax(0,1fr);
  gap:1.6rem 3rem;align-items:start}
.wr-sec__k{grid-column:1;margin:0 0 .7rem;display:flex;flex-wrap:wrap;
  gap:.5rem .9rem;font-family:'WrDis',system-ui,sans-serif;font-size:.7rem;
  font-weight:700;letter-spacing:.13em;text-transform:uppercase;
  color:#9a2219}
.wr-sec__k span+span{color:#4e483f;font-weight:600}
.wr-sec h2{grid-column:1;font-size:clamp(1.6rem,2.8vw,2.1rem)}
.wr-sec h2 a{text-decoration:none}
.wr-sec h2 a:hover{color:#9a2219}
.wr-sec__d{grid-column:1;margin:.8rem 0 0;font-size:.98rem;color:#4e483f}
.wr-list{grid-column:2;grid-row:2/span 3;margin:0;padding:0;list-style:none;
  columns:2;column-gap:2.2rem}
.wr-list li{break-inside:avoid;margin:0 0 .5rem}
.wr-list a{display:block;font-size:.95rem;line-height:1.42;
  text-decoration:none;padding-left:2.2rem;position:relative}
.wr-list a::before{content:attr(data-n);position:absolute;left:0;top:.1rem;
  font-family:'WrDis',system-ui,sans-serif;font-size:.7rem;font-weight:700;
  color:#c5bcac;font-variation-settings:"MONO" 1}
.wr-list a:hover{color:#9a2219}
.wr-list a:hover::before{color:#c9342b}

/* ---------------------------------------------------------------- */
/*  Блок призыва                                                     */
/* ---------------------------------------------------------------- */
.wr-end{background:#c9342b;color:#fff;border-radius:20px;
  padding:2.8rem 2.4rem}
/* Замерено: #ffd9d4 на акценте даёт 4.02:1. Метка мелкая и
   прописная — послабление для крупного текста к ней не относится.
   #fff0ee даёт 4.73:1. */
.wr-end .wr-sec__k{color:#fff0ee}
.wr-end h2{font-size:clamp(1.8rem,3.4vw,2.5rem);max-width:22ch}
.wr-end>p{margin:1.1rem 0 0;max-width:52rem;font-size:1.04rem;color:#fff5f3}
.wr-end__l{display:flex;flex-wrap:wrap;gap:.7rem;margin:1.7rem 0 0;padding:0;
  list-style:none}
.wr-end__l a{display:inline-block;background:#1b1713;color:#f6f0e6;
  padding:.68rem 1.3rem;border-radius:999px;
  font-family:'WrDis',system-ui,sans-serif;font-size:.93rem;font-weight:700;
  text-decoration:none}
.wr-end__l a:hover{background:#2a241e}

/* ---------------------------------------------------------------- */
/*  Статья                                                           */
/* ---------------------------------------------------------------- */
.wr-doc{padding:3.4rem 1.5rem 4rem}
.wr-body{max-width:38rem;margin:0 auto}
.wr-crumb{max-width:38rem;margin:0 auto 1.6rem;font-size:.84rem;color:#4e483f}
.wr-crumb a{color:#9a2219;font-weight:700;text-decoration:none}
.wr-crumb a:hover{text-decoration:underline}
.wr-meta{max-width:38rem;margin:0 auto 1.6rem;
  font-family:'WrDis',system-ui,sans-serif;font-size:.72rem;font-weight:700;
  letter-spacing:.14em;text-transform:uppercase;color:#4e483f}
.wr-body p{margin:0 0 1.15rem}
.wr-body>p:first-of-type{font-size:1.2rem;line-height:1.58;color:#16130f}
.wr-body h2{font-size:clamp(1.5rem,2.6vw,1.95rem);margin:2.6rem 0 .9rem}
.wr-body h3{font-size:1.16rem;font-weight:700;letter-spacing:-.01em;
  margin:1.9rem 0 .6rem}
.wr-s2{position:relative}
.wr-s2::before{content:attr(data-n);display:block;
  font-family:'WrDis',system-ui,sans-serif;font-size:.7rem;font-weight:700;
  letter-spacing:.14em;color:#9a2219;margin:2.6rem 0 -2.1rem;
  font-variation-settings:"MONO" 1}
.wr-s2>h2:first-child{margin-top:2.6rem}
.wr-body ul,.wr-body ol{margin:0 0 1.15rem;padding-left:1.3rem}
.wr-body li{margin:0 0 .45rem}
.wr-body a{color:#9a2219;text-decoration:underline;
  text-underline-offset:.16em;text-decoration-thickness:1px}
.wr-body a:hover{text-decoration-thickness:2px}
.wr-body strong{font-weight:700}

/* Таблицы, цитаты и код: без этих правил приезжают голыми, и видно
   это только на блок-тесте. */
.wr-body table{width:100%;border-collapse:collapse;margin:1.5rem 0;
  font-size:.92rem}
.wr-body th,.wr-body td{text-align:left;padding:.55rem .7rem;
  border-bottom:1px solid #e3ddd2;vertical-align:top}
.wr-body thead th{font-family:'WrDis',system-ui,sans-serif;font-size:.68rem;
  font-weight:700;letter-spacing:.11em;text-transform:uppercase;
  color:#4e483f;border-bottom:1.5px solid #c5bcac}
.wr-body tbody tr:last-child td{border-bottom:0}
.wr-body blockquote{margin:1.6rem 0;padding:.3rem 0 .3rem 1.3rem;
  border-left:3px solid #c9342b;color:#4e483f;font-size:1.04rem}
.wr-body blockquote p:last-child{margin-bottom:0}
.wr-body code{font-family:'WrDis',ui-monospace,Menlo,monospace;
  font-variation-settings:"MONO" 1;font-size:.88em;background:#f3ede2;
  border:1px solid #e3ddd2;border-radius:4px;padding:.08em .34em}
.wr-body pre{margin:1.5rem 0;padding:1rem 1.1rem;background:#1b1713;
  color:#f6f0e6;border-radius:12px;overflow-x:auto;font-size:.86rem;
  line-height:1.56}
.wr-body pre code{background:none;border:0;padding:0;color:inherit}
.wr-body hr{margin:2.2rem 0;border:0;border-top:1px solid #e3ddd2}

.wr-next{max-width:60rem;margin:3.6rem auto 0;padding-top:2.4rem;
  border-top:1px solid #e3ddd2}
.wr-next__t{margin:0 0 1.2rem;font-family:'WrDis',system-ui,sans-serif;
  font-size:.72rem;font-weight:700;letter-spacing:.14em;
  text-transform:uppercase;color:#9a2219}
.wr-next ul{display:grid;
  grid-template-columns:repeat(auto-fit,minmax(15rem,1fr));gap:.9rem;
  margin:0;padding:0;list-style:none}
.wr-next li{margin:0}
.wr-next a{display:block;height:100%;background:#ffffff;
  border:1px solid #e3ddd2;border-radius:14px;padding:1.05rem 1.15rem;
  font-size:.97rem;line-height:1.42;text-decoration:none;
  transition:border-color .16s ease,transform .16s ease}
.wr-next a:hover{border-color:#c9342b;transform:translateY(-2px)}

.wr-hub{display:grid;grid-template-columns:repeat(auto-fit,minmax(19rem,1fr));
  gap:1.1rem;padding:3.4rem 0 1rem}
.wr-hub__row{background:#ffffff;border:1px solid #e3ddd2;border-radius:16px;
  padding:1.4rem 1.35rem;transition:border-color .16s ease,transform .16s ease}
.wr-hub__row:hover{border-color:#c9342b;transform:translateY(-2px)}
.wr-hub__row h2{font-size:1.26rem;margin:0 0 .5rem}
.wr-hub__row h2 a{text-decoration:none}
.wr-hub__row p{margin:0;font-size:.93rem;line-height:1.52;color:#4e483f}

/* ---------------------------------------------------------------- */
/*  Подвал                                                           */
/* ---------------------------------------------------------------- */
.wr-foot{background:#1b1713;color:#c4bbac;margin-top:4.5rem;
  padding:3.4rem 0 2.6rem}
.wr-foot__in{max-width:72rem;margin:0 auto;padding:0 1.5rem}
.wr-foot__g{display:grid;
  grid-template-columns:minmax(0,1.6fr) repeat(auto-fit,minmax(9rem,1fr));
  gap:2rem}
.wr-foot__t{margin:0 0 .9rem;font-family:'WrDis',system-ui,sans-serif;
  font-weight:800;font-size:1.2rem;color:#f6f0e6;letter-spacing:-.02em}
.wr-foot__g>div+div .wr-foot__t{font-size:.7rem;font-weight:700;
  letter-spacing:.14em;text-transform:uppercase;color:#f0836f}
.wr-foot__about{margin:0;font-size:.92rem;line-height:1.58;max-width:30ch}
.wr-foot ul{margin:0;padding:0;list-style:none}
.wr-foot li{margin:0 0 .5rem}
.wr-foot li a{font-size:.92rem;text-decoration:none}
.wr-foot li a:hover{color:#f0836f}
.wr-foot__note{margin:2.8rem 0 0;padding-top:1.6rem;
  border-top:1px solid #413830;font-size:.82rem;line-height:1.62;
  max-width:62rem}

/* ---------------------------------------------------------------- */
/*  Узко                                                             */
/* ---------------------------------------------------------------- */
@media(max-width:1000px){
  .wr-w__h,.wr-w__r{grid-template-columns:1fr 14rem 6rem}
  .wr-r__r{grid-template-columns:1fr 14rem 5.4rem}
}
@media(max-width:960px){
  .wr-hero__in{grid-template-columns:1fr;gap:2rem;padding-top:3rem}
  .wr-hero__v{order:-1}
  .wr-sec__h{grid-template-columns:1fr}
  .wr-list{grid-column:1;grid-row:auto;margin-top:1.2rem}
  .wr-foot__g{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:720px){
  body{font-size:1rem}
  .wr-nav nav{display:none}
  .wr-stats{grid-template-columns:repeat(2,minmax(0,1fr));gap:1.4rem}
  .wr-list{columns:1}
  .wr-band{padding:3rem 0}
  .wr-end{padding:2rem 1.5rem}
  .wr-b,.wr-p{padding:1.2rem 1.1rem 1.05rem;border-radius:14px}
  .wr-w__h,.wr-w__r,.wr-r__r{grid-template-columns:1fr 5.4rem}
  .wr-w__h>b:nth-child(2){display:none}
  .wr-w__q,.wr-r__q{grid-column:1/-1;margin-bottom:.3rem}
  .wr-w__d,.wr-r__t{grid-column:1/-1}
  .wr-s__r{grid-template-columns:1fr 4.6rem}
  .wr-s__m{grid-column:1;margin-top:.3rem}
  .wr-foot__g{grid-template-columns:1fr}
}


/* Curated comparisons */
.wr-context{margin:1.4rem 0;padding:1rem 1.15rem;border-left:3px solid #c9342b;background:#f6f0e6}.wr-context p{margin:.35rem 0}
.wr-curated{margin:4rem auto}.wr-curated__head{max-width:48rem}.wr-curated__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem;margin-top:1.5rem}.wr-curated__card{display:block;padding:1.4rem;border:1px solid #d5ccbf;background:#fff;color:inherit;text-decoration:none}.wr-curated__card:hover{border-color:#c9342b;transform:translateY(-2px)}.wr-curated__card b{display:block;font-size:1.2rem;margin:.35rem 0}.wr-curated__card span{color:#655d54}
.wr-listicle{background:#fbf8f2;color:#201d1a}.wr-list-hero{padding:5rem 0 3.4rem;border-bottom:1px solid #d5ccbf;background:#f1e8dc}.wr-list-hero h1{max-width:56rem;font-size:clamp(2.7rem,7vw,6rem);line-height:.93;letter-spacing:-.045em;margin:.3rem 0 1.4rem}.wr-list-hero__dek{max-width:48rem;font-size:1.25rem;line-height:1.55}.wr-list-hero__note{font-size:.82rem;text-transform:uppercase;letter-spacing:.08em}.wr-list-main{max-width:76rem;padding-top:2rem;padding-bottom:5rem}.wr-list-main>section{margin:4rem 0}.wr-list-intro{max-width:52rem}.wr-list-main h2{font-size:clamp(1.8rem,4vw,3rem);line-height:1.05}.wr-table-scroll{overflow:auto}.wr-compare{width:100%;border-collapse:collapse;background:#fff}.wr-compare th,.wr-compare td{text-align:left;vertical-align:top;padding:1rem;border-bottom:1px solid #d5ccbf}.wr-compare th{background:#201d1a;color:#fff}.wr-tools{display:grid;gap:1.2rem}.wr-tool{display:grid;grid-template-columns:4rem 1fr;gap:1.25rem;padding:1.6rem;background:#fff;border:1px solid #d5ccbf}.wr-tool__rank{font-size:2rem;color:#c9342b;margin:0}.wr-tool h2{margin:0}.wr-tool h3{margin-bottom:.2rem}.wr-tool__verdict{font-weight:700;color:#655d54}.wr-tool__link{display:inline-block;margin-top:.6rem}.wr-method{padding:2rem;background:#201d1a;color:#fff}.wr-method__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.5rem}.wr-decision ol{display:grid;gap:.8rem;counter-reset:item;list-style:none;padding:0}.wr-decision li{padding:1rem 1rem 1rem 4rem;background:#f1e8dc;position:relative}.wr-decision li:before{counter-increment:item;content:counter(item);position:absolute;left:1rem;font-size:1.6rem;color:#c9342b}.wr-faq details{border-top:1px solid #d5ccbf;padding:1rem 0}.wr-faq summary{font-weight:700;cursor:pointer}.wr-foot nav{display:flex;flex-wrap:wrap;gap:1rem}.wr-layout-magazine .wr-tools{grid-template-columns:repeat(2,minmax(0,1fr))}.wr-layout-magazine .wr-tool{grid-template-columns:1fr}.wr-layout-magazine .wr-tool__rank{font-size:3.5rem;font-family:Georgia,serif}.wr-layout-index .wr-list-hero{background:#201d1a;color:#fff}.wr-layout-index .wr-tool{border-left:5px solid #c9342b}.wr-layout-index .wr-tools{gap:0}.wr-layout-index .wr-tool+.wr-tool{border-top:0}.wr-layout-ledger .wr-compare td:first-child{font-family:monospace;font-size:1.35rem;color:#c9342b}
@media(max-width:760px){.wr-curated__grid,.wr-method__grid,.wr-layout-magazine .wr-tools{grid-template-columns:1fr}.wr-tool{grid-template-columns:2.7rem 1fr}.wr-list-hero{padding:3.5rem 0 2.5rem}.wr-compare{font-size:.88rem}}