:root {
    --pointer-ms: 240ms;
    --quartz-sidepanel-floor: 220px;
    --quartz-margin-floor: 24px;
    --quartz-switch-tall: 40px;
    --quartz-upper-compass-floor-tall: 48px;
    --board: #dedbd4;
    --part: #f3f1ec;
    --quartz-upper-compass-bound-tall: 72px;
    --trunk: "Archivo", "Helvetica Neue", Arial, sans-serif;
    --piece: #e7e5e0;
    --presentation: "Archivo", "Helvetica Neue", Arial, sans-serif;
    --trace: #d4d3cd;
    --quartz-browse-separation: clamp(var(--quartz-browse-separation-floor), 1.4vw, var(--quartz-browse-separation-bound));
    --quartz-sidepanel-bound: 320px;
    --quartz-browse-separation-bound: 28px;
    --spread: #ffffff;
    --curve-graphic: 14px;
    --quartz-browse-separation-floor: 16px;
    --fore-2: #2c2f1f;
    --quartz-area-separation-bound: 48px;
    --fore: #0d0d0c;
    --drop: none;
    --quartz-margin-bound: 80px;
    --sky: #84b4d1;
    --quartz-stress: #1b5745;
    --trace-subtle: #eaeae9;
    --fore-3: #585b4c;
    --curve: 18px;
    --quartz-void-module: 6px;
    --tone-2: #ea3c75;
    --tone-fore: #ffffff;
    --quartz-matter-bound: 1920px;
    --letter: #323230;
    --quartz-margin: clamp(var(--quartz-margin-floor), 3.6vw, var(--quartz-margin-bound));
    --quartz-upper-compass-separation: 10px;
    --shade: rgba(255, 255, 255, 0.72);
    --olive: #2c2f1f;
    --tone: #1b5745;
}

*, *:after, *:before { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scrollbar-color: var(--quartz-stress) var(--piece); }
::-webkit-scrollbar { height: 8px; width: 8px; }
::-webkit-scrollbar-thumb { border-radius: 999px; background: var(--quartz-stress); }
::-webkit-scrollbar-track { background: var(--piece); }
body { background: var(--spread); color: var(--fore); font: 400 15px/1.55 var(--trunk); margin: 0; }
body.is-fixed { overflow: hidden; }
[hidden] { display: none !important; }
img { display: block; max-width: 100%; }
a { text-decoration: none; transition: color var(--pointer-ms) ease, background-color var(--pointer-ms) ease, background-size var(--pointer-ms) ease; color: inherit; }
button { color: inherit; cursor: pointer; font: inherit; }
h1, h2, h3 { font-family: var(--presentation); margin: 0; font-weight: 700; line-height: 1.08; letter-spacing: 0; }
.optically-invisible { width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; position: absolute !important; }
:focus-visible { outline: 2px solid var(--tone-2); outline-offset: 2px; }

.casing { display: flex; flex-direction: column; min-height: 100vh; }
.dais { flex: 1 0 auto; }
.overhead { margin: 0; font-size: 12px; font-weight: 500; letter-spacing: 0.18em; text-transform: uppercase; color: var(--tone); }

