/* Same look as sandeepgangarapu.com: the hugo-bearblog theme with the
       system font stack used by text.npr.org (San Francisco on Apple devices). */
    :root {
      --width: 720px;
      --font-main: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
      --font-secondary: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
      --background-color: #fff;
      --heading-color: #222;
      --text-color: #444;
      --muted-color: #6b6b6b;
      --link-color: #3273dc;
      --visited-color: #8b6fcb;
      --field-background: #fff;
      --error-color: #9a3428;
      /* Names used by the shared confirmation/unsubscribe page CSS in web.py. */
      --ink: var(--heading-color);
      --quiet: var(--muted-color);
      --warm-rule: var(--muted-color);
      --paper-warm: var(--field-background);
    }
    @media (prefers-color-scheme: dark) {
      :root {
        --background-color: #01242e;
        --heading-color: #eee;
        --text-color: #ddd;
        --muted-color: #a9bcc2;
        --link-color: #8cc2dd;
        --visited-color: #8b6fcb;
        --field-background: #00161c;
        --error-color: #ffb4a8;
      }
    }
    * { box-sizing: border-box; }
    html { -webkit-text-size-adjust: 100%; }
    body {
      font-family: var(--font-secondary);
      font-size: 1em;
      margin: auto;
      padding: 20px;
      max-width: var(--width);
      text-align: left;
      background-color: var(--background-color);
      word-wrap: break-word;
      overflow-wrap: break-word;
      line-height: 1.5;
      color: var(--text-color);
    }
    h1, h2, h3, h4, h5, h6 { font-family: var(--font-main); color: var(--heading-color); }
    a { color: var(--link-color); cursor: pointer; text-decoration: none; }
    a:hover { text-decoration: underline; }
    nav a { margin-right: 8px; }
    strong, b { color: var(--heading-color); }
    button { margin: 0; cursor: pointer; }
    button, input, textarea { font: inherit; }
    time { font-family: var(--font-secondary); font-style: normal; font-size: 15px; font-variant-numeric: tabular-nums; }
    main { line-height: 1.6; }
    hr { border: 0; border-top: 1px dashed; }
    footer { padding: 25px 0; text-align: center; }
    footer p { margin: 0.4em 0; }
    .title:hover { text-decoration: none; }
    .sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

    /* Signup: plain form, like Bear's email signup */
    .signup label { display: block; margin-bottom: 0.3em; color: var(--heading-color); font-weight: 600; }
    .signup-row { display: flex; flex-wrap: wrap; gap: 0.5em; }
    .signup input[type=email] {
      flex: 1 1 16em; min-width: 0; padding: 0.35em 0.5em;
      color: var(--text-color); background: var(--field-background);
      border: 1px solid var(--muted-color); border-radius: 3px;
    }
    .signup button, #contact-form button.primary { padding: 0.35em 0.9em; }
    .fine { margin: 0.5em 0 0; font-size: 0.9em; color: var(--muted-color); }
    .status { margin: 0.5em 0 0; }
    .status:empty { display: none; }
    body .status[data-kind="error"] { color: var(--error-color); }
    .trap { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

    /* Issue: styles the markup web.py generates for the latest brief */
    .issue { margin-top: 2.5em; }
    .issue-header h2 { margin-bottom: 0; }
    .issue-header p { margin-top: 0.2em; }
    .issue-header time { font-style: italic; }
    .page-tab, .issue-subject { display: none; }
    .issue-entry { margin-top: 1.4em; padding-top: 0.4em; border-top: 1px dashed; }
    .entry-source { margin: 0.8em 0 0; font-size: 0.9em; color: var(--muted-color); }
    .issue-entry h3 { margin: 0.15em 0 0.4em; }
    .issue-entry ul { margin: 0 0 0.6em; padding-left: 1.2em; }
    .issue-entry li { margin-bottom: 0.3em; }
    .original { font-size: 0.9em; }
    .original span { display: none; }
    .signoff { margin-top: 1.4em; padding-top: 1em; border-top: 1px dashed; font-style: italic; }

    .reading ul { padding-left: 1.2em; }

    footer .linklike { padding: 0; border: 0; background: none; color: var(--link-color); }
    footer .linklike:hover { text-decoration: underline; }

    /* Contact dialog */
    dialog {
      width: min(26em, calc(100% - 2em)); padding: 1.2em;
      border: 1px dashed var(--text-color); background: var(--background-color); color: var(--text-color);
      font-family: var(--font-secondary);
    }
    dialog::backdrop { background: rgb(0 0 0 / 0.35); }
    .dialog-top { display: flex; justify-content: space-between; align-items: baseline; }
    .dialog-top h2 { margin: 0 0 0.5em; font-size: 1.25em; }
    .close { border: 0; background: none; color: var(--link-color); }
    #contact-form label { display: block; margin: 0.8em 0 0.25em; }
    #contact-form input, #contact-form textarea {
      width: 100%; padding: 0.35em 0.5em; color: var(--text-color);
      background: var(--field-background); border: 1px solid var(--muted-color); border-radius: 3px;
    }
    #contact-form textarea { min-height: 5em; }
    #contact-form .primary { margin-top: 1em; }
    .optional { color: var(--muted-color); }

    /* Confirmation, unsubscribe and not-found pages (markup in web.py) */
    .simple-page .masthead .brand { display: block; margin: 0.83em 0; color: var(--heading-color); font-size: 1.5em; font-weight: 700; }
    .simple-page .masthead .brand strong { font-weight: 700; }
    .simple-page .masthead .brand:hover { text-decoration: none; }
    .simple-page .foot { margin-top: 2em; }
    .simple-page .footnote { font-size: 0.85em; color: var(--muted-color); }
  

.morning-doodle { margin-right: 2px; }
.trap { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.primary[disabled] { cursor: progress; opacity: .6; }
.status[data-kind="error"] { color: #9a3428; }
.status[data-kind="ok"] { color: var(--ink); font-weight: 500; }
.issue-subject { margin: 0 28px 18px 0; color: var(--quiet); font-size: 12px; }
.simple-page h1 { margin-bottom: 22px; }
.simple-page .intro > p { font-size: 16px; }
.simple-page .plain { margin: 20px 0; }
.simple-page .plain button { border: 1px solid var(--warm-rule); border-radius: 5px; background: var(--paper-warm); color: var(--ink); padding: 10px 16px; }