.vip-octagon{aspect-ratio:1;--roundness:.25;--angle-offset:0deg;--baseAngle:22.5deg;--curve-angle-offset:(var(--baseAngle) * var(--roundness));--angle-offset-inward:(var(--angle-offset) - var(--curve-angle-offset));--angle-offset-outward:(var(--angle-offset) + var(--curve-angle-offset));--adjusted-radius:( 50% * cos(var(--baseAngle)) / cos((var(--baseAngle) * (1 - var(--roundness)))) );clip-path:circle(50%);justify-content:center;align-items:center;display:flex}@supports (clip-path:shape(from 0, close)){.vip-octagon{clip-path:shape(from calc(50% + var(--adjusted-radius) * cos(0deg + var(--angle-offset-inward))) calc(50% + var(--adjusted-radius) * sin(0deg + var(--angle-offset-inward))), curve to calc(50% + var(--adjusted-radius) * cos(0deg + var(--angle-offset-outward))) calc(50% + var(--adjusted-radius) * sin(0deg + var(--angle-offset-outward))) with calc(50% * (1 + cos(0deg + var(--angle-offset)))) calc(50% * (1 + sin(0deg + var(--angle-offset)))), line to calc(50% + var(--adjusted-radius) * cos(45deg + var(--angle-offset-inward))) calc(50% + var(--adjusted-radius) * sin(45deg + var(--angle-offset-inward))), curve to calc(50% + var(--adjusted-radius) * cos(45deg + var(--angle-offset-outward))) calc(50% + var(--adjusted-radius) * sin(45deg + var(--angle-offset-outward))) with calc(50% * (1 + cos(45deg + var(--angle-offset)))) calc(50% * (1 + sin(45deg + var(--angle-offset)))), line to calc(50% + var(--adjusted-radius) * cos(90deg + var(--angle-offset-inward))) calc(50% + var(--adjusted-radius) * sin(90deg + var(--angle-offset-inward))), curve to calc(50% + var(--adjusted-radius) * cos(90deg + var(--angle-offset-outward))) calc(50% + var(--adjusted-radius) * sin(90deg + var(--angle-offset-outward))) with calc(50% * (1 + cos(90deg + var(--angle-offset)))) calc(50% * (1 + sin(90deg + var(--angle-offset)))), line to calc(50% + var(--adjusted-radius) * cos(135deg + var(--angle-offset-inward))) calc(50% + var(--adjusted-radius) * sin(135deg + var(--angle-offset-inward))), curve to calc(50% + var(--adjusted-radius) * cos(135deg + var(--angle-offset-outward))) calc(50% + var(--adjusted-radius) * sin(135deg + var(--angle-offset-outward))) with calc(50% * (1 + cos(135deg + var(--angle-offset)))) calc(50% * (1 + sin(135deg + var(--angle-offset)))), line to calc(50% + var(--adjusted-radius) * cos(180deg + var(--angle-offset-inward))) calc(50% + var(--adjusted-radius) * sin(180deg + var(--angle-offset-inward))), curve to calc(50% + var(--adjusted-radius) * cos(180deg + var(--angle-offset-outward))) calc(50% + var(--adjusted-radius) * sin(180deg + var(--angle-offset-outward))) with calc(50% * (1 + cos(180deg + var(--angle-offset)))) calc(50% * (1 + sin(180deg + var(--angle-offset)))), line to calc(50% + var(--adjusted-radius) * cos(225deg + var(--angle-offset-inward))) calc(50% + var(--adjusted-radius) * sin(225deg + var(--angle-offset-inward))), curve to calc(50% + var(--adjusted-radius) * cos(225deg + var(--angle-offset-outward))) calc(50% + var(--adjusted-radius) * sin(225deg + var(--angle-offset-outward))) with calc(50% * (1 + cos(225deg + var(--angle-offset)))) calc(50% * (1 + sin(225deg + var(--angle-offset)))), line to calc(50% + var(--adjusted-radius) * cos(270deg + var(--angle-offset-inward))) calc(50% + var(--adjusted-radius) * sin(270deg + var(--angle-offset-inward))), curve to calc(50% + var(--adjusted-radius) * cos(270deg + var(--angle-offset-outward))) calc(50% + var(--adjusted-radius) * sin(270deg + var(--angle-offset-outward))) with calc(50% * (1 + cos(270deg + var(--angle-offset)))) calc(50% * (1 + sin(270deg + var(--angle-offset)))), line to calc(50% + var(--adjusted-radius) * cos(315deg + var(--angle-offset-inward))) calc(50% + var(--adjusted-radius) * sin(315deg + var(--angle-offset-inward))), curve to calc(50% + var(--adjusted-radius) * cos(315deg + var(--angle-offset-outward))) calc(50% + var(--adjusted-radius) * sin(315deg + var(--angle-offset-outward))) with calc(50% * (1 + cos(315deg + var(--angle-offset)))) calc(50% * (1 + sin(315deg + var(--angle-offset)))))}}