/* Planit skin for the older single-file tool pages.
   Loaded last in <head> together with one page file (shell/skin-<page>.css).
   Scope: body.pl-skin. Brings the pages onto the hub's navy and gold system
   (tokens as in hub.css): Playfair Display for headings, Inter for text,
   JetBrains Mono for dates and data, hairline borders, no gradients, no glass,
   no gradient text, no decorative emoji. Page content stays untouched. */
body.pl-skin {
  --pl-navy: #0a0e27; --pl-navy-2: #1a1f3a; --pl-gold: #d4af37; --pl-gold-soft: #f0d77a;
  --pl-gold-ink: oklch(0.47 0.1 85);
  --pl-paper: oklch(0.985 0.004 265); --pl-paper-2: oklch(0.962 0.007 265); --pl-line: oklch(0.89 0.009 265);
  /* field outlines need 3:1 against white (WCAG 1.4.11); --pl-line is for decorative hairlines only */
  --pl-field: oklch(0.64 0.02 265);
  --pl-ink: oklch(0.24 0.04 265); --pl-ink-2: oklch(0.42 0.03 265);
  --pl-on-navy: oklch(0.93 0.01 265); --pl-on-navy-2: oklch(0.78 0.02 265);
  --pl-ok: oklch(0.42 0.09 155); --pl-due: oklch(0.45 0.13 45); --pl-bad: oklch(0.47 0.15 27);
  --pl-serif: "Playfair Display", Georgia, "Times New Roman", serif;
  --pl-sans: Inter, system-ui, -apple-system, "Segoe UI", sans-serif;
  --pl-mono: "JetBrains Mono", ui-monospace, Consolas, monospace;
  --pl-radius: 6px;
  --pl-ease: cubic-bezier(.25, 1, .5, 1);

  background: var(--pl-paper) !important;
  background-image: none !important;
  color: var(--pl-ink);
  font-family: var(--pl-sans) !important;
  -webkit-font-smoothing: antialiased;
}
body.pl-skin h1, body.pl-skin h2, body.pl-skin h3 {
  font-family: var(--pl-serif) !important;
  letter-spacing: -0.01em;
  /* kill gradient text wherever a page used it */
  background: none !important;
  -webkit-background-clip: border-box !important;
  background-clip: border-box !important;
  -webkit-text-fill-color: currentColor !important;
  text-shadow: none !important;
}
body.pl-skin h4, body.pl-skin h5, body.pl-skin h6 { font-family: var(--pl-sans) !important; }
body.pl-skin code, body.pl-skin pre, body.pl-skin kbd, body.pl-skin time { font-family: var(--pl-mono) !important; }
body.pl-skin a { color: var(--pl-navy); text-underline-offset: 3px; }
body.pl-skin a:hover { color: var(--pl-gold-ink); }
/* the breadcrumb, the shell footer and navy bands sit on navy: links stay gold there */
body.pl-skin .lex-hubbar a, body.pl-skin .pl-foot a, body.pl-skin .pl-band a { color: var(--pl-gold); }
body.pl-skin .lex-hubbar a:hover, body.pl-skin .pl-foot a:hover, body.pl-skin .pl-band a:hover { color: var(--pl-gold-soft); }
/* focus ring as on the hub: navy on paper (gold reaches only 2:1 there), gold on navy */
body.pl-skin :focus-visible { outline: 2px solid var(--pl-navy) !important; outline-offset: 2px !important; }
body.pl-skin .lex-hubbar :focus-visible, body.pl-skin .pl-foot :focus-visible, body.pl-skin .pl-band :focus-visible { outline-color: var(--pl-gold) !important; }

/* no glass, no glow */
body.pl-skin * { backdrop-filter: none !important; -webkit-backdrop-filter: none !important; }

/* form fields */
body.pl-skin input[type="text"], body.pl-skin input[type="search"], body.pl-skin input:not([type]),
body.pl-skin select, body.pl-skin textarea {
  font-family: var(--pl-sans) !important;
  color: var(--pl-ink) !important;
  background: #fff !important;
  border: 1px solid var(--pl-field) !important;
  border-radius: var(--pl-radius) !important;
  box-shadow: none !important;
}
body.pl-skin input::placeholder, body.pl-skin textarea::placeholder { color: var(--pl-ink-2) !important; opacity: 1; }

/* shared building blocks a page file can use */
body.pl-skin .pl-band {
  background: var(--pl-navy) !important;
  background-image: none !important;
  color: var(--pl-on-navy) !important;
  border: 0 !important;
  border-bottom: 2px solid var(--pl-gold) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}
body.pl-skin .pl-band h1, body.pl-skin .pl-band h2 { color: #fff !important; }
body.pl-skin .pl-card {
  background: #fff !important;
  background-image: none !important;
  border: 1px solid var(--pl-line) !important;
  border-radius: var(--pl-radius) !important;
  box-shadow: none !important;
  color: var(--pl-ink) !important;
}
body.pl-skin .pl-btn {
  font: 500 0.875rem/1 var(--pl-sans) !important;
  min-height: 2.5rem;
  padding: 0.6rem 1rem !important;
  border-radius: 999px !important;
  border: 1px solid var(--pl-navy) !important;
  background: var(--pl-navy) !important;
  background-image: none !important;
  color: #fff !important;
  box-shadow: none !important;
  cursor: pointer;
}
body.pl-skin .pl-btn-ghost {
  font: 500 0.875rem/1 var(--pl-sans) !important;
  min-height: 2.5rem;
  padding: 0.6rem 1rem !important;
  border-radius: 999px !important;
  border: 1px solid var(--pl-line) !important;
  background: #fff !important;
  background-image: none !important;
  color: var(--pl-navy) !important;
  box-shadow: none !important;
  cursor: pointer;
}

@media (prefers-reduced-motion: reduce) {
  body.pl-skin *, body.pl-skin *::before, body.pl-skin *::after { animation: none !important; transition: none !important; }
}
@media print {
  body.pl-skin { background: #fff !important; }
}