.prefs{--viz-tc-light-bg:#f6f5f5;--viz-tc-light-line:#e3e0df;--viz-tc-light-ink:#1d1b1a;--viz-tc-dark-bg:#17171a;--viz-tc-dark-ink:#f5f4f2;--viz-tc-sys-ink:#8d8b89}.theme-cards{grid-template-columns:repeat(3,1fr);gap:8px;display:grid}.tc{border:1.5px solid var(--line);border-radius:var(--r-md);background:var(--surface);cursor:pointer;transition:all .3s var(--spring);flex-direction:column;align-items:center;gap:8px;padding:8px 8px 10px;font-size:12.5px;font-weight:600;display:flex}.tc:hover{transform:translateY(-2px)}.tc.on{border-color:var(--ink);box-shadow:0 0 0 3px rgba(var(--accent-rgb),.14)}.tc-prev{border-radius:8px;flex-direction:column;gap:4px;width:100%;height:46px;padding:7px;display:flex}.tc-prev i{border-radius:3px;height:6px;display:block}.tc-prev i:first-child{width:60%}.tc-prev i:nth-child(2){width:85%}.tc-prev i:nth-child(3){width:40%}.tc.light .tc-prev{background:var(--viz-tc-light-bg);border:1px solid var(--viz-tc-light-line)}.tc.light .tc-prev i{background:var(--viz-tc-light-ink)}.tc.dark .tc-prev{background:var(--viz-tc-dark-bg)}.tc.dark .tc-prev i{background:var(--viz-tc-dark-ink)}.tc.system .tc-prev{background:linear-gradient(135deg,var(--viz-tc-light-bg) 50%,var(--viz-tc-dark-bg) 50%);border:1px solid var(--viz-tc-light-line)}.tc.system .tc-prev i{background:var(--viz-tc-sys-ink)}.tc .tc-prev i:nth-child(3){background:var(--accent)}.swatches{grid-template-columns:repeat(6,1fr);gap:6px;display:grid}.sw{width:auto;height:auto;box-shadow:none;color:var(--muted);cursor:pointer;background:0 0;border:0;border-radius:0;flex-direction:column;align-items:center;gap:6px;padding:0;font-size:10.5px;font-weight:600;display:flex}.sw i{border:2px solid var(--surface);width:32px;height:32px;box-shadow:0 0 0 1px var(--line);transition:transform .3s var(--spring),box-shadow .2s;border-radius:50%}.sw:hover i{transform:scale(1.12)}.sw.on i{box-shadow:0 0 0 2px var(--ink)}.sw.on{color:var(--ink)}.swatches{--viz-sw-graphite:#1d1b1a;--viz-sw-graphite-2:#d5d1d0;--viz-sw-ember:#ec3013;--viz-sw-cobalt:#2f5bea;--viz-sw-teal:#0e8f8f;--viz-sw-emerald:#0f8a5f;--viz-sw-violet:#7a3ff2}.sw[data-swatch=graphite] i{background:linear-gradient(135deg,var(--viz-sw-graphite) 50%,var(--viz-sw-graphite-2) 50%)}.sw[data-swatch=ember] i{background:var(--viz-sw-ember)}.sw[data-swatch=cobalt] i{background:var(--viz-sw-cobalt)}.sw[data-swatch=teal] i{background:var(--viz-sw-teal)}.sw[data-swatch=emerald] i{background:var(--viz-sw-emerald)}.sw[data-swatch=violet] i{background:var(--viz-sw-violet)}.prefs .pref-note{color:var(--muted);margin-block:8px 0;font-size:12px}