/* Controls are grouped by the object they affect. */
.hero header.detail-command{position:absolute;inset:12px 20px auto;z-index:30;display:flex;align-items:center;justify-content:flex-start;gap:14px;height:48px;padding:7px 10px;background:rgba(8,17,31,.88);border:1px solid var(--line-strong);border-radius:8px;backdrop-filter:blur(14px)}
.detail-command .back-link{white-space:nowrap;font-size:11px;color:var(--muted)}
.detail-command .editor-toolbar{position:static;inset:auto;display:flex;flex:1;align-items:center;gap:8px;min-width:0;width:auto;max-width:none;padding:0;background:none;border:0;box-shadow:none;overflow:visible}
.detail-command .editor-toolbar #region-model{flex:none;width:122px;max-width:122px;height:32px;min-height:32px;margin:0;padding:0 8px;font-size:11px;border-radius:5px;background:rgba(20,36,54,.75)}
.detail-command .editor-toolbar .toolbar-pop{height:32px;flex:none}
.detail-command .editor-toolbar .toolbar-pop>summary{height:32px;max-width:220px;padding:0 10px;border-radius:5px;font-size:11px;background:rgba(20,36,54,.75)}
.detail-command .editor-toolbar #more-pop{margin-left:0}
.detail-command .editor-toolbar .editor-check-row{position:static;inset:auto;display:flex;align-items:center;min-width:0;margin:0 0 0 auto;gap:6px}
.detail-command .path-checks{max-width:260px;padding:0;background:transparent;border:0}
.detail-command .path-checks.valid span::before{content:'';display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--accent);margin-right:6px;vertical-align:middle}
.detail-command .path-checks.invalid{display:flex;flex-wrap:wrap;max-width:260px}
.detail-command #fill-gaps{height:32px;white-space:nowrap;padding:0 8px;font-size:10px}
.detail-command .pop-body{border-radius:8px;box-shadow:0 16px 40px rgba(0,0,0,.4)}
.menu-heading{margin:8px 0 6px;font-size:10px;color:var(--muted);letter-spacing:.08em}.menu-heading:first-child{margin-top:0}
#more-pop #export-card{display:block;width:100%;height:auto;text-align:left;margin:0 0 8px;padding:8px 10px;font-size:12px}
.editor-map-stage{display:block;position:absolute;inset:0;z-index:1;overflow:hidden}.editor-map-stage .map{position:absolute;inset:0;width:100%;height:100%}
.map-edit-tools,.map-view-tools{position:absolute;z-index:8;display:flex;flex-direction:column;gap:3px;padding:4px;border:1px solid var(--line-strong);border-radius:8px;background:rgba(8,17,31,.86);backdrop-filter:blur(12px)}
.map-edit-tools{top:78px;left:20px}.map-view-tools{right:20px;bottom:190px}
.map-edit-tools button,.map-view-tools button{display:grid;place-items:center;width:32px;height:32px;min-height:32px;padding:0;border:0;border-radius:5px;background:transparent;color:var(--text);font-size:18px;line-height:1}
.map-edit-tools button:hover,.map-view-tools button:hover{background:rgba(133,169,194,.17)}.map-edit-tools button[aria-pressed=true]{background:var(--accent);color:var(--ink)}
.waypoint-count{display:block;text-align:center;border-top:1px solid var(--line-strong);padding:5px 0 1px;color:var(--muted);font:10px var(--font-data)}
.hero .editor-message-source{display:none!important}.map-hint{position:absolute;z-index:7;bottom:185px;left:50%;max-width:55%;transform:translateX(-50%);padding:6px 10px;border-radius:5px;background:rgba(8,17,31,.82);color:var(--muted);font-size:11px;opacity:0;pointer-events:none;transition:opacity .3s}.map-hint.visible{opacity:1}
.hero>.map-tools{display:none!important}.hero>.input-drawer:not([open]){display:none}.hero>.input-drawer[open]{z-index:25;top:70px;left:72px;border-radius:8px;max-height:calc(100% - 90px)}
.editor-rail{top:78px!important;right:20px!important}.unit-segment{display:flex;gap:2px;margin:10px 12px 0;padding:3px;border:1px solid var(--line);border-radius:6px;background:rgba(8,17,31,.75)}.unit-segment button{flex:1;height:27px;min-height:27px;padding:0;border:0;border-radius:4px;background:transparent;color:var(--muted);font:11px var(--font-data)}.unit-segment button[aria-pressed=true]{background:rgba(127,171,193,.2);color:var(--text)}
@media(max-width:760px), (max-height:500px) and (max-width:1000px){
 .hero header.detail-command{position:relative;inset:auto;order:0;height:auto;min-height:48px;flex-wrap:wrap;gap:6px;padding:7px}
 .detail-command .back-link{font-size:10px}.detail-command .editor-toolbar{flex:1 1 100%;display:flex;flex-wrap:wrap;gap:5px}
 .detail-command .editor-toolbar #region-model{width:112px;max-width:112px}.detail-command .editor-toolbar .toolbar-pop>summary{max-width:150px}
 .detail-command .editor-toolbar .editor-check-row{margin-left:auto}.detail-command .path-checks.invalid{max-width:100px}
 .detail-command .editor-toolbar .toolbar-more .pop-body,.detail-command .editor-toolbar .pop-body{position:fixed;left:10px;right:10px;top:auto;bottom:10px;max-height:70vh;overflow:auto}
 .hero>.editor-map-stage{position:relative;inset:auto;order:6;height:clamp(340px,60svh,560px);width:100%;overflow:hidden}
 .editor-map-stage .map{position:absolute;inset:0}.map-edit-tools{top:10px;left:10px}.map-view-tools{right:10px;bottom:10px}.map-hint{bottom:12px;max-width:65%;font-size:10px;white-space:normal;text-align:center}
 .hero>.input-drawer[open]{position:relative;inset:auto;order:5;width:100%;max-height:none}.editor-rail{position:static!important;width:100%!important}.editor-dock{order:7}.editor-rail{order:8}
}
/* The small-screen header hides decorative spans; validation stays visible. */
.hero header.detail-command .path-checks span{display:inline;color:var(--muted);white-space:nowrap}
.hero header.detail-command .path-checks.invalid span{color:var(--c4)}
@media(max-width:760px), (max-height:500px) and (max-width:1000px){
 .detail-command .editor-toolbar .toolbar-pop .pop-body,.detail-command .editor-toolbar .toolbar-more .pop-body{position:absolute;top:calc(100% + 8px);bottom:auto;left:auto;right:0;width:min(300px,calc(100vw - 32px));max-height:65vh;overflow:auto}
 .detail-command .editor-toolbar #tpl-pop .pop-body{left:0;right:auto}
}
/* Keep map controls clear of the station panel at every desktop height. */
@media (min-width:761px) and (min-height:501px), (min-width:1001px){
 .map-view-tools{right:322px}
}
@media (min-width:761px) and (max-width:1100px) and (min-height:501px){
 .map-view-tools{right:302px}
}

