:root{
  --gold:#E5D49A;
  --ivory:#eee8dc;
  --body:#d3cec5;
  --header:#0a0a0a;
}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;background:#0c0906;color:var(--ivory)}
body{
  font-family:Arial,Helvetica,sans-serif;
  background-image:url("/library/_shared/assets/scroll-light-background.png");
  background-repeat:no-repeat;
  background-position:center top;
  background-size:cover;
  background-attachment:fixed;
}
.site-header{
  height:72px;
  
  
  display:flex;
  align-items:center;
  justify-content:center;
  position:relative;
  z-index:10;
}
.brand-wrap{
  display:grid;
  grid-template-columns:42px auto 42px;
  align-items:center;
  gap:10px;
}
.brand-logo{display:block;width:350px;max-width:48vw;height:auto}
.brand-link{display:block}
.menu,.search-button{
  appearance:none;border:0;background:transparent;padding:0;margin:0;
  width:42px;height:42px;position:relative;cursor:pointer;
}
.menu span{
  position:absolute;left:10px;width:22px;height:1px;background:var(--gold);
}
.menu span:nth-child(1){top:13px}
.menu span:nth-child(2){top:20px}
.menu span:nth-child(3){top:27px}
.search-icon{
  position:absolute;width:17px;height:17px;border:1px solid var(--gold);
  border-radius:50%;left:9px;top:9px;
}
.search-icon:after{
  content:"";position:absolute;width:9px;height:1px;background:var(--gold);
  right:-7px;bottom:-4px;transform:rotate(48deg);transform-origin:left center;
}

.library-article-main{
  width:min(1040px,calc(100% - 48px));
  margin:0 auto;
  padding:70px 0 92px;
}
.article-intro{text-align:center}
.article-context-link{
  display:inline-block;
  color:#bcb6ab;
  text-decoration:none;
  font-size:11px;
  line-height:1;
  letter-spacing:.025em;
  transition:color 220ms ease;
}
.article-context-link:hover,
.article-context-link:focus-visible{
  color:var(--gold);
  outline:none;
}
.article-intro h1{
  margin:22px 0 0;
  color:var(--ivory);
  font-size:18px;
  line-height:1.15;
  font-weight:400;
  letter-spacing:.035em;
}
.article-title-rule{
  width:72px;
  height:.5px;
  background:var(--gold);
  margin:16px auto 25px;
}
.article-deck{
  margin:0 auto;
  max-width:760px;
  color:#c8c2b9;
  font-family:Georgia,"Times New Roman",serif;
  font-size:15px;
  line-height:1.8;
  letter-spacing:.025em;
}

.article-feature{
  margin:58px auto 0;
  width:100%;
}
.article-feature img{
  display:block;
  width:100%;
  height:auto;
  border:.5px solid rgba(0,0,0,.92);
  box-shadow:0 2px 12px rgba(0,0,0,.44);
}
.article-feature figcaption{
  margin:15px auto 0;
  color:#bcb6ab;
  text-align:center;
  font-family:Georgia,"Times New Roman",serif;
  font-size:13px;
  line-height:1.55;
  font-style:italic;
  letter-spacing:.02em;
}

.article-opening-copy{
  width:min(720px,100%);
  margin:42px auto 0;
}
.article-opening-copy p{
  margin:0;
  color:var(--ivory);
  font-family:Georgia,"Times New Roman",serif;
  font-size:16px;
  line-height:1.9;
  letter-spacing:.012em;
}

.article-finishing-rule{
  width:100%;
  height:.5px;
  margin:70px auto 0;
  background:rgba(229,212,154,.68);
}

@media(max-width:753px){
  .library-article-main{
    width:min(100% - 30px,520px);
    padding-top:54px;
  }
  .article-intro h1{font-size:18px}
  .article-deck{
    font-size:14px;
    line-height:1.75;
  }
  .desktop-break{display:none}
  .article-feature{margin-top:44px}
  .article-opening-copy{margin-top:34px}
  .article-opening-copy p{
    font-size:15px;
    line-height:1.85;
  }
}


/* =========================================================
   LOCKED LIBRARY ARTICLE GEOMETRY
   Copy the actual final values from the locked Makers &
   Retailers master, rather than approximating its rhythm.
   ========================================================= */

.library-article-main{
  width:min(100% - 36px, var(--standard-content-width,1040px)) !important;
  margin:0 auto !important;
  padding-top:calc(var(--header-h,48px) + 58px) !important;
  padding-bottom:92px !important;
}

.article-intro{
  text-align:center !important;
}

