@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700&display=swap');
:root {
  font-family: Manrope, system-ui, sans-serif;
  color: #edf7ff;
  background: #030910;
  color-scheme: dark;
  --cyan: #4cecff;
  --line: #a7c4d42b;
  --muted: #93a7b8;
}
* {
  box-sizing: border-box;
}
html,
body {
  margin: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
}
button,
input,
textarea {
  font: inherit;
}
button,
a {
  -webkit-tap-highlight-color: transparent;
  touch-action: manipulation;
}
button {
  color: inherit;
  cursor: pointer;
}
button:disabled {
  opacity: 0.45;
  cursor: wait;
}
[hidden] {
  display: none !important;
}
a {
  color: inherit;
  text-decoration: none;
}
button:focus-visible,
a:focus-visible,
input:focus-visible,
textarea:focus-visible {
  outline: 2px solid var(--cyan);
  outline-offset: 4px;
}
svg {
  width: 23px;
  height: 23px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.45;
  stroke-linecap: round;
  stroke-linejoin: round;
  flex-shrink: 0;
}
.icon-defs {
  position: absolute;
  width: 0;
  height: 0;
  overflow: hidden;
}
.world {
  position: fixed;
  inset: 0;
  background-color: #020911;
  background-image:
    radial-gradient(ellipse at 65% 0%, #14304b66, transparent 50%),
    radial-gradient(1px 1px at 15% 19%, #b8c9df 99%, transparent),
    radial-gradient(1px 1px at 75% 29%, #b8c9df 99%, transparent),
    radial-gradient(1px 1px at 55% 63%, #b8c9df 99%, transparent),
    radial-gradient(1px 1px at 92% 73%, #b8c9df 99%, transparent);
  background-size:
    auto,
    179px 181px,
    233px 251px,
    317px 271px,
    389px 323px;
}
#map {
  position: absolute;
  inset: 0;
}
.world-shade {
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(
    180deg,
    #02091070 0%,
    transparent 24%,
    transparent 57%,
    #020a1490 81%,
    #020910 100%
  );
}
.topbar {
  position: fixed;
  z-index: 5;
  top: 30px;
  left: 4.5%;
  right: 4.5%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  pointer-events: none;
}
.topbar > * {
  pointer-events: auto;
}
.brand {
  display: flex;
  align-items: center;
  gap: 14px;
  font-size: 25px;
  font-weight: 700;
  letter-spacing: -0.7px;
}
.brand-ring {
  width: 37px;
  height: 37px;
  border-radius: 50%;
  background: conic-gradient(from 210deg, #0095da, #40eaff 25%, #f4fdff 49%, #061323 73%, #061323);
  padding: 3px;
  box-shadow: 0 0 20px #21b8eb44;
  position: relative;
}
.brand-ring:after {
  content: '';
  position: absolute;
  inset: 3px;
  border-radius: 50%;
  background: #04101b;
  box-shadow: inset 0 0 9px #0a608b99;
}
.topbar nav {
  display: flex;
  gap: 12px;
}
.round {
  display: grid;
  place-items: center;
  width: 43px;
  height: 43px;
  border: 1px solid var(--line);
  border-radius: 50%;
  background: #0b1723a6;
  backdrop-filter: blur(16px);
}
.round:hover {
  background: #193144c9;
  border-color: #87cddd77;
}
.glass {
  background: linear-gradient(120deg, #182432d9, #091927de);
  border: 1px solid #a5bed24a;
  box-shadow: 0 14px 50px #0004;
  backdrop-filter: blur(22px);
}
.map-rail {
  position: fixed;
  z-index: 4;
  right: 4.5%;
  top: 34%;
  display: flex;
  align-items: center;
  flex-direction: column;
  gap: 12px;
}
.zoom-control {
  border-radius: 22px;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
.zoom-control button {
  border: 0;
  background: none;
  width: 42px;
  height: 38px;
  font-size: 25px;
  font-weight: 400;
}
.zoom-control button:hover {
  background: #6484a033;
}
.composer-dock {
  position: fixed;
  z-index: 6;
  bottom: 6.5%;
  left: 50%;
  transform: translateX(-50%);
  width: min(850px, 76vw);
}
.composer {
  border-radius: 45px;
  display: flex;
  align-items: center;
  gap: 17px;
  padding: 12px 17px 12px 25px;
  min-height: 67px;
  background: linear-gradient(105deg, #233244cc, #0b2233d9);
}
.composer button {
  border: 0;
  background: none;
  display: grid;
  place-items: center;
  flex-shrink: 0;
  padding: 4px;
}
.composer-divider {
  height: 29px;
  width: 1px;
  background: #b2c6da50;
  flex-shrink: 0;
}
.composer textarea {
  font-size: 17px;
  line-height: 1.5;
  min-height: 30px;
  max-height: 150px;
  width: 100%;
  border: 0;
  outline: 0;
  resize: none;
  background: transparent;
  color: #f1f7ff;
  padding: 3px 8px;
}
.composer textarea::placeholder {
  color: #f2f5fb;
}
.composer .send {
  background: linear-gradient(140deg, #9ff7ff, #08d8f8);
  color: #032331;
  border-radius: 50%;
  width: 40px;
  height: 40px;
  box-shadow: 0 0 25px #16d5f756;
}
.send svg {
  stroke-width: 2.2;
}
.quick-actions {
  display: flex;
  justify-content: center;
  gap: 22px;
  margin-top: 15px;
}
.quick-actions button {
  display: flex;
  gap: 11px;
  align-items: center;
  justify-content: center;
  border: 1px solid #9bb4ca45;
  background: linear-gradient(180deg, #152330c9, #091621e6);
  border-radius: 26px;
  padding: 12px 23px;
  font-size: 12px;
  white-space: nowrap;
  backdrop-filter: blur(15px);
}
.quick-actions button:hover {
  background: #1f3e50c9;
}
.quick-actions svg {
  width: 19px;
  height: 19px;
}
.controls {
  position: fixed;
  z-index: 8;
  top: 90px;
  right: 4.5%;
  width: 340px;
  padding: 24px;
  border-radius: 18px;
}
.controls h2 {
  font-size: 17px;
  margin: 0 0 18px;
  font-weight: 500;
}
#map-search {
  display: flex;
  gap: 7px;
}
input,
textarea {
  color: inherit;
}
#place {
  min-width: 0;
  width: 100%;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #04111c99;
  padding: 10px;
  font-size: 11px;
}
.small-button {
  background: #19495c;
  border: 1px solid #4587a0;
  border-radius: 8px;
  padding: 0 12px;
  font-size: 12px;
}
.map-modes {
  display: flex;
  gap: 7px;
  margin: 15px 0;
}
.map-modes button {
  border: 1px solid var(--line);
  background: none;
  border-radius: 20px;
  font-size: 10px;
  padding: 8px 14px;
}
.map-modes button[aria-pressed='true'] {
  border-color: #57c5d599;
  background: #1b546770;
  color: #9bf6ff;
}
.selected-place {
  display: grid;
  gap: 9px;
  margin: 20px 0;
  font-size: 12px;
}
.selected-place span {
  font-size: 8px;
  letter-spacing: 1.4px;
  color: var(--muted);
}
.control-links {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}
.control-links button,
.control-links a {
  background: none;
  border: 0;
  padding: 0;
  text-align: left;
  font-size: 10px;
  color: #b8cbd9;
}
.map-rail svg {
  width: 22px;
  height: 22px;
}
.map-feature-detail .verify-actions {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin-top: 6px;
}
.map-feature-detail .verify-actions button {
  min-height: 40px;
  border: 0;
  border-radius: 8px;
  padding: 6px 12px;
  background: #07596c;
  color: #fff;
}
.map-feature-detail .verify-actions input {
  min-height: 40px;
  flex: 1 1 140px;
  border: 1px solid #9bb;
  border-radius: 8px;
  padding: 6px 8px;
}
.map-feature-detail small {
  display: block;
  margin-top: 6px;
}
.create-map {
  position: fixed;
  left: 50%;
  bottom: 22px;
  transform: translateX(-50%);
  z-index: 5;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  pointer-events: none;
}
.create-map div {
  display: flex;
  gap: 8px;
  pointer-events: auto;
}
.create-map button {
  min-height: 48px;
  padding: 12px 20px;
  border-radius: 999px;
  border: 1px solid #8eafc566;
  background: #10232eee;
  color: #eafcff;
  font: inherit;
  font-weight: 600;
  font-size: 15px;
  cursor: pointer;
  white-space: nowrap;
}
.create-map button.primary {
  border-color: #40d9ef;
  background: #0b5566f2;
}
.create-map small {
  font-size: 12px;
  color: #d7eef5;
  text-shadow:
    0 1px 4px #000,
    0 0 2px #000;
}
body.library-open .create-map,
body.chat-open .create-map,
body.layers-open .create-map,
body.search-open .create-map,
body.keyboard-open .create-map {
  display: none;
}
@media (max-width: 700px) {
  .create-map {
    bottom: 92px;
  }
  .create-map button {
    font-size: 14px;
    padding: 10px 14px;
  }
}
.account-menu {
  position: fixed;
  top: 74px;
  right: 16px;
  z-index: 60;
  min-width: 180px;
  padding: 12px 14px;
  border-radius: 14px;
  background: #10232ef5;
  color: #e4eff5;
  border: 1px solid #8eafc54d;
}
.account-menu p {
  margin: 0 0 8px;
  font-weight: 600;
}
.account-menu {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.account-menu a {
  display: block;
  padding: 10px 12px;
  border-radius: 8px;
  background: #12303f;
  color: #eafcff;
  text-decoration: none;
  text-align: center;
}
.account-menu a.primary {
  background: #0b5566;
  border: 1px solid #40d9ef;
}
.account-menu small {
  opacity: 0.8;
}
.account-menu button {
  min-height: 40px;
  width: 100%;
  border: 0;
  border-radius: 8px;
  background: #07596c;
  color: #fff;
  font: inherit;
  cursor: pointer;
}
#layout-toggle {
  display: none !important;
}
.library-card label.choice {
  display: block;
  padding: 8px 0;
  cursor: pointer;
}
.library-card label.choice small {
  display: block;
  opacity: 0.8;
  margin-left: 22px;
}
#map-notice {
  cursor: pointer;
  position: fixed;
  top: 110px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 3;
  background: #11202eea;
  border: 1px solid #8eafc54d;
  border-radius: 12px;
  padding: 14px 20px;
  max-width: 90%;
  font-size: 12px;
  text-align: center;
}
.chat-panel {
  position: fixed;
  z-index: 5;
  right: calc((100vw - min(850px, 76vw)) / 2);
  bottom: calc(6.5% + 134px);
  width: 430px;
  max-height: 55dvh;
  border-radius: 20px;
  display: none;
  flex-direction: column;
  overflow: hidden;
}
.chat-open .chat-panel {
  display: flex;
}
.chat-heading {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  padding: 18px 20px 8px;
}
.chat-heading > div {
  display: flex;
  align-items: center;
  gap: 8px;
}
.chat-heading h2 {
  font-size: 13px;
  font-weight: 500;
  margin: 0;
}
.chat-heading button,
.dialog-heading button {
  background: none;
  border: 0;
  font-size: 23px;
  padding: 0 5px;
}
.tiny-ring {
  width: 13px;
  height: 13px;
  border: 1px solid var(--cyan);
  border-radius: 50%;
  box-shadow: 0 0 9px #4cecff55;
}
.connection {
  font-size: 9px;
  color: #9cb1c2;
  padding: 0 20px 8px;
  line-height: 1.6;
}
.connection a {
  color: #6be5ff;
}
.messages {
  padding: 0 20px 15px;
  overflow: auto;
  min-height: 80px;
  max-height: 38dvh;
  scrollbar-width: thin;
  overscroll-behavior: contain;
}
.welcome {
  padding: 20px 0 30px;
}
.welcome > svg {
  color: var(--cyan);
  width: 27px;
  height: 27px;
}
.welcome h3 {
  font-size: 19px;
  font-weight: 500;
  margin: 13px 0;
}
.welcome p {
  font-size: 11px;
  color: var(--muted);
  line-height: 1.9;
}
.web-option {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 9px;
  color: #9db6c9;
  padding: 8px 18px 14px;
}
.web-option input {
  accent-color: #22cbeb;
}
.message {
  font-size: 12px;
  line-height: 1.85;
  margin: 12px 0;
  overflow-wrap: anywhere;
}
.message .label {
  font-size: 8px;
  letter-spacing: 1.4px;
  color: #84bccd;
  margin-bottom: 5px;
}
.message-text {
  white-space: pre-wrap;
}
/* An AI answer shown with its formatting (renderRich in src/chat.js). */
.message-text.rich {
  white-space: normal;
}
.message-text.rich p,
.message-text.rich ul,
.message-text.rich ol {
  margin: 0 0 8px;
}
.message-text.rich ul,
.message-text.rich ol {
  padding-left: 20px;
}
.message-text.rich .rich-heading {
  font-weight: 700;
}
.message-text.rich .rich-table {
  overflow-x: auto;
  margin: 0 0 8px;
}
.message-text.rich table {
  border-collapse: collapse;
  font-size: 0.92em;
}
.message-text.rich th,
.message-text.rich td {
  border: 1px solid #355262;
  padding: 4px 7px;
  text-align: left;
  vertical-align: top;
}
.message-text.rich a {
  color: #9ce8f4;
}
.message.user {
  background: #29495966;
  border-radius: 11px;
  padding: 10px 13px;
}
.message.error {
  color: #ffc4a7;
}
.sources {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 9px;
}
.sources a {
  font-size: 9px;
  color: #9ce8f4;
  border: 1px solid #53c4d64d;
  border-radius: 5px;
  padding: 3px 6px;
}
.attachment {
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: 11px;
  border-radius: 12px;
  padding: 10px 16px;
  margin-bottom: 10px;
}
.attachment button {
  background: none;
  border: 0;
  font-size: 20px;
}
.recording {
  color: #ff9e9e !important;
}
.search-results {
  max-height: 160px;
  overflow: auto;
  background: #091723;
  border-radius: 8px;
  padding: 8px;
  margin-top: 10px;
  font-size: 11px;
}
.search-results button {
  display: block;
  width: 100%;
  background: none;
  border: 0;
  border-bottom: 1px solid var(--line);
  padding: 10px 5px;
  text-align: left;
  font-size: 11px;
}
.pin {
  width: 18px;
  height: 18px;
  background: #13bcd9;
  border: 2px solid #bdfeff;
  border-radius: 50%;
  box-shadow:
    0 0 0 5px #1ee1ff22,
    0 0 20px #1ee1ff99;
  color: transparent;
}
.maplibregl-popup-content {
  background: #142635 !important;
  color: white;
  border-radius: 10px !important;
  font-family: inherit;
}
.maplibregl-popup-tip {
  border-top-color: #142635 !important;
}
.maplibregl-ctrl-attrib {
  background: #05101bc4 !important;
  color: #a7b8c6 !important;
  font-size: 9px !important;
}
.maplibregl-ctrl-attrib a {
  color: #a7b8c6 !important;
}
.maplibregl-ctrl-scale {
  background: #05101bc4 !important;
  color: #a7b8c6 !important;
  border-color: #a7b8c6 !important;
  font-size: 8px !important;
}
.maplibregl-canvas:focus {
  outline: none;
}
dialog {
  color: #edf7ff;
  width: min(480px, calc(100% - 30px));
  border-radius: 18px;
  padding: 28px;
}
dialog::backdrop {
  background: #0008;
  backdrop-filter: blur(5px);
}
.dialog-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 20px;
}
.dialog-heading h2 {
  font-size: 21px;
  font-weight: 500;
  margin: 0;
}
dialog p {
  font-size: 12px;
  line-height: 1.85;
  color: #b3c7d6;
}
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
}
@media (max-width: 700px) {
  .topbar {
    top: 24px;
    left: 6%;
    right: 6%;
  }
  .brand {
    font-size: 20px;
    gap: 10px;
  }
  .brand-ring {
    width: 29px;
    height: 29px;
  }
  .topbar nav {
    gap: 7px;
  }
  .round {
    width: 34px;
    height: 34px;
  }
  .round svg {
    width: 18px;
    height: 18px;
  }
  #chat-toggle {
    display: none;
  }
  .map-rail {
    right: 6%;
    top: 38%;
    gap: 10px;
  }
  .zoom-control button {
    width: 34px;
    height: 34px;
    font-size: 22px;
  }
  .composer-dock {
    width: calc(100% - 30px);
    bottom: 7%;
  }
  .composer {
    gap: 10px;
    padding: 12px;
    min-height: 57px;
  }
  .composer-divider {
    height: 24px;
  }
  .composer textarea {
    font-size: 12px;
    padding: 3px 0;
    min-height: 24px;
  }
  .composer svg {
    width: 20px;
    height: 20px;
  }
  .composer .send {
    width: 33px;
    height: 33px;
  }
  .quick-actions {
    justify-content: flex-start;
    gap: 9px;
    overflow-x: auto;
    scrollbar-width: none;
    margin: 13px 0 0;
  }
  .quick-actions button {
    padding: 11px 16px;
    font-size: 10px;
    gap: 8px;
    flex-shrink: 0;
  }
  .quick-actions svg {
    width: 17px;
    height: 17px;
  }
  .chat-panel {
    left: 15px;
    right: 15px;
    width: auto;
    bottom: calc(7% + 120px);
    max-height: 55dvh;
  }
  .controls {
    left: 15px;
    right: 15px;
    top: 78px;
    width: auto;
  }
  .chat-heading {
    padding: 15px 16px 8px;
  }
  .messages {
    padding-left: 16px;
    padding-right: 16px;
  }
  .connection {
    padding-left: 16px;
  }
  .world-shade {
    background: linear-gradient(180deg, #0209108c, transparent 30%, transparent 55%, #020910dd 90%);
  }
  #map-notice {
    top: 90px;
    font-size: 10px;
    width: 80%;
  }
  .maplibregl-ctrl-bottom-left,
  .maplibregl-ctrl-bottom-right {
    bottom: 4px !important;
  }
}
@media (prefers-reduced-motion: no-preference) {
  button,
  a {
    transition:
      background 0.15s,
      border-color 0.15s;
  }
  .chat-panel {
    animation: open 0.2s ease-out;
  }
  @keyframes open {
    from {
      opacity: 0;
      transform: translateY(8px);
    }
    to {
      opacity: 1;
      transform: none;
    }
  }
}

.ai-meta {
  font-size: 11px;
  color: #7cddd9;
  margin-top: 12px;
}
.ai-artifact {
  margin: 14px 0;
}
.ai-artifact img {
  display: block;
  max-width: 100%;
  height: auto;
  border-radius: 12px;
}
.ai-artifact figcaption {
  display: flex;
  gap: 16px;
  align-items: center;
  margin-top: 8px;
}
.ai-artifact a,
.ai-file {
  color: #7ce9f2;
}
.ai-artifact button {
  color: #d7f4ff;
  background: #163240;
  border: 1px solid #41606a;
  border-radius: 9px;
  padding: 6px 10px;
}
.ai-file {
  display: block;
  margin: 12px 0;
}
.message small {
  display: block;
  color: #a5b4bf;
  font-size: 11px;
  margin-top: 8px;
}
/* Map-first layout: chat stays inside its floating panel. */
.world-shade {
  background: linear-gradient(180deg, #02091060, transparent 25%, transparent 85%, #02091038);
}
.search-shell {
  position: fixed;
  z-index: 7;
  top: 104px;
  left: 4.5%;
  width: min(410px, calc(100% - 150px));
}
#map-search {
  align-items: center;
  border-radius: 17px;
  padding: 5px 8px 5px 16px;
  gap: 8px;
  min-height: 50px;
}
#map-search > svg {
  width: 20px;
  color: #cde5f2;
  flex-shrink: 0;
}
#place {
  border: 0;
  background: transparent;
  padding: 10px 0;
  font-size: 13px;
  outline-offset: 0;
}
#place::placeholder {
  color: #bdcedc;
}
#map-search .small-button {
  min-height: 36px;
  background: #1a3746;
  border-color: #55717c55;
}
.search-results {
  border: 1px solid var(--line);
  box-shadow: 0 12px 35px #0006;
  max-height: min(350px, 45dvh);
}
.search-results button {
  font-size: 13px;
  line-height: 1.5;
  padding: 13px 9px;
}
.controls {
  top: 95px;
  max-height: calc(100dvh - 150px);
  overflow: auto;
}
.map-rail {
  top: 32%;
  gap: 12px;
}
.chat-launcher {
  position: fixed;
  z-index: 9;
  right: 4.5%;
  bottom: max(38px, env(safe-area-inset-bottom));
  display: flex;
  align-items: center;
  gap: 11px;
  min-height: 54px;
  padding: 12px 20px;
  border-radius: 30px;
  border: 1px solid #46e5f4bf;
  background: linear-gradient(120deg, #0d3542ee, #071722ee);
  box-shadow: 0 0 24px #1bcee51a;
  font-size: 14px;
  font-weight: 600;
}
.chat-launcher svg {
  color: var(--cyan);
  width: 26px;
  height: 26px;
}
#chat-toggle {
  display: flex;
}
.chat-launcher:hover {
  background: #16404d;
}
.chat-open .chat-launcher {
  border-color: #c3faff;
  background: #175064;
}
.chat-panel {
  z-index: 10;
  right: 4.5%;
  bottom: 104px;
  width: min(440px, calc(100% - 32px));
  height: min(640px, calc(100dvh - 132px));
  max-height: none;
  border-radius: 22px;
  background: linear-gradient(125deg, #172a37f5, #071622f7);
}
.chat-heading {
  padding: 19px 18px 10px;
  flex-shrink: 0;
}
.chat-heading h2 {
  font-size: 16px;
  font-weight: 600;
}
.chat-heading button {
  min-width: 36px;
  min-height: 36px;
}
.connection {
  font-size: 11px;
  flex-shrink: 0;
}
.messages {
  flex: 1;
  min-height: 60px;
  max-height: none;
  font-size: 14px;
}
.message {
  font-size: 13px;
}
.web-option {
  font-size: 9px;
  padding-bottom: 8px;
  flex-shrink: 0;
}
.composer-dock {
  position: static;
  transform: none;
  width: auto;
  bottom: auto;
  left: auto;
  flex-shrink: 0;
  margin: 0 12px 12px;
  min-width: 0;
}
.composer {
  border-radius: 16px;
  gap: 8px;
  padding: 10px;
  min-height: 60px;
}
.composer textarea {
  font-size: 14px;
  min-height: 30px;
  padding: 4px 0;
}
.composer-divider {
  display: none;
}
.composer .send {
  width: 36px;
  height: 36px;
}
.composer button {
  min-width: 28px;
}
.attachment {
  margin-bottom: 7px;
  font-size: 11px;
  overflow-wrap: anywhere;
}
.composer .stop {
  font-size: 11px;
}
.layers-panel {
  position: fixed;
  z-index: 8;
  right: calc(4.5% + 58px);
  top: 32%;
  width: 290px;
  border-radius: 18px;
  padding: 18px;
  max-height: calc(100dvh - 190px);
  overflow: auto;
}
.layers-panel h2 {
  font-size: 15px;
  margin: 0 0 14px;
}
.layer-choices {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 9px;
}
.layer-choices button {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 7px;
  min-height: 105px;
  text-align: left;
  padding: 13px 11px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #071a27bb;
}
.layer-choices button > span {
  color: #a7dfe5;
  font-size: 22px;
  line-height: 1;
}
.layer-choices strong {
  font-size: 12px;
  font-weight: 600;
}
.layer-choices small {
  font-size: 9px;
  color: #9db2c2;
  line-height: 1.5;
}
.layer-choices button[aria-pressed='true'] {
  border-color: #4cecff;
  background: #164552bb;
}
.layer-choices button:hover {
  background: #244756;
}

#map-notice {
  top: 170px;
  max-width: min(450px, 80vw);
}
@media (max-width: 700px) {
  .topbar {
    top: max(20px, env(safe-area-inset-top));
    left: 20px;
    right: 20px;
  }
  .topbar nav {
    gap: 8px;
  }
  .topbar .round {
    width: 36px;
    height: 36px;
  }
  .brand {
    font-size: 21px;
    gap: 10px;
  }
  .brand-ring {
    width: 31px;
    height: 31px;
  }
  .search-shell {
    top: 84px;
    left: 16px;
    width: calc(100% - 80px);
  }
  #map-search {
    min-height: 46px;
    border-radius: 14px;
    padding-left: 12px;
    gap: 7px;
  }
  #place {
    font-size: 12px;
  }
  #map-search > svg {
    width: 18px;
  }
  #map-search .small-button {
    padding: 0 9px;
    font-size: 11px;
    min-height: 32px;
  }
  .map-rail {
    right: 16px;
    top: 34%;
    gap: 12px;
  }
  .map-rail .round {
    width: 40px;
    height: 40px;
  }
  .map-rail .round svg {
    width: 21px;
    height: 21px;
  }
  .zoom-control button {
    width: 38px;
    height: 38px;
  }
  #layers-toggle {
    position: fixed;
    top: 86px;
    right: 16px;
    width: 40px;
    height: 40px;
  }
  .chat-launcher {
    right: 16px;
    bottom: calc(30px + env(safe-area-inset-bottom));
    min-height: 52px;
    padding: 12px 18px;
    font-size: 13px;
  }
  .chat-panel {
    left: 12px;
    right: 12px;
    width: auto;
    bottom: calc(94px + env(safe-area-inset-bottom));
    height: min(620px, calc(100dvh - 112px - env(safe-area-inset-bottom)));
    max-height: none;
    border-radius: 19px;
  }
  .chat-heading {
    padding: 10px 14px 5px;
  }
  .chat-heading h2 {
    font-size: 15px;
  }
  .connection {
    padding: 0 14px 6px;
    font-size: 10px;
  }
  .messages {
    padding: 0 14px 12px;
    max-height: none;
  }
  .composer-dock {
    width: auto;
    margin: 0 9px 9px;
  }
  .composer {
    padding: 8px;
    gap: 7px;
  }
  .composer textarea {
    font-size: 16px;
    line-height: 1.4;
  }
  .composer .send {
    width: 34px;
    height: 34px;
  }
  .composer svg {
    width: 20px;
    height: 20px;
  }
  .web-option {
    padding: 6px 12px;
    font-size: 8px;
  }
  .welcome {
    padding: 15px 0;
  }
  .layers-panel {
    top: 142px;
    right: 16px;
    width: min(290px, calc(100% - 32px));
    max-height: calc(100dvh - 240px);
  }
  .controls {
    top: 142px;
    left: 16px;
    right: 16px;
    width: auto;
    max-height: calc(100dvh - 240px);
  }

  #map-notice {
    top: 146px;
    width: calc(100% - 100px);
    font-size: 11px;
    padding: 10px 12px;
  }
  .world-shade {
    background: linear-gradient(180deg, #02091055, transparent 25%, transparent 90%, #02091033);
  }
}
@media (max-height: 520px) {
  .chat-panel {
    top: 12px;
    bottom: 12px;
    height: auto;
  }
  .chat-launcher {
    bottom: 30px;
  }
  .layers-panel {
    top: 80px;
    max-height: calc(100dvh - 95px);
  }
  .map-rail {
    top: 155px;
    gap: 5px;
  }
  .map-rail #home-globe {
    display: none;
  }
}

