:root{
  --bg:#0f172a;
  --panel:#ffffff;
  --ink:#1e293b;
  --muted:#64748b;
  --line:#e2e8f0;
  --brand:#c8102e;
  --brand-dark:#9e0c24;
  --medical:#dc2626;
  --mental:#7c3aed;
  --sports:#16a34a;
  --dining:#ea8a00;
  --rest:#0ea5e9;
  --service:#2563eb;
  --route:#14b8a6;
  --shadow:0 10px 30px rgba(15,23,42,.12);
  --radius:16px;
}
*{box-sizing:border-box}
html,body{margin:0;height:100%;font-family:"Inter","PingFang SC","Microsoft YaHei",system-ui,-apple-system,sans-serif;color:var(--ink);background:var(--bg)}
#app{display:flex;height:100%;overflow:hidden}

/* Sidebar */
#sidebar{
  position:relative;z-index:1200;width:396px;min-width:396px;height:100%;min-height:0;overflow-y:auto;overscroll-behavior:contain;scrollbar-gutter:stable;scrollbar-width:thin;scrollbar-color:#cbd5e1 transparent;
  background:var(--panel);display:flex;flex-direction:column;box-shadow:var(--shadow);
  transition:margin-left .28s ease;
}
#sidebar.collapsed{margin-left:-396px}
.brand{display:flex;align-items:center;gap:12px;padding:18px 18px 14px}
.brand-mark{
  width:46px;height:46px;border-radius:13px;display:grid;place-items:center;
  background:linear-gradient(135deg,var(--brand),#f04a63);color:#fff;font-weight:800;font-size:24px;
  box-shadow:0 6px 16px rgba(200,16,46,.35)
}
.brand-text h1{margin:0;font-size:17px;letter-spacing:.2px}
.brand-text p{margin:2px 0 0;font-size:12px;color:var(--muted)}
#sidebarClose{margin-left:auto}

.icon-btn{
  border:1px solid var(--line);background:#fff;border-radius:10px;width:34px;height:34px;
  cursor:pointer;color:var(--muted);font-size:16px;display:grid;place-items:center;transition:.15s;
}
.icon-btn:hover{background:#f1f5f9;color:var(--ink)}

.search-box{position:relative;padding:0 18px 12px}
.search-box input{
  width:100%;padding:11px 36px 11px 14px;border:1px solid var(--line);border-radius:12px;font-size:14px;outline:none;background:#f8fafc;
}
.search-box input:focus{border-color:var(--brand);background:#fff;box-shadow:0 0 0 3px rgba(200,16,46,.08)}
#clearSearch{position:absolute;right:24px;top:7px;border:none;background:none}

.stats{padding:2px 18px 12px;font-size:12px;color:var(--muted)}

.filters{display:flex;flex-wrap:wrap;gap:8px;padding:0 18px 14px}
.filter{
  display:inline-flex;align-items:center;gap:6px;padding:7px 11px;border-radius:999px;
  border:1px solid var(--line);background:#fff;font-size:12.5px;cursor:pointer;transition:.15s;
}
.filter:hover{border-color:#cbd5e1}
.filter.active{color:#fff;border-color:transparent;box-shadow:0 4px 10px rgba(0,0,0,.12)}
.filter .dot{width:9px;height:9px;border-radius:50%;background:var(--c)}

.routes-head{padding:2px 18px 8px}
.routes-head h2{margin:0;font-size:14px;display:flex;justify-content:space-between;align-items:baseline}
.routes-head span{font-size:11px;color:var(--muted);font-weight:400}

#routes{padding:0 18px 10px;display:flex;flex-direction:column;gap:8px}
.route-chip{
  display:flex;align-items:center;gap:10px;padding:10px 12px;border:1px solid var(--line);border-radius:12px;background:#fff;
  cursor:pointer;transition:.15s;text-align:left;
}
.route-chip:hover{border-color:var(--route);background:#f0fdfa}
.route-chip.active{border-color:var(--route);background:#ecfeff;box-shadow:0 4px 10px rgba(20,184,166,.12)}
.route-chip .swatch{width:12px;height:12px;border-radius:4px;background:var(--route);flex:none}
.route-chip .r-name{font-size:13px;font-weight:600}
.route-chip .r-meta{font-size:11px;color:var(--muted);margin-top:2px}

.poi-list{flex:0 0 auto;min-height:auto;overflow:visible;padding:6px 18px 18px;display:flex;flex-direction:column;gap:10px}
#sidebar::-webkit-scrollbar{width:10px}
#sidebar::-webkit-scrollbar-track{background:transparent}
#sidebar::-webkit-scrollbar-thumb{background:#cbd5e1;border:2px solid #fff;border-radius:999px}
#sidebar::-webkit-scrollbar-thumb:hover{background:#94a3b8}

.poi-card{
  border:1px solid var(--line);border-radius:14px;padding:12px 13px;background:#fff;cursor:pointer;transition:.15s;
  position:relative;overflow:hidden;
}
.poi-card:hover{border-color:#cbd5e1;box-shadow:0 6px 16px rgba(15,23,42,.08)}
.poi-card.active{border-color:var(--c);box-shadow:0 0 0 1px var(--c)}
.poi-card::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--c)}
.poi-card .top{display:flex;align-items:center;gap:8px}
.poi-card .ic{
  width:30px;height:30px;border-radius:9px;display:grid;place-items:center;color:#fff;font-size:15px;flex:none;background:var(--c);
}
.poi-card h3{margin:0;font-size:14px;line-height:1.25}
.poi-card .cat{font-size:11px;color:var(--c);font-weight:600}
.poi-card p{margin:6px 0 0;font-size:12px;color:var(--muted);line-height:1.5}
.poi-card .meta{margin-top:7px;display:flex;flex-wrap:wrap;gap:6px}
.poi-card .tag{font-size:11px;background:#f1f5f9;border-radius:6px;padding:3px 7px;color:#475569}
.poi-card .tag.hours{background:#fef3c7;color:#92400e}
.poi-card .tag.approx{background:#fee2e2;color:#991b1b}

.sidebar-foot{padding:12px 18px;border-top:1px solid var(--line);font-size:10.5px;color:#94a3b8;line-height:1.5}
.sidebar-foot p{margin:3px 0}

/* Map */
#mapContainer{position:relative;flex:1;height:100%}
#map{position:absolute;inset:0;background:#e8eef4}
.sidebar-open{position:absolute;z-index:1100;top:14px;left:14px}
#mapContainer .sidebar-open{display:none}
#sidebar.collapsed ~ main .sidebar-open{display:grid}

.map-hud{
  position:absolute;z-index:1100;left:50%;bottom:18px;transform:translateX(-50%);
  background:rgba(255,255,255,.92);border-radius:999px;padding:8px 14px;box-shadow:var(--shadow);
  display:flex;align-items:center;gap:8px;font-size:12px;color:#334155;pointer-events:none;
}
.hud-dot{width:8px;height:8px;border-radius:50%;background:var(--route);animation:pulse 1.6s infinite}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(20,184,166,.5)}70%{box-shadow:0 0 0 9px rgba(20,184,166,0)}100%{box-shadow:0 0 0 0 rgba(20,184,166,0)}}

/* Leaflet popup */
.leaflet-popup-content-wrapper{border-radius:14px;box-shadow:var(--shadow)}
.leaflet-popup-content{margin:14px 16px;font-family:inherit}
.pop-head{display:flex;align-items:center;gap:8px;margin-bottom:6px}
.pop-ic{width:26px;height:26px;border-radius:8px;color:#fff;display:grid;place-items:center;font-size:13px}
.pop-title{font-weight:700;font-size:14px}
.pop-cat{font-size:11px;color:var(--muted)}
.pop-desc{font-size:12px;color:#475569;line-height:1.5;margin:4px 0 6px}
.pop-meta{display:flex;flex-wrap:wrap;gap:5px}
.pop-tag{font-size:11px;background:#f1f5f9;padding:3px 7px;border-radius:6px;color:#475569}
.pop-tag.hours{background:#fef3c7;color:#92400e}

/* Leaflet controls */
.leaflet-bar a{border-radius:10px!important}
.leaflet-control-zoom a{color:#334155}

/* route marker labels */
.route-label{
  background:rgba(20,184,166,.95);color:#fff;font-size:11px;padding:4px 8px;border-radius:8px;white-space:nowrap;
  box-shadow:0 4px 10px rgba(0,0,0,.2)
}

/* Nightlife route */
.nightlife-route{
  filter:drop-shadow(0 0 5px rgba(168,85,247,.5));
  animation:nightRouteFlow 1.15s linear infinite;
}
@keyframes nightRouteFlow{
  to{stroke-dashoffset:-40}
}
.poi-marker.nightlife .pin{
  box-shadow:0 0 0 3px rgba(168,85,247,.24), 0 0 14px rgba(168,85,247,.62), 0 7px 15px rgba(15,23,42,.3);
}
.poi-marker.nightlife .pulse{
  background:#c084fc;
  animation:nightPulse 1.45s ease-out infinite;
}
@keyframes nightPulse{
  0%{transform:scale(.65);opacity:.55}
  72%{transform:scale(1.65);opacity:0}
  100%{transform:scale(1.65);opacity:0}
}

/* marker icon */
.poi-marker{position:relative;width:34px;height:34px}
.poi-marker .pin{
  width:34px;height:34px;border-radius:50% 50% 50% 4px;transform:rotate(-45deg);display:grid;place-items:center;
  box-shadow:0 6px 14px rgba(15,23,42,.3);border:2px solid #fff;
}
.poi-marker .pin .glyph{transform:rotate(45deg);color:#fff;font-size:15px}
.poi-marker .pulse{position:absolute;inset:-6px;border-radius:50%;background:var(--c);opacity:.25;animation:ring 2.4s infinite}
@keyframes ring{0%{transform:scale(.6);opacity:.4}80%{transform:scale(1.4);opacity:0}100%{opacity:0}}
.poi-marker.small{width:26px;height:26px}
.poi-marker.small .pin{width:26px;height:26px}
.poi-marker.small .pin .glyph{font-size:12px}


/* Interactive campus buildings */
.building-lift-layer,
.building-depth-layer{
  opacity:0 !important;
  pointer-events:none !important;
  transition:opacity .14s ease, translate .22s cubic-bezier(.2,.8,.2,1), scale .22s cubic-bezier(.2,.8,.2,1), filter .2s ease;
  will-change:translate, scale, opacity, filter;
}
.building-lift-layer.is-active{
  opacity:1 !important;
  translate:0 -6px;
  scale:1.014;
  filter:brightness(1.08) saturate(1.06) contrast(1.02) drop-shadow(0 8px 6px rgba(2,6,23,.34));
  animation:
    buildingLiftIn .22s cubic-bezier(.2,.8,.2,1) both;
}
.building-depth-layer.is-active{
  opacity:.42 !important;
  translate:0 5px;
  scale:1.014;
  filter:brightness(.48) saturate(.6) blur(.25px) drop-shadow(0 4px 3px rgba(2,6,23,.22));
  animation:
    buildingDepthIn .22s cubic-bezier(.2,.8,.2,1) both;
}
@keyframes buildingLiftIn{
  from{translate:0 0;scale:1;opacity:0}
  to{translate:0 -6px;scale:1.014;opacity:1}
}
@keyframes buildingDepthIn{
  from{translate:0 0;scale:1;opacity:0}
  to{translate:0 5px;scale:1.014;opacity:.42}
}
.building-hit{
  cursor:pointer;
  transition:filter .18s ease, opacity .18s ease;
  -webkit-tap-highlight-color:transparent;
}
.building-hit.building-active{
  mix-blend-mode:screen;
  filter:
    drop-shadow(0 0 2px rgba(255,244,171,.22))
    drop-shadow(0 0 5px rgba(255,224,82,.12))
    drop-shadow(0 5px 3px rgba(15,23,42,.24));
}
.leaflet-tooltip.building-name-tooltip{
  border:1px solid rgba(255,212,59,.75);
  border-radius:9px;
  background:rgba(9,24,35,.92);
  color:#fff;
  box-shadow:0 8px 22px rgba(2,6,23,.28);
  font-size:12px;
  font-weight:700;
  padding:5px 9px;
  pointer-events:none;
}
.leaflet-tooltip.building-name-tooltip::before{
  border-top-color:rgba(9,24,35,.92);
}
.poi-marker.building-linked .pin{
  transform:rotate(-45deg) scale(1.13);
  border-color:#ffe66b;
  box-shadow:0 0 0 4px rgba(255,212,59,.25), 0 8px 18px rgba(15,23,42,.36);
}
.poi-marker.building-linked .pulse{
  background:#ffd43b;
  opacity:.48;
}
.poi-card.building-linked{
  transform:translateX(4px);
  border-color:#f0c400;
  box-shadow:0 0 0 2px rgba(255,212,59,.28), 0 8px 20px rgba(15,23,42,.12);
}
.poi-card,.poi-marker .pin{
  transition:transform .16s ease, border-color .16s ease, box-shadow .16s ease, background .16s ease;
}
@media (prefers-reduced-motion: reduce){
  .building-lift-layer,.building-depth-layer{transition:opacity .1s ease}
  .building-lift-layer.is-active,.building-depth-layer.is-active{animation:none}
  .building-lift-layer.is-active{translate:0 0;scale:1;filter:brightness(1.05) saturate(1.05)}
  .building-depth-layer.is-active{translate:0 0;scale:1;opacity:.42 !important;filter:brightness(.55) saturate(.6)}
  .building-hit.building-active{filter:drop-shadow(0 0 6px rgba(255,224,82,.35))}
  .nightlife-route,.poi-marker.nightlife .pulse{animation:none}
  .poi-card,.poi-marker .pin{transition:none}
}

@media (max-width:820px){
  #sidebar{position:absolute;left:0;top:0;box-shadow:var(--shadow)}
  #sidebar.collapsed{margin-left:-396px}
}

/* Leaflet layers control icon (avoid missing images/layers.png) */
.leaflet-control-layers-toggle{
  background-image:none !important;
  width:32px !important; height:32px !important;
  border-radius:10px; display:grid; place-items:center;
  background-color:#fff !important; color:#334155; font-size:16px;
}
.leaflet-control-layers-toggle::before{content:"▤"}



/* Night survival mode */
body.night .campus-base-layer{ filter: brightness(.55) saturate(.72) contrast(1.12) hue-rotate(180deg); }
body.night #map{ background:#07111f; }
.night-toggle{ position:absolute; z-index:1100; top:14px; right:58px; width:38px; height:38px; background:#fff; }
.night-panel{
  display:none; position:absolute; z-index:1100; left:50%; bottom:62px; transform:translateX(-50%);
  align-items:center; gap:10px; padding:9px 14px; background:rgba(7,17,31,.92);
  border:1px solid rgba(148,163,184,.35); border-radius:999px;
  box-shadow:0 10px 30px rgba(2,6,23,.4); color:#cbd5e1; font-size:12px;
}
.night-panel.active{ display:flex; }
.night-panel input[type=range]{ width:160px; accent-color:#f59e0b; cursor:pointer; }
.night-panel .clock-label{ min-width:40px; text-align:center; font-weight:700; color:#fff; }
.night-panel .clock-end{ color:#94a3b8; white-space:nowrap; }
.night-meter{ margin-top:7px; display:flex; flex-direction:column; gap:3px; font-size:11px; color:#475569; }
.night-meter b{ font-weight:600; color:#334155; }
.poi-marker.closed .pin{ filter:grayscale(.9) brightness(.5); opacity:.55; }
.poi-marker.closed .pulse{ display:none; }
.poi-marker.closed{ pointer-events:none; }


.bgm-toggle{ position:absolute; z-index:1100; top:14px; right:102px; width:38px; height:38px; background:#fff; }
.bgm-toggle.on{ background:#0f172a; color:#fff; }


.persona-bar{ position:absolute; z-index:1100; top:14px; left:58px; display:flex; gap:6px; }
.persona-btn{
  display:inline-flex; align-items:center; gap:5px; padding:7px 10px; border:1px solid rgba(148,163,184,.45);
  border-radius:999px; background:rgba(255,255,255,.92); color:#334155; font-size:12px; cursor:pointer;
  box-shadow:0 6px 16px rgba(15,23,42,.12); transition:.15s;
}
.persona-btn:hover{ border-color:#14b8a6; background:#fff; }
.persona-btn.active{ background:#0f172a; color:#fff; border-color:#0f172a; }
.persona-ico{ font-size:14px; }
.proposal-toggle{ position:absolute; z-index:1100; top:14px; right:146px; width:38px; height:38px; background:#fff; }
.proposal-toggle.on{ background:#38bdf8; color:#fff; }
.persona-dim .pin{ filter:grayscale(.95) brightness(.72); opacity:.35; }
.persona-dim .pulse{ display:none; }
.impact-recovery .pin{ background:#14b8a6 !important; }
.impact-reward .pin{ background:#a855f7 !important; }
.impact-risk .pin{ background:#f97316 !important; }
.proposal-marker{
  width:26px; height:26px; border-radius:50%; background:#38bdf8; color:#fff;
  display:grid; place-items:center; font-size:18px; font-weight:800;
  border:2px solid rgba(255,255,255,.9); box-shadow:0 0 0 4px rgba(56,189,248,.25), 0 6px 14px rgba(2,6,23,.3);
}
body.night .persona-btn{ background:rgba(15,23,42,.88); color:#cbd5e1; border-color:rgba(148,163,184,.35); }
body.night .persona-btn.active{ background:#fff; color:#0f172a; border-color:#fff; }


/* Bilingual typography */
.zh{ font-size:.78em; color:var(--muted); font-weight:400; }
.filter .zh{ margin-left:3px; font-size:11px; }
.r-name .zh{ margin-left:4px; font-size:11px; font-weight:400; color:var(--muted); }
.poi-card .cat .zh, .pop-cat .zh{ font-size:10px; color:var(--muted); font-weight:400; }
.pop-sub.zh{ font-size:11px; color:var(--muted); margin-top:-1px; }
.pop-desc.zh{ font-size:11px; color:var(--muted); margin-top:2px; }
.poi-card p.zh{ font-size:.8em; color:var(--muted); margin-top:3px; line-height:1.4; }
.tag.zh{ font-size:10px; opacity:.8; }
.persona-btn .zh{ margin-left:4px; font-size:10px; opacity:.8; }
.brand-text p .zh{ display:block; font-size:.82em; margin-top:2px; }


/* Bilingual typography */
.zh{ font-size:.78em; color:var(--muted); font-weight:400; }
.filter .zh{ margin-left:3px; font-size:11px; }
.r-name .zh{ margin-left:4px; font-size:11px; font-weight:400; color:var(--muted); }
.poi-card .cat .zh, .pop-cat .zh{ font-size:10px; color:var(--muted); font-weight:400; }
.pop-sub.zh{ font-size:11px; color:var(--muted); margin-top:-1px; }
.pop-desc.zh{ font-size:11px; color:var(--muted); margin-top:2px; }
.poi-card p.zh{ font-size:.8em; color:var(--muted); margin-top:3px; line-height:1.4; }
.tag.zh{ font-size:10px; opacity:.8; }
.persona-btn .zh{ margin-left:4px; font-size:10px; opacity:.8; }
.brand-text p .zh{ display:block; font-size:.82em; margin-top:2px; }


/* Bilingual typography */
.zh{ font-size:.78em; color:var(--muted); font-weight:400; }
.filter .zh{ margin-left:3px; font-size:11px; }
.r-name .zh{ margin-left:4px; font-size:11px; font-weight:400; color:var(--muted); }
.poi-card .cat .zh, .pop-cat .zh{ font-size:10px; color:var(--muted); font-weight:400; }
.pop-sub.zh{ font-size:11px; color:var(--muted); margin-top:-1px; }
.pop-desc.zh{ font-size:11px; color:var(--muted); margin-top:2px; }
.poi-card p.zh{ font-size:.8em; color:var(--muted); margin-top:3px; line-height:1.4; }
.tag.zh{ font-size:10px; opacity:.8; }
.persona-btn .zh{ margin-left:4px; font-size:10px; opacity:.8; }
.brand-text p .zh{ display:block; font-size:.82em; margin-top:2px; }


/* Night light layer */
.night-light-glow{ filter: blur(10px) drop-shadow(0 0 18px rgba(255,214,102,.95)); animation: nightLightPulse 2.8s ease-in-out infinite; }
.night-light-core{ filter: blur(3px) drop-shadow(0 0 8px rgba(255,255,224,.95)); animation: nightLightPulse 2.8s ease-in-out infinite reverse; }
@keyframes nightLightPulse{ 0%,100%{ opacity:.38; } 50%{ opacity:.90; } }

/* Marker image badge and hover preview */
.poi-marker.has-image .pin::after{ content:"▣"; position:absolute; right:-5px; top:-5px; width:14px; height:14px; border-radius:50%; background:#fff; color:#0f172a; font-size:9px; display:grid; place-items:center; box-shadow:0 2px 6px rgba(2,6,23,.35); }
.poi-marker .pin{ position:relative; }
.leaflet-tooltip.marker-image-tooltip{ background:transparent; border:none; box-shadow:none; padding:0; }
.leaflet-tooltip.marker-image-tooltip::before{ display:none; }
.marker-image-tip{ width:190px; overflow:hidden; border-radius:12px; background:#0f172a; border:1px solid rgba(148,163,184,.4); box-shadow:0 14px 30px rgba(2,6,23,.42); }
.marker-image-tip img{ display:block; width:100%; height:116px; object-fit:cover; }
.marker-image-tip span{ display:block; padding:7px 9px; color:#fff; font-size:11px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }

/* Sidebar photo button and full-screen lightbox */
.card-photo-btn{ margin-top:8px; border:1px solid var(--line); border-radius:9px; background:#f8fafc; color:#334155; font-size:11px; padding:5px 9px; cursor:pointer; }
.card-photo-btn:hover{ border-color:#f59e0b; color:#92400e; background:#fffbeb; }
.image-lightbox{ position:fixed; inset:0; z-index:5000; display:none; align-items:center; justify-content:center; padding:24px; background:rgba(2,6,23,.82); backdrop-filter:blur(4px); }
.image-lightbox.open{ display:flex; }
.image-lightbox-dialog{ position:relative; max-width:min(92vw,920px); max-height:90vh; overflow:hidden; border-radius:18px; background:#0f172a; border:1px solid rgba(148,163,184,.35); box-shadow:0 24px 80px rgba(0,0,0,.55); }
.image-lightbox-dialog img{ display:block; max-width:100%; max-height:78vh; object-fit:contain; background:#020617; }
.image-lightbox-caption{ display:flex; align-items:baseline; justify-content:space-between; gap:12px; padding:12px 16px; color:#fff; font-size:13px; }
.image-lightbox-caption .zh{ color:#94a3b8; }
.image-lightbox-close{ position:absolute; right:10px; top:10px; z-index:1; width:34px; height:34px; border:0; border-radius:50%; background:rgba(15,23,42,.78); color:#fff; font-size:22px; line-height:1; cursor:pointer; }


/* Mouse marking tool */
.mark-toggle{ position:absolute; z-index:1100; top:14px; right:190px; width:38px; height:38px; background:#fff; }
.mark-panel{ position:absolute; z-index:1300; right:18px; top:64px; width:330px; max-height:calc(100% - 90px); overflow:auto; display:none; padding:14px; border-radius:16px; background:rgba(15,23,42,.97); border:1px solid rgba(148,163,184,.35); color:#e2e8f0; box-shadow:0 18px 50px rgba(2,6,23,.42); }
.mark-panel.open{ display:block; }
.mark-panel-head{ display:flex; align-items:center; justify-content:space-between; margin-bottom:8px; }
.mark-help{ margin:0 0 10px; color:#94a3b8; font-size:11px; line-height:1.5; }
.mark-form label{ display:flex; flex-direction:column; gap:4px; margin:8px 0; color:#cbd5e1; font-size:11px; }
.mark-form input, .mark-form select{ width:100%; padding:7px 8px; border-radius:8px; border:1px solid #334155; background:#020617; color:#fff; font-size:12px; }
.mark-light-fields{ display:none; grid-template-columns:1fr 1fr; gap:6px 10px; }
.mark-actions{ display:flex; gap:8px; margin-top:10px; }
.mark-panel button{ padding:7px 9px; border:1px solid #334155; border-radius:9px; background:#1e293b; color:#e2e8f0; font-size:11px; cursor:pointer; }
.mark-panel .mark-primary{ border:0; background:#f59e0b; color:#111827; font-weight:700; }
#mapContainer.marking #map{ cursor:crosshair; }
.custom-mark-pin{ width:34px; height:34px; border-radius:50% 50% 50% 4px; transform:rotate(-45deg); display:grid; place-items:center; background:#f59e0b; border:2px solid #fff; box-shadow:0 8px 18px rgba(2,6,23,.38); }
.custom-mark-pin span{ transform:rotate(45deg); font-size:15px; }

/* Tongji logo in brand */
.brand-mark{ background:#fff; border:1px solid #e2e8f0; box-shadow:0 4px 12px rgba(37,99,235,.12); padding:2px; overflow:hidden; }
.brand-mark img{ width:100%; height:100%; object-fit:contain; display:block; border-radius:50%; }


/* ===== UI theme: Mockup C day / Mockup A night ===== */
:root{
  --bg:#dceaf2;
  --panel:rgba(255,255,255,.94);
  --ink:#0f2f3a;
  --muted:#55717d;
  --line:#c8dce7;
  --brand:#0d9488;
  --brand-dark:#0f766e;
  --route:#0d9488;
  --shadow:0 18px 50px rgba(15,47,58,.13);
}
body{background:linear-gradient(180deg,#dceaf2,#eef8fb);}
#sidebar{background:rgba(255,255,255,.94);backdrop-filter:blur(18px);border-right:1px solid rgba(200,220,231,.9);}
.brand-text h1{font-size:18px;}
.brand-text p{color:#55717d;}
.icon-btn{background:rgba(255,255,255,.84);border-color:#c8dce7;color:#0f2f3a;box-shadow:0 4px 12px rgba(15,47,58,.08);}
.icon-btn:hover{background:#fff;color:#0d9488;}
.search-box input{background:rgba(255,255,255,.76);border-color:#c8dce7;color:#0f2f3a;}
.search-box input:focus{border-color:#0d9488;box-shadow:0 0 0 3px rgba(13,148,136,.12);}
.filter{background:rgba(255,255,255,.72);border-color:#c8dce7;color:#36535f;}
.filter:hover{border-color:#0d9488;background:#fff;}
.filter.active{background:#0f766e;color:#fff;box-shadow:0 6px 16px rgba(13,148,136,.22);}
.route-chip{background:rgba(255,255,255,.78);border-color:#c8dce7;}
.route-chip:hover{border-color:#0d9488;background:#fff;}
.route-chip.active{border-color:#0d9488;background:#f0fdfa;box-shadow:0 8px 18px rgba(13,148,136,.14);}
.poi-card{background:rgba(255,255,255,.82);border-color:#d5e5ec;box-shadow:0 8px 24px rgba(15,47,58,.06);}
.poi-card:hover{border-color:#0d9488;box-shadow:0 12px 28px rgba(15,47,58,.11);}
.poi-card .tag{background:#edf8fb;color:#36535f;}
.poi-card .tag.hours{background:#e0f2fe;color:#075985;}
.sidebar-foot{color:#55717d;}
.map-hud{background:rgba(255,255,255,.84);border:1px solid rgba(200,220,231,.8);backdrop-filter:blur(12px);color:#36535f;}
#mapContainer::after{content:"";position:absolute;inset:0;z-index:399;pointer-events:none;background:linear-gradient(180deg,rgba(223,246,252,.24),rgba(255,255,255,.06));}
.campus-base-layer{filter:brightness(1.06) saturate(.82) contrast(.94) sepia(.04);}
.night-panel{background:rgba(255,255,255,.88);border-color:#c8dce7;color:#36535f;box-shadow:0 12px 30px rgba(15,47,58,.14);}
.night-panel .clock-label{color:#0f2f3a;}
.night-panel input[type=range]{accent-color:#0d9488;}
.poi-marker .pin{border-radius:50%;transform:none;box-shadow:0 8px 18px rgba(15,47,58,.22);border:3px solid rgba(255,255,255,.95);}
.poi-marker .pin .glyph{transform:none;font-size:14px;}
body:not(.night) .poi-marker .pulse{opacity:.12;}

body.night{
  --bg:#07111f;
  --panel:#08101e;
  --ink:#f8fafc;
  --muted:#94a3b8;
  --line:#26374f;
  --brand:#5eead4;
  --brand-dark:#2dd4bf;
  --route:#5eead4;
  --shadow:0 20px 60px rgba(0,0,0,.35);
  background:#07111f;
}
body.night #sidebar{background:rgba(8,15,28,.95);border-right-color:#253449;}
body.night .brand-text p{color:#94a3b8;}
body.night .icon-btn{background:rgba(8,15,28,.86);border-color:#334155;color:#e2e8f0;}
body.night .icon-btn:hover{background:#111c30;color:#5eead4;}
body.night .search-box input{background:rgba(10,18,32,.86);border-color:#2b3d56;color:#f8fafc;}
body.night .filter{background:rgba(16,27,45,.82);border-color:#2b3d56;color:#cbd5e1;}
body.night .filter.active{background:#0f766e;color:#ecfeff;box-shadow:0 6px 16px rgba(45,212,191,.18);}
body.night .route-chip{background:rgba(13,22,38,.88);border-color:#26374f;}
body.night .route-chip:hover{background:#111c30;border-color:#5eead4;}
body.night .route-chip.active{background:#0b2530;border-color:#5eead4;box-shadow:0 8px 18px rgba(94,234,212,.12);}
body.night .poi-card{background:rgba(13,22,38,.92);border-color:#26374f;}
body.night .poi-card:hover{border-color:#5eead4;}
body.night .poi-card p{color:#94a3b8;}
body.night .poi-card .tag{background:#111c30;color:#cbd5e1;}
body.night .poi-card .tag.hours{background:#422006;color:#fde68a;}
body.night .sidebar-foot{color:#94a3b8;}
body.night .map-hud{background:rgba(8,15,28,.86);border-color:#334155;color:#cbd5e1;}
body.night #mapContainer::after{background:linear-gradient(180deg,rgba(3,16,38,.38),rgba(3,16,38,.18));}
body.night .campus-base-layer{filter:brightness(.40) saturate(.72) contrast(1.12) hue-rotate(180deg);}
body.night .night-panel{background:rgba(8,15,28,.92);border-color:#334155;color:#cbd5e1;}
body.night .night-panel .clock-label{color:#fff;}
body.night .night-panel input[type=range]{accent-color:#fbbf24;}
body.night .poi-marker .pin{border:3px solid rgba(255,255,255,.9);box-shadow:0 0 0 4px rgba(94,234,212,.18),0 0 18px rgba(94,234,212,.45),0 8px 18px rgba(0,0,0,.35);}
body.night .poi-marker.nightlife .pin{box-shadow:0 0 0 4px rgba(251,191,36,.2),0 0 20px rgba(251,191,36,.55),0 8px 18px rgba(0,0,0,.36);}
body.night .leaflet-control-zoom a,body.night .leaflet-control-attribution{background:rgba(8,15,28,.86);color:#cbd5e1;border-color:#334155;}