@font-face{font-family:Crimson;src:url(schriften/CrimsonText-Regular.ttf) format("truetype");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:Crimson;src:url(schriften/CrimsonText-Italic.ttf) format("truetype");font-weight:400;font-style:italic;font-display:swap}
@font-face{font-family:Crimson;src:url(schriften/CrimsonText-SemiBold.ttf) format("truetype");font-weight:600;font-style:normal;font-display:swap}
:root{--nacht:#14243b;--hell:#f4eedf;--hell2:#d9d2c0;--gold:#e2b354;--papier:#f4eedf;--papier2:#ebe3d0;--karte:#14243b;
--text:#1d2533;--leise:#5b6270;--linie:#d6ccb6;--link:#1d4f86;--golddunkel:#7d5a1a;--fokus:#1d4f86;
--b-fern:#30476a;--b-fernschnee:#5d7393;--b-mitte:#c9c0ad;--b-schnee:#f4eedf;--b-see:#1d3150;
--rund:10px;--schatten:0 1px 2px rgba(20,36,59,.10),0 12px 28px -10px rgba(20,36,59,.35);color-scheme:light dark}
@media (prefers-color-scheme:dark){:root{--papier:#0f1828;--papier2:#18243a;--karte:#16263f;--text:#ece5d3;--leise:#aab1be;
--linie:#2c3a55;--link:#9cc3f0;--golddunkel:#e2b354;--fokus:#e2b354;--b-mitte:#1c2a42;--b-schnee:#3a4d6e;
--schatten:0 1px 2px rgba(0,0,0,.4),0 12px 28px -10px rgba(0,0,0,.7)}}
*,*::before,*::after{box-sizing:border-box}
html{font-size:112.5%;-webkit-text-size-adjust:100%;text-size-adjust:100%}
@media (prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}
body{margin:0;background:var(--papier);color:var(--text);font-family:Crimson,Georgia,"Times New Roman",serif;line-height:1.55;
font-kerning:normal;font-variant-ligatures:no-common-ligatures;overflow-wrap:break-word}
img,svg{max-width:100%}
a{color:var(--link);text-underline-offset:.16em;text-decoration-thickness:1px}
a:hover{text-decoration-thickness:2px}
:focus-visible{outline:3px solid var(--fokus);outline-offset:2px;border-radius:3px}
.vh{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}
.sprung{position:absolute;left:1rem;top:-5rem;z-index:20;background:var(--gold);color:var(--nacht);padding:.55rem 1rem;
border-radius:0 0 8px 8px;font-weight:600;text-decoration:none}
.sprung:focus{top:0}

