/* Lucian UX/UI Prompt #058 · MIT License (c) 2026 Seokwoooo · https://lucianlabs.dev/uxui-prompt/#058 */
.u058-top{position:fixed;right:26px;bottom:26px;z-index:180;width:54px;height:54px;opacity:0;transform:translateY(18px) scale(.86);pointer-events:none;transition:opacity .3s var(--ux-ease),transform .45s var(--ux-spring)}
.u058-top.is-visible{opacity:1;transform:none;pointer-events:auto}
.u058-top .u058-ring{position:relative;display:block;width:54px;height:54px;padding:0;border:0;border-radius:50%;background:var(--paper);color:var(--ink);box-shadow:0 18px 34px -18px rgba(3,43,39,.7);cursor:pointer;transition:transform .4s var(--ux-spring),background-color .3s var(--ux-ease)}
.u058-top .u058-ring:hover{transform:translateY(-3px);background:var(--gold-pale)}
.u058-top .u058-ring:active{transform:scale(.94)}
.u058-top .u058-ring:focus-visible{outline:2px solid var(--gold);outline-offset:4px}
.u058-top .u058-ring svg{width:100%;height:100%;transform:rotate(-90deg)}
.u058-top .u058-ring circle{fill:none;stroke-width:3.5}
.u058-top .u058-ring .t{stroke:var(--line)}
.u058-top .u058-ring .p{stroke:var(--gold);stroke-linecap:round;stroke-dasharray:100;stroke-dashoffset:calc(100 - var(--p,0) * 100);transition:stroke .4s var(--ux-ease)}
.u058-top .u058-ring span{position:absolute;inset:0;display:grid;place-items:center;font-size:9px;font-weight:850;letter-spacing:.12em}
@media(max-width:560px){.u058-top{right:14px;bottom:90px;width:52px;height:52px}.u058-top .u058-ring{width:52px;height:52px}}