/* Mok Weather — moon phase widget */
.moonbox{padding:22px;display:flex;flex-direction:column;gap:16px;min-width:0}
.moon-main{display:flex;align-items:center;gap:20px;min-width:0}
.moon-fig{position:relative;flex:none;width:118px;aspect-ratio:1;animation:float 8s ease-in-out infinite}
.moon-fig::before{content:"";position:absolute;inset:-26%;border-radius:50%;background:radial-gradient(circle,rgba(205,220,255,calc(.12 + var(--lit,0)*.34)) 0%,transparent 66%);transition:background .8s}
.moon-fig svg{position:relative;width:100%;height:100%;display:block;filter:drop-shadow(0 14px 16px rgba(10,20,50,.35))}
.moon-fig .lit{transition:opacity .8s}
.moon-info{min-width:0;display:grid;gap:2px}
.moon-name{font-size:22px;font-weight:600;line-height:1.25}
.moon-sub{color:var(--ink-2);font-size:14px}
.moon-stats{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.moon-stats>div{padding:10px 14px;display:flex;flex-direction:column;gap:2px;min-width:0}
.moon-stats span{font-size:12px;color:var(--ink-3)}
.moon-stats b{font-weight:600;font-size:15px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.moon-stats small{color:var(--ink-2);font-size:12px}
.moon-strip{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:4px}
.mday{display:flex;flex-direction:column;align-items:center;gap:4px;padding:8px 2px 7px;border-radius:16px;transition:background .3s,transform .4s var(--ease),box-shadow .3s}
.mday:hover{background:rgba(255,255,255,.14);transform:translateY(-3px)}
.mday[aria-pressed=true]{background:linear-gradient(160deg,rgba(255,255,255,.36),rgba(255,255,255,.12));box-shadow:inset 0 1.5px 0 rgba(255,255,255,.55),0 10px 18px -8px var(--shadow)}
.mday svg{width:30px;height:30px}
.mday small{font-size:11px;color:var(--ink-2);white-space:nowrap}
.moon-note{margin:0;font-size:11px;color:var(--ink-3)}