/* Start:/local/components/blades/steel.grade.compare/templates/.default/style.css?179136651444477*/
.steelCompare,
.steelCompare * {
    box-sizing: border-box;
}
.steelCompare {
    --steel-compare-accent: #f6a000;
    --steel-compare-accent-hover: #eb9200;
    --steel-compare-line: #dfe2e6;
    --steel-compare-muted: #717782;
    --steel-compare-soft: #f6f7f8;
    width: 100%;
    color: #15191f;
    font-family: "roboto_ltregular", Arial, Helvetica, sans-serif;
}

.steelCompare h1,
.steelCompare h2,
.steelCompare h3,
.steelCompare button,
.steelCompare input,
.steelCompare select {
    font-family: "roboto_ltregular", Arial, Helvetica, sans-serif !important;
}

.steelCompare button,
.steelCompare input,
.steelCompare select {
    font: inherit;
}

.steelCompare__header {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    justify-content: space-between;
    gap: 16px 32px;
    margin: 8px 0 22px;
}

.steelCompare__header > div:first-child {
    min-width: 0;
    max-width: 100%;
}

.steelCompare__header h1 {
    margin: 0 0 8px;
    font-size: 30px;
    line-height: 1.12;
}

.steelCompare__header p,
.steelCompare__sectionHeader p {
    max-width: 860px;
    margin: 0;
    color: var(--steel-compare-muted);
    font-size: 14px;
    line-height: 1.5;
}

.steelCompare__sectionHeader p {
    max-width: none;
}

.steelCompare__headerTools {
    position: relative;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 24px;
    flex: 0 0 auto;
    max-width: 100%;
    min-height: 34px;
}

.steelCompare__switch {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    cursor: pointer;
}

.steelCompare__switch input {
    position: absolute;
    width: 1px;
    height: 1px;
    opacity: 0;
}

.steelCompare__switch > span {
    position: relative;
    width: 38px;
    height: 22px;
    border-radius: 11px;
    background: #b8bdc4;
    transition: background-color .18s ease;
}

.steelCompare__switch > span::after {
    position: absolute;
    top: 3px;
    left: 3px;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 1px 3px rgba(0, 0, 0, .24);
    content: '';
    transition: transform .18s ease;
}

.steelCompare__switch input:checked + span {
    background: var(--steel-compare-accent);
}

.steelCompare__switch input:checked + span::after {
    transform: translateX(16px);
}

.steelCompare__switch input:focus-visible + span {
    outline: 2px solid #20252b;
    outline-offset: 2px;
}

.steelCompare__switch input:disabled + span,
.steelCompare__switch input:disabled ~ b {
    opacity: .48;
}

.steelCompare__switch b {
    color: #5e646d;
    font-size: 13px;
    font-weight: 400;
}

.steelCompare__share {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 5px 0;
    color: #5e646d;
    border: 0;
    background: transparent;
    cursor: pointer;
}

.steelCompare__share:hover {
    color: #111;
}

.steelCompare__share img {
    width: 18px;
    height: 18px;
    opacity: .7;
}

.steelCompare__shareStatus {
    position: absolute;
    top: 100%;
    right: 0;
    color: #268d19;
    font-size: 12px;
    white-space: nowrap;
}

.steelCompare__selection {
    margin-bottom: 24px;
}

.steelCompare__cards {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 20px;
}

.steelCompareCard,
.steelCompareAddCard {
    position: relative;
    min-height: 246px;
    padding: 20px;
    border: 1px solid var(--steel-compare-line);
    border-radius: 9px;
    background: #fff;
}

.steelCompareCard {
    display: flex;
    flex-direction: column;
    box-shadow: 0 4px 16px rgba(20, 25, 31, .035);
}

.steelCompareCard__remove {
    position: absolute;
    top: 14px;
    right: 14px;
    display: grid;
    width: 32px;
    height: 32px;
    padding: 0;
    place-items: center;
    border: 0;
    background: transparent;
    cursor: pointer;
}

.steelCompareCard__remove img {
    width: 16px;
    filter: grayscale(1);
    opacity: .68;
}

.steelCompareCard__remove:hover img {
    filter: none;
    opacity: 1;
}

.steelCompareCard__brand {
    display: flex;
    align-items: center;
    height: 34px;
    padding-right: 34px;
    color: #142e66;
    font-size: 15px;
    font-weight: 700;
    letter-spacing: .02em;
    text-transform: uppercase;
}

.steelCompareCard__brand img {
    display: block;
    max-width: 170px;
    max-height: 30px;
    object-fit: contain;
    object-position: left center;
}

.steelCompareCard__name {
    margin: 10px 0 5px;
    font-size: 27px;
    font-weight: 500;
    line-height: 1.12;
}

.steelCompareCard__class {
    display: flex;
    gap: 10px;
    min-height: 20px;
    margin: 0;
    font-size: 13px;
}

.steelCompareCard__class span {
    color: var(--steel-compare-muted);
}

.steelCompareCard__class strong {
    font-weight: 400;
}

.steelCompareCard__stock {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 12px;
    color: #444a52;
    font-size: 13px;
}

.steelCompareCard__stock i,
.steelCompareModal__stock i {
    width: 10px;
    height: 10px;
    flex: 0 0 10px;
    border-radius: 50%;
    background: #92969c;
}

.steelCompareCard__stock--available i,
.steelCompareModal__stock--available i {
    background: #35a722;
}

.steelCompareCard__commercial {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px;
    min-height: 21px;
    margin-top: 12px;
    font-size: 12px;
}

.steelCompareCard__commercial span {
    color: #60666f;
}

.steelCompareCard__commercial strong {
    color: #f07c00;
    font-size: 17px;
    font-weight: 600;
    white-space: nowrap;
}

.steelCompareCard__action {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    min-height: 38px;
    margin-top: auto;
    padding: 8px 16px;
    color: #111;
    border-radius: 6px;
    background: var(--steel-compare-accent);
    font-size: 13px;
    font-weight: 600;
    text-decoration: none;
}

