.demo-tokens{grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(16px,2vw,28px);display:grid}.demo-token{isolation:isolate;color:var(--ink);justify-items:start;gap:10px;padding:20px;text-decoration:none;display:grid;position:relative}.demo-token:before{content:"";z-index:-1;border:2px solid var(--ink);filter:url(#rough);background:#f6f6f4;transition:background .2s;position:absolute;inset:0}.demo-token:hover:before{background:color-mix(in srgb, var(--pink) 6%, #f6f6f4)}.demo-token:focus-visible{outline:2px dashed var(--pink);outline-offset:6px}.demo-token__image{object-fit:contain;justify-self:center;width:100%;height:clamp(160px,17vw,240px)}.demo-token__identity{gap:6px;min-width:0;display:grid}.demo-token__name{font:400 clamp(25px, 2.5vw, 38px)/1 var(--f-display);text-transform:uppercase;overflow-wrap:anywhere}.demo-token__ticker{font:400 22px/1 var(--f-display)}.demo-token__mint{font:13px/1.4 var(--f-mono);color:var(--ink-2)}.demo-token__source{font:500 13px/1.4 var(--f-body);text-underline-offset:3px;text-decoration:underline}.demo-tokens--compact{gap:18px}.demo-tokens--compact .demo-token{padding:14px}.demo-tokens--compact .demo-token__image{height:140px}.demo-tokens--compact .demo-token__name{font-size:clamp(24px,2vw,32px)}.demo-tokens--rows{grid-template-columns:1fr}.demo-tokens--rows .demo-token{grid-template-columns:90px minmax(180px,1fr) auto auto;align-items:center;gap:20px}.demo-tokens--rows .demo-token__image{grid-area:1/1/3;height:80px}.demo-tokens--rows .demo-token__identity{grid-area:1/2/3}.demo-tokens--rows .demo-token__mint{grid-area:1/3/3}.demo-tokens--rows .demo-token__source{grid-area:2/4}.demo-token-note{font:400 14px/1.5 var(--f-body);color:var(--ink-2);margin:0 0 18px}