.layer-choices button:last-child:nth-child(odd) {
  grid-column: 1 / -1;
  min-height: 80px;
}

.layers-panel {
  top: 160px;
  width: 310px;
  max-height: calc(100dvh - 200px);
  padding: 17px;
}
.globe-mode {
  width: 100%;
  border: 1px solid #62bfd766;
  border-radius: 10px;
  padding: 10px;
  background: #153b4c;
  color: #d8f8ff;
  font-size: 12px;
}
.globe-mode[aria-pressed='true'] {
  border-color: var(--cyan);
}
.layer-hint {
  font-size: 10px;
  line-height: 1.6;
  color: #a8bfcd;
  margin: 12px 0;
}
.layer-row {
  border-top: 1px solid var(--line);
  padding: 14px 0 8px;
}
.layer-toggle {
  display: flex;
  align-items: center;
  gap: 10px;
  cursor: pointer;
}
.layer-toggle input {
  width: 18px;
  height: 18px;
  accent-color: var(--cyan);
  flex-shrink: 0;
}
.layer-toggle span {
  display: grid;
  gap: 5px;
}
.layer-toggle strong {
  font-size: 12px;
  font-weight: 600;
}
.layer-toggle small {
  font-size: 10px;
  color: #9fb6c5;
}
.opacity-label {
  display: flex;
  justify-content: space-between;
  font-size: 10px;
  color: #b0cad5;
  margin: 12px 0 4px;
}
.layer-row input[type='range'] {
  width: 100%;
  height: 24px;
  accent-color: var(--cyan);
  cursor: pointer;
  margin: 0;
}
.layers-panel h2 {
  margin-bottom: 12px;
}
@media (max-width: 700px) {
  .layers-panel {
    top: 142px;
    right: 16px;
    width: min(310px, calc(100% - 32px));
    max-height: calc(100dvh - 240px);
  }
}
@media (max-height: 520px) {
  .layers-panel {
    top: 75px;
    max-height: calc(100dvh - 95px);
  }
}

