/* registry index (bare) — design workstream handback, 4 August 2026.

   THIS PAGE LOADS THIS STYLESHEET AND NOTHING ELSE. app.css is deliberately not loaded here.
   Both were in the <head> at first and the page rendered pale with white input boxes: app.css's
   `body.bare{background:var(--bg)}` out-specifies this file's plain `body{background:#0a1430}`,
   and its bare `input` rules beat `.field`. Raising specificity selector by selector would have
   meant touching almost every rule the design workstream wrote and getting one of them wrong.
   The page uses none of app.css's vocabulary any more — .authcard and friends are gone — so the
   honest fix is to stop loading it. The @font-face block below is lifted from app.css verbatim
   because that was the one thing this page still needed from it; the url()s are relative to
   assets/, where both files live, so they resolve unchanged.
*/
@font-face{font-family:'Bricolage Grotesque';src:url('fonts/bricolage-grotesque-600-latin.woff2') format('woff2');font-weight:600;font-display:swap}
@font-face{font-family:'Outfit';src:url('fonts/outfit-400-latin.woff2') format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:'Outfit';src:url('fonts/outfit-500-latin.woff2') format('woff2');font-weight:500;font-display:swap}
@font-face{font-family:'JetBrains Mono';src:url('fonts/jetbrains-mono-500-latin.woff2') format('woff2');font-weight:500;font-display:swap}
@font-face{font-family:'Instrument Serif';src:url('fonts/instrument-serif-400-italic-latin.woff2') format('woff2');font-weight:400;font-style:italic;font-display:swap}


