/* The public World page: a full-screen canvas. The overlay (/css/app.css) owns the top bar (56 px)
   and the right-hand panel (380 px); the World keeps its own controls small and bottom-left. */
html, body { margin: 0; height: 100%; background: #05080d; color: #dce8f3; font: 14px/1.4 system-ui, -apple-system, "Segoe UI", sans-serif; overflow: hidden; }
.awcw-world { position: fixed; inset: 0; }
.awcw-stage, .awcw-stage.maplibregl-map { position: absolute; inset: 0; outline: none; background: #05080d; }

/* World controls: bottom-left, above MapLibre's own buttons and credits. */
.awcw-ctl { display: flex; clear: both; margin: 0 0 6px 10px; gap: 4px; flex-wrap: wrap; max-width: 260px; }
.awcw-ctl button { min-height: 30px; padding: 4px 10px; border: 1px solid rgba(57, 210, 192, .35); border-radius: 6px; background: rgba(8, 13, 20, .86);
  color: #dce8f3; font: 600 12px/1 system-ui, sans-serif; cursor: pointer; }
.awcw-ctl button:hover { border-color: #39d2c0; }
.awcw-ctl button.on { background: rgba(57, 210, 192, .22); border-color: #39d2c0; color: #fff; }
.awcw-ctl button:focus-visible { outline: 2px solid #39d2c0; outline-offset: 1px; }

/* Speech bubbles over our guides. */
.awcw-bubble { position: absolute; left: 0; top: 0; z-index: 2; max-width: 240px; padding: 7px 10px; border: 1px solid rgba(57, 210, 192, .5); border-radius: 10px;
  background: rgba(8, 13, 20, .92); color: #e8f6ff; font: 12px/1.4 system-ui, sans-serif; pointer-events: none; white-space: normal; will-change: transform; }
.awcw-bubble b { display: block; color: #39d2c0; font-size: 11px; margin-bottom: 2px; }
.awcw-bubble::after { content: ""; position: absolute; left: 50%; bottom: -6px; width: 10px; height: 10px; margin-left: -5px; background: inherit;
  border-right: 1px solid rgba(57, 210, 192, .5); border-bottom: 1px solid rgba(57, 210, 192, .5); transform: rotate(45deg); }

.awcw-note { position: absolute; left: 50%; top: 72px; transform: translateX(-50%); z-index: 4; max-width: min(520px, calc(100vw - 32px)); padding: 12px 14px;
  border: 1px solid rgba(248, 81, 73, .45); border-radius: 8px; background: rgba(20, 8, 10, .92); color: #ffd7d3; font-size: 13px; }

/* MapLibre's hover card for markers. */
.maplibregl-popup.admin-map-popup .maplibregl-popup-content { background: rgba(8, 13, 20, .94); color: #dce8f3; font: 12px/1.4 system-ui, sans-serif;
  border: 1px solid rgba(57, 210, 192, .35); border-radius: 6px; padding: 6px 9px; max-width: 320px; pointer-events: none; }
.maplibregl-popup.admin-map-popup .maplibregl-popup-tip { display: none; }
.awcw-stage .maplibregl-ctrl-bottom-left { z-index: 3; }
.awcw-stage .maplibregl-ctrl-attrib { background: rgba(8, 13, 20, .7); color: #9fb2c4; }
.awcw-stage .maplibregl-ctrl-attrib a { color: #cfe3f2; }