/* beta-3d.css — 3D-Archipel + Zeitungs-Journal für die Integrations-Beta.
   Tokens sind auf die Beta-Container gescoped (kollidieren nicht mit styles.css). */
#v3d,#jwrap,#archDock,#betaTag,#npStage,#panel,#ovl,#lbx{
  --ink:#123a52; --ink-soft:#4a7089; --plumb:#2fd07f;
  --paper:#fbeee6; --paper-2:#f4e2d5; --jink:#31283b; --jink-soft:#7d6f8a;
  --rose:#e2607f; --mustard:#dd9a2b; --jgreen:#169a63; --stamp:#c2403f;
  --night-ink:#dfe9ff; --night-soft:#8fa3c8;
  --c-fam:#7a5fd0; --c-love:#e2607f; --c-friend:#2fa4d0; --c-past:#9aa3ad; --c-enemy:#d0452f;
  --display:'Fredoka',sans-serif; --body:'Nunito',sans-serif; --serif:'Fraunces',serif;
  --jrule:2px solid #31283b;
  --stampgrunge:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 220 220'><filter id='g'><feTurbulence type='fractalNoise' baseFrequency='0.42' numOctaves='3' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 0.984  0 0 0 0 0.933  0 0 0 0 0.902  0.95 0 0 0 -0.32'/></filter><rect width='100%' height='100%' filter='url(%23g)'/></svg>");
}
#skyDay,#skyNight{position:fixed;inset:0;pointer-events:none}
#skyDay{background:linear-gradient(180deg,#ffd9a8 0%,#a9dcf5 34%,#7cc0ec 70%,#5aa3d8 100%)}
#skyNight{background:linear-gradient(180deg,#070b22 0%,#101a3d 36%,#1a2f55 68%,#24406b 100%);opacity:0}
#c3d{position:fixed;inset:0;display:block}
#c3d.hover{cursor:pointer}
#c3d.drag{cursor:grabbing}
.hint{position:fixed;bottom:5.2rem;left:50%;transform:translateX(-50%);z-index:9;background:rgba(14,53,80,.82);
  color:#d8f2ff;font-weight:800;font-size:.78rem;border-radius:999px;padding:.5rem 1.05rem;pointer-events:none;text-align:center;transition:background .8s}
/* ══ JOURNAL (News · Artikel · Volkszählung) ══ */
#jwrap{position:fixed;inset:0;z-index:30;display:none}
#jsheet{position:absolute;inset:0;will-change:transform}
/* Papier-VORHANG: 4 vollflächige Lagen in der Zeitungstextur. Sie steigen
   gestaffelt von unten auf (öffnen) bzw. senken sich von oben (schließen)
   — der „Blätter"-Effekt entsteht durch die sichtbaren Kanten der Lagen.
   Transform gehört KOMPLETT GSAP (kein CSS-translateY — das war der Bug:
   CSS-translateY und GSAP-yPercent sind getrennte Kanäle, der alte Tween
   lief dadurch ins Leere und der Vorhang kam nie). */
#jstripes{position:absolute;inset:0;overflow:hidden;z-index:4;pointer-events:none}
#jstripes .stripe{position:absolute;top:-2%;bottom:-2%;left:0;width:100%;background:var(--paper);
  box-shadow:0 -22px 55px rgba(20,10,30,.30),0 22px 55px rgba(20,10,30,.30);will-change:transform;visibility:hidden}
#jstripes .stripe::after{content:'';position:absolute;inset:0;opacity:.5;mix-blend-mode:multiply;
  background-image:radial-gradient(rgba(49,40,59,.05) 1px,transparent 1.4px);background-size:5px 5px}
#jstripes .stripe:nth-child(1){filter:brightness(.90)}
#jstripes .stripe:nth-child(2){filter:brightness(.94)}
#jstripes .stripe:nth-child(3){filter:brightness(.97)}
#jpage{position:absolute;inset:0;overflow-y:auto;overflow-x:hidden;opacity:0;visibility:hidden;color:var(--jink);background:var(--paper)}
#jpage::after{content:'';position:fixed;inset:0;pointer-events:none;opacity:.5;mix-blend-mode:multiply;z-index:1;
  background-image:radial-gradient(rgba(49,40,59,.05) 1px,transparent 1.4px);background-size:5px 5px}
