:root { --bg: #f4f5f3; --panel: #ffffff; --panel-2: #eef1ee; --ink: #191d20; --ink-2: #4c555c; --line: #d8ddd8; --accent: #177245; --accent-soft: #e3f2e8; --link: #1a56c4; --code-bg: #ecefec; }
body { margin: 0; background: var(--bg); color: var(--ink); font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif; line-height: 1.55; }
a { color: var(--link); }
.article { padding: 30px 30px 36px; font-family: Georgia, "Iowan Old Style", "Times New Roman", serif; font-size: 17px; max-width: 800px; margin: 0 auto; text-align: center; }
      .article .site-logo { display: block; margin: 2px auto 18px; width: 220px; }
      .article .site-logo picture, .article .site-logo img { display: block; width: 100%; height: auto; }
      .article .site-nav {
        font-family: ui-monospace, Menlo, monospace; font-size: 13px; color: var(--ink-2);
        display: flex; gap: 16px; flex-wrap: wrap; justify-content: center; padding-bottom: 14px; border-bottom: 1px solid var(--line); margin-bottom: 24px;
      }
      .article .site-nav a { color: var(--ink-2); text-decoration: none; }
      .article .site-nav a.here { color: var(--accent); }
      .article h1 { font-size: clamp(27px, 4.5vw, 36px); line-height: 1.15; margin: 0 0 6px; letter-spacing: -.01em; }
      .article .byline { font-family: ui-monospace, Menlo, monospace; font-size: 13px; color: var(--ink-2); margin: 0 auto 20px; max-width: 100%; overflow-wrap: break-word; }
      .article p { margin: 0 auto 16px; max-width: 68ch; }
      .article h2 { font-size: 21px; margin: 30px 0 10px; letter-spacing: -.01em; }
      .article ul { display: inline-block; text-align: left; margin: 0 auto 16px; padding-left: 22px; max-width: 68ch; }
      .article li { margin-bottom: 6px; }
      .article code { font-size: 14.5px; background: var(--code-bg); padding: 1px 5px; border-radius: 4px; }
      .article .cols { display: grid; grid-template-columns: 1fr 300px; gap: 34px; align-items: start; }
      .facts {
        font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;
        border: 1px solid var(--line); border-radius: 10px; overflow: hidden; font-size: 14px;
      }
      .facts h3 {
        margin: 0; padding: 10px 14px; background: var(--panel-2); font-size: 12px;
        letter-spacing: .1em; text-transform: uppercase; color: var(--ink-2);
        font-family: ui-monospace, Menlo, monospace; font-weight: 600;
      }
      .facts table { width: 100%; border-collapse: collapse; }
      .facts td { padding: 8px 14px; border-top: 1px solid var(--line); vertical-align: top; }
      .facts td.k { color: var(--ink-2); width: 42%; font-size: 13px; }
      .facts td.v { font-family: ui-monospace, Menlo, monospace; font-size: 13px; word-break: break-all; }
      .article .outlinks { font-size: 15.5px; }

      .article h3 { font-size: 18px; margin: 22px 0 8px; letter-spacing: -.01em; }
      .article table { border-collapse: collapse; width: 100%; max-width: 68ch; margin: 0 auto; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif; font-size: 15px; }
      .article th, .article td { text-align: left; padding: 6px 12px 6px 0; border-bottom: 1px solid var(--line); vertical-align: top; }
      .article th { color: var(--ink-2); font-weight: 600; white-space: nowrap; }
      .article footer { margin-top: 40px; margin-left: auto; margin-right: auto; padding-top: 18px; border-top: 1px solid var(--line); color: var(--ink-2); font-size: 13.5px; }

@media (max-width: 760px) { .article { padding: 22px 18px 28px; } .article .cols { grid-template-columns: 1fr; } }
