/* Drawer map. No approved object or background assets are altered. */
.map-drawer {
  position:absolute; z-index:10; left:57%; top:85.4%; width:clamp(48px,9%,130px); height:clamp(44px,8%,78px);
  border:0; padding:0; background:none; overflow:visible; cursor:pointer; pointer-events:auto;
  -webkit-tap-highlight-color:transparent;
}
.map-drawer::before { content:''; position:absolute; inset:0; min-height:44px; }
.map-drawer:focus-visible { outline:3px solid var(--emerald); outline-offset:4px; }
.map-drawer-paper { position:absolute; left:0; top:0; width:100%; height:auto;
  transform-origin:18% 0; pointer-events:none;
  filter:drop-shadow(1px 3px 2px #0008); animation:map-paper-glimmer 3.8s ease-in-out infinite;
}
.map-drawer::after { content:''; position:absolute; left:-2%; top:-1px; width:101%; height:4px;
  background:linear-gradient(#19130ecc,transparent); pointer-events:none;
}
@keyframes map-paper-glimmer {
  0%,100% { filter:drop-shadow(1px 3px 2px #0008) drop-shadow(0 0 2px #e5d6aa00) brightness(1); }
  50% { filter:drop-shadow(1px 3px 2px #0008) drop-shadow(0 0 9px #e5d6aa99) brightness(1.12); }
}
.map-drawer[aria-expanded='true'] .map-drawer-paper { animation-play-state:paused; }
.map-drawer-motion { position:absolute; inset:0; z-index:9; pointer-events:none; visibility:hidden; }
.map-drawer-cavity,.map-drawer-front { position:absolute; left:27%; top:85.4%; width:48.1%; height:12.6%; }
.map-drawer-cavity { background:#130e0a; border:2px solid #35271b; box-shadow:inset 0 8px 15px #000; }
.map-drawer-front { background:url('assets/loading-v120/cabinet-study-unified-v2.webp') 52.023% 97.712% / 207.9% 793.65% no-repeat; transform-origin:50% 0; }
.map-drawer-opening .map-drawer-motion { visibility:visible; }
.map-drawer-opening .map-drawer-front { animation:drawer-slide 900ms cubic-bezier(.28,.08,.28,1) forwards; }
.map-drawer-opening .map-drawer { animation:paper-slide 900ms cubic-bezier(.28,.08,.28,1) forwards; }
.map-drawer-opening .map-drawer-paper { animation:none; }
@keyframes drawer-slide { to { transform:translateY(20%) scaleX(1.016); box-shadow:0 9px 13px #0008; } }
/* Travel is 20% of the drawer's 12.6% scene height, not the touch target height. */
@keyframes paper-slide { to { top:87.92%; } }
@media (hover:hover) { .map-drawer:hover .map-drawer-paper { animation:none; filter:drop-shadow(1px 3px 2px #0008) drop-shadow(0 0 5px #d5b969a0); } }
.chocolate-map-dialog { width:min(1100px,calc(100vw - 32px)); max-height:calc(100dvh - 32px);
  padding:24px; color:var(--text); background:var(--surface); border:1px solid var(--emerald);
  border-radius:20px 7px 20px 7px; box-shadow:0 18px 70px #0008; overflow:auto;
}
.chocolate-map-dialog::backdrop { background:#06150dd9; }
.chocolate-map-dialog h2 { font:600 clamp(29px,4vw,42px)/1.1 var(--display); margin:0 0 8px; }
.chocolate-map-dialog h3 { font:600 26px/1.15 var(--display); margin:20px 0 8px; }
.map-heading { display:flex; justify-content:space-between; align-items:flex-start; gap:16px; position:sticky; top:-24px; z-index:2; padding-top:8px; background:var(--surface); }
.map-disclaimer,.map-makers-scope { font-size:13px; color:var(--soft); }
.map-groups { display:flex; gap:8px; flex-wrap:wrap; margin:20px 0; }
.map-regions[hidden] { display:none; }
.map-groups button,.map-close { min-height:44px; border:1px solid var(--line); border-radius:7px;
  background:var(--surface); color:var(--text); padding:8px 14px; cursor:pointer; }
.map-groups button[aria-pressed='true'] { background:var(--emerald-deep); color:#fff; border-color:var(--emerald); }
.map-close { flex-shrink:0; }
.map-layout { display:grid; grid-template-columns:minmax(0,1.3fr) minmax(0,1fr); gap:24px; }
.map-layout.is-online { grid-template-columns:1fr; }
.map-picker { margin-bottom:16px; }
.map-canvas { min-width:0; }
.map-maker-canvas { min-width:0; }
.map-canvas[hidden],.map-maker-canvas[hidden] { display:none; }
.map-maker-town { margin:0 0 16px; color:var(--soft); font-size:14px; }
.map-current:empty { display:none; }
.map-maker-canvas .map-frame { height:640px; }
.map-maker-frame.has-cluster-list { touch-action:pan-y; }
.map-clusters { position:absolute; inset:0; pointer-events:none; }
.map-cluster { position:absolute; transform:translate(-50%,-50%); display:flex; flex-direction:column; align-items:center; justify-content:center; width:32px; height:32px; padding:0; border:2px solid #fff; border-radius:50%; background:#245c45; color:#fff; pointer-events:auto; cursor:pointer; box-shadow:0 1px 3px #0003; font-family:var(--sans); }
.map-cluster strong { font-size:12px; line-height:1.1; }
.map-cluster span { font-size:8px; line-height:1.1; }
.map-cluster.is-selected { background:#805919; }
.map-cluster-list { position:absolute; z-index:4; top:62px; left:8px; right:8px; max-height:calc(100% - 108px); overflow:auto; padding:8px; border:1px solid var(--line); border-radius:6px; background:var(--surface); box-shadow:0 4px 14px #0003; }
.map-cluster-list[hidden] { display:none; }
.map-cluster-list button { display:block; width:100%; min-height:44px; margin:3px 0; padding:8px; text-align:left; color:var(--text); background:var(--surface); border:1px solid var(--line); border-radius:4px; cursor:pointer; font:inherit; font-size:13px; }
.map-cluster-list button:disabled { opacity:.6; cursor:default; }
.map-frame { display:block; position:relative; isolation:isolate; overflow:hidden; touch-action:none; width:100%; height:430px; border:1px solid var(--line); border-radius:6px; background:#d4dfd4; }
.map-tiles,.map-leaders,.map-pins { position:absolute; inset:0; width:100%; height:100%; }
.map-tiles img { position:absolute; width:256px; height:256px; max-width:none; }
.map-leaders { pointer-events:none; overflow:visible; }
.map-leaders path { fill:none; stroke:#275a44; stroke-width:1.2; }
.map-leaders path.is-selected { stroke:#8d6023; stroke-width:2; }
.map-leaders circle { fill:#174732; stroke:#fff; stroke-width:1; }
.map-pins { pointer-events:none; }
.map-pin { position:absolute; transform:translate(-50%,-50%); width:24px; height:24px; padding:0; border:1px solid #fff; background:#245c45; color:#fff; border-radius:8px 8px 8px 2px; font:700 11px var(--sans); cursor:pointer; pointer-events:auto; box-shadow:0 1px 3px #0003; }
.map-pin[hidden] { display:none; }
.map-pin[aria-pressed='true'] { background-color:#9a702b; outline:2px solid #fff; outline-offset:0; z-index:1; }
.map-controls { position:absolute; top:8px; left:8px; display:flex; gap:4px; z-index:3; }
.map-controls button { min-width:44px; min-height:44px; padding:5px 10px; background:#fffefa; color:#174732; border:1px solid #60765f; border-radius:5px; cursor:pointer; font-size:15px; }
.map-current { position:absolute; left:8px; bottom:28px; margin:0; max-width:calc(100% - 16px); padding:4px 8px; background:#fffefaf2; color:#174732; border-radius:4px; font-size:12px; pointer-events:none; }
.map-frame a.map-tile-credit { position:absolute; bottom:0; right:0; padding:3px 5px; color:#174732; background:#fffefa; font-size:10px; z-index:3; }
.map-attribution { font-size:12px; margin:8px 0; }
.chocolate-map-dialog a { color:var(--emerald); text-underline-offset:3px; }
.chocolate-map-dialog label { display:block; font-size:13px; font-weight:600; margin-bottom:6px; }
.map-select { width:100%; min-width:0; min-height:44px; padding:10px; font:inherit;
  color:var(--text); background:var(--bg); border:1px solid var(--line); border-radius:5px; }
.map-address { margin:0 0 16px; color:var(--soft); font-size:14px; }
.map-selection { font-size:14px; line-height:1.6; }
.map-caution { padding:10px 0; font-size:13px; color:var(--soft); }
.map-links { display:flex; gap:14px; flex-wrap:wrap; font-size:13px; margin:16px 0 22px; }
.map-links a { padding:4px 0; }
.chocolate-map-dialog :focus-visible { outline:2px solid var(--emerald); outline-offset:3px; }
@media(max-width:700px) {
  .chocolate-map-dialog { width:calc(100vw - 16px); max-height:calc(100dvh - 16px); padding:17px; }
  .map-layout { grid-template-columns:1fr; gap:16px; }
  .map-frame { height:330px; }
  .map-maker-canvas .map-frame { height:430px; }
  .map-heading { top:-17px; }
  .map-groups { gap:6px; margin:14px 0; }
  .map-groups button { padding:8px 10px; font-size:13px; }
}
@media (prefers-reduced-motion:reduce) {
  .map-drawer-paper { animation:none; }
}