.layout-toggle {
  position: fixed;
  z-index: 21;
  bottom: 38px;
  left: 4.5%;
  border-radius: 24px;
  padding: 12px 16px;
  font-size: 12px;
  color: #cbe5ed;
}
.layout-toggle:hover {
  border-color: var(--cyan);
}
.layout-editor {
  position: fixed;
  z-index: 22;
  left: 4.5%;
  bottom: 94px;
  width: min(310px, calc(100% - 32px));
  max-height: calc(100dvh - 125px);
  overflow: auto;
  border-radius: 18px;
  padding: 18px;
}
.layout-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.layout-heading h2 {
  font-size: 15px;
  margin: 0;
}
.layout-editor p {
  font-size: 11px;
  line-height: 1.6;
  color: #abc0cf;
}
.layout-editor label {
  font-size: 11px;
  display: flex;
}
.layout-editor select {
  width: 100%;
  margin: 8px 0;
  background: #132e3e;
  color: white;
  padding: 9px;
  border: 1px solid var(--line);
  border-radius: 8px;
}
.layout-editor input[type='range'] {
  width: 100%;
  height: 28px;
  accent-color: var(--cyan);
}
.layout-editor button {
  border: 1px solid var(--line);
  border-radius: 9px;
  background: #1b3948;
  padding: 9px;
  font-size: 11px;
}
.layout-editor #layout-done {
  background: #175568;
  color: #d5fbff;
}
.layout-actions {
  display: flex;
  gap: 8px;
  margin: 10px 0;
}
.layout-editor small {
  display: block;
  font-size: 10px;
  line-height: 1.6;
  color: #9fbdc9;
  margin-top: 12px;
}
.layout-handle {
  display: none !important;
  position: absolute;
  left: 0;
  top: -12px;
  width: 32px;
  height: 28px;
  border: 1px solid #6bf1ff;
  border-radius: 8px;
  background: #0a465a;
  color: white;
  font-size: 23px;
  line-height: 1;
  cursor: grab;
  touch-action: none;
  pointer-events: auto;
  z-index: 30;
}
.layout-editing .layout-handle {
  display: block !important;
}
.layout-editing #topbar,
.layout-editing #search-shell,
.layout-editing #map-rail,
.layout-editing #chat-shell,
.layout-editing #chat-panel,
.layout-editing #layers-panel,
.layout-editing #controls {
  outline: 1px dashed #63d9e5;
  outline-offset: 3px;
}
.layout-hidden {
  display: none !important;
}
.chat-panel > .layout-handle {
  top: 3px;
  left: auto;
  right: 82px;
}
.layout-editing .chat-panel {
  overflow: visible;
}
.layout-editing .messages {
  overflow: auto;
}
.layout-editing #chat-shell .layout-handle {
  left: -12px;
  top: -12px;
}
@media (max-width: 700px) {
  .layout-toggle {
    left: 16px;
    bottom: calc(30px + env(safe-area-inset-bottom));
    font-size: 11px;
    padding: 12px;
  }
  .layout-editor {
    left: 16px;
    bottom: calc(94px + env(safe-area-inset-bottom));
    max-height: calc(100dvh - 125px);
    padding: 16px;
  }
  .layout-toggle span {
    font-size: 11px;
  }
}
@media (max-height: 520px) {
  .layout-editor {
    top: 12px;
    bottom: 85px;
    max-height: none;
  }
}

#chat-shell {
  position: fixed;
  z-index: 9;
  right: 4.5%;
  bottom: max(38px, env(safe-area-inset-bottom));
}
#chat-shell .chat-launcher {
  position: static;
}
.layout-editing #chat-shell > .layout-handle {
  left: -12px;
  top: -12px;
}
@media (max-width: 700px) {
  #chat-shell {
    right: 16px;
    bottom: calc(30px + env(safe-area-inset-bottom));
  }
}
@media (max-height: 520px) {
  #chat-shell {
    bottom: 30px;
  }
}

#layers-control {
  position: fixed;
  z-index: 8;
  top: 104px;
  right: 4.5%;
}
#layers-toggle {
  position: static;
}
.layout-editing #layers-control {
  outline: 1px dashed #63d9e5;
  outline-offset: 3px;
}
@media (max-width: 700px) {
  #layers-control {
    top: 86px;
    right: 16px;
  }
  #layers-toggle {
    position: static;
  }
}

.layout-resize {
  display: none !important;
  position: absolute;
  right: -12px;
  bottom: -12px;
  z-index: 31;
  width: 30px;
  height: 30px;
  padding: 0;
  border: 0;
  background: transparent;
  cursor: nwse-resize;
  touch-action: none;
  pointer-events: auto;
}
.layout-resize:after {
  content: '';
  position: absolute;
  inset: 7px;
  border: 2px solid #d5fcff;
  border-radius: 50%;
  background: #10cce3;
  box-shadow: 0 0 12px #0ce4ff99;
}
.layout-editing .layout-resize {
  display: block !important;
}

