.c64-hero{padding-bottom:1.5rem}.c64-privacy,.c64-panel,.c64-results,.c64-card{border:1px solid var(--border,#d8d2c5);border-radius:18px;background:#fff;padding:clamp(1rem,2.5vw,1.5rem);margin:1.25rem 0}.c64-privacy{background:#f6f2e8}.c64-panel{display:grid;gap:1rem}.c64-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem}.c64-field{display:grid;gap:.45rem;font-weight:700}.c64-field input,.c64-field select{font:inherit;width:100%;min-height:48px;padding:.7rem .8rem;border:1px solid #817a6d;border-radius:10px;background:#fff;color:#171717}.c64-actions{display:flex;flex-wrap:wrap;gap:.65rem}.c64-status{min-height:1.5em;font-weight:700}.c64-output{white-space:pre-wrap;overflow-wrap:anywhere;background:#f4f1ea;border-radius:12px;padding:1rem;max-height:22rem;overflow:auto}.c64-media{position:relative;display:grid;place-items:center;border:1px solid #d8d2c5;border-radius:14px;overflow:hidden;background:repeating-conic-gradient(#eee 0 25%,#fff 0 50%) 50%/24px 24px;max-width:100%}.c64-media canvas,.c64-media video{display:block;max-width:100%;height:auto;touch-action:manipulation}.c64-media video{width:100%}.c64-marker{position:absolute;width:24px;height:24px;border:3px solid #fff;border-radius:50%;box-shadow:0 0 0 2px #111;transform:translate(-50%,-50%);pointer-events:none}.c64-color-result{display:grid;grid-template-columns:100px 1fr;gap:1rem;align-items:center}.c64-sampled{width:100px;height:100px;border-radius:14px;border:1px solid #aaa}.c64-values{display:grid;gap:.5rem}.c64-values div{overflow-wrap:anywhere}.c64-swatches{display:grid;grid-template-columns:repeat(auto-fit,minmax(125px,1fr));gap:.75rem}.c64-swatch{display:grid;gap:.55rem;text-align:center}.c64-color{height:110px;border:1px solid #aaa;border-radius:14px}.c64-notes{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem}.c64-related{display:flex;flex-wrap:wrap;gap:.7rem}.c64-related a{border:1px solid #d8d2c5;border-radius:999px;padding:.55rem .8rem;text-decoration:none}.c64-favicon-preview{width:256px;max-width:100%;image-rendering:auto}.c64-panel :focus-visible,.c64-actions :focus-visible,.c64-related a:focus-visible,.c64-media canvas:focus-visible{outline:3px solid #3157c8;outline-offset:3px}@media(max-width:720px){.c64-grid,.c64-notes,.c64-color-result{grid-template-columns:1fr}.c64-actions .button,.c64-actions a{width:100%;justify-content:center}.c64-sampled{width:100%;height:80px}.c64-color{height:90px}}@media(prefers-reduced-motion:reduce){.c64-panel *{scroll-behavior:auto!important;transition:none!important}}