/* onda.css – Wellen- und Zeitschloss-Ansicht */
.od{padding-top:76px}
.od-hero{padding:80px 0 30px;background:radial-gradient(900px 500px at 70% 10%,rgba(123,92,196,.35),transparent 65%)}
.od-hero h1{font-size:clamp(34px,5.4vw,60px);margin:14px 0 18px}
.od-bar{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:26px}
.od-bar .icon-btn{font-size:20px;cursor:pointer}
.od-bar .field{min-width:0}
.od-today{padding:11px 18px;font-size:12px}
.od-today.dc-on{border-color:var(--gold);color:var(--gold);background:rgba(227,191,110,.1)}   /* anderes Datum als heute: zurück zu heute */
.od-toc{display:flex;flex-wrap:wrap;gap:8px;margin-top:22px}
.od-toc a{padding:9px 14px;border-radius:999px;border:1px solid var(--line);color:var(--muted);text-decoration:none;font-size:13px;background:rgba(255,255,255,.03)}
.od-toc a:hover{color:var(--gold);border-color:var(--gold)}
.od-sec{padding:60px 0 70px}
.od-sec.alt{background:linear-gradient(180deg,var(--bg-2),var(--bg))}
.od-intro{color:var(--muted);font-size:16.5px;max-width:820px}
.od-hint{font-size:13px;color:var(--faint);margin:10px 0 0}
/* Hinweis + „Welle zum Kalender hinzufügen (.ics)“ in einer Zeile (statisch im HTML: kein Layoutsprung) */
.od-under{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px 16px;margin-top:10px}
.od-under .od-hint{margin:0}
.od-ics{padding:10px 16px;font-size:12px}
@media (pointer:coarse){.od-ics{min-height:40px}}
@media print{.od-ics{display:none}}

/* Kopf der Welle */
.od-wavehead{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:22px;align-items:center;margin:28px 0 22px;padding:20px 24px;border:1px solid var(--line);border-radius:var(--radius);background:var(--panel)}
.od-wh-g{display:grid;place-items:center;padding:8px;border-radius:14px;background:rgba(255,255,255,.04);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--c) 45%,transparent)}
.od-wh-t h3{margin:8px 0 6px;font-size:clamp(20px,2.6vw,28px)}
.od-wh-t p{margin:0;color:var(--muted);font-size:14.5px}
.od-range{margin-top:4px!important;color:var(--faint)!important;font-size:13px!important}
.od-cn{color:var(--c);font-weight:600}
.od-prog{display:grid;gap:8px;justify-items:end;text-align:right;min-width:220px}
.od-prog b{font:700 26px var(--display);color:var(--gold)}
.od-prog b small{font:500 14px var(--font);color:var(--muted)}
.od-prog > small{color:var(--faint);font-size:12px}
.od-segs{display:grid;grid-template-columns:repeat(13,14px);gap:3px}
.od-segs i{height:8px;border-radius:3px;background:rgba(255,255,255,.12)}
.od-segs i.done{background:rgba(227,191,110,.55)}
.od-segs i.on{background:var(--gold);box-shadow:0 0 10px var(--gold)}
.od-special{grid-column:1/-1;margin:0;padding:10px 14px;border:1px dashed rgba(227,191,110,.55);border-radius:10px;color:var(--gold);font-size:14px}

