:root {
    --muted: #525252;
    --faint: #707070;
    --font-sans: "Pretendard Variable", Pretendard, "Noto Sans KR",
        "Apple SD Gothic Neo", "Malgun Gothic", system-ui, sans-serif;
    --font-mono: "Geist Mono", "JetBrains Mono", "SFMono-Regular",
        "Cascadia Code", Consolas, "Malgun Gothic", monospace;
}

html {
    font-family: var(--font-sans);
    font-size: 16px;
    line-height: 1.5;
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
}

button,
input,
select {
    line-height: 1.4;
}

.brand-mark,
.provider-mark,
.eyebrow,
.search-box kbd,
.summary-strip strong,
.count,
.tag,
.status,
.overview-count,
.item-detail-section h3,
.expanded-comfy h3,
.item-facts dt,
.rank-number,
.rank-score,
.comparison-table th:first-child {
    font-family: var(--font-mono);
}

.brand p,
.sidebar-footer p,
.meta-line,
.summary-strip span,
.summary-lead h2,
.group-button small,
.panel-head h2 span {
    font-size: 13px;
    line-height: 1.5;
}

.eyebrow {
    font-size: 11px;
    font-weight: 600;
    letter-spacing: .04em;
}

.search-box input {
    font-size: 15px;
}

.search-box kbd,
.tag,
.status,
.overview-tile small {
    font-size: 12px;
}

.chip-button,
.row-sub,
.row-use strong,
.tray-chip,
.detail-source-link {
    font-size: 13px;
}

.row-summary,
.row-use,
.empty p {
    font-size: 14px;
    line-height: 1.6;
}

.overview-tile span,
.item-detail-section p,
.item-facts dd {
    font-size: 13px;
    line-height: 1.6;
}

.item-detail-section h3,
.expanded-comfy h3,
.item-facts dt {
    font-size: 12px;
    font-weight: 600;
    letter-spacing: .02em;
}

.rank-move,
.rank-score a,
.rank-copy small {
    font-size: 12px;
}

.rank-title-line h3 {
    font-size: 16px;
}

.rank-title-line span,
.rank-score span {
    font-size: 11px;
}

.rank-copy p {
    font-size: 13px;
    line-height: 1.6;
}

.tray-copy span {
    font-size: 12px;
}

.comparison-note,
.comparison-table {
    font-size: 14px;
}

.comparison-table th:first-child {
    font-size: 12px;
}

.comparison-table thead th {
    font-size: 15px;
}

@media (max-width: 520px) {
    html {
        font-size: 16px;
    }

    .row-summary,
    .row-use {
        font-size: 14px;
    }
}
