/* Match the narrow title's footprint while Amatic SC downloads. */
@font-face {
  font-family: "Scorp Title Fallback";
  src: local("Arial Bold"), local("Arial-BoldMT"), local("Helvetica-Bold"), local("Liberation Sans Bold"), local("Noto Sans Bold"), local("Roboto Bold"), local("Droid Sans Bold");
  font-weight: 700;
  size-adjust: 58%;
}
/* The default palette preserves the original light layout. */
:root {
  color-scheme: light;
  --surface: #fff;
  --raised: #f5f5f5;
  --text: #555;
  --heading: #34495e;
  --muted: #777;
  --line: #eee;
  --input-border: #ccc;
  --link: #800020;
  --link-hover: #590016;
  --button: #34495e;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme]) {
    color-scheme: dark;
    --surface: #202124;
    --raised: #292b2f;
    --text: #d4d4d7;
    --heading: #e2e5eb;
    --muted: #aaaab2;
    --line: #3c3e43;
    --input-border: #62646c;
    --link: #e6a3b4;
    --link-hover: #f5c8d3;
    --button: #48586c;
  }
}
:root[data-theme="dark"] {
    color-scheme: dark;
    --surface: #202124;
    --raised: #292b2f;
    --text: #d4d4d7;
    --heading: #e2e5eb;
    --muted: #aaaab2;
    --line: #3c3e43;
    --input-border: #62646c;
    --link: #e6a3b4;
    --link-hover: #f5c8d3;
    --button: #48586c;
  }