/* Band der 13 Tage */
.od-band{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(13,minmax(0,1fr));gap:6px;counter-reset:none}
.od-band li{min-width:0;display:flex}
.od-day{position:relative;flex:1;min-width:0;display:flex;flex-direction:column;align-items:center;gap:5px;padding:24px 5px 10px;border-radius:12px;border:1px solid var(--line);background:rgba(255,255,255,.03);color:var(--text);text-decoration:none;text-align:center;transition:border-color .2s,background .2s,transform .2s}
.od-day:hover,.od-day:focus-visible{border-color:var(--gold);background:rgba(227,191,110,.08);transform:translateY(-2px)}
.od-band li.past .od-day{background:rgba(255,255,255,.012);border-color:rgba(170,180,255,.1)}
.od-band li.past .od-tname{color:var(--muted)}
.od-band li.sel .od-day{border-color:var(--gold);background:rgba(227,191,110,.12);box-shadow:0 0 0 1px var(--gold),0 10px 30px -12px rgba(227,191,110,.7);opacity:1}
.od-tn{position:absolute;top:6px;left:7px;font:700 12px var(--font);color:var(--gold)}
.od-badge{position:absolute;top:5px;right:5px;padding:2px 6px;border-radius:999px;background:var(--gold);color:#1a1405;font:700 9.5px/1.3 var(--font);letter-spacing:.06em;text-transform:uppercase}
.od-badge.ghost{background:none;color:var(--gold);border:1px solid var(--gold)}
.od-g{display:block;line-height:0}
.od-g svg{display:block;max-width:100%;height:auto}
.od-tname{font:600 12px/1.2 var(--font);hyphens:auto;-webkit-hyphens:auto;max-width:100%}
.od-q{font-size:11px;line-height:1.35;color:var(--muted);hyphens:auto;-webkit-hyphens:auto;max-width:100%}
.od-kin{font:600 11px var(--font);color:var(--c);margin-top:auto}
.od-dt{font-size:11px;color:var(--faint);display:flex;flex-direction:column;line-height:1.3}
.od-dt em{font-style:normal;color:var(--gold);font-size:10px}

/* Detail des Tages */
.od-detail{margin-top:26px}
.od-dcard{display:grid;grid-template-columns:200px minmax(0,1fr);gap:30px;padding:28px 30px}
.od-dg{display:flex;flex-direction:column;align-items:center;gap:6px;text-align:center}
.od-dg b{font:700 18px var(--display);color:var(--c);margin-top:6px}
.od-dg span{color:var(--muted);font-size:14px}
.od-dt-txt h3{margin:8px 0 10px;font-size:clamp(22px,2.6vw,30px)}
.od-question{font:500 19px/1.4 var(--font);color:var(--gold);margin:0 0 14px}
.od-kv{display:flex;flex-wrap:wrap;gap:8px 22px;margin:0 0 12px}
.od-kv div{display:flex;gap:6px;align-items:baseline}
.od-kv dt{font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--faint)}
.od-kv dd{margin:0;color:var(--text);font-weight:600}
.od-motto{font-style:italic;color:var(--text);margin:0 0 10px}
.od-daily{color:var(--muted);font-size:15px}
.od-daily b{color:var(--text);margin-right:6px}
.od-more summary{cursor:pointer;color:var(--gold);font-size:14px}
.od-more p{color:var(--muted);font-size:15px}
.od-links{display:flex;flex-wrap:wrap;gap:10px;margin-top:16px}

