:root{--paper:#F4EDDE;--ink:#211C15;--red:#A63A2B;--blue:#41566E;--pencil:#8A8171;--rose:#C4707E;}
*{box-sizing:border-box}
body{margin:0;background:var(--paper);color:var(--ink);font-family:'EB Garamond',serif;font-size:19px;line-height:1.55;
 background-image:url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='300' height='300'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/%3E%3CfeColorMatrix values='0 0 0 0 0.13 0 0 0 0 0.11 0 0 0 0 0.08 0 0 0 0.05 0'/%3E%3C/filter%3E%3Crect width='300' height='300' filter='url(%23n)'/%3E%3C/svg%3E");}
a{color:var(--red);text-decoration:none;border-bottom:1px solid rgba(166,58,43,.4)}
a:hover{border-bottom-style:dashed}
.wrap{max-width:1080px;margin:0 auto;padding:0 24px}
header.masthead{text-align:center;padding:52px 0 0}
.device{width:54px;height:auto;display:block;margin:0 auto 10px;opacity:.85}
h1.house{font-family:'IM Fell English SC',serif;font-size:clamp(34px,6vw,62px);letter-spacing:.06em;margin:0;font-weight:400}
.rule2{border-top:3px solid var(--red);border-bottom:1px solid var(--ink);height:4px;margin:18px auto 0;max-width:1080px}
nav.top{font-family:'Special Elite',monospace;font-size:14px;text-transform:uppercase;letter-spacing:.14em;padding:12px 0 0;text-align:center}
nav.top a{margin:0 14px;border-bottom:none;color:var(--ink)}
nav.top a:hover{color:var(--red)}
.notice{max-width:720px;margin:64px auto;text-align:center;padding:0 24px}
.notice h2{font-family:'IM Fell English SC',serif;font-weight:400;font-size:clamp(24px,3.4vw,34px);margin:0 0 14px}
.notice p{font-size:20px;color:#3a332a}
.notice .fist{color:var(--red)}
.shelf{margin:70px 0}
.shelf-label{font-family:'Special Elite',monospace;text-transform:uppercase;letter-spacing:.18em;font-size:14px;
 border-bottom:1px solid var(--ink);padding-bottom:8px;display:flex;justify-content:space-between;align-items:baseline}
.shelf-label .count{color:var(--pencil)}
.shelf-label.rose{border-color:var(--rose);color:var(--rose)}
.books{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:34px;margin-top:30px}
.jacket{display:block;border-bottom:none;color:var(--ink)}
.jacket img{width:100%;display:block;box-shadow:3px 4px 0 rgba(33,28,21,.18),0 12px 24px rgba(33,28,21,.12);border:1px solid rgba(33,28,21,.15)}
.jacket:hover img{transform:rotate(-.6deg)}
.jacket .t{font-family:'IM Fell English SC',serif;font-size:19px;margin:12px 0 0;line-height:1.2}
.jacket .a{font-family:'Special Elite',monospace;font-size:12px;text-transform:uppercase;letter-spacing:.12em;color:var(--pencil);margin-top:4px}
.jacket .s{margin-top:8px}
.placeholder{aspect-ratio:2/3;border:1px dashed var(--pencil);display:flex;align-items:center;justify-content:center;
 flex-direction:column;gap:10px;background:rgba(33,28,21,.02);padding:16px;text-align:center}
.placeholder .pt{font-family:'IM Fell English SC',serif;font-size:20px;line-height:1.25}
.stamp{display:inline-block;font-family:'Special Elite',monospace;font-size:11px;letter-spacing:.1em;text-transform:uppercase;
 color:var(--red);border:2px solid var(--red);border-radius:3px;padding:3px 8px;transform:rotate(-3deg);opacity:.85;background:rgba(244,237,222,.6)}
.stamp.blue{color:var(--blue);border-color:var(--blue)}
.stamp.rose{color:var(--rose);border-color:var(--rose)}
.leafmark{color:#4c6b3c;font-size:15px;margin-left:6px}
.bookpage{display:grid;grid-template-columns:minmax(220px,340px) 1fr;gap:56px;margin:70px 0;align-items:start}
@media(max-width:760px){.bookpage{grid-template-columns:1fr}}
.bookpage h2{font-family:'IM Fell English SC',serif;font-weight:400;font-size:clamp(30px,4.4vw,44px);margin:0;line-height:1.1}
.bookpage .sub{font-style:italic;color:#3a332a;font-size:21px;margin:6px 0 2px}
.bookpage .byline{font-family:'Special Elite',monospace;text-transform:uppercase;letter-spacing:.16em;font-size:13px;margin:14px 0 22px;color:var(--pencil)}
.specs{font-family:'Special Elite',monospace;font-size:13px;line-height:2;text-transform:uppercase;letter-spacing:.08em;
 border-top:1px solid var(--ink);border-bottom:1px solid var(--ink);padding:10px 0;margin:26px 0;color:#3a332a}
.buy{display:flex;gap:14px;flex-wrap:wrap;margin:26px 0}
.buybtn{font-family:'Special Elite',monospace;font-size:14px;text-transform:uppercase;letter-spacing:.1em;
 border:2px solid var(--ink);padding:10px 18px;color:var(--ink);background:none;cursor:not-allowed;opacity:.75}
.buybtn small{display:block;font-size:10px;color:var(--red);margin-top:3px}
.marginalia{font-style:italic;color:var(--pencil);font-size:16px;border-left:2px solid var(--pencil);padding-left:14px;margin:20px 0}
.newsletter{border:1px solid var(--ink);outline:3px solid var(--red);outline-offset:4px;max-width:640px;margin:90px auto;padding:36px;text-align:center}
.newsletter h3{font-family:'IM Fell English SC',serif;font-weight:400;font-size:28px;margin:0 0 8px}
.newsletter p{margin:8px 0 20px}
.newsletter input[type=email]{font-family:'Special Elite',monospace;font-size:15px;padding:10px 12px;border:1px solid var(--ink);background:rgba(255,255,255,.5);width:60%}
.newsletter button{font-family:'Special Elite',monospace;font-size:15px;text-transform:uppercase;letter-spacing:.1em;padding:10px 16px;border:2px solid var(--red);color:var(--red);background:none;cursor:pointer}
.newsletter button:hover{background:var(--red);color:var(--paper)}
footer{margin:100px 0 0;border-top:3px solid var(--red);padding:40px 0 60px;text-align:center}
footer .colo{font-family:'Special Elite',monospace;font-size:12px;text-transform:uppercase;letter-spacing:.16em;line-height:2.2;color:#3a332a}
footer .motto{font-family:'IM Fell English SC',serif;font-size:17px;letter-spacing:.08em;margin-top:14px}
.strike{text-decoration:line-through;color:var(--pencil)}.fix{color:var(--red);font-style:italic}
/* back room */
.ledger{width:100%;border-collapse:collapse;font-family:'Special Elite',monospace;font-size:13px;margin:26px 0}
.ledger th,.ledger td{border:1px solid rgba(33,28,21,.35);padding:8px 10px;text-align:left;text-transform:uppercase;letter-spacing:.05em}
.ledger th{background:rgba(65,86,110,.12);color:var(--blue)}
.done{color:#4c6b3c}.todo{color:var(--pencil)}
.office{border:1px solid var(--ink);padding:28px;margin:40px 0;background:rgba(255,255,255,.25)}
.office h3{font-family:'IM Fell English SC',serif;font-weight:400;font-size:26px;margin:0 0 6px}
.office .tag{font-family:'Special Elite',monospace;font-size:12px;text-transform:uppercase;letter-spacing:.14em;color:var(--pencil)}
.office ul{padding-left:22px}
.office li{margin:8px 0}