.kp-pr-panel {
    --kp-pr-ink: #211f1b;
    --kp-pr-muted: #6d675d;
    --kp-pr-surface: #fbf7ef;
    --kp-pr-surface-strong: #f1e6d1;
    --kp-pr-accent: #b76522;
    --kp-pr-star: #d9822b;
    --kp-pr-border: rgba(64, 50, 32, 0.15);
    --kp-pr-focus: #0b63ce;
    box-sizing: border-box;
    width: 100%;
    margin: 0 0 clamp(1.5rem, 4vw, 3rem);
    color: var(--kp-pr-ink);
    font-family: inherit;
}

.kp-pr-panel *,
.kp-pr-panel *::before,
.kp-pr-panel *::after {
    box-sizing: inherit;
}

.kp-pr-summary {
    display: grid;
    grid-template-columns: minmax(12rem, 0.72fr) minmax(18rem, 1.28fr);
    gap: clamp(1.5rem, 5vw, 4rem);
    align-items: center;
    padding: clamp(1.35rem, 4vw, 2.5rem);
    overflow: hidden;
    border: 1px solid var(--kp-pr-border);
    border-radius: 1.25rem;
    background:
        radial-gradient(circle at 8% 18%, rgba(217, 130, 43, 0.16), transparent 38%),
        linear-gradient(135deg, #fffdf9 0%, var(--kp-pr-surface) 100%);
    box-shadow: 0 1.2rem 3rem rgba(68, 45, 20, 0.08);
}

.kp-pr-score {
    position: relative;
}

.kp-pr-score::after {
    position: absolute;
    top: 0;
    right: clamp(-2rem, -4vw, -1rem);
    width: 1px;
    height: 100%;
    background: var(--kp-pr-border);
    content: '';
}

.kp-pr-eyebrow {
    margin: 0 0 0.55rem;
    color: var(--kp-pr-accent);
    font-size: 0.76rem;
    font-weight: 750;
    letter-spacing: 0.11em;
    line-height: 1.4;
    text-transform: uppercase;
}

.kp-pr-score__value {
    margin: 0;
    color: var(--kp-pr-ink);
    font-size: clamp(2.75rem, 7vw, 4.6rem);
    font-weight: 780;
    letter-spacing: -0.065em;
    line-height: 0.96;
}

.kp-pr-score__value span {
    color: var(--kp-pr-muted);
    font-size: 0.34em;
    font-weight: 600;
    letter-spacing: 0;
}

.kp-pr-stars {
    display: inline-block;
    margin-top: 0.8rem;
    background: linear-gradient(
        90deg,
        var(--kp-pr-star) 0 var(--kp-pr-rating),
        rgba(33, 31, 27, 0.16) var(--kp-pr-rating) 100%
    );
    background-clip: text;
    -webkit-background-clip: text;
    color: transparent;
    font-size: 1.15rem;
    letter-spacing: 0.12em;
    line-height: 1;
}

.kp-pr-score__count {
    margin: 0.55rem 0 0;
    color: var(--kp-pr-muted);
    font-size: 0.9rem;
}

.kp-pr-distribution {
    display: grid;
    gap: 0.3rem;
}

.kp-pr-distribution__row {
    display: grid;
    grid-template-columns: 4.9rem minmax(5rem, 1fr) 2.4rem;
    gap: 0.75rem;
    align-items: center;
    min-height: 2.25rem;
    padding: 0.25rem 0.5rem;
    border: 1px solid transparent;
    border-radius: 0.65rem;
    color: var(--kp-pr-ink);
    font-size: 0.86rem;
    text-decoration: none !important;
    transition: background-color 180ms ease, border-color 180ms ease, transform 180ms ease;
}

.kp-pr-distribution__row:hover,
.kp-pr-distribution__row.is-active {
    border-color: var(--kp-pr-border);
    background: rgba(255, 255, 255, 0.72);
    color: var(--kp-pr-ink);
    transform: translateX(0.2rem);
}

.kp-pr-distribution__row:focus-visible,
.kp-pr-filter:focus-visible,
.kp-pr-sort select:focus-visible,
.kp-pr-sort__submit:focus-visible {
    outline: 3px solid var(--kp-pr-focus);
    outline: 3px solid color-mix(in srgb, var(--kp-pr-focus) 55%, transparent);
    outline-offset: 2px;
}

.kp-pr-distribution__label {
    font-weight: 650;
}

.kp-pr-distribution__track {
    height: 0.55rem;
    overflow: hidden;
    border-radius: 999px;
    background: rgba(33, 31, 27, 0.1);
}

.kp-pr-distribution__fill {
    display: block;
    width: var(--kp-pr-width);
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, var(--kp-pr-accent), var(--kp-pr-star));
}

.kp-pr-distribution__count {
    color: var(--kp-pr-muted);
    font-variant-numeric: tabular-nums;
    text-align: right;
}

.kp-pr-toolbar {
    display: flex;
    gap: 0.8rem 1rem;
    align-items: center;
    justify-content: space-between;
    margin-top: 1rem;
    min-height: 2.75rem;
}

.kp-pr-filter {
    display: inline-flex;
    gap: 0.45rem;
    align-items: center;
    min-height: 2.5rem;
    padding: 0.55rem 0.8rem;
    border: 1px solid var(--kp-pr-border);
    border-radius: 999px;
    background: var(--kp-pr-surface);
    color: var(--kp-pr-ink);
    font-size: 0.84rem;
    font-weight: 650;
    text-decoration: none !important;
}

.kp-pr-filter span[aria-hidden='true'] {
    font-size: 1.2rem;
    line-height: 0.8;
}

.kp-pr-sort {
    display: flex;
    gap: 0.6rem;
    align-items: center;
    margin-left: auto;
}

.kp-pr-sort label {
    margin: 0;
    color: var(--kp-pr-muted);
    font-size: 0.84rem;
    font-weight: 600;
}

.kp-pr-sort select,
.kp-pr-sort__submit {
    min-height: 2.75rem;
    margin: 0;
    border: 1px solid var(--kp-pr-border);
    border-radius: 0.75rem;
    background: #fff;
    color: var(--kp-pr-ink);
    font: inherit;
    font-size: 0.9rem;
}

.kp-pr-sort select {
    min-width: 10.5rem;
    padding: 0.55rem 2.2rem 0.55rem 0.8rem;
}

.kp-pr-sort__submit {
    padding: 0.55rem 0.9rem;
    background: var(--kp-pr-ink);
    color: #fff;
    cursor: pointer;
}

.kp-pr-js .kp-pr-sort__submit {
    display: none;
}

@media (max-width: 720px) {
    .kp-pr-summary {
        grid-template-columns: 1fr;
        gap: 1.5rem;
    }

    .kp-pr-score::after {
        top: auto;
        right: 0;
        bottom: -0.8rem;
        width: 100%;
        height: 1px;
    }

    .kp-pr-toolbar {
        align-items: stretch;
        flex-direction: column;
    }

    .kp-pr-sort {
        align-items: stretch;
        flex-direction: column;
        margin-left: 0;
    }

    .kp-pr-sort select,
    .kp-pr-sort__submit {
        width: 100%;
    }
}

@media (prefers-reduced-motion: reduce) {
    .kp-pr-distribution__row {
        transition: none;
    }
}