/* escort-02 — flame and gold on a plum night, a geometric sans, square corners. */

:root {
    --night: #160f1b;
    --plate: #211828;
    --edge: #3a2c45;
    --text: #f7eef5;
    --dim: #b7a6bd;
    --flame: #ff5c3d;
    --flame-soft: #ff8a66;
    --gold: #ffb199;
}

* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
    margin: 0;
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    background: var(--night);
    color: var(--text);
    font: 15px/1.5 "Avenir Next", Avenir, "Century Gothic", Futura, sans-serif;
}
a { color: inherit; }
img, video { display: block; max-width: 100%; }
h1, h2 { font-weight: 700; letter-spacing: -.01em; }

/* Header: the name left, three links right, one flame button. */
.masthead { border-bottom: 1px solid var(--edge); }
.masthead-row {
    max-width: 1240px; margin: 0 auto; padding: 12px 20px;
    display: flex; align-items: center; gap: 20px; flex-wrap: wrap;
}
/* The logo is the picture; the name stays in the link for a reader that cannot see it. */
.logo-slot {
    display: block; margin-right: auto; width: 154px; height: 36px; font-size: 0; line-height: 0; color: transparent;
    background: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxMzYuNzkzOTM5IDMyIiB3aWR0aD0iMTUzLjg5MzE4MiIgaGVpZ2h0PSIzNiIgcm9sZT0iaW1nIiBhcmlhLWxhYmVsPSJOYXR0bHlzIj48ZyBmaWxsPSIjZmY1YzNkIj48cGF0aCBkPSJNOC41IDE5IEM4LjUgMTIgMTEuNSA4IDE2IDggQzIwLjUgOCAyMy41IDEyIDIzLjUgMTkgWiIvPjxyZWN0IHg9IjE1IiB5PSIxOSIgd2lkdGg9IjIiIGhlaWdodD0iNyIvPjxyZWN0IHg9IjEwIiB5PSIyNiIgd2lkdGg9IjEyIiBoZWlnaHQ9IjMuMiIgcng9IjEuNiIvPjxnIHN0cm9rZT0iI2ZmNWMzZCIgc3Ryb2tlLXdpZHRoPSIxLjgiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgZmlsbD0ibm9uZSI+PHBhdGggZD0iTTE2IDEuOCBWNCIvPjxwYXRoIGQ9Ik01LjUgNS41IEw3LjIgNyIvPjxwYXRoIGQ9Ik0yNi41IDUuNSBMMjQuOCA3Ii8+PC9nPjwvZz48ZyBmaWxsPSIjZjdlZWY1Ij48cGF0aCBkPSJNNTcuODIwNjE0MzQ2NTkwOTEgOC4wVjI0LjBINTQuMDExMTQxNjkwMzQwOTFMNDguNDA3Mjc2ODcwMjY1MTUgMTQuNTkyOTg2NTA1NjgxODE4TDQ3LjAyMzUyMzMxOTEyODc4NSAxMS45ODMwNTIyMDE3MDQ1NDVINDYuOTkwMDY4NjU1MzAzMDM0TDQ3LjA4NzAzODM1MjI3MjczIDE0LjczODkzNTI1MDk0Njk3VjI0LjBINDQuMDgzODcxOTIyMzQ4NDg2VjguMEg0Ny44OTMzNDQ1Nzg1OTg0OUw1My40ODIxNzkyMTQwMTUxNSAxNy4zODYxNjUzNjQ1ODMzMzRMNTQuODgwOTYyOTQ5ODEwNjEgMjAuMDMxOTc3OTgyOTU0NTQ0SDU0LjkxNDQxNzYxMzYzNjM2TDU0LjgxNzQ0NzkxNjY2NjY2NiAxNy4yNjEwNjQ3NDkwNTMwM1Y4LjBaIi8+PHBhdGggZD0iTTY5Ljc4MTgxODE4MTgxODE4IDE2LjI2NjY2NjY2NjY2NjY2NlE2OS43ODE4MTgxODE4MTgxOCAxNS4yMjQyNDI0MjQyNDI0MjUgNjkuMTg3ODc4Nzg3ODc4NzkgMTQuNjQyNDI0MjQyNDI0MjQzUTY4LjU5MzkzOTM5MzkzOTQgMTQuMDYwNjA2MDYwNjA2MDYgNjcuNjI0MjQyNDI0MjQyNDIgMTQuMDYwNjA2MDYwNjA2MDZRNjYuNzI3MjcyNzI3MjcyNzIgMTQuMDYwNjA2MDYwNjA2MDYgNjYuMDQ4NDg0ODQ4NDg0ODUgMTQuNTIxMjEyMTIxMjEyMTIxUTY1LjM2OTY5Njk2OTY5Njk3IDE0Ljk4MTgxODE4MTgxODE4MiA2NS4wNTQ1NDU0NTQ1NDU0NSAxNi4wNDg0ODQ4NDg0ODQ4NDdMNjIuMjE4MTgxODE4MTgxODIgMTUuMTc1NzU3NTc1NzU3NTc2UTYyLjYzMDMwMzAzMDMwMzAyNSAxMy41NzU3NTc1NzU3NTc1NzYgNjQuMDI0MjQyNDI0MjQyNDMgMTIuNjA2MDYwNjA2MDYwNjA2UTY1LjQxODE4MTgxODE4MTgyIDExLjYzNjM2MzYzNjM2MzYzNyA2Ny43Njk2OTY5Njk2OTY5NyAxMS42MzYzNjM2MzYzNjM2MzdRNjkuMzY5Njk2OTY5Njk2OTcgMTEuNjM2MzYzNjM2MzYzNjM3IDcwLjU1NzU3NTc1NzU3NTc2IDEyLjEzMzMzMzMzMzMzMzMzM1E3MS43NDU0NTQ1NDU0NTQ1NSAxMi42MzAzMDMwMzAzMDMwMyA3Mi40MTIxMjEyMTIxMjEyIDEzLjYyNDI0MjQyNDI0MjQyNVE3My4wNzg3ODc4Nzg3ODc4OCAxNC42MTgxODE4MTgxODE4MTkgNzMuMDc4Nzg3ODc4Nzg3ODggMTYuMTIxMjEyMTIxMjEyMTJWMjEuMDQyNDI0MjQyNDI0MjQzUTczLjA3ODc4Nzg3ODc4Nzg4IDIxLjk2MzYzNjM2MzYzNjM2NSA3My45NTE1MTUxNTE1MTUxNSAyMS45NjM2MzYzNjM2MzYzNjVRNzQuMzYzNjM2MzYzNjM2MzYgMjEuOTYzNjM2MzYzNjM2MzY1IDc0LjcyNzI3MjcyNzI3MjcyIDIxLjg0MjQyNDI0MjQyNDI0NEw3NC41MzMzMzMzMzMzMzMzMyAyMy45MDMwMzAzMDMwMzAzMDJRNzMuOTAzMDMwMzAzMDMwMyAyNC4yMTgxODE4MTgxODE4MiA3Mi45NTc1NzU3NTc1NzU3NSAyNC4yMTgxODE4MTgxODE4MlE3Mi4xMDkwOTA5MDkwOTA5MSAyNC4yMTgxODE4MTgxODE4MiA3MS40MzAzMDMwMzAzMDMwNCAyMy45MjcyNzI3MjcyNzI3M1E3MC43NTE1MTUxNTE1MTUxNSAyMy42MzYzNjM2MzYzNjM2MzcgNzAuMzYzNjM2MzYzNjM2MzYgMjMuMDQyNDI0MjQyNDI0MjQzUTY5Ljk3NTc1NzU3NTc1NzU3IDIyLjQ0ODQ4NDg0ODQ4NDg1IDY5Ljk3NTc1NzU3NTc1NzU3IDIxLjU1MTUxNTE1MTUxNTE1VjIxLjQ1NDU0NTQ1NDU0NTQ1M0w3MC41NTc1NzU3NTc1NzU3NiAyMS4zNTc1NzU3NTc1NzU3NlE3MC40MTIxMjEyMTIxMjEyIDIyLjI3ODc4Nzg3ODc4Nzg3NyA2OS43NTc1NzU3NTc1NzU3NSAyMi45MjEyMTIxMjEyMTIxMjJRNjkuMTAzMDMwMzAzMDMwMyAyMy41NjM2MzYzNjM2MzYzNjMgNjguMTY5Njk2OTY5Njk2OTYgMjMuOTAzMDMwMzAzMDMwMzAyUTY3LjIzNjM2MzYzNjM2MzYzIDI0LjI0MjQyNDI0MjQyNDI0MiA2Ni4yNDI0MjQyNDI0MjQyNCAyNC4yNDI0MjQyNDI0MjQyNDJRNjUuMDA2MDYwNjA2MDYwNiAyNC4yNDI0MjQyNDI0MjQyNDIgNjQuMTA5MDkwOTA5MDkwOTEgMjMuODY2NjY2NjY2NjY2NjY3UTYzLjIxMjEyMTIxMjEyMTIxIDIzLjQ5MDkwOTA5MDkwOTA5MiA2Mi43MjcyNzI3MjcyNzI3MyAyMi43NjM2MzYzNjM2MzYzNjVRNjIuMjQyNDI0MjQyNDI0MjQgMjIuMDM2MzYzNjM2MzYzNjM1IDYyLjI0MjQyNDI0MjQyNDI0IDIwLjk2OTY5Njk2OTY5Njk3UTYyLjI0MjQyNDI0MjQyNDI0IDE5LjYxMjEyMTIxMjEyMTIxMyA2My4xMTUxNTE1MTUxNTE1MSAxOC43NTE1MTUxNTE1MTUxNVE2My45ODc4Nzg3ODc4Nzg3ODUgMTcuODkwOTA5MDkwOTA5MDkgNjUuNjEyMTIxMjEyMTIxMjEgMTcuNTc1NzU3NTc1NzU3NTc4TDcwLjE2OTY5Njk2OTY5Njk3IDE2LjY1NDU0NTQ1NDU0NTQ1Nkw3MC4xNDU0NTQ1NDU0NTQ1NCAxOC43MTUxNTE1MTUxNTE1MTVMNjcuMjM2MzYzNjM2MzYzNjMgMTkuMjk2OTY5Njk2OTY5Njk3UTY2LjQxMjEyMTIxMjEyMTIgMTkuNDY2NjY2NjY2NjY2NjcgNjUuOTg3ODc4Nzg3ODc4NzggMTkuNzQ1NDU0NTQ1NDU0NTQ2UTY1LjU2MzYzNjM2MzYzNjM2IDIwLjAyNDI0MjQyNDI0MjQyNCA2NS41NjM2MzYzNjM2MzYzNiAyMC42NTQ1NDU0NTQ1NDU0NTZRNjUuNTYzNjM2MzYzNjM2MzYgMjEuMjYwNjA2MDYwNjA2MDYgNjYuMDEyMTIxMjEyMTIxMiAyMS41NzU3NTc1NzU3NTc1NzhRNjYuNDYwNjA2MDYwNjA2MDUgMjEuODkwOTA5MDkwOTA5MDkgNjcuMDkwOTA5MDkwOTA5MSAyMS44OTA5MDkwOTA5MDkwOVE2Ny42IDIxLjg5MDkwOTA5MDkwOTA5IDY4LjA4NDg0ODQ4NDg0ODQ4IDIxLjc2OTY5Njk2OTY5Njk3UTY4LjU2OTY5Njk2OTY5Njk2IDIxLjY0ODQ4NDg0ODQ4NDg1IDY4Ljk1NzU3NTc1NzU3NTc1IDIxLjM4MTgxODE4MTgxODE4M1E2OS4zNDU0NTQ1NDU0NTQ1NCAyMS4xMTUxNTE1MTUxNTE1MTcgNjkuNTYzNjM2MzYzNjM2MzYgMjAuNjU0NTQ1NDU0NTQ1NDU2UTY5Ljc4MTgxODE4MTgxODE4IDIwLjE5MzkzOTM5MzkzOTM5NSA2OS43ODE4MTgxODE4MTgxOCAxOS41MzkzOTM5MzkzOTM5NFoiLz48cGF0aCBkPSJNODIuMjgxNzA4Njg4NDQ2OTcgOC4xNzg0MjA5MjgwMzAzMDJWMjAuMDQ2NTM3NjQyMDQ1NDU0UTgyLjI4MTcwODY4ODQ0Njk3IDIwLjkxNTg3MDYyMDI2NTE1MyA4Mi43MzA5MjAwNDAyNDYyMiAyMS4zMTk5OTE0MTgwODcxMlE4My4xODAxMzEzOTIwNDU0NSAyMS43MjQxMTIyMTU5MDkwOSA4My45NjE3MDY5MTI4Nzg3OCAyMS43MjQxMTIyMTU5MDkwOVE4NC41ODE4MjcwNTk2NTkwOSAyMS43MjQxMTIyMTU5MDkwOSA4NS4wMzU2NDQ1MzEyNSAyMS41NDYxNzM2NTA1NjgxODJRODUuNDg5NDYyMDAyODQwOTEgMjEuMzY4MjM1MDg1MjI3MjczIDg1Ljg2NDczNDI1NjYyODc4IDIxLjA0ODIzNjI2ODkzOTM5NEw4Ni4zNzc3MDE4MjI5MTY2NiAyMy4yNTI4NDk3ODY5MzE4MlE4NS44MDE3MDE1ODYxNzQyMyAyMy43MTU4Nzk0OTgxMDYwNjIgODQuOTMyMTI0NDY3MzI5NTQgMjMuOTc5MTUxODcwMjY1MTUyUTg0LjA2MjU0NzM0ODQ4NDg0IDI0LjI0MjQyNDI0MjQyNDI0MiA4My4wOTYyNDQ2NzMyOTU0NCAyNC4yNDI0MjQyNDI0MjQyNDJRODEuODgwMjQwODg1NDE2NjcgMjQuMjQyNDI0MjQyNDI0MjQyIDgwLjk0NjY2MzQxMTQ1ODMzIDIzLjg3ODMwMjU1NjgxODE4NFE4MC4wMTMwODU5Mzc1IDIzLjUxNDE4MDg3MTIxMjEyMyA3OS40OTQyOTc0NjY4NTYwNSAyMi43MTE1MTMwODAwMTg5NFE3OC45NzU1MDg5OTYyMTIxMSAyMS45MDg4NDUyODg4MjU3NiA3OC45NjA0Nzg4MTE1NTMwMyAyMC41ODg2MDA4NTIyNzI3MjdWOS4wOTg2NjgzMjM4NjM2MzZaTTg2LjE3Nzk0NDQ4MzkwMTUxIDExLjg3ODc4Nzg3ODc4Nzg3OVYxNC4zNDM3Njc3NTU2ODE4MTlINzYuNzQ4MTE3ODk3NzI3MjdWMTEuODc4Nzg3ODc4Nzg3ODc5WiIvPjxwYXRoIGQ9Ik05My45MTgwNzIzMjQ4MTA2MSA4LjE3ODQyMDkyODAzMDMwMlYyMC4wNDY1Mzc2NDIwNDU0NTRROTMuOTE4MDcyMzI0ODEwNjEgMjAuOTE1ODcwNjIwMjY1MTUzIDk0LjM2NzI4MzY3NjYwOTg0IDIxLjMxOTk5MTQxODA4NzEyUTk0LjgxNjQ5NTAyODQwOTEgMjEuNzI0MTEyMjE1OTA5MDkgOTUuNTk4MDcwNTQ5MjQyNDIgMjEuNzI0MTEyMjE1OTA5MDlROTYuMjE4MTkwNjk2MDIyNzMgMjEuNzI0MTEyMjE1OTA5MDkgOTYuNjcyMDA4MTY3NjEzNjQgMjEuNTQ2MTczNjUwNTY4MTgyUTk3LjEyNTgyNTYzOTIwNDU1IDIxLjM2ODIzNTA4NTIyNzI3MyA5Ny41MDEwOTc4OTI5OTI0MiAyMS4wNDgyMzYyNjg5MzkzOTRMOTguMDE0MDY1NDU5MjgwMyAyMy4yNTI4NDk3ODY5MzE4MlE5Ny40MzgwNjUyMjI1Mzc4NyAyMy43MTU4Nzk0OTgxMDYwNjIgOTYuNTY4NDg4MTAzNjkzMTcgMjMuOTc5MTUxODcwMjY1MTUyUTk1LjY5ODkxMDk4NDg0ODQ4IDI0LjI0MjQyNDI0MjQyNDI0MiA5NC43MzI2MDgzMDk2NTkwOCAyNC4yNDI0MjQyNDI0MjQyNDJROTMuNTE2NjA0NTIxNzgwMzEgMjQuMjQyNDI0MjQyNDI0MjQyIDkyLjU4MzAyNzA0NzgyMTk3IDIzLjg3ODMwMjU1NjgxODE4NFE5MS42NDk0NDk1NzM4NjM2MyAyMy41MTQxODA4NzEyMTIxMjMgOTEuMTMwNjYxMTAzMjE5NyAyMi43MTE1MTMwODAwMTg5NFE5MC42MTE4NzI2MzI1NzU3NSAyMS45MDg4NDUyODg4MjU3NiA5MC41OTY4NDI0NDc5MTY2NyAyMC41ODg2MDA4NTIyNzI3MjdWOS4wOTg2NjgzMjM4NjM2MzZaTTk3LjgxNDMwODEyMDI2NTE1IDExLjg3ODc4Nzg3ODc4Nzg3OVYxNC4zNDM3Njc3NTU2ODE4MTlIODguMzg0NDgxNTM0MDkwOTFWMTEuODc4Nzg3ODc4Nzg3ODc5WiIvPjxwYXRoIGQ9Ik0xMDQuNTQ1NDY2MzgyNTc1NzcgNi41NzkzOTc0OTA1MzAzMDQ1VjIwLjI1NzkzMDg3MTIxMjEyUTEwNC41NDU0NjYzODI1NzU3NyAyMS4xMDU0NDUwNzU3NTc1NzYgMTA0LjgzODc5OTEyNDA1MzA0IDIxLjQ1MjM1NDEwNzQ4MTA2UTEwNS4xMzIxMzE4NjU1MzAzMSAyMS43OTkyNjMxMzkyMDQ1NDUgMTA1LjgwOTk0OTEwMDM3ODc5IDIxLjc5OTI2MzEzOTIwNDU0NVExMDYuMjExODg3NDI4OTc3MjggMjEuNzk5MjYzMTM5MjA0NTQ1IDEwNi40ODU1ODM4NjYwMDM4IDIxLjc0MDM1NDIyNTg1MjI3MlExMDYuNzU5MjgwMzAzMDMwMzEgMjEuNjgxNDQ1MzEyNSAxMDcuMTYzNjQyMjgyMTk2OTcgMjEuNTQyNzc5MzU2MDYwNjA2TDEwNi44NzYxMjc0ODU3OTU0NiAyMy43MzcyMDk5OTA1MzAzMDNRMTA2LjQ2MDYxMTk3OTE2NjY3IDIzLjk3MTM5MjYzNzMxMDYwOCAxMDUuODQ4MDAzOTY1NDM1NjEgMjQuMTA2OTA4NDM5ODY3NDI1UTEwNS4yMzUzOTU5NTE3MDQ1NSAyNC4yNDI0MjQyNDI0MjQyNDIgMTA0LjYyMTU3NjExMjY4OTQgMjQuMjQyNDI0MjQyNDI0MjQyUTEwMi44NDc5OTY1NjcyMzQ4NiAyNC4yNDI0MjQyNDI0MjQyNDIgMTAyLjAzNjExNjUzNjQ1ODM0IDIzLjM3NzkzODU2NTM0MDkxUTEwMS4yMjQyMzY1MDU2ODE4MiAyMi41MTM0NTI4ODgyNTc1NzUgMTAxLjIyNDIzNjUwNTY4MTgyIDIwLjYyNTQ0OTgxMDYwNjA2VjYuNTc5Mzk3NDkwNTMwMzA0NVoiLz48cGF0aCBkPSJNMTIxLjYxMjEzMzA0OTI0MjQyIDExLjg3ODc4Nzg3ODc4Nzg3OSAxMTYuNzI1ODQwNDM1NjA2MDYgMjQuNzQ2NjUwMDk0Njk2OTdRMTE2LjEzNjI2MzAyMDgzMzMzIDI2LjM5NTE0MDg2MTc0MjQyMyAxMTUuNDI0OTg4MTYyODc4NzggMjcuMzcxNjI5Mzc5NzM0ODVRMTE0LjcxMzcxMzMwNDkyNDI0IDI4LjM0ODExNzg5NzcyNzI3IDExMy43Nzk4OTE2OTAzNDA5IDI4Ljc4MDExOTU1NDkyNDI0UTExMi44NDYwNzAwNzU3NTc1NyAyOS4yMTIxMjEyMTIxMjEyMSAxMTEuNTU4NzkyMDIxNzgwMyAyOS4yMTIxMjEyMTIxMjEyMVExMTAuNjA1NTc4MjQzMzcxMjEgMjkuMjEyMTIxMjEyMTIxMjEgMTA5LjgxNzk0MDYzNjgzNzEyIDI4Ljk4NjQyNDMwMTYwOTg0OFExMDkuMDMwMzAzMDMwMzAzMDMgMjguNzYwNzI3MzkxMDk4NDg0IDEwOC40NDE2OTYyNTk0Njk3IDI4LjM4MjA2MDg0MjgwMzAzTDEwOS4xNTkyNzQzODQ0Njk3IDI1Ljk5NDE3MzE3NzA4MzMzM1ExMDkuNjA3MjczOTEwOTg0ODQgMjYuMzQ3NjI2NjU3MTk2OTcgMTEwLjExNTg3OTQ5ODEwNjA1IDI2LjUxMjIzMjE4NTEzMjU3NVExMTAuNjI0NDg1MDg1MjI3MjYgMjYuNjc2ODM3NzEzMDY4MTggMTExLjI4Njc4OTc3MjcyNzI3IDI2LjY3NjgzNzcxMzA2ODE4UTExMS45NzIzNjYyNDA1MzAzIDI2LjY3NjgzNzcxMzA2ODE4IDExMi40NjA4NTAyMDEyMzEwNyAyNi4zODEwODEzMjEwMjI3MjdRMTEyLjk0OTMzNDE2MTkzMTgyIDI2LjA4NTMyNDkyODk3NzI3MiAxMTMuMjkwMTgxMTA3OTU0NTQgMjUuMjEwNjYyMjg2OTMxODE4TDExMy43MDg2MDI2Mjc4NDA5IDI0LjE2MDAwMjM2NzQyNDI0TDExMi4zNzY3MjIzMDExMzYzNSAyMS4wMTcyMTExNzQyNDI0MjNMMTA4LjY2OTU3MjY3OTkyNDI0IDExLjg3ODc4Nzg3ODc4Nzg3OUgxMTIuMzQ5NTkxNjE5MzE4MThMMTE0LjY0MjkxNTQ4Mjk1NDU0IDE5LjE1NTM4NTg5MDE1MTUxNEwxMTUuMjgzODgzNzU5NDY5NjkgMjEuNTcwOTA0MzU2MDYwNjA2TDExNi4wMjc2Mzk2NzgwMzAzIDE4Ljk5NTg3MTgwMzk3NzI3M0wxMTguMjQ2NzgzMjYyMzEwNiAxMS44Nzg3ODc4Nzg3ODc4NzlaIi8+PHBhdGggZD0iTTEyOS41MTUxNTE1MTUxNTE1IDI0LjI0MjQyNDI0MjQyNDI0MlExMjcuNjcyNzI3MjcyNzI3MjcgMjQuMjQyNDI0MjQyNDI0MjQyIDEyNi4xNTc1NzU3NTc1NzU3NiAyMy41ODc4Nzg3ODc4Nzg3ODZRMTI0LjY0MjQyNDI0MjQyNDI0IDIyLjkzMzMzMzMzMzMzMzMzNCAxMjMuNjk2OTY5Njk2OTY5NyAyMS43NDU0NTQ1NDU0NTQ1NDZMMTI1LjYxMjEyMTIxMjEyMTIxIDE5LjgwNjA2MDYwNjA2MDYwNVExMjYuMTkzOTM5MzkzOTM5MzkgMjAuNjc4Nzg3ODc4Nzg3ODggMTI3LjE2MzYzNjM2MzYzNjM2IDIxLjIzNjM2MzYzNjM2MzYzNVExMjguMTMzMzMzMzMzMzMzMzMgMjEuNzkzOTM5MzkzOTM5MzkzIDEyOS40NjY2NjY2NjY2NjY2NyAyMS43OTM5MzkzOTM5MzkzOTNRMTMwLjQxMjEyMTIxMjEyMTIgMjEuNzkzOTM5MzkzOTM5MzkzIDEzMC45ODE4MTgxODE4MTgyIDIxLjUxNTE1MTUxNTE1MTUxNlExMzEuNTUxNTE1MTUxNTE1MTYgMjEuMjM2MzYzNjM2MzYzNjM1IDEzMS41NTE1MTUxNTE1MTUxNiAyMC42MzAzMDMwMzAzMDMwM1ExMzEuNTUxNTE1MTUxNTE1MTYgMjAuMjQyNDI0MjQyNDI0MjQyIDEzMS4yODQ4NDg0ODQ4NDg1IDE5Ljk2MzYzNjM2MzYzNjM2UTEzMS4wMTgxODE4MTgxODE4MyAxOS42ODQ4NDg0ODQ4NDg0ODQgMTMwLjIxODE4MTgxODE4MTgyIDE5LjUxNTE1MTUxNTE1MTUxNkwxMjguMDg0ODQ4NDg0ODQ4NSAxOS4wNzg3ODc4Nzg3ODc4NzhRMTI1Ljk3NTc1NzU3NTc1NzU3IDE4LjY0MjQyNDI0MjQyNDI0IDEyNS4wOTA5MDkwOTA5MDkxIDE3Ljc1NzU3NTc1NzU3NTc1OFExMjQuMjA2MDYwNjA2MDYwNiAxNi44NzI3MjcyNzI3MjcyNzUgMTI0LjIwNjA2MDYwNjA2MDYgMTUuNDY2NjY2NjY2NjY2NjY3UTEyNC4yMDYwNjA2MDYwNjA2IDE0LjQ3MjcyNzI3MjcyNzI3MyAxMjQuOCAxMy42UTEyNS4zOTM5MzkzOTM5MzkzOSAxMi43MjcyNzI3MjcyNzI3MjcgMTI2LjU4MTgxODE4MTgxODE4IDEyLjE4MTgxODE4MTgxODE4MlExMjcuNzY5Njk2OTY5Njk2OTcgMTEuNjM2MzYzNjM2MzYzNjM3IDEyOS41MzkzOTM5MzkzOTM5MyAxMS42MzYzNjM2MzYzNjM2MzdRMTMxLjM1NzU3NTc1NzU3NTc1IDExLjYzNjM2MzYzNjM2MzYzNyAxMzIuNzAzMDMwMzAzMDMwMyAxMi4yMDYwNjA2MDYwNjA2MDdRMTM0LjA0ODQ4NDg0ODQ4NDg2IDEyLjc3NTc1NzU3NTc1NzU3NSAxMzQuODI0MjQyNDI0MjQyNCAxMy44OTA5MDkwOTA5MDkwOUwxMzIuODM2MzYzNjM2MzYzNjQgMTUuODMwMzAzMDMwMzAzMDNRMTMyLjMwMzAzMDMwMzAzMDMgMTQuOTgxODE4MTgxODE4MTgyIDEzMS40NDI0MjQyNDI0MjQyNCAxNC41MzMzMzMzMzMzMzMzMzNRMTMwLjU4MTgxODE4MTgxODIgMTQuMDg0ODQ4NDg0ODQ4NDg0IDEyOS42MzYzNjM2MzYzNjM2MyAxNC4wODQ4NDg0ODQ4NDg0ODRRMTI4Ljk1NzU3NTc1NzU3NTc3IDE0LjA4NDg0ODQ4NDg0ODQ4NCAxMjguNDcyNzI3MjcyNzI3MjcgMTQuMjMwMzAzMDMwMzAzMDNRMTI3Ljk4Nzg3ODc4Nzg3ODc4IDE0LjM3NTc1NzU3NTc1NzU3NSAxMjcuNzQ1NDU0NTQ1NDU0NTUgMTQuNjMwMzAzMDMwMzAzMDI5UTEyNy41MDMwMzAzMDMwMzAzIDE0Ljg4NDg0ODQ4NDg0ODQ4NSAxMjcuNTAzMDMwMzAzMDMwMyAxNS4yNzI3MjcyNzI3MjcyNzNRMTI3LjUwMzAzMDMwMzAzMDMgMTUuNjYwNjA2MDYwNjA2MDYgMTI3Ljg0MjQyNDI0MjQyNDI0IDE1LjkzOTM5MzkzOTM5Mzk0UTEyOC4xODE4MTgxODE4MTgyIDE2LjIxODE4MTgxODE4MTgyIDEyOS4wNzg3ODc4Nzg3ODc5IDE2LjQxMjEyMTIxMjEyMTIxNEwxMzEuNTUxNTE1MTUxNTE1MTYgMTYuOTIxMjEyMTIxMjEyMTIyUTEzMy4zNDU0NTQ1NDU0NTQ1NCAxNy4yODQ4NDg0ODQ4NDg0ODUgMTM0LjEyMTIxMjEyMTIxMjEyIDE4LjE0NTQ1NDU0NTQ1NDU0OFExMzQuODk2OTY5Njk2OTY5NyAxOS4wMDYwNjA2MDYwNjA2MDggMTM0Ljg5Njk2OTY5Njk2OTcgMjAuMjE4MTgxODE4MTgxODJRMTM0Ljg5Njk2OTY5Njk2OTcgMjEuMzgxODE4MTgxODE4MTgzIDEzNC4yNzg3ODc4Nzg3ODc4OCAyMi4yOTA5MDkwOTA5MDkwOVExMzMuNjYwNjA2MDYwNjA2MDYgMjMuMiAxMzIuNDYwNjA2MDYwNjA2MDQgMjMuNzIxMjEyMTIxMjEyMTJRMTMxLjI2MDYwNjA2MDYwNjA1IDI0LjI0MjQyNDI0MjQyNDI0MiAxMjkuNTE1MTUxNTE1MTUxNSAyNC4yNDI0MjQyNDI0MjQyNDJaIi8+PC9nPjwvc3ZnPgo=") no-repeat left center / contain; text-decoration: none;
}
.menu-list { display: flex; align-items: center; gap: 20px; }
.menu-list a { text-decoration: none; color: var(--dim); font-size: 14px; font-weight: 600; letter-spacing: .04em; text-transform: uppercase; }
.menu-list a:hover { color: var(--text); }
.menu-list .menu-join { color: var(--night); background: var(--flame); padding: 8px 14px; }
.menu-list .menu-join:hover { color: var(--night); background: var(--flame-soft); }
.menu-switch { position: absolute; opacity: 0; pointer-events: none; }
.menu-button { display: none; }

