/* A round response to the same paper, dots and authored icons. No automatic loops. */
.site-frame{isolation:isolate}
.content-brush{position:fixed;left:0;top:0;width:280px;height:280px;z-index:-1;pointer-events:none;opacity:0;background:radial-gradient(circle at 38% 45%,rgba(48,82,123,.085),transparent 48%),radial-gradient(circle at 62% 55%,rgba(204,36,69,.055),transparent 48%);transition:opacity .28s cubic-bezier(.16,1,.3,1)}
.content-brush.is-visible{opacity:1}
body[data-page=music] .content-brush{background:radial-gradient(circle at 38% 45%,rgba(48,82,123,.075),transparent 48%),radial-gradient(circle at 62% 55%,rgba(211,168,78,.065),transparent 48%)}
body[data-page=article] .content-brush{background:radial-gradient(circle at 38% 45%,rgba(204,36,69,.055),transparent 48%),radial-gradient(circle at 62% 55%,rgba(231,104,47,.065),transparent 48%)}
body.is-background-point{cursor:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24'%3E%3Ccircle cx='12' cy='12' r='5' fill='none' stroke='%23303234' stroke-opacity='.72' stroke-width='1'/%3E%3C/svg%3E") 12 12,auto!important}
body.is-background-point :is(a,button){cursor:pointer!important}
body.is-background-point :is(input,textarea,[contenteditable]){cursor:text!important}
body.is-background-paused .content-brush,body.is-interaction-off .content-brush{display:none}
@media(min-width:701px) and (hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){
  .capsule-icon,.tag-icon svg,.pointer-toggle svg,.back-link>svg,.track-list svg,.object-link svg,.work-try a svg,.art-caption svg,.full-image-link>span svg,.tdd-title>svg,.section-heading a svg,.play-mark svg,.music-search>svg{transition:transform .22s cubic-bezier(.16,1,.3,1);transform-origin:50% 50%}
  .capsule-item:is(:hover,:focus-visible) .capsule-icon{transform:translateY(-1px) rotate(-7deg)}
  .capsule-item:is(:hover,:focus-visible) .capsule-avatar{transform:rotate(-4deg)}
  .capsule-avatar{transition:transform .22s cubic-bezier(.16,1,.3,1)}
  .tag-icon{transition:transform .2s var(--ease),background-color .2s var(--ease)}
  .profile-tag:hover .tag-icon{transform:translateY(-2px);background:color-mix(in srgb,var(--tag-color) 16%,transparent)}
  .profile-tag:is(:hover,:focus-within) .tag-icon svg{transform:rotate(-8deg) scale(1.08)}
  .pointer-toggle:is(:hover,:focus-visible) svg{transform:rotate(30deg)}
  .back-link:is(:hover,:focus-visible)>svg{transform:translateX(-3px)}
  .track-list a:is(:hover,:focus-visible) svg,.discovery-card:is(:hover,:focus-visible) .play-mark svg{transform:translateX(2px) scale(1.06)}
  :is(.hana-card,.collection-card,.repo-card,.art-card,.full-image-link,.tdd-card):is(:hover,:focus-visible) :is(.object-link svg,.art-caption svg,.full-image-link>span svg,.tdd-title>svg),.work-try a:is(:hover,:focus-visible) svg,.section-heading a:is(:hover,:focus-visible) svg{transform:translate(2px,-2px)}
  .music-search:focus-within>svg{transform:scale(1.08)}
}
/* Final guarantees also cover stale runtime classes after a device/preference change. */
@media(prefers-reduced-motion:reduce),(hover:none),(pointer:coarse),(max-width:700px){
  body.has-reactive-motif::before{display:block;animation:none;will-change:auto}
  body.is-background-point{cursor:auto!important}
  .pointer-field,.pointer-toggle,.content-brush{display:none!important}
  .capsule-icon,.capsule-avatar,.tag-icon svg,.pointer-toggle svg,.back-link>svg,.track-list svg,.object-link svg,.work-try a svg,.art-caption svg,.full-image-link>span svg,.tdd-title>svg,.section-heading a svg,.play-mark svg,.music-search>svg{transform:none!important;transition:none!important}
}

body[data-page=home]::before{background-image:radial-gradient(circle at 12px 12px,rgba(30,32,34,.26) 1.1px,transparent 1.3px),radial-gradient(circle at 2px 29.32px,rgba(30,32,34,.26) 1.1px,transparent 1.3px);background-size:20px 34.64px}