/*
  Late-90s theme, toggled by the header switch (layout.js sets
  data-theme="y2k" on <html> from localStorage). Everything is scoped under
  that attribute, so with the toggle off this file does nothing.

  The reference is a well-made 1999 homepage: Verdana body and Georgia
  headings (the screen fonts of the era), black on white, blue underlined
  links with purple visited links, a fixed 760px page sized for an 800x600
  monitor, 1px rules, and grey beveled buttons. No other color. No Comic
  Sans, ever.
*/

:root[data-theme="y2k"] {
  --bg: #ffffff;
  --surface: #ffffff;
  --ink: #000000;
  --ink-2: #000000;
  --ink-3: #555555;
  --rule: #999999;
  --rule-strong: #999999;
  --ring: transparent;
  --accent: #0000ee;
  --focus: #0000ee;

  --font-serif: Georgia, "Times New Roman", Times, serif;
  --font-sans: Verdana, Geneva, Tahoma, sans-serif;

  --radius-m: 0;
  --radius-l: 0;
  --max: 760px;
  --gutter: 16px;
  --section-y: 28px;
}

[data-theme="y2k"] body {
  font-size: 13px;
  line-height: 1.5;
  -webkit-font-smoothing: auto;
}

@media (max-width: 700px) {
  [data-theme="y2k"] body {
    font-size: 15px;
  }
}

[data-theme="y2k"] ::selection {
  background: #000080;
  color: #ffffff;
}

[data-theme="y2k"] h1,
[data-theme="y2k"] h2,
[data-theme="y2k"] h3 {
  font-weight: 700;
  letter-spacing: normal;
  line-height: 1.25;
}

[data-theme="y2k"] a {
  color: #0000ee;
  text-decoration: underline;
}

[data-theme="y2k"] a:visited {
  color: #551a8b;
}

[data-theme="y2k"] :focus-visible {
  outline: 1px dotted #000;
  outline-offset: 1px;
  border-radius: 0;
}

/* Anything that was sticky in the modern layout just scrolls here. */
[data-theme="y2k"] .letter-head,
[data-theme="y2k"] .section-head,
[data-theme="y2k"] .toc {
  position: static;
}

/* ---------- header / footer ---------- */

[data-theme="y2k"] .site-header {
  border-bottom: 1px solid #000;
}

[data-theme="y2k"] .site-header-inner {
  padding-block: 12px 10px;
  gap: 6px 16px;
}

[data-theme="y2k"] .wordmark,
[data-theme="y2k"] .wordmark:visited {
  font-family: var(--font-serif);
  font-size: 22px;
  font-weight: 700;
  color: #000;
  text-decoration: none;
}

[data-theme="y2k"] .site-nav {
  gap: 0;
}

[data-theme="y2k"] .site-nav a {
  padding: 0;
  border: 0;
  font-size: 12px;
}

[data-theme="y2k"] .site-nav a + a::before,
[data-theme="y2k"] .footer-nav a + a::before {
  content: "|";
  display: inline-block;
  margin: 0 8px;
  color: #999;
  text-decoration: none;
}

[data-theme="y2k"] .site-nav a[aria-current="page"] {
  color: #000;
  font-weight: 700;
  text-decoration: none;
}

[data-theme="y2k"] .theme-toggle {
  gap: 5px;
  padding: 0;
  border: 0;
  font-size: 11px;
  color: #000;
}

[data-theme="y2k"] .theme-toggle-track {
  width: 13px;
  height: 13px;
  border-radius: 0;
  border: 1px solid #000;
  background: #fff;
}

[data-theme="y2k"] .theme-toggle-thumb {
  display: none;
  top: 2px;
  left: 2px;
  width: 7px;
  height: 7px;
  border-radius: 0;
  background: #000;
  transform: none;
}

[data-theme="y2k"] .theme-toggle[aria-pressed="true"] .theme-toggle-track {
  background: #fff;
}

[data-theme="y2k"] .theme-toggle[aria-pressed="true"] .theme-toggle-thumb {
  display: block;
  transform: none;
}

[data-theme="y2k"] .site-footer {
  border-top: 1px solid #000;
  font-size: 11px;
  color: #555;
}

[data-theme="y2k"] .site-footer-inner {
  padding-block: 12px 24px;
}

[data-theme="y2k"] .footer-nav {
  gap: 0;
}

/* ---------- home ---------- */

[data-theme="y2k"] .letter {
  padding-block: 24px;
}

