/* KML 3D viewer (kmlviewer.html) */
html, body { height: 100%; margin: 0; }
body {
  display: flex; flex-direction: column;
  background: #F0FFFB; color: #333;
  font: 14px/1.5 Tahoma, Arial, Helvetica, "Hiragino Sans", "Yu Gothic", sans-serif;
}
.kv-header {
  display: flex; flex-wrap: wrap; align-items: center; gap: 8px 16px;
  padding: 8px 16px; background: #007A7A; color: #fff;
}
.kv-header h1 { margin: 0; font: bold 16px/1.3 Georgia, "Times New Roman", serif; }
.kv-header a { color: #fff; }
.kv-tabs { display: flex; flex-wrap: wrap; gap: 6px; }
.kv-tabs button {
  border: 1px solid #fff; background: transparent; color: #fff;
  border-radius: 4px; padding: 4px 10px; font: inherit; cursor: pointer;
}
.kv-tabs button[aria-pressed="true"] { background: #fff; color: #007A7A; font-weight: bold; }
.kv-tabs button:focus-visible { outline: 2px solid #ffeb3b; outline-offset: 2px; }
.kv-main { position: relative; flex: 1; min-height: 360px; }
#cesium { position: absolute; inset: 0; }
.kv-panel {
  position: absolute; left: 10px; top: 10px; z-index: 2; max-width: min(320px, calc(100% - 20px));
  background: rgba(255, 255, 255, .92); border-radius: 6px; padding: 8px 12px;
  box-shadow: 0 1px 4px rgba(0, 0, 0, .3); font-size: 13px;
}
.kv-panel summary { cursor: pointer; list-style-position: inside; }
.kv-panel summary h2 { display: inline; margin: 0; font-size: 14px; }
.kv-panel[open] summary { margin-bottom: 4px; }
.kv-panel p { margin: 4px 0; }
.kv-legend { list-style: none; margin: 4px 0; padding: 0; }
.kv-legend li { display: flex; align-items: center; gap: 6px; }
.kv-legend i { display: inline-block; width: 14px; height: 14px; border: 1px solid #333; }
.kv-status { color: #007A7A; }
.kv-status.error { color: #b00020; }
.kv-footer { padding: 4px 16px; font-size: 12px; color: #555; }
.kv-footer a { color: #007A7A; }
@media (max-width: 600px) {
  .kv-header { padding: 6px 10px; }
  .kv-header h1 { font-size: 14px; }
  .kv-tabs button { padding: 3px 8px; font-size: 12px; }
  .kv-panel { font-size: 12px; padding: 6px 8px; max-width: calc(100% - 150px); box-sizing: border-box; }
}
.sw-red { background: #ff0000; } .sw-orange { background: #ff8000; } .sw-yellow { background: #ffff00; }
.sw-green { background: #00ff00; } .sw-blue { background: #0000ff; } .sw-black { background: #000; }
.sw-river { background: #0055ff; }