/* controls */
.deed { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: var(--quartz-switch-tall); padding: 0 18px; border: 1px solid var(--olive); border-radius: 999px; background: var(--olive); color: #ffffff; font-size: 12px; font-weight: 500; letter-spacing: 0.12em; text-transform: uppercase; background-image: linear-gradient(var(--fore), var(--fore)); background-repeat: no-repeat; background-size: 0% 100%; background-position: 0 0; transition: background-size var(--pointer-ms) ease, color var(--pointer-ms) ease, border-color var(--pointer-ms) ease; }
.deed:focus-visible, .deed:hover { border-color: var(--fore); color: #ffffff; transform: translateY(-1px); background-size: 100% 100%; }
.deed { transition: background-size var(--pointer-ms) ease, color var(--pointer-ms) ease, border-color var(--pointer-ms) ease, transform var(--pointer-ms) ease; }
.deed-wash { background-color: var(--tone); border-color: var(--tone); color: var(--tone-fore); background-image: linear-gradient(var(--fore), var(--fore)); }
.deed-wash:focus-visible, .deed-wash:hover { border-color: var(--fore); }
.deed-sun { border-color: var(--olive); color: #ffffff; background-color: var(--olive); }
.deed-contour { background-color: transparent; border-color: var(--fore); color: var(--fore); }\n.deed-contour:hover, .deed-contour:focus-visible { color: var(--spread); }
.deed-giant { font-size: 13px; padding: 0 24px; min-height: 56px; }
.deed.writing { border: 0; padding: 0; min-height: 0; background-image: linear-gradient(var(--tone), var(--tone)); background-size: 0% 1px; background-position: 0 100%; color: var(--tone); background-color: transparent; }
.deed.writing:focus-visible, .deed.writing:hover { color: var(--tone); background-size: 100% 1px; }
.tooling { display: inline-flex; align-items: center; justify-content: center; width: var(--quartz-switch-tall); height: var(--quartz-switch-tall); border: 0; border-radius: 999px; background: transparent; background-image: linear-gradient(var(--piece), var(--piece)); background-repeat: no-repeat; background-size: 0% 100%; transition: background-size var(--pointer-ms) ease; }
.tooling:focus-visible, .tooling:hover { background-size: 100% 100%; }
.key { width: 100%; min-height: var(--quartz-switch-tall); padding: 8px 14px; border: 1px solid var(--trace); border-radius: var(--curve); background: var(--part); color: var(--fore); font: inherit; transition: background-color var(--pointer-ms) ease, border-color var(--pointer-ms) ease; }
.key:focus { background-color: var(--piece); border-color: var(--fore); outline: none; }
.key-tagname { display: block; margin: 14px 0 6px; font-size: 12px; font-weight: 500; letter-spacing: 0.08em; text-transform: uppercase; color: var(--fore-2); }
.buttons { display: inline-flex; flex-wrap: wrap; gap: 4px; padding: 4px; border: 1px solid var(--trace); border-radius: var(--curve); background: var(--piece); }
.instalment { position: relative; display: inline-flex; align-items: center; min-height: 32px; padding: 0 12px; border: 0; border-radius: 6px; background: transparent; color: var(--fore-2); font-size: 12px; font-weight: 500; letter-spacing: 0.06em; text-transform: uppercase; cursor: pointer; transition: background-color var(--pointer-ms) ease, color var(--pointer-ms) ease; }
.instalment input { inset: 0; opacity: 0; margin: 0; cursor: pointer; position: absolute; }
.instalment:focus-visible, .instalment:hover { color: var(--fore); background-color: var(--board); }
.instalment.is-active, .instalment:has(input:checked) { color: var(--part); background-color: var(--fore); }

/* notice + header */
.notice { background: var(--tone); color: var(--tone-fore); min-height: 40px; display: flex; align-items: center; justify-content: center; padding: 8px var(--quartz-margin); }
.result-writing { margin: 0; font-size: 12px; font-weight: 500; letter-spacing: 0.16em; text-transform: uppercase; text-align: center; }
.flagstaff { z-index: 40; background: transparent; position: relative; }
.flagstaff-string { grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); align-items: center; gap: 16px; max-width: var(--quartz-matter-bound); margin: 0 auto; padding: 0 var(--quartz-margin); min-height: 66px; background: var(--spread); display: grid; }
.flagstaff-adjunct { align-items: center; gap: var(--quartz-upper-compass-separation); min-width: 0; display: flex; }
.flagstaff-adjunct-foot { justify-content: flex-end; grid-column: 3; }
.flagstaff-bundle { justify-content: center; max-width: var(--quartz-matter-bound); margin: 0 auto; padding: 0 var(--quartz-margin) 8px; display: flex; }
.signature { display: inline-flex; align-items: center; gap: 10px; grid-column: 2; justify-self: center; color: var(--fore); white-space: nowrap; }
.signature-stamp { height: 32px; flex: none; width: 32px; }
.signature-alias { font-family: var(--presentation); font-size: 24px; font-weight: 700; letter-spacing: -0.01em; }
.island { display: flex; align-items: center; gap: var(--quartz-upper-compass-separation); width: max-content; max-width: 100%; min-height: var(--quartz-upper-compass-floor-tall); max-height: var(--quartz-upper-compass-bound-tall); padding: 4px; border: 1px solid var(--trace-subtle); border-radius: 999px; background: var(--piece); box-shadow: 0 12px 28px -14px rgba(13, 13, 12, 0.35); }
.island-inventory { flex-wrap: nowrap; gap: var(--quartz-upper-compass-separation); margin: 0; padding: 0; list-style: none; display: flex; }
.island-tag { display: inline-flex; align-items: center; min-height: 42px; padding: 0 14px; border-radius: 999px; font-size: 11px; font-weight: 500; letter-spacing: 0.06em; text-transform: uppercase; white-space: nowrap; color: var(--fore-2); background-color: transparent; transition: background-color var(--pointer-ms) ease, color var(--pointer-ms) ease, transform var(--pointer-ms) ease; }
.island-tag:focus-visible, .island-tag:hover, [data-upper-compass-region="sorting"] a:hover, [data-upper-compass-region="sorting"] a:focus-visible { color: var(--tone); transform: translateY(-1px); background-color: var(--part); }
.navdrawer-knob { display: none; }
.film-haze { display: none; }

/* hero */
.top { display: grid; width: 100%; height: min(100vw / 2.15, 68vh); min-height: 300px; overflow: hidden; background: var(--piece); position: relative; }
.top-footage { inset: 0; display: block; width: 100%; height: 100%; position: absolute; }
.top-footage img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 48%; }
.top-shade { background: linear-gradient(90deg, rgba(255, 255, 255, 0.9) 0%, rgba(255, 255, 255, 0.74) 30%, rgba(255, 255, 255, 0.3) 50%, rgba(255, 255, 255, 0) 64%); grid-area: 1 / 1; }
.top-wording { grid-area: 1 / 1; align-self: center; justify-self: start; max-width: 620px; padding: 24px var(--quartz-margin); color: var(--fore); display: grid; gap: 14px; justify-items: start; }
.top-shade, .top-wording { z-index: 1; position: relative; }
.top-overhead { color: var(--tone); }
.top-titling { font-size: clamp(26px, 2.7vw, 37px); font-weight: 700; line-height: 1.05; }
.top-principal { max-width: 46ch; color: var(--fore-2); margin: 0; }
.top-wording .deed { margin-top: 6px; }

/* archive band */
.belt { border-bottom: 1px solid var(--trace-subtle); background: var(--piece); }
.belt { padding-inline: var(--quartz-margin); margin-inline: calc(-1 * var(--quartz-margin)); }
.belt-core { display: grid; gap: 6px; padding: 18px 0 16px; }
.belt-titling { font-size: clamp(24px, 2.5vw, 34px); font-weight: 700; }
.belt-attributes { font-size: 13px; color: var(--fore-2); margin: 0; }
.belt-attributes [data-superscription-census] { color: var(--fore); font-weight: 500; }
.belt-preamble { max-width: 72ch; color: var(--fore-2); margin: 4px 0 0; }

/* control band + filters */
.lever-belt { background: var(--spread); border-bottom: 1px solid var(--trace-subtle); }
.pick { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; padding: 10px 0; }
.pick-controls { display: none; }
.pick-sidepanel-crown { display: none; }
.pick-haze { display: none; }
.pick-blocks { flex-wrap: wrap; gap: 8px; display: flex; }
.narrow { position: relative; }
.narrow-handle { display: inline-flex; align-items: center; gap: 8px; min-height: var(--quartz-switch-tall); padding: 0 14px; border: 1px solid var(--trace); border-radius: var(--curve); background: var(--part); font-size: 12px; font-weight: 500; letter-spacing: 0.08em; text-transform: uppercase; color: var(--fore); transition: background-color var(--pointer-ms) ease, border-color var(--pointer-ms) ease; }
.narrow-handle:focus-visible, .narrow-handle:hover, .narrow-handle[aria-expanded="true"] { border-color: var(--fore); background-color: var(--piece); }
.narrow-handle svg { transition: transform var(--pointer-ms) ease; }
.narrow-handle[aria-expanded="true"] svg { transform: rotate(180deg); }
.narrow-slab { position: absolute; top: calc(100% + 6px); left: 0; z-index: 30; min-width: 240px; max-width: min(420px, 90vw); max-height: 60vh; overflow-y: auto; padding: 10px; border: 1px solid var(--trace); border-radius: var(--curve); background: var(--part); box-shadow: 0 18px 40px rgba(44, 47, 31, 0.14); }
.narrow-alternatives { padding: 0; list-style: none; display: grid; gap: 2px; margin: 0; }
.narrow-alternatives a { display: flex; justify-content: space-between; gap: 10px; padding: 8px 10px; border-radius: 6px; font-size: 14px; background-image: linear-gradient(var(--piece), var(--piece)); background-repeat: no-repeat; background-size: 0% 100%; transition: background-size var(--pointer-ms) ease, color var(--pointer-ms) ease; }
.narrow-alternatives a:focus-visible, .narrow-alternatives a:hover { color: var(--tone); background-size: 100% 100%; }
.narrow-alternatives small { font-size: 12px; color: var(--fore-3); }

/* catalog sheet */
.roster > * + .binder, .roster > * + .pagecontrol { margin-top: min(var(--quartz-area-separation-bound), calc(var(--quartz-void-module) * 4)); }
.roster { margin: 0 auto; padding: 0 var(--quartz-margin); max-width: var(--quartz-matter-bound); }
.film { grid-template-columns: minmax(0, 1fr) clamp(var(--quartz-sidepanel-floor), 16vw, var(--quartz-sidepanel-bound)); gap: calc(var(--quartz-void-module) * 4); padding: calc(var(--quartz-void-module) * 4) 0 calc(var(--quartz-void-module) * 6); align-items: start; display: grid; }
.selection { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--quartz-browse-separation); min-width: 0; align-items: start; display: grid; }
.bare { padding: 40px 0; display: grid; gap: 8px; grid-column: 1 / -1; }
.bare h2 { font-size: 24px; }
.bare p { color: var(--fore-2); margin: 0; }

