:root{--cream: #f6f1e4;--ink: #111111;--yellow: #ffd93d;--blue: #7ec8e3;--pink: #ff9aa2;--green: #a8e6a1;--purple: #c9a7eb;--orange: #ffb877;--line: 3px solid var(--ink);--shadow: 6px 6px 0 var(--ink);--shadow-sm: 4px 4px 0 var(--ink);--radius: 14px}*{box-sizing:border-box}html,body,#root{height:100%}body{margin:0;background:var(--cream);color:var(--ink);font-family:Cairo,Segoe UI,Tahoma,sans-serif;-webkit-font-smoothing:antialiased}a{color:inherit}button,input,select,textarea{font-family:inherit;font-size:1rem}.app{min-height:100%;display:flex;flex-direction:column}.topbar{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 20px;border-bottom:var(--line);background:var(--yellow);position:sticky;top:0;z-index:20}.brand{display:flex;align-items:center;gap:10px;font-weight:800;font-size:1.15rem}.brand-logo{width:38px;height:38px;display:grid;place-items:center;background:var(--ink);color:var(--yellow);border-radius:10px;font-weight:900;letter-spacing:1px}.topbar-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.wrap{width:min(1180px,100%);margin:0 auto;padding:22px;flex:1}.btn{border:var(--line);background:#fff;color:var(--ink);padding:9px 16px;border-radius:10px;font-weight:700;cursor:pointer;box-shadow:var(--shadow-sm);transition:transform .06s ease,box-shadow .06s ease}.btn:hover{transform:translate(-1px,-1px);box-shadow:5px 5px 0 var(--ink)}.btn:active{transform:translate(3px,3px);box-shadow:1px 1px 0 var(--ink)}.btn:disabled{opacity:.55;cursor:not-allowed;transform:none}.btn-primary{background:var(--yellow)}.btn-dark{background:var(--ink);color:var(--cream)}.btn-sm{padding:5px 10px;font-size:.85rem;box-shadow:3px 3px 0 var(--ink)}.card{background:#fff;border:var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:18px}.field{display:flex;flex-direction:column;gap:6px;margin-bottom:14px}.field label{font-weight:700;font-size:.95rem}.input{border:var(--line);border-radius:10px;padding:11px 13px;background:#fff;outline:none;width:100%}.input:focus{box-shadow:0 0 0 4px var(--blue)}.error{background:var(--pink);border:var(--line);border-radius:10px;padding:10px 13px;font-weight:700;margin-bottom:14px}.notice{background:var(--blue);border:var(--line);border-radius:10px;padding:10px 13px;font-weight:700;margin-bottom:14px}.muted{opacity:.68;font-size:.9rem}.row{display:flex;gap:10px;flex-wrap:wrap;align-items:center}.spacer{flex:1}.login-wrap{min-height:100vh;display:grid;place-items:center;padding:22px}.login-card{width:min(430px,100%)}.login-card h1{margin:4px 0;font-size:1.7rem}.login-card .sub{margin:0 0 20px}.section-title{display:flex;align-items:center;gap:12px;margin:30px 0 16px}.section-title h2{margin:0;font-size:1.35rem}.section-title .rule{flex:1;height:3px;background:var(--ink);border-radius:2px}.shelf{display:grid;gap:18px;grid-template-columns:repeat(auto-fill,minmax(215px,1fr))}.book{border:var(--line);border-radius:var(--radius);background:#fff;box-shadow:var(--shadow);padding:16px;text-decoration:none;color:inherit;display:flex;flex-direction:column;gap:8px;min-height:150px;transition:transform .08s ease,box-shadow .08s ease}.book:hover{transform:translate(-2px,-2px);box-shadow:8px 8px 0 var(--ink)}.book .code{font-weight:900;font-size:.8rem;letter-spacing:.5px;border:2px solid var(--ink);border-radius:999px;padding:2px 9px;align-self:flex-start}.book h3{margin:0;font-size:1.02rem;line-height:1.5}.book .doctor{margin:0;font-size:.86rem;opacity:.75}.book .counts{margin-top:auto;display:flex;gap:8px;flex-wrap:wrap}.tag{border:2px solid var(--ink);border-radius:999px;padding:2px 9px;font-size:.78rem;font-weight:800;background:var(--cream)}.c1{background:var(--yellow)}.c2{background:var(--blue)}.c3{background:var(--pink)}.c4{background:var(--green)}.c5{background:var(--purple)}.c6{background:var(--orange)}.tabs{display:flex;gap:8px;flex-wrap:wrap;margin:18px 0}.tab{border:var(--line);background:#fff;border-radius:999px;padding:7px 16px;font-weight:800;cursor:pointer;box-shadow:3px 3px 0 var(--ink)}.tab[aria-selected=true]{background:var(--ink);color:var(--cream)}.res-list{display:flex;flex-direction:column;gap:12px}.res{display:flex;align-items:center;gap:12px;border:var(--line);border-radius:12px;background:#fff;padding:12px 14px;box-shadow:var(--shadow-sm)}.res .name{font-weight:700}.res .meta{font-size:.8rem;opacity:.7}.viewer{border:var(--line);border-radius:12px;overflow:hidden;background:#fff;box-shadow:var(--shadow)}.viewer iframe{width:100%;height:78vh;border:0;display:block}.empty{border:3px dashed var(--ink);border-radius:12px;padding:28px;text-align:center;font-weight:700;opacity:.7}.grid-2{display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}.center{display:grid;place-items:center;padding:60px 20px}.spin{width:34px;height:34px;border:4px solid var(--ink);border-top-color:transparent;border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}@media(max-width:640px){.wrap{padding:14px}.topbar{padding:10px 14px}.book{min-height:130px}}