.km-resource-city { margin:8px 8px 14px; border:1px solid var(--k-line); border-radius:8px; padding:12px; background:var(--k-bg); color:var(--k-ink); }
.km-resource-city header { margin:0 0 9px; font-size:14px; font-weight:650; }
.km-city-streets { display:grid; grid-template-columns:repeat(auto-fit,minmax(94px,1fr)); gap:5px; }
.km-city-streets button { min-width:0; display:grid; justify-items:center; border:1px solid transparent; border-radius:4px; padding:0 3px 4px; }
.km-city-streets button:is(:hover,:focus-visible) { border-color:currentColor; }
.km-city-streets svg { width:92px; max-width:100%; fill:none; stroke:currentColor; stroke-width:1.35; }
.km-city-streets .km-city-ground { opacity:.35; }
.km-city-rotate { display:flex; align-items:center; gap:10px; margin-bottom:7px; font-size:12px; }
.km-city-streets span { max-width:100%; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; font-size:11px; }
.km-city-enter { flex:none; padding:6px 11px; border:1px solid #a69ac373; border-radius:5px; background:#353044; color:#ede6f7; font:600 12px system-ui; }
.km-city-enter:hover { background:#49405c; }
#dialog.km-city-open { position:fixed!important; inset:0!important; width:100vw!important; max-width:none!important; height:100dvh!important; max-height:none!important; margin:0!important; padding:0!important; border:0!important; border-radius:0!important; overflow:hidden!important; background:#070b16!important; }
#dialog.km-city-open > :not(#km-city-interior) { display:none!important; }
#km-city-interior { position:absolute; inset:0; overflow:hidden; outline:none; background:#070b16; color:#e7e3ef; font:13px system-ui,sans-serif; --city-line:#9994b53d; }
#km-city-interior [hidden] { display:none!important; }
#km-city-interior canvas { position:absolute; inset:0; display:block; width:100%; height:100%; touch-action:none; cursor:grab; }
#km-city-interior canvas:active { cursor:grabbing; }
.km-city-vignette { position:absolute; inset:0; pointer-events:none; background:linear-gradient(#060a15a3,transparent 22% 75%,#060a15c9),linear-gradient(90deg,#070b1644,transparent 45%); }
.km-city-top { position:absolute; inset:30px 3% auto; display:flex; justify-content:space-between; align-items:flex-start; gap:20px; pointer-events:none; }
.km-city-top > div { border-left:1px solid #c4b5df; padding-left:18px; }
.km-city-top small { color:#b5a8cb; font-size:10px; letter-spacing:.17em; }
.km-city-top h2 { font-size:27px; font-weight:400; letter-spacing:.12em; margin:10px 0 6px; }
.km-city-top p { font-size:11px; color:#ada3be; margin:0; }
#km-city-interior button { border:1px solid #9a90af55; border-radius:4px; color:#dfd9eb; background:#111625e8; font:500 12px system-ui; padding:9px 12px; cursor:pointer; pointer-events:auto; }
#km-city-interior button:hover,#km-city-interior button.selected { border-color:#c4b2e1; background:#28243e; }
#km-city-interior :is(button,input):focus-visible { outline:2px solid #d8be8d; outline-offset:3px; }
.km-city-directory { position:absolute; top:160px; left:3%; width:224px; max-height:calc(100% - 285px); display:flex; flex-direction:column; padding:16px; border:1px solid var(--city-line); background:linear-gradient(135deg,#111626ee,#090e1ad9); border-radius:2px 12px 2px 12px; }
.km-city-directory header { display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom:14px; }
.km-city-directory header b { font-weight:500; letter-spacing:.08em; }
.km-city-directory header span { color:#a79ab8; font-size:10px; }
#km-city-interior input { width:100%; box-sizing:border-box; background:#070b16; border:1px solid #78718d66; border-radius:4px; padding:9px; color:#e3d8f0; font:12px system-ui; }
.km-city-directory nav { margin-top:12px; overflow:auto; scrollbar-width:thin; }
#km-city-interior .km-city-directory nav button { width:100%; display:block; text-align:left; margin-bottom:6px; border-color:transparent; background:#ffffff03; padding:9px; }
.km-city-directory nav b { display:block; font-size:12px; font-weight:500; line-height:1.5; }
.km-city-directory nav small { display:block; font-size:10px; color:#a195b1; margin-top:5px; }
.km-city-directory nav p { color:#a99bb8; font-size:12px; line-height:1.6; }
.km-city-crosshair { position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); font:200 22px system-ui; color:#ccc3dc66; pointer-events:none; }
.km-city-labels { position:absolute; inset:0; pointer-events:none; }
#km-city-interior .km-city-labels button { position:absolute; transform:translate(-50%,-100%); font-size:10px; max-width:180px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; padding:6px 9px; background:#101524d9; border:1px solid #b6a6d156; }
.km-city-inspector { position:absolute; right:3%; bottom:126px; width:280px; max-width:34%; padding:22px; background:linear-gradient(135deg,#17192bea,#0d1020ea); border:1px solid #a695c05c; border-top:2px solid #bda5d5; border-radius:2px 14px 2px 14px; }
.km-city-inspector small { color:#baaccc; font-size:10px; letter-spacing:.1em; }
.km-city-inspector h3 { margin:12px 0; font-size:20px; font-weight:400; overflow-wrap:anywhere; }
.km-city-inspector p { color:#b6aac6; font-size:12px; line-height:1.8; max-height:160px; overflow:auto; }
.km-city-inspector > div { display:flex; flex-wrap:wrap; gap:8px; margin-top:18px; }
.km-city-bottom { position:absolute; inset:auto 3% 24px; display:flex; align-items:center; justify-content:space-between; gap:20px; border-top:1px solid var(--city-line); padding-top:15px; }
.km-city-bottom > div { display:flex; gap:14px; align-items:center; }
.km-city-bottom b { font-size:11px; font-weight:500; color:#c4b7d5; }
.km-city-bottom span { color:#9f93b2; font:10px ui-monospace,monospace; }
.km-city-instructions { color:#9c91ad; font-size:10px; }
.km-city-pad { display:none; }
@media (any-pointer:coarse) {
  #km-city-interior button { min-height:44px; }
  .km-city-directory { top:150px; width:175px; max-height:40%; padding:12px; }
  .km-city-pad { position:absolute; left:4%; bottom:125px; display:grid; grid-template-columns:repeat(3,48px); grid-template-rows:repeat(2,48px); gap:5px; }
  .km-city-pad button:first-child { grid-column:2; }
  .km-city-pad button:nth-child(2) { grid-column:1; }
  #km-city-interior .km-city-pad button { touch-action:none; padding:8px; min-width:48px; }
  #km-city-interior .km-city-pad button.pressed { background:#443553; border-color:#cbb0e6; }
  .km-city-bottom { flex-wrap:wrap; gap:12px; bottom:18px; }
  .km-city-instructions { display:none!important; }
  .km-city-inspector { width:240px; padding:16px; }
}
@media (max-width:700px) {
  .km-city-top { top:18px; }
  .km-city-top h2 { font-size:21px; }
  .km-city-top small { font-size:8px; }
  .km-city-directory { width:145px; top:145px; padding:10px; }
  .km-city-inspector { max-width:40%; right:3%; bottom:145px; padding:12px; }
  .km-city-inspector h3 { font-size:16px; }
}
@media (max-height:650px) {
  .km-city-top { top:18px; }
  .km-city-top h2 { margin:6px 0; font-size:21px; }
  .km-city-directory { top:125px; max-height:calc(100% - 225px); }
  .km-city-inspector { bottom:100px; padding:14px; }
  .km-city-inspector p { max-height:70px; }
}
/* The optional studio is confined to the city, with no native explorer styles. */
#km-city-interior,#km-city-interior * { box-sizing:border-box; }
.km-city-studio { position:absolute; top:140px; bottom:100px; right:3%; width:320px; max-width:45%; padding:20px; overflow:auto; overscroll-behavior:contain; background:linear-gradient(135deg,#171b2af5,#0b1020fa); border:1px solid #aba0c85c; border-top:2px solid #c3b4df; border-radius:2px 12px 2px 12px; scrollbar-width:thin; }
.km-city-studio header { display:flex; justify-content:space-between; gap:12px; align-items:flex-start; }
.km-city-studio h3 { font:400 18px system-ui; margin:9px 0; overflow-wrap:anywhere; }
.km-city-studio small { color:#aba0bc; font-size:10px; line-height:1.7; }
.km-city-studio p { color:#c1b5d0; font-size:11px; line-height:1.7; }
.km-city-form-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:7px; margin:16px 0; }
#km-city-interior .km-city-form-grid button { min-width:0; text-align:left; padding:12px 9px; }
.km-city-form-grid b,.km-city-form-grid small { display:block; }
.km-city-form-grid b { font-size:12px; font-weight:500; margin-bottom:5px; }
.km-city-studio label { display:block; font-size:11px; margin:12px 0; color:#c6bcd4; }
.km-city-studio select { display:block; width:100%; min-width:0; color:#e9e1f3; border:1px solid #9185aa66; border-radius:4px; background:#0d1222; font:12px system-ui; padding:10px; margin-top:7px; }
#km-city-interior .km-city-file input { margin-top:8px; font-size:10px; }
.km-city-model-actions { display:flex; flex-wrap:wrap; gap:7px; margin-top:15px; }
#km-city-interior button:disabled { opacity:.35; cursor:default; }
@media (any-pointer:coarse) { .km-city-studio select { min-height:44px; } }
@media (max-height:650px) { .km-city-studio { top:115px; bottom:88px; padding:14px; } }
.km-city-form-grid svg { display:block; width:100%; height:55px; margin-bottom:7px; fill:#111625; stroke:#b6a7cf; stroke-width:.65; }
.km-city-form-grid .selected svg { stroke:#e2cda5; }
.km-city-studio header { position:sticky; top:-20px; padding:8px 0; z-index:1; background:#131827; }
@media (max-height:650px) { .km-city-studio header { top:-14px; } }
/* District colors always have text labels; native lists and panels keep their styles. */
.km-city-districts { display:grid;grid-template-columns:1fr 1fr;gap:5px;margin-bottom:12px; }
#km-city-interior .km-city-districts button { padding:8px 5px;text-align:left;border-left:2px solid var(--district);font-size:11px;min-height:36px; }
.km-city-directory { max-height:calc(100% - 285px); }
.km-city-venue { position:absolute;z-index:5;inset:145px 3% 100px auto;width:min(850px,72%);display:flex;flex-direction:column;padding:22px;border:1px solid #a5b0cd66;border-top:2px solid #c4afd7;border-radius:2px 14px 2px 14px;background:#0c1322f7;overflow:auto;overscroll-behavior:contain; }
.km-city-venue header { display:flex;justify-content:space-between;gap:14px;align-items:start; }
.km-city-venue h3 { margin:8px 0;font-size:24px;font-weight:400;letter-spacing:.1em; }
.km-city-venue small { color:#b7a4ca;font-size:10px;letter-spacing:.08em; }
.km-city-venue p { color:#aeb9cd;font-size:12px;line-height:1.8;margin:8px 0; }
.km-venue-actions { display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding:12px 0;border-bottom:1px solid #7788a433; }
.km-venue-actions label { font-size:11px;color:#adb9cc;max-width:100%; }
.km-venue-actions select { max-width:180px;min-height:36px;color:#e6e6f4;background:#131c2d;border:1px solid #7185a566;margin:4px 8px;padding:6px; }
#km-city-interior .km-venue-actions input { width:210px;max-width:100%;margin-left:5px;font-size:10px; }
.km-venue-layout { display:grid;grid-template-columns:180px minmax(0,1fr);gap:20px;min-height:140px;flex:1;overflow:hidden;margin-top:16px; }
.km-venue-list,.km-venue-view { min-width:0;overflow:auto;scrollbar-width:thin; }
#km-city-interior .km-venue-list button { display:block;width:100%;text-align:left;margin-bottom:6px;overflow-wrap:anywhere; }
.km-venue-view h4 { font-size:16px;font-weight:500;margin:5px 0 12px;overflow-wrap:anywhere; }
.km-venue-view img,.km-venue-view video { display:block;width:100%;max-height:340px;object-fit:contain;background:#040910;margin:12px 0; }
.km-venue-view pre { white-space:pre-wrap;overflow-wrap:anywhere;font:13px/1.9 system-ui;color:#d9deea; }
.km-venue-view table { border-collapse:collapse;font-size:12px; }.km-venue-view td { border:1px solid #6a7c9855;padding:8px; }
#km-city-interior .km-venue-view button { display:block;margin:8px 0;max-width:100%;text-align:left;overflow-wrap:anywhere; }
@media(max-width:1000px) { .km-city-venue { inset:130px 3% 115px;width:94%;padding:16px; }.km-venue-layout { grid-template-columns:150px minmax(0,1fr);gap:12px; }.km-city-directory { width:200px; }.km-city-directory nav { min-height:40px; } }
@media(max-height:650px) { .km-city-venue { top:105px;bottom:85px;padding:14px; }.km-city-venue h3 { font-size:20px; }.km-city-districts { gap:3px; }#km-city-interior .km-city-districts button { min-height:30px;padding:6px; }.km-venue-layout { min-height:100px; }.km-city-venue p { margin:4px 0; } }
@media(any-pointer:coarse) { #km-city-interior .km-city-districts button,#km-city-interior .km-city-venue button { min-height:44px; }.km-city-directory { max-height:calc(100% - 430px); } }
/* Night universe: floating light, open edges, restrained glass rather than framed cards. */
#km-city-interior { --city-line:#95c7ed22; }
.km-city-directory,.km-city-inspector,.km-city-studio,.km-city-venue { border:0;border-radius:0;background:linear-gradient(105deg,#081321f5 15%,#0b1525ed 80%,#0b152500);box-shadow:none;backdrop-filter:blur(18px); }
.km-city-directory::before,.km-city-inspector::before,.km-city-studio::before,.km-city-venue::before { content:'';position:absolute;left:0;right:14%;top:0;height:1px;background:linear-gradient(90deg,#a2d7f3bb,#c6b0ef66,transparent);box-shadow:0 0 12px #99cfff55;pointer-events:none; }
.km-city-top h2 { text-shadow:0 0 25px #7ebdff55; }
#km-city-interior button { border-color:transparent;background:#9ebada08;border-radius:6px;color:#c9d8e8;transition:background .18s,color .18s,box-shadow .18s; }
#km-city-interior button:hover,#km-city-interior button.selected { border-color:transparent;color:#edfaff;background:#8bc7ff13;box-shadow:inset 0 -1px #95cfff88,0 10px 20px -15px #8ccfff; }
#km-city-interior .km-city-districts button { border:0;box-shadow:inset 2px 0 var(--district);background:linear-gradient(90deg,#a6c2e110,transparent);min-width:0; }
#km-city-interior .km-city-labels button { border:0!important;background:linear-gradient(90deg,#081320cc,#08132066,transparent);text-shadow:0 0 8px #8bc9f477;box-shadow:inset 0 -1px #badbfa30;border-radius:0;padding:7px 12px; }
.km-city-venue { background:linear-gradient(105deg,#081321fa 15%,#0b1525f8 82%,#0b1525eb); }
.km-city-venue[data-venue=gallery]::before { background:linear-gradient(90deg,#98e5d9bb,transparent);box-shadow:0 0 15px #82d9c966; }
.km-city-venue[data-venue=cinema]::before { background:linear-gradient(90deg,#e5c58dbb,transparent);box-shadow:0 0 15px #e5c58d55; }
.km-city-studio header { background:#0a1423; }
.km-city-venue header>div,.km-city-top>div,.km-city-inspector { min-width:0; }
.km-city-venue h3,.km-city-venue small,.km-city-venue p,.km-city-directory b { overflow-wrap:anywhere; }
.km-venue-actions { flex:none;gap:10px; }.km-venue-actions label { min-width:0;display:flex;align-items:center;gap:5px;flex-wrap:wrap; }
.km-venue-actions select { margin:0;max-width:min(180px,100%); }.km-venue-actions input { margin-left:0!important; }
.km-venue-layout { min-height:0;grid-template-columns:minmax(120px,180px) minmax(0,1fr);overflow:hidden; }
.km-venue-list,.km-venue-view { min-height:0;overscroll-behavior:contain; }
.km-venue-view img,.km-venue-view video { max-height:min(340px,34dvh); }.km-venue-view table { table-layout:fixed;width:100%; }.km-venue-view td { overflow-wrap:anywhere; }
.km-city-venue>[data-venue-status] { flex:none;max-height:54px;overflow:auto; }
.km-city-venue header,.km-city-venue>[data-venue-note] { flex:none; }.km-city-venue header>button,.km-city-top>button { flex:none; }
.km-venue-open .km-city-labels,.km-venue-open .km-city-pad,.km-venue-open .km-city-inspector,.km-venue-open .km-city-studio { visibility:hidden;pointer-events:none; }
.km-city-directory { min-height:0; }.km-city-directory>header,.km-city-districts,.km-city-directory>input { flex:none; }.km-city-directory nav { min-height:0; }
.km-city-bottom { min-width:0; }.km-city-bottom>div { min-width:0; }.km-city-instructions { flex:1;justify-content:center; }
/* Only the additive night-city explorer opts in to a wrapping action bar. */
.km-city-enabled .km-x-bar { flex-wrap:wrap;height:auto;min-height:44px;gap:6px;padding:8px; }
.km-city-enabled .km-x-bar .km-x-crumb { flex:1 1 100%;min-width:0;overflow-wrap:anywhere; }
.km-city-enabled .km-x-main { min-width:0; }.km-city-enabled .km-x-bar button { max-width:100%;white-space:normal; }
@media(max-width:1100px){.km-city-instructions{display:none!important}.km-city-life-readout{display:none}.km-city-venue{left:250px;right:2%;width:auto}.km-city-directory{left:2%;width:210px}.km-city-studio{right:2%;max-width:48%}}
@media(max-width:850px){.km-city-venue{left:3%;right:3%;width:auto}.km-venue-open .km-city-directory{visibility:hidden;pointer-events:none}.km-city-top small{letter-spacing:.08em}.km-city-venue h3{font-size:22px}.km-venue-layout{grid-template-columns:minmax(110px,140px) minmax(0,1fr)}}
@media(max-height:650px){.km-city-directory{top:112px;bottom:100px;max-height:none;padding:10px}.km-city-districts{grid-template-columns:repeat(3,minmax(0,1fr));gap:4px}.km-city-directory header{margin-bottom:8px}.km-city-directory nav{margin-top:8px}.km-city-venue{top:100px;bottom:90px;padding:14px}.km-city-venue>[data-venue-note]{font-size:11px;line-height:1.5;max-height:34px;overflow:auto}.km-venue-actions{padding:8px 0;gap:6px}.km-venue-layout{margin-top:10px}.km-city-inspector{bottom:100px;max-height:calc(100% - 215px);overflow:auto}.km-city-studio{top:110px;bottom:95px}.km-city-pad{bottom:100px;left:calc(2% + 225px);grid-template-columns:repeat(3,44px);grid-template-rows:repeat(2,44px)}}
@media(max-width:700px){.km-city-directory{width:180px}.km-city-top{gap:10px;inset:15px 3% auto}.km-city-top h2{font-size:20px}.km-city-top small{font-size:7px}.km-city-top>button{max-width:42%;font-size:10px!important}.km-city-venue{top:100px;bottom:90px}.km-venue-layout{grid-template-columns:100px minmax(0,1fr);gap:8px}.km-venue-actions label{font-size:10px}.km-city-venue header small{font-size:8px}.km-city-inspector{max-width:none;width:calc(94% - 200px)}.km-city-studio{max-width:none;width:calc(94% - 200px)}.km-city-bottom{gap:10px}.km-city-bottom>div{gap:7px}.km-city-bottom b{display:none}.km-city-bottom button{padding:8px!important}.km-city-pad{left:calc(3% + 195px)}}
@media(any-pointer:coarse) and (min-height:651px){.km-city-directory{bottom:255px;max-height:none}.km-city-venue{bottom:110px}.km-city-pad{bottom:115px}.km-city-bottom{bottom:18px}}
@media(prefers-reduced-motion:reduce){#km-city-interior button{transition:none}}
@media(max-width:680px){.km-city-enabled .km-x{display:flex;flex-direction:column;overflow:auto;min-width:0}.km-city-enabled .km-x-tree{flex:none;max-height:85px;overflow:auto}.km-city-enabled .km-x-main{flex:none;min-height:280px;overflow:visible}.km-city-enabled .km-x-bar{flex:none}.km-city-enabled .km-x-body{min-height:100px}.km-city-enabled .km-x-detail{flex:none;max-height:180px;overflow:auto}}
@media(any-pointer:coarse) and (max-height:650px){.km-city-directory{bottom:210px;overflow:auto;overscroll-behavior:contain}.km-city-directory nav{flex:none;min-height:60px}.km-city-pad{left:2%;bottom:100px}.km-city-inspector{left:calc(2% + 200px);right:3%;width:auto;max-width:none}}
@media(any-pointer:coarse) and (max-height:650px){#km-city-interior .km-city-pad button{min-width:44px;max-width:44px;width:44px;min-height:44px}}

/* ===== 2026-11-04 · KMind night language (see handoff/设计规则_夜间与平面皮肤.md) =====
   The city interior is night-only. It now speaks the native night: graphite, glass layers without frames, KMind type,
   blue for what you can act on, cyan for what is live, a restrained hue per public venue (dot + entrance light), no amber. */
#km-city-interior { --city-line:rgba(var(--k-layer-rgb,150,180,230),.12); --city-glass:rgba(10,13,19,.74); --city-glass2:rgba(12,15,22,.9);
  --city-acc:var(--k-acc,#3B82FF); --city-acc-rgb:var(--k-acc-rgb,59,130,255); --city-live:var(--k-ok,#5CC8FF);
  background:#05070B; color:var(--k-ink,#F2F5F9); font:13px/1.5 "Inter Tight","Plex SC",-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei",sans-serif; }
#km-city-interior :is(button,input,select,textarea) { font-family:inherit; }
.km-city-vignette { background:radial-gradient(120% 90% at 50% 45%,transparent 55%,rgba(3,4,6,.72)),linear-gradient(rgba(3,4,6,.55),transparent 18% 80%,rgba(3,4,6,.7)); }
.km-city-top { inset:26px 3% auto; }
.km-city-top > div { border:0; padding-left:0; }
.km-city-top small { color:var(--k-mute,#8E98A8); }
.km-city-top h2 { font-size:24px; font-weight:600; letter-spacing:.02em; margin:4px 0 4px; text-shadow:0 0 28px rgba(var(--city-acc-rgb),.35); }
.km-city-top p { color:var(--k-mute,#8E98A8); font-size:12px; }
/* every control: a pill of light; the selected one glows */
#km-city-interior button { border:0; border-radius:999px; background:rgba(var(--k-layer-rgb,150,180,230),.09); color:var(--k-ink2,#C3CCD8);
  font-size:12.5px; font-weight:500; padding:8px 14px; box-shadow:none; }
#km-city-interior button:hover { background:rgba(var(--city-acc-rgb),.18); color:var(--k-ink,#F2F5F9); box-shadow:none; }
#km-city-interior button.selected { background:rgba(var(--city-acc-rgb),.22); color:var(--k-ink,#F2F5F9); box-shadow:0 0 20px -8px rgba(var(--city-acc-rgb),.95); }
#km-city-interior :is(button,input,select):focus-visible { outline:0; box-shadow:var(--k-focus,0 0 0 2px rgba(59,130,255,.25),0 0 16px rgba(59,130,255,.55)); }
#km-city-interior input { border:0; border-radius:10px; background:rgba(var(--k-layer-rgb,150,180,230),.075); color:var(--k-ink,#F2F5F9); padding:9px 12px; font-size:12.5px; }
#km-city-interior input::placeholder { color:var(--k-dim,#7A8494); }
/* panels: glass, rounded, no frame; the top light carries the venue's hue */
.km-city-directory,.km-city-inspector,.km-city-studio,.km-city-venue { border:0; border-radius:18px; background:var(--city-glass); backdrop-filter:blur(20px) saturate(1.15);
  -webkit-backdrop-filter:blur(20px) saturate(1.15); box-shadow:0 24px 70px -28px rgba(0,0,0,.8); }
.km-city-directory::before,.km-city-inspector::before,.km-city-studio::before,.km-city-venue::before { left:0; right:0; top:0; height:120px; border-radius:18px 18px 0 0; box-shadow:none;
  background:radial-gradient(70% 100% at 12% 0%,rgba(var(--city-acc-rgb),.12),transparent 70%); }
.km-city-venue { --venue:var(--city-acc); background:var(--city-glass2); }
.km-city-venue::before { background:radial-gradient(60% 100% at 10% 0%,color-mix(in srgb,var(--venue) 22%,transparent),transparent 72%); }
.km-city-venue[data-venue=library] { --venue:#7AA2FF; } .km-city-venue[data-venue=gallery] { --venue:#5CC8FF; } .km-city-venue[data-venue=cinema] { --venue:#A58BFF; }
.km-city-venue[data-venue=plaza] { --venue:#D9E4F5; } .km-city-venue[data-venue=hub] { --venue:#8C9BFF; } .km-city-venue[data-venue=launch] { --venue:#BCC9E2; }
.km-city-venue[data-venue]::before { box-shadow:none; }
.km-city-directory { padding:18px 16px; }
.km-city-directory header b { font-weight:600; letter-spacing:0; }
.km-city-directory header span { color:var(--k-mute,#8E98A8); font:11px var(--k-mono,monospace); }
#km-city-interior .km-city-districts button { box-shadow:none; background:rgba(var(--k-layer-rgb,150,180,230),.06); border-radius:10px; display:flex; align-items:center; gap:8px; padding:8px 10px; font-size:12px; }
#km-city-interior .km-city-districts button::before { content:''; flex:none; width:7px; height:7px; border-radius:50%; background:var(--district); box-shadow:0 0 10px var(--district); }
#km-city-interior .km-city-districts button:hover { background:rgba(var(--k-layer-rgb,150,180,230),.12); }
#km-city-interior .km-city-directory nav button { border-radius:12px; padding:9px 12px; background:transparent; }
#km-city-interior .km-city-directory nav button:hover { background:rgba(var(--k-layer-rgb,150,180,230),.07); }
#km-city-interior .km-city-directory nav button.selected { background:rgba(var(--city-acc-rgb),.14); box-shadow:inset 2px 0 0 var(--city-acc),inset 22px 0 26px -22px rgba(var(--city-acc-rgb),.8); }
.km-city-directory nav b { font-weight:500; color:var(--k-ink,#F2F5F9); }
.km-city-directory nav small,.km-city-directory nav p { color:var(--k-mute,#8E98A8); }
/* labels in the scene: small glass pills; a landmark carries its venue dot */
#km-city-interior .km-city-labels button { border-radius:999px!important; padding:4px 10px; font-size:11px; color:var(--k-ink2,#C3CCD8); text-shadow:none;
  background:rgba(6,8,12,.62)!important; backdrop-filter:blur(6px); box-shadow:inset 0 0 0 .5px rgba(var(--k-layer-rgb,150,180,230),.18)!important; }
#km-city-interior .km-city-labels button[data-city-landmark] { display:inline-flex; align-items:center; gap:6px; color:var(--k-ink,#F2F5F9); }
#km-city-interior .km-city-labels button[data-city-landmark]::before { content:''; width:6px; height:6px; border-radius:50%; background:var(--district,#9FB4D8); box-shadow:0 0 8px var(--district,#9FB4D8); }
#km-city-interior .km-city-labels button.selected { color:#fff; background:rgba(var(--city-acc-rgb),.45)!important; box-shadow:0 0 18px -4px rgba(var(--city-acc-rgb),.9)!important; }
.km-city-crosshair { color:rgba(var(--k-layer-rgb,150,180,230),.4); font-weight:200; }
.km-city-inspector { padding:20px 20px 18px; }
.km-city-inspector small { color:var(--k-mute,#8E98A8); letter-spacing:0; font-size:11px; }
.km-city-inspector h3 { font-size:20px; font-weight:600; margin:6px 0 8px; }
.km-city-inspector p { color:var(--k-ink2,#C3CCD8); }
.km-city-inspector p:empty { display:none; }
.km-city-inspector > div { gap:6px; margin-top:14px; }
#km-city-interior .km-city-inspector [data-city-visit] { background:var(--city-acc); color:#fff; }
.km-city-bottom { border:0; padding-top:0; }
.km-city-bottom b { color:var(--k-ink2,#C3CCD8); font-size:12px; }
.km-city-bottom span { color:var(--k-mute,#8E98A8); font:11px var(--k-mono,monospace); }
.km-city-instructions { color:var(--k-mute,#8E98A8); font-size:11px; display:flex; align-items:center; gap:6px; }
.km-city-instructions kbd { font:10px var(--k-mono,monospace); color:var(--k-ink2,#C3CCD8); background:rgba(var(--k-layer-rgb,150,180,230),.1); border-radius:6px; padding:3px 7px; margin-left:10px; }
.km-city-life-readout { color:var(--k-dim,#7A8494)!important; font-size:11px!important; border:0!important; background:none!important; letter-spacing:0!important; }
#km-city-interior .km-city-pad button { border-radius:16px; background:rgba(10,13,19,.66); backdrop-filter:blur(10px); font-size:16px; }
#km-city-interior .km-city-pad button.pressed { background:rgba(var(--city-acc-rgb),.35); box-shadow:0 0 18px -4px rgba(var(--city-acc-rgb),.9); }
/* studio */
.km-city-studio { padding:18px; }
.km-city-studio header { background:transparent; backdrop-filter:none; }
.km-city-studio h3 { font-weight:600;font-size:18px;line-height:1.35;font-family:inherit; }
.km-city-studio small,.km-city-studio label { color:var(--k-mute,#8E98A8); letter-spacing:0; }
#km-city-interior .km-city-form-grid button { border-radius:14px; background:rgba(var(--k-layer-rgb,150,180,230),.05); }
#km-city-interior .km-city-form-grid button:hover { background:rgba(var(--k-layer-rgb,150,180,230),.1); }
#km-city-interior .km-city-form-grid button[aria-pressed=true] { background:rgba(var(--city-acc-rgb),.16); box-shadow:0 0 0 1px rgba(var(--city-acc-rgb),.35),0 0 24px -10px rgba(var(--city-acc-rgb),.95); }
.km-city-form-grid svg { fill:rgba(5,7,11,.7); stroke:#9FB4D8; }
.km-city-form-grid [aria-pressed=true] svg { stroke:#DCE8FF; }
.km-city-form-grid b { color:var(--k-ink,#F2F5F9); }
.km-city-studio select { border:0; border-radius:10px; background:rgba(var(--k-layer-rgb,150,180,230),.075); color:var(--k-ink,#F2F5F9); }
#km-city-interior .km-city-file.kx-file { border-radius:999px; padding:8px 14px; background:rgba(var(--k-layer-rgb,150,180,230),.1); color:var(--k-ink2,#C3CCD8); margin:12px 0 6px; width:max-content; max-width:100%; }
#km-city-interior .km-city-file.kx-file:hover { background:rgba(var(--city-acc-rgb),.18); color:var(--k-ink,#F2F5F9); }
/* venues: a right-hand sheet, never two thirds of the screen */
.km-city-venue { width:min(720px,58%); padding:22px 24px; }
.km-city-venue small { color:color-mix(in srgb,var(--venue) 70%,#C3CCD8); letter-spacing:0; font-size:11px; }
.km-city-venue h3 { font-size:24px; font-weight:600; letter-spacing:.02em; margin:4px 0 2px; }
.km-city-venue p { color:var(--k-ink2,#C3CCD8); }
.km-city-venue>[data-venue-note]:empty,.km-city-venue>[data-venue-status]:empty { display:none; }
.km-venue-actions { border:0; padding:14px 0 4px; }
.km-venue-actions label { color:var(--k-mute,#8E98A8); font-size:12px; }
.km-venue-actions select { border:0; border-radius:10px; background:rgba(var(--k-layer-rgb,150,180,230),.075); color:var(--k-ink,#F2F5F9); min-height:34px; padding:6px 10px; }
#km-city-interior .km-venue-actions .kx-file { border-radius:999px; padding:8px 14px; background:rgba(var(--k-layer-rgb,150,180,230),.1); color:var(--k-ink2,#C3CCD8); }
#km-city-interior .km-venue-actions .kx-file:hover { background:rgba(var(--city-acc-rgb),.18); color:var(--k-ink,#F2F5F9); }
.km-venue-layout { gap:18px; margin-top:14px; }
#km-city-interior .km-venue-list button { border-radius:12px; background:rgba(var(--k-layer-rgb,150,180,230),.05); padding:10px 12px; }
#km-city-interior .km-venue-list button:hover { background:rgba(var(--k-layer-rgb,150,180,230),.1); }
#km-city-interior .km-venue-list button.selected,#km-city-interior .km-venue-list button[aria-current=true] { background:color-mix(in srgb,var(--venue) 16%,transparent); box-shadow:inset 2px 0 0 var(--venue); }
.km-venue-view { border-radius:14px; background:rgba(var(--k-layer-rgb,150,180,230),.035); padding:14px 16px; }
.km-venue-view > p:only-child { color:var(--k-dim,#7A8494); }
.km-venue-view h4 { font-weight:600; }
.km-venue-view img,.km-venue-view video { border-radius:12px; background:#030406; }
.km-venue-view pre { font-size:13px;line-height:1.85;font-family:inherit; color:var(--k-ink2,#C3CCD8); }
.km-venue-view td { border:0; border-bottom:1px solid rgba(var(--k-layer-rgb,150,180,230),.1); }
@media(max-width:1000px) { .km-city-venue { width:auto; } }
@media(any-pointer:coarse) { #km-city-interior button { min-height:44px; } }
.km-city-venue[data-venue]::before { box-shadow:none; background:radial-gradient(60% 100% at 10% 0%,color-mix(in srgb,var(--venue) 20%,transparent),transparent 72%); }
.km-city-venue { bottom:auto; max-height:calc(100% - 245px); }
.km-venue-layout { flex:0 1 auto; }
.km-venue-view:has(> p:only-child) { background:none; padding-top:10px; }
@media(max-height:650px) { .km-city-venue { max-height:calc(100% - 190px); } }
.km-city-crosshair,.km-city-studio select { font-family:inherit; }
#km-city-interior :is([data-venue-close],[data-city-design-close]) { width:34px; height:34px; min-height:0; padding:0; display:grid; place-items:center; font-size:15px; }
@media(any-pointer:coarse) { #km-city-interior :is([data-venue-close],[data-city-design-close]) { width:44px; height:44px; } }
/* short screens keep the directory list reachable: compact district pills and padding (as before the restyle) */
@media(max-height:650px) { .km-city-directory { padding:12px; } #km-city-interior .km-city-districts button { padding:5px 8px; min-height:28px; font-size:11px; border-radius:8px; } #km-city-interior .km-city-directory nav button { padding:7px 10px; } }
@media(max-height:650px) and (any-pointer:coarse) { #km-city-interior .km-city-districts button { min-height:44px; } }
@media(max-width:700px) { #km-city-interior .km-city-districts button { gap:0; padding:6px 5px 6px 8px; font-size:11px; border-radius:6px; box-shadow:inset 2px 0 0 var(--district); } #km-city-interior .km-city-districts button::before { display:none; } }