/* White-labelling: one book page, three institutions. The markup never changes; each identity
   is a set of custom properties (type, colour, wordmark, layout, interface language). */
.wl{margin-top:34px}
.wl-pick{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:22px}
.wl-pick button{font:inherit;font-size:13.5px;font-weight:600;padding:9px 16px;border:1px solid var(--fo-edge,#e2e4ea);background:#fff;color:var(--fo-ink,#111);cursor:pointer;border-radius:999px;display:inline-flex;align-items:center;gap:8px;transition:border-color .3s,background .3s,color .3s}
.wl-pick button i{width:10px;height:10px;border-radius:50%;background:var(--sw)}
.wl-pick button.on{background:#0f1119;color:#fff;border-color:#0f1119}
.wl-pick .auto{margin-left:auto;font-size:12px;color:var(--fo-muted,#6b6f7b);align-self:center}

.wl-frame{border-radius:14px;overflow:hidden;background:#1c1d24;padding:0 0 0;box-shadow:0 50px 90px -50px rgba(20,25,60,.55),0 0 0 1px rgba(20,25,60,.1)}
.wl-bar{display:flex;align-items:center;gap:6px;padding:10px 14px;background:#1c1d24}
.wl-bar i{width:10px;height:10px;border-radius:50%;background:#3a3b45}
.wl-bar span{margin-left:10px;flex:1;max-width:520px;font-size:11.5px;color:#a7a9b6;background:#2a2b34;padding:4px 12px;border-radius:6px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;transition:opacity .3s}

/* the institution's page */
.wl-site{--bg:#fff;--ink:#16171c;--muted:#6b6f7b;--acc:#8c1d2c;--acc-ink:#fff;--head:#fff;--head-ink:#16171c;--rule:#e6e2dc;--f-disp:'Source Serif 4',Georgia,serif;--f-ui:Inter,system-ui,sans-serif;--rad:0px;--wm-w:600;--wm-style:normal;--wm-track:0;
  background:var(--bg);color:var(--ink);font-family:var(--f-ui);transition:background .6s ease,color .6s ease}
.wl-site *{transition:background-color .6s ease,color .6s ease,border-color .6s ease,border-radius .6s ease}
.wl-head{display:flex;align-items:center;gap:26px;padding:16px 28px;background:var(--head);color:var(--head-ink);border-bottom:1px solid var(--rule)}
.wl-mark{width:34px;height:34px;flex:none;display:grid;place-items:center;background:var(--acc);color:var(--acc-ink);font-family:var(--f-disp);font-size:19px;border-radius:var(--rad)}
.wl-name{font-family:var(--f-disp);font-weight:var(--wm-w);font-style:var(--wm-style);letter-spacing:var(--wm-track);font-size:19px;line-height:1.1}
.wl-name small{display:block;font-family:var(--f-ui);font-style:normal;font-weight:500;font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;opacity:.6;margin-top:3px}
.wl-nav{margin-left:auto;display:flex;gap:22px;font-size:13px;font-weight:500}
.wl-nav span{opacity:.75}
.wl-search{display:flex;align-items:center;gap:8px;border:1px solid var(--rule);padding:7px 12px;font-size:12.5px;color:var(--muted);min-width:170px;border-radius:var(--rad);background:var(--bg)}
.wl-crumb{padding:12px 28px 0;font-size:11.5px;color:var(--muted);letter-spacing:.02em}
.wl-body{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:26px;padding:12px 28px 28px}
.wl-scan{position:relative;align-self:start;background:#1b1a18;border-radius:var(--rad);overflow:hidden}
.wl-scan img{display:block;width:100%;height:auto}
.wl-scan .ln{position:absolute;left:11%;top:21.8%;width:38%;height:6.8%;border:1.5px solid var(--acc);background:color-mix(in srgb,var(--acc) 16%,transparent)}
.wl-side h4{font-family:var(--f-disp);font-weight:var(--wm-w);font-size:22px;line-height:1.2;margin:4px 0 4px;letter-spacing:-.01em}
.wl-side .by{font-size:12.5px;color:var(--muted)}
.wl-tabs{display:flex;gap:4px;margin:16px 0 12px;border-bottom:1px solid var(--rule)}
.wl-tabs span{font-size:12px;font-weight:600;padding:8px 12px;color:var(--muted);border-bottom:2px solid transparent;margin-bottom:-1px}
.wl-tabs span.on{color:var(--ink);border-bottom-color:var(--acc)}
.wl-text{font-family:'Source Serif 4',Georgia,serif;font-size:14.5px;line-height:1.6}
.wl-text .o{font-style:italic;color:var(--muted);margin:0 0 8px}
.wl-text .t{margin:0}
.wl-rec{margin:16px 0 0;display:grid;grid-template-columns:auto 1fr;gap:0 14px;font-size:12px}
.wl-rec dt{color:var(--muted);padding:6px 0;border-top:1px solid var(--rule)}
.wl-rec dd{margin:0;padding:6px 0;border-top:1px solid var(--rule)}
.wl-chips{display:flex;flex-wrap:wrap;gap:5px;margin-top:12px}
.wl-chips span{font-size:11px;padding:3px 9px;background:color-mix(in srgb,var(--acc) 12%,var(--bg));color:var(--ink);border-radius:var(--rad)}
.wl-btn{display:inline-block;margin-top:16px;font-size:12.5px;font-weight:600;padding:9px 14px;background:var(--acc);color:var(--acc-ink);border-radius:var(--rad)}

/* identity 2: a city archive, Dutch interface, heavy grotesk, navy and yellow, sidebar-free, square */
.wl-site.i2{--bg:#f4f5f7;--ink:#0d1b33;--muted:#5b6679;--acc:#f2c230;--acc-ink:#0d1b33;--head:#10223d;--head-ink:#fff;--rule:#dde1e8;--f-disp:Inter,system-ui,sans-serif;--rad:0px;--wm-w:800;--wm-track:-.02em}
.wl-site.i2 .wl-mark{border-radius:50%}
/* identity 3: a foundation library, German interface, italic serif, cream and forest, soft corners */
.wl-site.i3{--bg:#f5efe3;--ink:#1f2a22;--muted:#6d6a5e;--acc:#1f4d3a;--acc-ink:#f5efe3;--head:#f5efe3;--head-ink:#1f2a22;--rule:#e2d9c6;--f-disp:'Source Serif 4',Georgia,serif;--rad:8px;--wm-w:400;--wm-style:italic}
.wl-site.i3 .wl-head{justify-content:flex-start}

.wl-note{display:grid;grid-template-columns:repeat(4,1fr);gap:0;margin-top:26px;border-top:1px solid var(--fo-edge,#e2e4ea)}
.wl-note div{padding:16px 18px 0 0;font-size:13.5px;line-height:1.55;color:var(--fo-muted,#6b6f7b)}
.wl-note b{display:block;color:var(--fo-ink,#111);font-size:14px;margin-bottom:4px}

@media (max-width:900px){
  .wl-body{grid-template-columns:1fr}
  .wl-nav,.wl-search{display:none}
  .wl-note{grid-template-columns:1fr 1fr}
}
@media (max-width:560px){ .wl-head,.wl-crumb,.wl-body{padding-left:16px;padding-right:16px} .wl-pick .auto{display:none} .wl-note{grid-template-columns:1fr} }