/* Конструктор клинка «Собери свой клинок» — стили страницы.
 * Грузятся только на странице конструктора.
 * Всё под .kforge: переменные на контейнере (не :root — чтобы не пересекаться
 * с темой сайта), selectors скоупятся, сброс Tailwind Preflight перебивается
 * специфичностью .kforge X. Палитра совпадает с золотом сайта (#c9a84c). */

.kforge{
  --bg:#17171a; --panel:#1f1f24; --panel2:#26262c; --line:#34343c;
  /* Золото — из темы сайта (:root, RGB-каналы из админки «Оформление»),
     фолбэки = дефолты темы. Конструктор перекрашивается вместе с сайтом. */
  --gold:rgb(var(--color-gold, 201 168 76));
  --gold-l:rgb(var(--color-gold-light, 232 201 109));
  --gold-dim:rgb(var(--color-gold, 201 168 76) / .55);
  /* Текст — как на остальных страницах: body text-gray-200, приглушённый
     text-gray-400 (раньше стояла тёплая палитра прототипа — отличалась). */
  --text:#e5e7eb; --muted:#9ca3af;
  --ok:#7db184; --ok-bg:rgba(125,177,132,.12);
  --warn:#d9a441; --warn-bg:rgba(217,164,65,.12);
  --bad:#c96054; --bad-bg:rgba(201,96,84,.12);
  --serif:'Cormorant Garamond',Georgia,'Times New Roman',serif;
  --sans:Inter,-apple-system,'Segoe UI',Roboto,Arial,sans-serif;

  max-width:1180px; margin:0 auto; padding:8px 16px 60px;
  color:var(--text); font-family:var(--sans); font-size:15px; line-height:1.55;
}
.kforge *{box-sizing:border-box}