/* Independent box dimensions: no scale transform on text or controls. */
.custom-sized {
  max-width: none;
  max-height: none;
}
.custom-sized#search-shell #map-search {
  height: 100%;
  min-height: 0;
}
.custom-sized#chat-shell .chat-launcher {
  width: 100%;
  height: 100%;
  min-height: 0;
}
.custom-sized#layers-control .round,
.custom-sized#mobile-search-control .round {
  width: 100%;
  height: 100%;
}
.custom-sized#map-rail {
  justify-content: space-between;
}
.custom-sized#topbar {
  align-items: center;
}
.search-shell {
  overflow: visible;
}
.search-results {
  position: absolute;
  top: calc(100% + 8px);
  left: 0;
  right: 0;
  max-height: min(360px, 50dvh);
  margin: 0;
  z-index: 9;
}
.search-results [aria-selected='true'],
.search-results button:hover {
  background: #21495b;
}
.search-results button {
  color: #e6f5ff;
}
.layout-editing .layers-panel,
.layout-editing .controls {
  overflow: visible;
}
.layout-editing .layout-handle {
  top: 0;
  left: 2px;
  right: auto;
}
.layout-editing .chat-panel > .layout-handle {
  top: 2px;
  left: 2px;
  right: auto;
}
.layout-resize {
  width: 24px;
  height: 24px;
  inset: auto;
}
.layout-resize:after {
  inset: 5px;
}
.layout-resize.resize-n {
  top: -10px;
  left: calc(50% - 12px);
  cursor: ns-resize;
}
.layout-resize.resize-s {
  bottom: -10px;
  left: calc(50% - 12px);
  cursor: ns-resize;
}
.layout-resize.resize-e {
  right: -10px;
  top: calc(50% - 12px);
  cursor: ew-resize;
}
.layout-resize.resize-w {
  left: -10px;
  top: calc(50% - 12px);
  cursor: ew-resize;
}
.layout-resize.resize-ne {
  right: -10px;
  top: -10px;
  cursor: nesw-resize;
}
.layout-resize.resize-se {
  right: -10px;
  bottom: -10px;
  cursor: nwse-resize;
}
.layout-resize.resize-sw {
  left: -10px;
  bottom: -10px;
  cursor: nesw-resize;
}
.layout-resize.resize-nw {
  left: -10px;
  top: -10px;
  cursor: nwse-resize;
}
.layout-dimensions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
  margin: 12px 0;
}
.layout-dimensions label {
  display: grid;
  gap: 7px;
}
.layout-dimensions input {
  width: 100%;
  min-width: 0;
  padding: 9px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #0b2333;
}
.layout-heading > div {
  display: flex;
  gap: 6px;
}
.layout-heading #layout-collapse {
  min-width: 36px;
  font-size: 20px;
  padding: 3px;
}
.layout-mini {
  position: fixed;
  z-index: 23;
  left: 4.5%;
  bottom: 88px;
  display: flex;
  gap: 8px;
  border-radius: 14px;
  padding: 8px;
}
.layout-mini button {
  background: #143b4b;
  border: 1px solid #56828d;
  border-radius: 9px;
  padding: 10px;
  color: #e0faff;
  font-size: 12px;
}
#search-shell {
  display: none;
}
body.search-open #search-shell {
  display: block;
}
#mobile-search-control {
  position: fixed;
  z-index: 7;
  left: 19.3%;
  top: 5%;
}
body.search-open #mobile-search-control {
  visibility: hidden;
}
#search-close {
  border: 0;
  background: none;
  padding: 5px;
  font-size: 22px;
  color: #c5dfeb;
}
#place {
  min-width: 0;
}
#map-search {
  width: 100%;
  height: 100%;
}
.composer textarea {
  min-width: 0;
  flex: 1 1 0;
  width: auto;
}
.composer-dock {
  min-width: 0;
}
.composer {
  min-width: 0;
}
.composer button {
  touch-action: manipulation;
}
.composer .send {
  min-width: 40px;
  min-height: 40px;
  position: relative;
  z-index: 1;
}
.messages {
  min-height: 0;
}
.chat-heading,
.composer-dock,
.connection,
#chat-alert {
  flex-shrink: 0;
}
#chat-alert {
  margin: 4px 12px 8px;
  padding: 10px 12px;
  border-radius: 10px;
  background: #3a3326;
  color: #fff0c5;
  font-size: 12px;
  line-height: 1.6;
}
#chat-alert a {
  display: block;
  margin-top: 7px;
  padding: 9px 12px;
  background: #146279;
  border-radius: 8px;
  color: white;
  text-align: center;
  font-weight: 600;
}
@media (min-width: 1050px) {
  .topbar {
    top: 5%;
    left: 4.5%;
    right: 4.5%;
  }
  .brand {
    font-size: clamp(25px, 2vw, 38px);
  }
  .brand-ring {
    width: clamp(37px, 3vw, 56px);
    height: clamp(37px, 3vw, 56px);
  }
  .round {
    width: clamp(43px, 3.35vw, 64px);
    height: clamp(43px, 3.35vw, 64px);
  }
  .round svg {
    width: clamp(23px, 1.65vw, 31px);
    height: clamp(23px, 1.65vw, 31px);
  }
  #search-shell {
    top: 5%;
    left: 19.3%;
    width: 32%;
    height: clamp(50px, 3.9vw, 74px);
  }
  #map-search {
    border-radius: 22px;
  }
  #place {
    font-size: clamp(13px, 1.05vw, 20px);
  }
  #layers-control {
    top: 19%;
    right: 4.5%;
  }
  .map-rail {
    top: 32%;
    right: 4.5%;
    gap: 20px;
  }
  .zoom-control button {
    width: clamp(42px, 3.35vw, 64px);
    height: clamp(38px, 3vw, 57px);
  }
  .layout-toggle {
    bottom: 7%;
    left: 4.5%;
  }
  #chat-shell {
    bottom: 3%;
    right: 4.2%;
  }
  .chat-panel {
    bottom: 100px;
  }
  .layers-panel {
    top: 19%;
  }
}
@media (min-width: 701px) and (max-width: 1049px) {
  #mobile-search-control {
    left: 230px;
    top: 30px;
  }
  #search-shell {
    left: 230px;
    top: 30px;
    width: calc(100% - 440px);
    min-width: 220px;
    height: 50px;
  }
}
@media (max-width: 700px) {
  .topbar {
    top: 20px;
    left: 16px;
    right: 16px;
  }
  .brand {
    font-size: 20px;
    gap: 8px;
  }
  .brand-ring {
    width: 29px;
    height: 29px;
  }
  .topbar nav {
    gap: 6px;
  }
  .topbar .round {
    width: 32px;
    height: 32px;
  }
  #mobile-search-control {
    left: 148px;
    top: 19px;
  }
  #mobile-search-toggle {
    width: 34px;
    height: 34px;
  }
  #search-shell {
    left: 16px;
    right: 16px;
    top: 72px;
    width: calc(100% - 32px);
    height: 48px;
  }
  #place {
    font-size: 16px;
  }
  body.search-open #layers-control {
    top: 136px;
  }
  .layout-mini {
    left: 12px;
    right: 12px;
    bottom: calc(24px + env(safe-area-inset-bottom));
    justify-content: space-between;
  }
  .chat-open:not(.layout-editing) #layout-toggle,
  .chat-open:not(.layout-editing) #chat-shell {
    display: none;
  }
  .chat-open #chat-panel {
    z-index: 24;
    bottom: calc(8px + env(safe-area-inset-bottom));
    max-height: calc(var(--visible-height, 100dvh) - 24px);
    max-width: calc(100vw - 16px);
  }
  .chat-open:not(.layout-editing) #chat-panel:not(.custom-sized),
  .chat-open.keyboard-open:not(.layout-editing) #chat-panel {
    left: 8px !important;
    right: 8px !important;
    top: calc(var(--visible-top, 0px) + 8px) !important;
    bottom: auto !important;
    width: calc(100% - 16px) !important;
    height: calc(var(--visible-height, 100dvh) - 16px) !important;
    translate: none !important;
    scale: none !important;
  }
  .chat-open .composer {
    gap: 5px;
    padding: 8px;
  }
  .chat-open .composer textarea {
    min-width: 0;
    font-size: 16px;
  }
  .chat-open .composer .send {
    width: 40px;
    height: 40px;
    min-width: 40px;
  }
  .chat-open .composer button {
    padding: 3px;
  }
  .chat-open .web-option {
    display: none;
  }
  .chat-open .layout-mini {
    z-index: 26;
  }
  .chat-open .layout-editor {
    z-index: 26;
  }
  .chat-open.layout-editing #layout-toggle {
    z-index: 26;
    top: 10px;
    bottom: auto;
    left: calc(50% - 40px);
  }
  .chat-open .chat-heading {
    padding: 10px 12px 4px;
  }
  .chat-open .chat-heading button {
    min-height: 40px;
    min-width: 40px;
  }
}

.composer textarea {
  scrollbar-width: none;
}
.composer textarea::-webkit-scrollbar {
  display: none;
}

.vision-controls {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px 12px;
  padding: 5px 16px 8px;
  flex-shrink: 0;
  font-size: 11px;
  color: #bad2dd;
}
.vision-controls label {
  display: flex;
  align-items: center;
  gap: 5px;
}
.vision-controls input {
  accent-color: #49e5f8;
}
.vision-controls button {
  border: 1px solid #456573;
  border-radius: 8px;
  padding: 5px 8px;
  background: #102a37;
  color: #dff9ff;
  font-size: 11px;
}
.vision-controls button[aria-pressed='true'] {
  border-color: #50e4e9;
  color: #50e4e9;
}
.vision-controls small {
  width: 100%;
  font-size: 10px;
  color: #92adba;
}
@media (min-width: 701px) {
  .chat-open #chat-panel:not(.custom-sized) {
    left: auto;
    right: 8.7%;
    top: 13.5%;
    bottom: 1%;
    width: 32.2%;
    min-width: 360px;
    height: 85.5%;
    max-height: none;
  }
  .chat-open:not(.layout-editing) #chat-shell {
    visibility: hidden;
  }
}

#vision-preview {
  width: min(1000px, 94vw);
  max-height: 94dvh;
  padding: 12px;
  background: #0b1d29;
  color: white;
  border: 1px solid #416a7d;
  border-radius: 15px;
}
#vision-preview img {
  display: block;
  width: 100%;
  height: auto;
  margin-top: 8px;
}
#vision-preview button {
  padding: 8px 15px;
  background: #174457;
  border: 0;
  border-radius: 8px;
}

#language-panel {
  width: min(460px, 94vw);
  max-height: 85dvh;
  border: 1px solid #456a7c;
  border-radius: 20px;
  background: #0b1d29;
  color: #e7f5fa;
  padding: 22px;
}
#language-panel::backdrop {
  background: #0008;
}
#language-panel header {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
#language-panel h2 {
  font-size: 20px;
}
#language-close {
  background: none;
  border: 0;
  font-size: 26px;
}
#language-panel label {
  display: block;
  font-size: 13px;
}
#language-search {
  width: 100%;
  padding: 12px;
  margin: 10px 0;
  border: 1px solid #436675;
  border-radius: 10px;
  background: #15303f;
  color: white;
}
#language-list {
  max-height: 45dvh;
  overflow: auto;
  display: grid;
  gap: 5px;
}
#language-list button {
  text-align: start;
  background: #132c3a;
  border: 1px solid transparent;
  border-radius: 9px;
  padding: 12px;
  color: #dceef5;
  font-size: 14px;
}
#language-list button[aria-pressed='true'] {
  border-color: #4cecff;
}
#language-panel small {
  display: block;
  color: #91afbe;
  font-size: 11px;
  margin-top: 15px;
}
#language-status {
  font-size: 13px;
  color: #8beaf3;
}
html[dir='rtl'] .chat-panel,
html[dir='rtl'] .topbar,
html[dir='rtl'] .map-rail {
  direction: ltr;
}

@media (min-width: 701px) {
  body.chat-open:not(.layout-editing) #chat-panel.auto-fitted {
    left: var(--chat-fit-left) !important;
    top: var(--chat-fit-top) !important;
    width: var(--chat-fit-width) !important;
    height: var(--chat-fit-height) !important;
    right: auto !important;
    bottom: auto !important;
    min-width: 0 !important;
    min-height: 0 !important;
    max-width: none !important;
    max-height: none !important;
    translate: none !important;
    scale: none !important;
  }
  .chat-panel .messages {
    flex: 1 1 0;
    min-height: 0;
  }
  .chat-panel .web-option {
    flex-shrink: 0;
  }
}
@media (min-width: 701px) and (max-height: 600px) {
  .map-rail {
    top: 144px;
    gap: 6px;
  }
  .map-rail .round {
    width: 36px;
    height: 36px;
  }
  .map-rail .round svg {
    width: 20px;
    height: 20px;
  }
  .zoom-control button {
    width: 36px;
    height: 32px;
  }
  #layers-control {
    top: 90px;
  }
  .chat-panel .web-option {
    display: none;
  }
  .chat-heading {
    padding: 8px 14px;
  }
  .connection {
    padding-bottom: 4px;
  }
  .vision-controls {
    padding: 4px 12px;
    gap: 3px 8px;
  }
  .composer-dock {
    margin-bottom: 8px;
  }
  .composer {
    min-height: 50px;
    padding: 6px 10px;
    gap: 8px;
  }
}

body.chat-open:not(.layout-editing) #chat-panel.auto-fitted {
  left: var(--chat-fit-left) !important;
  top: var(--chat-fit-top) !important;
  width: var(--chat-fit-width) !important;
  height: var(--chat-fit-height) !important;
  right: auto !important;
  bottom: auto !important;
  min-width: 0 !important;
  min-height: 0 !important;
  max-width: none !important;
  max-height: none !important;
  translate: none !important;
  scale: none !important;
}
body.chat-open:not(.layout-editing) #chat-shell {
  display: none !important;
}
@media (max-width: 700px) {
  body.chat-open:not(.layout-editing) #layout-toggle {
    display: block;
    bottom: calc(12px + env(safe-area-inset-bottom));
    top: auto;
    left: 12px;
    z-index: 25;
  }
  .map-rail {
    max-height: calc(var(--visible-height, 100dvh) - 160px);
    overflow-y: auto;
    scrollbar-width: none;
  }
  .map-rail::-webkit-scrollbar {
    display: none;
  }
  body.keyboard-open #map-rail {
    top: 120px;
    gap: 6px;
    max-height: calc(var(--visible-height, 100dvh) - 132px);
  }
  body.keyboard-open .map-rail .round {
    width: 32px;
    height: 32px;
  }
  body.keyboard-open .zoom-control button {
    width: 32px;
    height: 28px;
  }
  body.keyboard-open #layers-control {
    top: 74px;
  }
  body.keyboard-open #layers-toggle {
    top: auto;
    width: 32px;
    height: 32px;
  }
  .chat-panel .vision-controls {
    padding: 4px 9px;
    gap: 3px 7px;
    font-size: 10px;
  }
  .chat-panel .vision-controls button {
    font-size: 10px;
    padding: 4px 5px;
  }
  .chat-panel .vision-controls small {
    font-size: 9px;
  }
  .chat-panel .composer-dock {
    margin-left: 6px;
    margin-right: 6px;
  }
  .chat-panel .composer-divider {
    display: none;
  }
  .chat-panel .messages {
    min-height: 0;
    flex: 1 1 0;
  }
  .chat-panel .chat-heading h2 {
    font-size: 14px;
  }
  .chat-panel .connection {
    font-size: 10px;
  }
  .chat-panel .composer textarea {
    padding: 3px;
    font-size: 16px;
  }
  .chat-panel .chat-heading button {
    min-width: 32px;
    min-height: 34px;
  }
}

