
html{scroll-behavior:smooth}body{margin:0;background:#f7f1e4;font-family:Yu Gothic,sans-serif;color:#4b382a}
#loading{position:fixed;inset:0;background:#f7f1e4;display:flex;justify-content:center;align-items:center;z-index:9999;font-size:2rem}
body{



background-size:cover;

background-attachment:fixed;

}
.hero{height:100vh;position:relative}.hero-bg{width:100%;height:100%;object-fit:cover}
.overlay{position:absolute;inset:0;background:rgba(0,0,0,.35)}
.hero-content{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);text-align:center;color:#fff}
.logo{max-width:700px;width:90%}.enter{display:inline-block;background:#6c8a4f;color:#fff;padding:12px 20px;border-radius:12px;text-decoration:none}
nav{position:sticky;top:0;background:#7a5738;padding:10px;text-align:center}
nav a{color:#fff;text-decoration:none;margin:0 8px}
.panel{max-width:1000px;margin:30px auto;padding:25px;background:#fff;border:4px solid #6c8a4f;border-radius:20px}
.shelf{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:15px}
.book{background:#8f6744;color:white;padding:25px;border-radius:10px;text-align:center}
.jacket{max-width:250px}
#guide{position:fixed;right:15px;bottom:15px;background:white;padding:15px;border-radius:20px;box-shadow:0 3px 12px rgba(0,0,0,.2)}
.leaf{position:fixed;top:-50px;pointer-events:none}
footer{text-align:center;background:#6c8a4f;color:#fff;padding:40px}