.kforge header{padding:22px 0 8px; border-bottom:1px solid var(--line); margin-bottom:26px; background:none}
.kforge .eyebrow{font-size:11px; letter-spacing:.22em; color:var(--gold); text-transform:uppercase; margin:0 0 10px}
/* Как h1 карточек товара: font-display text-4xl text-white (36px, вес 400). */
.kforge h1{font-family:var(--serif); font-weight:400; font-size:clamp(28px,3.5vw,36px); line-height:1.1; margin:0 0 8px; text-wrap:balance; color:#fff}
.kforge .sub{color:var(--muted); max-width:100ch; margin:0 0 22px}
.kforge .cols{display:grid; grid-template-columns:minmax(0,7fr) minmax(0,5fr); gap:28px; align-items:start}
@media (max-width:960px){ .kforge .cols{grid-template-columns:1fr} }

.kforge .archs{display:flex; flex-wrap:wrap; gap:8px; margin:0 0 22px}
.kforge .archs button{
  background:var(--panel); color:var(--text); border:1px solid var(--line); border-radius:6px;
  padding:9px 18px; font-size:14px; font-weight:600; cursor:pointer; font-family:var(--sans);
}
.kforge .archs button:hover{border-color:var(--gold-dim)}
.kforge .archs button.active{background:var(--gold); color:#17171a; border-color:var(--gold)}
.kforge .archs button:disabled{opacity:.4; cursor:not-allowed}
.kforge .archs button:focus-visible{outline:2px solid var(--gold); outline-offset:2px}

.kforge .board{background:var(--panel); border:1px solid var(--line); border-radius:6px; padding:18px 18px 22px}
.kforge .board svg{width:100%; height:auto; display:block}
.kforge .weight{margin:8px 2px 0; font-size:13px; color:var(--muted)}
.kforge .weight b{color:var(--gold-l); font-variant-numeric:tabular-nums; font-weight:600}
.kforge .ctl input:focus-visible{outline:2px solid var(--gold); outline-offset:2px}

.kforge .ctls{display:grid; grid-template-columns:1fr 1fr; gap:14px 22px; margin-top:6px}
@media (max-width:640px){ .kforge .ctls{grid-template-columns:1fr} }
.kforge .ctl label{display:flex; justify-content:space-between; align-items:baseline; font-size:13px; color:var(--muted); margin-bottom:5px}
.kforge .ctl .val{color:var(--gold-l); font-variant-numeric:tabular-nums; font-size:14px; white-space:nowrap}
.kforge .ctl input[type=range]{width:100%; accent-color:var(--gold); height:22px; margin:0; background:transparent}
.kforge .ctl .hint{margin:2px 0 0; font-size:11.5px; color:var(--muted); opacity:.85; min-height:1.35em}

.kforge .stamp{border:2px solid; border-radius:6px; padding:14px 18px; margin-bottom:16px;
  text-transform:uppercase; letter-spacing:.14em; font-size:15px; font-weight:600}
.kforge .stamp small{display:block; text-transform:none; letter-spacing:0; font-weight:400; font-size:13px; margin-top:6px; opacity:.9}
.kforge .stamp.ok{color:var(--ok); border-color:var(--ok); background:var(--ok-bg)}
.kforge .stamp.warn{color:var(--warn); border-color:var(--warn); background:var(--warn-bg)}
.kforge .stamp.bad{color:var(--bad); border-color:var(--bad); background:var(--bad-bg)}

.kforge .klass{background:var(--panel); border:1px solid var(--line); border-left:3px solid var(--gold);
  border-radius:4px; padding:11px 14px; margin-bottom:16px; font-size:13.5px}
.kforge .klass .lbl{font-size:11px; letter-spacing:.14em; text-transform:uppercase; color:var(--muted); margin-bottom:4px}
.kforge .klass .name{font-weight:600}
.kforge .klass .gost{color:var(--gold-l); font-weight:400}
.kforge .klass .why2{color:var(--muted); font-size:12.5px; margin-top:4px}

.kforge .crit{list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:10px}
.kforge .crit li{background:var(--panel); border:1px solid var(--line); border-left-width:3px; border-radius:4px; padding:11px 14px}
.kforge .crit li.ok{border-left-color:var(--ok)} .kforge .crit li.warn{border-left-color:var(--warn)}
.kforge .crit li.sign{border-left-color:var(--bad)} .kforge .crit li.na{border-left-color:var(--line)}
.kforge .crit .row{display:flex; justify-content:space-between; gap:12px; align-items:baseline}
.kforge .crit .name{font-weight:600; font-size:14px}
.kforge .crit .chip{font-size:11px; letter-spacing:.06em; text-transform:uppercase; white-space:nowrap}
.kforge .crit li.ok .chip{color:var(--ok)} .kforge .crit li.warn .chip{color:var(--warn)}
.kforge .crit li.sign .chip{color:var(--bad)} .kforge .crit li.na .chip{color:var(--muted)}
.kforge .crit .why{color:var(--muted); font-size:13px; margin-top:3px}
.kforge .crit .why b{color:var(--text); font-weight:600; font-variant-numeric:tabular-nums}

.kforge .order{margin-top:18px}
.kforge .order button{width:100%; padding:13px 16px; font-size:15px; font-family:var(--sans); font-weight:600;
  border-radius:5px; border:1px solid var(--gold); background:var(--gold); color:#17171a; cursor:pointer}
.kforge .order button:disabled{background:transparent; color:var(--muted); border-color:var(--line); cursor:not-allowed}
.kforge .order .note{font-size:12.5px; color:var(--muted); margin-top:8px}
.kforge .toast{margin-top:10px; font-size:13px; color:var(--gold-l); display:none}

.kforge footer{margin-top:36px; border-top:1px solid var(--line); padding-top:14px; color:var(--muted); font-size:12.5px; max-width:95ch; background:none}
@media (prefers-reduced-motion:no-preference){ .kforge .stamp{transition:color .2s,border-color .2s,background .2s} }