@media (max-width: 700px) {
  body.chat-open:not(.layout-editing) #layout-toggle {
    display: none !important;
  }
  .chat-open:not(.layout-editing) #chat-panel {
    left: 8px !important;
    right: 8px !important;
    top: calc(var(--visible-top, 0px) + 8px) !important;
    bottom: auto !important;
    width: calc(100% - 16px) !important;
    height: calc(var(--visible-height, 100dvh) - 16px) !important;
    max-width: none !important;
    max-height: none !important;
    translate: none !important;
    scale: none !important;
    z-index: 24;
  }
}

.layers-heading {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 10px;
}
.layers-heading h2 {
  margin: 0;
  flex: 1;
  white-space: nowrap;
}
.layers-heading .globe-mode {
  width: auto;
  font-size: 11px;
  padding: 7px 9px;
  white-space: nowrap;
  margin: 0;
}
.layers-heading #layers-close {
  border: 0;
  background: transparent;
  color: #dff7ff;
  font-size: 24px;
  width: 30px;
  height: 32px;
  padding: 0;
  flex-shrink: 0;
}
@media (max-width: 700px) {
  body:not(.layout-editing) #layers-panel {
    left: 8px !important;
    right: 8px !important;
    top: auto !important;
    bottom: calc(8px + env(safe-area-inset-bottom)) !important;
    width: calc(100% - 16px) !important;
    height: auto !important;
    max-height: min(240px, 42dvh) !important;
    padding: 10px 12px;
    border-radius: 18px;
    overflow: hidden;
    z-index: 16;
    translate: none !important;
    scale: none !important;
  }
  #layers-panel .layers-heading {
    margin-bottom: 5px;
    min-height: 32px;
  }
  #layers-panel .layers-heading h2 {
    font-size: 13px;
  }
  #layers-panel .layers-heading .globe-mode {
    font-size: 11px;
    padding: 5px 8px;
  }
  #layers-panel > .layer-hint {
    display: none;
  }
  #layers-panel #layer-list {
    max-height: min(170px, calc(42dvh - 64px));
    overflow-y: auto;
    overscroll-behavior: contain;
  }
  #layers-panel .layer-row {
    display: grid;
    grid-template-columns: minmax(115px, 1fr) 32px minmax(70px, 100px);
    align-items: center;
    gap: 6px;
    padding: 0;
    min-height: 44px;
  }
  #layers-panel .layer-toggle {
    gap: 6px;
    min-height: 44px;
  }
  #layers-panel .layer-toggle input {
    width: 19px;
    height: 19px;
    margin: 0;
  }
  #layers-panel .layer-toggle strong {
    font-size: 11px;
    line-height: 1.3;
  }
  #layers-panel .layer-toggle small {
    display: none;
  }
  #layers-panel .opacity-label {
    font-size: 0;
    margin: 0;
    justify-content: end;
  }
  #layers-panel .opacity-label output {
    font-size: 10px;
  }
  #layers-panel .layer-row input[type='range'] {
    height: 36px;
    min-width: 0;
    touch-action: pan-y;
  }
  body.layers-open:not(.layout-editing) #chat-shell,
  body.layers-open:not(.layout-editing) #layout-toggle {
    visibility: hidden;
  }
  #layers-panel #layers-empty:not([hidden]) {
    display: block;
    font-size: 10px;
    margin: 5px 0 0;
  }
}

#layers-grip {
  display: none;
}
@media (max-width: 700px) {
  body:not(.layout-editing) #layers-panel {
    display: flex;
    flex-direction: column;
    height: var(--layer-sheet-height, 210px) !important;
    max-height: min(320px, 45dvh) !important;
    padding-top: 2px;
  }
  #layers-grip {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    height: 20px;
    width: 100%;
    border: 0;
    background: none;
    touch-action: none;
    cursor: ns-resize;
    padding: 0;
  }
  #layers-grip span {
    display: block;
    width: 44px;
    height: 4px;
    background: #7797a7;
    border-radius: 8px;
  }
  #layers-panel .layers-heading {
    flex-shrink: 0;
  }
  #layers-panel #layer-list {
    flex: 1;
    min-height: 0;
    max-height: none;
  }
  #layers-panel .layer-row {
    min-height: 44px;
  }
  #layers-panel #layers-empty {
    flex-shrink: 0;
  }
}

#chat-grip {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  height: 19px;
  width: 100%;
  border: 0;
  background: none;
  touch-action: none;
  cursor: ns-resize;
  padding: 0;
}
#chat-grip span {
  display: block;
  width: 44px;
  height: 4px;
  background: #7797a7;
  border-radius: 8px;
}
.chat-panel .chat-heading {
  padding-top: 3px;
}
@media (max-width: 700px) {
  body.chat-open:not(.layout-editing) #chat-panel.auto-fitted {
    left: var(--chat-fit-left) !important;
    top: var(--chat-fit-top) !important;
    width: var(--chat-fit-width) !important;
    height: var(--chat-fit-height) !important;
    right: auto !important;
    bottom: auto !important;
  }
}

.chat-panel .web-option {
  display: none !important;
}
.message.processing .label::after {
  content: '';
  display: inline-block;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #4cecff;
  margin-left: 7px;
  animation: processing-pulse 1s ease-in-out infinite;
}
@keyframes processing-pulse {
  0%,
  100% {
    opacity: 0.25;
  }
  50% {
    opacity: 1;
  }
}
@media (prefers-reduced-motion: reduce) {
  .message.processing .label::after {
    animation: none;
  }
}

#language-toast {
  position: fixed;
  z-index: 40;
  left: 50%;
  top: 80px;
  transform: translateX(-50%);
  max-width: calc(100vw - 32px);
  padding: 10px 16px;
  border: 1px solid #4e7384;
  border-radius: 12px;
  background: #102b3a;
  color: #dff8ff;
  font-size: 12px;
  box-shadow: 0 8px 24px #0005;
}

/* Shared tool-panel contract: task controls above chat, viewport bounded, internal scroll. */
[data-ui-panel] {
  z-index: 40 !important;
  scroll-padding: 44px 8px;
  overscroll-behavior: contain;
}
[data-ui-panel][data-panel-active] {
  z-index: 45 !important;
}
body:not(.layout-editing) [data-ui-panel].viewport-panel {
  position: fixed;
  left: var(--panel-left) !important;
  top: var(--panel-top) !important;
  width: var(--panel-width) !important;
  height: var(--panel-height) !important;
  right: auto !important;
  bottom: auto !important;
  max-width: calc(100vw - 16px) !important;
  max-height: calc(var(--visible-height, 100dvh) - 16px) !important;
  overflow: auto;
  translate: none !important;
  scale: none !important;
}
body:not(.layout-editing) #map-rail #layers-control {
  position: static !important;
  inset: auto !important;
  width: auto !important;
  height: auto !important;
  transform: none !important;
  translate: none !important;
  scale: none !important;
}
body:not(.layout-editing) #map-rail #layers-toggle {
  position: static !important;
  inset: auto !important;
}
#map-rail {
  max-height: calc(var(--visible-height, 100dvh) - 32dvh - 20px);
  overflow-y: auto;
  scrollbar-width: none;
}
#map-rail::-webkit-scrollbar {
  display: none;
}
.layers-heading {
  position: sticky;
  top: 0;
  background: #102330;
  z-index: 2;
  padding-bottom: 5px;
}
.layers-heading button {
  min-width: 32px;
  min-height: 32px;
}
#controls-close {
  border: 0;
  background: none;
  color: inherit;
  font-size: 24px;
}
.tool-panel-open #chat-shell {
  visibility: hidden;
}
[data-ui-panel] :focus-visible {
  outline: 2px solid #70f0ff;
  outline-offset: 2px;
}
.layers-panel .layer-row input[type='range'] {
  min-height: 32px;
}
@media (pointer: coarse) {
  [data-ui-panel] button {
    min-height: 40px;
  }
  [data-ui-panel] input[type='range'] {
    min-height: 44px;
  }
  .layer-toggle {
    min-height: 44px;
  }
}
@media (max-width: 700px) {
  body:not(.layout-editing) #map-rail #layers-toggle {
    width: 40px;
    height: 40px;
  }
  #map-rail {
    max-height: calc(var(--visible-height, 100dvh) - 34dvh - 20px);
  }
  #layers-panel .layers-heading {
    position: static;
    padding: 0;
  }
  .layers-panel #layers-grip {
    min-height: 20px;
  }
  .layers-panel .layers-heading button {
    min-height: 32px;
  }
}

.layers-heading h2 {
  min-width: 0;
  white-space: normal;
  overflow-wrap: anywhere;
  flex: 1 1 100px;
}
.layers-heading .globe-mode,
.layers-heading #layers-close,
.layers-heading #controls-close {
  flex: 0 0 auto;
}
/* Saved layers use the common tool-panel contract and keep the map visible. */
.library-panel {
  position: fixed;
  right: 7.5vw;
  top: 100px;
  width: 390px;
  max-height: calc(100dvh - 140px);
  padding: 16px;
  border-radius: 22px;
  overflow: auto;
  color: var(--text, #e4eff5);
  background: #10232ef5;
  z-index: 40;
}
.library-panel[hidden] {
  display: none !important;
}
.library-panel .layers-heading {
  position: sticky;
  top: -16px;
  background: #10232e;
  z-index: 2;
  padding: 12px 0;
  margin-top: -12px;
}
.library-panel h2 {
  font-size: 18px;
  overflow-wrap: anywhere;
}
.library-panel h3 {
  font-size: 15px;
  margin: 10px 0;
}
.library-panel p {
  font-size: 13px;
  line-height: 1.55;
  overflow-wrap: anywhere;
}
.library-panel small {
  color: #9cb7c5;
  overflow-wrap: anywhere;
}
/* U7: a hint or a coordinate line placed straight in a panel sits on its own line, never wrapped around a button. */
.library-body > small,
.library-body small:has(+ button),
.library-body button + small {
  display: block;
  margin: 6px 0;
}
.library-tabs,
.library-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin: 10px 0;
}
.library-panel button,
.library-panel select {
  border: 1px solid #355262;
  background: #183442;
  color: #dcebf2;
  border-radius: 10px;
  min-height: 40px;
  padding: 7px 11px;
  cursor: pointer;
}
.library-tabs button[aria-pressed='true'] {
  border-color: #43dff3;
  background: #205064;
}
.library-body > label,
.library-card > label {
  display: block;
  font-size: 13px;
  margin: 12px 0;
}
.library-body input:not([type='checkbox']):not([type='radio']):not([type='range']),
.library-body textarea {
  display: block;
  width: 100%;
  box-sizing: border-box;
  border: 1px solid #45616d;
  border-radius: 9px;
  background: #091b26;
  color: #e6f3f7;
  padding: 10px;
  margin-top: 6px;
  min-height: 42px;
  font: inherit;
}
.library-card,
.library-review,
.library-confirm {
  border: 1px solid #355262;
  border-radius: 12px;
  padding: 12px;
  margin: 12px 0;
}
.library-card h3 {
  margin-top: 0;
}
.library-confirm {
  border-color: #51dce9;
}
.library-status {
  color: #8ae8f2;
}
.library-panel details {
  margin: 12px 0;
  font-size: 13px;
}
.library-panel summary {
  cursor: pointer;
  min-height: 32px;
}
.saved-overlay-row {
  display: grid;
  grid-template-columns: 1fr 38px;
  gap: 5px;
  padding: 9px 0;
  border-top: 1px solid #355262;
}
.saved-overlay-row label {
  grid-column: 1;
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
}
.saved-overlay-row input[type='range'] {
  grid-column: 1;
  width: 100%;
  accent-color: #4de4f5;
}
.saved-overlay-row button {
  grid-column: 2;
  grid-row: 1/3;
  min-height: 40px;
}
.saved-overlay-row input[type='checkbox'] {
  accent-color: #4de4f5;
}
.map-feature-detail {
  color: #142831;
  max-height: 210px;
  overflow: auto;
  overflow-wrap: anywhere;
}
.map-feature-detail p {
  font-size: 12px;
}
.library-panel button:focus-visible {
  outline: 2px solid #57eaff;
  outline-offset: 2px;
}
#library-open {
  margin: 4px 0 8px;
  min-height: 36px;
}
@media (max-width: 700px) {
  body:not(.layout-editing) #map-library {
    left: 8px !important;
    right: 8px !important;
    top: auto !important;
    bottom: calc(8px + env(safe-area-inset-bottom)) !important;
    width: auto !important;
    height: min(
      var(--library-height, 46dvh),
      calc(var(--visible-height, 100dvh) - 16px)
    ) !important;
    max-height: calc(100dvh - 16px) !important;
    padding: 12px;
    border-radius: 20px;
  }
  .library-panel .layers-heading {
    top: -12px;
  }
  .library-tabs button {
    padding: 6px 9px;
    font-size: 12px;
  }
  #library-open {
    font-size: 12px;
    min-height: 32px;
    margin: 0 0 4px;
  }
  .library-panel input,
  .library-panel textarea {
    font-size: 16px !important;
  }
}

