/* First-person Aetheridge exploration */
#city.city-screen.active{position:fixed;inset:0;z-index:70;display:block;overflow:hidden;background:#16294d;color:#e8f1ff}
#city .city-scene,#city .city-scene img,#city .city-vignette{position:absolute;inset:0;width:100%;height:100%}
#city .city-scene img{object-fit:cover;object-position:center;user-select:none;pointer-events:none}
#city #city-image-next{opacity:0;transition:opacity .36s ease}
#city #city-image-next.visible{opacity:1}
#city .city-vignette{background:linear-gradient(180deg,rgba(12,28,63,.57),transparent 24%,transparent 63%,rgba(10,25,58,.76));pointer-events:none}
#city .city-hud{position:absolute;z-index:2;top:clamp(12px,2vw,28px);left:clamp(12px,2vw,30px);right:clamp(12px,2vw,30px);display:flex;align-items:flex-start;justify-content:space-between;gap:18px}
#city .city-place{display:grid;gap:5px;text-shadow:0 2px 12px rgba(16,29,59,.8)}
#city .city-place small{font:700 .76rem/1.2 ui-monospace,monospace;letter-spacing:.17em;color:#88d7f5}
#city .city-place strong{font:600 clamp(1.08rem,2vw,1.7rem)/1.2 system-ui,sans-serif;color:#e8f3ff}
#city button{font:600 1rem system-ui,sans-serif;cursor:pointer;color:#e5f2ff}
#city button:focus-visible{outline:3px solid #85d9ff;outline-offset:3px}
#city button:disabled{opacity:.45;cursor:default}
#city #city-watch-toggle{display:flex;align-items:center;gap:10px;border:1px solid rgba(132,202,255,.64);border-radius:14px;background:rgba(15,39,88,.85);backdrop-filter:blur(15px);padding:11px 15px;box-shadow:0 12px 36px rgba(6,22,56,.34)}
#city #city-watch-toggle span{font-size:1.35rem;color:#75c9fc}
#city #city-clock{font:600 .88rem ui-monospace,monospace;color:#aed8f3}
#city .city-route-panel{position:absolute;z-index:2;bottom:190px;left:50%;transform:translateX(-50%);width:min(880px,94vw);text-align:center}
#city .city-route-panel>p{display:inline-block;margin:0;padding:9px 17px;border-radius:11px;background:rgba(14,37,80,.8);backdrop-filter:blur(14px);color:#d7e9f9;font-size:.93rem}
#city .city-districts{display:flex;justify-content:center;flex-wrap:wrap;gap:8px;margin-top:12px}
#city .city-districts button{display:grid;grid-template-columns:1fr auto;gap:0 8px;min-width:132px;text-align:left;padding:10px 12px;border:1px solid color-mix(in srgb,var(--route-color) 65%,#436589);border-radius:12px;background:rgba(15,39,84,.92);backdrop-filter:blur(18px);box-shadow:inset 0 2px var(--route-color),0 10px 30px rgba(7,22,56,.32)}
#city .city-districts small{grid-column:1;color:#b7cfe9;font-size:.72rem;font-weight:500}
#city .city-districts strong{grid-column:1;color:var(--route-color);font-size:1rem}
#city .city-districts span{grid-column:2;grid-row:1/3;align-self:center;color:var(--route-color)}
#city .city-districts button:hover,#city .city-actions button:hover,#city #city-watch-toggle:hover{background:rgba(38,72,125,.95);transform:translateY(-2px)}
#city .city-actions{position:absolute;z-index:2;bottom:clamp(105px,9vw,125px);left:50%;transform:translateX(-50%);display:flex;justify-content:center;gap:12px;width:min(720px,94vw)}
#city .city-actions button{min-height:50px;padding:11px 22px;border:1px solid rgba(135,192,241,.55);border-radius:12px;background:rgba(14,40,87,.9);backdrop-filter:blur(16px);box-shadow:0 12px 30px rgba(7,23,56,.34)}
#city #city-forward{border-color:rgba(102,191,241,.8);background:linear-gradient(100deg,rgba(20,69,120,.95),rgba(38,53,118,.95))}
#city .city-core{position:absolute;z-index:5;right:clamp(12px,2vw,30px);top:80px;width:min(360px,calc(100vw - 24px));max-height:calc(100vh - 100px);overflow:auto;padding:20px;border:1px solid rgba(111,190,241,.57);border-radius:18px;background:linear-gradient(145deg,rgba(10,35,79,.97),rgba(34,30,85,.97));box-shadow:0 25px 80px rgba(5,17,46,.58);backdrop-filter:blur(24px)}
#city .city-core[hidden]{display:none}
#city .city-core header{display:flex;align-items:center;justify-content:space-between;color:#83d0f2;font:700 .81rem ui-monospace,monospace;letter-spacing:.12em}
#city .city-core header button{border:0;background:transparent;font-size:1.7rem}
#city .city-core-name{margin:22px 0 3px;font-size:1.45rem;font-weight:700}
#city #city-core-reading{margin:0 0 23px;color:#b8d6ef}
#city .city-core>button{width:100%;display:flex;justify-content:space-between;text-align:left;margin-top:8px;padding:13px;border:1px solid rgba(119,175,225,.38);border-radius:9px;background:rgba(66,116,179,.18)}
#city .city-core>button:hover{background:rgba(77,135,202,.37)}
#city .city-core-hint{margin:18px 0 0;color:#9bbbd7;font-size:.85rem;line-height:1.45}
body.record-unlocked #gateway .ego-watch-entry #city-resume{border-color:rgba(105,214,251,.8);background:linear-gradient(110deg,rgba(18,66,119,.95),rgba(40,46,112,.95));color:#e5f2ff;font-size:1rem;font-weight:700;letter-spacing:.07em}
body.record-unlocked #gateway .ego-watch-entry #city-resume span{font-size:1rem}
@media(max-width:700px){
 #city .city-hud{align-items:center}
 #city .city-place small{font-size:.64rem}
 #city .city-place strong{font-size:1rem}
 #city #city-watch-toggle{padding:8px 10px;font-size:.8rem}
 #city #city-clock{display:none}
 #city .city-route-panel{bottom:165px}
 #city .city-districts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}
 #city .city-districts button{min-width:0}
 #city .city-districts button:last-child{grid-column:1/-1}
 #city .city-actions{gap:8px}
 #city .city-actions button{padding:8px 12px;font-size:.85rem}
}
@media(max-height:620px){#city .city-route-panel{bottom:125px}#city .city-districts{margin-top:5px}#city .city-districts button{padding:5px 9px}#city .city-actions{bottom:64px}#city .city-actions button{min-height:40px}}
@media(prefers-reduced-motion:reduce){#city #city-image-next{transition:none}#city button{transition:none}}

#city-return[hidden]{display:none!important}

body[data-screen="city"]{overflow:hidden}
body[data-shared="true"] #city-enter-result{display:none!important}
