.district-passport { position:fixed; left:clamp(.75rem,2vw,1.5rem); bottom:clamp(.75rem,2vw,1.5rem); z-index:1400; color:#dceaf0; font-family:var(--font-ui,system-ui,sans-serif); }
.district-passport__trigger { display:grid; grid-template-columns:auto 1fr; align-items:center; gap:.7rem; min-height:3.25rem; padding:.45rem .8rem; border:1px solid rgba(53,216,255,.48); border-radius:3px; background:rgba(2,12,18,.94); color:inherit; box-shadow:0 10px 34px rgba(0,0,0,.38); cursor:pointer; text-align:left; backdrop-filter:blur(14px); }
.district-passport__trigger:hover,.district-passport__trigger:focus-visible { border-color:#35d8ff; outline:2px solid transparent; box-shadow:0 0 0 2px rgba(53,216,255,.2),0 12px 36px rgba(0,0,0,.45); }
.district-passport__trigger-code { display:grid; place-items:center; width:2.35rem; height:2.35rem; border:1px solid #ff4b2b; color:#ff684d; font:800 .62rem/1 var(--font-code,monospace); letter-spacing:.05em; clip-path:polygon(50% 0,100% 50%,50% 100%,0 50%); background:rgba(255,75,43,.06); }
.district-passport__trigger-copy { display:grid; gap:.16rem; }.district-passport__trigger-copy b { font:750 .78rem/1.1 var(--font-code,monospace); text-transform:uppercase; letter-spacing:.04em; }.district-passport__trigger-copy small { color:#91a8b4; font:650 .65rem/1.1 var(--font-code,monospace); }
.district-passport__panel { position:absolute; left:0; bottom:calc(100% + .6rem); width:min(26rem,calc(100vw - 1.5rem)); max-height:min(42rem,calc(100vh - 6rem)); overflow:auto; border:1px solid rgba(53,216,255,.4); border-radius:3px; background:linear-gradient(145deg,rgba(4,19,28,.985),rgba(1,8,13,.99)); box-shadow:0 24px 80px rgba(0,0,0,.58); }
.district-passport__panel[hidden] { display:none; }.district-passport__header { display:flex; justify-content:space-between; align-items:start; gap:1rem; padding:1rem; border-bottom:1px solid rgba(53,216,255,.18); background:rgba(53,216,255,.045); }.district-passport__header span { color:#35d8ff; font:700 .62rem var(--font-code,monospace); letter-spacing:.13em; }.district-passport__header h2 { margin:.25rem 0 0; color:#f3f8fa; font:800 1.1rem var(--font-code,monospace); text-transform:uppercase; }.district-passport__close { width:2.4rem; height:2.4rem; border:1px solid rgba(53,216,255,.28); background:#061722; color:#dceaf0; font-size:1.3rem; cursor:pointer; }.district-passport__close:hover,.district-passport__close:focus-visible { color:#001017; background:#35d8ff; outline:none; }
.district-passport__privacy { margin:0; padding:.8rem 1rem; color:#9db1bb; font-size:.78rem; line-height:1.45; }.district-passport__progress { display:grid; gap:.55rem; padding:0 1rem 1rem; color:#c7d7de; font:700 .7rem var(--font-code,monospace); text-transform:uppercase; letter-spacing:.04em; }.district-passport__bar { height:3px; overflow:hidden; background:rgba(53,216,255,.12); }.district-passport__bar i { display:block; width:var(--passport-progress,0%); height:100%; background:#35d8ff; box-shadow:0 0 12px rgba(53,216,255,.7); transition:width .35s ease; }
.district-passport__details { display:grid; grid-template-columns:auto 1fr; gap:.22rem .65rem; margin:0 1rem 1rem; padding:.7rem; border:1px solid rgba(53,216,255,.16); background:rgba(53,216,255,.035); }.district-passport__details span { grid-row:1/3; color:#ff684d; font:700 .58rem var(--font-code,monospace); text-transform:uppercase; writing-mode:vertical-rl; }.district-passport__details b { color:#d6e4e9; font:700 .69rem var(--font-code,monospace); }.district-passport__details small { color:#7f96a1; font-size:.63rem; line-height:1.35; }
.district-passport__orte { display:grid; grid-template-columns:1fr 1fr; gap:1px; margin:0; padding:1px; list-style:none; background:rgba(53,216,255,.13); }.district-passport__orte li { position:relative; display:grid; grid-template-columns:auto 1fr auto; gap:.25rem .55rem; min-width:0; padding:.7rem; background:#04131c; opacity:.54; }.district-passport__orte li span { grid-row:1/3; align-self:center; color:#6f8792; font:700 .58rem var(--font-code,monospace); }.district-passport__orte li b { overflow:hidden; color:#b7c8d0; font:700 .68rem var(--font-code,monospace); text-overflow:ellipsis; white-space:nowrap; }.district-passport__orte li small { color:#718792; font-size:.62rem; }.district-passport__orte li.is-visited { opacity:1; box-shadow:inset 2px 0 #35d8ff; }.district-passport__orte li.is-visited span,.district-passport__orte li.is-visited small { color:#35d8ff; }.district-passport__orte li.is-favorite { background:linear-gradient(110deg,#04131c,rgba(255,75,43,.09)); }
.district-passport__orte [data-passport-favorite] { grid-row:1/3; grid-column:3; align-self:center; width:2rem; height:2rem; padding:0; border:1px solid rgba(255,104,77,.28); border-radius:2px; background:transparent; color:#8ca0aa; font-size:1rem; cursor:pointer; }.district-passport__orte [data-passport-favorite]:hover,.district-passport__orte [data-passport-favorite]:focus-visible,.district-passport__orte [data-passport-favorite][aria-pressed="true"] { border-color:#ff684d; background:rgba(255,75,43,.11); color:#ff8069; outline:none; }
.district-passport__footer { padding:1rem; border-top:1px solid rgba(53,216,255,.16); }.district-passport__footer p { margin:0 0 .7rem; color:#8197a2; font-size:.7rem; line-height:1.45; }.district-passport__reset { width:100%; min-height:2.6rem; border:1px solid rgba(255,75,43,.42); border-radius:2px; background:transparent; color:#f1b1a5; font:700 .67rem var(--font-code,monospace); cursor:pointer; }.district-passport__reset:hover,.district-passport__reset:focus-visible,.district-passport__reset[data-confirm="true"] { background:#ff4b2b; color:white; outline:none; }
.district-node.is-visited::after,.district-mini-atlas__node.is-visited::after { content:"✓"; position:absolute; right:-.4rem; top:-.45rem; display:grid; place-items:center; width:1rem; height:1rem; border:1px solid #35d8ff; border-radius:50%; background:#021017; color:#35d8ff; font:800 .58rem/1 var(--font-code,monospace); box-shadow:0 0 12px rgba(53,216,255,.45); }.district-card.is-visited { box-shadow:inset 2px 0 #35d8ff; }
.district-node.is-unknown,.district-mini-atlas__node.is-unknown { filter:saturate(.45); }.district-node.is-favorite,.district-mini-atlas__node.is-favorite { color:#ff8069; }.district-node.is-favorite::before,.district-mini-atlas__node.is-favorite::before { content:"★"; position:absolute; left:-.45rem; top:-.6rem; color:#ff8069; font-size:.7rem; text-shadow:0 0 10px rgba(255,75,43,.8); }
.district-atlas__passport-detail,.district-atlas__passport-detail i { position:absolute; inset:0; pointer-events:none; }.district-atlas__passport-detail { z-index:1; overflow:hidden; }.district-atlas__passport-detail i { opacity:0; transition:opacity .45s ease; }.district-atlas.has-passport-routes .district-atlas__passport-detail .is-routes { opacity:.34; background:repeating-linear-gradient(27deg,transparent 0 88px,rgba(53,216,255,.22) 89px,transparent 90px 178px); }.district-atlas.has-passport-sectors .district-atlas__passport-detail .is-sectors { opacity:.3; background:repeating-linear-gradient(90deg,transparent 0 19.8%,rgba(255,104,77,.25) 20%,transparent 20.2% 40%); }.district-atlas.has-passport-signals .district-atlas__passport-detail .is-signals { opacity:.35; background:radial-gradient(circle at 22% 35%,#35d8ff 0 2px,transparent 3px),radial-gradient(circle at 65% 18%,#35d8ff 0 2px,transparent 3px),radial-gradient(circle at 73% 61%,#35d8ff 0 2px,transparent 3px); animation:passport-signal 3.6s ease-in-out infinite; }.district-atlas.has-passport-complete .district-atlas__passport-detail .is-complete { inset:1.2%; opacity:1; border:1px solid rgba(53,216,255,.5); box-shadow:inset 0 0 38px rgba(53,216,255,.08); }
@keyframes passport-signal { 50% { opacity:.7; filter:drop-shadow(0 0 8px #35d8ff); } }
@media (max-width:640px) { .district-passport { left:.6rem; bottom:.6rem; }.district-passport__trigger { grid-template-columns:2.35rem; padding:.45rem; }.district-passport__trigger-copy { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); }.district-passport__panel { max-height:calc(100vh - 5.5rem); }.district-passport__orte { grid-template-columns:1fr; } }
@media (prefers-reduced-motion:reduce) { .district-passport__bar i,.district-atlas__passport-detail i { transition:none; }.district-atlas__passport-detail .is-signals { animation:none !important; } }