/* reviews */
.reviews { padding: 4rem 0; border-top: 1px solid var(--line); }
.reviews h2 { font-size: clamp(1.8rem, 5vw, 2.4rem); margin-bottom: 1.6rem; }
.rv-top { display: grid; gap: 1rem; margin-bottom: 2.6rem; }
.rv-panel { background: var(--bg-2); border-radius: 18px; padding: 1.5rem; }
.rv-panel h3 { font-size: 1.3rem; margin-bottom: .3rem; }
.score { display: flex; align-items: center; gap: 1.2rem; }
.score .num { font-family: Mitr, Georgia, serif; font-size: 4rem; font-weight: 500; line-height: 1; }
.score p { margin: .35rem 0 0; color: var(--muted); }
.stars { position: relative; display: inline-block; font-size: 1.3rem; letter-spacing: .08em; line-height: 1; color: var(--line); white-space: nowrap; }
.stars::before { content: "★★★★★"; position: absolute; left: 0; top: 0; width: var(--pct, 100%); overflow: hidden; white-space: nowrap; color: var(--star); }
.rv-panel .link { display: inline-block; margin-top: 1rem; font-weight: 600; text-underline-offset: 4px; }
.rate-note { margin: 0; color: var(--muted); font-size: .95rem; }
.st-row { display: flex; gap: .15rem; margin: .5rem 0 .6rem -.3rem; }
.st { width: 3rem; height: 3rem; padding: 0; border: 0; border-radius: 10px; background: none; cursor: pointer; font-size: 2.1rem; line-height: 1; color: var(--line); transition: transform .12s ease; }
.st.on { color: var(--star); }
.st-row:hover .st { color: var(--star); }
.st-row .st:hover ~ .st { color: var(--line); }
.st:hover { transform: scale(1.12); }
#rate-msg { min-height: 3em; margin: 0 0 .8rem; }
.rv-bar { display: flex; align-items: end; justify-content: space-between; gap: 1rem; margin-bottom: 1rem; }
.rv-bar h3 { font-size: 1.4rem; }
.rv-nav { display: none; gap: .5rem; }
.rv-nav button { width: 2.75rem; height: 2.75rem; border-radius: 50%; border: 1.5px solid var(--line); background: none; color: var(--ink); font-size: 1.3rem; cursor: pointer; }
.rv-nav button:hover { background: var(--bg-2); }
@media (min-width: 800px) { .rv-nav { display: flex; } .rv-top { grid-template-columns: 1fr 1fr; } }
.rv-scroll { display: flex; gap: 1rem; overflow-x: auto; scroll-snap-type: x mandatory; padding: .2rem 1.25rem 1rem; margin: 0 -1.25rem; scrollbar-width: thin; scroll-padding-inline: 1.25rem; }
.rv-card { flex: 0 0 min(82%, 320px); scroll-snap-align: start; background: var(--bg-2); border-radius: 16px; padding: 1.3rem; display: flex; flex-direction: column; gap: .55rem; }
.rv-card h4 { margin: 0; font: 500 1.15rem/1.25 Mitr, Georgia, serif; }
.rv-card p { margin: 0; color: var(--muted); }
.rv-card .who { margin-top: auto; padding-top: .4rem; font-size: .9rem; }
.rv-card .stars { font-size: 1.05rem; }
.rv-note { margin: .4rem 0 0; font-size: .88rem; color: var(--muted); }
.gbadge { display: inline-flex; align-items: center; gap: .6rem; margin: 0 0 1.4rem; color: var(--cream); text-decoration: none; font-weight: 500; }
.gbadge .stars { --star: var(--mango); color: rgba(255, 246, 223, .3); font-size: 1.05rem; }
.gbadge:hover span:last-child { text-decoration: underline; text-underline-offset: 4px; }
.rv-panel .src { margin: .35rem 0 0; color: var(--muted); }

.rv-panel .src { margin-top: 1rem; line-height: 1.9; }
.rv-panel .src .link { margin: 0 .55rem 0 0; }
.rate-label { display: block; margin: .5rem 0 .3rem; font-size: .95rem; color: var(--muted); }
.rate-select { width: 100%; max-width: 16rem; min-height: 2.75rem; padding: .4rem .8rem; border: 2px solid var(--line); border-radius: 12px; background: var(--bg); color: var(--ink); font: 500 1rem/1.2 Prompt, system-ui, sans-serif; }