.library-grip {
  display: none;
}
@media (max-width: 700px) {
  .library-panel .library-grip {
    display: block;
    width: 100%;
    height: 24px;
    min-height: 24px;
    padding: 0;
    border: 0;
    background: none;
    color: #87aebd;
    touch-action: none;
    cursor: ns-resize;
  }
  .library-panel .layers-heading {
    margin-top: 0;
  }
}
.library-panel {
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
.library-panel .layers-heading,
.library-tabs,
.library-grip,
.library-status {
  flex-shrink: 0;
}
.library-panel .layers-heading {
  position: relative;
  top: 0;
}
.library-body {
  overflow: auto;
  min-height: 0;
  overscroll-behavior: contain;
  scroll-padding: 12px;
}
.library-body select {
  display: block;
  max-width: 100%;
  width: 100%;
  margin-top: 6px;
}
.library-body pre {
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  font-size: 12px;
}
.library-body :focus-visible {
  outline: 2px solid #57eaff;
  outline-offset: 2px;
}
.library-body input[type='checkbox'],
.library-body input[type='radio'] {
  width: 22px;
  height: 22px;
  vertical-align: middle;
  margin-right: 8px;
}
.library-body details > summary {
  padding: 6px 0;
}
.library-body a {
  color: #79e5f3;
}

@media (max-width: 700px) {
  .library-tabs {
    flex-wrap: nowrap;
    overflow-x: auto;
    margin: 6px 0;
    gap: 5px;
  }
  .library-tabs button {
    flex: 0 0 auto;
    white-space: nowrap;
    min-height: 34px;
    font-size: 11px;
    padding: 5px 7px;
  }
  .library-panel .layers-heading {
    padding: 3px 0;
  }
  .library-body > .library-actions:first-child {
    flex-wrap: nowrap;
    margin: 5px 0;
  }
  .library-body > .library-actions:first-child button {
    flex: 1;
    white-space: nowrap;
    font-size: 12px;
    padding: 5px;
    min-height: 34px;
  }
  .library-card {
    margin: 7px 0;
    padding: 9px;
  }
  .library-card > p {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
  }
  .library-card .library-actions {
    margin-bottom: 0;
  }
  .library-card button {
    min-height: 34px;
    font-size: 12px;
  }
  .library-panel h3 {
    font-size: 14px;
  }
}
/* Comfortable drag targets: track stays slim, interaction area stays large. */
input[type='range'] {
  -webkit-appearance: none;
  appearance: none;
  background: transparent;
  min-height: 44px;
  min-width: 0;
  touch-action: none !important;
  cursor: ew-resize;
  user-select: none;
  -webkit-user-select: none;
  padding: 0 2px;
  margin: 0;
  width: 100%;
}
input[type='range']::-webkit-slider-runnable-track {
  height: 6px;
  border-radius: 6px;
  background: #426674;
}
input[type='range']::-moz-range-track {
  height: 6px;
  border-radius: 6px;
  background: #426674;
}
input[type='range']::-webkit-slider-thumb {
  -webkit-appearance: none;
  width: 28px;
  height: 28px;
  margin-top: -11px;
  border: 2px solid #c8fbff;
  border-radius: 50%;
  background: #42dfef;
  box-shadow: 0 1px 7px #0005;
}
input[type='range']::-moz-range-thumb {
  width: 24px;
  height: 24px;
  border: 2px solid #c8fbff;
  border-radius: 50%;
  background: #42dfef;
  box-shadow: 0 1px 7px #0005;
}
input[type='range']:active::-webkit-slider-thumb {
  background: #b1faff;
  border-color: white;
}
input[type='range']:active::-moz-range-thumb {
  background: #b1faff;
  border-color: white;
}
#chat-grip,
#layers-panel #layers-grip,
.library-panel .library-grip {
  height: 44px;
  min-height: 44px;
  touch-action: none;
  user-select: none;
  -webkit-user-select: none;
}
#chat-grip span,
#layers-grip span {
  width: 56px;
  height: 6px;
}
.layout-handle {
  width: 44px;
  height: 44px;
  user-select: none;
  -webkit-user-select: none;
}
.layout-handle:active {
  cursor: grabbing;
}
.layout-resize {
  width: 40px;
  height: 40px;
  user-select: none;
  -webkit-user-select: none;
}
.layout-resize:after {
  inset: 12px;
}
.layout-resize.resize-n {
  top: -18px;
  left: calc(50% - 20px);
}
.layout-resize.resize-s {
  bottom: -18px;
  left: calc(50% - 20px);
}
.layout-resize.resize-e {
  right: -18px;
  top: calc(50% - 20px);
}
.layout-resize.resize-w {
  left: -18px;
  top: calc(50% - 20px);
}
.layout-resize.resize-ne {
  right: -18px;
  top: -18px;
}
.layout-resize.resize-se {
  right: -18px;
  bottom: -18px;
}
.layout-resize.resize-sw {
  left: -18px;
  bottom: -18px;
}
.layout-resize.resize-nw {
  left: -18px;
  top: -18px;
}
@media (max-width: 700px) {
  #layers-panel .layer-row {
    grid-template-columns: minmax(0, 1fr) 42px;
    gap: 0 10px;
    padding: 5px 0;
    min-height: 88px;
  }
  #layers-panel .layer-row input[type='range'] {
    grid-column: 1/-1;
    height: 44px;
    min-height: 44px;
  }
  #layers-panel .layer-toggle {
    min-height: 34px;
  }
  #layers-panel .opacity-label output {
    font-size: 12px;
  }
  body:not(.layout-editing) #layers-panel {
    height: var(--layer-sheet-height, 320px) !important;
    max-height: min(440px, 60dvh) !important;
  }
}
.location-detail {
  color: #142831;
  max-width: 260px;
}
.location-detail p {
  font-size: 13px;
}
.location-detail small {
  display: block;
  margin-top: 9px;
  line-height: 1.5;
}
.location-detail button {
  min-height: 44px;
  border: 0;
  border-radius: 8px;
  padding: 8px 14px;
  background: #07596c;
  color: white;
}
.maplibregl-popup-close-button {
  min-width: 36px;
  min-height: 36px;
  color: #142831;
}
.maplibregl-popup-content {
  padding: 18px 32px 16px 16px;
}
.place-photo {
  display: block;
  width: 100%;
  max-height: 220px;
  object-fit: cover;
  border-radius: 10px;
  margin: 6px 0;
  background: #0002;
}
.photo-preview:empty {
  display: none;
}
.feature-entry {
  border-top: 1px solid #b5c6cb;
  margin-top: 10px;
  padding-top: 6px;
}
.layer-swatch {
  width: 13px;
  height: 13px;
  flex-shrink: 0;
  border: 1px solid #fff8;
  border-radius: 50%;
}
.maplibregl-marker[role='button'] {
  cursor: pointer;
}
.maplibregl-marker[role='button']:focus-visible {
  outline: 3px solid white;
  outline-offset: 4px;
}
.location-detail,
.map-feature-detail {
  color: #e6f4fb;
}
.location-detail small {
  color: #afc8d4;
}
.maplibregl-popup-close-button {
  color: #e6f4fb;
}
.maplibregl-popup-content {
  background: #102733;
  color: #e6f4fb;
  border: 1px solid #537382;
  border-radius: 14px;
  box-shadow: 0 8px 28px #0005;
}
.feature-entry {
  border-color: #48616e;
}
.layer-time {
  border-top: 1px solid #3c5a68;
  padding: 10px 0;
  font-size: 12px;
}
.layer-time summary {
  cursor: pointer;
  min-height: 44px;
  padding: 12px 0;
}
.layer-time label,
.layer-time small {
  display: block;
  line-height: 1.5;
  margin-bottom: 8px;
}
.layer-time input {
  width: 100%;
  min-height: 44px;
  border: 1px solid #547382;
  border-radius: 8px;
  padding: 8px;
  background: #102733;
  color: #eef9ff;
}
.layer-time button,
.layer-order button {
  min-height: 44px;
  border: 1px solid #547382;
  background: #183b49;
  border-radius: 8px;
  padding: 8px 12px;
}
.saved-overlay-row .layer-order {
  grid-column: 1;
  grid-row: 3;
  display: flex;
  gap: 8px;
}
.saved-overlay-row .layer-order button {
  min-width: 44px;
}
.saved-overlay-list:empty + .layer-time {
  display: none;
}
/* One scroll area keeps every layer tool reachable as the stack grows. */
.layers-content {
  min-height: 0;
  overflow: auto;
  overscroll-behavior: contain;
  max-height: calc(var(--visible-height, 100dvh) - 190px);
  scroll-padding: 12px 0;
}
body:not(.layout-editing) #layers-panel.viewport-panel {
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
#layers-panel .layers-heading,
#layers-panel > .library-open {
  flex-shrink: 0;
}
#layers-panel .layers-content {
  flex: 1;
  min-height: 0;
  max-height: none;
}
@media (max-width: 700px) {
  #layers-panel .layers-content {
    flex: 1;
    min-height: 0;
    max-height: none;
  }
  #layers-panel #layer-list {
    overflow: visible;
    max-height: none;
    flex: none;
  }
  #layers-panel .layers-content .layer-hint {
    display: none;
  }
  .layer-time {
    flex-shrink: 0;
  }
}

