.span-warn{border:1px solid color-mix(in srgb, #b42318 45%, var(--rule));background:#b423181a;border-radius:8px;margin:1rem 0;padding:.75rem 1rem;font-size:.9rem}.span-grid{grid-template-columns:repeat(auto-fit,minmax(8rem,1fr));gap:.75rem;margin:1.25rem 0;display:grid}.span-f{color:var(--muted);flex-direction:column;gap:.3rem;font-size:.8rem;display:flex}.span-f select{border:1px solid var(--rule);background:var(--bg);color:var(--fg);font-family:var(--font-sans);border-radius:6px;padding:.5rem;font-size:1rem}.span-out{border:1px solid var(--rule);background:var(--code-bg);text-align:center;border-radius:10px;padding:1.25rem}.span-big{font-family:var(--font-mono);color:var(--site-accent,#2c63d6);font-size:2.6rem;font-weight:800;line-height:1}.span-lbl{margin-top:.4rem;font-size:.9rem}.span-note{color:var(--muted);margin-top:.3rem;font-size:.8rem}