@charset "UTF-8";
html,body{margin:0;background:transparent;overflow:hidden}
body{box-sizing:border-box;width:100%;padding:16px 8px}
#ld-demo{position:relative;--text-meta:12px;--text-support:14px;--text-body:17px;--text-title:21px;max-width:900px;font-size:var(--text-support);line-height:1.5}
#ld-demo .context-demo{display:grid;grid-template-columns:minmax(0,1fr) 226px;min-height:388px;border:1px solid var(--lm-line);border-radius:18px;overflow:hidden;background:var(--lm-surface);box-shadow:0 12px 30px #26311d0a}
#ld-demo .landscape{position:relative;min-width:0;overflow:hidden;background:#88afb1;isolation:isolate}
.world{position:absolute;inset:0;overflow:hidden;transition:filter 1.6s ease;filter:saturate(1.08) contrast(1.04)}
#game-scene{display:block;width:100%;height:100%;object-fit:cover;image-rendering:pixelated}
#ld-demo[data-art=flat] #game-scene{image-rendering:auto;object-fit:contain}
#ld-demo[data-art=flat] .world{background:#e9ecdf;filter:none}
#ld-demo[data-art=flat] .grade{display:none}
#ld-demo[data-art=flat] .scene-caption{color:#4c5949;text-shadow:none}
#ld-demo[data-sky=empty] .landscape{background:#e9ecdf}
#ld-demo[data-sky=empty] .grade{display:none}
.grade{position:absolute;inset:0;pointer-events:none;opacity:0;transition:opacity 1.7s;mix-blend-mode:soft-light}
.grade-day{background:#efd67a}.grade-night{background:#7ba0e9}.grade-rain{background:#87c9bb}
[data-grade=day] .grade-day,[data-grade=night] .grade-night,[data-grade=rain] .grade-rain{opacity:.45}
[data-grade=night] .world{filter:saturate(.85) contrast(1.12) brightness(1.08)}
[data-grade=rain] .world{filter:saturate(.75) contrast(1.15) brightness(1.06)}
#ld-demo .scene-caption{position:absolute;left:22px;right:16px;bottom:21px;color:#fff8e5;text-shadow:0 1px 5px #143a3a;display:grid;gap:3px}
#ld-demo .weather-name{font-size:var(--text-title);font-weight:600}#ld-demo .treatment{font-size:var(--text-meta);opacity:.85}
#ld-demo .context-panel{padding:24px 20px;background:var(--lm-surface)}
#ld-demo .panel-kicker,#ld-demo .section-label{font-size:var(--text-meta);letter-spacing:1.1px;color:var(--lm-muted)}
#ld-demo .context-panel h1{font-size:var(--text-title);letter-spacing:-.4px;margin:4px 0 9px;font-weight:600}
#ld-demo .auto{display:flex;align-items:center;gap:6px;font-size:var(--text-meta);color:var(--lm-primary)}
#ld-demo .auto i{width:6px;height:6px;border-radius:50%;background:currentColor}
#ld-demo .conditions{margin-top:26px}#ld-demo .section-label{margin-bottom:11px}
#ld-demo .condition{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 11px;margin-top:6px;border:1px solid transparent;border-radius:8px;background:var(--lm-container);transition:background .4s,border-color .4s}
#ld-demo .condition strong{font-size:var(--text-support);font-weight:600}
#ld-demo .condition.is-highlighted{background:var(--lm-selected);border-color:var(--lm-primary)}
#ld-demo .connection{display:flex;align-items:center;gap:8px;margin:12px 0;color:var(--lm-primary)}#ld-demo .connection span{height:1px;background:var(--lm-line);flex:1}#ld-demo .connection b{font-weight:400}
#ld-demo .variation-name{display:flex;gap:9px;align-items:center;font-size:var(--text-body)}#ld-demo .variation-name i{display:grid;place-items:center;width:24px;height:24px;background:var(--lm-selected);border-radius:50%;color:var(--lm-primary);font-size:var(--text-support);font-style:normal}
.sr-only{position:absolute;top:0;left:0;margin:0;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
@media(max-width:440px){body{padding:8px 0}#ld-demo .context-demo{grid-template-columns:1fr}#ld-demo .landscape{height:300px}#ld-demo .context-panel{padding:18px;display:grid;grid-template-columns:1fr 1fr;gap:16px}#ld-demo .context-panel header{grid-column:1/-1;display:flex;align-items:center;gap:12px}#ld-demo .panel-kicker{display:none}#ld-demo .context-panel h1{margin:0}#ld-demo .auto{margin-left:auto}#ld-demo .conditions{margin:0}#ld-demo .connection{display:none}#ld-demo .variation{border-left:1px solid var(--lm-line);padding-left:16px}}
@media(prefers-reduced-motion:reduce){#ld-demo *,#ld-demo *:before,#ld-demo *:after{animation:none!important;transition:none!important}}