/* Reusable controls, form fields, lists, notices, dialogs, and status UI. */
.button { display: inline-flex; align-items: center; justify-content: center; gap: .45rem; min-height: 40px; padding: .5rem .8rem; color: var(--color-text); background: var(--color-surface); border: 1px solid var(--color-line-strong); font-size: .875rem; font-weight: 650; line-height: 1.4; text-decoration: none; }
.button:hover:not(:disabled) { background: var(--color-surface-hover); }
.button--primary { color: #fff; background: var(--color-primary-fill); border-color: var(--color-primary-fill); }
.button--primary:hover:not(:disabled) { background: var(--color-primary-fill-hover); }
.button--danger { color: #fff; background: var(--color-danger-fill); border-color: var(--color-danger-fill); }
.button--danger:hover:not(:disabled) { background: var(--color-danger-hover); }
.button--quiet { color: inherit; background: transparent; border-color: transparent; }
.button--icon { min-width: 38px; padding: .38rem; }
.button[aria-pressed="true"] { color: var(--color-primary); background: var(--color-primary-soft); border-color: currentColor; box-shadow: inset 0 -2px currentColor; }
.button--compact { min-height: 30px; padding: .25rem .45rem; font-size: .78rem; }
.workspace-toolbar { display: flex; flex: 0 0 auto; flex-wrap: wrap; gap: .35rem; padding: .55rem; border-bottom: 1px solid var(--color-line); }
.workspace-toolbar .button { min-height: 32px; padding: .32rem .55rem; font-size: .8rem; }
.notice { padding: .75rem .9rem; color: var(--color-text); background: var(--color-primary-soft); border: 1px solid var(--color-line); border-inline-start: 3px solid var(--color-primary); border-radius: var(--radius-sm); line-height: 1.6; }
.notice--warning { color: var(--color-warning); background: var(--color-warning-soft); border-color: var(--color-warning); }
.notice--error { color: var(--color-danger); background: var(--color-error-soft); border-color: var(--color-danger); }
.status-card { padding: .55rem .75rem; color: var(--color-text); background: color-mix(in srgb, var(--color-surface) 92%, transparent); border: 1px solid var(--color-line-strong); border-radius: var(--radius-sm); box-shadow: 0 3px 10px rgb(15 23 42 / 12%); font-size: .88rem; }
.toast { padding: .8rem 1rem; color: var(--color-brand-paper); background: var(--color-brand-ink); border: 1px solid var(--color-line-strong); border-radius: var(--radius-sm); box-shadow: var(--shadow-panel); animation: toast-in .16s ease-out; }
@keyframes toast-in { from { opacity: 0; transform: translateY(-8px); } to { opacity: 1; transform: translateY(0); } }
.map-base-layer-control { color: var(--color-text); }
.map-view-mode-control__button { min-height: 42px; padding: .45rem .7rem; color: var(--color-text); background: color-mix(in srgb, var(--color-surface) 96%, transparent); border: 1px solid var(--color-line-strong); border-radius: var(--radius-md); box-shadow: var(--shadow-panel); font: inherit; font-weight: 750; cursor: pointer; }
.map-view-mode-control__button:hover { background: var(--color-surface-hover); }
.map-view-mode-control__button[aria-pressed="true"] { color: var(--color-primary); background: var(--color-primary-soft); border-color: var(--color-primary); }
.map-base-layer-control__summary { display: inline-flex; align-items: center; gap: .45rem; min-height: 42px; padding: .45rem .7rem; color: var(--color-text); background: color-mix(in srgb, var(--color-surface) 96%, transparent); border: 1px solid var(--color-line-strong); border-radius: var(--radius-md); box-shadow: var(--shadow-panel); cursor: pointer; font-weight: 750; list-style: none; }
.map-base-layer-control__summary::-webkit-details-marker { display: none; }
.map-base-layer-control__summary::after { content: "▾"; color: var(--color-muted); font-size: .8rem; }
.map-base-layer-control[open] > .map-base-layer-control__summary { color: var(--color-primary); background: var(--color-primary-soft); border-color: var(--color-primary); }
.map-base-layer-control__menu { display: grid; gap: .18rem; min-width: min(280px, calc(100vw - 1.6rem)); max-height: max(3rem, calc(var(--map-viewport-height, 100vh) - var(--map-attribution-height, 96px) - 4rem)); margin: .35rem 0 0; padding: .45rem .55rem .55rem; color: var(--color-text); background: var(--color-surface); border: 1px solid var(--color-line-strong); border-radius: var(--radius-md); box-shadow: var(--shadow-panel); overflow-y: auto; }
.map-base-layer-control__menu legend { padding-inline: .3rem; color: var(--color-muted); font-size: .78rem; font-weight: 700; }
.map-base-layer-option { display: flex; align-items: center; gap: .5rem; min-height: 34px; padding: .25rem .35rem; border-radius: var(--radius-sm); cursor: pointer; }
.map-base-layer-option:hover { background: var(--color-surface-hover); }
.map-base-layer-option input { flex: 0 0 auto; margin: 0; }
.maplibregl-popup-content { min-width: 180px; padding: .8rem 2rem .8rem .85rem; color: var(--color-text); background: var(--color-surface); border: 1px solid var(--color-line-strong); border-radius: var(--radius-sm); box-shadow: var(--shadow-panel); line-height: 1.45; }
.maplibregl-popup-content strong { display: block; margin-bottom: .3rem; color: var(--color-text); font-size: .95rem; }
.maplibregl-popup-content p { margin: 0; color: var(--color-muted); overflow-wrap: anywhere; white-space: pre-wrap; }
.maplibregl-popup.map-popup--marker { z-index: 3; }
.maplibregl-popup.map-popup--marker .maplibregl-popup-content { max-width: min(360px, calc(100vw - 2rem)); max-height: min(55vh, 440px); overflow: auto; }
.maplibregl-popup-close-button { display: inline-flex; align-items: center; justify-content: center; width: 30px; height: 30px; color: var(--color-muted); background: transparent; border-radius: var(--radius-sm); font-size: 1.25rem; line-height: 1; }
.maplibregl-popup-close-button:hover { color: var(--color-text); background: var(--color-surface-hover); }
.maplibregl-popup-anchor-top .maplibregl-popup-tip { border-bottom-color: var(--color-surface); }
.maplibregl-popup-anchor-top-left .maplibregl-popup-tip { border-bottom-color: var(--color-surface); }
.maplibregl-popup-anchor-top-right .maplibregl-popup-tip { border-bottom-color: var(--color-surface); }
.maplibregl-popup-anchor-bottom .maplibregl-popup-tip { border-top-color: var(--color-surface); }
.maplibregl-popup-anchor-bottom-left .maplibregl-popup-tip { border-top-color: var(--color-surface); }
.maplibregl-popup-anchor-bottom-right .maplibregl-popup-tip { border-top-color: var(--color-surface); }
.maplibregl-popup-anchor-left .maplibregl-popup-tip { border-right-color: var(--color-surface); }
.maplibregl-popup-anchor-right .maplibregl-popup-tip { border-left-color: var(--color-surface); }
.form-grid { display: grid; gap: .85rem; }
.form-section { display: grid; gap: .85rem; min-inline-size: 0; margin: 0; padding: 1rem; background: var(--color-surface-alt); border: 1px solid var(--color-line); border-radius: var(--radius-md); }
.form-section legend { margin: 0; padding: 0 .4rem; color: var(--color-text); font-size: .98rem; font-weight: 800; }
.form-section__description { margin: -.2rem 0 0; color: var(--color-muted); font-size: .8rem; line-height: 1.4; }
.form-progress { display: grid; gap: .55rem; margin: 0 0 1rem; padding: .85rem 1rem; color: var(--color-text); background: var(--color-surface-alt); border: 1px solid var(--color-line); border-radius: var(--radius-sm); }
.form-progress__title { color: var(--color-layer); font-size: .78rem; font-weight: 800; }
.form-progress ol { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .65rem; margin: 0; padding: 0; list-style: none; }
.form-progress--1 ol { grid-template-columns: 1fr; }
.form-progress--2 ol { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.form-progress__step { position: relative; display: flex; align-items: center; gap: .4rem; min-width: 0; color: var(--color-muted); font-size: .78rem; font-weight: 700; }
.form-progress__step:not(:last-child)::after { content: "›"; position: absolute; top: 0; right: -.45rem; color: var(--color-line-strong); font-size: 1.2rem; line-height: 1.5rem; }
.form-progress__number { display: inline-grid; flex: 0 0 1.5rem; width: 1.5rem; height: 1.5rem; place-items: center; color: var(--color-muted); background: var(--color-surface); border: 1px solid var(--color-line-strong); border-radius: 50%; font-size: .75rem; }
.form-progress__label { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.form-progress__step.is-complete, .form-progress__step.is-current { color: var(--color-layer); }
.form-progress__step.is-complete .form-progress__number { color: #fff; background: var(--color-primary-fill); border-color: var(--color-primary-fill); }
.form-progress__step.is-current .form-progress__number { color: #fff; background: var(--color-primary-fill); border-color: var(--color-primary-fill); box-shadow: 0 0 0 3px color-mix(in srgb, var(--color-primary) 20%, transparent); }
.form-key { display: flex; flex-wrap: wrap; gap: .35rem .8rem; align-items: center; margin: 0 0 .9rem; color: var(--color-muted); font-size: .75rem; }
.form-key__item { display: inline-flex; align-items: center; gap: .3rem; }
.form-key__badge, .field__required, .field__optional { display: inline-flex; align-items: center; justify-content: center; min-height: 1.2rem; padding: .06rem .35rem; border-radius: 999px; font-size: .68rem; font-weight: 800; line-height: 1; }
.form-key__badge--required, .field__required { color: #fff; background: var(--color-primary-fill); }
.form-key__badge--optional, .field__optional { color: var(--color-muted); background: var(--color-surface-hover); border: 1px solid var(--color-line); }
.dialog--panel-settings .dialog__body > p { margin: 0 0 .9rem; padding: .65rem .75rem; color: var(--color-text); background: var(--color-primary-soft); border-left: .28rem solid var(--color-primary); border-radius: var(--radius-sm); font-weight: 700; }
.dialog--panel-settings .form-section[data-section-id="content"] { border-top: .28rem solid var(--color-primary); }
.dialog--panel-settings .form-section[data-section-id="size"] { border-top: .28rem solid var(--color-zone); }
.dialog--panel-settings .form-section[data-section-id="amount"] { border-top: .28rem solid var(--color-marker); }
.dialog--panel-settings .dialog__footer button[type="submit"] { min-width: 9.5rem; }
.field { display: grid; gap: .35rem; min-width: 0; }
.field--required { padding: .55rem .65rem .6rem; border-inline-start: 2px solid var(--color-primary); border-radius: var(--radius-sm); }
.field__label, .field__group-label { display: flex; align-items: center; flex-wrap: wrap; gap: .4rem; min-width: 0; font-weight: 750; }
.field__label-text { min-width: 0; }
.field__help { color: var(--color-muted); font-size: .82rem; }
.field input, .field select, .field textarea { width: 100%; padding: .55rem .65rem; color: var(--color-text); background: var(--color-surface); border: 1px solid var(--color-line-strong); }
.field input:not([type="checkbox"]):not([type="radio"]), .field select, .field textarea { min-height: 42px; }
.field textarea { min-height: 7rem; resize: vertical; }
.sample-source-list { display: grid; gap: .65rem; min-width: 0; }
.sample-source-card, .dialog .sample-source-card, .dialog .choice-card { display: grid; grid-template-columns: 1.35rem minmax(0, 1fr); align-items: start; justify-items: stretch; gap: .75rem; min-width: 0; min-height: 5.25rem; box-sizing: border-box; padding: .8rem .85rem; color: var(--color-text); background: var(--color-surface-alt); border: 1px solid var(--color-line); border-radius: var(--radius-sm); cursor: pointer; font-weight: 400; line-height: 1.45; text-align: left; }
.sample-source-card:hover, .sample-source-card:focus-within, .dialog .choice-card:hover, .dialog .choice-card:focus-within { background: var(--color-surface-hover); border-color: var(--color-primary); }
.sample-source-card:has(input:checked), .dialog .choice-card:has(input:checked) { color: var(--color-primary); background: var(--color-primary-soft); border-color: var(--color-primary); box-shadow: inset 0 0 0 1px var(--color-primary); }
.sample-source-card--disabled, .sample-source-card--disabled:hover, .sample-source-card--disabled:focus-within { color: var(--color-muted); background: var(--color-surface-alt); border-color: var(--color-line); cursor: not-allowed; opacity: .72; }
.sample-source-card > input[type="checkbox"], .sample-source-card > input[type="radio"], .dialog .choice-card > input[type="checkbox"], .dialog .choice-card > input[type="radio"] { grid-column: 1; justify-self: start; align-self: start; width: 1.1rem; min-width: 1.1rem; height: 1.1rem; margin: .15rem 0 0; padding: 0; accent-color: var(--color-primary); }
.sample-source-card__content, .dialog .sample-source-card__content, .dialog .choice-card__content { display: grid; grid-template-columns: minmax(0, 1fr); grid-template-rows: auto auto auto; align-content: start; justify-items: start; gap: .2rem; min-width: 0; font-weight: 400; text-align: left; }
.sample-source-card__title, .dialog .choice-card__title { display: block; color: inherit; font-weight: 750; }
.sample-source-card__description, .sample-source-card__summary, .dialog .choice-card__description, .dialog .choice-card__summary { display: block; color: var(--color-muted); font-size: .84rem; line-height: 1.5; overflow-wrap: anywhere; }
.sample-source-card__summary, .dialog .choice-card__summary { margin-top: .08rem; font-weight: 650; }
.dialog .choice-card > span { font-size: inherit; line-height: inherit; text-align: left; }
.dialog .choice-card > span.choice-card__content { color: inherit; }
.dialog .choice-card span.choice-card__description, .dialog .choice-card span.choice-card__summary { color: var(--color-muted); font-size: .84rem; line-height: 1.5; }
.color-field { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: .55rem; align-items: center; }
.field .color-field__picker[type="color"] { min-height: 2.6rem; padding: .16rem; cursor: pointer; }
.color-field__picker::-webkit-color-swatch-wrapper { padding: 0; }
.color-field__picker::-webkit-color-swatch { border: 0; }
.color-field__picker::-moz-color-swatch { border: 0; }
.color-field__value { min-width: 5.7rem; color: var(--color-muted); font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: .82rem; text-align: right; }
.dialog { width: min(600px, calc(100vw - 2rem)); max-height: min(90dvh, 820px); padding: 0; color: var(--color-text); background: var(--color-surface); border: 1px solid var(--color-line-strong); border-radius: var(--radius-lg); box-shadow: 0 22px 70px rgb(19 38 30 / 30%); overflow: hidden; }
.dialog--layer-settings { width: min(720px, calc(100vw - 2rem)); border-top: 3px solid var(--color-layer); }
.dialog--layer-settings .dialog__header { background: var(--color-surface-alt); }
.dialog--layer-settings .dialog__header h2 { font-size: 1.2rem; }
.dialog--layer-settings .dialog__body { padding: 1rem clamp(1rem, 2.5vw, 1.5rem) 1.2rem; }
.dialog--layer-settings .dialog__description { margin: 0 0 .8rem; padding: .65rem .75rem; color: var(--color-text); background: var(--color-primary-soft); border-inline-start: .28rem solid var(--color-primary); border-radius: var(--radius-sm); font-weight: 650; line-height: 1.5; }
.dialog--layer-settings .form-grid { gap: .9rem; }
.dialog--layer-settings .form-section { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .75rem; padding: .95rem; border-top: .28rem solid var(--color-layer); }
.dialog--layer-settings .form-section[data-section-id="data"] { border-top-color: var(--color-data); }
.dialog--layer-settings .form-section[data-section-id="range"] { border-top-color: var(--color-zone); }
.dialog--layer-settings .form-section legend, .dialog--layer-settings .form-section__description { grid-column: 1 / -1; }
.dialog--layer-settings .field--wide { grid-column: 1 / -1; }
.dialog--layer-settings .dialog__footer { background: var(--color-surface); }
.dialog--wide { width: min(1120px, calc(100vw - 2rem)); }
.dialog--public-data-picker { width: min(1240px, calc(100vw - 2rem)); max-height: min(94dvh, 980px); }
.dialog--public-data-picker form { max-height: min(94dvh, 980px); }
.dialog--public-data-picker .dialog__body { display: grid; gap: .9rem; padding: clamp(1rem, 2.4vw, 1.5rem); }
.dialog--public-data-picker [hidden] { display: none; }
.public-data-picker__description { margin: 0; padding: .7rem .8rem; color: var(--color-text); background: var(--color-primary-soft); border-inline-start: .28rem solid var(--color-primary); border-radius: var(--radius-sm); font-weight: 650; line-height: 1.5; }
.public-data-picker__filters { display: grid; grid-template-columns: minmax(220px, 1.6fr) repeat(2, minmax(150px, 1fr)); gap: .7rem; min-width: 0; padding: .8rem; background: var(--color-surface-alt); border: 1px solid var(--color-line); border-radius: var(--radius-sm); }
.public-data-picker__filters--advanced { grid-template-columns: repeat(4, minmax(0, 1fr)); margin-top: .6rem; }
.public-data-picker__categories { display: flex; flex-wrap: wrap; gap: .4rem; }
.public-data-picker__category { min-height: 40px; padding: .45rem .65rem; color: var(--color-text); background: var(--color-surface-alt); border: 1px solid var(--color-line-strong); border-radius: var(--radius-sm); font-size: .84rem; }
.public-data-picker__category[aria-pressed="true"] { color: var(--color-primary-contrast, #fff); background: var(--color-primary); border-color: var(--color-primary); }
.public-data-picker__advanced > summary { width: fit-content; padding: .3rem 0; cursor: pointer; color: var(--color-primary); font-size: .85rem; font-weight: 700; }
.public-data-picker__results-bar, .public-data-picker__pagination { display: flex; align-items: center; justify-content: space-between; gap: .5rem; }
.public-data-picker__pagination { justify-content: center; padding-top: .75rem; font-size: .85rem; }
.public-data-picker__workspace { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(280px, 1fr); align-items: start; gap: 1rem; }
.public-data-picker__results { min-width: 0; }
.public-data-picker__candidate { display: grid; align-content: start; gap: .2rem; min-width: 0; }
.public-data-picker__candidate > .button { justify-self: start; padding: .25rem .5rem; font-size: .78rem; }
.public-data-picker__detail { position: sticky; top: 0; min-width: 0; padding: 1rem; border: 1px solid var(--color-line-strong); border-radius: var(--radius-sm); background: var(--color-surface-alt); font-size: .85rem; overflow-wrap: anywhere; }
.public-data-picker__detail h3 { margin: 0 0 .7rem; font-size: 1rem; line-height: 1.5; }
.public-data-picker__detail p { margin: .65rem 0; line-height: 1.65; }
.public-data-picker__detail details { padding: .65rem 0; border-top: 1px solid var(--color-line); }
.public-data-picker__detail summary { cursor: pointer; font-weight: 700; }
.public-data-picker__detail ul { margin: .65rem 0; padding-left: 1.2rem; }
.public-data-picker__facts { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: .4rem .6rem; margin: .75rem 0; }
.public-data-picker__facts dt { color: var(--color-muted); }
.public-data-picker__facts dd { margin: 0; }
.public-data-picker__usage { padding: .6rem; background: var(--color-primary-soft); border-left: 3px solid var(--color-primary); }
.public-data-picker__links { display: flex; flex-wrap: wrap; gap: .5rem 1rem; }
.public-data-picker__selection-status { flex: 1 1 220px; margin: 0; font-size: .8rem; overflow-wrap: anywhere; }
.public-data-picker__field { align-content: start; }
.public-data-picker__search { min-width: 0; }
.public-data-picker__result { min-height: 1.3rem; margin: 0; color: var(--color-muted); font-size: .88rem; font-weight: 700; }
.public-data-picker__list { min-width: 0; }
.public-data-picker__cards { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .75rem; min-width: 0; }
.public-data-picker__card { display: grid; grid-template-columns: 1.1rem minmax(0, 1fr); align-items: start; gap: .5rem; min-width: 0; padding: .7rem; color: var(--color-text); background: var(--color-surface); border: 1px solid var(--color-line); border-radius: var(--radius-sm); cursor: pointer; line-height: 1.45; }
.public-data-picker__card:hover, .public-data-picker__card:focus-within { background: var(--color-surface-hover); border-color: var(--color-primary); }
.public-data-picker__card:has(input:checked) { background: var(--color-primary-soft); border-color: var(--color-primary); box-shadow: inset 0 0 0 1px var(--color-primary); }
.public-data-picker__card.is-unavailable, .public-data-picker__card.is-unavailable:hover, .public-data-picker__card.is-unavailable:focus-within { color: var(--color-muted); background: var(--color-surface-alt); border-color: var(--color-line); cursor: not-allowed; opacity: .8; }
.public-data-picker__card > input[type="radio"] { width: 1.1rem; min-width: 1.1rem; height: 1.1rem; margin: .16rem 0 0; padding: 0; accent-color: var(--color-primary); }
.public-data-picker__card-content { display: grid; align-content: start; gap: .38rem; min-width: 0; }
.public-data-picker__title { color: inherit; font-weight: 800; overflow-wrap: anywhere; }
.public-data-picker__summary { color: var(--color-muted); font-size: .84rem; line-height: 1.5; overflow-wrap: anywhere; }
.public-data-picker__tags { display: flex; flex-wrap: wrap; gap: .3rem; margin-top: .1rem; }
.public-data-picker__tag { display: inline-flex; align-items: center; min-height: 1.35rem; max-width: 100%; padding: .08rem .42rem; color: var(--color-muted); background: var(--color-surface-hover); border: 1px solid var(--color-line); border-radius: 999px; font-size: .72rem; font-weight: 700; line-height: 1.25; overflow-wrap: anywhere; }
.public-data-picker__tag--available { color: #075f3c; background: #d9f6e8; border-color: #8ad5af; }
.public-data-picker__tag--stopped { color: #8a2e0d; background: #fff0e8; border-color: #f0b394; }
.public-data-picker__meta { color: var(--color-muted); font-size: .76rem; font-weight: 650; line-height: 1.45; overflow-wrap: anywhere; }
.public-data-picker__empty { grid-column: 1 / -1; margin: 0; padding: 1.4rem; color: var(--color-muted); background: var(--color-surface-alt); border: 1px dashed var(--color-line-strong); border-radius: var(--radius-sm); text-align: center; }
.dialog--form-preview { width: min(980px, calc(100vw - 2rem)); }
.dialog--dashboard-print { width: min(1120px, calc(100vw - 2rem)); max-height: min(92dvh, 900px); }
.dialog--dashboard-print form { max-height: min(92dvh, 900px); }
.dialog--document { width: min(980px, calc(100vw - 2rem)); height: min(90dvh, 900px); max-height: none; }
.dialog::backdrop { background: rgb(19 38 30 / 48%); }
.dialog[open] { display: flex; flex-direction: column; }
.dialog form { display: flex; min-height: 0; max-height: min(90dvh, 820px); flex: 1 1 auto; flex-direction: column; }
.dialog__header { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 1.1rem 1.25rem; background: var(--color-surface-alt); border-bottom: 1px solid var(--color-line); }
.dialog__header h2 { margin: 0; font-size: 1.15rem; }
.dialog__body { min-height: 0; padding: 1rem; overflow: auto; }
.dialog__body > p { white-space: pre-line; }
.dialog__body--document { display: flex; flex: 1 1 auto; padding: 0; overflow: hidden; }
.dialog__document-frame { width: 100%; min-width: 0; height: 100%; min-height: 0; background: #f4f6f8; border: 0; }
.dialog__footer { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: .5rem; padding: 1rem 1.25rem; background: var(--color-surface-alt); border-top: 1px solid var(--color-line); }
.dialog__direct-link { margin-right: auto; text-decoration: none; }
.dialog__error { margin-bottom: .85rem; }
.dialog-form-layout { display: grid; grid-template-columns: minmax(240px, 330px) minmax(0, 1fr); gap: 1rem; min-height: 0; }
.dialog-form-settings, .dialog-form-preview { min-width: 0; }
.dialog-form-preview { display: grid; align-content: start; gap: .45rem; }
.dialog-form-preview h3 { margin: 0; font-size: 1rem; }
.dialog-form-preview__body { display: grid; min-width: 0; min-height: 360px; padding: .65rem; background: var(--color-canvas); border: 1px solid var(--color-line); border-radius: var(--radius-sm); }
.dialog-form-preview__body[aria-busy="true"] { opacity: .7; }
.dialog-form-preview__body .dashboard-card--catalog-preview { width: 100%; height: 350px; }
.dashboard-card--catalog-preview .dashboard-card__heading { cursor: default; padding-right: .65rem; }
.dashboard-card--catalog-preview .dashboard-card__body { overflow: hidden; }
.dashboard-card--catalog-preview .dashboard-card__footer { justify-content: flex-start; }
.dashboard-print-layout { display: grid; grid-template-columns: minmax(220px, 280px) minmax(0, 1fr); gap: 1rem; min-height: 0; }
.dashboard-print-settings { min-width: 0; }
.dashboard-print-preview { display: grid; grid-template-rows: auto auto auto minmax(0, 1fr); gap: .4rem; min-width: 0; min-height: 0; }
.dashboard-print-preview__heading { display: flex; align-items: baseline; justify-content: space-between; gap: .75rem; }
.dashboard-print-preview__heading h3 { margin: 0; font-size: 1rem; }
.dashboard-print-preview__heading p, .dashboard-print-preview__status { margin: 0; color: var(--color-muted); font-size: .78rem; }
.dashboard-print-preview__status { min-height: 1.2rem; }
.dashboard-print-preview__error { margin: 0; }
.dashboard-print-preview__viewport { min-height: 260px; max-height: 64vh; overflow: auto; padding: .7rem; background: #66717f; border: 1px solid var(--color-line); border-radius: var(--radius-sm); }
.dashboard-print-preview__pages { display: grid; gap: .8rem; justify-items: center; }
.dashboard-print-preview__page { width: min(100%, 760px); margin: 0; background: #fff; box-shadow: 0 3px 12px rgb(15 23 42 / 35%); }
.dashboard-print-preview__canvas { display: block; width: 100%; height: auto; }
.dashboard-print-preview__page figcaption { padding: .28rem .45rem; color: #475569; background: #fff; font-size: .72rem; text-align: center; }
.feature-table-region { max-width: 100%; border: 1px solid var(--color-line); overflow: auto; }
.feature-table { width: max-content; min-width: 100%; border-collapse: collapse; font-size: .82rem; }
.feature-table caption { padding: .45rem .55rem; color: var(--color-muted); background: var(--color-surface-alt); text-align: left; font-weight: 700; }
.feature-table th, .feature-table td { padding: .35rem .45rem; border: 1px solid var(--color-line); text-align: left; white-space: nowrap; }
.feature-table th > input[type="checkbox"] { margin-right: .4rem; vertical-align: middle; }
.feature-table thead th { position: sticky; z-index: 1; top: 0; background: var(--color-surface-hover); }
.feature-table tbody th { position: sticky; left: 0; background: var(--color-surface-alt); }
.feature-table input { width: 11rem; min-width: 7rem; padding: .35rem .45rem; color: var(--color-text); background: var(--color-surface); border: 1px solid var(--color-line-strong); }
.feature-table-pager { display: flex; align-items: center; justify-content: space-between; gap: .75rem; margin: .75rem 0 .5rem; }
.feature-table-page { color: var(--color-muted); font-size: .82rem; }
.point-selection-table-region { margin-top: .75rem; max-height: min(48dvh, 510px); }
.point-selection-table { min-width: 46rem; }
.point-selection-table__status { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .5rem .75rem; }
.point-selection-table__status .field__help { margin: 0; }
.point-selection-table__select-all { display: inline-flex; align-items: center; gap: .35rem; cursor: pointer; white-space: nowrap; }
.point-selection-table input[type="checkbox"] { width: 1.1rem; min-width: 1.1rem; height: 1.1rem; margin: 0; padding: 0; accent-color: var(--color-primary); }
.point-selection-table__checkbox { width: 1%; text-align: center !important; }
.point-selection-table__name { min-width: 11rem; font-weight: 750; white-space: normal !important; overflow-wrap: anywhere; }
.point-selection-table__id, .point-selection-table__coordinate { font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: .78rem; }
.point-selection-table__empty { padding: .85rem !important; color: var(--color-muted); white-space: normal !important; }
.zone-summary-toolbar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .6rem .9rem; margin: .75rem 0 .2rem; padding: .65rem .75rem; background: var(--color-primary-soft); border: 1px solid var(--color-line); border-radius: var(--radius-sm); }
.zone-summary-toolbar__settings { display: grid; min-width: min(100%, 22rem); gap: .2rem; }
.zone-summary-mode-field { display: inline-flex; align-items: center; flex-wrap: wrap; gap: .45rem; color: var(--color-text); font-weight: 700; }
.zone-summary-mode-field select { min-height: 34px; padding: .25rem .5rem; color: var(--color-text); background: var(--color-surface); border: 1px solid var(--color-line-strong); border-radius: var(--radius-sm); font: inherit; }
.zone-summary-toolbar__actions { display: flex; flex-wrap: wrap; gap: .45rem; }
.zone-summary-display-status { min-height: 1.2rem; margin: .35rem 0; color: var(--color-muted); font-size: .8rem; }
.zone-summary-export-status { min-height: 1.2rem; margin: .35rem 0; color: var(--color-muted); font-size: .8rem; }
.zone-summary-table-region { max-height: min(62dvh, 640px); }
.zone-summary-table { min-width: 64rem; }
.zone-summary-sort-button { display: inline-flex; align-items: center; gap: .2rem; width: 100%; min-height: 34px; padding: .2rem .1rem; color: inherit; background: transparent; border: 0; font: inherit; font-weight: 700; text-align: inherit; cursor: pointer; }
.zone-summary-sort-button:hover { color: var(--color-primary); }
.zone-summary-sort-button:focus-visible { outline: 2px solid var(--color-primary); outline-offset: -2px; }
.zone-summary-table__name { min-width: 9rem; font-weight: 750; white-space: normal !important; overflow-wrap: anywhere; }
.zone-summary-table__id, .zone-summary-table__coordinate { font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: .78rem; }
.maplibregl-ctrl-group button:focus-visible { outline-offset: -3px; }

.drawer-group { border-bottom: 1px solid var(--color-line); }
.drawer-group summary { display: flex; align-items: center; gap: .55rem; min-height: 44px; padding: .55rem .65rem; color: var(--color-text); cursor: pointer; font-weight: 700; list-style-position: inside; }
.drawer-group summary:hover { color: var(--color-primary); background: var(--color-primary-soft); }
.drawer-group summary::marker { color: var(--color-muted); }
.drawer-group__content { display: grid; gap: .2rem; padding: 0 .35rem .65rem 2rem; }
.drawer-action { display: block; min-height: 38px; padding: .45rem .7rem; color: var(--color-text); background: transparent; border-radius: var(--radius-sm); text-align: left; text-decoration: none; }
.drawer-action:hover { color: var(--color-primary); background: var(--color-primary-soft); }
.drawer-related-sites { margin-top: .2rem; border-top: 1px solid var(--color-line); }
.drawer-related-sites summary { display: flex; align-items: center; gap: .55rem; min-height: 38px; padding: .45rem .7rem; color: var(--color-text); cursor: pointer; list-style-position: inside; }
.drawer-related-sites summary:hover { color: var(--color-primary); background: var(--color-primary-soft); }
.drawer-related-sites summary::marker { color: var(--color-muted); }
.drawer-related-sites__content { display: grid; gap: .2rem; padding: 0 0 .35rem .95rem; }
.drawer-related-sites__content .drawer-action { min-height: 36px; padding-block: .4rem; }
.drawer-options { min-width: 0; margin: .35rem 0 .55rem; padding: .35rem .5rem .5rem; border: 1px solid var(--color-line); border-radius: var(--radius-sm); }
.drawer-options legend { padding-inline: .35rem; color: var(--color-muted); font-size: .82rem; font-weight: 700; }
.drawer-option { display: flex; align-items: center; gap: .5rem; min-height: 34px; padding: .25rem .35rem; border-radius: var(--radius-sm); cursor: pointer; }
.drawer-option:hover { background: var(--color-surface-hover); }
.drawer-option input { flex: 0 0 auto; margin: 0; }

.toggle-button { min-width: 82px; min-height: 38px; padding: .4rem .8rem; color: var(--color-muted); background: var(--color-surface); border: 1px solid var(--color-line-strong); font-weight: 700; }
.toggle-button:hover { background: var(--color-surface-hover); }
.toggle-button.is-active, .toggle-button[aria-pressed="true"] { color: #fff; background: var(--color-primary-fill); border-color: var(--color-primary-fill); }

/* Accessible icon actions and a single hover/focus tooltip. */
.button--danger-icon { color: var(--color-danger); }
.button--danger-icon:hover:not(:disabled) { color: #fff; background: var(--color-danger-fill); border-color: var(--color-danger-fill); }
.application-tooltip { position: fixed; z-index: 100; max-width: min(320px, calc(100vw - 16px)); padding: .45rem .65rem; color: var(--color-brand-paper); background: var(--color-brand-ink); border: 1px solid var(--color-line-strong); border-radius: var(--radius-sm); box-shadow: var(--shadow-panel); font-size: .76rem; line-height: 1.5; pointer-events: none; }

@media (max-width: 1120px) {
    .public-data-picker__filters { grid-template-columns: minmax(180px, 1.4fr) repeat(2, minmax(120px, 1fr)); }
    .public-data-picker__filters--advanced { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .public-data-picker__workspace { grid-template-columns: 1fr; }
    .public-data-picker__detail { position: static; }
}

@media (max-width: 700px) {
    .dialog--layer-settings { width: calc(100vw - 1rem); max-height: calc(100dvh - 1rem); }
    .dialog--layer-settings .dialog__header { gap: .5rem; padding: .75rem; }
    .dialog--layer-settings .dialog__header h2 { font-size: 1rem; line-height: 1.35; }
    .dialog--layer-settings .form-progress ol { gap: .4rem; }
    .dialog--layer-settings .form-progress__step { gap: .25rem; font-size: .72rem; }
    .dialog--layer-settings .form-progress__number { flex-basis: 1.35rem; width: 1.35rem; height: 1.35rem; }
    .dialog--layer-settings .form-section { grid-template-columns: 1fr; }
    .dialog--document { width: calc(100vw - 1rem); height: calc(100dvh - 1rem); }
    .dialog--document .dialog__header { padding: .75rem; }
    .dialog--document .dialog__footer { padding: .65rem .75rem; }
    .dialog--dashboard-print { width: calc(100vw - 1rem); max-height: calc(100dvh - 1rem); }
    .dialog--dashboard-print form { max-height: calc(100dvh - 1rem); }
    .dialog--public-data-picker { width: calc(100vw - 1rem); max-height: calc(100dvh - 1rem); }
    .dialog--public-data-picker form { max-height: calc(100dvh - 1rem); }
    .dialog--public-data-picker .dialog__header { gap: .5rem; padding: .75rem; }
    .dialog--public-data-picker .dialog__header h2 { font-size: 1rem; line-height: 1.35; }
    .dialog--public-data-picker .dialog__body { gap: .75rem; padding: .75rem; }
    .public-data-picker__filters { grid-template-columns: 1fr; gap: .6rem; padding: .7rem; }
    .public-data-picker__category { flex: 1 1 auto; padding: .4rem .5rem; font-size: .78rem; }
    .public-data-picker__results-bar { align-items: flex-start; }
    .public-data-picker__detail { padding: .75rem; }
    .public-data-picker__selection-status { flex-basis: 100%; }
    .public-data-picker__cards { grid-template-columns: 1fr; }
    .public-data-picker__card { min-height: 0; padding: .75rem; }
    .dialog--form-preview { width: calc(100vw - 1rem); }
    .dialog-form-layout { grid-template-columns: 1fr; }
    .dialog-form-preview__body { min-height: 300px; }
    .dialog-form-preview__body .dashboard-card--catalog-preview { height: 300px; }
    .dashboard-print-layout { grid-template-columns: 1fr; }
    .dashboard-print-preview__viewport { max-height: 42vh; }
}
.application-tooltip[hidden] { display: none; }
.disabled-tooltip-control { display: inline-flex; border-radius: var(--radius-sm); }

/* Data-management feature and property grids. */
.feature-grid__toolbar { display: grid; grid-template-columns: minmax(280px, 1fr) auto; align-items: center; gap: .55rem .8rem; padding: .65rem .8rem; background: var(--color-surface); border-bottom: 1px solid var(--color-line); }
.feature-grid__search { display: grid; grid-template-columns: auto minmax(120px, 1fr) minmax(130px, auto) auto; align-items: center; gap: .4rem; }
.feature-grid__search input, .feature-grid__search select, .feature-grid__pager select, .feature-grid__pager input { min-height: 38px; padding: .4rem .55rem; color: var(--color-text); background: var(--color-surface); border: 1px solid var(--color-line-strong); }
.feature-grid__result { margin: 0; color: var(--color-muted); font-size: .82rem; white-space: nowrap; }
.feature-grid__actions { grid-column: 1 / -1; display: flex; align-items: center; flex-wrap: wrap; gap: .4rem; }
.feature-grid__actions > :first-child { margin-right: auto; }
.column-selector { position: relative; }
.column-selector > summary { list-style: none; }
.column-selector > summary::-webkit-details-marker { display: none; }
.column-selector__menu { position: absolute; z-index: 5; top: calc(100% + .3rem); right: 0; display: grid; width: min(360px, calc(100vw - 2rem)); max-height: 340px; margin: 0; padding: .7rem; color: var(--color-text); background: var(--color-surface); border: 1px solid var(--color-line-strong); border-radius: var(--radius-md); box-shadow: var(--shadow-panel); overflow-y: auto; }
.column-selector__menu legend { padding-inline: .3rem; font-weight: 700; }
.column-selector__menu label { display: flex; align-items: center; gap: .45rem; min-height: 36px; padding: .25rem; }
.feature-grid__scroll, .property-grid__scroll { min-width: 0; min-height: 0; background: var(--color-surface); border-block: 1px solid var(--color-line); overflow: auto; }
.feature-grid, .property-grid { width: max-content; min-width: 100%; border-collapse: separate; border-spacing: 0; font-size: .8125rem; font-variant-numeric: tabular-nums; }
.feature-grid th, .feature-grid td, .property-grid th, .property-grid td { height: 44px; padding: .3rem .42rem; background: var(--color-surface); border-right: 1px solid var(--color-line); border-bottom: 1px solid var(--color-line); text-align: left; vertical-align: middle; white-space: nowrap; }
.feature-grid thead th, .property-grid thead th { position: sticky; z-index: 3; top: 0; color: var(--color-text); background: var(--color-surface-alt); border-bottom-color: var(--color-line-strong); font-weight: 650; }
.feature-grid thead th small { display: block; color: var(--color-muted); font-size: .66rem; font-weight: 500; }
.feature-grid .grid-sticky { position: sticky; z-index: 2; }
.feature-grid thead .grid-sticky { z-index: 4; }
.grid-sticky--select { left: 0; width: 44px; min-width: 44px; text-align: center !important; }
.grid-sticky--number { left: 44px; width: 58px; min-width: 58px; }
.grid-sticky--feature-id { left: 102px; width: 140px; min-width: 140px; max-width: 140px; overflow: hidden; text-overflow: ellipsis; }
.feature-grid tbody tr:hover td, .feature-grid tbody tr:hover th { background: var(--color-data-soft); }
.feature-grid tbody tr:has(.grid-sticky--select input:checked) > :is(th, td), .feature-grid tbody tr:focus-within > :is(th, td) { background: var(--color-data-soft); }
.feature-grid tbody tr:has(.grid-sticky--select input:checked) > :first-child { box-shadow: inset 3px 0 var(--color-data); }
.feature-grid tbody tr.is-deleted td, .feature-grid tbody tr.is-deleted th { opacity: .58; text-decoration: line-through; }
.feature-grid__empty { height: 120px !important; color: var(--color-muted); text-align: center !important; }
.feature-cell-control, .property-grid input, .property-grid select { min-width: 9rem; min-height: 34px; padding: .34rem .45rem; color: var(--color-text); background: var(--color-surface); border: 1px solid transparent; }
.feature-cell-control:hover { border-color: var(--color-line-strong); }
.feature-cell-control.is-edited { background: var(--color-edited); border-color: var(--color-primary); }
.feature-cell-control[aria-invalid="true"] { background: var(--color-error-soft); border-color: var(--color-danger); }
.json-cell, .coordinate-actions { display: flex; align-items: center; gap: .3rem; }
.json-cell code { display: block; max-width: 11rem; overflow: hidden; text-overflow: ellipsis; }
.coordinate-actions small { max-width: 12rem; color: var(--color-muted); overflow: hidden; text-overflow: ellipsis; }
.feature-grid__pager { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: .55rem; padding: .65rem .8rem; background: var(--color-surface-alt); border-bottom: 1px solid var(--color-line); }
.feature-grid__pager input { width: 4.5rem; }
.data-pending-bar { display: flex; align-items: center; justify-content: space-between; gap: .7rem; padding: .75rem .9rem; background: var(--color-surface); border-top: 2px solid var(--color-primary); }
.data-pending-bar__summary { display: block; }
.data-pending-bar__error { display: block; margin-top: .15rem; color: var(--color-danger); font-size: .78rem; }
.data-pending-bar__error[hidden] { display: none; }
.data-pending-bar__actions, .property-grid__actions { display: flex; gap: .35rem; }
.property-grid__toolbar { display: flex; align-items: center; justify-content: space-between; gap: .7rem; padding: .65rem .8rem; background: var(--color-surface); border-bottom: 1px solid var(--color-line); }
.property-grid__toolbar p { margin: 0; color: var(--color-muted); font-size: .82rem; }
.property-grid input[readonly] { color: var(--color-muted); background: var(--color-surface-alt); border-color: transparent; }
.property-grid td:first-child input { width: 4.5rem; min-width: 4.5rem; }

@media (max-width: 700px) {
    .feature-grid__toolbar { grid-template-columns: minmax(0, 1fr) auto; gap: .35rem .5rem; padding: .45rem .55rem; }
    .feature-grid__search { grid-column: 1 / -1; grid-template-columns: minmax(0, 1fr) minmax(0, .8fr) auto; gap: .35rem; }
    .feature-grid__search > .app-icon { display: none; }
    .feature-grid__search input, .feature-grid__search select { width: 100%; min-width: 0; }
    .feature-grid__result { grid-column: auto; margin: 0; }
    .feature-grid__actions { grid-column: 1 / -1; gap: .25rem; }
    .feature-grid__actions > :first-child { flex: 1 1 auto; margin-right: 0; }
    .feature-grid__pager { gap: .3rem; padding: .35rem .4rem; font-size: .75rem; }
    .feature-grid__pager input { width: 3rem; padding-inline: .3rem; }
    .feature-grid__pager select { padding-inline: .3rem; }
    .data-pending-bar { align-items: stretch; flex-direction: column; gap: .35rem; padding: .4rem .55rem max(.4rem, env(safe-area-inset-bottom)); font-size: .8rem; }
    .data-pending-bar__actions .button { flex: 1; }
    .property-grid__toolbar { align-items: stretch; flex-direction: column; }
    .feature-grid tbody .grid-sticky--feature-id { position: static; }
    .feature-grid thead .grid-sticky--feature-id { left: auto; }
}

/* 地図エンジンの標準操作も、アプリと同じ面・線の強さで表示する。 */
@media (min-width: 361px) and (max-width: 700px) {
    .feature-grid__result { grid-column: 1; grid-row: 2; }
    .feature-grid__actions { grid-column: 2; grid-row: 2; }
}

.maplibregl-ctrl-group { background: var(--color-surface); border: 1px solid var(--color-line-strong); border-radius: var(--radius-sm); box-shadow: var(--shadow-panel); }
.maplibregl-ctrl-group button + button { border-top-color: var(--color-line); }
.maplibregl-ctrl-group button:hover { background-color: var(--color-surface-hover); }
:root[data-theme="dark"] .maplibregl-ctrl-icon { filter: invert(1); }
@media (prefers-reduced-motion: reduce) { .toast { animation: none; } }