.ball-frame{--ball-size:4.5rem;position:relative;display:inline-flex;width:var(--ball-size);height:var(--ball-size);border-radius:50%;overflow:hidden;isolation:isolate;flex-shrink:0;background:radial-gradient(circle at 35% 28%,#3a3a3a 0,#111);box-shadow:0 1px 2px #00000080,0 6px 14px #00000073,0 14px 28px #00000040;transition:box-shadow .2s ease,transform .2s ease}.ball-frame--sm{--ball-size:3.5rem}.ball-frame--md{--ball-size:var(--block-ball-size,4.5rem)}.ball-frame:before{z-index:2;box-shadow:inset 0 0 0 1px #ffffff2e,inset 0 -8px 16px #00000059,inset 0 4px 10px #ffffff1f}.ball-frame:after,.ball-frame:before{content:"";position:absolute;inset:0;border-radius:50%;pointer-events:none}.ball-frame:after{z-index:3;background:radial-gradient(circle at 32% 24%,hsla(0,0%,100%,.28) 0,hsla(0,0%,100%,.06) 28%,transparent 52%)}.ball-frame__img{width:100%;height:100%;-o-object-fit:cover;object-fit:cover;display:block;transform:scale(1.1);backface-visibility:hidden;will-change:transform}.ball-frame--interactive:hover{transform:translateY(-3px);box-shadow:0 2px 4px #00000073,0 10px 22px #00000080,0 18px 36px #0000004d}.ball-frame--interactive:active{transform:translateY(0) scale(.96)}.ball-frame__ring{position:absolute;inset:0;border-radius:50%;border:2.5px solid #ff6b35;z-index:5;pointer-events:none;animation:ball-img-border-flicker 1.1s ease-in-out infinite}@keyframes ball-img-border-flicker{0%,to{border-color:#ff6b35;opacity:1;box-shadow:0 0 6px #ff6b35b3,inset 0 0 4px #ff6b3559}50%{border-color:#fff3c4;opacity:.3;box-shadow:0 0 14px #ff6b35,inset 0 0 8px #ffa05a8c}}@media(prefers-reduced-motion:reduce){.ball-frame__ring{animation:none;opacity:1;border-color:#ff6b35;box-shadow:0 0 8px #ff6b35bf}}@media(max-width:640px){.ball-frame{box-shadow:0 1px 2px #0006,0 3px 8px #00000059}.ball-frame--interactive:hover{transform:translateY(-2px);box-shadow:0 2px 4px #0006,0 6px 14px #0006}.ball-frame__ring{border-width:2px}}*,:after,:before{box-sizing:border-box}html{font-family:Segoe UI,system-ui,-apple-system,sans-serif;-webkit-font-smoothing:antialiased}body{margin:0;background:#0a1a0a;background-image:radial-gradient(ellipse at 50% 0,rgba(46,125,50,.25) 0,transparent 60%),radial-gradient(circle at 20% 80%,rgba(27,94,32,.15) 0,transparent 40%);color:#fff}.app,body{min-height:100dvh}