.jcol{max-width:940px;margin:0 auto;padding:4.4rem 1.5rem 4rem;position:relative;z-index:2}
#jback{position:fixed;top:1rem;left:1rem;z-index:35;border:2px solid var(--jink);background:var(--paper);color:var(--jink);
  font-weight:900;font-size:.8rem;border-radius:999px;padding:.55rem 1rem;box-shadow:4px 4px 0 rgba(49,40,59,.9);opacity:0;visibility:hidden}
.mast{border-bottom:var(--jrule);padding-bottom:1rem;text-align:center;position:relative}
.mast .over{display:flex;justify-content:space-between;font-weight:800;font-size:.62rem;letter-spacing:.14em;text-transform:uppercase;color:var(--jink-soft);margin-bottom:.6rem}
.mast h1{font-family:var(--serif);font-style:italic;font-weight:900;font-size:clamp(2.2rem,6.4vw,4.4rem);line-height:.95;letter-spacing:-.01em}
.mast h1 .plq{display:inline-block;width:.5em;height:.5em;background:var(--jgreen);transform:rotate(45deg) translateY(-4%);border-radius:.09em;margin:0 .1em}
.stampMini{position:absolute;right:0;top:-1.3rem;transform:rotate(-11deg) scale(0);font-family:var(--serif);font-style:italic;font-weight:900;
  font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;color:var(--stamp);border:3px double var(--stamp);border-radius:10px;padding:.32rem .65rem;opacity:.85}