/* The desktop map tools belong directly below the station panel. */
@media (min-width:761px) and (min-height:501px), (min-width:1001px){
 .editor-rail .map-view-tools{position:absolute;inset:calc(100% + 8px) 0 auto auto;display:flex;flex-direction:row;width:max-content;gap:3px}
}
@media(max-width:760px), (max-height:500px) and (max-width:1000px){
 .editor-rail .map-view-tools{position:static;display:flex;flex-direction:row;width:max-content;margin:0 12px 12px auto}
}

.route-hover-hint{position:absolute;z-index:12;pointer-events:none;white-space:nowrap;padding:5px 8px;border:1px solid var(--line-strong);border-radius:5px;background:rgba(8,17,31,.94);color:var(--text);font-size:11px;box-shadow:0 4px 14px #0005}

/* Keep the wind statistic beside its readings, separate from display units. */
.wind-metric button{font:500 12px var(--font-ui,'Inter','Noto Sans SC',sans-serif);height:32px;min-height:32px;white-space:nowrap}
.wind-metric button[aria-pressed=true]{background:rgba(77,255,255,.14);color:var(--accent)}
.wind-metric button:focus-visible{outline:2px solid var(--accent);outline-offset:1px}
#signal-metric-note{margin:0 0 12px;text-align:right}