.voting-page .masthead{height:68px}
.vote-heading{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:22px 0 16px}
.vote-heading h1{font-size:var(--text-section);line-height:1.2;letter-spacing:-.035em;font-weight:450}
.vote-account{display:flex;align-items:center;justify-content:flex-end;gap:12px;font-size:var(--text-small);flex-wrap:wrap}
.vote-account a[aria-disabled="true"]{opacity:.5;cursor:default;pointer-events:none}
.vote-privacy{font-size:var(--text-small);color:var(--muted);text-decoration:underline;text-decoration-style:dotted;text-underline-offset:4px}
.vote-toolbar{display:flex;align-items:center;gap:10px;padding:0 0 18px}
.vote-toolbar label{min-width:0}.vote-toolbar select{min-width:250px}
.brief-dialog{width:min(720px,calc(100vw - 32px));max-height:85dvh;padding:24px}
.brief-heading{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:20px}
.brief-heading h2{font-size:var(--text-section)}.brief-dialog pre{padding:18px;font-size:var(--text-body)}
.rating-surface{--review-height:clamp(420px,58dvh,760px);position:relative;isolation:isolate}
.rating-surface[data-locked="true"] #rating-content{filter:blur(9px);opacity:.5;pointer-events:none;user-select:none}
.rating-signin-overlay{position:absolute;inset:0;z-index:2;display:grid;grid-template-rows:var(--review-height) 1fr;justify-items:center;padding-inline:18px;background:color-mix(in srgb,var(--paper) 45%,transparent)}
.rating-signin-callout{align-self:center;display:flex;align-items:center;flex-direction:column;gap:18px;max-width:100%;text-align:center}
.google-signin{display:block;width:252px;max-width:100%;border-radius:4px;cursor:pointer;box-shadow:0 4px 20px #0002}
.google-signin img{display:block;width:100%;height:auto}
.google-signin .google-signin-dark{display:none}
:root[data-theme="dark"] .google-signin-light{display:none}
:root[data-theme="dark"] .google-signin .google-signin-dark{display:block}
@media(prefers-color-scheme:dark){:root:not([data-theme="light"]) .google-signin-light{display:none}:root:not([data-theme="light"]) .google-signin .google-signin-dark{display:block}}
.google-signin:hover{box-shadow:0 5px 24px #0004}
.google-signin:focus-visible{outline:2px solid var(--accent);outline-offset:5px}
.google-signin[aria-disabled="true"]{opacity:.55;pointer-events:none;cursor:default}
.signin-subscribe{display:flex;align-items:flex-start;gap:10px;max-width:290px;font-size:var(--text-small);line-height:1.5;color:var(--ink);text-align:left;cursor:pointer}
.signin-subscribe[hidden]{display:none}
.signin-subscribe input{flex:none;width:18px;height:18px;margin:2px 0 0;accent-color:var(--accent);cursor:pointer}
.rating-signin-callout p{font-size:var(--text-small);line-height:1.6;color:var(--ink);max-width:330px;margin:0}
.rating-signin-callout p a{text-decoration:underline;text-decoration-style:dotted;text-underline-offset:4px}
@media(max-width:760px){.rating-surface{--review-height:max(330px,52dvh)}}
.review-image{display:block;width:100%;height:var(--review-height);padding:14px;background:#fff;border:1px solid var(--rule);cursor:zoom-in}
.review-image img{width:100%;height:100%;object-fit:contain}
.review-image:hover{border-color:var(--accent)}
.rating-scale{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px;max-width:1000px;margin:20px auto 12px}
.rating-choice{padding:14px 8px;min-width:0;min-height:92px;font-size:var(--text-small);line-height:1.4;background:var(--surface);border:1px solid var(--rule)}
/* Each rating box takes its tone from the red-to-green usability scale; Cannot judge (0) is plain ink (black on light, white on dark). */
.rating-choice[data-score="1"]{--tone:hsl(0 62% 42%)}.rating-choice[data-score="2"]{--tone:hsl(30 62% 42%)}.rating-choice[data-score="3"]{--tone:hsl(60 62% 42%)}.rating-choice[data-score="4"]{--tone:hsl(90 62% 42%)}.rating-choice[data-score="5"]{--tone:hsl(120 62% 42%)}.rating-choice[data-score="skip"]{--tone:var(--ink)}
.rating-dot{display:block;width:18px;height:18px;border-radius:50%;border:2px solid var(--tone,var(--muted));margin:0 auto 10px}
.rating-choice[data-filled="true"] .rating-dot{background:var(--tone,var(--accent))}
.rating-choice[aria-pressed="true"]{border-color:var(--tone,var(--accent));outline:1px solid var(--tone,var(--accent))}
#rating-desk[data-saved="true"] .rating-choice{opacity:1}
.vote-status{display:flex;align-items:center;justify-content:center;gap:14px;flex-wrap:wrap}
.vote-actions{display:flex;flex-direction:column;align-items:center;text-align:center;margin-top:20px;gap:12px}
.submit-vote{min-height:54px;min-width:220px;font-size:var(--text-body);background:var(--ink);color:var(--paper)}
.vote-actions .submit-vote{display:inline-flex;align-items:center;justify-content:center;gap:18px;min-height:60px;min-width:min(280px,100%);max-width:100%}
.vote-actions .submit-vote>span{color:inherit;font-size:inherit}
.vote-actions .submit-vote[data-next="true"]{background:var(--accent);border-color:var(--accent);color:var(--next-action-ink,#fff);font-weight:650;--button-hover-bg:color-mix(in srgb,var(--accent) 90%,var(--ink));--button-hover-fg:var(--next-action-ink,#fff)}
.next-drawing-arrow{width:28px;height:28px;flex-shrink:0;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:square;stroke-linejoin:miter}
.next-drawing-icon{display:flex}
.vote-actions #vote-readiness{min-height:3.3em;max-width:720px;margin-top:0}
.vote-actions #vote-readiness:focus{outline:2px solid var(--accent);outline-offset:3px}
.vote-actions #verification{min-height:65px;width:min(300px,100%);margin-top:0}
.vote-guidance{margin-top:24px}
.vote-guidance summary{font-size:var(--text-small);color:var(--muted)}
.vote-help{font-size:var(--text-small);color:var(--muted);padding-bottom:18px;max-width:800px}
.vote-rules{margin:35px 0 45px}.vote-rules p{font-size:var(--text-small);color:var(--muted);margin:0 0 16px;max-width:850px}.vote-rules a{text-decoration:underline;text-underline-offset:4px}.voting-page .dialog-head h2{font-size:var(--text-section)}.voting-page footer{margin-top:35px}.rate-link{color:var(--accent)!important}
@media(max-width:760px){.vote-heading{align-items:flex-start;flex-wrap:wrap;gap:12px}.vote-account{justify-content:flex-start}.voting-page .masthead nav a{display:block}.review-image{height:52dvh;min-height:330px}.rating-scale{gap:6px}.rating-choice{padding:12px 5px}}
@media(max-width:480px){.voting-page .masthead{height:60px}.vote-heading{padding-top:18px}.vote-account{gap:10px}.vote-toolbar{gap:8px}.vote-toolbar label{flex:1}.vote-toolbar select{min-width:0;width:100%}.brief-dialog{padding:18px}.rating-scale{grid-template-columns:1fr;gap:6px}.rating-choice{display:flex;align-items:center;gap:12px;min-height:44px;text-align:left;padding:10px 14px}.rating-dot{margin:0;flex-shrink:0}}


.rating-progress{margin-left:auto;display:flex;align-items:center;gap:10px;font-size:var(--text-small);color:var(--muted);white-space:nowrap}.rating-progress progress{width:100px;height:6px;accent-color:var(--accent)}
@media(max-width:600px){.vote-toolbar{flex-wrap:wrap}.rating-progress{flex-basis:100%;justify-content:flex-end}.rating-progress progress{flex:1;max-width:140px}}

:root[data-theme="dark"]{--next-action-ink:#090a0b}
@media(prefers-color-scheme:dark){:root:not([data-theme="light"]){--next-action-ink:#090a0b}}
/* Results row under the rating boxes: summary under box 0; a square-cornered bar across all five boxes. A score s sits over the centre of box s */
.rating-scale,.rating-result{gap:var(--gap,10px)}
.rating-result{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));max-width:1000px;margin:0 auto 6px;align-items:center;text-align:left}
.rating-result[hidden],.vote-status[hidden],.result-scale[hidden]{display:none}
.result-summary{grid-column:1;min-width:0}
.result-summary p{margin:0}
#result-title{white-space:nowrap;display:flex;align-items:center;gap:8px;font-size:var(--text-body);font-weight:600;line-height:1.3}
.result-check{display:inline-grid;place-items:center;flex:none;width:22px;height:22px;background:hsl(120 62% 42%);color:#fff;font-size:14px;line-height:1}
#result-stats{margin-top:4px;line-height:1.4;white-space:pre-line}
.result-scale{grid-column:2 / 7;min-width:0}
.result-track{position:relative;height:26px;background:var(--surface);border:1px solid var(--rule)}
.result-fill{position:absolute;left:0;top:0;bottom:0;width:calc(var(--avg) * (100% + var(--gap,10px)) / 5 + (100% - 4 * var(--gap,10px)) / 10);min-width:6px}
.result-you{position:absolute;top:50%;left:calc(var(--mine) * (100% + var(--gap,10px)) / 5 + (100% - 4 * var(--gap,10px)) / 10);width:22px;height:22px;margin:-11px 0 0 -11px;border:2px solid var(--ink);border-radius:50%;box-sizing:border-box}
.result-you[hidden]{display:none}
@media(max-width:760px){.rating-scale,.rating-result{--gap:6px}}
@media(max-width:480px){.rating-result{grid-template-columns:1fr;gap:12px}.result-scale{grid-column:1}}
/* Hover text for the results bar: plain text inside the bar, on the half away from your dot. Hovering the dot switches it to "your rating". */
.result-track::after{content:attr(data-tip);position:absolute;top:2px;bottom:2px;right:8px;display:flex;align-items:center;padding:0 10px;background:var(--paper);color:var(--ink);border:1px solid var(--rule);font-size:.8125rem;line-height:1;white-space:nowrap;pointer-events:none;opacity:0;visibility:hidden;z-index:3}
.result-track[data-side="left"]::after{left:8px;right:auto}
.result-track:hover::after{opacity:1;visibility:visible}
.result-track:has(.result-you:hover)::after{content:attr(data-tip-you)}