[data-theme="y2k"] .letter-grid {
  display: block;
}

[data-theme="y2k"] .letter-kicker {
  margin-bottom: 4px;
  font-size: 11px;
  color: #555;
}

[data-theme="y2k"] .letter-head h1 {
  margin-bottom: 16px;
  font-size: 26px;
  line-height: 1.2;
  letter-spacing: normal;
}

[data-theme="y2k"] .letter-body {
  max-width: none;
  font-family: var(--font-sans);
  font-size: inherit;
  line-height: 1.5;
}

[data-theme="y2k"] .signature {
  margin-top: 16px;
  padding-top: 8px;
  border-top: 1px solid #999;
  font-size: 12px;
}

[data-theme="y2k"] .signature-links a {
  color: #0000ee;
  text-decoration-color: currentColor;
}

[data-theme="y2k"] .shelf {
  padding-block: 0 28px;
  background: #fff;
}

[data-theme="y2k"] .shelf .wrap {
  padding-top: 20px;
  border-top: 1px solid #000;
}

[data-theme="y2k"] .shelf-heading {
  margin-bottom: 12px;
  font-size: 18px;
  letter-spacing: normal;
}

[data-theme="y2k"] .shelf-grid {
  grid-template-columns: repeat(auto-fill, minmax(min(230px, 100%), 1fr));
  gap: 8px;
}

[data-theme="y2k"] .app-tile,
[data-theme="y2k"] .app-tile:visited {
  padding: 10px;
  border: 1px solid #999;
  background: #fff;
  box-shadow: none;
  color: #000;
  text-decoration: none;
  transition: none;
}

[data-theme="y2k"] .app-tile:hover {
  background: #eeeeee;
  box-shadow: none;
}

[data-theme="y2k"] .app-tile-icon {
  width: 48px;
  height: 48px;
  margin-bottom: 8px;
  border-radius: 0;
  box-shadow: none;
}

[data-theme="y2k"] .app-tile-name {
  font-family: var(--font-sans);
  font-size: 13px;
  font-weight: 700;
  color: #0000ee;
  text-decoration: underline;
}

[data-theme="y2k"] .app-tile-tagline {
  margin-top: 2px;
  font-size: 12px;
  color: #000;
}

[data-theme="y2k"] .app-tile-platform {
  padding-top: 8px;
  font-size: 11px;
  color: #555;
}

/* ---------- app page ---------- */

[data-theme="y2k"] .app-hero {
  padding-block: 24px;
  background: #fff;
}

[data-theme="y2k"] .app-hero-grid {
  gap: 24px;
  align-items: start;
}

@media (min-width: 900px) {
  [data-theme="y2k"] .app-hero-grid.has-shot {
    gap: 24px;
  }
}

[data-theme="y2k"] .app-id {
  gap: 10px;
  margin-bottom: 12px;
}

[data-theme="y2k"] .app-id-icon {
  width: 48px;
  height: 48px;
  border-radius: 0;
  box-shadow: none;
}

[data-theme="y2k"] .app-id-name {
  font-family: var(--font-sans);
  font-size: 13px;
  font-weight: 700;
}

[data-theme="y2k"] .app-id-platform {
  font-size: 11px;
}

[data-theme="y2k"] .app-hero h1 {
  max-width: none;
  font-size: 26px;
  line-height: 1.2;
  letter-spacing: normal;
}

[data-theme="y2k"] .app-hero-desc {
  max-width: none;
  margin-top: 8px;
  font-size: inherit;
  line-height: 1.5;
}

[data-theme="y2k"] .app-facts {
  display: block;
  margin-top: 10px;
  padding-left: 20px;
  list-style: square;
}

[data-theme="y2k"] .app-facts li {
  display: list-item;
  padding: 0;
  border-radius: 0;
  background: none;
  box-shadow: none;
  font-size: inherit;
}

[data-theme="y2k"] .app-facts li::before {
  content: none;
}

[data-theme="y2k"] .cta-row {
  gap: 8px;
  margin-top: 16px;
}

[data-theme="y2k"] .btn,
[data-theme="y2k"] .btn:visited {
  min-height: 0;
  padding: 3px 12px;
  border: 2px outset #dddddd;
  border-radius: 0;
  background: #dddddd;
  font-family: var(--font-sans);
  font-size: 12px;
  font-weight: 400;
  color: #000;
  text-decoration: none;
  transition: none;
}

[data-theme="y2k"] .btn:hover {
  background: #dddddd;
  border-color: #dddddd;
}

