.book{--book-ease:cubic-bezier(.23, 1, .32, 1);padding:0 clamp(16px,2.4vw,34px)}.book-btn{background:var(--f-ink,#111);height:56px;color:var(--f-ground,#fff);white-space:nowrap;-webkit-tap-highlight-color:transparent;transition:transform .16s var(--book-ease);border-radius:12px;align-items:center;gap:14px;padding:0 22px;font-size:18px;line-height:1;text-decoration:none;display:inline-flex}.book-btn:has(.book-face){padding-left:8px}.book-face{object-fit:cover;border-radius:4px;flex:none;width:40px;height:40px}.book-btn:active{transform:scale(.97)}.book-label,.book-arrow{z-index:1;display:grid;position:relative;overflow:hidden}.book-label>span,.book-arrow>span{grid-area:1/1}.book-label{margin-block:-.15em;padding-block:.15em}.book-arrow>span{text-align:center;display:block}.book-arrow>span+span,.book-label>span+span{visibility:hidden}.book-btn[data-hover=sheen],.book-btn[data-hover=wipe]{isolation:isolate;position:relative;overflow:hidden}.book-sheen{display:none}@media (hover:hover) and (prefers-reduced-motion:no-preference){.book-arrow>span,.book-label>span{transition:transform .2s var(--book-ease)}.book-arrow>span+span,.book-label>span+span{visibility:visible}.book-arrow>span+span{transform:translate(-110%,110%)}.book-btn:hover .book-arrow>span:first-child{transform:translate(110%,-110%)}.book-btn:hover .book-arrow>span+span{transform:none}.book-label>span+span{transform:translateY(110%)}.book-btn[data-hover=roll]:hover .book-label>span:first-child{transform:translateY(-110%)}.book-btn[data-hover=roll]:hover .book-label>span+span{transform:none}.book-sheen{pointer-events:none;background:linear-gradient(100deg, transparent 20%, color-mix(in srgb, var(--f-ground,#fff) 28%, transparent) 50%, transparent 80%);width:60%;transition:transform .6s var(--book-ease);display:block;position:absolute;inset:0 auto 0 0;transform:translate(-110%)}.book-btn:hover .book-sheen{transform:translate(190%)}.book-btn[data-hover=wipe]:before{content:"";z-index:0;background:var(--color-blue);clip-path:inset(0 100% 0 0);transition:clip-path .3s var(--book-ease);position:absolute;inset:0}.book-btn[data-hover=wipe]:hover:before{clip-path:inset(0)}.book-btn[data-hover=wipe]{transition:transform .16s var(--book-ease), color .3s var(--book-ease)}.book-btn[data-hover=wipe]:hover{color:#fff}}.book-face{z-index:1;position:relative}.book-btn:focus-visible{box-shadow:0 0 0 2px var(--f-ground,#fff), 0 0 0 4px var(--f-ink,#111);outline:none}.book-btn[data-wide]{border-radius:clamp(14px,1.6vw,24px);justify-content:space-between;width:100%;height:clamp(64px,6vw,88px);padding:0 clamp(20px,2vw,32px);font-size:clamp(20px,2vw,28px);display:flex}.book-dock{left:50%;bottom:max(16px, env(safe-area-inset-bottom));z-index:40;transition:translate .5s var(--book-ease);position:fixed;translate:-50% calc(100% + 32px)}.book-dock[data-on]{translate:-50%}.book-dock .book-btn{box-shadow:0 1px 2px #0000001f,0 8px 24px -6px #00000047}@media (prefers-reduced-motion:reduce){.book-dock{transition:none}}