/* Coriolis Precision — the global site nav, lifted verbatim out of the pages that inline it.

   The five original pages (index, privacy, signup, you-said-we-did, 404) still carry their own
   copy in a <style id="cpnav-css"> block; this file exists so the contribute pages can wear the
   SAME nav without a sixth hand-maintained duplicate. When those five are next touched, they can
   drop their inline block for a <link> to this and the duplication ends.

   Depends on the page defining --mono, --teal, --parch, --amber, --line and --panel2. */

.cpnav{position:fixed;top:0;left:0;right:0;z-index:1000;height:56px;display:flex;align-items:center;gap:12px;
  padding:0 clamp(14px,4vw,28px);background:rgba(16,13,8,.82);-webkit-backdrop-filter:blur(9px);backdrop-filter:blur(9px);
  border-bottom:1px solid rgba(58,51,35,.7)}
.cpnav *{box-sizing:border-box}
.cpnav-drawer[hidden],.cpnav-ios[hidden]{display:none !important}
.cpnav-burger{-webkit-appearance:none;appearance:none;background:none;border:0;cursor:pointer;width:36px;height:36px;
  display:flex;flex-direction:column;justify-content:center;gap:5px;padding:7px;flex:0 0 auto;-webkit-tap-highlight-color:transparent}
.cpnav-burger span{display:block;height:2px;width:100%;background:#F2EDD8;border-radius:2px;transition:transform .2s,opacity .2s}
.cpnav.open .cpnav-burger span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.cpnav.open .cpnav-burger span:nth-child(2){opacity:0}
.cpnav.open .cpnav-burger span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
.cpnav-brand{display:flex;align-items:center;margin-right:auto;line-height:0}
.cpnav-brand img{height:23px;width:auto;display:block}
.cpnav-cta{font-family:var(--mono);font-size:13px;font-weight:700;letter-spacing:.02em;
  color:#0b1413;background:var(--teal);padding:9px 15px;border-radius:20px;white-space:nowrap;text-decoration:none;flex:0 0 auto}
.cpnav-cta.ios{background:var(--panel2);color:var(--amber);border:1px solid #5a5140}
.cpnav-drawer{position:fixed;top:56px;left:0;right:0;z-index:999;background:rgba(14,11,6,.985);
  -webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:1px solid var(--line);
  display:flex;flex-direction:column;padding:6px clamp(14px,4vw,28px) 14px;max-height:calc(100vh - 56px);overflow:auto}
.cpnav-drawer a{font-family:var(--mono);font-size:16px;color:var(--parch);text-decoration:none;
  padding:14px 2px;border-bottom:1px solid #241f13}
.cpnav-drawer a:last-child{border-bottom:0}
.cpnav-drawer a:hover,.cpnav-drawer a:active{color:var(--teal)}
.cpnav-ios{position:fixed;top:56px;left:0;right:0;z-index:998;display:flex;align-items:center;justify-content:center;
  gap:12px;flex-wrap:wrap;background:var(--panel2);border-bottom:1px solid var(--line);
  font-family:var(--mono);font-size:13px;color:#E8DCC0;padding:10px 42px 10px 16px}
.cpnav-ios b{color:#fff}
.cpnav-ios a{color:var(--teal);text-decoration:none;font-weight:700}
.cpnav-ios-x{position:absolute;right:10px;top:50%;transform:translateY(-50%);background:none;border:0;color:#E8DCC0;
  font-size:20px;line-height:1;cursor:pointer;padding:4px 8px}
@media(min-width:721px){
  .cpnav-drawer{left:clamp(14px,4vw,28px);right:auto;width:280px;border:1px solid var(--line);border-top:0;border-radius:0 0 12px 12px}
}

/* ── contributor token ────────────────────────────────────────────────────────────
   The way in to uploading and to your own points tally, on every page. An image rather than
   another text button because the bar already carries one call to action and a second competing
   with it would weaken both — and because a round token reads as "you" without needing a word.
   Deliberately NOT data-cta: that attribute is rewritten to "iOS — Android only" on iPhones, and
   contributing works perfectly well from an iPhone browser. */
.cpnav-token{display:flex;align-items:center;gap:8px;flex:0 0 auto;text-decoration:none;
  padding:4px 4px 4px 4px;border-radius:20px;border:1px solid rgba(58,51,35,.9);
  background:rgba(242,237,216,.06)}
.cpnav-token:hover{background:rgba(242,237,216,.14)}
.cpnav-token-mark{height:30px;width:30px;border-radius:50%;display:block;flex:0 0 auto;
  background:#1C1A14 url('/apple-touch-icon.png') center/cover no-repeat}
.cpnav-token span{font-family:var(--mono);font-size:12px;font-weight:700;letter-spacing:.08em;
  text-transform:uppercase;color:var(--amber);padding-right:8px}
/* Below the CTA's comfort width the label goes and the token stays — the icon is the affordance. */
@media(max-width:520px){ .cpnav-token span{display:none} .cpnav-token{padding:4px} }