body{margin:0;min-height:100vh}@font-face{font-family:Excalifont;src:url(/ink-and-memory/Excalifont-Regular.woff2) format("woff2");font-weight:400;font-style:normal;unicode-range:U+0000-00FF,U+0100-017F,U+0180-024F,U+1E00-1EFF,U+2000-206F,U+20A0-20CF,U+2100-214F}@font-face{font-family:Xiaolai;src:url(/ink-and-memory/Xiaolai-Regular.ttf) format("truetype");font-weight:400;font-style:normal;unicode-range:U+4E00-9FFF,U+3400-4DBF,U+20000-2A6DF,U+F900-FAFF,U+3000-303F}.book-interface{display:flex;width:100vw;height:100vh;background-color:#f5e6d3;padding:2rem;gap:2rem;box-sizing:border-box;overflow:hidden;position:relative;--gap-size: 1.5rem;--hole-diameter: 30px;--bar-width: 100px;--bar-height: 20px}.book-page{flex:1;display:flex;background-color:#fffef9;border:1px solid #ccc;border-radius:4px;position:relative}.book-page.right-page{flex-direction:column;gap:1rem;padding:2rem;overflow-y:auto;overflow-x:hidden;scrollbar-width:none;-ms-overflow-style:none}.book-page.right-page::-webkit-scrollbar{display:none}.book-page.right-page>*{margin-left:2rem;word-wrap:break-word;overflow-wrap:break-word}.editable-text-area{width:100%;height:100%;box-sizing:border-box;display:flex;flex-direction:column}.editable-text-area>div{flex:1;display:flex;flex-direction:column}.editable-text-area .tiptap{flex:1;display:flex;flex-direction:column}.editable-text-area .ProseMirror{flex:1;width:100%;padding:2rem 4rem 2rem 2rem;font-size:1.2rem;line-height:1.8;font-family:Excalifont,Xiaolai,Georgia,serif;color:#333;outline:none;box-sizing:border-box;cursor:text}.editable-text-area .ProseMirror p{margin:.5rem 0}.editable-text-area .ProseMirror p:first-child{margin-top:0}.voice-comment{padding:1rem;border-left:4px solid;border-radius:4px;font-family:Excalifont,Xiaolai,Georgia,serif;font-size:1rem;line-height:1.6;color:#333;animation:fadeIn .5s ease-in;word-wrap:break-word;overflow-wrap:break-word;max-width:100%}.voice-header{display:flex;align-items:center;gap:.5rem;margin-bottom:.5rem}.voice-icon{font-size:1.25rem}.voice-text{margin-left:1.75rem}@keyframes fadeIn{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.binder-ring{position:absolute;left:1rem;right:2rem;height:20px;transform:translateY(-50%);pointer-events:none;z-index:100}.hole-left,.hole-right{position:absolute;top:50%;transform:translateY(-50%);width:var(--hole-diameter);height:var(--hole-diameter);border-radius:50%;background:#f5e6d3;z-index:102}.hole-left{left:calc(50% - var(--gap-size) - var(--bar-width) / 2 - var(--hole-diameter) / 3)}.hole-right{left:calc(50% - var(--gap-size) + var(--bar-width) / 2 - var(--hole-diameter) / 1.5)}.ring-bar{position:absolute;left:calc(50% - var(--gap-size));top:50%;transform:translate(-50%,-50%);width:var(--bar-width);height:var(--bar-height);background:linear-gradient(180deg,#666,#aaa,#666);border-radius:calc(var(--bar-height) / 2);z-index:103}.voice-highlight{margin:-2px -6px;padding:2px 6px}.voice-highlight-yellow{background:url(https://s2.svgbox.net/pen-brushes.svg?ic=brush-9&color=ffff43)}.voice-highlight-blue{background:url(https://s2.svgbox.net/pen-brushes.svg?ic=brush-7&color=a3d5ff)}.voice-highlight-pink{background:url(https://s2.svgbox.net/pen-brushes.svg?ic=brush-8&color=ffb3d9)}.voice-highlight-green{background:url(https://s2.svgbox.net/pen-brushes.svg?ic=brush-6&color=b3ffb3)}.voice-highlight-purple{background:url(https://s2.svgbox.net/pen-brushes.svg?ic=brush-5&color=ddb3ff)}