html,body,#root{width:100%;height:100%;margin:0}canvas{display:block;width:fit-content;height:100%}.row-spanning-bar{display:flex;flex-direction:row;gap:10px}.texture-image{display:block;width:25px;height:25px;border-radius:12.5px}.texture-button{border:black;border-radius:20px;padding:2px;cursor:pointer;transition:background .2s ease,transform .2s ease}.texture-button:hover{transform:translateY(-1px) translate(1px)}.texture-button:active{transform:translateY(0)}.texture-button:disabled{opacity:.7}.yellow-info-tag{margin:0;background-color:#ff0;border-radius:10px;padding:2px 12px;font-size:12px;font-family:Arial,Helvetica,sans-serif}.green-info-tag{margin:0;background-color:#9cd3b9;border-radius:10px;padding:2px 12px;font-size:14px;font-family:Arial,Helvetica,sans-serif}.landingpage,.signin-page{min-height:100%;display:flex;flex-direction:column;justify-content:center;align-items:center;background-color:beige;font-family:system-ui,sans-serif;overflow:hidden;position:relative}.main{position:fixed;text-align:center}.logo{width:80vw;max-width:420px;margin-bottom:2rem;margin-top:-6rem}.signin-form{align-items:center;width:350px;display:grid;gap:10px;margin:auto}.signin-form input{padding:.55rem;font-size:1rem;border-radius:15px;border:1px solid black;outline:none}.signin-form button{padding:.5rem;font-size:1rem;background-color:maroon;color:beige;cursor:pointer;border-radius:15px;border:1px solid black}.signup-form{width:70vw;max-width:380px;display:flex;justify-content:center;gap:.5rem;margin:auto}.signup-form input{padding:.75rem;font-size:1rem;width:240px;border-radius:10px 0 0 10px;border:1px solid black;outline:none}.signup-form button{margin-left:-10px;padding:0 1rem;font-size:1rem;background-color:maroon;color:beige;cursor:pointer;border-radius:0 10px 10px 0;border:1px solid black}.alert{position:fixed;bottom:50px;margin-top:1rem;padding:.75rem 1rem;background-color:#eef9f1;color:#1a7f37;border:1px solid #b7ebc6;border-radius:6px;font-size:.95rem;max-width:70vw}#sign-out-button-name{display:flex;flex-direction:row;gap:10px;padding:10px}.buttons-footer{position:fixed;bottom:-350px;left:0;width:100%;display:flex;justify-content:center;gap:12px}.page-canvas-container{width:fit-content;display:block}.canvas-container{background-color:#fff;border:2px dashed gray;position:relative;overflow:hidden}.image-wrapper{position:absolute;transform:translate(-50%,-50%) translateZ(0);will-change:width,height;width:100%;height:100%;-webkit-user-select:none;user-select:none;cursor:grab;display:block}.etch-overlay{position:absolute;inset:0;border-radius:10px;pointer-events:none}.etch-wrapper{position:absolute;transform:translate(-50%,-50%) translateZ(0);will-change:width,height;width:100%;height:100%;-webkit-user-select:none;user-select:none;cursor:crosshair;display:block}img{width:100%;height:100%;-webkit-user-select:none;user-select:none;display:block}.text-wrapper{position:absolute;display:inline-block;padding:2px 4px;cursor:grab;-webkit-user-select:none;user-select:none;transform-origin:center}.page-n{position:absolute;margin:8px;font-size:18px}#page-n-1{top:0;left:0}#page-n-2{top:0;right:0}#next-page,#last-page{all:unset;position:absolute;width:20px;height:20px;cursor:pointer}#next-page{bottom:0;right:0}#last-page{bottom:0;left:0}#next-page:before{content:"";position:absolute;inset:0;clip-path:polygon(100% 0,100% 100%,0 100%);background:#fff;box-shadow:-2px -2px 3px #00000014;transition:transform .25s ease,filter .25s ease;transform-origin:bottom right}#next-page:hover:before{filter:brightness(.88)}#page-scraps-logo{all:unset;position:absolute;height:50px;bottom:10px;right:20px}.popup-overlay{position:fixed;inset:0;background:#000000a6;display:flex;justify-content:center;align-items:center;z-index:9999;cursor:zoom-out}.popup-wrapper{position:relative;border-radius:10px;width:550px;height:550px}#image-popup-wrapper{background:url(/objects/board.png) #0000 no-repeat center center;background-size:550px 550px}#share-popup-wrapper{background:url(/objects/envelope.png) #fff no-repeat right bottom;background-position:92% 92%;background-size:40%;font-family:cursive;padding:20px}#share-form-container{background-color:#fff3c8a7;padding:1px 20px 10px;border-radius:10px;margin-bottom:30px}#current-shares-container{background-color:#e9cfeabd;padding:1px 20px 20px;border-radius:10px}.share-form{justify-content:space-between}.share-form input{padding:.55rem;font-size:.8rem;border-radius:13px;border:2px solid black;margin-right:10px;outline:none}.share-form button{padding:.55rem;font-size:.8rem;border-radius:13px;border:2px solid black;background-color:maroon;color:beige;cursor:pointer}.image-popup-mask{position:absolute;inset:0;background:#0003;border-radius:6px;pointer-events:none}.image-popup-svg{display:block;object-fit:fill;margin:20px}.image-measure{position:absolute;visibility:hidden;pointer-events:none}#image-popup-controls{margin:20px}.edit-menu{font-family:Helvetica,sans-serif;padding:10px;width:200px;width:100%;height:100%;background-color:#add8e6}h3{margin-bottom:8px}input[type=number]::-webkit-outer-spin-button,input[type=number]::-webkit-inner-spin-button{appearance:none;-webkit-appearance:none;margin:0}input[type=number]{appearance:textfield;-moz-appearance:textfield}.page-container{padding:10px;background-color:green;display:flex;flex-direction:column;gap:5px}.legend-item{display:flex;align-items:center;gap:20px;margin-bottom:8px}.handle-demo{position:relative;width:1px;height:1px;flex-shrink:0}#save-and-share{display:flex;justify-content:space-between}#home-trash-buttons{margin-bottom:5px}.resize-handle{position:absolute;right:-5px;bottom:-5px;width:10px;height:10px;background:#00f;cursor:nwse-resize}.rotate-handle{position:absolute;top:-5px;right:-5px;width:10px;height:10px;border-radius:50%;background:green;cursor:crosshair}.drag-handle{position:absolute;bottom:-5px;left:-5px;width:10px;height:10px;background:orange;border-radius:50%;cursor:grab;z-index:10}.delete-button{position:absolute;top:-5px;left:-5px;width:10px;height:10px;background:red;cursor:pointer;z-index:10}.delete-button:before,.delete-button:after{content:"";position:absolute;top:50%;left:50%;width:7px;height:1.5px;background:#fff;transform-origin:center}.delete-button:before{transform:translate(-50%,-50%) rotate(45deg)}.delete-button:after{transform:translate(-50%,-50%) rotate(-45deg)}.bookpage{width:100%;height:100%;overflow:hidden;padding:10px;background-color:pink;box-sizing:border-box}.page-and-menu{padding:10px;width:100%;gap:10px;display:flex;box-sizing:border-box;background-color:#00f}.book-edit-menu{display:flex;justify-content:space-between;background-color:orange;height:50px}#page-edit-bar{margin:0;height:20px;display:flex;justify-content:space-between}#book-title{display:flex;background-color:orange;font-size:25px;padding:5px 10px}#book-cover-patches{padding:5px;align-items:center}#change-cover-button{height:20px;justify-content:center;padding:0 5px}#book-cover-patch{width:25px;height:25px}