/* A larger frosted annulus: its transparent center never blurs the scenery. */
.arc-dock{--radius:165px;--band:72px;--cx:-92px;--cy:176px;--base:0deg;--rotation:0deg;position:fixed;left:0;top:50%;transform:translateY(-50%);width:220px;height:352px;z-index:25;color:var(--nav-ink);user-select:none;-webkit-user-select:none;pointer-events:none}
.dock-orbit{position:absolute;left:0;top:0;width:112px;height:100%;overflow:clip;touch-action:none;cursor:grab;pointer-events:auto}
.dock-orbit:active{cursor:grabbing}
.dock-band{position:absolute;left:var(--cx);top:var(--cy);width:calc(var(--radius)*2 + var(--band));height:calc(var(--radius)*2 + var(--band));border-radius:50%;background:rgb(255 255 255 / .12);border:1px solid rgb(255 255 255 / .36);box-shadow:inset 0 1px 3px #ffffff38,inset 0 -1px 4px #ffffff14;backdrop-filter:blur(18px) saturate(150%);-webkit-backdrop-filter:blur(18px) saturate(150%);mask-image:radial-gradient(farthest-side,transparent calc(100% - var(--band)),#000 calc(100% - var(--band) + 1px));-webkit-mask-image:radial-gradient(farthest-side,transparent calc(100% - var(--band)),#000 calc(100% - var(--band) + 1px));transform:translate(-50%,-50%) rotate(var(--rotation));pointer-events:none}
.dock-band:after{content:"";position:absolute;inset:calc(var(--band) - 1px);border-radius:50%;border:1px solid #ffffff30}
.arc-dock a{position:absolute;left:var(--cx);top:var(--cy);width:66px;height:66px;margin:-33px;display:grid;place-items:center;border-radius:50%;color:var(--nav-ink);transform:rotate(calc(var(--base) + var(--angle))) translateX(var(--radius)) rotate(calc(-1 * (var(--base) + var(--angle))));touch-action:none;-webkit-user-drag:none;isolation:isolate}
.arc-dock a:before{content:"";position:absolute;inset:4px;border-radius:50%;border:1px solid transparent;transition:background .25s,border-color .25s,box-shadow .25s;z-index:-1}
.arc-dock a svg{width:24px;height:24px;pointer-events:none;filter:drop-shadow(0 1px 2px #0002)}
.arc-dock a.active:before{background:linear-gradient(140deg,#ffffff45,#ffffff12);border-color:#ffffff80;box-shadow:inset 0 1px 2px #ffffff73,0 0 12px var(--nav-glow);backdrop-filter:blur(18px) saturate(150%);-webkit-backdrop-filter:blur(18px) saturate(150%)}
.arc-dock a:focus-visible{outline:2px solid var(--nav-mark);outline-offset:-1px}
.dock-label{position:absolute;left:112px;top:var(--cy);transform:translateY(-50%);font-size:14px;font-weight:500;letter-spacing:.2px;white-space:nowrap;color:var(--nav-ink);text-shadow:0 1px 8px var(--loader-bg);opacity:1;transition:opacity .18s}
.arc-dock.is-rotating .dock-label,.arc-dock.is-dragging .dock-label{opacity:0}
.dock-count{position:absolute;left:12px;bottom:1px;color:var(--nav-muted);font-size:12px;letter-spacing:1px;font-variant-numeric:tabular-nums;text-shadow:0 1px 8px var(--loader-bg)}
@media(min-width:1101px){.chapter{padding-left:230px}.chapter-footer{left:230px}}
@media(min-width:701px) and (max-width:1100px){.chapter{padding-left:230px}.chapter-footer{left:230px}.dock-label{font-size:14px}}
@media(max-width:700px), (max-width:950px) and (max-height:500px){
 .arc-dock{--radius:165px;--cx:50%;--cy:225px;--base:-90deg;top:auto;bottom:env(safe-area-inset-bottom,0px);left:50%;transform:translateX(-50%);width:min(100%,390px);height:178px}
 .dock-orbit{width:100%}
 .dock-label{left:50%;top:calc(var(--cy) - var(--radius) - 44px);transform:translate(-50%,-50%);font-size:14px}
 .dock-count{left:auto;right:10px;bottom:3px}
 .chapter{padding-bottom:calc(200px + env(safe-area-inset-bottom,0px))}.toast{bottom:calc(195px + env(safe-area-inset-bottom,0px))}
}
@media(prefers-reduced-motion:reduce){.arc-dock a:before,.dock-label{transition:none}}
@media(hover:hover){.arc-dock a:hover:before{border-color:#ffffff70;background:#ffffff18}}
html:not(.js) .arc-dock{left:12px;right:12px;top:auto;bottom:12px;width:auto;height:60px;transform:none;background:#ffffff1f;border:1px solid #ffffff60;border-radius:20px;backdrop-filter:blur(18px) saturate(150%)}
html:not(.js) .dock-orbit{width:100%;display:flex;justify-content:space-around;align-items:center;overflow:visible}
html:not(.js) .arc-dock a{position:static;transform:none;margin:0;width:44px;height:44px}
html:not(.js) .dock-band,html:not(.js) .dock-label,html:not(.js) .dock-count{display:none}