.steelCompareCard__action:hover {
    color: #111;
    background: var(--steel-compare-accent-hover);
}

.steelCompareCard__action img {
    width: 13px;
    height: 13px;
}

.steelCompareAddCard {
    display: flex;
    align-items: center;
    flex-direction: column;
    justify-content: center;
    gap: 8px;
    color: #15191f;
    border-style: solid;
    cursor: pointer;
}

.steelCompareAddCard:hover {
    border-color: #aeb4bc;
    background: #fafafa;
}

.steelCompareAddCard__icon {
    display: grid;
    width: 48px;
    height: 48px;
    margin-bottom: 6px;
    place-items: center;
    border: 1px solid #3e444b;
    border-radius: 50%;
    background: #fff;
}

.steelCompareAddCard__icon img {
    width: 28px;
    height: 28px;
    opacity: .85;
}

.steelCompareAddCard strong {
    font-size: 17px;
}

.steelCompareAddCard > span:last-child {
    color: var(--steel-compare-muted);
    font-size: 13px;
}

.steelCompare__body {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 230px;
    gap: 28px;
    align-items: start;
}

.steelCompare__sidebar {
    position: sticky;
    top: 18px;
    min-width: 0;
    grid-column: 2;
    grid-row: 1;
}

.steelCompare__nav {
    overflow: hidden;
    border: 1px solid var(--steel-compare-line);
    border-radius: 7px;
    background: #fff;
}

.steelCompare__switch--sidebar {
    width: 100%;
    min-height: 54px;
    margin-top: 12px;
    padding: 12px 16px;
    border: 1px solid var(--steel-compare-line);
    border-radius: 7px;
    background: #fff;
}

.steelCompare__switch--sidebar b {
    color: #3f454d;
    line-height: 1.25;
}

.steelCompare__navItem {
    display: flex;
    align-items: center;
    gap: 13px;
    min-height: 54px;
    padding: 12px 18px;
    color: #22272d;
    border-bottom: 1px solid var(--steel-compare-line);
    font-size: 14px;
    text-decoration: none;
}

.steelCompare__navItem:last-child {
    border-bottom: 0;
}

.steelCompare__navItem img {
    width: 19px;
    max-height: 20px;
    filter: grayscale(1) brightness(.25);
}

.steelCompare__navItem--active {
    box-shadow: inset 3px 0 #20242a;
    background: #f0f1f2;
    font-weight: 600;
}

.steelCompare__navItem--disabled {
    color: #787e87;
    cursor: default;
}

.steelCompare__navItem--disabled img {
    opacity: .55;
}

.steelCompare__contentStack {
    display: grid;
    min-width: 0;
    grid-column: 1;
    grid-row: 1;
    gap: 54px;
}

.steelCompare--empty #steel-compare-workshop,
.steelCompare--empty #steel-compare-chemistry,
.steelCompare--empty #steel-compare-heat-treatment,
.steelCompare--empty #steel-compare-sources {
    display: none;
}

.steelCompare__content {
    min-width: 0;
    scroll-margin-top: 24px;
}

.steelCompare__sectionHeader {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    min-height: 46px;
    margin-bottom: 12px;
}

.steelCompare__sectionHeader h2 {
    margin: 0 0 3px;
    font-size: 22px;
}

