@import"https://fonts.googleapis.com/css2?family=Inter:wght@400;600&display=swap";:root{font-family:Inter,system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400}*{box-sizing:border-box;margin:0;padding:0}body{margin:0;font-family:Inter,sans-serif;display:flex;justify-content:center;align-items:center;height:100vh;padding:1em;background-image:url(/assets/main-DjYFsI2M.jfif);background-size:cover;background-repeat:no-repeat;background-position:center}.login-container{background:#fff;padding:40px;border-radius:16px;box-shadow:0 12px 24px #0000001a;width:100%;max-width:400px;filter:sepia(35%);text-align:center;border:1px solid black}.title{margin-bottom:24px;font-size:26px;font-weight:600;color:#333}.login-form input,.login-form textarea{width:80%;padding:14px;margin-bottom:16px;border:1px solid #ccc;border-radius:10px;font-size:15px;transition:border .2s}.login-form input:focus,.modal input:focus,.modal textarea:focus{border-color:#007bff;outline:none;width:80%}.btn{padding:12px 16px;border:none;border-radius:10px;font-size:15px;cursor:pointer;transition:background .2s,transform .2s;margin-left:.5em;margin-right:.5em}.btn.primary{background-color:#007bff;color:#fff;margin-bottom:10px}.btn.secondary{background-color:#6c757d;color:#fff}.btn.danger{background-color:#dc3545;color:#fff;margin-left:10px}.btn:hover{transform:translateY(-1px);opacity:.95}.modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#0006;display:flex;align-items:center;justify-content:center;z-index:1000}.modal{background:#fff;padding:30px 4em 30px 30px;border-radius:16px;width:90%;max-width:420px;box-shadow:0 10px 25px #00000026;text-align:center}.modal h3{margin-bottom:20px;font-size:20px;font-weight:600}.modal input,.modal textarea{width:100%;padding:12px;margin-bottom:16px;border-radius:8px;border:1px solid #ccc;font-size:14px}.modal-actions{display:flex;justify-content:center;margin-top:10px}.confirmation-message{font-size:16px;color:#28a745;font-weight:500}.error{color:#dc3545;font-size:13px;text-align:left;margin-top:-10px;margin-bottom:10px;padding-left:4px}*{box-sizing:border-box;padding:0;margin:0}.App__main-wrapper{display:flex;flex-direction:row;height:100vh}.App__instructions{width:100%;max-width:17em;display:flex;flex-direction:column;align-items:center;justify-content:space-around;padding:.87em;background-color:#f7f6f3}.App__read-instructions{font-size:1.2rem;padding:.5em}.App__app{width:100%;height:100%}.App__title{font-weight:700;font-size:1rem}.book-container{display:flex;width:95%;max-width:1400px;margin:2rem auto;border:1px solid #ccc;box-shadow:0 5px 20px #0003;background:#fdf6e3;border-radius:8px;overflow:hidden;height:100%}.page{flex:1;padding:2rem;min-height:500px}.left-page{border-right:2px solid #e0dcd2;background-color:#fffaf0;overflow-y:auto;max-height:700px}.right-page{overflow-y:auto;max-height:700px;background-color:#fefcf5}h2{position:sticky;top:0;background-color:#fefcf5;padding:1rem 0;z-index:10;margin:0}ul{padding-left:1rem;list-style:disc}.App__buttons{width:100%;display:flex;flex-direction:column;align-items:center;justify-content:center}.App__container{display:flex;flex-direction:row;align-items:center;justify-content:space-around;width:100%;max-width:20em}.App__logout button,.App__change button{border:none;background-color:#08084d;padding:.4em;font-size:.987rem;border-radius:4px;cursor:pointer;color:#fff}.Title__main{display:flex;flex-direction:row;flex-wrap:wrap;align-items:flex-start;justify-content:flex-start}.Title__main-container{display:flex;flex-direction:column;align-items:center;margin-top:.7em;padding:.4em}.Title__title-container{max-width:5em}.Title__title-container p{font-weight:700;font-size:.8rem;text-align:center}.Title__main-container{border:2px solid transparent;cursor:pointer;transition:border .2s ease}.Title__main-container:hover{border-color:#999}.Title__main-container.selected{border-color:#07c;background-color:#eef6ff}.Toast__container{position:fixed;top:20px;left:50%;transform:translate(-50%);background:#07c;color:#fff;padding:10px 20px;border-radius:6px;font-weight:700;box-shadow:0 2px 8px #0003;z-index:999;animation:fadeIn .3s ease-out}@keyframes fadeIn{0%{opacity:0;top:0}to{opacity:1;top:20px}}