:root{--navy:#0D2775;--pink:#ED99ED;--aqua:#6EEDD1;--off:#F4F4FB;--body-c:#C9CFE8;--mut:#98A2C8;--faint:#7C87B4;--glass:rgba(14,23,54,.72);--gline:rgba(244,244,251,.14);--disp:'Bricolage Grotesque',system-ui,sans-serif;--bodyf:'Outfit',system-ui,sans-serif;--mono:'JetBrains Mono',ui-monospace,monospace;--ser:'Instrument Serif',Georgia,serif}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;min-height:100vh;background:#0a1430;color:var(--off);font:400 14.5px/1.55 var(--bodyf);-webkit-font-smoothing:antialiased;display:flex;align-items:center;justify-content:center;padding:44px 18px 100px}
body::before{content:"";position:fixed;inset:0;pointer-events:none;z-index:-2;background:radial-gradient(1200px 700px at 50% -14%,rgba(20,72,196,.62),transparent 72%),radial-gradient(820px 560px at 8% 104%,rgba(237,153,237,.16),transparent 68%),radial-gradient(880px 580px at 94% 106%,rgba(110,237,209,.14),transparent 68%),radial-gradient(560px 380px at 78% 8%,rgba(110,237,209,.07),transparent 70%)}
.pbg-aurora{position:fixed;inset:0;pointer-events:none;overflow:hidden;z-index:-3;will-change:transform}
.pbg-aurora span{position:absolute;width:56vmax;height:56vmax;border-radius:50%;filter:blur(90px);opacity:.55}
.pbg-aurora .a1{background:radial-gradient(circle,rgba(20,72,196,.55),transparent 62%);top:-24vmax;left:8vmax}
.pbg-aurora .a2{background:radial-gradient(circle,rgba(110,237,209,.16),transparent 62%);bottom:-26vmax;right:-12vmax}
.pbg-aurora .a3{background:radial-gradient(circle,rgba(237,153,237,.16),transparent 62%);bottom:-28vmax;left:-14vmax}
#sky{position:fixed;inset:0;width:100%;height:100%;pointer-events:none;opacity:.9;z-index:-1}
a{color:#8FE9D2;text-decoration:none}
a:hover{color:var(--pink)}
.mono{font-family:var(--mono)}
@keyframes fadeUp{from{transform:translateY(12px);opacity:0}to{transform:none;opacity:1}}
@keyframes rings{0%{transform:scale(1);opacity:.5}100%{transform:scale(1.75);opacity:0}}
@keyframes spin{to{--ang:360deg}}
@keyframes nudge{0%,100%{transform:none}30%{transform:translateX(-4px)}60%{transform:translateX(3px)}}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}}
.wrap{width:100%;max-width:460px;text-align:center}
.hero{margin-bottom:26px}
.hero .wordmark{height:26px;margin:0 auto 20px;display:block;animation:fadeUp .5s ease both}
.hero .eyebrow{font-family:var(--mono);font-size:10px;letter-spacing:.26em;color:var(--aqua);text-transform:uppercase;animation:fadeUp .5s .06s ease both}
.hero h1{font-family:var(--disp);font-weight:600;font-size:clamp(29px,5vw,38px);line-height:1.14;letter-spacing:-.01em;margin:14px 0 10px;color:var(--off);text-wrap:pretty;animation:fadeUp .5s .12s ease both}
.hero h1 .ser{font-family:var(--ser);font-style:italic;font-weight:400;color:var(--pink)}
.hero .lede{margin:0 auto;max-width:46ch;font-size:14.5px;font-weight:300;color:var(--body-c);line-height:1.65;animation:fadeUp .5s .18s ease both}
@property --ang{syntax:"<angle>";initial-value:0deg;inherits:false}
.card{position:relative;text-align:left;background:var(--glass);border:1px solid var(--gline);border-radius:18px;padding:26px 28px 22px;backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);box-shadow:0 24px 70px rgba(4,8,24,.55),inset 0 1px 0 rgba(255,255,255,.07);animation:fadeUp .55s .22s ease both}
.card::before{content:"";position:absolute;inset:-1px;border-radius:19px;padding:1px;background:conic-gradient(from var(--ang),transparent 0 62%,rgba(110,237,209,.55) 72%,rgba(237,153,237,.55) 82%,transparent 92%);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;animation:spin 16s linear infinite;pointer-events:none;opacity:.6}
.card-head{display:flex;align-items:baseline;justify-content:center;gap:12px;margin-bottom:6px;flex-wrap:wrap}
.who-line{font-size:13px;color:var(--body-c);text-align:center}
.clock{font-family:var(--mono);font-size:9.5px;letter-spacing:.1em;color:var(--aqua);white-space:nowrap}
.flashwrap{margin:12px 0 2px}
.flash{display:grid;grid-template-columns:28px 1fr;gap:11px;align-items:start;border-radius:12px;padding:13px 15px;background:rgba(192,57,43,.18);border:1px solid rgba(255,122,110,.38);animation:fadeUp .35s ease both}
.flash .f-ic{width:28px;height:28px;border-radius:8px;display:flex;align-items:center;justify-content:center;background:rgba(255,122,110,.16)}
.flash .f-t{font-weight:600;font-size:13.5px;color:#FFD9D4;line-height:1.35}
.flash .f-b{display:block;font-size:12.5px;color:#F2BCB5;line-height:1.55;margin-top:3px}
label.lab{display:block;font-family:var(--mono);font-size:9.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--mut);margin:16px 0 7px}
.field{display:block;width:100%;background:rgba(7,12,30,.6);border:1px solid var(--gline);border-radius:10px;color:var(--off);padding:12px 13px;font:400 14.5px var(--bodyf);outline:none;transition:border-color .15s,box-shadow .15s}
.field:focus{border-color:rgba(110,237,209,.75);box-shadow:0 0 0 3px rgba(110,237,209,.14)}
.field.bad{border-color:rgba(255,122,110,.7);box-shadow:0 0 0 3px rgba(255,122,110,.14);animation:nudge .3s ease}
.field:-webkit-autofill{-webkit-box-shadow:0 0 0 40px #101a3c inset;-webkit-text-fill-color:var(--off)}
.caps{display:none;font-family:var(--mono);font-size:8px;letter-spacing:.12em;color:#FFDFA1;background:rgba(255,190,80,.14);border:1px solid rgba(255,190,80,.35);border-radius:4px;padding:2px 6px;margin-left:8px;vertical-align:1px}
.caps.show{display:inline-block}
.btn-pink{position:relative;overflow:hidden;display:flex;align-items:center;justify-content:center;gap:8px;width:100%;margin-top:18px;background:var(--pink);color:#3a1440;border:0;border-radius:10px;padding:13px 16px;font:600 15px var(--bodyf);cursor:pointer;transition:background .12s,transform .08s}
.btn-pink:hover{background:#e88ae8}
.btn-pink:active{transform:scale(.99)}
.btn-pink .sweep{position:absolute;left:0;top:0;bottom:0;width:0;background:rgba(58,20,64,.18);pointer-events:none}
.alt-lab{display:flex;align-items:center;gap:12px;margin:20px 0 12px;font-family:var(--mono);font-size:8.5px;letter-spacing:.2em;color:var(--faint);text-transform:uppercase;white-space:nowrap}
.alt-lab::before,.alt-lab::after{content:"";flex:1;height:1px;background:var(--gline)}
.tiles{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.tile{display:flex;align-items:center;justify-content:center;gap:8px;padding:11px 10px;border-radius:10px;border:1px solid var(--gline);background:rgba(255,255,255,.04);color:#E6E9F8;font-size:13.5px;font-weight:500;cursor:pointer;transition:background .12s,border-color .12s}
.tile:hover{background:rgba(255,255,255,.09);border-color:rgba(244,244,251,.26);color:#fff}
.activate{margin-top:20px;padding:15px 16px 16px;border-radius:12px;border:1px solid rgba(110,237,209,.24);background:rgba(110,237,209,.05)}
.activate .zone-lab{font-family:var(--mono);font-size:8.5px;letter-spacing:.2em;color:var(--aqua);text-transform:uppercase}
.activate p{margin:8px 0 12px;font-size:13px;color:var(--body-c);line-height:1.6}
.btn-aqua{display:flex;align-items:center;justify-content:center;width:100%;padding:11px 14px;border-radius:10px;border:1px solid rgba(110,237,209,.45);color:#9FF2DE;background:transparent;font:600 14px var(--bodyf);cursor:pointer;transition:background .12s}
.btn-aqua:hover{background:rgba(110,237,209,.1);color:#C4F7EA}
.staffrow{margin-top:18px;padding-top:15px;border-top:1px solid rgba(244,244,251,.1);display:flex;justify-content:center}
.staffrow a{display:inline-flex;align-items:center;gap:7px;font-size:13px;color:var(--mut)}
.staffrow a:hover{color:var(--off)}
body.nosso .staffrow{display:none}
.sent{animation:fadeUp .45s ease both}
.beacon{position:relative;width:60px;height:60px;margin:10px 0 16px}
.beacon .core{position:absolute;inset:0;border-radius:50%;background:rgba(110,237,209,.12);border:1px solid rgba(110,237,209,.3);display:flex;align-items:center;justify-content:center}
.beacon .ring{position:absolute;inset:0;border-radius:50%;border:1.5px solid rgba(110,237,209,.7);animation:rings 2.4s ease-out infinite}
.beacon .ring.r2{animation-delay:1.2s}
.sent h2{font-family:var(--disp);font-weight:600;font-size:22px;margin:0;color:var(--off)}
.sent .s-body{margin:9px 0 0;font-size:13.5px;color:var(--body-c);line-height:1.65}
.addr{font-family:var(--mono);font-size:11.5px;background:rgba(255,255,255,.06);border:1px solid var(--gline);border-radius:6px;padding:2px 7px;color:var(--off);white-space:nowrap}
.sent-meta{margin-top:13px;font-family:var(--mono);font-size:9px;letter-spacing:.16em;color:var(--faint);text-transform:uppercase}
.spam{margin:16px 0 0;font-size:12.5px;color:var(--mut);line-height:1.6}
.spam a{font-weight:500;cursor:pointer}
.spam .cool{font-family:var(--mono);font-size:10.5px;color:var(--faint);margin-left:4px}
.backlink{display:inline-block;margin-top:14px;font-size:12.5px;font-weight:500;color:var(--mut);cursor:pointer}
.backlink:hover{color:var(--off)}
.request{margin:20px auto 0;max-width:44ch;font-size:12.5px;color:var(--mut);line-height:1.6;animation:fadeUp .5s .3s ease both}
.stamp{position:fixed;right:24px;bottom:24px;width:120px;height:51px;pointer-events:none;z-index:2;filter:drop-shadow(0 4px 12px rgba(4,8,24,.5))}
@media (max-width:520px){.stamp{bottom:64px;right:16px}}
.foot{margin-top:24px;font-family:var(--mono);font-size:9px;letter-spacing:.18em;color:#66719E;text-transform:uppercase;animation:fadeUp .5s .34s ease both}
@media (max-width:520px){.card{padding:22px 18px 18px}.tiles{grid-template-columns:1fr}body{padding-bottom:92px}}

/* ---- administrator password fold ------------------------------------------------------------
   Shareholders have no password at all now — signup.php stopped issuing one — so the field is not
   part of their journey and should not sit in it. Administrators still have passwords until staff
   SSO covers everyone, so it stays reachable rather than removed: a misconfigured provider must
   not lock every administrator out of a statutory register. */
.pwfold{margin-top:16px}
.pwfold summary{cursor:pointer;list-style:none;display:flex;align-items:center;gap:7px;width:fit-content;
  font-size:12.5px;color:var(--mut)}
.pwfold summary::-webkit-details-marker{display:none}
.pwfold summary:hover{color:var(--off)}
.pwfold summary .chev{font-size:10px;color:var(--faint);transition:transform .2s}
.pwfold[open] summary .chev{transform:rotate(90deg)}
.pwfold .pw-body{animation:fadeUp .3s ease both}
/* Google alone must fill the row rather than sitting half-width in a two-column grid. */
.tiles .tile:only-child{grid-column:1/-1}

/* ── THE MAKER'S MARK STOPS FLOATING ON A PHONE ─────────────────────────────────────────────
   `.stamp` is position: fixed, so it is pinned to the viewport and rides over whatever scrolls
   beneath it. On a desktop it sits in empty space bottom-right and works. On a 375px screen the
   thing beneath it is the sign-in card, and it was sitting across the SHAREHOLDERS paragraph.

   Measured and reported by the website workstream; the operator's instruction is that it should
   sit at the bottom of the page on mobile rather than float.

   Taking it out of fixed positioning is the whole fix, and it works because of where the element
   already is: a direct child of <body> and the last visible one. Static, it simply falls where it
   stands in the document — after the card, at the end of the page.

   AFTER the rules above, deliberately. Same specificity, so source order is what decides, and a
   copy of this placed earlier in the file would be silently overridden by the .stamp rule at line
   97 while looking entirely correct. */
@media (max-width: 620px) {
  /* BODY IS A FLEX ROW, which the previous version of this rule did not account for. It reasoned
     that an unpositioned .stamp would "simply fall where it stands in the document — after the
     card, at the end of the page". That is true in normal flow. In a flex row it is a flex ITEM,
     sibling to .wrap: align-items:center put it halfway down the viewport and justify-content put
     it beside the card rather than beneath it, where it sat across the Google button. margin:auto
     never centred it either, because auto margins on a flex item absorb free space in the flex
     direction, not the cross axis.

     So the fix is on the CONTAINER. Stacking makes the stamp the last item in a column, which is
     what "after the card" was always supposed to mean. */
  body {
    flex-direction: column;
    padding-bottom: 56px;
  }
  .wrap { width: 100%; }
  .stamp {
    position: static;
    display: block;
    /* No bottom margin: the clearance below comes from body's padding, so the badge cannot end up
       flush against the bottom of the screen the way the data room's did. */
    margin: 40px auto 0;
    right: auto;
    bottom: auto;
  }
}
