.container{&.open{display:flex;flex-direction:column;align-items:center;gap:1.875rem;.header{display:flex;flex-direction:column;align-items:center;color:var(--color-heading);line-height:1.8;a{color:var(--color);font-weight:500;text-decoration:underline;-webkit-text-decoration-style:solid;text-decoration-style:solid;-webkit-text-decoration-color:var(--color);text-decoration-color:var(--color);text-underline-offset:.1875rem;transition:color .24s var(--ease-fluid);&:focus,&:hover{color:var(--color-display)}}}.grid{display:grid;grid-template-columns:1fr 1fr;grid-gap:1.5rem;gap:1.5rem;.metric-card{display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-start;min-width:18rem;padding:1.125rem;gap:1.125rem;border:.125rem solid transparent;border-radius:.75rem;background-color:var(--background-color-secondary);transition:border-color .24s var(--ease-fluid);.label-wrapper{display:flex;gap:.5em;color:var(--color-heading);font-weight:600}.value{margin:0;color:var(--color);font-size:var(--font-size-display);line-height:1;font-family:var(--font-mono)}&:focus-within,&:hover{border-color:var(--background-color-tertiary)}}}@media (max-width:60rem){.grid{grid-template-columns:1fr;width:100%}}}}