/* The locked edition (owner, 3 Nov 2026: 04:46 "only has home screen and everything is locked"; 08:04 "ONLY DIGITAL ID NO FIELD CODE";
   08:05 "SHOULD SEE A DIGITAL ID CARD LIKE CAC CARD, A SMART DEVICE OPTION OR YUBI KEY LIKE OPTION ... ONCE SELECTED ... ACCESS DENIED";
   08:09 the É code still places the site on a device and shares it; the search shows this page, every other section grayed out and
   asking for the digital ID). Written for tools/locked/build_locked.py, which copies it to the locked site as locked.css.
   The site's own fonts, colours and sizes (the full site's home page, v178.5); text sizes in rem so the four text sizes work;
   nothing loaded from anywhere else; no inline styles (the security policy allows none). */
@font-face{ font-family: 'Space Grotesk'; src: url('fonts/SpaceGrotesk-Variable.woff2') format('woff2'); font-weight: 300 700; font-style: normal; font-display: swap; }
@font-face{ font-family: 'IBM Plex Sans'; src: url('fonts/IBMPlexSans-Regular.woff2') format('woff2'); font-weight: 400; font-style: normal; font-display: swap; }
@font-face{ font-family: 'IBM Plex Sans'; src: url('fonts/IBMPlexSans-SemiBold.woff2') format('woff2'); font-weight: 600; font-style: normal; font-display: swap; }
@font-face{ font-family: 'IBM Plex Mono'; src: url('fonts/IBMPlexMono-Medium.woff2') format('woff2'); font-weight: 500; font-style: normal; font-display: swap; }

:root{
  --ink: #0A0D12; --panel: #151D26; --panel-2: #10161E; --line: #2A3540; --paper: #F1F3F6; --dim: #98A3AE; --gray: #8E98A3;
  --brand: #C474FF; --brand-l: #D9A6FF; --region: #EE82EE;
  --hum: 255, 215, 0; --hum-l: #FFE34D; --pub: 74, 151, 226; --pub-l: #9CC8F2; --pri: 32, 184, 32; --pri-l: #62D962; --red: #E5484D; --red-l: #FF8A8E; --orb: #FF9F43;
  --font-head: 'Space Grotesk', sans-serif; --font-body: 'IBM Plex Sans', sans-serif; --font-mono: 'IBM Plex Mono', monospace;
  --lock: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7 10V7a5 5 0 0 1 10 0v3h1.2A1.8 1.8 0 0 1 20 11.8v8.4a1.8 1.8 0 0 1-1.8 1.8H5.8A1.8 1.8 0 0 1 4 20.2v-8.4A1.8 1.8 0 0 1 5.8 10zm2.3 0h5.4V7a2.7 2.7 0 0 0-5.4 0z'/%3E%3C/svg%3E");
}
*, *::before, *::after{ box-sizing: border-box; }
html{ background: var(--ink); color: var(--paper); -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
body{ margin: 0; min-width: 0; font-family: var(--font-body); font-size: 1rem; line-height: 1.6; background: var(--ink); color: var(--paper);
  text-align: center; overflow-wrap: break-word; }
button, input{ font: inherit; color: inherit; }
button{ cursor: pointer; }
a{ color: var(--brand-l); }
.lk-vh{ position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.lk-defs{ position: absolute; width: 0; height: 0; overflow: hidden; }
:focus-visible{ outline: 3px solid var(--paper); outline-offset: 3px; }
.lk-skip{ position: absolute; left: 50%; top: 8px; transform: translate(-50%, -200%); padding: 8px 14px; border-radius: 10px; background: var(--paper); color: var(--ink);
  font-weight: 600; text-decoration: none; z-index: 30; }
.lk-skip:focus{ transform: translate(-50%, 0); }

/* Locked: shown, grayed out, with a lock. Selecting it asks for the digital ID. */
.lk-locked{ color: var(--gray) !important; }
.lk-locked::before{ content: ''; display: inline-block; flex: none; width: .8em; height: .8em; margin-right: .4em; vertical-align: -.06em; background: currentColor;
  -webkit-mask: var(--lock) center / contain no-repeat; mask: var(--lock) center / contain no-repeat; }
.lk-locked:hover{ color: var(--paper) !important; }

/* The settings line: text size (left), search (centre), language (right) -- as the full site's home page */
.lk-settings{ display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); align-items: center; gap: 10px; padding: 14px 16px 0; }
.lk-settings > :first-child{ justify-self: start; } .lk-settings > :last-child{ justify-self: end; }
.lk-settings .lk-set{ max-width: 100%; }
.lk-set{ display: inline-flex; align-items: center; justify-content: center; min-width: 64px; min-height: 58px; max-width: calc(50% - 40px); padding: 0 16px;
  border: 1px solid var(--line); border-radius: 12px; background: var(--panel); font-family: var(--font-head); font-weight: 700; font-size: 1.375rem; line-height: 1.15;
  overflow-wrap: anywhere; }
.lk-set:hover{ border-color: var(--dim); }
.lk-set.lk-locked{ background: rgba(255, 255, 255, .02); }
.lk-srch{ flex: none; display: inline-grid; place-items: center; width: 52px; height: 52px; padding: 0; border: 3px solid var(--paper); border-radius: 50%; background: transparent; }
.lk-srch svg{ width: 30px; height: 30px; display: block; }
.lk-srch:hover{ border-color: var(--brand-l); }

/* The hero: AMERICAS, the É (the site's own code, scannable), NORTH */
.lk-hero{ display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); align-items: center; column-gap: clamp(10px, 3vw, 28px);
  margin: clamp(18px, 4vh, 44px) auto 0; padding: 0 12px; max-width: 100%; }
