*{box-sizing:border-box}body{margin:0;background:#f7f4ee;color:#233348;font:14px Cairo,sans-serif}button,input,select,textarea{font:inherit}button,a{cursor:pointer}button{border:1px solid #dcd7ce;background:#fff;border-radius:7px;padding:9px 15px;color:inherit}a{color:inherit}aside{position:fixed;right:0;top:0;bottom:0;width:235px;background:#233348;color:#f6eddf;padding:30px 20px;display:flex;flex-direction:column;gap:15px}aside h1{font-size:38px}aside h1 small{display:block;font-size:12px;font-weight:400}aside button{background:#ffffff0c;border-color:#ffffff20;color:inherit;text-align:right}aside a{font-size:12px;text-decoration:none;padding:10px}aside p{font-size:11px;color:#aeb7c3;margin-top:auto;line-height:2}main{margin-right:235px;padding:35px 5%;max-width:1500px}header,.section-head{display:flex;justify-content:space-between;align-items:center;gap:15px}header span{font-size:11px;color:#8b8275}header h2{font-size:27px;margin:8px 0 26px}.secure{color:#2f7954;font-size:11px}.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:15px}.stat{background:#eee8dd;border-radius:10px;padding:20px}.stat strong{display:block;font-size:27px}.stat span{font-size:12px;color:#857e72}section{margin-top:30px;background:#fffdfa;border:1px solid #e6dfd3;border-radius:12px;padding:24px}.primary{background:#233348;color:white;border-color:#233348}.book-row,.category-row{display:flex;align-items:center;gap:15px;padding:17px 0;border-bottom:1px solid #eee8df}.book-row img{height:75px;width:55px;object-fit:contain;border-radius:5px;background:#eee8df}.row-text{flex:1}.row-text h3{font-size:13px;margin:3px 0 8px}.row-text small{color:#8b8275;font-size:11px}.row-actions{display:flex;gap:8px}.danger{color:#a9443d;background:#fff6f4;border-color:#eed7d1}.gate{max-width:450px;margin:15vh auto;padding:35px;border:1px solid #ddd4c5;border-radius:12px}.gate a{display:inline-block;margin:12px}input,select,textarea{width:100%;padding:11px;border:1px solid #d9d5cb;border-radius:6px;color:#233348;background:white}input[type=checkbox]{width:auto}label{display:block;margin:17px 0 5px;font-size:12px}label input,label select,label textarea{margin-top:7px}label small{display:block;font-size:10px;color:#8b8275}textarea{min-height:90px;resize:vertical}.two{display:grid;grid-template-columns:1fr 1fr;gap:15px}.inline{display:flex;align-items:center;gap:10px}.inline input{margin:0}.suggest{margin-top:12px;color:#9c6745;font-size:11px}.hint{font-size:11px;color:#8b8275}dialog{width:600px;max-width:94vw;max-height:88vh;overflow:auto;border:1px solid #d9d1c3;border-radius:14px;background:#faf7f0;padding:28px;color:#233348}dialog::backdrop{background:#17233299;backdrop-filter:blur(4px)}.form-actions{display:flex;gap:12px;margin-top:22px}#imagePreview{height:130px;max-width:100%;object-fit:contain;margin-top:12px}#status,#bookError,#categoryError{color:#a34939;font-size:12px}button:disabled{opacity:.4;cursor:wait}[hidden]{display:none!important}section>p{font-size:12px;color:#8b8275}.category-row .row-text{padding-right:var(--indent,0px)}@media(max-width:800px){aside{position:static;width:auto;padding:18px;display:flex;flex-direction:row;flex-wrap:wrap;gap:8px}aside h1{margin:0 0 10px;width:100%;font-size:26px}aside p{display:none}aside a,aside button{font-size:10px;padding:8px}main{margin:0;padding:20px 4%}.stats{gap:8px}.stat{padding:14px}.stat strong{font-size:22px}.stat span{font-size:10px}.secure{display:none}section{padding:15px}.book-row{flex-wrap:wrap}.row-text{min-width:140px}.row-actions{margin-right:auto}.row-actions button{font-size:11px}.section-head h2{font-size:19px}header h2{font-size:23px}}

.login-form{display:grid;gap:12px;max-width:320px;margin:18px auto}.login-form label{display:grid;gap:6px;text-align:right}.login-form input{padding:10px 12px;border:1px solid #dcd7ce;border-radius:7px}
.login-note{display:none}
.password-field{position:relative!important;width:100%;margin-top:7px}.password-field input{margin-top:0!important;padding-left:50px}.password-toggle{position:absolute!important;left:7px!important;top:50%!important;transform:translateY(-50%)!important;width:38px!important;height:38px!important;margin:0!important;border:0!important;border-radius:50%!important;background:transparent!important;padding:0!important;font-size:20px!important;line-height:38px!important;color:#4f46e5!important;z-index:2}.password-toggle:hover{background:#4f46e514!important}.password-toggle:focus-visible{outline:2px solid #4f46e5;outline-offset:1px}
.secure{display:none!important}