/* Dense evidence compositions; all covers retain the approved RIB binding and controls. */
.journal-composition { position: absolute; z-index: 2; inset: 12% 5.2% 14%; color: #bfb6a2; font: 2.2cqw/1.4 "Courier New",monospace; }
.rib-dossier .j-title { position: absolute; z-index: 5; left: 0; top: 2%; width: 94%; max-width: none; margin: 0; font: 400 7.9cqw/.96 Georgia,serif; color: #ded4bd; letter-spacing: -.16cqw; }
.j-intro { position: absolute; z-index: 5; left: 0; top: 23%; width: 93%; margin: 0; color: #b0a794; font: 3cqw/1.25 Georgia,serif; }
.j-ledger { position: absolute; z-index: 3; margin: 0; padding: 2.4cqw; background: linear-gradient(110deg,#191c17e8,#0d110eeb),var(--rib-grain); border: 1px solid #74715d55; box-shadow: 1px 3px 6px #0009; }
.j-ledger > div { padding: 2cqw 0; border-bottom: 1px solid #77705c45; }
.j-ledger > div:first-child { padding-top: 0; }
.j-ledger > div:last-child { border-bottom: 0; padding-bottom: 0; }
.j-ledger dt { font-size: 1.7cqw; color: #918878; text-transform: uppercase; }
.j-ledger dd { margin: 1.1cqw 0 0; font-size: 2.1cqw; color: #baabbf; overflow-wrap: anywhere; }
.j-ledger > div:nth-child(2) dd { color: #bdb29d; }
.j-ledger > div:nth-child(3) dd { color: #ad9b76; }
.j-plate { position: absolute; margin: 0; border: 1px solid #8f86706e; background: #10120f; box-shadow: 1px 5px 9px #000b; overflow: hidden; }
.j-specimen { position: absolute; inset: 0; overflow: hidden; background: #0b0d0b; }
.j-specimen::before { content: ""; position: absolute; height: 100%; aspect-ratio: 1; top: 0; left: 50%; transform: translateX(-50%) scale(var(--detail,1)); background: url('./public/jOURNALS/specimen-atlas.png') var(--tile-x) var(--tile-y) / 400% 300% no-repeat; filter: saturate(.45) brightness(.84); }
.j-plate::after { content: ""; position: absolute; inset: 0; pointer-events: none; background: repeating-linear-gradient(0deg,transparent 0 24px,#ada88a13 24px 25px),repeating-linear-gradient(90deg,transparent 0 24px,#ada88a13 24px 25px),var(--rib-grain); opacity: .38; }
.j-plate figcaption { position: absolute; z-index: 2; left: 4%; bottom: 3%; right: 4%; color: #b5ad97; font-size: 1.45cqw; letter-spacing: .02em; text-transform: uppercase; text-shadow: 0 1px 2px #000; background: #0b0e0b99; padding: .7cqw; }
.j-register { position: absolute; z-index: 2; inset: 6%; background: linear-gradient(#d1c7aa88,#d1c7aa88) left top 6px / 13px 1px no-repeat,linear-gradient(#d1c7aa88,#d1c7aa88) left 6px top / 1px 13px no-repeat,linear-gradient(#d1c7aa88,#d1c7aa88) right bottom 6px / 13px 1px no-repeat,linear-gradient(#d1c7aa88,#d1c7aa88) right 6px bottom / 1px 13px no-repeat; }
.j-backing { position: absolute; z-index: 0; border: 1px solid #82776050; background: var(--rib-grain),repeating-linear-gradient(0deg,transparent 0 17px,#a5987220 18px 19px),#25261e; box-shadow: 2px 3px 4px #0008; }
.j-backing span { position: absolute; left: 5%; bottom: 3%; font-size: 1.5cqw; color: #aaa086; }
.j-details { position: absolute; z-index: 4; display: grid; gap: 1.2cqw; }
.j-details .j-plate { position: relative; min-height: 0; width: 100%; height: 100%; }
.j-details figcaption { font-size: 1.2cqw; white-space: nowrap; }
.j-trace { position: absolute; z-index: 5; padding: 1.7cqw 2cqw; background: var(--rib-grain),#151a13ed; border: 1px solid #625e4c66; box-shadow: 1px 3px 5px #0008; }
.j-trace span { color: #9c9282; font-size: 1.5cqw; }
.j-trace p { font: 2.15cqw/1.2 Georgia,serif; margin: .8cqw 0; color: #beb19b; }
.j-trace small { font-size: 1.3cqw; color: #8c8373; }
.j-film { position: absolute; z-index: 4; pointer-events: none; border: 1px solid #a39d8e40; background: linear-gradient(110deg,#b6b1a918,transparent 42%,#b6b1a90c); box-shadow: inset 2px 0 1px #e0d8c30a,2px 4px 4px #0005; }
.j-film i { position: absolute; width: 2cqw; height: 2cqw; border-radius: 50%; right: 2%; background: radial-gradient(circle,#12170f 22%,#a4a899 35%,#42483b 48%,#10150e 65%); box-shadow: 0 1px 2px #000; }
.j-film i:first-child { top: 2%; }.j-film i:nth-child(2) { bottom: 2%; }
.j-film span { position: absolute; bottom: 4%; left: 5%; font-size: 1.25cqw; color: #a7a18d; }

/* Field record: metadata, a large object, and three tightly stacked close-ups. */
.j-layout-forensic .j-title { width: 90%; }
.j-layout-forensic .j-intro { top: 23%; }
.j-layout-forensic .j-ledger { top: 43%; left: 0; width: 30%; height: 57%; }
.j-layout-forensic .j-main { z-index: 2; top: 43%; left: 31%; width: 47%; height: 57%; }
.j-layout-forensic .j-details { left: 80%; top: 43%; width: 20%; height: 57%; grid-template-rows: repeat(3,1fr); }
.j-layout-forensic .j-backing { top: 41%; left: 32%; width: 47%; height: 56%; transform: none; }
.j-layout-forensic .j-trace { top: 31%; right: 0; width: 34%; display: none; }
.j-layout-forensic .j-film { top: 46%; left: 30%; width: 48%; height: 52%; }

/* Specimen study: tall evidence on the left, title and ledger to the right. */
.j-layout-specimen .j-title { top: 3%; left: 55%; width: 45%; font-size: 6.4cqw; }
.j-layout-specimen .j-intro { top: 29%; left: 55%; width: 45%; font-size: 2.55cqw; line-height: 1.3; }
.j-layout-specimen .j-main { z-index: 2; top: 4%; left: 0; width: 51%; height: 80%; }
.j-layout-specimen .j-backing { top: 1%; left: 2%; width: 49%; height: 84%; transform: none; }
.j-layout-specimen .j-ledger { top: 56%; left: 55%; width: 45%; height: 44%; padding: 2.2cqw; }
.j-layout-specimen .j-ledger > div { padding: 1.1cqw 0; }
.j-layout-specimen .j-ledger dd { margin-top: .55cqw; font-size: 2cqw; }
.j-layout-specimen .j-details { top: 70%; left: 3%; width: 48%; height: 19%; grid-template-columns: 1fr 1fr; }
.j-layout-specimen .j-detail-c { display: none; }
.j-layout-specimen .j-trace { top: 88%; left: 0; width: 51%; height: 12%; padding: 1cqw 1.8cqw; }
.j-layout-specimen .j-trace p { font-size: 1.7cqw; margin: .3cqw 0; }
.j-layout-specimen .j-trace small { display: none; }
.j-layout-specimen .j-film { top: 8%; left: 1%; width: 50%; height: 72%; }

/* Layered research: offset plates, a document backer, and a side ledger. */
.j-layout-layered .j-title { top: 3%; left: 54%; width: 46%; font-size: 6.8cqw; }
.j-layout-layered .j-intro { top: 26%; left: 54%; width: 46%; font-size: 2.55cqw; line-height: 1.32; }
.j-layout-layered .j-main { z-index: 2; top: 16%; left: 0; width: 50%; height: 75%; }
.j-layout-layered .j-backing { top: 3%; left: 4%; width: 46%; height: 95%; transform: none; border: 2px solid #8a80604d; }
.j-layout-layered .j-ledger { top: 54%; left: 54%; width: 46%; height: 46%; }
.j-layout-layered .j-ledger > div { padding: 1.1cqw 0; }
.j-layout-layered .j-ledger dd { margin-top: .7cqw; font-size: 2cqw; }
.j-layout-layered .j-details { top: 73%; left: 22%; width: 30%; height: 25%; grid-template-columns: 1fr; }
.j-layout-layered .j-detail-b,.j-layout-layered .j-detail-c { display: none; }
.j-layout-layered .j-trace { top: 5%; left: 0; width: 45%; height: 16%; padding: 1.5cqw; }
.j-layout-layered .j-trace p { font-size: 1.9cqw; }
.j-layout-layered .j-trace small { display: none; }
.j-layout-layered .j-film { top: 10%; left: 5%; width: 47%; height: 85%; }

/* Cluster archive: broad evidence collage with a full-width data rail below. */
.j-layout-panorama .j-title { top: 0; width: 100%; font-size: 7.3cqw; }
.j-layout-panorama .j-intro { top: 19%; width: 96%; font-size: 2.8cqw; }
.j-layout-panorama .j-main { z-index: 2; top: 34%; left: 0; width: 70%; height: 48%; }
.j-layout-panorama .j-main .j-specimen::before { width: 100%; height: auto; top: 50%; transform: translate(-50%,-50%) scale(var(--detail,1)); }
.j-layout-panorama .j-backing { top: 31%; left: 3%; width: 66%; height: 52%; transform: none; }
.j-layout-panorama .j-details { left: 72%; top: 35%; width: 28%; height: 35%; grid-template-rows: 1fr 1fr; }
.j-layout-panorama .j-detail-c { display: none; }
.j-layout-panorama .j-trace { top: 71%; left: 73%; width: 27%; height: 11%; padding: 1cqw; background: transparent; border: 0; box-shadow: none; }
.j-layout-panorama .j-trace p { font-size: 1.8cqw; }
.j-layout-panorama .j-trace small { display: none; }
.j-layout-panorama .j-ledger { left: 0; top: 85%; width: 100%; height: 15%; padding: 1.5cqw 2cqw; display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; gap: 2cqw; }
.j-layout-panorama .j-ledger > div { border-bottom: 0; border-right: 1px solid #756c5555; padding: 0 1cqw 0 0; }
.j-layout-panorama .j-ledger > div:last-child { border: 0; }
.j-layout-panorama .j-ledger dt { font-size: 1.4cqw; }
.j-layout-panorama .j-ledger dd { font-size: 1.75cqw; }
.j-layout-panorama .j-film { top: 37%; left: 3%; width: 65%; height: 42%; }

/* Each work varies its framing, scale and plate arrangement within these families. */
.journal-1 .j-title { font-size: 5.8cqw; }
.journal-1 .j-main { top: 8%; height: 75%; }
.journal-1 .j-main .j-specimen::before { --detail: 1.12; }
.journal-2 .j-main { transform: none; }
.journal-3 .j-main .j-specimen::before { --detail: .92; }
.journal-4 .j-title,.journal-11 .j-title { font-size: 11cqw; }
.journal-4 .j-intro,.journal-11 .j-intro { top: 19%; width: 97%; }
.journal-4 .j-main { width: 48%; left: 30%; }
.journal-5 .j-main { left: 33%; width: 45%; }
.journal-5 .j-main .j-specimen::before { --detail: 1.05; }
.journal-6 .j-title { font-size: 8.4cqw; }
.journal-6 .j-intro { top: 13%; }
.journal-6 .j-main { top: 28%; height: 54%; width: 66%; }
.journal-6 .j-details { left: 69%; width: 31%; top: 28%; height: 43%; }
.journal-6 .j-backing { top: 26%; }
.journal-6 .j-film { top: 30%; left: 2%; width: 63%; height: 49%; }
.journal-7 .j-main { left: 29%; width: 50%; transform: none; }
.journal-7 .j-ledger { width: 29%; }
.journal-8 .j-title { font-size: 6.3cqw; }
.journal-8 .j-main { top: 12%; height: 81%; }
.journal-8 .j-trace { top: 2%; }
.journal-10 .j-title { font-size: 5.8cqw; }
.journal-10 .j-main { top: 2%; height: 83%; }
.journal-11 .j-main { left: 33%; width: 44%; }
.journal-11 .j-details { left: 79%; width: 21%; }
.journal-12 .j-title { font-size: 7.6cqw; }
.journal-12 .j-main { top: 21%; height: 69%; transform: none; }
.journal-12 .j-backing { transform: none; }
.journal-13 .j-title { font-size: 6.5cqw; }
.journal-13 .j-intro { top: 18%; }

/* Readability pass: the same Georgia heading / Courier body profile as Reality Is Broken. */
.rib-dossier .j-title { font-family: Georgia, "Times New Roman", serif; font-weight: 400; line-height: .96; color: #ded5c2; text-shadow: 0 1px 1px #000; }
.journal-composition .j-intro { font: 2.6cqw/1.4 "Courier New", monospace; color: #c5bdaa; letter-spacing: -.025cqw; }
.journal-composition .j-ledger { padding: 2cqw; }
.journal-composition .j-ledger > div { padding-block: 1cqw; }
.journal-composition .j-ledger dt { font-size: 2.2cqw; line-height: 1.2; color: #b6ac99; }
.journal-composition .j-ledger dd { font-size: 2.8cqw; line-height: 1.22; margin-top: .8cqw; color: #d0c1d3; }
.journal-composition .j-ledger > div:nth-child(2) dd { color: #d0c5b0; }
.journal-composition .j-ledger > div:nth-child(3) dd { color: #c5b58e; }
.journal-composition .j-plate figcaption { font-size: 2.1cqw; line-height: 1.2; color: #d3cab6; background: #090c09db; }
.journal-composition .j-details figcaption { white-space: normal; font-size: 2.1cqw; }
.journal-composition .j-backing span, .journal-composition .j-film span { font-size: 2.1cqw; color: #c1b79f; }
.journal-composition .j-trace span { font-size: 2.1cqw; color: #bdb29e; }
.journal-composition .j-trace p { font: 2.3cqw/1.3 "Courier New", monospace; color: #c5bdaa; }
.journal-composition .j-trace small { font-size: 2.1cqw; }
.j-layout-forensic .j-ledger { width: 36%; }
.j-layout-forensic .j-main { left: 37%; width: 41%; }
.j-layout-forensic .j-film { left: 36%; width: 42%; }
.j-layout-specimen .j-ledger, .j-layout-layered .j-ledger { top: 51%; height: 49%; }
.j-layout-specimen .j-intro { top: 27%; }
.j-layout-layered .j-intro { top: 24%; }
.j-layout-specimen .j-details { top: 62%; height: 18%; }
.j-layout-specimen .j-main { height: 74%; }
.j-layout-specimen .j-trace { top: 81%; height: 19%; }
.j-layout-layered .j-trace { top: 1%; height: 23%; }
.j-layout-layered .j-main { top: 23%; height: 69%; }
.j-layout-panorama .j-ledger { top: 73%; height: 27%; grid-template-columns: 1fr 1fr; gap: 1.5cqw 3cqw; }
.j-layout-panorama .j-ledger > div { padding: 0; }
.j-layout-panorama .j-ledger > div:nth-child(2) { border-right: 0; }
.j-layout-panorama .j-ledger dd { font-size: 2.6cqw; }
.j-layout-panorama .j-main { top: 34%; height: 37%; }
.j-layout-panorama .j-film { top: 36%; height: 33%; }
.j-layout-panorama .j-backing { height: 40%; }
.j-layout-panorama .j-details { top: 34%; height: 37%; }
.j-layout-panorama .j-trace { display: none; }
.journal-6 .j-main { top: 28%; height: 43%; }
.journal-6 .j-details { top: 28%; height: 43%; }
.journal-6 .j-film { top: 30%; height: 39%; }

/* Keep enlarged captions clear of overlapping detail plates. */
.j-layout-specimen .j-main figcaption, .j-layout-layered .j-main figcaption { top: 2%; bottom: auto; }
.j-film span { display: none; }

/* Straight backing sheets and a fuller Emotional Engine Project record. */
.journal-composition .j-backing { transform: none; }
.rib-dossier .journal-11 .j-title { font-size: 7.7cqw; width: 100%; }
.journal-11 .j-intro { top: 23%; width: 100%; }
.journal-11 .j-ledger { top: 47%; height: 53%; width: 40%; }
.journal-composition.journal-11 .j-ledger > div { padding-block: .6cqw; }
.journal-composition.journal-11 .j-ledger dd { font-size: 2.65cqw; margin-top: .5cqw; }
.journal-11 .j-main { top: 47%; height: 53%; left: 41%; width: 37%; }
.journal-11 .j-details { top: 47%; height: 53%; }
.journal-11 .j-backing { top: 45%; left: 40%; width: 39%; height: 54%; }
.journal-11 .j-film { top: 49%; left: 40%; width: 38%; height: 49%; }