/* Subject focus shares the existing satin-silver palette. */
body.cinema-ui .reactions-spotlight .reaction-stage-layout{width:min(100%,1040px);grid-template-columns:minmax(406px,.9fr) minmax(280px,1.1fr);gap:clamp(22px,3vw,48px);margin:14px auto 24px}
body.cinema-ui .reactions-spotlight .reactions-dial-shell{min-width:0;gap:14px}
body.cinema-ui .reactions-spotlight #reaction-metric-dial-value{display:flex;flex-direction:column;justify-content:center;gap:15px;inset:39px;text-align:center}
body.cinema-ui .reactions-spotlight .reaction-focus-kicker{color:#536e67;font:500 10px/1.5 var(--font);letter-spacing:1.7px}
body.cinema-ui .reactions-spotlight .reaction-focus-title{color:#254f51;font:500 clamp(25px,3vw,34px)/1.12 var(--serif);letter-spacing:-1px;overflow-wrap:anywhere;margin:0;max-width:100%;text-wrap:balance}
body.cinema-ui .reactions-spotlight .reaction-focus-detail{color:#536e67;font-size:10px;line-height:1.5}
body.cinema-ui .reactions-spotlight .metric-dial .reaction-focus-number{display:block;max-width:100%;margin:0;font-size:clamp(48px,5.5vw,70px);line-height:1.1;white-space:nowrap;font-variant-numeric:tabular-nums}
body.cinema-ui .reactions-spotlight .reaction-focus-count-label{color:#556e66;font-size:10px;line-height:1.6;margin:0 0 14px}
body.cinema-ui .reactions-spotlight .reaction-stat-definition{color:#365c52;font-size:13px;line-height:1.5;margin:13px 0 6px}
body.cinema-ui .reactions-spotlight .reaction-stat-scope{max-width:680px;margin:0 auto 10px;color:#556e66;font-size:10px;line-height:1.7}
body.cinema-ui .reactions-spotlight>.stat-stage-heading{flex-direction:column;text-align:center}
body.cinema-ui .reactions-spotlight .reaction-spotlight-context{max-width:none;padding:25px 28px 23px;border-radius:18px}
body.cinema-ui .reactions-spotlight .reaction-spotlight-context .eyebrow{font-size:9px;letter-spacing:1.4px}
body.cinema-ui .reactions-spotlight .reaction-stage-context-title{font:400 clamp(24px,2.5vw,30px)/1.18 var(--serif);margin:8px 0 10px;text-wrap:balance}
body.cinema-ui .reactions-spotlight .reaction-focus-date{display:block;color:#556e66;font-size:10px;line-height:1.5;margin-bottom:15px}
body.cinema-ui .reactions-spotlight .reaction-spotlight-context .reaction-focus-supplement{color:#6b6652;font-size:10px;line-height:1.5;margin:-5px 0 12px}
body.cinema-ui .reactions-spotlight .metric-dial:focus-visible{outline:2px solid #8ba998;outline-offset:5px}
body.cinema-ui .reactions-spotlight .reaction-focus-quote{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:5;overflow:hidden;overflow-wrap:anywhere;white-space:pre-wrap;color:#2d4e48;font:400 15px/1.65 var(--font);margin:0 0 14px;padding:0 0 0 15px;border-left:2px solid #ac8e6d}
body.cinema-ui .reactions-spotlight .reaction-focus-quote.expanded{display:block;-webkit-line-clamp:unset}
body.cinema-ui .reactions-spotlight .reaction-passage-toggle{display:block;padding:4px 0 9px;min-height:32px;margin:-6px 0 3px;color:#466960;background:none;font-size:11px;text-decoration:underline;text-underline-offset:3px}
body.cinema-ui .reactions-spotlight .reaction-focus-source{display:inline-flex;align-items:center;min-height:36px;padding:5px 0;color:#315c50;background:transparent;font-size:12px;font-weight:500;text-decoration:underline;text-underline-offset:4px}
body.cinema-ui .reactions-spotlight .reaction-focus-subject{color:#556e66;font-size:10px;line-height:1.5;overflow-wrap:anywhere;margin:3px 0 11px}
body.cinema-ui .reactions-spotlight .reaction-focus-explore{display:flex;width:fit-content;max-width:100%;margin-top:12px;min-height:42px;text-align:left}
body.cinema-ui .reaction-spotlight-controls{display:flex;flex-direction:column;gap:13px;min-width:0;width:min(100%,780px);margin:19px auto 0;padding:0}
body.cinema-ui .reaction-subject-picker{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:9px 14px;min-width:0}
body.cinema-ui .reaction-subject-picker>span{color:#556e66;font-size:10px;letter-spacing:.4px}
body.cinema-ui #reaction-spotlight-subject{min-width:0;max-width:100%;width:min(100%,290px);min-height:42px;padding:9px 34px 9px 12px;color:#335951;background:#d7e0d5;border:1px solid #a3baac;border-radius:8px;font-size:12px}
body.cinema-ui .reaction-spotlight-quick{display:flex;flex-wrap:wrap;justify-content:center;gap:6px;min-width:0}
body.cinema-ui .reaction-spotlight-quick button{min-height:39px;max-width:100%;padding:8px 12px;color:#48655e;background:transparent;border:1px solid transparent;border-radius:7px;font-size:11px;text-align:left;line-height:1.5;transition:background .2s ease,border-color .2s ease}
body.cinema-ui .reaction-spotlight-quick button:hover{background:#d1ded0;border-color:#a5bfad}
body.cinema-ui .reaction-spotlight-quick button.active{color:#30594e;background:#d5e0d1;border-color:#8eae9b;box-shadow:inset 2px 0 0 #a38664}
body.cinema-ui #sidebar-reactions .reaction-spotlight-controls{width:100%;margin:0;gap:15px}
body.cinema-ui #sidebar-reactions .reaction-subject-picker{flex-direction:column;align-items:stretch;gap:8px}
body.cinema-ui #sidebar-reactions #reaction-spotlight-subject{width:100%;font-size:11px}
body.cinema-ui #sidebar-reactions .reaction-spotlight-quick{flex-direction:column;align-items:stretch;gap:5px}
body.cinema-ui #sidebar-reactions .reaction-spotlight-quick button{width:100%}
body.cinema-ui .reactions-spotlight .reaction-count-details{width:min(100%,820px);margin:18px auto 0;border-top:1px solid rgb(122 155 141 / 34%);padding-top:11px}
body.cinema-ui .reactions-spotlight .reaction-count-details>summary{width:fit-content;margin:0 auto;padding:6px 4px;color:#536e66;cursor:pointer;font-size:11px}
body.cinema-ui .reactions-spotlight .reaction-count-scope{color:#556e66;font-size:10px;text-align:center;margin:10px 0 14px}
body.cinema-ui .reactions-spotlight .reaction-secondary-metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
body.cinema-ui .reactions-spotlight .reaction-secondary-metrics .metric-card{background:rgb(219 229 215 / 32%);border:1px solid rgb(134 162 145 / 37%);box-shadow:none;min-height:0;padding:15px 14px}
body.cinema-ui .reactions-spotlight .reaction-secondary-metrics .metric-card::before{display:none}
body.cinema-ui .reactions-spotlight .reaction-secondary-metrics .metric-label{color:#556e66;font-size:8px;line-height:1.5;letter-spacing:.6px}
body.cinema-ui .reactions-spotlight .reaction-secondary-metrics .metric-value{color:#315b50;font-size:28px;line-height:1.2;margin:9px 0 6px;letter-spacing:-.7px}
body.cinema-ui .reactions-spotlight .reaction-secondary-metrics .metric-note{color:#556e66;font-size:9px;line-height:1.5}
/* The full-snapshot figure stays still while the selected passage changes. */
body.cinema-ui .reactions-spotlight :is(#reaction-metric-dial,#reaction-metric-dial .dial-orbit,#reaction-metric-dial-value,.reaction-focus-number){animation:none!important;transition:none!important}
body.cinema-ui .reactions-spotlight .reaction-spotlight-context.context-arriving{animation:reaction-passage-arrive 180ms ease-out both}
body.cinema-ui #sidebar-reactions .reaction-spotlight-quick[hidden]{display:none!important}
@keyframes reaction-passage-arrive{from{opacity:.7;transform:translateY(3px)}to{opacity:1;transform:none}}
@media(max-width:1180px){body.cinema-ui .reactions-spotlight .reaction-stage-layout{grid-template-columns:minmax(366px,.9fr) minmax(260px,1.1fr);gap:18px}body.cinema-ui .reactions-spotlight .metric-dial{width:260px;height:260px;flex-basis:260px}body.cinema-ui .reactions-spotlight .reactions-dial-shell{gap:9px}body.cinema-ui .reactions-spotlight .reaction-spotlight-context{padding:23px}}
@media(max-width:1050px){body.cinema-ui .reactions-spotlight .reaction-stage-layout{grid-template-columns:minmax(0,1fr);width:min(100%,600px);gap:6px}body.cinema-ui .reactions-spotlight .reactions-dial-shell{min-height:285px;gap:18px}body.cinema-ui .reactions-spotlight .reaction-spotlight-context{max-width:530px}}
@media(max-width:540px){body.cinema-ui .reactions-spotlight .reaction-stage-layout{margin:5px auto 19px}body.cinema-ui .reactions-spotlight .reactions-dial-shell{gap:8px;min-height:254px;padding:12px 0}body.cinema-ui .reactions-spotlight .metric-dial{width:220px;height:220px;flex-basis:220px}body.cinema-ui .reactions-spotlight #reaction-metric-dial-value{inset:31px;gap:12px}body.cinema-ui .reactions-spotlight .reaction-focus-title{font-size:26px;letter-spacing:-.7px}body.cinema-ui .reactions-spotlight .reaction-focus-kicker,body.cinema-ui .reactions-spotlight .reaction-focus-detail{font-size:9px}body.cinema-ui .reactions-spotlight .reaction-spotlight-context{padding:21px 20px;border-radius:14px}body.cinema-ui .reactions-spotlight .reaction-focus-quote{font-size:14px;padding-left:12px;-webkit-line-clamp:5}body.cinema-ui .reactions-spotlight .reaction-passage-toggle{min-height:40px}body.cinema-ui .reaction-subject-picker{align-items:stretch;flex-direction:column}body.cinema-ui .reaction-subject-picker>span{text-align:center}body.cinema-ui #reaction-spotlight-subject{width:100%}body.cinema-ui .reaction-spotlight-quick button{min-height:43px;padding:8px 10px}body.cinema-ui .reactions-spotlight .reaction-secondary-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}body.cinema-ui .reactions-spotlight .reaction-count-details>summary{min-height:44px}}
@media(max-width:360px){body.cinema-ui .reactions-spotlight .metric-dial{width:194px;height:194px;flex-basis:194px}body.cinema-ui .reactions-spotlight #reaction-metric-dial-value{inset:26px;gap:10px}body.cinema-ui .reactions-spotlight .reaction-focus-title{font-size:23px}body.cinema-ui .reactions-spotlight .reactions-dial-shell{gap:5px}body.cinema-ui .reactions-spotlight .metric-cycle{width:40px;height:40px;min-width:40px;flex-basis:40px}}
@media(prefers-reduced-motion:reduce){body.cinema-ui .reactions-spotlight *,body.cinema-ui .reaction-spotlight-controls *{animation:none!important;transition:none!important}}
