*{box-sizing:border-box}
:root{
  color-scheme:dark;
  --bg:#071016;
  --surface:#111c24;
  --surface-2:#1b2a35;
  --ink:#eef6f8;
  --muted:#a5b4bd;
  --line:#2a3b47;
  --accent:#52b8bd;
  --accent-2:#d65b78;
  --gold:#e2aa54;
  --radius:14px;
  --shadow:0 14px 38px rgba(0,0,0,.42);
  --soft-shadow:0 6px 24px rgba(0,0,0,.28);
  --panel:rgba(10,19,26,.9);
  --control-bg:#101923;
  --control-hover:#1c2a36;
  --button-bg:#1b2b37;
  --button-hover:#263846;
  --preset-bg:#172738;
  --preset-hover:#22384d;
  --preset-ink:#d8e8f1;
  --map-bg:#111a20;
  --building-stroke:#7e8c99;
  --building-fill:#a7b4c1;
  --shadow-fill:#010810;
  --tile-filter:brightness(.62) contrast(1.18) saturate(.75);
  --leaflet-control-bg:rgba(15,24,31,.94);
  --leaflet-control-ink:#eef6f8;
}
:root[data-theme="light"]{
  color-scheme:light;
  --bg:#f7f8f6;
  --surface:#ffffff;
  --surface-2:#eef2f1;
  --ink:#101418;
  --muted:#65707b;
  --line:#dfe4e4;
  --accent:#0f6f74;
  --accent-2:#b34a62;
  --gold:#b98645;
  --shadow:0 10px 30px rgba(0,0,0,.14);
  --soft-shadow:0 6px 24px rgba(16,20,24,.08);
  --panel:rgba(255,255,255,.94);
  --control-bg:#ffffff;
  --control-hover:#eef2f1;
  --button-bg:#eef2f1;
  --button-hover:#e1e7e7;
  --preset-bg:#eef3ff;
  --preset-hover:#dde8ff;
  --preset-ink:#0b2640;
  --map-bg:#e9ecef;
  --building-stroke:#3a4654;
  --building-fill:#9aa7b4;
  --shadow-fill:#05121f;
  --tile-filter:none;
  --leaflet-control-bg:#ffffff;
  --leaflet-control-ink:#101418;
}
html,body{margin:0;padding:0;height:100%;min-width:320px;background:var(--bg)}
body{
  background:var(--bg);
  color:var(--ink);
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  line-height:1.55;
}
button,input,textarea,select{font:inherit;color:inherit}
button{cursor:pointer}
img{display:block;max-width:100%}
.sm-shell{position:fixed;inset:0}
#map{position:absolute;inset:0;z-index:0;background:var(--map-bg)}
.sm-topbar{
  position:fixed;
  top:16px;
  left:16px;
  right:16px;
  z-index:1000;
  display:flex;
  align-items:center;
  gap:14px;
  padding:12px 16px;
  border-radius:var(--radius);
  background:var(--panel);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
  box-shadow:var(--shadow);
}
.sm-brand{display:grid;gap:2px}
.sm-brand .eyebrow{
  margin:0;
  color:var(--accent);
  font-size:.64rem;
  font-weight:850;
  letter-spacing:.16em;
  text-transform:uppercase;
}
.sm-brand h1{margin:0;font-size:1.1rem;font-weight:780;letter-spacing:0}
.sm-search{flex:1;display:flex;gap:8px;min-width:0}
.sm-search input{
  flex:1;
  min-width:0;
  border:1px solid var(--line);
  border-radius:12px;
  padding:10px 13px;
  background:var(--control-bg);
}
.sm-search input:focus-visible{outline:2px solid var(--accent);outline-offset:1px;border-color:transparent}
.sm-top-actions{display:flex;gap:8px;align-items:center}
.button{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:40px;
  border:0;
  border-radius:12px;
  padding:0 14px;
  background:var(--button-bg);
  color:var(--ink);
  font-weight:700;
  transition:background 140ms ease,transform 140ms ease,color 140ms ease;
}
.button:hover{background:var(--button-hover);transform:translateY(-1px)}
.button.primary{background:var(--accent);color:#fff}
.button.primary:hover{background:#0b5d61}
.button.secondary{background:var(--control-bg);border:1px solid var(--line);color:var(--ink)}
.button.secondary:hover{background:var(--control-hover)}
.theme-toggle{
  display:inline-flex;
  align-items:center;
  gap:8px;
  min-height:38px;
  border:1px solid var(--line);
  border-radius:999px;
  background:var(--surface);
  color:var(--ink);
  cursor:pointer;
  font-size:.84rem;
  font-weight:800;
  padding:0 12px 0 9px;
  transition:background 140ms ease,transform 140ms ease;
}
.theme-toggle:hover{background:var(--surface-2);transform:translateY(-1px)}
.theme-toggle-icon{
  position:relative;
  width:18px;
  height:18px;
  border-radius:50%;
  background:var(--gold);
  box-shadow:0 0 0 4px rgba(226,170,84,.18);
}
:root[data-theme="light"] .theme-toggle-icon{
  background:#f3c653;
  box-shadow:0 0 0 4px rgba(243,198,83,.2);
}
.sm-controls{
  position:fixed;
  top:96px;
  left:16px;
  z-index:1000;
  width:320px;
  max-height:calc(100vh - 116px);
  overflow:auto;
  padding:18px;
  display:grid;
  gap:14px;
  border-radius:var(--radius);
  background:var(--panel);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
  box-shadow:var(--shadow);
}
.sm-controls section{display:grid;gap:8px}
.sm-controls label{
  color:var(--muted);
  font-size:.78rem;
  font-weight:700;
  letter-spacing:.04em;
}
.sm-controls input[type="date"],
.sm-controls input[type="time"],
.sm-controls select{
  border:1px solid var(--line);
  border-radius:12px;
  padding:10px 12px;
  background:var(--control-bg);
}
.sm-controls input[type="date"]:focus-visible,
.sm-controls input[type="time"]:focus-visible,
.sm-controls select:focus-visible{outline:2px solid var(--accent);outline-offset:1px;border-color:transparent}
.sm-controls input[type="range"]{width:100%}
.sm-button-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}
.sm-button-grid button{
  min-height:38px;
  border:0;
  border-radius:10px;
  padding:0 10px;
  background:var(--preset-bg);
  color:var(--preset-ink);
  font-weight:700;
  transition:background 140ms ease,color 140ms ease,transform 140ms ease;
}
.sm-button-grid button:hover{background:var(--preset-hover);transform:translateY(-1px)}
.sm-button-grid button.is-active{background:var(--accent);color:#fff}
.sm-toggles{display:grid;gap:6px}
.sm-toggles label{
  display:flex;
  align-items:center;
  gap:10px;
  color:var(--ink);
  font-size:.9rem;
  font-weight:600;
  letter-spacing:0;
}
.sm-toggles input[type="checkbox"]{
  width:18px;
  height:18px;
  accent-color:var(--accent);
}
.sm-sun-dock{
  position:fixed;
  left:50%;
  bottom:16px;
  z-index:1000;
  width:min(420px, calc(100vw - 640px));
  max-width:420px;
  transform:translateX(-50%);
  padding:12px 14px;
  display:grid;
  gap:8px;
  border-radius:var(--radius);
  background:var(--panel);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
  box-shadow:var(--shadow);
  pointer-events:none;
}
.sm-sun-dock.is-hidden{display:none}
.sm-sun-track{
  position:relative;
  height:74px;
  overflow:hidden;
  border:1px solid var(--line);
  border-radius:12px;
  background:linear-gradient(180deg,rgba(82,184,189,.12),rgba(226,170,84,.07) 72%,rgba(214,91,120,.08));
}
.sm-sun-arc{
  position:absolute;
  left:8%;
  right:8%;
  top:18%;
  height:115%;
  border:1px solid rgba(226,170,84,.48);
  border-bottom:0;
  border-radius:50% 50% 0 0;
}
.sm-sun-horizon{
  position:absolute;
  left:10px;
  right:10px;
  top:76%;
  height:1px;
  background:var(--line);
}
.sm-sun-dock-readout{
  display:flex;
  justify-content:space-between;
  gap:12px;
  min-width:0;
  color:var(--ink);
  font-size:.82rem;
  font-weight:750;
}
.sm-sun-dock-label{
  flex:0 0 auto;
  color:var(--muted);
  font-size:.68rem;
  font-weight:850;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.sm-sun-dock-readout span:last-child{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.sm-legend{
  position:fixed;
  right:16px;
  bottom:16px;
  z-index:1000;
  display:grid;
  gap:4px;
  padding:12px 14px;
  border-radius:var(--radius);
  background:var(--panel);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
  box-shadow:var(--shadow);
  font-size:.85rem;
}
.sm-legend-row{display:flex;justify-content:space-between;gap:18px;min-width:200px}
.sm-legend-label{color:var(--muted);font-weight:700;letter-spacing:.04em;text-transform:uppercase;font-size:.7rem}
.sm-info-chip{
  position:fixed;
  top:96px;
  right:16px;
  z-index:1000;
  padding:9px 14px;
  border-radius:999px;
  background:var(--panel);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
  box-shadow:var(--shadow);
  font-weight:700;
  font-size:.88rem;
  max-width:280px;
}
.sm-info-chip.is-night{background:rgba(16,20,24,.88);color:#f3f5f4}
.sm-info-chip.is-night::before{
  content:"";
  display:inline-block;
  width:10px;
  height:10px;
  margin-right:8px;
  border-radius:50%;
  background:#9aa7c2;
  vertical-align:middle;
}
.sm-info-chip.is-day::before{
  content:"";
  display:inline-block;
  width:10px;
  height:10px;
  margin-right:8px;
  border-radius:50%;
  background:var(--gold);
  vertical-align:middle;
  box-shadow:0 0 8px rgba(185,134,69,.55);
}
.leaflet-container{font-family:inherit;background:var(--map-bg)}
.leaflet-tile{filter:var(--tile-filter)}
.leaflet-control-zoom a,
.leaflet-control-attribution{
  background:var(--leaflet-control-bg)!important;
  color:var(--leaflet-control-ink)!important;
  border-color:var(--line)!important;
}
.leaflet-control-attribution a{color:var(--accent)!important}
.leaflet-popup-content-wrapper,
.leaflet-popup-tip,
.leaflet-tooltip{
  background:var(--surface);
  color:var(--ink);
  border-color:var(--line);
  box-shadow:var(--soft-shadow);
}
.sm-sun-marker,
.sm-sun-ui-marker{
  width:32px;
  height:32px;
  border-radius:50%;
  background:radial-gradient(circle at 50% 50%,#fff 0 22%,#ffd980 32%,#e8a833 65%,#9c5a0e 100%);
  box-shadow:0 0 0 2px #1a1a1a,0 0 0 4px rgba(255,255,255,.85),0 0 24px rgba(232,168,51,.85);
  transform:translate(-50%,-50%);
}
.sm-sun-ui-marker{
  position:absolute;
  left:var(--sun-x,50%);
  top:var(--sun-y,76%);
  transition:left 180ms ease,top 180ms ease,opacity 180ms ease,filter 180ms ease;
}
.sm-sun-dock.is-night .sm-sun-ui-marker{
  opacity:.48;
  filter:saturate(.55) brightness(.82);
}
:root[data-theme="light"] .sm-sun-marker,
:root[data-theme="light"] .sm-sun-ui-marker{
  box-shadow:0 0 0 2px #1a1a1a,0 0 0 4px rgba(255,255,255,.95),0 0 18px rgba(255,140,40,.6);
}
@media (max-width:980px){
  .sm-topbar{flex-wrap:wrap;gap:10px}
  .sm-search{order:3;flex-basis:100%}
  .sm-controls{
    top:auto;
    bottom:136px;
    left:12px;
    right:12px;
    width:auto;
    max-height:44vh;
    padding:14px;
  }
  .sm-sun-dock{
    left:12px;
    right:12px;
    bottom:12px;
    max-width:none;
    width:auto;
    transform:none;
  }
  .sm-info-chip{top:auto;right:12px;bottom:calc(44vh + 150px);max-width:calc(100% - 24px)}
  .sm-legend{display:none}
}
@media (max-width:520px){
  .sm-topbar{padding:10px 12px}
  .sm-brand h1{font-size:.98rem}
  .theme-toggle{min-width:38px;padding:0 9px}
  .theme-toggle-text{display:none}
  .sm-sun-dock{padding:10px 12px}
  .sm-sun-track{height:62px}
  .sm-sun-dock-readout{font-size:.76rem}
  .sm-button-grid button{min-height:36px;font-size:.88rem}
}