[data-theme="y2k"] .btn:active {
  border-style: inset;
}

[data-theme="y2k"] .btn[aria-disabled="true"] {
  opacity: 1;
  color: #808080;
  text-shadow: 1px 1px 0 #fff;
}

[data-theme="y2k"] .cta-note {
  margin-top: 6px;
  font-size: 11px;
  color: #555;
}

[data-theme="y2k"] .cta-note + .cta-beta {
  margin-top: 2px;
}

[data-theme="y2k"] .app-hero-shot {
  width: 180px;
  justify-self: start;
}

[data-theme="y2k"] .app-hero-shot img,
[data-theme="y2k"] .gallery-item img {
  border-radius: 0;
  border: 1px solid #000;
  box-shadow: none;
}

[data-theme="y2k"] .app-hero-shot figcaption,
[data-theme="y2k"] .gallery-item figcaption {
  margin-top: 4px;
  font-size: 11px;
  color: #000;
  text-align: left;
}

[data-theme="y2k"] .section {
  padding-block: 20px;
  border-top: 1px solid #000;
}

[data-theme="y2k"] .app-hero + .section {
  border-top: 1px solid #000;
}

[data-theme="y2k"] .section-grid {
  display: block;
}

[data-theme="y2k"] .section-kicker {
  margin-bottom: 2px;
  font-size: 11px;
  color: #555;
}

[data-theme="y2k"] .section-title {
  margin-bottom: 12px;
  font-size: 18px;
  letter-spacing: normal;
}

[data-theme="y2k"] .section-intro {
  font-size: inherit;
  color: #000;
}

[data-theme="y2k"] .feature-grid {
  grid-template-columns: repeat(auto-fill, minmax(min(220px, 100%), 1fr));
  gap: 12px 20px;
}

[data-theme="y2k"] .feature {
  padding-top: 0;
  border-top: 0;
}

[data-theme="y2k"] .feature-desc {
  margin-top: 0;
  font-size: inherit;
  color: #000;
}

[data-theme="y2k"] .spotlight-grid {
  margin-top: 12px;
  gap: 8px;
}

[data-theme="y2k"] .spotlight-card {
  padding: 8px 10px;
  border: 1px solid #999;
  background: #fff;
}

[data-theme="y2k"] .spotlight-card-title {
  font-size: 14px;
}

[data-theme="y2k"] .spotlight-card-tag {
  font-size: 11px;
}

[data-theme="y2k"] .spotlight-card-desc,
[data-theme="y2k"] .spotlight-note {
  margin-top: 4px;
  font-size: 12px;
  color: #000;
}

[data-theme="y2k"] .gallery-scroller {
  margin-top: 0;
  scrollbar-color: auto;
}

[data-theme="y2k"] .gallery-track {
  gap: 12px;
  padding-bottom: 8px;
}

[data-theme="y2k"] .gallery-item {
  width: 150px;
}

[data-theme="y2k"] .note-block {
  max-width: none;
}

[data-theme="y2k"] .note-block + .note-block {
  margin-top: 16px;
}

[data-theme="y2k"] .note-block h3 {
  font-size: 14px;
}

[data-theme="y2k"] .note-block p {
  margin-top: 6px;
  color: #000;
}

[data-theme="y2k"] .paid-copy {
  max-width: none;
  font-family: var(--font-sans);
  font-size: inherit;
  line-height: 1.5;
}

[data-theme="y2k"] .honesty-note {
  max-width: none;
  margin-top: 12px;
  padding: 8px 10px;
  border: 1px solid #000;
  background: #fff;
  font-size: 12px;
  color: #000;
}

[data-theme="y2k"] .section-body > .back-link {
  margin-top: 16px;
}

[data-theme="y2k"] .back-link {
  font-size: 12px;
}

/* ---------- privacy / support ---------- */

[data-theme="y2k"] .page-head {
  padding-block: 24px 16px;
  border-bottom: 1px solid #000;
}

[data-theme="y2k"] .page-head h1 {
  font-size: 26px;
  letter-spacing: normal;
}

[data-theme="y2k"] .page-meta {
  margin-top: 2px;
  font-size: 11px;
}

[data-theme="y2k"] .page-lede {
  max-width: none;
  margin-top: 10px;
  font-family: var(--font-sans);
  font-size: inherit;
  line-height: 1.5;
  color: #000;
}

[data-theme="y2k"] .page-layout {
  gap: 20px;
  padding-block: 20px 28px;
}

