/* ========================================================================== ELITE-KAL — Seasonal layer: ANCIENT KOREAN SUMMER (2026) Removable/swappable: only animation + tint refinements live here. All motion is transform/opacity, wrapped in prefers-reduced-motion. Time-of-day: (season.js). Default is the fixed warm evening. ========================================================================== */ /* Warm summer accent on ornament dividers + section headings */ .season-summer .ornament-diamond { box-shadow: 0 0 12px rgba(232,180,90,0.35); } @media (prefers-reduced-motion: no-preference) { /* Lantern flicker: soft irregular glow breathing on the wall lantern points */ .season-summer .hs-lanterns { animation: lanternFlicker 6.5s ease-in-out infinite; } @keyframes lanternFlicker { 0%, 100% { opacity: 1; } 17% { opacity: 0.82; } 31% { opacity: 0.96; } 46% { opacity: 0.78; } 58% { opacity: 1; } 71% { opacity: 0.88; } 86% { opacity: 0.97; } } /* Mist bands slide very slowly between the ridges */ .season-summer .hs-mist-far { animation: mistDriftA 90s ease-in-out infinite alternate; } .season-summer .hs-mist-near { animation: mistDriftB 70s ease-in-out infinite alternate; } @keyframes mistDriftA { from { transform: translateX(-2.5%); opacity: 0.42; } to { transform: translateX(2.5%); opacity: 0.58; } } @keyframes mistDriftB { from { transform: translateX(2%); opacity: 0.38; } to { transform: translateX(-2%); opacity: 0.55; } } /* Sun glow breathes gently (heat shimmer feel without bloom) */ .season-summer .hs-sun { animation: sunBreathe 18s ease-in-out infinite alternate; } @keyframes sunBreathe { from { opacity: 0.92; } to { opacity: 1; } } /* Fireflies (spawned by season.js into .hs-fireflies) */ .season-summer .hs-fireflies .firefly { position: absolute; width: 3px; height: 3px; border-radius: 50%; background: radial-gradient(circle, rgba(255,236,150,0.95) 0%, rgba(255,214,110,0.4) 55%, transparent 75%); box-shadow: 0 0 6px rgba(255,224,130,0.7); opacity: 0; animation: fireflyFloat var(--ff-dur, 9s) ease-in-out var(--ff-delay, 0s) infinite; } @keyframes fireflyFloat { 0% { transform: translate(0, 0); opacity: 0; } 12% { opacity: 0.9; } 26% { opacity: 0.15; } 38% { opacity: 0.8; } 55% { opacity: 0.1; } 68% { opacity: 0.7; } 100% { transform: translate(var(--ff-dx, 30px), var(--ff-dy, -46px)); opacity: 0; } } /* Drifting leaves/petals (spawned by season.js; max 6 concurrent) */ .season-summer .hs-leaves .leaf { position: absolute; top: -18px; border-radius: 60% 8% 60% 8%; opacity: 0; animation: leafFall var(--lf-dur, 14s) linear var(--lf-delay, 0s) infinite; } .season-summer .hs-leaves .leaf.petal { border-radius: 60% 60% 60% 8%; } @keyframes leafFall { 0% { transform: translate(0, -20px) rotate(0deg); opacity: 0; } 6% { opacity: 0.7; } 50% { transform: translate(var(--lf-sway, 60px), 45vh) rotate(200deg); opacity: 0.65; } 92% { opacity: 0.4; } 100% { transform: translate(calc(var(--lf-sway, 60px) * 0.4), 92vh) rotate(380deg); opacity: 0; } } /* Occasional bird silhouettes across the far sky (season.js spawns) */ .season-summer .hs-birds .bird { position: absolute; width: 14px; height: 5px; opacity: 0; animation: birdCross var(--bd-dur, 26s) linear var(--bd-delay, 0s) 1 forwards; } .season-summer .hs-birds .bird::before, .season-summer .hs-birds .bird::after { content: ""; position: absolute; top: 2px; width: 7px; height: 2px; border-radius: 50% 50% 0 0; background: rgba(16,20,26,0.85); transform-origin: right center; animation: birdFlap 0.55s ease-in-out infinite alternate; } .season-summer .hs-birds .bird::after { left: 7px; transform-origin: left center; animation-delay: 0.08s; } @keyframes birdFlap { from { transform: rotate(-14deg); } to { transform: rotate(22deg); } } @keyframes birdCross { 0% { transform: translate(-30px, 0); opacity: 0; } 5% { opacity: 0.75; } 95% { opacity: 0.75; } 100% { transform: translate(110vw, var(--bd-dy, -40px)); opacity: 0; } } /* Subtle heat haze over the distant fortress roofs */ .season-summer .hs-fortress { animation: heatHaze 7s ease-in-out infinite alternate; } @keyframes heatHaze { from { transform: translateY(0) scaleY(1); } to { transform: translateY(-0.6px) scaleY(1.0015); } } /* Banner sway on the feature cards' hover (foliage life) */ .season-summer .feature-card-fort:hover .feature-icon { animation: fortIconSway 2.8s ease-in-out infinite alternate; } @keyframes fortIconSway { from { transform: rotate(-2deg); } to { transform: rotate(2.5deg); } } } /* /prefers-reduced-motion */ @media (prefers-reduced-motion: reduce) { .season-summer .hs-clouds-far, .season-summer .hs-clouds-near { animation: none; } .season-summer .hs-fireflies, .season-summer .hs-leaves, .season-summer .hs-birds { display: none; } .season-summer #particles, .season-summer .fog-layer { display: none; } } /* ========================================================================== TIME-OF-DAY tints (overlays only — the artwork never reloads) ========================================================================== */ /* The hero base is the fortress-at-sunset ARTWORK (.hs-bg-img); time-of-day re-grades it via filter + the .hs-tint overlay — no image swap ever. */ /* Morning: cooler light, pale mist, no fireflies */ body[data-tod="morning"] .hs-bg-img { filter: brightness(1.06) saturate(0.82) hue-rotate(-8deg); } body[data-tod="morning"] .hs-tint { background: linear-gradient(90deg, rgba(20,30,44,0.58) 0%, rgba(20,30,44,0.28) 38%, rgba(30,40,52,0.10) 65%, rgba(20,30,44,0.25) 100%), linear-gradient(180deg, rgba(150,170,185,0.18) 0%, transparent 30%, transparent 70%, rgba(16,22,32,0.5) 100%); } body[data-tod="morning"] .hs-mist { opacity: 0.8; } body[data-tod="morning"] .hs-fireflies { display: none; } /* Afternoon: clearer warm daylight */ body[data-tod="afternoon"] .hs-bg-img { filter: brightness(1.12) saturate(1.02); } body[data-tod="afternoon"] .hs-tint { background: linear-gradient(90deg, rgba(10,14,20,0.5) 0%, rgba(10,14,20,0.22) 38%, transparent 65%, rgba(10,14,20,0.2) 100%), linear-gradient(180deg, rgba(8,11,18,0.25) 0%, transparent 25%, transparent 75%, rgba(8,11,18,0.45) 100%); } body[data-tod="afternoon"] .hs-mist { opacity: 0.3; } body[data-tod="afternoon"] .hs-fireflies { display: none; } /* Evening (default): the artwork's own golden sunset — base .hs-tint applies */ /* Night: moonlit grade, strong fireflies */ body[data-tod="night"] .hs-bg-img { filter: brightness(0.62) saturate(0.72) hue-rotate(-14deg); } body[data-tod="night"] .hs-tint { background: linear-gradient(90deg, rgba(6,10,20,0.68) 0%, rgba(6,10,20,0.38) 38%, rgba(10,16,30,0.18) 65%, rgba(6,10,20,0.35) 100%), linear-gradient(180deg, rgba(10,16,32,0.5) 0%, transparent 28%, transparent 68%, rgba(4,7,14,0.65) 100%); } body[data-tod="night"] .hs-sun { /* becomes a moon glow, high right */ background: radial-gradient(circle 60px at 78% 18%, rgba(230,237,243,0.75) 0%, rgba(210,222,235,0.2) 30%, transparent 60%); } body[data-tod="night"] .hs-fireflies .firefly { box-shadow: 0 0 9px rgba(255,224,130,0.95); }