/* The same mark interaction on reading pages and interactive hook modules. */
[data-claus-brand] {
  min-width:44px;
  min-height:44px;
  border-radius:4px;
  touch-action:manipulation;
  -webkit-tap-highlight-color:transparent;
}
[data-claus-brand] svg {transition:transform 180ms cubic-bezier(.2,.7,.2,1);transform-origin:center}
[data-claus-brand]:focus-visible {outline:2px solid #000;outline-offset:4px}
@media(hover:hover) and (pointer:fine) {
  [data-claus-brand]:hover svg {transform:translateY(-1px) scale(1.04)}
}
[data-claus-brand]:active svg {transform:scale(.96)}
#claus-ink-transition {position:fixed;inset:0;width:100%;height:100%;pointer-events:none;z-index:20}
#claus-ink-transition.is-active {pointer-events:auto}
html[data-brand-arrival]::after {content:'';position:fixed;inset:0;background:#000;z-index:19;pointer-events:none}
@media(prefers-reduced-motion:reduce) {
  [data-claus-brand] svg {transition:none;transform:none!important}
}