.ch-tile{--ch-rest:color-mix(in srgb, var(--ch-fg,currentColor) 40%, var(--ch-bg,transparent));--ch-glow:color-mix(in srgb, var(--ch-ac,currentColor) 35%, transparent)}.ch-frame{position:relative}.ch-tile:not([data-ch=veil],[data-ch=none]) .ch-frame{padding:10px}.ch-img{border-radius:inherit;display:block;position:relative;overflow:hidden}.ch-title{transition:color .3s}.ch-tile:is(:hover,:focus-visible):not([data-ch=veil],[data-ch=none]) .ch-title{color:var(--ch-ac)}.ch-veil{border-radius:inherit;opacity:0;background:#000;transition:opacity .3s;position:absolute;inset:0}.ch-link{color:#fff;opacity:0;place-items:center;transition:opacity .3s ease-in-out,transform .3s ease-in-out;display:grid;position:absolute;inset:0;transform:scale(0)}.ch-tile[data-ch=veil]:is(:hover,:focus-visible) .ch-veil{opacity:.3}.ch-tile[data-ch=veil]:is(:hover,:focus-visible) .ch-link{opacity:1;transform:scale(1)}.ch-ring{border:2px dashed var(--ch-rest);pointer-events:none;border-radius:50%;transition:border-color .5s;position:absolute;inset:2px}.ch-tile[data-ch=dashedRing] .ch-img,.ch-tile[data-ch=dashedFrame] .ch-img{transition:box-shadow .3s}.ch-tile[data-ch=dashedRing]:is(:hover,:focus-visible) .ch-ring{border-color:var(--ch-ac);animation:8s linear infinite ch-spin}.ch-tile[data-ch=dashedRing]:is(:hover,:focus-visible) .ch-img,.ch-tile[data-ch=dashedFrame]:is(:hover,:focus-visible) .ch-img{box-shadow:0 4px 20px var(--ch-glow)}.ch-halo{background:conic-gradient(var(--ch-ac), color-mix(in srgb, var(--ch-ac) 35%, var(--ch-fg)), var(--ch-ac) 60%, color-mix(in srgb, var(--ch-ac) 55%, var(--ch-bg)), var(--ch-ac));-webkit-mask-composite:xor;-webkit-mask-composite:xor;opacity:0;filter:drop-shadow(0 0 6px color-mix(in srgb, var(--ch-ac) 75%, transparent)) drop-shadow(0 0 14px color-mix(in srgb, var(--ch-ac) 40%, transparent));pointer-events:none;border-radius:50%;padding:3px;transition:opacity .35s,transform .35s;position:absolute;inset:3px;transform:scale(.9);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor,source-over;mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0)}.ch-tile[data-ch=neonHalo] .ch-img img{transition:transform .35s}.ch-tile[data-ch=neonHalo]:is(:hover,:focus-visible) .ch-halo{opacity:1;animation:3.5s linear infinite ch-spin;transform:scale(1)}.ch-tile[data-ch=neonHalo]:is(:hover,:focus-visible) .ch-img img{transform:scale(.94)}.ch-wave{border:2px solid var(--ch-ac);opacity:0;pointer-events:none;border-radius:50%;position:absolute;inset:10px}.ch-tile[data-ch=pulse] .ch-img img{transition:filter .3s}.ch-tile[data-ch=pulse]:is(:hover,:focus-visible) .ch-wave{animation:1.8s ease-out infinite ch-pulse}.ch-tile[data-ch=pulse]:is(:hover,:focus-visible) .ch-wave+.ch-wave{animation-delay:.9s}.ch-tile[data-ch=pulse]:is(:hover,:focus-visible) .ch-img img{filter:brightness(1.12)saturate(1.2)}.ch-ants{pointer-events:none;width:calc(100% - 4px);height:calc(100% - 4px);position:absolute;inset:2px;overflow:visible}.ch-ants rect{fill:none;stroke:var(--ch-rest);stroke-width:1.4px;stroke-dasharray:4.2 3;transition:stroke .5s}.ch-tile[data-ch=dashedFrame]:is(:hover,:focus-visible) .ch-ants rect{stroke:var(--ch-ac);animation:.3s linear infinite ch-march}.ch-tile[data-ch=shine] .ch-img:after{content:"";pointer-events:none;background:linear-gradient(90deg,#0000,#ffffff8c,#0000);width:45%;position:absolute;top:-20%;bottom:-20%;left:-70%;transform:skew(-20deg)}.ch-tile[data-ch=shine] .ch-img{transition:box-shadow .3s}.ch-tile[data-ch=shine]:is(:hover,:focus-visible) .ch-img:after{animation:1.6s ease-in-out infinite ch-shine}.ch-tile[data-ch=shine]:is(:hover,:focus-visible) .ch-img{box-shadow:0 0 0 1px color-mix(in srgb, var(--ch-fg) 35%, transparent)}.ch-tile[data-ch=neonLift] .ch-frame{transition:transform .3s cubic-bezier(.2,.8,.2,1)}.ch-tile[data-ch=neonLift] .ch-img{transition:box-shadow .3s}.ch-tile[data-ch=neonLift]:is(:hover,:focus-visible) .ch-frame{transform:translateY(-6px)}.ch-tile[data-ch=neonLift]:is(:hover,:focus-visible) .ch-img{box-shadow:0 0 0 2px var(--ch-ac), 0 0 0 5px color-mix(in srgb, var(--ch-ac) 30%, transparent), 0 14px 30px color-mix(in srgb, var(--ch-ac) 40%, transparent)}@keyframes ch-spin{to{transform:rotate(360deg)}}@keyframes ch-pulse{0%{opacity:.75;transform:scale(1)}to{opacity:0;transform:scale(1.12)}}@keyframes ch-march{to{stroke-dashoffset:-7.2px}}@keyframes ch-shine{0%{left:-70%}60%,to{left:130%}}@media (prefers-reduced-motion:reduce){.ch-halo,.ch-wave,.ch-tile[data-ch=shine] .ch-img:after{animation:none!important}.ch-tile[data-ch=neonHalo]:is(:hover,:focus-visible) .ch-img img,.ch-tile[data-ch=neonLift]:is(:hover,:focus-visible) .ch-frame,.ch-tile[data-ch=veil] .ch-link{transform:none}.ch-tile[data-ch=pulse]:is(:hover,:focus-visible) .ch-wave{opacity:.8}}