/* Zeitschlösser */
.od-castles{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:30px;align-items:start;margin-top:28px}
.od-spiral{margin:0;padding:18px}
.od-spiral svg{display:block;width:100%;height:auto;max-width:560px;margin:0 auto}
.od-spiral figcaption{font-size:13px;color:var(--faint);margin-top:12px;line-height:1.5}
.od-dot{cursor:pointer;stroke:rgba(7,10,28,.85);stroke-width:1;transition:r .2s}
.od-dot:hover{stroke:#fff;stroke-width:1.6}
.od-dot.w{stroke:#fff;stroke-width:1.3}
.od-dot.now{stroke:var(--gold);stroke-width:2.4}
.od-halo{fill:none;stroke:var(--gold);stroke-width:1.6;opacity:.85;animation:od-pulse 2.4s ease-in-out infinite;transform-box:fill-box;transform-origin:center}
@keyframes od-pulse{0%,100%{opacity:.9;transform:scale(1)}50%{opacity:.25;transform:scale(1.25)}}
@media (prefers-reduced-motion:reduce){.od-halo{animation:none}}
.od-ctr{fill:var(--gold);font:700 13px var(--display);text-anchor:middle}
.od-ctr2{fill:var(--muted);font:500 7.5px var(--font);text-anchor:middle;letter-spacing:.04em;text-transform:uppercase}
.od-clist{display:grid;gap:10px}
.od-castle{border:1px solid var(--line);border-radius:14px;padding:14px 16px;background:var(--panel)}
.od-castle.here{border-color:color-mix(in srgb,var(--c) 70%,transparent);box-shadow:0 0 0 1px color-mix(in srgb,var(--c) 45%,transparent),0 12px 34px -16px var(--c)}
.od-castle header{display:flex;gap:12px;align-items:center}
.od-castle header i{flex:0 0 14px;height:14px;border-radius:4px;background:var(--c)}
.od-castle small{color:var(--faint);font-size:12px}
.od-castle h3{margin:2px 0 0;font-size:16px;line-height:1.3}
.od-here{margin:8px 0 0;color:var(--gold);font-size:13.5px;font-weight:600}
.od-castle ol{list-style:none;margin:10px 0 0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:4px}
.od-castle li button{display:flex;align-items:center;gap:8px;width:100%;padding:5px 8px;border-radius:8px;border:1px solid transparent;background:none;color:var(--muted);font:500 12.5px/1.25 var(--font);text-align:left;cursor:pointer}
.od-castle li button svg{flex:0 0 auto}
.od-castle li button:hover{color:var(--text);background:rgba(255,255,255,.04)}
.od-castle li.on button{color:var(--text);border-color:rgba(227,191,110,.45);background:rgba(227,191,110,.1)}

/* 3D */
.od-s3d{margin-top:24px}

@media (min-width:1241px){
  .od-band .od-tname{font-size:clamp(10.5px,.86vw,12px)}
}
@media (max-width:1240px){
  .od-band{grid-template-columns:repeat(auto-fill,minmax(118px,1fr))}
}
@media (max-width:980px){
  .od-castles{grid-template-columns:minmax(0,1fr)}
  .od-wavehead{grid-template-columns:auto minmax(0,1fr)}
  .od-prog{grid-column:1/-1;justify-items:start;text-align:left;min-width:0}
}
@media (max-width:640px){
  .od-hero{padding:56px 0 20px}
  .od-sec{padding:44px 0 50px}
  .od-bar .field{flex:1}
  .od-wavehead{padding:16px;gap:14px}
  .od-band{grid-template-columns:repeat(3,minmax(0,1fr));gap:5px}
  .od-segs{grid-template-columns:repeat(13,minmax(0,1fr));width:100%}
  .od-prog{width:100%}
  .od-dcard{grid-template-columns:minmax(0,1fr);gap:16px;padding:20px 18px}
  .od-castle ol{grid-template-columns:minmax(0,1fr)}
}
/* Brotkrumen .pg-crumbs: css/site.css (gemeinsam, Touch-Ziel) */
/* Meldung bei ungültigem Datum (util.js dateMessage) */
.dt-msg{margin:8px 0 0;padding:8px 12px;border-radius:10px;border:1px solid rgba(240,161,74,.5);background:rgba(240,161,74,.1);color:var(--text);font-size:13px;line-height:1.4}
.od-bar .icon-btn:disabled{opacity:.35;cursor:default}
@media (pointer:coarse){#od-today{min-height:40px}.od-more>summary{padding:10px 0;min-height:40px;box-sizing:border-box}}   /* Touch-Ziel ≥ 40 px (GR-14: Tontext war 24 px) */
/* Tablet (641–980 px): Platz für Wellenkopf und Band, bevor js/onda.js sie füllt (die Leiste darunter sprang sonst ins Bild, CLS bis 0,07) */
@media (min-width:641px) and (max-width:980px){
  .od-wavehead:empty{min-height:263px}
  .od-band:empty{min-height:585px}
}
/* G9 (Paket 2): Portale in der Welle – Zeichen wie überall (css/portal.css .pt-sw), Links in die Konzepte */
.od-wh-t p.od-pt{display:flex;align-items:flex-start;gap:8px;margin-top:8px;font-size:13.5px;line-height:1.45}
.od-pt .pt-sw{margin-top:2px}
.od-pt a{color:var(--cyan)}
.od-kin{color:color-mix(in srgb,var(--c) 82%,#fff)}   /* Kontrast ≥ 4,5:1 auch für Rot auf dunklem Feld (axe color-contrast) */