@keyframes --art-liker-fade{to{opacity:1}}@keyframes --art-liker-skeleton{0%{background-position:200% 0}to{background-position:-200% 0}}@keyframes --art-liker-fade-out{to{opacity:0}}@keyframes --art-liker-like-pop{0%{transform:scale(1)}18%{transform:scale(1.4)}to{transform:scale(1)}}art-liker{--art-liker-ink:#1c1a18;--art-liker-secondary:#5a5752;--art-liker-tertiary:#908c87;--art-liker-inverse-surface:#1c1a18;--art-liker-inverse-text:#f4ede2;--art-liker-border-strong:#c7c3be;--art-liker-surface:#fff;--art-liker-shadow:0 2.4rem 7rem -2rem rgba(28,26,24,.3);--art-liker-aspect-ratio:1.65;align-items:center;color:var(--art-liker-ink);display:flex;flex-direction:column;font-family:var(--font-content);gap:clamp(1.8rem,4vw,2.6rem);margin-inline:auto;max-width:94rem;padding-block:clamp(1.8rem,3vw,3.6rem)}art-liker[hidden]{display:none}art-liker .masthead{align-items:center;display:flex;flex-direction:column;text-align:center}art-liker .kicker{color:var(--art-liker-secondary);font-size:1.2rem;font-weight:700;letter-spacing:.2em;text-transform:uppercase}art-liker .feature-title{font-family:var(--font-display);font-size:clamp(3.4rem,8vw,4.8rem);font-weight:400;line-height:1;margin-top:1.4rem}@media(min-width:980px){art-liker .feature-title{font-size:clamp(3.4rem,4.2vw,5.8rem)}}art-liker .art-liker-body{align-items:center;display:flex;flex-direction:column;gap:clamp(1.8rem,4vw,2.6rem);width:100%}art-liker .card{aspect-ratio:var(--art-liker-aspect-ratio);background-color:var(--art-liker-surface);overflow:hidden;position:relative;width:100%}@media(min-width:980px){art-liker .card{box-shadow:var(--art-liker-shadow)}}art-liker .skeleton{animation:--art-liker-skeleton 2s ease-in-out infinite;background-image:linear-gradient(135deg,var(--primitive-ivory-100) 25%,var(--primitive-ivory-300) 50%,var(--primitive-ivory-100) 75%);background-size:200% 100%}art-liker .skeleton-line{display:block;height:1.4rem}art-liker .skeleton-line.title{max-width:60%;width:18rem}art-liker .skeleton-line.sub{max-width:40%;width:12rem}art-liker .roomview{display:none;height:100%;inset:0;position:absolute;width:100%}art-liker .roomview.done{animation:--art-liker-fade .5s var(--ease,ease) forwards;display:block;opacity:0}art-liker .roomview.leaving{animation:--art-liker-fade-out .15s var(--ease,ease) forwards;opacity:1}art-liker .roomview svg{display:block;height:100%;width:100%}art-liker .actionbar{align-items:center;display:grid;gap:1.6rem;grid-template-columns:1fr;justify-items:center;text-align:center;width:100%}@media(min-width:980px){art-liker .actionbar{gap:clamp(2rem,3vw,4.4rem);grid-template-columns:1fr auto 1fr;text-align:left}}art-liker .meta-left{align-items:center;display:flex;flex-direction:column;gap:.6rem;min-width:0}@media(min-width:980px){art-liker .meta-left{align-items:flex-start}}art-liker .meta-title{font-family:var(--font-display);font-size:clamp(2.2rem,2.1vw,3rem);font-weight:400;line-height:1.05}art-liker .meta-sub{color:var(--art-liker-secondary);font-size:1.5rem}art-liker .meta-sub .dot{color:var(--art-liker-tertiary);margin-inline:.8rem}art-liker .controls{display:flex;gap:clamp(1.4rem,1.4vw,1.8rem)}@media(min-width:980px){art-liker .controls{justify-self:center}}art-liker .ctl{align-items:center;background-color:var(--art-liker-surface);border:.1rem solid var(--art-liker-ink);color:var(--art-liker-ink);cursor:pointer;display:flex;height:5.6rem;justify-content:center;transition:transform .14s ease,background-color .18s ease,color .18s ease;width:5.6rem}@media(min-width:980px){art-liker .ctl{height:5.8rem;width:5.8rem}}art-liker .ctl svg{height:2.3rem;width:2.3rem}art-liker .ctl:active{transform:scale(.95)}art-liker .ctl.like{background-color:var(--art-liker-inverse-surface);border-color:var(--art-liker-inverse-surface);color:var(--art-liker-inverse-text)}art-liker .ctl.like.liked svg{animation:--art-liker-like-pop .25s var(--ease,ease);transform-origin:center}art-liker .meta-link{align-items:center;border-bottom:.1rem solid var(--art-liker-border-strong);color:var(--art-liker-secondary);display:inline-flex;font-size:1.2rem;font-weight:700;gap:.7rem;letter-spacing:.14em;padding-bottom:.4rem;text-decoration:none;text-transform:uppercase;white-space:nowrap}@media(min-width:980px){art-liker .meta-link{justify-self:end}}art-liker .meta-link svg{height:1.3rem;width:1.3rem}@media(hover:hover)and (pointer:fine){art-liker .ctl.dislike:hover{background-color:var(--art-liker-inverse-surface);color:var(--art-liker-inverse-text)}art-liker .ctl.like:hover{filter:brightness(1.25)}art-liker .meta-link:hover{border-color:var(--art-liker-ink);color:var(--art-liker-ink)}}