.box{gap:calc(var(--spacing) * 1);grid-template-columns:repeat(20,minmax(0,1fr));display:grid}@media (min-width:64rem){.box{gap:calc(var(--spacing) * 1.5)}}.box .flash{background-color:#4fa38c;animation:2s infinite flash}.block{border-radius:var(--radius-sm)}.block.past{background-color:#98c3b9;background-color:color-mix(in srgb, var(--colors-emerald-300) var(--un-bg-opacity), transparent) }@property --un-bg-opacity{syntax:"<percentage>";inherits:false;initial-value:100%}@supports (color:color-mix(in lab, red, red)){.block.past{background-color:color-mix(in oklab, var(--colors-emerald-300) var(--un-bg-opacity), transparent) }}.block.sleep{background-color:color-mix(in srgb, var(--colors-blue-300) var(--un-bg-opacity), transparent) }@supports (color:color-mix(in lab, red, red)){.block.sleep{background-color:color-mix(in oklab, var(--colors-blue-300) var(--un-bg-opacity), transparent) }}.block.work{background-color:color-mix(in srgb, var(--colors-stone-300) var(--un-bg-opacity), transparent) }@supports (color:color-mix(in lab, red, red)){.block.work{background-color:color-mix(in oklab, var(--colors-stone-300) var(--un-bg-opacity), transparent) }}.block.child{background-color:color-mix(in srgb, var(--colors-rose-300) var(--un-bg-opacity), transparent) }@supports (color:color-mix(in lab, red, red)){.block.child{background-color:color-mix(in oklab, var(--colors-rose-300) var(--un-bg-opacity), transparent) }}.block.parents{background-color:color-mix(in srgb, var(--colors-slate-DEFAULT) var(--un-bg-opacity), transparent) }@supports (color:color-mix(in lab, red, red)){.block.parents{background-color:color-mix(in oklab, var(--colors-slate-DEFAULT) var(--un-bg-opacity), transparent) }}.block.surplus{background-color:color-mix(in srgb, var(--colors-gray-100) var(--un-bg-opacity), transparent) }@supports (color:color-mix(in lab, red, red)){.block.surplus{background-color:color-mix(in oklab, var(--colors-gray-100) var(--un-bg-opacity), transparent) }}.block.retired{background-color:color-mix(in srgb, var(--colors-orange-300) var(--un-bg-opacity), transparent) }@supports (color:color-mix(in lab, red, red)){.block.retired{background-color:color-mix(in oklab, var(--colors-orange-300) var(--un-bg-opacity), transparent) }}.waves{transform-origin:bottom;transition:transform .4s}.wave{animation:1s linear infinite wave}.wave--front{z-index:2}.wave--back{z-index:1;animation-direction:reverse}.water:first-of-type{transform:translate(-100%)}@keyframes wave{0%{transform:translateZ(0)}50%{transform:translate(50%,.5em)}to{transform:translate(100%)}}