sha256-playground{--hash-panel:#f8fafc;--hash-input:#fff;--hash-text:#172033;--hash-muted:#475569;--hash-border:#94a3b8;--hash-accent:#285bae;--hash-bit:#dbe4ee;border:1px solid var(--hash-border);background:var(--hash-panel);color:var(--hash-text);overflow-wrap:anywhere;color-scheme:light;border-radius:.75rem;margin-block:2rem;padding:clamp(1rem,3vw,1.5rem);font-size:1rem;line-height:1.5;display:block}.dark sha256-playground{--hash-panel:#20252d;--hash-input:#171b22;--hash-text:#f1f5f9;--hash-muted:#cbd5e1;--hash-border:#64748b;--hash-accent:#9ac4ff;--hash-bit:#334155;color-scheme:dark}sha256-playground .hash-heading,sha256-playground .hash-result-heading{justify-content:space-between;align-items:center;gap:.5rem;display:flex}sha256-playground .hash-heading{flex-wrap:wrap}sha256-playground .hash-heading span{color:var(--hash-muted);font-size:.875rem}sha256-playground .hash-note{color:var(--hash-muted);margin-block:.75rem;font-size:.875rem}sha256-playground .hash-inputs{gap:1.25rem;display:grid}sha256-playground .hash-entry{min-width:0}sha256-playground label{font-weight:600;display:block}sha256-playground textarea{border:1px solid var(--hash-border);background:var(--hash-input);width:100%;color:var(--hash-text);resize:vertical;min-height:6rem;font:inherit;border-radius:.375rem;margin-top:.5rem;padding:.75rem;font-weight:400;display:block}sha256-playground .hash-bytes{color:var(--hash-muted);margin-block:.25rem .75rem;font-size:.8rem;display:block}sha256-playground .hash-result-heading{font-size:.875rem}sha256-playground .hash-digest{background:var(--hash-input);min-height:5.5rem;color:var(--hash-text);word-break:break-all;-webkit-user-select:all;-moz-user-select:all;user-select:all;border-radius:.375rem;margin-top:.5rem;padding:.75rem;font-size:.875rem;font-weight:400;line-height:1.65;display:block}sha256-playground .hash-digest:before,sha256-playground .hash-digest:after{content:none}sha256-playground .hash-controls{flex-wrap:wrap;gap:.75rem;margin-top:1rem;display:flex}sha256-playground button{border:1px solid var(--hash-border);background:var(--hash-input);min-height:44px;color:var(--hash-text);cursor:pointer;border-radius:.375rem;padding:.5rem .75rem;font-size:.875rem}sha256-playground button:hover:not(:disabled){border-color:var(--hash-accent);color:var(--hash-accent)}sha256-playground button:disabled{cursor:not-allowed;opacity:.5}sha256-playground :is(button,textarea,code):focus-visible{outline:2px solid var(--hash-accent);outline-offset:3px}sha256-playground .hash-copy{place-items:center;width:44px;padding:0;display:grid}sha256-playground .hash-check-icon,sha256-playground [data-copied] .hash-copy-icon{display:none}sha256-playground [data-copied] .hash-check-icon{display:initial}sha256-playground .hash-status{min-height:3rem;margin-block:1rem;font-size:.875rem}sha256-playground .hash-bits{grid-template-columns:repeat(16,minmax(0,1fr));gap:3px;display:grid}sha256-playground .hash-bits span{aspect-ratio:1;background:var(--hash-bit);border-radius:2px;place-items:center;font-size:.7rem;display:grid}sha256-playground .hash-bits .is-different{background:var(--hash-accent);color:var(--hash-input)}@media (width>=640px){sha256-playground .hash-inputs{grid-template-columns:repeat(2,minmax(0,1fr))}sha256-playground .hash-bits{grid-template-columns:repeat(32,minmax(0,1fr))}}