/* the type, served from here: no third-party stylesheet in front of the first paint */
@font-face { font-family: "General Sans"; src: url(fonts/general-sans-500.woff2) format("woff2"); font-weight: 500; font-style: normal; font-display: swap; }
@font-face { font-family: "General Sans"; src: url(fonts/general-sans-600.woff2) format("woff2"); font-weight: 600; font-style: normal; font-display: swap; }
@font-face { font-family: "Cormorant"; src: url(fonts/cormorant-normal-latin.woff2) format("woff2"); font-weight: 300 700; font-style: normal; font-display: swap; unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Cormorant"; src: url(fonts/cormorant-normal-latin-ext.woff2) format("woff2"); font-weight: 300 700; font-style: normal; font-display: swap; unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Cormorant"; src: url(fonts/cormorant-italic-latin.woff2) format("woff2"); font-weight: 300 700; font-style: italic; font-display: swap; unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Cormorant"; src: url(fonts/cormorant-italic-latin-ext.woff2) format("woff2"); font-weight: 300 700; font-style: italic; font-display: swap; unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }

/* ---- the tear (was src/tear.css, loaded before this sheet) ---- */
:root {
  --tear: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1500 128' preserveAspectRatio='none'%3E%3Cpath d='M0 128 L0 57.0 L0.0 57.0 L1.9 58.7 L3.8 58.4 L5.6 56.1 L7.5 53.9 L9.4 52.3 L11.3 54.7 L13.1 57.5 L15.0 60.6 L16.9 65.3 L18.8 66.2 L20.7 66.5 L22.5 68.1 L24.4 71.8 L26.3 77.1 L28.2 83.1 L30.0 84.5 L31.9 80.7 L33.8 80.4 L35.7 80.8 L37.5 80.3 L39.4 83.6 L41.3 88.0 L43.2 86.7 L45.1 88.7 L46.9 89.2 L48.8 84.8 L50.7 81.2 L52.6 79.4 L54.4 77.5 L56.3 75.0 L58.2 76.0 L60.1 75.1 L62.0 74.9 L63.8 70.9 L65.7 69.3 L67.6 66.8 L69.5 63.7 L71.3 61.6 L73.2 60.3 L75.1 59.8 L77.0 53.7 L78.8 51.3 L80.7 51.3 L82.6 55.5 L84.5 59.7 L86.4 59.5 L88.2 63.0 L90.1 65.5 L92.0 69.9 L93.9 74.6 L95.7 74.0 L97.6 75.4 L99.5 77.8 L101.4 80.2 L103.3 81.6 L105.1 85.1 L107.0 89.6 L108.9 94.7 L110.8 96.5 L112.6 96.0 L114.5 94.3 L116.4 91.3 L118.3 87.2 L120.2 88.4 L122.0 88.4 L123.9 89.0 L125.8 89.6 L127.7 88.9 L129.5 91.3 L131.4 91.0 L133.3 91.9 L135.2 92.4 L137.0 91.3 L138.9 87.5 L140.8 87.1 L142.7 86.9 L144.6 90.4 L146.4 88.1 L148.3 88.8 L150.2 90.6 L152.1 90.6 L153.9 90.0 L155.8 90.1 L157.7 90.7 L159.6 93.1 L161.5 91.9 L163.3 92.9 L165.2 93.1 L167.1 92.2 L169.0 92.5 L170.8 94.2 L172.7 96.2 L174.6 98.6 L176.5 100.0 L178.3 96.7 L180.2 94.5 L182.1 98.0 L184.0 100.4 L185.9 103.6 L187.7 110.0 L189.6 113.0 L191.5 113.6 L193.4 119.3 L195.2 120.0 L197.1 119.6 L199.0 119.0 L200.9 118.9 L202.8 114.2 L204.6 110.8 L206.5 107.7 L208.4 105.7 L210.3 104.5 L212.1 103.0 L214.0 104.4 L215.9 101.9 L217.8 99.2 L219.6 96.3 L221.5 97.3 L223.4 97.5 L225.3 96.9 L227.2 100.4 L229.0 102.1 L230.9 104.8 L232.8 100.1 L234.7 94.7 L236.5 93.4 L238.4 93.1 L240.3 97.5 L242.2 99.1 L244.1 98.4 L245.9 100.4 L247.8 102.2 L249.7 102.6 L251.6 101.0 L253.4 99.9 L255.3 98.8 L257.2 98.6 L259.1 97.4 L261.0 99.2 L262.8 101.7 L264.7 103.0 L266.6 103.8 L268.5 107.0 L270.3 105.5 L272.2 107.7 L274.1 107.4 L276.0 111.3 L277.8 114.6 L279.7 116.8 L281.6 118.1 L283.5 118.6 L285.4 114.3 L287.2 111.0 L289.1 108.3 L291.0 108.2 L292.9 106.9 L294.7 102.3 L296.6 102.4 L298.5 101.5 L300.4 98.9 L302.3 96.2 L304.1 93.6 L306.0 93.3 L307.9 93.4 L309.8 93.1 L311.6 96.4 L313.5 97.4 L315.4 98.0 L317.3 98.7 L319.1 99.7 L321.0 101.1 L322.9 103.7 L324.8 103.9 L326.7 100.1 L328.5 99.5 L330.4 99.9 L332.3 98.0 L334.2 99.0 L336.0 102.4 L337.9 101.3 L339.8 103.2 L341.7 105.5 L343.6 102.1 L345.4 99.1 L347.3 97.4 L349.2 95.6 L351.1 90.9 L352.9 88.3 L354.8 82.8 L356.7 78.9 L358.6 73.6 L360.5 72.8 L362.3 74.2 L364.2 74.7 L366.1 76.2 L368.0 77.9 L369.8 81.9 L371.7 81.4 L373.6 83.7 L375.5 87.1 L377.3 90.1 L379.2 90.9 L381.1 83.8 L383.0 79.9 L384.9 77.1 L386.7 77.3 L388.6 80.3 L390.5 78.4 L392.4 77.4 L394.2 77.2 L396.1 76.0 L398.0 72.6 L399.9 69.8 L401.8 68.3 L403.6 68.9 L405.5 69.2 L407.4 69.2 L409.3 70.0 L411.1 69.5 L413.0 66.6 L414.9 67.2 L416.8 67.6 L418.6 68.0 L420.5 70.6 L422.4 71.4 L424.3 76.3 L426.2 77.8 L428.0 79.8 L429.9 80.5 L431.8 79.4 L433.7 73.5 L435.5 70.3 L437.4 66.6 L439.3 67.3 L441.2 63.5 L443.1 62.1 L444.9 63.1 L446.8 62.0 L448.7 59.6 L450.6 57.7 L452.4 55.7 L454.3 56.5 L456.2 54.8 L458.1 56.0 L459.9 59.0 L461.8 61.7 L463.7 66.1 L465.6 71.2 L467.5 75.6 L469.3 79.7 L471.2 83.2 L473.1 82.9 L475.0 82.5 L476.8 86.9 L478.7 88.5 L480.6 88.1 L482.5 90.1 L484.4 90.9 L486.2 89.7 L488.1 95.1 L490.0 96.1 L491.9 93.5 L493.7 89.8 L495.6 87.3 L497.5 82.5 L499.4 79.9 L501.3 78.7 L503.1 76.5 L505.0 74.3 L506.9 70.8 L508.8 72.2 L510.6 72.5 L512.5 73.3 L514.4 72.9 L516.3 73.0 L518.1 70.9 L520.0 65.7 L521.9 65.9 L523.8 66.0 L525.7 68.1 L527.5 63.5 L529.4 56.0 L531.3 53.3 L533.2 52.6 L535.0 58.3 L536.9 63.2 L538.8 64.3 L540.7 66.9 L542.6 68.1 L544.4 67.7 L546.3 65.4 L548.2 64.1 L550.1 62.7 L551.9 62.8 L553.8 62.2 L555.7 65.2 L557.6 70.3 L559.4 74.5 L561.3 76.3 L563.2 79.1 L565.1 75.6 L567.0 74.7 L568.8 72.8 L570.7 74.9 L572.6 77.9 L574.5 78.3 L576.3 77.1 L578.2 74.4 L580.1 68.2 L582.0 62.9 L583.9 60.2 L585.7 59.5 L587.6 58.8 L589.5 53.1 L591.4 52.1 L593.2 51.0 L595.1 48.6 L597.0 45.9 L598.9 42.9 L600.8 41.2 L602.6 40.4 L604.5 38.4 L606.4 40.8 L608.3 41.2 L610.1 40.6 L612.0 39.2 L613.9 37.6 L615.8 36.2 L617.6 36.5 L619.5 35.8 L621.4 30.9 L623.3 28.0 L625.2 26.2 L627.0 20.8 L628.9 17.8 L630.8 19.4 L632.7 19.1 L634.5 22.5 L636.4 28.6 L638.3 27.6 L640.2 25.2 L642.1 23.0 L643.9 22.7 L645.8 21.2 L647.7 24.4 L649.6 25.4 L651.4 25.6 L653.3 21.5 L655.2 18.5 L657.1 18.3 L658.9 18.3 L660.8 21.2 L662.7 24.2 L664.6 28.3 L666.5 25.9 L668.3 23.8 L670.2 24.8 L672.1 27.8 L674.0 32.8 L675.8 30.9 L677.7 30.4 L679.6 29.6 L681.5 28.8 L683.4 30.3 L685.2 27.0 L687.1 24.7 L689.0 24.9 L690.9 25.3 L692.7 24.2 L694.6 22.8 L696.5 21.9 L698.4 21.3 L700.3 19.7 L702.1 17.1 L704.0 16.2 L705.9 15.5 L707.8 13.5 L709.6 14.8 L711.5 17.2 L713.4 18.1 L715.3 22.1 L717.1 23.2 L719.0 28.0 L720.9 28.8 L722.8 29.4 L724.7 28.9 L726.5 28.8 L728.4 25.5 L730.3 26.4 L732.2 26.9 L734.0 30.8 L735.9 29.4 L737.8 28.0 L739.7 29.9 L741.6 30.2 L743.4 29.2 L745.3 28.4 L747.2 27.1 L749.1 28.4 L750.9 27.4 L752.8 27.8 L754.7 29.6 L756.6 29.0 L758.4 28.7 L760.3 29.1 L762.2 30.1 L764.1 31.8 L766.0 33.7 L767.8 31.2 L769.7 26.0 L771.6 24.9 L773.5 22.7 L775.3 19.9 L777.2 21.4 L779.1 23.8 L781.0 23.1 L782.9 28.3 L784.7 30.5 L786.6 29.2 L788.5 28.0 L790.4 28.6 L792.2 27.8 L794.1 27.8 L796.0 29.9 L797.9 29.9 L799.7 29.3 L801.6 24.6 L803.5 22.5 L805.4 18.5 L807.3 14.9 L809.1 12.5 L811.0 12.7 L812.9 13.5 L814.8 10.4 L816.6 12.1 L818.5 14.2 L820.4 19.3 L822.3 20.4 L824.2 17.3 L826.0 17.5 L827.9 16.2 L829.8 17.8 L831.7 18.0 L833.5 14.1 L835.4 13.4 L837.3 14.1 L839.2 14.8 L841.1 13.9 L842.9 13.7 L844.8 12.6 L846.7 11.8 L848.6 8.9 L850.4 8.0 L852.3 9.3 L854.2 11.4 L856.1 12.9 L857.9 18.1 L859.8 18.7 L861.7 20.8 L863.6 21.6 L865.5 24.1 L867.3 28.9 L869.2 31.3 L871.1 33.7 L873.0 35.4 L874.8 34.3 L876.7 32.8 L878.6 34.1 L880.5 36.1 L882.4 38.8 L884.2 34.5 L886.1 33.6 L888.0 32.8 L889.9 30.9 L891.7 28.8 L893.6 27.1 L895.5 25.9 L897.4 25.9 L899.2 23.2 L901.1 24.0 L903.0 23.3 L904.9 21.2 L906.8 19.3 L908.6 18.7 L910.5 19.6 L912.4 23.7 L914.3 27.8 L916.1 27.3 L918.0 27.1 L919.9 28.6 L921.8 26.9 L923.7 27.7 L925.5 33.8 L927.4 37.6 L929.3 41.6 L931.2 47.8 L933.0 46.2 L934.9 43.7 L936.8 42.7 L938.7 44.7 L940.6 44.4 L942.4 46.6 L944.3 45.9 L946.2 44.2 L948.1 40.3 L949.9 37.4 L951.8 38.0 L953.7 36.6 L955.6 36.4 L957.4 36.0 L959.3 38.5 L961.2 37.6 L963.1 36.6 L965.0 38.4 L966.8 39.0 L968.7 40.2 L970.6 34.1 L972.5 29.6 L974.3 27.3 L976.2 25.4 L978.1 26.4 L980.0 22.9 L981.9 19.5 L983.7 20.6 L985.6 23.7 L987.5 26.3 L989.4 27.5 L991.2 28.0 L993.1 27.2 L995.0 25.4 L996.9 22.2 L998.7 21.2 L1000.6 20.5 L1002.5 18.9 L1004.4 20.1 L1006.3 24.7 L1008.1 27.5 L1010.0 34.2 L1011.9 36.3 L1013.8 40.1 L1015.6 39.0 L1017.5 36.7 L1019.4 34.3 L1021.3 33.3 L1023.2 29.0 L1025.0 27.3 L1026.9 24.5 L1028.8 24.3 L1030.7 20.7 L1032.5 16.6 L1034.4 17.5 L1036.3 17.3 L1038.2 15.5 L1040.1 13.3 L1041.9 10.9 L1043.8 11.4 L1045.7 11.2 L1047.6 11.7 L1049.4 14.4 L1051.3 14.5 L1053.2 14.9 L1055.1 16.5 L1056.9 19.6 L1058.8 23.8 L1060.7 28.4 L1062.6 28.8 L1064.5 25.0 L1066.3 25.2 L1068.2 25.5 L1070.1 24.9 L1072.0 28.3 L1073.8 32.7 L1075.7 31.9 L1077.6 35.1 L1079.5 36.3 L1081.4 33.9 L1083.2 33.2 L1085.1 35.5 L1087.0 37.0 L1088.9 36.9 L1090.7 37.7 L1092.6 35.3 L1094.5 33.7 L1096.4 30.3 L1098.2 31.4 L1100.1 31.8 L1102.0 30.1 L1103.9 27.1 L1105.8 24.2 L1107.6 23.1 L1109.5 19.5 L1111.4 22.2 L1113.3 26.4 L1115.1 31.6 L1117.0 32.3 L1118.9 26.4 L1120.8 24.9 L1122.7 25.1 L1124.5 30.2 L1126.4 36.4 L1128.3 36.6 L1130.2 37.0 L1132.0 36.4 L1133.9 34.5 L1135.8 30.6 L1137.7 27.8 L1139.5 25.3 L1141.4 24.0 L1143.3 21.3 L1145.2 19.6 L1147.1 19.3 L1148.9 18.8 L1150.8 16.4 L1152.7 17.7 L1154.6 16.4 L1156.4 16.9 L1158.3 18.8 L1160.2 21.8 L1162.1 28.5 L1164.0 32.4 L1165.8 36.5 L1167.7 39.2 L1169.6 39.2 L1171.5 36.5 L1173.3 36.8 L1175.2 37.2 L1177.1 41.2 L1179.0 39.7 L1180.9 42.3 L1182.7 45.9 L1184.6 46.9 L1186.5 46.1 L1188.4 44.8 L1190.2 43.6 L1192.1 44.7 L1194.0 43.3 L1195.9 45.1 L1197.7 46.0 L1199.6 45.1 L1201.5 44.4 L1203.4 44.4 L1205.3 44.8 L1207.1 46.4 L1209.0 47.7 L1210.9 44.4 L1212.8 41.4 L1214.6 41.9 L1216.5 39.4 L1218.4 37.3 L1220.3 38.9 L1222.2 38.3 L1224.0 37.2 L1225.9 41.2 L1227.8 39.7 L1229.7 37.3 L1231.5 35.8 L1233.4 37.0 L1235.3 36.0 L1237.2 38.1 L1239.0 39.4 L1240.9 40.2 L1242.8 39.6 L1244.7 38.9 L1246.6 42.1 L1248.4 42.8 L1250.3 43.6 L1252.2 42.0 L1254.1 41.1 L1255.9 36.5 L1257.8 30.8 L1259.7 30.7 L1261.6 31.6 L1263.5 35.5 L1265.3 32.4 L1267.2 29.0 L1269.1 28.7 L1271.0 29.3 L1272.8 34.7 L1274.7 36.6 L1276.6 35.9 L1278.5 36.8 L1280.4 36.6 L1282.2 35.0 L1284.1 32.5 L1286.0 31.8 L1287.9 32.2 L1289.7 33.8 L1291.6 34.2 L1293.5 36.7 L1295.4 39.0 L1297.2 39.5 L1299.1 40.2 L1301.0 44.2 L1302.9 45.5 L1304.8 51.8 L1306.6 55.8 L1308.5 63.1 L1310.4 67.1 L1312.3 68.6 L1314.1 68.4 L1316.0 68.3 L1317.9 64.7 L1319.8 63.6 L1321.7 63.1 L1323.5 65.3 L1325.4 65.7 L1327.3 63.7 L1329.2 67.0 L1331.0 69.0 L1332.9 68.7 L1334.8 67.0 L1336.7 64.2 L1338.5 63.7 L1340.4 63.5 L1342.3 63.6 L1344.2 67.1 L1346.1 67.7 L1347.9 67.5 L1349.8 67.4 L1351.7 67.8 L1353.6 68.6 L1355.4 70.0 L1357.3 68.3 L1359.2 62.8 L1361.1 61.9 L1363.0 63.2 L1364.8 63.2 L1366.7 66.3 L1368.6 70.4 L1370.5 69.0 L1372.3 71.1 L1374.2 74.0 L1376.1 72.7 L1378.0 72.2 L1379.8 72.3 L1381.7 71.1 L1383.6 67.0 L1385.5 65.9 L1387.4 63.3 L1389.2 62.5 L1391.1 58.9 L1393.0 57.5 L1394.9 55.3 L1396.7 50.9 L1398.6 47.1 L1400.5 44.1 L1402.4 43.3 L1404.3 37.9 L1406.1 36.3 L1408.0 37.0 L1409.9 40.1 L1411.8 42.6 L1413.6 38.5 L1415.5 37.2 L1417.4 35.5 L1419.3 35.9 L1421.2 38.4 L1423.0 36.4 L1424.9 35.9 L1426.8 36.0 L1428.7 34.8 L1430.5 31.3 L1432.4 29.2 L1434.3 29.0 L1436.2 31.5 L1438.0 33.6 L1439.9 35.2 L1441.8 36.8 L1443.7 36.9 L1445.6 34.2 L1447.4 34.9 L1449.3 34.2 L1451.2 33.7 L1453.1 35.8 L1454.9 38.1 L1456.8 46.2 L1458.7 52.0 L1460.6 57.9 L1462.5 61.0 L1464.3 60.2 L1466.2 54.2 L1468.1 51.4 L1470.0 49.2 L1471.8 52.1 L1473.7 50.0 L1475.6 50.0 L1477.5 50.9 L1479.3 49.0 L1481.2 45.8 L1483.1 43.6 L1485.0 42.2 L1486.9 43.7 L1488.7 42.5 L1490.6 43.8 L1492.5 45.2 L1494.4 45.3 L1496.2 46.1 L1498.1 48.0 L1500.0 50.1 L1500 128 Z' fill='%23000'/%3E%3C/svg%3E");
  --fibre: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1500 128' preserveAspectRatio='none'%3E%3Cpath d='M0.0 57.0 L0.0 57.0 L1.9 58.7 L3.8 58.4 L5.6 56.1 L7.5 53.9 L9.4 52.3 L11.3 54.7 L13.1 57.5 L15.0 60.6 L16.9 65.3 L18.8 66.2 L20.7 66.5 L22.5 68.1 L24.4 71.8 L26.3 77.1 L28.2 83.1 L30.0 84.5 L31.9 80.7 L33.8 80.4 L35.7 80.8 L37.5 80.3 L39.4 83.6 L41.3 88.0 L43.2 86.7 L45.1 88.7 L46.9 89.2 L48.8 84.8 L50.7 81.2 L52.6 79.4 L54.4 77.5 L56.3 75.0 L58.2 76.0 L60.1 75.1 L62.0 74.9 L63.8 70.9 L65.7 69.3 L67.6 66.8 L69.5 63.7 L71.3 61.6 L73.2 60.3 L75.1 59.8 L77.0 53.7 L78.8 51.3 L80.7 51.3 L82.6 55.5 L84.5 59.7 L86.4 59.5 L88.2 63.0 L90.1 65.5 L92.0 69.9 L93.9 74.6 L95.7 74.0 L97.6 75.4 L99.5 77.8 L101.4 80.2 L103.3 81.6 L105.1 85.1 L107.0 89.6 L108.9 94.7 L110.8 96.5 L112.6 96.0 L114.5 94.3 L116.4 91.3 L118.3 87.2 L120.2 88.4 L122.0 88.4 L123.9 89.0 L125.8 89.6 L127.7 88.9 L129.5 91.3 L131.4 91.0 L133.3 91.9 L135.2 92.4 L137.0 91.3 L138.9 87.5 L140.8 87.1 L142.7 86.9 L144.6 90.4 L146.4 88.1 L148.3 88.8 L150.2 90.6 L152.1 90.6 L153.9 90.0 L155.8 90.1 L157.7 90.7 L159.6 93.1 L161.5 91.9 L163.3 92.9 L165.2 93.1 L167.1 92.2 L169.0 92.5 L170.8 94.2 L172.7 96.2 L174.6 98.6 L176.5 100.0 L178.3 96.7 L180.2 94.5 L182.1 98.0 L184.0 100.4 L185.9 103.6 L187.7 110.0 L189.6 113.0 L191.5 113.6 L193.4 119.3 L195.2 120.0 L197.1 119.6 L199.0 119.0 L200.9 118.9 L202.8 114.2 L204.6 110.8 L206.5 107.7 L208.4 105.7 L210.3 104.5 L212.1 103.0 L214.0 104.4 L215.9 101.9 L217.8 99.2 L219.6 96.3 L221.5 97.3 L223.4 97.5 L225.3 96.9 L227.2 100.4 L229.0 102.1 L230.9 104.8 L232.8 100.1 L234.7 94.7 L236.5 93.4 L238.4 93.1 L240.3 97.5 L242.2 99.1 L244.1 98.4 L245.9 100.4 L247.8 102.2 L249.7 102.6 L251.6 101.0 L253.4 99.9 L255.3 98.8 L257.2 98.6 L259.1 97.4 L261.0 99.2 L262.8 101.7 L264.7 103.0 L266.6 103.8 L268.5 107.0 L270.3 105.5 L272.2 107.7 L274.1 107.4 L276.0 111.3 L277.8 114.6 L279.7 116.8 L281.6 118.1 L283.5 118.6 L285.4 114.3 L287.2 111.0 L289.1 108.3 L291.0 108.2 L292.9 106.9 L294.7 102.3 L296.6 102.4 L298.5 101.5 L300.4 98.9 L302.3 96.2 L304.1 93.6 L306.0 93.3 L307.9 93.4 L309.8 93.1 L311.6 96.4 L313.5 97.4 L315.4 98.0 L317.3 98.7 L319.1 99.7 L321.0 101.1 L322.9 103.7 L324.8 103.9 L326.7 100.1 L328.5 99.5 L330.4 99.9 L332.3 98.0 L334.2 99.0 L336.0 102.4 L337.9 101.3 L339.8 103.2 L341.7 105.5 L343.6 102.1 L345.4 99.1 L347.3 97.4 L349.2 95.6 L351.1 90.9 L352.9 88.3 L354.8 82.8 L356.7 78.9 L358.6 73.6 L360.5 72.8 L362.3 74.2 L364.2 74.7 L366.1 76.2 L368.0 77.9 L369.8 81.9 L371.7 81.4 L373.6 83.7 L375.5 87.1 L377.3 90.1 L379.2 90.9 L381.1 83.8 L383.0 79.9 L384.9 77.1 L386.7 77.3 L388.6 80.3 L390.5 78.4 L392.4 77.4 L394.2 77.2 L396.1 76.0 L398.0 72.6 L399.9 69.8 L401.8 68.3 L403.6 68.9 L405.5 69.2 L407.4 69.2 L409.3 70.0 L411.1 69.5 L413.0 66.6 L414.9 67.2 L416.8 67.6 L418.6 68.0 L420.5 70.6 L422.4 71.4 L424.3 76.3 L426.2 77.8 L428.0 79.8 L429.9 80.5 L431.8 79.4 L433.7 73.5 L435.5 70.3 L437.4 66.6 L439.3 67.3 L441.2 63.5 L443.1 62.1 L444.9 63.1 L446.8 62.0 L448.7 59.6 L450.6 57.7 L452.4 55.7 L454.3 56.5 L456.2 54.8 L458.1 56.0 L459.9 59.0 L461.8 61.7 L463.7 66.1 L465.6 71.2 L467.5 75.6 L469.3 79.7 L471.2 83.2 L473.1 82.9 L475.0 82.5 L476.8 86.9 L478.7 88.5 L480.6 88.1 L482.5 90.1 L484.4 90.9 L486.2 89.7 L488.1 95.1 L490.0 96.1 L491.9 93.5 L493.7 89.8 L495.6 87.3 L497.5 82.5 L499.4 79.9 L501.3 78.7 L503.1 76.5 L505.0 74.3 L506.9 70.8 L508.8 72.2 L510.6 72.5 L512.5 73.3 L514.4 72.9 L516.3 73.0 L518.1 70.9 L520.0 65.7 L521.9 65.9 L523.8 66.0 L525.7 68.1 L527.5 63.5 L529.4 56.0 L531.3 53.3 L533.2 52.6 L535.0 58.3 L536.9 63.2 L538.8 64.3 L540.7 66.9 L542.6 68.1 L544.4 67.7 L546.3 65.4 L548.2 64.1 L550.1 62.7 L551.9 62.8 L553.8 62.2 L555.7 65.2 L557.6 70.3 L559.4 74.5 L561.3 76.3 L563.2 79.1 L565.1 75.6 L567.0 74.7 L568.8 72.8 L570.7 74.9 L572.6 77.9 L574.5 78.3 L576.3 77.1 L578.2 74.4 L580.1 68.2 L582.0 62.9 L583.9 60.2 L585.7 59.5 L587.6 58.8 L589.5 53.1 L591.4 52.1 L593.2 51.0 L595.1 48.6 L597.0 45.9 L598.9 42.9 L600.8 41.2 L602.6 40.4 L604.5 38.4 L606.4 40.8 L608.3 41.2 L610.1 40.6 L612.0 39.2 L613.9 37.6 L615.8 36.2 L617.6 36.5 L619.5 35.8 L621.4 30.9 L623.3 28.0 L625.2 26.2 L627.0 20.8 L628.9 17.8 L630.8 19.4 L632.7 19.1 L634.5 22.5 L636.4 28.6 L638.3 27.6 L640.2 25.2 L642.1 23.0 L643.9 22.7 L645.8 21.2 L647.7 24.4 L649.6 25.4 L651.4 25.6 L653.3 21.5 L655.2 18.5 L657.1 18.3 L658.9 18.3 L660.8 21.2 L662.7 24.2 L664.6 28.3 L666.5 25.9 L668.3 23.8 L670.2 24.8 L672.1 27.8 L674.0 32.8 L675.8 30.9 L677.7 30.4 L679.6 29.6 L681.5 28.8 L683.4 30.3 L685.2 27.0 L687.1 24.7 L689.0 24.9 L690.9 25.3 L692.7 24.2 L694.6 22.8 L696.5 21.9 L698.4 21.3 L700.3 19.7 L702.1 17.1 L704.0 16.2 L705.9 15.5 L707.8 13.5 L709.6 14.8 L711.5 17.2 L713.4 18.1 L715.3 22.1 L717.1 23.2 L719.0 28.0 L720.9 28.8 L722.8 29.4 L724.7 28.9 L726.5 28.8 L728.4 25.5 L730.3 26.4 L732.2 26.9 L734.0 30.8 L735.9 29.4 L737.8 28.0 L739.7 29.9 L741.6 30.2 L743.4 29.2 L745.3 28.4 L747.2 27.1 L749.1 28.4 L750.9 27.4 L752.8 27.8 L754.7 29.6 L756.6 29.0 L758.4 28.7 L760.3 29.1 L762.2 30.1 L764.1 31.8 L766.0 33.7 L767.8 31.2 L769.7 26.0 L771.6 24.9 L773.5 22.7 L775.3 19.9 L777.2 21.4 L779.1 23.8 L781.0 23.1 L782.9 28.3 L784.7 30.5 L786.6 29.2 L788.5 28.0 L790.4 28.6 L792.2 27.8 L794.1 27.8 L796.0 29.9 L797.9 29.9 L799.7 29.3 L801.6 24.6 L803.5 22.5 L805.4 18.5 L807.3 14.9 L809.1 12.5 L811.0 12.7 L812.9 13.5 L814.8 10.4 L816.6 12.1 L818.5 14.2 L820.4 19.3 L822.3 20.4 L824.2 17.3 L826.0 17.5 L827.9 16.2 L829.8 17.8 L831.7 18.0 L833.5 14.1 L835.4 13.4 L837.3 14.1 L839.2 14.8 L841.1 13.9 L842.9 13.7 L844.8 12.6 L846.7 11.8 L848.6 8.9 L850.4 8.0 L852.3 9.3 L854.2 11.4 L856.1 12.9 L857.9 18.1 L859.8 18.7 L861.7 20.8 L863.6 21.6 L865.5 24.1 L867.3 28.9 L869.2 31.3 L871.1 33.7 L873.0 35.4 L874.8 34.3 L876.7 32.8 L878.6 34.1 L880.5 36.1 L882.4 38.8 L884.2 34.5 L886.1 33.6 L888.0 32.8 L889.9 30.9 L891.7 28.8 L893.6 27.1 L895.5 25.9 L897.4 25.9 L899.2 23.2 L901.1 24.0 L903.0 23.3 L904.9 21.2 L906.8 19.3 L908.6 18.7 L910.5 19.6 L912.4 23.7 L914.3 27.8 L916.1 27.3 L918.0 27.1 L919.9 28.6 L921.8 26.9 L923.7 27.7 L925.5 33.8 L927.4 37.6 L929.3 41.6 L931.2 47.8 L933.0 46.2 L934.9 43.7 L936.8 42.7 L938.7 44.7 L940.6 44.4 L942.4 46.6 L944.3 45.9 L946.2 44.2 L948.1 40.3 L949.9 37.4 L951.8 38.0 L953.7 36.6 L955.6 36.4 L957.4 36.0 L959.3 38.5 L961.2 37.6 L963.1 36.6 L965.0 38.4 L966.8 39.0 L968.7 40.2 L970.6 34.1 L972.5 29.6 L974.3 27.3 L976.2 25.4 L978.1 26.4 L980.0 22.9 L981.9 19.5 L983.7 20.6 L985.6 23.7 L987.5 26.3 L989.4 27.5 L991.2 28.0 L993.1 27.2 L995.0 25.4 L996.9 22.2 L998.7 21.2 L1000.6 20.5 L1002.5 18.9 L1004.4 20.1 L1006.3 24.7 L1008.1 27.5 L1010.0 34.2 L1011.9 36.3 L1013.8 40.1 L1015.6 39.0 L1017.5 36.7 L1019.4 34.3 L1021.3 33.3 L1023.2 29.0 L1025.0 27.3 L1026.9 24.5 L1028.8 24.3 L1030.7 20.7 L1032.5 16.6 L1034.4 17.5 L1036.3 17.3 L1038.2 15.5 L1040.1 13.3 L1041.9 10.9 L1043.8 11.4 L1045.7 11.2 L1047.6 11.7 L1049.4 14.4 L1051.3 14.5 L1053.2 14.9 L1055.1 16.5 L1056.9 19.6 L1058.8 23.8 L1060.7 28.4 L1062.6 28.8 L1064.5 25.0 L1066.3 25.2 L1068.2 25.5 L1070.1 24.9 L1072.0 28.3 L1073.8 32.7 L1075.7 31.9 L1077.6 35.1 L1079.5 36.3 L1081.4 33.9 L1083.2 33.2 L1085.1 35.5 L1087.0 37.0 L1088.9 36.9 L1090.7 37.7 L1092.6 35.3 L1094.5 33.7 L1096.4 30.3 L1098.2 31.4 L1100.1 31.8 L1102.0 30.1 L1103.9 27.1 L1105.8 24.2 L1107.6 23.1 L1109.5 19.5 L1111.4 22.2 L1113.3 26.4 L1115.1 31.6 L1117.0 32.3 L1118.9 26.4 L1120.8 24.9 L1122.7 25.1 L1124.5 30.2 L1126.4 36.4 L1128.3 36.6 L1130.2 37.0 L1132.0 36.4 L1133.9 34.5 L1135.8 30.6 L1137.7 27.8 L1139.5 25.3 L1141.4 24.0 L1143.3 21.3 L1145.2 19.6 L1147.1 19.3 L1148.9 18.8 L1150.8 16.4 L1152.7 17.7 L1154.6 16.4 L1156.4 16.9 L1158.3 18.8 L1160.2 21.8 L1162.1 28.5 L1164.0 32.4 L1165.8 36.5 L1167.7 39.2 L1169.6 39.2 L1171.5 36.5 L1173.3 36.8 L1175.2 37.2 L1177.1 41.2 L1179.0 39.7 L1180.9 42.3 L1182.7 45.9 L1184.6 46.9 L1186.5 46.1 L1188.4 44.8 L1190.2 43.6 L1192.1 44.7 L1194.0 43.3 L1195.9 45.1 L1197.7 46.0 L1199.6 45.1 L1201.5 44.4 L1203.4 44.4 L1205.3 44.8 L1207.1 46.4 L1209.0 47.7 L1210.9 44.4 L1212.8 41.4 L1214.6 41.9 L1216.5 39.4 L1218.4 37.3 L1220.3 38.9 L1222.2 38.3 L1224.0 37.2 L1225.9 41.2 L1227.8 39.7 L1229.7 37.3 L1231.5 35.8 L1233.4 37.0 L1235.3 36.0 L1237.2 38.1 L1239.0 39.4 L1240.9 40.2 L1242.8 39.6 L1244.7 38.9 L1246.6 42.1 L1248.4 42.8 L1250.3 43.6 L1252.2 42.0 L1254.1 41.1 L1255.9 36.5 L1257.8 30.8 L1259.7 30.7 L1261.6 31.6 L1263.5 35.5 L1265.3 32.4 L1267.2 29.0 L1269.1 28.7 L1271.0 29.3 L1272.8 34.7 L1274.7 36.6 L1276.6 35.9 L1278.5 36.8 L1280.4 36.6 L1282.2 35.0 L1284.1 32.5 L1286.0 31.8 L1287.9 32.2 L1289.7 33.8 L1291.6 34.2 L1293.5 36.7 L1295.4 39.0 L1297.2 39.5 L1299.1 40.2 L1301.0 44.2 L1302.9 45.5 L1304.8 51.8 L1306.6 55.8 L1308.5 63.1 L1310.4 67.1 L1312.3 68.6 L1314.1 68.4 L1316.0 68.3 L1317.9 64.7 L1319.8 63.6 L1321.7 63.1 L1323.5 65.3 L1325.4 65.7 L1327.3 63.7 L1329.2 67.0 L1331.0 69.0 L1332.9 68.7 L1334.8 67.0 L1336.7 64.2 L1338.5 63.7 L1340.4 63.5 L1342.3 63.6 L1344.2 67.1 L1346.1 67.7 L1347.9 67.5 L1349.8 67.4 L1351.7 67.8 L1353.6 68.6 L1355.4 70.0 L1357.3 68.3 L1359.2 62.8 L1361.1 61.9 L1363.0 63.2 L1364.8 63.2 L1366.7 66.3 L1368.6 70.4 L1370.5 69.0 L1372.3 71.1 L1374.2 74.0 L1376.1 72.7 L1378.0 72.2 L1379.8 72.3 L1381.7 71.1 L1383.6 67.0 L1385.5 65.9 L1387.4 63.3 L1389.2 62.5 L1391.1 58.9 L1393.0 57.5 L1394.9 55.3 L1396.7 50.9 L1398.6 47.1 L1400.5 44.1 L1402.4 43.3 L1404.3 37.9 L1406.1 36.3 L1408.0 37.0 L1409.9 40.1 L1411.8 42.6 L1413.6 38.5 L1415.5 37.2 L1417.4 35.5 L1419.3 35.9 L1421.2 38.4 L1423.0 36.4 L1424.9 35.9 L1426.8 36.0 L1428.7 34.8 L1430.5 31.3 L1432.4 29.2 L1434.3 29.0 L1436.2 31.5 L1438.0 33.6 L1439.9 35.2 L1441.8 36.8 L1443.7 36.9 L1445.6 34.2 L1447.4 34.9 L1449.3 34.2 L1451.2 33.7 L1453.1 35.8 L1454.9 38.1 L1456.8 46.2 L1458.7 52.0 L1460.6 57.9 L1462.5 61.0 L1464.3 60.2 L1466.2 54.2 L1468.1 51.4 L1470.0 49.2 L1471.8 52.1 L1473.7 50.0 L1475.6 50.0 L1477.5 50.9 L1479.3 49.0 L1481.2 45.8 L1483.1 43.6 L1485.0 42.2 L1486.9 43.7 L1488.7 42.5 L1490.6 43.8 L1492.5 45.2 L1494.4 45.3 L1496.2 46.1 L1498.1 48.0 L1500.0 50.1 L1500.0 39.0 L1498.1 37.2 L1496.2 35.7 L1494.4 35.3 L1492.5 35.8 L1490.6 34.8 L1488.7 34.0 L1486.9 35.7 L1485.0 34.7 L1483.1 36.6 L1481.2 39.4 L1479.3 49.0 L1477.5 50.9 L1475.6 50.0 L1473.7 50.0 L1471.8 52.1 L1470.0 49.2 L1468.1 51.4 L1466.2 54.2 L1464.3 60.2 L1462.5 61.0 L1460.6 57.9 L1458.7 52.0 L1456.8 46.2 L1454.9 38.1 L1453.1 35.8 L1451.2 33.7 L1449.3 29.5 L1447.4 29.7 L1445.6 28.6 L1443.7 30.8 L1441.8 30.4 L1439.9 28.3 L1438.0 26.4 L1436.2 24.0 L1434.3 21.2 L1432.4 21.1 L1430.5 23.1 L1428.7 26.5 L1426.8 27.6 L1424.9 27.4 L1423.0 27.9 L1421.2 30.1 L1419.3 27.7 L1417.4 27.4 L1415.5 29.4 L1413.6 30.9 L1411.8 35.4 L1409.9 33.2 L1408.0 30.5 L1406.1 30.2 L1404.3 32.3 L1402.4 38.1 L1400.5 39.4 L1398.6 42.9 L1396.7 46.9 L1394.9 50.9 L1393.0 52.8 L1391.1 53.8 L1389.2 57.1 L1387.4 57.6 L1385.5 60.0 L1383.6 60.9 L1381.7 64.7 L1379.8 65.7 L1378.0 65.3 L1376.1 65.7 L1374.2 66.8 L1372.3 63.9 L1370.5 61.7 L1368.6 63.0 L1366.7 58.9 L1364.8 55.9 L1363.0 55.9 L1361.1 54.7 L1359.2 55.6 L1357.3 61.2 L1355.4 63.1 L1353.6 61.9 L1351.7 61.4 L1349.8 61.2 L1347.9 61.6 L1346.1 62.0 L1344.2 61.7 L1342.3 58.6 L1340.4 58.8 L1338.5 59.3 L1336.7 60.2 L1334.8 63.3 L1332.9 68.7 L1331.0 69.0 L1329.2 67.0 L1327.3 63.7 L1325.4 65.7 L1323.5 65.3 L1321.7 63.1 L1319.8 63.6 L1317.9 64.7 L1316.0 68.3 L1314.1 68.4 L1312.3 68.6 L1310.4 67.1 L1308.5 63.1 L1306.6 55.8 L1304.8 51.8 L1302.9 45.5 L1301.0 44.2 L1299.1 40.2 L1297.2 39.5 L1295.4 39.0 L1293.5 36.7 L1291.6 34.2 L1289.7 33.8 L1287.9 32.2 L1286.0 31.8 L1284.1 32.5 L1282.2 35.0 L1280.4 36.6 L1278.5 36.8 L1276.6 35.9 L1274.7 36.6 L1272.8 34.7 L1271.0 29.3 L1269.1 22.3 L1267.2 21.8 L1265.3 24.5 L1263.5 26.9 L1261.6 22.4 L1259.7 21.0 L1257.8 20.5 L1255.9 25.8 L1254.1 30.2 L1252.2 30.8 L1250.3 32.3 L1248.4 31.5 L1246.6 30.9 L1244.7 27.9 L1242.8 29.0 L1240.9 29.9 L1239.0 29.7 L1237.2 28.9 L1235.3 27.4 L1233.4 29.1 L1231.5 28.6 L1229.7 30.9 L1227.8 34.1 L1225.9 39.4 L1224.0 35.2 L1222.2 36.3 L1220.3 36.7 L1218.4 34.9 L1216.5 36.9 L1214.6 39.3 L1212.8 38.6 L1210.9 41.5 L1209.0 44.7 L1207.1 43.4 L1205.3 41.7 L1203.4 41.2 L1201.5 41.2 L1199.6 41.9 L1197.7 42.7 L1195.9 41.8 L1194.0 40.0 L1192.1 41.4 L1190.2 40.3 L1188.4 41.5 L1186.5 42.9 L1184.6 43.8 L1182.7 42.8 L1180.9 39.4 L1179.0 36.9 L1177.1 38.4 L1175.2 34.6 L1173.3 34.3 L1171.5 34.2 L1169.6 37.0 L1167.7 37.1 L1165.8 34.5 L1164.0 30.6 L1162.1 26.9 L1160.2 21.8 L1158.3 18.8 L1156.4 16.9 L1154.6 16.4 L1152.7 17.7 L1150.8 16.4 L1148.9 18.8 L1147.1 19.3 L1145.2 19.6 L1143.3 21.3 L1141.4 24.0 L1139.5 25.3 L1137.7 27.8 L1135.8 30.6 L1133.9 34.5 L1132.0 36.4 L1130.2 37.0 L1128.3 36.6 L1126.4 36.4 L1124.5 30.2 L1122.7 25.1 L1120.8 24.9 L1118.9 26.4 L1117.0 32.3 L1115.1 31.6 L1113.3 26.4 L1111.4 22.2 L1109.5 19.5 L1107.6 23.1 L1105.8 24.2 L1103.9 27.1 L1102.0 30.1 L1100.1 31.8 L1098.2 31.4 L1096.4 30.3 L1094.5 33.7 L1092.6 35.3 L1090.7 33.9 L1088.9 32.6 L1087.0 32.4 L1085.1 30.4 L1083.2 27.8 L1081.4 28.1 L1079.5 30.3 L1077.6 28.8 L1075.7 25.4 L1073.8 26.0 L1072.0 21.5 L1070.1 18.0 L1068.2 18.6 L1066.3 18.3 L1064.5 18.2 L1062.6 22.1 L1060.7 21.9 L1058.8 17.5 L1056.9 13.6 L1055.1 10.8 L1053.2 9.5 L1051.3 9.4 L1049.4 9.7 L1047.6 7.4 L1045.7 7.3 L1043.8 8.0 L1041.9 4.7 L1040.1 6.6 L1038.2 8.1 L1036.3 9.5 L1034.4 9.2 L1032.5 7.8 L1030.7 11.4 L1028.8 14.6 L1026.9 14.4 L1025.0 16.9 L1023.2 18.3 L1021.3 22.4 L1019.4 23.2 L1017.5 25.5 L1015.6 27.7 L1013.8 28.7 L1011.9 24.9 L1010.0 23.0 L1008.1 16.4 L1006.3 13.7 L1004.4 9.4 L1002.5 8.5 L1000.6 10.4 L998.7 11.5 L996.9 12.9 L995.0 16.6 L993.1 18.8 L991.2 20.2 L989.4 20.2 L987.5 19.5 L985.6 17.4 L983.7 15.0 L981.9 19.5 L980.0 22.9 L978.1 26.4 L976.2 25.4 L974.3 27.3 L972.5 29.6 L970.6 34.1 L968.7 40.2 L966.8 39.0 L965.0 38.4 L963.1 36.6 L961.2 37.6 L959.3 38.5 L957.4 36.0 L955.6 36.4 L953.7 36.6 L951.8 38.0 L949.9 37.4 L948.1 40.3 L946.2 44.2 L944.3 45.9 L942.4 46.6 L940.6 44.4 L938.7 44.7 L936.8 42.7 L934.9 43.7 L933.0 46.2 L931.2 47.8 L929.3 41.6 L927.4 37.6 L925.5 33.8 L923.7 27.7 L921.8 26.9 L919.9 28.6 L918.0 27.1 L916.1 27.3 L914.3 27.8 L912.4 23.7 L910.5 19.6 L908.6 18.7 L906.8 19.3 L904.9 21.2 L903.0 23.3 L901.1 24.0 L899.2 14.6 L897.4 16.6 L895.5 15.9 L893.6 16.4 L891.7 17.5 L889.9 18.9 L888.0 20.2 L886.1 20.4 L884.2 20.8 L882.4 24.6 L880.5 21.5 L878.6 19.2 L876.7 17.6 L874.8 18.9 L873.0 19.8 L871.1 18.0 L869.2 15.6 L867.3 13.2 L865.5 8.5 L863.6 6.1 L861.7 5.6 L859.8 3.8 L857.9 3.6 L856.1 0.0 L854.2 0.0 L852.3 0.0 L850.4 0.0 L848.6 0.0 L846.7 0.4 L844.8 1.9 L842.9 3.6 L841.1 4.6 L839.2 6.2 L837.3 6.2 L835.4 13.4 L833.5 14.1 L831.7 18.0 L829.8 17.8 L827.9 16.2 L826.0 17.5 L824.2 17.3 L822.3 20.4 L820.4 19.3 L818.5 14.2 L816.6 12.1 L814.8 10.4 L812.9 13.5 L811.0 12.7 L809.1 12.5 L807.3 14.9 L805.4 18.5 L803.5 22.5 L801.6 24.6 L799.7 29.3 L797.9 29.9 L796.0 29.9 L794.1 27.8 L792.2 27.8 L790.4 28.6 L788.5 28.0 L786.6 29.2 L784.7 30.5 L782.9 28.3 L781.0 23.1 L779.1 23.8 L777.2 21.4 L775.3 19.9 L773.5 22.7 L771.6 24.9 L769.7 26.0 L767.8 31.2 L766.0 30.1 L764.1 27.8 L762.2 25.6 L760.3 24.3 L758.4 23.5 L756.6 23.5 L754.7 23.8 L752.8 21.8 L750.9 21.3 L749.1 22.2 L747.2 20.9 L745.3 22.3 L743.4 23.2 L741.6 24.4 L739.7 24.4 L737.8 22.8 L735.9 24.6 L734.0 26.4 L732.2 22.9 L730.3 22.8 L728.4 22.4 L726.5 21.5 L724.7 21.0 L722.8 20.7 L720.9 19.5 L719.0 18.1 L717.1 12.6 L715.3 11.1 L713.4 6.5 L711.5 5.2 L709.6 2.4 L707.8 0.9 L705.9 2.6 L704.0 3.2 L702.1 4.0 L700.3 6.6 L698.4 8.2 L696.5 9.0 L694.6 10.2 L692.7 11.8 L690.9 13.3 L689.0 13.4 L687.1 13.6 L685.2 16.5 L683.4 20.3 L681.5 19.4 L679.6 20.9 L677.7 22.5 L675.8 23.6 L674.0 26.3 L672.1 19.5 L670.2 15.5 L668.3 13.7 L666.5 14.9 L664.6 16.6 L662.7 11.8 L660.8 8.1 L658.9 4.7 L657.1 4.2 L655.2 4.0 L653.3 6.8 L651.4 10.8 L649.6 10.5 L647.7 9.6 L645.8 6.5 L643.9 8.2 L642.1 8.9 L640.2 11.6 L638.3 14.6 L636.4 16.2 L634.5 10.8 L632.7 8.2 L630.8 9.3 L628.9 8.5 L627.0 12.4 L625.2 18.7 L623.3 22.5 L621.4 24.6 L619.5 28.8 L617.6 28.9 L615.8 28.0 L613.9 29.0 L612.0 30.1 L610.1 31.3 L608.3 31.8 L606.4 31.3 L604.5 29.1 L602.6 31.3 L600.8 32.5 L598.9 34.7 L597.0 38.3 L595.1 41.6 L593.2 44.7 L591.4 46.6 L589.5 48.3 L587.6 58.8 L585.7 59.5 L583.9 60.2 L582.0 62.9 L580.1 68.2 L578.2 74.4 L576.3 77.1 L574.5 78.3 L572.6 77.9 L570.7 74.9 L568.8 67.1 L567.0 68.2 L565.1 68.3 L563.2 71.2 L561.3 67.8 L559.4 65.5 L557.6 60.9 L555.7 55.6 L553.8 52.5 L551.9 53.2 L550.1 53.4 L548.2 55.1 L546.3 56.9 L544.4 59.8 L542.6 60.8 L540.7 60.4 L538.8 58.7 L536.9 58.4 L535.0 52.4 L533.2 45.8 L531.3 45.7 L529.4 47.7 L527.5 54.5 L525.7 58.6 L523.8 56.2 L521.9 55.9 L520.0 55.7 L518.1 61.1 L516.3 63.5 L514.4 63.9 L512.5 65.0 L510.6 64.9 L508.8 65.4 L506.9 64.9 L505.0 69.3 L503.1 76.5 L501.3 78.7 L499.4 79.9 L497.5 82.5 L495.6 87.3 L493.7 89.8 L491.9 93.5 L490.0 96.1 L488.1 95.1 L486.2 89.7 L484.4 90.9 L482.5 90.1 L480.6 88.1 L478.7 86.1 L476.8 84.0 L475.0 79.2 L473.1 79.3 L471.2 79.4 L469.3 75.7 L467.5 71.6 L465.6 67.2 L463.7 62.3 L461.8 58.2 L459.9 55.8 L458.1 53.1 L456.2 52.4 L454.3 54.5 L452.4 52.9 L450.6 54.6 L448.7 56.3 L446.8 58.5 L444.9 59.3 L443.1 58.0 L441.2 59.2 L439.3 63.0 L437.4 62.0 L435.5 65.6 L433.7 68.7 L431.8 74.4 L429.9 75.5 L428.0 74.7 L426.2 72.7 L424.3 71.2 L422.4 66.4 L420.5 65.6 L418.6 63.0 L416.8 62.8 L414.9 62.5 L413.0 62.0 L411.1 65.1 L409.3 65.8 L407.4 65.2 L405.5 65.4 L403.6 65.4 L401.8 65.0 L399.9 66.7 L398.0 69.8 L396.1 73.4 L394.2 77.2 L392.4 77.4 L390.5 78.4 L388.6 80.3 L386.7 77.3 L384.9 77.1 L383.0 79.9 L381.1 83.8 L379.2 90.9 L377.3 90.1 L375.5 87.1 L373.6 83.7 L371.7 81.4 L369.8 81.9 L368.0 77.9 L366.1 76.2 L364.2 74.7 L362.3 74.2 L360.5 72.8 L358.6 73.6 L356.7 78.9 L354.8 82.8 L352.9 88.3 L351.1 90.9 L349.2 95.6 L347.3 97.4 L345.4 99.1 L343.6 102.1 L341.7 105.5 L339.8 97.8 L337.9 95.4 L336.0 96.1 L334.2 92.2 L332.3 90.7 L330.4 92.3 L328.5 91.5 L326.7 91.7 L324.8 95.2 L322.9 94.7 L321.0 91.8 L319.1 90.3 L317.3 89.0 L315.4 88.2 L313.5 87.6 L311.6 86.5 L309.8 83.2 L307.9 83.5 L306.0 83.5 L304.1 83.9 L302.3 86.7 L300.4 89.6 L298.5 92.5 L296.6 93.7 L294.7 93.9 L292.9 98.9 L291.0 100.5 L289.1 101.1 L287.2 104.2 L285.4 107.9 L283.5 112.7 L281.6 112.6 L279.7 111.8 L277.8 112.8 L276.0 109.3 L274.1 105.3 L272.2 105.5 L270.3 103.1 L268.5 104.5 L266.6 101.1 L264.7 100.2 L262.8 98.8 L261.0 96.2 L259.1 94.4 L257.2 95.4 L255.3 95.6 L253.4 96.7 L251.6 97.7 L249.7 99.3 L247.8 98.9 L245.9 97.2 L244.1 95.2 L242.2 95.9 L240.3 94.4 L238.4 90.1 L236.5 90.5 L234.7 91.9 L232.8 97.4 L230.9 102.2 L229.0 99.7 L227.2 98.1 L225.3 94.8 L223.4 95.6 L221.5 95.5 L219.6 94.7 L217.8 97.5 L215.9 100.1 L214.0 102.4 L212.1 100.9 L210.3 102.2 L208.4 103.3 L206.5 105.2 L204.6 108.2 L202.8 111.5 L200.9 116.1 L199.0 116.1 L197.1 116.7 L195.2 117.0 L193.4 116.2 L191.5 110.5 L189.6 109.9 L187.7 106.8 L185.9 100.4 L184.0 97.2 L182.1 94.8 L180.2 91.3 L178.3 93.6 L176.5 96.8 L174.6 95.6 L172.7 93.2 L170.8 91.3 L169.0 89.6 L167.1 89.4 L165.2 90.4 L163.3 90.3 L161.5 89.5 L159.6 90.8 L157.7 88.5 L155.8 88.0 L153.9 88.0 L152.1 88.8 L150.2 88.9 L148.3 87.2 L146.4 86.3 L144.6 88.3 L142.7 84.5 L140.8 84.5 L138.9 84.8 L137.0 88.5 L135.2 89.7 L133.3 89.3 L131.4 88.6 L129.5 89.2 L127.7 87.1 L125.8 88.2 L123.9 89.0 L122.0 88.4 L120.2 88.4 L118.3 87.2 L116.4 91.3 L114.5 94.3 L112.6 96.0 L110.8 96.5 L108.9 94.7 L107.0 89.6 L105.1 85.1 L103.3 81.6 L101.4 80.2 L99.5 77.8 L97.6 75.4 L95.7 74.0 L93.9 74.6 L92.0 69.9 L90.1 65.5 L88.2 63.0 L86.4 59.5 L84.5 59.7 L82.6 55.5 L80.7 51.3 L78.8 51.3 L77.0 53.7 L75.1 59.8 L73.2 60.3 L71.3 61.6 L69.5 63.7 L67.6 66.8 L65.7 69.3 L63.8 70.9 L62.0 74.9 L60.1 75.1 L58.2 76.0 L56.3 75.0 L54.4 77.5 L52.6 79.4 L50.7 81.2 L48.8 84.8 L46.9 89.2 L45.1 88.7 L43.2 86.7 L41.3 88.0 L39.4 83.6 L37.5 80.3 L35.7 80.8 L33.8 80.4 L31.9 80.7 L30.0 84.5 L28.2 83.1 L26.3 77.1 L24.4 71.8 L22.5 68.1 L20.7 66.5 L18.8 66.2 L16.9 65.3 L15.0 60.6 L13.1 57.5 L11.3 54.7 L9.4 52.3 L7.5 53.9 L5.6 56.1 L3.8 58.4 L1.9 58.7 L0.0 57.0 Z' fill='%23000'/%3E%3C/svg%3E");
}

/* ---- the edition ---- */
/* ==========================================================================
   Zelcast, the edition. Built to shopify.com/editions/winter2026 as measured
   from its captures and CSS (review/reference-spec.md): the 50px bar with its
   chip links and pill, the one-fifth rail whose 340 x 464 square holds the
   title, subtitle and chapter list and flies to the top left on the first
   scroll, construction lines that change group per chapter, 140svh chapter
   heads with the name at 201.6px, the serif line with a script initial hanging
   into the gutter, the torn edge into the cream ground, the lighter paper of
   the product blocks with hairline buttons, sticky decks, quiet grids.
   Sizes, colours, durations and easings are the reference's own values.
   ========================================================================== */

:root {
  --white: #ffffff;
  --light: #ffffff;
  --ground: #ffffff;
  --paper: #ffffff;
  --dark: #000000;
  --black: #000000;
  --grey-dark: #6b6b6b;
  --grey-mid: #9b9b9b;
  --grey-light: #e6e6e6;
  --line: #e6e6e6;
  --gold: #d8a960;
  --focus: #739bff;
  --ring: #57afdf;
  --mont: "General Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
  --cigars: "Cormorant", "Cormorant Garamond", Georgia, serif;
  --script: "Cormorant", "Cormorant Garamond", Georgia, serif;
  --inter: "General Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
  --rail: clamp(252px, 20vw, 336px);   /* never narrower than the chapter list and its numerals (195px + overhang), so they never print on the copy */
  --gutter: clamp(12px, 1vw, 16px);
  --gap: clamp(12px, 1vw, 16px);
  --nav-h: 72px;
  --ease: cubic-bezier(.4, 0, .2, 1);
  --ease-out: cubic-bezier(0, 0, .2, 1);
  --ease-back: cubic-bezier(.34, 1.56, .64, 1);
  --fade-out-duration: .52s;
  --fade-out-easing: cubic-bezier(.25, .46, .45, .94);
  --lines-duration: 3s;
  --lines-easing: cubic-bezier(.34, .22, .47, .84);
  --lines-complete-duration: 1s;
  --lines-complete-easing: cubic-bezier(.72, .16, .19, .96);
  --lines-loading-duration: 6s;
  --lines-loading-easing: cubic-bezier(.45, .28, .34, .84);
  --fade-initial-delay: .2s;
  --scroll-state-duration: .6s;
  --scroll-state-easing: cubic-bezier(.41, .19, .13, .95);
  --hover-interaction-duration: .3s;
  --stagger-fade-in-delay: 75ms;
  --stagger-slide-delay: 20ms;
  --slide-duration: .6s;
  --slide-delay: .72s;
  --slide-easing: cubic-bezier(.72, .16, .19, .96);
  --cd: 0;
}
@media (max-width: 939px) { :root { --rail: 0px; --nav-h: 64px; --gutter: 12px; --gap: 12px; } }

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-padding-top: 60px; }
@media (min-width: 940px) { html { scroll-padding-top: 50px; } }
html.sheet-open { overflow: hidden; }
html.sheet-open body { overflow: hidden; touch-action: none; }
html.lenis, html.lenis body { height: auto; }
.lenis.lenis-smooth { scroll-behavior: auto !important; }
.lenis.lenis-stopped { overflow: hidden; }
body { margin: 0; background: var(--white); color: var(--dark); font-family: var(--mont); font-size: 14px; line-height: 1.1; -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; overflow-x: clip; transition: background-color .6s var(--ease); }
body { background: var(--white); }
html[data-paper] body { background: var(--ground); }
h1, h2, h3, h4, h5, h6, p, ul, ol, dl, dd, figure { margin: 0; }
img, video, svg, canvas { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
button { font: inherit; color: inherit; background: none; border: 0; padding: 0; cursor: pointer; }
::selection { background: var(--dark); color: var(--light); }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
a:focus-visible, button:focus-visible { outline: 1px solid var(--focus); outline-offset: -1px; box-shadow: 0 0 0 2px var(--ring); }
.wrap { position: relative; display: flow-root; }
#top { position: absolute; top: 0; }

/* ---- the reference's type scale ---- */
.headline-1 { font-family: var(--cigars); font-weight: 500; font-size: min(84px, 19vw); line-height: .92; letter-spacing: -.025em; text-wrap: pretty; text-box: trim-both cap alphabetic; }
.headline-2 { font-family: var(--cigars); font-style: italic; font-weight: 500; font-size: clamp(3rem, 12.5vw, 6.25rem); line-height: .92; letter-spacing: -.02em; text-wrap: pretty; text-box: trim-both cap alphabetic; }
.headline-3 { font-family: var(--cigars); font-weight: 500; font-size: 40px; line-height: .95; letter-spacing: -.02em; text-wrap: pretty; text-box: trim-both cap alphabetic; }
.headline-4 { font-family: var(--mont); font-weight: 600; font-size: 28px; line-height: .95; letter-spacing: -.03em; text-wrap: pretty; text-box: trim-both cap alphabetic; }
.headline-5 { font-family: var(--mont); font-weight: 600; font-size: 24px; line-height: .95; letter-spacing: -.02em; text-box: trim-both cap alphabetic; }
.headline-6 { font-family: var(--mont); font-weight: 600; font-size: 18px; line-height: .95; letter-spacing: -.02em; text-wrap: pretty; text-box: trim-both cap alphabetic; }
.narrative-1 { font-family: var(--cigars); font-weight: 500; font-size: 31px; line-height: .98; letter-spacing: -.03em; text-wrap: pretty; text-box: trim-both cap alphabetic; }
.narrative-2 { font-family: var(--cigars); font-weight: 500; font-size: clamp(27px, 23.6316px + .438597vw, 31px); line-height: 1; letter-spacing: -.03em; text-wrap: pretty; text-box: trim-both cap alphabetic; }
.narrative-3 { font-family: var(--cigars); font-weight: 500; font-size: 19px; line-height: 1; letter-spacing: -.02em; text-box: trim-both cap alphabetic; }
.narrative-4 { font-family: var(--cigars); font-weight: 500; font-size: 14px; line-height: 1.07; }
.bodycopy-1 { font-family: var(--mont); font-weight: 600; font-size: 16px; line-height: 1.1; text-box: trim-both cap alphabetic; }
.bodycopy-2 { font-family: var(--mont); font-weight: 600; font-size: 14px; line-height: 1.1; text-box: trim-both cap alphabetic; }
.text-label-1 { font-family: var(--inter); font-weight: 500; font-size: 14px; line-height: 1; letter-spacing: -.01em; }
.text-label-2 { font-family: var(--inter); font-weight: 400; font-size: 14px; line-height: 1.2; }
.drop-cap::first-letter { font-family: var(--script); font-style: italic; font-weight: 500; font-size: 1.85em; line-height: 0; letter-spacing: 0; margin-right: .04em; }
@media (min-width: 769px) {
  .headline-1 { font-size: clamp(7rem, 30px + 9.6vw, 11.75rem); }
  .headline-2 { font-size: clamp(6.25rem, 66.3158px + 4.38597vw, 8.75rem); }
  .headline-3 { font-size: clamp(3.375rem, 45.579px + 1.09649vw, 4rem); }
  .headline-4 { font-size: 32px; }
  .narrative-1 { font-size: clamp(2.2rem, 20.5263px + 1.85439vw, 3.3rem); }
  .bodycopy-1 { font-size: 14px; }
  .bodycopy-2 { font-size: 13px; }
}
@media (min-width: 940px) { .drop-cap { padding-left: var(--gutter); text-indent: calc(var(--gutter) * -1); transform: translateX(calc(var(--gutter) * -1)); } }

/* =========================================================================
   The top bar: 50px, 8 by 12 padding, chip links, a 34px pill, gradient
   scrims over solid blocks, items dropping in on load
   ========================================================================= */
.nav-wrap { position: fixed; z-index: 9999; left: 0; right: 0; top: 0; view-transition-name: navigation; }
@media print { .nav-wrap, .backdrop, .side, .davinci-lines__container, .cover { display: none; } }
.nav { position: relative; height: var(--nav-h); max-width: none; margin-inline: 0; padding: 10px 20px; display: flex; align-items: center; color: var(--white); font-family: var(--mont); transition: color .3s var(--ease), background-color .3s var(--ease); }
html[data-nav-theme="light"] .nav { color: var(--black); }
/* over paper a soft scrim of the page under the bar, so words scrolling up fade beneath it instead of crossing "Sign in" (the reference's solid scrim, light theme) */
@media (min-width: 940px) {
  .nav-wrap::after { content: ""; position: absolute; left: 0; right: 0; top: 0; height: var(--nav-h); z-index: -1; pointer-events: none; background: linear-gradient(to bottom, var(--paper) 30%, rgba(255, 255, 255, 0)); opacity: 0; transition: opacity .3s cubic-bezier(.4, 0, .2, 1); }
  html[data-nav-theme="light"][data-nav-bg="solid"] .nav-wrap::after { opacity: .9; }
}
@media (max-width: 374px) { .nav { padding: 10px; } }
@media (min-width: 940px) { .nav { padding: 12px 24px; transition-duration: 0s; } }
@media (min-width: 1080px) { .nav { padding: 12px 32px; } }
html[data-nav-immediate] .nav a, html[data-nav-immediate] .nav button, html[data-nav-immediate] .nav span { transition-duration: 0s !important; transition-delay: 0s !important; }
@media (max-width: 939px) {
  html[data-scrolled-page] .nav { background: var(--black); }
  html[data-scrolled-page][data-nav-theme="light"] .nav { background: var(--white); color: var(--black); }
}
.skip { position: absolute; left: 0; top: 0; z-index: 10; height: 100%; display: flex; align-items: center; padding-inline: 20px; background: var(--white); color: var(--black); translate: 0 -100%; transition: translate .15s var(--ease); font-family: var(--inter); font-size: 14px; font-weight: 500; }
.skip:focus-visible { translate: 0 0; }
.nav > div { font: inherit; }
.brand { display: flex; align-items: center; gap: 14px; padding-block: 5px; border-radius: 4px; }
.brand .word { font-weight: 500; font-size: 22px; line-height: 1; letter-spacing: -.03em; }
.brand .rule { width: 1px; height: 30px; background: currentColor; opacity: .35; }
.brand .lockup { display: flex; flex-direction: column; gap: 1px; font-size: 11px; font-weight: 500; line-height: 1.2; letter-spacing: -.005em; opacity: .85; }
.brand .lockup > span { white-space: nowrap; }
@media (min-width: 940px) { .brand { gap: 16px; } .brand .word { font-size: 28px; } .brand .rule { height: 36px; } .brand .lockup { font-size: 13px; } }
@media (max-width: 600px) { .nav ul.right { gap: 12px; } .nav .pill { padding-inline: 14px; height: 38px; } .brand { gap: 10px; } .brand .rule, .brand .lockup { display: none; } }   /* phones: the wordmark and the mark only; the label, the pill and the menu do not fit together in 390px */
/* the text links turn on a cube: the label rolls down and its twin rolls in from above */
.flip { --fh: 20px; perspective: 500px; }
.flip .faces { position: relative; display: block; height: var(--fh); line-height: var(--fh); transform-style: preserve-3d; transition: transform .55s cubic-bezier(.2, .8, .2, 1); }
.flip .face { display: block; height: var(--fh); line-height: var(--fh); white-space: nowrap; backface-visibility: hidden; transform: translateZ(calc(var(--fh) / 2)); }
.flip .face.top { position: absolute; inset: 0; transform: rotateX(90deg) translateZ(calc(var(--fh) / 2)); }
@media (hover: hover) and (prefers-reduced-motion: no-preference) { .flip:hover .faces, .flip:focus-visible .faces { transform: rotateX(-90deg); } }
.nav ul { list-style: none; margin: 0; padding: 0; display: flex; align-items: center; }
.nav ul.left { display: none; margin-left: auto; gap: 8px; }
.nav ul.right { margin-left: auto; gap: 10px; }
@media (min-width: 375px) { .nav ul.right { gap: 20px; } }
@media (min-width: 940px) { .nav ul.right { margin-left: 12px; gap: 8px; } }
@media (min-width: 940px) { .nav ul.left { display: flex; } .nav li.phone { display: none; } }
@media (max-width: 939px) { .nav li.desk { display: none; } }
.navButton { display: inline-flex; align-items: center; gap: 5px; min-height: 34px; padding: 5px 12px; border-radius: 4px; font-size: 15px; font-weight: 500; letter-spacing: -.01em; transition: color .3s var(--ease); }
@media (hover: hover) {
  .pill:hover { background: #f4f4f4; }
  .pill:hover i { translate: 2px -2px; }
  html[data-nav-theme="light"] .nav .pill:hover { background: #2a2a2a; }
}
.pill { display: inline-flex; align-items: center; justify-content: center; gap: 12px; height: 40px; padding: 0 18px; border-radius: 4px; background: var(--white); color: var(--black); white-space: nowrap; font-size: 15px; font-weight: 500; letter-spacing: -.01em; transition: color .3s var(--ease), background-color .3s var(--ease); }
.pill i { display: grid; place-items: center; width: 12px; height: 12px; transition: translate .3s var(--ease); }
.pill i svg { width: 11px; height: 11px; }
@media (min-width: 940px) { .pill { height: 48px; padding: 0 22px; gap: 34px; } }
footer .pill { border-radius: 4px; height: 40px; padding: 0 18px; gap: 6px; }   /* the bar's button shape, not a capsule */
.pill:active { background: #f4f4f4; }
html[data-nav-theme="light"] .nav .pill { background: var(--black); color: var(--white); }
html[data-nav-theme="light"] .nav .pill:active, html[data-nav-theme="light"] .nav .pill:focus { color: var(--light); background: var(--black); }
.nav .menu { display: inline-flex; align-items: center; justify-content: center; width: 24px; height: 24px; position: relative; }
.nav .menu span { position: absolute; left: 1px; right: 1px; height: 2px; background: currentColor; top: 6.5px; transition: transform .3s var(--ease), top .3s var(--ease); }
.nav .menu span:last-of-type { top: 15.5px; }
html.sheet-open .nav .menu span { top: 11px; transform: rotate(45deg); }
html.sheet-open .nav .menu span:last-of-type { transform: rotate(-45deg); }
@media (min-width: 940px) and (prefers-reduced-motion: no-preference) {
  html.js:not(.still) .nav > div, html.js:not(.still) .nav > ul > li { translate: 0 -100%; opacity: 0; animation: nav-item-in 1s cubic-bezier(.13, .46, .15, .92) forwards; animation-delay: var(--d, 500ms); }
}
@keyframes nav-item-in { 0% { opacity: 0; transform: translateY(-100%); } to { opacity: 1; transform: translateY(100%); } }
.mobile-menu { position: absolute; top: var(--nav-h); left: 0; width: 100%; display: grid; grid-template-rows: 0fr; transition: grid-template-rows .3s var(--ease-out); overflow: clip; background: var(--black); color: var(--light); }
html.sheet-open .mobile-menu { grid-template-rows: 1fr; }
html[data-nav-theme="light"] .mobile-menu { background: var(--white); color: var(--black); }
.mobile-menu > div { overflow: hidden; }
.mobile-menu .scroller { height: calc(100dvh - var(--nav-h)); overflow-y: auto; scrollbar-width: none; padding-inline: 20px; }
.mobile-menu .scroller::-webkit-scrollbar { display: none; }
.mobile-nav-list { list-style: none; margin: 0; padding: 0; counter-reset: mobile-item; }
.mobile-nav-list li { position: relative; border-top: 1px solid rgba(255, 255, 255, .1); }
.mobile-nav-list li:last-child { border-bottom: 1px solid rgba(255, 255, 255, .1); }
html[data-nav-theme="light"] .mobile-nav-list li { border-color: rgba(41, 41, 25, .1); }
.mobile-nav-list a { display: block; padding-block: 20px; font-family: var(--mont); font-weight: 600; font-size: 24px; line-height: .95; letter-spacing: -.48px; }
.mobile-nav-list li::after { counter-increment: mobile-item; content: counters(mobile-item, ".", upper-roman); position: absolute; right: 0; top: 50%; translate: 0 -50%; font-family: var(--cigars); font-size: 20px; line-height: .97; letter-spacing: -.8px; color: rgba(255, 255, 255, .6); }
html[data-nav-theme="light"] .mobile-nav-list li::after { color: rgba(41, 41, 25, .6); }
.mobile-menu .foot { margin: 20px 0 30px; display: grid; gap: 12px; justify-items: start; }
.mobile-menu .foot .tagline { margin-bottom: 6px; font-family: var(--inter); font-size: 15px; font-weight: 500; letter-spacing: -.01em; opacity: .85; }
@media (min-width: 640px) { .mobile-menu .mobile-nav-list, .mobile-menu .foot, .mobile-menu .global { max-width: 369px; } .mobile-menu .foot { margin-bottom: 40px; } }
.mobile-menu .scroller { overscroll-behavior: contain; }
.mobile-menu .foot a:hover { text-decoration: underline; }
.mobile-menu .global { list-style: none; margin: 0; padding: 20px 0; }
.mobile-menu .global a { display: flex; justify-content: space-between; gap: 5px; width: 100%; padding: 20px; border-bottom: 1px solid rgba(128, 128, 128, .3); font-family: var(--inter); font-size: 16px; font-weight: 500; }
.mobile-menu .global li:first-child a { border-top: 1px solid rgba(128, 128, 128, .3); }
@media (min-width: 940px) { .mobile-menu { display: none; } }
.backdrop { position: fixed; inset: 0; z-index: 9990; background: var(--black); opacity: 0; pointer-events: none; transition: opacity .3s var(--ease); }
html.sheet-open .backdrop { opacity: 0; pointer-events: auto; }
@media (min-width: 940px) { .backdrop { display: none; } }

/* =========================================================================
   The side and the lines
   ========================================================================= */
/* the box forms: hairlines from all over the screen swing in and meet as its four sides, then give way to the drawn border */
.davinci-lines__container { pointer-events: none; aspect-ratio: 340 / 464; width: min(340px, 100vw - 24px); translate: -50% -50%; padding: 20px; position: fixed; top: 50svh; left: 50%; container-type: size; z-index: 95; }
.davinci-lines__container .w55 { width: 55%; }
.davinci-lines__title { color: var(--light); opacity: 0; translate: 0 calc(235px - 50%); }
.davinci-lines { color: var(--light); }
html[data-nav-theme="light"] .davinci-lines { color: var(--grey-mid); }
.davinci-lines.big { position: fixed; inset: 0; width: 100%; height: 100%; overflow: visible; display: none; }
.davinci-lines rect { stroke: currentColor; stroke-width: 1px; fill: none; }
.davinci-lines .dash { fill: currentColor; opacity: .2; stroke: none; }
.davinci-lines path, .davinci-lines circle { stroke: #ffffff26; stroke-width: .4px; stroke-dasharray: 1; stroke-dashoffset: 1px; fill: none; transform-box: fill-box; transform-origin: 50%; }
.davinci-lines .rotate-45 { rotate: 45deg; }
.davinci-lines .-rotate-45 { rotate: -45deg; }
.davinci-lines :is(circle, path) { transition: stroke-dashoffset var(--lines-duration) var(--lines-easing), stroke var(--lines-duration) var(--lines-easing) calc(var(--lines-duration) * .7); }
.davinci-lines[data-active="1"] [data-group*="1"], .davinci-lines[data-active="2"] [data-group*="2"], .davinci-lines[data-active="3"] [data-group*="3"], .davinci-lines[data-active="4"] [data-group*="4"], .davinci-lines[data-active="5"] [data-group*="5"], .davinci-lines[data-active="6"] [data-group*="6"], .davinci-lines[data-active="7"] [data-group*="7"], .davinci-lines[data-active="8"] [data-group*="8"] { stroke-dashoffset: 0; }
.davinci-lines[data-animating="1"] [data-group*="1"], .davinci-lines[data-animating="2"] [data-group*="2"], .davinci-lines[data-animating="3"] [data-group*="3"], .davinci-lines[data-animating="4"] [data-group*="4"], .davinci-lines[data-animating="5"] [data-group*="5"], .davinci-lines[data-animating="6"] [data-group*="6"], .davinci-lines[data-animating="7"] [data-group*="7"], .davinci-lines[data-animating="8"] [data-group*="8"] { animation: 4s ease-out forwards line-fade; }
.davinci-lines[data-active="1"] [data-dashed*="1"], .davinci-lines[data-active="6"] [data-dashed*="6"], .davinci-lines[data-active="7"] [data-dashed*="7"], .davinci-lines[data-active="8"] [data-dashed*="8"] { stroke: url(#dashed-stroke); }
.davinci-lines[data-active="1"] [data-dashed-v*="1"], .davinci-lines[data-active="2"] [data-dashed-v*="2"] { stroke: url(#dashed-stroke-vertical); }
@keyframes line-fade { 0% { stroke: #ffffffbf; } to { stroke: #ffffff26; } }
@media (prefers-reduced-motion: no-preference) { .davinci-lines__loader, .davinci-lines__complete { stroke-dashoffset: 1px; stroke-dasharray: 1; } }
.davinci-lines__loader { animation: load-lines var(--lines-loading-duration) both var(--lines-loading-easing); animation-play-state: paused; transition: opacity var(--fade-out-duration) var(--fade-out-easing); }
[data-initiated="true"] .davinci-lines__loader { animation-play-state: running; }
@keyframes load-lines { to { stroke-dashoffset: .2px; } }
.davinci-lines__complete { transition-property: opacity, stroke-dashoffset; transition-duration: var(--fade-out-duration), var(--lines-complete-duration); transition-timing-function: var(--fade-out-easing), var(--lines-complete-easing); }
[data-sidebar-loaded="true"] .davinci-lines__complete { stroke-dashoffset: 0; }
[data-sidebar-loaded="true"] :is(.davinci-lines__loader, .davinci-lines__complete) { transition-delay: var(--lines-complete-duration), 0s; }
@media (prefers-reduced-motion: no-preference) { [data-initiated="true"][data-sidebar-ready="true"] .davinci-lines__loader, [data-initiated="true"][data-sidebar-ready="true"] .davinci-lines__complete { transition-delay: 0s; transition-duration: var(--fade-out-duration); } }
[data-initiated="true"][data-sidebar-ready="true"] .davinci-lines__loader, [data-initiated="true"][data-sidebar-ready="true"] .davinci-lines__complete, [data-initiated="true"][data-sidebar-ready="true"] .davinci-lines__title { opacity: 0; }
[data-scrolled="true"][data-initiated="true"]:not([data-sidebar-ready="true"]) .davinci-lines__title { opacity: 1; animation: fade-in var(--fade-out-duration) var(--fade-out-easing) backwards var(--fade-initial-delay); }
@keyframes fade-in { 0% { opacity: 0; } to { opacity: 1; } }
@keyframes stagger-fade-in { 0% { opacity: 0; } to { opacity: 1; } }

.side { padding: 12px var(--gutter); width: 20%; max-width: 336px; position: absolute; top: 0; bottom: 0; left: 0; z-index: 100; height: 100svh; pointer-events: none; color: var(--white); }
@media (min-width: 940px) { .side { position: fixed; } }
.side { transition: opacity .35s var(--ease); }
html[data-foot] .side { opacity: 0; }
/* the rail stays at the left edge on every width; the page is fluid, not a centred 1680px column */
.side .nav-box { position: absolute; top: 50%; left: 50vw; translate: -50% -50%; display: flex; flex-direction: column; justify-content: space-between; padding: 20px; z-index: 10; aspect-ratio: 340 / 464; width: min(340px, calc(100vw - 24px)); }
@media (orientation: landscape) and (max-height: 600px) { .side .nav-box { top: 90px; translate: -50% 0; } }
@media (orientation: portrait) and (max-width: 600px) { .side .nav-box { top: calc(var(--nav-h) + 14px); translate: -50% 0; width: calc(100vw - 24px); aspect-ratio: auto; height: calc(100svh - var(--nav-h) - 26px); } }   /* phones: the frame is the screen, 12px in. Centred at 340 by 464 its lines crossed a face at common heights (the cover's faces sit at fixed fractions of a portrait screen); at the edges they cross none, and the copy sits at the foot below the seated man */
.side .border-box { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; pointer-events: none; }
.side .border-box svg { width: 100%; height: 100%; overflow: visible; }
.davinci-lines__border { opacity: 0; }
.side h1.title-link { display: inline-block; width: 62%; cursor: pointer; }
.side h1.title-link a { color: var(--light); pointer-events: auto; display: block; transition: color .3s var(--ease); }
html[data-title-theme="light"] .side h1.title-link a { color: var(--dark) !important; }
.side .title { display: block; transform-origin: 0 0; }
.side .title .title__word--slide { display: inline-block; }
@media (prefers-reduced-motion: no-preference) {
  [data-scrolled="false"][data-initiated="true"]:not([data-sidebar-ready="true"]) .title .title__word--slide { animation: slide var(--slide-duration) var(--slide-delay) var(--slide-easing) both; }
  [data-sidebar-ready="true"] .side .title { transition: opacity var(--hover-interaction-duration) cubic-bezier(.215, .61, .355, 1), translate var(--hover-interaction-duration) cubic-bezier(.25, .46, .45, .94), scale var(--scroll-state-duration) var(--scroll-state-easing); }
  [data-sidebar-ready="true"] .side h1.title-link a:is(:hover, :focus-visible) .title { translate: -6px 0; opacity: .7; }
}
@keyframes slide { 0% { translate: -100% 0; opacity: 0; } }
.side .lower { min-width: 0; }
.side .subtitle { max-width: 300px; margin-top: 10px; text-wrap: balance; opacity: 0; color: var(--light); }
.side ul { list-style: none; margin: 20px 0 0; padding: 0; width: 100%; max-width: 100%; counter-reset: nav-item; pointer-events: none; }
.side li { align-items: center; width: 100%; display: flex; position: relative; }
.side li a { align-items: flex-end; gap: .125rem; width: 100%; display: flex; position: relative; padding: 2px 0; color: var(--white); pointer-events: auto; justify-content: space-between; }
.side li a > span { align-items: center; gap: 5px; width: 100%; display: flex; }
.side li a > span > span { flex: 0 0 auto; display: block; text-underline-offset: 0; text-decoration-skip-ink: none; text-underline-position: from-font; text-decoration-thickness: .08em; text-box: trim-both cap alphabetic; transition: color .3s var(--ease); }
.side li a > span::after { content: ""; clip-path: inset(0 100% 0 0); background-image: linear-gradient(270deg, #fff 1px, #fff0 1px); background-position: 50%; background-repeat: repeat-x; background-size: 3px 30%; width: 100%; height: 1px; transition: clip-path .3s var(--ease) .15s; transform: translateY(3px); }
.side li a::after { pointer-events: none; color: rgba(255, 255, 255, .6); font-family: var(--cigars); font-weight: 600; font-size: .8125rem; line-height: 1; counter-increment: nav-item; content: counters(nav-item, ".", upper-roman); white-space: nowrap; text-box: trim-both cap alphabetic; transition: color .3s var(--ease); }
.side li a:hover > span > span { text-decoration-line: underline; transition-delay: 0s; color: var(--white) !important; }
.side li a:hover > span::after { clip-path: inset(0); }
.side li a:hover::after { transition-delay: .3s; color: var(--white) !important; }
.side li.sidebar-link-active a > span > span { color: var(--white); text-decoration-line: none; }
.side li.sidebar-link-active a > span::after { clip-path: inset(0); }
.side li.sidebar-link-active a::after { color: var(--white); }
[data-sidebar-ready="true"] .side ul:has(.sidebar-link-active) li:not(.sidebar-link-active) a > span > span { color: rgba(247, 247, 238, .6); }
html[data-sidebar-theme="light"] .side li a { color: rgba(41, 41, 25, .6); }
html[data-sidebar-theme="light"] [data-sidebar-ready="true"] .side ul:has(.sidebar-link-active) li:not(.sidebar-link-active) a > span > span { color: rgba(41, 41, 25, .6); }
html[data-sidebar-theme="light"] .side li a > span::after { background-image: linear-gradient(270deg, #000 1px, #0000 1px); }
html[data-sidebar-theme="light"] .side li a::after { color: rgba(41, 41, 25, .6); }
html[data-sidebar-theme="light"] .side li.sidebar-link-active a > span > span, html[data-sidebar-theme="light"] .side li.sidebar-link-active a::after { color: var(--dark) !important; }
html[data-sidebar-theme="light"] .side li a:hover > span > span, html[data-sidebar-theme="light"] .side li a:hover::after { color: var(--dark) !important; }
html[data-sidebar-theme="light"] .side .subtitle { color: var(--dark); }
html[data-sidebar-immediate] .side li a, html[data-sidebar-immediate] .side li a > span > span, html[data-sidebar-immediate] .side li a > span::after, html[data-sidebar-immediate] .side li a::after, html[data-title-immediate] .side h2 a { transition-duration: 0s !important; transition-delay: 0s !important; }
.side .anchors { display: none; flex-direction: column; justify-content: space-between; height: 100%; gap: 4px; width: 100%; padding-top: 60px; }
@media (min-width: 940px) { .side .anchors { display: flex; } }
.side .terms { position: relative; margin-top: 25px; color: var(--light); pointer-events: auto; transition: color .3s var(--ease); opacity: 0; }
html[data-sidebar-theme="light"] .side .terms { color: var(--dark) !important; }
.side .terms .tiny { font-family: var(--cigars); font-weight: 500; font-size: 14px; line-height: 1; text-box: trim-both cap alphabetic; }
.side .terms .tiny.t1 { margin-top: 4px; }
.side .terms .tiny.t2 { margin-top: 5px; }
.side .terms a:hover { text-decoration: underline; }
[data-section-name="side-and-lines"] :is(li, h1.title-link, .terms) { opacity: 0; }
[data-scrolled="false"][data-initiated="true"]:not([data-sidebar-ready="true"]) h1.title-link { translate: 0 calc(235px - 50%); animation: fade-in var(--fade-out-duration) var(--fade-out-easing) both var(--fade-initial-delay); }
[data-initiated="true"][data-sidebar-ready="true"] :is(li, h1.title-link, .subtitle) { opacity: 1; }
[data-initiated="true"][data-sidebar-ready="true"] .davinci-lines__border { opacity: 1; }
[data-initiated="true"][data-sidebar-ready="true"] .davinci-lines__border { transition: opacity var(--fade-out-duration) var(--fade-out-easing); }
[data-initiated="true"][data-sidebar-ready="true"] .terms { transition: opacity var(--fade-out-duration) var(--fade-out-easing), color .3s var(--ease); }
@media (prefers-reduced-motion: no-preference) {
  [data-initiated="true"][data-sidebar-ready="true"] :is(ul, li, h1.title-link, .subtitle) { transition-duration: var(--scroll-state-duration); transition-timing-function: var(--scroll-state-easing); }
  [data-initiated="true"][data-sidebar-ready="true"] ul { transition-property: translate, width; }
  [data-initiated="true"][data-sidebar-ready="true"] :is(li, h1.title-link) { transition-property: translate, opacity; }
  [data-initiated="true"][data-sidebar-ready="true"] .subtitle { transition-property: opacity; }
  [data-initiated="true"][data-sidebar-ready="true"] li { transition-delay: calc(var(--index, 0) * var(--stagger-slide-delay)); animation: stagger-fade-in var(--scroll-state-duration) var(--scroll-state-easing) both; animation-delay: calc(var(--index, 0) * var(--stagger-fade-in-delay)); }
}
@media (prefers-reduced-motion: reduce) {
  [data-initiated="true"][data-sidebar-ready="true"] li { animation: none; opacity: 1; }
  .main, .side *, .davinci-lines * { transition: none !important; animation: none !important; }
}
[data-sidebar-loaded="true"] .terms { opacity: 0; }
html[data-at-end] [data-scrolled="true"][data-sidebar-ready="true"] .terms { opacity: 1; }   /* only once the footer is up */
[data-scrolled="true"][data-sidebar-ready="true"] .side .subtitle, [data-scrolled="true"][data-sidebar-ready="true"] .side .davinci-lines__border { opacity: 0; }
/* the landed rail shares the bar's left edge: 24px from 940, 32px from 1080 */
@media (min-width: 940px) {
  .side { padding-inline: 24px; }
  [data-scrolled="true"][data-initiated="true"] ul { translate: 0 calc(50svh - 293px); width: 195px; }
  [data-scrolled="true"][data-initiated="true"] li { translate: calc(-50vw + 182px - .5rem) 0; }
  [data-scrolled="true"][data-initiated="true"] h1.title-link { translate: calc(-50vw + 182px - .5rem) calc(-50svh + 296px); }
  [data-scrolled="true"][data-initiated="true"] .title { scale: 75%; }
}
@media (min-width: 1080px) {
  .side { padding-inline: 32px; }
  [data-scrolled="true"][data-initiated="true"] li { translate: calc(-50vw + 190px - .5rem) 0; }
  [data-scrolled="true"][data-initiated="true"] h1.title-link { translate: calc(-50vw + 190px - .5rem) calc(-50svh + 296px); }
}
@media (max-width: 939px) {
  .side { width: 100vw; max-width: none; }
  .davinci-lines__container { position: absolute; z-index: 5; }
  .davinci-lines.big { position: absolute; }
}
html[data-sidebar-immediate-all] .side *, html[data-sidebar-immediate-all] .davinci-lines__container * { transition-duration: 0s !important; transition-delay: 0s !important; animation-duration: 0s !important; animation-delay: 0s !important; }
html:not(.js) [data-section-name="side-and-lines"] :is(li, h1.title-link, .subtitle, .terms) { opacity: 1; }
html:not(.js) .davinci-lines__container { display: none; }

/* ---- the cover behind everything ---- */
.cover { position: fixed; inset: 0; z-index: 0; background: var(--black); overflow: hidden; }
.cover img, .cover video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 50% 50%; }
html.gl .cover > img, html.js:not(.nogl) .cover > img { opacity: 0; }   /* the room paints itself; the still plate never flashes first */
.cover img.depth, .head .art img.depth { position: absolute; width: 2px; height: 2px; opacity: 0; pointer-events: none; }
.cover-fg { position: fixed; inset: 0; z-index: 0; pointer-events: none; overflow: hidden; }
.cover-fg img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 50% 50%; opacity: 0; transition: opacity .6s var(--ease); scale: 1.053; translate: calc(var(--px, 0) * -30px) calc(var(--py, 0) * -18px); }
.cover-fg.fg-on img { opacity: 1; }
html.gl .cover-fg.fg-on img { opacity: var(--fga, 0); transition: none; }
.cover-fg.gone { visibility: hidden; }
.cover video { opacity: 0; transition: opacity 1s var(--ease); }
.cover video.ready { opacity: 1; }
.cover .lineart { opacity: 1; transition: opacity 1s var(--ease); z-index: 2; }
html.gl .cover .lineart, html.js:not(.nogl) .cover .lineart { opacity: 0; transition: none; }   /* the room draws its own traces; no still outline flashes first */
.cover.resolved .lineart { opacity: 0; }
.cover::after { content: ""; position: absolute; inset: 0; background: rgba(0, 0, 0, var(--cd)); pointer-events: none; z-index: 3; }
.cover.gone, .cover.gone canvas.gl { visibility: hidden; }
/* the cover stays fixed and inset 0 on phones too: it fills the viewport even as the browser's toolbar comes and goes, and there is no white between the hero and the first room */

/* the art layer: when the shader is drawing, the pictures beneath step back */
.cover canvas.gl, .head .art canvas.gl { position: absolute; inset: 0; width: 100% !important; height: 100% !important; z-index: 2; pointer-events: none; visibility: hidden; }
.cover.gl-on canvas.gl, .head .art.gl-on canvas.gl { visibility: visible; }
.cover.gone canvas.gl { visibility: hidden; }
.cover.gl-on > img, .cover.gl-on > video, .head .art.gl-on .pin > img, .head .art.gl-on .pin > video { opacity: 0 !important; }
.cover.gl-on::after { z-index: 3; }

/* ---- the chapters ---- */
.main { position: relative; z-index: 1; margin-top: 150svh; opacity: 1; transition: opacity var(--fade-out-duration) var(--fade-out-easing); }
html.js [data-initiated="true"]:not([data-sidebar-ready="true"]) ~ .main, html.js [data-initiated="false"] ~ .main { opacity: 0; }
/* the failsafe: if the scripts never hand over (blocked, failed, too old a browser), the page is shown as a still page after 7s */
html.failsafe :is(.main, .nav, .nav > div, .nav > ul > li, .side .title .ii, .side .subtitle, .side .terms, .side li, .side h1.title-link) { opacity: 1 !important; translate: none !important; transform: none !important; animation: none !important; }
html.failsafe .side { position: absolute; height: 100svh; }
.chapter { position: relative; display: flex; justify-content: flex-end; color: var(--light); pointer-events: none; }
.chapter > .inner { position: relative; width: 100%; }
@media (min-width: 940px) { .chapter > .inner { width: calc(100% - var(--rail)); } }
/* past the bar's 1680px measure the bar centres, so the rail lands further in; the content column moves with it */
@media (min-width: 2000px) { :root { --rail: 18vw; } }
.head { position: relative; min-height: 70svh; display: flex; flex-direction: column; justify-content: flex-end; padding-inline: 22px; padding-bottom: 40px; }   /* room for the drawn frame beside the words */
@media (min-width: 769px) { .head { min-height: 140svh; box-sizing: content-box; justify-content: center; padding-inline: 70px; padding-bottom: 235px; } }
@media (min-width: 940px) { .head { padding-inline: 44px 0; } }   /* the chapter's frame is drawn 34px out from its words: this keeps it off the rail */
/* the previous paper tears away to let the next painting in */
.head[data-enter]::before { content: ""; position: absolute; left: 0; right: 0; top: -1px; height: 96px; background: var(--enter, var(--paper)); -webkit-mask: var(--tear) center bottom / 100% 96px no-repeat; mask: var(--tear) center bottom / 100% 96px no-repeat; transform: scaleY(-1); transform-origin: 50% 48px; z-index: 1; pointer-events: none; }
.head[data-enter]::after { content: ""; position: absolute; left: 0; right: 0; top: 1px; height: 96px; background: #fffef6; -webkit-mask: var(--fibre) center bottom / 100% 96px no-repeat; mask: var(--fibre) center bottom / 100% 96px no-repeat; transform: scaleY(-1); transform-origin: 50% 48px; z-index: 1; pointer-events: none; }
.head[data-enter="ground"] { --enter: var(--ground); }
@media (min-width: 940px) { .head[data-enter]::before, .head[data-enter]::after { left: calc(-1 * var(--rail)); } }
.head .art { position: absolute; left: calc(-1 * var(--rail)); right: 0; top: 0; bottom: 0; }
.head .art .pin { position: sticky; top: 0; height: 100%; width: 100%; overflow: hidden; }
@media (min-width: 769px) { .head .art { top: -100svh; } .head .art .pin { height: 100svh; } .head[data-burst-lead] .art { top: -200svh; } }
/* phones: the same machine at one screen. the room opens over the last screen before it, holds while the title rises, and the paper tears up over it */
/* phones: the hero box and the chapter list fade away once scrolling starts, so nothing rides over the rooms */
@media (max-width: 768px) { .side { transition: opacity .45s var(--ease); } html[data-scrolled-page] .side { opacity: 0; pointer-events: none; } }
@media (max-width: 768px) { .head { min-height: 130svh; padding-bottom: 150px; } .ground .inset .title { padding: 28px 0 40px; } .head .art, .head[data-burst-lead] .art, .head .fgwrap { top: -100svh; } .head .art .pin, .head .fgwrap .pin { height: 100svh; } }
/* a bursting head wears the colour of the panel before it, so nothing shows around the hole as it arrives: black after the network, paper after the steps and the council */
#engineers .head[data-burst-lead] { background: var(--black); }
#companies .head[data-burst-lead], #conviction .head[data-burst-lead] { background: var(--white); }
.head[data-burst-lead]::before { content: ""; position: absolute; top: 0; bottom: 0; left: calc(-1 * var(--rail)); width: var(--rail); background: inherit; }   /* and the strip under the rail beside it */   /* the room's canvas already covers the screen while the panel before it is held */
html:not(.gl) .head .art { top: 0; background: var(--black); }
/* the cut-out plane above the name */
.head .fgwrap { position: absolute; left: calc(-1 * var(--rail)); right: 0; top: 0; bottom: 0; z-index: 3; pointer-events: none; }
.head .fgwrap .pin { position: sticky; top: 0; height: 100%; width: 100%; overflow: hidden; }
@media (min-width: 769px) { .head .fgwrap { top: -100svh; } .head .fgwrap .pin { height: 100svh; } }
.head .fgwrap img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: var(--pos, 50% 50%); opacity: 0; transition: opacity .6s var(--ease); scale: 1.053; translate: calc(var(--px, 0) * -30px) calc(var(--py, 0) * -18px); }
.head .fgwrap.fg-on img { opacity: 1; }
html.gl .head .fgwrap.fg-on img { opacity: var(--fga, 0); transition: none; }
html.gl .torn { z-index: auto; }
.head .art img, .head .art video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: var(--pos, 50% 50%); }
.head .art .pin > img.plate, .cover > img.plate { scale: 1.04; translate: calc(var(--px, 0) * -12px) calc(var(--py, 0) * -8px); }
.head .art video { opacity: 0; transition: opacity .3s var(--ease); }
.head .art video.ready { opacity: 1; }
.head .art .lineart { transition: opacity 1s var(--ease); z-index: 2; }
html.gl .head .art .lineart { opacity: 0; transition: none; }   /* under WebGL the room draws its own traces; the still line drawing never shows */
html.gl .head .art canvas.gl { visibility: visible; opacity: 0; transition: opacity .6s var(--ease); }
html.gl .head .art.gl-on canvas.gl { opacity: 1; }
html.gl .head .art .pin > img.plate { transition: opacity .6s var(--ease); }   /* the photo hands over to the room in a crossfade */
/* under WebGL a room only ever appears through its own opening: its photograph never paints while the canvas warms up. A room's box rides
   a screen or two above its head, so the first room's photo (its soft placeholder) showed across the bottom half of the hero on a reload,
   cut at the middle of the screen. If the GL context is lost (gl-lost) the photograph is the fallback again */
html.gl .head .art:not(.gl-on):not(.gl-lost) .pin > img.plate, html.gl .head .art:not(.gl-on):not(.gl-lost) .pin > video { opacity: 0; transition: none; }
.head h2 { z-index: 2; }
.head .art.resolved .lineart { opacity: 0; }
.head h2 { position: relative; z-index: 1; padding-block: 40px; transition: opacity .3s var(--ease); }
@media (min-width: 769px) { .head h2 { flex: 1 1 auto; display: flex; flex-direction: column; justify-content: center; padding-block: 130px; } }
/* the title holds in the painting's lower band (the desk, the ice, the floor) while its room plays, then the tear carries it away: scrolling straight up
   the picture it crossed every face on the way. Below 940px the holder steps out of the layout and the title scrolls as it did */
.head .titles { display: contents; }
@media (min-width: 940px) {
  .head { justify-content: flex-start; }
  .head .titles { position: sticky; top: 0; z-index: 1; height: 100svh; display: flex; flex-direction: column; justify-content: flex-start; padding-top: var(--title-y, 60svh); box-sizing: border-box; }
  .head .titles h2 { flex: none; display: block; padding-block: 0; }
  .head .titles .lead { margin: clamp(48px, 1rem + 3.4vw, 72px) 0 0; }   /* clear of the title's descenders */
}
.head h2 span { display: block; }
.head h2 > span, .head .lead { filter: opacity(var(--nf, 1)); }   /* the chapter title fades as it reaches the bar (main.js writes --nf), as its drawn frame does */
.head .lead { position: relative; z-index: 1; width: 100%; margin-bottom: 70px; }
@media (min-width: 1080px) { .head .lead { width: 75%; margin-bottom: 40px; } }

/* a single action scrubbed by scroll: 210svh of travel, the scene pinned, one movement, the line arriving at the end */
.act { position: relative; height: 210svh; margin-left: calc(-1 * var(--rail)); width: calc(100% + var(--rail)); pointer-events: auto; }
.act .pin { position: sticky; top: 0; height: 100svh; overflow: hidden; background: var(--black); }
.act .pin img.poster, .act .pin canvas { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.act .pin canvas { opacity: 0; transition: opacity .3s var(--ease); }
.act .pin canvas.on { opacity: 1; }
.act.reduced .pin canvas { display: none; }
.act .cap { position: absolute; left: calc(var(--rail) + var(--gutter)); right: var(--gutter); bottom: 188px; z-index: 2; width: min(760px, 70%); display: grid; gap: 18px; justify-items: start; color: var(--light); opacity: 0; transform: translateY(14px); transition: opacity .52s var(--fade-out-easing), transform .8s var(--scroll-state-easing); }
.act .cap.show, html.still .act .cap, .act.reduced .cap { opacity: 1; transform: none; }
.act .cap .when { font-family: var(--cigars); font-size: 17px; letter-spacing: -.03em; color: rgba(247, 247, 238, .75); }
.act .cap .drop-cap { text-indent: 0; transform: none; padding-left: 0; }
.act .track, .roll .track { position: absolute; right: var(--gutter); top: 50%; translate: 0 -50%; height: 120px; width: 1px; background: rgba(247, 247, 238, .25); z-index: 2; }
.act .track i, .roll .track i { position: absolute; left: -1px; top: 0; width: 3px; height: calc(var(--p, 0) * 100%); background: var(--light); }
@media (max-width: 768px) { .act { height: 180svh; } .act .cap { width: auto; bottom: 168px; } .act .track, .roll .track { display: none; } }

/* the torn edge: the ground tears over the scene, a white fibre along the tear */
.torn { position: relative; z-index: 2; }
.torn::before { content: ""; position: absolute; left: 0; right: 0; top: -127px; height: 128px; background: var(--ground); -webkit-mask: var(--tear) center top / 100% 128px no-repeat; mask: var(--tear) center top / 100% 128px no-repeat; }
.torn::after { content: ""; position: absolute; left: 0; right: 0; top: -129px; height: 128px; background: #fffef6; -webkit-mask: var(--fibre) center top / 100% 128px no-repeat; mask: var(--fibre) center top / 100% 128px no-repeat; z-index: -1; }
@media (min-width: 940px) { .torn::before, .torn::after { left: calc(-1 * var(--rail)); } }
@media (max-width: 768px) { .torn::before { top: -95px; height: 96px; -webkit-mask-size: 100% 96px; mask-size: 100% 96px; } .torn::after { top: -97px; height: 96px; -webkit-mask-size: 100% 96px; mask-size: 100% 96px; } }

/* when the shader carries the rip, the CSS masks stand down */
.ground.torn.gl-tear::before, .ground.torn.gl-tear::after, .head.gl-enter::before, .head.gl-enter::after { display: none; }
/* the ground after the tear: the second panel's serif line, inset to the right four fifths of the column */
.ground { position: relative; background: var(--ground); color: var(--dark); pointer-events: auto; }
.ground .inset { padding: 0 12px 60px; }
@media (min-width: 940px) { .ground .inset { padding: 0 12px 80px 0; } .ground.torn > .inset > .title:first-child { padding-top: 190px; } }
.ground .inset > .narrative-2 { margin-top: 24px; max-width: 48ch; }
.ground .inset > .text { display: grid; justify-items: start; gap: 15px; }

/* ---- paper: the product blocks on #f7f7ee ---- */
.paper { position: relative; background: var(--paper); color: var(--dark); pointer-events: auto; }
.bodycopy-1.grey { color: var(--grey-mid); }

/* the hairline button: 11px bold, radius 3, a 13px square with a 7px arrow, 21px tall on desktop */
.cta { display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-height: 30px; padding: 4px 4px 4px 7px; border-radius: 3px; background: var(--light); border: 1px solid var(--grey-light); color: var(--dark); font-family: var(--mont); font-weight: 600; font-size: 13px; line-height: 1.1; white-space: nowrap; text-box: trim-both cap alphabetic; transition: color .15s var(--ease), background-color .15s var(--ease), border-color .15s var(--ease); }
@media (min-width: 769px) { .cta { min-height: 21px; } }
.cta:hover { background: var(--grey-light); }
.cta:active { background: var(--dark); border-color: var(--dark); color: var(--light); }
.cta i { display: grid; place-items: center; width: 15px; height: 15px; border-radius: 2px; background: var(--light); border: 1px solid var(--grey-light); flex: none; transition: border-color .15s var(--ease), background-color .15s var(--ease); }
.cta i svg { width: 8px; height: 8px; }
.cta:active i { border-color: var(--light); background: var(--dark); }
.cta:focus-visible { outline: 1px solid var(--ring); outline-offset: 0; box-shadow: none; }
.cta[aria-disabled="true"] { opacity: .5; pointer-events: none; }

/* the logos: a still grid, four across */
.logos { grid-column: 1 / -1; list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: var(--gap); }
@media (min-width: 769px) { .logos { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.logos li { display: flex; align-items: center; gap: 10px; padding: 14px 0; font-weight: 600; font-size: 14px; color: var(--white); white-space: nowrap; }
.logos svg { width: 22px; height: 22px; fill: currentColor; flex: none; }
.logos li.wide svg { width: 62px; height: 20px; }
.logos.in li { animation: stagger-fade-in .6s var(--scroll-state-easing) both; animation-delay: calc(var(--i, 0) * 40ms); }
html.js .logos:not(.in) li { opacity: 0; }
html.still .logos li, html:not(.js) .logos li { opacity: 1; animation: none; }
@media (max-width: 419px) { .logos li { white-space: normal; } }

/* the week: three cards pinned in turn on a crop of the dispatch room */
.days { position: relative; margin: 0 calc(-1 * var(--gutter)); background: #14100c url(assets/plates/w/deck.jpg) center / cover; padding: 0 var(--gutter); }
.days::before { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(0, 0, 0, .1), rgba(0, 0, 0, .3)); pointer-events: none; }
.days .day { position: sticky; top: 110px; min-height: calc(100svh - 110px); display: grid; align-content: center; padding: 60px 0; --ml: min(calc(100% / 12 * 2 + var(--gap)), calc(100% - 560px)); }
.days .day .in { width: min(560px, 100%); margin-left: var(--ml); background: var(--light); color: var(--dark); border-radius: 12px; box-shadow: 3px 6px 12px rgba(0, 0, 0, .13); padding: 20px 20px 24px; display: grid; gap: 15px; opacity: 0; transform: scale(.5); transform-origin: 50% 100%; }
.days .day h5 { font-size: 32px; line-height: .95; letter-spacing: -.03em; }
.days .day .narrative-2 { font-size: 20px; line-height: .97; letter-spacing: -.04em; }
html:not(.js) .days .day .in, html.still .days .day .in { opacity: 1; transform: none; animation: none; }
@media (prefers-reduced-motion: reduce) { .days .day .in { opacity: 1; transform: none; animation: none !important; } }
.days .day.in .in { animation: card-in 1s var(--ease-back) forwards; }
@keyframes card-in { from { opacity: 0; transform: scale(.5); } to { opacity: 1; transform: none; } }
.days .day .when { font-family: var(--cigars); font-weight: 500; font-style: italic; font-size: 19px; letter-spacing: -.01em; color: var(--grey-dark); }
.days .day .narrative-2 { max-width: 34ch; }
.days .day:nth-child(2) { top: 128px; --ml: min(calc(100% / 12 * 2 + var(--gap) + 18px), calc(100% - 560px)); }
.days .day:nth-child(3) { top: 146px; --ml: min(calc(100% / 12 * 2 + var(--gap) + 36px), calc(100% - 560px)); }
@media (max-width: 768px) { .days .day { --ml: 0px; min-height: 80svh; } .days .day:nth-child(2) { --ml: 10px; } .days .day:nth-child(3) { --ml: 20px; } }

/* reveals */
.rv { opacity: 0; transform: translateY(16px); transition: opacity .5s var(--ease), transform .6s var(--ease-back); }
.rv.in, html:not(.js) .rv, html.still .rv { opacity: 1; transform: none; }
html.js .rv:not(.in) { animation: failsafe 0s linear 6s forwards; }
@keyframes failsafe { to { opacity: 1; transform: none; } }

/* back to navigation: keyboard only, an ink pill that slides up on focus */
.back-nav { position: absolute; left: 2px; bottom: 2px; translate: 0 calc(100% + 2px); z-index: 50; padding: 8px 16px; border-radius: 8px; background: var(--dark); color: var(--light); font-family: var(--mont); font-weight: 500; font-size: 13px; line-height: 1.1; text-box: trim-both cap alphabetic; white-space: nowrap; transition: translate .2s var(--ease-out); pointer-events: none; }
.back-nav:not(:focus-visible) { opacity: 0; pointer-events: none; }   /* reachable by Tab; shown when focused */
.back-nav:focus-visible { translate: 0 0; pointer-events: auto; }

/* footer */
footer { position: relative; z-index: 1; background: var(--dark); color: var(--light); padding: 60px var(--gutter) 24px calc(var(--rail) + var(--gutter)); }
footer .cols { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
@media (min-width: 769px) { footer .cols { grid-template-columns: 2fr 1fr 1fr; } }
footer .cols > div:first-child { grid-column: 1 / -1; }
@media (min-width: 769px) { footer .cols > div:first-child { grid-column: auto; } }
footer .brand .zmark { width: 22px; height: 22px; }
footer .tag { margin-top: 12px; font-family: var(--cigars); font-style: italic; font-weight: 500; font-size: 20px; letter-spacing: -.01em; opacity: .8; }
footer .tag a { color: inherit; text-decoration: none; }   /* the line links to the essay that says what it means */
footer .tag a:hover { text-decoration: underline; text-underline-offset: 4px; text-decoration-thickness: 1px; }
footer .ctas { display: flex; gap: 8px; margin-top: 24px; flex-wrap: wrap; }
footer .pill.ghost { background: transparent; color: var(--light); border: 1px solid rgba(247, 247, 238, .5); }
footer .pill.ghost:hover { background: rgba(247, 247, 238, .1); }
footer ul { list-style: none; padding: 0; margin: 0; display: grid; gap: 8px; font-family: var(--inter); font-size: 14px; align-content: start; }
footer ul a:hover { text-decoration: underline; text-underline-offset: 3px; }
footer ul.social a.soc { display: inline-flex; align-items: center; gap: 9px; }
footer ul.social a.soc i { display: inline-grid; place-items: center; width: 14px; height: 14px; opacity: .85; }
@media (min-width: 769px) { footer .cols { grid-template-columns: 2fr 1fr 1fr 1fr; } }
footer .base { margin-top: 48px; font-family: var(--cigars); font-weight: 500; font-size: 14px; opacity: .6; max-width: 60ch; }
.zmark { display: block; }
html.diag .head, html.diag .act, html.diag .ground, html.diag .paper, html.diag .days .day { outline: 1px dashed #ff2d55; outline-offset: -1px; }


/* the quiet band: the ground with its paper grain, two columns of label and grey line, nothing else */
.band { position: relative; background: var(--black); margin: 20px 0 0; padding: 40px var(--gutter); color: var(--white); }
@media (min-width: 940px) { .band { margin-right: 12px; } }
@media (min-width: 1080px) { .band { padding: 60px; } }
.band .grain { position: absolute; inset: 0; background: url(assets/plates/w/grain.png) repeat; background-size: 400px; pointer-events: none; }
.band-grid { position: relative; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 12px; row-gap: 30px; }
@media (min-width: 769px) { .band-grid { grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--gap); } }
.band-grid article { grid-column: 1 / -1; display: flex; flex-direction: column; gap: 10px; }
@media (min-width: 769px) { .band-grid article { grid-column: span 5; } .band-grid article:nth-child(2n) { grid-column: 7 / span 5; } }
@media (min-width: 1080px) { .band-grid article { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); column-gap: var(--gap); gap: 0 var(--gap); align-items: start; } .band-grid article h4 { grid-column: span 2; } .band-grid article p { grid-column: span 3; } }
.band-grid h4 a { color: inherit; text-decoration: none; text-decoration-thickness: .08em; text-underline-offset: 8%; text-underline-position: from-font; text-decoration-skip-ink: none; }
.band-grid h4 a:hover { text-decoration-line: underline; }
.band-grid p a { color: var(--grey-dark); text-decoration: underline solid; text-decoration-thickness: .08em; text-underline-offset: 8%; text-underline-position: from-font; text-decoration-skip-ink: none; }
.band-grid p a:hover { text-decoration-style: dotted; }

/* the cloud of cards: 340 x 100, radius 12, the reference's shadow, spring in, drift from the pointer */
.cloud-block { padding-top: 20px; }
.cloud-block .text { padding-bottom: 50px; }
.cloud { position: relative; width: 100%; height: 340px; container-type: inline-size; }
.cloud-card { position: absolute; width: 340px; max-width: 100%; min-height: 100px; background: #fff; border-radius: 12px; box-shadow: 3px 6px 12px rgba(0, 0, 0, .13); padding: 13px 13px 10px; display: flex; flex-direction: column; justify-content: space-between; font-family: var(--inter); font-size: 13px; font-weight: 500; color: #303030; transform-origin: left; opacity: 0; transform: scale(.5); transition: transform .4s cubic-bezier(.34, 1.56, .64, 1), opacity .3s ease-out; will-change: transform; }
.cloud-card:not(.active) .t, .cloud-card:not(.active) .d, .cloud-card:not(.active) i { opacity: var(--to, .1); transition: opacity .3s var(--ease); }
.cloud-card.active { z-index: 10; }
.cloud-card.active i { background: var(--dark); color: var(--light); }
.cloud-card.active i .zmark { color: var(--light); }
.cloud-card.active::before { content: ""; position: absolute; left: -15%; width: 130%; top: -78px; bottom: -47px; border-radius: 50%; background: radial-gradient(closest-side, rgba(41, 41, 25, .16), rgba(41, 41, 25, 0)); z-index: -1; pointer-events: none; opacity: 0; transition: opacity .3s ease-in-out; }
.cloud.shown .cloud-card.active::before { opacity: 1; animation: glow-pulse 2s ease-in-out infinite; }
@keyframes glow-pulse { 0%, 100% { opacity: .55; } 50% { opacity: 1; } }
.cloud-card .t { padding-inline: 5px; }
.cloud-card .foot { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.cloud-card .d { padding-inline: 5px; color: var(--grey-mid); font-weight: 500; }
.cloud-card i { display: grid; place-items: center; width: 24px; height: 24px; border-radius: 50%; background: rgba(0, 0, 0, .05); flex: none; }
.cloud-card i .zmark { width: 14px; height: 14px; color: #303030; }
.cloud-card.ghost { pointer-events: none; }
.cloud-card.ghost .t { opacity: .1 !important; }
@media (max-width: 1079px) { .cloud-card.ghost { display: none; } }
@media (max-width: 768px) { .cloud { height: auto; display: grid; gap: 12px; } .cloud-card { position: static; width: 100%; aspect-ratio: auto; min-height: 107px; gap: 14px; } .cloud-card:not(.active) .t, .cloud-card:not(.active) .d, .cloud-card:not(.active) i { opacity: 1; } .cloud-card.active::before { display: none; } .cloud-card { transform: none !important; opacity: 1 !important; } }
html.still .cloud-card, html:not(.js) .cloud-card { opacity: 1; transform: scale(1); }

/* the figures: three numbers that flip up into place in turn */
.figures { grid-column: 1 / -1; display: grid; grid-template-columns: 1fr; gap: 40px; perspective: 1200px; container-type: inline-size; overflow: clip; }
@media (min-width: 769px) { .figures { grid-template-columns: repeat(3, minmax(0, 1fr)); column-gap: var(--gap); } }
.figures .fig { display: grid; gap: 15px; opacity: 0; transform-origin: 50% 100%; }
.figures .fig { translate: 0 24px; transition: opacity .4s var(--ease) calc(var(--fi, 0) * 60ms), translate .45s cubic-bezier(.16, 1, .3, 1) calc(var(--fi, 0) * 60ms); }
.figures.in .fig { opacity: 1; translate: 0 0; }   /* a short rise: the old flip-up took .75s and was never seen whole on a quick scroll */
.figures .fig .narrative-3 { font-size: 20px; letter-spacing: -.04em; color: var(--grey-dark); }
.figures .fig .headline-2 { font-size: clamp(2.5rem, .4rem + 3.4vw, 3.75rem); white-space: nowrap; }
/* the three questions: each flips up in turn, an italic question over its line */
.figures.questions { gap: 56px; padding-bottom: 12px; }   /* the last line's descenders hang below its trimmed box; the clip would take them */
.figures.questions .fig { gap: 14px; align-content: start; }
.figures.questions .kicker { font-family: var(--cigars); font-style: italic; font-weight: 500; font-size: 19px; line-height: 1; color: var(--grey-dark); text-box: trim-both cap alphabetic; }
.figures.questions .q { font-family: var(--cigars); font-style: italic; font-weight: 500; font-size: clamp(2.1rem, 1.1rem + 2.1vw, 3.1rem); line-height: 1; letter-spacing: -.02em; text-wrap: pretty; text-box: trim-both cap alphabetic; color: var(--dark); max-width: 12ch; }
.figures.questions .narrative-3 { font-size: 20px; line-height: 1.16; color: var(--grey-dark); max-width: 30ch; margin-top: 18px; }   /* clear of the question's own descenders */
@keyframes timeline-start { 0% { opacity: 0; translate: 0 75cqw; rotate: x -90deg; scale: 1.5; } to { opacity: 1; translate: 0; rotate: x 0deg; scale: 1; } }
html.still .figures .fig, html:not(.js) .figures .fig { opacity: 1; animation: none; }
html.js .figures:not(.in) .fig { animation: failsafe 0s linear 6s forwards; }


/* ---- the narrative blocks on the ground: the reference's Sidekick chapter ---- */
.ground .inset .title { padding: 60px 0; }
.ground .inset.end { padding-bottom: 80px; }
/* the block that ends a chapter leaves room below, so the next painting bursts through empty page */
/* the block that ends a chapter holds on screen for one more screen while the next room tears open over it */
.gate { height: 0; }
@media (min-width: 769px) {
  .gate { height: 100svh; }
  .paper.last { background: var(--black); }
  .paper.last .band { position: sticky; top: 0; }
  .hold { position: sticky; top: var(--nav-h); }
  .ground .inset.end.last .hold { padding-top: 0; }
  .areas.last { display: block; }
  .areas .hold { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--gap); row-gap: 50px; padding-top: 24px; }
}
@media (min-width: 940px) { .paper.last { margin-left: calc(-1 * var(--rail)); padding-left: var(--rail); } }

.nblock { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: var(--gap); row-gap: 50px; margin-bottom: 40px; }
@media (min-width: 769px) { .nblock { grid-template-columns: repeat(12, minmax(0, 1fr)); } }
.nblock:last-child { margin-bottom: 0; }
.nblock .text { grid-column: 1 / -1; display: grid; gap: 15px; justify-items: start; }
@media (min-width: 769px) { .nblock .text { grid-column: 1 / span 6; } }
.nblock .media, .nblock > .cloud { grid-column: 1 / -1; }
.nblock .text .headline-6 { color: var(--dark); }
.nblock .text .narrative-2 { color: var(--dark); margin-top: 0; max-width: 48ch; }

/* the artwork: geometric pieces in the site's own colours, in square frames */
.artframe { position: relative; width: 100%; aspect-ratio: 562 / 464; overflow: hidden; background: var(--black); }
.artframe.wide { aspect-ratio: 1016 / 529; }
.artframe.tall { aspect-ratio: 825 / 957; }
.artframe img { display: block; width: 100%; height: 100%; object-fit: cover; }

/* the human model: a ruled list under the two lines */
.model .rows { grid-column: 1 / -1; display: grid; border-top: 1px solid var(--line); margin: 0; }
.model .row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: var(--gap); row-gap: 8px; padding: 22px 0; border-bottom: 1px solid var(--line); }
@media (min-width: 769px) { .model .row { grid-template-columns: repeat(12, minmax(0, 1fr)); } .model .row dt { grid-column: 1 / span 4; } .model .row dd { grid-column: 6 / span 6; } }
.model .row dt { color: var(--black); }
.model .row dd { margin: 0; color: var(--grey-dark); }
.model .after { grid-column: 1 / -1; max-width: 48ch; }
@media (min-width: 769px) { .model .after { grid-column: 1 / span 6; } }

/* the fields: a ruled list, name, line and a hairline button on each row */
.nblock > .hold, .nblock > .areas, .inset > .areas, .areas > .hold { grid-column: 1 / -1; }
.areas-list { grid-column: 1 / -1; list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--line); }
.areas-list li { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: var(--gap); row-gap: 12px; padding: 26px 0; border-bottom: 1px solid var(--line); align-items: start; }
.areas-list .name { grid-column: 1 / -1; font-family: var(--mont); font-weight: 600; font-size: 18px; line-height: .95; letter-spacing: -.02em; color: var(--black); text-box: trim-both cap alphabetic; }
.areas-list .desc { grid-column: 1 / -1; font-family: var(--mont); font-weight: 600; font-size: 14px; line-height: 1.1; color: var(--grey-dark); text-box: trim-both cap alphabetic; }
.areas-list .cta { grid-column: 1 / -1; }
@media (min-width: 769px) { .areas-list li { grid-template-columns: repeat(12, minmax(0, 1fr)); } .areas-list .name { grid-column: 1 / span 4; } .areas-list .desc { grid-column: 6 / span 7; } .areas-list .cta { grid-column: 10 / span 3; justify-self: end; } }

/* a composition: a painted backdrop cropped from the cover, with cutout props laid on it */
.comp { position: relative; width: 100%; aspect-ratio: 1016 / 529; overflow: hidden; background: #1a1410 var(--bg) var(--bgpos, 50% 50%) / cover no-repeat; }
.frame { position: relative; width: 100%; aspect-ratio: 562 / 464; overflow: hidden; background: #1a1410 var(--bg) var(--bgpos, 50% 50%) / cover no-repeat; }
.frame.tall { aspect-ratio: 825 / 957; }
.prop { position: absolute; left: var(--x, 50%); top: var(--y, 50%); width: var(--w, 50%); height: auto; translate: -50% -50%; rotate: var(--r, 0deg); filter: drop-shadow(4px 10px 18px rgba(0, 0, 0, .4)); transform-origin: 50% 50%; opacity: 0; transition: opacity .3s var(--ease), translate .6s var(--ease); }
.prop.in { opacity: 1; }
html.still .prop, html:not(.js) .prop { opacity: 1; }
html.js .comp .prop:not(.in), html.js .frame .prop:not(.in) { animation: failsafe 0s linear 6s forwards; }

/* a film in a frame: the loop plays on view and rests off it */
.film { position: relative; width: 100%; aspect-ratio: 16 / 9; overflow: hidden; background: #000; }
.film img, .film video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.film video { opacity: 0; transition: opacity .6s var(--ease); }
.film video.ready { opacity: 1; }

/* the card rows on paper: two up or three up, square frames, no shadow */
.cards { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: var(--gap); row-gap: 40px; padding: 20px var(--gutter) 60px; }
@media (min-width: 769px) { .cards { grid-template-columns: repeat(12, minmax(0, 1fr)); } }
@media (min-width: 940px) { .cards { padding: 20px 12px 60px 0; } .ground .inset .cards { padding-inline: 0; } }
.ground .inset .cards.close { padding-top: 0; padding-bottom: 0; }
@media (min-width: 1080px) { .cards { row-gap: 64px; padding-bottom: 80px; } }
.card { grid-column: 1 / -1; display: grid; gap: 10px; align-content: start; }
@media (min-width: 769px) { .card.six { grid-column: span 6; } .card.three { grid-column: span 4; } }
.card .caption { display: grid; gap: 10px; justify-items: start; color: var(--dark); }
.card .caption .grey { max-width: 66.666%; color: var(--grey-dark); }

/* the floating phrases: the reference's skill-tag panel, in our words */
.phrases { position: relative; width: 100%; aspect-ratio: 1016 / 420; container-type: inline-size; color: var(--dark); }
.phrases .ph { position: absolute; left: var(--x); top: var(--y); opacity: 0; transform: translateY(8px); white-space: nowrap; transition: opacity .6s var(--ease), transform .8s var(--scroll-state-easing); }
.phrases.in .ph { opacity: var(--o, 1); transform: none; }
.phrases .ph.narrative-3 { font-size: 22px; }
.phrases .ph.r { translate: -100% 0; }
.phrases .ph.one { color: var(--black); font-size: clamp(3.2rem, 6vw, 7rem); }
.phrases .ph:nth-child(1) { transition-delay: 0ms; } .phrases .ph:nth-child(2) { transition-delay: 80ms; } .phrases .ph:nth-child(3) { transition-delay: 160ms; } .phrases .ph:nth-child(4) { transition-delay: 240ms; } .phrases .ph:nth-child(5) { transition-delay: 320ms; } .phrases .ph:nth-child(6) { transition-delay: 400ms; } .phrases .ph:nth-child(7) { transition-delay: 480ms; } .phrases .ph:nth-child(8) { transition-delay: 640ms; }
html.still .phrases .ph, html:not(.js) .phrases .ph { opacity: var(--o, 1); transform: none; }
@media (max-width: 768px) { .phrases { height: auto; display: grid; gap: 14px; } .phrases .ph { position: static; white-space: normal; translate: none; } }

/* the second dark panel: a painting with a serif line and a framed scrubbed film */
.panel { position: relative; min-height: 100svh; display: flex; align-items: flex-end; padding: 120px var(--gutter) 0; color: var(--light); }
.panel .art { position: absolute; left: calc(-1 * var(--rail)); right: 0; top: 0; bottom: 0; z-index: 0; background: var(--black); }
.panel .art img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: var(--pos, 50% 50%); }
.panel .panel-grid { position: relative; z-index: 1; width: 100%; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: var(--gap); row-gap: 40px; }
@media (min-width: 769px) { .panel .panel-grid { grid-template-columns: repeat(12, minmax(0, 1fr)); } }
.panel .copy { grid-column: 1 / -1; }
@media (min-width: 1080px) { .panel .copy { grid-column: 1 / span 9; } }
.act.framed { grid-column: 1 / -1; height: 165svh; margin: 0; width: auto; }
.nblock .media .act.framed { width: 100%; }
.act.framed .pin { position: sticky; top: 110px; height: auto; min-height: 0; background: none; overflow: visible; padding-bottom: 40px; }
.act.framed .vframe { position: relative; aspect-ratio: 16 / 9; overflow: hidden; background: #000; }
.act.framed[data-act="crossing"] .vframe { aspect-ratio: 12 / 5; }
.act.framed .vframe img.poster, .act.framed .vframe canvas { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.act.framed .vframe .when { position: absolute; left: 14px; bottom: 12px; font-family: var(--cigars); font-style: italic; font-weight: 500; font-size: 21px; letter-spacing: -.01em; color: var(--light); text-shadow: 0 1px 8px rgba(0, 0, 0, .5); }
.act.framed .pin::after { display: none; }
.act.framed .track { display: none; }

/* the band's own label */
.band .band-head { position: relative; margin-bottom: 30px; }
.band .band-head h4 { color: var(--white); }
.band .logos { position: relative; }

/* the day deck sits in the ground's media column, on a crop of the rug */
.nblock .days { margin: 0; background-image: url(assets/plates/w/warroom-3200.jpg); background-position: 50% 50%; }


/* ---- v10: information without pictures ---- */
.figures.trio { gap: 24px; }
.figures.trio .fig { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; padding: 26px 0 18px; border-top: 1px solid var(--line); color: var(--black); }
.figures.trio .fig .big { font-family: var(--cigars); font-style: italic; font-weight: 500; font-size: clamp(2.4rem, 1rem + 3vw, 4.2rem); line-height: 1; letter-spacing: -.02em; text-box: trim-both cap alphabetic; transition: translate .4s var(--ease); }
.figures.trio .fig .go { display: grid; place-items: center; width: 34px; height: 34px; border: 1px solid var(--grey-light); border-radius: 3px; flex: none; transition: background-color .15s var(--ease), color .15s var(--ease); }
.figures.trio .fig .go svg { width: 11px; height: 11px; }

/* the hero scene scrubbed by scroll: full bleed, pinned, the line arriving at the end */
.act .pin { background: var(--black); }
.act .cap { bottom: 120px; width: min(720px, 60%); }
.act .cap .narrative-1 { color: var(--white); }

/* the close: two typographic columns */
.close2 { display: grid; grid-template-columns: 1fr; gap: 48px; padding-bottom: 20px; }
@media (min-width: 769px) { .close2 { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: var(--gap); } }
.close2 article { display: grid; gap: 18px; justify-items: start; padding-top: 26px; border-top: 1px solid var(--line); }
.close2 .kicker { font-family: var(--cigars); font-style: italic; font-weight: 500; font-size: 19px; line-height: 1; color: var(--grey-dark); text-box: trim-both cap alphabetic; }
.close2 .big { font-family: var(--cigars); font-style: italic; font-weight: 500; font-size: clamp(2.6rem, 1rem + 3.6vw, 4.8rem); line-height: .98; letter-spacing: -.025em; text-box: trim-both cap alphabetic; color: var(--black); }
.close2 .narrative-2 { max-width: 30ch; color: var(--grey-dark); }


/* ---- v12: pictures that build themselves as the reader scrolls ----
   The window shows a crop of the base plate (the people painted out); each piece is a
   person at their own place, arriving between scroll shares a and b: revealed from the
   ground up with a short rise. Once whole, a film of the same picture scrubs on. */
.build { position: relative; margin: 0; }
.build .win { position: relative; width: 100%; aspect-ratio: var(--war); container-type: size; overflow: hidden; background: var(--black); --W: calc(100cqh * var(--iw)); }
.build .base, .build .film { position: absolute; top: 0; left: calc(-1 * var(--ox) * var(--W)); height: 100cqh; width: var(--W); max-width: none; }
.build .film { left: 0; width: 100%; height: 100%; opacity: 0; transition: opacity .35s var(--ease); }
.build video.film { object-fit: cover; }   /* a video letterboxes by default, so the film shrank inside the window; covering it lands on the still's own crop (measured: the film is the still's middle 96%, which is the window) */
.build video.loop { object-fit: cover; opacity: 0; transition: opacity .5s var(--ease); }
.build video.loop.on { opacity: 1; }
.build .film.on { opacity: 1; }
.build .piece { position: absolute; left: calc((var(--u) - var(--ox)) * var(--W)); top: calc(var(--v) * 100cqh); width: calc(var(--w) * var(--W)); height: auto; max-width: none; opacity: min(1, calc(var(--r, 0) * 3.3)); translate: 0 calc((1 - var(--r, 0)) * 8px); will-change: opacity, translate; }
/* a figure arrives as a focus pull: there almost at once, soft, then sharp. A slow fade over the whole span read as a double exposure */
.build .piece.soft { display: none; }
@media (min-width: 769px) and (prefers-reduced-motion: no-preference) {
  .build .piece.soft { display: block; filter: blur(7px); opacity: calc(min(1, var(--r, 0) * 6) * (1 - clamp(0, (var(--r, 0) - .6) / .12, 1))); }
  .build .piece:not(.soft) { opacity: clamp(0, calc((var(--r, 0) - .15) / .55), 1); }
}
html.still .build .piece, html:not(.js) .build .piece { --r: 1; }

/* the steps: a black panel held for four screens; the copy builds line by line beside the picture */
.steps { position: relative; height: 300svh; margin-left: calc(-1 * var(--rail)); width: calc(100% + var(--rail)); background: var(--black); color: var(--white); pointer-events: auto; }
.steps .pin { position: sticky; top: 0; height: 100svh; padding: var(--nav-h) 0 0; display: grid; grid-template-rows: minmax(0, 1fr) auto auto; }
/* the picture: the whole width, the whole picture side to side; only the sky and the floor give way on short screens */
.steps .build { grid-row: 1; min-height: 0; }
.steps .build .win { height: 100%; aspect-ratio: auto; --W: calc(100cqw / var(--ow, 0.96)); --top: calc((100cqh - var(--W) / var(--iw)) / 2); }
.steps .build .base { top: var(--top); height: auto; width: var(--W); left: calc(-1 * var(--ox) * var(--W)); }
.steps .build .piece { top: calc(var(--top) + var(--v) * var(--W) / var(--iw)); }
.steps .build .win::after { content: ""; position: absolute; inset: 0; background: linear-gradient(to bottom, rgba(0, 0, 0, .62), rgba(0, 0, 0, 0) 28%); pointer-events: none; }   /* the picture goes dark toward the bar, so the page title reads over the sky */
/* the three steps in a row, as the companies chapter sets its three questions; the one the picture is on is bright */
.steps .copy { grid-row: 2; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); column-gap: 40px; padding: 26px var(--gutter) 0 calc(var(--rail) + var(--gutter)); }
.steps .step { --o: 0; padding: 18px 0 0; border-top: 1px solid rgba(255, 255, 255, .22); }
.steps .step .big { font-family: var(--cigars); font-style: italic; font-weight: 500; font-size: clamp(1.6rem, .75rem + 1.5vw, 2.8rem); line-height: 1; letter-spacing: -.02em; margin: 0; color: rgba(255, 255, 255, calc(.4 + .6 * var(--o))); text-box: trim-both cap alphabetic; transition: color .3s var(--ease); }
.steps .step .para { display: grid; grid-template-rows: 1fr; }
.steps .step .para > p { min-height: 0; margin: 0; max-width: 34ch; padding-top: 14px; font-size: 16px; line-height: 1.3; color: rgba(255, 255, 255, calc(.5 + .34 * var(--o))); transition: color .3s var(--ease); }
html.still .steps .step, html:not(.js) .steps .step { --o: 1; }
.steps .rule { display: none; }
.steps .cta { grid-row: 3; justify-self: start; margin: 24px 0 30px calc(var(--rail) + var(--gutter)); }
@media (max-width: 939px) { .steps .copy { padding-inline: var(--gutter); } .steps .cta { margin-left: var(--gutter); } }
@media (max-width: 768px) {
  .steps { height: 270svh; }
  .steps .pin { grid-template-rows: auto auto auto; align-content: center; padding-bottom: 24px; row-gap: 6px; }
  .steps .build .win::after { background: linear-gradient(to bottom, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0) 30%); }
  .steps .build .win { height: auto; aspect-ratio: var(--war); --W: calc(100cqh * var(--iw)); --top: 0px; }
  .steps .build .base { top: 0; height: 100cqh; width: var(--W); }
  .steps .build .piece { top: calc(var(--v) * 100cqh); }
  .steps .copy { grid-template-columns: 1fr; padding-top: 10px; align-content: start; }
  .steps .step { padding: 14px 0 14px; }
  .steps .step .big { font-size: 1.7rem; }
  .steps .step .para > p { font-size: 15px; line-height: 1.25; max-width: none; padding-top: 8px; }
  .steps .cta { margin: 14px 0 22px var(--gutter); }
}
.council { position: relative; height: 220svh; margin-left: calc(-1 * var(--rail)); width: calc(100% + var(--rail)); pointer-events: auto; }
.council .pin { position: sticky; top: 0; height: 100svh; display: grid; place-items: center; padding: calc(var(--nav-h) + 24px) var(--gutter) 40px calc(var(--rail) + var(--gutter)); }
.council .build { width: min(100%, calc((100svh - var(--nav-h) - 64px) * var(--war, 2))); }
@media (max-width: 939px) { .council .pin { padding-inline: var(--gutter); } }
@media (max-width: 768px) { .council { height: 150svh; } .council .win { --ox: 0.2 !important; --war: 1.15 !important; } }   /* the crop is inline on the window, so the phone's tighter crop needs the weight */


/* the mark in the bar: Zelcast (mark) | Talent Superintelligence */
.brand .bmark { display: grid; place-items: center; margin: 0 -2px; }
.brand .bmark .zmark { display: block; width: 20px; height: 20px; }
@media (min-width: 940px) { .brand .bmark .zmark { width: 26px; height: 26px; } }

/* who we are, in the black below the network, held there until the next room tears open over it: set like the chapter openers */
.band .who { position: relative; margin-top: 120px; padding-right: var(--gutter); }
.band .who .narrative-1 { margin: 0; max-width: 30ch; color: var(--white); text-wrap: pretty; }
.band .who .nowrap { white-space: nowrap; }
@media (max-width: 768px) { .band .who { margin-top: 64px; } }

/* the name beside the human model's closing line */
.model .after { display: flex; flex-wrap: wrap; align-items: baseline; column-gap: 18px; row-gap: 10px; }
.model .after .mark { display: inline-flex; align-items: baseline; gap: 9px; white-space: nowrap; }
.model .after .mark .serif { font-family: var(--cigars); font-style: normal; font-weight: 500; font-size: 1.25em; line-height: 1; letter-spacing: -.01em; color: var(--black); }
.model .after .mark .sans { font-family: var(--mont); font-weight: 500; font-size: 13px; line-height: 1; letter-spacing: 0; color: var(--grey-dark); }

/* the rail's chapters carry the bar's flip; the leader and the numeral stay */
.side li a > span > .flip { --fh: 1.12em; display: block; }
.side li a > span > .flip .faces { height: var(--fh); line-height: var(--fh); }
.side li a > span > .flip .face { height: var(--fh); line-height: var(--fh); text-box: trim-both cap alphabetic; }
.side li a:hover > span > span { text-decoration-line: none; }

/* with the chapter links gone from the bar, Sign in and the button keep the right edge */
.nav ul.right { margin-left: auto; }

/* the room after the black network band opens out of black, not out of the white page under it */
/* (the engineers room's canvas now covers the held band from two screens out, so it needs no black of its own) */

/* the mark in the bar: Zelcast (mark) | Talent Superintelligence */
.brand .bmark { display: grid; place-items: center; margin: 0 -2px; }
.brand .bmark .zmark { display: block; width: 20px; height: 20px; }
@media (min-width: 940px) { .brand .bmark .zmark { width: 26px; height: 26px; } }

/* who we are, in the black below the network, held there until the next room tears open over it: set like the chapter openers */
.band .who { position: relative; margin-top: 120px; padding-right: var(--gutter); }
.band .who .narrative-1 { margin: 0; max-width: 30ch; color: var(--white); text-wrap: pretty; }
.band .who .nowrap { white-space: nowrap; }
@media (max-width: 768px) { .band .who { margin-top: 64px; } }

/* the name beside the human model's closing line */
.model .after { display: flex; flex-wrap: wrap; align-items: baseline; column-gap: 18px; row-gap: 10px; }
.model .after .mark { display: inline-flex; align-items: baseline; gap: 9px; white-space: nowrap; }
.model .after .mark .serif { font-family: var(--cigars); font-style: normal; font-weight: 500; font-size: 1.25em; line-height: 1; letter-spacing: -.01em; color: var(--black); }
.model .after .mark .sans { font-family: var(--mont); font-weight: 500; font-size: 13px; line-height: 1; letter-spacing: 0; color: var(--grey-dark); }

/* the rail's chapters carry the bar's flip; the leader and the numeral stay */
.side li a > span > .flip { --fh: 1.12em; display: block; }
.side li a > span > .flip .faces { height: var(--fh); line-height: var(--fh); }
.side li a > span > .flip .face { height: var(--fh); line-height: var(--fh); text-box: trim-both cap alphabetic; }
.side li a:hover > span > span { text-decoration-line: none; }

/* with the chapter links gone from the bar, Sign in and the button keep the right edge */
.nav ul.right { margin-left: auto; }

/* the room after the black network band opens out of black, not out of the white page under it */

/* a black panel tears up over the white page with the rooms' living edge, drawn on a strip above its top */
[data-tear-top] { position: relative; margin-top: 0; z-index: 2; }
/* the block before a black panel holds while the panel rises over it and eats it */
@media (min-width: 769px) { .gate.eat { height: 150svh; } .hold.eaten { z-index: 0; } }
@media (max-width: 768px) { .gate.eat { height: 0; } [data-tear-top] { margin-top: 130px; } }
.tearline { position: absolute; left: 0; right: 0; top: -150px; height: 152px; width: 100%; display: block; pointer-events: none; z-index: 2; }

/* introduction to offer: the two figures the hire page promises, set as a readout under the three questions */
.speed { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: var(--gap); row-gap: 18px; margin-top: 56px; padding-top: 22px; border-top: 1px solid var(--line); }
.speed .headline-6 { grid-column: 1 / -1; color: var(--dark); }
.speed .stat { margin: 0; display: grid; grid-template-columns: auto 1fr; column-gap: 10px; align-items: baseline; }
.speed .n { font-variant-numeric: lining-nums; font-feature-settings: "lnum" 1; font-family: var(--cigars); font-weight: 500; font-size: clamp(4.2rem, 2.4rem + 5vw, 8rem); line-height: .82; letter-spacing: -.03em; color: var(--black); }
.speed .u { font-family: var(--cigars); font-style: italic; font-weight: 500; font-size: clamp(1.4rem, 1rem + 1vw, 2rem); color: var(--black); }
.speed .c { grid-column: 1 / -1; margin-top: 16px; font-family: var(--mont); font-weight: 500; font-size: 14px; color: var(--grey-dark); }
@media (min-width: 769px) { .speed { grid-template-columns: repeat(12, minmax(0, 1fr)); } .speed .headline-6 { grid-column: 1 / span 4; } .speed .stat:nth-of-type(2) { grid-column: 6 / span 3; } .speed .stat:nth-of-type(3) { grid-column: 9 / span 3; } }

/* the bar's button forks: it reads "Build your team" and "Build your career" in turn, and opens a choice */
.nav .fork { position: relative; }
.nav .fork-btn { border: 0; font-family: inherit; cursor: pointer; }
.flipword { display: inline-grid; overflow: hidden; text-align: left; }
.flipword .w { grid-area: 1 / 1; white-space: nowrap; transform: translateY(105%); opacity: 0; transition: transform .55s var(--ease), opacity .4s var(--ease); }
.flipword .w.on { transform: none; opacity: 1; }
.flipword .w.out { transform: translateY(-105%); opacity: 0; }
.nav .fork[data-open] .fork-btn i { rotate: 90deg; translate: 0 0 !important; }
.nav .fork-btn i { transition: rotate .3s var(--ease), translate .3s var(--ease); }
.nav .fork-btn:hover i { translate: none; }   /* the arrow turns to the menu; it does not lean first */
.fork-menu { position: absolute; right: 0; top: calc(100% + 8px); min-width: 248px; padding: 6px; border-radius: 4px; background: var(--white); color: var(--black); display: grid; z-index: 30; }
.fork-menu[hidden] { display: none; }
html[data-nav-theme="light"] .fork-menu { background: var(--black); color: var(--white); }
.fork-menu a { display: grid; gap: 5px; padding: 12px 14px; border-radius: 3px; transition: background-color .2s var(--ease); }
.fork-menu a + a { box-shadow: inset 0 1px 0 rgba(128, 128, 128, .22); }
.fork-menu a:hover, .fork-menu a:focus-visible { background: rgba(128, 128, 128, .12); outline: none; }
.fork-menu .k { font-family: var(--mont); font-weight: 500; font-size: 13px; line-height: 1; opacity: .6; }
.fork-menu .t { font-family: var(--mont); font-weight: 500; font-size: 16px; line-height: 1.1; letter-spacing: -.01em; }
@media (prefers-reduced-motion: reduce) { .flipword .w { transition: none; } }

/* ---- the opening (intro.js): one timeline, its stage on <html data-intro>: draw, words, ready, done ---- */
.intro-lines { position: fixed; inset: 0; width: 100%; height: 100%; z-index: 99; pointer-events: none; overflow: visible; transition: opacity .6s var(--ease); }
.intro-lines.gone { opacity: 0; }
.intro-lines path { fill: none; stroke-width: 1px; vector-effect: non-scaling-stroke; stroke-linecap: round; stroke-opacity: 0; }
.intro-lines .tip, .intro-lines .halo { opacity: 0; }
html[data-intro] .davinci-lines__container { display: none; }                  /* the reference's own loader box and its second copy of the title */
html[data-intro]:not([data-intro="done"]) .side h1.title-link { translate: none !important; animation: none !important; opacity: 1 !important; }
html[data-intro] .side li { animation: none !important; }
/* the words rise from behind their own baselines, one after another */
.side .title .iw { display: inline-block; overflow: hidden; vertical-align: top; padding-bottom: .18em; margin-bottom: -.18em; }
.side .title .ii { display: inline-block; transition: transform .8s cubic-bezier(.16, 1, .3, 1) calc(var(--i, 0) * 50ms), opacity .4s var(--ease) calc(var(--i, 0) * 50ms); }
html[data-intro="draw"] .side .title .ii { transform: translateY(110%); opacity: 0; transition: none; }
/* then the line under them and the chapters */
html[data-intro="draw"] .side :is(.subtitle, li) { opacity: 0 !important; translate: 0 14px; transition: none !important; }
html[data-intro="words"] .side :is(.subtitle, li), html[data-intro="ready"] .side :is(.subtitle, li) { opacity: 1 !important; transition: opacity .45s var(--ease) calc(.1s + var(--ri, 0) * 60ms), translate .6s cubic-bezier(.16, 1, .3, 1) calc(.1s + var(--ri, 0) * 60ms) !important; }
/* the bar arrives with the words */
@media (min-width: 940px) and (prefers-reduced-motion: no-preference) {
  html[data-intro="draw"] .nav > div, html[data-intro="draw"] .nav > ul > li { animation-play-state: paused !important; }
  html[data-intro] .nav > div { animation-delay: .15s !important; }
  html[data-intro] .nav > ul > li { animation-delay: calc(var(--d, 500ms) * .4) !important; }
}
@media (max-width: 939px) {
  html[data-intro="draw"] .nav { opacity: 0; }
  html[data-intro] .nav { transition: opacity .6s var(--ease) .15s, color .3s var(--ease), background-color .3s var(--ease); }
}
/* hurried: someone scrolled before it finished, so the ending comes at once */
html[data-intro-fast] .side .title .ii, html[data-intro-fast] .side :is(.subtitle, li) { transition-duration: .35s !important; transition-delay: 0s !important; }
html[data-intro-fast] .nav > div, html[data-intro-fast] .nav > ul > li { animation-delay: 0s !important; animation-duration: .45s !important; }
html[data-intro-fast] .nav { transition-delay: 0s !important; }

/* ---- the drawing inside the page (intro.js zcDrafts): each chapter's title framed as it arrives, and the ending ---- */
.draft { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; overflow: visible; z-index: 2; }
.draft path { fill: none; stroke-width: 1px; vector-effect: non-scaling-stroke; stroke-linecap: round; stroke-opacity: 0; }
.draft .tip, .draft .halo { opacity: 0; }
.draft.settled .edge { stroke-opacity: var(--stay, 1) !important; transition: stroke-opacity 1.2s var(--ease); }
.draft.settled { transition: opacity .25s linear; }
/* a chapter's name rises word by word as its frame closes; its line follows */
.head h2 span.iw { display: inline-block; overflow: hidden; vertical-align: top; padding-bottom: .16em; margin-bottom: -.16em; }
.head h2 span.ii { display: inline-block; transition: transform .45s cubic-bezier(.16, 1, .3, 1) calc(var(--i, 0) * 30ms), opacity .25s var(--ease) calc(var(--i, 0) * 30ms); }
.head[data-draft="wait"] h2 span.ii, .head[data-draft="draw"] h2 span.ii { transform: translateY(110%); opacity: 0; transition: none; }
.head[data-draft] .lead { transition: opacity .4s var(--ease) .08s, translate .5s cubic-bezier(.16, 1, .3, 1) .08s; }
.head[data-draft="wait"] .lead, .head[data-draft="draw"] .lead { opacity: 0; translate: 0 16px; transition: none; }
.measuring h2 span.ii, .measuring .lead, .measuring > .title, .measuring .close2 article { transform: none !important; translate: none !important; transition: none !important; }   /* intro.js measures the frame against the words at rest */
/* the ending: the last line and the two doors come in as the box closes round them */
.ground .inset.end[data-draft] { position: relative; }
.inset.end[data-draft] > .title { transition: opacity .6s var(--ease), translate .8s cubic-bezier(.16, 1, .3, 1); }
.inset.end[data-draft] .close2 article { transition: opacity .6s var(--ease) calc(.12s + var(--ri, 0) * .1s), translate .8s cubic-bezier(.16, 1, .3, 1) calc(.12s + var(--ri, 0) * .1s); }
.inset.end[data-draft="wait"] > .title, .inset.end[data-draft="draw"] > .title, .inset.end[data-draft="wait"] .close2 article, .inset.end[data-draft="draw"] .close2 article { opacity: 0; translate: 0 18px; transition: none; }
.inset.end[data-draft] > .title, .inset.end[data-draft] .close2 { position: relative; z-index: 3; }
.draft.chapter-draft path { stroke-width: 1.25px; }
/* the framed ending keeps clear of the screen's edges, so the box has room on both sides */
@media (min-width: 769px) { .ground .inset.end[data-draft] .close2 { margin-right: 64px; } }
@media (max-width: 768px) { .ground .inset.end[data-draft] { padding-left: 30px; padding-right: 30px; } }

/* the engine is late (a slow first visit): when the room is due to open, the page's own image fades in instead,
   its soft picture first and the photograph over it; the room takes over once its canvas has a picture */
html[data-intro="ready"] .cover:not(.gl-on) > img.plate, html[data-intro="done"] .cover:not(.gl-on) > img.plate { opacity: 1; transition: opacity 1.1s var(--ease); }
/* until the photograph has fully arrived only its soft picture (the image's own background) shows: a half-downloaded photograph paints in from the top */
html.js .cover > img.plate:not(.loaded) { object-position: -300vw 0; }

/* =========================================================================
   v12.49: the hand answers. The opening is drawn by a hand; from here the
   same hand answers every hover, focus, arrival and departure: registration
   marks, hairlines that draw in, arrows that ink, numbers that rise from
   their baselines, a frame drafted round a picture you are about to open.
   ========================================================================= */
/* the page's own colours for what the browser paints: selection in the gold, focus in the ink or the light, whichever the ground asks for */
::selection { background: var(--gold); color: var(--black); }
/* one ring for ink, paper and paintings: a light band inside a dark one, so it shows on anything (the text colour vanished on filled buttons) */
a:focus-visible, button:focus-visible, .cta:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible, [tabindex]:focus-visible { outline: 2px solid #111; outline-offset: 2px; box-shadow: 0 0 0 2px #fffef9; }
.nav .pill:focus-visible, footer .pill:focus-visible { outline-offset: 2px; }

/* the mark's cells: on hover they lift column by column; the gold cells breathe, slowly, all the time */
.zmark rect { transform-box: fill-box; transform-origin: 50% 50%; }
@media (prefers-reduced-motion: no-preference) {
  .zmark rect.g { animation: gold-breath 9s ease-in-out 3s infinite; }
  @media (hover: hover) {
    html:not([data-intro]) .brand:hover .zmark rect { animation: cell-wave .8s var(--ease) calc(var(--c, 0) * 40ms) 1; }
    html:not([data-intro]) .brand:hover .zmark rect.g { animation: cell-wave .8s var(--ease) calc(var(--c, 0) * 40ms) 1, gold-breath 9s ease-in-out 3s infinite; }
    /* on the front door the cells keep their arrival in the list, so a hover never makes them arrive again */
    html[data-intro]:not([data-intro="draw"]) .nav .brand:hover .zmark rect { animation: cell-in .6s var(--ease-out) both, cell-wave .8s var(--ease) 1; animation-delay: calc(1.2s + var(--c, 0) * 48ms), calc(var(--c, 0) * 40ms); }
    html[data-intro]:not([data-intro="draw"]) .nav .brand:hover .zmark rect.g { animation: cell-in .6s var(--ease-out) both, cell-wave .8s var(--ease) 1, gold-breath 9s ease-in-out infinite; animation-delay: calc(1.2s + var(--c, 0) * 48ms), calc(var(--c, 0) * 40ms), 3s; }
  }
}
@keyframes cell-wave { 0%, 100% { scale: 1; } 35% { scale: 1.34; } }
@keyframes gold-breath { 0%, 86%, 100% { fill: #d8a960; } 93% { fill: #f6dcaa; } }

/* text links: the underline is drawn from the left and leaves to the right */
footer ul a, .mobile-menu .foot a, .side .terms a, .band-grid h4 a, .page .ptitle a, .doc-cta a, .flow .read a, .doc-more .ptitle a { text-decoration: none; background-image: linear-gradient(currentColor, currentColor); background-repeat: no-repeat; background-size: 0% 1px; background-position: 100% calc(100% - .04em); -webkit-box-decoration-break: clone; box-decoration-break: clone; transition: background-size .4s var(--ease); }
footer ul a:hover, .mobile-menu .foot a:hover, .side .terms a:hover, .band-grid h4 a:hover, .page .ptitle a:hover, .doc-cta a:hover, .flow .read a:hover, .doc-more .ptitle a:hover,
footer ul a:focus-visible, .page .ptitle a:focus-visible, .doc-cta a:focus-visible { text-decoration: none; background-size: 100% 1px; background-position: 0 calc(100% - .04em); }
.page .ptitle a, .doc-more .ptitle a { background-position-y: calc(100% + 4px); padding-bottom: 5px; }
.page .ptitle a:hover, .doc-more .ptitle a:hover { background-position-y: calc(100% + 4px); }

/* the hairline button: hovering inks its arrow's square, the arrow leaning into its corner */
.cta { transition: color .15s var(--ease), background-color .15s var(--ease), border-color .2s var(--ease); }
.cta i svg { transition: translate .25s var(--ease); }
@media (hover: hover) {
  .cta:hover { background: var(--light); border-color: var(--dark); }
  .cta:hover i { background: var(--dark); border-color: var(--dark); color: var(--light); }
  .cta:hover i svg { translate: 1px -1px; }
  .figures.trio .fig .go svg { transition: translate .25s var(--ease); }
}

/* the pills lean toward the pointer (hand.js writes --mx/--my) */
.nav .pill, footer .pill, .flow .go { translate: var(--mx, 0px) var(--my, 0px); transition: translate .6s var(--ease-out), color .3s var(--ease), background-color .3s var(--ease); }
.nav .pill i { will-change: translate; }

/* the fields: hovering a row leans its name and inks its button */
@media (hover: hover) {
}

/* the cards: a frame is drafted just inside the picture you are about to open, and its title leans */
.card .artframe, .posts .post.lead .art { position: relative; }
.card .artframe::after, .posts .post.lead .art::after { content: ""; position: absolute; inset: 12px; border: 1px solid rgba(255, 255, 255, .85); opacity: 0; scale: .96; transition: opacity .45s var(--ease), scale .75s var(--ease-out); pointer-events: none; }
.card .artframe:not([data-nav-theme="dark"])::after, .posts .post.lead .art::after { border-color: rgba(0, 0, 0, .55); }
.card .caption h4, .posts .post .ptitle { transition: translate .45s var(--ease); }
@media (hover: hover) {
  .card:hover .artframe::after, .posts .post.lead:hover .art::after { opacity: 1; scale: 1; }
  .card:hover .caption h4 { translate: 4px 0; }
  .card:hover .cta i { background: var(--dark); border-color: var(--dark); color: var(--light); }
  .card:hover .cta { border-color: var(--dark); }
}
.card .artframe img { transition: scale 1.4s var(--ease-out); }
@media (hover: hover) { .card:hover .artframe img { scale: 1.035; } }

/* arrivals: a soft rise as a block enters (main.js adds .in) */
.rv { opacity: 0; transform: translateY(12px); transition: opacity .7s var(--ease), transform .9s cubic-bezier(.16, 1, .3, 1); transition-delay: calc(var(--i, 0) * 70ms); }
.rv.in, html:not(.js) .rv, html.still .rv { opacity: 1; transform: none; }
html.js .rv:not(.in) { animation: failsafe 0s linear 6s forwards; }
/* the offer's figures rise out of their own baselines, then their units and their captions */
.speed .n { display: inline-block; overflow: clip; padding-bottom: .04em; }
.speed .n > span { display: inline-block; transition: transform 1.15s cubic-bezier(.16, 1, .3, 1); }
.speed .stat:nth-of-type(3) .n > span { transition-delay: 120ms; }
.speed .u, .speed .c { transition: opacity .8s var(--ease) .4s; }
html.js .rise:not(.in) .n > span { transform: translateY(108%); }
html.js .rise:not(.in) :is(.u, .c) { opacity: 0; }
html.still .rise .n > span, html.still .rise :is(.u, .c) { transform: none; opacity: 1; transition: none; }
html.js .rise:not(.in) .n > span { animation: failsafe 0s linear 6s forwards; }
html.js .rise:not(.in) :is(.u, .c) { animation: failsafe 0s linear 6s forwards; }

/* the steps: each step's rule fills across as the reader scrolls through it (main.js writes --sf) */
.steps .step { position: relative; }
.steps .step::before { content: ""; position: absolute; left: 0; right: 0; top: -1px; height: 1px; background: var(--white); transform: scaleX(var(--sf, 0)); transform-origin: 0 50%; }
html.still .steps .step::before { transform: scaleX(1); }

/* the council's picture fills a phone side to side */
@media (max-width: 768px) { .council .pin { padding-inline: 0; } .council .build { width: 100%; } }

/* the phone menu's lines arrive one after another */
@media (max-width: 939px) and (prefers-reduced-motion: no-preference) {
  .mobile-nav-list li, .mobile-menu .foot, .mobile-menu .global li { opacity: 0; translate: 0 10px; transition: opacity .3s var(--ease), translate .4s var(--ease-out); }
  html.sheet-open :is(.mobile-nav-list li, .mobile-menu .foot, .mobile-menu .global li) { opacity: 1; translate: 0; transition: opacity .5s var(--ease) var(--k, 0ms), translate .6s var(--ease-out) var(--k, 0ms); }
  .mobile-nav-list li:nth-child(1) { --k: 80ms; } .mobile-nav-list li:nth-child(2) { --k: 130ms; } .mobile-nav-list li:nth-child(3) { --k: 180ms; } .mobile-nav-list li:nth-child(4) { --k: 230ms; }
  .mobile-menu .foot { --k: 300ms; }
  .mobile-menu .global li:nth-child(1) { --k: 340ms; } .mobile-menu .global li:nth-child(2) { --k: 380ms; } .mobile-menu .global li:nth-child(3) { --k: 420ms; } .mobile-menu .global li:nth-child(4) { --k: 460ms; }
}

/* leaving for another page: the document fades and the next one rises under the same bar */
@media (prefers-reduced-motion: no-preference) {
  @view-transition { navigation: auto; }
  ::view-transition-old(root) { animation: vt-out .26s var(--ease) both; }
  ::view-transition-new(root) { animation: vt-in .46s var(--ease-out) both; }
  ::view-transition-group(navigation) { animation-duration: .3s; }
  ::view-transition-old(navigation), ::view-transition-new(navigation) { animation-duration: .3s; }
}
@keyframes vt-out { to { opacity: 0; } }
@keyframes vt-in { from { opacity: 0; translate: 0 10px; } }

/* ---- the opening, second pass: the sheet, the bar's wordmark assembling, the chapters ruled ---- */
/* the sheet: crop marks at the screen's corners and registration crosses at its edges, drawn as the hairlines set out, gone with them */
.intro-lines .sheet { stroke-opacity: .55; stroke-dasharray: 1; stroke-dashoffset: 1; animation: sheet-draw .8s var(--ease-out) both; }
.intro-lines .sheet.reg { stroke-opacity: .4; }
@keyframes sheet-draw { from { stroke-dashoffset: 1; } to { stroke-dashoffset: 0; } }
html[data-intro-fast] .intro-lines .sheet { animation-duration: .25s; animation-delay: 0s !important; }
/* the bar's mark assembles column by column as the bar lands, the rule drops beside it, then the two words of the lockup */
html[data-intro="draw"] .nav .brand .zmark rect { opacity: 0; }
html[data-intro]:not([data-intro="draw"]) .nav .brand .zmark rect { animation: cell-in .6s var(--ease-out) both; animation-delay: calc(1.2s + var(--c, 0) * 48ms); }
html[data-intro]:not([data-intro="draw"]) .nav .brand .zmark rect.g { animation: cell-in .6s var(--ease-out) both, gold-breath 9s ease-in-out 3s infinite; animation-delay: calc(1.2s + var(--c, 0) * 48ms), 3s; }
html[data-intro]:not([data-intro="draw"]) .nav .brand .rule { transform-origin: 50% 0; animation: rule-down .55s var(--ease-out) 1.55s both; }
html[data-intro]:not([data-intro="draw"]) .nav .brand .lockup > span { animation: lock-in .6s var(--ease-out) both; }
html[data-intro]:not([data-intro="draw"]) .nav .brand .lockup > span:first-child { animation-delay: 1.75s; }
html[data-intro]:not([data-intro="draw"]) .nav .brand .lockup > span:last-child { animation-delay: 1.88s; }
@keyframes cell-in { from { opacity: 0; scale: .35; } to { scale: 1; } }
@keyframes rule-down { from { scale: 1 0; } }
@keyframes lock-in { from { opacity: 0; translate: -6px 0; } to { opacity: 1; } }
html[data-intro-fast] .nav .brand :is(.zmark rect, .rule, .lockup > span) { animation-delay: .1s !important; animation-duration: .35s !important; }
/* the chapters are ruled: each leader draws across and draws away in turn as the list arrives */
@media (min-width: 940px) and (prefers-reduced-motion: no-preference) {
  html[data-intro="words"] .side li a > span::after, html[data-intro="ready"] .side li a > span::after { animation: leader-rule 1.4s var(--ease) calc(.7s + var(--ri, 0) * 90ms) both; }
}
@keyframes leader-rule { 0% { clip-path: inset(0 100% 0 0); } 40% { clip-path: inset(0); } 68% { clip-path: inset(0); } 100% { clip-path: inset(0 0 0 100%); } }
html[data-intro-fast] .side li a > span::after { animation-duration: .5s !important; animation-delay: 0s !important; }

/* phones: a chapter's name fits inside the frame drawn round it */
@media (max-width: 600px) { .head .headline-1 { font-size: min(84px, 16.5vw); } }

/* without JavaScript: the hero card and cover scroll away with the first screen instead of pinning over every section, and the paintings show instead of their line drawings */
html:not(.js) .side, html:not(.js) .cover { position: absolute !important; height: 100svh; }
html:not(.js) .lineart { opacity: 0 !important; }
html:not(.js) .side .terms, html:not(.js) [data-section-name="side-and-lines"] :is(li, h1.title-link, .terms), html:not(.js) .side .subtitle { opacity: 1; }

/* touch: every target reaches 44px under a finger; the hit area grows, the type does not move */
@media (pointer: coarse) {
  .nav .menu::before, .cta::before, footer ul a::before, .side .terms a::before, .flow .read a::before, .doc-cta a::before, .side li a::before, .brand::before, .nav .pill::before { content: ""; position: absolute; inset: -10px -6px; }
  .nav .menu::before { inset: -10px; }
  .nav .pill::before { inset: -3px 0; }
  .side li a::before { inset: -6px 0; }
  .cta, footer ul a, .side .terms a, .flow .read a, .doc-cta a, .brand, .nav .pill { position: relative; }
  .side li a { padding-block: 6px; }
  footer ul { gap: 20px; }
  .filter { min-height: 44px; }
}

/* reduced motion: nothing is scrubbed, so nothing needs the scroll held for it; the film is its last frame on one screen */
@media (prefers-reduced-motion: reduce) {
  .gate, .gate.eat { height: 0; }
  .act { height: 100svh; }
  .lineart { display: none; }   /* no line drawing resolving into the painting: the painting, when it arrives */
}