/* Gemeinsame Teile aller Beispiele: Demo-Leiste, Grundlagen */
[hidden]{display:none!important}
*{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;overflow-x:hidden;-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
p{margin:0}
h1,h2,h3,h4{margin:0;text-wrap:balance}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}}
.lw-bar{display:flex;align-items:center;gap:8px 14px;flex-wrap:wrap;padding:8px max(16px,env(safe-area-inset-right,0px)) 8px max(16px,env(safe-area-inset-left,0px));background:#0e2a22;color:#efe6cf;font:500 13px/1.3 "Figtree",system-ui,sans-serif;position:relative;z-index:90}
.lw-bar a{color:#efe6cf;text-decoration:none;font-weight:700;padding-block:4px}
.lw-pill{background:#e8b23a;color:#0e2a22;border-radius:999px;padding:3px 10px;font-weight:800;font-size:12px;letter-spacing:.06em;text-transform:uppercase}
.lw-note{opacity:.75}
@media (max-width:560px){.lw-note{flex-basis:100%;font-size:12px}}
.lw-dot{display:inline-block;width:9px;height:9px;border-radius:50%;background:#3fae5a;box-shadow:0 0 0 4px #3fae5a33;margin-right:9px;vertical-align:1px}
.lw-dot.off{background:#d9532b;box-shadow:0 0 0 4px #d9532b33}
.is-today{font-weight:800}
.gutter{padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
.rise{animation:lw-rise .8s cubic-bezier(.2,.7,.2,1) both}
@keyframes lw-rise{from{transform:translateY(16px);opacity:.001}to{transform:none;opacity:1}}