@layer page {
.pg-polling-places .polls-list { margin-top: var(--s6); }
.pg-polling-places .polls-list-heading { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 0 var(--s4); padding-bottom: var(--s3); border-bottom: 2px solid var(--ink); }
.pg-polling-places .polls-list-heading h2 { font-size: clamp(1.75rem, 2.6vw, 2.25rem); line-height: 1.1; }
.pg-polling-places .polls-list-intro { margin-top: var(--s3); }
.pg-polling-places .polls-group-head { display: grid; justify-items: start; gap: 2px; padding-top: var(--s7); }
.pg-polling-places .polls-group:first-of-type .polls-group-head { padding-top: var(--s6); }
.pg-polling-places .polls-group-heading { font: 700 1.5rem/1.2 var(--font-action); }
.pg-polling-places .is-yours .polls-group-heading::after { content: attr(data-i18n-label); display: inline-block; margin-inline-start: var(--s3); padding: 2px 10px; border-radius: var(--r-pill); background: var(--teal); color: var(--yellow); vertical-align: .2em; font: 600 .8125rem/1.4 var(--font-action); text-transform: uppercase; letter-spacing: .04em; }
.pg-polling-places .polls-authority { display: flex; flex-wrap: wrap; align-items: center; gap: 0 var(--s3); }
.pg-polling-places :is(.polls-authority, .poll-room, .poll-phone, .poll-hours > div, .poll-distance, .polls-list-heading p) { font: 500 .9375rem/1.4 var(--font-label); }
.pg-polling-places :is(.polls-group-intro, .polls-set-note, .poll-note) { font: 400 1rem/1.45 var(--font-body); }
.pg-polling-places :is(.polls-tel, .poll-phone a) { display: inline-flex; align-items: center; min-height: 44px; font-variant-numeric: tabular-nums; text-decoration: none; }
@media (hover: hover) { .pg-polling-places :is(.polls-tel, .poll-phone a):hover { text-decoration: underline; } }
.pg-polling-places .polls-group-intro { margin-top: var(--s1); }
.pg-polling-places :is(.polls-set, .polls-day) { margin-top: var(--s4); border-inline-start: 3px solid var(--teal); }
.pg-polling-places .polls-set + .polls-set { margin-top: var(--s7); }
.pg-polling-places .polls-set-head { padding-block: 2px var(--s3); padding-inline: var(--s4) var(--s3); }
.pg-polling-places .polls-set-status { display: flex; align-items: center; gap: 8px; font: 600 1.0625rem/1.35 var(--font-action); }
.pg-polling-places .polls-set-status::before { content: ""; flex: none; box-sizing: border-box; width: 10px; height: 10px; border: 2px solid var(--ink); border-radius: 50%; }
.pg-polling-places .polls-set-status:empty::before { visibility: hidden; }
.pg-polling-places .polls-set-status[data-state="open"] { color: var(--ink); }
.pg-polling-places .polls-set-status[data-state="open"]::before { border-color: var(--ink); background: var(--green); }
.pg-polling-places .polls-set-status[data-state="closing"]::before { border-color: var(--ink); background: var(--orange); }
.pg-polling-places .polls-set-status[data-state="ended"]::before { border-color: var(--line); }
.pg-polling-places [data-polls-status="day"] { margin-top: var(--s4); }
.pg-polling-places .poll-hours { margin-top: var(--s2); border-bottom: 1px solid var(--line); }
.pg-polling-places .poll-hours > div { display: grid; grid-template-columns: minmax(0, 1fr) max-content; gap: var(--s3); padding-block: 4px; border-top: 1px solid var(--line); font-variant-numeric: tabular-nums; }
.pg-polling-places .poll-hours dt { text-wrap: balance; }
.pg-polling-places .poll-hours dd { margin: 0; white-space: nowrap; text-align: end; }
.pg-polling-places :is(.polls-set-note, .poll-note) { margin-top: var(--s2); }
.pg-polling-places .phone-run { white-space: nowrap; }
.pg-polling-places .polls-cards { margin: 0; }
.pg-polling-places .poll-card { max-width: none; padding-inline: var(--s4) var(--s3); border-top: 1px solid var(--line); cursor: pointer; transition: background-color var(--d-hover) var(--ease-out); }
.pg-polling-places .poll-card:first-child { border-top: 0; }
.pg-polling-places .poll-card article { display: grid; grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "mine mine" "name side" "addr addr" "room room" "note note" "foot foot"; column-gap: var(--s3); padding-block: var(--s3); }
.pg-polling-places .poll-mine { grid-area: mine; display: inline-flex; align-items: center; gap: 6px; justify-self: start; margin-bottom: 4px; font: 600 .8125rem/1.3 var(--font-action); text-transform: uppercase; letter-spacing: .04em; }
.pg-polling-places .poll-mine::before { content: ""; box-sizing: border-box; width: 10px; height: 10px; border: 2px solid var(--ink); border-radius: 50%; background: var(--sky); }
.pg-polling-places .poll-card h4 { grid-area: name; font: 700 1.25rem/1.15 var(--font-action); overflow-wrap: anywhere; text-wrap: pretty; }
.pg-polling-places :is(.poll-distance, .poll-ward) { grid-area: side; align-self: baseline; justify-self: end; white-space: nowrap; }
.pg-polling-places .poll-ward { font: 600 .8125rem/1.3 var(--font-action); text-transform: uppercase; letter-spacing: .04em; }
.pg-polling-places .poll-card:has(.poll-distance:not([hidden])) .poll-ward { display: none; }
.pg-polling-places .poll-address { grid-area: addr; margin-top: 2px; font: 400 1rem/1.45 var(--font-body); }
.pg-polling-places .poll-room { grid-area: room; }
.pg-polling-places .poll-note { grid-area: note; }
.pg-polling-places .poll-foot { grid-area: foot; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 0 var(--s3); min-height: 44px; margin-top: 2px; }
.pg-polling-places .poll-actions { display: flex; align-items: center; gap: 2px; margin-inline-start: auto; margin-inline-end: -10px; }
.pg-polling-places .poll-card .poll-directions { display: inline-flex; align-items: center; gap: 4px; min-height: 44px; padding: 0 var(--s2); font: 700 1rem/1 var(--font-action); text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: .25em; }
.pg-polling-places .poll-card .poll-directions svg { width: 18px; height: 18px; transition: transform var(--d-hover) var(--ease-out); }
@media (hover: hover) { .pg-polling-places .poll-card .poll-directions:hover { text-decoration-thickness: 2px; } }
@media (hover: hover) and (prefers-reduced-motion: no-preference) { .pg-polling-places .poll-card .poll-directions:hover svg { transform: translateX(3px); } }
.pg-polling-places .poll-card .poll-directions svg:dir(rtl) { scale: -1 1; }
.pg-polling-places .poll-show-map { display: inline-grid; place-items: center; width: 44px; height: 44px; padding: 0; border: 0; border-radius: 50%; background: transparent; color: inherit; transition: background-color var(--d-hover) var(--ease-out), color var(--d-hover) var(--ease-out); }
.pg-polling-places .poll-show-map span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
@media (hover: hover) { .pg-polling-places .poll-card .poll-show-map:hover { box-shadow: inset 0 0 0 2px var(--ink); } }
.pg-polling-places .poll-card .poll-show-map[aria-pressed="true"] { background: var(--teal); color: var(--yellow); }
.pg-polling-places .poll-card:has(.poll-mine) .poll-directions { padding: 0 18px; border-radius: var(--r-pill); background: var(--btn-bg); color: var(--btn-fg); text-decoration: none; }
.pg-polling-places .vote-card .poll-show-map { box-shadow: inset 0 0 0 2px currentColor; }
.pg-polling-places .vote-card .poll-show-map:is(:active, [aria-pressed="true"]) { background: var(--teal); color: var(--yellow); box-shadow: none; }
@media (hover: hover) { .pg-polling-places .vote-card .poll-show-map:hover { background: var(--teal); color: var(--yellow); box-shadow: none; } }
.pg-polling-places .poll-card.is-selected { background: var(--hover); box-shadow: inset 4px 0 0 var(--ink); --focus: var(--ink); }
@media (hover: hover) { .pg-polling-places .poll-card:hover:not(.is-selected) { background: var(--surface); --focus: var(--ink); } }
.pg-polling-places .polls-others { min-height: 48px; margin-top: var(--s4); padding: 8px 22px; border: 2px solid var(--btn2-line); border-radius: var(--r-pill); background: var(--btn2-bg); color: var(--btn2-fg); font: 700 1.125rem/1.3 var(--font-action); transition: background-color var(--d-hover) var(--ease-out), color var(--d-hover) var(--ease-out); }
@media (hover: hover) { .pg-polling-places .polls-others:hover { background: var(--btn2-over-bg); border-color: var(--btn2-over-line); color: var(--btn2-over-fg); } }
}