/* Unified layer directory: metadata first, geometry on demand. */
.layer-browser h3,
.layers-content > h3 {
  font-size: 13px;
  margin: 14px 0 8px;
}
.layer-browser > input {
  width: 100%;
  min-height: 44px;
  box-sizing: border-box;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #0b202d;
  color: #e5f4fa;
  padding: 10px;
  font: inherit;
  font-size: 13px;
}
.layer-browser > p {
  font-size: 11px;
  color: #a8bfcd;
  line-height: 1.5;
}
.layer-browser-group {
  border-top: 1px solid var(--line);
}
.layers-content > .layer-hint:first-child,
.layers-content > .saved-overlay-list,
.layers-content > .layer-time,
.layers-content > h3 {
  display: none !important;
}
.layer-top {
  padding-bottom: 6px;
}
.layer-global {
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 8px 10px;
  margin-top: 8px;
}
.layer-all {
  display: flex;
  align-items: center;
  gap: 9px;
  min-height: 40px;
  font-size: 13px;
  cursor: pointer;
}
.layer-controls {
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: 6px 8px;
  align-items: center;
  font-size: 11px;
  color: #a8bfcd;
  flex-basis: 100%;
}
.layer-controls input[type='range'] {
  width: 100%;
  min-width: 0;
  height: 28px;
  accent-color: var(--cyan);
}
.layer-controls output {
  min-width: 62px;
  text-align: right;
}
.layer-browser-row {
  flex-wrap: wrap;
}
.layer-browser-row .layer-controls {
  padding: 0 0 8px 31px;
}
.layer-browser-group > summary input,
.layer-all input {
  width: 22px;
  height: 22px;
  vertical-align: middle;
  margin-right: 9px;
  accent-color: var(--cyan);
}
.layer-browser-group > p {
  font-size: 11px;
  color: #a8bfcd;
  margin: 4px 0 10px;
}
.layer-browser-group > summary {
  min-height: 44px;
  box-sizing: border-box;
  padding: 13px 3px;
  font-size: 12px;
  cursor: pointer;
  color: #d8edf4;
}
.layer-browser-row {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 5px 0;
  border-top: 1px solid #ffffff0c;
}
.layer-browser-row label {
  display: flex;
  align-items: center;
  gap: 9px;
  flex: 1;
  min-width: 0;
  min-height: 44px;
  cursor: pointer;
  font-size: 12px;
}
.layer-browser-row input {
  width: 22px;
  height: 22px;
  flex-shrink: 0;
  accent-color: var(--cyan);
}
.layer-browser-row button,
.layer-browser .library-actions button {
  min-height: 44px;
  border: 1px solid var(--line);
  border-radius: 9px;
  background: #123442;
  color: #e5f4fa;
  padding: 7px;
  font-size: 11px;
}
.layer-browser-group:focus-visible,
.layer-browser :focus-visible {
  outline: 2px solid var(--cyan);
  outline-offset: 2px;
}

.ai-speech {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  margin-top: 12px;
}
.ai-speech button {
  min-height: 44px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: #153b4c;
  color: #d8f8ff;
  padding: 8px 12px;
}
.ai-speech small {
  color: #9fb6c5;
  font-size: 11px;
}

