map_view_vue2 0.0.1 → 0.0.3

package/map_view_vue2.css

@@ -1 +1 @@
-:host,:root{--ol-background-color:#fff;--ol-accent-background-color:#f5f5f5;--ol-subtle-background-color:hsla(0,0%,50%,.25);--ol-partial-background-color:hsla(0,0%,100%,.75);--ol-foreground-color:#333;--ol-subtle-foreground-color:#666;--ol-brand-color:#0af}.ol-box{box-sizing:border-box;border-radius:2px;border:1.5px solid var(--ol-background-color);background-color:var(--ol-partial-background-color)}.ol-mouse-position{top:8px;right:8px;position:absolute}.ol-scale-line{background:var(--ol-partial-background-color);border-radius:4px;bottom:8px;left:8px;padding:2px;position:absolute}.ol-scale-line-inner{border:1px solid var(--ol-subtle-foreground-color);border-top:none;color:var(--ol-foreground-color);font-size:10px;text-align:center;margin:1px;will-change:contents,width;transition:all .25s}.ol-scale-bar{position:absolute;bottom:8px;left:8px}.ol-scale-bar-inner{display:flex}.ol-scale-step-marker{width:1px;height:15px;background-color:var(--ol-foreground-color);float:right;z-index:10}.ol-scale-step-text{bottom:-5px;font-size:10px;z-index:11}.ol-scale-step-text,.ol-scale-text{position:absolute;color:var(--ol-foreground-color);text-shadow:-1.5px 0 var(--ol-partial-background-color),0 1.5px var(--ol-partial-background-color),1.5px 0 var(--ol-partial-background-color),0 -1.5px var(--ol-partial-background-color)}.ol-scale-text{font-size:12px;text-align:center;bottom:25px}.ol-scale-singlebar{position:relative;height:10px;z-index:9;box-sizing:border-box;border:1px solid var(--ol-foreground-color)}.ol-scale-singlebar-even{background-color:var(--ol-subtle-foreground-color)}.ol-scale-singlebar-odd{background-color:var(--ol-background-color)}.ol-unsupported{display:none}.ol-unselectable,.ol-viewport{-webkit-touch-callout:none;-webkit-user-select:none;-moz-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent}.ol-viewport canvas{all:unset;overflow:hidden}.ol-viewport{touch-action:pan-x pan-y}.ol-selectable{-webkit-touch-callout:default;-webkit-user-select:text;-moz-user-select:text;user-select:text}.ol-grabbing{cursor:grabbing}.ol-grab{cursor:move;cursor:grab}.ol-control{position:absolute;background-color:var(--ol-subtle-background-color);border-radius:4px}.ol-zoom{top:.5em;left:.5em}.ol-rotate{top:.5em;right:.5em;transition:opacity .25s linear,visibility 0s linear}.ol-rotate.ol-hidden{opacity:0;visibility:hidden;transition:opacity .25s linear,visibility 0s linear .25s}.ol-zoom-extent{top:4.643em;left:.5em}.ol-full-screen{right:.5em;top:.5em}.ol-control button{display:block;margin:1px;padding:0;color:var(--ol-subtle-foreground-color);font-weight:700;text-decoration:none;font-size:inherit;text-align:center;height:1.375em;width:1.375em;line-height:.4em;background-color:var(--ol-background-color);border:none;border-radius:2px}.ol-control button::-moz-focus-inner{border:none;padding:0}.ol-zoom-extent button{line-height:1.4em}.ol-compass{display:block;font-weight:400;will-change:transform}.ol-touch .ol-control button{font-size:1.5em}.ol-touch .ol-zoom-extent{top:5.5em}.ol-control button:focus,.ol-control button:hover{text-decoration:none;outline:1px solid var(--ol-subtle-foreground-color);color:var(--ol-foreground-color)}.ol-zoom .ol-zoom-in{border-radius:2px 2px 0 0}.ol-zoom .ol-zoom-out{border-radius:0 0 2px 2px}.ol-attribution{text-align:right;bottom:.5em;right:.5em;max-width:calc(100% - 1.3em);display:flex;flex-flow:row-reverse;align-items:center}.ol-attribution a{color:var(--ol-subtle-foreground-color);text-decoration:none}.ol-attribution ul{margin:0;padding:1px .5em;color:var(--ol-foreground-color);text-shadow:0 0 2px var(--ol-background-color);font-size:12px}.ol-attribution li{display:inline;list-style:none}.ol-attribution li:not(:last-child):after{content:" "}.ol-attribution img{max-height:2em;max-width:inherit;vertical-align:middle}.ol-attribution button{flex-shrink:0}.ol-attribution.ol-collapsed ul{display:none}.ol-attribution:not(.ol-collapsed){background:var(--ol-partial-background-color)}.ol-attribution.ol-uncollapsible{bottom:0;right:0;border-radius:4px 0 0}.ol-attribution.ol-uncollapsible img{margin-top:-.2em;max-height:1.6em}.ol-attribution.ol-uncollapsible button{display:none}.ol-zoomslider{top:4.5em;left:.5em;height:200px}.ol-zoomslider button{position:relative;height:10px}.ol-touch .ol-zoomslider{top:5.5em}.ol-overviewmap{left:.5em;bottom:.5em}.ol-overviewmap.ol-uncollapsible{bottom:0;left:0;border-radius:0 4px 0 0}.ol-overviewmap .ol-overviewmap-map,.ol-overviewmap button{display:block}.ol-overviewmap .ol-overviewmap-map{border:1px solid var(--ol-subtle-foreground-color);height:150px;width:150px}.ol-overviewmap:not(.ol-collapsed) button{bottom:0;left:0;position:absolute}.ol-overviewmap.ol-collapsed .ol-overviewmap-map,.ol-overviewmap.ol-uncollapsible button{display:none}.ol-overviewmap:not(.ol-collapsed){background:var(--ol-subtle-background-color)}.ol-overviewmap-box{border:1.5px dotted var(--ol-subtle-foreground-color)}.ol-overviewmap .ol-overviewmap-box:hover{cursor:move}.ol-overviewmap .ol-viewport:hover{cursor:pointer}.map-viewer-root{--bg:#0f1419;--panel:#171e26f2;--panel-solid:#171e26;--card:#1c2530;--field:#0e141b;--border:#2a3441;--text:#e8edf3;--muted:#9aa7b4;--accent:#3f8cff;--ok:#39c26d;--warn:#e8b339;--err:#ff6b6b;--radius:10px;--map-bg:#0b0f14;--tabs-bg:#141b23;--item-bg:#141b23;--btn2-bg:#2a3a4d;--btn2-bg-hover:#35485f;--chip-bg:#223450;--chip-border:#33517a;--chip-color:#bcd7ff;--chip-bg-hover:#2c4266;--hint-color:#8fbcff;--icon-hover-bg:#22304a;--toast-bg:#1c2530f2;--status-bg:#10151bd9;--ol-btn-bg:#1c2530dd;--drop-bg:rgba(11,15,20,.8);--drop-inner-bg:rgba(18,33,58,.6);--shadow:0 8px 32px rgba(0,0,0,.5);--scroll-thumb:#2a3441}.map-viewer-root.light-theme{--bg:#dfe7ee;--panel:#fffffff2;--panel-solid:#fff;--card:#f2f6fa;--field:#fff;--border:#c9d4de;--text:#1c2833;--muted:#5a6b7b;--accent:#2f7bdb;--ok:#1e9e56;--warn:#b07d0a;--err:#d9534f;--map-bg:#e9eef3;--tabs-bg:#e4eaf0;--item-bg:#f7fafc;--btn2-bg:#dde5ec;--btn2-bg-hover:#cfdbe6;--chip-bg:#dbe8f8;--chip-border:#b3cdf0;--chip-color:#1d5cad;--chip-bg-hover:#c9ddf5;--hint-color:#1d6fd6;--icon-hover-bg:#e2e9f0;--toast-bg:#fffffff2;--status-bg:#fffffff0;--ol-btn-bg:#fffffff0;--drop-bg:rgba(235,241,247,.85);--drop-inner-bg:hsla(0,0%,100%,.75);--shadow:0 8px 32px rgba(30,50,70,.18);--scroll-thumb:#c3ced8}*{box-sizing:border-box}.map-viewer-root{margin:0;position:relative;height:100%;overflow:hidden;font-family:Segoe UI,Microsoft YaHei,system-ui,sans-serif;background:var(--bg);color:var(--text)}#map{position:absolute;inset:0;background:var(--map-bg)}.sidebar-resizer{position:absolute;top:12px;bottom:52px;left:calc(var(--sidebar-width, 342px) + 6px);width:10px;cursor:col-resize;z-index:11;border-radius:4px}.sidebar-resizer:hover{background:rgba(102,153,255,.25)}#sidebar{position:absolute;top:12px;left:12px;bottom:52px;width:var(--sidebar-width,342px);display:flex;flex-direction:column;background:var(--panel);backdrop-filter:blur(10px);border:1px solid var(--border);border-radius:14px;box-shadow:var(--shadow);z-index:10;transition:transform .25s ease,opacity .25s ease}.map-viewer-root.sidebar-collapsed #sidebar{transform:translateX(-115%);opacity:0;pointer-events:none}#sidebar-open{position:absolute;top:12px;left:12px;z-index:9;width:38px;height:38px;border-radius:10px;background:var(--panel-solid);border:1px solid var(--border);color:var(--text);font-size:18px;cursor:pointer;display:none;align-items:center;justify-content:center}.map-viewer-root.sidebar-collapsed #sidebar-open{display:flex}#panel-right{position:absolute;top:12px;right:12px;bottom:52px;width:300px;display:flex;flex-direction:column;background:var(--panel);backdrop-filter:blur(10px);border:1px solid var(--border);border-radius:14px;box-shadow:var(--shadow);z-index:10;transition:transform .25s ease,opacity .25s ease}.map-viewer-root.panel-right-collapsed #panel-right{transform:translateX(115%);opacity:0;pointer-events:none}#panel-right-open{position:absolute;top:12px;right:12px;z-index:9;width:38px;height:38px;border-radius:10px;background:var(--panel-solid);border:1px solid var(--border);color:var(--text);font-size:18px;cursor:pointer;display:none;align-items:center;justify-content:center}.map-viewer-root.panel-right-collapsed #panel-right-open{display:flex}.sidebar-header{justify-content:space-between;padding:13px 14px 11px;border-bottom:1px solid var(--border);flex:none}.brand,.sidebar-header{display:flex;align-items:center}.brand{gap:10px;min-width:0}.brand h1{font-size:15px;margin:0;white-space:nowrap}.brand p{margin:0;font-size:11px;color:var(--muted)}.logo{font-size:22px}#sidebar-collapse,.header-actions button{background:transparent;border:1px solid var(--border);color:var(--muted);border-radius:7px;width:28px;height:28px;font-size:14px;cursor:pointer;flex:none;display:flex;align-items:center;justify-content:center;transition:.15s}#sidebar-collapse:hover,.header-actions button:hover{color:var(--text);border-color:var(--accent)}.header-actions{display:flex;gap:6px;flex:none}.sidebar-body{overflow:auto;padding:12px 14px 16px;flex:1;display:flex;flex-direction:column;gap:12px}.sidebar-body::-webkit-scrollbar{width:8px}.sidebar-body::-webkit-scrollbar-thumb{background:var(--scroll-thumb);border-radius:4px}.block{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);padding:10px 12px;flex:none}.block h2{font-size:12px;margin:0 0 8px;color:var(--muted);font-weight:600;letter-spacing:.05em}.tabs{display:flex;flex-wrap:wrap;gap:4px;background:var(--tabs-bg);padding:4px;border-radius:8px;margin-bottom:10px}.tab-btn{flex:1 1 calc(33.33% - 3px);padding:7px 4px;font-size:12px;border:none;border-radius:6px;background:transparent;color:var(--muted);cursor:pointer;transition:.15s}.tab-btn.active{background:var(--accent);color:#fff}.source-tabs .tab-btn,.source-type-tabs .tab-btn{flex:1}.tab-pane{display:none}.tab-pane.active,label{display:block}label{font-size:12px;color:var(--muted);margin-bottom:6px}input[type=number],input[type=text],select{width:100%;background:var(--field);color:var(--text);border:1px solid var(--border);border-radius:7px;padding:7px 9px;font-size:13px;outline:none;font-family:inherit}input:focus,select:focus{border-color:var(--accent)}.file-btn{display:flex;justify-content:center;align-items:center;width:100%;padding:9px;background:var(--accent);border-radius:8px;color:#fff;font-size:13px;cursor:pointer;margin:0 0 6px;transition:.15s}.file-btn:hover{filter:brightness(1.12)}.file-name{font-size:11.5px;color:var(--muted);margin-bottom:8px;word-break:break-all;min-height:15px}.extent-grid{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin:8px 0 2px}.grid-caption{display:block;font-size:11px;color:var(--muted);margin:10px 0 0}.extent-grid label{margin:0}.zoom-range{display:grid;grid-template-columns:1fr 1fr;gap:6px}.check{display:flex;gap:7px;align-items:center;font-size:12.5px;color:var(--text);margin:8px 0;cursor:pointer}.check input{width:auto;margin:0}.hint{font-size:11.5px;color:var(--hint-color);margin:6px 0;line-height:1.8;min-height:0}.chip{display:inline-block;margin:2px 3px 0 0;padding:2px 9px;font-size:11px;background:var(--chip-bg);color:var(--chip-color);border:1px solid var(--chip-border);border-radius:20px;cursor:pointer}.chip:hover{background:var(--chip-bg-hover)}.tip{font-size:11px;color:var(--muted);line-height:1.6;margin:8px 0 0}.primary-btn{width:100%;padding:11px;font-size:14px;font-weight:600;color:#fff;background:linear-gradient(135deg,#3f8cff,#2f6fd8);border:none;border-radius:9px;cursor:pointer;flex:none;transition:.15s}.primary-btn:hover{filter:brightness(1.12)}.row{display:flex;gap:6px;margin-bottom:6px}.row input,.row select{flex:1;min-width:0}.mini-btn{padding:7px 12px;background:var(--btn2-bg);border:none;border-radius:7px;color:var(--text);cursor:pointer;font-size:12px;white-space:nowrap}.mini-btn:hover{background:var(--btn2-bg-hover)}.custom-crs{margin-top:8px}#map-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px}#map-list .empty{color:var(--muted);font-size:12px;text-align:center;padding:10px 0}.map-item{display:flex;justify-content:space-between;align-items:center;gap:6px;background:var(--item-bg);border:1px solid var(--border);border-radius:8px;padding:7px 9px;cursor:pointer;transition:border-color .15s,background .15s}.map-item.active,.map-item:hover{border-color:var(--accent)}.map-item.active{background:var(--chip-bg)}.map-item.active .map-name{color:var(--accent)}.map-info{min-width:0;display:flex;flex-direction:column;gap:2px}.map-name{font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.map-meta{font-size:10.5px;color:var(--muted)}.map-actions{display:flex;gap:2px;flex:none}.icon-btn{background:transparent;border:none;color:var(--muted);font-size:13px;cursor:pointer;padding:4px 5px;border-radius:5px}.icon-btn:hover{background:var(--icon-hover-bg);color:var(--text)}#statusbar{position:absolute;left:0;right:0;bottom:0;height:34px;gap:20px;padding:0 14px;background:var(--status-bg);backdrop-filter:blur(8px);border-top:1px solid var(--border);z-index:10;font-size:12px;color:var(--muted)}#statusbar,.status-seg{display:flex;align-items:center}.status-seg{min-width:0;white-space:nowrap}#status-info{margin-left:auto}#statusbar .ol-mouse-position{position:static;color:var(--text);font-variant-numeric:tabular-nums;font-size:12px}#statusbar .ol-scale-line{position:static;background:transparent;padding:0;border:none}#statusbar .ol-scale-line-inner{color:var(--muted);border-color:var(--muted);font-size:11px}.ol-zoom{top:8px}.ol-fit-all,.ol-zoom{left:calc(var(--sidebar-width, 342px) + 24px)}.ol-fit-all{top:84px}.ol-full-screen{left:calc(var(--sidebar-width, 342px) + 24px);right:auto;top:126px}.ol-attribution{right:calc(var(--sidebar-width, 342px) - 6px);bottom:42px}.map-viewer-root.sidebar-collapsed .ol-fit-all,.map-viewer-root.sidebar-collapsed .ol-full-screen,.map-viewer-root.sidebar-collapsed .ol-zoom{left:58px}.ol-control button{background:var(--ol-btn-bg);color:var(--text);border:1px solid var(--border);border-radius:6px;font-size:16px;cursor:pointer}.ol-fit-all button,.ol-full-screen button,.ol-zoom button{width:32px;height:32px;box-sizing:border-box;margin:1px}.ol-control button:hover{background:var(--accent);color:#fff}.ol-attribution{background:var(--status-bg)!important}.ol-attribution a,.ol-attribution ul{color:var(--muted)!important;font-size:11px}#drop-overlay{position:absolute;inset:0;display:none;align-items:center;justify-content:center;background:var(--drop-bg);z-index:25}#drop-overlay.show{display:flex}#drop-overlay>div{border:2px dashed var(--accent);border-radius:16px;padding:40px 60px;font-size:18px;color:var(--accent);background:var(--drop-inner-bg)}#toast{position:absolute;top:16px;left:50%;transform:translate(-50%,-12px);background:var(--toast-bg);border:1px solid var(--border);color:var(--text);padding:9px 16px;border-radius:9px;font-size:13px;opacity:0;pointer-events:none;transition:.25s;z-index:30;max-width:72vw;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}#toast.show{opacity:1;transform:translate(-50%)}#toast[data-type=ok]{border-color:var(--ok)}#toast[data-type=warn]{border-color:var(--warn)}#toast[data-type=err]{border-color:var(--err)}@media (max-width:900px){#panel-right,#sidebar{width:calc(100vw - 24px)}}.dialog-overlay{position:absolute;inset:0;z-index:25;background:rgba(10,14,18,.55);display:none;align-items:center;justify-content:center}.dialog,.dialog-overlay.show{display:flex}.dialog{width:384px;max-width:calc(100vw - 24px);max-height:calc(100% - 24px);flex-direction:column;background:var(--panel-solid);border:1px solid var(--border);border-radius:14px;box-shadow:var(--shadow)}.dialog-header{display:flex;justify-content:space-between;align-items:center;padding:13px 16px;border-bottom:1px solid var(--border);flex:none}.dialog-header button{background:transparent;border:1px solid var(--border);color:var(--muted);border-radius:7px;width:28px;height:28px;font-size:14px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:.15s}.dialog-header button:hover{color:var(--text);border-color:var(--accent)}.dialog-body{overflow-y:auto;padding:12px 16px 16px;display:flex;flex-direction:column;gap:12px}.dialog-body::-webkit-scrollbar{width:8px}.dialog-body::-webkit-scrollbar-thumb{background:var(--scroll-thumb);border-radius:4px}#view-crs-block{flex:none}#view-crs-block .row{margin-bottom:4px}#view-crs-block .row select{padding:5px 8px;font-size:12px}#view-crs-block .grid-caption{margin:5px 0 0}#view-crs-block .extent-grid{gap:4px;margin:5px 0 0}#view-crs-block .extent-grid input[type=number]{padding:4px 7px;font-size:11.5px;border-radius:6px}#layer-list-block{flex:1 1 auto;min-height:200px;display:flex;flex-direction:column;overflow:hidden}#layer-list-block h2{flex:none}#layer-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px;flex:1 1 auto;min-height:0;overflow-y:auto;padding-right:2px}#layer-list::-webkit-scrollbar{width:8px}#layer-list::-webkit-scrollbar-thumb{background:var(--scroll-thumb);border-radius:4px}.layer-item{display:flex;justify-content:space-between;align-items:center;gap:6px;background:var(--item-bg);border:1px solid var(--border);border-radius:8px;padding:7px 9px;transition:opacity .15s,border-color .15s,background .15s}.layer-item.hidden-layer{opacity:.6}.layer-item:hover{border-color:var(--accent)}.layer-group{background:var(--chip-bg)}.layer-group .layer-name{font-weight:600}.layer-child{margin-left:14px;border-left:2px solid var(--accent)}.layer-controls{display:flex;align-items:center;gap:2px;flex:none}.layer-fold{font-size:12px}.layer-info{min-width:0;display:flex;flex-direction:column;gap:2px}.layer-name{font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.layer-meta{font-size:10.5px;color:var(--muted)}.map-detail{display:flex;gap:8px;font-size:12px;margin-bottom:7px;align-items:baseline}.map-detail:last-child{margin-bottom:0}.map-detail .detail-label{color:var(--muted);flex:none;width:74px}.map-detail span:last-child{word-break:break-all;color:var(--text)}.layer-list-title{display:flex;align-items:center;justify-content:space-between;gap:8px}.layer-summary{color:var(--text);font-size:11px;font-weight:500;padding:2px 6px;border-radius:999px;background:var(--chip-bg);border:1px solid var(--chip-border);white-space:nowrap}.layer-list-hint{margin:6px 0 0;font-size:12px;color:var(--muted)}
+:host,:root{--ol-background-color:#fff;--ol-accent-background-color:#f5f5f5;--ol-subtle-background-color:hsla(0,0%,50%,.25);--ol-partial-background-color:hsla(0,0%,100%,.75);--ol-foreground-color:#333;--ol-subtle-foreground-color:#666;--ol-brand-color:#0af}.ol-box{box-sizing:border-box;border-radius:2px;border:1.5px solid var(--ol-background-color);background-color:var(--ol-partial-background-color)}.ol-mouse-position{top:8px;right:8px;position:absolute}.ol-scale-line{background:var(--ol-partial-background-color);border-radius:4px;bottom:8px;left:8px;padding:2px;position:absolute}.ol-scale-line-inner{border:1px solid var(--ol-subtle-foreground-color);border-top:none;color:var(--ol-foreground-color);font-size:10px;text-align:center;margin:1px;will-change:contents,width;transition:all .25s}.ol-scale-bar{position:absolute;bottom:8px;left:8px}.ol-scale-bar-inner{display:flex}.ol-scale-step-marker{width:1px;height:15px;background-color:var(--ol-foreground-color);float:right;z-index:10}.ol-scale-step-text{bottom:-5px;font-size:10px;z-index:11}.ol-scale-step-text,.ol-scale-text{position:absolute;color:var(--ol-foreground-color);text-shadow:-1.5px 0 var(--ol-partial-background-color),0 1.5px var(--ol-partial-background-color),1.5px 0 var(--ol-partial-background-color),0 -1.5px var(--ol-partial-background-color)}.ol-scale-text{font-size:12px;text-align:center;bottom:25px}.ol-scale-singlebar{position:relative;height:10px;z-index:9;box-sizing:border-box;border:1px solid var(--ol-foreground-color)}.ol-scale-singlebar-even{background-color:var(--ol-subtle-foreground-color)}.ol-scale-singlebar-odd{background-color:var(--ol-background-color)}.ol-unsupported{display:none}.ol-unselectable,.ol-viewport{-webkit-touch-callout:none;-webkit-user-select:none;-moz-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent}.ol-viewport canvas{all:unset;overflow:hidden}.ol-viewport{touch-action:pan-x pan-y}.ol-selectable{-webkit-touch-callout:default;-webkit-user-select:text;-moz-user-select:text;user-select:text}.ol-grabbing{cursor:grabbing}.ol-grab{cursor:move;cursor:grab}.ol-control{position:absolute;background-color:var(--ol-subtle-background-color);border-radius:4px}.ol-zoom{top:.5em;left:.5em}.ol-rotate{top:.5em;right:.5em;transition:opacity .25s linear,visibility 0s linear}.ol-rotate.ol-hidden{opacity:0;visibility:hidden;transition:opacity .25s linear,visibility 0s linear .25s}.ol-zoom-extent{top:4.643em;left:.5em}.ol-full-screen{right:.5em;top:.5em}.ol-control button{display:block;margin:1px;padding:0;color:var(--ol-subtle-foreground-color);font-weight:700;text-decoration:none;font-size:inherit;text-align:center;height:1.375em;width:1.375em;line-height:.4em;background-color:var(--ol-background-color);border:none;border-radius:2px}.ol-control button::-moz-focus-inner{border:none;padding:0}.ol-zoom-extent button{line-height:1.4em}.ol-compass{display:block;font-weight:400;will-change:transform}.ol-touch .ol-control button{font-size:1.5em}.ol-touch .ol-zoom-extent{top:5.5em}.ol-control button:focus,.ol-control button:hover{text-decoration:none;outline:1px solid var(--ol-subtle-foreground-color);color:var(--ol-foreground-color)}.ol-zoom .ol-zoom-in{border-radius:2px 2px 0 0}.ol-zoom .ol-zoom-out{border-radius:0 0 2px 2px}.ol-attribution{text-align:right;bottom:.5em;right:.5em;max-width:calc(100% - 1.3em);display:flex;flex-flow:row-reverse;align-items:center}.ol-attribution a{color:var(--ol-subtle-foreground-color);text-decoration:none}.ol-attribution ul{margin:0;padding:1px .5em;color:var(--ol-foreground-color);text-shadow:0 0 2px var(--ol-background-color);font-size:12px}.ol-attribution li{display:inline;list-style:none}.ol-attribution li:not(:last-child):after{content:" "}.ol-attribution img{max-height:2em;max-width:inherit;vertical-align:middle}.ol-attribution button{flex-shrink:0}.ol-attribution.ol-collapsed ul{display:none}.ol-attribution:not(.ol-collapsed){background:var(--ol-partial-background-color)}.ol-attribution.ol-uncollapsible{bottom:0;right:0;border-radius:4px 0 0}.ol-attribution.ol-uncollapsible img{margin-top:-.2em;max-height:1.6em}.ol-attribution.ol-uncollapsible button{display:none}.ol-zoomslider{top:4.5em;left:.5em;height:200px}.ol-zoomslider button{position:relative;height:10px}.ol-touch .ol-zoomslider{top:5.5em}.ol-overviewmap{left:.5em;bottom:.5em}.ol-overviewmap.ol-uncollapsible{bottom:0;left:0;border-radius:0 4px 0 0}.ol-overviewmap .ol-overviewmap-map,.ol-overviewmap button{display:block}.ol-overviewmap .ol-overviewmap-map{border:1px solid var(--ol-subtle-foreground-color);height:150px;width:150px}.ol-overviewmap:not(.ol-collapsed) button{bottom:0;left:0;position:absolute}.ol-overviewmap.ol-collapsed .ol-overviewmap-map,.ol-overviewmap.ol-uncollapsible button{display:none}.ol-overviewmap:not(.ol-collapsed){background:var(--ol-subtle-background-color)}.ol-overviewmap-box{border:1.5px dotted var(--ol-subtle-foreground-color)}.ol-overviewmap .ol-overviewmap-box:hover{cursor:move}.ol-overviewmap .ol-viewport:hover{cursor:pointer}.map-viewer-root{--bg:#0f1419;--panel:#171e26f2;--panel-solid:#171e26;--card:#1c2530;--field:#0e141b;--border:#2a3441;--text:#e8edf3;--muted:#9aa7b4;--accent:#3f8cff;--ok:#39c26d;--warn:#e8b339;--err:#ff6b6b;--radius:10px;--map-bg:#0b0f14;--tabs-bg:#141b23;--item-bg:#141b23;--btn2-bg:#2a3a4d;--btn2-bg-hover:#35485f;--chip-bg:#223450;--chip-border:#33517a;--chip-color:#bcd7ff;--chip-bg-hover:#2c4266;--hint-color:#8fbcff;--icon-hover-bg:#22304a;--toast-bg:#1c2530f2;--status-bg:#10151bd9;--ol-btn-bg:#1c2530dd;--drop-bg:rgba(11,15,20,.8);--drop-inner-bg:rgba(18,33,58,.6);--shadow:0 8px 32px rgba(0,0,0,.5);--scroll-thumb:#2a3441}.map-viewer-root.light-theme{--bg:#dfe7ee;--panel:#fffffff2;--panel-solid:#fff;--card:#f2f6fa;--field:#fff;--border:#c9d4de;--text:#1c2833;--muted:#5a6b7b;--accent:#2f7bdb;--ok:#1e9e56;--warn:#b07d0a;--err:#d9534f;--map-bg:#e9eef3;--tabs-bg:#e4eaf0;--item-bg:#f7fafc;--btn2-bg:#dde5ec;--btn2-bg-hover:#cfdbe6;--chip-bg:#dbe8f8;--chip-border:#b3cdf0;--chip-color:#1d5cad;--chip-bg-hover:#c9ddf5;--hint-color:#1d6fd6;--icon-hover-bg:#e2e9f0;--toast-bg:#fffffff2;--status-bg:#fffffff0;--ol-btn-bg:#fffffff0;--drop-bg:rgba(235,241,247,.85);--drop-inner-bg:hsla(0,0%,100%,.75);--shadow:0 8px 32px rgba(30,50,70,.18);--scroll-thumb:#c3ced8}*{box-sizing:border-box}.map-viewer-root{margin:0;position:relative;height:100%;overflow:hidden;font-family:Segoe UI,Microsoft YaHei,system-ui,sans-serif;background:var(--bg);color:var(--text)}#map{position:absolute;inset:0;background:var(--map-bg)}.sidebar-resizer{position:absolute;top:12px;bottom:52px;left:calc(var(--sidebar-width, 342px) + 6px);width:10px;cursor:col-resize;z-index:11;border-radius:4px}.sidebar-resizer:hover{background:rgba(102,153,255,.25)}.map-loading-mask{position:absolute;inset:0;z-index:5;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;background:var(--map-bg);opacity:.75}.map-loading-spinner{width:34px;height:34px;border:3px solid var(--border);border-top-color:var(--accent);border-radius:50%;animation:map-loading-spin .9s linear infinite}.map-loading-text{color:var(--text);font-size:13px}@keyframes map-loading-spin{to{transform:rotate(1turn)}}#sidebar{position:absolute;top:12px;left:12px;bottom:52px;width:var(--sidebar-width,342px);display:flex;flex-direction:column;background:var(--panel);backdrop-filter:blur(10px);border:1px solid var(--border);border-radius:14px;box-shadow:var(--shadow);z-index:10;transition:transform .25s ease,opacity .25s ease}.map-viewer-root.sidebar-collapsed #sidebar{transform:translateX(-115%);opacity:0;pointer-events:none}#sidebar-open{position:absolute;top:12px;left:12px;z-index:9;width:38px;height:38px;border-radius:10px;background:var(--panel-solid);border:1px solid var(--border);color:var(--text);font-size:18px;cursor:pointer;display:none;align-items:center;justify-content:center}.map-viewer-root.sidebar-collapsed #sidebar-open{display:flex}#panel-right{position:absolute;top:12px;right:12px;bottom:52px;width:300px;display:flex;flex-direction:column;background:var(--panel);backdrop-filter:blur(10px);border:1px solid var(--border);border-radius:14px;box-shadow:var(--shadow);z-index:10;transition:transform .25s ease,opacity .25s ease}.map-viewer-root.panel-right-collapsed #panel-right{transform:translateX(115%);opacity:0;pointer-events:none}#panel-right-open{position:absolute;top:12px;right:12px;z-index:9;width:38px;height:38px;border-radius:10px;background:var(--panel-solid);border:1px solid var(--border);color:var(--text);font-size:18px;cursor:pointer;display:none;align-items:center;justify-content:center}.map-viewer-root.panel-right-collapsed #panel-right-open{display:flex}.sidebar-header{justify-content:space-between;padding:13px 14px 11px;border-bottom:1px solid var(--border);flex:none}.brand,.sidebar-header{display:flex;align-items:center}.brand{gap:10px;min-width:0}.brand h1{font-size:15px;margin:0;white-space:nowrap}.brand p{margin:0;font-size:11px;color:var(--muted)}.logo{font-size:22px}#sidebar-collapse,.header-actions button{background:transparent;border:1px solid var(--border);color:var(--muted);border-radius:7px;width:28px;height:28px;font-size:14px;cursor:pointer;flex:none;display:flex;align-items:center;justify-content:center;transition:.15s}#sidebar-collapse:hover,.header-actions button:hover{color:var(--text);border-color:var(--accent)}.header-actions{display:flex;gap:6px;flex:none}.sidebar-body{overflow:auto;padding:12px 14px 16px;flex:1;display:flex;flex-direction:column;gap:12px}.sidebar-body::-webkit-scrollbar{width:8px}.sidebar-body::-webkit-scrollbar-thumb{background:var(--scroll-thumb);border-radius:4px}.block{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);padding:10px 12px;flex:none}.block h2{font-size:12px;margin:0 0 8px;color:var(--muted);font-weight:600;letter-spacing:.05em}.tabs{display:flex;flex-wrap:wrap;gap:4px;background:var(--tabs-bg);padding:4px;border-radius:8px;margin-bottom:10px}.tab-btn{flex:1 1 calc(33.33% - 3px);padding:7px 4px;font-size:12px;border:none;border-radius:6px;background:transparent;color:var(--muted);cursor:pointer;transition:.15s}.tab-btn.active{background:var(--accent);color:#fff}.source-tabs .tab-btn,.source-type-tabs .tab-btn{flex:1}.tab-pane{display:none}.tab-pane.active,label{display:block}label{font-size:12px;color:var(--muted);margin-bottom:6px}input[type=number],input[type=text],select{width:100%;background:var(--field);color:var(--text);border:1px solid var(--border);border-radius:7px;padding:7px 9px;font-size:13px;outline:none;font-family:inherit}input:focus,select:focus{border-color:var(--accent)}.file-btn{display:flex;justify-content:center;align-items:center;width:100%;padding:9px;background:var(--accent);border-radius:8px;color:#fff;font-size:13px;cursor:pointer;margin:0 0 6px;transition:.15s}.file-btn:hover{filter:brightness(1.12)}.file-name{font-size:11.5px;color:var(--muted);margin-bottom:8px;word-break:break-all;min-height:15px}.extent-grid{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin:8px 0 2px}.grid-caption{display:block;font-size:11px;color:var(--muted);margin:10px 0 0}.extent-grid label{margin:0}.zoom-range{display:grid;grid-template-columns:1fr 1fr;gap:6px}.check{display:flex;gap:7px;align-items:center;font-size:12.5px;color:var(--text);margin:8px 0;cursor:pointer}.check input{width:auto;margin:0}.hint{font-size:11.5px;color:var(--hint-color);margin:6px 0;line-height:1.8;min-height:0}.chip{display:inline-block;margin:2px 3px 0 0;padding:2px 9px;font-size:11px;background:var(--chip-bg);color:var(--chip-color);border:1px solid var(--chip-border);border-radius:20px;cursor:pointer}.chip:hover{background:var(--chip-bg-hover)}.tip{font-size:11px;color:var(--muted);line-height:1.6;margin:8px 0 0}.primary-btn{width:100%;padding:11px;font-size:14px;font-weight:600;color:#fff;background:linear-gradient(135deg,#3f8cff,#2f6fd8);border:none;border-radius:9px;cursor:pointer;flex:none;transition:.15s}.primary-btn:hover{filter:brightness(1.12)}.row{display:flex;gap:6px;margin-bottom:6px}.row input,.row select{flex:1;min-width:0}.mini-btn{padding:7px 12px;background:var(--btn2-bg);border:none;border-radius:7px;color:var(--text);cursor:pointer;font-size:12px;white-space:nowrap}.mini-btn:hover{background:var(--btn2-bg-hover)}.custom-crs{margin-top:8px}#map-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px}#map-list .empty{color:var(--muted);font-size:12px;text-align:center;padding:10px 0}.map-item{display:flex;justify-content:space-between;align-items:center;gap:6px;background:var(--item-bg);border:1px solid var(--border);border-radius:8px;padding:7px 9px;cursor:pointer;transition:border-color .15s,background .15s}.map-item.active,.map-item:hover{border-color:var(--accent)}.map-item.active{background:var(--chip-bg)}.map-item.active .map-name{color:var(--accent)}.map-info{min-width:0;display:flex;flex-direction:column;gap:2px}.map-name{font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.map-meta{font-size:10.5px;color:var(--muted)}.map-actions{display:flex;gap:2px;flex:none}.icon-btn{background:transparent;border:none;color:var(--muted);font-size:13px;cursor:pointer;padding:4px 5px;border-radius:5px}.icon-btn:hover{background:var(--icon-hover-bg);color:var(--text)}#statusbar{position:absolute;left:0;right:0;bottom:0;height:34px;gap:20px;padding:0 14px;background:var(--status-bg);backdrop-filter:blur(8px);border-top:1px solid var(--border);z-index:10;font-size:12px;color:var(--muted)}#statusbar,.status-seg{display:flex;align-items:center}.status-seg{min-width:0;white-space:nowrap}#status-info{margin-left:auto}#statusbar .ol-mouse-position{position:static;color:var(--text);font-variant-numeric:tabular-nums;font-size:12px}#statusbar .ol-scale-line{position:static;background:transparent;padding:0;border:none}#statusbar .ol-scale-line-inner{color:var(--muted);border-color:var(--muted);font-size:11px}.ol-zoom{top:8px}.ol-fit-all,.ol-zoom{left:calc(var(--sidebar-width, 342px) + 24px)}.ol-fit-all{top:84px}.ol-full-screen{left:calc(var(--sidebar-width, 342px) + 24px);right:auto;top:126px}.ol-attribution{right:calc(var(--sidebar-width, 342px) - 6px);bottom:42px}.map-viewer-root.sidebar-collapsed .ol-fit-all,.map-viewer-root.sidebar-collapsed .ol-full-screen,.map-viewer-root.sidebar-collapsed .ol-zoom{left:58px}.ol-control button{background:var(--ol-btn-bg);color:var(--text);border:1px solid var(--border);border-radius:6px;font-size:16px;cursor:pointer}.ol-fit-all button,.ol-full-screen button,.ol-zoom button{width:32px;height:32px;box-sizing:border-box;margin:1px}.ol-control button:hover{background:var(--accent);color:#fff}.ol-attribution{background:var(--status-bg)!important}.ol-attribution a,.ol-attribution ul{color:var(--muted)!important;font-size:11px}#drop-overlay{position:absolute;inset:0;display:none;align-items:center;justify-content:center;background:var(--drop-bg);z-index:25}#drop-overlay.show{display:flex}#drop-overlay>div{border:2px dashed var(--accent);border-radius:16px;padding:40px 60px;font-size:18px;color:var(--accent);background:var(--drop-inner-bg)}#toast{position:absolute;top:16px;left:50%;transform:translate(-50%,-12px);background:var(--toast-bg);border:1px solid var(--border);color:var(--text);padding:9px 16px;border-radius:9px;font-size:13px;opacity:0;pointer-events:none;transition:.25s;z-index:30;max-width:72vw;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}#toast.show{opacity:1;transform:translate(-50%)}#toast[data-type=ok]{border-color:var(--ok)}#toast[data-type=warn]{border-color:var(--warn)}#toast[data-type=err]{border-color:var(--err)}@media (max-width:900px){#panel-right,#sidebar{width:calc(100vw - 24px)}}.dialog-overlay{position:absolute;inset:0;z-index:25;background:rgba(10,14,18,.55);display:none;align-items:center;justify-content:center}.dialog,.dialog-overlay.show{display:flex}.dialog{width:384px;max-width:calc(100vw - 24px);max-height:calc(100% - 24px);flex-direction:column;background:var(--panel-solid);border:1px solid var(--border);border-radius:14px;box-shadow:var(--shadow)}.dialog-header{display:flex;justify-content:space-between;align-items:center;padding:13px 16px;border-bottom:1px solid var(--border);flex:none}.dialog-header button{background:transparent;border:1px solid var(--border);color:var(--muted);border-radius:7px;width:28px;height:28px;font-size:14px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:.15s}.dialog-header button:hover{color:var(--text);border-color:var(--accent)}.dialog-body{overflow-y:auto;padding:12px 16px 16px;display:flex;flex-direction:column;gap:12px}.dialog-body::-webkit-scrollbar{width:8px}.dialog-body::-webkit-scrollbar-thumb{background:var(--scroll-thumb);border-radius:4px}#view-crs-block{flex:none}#view-crs-block .row{margin-bottom:4px}#view-crs-block .row select{padding:5px 8px;font-size:12px}#view-crs-block .grid-caption{margin:5px 0 0}#view-crs-block .extent-grid{gap:4px;margin:5px 0 0}#view-crs-block .extent-grid input[type=number]{padding:4px 7px;font-size:11.5px;border-radius:6px}#layer-list-block{flex:1 1 auto;min-height:200px;display:flex;flex-direction:column;overflow:hidden}#layer-list-block h2{flex:none}#layer-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px;flex:1 1 auto;min-height:0;overflow-y:auto;padding-right:2px}#layer-list::-webkit-scrollbar{width:8px}#layer-list::-webkit-scrollbar-thumb{background:var(--scroll-thumb);border-radius:4px}.layer-item{display:flex;justify-content:space-between;align-items:center;gap:6px;background:var(--item-bg);border:1px solid var(--border);border-radius:8px;padding:7px 9px;transition:opacity .15s,border-color .15s,background .15s}.layer-item.hidden-layer{opacity:.6}.layer-item:hover{border-color:var(--accent)}.layer-group{background:var(--chip-bg)}.layer-group .layer-name{font-weight:600}.layer-child{margin-left:14px;border-left:2px solid var(--accent)}.layer-controls{display:flex;align-items:center;gap:2px;flex:none}.layer-fold{font-size:12px}.layer-info{min-width:0;display:flex;flex-direction:column;gap:2px}.layer-name{font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.layer-meta{font-size:10.5px;color:var(--muted)}.map-detail{display:flex;gap:8px;font-size:12px;margin-bottom:7px;align-items:baseline}.map-detail:last-child{margin-bottom:0}.map-detail .detail-label{color:var(--muted);flex:none;width:74px}.map-detail span:last-child{word-break:break-all;color:var(--text)}.layer-list-title{display:flex;align-items:center;justify-content:space-between;gap:8px}.layer-summary{color:var(--text);font-size:11px;font-weight:500;padding:2px 6px;border-radius:999px;background:var(--chip-bg);border:1px solid var(--chip-border);white-space:nowrap}.layer-list-hint{margin:6px 0 0;font-size:12px;color:var(--muted)}