/* On a phone the links fold behind one button: three links wrapping onto extra lines
   push the faces off the first screen. */
@media (max-width: 760px) {
    .menu-button { display: block; position: relative; width: 38px; height: 34px; cursor: pointer; border: 1px solid var(--edge); }
    .menu-button i, .menu-button i::before, .menu-button i::after {
        content: ""; position: absolute; left: 9px; right: 9px; height: 2px; background: var(--text);
    }
    .menu-button i { top: 16px; }
    .menu-button i::before { top: -6px; left: 0; right: 0; }
    .menu-button i::after { top: 6px; left: 0; right: 0; }
    .menu-list { display: none; flex-basis: 100%; flex-direction: column; align-items: flex-start; gap: 14px; padding: 6px 0; }
    .menu-switch:checked ~ .menu-list { display: flex; }
    .menu-switch:focus-visible + .menu-button { outline: 2px solid var(--flame); }
}

/* Places across the top, at most two rows on the desktop, one swiped row on a phone. */
.where-strip { background: var(--plate); border-bottom: 1px solid var(--edge); }
.where-chips {
    max-width: 1240px; margin: 0 auto; padding: 10px 20px; list-style: none;
    display: flex; flex-wrap: wrap; gap: 8px;
}
.where-chip {
    display: inline-flex; align-items: baseline; gap: 6px; padding: 5px 11px;
    border: 1px solid var(--edge); text-decoration: none; font-size: 14px; white-space: nowrap;
}
.where-chip small { color: var(--dim); font-size: 12px; }
.where-chip:hover { border-color: var(--flame); }
.where-chip.is-here { background: var(--flame); border-color: var(--flame); color: var(--night); font-weight: 700; }
.where-chip.is-here small { color: var(--night); }
.where-chip.where-all { color: var(--gold); border-color: transparent; }
@media (max-width: 760px) {
    .where-chips { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; }
}