.voice-control {
  padding: 12px;
  border: 1px solid #345363;
  border-radius: 14px;
  margin-top: 12px;
}
.voice-control button {
  min-height: 44px;
  border-radius: 10px;
  background: #164557;
  color: #e7f8ff;
  border: 1px solid #3ba6bc;
  padding: 8px 12px;
}
.voice-control p {
  font-size: 12px;
  color: #aac1cc;
}
.voice-control > div {
  max-height: 180px;
  overflow: auto;
  white-space: pre-wrap;
}
.place-bar {
  margin: 6px 0;
}
.place-bar button {
  min-height: 40px;
}
.entry-row {
  display: flex;
  gap: 8px;
  align-items: stretch;
}
.entry-row > input,
.entry-row > textarea {
  flex: 1;
  min-width: 0;
}
.entry-row > button {
  flex: none;
  min-height: 44px;
  padding: 0 14px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #123442;
  color: #e5f4fa;
  font: inherit;
  font-size: 13px;
}
.layer-browser .entry-row > input {
  width: auto;
  min-height: 44px;
  box-sizing: border-box;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #0b202d;
  color: #e5f4fa;
  padding: 10px;
  font: inherit;
  font-size: 13px;
}
/* Constitution: busy buttons, close and clear buttons, empty and error blocks, paging, focus, long text, no sideways scroll */
html,
body {
  max-width: 100%;
  overflow-x: clip;
}
button,
[role='button'],
summary,
a.btn,
label:has(> input[type='checkbox']),
label:has(> input[type='radio']) {
  cursor: pointer;
}
button:focus-visible,
a:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible,
summary:focus-visible {
  outline: 2px solid #4cecff;
  outline-offset: 2px;
}
button:active:not(:disabled) {
  transform: translateY(1px);
}
button.is-busy {
  position: relative;
  color: transparent !important;
  pointer-events: none;
}
button.is-busy::after {
  content: '';
  position: absolute;
  inset: 0;
  margin: auto;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  border: 2px solid #4cecff;
  border-right-color: transparent;
  animation: eonumi-spin 0.8s linear infinite;
}
@keyframes eonumi-spin {
  to {
    transform: rotate(360deg);
  }
}
.clear-wrap {
  position: relative;
  display: flex;
  flex: 1;
  min-width: 0;
  width: 100%;
}
.clear-wrap > input,
.clear-wrap > textarea {
  flex: 1;
  min-width: 0;
  width: 100%;
  padding-right: 34px !important;
}
.clear-x {
  position: absolute;
  right: 4px;
  top: 50%;
  transform: translateY(-50%);
  width: 28px;
  height: 28px;
  min-height: 28px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 50%;
  background: transparent !important;
  color: inherit;
  opacity: 0.7;
  font-size: 18px;
  line-height: 28px;
}
.clear-wrap.multi > .clear-x {
  top: 6px;
  transform: none;
}
.clear-x:hover {
  opacity: 1;
}
.close-x {
  float: right;
  min-width: 36px;
  min-height: 36px;
  border-radius: 50%;
  font-size: 20px;
  line-height: 1;
}
.empty-state,
.error-state {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 10px;
  padding: 14px;
  border: 1px dashed #a7c4d455;
  border-radius: 12px;
  margin: 10px 0;
}
.empty-state::before {
  content: '○';
  font-size: 22px;
  opacity: 0.6;
}
.error-state::before {
  content: '⚠';
  font-size: 22px;
  color: #ffb35c;
}
.page-more {
  display: block;
  width: 100%;
  margin: 10px 0;
  min-height: 44px;
}
.library-panel.is-loading .library-body {
  opacity: 0.55;
  pointer-events: none;
}
.library-panel.is-loading .layers-heading {
  background-image: linear-gradient(90deg, transparent, #4cecff55, transparent);
  background-size: 200% 100%;
  animation: eonumi-load 1.1s linear infinite;
}
@keyframes eonumi-load {
  from {
    background-position: 200% 0;
  }
  to {
    background-position: -200% 0;
  }
}
.library-card h3,
.library-card strong,
.layer-browser-row label span,
.clamp {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  overflow-wrap: anywhere;
}
.confirm-dialog {
  max-width: min(460px, 92vw);
  border: 1px solid #4cecff88;
  border-radius: 16px;
  padding: 20px;
  background: #0c1d28;
  color: #edf7ff;
}
.confirm-dialog::backdrop {
  background: #000a;
}
.confirm-dialog h2 {
  margin: 0 0 8px;
  font-size: 18px;
}
.confirm-name {
  font-weight: 700;
  overflow-wrap: anywhere;
}
.confirm-dialog label {
  display: block;
  margin: 10px 0;
}
.confirm-dialog input {
  width: 100%;
  min-height: 40px;
  box-sizing: border-box;
}
.confirm-actions {
  display: flex;
  gap: 10px;
  justify-content: flex-end;
  margin-top: 14px;
}
.confirm-actions button {
  min-height: 42px;
  padding: 0 16px;
  border-radius: 10px;
}
.confirm-actions .danger {
  border-color: #e5534b;
  background: #5a1d1a;
  color: #fff;
}
.needs-check {
  color: #ffb35c;
}
.open-now {
  color: #5fd38d;
}
.closed-now {
  opacity: 0.7;
}
.autosave-note {
  font-size: 12px;
  opacity: 0.85;
}
.autosave-note button {
  margin-left: 6px;
  min-height: 32px;
}
.group-toggles {
  display: flex;
  flex-wrap: wrap;
  gap: 4px 12px;
  padding: 0 0 8px 31px;
  font-size: 12px;
}
.group-toggles label {
  display: flex;
  align-items: center;
  gap: 6px;
  min-height: 32px;
}
.group-tag {
  font-weight: 600;
}
/* Art. 5: in every dialog a field sits under its label, never beside the next one */
dialog label:has(> select),
dialog label:has(> textarea),
dialog label:has(> input:not([type='checkbox']):not([type='radio'])) {
  display: grid;
  gap: 4px;
  min-width: 0;
}
dialog label > select,
dialog label > input,
dialog label > textarea {
  max-width: 100%;
}

/* Generated by scripts/light-theme.mjs from src/style.css. Do not edit by hand. */
:root[data-theme=light]{color-scheme:light}:root[data-theme=light]{color:#000a12;background:#e3eefa;--cyan:#00a0b3;--line:#2b48582b;--muted:#475b6c}:root[data-theme=light] .world{background-color:#e1eefc;background-image:radial-gradient(ellipse at 65% 0%, #accbe966, transparent 50%),
    radial-gradient(1px 1px at 15% 19%, #203147 99%, transparent),
    radial-gradient(1px 1px at 75% 29%, #203147 99%, transparent),
    radial-gradient(1px 1px at 55% 63%, #203147 99%, transparent),
    radial-gradient(1px 1px at 92% 73%, #203147 99%, transparent)}:root[data-theme=light] .world-shade{background:linear-gradient(
    180deg,
    #e2effb70 0%,
    transparent 24%,
    transparent 57%,
    #deebfc90 81%,
    #e2effb 100%
  )}:root[data-theme=light] .brand-ring{background:conic-gradient(from 210deg, #23b9ff, #00aabf 25%, #00090b 49%, #d1e2f7 73%, #d1e2f7)}:root[data-theme=light] .brand-ring:after{background:#d8e9f9}:root[data-theme=light] .round{background:#d2e2f1a6}:root[data-theme=light] .round:hover{background:#b4cee3c9;border-color:#22687877}:root[data-theme=light] .glass{background:linear-gradient(120deg, #c6d3e3d9, #cee2f4de);border:1px solid #2d465a4a}:root[data-theme=light] .zoom-control button:hover{background:#5f7f9b33}:root[data-theme=light] .composer{background:linear-gradient(105deg, #b5c5d9cc, #c2def2d9)}:root[data-theme=light] .composer-divider{background:#25394d50}:root[data-theme=light] .composer textarea{color:#00060e}:root[data-theme=light] .composer textarea::placeholder{color:#04070d}:root[data-theme=light] .composer .send{background:linear-gradient(140deg, #005860, #07d7f7);color:#c3eafb}:root[data-theme=light] .quick-actions button{border:1px solid #354e6445;background:linear-gradient(180deg, #c7d8e7c9, #d4e5f3e6)}:root[data-theme=light] .quick-actions button:hover{background:#a9cadec9}:root[data-theme=light] #place{background:#d7eaf999}:root[data-theme=light] .small-button{background:#9cd0e4;border:1px solid #5ea0ba}:root[data-theme=light] .map-modes button[aria-pressed='true']{border-color:#2a98a899;background:#92cee270;color:#005b64}:root[data-theme=light] .control-links button,:root[data-theme=light] .control-links a{color:#263947}:root[data-theme=light] .map-feature-detail .verify-actions button{background:#8be3f7;color:#000000}:root[data-theme=light] .map-feature-detail .verify-actions input{border:1px solid #446666}:root[data-theme=light] .create-map button{border:1px solid #3a5b7166;background:#c8dfecee;color:#001215}:root[data-theme=light] .create-map button.primary{border-color:#10a9bf;background:#91e1f3f2}:root[data-theme=light] .create-map small{color:#0a2128}:root[data-theme=light] .account-menu{background:#c8dfecf5;color:#0a151b;border:1px solid #3a5b714d}:root[data-theme=light] .account-menu a{background:#b8daeb;color:#001215}:root[data-theme=light] .account-menu a.primary{background:#91e1f3;border:1px solid #10a9bf}:root[data-theme=light] .account-menu button{background:#8be3f7;color:#000000}:root[data-theme=light] #map-notice{background:#c9daebea;border:1px solid #3a5b714d}:root[data-theme=light] .connection{color:#3d5263}:root[data-theme=light] .connection a{color:#007a94}:root[data-theme=light] .web-option{color:#364f62}:root[data-theme=light] .web-option input{accent-color:#14bddd}:root[data-theme=light] .message .label{color:#326a7b}:root[data-theme=light] .message-text.rich th,:root[data-theme=light] .message-text.rich td{border:1px solid #99b7c8}:root[data-theme=light] .message-text.rich a{color:#0b5763}:root[data-theme=light] .message.user{background:#a1c3d466}:root[data-theme=light] .message.error{color:#581d00}:root[data-theme=light] .sources a{color:#0b5763;border:1px solid #299aac4d}:root[data-theme=light] .recording{color:#610000 !important}:root[data-theme=light] .search-results{background:#d2e4f3}:root[data-theme=light] .pin{background:#25cfec;border:2px solid #004142}:root[data-theme=light] .maplibregl-popup-content{background:#c2d7e8 !important;color:#111}:root[data-theme=light] .maplibregl-popup-tip{border-top-color:#c2d7e8 !important}:root[data-theme=light] .maplibregl-ctrl-attrib{background:#d9e8f8c4 !important;color:#394a58 !important}:root[data-theme=light] .maplibregl-ctrl-attrib a{color:#394a58 !important}:root[data-theme=light] .maplibregl-ctrl-scale{background:#d9e8f8c4 !important;color:#394a58 !important;border-color:#394a58 !important}:root[data-theme=light] dialog{color:#000a12}:root[data-theme=light] dialog::backdrop{background:#f7f7f788}:root[data-theme=light] dialog p{color:#293d4c}@media (max-width: 700px){:root[data-theme=light] .world-shade{background:linear-gradient(180deg, #e2effb8c, transparent 30%, transparent 55%, #e2effbdd 90%)}}:root[data-theme=light] .ai-meta{color:#22837f}:root[data-theme=light] .ai-artifact a,:root[data-theme=light] .ai-file{color:#0d7a83}:root[data-theme=light] .ai-artifact button{color:#001d28;background:#b7d7e6;border:1px solid #92b2bc}:root[data-theme=light] .message small{color:#404f5a}:root[data-theme=light] .world-shade{background:linear-gradient(180deg, #e2effb60, transparent 25%, transparent 85%, #e2effb38)}:root[data-theme=light] #map-search > svg{color:#0d2532}:root[data-theme=light] #place::placeholder{color:#233442}:root[data-theme=light] #map-search .small-button{background:#b2d2e2;border-color:#819ea955}:root[data-theme=light] .chat-launcher{border:1px solid #0baab9bf;background:linear-gradient(120deg, #b4e2f0ee, #d2e7f6ee)}:root[data-theme=light] .chat-launcher:hover{background:#abd9e7}:root[data-theme=light] .chat-open .chat-launcher{border-color:#00373c;background:#95d1e7}:root[data-theme=light] .chat-panel{background:linear-gradient(125deg, #c1d6e5f5, #d2e6f6f7)}:root[data-theme=light] .layer-choices button{background:#cde6f6bb}:root[data-theme=light] .layer-choices button > span{color:#1a5258}:root[data-theme=light] .layer-choices small{color:#3d5262}:root[data-theme=light] .layer-choices button[aria-pressed='true']{border-color:#00a0b3;background:#a6d9e7bb}:root[data-theme=light] .layer-choices button:hover{background:#a3c9d9}@media (max-width: 700px){:root[data-theme=light] .world-shade{background:linear-gradient(180deg, #e2effb55, transparent 25%, transparent 90%, #e2effb33)}}:root[data-theme=light] .globe-mode{border:1px solid #28859d66;background:#acd5e8;color:#002027}:root[data-theme=light] .layer-hint{color:#324957}:root[data-theme=light] .layer-toggle small{color:#3a5160}:root[data-theme=light] .opacity-label{color:#2a444f}:root[data-theme=light] .layout-toggle{color:#122c34}:root[data-theme=light] .layout-editor p{color:#304554}:root[data-theme=light] .layout-editor select{background:#b9d7ea;color:#111}:root[data-theme=light] .layout-editor button{background:#b0d1e1}:root[data-theme=light] .layout-editor #layout-done{background:#91d2e7;color:#00262a}:root[data-theme=light] .layout-editor small{color:#365460}:root[data-theme=light] .layout-handle{border:1px solid #008694;background:#9ddef4;color:#111}:root[data-theme=light] .layout-editing #topbar,:root[data-theme=light] .layout-editing #search-shell,:root[data-theme=light] .layout-editing #map-rail,:root[data-theme=light] .layout-editing #chat-shell,:root[data-theme=light] .layout-editing #chat-panel,:root[data-theme=light] .layout-editing #layers-panel,:root[data-theme=light] .layout-editing #controls{outline:1px dashed #1a909c}:root[data-theme=light] .layout-editing #layers-control{outline:1px dashed #1a909c}:root[data-theme=light] .layout-resize:after{border:2px solid #00272a;background:#1bd8ef}:root[data-theme=light] .search-results [aria-selected='true'],:root[data-theme=light] .search-results button:hover{background:#9ec9dc}:root[data-theme=light] .search-results button{color:#000f19}:root[data-theme=light] .layout-dimensions input{background:#c2dff2}:root[data-theme=light] .layout-mini button{background:#acd7e9;border:1px solid #719da8;color:#001a1f}:root[data-theme=light] #search-close{color:#142e3a}:root[data-theme=light] #chat-alert{background:#d5cebf;color:#3a2b00}:root[data-theme=light] #chat-alert a{background:#80d2ea;color:#111}:root[data-theme=light] .vision-controls{color:#223a45}:root[data-theme=light] .vision-controls input{accent-color:#07a3b6}:root[data-theme=light] .vision-controls button{border:1px solid #89aab8;background:#bfdded;color:#001a20}:root[data-theme=light] .vision-controls button[aria-pressed='true']{border-color:#16aaaf;color:#16aaaf}:root[data-theme=light] .vision-controls small{color:#45606d}:root[data-theme=light] #vision-preview{background:#cce3f1;color:#111;border:1px solid #7fa9bd}:root[data-theme=light] #vision-preview button{background:#a1d2e6}:root[data-theme=light] #language-panel{border:1px solid #81a6b9;background:#cce3f1;color:#051318}:root[data-theme=light] #language-panel::backdrop{background:#f7f7f788}:root[data-theme=light] #language-search{border:1px solid #87abba;background:#b8d7e7;color:#111}:root[data-theme=light] #language-list button{background:#bdd9e9;color:#0a1c23}:root[data-theme=light] #language-list button[aria-pressed='true']{border-color:#00a0b3}:root[data-theme=light] #language-panel small{color:#415f6e}:root[data-theme=light] #language-status{color:#0c6b74}:root[data-theme=light] .layers-heading #layers-close{color:#001820}@media (max-width: 700px){:root[data-theme=light] #layers-grip span{background:#587888}}:root[data-theme=light] #chat-grip span{background:#587888}:root[data-theme=light] .message.processing .label::after{background:#00a0b3}:root[data-theme=light] #language-toast{border:1px solid #799fb0;background:#bcdbed;color:#001920}:root[data-theme=light] .layers-heading{background:#c6ddec}:root[data-theme=light] [data-ui-panel] :focus-visible{outline:2px solid #00808f}:root[data-theme=light] .library-panel{color:var(--text, #0a151b);background:#c8dfecf5}:root[data-theme=light] .library-panel .layers-heading{background:#c8dfec}:root[data-theme=light] .library-panel small{color:#3a5563}:root[data-theme=light] .library-panel button,:root[data-theme=light] .library-panel select{border:1px solid #99b7c8;background:#b6d5e4;color:#0d1c23}:root[data-theme=light] .library-tabs button[aria-pressed='true']{border-color:#0ca8bc;background:#95c8dd}:root[data-theme=light] .library-body input:not([type='checkbox']):not([type='radio']):not([type='range']),:root[data-theme=light] .library-body textarea{border:1px solid #8facb8;background:#cfe6f4;color:#081519}:root[data-theme=light] .library-card,:root[data-theme=light] .library-review,:root[data-theme=light] .library-confirm{border:1px solid #99b7c8}:root[data-theme=light] .library-confirm{border-color:#16a1ae}:root[data-theme=light] .library-status{color:#0d6b75}:root[data-theme=light] .saved-overlay-row{border-top:1px solid #99b7c8}:root[data-theme=light] .saved-overlay-row input[type='range']{accent-color:#0aa1b2}:root[data-theme=light] .saved-overlay-row input[type='checkbox']{accent-color:#0aa1b2}:root[data-theme=light] .map-feature-detail{color:#c6dde8}:root[data-theme=light] .library-panel button:focus-visible{outline:2px solid #0093a8}@media (max-width: 700px){:root[data-theme=light] .library-panel .library-grip{color:#426978}}:root[data-theme=light] .library-body :focus-visible{outline:2px solid #0093a8}:root[data-theme=light] .library-body a{color:#0c7886}:root[data-theme=light] input[type='range']::-webkit-slider-runnable-track{background:#88adbb}:root[data-theme=light] input[type='range']::-moz-range-track{background:#88adbb}:root[data-theme=light] input[type='range']::-webkit-slider-thumb{border:2px solid #003337;background:#10adbd}:root[data-theme=light] input[type='range']::-moz-range-thumb{border:2px solid #003337;background:#10adbd}:root[data-theme=light] input[type='range']:active::-webkit-slider-thumb{background:#00494e;border-color:#111}:root[data-theme=light] input[type='range']:active::-moz-range-thumb{background:#00494e;border-color:#111}:root[data-theme=light] .location-detail{color:#c6dde8}:root[data-theme=light] .location-detail button{background:#8be3f7;color:#111}:root[data-theme=light] .maplibregl-popup-close-button{color:#c6dde8}:root[data-theme=light] .place-photo{background:#f7f7f722}:root[data-theme=light] .feature-entry{border-top:1px solid #34454a}:root[data-theme=light] .layer-swatch{border:1px solid #00000088}:root[data-theme=light] .maplibregl-marker[role='button']:focus-visible{outline:3px solid #111}:root[data-theme=light] .location-detail,:root[data-theme=light] .map-feature-detail{color:#041219}:root[data-theme=light] .location-detail small{color:#2b4450}:root[data-theme=light] .maplibregl-popup-close-button{color:#041219}:root[data-theme=light] .maplibregl-popup-content{background:#c3deec;color:#041219;border:1px solid #7b9cab}:root[data-theme=light] .feature-entry{border-color:#8ea8b5}:root[data-theme=light] .layer-time{border-top:1px solid #94b3c1}:root[data-theme=light] .layer-time input{border:1px solid #7c9baa;background:#c3deec;color:#000b11}:root[data-theme=light] .layer-time button,:root[data-theme=light] .layer-order button{border:1px solid #7c9baa;background:#afd5e5}:root[data-theme=light] .layer-browser > input{background:#c8e2f2;color:#05141a}:root[data-theme=light] .layer-browser > p{color:#324957}:root[data-theme=light] .layer-controls{color:#324957}:root[data-theme=light] .layer-browser-group > p{color:#324957}:root[data-theme=light] .layer-browser-group > summary{color:#0b2027}:root[data-theme=light] .layer-browser-row{border-top:1px solid #0000000c}:root[data-theme=light] .layer-browser-row button,:root[data-theme=light] .layer-browser .library-actions button{background:#b5dbeb;color:#05141a}:root[data-theme=light] .ai-speech button{background:#acd5e8;color:#002027}:root[data-theme=light] .ai-speech small{color:#3a5160}:root[data-theme=light] .voice-control{border:1px solid #98b8c9}:root[data-theme=light] .voice-control button{background:#a1d4e7;color:#001118;border:1px solid #43aec4}:root[data-theme=light] .voice-control p{color:#334a55}:root[data-theme=light] .entry-row > button{background:#b5dbeb;color:#05141a}:root[data-theme=light] .layer-browser .entry-row > input{background:#c8e2f2;color:#05141a}:root[data-theme=light] button:focus-visible,:root[data-theme=light] a:focus-visible,:root[data-theme=light] input:focus-visible,:root[data-theme=light] textarea:focus-visible,:root[data-theme=light] select:focus-visible,:root[data-theme=light] summary:focus-visible{outline:2px solid #00a0b3}:root[data-theme=light] button.is-busy::after{border:2px solid #00a0b3}:root[data-theme=light] .empty-state,:root[data-theme=light] .error-state{border:1px dashed #2b485855}:root[data-theme=light] .error-state::before{color:#a35700}:root[data-theme=light] .library-panel.is-loading .layers-heading{background-image:linear-gradient(90deg, transparent, #00a0b355, transparent)}:root[data-theme=light] .confirm-dialog{border:1px solid #00a0b388;background:#cee3f0;color:#000a12}:root[data-theme=light] .confirm-dialog::backdrop{background:#f7f7f7aa}:root[data-theme=light] .confirm-actions .danger{border-color:#b4221a;background:#e3a29f;color:#000000}:root[data-theme=light] .needs-check{color:#a35700}:root[data-theme=light] .open-now{color:#2ca05a}