.stampMini::after{content:'';position:absolute;inset:0;background-image:var(--stampgrunge);background-size:220px;border-radius:8px}
.jnav{display:flex;justify-content:center;gap:.4rem;flex-wrap:wrap;border-bottom:var(--jrule);padding:.6rem 0}
.jnav button{border:2px solid transparent;background:transparent;font-weight:900;font-size:.68rem;letter-spacing:.1em;text-transform:uppercase;color:var(--jink);padding:.35rem .7rem;border-radius:999px}
.jnav button.active{border-color:var(--jink);background:#fff;box-shadow:3px 3px 0 var(--paper-2)}
.kick{font-weight:900;font-size:.64rem;letter-spacing:.16em;text-transform:uppercase;color:var(--rose)}
.jh2{font-family:var(--serif);font-weight:700;font-size:clamp(1.4rem,3vw,2.2rem);line-height:1.08;margin:.4rem 0 .7rem}
.jh2 .mark{position:relative;font-style:italic;font-weight:900}
.jh2 .mark svg{position:absolute;left:-2%;bottom:-.26em;width:104%;height:.5em;overflow:visible}
.jh2 .mark path{fill:none;stroke:var(--jgreen);stroke-width:5;stroke-linecap:round}
.jtxt{font-size:.96rem;line-height:1.72;font-weight:600;color:#4a4058}
.jtxt.dropcap::first-letter{font-family:var(--serif);font-weight:900;font-style:italic;float:left;font-size:3em;line-height:.84;padding:.04em .12em 0 0;color:var(--rose)}
.jfig{border:var(--jrule);background:#fff;padding:.6rem;box-shadow:8px 8px 0 var(--paper-2),8px 8px 0 2px var(--jink)}
.jfig .ph{aspect-ratio:16/10;display:flex;align-items:center;justify-content:center;font-size:3.2rem;position:relative;overflow:hidden;background:linear-gradient(160deg,#f7cfd8,#cfe8db 70%)}
.jfig .ph::after{content:'';position:absolute;inset:0;background:repeating-linear-gradient(0deg,rgba(49,40,59,.06) 0 1px,transparent 1px 3px)}
.jfig figcaption{padding:.45rem .15rem 0;font-size:.66rem;font-weight:700;font-style:italic;color:var(--jink-soft)}
.jsec{font-family:var(--serif);font-style:italic;font-weight:900;font-size:1.3rem;margin:1.7rem 0 .7rem}
.topics{display:flex;gap:.4rem;flex-wrap:wrap;margin:.2rem 0 1rem}
.topics button{border:2px solid var(--jink);background:transparent;font-weight:900;font-size:.66rem;letter-spacing:.06em;text-transform:uppercase;color:var(--jink);padding:.3rem .65rem;border-radius:999px}
.topics button.active{background:var(--jink);color:var(--paper)}
.newsgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:1.3rem}
.newscard{border:var(--jrule);background:#fff;box-shadow:6px 6px 0 var(--paper-2),6px 6px 0 2px var(--jink);
  padding:.9rem;text-align:left;cursor:pointer;position:relative}
.newscard:hover{transform:translate(-2px,-2px);box-shadow:8px 8px 0 var(--paper-2),8px 8px 0 2px var(--jink)}
.newscard .nk{display:flex;gap:.4rem;align-items:center;font-weight:900;font-size:.58rem;letter-spacing:.12em;text-transform:uppercase}
.newscard .nk .tp{color:var(--rose)}
.newscard .nk .rd{margin-left:auto;color:var(--jink-soft)}
.newscard h4{font-family:var(--serif);font-weight:700;font-size:1.05rem;line-height:1.15;margin:.4rem 0}
.newscard p{font-size:.78rem;line-height:1.55;font-weight:600;color:#4a4058}
.newscard .fam{margin-top:.5rem;font-weight:900;font-size:.66rem;color:var(--jgreen)}
#jArticle .abody{font-size:1rem;line-height:1.8;font-weight:600;color:#4a4058;white-space:pre-line}
.jbtn{border:2px solid var(--jink);background:#fff;font-weight:900;font-size:.72rem;letter-spacing:.06em;text-transform:uppercase;color:var(--jink);padding:.45rem .9rem;border-radius:999px;box-shadow:3px 3px 0 var(--paper-2)}
.inkbar{display:grid;grid-template-columns:130px 1fr 44px;gap:.8rem;align-items:center;margin-bottom:.55rem}
.inkbar .lb{font-weight:900;font-size:.78rem}
.inkbar svg{width:100%;height:12px;overflow:visible}
.inkbar .rail{stroke:#d8c6bb;stroke-width:2;stroke-dasharray:2 6;stroke-linecap:round}
.inkbar .ink{stroke:var(--jink);stroke-width:6;stroke-linecap:round}
.inkbar:nth-child(2) .ink{stroke:var(--jgreen)}.inkbar:nth-child(3) .ink{stroke:var(--rose)}.inkbar:nth-child(4) .ink{stroke:var(--mustard)}
.inkbar:nth-child(5) .ink{stroke:#5a7fd0}
.inkbar .v{font-family:var(--serif);font-weight:900;font-style:italic;text-align:right;font-size:.88rem}
.jfoot{text-align:center;color:var(--jink-soft);font-weight:800;font-size:.66rem;letter-spacing:.12em;text-transform:uppercase;margin-top:2.2rem}
#stampWrap{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;pointer-events:none;z-index:3}
#stamp{position:relative;font-family:var(--serif);font-style:italic;font-weight:900;font-size:clamp(1.5rem,5vw,3rem);letter-spacing:.12em;text-transform:uppercase;
  color:var(--stamp);border:6px double var(--stamp);border-radius:18px;padding:.9rem 2rem;transform:rotate(-8deg) scale(2.4);opacity:0;will-change:transform,opacity}
#stamp::after{content:'';position:absolute;inset:-6px;background-image:var(--stampgrunge);background-size:220px;border-radius:18px}
#stamp small{display:block;text-align:center;font-size:.32em;letter-spacing:.3em;margin-top:.2em}
#inkring{position:absolute;width:44vmin;height:44vmin;border-radius:50%;border:3px solid rgba(194,64,63,.55);opacity:0;transform:scale(.5)}
#jcollage{position:absolute;inset:0;pointer-events:none;z-index:2}
.snip{position:absolute;background:#fff;border:var(--jrule);padding:.75rem .9rem;box-shadow:8px 8px 0 var(--paper-2),8px 8px 0 2px var(--jink);color:var(--jink);opacity:0;will-change:transform,opacity}
.snip .k{font-weight:900;font-size:.58rem;letter-spacing:.16em;text-transform:uppercase;color:var(--rose)}
.snip h3{font-family:var(--serif);font-style:italic;font-weight:900;line-height:1.05}
.snipMast{left:9%;top:6%;width:82%;text-align:center;padding:.9rem}
.snipMast h3{font-size:clamp(1.5rem,4.4vw,2.9rem)}
.snipMast h3 .plq{display:inline-block;width:.5em;height:.5em;background:var(--jgreen);transform:rotate(45deg);border-radius:.09em;margin:0 .12em}
.snipHead{left:8%;top:27%;width:44%}
.snipHead h3{font-size:clamp(1rem,2.4vw,1.7rem);margin-top:.3rem}
.snipPh{right:8%;top:27%;width:29%;padding:.5rem}
.snipPh .ph{aspect-ratio:16/11;display:flex;align-items:center;justify-content:center;font-size:2.6rem;position:relative;overflow:hidden;background:linear-gradient(160deg,#f7cfd8,#cfe8db 70%)}
.snipPh .ph::after{content:'';position:absolute;inset:0;background:repeating-linear-gradient(0deg,rgba(49,40,59,.06) 0 1px,transparent 1px 3px)}
.snipTxt{left:8%;top:57%;width:33%;font-size:.72rem;line-height:1.55;font-weight:600;color:#4a4058}
.snipStory{left:44.5%;top:57%;width:24%}
.snipStory h4{font-family:var(--serif);font-weight:700;font-size:.9rem;line-height:1.15;margin:.3rem 0}
.snipStory p{font-size:.68rem;line-height:1.5;font-weight:600;color:#4a4058}
.snipBars{right:8%;top:57%;width:21%}
.snipBars .bt{font-family:var(--serif);font-style:italic;font-weight:900;font-size:.86rem;margin-bottom:.35rem}
.snipBars .mb{height:7px;border-radius:4px;background:var(--jink);margin:.32rem 0}
.snipBars .mb.g{background:var(--jgreen);width:72%}
.snipBars .mb.r{background:var(--rose);width:46%}
.snipBars .mb.m{background:var(--mustard);width:28%}

/* ── Intro / HUD / Fallback ── */
#intro{position:fixed;inset:0;z-index:40;display:flex;align-items:center;justify-content:center;background:linear-gradient(180deg,#ffd9a8,#a9dcf5 60%);pointer-events:none}
#intro .t{text-align:center;font-family:var(--display);font-weight:600;color:#0b6ea8;font-size:clamp(1.4rem,4.2vw,2.4rem);text-shadow:0 2px 0 #fff}
#intro .t small{display:block;font-family:var(--body);font-weight:800;font-size:.92rem;color:#3f7ba0;margin-top:.5rem}
#skip{position:fixed;bottom:1.2rem;right:1.3rem;z-index:41;border:none;background:rgba(255,255,255,.92);border-radius:999px;padding:.55rem 1.05rem;font-weight:900;color:var(--ink);box-shadow:0 8px 20px rgba(10,60,100,.25)}
.hud{position:fixed;left:1rem;bottom:1rem;z-index:32;display:flex;gap:.5rem;align-items:center;flex-wrap:wrap}
.badge{background:#0e3550;color:#bfe9ff;font-weight:900;font-size:.7rem;border-radius:999px;padding:.5rem .9rem;letter-spacing:.04em}
.tierbox{display:flex;gap:.2rem;background:rgba(255,255,255,.92);border-radius:999px;padding:.26rem;box-shadow:0 8px 20px rgba(10,60,100,.25)}
.tierbox button{border:none;background:transparent;border-radius:999px;padding:.36rem .66rem;font-weight:900;font-size:.7rem;color:var(--ink-soft)}
.tierbox button.on{background:#0e3550;color:#fff}
#fallback{display:none;position:fixed;inset:0;z-index:8;align-items:center;justify-content:center;text-align:center;padding:1.5rem}
#fallback .box{max-width:560px;background:rgba(255,255,255,.92);border-radius:28px;padding:2rem;box-shadow:0 20px 50px rgba(10,60,100,.3)}
#fallback h2{font-family:var(--display);font-weight:600;margin-bottom:.6rem}
#fallback p{font-weight:700;color:var(--ink-soft)}
#fallback .pb2d{width:44px;height:44px;margin:0 auto 1rem;border-radius:10px}
#fallback button{margin:1rem .25rem 0;border:none;border-radius:16px;padding:.75rem 1.2rem;font-weight:900;color:#fff;background:linear-gradient(120deg,#37c1ee,#2fd07f)}
.filters{position:absolute;width:0;height:0;overflow:hidden}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}
@media (max-width:820px){
  .jcol{padding:4.4rem 1rem 3rem}
}


/* ══ ZEITUNGS-AUFKLAPPEN — 3D-Falz-Flip mit Fake-Motion-Blur ══
   Perspektive liegt INNERHALB der gefilterten Bühne (#npStage bekommt
   den Blur-Puls als „Post-Processing"), dadurch bleibt das 3D intakt.
   Kein SVG-Filter, kein Canvas — nur Compositor-freundliche Transforms. */
#jcollage{display:none!important}
#npStage{position:absolute;inset:0;z-index:6;display:none;overflow:hidden;will-change:filter}
#npStage .np-dim{position:absolute;inset:0;background:rgba(24,14,34,.34);opacity:0}
#npPivot{position:absolute;inset:0;perspective:1500px;perspective-origin:50% 56%}
#np{position:absolute;left:50%;top:50%;width:104vw;height:104vh;margin:-52vh 0 0 -52vw;
  transform-style:preserve-3d;will-change:transform}
#np .np-page,#np .np-face{background:var(--paper)}
#np .np-page::after,#np .np-face::after{content:'';position:absolute;inset:0;opacity:.5;mix-blend-mode:multiply;
  background-image:radial-gradient(rgba(49,40,59,.05) 1px,transparent 1.4px);background-size:5px 5px}
#np .np-page{position:absolute;top:0;bottom:0;width:50%;box-shadow:0 30px 90px rgba(20,10,30,.5)}
#np .np-pl{left:0}
#np .np-pl .np-ghosttext{position:absolute;inset:9% 11%;opacity:.45;
  background:repeating-linear-gradient(180deg,rgba(49,40,59,.12) 0 3px,transparent 3px 15px)}
#np .np-spine{position:absolute;top:-1%;bottom:-1%;left:50%;width:14vw;margin-left:-7vw;pointer-events:none;transform:translateZ(2px);
  background:linear-gradient(90deg,transparent,rgba(49,40,59,.30) 50%,transparent)}
.np-cover{position:absolute;top:0;bottom:0;left:0;width:50%;transform-origin:100% 62%;
  transform-style:preserve-3d;z-index:3}
.np-seg{position:absolute;top:0;bottom:0;transform-style:preserve-3d}
.np-si{right:0;width:50%}
.np-so{left:0;width:50%;transform-origin:100% 50%}
.np-face{position:absolute;inset:0;backface-visibility:hidden;-webkit-backface-visibility:hidden;overflow:hidden}
.np-back{transform:rotateY(180deg)}
.np-back::before{content:'';position:absolute;inset:0;background:linear-gradient(90deg,rgba(49,40,59,.14),transparent 32%)}
/* Titelblatt-Gestaltung (über beide Segmente verteilt, Knick = echte Falz) */
.np-front{box-shadow:inset -14px 0 26px -18px rgba(49,40,59,.35)}
.np-mast{position:absolute;top:6%;left:10%;right:6%;color:var(--jink)}
.np-mast .k{font-size:clamp(.5rem,1vw,.72rem);font-weight:900;letter-spacing:.28em;text-transform:uppercase;color:var(--jink-soft)}
.np-mast .t{font-family:var(--serif);font-style:italic;font-weight:900;font-size:clamp(1.2rem,3.4vw,2.6rem);line-height:1;
  border-bottom:3px solid var(--jink);padding-bottom:.35rem}
.np-hl{position:absolute;top:34%;left:10%;right:8%;font-family:var(--serif);font-weight:700;color:var(--jink);
  font-size:clamp(.85rem,2.1vw,1.55rem);line-height:1.12}
.np-flines{position:absolute;left:10%;right:8%;top:52%;bottom:12%;opacity:.55;
  background:repeating-linear-gradient(180deg,rgba(49,40,59,.16) 0 3px,transparent 3px 13px)}
.np-ph{position:absolute;top:12%;left:8%;right:12%;height:44%;border:2px solid var(--jink);border-radius:8px;
  box-shadow:4px 4px 0 rgba(49,40,59,.75);background:#efe3d2;display:flex;align-items:center;justify-content:center;
  font-size:clamp(2rem,6vw,4.5rem);overflow:hidden}
.np-ph img{width:100%;height:100%;object-fit:cover}
.np-ilines{position:absolute;left:8%;right:12%;top:62%;bottom:10%;opacity:.55;
  background:repeating-linear-gradient(180deg,rgba(49,40,59,.16) 0 3px,transparent 3px 13px)}
.np-price{position:absolute;bottom:4%;left:10%;font-size:.6rem;font-weight:900;letter-spacing:.2em;color:var(--jink-soft)}
/* Titelblatt: Logo + Datum/Uhrzeit; Klappseiten: Zufalls-Archivinhalt */
.npq{display:inline-block;width:.48em;height:.48em;background:var(--jgreen);transform:rotate(45deg) translateY(-4%);border-radius:.09em;margin:0 .12em}
.np-date{position:absolute;top:36%;left:10%;right:8%;color:var(--jink);font-weight:800;font-size:clamp(.7rem,1.5vw,1.05rem)}
.np-date b{font-family:var(--serif);font-style:italic;font-weight:900;display:block;font-size:1.35em;margin-bottom:.15em}
.np-bhead{position:absolute;top:7%;left:10%;right:10%;font-family:var(--serif);font-style:italic;font-weight:900;color:var(--jink);
  font-size:clamp(.9rem,2vw,1.4rem);border-bottom:2px solid var(--jink);padding-bottom:.25rem}
.np-bfact{position:absolute;top:20%;left:10%;right:10%;color:#4a4058;font-weight:700;line-height:1.5;
  font-size:clamp(.68rem,1.5vw,1rem)}
.np-bfact .k{display:block;font-size:.68em;font-weight:900;letter-spacing:.2em;text-transform:uppercase;color:var(--rose);margin-bottom:.3em}
.np-bfact.big{font-size:clamp(.8rem,1.9vw,1.2rem)}
.np-bimg{position:absolute;left:10%;right:14%;top:46%;height:34%;border:2px solid var(--jink);border-radius:8px;
  box-shadow:4px 4px 0 rgba(49,40,59,.7);background:#efe3d2;display:flex;align-items:center;justify-content:center;
  font-size:clamp(1.6rem,4vw,3rem);overflow:hidden;transform:rotate(-1.5deg)}
.np-bimg.tall{top:20%;height:44%}
.np-bimg.tall~.np-bfact{top:70%}
.np-bimg img{width:100%;height:100%;object-fit:cover}
.np-ghosttext.short{top:auto;bottom:4%;height:8%}
/* Insel-Navigation (2er-Ansicht + Gesamtübersicht) */
#archNav{position:fixed;bottom:1.1rem;left:50%;transform:translateX(-50%);z-index:11;display:none;align-items:center;gap:.45rem;
  background:rgba(14,53,80,.82);backdrop-filter:blur(8px);border-radius:999px;padding:.35rem .5rem;color:#fff;
  box-shadow:0 10px 30px rgba(8,45,75,.4)}
body.night #archNav{background:rgba(18,24,54,.85)}
#archNav button{border:none;border-radius:999px;background:rgba(255,255,255,.14);color:#fff;font-weight:900;cursor:pointer;
  height:34px;min-width:34px;font-size:1rem;padding:0 .6rem}
#archNav button:disabled{opacity:.3;cursor:default}
#archNav #archAll.on{background:var(--plumb);color:#06371f}
#archNav #archLbl{font-size:.72rem;font-weight:900;letter-spacing:.05em;min-width:4.5rem;text-align:center}
/* Ghost-Trails: hinterherklappende Papier-Kopien = gerichteter Schmier */
.np-ghost{position:absolute;top:0;bottom:0;left:0;width:50%;transform-origin:100% 62%;
  background:var(--paper);opacity:0;pointer-events:none;box-shadow:0 18px 55px rgba(20,10,30,.3)}

/* ══ BETA-ERGÄNZUNGEN ══ */
#betaTag{position:fixed;top:0;right:0;z-index:80;background:#e2607f;color:#fff;font-weight:900;
  font-size:.6rem;letter-spacing:.16em;padding:.3rem 2.2rem;transform:rotate(45deg) translate(28%,-10%);
  transform-origin:top right;box-shadow:0 2px 8px rgba(0,0,0,.25);pointer-events:none}
.avimg{width:100%;height:100%;object-fit:cover;border-radius:inherit;display:block}
#panel .sav{overflow:hidden}
#panel .th img{width:100%;height:100%;object-fit:cover;border-radius:inherit;display:block}
#snipPh img{width:100%;height:100%;object-fit:cover;border-radius:inherit;display:block}
.jfig .covimg{width:100%;border-radius:12px;border:2px solid var(--jink);box-shadow:5px 5px 0 rgba(49,40,59,.85);display:block}
.newscard .ncov{width:100%;height:120px;border-radius:9px;overflow:hidden;margin-bottom:.55rem;border:2px solid rgba(49,40,59,.8)}
.newscard .ncov img{width:100%;height:100%;object-fit:cover;display:block}
.newscard .ccount{margin-left:auto;font-weight:900;font-size:.62rem;color:var(--jink-soft)}
/* News-Body: serverseitig sanitisiertes HTML im Zeitungs-Look */
.abody.nbody{font-size:.96rem;line-height:1.72;font-weight:600;color:#4a4058}
.abody.nbody p{margin:.75em 0}
.abody.nbody h2,.abody.nbody h3,.abody.nbody h4{font-family:var(--serif);font-weight:700;line-height:1.15;margin:1.1em 0 .4em;color:var(--jink)}
.abody.nbody h2{font-size:1.5rem}.abody.nbody h3{font-size:1.2rem}.abody.nbody h4{font-size:1.02rem}
.abody.nbody img{max-width:100%;height:auto;border-radius:10px;border:2px solid var(--jink);box-shadow:4px 4px 0 rgba(49,40,59,.85);margin:.5em 0}
.abody.nbody blockquote{margin:1em 0;padding:.5em 1em;border-left:4px solid var(--jgreen);font-style:italic;background:rgba(49,40,59,.05);border-radius:0 8px 8px 0}
.abody.nbody ul,.abody.nbody ol{padding-left:1.4em;margin:.75em 0}
.abody.nbody li{margin:.25em 0}
.abody.nbody a{color:var(--rose);font-weight:800;text-decoration:underline}
/* Kommentare */
.csec{margin-top:2rem;border-top:var(--jrule);padding-top:1.2rem}
.cmt{border:2px solid rgba(49,40,59,.75);border-radius:12px;padding:.75rem .9rem;margin-bottom:.6rem;background:rgba(255,255,255,.55)}
.cmt .ch{display:flex;justify-content:space-between;gap:.6rem;font-size:.72rem;margin-bottom:.3rem}
.cmt .ch b{font-weight:900;color:var(--jink)}
.cmt .ch span{color:var(--jink-soft);font-weight:700}
.cmt .cb{font-size:.9rem;font-weight:600;line-height:1.55;color:#4a4058;word-break:break-word}
#cform{margin-top:1rem}
#cform .crow{margin-bottom:.6rem;display:flex;gap:.7rem;align-items:center;flex-wrap:wrap}
#cform input[type=text],#cform textarea{width:100%;border:2px solid var(--jink);border-radius:10px;background:#fff;
  padding:.6rem .8rem;font:inherit;font-weight:600;font-size:.9rem;color:var(--jink)}
#cform textarea{resize:vertical;min-height:90px}
#cform .cnote{font-size:.7rem;font-weight:800;color:var(--jink-soft)}
#cform .hpot{position:absolute!important;left:-9999px!important;width:1px;height:1px;opacity:0;pointer-events:none}
.cmsg{font-size:.8rem;font-weight:800;min-height:1.2em;margin-top:.3rem}
.cmsg.ok{color:#1d7a4f}.cmsg.err{color:#b3261e}
/* Lightbox (Galerie) */
#lbx{position:fixed;inset:0;z-index:90;background:rgba(10,8,20,.88);display:none;align-items:center;justify-content:center;cursor:zoom-out}
#lbx.open{display:flex}
#lbx img{max-width:92vw;max-height:88vh;border-radius:12px;box-shadow:0 20px 80px rgba(0,0,0,.6)}
/* Lade-/Wartungs-/Fehler-Schirm */
#bootMsg{position:fixed;inset:0;z-index:85;display:none;align-items:center;justify-content:center;background:linear-gradient(180deg,#bfe7ff,#eafaf0);padding:1.5rem}
#bootMsg .bx{background:#fff;border-radius:22px;padding:2rem;max-width:420px;text-align:center;box-shadow:0 18px 60px rgba(20,40,80,.2)}
#bootMsg h2{font-family:var(--serif);font-style:italic;font-weight:900;margin:0 0 .5rem;color:#123a52}
#bootMsg p{font-weight:700;color:#3d5a70;font-size:.9rem;margin:0 0 1rem}
#bootMsg input{width:100%;border:2px solid #123a52;border-radius:10px;padding:.6rem .8rem;font:inherit;font-weight:700;margin-bottom:.7rem}
#bootMsg button{border:0;background:#2fd07f;color:#0b3524;font-weight:900;font-size:.9rem;padding:.65rem 1.4rem;border-radius:999px;cursor:pointer}


/* ══ INTEGRATION: 3D als Vollbild-Ebene, alter Seiten-Himmel scheint durch ══ */
#v3d{position:fixed;inset:0;z-index:4;overflow:hidden;background:transparent}
#v3d #skyDay{display:none}
#v3d #skyNight{position:absolute;inset:0}
#v3d #c3d{position:absolute;inset:0;width:100%;height:100%;display:block}
#v3d .hud{position:absolute;top:auto;left:auto;right:1rem;bottom:8.6rem;z-index:6;
  opacity:0;transform:translateY(14px) scale(.96);pointer-events:none;
  transition:opacity .3s,transform .35s cubic-bezier(.34,1.4,.64,1)}
body.dockset-open #v3d .hud{opacity:1;transform:none;pointer-events:auto}
#v3d .hint{position:absolute;bottom:4.9rem;left:50%;transform:translateX(-50%);z-index:6}
body.beta-3dmode{overflow:hidden}
/* Alte Kopfleiste ÜBER der Fixed-Ebene halten (Stacking-Context von .app) */
body.beta-3dmode .app{position:relative;z-index:12;pointer-events:none}
body.beta-3dmode .app .topbar{pointer-events:auto;background:rgba(255,255,255,.55);backdrop-filter:blur(10px);border-radius:22px;margin-top:.4rem;padding-left:1rem;padding-right:1rem}
body.beta-3dmode #crumbs,body.beta-3dmode .footer,body.beta-3dmode .sky-deco{display:none}
#archDock{position:fixed;right:1rem;bottom:1rem;z-index:14;display:none;flex-direction:column;align-items:flex-end;gap:.55rem}
#archDock .dockRow{display:flex;gap:.55rem}
#dockBtn,#dockGear{width:52px;height:52px;border-radius:50%;border:2px solid rgba(49,40,59,.75);
  background:rgba(255,255,255,.85);backdrop-filter:blur(8px);font-size:1.3rem;cursor:pointer;
  box-shadow:0 10px 26px rgba(10,60,100,.28);transition:transform .3s cubic-bezier(.34,1.4,.64,1)}
#dockBtn:hover,#dockGear:hover{transform:scale(1.1)}
body.dockmenu-open #dockBtn{transform:rotate(90deg)}
body.dockset-open #dockGear{transform:rotate(60deg)}
#dockMenu{display:flex;flex-direction:column;gap:.4rem;align-items:flex-end}
#dockMenu button,#dockMenu #archLbl{opacity:0;transform:translateY(16px) scale(.92);pointer-events:none;
  transition:opacity .28s,transform .4s cubic-bezier(.34,1.4,.64,1);
  border-radius:999px;padding:.5rem 1.05rem;border:2px solid rgba(49,40,59,.7);
  background:rgba(255,255,255,.88);backdrop-filter:blur(8px);font-weight:900;cursor:pointer;
  font-size:.92rem;box-shadow:0 8px 20px rgba(10,60,100,.22)}
#dockMenu #archLbl{font-size:.78rem;padding:.3rem .9rem;background:rgba(49,40,59,.82);color:#fff;cursor:default}
body.dockmenu-open #dockMenu button,body.dockmenu-open #dockMenu #archLbl{opacity:1;transform:none;pointer-events:auto}
#dockMenu>*:nth-child(2){transition-delay:.03s}#dockMenu>*:nth-child(3){transition-delay:.06s}
#dockMenu>*:nth-child(4){transition-delay:.09s}#dockMenu>*:nth-child(5){transition-delay:.12s}
#dockMenu>*:nth-child(6){transition-delay:.15s}
#dockMenu button:disabled{opacity:.35!important;cursor:default}
#archGrave.on{background:#e2607f!important;color:#fff}
#archAll.on{background:rgba(49,40,59,.85)!important;color:#fff}
#betaTag{position:fixed;top:4.9rem;right:12px;left:auto;bottom:auto;width:auto;height:auto;
  transform:none;background:#e2607f;color:#fff;font-weight:900;letter-spacing:.16em;
  font-size:.7rem;padding:.32rem .75rem;border-radius:999px;border:2px solid rgba(49,40,59,.6);
  box-shadow:0 6px 16px rgba(226,96,127,.5);z-index:15;pointer-events:none;text-align:center;line-height:1}