.steelCompareChartPanel {
    margin: 0 0 18px;
    padding: 18px 20px 12px;
    border: 1px solid var(--steel-compare-line);
    border-radius: 8px;
    background: linear-gradient(180deg, #fff 0%, #fbfbfc 100%);
}

.steelCompareChartPanel[hidden] {
    display: none;
}

.steelCompareChartPanel__heading {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 18px;
}

.steelCompareChartPanel__heading h3 {
    margin: 0;
    font-size: 16px;
    font-weight: 600;
}

.steelCompareChartPanel__heading span {
    color: var(--steel-compare-muted);
    font-size: 12px;
    text-align: right;
}

.steelCompareChart {
    width: 100%;
}

.steelCompareChart[hidden] {
    display: none;
}

.steelCompareChartFocus {
    margin-top: 12px;
    padding: 9px 12px;
    color: #565c64;
    border-left: 3px solid var(--steel-compare-accent);
    background: #fff8e9;
    font-size: 12px;
    line-height: 1.45;
}

.steelCompareChartFocus[hidden] {
    display: none;
}

.steelCompareChartFocus strong {
    color: #33383e;
    font-weight: 600;
}

.steelCompareChartFocus span {
    color: #858b93;
}

.steelCompareChartFocus--equal {
    margin-top: 12px;
    padding: 9px 12px;
    color: #555b63;
    border: 1px solid #dde1e5;
    border-left-width: 1px;
    border-radius: 6px;
    background: #f5f6f7;
    font-size: 12px;
    text-align: left;
}

.steelCompareChart--radar {
    height: 390px;
}

.steelCompareChart--bars {
    height: 300px;
}

.steelCompareChart--heatmap {
    height: 380px;
}

.steelCompare__tableScroll {
    width: 100%;
    overflow-x: auto;
    border: 1px solid var(--steel-compare-line);
    border-radius: 7px;
    background: #fff;
}

.steelCompare__table {
    width: 100%;
    border-collapse: collapse;
    table-layout: fixed;
}

.steelCompare__table th,
.steelCompare__table td {
    padding: 14px 16px;
    text-align: left;
    vertical-align: top;
    border-right: 1px solid var(--steel-compare-line);
    border-bottom: 1px solid var(--steel-compare-line);
}

.steelCompare__table tr:last-child > * {
    border-bottom: 0;
}

.steelCompare__table tr > *:last-child {
    border-right: 0;
}

.steelCompare__table thead th {
    background: #fafafa;
    font-size: 13px;
    font-weight: 600;
}

.steelCompare__table tbody th {
    width: 190px;
    color: #353b43;
    font-size: 13px;
    font-weight: 400;
    line-height: 1.35;
    background: #fbfbfc;
}

.steelCompare__table tbody tr:nth-child(even) > th {
    background: #f7f8f9;
}

.steelCompare__table tbody tr:hover > * {
    box-shadow: inset 0 1px rgba(246, 160, 0, .16), inset 0 -1px rgba(246, 160, 0, .16);
}

.steelCompare__table tbody td strong {
    display: block;
    font-size: 15px;
    font-weight: 500;
}

.steelCompare__table tbody td > span:not(.steelCompare__scoreBadge) {
    display: block;
    margin-top: 3px;
    color: var(--steel-compare-muted);
    font-size: 12px;
}

.steelCompare__gradeColumn--0 { --steel-compare-grade-color: #f6a000; --steel-compare-grade-bg: rgba(246,160,0,.035); --steel-compare-grade-bg-alt: rgba(246,160,0,.055); }
.steelCompare__gradeColumn--1 { --steel-compare-grade-color: #2878a8; --steel-compare-grade-bg: rgba(40,120,168,.035); --steel-compare-grade-bg-alt: rgba(40,120,168,.055); }
.steelCompare__gradeColumn--2 { --steel-compare-grade-color: #8f5cc2; --steel-compare-grade-bg: rgba(143,92,194,.035); --steel-compare-grade-bg-alt: rgba(143,92,194,.055); }
.steelCompare__gradeColumn--3 { --steel-compare-grade-color: #2f9d67; --steel-compare-grade-bg: rgba(47,157,103,.035); --steel-compare-grade-bg-alt: rgba(47,157,103,.055); }

.steelCompare__table td.steelCompare__gradeColumn {
    background: var(--steel-compare-grade-bg);
}

.steelCompare__table tbody tr:nth-child(even) td.steelCompare__gradeColumn {
    background: var(--steel-compare-grade-bg-alt);
}

.steelCompare__gradeHeader {
    position: relative;
    border-top: 3px solid var(--steel-compare-grade-color);
}

.steelCompare__gradeHeader > span {
    vertical-align: middle;
}

.steelCompare__gradeMarker {
    display: inline-block;
    width: 8px;
    height: 8px;
    margin-right: 8px;
    border-radius: 50%;
    background: var(--steel-compare-grade-color);
    vertical-align: middle;
}

.steelCompare__scoreBadge {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    margin-top: 7px;
    padding: 3px 7px;
    color: #626973;
    border: 1px solid rgba(82, 89, 98, .13);
    border-radius: 999px;
    background: rgba(255,255,255,.72);
    font-size: 10px;
    font-variant-numeric: tabular-nums;
    line-height: 1;
}

.steelCompare__scoreBadge::before {
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: var(--steel-compare-grade-color);
    content: '';
}

.steelCompare__longText {
    margin-top: 0 !important;
    color: #454b53 !important;
    font-size: 13px !important;
    line-height: 1.48;
}

.steelCompare__missing {
    color: #9ca1a8 !important;
    font-size: 16px !important;
}

.steelCompare__parameterHeader {
    position: sticky;
    left: 0;
    z-index: 3;
    width: 190px;
    background: #fafafa !important;
}

.steelCompare__table tbody > tr > th:first-child {
    position: sticky;
    left: 0;
    z-index: 2;
    box-shadow: 1px 0 0 var(--steel-compare-line);
}

.steelCompare__differenceHeader,
.steelCompare__difference {
    width: 250px;
    background: #f6f7f8 !important;
}

.steelCompare__differenceHeader {
    color: #565d66;
    border-top: 3px solid #b7bdc4;
}

.steelCompareChemistryLegend {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 18px 26px;
    margin: 0 0 12px;
    color: #656b74;
    font-size: 12px;
}

.steelCompareChemistryLegend span {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.steelCompareChemistryLegend i {
    display: inline-block;
    width: 27px;
    height: 15px;
    border: 1px solid #c8cdd3;
    border-radius: 3px;
}

.steelCompareChemistryLegend__hatch {
    background: repeating-linear-gradient(135deg, rgba(84, 89, 98, .16) 0 2px, transparent 2px 7px);
}

.steelCompare__table--chemistry tbody th,
.steelCompareChemistryElement {
    vertical-align: middle;
}

.steelCompareChemistryElement {
    display: flex;
    align-items: center;
    gap: 11px;
}

.steelCompareChemistryElement > b {
    display: grid;
    width: 39px;
    height: 39px;
    flex: 0 0 39px;
    place-items: center;
    color: var(--steel-chemistry-family-ink);
    border: 1px solid var(--steel-chemistry-family-border);
    border-radius: 5px;
    background: var(--steel-chemistry-family-bg);
    font-size: 17px;
}

.steelCompareChemistryElement > span,
.steelCompareChemistryElement strong,
.steelCompareChemistryElement small {
    display: block;
}

.steelCompareChemistryElement strong {
    font-size: 13px;
    font-weight: 500;
}

.steelCompareChemistryElement small {
    margin-top: 2px;
    color: var(--steel-compare-muted);
    font-size: 10px;
}

.steelCompareChemistryValue {
    --steel-chemistry-family-bg: #f3f5f6;
    --steel-chemistry-family-border: #dce1e4;
    --steel-chemistry-family-ink: #48515a;
    --steel-chemistry-family-hatch: rgba(72,81,90,.12);
    min-height: 74px;
    padding: 10px 11px;
    border: 1px solid var(--steel-chemistry-family-border);
    border-radius: 6px;
    background: var(--steel-chemistry-family-bg);
}

.steelCompareChemistryElement--transition-metal,
.steelCompareChemistryValue--transition-metal {
    --steel-chemistry-family-bg: #f8ecec;
    --steel-chemistry-family-border: #ebcdcf;
    --steel-chemistry-family-ink: #95414a;
    --steel-chemistry-family-hatch: rgba(149,65,74,.13);
}

.steelCompareChemistryElement--metalloid,
.steelCompareChemistryValue--metalloid {
    --steel-chemistry-family-bg: #e9f4f2;
    --steel-chemistry-family-border: #c9dfda;
    --steel-chemistry-family-ink: #31736d;
    --steel-chemistry-family-hatch: rgba(49,115,109,.13);
}

.steelCompareChemistryElement--nonmetal,
.steelCompareChemistryValue--nonmetal {
    --steel-chemistry-family-bg: #eef5e8;
    --steel-chemistry-family-border: #d2e1c7;
    --steel-chemistry-family-ink: #4d7139;
    --steel-chemistry-family-hatch: rgba(77,113,57,.13);
}

.steelCompareChemistryValue--independent {
    background-color: var(--steel-chemistry-family-bg);
    background-image: repeating-linear-gradient(135deg, transparent 0 9px, var(--steel-chemistry-family-hatch) 9px 11px);
}

.steelCompareChemistryValue strong,
.steelCompareChemistryValue span,
.steelCompareChemistryValue small {
    display: block;
}

.steelCompareChemistryValue strong {
    color: var(--steel-chemistry-family-ink);
    font-size: 17px !important;
    font-weight: 600 !important;
}

.steelCompareChemistryValue span {
    margin-top: 3px;
    color: #77717d;
    font-size: 10px;
}

.steelCompareChemistryValue small {
    margin-top: 7px;
    color: #56515b;
    font-size: 11px;
    line-height: 1.32;
}

.steelCompareChemistryComposite em,
.steelCompareChemistryComposite span {
    display: block;
}

.steelCompareChemistryComposite em {
    margin-bottom: 7px;
    color: #777d86;
    font-size: 11px;
    font-style: normal;
    text-transform: uppercase;
}

.steelCompareChemistryComposite span {
    margin-top: 4px;
    color: #3f454c;
    font-size: 12px;
    line-height: 1.35;
}

.steelCompareChemistryComposite b {
    font-weight: 600;
}

.steelCompareSources {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
}

.steelCompareSourceCard {
    min-width: 0;
    padding: 19px;
    border: 1px solid var(--steel-compare-line);
    border-radius: 8px;
    background: #fff;
}

.steelCompareSourceCard h3 {
    margin: 0 0 16px;
    padding-bottom: 12px;
    border-bottom: 1px solid #eceef0;
    font-size: 18px;
    font-weight: 600;
}

.steelCompareSourceCard h4 {
    margin: 16px 0 8px;
    color: #6e747d;
    font-size: 11px;
    font-weight: 500;
    letter-spacing: .05em;
    text-transform: uppercase;
}

.steelCompareSourceCard__list {
    display: grid;
    gap: 8px;
}

.steelCompareDocument,
.steelCompareWebSource {
    display: flex;
    align-items: center;
    min-width: 0;
    gap: 11px;
    padding: 10px;
    color: #252a30;
    border: 1px solid #e1e4e7;
    border-radius: 6px;
    background: #fafafa;
    text-decoration: none;
}

.steelCompareDocument:hover,
.steelCompareWebSource:hover {
    color: #111;
    border-color: #bdc2c8;
    background: #fff;
}

.steelCompareDocument__icon {
    display: grid;
    width: 38px;
    height: 44px;
    flex: 0 0 38px;
    place-items: center;
    color: #fff;
    border-radius: 4px;
    background: #d94b43;
    font-size: 9px;
    font-weight: 700;
}

.steelCompareDocument__text,
.steelCompareWebSource > span:last-child,
.steelCompareDocument strong,
.steelCompareDocument small,
.steelCompareWebSource strong,
.steelCompareWebSource small {
    display: block;
    min-width: 0;
}

.steelCompareDocument strong,
.steelCompareWebSource strong {
    overflow: hidden;
    font-size: 13px;
    font-weight: 500;
    line-height: 1.32;
    text-overflow: ellipsis;
}

.steelCompareDocument small,
.steelCompareWebSource small {
    margin-top: 3px;
    overflow: hidden;
    color: #7b8189;
    font-size: 10px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.steelCompareWebSource__mark {
    display: grid;
    width: 34px;
    height: 34px;
    flex: 0 0 34px;
    place-items: center;
    color: #6b7078;
    border: 1px solid #cfd3d8;
    border-radius: 50%;
    background: #fff;
    font-size: 17px;
}

.steelCompareSourceCard__missing,
.steelCompareSources__empty {
    margin: 12px 0 0;
    color: var(--steel-compare-muted);
    font-size: 13px;
    line-height: 1.45;
}

.steelCompareSources__empty {
    grid-column: 1 / -1;
    padding: 28px;
    border: 1px solid var(--steel-compare-line);
    border-radius: 8px;
    text-align: center;
}

.steelCompare__difference {
    color: #666d76;
    font-size: 13px;
    line-height: 1.4;
}

.steelCompare__noDifferences {
    padding: 34px !important;
    color: var(--steel-compare-muted);
    text-align: center !important;
}

.steelCompare__empty {
    display: flex;
    min-height: 250px;
    padding: 38px;
    align-items: center;
    flex-direction: column;
    justify-content: center;
    text-align: center;
}

.steelCompare__empty[hidden] {
    display: none;
}

.steelCompare__empty strong {
    margin-bottom: 8px;
    font-size: 20px;
}

.steelCompare__empty span {
    max-width: 480px;
    color: var(--steel-compare-muted);
    line-height: 1.5;
}

.steelCompare__empty button {
    margin-top: 20px;
    padding: 11px 22px;
    border: 0;
    border-radius: 5px;
    background: var(--steel-compare-accent);
    cursor: pointer;
}

.steelCompareStarter[hidden] {
    display: none;
}

.steelCompare--empty .steelCompare__headerTools,
.steelCompare--empty .steelCompare__selection,
.steelCompare--empty .steelCompare__body {
    display: none;
}

.steelCompareStarter {
    width: min(100%, 1120px);
    margin-bottom: 34px;
}

.steelCompareStarter__hero {
    padding: 20px 22px;
    border: 0;
    border-radius: 7px;
    background: #20252b;
}

.steelCompareStarter__ready h2 {
    margin: 0;
    color: inherit;
    font-weight: 500;
}

.steelCompareStarter__builder {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 42px minmax(0, 1fr) minmax(174px, auto);
    gap: 18px;
    align-items: end;
    min-width: 0;
}

.steelCompareStarter__builder label {
    display: grid;
    gap: 8px;
    min-width: 0;
}

.steelCompareStarter__builder label > span {
    color: #f0f2f4;
    font-size: 13px;
}

.steelCompareStarter__builder select {
    width: 100%;
    height: 46px;
    padding: 0 42px 0 15px;
    color: #24292f;
    border: 1px solid #cfd3d8;
    border-radius: 5px;
    outline: 0;
    background: #fff;
    appearance: auto !important;
}

.steelCompareStarter__builder select:focus {
    border-color: var(--steel-compare-accent);
    box-shadow: 0 0 0 3px rgba(246, 160, 0, .18);
}

.steelCompareStarter__swap {
    display: inline-grid;
    place-items: center;
    width: 42px;
    height: 46px;
    padding: 0;
    color: var(--steel-compare-accent);
    border: 0;
    background: transparent;
    font-size: 30px;
    line-height: 1;
    cursor: pointer;
}

.steelCompareStarter__swap:hover {
    color: #ffbd34;
}

.steelCompareStarter__swap:focus-visible {
    outline: 2px solid var(--steel-compare-accent);
    outline-offset: 2px;
}

.steelCompareStarter__submit {
    min-width: 174px;
    height: 46px;
    padding: 10px 20px;
    color: #15191f;
    border: 0;
    border-radius: 5px;
    background: var(--steel-compare-accent);
    cursor: pointer;
}

.steelCompareStarter__submit:hover:not(:disabled) {
    background: var(--steel-compare-accent-hover);
}

.steelCompareStarter__submit:disabled {
    color: #8c877c;
    background: #d8d4ca;
    cursor: default;
}

.steelCompareStarter__metrics {
    display: grid;
    grid-template-columns: 1fr 1.18fr 1fr;
    margin-top: 14px;
    padding: 18px 0;
    border: 1px solid var(--steel-compare-line);
    border-radius: 7px;
    background: #fff;
}

.steelCompareStarterMetric {
    display: flex;
    align-items: center;
    gap: 11px;
    min-width: 0;
    min-height: 58px;
    padding: 0 24px;
}

.steelCompareStarterMetric + .steelCompareStarterMetric {
    border-left: 1px solid var(--steel-compare-line);
}

.steelCompareStarterMetric strong,
.steelCompareStarterMetric b,
.steelCompareStarterMetric span {
    display: block;
}

.steelCompareStarterMetric strong {
    flex: 0 0 auto;
    color: #171b20;
    font-size: 30px;
    font-weight: 500;
    line-height: 1.05;
}

.steelCompareStarterMetric--statement {
    display: grid;
    align-content: center;
    justify-items: center;
    gap: 7px;
    text-align: center;
}

.steelCompareStarterMetric--statement strong {
    font-size: 19px;
    line-height: 1.18;
}

.steelCompareStarterMetric--statement span {
    max-width: 370px;
    font-size: 13px;
    line-height: 1.4;
}

.steelCompareStarterMetric b {
    margin-bottom: 5px;
    font-size: 14px;
    font-weight: 600;
}

.steelCompareStarterMetric span {
    color: var(--steel-compare-muted);
    font-size: 12px;
    line-height: 1.35;
}

.steelCompareStarter__ready {
    margin-top: 34px;
}

.steelCompareStarter__readyHeading {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 13px;
}

.steelCompareStarter__ready h2 {
    font-size: 24px;
}

.steelCompareStarter__readyHeading > span {
    color: var(--steel-compare-muted);
    font-size: 12px;
}

.steelCompareStarter__pairs {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
}

.steelCompareStarterPair {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 104px 16px;
    gap: 12px;
    align-items: end;
    min-height: 126px;
    padding: 18px 16px;
    color: #171b20;
    border: 1px solid var(--steel-compare-line);
    border-radius: 6px;
    background: #fff;
    text-decoration: none;
    transition: color .16s ease, border-color .16s ease, background-color .16s ease, box-shadow .16s ease, transform .16s ease;
}

.steelCompareStarterPair:hover,
.steelCompareStarterPair:focus-visible {
    color: #fff;
    border-color: #24272b;
    background: #24272b;
    box-shadow: 0 7px 18px rgba(20, 25, 31, .18);
    transform: translateY(-1px);
}

.steelCompareStarterPair:focus-visible {
    outline: 2px solid var(--steel-compare-accent);
    outline-offset: 2px;
}

.steelCompareStarterPair__copy {
    display: block;
    align-self: start;
    min-width: 0;
}

.steelCompareStarterPair__copy strong,
.steelCompareStarterPair__copy span {
    display: block;
}

.steelCompareStarterPair__copy strong {
    margin-bottom: 7px;
    font-size: 17px;
    font-weight: 500;
    line-height: 1.25;
}

.steelCompareStarterPair__copy span {
    color: #686f78;
    font-size: 12px;
    line-height: 1.4;
    transition: color .16s ease;
}

.steelCompareStarterPair:hover .steelCompareStarterPair__copy span,
.steelCompareStarterPair:focus-visible .steelCompareStarterPair__copy span {
    color: #cfd3d8;
}

.steelCompareStarterPair__chart {
    display: block;
    width: 104px;
    height: 58px;
}

.steelCompareStarterPair__arrow {
    width: 16px;
    height: 16px;
    margin-bottom: 4px;
    transition: filter .16s ease;
}

.steelCompareStarterPair:hover .steelCompareStarterPair__arrow,
.steelCompareStarterPair:focus-visible .steelCompareStarterPair__arrow {
    filter: brightness(0) invert(1);
}

.steelCompareStarter__note {
    margin: 18px 0 0;
    padding-left: 12px;
    border-left: 2px solid #c7cbd0;
    color: var(--steel-compare-muted);
    font-size: 13px;
    line-height: 1.45;
}

.steelCompareModal[hidden] {
    display: none;
}

.steelCompareModal {
    position: fixed;
    z-index: 10001;
    inset: 0;
    display: grid;
    padding: 40px 20px;
    place-items: center;
}

.steelCompareModal__backdrop {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    padding: 0;
    border: 0;
    background: rgba(16, 19, 24, .72);
}

.steelCompareModal__dialog {
    position: relative;
    display: flex;
    width: min(700px, 100%);
    max-height: calc(100vh - 80px);
    overflow: hidden;
    flex-direction: column;
    border-radius: 10px;
    background: #fff;
    box-shadow: 0 22px 70px rgba(0, 0, 0, .3);
}

.steelCompareModal__header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 20px;
    padding: 26px 30px 18px;
}

.steelCompareModal__header h2 {
    margin: 0 0 4px;
    font-size: 25px;
}

.steelCompareModal__header p {
    margin: 0;
    color: var(--steel-compare-muted);
}

.steelCompareModal__titleMobile {
    display: none;
}

.steelCompareModal__close {
    display: grid;
    width: 38px;
    height: 38px;
    padding: 0;
    place-items: center;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    cursor: pointer;
}

.steelCompareModal__close img {
    width: 19px;
    filter: grayscale(1);
}

.steelCompareModal__filters {
    padding: 0 30px 20px;
    border-bottom: 1px solid var(--steel-compare-line);
}

.steelCompareModal__search {
    position: relative;
    display: block;
}

.steelCompareModal__search::before {
    position: absolute;
    top: 50%;
    left: 14px;
    width: 20px;
    height: 20px;
    background: url('/local/components/blades/steel.grade.compare/assets/magnify.svg') center / contain no-repeat;
    content: '';
    filter: grayscale(1);
    transform: translateY(-50%);
}

.steelCompareModal__search input {
    width: 100%;
    height: 46px;
    padding: 0 16px 0 45px;
    border: 1px solid #d6d9de;
    border-radius: 6px;
    outline: 0;
}

.steelCompareModal__search input:focus {
    border-color: #8b9199;
    box-shadow: 0 0 0 3px rgba(80, 88, 98, .1);
}

.steelCompareModal__filterRow {
    display: grid;
    grid-template-columns: 1fr 1fr auto auto;
    gap: 14px;
    align-items: center;
    margin-top: 16px;
}

.steelCompareModal__filterRow select {
    width: 100%;
    height: 40px;
    padding: 0 34px 0 12px;
    border: 1px solid #d6d9de;
    border-radius: 5px;
    background: #fff;
    appearance: auto !important;
}

.steelCompareModal__availableOnly {
    display: flex;
    align-items: center;
    gap: 8px;
    color: #4f555d;
    white-space: nowrap;
}

.steelCompareModal__availableOnly input {
    width: 17px;
    height: 17px;
    appearance: checkbox !important;
    -webkit-appearance: checkbox !important;
}

.steelCompareModal__filterRow > strong {
    color: #4f555d;
    font-size: 12px;
    white-space: nowrap;
}

.steelCompareModal__list {
    min-height: 260px;
    padding: 0 30px 28px;
    overflow-y: auto;
}

.steelCompareModal__groupHeader {
    display: flex;
    align-items: center;
    min-height: 58px;
    border-bottom: 1px solid var(--steel-compare-line);
    color: #152f67;
    font-size: 13px;
    text-transform: uppercase;
}

.steelCompareModal__groupHeader img {
    max-width: 190px;
    max-height: 31px;
    object-fit: contain;
    object-position: left center;
}

.steelCompareModal__grade {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 130px 105px;
    gap: 16px;
    align-items: center;
    min-height: 68px;
    padding: 10px 8px;
    border-bottom: 1px solid var(--steel-compare-line);
}

.steelCompareModal__grade--selected {
    background: #f3f4f5;
}

.steelCompareModal__identity strong,
.steelCompareModal__identity span {
    display: block;
}

.steelCompareModal__identity strong {
    margin-bottom: 3px;
    font-size: 16px;
    font-weight: 500;
}

.steelCompareModal__identity span {
    color: var(--steel-compare-muted);
    font-size: 12px;
}

.steelCompareModal__stock {
    display: flex;
    align-items: center;
    gap: 8px;
    color: #555b64;
    font-size: 12px;
}

.steelCompareModal__add {
    min-height: 34px;
    padding: 7px 12px;
    color: #111;
    border: 1px solid #bfc4ca;
    border-radius: 4px;
    background: #fff;
    cursor: pointer;
}

.steelCompareModal__add:hover:not(:disabled) {
    border-color: var(--steel-compare-accent);
    background: #fff8e9;
}

.steelCompareModal__add--remove {
    color: #626972;
    border-color: transparent;
    background: transparent;
}

.steelCompareModal__add--remove:hover:not(:disabled) {
    color: #a23a32;
    border-color: #d8aaa6;
    background: #fff7f6;
}

.steelCompareModal__add:disabled {
    color: #777d85;
    border-color: transparent;
    background: transparent;
    cursor: default;
}

.steelCompareModal__notFound {
    padding: 40px 0;
    color: var(--steel-compare-muted);
    text-align: center;
}

.steelCompareModalOpen {
    overflow: hidden;
}

.visually-hidden {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
}

@media (max-width: 1180px) {
    .steelCompareStarter__builder {
        grid-template-columns: minmax(0, 1fr) 42px minmax(0, 1fr);
    }

    .steelCompareStarter__submit {
        grid-column: 1 / -1;
        width: 100%;
    }

    .steelCompareStarterMetric {
        padding-right: 18px;
        padding-left: 18px;
    }

    .steelCompareStarterPair {
        grid-template-columns: minmax(0, 1fr) 82px 16px;
    }

    .steelCompareStarterPair__chart {
        width: 82px;
    }

    .steelCompare__cards {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .steelCompare__body {
        grid-template-columns: minmax(0, 1fr) 200px;
        gap: 20px;
    }
}

@media (max-width: 760px) {
    .steelCompare p,
    .steelCompare a,
    .steelCompare span,
    .steelCompare strong,
    .steelCompare small,
    .steelCompare th,
    .steelCompare td {
        font-family: "roboto_ltregular", Arial, Helvetica, sans-serif !important;
    }

    .steelCompare {
        width: calc(100% + 24px);
        margin-left: -12px;
    }

    .steelCompare__header {
        display: block;
        padding: 0 16px;
        margin: 4px 0 18px;
    }

    .steelCompare__header h1 {
        margin-bottom: 7px;
        font-size: 25px;
        line-height: 1.14;
    }

    .steelCompare__header p {
        font-size: 13px;
        line-height: 1.45;
    }

    .steelCompare__headerTools {
        justify-content: space-between;
        margin-top: 16px;
    }

    .steelCompareStarter {
        width: auto;
        margin: 0 16px 28px;
    }

    .steelCompareStarter__hero {
        padding: 18px 16px;
        border-radius: 6px;
    }

    .steelCompareStarter__builder {
        grid-template-columns: 1fr;
        gap: 13px;
    }

    .steelCompareStarter__builder label {
        gap: 6px;
    }

    .steelCompareStarter__builder select {
        height: 44px;
    }

    .steelCompareStarter__submit {
        grid-column: auto;
        width: 100%;
    }

    .steelCompareStarter__swap {
        width: 44px;
        height: 28px;
        margin: -5px auto;
        transform: rotate(90deg);
    }

    .steelCompareStarter__metrics {
        grid-template-columns: 1fr;
        padding: 0 16px;
    }

    .steelCompareStarterMetric {
        min-height: 0;
        padding: 15px 0;
    }

    .steelCompareStarterMetric + .steelCompareStarterMetric {
        border-top: 1px solid var(--steel-compare-line);
        border-left: 0;
    }

    .steelCompareStarterMetric strong {
        min-width: 72px;
        font-size: 27px;
    }

    .steelCompareStarterMetric--statement strong {
        min-width: 0;
    }

    .steelCompareStarter__ready {
        margin-top: 25px;
    }

    .steelCompareStarter__readyHeading {
        display: block;
        margin-bottom: 11px;
    }

    .steelCompareStarter__ready h2 {
        font-size: 21px;
    }

    .steelCompareStarter__readyHeading > span {
        display: block;
        margin-top: 3px;
    }

    .steelCompareStarter__pairs {
        grid-template-columns: 1fr;
        gap: 8px;
    }

    .steelCompareStarterPair {
        grid-template-columns: minmax(0, 1fr) 94px 16px;
        min-height: 92px;
        padding: 13px 12px;
    }

    .steelCompareStarterPair__copy strong {
        margin-bottom: 4px;
        font-size: 15px;
    }

    .steelCompareStarterPair__copy span {
        font-size: 11px;
    }

    .steelCompareStarterPair__chart {
        width: 94px;
        height: 50px;
    }

    .steelCompareStarter__note {
        margin-top: 14px;
        padding-left: 9px;
        font-size: 11px;
    }

    .steelCompare__share span:not(.steelCompare__shareStatus) {
        display: none;
    }

    .steelCompare__cards {
        display: flex;
        gap: 12px;
        padding: 0 16px 6px;
        overflow-x: auto;
        scrollbar-width: none;
        scroll-snap-type: x proximity;
        -webkit-overflow-scrolling: touch;
    }

    .steelCompare__selection {
        margin-bottom: 18px;
    }

    .steelCompare__cards::-webkit-scrollbar,
    .steelCompare__nav::-webkit-scrollbar,
    .steelCompare__tableScroll::-webkit-scrollbar {
        display: none;
    }

    .steelCompareCard,
    .steelCompareAddCard {
        width: min(82vw, 310px);
        min-width: min(82vw, 310px);
        min-height: 224px;
        padding: 18px;
        scroll-snap-align: start;
    }

    .steelCompareCard__name {
        margin-top: 8px;
        font-size: 24px;
    }

    .steelCompareCard__commercial strong {
        font-size: 16px;
    }

    .steelCompare__body {
        display: block;
    }

    .steelCompare__sidebar {
        position: static;
        margin: 0 16px 16px;
    }

    .steelCompare__nav {
        display: flex;
        margin: 0;
        overflow-x: auto;
        border-radius: 6px;
        scrollbar-width: none;
        -webkit-overflow-scrolling: touch;
    }

    .steelCompare__navItem {
        min-width: max-content;
        min-height: 46px;
        padding: 10px 14px;
        border-right: 1px solid var(--steel-compare-line);
        border-bottom: 0;
    }

    .steelCompare__navItem--active {
        box-shadow: inset 0 -3px #20242a;
    }

    .steelCompare__switch--sidebar {
        display: none;
    }

    .steelCompare__content {
        padding: 0 16px;
    }

    .steelCompare__contentStack {
        gap: 36px;
    }

    .steelCompare__sectionHeader {
        min-height: 0;
        margin-bottom: 10px;
    }

    .steelCompare__sectionHeader h2 {
        font-size: 20px;
    }

    .steelCompare__sectionHeader p {
        font-size: 12px;
    }

    .steelCompare__table {
        min-width: 700px;
    }

    .steelCompareChartPanel {
        padding: 14px 8px 8px;
        overflow: hidden;
    }

    .steelCompareChartPanel__heading {
        display: block;
    }

    .steelCompareChartPanel__heading span {
        display: block;
        margin-top: 3px;
        text-align: left;
    }

    .steelCompareChart--radar {
        height: 330px;
    }

    .steelCompareChart--bars {
        height: 285px;
    }

    .steelCompareChart--heatmap {
        height: 330px;
    }

    .steelCompareChemistryLegend {
        gap: 8px 16px;
        padding: 0;
        font-size: 11px;
    }

    .steelCompareSources {
        grid-template-columns: 1fr;
    }

    .steelCompare__table th,
    .steelCompare__table td {
        padding: 11px 12px;
    }

    .steelCompare__table thead .steelCompare__parameterHeader,
    .steelCompare__table tbody th {
        position: sticky;
        left: 0;
        z-index: 1;
        width: 155px;
        background: #fff;
        box-shadow: 1px 0 var(--steel-compare-line);
    }

    .steelCompare__table thead .steelCompare__parameterHeader {
        z-index: 2;
        background: #fafafa;
    }

    .steelCompare[data-selected-count="1"] .steelCompare__tableScroll {
        overflow-x: hidden;
        scrollbar-width: none;
    }

    .steelCompare[data-selected-count="1"] .steelCompare__table {
        min-width: 0;
        table-layout: fixed;
    }

    .steelCompare[data-selected-count="1"] .steelCompare__table thead .steelCompare__parameterHeader,
    .steelCompare[data-selected-count="1"] .steelCompare__table tbody th {
        width: 43%;
    }

    .steelCompare[data-selected-count="1"] .steelCompare__table th,
    .steelCompare[data-selected-count="1"] .steelCompare__table td {
        padding: 10px 11px;
        overflow-wrap: anywhere;
    }

    .steelCompare[data-selected-count="1"] .steelCompare__table tbody td strong {
        font-size: 14px;
        line-height: 1.28;
    }

    .steelCompare[data-selected-count="1"] .steelCompare__longText {
        font-size: 12px !important;
        line-height: 1.42;
    }

    .steelCompare[data-selected-count="1"] .steelCompareChemistryElement {
        gap: 8px;
    }

    .steelCompare[data-selected-count="1"] .steelCompareChemistryElement > b {
        width: 36px;
        height: 36px;
        flex-basis: 36px;
        font-size: 15px;
    }

    .steelCompare[data-selected-count="1"] .steelCompareChemistryValue {
        min-height: 0;
        padding: 9px;
    }

    .steelCompare[data-selected-count="1"] .steelCompareChemistryValue strong {
        font-size: 16px !important;
    }

    .steelCompare[data-selected-count="1"] .steelCompareChemistryValue small {
        font-size: 10px;
        line-height: 1.38;
    }

    .steelCompareModal {
        display: block;
        padding: 0;
    }

    .steelCompareModal__backdrop {
        display: none;
    }

    .steelCompareModal__dialog {
        width: 100%;
        height: 100%;
        max-height: none;
        outline: 0;
        border-radius: 0;
        box-shadow: none;
    }

    .steelCompareModal__header {
        min-height: 78px;
        padding: 14px 18px;
        align-items: center;
        justify-content: center;
        text-align: center;
        border-bottom: 1px solid var(--steel-compare-line);
    }

    .steelCompareModal__header h2 {
        margin-bottom: 2px;
        font-size: 22px;
        line-height: 1.15;
    }

    .steelCompareModal__header p {
        font-size: 12px;
    }

    .steelCompareModal__titleDesktop {
        display: none;
    }

    .steelCompareModal__titleMobile {
        display: inline;
    }

    .steelCompareModal__close {
        position: absolute;
        left: 12px;
        top: 19px;
    }

    .steelCompareModal__filters {
        padding: 14px 16px;
    }

    .steelCompareModal__search input {
        height: 46px;
    }

    .steelCompareModal__filterRow {
        grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr) auto;
        gap: 8px;
        margin-top: 12px;
    }

    .steelCompareModal__availableOnly {
        min-height: 40px;
        padding: 0 10px;
        justify-content: center;
        border: 1px solid #d6d9de;
        border-radius: 5px;
    }

    .steelCompareModal__availableOnly span {
        font-size: 0;
    }

    .steelCompareModal__availableOnly span::after {
        content: 'В продаже';
        font-size: 13px;
    }

    .steelCompareModal__filterRow > strong {
        grid-column: 1 / -1;
        padding-left: 2px;
    }

    .steelCompareModal__list {
        padding: 0 16px 32px;
    }

    .steelCompareModal__groupHeader {
        min-height: 52px;
    }

    .steelCompareModal__identity strong {
        font-size: 15px;
    }

    .steelCompareModal__identity span,
    .steelCompareModal__stock {
        font-size: 11px;
    }

    .steelCompareModal__grade {
        grid-template-columns: minmax(0, 1fr) 102px 86px;
        min-height: 76px;
    }

    .steelCompareModal__stock {
        grid-column: 2;
        grid-row: 1;
    }

    .steelCompareModal__add {
        grid-row: 1;
        grid-column: 3;
        min-width: 86px;
    }
}

@media (max-width: 390px) {
    .steelCompareModal__filterRow {
        grid-template-columns: 1fr 1fr;
    }

    .steelCompareModal__availableOnly {
        grid-column: 1;
    }

    .steelCompareModal__filterRow > strong {
        grid-column: 2;
    }

    .steelCompareModal__grade {
        grid-template-columns: minmax(0, 1fr) 88px;
    }

    .steelCompareModal__stock {
        grid-column: 1;
        grid-row: 2;
    }

    .steelCompareModal__add {
        grid-column: 2;
        grid-row: 1 / span 2;
    }
}

/* End */
/* /local/components/blades/steel.grade.compare/templates/.default/style.css?179136651444477 */