/* drawing-style.css: specimens on the style sheet (drawing-style.html). Specimen SVGs use paper
   millimetres as user units, so 1:1 specimens are drawn at their printed size and the 4:1 ones
   are the same geometry scaled by four. */
.spec { display: block; overflow: visible; max-width: 100%; height: auto; }
.spec :is(path, line, circle, rect, polyline, polygon, ellipse) { fill: none; stroke: var(--ink); stroke-linecap: butt; stroke-linejoin: miter; }
.spec .p13 { stroke-width: .13; } .spec .p18 { stroke-width: .18; } .spec .p25 { stroke-width: .25; }
.spec .p35 { stroke-width: .35; } .spec .p50 { stroke-width: .5; } .spec .p70 { stroke-width: .7; }
.spec .hid { stroke-dasharray: 3 1; } .spec .ctr { stroke-dasharray: 12 1.5 2.5 1.5; } .spec .phn { stroke-dasharray: 12 1.5 2 1.5 2 1.5; }
.spec .ink { fill: var(--ink); stroke: none; }
.spec .red { stroke: var(--red); }
.spec .pap { fill: var(--paper); }
.spec text { fill: var(--ink); stroke: none; font-family: var(--let); font-weight: 400; }
.spec text.red { fill: var(--red); stroke: none; }
.spec .f07 { font-size: .61px; } .spec .f09 { font-size: 1.22px; }   /* h 1.8 after 4:1 / 2:1 */   /* annotation inside 4:1 specimens: prints at h 1.8 after the enlargement */
.spec .f18 { font-size: 2.441px; } .spec .f25 { font-size: 3.391px; } .spec .f35 { font-size: 4.747px; }
.spec .f50 { font-size: 6.782px; } .spec .f70 { font-size: 9.494px; }
.spec .mid { text-anchor: middle; } .spec .end { text-anchor: end; }
.spec .note { fill: var(--ink-2); }

.std { font-family: var(--let); text-transform: uppercase; }
.std h2 { font: 400 var(--h50)/1.1 var(--let); text-transform: uppercase; margin: 0 0 calc(4 * var(--mm)); padding-bottom: calc(1.5 * var(--mm)); border-bottom: var(--b25) solid var(--ink); }
.std h3 { font: 400 var(--h35)/1.2 var(--let); text-transform: uppercase; margin: calc(6 * var(--mm)) 0 calc(2.5 * var(--mm)); }
.std p, .std li { font-size: var(--h25); line-height: 1.5; }
.std p { max-width: 120ch; }
.std .grid2 { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 560px), 1fr)); gap: calc(6 * var(--mm)) calc(12 * var(--mm)); align-items: start; }
.std .grid3 { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 380px), 1fr)); gap: calc(6 * var(--mm)) calc(10 * var(--mm)); align-items: start; }
.std .spec-box { margin: 0 0 calc(5 * var(--mm)); }
.std .spec-box figcaption { font: var(--h18)/1.4 var(--let); text-transform: uppercase; color: var(--ink); margin-top: calc(1.5 * var(--mm)); }
.st { border-collapse: collapse; width: 100%; border: var(--b50) solid var(--ink); font-size: var(--h25); line-height: 1.3; background: var(--paper); margin: 0 0 calc(6 * var(--mm)); }
.st caption { caption-side: top; text-align: left; font: var(--h35)/1 var(--let); padding: 0 0 calc(1.5 * var(--mm)); }
.st th, .st td { border: var(--b25) solid var(--ink); padding: calc(1.2 * var(--mm)) calc(1.6 * var(--mm)) calc(1 * var(--mm)); text-align: left; vertical-align: top; font-weight: 400; }
.st th { font-size: var(--h18); vertical-align: bottom; }
.st td.n { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.st .sw { display: inline-block; width: calc(10 * var(--mm)); height: calc(5 * var(--mm)); vertical-align: middle; border: var(--b25) solid var(--ink); }
.std .refs li { margin-bottom: calc(3 * var(--mm)); }
.std .refs b { font-weight: 400; font-size: var(--h35); }
.std a { text-transform: none; }
.paper-pair { display: grid; grid-template-columns: 1fr 1fr; gap: 0; border: var(--b50) solid var(--ink); }
.paper-pair > div { padding: calc(4 * var(--mm)); }
.paper-pair .blue { background: #163F6A url("/drawing-grain.svg"); background-size: 360px 360px; background-blend-mode: soft-light; color: #EEF5FB; }
.paper-pair .film { background: #E8EBE5 url("/drawing-grain.svg"); background-size: 360px 360px; background-blend-mode: soft-light; color: #1F2427; }
.paper-pair .blue .spec { --ink: #EEF5FB; --paper: #163F6A; --red: #FFA38F; --ink-2: #B9D0E5; }
.paper-pair .film .spec { --ink: #1F2427; --paper: #E8EBE5; --red: #B0322A; --ink-2: #4A5258; }
.paper-pair .lab { font-size: var(--h25); margin: 0 0 calc(2 * var(--mm)); }
.std .rb { margin-bottom: calc(6 * var(--mm)); }
.std .pl { min-width: 0; }
