:root{
  --bg:#0b0d0e;
  --bg2:#111517;
  --panel:#171b1e;
  --text:#eef1f1;
  --muted:#9aa4a8;
  --line:#283036;
  --accent:#d7ff4f;
  --accent2:#9fbc2b;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  background:var(--bg);
  color:var(--text);
  font-family:Inter,Segoe UI,Arial,sans-serif;
  line-height:1.6;
}
a{color:inherit;text-decoration:none}
.wrap{width:min(1180px,calc(100% - 40px));margin:auto}
.hero{
  min-height:92vh;
  position:relative;
  overflow:hidden;
  background:
    radial-gradient(circle at 70% 20%,rgba(215,255,79,.10),transparent 27%),
    linear-gradient(135deg,rgba(0,0,0,.25),rgba(0,0,0,.78)),
    linear-gradient(120deg,#1b2225,#090b0c 70%);
  border-bottom:1px solid var(--line);
}
.hero:before{
  content:"";
  position:absolute;inset:0;
  background-image:
    linear-gradient(rgba(255,255,255,.018) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.018) 1px,transparent 1px);
  background-size:40px 40px;
  mask-image:linear-gradient(to bottom,black,transparent);
}
.nav{
  position:relative;z-index:2;
  height:84px;display:flex;align-items:center;justify-content:space-between
}
.brand{font-weight:800;letter-spacing:.02em;font-size:1.1rem}
.nav-links{display:flex;gap:28px;color:#c9d0d2;font-size:.95rem}
.nav-links a:hover{color:var(--accent)}
.menu-btn{display:none;background:none;border:0;color:white;font-size:1.5rem}
.hero-content{
  position:relative;z-index:1;
  padding:14vh 0 100px;
  max-width:950px
}
.eyebrow{
  color:var(--accent);
  letter-spacing:.18em;
  font-size:.76rem;
  font-weight:800;
  margin:0 0 14px
}
h1{
  font-size:clamp(3.5rem,8vw,7.8rem);
  line-height:.9;
  letter-spacing:-.06em;
  margin:0 0 30px;
  max-width:1050px
}
h1 span{color:#cbd0d2}
h2{
  font-size:clamp(2.3rem,5vw,4.5rem);
  line-height:1;
  letter-spacing:-.045em;
  margin:0 0 24px
}
h3{font-size:1.45rem;line-height:1.15;margin:8px 0 12px}
.lead{
  max-width:700px;color:#bcc5c8;font-size:1.15rem
}
.hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:34px}
.btn{
  display:inline-flex;align-items:center;justify-content:center;
  min-height:48px;padding:0 20px;border:1px solid var(--line);
  font-weight:700
}
.btn.primary{background:var(--accent);color:#101300;border-color:var(--accent)}
.btn.primary:hover{background:#edff9b}
.btn.ghost:hover{border-color:#59656b}
.section{padding:100px 0;border-bottom:1px solid var(--line)}
.section.dark{background:var(--bg2)}
.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:start}
.intro p,.section p{color:var(--muted)}
.notice{
  margin-top:24px;padding:16px 18px;border-left:3px solid var(--accent);
  background:rgba(215,255,79,.05)
}
.section-head{
  display:flex;justify-content:space-between;gap:50px;align-items:end;margin-bottom:35px
}
.section-head>p{max-width:520px}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.card{
  background:var(--panel);
  border:1px solid var(--line);
  overflow:hidden
}
.card-image{
  aspect-ratio:16/10;
  display:flex;align-items:end;padding:18px;
  background:
    linear-gradient(180deg,transparent,rgba(0,0,0,.75)),
    repeating-linear-gradient(135deg,#22292d,#22292d 12px,#1b2023 12px,#1b2023 24px);
}
.card-image span{
  font-size:.72rem;font-weight:800;letter-spacing:.14em;
  border:1px solid #667176;padding:7px 10px;background:rgba(0,0,0,.35)
}
.card-body{padding:22px}
.card-body p{margin:0 0 16px}
.card-body .meta{font-size:.78rem;text-transform:uppercase;letter-spacing:.12em}
.card-body a{color:var(--accent);font-weight:700}
.audio-section{background:#0d1011}
.audio-grid{align-items:center}
.audio-player{
  border:1px solid var(--line);
  background:var(--panel);
  min-height:120px;padding:22px;display:flex;gap:20px;align-items:center
}
.audio-player span{display:block;color:var(--muted);font-size:.9rem}
.audio-icon{
  width:58px;height:58px;border-radius:50%;
  display:grid;place-items:center;background:var(--accent);color:#0b0d0e;font-weight:900
}
.map-placeholder{
  margin-top:30px;min-height:360px;
  display:grid;place-items:center;text-align:center;padding:30px;
  border:1px solid var(--line);
  background:
    radial-gradient(circle at 20% 40%,rgba(215,255,79,.08),transparent 20%),
    linear-gradient(135deg,#121719,#0c0f10)
}
.map-placeholder div{max-width:620px}
footer{padding:48px 0 22px;background:#07090a}
.footer-grid{display:flex;justify-content:space-between;gap:30px}
.footer-grid p{color:var(--muted);margin:.3rem 0}
.footer-links{display:flex;gap:18px;flex-wrap:wrap;color:#aeb7ba}
.copyright{margin-top:35px;padding-top:20px;border-top:1px solid var(--line);color:#6f7a7e;font-size:.85rem}

@media (max-width:800px){
  .wrap{width:min(100% - 28px,1180px)}
  .menu-btn{display:block}
  .nav-links{
    display:none;position:absolute;top:70px;left:14px;right:14px;
    flex-direction:column;background:#101416;border:1px solid var(--line);padding:18px
  }
  .menu-open .nav-links{display:flex}
  .hero{min-height:auto}
  .hero-content{padding:90px 0 80px}
  h1{font-size:clamp(3rem,16vw,5rem)}
  .grid-2,.cards{grid-template-columns:1fr}
  .grid-2{gap:25px}
  .section{padding:72px 0}
  .section-head{display:block}
  .cards{gap:16px}
  .footer-grid{flex-direction:column}
}

.detail-hero{min-height:72vh;position:relative;overflow:hidden;background:radial-gradient(circle at 78% 28%,rgba(215,255,79,.09),transparent 24%),linear-gradient(120deg,#171d20,#080a0b 72%);border-bottom:1px solid var(--line)}
.detail-title{padding:10vh 0 90px}.detail-title h1{font-size:clamp(3.5rem,8vw,7rem)}
.back{display:inline-block;margin-bottom:34px;color:#aeb7ba}.back:hover{color:var(--accent)}
.story p{margin-top:0;margin-bottom:22px}
.history-warning{padding:20px;margin:26px 0;border:1px solid #4a4f3c;border-left:4px solid var(--accent);background:rgba(215,255,79,.045);color:#cfd5d6}
.timeline{margin-top:45px;border-top:1px solid var(--line)}
.time{display:grid;grid-template-columns:150px 1fr;gap:30px;padding:24px 0;border-bottom:1px solid var(--line)}
.time b{font-size:1.35rem;color:var(--accent)}.time span{color:#b6c0c3}
.source-box{max-width:850px;padding:28px;border:1px solid var(--line);background:var(--panel)}
@media(max-width:800px){.detail-title{padding:70px 0}.time{grid-template-columns:1fr;gap:4px}}

.real-audio-player{
  display:grid;
  grid-template-columns:120px 1fr;
  gap:24px;
  padding:22px;
  border:1px solid var(--line);
  background:var(--panel);
  align-items:center
}
.audio-cover{
  aspect-ratio:1;
  display:grid;
  place-items:center;
  border:1px solid #3c464b;
  background:
    radial-gradient(circle at 60% 35%,rgba(215,255,79,.16),transparent 28%),
    linear-gradient(145deg,#242c30,#0d1011);
}
.audio-cover span{
  font-size:2.2rem;
  font-weight:900;
  color:var(--accent);
  letter-spacing:-.05em
}
.audio-content{min-width:0}
.audio-kicker{
  margin:0 0 3px!important;
  color:var(--accent)!important;
  font-size:.7rem;
  font-weight:800;
  letter-spacing:.15em
}
.audio-content strong{
  display:block;
  font-size:1.2rem;
  margin-bottom:2px
}
.audio-subtitle{
  display:block;
  color:var(--muted);
  font-size:.88rem;
  margin-bottom:16px
}
.real-audio-player audio{
  width:100%;
  display:block;
  margin:8px 0 10px
}
.audio-download{
  display:inline-block;
  color:var(--accent);
  font-size:.84rem;
  font-weight:700
}
@media(max-width:600px){
  .real-audio-player{grid-template-columns:1fr}
  .audio-cover{max-width:110px}
}

.install-wrap{max-width:760px}.install-wrap.wide{max-width:950px}
.admin-form{display:grid;gap:18px;margin-top:30px}.admin-form label{display:grid;gap:7px;color:#cbd2d4;font-weight:700}
.admin-form input,.admin-form textarea,.admin-form select{width:100%;background:#111517;border:1px solid var(--line);color:var(--text);padding:13px 14px;font:inherit}
.admin-form textarea{resize:vertical}.admin-form hr{width:100%;border:0;border-top:1px solid var(--line)}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}.small,label small{color:var(--muted);font-weight:400}
.success-box,.error-box{padding:20px;border:1px solid var(--line);background:var(--panel);margin:20px 0}
.success-box{border-left:4px solid var(--accent)}.error-box{border-left:4px solid #d56b6b}
.admin-top{border-bottom:1px solid var(--line);background:#080a0b}.admin-top .wrap{min-height:70px;display:flex;justify-content:space-between;align-items:center}
.admin-top a{color:var(--accent)}.admin-heading{display:flex;align-items:end;justify-content:space-between;gap:25px}
.admin-table{margin-top:35px;border-top:1px solid var(--line)}
.admin-row{display:grid;grid-template-columns:2fr 1fr .7fr .7fr;gap:20px;padding:18px 10px;border-bottom:1px solid var(--line);align-items:center}
.admin-row small{display:block;color:var(--muted)}.admin-row-head{color:var(--muted);font-size:.8rem;text-transform:uppercase;letter-spacing:.08em}
.status{font-size:.75rem;text-transform:uppercase}.status.published{color:var(--accent)}
.db-cover{width:100%;aspect-ratio:16/10;object-fit:cover}.hero-db-image{width:100%;max-height:600px;object-fit:cover;margin-top:45px}
.compact{min-height:55vh}
@media(max-width:700px){.form-grid{grid-template-columns:1fr}.admin-heading{display:block}.admin-heading .btn{margin-top:15px}.admin-row{grid-template-columns:1fr}.admin-row-head{display:none}}

.admin-footer-link{
  opacity:.68;
  font-size:.9rem;
}
.admin-footer-link:hover{
  opacity:1;
  color:var(--accent);
}

.upload-status{display:block;margin-top:8px;color:var(--muted);font-size:.8rem;font-weight:500}
.upload-status.ok{color:var(--accent)}
.upload-status.bad{color:#ff8c8c}
.admin-image-preview{
  margin-top:12px;
  width:100%;
  max-width:420px;
  max-height:260px;
  object-fit:cover;
  border:1px solid var(--line);
  background:#0b0d0e;
}

.db-cover{
  display:block;
  width:100%;
  aspect-ratio:16/10;
  object-fit:cover;
  background:#151a1d;
}
.upload-direct-link{
  display:inline-block;
  margin-top:8px;
  color:var(--accent);
  font-size:.82rem;
  font-weight:700;
}

/* Lost-Places Archiv – Version 1.3.6 */
.places-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:28px;
  align-items:stretch;
}
.place-card{
  min-width:0;
  height:100%;
  display:flex;
  flex-direction:column;
  overflow:hidden;
  border:1px solid var(--line);
  background:var(--panel);
  transition:transform .22s ease,border-color .22s ease,box-shadow .22s ease;
}
.place-card:hover{
  transform:translateY(-5px);
  border-color:rgba(215,255,79,.5);
  box-shadow:0 18px 45px rgba(0,0,0,.22);
}
.place-card .db-cover,
.place-card .card-image{
  width:100%;
  aspect-ratio:16/10;
  height:auto;
  object-fit:cover;
  flex:0 0 auto;
  transition:transform .35s ease,filter .35s ease;
}
.place-card:hover .db-cover{
  transform:scale(1.025);
  filter:contrast(1.03);
}
.place-card-body{
  flex:1;
  display:flex;
  flex-direction:column;
  padding:24px 22px 22px;
}
.place-card-body .meta{
  margin-bottom:12px;
  letter-spacing:.12em;
  text-transform:uppercase;
  font-size:.72rem;
}
.place-card-body h3{
  margin:0 0 12px;
  line-height:1.15;
}
.place-card-body p:not(.meta){
  margin:0 0 22px;
  color:var(--muted);
  line-height:1.65;
}
.place-card-link{
  margin-top:auto;
  display:inline-flex;
  align-items:center;
  width:max-content;
  max-width:100%;
  color:var(--accent);
  font-weight:800;
  text-decoration:none;
}
.place-card-link:hover{
  text-decoration:underline;
}
@media(max-width:1050px){
  .places-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
}
@media(max-width:650px){
  .places-grid{grid-template-columns:1fr;gap:20px;}
  .place-card-body{padding:20px 18px;}
}

.lostplaces-map{width:100%;height:min(68vh,720px);min-height:480px;border:1px solid var(--line);background:#111517;margin-top:28px}
.map-empty{margin-top:24px}.map-live-teaser .btn{margin-top:10px}
.map-popup{min-width:210px}.map-popup strong{display:block;color:#101415}.map-popup span,.map-popup small{display:block;color:#526068}
.map-popup-actions{display:flex;flex-wrap:wrap;gap:7px;margin-top:12px}.map-popup-actions a{padding:7px 9px;background:#182023;color:#d7ff4f!important;text-decoration:none;font-size:.75rem;font-weight:800}
.place-nav-strip{display:flex;justify-content:space-between;align-items:center;gap:24px;margin-top:34px;padding:22px;border:1px solid var(--line);background:var(--panel)}
.place-nav-strip strong,.place-nav-strip span{display:block}.place-nav-strip span{color:var(--muted);font-size:.9rem;margin-top:3px}.place-nav-actions{display:flex;gap:10px;flex-wrap:wrap}
@media(max-width:700px){.lostplaces-map{height:60vh;min-height:420px}.place-nav-strip{align-items:flex-start;flex-direction:column}.place-nav-actions{width:100%}.place-nav-actions .btn{flex:1}}

/* Kartenkomfort – Version 1.5 */
.map-toolbar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:24px 0 -4px}
.location-status{font-size:.82rem;color:var(--muted);margin-left:4px}
.map-list-head{display:flex;justify-content:space-between;align-items:end;gap:20px;margin:58px 0 20px}
.map-list-head h2{margin:4px 0 0}.map-list-head>span{color:var(--muted);font-size:.85rem}
.map-place-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.map-place-item{display:flex;gap:18px;padding:22px;border:1px solid var(--line);background:var(--panel)}
.map-place-number{font-size:1.8rem;font-weight:900;color:var(--accent);opacity:.75;line-height:1}
.map-place-copy{min-width:0}.map-place-copy small{color:var(--muted);text-transform:uppercase;letter-spacing:.08em;font-size:.68rem}
.map-place-copy h3{margin:7px 0 8px}.map-place-copy p{color:var(--muted);font-size:.9rem;line-height:1.55;margin:0 0 16px}
.map-place-actions{display:flex;gap:12px;flex-wrap:wrap;align-items:center}
.map-place-actions a,.map-place-actions button{border:0;background:none;padding:0;color:var(--accent);font:inherit;font-size:.8rem;font-weight:800;text-decoration:none;cursor:pointer}
.map-place-actions a:hover,.map-place-actions button:hover{text-decoration:underline}
@media(max-width:760px){.map-place-list{grid-template-columns:1fr}.map-toolbar .btn{flex:1}.location-status{width:100%;margin:4px 0 0}.map-list-head{margin-top:42px}}

/* =========================================================
   SPUREN DER STILLE — MYSTERY REDESIGN 1.6
   Lost Place + Archiv + Mystery + Dokumentation
   ========================================================= */
:root{
  --bg:#070a0b;
  --bg2:#0b1011;
  --panel:#101617;
  --panel2:#0c1213;
  --text:#edf0eb;
  --muted:#909c99;
  --line:#25302f;
  --accent:#b9d98a;
  --accent2:#718b57;
  --mist:rgba(185,217,138,.07);
}
body{
  background:
    radial-gradient(circle at 15% 8%,rgba(185,217,138,.035),transparent 25rem),
    linear-gradient(#070a0b,#090d0e 60%,#070a0b);
  background-attachment:fixed;
}
body:before{
  content:"";position:fixed;inset:0;pointer-events:none;z-index:9999;opacity:.055;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.45'/%3E%3C/svg%3E");
}
.brand{text-transform:uppercase;letter-spacing:.17em;font-size:.88rem}
.brand:before{content:"◌";color:var(--accent);margin-right:10px;text-shadow:0 0 18px rgba(185,217,138,.55)}
.nav{border-bottom:1px solid rgba(255,255,255,.045)}
.hero{
  min-height:96vh;
  background:
    linear-gradient(90deg,rgba(5,8,9,.95) 0%,rgba(5,8,9,.77) 48%,rgba(5,8,9,.9) 100%),
    radial-gradient(ellipse at 68% 45%,rgba(185,217,138,.09),transparent 28%),
    linear-gradient(135deg,#182021,#07090a 72%);
}
.hero:before{background-image:linear-gradient(rgba(255,255,255,.015) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.015) 1px,transparent 1px);background-size:58px 58px;mask-image:linear-gradient(to bottom,black 20%,transparent 95%)}
.hero:after,.detail-hero:after{
  content:"";position:absolute;left:-10%;right:-10%;bottom:-95px;height:230px;pointer-events:none;
  background:radial-gradient(ellipse at center,rgba(180,196,186,.09),transparent 62%);filter:blur(18px)
}
.hero-content{padding-top:17vh}
.hero-content:before{content:"ARCHIV // LOST PLACES // ZEITGESCHICHTE";display:block;margin-bottom:34px;color:#66736f;font:700 .65rem/1.4 ui-monospace,SFMono-Regular,Consolas,monospace;letter-spacing:.22em}
h1{font-weight:750;text-shadow:0 5px 35px rgba(0,0,0,.55)}
h1 span{color:#aeb7b3}
.eyebrow{color:var(--accent);font-family:ui-monospace,SFMono-Regular,Consolas,monospace;letter-spacing:.2em}
.lead{color:#aab5b2}
.btn{border-radius:2px;letter-spacing:.035em;transition:.2s ease}
.btn.primary{background:var(--accent);color:#0b100a;box-shadow:0 0 30px rgba(185,217,138,.08)}
.btn.primary:hover{background:#d0e6ad;box-shadow:0 0 35px rgba(185,217,138,.15)}
.btn.ghost{background:rgba(8,12,13,.45);backdrop-filter:blur(8px)}
.section{position:relative}
.section.dark{background:linear-gradient(180deg,#0a0e0f,#0c1112 55%,#090d0e)}
.section-head{border-bottom:1px solid var(--line);padding-bottom:28px}
.notice{border-left-color:var(--accent);background:linear-gradient(90deg,rgba(185,217,138,.07),rgba(185,217,138,.015));box-shadow:inset 0 0 35px rgba(0,0,0,.15)}
.card,.place-card,.source-box,.map-place-item,.place-nav-strip,.real-audio-player,.audio-player{
  background:linear-gradient(145deg,rgba(17,24,25,.96),rgba(11,16,17,.98));
  border-color:#283332;box-shadow:0 20px 55px rgba(0,0,0,.12)
}
.card-image{position:relative;background:linear-gradient(180deg,rgba(6,9,10,.08),rgba(5,8,9,.92)),repeating-linear-gradient(135deg,#182020,#182020 12px,#121819 12px,#121819 24px)}
.card-image:after,.place-card:before{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(110deg,transparent 35%,rgba(185,217,138,.035),transparent 65%)}
.card-image span{border-color:#596862;background:rgba(5,8,9,.65);color:#dce3dc}
.place-card{position:relative}
.place-card:hover{border-color:rgba(185,217,138,.42);box-shadow:0 25px 65px rgba(0,0,0,.3),0 0 30px rgba(185,217,138,.035)}
.place-card .db-cover{filter:saturate(.72) brightness(.77) contrast(1.08)}
.place-card:hover .db-cover{filter:saturate(.88) brightness(.9) contrast(1.08)}
.meta{color:#798783!important}
.detail-hero{background:linear-gradient(90deg,rgba(5,8,9,.96),rgba(6,9,10,.8)),radial-gradient(circle at 75% 32%,rgba(185,217,138,.08),transparent 25%),linear-gradient(125deg,#172021,#07090a 70%)}
.detail-title:before{content:"AKTE // DOKUMENTIERTER ORT";display:block;color:#5f6d68;font:700 .62rem/1.4 ui-monospace,SFMono-Regular,Consolas,monospace;letter-spacing:.2em;margin-bottom:28px}
.hero-db-image{filter:saturate(.72) brightness(.82) contrast(1.07);border:1px solid var(--line);box-shadow:0 28px 70px rgba(0,0,0,.32)}
.timeline{position:relative}.time{transition:background .2s ease}.time:hover{background:rgba(185,217,138,.025)}
.time b{color:var(--accent);font-family:ui-monospace,SFMono-Regular,Consolas,monospace}
.audio-section{background:radial-gradient(circle at 75% 45%,rgba(185,217,138,.065),transparent 25%),linear-gradient(135deg,#080c0d,#0b1112)}
.audio-cover{position:relative;background:radial-gradient(circle,rgba(185,217,138,.16),transparent 55%),linear-gradient(145deg,#172120,#090d0e);box-shadow:inset 0 0 40px rgba(0,0,0,.28)}
.audio-cover:after{content:"";position:absolute;width:58%;height:58%;border:1px solid rgba(185,217,138,.25);border-radius:50%;box-shadow:0 0 22px rgba(185,217,138,.08)}
.audio-cover span{z-index:1;color:var(--accent);text-shadow:0 0 18px rgba(185,217,138,.35)}
.lostplaces-map{filter:saturate(.65) brightness(.78) contrast(1.08);box-shadow:0 25px 65px rgba(0,0,0,.25)}
.map-place-number{font-family:ui-monospace,SFMono-Regular,Consolas,monospace}
footer{background:#050708;border-top:1px solid #18201f}
.copyright{font-family:ui-monospace,SFMono-Regular,Consolas,monospace;letter-spacing:.04em}
.reveal{opacity:0;transform:translateY(18px);transition:opacity .7s ease,transform .7s ease}.reveal.visible{opacity:1;transform:none}
.mystery-tags{display:flex;gap:9px;flex-wrap:wrap;margin:24px 0 0}.mystery-tags span{border:1px solid #34413d;background:rgba(7,11,12,.6);padding:7px 10px;color:#8f9d98;font:700 .64rem/1 ui-monospace,SFMono-Regular,Consolas,monospace;letter-spacing:.12em;text-transform:uppercase}
@media(prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none;transition:none}.place-card,.place-card .db-cover{transition:none}}