/* Shared map only: article headings, characters and transitions stay outside. */
#rk-map-explorer {
    --rk-map-ink: #102449;
    --rk-map-blue: #007ffb;
    --rk-map-category-color: #007ffb;
    position: relative;
    isolation: isolate;
    container-type: inline-size;
    width: 100%; min-width: 0; margin: 0; padding: 0;
    color: var(--rk-map-ink); background: transparent;
    font: 600 14px/1.45 "Article Sans", "Noto Sans JP", "Yu Gothic", Meiryo, sans-serif;
    text-align: left; letter-spacing: normal;
}
#rk-map-explorer *, #rk-map-explorer *::before, #rk-map-explorer *::after { box-sizing: border-box; }
#rk-map-explorer [hidden] { display: none !important; }
#rk-map-explorer .rk-map-controls {
    display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)) 40px;
    align-items: stretch; gap: clamp(4px, 1.4cqw, 10px);
    margin: 0 0 clamp(7px, 2cqw, 14px); padding: 0;
}
#rk-map-explorer .rk-map-category {
    display: flex !important; align-items: center; justify-content: center; gap: clamp(3px, 1.1cqw, 8px);
    position: static !important; float: none !important;
    width: auto !important; height: clamp(40px, 11cqw, 62px) !important; min-height: 0 !important;
    margin: 0 !important; padding: 0 3px !important;
    border: 1px solid #b5c7e6 !important; border-radius: clamp(10px, 2.7cqw, 18px) !important;
    background: #fff !important; color: var(--rk-map-ink) !important;
    box-shadow: none !important; list-style: none; cursor: pointer;
    font: 800 clamp(11px, 3.75cqw, 22px)/1.2 "Article Sans", "Noto Sans JP", "Yu Gothic", Meiryo, sans-serif !important;
    text-align: center !important; white-space: nowrap; text-decoration: none; user-select: none;
}
#rk-map-explorer .rk-map-category-icon { display: flex; flex: 0 0 auto; width: clamp(15px, 5.4cqw, 31px); height: clamp(16px, 5.4cqw, 31px); color: var(--rk-map-category-color); }
#rk-map-explorer .rk-map-category svg { display: block; width: 100%; height: 100%; fill: currentColor; }
#rk-map-explorer .rk-map-category.rk-map-selected { --rk-camera-cutout: var(--rk-map-category-color); background: var(--rk-map-category-color) !important; border-color: var(--rk-map-category-color) !important; color: #fff !important; }
#rk-map-explorer .rk-map-category.rk-map-selected .rk-map-category-icon { color: #fff; }
#rk-map-explorer .rk-map-category > div { display: none !important; }
#rk-map-explorer .rk-map-search-host, #rk-map-explorer .map-search-fallback { display: flex !important; width: 100%; height: 100%; padding: 0 !important; margin: 0 !important; position: static !important; }
#rk-map-explorer .map-search-icon {
    display: flex; flex: 1; width: 100%; min-width: 0; height: 100%; margin: 0; padding: 8px;
    border: 1px solid #b5c7e6; border-radius: clamp(10px, 2.7cqw, 18px); color: var(--rk-map-ink); background: #fff; box-shadow: none;
}
#rk-map-explorer .map-search-icon svg { width: clamp(21px, 5.7cqw, 32px); height: clamp(21px, 5.7cqw, 32px); flex: none; }
#rk-map-explorer .map-search-icon.map-search-filtered { box-shadow: inset 0 0 0 2px var(--rk-map-blue); }
#rk-map-explorer .rk-map-stage {
    --rk-sheet-height: clamp(148px, 40cqw, 230px);
    position: relative; height: clamp(380px, 120cqw, 720px); overflow: hidden;
    border-radius: clamp(12px, 2.8cqw, 20px); background: #edf3f8;
    box-shadow: 0 3px 8px #006db419;
}
#rk-map-explorer #map_latercanvas {
    position: absolute !important; inset: 0 0 auto !important; z-index: 0 !important;
    width: 100% !important; height: calc(100% - var(--rk-sheet-height) + 12px) !important;
    max-width: none !important; margin: 0 !important; border: 0 !important;
    border-radius: 0 !important; font-family: Arial, sans-serif; font-weight: 400;
}
#rk-map-explorer .leaflet-control-zoom { display: none !important; }
#rk-map-explorer .leaflet-control-attribution { max-width: calc(100cqw - 5px); margin: 0; padding: 1px 3px; font: 10px/1.4 Arial, sans-serif; background: #fffffff2; }
#rk-map-explorer .leaflet-marker-icon { max-width: none !important; }
#rk-map-explorer .playplan-pin-number { color: #fff; background: none; border: 0; box-shadow: none; font: 700 12px/1 Arial, sans-serif; padding: 0; }
#rk-map-explorer .playplan-pin-number::before { display: none; }
#rk-map-explorer .rk-map-sheet {
    position: absolute; z-index: 4; inset: auto 0 0; height: var(--rk-sheet-height);
    display: flex; flex-direction: column; min-height: 0; padding: 0;
    background: #fff; border-radius: clamp(16px, 4cqw, 28px) clamp(16px, 4cqw, 28px) 0 0;
    box-shadow: 0 -2px 9px #21496812;
}
#rk-map-explorer .rk-map-grip {
    position: absolute; top: -11px; left: 50%; transform: translateX(-50%); z-index: 5;
    display: grid; place-items: center; width: 44px; height: 20px;
    border-radius: 5px; color: #fff; background: #595957; box-shadow: 0 2px 4px #15253e21;
    cursor: ns-resize; user-select: none; touch-action: none;
}
#rk-map-explorer .rk-map-grip::before { content: ""; position: absolute; inset: -12px -8px; }
#rk-map-explorer .rk-map-grip svg { display: block; width: 27px; height: 19px; fill: currentColor; pointer-events: none; }
#rk-map-explorer .rk-map-list-heading { display: flex; align-items: center; justify-content: space-between; gap: 6px; min-height: clamp(40px, 10cqw, 63px); flex: none; padding: 9px 13px 4px; }
#rk-map-explorer .rk-map-list-title { margin: 0; padding: 0; float: none; border: 0; background: none; font: 850 clamp(13px, 3.85cqw, 23px)/1.3 "Article Sans", "Noto Sans JP", "Yu Gothic", Meiryo, sans-serif; color: var(--rk-map-ink); white-space: nowrap; }
#rk-map-explorer .rk-map-sorts { min-width: 0; flex: none; }
#rk-map-explorer .map-sort-toolbar { position: static !important; width: auto !important; margin: 0; padding: 0; min-height: 0; background: transparent; pointer-events: auto; }
#rk-map-explorer .map-sort-toolbar select {
    display: block; width: clamp(92px, 26cqw, 138px); height: clamp(30px, 7cqw, 42px);
    margin: 0; padding: 3px 24px 3px 9px; border: 1px solid #b5c7e6; border-radius: 10px;
    background: #fff; color: var(--rk-map-ink); font: 600 clamp(12px, 3cqw, 17px)/1.3 "Article Sans", "Noto Sans JP", Meiryo, sans-serif;
}
#rk-map-explorer .rk-map-list-body { flex: 1; min-height: 0; padding: 0 clamp(12px, 3.5cqw, 23px); overflow: auto; overscroll-behavior: contain; scrollbar-width: thin; }
#rk-map-explorer .rk-map-results { position: static !important; float: none !important; width: 100% !important; height: auto !important; min-height: 0 !important; max-height: none !important; margin: 0 !important; padding: 0 !important; border: 0 !important; overflow: visible !important; list-style: none !important; background: none !important; }
#rk-map-explorer .rk-map-results > li {
    position: relative !important; display: grid !important; grid-template-columns: clamp(23px, 7cqw, 40px) clamp(62px, 20cqw, 118px) minmax(0, 1fr) 12px;
    align-items: center; gap: clamp(9px, 2.8cqw, 18px); float: none !important;
    width: 100% !important; height: auto !important; min-height: clamp(53px, 14cqw, 83px); max-height: none !important;
    margin: 0 !important; padding: clamp(4px, 1.3cqw, 8px) 0 !important; border: 0 !important; border-bottom: 1px solid #dce7f2 !important;
    border-radius: 0 !important; background: #fff !important; color: var(--rk-map-ink); box-shadow: none !important;
    text-align: left !important; line-height: 1.4 !important; overflow: visible !important; cursor: pointer;
    font-family: "Article Sans", "Noto Sans JP", "Yu Gothic", Meiryo, sans-serif !important;
}
#rk-map-explorer .rk-map-results > li[hidden] { display: none !important; }
#rk-map-explorer .rk-map-results > li:last-child { border-bottom: 0 !important; }
#rk-map-explorer .rk-map-rank { display: grid; place-items: center; width: clamp(23px, 7cqw, 40px); height: clamp(23px, 7cqw, 40px); border-radius: 50%; background: var(--rk-map-category-color); color: white; font: 800 clamp(14px, 4.1cqw, 23px)/1 Arial, sans-serif; }
#rk-map-explorer .rk-map-thumb { display: grid; place-items: center; width: 100%; height: clamp(42px, 12cqw, 68px); border-radius: clamp(5px, 1.5cqw, 9px); background: #edf4fa; overflow: hidden; color: #7191ac; }
#rk-map-explorer .rk-map-thumb picture { display: block; width: 100%; height: 100%; min-width: 0; min-height: 0; }
#rk-map-explorer .rk-map-thumb img { display: block; float: none; width: 100%; height: 100%; max-width: none; margin: 0; padding: 0; border: 0; object-fit: cover; }
#rk-map-explorer .rk-map-thumb svg { display: block; width: 25px; height: 25px; fill: currentColor; }
#rk-map-explorer .rk-map-name { display: block; min-width: 0; overflow-wrap: anywhere; font-size: clamp(13px, 3.8cqw, 22px); font-weight: 800; line-height: 1.4; }
#rk-map-explorer .rk-map-row-chevron { width: 8px; height: 8px; border-top: 2px solid #8099b6; border-right: 2px solid #8099b6; transform: rotate(45deg); }
#rk-map-explorer .map-search-empty { position: static !important; height: auto !important; width: auto !important; margin: 0 !important; padding: 16px 0; color: #506580; font-size: 13px; }
#rk-map-explorer .rk-map-launcher {
    display: flex; align-items: center; justify-content: center; gap: 10px; width: 100%; height: clamp(38px, 10cqw, 58px);
    margin: clamp(9px, 2.6cqw, 17px) 0 0; padding: 0 12px; border: 0; border-radius: clamp(10px, 2.5cqw, 18px);
    color: #fff; background: var(--rk-map-blue); font: 750 clamp(14px, 3.8cqw, 22px)/1.2 "Article Sans", "Noto Sans JP", Meiryo, sans-serif; cursor: pointer;
}
#rk-map-explorer .rk-map-launcher svg { display: block; width: 22px; height: 22px; }
#rk-map-explorer .rk-map-state { position: absolute; z-index: 2; inset: 22% 12px auto; margin: 0; padding: 14px; background: #ffffffed; color: #425770; border-radius: 10px; font: 500 13px/1.5 Meiryo, sans-serif; text-align: center; }
#rk-map-explorer .rk-map-provider-state { position: absolute; z-index: 2; inset: 12px 12px auto; margin: 0 !important; padding: 9px; border-radius: 8px; background: #ffffffed; font: 500 12px/1.5 Meiryo, sans-serif; text-align: center; pointer-events: none; }
#rk-map-explorer:not(.rk-map-ready) .rk-map-provider-state { display: none !important; }
#rk-map-explorer.rk-map-fullscreen .rk-map-provider-state { top: calc(var(--rk-map-attribution-height, 16px) + env(safe-area-inset-top) + 46px); }
#rk-map-explorer.rk-map-fullscreen { --rk-map-close-width: 32px; }
#rk-map-explorer.rk-map-fullscreen .leaflet-top { top: env(safe-area-inset-top); }
#rk-map-explorer.rk-map-fullscreen .leaflet-top.leaflet-right { right: calc(max(8px, env(safe-area-inset-right)) + var(--rk-map-close-width) + 8px); }
#rk-map-explorer.rk-map-fullscreen .leaflet-control-attribution { max-width: calc(100cqw - max(8px, env(safe-area-inset-left)) - max(8px, env(safe-area-inset-right)) - var(--rk-map-close-width) - 8px); }
#rk-map-explorer :is(button, [role="button"], [role="separator"], select):focus-visible { outline: 3px solid #102449; outline-offset: 2px; }
#rk-map-explorer.rk-map-resizing { cursor: ns-resize; user-select: none; }
#rk-map-explorer.rk-map-fullscreen {
    position: fixed; inset: 0; z-index: 2147483000; width: 100%; height: 100dvh; margin: 0; padding: 0; background: #edf3f8;
}
#rk-map-explorer.rk-map-fullscreen .rk-map-stage { --rk-sheet-height: clamp(210px, 28dvh, 300px); height: 100%; border-radius: 0; box-shadow: none; }
#rk-map-explorer.rk-map-fullscreen .rk-map-controls {
    position: absolute; z-index: 5; top: calc(var(--rk-map-attribution-height, 16px) + env(safe-area-inset-top) + 6px); left: max(8px, env(safe-area-inset-left)); right: auto;
    width: min(353px, calc(100% - max(8px, env(safe-area-inset-left)) - max(8px, env(safe-area-inset-right)) - 37px));
    grid-template-columns: repeat(3, minmax(0, 1fr)) 32px;
    align-items: center; gap: 5px; margin: 0; padding: 0;
}
#rk-map-explorer.rk-map-fullscreen .rk-map-category { height: 34px !important; font-size: clamp(10px, 3cqw, 13px) !important; gap: 3px; padding: 0 2px !important; border-radius: 12px !important; box-shadow: 0 2px 6px #2135521c !important; }
#rk-map-explorer.rk-map-fullscreen .rk-map-category-icon { display: flex; width: 16px; height: 16px; }
#rk-map-explorer.rk-map-fullscreen .rk-map-search-host { height: 32px; }
#rk-map-explorer.rk-map-fullscreen .map-search-icon svg { width: 18px; height: 18px; }
#rk-map-explorer.rk-map-fullscreen .map-search-icon { border-radius: 50%; padding: 7px; box-shadow: 0 2px 6px #2135521c; }
#rk-map-explorer .rk-map-close { display: flex; align-items: center; justify-content: center; gap: 6px; grid-column: 5; width: var(--rk-map-close-width, 32px); height: 32px; padding: 5px; margin: 0; border: 2px solid #fff; border-radius: 9px; background: #102449; color: #fff; cursor: pointer; box-shadow: 0 3px 12px #10244955; font: 700 14px/1.2 "Noto Sans JP", Meiryo, sans-serif; }
#rk-map-explorer .rk-map-close:hover { background: #29466f; }
#rk-map-explorer .rk-map-close-label { display: none; }
#rk-map-explorer.rk-map-fullscreen .rk-map-close { position: fixed; top: max(6px, env(safe-area-inset-top)); right: max(8px, env(safe-area-inset-right)); }
#rk-map-explorer .rk-map-close svg { display: block; flex: none; width: 18px; height: 18px; }
#rk-map-explorer.rk-map-fullscreen .rk-map-list-heading { min-height: 53px; padding: 15px 18px 6px; }
#rk-map-explorer.rk-map-fullscreen .rk-map-list-title { font-size: clamp(16px, 4.4cqw, 23px); }
#rk-map-explorer.rk-map-fullscreen .rk-map-list-body { padding: 0 18px max(8px, env(safe-area-inset-bottom)); }
#rk-map-explorer.rk-map-fullscreen .rk-map-results > li { min-height: 70px; }
@media (min-width: 768px) {
    #rk-map-explorer.rk-map-fullscreen { --rk-map-close-width: 96px; }
    #rk-map-explorer.rk-map-fullscreen .rk-map-close { height: 44px; padding: 8px 10px; border-radius: 12px; }
    #rk-map-explorer.rk-map-fullscreen .rk-map-close-label { display: inline; }
    /* Reserve room for the heading, controls, fixed footer and breathing space.
       The article's measured sticky tabs add to that reserve when present. */
    #rk-map-explorer:not(.rk-map-fullscreen) .rk-map-stage {
        --rk-map-embedded-height: clamp(180px, calc(100vh - var(--chapter-nav-height, 0px) - 360px), 480px);
        --rk-sheet-height: min(210px, calc(var(--rk-map-embedded-height) * .5));
        height: var(--rk-map-embedded-height);
    }
    #rk-map-explorer:not(.rk-map-fullscreen) .rk-map-controls { width: 100%; max-width: 400px; grid-template-columns: repeat(3, minmax(0, 112px)) 40px; gap: 8px; }
    #rk-map-explorer:not(.rk-map-fullscreen) .rk-map-category { height: 42px !important; max-width: 112px; font-size: 14px !important; gap: 5px; border-radius: 12px !important; }
    #rk-map-explorer:not(.rk-map-fullscreen) .rk-map-category-icon { width: 18px; height: 18px; }
    #rk-map-explorer:not(.rk-map-fullscreen) .rk-map-search-host { height: 42px !important; }
    #rk-map-explorer:not(.rk-map-fullscreen) .map-search-icon { align-items: center; justify-content: center; max-width: 40px; max-height: 42px; padding: 8px; border-radius: 12px; }
    #rk-map-explorer:not(.rk-map-fullscreen) .map-search-icon svg { width: 20px; height: 20px; }
    #rk-map-explorer:not(.rk-map-fullscreen) .rk-map-launcher { height: 44px; max-height: 44px; font-size: 16px; border-radius: 12px; }
    #rk-map-explorer:not(.rk-map-fullscreen) .rk-map-launcher svg { width: 18px; height: 18px; }
    #rk-map-explorer.rk-map-fullscreen .rk-map-sheet { left: max(16px, env(safe-area-inset-left)); right: auto; bottom: 16px; width: 460px; border-radius: 20px; }
    #rk-map-explorer.rk-map-fullscreen #map_latercanvas { height: 100% !important; }
    #rk-map-explorer .rk-map-sheet .rk-map-list-heading { min-height: 48px; padding: 9px 12px 5px; }
    #rk-map-explorer .rk-map-sheet .rk-map-list-title { font-size: 16px; }
    #rk-map-explorer .rk-map-sheet .map-sort-toolbar select { width: 102px; height: 32px; font-size: 13px; border-radius: 8px; }
    #rk-map-explorer .rk-map-sheet .rk-map-list-body { padding: 0 12px 8px; }
    #rk-map-explorer .rk-map-sheet .rk-map-name { font-size: 15px; }
    #rk-map-explorer .rk-map-sheet .rk-map-results > li { grid-template-columns: 28px 64px minmax(0, 1fr) 8px; min-height: 64px !important; gap: 10px; padding: 6px 0 !important; }
    #rk-map-explorer .rk-map-sheet .rk-map-rank { width: 28px; height: 28px; font-size: 16px; }
    #rk-map-explorer .rk-map-sheet .rk-map-thumb { height: 44px; }
    /* Keep the bottom sheet on narrow maps even inside a desktop page. */
    @container (min-width: 600px) {
        #rk-map-explorer:not(.rk-map-fullscreen) .rk-map-sheet { left: 12px; right: auto; bottom: 12px; width: min(360px, calc(100% - 296px)); border-radius: 16px; }
        #rk-map-explorer:not(.rk-map-fullscreen) #map_latercanvas { height: 100% !important; }
    }
}
@container (max-width: 300px) {
    #rk-map-explorer:not(.rk-map-fullscreen) .rk-map-controls { grid-template-columns: repeat(3, minmax(0, 1fr)) 34px; gap: 4px; }
    #rk-map-explorer:not(.rk-map-fullscreen) .rk-map-category { font-size: 11px !important; gap: 2px; padding: 0 1px !important; }
    #rk-map-explorer:not(.rk-map-fullscreen) .rk-map-category-icon { width: 13px; height: 15px; }
    #rk-map-explorer:not(.rk-map-fullscreen) .rk-map-list-heading { padding-inline: 9px; }
    #rk-map-explorer:not(.rk-map-fullscreen) .rk-map-list-title { font-size: 12px; }
}
@media (prefers-reduced-motion: reduce) { #rk-map-explorer * { scroll-behavior: auto; } }

/* Directory filters use the common search dialog, without legacy sidebar styles. */
.map-search-dialog .map-directory-field { display:flex; flex-direction:column-reverse; align-items:stretch; width:100%; gap:6px; }
.map-search-dialog .map-directory-field input { width:100%; min-width:0; box-sizing:border-box; padding:9px; border:1px solid #cbd7e4; border-radius:6px; }
.rk-map-directory { width:100%; clear:both; }
