.explorer.conversation-first .bottom {
  display: block; top: calc(var(--header-height) + 12px); bottom: auto;
  left: 20px; transform: none; width: min(360px, calc(100% - 40px)); z-index: 3;
}
.explorer .bottom .controls { gap: 4px; padding: 4px; border-radius: 17px; box-shadow: inset 0 1px 0 #effff014, 0 4px 16px #0313151f; }
.explorer .bottom .controls button {
  display: flex; flex: 1 1 0; min-width: 0; min-height: 52px; padding: 6px 3px;
  flex-direction: column; align-items: center; justify-content: center; gap: 4px;
  border-radius: 12px; font-size: 11px; font-weight: 500; line-height: 1.2; color: #e0ece7;
}
.explorer .bottom .controls .primary { background: #b5efd819; color: #cbf6e4; flex: 1 1 0; }
.explorer .bottom .controls :is([aria-pressed=true], [aria-expanded=true]) { background: #b5efd825; color: #d5ffec; }
.explorer .bottom .controls button::before {
  content: ''; width: 18px; height: 18px; flex: 0 0 18px; background: currentColor;
  -webkit-mask: var(--control-icon) center / contain no-repeat;
  mask: var(--control-icon) center / contain no-repeat;
}
.explorer #fly { --control-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 17V3m-5 5 5-5 5 5M4 17v4h16v-4'/%3E%3C/svg%3E"); }
.explorer.in-flight #fly { --control-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6'%3E%3Crect x='6' y='4' width='4' height='16' rx='1'/%3E%3Crect x='14' y='4' width='4' height='16' rx='1'/%3E%3C/svg%3E"); }
.explorer #free-roam { --control-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='m16 8-2.5 5.5L8 16l2.5-5.5Z'/%3E%3C/svg%3E"); }
.explorer #land-map { --control-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3v14m-5-5 5 5 5-5M4 17v4h16v-4'/%3E%3C/svg%3E"); }
.explorer #nearby { --control-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M19 10c0 5-7 11-7 11S5 15 5 10a7 7 0 1 1 14 0Z'/%3E%3Ccircle cx='12' cy='10' r='2'/%3E%3C/svg%3E"); }
.explorer .bottom .controls :is(#restart, #speed)::before { display: none; }
.explorer #circle-map { --control-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 11a8 8 0 1 0-2 6M20 4v7h-7'/%3E%3Ccircle cx='12' cy='12' r='2'/%3E%3C/svg%3E"); }
.explorer .bottom .controls button:focus-visible { outline: 2px solid #d4ffeb; outline-offset: 1px; }
.explorer:has(#loading:not([hidden])) :is(.bottom, .steering-control) { visibility: hidden; pointer-events: none; }
.explorer:not(.debug-open) .bottom :is(#restart, #speed) { display: none; }
.explorer .bottom #hint {
  margin: 8px 0 0; padding: 7px 11px; width: fit-content; max-width: 100%; border-radius: 10px;
  font-size: 11px; line-height: 1.5; color: #e0ece7; text-align: left; text-shadow: none;
  background: var(--glass-highlight), var(--glass-tint); border: 1px solid var(--glass-border);
  backdrop-filter: var(--glass-blur); -webkit-backdrop-filter: var(--glass-blur);
}
.explorer .bottom #hint:empty { display: none; }
.explorer .loading { border-radius: 20px; padding: 24px; box-shadow: var(--glass-shadow); }
.explorer .loading h2 { font-size: 18px; font-weight: 600; }
.explorer .loading p { font-size: 13px; line-height: 1.6; color: #cfddd7; }
.explorer #reload { min-height: 44px; padding: 10px 20px; border-radius: 12px; background: #b5efd81f; color: #d5ffec; }
.explorer .nearby-panel {
  position: absolute; bottom: calc(48px + env(safe-area-inset-bottom)); left: 20px;
  width: min(680px, calc(100% - 520px)); z-index: 3; border-radius: 22px;
  background: var(--glass-highlight), var(--glass-tint); border-color: var(--glass-border);
  box-shadow: var(--glass-shadow); backdrop-filter: var(--glass-blur); -webkit-backdrop-filter: var(--glass-blur);
  padding: 12px; overflow: hidden;
}
.nearby-heading { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding-left: 4px; }
.nearby-heading > div { min-width: 0; }
.nearby-heading span { font-size: 8px; letter-spacing: 1.5px; color: #b3d5c9; }
.nearby-heading h2 { margin: 3px 0 0; font: 19px/1.2 Georgia, serif; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.nearby-heading button, .nearby-footer button { min-width: 44px; min-height: 44px; padding: 5px; background: transparent; }
.nearby-heading button { font-size: 23px; }
.explorer .nearby-panel .places { max-height: none; margin: 8px 0 0; padding: 3px 3px 8px; scroll-snap-type: x mandatory; overscroll-behavior-x: contain; }
.nearby-card { flex: 0 0 180px; min-width: 0; scroll-snap-align: start; border: 1px solid #e5fff326; border-radius: 14px; overflow: hidden; background: #10282da6; }
.explorer .nearby-card button { width: 100%; min-width: 0; max-width: none; padding: 0; border: 0; border-radius: 0; background: transparent; }
.nearby-art { display: grid; place-items: center; height: 76px; background: radial-gradient(ellipse at 20% 100%, #b2e1b933, transparent 60%), linear-gradient(145deg, #315f60, #172d38); color: #b5efd8; font-size: 28px; overflow: hidden; }
.nearby-art img { width: 100%; height: 100%; object-fit: cover; }
.nearby-art { position: relative; }
.nearby-art:has(.nearby-placeholder-label) { display: flex; flex-direction: column; justify-content: center; gap: 3px; }
.nearby-placeholder-icon { font: 26px/1 system-ui; color: #a4c4bd; }
.nearby-placeholder-label { font: 10px/1.4 system-ui; color: #bfd3cd; }
.nearby-distance { display: block; padding: 0 10px 9px; color: #b5dace; font-size: 10px; }
.nearby-card strong { display: block; padding: 9px 10px 0; font-size: 13px; line-height: 1.3; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.explorer .nearby-card small { margin: 0; padding: 5px 10px 10px; font-size: 10px; line-height: 1.3; }
.nearby-credits { padding: 0 10px 8px; font-size: 9px; overflow-wrap: anywhere; }
.nearby-credits a { color: #c6e8da; }
.nearby-footer { display: flex; align-items: center; justify-content: space-between; font-size: 10px; color: #bfd7cf; }
.nearby-footer > div { display: flex; }
.places > p { margin: 8px; font-size: 13px; }
.explorer.in-flight .nearby-panel { display: none; }
.explorer.debug-open .flight-state { top: calc(var(--header-height) + 115px); }
.explorer.debug-open .bottom { left: calc(var(--map-left) + 20px); }
@media (max-width: 1000px) {
  .explorer .nearby-panel { width: calc(100% - 24px); left: 12px; bottom: calc(116px + env(safe-area-inset-bottom)); }
  .explorer:has(#companion:not([hidden])) .nearby-panel,
  .explorer:has(#voice-overlay:not([hidden])) .nearby-panel { display: none; }
}
@media (max-width: 760px) {
  .explorer.conversation-first .bottom { left: 12px; width: min(360px, calc(100% - 24px)); top: calc(var(--header-height) + 12px); }
  .explorer .bottom #hint { max-width: none; }
  .explorer .nearby-panel { padding: 9px; border-radius: 18px; }
  .nearby-card { flex-basis: 158px; }
  .explorer.conversation-first.long-flight .travel-transition { top: calc(var(--header-height) + 76px); }
}
@media (max-height: 600px) {
  .nearby-art { height: 44px; }
  .nearby-heading span, .explorer .bottom #hint { display: none; }
  .explorer .nearby-panel { bottom: calc(108px + env(safe-area-inset-bottom)); }
  .explorer .nearby-panel .places { margin-top: 0; padding-bottom: 2px; }
  .nearby-heading h2 { font-size: 16px; }
  .nearby-footer { display: none; }
}
@media (max-height: 450px) {
  .nearby-art, .nearby-credits { display: none; }
  .nearby-art:has(.nearby-placeholder-label) { display: none; }
  .explorer .nearby-card small { display: none; }
  .nearby-distance { padding-top: 5px; }
}
.explorer.conversation-first.long-flight .travel-transition:not(.travel-contained) {
  top: calc(var(--header-height) + 80px); bottom: auto; left: 20px; transform: none;
  width: min(360px, calc(100% - 40px)); padding: 12px 16px; animation: none; z-index: 3;
}
.explorer.long-flight .bottom #hint { display: none; }
.explorer.conversation-first .travel-transition.travel-contained {
  position: relative; inset: auto; transform: none; width: auto; min-width: 0;
  margin: 0; padding: 10px 14px; flex: 0 0 auto; border: 0; border-radius: 0;
  border-bottom: 1px solid var(--glass-border); background: #b5efd808;
  box-shadow: none; backdrop-filter: none; -webkit-backdrop-filter: none; animation: none;
}
.explorer .travel-transition .travel-route { gap: 10px; margin: 8px 0; }
.explorer .travel-transition .travel-route > span:not(.travel-route-line) { flex: 1; max-width: none; min-width: 0; font: 14px/1.3 system-ui; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.explorer .travel-transition .travel-route-line { flex: 0 0 26px; min-width: 26px; height: 18px; }
.explorer .travel-transition > p { display: none; }
.explorer .voice-overlay > .travel-contained { border: 1px solid var(--glass-border); border-radius: 16px; background: var(--glass-highlight), var(--glass-tint); }
@media (max-width: 760px) {
  .explorer.conversation-first.long-flight .travel-transition:not(.travel-contained) { left: 12px; width: calc(100% - 24px); }
}
@media (max-height: 500px) {
  .explorer .travel-contained .travel-caption { display: none; }
  .explorer.conversation-first .travel-transition.travel-contained { padding: 5px 12px; }
  .explorer .travel-contained .travel-route { margin: 0 0 4px; }
}