/* 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; }
/* The page area (after moving between pages) and the reviews section (after "jump to reviews") are focused
   for screen readers; they need no outline. */
/* Until the first page is fully drawn (design layer applied, fonts ready) nothing shows, so the plain
   version never flashes on reload. If scripts fail, the page appears anyway after 2 seconds. */
html.pn-loading body { visibility:hidden; animation:pn-reveal 0s 2s forwards; }
@keyframes pn-reveal { to { visibility:visible; } }
html[data-design="clarity"][data-tone="navy"][data-plus] #app:focus, html[data-design="clarity"][data-tone="navy"][data-plus] #app:focus-visible, html[data-design="clarity"][data-tone="navy"][data-plus] #profile-reviews:focus, html[data-design="clarity"][data-tone="navy"][data-plus] #profile-reviews:focus-visible { outline:none; }
/* Scrolling past the top or bottom shows the page colour, not a white strip, and doesn't bounce where browsers allow it. */
html[data-design="clarity"][data-tone="navy"][data-plus] { background:#FAF8F3; overscroll-behavior-y:none; }

/* ---------- 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("/assets/navy-compass.7d22bd61b6.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("/assets/preview-logo-g-keio.f9953f1abb.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; 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)); } }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-quote { flex:0 0 auto; max-height:calc(1.35em * 4); margin:0; font-family:var(--hand); font-size:21px; line-height:1.35; color:var(--n-navy); display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:4; line-clamp:4; overflow:hidden; }
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; justify-content:space-between; gap:0 8px; width:100%; min-height:22px; padding:0; }
html[data-design="clarity"][data-tone="navy"][data-plus] #review-form .rating-pair { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:0 24px; align-items:start; }

html[data-design="clarity"][data-tone="navy"][data-plus] .pn-rate { display:grid; gap:6px; margin-top:6px; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-rate-track { display:flex; 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-fill { position:absolute; inset:0 auto 0 0; width:0; }

/* Quality: five small pearls in a row. Hover shows a light-gold preview; a choice fills them gold. No animation. */
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-rate--overall .pn-rate-track { gap:8px; width:100%; max-width:192px; height:36px; align-items:center; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-rate--overall .pn-rate-caps { max-width:192px; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-rate--overall .pn-rate-unit { position:relative; display:grid; place-items:center; flex:1 1 0; min-width:0; max-width:32px; height:100%; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-rate-pearl { position:relative; width:100%; aspect-ratio:1; 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); }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-rate--overall.is-preview .pn-rate-fill { background:#E8D3A0; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-rate--overall .pn-rate-unit:hover .pn-rate-pearl { box-shadow:inset 0 0 0 2px var(--n-gold); }

/* Difficulty: a straight line with five marks and a round dial; clicks or drags to 1–5 in half steps */
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-rate--difficulty .pn-rate-track { width:100%; height:36px; align-items:center; padding:0 11px; box-sizing:border-box; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-dial { position:relative; flex:1; height:100%; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-dial-line, html[data-design="clarity"][data-tone="navy"][data-plus] .pn-dial-fill { position:absolute; left:0; top:50%; height:4px; margin-top:-2px; border-radius:2px; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-dial-line { right:0; background:#E2DACA; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-dial-fill { width:0; background:var(--n-navy); }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-dial-ticks { position:absolute; inset:0; display:flex; justify-content:space-between; align-items:center; pointer-events:none; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-dial-ticks i { width:2px; height:12px; margin:0 -1px; border-radius:1px; background:#D2C8B4; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-rate--difficulty.is-shooting .pn-dial-fill { transition:width 340ms cubic-bezier(.2,.8,.2,1); }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-rate--difficulty.is-shooting .pn-dial-knob { transition:left 340ms cubic-bezier(.2,.8,.2,1); }
@media (prefers-reduced-motion: reduce) { html[data-design="clarity"][data-tone="navy"][data-plus] .pn-rate--difficulty.is-shooting .pn-dial-fill, html[data-design="clarity"][data-tone="navy"][data-plus] .pn-rate--difficulty.is-shooting .pn-dial-knob { transition:none; } }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-dial-knob { position:absolute; left:0; top:50%; width:22px; height:22px; margin:-11px 0 0 -11px; border-radius:50%; background:var(--n-navy); box-shadow:0 0 0 3px var(--n-ivory), 0 1px 4px #18264F40; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-rate--difficulty.is-empty .pn-dial-knob { visibility:hidden; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-rate--difficulty.is-preview .pn-dial-knob { visibility:visible; background:#9AA3BA; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-rate--difficulty.is-preview .pn-dial-fill { background:#9AA3BA; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-rate--difficulty .pn-rate-track:hover .pn-dial-knob, html[data-design="clarity"][data-tone="navy"][data-plus] .pn-rate--difficulty.is-dragging .pn-dial-knob { box-shadow:0 0 0 3px var(--n-ivory), 0 0 0 5px #C9A24A66, 0 1px 4px #18264F40; }

/* Readout on the title line, right-aligned: "4 / 5 · Good" once chosen */
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-rate-readout { display:flex; align-items:baseline; gap:5px; line-height:1.2; font-weight:400; white-space:nowrap; }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-rate-readout strong { font-family:"Nunito",var(--display); font-size:17px; 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 at the two ends */
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-rate-caps { display:flex; justify-content:space-between; gap:12px; font-size:11px; font-weight:500; color:var(--muted); }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-rate--difficulty .pn-rate-caps { padding:0 2px; }

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-readout .pn-rate-dot, html[data-design="clarity"][data-tone="navy"][data-plus] .pn-rate-readout em { display:none; }
  html[data-design="clarity"][data-tone="navy"][data-plus] #review-form .rating-pair { grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:0 12px; }
  html[data-design="clarity"][data-tone="navy"][data-plus] .pn-rate--overall .pn-rate-track { gap:5px; }
}

/* The popup keeps its rounded corners on all sides: the form scrolls inside it, not the popup itself */
html[data-design="clarity"][data-tone="navy"][data-plus] .modal { overflow:hidden; }
html[data-design="clarity"][data-tone="navy"][data-plus] .modal > form { max-height:calc(100dvh - 32px); overflow-y:auto; overscroll-behavior:contain; scrollbar-width:thin; }

/* "Your review" and its hint on one line */
html[data-design="clarity"][data-tone="navy"][data-plus] #review-form .field-label-row { display:flex; align-items:baseline; flex-wrap:wrap; gap:2px 10px; }
html[data-design="clarity"][data-tone="navy"][data-plus] #review-form .field-label-row .comment-help { display:inline; margin:0; }
html[data-design="clarity"][data-tone="navy"][data-plus] #review-form #comment { min-height:124px; resize:none; overflow:hidden; }

/* Course matches in the professor suggestions */
html[data-design="clarity"][data-tone="navy"][data-plus] .professor-suggestion .suggestion-course { font-style:normal; font-size:12px; font-weight:500; color:var(--muted); }

/* Save stays grey until the required parts are done; parts left unfinished turn red */
html[data-design="clarity"][data-tone="navy"][data-plus] #review-form .review-submit-wrap { cursor:not-allowed; }
html[data-design="clarity"][data-tone="navy"][data-plus] #review-form .review-submit-wrap:has(button:not(:disabled)) { cursor:auto; }
html[data-design="clarity"][data-tone="navy"][data-plus] #review-form button[type="submit"]:disabled { background:#D8D3C8; border-color:#D8D3C8; color:#8A8577; box-shadow:none; pointer-events:none; }
html[data-design="clarity"][data-tone="navy"][data-plus] #review-form [data-req].is-missing > span:first-child,
html[data-design="clarity"][data-tone="navy"][data-plus] #review-form [data-req].is-missing > legend,
html[data-design="clarity"][data-tone="navy"][data-plus] #review-form [data-req].is-missing > legend *,
html[data-design="clarity"][data-tone="navy"][data-plus] #review-form .review-agree.is-missing,
html[data-design="clarity"][data-tone="navy"][data-plus] #review-form .professor-field.is-missing label { color:#B3261E; }
html[data-design="clarity"][data-tone="navy"][data-plus] #review-form [data-req].is-missing select,
html[data-design="clarity"][data-tone="navy"][data-plus] #review-form .professor-field.is-missing input { border-color:#C9574A; box-shadow:0 0 0 1px #C9574A; }
html[data-design="clarity"][data-tone="navy"][data-plus] #review-form fieldset.is-missing .pn-rate-track { box-shadow:0 0 0 2px #C9574A; }
html[data-design="clarity"][data-tone="navy"][data-plus] #review-form fieldset.is-missing .choice-row label,
html[data-design="clarity"][data-tone="navy"][data-plus] #review-form fieldset.is-missing .choice-row .choice { border-color:#C9574A; }
html[data-design="clarity"][data-tone="navy"][data-plus] #review-form .review-agree.is-missing input { outline:2px solid #C9574A; outline-offset:1px; }
html[data-design="clarity"][data-tone="navy"][data-plus] #review-form .review-name-field.is-missing input { border-color:#C9574A; box-shadow:0 0 0 1px #C9574A; }

/* 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, html[data-design="clarity"][data-tone="navy"][data-plus] #auth-code { 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] #discard-dialog .dialog-actions button { flex:1 1 0; width:auto; min-height:48px; white-space:nowrap; }
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 { width:min(720px, calc(100% - 32px)); margin:40px auto 0; }
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; }

/* Password field: one Show/Hide control only (hide Edge's built-in eye and clear buttons),
   and autofilled or browser-suggested values keep the site's white field instead of yellow/blue. */
html[data-design="clarity"][data-tone="navy"][data-plus] #auth-password::-ms-reveal, html[data-design="clarity"][data-tone="navy"][data-plus] #auth-password::-ms-clear { display:none; }
html[data-design="clarity"][data-tone="navy"][data-plus] #signin-email:-webkit-autofill, html[data-design="clarity"][data-tone="navy"][data-plus] #signin-email:-webkit-autofill:hover, html[data-design="clarity"][data-tone="navy"][data-plus] #signin-email:-webkit-autofill:focus,
html[data-design="clarity"][data-tone="navy"][data-plus] #auth-password:-webkit-autofill, html[data-design="clarity"][data-tone="navy"][data-plus] #auth-password:-webkit-autofill:hover, html[data-design="clarity"][data-tone="navy"][data-plus] #auth-password:-webkit-autofill:focus {
  -webkit-box-shadow:0 0 0 1000px #fff inset; box-shadow:0 0 0 1000px #fff inset; -webkit-text-fill-color:var(--ink); caret-color:var(--ink); transition:background-color 99999s; }
html[data-design="clarity"][data-tone="navy"][data-plus] #signin-email:autofill, html[data-design="clarity"][data-tone="navy"][data-plus] #auth-password:autofill { background:#fff; }
html[data-design="clarity"][data-tone="navy"][data-plus] .auth-reveal { z-index:1; }

/* Home: "Explore professors" heading first, then the filter chips, then the list */
/* Filter chips and Sort by share one row under the heading */
html[data-design="clarity"][data-tone="navy"][data-plus] .discovery-toolbar { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:10px 16px; margin:2px 0 18px; }
html[data-design="clarity"][data-tone="navy"][data-plus] .discovery-toolbar > .discovery-filter-bar { flex:0 1 auto; min-width:0; max-width:100%; padding:0; margin:0; }
html[data-design="clarity"][data-tone="navy"][data-plus] .discovery-toolbar > .discovery-sort { flex:none; margin-left:auto; }
html[data-design="clarity"][data-tone="navy"][data-plus] .faculty-section { margin-top:12px; }

/* Professor page: filter reviews by class */
html[data-design="clarity"][data-tone="navy"][data-plus] .review-filter { display:flex; flex-wrap:wrap; gap:6px; margin:4px 0 16px; }
html[data-design="clarity"][data-tone="navy"][data-plus] .review-filter button { display:inline-flex; align-items:center; gap:7px; max-width:100%; min-height:34px; padding:0 13px; border:1px solid var(--n-line); border-radius:999px; background:#fff; color:var(--n-navy); font:inherit; font-size:13px; font-weight:600; cursor:pointer; }
html[data-design="clarity"][data-tone="navy"][data-plus] .review-filter button span { max-width:260px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
html[data-design="clarity"][data-tone="navy"][data-plus] .review-filter button small { font-size:11px; font-weight:500; color:var(--muted); font-variant-numeric:tabular-nums; }
html[data-design="clarity"][data-tone="navy"][data-plus] .review-filter button:hover { border-color:var(--n-navy); }
html[data-design="clarity"][data-tone="navy"][data-plus] .review-filter button[aria-pressed="true"] { background:var(--n-navy); border-color:var(--n-navy); color:#fff; }
html[data-design="clarity"][data-tone="navy"][data-plus] .review-filter button[aria-pressed="true"] small { color:rgba(255,255,255,.75); }
html[data-design="clarity"][data-tone="navy"][data-plus] #profile-reviews .review-entry[hidden] { display:none; }

/* Account popup notice (e.g. an email link opened in another browser) and the author's hidden-review note */
html[data-design="clarity"][data-tone="navy"][data-plus] .auth-intro.is-notice { padding:10px 12px; border-radius:10px; background:#F6EEDB; color:#5A4413; }
html[data-design="clarity"][data-tone="navy"][data-plus] .hidden-review-notice { display:flex; align-items:center; justify-content:space-between; gap:12px; margin:4px 0 14px; padding:12px 14px; border-radius:14px; background:#F6EEDB; color:#5A4413; font-size:13px; line-height:1.5; }
html[data-design="clarity"][data-tone="navy"][data-plus] .hidden-review-notice p { margin:0; }
html[data-design="clarity"][data-tone="navy"][data-plus] .hidden-review-notice .report-button { flex:none; color:#9A2F22; font-weight:600; }

/* Account popup: code entry */
html[data-design="clarity"][data-tone="navy"][data-plus] #auth-code { font-size:22px; font-weight:600; letter-spacing:.3em; font-variant-numeric:tabular-nums; text-align:center; }
html[data-design="clarity"][data-tone="navy"][data-plus] #auth-code:focus-visible { outline:2px solid var(--n-gold); outline-offset:1px; }
html[data-design="clarity"][data-tone="navy"][data-plus] .auth-links { display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; gap:4px 16px; }
html[data-design="clarity"][data-tone="navy"][data-plus] .auth-links .auth-forgot { margin:2px 0 0; }
html[data-design="clarity"][data-tone="navy"][data-plus] .auth-links .auth-forgot:last-child { margin-left:auto; }

/* ---------- My account ---------- */
html[data-design="clarity"][data-tone="navy"][data-plus] .account-page { width:min(760px, calc(100% - 32px)); margin:36px auto 0; }
html[data-design="clarity"][data-tone="navy"][data-plus] .account-page h1 { margin:0 0 16px; font-family:"Nunito",var(--display); font-size:34px; font-weight:800; color:var(--n-navy); }
html[data-design="clarity"][data-tone="navy"][data-plus] .account-loading { padding:40px 0; color:var(--muted); }
html[data-design="clarity"][data-tone="navy"][data-plus] .account-card { padding:18px 20px; border-radius:18px; background:#fff; box-shadow:0 0 0 1px var(--n-line); }
html[data-design="clarity"][data-tone="navy"][data-plus] .account-identity { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:6px 16px; }
html[data-design="clarity"][data-tone="navy"][data-plus] .account-identity strong { display:block; font-size:16px; color:var(--n-navy); overflow-wrap:anywhere; }
html[data-design="clarity"][data-tone="navy"][data-plus] .account-identity span, html[data-design="clarity"][data-tone="navy"][data-plus] .account-identity small { font-size:13px; color:var(--muted); }
html[data-design="clarity"][data-tone="navy"][data-plus] .account-section { margin-top:30px; }
html[data-design="clarity"][data-tone="navy"][data-plus] .account-section h2 { margin:0 0 12px; font-size:18px; font-weight:700; color:var(--n-navy); }
html[data-design="clarity"][data-tone="navy"][data-plus] .account-section-head { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:12px; }
html[data-design="clarity"][data-tone="navy"][data-plus] .account-section-head h2 { margin:0; }
html[data-design="clarity"][data-tone="navy"][data-plus] .account-head-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
html[data-design="clarity"][data-tone="navy"][data-plus] .account-sort { flex-direction:row; align-items:center; }
html[data-design="clarity"][data-tone="navy"][data-plus] .account-sort select { max-width:none; }
@media (max-width:520px) { html[data-design="clarity"][data-tone="navy"][data-plus] .account-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] .account-empty p { margin:0; color:var(--muted); }
html[data-design="clarity"][data-tone="navy"][data-plus] .account-review + .account-review { margin-top:10px; }
html[data-design="clarity"][data-tone="navy"][data-plus] .account-review.is-hidden { background:#FCFAF5; }
html[data-design="clarity"][data-tone="navy"][data-plus] .account-review-head { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; }
html[data-design="clarity"][data-tone="navy"][data-plus] .account-review-prof { margin:0; font-size:16px; font-weight:700; color:var(--n-navy); }
html[data-design="clarity"][data-tone="navy"][data-plus] .account-review-course { margin:2px 0 0; font-size:13px; color:var(--muted); }
html[data-design="clarity"][data-tone="navy"][data-plus] .account-status { flex:none; padding:3px 10px; border-radius:999px; font-size:11px; font-weight:700; }
html[data-design="clarity"][data-tone="navy"][data-plus] .account-status.is-public { background:#E7EFE6; color:#2F5D34; }
html[data-design="clarity"][data-tone="navy"][data-plus] .account-status.is-hidden { background:#F6EEDB; color:#7A5A12; }
html[data-design="clarity"][data-tone="navy"][data-plus] .account-review-scores { margin:10px 0 0; font-size:13px; color:var(--muted); }
html[data-design="clarity"][data-tone="navy"][data-plus] .account-review-scores strong { color:var(--n-navy); }
html[data-design="clarity"][data-tone="navy"][data-plus] .account-review-comment { margin:8px 0 0; font-size:14px; line-height:1.6; color:var(--ink); display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:3; line-clamp:3; overflow:hidden; }
html[data-design="clarity"][data-tone="navy"][data-plus] .account-hidden-note { margin:10px 0 0; padding:8px 12px; border-radius:10px; background:#F6EEDB; color:#5A4413; font-size:12px; line-height:1.5; }
html[data-design="clarity"][data-tone="navy"][data-plus] .account-review-actions { display:flex; justify-content:flex-end; align-items:center; gap:16px; margin-top:10px; }
html[data-design="clarity"][data-tone="navy"][data-plus] .account-review-actions a { font-size:13px; font-weight:600; color:var(--n-navy); text-underline-offset:3px; }
html[data-design="clarity"][data-tone="navy"][data-plus] .account-review-actions .report-button { min-height:28px; padding:0; font-size:13px; font-weight:600; color:var(--n-navy); }
html[data-design="clarity"][data-tone="navy"][data-plus] .account-review-actions [data-delete-review] { color:#9A2F22; }
html[data-design="clarity"][data-tone="navy"][data-plus] #account-password-form label { display:grid; gap:6px; font-size:13px; font-weight:600; color:var(--n-navy); }
html[data-design="clarity"][data-tone="navy"][data-plus] #account-password { width:100%; box-sizing:border-box; min-height:44px; padding:10px 68px 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] #account-password::-ms-reveal { display:none; }
html[data-design="clarity"][data-tone="navy"][data-plus] #account-password-form .primary-button { margin-top:6px; }
html[data-design="clarity"][data-tone="navy"][data-plus] .account-danger .account-card { box-shadow:0 0 0 1px #E8C9C3; }
html[data-design="clarity"][data-tone="navy"][data-plus] .account-danger p { margin:0 0 12px; font-size:14px; line-height:1.6; color:var(--ink); }
html[data-design="clarity"][data-tone="navy"][data-plus] .danger-outline { padding:10px 16px; border:1px solid #C9574A; border-radius:999px; background:#fff; color:#9A2F22; font:inherit; font-size:14px; font-weight:600; cursor:pointer; }
html[data-design="clarity"][data-tone="navy"][data-plus] .danger-outline:hover { background:#FBEFED; }
html[data-design="clarity"][data-tone="navy"][data-plus] .account-confirm { display:grid; gap:6px; margin:14px 0 0; font-size:13px; font-weight:600; color:var(--n-navy); }
html[data-design="clarity"][data-tone="navy"][data-plus] #delete-account-input { min-height:44px; padding:10px 14px; font:inherit; 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] .danger-button:disabled { opacity:.45; cursor:not-allowed; }
html[data-design="clarity"][data-tone="navy"][data-plus] .review-edited { margin-left:8px; padding:1px 8px; border-radius:999px; background:#EFEAE0; color:var(--muted); font-size:11px; font-weight:600; }
html[data-design="clarity"][data-tone="navy"][data-plus] #review-form.is-editing #review-professor-search, html[data-design="clarity"][data-tone="navy"][data-plus] #review-form.is-editing #course-select { background:#F3EFE6; color:var(--muted); cursor:not-allowed; }
@media (max-width:520px) {
  html[data-design="clarity"][data-tone="navy"][data-plus] .account-page { margin-top:22px; }
  html[data-design="clarity"][data-tone="navy"][data-plus] .account-page h1 { font-size:28px; }
  html[data-design="clarity"][data-tone="navy"][data-plus] .account-review-actions { justify-content:flex-start; }
}

/* ---------- Display names ---------- */
html[data-design="clarity"][data-tone="navy"][data-plus] .review-author { margin:2px 0 0; font-size:13px; font-weight:600; color:var(--n-gold-ink); }
html[data-design="clarity"][data-tone="navy"][data-plus] .pn-rv-grades .review-author { margin:2px 0 0 2px; text-align:left; overflow-wrap:anywhere; line-height:1.3; }
@media (max-width:740px) { html[data-design="clarity"][data-tone="navy"][data-plus] .pn-rv-grades .review-author { grid-column:1 / -1; margin:0; text-align:left; } }
html[data-design="clarity"][data-tone="navy"][data-plus] .review-name[hidden], html[data-design="clarity"][data-tone="navy"][data-plus] .review-name-field[hidden] { display:none; }
html[data-design="clarity"][data-tone="navy"][data-plus] .review-name .review-agree { margin-bottom:6px; }
html[data-design="clarity"][data-tone="navy"][data-plus] .review-name-field { display:grid; gap:6px; margin:4px 0 10px 28px; font-size:13px; font-weight:600; color:var(--n-navy); }
html[data-design="clarity"][data-tone="navy"][data-plus] #review-display-name, html[data-design="clarity"][data-tone="navy"][data-plus] #account-display-name, html[data-design="clarity"][data-tone="navy"][data-plus] #auth-name { width:100%; box-sizing:border-box; min-height:42px; padding:9px 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] #account-name-form label { display:grid; gap:6px; font-size:13px; font-weight:600; color:var(--n-navy); }
html[data-design="clarity"][data-tone="navy"][data-plus] .account-form-actions { display:flex; flex-wrap:wrap; align-items:center; gap:10px; margin-top:6px; }
html[data-design="clarity"][data-tone="navy"][data-plus] .account-form-actions .secondary-button { margin:0; padding:10px 16px; border-radius:999px; box-shadow:inset 0 0 0 1px var(--n-line); color:var(--n-navy); font-weight:600; font-size:14px; }
html[data-design="clarity"][data-tone="navy"][data-plus] .account-review-name { margin:6px 0 0; font-size:12px; font-weight:600; color:var(--n-gold-ink); }

/* Error messages in red; while the sign-in popup shows an error, its fields get a red outline too */
html[data-design="clarity"][data-tone="navy"][data-plus] .form-error { color:#B3261E; font-weight:600; }
html[data-design="clarity"][data-tone="navy"][data-plus] .form-error .auth-inline-action { color:#B3261E; }
html[data-design="clarity"][data-tone="navy"][data-plus] #signin-form:has(#signin-error:not(:empty)) :is(#signin-email, #auth-password, #auth-code, #auth-name) { border-color:#C9574A; box-shadow:0 0 0 1px #C9574A; }

/* My account: one folded "Account" area; delete account folded inside it */
html[data-design="clarity"][data-tone="navy"][data-plus] .account-settings > summary { display:flex; flex-wrap:wrap; align-items:baseline; gap:4px 12px; padding:14px 18px; border-radius:16px; background:#fff; box-shadow:0 0 0 1px var(--n-line); cursor:pointer; list-style:none; }
html[data-design="clarity"][data-tone="navy"][data-plus] .account-settings > summary::-webkit-details-marker { display:none; }
html[data-design="clarity"][data-tone="navy"][data-plus] .account-settings > summary::after { content:"›"; margin-left:auto; font-size:20px; color:var(--muted); transition:transform 150ms; }
html[data-design="clarity"][data-tone="navy"][data-plus] .account-settings[open] > summary::after { transform:rotate(90deg); }
html[data-design="clarity"][data-tone="navy"][data-plus] .account-settings > summary h2 { margin:0; }
html[data-design="clarity"][data-tone="navy"][data-plus] .account-settings > summary span { font-size:13px; color:var(--muted); }
/* Account settings: one panel, a row per action (text on the left, button on the right) */
html[data-design="clarity"][data-tone="navy"][data-plus] .account-settings > .settings-list { margin-top:12px; padding:4px 20px; }
html[data-design="clarity"][data-tone="navy"][data-plus] .settings-row { display:flex; align-items:center; justify-content:space-between; gap:12px 20px; padding:16px 0; }
html[data-design="clarity"][data-tone="navy"][data-plus] .settings-row + .settings-row, html[data-design="clarity"][data-tone="navy"][data-plus] .settings-password + .settings-row { box-shadow:inset 0 1px 0 var(--n-line); }
html[data-design="clarity"][data-tone="navy"][data-plus] .settings-text { display:grid; gap:3px; min-width:0; }
html[data-design="clarity"][data-tone="navy"][data-plus] .settings-text strong { font-size:15px; font-weight:700; color:var(--n-navy); }
html[data-design="clarity"][data-tone="navy"][data-plus] .settings-text span { font-size:13px; line-height:1.5; color:var(--muted); }
html[data-design="clarity"][data-tone="navy"][data-plus] .settings-action { flex:none; min-height:38px; padding:8px 16px; border:0; border-radius:999px; background:var(--n-ivory); box-shadow:inset 0 0 0 1px var(--n-line); color:var(--n-navy); font-size:13px; font-weight:700; white-space:nowrap; cursor:pointer; }
html[data-design="clarity"][data-tone="navy"][data-plus] .settings-action:hover { box-shadow:inset 0 0 0 1px var(--n-navy); }
html[data-design="clarity"][data-tone="navy"][data-plus] .settings-action[aria-expanded="true"] { visibility:hidden; }
html[data-design="clarity"][data-tone="navy"][data-plus] .settings-password { display:grid; gap:10px; padding:0 0 18px; }
html[data-design="clarity"][data-tone="navy"][data-plus] .settings-password[hidden] { display:none; }
html[data-design="clarity"][data-tone="navy"][data-plus] .settings-password label > span:first-child { font-size:13px; font-weight:600; color:var(--n-navy); }
html[data-design="clarity"][data-tone="navy"][data-plus] .settings-form-actions { display:flex; align-items:center; gap:14px; }
html[data-design="clarity"][data-tone="navy"][data-plus] .settings-form-actions .primary-button { width:auto; margin:0; padding:10px 18px; }
html[data-design="clarity"][data-tone="navy"][data-plus] .settings-cancel { padding:8px 4px; border:0; background:none; font-size:13px; font-weight:600; color:var(--muted); cursor:pointer; }
@media (max-width:520px) { html[data-design="clarity"][data-tone="navy"][data-plus] .settings-row { flex-direction:column; align-items:stretch; } html[data-design="clarity"][data-tone="navy"][data-plus] .settings-action { align-self:flex-start; } html[data-design="clarity"][data-tone="navy"][data-plus] .settings-action[aria-expanded="true"] { display:none; } }
html[data-design="clarity"][data-tone="navy"][data-plus] .account-delete { margin-top:18px; padding-left:4px; }
html[data-design="clarity"][data-tone="navy"][data-plus] .account-delete > summary { font-size:13px; font-weight:600; color:var(--muted); cursor:pointer; }
html[data-design="clarity"][data-tone="navy"][data-plus] .account-delete .account-danger { margin-top:10px; box-shadow:0 0 0 1px #E8C9C3; }
html[data-design="clarity"][data-tone="navy"][data-plus] #delete-account-password { min-height:44px; padding:10px 14px; font:inherit; font-size:15px; border:1px solid var(--n-line); border-radius:12px; background:#fff; color:var(--ink); }
