*{box-sizing:border-box}html{min-width:280px}body{margin:0}a{color:inherit}::selection{background:#badb92;color:#10291d}a:focus-visible{outline:3px solid #568535;outline-offset:5px}h1,p{margin:0}img{max-width:100%}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important}}body{background:#e8eadc;color:#163c2b;font-family:Georgia,serif}.bookcase{max-width:1420px;min-height:100svh;padding:0 5vw;margin:auto;display:flex;flex-direction:column}header{height:100px;display:flex;justify-content:space-between;align-items:center;gap:25px}header a{font:700 15px Arial,sans-serif;text-decoration:none;letter-spacing:.03em}header>span{font:9px Consolas,monospace;letter-spacing:.16em}main{display:grid;grid-template-columns:.9fr 1fr;align-items:center;gap:10%;flex:1;padding:30px 0 65px}.cover{position:relative;aspect-ratio:4/5;max-width:365px;width:100%;margin:0 auto;transform:rotate(-5deg);background:#254f37;box-shadow:9px 10px 0 #c7ceba;border-right:5px solid #f6f5e9;border-bottom:2px solid #acb79d}.spine{position:absolute;left:12px;top:0;bottom:0;width:2px;background:#62805a}.jacket{padding:30px 35px;height:100%;position:relative;overflow:hidden}.jacket>span{color:#d7e4c5;font:9px/1.6 Consolas,monospace;letter-spacing:.13em}.jacket>p{position:absolute;bottom:64px;left:35px;font:italic clamp(34px,4vw,52px)/1 Georgia,serif;color:#eef0df;z-index:1}.jacket>small{position:absolute;bottom:27px;color:#d7e4c5;font:8px Arial,sans-serif;letter-spacing:.17em}.stem{position:absolute;top:85px;right:70px;bottom:85px;width:1px;background:#c2d2a3;transform:rotate(22deg)}.stem i,.stem b,.stem em{display:block;position:absolute;width:58px;height:100px;border:1px solid #c2d2a3;border-radius:100% 0 100% 0;transform:rotate(-15deg);top:10px;left:0}.stem b{width:45px;height:85px;top:82px;left:-44px;transform:rotate(110deg)}.stem em{width:38px;height:70px;top:152px}.chapter{font:italic 15px Georgia,serif;margin-bottom:25px}h1{font-size:clamp(57px,6.2vw,88px);font-weight:400;letter-spacing:-.055em;line-height:.98}h1 em{color:#547244}.prose{font:15px/1.9 Arial,sans-serif;max-width:370px;margin-top:28px}.closing{font:italic 18px/1.45 Georgia,serif;margin-top:24px}.bookmark{display:flex;align-items:center;gap:13px;margin-top:30px}.bookmark span{width:12px;height:21px;background:#456b3b;clip-path:polygon(0 0,100% 0,100% 100%,50% 75%,0 100%)}.bookmark p{font:9px Consolas,monospace;letter-spacing:.13em}footer{display:flex;justify-content:space-between;gap:25px;padding:22px 0;border-top:1px solid #afbea1;font:9px Consolas,monospace}@media(max-width:700px){.bookcase{padding:0 26px}header{height:85px;gap:15px}header a{font-size:13px}header>span{font-size:8px;letter-spacing:0}main{grid-template-columns:1fr;padding:20px 0 40px;gap:38px}.cover{order:2;max-width:230px;margin:5px auto 0}.jacket{padding:20px 25px}.jacket>p{font-size:36px;left:25px;bottom:50px}.jacket>small{bottom:19px;left:25px;font-size:7px}.jacket>span{font-size:7px}.stem{top:55px;right:55px;bottom:55px}.stem i{width:43px;height:75px}.stem b{width:35px;height:70px;left:-34px;top:65px}.stem em{top:112px;width:29px;height:58px}.chapter{font-size:14px;margin-bottom:23px}h1{font-size:clamp(59px,13.4vw,84px)}.prose{font-size:14px;margin-top:24px}.closing{font-size:17px}.bookmark{margin-top:25px}footer{font-size:8px;flex-wrap:wrap;gap:12px}}