/* Shared site artwork: slate panels, gold ornament and silver stone buttons. */
:root{color-scheme:dark;--gold:#e6c37b;--ink:#171b19;--line:#987d4d;--muted:#c3baa6;font-family:"Noto Serif JP","Yu Mincho",Meiryo,serif}
html{background:#151b20;scroll-padding-top:64px}body{background:#151b20 url('battle-stone-background.webp') center/cover fixed no-repeat;color:#f5ecd8;min-height:100vh}
.site-banner{background:#fff;color:#143a56;border-bottom:1px solid #d0dfe7;font-family:"Yu Gothic UI",Meiryo,sans-serif}
.site-banner-inner{display:flex;align-items:center;gap:12px;padding:12px 24px;min-height:150px;max-width:1800px;margin:auto;overflow:hidden}
.site-brand{position:relative;z-index:1;display:flex;align-items:center;gap:11px;color:#143a56;text-decoration:none;flex-shrink:0}
.site-brand>img{width:144px;height:96px;object-fit:contain}.site-brand>span{display:grid;gap:3px}.site-brand strong{font-family:Georgia,"Yu Mincho",serif;font-size:20px;font-weight:700;letter-spacing:.04em}.site-brand small{font-size:15px;font-weight:600;letter-spacing:.06em;color:#53738a}
.site-banner-art{align-self:stretch;flex:1;min-width:0;position:relative;margin:-12px 0;overflow:hidden}.site-banner-art img{height:100%;width:auto;position:absolute;right:0;top:0;max-width:none;clip-path:inset(0 0 0 4px);mask-image:linear-gradient(to right,transparent,#000 12%,#000 92%,transparent)}
.site-affinities{display:flex;align-items:center;gap:8px;flex-shrink:0}.site-affinities img{height:96px;width:auto}
.site-menu{position:sticky;top:0;z-index:20;background:#fff;color:#25465d;border-bottom:1px solid #ccdce7;box-shadow:0 3px 12px #163c5a18;font-family:"Yu Gothic UI",Meiryo,sans-serif}
.site-menu-inner{display:flex;align-items:stretch;max-width:1800px;margin:auto;padding:0 24px;min-height:52px}.site-menu a{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:0;min-width:138px;padding:8px 20px;border-bottom:3px solid transparent;line-height:1.15;font-size:14px;font-weight:700;text-decoration:none;color:#25465d;white-space:nowrap}.site-menu a:hover,.site-menu a.current{background:#edf5f6;border-bottom-color:#159aa9;color:#087b78}.site-menu a small{font-size:10px}.site-menu-version{margin:auto 0 auto auto;font:700 11px monospace;color:#6f8799;white-space:nowrap;padding-left:16px}
.map-heading{padding:24px 28px 18px;max-width:1660px;margin:auto;border:0;background:none;text-shadow:0 2px 5px #000}.map-heading .eyebrow{color:#d8b977;font-size:10px;letter-spacing:.17em}.map-heading h1{font-family:"Noto Serif JP","Yu Mincho",serif;font-size:26px;letter-spacing:.045em;margin:7px 0 8px;color:#f5e7c7;font-weight:600}.map-town-name{font-size:18px;margin-left:14px;color:#e8d1a1}.pill{border-color:#987d4d;color:#e6c37b;background:#171b19aa}.map-heading p{color:#d2c8b3;font-family:Meiryo,sans-serif}
main{width:calc(100% - 48px);max-width:1604px;margin:0 auto 32px;grid-template-columns:310px minmax(0,1fr);height:calc(100dvh - 190px);min-height:660px;gap:16px}
aside,.map-section,.detail{position:relative;background:linear-gradient(125deg,#fff5da09,transparent 45%,#0000001f),rgba(24,25,25,.82);border:1px solid transparent;border-radius:4px;box-shadow:0 5px 18px #0005;isolation:isolate}
aside::after,.map-section::after,.detail::after{content:"";position:absolute;inset:0;pointer-events:none;z-index:6;background-image:url('clean-corner-tl.webp'),url('clean-corner-tr.webp'),url('clean-corner-bl.webp'),url('clean-corner-br.webp'),url('original-frame-top.webp'),url('original-frame-bottom.webp'),url('original-frame-left.webp'),url('original-frame-right.webp');background-size:43px 43px,43px 43px,43px 43px,43px 43px,calc(100% - 86px) 8px,calc(100% - 86px) 8px,8px calc(100% - 86px),8px calc(100% - 86px);background-position:left top,right top,left bottom,right bottom,center top,center bottom,left center,right center;background-repeat:no-repeat}
aside{padding:24px 19px;overflow:auto;scrollbar-color:#987d4d #171b19}aside::after{position:fixed;display:none}/* Scrolling content must not carry its frame away. */
aside{border:1px solid #987d4d;box-shadow:inset 0 0 0 3px #171b19,inset 0 0 0 4px #987d4d66,0 5px 18px #0005}
h2{font-size:17px;color:#f5e7c7;letter-spacing:.045em;font-weight:600;background:url('original-line.webp') center bottom/100% 12px no-repeat;padding-bottom:15px;margin-bottom:14px}
.search{background:rgba(15,17,17,.75);border-color:#987d4d;color:#f4ecd9;border-radius:4px;font:12px Meiryo,sans-serif;padding:11px}.search:focus{outline:2px solid #f4d38d;outline-offset:2px}.search::placeholder{color:#b9b19e}.progress{color:#d2c8b3;font-size:12px}progress{accent-color:#d6b36c}
.filter{background:#11141466;border-color:#987d4d88;color:#f5ecd8;border-radius:4px;min-height:54px}.filter:has(input:checked){background:linear-gradient(110deg,#e6c37b12,transparent),#11141466}.filter:hover{border-color:#e6c37b}.filter b{color:#dac698}.filter input,.toggle input,.check input{accent-color:#d6b36c}.toggle,.note{color:#c3baa6}.note,.result small,.detail p,.status{font-family:Meiryo,sans-serif}.footer-note{border-top-color:#987d4d66}
.result{background:rgba(17,20,20,.5);border-color:#987d4d88;color:#f5ecd8;border-radius:4px}.result:hover,.result.selected{border-color:#e6c37b;background:linear-gradient(110deg,#cda65f23,transparent),#171b19}.result small{color:#c3baa6}.result.selected{box-shadow:inset 3px 0 #e6c37b}
.toolbar{height:60px;background:rgba(24,25,25,.9);border-bottom-color:#987d4d88;padding:12px 18px;z-index:3}.toolbar .hint{color:#c3baa6;font:11px Meiryo,sans-serif}
.toolbar button,.detail .close{border:5px solid transparent;border-image:url('original-button-silver.webp') 10 fill / 8px / 0 stretch;background:none;border-radius:4px;color:#f4efdd;box-shadow:0 2px 4px #0008;text-shadow:0 1px 2px #000;line-height:1.4;min-width:38px;min-height:34px;padding:3px 10px}.toolbar button:hover,.detail .close:hover{border-image-source:url('original-button-gold.webp');color:#ffe4a4}.toolbar button:focus-visible{outline:2px solid #f4d38d;outline-offset:2px}
.viewport{background-color:#26343a;background-image:radial-gradient(#b6b5a718 1px,transparent 1px);background-size:22px 22px;min-height:450px}.status{background:#101514b8;color:#d9cfb8;border:1px solid #987d4d66;border-radius:3px;padding:5px 8px;left:18px;bottom:15px}
.detail{position:absolute;right:20px;bottom:20px;background:linear-gradient(125deg,#fff5da09,transparent 45%),#181919f5;border:1px solid transparent;padding:25px 23px;z-index:8}.detail h3{color:#f5e7c7;font-weight:600}.detail p{color:#d2c8b3}.detail small{color:#e6c37b}.detail .close{right:12px;top:12px;padding:0 7px;font-size:20px;min-height:30px;min-width:30px}.check{background:#d6b36c16;border:1px solid #987d4d88;color:#f5ecd8;border-radius:4px;font-size:12px}
@media(max-width:1100px){.site-brand>img{width:110px;height:74px}.site-brand strong{font-size:16px}.site-brand small{font-size:12px}.site-affinities img{height:64px}.site-menu a{min-width:110px;padding:8px 14px}main{grid-template-columns:290px minmax(0,1fr);gap:12px}.toolbar .hint{display:none}}
@media(max-width:760px){.site-banner-inner{padding:8px 10px;min-height:100px;gap:5px}.site-brand{gap:5px}.site-brand>img{width:60px;height:40px}.site-brand>span{width:96px}.site-brand strong{font-size:11px}.site-brand small{font-size:10px}.site-banner-art{margin:-8px 0}.site-affinities{gap:2px}.site-affinities img{height:42px}.site-menu-inner{padding:0 6px;min-height:48px;overflow-x:auto}.site-menu a{min-width:72px;padding:8px 8px;font-size:11px}.site-menu-version{display:none}.map-heading{padding:20px 16px 14px}.map-heading h1{font-size:22px}.map-town-name{font-size:15px;margin-left:8px}.pill{font-size:9px}.map-heading p{font-size:11px}main{display:flex;flex-direction:column;width:calc(100% - 24px);height:auto;min-height:0;gap:14px;margin-bottom:20px}aside{padding:22px 16px;overflow:visible}.filters{grid-template-columns:1fr 1fr;gap:7px}.filter{font-size:11px;padding:7px;min-height:54px}.results{max-height:210px}.map-section{height:75dvh;min-height:540px}.toolbar{padding:12px 16px}.detail{right:16px;bottom:16px;width:min(360px,calc(100% - 32px))}.footer-note{display:block}.map-heading .pill{display:none}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

/* Match the site's recipe-selection stone badges. */
.filter,.filter:has(input:checked){border:5px solid transparent;border-image:url('original-button-silver.webp') 10 fill / 8px / 0 stretch;background:none;border-radius:4px;box-shadow:0 2px 4px #0008;text-shadow:0 1px 2px #000;min-height:54px;padding:6px 4px;color:#f4efdd}
.filter:has(input:checked){border-image-source:url('original-button-gold.webp');color:#ffe4a4}
.filter:hover{filter:brightness(1.15)}
.filter:focus-within{outline:2px solid #f4d38d;outline-offset:2px}

/* Larger map fishing and shop badges, centered on their existing positions. */
.marker[data-kind="fish"],.marker[data-kind^="shop-"]{width:48px;height:48px;margin:-24px 0 0 -24px}
.marker[data-kind="fish"] .game-icon,.marker[data-kind^="shop-"] .game-icon{width:48px;height:48px}

.list-filter-heading{font-size:13px;color:#e8d1a1;margin:18px 0 9px;letter-spacing:.05em}
.list-filters{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:4px;margin-bottom:12px}
.list-filter-button{display:grid;place-items:center;min-width:0;height:43px;padding:0;border:5px solid transparent;border-image:url('original-button-silver.webp') 10 fill / 8px / 0 stretch;background:none;border-radius:4px;color:#f4efdd;font-size:10px;box-shadow:0 2px 4px #0008}
.list-filter-button[aria-pressed="true"]{border-image-source:url('original-button-gold.webp');color:#ffe4a4}
.list-filter-button:hover{filter:brightness(1.15)}.list-filter-button:focus-visible{outline:2px solid #f4d38d;outline-offset:2px}
.list-filter-button .legend-icon{width:30px;height:30px}.list-filter-button .gather{mix-blend-mode:screen;filter:brightness(1.25) drop-shadow(0 0 4px #39d8ff)}

.list-gather.marker{position:relative;width:38px;height:38px;margin:0;pointer-events:none;left:auto;top:auto;flex-shrink:0}
.list-gather.marker:after{display:none}
.result .symbol .list-gather:not(.seen) img.game-icon{width:32px;height:40px;filter:brightness(1.25) drop-shadow(0 0 5px #d2ffff) drop-shadow(0 0 9px #39d8ff) drop-shadow(0 0 15px #08b9ff)}
.result .symbol .list-gather.seen img.game-icon{width:24px;height:30px}

/* Optical centering for the request glyph's transparent top padding. */
.filter > .legend-icon.request,.list-filter-button > .legend-icon.request{position:relative;top:-3px}

.list-filter-button .list-gather.marker,.result .symbol .list-gather.marker{top:-3px}

.map-item-link{color:#edcb83;text-decoration:underline;text-underline-offset:3px}.map-item-link:hover{color:#fff0c5}.map-item-link:focus-visible{outline:2px solid #f4d38d;outline-offset:3px}

/* Keep the same sparkle shape and animation, with warm light for quest pickups. */
.marker.quest-glow{filter:sepia(1) saturate(3.5) hue-rotate(345deg)}

.map-select-label{display:block;color:#d2c8b3;font-size:12px;margin-bottom:7px}
#map-select{display:block;width:100%;min-width:0;margin:0 0 14px;min-height:42px;padding:5px 30px 5px 10px;border:5px solid transparent;border-image:url('original-button-silver.webp') 10 fill / 8px / 0 stretch;background:#171b19 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M0 1h12L6 7z' fill='%23ead3a1'/%3E%3C/svg%3E") right 10px center/12px 8px no-repeat;appearance:none;color:#f5ecd8;border-radius:4px;font:14px "Yu Mincho",serif}
#map-select option{background:#202321;color:#f5ecd8}

.toolbar{height:auto;min-height:64px;align-items:center;flex-wrap:wrap;gap:8px}
.toolbar>button{flex:none}.toolbar .map-toolbar-note{flex:1;min-width:180px;margin:0 0 0 10px;font:10px/1.8 Meiryo,sans-serif;color:#d2c8b3}
.map-hide-toggle{position:absolute;top:76px;left:20px;z-index:7;margin:0;padding:8px 11px;background:#181919e6;border:1px solid #987d4d99;border-radius:4px;box-shadow:0 2px 8px #0005;font:11px/1.5 Meiryo,sans-serif;cursor:pointer}
@media(max-width:760px){.toolbar{min-height:94px}.toolbar .map-toolbar-note{flex-basis:100%;min-width:0;margin:0}.map-hide-toggle{top:108px;left:16px}}

/* Outlined dropdown indicator, inset from the decorative frame. */
#map-select{padding-right:34px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='12' viewBox='0 0 14 12'%3E%3Cpath d='M1.5 2h11L7 10z' fill='none' stroke='%23ead3a1' stroke-width='1.5' stroke-linejoin='round'/%3E%3C/svg%3E");background-position:right 9px center;background-size:14px 12px;background-repeat:no-repeat}

.map-select-wrap{position:relative;margin-bottom:14px}
.map-select-wrap #map-select{margin-bottom:0;background-image:none;padding-right:38px}
.map-select-arrow{position:absolute;right:14px;top:50%;transform:translateY(-50%);z-index:1;pointer-events:none;color:#ead3a1;font:18px/1 Arial,sans-serif;text-shadow:0 1px 2px #000}

.map-select-arrow{color:#fff;font-size:16px}

/* Match the site's compact pale-gold select triangle without font-dependent glyphs. */
.map-select-arrow{right:14px;top:50%;width:0;height:0;border-left:6px solid transparent;border-right:6px solid transparent;border-top:7px solid #ead3a1;transform:translateY(-50%);font-size:0;line-height:0;text-shadow:none}

.map-levels{display:flex;flex-wrap:wrap;align-items:center;gap:7px;padding:9px 18px;background:#181919e6;border-bottom:1px solid #987d4d88;flex:none}
.map-levels[hidden]{display:none}.map-levels button{min-height:34px;padding:4px 15px;border:5px solid transparent;border-image:url('original-button-silver.webp') 10 fill / 8px / 0 stretch;background:none;color:#f4efdd;border-radius:4px;font-size:12px;line-height:1.4;box-shadow:0 2px 4px #0008}
.map-levels button[aria-pressed="true"]{border-image-source:url('original-button-gold.webp');color:#ffe4a4}.map-levels button:hover{filter:brightness(1.15)}
.map-canvas{position:relative;flex:1;min-height:0;display:flex;flex-direction:column}.map-canvas .viewport{min-height:0}.map-canvas .map-hide-toggle{top:12px}
@media(max-width:760px){.map-levels{gap:5px;padding:8px 14px}.map-levels button{padding:4px 10px;font-size:11px}}

.map-overlay-controls{position:absolute;left:20px;right:20px;top:12px;z-index:7;display:flex;align-items:center;flex-wrap:wrap;gap:8px;pointer-events:none}
.map-overlay-controls>.map-hide-toggle{position:static;top:auto;left:auto;flex:none;margin:0;pointer-events:auto}
.map-overlay-controls>.map-levels{padding:0;background:none;border:0;gap:6px;pointer-events:auto}
@media(max-width:760px){.map-overlay-controls{left:16px;right:16px;gap:6px}.map-overlay-controls>.map-levels{padding:0}}

.toolbar .map-toolbar-note{font-size:12px;line-height:1.8}

/* Distinct selected destination, including arrivals from item-page links. */
#markers .marker.selected{z-index:10;outline:3px solid #ce7cff;outline-offset:5px;background:#2e1d40d9;box-shadow:0 0 0 3px #21172d,0 0 22px #be6cf099}
#markers .marker.selected.quest-glow{filter:none}
.selection-beacon{display:none;position:absolute;inset:-10px;border:2px solid #dda0ff;border-radius:50%;pointer-events:none}
#markers .marker.selected .selection-beacon{display:block;animation:selected-location-ripple 1.8s ease-out infinite}
#markers .marker.selected .selection-beacon::after{content:'選択中';position:absolute;left:50%;top:-27px;transform:translateX(-50%);white-space:nowrap;padding:3px 7px;border:1px solid #dda0ff;border-radius:4px;background:#2e1942f2;color:#faf3ff;font:700 11px/1.3 Meiryo,sans-serif;text-shadow:0 1px 2px #000}
#markers .marker[data-kind="chest"].selected{outline:none;background:transparent;box-shadow:none}
#markers .marker[data-kind="chest"].selected::before{border-color:#ce7cff;border-width:3px;background:#2e1d4099;box-shadow:0 0 20px #be6cf099}
#markers .marker[data-kind="chest"].selected .selection-beacon{left:-3px;right:-14px}
@keyframes selected-location-ripple{0%{box-shadow:0 0 0 0 #ce7cff99}80%,100%{box-shadow:0 0 0 22px #ce7cff00}}
@media(prefers-reduced-motion:reduce){#markers .marker.selected .selection-beacon{animation:none;box-shadow:0 0 12px #ce7cff77}}

/* Keep quest-item light warm while leaving the selection ring purple. */
#markers .marker.selected.quest-glow .game-icon{filter:brightness(1.25) drop-shadow(0 0 5px #d2ffff) drop-shadow(0 0 9px #39d8ff) drop-shadow(0 0 15px #08b9ff) sepia(1) saturate(3.5) hue-rotate(345deg)}
#markers .marker.selected.quest-glow::before,#markers .marker.selected.quest-glow .mote{filter:sepia(1) saturate(3.5) hue-rotate(345deg)}

.marker[data-kind="enemy"] .game-icon{width:32px;height:32px;filter:drop-shadow(0 0 3px #ff9a7a) drop-shadow(0 2px 2px #000)}

/* Larger aura makes enemy encounters easy to find on the map. */
#markers .marker[data-kind="enemy"]::before{content:"";position:absolute;left:50%;top:50%;width:64px;height:64px;transform:translate(-50%,-50%);border-radius:50%;pointer-events:none;z-index:-1;background:radial-gradient(circle,rgba(255,231,194,.78) 0%,rgba(255,157,108,.56) 23%,rgba(238,105,77,.31) 44%,rgba(238,105,77,.09) 62%,transparent 74%)}
#markers .marker[data-kind="enemy"] .game-icon{filter:drop-shadow(0 0 3px #ffefd1) drop-shadow(0 0 7px #ff9a70) drop-shadow(0 2px 2px #000)}
#markers .marker[data-kind="enemy"].selected::before{background:radial-gradient(circle,rgba(244,215,255,.7),rgba(206,124,255,.42) 32%,rgba(190,108,240,.14) 58%,transparent 74%)}

/* Prominent area/floor selection down the left side of the map. */
.map-overlay-controls>.map-levels{position:absolute;left:0;top:54px;display:flex;flex-direction:column;align-items:stretch;flex-wrap:nowrap;gap:10px;width:210px;max-height:calc(100dvh - 330px);overflow-y:auto;scrollbar-width:thin;padding:3px 5px 7px 0}
.map-overlay-controls>.map-levels[hidden]{display:none}
.map-overlay-controls>.map-levels button{width:100%;min-height:56px;padding:10px 16px;font-size:15px;font-weight:bold;line-height:1.5;text-align:center;box-shadow:0 3px 9px #000b}
.map-overlay-controls>.map-levels button[aria-pressed="true"]{color:#fff0c4;filter:brightness(1.12);box-shadow:0 0 12px #dba84e55,0 3px 9px #000b}
@media(max-width:760px){.map-overlay-controls>.map-levels{width:165px;top:50px;gap:8px;max-height:calc(75dvh - 120px)}.map-overlay-controls>.map-levels button{min-height:48px;padding:8px 10px;font-size:13px}}

/* Match the map/detail text typeface; preserve existing colors and sizes. */
aside,aside button,aside input,aside #map-select,aside .note,aside .result small{font-family:Meiryo,sans-serif}

/* Sidebar text matches the detail paragraph: 12px, regular weight. */
aside,aside h2,aside .map-select-label,aside #map-select,aside .search,aside .progress,aside .filter,aside .filter b,aside .list-filter-heading,aside .list-filter-button,aside .result,aside .result small,aside .note,aside .empty{font-size:12px;font-weight:400}

/* Match sidebar labels to the area-selection button text. */
aside,aside h2,aside .map-select-label,aside #map-select,aside .search,aside .progress,aside .filter,aside .filter b,aside .list-filter-heading,aside .list-filter-button,aside .result,aside .result small,aside .note,aside .empty{font-family:Meiryo,sans-serif;font-size:15px;font-weight:700}
.map-overlay-controls>.map-levels button{font-family:Meiryo,sans-serif;font-size:15px;font-weight:700}
@media(max-width:760px){aside,aside h2,aside .map-select-label,aside #map-select,aside .search,aside .progress,aside .filter,aside .filter b,aside .list-filter-heading,aside .list-filter-button,aside .result,aside .result small,aside .note,aside .empty,.map-overlay-controls>.map-levels button{font-size:13px}}

/* Primary starting action for first-time map visitors. */
.map-select-feature{position:relative;margin:0 -5px 18px;padding:15px 12px 13px;border:1px solid #dfbd73;border-radius:6px;background:radial-gradient(ellipse at top left,#eac87922,transparent 75%),#1b1e1de8;box-shadow:inset 0 0 0 3px #cba96114,0 0 18px #d7ad5520}
aside .map-select-feature .map-select-label{display:flex;align-items:center;gap:9px;margin:0 0 12px;font-size:16px;font-weight:700;color:#f5ecd8}
.map-select-step{display:inline-grid;place-items:center;width:25px;height:25px;flex:none;border:1px solid #edcf88;border-radius:50%;background:#705127;color:#fff0c7;font-size:14px;box-shadow:0 0 9px #eac87933}
aside .map-select-feature #map-select{min-height:56px;margin-bottom:0;padding:10px 32px 10px 12px;font-size:16px;font-weight:700;border-image-source:url('original-button-gold.webp');box-shadow:0 2px 8px #0009,0 0 12px #ddb65c22;cursor:pointer}
.map-select-feature .map-select-wrap{margin:0}.map-select-feature:focus-within{outline:2px solid #ffe0a0;outline-offset:3px;box-shadow:0 0 22px #edc87944}.map-select-feature #map-select:hover{filter:brightness(1.15)}

.map-welcome-spot{position:fixed;z-index:1000;pointer-events:none;border:2px solid #ffe2a1;border-radius:9px;box-shadow:0 0 0 200vmax #000b,0 0 26px #efc87999}
.map-welcome-tip{position:fixed;z-index:1001;padding:18px;background:#1b201f;border:1px solid #d9b66e;border-radius:7px;color:#f5ecd8;box-shadow:0 8px 32px #000a;font:14px/1.8 Meiryo,sans-serif}.map-welcome-tip strong{font-size:16px;color:#ffe2a1}.map-welcome-tip p{margin:9px 0 15px}.map-welcome-tip button{display:block;margin-left:auto;border:1px solid #dbba77;border-radius:4px;background:#6c512a;color:#fff0cb;padding:7px 18px;font:700 14px Meiryo,sans-serif}.map-welcome-tip button:focus-visible{outline:2px solid #ffe2a1;outline-offset:3px}

/* Compact text label inside the icon-sized list filter. */
aside .list-filter-button[data-kind="all"]{font-size:11px;line-height:1.2;padding-left:2px;padding-right:2px;white-space:nowrap}

#markers .marker.selected[data-arrival="true"] .selection-beacon::after{content:'出入口'}

.town-map-label{pointer-events:auto;cursor:pointer}

.marker[data-conditional-portal="true"]::before{content:"";position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:72px;height:44px;pointer-events:auto}

.map-current-name{position:absolute;left:50%;top:16px;transform:translateX(-50%);z-index:7;max-width:calc(100% - 460px);padding:8px 22px;border:1px solid #bca06a;border-radius:5px;background:linear-gradient(100deg,#19201cdd,#171b19f2,#19201cdd);box-shadow:0 3px 12px #0007;color:#f5e7c7;font:700 19px/1.5 Meiryo,sans-serif;text-align:center;text-shadow:0 2px 3px #000;pointer-events:none}
@media(max-width:1000px){.map-current-name{top:12px;max-width:calc(100% - 40px);font-size:16px;padding:6px 14px}.map-overlay-controls{top:62px}}

/* Compact mobile branding: keep the site name readable instead of cropping artwork. */
@media(max-width:760px){.site-banner-inner{min-height:82px;padding:14px;gap:0;overflow:visible}.site-brand{width:100%;min-width:0;gap:12px;flex-shrink:1}.site-brand>img{width:64px;height:46px;flex:0 0 64px}.site-brand>span{width:auto;min-width:0;flex:1;gap:4px}.site-brand strong{font-family:"Guide Noto Sans JP","Noto Sans JP","Yu Gothic",sans-serif;font-size:clamp(12px,3.6vw,15px);line-height:1.5;letter-spacing:0;white-space:nowrap}.site-brand small{font-size:10px;letter-spacing:0;line-height:1.6;white-space:normal}.site-banner-art,.site-affinities{display:none}.site-menu-inner{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));padding:0 6px;min-height:50px;overflow:visible}.site-menu a{min-width:0;padding:8px 3px;font-size:10px;line-height:1.45;white-space:normal;text-align:center}.site-menu a small{font-size:9px}.site-menu-version{display:none}}

/* Keep affinity references available on phones in their own row. */
@media(max-width:760px){.site-banner-inner{flex-wrap:wrap;row-gap:10px}.site-affinities{display:flex;width:100%;justify-content:center;align-items:center;gap:22px;padding-top:10px;border-top:1px solid #e3ecef}.site-affinities img{height:68px;width:auto;max-width:44%;object-fit:contain}}

@media(max-width:760px){.site-banner-inner{flex-wrap:nowrap;gap:8px;padding:12px 10px}.site-brand{width:auto;flex:1;gap:6px}.site-brand>img{width:44px;height:36px;flex-basis:44px}.site-brand strong{font-size:clamp(10px,2.8vw,13px);white-space:normal;word-break:normal;overflow-wrap:normal;line-height:1.5}.site-brand small{font-size:8px;line-height:1.5}.site-affinities{width:auto;flex:0 0 auto;gap:3px;padding:0;border:0}.site-affinities img{height:44px;width:auto;max-width:none}}

/* Mobile header: branding row followed by a full-width artwork strip. */
@media(max-width:760px){.site-banner-inner{display:grid;grid-template-columns:minmax(0,1fr) auto;padding:12px 10px 0;gap:10px 8px;overflow:hidden}.site-brand{grid-column:1;grid-row:1;width:auto;min-width:0;gap:7px}.site-brand>img{width:44px;height:38px;flex-basis:44px}.site-brand>span{min-width:0;width:auto;gap:3px}.site-brand strong{font-size:clamp(10px,2.8vw,13px);line-height:1.5;letter-spacing:0;white-space:nowrap}.site-brand small{font-size:8px;line-height:1.5;letter-spacing:0;white-space:normal}.site-affinities{grid-column:2;grid-row:1;display:flex;width:auto;padding:0;border:0;gap:3px}.site-affinities img{height:42px;width:auto;max-width:none}.site-banner-art{display:block;grid-column:1/-1;grid-row:2;height:100px;min-width:0;margin:0 -10px;align-self:auto;overflow:hidden}.site-banner-art img{position:static;display:block;width:100%;height:100%;max-width:100%;object-fit:cover;object-position:center;clip-path:none;mask-image:none;-webkit-mask-image:none}}

@media(max-width:760px){.site-banner-art img{object-position:right center}}

/* Stronger red selection beacon. */
#markers .marker.selected{outline-color:#ff6878;box-shadow:0 0 0 3px #481c27,0 0 26px #ff526cb3}
#markers .marker.selected .selection-beacon{border:3px solid #ff8996;animation:selected-red-ripple 1.6s ease-out infinite}
#markers .marker.selected .selection-beacon::after{border-color:#ff8996;background:#5a1728f5;color:#fff5f6}
#markers .marker[data-kind="chest"].selected::before{border-color:#ff6878;background:#551e2a88;box-shadow:0 0 26px #ff526cb3}
@keyframes selected-red-ripple{0%{box-shadow:0 0 10px 2px #ff657db3,0 0 0 0 #ff526cdd}75%,100%{box-shadow:0 0 24px 8px #ff657d55,0 0 0 34px #ff526c00}}
@media(prefers-reduced-motion:reduce){#markers .marker.selected .selection-beacon{animation:none;box-shadow:0 0 22px #ff657d99}}

/* Fade the visible clipping edge as well as the image edge. */
@media(min-width:761px){.site-banner-art{-webkit-mask-image:linear-gradient(to right,transparent 0,#000 140px)!important;mask-image:linear-gradient(to right,transparent 0,#000 140px)!important}}