.lk-hero > .lk-word:first-child{ justify-self: end; } .lk-hero > .lk-word:last-child{ justify-self: start; }
.lk-word{ flex: 0 1 auto; min-width: 0; padding: 2px; font-family: var(--font-head); font-weight: 700; text-transform: uppercase;
  letter-spacing: .06em; font-size: min(2.03rem, 3.6vw); line-height: 1.15; white-space: nowrap; }
button.lk-word{ border: 0; border-radius: 8px; background: none; color: inherit; cursor: pointer; }
button.lk-word:hover{ color: var(--brand-l); }
.lk-e{ position: relative; flex: none; width: clamp(128px, 44vw, 240px); aspect-ratio: 1; padding: 0; border: 2px solid var(--brand); border-radius: 10px; background: var(--ink);
  overflow: hidden; }
.lk-e:hover{ border-color: var(--brand-l); }
.lk-qr{ position: absolute; inset: 0; width: 100%; height: 100%; display: block; }
.lk-e-mark{ position: absolute; inset: 0; display: grid; place-items: center; font-family: var(--font-head); font-weight: 700; font-size: calc(var(--e-w, 240px) * .44);
  line-height: 1; color: var(--brand); pointer-events: none; }
.lk-h1{ margin: 14px auto 0; padding: 0 12px; max-width: 40rem; font-family: var(--font-body); font-weight: 400; font-size: .95rem; line-height: 1.45; color: var(--dim); }

/* The box: Hazard · Disaster, the three user types, Support, then the digital ID line */
.lk-box{ width: min(1000px, calc(100% - 24px)); margin: clamp(18px, 3.5vh, 30px) auto 0; padding: 14px 14px 14px; border: 1px solid var(--line); border-radius: 20px;
  background: rgba(255, 255, 255, .016); }
.lk-hd, .lk-sup{ display: flex; align-items: center; justify-content: center; gap: 14px; margin: 2px 0 10px; font-family: var(--font-head); font-weight: 700;
  text-transform: uppercase; letter-spacing: .06em; font-size: min(1.56rem, 5.6vw); line-height: 1.6; color: var(--brand); }
.lk-hw{ position: relative; display: inline-flex; align-items: center; padding: 2px 6px; border: 0; background: none; font: inherit; letter-spacing: inherit; text-transform: inherit; color: var(--brand); }
.lk-hw:hover{ color: var(--brand-l); }
.lk-hw::after{ content: ''; position: absolute; left: -12%; right: -12%; bottom: -4px; height: 2px; border-radius: 2px;
  background: linear-gradient(90deg, transparent, rgba(241, 243, 246, .55) 45%, rgba(241, 243, 246, .55) 55%, transparent); }
