:root{--base-font-size: clamp(18px, 1.2vw + 16px, 20px)}html{font-size:var(--base-font-size);-webkit-text-size-adjust:100%}body{font-family:Arial,sans-serif;font-size:1rem;margin:0;padding:20px;background-color:Canvas;color:CanvasText}main{max-width:1024px;margin:0 auto}input[type=date]{display:block;width:100%;box-sizing:border-box;padding:10px;border-radius:5px;font-size:.8rem}.outputs{position:relative;display:flex;flex-direction:column-reverse;align-items:center;justify-content:space-between;gap:8px;margin:12px 0;line-height:1.5}.outputs>div:not(.input){margin-bottom:10px}.outputs .display.arrows{display:flex;flex-direction:column;align-items:center}.outputs .display.arrows>*:first-child,.outputs .display.arrows>*:last-child{display:inline-block;transform:rotate(90deg);transform-origin:center;-webkit-transform:rotate(90deg);-webkit-transform-origin:center}.centered{text-align:center}.formattedDate{font-size:1.4;font-weight:700}@media (min-width: 712px){.outputs{flex-direction:row;align-items:end;justify-content:space-between;gap:16px}.outputs .display.arrows{flex-direction:row;white-space:nowrap}.outputs .display.arrows>*:first-child,.outputs .display.arrows>*:last-child{transform:none;-webkit-transform:none;margin:0 .25em}.formattedDate{font-size:1.4rem}}.instructions{margin-top:48px;padding-top:32px;border-top:1px solid currentColor;opacity:.8}.instructions h2{font-size:1.2rem;margin-top:0}.instructions h3{font-size:1rem;margin-top:24px;margin-bottom:8px}.instructions p{line-height:1.6}.instructions .examples{list-style:none;padding:0;margin:12px 0}.instructions .examples li{margin:8px 0}.instructions .examples a{color:LinkText;text-decoration:underline}.instructions .examples a:visited{color:VisitedText}.instructions .examples a:hover{opacity:.8}.instructions .example-description{opacity:.7;font-size:.9rem}.instructions .tip{margin-top:24px;font-size:.95rem;opacity:.9}