.sheet { flex: 1 0 auto; width: 100%; max-width: 1240px; margin: 0 auto; padding: 22px 20px 56px; }

.intro { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 16px; margin-bottom: 16px; }
.intro h1 { margin: 0; font-size: 28px; line-height: 1.15; }
.intro p { margin: 0; color: var(--dim); font-size: 14px; }

/* The wall of faces: tiles twice the first size (review 2026-10-06: «not so small — about
   twice as big»), the caption laid over the photo on a shade. */
.wall {
    list-style: none; margin: 0; padding: 0;
    display: grid; grid-template-columns: repeat(auto-fill, minmax(208px, 1fr)); gap: 14px;
}
.wall > li { min-width: 0; }
.cameo {
    display: block; position: relative; max-width: 240px; margin: 0 auto;
    outline: 1px solid var(--edge); text-decoration: none; overflow: hidden;
}
.cameo:hover { outline: 2px solid var(--flame); }
/* height: auto is what lets aspect-ratio work: the img's own height attribute wins
   over aspect-ratio otherwise. */
.cameo-shot { width: 100%; height: auto; aspect-ratio: 3 / 4; object-fit: cover; object-position: top; background: var(--plate); }
.cameo-blank { display: block; }
.cameo-label {
    position: absolute; left: 0; right: 0; bottom: 0; padding: 34px 12px 10px;
    background: linear-gradient(to top, rgba(22, 15, 27, .92), rgba(22, 15, 27, 0));
    display: flex; flex-direction: column; line-height: 1.2;
}
.cameo-label b { font-size: 17px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cameo-label small { font-size: 14px; color: var(--gold); font-weight: 600; font-variant-numeric: tabular-nums; }
/* Video: a play sign in a ring, top right — a sign, not a word. */
.cameo-play {
    position: absolute; top: 10px; right: 10px; width: 30px; height: 30px; border-radius: 50%;
    border: 1.5px solid #fff; background: rgba(22, 15, 27, .55);
}
.cameo-play::after {
    content: ""; position: absolute; top: 50%; left: 55%; transform: translate(-50%, -50%);
    border-style: solid; border-width: 7px 0 7px 11px; border-color: transparent transparent transparent #fff;
}

/* The row of pages, centred under the wall: a lone number in 14px sat at the left edge
   and was called barely visible (operator review, 2026-09-29). No font-size of its own
   now — the page's own 15px carries it above the 15px floor. Every link at least 36px
   tall for a thumb, the current page a flame pill. 40px clears the 32px floor with
   room — 26px alone read as stuck to the wall (review 2026-09-29). */
.pager { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 10px; margin-top: 40px; }
.pager-step {
    display: inline-flex; align-items: center; min-height: 36px; box-sizing: border-box;
    padding: 9px 16px; border: 1px solid var(--edge); text-decoration: none;
}
.pager-step:hover { border-color: var(--flame); color: var(--flame); }
.pager-row { display: flex; align-items: center; flex-wrap: wrap; justify-content: center; gap: 4px; }
.pager-num {
    display: inline-flex; align-items: center; justify-content: center;
    min-width: 36px; min-height: 36px; box-sizing: border-box; padding: 0 6px; text-decoration: none;
}
.pager-num:hover { background: var(--plate); }
.pager-num.is-here { background: var(--flame); color: var(--night); font-weight: 700; }
.pager-gap { display: inline-flex; align-items: center; justify-content: center; min-width: 20px; color: var(--dim); }

.aside-text { margin-top: 44px; max-width: 72ch; color: #ddd0dc; }
.aside-text h2 { margin: 26px 0 8px; font-size: 18px; color: var(--text); }
.qa dt { margin-top: 12px; font-weight: 700; color: var(--text); }
.qa dd { margin: 2px 0 0; color: var(--dim); }

/* Index of places */
.index-grid { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 0 24px; }
.index-grid a { display: flex; justify-content: space-between; gap: 10px; padding: 8px 2px; border-bottom: 1px solid var(--edge); text-decoration: none; }
.index-grid a:hover { color: var(--flame); }
.index-grid small { color: var(--dim); font-variant-numeric: tabular-nums; }

/* Profile */
.portrait-top { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 18px; margin-bottom: 14px; }
.portrait-top h1 { margin: 0; font-size: 30px; }
.portrait-top h1 span { color: var(--gold); font-weight: 600; }
.portrait-where { color: var(--flame); font-size: 14px; text-decoration: none; }

/* The reel: every frame in one row, snapping as it scrolls. */
.reel-track {
    display: flex; gap: 6px; overflow-x: auto; scroll-snap-type: x mandatory; scroll-behavior: smooth;
    scrollbar-color: var(--edge) transparent;
}
.reel-track > * { flex: 0 0 auto; height: 520px; width: auto; aspect-ratio: 3 / 4; object-fit: cover; scroll-snap-align: start; background: var(--plate); }
@media (max-width: 600px) { .reel-track > * { height: auto; width: 86vw; } }
/* A video stands in the reel as a frame, not a bare player: a grey box without a
   poster and black bands around a clip cut to another ratio were both "crooked" on
   review (2026-09-30). The frame keeps the reel's own 3:4 bound. */
.reel-video { position: relative; overflow: hidden; background: var(--night); }
.reel-video-poster { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.reel-video-blank { background: linear-gradient(135deg, var(--plate), var(--edge)); }
.reel-video-play {
    position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);
    width: 64px; height: 64px; border-radius: 50%; border: 2px solid var(--text);
    background: rgba(22, 15, 27, .55); display: flex; align-items: center; justify-content: center;
}
.reel-video-play::before {
    content: ""; margin-left: 5px; border-style: solid; border-width: 12px 0 12px 20px;
    border-color: transparent transparent transparent var(--text);
}
.reel-index { list-style: none; margin: 8px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 6px; }
.reel-index a { display: block; position: relative; width: 56px; height: 56px; overflow: hidden; background: var(--plate); }
.reel-index img { width: 100%; height: 100%; object-fit: cover; object-position: top; }
.reel-index a:hover { outline: 2px solid var(--flame); }
.reel-index .is-film::after {
    content: ""; position: absolute; top: 50%; left: 50%; transform: translate(-40%, -50%);
    border-style: solid; border-width: 7px 0 7px 12px; border-color: transparent transparent transparent #fff;
}
.reel-index .is-film-blank { display: block; width: 100%; height: 100%; background: linear-gradient(135deg, var(--plate), var(--edge)); }
/* The locked frame closing the row: blurred past recognition, a flame lock over it. */
.reel-index .is-locked img { filter: blur(5px) saturate(1.4); transform: scale(1.2); }
.reel-index .is-locked::after {
    content: ""; position: absolute; inset: 0; background: rgba(22, 15, 27, .35) no-repeat center / 20px
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23ff5c3d'%3E%3Cpath d='M17 9V7A5 5 0 0 0 7 7v2H5v13h14V9h-2zM9 7a3 3 0 0 1 6 0v2H9V7z'/%3E%3C/svg%3E");
}
.reel-more {
    display: inline-block; margin-top: 12px; padding: 9px 16px; border: 1px solid var(--flame);
    color: var(--flame); text-decoration: none; font-weight: 700; font-size: 14px; letter-spacing: .03em;
}
.reel-more:hover { background: var(--flame); color: var(--night); }

/* The player over the page: built by script on the press, sized to the clip's own
   ratio once its metadata arrives (see profile.html.twig), never the reel's 3:4. */
.lightbox {
    display: none; position: fixed; inset: 0; z-index: 100; background: rgba(8, 5, 10, .92);
    align-items: center; justify-content: center; padding: 20px;
}
.lightbox.is-open { display: flex; }
/* The stage shrinks to the video it holds: JS sizes the <video> itself from its own
   metadata, and the stage only needs to place the dismiss ring against its corner. */
.lightbox-stage { position: relative; display: inline-block; max-width: 92vw; max-height: 88vh; }
.lightbox-video { display: block; max-width: 92vw; max-height: 88vh; background: #000; }
/* The close control is a ring with a cross drawn from two bars, not a font glyph. */
.lightbox-dismiss {
    position: absolute; top: -18px; right: -18px; width: 36px; height: 36px; border-radius: 50%;
    background: var(--flame); border: none; display: block; cursor: pointer; padding: 0;
}
.lightbox-dismiss::before, .lightbox-dismiss::after {
    content: ""; position: absolute; top: 50%; left: 50%; width: 16px; height: 2px; background: var(--night);
}
.lightbox-dismiss::before { transform: translate(-50%, -50%) rotate(45deg); }
.lightbox-dismiss::after { transform: translate(-50%, -50%) rotate(-45deg); }

.portrait-body { display: grid; grid-template-columns: 300px minmax(0, 1fr); gap: 36px; margin-top: 30px; align-items: start; }
@media (max-width: 860px) { .portrait-body { grid-template-columns: minmax(0, 1fr); } }
.contact-box { background: var(--plate); padding: 18px; border-top: 3px solid var(--flame); }
.contact-box h2 { margin: 22px 0 6px; font-size: 13px; letter-spacing: .12em; text-transform: uppercase; color: var(--dim); }
.contact-teaser { margin: 0 0 10px; font-size: 22px; font-weight: 700; letter-spacing: .05em; }
.contact-main, .contact-alt { display: block; text-align: center; padding: 11px; text-decoration: none; font-weight: 700; }
.contact-main { background: var(--flame); color: var(--night); margin-bottom: 8px; }
.contact-main:hover { background: var(--flame-soft); }
.contact-alt { border: 1px solid var(--edge); }
.contact-alt:hover { border-color: var(--flame); }
.fact-pairs { display: grid; grid-template-columns: auto 1fr; gap: 6px 14px; margin: 0; font-size: 14px; }
.fact-pairs dt { color: var(--dim); }
.fact-pairs dd { margin: 0; text-align: right; font-weight: 600; }
.portrait-text { max-width: 70ch; }
.portrait-text h2 { margin: 0 0 8px; font-size: 18px; }
.portrait-text h2 ~ h2 { margin-top: 26px; }
.portrait-text p { color: #ddd0dc; }
.tag-run { display: flex; flex-wrap: wrap; gap: 6px; }
.tag-run span { padding: 3px 10px; border: 1px solid var(--edge); font-size: 13px; }
.said { margin-bottom: 14px; padding-left: 14px; border-left: 2px solid var(--gold); }
.said p { margin: 4px 0; }
.said-by { color: var(--dim); font-size: 13px; }
.said-reply { margin-left: 12px !important; color: var(--dim); font-style: italic; }
.also { margin-top: 44px; }
.also h2 { font-size: 18px; margin: 0 0 12px; }

/* The crossing to a partner: the face beside the button. */
.gate { display: flex; gap: 22px; align-items: flex-start; max-width: 520px; margin: 26px auto 0; }
.gate-face { width: 112px; height: auto; aspect-ratio: 3 / 4; object-fit: cover; outline: 2px solid var(--flame); flex: none; }
.gate-text { min-width: 0; flex: 1; }
.gate-text h1 { margin: 0; font-size: 26px; }
.gate-text h1 span { color: var(--gold); font-weight: 600; }
.gate-where { margin: 2px 0 10px; color: var(--dim); }
.gate-ahead { margin: 0 0 4px; color: var(--flame-soft); font-size: 13px; letter-spacing: .03em; }
.gate-go { display: block; margin-top: 14px; padding: 13px; text-align: center; background: var(--flame); color: var(--night); text-decoration: none; font-weight: 800; font-size: 16px; }
.gate-go:hover { background: var(--flame-soft); }
.gate-age { margin: 8px 0 0; color: var(--dim); font-size: 12px; }
.gate-back { display: inline-block; margin-top: 16px; color: var(--dim); font-size: 14px; }

/* Text pages */
.plain { max-width: 68ch; }
.plain h1 { font-size: 28px; margin: 0 0 8px; }
.plain h2 { font-size: 18px; margin: 24px 0 6px; }
.plain p { color: #ddd0dc; }
.plain-lead { color: var(--dim) !important; }

/* Footer */
.colophon { border-top: 1px solid var(--edge); }
.colophon-row { max-width: 1240px; margin: 0 auto; padding: 18px 20px; display: flex; flex-wrap: wrap; gap: 8px 20px; font-size: 13px; color: var(--dim); }
.colophon-row a { text-decoration: none; }
.colophon-row a:hover { color: var(--text); }
.colophon-age { margin-right: auto; color: var(--gold); font-weight: 700; }

@media (max-width: 600px) {
    .intro h1, .portrait-top h1 { font-size: 24px; }
    .wall { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
    .gate { flex-direction: column; align-items: center; text-align: center; }
}
