@layer reset, tokens, base, layout, components, utilities;
@layer components{
/* == c-cmp ====== */
.c-cmp{min-inline-size:0}
.c-cmp__form{display:grid;gap:var(--sp-3);min-inline-size:0}
.c-cmp__field{display:grid;gap:var(--sp-1);min-inline-size:0}
.c-cmp__input{padding-inline:var(--sp-3)}
.c-cmp__go{justify-self:start;min-inline-size:var(--tap)}
.c-cmp__err{color:var(--warn);font:var(--t-data)}
.c-cmp__pairs{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--sp-2);list-style:none;padding:0}
.c-cmp__pair{display:flex;align-items:center;gap:var(--sp-2);min-block-size:var(--tap);padding:var(--sp-2) var(--sp-3);background:var(--surface-1);border:1px solid var(--line-1);border-radius:var(--r-2);font:var(--t-data);font-weight:600;color:var(--text-1)}
.c-cmp__pair:hover{border-color:var(--line-hover);text-decoration:none}
.c-cmp__vs{font:var(--t-meta);color:var(--text-3)}
.c-cmp__heads{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--sp-3)}
.c-cmp__who{display:flex;align-items:center;gap:var(--sp-2);min-block-size:var(--tap);min-inline-size:0;color:var(--text-1)}
.c-cmp__who--b{flex-direction:row-reverse;text-align:end}
.c-cmp__nm{display:grid;min-inline-size:0}
.c-cmp__name{font:600 var(--fs-16)/1.3 var(--font-sans);overflow-wrap:anywhere}
.c-cmp__h2h{display:flex;flex-wrap:wrap;align-items:baseline;gap:var(--sp-2);font:var(--t-data);color:var(--text-2);max-inline-size:none}
.c-cmp__n{font:600 var(--fs-24)/1 var(--font-score);color:var(--gold)}
.c-cmp__none{font:var(--t-data);color:var(--text-3)}
.c-cmp__table{inline-size:100%;table-layout:fixed;background:var(--surface-1);border-radius:var(--r-3);box-shadow:var(--e1)}
.c-cmp__table caption{caption-side:top;padding:var(--sp-2) 0;text-align:start;font:var(--t-label);letter-spacing:var(--tr-label);text-transform:uppercase;color:var(--text-3)}
.c-cmp__table :is(th,td){block-size:44px;padding:var(--sp-1) var(--sp-3);border-block-end:1px solid var(--line-1);vertical-align:middle}
.c-cmp__table thead th{font:var(--t-label);color:var(--text-3);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.c-cmp__table thead th:last-child,.c-cmp__v--b{text-align:end}
.c-cmp__table :is(thead th:nth-child(2),tbody th){inline-size:34%;text-align:center;font:var(--t-meta);color:var(--text-3)}
.c-cmp__v{font:600 var(--fs-18)/1.2 var(--font-score);color:var(--text-2);font-variant-numeric:tabular-nums lining-nums}
.c-cmp__v.is-lead{color:var(--gold)}
.c-bar{display:block;block-size:4px;margin-block-start:var(--sp-1);border-radius:var(--r-pill);background:var(--surface-4);inline-size:0}
.c-cmp__v--b .c-bar{margin-inline-start:auto}
.is-lead .c-bar{background:var(--gold)}
.c-bar[data-w="1"]{inline-size:10%}.c-bar[data-w="2"]{inline-size:20%}.c-bar[data-w="3"]{inline-size:30%}.c-bar[data-w="4"]{inline-size:40%}.c-bar[data-w="5"]{inline-size:50%}
.c-bar[data-w="6"]{inline-size:60%}.c-bar[data-w="7"]{inline-size:70%}.c-bar[data-w="8"]{inline-size:80%}.c-bar[data-w="9"]{inline-size:90%}.c-bar[data-w="10"]{inline-size:100%}
.c-cmp__links{display:flex;flex-wrap:wrap;gap:var(--sp-2)}
.c-cmp__links .c-chip{min-block-size:var(--tap)}
:lang(hi) .c-cmp__table caption{letter-spacing:0;text-transform:none}
@media (min-width:37.5em){.c-cmp__form{grid-template-columns:minmax(0,1fr) minmax(0,1fr) auto;align-items:end}.c-cmp__pairs{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:64em){.c-cmp__pairs{grid-template-columns:repeat(3,minmax(0,1fr))}.c-cmp__fmt{max-inline-size:880px}}
}