.ga-panel {
    --ga-accent: var(--of-blue, var(--op-accent, #1f5e78));
    --ga-accent-soft: var(--of-green-soft, var(--op-accent-soft, #e7f2ed));
    --ga-ink: var(--of-ink, var(--op-ink, #17211d));
    --ga-muted: var(--of-steel, var(--op-muted, #5d7068));
    --ga-line: var(--of-line, var(--op-line, #cfdbd6));
    position: relative;
    display: grid;
    gap: .72rem;
    margin-top: 1rem;
    padding: 1rem 1rem 1rem 1.15rem;
    color: var(--ga-ink);
    background: #fbfdfc;
    border: 1px solid var(--ga-line);
    border-left: 4px solid var(--ga-accent);
    border-radius: 10px;
}

.ga-address-fields {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
}

.ga-heading {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
}

.ga-heading__copy,
.ga-summary {
    min-width: 0;
}

.ga-eyebrow,
.ga-source {
    display: block;
    color: var(--ga-accent);
    font: 750 .65rem/1.25 ui-monospace, "SFMono-Regular", Consolas, monospace;
    letter-spacing: .09em;
    text-transform: uppercase;
}

.ga-title {
    display: block;
    margin-top: .22rem;
    font-size: .82rem;
    line-height: 1.4;
}

.ga-source {
    flex: 0 0 auto;
    padding: .32rem .48rem;
    color: var(--ga-muted);
    background: #fff;
    border: 1px solid var(--ga-line);
    border-radius: 999px;
    font-size: .59rem;
}

.ga-combobox {
    width: 100%;
    min-height: 44px;
    padding: .65rem .75rem;
    color: var(--ga-ink);
    background: #fff;
    border: 1px solid var(--ga-line);
    border-radius: 7px;
    cursor: pointer;
    font: inherit;
    font-size: .8rem;
    font-weight: 700;
    text-align: left;
}

.ga-combobox::after {
    float: right;
    content: "⌄";
    color: var(--ga-accent);
}

.ga-combobox:hover:not(:disabled) {
    border-color: var(--ga-accent);
}

.ga-combobox:disabled {
    color: var(--ga-muted);
    cursor: not-allowed;
    opacity: .82;
}

.ga-listbox {
    display: grid;
    max-height: 15rem;
    overflow: auto;
    background: #fff;
    border: 1px solid var(--ga-line);
    border-radius: 8px;
    box-shadow: 0 14px 34px rgba(24, 55, 52, .12);
}

.ga-listbox[hidden],
.ga-summary[hidden] {
    display: none;
}

.ga-option {
    width: 100%;
    padding: .72rem .8rem;
    color: var(--ga-ink);
    background: #fff;
    border: 0;
    border-bottom: 1px solid var(--ga-line);
    cursor: pointer;
    font: inherit;
    font-size: .77rem;
    line-height: 1.5;
    text-align: left;
}

.ga-option:last-child {
    border-bottom: 0;
}

.ga-option:hover,
.ga-option.is-active,
.ga-option[aria-selected="true"] {
    background: var(--ga-accent-soft);
    box-shadow: inset 3px 0 0 var(--ga-accent);
}

.ga-status {
    min-height: 1.2em;
    margin: 0;
    color: var(--ga-muted);
    font-size: .73rem;
    line-height: 1.45;
}

.ga-summary {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: .35rem .8rem;
    padding-top: .72rem;
    border-top: 1px solid var(--ga-line);
}

.ga-summary__address {
    overflow-wrap: anywhere;
    font-size: .86rem;
    line-height: 1.45;
}

.ga-precision {
    padding: .3rem .5rem;
    color: var(--ga-accent);
    background: var(--ga-accent-soft);
    border-radius: 999px;
    font-size: .66rem;
    font-weight: 750;
    white-space: nowrap;
}

.ga-summary__territory {
    grid-column: 1 / -1;
    color: var(--ga-muted);
    font-size: .68rem;
    line-height: 1.4;
}

.ga-panel[aria-busy="true"] .ga-source {
    animation: ga-pulse 1.1s ease-in-out infinite alternate;
}

@keyframes ga-pulse {
    to { opacity: .42; }
}

@media (max-width: 560px) {
    .ga-address-fields {
        grid-template-columns: 1fr;
    }

    .ga-address-fields .op-form-span-2 {
        grid-column: auto;
    }

    .ga-heading,
    .ga-summary {
        display: grid;
        grid-template-columns: 1fr;
    }

    .ga-source,
    .ga-precision {
        width: fit-content;
    }
}

@media (prefers-reduced-motion: reduce) {
    .ga-panel[aria-busy="true"] .ga-source {
        animation: none;
    }
}

.ga-locality-dialog {
    --ga-accent: var(--of-blue, var(--op-accent, #1f5e78));
    --ga-accent-soft: var(--of-green-soft, var(--op-accent-soft, #e7f2ed));
    --ga-ink: var(--of-ink, var(--op-ink, #17211d));
    --ga-muted: var(--of-steel, var(--op-muted, #5d7068));
    --ga-line: var(--of-line, var(--op-line, #cfdbd6));
    width: min(42rem, calc(100vw - 2rem));
    box-sizing: border-box;
    max-width: none;
    max-height: min(46rem, calc(100dvh - 2rem));
    padding: 0;
    overflow: hidden;
    color: var(--ga-ink);
    background: #fbfdfc;
    border: 1px solid var(--ga-line);
    border-radius: 14px;
    box-shadow: 0 28px 80px rgba(13, 38, 39, .28);
}

.ga-locality-dialog::backdrop {
    background: rgba(12, 32, 35, .58);
    backdrop-filter: blur(2px);
}

.ga-locality-shell {
    display: grid;
    grid-template-rows: auto auto auto auto minmax(7rem, 1fr) auto auto;
    max-height: min(46rem, calc(100dvh - 2rem));
}

.ga-locality-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    padding: 1.2rem 1.25rem 1rem;
    background: linear-gradient(110deg, #f2f8f6 0%, #fbfdfc 72%);
    border-top: 4px solid var(--ga-accent);
    border-bottom: 1px solid var(--ga-line);
}

.ga-locality-header__copy {
    min-width: 0;
}

.ga-locality-kicker,
.ga-locality-source {
    color: var(--ga-accent);
    font: 750 .66rem/1.25 ui-monospace, "SFMono-Regular", Consolas, monospace;
    letter-spacing: .09em;
    text-transform: uppercase;
}

.ga-locality-title {
    margin: .28rem 0 0;
    font: 750 1.18rem/1.3 inherit;
    letter-spacing: -.015em;
}

.ga-locality-close {
    display: grid;
    flex: 0 0 auto;
    width: 2.5rem;
    height: 2.5rem;
    padding: 0;
    place-items: center;
    color: var(--ga-muted);
    background: #fff;
    border: 1px solid var(--ga-line);
    border-radius: 50%;
    cursor: pointer;
    font: 400 1.55rem/1 inherit;
}

.ga-locality-description {
    margin: 0;
    padding: .9rem 1.25rem 0;
    color: var(--ga-muted);
    font-size: .86rem;
    line-height: 1.55;
}

.ga-locality-tools {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 1rem;
    padding: .9rem 1.25rem .7rem;
}

.ga-locality-filter-label {
    display: grid;
    flex: 1 1 auto;
    gap: .32rem;
    min-width: 0;
}

.ga-locality-filter-label[hidden] {
    display: none;
}

.ga-locality-filter-caption {
    color: var(--ga-muted);
    font-size: .7rem;
    font-weight: 700;
}

.ga-locality-filter {
    width: 100%;
    min-height: 42px;
    padding: .62rem .72rem;
    color: var(--ga-ink);
    background: #fff;
    border: 1px solid var(--ga-line);
    border-radius: 7px;
    font: inherit;
}

.ga-locality-source {
    flex: 0 0 auto;
    padding: .42rem .58rem;
    color: var(--ga-muted);
    background: #fff;
    border: 1px solid var(--ga-line);
    border-radius: 999px;
    font-size: .6rem;
}

.ga-locality-live {
    min-height: 1.1rem;
    margin: 0;
    padding: 0 1.25rem .55rem;
    color: var(--ga-muted);
    font-size: .71rem;
}

.ga-locality-list {
    display: grid;
    align-content: start;
    gap: .55rem;
    margin: 0 1.25rem;
    padding: .1rem .15rem .2rem;
    overflow: auto;
    overscroll-behavior: contain;
}

.ga-locality-option {
    display: grid;
    gap: .42rem;
    width: 100%;
    padding: .82rem .9rem .78rem 1rem;
    color: var(--ga-ink);
    background: #fff;
    border: 1px solid var(--ga-line);
    border-left: 4px solid transparent;
    border-radius: 9px;
    cursor: pointer;
    font: inherit;
    text-align: left;
}

.ga-locality-option:hover,
.ga-locality-option[aria-selected="true"] {
    background: var(--ga-accent-soft);
    border-color: color-mix(in srgb, var(--ga-accent) 45%, var(--ga-line));
    border-left-color: var(--ga-accent);
}

.ga-locality-option__name {
    font-size: .96rem;
    line-height: 1.35;
}

.ga-locality-option__trail {
    display: flex;
    flex-wrap: wrap;
    gap: .25rem .45rem;
}

.ga-locality-option__territory {
    color: var(--ga-muted);
    font-size: .72rem;
    line-height: 1.35;
}

.ga-locality-option__territory + .ga-locality-option__territory::before {
    margin-right: .45rem;
    color: var(--ga-line);
    content: "/";
}

.ga-locality-option__evidence {
    color: var(--ga-accent);
    font-size: .66rem;
    font-weight: 700;
}

.ga-locality-more {
    justify-self: center;
    margin: .7rem 1.25rem 0;
    padding: .5rem .7rem;
    color: var(--ga-accent);
    background: transparent;
    border: 0;
    cursor: pointer;
    font: 700 .76rem/1.3 inherit;
}

.ga-locality-more[hidden] {
    display: none;
}

.ga-locality-footer {
    display: flex;
    justify-content: flex-end;
    gap: .65rem;
    margin-top: .9rem;
    padding: .9rem 1.25rem 1.15rem;
    background: #f5f9f7;
    border-top: 1px solid var(--ga-line);
}

.ga-locality-button {
    min-height: 44px;
    padding: .65rem .9rem;
    border: 1px solid var(--ga-accent);
    border-radius: 7px;
    cursor: pointer;
    font: 750 .78rem/1.3 inherit;
}

.ga-locality-button--primary {
    color: #fff;
    background: var(--ga-accent);
}

.ga-locality-button--secondary {
    color: var(--ga-accent);
    background: #fff;
}

.ga-locality-button:disabled {
    cursor: not-allowed;
    opacity: .5;
}

.ga-locality-close:focus-visible,
.ga-locality-filter:focus-visible,
.ga-locality-option:focus-visible,
.ga-locality-more:focus-visible,
.ga-locality-button:focus-visible {
    outline: 3px solid color-mix(in srgb, var(--ga-accent) 35%, transparent);
    outline-offset: 2px;
}

.ga-locality-shell[aria-busy="true"] .ga-locality-source {
    animation: ga-pulse 1.1s ease-in-out infinite alternate;
}

@media (max-width: 560px) {
    .ga-locality-dialog {
        width: calc(100vw - 16px);
        max-height: calc(100dvh - 16px);
        border-radius: 11px;
    }

    .ga-locality-shell {
        max-height: calc(100dvh - 16px);
    }

    .ga-locality-header,
    .ga-locality-description,
    .ga-locality-tools,
    .ga-locality-live,
    .ga-locality-footer {
        padding-right: .9rem;
        padding-left: .9rem;
    }

    .ga-locality-list {
        margin-right: .9rem;
        margin-left: .9rem;
    }

    .ga-locality-tools,
    .ga-locality-footer {
        align-items: stretch;
        flex-direction: column;
    }

    .ga-locality-source {
        align-self: flex-start;
    }

    .ga-locality-button {
        width: 100%;
    }
}

@media (prefers-reduced-motion: reduce) {
    .ga-locality-shell[aria-busy="true"] .ga-locality-source {
        animation: none;
    }
}
