:root{
  --wall:#f1e9df;
  --paper:#fbf8f2;
  --ink:#171410;
  --muted:#756b61;
  --wood:#b87e49;
  --wood-top:#dbb27f;
  --wood-edge:#8b5d33;
  --metal:#4f4c46;
  --line:#d8ccbb;
  --cream:#f9f1e6;
  --orange:#bd7b25;
  --shadow:0 30px 85px rgba(58,40,23,.13);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  color:var(--ink);
  font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;
  background:
    radial-gradient(circle at 7% 3%,rgba(255,255,255,.95),rgba(255,255,255,0) 24%),
    linear-gradient(180deg,#faf6f0,#ece2d5);
}
button,input,select{font:inherit}
button{color:inherit}
img{display:block;max-width:100%}
a{color:inherit}
:focus-visible{outline:2px solid #1b1814;outline-offset:4px}
.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

.page{max-width:1560px;margin:0 auto;padding:0 24px 58px}
.site-header{
  display:grid;grid-template-columns:auto 1fr auto auto;align-items:center;gap:32px;
  padding:25px 5px 20px;
}
.brand{font:500 clamp(46px,5vw,72px)/.9 Georgia,"Times New Roman",serif;letter-spacing:-.055em}
.nav{display:flex;justify-content:center;gap:32px}
.nav button{border:0;background:none;cursor:pointer;font-size:11px;letter-spacing:.245em;text-transform:uppercase}
.primary{
  border:0;border-radius:999px;padding:16px 28px;background:#191917;color:#fff;cursor:pointer;
  font:500 16px Georgia,serif;box-shadow:0 12px 25px rgba(0,0,0,.14)
}
.tagline{font:italic 16px/1.35 Georgia,serif;color:var(--muted);max-width:176px}
.intro{
  display:grid;grid-template-columns:minmax(360px,570px) 1fr;gap:64px;align-items:end;
  padding:8px 10px 25px;
}
.eyebrow{font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--muted);margin-bottom:9px}
.intro h1{margin:0;font:500 clamp(46px,5.6vw,80px)/.94 Georgia,serif;letter-spacing:-.047em}
.intro p{margin:0;font:18px/1.72 Georgia,serif;color:#3d3730;max-width:810px}

.study{
  position:relative;overflow:hidden;border-radius:7px;
  background:
    linear-gradient(90deg,rgba(223,211,196,.22) 0 20%,transparent 20% 52%,rgba(223,211,196,.20) 52% 75%,transparent 75% 100%),
    radial-gradient(circle at 28% 4%,rgba(255,255,255,.82),rgba(255,255,255,0) 25%),
    linear-gradient(180deg,#f5eee6,#e7dacf);
  border:1px solid #b98b60;
  box-shadow:0 34px 90px rgba(54,37,21,.16),inset 0 0 0 1px rgba(255,255,255,.28);
  padding:56px 32px 32px;
}
.bookcase-shell{
  border-left:28px solid #b77c47;
  border-right:28px solid #b77c47;
  border-bottom:22px solid #9f683a;
}
.case-top-beam{
  position:absolute;left:0;right:0;top:0;height:33px;z-index:26;
  background:
    linear-gradient(90deg,rgba(255,255,255,.10),rgba(255,255,255,0) 30%),
    linear-gradient(180deg,#ddb17e,#b77d49 72%,#986037);
  box-shadow:0 7px 13px rgba(66,42,22,.13),inset 0 1px 0 rgba(255,255,255,.35)
}
.case-left-post,.case-right-post{
  position:absolute;top:33px;bottom:0;width:19px;z-index:25;
  background:linear-gradient(90deg,#8f5a32,#c29161 52%,#925b31);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.10)
}
.case-left-post{left:0}.case-right-post{right:0}
.case-inner-stile{
  position:absolute;top:33px;bottom:116px;width:10px;z-index:3;
  background:linear-gradient(90deg,#946238,#c18b57 52%,#8a5630);
  box-shadow:1px 0 0 rgba(255,255,255,.18),-1px 0 0 rgba(72,44,22,.09)
}
.stile-a{left:18.7%}.stile-b{left:51.2%}.stile-c{left:74.3%}.stile-d{right:2.8%}

.sunlight{
  position:absolute;inset:0;pointer-events:none;z-index:30;opacity:.22;mix-blend-mode:multiply;
  background:
    linear-gradient(108deg,transparent 0 10%,rgba(171,128,77,.21) 10.4% 11.8%,transparent 12.2% 24%,rgba(173,130,78,.13) 24.4% 25.5%,transparent 25.9% 100%);
}
.rail{
  position:absolute;top:72px;bottom:132px;width:6px;border-radius:2px;z-index:4;
  background:linear-gradient(90deg,#292824,#6a6761 48%,#24231f);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.10),0 0 0 1px rgba(52,45,38,.12)
}
.r1{left:2.3%}.r2{left:21.3%}.r3{left:52.7%}.r4{left:74.4%}.r5{right:2.4%}

.study-head{
  position:relative;z-index:8;display:flex;justify-content:space-between;gap:30px;align-items:flex-end;
  padding:2px 10px 14px;
}
.study-head h2{margin:0;font:500 31px/1 Georgia,serif;letter-spacing:-.015em}
.study-head p{margin:0;max-width:630px;color:var(--muted);font:14px/1.55 Georgia,serif}

.shelf{
  position:relative;z-index:5;display:grid;grid-template-columns:188px minmax(0,1fr) 356px;
  gap:21px;align-items:end;min-height:210px;padding:17px 8px 23px;
}
.shelf.recommended-row{min-height:275px}
.shelf.bottom-row{grid-template-columns:.94fr 1.08fr .92fr .86fr 1.42fr;min-height:215px}
.shelf::before{
  content:"";position:absolute;left:-18px;right:-18px;bottom:16px;height:7px;z-index:19;
  background:linear-gradient(180deg,#e3ba88,#bf8652);
  border-top:1px solid rgba(86,52,25,.17)
}
.shelf::after{
  content:"";position:absolute;left:-18px;right:-18px;bottom:0;height:17px;z-index:20;
  background:
    linear-gradient(90deg,rgba(255,255,255,.10),rgba(255,255,255,0) 30%),
    linear-gradient(180deg,#c18a56,#9a6136);
  border-top:1px solid rgba(86,52,25,.26);
  box-shadow:0 10px 17px rgba(61,39,21,.16),inset 0 1px 0 rgba(255,255,255,.22)
}
.stage{position:relative;min-height:135px;display:flex;justify-content:center;align-items:flex-end}
.object{
  position:relative;border:0;background:none;padding:0;cursor:pointer;
  transform-origin:bottom center;transition:transform .22s ease,filter .22s ease
}
.object:hover,.object:focus-visible{transform:translateY(-6px) scale(1.018);filter:brightness(1.025)}
.object img{max-height:171px;object-fit:contain;filter:drop-shadow(0 9px 10px rgba(37,24,14,.16))}
.hotspot{
  position:absolute;left:50%;bottom:-8px;transform:translate(-50%,100%);z-index:24;white-space:nowrap;
  background:rgba(249,240,228,.97);border:1px solid #d6c5b2;border-radius:999px;padding:7px 12px 7px 9px;
  font:500 11px Georgia,serif;box-shadow:0 4px 10px rgba(52,36,20,.08)
}
.hotspot::before{
  content:"+";display:inline-grid;place-items:center;width:17px;height:17px;border-radius:50%;
  background:#191917;color:white;font:bold 11px Arial;margin-right:7px
}
.plaque{
  width:max-content;margin:0 auto 12px;padding:7px 17px;
  background:#e6c5a2;border:1px solid #c3976d;color:#473321;
  font-size:11px;letter-spacing:.175em;text-transform:uppercase
}

/* Top shelf */
.wine img{max-height:202px}
.nyc-map{display:grid;grid-template-columns:91px 1fr;gap:16px;align-items:end;width:100%}
.nyc-map .object img{max-height:112px}
.map-frame{
  border:9px solid #765139;background:#fbfaf7;padding:12px;cursor:pointer;
  box-shadow:0 13px 25px rgba(0,0,0,.12);transition:transform .2s ease
}
.map-frame:hover,.map-frame:focus-visible{transform:translateY(-4px)}
.map-frame img{width:100%;border:1px solid #ddd4c9}
.map-stats{display:flex;justify-content:space-between;margin-top:7px;font:12px Georgia,serif;color:#5f564d}

/* Recommended */
.chewy img{max-height:205px}
.recommended-books{
  display:grid;grid-template-columns:repeat(6,minmax(86px,1fr));gap:12px;align-items:end;padding:0 6px
}
.book{
  border:0;background:none;padding:0;text-align:left;cursor:pointer;
  transition:transform .22s ease;transform-origin:bottom center
}
.book:hover,.book:focus-visible{transform:translateY(-10px)}
.cover{
  height:222px;border-radius:2px;background:#e9e1d7 center/cover no-repeat;
  box-shadow:0 13px 26px rgba(0,0,0,.17),inset 0 0 0 1px rgba(0,0,0,.07)
}
.book small{display:block;margin-top:8px;font-size:10px;line-height:1.2;font-weight:700}
.book em{display:block;margin-top:2px;font-size:9px;font-style:normal;color:var(--muted)}
.library-card{
  max-width:265px;text-align:left;border:0;background:none;cursor:pointer;padding:0 12px 18px 0
}
.library-card b{display:block;font:500 29px/1.06 Georgia,serif;margin-bottom:8px}
.library-card span.copy{font:14px/1.58 Georgia,serif;color:var(--muted)}

/* Stripe */
.leeds-cluster{display:flex;align-items:flex-end;gap:8px;justify-content:center}
.leeds-cluster img.ball{max-height:123px}.leeds-cluster img.yeboah{max-height:111px}
.stripe-spines{display:flex;align-items:flex-end;gap:4px;overflow-x:auto;padding:0 6px 1px}
.stripe-spine{
  position:relative;flex:0 0 auto;border:0;padding:0;background:#ddd center/cover no-repeat;
  border-radius:2px 2px 0 0;cursor:pointer;overflow:hidden;
  box-shadow:0 10px 18px rgba(0,0,0,.12),inset 0 0 0 1px rgba(0,0,0,.08);
  transition:transform .18s ease
}
.stripe-spine:hover,.stripe-spine:focus-visible{transform:translateY(-8px)}
.stripe-spine.synthetic::after{
  content:attr(data-title);position:absolute;left:50%;top:50%;
  transform:translate(-50%,-50%) rotate(180deg);writing-mode:vertical-rl;
  font:bold 8px Arial;color:#191612;white-space:nowrap;max-height:88%;overflow:hidden
}
.collectibles{display:flex;gap:8px;align-items:flex-end;justify-content:center}
.collectibles img{max-height:133px;max-width:84px}

/* Bottom */
.bottom-row .object img{max-height:127px}
.vajra img{max-height:107px}
.bull img{max-height:139px}
.magnolia-frame{
  border:9px solid #77563d;background:#fff;padding:9px;box-shadow:0 11px 20px rgba(0,0,0,.12)
}
.magnolia-frame img{width:116px;height:128px;object-fit:cover;filter:none}
.charizard img{max-height:96px!important}
.n64-stage{display:flex;align-items:flex-end;justify-content:center;gap:7px;position:relative}
.n64-stage .object img{max-height:110px}
.game-stack{display:flex;flex-direction:column;gap:5px;margin-bottom:7px}
.game-box{
  width:152px;height:38px;border:1px solid #29231e;border-radius:2px;
  background:#1c1b19;color:#f1ad2b;display:flex;align-items:center;padding:0 11px;
  font-size:18px;font-weight:800;box-shadow:0 5px 10px rgba(0,0,0,.11)
}
.game-box.golden{color:#e5c47f;font-family:Georgia,serif}
.play{
  position:absolute;right:28px;bottom:-9px;transform:translateY(100%);z-index:24;
  border:1px solid #d6c5b2;background:#f9f0e4;border-radius:999px;padding:7px 12px;
  font:500 11px Georgia,serif;cursor:pointer
}

.base-cabinets{
  position:relative;z-index:10;display:grid;grid-template-columns:repeat(4,1fr);
  margin:0 -3px 0;padding:0;border-top:14px solid #9b6338;
  background:#c69463;box-shadow:inset 0 1px 0 rgba(255,255,255,.18)
}
.cabinet-door{
  height:118px;position:relative;
  background:
    linear-gradient(90deg,rgba(255,255,255,.10),transparent 24%),
    linear-gradient(180deg,#c89665,#b17a48);
  border-right:1px solid rgba(72,44,23,.18);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.08)
}
.cabinet-door:last-child{border-right:0}
.cabinet-door span{
  position:absolute;left:50%;top:18px;transform:translateX(-50%);
  width:56px;height:5px;border-radius:999px;background:#7a5b43;
  box-shadow:0 1px 0 rgba(255,255,255,.20)
}

.share-bar{position:relative;z-index:8;display:flex;justify-content:center;gap:9px;flex-wrap:wrap;padding-top:21px}
.share-bar button{border:1px solid var(--line);background:white;border-radius:999px;padding:10px 13px;cursor:pointer;font-size:12px}

/* Drawer / Modal */
.backdrop{
  position:fixed;inset:0;background:rgba(29,24,19,.18);backdrop-filter:blur(1.5px);
  opacity:0;pointer-events:none;transition:opacity .2s ease;z-index:89
}
.backdrop.open{opacity:1;pointer-events:auto}
.drawer{
  position:fixed;right:0;top:0;bottom:0;width:min(475px,96vw);background:var(--paper);z-index:100;
  box-shadow:-32px 0 90px rgba(0,0,0,.24);transform:translateX(103%);transition:.28s ease;
  padding:28px;overflow:auto
}
.drawer.open{transform:none}
.close{
  float:right;border:1px solid var(--line);background:none;border-radius:50%;
  width:40px;height:40px;font-size:20px;cursor:pointer
}
.drawer .eyebrow{margin-top:56px}
.drawer h3{margin:10px 0 5px;font:500 40px/1.03 Georgia,serif;letter-spacing:-.03em}
.drawer .sub{color:var(--muted);font:16px Georgia,serif}
.drawer p{font-size:15px;line-height:1.68;color:#4a443d}
.image-box{margin:20px 0;background:#f3ebe1;border:1px solid var(--line);border-radius:14px;padding:18px}
.image-box img{max-height:350px;margin:0 auto;object-fit:contain}
.drawer-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:18px}
.drawer-actions button{border:1px solid var(--line);background:white;border-radius:999px;padding:9px 12px;cursor:pointer;font-size:12px}
.drawer-list{border-top:1px solid var(--line);margin-top:20px}
.drawer-row{padding:14px 0;border-bottom:1px solid var(--line);cursor:pointer}
.drawer-row b{display:block;font:500 17px Georgia,serif}
.drawer-row span{font-size:12px;color:var(--muted)}

.modal{
  position:fixed;inset:0;background:rgba(20,18,16,.57);display:none;
  align-items:center;justify-content:center;padding:22px;z-index:110
}
.modal.open{display:flex}
.modal-card{
  width:min(1180px,96vw);max-height:92vh;overflow:auto;background:var(--paper);
  border-radius:18px;padding:24px;box-shadow:0 30px 100px rgba(0,0,0,.3)
}
.modal-top{display:flex;justify-content:space-between;align-items:center}
.modal-top h3{margin:0;font:500 38px Georgia,serif}
.tools{display:flex;gap:10px;flex-wrap:wrap;margin:14px 0}
.tools input,.tools select{padding:11px 12px;border:1px solid var(--line);border-radius:10px;background:white}
.tools input{flex:1;min-width:260px}
.view-toggle{display:flex;gap:5px}
.view-toggle button{border:1px solid var(--line);background:white;border-radius:10px;padding:10px 12px;cursor:pointer}
.view-toggle button.active{background:#1b1917;color:white}
.count{font-size:12px;color:var(--muted);margin-bottom:10px}
.library-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:10px}
.library-card-item{border:1px solid var(--line);border-radius:11px;padding:14px;background:white;min-height:104px}
.library-card-item h4{font:500 16px/1.2 Georgia,serif;margin:0 0 6px}
.library-card-item p{font-size:11px;color:var(--muted);margin:0}
.library-shelf{display:flex;align-items:flex-end;gap:3px;flex-wrap:wrap;padding:22px 10px 18px;background:#eee5da;border-radius:12px}
.mini-spine{height:120px;width:19px;border:0;cursor:pointer;border-radius:2px 2px 0 0;box-shadow:0 5px 10px rgba(0,0,0,.1)}
.mini-spine:nth-child(6n+1){background:#433b58}.mini-spine:nth-child(6n+2){background:#d8b982}.mini-spine:nth-child(6n+3){background:#324b66}.mini-spine:nth-child(6n+4){background:#8a493b}.mini-spine:nth-child(6n+5){background:#dad7ce}.mini-spine:nth-child(6n){background:#395644}

.retro{
  position:fixed;inset:0;z-index:130;background:#0e0e10;color:#fff;display:none;place-items:center;text-align:center
}
.retro.open{display:grid}
.retro .mark{font-size:70px;animation:pulse 1.35s infinite alternate}
.retro p{color:#aaa}
@keyframes pulse{from{transform:scale(.94);opacity:.7}to{transform:scale(1.05);opacity:1}}

@media(max-width:1120px){
  .site-header{grid-template-columns:1fr}.nav{justify-content:flex-start}.tagline{max-width:none}
  .intro{grid-template-columns:1fr}
  .rail{display:none}
  .shelf,.shelf.recommended-row{grid-template-columns:1fr;gap:25px}
  .shelf.bottom-row{grid-template-columns:repeat(2,1fr)}
  .stage{min-height:160px}
  .library-card{text-align:center;max-width:480px;padding-bottom:20px}
}
@media(max-width:730px){
  .page{padding:0 14px 44px}
  .nav{display:none}
  .study{padding:16px 10px 27px}
  .study-head{display:block}
  .study-head p{margin-top:8px}
  .recommended-books{grid-template-columns:repeat(2,1fr)}
  .shelf.bottom-row{grid-template-columns:1fr}
  .nyc-map{grid-template-columns:1fr}
  .game-stack{display:none}
  .intro{padding-left:4px;padding-right:4px}
}
@media(prefers-reduced-motion:reduce){
  *{scroll-behavior:auto!important;transition:none!important;animation:none!important}
}

.shelf > *{position:relative;z-index:6}
.shelf{background:linear-gradient(180deg,rgba(255,255,255,.02),rgba(112,83,55,.015))}
.study-head{margin-left:4px;margin-right:4px}
@media(min-width:1121px){
  .shelf:nth-of-type(1){padding-top:22px}
  .shelf:nth-of-type(2),.shelf:nth-of-type(3),.shelf:nth-of-type(4){padding-top:21px}
}

@media(max-width:1120px){
  .bookcase-shell{border-left-width:16px;border-right-width:16px;border-bottom-width:16px}
  .case-inner-stile{display:none}
  .base-cabinets{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:730px){
  .bookcase-shell{border-left-width:9px;border-right-width:9px;border-bottom-width:11px;padding-left:12px;padding-right:12px}
  .case-left-post,.case-right-post{width:9px}
  .base-cabinets{grid-template-columns:1fr 1fr}
  .cabinet-door{height:88px}
}