.map-layer-trigger{
  position:absolute;top:164px;right:10px;z-index:100000;width:48px;height:58px;
  border:1px solid var(--border);border-radius:var(--radius);background:rgba(22,27,34,.96);
  color:var(--text);box-shadow:0 3px 14px rgba(0,0,0,.42);cursor:pointer;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;
  transition:border-color .18s,background .18s,transform .18s;
}
.map-layer-trigger:hover,.map-layer-trigger:focus-visible,.map-layer-trigger.active{
  border-color:var(--accent);background:var(--surface2);outline:none;
}
.map-layer-trigger:active{transform:translateY(1px)}
.map-layer-trigger img{width:24px;height:24px;display:block}
.map-layer-trigger span{font-size:11px;font-weight:700;line-height:1;letter-spacing:0}

.map-layer-mask{position:fixed;inset:0;z-index:150000;display:none;background:transparent}
.map-layer-mask.show{display:block}
.map-layer-panel{
  position:absolute;top:154px;right:68px;width:min(372px,calc(100vw - 32px));
  max-height:calc(100vh - 174px);overflow:auto;padding:16px;
  border:1px solid var(--border);border-radius:var(--radius);background:rgba(22,27,34,.98);
  color:var(--text);box-shadow:0 18px 46px rgba(0,0,0,.58);backdrop-filter:blur(12px);
  animation:mapLayerPanelIn .18s ease-out;
}
@keyframes mapLayerPanelIn{
  from{opacity:0;transform:translateY(-6px)}
  to{opacity:1;transform:none}
}
.map-layer-head{display:flex;align-items:center;justify-content:space-between;gap:12px}
.map-layer-title{font-size:16px;font-weight:800;line-height:1.2}
.map-layer-close{
  width:34px;height:34px;flex:0 0 34px;border:1px solid transparent;border-radius:6px;
  background:transparent;display:flex;align-items:center;justify-content:center;cursor:pointer;
}
.map-layer-close:hover,.map-layer-close:focus-visible{
  border-color:var(--border);background:var(--surface2);outline:none;
}
.map-layer-close img{width:22px;height:22px;display:block}
.map-layer-section{margin-top:16px}
.map-layer-section-label{display:block;margin-bottom:8px;font-size:11px;font-weight:700;color:var(--text2)}
.map-layer-choice-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.map-layer-choice{
  min-width:0;min-height:94px;padding:10px 7px;border:1px solid var(--border);
  border-radius:var(--radius);background:var(--bg);color:var(--text);cursor:pointer;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;
  transition:border-color .16s,background .16s,box-shadow .16s;
}
.map-layer-choice:hover,.map-layer-choice:focus-visible{
  border-color:var(--accent);background:var(--surface2);outline:none;
}
.map-layer-choice.active{
  border-color:var(--accent);background:rgba(88,166,255,.13);
  box-shadow:inset 0 0 0 1px rgba(88,166,255,.28);
}
.map-layer-choice img{width:28px;height:28px;display:block}
.map-layer-choice-name{max-width:100%;font-size:12px;font-weight:800;line-height:1.2;text-align:center}
.map-layer-choice-meta{max-width:100%;font-size:10px;color:var(--text2);line-height:1.2;text-align:center}

.map-layer-style-group[aria-disabled="true"]{opacity:.42}
.map-layer-style-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:7px}
.map-style-choice{
  min-width:0;height:38px;padding:0 6px;border:1px solid var(--border);border-radius:6px;
  background:var(--bg);color:var(--text2);font-size:11px;font-weight:700;cursor:pointer;
}
.map-style-choice:hover:not(:disabled),.map-style-choice:focus-visible:not(:disabled){
  border-color:var(--accent);color:var(--text);outline:none;
}
.map-style-choice.active{border-color:var(--accent);background:rgba(88,166,255,.13);color:var(--accent)}
.map-style-choice:disabled{cursor:not-allowed}

.map-layer-toggle-row{
  min-height:54px;padding:10px 12px;border:1px solid var(--border);border-radius:var(--radius);
  background:var(--bg);display:flex;align-items:center;gap:10px;cursor:pointer;
}
.map-layer-toggle-row:hover{border-color:rgba(88,166,255,.65)}
.map-layer-toggle-icon{width:28px;height:28px;flex:0 0 28px}
.map-layer-toggle-copy{min-width:0;flex:1}
.map-layer-toggle-title{display:block;font-size:12px;font-weight:800;color:var(--text)}
.map-layer-toggle-meta{display:block;margin-top:2px;font-size:10px;color:var(--text2)}
.map-layer-toggle-row input{position:absolute;opacity:0;pointer-events:none}
.map-layer-switch{
  position:relative;width:42px;height:24px;flex:0 0 42px;border:1px solid var(--border);
  border-radius:999px;background:var(--surface2);transition:background .18s,border-color .18s;
}
.map-layer-switch::after{
  content:"";position:absolute;top:3px;left:3px;width:16px;height:16px;border-radius:50%;
  background:var(--text2);transition:transform .18s,background .18s;
}
.map-layer-toggle-row input:checked + .map-layer-switch{
  border-color:var(--green);background:rgba(63,185,80,.26);
}
.map-layer-toggle-row input:checked + .map-layer-switch::after{
  transform:translateX(18px);background:#7ee787;
}
.map-layer-toggle-row input:focus-visible + .map-layer-switch{outline:2px solid var(--accent);outline-offset:2px}

@media (max-width: 720px), (pointer: coarse) and (max-width: 900px){
  .map-layer-trigger{top:154px;right:10px;width:48px;height:58px;z-index:1300}
  .map-layer-mask{background:rgba(0,0,0,.58);backdrop-filter:blur(2px)}
  .map-layer-panel{
    top:auto;left:0;right:0;bottom:0;width:100%;max-height:min(72svh,580px);
    padding:16px 14px calc(16px + env(safe-area-inset-bottom));
    border-left:0;border-right:0;border-bottom:0;border-radius:12px 12px 0 0;
    animation:mapLayerSheetIn .2s ease-out;
  }
  @keyframes mapLayerSheetIn{
    from{opacity:.7;transform:translateY(22px)}
    to{opacity:1;transform:none}
  }
  .map-layer-title{font-size:18px}
  .map-layer-close{width:38px;height:38px;flex-basis:38px}
  .map-layer-section{margin-top:18px}
  .map-layer-section-label{font-size:12px;margin-bottom:9px}
  .map-layer-choice{min-height:98px;padding:10px 6px}
  .map-layer-choice-name{font-size:12px}
  .map-layer-choice-meta{font-size:10px}
  .map-style-choice{height:42px;font-size:12px}
  .map-layer-toggle-row{min-height:58px}
}