/* The public Minecraft seed map (/tools/minecraft-map/, includes/minecraft-seed-map.inc.php).
   The page chrome is the DayZ map page's (css/dayz-map.css), which is the Valheim Map page's, 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.mcsm-page .mcsm-tool{padding-top:26px;padding-bottom:30px}
body.pubv2.mcsm-page .page-title p{margin:6px 0 0;color:#aaa}
.mcsm-intro{max-width:none;margin:0 0 22px;color:#bbb}
.mcsm-app{display:grid;grid-template-columns:260px minmax(0,1fr);gap:24px;align-items:start;color:#ddd}
.mcsm-app [hidden]{display:none!important}
.mcsm-app aside{padding:18px;background:#1c1c1e;border:1px solid #373738;border-radius:5px}
.mcsm-app button,.mcsm-app input{font:inherit;touch-action:manipulation}
.mcsm-app :is(button,a,input,canvas):focus-visible{outline:2px solid #eaa824;outline-offset:3px;box-shadow:0 0 0 2px #eaa824}
.mcsm-app :is(canvas,.mcsm-layer,#mcsm-versions li):focus-visible{outline:0;box-shadow:inset 0 0 0 2px #eaa824}
body.pubv2.mcsm-page .mcsm-guide a:focus-visible{box-shadow:0 0 0 2px #eaa824;border-radius:2px}

/* ---------- the left panel: one section per heading ---------- */
body.pubv2 .mcsm-app aside section{padding:15px 0 0;margin:15px 0 0;border-top:1px solid #38383a;background:none}
body.pubv2 .mcsm-app aside section:first-child{padding-top:0;margin-top:0;border-top:0}
body.pubv2 .mcsm-app h2{font-size:14px;font-weight:600;margin:0 0 10px;color:#eee;line-height:1.4}
body.pubv2 .mcsm-app h2 label{margin:0;font:inherit;color:inherit}
.mcsm-app .hint{font-size:12px;line-height:1.6;color:#aaa;margin:7px 0 0}
/* the panel's buttons and the line under the map: the Valheim page's button */
.mcsm-app :is(.segmented,.map-footer,.mcsm-seed-entry,.mcsm-goto) button{color:#ddd;background:#252527;border:1px solid #555;padding:8px 12px;border-radius:4px;cursor:pointer;line-height:1.4}
.mcsm-app :is(.segmented,.map-footer,.mcsm-seed-entry,.mcsm-goto) button:hover:not(:disabled){background:#303033;border-color:#eaa824}
.mcsm-app :is(.segmented,.map-footer) button:disabled{opacity:.45;cursor:not-allowed}
/* World seed: the box, Random, Show map */
.mcsm-app #mcsm-form{padding:0;margin:0}
.mcsm-app .mcsm-seed-entry,.mcsm-app .mcsm-goto{display:flex;gap:7px}
body.pubv2 .mcsm-app :is(#mcsm-seed,#mcsm-goto-xz){flex:1 1 auto;width:100%;min-width:0;height:40px;padding:8px 10px;margin:0;border:1px solid #646466;border-radius:4px;background:#141415;color:#fff;font:14px ui-monospace,"SFMono-Regular",Menlo,Consolas,monospace;box-shadow:none}
body.pubv2 .mcsm-app :is(#mcsm-seed,#mcsm-goto-xz):focus{border-color:#eaa824;outline:0;box-shadow:0 0 0 1px #eaa824}
.mcsm-app :is(#mcsm-seed,#mcsm-goto-xz)::placeholder{color:#8a8a8a;font-family:"Open Sans",sans-serif}
.mcsm-app #mcsm-random{flex:none;font-size:12px;padding:6px 9px}
.mcsm-app .mcsm-goto button{flex:none;font-size:13px;padding:6px 14px}
.mcsm-app #mcsm-show-btn{margin-top:10px}
/* the version list: a drawn list box */
.mcsm-app .mcsm-pick{position:relative}
.mcsm-app #mcsm-version{display:flex;align-items:center;justify-content:space-between;width:100%;height:40px;padding:0 12px;color:#fff;background:#141415;border:1px solid #646466;border-radius:4px;cursor:pointer;font-size:14px;text-align:left}
.mcsm-app #mcsm-version:hover,.mcsm-app #mcsm-version[aria-expanded=true]{border-color:#eaa824}
.mcsm-app .mcsm-caret{width:7px;height:7px;margin:-3px 2px 0 10px;border:solid #eaa824;border-width:0 2px 2px 0;transform:rotate(45deg);transition:transform .15s ease}
.mcsm-app #mcsm-version[aria-expanded=true] .mcsm-caret{transform:rotate(-135deg);margin-top:4px}
.mcsm-app #mcsm-versions{position:absolute;left:0;right:0;top:44px;z-index:9;max-height:300px;margin:0;padding:4px 0;list-style:none;overflow-y:auto;background:#1c1c1e;border:1px solid #646466;border-radius:4px;box-shadow:0 10px 28px #00000073;scrollbar-color:#57534a transparent;scrollbar-width:thin}
.mcsm-app #mcsm-versions li{padding:8px 12px;font-size:13px;color:#ddd;cursor:pointer}
.mcsm-app #mcsm-versions li:hover{background:#303033;color:#fff}
.mcsm-app #mcsm-versions li[aria-selected=true]{background:#493919;color:#ffe2a7}
/* Dimension and Height: the two- and three-part control */
.mcsm-app .segmented{display:flex}
.mcsm-app .segmented button{flex:1 1 auto;min-width:0;padding:8px 6px;font-size:13px;white-space:nowrap;border-radius:0}
.mcsm-app .segmented button:first-child{border-radius:4px 0 0 4px}
.mcsm-app .segmented button:last-child{border-radius:0 4px 4px 0}
.mcsm-app .segmented button+button{border-left:0}
.mcsm-app .segmented button[aria-pressed=true]{background:#493919;color:#ffe2a7;border-color:#a97d26}
/* Show: drawn checkboxes with the structure's own badge and the count in view */
.mcsm-app .mcsm-layer{display:flex;align-items:center;gap:8px;width:100%;min-height:32px;margin:0;padding:0 2px;background:none;border:0;border-radius:3px;color:#ddd;font-size:13px;text-align:left;cursor:pointer}
.mcsm-app .mcsm-layer:hover{color:#fff;background:#ffffff0a}
.mcsm-app .mcsm-check{position:relative;flex:none;width:15px;height:15px;border:1px solid #777;border-radius:2px;background:#141415}
.mcsm-app .mcsm-layer[aria-checked=true] .mcsm-check{background:#eaa824;border-color:#a97d26}
.mcsm-app .mcsm-layer[aria-checked=true] .mcsm-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)}
.mcsm-app .mcsm-ico{flex:none;width:18px;height:18px}
.mcsm-app .mcsm-layer[aria-checked=false] .mcsm-ico{opacity:.55}
.mcsm-app .mcsm-grow{flex:1 1 auto;min-width:0}
.mcsm-app .mcsm-count{margin-left:auto;color:#aaa;font-size:12px;white-space:nowrap}
.mcsm-app .mcsm-ico.maybe{border-radius:50%;outline:1.5px dashed #fff;outline-offset:1px}
.mcsm-app .mcsm-maybe-hint{display:flex;gap:8px;align-items:flex-start}
.mcsm-app .mcsm-dash{flex:none;width:14px;height:14px;margin-top:3px;border:1.5px dashed #fff;border-radius:50%}

/* ---------- the map: a title line, the box, one line of actions ---------- */
.mcsm-app .map-section{position:sticky;top:10px;min-width:0;display:flex;flex-direction:column}
.mcsm-app .map-bar,.mcsm-app .map-footer{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:42px}
.mcsm-app .map-bar strong{font-size:16px;color:#fff;font-weight:600;overflow-wrap:anywhere}
.mcsm-app #mcsm-game-version{margin-left:12px;font-size:12px;color:#aaa}
.mcsm-app .map-help{font-size:12px;color:#aaa;white-space:nowrap}
/* as tall as the window allows, so the whole tool is on one screen once scrolled to it */
.mcsm-app #mcsm-viewport{position:relative;aspect-ratio:4/3;min-height:430px;max-height:clamp(430px,calc(100vh - 150px),880px);background:#121418;border:1px solid #41434a;border-radius:4px;overflow:hidden;user-select:none;-webkit-user-select:none}
.mcsm-app canvas{position:absolute;inset:0;display:block;width:100%;height:100%;cursor:grab;touch-action:none}
.mcsm-app canvas.dragging{cursor:grabbing}
.mcsm-app .mcsm-col{position:absolute;top:12px;left:12px;z-index:4;display:flex;flex-direction:column;gap:6px}
.mcsm-app .mcsm-col button{display:flex;align-items:center;justify-content:center;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;font-size:16px}
.mcsm-app .mcsm-col button:hover{background:#303033;border-color:#eaa824}
.mcsm-app .mcsm-north{position:absolute;right:12px;top:12px;z-index:3;padding:2px 8px;border-radius:3px;background:#101210a6;color:#e1e7f0;pointer-events:none}
.mcsm-app .mcsm-scale{position:absolute;right:12px;bottom:14px;z-index:3;display:flex;flex-direction:column;align-items:flex-end;gap:3px;pointer-events:none}
.mcsm-app #mcsm-scale-label{color:#f1ede4;font-size:11.5px;font-weight:600;padding:1px 6px;border-radius:3px;background:#101210b8}
.mcsm-app .mcsm-scale-bar{height:6px;border:2px solid #f1ede4;border-top:0;box-shadow:0 0 0 1px #101210b3}
.mcsm-app .mcsm-tip{position:absolute;z-index:6;max-width:260px;padding:7px 10px;background:#1c1c1ef5;border:1px solid #777;border-radius:4px;pointer-events:none}
.mcsm-app .mcsm-tip b{display:block;color:#fff;font-size:13px}
.mcsm-app .mcsm-tip b:empty{display:none}
.mcsm-app .mcsm-tip span{display:block;color:#ccc;font:12px ui-monospace,"SFMono-Regular",Menlo,Consolas,monospace}
.mcsm-app .mcsm-tip em{display:block;margin-top:3px;color:#aaa;font-size:11.5px;font-style:normal}
.mcsm-app .mcsm-tip em:empty{display:none}
.mcsm-app .mcsm-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}
.mcsm-app .mcsm-toast.on{opacity:1;transform:translate(-50%,0)}
.mcsm-app .mcsm-empty{position:absolute;inset:0;z-index:5;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;padding:0 40px;text-align:center;pointer-events:none}
.mcsm-app .mcsm-empty b{color:#fff;font-size:16px}
.mcsm-app .mcsm-empty span{color:#ccc}
.mcsm-app .mcsm-nojs{position:absolute;top:47%;width:100%;padding:0 55px;text-align:center;color:#c4cfde;font-size:16px}
.mcsm-app .map-footer{justify-content:flex-start;flex-wrap:wrap;color:#aaa;font-size:12px;padding-top:9px}
.mcsm-app .map-footer button{font-size:12px;padding:6px 8px}
.mcsm-app .map-footer #mcsm-copy{margin-left:auto}
.mcsm-app .mcsm-link,.mcsm-app .map-footer button.mcsm-link{padding:6px 0 6px 2px;background:none;border:0;color:#eaa824;font-size:12px;text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.mcsm-app .map-footer button.mcsm-link:hover:not(:disabled){color:#ffd27a;background:none}
.mcsm-app .map-footer button.mcsm-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}
.mcsm-app .map-footer button.mcsm-coord:hover{background:none}
.mcsm-app .mcsm-coord-what{color:#ddd}
.mcsm-app .mcsm-coord:hover .mcsm-coord-what{color:#fff}
.mcsm-app .mcsm-coord-pos{color:#ffd36b;font:700 13px Consolas,"Courier New",monospace;letter-spacing:.02em}
.mcsm-credit{margin:14px 0 0;max-width:none;color:#8a8a8a;font-size:12px;line-height:1.6}

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

/* ---------- the two columns of text ---------- */
body.pubv2.mcsm-page .mcsm-guide{border-top:1px solid #333;padding-top:35px;padding-bottom:40px}
.mcsm-guide h3{font-size:18px;margin-top:26px}
.mcsm-host{padding-left:40px}
body.pubv2.mcsm-page .mcsm-guide p a{text-decoration:underline;text-underline-offset:3px}

@media(max-width:1100px){.mcsm-app{grid-template-columns:235px minmax(0,1fr);gap:18px}.mcsm-app .map-help{display:none}.mcsm-app aside{padding:15px}}
/* a phone: the seed and the version above the map; the rest follows it */
@media(max-width:767px){
	.mcsm-app{grid-template-columns:minmax(0,1fr);gap:14px}
	.mcsm-app aside{display:contents}
	body.pubv2 .mcsm-app aside section{padding:0;margin:0;border-top:0}
	.mcsm-app .mcsm-opt-seed{order:1}.mcsm-app .mcsm-opt-version{order:2}.mcsm-app .map-section{order:3;position:static}.mcsm-app .mcsm-opt-dim{order:4}.mcsm-app .mcsm-opt-layer{order:5}.mcsm-app .mcsm-opt-show{order:6}.mcsm-app .mcsm-opt-goto{order:7}
	body.pubv2 .mcsm-app aside :is(.mcsm-opt-dim,.mcsm-opt-layer,.mcsm-opt-show,.mcsm-opt-goto){padding-top:14px;border-top:1px solid #38383a}
	.mcsm-app .segmented button,.mcsm-app #mcsm-version,.mcsm-app .mcsm-seed-entry button,.mcsm-app .mcsm-goto button{min-height:44px}
	body.pubv2 .mcsm-app :is(#mcsm-seed,#mcsm-goto-xz){height:44px;font-size:16px}
	.mcsm-app #mcsm-versions li{padding:12px}
	.mcsm-app .mcsm-layer{min-height:44px}
	.mcsm-app #mcsm-show{display:grid;grid-template-columns:1fr 1fr;column-gap:10px}
	.mcsm-app #mcsm-viewport{aspect-ratio:auto;min-height:0;max-height:none;height:clamp(340px,calc(100vw + 20px),480px)}
	.mcsm-app:fullscreen,.mcsm-app.mcsm-full{display:flex;flex-direction:column;padding:8px}
	body.pubv2 .mcsm-app:fullscreen aside section,body.pubv2 .mcsm-app.mcsm-full aside section{display:none}
	.mcsm-app:fullscreen .map-section,.mcsm-app.mcsm-full .map-section{flex:1 1 auto}
	.mcsm-app .map-bar{flex-wrap:wrap;min-height:36px}
	.mcsm-app .map-footer{gap:9px}
	.mcsm-app .map-footer .mcsm-coord{width:100%}
	.mcsm-app .map-footer #mcsm-copy{margin-left:0}
	.mcsm-app .map-footer button{min-height:40px}
	.mcsm-app .mcsm-col button{min-width:44px;min-height:44px}
	.mcsm-host{padding-left:15px;margin-top:26px}
	body.pubv2.mcsm-page .mcsm-tool{padding-top:20px}
	.mcsm-intro{margin-bottom:18px}
}
@media(max-width:400px){.mcsm-app #mcsm-show{grid-template-columns:1fr}}
@media(max-width:360px){.mcsm-app #mcsm-game-version{margin-left:8px}}

/* no word left alone on a last line (Ryan's rule): short blocks balance their lines, longer ones wrap pretty */
.mcsm-intro,.mcsm-credit,.mcsm-app .hint,.mcsm-guide p,.mcsm-guide h3{text-wrap:balance}
@media(max-width:767px){.mcsm-guide p{text-wrap:pretty}}

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