:root {
    color-scheme: dark;
    --ui-bg: #0d100e;
    --ui-panel: #111512;
    --ui-line: #29302a;
    --ui-line-hot: #414b43;
    --ui-text: #dce0dc;
    --ui-muted: #818981;
    --ui-accent: #76e397;
}

html, body { background: #0a0b0a; font-family: ui-monospace, "Cascadia Code", "SFMono-Regular", Consolas, monospace; }
button, input { font-family: inherit; }
button:focus-visible, input:focus-visible { outline: 1px solid var(--ui-accent); outline-offset: 2px; }
.leaflet-control-zoom { box-shadow: none; }
.leaflet-control-zoom a { border-color: var(--ui-line) !important; border-radius: 0 !important; background: rgba(13, 16, 14, .96) !important; color: var(--ui-text) !important; }
.leaflet-container a { color: var(--ui-accent); -webkit-tap-highlight-color: transparent; }
.leaflet-zoom-box { border-color: var(--ui-accent); background: rgba(118, 227, 151, .08); }
.map-menu { top: 10px; left: 10px; width: 360px; max-width: calc(100vw - 70px); max-height: calc(100vh - 20px); border-color: var(--ui-line); border-radius: 7px; background: #0d100e; color: var(--ui-text); box-shadow: 0 14px 45px rgba(0, 0, 0, .4); backdrop-filter: none; }
.map-menu.is-closed { width: 42px; height: 42px; }
.map-menu-header { min-height: 42px; padding: 6px; gap: 7px; border-bottom: 1px solid var(--ui-line); background: transparent; }
.map-menu-toggle { width: 29px; height: 29px; border: 1px solid var(--ui-line); border-radius: 4px; background: var(--ui-panel); color: var(--ui-muted); }
.map-menu-toggle:hover { border-color: var(--ui-line-hot); background: #171c18; color: var(--ui-text); }
.map-menu-title { font-size: 10px; letter-spacing: .09em; text-transform: uppercase; }
.map-menu-body { max-height: calc(100vh - 62px); padding: 6px; scrollbar-color: #3a433c #101311; }
.menu-group { margin-bottom: 5px; border: 1px solid #202521; border-radius: 5px; background: #0f120f; }
.menu-group-header { padding: 8px; background: #141815; color: var(--ui-text); font-size: 10px; letter-spacing: .03em; }
.menu-category { border-color: #202521; }
.menu-category-header { min-height: 42px; padding-top: 7px; padding-bottom: 7px; color: var(--ui-text); }
.menu-category-header:hover, .menu-location-row:hover { background: #171b18; }
.menu-name { color: #cfd5cf; font-size: 10px; }
.menu-count { color: var(--ui-muted); font-size: 9px; }
.small-button { height: 27px; border-color: var(--ui-line); border-radius: 4px; background: #161a17; color: #bfc6c0; font-size: 9px; }
.small-button:hover { border-color: #516055; background: #1a201b; color: var(--ui-accent); }
.menu-location-row { border-radius: 3px; }
.menu-location-main { font-size: 10px; }
.status-toggle { border-color: #3a423b; background: #121612; }
.status-toggle.is-completed { border-color: #4d805b; background: rgba(118, 227, 151, .12); }

.modal-backdrop, .sync-busy-overlay { background: rgba(0, 0, 0, .74); backdrop-filter: blur(4px); }
.sync-modal, .sync-busy-box, .sync-toast { border-color: var(--ui-line); border-radius: 7px; background: #0f120f; color: var(--ui-text); box-shadow: 0 20px 60px rgba(0, 0, 0, .56); }
.sync-modal-header { border-color: var(--ui-line); background: #131713; font-size: 11px; letter-spacing: .05em; text-transform: uppercase; }
.sync-note { color: var(--ui-muted); }
.sync-input, .custom-select-button { min-height: 40px; border-color: #303731; border-radius: 5px; background: #0a0c0a; color: var(--ui-text); font-size: 11px; }
.custom-select-menu { border-color: #343c35; border-radius: 5px; background: #101310; box-shadow: 0 12px 30px rgba(0, 0, 0, .48); }
.custom-select-option { color: #b8c0b9; font-size: 10px; }
.custom-select-option:hover, .custom-select-option.is-selected { background: rgba(118, 227, 151, .08); color: var(--ui-accent); }
.sync-modal-actions { border-color: var(--ui-line); }
.popup-button, .image-viewer-button { border-color: var(--ui-line); border-radius: 4px; background: #171b18; color: var(--ui-text); font-size: 10px; }
.popup-button:hover, .image-viewer-button:hover { border-color: #4d5a50; background: #1c221d; }
.image-viewer { background: rgba(0, 0, 0, .86); }
.image-viewer-shell { border-color: var(--ui-line); border-radius: 7px; background: #0e110f; }
.image-viewer-toolbar { border-color: var(--ui-line); background: #121612; }
.popup { border-radius: 5px; }
.leaflet-popup-content-wrapper, .leaflet-popup-tip { box-shadow: none; }
* { scrollbar-width: thin; scrollbar-color: #394139 #0d100e; }

@media (max-width: 560px) {
    .map-menu { top: 7px; left: 7px; width: calc(100vw - 57px); max-width: none; max-height: calc(100vh - 14px); }
    .map-menu-body { max-height: calc(100vh - 56px); }
    .leaflet-top.leaflet-right { top: 7px; right: 7px; }
}
@media (prefers-reduced-motion: reduce) { * { transition: none !important; animation-duration: .01ms !important; } }