/* Likeness: a white cube, lit by the sun over Adelaide. One white, one ink, one grey; the works are the only colour. */
@font-face { font-family: "Hanken Grotesk"; src: url(/assets/fonts/specimen/hanken-grotesk-var.woff2) format("woff2"); font-weight: 100 900; font-style: normal; font-display: swap; }
@font-face { font-family: "Hanken Grotesk"; src: url(/assets/fonts/specimen/hanken-grotesk-var-italic.woff2) format("woff2"); font-weight: 100 900; font-style: italic; font-display: swap; }
@font-face { font-family: "Hanken Fallback"; src: local("Arial"); size-adjust: 98%; }

body.spec-likeness { background: #fff; margin: 0; }

.lk {
  --lk-wall: #fff; --lk-ink: #111; --lk-grey: #5c5c58; --lk-rule: #ececea; --lk-shade: rgb(17 17 17 / .07);
  /* the gallery wall itself: warm limewash, so raking light and shadow have something to fall on at every hour */
  --lk-plaster: #e4e0d8;
  --lk-m: 16px; --lk-gap: 16px; --lk-cols: 4; --lk-top: 0px;
  --lk-bh: var(--bar-h, 44px);
  --lk-ease: cubic-bezier(.2, 0, 0, 1);
  --lk-disp: clamp(3.5rem, 21vw, 5.5rem);
  --lk-title: clamp(1.5rem, 1.25rem + .6vw, 1.75rem);
  --lk-wt: clamp(1.0625rem, .98rem + .25vw, 1.1875rem);
  --lk-sp: clamp(48px, 3rem + 3vw, 100px);
  background: var(--lk-wall); color: var(--lk-ink);
  font: 420 .875rem/20px "Hanken Grotesk", "Hanken Fallback", "Helvetica Neue", Arial, sans-serif;
  letter-spacing: .002em; font-synthesis: none; font-kerning: normal; -webkit-font-smoothing: antialiased;
}
.lk *, .lk *::before, .lk *::after { box-sizing: border-box; }
.lk :where(h1, h2, h3, p, ol, ul, li, figure, figcaption) { margin: 0; padding: 0; font: inherit; }
.lk :where(ol, ul) { list-style: none; }
.lk :where(img) { display: block; max-width: 100%; height: auto; }
.lk ::selection { background: #111; color: #fff; }
.lk cite { font-style: italic; font-weight: 360; }
.lk a { color: inherit; text-decoration: underline 1px rgb(17 17 17 / .4); text-underline-offset: 3px; }
.lk a:hover { text-decoration-color: var(--lk-ink); }
.lk :focus-visible { outline: 2px solid var(--lk-ink); outline-offset: 4px; }
.lk-vh { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }

/* type: 11, 14, 19, 28, 80 */
.lk-micro { font-size: .6875rem; line-height: 16px; font-weight: 520; letter-spacing: .08em; text-transform: uppercase; color: var(--lk-grey); }
.lk-grey { color: var(--lk-grey); }
.lk-art { font-weight: 600; }
.lk-ln, .lk-tomb > .lk-art, .lk-no { display: block; }
.lk-no { font-size: .6875rem; line-height: 16px; font-weight: 520; letter-spacing: .02em; color: var(--lk-grey); margin-bottom: 4px; }
.lk-wt { font-size: var(--lk-wt); line-height: 1.5; font-weight: 380; letter-spacing: 0; max-width: 34ch; }
.lk-h2, .lk-view-title { font-size: var(--lk-title); line-height: 1.15; font-weight: 380; letter-spacing: -.01em; }
.lk-h2 cite, .lk-view-title cite { font-weight: 360; }
.lk-lead { max-width: 34ch; margin-top: 16px; }
.lk-h1 { font-size: var(--lk-disp); line-height: .9; font-weight: 260; letter-spacing: -.03em; }
@supports (text-box: trim-both cap alphabetic) { .lk-h1, .lk-vinyl { text-box: trim-both cap alphabetic; } }
@supports not (text-box: trim-both cap alphabetic) { .lk-h1 { margin-block: -.1em -.2em; } .lk-vinyl { margin-top: -.15em; } }

/* text buttons */
.lk-tb { font: inherit; letter-spacing: inherit; color: var(--lk-ink); background: none; border: 0; border-radius: 0; padding: 6px 0; min-height: 32px; cursor: pointer; text-decoration: underline 1px; text-underline-offset: 3px; }
.lk-tb:hover { text-decoration-color: var(--lk-ink); }
button.lk-pt { font: inherit; letter-spacing: inherit; color: inherit; background: none; border: 0; padding: 0; margin: 0; text-align: inherit; cursor: pointer; text-decoration: underline dotted 1px var(--lk-grey); text-underline-offset: 4px; }
button.lk-pt:hover, button.lk-pt:focus-visible, button.lk-pt.is-on { text-decoration: underline solid 1px var(--lk-ink); }
button.lk-pt:focus-visible { outline-offset: 2px; }

/* the grid: 4 / 8 / 12 */
.lk-grid, .lk-entrance-wrap { display: grid; grid-template-columns: repeat(var(--lk-cols), minmax(0, 1fr)); column-gap: var(--lk-gap); padding-inline: var(--lk-m); }
.lk-grid > * { grid-column: 1 / -1; }
.lk-sec { position: relative; padding-block: var(--lk-sp); scroll-margin-top: var(--lk-bh); }
.lk-sec::before { content: ""; position: absolute; top: 0; left: var(--lk-m); right: var(--lk-m); height: 1px; background: var(--lk-rule); }

/* ── the entrance (phone first) ── */
.lk-index { grid-column: 1 / -1; order: 0; min-height: 40px; display: flex; align-items: center; }
.lk-index ul { display: flex; flex-wrap: wrap; column-gap: 12px; }
.lk-index a { text-decoration-color: transparent; }
.lk-index a:hover { text-decoration-color: var(--lk-ink); }
.lk-entrance { grid-column: 1 / -1; order: 2; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); column-gap: 16px; align-content: start; padding-top: 16px; scroll-margin-top: var(--lk-bh); }
.lk-entrance > *, .lk-now > *, .lk-room-l > *, .lk-foot > * { grid-column: 1 / -1; }
.lk-now, .lk-room-l, .lk-foot { display: contents; }
.lk-now-h, .lk-hair, .lk-sunl, .lk-zoom, .lk-k-long, .lk-k-short { display: none; }
.lk-strip { grid-row: 1; grid-column: 1 / 4; display: flex; flex-wrap: wrap; column-gap: 6px; letter-spacing: .02em; }
.lk-strip span { cursor: pointer; }
.lk-strip .is-in { color: var(--lk-ink); }
.lk-strip .is-live { text-decoration: underline 1px var(--lk-ink); text-underline-offset: 3px; }
.lk-now-l { grid-row: 2; grid-column: 1 / 4; margin-top: 8px; transition: opacity 70ms linear; }
.lk-now-l.is-swap { opacity: 0; }
.lk-room-l > .lk-micro:first-child { grid-row: 1; grid-column: 4; text-align: right; }
.lk-mini { grid-row: 2; grid-column: 4; margin-top: 8px; text-align: right; letter-spacing: .02em; text-transform: none; }
.lk-h1 { grid-row: 3; margin-top: 24px; }
.lk-sub { grid-row: 4; margin-top: 24px; max-width: 34ch; }
.lk-keys { grid-row: 5; margin-top: 16px; }
.lk-ctl { grid-row: 6; display: flex; align-items: baseline; gap: 16px; margin-top: 8px; }
.lk-ctl .lk-tb { min-width: 32px; text-align: left; }
.lk-ctl .lk-zoom { font-size: 1.1875rem; }
.lk-keybtn[aria-pressed="true"] { font-weight: 600; }
.lk-ctl .lk-tb[aria-disabled="true"] { color: var(--lk-grey); cursor: default; }
.lk-l-t { display: none; }
@media (pointer: fine) { .lk-k-touch { display: none; } .lk-k-short { display: inline; } }

/* ── the wall ── */
.lk-wall { grid-column: 1 / -1; order: 1; position: relative; overflow: hidden; isolation: isolate; margin-inline: calc(-1 * var(--lk-m)); background: var(--lk-plaster); touch-action: pan-y; --lk-s: calc(100vw / 230); height: calc(200 * var(--lk-s)); }
/* the wall's focus ring sits on an overlay, above the works and the shadows that are moved across it */
.lk-wall:focus-visible { outline: none; }
.lk-wall::after { content: ""; position: absolute; inset: 8px; z-index: 5; pointer-events: none; }
.lk-wall:focus-visible::after { outline: 2px solid var(--lk-ink); }
.lk-world { position: absolute; inset: 0; transform-origin: 50% 50%; background: var(--lk-plaster); }
/* the hang: works, vinyl and shelf. At 1024 and over it stops a gutter short of the label column; the light runs on */
.lk-hang, .lk-works { position: absolute; inset: 0; }
.lk-work, .lk-vinyl, .lk-shelf, .lk-bay, .lk-lamps, .lk-lampg { position: absolute; left: 0; top: 0; }
.lk-wall .lk-crop { background: rgb(17 17 17 / .05); }
/* the sculptures were shot on a white sweep: multiplied, the sweep becomes the wall and the bronze stays bronze */
.lk-wall .lk-work[data-mode="sculpture"] .lk-crop { background: var(--lk-plaster); }
.lk-wall .lk-work[data-mode="sculpture"] .lk-crop img { mix-blend-mode: multiply; }
.lk-work { width: calc(var(--w) * var(--lk-s)); height: calc(var(--h) * var(--lk-s)); }
.lk-link { display: block; width: 100%; height: 100%; }
.lk-link:focus-visible { outline-offset: 6px; }
.lk-crop { position: relative; display: block; width: 100%; height: 100%; overflow: hidden; background: var(--lk-rule); }
.lk-crop img { position: absolute; max-width: none; width: calc(100% / var(--cw)); height: calc(100% / var(--ch)); left: calc(var(--cx) / var(--cw) * -100%); top: calc(var(--cy) / var(--ch) * -100%); transition: opacity 240ms linear; }
.lk-gl { position: absolute; inset: 0; width: 100%; height: 100%; display: block; pointer-events: none; }
.lk-vinyl { font: italic 300 calc(26 * var(--lk-s)) / 1 "Hanken Grotesk", "Hanken Fallback", Arial, sans-serif; letter-spacing: -.02em; white-space: nowrap; color: var(--lk-ink); --x: 20; --y: 404; --bx: 1034; --by: 91; }
.lk-shelf { --x: 184; --y: 350; --bx: 889; --by: 140; width: calc(105 * var(--lk-s)); height: calc(3 * var(--lk-s)); background: #fff; border-top: 1px solid var(--lk-rule); box-shadow: 0 14px 18px -14px rgb(17 17 17 / .18); z-index: 1; }
/* two light layers over the hang, both unclipped so they run the full width of the wall:
   .lk-sun multiplies (the glazing bars' shadows; after dark, the wall between and below the lamps),
   .lk-glow colour-dodges (a gain of about 1.1: the sunlit panes, and the warm hot pools of the track lamps) */
.lk-sun, .lk-glow { position: absolute; inset: 0; z-index: 3; pointer-events: none; mix-blend-mode: multiply; opacity: 0; transition: opacity 400ms linear; }
.lk-glow { mix-blend-mode: color-dodge; }
.lk-sun.is-on, .lk-glow.is-on { opacity: 1; }
.lk-bay-i, .lk-bay-p { position: absolute; left: 0; top: 0; transform-origin: 0 0; background: var(--lk-shade); }
.lk-bay-p { background: rgb(28 22 12); }
.lk-lamps, .lk-lampg { width: calc(var(--lk-lw, 460) * var(--lk-s)); height: calc(var(--lk-lh, 450) * var(--lk-s)); --lk-pool: calc(var(--lk-lp, 115) * var(--lk-s)) calc(320 * var(--lk-s)) repeat-x; }
.lk-lamps { background: radial-gradient(ellipse 50% 62% at 50% 2%, #fff 0%, #fcfaf6 26%, #f1ece5 52%, #e6e1d9 78%, #e2ddd5 100%) 0 0 / var(--lk-pool), #e2ddd5; }
.lk-lampg { background: radial-gradient(ellipse 44% 30% at 50% 9%, rgb(40 29 12) 0%, rgb(30 21 8) 34%, rgb(12 8 3) 70%, #000 100%) 0 0 / var(--lk-pool), #000; }
.lk-ring { position: absolute; z-index: 4; width: 24px; height: 24px; margin: -12px 0 0 -12px; border: 1px solid var(--lk-ink); border-radius: 50%; pointer-events: none; }

/* the works: salon (x, y), band (bx, by), true size (w × h cm), crop (cx cy cw ch); paintings inset .002 */
.lk-w01, .lk-r01 { --x: 20; --y: 40; --bx: 20; --by: 24; --w: 99; --h: 152; --cx: .0303; --cy: .0183; --cw: .9394; --ch: .9661; }
.lk-w02, .lk-r02 { --x: 239; --y: 40; --bx: 339; --by: 55; --w: 135; --h: 90; --cx: .0215; --cy: .0225; --cw: .9576; --ch: .9569; }
.lk-w03, .lk-r03 { --x: 159; --y: 40; --bx: 159; --by: 70; --w: 40; --h: 60; --cx: .0254; --cy: .1788; --cw: .2903; --ch: .6552; }
.lk-w04, .lk-r04 { --x: 159; --y: 110; --bx: 209; --by: 70; --w: 40; --h: 60; --cx: .3575; --cy: .1778; --cw: .2903; --ch: .6562; }
.lk-w05, .lk-r05 { --x: 159; --y: 180; --bx: 259; --by: 70; --w: 40; --h: 60; --cx: .6895; --cy: .1778; --cw: .2877; --ch: .6562; }
.lk-w06, .lk-r06 { --x: 249; --y: 170; --bx: 514; --by: 72; --w: 52; --h: 56; --cx: .0411; --cy: .0381; --cw: .2675; --ch: .4345; }
.lk-w07, .lk-r07 { --x: 311; --y: 170; --bx: 576; --by: 72; --w: 52; --h: 56; --cx: .3640; --cy: .0381; --cw: .2675; --ch: .4374; }
.lk-w08, .lk-r08 { --x: 373; --y: 170; --bx: 638; --by: 72; --w: 52; --h: 56; --cx: .6875; --cy: .0372; --cw: .2668; --ch: .4394; }
.lk-w09, .lk-r09 { --x: 20; --y: 300; --bx: 730; --by: 82; --w: 33; --h: 36; --cx: .0411; --cy: .5196; --cw: .2681; --ch: .4384; }
.lk-w10, .lk-r10 { --x: 63; --y: 300; --bx: 773; --by: 82; --w: 33; --h: 36; --cx: .3633; --cy: .5196; --cw: .2688; --ch: .4394; }
.lk-w11, .lk-r11 { --x: 106; --y: 300; --bx: 816; --by: 82; --w: 33; --h: 36; --cx: .6856; --cy: .5206; --cw: .2681; --ch: .4394; }
.lk-w12, .lk-r12 { --x: 189; --y: 304; --bx: 894; --by: 94; --w: 27; --h: 46; --cx: .0566; --cy: .1973; --cw: .2428; --ch: .6162; }
.lk-w13, .lk-r13 { --x: 226; --y: 316; --bx: 931; --by: 106; --w: 23; --h: 34; --cx: .3939; --cy: .2559; --cw: .2376; --ch: .5332; }
.lk-w14, .lk-r14 { --x: 259; --y: 332; --bx: 964; --by: 122; --w: 25; --h: 18; --cx: .7012; --cy: .5400; --cw: .2585; --ch: .2793; }

/* the poster: before the module, the hang at its opening camera, scrollable */
@media (scripting: enabled) {
  .lk-wall { overflow: auto; scrollbar-width: none; }
  .lk-wall::-webkit-scrollbar { display: none; }
  .lk-label { display: none; }
  .lk-work, .lk-vinyl, .lk-shelf { left: calc((var(--x) - 20) * var(--lk-s) + var(--lk-m)); top: calc((var(--y) - 40) * var(--lk-s) + var(--lk-top)); }
}
@media (scripting: enabled) and ((pointer: coarse) or (max-width: 699px)) {
  .lk-work, .lk-vinyl, .lk-shelf { left: calc((var(--bx) - 20) * var(--lk-s) + var(--lk-m)); top: calc(var(--by) * var(--lk-s)); }
}
.lk-wall.lk-live { overflow: clip; }
.lk-live .lk-work, .lk-live .lk-vinyl, .lk-live .lk-shelf { left: 0; top: 0; }
.lk-moving .lk-work { will-change: transform; }

/* the hanging key */
.lk-keyed .lk-crop img, .lk-keyed .lk-gl { opacity: 0; }
.lk-crop::after { content: attr(data-n); position: absolute; inset: 0; display: grid; place-items: center; font-size: .6875rem; line-height: 16px; font-weight: 520; letter-spacing: .02em; color: var(--lk-ink); box-shadow: inset 0 0 0 1px var(--lk-ink); opacity: 0; transition: opacity 240ms linear; }
.lk-keyed .lk-crop, .lk-wall.lk-keyed .lk-crop { background: none; }
.lk-keyed .lk-crop::after { opacity: 1; }
.lk-keyed .lk-shelf { border-top-color: var(--lk-ink); box-shadow: inset 0 0 0 1px var(--lk-ink); }

/* without WebGL: the work lifts */
.lk-nogl .lk-link { transition: transform 160ms var(--lk-ease), box-shadow 160ms var(--lk-ease); }
.lk-nogl .lk-link:hover, .lk-nogl .lk-link:focus-visible, .lk-nogl .lk-work.is-lit .lk-link { transform: translateY(-2px); box-shadow: 0 10px 24px -12px rgb(17 17 17 / .22); }

/* ── sections (phone first: everything stacks on four columns) ── */
.lk-grid > .lk-h2 + *, .lk-head-c + *, .lk-next-e + .lk-next-e { margin-top: 32px; }
.lk-statement-t .lk-micro { margin-top: 24px; }
.lk-head { row-gap: 0; }
.lk-fig { margin-top: 80px; align-items: start; }
.lk-fig-img { display: flex; flex-direction: column; align-items: flex-start; }
.lk-fig .lk-crop, .lk-view-crop { width: 100%; height: auto; aspect-ratio: var(--w) / var(--h); }
.lk-fig .lk-r12 { width: auto; height: 300px; align-self: center; }
.lk-fig-shelf { display: block; align-self: center; width: 240px; height: 16px; background: #fff; border-top: 1px solid var(--lk-rule); box-shadow: 0 14px 18px -14px rgb(17 17 17 / .18); }
.lk-fig-cap { margin-top: 24px; }
.lk-fig-cap .lk-wt { margin-top: 24px; }

.lk-rows { border-top: 1px solid var(--lk-rule); }
.lk-row { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); column-gap: 16px; padding-block: 16px; border-bottom: 1px solid var(--lk-rule); align-items: start; }
.lk-row-h { display: none; }
.lk-c-n { grid-column: 1; grid-row: 1; letter-spacing: .02em; }
.lk-c-s { grid-column: 1; grid-row: 2 / 5; margin-top: 8px; }
.lk-c-a, .lk-c-t, .lk-c-m { grid-column: 2 / 5; }
.lk-c-a { font-weight: 600; }
.lk-box { display: block; width: calc(var(--w) * .25px); height: calc(var(--h) * .25px); box-shadow: inset 0 0 0 1px var(--lk-ink); }
.lk-row-sc .lk-c-s { position: relative; padding-bottom: 1px; }
.lk-row-sc .lk-box { position: relative; }
.lk-row-sc .lk-box::after { content: ""; position: absolute; left: -4px; right: -4px; bottom: -2px; height: 1px; background: var(--lk-ink); }

.lk-draw { margin-top: 32px; }
.lk-sec-svg, .lk-day-svg { display: block; width: 100%; height: auto; overflow: visible; }
.lk-sec-svg :is(line, polyline), .lk-day-svg line { fill: none; stroke: var(--lk-ink); stroke-width: 1; vector-effect: non-scaling-stroke; }
.lk-sv-glass line { stroke: var(--lk-grey); stroke-dasharray: 2 2; }
.lk-sv-band { fill: var(--lk-rule); }
.lk-sv-lamps { display: none; }
.lk-noray :is(.lk-sv-ray, .lk-sv-band, .lk-sv-now) { display: none; }
.lk-night .lk-sv-lamps { display: inline; }
.lk-sv-t { font: 520 11px/1 "Hanken Grotesk", "Hanken Fallback", Arial, sans-serif; letter-spacing: .08em; text-transform: uppercase; fill: var(--lk-ink); }
.lk-sv-g { fill: var(--lk-grey); }
.lk-day-svg { margin-top: 40px; }
.lk-day-svg .lk-dv-h { stroke: var(--lk-rule); }
.lk-day-svg .lk-dv-tick { stroke: var(--lk-grey); }
.lk-dv-ink, .lk-dv-rest { fill: none; stroke-width: 1; vector-effect: non-scaling-stroke; }
.lk-dv-ink { stroke: var(--lk-ink); }
.lk-dv-rest { stroke: var(--lk-grey); stroke-dasharray: 1 3; }
.lk-dv-dot { fill: var(--lk-ink); }
.lk-cap { margin-top: 8px; }
.lk-nowline { margin-bottom: 8px; }
.lk-nowline:empty { display: none; }
.lk-note { border-top: 1px solid var(--lk-rule); padding-top: 16px; margin-top: 32px; }
.lk-note .lk-wt { margin-top: 8px; }

.lk-alist { display: grid; row-gap: 32px; }
.lk-artist { border-top: 1px solid var(--lk-rule); padding-top: 16px; }
.lk-bio, .lk-on { margin-top: 16px; max-width: 34ch; }

.lk-room-fig img { width: 100%; }
.lk-cap-t { margin-top: 16px; max-width: 34ch; }
.lk-rlist { margin-top: 16px; counter-reset: lk-r; border-bottom: 1px solid var(--lk-rule); }
.lk-rlist li { counter-increment: lk-r; display: grid; grid-template-columns: 32px 1fr; padding-block: 12px; border-top: 1px solid var(--lk-rule); }
.lk-rlist li::before { content: counter(lk-r); color: var(--lk-grey); font-size: .6875rem; font-weight: 520; letter-spacing: .02em; }
.lk-rbtn { margin-top: 16px; }
.lk-rules { margin-top: 40px; }

.lk-next-e p { margin-top: 8px; max-width: 34ch; }
.lk-opennow { margin-top: 16px; }
.lk-opennow:empty { display: none; }
.lk-week { margin-top: 32px; border-bottom: 1px solid var(--lk-rule); }
.lk-week li { display: flex; justify-content: space-between; gap: 16px; padding-block: 6px; border-top: 1px solid var(--lk-rule); }
.lk-week .is-today { font-weight: 600; border-top-color: var(--lk-ink); }
.lk-access { margin-top: 32px; }
.lk-lines { margin-top: 8px; }

.lk-form { display: grid; row-gap: 24px; max-width: 34rem; }
.lk-field { display: flex; flex-direction: column; gap: 4px; }
.lk-form :is(input, select, textarea) { font: 400 1rem/24px "Hanken Grotesk", "Hanken Fallback", Arial, sans-serif; color: var(--lk-ink); background-color: transparent; border: 0; border-bottom: 1px solid var(--lk-ink); border-radius: 0; height: 40px; padding: 8px 0 7px; width: 100%; -webkit-appearance: none; appearance: none; }
.lk-form textarea { height: auto; min-height: 128px; resize: vertical; }
.lk-form select { padding-right: 24px; cursor: pointer; background-image: linear-gradient(45deg, transparent 50%, var(--lk-ink) 50%, var(--lk-ink) calc(50% + 1px), transparent calc(50% + 1px)), linear-gradient(-45deg, transparent 50%, var(--lk-ink) 50%, var(--lk-ink) calc(50% + 1px), transparent calc(50% + 1px)); background-size: 6px 6px; background-position: calc(100% - 6px) 50%, 100% 50%; background-repeat: no-repeat; }
.lk-sendbtn { min-height: 44px; }
.lk-status { min-height: 20px; }
.lk-ask-note { margin-top: 32px; max-width: 34ch; }

.lk-colo-r > * + * { margin-top: 16px; }
.lk-colo-r { max-width: 46ch; }
.lk-hw { font-weight: 420; }
.lk-backp { margin-top: 24px !important; }

/* ── the reading view ── */
.lk-view { position: fixed; inset: var(--lk-bh) 0 0 0; z-index: 800; background: var(--lk-wall); overflow-y: auto; overscroll-behavior: contain; display: grid; grid-template-columns: repeat(var(--lk-cols), minmax(0, 1fr)); column-gap: var(--lk-gap); align-content: start; padding: 0 var(--lk-m) 48px; }
.lk-view[hidden] { display: none; }
.lk-view > * { grid-column: 1 / -1; }
.lk-view-top { height: 48px; display: flex; align-items: center; }
.lk-view-crop { width: var(--vw, 100%); height: var(--vh, auto); }
.lk-view-l { margin-top: 24px; }
.lk-view-l .lk-art { margin-top: 4px; }
.lk-view-title { margin-top: 4px; }
.lk-view-title:focus { outline: none; }
.lk-view-meta, .lk-view-ask { margin-top: 8px; }
.lk-view-text { margin-top: 24px; }
.lk-view-nav { display: flex; gap: 24px; margin-top: 24px; }
@supports (view-transition-name: a) {
  ::view-transition-group(lk-work) { animation-duration: 420ms; animation-timing-function: cubic-bezier(.2, 0, 0, 1); }
  ::view-transition-old(root), ::view-transition-new(root) { animation-duration: 180ms; }
}

/* the day's sun draws itself as North light comes into view */
@media (prefers-reduced-motion: no-preference) {
  @supports (animation-timeline: view()) {
    .lk-day-svg { view-timeline: --lk-day block; }
    .lk-dv-ink { stroke-dasharray: 1 1; animation: lk-draw linear both; animation-timeline: --lk-day; animation-range: entry 10% cover 40%; }
    @keyframes lk-draw { from { stroke-dashoffset: 1; } to { stroke-dashoffset: 0; } }
  }
}

/* ── tablet: eight columns ── */
@media (min-width: 700px) {
  .lk { --lk-m: 32px; --lk-gap: 24px; --lk-cols: 8; --lk-top: 24px; }
  .lk-index { min-height: 56px; }
  .lk-index ul { column-gap: 16px; }
  .lk-entrance { grid-template-columns: repeat(8, minmax(0, 1fr)); column-gap: 24px; padding-top: 24px; }
  .lk-strip, .lk-now-l { grid-column: 1 / 6; }
  .lk-room-l > .lk-micro:first-child { grid-column: 6 / 9; text-align: left; }
  .lk-sunl { display: block; grid-row: 2; grid-column: 6 / 9; margin-top: 8px; }
  .lk-mini { display: none; }
  .lk { --lk-disp: 8rem; }
  .lk-h1 { grid-column: 1 / 7; margin-top: 48px; }
  .lk-sub, .lk-keys, .lk-ctl { grid-column: 1 / 7; }
  /* 01 fills the wall's height, 24 px from the top and 40 from the foot */
  .lk-wall { --lk-s: max(calc(100vw / 315), calc((clamp(420px, 56svh, 600px) - 64px) / 152)); height: clamp(420px, 56svh, 600px); }
  .lk-statement-t, .lk-head-c, .lk-head > *, .lk-notes, .lk-rules, .lk-form, .lk-ask-note { grid-column: 1 / 7; }
  /* Walking past: each label beside its work */
  .lk-fig { margin-top: 56px; }
  .lk-fig-img { grid-column: 1 / 5; grid-row: 1; }
  #lk-past-01 .lk-fig-img, #lk-past-12 .lk-fig-img { grid-column: 2 / 5; }
  .lk-fig-cap { grid-column: 5 / 9; grid-row: 1; margin-top: 0; }
  .lk-fig .lk-r12 { height: 240px; }
  .lk-fig-shelf { width: 100%; align-self: stretch; }
  .lk-alist { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 24px; }
  .lk-next-e { grid-column: 1 / 5; }
  .lk-next-e + .lk-next-e { grid-column: 5 / 9; grid-row: 2; }
  .lk-visit-a { grid-column: 1 / 5; }
  .lk-week { grid-column: 5 / 9; grid-row: 2; margin-top: 32px; }
  .lk-access { grid-column: 1 / 5; }
  .lk-colo-l { grid-column: 1 / 5; }
  .lk-colo-r { grid-column: 5 / 9; grid-row: 2; margin-top: 32px; }
  .lk-row { grid-template-columns: repeat(8, minmax(0, 1fr)); column-gap: 24px; min-height: 56px; padding-block: 12px; }
  .lk-row-h { display: grid; min-height: 0; padding-block: 0 8px; border: 0; }
  .lk-c-n, .lk-c-a, .lk-c-t, .lk-c-m, .lk-c-s { grid-row: 1; margin: 0; }
  .lk-c-a { grid-column: 2 / 4; } .lk-c-t { grid-column: 4 / 6; } .lk-c-m { grid-column: 6 / 8; }
  .lk-c-s { grid-column: 8; align-self: end; }
  .lk-view-fig { max-width: 100%; }
}
@media (min-width: 700px) and (pointer: fine) { .lk-zoom { display: inline-block; } }
@media (min-width: 700px) and (max-width: 1023px) and (pointer: coarse) { .lk-wall { --lk-s: calc(100vw / 300); height: calc(200 * var(--lk-s)); } }
@media (max-width: 699px) {
  .lk-fig { margin-top: 56px; }
  .lk-fig .lk-r01 { width: 75%; }
  .lk-fig .lk-r12 { height: 240px; }
  .lk-fig-cap { margin-top: 16px; }
  .lk-fig-cap .lk-wt { margin-top: 16px; }
}
@media (max-width: 699px) {
  .lk-sv-t { font-size: 17px; }
  .lk-view-crop { max-height: 58svh; width: auto; max-width: 100%; }
  .lk-room-l > .lk-micro:first-child { white-space: nowrap; justify-self: end; }
}

/* ── desktop: twelve columns ── */
@media (min-width: 1024px) {
  /* the name fills the four-column label column: "Likeness" is 3.46 em wide at -0.03em */
  .lk { --lk-m: 48px; --lk-cols: 12; --lk-top: 96px; --lk-disp: min(calc((100vw - 144px) / 10.5), 9rem); }
  .lk-entrance-wrap { height: min(calc(100svh - var(--lk-bh)), 1100px); min-height: 640px; grid-template-rows: minmax(0, 1fr); }
  /* the label column stands on the wall, like wall text: a darker grey keeps 4.5:1 on the plaster at every hour */
  .lk-index, .lk-entrance { --lk-grey: #474641; }
  .lk-index { grid-area: 1 / 9 / 2 / 13; align-self: start; align-items: flex-start; min-height: 0; padding-top: 24px; position: relative; z-index: 1; }
  .lk-index ul { column-gap: 16px; row-gap: 0; }
  .lk-entrance { grid-area: 1 / 9 / 2 / 13; position: relative; z-index: 1; display: flex; flex-direction: column; padding: 96px 0 24px; min-height: 0; }
  .lk-now, .lk-room-l, .lk-foot, .lk-now-h, .lk-sunl { display: block; }
  .lk-hair { display: block; border: 0; height: 1px; background: var(--lk-rule); margin: 32px 0 0; }
  .lk-h1 { margin: 0; font-weight: 300; }
  /* the introduction reads like a gallery's intro panel: larger than the object labels beneath it */
  .lk-sub { font-size: var(--lk-wt); line-height: 1.45; font-weight: 380; max-width: 30ch; margin-top: 28px; }
  .lk-now { margin-top: 24px; }
  .lk-room-l { margin-top: 32px; }
  .lk-mini { display: none; }
  .lk-foot { margin-top: auto; padding-top: 24px; }
  .lk-strip { column-gap: 6px; }
  /* the wall fills the first screen edge to edge; the works hang at a scale where 01 fills its height
     (96 px from the top, on the h1's cap line, and 64 px from the foot) */
  .lk-wall { grid-area: 1 / 1 / 2 / 13; margin-inline: calc(-1 * var(--lk-m)); height: auto; --lk-s: max(calc((66.6667vw - 24px) / 315), calc((clamp(640px, 100svh - var(--lk-bh), 1100px) - 160px) / 152)); }
  .lk-hang { clip-path: inset(0 calc(33.3333% + 24px) 0 0); }
  .lk-k-touch, .lk-k-short { display: none; }
  .lk-k-long { display: inline; }

  .lk-grid > .lk-h2, .lk-head-c, .lk-head > * { grid-column: 1 / 4; grid-row: 1; }
  .lk-head > .lk-lead { grid-row: 2; }
  .lk-grid > .lk-h2 + *, .lk-head-c + * { margin-top: 0; }
  .lk-statement-t { grid-column: 4 / 8; grid-row: 1; }
  /* Walking past: the heading in cols 1-2 beside the first work; every work ends on col 5's edge and its
     label starts on col 6, one gutter away */
  .lk-past .lk-head { position: absolute; z-index: 1; top: var(--lk-sp); left: var(--lk-m); width: calc((100% - 360px) / 6 + 24px); display: block; padding: 0; }
  .lk-fig { min-height: 0; margin-top: 64px; align-items: start; }
  .lk-head + .lk-fig { margin-top: 0; }
  .lk-fig-img, #lk-past-01 .lk-fig-img, #lk-past-12 .lk-fig-img { grid-column: 3 / 6; grid-row: 1; }
  #lk-past-02 .lk-fig-img { grid-column: 1 / 6; }
  .lk-fig-cap { grid-column: 6 / 10; grid-row: 1; margin-top: 0; }
  .lk-fig .lk-r01, .lk-fig .lk-r02 { width: 100%; height: auto; }
  .lk-fig .lk-r12 { height: 280px; align-self: center; }
  .lk-fig-shelf { width: 100%; height: 16px; align-self: stretch; }
  .lk-sheet-t { grid-column: 4 / 13; grid-row: 1; }
  .lk-row { grid-template-columns: repeat(9, minmax(0, 1fr)); }
  .lk-c-a { grid-column: 2 / 4; } .lk-c-t { grid-column: 4 / 7; } .lk-c-m { grid-column: 7 / 9; } .lk-c-s { grid-column: 9; }
  .lk-light .lk-head-c .lk-wt { margin-top: 16px; }
  .lk-draw { grid-column: 4 / 9; grid-row: 1; margin-top: 0; }
  .lk-notes { grid-column: 10 / 13; grid-row: 1; }
  .lk-note:first-of-type { margin-top: 24px; }
  .lk-alist { grid-column: 4 / 13; grid-row: 1; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 48px 24px; }
  .lk-room-fig { grid-column: 2 / 9; grid-row: 2; margin-top: 48px !important; }
  .lk-rules { grid-column: 10 / 13; grid-row: 2; margin-top: 48px; }
  .lk-rules .lk-rlist { margin-top: 16px; }
  .lk-next-e { grid-column: 4 / 7; grid-row: 1; margin-top: 0 !important; }
  .lk-next-e + .lk-next-e { grid-column: 7 / 10; grid-row: 1; }
  .lk-visit-a { grid-column: 4 / 7; grid-row: 1; }
  .lk-week { grid-column: 7 / 10; grid-row: 1; margin-top: 0; }
  .lk-access { grid-column: 10 / 13; grid-row: 1; margin-top: 0; }
  .lk-form { grid-column: 4 / 9; grid-row: 1; max-width: none; }
  .lk-ask-note { grid-column: 10 / 13; grid-row: 1; margin-top: 0; }
  .lk-colo-l { grid-column: 4 / 7; grid-row: 1; }
  .lk-colo-r { grid-column: 7 / 13; grid-row: 1; margin-top: 0; }
  .lk-view { padding-block: 48px; }
  .lk-view-top { position: absolute; top: 8px; right: var(--lk-m); height: auto; grid-column: auto; grid-row: auto; }
  .lk-view-fig { grid-column: 1 / 8; grid-row: 1; }
  .lk-view-l { grid-column: 9 / 13; grid-row: 1; margin-top: 0; }
}
@media (min-width: 1024px) and (max-height: 799px) {
  .lk-sub { font-size: .875rem; line-height: 20px; font-weight: 420; max-width: 34ch; margin-top: 24px; }
  .lk-l-t { display: inline; }
  .lk-l-x { display: none; }
  .lk-k-long { display: none; }
  .lk-k-short { display: inline; }
}

/* ── without JavaScript: a Swiss grid of the fourteen works and their labels ── */
@media (scripting: none) {
  .lk-entrance-wrap { height: auto; min-height: 0; }
  .lk-wall { grid-column: 1 / -1; order: 3; margin: 48px 0 0; height: auto; overflow: visible; }
  .lk-wall, .lk-world { background: none; }
  .lk-world, .lk-hang, .lk-works, .lk-work { position: static; clip-path: none; }
  .lk-wall .lk-crop, .lk-wall .lk-work[data-mode="sculpture"] .lk-crop { background: none; }
  .lk-works { display: grid; grid-template-columns: repeat(var(--lk-nj, 1), minmax(0, 1fr)); gap: 48px var(--lk-gap); align-items: start; }
  .lk-work { width: auto; height: auto; }
  .lk-crop { height: auto; aspect-ratio: var(--w) / var(--h); }
  .lk-label { margin-top: 16px; }
  .lk-label .lk-text { margin-top: 16px; max-width: 34ch; }
  .lk-vinyl, .lk-shelf, .lk-sun, .lk-now, .lk-strip, .lk-ctl, .lk-keys, .lk-hair, .lk-nowline, .lk-sv-ray, .lk-sv-band, .lk-sv-now, .lk-day-svg, .lk-day-svg + .lk-cap, .lk-keyshow { display: none !important; }
}
@media (scripting: none) and (min-width: 700px) { .lk { --lk-nj: 2; } }
@media (scripting: none) and (min-width: 1024px) {
  .lk { --lk-nj: 4; }
  .lk-index { grid-area: auto; grid-column: 1 / -1; }
  .lk-index ul { display: flex; }
  .lk-entrance { grid-area: auto; grid-column: 1 / 5; padding-top: 48px; }
  .lk-wall { grid-area: auto; grid-column: 1 / -1; margin: 80px 0 0; }
  .lk-foot { display: none; }
}

/* reduced motion: everything in its final state, and nothing travels */
@media (prefers-reduced-motion: reduce) {
  .lk *, .lk *::before, .lk *::after { transition: none !important; animation: none !important; scroll-behavior: auto !important; }
}