:root[data-story="sturmfels"]{
  color-scheme:dark;--d-bg:#102833;--d-bg-image:radial-gradient(ellipse at 10% 0%,#285562,transparent 55%);--d-bg-size:auto;
  --d-ink:#f8edcf;--d-ink-soft:#bcd0cf;--d-surface:#173945;--d-surface-2:#234c58;--d-line:#597578;
  --d-honig:#eac178;--d-btn-bg:#ebc784;--d-btn-ink:#283d3f;--d-focus:#ffda80;
  --d-paper:#f7edda;--d-paper-shade:#e8d8b9;--d-paper-ink:#293b3e;--d-paper-muted:#58635e;--d-paper-line:#cabb9c;
  --d-overlay:rgba(3,19,26,.75);--d-white:#fffaf0;--d-shadow:rgba(0,10,18,.3);--d-visited:#278149;--d-leaf:#79a54a;--d-water:#9bdde8;--d-trail:#bf302c;--d-pin:#bb332c;--d-pin-shade:#7c2925;--d-steel:#b9c4c8;--d-flag-black:#161616;--d-flag-red:#c63b38;--d-flag-gold:#f1c24d;--d-flag-blue:#244b77;--d-flag-white:#fffaf4;
  --d-card-bg:linear-gradient(145deg,#21434e,#14343f);--d-card-border:1px solid #537278;--d-card-shadow:0 16px 38px var(--d-shadow);
  --d-gold:#edbe53;--d-wood:#79532f;--d-gem:#3bb5a2;--d-gem2:#dc7459;--text-size:19px;
}
*{box-sizing:border-box}body.atlas{margin:0;font-family:Inter,system-ui,sans-serif;height:100dvh;min-height:0;display:flex;flex-direction:column;overflow:hidden}
.atlas button,.atlas select{font:inherit;min-width:44px;min-height:44px;padding:9px 13px;border:1px solid var(--d-line);border-radius:9px;background:var(--d-surface);color:var(--d-ink);cursor:pointer;-webkit-appearance:none;appearance:none;touch-action:manipulation}
.atlas button:disabled{opacity:.48;cursor:default}.atlas button:focus-visible,.atlas select:focus-visible{outline:3px solid var(--d-focus);outline-offset:3px}
.atlas button:hover:not(:disabled){filter:brightness(1.1)}.atlas button[aria-pressed="true"]{background:var(--d-btn-bg);color:var(--d-btn-ink);border-color:var(--d-honig)}
.atlas .primary{background:var(--d-btn-bg);color:var(--d-btn-ink);font-weight:700;border-color:var(--d-honig)}
[hidden]{display:none!important}.atlas-header{display:flex;justify-content:space-between;gap:16px;align-items:center;padding:16px 25px;border-bottom:1px solid var(--d-line)}
.brand{display:flex;align-items:center;gap:13px;min-width:0}.compass{font-size:42px;color:var(--d-honig);line-height:1}
.eyebrow{font-size:10px;font-weight:700;letter-spacing:.16em;display:block;line-height:1.6}
.brand .eyebrow{color:var(--d-honig)}h1{font-family:Georgia,serif;font-weight:400;font-size:clamp(18px,2.15vw,29px);margin:3px 0 0;line-height:1.2}
.header-actions{display:flex;gap:13px;align-items:center;font-size:11px;flex-shrink:0}.level{padding:7px 10px;border:1px solid var(--d-honig);color:var(--d-honig);border-radius:20px;white-space:nowrap}#account{max-width:95px;line-height:1.5;color:var(--d-ink-soft)}
.atlas-main{display:grid;grid-template-columns:minmax(320px,.78fr) minmax(0,1.4fr);gap:16px;padding:18px 22px 12px;flex:1;min-height:0}
.reading-panel{display:flex;flex-direction:column;min-width:0;min-height:0;background:linear-gradient(110deg,var(--d-paper),var(--d-paper-shade));color:var(--d-paper-ink);border:1px solid var(--d-paper-line);border-radius:12px;box-shadow:var(--d-card-shadow);overflow:hidden}
.reading-toolbar{display:flex;justify-content:space-between;gap:6px;flex-wrap:wrap;padding:10px 16px;border-bottom:1px solid var(--d-paper-line);align-items:center}.reading-toolbar>div{display:flex;gap:4px}
.reading-panel button{color:var(--d-paper-ink);background:transparent;border-color:var(--d-paper-line);font-size:12px}.reading-panel button[aria-pressed="true"]{background:var(--d-paper-ink);color:var(--d-paper)}
.reading-scroll{overflow:auto;padding:25px 28px 32px;flex:1;overscroll-behavior:contain}.chapter-line{display:flex;justify-content:space-between;align-items:center;color:var(--d-paper-muted)}
#chapter-title{font-family:Georgia,serif;font-weight:400;font-size:clamp(27px,2.7vw,36px);line-height:1.18;margin:16px 0 24px;outline:none}
.atlas .reading-panel .fm-tm{--fm-text:var(--d-paper-ink);--fm-akzent:var(--d-paper-ink);font-size:var(--text-size);line-height:1.78;color:var(--d-paper-ink)}
.fm-tm-satz{display:block;margin-bottom:.9em}.fm-tm-satz[data-quote="true"]{padding:12px 17px;border-left:3px solid var(--d-wood);font-family:Georgia,serif;background:var(--d-paper-shade)}
.reading-footer{display:flex;gap:8px;align-items:center;border-top:1px solid var(--d-paper-line);padding:10px 16px;font-size:12px}#reading-position{flex:1;text-align:center}
#chapter-actions{display:grid;gap:10px;margin-top:22px;font-size:14px;line-height:1.6}#chapter-actions button{font-size:14px}.start-choice{display:grid;grid-template-columns:1fr 1fr;gap:8px}.note{font-size:12px;line-height:1.65;color:var(--d-ink-soft)}.reading-panel .note{color:var(--d-paper-muted)}
.map-panel{position:relative;min-width:0;min-height:0;display:flex;flex-direction:column;overflow:hidden;background:var(--d-card-bg);border:var(--d-card-border);border-radius:12px;box-shadow:var(--d-card-shadow)}
.map-toolbar{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 18px}.map-toolbar .eyebrow{color:var(--d-honig)}.map-sub{font-size:11px;color:var(--d-ink-soft)}
.map-viewport{flex:1;min-height:100px;position:relative;overflow:hidden;touch-action:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;background:radial-gradient(ellipse,var(--d-surface-2),var(--d-bg));cursor:grab}.map-viewport[data-placing="true"]{cursor:crosshair}.map-viewport:active{cursor:grabbing}
.map-scene{position:absolute;left:0;top:0;width:1536px;height:1024px;transform-origin:0 0}.map-scene img{display:block;width:1536px;height:1024px;pointer-events:none;-webkit-user-drag:none}.atlas .poi{position:absolute;min-width:44px;width:44px;min-height:44px;height:44px;padding:0;border:0;background:transparent;color:var(--d-paper-ink);font-size:10px;font-weight:700;transform-origin:50% 50%;z-index:1;isolation:isolate}.poi:before{content:"";position:absolute;inset:11px;border-radius:50%;border:1px solid var(--d-wood);background:var(--d-paper);box-shadow:0 2px 5px var(--d-shadow);z-index:-1}.atlas .poi:hover{z-index:3}.poi:focus-visible:before{background:var(--d-honig)}
.atlas .map-pin{position:absolute;z-index:4;width:48px;height:60px;background:transparent;border:0;padding:0;transform-origin:50% 100%;touch-action:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;-webkit-user-drag:none;cursor:grab;color:var(--d-white)}

.atlas-footer{display:flex;justify-content:space-between;align-items:center;padding:0 24px 13px;gap:15px;font-size:11px}.journey{display:flex;align-items:center;gap:12px;flex:1;max-width:450px}.progress-track{height:4px;flex:1;background:var(--d-surface-2);border-radius:4px;overflow:hidden}.progress-track>div{height:100%;width:0;background:var(--d-honig);transition:width .5s ease}.run-info{display:flex;align-items:center;gap:16px}.run-info button{font-size:11px}.run-info time{font-variant-numeric:tabular-nums;color:var(--d-honig)}
.notice{pointer-events:none;position:fixed;z-index:30;bottom:76px;left:50%;transform:translateX(-50%);max-width:min(600px,90vw);padding:14px 23px;border:1px solid var(--d-honig);background:var(--d-surface);box-shadow:var(--d-card-shadow);border-radius:12px;font-size:14px;line-height:1.5}
.atlas dialog{width:min(560px,calc(100% - 32px));max-height:85dvh;padding:24px;border:var(--d-card-border);border-radius:16px;background:var(--d-surface);color:var(--d-ink);box-shadow:var(--d-card-shadow);overflow:auto}.atlas dialog::backdrop{background:var(--d-overlay)}.dialog-heading{display:flex;gap:12px;justify-content:space-between;align-items:start}.dialog-heading h2{font-family:Georgia,serif;font-weight:400;font-size:28px;margin:5px 0 15px}.dialog-heading button{font-size:24px;flex-shrink:0}.dialog-buttons{display:flex;gap:9px;justify-content:flex-end;flex-wrap:wrap;margin-top:20px}#dialog-content{font-size:16px;line-height:1.7}#dialog-content p{margin-top:0}.list-buttons{display:grid;gap:8px}.list-buttons button{text-align:left}.settings-row{display:flex;gap:8px;flex-wrap:wrap;margin:14px 0}.atlas select{width:100%;font-size:16px}.success-title{color:var(--d-honig)}


@media(max-width:1050px){.atlas-header{padding:12px 16px}.header-actions{gap:8px}#account{display:none}.atlas-main{padding:12px;gap:12px;grid-template-columns:minmax(300px,.9fr) minmax(0,1.25fr)}.reading-scroll{padding:22px}.reading-toolbar{padding:7px 10px;gap:3px}.reading-toolbar button{padding:8px}.map-tools{padding:6px}.map-tools button{padding:8px}.destination{padding:12px}.map-toolbar{padding:10px 12px}.run-info{gap:10px}}
@media(max-width:700px){body.atlas{height:auto;min-height:100dvh;overflow:auto}.atlas-header{align-items:start}.compass,.header-actions .level{display:none}.header-actions{gap:0}.brand .eyebrow{font-size:8px}h1{font-size:20px}.atlas-main{display:flex;flex-direction:column;min-height:0}.reading-panel{height:55dvh;min-height:350px}.map-panel{height:65dvh;min-height:430px}.atlas-footer{flex-wrap:wrap;padding:5px 14px 14px}.journey{min-width:100%}.run-info{width:100%;justify-content:space-between}.reading-toolbar{flex-wrap:nowrap}.reading-scroll{padding:20px 24px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}

/* Bedienprobe 02: Fläche für Text und Karte, Werkzeuge nur bei Bedarf. */
.atlas-header{min-height:46px;padding:0 8px;gap:8px;border:0}
.atlas-header h1{font-size:18px;margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.header-actions{gap:3px}.header-actions button{border:0;background:transparent;padding:6px}
.level{font-size:10px;padding:3px 7px}
.atlas-main{padding:0 6px;gap:6px;grid-template-columns:minmax(320px,2fr) minmax(0,3fr)}
.reading-panel,.map-panel{border-radius:5px;box-shadow:none}
.reading-toolbar{padding:2px 7px;gap:4px;flex-wrap:nowrap}
.reading-toolbar button{border:0;padding:5px 8px}.reading-toolbar>div{gap:0}
.reading-scroll{padding:16px 20px 22px}
#chapter-title{font-size:27px;margin:8px 0 18px}
.atlas .reading-panel .fm-tm{line-height:1.65}
.reading-footer{padding:0 6px;gap:4px}.reading-footer button{border:0}
.map-panel{border:0}.map-viewport{min-height:100px}
#go{position:absolute;right:10px;bottom:10px;z-index:6;min-height:44px;padding:8px 14px;font-size:13px;box-shadow:0 2px 10px var(--d-shadow)}
.poi-card{position:absolute;z-index:8;width:210px;max-width:calc(100% - 16px);max-height:calc(100% - 16px);overflow:auto;padding:4px 8px 8px;background:var(--d-paper);color:var(--d-paper-ink);border:1px solid var(--d-paper-line);border-radius:8px;box-shadow:0 4px 14px var(--d-shadow)}
.poi-heading{display:flex;align-items:flex-start;gap:4px;height:36px;margin:-2px -6px 0}
.poi-number{display:grid;place-items:center;width:22px;height:22px;flex:none;border:1px solid var(--d-paper-muted);border-radius:50%;font-size:11px;font-weight:700;margin-right:auto}
.poi-card p{font-size:13px;line-height:1.5;margin:5px 0 0}
.poi-card button{background:transparent;color:var(--d-paper-ink);border-color:var(--d-paper-line);font-size:12px;min-height:44px;padding:6px 8px}
.poi-card .pin-choice{display:grid;place-items:center;width:44px;height:44px;flex:none;border:0;background:transparent;padding:0;position:relative;margin-top:-2px;isolation:isolate}
.pin-choice:before{content:"";position:absolute;inset:5px 5px 9px;border:1px solid var(--d-paper-line);border-radius:4px;background:var(--d-paper-shade);z-index:-1}
.poi-actions{display:grid;gap:4px}.poi-actions:not(:empty){margin-top:8px}
.poi-actions button{text-align:left}
.atlas-footer{height:25px;min-height:25px;padding:2px 10px;gap:12px;font-size:10px}
.journey{max-width:220px;gap:7px}.progress-track{height:3px}.run-info{gap:10px}
.notice{bottom:38px;font-size:12px;padding:9px 15px;max-width:min(490px,90vw)}
@media(max-width:1050px){.atlas-main{grid-template-columns:minmax(300px,2fr) minmax(0,3fr)}.reading-scroll{padding:14px 16px 20px}}
@media(max-width:700px){.atlas-header h1{font-size:16px}.atlas-main{padding:0 4px;gap:6px}.reading-panel{height:55dvh}.map-panel{height:75dvh;min-height:430px}.atlas-footer{height:auto;min-height:25px;padding:5px 8px;flex-wrap:nowrap}.journey{min-width:0;max-width:110px}.run-info{width:auto;gap:7px;font-size:9px}.reading-toolbar{padding:2px 5px}}

/* Bedienprobe 03: variable Aufteilung, unaufdringliche Symbole. */
.needle-icon{display:block;width:22px;height:30px;pointer-events:none;overflow:visible}
.needle-shaft{fill:var(--d-steel);stroke:var(--d-paper-muted);stroke-width:.7}
.needle-head{fill:var(--d-pin);stroke:var(--d-pin-shade);stroke-width:1}
.needle-light{fill:var(--d-white);opacity:.65}
.pin-choice .needle-icon{margin-top:-4px;width:18px;height:26px}
.atlas .map-pin{width:48px;height:58px;display:grid;place-items:center}
.map-pin .needle-icon{position:absolute;width:32px;height:44px;left:16px;bottom:-2px;filter:drop-shadow(1px 2px 1px var(--d-shadow))}
#marker,#split-reset{display:grid;place-items:center;padding:5px}
.pen-nib{fill:var(--d-honig);stroke:currentColor;stroke-width:1.3}
.atlas-main[data-layout="split"]{grid-template-columns:minmax(0,var(--reading-share,1fr)) 12px minmax(0,var(--map-share,1fr));gap:0}
.split-divider{position:relative;z-index:9;min-height:0;cursor:col-resize;touch-action:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;display:grid;place-items:center;outline:none}
.split-divider:before{content:"";position:absolute;inset:0 -16px}
.split-divider span{width:3px;height:38px;border-radius:3px;background:var(--d-line);pointer-events:none}
.split-divider:hover span,.split-divider:focus-visible span,.atlas-main[data-resizing] .split-divider span{background:var(--d-honig);box-shadow:0 0 0 2px var(--d-surface)}
.atlas-main[data-resizing]{user-select:none;-webkit-user-select:none;cursor:col-resize}
.atlas-main:not([data-layout="split"]) .split-divider{display:none}
@media(max-width:700px){.split-divider{display:none}.atlas-main[data-layout="split"]{gap:6px}}

/* Die Worthilfe ist eine bewusst aktivierte Lesehilfe. */
#word-help-toggle{display:grid;place-items:center}
.language-flags{display:block;pointer-events:none}
.flag-de path:nth-child(1){fill:var(--d-flag-black)}
.flag-de path:nth-child(2){fill:var(--d-flag-red)}
.flag-de path:nth-child(3){fill:var(--d-flag-gold)}
.flag-en path:nth-child(1){fill:var(--d-flag-blue);stroke:var(--d-flag-white);stroke-width:.5}
.flag-en path:nth-child(2){stroke:var(--d-flag-white);stroke-width:2;fill:none}
.flag-en path:nth-child(3){stroke:var(--d-flag-white);stroke-width:5;fill:none}
.flag-en path:nth-child(4){stroke:var(--d-flag-red);stroke-width:2.5;fill:none}
[data-word]{text-decoration:underline dotted var(--d-paper-muted);text-underline-offset:4px;cursor:help}
#dialog-content [data-word]{text-decoration-color:var(--d-ink-soft)}

/* Bestätigte Wege liegen auf dem Bild, unter allen interaktiven Kartenobjekten. */
.route-trail{position:absolute;inset:0;width:1536px;height:1024px;pointer-events:none;overflow:visible}
.route-trail path{fill:none;stroke-linecap:round;stroke-linejoin:round}
.trail-halo{stroke:var(--d-paper);stroke-width:8.5;stroke-opacity:.85}
.trail-ink{stroke:var(--d-trail);stroke-width:4.5}
.trail-section.is-new path{stroke-dasharray:1;animation:trail-draw var(--travel-duration,1600ms) ease-in-out both}
@keyframes trail-draw{from{stroke-dashoffset:1}to{stroke-dashoffset:0}}

/* Kleine Nummern, große unsichtbare Tippflächen; nur erreichte Orte werden grün. */
.poi[data-reached="true"]:before{border:2px solid var(--d-visited);box-shadow:0 0 0 1px var(--d-paper),0 2px 4px var(--d-shadow)}
.poi-label-links,.poi-effects{position:absolute;inset:0;width:1536px;height:1024px;pointer-events:none;overflow:visible}
.poi-label-links line{stroke:var(--d-paper);stroke-width:1;vector-effect:non-scaling-stroke;opacity:.85}
.poi-effects{z-index:0}
/* Ton-Knopf (Roman, 06.11.2026): an = leicht abgehobene Fläche mit Schallwellen, aus = durchgestrichen */
#sound-toggle{display:grid;place-items:center;position:relative}
#sound-toggle[aria-pressed="true"]{background:rgba(255,255,255,.14);color:var(--d-ink);box-shadow:inset 0 0 0 1px rgba(255,255,255,.24)}
#sound-toggle[aria-pressed="false"]{background:transparent;box-shadow:none;opacity:.8}
#sound-toggle[aria-pressed="false"] .sound-waves,#sound-toggle .sound-muted{display:none}
#sound-toggle[aria-pressed="false"]::after{content:"";position:absolute;left:50%;top:50%;width:24px;height:2px;border-radius:1px;background:currentColor;transform:translate(-50%,-50%) rotate(45deg);pointer-events:none}
/* Die Schatzbilder werden erst beim Öffnen des Abschlusses geladen. */
.atlas dialog.treasure-dialog{width:min(740px,calc(100% - 24px));padding:18px}
.treasure{position:relative;width:100%;aspect-ratio:3/2;overflow:hidden;border-radius:10px;background:var(--d-bg);isolation:isolate}
.treasure img{display:block;width:100%;height:100%;object-fit:contain}
.spark{position:absolute;width:18px;height:18px;transform:translate(-50%,-50%);pointer-events:none;opacity:0;animation:treasure-glint 3.8s var(--delay,0s) infinite ease-in-out;color:var(--d-white);filter:drop-shadow(0 0 4px var(--d-gold))}
.spark:before,.spark:after{content:"";position:absolute;background:currentColor;border-radius:50%}
.spark:before{width:2px;height:100%;left:calc(50% - 1px)}.spark:after{height:2px;width:100%;top:calc(50% - 1px)}
@keyframes treasure-glint{0%,45%,100%{opacity:0;transform:translate(-50%,-50%) scale(.25) rotate(0)}60%{opacity:.9;transform:translate(-50%,-50%) scale(1) rotate(12deg)}80%{opacity:0;transform:translate(-50%,-50%) scale(.4) rotate(25deg)}}
.arrival-effect{animation:arrival-fade 2.25s ease-out both}
@keyframes arrival-fade{0%{opacity:0}12%,72%{opacity:1}100%{opacity:0}}
.effect-wheel{animation:wheel-turn 2.2s ease-out both}.wheel-rim{fill:var(--d-wood);stroke:var(--d-honig);stroke-width:3;fill-opacity:.85}.wheel-spoke{fill:none;stroke:var(--d-honig);stroke-width:2}.wheel-hub{fill:var(--d-wood);stroke:var(--d-honig);stroke-width:2}
@keyframes wheel-turn{from{transform:rotate(0)}to{transform:rotate(100deg)}}
.effect-leaf{fill:var(--d-leaf);stroke:var(--d-wood);stroke-width:.5;animation:leaf-drift 1.8s calc(var(--i)*.06s) ease-out both;transform-box:fill-box;transform-origin:center}
@keyframes leaf-drift{0%{opacity:0;translate:-4px -8px;rotate:-12deg}30%{opacity:.85}100%{opacity:0;translate:16px 32px;rotate:35deg}}
.effect-ripple{fill:none;stroke:var(--d-water);stroke-width:2;animation:ripple-spread 1.4s calc(var(--i)*.25s) ease-out both}
@keyframes ripple-spread{from{opacity:.8;transform:scale(.4)}to{opacity:0;transform:scale(2)}}
.effect-drop{fill:var(--d-water);animation:drop-fall 1.1s calc(var(--i)*.28s) ease-in both}
@keyframes drop-fall{0%{opacity:0;transform:translate(var(--x),-25px)}30%{opacity:.7}90%,100%{opacity:0;transform:translate(var(--x),15px)}}
.effect-splash{fill:var(--d-water);animation:splash .7s calc(var(--i)*.18s) 2 ease-out both}
@keyframes splash{from{opacity:.7;translate:0 0}to{opacity:0;translate:5px 16px}}
.effect-beam{fill:var(--d-honig);opacity:.45;animation:beam-sweep 2.2s ease-in-out both}
@keyframes beam-sweep{0%{transform:rotate(-12deg);opacity:0}45%{opacity:.4}100%{transform:rotate(18deg);opacity:0}}
.effect-glow{fill:var(--d-honig);opacity:.5;filter:blur(4px);animation:glow-breathe 2s ease-in-out both}
@keyframes glow-breathe{0%,100%{opacity:0}45%{opacity:.6}}
@media(prefers-reduced-motion:reduce){.spark{display:none}.poi-effects{display:none}}

/* Niveauwahl bleibt kompakt und auf kleinen Displays erreichbar. */
.atlas-header #level-select{display:block;min-height:44px;padding:4px 9px;font-size:12px;color:var(--d-honig);border-color:var(--d-honig)}
.poi-card .pin-choice{margin-left:auto}
.map-viewport[data-numbered="false"] .poi:before{background:transparent;border:0;box-shadow:none}
.map-viewport[data-numbered="false"] .poi[data-reached="true"]:before{border:2px solid var(--d-visited);box-shadow:0 0 0 1px var(--d-paper)}
.map-viewport[data-numbered="false"] .poi:focus-visible:before{outline:2px solid var(--d-honig);outline-offset:3px}
@media(max-width:700px){.atlas-header{flex-wrap:wrap}.atlas-header h1{flex:1;min-width:210px}.header-actions{margin-left:auto}}

/* Abschluss erst bei Ankunft: großer Kartenknopf, an der tatsächlichen Höhle verankert. */
.atlas #map-treasure{position:absolute;z-index:6;width:min(300px,calc(100% - 24px));min-height:82px;padding:13px 16px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;background:linear-gradient(135deg,var(--d-honig),var(--d-gold));color:var(--d-paper-ink);border:2px solid var(--d-paper);border-radius:12px;box-shadow:0 6px 24px var(--d-shadow);font-size:18px;font-weight:700;line-height:1.25;transform-origin:50% 100%}
#map-treasure .reward-caption{font-size:11px;letter-spacing:.13em;text-transform:uppercase}
#map-treasure .reward-arrow{position:absolute;left:var(--reward-anchor,50%);bottom:-25px;transform:translateX(-50%);color:var(--d-gold);font-size:24px;text-shadow:0 2px 4px var(--d-bg);pointer-events:none}
#map-treasure.is-celebrating{animation:reward-appear .65s ease-out both,reward-shine 2.4s .65s 3 ease-in-out}
@keyframes reward-appear{0%{opacity:0;transform:translateY(14px) scale(.86)}65%{opacity:1;transform:translateY(-4px) scale(1.025)}100%{opacity:1;transform:translateY(0) scale(1)}}
@keyframes reward-shine{0%,100%{box-shadow:0 6px 24px var(--d-shadow)}50%{box-shadow:0 0 28px var(--d-gold),0 6px 24px var(--d-shadow)}}
@media(prefers-reduced-motion:reduce){#map-treasure.is-celebrating{animation:none}}

/* Frontseite: ein illustriertes Buch, kompakte Wahlmöglichkeiten unter dem Klappentext. */
.cover-page{flex:1;min-height:0;overflow:auto;padding:clamp(16px,3vw,38px);background:radial-gradient(ellipse at 85% 15%,#31535a,transparent 65%),var(--d-bg)}
.cover-book{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.12fr);max-width:1220px;min-height:min(730px,calc(100dvh - 76px));margin:auto;box-shadow:0 22px 65px #0006;border:1px solid #879084;border-radius:5px;overflow:hidden}
.cover-art{position:relative;min-width:0;min-height:550px;overflow:hidden;background:#244550}
.cover-art>img{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:cover;object-position:35% 50%}
.cover-art:after{content:"";position:absolute;inset:60% 0 0;background:linear-gradient(transparent,#071e2bed);pointer-events:none}
.cover-seal{position:absolute;z-index:1;bottom:30px;left:30px;right:30px;text-align:center;color:#fff3d4;font-family:Georgia,serif;font-size:23px;letter-spacing:.2em;text-shadow:0 2px 8px #0008}
.cover-seal span{font:12px/2.6 Inter,system-ui,sans-serif;letter-spacing:.13em}
.cover-paper{background:linear-gradient(110deg,var(--d-paper),var(--d-paper-shade));color:var(--d-paper-ink);padding:clamp(25px,3.3vw,46px);display:flex;flex-direction:column;justify-content:center;min-width:0;box-shadow:-10px 0 24px #132b361a;position:relative}
.cover-paper>.eyebrow{color:#766039;letter-spacing:.2em;font-size:10px;margin-bottom:13px}
#cover-title{font-size:clamp(29px,3.35vw,45px);line-height:1.13;margin:0;letter-spacing:-.025em;outline:none}
.cover-blurb{font-size:15px;line-height:1.72;margin:22px 0 25px;max-width:52ch}
.cover-options{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px 10px}
.cover-option{margin:0;padding:0;min-width:0;border:0}
.cover-option legend{font-size:11px;font-weight:650;letter-spacing:.06em;margin:0 0 8px;padding:0;color:#59645e}
.cover-segments{display:flex;gap:0;border:1px solid #a49d87;border-radius:4px;overflow:hidden}
.atlas .cover-segments button{border:0;border-right:1px solid #c5bca5;border-radius:0;background:#ffffff30;color:var(--d-paper-ink);min-width:44px;flex:1;padding:10px 6px;font-size:13px;min-height:44px}
.atlas .cover-segments button:last-child{border-right:0}
.atlas .cover-segments button[aria-pressed="true"]{background:var(--d-paper-ink);color:var(--d-paper);box-shadow:inset 0 -3px #d3b473}
.cover-segments [data-front-level]:before{content:"";display:inline-block;width:7px;height:7px;border-radius:50%;margin-right:5px;background:#af302f;box-shadow:0 0 0 1px #0002}
.cover-segments [data-front-level="gruen"]:before{background:#498253}.cover-segments [data-front-level="gelb"]:before{background:#e2b23e}
.atlas .cover-tile{display:flex;align-items:center;gap:9px;min-height:63px;min-width:0;padding:10px 11px;border:1px solid #bcb397;border-radius:4px;text-align:left;background:#fff6;color:var(--d-paper-ink);font-size:13px;line-height:1.4;font-weight:600}
.atlas .cover-tile[aria-pressed="true"]{background:#fff9;color:var(--d-paper-ink);border-color:#8c977b}
.cover-tile small{display:block;font-size:10px;font-weight:400;color:#59645e;margin-top:2px}
.tile-symbol{font:24px/1 Georgia,serif;color:#806a42;width:24px;flex-shrink:0;text-align:center}.tile-language{font:9px/1.15 Inter,system-ui,sans-serif;letter-spacing:.09em;font-weight:700}
.tile-end{margin-left:auto;font-size:15px;color:#806a42}.tile-switch{width:25px;height:14px;border-radius:10px;border:1px solid #9e9d8e;background:#c6c3b5;position:relative;flex-shrink:0;margin-left:auto}
.tile-switch:after{content:"";position:absolute;width:8px;height:8px;left:2px;top:2px;border-radius:50%;background:#fff9ee}
[aria-pressed="true"]>.tile-switch{background:#486b5b;border-color:#486b5b}[aria-pressed="true"]>.tile-switch:after{left:13px}
.cover-mode-note{font-size:11px;line-height:1.6;margin:13px 0 21px;color:#59645e;min-height:18px}
.cover-bottom{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.atlas #cover-enter{border-radius:4px;background:#203f49;border:1px solid #203f49;color:#fff0cd;font-size:15px;padding:13px 18px;display:flex;gap:28px;justify-content:space-between;align-items:center;min-height:49px;box-shadow:0 3px 5px #122e3b22}
.atlas .cover-view{background:transparent;border:0;border-radius:4px;color:#59645e;font-size:11px;padding:8px 0;text-decoration:underline;text-underline-offset:4px}
.cover-progress{font-size:11px;line-height:1.6;color:#59645e;margin:17px 0 0}
.cover-page button:focus-visible{outline-color:#203f49;outline-offset:2px}.cover-segments button:focus-visible{outline-offset:-3px;outline-color:#bd8d31}
@media(min-width:1000px) and (max-height:780px){.cover-page{padding:20px}.cover-book{min-height:calc(100dvh - 40px)}.cover-paper{padding:25px 32px}.cover-blurb{margin:17px 0 19px;font-size:14px}.cover-mode-note{margin-bottom:15px}.cover-art{min-height:600px}}
@media(max-width:900px){.cover-book{grid-template-columns:1fr;max-width:670px;min-height:0}.cover-art{min-height:0;height:300px}.cover-art>img{object-position:50% 61%}.cover-seal{bottom:14px;font-size:19px}.cover-seal span{display:none}.cover-paper{padding:29px 35px}#cover-title{font-size:36px}.cover-blurb{max-width:none;margin:18px 0 22px}.cover-paper>.eyebrow{margin-bottom:10px}}
@media(max-width:480px){.cover-page{padding:0}.cover-book{border:0;border-radius:0}.cover-art{height:250px}.cover-paper{padding:27px 21px 32px}#cover-title{font-size:32px}.cover-blurb{font-size:14px}.cover-tile small{font-size:10px}.atlas .cover-tile{padding:9px 8px;gap:6px;font-size:12px}.tile-symbol{width:19px}.cover-options{gap:12px 8px}.cover-bottom{gap:14px}body.atlas[data-screen="cover"]{height:100dvh;overflow:hidden;min-height:0}}

/* Lokale Leseschriften: Text und Karte bleiben Bestandteil derselben Ansicht. */
@font-face{font-family:OpenDyslexic;src:url('assets/fonts/OpenDyslexic-Regular.woff') format('woff');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'Atkinson Hyperlegible';src:url('assets/fonts/AtkinsonHyperlegible-Regular.ttf') format('truetype');font-weight:400;font-style:normal;font-display:swap}
.atlas .reading-panel .fm-tm,.atlas .fm-tm-satz[data-quote="true"],#chapter-title,.poi-card>p,#dialog-content p,#dialog-content li{font-family:var(--reading-font,Inter,system-ui,sans-serif)}
.font-choices{display:grid;gap:8px;margin:15px 0 23px}
.atlas .font-choices button{text-align:left;font-size:17px;font-weight:400;min-height:49px;padding:10px 15px}
.font-size-row{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:16px 0}
.font-size-row>span{margin-right:auto;font-size:14px}.font-size-row output{font-size:14px;min-width:42px;text-align:center;font-variant-numeric:tabular-nums}
#dialog-content .font-preview{background:var(--d-paper);color:var(--d-paper-ink);border:1px solid var(--d-paper-line);border-radius:6px;padding:18px;font-size:var(--text-size);line-height:1.75;overflow-wrap:anywhere}

/* Jeweils ein kurzer Schritt, mit eigenem Schaubild und gut erreichbaren Pfeilen. */
.atlas .intro-back{margin:0 0 15px;font-size:12px;padding:8px 12px}
.atlas .guide-dialog{width:min(650px,calc(100% - 24px));padding:20px 24px;max-height:94dvh}
.guide{outline:none}.guide-slide{touch-action:pan-y;min-width:0;overflow-wrap:anywhere}
.guide-art{height:135px;display:flex;justify-content:center;align-items:center;background:linear-gradient(115deg,#f5edd8,#e5d4b0);border-radius:8px;margin:3px 0 17px;overflow:hidden}
.guide-art svg{width:100%;height:100%;max-width:360px;stroke:#35505a;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round;fill:none}
.guide-art .paper{fill:#fff9e9}.guide-art .gold{fill:#e8c67b}.guide-art .leaf{fill:#92af83}.guide-art .red{fill:#c45043;stroke:#a13c31}.guide-art .trail{stroke:#c45043;stroke-width:5}.guide-art .visited{stroke:#36804e;stroke-width:5}.guide-art .tap{stroke:#a1844e;stroke-dasharray:4 5}.guide-art text{font:26px Inter,system-ui,sans-serif;text-anchor:middle;fill:#35505a;stroke:none}
#guide-slide-title{font-family:var(--reading-font,Inter,system-ui,sans-serif);font-size:20px;line-height:1.45;margin:0 0 12px;font-weight:400;color:var(--d-honig)}
#dialog-content .guide-text{font-size:var(--text-size);line-height:1.6;margin:0;hyphens:auto}
.guide-navigation{display:flex;align-items:center;justify-content:space-between;gap:15px;border-top:1px solid var(--d-line);margin-top:21px;padding-top:14px}
.atlas .guide-navigation button{width:50px;min-height:46px;padding:4px;font-size:25px;border-radius:6px}.guide-counter{font-size:12px;letter-spacing:.15em;font-variant-numeric:tabular-nums}
.guide-dialog .dialog-buttons{margin-top:12px}.guide-dialog .dialog-heading h2{font-size:25px}
@media(max-width:480px){.atlas .guide-dialog{padding:16px}.guide-art{height:105px;margin-bottom:14px}#guide-slide-title{font-size:18px}.guide-navigation{margin-top:15px;padding-top:10px}.guide-dialog .dialog-heading h2{font-size:23px}.guide-dialog .dialog-buttons{margin-top:8px}}
@media(max-height:650px){.guide-art{height:80px}.guide-dialog .dialog-heading h2{margin-bottom:8px}}
/* Navigation bleibt erreichbar, auch bei großer Schrift auf kleinen Displays. */
.atlas .guide-dialog[open]{display:flex;flex-direction:column;overflow:hidden}
.guide-dialog .dialog-heading,.guide-dialog .dialog-buttons{flex-shrink:0}
.guide-dialog #dialog-content{display:flex;min-height:0;flex:1}
.guide-dialog .guide{display:flex;flex-direction:column;min-height:0;width:100%}
.guide-dialog .guide-slide{overflow:auto;min-height:0;overscroll-behavior:contain}

/* Handy: Die Ortsentscheidung bleibt erreichbar, auch wenn die Karte Wischgesten nutzt. */
@media(max-width:700px){
  #go{position:fixed;left:12px;right:12px;bottom:calc(10px + env(safe-area-inset-bottom,0px));z-index:110;min-height:48px}
  .notice{bottom:calc(76px + env(safe-area-inset-bottom,0px))}
  body.atlas[data-screen="reader"] .atlas-footer{padding-bottom:calc(72px + env(safe-area-inset-bottom,0px))}
  .atlas dialog[open]{display:flex;flex-direction:column;overflow:hidden;max-height:calc(100dvh - 24px);padding:16px}
  .atlas dialog .dialog-heading,.atlas dialog .dialog-buttons{flex-shrink:0}
  .atlas dialog #dialog-content{min-height:0;overflow:auto;overscroll-behavior:contain}
  .atlas dialog .dialog-buttons{margin-top:12px}
  .atlas dialog .dialog-buttons button{flex:1 1 140px;min-height:48px}
}
.guide-navigation{flex-shrink:0}