/* Banner animado Dia/Noite (nuvens, pássaros, sol, lua, estrelas e estrelas cadentes) */
.dn{position:relative;height:168px;overflow:hidden;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;
  background:radial-gradient(120% 140% at 50% 20%,#3f6a97 0%,#123a63 75%);transition:background 1.1s ease;user-select:none;-webkit-user-select:none}
.dn.night{background:radial-gradient(120% 140% at 50% 20%,#0a1230 0%,#04050f 80%)}
.dn *{box-sizing:border-box}
.dn-pstars,.dn-shoots{position:absolute;inset:0;pointer-events:none;opacity:0;transition:opacity 1.2s ease}
.dn.night .dn-pstars,.dn.night .dn-shoots{opacity:1}
.dn-pstars span{position:absolute;width:2px;height:2px;background:#fff;border-radius:50%;animation:dnTwinkle 3s ease-in-out infinite}
@keyframes dnTwinkle{0%,100%{opacity:.15}50%{opacity:.9}}
.dn-shoot{position:absolute;width:2px;height:2px;border-radius:50%;background:#fff;opacity:0;transform:rotate(-32deg);animation:dnShoot 6s linear infinite}
.dn-shoot::before{content:"";position:absolute;top:50%;right:0;width:70px;height:1px;transform:translateY(-50%);background:linear-gradient(90deg,rgba(255,255,255,0),rgba(255,255,255,.9))}
@keyframes dnShoot{0%{opacity:0;transform:rotate(-32deg) translateX(0)}2%{opacity:1}12%{opacity:0;transform:rotate(-32deg) translateX(-140px)}100%{opacity:0;transform:rotate(-32deg) translateX(-140px)}}
.dn-label{position:relative;z-index:2;height:14px;width:200px;text-align:center}
.dn-label span{position:absolute;left:0;right:0;font-size:11px;letter-spacing:5px;color:#e9f1fb;text-transform:uppercase;opacity:0;transform:translateY(4px);transition:opacity .55s ease,transform .55s ease}
.dn-label span.on{opacity:.85;transform:none}
.dn-switch{position:relative;z-index:2;width:min(210px,70%);aspect-ratio:300/96;border-radius:48px;cursor:pointer;padding:0;border:none;outline:none;background:none;-webkit-tap-highlight-color:transparent;
  box-shadow:0 0 0 1px rgba(255,255,255,.35) inset,0 10px 30px rgba(0,0,0,.35)}
.dn-switch:focus-visible{box-shadow:0 0 0 2px #fff,0 0 0 4px rgba(120,170,255,.8)}
.dn-track{position:absolute;inset:0;border-radius:48px;overflow:hidden;background:linear-gradient(100deg,#a9d3e8 0%,#5e9fd6 100%);transition:background 1.1s ease}
.dn-switch.night .dn-track{background:linear-gradient(100deg,#12123f 0%,#2c2f60 100%)}
.dn-track::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(255,255,255,.12),rgba(255,255,255,0) 40%);pointer-events:none;z-index:5}
.dn-stars{position:absolute;inset:0;opacity:0;transition:opacity 1s ease;z-index:1}
.dn-switch.night .dn-stars{opacity:1}
.dn-stars span{position:absolute;width:2px;height:2px;border-radius:50%;background:#fff;animation:dnTwinkle 3s ease-in-out infinite}
.dn-tshoot{position:absolute;inset:0;pointer-events:none;opacity:0;overflow:hidden;z-index:2;transition:opacity 1s ease}
.dn-switch.night .dn-tshoot{opacity:1}
.dn-tshoot i{position:absolute;width:3px;height:3px;border-radius:50%;background:#fff;opacity:0;transform:rotate(-32deg);box-shadow:0 0 5px rgba(255,255,255,.9);animation:dnTShoot 3.5s linear infinite}
.dn-tshoot i::before{content:"";position:absolute;top:50%;right:0;width:40px;height:1px;transform:translateY(-50%);background:linear-gradient(90deg,rgba(255,255,255,0),rgba(255,255,255,.85))}
.dn-tshoot i:nth-child(1){top:25%;left:72%}
.dn-tshoot i:nth-child(2){top:48%;left:48%;animation-delay:-1.7s}
.dn-tshoot i:nth-child(3){top:18%;left:30%;animation-delay:-2.8s}
@keyframes dnTShoot{0%{opacity:0;transform:rotate(-32deg) translateX(0)}5%{opacity:1}18%{opacity:0;transform:rotate(-32deg) translateX(-55px)}100%{opacity:0;transform:rotate(-32deg) translateX(-55px)}}
.dn-moon{position:absolute;left:11%;top:50%;width:19%;aspect-ratio:1;transform:translateY(-50%) rotate(-20deg);opacity:.35;transition:opacity .45s ease;z-index:2;filter:drop-shadow(0 0 6px rgba(255,244,190,.6))}
.dn-moon svg{width:100%;height:100%;display:block}
.dn-switch.night .dn-moon{opacity:1}
.dn-sun{position:absolute;right:12%;top:50%;width:13%;aspect-ratio:1;transform:translateY(-50%);border-radius:50%;background:radial-gradient(circle at 35% 30%,#fff6c8,#ffe98a 60%,#f7d55c 100%);box-shadow:0 0 14px 4px rgba(255,233,138,.8);transition:opacity .8s ease;z-index:2}
.dn-switch.night .dn-sun{opacity:0}
.dn-birds{position:absolute;top:26%;left:0;width:100%;height:20%;opacity:.9;transition:opacity .8s ease;z-index:2}
.dn-switch.night .dn-birds{opacity:0}
.dn-bird{position:absolute;top:0;width:16px;height:9px;animation:dnFly 7s linear infinite}
.dn-bird .wing{transform-origin:7px 6px;animation:dnFlap .5s ease-in-out infinite}
.dn-bird.b2{animation-delay:-2.3s;top:35%}.dn-bird.b2 .wing{animation-delay:-.18s}
.dn-bird.b3{animation-delay:-4.6s;top:8%}.dn-bird.b3 .wing{animation-delay:-.32s}
@keyframes dnFly{from{left:75%}to{left:-15%}}
@keyframes dnFlap{0%,100%{transform:scaleY(1)}50%{transform:scaleY(.35)}}
.dn-clouds{position:absolute;left:0;right:0;bottom:-4%;height:48%;overflow:hidden;pointer-events:none;z-index:3}
.dn-ctrack{position:absolute;left:0;bottom:0;width:100%;height:100%;display:flex;flex-wrap:nowrap;animation:dnCloud 16s linear infinite}
.dn-ctrack img{flex:0 0 50%;width:55%;height:100%;display:block;object-fit:contain;object-position:center bottom;pointer-events:none;user-select:none;-webkit-user-drag:none;transform:scale(1.12);margin-left:-2.5%;margin-right:-2.5%}
@keyframes dnCloud{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.dn-knob{position:absolute;top:8%;left:2.5%;width:27%;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle at 32% 30%,#fff,#fdfdfd 55%,#f4f4f4 100%);
  box-shadow:0 0 20px 6px rgba(255,255,255,.05),0 0 26px 10px rgba(255,244,190,.55);transition:left .65s cubic-bezier(.65,-.1,.25,1.15),box-shadow 1.1s ease;z-index:6}
.dn-switch.night .dn-knob{box-shadow:0 0 18px 6px rgba(255,255,255,.9),0 0 50px 16px rgba(160,190,255,.55)}
.dn-switch.on .dn-knob{left:70.5%}