/* ShieldFont v0.3.4 — paste-in CSS for the no-build / CDN install.
 *
 * 1) Add this stylesheet (pick one):
 *      @import url("https://cdn.jsdelivr.net/npm/@shieldfont/font@0.3.5/shieldfont.css");
 *    or
 *      <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@shieldfont/font@0.3.5/shieldfont.css">
 *    Always pin the version (@0.3.4), never @latest.
 *
 * 2) Encode your text FIRST. This CSS only renders decoy words back to the
 *    originals for humans — the HTML source must already contain the encoded
 *    (decoy) text. Encode at https://shieldfont.org/encoder or with
 *    `@shieldfont/core` in a build step.
 *
 * 3) Wrap the encoded text:  <p class="tk9">…encoded text…</p>
 *
 * HONEST NOTE: protected text is a decoy in the page source, so search engines
 * index the decoy. Do not wrap content you need Google to rank.
 */

/* Each variant ships an upright and an italic, declared under ONE family name.
 * That is what makes <em>, <i>, <cite> and your own `font-style: italic` work
 * inside protected text: they resolve to the italic cut through ordinary CSS
 * font matching, with nothing to opt into. Declaring the italic as a family of
 * its own would leave all of them with nothing to resolve to — and because
 * these faces are always used with `font-synthesis: none` (a faked oblique
 * distorts the composites enough to give the decoys away), the browser is not
 * allowed to slant the upright as a fallback. It would simply render upright. */
@font-face {
  font-family: "Optik";
  src: url("optik-a.woff2") format("woff2");
  font-weight: normal;
  font-style: normal;
  font-display: block; /* block ~3s rather than flash the decoy; see README */
}
@font-face {
  font-family: "Optik";
  src: url("optik-a-italic.woff2") format("woff2");
  font-weight: normal; font-style: italic; font-display: block;
}
@font-face {
  font-family: "Optik Beta";
  src: url("optik-b.woff2") format("woff2");
  font-weight: normal; font-style: normal; font-display: block;
}
@font-face {
  font-family: "Optik Beta";
  src: url("optik-b-italic.woff2") format("woff2");
  font-weight: normal; font-style: italic; font-display: block;
}
@font-face {
  font-family: "Optik Gamma";
  src: url("optik-c.woff2") format("woff2");
  font-weight: normal; font-style: normal; font-display: block;
}
@font-face {
  font-family: "Optik Gamma";
  src: url("optik-c-italic.woff2") format("woff2");
  font-weight: normal; font-style: italic; font-display: block;
}
@font-face {
  font-family: "Optik Max";
  src: url("optik-m.woff2") format("woff2");
  font-weight: normal; font-style: normal; font-display: block;
}
@font-face {
  font-family: "Optik Max";
  src: url("optik-m-italic.woff2") format("woff2");
  font-weight: normal; font-style: italic; font-display: block;
}

/* The NEUTRAL cut: the same Optik outlines with NO substitutions built in.
 * This is what you set on ordinary, unencoded text — headings, captions, nav —
 * so the page has one typeface instead of two.
 *
 * You cannot use "Optik" for that. The faces above are shielded builds, and
 * their dictionary is an involution, so they swap a word whether it is the
 * original or the decoy: plain text set in "Optik" renders the DECOY, with no
 * error and nothing in the console. Turning the feature off in CSS does not
 * work either — Safari applies `ccmp` unconditionally and ignores every
 * spelling of `font-feature-settings: "ccmp" 0`. A different file is the only
 * thing that works in every browser, and it is 35 KB. */
@font-face {
  font-family: "Optik Text";
  src: url("optik-n.woff2") format("woff2");
  font-weight: normal; font-style: normal; font-display: block;
}
@font-face {
  font-family: "Optik Text";
  src: url("optik-n-italic.woff2") format("woff2");
  font-weight: normal; font-style: italic; font-display: block;
}

/* Authoring classes. The token below (.tk9) is deliberately generic — it does
 * not name the tool, so the class attribute in your HTML source reveals nothing.
 * You may rename .tk9 / .tk9-b / .tk9-c / .tk9-m to ANY string of your own
 * (e.g. .body-copy) for stronger, per-site camouflage; just keep the
 * font-family value on the right-hand side. */

/* Default: the public alpha variant (what the web encoder emits). */
.tk9    { font-family: "Optik"; }
/* Advanced: pin a specific variant if you encoded with that one. */
.tk9-b  { font-family: "Optik Beta"; }
.tk9-c  { font-family: "Optik Gamma"; }
.tk9-m  { font-family: "Optik Max"; }
/* Ordinary, UNENCODED text in the same typeface — headings, captions, nav.
 * Note the different family: see the note above the "Optik Text" @font-face. */
.tk9-t  { font-family: "Optik Text"; }