/* Seitenkopf: Nachthimmel wie auf dem Cover */
.seitenkopf{position:relative;background:var(--nacht) url(bilder/himmel.svg) center top/1200px auto repeat;color:var(--hell);--fokus:var(--gold)}
.leiste{position:relative;max-width:72rem;margin:0 auto;padding:.8rem 1rem 0;display:flex;flex-wrap:wrap;align-items:center;
gap:.1rem 1.4rem;font-size:.95rem}
.leiste ul{display:flex;flex-wrap:wrap;gap:.1rem 1.3rem;margin:0 0 0 auto;padding:0;list-style:none}
.leiste a{display:inline-block;padding:.4rem 0;color:var(--hell2);text-decoration:none}
.leiste a:hover{color:var(--gold)}
.leiste .marke{font-weight:600;color:var(--hell);letter-spacing:.02em}
.buehne{position:relative;max-width:72rem;margin:0 auto;padding:1.6rem 1rem 0;display:grid;gap:2.4rem;align-items:center}
@media (min-width:720px){.buehne{grid-template-columns:minmax(0,1.3fr) minmax(0,.7fr);gap:2.4rem;padding-top:2.2rem}}
@media (min-width:1040px){.buehne{gap:3.5rem}}
.autor{margin:0;letter-spacing:.34em;color:var(--gold);font-weight:600;font-size:.82rem}
.titelblock h1{margin:.45rem 0 0;font-weight:600;font-size:clamp(3.3rem,12vw,6rem);line-height:.92;letter-spacing:-.01em}
.titelblock h1 .im{display:block;font-weight:400;font-style:italic;font-size:.6em;line-height:1.1;margin-top:.1em;letter-spacing:0}
.trenner{display:flex;align-items:center;gap:.7rem;width:12rem;margin:1.1rem 0 .65rem;color:var(--gold)}
.trenner::before,.trenner::after{content:"";flex:1;height:1px;background:currentColor;opacity:.85}
.trenner svg{width:15px;height:15px;flex:none}
.titelblock .unter{margin:0;font-style:italic;color:var(--gold);font-size:clamp(1.15rem,3.6vw,1.45rem);line-height:1.3}
.titelblock .lead{margin:1.1rem 0 1.5rem;max-width:34rem;color:var(--hell2);font-size:1.08rem}
.schnell{max-width:36rem;padding:1rem 1rem 1.1rem;border:1px solid rgba(226,179,84,.45);border-radius:var(--rund);
background:#213045}
.schnell h2{margin:0;font-size:1.2rem;font-weight:600;color:var(--hell)}
.schnell p{margin:.1rem 0 .8rem;color:var(--hell2);font-size:.95rem}
.tage{list-style:none;margin:0 0 1rem;padding:0;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:.4rem}
@media (min-width:430px){.tage{grid-template-columns:repeat(8,minmax(0,1fr))}}
.tage a{display:flex;align-items:center;justify-content:center;min-height:44px;border:1px solid rgba(244,238,223,.22);
border-radius:8px;background:#303d50;color:var(--hell);text-decoration:none;font-weight:600;font-size:1.1rem;
font-variant-numeric:lining-nums tabular-nums;transition:background-color .15s,color .15s,border-color .15s}
.tage a:hover{background:var(--gold);border-color:var(--gold);color:var(--nacht)}
.knoepfe{display:flex;flex-wrap:wrap;gap:.6rem}
.knopf{display:inline-flex;align-items:center;min-height:44px;padding:.4rem 1.2rem;border:1px solid var(--gold);border-radius:999px;
background:var(--gold);color:var(--nacht);font-weight:600;text-decoration:none}
.knopf:hover{background:#efc875;border-color:#efc875}
.knopf.zart{background:transparent;border-color:rgba(244,238,223,.5);color:var(--hell)}
.knopf.zart:hover{border-color:var(--gold);color:var(--gold)}
.heute{margin:1rem 0 0;color:var(--hell2)}
.heute a{color:var(--gold);font-weight:600}
.cover{margin:0;justify-self:center}
.cover img{display:block;width:clamp(190px,50vw,330px);height:auto;border-radius:2px 5px 5px 2px;transform:rotate(1.2deg);
box-shadow:0 2px 4px rgba(0,0,0,.35),0 24px 50px -14px rgba(0,0,0,.65)}
.band{position:relative;display:block;width:100%;height:auto;aspect-ratio:8/1;min-height:86px;margin:1.4rem 0 -1px}
.seitenkopf.schmal .band{aspect-ratio:13/1;min-height:58px;margin-top:.6rem}
.b-fern{fill:var(--b-fern)}.b-fernschnee{fill:var(--b-fernschnee)}.b-mitte{fill:var(--b-mitte)}.b-schnee{fill:var(--b-schnee)}
.b-vorn{fill:var(--papier)}.b-vorn-strich{stroke:var(--papier)}.b-see{fill:var(--b-see)}.b-licht{fill:#f0c35e}.b-nacht{fill:var(--nacht)}

/* Abschnitte */
.abschnitt{max-width:72rem;margin:0 auto;padding:3rem 1rem}
.vorspann{margin:0;letter-spacing:.2em;text-transform:uppercase;font-size:.78rem;font-weight:600;color:var(--golddunkel)}
.abschnitt h2{margin:.15rem 0 .7rem;font-weight:600;font-size:clamp(1.8rem,5vw,2.5rem);line-height:1.15}
.einleitung{max-width:46rem;margin:0 0 1.8rem;font-size:1.08rem}

/* Adventkalender */
.kalender{list-style:none;margin:0;padding:0;display:grid;gap:.8rem;grid-template-columns:repeat(2,minmax(0,1fr))}
@media (min-width:640px){.kalender{grid-template-columns:repeat(3,minmax(0,1fr));gap:1.1rem}}
@media (min-width:1040px){.kalender{grid-template-columns:repeat(4,minmax(0,1fr));gap:1.3rem}}
.karte{position:relative;display:flex;flex-direction:column;overflow:hidden;border-radius:var(--rund);background:var(--karte);
color:var(--hell);box-shadow:var(--schatten);scroll-margin-top:1rem;--fokus:var(--gold)}
@media (prefers-color-scheme:dark){.karte{outline:1px solid var(--linie);outline-offset:-1px}}
.karte .bild{display:block;overflow:hidden;line-height:0}
.karte .bild img{display:block;width:100%;height:auto;aspect-ratio:1600/1063;object-fit:cover;transition:transform .35s ease}
.karte .bild:hover img{transform:scale(1.035)}
.karte .bild:focus-visible{outline-offset:-3px}
.karte .nr{position:absolute;z-index:1;top:.5rem;left:.5rem;display:grid;place-items:center;width:2.2rem;height:2.2rem;
border-radius:50%;background:var(--gold);color:var(--nacht);font-weight:600;font-size:1.1rem;line-height:1;
font-variant-numeric:lining-nums;box-shadow:0 2px 6px rgba(0,0,0,.35);pointer-events:none}
.karte .text{display:flex;flex-direction:column;flex:1;padding:.7rem .85rem .85rem;color:var(--hell);text-decoration:none}
.karte .datum{font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;color:var(--gold);font-weight:600}
.karte .titel{margin:.15rem 0 .2rem;font-size:1.08rem;font-weight:600;line-height:1.2}
.karte .unter{color:var(--hell2);font-style:italic;font-size:.92rem;line-height:1.35}
.karte .praxis{display:none;margin-top:.65rem;padding-top:.55rem;border-top:1px solid rgba(244,238,223,.16);color:var(--hell2);
font-size:.88rem;line-height:1.35}
.karte .praxis b{display:block;color:var(--gold);font-weight:600;font-size:.72rem;letter-spacing:.12em;text-transform:uppercase}
.karte .mehr{margin-top:auto;padding-top:.7rem;color:var(--gold);font-weight:600;font-size:.92rem}
.karte .text:hover .titel{text-decoration:underline;text-underline-offset:.15em;text-decoration-thickness:1px}
.karte.ist-heute{outline:3px solid var(--gold);outline-offset:3px}
@media (min-width:640px){.karte .praxis{display:block}.karte .nr{width:2.5rem;height:2.5rem;font-size:1.25rem}
.karte .titel{font-size:1.18rem}.karte .text{padding:.8rem 1rem 1rem}}

/* Quellenverzeichnis */
.statistik{margin:0 0 1rem;color:var(--leise);font-variant-numeric:lining-nums}
.hinweis{max-width:46rem;margin:1rem 0 1.6rem;padding:.8rem 1rem;border-left:3px solid var(--gold);border-radius:0 6px 6px 0;
background:var(--papier2)}
.werkzeug{display:flex;flex-wrap:wrap;gap:.5rem;margin:0 0 .7rem}
.werkzeug[hidden]{display:none}
.werkzeug button{min-height:40px;padding:.3rem 1rem;border:1px solid var(--linie);border-radius:999px;background:transparent;
color:var(--text);font:inherit;font-size:.92rem;cursor:pointer}
.werkzeug button:hover{border-color:var(--golddunkel)}
.liste{max-width:54rem;border-top:1px solid var(--linie)}
details.tag{border-bottom:1px solid var(--linie);scroll-margin-top:.75rem}
details.tag>summary{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:.85rem;padding:.75rem .3rem;
border-radius:6px;cursor:pointer;list-style:none}
details.tag>summary::-webkit-details-marker{display:none}
details.tag>summary:hover,details.tag:target>summary{background:var(--papier2)}
details.tag>summary::after{content:"";width:.55rem;height:.55rem;margin:0 .55rem .3rem;border-right:2px solid var(--golddunkel);
border-bottom:2px solid var(--golddunkel);transform:rotate(45deg);transition:transform .2s}
details.tag[open]>summary::after{transform:rotate(-135deg);margin-bottom:-.2rem}
.tag .nr{display:grid;place-items:center;width:2.4rem;height:2.4rem;border-radius:50%;background:var(--nacht);color:var(--gold);
font-weight:600;font-size:1.1rem;line-height:1;font-variant-numeric:lining-nums}
.tag .nr svg{width:1.05rem;height:1.05rem}
.tag .zeile{display:block}
.tag .datum{display:block;font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;color:var(--golddunkel);font-weight:600}
.tag .titel{display:block;font-size:1.15rem;font-weight:600;line-height:1.25}
.tag .zahl{display:block;font-size:.88rem;color:var(--leise)}
.tag .inhalt{padding:.1rem .3rem 1.4rem 3.55rem}
@media (max-width:600px){.tag .inhalt{padding-left:.3rem}}
.tag h3{margin:1.1rem 0 .35rem;font-size:.8rem;letter-spacing:.14em;text-transform:uppercase;color:var(--leise);font-weight:600}
.tag ol,.tag ul{margin:0;padding-left:1.3rem}
.tag li{margin:.5rem 0;padding-left:.15rem}
.tag ol li::marker{color:var(--golddunkel);font-weight:600}
.tag ul.weitere{padding-left:0;list-style:none}
.tag ul.weitere li{padding-left:0;margin:.7rem 0}
.belegt{display:block;color:var(--leise);font-style:italic;font-size:.95rem;line-height:1.4}
a.url{white-space:nowrap}
.zurueck{margin:1.2rem 0 0;font-size:.92rem}

/* Das Buch */
.buch-raster{display:grid;gap:2rem}
@media (min-width:880px){.buch-raster{grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:3.5rem;align-items:start}}
.buch-text .auftakt{margin-top:0;font-size:1.18rem}
.sterne{list-style:none;margin:1.3rem 0;padding:0}
.sterne li{display:flex;gap:.75rem;margin:.6rem 0}
.sterne svg{flex:none;width:.95rem;height:.95rem;margin-top:.33rem;color:var(--golddunkel)}
.buch-text .ich{margin-top:1.6rem;padding-top:1rem;border-top:1px solid var(--linie);color:var(--leise)}
.steckbrief{padding:1.2rem;border-radius:var(--rund);background:var(--papier2)}
.steckbrief figure{margin:0 0 1.1rem}
.steckbrief img{display:block;width:100%;height:auto;border-radius:4px;background:#fff;box-shadow:0 1px 3px rgba(20,36,59,.18)}
.steckbrief figcaption{margin-top:.5rem;color:var(--leise);font-size:.9rem;font-style:italic}
.steckbrief dl{display:grid;grid-template-columns:auto minmax(0,1fr);gap:.4rem 1rem;margin:0}
.steckbrief dt{font-weight:600}
.steckbrief dd{margin:0}
.steckbrief .knopf{margin-top:1.1rem}
.steckbrief .verlag{margin:1rem 0 0;font-size:.95rem}

/* Fuß */
.fuss{background:var(--nacht);color:var(--hell2);--fokus:var(--gold)}
.fuss .innen{max-width:72rem;margin:0 auto;padding:2.2rem 1rem 2.6rem;font-size:.95rem}
.fuss a{color:var(--hell)}
.fuss .marke{margin:0;color:var(--hell);font-size:1.25rem;font-weight:600}
.fuss p{margin:.3rem 0}
.fuss nav{margin:.9rem 0}
.fuss .klein{max-width:46rem;font-size:.85rem}

/* Textseite (Impressum) */
.textseite{max-width:46rem;margin:0 auto;padding:2.4rem 1rem 3.5rem}
.textseite h1{margin:0 0 1rem;font-size:clamp(2rem,6vw,2.6rem);line-height:1.15;font-weight:600}
.textseite h2{margin:2.1rem 0 .4rem;font-size:1.3rem;font-weight:600}
.textseite .stand{margin-top:2.4rem;color:var(--leise);font-size:.9rem}

/* Tagesseite */
.tagseite h1{margin:.2rem 0 .3rem}
.tagseite .unterzeile{margin:0 0 1.5rem;font-style:italic;color:var(--leise);font-size:1.18rem;line-height:1.35}
.tagbild{margin:0 0 1.5rem}
.tagbild img{display:block;width:100%;height:auto;border-radius:var(--rund);box-shadow:var(--schatten)}
.tagseite .kurz{margin:0 0 .9rem;font-size:1.15rem}
.tagseite .praxis{margin:0;color:var(--leise)}
.tagseite .knoepfe{margin:1.7rem 0 0}
.knopf.rahmen{background:transparent;border-color:var(--golddunkel);color:var(--text)}
.knopf.rahmen:hover{background:transparent;border-color:var(--gold);color:var(--golddunkel)}
.blaettern{display:flex;flex-wrap:wrap;justify-content:space-between;gap:.4rem 1rem;margin:2.6rem 0 0;padding-top:1rem;
border-top:1px solid var(--linie)}
.blaettern a{display:inline-block;padding:.45rem 0}
mark.offen{padding:0 .25em;border-radius:3px;background:#ffe9a8;color:#5a3b00}

/* Bild groß */
.gross{width:min(96vw,1100px);max-width:none;max-height:none;padding:0;border:0;border-radius:var(--rund);background:var(--nacht);
color:var(--hell);box-shadow:0 30px 80px rgba(0,0,0,.6);--fokus:var(--gold)}
.gross::backdrop{background:rgba(8,14,26,.84)}
.gross img{display:block;width:100%;height:auto;max-height:calc(100vh - 10rem);object-fit:contain}
.gross .unterschrift{display:flex;flex-wrap:wrap;justify-content:space-between;gap:.3rem 1rem;margin:0;padding:.75rem 1rem 0}
.gross .unterschrift span{font-weight:600}
.gross a{color:var(--gold)}
.gross .steuer{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:.5rem;padding:.7rem 1rem 1rem}
.gross button{min-height:44px;padding:.3rem 1.1rem;border:1px solid rgba(244,238,223,.45);border-radius:999px;background:transparent;
color:var(--hell);font:inherit;cursor:pointer}
.gross button:hover{border-color:var(--gold);color:var(--gold)}

@media (prefers-reduced-motion:reduce){*,*::before,*::after{transition:none!important;animation:none!important}}
@media print{
.leiste,.schnell,.heute,.cover,.band,#kalender,#buch,.werkzeug,.sprung,.zurueck,.gross{display:none!important}
body,.seitenkopf,.fuss{background:#fff!important;color:#000!important}
.titelblock .autor,.titelblock h1,.titelblock .unter,.titelblock .lead,.fuss a,a{color:#000!important}
a.url{white-space:normal}
a.url::after{content:" " attr(href);font-size:.85em;word-break:break-all}
details.tag>summary::after{display:none}
.tag .nr{border:1px solid #000;background:none;color:#000}
}