*{box-sizing:border-box}body{margin:0;background:var(--surface);color:var(--text);font:16px/1.625 Roboto,"Helvetica Neue",Arial,sans-serif}a{color:var(--link);text-decoration:none}a:hover{text-decoration:underline}a:focus-visible{outline-color:var(--link)}.brand>a:hover,.entry-title a:hover{text-decoration:none}a:focus-visible,button:focus-visible,input:focus-visible,summary:focus-visible{outline:3px solid #3699dc;outline-offset:4px}.site{display:grid;grid-template-columns:300px minmax(0,900px);max-width:1200px;min-height:100vh;margin:auto;border-left:1px solid var(--line);border-right:1px solid var(--line)}.sidebar{background:#333;color:#ccc;min-width:0}.sidebar a{color:#fff}.brand{text-align:center;border-bottom:1px solid #4a4a4a;padding:30px 20px 25px}.brand>a{display:block;font:700 50px/1 "Amatic SC","Scorp Title Fallback","Arial Narrow",sans-serif;white-space:nowrap}.brand p{font:12px/20px "Roboto Condensed",Arial,sans-serif;text-transform:uppercase;margin:18px 0 0;color:#bbb}.sidebar-menu>summary{display:none;cursor:pointer;padding:14px 25px;min-height:48px;color:#fff}.sidebar nav a{display:block;border-bottom:1px solid #4a4a4a;padding:12px 25px;font-size:12px;text-transform:uppercase;min-height:44px}.widget{padding:25px;border-bottom:1px solid #4a4a4a;font-size:14px}.widget h2{font:12px/20px "Roboto Condensed",Arial,sans-serif;text-transform:uppercase;color:#bbb;margin:0 0 10px}.widget ul{margin:0;padding-left:16px}.widget li{padding:2px 0}.widget form{display:flex;flex-wrap:wrap;gap:8px}input{min-width:0;width:100%;padding:10px 12px;font:inherit;background:var(--surface);color:var(--text);border:1px solid var(--input-border);border-radius:3px}button{font:inherit;color:#fff;background:var(--button);border:0;border-radius:3px;padding:10px 16px;cursor:pointer;min-height:44px}.widget button{width:100%;font-size:13px}.primary{display:flex;flex-direction:column;min-width:0;background:var(--surface)}main{flex:1;min-width:0}.article{padding:60px 90px;border-bottom:1px solid var(--line);min-width:0}.entry-title{font:400 38px/1.3 "Roboto Slab",Georgia,serif;color:var(--heading);text-align:center;margin:0 0 12px;overflow-wrap:anywhere}.entry-title a{color:inherit}.entry-meta{text-align:center;font:12px/1.8 "Roboto Condensed",Arial,sans-serif;letter-spacing:1px;text-transform:uppercase;color:var(--muted);margin:0}.entry-meta span{margin-left:12px}.prose{padding-top:30px;overflow-wrap:anywhere}.prose p{margin:0 0 22px}.prose pre{max-width:100%;overflow:auto;font:13px/1.6 monospace;background:var(--raised);border:1px solid var(--line);padding:18px;white-space:pre}.prose img{max-width:100%;height:auto}.prose table{display:block;overflow:auto}.comments{border-top:1px solid var(--line);margin-top:40px;padding-top:25px}.comments h2{font:26px "Roboto Slab",Georgia,serif;color:var(--heading)}.archive-title{background:var(--line);color:var(--muted);font:16px "Roboto Condensed",Arial,sans-serif;padding:20px 90px;margin:0}footer{padding:30px;text-align:center;color:var(--muted);font-size:12px;border-top:1px solid var(--line)}.search-form{display:grid;gap:12px;margin-top:30px}.sr-only,.skip{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}.skip:focus{clip-path:none;width:auto;height:auto;top:10px;left:10px;background:var(--surface);padding:12px;z-index:10}@media(max-width:1100px){.site{grid-template-columns:270px minmax(0,1fr)}.article{padding:45px}.archive-title{padding:20px 45px}}@media(max-width:900px){.site{display:block;border-left:0;border-right:0}.brand{padding:22px 20px 16px}.brand>a{font-size:42px}.brand p{margin-top:10px}.sidebar-menu>summary{display:list-item;list-style-position:inside;border-bottom:1px solid #4a4a4a}.sidebar nav{display:flex;flex-wrap:wrap}.sidebar nav a{flex:1;text-align:center}.widget li a{display:inline-block;padding:8px 0}.article{padding:40px 35px}.entry-title{font-size:32px}}@media(max-width:480px){.article{padding:30px 22px}.entry-title{font-size:27px}.entry-meta{font-size:11px}.archive-title{padding:18px 22px}.prose{padding-top:22px}.brand>a{font-size:38px}}
/* Search controls share the charcoal sidebar and slate heading palette. */
form[role="search"] input{background:var(--raised);color:var(--heading);border-color:var(--input-border)}
form[role="search"] input::placeholder{color:var(--muted);opacity:1}
form[role="search"] input:hover{border-color:var(--muted)}
form[role="search"] button{background:var(--button);color:#fff;border:1px solid var(--button)}
form[role="search"] button:hover{background:#333;border-color:#333}
form[role="search"] input:focus-visible,form[role="search"] button:focus-visible{outline-color:var(--heading)}
.sidebar form[role="search"] button{background:#444;border-color:var(--muted)}
.sidebar form[role="search"] button:hover{background:#555;border-color:#bbb}
.sidebar form[role="search"] input:focus-visible,.sidebar form[role="search"] button:focus-visible{outline-color:#ccc}
.search-form label{color:var(--heading)}

/* Maroon replaces blue category links; sidebar links retain their original white. */
.category-link{color:var(--link)}
.category-link:hover{color:var(--link-hover)}
.category-link:focus-visible{outline-color:var(--link)}
.sidebar .category-link{color:#fff}

a:focus-visible{outline-color:var(--link)}
.sidebar a:focus-visible{outline-color:#ccc}

/* The toggle remains accessible when the mobile navigation is collapsed. */
.brand{position:relative}
.brand p{padding-right:30px}
.theme-toggle{position:absolute;bottom:18px;right:8px;display:grid;place-items:center;width:36px;height:36px;min-height:36px;padding:7px;background:transparent;color:#eee;border:1px solid #777;border-radius:50%;cursor:pointer}
.theme-toggle:hover{background:#484848}
.theme-toggle:focus-visible{outline-color:#e6a3b4}
.theme-toggle svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.theme-toggle .sun{display:none}
:root[data-theme="dark"] .theme-toggle .sun{display:block}
:root[data-theme="dark"] .theme-toggle .moon{display:none}
.theme-toggle[hidden]{display:none}
/* The icon is anchored to the subtitle row; it does not offset its text. */
@media(max-width:900px){
  .brand-subtitle{position:relative;margin-top:10px}
  .brand-subtitle p{margin:0;padding:0 36px;text-align:center}
  .brand-subtitle .theme-toggle{top:50%;bottom:auto;right:-12px;transform:translateY(-50%)}
}
/* Let the mobile menu stick within the full page, rather than the short sidebar. */
@media(max-width:900px){
  html{scroll-padding-top:60px}
  .sidebar{display:contents}
  .sidebar .brand{background:#333}
  .sidebar-menu{
    position:sticky;
    top:0;
    z-index:20;
    display:block;
    max-height:100vh;
    max-height:100dvh;
    overflow-y:auto;
    overscroll-behavior:contain;
    background:#333;
  }
  .sidebar-menu>summary{position:sticky;top:0;z-index:1;background:#333}
  .skip:focus{z-index:30}
}
