/* AroundThomasville live sky scenes (24.8.480). Pairs with sky-scene.js. Scoped to [data-sky]. */
[data-sky].sky-on{position:relative;isolation:isolate;overflow:hidden}
.sky-layers,.sky-bg,.sky-wx{position:absolute;inset:0;pointer-events:none;overflow:hidden}
.sky-layers{z-index:-1;border-radius:inherit}
.sky-bg{transition:background 1.2s}
.sky-bg[data-phase=dawn]{background:linear-gradient(180deg,#7FA6C4 0%,#D9C6B0 45%,#F4C98A 80%,#F2B26A 100%)}
.sky-bg[data-phase=day]{background:linear-gradient(180deg,#7EC3E3 0%,#B9E0EF 55%,#EAF5F2 100%)}
.sky-bg[data-phase=dusk]{background:linear-gradient(180deg,#2E4A63 0%,#6F6A70 38%,#C98B4E 75%,#E8B266 100%)}
.sky-bg[data-phase=night]{background:linear-gradient(180deg,#0B1520 0%,#15253A 60%,#1F3245 100%)}
.sky-overcast{position:absolute;inset:0;background:linear-gradient(180deg,#5D666E,#9AA3A8);opacity:0;transition:opacity 1s}
.sky-bg[data-phase=night] .sky-overcast{background:linear-gradient(180deg,#0E1318,#262E35)}
.sky-stars{position:absolute;inset:0;opacity:0;transition:opacity 1.2s}
.sky-bg[data-phase=night] .sky-stars{opacity:1}.sky-bg[data-phase=dusk] .sky-stars{opacity:.35}
.sky-stars i{position:absolute;width:2px;height:2px;border-radius:50%;background:#FFF6E2;animation:sky-twinkle 3s ease-in-out infinite}
.sky-orb{position:absolute;border-radius:50%;transform:translate(-50%,-50%);transition:left 1.2s,top 1.2s,opacity 1s}
.sky-sun{width:72px;height:72px;background:radial-gradient(circle,#FFF3C4 0 35%,#F7CF5A 60%,#EFA63A 100%);box-shadow:0 0 50px 18px rgba(247,207,90,.55)}
.sky-bg[data-phase=dawn] .sky-sun,.sky-bg[data-phase=dusk] .sky-sun{background:radial-gradient(circle,#FFE3B0 0 30%,#F0A24E 70%,#D9782F 100%);box-shadow:0 0 60px 24px rgba(240,162,78,.5)}
.sky-moon{width:52px;height:52px;background:radial-gradient(circle at 35% 35%,#FFFBEA,#E4E0CC 70%);box-shadow:0 0 34px 8px rgba(255,251,234,.25)}
.sky-cloud{position:absolute;width:130px;height:40px;border-radius:50px;background:rgba(255,255,255,.88);opacity:var(--co,.9);animation:sky-drift linear infinite}
.sky-cloud::before,.sky-cloud::after{content:'';position:absolute;background:inherit;border-radius:50%}
.sky-cloud::before{width:60px;height:60px;left:20px;top:-30px}.sky-cloud::after{width:44px;height:44px;left:68px;top:-19px}
.sky-cloud.grey{background:rgba(120,128,136,.9)}.sky-cloud.dark{background:rgba(58,64,72,.95)}
.sky-wx i{position:absolute;top:-30px;display:block}
.sky-drop{width:2px;height:18px;background:linear-gradient(transparent,rgba(214,232,245,.95));animation:sky-fall linear infinite}
.sky-hail{width:6px;height:6px;border-radius:50%;background:#F4FAFF;box-shadow:0 0 0 1px rgba(80,100,120,.4);animation:sky-fall linear infinite}
.sky-flake{width:6px;height:6px;border-radius:50%;background:#fff;box-shadow:0 0 6px rgba(255,255,255,.9);animation:sky-snow linear infinite}
.sky-heat{width:70px;height:20px;border-top:3px solid rgba(255,140,40,.4);border-radius:50%;animation:sky-rise ease-in infinite}
.sky-streak{height:2px;width:110px;background:linear-gradient(90deg,transparent,rgba(255,255,255,.75),transparent);animation:sky-wind linear infinite}
.sky-debris{width:5px;height:4px;background:#5A4A3A;animation:sky-swirl linear infinite}
.sky-flash{position:absolute;inset:0;background:#fff;opacity:0;animation:sky-flash 7s infinite}
.sky-haze{position:absolute;inset:0}
.sky-wx[data-kind=hot] .sky-haze{background:radial-gradient(circle at 85% 15%,rgba(255,150,40,.5),transparent 55%),linear-gradient(0deg,rgba(255,170,60,.28),transparent 60%);animation:sky-shimmer 3s ease-in-out infinite}
.sky-wx[data-kind=cold] .sky-haze{background:radial-gradient(ellipse at 0 0,rgba(255,255,255,.85),transparent 35%),radial-gradient(ellipse at 100% 0,rgba(255,255,255,.75),transparent 30%),radial-gradient(ellipse at 0 100%,rgba(255,255,255,.7),transparent 30%),radial-gradient(ellipse at 100% 100%,rgba(255,255,255,.85),transparent 35%),rgba(190,220,240,.2)}
.sky-wx[data-kind=snow] .sky-haze{background:linear-gradient(0deg,rgba(255,255,255,.9) 0 12px,transparent 30px)}
.sky-funnel{position:absolute;right:8%;top:-8px;width:140px;height:112%;animation:sky-sway 2.6s ease-in-out infinite;transform-origin:top center}
.sky-funnel span{position:absolute;left:50%;border-radius:50%;background:rgba(50,56,62,.78);transform:translateX(-50%);animation:sky-spinx .6s linear infinite}
.sky-spiral{position:absolute;right:-120px;top:50%;width:420px;height:420px;margin-top:-210px;border-radius:50%;background:conic-gradient(from 0deg,rgba(255,255,255,0),rgba(230,236,240,.55),rgba(255,255,255,0) 30%,rgba(230,236,240,.45) 55%,rgba(255,255,255,0) 70%,rgba(230,236,240,.5) 90%,rgba(255,255,255,0));-webkit-mask:radial-gradient(circle,transparent 0 26px,#000 28px);mask:radial-gradient(circle,transparent 0 26px,#000 28px);animation:sky-spin 6s linear infinite;filter:blur(2px)}
@keyframes sky-twinkle{50%{opacity:.25}}
@keyframes sky-drift{from{transform:translateX(-200px)}to{transform:translateX(1400px)}}
@keyframes sky-fall{to{transform:translate(var(--dx,-30px),620px)}}
@keyframes sky-snow{0%{transform:translate(0,0)}50%{transform:translate(22px,310px)}100%{transform:translate(-8px,620px)}}
@keyframes sky-rise{0%{transform:translateY(0) scaleX(1);opacity:0}30%{opacity:1}100%{transform:translateY(-260px) scaleX(1.6);opacity:0}}
@keyframes sky-wind{from{transform:translateX(-200px)}to{transform:translateX(1400px)}}
@keyframes sky-swirl{0%{transform:rotate(0) translateX(30px) rotate(0)}100%{transform:rotate(360deg) translateX(30px) rotate(-360deg)}}
@keyframes sky-flash{0%,92%,96%,100%{opacity:0}93%{opacity:.7}94%{opacity:.1}95%{opacity:.55}}
@keyframes sky-shimmer{50%{opacity:.7}}
@keyframes sky-sway{0%,100%{transform:translateX(-18px) skewX(6deg)}50%{transform:translateX(18px) skewX(-6deg)}}
@keyframes sky-spinx{50%{transform:translateX(-46%)}}
@keyframes sky-spin{to{transform:rotate(-360deg)}}
@media(prefers-reduced-motion:reduce){.sky-layers *{animation:none!important}}

/* Readability: content sits on frosted glass, so text stays dark and legible on any sky. */
.sky-glass{background:rgba(255,255,255,.74)!important;-webkit-backdrop-filter:blur(9px);backdrop-filter:blur(9px);border:1px solid rgba(255,255,255,.6)!important;color:#1F2A26!important}

/* Homepage briefing card */
.brief.sky-on{background:none!important;border-color:rgba(37,39,43,.1)}
.brief.sky-on .brief-top>div{background:rgba(255,255,255,.74);-webkit-backdrop-filter:blur(9px);backdrop-filter:blur(9px);border:1px solid rgba(255,255,255,.6);border-radius:16px;padding:12px 14px;color:#1F2A26}
.brief.sky-on .brief-top>div *{color:inherit}
.brief.sky-on .bk{color:#1F4D3A!important}
.brief.sky-on .bsub{color:#3C4844!important}
.brief.sky-on .brief-x{background:rgba(255,255,255,.85);border-color:rgba(37,39,43,.15);color:#1F2A26}
.brief.sky-on .bi{background:rgba(255,255,255,.86)!important;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-color:rgba(255,255,255,.65)!important;color:#1F2A26!important}
.brief.sky-on .bi *{color:inherit}
.brief-sky{display:inline-flex;align-items:center;gap:6px;margin-top:8px;font-size:12.5px;font-weight:800;color:#1F4D3A;background:rgba(31,77,58,.09);border-radius:20px;padding:4px 10px}

/* Homepage Right Now widget */
.card.now.sky-on{background:none!important}
.card.now.sky-on .now-h,.card.now.sky-on .peek,.card.now.sky-on .rail-shortcuts a{background:rgba(255,255,255,.74);-webkit-backdrop-filter:blur(9px);backdrop-filter:blur(9px);border:1px solid rgba(255,255,255,.6);border-radius:16px;color:#1F2A26}
.card.now.sky-on .now-h{padding:8px 12px;border-radius:30px}
.card.now.sky-on .peek{padding:12px}
.card.now.sky-on .rail-time-block{background:rgba(255,255,255,.74);-webkit-backdrop-filter:blur(9px);backdrop-filter:blur(9px);border:1px solid rgba(255,255,255,.6);border-radius:16px;padding:12px;margin:10px 0}
.card.now.sky-on .rail-time-block *,.card.now.sky-on .peek *,.card.now.sky-on .now-h *,.card.now.sky-on .rail-shortcuts a *{color:#1F2A26}
.card.now.sky-on .rail-clock,.card.now.sky-on .rail-date{margin:0}

/* Open-now hero */
.open-hero.sky-on{background:none!important}
.open-hero.sky-on .open-hero-content{background:rgba(255,255,255,.72);-webkit-backdrop-filter:blur(9px);backdrop-filter:blur(9px);border:1px solid rgba(255,255,255,.6);border-radius:22px;padding:22px}
.open-hero.sky-on.sky-dark .open-hero-aside{color:#FFF6E2;text-shadow:0 2px 14px rgba(0,0,0,.5)}
.open-hero.sky-on.sky-dark .open-hero-aside *{color:inherit}
.open-sky{display:inline-flex;align-items:center;gap:6px;margin-left:8px;font-size:12px;font-weight:800;color:#1F4D3A;background:rgba(31,77,58,.09);border-radius:20px;padding:3px 9px}
