:root{--bg:#05070d;--glass:rgba(12,16,28,.78);--line:rgba(140,170,255,.18);--tx:#e8edf8;--mut:#8b96b0;--acc:#7aa2ff}
*{box-sizing:border-box}html,body{margin:0;height:100%;background:var(--bg);color:var(--tx);font:14px/1.4 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;overflow:hidden}
#map{position:fixed;inset:0;background:radial-gradient(circle at 50% 45%,#0d1630 0,#05070d 70%)}
.top{position:fixed;top:0;left:0;right:0;display:flex;gap:12px;align-items:center;padding:12px 14px;padding-top:max(12px,env(safe-area-inset-top));pointer-events:none;z-index:5}
.top>*{pointer-events:auto}
.brand{display:flex;align-items:center;gap:8px;background:var(--glass);backdrop-filter:blur(14px);border:1px solid var(--line);border-radius:14px;padding:9px 14px;letter-spacing:.18em}
.brand small{letter-spacing:.04em;color:var(--mut);font-size:11px}
.orb{width:14px;height:14px;border-radius:50%;background:radial-gradient(circle at 35% 35%,#bcd3ff,#3b5bdb 60%,#0b1a4a);box-shadow:0 0 14px #4d7cff}
#search{position:relative;flex:1;max-width:460px}
#q{width:100%;background:var(--glass);backdrop-filter:blur(14px);border:1px solid var(--line);border-radius:14px;color:var(--tx);padding:11px 14px;font-size:15px;outline:none}
#q:focus{border-color:var(--acc)}
#results{position:absolute;top:48px;left:0;right:0;background:rgba(10,14,24,.96);border:1px solid var(--line);border-radius:12px;max-height:50vh;overflow:auto}
#results div{padding:9px 12px;cursor:pointer;border-bottom:1px solid rgba(255,255,255,.04)}#results div:hover{background:rgba(122,162,255,.12)}
#results small{color:var(--mut);display:block}
#panel{position:fixed;top:76px;right:14px;width:270px;background:var(--glass);backdrop-filter:blur(16px);border:1px solid var(--line);border-radius:16px;padding:12px 14px;z-index:4}
#panel h3{margin:0 0 8px;font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--mut);display:flex;justify-content:space-between}
.ly{display:flex;align-items:center;gap:9px;padding:7px 2px;cursor:pointer}
.ly input{accent-color:var(--acc);width:16px;height:16px}
.ly i{width:10px;height:10px;border-radius:50%;background:var(--c);box-shadow:0 0 10px var(--c)}
.ly em{margin-left:auto;font-style:normal;color:var(--mut);font-variant-numeric:tabular-nums}
.ly small{color:var(--mut)}
.soon{margin-top:8px;font-size:12px;color:var(--mut);border-top:1px solid var(--line);padding-top:8px}
.note{font-size:11px;color:var(--mut);margin:8px 0 4px}
.credits{color:var(--acc);font-size:12px;text-decoration:none}
.fab{display:none;position:fixed;right:14px;bottom:calc(18px + env(safe-area-inset-bottom));z-index:6;width:52px;height:52px;border-radius:50%;border:1px solid var(--line);background:var(--glass);color:var(--tx);font-size:22px;backdrop-filter:blur(14px)}
#card{position:fixed;left:14px;bottom:24px;width:340px;max-width:calc(100vw - 28px);background:rgba(10,14,24,.93);backdrop-filter:blur(16px);border:1px solid var(--line);border-radius:16px;padding:14px;z-index:7;box-shadow:0 20px 50px rgba(0,0,0,.5)}
#card .x{position:absolute;right:8px;top:6px;background:none;border:0;color:var(--mut);font-size:22px;cursor:pointer}
#card h4{margin:0 26px 6px 0;font-size:16px}#card .k{display:grid;grid-template-columns:auto 1fr;gap:3px 12px;font-size:13px}#card .k span{color:var(--mut)}
#card img{width:100%;border-radius:10px;margin-top:8px;background:#111;min-height:120px}
#card .src{font-size:11px;color:var(--mut);margin-top:6px}#card a{color:var(--acc)}
.maplibregl-ctrl-attrib{background:rgba(5,7,13,.6)!important;color:#8b96b0}.maplibregl-ctrl-attrib a{color:#a9b6d6!important}
@media (max-width:700px){.brand small{display:none}.brand{padding:9px 11px}#panel{top:auto;bottom:calc(84px + env(safe-area-inset-bottom));right:12px;left:12px;width:auto;display:none}#panel.open{display:block}.fab{display:block}#card{left:10px;right:10px;bottom:calc(84px + env(safe-area-inset-bottom));width:auto}}
.page{max-width:780px;margin:0 auto;padding:30px 20px;overflow:auto;height:100%}.page a{color:var(--acc)}.page li{margin:6px 0}body.scroll{overflow:auto}
@media (max-width:700px){.maplibregl-ctrl-bottom-right .maplibregl-ctrl-group{display:none}.fab{bottom:calc(36px + env(safe-area-inset-bottom))}#panel{bottom:calc(100px + env(safe-area-inset-bottom))}}