.lk-dot{ flex: none; width: 12px; height: 12px; border-radius: 50%;
  background: radial-gradient(circle at 35% 30%, #fff 0%, #F4F1FF 35%, #D9D3EA 70%, #C1B2CC 100%);
  box-shadow: 0 0 6px 1px rgba(255, 255, 255, .85), 0 0 14px 4px rgba(238, 232, 255, .45); }
.lk-sup{ margin: 6px 0 4px; gap: clamp(28px, 12vw, 120px); }
.lk-sup-w{ position: relative; padding: 0 6px; }
.lk-types{ display: grid; grid-template-columns: repeat(3, minmax(0, 280px)); justify-content: center; gap: 10px; margin: 0 auto; }
html[data-text-step="2"] .lk-types, html[data-text-step="3"] .lk-types{ grid-template-columns: minmax(0, 560px); }
@media (max-width: 640px){ .lk-types{ grid-template-columns: minmax(0, 1fr); gap: 8px; } }
.lk-type{ --c: 142, 152, 163; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; min-width: 0; min-height: 79px; padding: 10px 10px;
  border: 2px solid rgba(var(--c), .45); border-radius: 14px; background: rgba(255, 255, 255, .025); }
.lk-type:hover{ border-color: rgba(var(--c), .9); }
.lk-type.lk-hum{ --c: var(--hum); border-color: rgba(var(--c), .6); background: linear-gradient(rgba(var(--c), .16), rgba(var(--c), .03)); color: rgb(var(--c)); }
.lk-type.lk-hum:hover{ border-color: rgb(var(--c)); }
.lk-type.lk-locked::before{ width: 1rem; height: 1rem; margin: 0 0 2px; }
.lk-type-s{ font-family: var(--font-mono); font-weight: 700; font-size: 1.05rem; letter-spacing: .14em; text-transform: uppercase; line-height: 1.5; overflow-wrap: anywhere; }
.lk-type-r{ font-family: var(--font-head); font-weight: 600; font-size: .85rem; line-height: 1.5; }

/* The digital ID line, in the box under Support */
.lk-bar{ margin: 16px auto 2px; max-width: 760px; padding: 12px 12px 10px; border: 1px solid rgba(196, 116, 255, .55); border-radius: 16px; background: rgba(196, 116, 255, .07); }
.lk-bar-k{ margin: 0 0 10px; font-family: var(--font-head); font-weight: 700; font-size: 1.1rem; letter-spacing: .02em; color: var(--paper); }
.lk-bar-k svg{ width: 1em; height: 1em; vertical-align: -.12em; margin-right: .35em; color: var(--brand); }
.lk-ids{ display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; margin: 0; }
@media (max-width: 760px){ .lk-ids{ grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.lk-panel .lk-ids{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
html[data-text-step="2"] .lk-ids, html[data-text-step="3"] .lk-ids{ grid-template-columns: minmax(0, 1fr); }
@media (max-width: 460px){ .lk-ids, .lk-panel .lk-ids{ grid-template-columns: minmax(0, 1fr); } }
.lk-idb{ display: flex; flex-direction: column; align-items: center; gap: 4px; min-width: 0; padding: 10px 8px 10px; border: 2px solid var(--line); border-radius: 14px;
  background: var(--panel); line-height: 1.25; overflow-wrap: anywhere; }
.lk-idb:hover{ border-color: var(--brand-l); background: rgba(196, 116, 255, .1); }
.lk-idb-art{ display: block; width: 100%; max-width: 172px; height: auto; aspect-ratio: 344 / 216; }
@media (max-width: 460px){ .lk-idb{ flex-direction: row; text-align: start; gap: 12px; } .lk-idb-art{ width: 112px; flex: none; } .lk-idb .lk-idb-tx{ align-items: flex-start; } }
.lk-idb-tx{ display: flex; flex-direction: column; align-items: inherit; gap: 2px; min-width: 0; }
.lk-idb-n{ font-family: var(--font-head); font-weight: 700; font-size: .98rem; color: var(--paper); }
.lk-idb-s{ font-size: .8rem; color: var(--dim); }
.lk-note{ margin: 10px 0 0; font-size: .8rem; color: var(--dim); }

/* The emergency line: never locked */
.lk-emg{ --er: 255, 31, 52; display: flex; align-items: center; justify-content: center; gap: 12px; width: min(760px, calc(100% - 24px)); margin: 18px auto 0; font-size: .95rem; line-height: 1.45; }
.lk-tri{ flex: none; width: 22px; height: 20px; }
.lk-emg-b{ min-height: 44px; padding: 6px 16px; border: 2px solid var(--red); border-radius: 12px; background: rgba(229, 72, 77, .1); font-family: var(--font-head); font-weight: 700;
  font-size: 1rem; color: var(--paper); }
.lk-emg-b:hover{ background: rgba(229, 72, 77, .22); }

/* The footer: hazard and disaster response as a tree, then the site's own six columns; every section locked */
.lk-foot{ margin-top: 30px; padding: 40px 0 28px; border-top: 1px solid var(--line); }
.lk-index{ width: min(1270px, calc(100% - 24px)); margin: 0 auto 34px; padding-bottom: 30px; border-bottom: 1px solid var(--line); }
.lk-index-h{ margin: 0 0 4px; font-family: var(--font-head); font-weight: 700; font-size: 1.2rem; letter-spacing: .03em; }
.lk-index-p{ margin: 0 auto 18px; max-width: 46rem; color: var(--dim); font-size: .9rem; }
.lk-tree{ display: grid; grid-template-columns: repeat(2, minmax(0, 600px)); justify-content: center; gap: 22px 32px; margin: 0; padding: 0; list-style: none; }
@media (max-width: 860px){ .lk-tree{ grid-template-columns: minmax(0, 1fr); } }
.lk-tree > li > .lk-index-p{ margin: -2px 0 10px; font-size: .82rem; }
.lk-tree ul{ display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); grid-auto-rows: minmax(2.9rem, auto); gap: 6px; margin: 0; padding: 0; list-style: none; }
.lk-tree ul > li{ display: flex; min-width: 0; }
.lk-tree ul > li:last-child:nth-child(odd){ grid-column: 1 / -1; justify-self: center; width: calc(50% - 3px); }
.lk-chip{ display: flex; align-items: center; justify-content: center; width: 100%; min-height: 38px; padding: 4px 11px; text-align: center; border: 1px solid var(--line); border-radius: 999px; background: rgba(255, 255, 255, .02);
  font-size: .86rem; line-height: 1.3; color: var(--paper); }
.lk-chip:hover{ border-color: var(--brand-l); background: rgba(196, 116, 255, .1); }
.lk-grid{ display: grid; grid-template-columns: repeat(6, minmax(0, 192px)); justify-content: center; gap: 24px; width: min(1270px, calc(100% - 24px)); margin: 0 auto; }
@media (max-width: 1240px){ .lk-grid{ grid-template-columns: repeat(3, minmax(0, 220px)); row-gap: 30px; } }
@media (max-width: 600px){ .lk-grid{ grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 26px 8px; } }
html[data-text-step="2"] .lk-grid, html[data-text-step="3"] .lk-grid{ grid-template-columns: repeat(2, minmax(0, 1fr)); width: min(900px, calc(100% - 24px)); }
@media (max-width: 600px){ html[data-text-step="2"] .lk-grid, html[data-text-step="3"] .lk-grid{ grid-template-columns: minmax(0, 1fr); } }
.lk-col{ display: flex; flex-direction: column; align-items: center; min-width: 0; }
.lk-h{ --h: var(--brand-l); --bar: var(--brand); margin: 0 0 6px; font-family: var(--font-mono); font-weight: 700; font-size: 1rem; letter-spacing: .12em; text-transform: uppercase;
  line-height: 1.6; color: var(--h); overflow-wrap: anywhere; }
.lk-h::after{ content: ''; display: block; width: 32px; height: 3px; margin: 2px auto 2px; border-radius: 2px; background: var(--bar); }
.lk-h.lk-h-reg{ --h: var(--region); --bar: var(--region); }
.lk-h.lk-h-pub{ --h: var(--pub-l); --bar: rgb(var(--pub)); }
.lk-h.lk-h-pri{ --h: var(--pri-l); --bar: rgb(var(--pri)); }
.lk-h.lk-h-hum{ --h: var(--hum-l); --bar: rgb(var(--hum)); text-shadow: 0 0 10px rgba(255, 215, 0, .55), 0 0 2px rgba(255, 215, 0, .3); }
.lk-h.lk-h-tax{ --h: var(--paper); --bar: var(--paper); }
.lk-a{ display: block; margin: 3px auto; padding: 2px 4px; min-height: 24px; max-width: 100%; border: 0; background: none; color: var(--dim); font-family: var(--font-body);
  font-size: .9rem; line-height: 1.4; text-align: center; overflow-wrap: anywhere; text-decoration: none; }
.lk-a:hover{ color: var(--paper); text-decoration: underline; text-underline-offset: 3px; }
.lk-a.lk-open{ color: var(--paper); }
.lk-foot-set{ display: flex; justify-content: center; gap: 8px; width: min(1270px, calc(100% - 24px)); margin: 30px auto 0; padding-top: 20px; border-top: 1px solid var(--line); }
.lk-foot-set .lk-set{ max-width: calc(50% - 4px); }

/* The boxes: the digital ID, search, place on a device, text size, emergency */
.lk-over{ position: fixed; inset: 0; z-index: 20; display: flex; align-items: center; justify-content: center; padding: 12px; background: rgba(5, 7, 10, .82); }
.lk-over[hidden]{ display: none; }
.lk-over-top{ align-items: flex-start; }
.lk-panel{ position: relative; width: min(40rem, 100%); max-height: calc(100vh - 24px); max-height: calc(100dvh - 24px); overflow: auto; overscroll-behavior: contain;
  padding: 22px 18px 18px; border: 1px solid var(--line); border-radius: 20px; background: var(--panel-2); box-shadow: 0 24px 80px rgba(0, 0, 0, .55); }
.lk-x{ position: absolute; top: 8px; right: 8px; display: grid; place-items: center; width: 44px; height: 44px; padding: 0; border: 0; border-radius: 12px; background: transparent;
  color: var(--paper); font-size: 1.6rem; line-height: 1; }
.lk-x:hover{ background: rgba(255, 255, 255, .06); }
.lk-lock-ic{ display: block; width: 36px; height: 36px; margin: 0 auto 4px; color: var(--brand); }
.lk-t{ margin: 0 40px 4px; font-family: var(--font-head); font-weight: 700; font-size: 1.4rem; line-height: 1.3; }
.lk-t:focus{ outline: none; }
.lk-what{ margin: 0 0 4px; color: var(--paper); font-size: .98rem; }
.lk-lbl{ margin: 0 0 12px; color: var(--dim); font-size: .92rem; }
.lk-btn{ flex: none; min-height: 48px; max-width: 100%; padding: 8px 18px; border: 2px solid var(--brand); border-radius: 12px; background: var(--brand); color: var(--ink);
  font-family: var(--font-head); font-weight: 700; font-size: 1rem; line-height: 1.2; overflow-wrap: anywhere; }
.lk-btn:hover{ background: var(--brand-l); border-color: var(--brand-l); }
a.lk-btn{ display: inline-flex; align-items: center; justify-content: center; text-decoration: none; }
.lk-btn-2{ background: transparent; color: var(--paper); }
.lk-btn-2:hover{ background: rgba(196, 116, 255, .16); }
.lk-row{ display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; margin: 16px 0 0; }

/* Signing in: the chosen ID, a light passing over it, the progress and the steps (as a card or key reader shows them) */
.lk-v[hidden]{ display: none; }
.lk-spin{ display: inline-block; width: .7em; height: .7em; margin-left: .5em; border: 2px solid var(--brand); border-right-color: transparent; border-radius: 50%; vertical-align: .02em; }
.lk-try-art{ position: relative; width: min(100%, 300px); margin: 12px auto 0; border-radius: 16px; overflow: hidden; }
.lk-art{ display: block; width: 100%; height: auto; aspect-ratio: 344 / 216; }
.lk-scan{ position: absolute; top: 0; bottom: 0; left: 0; width: 30%; transform: translateX(-110%);
  background: linear-gradient(90deg, transparent, rgba(217, 166, 255, .5) 50%, transparent); }
.lk-prog{ width: min(100%, 300px); height: 6px; margin: 14px auto 0; border-radius: 3px; background: var(--line); overflow: hidden; }
.lk-prog i{ display: block; width: 0; height: 100%; border-radius: 3px; background: var(--brand); }
.lk-prog i.lk-go{ width: 100%; }
.lk-log{ width: min(100%, 300px); min-height: 5.4em; margin: 12px auto 0; padding: 8px 10px; border: 1px solid var(--line); border-radius: 10px; background: var(--ink);
  text-align: start; font-family: var(--font-mono); font-size: .8rem; line-height: 1.55; color: var(--dim); }
.lk-log-l{ margin: 0; }
.lk-log-l::before{ content: '\203A\00A0'; color: var(--brand-l); }
.lk-log-l:last-child{ color: var(--paper); }
@media (prefers-reduced-motion: no-preference){
  .lk-spin{ animation: lk-rot .8s linear infinite; }
  .lk-scan{ animation: lk-scan 1.3s ease-in-out infinite; }
  .lk-prog i.lk-go{ width: 0; animation: lk-fill 3.1s linear forwards; }
}
@keyframes lk-rot{ to{ transform: rotate(360deg); } }
@keyframes lk-scan{ to{ transform: translateX(340%); } }
@keyframes lk-fill{ to{ width: 100%; } }

/* Access denied */
.lk-deny-ic{ display: block; width: 56px; height: 56px; margin: 0 auto 4px; }
.lk-t-deny{ color: var(--red-l); text-transform: uppercase; letter-spacing: .08em; font-size: 1.7rem; }
.lk-att{ width: min(100%, 27rem); margin: 14px auto 0; padding: 8px 12px; border: 1px solid rgba(229, 72, 77, .5); border-radius: 12px; background: rgba(229, 72, 77, .06);
  text-align: start; font-size: .88rem; line-height: 1.4; }
.lk-att > div{ display: grid; grid-template-columns: 6.8rem minmax(0, 1fr); gap: 8px; padding: 4px 0; }
.lk-att > div + div{ border-top: 1px solid rgba(229, 72, 77, .18); }
.lk-att dt{ font-family: var(--font-mono); font-size: .74rem; letter-spacing: .1em; text-transform: uppercase; color: var(--dim); padding-top: .12em; }
.lk-att dd{ margin: 0; overflow-wrap: anywhere; }
.lk-att .lk-att-res{ color: var(--red-l); font-weight: 600; }
.lk-deny-w{ margin: 12px auto 0; max-width: 30rem; font-size: .95rem; color: var(--dim); }

/* Search: this page, then every other section grayed out */
.lk-spanel{ width: min(46rem, 100%); padding: 12px 12px 14px; text-align: start; }
.lk-sform{ display: flex; align-items: center; gap: 8px; margin: 0; padding: 4px 4px 4px 12px; border: 2px solid var(--brand); border-radius: 999px; background: var(--ink); }
.lk-sform svg{ flex: none; width: 22px; height: 22px; }
.lk-q{ flex: 1 1 auto; min-width: 0; min-height: 44px; padding: 6px 4px; border: 0; background: transparent; color: var(--paper); font-size: 1.05rem; }
.lk-q:focus{ outline: none; }
.lk-sform:focus-within{ box-shadow: 0 0 0 3px rgba(241, 243, 246, .9); }
.lk-q::placeholder{ color: #7B8794; }
.lk-q::-webkit-search-cancel-button{ display: none; }
.lk-sx{ flex: none; display: grid; place-items: center; width: 44px; height: 44px; padding: 0; border: 0; border-radius: 50%; background: transparent; font-size: 1.5rem; line-height: 1; }
.lk-sx:hover{ background: rgba(255, 255, 255, .08); }
.lk-shint{ margin: 10px 4px 6px; font-size: .86rem; color: var(--dim); }
.lk-rg{ margin: 14px 4px 6px; font-family: var(--font-mono); font-weight: 700; font-size: .78rem; letter-spacing: .12em; text-transform: uppercase; color: var(--brand-l); }
.lk-rg.lk-rg-lk{ color: var(--gray); }
.lk-rs{ margin: 10px 4px 4px; font-family: var(--font-head); font-weight: 600; font-size: .86rem; color: var(--gray); }
.lk-rl{ display: grid; gap: 4px; margin: 0; padding: 0; list-style: none; }
.lk-r{ display: flex; align-items: baseline; flex-wrap: wrap; gap: 2px 10px; width: 100%; min-height: 44px; padding: 8px 12px; border: 1px solid var(--line); border-radius: 12px;
  background: var(--panel); text-align: start; line-height: 1.35; }
.lk-r:hover{ border-color: var(--brand-l); }
.lk-r-t{ font-weight: 600; }
.lk-r-s{ font-size: .8rem; color: var(--dim); }
.lk-r.lk-locked{ display: flex; background: rgba(255, 255, 255, .015); border-style: dashed; }
.lk-r.lk-locked::before{ align-self: center; }
.lk-r.lk-locked .lk-r-s{ color: #7B8794; }
.lk-none{ margin: 10px 4px; color: var(--dim); font-size: .92rem; }

/* Place Human Émergent on this device, or share it (as the full site's É menu) */
.lk-place{ display: grid; gap: 10px; margin: 12px 0 0; }
.lk-place-opt{ display: flex; flex-direction: column; align-items: center; gap: 2px; padding: 12px; border: 2px solid var(--line); border-radius: 14px; background: var(--panel); }
button.lk-place-opt:hover{ border-color: var(--brand-l); }
.lk-place-n{ font-family: var(--font-head); font-weight: 700; font-size: 1.05rem; margin: 0; }
.lk-place-s{ font-size: .86rem; color: var(--dim); margin: 0; }
.lk-place .lk-row{ margin-top: 8px; }
.lk-status{ min-height: 1.4em; margin: 10px 0 0; font-size: .92rem; color: var(--paper); }

/* Text size */
.lk-sizes{ display: grid; gap: 8px; margin: 12px 0 0; }
.lk-opt{ display: flex; align-items: center; justify-content: center; gap: 12px; min-height: 52px; padding: 8px 12px; border: 2px solid var(--line); border-radius: 14px;
  background: var(--panel); font-family: var(--font-head); font-weight: 600; overflow-wrap: anywhere; }
.lk-opt[aria-current="true"]{ border-color: var(--brand); }
.lk-opt:hover{ border-color: var(--brand-l); }

/* Emergency */
.lk-911{ display: inline-flex; align-items: center; justify-content: center; min-width: 9rem; min-height: 64px; margin: 12px 0 4px; padding: 6px 22px; border: 3px solid var(--red);
  border-radius: 16px; background: rgba(229, 72, 77, .14); color: var(--paper); font-family: var(--font-head); font-weight: 700; font-size: 2.4rem; line-height: 1; text-decoration: none; }
.lk-911:hover{ background: rgba(229, 72, 77, .26); }
.lk-emg-p{ margin: 8px auto 0; max-width: 30rem; font-size: .95rem; }
.lk-emg-p.lk-dimp{ color: var(--dim); font-size: .86rem; }

/* Region: where the page is, then every other region, locked */
.lk-regs{ display: grid; gap: 8px; margin: 12px 0 0; }
.lk-reg-cur{ border-color: var(--brand); }
.lk-tick{ color: var(--brand-l); font-weight: 700; }
.lk-opt.lk-locked{ background: rgba(255, 255, 255, .02); }

/* Language */
.lk-langs{ display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 9.5rem), 1fr)); gap: 8px; margin: 12px 0 0; }
.lk-langs .lk-opt{ flex-direction: column; gap: 0; line-height: 1.25; }
.lk-opt b{ font-weight: 700; font-size: 1.08rem; }
.lk-opt-s{ font-family: var(--font-body); font-weight: 400; font-size: .78rem; color: var(--dim); }

/* I have an emergency: the Human emergency form, as the full site draws it (style.css .nav-emergency-panel and #emgPage) */
.lk-emgp{ --er: 255, 31, 52; width: min(36rem, 100%); border: 2px solid rgb(var(--er)); background: linear-gradient(180deg, rgba(var(--er), .07), rgba(var(--er), 0) 55%), var(--ink); }
.lk-emg-h{ font-size: clamp(1.6rem, 6vw, 2.2rem); margin: 2px 40px 12px; }
.emg-lead{ display: flex; align-items: center; justify-content: center; gap: 8px; margin: 0; padding: 12px; border: 1px solid rgba(var(--er), .6); border-radius: 12px;
  background: rgba(var(--er), .12); font-family: var(--font-head); font-weight: 700; font-size: 1.02rem; line-height: 1.35; }
.emg-tri{ position: relative; display: inline-grid; place-items: center; flex: none; width: 26px; height: 24px; line-height: 0; }
.emg-tri svg{ display: block; width: 100%; height: 100%; overflow: visible; fill: none; stroke: rgb(var(--er)); stroke-width: 2; stroke-linejoin: round; }
.emg-orb{ position: absolute; left: 50%; top: 10%; width: 30%; height: 30%; transform: translate(-50%, -50%); border-radius: 50%;
  background: radial-gradient(circle at 35% 30%, #FFAE4D 0%, #FF8C00 35%, #DB7800 70%, #A85C00 100%); box-shadow: 0 0 6px 1px rgba(255, 140, 0, .85), 0 0 14px 4px rgba(255, 163, 51, .45); }
.emg-pickrow{ display: grid; grid-template-columns: minmax(0, 1fr) auto auto; gap: 8px; margin: 12px 0 2px; }
.emg-pick{ width: 100%; min-width: 0; min-height: 46px; margin: 0; padding: 0 12px; border: 1px solid rgba(var(--er), .45); border-radius: 12px; background: var(--ink); color: var(--paper);
  font-family: var(--font-head); font-size: .95rem; font-weight: 700; text-align: center; text-align-last: center; }
.emg-lang{ min-height: 46px; padding: 0 14px; border: 1px solid rgba(var(--er), .45); border-radius: 12px; background: var(--ink); font-family: var(--font-head); font-weight: 700;
  font-size: 1rem; }
.emg-pick:focus-visible, .emg-lang:hover, .emg-lang:focus-visible{ border-color: rgb(var(--er)); }
.emg-view{ min-height: 6rem; }
.emg-big{ display: flex; flex-direction: column; align-items: center; gap: 8px; padding: 14px 0 12px; }
.emg-big-num{ font-family: var(--font-head); font-weight: 700; font-size: clamp(3.2rem, 15vw, 4.8rem); line-height: 1; color: rgb(var(--er)); }
.emg-big-num.emg-big-num-sm{ font-size: 2.2rem; }
.emg-call{ color: rgb(var(--er)); font-weight: 700; text-decoration: none; border-bottom: 2px solid rgba(var(--er), .45); }
.emg-big-num .emg-call{ display: inline-block; min-width: 2.6em; padding: .08em .4em .12em; border: 2px solid rgba(var(--er), .65); border-radius: 16px; background: rgba(var(--er), .1); }
.emg-call:hover, .emg-call:focus-visible{ background: rgba(var(--er), .2); border-color: rgb(var(--er)); }
.emg-big-label{ display: block; margin-top: 2px; font-size: .8rem; font-weight: 400; color: var(--dim); }
.emg-big-rest{ display: flex; flex-direction: column; align-items: center; gap: 4px; margin-top: 6px; }
.emg-big-more{ font-family: var(--font-head); font-size: 1.15rem; font-weight: 700; }
.emg-big-scope{ display: inline-flex; align-items: center; justify-content: center; gap: 8px; margin-top: 6px; font-family: var(--font-mono); font-size: .86rem; letter-spacing: .04em; }
.emg-info-btn{ display: inline-flex; align-items: center; justify-content: center; min-width: 36px; min-height: 36px; padding: 0; border: 0; background: none; color: rgb(var(--er)); }
.emg-info-btn:hover, .emg-info-btn[aria-expanded="true"]{ color: var(--paper); }
.e-info-mark{ position: relative; display: inline-block; font-family: var(--font-head); font-weight: 700; font-size: 1.05rem; line-height: 1; }
.e-info-mark::before{ content: "E"; }
.e-info-mark::after{ content: ""; position: absolute; top: -.2em; left: 50%; width: .16em; height: .4em; background: currentColor; border-radius: 1px; transform: translateX(-50%) rotate(28deg); }
.emg-varies{ display: flex; align-items: center; justify-content: center; gap: 8px; flex-wrap: wrap; margin: 14px 0 10px; font-size: .95rem; font-weight: 700; }
.emg-list{ display: grid; gap: 8px; margin: 0 0 12px; padding: 0; list-style: none; }
.emg-list li{ display: flex; flex-direction: column; align-items: center; gap: 4px; padding: 10px 12px; border: 1px solid var(--line); border-radius: 12px; background: rgba(255, 255, 255, .02); }
.emg-place{ font-size: .84rem; color: var(--dim); }
.emg-num{ font-family: var(--font-head); font-size: 1.06rem; font-weight: 700; text-align: center; }
.emg-under{ display: block; max-width: 34ch; margin: 6px auto 0; font-size: .85rem; line-height: 1.35; font-weight: 600; color: #F4BD7A; overflow-wrap: anywhere; }
.emg-more{ margin: 8px 0 4px; padding: 10px 12px; border: 1px solid rgba(var(--er), .6); border-radius: 12px; background: var(--ink); }
.emg-more[hidden]{ display: none; }
.emg-more > :first-child{ margin-top: 0; }
.emg-note{ max-width: 46ch; margin: 10px auto 0; font-size: .86rem; line-height: 1.55; opacity: .86; }
.emg-verified{ margin: 12px auto 0; font-family: var(--font-mono); font-size: .72rem; line-height: 1.6; color: var(--dim); }
.emg-split{ margin: 18px 0 10px; padding-top: 12px; border-top: 1px solid var(--line); font-size: .86rem; color: var(--dim); }
.emg-hd{ display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.human-choice{ display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; min-height: 58px; padding: 8px 10px; border: 1.5px dashed var(--line);
  border-radius: 12px; background: var(--ink); }
.human-choice.lk-locked::before{ width: .95rem; height: .95rem; margin: 0 0 2px; }
.human-choice-t{ font-family: var(--font-head); font-weight: 700; font-size: 1.05rem; }
.human-choice-d{ font-size: .78rem; }
.emg-honest-short{ margin: 10px auto 0; font-size: .82rem; opacity: .8; }

/* Our definition of each hazard and disaster (response-types.html) */
.lk-defp{ width: min(44rem, 100%); }
.lk-defs-s{ margin: 18px 0 0; }
.lk-kick{ margin: 0; font-family: var(--font-mono); font-size: .76rem; letter-spacing: .12em; text-transform: uppercase; color: var(--dim); }
.lk-defs-h{ margin: 2px 0 4px; font-family: var(--font-head); font-weight: 700; font-size: 1.3rem; color: var(--brand-l); }
.lk-defs-h:focus{ outline: none; }
.lk-lede{ max-width: 34rem; margin: 0 auto 10px; font-size: .9rem; color: var(--dim); }
.lk-dl{ display: grid; gap: 6px; margin: 0; padding: 0; list-style: none; text-align: start; }
.lk-d{ border: 1px solid var(--line); border-radius: 12px; background: var(--panel); }
.lk-d[open]{ border-color: var(--brand); }
.lk-d summary{ display: flex; align-items: center; justify-content: space-between; gap: 10px; min-height: 46px; padding: 8px 14px; cursor: pointer; font-family: var(--font-head);
  font-weight: 700; list-style: none; }
.lk-d summary::-webkit-details-marker{ display: none; }
.lk-d summary::after{ content: '+'; flex: none; color: var(--brand-l); font-size: 1.25rem; line-height: 1; }
.lk-d[open] summary::after{ content: '\2013'; }
.lk-d p{ margin: 0; padding: 0 14px 12px; font-size: .92rem; line-height: 1.55; }

/* Any other address (404.html) */
.lk-404{ padding: 18vh 16px 40px; }
.lk-404 .lk-row{ margin-top: 18px; }

html.lk-locked-open body{ overflow: hidden; }
@media (prefers-reduced-motion: no-preference){ .lk-dot{ animation: lk-pulse 3.2s ease-in-out infinite; } }
@keyframes lk-pulse{ 50%{ box-shadow: 0 0 4px 1px rgba(255, 255, 255, .6), 0 0 10px 3px rgba(238, 232, 255, .3); } }