/* Exact equivalent of .library-breadcrumb */
.article-context-link{
  display:inline-block !important;
  margin:0 0 23px !important;
  color:var(--muted,#bcb6ab) !important;
  font-family:"Lucida Grande","Lucida Sans Unicode",Arial,sans-serif !important;
  font-size:10px !important;
  line-height:normal !important;
  font-weight:400 !important;
  letter-spacing:0 !important;
}

/* Exact equivalent of locked category H1 */
.article-intro h1{
  margin:0 !important;
  color:var(--ivory,#ebe6dc) !important;
  font-family:"Lucida Grande","Lucida Sans Unicode",Arial,sans-serif !important;
  font-size:18px !important;
  line-height:1.2 !important;
  font-weight:400 !important;
  letter-spacing:0 !important;
}

/* Exact equivalent of .library-category-title-rule */
.article-title-rule{
  width:72px !important;
  height:0 !important;
  background:none !important;
  border-top:0.5px solid rgba(229,212,154,.9) !important;
  margin:16px auto 27px !important;
}

/* Main introductory text now uses the same master-page type family */
.article-deck{
  margin:0 auto !important;
  max-width:760px !important;
  color:var(--muted,#bcb6ab) !important;
  font-family:"Lucida Grande","Lucida Sans Unicode",Arial,sans-serif !important;
  font-size:13px !important;
  line-height:1.85 !important;
  font-weight:400 !important;
  letter-spacing:0 !important;
}

/* First image begins after the shared intro framework. */
.article-feature{
  margin-top:47px !important;
}

/* Article prose uses the same site family initially; reading sizes can
   be refined later when we design the long-form article modules. */
.article-opening-copy p{
  font-family:"Lucida Grande","Lucida Sans Unicode",Arial,sans-serif !important;
  color:var(--ivory,#ebe6dc) !important;
  font-size:13px !important;
  line-height:1.85 !important;
  letter-spacing:0 !important;
}

@media(max-width:737px){
  .library-article-main{
    width:min(100% - 30px,520px) !important;
    padding-top:calc(var(--header-h,48px) + 42px) !important;
  }

  .article-intro h1{
    font-size:18px !important;
  }

  .article-deck,
  .article-opening-copy p{
    font-size:12px !important;
  }

  .article-feature{
    margin-top:38px !important;
  }
}

/* =========================================================
   STACKED IMAGE MODULE
   Extends v5 only; locked header, colours, type and geometry
   remain unchanged.
   ========================================================= */

.article-plate{
  width:100%;
  margin:58px auto 0;
}

.article-plate-stacked{
  display:flex;
  flex-direction:column;
  gap:16px;
}

.article-plate img{
  display:block;
  width:100%;
  height:auto;
  border:.5px solid rgba(0,0,0,.92);
  box-shadow:0 2px 12px rgba(0,0,0,.44);
}

.article-plate figcaption{
  margin:0 auto;
  color:#bcb6ab;
  text-align:center;
  font-family:Georgia,"Times New Roman",serif;
  font-size:13px;
  line-height:1.55;
  font-style:italic;
  letter-spacing:.02em;
}

@media(max-width:753px){
  .article-plate{
    margin-top:44px;
  }
  .article-plate-stacked{
    gap:12px;
  }
}


/* Prose immediately before stacked image module */
.article-plate-intro{margin-top:58px;}
.article-plate-intro p + p{margin-top:24px;}
.article-plate-intro a{color:var(--gold,#d7bf75);text-decoration:none;}
.article-plate-intro a:hover{text-decoration:underline;}
.article-plate-intro + .article-plate{margin-top:42px;}
@media(max-width:753px){
  .article-plate-intro{margin-top:44px;}
  .article-plate-intro p + p{margin-top:20px;}
  .article-plate-intro + .article-plate{margin-top:34px;}
}


/* Individual captions for stacked images */
.article-plate-item{margin:0;}
.article-plate-stacked{gap:28px;}
.article-plate-item figcaption{margin-top:8px;}
@media(max-width:753px){.article-plate-stacked{gap:24px;}}


/* Charles Asprey III portrait spacing */
.article-feature-charles-iii{margin-top:42px !important;}
.article-feature-charles-iii + .article-plate{margin-top:42px;}
@media(max-width:753px){
  .article-feature-charles-iii{margin-top:34px !important;}
  .article-feature-charles-iii + .article-plate{margin-top:34px;}
}

/* Normal prose spacing across the opening history */
.article-opening-copy + .article-plate-intro{
  margin-top:24px !important;
}
.article-plate-intro p + p{
  margin-top:24px !important;
}
@media(max-width:753px){
  .article-opening-copy + .article-plate-intro{margin-top:20px !important;}
  .article-plate-intro p + p{margin-top:20px !important;}
}

/* Maker plate caption, Edwards paragraph and 1858 catalogue */
.article-post-plate-copy{margin-top:42px;}
.article-post-plate-copy a{color:var(--gold,#d7bf75);text-decoration:none;}
.article-post-plate-copy a:hover{text-decoration:underline;}
.article-feature-auction-catalogue{margin-top:42px !important;}
@media(max-width:753px){
 .article-post-plate-copy{margin-top:34px;}
 .article-feature-auction-catalogue{margin-top:34px !important;}
}


/* 1862 paragraph spacing, caption and Waring description */
.article-post-plate-copy p + p{margin-top:24px !important;}
.article-waring-copy{margin-top:42px !important;}
.article-waring-copy p + p{margin-top:24px !important;}
.article-waring-copy .historical-quotation{font-style:italic;}
.article-waring-copy .modern-value{font-style:italic;}
.article-feature-international-exhibition-photo{margin-top:42px !important;}
@media(max-width:753px){
  .article-post-plate-copy p + p{margin-top:20px !important;}
  .article-waring-copy{margin-top:34px !important;}
  .article-waring-copy p + p{margin-top:20px !important;}
  .article-feature-international-exhibition-photo{margin-top:34px !important;}
}


/* Later nineteenth-century history */
.article-later-history{margin-top:42px !important;}
.article-later-history p + p{margin-top:24px !important;}
.article-later-history a{color:var(--gold,#d7bf75);text-decoration:none;}
.article-later-history a:hover{text-decoration:underline;}
.article-later-history .article-note{margin-top:32px !important;}
@media(max-width:753px){
 .article-later-history{margin-top:34px !important;}
 .article-later-history p + p{margin-top:20px !important;}
 .article-later-history .article-note{margin-top:28px !important;}
}

/* Maker plates — 600px */
.article-plate-item--makers-plate {
  width: 600px;
  max-width: 100%;
  margin-left: auto;
  margin-right: auto;
}

/* 1858 auction catalogue — 500px */
.article-feature-auction-catalogue {
  width: 500px;
  max-width: 100%;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* 1862 archive image and Charles Asprey III portrait */
.article-feature-international-exhibition-photo {
  width: 600px;
  max-width: 100%;
  margin-left: auto !important;
  margin-right: auto !important;
}

.article-feature-charles-iii {
  width: 400px;
  max-width: 100%;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* 1862 International Exhibition image — 650px */
.article-feature-international-exhibition {
  width: 650px;
  max-width: 100%;
  margin-left: auto !important;
  margin-right: auto !important;
}


/* Documentary images — 600px */
.article-plate-item--documentary-600 {
  width: 600px;
  max-width: 100%;
  margin-left: auto;
  margin-right: auto;
}


/* Advertisement sizing */
.article-plate-item--advert-500 {
  width: 500px;
  max-width: 100%;
  margin-left: auto;
  margin-right: auto;
}

.article-plate-item--advert-754 {
  width: 754px;
  max-width: 100%;
  margin-left: auto;
  margin-right: auto;
}


/* Archival document sizing */
.article-plate-item--documentary-500 {
  width: 500px;
  max-width: 100%;
  margin-left: auto;
  margin-right: auto;
}

/* Caption-to-next-image spacing */
.article-plate-stacked {
  gap: 48px;
}
@media(max-width:753px) {
  .article-plate-stacked {
    gap: 44px;
  }
}


/* Links from Library photographs to individual item pages */
.article-item-image-link {
  display:block;
  color:inherit;
  text-decoration:none;
  cursor:pointer;
}
.article-item-page-link {
  display:inline;
  margin-left:8px;
  color:var(--gold,#d7bf75);
  font-family:Georgia,"Times New Roman",serif;
  font-style:normal;
  font-size:11px;
  line-height:inherit;
  letter-spacing:.12em;
  white-space:nowrap;
  text-decoration:none;
}
.article-item-page-link:hover { text-decoration:underline; }

/* FINAL SHARED HEADER SYNC */
.site-header{
  
  
  
}

/* FINAL SHARED HEADER SYNC */
.site-header{
  background:linear-gradient(90deg,#090705 0%,#0d0b08 22%,#1b1815 42%,#211e1b 50%,#1b1815 58%,#0d0b08 78%,#090705 100%) !important;
  border-bottom:0 !important;
  box-shadow:none !important;
}


/* DEFINITIVE ARTICLE LIGHTBOX — SHARED ITEM LIGHTBOX SYSTEM */
.dl-lightbox{
  position:fixed;
  inset:0;
  z-index:10000;
  display:grid;
  grid-template-columns:56px minmax(0,1fr) 56px;
  grid-template-rows:minmax(0,1fr) auto;
  background:#000;
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transition:opacity 275ms ease, visibility 0s linear 275ms;
}

.dl-lightbox.is-open{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
  transition:opacity 275ms ease;
}

html.dl-lightbox-open,
html.dl-lightbox-open body{
  overflow:hidden;
}

.dl-lightbox-viewport{
  grid-column:2;
  grid-row:1;
  position:relative;
  min-width:0;
  min-height:0;
  margin:14px 0 0;
  overflow:hidden;
  display:flex;
  align-items:center;
  justify-content:center;
  cursor:zoom-in;
  touch-action:none;
}

.dl-lightbox-viewport.is-pannable{cursor:grab;}
.dl-lightbox-viewport.is-dragging{cursor:grabbing;}
#dl-lightbox-viewport:focus{outline:none;}

.dl-lightbox-image{
  position:absolute;
  left:50%;
  top:50%;
  max-width:none;
  max-height:none;
  translate:-50% -50%;
  transform-origin:center center;
  user-select:none;
  -webkit-user-drag:none;
  will-change:transform;
  transition:transform 220ms ease;
}

.dl-lightbox-viewport.is-dragging .dl-lightbox-image{
  transition:none;
}

.dl-lightbox-close,
.dl-lightbox-nav{
  appearance:none;
  border:0;
  background:transparent;
  color:#b8b5af;
  -webkit-text-fill-color:#b8b5af;
  cursor:pointer;
  opacity:1;
  transition:color 220ms ease, -webkit-text-fill-color 220ms ease;
}

.dl-lightbox-close{
  position:absolute;
  z-index:5;
  top:12px;
  right:14px;
  width:42px;
  height:42px;
  padding:0;
  font-family:Arial,sans-serif;
  font-size:34px;
  font-weight:200;
  line-height:40px;
}

.dl-lightbox-nav{
  position:fixed;
  top:50vh;
  bottom:auto;
  z-index:5;
  width:72px;
  height:132px;
  padding:0;
  margin:0;
  transform:translateY(-50%);
  font-family:Georgia,serif;
  font-size:56px;
  line-height:1;
}

.dl-lightbox-prev{left:0;}
.dl-lightbox-next{right:0;}

@media (hover:hover) and (pointer:fine){
  .dl-lightbox-close:hover,
  .dl-lightbox-nav:hover{
    color:#e5d49a;
    -webkit-text-fill-color:#e5d49a;
  }
}

.dl-lightbox-close:focus-visible,
.dl-lightbox-nav:focus-visible{
  color:#e5d49a;
  -webkit-text-fill-color:#e5d49a;
  outline:none;
}

.dl-lightbox-bottom{
  grid-column:1 / -1;
  grid-row:2;
  display:flex;
  flex-direction:column;
  align-items:center;
  padding:10px 58px 16px;
  background:#000;
}

.dl-lightbox-caption{
  display:none;
}

.dl-lightbox-thumb-nav{
  width:min(840px,calc(100vw - 120px));
  display:grid;
  grid-template-columns:32px minmax(0,760px) 32px;
  align-items:center;
  justify-content:center;
  gap:8px;
  margin:0 auto;
}

.dl-lightbox-thumbs{
  width:100%;
  max-width:760px;
  min-height:72px;
  display:flex;
  align-items:center;
  justify-content:flex-start;
  gap:8px;
  overflow-x:auto;
  overflow-y:hidden;
  scrollbar-width:none;
  scroll-behavior:smooth;
  padding:0 2px 2px;
  margin:0 auto;
  box-sizing:border-box;
}

.dl-lightbox-thumbs::-webkit-scrollbar{display:none;}

.dl-lightbox-thumb{
  flex:0 0 auto;
  width:78px;
  height:64px;
  padding:0;
  border:.5px solid transparent;
  background:transparent;
  opacity:.50;
  cursor:pointer;
  overflow:hidden;
  transition:opacity 220ms ease,border-color 220ms ease;
}

.dl-lightbox-thumb img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  filter:none !important;
}

.dl-lightbox-thumb.is-active{
  opacity:1;
  border-color:rgba(229,212,154,.72);
}

@media (hover:hover) and (pointer:fine){
  .dl-lightbox-thumb:hover{opacity:.88;}
}

.dl-lightbox-thumb:focus-visible{
  opacity:1;
  border-color:rgba(229,212,154,.72);
  outline:none;
}

.dl-lightbox-thumb-scroll{
  appearance:none;
  border:0;
  background:transparent;
  width:32px;
  height:64px;
  padding:0;
  color:rgba(238,233,223,.42);
  font-family:Georgia,serif;
  font-size:28px;
  line-height:1;
  cursor:pointer;
  transition:color 220ms ease,opacity 220ms ease;
}

.dl-lightbox-thumb-scroll[hidden]{visibility:hidden;}
.dl-lightbox-thumb-scroll:disabled{
  opacity:.16;
  cursor:default;
}

@media (hover:hover) and (pointer:fine){
  .dl-lightbox-thumb-scroll:not(:disabled):hover{
    color:#e5d49a;
  }
}

.dl-lightbox-thumb-scroll:focus-visible{
  color:#e5d49a;
  outline:none;
}

.dl-lightbox-trigger{cursor:zoom-in;}

@media (max-width:900px){
  .dl-lightbox-thumb-nav{
    width:calc(100vw - 80px);
    grid-template-columns:28px minmax(0,1fr) 28px;
    gap:6px;
  }
  .dl-lightbox-thumb-scroll{width:28px;}
}

@media (max-width:700px){
  .dl-lightbox{
    grid-template-columns:38px minmax(0,1fr) 38px;
  }
  .dl-lightbox-nav{
    width:48px;
    height:112px;
    font-size:42px;
  }
  .dl-lightbox-close{
    top:6px;
    right:5px;
  }
  .dl-lightbox-bottom{
    padding:7px 42px 10px;
  }
  .dl-lightbox-thumb-nav{
    width:calc(100vw - 54px);
    grid-template-columns:24px minmax(0,1fr) 24px;
    gap:4px;
  }
  .dl-lightbox-thumbs{
    min-height:62px;
    gap:6px;
  }
  .dl-lightbox-thumb{
    width:66px;
    height:54px;
  }
  .dl-lightbox-thumb-scroll{
    width:24px;
    height:54px;
    font-size:23px;
  }
}

@media (prefers-reduced-motion:reduce){
  .dl-lightbox,
  .dl-lightbox-image,
  .dl-lightbox-close,
  .dl-lightbox-nav,
  .dl-lightbox-thumb,
  .dl-lightbox-thumb-scroll{
    transition:none !important;
  }
}



/* ITEM PAGE THUMBNAIL SCROLL ARROWS */
.thumb-scroll-left,
.thumb-scroll-right{
  color:rgba(238,233,223,.56) !important;
  -webkit-text-fill-color:rgba(238,233,223,.56) !important;
  transition:color 220ms ease,-webkit-text-fill-color 220ms ease,opacity 220ms ease !important;
}

@media (hover:hover) and (pointer:fine){
  .thumb-scroll-left:not(:disabled):hover,
  .thumb-scroll-right:not(:disabled):hover{
    color:#e5d49a !important;
    -webkit-text-fill-color:#e5d49a !important;
  }
}

.thumb-scroll-left:focus-visible,
.thumb-scroll-right:focus-visible{
  color:#e5d49a !important;
  -webkit-text-fill-color:#e5d49a !important;
  outline:none !important;
}


/* =========================================================
   ITEM LIGHTBOX — MOBILE GESTURES
   ========================================================= */
#dl-lightbox,
#dl-lightbox *{
  -webkit-user-select:none !important;
  user-select:none !important;
  -webkit-user-drag:none !important;
}

#dl-lightbox{
  -webkit-touch-callout:none !important;
}

#dl-lightbox-viewport{
  -webkit-user-select:none !important;
  user-select:none !important;
  -webkit-touch-callout:none !important;
  touch-action:none !important;
}

@media (max-width:700px){
  .dl-lightbox-close{
    width:48px !important;
    height:48px !important;
    line-height:46px !important;
  }

  .dl-lightbox-nav{
    width:52px !important;
    min-width:52px !important;
  }

  .dl-lightbox-thumb-scroll{
    min-width:44px !important;
  }

  .dl-lightbox-thumbs{
    -webkit-overflow-scrolling:touch;
    scroll-snap-type:x proximity;
    touch-action:pan-x;
  }

  .dl-lightbox-thumb{
    scroll-snap-align:center;
  }
}




/* =========================================================
   

/* ARTICLE LIGHTBOX — PAN / SELECTION SUPPRESSION */
#dl-lightbox,
#dl-lightbox *,
#dl-lightbox-viewport,
#dl-lightbox-image{
  -webkit-user-select:none !important;
  user-select:none !important;
  -webkit-user-drag:none !important;
}

#dl-lightbox-image{
  pointer-events:auto;
  -webkit-touch-callout:none !important;
}

#dl-lightbox-viewport.is-pannable,
#dl-lightbox-viewport.is-pannable *{
  cursor:grab;
}

#dl-lightbox-viewport.is-pannable.is-dragging,
#dl-lightbox-viewport.is-pannable.is-dragging *{
  cursor:grabbing;
}




/* Preserve visible paragraph structure from the source article. */
.article-opening-copy p{
  margin:0;
}
.article-opening-copy p + p{
  margin-top:1.35em;
}

/* Internal article links use the Daniel Lucian gold treatment, not browser blue. */
.article-opening-copy a,
.library-article-main p a{
  color:var(--gold) !important;
  text-decoration:none;
}
.article-opening-copy a:hover,
.library-article-main p a:hover{
  color:var(--gold-light, var(--gold)) !important;
}

/* Breadcrumb/context link: pale at rest, gold on hover. */
.article-context-link{
  color:rgba(242,238,230,.72) !important;
  text-decoration:none !important;
}
.article-context-link:hover,
.article-context-link:focus-visible{
  color:var(--gold) !important;
}





.dl-lightbox-thumb-nav{
  grid-template-columns:auto auto auto !important;
  justify-content:center !important;
  width:min(840px,calc(100vw - 120px)) !important;
}

.dl-lightbox-thumbs{
  display:grid !important;
  grid-auto-flow:column !important;
  grid-auto-columns:78px !important;
  grid-template-rows:64px !important;
  column-gap:8px !important;
  justify-content:start !important;
  align-items:center !important;
  box-sizing:border-box !important;
  overflow-x:auto !important;
  overflow-y:hidden !important;
  padding:0 2px 2px !important;
  margin:0 !important;
  min-height:66px !important;
  contain:none !important;
  scroll-behavior:auto !important;
}

.dl-lightbox-thumb{
  display:block !important;
  width:78px !important;
  min-width:78px !important;
  max-width:78px !important;
  height:64px !important;
  min-height:64px !important;
  max-height:64px !important;
  box-sizing:border-box !important;
}

.dl-lightbox-thumb img{
  display:block !important;
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
}

.dl-lightbox-thumbs.fits-all{
  overflow-x:hidden !important;
}

@media (max-width:700px){
  .dl-lightbox-thumb-nav{
    width:calc(100vw - 54px) !important;
  }
  .dl-lightbox-thumbs{
    grid-auto-columns:66px !important;
    grid-template-rows:54px !important;
    column-gap:6px !important;
    min-height:56px !important;
  }
  .dl-lightbox-thumb{
    width:66px !important;
    min-width:66px !important;
    max-width:66px !important;
    height:54px !important;
    min-height:54px !important;
    max-height:54px !important;
  }
}







.article-explore-further{
  width:100%;
  max-width:754px;
  margin:58px auto 44px;
  text-align:center;
}

.article-explore-further h2{
  margin:0;
  color:var(--ivory,#ebe6dc);
  font-size:14px;
  line-height:1.2;
  font-weight:400;
  letter-spacing:.02em;
}

.article-explore-further h2::after{
  content:"";
  display:block;
  width:56px;
  height:0;
  border-top:0.5px solid rgba(229,212,154,.62);
  margin:13px auto 20px;
}

.article-explore-links{
  width:min(100%,620px);
  margin:0 auto;
  display:block;
}

.article-explore-links a{
  min-height:54px;
  display:flex;
  justify-content:center;
  align-items:center;
  padding:0 12px;
  color:#eee9df !important;
  font-size:17px;
  line-height:1.3;
  font-weight:400;
  text-align:center;
  text-decoration:none !important;
  background:transparent !important;
  border-bottom:0.5px solid rgba(229,212,154,.085) !important;
  transition:color 220ms ease,border-bottom-color 220ms ease !important;
  text-shadow:none !important;
}

@media (hover:hover) and (pointer:fine){
  .article-explore-links a:hover{
    color:#e5d49a !important;
    background:transparent !important;
    border-bottom-color:rgba(229,212,154,.62) !important;
  }
}

.article-explore-links a:focus-visible{
  color:#e5d49a !important;
  background:transparent !important;
  border-bottom-color:rgba(229,212,154,.62) !important;
  outline:none !important;
}

@media(max-width:737px){
  .article-explore-further{
    margin-top:48px;
  }
  .article-explore-further h2{
    font-size:13px;
  }
  .article-explore-links a{
    min-height:56px !important;
    font-size:16px;
  }
}





.article-feature:not(:has(.article-item-image-link)) img{
  display:block;
  width:auto !important;
  max-width:100% !important;
  max-height:78vh !important;
  height:auto !important;
  margin-left:auto !important;
  margin-right:auto !important;
  object-fit:contain !important;
}

/* Preserve editorial figure width but allow tall images to scale down
   proportionally until they fit comfortably within the viewport. */
.article-feature:not(:has(.article-item-image-link)){
  text-align:center;
}

/* DL-linked box images are governed separately and remain full article-width
   unless we deliberately size them editorially. */
.article-item-image-link img{
  max-height:none !important;
}





.article-finishing-rule{
  width:min(1040px,calc(100% - 48px)) !important;
  max-width:1040px !important;
  height:0 !important;
  border:0 !important;
  border-top:0.5px solid rgba(181,145,72,.72) !important;
  margin:clamp(48px,5vw,68px) auto 34px !important;
  opacity:1 !important;
}

@media(max-width:737px){
  .article-finishing-rule{
    width:calc(100% - 48px) !important;
  }
}





@media (max-width:760px){
  html{
    background:#0c0906 !important;
  }

  body{
    position:relative !important;
    isolation:isolate !important;
    background-image:none !important;
    background-color:transparent !important;
  }

  body::before{
    content:"" !important;
    position:fixed !important;
    z-index:-1 !important;
    inset:0 !important;
    width:100vw !important;
    height:100vh !important;
    height:100dvh !important;
    background-color:#0c0906 !important;
    background-image:url("/library/_shared/assets/scroll-light-background.png") !important;
    background-repeat:no-repeat !important;
    background-position:center top !important;
    background-size:cover !important;
    pointer-events:none !important;
    transform:translateZ(0) !important;
    -webkit-transform:translateZ(0) !important;
  }
}


/* =========================================================
   DANIEL LUCIAN REFERENCE LIBRARY ARTICLE — CLEAN LOCKED
   FINAL MIGRATION STANDARD

   FINAL RULES
   - 754px text column.
   - Inline images: editorial width, practical minimum 600px
     where source quality allows, maximum 78vh height.
   - No upscaling.
   - Reference images use the definitive Lightbox.
   - Safari-safe explicit-grid Lightbox thumbnail strip.
   - DL box images link to their item page rather than Lightbox.
   - Internal article links use Daniel Lucian gold.
   - Category breadcrumb: pale at rest, gold on hover/focus.
   - EXPLORE FURTHER uses exact Library category Reference Index
     styling: 620px centred, 17px desktop / 16px mobile,
     54px rows, 0.5px dividers, gold hover/focus.
   - Final finishing line: 1040px centred, 0.5px standard gold.
   - Mobile background uses fixed viewport pseudo-layer for Safari.
   ========================================================= */


/* =========================================================
   GREAT EXHIBITION — CLEAN LOCKED EDITORIAL IMAGE FLOW
   Images are placed beside the text that gives them context.
   ========================================================= */
.article-flow-copy{
  margin-bottom:0 !important;
}
.article-flow-copy + .article-feature{
  margin-top:clamp(30px,3.2vw,44px) !important;
}
.article-feature + .article-flow-copy{
  margin-top:clamp(48px,5vw,68px) !important;
}


/* ARTICLE EDITORIAL SPACING — CLEAN LOCKED 44 / 55 */

/* Bottom of text block -> following image */
.article-flow-copy + .article-feature{
  margin-top:44px !important;
}

/* Image/caption block -> following text block */
.article-feature + .article-flow-copy{
  margin-top:55px !important;
}


/* =========================================================
   DANIEL LUCIAN REFERENCE LIBRARY ARTICLE — CLEAN LOCKED FINAL
   APPROVED MIGRATION STANDARD

   Layout & navigation:
   - 754px text column.
   - Category breadcrumb pale at rest, gold on hover/focus.
   - Internal article links use Daniel Lucian gold.
   - EXPLORE FURTHER uses exact Library category Reference Index styling.
   - Final finishing line: 1040px centred, 0.5px standard gold.
   - Unified hamburger rendering.
   - Mobile Safari background uses fixed viewport pseudo-layer.

   Images:
   - Practical minimum inline width: 600px where source quality permits.
   - Editorial widths may be larger up to the article maximum.
   - Maximum inline height: 78vh.
   - No upscaling.
   - Reference images use the definitive Safari-safe Lightbox.
   - DL box images link directly to their item pages.

   Editorial rhythm:
   - Text block -> following image: 44px.
   - Image/caption block -> following text: 55px.
   - Images are placed contextually beside the text they illustrate.
   ========================================================= */




/* DANIEL LUCIAN LIBRARY — AUTHORITATIVE LINKING DL IMAGE RULE
   Body text remains 754px.
   Linking DL figures occupy the 1040px wide article image area.
   The image itself fills that figure width, unless 78vh requires it to reduce.
   Captions follow the figure width.
   Associated close-up/details remain on their separate 754px treatment. */
.article-feature.article-dl-box{
  width:min(1040px, 100%) !important;
  max-width:1040px !important;
  margin-left:auto !important;
  margin-right:auto !important;
}
.article-feature.article-dl-box > a,
.article-feature.article-dl-box .article-item-image-link{
  display:block !important;
  width:100% !important;
  max-width:100% !important;
}
.article-feature.article-dl-box img{
  display:block !important;
  width:100% !important;
  max-width:100% !important;
  height:auto !important;
  max-height:78vh !important;
  margin-left:auto !important;
  margin-right:auto !important;
  object-fit:contain !important;
}
.article-feature.article-dl-box figcaption{
  width:100% !important;
  max-width:1040px !important;
  margin-left:auto !important;
  margin-right:auto !important;
  box-sizing:border-box !important;
}

/* Associated detail remains deliberately narrower than the complete DL box. */
.article-feature.article-associated-detail{
  width:min(754px,100%) !important;
  max-width:754px !important;
  margin-left:auto !important;
  margin-right:auto !important;
}
.article-feature.article-associated-detail > img,
.article-feature.article-associated-detail > a > img{
  display:block !important;
  width:100% !important;
  max-width:100% !important;
  height:auto !important;
  max-height:78vh !important;
  margin-left:auto !important;
  margin-right:auto !important;
  object-fit:contain !important;
}
.article-feature.article-associated-detail figcaption{
  width:100% !important;
  max-width:754px !important;
  margin-left:auto !important;
  margin-right:auto !important;
  box-sizing:border-box !important;
}


/* ASPREY COMPLETE REMAKE — FINAL LOCKED LIBRARY RULES */

/* Body copy remains the 754px reading column. */
.article-intro,
.article-opening-copy{
  width:754px !important;
  max-width:100% !important;
  margin-left:auto !important;
  margin-right:auto !important;
}

/* Linking Daniel Lucian item images use the 1040px wide article canvas. */
.article-feature.article-dl-box{
  width:min(1040px,100%) !important;
  max-width:1040px !important;
  margin-left:auto !important;
  margin-right:auto !important;
}
.article-feature.article-dl-box > a{
  display:block !important;
  width:100% !important;
}
.article-feature.article-dl-box img{
  display:block !important;
  width:100% !important;
  max-width:100% !important;
  height:auto !important;
  max-height:78vh !important;
  margin-left:auto !important;
  margin-right:auto !important;
  object-fit:contain !important;
}
.article-feature.article-dl-box figcaption{
  width:100% !important;
  max-width:1040px !important;
  box-sizing:border-box !important;
}

/* Details photographed from a Daniel Lucian box sit inside the 754px detail system.
   Individual 600px aesthetic choices remain deliberately narrower. */
.article-feature.article-associated-detail{
  width:min(754px,100%) !important;
  max-width:754px !important;
  margin-left:auto !important;
  margin-right:auto !important;
}
.article-feature.article-associated-detail img{
  display:block !important;
  width:100% !important;
  max-width:100% !important;
  height:auto !important;
  max-height:78vh !important;
  margin-left:auto !important;
  margin-right:auto !important;
  object-fit:contain !important;
}
.article-feature.article-associated-detail figcaption{
  width:100% !important;
  max-width:100% !important;
  box-sizing:border-box !important;
}

/* Deliberate editorial widths. */
.article-feature.article-width-600{width:min(600px,100%) !important;max-width:600px !important;margin-left:auto !important;margin-right:auto !important;}
.article-feature.article-width-650{width:min(650px,100%) !important;max-width:650px !important;margin-left:auto !important;margin-right:auto !important;}
.article-feature.article-width-700{width:min(700px,100%) !important;max-width:700px !important;margin-left:auto !important;margin-right:auto !important;}
.article-feature.article-width-754{width:min(754px,100%) !important;max-width:754px !important;margin-left:auto !important;margin-right:auto !important;}

.article-feature.article-width-600 img,
.article-feature.article-width-650 img,
.article-feature.article-width-700 img,
.article-feature.article-width-754 img,
.article-feature.article-editorial img{
  display:block !important;
  width:100% !important;
  max-width:100% !important;
  height:auto !important;
  max-height:78vh !important;
  object-fit:contain !important;
  margin-left:auto !important;
  margin-right:auto !important;
}
.article-feature.article-width-600 figcaption,
.article-feature.article-width-650 figcaption,
.article-feature.article-width-700 figcaption,
.article-feature.article-width-754 figcaption{
  width:100% !important;
  max-width:100% !important;
  box-sizing:border-box !important;
}

/* Small archival advertisements are not forced to fill the wide article canvas. */
.article-feature.article-native-small{
  width:auto !important;
  max-width:754px !important;
  margin-left:auto !important;
  margin-right:auto !important;
}
.article-feature.article-native-small img{
  width:auto !important;
  max-width:100% !important;
  max-height:78vh !important;
}
.article-feature.article-native-small figcaption{
  width:100% !important;
  max-width:100% !important;
}

/* Page/item links stay in the current tab and retain the established gold treatment. */
.article-item-page-link{
  white-space:nowrap;
}



/* Linking DL photographs */
.article-feature.article-dl-box{
  width:min(1040px,100%) !important;
  max-width:1040px !important;
  margin-left:auto !important;
  margin-right:auto !important;
}
.article-feature.article-dl-box > a{
  display:block !important;
  width:100% !important;
  max-width:100% !important;
}
.article-feature.article-dl-box img{
  display:block !important;
  width:100% !important;
  max-width:100% !important;
  height:auto !important;
  max-height:78vh !important;
  margin-left:auto !important;
  margin-right:auto !important;
  object-fit:contain !important;
}
.article-feature.article-dl-box figcaption{
  width:100% !important;
  max-width:1040px !important;
  margin-left:auto !important;
  margin-right:auto !important;
  box-sizing:border-box !important;
}

/* Associated details from DL boxes */
.article-feature.article-associated-detail{
  width:min(754px,100%) !important;
  max-width:754px !important;
  margin-left:auto !important;
  margin-right:auto !important;
}
.article-feature.article-associated-detail img{
  display:block !important;
  width:auto !important;
  max-width:100% !important;
  height:auto !important;
  max-height:78vh !important;
  margin-left:auto !important;
  margin-right:auto !important;
  object-fit:contain !important;
}
.article-feature.article-associated-detail figcaption{
  width:100% !important;
  max-width:754px !important;
  margin-left:auto !important;
  margin-right:auto !important;
  box-sizing:border-box !important;
}

/* Editorial / historical images */
.article-feature.article-editorial img{
  display:block !important;
  width:auto !important;
  max-width:100% !important;
  height:auto !important;
  max-height:78vh !important;
  margin-left:auto !important;
  margin-right:auto !important;
  object-fit:contain !important;
}

/* Preserve deliberate editorial figure widths while preventing source upscaling. */
.article-feature.article-width-600{width:min(600px,100%) !important;max-width:600px !important;margin-left:auto !important;margin-right:auto !important;}
.article-feature.article-width-650{width:min(650px,100%) !important;max-width:650px !important;margin-left:auto !important;margin-right:auto !important;}
.article-feature.article-width-700{width:min(700px,100%) !important;max-width:700px !important;margin-left:auto !important;margin-right:auto !important;}
.article-feature.article-width-754{width:min(754px,100%) !important;max-width:754px !important;margin-left:auto !important;margin-right:auto !important;}
.article-feature.article-native-small{width:auto !important;max-width:754px !important;margin-left:auto !important;margin-right:auto !important;}

/* No artificial frames anywhere in the Library article. */
.library-article-main figure,
.library-article-main .article-feature,
.library-article-main figure img,
.library-article-main .article-feature img,
.library-article-main figure > a,
.library-article-main .article-feature > a{
  border:0 !important;
  outline:0 !important;
  box-shadow:none !important;
}
.library-article-main figure,
.library-article-main .article-feature{
  background:transparent !important;
}


/* DANIEL LUCIAN — ASPREY — DEFINITIVE CLEAN LOCKED IMAGE SYSTEM

   FINAL HIERARCHY
   - Body text: 754px
   - Linking DL box photographs: 1040px maximum, image fills figure
   - Associated DL details: 754px maximum, never beyond intrinsic/native width
   - Historical/editorial images: retain deliberate aesthetic widths, never forced beyond intrinsic/native width
   - Captions follow figure width
   - 78vh vertical safety ceiling
   - No artificial image borders/frames/outlines/shadows
*/

/* Reading column */
.article-intro,
.article-opening-copy{
  width:754px !important;
  max-width:100% !important;
  margin-left:auto !important;
  margin-right:auto !important;
}

/* Linking DL photographs */
.article-feature.article-dl-box{
  width:min(1040px,100%) !important;
  max-width:1040px !important;
  margin-left:auto !important;
  margin-right:auto !important;
}
.article-feature.article-dl-box > a,
.article-feature.article-dl-box .article-item-image-link{
  display:block !important;
  width:100% !important;
  max-width:100% !important;
}
.article-feature.article-dl-box img{
  display:block !important;
  width:100% !important;
  max-width:100% !important;
  height:auto !important;
  max-height:78vh !important;
  margin-left:auto !important;
  margin-right:auto !important;
  object-fit:contain !important;
}
.article-feature.article-dl-box figcaption{
  width:100% !important;
  max-width:1040px !important;
  margin-left:auto !important;
  margin-right:auto !important;
  box-sizing:border-box !important;
}

/* Associated details from DL boxes.
   Crucially, these figures are no longer allowed to retain old 600px width classes. */
.article-feature.article-associated-detail{
  width:min(754px,100%) !important;
  max-width:754px !important;
  margin-left:auto !important;
  margin-right:auto !important;
}
.article-feature.article-associated-detail img{
  display:block !important;
  width:auto !important;
  max-width:100% !important;
  height:auto !important;
  max-height:78vh !important;
  margin-left:auto !important;
  margin-right:auto !important;
  object-fit:contain !important;
}
.article-feature.article-associated-detail figcaption{
  width:100% !important;
  max-width:754px !important;
  margin-left:auto !important;
  margin-right:auto !important;
  box-sizing:border-box !important;
}

/* Historical/editorial images retain their selected aesthetic widths. */
.article-feature.article-editorial img{
  display:block !important;
  width:auto !important;
  max-width:100% !important;
  height:auto !important;
  max-height:78vh !important;
  margin-left:auto !important;
  margin-right:auto !important;
  object-fit:contain !important;
}
.article-feature.article-width-600{width:min(600px,100%) !important;max-width:600px !important;margin-left:auto !important;margin-right:auto !important;}
.article-feature.article-width-650{width:min(650px,100%) !important;max-width:650px !important;margin-left:auto !important;margin-right:auto !important;}
.article-feature.article-width-700{width:min(700px,100%) !important;max-width:700px !important;margin-left:auto !important;margin-right:auto !important;}
.article-feature.article-width-754{width:min(754px,100%) !important;max-width:754px !important;margin-left:auto !important;margin-right:auto !important;}
.article-feature.article-native-small{width:auto !important;max-width:754px !important;margin-left:auto !important;margin-right:auto !important;}

/* No artificial frames anywhere in the Library article. */
.library-article-main figure,
.library-article-main .article-feature,
.library-article-main figure img,
.library-article-main .article-feature img,
.library-article-main figure > a,
.library-article-main .article-feature > a{
  border:0 !important;
  outline:0 !important;
  box-shadow:none !important;
}
.library-article-main figure,
.library-article-main .article-feature{
  background:transparent !important;
}


/* =========================================================
   LIGHTBOX DRAG / FOCUS ARTIFACT FIX
   Prevent Safari/browser selection and focus rectangles from
   appearing while the full-size image is panned.
   ========================================================= */
.dl-lightbox-viewport,
.dl-lightbox-image{
  -webkit-user-select:none !important;
  user-select:none !important;
  -webkit-touch-callout:none !important;
  -webkit-tap-highlight-color:transparent !important;
  outline:none !important;
}
.dl-lightbox-image{
  pointer-events:auto;
  -webkit-user-drag:none !important;
  user-drag:none !important;
}
.dl-lightbox-viewport:focus,
.dl-lightbox-viewport:focus-visible,
.dl-lightbox-image:focus,
.dl-lightbox-image:focus-visible{
  outline:none !important;
  box-shadow:none !important;
}
.dl-lightbox-viewport.is-dragging,
.dl-lightbox-viewport.is-dragging *,
.dl-lightbox-viewport::selection,
.dl-lightbox-image::selection{
  -webkit-user-select:none !important;
  user-select:none !important;
  background:transparent !important;
}

/* =========================================================
   V14 — PROVEN V109 SHORT MOBILE LANDSCAPE VIEWPORT GLOW

   Proven on Item page and Collection.
   Background mechanism only.
   No article/gallery geometry changes.
   ========================================================= */

@media (orientation:landscape) and (max-height:520px) and (max-width:1000px){

  html{
    background:#0f0b07 !important;
  }

  body{
    background:transparent !important;
    background-image:none !important;
    min-height:100%;
  }

  /*
     V14 already has a portrait/mobile body::before background
     layer. Suppress it in short landscape so there is only one
     active viewport-background system.
  */
  body::before{
    content:none !important;
    display:none !important;
  }

  html::before{
    content:"";
    position:fixed;
    inset:0;
    z-index:-1;
    pointer-events:none;

    background:
      radial-gradient(
        ellipse 48% 105% at 50% 18%,
        rgba(107,105,97,.96) 0%,
        rgba(82,79,73,.88) 20%,
        rgba(48,44,39,.72) 46%,
        rgba(24,19,14,.48) 66%,
        rgba(15,11,7,0) 82%
      );

    background-repeat:no-repeat;
    background-position:center top;
    background-size:100% 760px;
  }
}

/* =========================================================
   V14 — SHORT MOBILE LANDSCAPE TYPOGRAPHY
   Proven against Asprey Safari landscape testing, 2026-08-25.

   Purpose:
   - Preserve the established 12px mobile article prose size
     when a phone is rotated into short landscape.
   - Prevent Safari from automatically inflating that text.

   Preserves:
   - desktop typography
   - mobile portrait typography
   - article image geometry
   - DL / associated-detail hierarchy
   - captions and headings
   - Lightbox architecture
   ========================================================= */
@media (orientation:landscape) and (max-height:520px) and (max-width:1000px){

  .library-article-main,
  .library-article-main *{
    -webkit-text-size-adjust:100% !important;
    text-size-adjust:100% !important;
  }

  .library-article-main p{
    font-size:12px !important;
  }
}
