/* The dials round the Deezu seal and globe (coin.html, globe.html): ui/Decor.astro's styles from the site's global.css.
   rings — a clock face; compass — the same build with a wind rose. The rings turn only under html.motion. */
.decor{position:absolute;inset:0;z-index:0;pointer-events:none;-webkit-mask-image:radial-gradient(closest-side,#000 64%,rgba(0,0,0,.6) 82%,transparent 100%);mask-image:radial-gradient(closest-side,#000 64%,rgba(0,0,0,.6) 82%,transparent 100%)}
.decor svg{display:block;width:100%;height:auto;aspect-ratio:1;overflow:visible}
.decor circle{stroke-width:1}
.decor__line{stroke:rgba(217,222,230,.32);vector-effect:non-scaling-stroke}
.decor__dial-rim{stroke:rgba(217,222,230,.22)}
.decor__dial-tick{stroke:rgba(217,222,230,.3);stroke-width:1}
.decor__dial-tick--hour{stroke:rgba(217,222,230,.6);stroke-width:1.8}
.decor__dial-num{fill:rgba(217,222,230,.62);font-family:"Noto Serif Display",Georgia,serif;font-size:12px;letter-spacing:.04em;text-anchor:middle;dominant-baseline:central}
.decor__dial-gem{fill:rgba(217,222,230,.35)}
.decor__dial-hand{fill:#eef1f5}
.decor__ring{transform-box:view-box;transform-origin:260px 260px}
.decor__ring--dash{opacity:.45}.decor__ring--fine{opacity:.45}.decor__ring--long{opacity:.3}
.decor__ring-fine{stroke:rgba(217,222,230,.5);stroke-width:1.4!important;stroke-linecap:round;stroke-dasharray:0 1}
.decor__ring-long{stroke:rgba(217,222,230,.5);stroke-width:5!important;stroke-dasharray:.06 .94}
.decor__ring-trim{stroke:rgba(217,222,230,.32);stroke-linecap:round;stroke-dasharray:18 82}
.motion .decor__ring-trim{animation:ring-trim 14s ease-in-out infinite;animation-delay:calc(var(--i) * -4.7s)}
.motion .decor__ring--dash{animation:ring-spin 70s linear infinite}
.motion .decor__ring--second{animation:ring-spin 60s steps(60) infinite}
.motion .decor__ring--fine{animation:ring-spin 240s linear infinite reverse}
.motion .decor__ring--long{animation:ring-spin 300s linear infinite}
@keyframes ring-trim{0%{stroke-dasharray:0 100;stroke-dashoffset:0}45%{stroke-dasharray:22 78;stroke-dashoffset:-12}100%{stroke-dasharray:0 100;stroke-dashoffset:-60}}
@keyframes ring-spin{to{rotate:360deg}}
.decor__dial-num--main{font-size:17px;fill:rgba(232,236,242,.85)!important}