/* tethery.app's cookie banner (public/js/consent.js). One sheet for the home page and the rest of the
   site, so it reads each page's own tokens (home.css or site.css) and falls back to the site's values
   where a page has none. The site's pane (download.css .dl-pane): square, a dark fill, a hairline, Payload's
   diagonal lines at half strength and the viewfinder's corners, held here because home.css is not on every
   page (the owner, 2026-11-03). A small pane in the corner on a wide window, and the width of the window less
   its gutters on a phone. Reject and Accept are one style, side by side, the same size:
   neither is the default. It rises in a short ease-out unless the page is still (motion.js). */
.consent {
  position: fixed; z-index: 1000;
  left: max(16px, env(safe-area-inset-left)); right: max(16px, env(safe-area-inset-right)); bottom: max(16px, env(safe-area-inset-bottom));
  max-width: 400px; padding: 18px 18px 16px;
  border: 1px solid rgba(255, 255, 255, 0.09);
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='5' height='5'%3E%3Cpath d='M4 0h1v1H4zM3 1h1v1H3zM2 2h1v1H2zM1 3h1v1H1zM0 4h1v1H0z' fill='%23fff' fill-opacity='.035'/%3E%3C/svg%3E"),
    linear-gradient(180deg, rgba(255, 255, 255, 0.045), rgba(255, 255, 255, 0.012)), rgba(10, 10, 12, 0.9);
  backdrop-filter: blur(18px) saturate(140%); -webkit-backdrop-filter: blur(18px) saturate(140%);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08), 0 30px 60px -30px rgba(0, 0, 0, 0.9);
  color: var(--ink, #EDEFF2);
  font: 400 14px/1.55 var(--sans, "IBM Plex Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif);
  -webkit-font-smoothing: antialiased;
  opacity: 0; transform: translateY(14px);
  transition: opacity 260ms var(--ease-out, cubic-bezier(0.23, 1, 0.32, 1)), transform 260ms var(--ease-out, cubic-bezier(0.23, 1, 0.32, 1));
}
.consent::after { content: ""; position: absolute; inset: -1px; pointer-events: none; background-repeat: no-repeat;
  --b: linear-gradient(rgba(255, 255, 255, 0.62), rgba(255, 255, 255, 0.62));
  background-image: var(--b), var(--b), var(--b), var(--b), var(--b), var(--b), var(--b), var(--b);
  background-size: 12px 1px, 1px 12px, 12px 1px, 1px 12px, 12px 1px, 1px 12px, 12px 1px, 1px 12px;
  background-position: 0 0, 0 0, 100% 0, 100% 0, 0 100%, 0 100%, 100% 100%, 100% 100%; }
@media (prefers-reduced-transparency: reduce) { .consent { -webkit-backdrop-filter: none; backdrop-filter: none; background-color: #0E0E10; } }
.consent.is-in { opacity: 1; transform: none; }
html[data-motion="still"] .consent { transition: none; transform: none; }
@media (prefers-reduced-motion: reduce) { html:not([data-motion]) .consent { transition: none; transform: none; } }
@media (min-width: 640px) {
  .consent { right: auto; left: max(24px, env(safe-area-inset-left)); bottom: max(24px, env(safe-area-inset-bottom)); }
}

.consent p { margin: 0; padding: 0; }
.consent__title {
  display: flex; align-items: center; gap: 8px; margin-bottom: 8px !important;
  font: 500 11.5px/1 var(--mono, "IBM Plex Mono", ui-monospace, Menlo, monospace);
  letter-spacing: 0.12em; text-transform: uppercase; color: var(--muted, #8A93A0);
}
.consent__title::before {
  content: ""; flex: none; width: 7px; height: 7px; border-radius: 50%;
  background: var(--tally, #FF4D3D); box-shadow: 0 0 10px var(--tally, #FF4D3D);
}
.consent__text { margin-bottom: 14px !important; color: var(--ink-2, #C3C8D0); }
.consent__text a { color: var(--ink, #EDEFF2); text-decoration: underline; text-decoration-color: rgba(255, 77, 61, 0.7); text-underline-offset: 3px; white-space: nowrap; }
.consent__text a:hover { color: #fff; text-decoration-color: var(--tally, #FF4D3D); }

.consent__buttons { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.consent__button {
  min-height: 44px; padding: 0 16px; border-radius: 10px;
  border: 1px solid rgba(255, 255, 255, 0.18); background: rgba(255, 255, 255, 0.06);
  color: #fff; font: 500 15px/1 var(--sans, "IBM Plex Sans", -apple-system, BlinkMacSystemFont, sans-serif);
  cursor: pointer; -webkit-tap-highlight-color: transparent;
  transition: background-color 160ms, border-color 160ms, transform 90ms ease-out;
}
.consent__button:hover { background: rgba(255, 255, 255, 0.12); border-color: rgba(255, 255, 255, 0.3); }
.consent__button:active { transform: scale(0.97); }
.consent__button:focus-visible { outline: 2px solid var(--tally, #FF4D3D); outline-offset: 2px; }
/* Reopened from Your privacy choices: the choice that stands is marked, in the accent, on either button. */
.consent__button[aria-pressed="true"] { border-color: var(--tally, #FF4D3D); }
html[data-motion="still"] .consent__button { transition: none; }
