body{padding:0;margin:0;width:100dvw;height:100dvh;display:flex;justify-content:center;align-items:center;font-family:Arial,Helvetica,sans-serif}@media (prefers-color-scheme: light){body{background-color:#000;color:#fff}}@media (prefers-color-scheme: dark){body{background-color:#fff;color:#000}}h1{color:#333}.dot-grid{width:100%;display:grid;grid-template-columns:repeat(16,1fr);grid-template-rows:auto}.dot{text-align:center;font-size:3rem;width:fit-content;line-height:1rem}.dot-past{color:#3cb371}.dot-today{color:#0f0}.dot-future{color:#333}