.saved-views-panel {
  --sv-surface:#f7fafc;--sv-card:#fff;--sv-ink:#173e55;--sv-muted:#637d8b;--sv-line:#d7e4ec;--sv-selected:#e6f1f8;--sv-accent:#14648e;
  position:fixed;width:352px;max-width:calc(100vw - 24px);z-index:6200;display:flex;flex-direction:column;overflow:hidden;box-sizing:border-box;
  background:var(--sv-surface);color:var(--sv-ink);border:1px solid var(--sv-line);border-radius:20px;box-shadow:0 12px 44px #10334930;
  font:400 15px/1.45 var(--font-body,system-ui);text-shadow:none;
}
.saved-views-panel[hidden]{display:none!important}
#btnSavedViews[hidden],#mobileAppShell [data-app-target=btnSavedViews][hidden]{display:none!important}
html[data-theme=dark] .saved-views-panel{--sv-surface:#162631;--sv-card:#203442;--sv-ink:#e8f2fa;--sv-muted:#aac0ce;--sv-line:#395362;--sv-selected:#2e5067;--sv-accent:#277ca9;--sv-marker:#8dcee9}
.saved-views-panel svg{width:22px;height:22px;flex:none;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.saved-views-panel button,.saved-views-panel input{font:inherit;letter-spacing:normal;text-transform:none;cursor:pointer}
.saved-views-panel button{border:0;box-shadow:none}
.saved-views-panel button:disabled{opacity:.5;cursor:default}
.saved-views-panel :focus-visible{outline:3px solid #52a9d1;outline-offset:2px}
.saved-views-header{display:flex;align-items:center;gap:10px;padding:18px 16px 14px;flex:none;border-bottom:1px solid var(--sv-line)}
.saved-views-mark{display:grid;place-items:center;width:40px;height:44px;flex:none;border-radius:12px;background:var(--sv-selected);color:var(--sv-accent)}
.saved-views-header>div:nth-child(2){flex:1;min-width:0}
.saved-views-header h2{font:700 21px/1.2 var(--font-body,system-ui);margin:0 0 3px;color:var(--sv-ink)}
.saved-views-icon{display:grid;place-items:center;width:36px;height:36px;border-radius:12px;background:var(--sv-selected);color:var(--sv-ink);flex:none;padding:0}
.saved-views-icon>span{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
.saved-views-capture{padding:16px 16px 8px;flex:none}
.saved-views-primary{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;min-height:46px;padding:10px 16px;background:var(--sv-accent);color:white;border-radius:12px;font-weight:700!important}
.saved-views-primary:hover:enabled{filter:brightness(1.1)}
.saved-views-list{padding:4px 16px 16px;min-height:0;overflow:auto;overscroll-behavior:contain;display:flex;flex-direction:column;gap:12px}
.saved-views-arrange{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:0 16px 12px;flex:none;font-size:12px;color:var(--sv-muted)}
.saved-view-order{display:flex;align-items:center;gap:8px;padding:0 12px 12px;color:var(--sv-muted);font-size:12px}
.saved-view-order>span{flex:1}
.saved-view-order .saved-views-icon{width:44px;height:44px;border-radius:10px}
.saved-view-heading{display:flex;align-items:center;min-width:0}
.saved-view-heading .saved-view-open{flex:1;min-width:0;width:auto}
.saved-views-panel .saved-view-drag{margin-left:10px;width:44px;height:44px;cursor:grab;touch-action:none;user-select:none;-webkit-user-select:none}
.saved-view-drag svg{stroke-width:4}
.saved-view-drag:active{cursor:grabbing}
.saved-view-card.is-dragging{opacity:.5;border-style:dashed}
.saved-view-card.is-drop-before{box-shadow:0 -4px var(--sv-accent)}
.saved-view-card.is-drop-after{box-shadow:0 4px var(--sv-accent)}
.saved-views-status{margin:0 16px 10px;padding:10px 12px;border-radius:10px;background:var(--sv-selected);font-size:13px;flex:none}
.saved-views-status.is-error{color:#9a3439;background:#fdecee}
html[data-theme=dark] .saved-views-status.is-error{color:#ffd5d8;background:#4a2b35}
.saved-view-card{border:1px solid var(--sv-line);border-radius:14px;background:var(--sv-card);flex:none;overflow:hidden}
.saved-view-card.is-opened{border-color:#3281a7;box-shadow:inset 3px 0 #3281a7}
.saved-view-open{padding:14px 12px 10px;width:100%;display:flex;align-items:center;text-align:left;gap:10px;color:var(--sv-ink);background:transparent;min-height:78px}
.saved-view-open:hover:enabled{background:var(--sv-selected)}
.saved-view-open>svg{width:18px;height:18px;color:var(--sv-muted)}
.saved-view-number{font-size:12px;font-weight:700;background:var(--sv-selected);color:var(--sv-marker,var(--sv-accent));width:32px;height:36px;display:grid;place-items:center;border-radius:9px;flex:none}
.saved-view-info{flex:1;min-width:0;display:grid;gap:4px}
.saved-view-info strong{font-size:15px;font-weight:650;overflow-wrap:anywhere;color:var(--sv-ink);line-height:1.3}
.saved-view-info>span,.saved-view-query{font-size:12px;color:var(--sv-muted)}
.saved-view-query{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.saved-view-actions{display:flex;align-items:center;gap:6px;padding:0 10px 9px 12px}
.saved-view-actions time{flex:1;font-size:11px;color:var(--sv-muted)}
.saved-view-action{display:flex;align-items:center;justify-content:center;gap:5px;padding:5px 7px;min-height:34px;border-radius:8px;color:var(--sv-muted);background:transparent;font-size:12px!important}
.saved-view-action svg{width:15px;height:15px}
.saved-view-action:hover:enabled{background:var(--sv-selected);color:var(--sv-ink)}
.saved-views-secondary{padding:8px 12px;min-height:38px;background:var(--sv-selected);color:var(--sv-ink);border-radius:9px;font-weight:600!important}
.saved-views-secondary.is-danger{background:#bc3a49;color:white}
.saved-view-rename,.saved-view-delete{padding:4px 12px 12px}
.saved-view-rename label{display:block;font-size:12px;margin:0 0 6px;font-weight:600}
.saved-view-rename input{width:100%;min-height:42px;padding:8px;box-sizing:border-box;border:1px solid var(--sv-line);border-radius:9px;color:var(--sv-ink);background:var(--sv-surface);cursor:text}
.saved-view-rename>div,.saved-view-delete>div{display:flex;justify-content:flex-end;gap:8px;margin-top:8px}
.saved-view-delete p{margin:2px 0 8px;font-size:13px;color:var(--sv-muted)}
.saved-views-empty{text-align:center;padding:22px 8px 28px;color:var(--sv-muted)}
.saved-views-empty h3{font:600 17px/1.3 var(--font-body,system-ui);color:var(--sv-ink);margin:16px 0 8px}
.saved-views-empty p{font-size:14px;margin:0;line-height:1.6}
.saved-views-illustration{width:72px;height:72px;border-radius:22px;display:grid;place-items:center;background:var(--sv-selected);color:var(--sv-accent);margin:auto}
.saved-views-illustration svg{width:32px;height:32px}
.saved-views-footer{display:flex;justify-content:space-between;gap:8px;padding:12px 16px;border-top:1px solid var(--sv-line);font-size:12px;color:var(--sv-muted);flex:none}
html:not([data-app-layout=phone]):not([data-app-layout=tablet]) .saved-views-panel{width:352px;border-radius:12px;font-size:12px}
html:not([data-app-layout=phone]):not([data-app-layout=tablet]) .saved-views-header{padding:10px;gap:6px}
html:not([data-app-layout=phone]):not([data-app-layout=tablet]) .saved-views-mark{display:none}
html:not([data-app-layout=phone]):not([data-app-layout=tablet]) .saved-views-header h2{font-size:16px;margin:0}
html:not([data-app-layout=phone]):not([data-app-layout=tablet]) .saved-views-icon{width:28px;height:28px;border-radius:8px}
html:not([data-app-layout=phone]):not([data-app-layout=tablet]) .saved-views-panel svg{width:17px;height:17px}
html:not([data-app-layout=phone]):not([data-app-layout=tablet]) .saved-views-capture{padding:10px}
html:not([data-app-layout=phone]):not([data-app-layout=tablet]) .saved-views-primary{padding:8px 6px;min-height:38px;gap:4px;border-radius:8px}
html:not([data-app-layout=phone]):not([data-app-layout=tablet]) .saved-views-list{padding:0 10px 10px;gap:8px}
html:not([data-app-layout=phone]):not([data-app-layout=tablet]) .saved-views-status{margin:0 10px 8px;padding:8px;font-size:11px}
html:not([data-app-layout=phone]):not([data-app-layout=tablet]) .saved-views-arrange{padding:0 10px 8px;flex-wrap:wrap;font-size:11px;gap:6px}
html:not([data-app-layout=phone]):not([data-app-layout=tablet]) .saved-views-secondary{padding:6px 8px;min-height:30px}
html:not([data-app-layout=phone]):not([data-app-layout=tablet]) .saved-view-open{padding:10px 8px;gap:6px;min-height:64px}
html:not([data-app-layout=phone]):not([data-app-layout=tablet]) .saved-view-number{width:23px;height:28px;border-radius:6px;font-size:10px}
html:not([data-app-layout=phone]):not([data-app-layout=tablet]) .saved-view-info strong{font-size:12px}
html:not([data-app-layout=phone]):not([data-app-layout=tablet]) .saved-view-info>span{font-size:10px}
html:not([data-app-layout=phone]):not([data-app-layout=tablet]) .saved-view-open>svg{width:13px;height:13px}
html:not([data-app-layout=phone]):not([data-app-layout=tablet]) .saved-view-actions{padding:0 6px 6px;gap:2px;flex-wrap:wrap}
html:not([data-app-layout=phone]):not([data-app-layout=tablet]) .saved-view-actions time{flex-basis:100%;padding-left:3px;font-size:10px}
html:not([data-app-layout=phone]):not([data-app-layout=tablet]) .saved-view-action{font-size:11px!important;padding:4px;min-height:28px;gap:3px}
html:not([data-app-layout=phone]):not([data-app-layout=tablet]) .saved-view-rename,html:not([data-app-layout=phone]):not([data-app-layout=tablet]) .saved-view-delete{padding:4px 8px 8px}
html:not([data-app-layout=phone]):not([data-app-layout=tablet]) :is(.saved-view-rename,.saved-view-delete)>div{flex-wrap:wrap;gap:4px}
html:not([data-app-layout=phone]):not([data-app-layout=tablet]) .saved-view-drag{margin-left:5px}
html:not([data-app-layout=phone]):not([data-app-layout=tablet]) .saved-view-order{padding:0 8px 8px;font-size:10px}
html:not([data-app-layout=phone]):not([data-app-layout=tablet]) .saved-views-footer{padding:8px 10px;font-size:10px;flex-wrap:wrap}
html:not([data-app-layout=phone]):not([data-app-layout=tablet]) .saved-views-empty{padding:12px 0}
html:not([data-app-layout=phone]):not([data-app-layout=tablet]) .saved-views-empty h3{font-size:13px;margin:10px 0 0}
html:not([data-app-layout=phone]):not([data-app-layout=tablet]) .saved-views-illustration{width:40px;height:40px;border-radius:12px}
html[data-app-layout=phone] .saved-views-panel{inset:auto 0 var(--app-nav-height)!important;width:100%;max-width:none;border-radius:24px 24px 0 0;max-height:calc(var(--app-viewport-height,100dvh) - var(--app-header-height) - var(--app-nav-height) - 8px)!important}
html:is([data-app-layout=phone],[data-app-layout=tablet]) .saved-views-panel{z-index:6200}
html:is([data-app-layout=phone],[data-app-layout=tablet]) .saved-view-action{min-height:44px;min-width:70px}
html:is([data-app-layout=phone],[data-app-layout=tablet]) .saved-views-icon{width:40px;height:40px}
html[data-app-layout=phone] .saved-views-panel::before{content:'';height:4px;width:36px;margin:8px auto 0;background:var(--sv-line);border-radius:2px;flex:none}
html[data-app-layout=phone] .saved-views-header{padding-top:10px}
@media(min-width:900px){
 html[data-app-layout=tablet] body[data-app-route=layers] #mobileAppShell .app-map-controls [data-app-target=btnSavedViews]{visibility:visible!important}
 html[data-app-layout=tablet] body.saved-views-open #optionPanel.feature-panel-expanded{inset:calc(var(--app-header-height) + 20px) auto calc(var(--app-nav-height) + 12px) 108px!important;width:400px!important;height:auto!important;border-radius:20px!important}
 html[data-app-layout=tablet] body.saved-views-open #userLayerCart{inset:calc(var(--app-header-height) + 20px) auto calc(var(--app-nav-height) + 12px) 108px!important;width:340px!important;max-height:none!important}
}
@media(max-height:480px){html[data-app-layout=phone] .saved-views-panel{inset:calc(var(--app-safe-top) + 8px) 74px calc(var(--app-safe-bottom) + 8px) auto!important;width:min(352px,calc(100% - 98px));max-height:none!important;border-radius:18px}.saved-views-capture p{display:none}}