/* card */
.card { background: var(--part); border: 0; border-radius: var(--curve); }
.card .footage img { object-fit: contain; }
@media (min-width: 900px) and (min-height: 761px) { .top { margin-top: -34px; } }
@media (max-height: 760px) { .flagstaff { border-bottom: 1px solid var(--trace-subtle); } }
@media (max-width: 1199px) { .island, .island-inventory { gap: 6px; } .island-tag { padding: 0 12px; letter-spacing: 0.04em; } }
@media (max-width: 1023px) { .island, .island-inventory { gap: 4px; } .island-tag { padding: 0 10px; font-size: 10px; letter-spacing: 0.02em; } }
@media (max-width: 1199px) { .pick-sidepanel { min-width: 0; width: 100%; } .pick { flex-wrap: nowrap; } .pick-blocks { flex: 1 1 auto; min-width: 0; width: 100%; flex-wrap: nowrap; overflow-x: auto; padding-bottom: 2px; } .narrow-handle { white-space: nowrap; flex: none; } .narrow { flex: none; } }
.k7 .body { flex-wrap: wrap; }
.lozenges { display: none !important; }
.card .footage { overflow: hidden; border-radius: var(--curve-graphic); position: relative; }
.card .footage img { height: auto; width: 100%; }
.footage-shade { position: absolute; left: 0; right: 0; bottom: 0; height: 30%; display: block; background: linear-gradient(0deg, rgba(44, 47, 31, 0.74), rgba(44, 47, 31, 0)); color: #ffffff; font-size: 11px; font-weight: 500; letter-spacing: 0.14em; text-transform: uppercase; opacity: 0; transform: translateY(100%); transition: transform var(--pointer-ms) ease, opacity var(--pointer-ms) ease; pointer-events: none; }
.card:focus-within .footage-shade, .card:hover .footage-shade { opacity: 1; transform: translateY(0); }
.k7 .order { align-items: flex-start; color: var(--tone); display: flex; }
.k7 .body { padding-top: 8px; align-items: flex-end; }
.card .footage { line-height: 0; }
.self { display: grid; grid-template-columns: minmax(0, 1fr); gap: 6px; min-width: 0; }
.disc { justify-self: start; display: inline-flex; align-items: center; gap: 6px; min-height: 24px; padding: 0 10px 0 7px; border-radius: 999px; background: var(--tone); color: var(--tone-fore); font: 600 11px/1 var(--trunk); letter-spacing: 0.04em; white-space: nowrap; }
.disc svg { height: 14px; flex: 0 0 auto; width: 14px; }
.disc-titling { margin-bottom: 8px; min-height: 28px; padding: 0 12px 0 8px; font-size: 12px; align-self: start; }
.disc-titling svg { height: 16px; width: 16px; }
.k7 .name { display: inline-block; padding: 6px 10px; border-radius: 6px; background: var(--board); font-size: 17px; font-weight: 500; max-width: 100%; overflow-wrap: anywhere; }
.card { overflow: visible; }
.k7 .name a { background-image: linear-gradient(var(--tone), var(--tone)); background-repeat: no-repeat; background-size: 0% 1px; background-position: 0 100%; transition: background-size var(--pointer-ms) ease, color var(--pointer-ms) ease; }
.k7 .name a:focus-visible, .k7 .name a:hover { color: var(--tone); background-size: 100% 1px; }
.k7 .attributes { align-items: center; flex-wrap: wrap; gap: 6px; font-size: 13px; color: var(--fore-2); display: flex; }
.k7 .attributes .price { display: inline-flex; align-items: center; min-height: 22px; padding: 0 10px; border-radius: 999px; background: var(--board); color: var(--fore); font-size: 12px; font-weight: 500; }
.lozenges { flex-wrap: nowrap; overflow: hidden; gap: 4px; margin: 0; padding: 0; list-style: none; display: flex; }
.lozenges li { flex: none; padding: 2px 8px; border: 1px solid var(--trace); border-radius: 999px; font-size: 11px; color: var(--fore-2); white-space: nowrap; }
.verbs { flex: none; }

/* locality rail (city selector) */
.burg { position: sticky; top: var(--sidebar-top, 16px); align-self: start; display: grid; gap: 14px; padding: 16px; border: 1px solid var(--trace); border-radius: var(--curve); background: var(--piece); font-size: 13px; }
.burg-ambient { gap: 2px; display: grid; }
.territory-banner { font-size: 20px; line-height: 1; }
.burg-tagname { letter-spacing: 0.12em; text-transform: uppercase; color: var(--fore-3); font-size: 12px; }
.burg-territory { display: inline-flex; align-items: center; gap: 8px; font-weight: 500; font-size: 15px; background-image: linear-gradient(var(--tone), var(--tone)); background-repeat: no-repeat; background-size: 0% 1px; background-position: 0 100%; }
.burg-territory:focus-visible, .burg-territory:hover { color: var(--tone); background-size: 100% 1px; }
.burg-rank { gap: 8px; max-height: 50vh; overflow-y: auto; padding-right: 4px; display: grid; }
.burg-batch { grid-template-columns: 22px minmax(0, 1fr); gap: 6px; align-items: start; display: grid; }
.burg-cap { font-family: var(--presentation); font-size: 14px; font-weight: 500; color: var(--tone); }
.burg-batch ul { padding: 0; list-style: none; display: flex; flex-wrap: wrap; gap: 4px 10px; margin: 0; }
.burg-batch a { background-image: linear-gradient(var(--tone), var(--tone)); background-repeat: no-repeat; background-size: 0% 1px; background-position: 0 100%; }
.burg-batch a:focus-visible, .burg-batch a:hover, .burg-batch a[aria-current="page"] { color: var(--tone); background-size: 100% 1px; }
.burg-widget { gap: 8px; padding-top: 12px; border-top: 1px solid var(--trace); display: grid; }
.burg-response { align-items: center; gap: 8px; font-weight: 500; display: inline-flex; }
.status-dot { height: 8px; border-radius: 50%; background: var(--tone-2); flex: none; width: 8px; }
.burg-deed { min-height: 44px; width: 100%; }

/* pager */
.pagecontrol { grid-template-columns: minmax(0, 1fr) auto; gap: 16px; align-items: center; padding: 0 0 calc(var(--quartz-void-module) * 6); display: grid; }
.pagecontrol-recap { font-size: 13px; color: var(--fore-2); margin: 0; }
.pagecontrol-verbs { gap: 7px; align-items: center; display: flex; }
.pagecontrol-vista { flex-wrap: wrap; justify-content: center; gap: 4px; min-width: 0; display: flex; }
.pagecontrol-figure, .pagecontrol-module { display: inline-flex; align-items: center; justify-content: center; min-width: 44px; height: 44px; padding: 0 10px; border: 1px solid var(--trace); border-radius: var(--curve); font-size: 13px; font-weight: 500; background-image: linear-gradient(var(--fore), var(--fore)); background-repeat: no-repeat; background-size: 0% 100%; transition: background-size var(--pointer-ms) ease, color var(--pointer-ms) ease; }
.pagecontrol-figure:focus-visible, .pagecontrol-figure:hover, .pagecontrol-module:focus-visible, .pagecontrol-module:hover { color: var(--part); background-size: 100% 100%; }
.pagecontrol-figure[aria-current="page"] { border-color: var(--olive); color: #ffffff; background-color: var(--olive); }
.pagecontrol-module.is-quiet { pointer-events: none; opacity: 0.4; }
.pagecontrol-margin { align-self: center; color: var(--fore-3); } .pagecontrol-margin.is-petite { display: none; }

/* seo brief */
.binder { display: grid; gap: 24px; padding: 0 0 calc(var(--quartz-void-module) * 8); }
.binder-crown { gap: 6px; align-content: start; display: grid; }
.binder-movement-titling { font-size: 16px; }
.binder-titling { font-size: clamp(22px, 2.2vw, 30px); font-weight: 700; }
.binder-trunk { padding: 16px; border-radius: var(--curve); background: var(--part); font-size: 14px; line-height: 1.5; column-count: 2; column-gap: 32px; column-rule: 1px solid var(--trace); }
.binder-trunk p { margin: 0; }
.binder-movement { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; grid-column: 1 / -1; }
.binder-movement-titling { grid-column: 1 / -1; }
@media (max-width: 1199px) { .binder-movement { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.binder-movement-titling { font-size: 18px; font-weight: 500; }
.binder .overhead { font-size: 14px; }
.binder p { font-size: 14px; line-height: 1.5; }
.binder-tab { margin: 0; padding: 12px; line-height: 1.5; background: var(--part); border: 0; border-radius: var(--curve); font-size: 14px; }
@media (min-width: 1200px) { .binder { grid-template-columns: minmax(220px, 1fr) minmax(0, 2.4fr); } }

/* footer (approved 34: editorial split) */
.base { border-top: 1px solid var(--trace-subtle); margin-top: auto; background: var(--spread); }
.base-core { grid-template-columns: 1.25fr 0.75fr 0.75fr 0.75fr; gap: 40px 56px; max-width: var(--quartz-matter-bound); margin: 0 auto; padding: 48px var(--quartz-margin) 28px; min-height: 300px; display: grid; }
.base-signature { gap: 14px; align-content: start; display: grid; }
.base-statement { margin: 0; max-width: 380px; font-family: var(--presentation); font-size: 22px; font-weight: 600; line-height: 1.25; color: var(--fore); }
.base-titling { font-size: 12px; font-weight: 500; letter-spacing: 0.14em; text-transform: uppercase; margin: 0 0 12px; color: var(--fore-3); }
.base-inventory { padding: 0; list-style: none; display: grid; gap: 6px; font-size: 14px; margin: 0; }
.base .burg-territory, .base-inventory a { color: var(--fore); background-image: linear-gradient(var(--tone), var(--tone)); background-repeat: no-repeat; background-size: 0% 1px; background-position: 0 100%; }
.base-inventory a:focus-visible, .base-inventory a:hover { color: var(--tone); background-size: 100% 1px; }
.base-sites .burg-widget { padding-top: 0; border-top: 0; }
.base-statutory { display: flex; justify-content: space-between; gap: 16px; padding-top: 20px; border-top: 1px solid var(--trace-subtle); font-size: 12px; color: var(--fore-3); grid-column: 1 / -1; }
.statutory-age { color: var(--fore); font-weight: 500; }

/* city atlas dialog (full-screen) */
.lexicon { inset: 0; z-index: 100; background: var(--spread); position: fixed; }
.lexicon-slab { width: 100%; height: 100%; overflow-y: auto; padding: 48px var(--quartz-margin) 60px; background: var(--spread); color: var(--fore); position: relative; }
.lexicon-hide { position: fixed; top: 16px; right: 16px; z-index: 2; display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; border: 1px solid var(--trace); border-radius: 999px; background: var(--part); color: var(--fore); transition: background-color var(--pointer-ms) ease, color var(--pointer-ms) ease; }
.lexicon-hide:focus-visible, .lexicon-hide:hover { color: var(--part); background-color: var(--fore); }
.lexicon-crown { gap: 8px; max-width: 760px; margin-bottom: 24px; display: grid; }
.lexicon-titling { font-size: clamp(28px, 3.4vw, 44px); font-weight: 700; }
.lexicon-territory { color: var(--tone); font-weight: 500; }
.lexicon-rank { flex-wrap: wrap; gap: 6px; margin-bottom: 28px; display: flex; }
.lexicon-rank a { display: inline-flex; align-items: center; justify-content: center; min-width: 36px; height: 36px; padding: 0 8px; border: 1px solid var(--trace); border-radius: 999px; font-size: 13px; font-weight: 500; transition: background-color var(--pointer-ms) ease, color var(--pointer-ms) ease; }
.lexicon-rank a:focus-visible, .lexicon-rank a:hover { border-color: var(--tone); color: var(--tone-fore); background-color: var(--tone); }
.lexicon-inventory { gap: 28px; display: grid; }
.lexicon-batch { grid-template-columns: 56px minmax(0, 1fr); gap: 12px; padding-top: 16px; border-top: 1px solid var(--trace-subtle); display: grid; }
.lexicon-cap { font-size: 28px; font-weight: 700; color: var(--tone); }
.lexicon-places { padding: 0; list-style: none; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px 24px; font-size: 15px; margin: 0; }
.lexicon-places a { display: block; color: var(--fore); background-image: linear-gradient(var(--tone), var(--tone)); background-repeat: no-repeat; background-size: 0% 1px; background-position: 0 100%; }
.lexicon-places a:focus-visible, .lexicon-places a:hover, .lexicon-places a[aria-current="page"] { color: var(--tone); background-size: 100% 1px; }

/* phone side panel */
.unveil { inset: 0; z-index: 110; position: fixed; }
.unveil-haze { inset: 0; background: rgba(44, 47, 31, 0.55); position: absolute; }
.unveil-slab { position: absolute; top: 0; right: 0; bottom: 0; width: min(420px, 100%); display: grid; grid-template-columns: minmax(0, 1fr) auto; grid-template-rows: auto 1fr; gap: 20px; padding: 28px; background: var(--spread); color: var(--fore); border-left: 1px solid var(--trace); }
.unveil-crown { gap: 6px; display: grid; }
.unveil-titling { font-size: 26px; font-weight: 700; }
.unveil-hide { display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; border: 1px solid var(--trace); border-radius: 999px; background: var(--part); transition: background-color var(--pointer-ms) ease, color var(--pointer-ms) ease; }
.unveil-hide:focus-visible, .unveil-hide:hover { color: var(--part); background-color: var(--fore); }
.unveil-numeral { align-self: start; padding: 20px; border-radius: var(--curve); background: var(--piece); grid-column: 1 / -1; }
.unveil-figure { display: block; white-space: nowrap; font-family: var(--presentation); font-size: clamp(17px, 5.5vw, 26px); font-weight: 500; letter-spacing: 0.02em; color: var(--tone); }

/* search command */
.palette { position: fixed; inset: 0; z-index: 105; display: grid; align-items: start; justify-items: center; padding: 12vh var(--quartz-margin) 0; background: rgba(44, 47, 31, 0.55); }
.palette-slab { width: min(680px, 100%); padding: 28px 28px 24px; border-radius: var(--curve); background: var(--spread); color: var(--fore); box-shadow: 0 30px 60px rgba(0, 0, 0, 0.25); position: relative; }
.palette-tagname { display: block; margin-bottom: 10px; font-size: 12px; font-weight: 500; letter-spacing: 0.12em; text-transform: uppercase; color: var(--fore-2); }
.palette-string { grid-template-columns: minmax(0, 1fr) auto; gap: 8px; display: grid; }
.palette-hide { position: absolute; top: 10px; right: 10px; display: inline-flex; width: 36px; height: 36px; align-items: center; justify-content: center; border: 0; border-radius: 999px; background: transparent; }
.palette-hide:focus-visible, .palette-hide:hover { background: var(--piece); }

/* profile */
.casefile-matrix { grid-template-columns: minmax(300px, min(40%, 46vh)) minmax(0, 1fr); gap: calc(var(--quartz-void-module) * 7); max-width: var(--quartz-matter-bound); margin: 0 auto; padding: calc(var(--quartz-void-module) * 5) var(--quartz-margin) calc(var(--quartz-void-module) * 8); align-items: start; display: grid; }
.casefile-footage { top: 12px; position: sticky; }
.casefile-footage, .casefile-particulars { gap: calc(var(--quartz-void-module) * 4); min-width: 0; align-content: start; display: grid; }
.film-slides { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 4px; display: grid; }
.pane { min-width: 0; margin: 0; }
.pane-principal { grid-column: 1 / -1; }
.pane-handle { display: block; width: 100%; padding: 0; border: 0; background: var(--piece); border-radius: var(--curve-graphic); overflow: hidden; cursor: zoom-in; position: relative; }
.pane-handle img { height: auto; max-height: 70vh; object-fit: contain; width: 100%; }
.pane-handle:after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 24%; background: linear-gradient(0deg, rgba(44, 47, 31, 0.5), rgba(44, 47, 31, 0)); opacity: 0; transform: translateY(100%); transition: transform var(--pointer-ms) ease, opacity var(--pointer-ms) ease; }
.pane-handle:focus-visible:after, .pane-handle:hover:after { transform: translateY(0); opacity: 1; }
.self-crown { gap: 6px; display: grid; }
.self-titling { font-size: clamp(26px, 2.8vw, 37px); font-weight: 700; }
.self-crown .overhead a:hover { color: var(--fore); }
.brick-titling { font-size: 20px; font-weight: 500; }
.connect-slab { position: sticky; top: 16px; display: grid; gap: 12px; padding: 20px; border: 1px solid var(--trace); border-radius: var(--curve); background: var(--piece); z-index: 2; }
.connect-crown { margin: 0; font-size: 12px; font-weight: 500; letter-spacing: 0.14em; text-transform: uppercase; color: var(--fore-3); }
.connect-deed { gap: 8px; display: grid; }
.remark { padding: 20px; border: 1px solid var(--trace); border-radius: var(--curve); display: grid; gap: 10px; background: var(--part); }
.remark-trunk p { color: var(--fore-2); margin: 0 0 10px; }
.remark-trunk p:last-child { margin-bottom: 0; }
.figures { gap: 10px; display: grid; }
.figures-inventory { display: grid; margin: 0; }
.figures-string { grid-template-columns: minmax(120px, 36%) minmax(0, 1fr); gap: 12px; padding: 9px 0; border-bottom: 1px solid var(--trace-subtle); display: grid; }
.figures-string dt { font-size: 13px; color: var(--fore-3); }
.figures-string dd { font-weight: 500; margin: 0; }
.sums { gap: 12px; display: grid; }
.sums-crown { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px; }
.sums-lattice { border-collapse: collapse; font-size: 15px; width: 100%; }
.sums-lattice td, .sums-lattice th { text-align: left; border-bottom: 1px solid var(--trace-subtle); padding: 10px 8px; }
.sums-lattice thead th { font-size: 11px; letter-spacing: 0.12em; text-transform: uppercase; color: var(--fore-3); font-weight: 500; }
.sums-lattice tbody th { color: var(--fore-2); font-weight: 400; }
.sums-lattice td { font-weight: 500; }
.sums[data-rates-view="incall"] .stack-outcall, .sums[data-rates-view="outcall"] .stack-incall { display: none; }
.logbook { gap: 10px; display: grid; }
.logbook-strings { padding: 0; list-style: none; display: grid; margin: 0; }
.logbook-strings li { align-items: center; gap: 12px; padding: 10px 0; border-bottom: 1px solid var(--trace-subtle); display: flex; }
.logbook-strings li:before { width: 14px; height: 1px; background: var(--tone); flex: none; content: ""; }
.logbook-strings a, .pills a { background-image: linear-gradient(var(--tone), var(--tone)); background-repeat: no-repeat; background-size: 0% 1px; background-position: 0 100%; }
.logbook-strings a:focus-visible, .logbook-strings a:hover { color: var(--tone); background-size: 100% 1px; }
.divisions { gap: 16px; display: grid; }
.movement { gap: 8px; display: grid; }
.movement-titling { font-size: 12px; font-weight: 500; letter-spacing: 0.14em; text-transform: uppercase; color: var(--fore-3); }
.pills { padding: 0; list-style: none; display: flex; flex-wrap: wrap; gap: 6px; margin: 0; }
.pills a { display: inline-flex; align-items: center; min-height: 32px; padding: 0 12px; border: 1px solid var(--trace); border-radius: 999px; font-size: 13px; background-image: linear-gradient(var(--piece), var(--piece)); background-size: 0% 100%; }
.pills a:focus-visible, .pills a:hover { color: var(--tone); border-color: var(--tone); background-size: 100% 100%; }
.result-board { border: 1px solid var(--trace); border-radius: var(--curve); background: var(--part); }
.feedback-handle { display: flex; width: 100%; align-items: center; justify-content: space-between; gap: 10px; padding: 14px 18px; border: 0; background: transparent; font-size: 13px; font-weight: 500; letter-spacing: 0.08em; text-transform: uppercase; text-align: left; transition: background-color var(--pointer-ms) ease; }
.feedback-handle:focus-visible, .feedback-handle:hover { background-color: var(--piece); }
.feedback-handle svg { transition: transform var(--pointer-ms) ease; }
.feedback-handle[aria-expanded="true"] svg { transform: rotate(180deg); }
.feedback-enquiry { gap: 10px; padding: 4px 18px 18px; border-top: 1px solid var(--trace-subtle); display: grid; }
.feedback-prompt { font-size: 13px; color: var(--fore-2); margin: 10px 0 0; }
.scan-key { align-items: center; gap: 10px; flex-wrap: wrap; margin-top: 10px; display: flex; }
.scan-alias { color: var(--fore-2); font-size: 13px; }
.feedback-verbs { align-items: center; gap: 12px; flex-wrap: wrap; display: flex; }
.feedback-response { color: var(--tone); font-size: 13px; }

/* light-room viewer */
.lightroom { position: fixed; inset: 0; z-index: 120; height: 100vh; height: 100dvh; display: grid; grid-template-rows: auto minmax(0, 1fr) auto; color: var(--fore); }
.lightroom-haze { inset: 0; background: var(--spread); position: absolute; }
.lightroom-crown, .lightroom-dais, .lightroom-slat { position: relative; }
.lightroom-crown { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 12px var(--quartz-margin); border-bottom: 1px solid var(--trace-subtle); }
.lightroom-titling { font-family: var(--presentation); font-size: 18px; font-weight: 500; }
.lightroom-scoreboard { color: var(--fore-3); margin-left: auto; font-size: 13px; }
.lightroom-hide { display: inline-flex; align-items: center; gap: 8px; min-height: 40px; padding: 0 14px; border: 1px solid var(--trace); border-radius: 999px; background: var(--part); font-size: 12px; font-weight: 500; letter-spacing: 0.1em; text-transform: uppercase; transition: background-color var(--pointer-ms) ease, color var(--pointer-ms) ease; }
.lightroom-hide:focus-visible, .lightroom-hide:hover { color: var(--part); background-color: var(--fore); }
.lightroom-dais { place-items: center; min-height: 0; padding: 12px var(--quartz-margin); display: grid; }
.lightroom-graphic { max-width: 100%; max-height: calc(100vh - 200px); width: auto; height: auto; object-fit: contain; border-radius: var(--curve-graphic); }
.lightroom-route { position: absolute; inset: 0; display: flex; justify-content: space-between; align-items: center; padding: 0 12px; pointer-events: none; }
.lightroom-indicator { pointer-events: auto; width: 44px; height: 44px; border: 1px solid var(--trace); border-radius: 999px; background: var(--part); font-size: 18px; transition: background-color var(--pointer-ms) ease, color var(--pointer-ms) ease; }
.lightroom-indicator:focus-visible, .lightroom-indicator:hover { color: var(--part); background-color: var(--fore); }
.lightroom-slat { gap: 6px; padding: 10px var(--quartz-margin); overflow-x: auto; border-top: 1px solid var(--trace-subtle); background: var(--piece); display: flex; }
.lightroom-thumbnail { flex: none; width: 64px; height: 80px; padding: 0; border: 2px solid transparent; border-radius: 6px; overflow: hidden; background: var(--board); opacity: 0.7; transition: opacity var(--pointer-ms) ease, border-color var(--pointer-ms) ease; }
.lightroom-thumbnail img { height: 100%; object-fit: cover; width: 100%; }
.lightroom-thumbnail:focus-visible, .lightroom-thumbnail:hover, .lightroom-thumbnail[aria-current="true"] { border-color: var(--tone); opacity: 1; }

/* service pages */
.passage { margin: 0 auto; padding: 48px var(--quartz-margin) 72px; color: var(--fore); max-width: 760px; }
.passage h1 { margin-bottom: 20px; font-size: clamp(28px, 3vw, 40px); }
.passage h2, .passage h3 { margin: 28px 0 10px; font-weight: 500; }
.passage li, .passage p { line-height: 1.65; color: var(--fore-2); }
.passage a { text-decoration: underline; color: var(--tone); }

@media (prefers-reduced-motion: reduce) {
    *, *:after, *:before { animation-duration: 0.01ms !important; transition-duration: 0.01ms !important; }
}

/* responsive */
@media (max-width: 1199px) {
    .selection { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .base-core { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 1199px) {
    .film { grid-template-columns: minmax(0, 1fr); }
    .burg { position: static; }
    .burg-rank { max-height: none; }
}

@media (max-width: 1023px) {
    .casefile-footage { position: static; }
    .casefile-matrix { max-width: 760px; grid-template-columns: minmax(0, 1fr); }
    .connect-slab { position: static; }
}

@media (max-width: 899px) {
    .signature-alias { font-size: 20px; }
    .flagstaff { border-bottom: 1px solid var(--trace-subtle); }
    .flagstaff-bundle { display: none; }
    .navdrawer-knob { display: inline-flex; }
    .flagstaff-bundle.is-launch { display: block; position: absolute; left: 0; right: 0; top: 100%; z-index: 60; max-width: none; max-height: 70vh; overflow-y: auto; padding: 12px var(--quartz-margin) 24px; background: var(--spread); border-bottom: 1px solid var(--trace); }
    .flagstaff-bundle.is-launch .island { display: block; width: auto; max-width: none; padding: 0; border: 0; border-radius: 0; background: transparent; max-height: none; }
    .flagstaff-bundle.is-launch .island-inventory { gap: 0; flex-direction: column; }
    .flagstaff-bundle.is-launch .island-tag { display: flex; width: 100%; min-height: 48px; padding: 0; border-radius: 0; border-bottom: 1px solid var(--trace-subtle); font-family: var(--presentation); font-size: 22px; font-weight: 600; letter-spacing: 0; text-transform: none; white-space: normal; }
    .film-haze { position: fixed; inset: 0; z-index: 55; background: rgba(44, 47, 31, 0.5); display: block; }
    .flagstaff.is-navdrawer-launch .flagstaff-string { z-index: 70; position: relative; }
}

@media (max-width: 379px) { .signature-alias { display: none; } }
@media (max-width: 599px) {
    .flagstaff-string { min-height: 60px; grid-template-columns: auto 1fr auto; }
    .signature { justify-self: start; grid-column: 1; }
    .top { height: min(100vw / 1.133, 68vh); }
    .top-shade { background: linear-gradient(0deg, rgba(255, 255, 255, 0.92) 0%, rgba(255, 255, 255, 0.66) 46%, rgba(255, 255, 255, 0) 72%); }
    .top-wording { padding-bottom: 22px; gap: 8px; align-self: end; }
    .top-titling { font-size: 26px; }
    .top-principal { display: none; }
    .pick-controls { display: block; }
    .pick-sidepanel { display: none; }
    .pick-sidepanel.is-launch { display: grid; grid-template-rows: auto minmax(0, 1fr); position: fixed; top: 0; left: 0; right: 0; z-index: 80; max-height: 85vh; background: var(--spread); border-bottom: 1px solid var(--trace); border-radius: 0 0 16px 16px; overflow: hidden; }
    .pick-haze { position: fixed; inset: 0; z-index: 75; background: rgba(44, 47, 31, 0.5); display: block; }
    .pick-sidepanel-crown { grid-template-columns: minmax(0, 1fr) 44px; align-items: center; gap: 12px; padding: 12px 16px; border-bottom: 1px solid var(--trace-subtle); display: grid; }
    .pick-sidepanel-titling { font-weight: 500; }
    .pick-hide { width: 44px; height: 44px; border: 1px solid var(--trace); border-radius: 999px; background: var(--part); display: inline-flex; align-items: center; justify-content: center; }
    .pick-blocks { gap: 0; overflow-y: auto; padding: 8px 16px 16px; display: grid; }
    .narrow-handle { width: 100%; justify-content: space-between; min-height: 44px; border: 0; border-bottom: 1px solid var(--trace-subtle); border-radius: 0; padding: 0; }
    .narrow-slab { position: static; box-shadow: none; border: 0; max-width: none; max-height: none; padding: 4px 0 12px; }
    .narrow-alternatives a { align-items: center; min-height: 44px; }
    .selection { gap: 16px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .deed, .narrow-handle, .pagecontrol-figure, .pagecontrol-module { min-height: 44px; }
    .pagecontrol-figure, .pagecontrol-module { height: 44px; }
    .binder-trunk { font-size: 14px; line-height: 1.5; padding: 12px; }
    .binder-tab { padding: 10px; font-size: 14px; line-height: 1.5; }
    .binder { gap: 12px; }
    .binder-movement { gap: 8px; grid-template-columns: 1fr; }
    .k7 { padding: 8px 8px 10px; }
    .k7 .order svg { height: 14px; width: 14px; }
    .k7 .body { align-items: stretch; gap: 6px; padding-top: 8px; flex-direction: column; }
    .k7 .name { padding: 4px 8px; font-size: 14px; }
    .k7 .attributes { font-size: 12px; }
    .lozenges { display: none; }
    .pagecontrol { grid-template-columns: minmax(0, 1fr); }
    .pagecontrol-verbs { grid-template-columns: 44px minmax(0, 1fr) 44px; gap: 4px; display: grid; }
    .pagecontrol-vista { justify-content: center; gap: 2px; } .pagecontrol-margin.is-petite { display: inline; } .pagecontrol-figure.is-roomy, .pagecontrol-margin.is-roomy { display: none; }
    .binder-trunk { column-count: 1; }
    .base-core { gap: 28px; grid-template-columns: 1fr; }
    .base-statutory { flex-direction: column; }
    .lexicon-places { grid-template-columns: 1fr; }
    .lexicon-batch { grid-template-columns: 1fr; }
    .unveil-slab { top: auto; width: 100%; border-left: 0; border-top: 1px solid var(--trace); border-radius: 16px 16px 0 0; }
    .film-slides { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .deed-giant { min-height: 52px; }
    .key { min-height: 44px; }
    .instalment { min-height: 36px; }
}

.casefile-particulars .burg { position: static; }
@media (min-width: 1024px) { .casefile-particulars .connect-slab { position: sticky; top: 12px; } }
.casefile-particulars .burg-rank { max-height: 40vh; }

@media (max-width: 1199px) and (min-width: 600px) { .k7 .body { min-width: 0; padding: 8px 10px 10px; gap: 4px; } .k7 .self { gap: 2px; } .k7 .name { font-size: 15px; line-height: 1.15; padding: 4px 8px; } .k7 .attributes { flex-wrap: wrap; font-size: 12px; gap: 4px 8px; } .k7 .verbs { padding-top: 0; } .k7 .verbs .deed { min-height: 30px; line-height: 30px; padding: 0 10px; font-size: 12px; } }
.binder-movement .binder-tab { display: block; padding: 14px 16px; border: 0; border-radius: var(--curve); background: var(--piece); margin: 0; }

/* Short-viewport opening: declared after the base band/control rules so it wins the cascade. */
@media (max-height: 760px) { .top { height: min(100vw / 2.15, 60vh); } .top-wording { padding-bottom: 10px; } .belt-core { display: grid; gap: 2px; padding: 12px 0 12px; } .belt-titling { font-size: 22px; line-height: 1.1; } .belt-overhead { display: block; font-size: 11px; line-height: 1.2; } .belt-attributes { font-size: 11px; line-height: 1.2; } .lever-belt .pick { padding: 0; } .narrow-handle { min-height: 34px; } .film { padding-top: 4px; } .notice { min-height: 24px; padding: 2px var(--quartz-margin); } .result-writing { font-size: 11px; } .flagstaff-string { min-height: 44px; padding-block: 0; } .flagstaff-bundle { padding-bottom: 6px; } .signature-stamp { width: 24px; height: 24px; } .island { padding: 4px; } .island-tag { min-height: 32px; } .lever-belt { border-bottom: 0; } .belt-preamble { display: none; } .top-principal { display: none; } .top-titling { font-size: clamp(24px, 3vw, 34px); } .top-wording { gap: 8px; }  .lever-belt .pick { padding: 1px 0; } .film { padding-top: 2px; } .narrow-handle { min-height: 32px; } .casefile-footage { align-self: start; } }
/* Card: keep hover layers from adding scroll height; compact body at intermediate card widths. */
.card .footage, .k7 .footage { overflow: hidden; }
.footage-shade { transform: none; }
.k7 .order { overflow: hidden; }
.k7 .no-label { display: none; }
@media (min-width: 600px) and (max-width: 1599px) { .k7 { padding: 10px 10px 12px; } .k7 .body { padding-top: 6px; gap: 6px; align-items: flex-end; } .k7 .name { font-size: 15px; line-height: 1.15; padding: 4px 8px; } .k7 .attributes { font-size: 12px; gap: 4px 8px; } .k7 .verbs .deed { min-height: 32px; padding: 0 10px; font-size: 11px; } }
/* SEO editorial: shorter padding, three columns of 14/21 type from tablet up, one on a phone. */
.binder { gap: 12px; padding: 0 0 calc(var(--quartz-void-module) * 2); }
.binder-trunk { padding: 10px 12px; font-size: 14px; line-height: 21px; }
.binder p, .binder-tab p { font-size: 14px; line-height: 21px; margin: 0; }
.binder-tab { padding: 10px 12px; }
.binder-movement { gap: 8px; }
.binder-crown { gap: 2px; }
.binder-titling { font-size: clamp(20px, 1.8vw, 26px); line-height: 1.15; }
.binder-movement-titling { margin: 0; font-size: 16px; }
.binder .overhead { font-size: 12px; }
@media (min-width: 600px) { .binder-trunk { column-count: 2; column-gap: 24px; } .binder-movement { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 599px) { .binder-trunk { column-count: 1; } .binder-movement { grid-template-columns: 1fr; } .binder-trunk { padding: 8px 10px; } .binder-tab { padding: 8px 10px; } }

/* Gallery: asymmetric contact sheet - lead photograph across both tracks, remaining photographs tiled beneath on shared edges; every image uncropped, in flow (no max-height box). */
.film-slides { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 4px; width: 100%; max-width: min(100%, 44vh); aspect-ratio: auto; max-height: none; overflow: visible; align-items: start; }
.film-slides .pane-additional { display: contents; }
.film-slides .pane { margin: 0; min-width: 0; min-height: 0; height: auto; width: 100%; }
.film-slides .pane-principal { grid-column: 1 / -1; }
.film-slides .pane-handle { width: 100%; height: auto; aspect-ratio: auto !important; line-height: 0; display: block; }
.film-slides .pane-handle img { width: 100%; height: auto; max-width: 100%; max-height: none; display: block; }
@media (max-width: 599px) { .film-slides { grid-template-columns: 1fr; max-width: 100%; } .film-slides .pane-principal { grid-column: 1; } }
.binder-superhead { display: block; }
@media (min-width: 1200px) { .binder { grid-template-columns: minmax(220px, 1fr) minmax(0, 2.4fr); align-items: start; } .binder-crown { grid-column: 1; grid-row: 1 / span 2; align-self: start; } .binder-trunk { grid-column: 2; grid-row: 1; } .binder-movement { grid-column: 2; grid-row: 2; } }