/* The public DayZ map pages (/dayz-map/..., includes/dayz-map.inc.php).
   The page chrome is the Valheim Map page's (css/valheim-map.css), line for line: the intro, ONE left panel
   that holds every control under a plain heading, the map box with a title line above and one line of actions
   under it, two columns of text below. Everything the visitor can press is the page's own drawn control (no
   native select, checkbox or scrollbar shows). The focus ring is a box-shadow: the site's legacy essentials.css
   kills every outline with `*:focus { outline: none !important }`. */
body.pubv2.dzmap-page .dzmap-tool{padding-top:26px;padding-bottom:30px}
body.pubv2.dzmap-page .page-title p{margin:6px 0 0;color:#aaa}
.dzmap-intro{max-width:none;margin:0 0 22px;color:#bbb}
.dzmap-app{display:grid;grid-template-columns:260px minmax(0,1fr);gap:24px;align-items:start;color:#ddd}
.dzmap-app [hidden]{display:none!important}
.dzmap-app aside{padding:18px;background:#1c1c1e;border:1px solid #373738;border-radius:5px}
.dzmap-app button,.dzmap-app input,.dzmap-app summary{font:inherit;touch-action:manipulation}
.dzmap-app :is(button,a,input,summary,canvas):focus-visible{outline:2px solid #eaa824;outline-offset:3px;box-shadow:0 0 0 2px #eaa824}
.dzmap-app :is(.dzv-map,.dzv-layer,.dzmap-places a,.dzmap-pl,.dzmap-grp summary,.dzv-result):focus-visible{box-shadow:inset 0 0 0 2px #eaa824}
.dzmap-app .dzv-sbox input:focus-visible{box-shadow:none}
body.pubv2.dzmap-page .dzmap-guide a:focus-visible{box-shadow:0 0 0 2px #eaa824;border-radius:2px}

/* ---------- the left panel: one section per heading ---------- */
body.pubv2 .dzmap-app aside section{padding:15px 0 0;margin:15px 0 0;border-top:1px solid #38383a;background:none}
body.pubv2 .dzmap-app aside section:first-child{padding-top:0;margin-top:0;border-top:0}
body.pubv2 .dzmap-app h2{font-size:14px;font-weight:600;margin:0 0 10px;color:#eee;line-height:1.4}
body.pubv2 .dzmap-app h2 span{margin-left:6px;color:#aaa;font-size:12px;font-weight:400}
.dzmap-app .hint{font-size:12px;line-height:1.6;color:#aaa;margin:7px 0 0}
.dzmap-app .hint b{color:#ddd}
/* the buttons of the panel and of the line under the map: the Valheim page's button */
.dzmap-app :is(.segmented,.dzmap-tools,.map-footer) button{color:#ddd;background:#252527;border:1px solid #555;padding:8px 12px;border-radius:4px;cursor:pointer;line-height:1.4}
.dzmap-app :is(.segmented,.dzmap-tools,.map-footer) button:hover:not(:disabled){background:#303033;border-color:#eaa824}
.dzmap-app :is(.segmented,.dzmap-tools,.map-footer) button:disabled{opacity:.45;cursor:not-allowed}
/* Map: the three (later four) maps, the open one lit */
.dzmap-app .dzmap-maps{display:grid;grid-template-columns:1fr 1fr;gap:6px}
body.pubv2 .dzmap-app .dzmap-maps a{display:flex;align-items:center;justify-content:center;min-height:38px;padding:6px 8px;color:#ddd;background:#252527;border:1px solid #555;border-radius:4px;font-size:13px;line-height:1.3;text-align:center;text-decoration:none}
body.pubv2 .dzmap-app .dzmap-maps a:hover{background:#303033;border-color:#eaa824;color:#fff}
body.pubv2 .dzmap-app .dzmap-maps a.on{background:#493919;color:#ffe2a7;border-color:#a97d26}
/* Map style: the two-part control */
.dzmap-app .segmented{display:flex}
.dzmap-app .segmented button{flex:1;font-size:13px;border-radius:0}
.dzmap-app .segmented button:first-child{border-radius:4px 0 0 4px}
.dzmap-app .segmented button:last-child{border-radius:0 4px 4px 0;border-left:0}
.dzmap-app .segmented button[aria-pressed=true]{background:#493919;color:#ffe2a7;border-color:#a97d26}
/* Find a place: the renderer's search box, in the panel */
.dzmap-app .dzv-search{position:relative}
.dzmap-app .dzv-sbox{display:flex;align-items:center;gap:8px;height:40px;margin:0;padding:0 4px 0 10px;background:#141415;border:1px solid #646466;border-radius:4px;cursor:text;font-weight:400}
.dzmap-app .dzv-sbox:focus-within{border-color:#eaa824;box-shadow:0 0 0 1px #eaa824}
.dzmap-app .dzv-sbox>i{color:#999;font-size:13px}
body.pubv2 .dzmap-app .dzv-sbox input{flex:1 1 auto;min-width:0;width:100%;height:38px;margin:0;padding:0;border:0;outline:0;background:transparent;color:#fff;font:14px "Open Sans",sans-serif;box-shadow:none}
.dzmap-app .dzv-sbox input::placeholder{color:#8a8a8a}
.dzmap-app .dzv-sbox input::-webkit-search-cancel-button{-webkit-appearance:none;display:none}
.dzmap-app .dzv-sclear{width:30px;height:30px;padding:0;border:0;border-radius:4px;background:transparent;color:#999;cursor:pointer}
.dzmap-app .dzv-sclear:hover{color:#fff;background:#ffffff14}
.dzmap-app .dzv-results{position:absolute;left:0;right:0;top:46px;z-index:6;max-height:330px;overflow:auto;background:#1c1c1e;border:1px solid #646466;border-radius:4px;box-shadow:0 10px 28px #00000073;scrollbar-color:#57534a transparent;scrollbar-width:thin}
.dzmap-app .dzv-result{display:flex;flex-direction:column;gap:1px;padding:8px 12px;cursor:pointer;border-bottom:1px solid #ffffff0f}
.dzmap-app .dzv-result:last-child{border-bottom:0}
.dzmap-app .dzv-result b{color:#fff;font-weight:600;font-size:13px}
.dzmap-app .dzv-result span{color:#aaa;font-size:12px}
.dzmap-app .dzv-result.on,.dzmap-app .dzv-result:hover{background:#eaa82424}
.dzmap-app .dzv-noresult{padding:10px 12px;color:#ccc;font-size:12.5px;line-height:1.5}
/* Show: drawn checkboxes with their counts */
.dzmap-app .dzv-layer{display:flex;align-items:center;gap:8px;width:100%;min-height:34px;margin:0;padding:0;background:none;border:0;color:#ddd;font-size:13px;text-align:left;cursor:pointer}
.dzmap-app .dzv-layer:hover{color:#fff}
.dzmap-app .dzv-check{position:relative;flex:none;width:15px;height:15px;border:1px solid #777;border-radius:2px;background:#141415}
.dzmap-app .dzv-layer[aria-checked=true] .dzv-check{background:#eaa824;border-color:#a97d26}
.dzmap-app .dzv-layer[aria-checked=true] .dzv-check::after{content:"";position:absolute;left:4px;top:1px;width:4px;height:8px;border:solid #1b1508;border-width:0 2px 2px 0;transform:rotate(45deg)}
.dzmap-app .dzv-grow{flex:1 1 auto;min-width:0}
.dzmap-app .dzv-count{margin-left:auto;color:#aaa;font-size:12px}
.dzmap-app .dzv-muted{margin:6px 0 0;color:#aaa;font-size:12px;line-height:1.6}
.dzmap-app aside details{margin:0}
.dzmap-app aside summary{display:flex;align-items:center;gap:7px;min-height:32px;cursor:pointer;font-size:13px;font-weight:600;list-style:none;color:#ddd}
.dzmap-app aside summary::-webkit-details-marker{display:none}
.dzmap-app aside summary::before{content:"";flex:none;width:6px;height:6px;margin:0 3px 2px 2px;border:solid #eaa824;border-width:0 2px 2px 0;transform:rotate(-45deg);transition:transform .15s ease}
.dzmap-app aside details[open]>summary::before{transform:rotate(45deg)}
.dzmap-app aside summary:hover{color:#fff}
.dzmap-app #dzmap-kinds-box{margin-top:4px}
.dzmap-app #dzmap-kinds{padding-left:15px}
/* Measure and mark: two worded buttons */
.dzmap-app .dzmap-tools{display:grid;gap:7px}
.dzmap-app .dzmap-tools button{width:100%;font-size:13px;text-align:center}
.dzmap-app .dzmap-tools button[aria-pressed=true]{background:#493919;color:#ffe2a7;border-color:#a97d26}
.dzmap-app .dzmap-link,.dzmap-app .map-footer button.dzmap-link{padding:0;background:none;border:0;color:#eaa824;font-size:12px;text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.dzmap-app .dzmap-link:hover:not(:disabled),.dzmap-app .map-footer button.dzmap-link:hover:not(:disabled){color:#ffd27a;background:none}
/* Places: every name by group, scrolling inside the panel */
.dzmap-app .dzmap-places{max-height:330px;margin:0 -8px;padding:0 4px 0 8px;overflow-y:auto;overscroll-behavior:contain;scrollbar-color:#57534a transparent;scrollbar-width:thin}
.dzmap-app .dzmap-places::-webkit-scrollbar{width:8px}
.dzmap-app .dzmap-places::-webkit-scrollbar-thumb{background:#57534a;border-radius:4px}
.dzmap-app .dzmap-places::-webkit-scrollbar-track{background:transparent}
.dzmap-app .dzmap-grp summary em{margin-left:auto;padding-right:4px;color:#aaa;font-size:12px;font-style:normal;font-weight:400}
.dzmap-app .dzmap-grp ul{margin:0 0 6px;padding:0;list-style:none}
body.pubv2 .dzmap-app .dzmap-places a,.dzmap-app .dzmap-pl{display:flex;align-items:center;gap:8px;width:100%;min-height:30px;margin:0;padding:0 4px 0 17px;background:none;border:0;border-radius:3px;color:#ccc;font-size:13px;text-align:left;text-decoration:none;cursor:pointer}
body.pubv2 .dzmap-app .dzmap-places a:hover,.dzmap-app .dzmap-pl:hover,body.pubv2 .dzmap-app .dzmap-places .on{color:#fff;background:#303033}
.dzmap-app .dzmap-places .on{box-shadow:inset 3px 0 0 #eaa824}
.dzmap-app .dzmap-places b{flex:1 1 auto;min-width:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-weight:400}
.dzmap-app .dzmap-places small{flex:none;color:#999;font:11.5px/1 ui-monospace,"SFMono-Regular",Menlo,Consolas,monospace}
.dzmap-app .dzmap-pl .dot{flex:none;width:10px;height:10px;margin-left:-13px;border-radius:50%;background:var(--c);box-shadow:0 0 0 2px #101210d9}
.dzmap-app .dzmap-nonames{margin:0 8px 0 0}

/* ---------- the map: a title line, the box, one line of actions ---------- */
.dzmap-app .map-section{position:sticky;top:10px;min-width:0;display:flex;flex-direction:column}
.dzmap-app .map-bar,.dzmap-app .map-footer{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:42px}
.dzmap-app .map-bar strong{font-size:16px;color:#fff;font-weight:600}
.dzmap-app #dzmap-version{margin-left:12px;font-size:12px;color:#aaa}
.dzmap-app .map-help{font-size:12px;color:#aaa}
/* as tall as the window allows, so the whole tool is on one screen once scrolled to it; never much taller than it
   is wide (a DayZ world is a square: a tall narrow box would be mostly band) */
.dzmap-app #dzmap-viewport{position:relative;aspect-ratio:21/20;min-height:430px;max-height:clamp(430px,calc(100vh - 150px),880px);background:#1a1e1c;border:1px solid #41434a;border-radius:4px;overflow:hidden}
.dzmap-app .dzmap-nojs{position:absolute;top:47%;width:100%;padding:0 55px;text-align:center;color:#c4cfde;font-size:16px}
.dzmap-app .map-footer{justify-content:flex-start;flex-wrap:wrap;color:#aaa;font-size:12px;padding-top:9px}
.dzmap-app .map-footer button{font-size:12px;padding:6px 8px}
.dzmap-app .map-footer #dzmap-share{margin-left:auto}
.dzmap-app .map-footer button.dzmap-link{padding:6px 0 6px 2px}
.dzmap-app .map-footer button.dzv-coord{display:inline-flex;align-items:baseline;gap:8px;min-height:30px;margin:0;padding:0;background:none;border:0;color:#aaa;font-size:12px;cursor:copy}
.dzmap-app .map-footer button.dzv-coord:hover{background:none}
.dzmap-app .dzv-coord:hover .dzv-coord-l{color:#fff}
.dzmap-app .dzv-grid{color:#ffd36b;font:700 13px Consolas,"Courier New",monospace;letter-spacing:.04em}
.dzmap-app .dzv-pos{color:#aaa;font:12px Consolas,"Courier New",monospace}
.dzmap-credit{margin:14px 0 0;max-width:none;color:#8a8a8a;font-size:12px;line-height:1.6}

/* ---------- on the map (js/dayz-map.js): + / - / Fit, N, the scale bar, and what a tool shows while in use ---------- */
.dzv{position:absolute;inset:0;color:#f1ede4;font:13px/1.45 "Open Sans","Segoe UI",sans-serif;user-select:none;-webkit-user-select:none}
.dzv-map{position:absolute;inset:0;width:100%;height:100%;display:block;cursor:grab;touch-action:none}
.dzv-map.drag{cursor:grabbing}
.dzv-tool-measure .dzv-map,.dzv-tool-pin .dzv-map{cursor:crosshair}
.dzv button{font:inherit;color:inherit}
.dzv-col{position:absolute;top:12px;left:12px;z-index:4;display:flex;flex-direction:column;gap:6px}
.dzv-col button{min-width:40px;min-height:40px;padding:6px;color:#ddd;background:#1c1c1ef0;border:1px solid #555;border-radius:4px;cursor:pointer;line-height:1.4}
.dzv-col button:hover{background:#303033;border-color:#eaa824}
.dzv-north{position:absolute;right:12px;top:12px;z-index:3;padding:2px 8px;border-radius:3px;background:#101210a6;color:#e1e7f0;pointer-events:none}
.dzv-scale{position:absolute;right:12px;bottom:14px;z-index:3;display:flex;flex-direction:column;align-items:flex-end;gap:3px;pointer-events:none}
.dzv-scale-label{color:#f1ede4;font-size:11.5px;font-weight:600;padding:1px 6px;border-radius:3px;background:#101210b8}
.dzv-scale-bar{height:6px;border:2px solid #f1ede4;border-top:0;box-shadow:0 0 0 1px #101210b3}
/* the card: the ruler's readout or a pin being named, beside + / - / Fit */
.dzv-card{position:absolute;left:64px;top:12px;width:300px;max-width:calc(100% - 132px);z-index:4;padding:11px 12px;background:#1c1c1ef5;border:1px solid #555;border-radius:5px;box-shadow:0 10px 28px #00000073}
.dzv-card-h{display:flex;align-items:center;gap:9px}
.dzv-card.dzv-card-slim{padding:5px 6px 5px 12px;width:auto}
.dzv-card-row1 b{flex:none;white-space:nowrap}
.dzv-card-row1 .dzv-legs{flex:1 1 auto;color:#aaa;font-size:12.5px;white-space:nowrap}
.dzv-card-row1 .dzv-btn{min-height:30px;padding:0 10px}
.dzv-card-h>i{color:#ffc233}
.dzv-card-h b{flex:1 1 auto;color:#fff;font-size:15px}
.dzv-card p{margin:7px 0 0;color:#ccc;font-size:12.5px}
.dzv-card .dzv-card-sub{color:#aaa;font-size:12px}
.dzv-x{width:28px;height:28px;padding:0;border:0;border-radius:4px;background:transparent;color:#aaa;cursor:pointer}
.dzv-x:hover{color:#fff;background:#ffffff14}
.dzv-card-row{display:flex;gap:8px;justify-content:flex-end;margin-top:10px}
.dzv-btn{min-height:32px;padding:0 12px;border-radius:4px;border:1px solid #555;background:#252527;color:#ddd;font-size:12.5px;cursor:pointer}
.dzv-btn:hover{background:#303033;border-color:#eaa824}
.dzv-btn-del{margin-right:auto;color:#f0a196}
.dzv-field{display:flex;flex-direction:column;gap:4px;margin:9px 0 0;font-weight:400}
.dzv-field span{color:#aaa;font-size:11.5px;font-weight:600}
body.pubv2 .dzv-field input{height:34px;margin:0;padding:0 10px;border:1px solid #646466;border-radius:4px;background:#141415;color:#fff;font:14px "Open Sans",sans-serif;box-shadow:none}
body.pubv2 .dzv-field input:focus{border-color:#eaa824;outline:0}
.dzv-swatches{display:flex;gap:7px;margin-top:9px}
.dzv-swatches button{width:26px;height:26px;padding:0;border-radius:50%;border:2px solid #0009;background:var(--c);cursor:pointer}
.dzv-swatches button[aria-checked=true]{box-shadow:0 0 0 2px #fff}
/* the tip, the toast, the empty state */
.dzv-tip{position:absolute;z-index:6;display:none;max-width:260px;padding:7px 10px;background:#1c1c1ef5;border:1px solid #777;border-radius:4px;pointer-events:none}
.dzv-tip.on{display:block}
.dzv-tip b{display:block;color:#fff;font-size:13px}
.dzv-tip span{display:block;color:#ccc;font-size:12px}
.dzv-tip em{display:block;color:#999;font-size:11.5px;font-style:normal}
.dzv-tip em:empty,.dzv-tip span:empty{display:none}
.dzv-toast{position:absolute;left:50%;bottom:44px;transform:translate(-50%,8px);z-index:7;padding:7px 14px;border-radius:4px;background:#1c1c1ef5;border:1px solid #a97d26;color:#f1ede4;font-size:12.5px;opacity:0;pointer-events:none;transition:opacity .18s,transform .18s;max-width:calc(100% - 40px);text-align:center}
.dzv-toast.on{opacity:1;transform:translate(-50%,0)}
.dzv-empty{position:absolute;inset:0;z-index:8;display:none;flex-direction:column;align-items:center;justify-content:center;gap:6px;background:#1a1e1ceb;text-align:center}
.dzv-empty b{color:#fff;font-size:16px}
.dzv-empty span{color:#ccc}

/* ---------- full screen: the panel and the map together ---------- */
.dzmap-app:fullscreen,.dzmap-app.dzmap-full{grid-template-rows:minmax(0,1fr);align-items:stretch;height:100vh;padding:12px;background:#121412}
.dzmap-app.dzmap-full{position:fixed;inset:0;z-index:2147483000}
.dzmap-app:fullscreen aside,.dzmap-app.dzmap-full aside{overflow-y:auto;scrollbar-color:#57534a transparent;scrollbar-width:thin}
.dzmap-app:fullscreen .map-section,.dzmap-app.dzmap-full .map-section{position:static;min-height:0}
.dzmap-app:fullscreen #dzmap-viewport,.dzmap-app.dzmap-full #dzmap-viewport{flex:1 1 auto;aspect-ratio:auto;height:auto;min-height:0;max-height:none}
html.dzmap-noscroll,html.dzmap-noscroll body{overflow:hidden}

/* ---------- the two columns of text ---------- */
body.pubv2.dzmap-page .dzmap-guide{border-top:1px solid #333;padding-top:35px;padding-bottom:40px}
.dzmap-guide h3{font-size:18px;margin-top:26px}
.dzmap-host{padding-left:40px}
.dzmap-facts{display:grid;grid-template-columns:auto 1fr;gap:6px 16px;margin:24px 0 0;font-size:13px}
.dzmap-facts dt{color:#aaa;font-weight:400}
.dzmap-facts dd{margin:0;color:#ddd}
body.pubv2.dzmap-page .dzmap-guide p a{text-decoration:underline;text-underline-offset:3px}

@media(max-width:1100px){.dzmap-app{grid-template-columns:235px minmax(0,1fr);gap:18px}.dzmap-app .map-help{display:none}.dzmap-app aside{padding:15px}}
/* a phone: the Valheim page's order. What picks the map and finds a place sits above the map; the rest follows it */
@media(max-width:767px){
	.dzmap-app{grid-template-columns:minmax(0,1fr);gap:14px}
	.dzmap-app aside{display:contents}
	body.pubv2 .dzmap-app aside section{padding:0;margin:0;border-top:0}
	.dzmap-app .dzmap-opt-map{order:1}.dzmap-app .dzmap-opt-find{order:2}.dzmap-app .map-section{order:3;position:static}.dzmap-app .dzmap-opt-tools{order:4}.dzmap-app .dzmap-opt-style{order:5}.dzmap-app .dzmap-opt-show{order:6}.dzmap-app .dzmap-opt-places{order:7}
	body.pubv2 .dzmap-app aside :is(.dzmap-opt-tools,.dzmap-opt-style,.dzmap-opt-show,.dzmap-opt-places){padding-top:14px;border-top:1px solid #38383a}
	.dzmap-app .dzmap-maps{grid-template-columns:repeat(auto-fit,minmax(0,1fr));grid-auto-flow:column}
	.dzmap-app .dzmap-maps a,.dzmap-app .segmented button,.dzmap-app .dzmap-tools button{min-height:44px}
	.dzmap-app .dzmap-tools{grid-template-columns:1fr 1fr}
	.dzmap-app .dzv-sbox{height:44px}
	.dzmap-app .dzmap-opt-find .hint{display:none}   /* the box's own placeholder says it; the map comes sooner */
	body.pubv2 .dzmap-app .dzv-sbox input,body.pubv2 .dzv-field input{font-size:16px}
	.dzmap-app .dzv-layer{min-height:44px}
	.dzmap-app aside summary{min-height:44px}
	.dzmap-app .dzmap-places{max-height:none;margin:0;padding:0;overflow:visible}
	.dzmap-app .dzmap-places a,.dzmap-app .dzmap-pl{min-height:40px}
	.dzmap-app #dzmap-viewport{aspect-ratio:auto;min-height:0;max-height:none;height:clamp(340px,calc(100vw - 6px),430px)}
	/* full screen on a phone: the map alone, with its title line and its line of actions */
	.dzmap-app:fullscreen,.dzmap-app.dzmap-full{display:flex;flex-direction:column;padding:8px}
	body.pubv2 .dzmap-app:fullscreen aside section,body.pubv2 .dzmap-app.dzmap-full aside section{display:none}
	.dzmap-app:fullscreen .map-section,.dzmap-app.dzmap-full .map-section{flex:1 1 auto}
	.dzmap-app .map-bar{flex-wrap:wrap;min-height:36px}
	.dzmap-app .map-footer{gap:9px}
	.dzmap-app .map-footer .dzv-coord{width:100%}
	.dzmap-app .map-footer #dzmap-share{margin-left:0}
	.dzmap-app .map-footer button{min-height:40px}
	.dzv-col button{min-width:44px;min-height:44px}
	.dzv-card{left:12px;right:12px;top:auto;bottom:44px;width:auto;max-width:none}
	.dzv-toast{bottom:auto;top:12px;left:calc(50% + 28px);max-width:calc(100% - 140px)}
	.dzv-btn{min-height:40px}.dzv-swatches button{width:34px;height:34px}.dzv-x,.dzmap-app .dzv-sclear{width:40px;height:40px}
	.dzv-pos{display:none}
	.dzmap-host{padding-left:15px;margin-top:26px}
	body.pubv2.dzmap-page .dzmap-tool{padding-top:20px}
	.dzmap-intro{margin-bottom:18px}
}
@media(max-width:360px){.dzmap-app #dzmap-version{margin-left:8px}}

/* Preserve the wordmark's proportions as the shared header narrows. */
body.dzmap-page.v2hdr #c2brand .c2logo img{height:auto;max-height:34px}