/* Local preview only (not committed): "Clarity Navy+" — personality pass on Clarity Navy.
   Active when <html data-design="clarity" data-tone="navy" data-plus="1">.
   html[data-design="clarity"][data-tone="navy"][data-plus] is expanded to that selector when the file is generated. */

html[data-design="clarity"][data-tone="navy"][data-plus] {
  --display:"Figtree","Zen Maru Gothic","Hiragino Maru Gothic ProN","Segoe UI",system-ui,sans-serif;
  --hand:"Patrick Hand","Klee One","Zen Maru Gothic",cursive;
  --pearl-off:#D9D0BD;
}
html[data-design="clarity"][data-tone="navy"][data-plus] body { font-family:var(--display); }
html[data-design="clarity"][data-tone="navy"][data-plus] ::selection { background:#F4EAD3; color:#172E50; }
html[data-design="clarity"][data-tone="navy"][data-plus] :focus-visible { outline:2px solid var(--n-gold); outline-offset:2px; }

/* ---------- Header: compass beside the wordmark, same edges as the content ---------- */
html[data-design="clarity"][data-tone="navy"][data-plus] .site-header { padding:0 max(24px, calc((100% - 1160px) / 2)); }
html[data-design="clarity"][data-tone="navy"][data-plus] .brand { display:inline-flex; align-items:center; gap:10px; }
html[data-design="clarity"][data-tone="navy"][data-plus] .brand::before { content:""; flex:none; width:26px; height:26px; background:url("navy-compass.svg") center / contain no-repeat; }
html[data-design="clarity"][data-tone="navy"][data-plus] .brand-wordmark { font-family:var(--display); font-weight:700; font-size:23px; letter-spacing:-.01em; }

/* ---------- Hero: centred, review carousel underneath ---------- */
html[data-design="clarity"][data-tone="navy"][data-plus] .home { display:grid; grid-template-columns:minmax(0,1fr); gap:32px; padding:48px 0 0; text-align:center; }
html[data-design="clarity"][data-tone="navy"][data-plus] .search-intro { width:100%; max-width:760px; margin:0 auto; text-align:center; align-items:center; }
html[data-design="clarity"][data-tone="navy"][data-plus] .search-intro::before, html[data-design="clarity"][data-tone="navy"][data-plus] .search-intro::after { content:none; display:none; }
html[data-design="clarity"][data-tone="navy"][data-plus] .home-eyebrow { display:none; margin:0 0 14px; font-size:12px; line-height:20px; letter-spacing:.14em; color:var(--n-gold-ink); }
html[data-design="clarity"][data-tone="navy"][data-plus][lang="ja"] .home-eyebrow { letter-spacing:.06em; }
html[data-design="clarity"][data-tone="navy"][data-plus] .home .scope-divider { display:inline-block; width:5px; height:5px; margin:0 10px; border-radius:50%; background:var(--n-gold); font-size:0; line-height:0; vertical-align:middle; position:relative; top:-1px; }
html[data-design="clarity"][data-tone="navy"][data-plus] .search-intro { container-type:inline-size; }
/* Headline: rounded "Find your", handwritten "next class." */
html[data-design="clarity"][data-tone="navy"][data-plus] .hero-wordmark { --emw:9.11; --hmax:72px; font-family:"Nunito",var(--display); font-weight:800; font-size:min(var(--hmax), calc(100cqi / var(--emw) * .95)); line-height:1.08; letter-spacing:-.02em; white-space:nowrap; font-variant-numeric:lining-nums; }
html[data-design="clarity"][data-tone="navy"][data-plus] .hero-emphasis { display:inline-block; margin-left:.06em; font-family:var(--hand); font-weight:400; font-size:1.15em; letter-spacing:0; transform:rotate(-2deg); }
html[data-design="clarity"][data-tone="navy"][data-plus][lang="ja"] .hero-wordmark { --emw:14.91; --hmax:52px; font-family:var(--display); font-weight:700; line-height:1.25; letter-spacing:.01em; }
html[data-design="clarity"][data-tone="navy"][data-plus][lang="ja"] .hero-emphasis { margin-left:0; font-family:"Klee One",cursive; font-weight:600; font-size:1.1em; transform:rotate(-1.5deg); }

/* Logo: your design G, recoloured to Keio navy with a gold gem */
html[data-design="clarity"][data-tone="navy"][data-plus] .site-header { height:68px; min-height:68px; }
html[data-design="clarity"][data-tone="navy"][data-plus] .brand { height:56px; padding:0; aspect-ratio:608 / 242; background:url("preview-logo-g-keio.png") left center / contain no-repeat; }
html[data-design="clarity"][data-tone="navy"][data-plus] .brand::before { content:none; display:none; }
html[data-design="clarity"][data-tone="navy"][data-plus] .brand-wordmark { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }
@media (max-width:740px) {
  html[data-design="clarity"][data-tone="navy"][data-plus] .site-header { height:58px; min-height:58px; }
  html[data-design="clarity"][data-tone="navy"][data-plus] .brand { height:46px; }
}
html[data-design="clarity"][data-tone="navy"][data-plus] .hero-emphasis { font-style:normal; text-decoration:none; }
html[data-design="clarity"][data-tone="navy"][data-plus][lang="ja"] .hero-emphasis { font-style:normal; }
html[data-design="clarity"][data-tone="navy"][data-plus] .home-description { font-size:19px; margin:12px 0 22px; }
html[data-design="clarity"][data-tone="navy"][data-plus] .catalog-search-shell { width:100%; max-width:640px; }
html[data-design="clarity"][data-tone="navy"][data-plus] .home .search-examples { justify-content:center; align-items:center; margin-top:14px; }
html[data-design="clarity"][data-tone="navy"][data-plus] .home .search-examples .browse-link { margin:0; padding-left:16px; min-height:0; gap:8px; font-size:inherit; box-shadow:inset 1px 0 0 var(--n-line); }
html[data-design="clarity"][data-tone="navy"][data-plus] .search-submit { background:var(--n-navy); color:#FFFFFF; border-radius:12px; }
html[data-design="clarity"][data-tone="navy"][data-plus] .search-submit:hover { background:var(--n-navy-2); }

/* Review carousel: light cards on the page, no heavy panel */
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-carousel { min-width:0; text-align:left; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-carousel-head { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:0 0 12px; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-carousel-titles { display:flex; align-items:baseline; flex-wrap:wrap; gap:4px 14px; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-carousel-label { font-size:12px; font-weight:600; letter-spacing:.08em; text-transform:uppercase; color:var(--n-gold-ink); }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-carousel-total { font-size:13px; color:var(--muted); }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-add { min-height:32px; padding:0; border:0; background:none; font:inherit; font-size:13px; font-weight:600; color:var(--n-navy); text-decoration:underline; text-decoration-color:var(--n-gold); text-underline-offset:4px; cursor:pointer; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-add:hover { color:var(--n-navy-2); }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-carousel-nav { display:flex; gap:8px; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-nav { width:40px; height:40px; display:grid; place-items:center; padding:0; border:1px solid #D8D0BF; border-radius:50%; background:#FFFFFF; color:var(--n-navy); cursor:pointer; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-nav:hover { border-color:var(--n-navy); }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-nav[aria-disabled="true"] { opacity:.4; cursor:default; border-color:#D8D0BF; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-track { display:flex; align-items:flex-start; gap:22px; margin:0; padding:16px 8px 22px; list-style:none; overflow-x:auto; scroll-snap-type:x mandatory; scroll-padding-inline:8px; overscroll-behavior-x:contain; scrollbar-width:none; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-track::-webkit-scrollbar { display:none; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-slide { --note:#FBF0C6; --tilt:-1.2deg; position:relative; flex:0 0 calc((100% - 66px) / 3.2); min-width:0; scroll-snap-align:start; display:flex; flex-direction:column; gap:14px; box-sizing:border-box; padding:26px 22px 18px; border:0; border-radius:3px; background:var(--note); box-shadow:4px 4px 0 rgba(23,46,80,.16); transform:rotate(var(--tilt)); transition:transform 180ms ease-out, box-shadow 180ms ease-out; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-slide:nth-child(3n+2) { --note:#E5ECF7; --tilt:.9deg; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-slide:nth-child(3n) { --note:#F7E8DA; --tilt:-.5deg; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-slide::before { content:""; position:absolute; top:-9px; left:50%; width:68px; height:20px; transform:translateX(-50%) rotate(-3deg); background:rgba(214,198,156,.5); box-shadow:inset 0 0 0 1px rgba(23,46,80,.05); }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-slide:hover, html[data-design="clarity"][data-tone="navy"][data-plus] .pn-slide:focus-within { transform:rotate(0deg) translateY(-3px); box-shadow:6px 7px 0 rgba(23,46,80,.18); }
@media (prefers-reduced-motion: reduce) { html[data-design="clarity"][data-tone="navy"][data-plus] .pn-slide { transition:none; } html[data-design="clarity"][data-tone="navy"][data-plus] .pn-slide:hover, html[data-design="clarity"][data-tone="navy"][data-plus] .pn-slide:focus-within { transform:rotate(var(--tilt)); } }
/* The whole review shows; each note is only as tall as its own text. */
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-quote { flex:0 0 auto; margin:0; font-family:var(--hand); font-size:21px; line-height:1.35; color:var(--n-navy); overflow-wrap:anywhere; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-slide-foot { margin:0; display:flex; align-items:flex-start; justify-content:space-between; gap:12px; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-slide-who { min-width:0; margin:0; display:flex; flex-direction:column; gap:1px; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-slide-who a { color:var(--n-navy); font-weight:600; text-decoration:none; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-slide-who a:hover { text-decoration:underline; text-decoration-color:var(--n-gold); text-underline-offset:3px; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-slide-who span { font-size:13px; color:var(--muted); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-slide-score { flex:none; display:flex; flex-direction:column; align-items:flex-end; gap:4px; font-size:13px; color:var(--muted); white-space:nowrap; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-slide-score strong { font-family:var(--display); font-size:20px; font-weight:700; color:var(--n-navy); font-variant-numeric:lining-nums; }

/* ---------- Pearl score mark: five pearls, halves allowed ---------- */
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-pearls { display:inline-flex; gap:3px; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-pearls i { width:7px; height:7px; border-radius:50%; background:transparent; box-shadow:inset 0 0 0 1px var(--pearl-off); animation:pn-pop 320ms cubic-bezier(.2,.7,.2,1) both; animation-delay:calc(var(--i) * 40ms); }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-pearls i.on { background:var(--n-gold); box-shadow:none; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-pearls i.half { background:linear-gradient(90deg, var(--n-gold) 50%, transparent 50%); box-shadow:inset 0 0 0 1px var(--n-gold); }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-pearls--lg { gap:5px; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-pearls--lg i { width:13px; height:13px; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-carousel .pn-pearls { gap:4px; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-carousel .pn-pearls i { width:9px; height:9px; box-shadow:inset 0 0 0 1px rgba(23,46,80,.28); }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-carousel .pn-pearls i.on { background:#B08A3E; box-shadow:none; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-carousel .pn-pearls i.half { background:linear-gradient(90deg, #B08A3E 50%, transparent 50%); box-shadow:inset 0 0 0 1px #B08A3E; }
@keyframes pn-pop { from { opacity:0; transform:scale(.4); } }
@media (prefers-reduced-motion: reduce) { html[data-design="clarity"][data-tone="navy"][data-plus] .pn-pearls i { animation:none; } }

/* ---------- One language at a time ---------- */
html[data-design="clarity"][data-tone="navy"][data-plus] .name-romanized,
html[data-design="clarity"][data-tone="navy"][data-plus] .course-native,
html[data-design="clarity"][data-tone="navy"][data-plus] .class-result-native,
html[data-design="clarity"][data-tone="navy"][data-plus] .professor-suggestion small { display:none; }

/* ---------- Typography: serif for display, sans for UI ---------- */
html[data-design="clarity"][data-tone="navy"][data-plus] .discovery-heading h2,
html[data-design="clarity"][data-tone="navy"][data-plus] .section-heading,
html[data-design="clarity"][data-tone="navy"][data-plus] .sidebar-card h2,
html[data-design="clarity"][data-tone="navy"][data-plus] .panel-heading h2,
html[data-design="clarity"][data-tone="navy"][data-plus] h2.panel-heading,
html[data-design="clarity"][data-tone="navy"][data-plus] .modal h2 { font-family:var(--display); font-weight:700; letter-spacing:-.015em; }
html[data-design="clarity"][data-tone="navy"][data-plus] .discovery-heading h2, html[data-design="clarity"][data-tone="navy"][data-plus] .section-heading { font-size:32px; }
html[data-design="clarity"][data-tone="navy"][data-plus] .sidebar-card h2 { font-size:22px; }
html[data-design="clarity"][data-tone="navy"][data-plus] .modal h2 { font-size:28px; color:var(--n-navy); }

/* ---------- Home: only what earns its place ---------- */
/* The carousel now carries recent reviews and the "add yours" prompt; guidelines stay in the footer. */
html[data-design="clarity"][data-tone="navy"][data-plus] .recent-section,
html[data-design="clarity"][data-tone="navy"][data-plus] .discovery-sidebar { display:none; }
html[data-design="clarity"][data-tone="navy"][data-plus] .discovery-filter-bar { justify-content:flex-start; padding-top:28px; }
html[data-design="clarity"][data-tone="navy"][data-plus] .discovery-layout { padding-top:24px; }
html[data-design="clarity"][data-tone="navy"][data-plus] .discovery-heading { margin-bottom:12px; }
html[data-design="clarity"][data-tone="navy"][data-plus] .directory-link { margin-top:8px; }

/* ---------- Professor list as a compact catalog table ---------- */
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-colhead,
html[data-design="clarity"][data-tone="navy"][data-plus] .faculty-card { display:grid; grid-template-columns:76px minmax(0,1fr) 92px 140px; column-gap:20px; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-colhead { white-space:nowrap; padding:0 24px 8px; font-size:11px; font-weight:600; letter-spacing:.08em; text-transform:uppercase; color:var(--muted); }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-colhead span:nth-child(n+3) { text-align:right; }
html[data-design="clarity"][data-tone="navy"][data-plus] .faculty-card { position:relative; row-gap:0; padding:16px 24px; align-items:start; }
html[data-design="clarity"][data-tone="navy"][data-plus] .faculty-identity > div:not(.professor-rating) { grid-column:2; grid-row:1; }
html[data-design="clarity"][data-tone="navy"][data-plus] .professor-rating { grid-column:1; grid-row:1 / span 2; align-self:start; display:flex; flex-direction:column; align-items:flex-start; justify-content:flex-start; gap:8px; width:auto; height:auto; min-height:0; flex-basis:auto; margin:0; padding:2px 0 0; border:0; border-radius:0; background:none; color:var(--n-navy); }
html[data-design="clarity"][data-tone="navy"][data-plus] .professor-rating.is-unrated { background:none; border:0; color:#A39B88; }
html[data-design="clarity"][data-tone="navy"][data-plus] .professor-rating-value { font-family:var(--display); font-size:34px; font-weight:700; line-height:.9; letter-spacing:-.02em; font-variant-numeric:lining-nums tabular-nums; border-bottom:0; padding-bottom:0; }
html[data-design="clarity"][data-tone="navy"][data-plus] .faculty-identity h3 { display:inline; font-family:var(--display); font-size:21px; font-weight:700; letter-spacing:-.01em; line-height:1.25; }
html[data-design="clarity"][data-tone="navy"][data-plus] .faculty-identity p { margin-top:2px; }
html[data-design="clarity"][data-tone="navy"][data-plus] .faculty-scores { display:contents; }
html[data-design="clarity"][data-tone="navy"][data-plus] .faculty-scores > div { grid-row:1; display:flex; flex-direction:column; align-items:flex-end; padding-top:4px; }
html[data-design="clarity"][data-tone="navy"][data-plus] .faculty-scores > div:first-child { grid-column:3; }
html[data-design="clarity"][data-tone="navy"][data-plus] .faculty-scores > div:last-child { grid-column:4; }
html[data-design="clarity"][data-tone="navy"][data-plus] .faculty-scores dt { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }
html[data-design="clarity"][data-tone="navy"][data-plus] .faculty-scores dd { font-size:16px; font-weight:600; font-variant-numeric:tabular-nums; }
html[data-design="clarity"][data-tone="navy"][data-plus] .faculty-courses { grid-column:2; grid-row:2; margin-top:6px; }
/* Review count sits on the courses line; the name already links to the profile. */
html[data-design="clarity"][data-tone="navy"][data-plus] .faculty-card-foot { grid-column:3 / -1; grid-row:2; align-self:end; justify-content:flex-end; padding-top:0; font-size:12px; line-height:20px; }
html[data-design="clarity"][data-tone="navy"][data-plus] .faculty-card-foot a { display:none; }

/* ---------- Reviews read like quotes ---------- */
html[data-design="clarity"][data-tone="navy"][data-plus] .review-scores { align-items:center; gap:12px; }
html[data-design="clarity"][data-tone="navy"][data-plus] .review-score { font-family:var(--display); font-size:26px; font-weight:700; font-variant-numeric:lining-nums; color:var(--n-navy); }
html[data-design="clarity"][data-tone="navy"][data-plus] .review-course { font-family:var(--display); font-size:20px; font-weight:700; letter-spacing:-.01em; }
html[data-design="clarity"][data-tone="navy"][data-plus] .review-comment { font-family:var(--display); font-size:18px; line-height:1.6; color:#1E2A3C; }
html[data-design="clarity"][data-tone="navy"][data-plus] .recent-professor { font-family:var(--display); font-size:17px; font-weight:700; }

/* ---------- Review form: 0.5–5 options ---------- */
html[data-design="clarity"][data-tone="navy"][data-plus] .rating-option input:checked + span { background:var(--n-navy); border-color:var(--n-navy); color:#FFFFFF; }
html[data-design="clarity"][data-tone="navy"][data-plus] .rating-option span { font-variant-numeric:tabular-nums; }

/* ---------- Professor page ---------- */
html[data-design="clarity"][data-tone="navy"][data-plus] .profile-intro { grid-template-columns:auto minmax(0,1fr); gap:32px; }
html[data-design="clarity"][data-tone="navy"][data-plus] .profile-score strong { font-family:var(--display); font-size:88px; font-weight:700; letter-spacing:-.03em; line-height:1; font-variant-numeric:lining-nums; box-shadow:none; }
html[data-design="clarity"][data-tone="navy"][data-plus] .profile-score .pn-pearls { display:flex; width:max-content; margin:10px 0 8px; }
html[data-design="clarity"][data-tone="navy"][data-plus] .profile-identity h1 { font-family:var(--display); font-weight:700; font-size:clamp(40px,5vw,60px); letter-spacing:-.02em; line-height:1.05; }
html[data-design="clarity"][data-tone="navy"][data-plus] .profile-identity .name-romanized { font-family:var(--display); font-size:20px; color:#6B6455; }
html[data-design="clarity"][data-tone="navy"][data-plus] .profile-secondary dd { font-family:var(--display); font-weight:700; font-variant-numeric:lining-nums; }

/* ---------- Directory & search results ---------- */
html[data-design="clarity"][data-tone="navy"][data-plus] .page-eyebrow { color:var(--n-gold-ink); font-size:12px; font-weight:600; letter-spacing:.1em; }
html[data-design="clarity"][data-tone="navy"][data-plus] .results-page h1 { font-family:var(--display); font-weight:700; font-size:clamp(36px,5vw,52px); letter-spacing:-.02em; color:var(--n-navy); }
html[data-design="clarity"][data-tone="navy"][data-plus] .results-heading { font-size:12px; font-weight:600; letter-spacing:.08em; text-transform:uppercase; color:var(--muted); }
html[data-design="clarity"][data-tone="navy"][data-plus] .result-row { grid-template-columns:76px minmax(0,1fr) auto 16px; align-items:start; }
html[data-design="clarity"][data-tone="navy"][data-plus] .result-name { font-family:var(--display); font-size:22px; font-weight:700; letter-spacing:-.01em; color:var(--n-navy); }
html[data-design="clarity"][data-tone="navy"][data-plus] .result-arrow { color:var(--n-gold); }
html[data-design="clarity"][data-tone="navy"][data-plus] .class-result-title { font-family:var(--display); font-size:20px; font-weight:700; color:var(--n-navy); }

/* ---------- Footer: slim navy strip ---------- */
html[data-design="clarity"][data-tone="navy"][data-plus] footer { margin-top:48px; padding:20px 0 76px; min-height:0; border:0; background:var(--n-navy); color:#C9D3E3; box-shadow:0 0 0 100vmax var(--n-navy); clip-path:inset(0 -100vmax); }
html[data-design="clarity"][data-tone="navy"][data-plus] .footer-link { color:var(--n-gold-on-navy); }

/* ---------- Narrower screens ---------- */
@media (max-width:1000px) {
  html[data-design="clarity"][data-tone="navy"][data-plus] .pn-slide { flex-basis:calc((100% - 44px) / 2.2); }
}
@media (max-width:960px) {
  html[data-design="clarity"][data-tone="navy"][data-plus] .profile-score strong { font-size:64px; }
}
@media (max-width:740px) {
  html[data-design="clarity"][data-tone="navy"][data-plus] .site-header { padding:0 16px; }
}
@media (max-width:680px) {
  html[data-design="clarity"][data-tone="navy"][data-plus] .home { gap:24px; padding-top:32px; }
  html[data-design="clarity"][data-tone="navy"][data-plus] .hero-wordmark { --hmax:46px; }
  html[data-design="clarity"][data-tone="navy"][data-plus][lang="ja"] .hero-wordmark { --hmax:30px; }
  html[data-design="clarity"][data-tone="navy"][data-plus] .home-description { font-size:17px; }
  html[data-design="clarity"][data-tone="navy"][data-plus] .home .search-examples .browse-link { padding-left:0; box-shadow:none; }
  html[data-design="clarity"][data-tone="navy"][data-plus] .pn-slide-who { align-self:stretch; }
  html[data-design="clarity"][data-tone="navy"][data-plus] .pn-carousel-head { padding:0 0 10px; }
  html[data-design="clarity"][data-tone="navy"][data-plus] .pn-track { gap:16px; padding:16px 6px 20px; scroll-padding-inline:6px; }
  html[data-design="clarity"][data-tone="navy"][data-plus] .pn-slide { flex-basis:86%; padding:18px 18px 16px; }
  html[data-design="clarity"][data-tone="navy"][data-plus] .pn-quote { font-size:20px; }
  html[data-design="clarity"][data-tone="navy"][data-plus] .pn-slide-foot { gap:10px; }
  html[data-design="clarity"][data-tone="navy"][data-plus] .pn-slide-score { gap:3px; }
  html[data-design="clarity"][data-tone="navy"][data-plus] .discovery-filter-bar { padding-top:24px; }
  html[data-design="clarity"][data-tone="navy"][data-plus] .discovery-filters { min-width:0; max-width:100%; flex-wrap:nowrap; overflow-x:auto; scrollbar-width:none; }
  html[data-design="clarity"][data-tone="navy"][data-plus] .discovery-filters::-webkit-scrollbar { display:none; }
  html[data-design="clarity"][data-tone="navy"][data-plus] .discovery-filters button { flex:none; white-space:nowrap; }
  html[data-design="clarity"][data-tone="navy"][data-plus] .discovery-heading { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:center; column-gap:12px; }
  html[data-design="clarity"][data-tone="navy"][data-plus] .discovery-heading > div { display:contents; }
  html[data-design="clarity"][data-tone="navy"][data-plus] .discovery-heading h2 { grid-column:1 / -1; font-size:28px; }
  html[data-design="clarity"][data-tone="navy"][data-plus] .discovery-heading p { grid-column:1; }
  html[data-design="clarity"][data-tone="navy"][data-plus] .discovery-sort { grid-column:2; grid-row:2; }
  html[data-design="clarity"][data-tone="navy"][data-plus] .discovery-sort > span { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }
  html[data-design="clarity"][data-tone="navy"][data-plus] .pn-colhead { display:none; }
  html[data-design="clarity"][data-tone="navy"][data-plus] .faculty-card { grid-template-columns:72px minmax(0,1fr); column-gap:14px; padding:16px; }
  html[data-design="clarity"][data-tone="navy"][data-plus] .professor-rating { grid-row:1 / span 2; }
  html[data-design="clarity"][data-tone="navy"][data-plus] .professor-rating-value { font-size:28px; }
  html[data-design="clarity"][data-tone="navy"][data-plus] .faculty-scores { display:flex; grid-column:2; grid-row:2; flex-wrap:wrap; gap:2px 16px; margin-top:4px; }
  html[data-design="clarity"][data-tone="navy"][data-plus] .faculty-scores > div { grid-column:auto; grid-row:auto; flex-direction:row; align-items:baseline; gap:6px; padding-top:0; }
  html[data-design="clarity"][data-tone="navy"][data-plus] .faculty-scores dt { position:static; width:auto; height:auto; overflow:visible; clip:auto; white-space:normal; }
  html[data-design="clarity"][data-tone="navy"][data-plus] .faculty-scores dd { font-size:14px; }
  html[data-design="clarity"][data-tone="navy"][data-plus] .faculty-courses { grid-column:2; grid-row:3; }
  html[data-design="clarity"][data-tone="navy"][data-plus] .faculty-card-foot { grid-column:1; grid-row:3 / span 2; align-self:start; justify-content:flex-start; padding-top:4px; font-size:11px; line-height:1.35; }
  html[data-design="clarity"][data-tone="navy"][data-plus] .result-row { grid-template-columns:72px minmax(0,1fr); }
  html[data-design="clarity"][data-tone="navy"][data-plus] .profile-score strong { font-size:72px; }
  html[data-design="clarity"][data-tone="navy"][data-plus] footer { margin-top:40px; }
}

/* Whole sticky note opens the professor's reviews: the name link is stretched over the note */
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-slide-link::after { content:""; position:absolute; inset:0; z-index:1; border-radius:3px; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-slide-link:focus-visible { outline:none; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-slide:has(.pn-slide-link:focus-visible) { outline:2px solid var(--n-gold); outline-offset:3px; transform:rotate(0deg) translateY(-3px); }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-slide:hover .pn-slide-link { text-decoration:underline; text-decoration-color:var(--n-gold); text-underline-offset:3px; }
/* The review you came for flashes gold once on the professor page */
html[data-design="clarity"][data-tone="navy"][data-plus] .review-entry.pn-highlight { animation:pn-flash 1.8s ease-out; outline:none; }
@keyframes pn-flash { 0%, 35% { box-shadow:0 0 0 3px var(--n-gold), 0 8px 24px -12px rgba(23,46,80,.35); } 100% { box-shadow:0 0 0 1px var(--n-line); } }
@media (prefers-reduced-motion: reduce) {
  html[data-design="clarity"][data-tone="navy"][data-plus] .review-entry.pn-highlight { animation:none; box-shadow:0 0 0 3px var(--n-gold); }
}

/* ================= Professor page remakes ================= */
/* shared */
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-prof { margin-top:4px; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-prof-head h1 { margin:0; font-family:"Nunito",var(--display); font-weight:800; font-size:clamp(34px,4.6vw,56px); line-height:1.06; letter-spacing:-.02em; color:var(--n-navy); overflow-wrap:anywhere; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-prof-sub { display:flex; flex-wrap:wrap; align-items:center; margin:10px 0 0; font-size:15px; color:var(--muted); }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-prof-sub .official-link { margin:0; padding:0; min-height:0; font-size:15px; color:var(--n-navy); text-decoration-color:var(--n-gold); text-underline-offset:4px; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-dot-sep { margin:0 10px; color:#B9B1A0; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-chips { display:flex; flex-wrap:wrap; gap:8px; margin:18px 0 0; padding:0; list-style:none; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-chips li { display:inline-flex; align-items:baseline; gap:8px; padding:6px 12px; border-radius:999px; background:#FFFFFF; box-shadow:0 0 0 1px var(--n-line); font-size:13px; font-weight:600; color:var(--n-navy); }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-chips small { font-size:11px; font-weight:500; color:var(--muted); }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-pearls--diff i.on { background:var(--n-navy); }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-pearls--diff i.half { background:linear-gradient(90deg, var(--n-navy) 50%, transparent 50%); box-shadow:inset 0 0 0 1px var(--n-navy); }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-meter { display:block; width:100%; max-width:120px; height:7px; margin-top:10px; border-radius:4px; background:#EFE9DC; overflow:hidden; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-meter i { display:block; height:100%; border-radius:4px; background:var(--n-gold); }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-prof .profile-score strong { font-family:"Nunito",var(--display); font-weight:800; letter-spacing:-.03em; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-prof .score-label { font-size:11px; letter-spacing:.1em; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-prof .score-count { color:var(--n-navy); text-decoration-color:var(--n-gold); }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-prof .profile-secondary dd { font-family:"Nunito",var(--display); font-weight:800; color:var(--n-navy); }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-prof .review-heading .section-heading { font-family:"Nunito",var(--display); font-weight:800; font-size:28px; letter-spacing:-.01em; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-prof .review-score { font-family:"Nunito",var(--display); font-weight:800; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-prof .review-course { font-family:"Nunito",var(--display); font-weight:800; letter-spacing:-.005em; }

/* ---------- A: Notes ---------- */
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-prof--notes { display:grid; grid-template-columns:minmax(0,1fr) 320px; grid-template-rows:auto 1fr; grid-template-areas:"head side" "reviews side"; gap:24px 48px; align-items:start; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-prof--notes .pn-prof-head { grid-area:head; padding-top:4px; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-prof--notes .pn-prof-side { grid-area:side; position:sticky; top:84px; display:grid; gap:16px; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-scorecard { display:grid; gap:18px; padding:22px 22px 20px; border-radius:20px; background:#FFFFFF; box-shadow:0 0 0 1px var(--n-line), 0 12px 30px -20px rgba(23,46,80,.35); }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-scorecard .profile-score strong { font-size:64px; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-scorecard .profile-score .pn-pearls { margin:8px 0 6px; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-scorecard .profile-secondary { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; margin:0; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-scorecard .profile-secondary > div,
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-scorecard .profile-secondary > div + div { padding:12px 14px; border:0; border-radius:14px; background:var(--n-ivory); box-shadow:none; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-scorecard .profile-secondary dd { font-size:26px; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-scorecard .profile-secondary .pn-pearls { margin-top:10px; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-scorecard .primary-button { width:100%; min-height:48px; border-radius:999px; justify-content:center; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-prof--notes .distribution-panel { padding:18px 22px; border:0; border-radius:20px; background:#FFFFFF; box-shadow:0 0 0 1px var(--n-line); }

/* ---------- B: Report card ---------- */
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-prof--report { display:grid; gap:24px; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-prof--report .pn-prof-head { display:flex; flex-wrap:wrap; align-items:flex-end; justify-content:space-between; gap:20px 32px; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-prof--report .pn-prof-title { flex:1 1 420px; min-width:0; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-prof--report .pn-prof-head > .primary-button { flex:none; min-height:48px; padding:0 26px; border-radius:999px; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-strip { display:grid; grid-template-columns:minmax(0,1.1fr) minmax(0,1fr) minmax(0,1fr) minmax(0,1.5fr); align-items:stretch; border-radius:20px; background:#FFFFFF; box-shadow:0 0 0 1px var(--n-line); }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-strip > .profile-secondary { display:contents; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-strip > .profile-score,
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-strip .profile-secondary > div,
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-strip .profile-secondary > div + div,
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-strip > .distribution-panel { min-width:0; margin:0; padding:20px 24px; border:0; border-radius:0; background:none; box-shadow:inset 1px 0 0 var(--n-line); }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-strip > .profile-score { box-shadow:none; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-strip .profile-score strong { font-size:56px; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-strip .profile-score .pn-pearls { margin:8px 0 6px; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-strip .profile-secondary dt { font-size:12px; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-strip .profile-secondary dd { margin-top:8px; font-size:34px; line-height:1.1; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-strip .profile-secondary .pn-pearls { margin-top:12px; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-strip .distribution-panel .panel-heading h2 { font-size:13px; font-weight:700; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-strip .rating-distribution { gap:6px; margin-top:10px; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-strip .rating-distribution li { grid-template-columns:44px minmax(0,1fr) 16px; gap:8px; font-size:11px; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-strip .distribution-track { height:6px; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-prof--report .reviews-section { display:grid; gap:12px; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-prof--report .review-heading .section-heading { margin-bottom:0; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-prof--report .review-entry { display:grid; grid-template-columns:150px auto minmax(0,1fr); grid-template-areas:"scores course course" "scores term again" "scores comment comment" "scores foot foot"; align-items:start; gap:6px 10px; margin:0; padding:20px 24px; border:0; border-radius:16px; background:#FFFFFF; box-shadow:0 0 0 1px var(--n-line); }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-prof--report .review-scores { grid-area:scores; flex-direction:column; align-items:flex-start; gap:6px; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-prof--report .review-score { font-size:30px; line-height:1; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-prof--report .review-scores .difficulty { font-size:12px; color:var(--muted); }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-prof--report .review-course { grid-area:course; margin:0; font-size:18px; color:var(--n-navy); }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-prof--report .review-term,
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-prof--report .review-again { margin:0; padding:3px 9px; border-radius:999px; background:var(--n-ivory); font-size:11px; color:var(--n-navy); white-space:nowrap; justify-self:start; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-prof--report .review-term { grid-area:term; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-prof--report .review-again { grid-area:again; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-prof--report .review-comment { grid-area:comment; margin:8px 0 0; font-family:var(--display); font-size:16px; line-height:1.65; color:#1E2A3C; max-width:72ch; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-prof--report .review-foot { grid-area:foot; margin:0; text-align:right; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-prof--report .report-button { min-height:32px; padding:0; font-size:12px; color:var(--muted); }

/* ---------- narrower screens ---------- */
@media (max-width:960px) {
  html[data-design="clarity"][data-tone="navy"][data-plus] .pn-prof--notes { grid-template-columns:minmax(0,1fr) 280px; gap:24px 28px; }
  html[data-design="clarity"][data-tone="navy"][data-plus] .pn-strip { grid-template-columns:repeat(3,minmax(0,1fr)); }
  html[data-design="clarity"][data-tone="navy"][data-plus] .pn-strip > .distribution-panel { grid-column:1 / -1; box-shadow:inset 0 1px 0 var(--n-line); }
}
@media (max-width:740px) {
  html[data-design="clarity"][data-tone="navy"][data-plus] .pn-prof--notes { grid-template-columns:minmax(0,1fr); grid-template-areas:"head" "side" "reviews"; }
  html[data-design="clarity"][data-tone="navy"][data-plus] .pn-prof--notes .pn-prof-side { position:static; }
  html[data-design="clarity"][data-tone="navy"][data-plus] .pn-strip { grid-template-columns:repeat(2,minmax(0,1fr)); }
  html[data-design="clarity"][data-tone="navy"][data-plus] .pn-strip > .profile-score { grid-column:1 / -1; box-shadow:none; }
  html[data-design="clarity"][data-tone="navy"][data-plus] .pn-strip .profile-secondary > div { box-shadow:inset 0 1px 0 var(--n-line); }
  html[data-design="clarity"][data-tone="navy"][data-plus] .pn-strip .profile-secondary > div + div { box-shadow:inset 1px 0 0 var(--n-line), inset 0 1px 0 var(--n-line); }
  html[data-design="clarity"][data-tone="navy"][data-plus] .pn-prof--report .review-entry { grid-template-columns:auto minmax(0,1fr); grid-template-areas:"scores scores" "course course" "term again" "comment comment" "foot foot"; padding:18px; }
  html[data-design="clarity"][data-tone="navy"][data-plus] .pn-prof--report .review-scores { flex-direction:row; align-items:center; }
  html[data-design="clarity"][data-tone="navy"][data-plus] .pn-prof--report .pn-prof-head > .primary-button { width:100%; }
}

/* ===== Key stats first (Rate My Professors style): Would take again + Difficulty are big; breakdown is secondary ===== */
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-prof .profile-secondary > div { display:flex; flex-direction:column; align-items:flex-start; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-prof .profile-secondary > div:first-child { order:2; }   /* Difficulty after Would take again */
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-prof .profile-secondary > div:last-child { order:1; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-prof .profile-secondary dd { order:0; margin:0; font-family:"Nunito",var(--display); font-weight:800; line-height:1; color:var(--n-navy); letter-spacing:-.02em; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-prof .profile-secondary dt { order:1; margin-top:8px; font-size:13px; font-weight:600; color:var(--n-navy); }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-prof .profile-secondary dt span { font-weight:500; color:var(--muted); }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-prof .profile-secondary .pn-pearls,
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-prof .profile-secondary .pn-meter { order:2; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-prof .pn-pearls--diff i { width:9px; height:9px; }

/* Notes: big pair under the overall score */
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-scorecard .profile-secondary { gap:10px; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-scorecard .profile-secondary > div,
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-scorecard .profile-secondary > div + div { padding:16px 16px 14px; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-scorecard .profile-secondary dd { font-size:40px; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-prof--notes .distribution-panel { padding:14px 18px; box-shadow:0 0 0 1px var(--n-line); opacity:.85; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-prof--notes .distribution-panel .panel-heading h2 { font-size:13px; font-weight:700; color:var(--muted); }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-prof--notes .rating-distribution { gap:5px; margin-top:8px; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-prof--notes .rating-distribution li { font-size:11px; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-prof--notes .distribution-track { height:5px; }

/* Report card: Overall | Would take again | Difficulty big; breakdown narrow and quiet */
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-strip { grid-template-columns:minmax(0,1fr) minmax(0,1fr) minmax(0,1fr) minmax(0,.9fr); }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-strip .profile-secondary dd { margin-top:22px; font-size:56px; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-strip > .profile-score { order:0; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-strip .profile-secondary > div:last-child { order:1; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-strip .profile-secondary > div:first-child { order:2; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-strip > .distribution-panel { order:3; padding:16px 18px; opacity:.85; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-strip .distribution-panel .panel-heading h2 { color:var(--muted); font-size:12px; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-strip .rating-distribution { gap:4px; margin-top:8px; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-strip .rating-distribution li { grid-template-columns:38px minmax(0,1fr) 14px; font-size:10px; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-strip .distribution-track { height:4px; }
@media (max-width:960px) {
  html[data-design="clarity"][data-tone="navy"][data-plus] .pn-strip { grid-template-columns:repeat(3,minmax(0,1fr)); }
}
@media (max-width:740px) {
  html[data-design="clarity"][data-tone="navy"][data-plus] .pn-strip { grid-template-columns:repeat(2,minmax(0,1fr)); }
  html[data-design="clarity"][data-tone="navy"][data-plus] .pn-strip .profile-secondary dd { margin-top:0; font-size:44px; }
  html[data-design="clarity"][data-tone="navy"][data-plus] .pn-strip .profile-secondary > div:last-child { box-shadow:inset 0 1px 0 var(--n-line); }
  html[data-design="clarity"][data-tone="navy"][data-plus] .pn-strip .profile-secondary > div:first-child { box-shadow:inset 1px 0 0 var(--n-line), inset 0 1px 0 var(--n-line); }
}

/* Main site (index.html): no preview switcher, so the footer needs no extra room for it */
html[data-main][data-design="clarity"][data-tone="navy"][data-plus] footer { padding-bottom:28px; }

/* ---------- Professor page reviews: clean cards with Overall / Difficulty grade boxes ---------- */
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-prof--notes .reviews-section { grid-area:reviews; display:grid; gap:14px; min-width:0; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-prof--notes .review-heading .section-heading { margin-bottom:0; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-prof--notes .review-entry { display:grid; grid-template-columns:92px minmax(0,1fr) auto; grid-template-areas:"grades course term" "grades comment comment" "grades again foot"; align-items:start; gap:8px 22px; margin:0; padding:22px 24px 16px; border:0; border-radius:16px; background:#FFFFFF; box-shadow:0 0 0 1px var(--n-line); }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-prof--notes .review-scores { display:none; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-rv-grades { grid-area:grades; display:grid; gap:8px; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-grade { display:grid; justify-items:center; gap:2px; padding:10px 6px 9px; border-radius:12px; text-align:center; background:var(--n-ivory); color:var(--n-navy); }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-grade-label { font-size:10px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; opacity:.8; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-grade-value { font-family:"Nunito",var(--display); font-size:28px; font-weight:800; line-height:1.05; font-variant-numeric:lining-nums tabular-nums; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-prof--notes .review-course { grid-area:course; margin:2px 0 0; font-size:18px; color:var(--n-navy); }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-prof--notes .review-term { grid-area:term; justify-self:end; margin:2px 0 0; font-size:13px; color:var(--muted); white-space:nowrap; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-prof--notes .review-comment { grid-area:comment; max-width:72ch; margin:4px 0 0; font-family:var(--display); font-size:16px; line-height:1.65; color:#1E2A3C; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-prof--notes .review-again { grid-area:again; justify-self:start; margin:6px 0 0; padding:4px 10px; border-radius:999px; background:var(--n-ivory); font-size:12px; color:var(--n-navy); }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-prof--notes .review-foot { grid-area:foot; margin:4px 0 0; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-prof--notes .report-button { min-height:32px; padding:0; font-size:12px; color:var(--muted); }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-prof--notes .review-empty { padding:28px; border:1px dashed #CFC6B3; border-radius:16px; background:#FFFFFF; box-shadow:none; text-align:center; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-prof--notes .review-empty p { margin-inline:auto; }
@media (max-width:740px) {
  html[data-design="clarity"][data-tone="navy"][data-plus] .pn-prof--notes .review-entry { grid-template-columns:minmax(0,1fr) auto; grid-template-areas:"grades grades" "course term" "comment comment" "again foot"; padding:18px; gap:8px 12px; }
  html[data-design="clarity"][data-tone="navy"][data-plus] .pn-rv-grades { grid-template-columns:repeat(2,minmax(0,1fr)); }
  html[data-design="clarity"][data-tone="navy"][data-plus] .pn-grade { grid-template-columns:auto auto; justify-content:center; align-items:baseline; gap:10px; padding:8px 10px; }
  html[data-design="clarity"][data-tone="navy"][data-plus] .pn-grade-value { font-size:22px; }
}

/* Review grade boxes: a subtle shade step per half point */
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-grade--overall[data-level="1"] { background:#666278; color:#FFFFFF; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-grade--overall[data-level="2"] { background:#5C5E77; color:#FFFFFF; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-grade--overall[data-level="3"] { background:#525A76; color:#FFFFFF; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-grade--overall[data-level="4"] { background:#485573; color:#FFFFFF; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-grade--overall[data-level="5"] { background:#3E5070; color:#FFFFFF; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-grade--overall[data-level="6"] { background:#354A6B; color:#FFFFFF; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-grade--overall[data-level="7"] { background:#2C4365; color:#FFFFFF; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-grade--overall[data-level="8"] { background:#243C5E; color:#FFFFFF; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-grade--overall[data-level="9"] { background:#1D3557; color:#FFFFFF; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-grade--overall[data-level="10"] { background:#172E50; color:#FFFFFF; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-grade--difficulty[data-level="1"] { background:#EEF2F4; color:var(--n-navy); }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-grade--difficulty[data-level="2"] { background:#F0F2F1; color:var(--n-navy); }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-grade--difficulty[data-level="3"] { background:#F2F2EE; color:var(--n-navy); }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-grade--difficulty[data-level="4"] { background:#F4F2EA; color:var(--n-navy); }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-grade--difficulty[data-level="5"] { background:#F6F1E6; color:var(--n-navy); }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-grade--difficulty[data-level="6"] { background:#F7EFE1; color:var(--n-navy); }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-grade--difficulty[data-level="7"] { background:#F7ECDC; color:var(--n-navy); }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-grade--difficulty[data-level="8"] { background:#F7E8D6; color:var(--n-navy); }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-grade--difficulty[data-level="9"] { background:#F6E4D1; color:var(--n-navy); }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-grade--difficulty[data-level="10"] { background:#F5DFCB; color:var(--n-navy); }

/* ---------- Review form: click-or-drag ratings ---------- */
/* The app's radio buttons stay in the form for saving; they are visually hidden here. */
html[data-design="clarity"][data-tone="navy"][data-plus] #review-form .rating-row { position:absolute; width:1px; height:1px; margin:0; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }
html[data-design="clarity"][data-tone="navy"][data-plus] #review-form .field-hint { display:none; }
html[data-design="clarity"][data-tone="navy"][data-plus] #review-form .pn-rate-legend { display:flex; align-items:baseline; gap:0 4px; width:100%; padding:0; }

html[data-design="clarity"][data-tone="navy"][data-plus] .pn-rate { display:grid; gap:6px; margin-top:10px; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-rate-track { display:flex; gap:6px; width:100%; border-radius:12px; cursor:pointer; touch-action:pan-y; user-select:none; -webkit-user-select:none; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-rate-track:focus-visible { outline:2px solid var(--n-gold); outline-offset:3px; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-rate-unit { position:relative; flex:1 1 0; min-width:0; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-rate-fill { position:absolute; inset:0 auto 0 0; width:0; transition:width 120ms ease-out, opacity 120ms ease-out; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-rate.is-dragging .pn-rate-fill { transition:none; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-rate.is-preview .pn-rate-fill { opacity:.5; }
@media (prefers-reduced-motion: reduce) { html[data-design="clarity"][data-tone="navy"][data-plus] .pn-rate-fill { transition:none; } }

/* Overall: a pearl centred in each of five equal cells */
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-rate--overall .pn-rate-unit { display:grid; place-items:center; height:52px; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-rate-pearl { position:relative; width:44px; height:44px; border-radius:50%; overflow:hidden; background:#F3EFE6; box-shadow:inset 0 0 0 1.5px #D9D0BD; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-rate--overall .pn-rate-fill { background:var(--n-gold); }

/* Difficulty: a full-width five-segment pill */
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-rate--difficulty .pn-rate-track { gap:4px; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-rate--difficulty .pn-rate-caps { column-gap:4px; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-rate--difficulty .pn-rate-unit { height:40px; border-radius:6px; background:#EFEAE0; overflow:hidden; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-rate--difficulty .pn-rate-unit:first-child { border-radius:999px 6px 6px 999px; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-rate--difficulty .pn-rate-unit:last-child { border-radius:6px 999px 999px 6px; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-rate--difficulty .pn-rate-fill { background:var(--n-navy); }

/* Readout on the label line, right-aligned */
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-rate-readout { margin-left:auto; display:flex; align-items:baseline; gap:6px; line-height:1.2; font-weight:400; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-rate-readout strong { font-family:"Nunito",var(--display); font-size:20px; font-weight:800; color:var(--n-navy); font-variant-numeric:tabular-nums; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-rate-readout .pn-rate-of { font-size:12px; color:var(--muted); }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-rate-readout .pn-rate-dot { color:#B9B1A0; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-rate-readout em { font-style:normal; font-size:13px; font-weight:600; color:var(--n-navy); }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-rate-readout.is-empty strong,
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-rate-readout.is-empty .pn-rate-of,
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-rate-readout.is-empty .pn-rate-dot { display:none; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-rate-readout.is-empty em { font-size:12px; font-weight:500; color:var(--muted); }

/* End labels: under the first and last pearl / at the bar ends */
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-rate-caps { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); column-gap:6px; font-size:11px; font-weight:500; color:var(--muted); }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-rate--overall .pn-rate-caps span:first-child { grid-column:1; justify-self:center; text-align:center; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-rate--overall .pn-rate-caps span:last-child { grid-column:5; justify-self:center; text-align:center; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-rate--difficulty .pn-rate-caps span:first-child { grid-column:1 / 3; justify-self:start; padding-left:4px; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-rate--difficulty .pn-rate-caps span:last-child { grid-column:4 / 6; justify-self:end; padding-right:4px; }

html[data-design="clarity"][data-tone="navy"][data-plus] .pn-rate-msg { margin:2px 0 0; font-size:12px; font-weight:600; color:#9A2F22; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-rate.is-invalid .pn-rate-track { box-shadow:0 0 0 2px #C9574A; }

@media (max-width:520px) {
  html[data-design="clarity"][data-tone="navy"][data-plus] .pn-rate--overall .pn-rate-unit { height:46px; }
  html[data-design="clarity"][data-tone="navy"][data-plus] .pn-rate-pearl { width:38px; height:38px; }
  html[data-design="clarity"][data-tone="navy"][data-plus] .pn-rate--difficulty .pn-rate-unit { height:36px; }
}

/* Header: the "Search" link only returned to the home page (the logo does the same), so it is hidden */
html[data-design="clarity"][data-tone="navy"][data-plus] .header-actions > .text-button[data-home] { display:none; }

/* ---------- Sign-in dialog ---------- */
html[data-design="clarity"][data-tone="navy"][data-plus] #signin-form label { display:grid; gap:6px; margin:16px 0 4px; font-size:13px; font-weight:600; color:var(--n-navy); }
html[data-design="clarity"][data-tone="navy"][data-plus] #signin-email, html[data-design="clarity"][data-tone="navy"][data-plus] #auth-password { width:100%; box-sizing:border-box; min-height:44px; padding:10px 14px; font:inherit; font-weight:400; font-size:15px; border:1px solid var(--n-line); border-radius:12px; background:#fff; color:var(--ink); }
html[data-design="clarity"][data-tone="navy"][data-plus] #signin-email:focus-visible, html[data-design="clarity"][data-tone="navy"][data-plus] #auth-password:focus-visible { outline:2px solid var(--n-gold); outline-offset:1px; }
html[data-design="clarity"][data-tone="navy"][data-plus] #signin-form .primary-button { margin-top:8px; }
html[data-design="clarity"][data-tone="navy"][data-plus] #signin-sent-text { margin:14px 0 16px; line-height:1.6; }

/* ---------- Footer links ---------- */
html[data-design="clarity"][data-tone="navy"][data-plus] .footer-links { display:flex; flex-wrap:wrap; align-items:center; gap:4px 20px; }
html[data-design="clarity"][data-tone="navy"][data-plus] a.footer-link { text-decoration:none; padding:10px 0; }
html[data-design="clarity"][data-tone="navy"][data-plus] a.footer-link:hover { color:var(--n-gold-on-navy); text-decoration:underline; text-underline-offset:4px; }

/* ---------- Review actions: report / your review ---------- */
html[data-design="clarity"][data-tone="navy"][data-plus] .review-foot { display:flex; justify-content:flex-end; align-items:center; gap:12px; }
html[data-design="clarity"][data-tone="navy"][data-plus] .report-button[disabled] { cursor:default; opacity:.7; }
html[data-design="clarity"][data-tone="navy"][data-plus] .review-mine { margin-right:auto; padding:3px 9px; border-radius:999px; background:#F6EEDB; color:#7A5A12; font-size:11px; font-weight:600; }
html[data-design="clarity"][data-tone="navy"][data-plus] [data-delete-review]:hover { color:#9A2F22; }

/* ---------- Report / delete dialogs ---------- */
html[data-design="clarity"][data-tone="navy"][data-plus] #report-intro, html[data-design="clarity"][data-tone="navy"][data-plus] #delete-text { margin:14px 0 4px; line-height:1.6; }
html[data-design="clarity"][data-tone="navy"][data-plus] .report-reasons { display:grid; gap:6px; margin:12px 0 0; padding:0; border:0; }
html[data-design="clarity"][data-tone="navy"][data-plus] .report-legend { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); }
html[data-design="clarity"][data-tone="navy"][data-plus] .report-reason { display:flex; align-items:center; gap:10px; min-height:42px; padding:8px 14px; border:1px solid var(--n-line); border-radius:12px; background:#fff; font-size:14px; font-weight:500; color:var(--ink); cursor:pointer; }
html[data-design="clarity"][data-tone="navy"][data-plus] .report-reason:has(input:checked) { border-color:var(--n-navy); box-shadow:inset 0 0 0 1px var(--n-navy); background:#F7F5EF; }
html[data-design="clarity"][data-tone="navy"][data-plus] .report-reason input { accent-color:var(--n-navy); margin:0; }
html[data-design="clarity"][data-tone="navy"][data-plus] .report-details { display:block; margin:14px 0 0; font-size:13px; font-weight:600; color:var(--n-navy); }
html[data-design="clarity"][data-tone="navy"][data-plus] .report-details textarea { min-height:84px; font-weight:400; }
html[data-design="clarity"][data-tone="navy"][data-plus] #report-form .primary-button { margin-top:6px; }
html[data-design="clarity"][data-tone="navy"][data-plus] .dialog-actions { display:flex; justify-content:flex-end; align-items:center; gap:16px; margin-top:20px; }
html[data-design="clarity"][data-tone="navy"][data-plus] .dialog-actions .secondary-button { margin:0; color:var(--n-navy); font-size:14px; }
html[data-design="clarity"][data-tone="navy"][data-plus] .danger-button { background:#9A2F22 !important; border-color:#9A2F22 !important; }

/* ---------- Agreement lines ---------- */
html[data-design="clarity"][data-tone="navy"][data-plus] .review-agree { display:flex; align-items:flex-start; gap:10px; margin:18px 0 4px; font-size:13px; font-weight:500; line-height:1.5; color:var(--ink); cursor:pointer; }
html[data-design="clarity"][data-tone="navy"][data-plus] .review-agree input { flex:none; width:18px; height:18px; margin:1px 0 0; accent-color:var(--n-navy); }
html[data-design="clarity"][data-tone="navy"][data-plus] .review-agree a, html[data-design="clarity"][data-tone="navy"][data-plus] .dialog-fineprint a { color:var(--n-navy); text-decoration:underline; text-underline-offset:3px; }
html[data-design="clarity"][data-tone="navy"][data-plus] .dialog-fineprint { margin:12px 0 0; font-size:12px; line-height:1.6; color:var(--muted); text-align:center; }

/* ---------- Terms & Privacy pages ---------- */
html[data-design="clarity"][data-tone="navy"][data-plus] .legal-page { max-width:720px; margin:40px auto 0; padding:0 4px; }
html[data-design="clarity"][data-tone="navy"][data-plus] .legal-updated { margin:0 0 8px; font-size:12px; font-weight:600; letter-spacing:.04em; color:var(--muted); }
html[data-design="clarity"][data-tone="navy"][data-plus] .legal-page h1 { margin:0 0 12px; font-family:"Nunito",var(--display); font-size:34px; font-weight:800; color:var(--n-navy); }
html[data-design="clarity"][data-tone="navy"][data-plus] .legal-intro { margin:0 0 28px; font-size:16px; line-height:1.7; color:var(--ink); }
html[data-design="clarity"][data-tone="navy"][data-plus] .legal-page section { padding:18px 0; box-shadow:inset 0 1px 0 var(--n-line); }
html[data-design="clarity"][data-tone="navy"][data-plus] .legal-page h2 { margin:0 0 8px; font-size:16px; font-weight:700; color:var(--n-navy); }
html[data-design="clarity"][data-tone="navy"][data-plus] .legal-page section p { margin:0 0 8px; font-size:14px; line-height:1.8; color:var(--ink); }
html[data-design="clarity"][data-tone="navy"][data-plus] .legal-page a { color:var(--n-navy); text-underline-offset:3px; }
html[data-design="clarity"][data-tone="navy"][data-plus] .legal-todo { color:#9A2F22; font-weight:600; }
html[data-design="clarity"][data-tone="navy"][data-plus] .legal-switch { margin:16px 0 0; font-weight:600; }
@media (max-width:520px) { html[data-design="clarity"][data-tone="navy"][data-plus] .legal-page { margin-top:24px; } html[data-design="clarity"][data-tone="navy"][data-plus] .legal-page h1 { font-size:28px; } }

/* ---------- Search box: one rounded focus ring around the whole bar, none on the inner input ---------- */
html[data-design="clarity"][data-tone="navy"][data-plus] .search-form .search-box:focus, html[data-design="clarity"][data-tone="navy"][data-plus] .search-form .search-box:focus-visible { outline:none; box-shadow:none; }
html[data-design="clarity"][data-tone="navy"][data-plus] .search-form:focus-within { outline:2px solid var(--n-gold); outline-offset:2px; }

/* ---------- Directory filters: toggles + sort switch ---------- */
html[data-design="clarity"][data-tone="navy"][data-plus] .dir-filters { display:flex; flex-wrap:wrap; align-items:center; gap:8px 12px; margin:18px 0 0; }
html[data-design="clarity"][data-tone="navy"][data-plus] .dir-divider { width:1px; height:20px; background:var(--n-line); }
html[data-design="clarity"][data-tone="navy"][data-plus] .dir-group { display:flex; flex-wrap:wrap; align-items:center; gap:6px; }
html[data-design="clarity"][data-tone="navy"][data-plus] .dir-group-label { margin-right:2px; font-size:12px; font-weight:600; color:var(--muted); }
html[data-design="clarity"][data-tone="navy"][data-plus] .dir-toggle { display:inline-flex; align-items:center; gap:7px; min-height:34px; padding:0 13px; border:1px solid var(--n-line); border-radius:999px; background:#fff; color:var(--n-navy); font-size:13px; font-weight:600; cursor:pointer; transition:background-color 120ms, border-color 120ms, color 120ms; }
html[data-design="clarity"][data-tone="navy"][data-plus] .dir-toggle:hover:not(:disabled) { border-color:var(--n-navy); }
html[data-design="clarity"][data-tone="navy"][data-plus] .dir-toggle[aria-pressed="true"] { background:var(--n-navy); border-color:var(--n-navy); color:#fff; }
html[data-design="clarity"][data-tone="navy"][data-plus] .dir-toggle:disabled { opacity:.4; cursor:not-allowed; }
html[data-design="clarity"][data-tone="navy"][data-plus] .dir-count { font-size:11px; font-weight:500; color:var(--muted); font-variant-numeric:tabular-nums; }
html[data-design="clarity"][data-tone="navy"][data-plus] .dir-off { font-size:15px; line-height:1; font-weight:500; color:rgba(255,255,255,.75); }
html[data-design="clarity"][data-tone="navy"][data-plus] .dir-clear { border:0; background:none; padding:6px 2px; font-size:13px; font-weight:600; color:var(--n-navy); text-decoration:underline; text-underline-offset:3px; cursor:pointer; }
html[data-design="clarity"][data-tone="navy"][data-plus] .dir-results-bar { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:10px 16px; margin:26px 0 8px; }
html[data-design="clarity"][data-tone="navy"][data-plus] .dir-results-bar .results-heading { margin:0; }
html[data-design="clarity"][data-tone="navy"][data-plus] .dir-sort { display:flex; gap:2px; padding:3px; border-radius:999px; background:#EFEAE0; max-width:100%; overflow-x:auto; scrollbar-width:none; }
html[data-design="clarity"][data-tone="navy"][data-plus] .dir-sort button { flex:none; min-height:30px; padding:0 13px; border:0; border-radius:999px; background:transparent; color:var(--muted); font-size:13px; font-weight:600; white-space:nowrap; cursor:pointer; }
html[data-design="clarity"][data-tone="navy"][data-plus] .dir-sort button:hover { color:var(--n-navy); }
html[data-design="clarity"][data-tone="navy"][data-plus] .dir-sort button[aria-pressed="true"] { background:#fff; color:var(--n-navy); box-shadow:0 1px 2px rgba(23,46,80,.12); }
html[data-design="clarity"][data-tone="navy"][data-plus] .dir-empty { display:grid; justify-items:start; gap:4px; padding:28px 0; }
html[data-design="clarity"][data-tone="navy"][data-plus] .dir-empty .secondary-button { margin:0; color:var(--n-navy); font-weight:600; }
@media (prefers-reduced-motion: reduce) { html[data-design="clarity"][data-tone="navy"][data-plus] .dir-toggle { transition:none; } }
@media (max-width:640px) { html[data-design="clarity"][data-tone="navy"][data-plus] .dir-filters { gap:10px 16px; } html[data-design="clarity"][data-tone="navy"][data-plus] .dir-results-bar { margin-top:20px; } }

/* ---------- Phone header: keep everything on one line (Write a review becomes a pencil button) ---------- */
html[data-design="clarity"][data-tone="navy"][data-plus] .header-actions { flex-wrap:nowrap; }
@media (max-width:480px) {
  html[data-design="clarity"][data-tone="navy"][data-plus] .header-actions { gap:12px; }
  html[data-design="clarity"][data-tone="navy"][data-plus] #header-review { display:inline-flex; align-items:center; justify-content:center; width:36px; height:36px; min-height:36px; padding:0; }
  html[data-design="clarity"][data-tone="navy"][data-plus] #header-review > span[aria-hidden="true"] { display:inline-flex; }
  html[data-design="clarity"][data-tone="navy"][data-plus] #header-review svg { display:block; width:18px; height:18px; }
  html[data-design="clarity"][data-tone="navy"][data-plus] #header-review .review-action-label { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }
}

/* ---------- Search suggestions: score and scale on one line ---------- */
html[data-design="clarity"][data-tone="navy"][data-plus] .catalog-option-score { display:inline-flex; align-items:baseline; gap:3px; font-family:var(--display); font-size:22px; font-weight:700; letter-spacing:-.01em; color:var(--n-navy); font-variant-numeric:tabular-nums; white-space:nowrap; }
html[data-design="clarity"][data-tone="navy"][data-plus] .catalog-option-score small { display:inline; font-family:inherit; font-size:12px; font-weight:500; letter-spacing:0; color:var(--muted); }
html[data-design="clarity"][data-tone="navy"][data-plus] .catalog-option-score.is-unrated { font-family:inherit; font-size:12px; font-weight:500; letter-spacing:0; color:var(--muted); }

/* Legal pages: links to the other two documents; guidelines popup link */
html[data-design="clarity"][data-tone="navy"][data-plus] .legal-switch { display:flex; flex-wrap:wrap; gap:8px 24px; padding-top:18px; box-shadow:inset 0 1px 0 var(--n-line); }
html[data-design="clarity"][data-tone="navy"][data-plus] .legal-page strong { color:var(--n-navy); }
html[data-design="clarity"][data-tone="navy"][data-plus] .dialog-link { font-weight:600; color:var(--n-navy); text-underline-offset:3px; }
html[data-design="clarity"][data-tone="navy"][data-plus] .legal-page section ul { margin:0 0 8px; padding-left:20px; }
html[data-design="clarity"][data-tone="navy"][data-plus] .legal-page section li { margin:0 0 6px; padding-left:4px; font-size:14px; line-height:1.8; color:var(--ink); }
html[data-design="clarity"][data-tone="navy"][data-plus] .legal-page section li::marker { color:var(--n-gold); }

/* ---------- Account popup: tabs, password field, links ---------- */
html[data-design="clarity"][data-tone="navy"][data-plus] .auth-tabs { display:grid; grid-template-columns:1fr 1fr; gap:2px; margin:16px 0 4px; padding:3px; border-radius:999px; background:#EFEAE0; }
html[data-design="clarity"][data-tone="navy"][data-plus] .auth-tabs[hidden] { display:none; }
html[data-design="clarity"][data-tone="navy"][data-plus] .auth-tabs button { min-height:36px; border:0; border-radius:999px; background:transparent; color:var(--muted); font:inherit; font-size:14px; font-weight:600; cursor:pointer; }
html[data-design="clarity"][data-tone="navy"][data-plus] .auth-tabs button[aria-selected="true"] { background:#fff; color:var(--n-navy); box-shadow:0 1px 2px rgba(23,46,80,.12); }
html[data-design="clarity"][data-tone="navy"][data-plus] .auth-intro { margin:14px 0 0; line-height:1.6; }
html[data-design="clarity"][data-tone="navy"][data-plus] #signin-form label[hidden], html[data-design="clarity"][data-tone="navy"][data-plus] .auth-intro[hidden], html[data-design="clarity"][data-tone="navy"][data-plus] .auth-forgot[hidden], html[data-design="clarity"][data-tone="navy"][data-plus] .auth-hint[hidden], html[data-design="clarity"][data-tone="navy"][data-plus] .dialog-fineprint[hidden] { display:none; }
html[data-design="clarity"][data-tone="navy"][data-plus] .auth-password { position:relative; display:block; }
html[data-design="clarity"][data-tone="navy"][data-plus] #auth-password { padding-right:68px; }
html[data-design="clarity"][data-tone="navy"][data-plus] .auth-reveal { position:absolute; top:50%; right:8px; transform:translateY(-50%); min-height:30px; padding:0 10px; border:0; border-radius:8px; background:transparent; color:var(--n-navy); font:inherit; font-size:12px; font-weight:600; cursor:pointer; }
html[data-design="clarity"][data-tone="navy"][data-plus] .auth-reveal:hover { background:#F3EFE6; }
html[data-design="clarity"][data-tone="navy"][data-plus] .auth-hint { font-size:12px; font-weight:500; color:var(--muted); }
html[data-design="clarity"][data-tone="navy"][data-plus] .auth-forgot { display:block; margin:2px 0 0 auto; padding:6px 0; border:0; background:none; color:var(--n-navy); font:inherit; font-size:13px; font-weight:600; cursor:pointer; text-decoration:underline; text-underline-offset:3px; }
html[data-design="clarity"][data-tone="navy"][data-plus] .auth-inline-action { padding:0; border:0; background:none; color:var(--n-navy); font:inherit; font-weight:700; text-decoration:underline; text-underline-offset:3px; cursor:pointer; }