html:not(.dark){--bg: var(--corn)}html.dark{--bg: var(--primary)}.moon{background:var(--bg);height:100px;width:100px;border-radius:100%}.moon:before{content:"";position:absolute;opacity:.1;background:var(--bg);height:140px;width:140px;border-radius:100%;left:-20px;top:-20px}.moon:after{content:"";position:absolute;background:var(--bg);opacity:.2;height:120px;width:120px;border-radius:100%;left:-10px;top:-10px}.shade{position:absolute;left:30px;top:10px;opacity:.3;background:grey;height:20px;width:20px;border-radius:100%}.shade:before{content:"";position:absolute;background:grey;height:10px;width:10px;border-radius:100%;top:30px}.shade:after{content:"";position:absolute;background:grey;height:8px;width:8px;border-radius:100%;left:-15px;top:15px}