.circle-menu-trigger{width:44px;height:44px;flex-shrink:0;border:1px solid #444;border-radius:50%;background:#080808;color:#ddd;display:inline-grid;place-items:center;cursor:pointer;transition:color .2s,border-color .2s,background .2s;position:relative;z-index:1}.circle-menu-trigger:hover{color:#fff;border-color:#999;background:#181818}.circle-menu-trigger svg{width:18px;height:18px}.circle-menu-trigger:focus-visible,.circle-nav a:focus-visible,.circle-nav-close:focus-visible{outline:2px solid #ddd;outline-offset:5px}
.circle-nav-dialog{position:fixed;inset:0;margin:auto;width:420px;max-width:calc(100vw - 24px);height:452px;max-height:calc(100dvh - 24px);padding:0;border:1px solid #2d2d2d;border-radius:18px;background:#080808;color:#fff;overflow:auto;box-shadow:0 28px 100px #0008;font-family:'proxima-nova',Arial,sans-serif}.circle-nav-dialog::backdrop{background:#000b;backdrop-filter:blur(8px)}
.circle-nav-heading{text-align:center;margin:24px 0 0;font:700 12px/1.5 'proxima-nova',Arial,sans-serif;letter-spacing:.14em;text-transform:uppercase;color:#aaa}.circle-nav{position:relative;height:356px;width:356px;max-width:100%;margin:0 auto}.circle-nav::before{content:"";position:absolute;left:50%;top:50%;width:244px;height:244px;border:1px solid #252525;border-radius:50%;transform:translate(-50%,-50%);pointer-events:none}.circle-nav-close{position:absolute;top:50%;left:50%;width:54px;height:54px;margin:-27px 0 0 -27px;border:1px solid #555;border-radius:50%;background:#151515;color:#eee;display:grid;place-items:center;cursor:pointer;z-index:2;transition:border-color .2s,transform .25s,background .2s}.circle-nav-close svg{width:20px;height:20px}.circle-nav-close:hover{transform:rotate(90deg);border-color:#aaa;background:#242424}
.circle-nav a{--x:0px;--y:0px;position:absolute;top:50%;left:50%;margin:-26px 0 0 -26px;display:grid;place-items:center;width:52px;height:52px;background:#111;border:1px solid #414141;border-radius:50%;color:#bbb;transform:translate(var(--x),var(--y));text-decoration:none;transition:color .2s,border-color .2s,background .2s}.circle-nav a:hover{color:#fff;background:#242424;border-color:#aaa}.circle-nav a[aria-current]{background:#eee;border-color:#eee;color:#080808}.circle-nav a svg{width:21px;height:21px;transition:transform .2s}.circle-nav a:hover svg{transform:scale(1.08)}.circle-nav a span{position:absolute;top:100%;left:50%;transform:translateX(-50%);margin-top:10px;white-space:nowrap;font:500 13px/1.4 'proxima-nova',Arial,sans-serif!important;letter-spacing:.015em!important;text-transform:none;color:#aaa;background:#080808;padding:1px 5px}.circle-nav a:hover span,.circle-nav a[aria-current] span{color:#fff}.circle-nav-hint{text-align:center;font:500 10px/1.5 'proxima-nova',Arial,sans-serif!important;letter-spacing:.14em;text-transform:uppercase;color:#666!important;margin:6px 0 22px}.circle-nav-dialog[open]{animation:circle-surface .25s ease-out}@keyframes circle-surface{from{opacity:0;transform:translateY(10px) scale(.97)}to{opacity:1;transform:translateY(0) scale(1)}}@media(max-width:380px){.circle-nav-dialog{width:344px}.circle-nav{width:320px}}@media(max-height:480px){.circle-nav-dialog{height:calc(100dvh - 16px);max-height:none}.circle-nav-heading{margin-top:14px}.circle-nav{height:330px}.circle-nav-hint{margin-bottom:12px}}@media(prefers-reduced-motion:reduce){.circle-nav-dialog[open]{animation:none}.circle-menu-trigger,.circle-nav a,.circle-nav a svg,.circle-nav-close{transition:none}}