@media (min-width: 1024px) {
  [data-theme="y2k"] .page-layout {
    grid-template-columns: 150px minmax(0, 1fr);
    gap: 20px;
  }
}

[data-theme="y2k"] .toc {
  padding: 6px 8px;
  border: 1px solid #999;
  max-height: none;
}

[data-theme="y2k"] .toc a {
  padding-block: 1px;
  font-size: 11px;
  color: #0000ee;
  text-decoration: underline;
}

[data-theme="y2k"] .toc .toc-sub {
  margin: 0 0 4px;
  border-left: 0;
}

[data-theme="y2k"] .toc-sub a {
  padding-left: 10px;
}

[data-theme="y2k"] .page-content {
  max-width: none;
}

[data-theme="y2k"] .page-content > h2 {
  margin: 24px 0 8px;
  font-size: 18px;
  letter-spacing: normal;
}

[data-theme="y2k"] .page-content > h2:first-child {
  margin-top: 0;
}

[data-theme="y2k"] .page-content > p,
[data-theme="y2k"] .commitments p,
[data-theme="y2k"] .capability p + p,
[data-theme="y2k"] .faq-answer {
  color: #000;
}

[data-theme="y2k"] .commitments li {
  padding-block: 6px;
  border-top: 0;
}

[data-theme="y2k"] .commitments h3 {
  font-size: inherit;
}

[data-theme="y2k"] .commitments p {
  margin-top: 0;
}

[data-theme="y2k"] .addendum {
  margin-top: 12px;
  padding: 8px 10px 2px;
  border: 1px solid #999;
  background: #fff;
}

[data-theme="y2k"] .addendum-head {
  gap: 8px;
  margin-bottom: 4px;
}

[data-theme="y2k"] .addendum-head img,
[data-theme="y2k"] .faq-group-head img {
  width: 24px;
  height: 24px;
  border-radius: 0;
  box-shadow: none;
}

[data-theme="y2k"] .addendum-head h3,
[data-theme="y2k"] .faq-group-head h3 {
  font-size: 14px;
}

[data-theme="y2k"] .addendum-head a {
  color: #0000ee;
  text-decoration: underline;
}

[data-theme="y2k"] .capability {
  padding-block: 6px;
  border-top: 1px dotted #999;
}

[data-theme="y2k"] .capability-label {
  font-size: inherit;
}

[data-theme="y2k"] .capability p + p {
  margin-top: 0;
  font-size: inherit;
}

[data-theme="y2k"] .faq-list {
  border-bottom: 0;
}

[data-theme="y2k"] .faq {
  border-top: 0;
}

[data-theme="y2k"] .faq summary {
  justify-content: flex-start;
  gap: 6px;
  padding-block: 3px;
  font-weight: 400;
  color: #0000ee;
  text-decoration: underline;
}

[data-theme="y2k"] .faq summary::after {
  content: none;
}

[data-theme="y2k"] .faq summary::before {
  content: "+";
  display: inline-block;
  width: 10px;
  font-family: "Courier New", Courier, monospace;
  font-weight: 700;
  color: #000;
  text-decoration: none;
}

[data-theme="y2k"] .faq[open] summary::before {
  content: "\2212";
}

[data-theme="y2k"] .faq-answer {
  max-width: none;
  padding: 0 0 8px 16px;
}

[data-theme="y2k"] .faq-group {
  margin-top: 20px;
}

[data-theme="y2k"] .faq-group-head {
  gap: 6px;
  margin-bottom: 4px;
}

[data-theme="y2k"] .faq-group-head a {
  color: #0000ee;
  text-decoration: underline;
}

[data-theme="y2k"] .contact {
  margin-top: 24px;
  padding: 10px 12px;
  border: 1px solid #000;
  background: #fff;
  color: #000;
}

[data-theme="y2k"] .contact p {
  color: #000;
}

[data-theme="y2k"] .contact-email,
[data-theme="y2k"] .contact-email:visited {
  margin-top: 4px;
  font-family: var(--font-sans);
  font-size: 14px;
  font-weight: 700;
  color: #0000ee;
}

/* ---------- 404 ---------- */

[data-theme="y2k"] .error-page {
  padding-block: 32px;
}

[data-theme="y2k"] .error-page h1 {
  font-size: 26px;
  letter-spacing: normal;
}

[data-theme="y2k"] .error-text {
  margin: 8px 0 16px;
  font-family: var(--font-sans);
  font-size: inherit;
  color: #000;
}