.foundation-specimen{margin-top:32px}.foundation-section-heading{justify-content:space-between;align-items:center;gap:16px;display:flex}.foundation-section-heading>div{gap:8px;display:flex}.foundation-specimen button{cursor:pointer;border:.5px solid var(--hh-line-strong);border-radius:var(--hh-radius-md);background:var(--hh-bg-raised);min-height:44px;color:var(--hh-ink);padding:10px 16px}.foundation-specimen button[aria-pressed=true]{background:var(--hh-primary);color:var(--hh-on-primary)}.foundation-swatches{grid-template-columns:repeat(6,minmax(0,1fr));gap:16px;margin:24px 0;display:grid}.foundation-swatches>div{gap:8px;min-width:0;font-size:12px;display:grid}.foundation-swatches i{border-radius:var(--hh-radius-md);border:.5px solid var(--hh-line-strong);height:100px;display:block}.foundation-swatches code{overflow-wrap:anywhere;color:var(--hh-ink-muted);font-size:12px}.foundation-type{border-top:.5px solid var(--hh-line);grid-template-columns:1fr 1fr;gap:32px;padding:32px 0;display:grid}.foundation-type>div>span{letter-spacing:-.05em;font-size:72px;line-height:1.2}.foundation-type small{color:var(--hh-ink-muted)}.foundation-type h4{margin:0 0 16px;font-size:20px}.foundation-shapes{gap:16px;display:flex}.foundation-shapes i{border:.5px solid var(--hh-line-strong);border-radius:6px;width:64px;height:64px;display:block}.foundation-shapes i:nth-child(2){border-radius:16px}.foundation-shapes i:last-child{border-radius:50%}.foundation-values{border-block:.5px solid var(--hh-line);padding:12px 0}.foundation-values summary{cursor:pointer;min-height:44px}.foundation-values label{gap:8px;max-width:420px;margin:16px 0;display:grid}.foundation-values input{background:var(--hh-bg-raised);border:.5px solid var(--hh-line-strong);color:var(--hh-ink);border-radius:var(--hh-radius-md);padding:12px}.foundation-values dl>div{border-bottom:.5px solid var(--hh-line);grid-template-columns:1fr 2fr;gap:24px;padding:12px 0;display:grid}.foundation-values dd{overflow-wrap:anywhere;min-width:0;margin:0}.foundation-values dt{overflow-wrap:anywhere;min-width:0}.foundation-values code{font-size:12px}@media (width<=700px){.foundation-swatches{grid-template-columns:repeat(3,minmax(0,1fr))}.foundation-swatches i{height:64px}.foundation-type{grid-template-columns:1fr}.foundation-section-heading{flex-direction:column;align-items:start}.foundation-values dl>div{grid-template-columns:1fr;gap:8px}}