/* OnceMarked blueprint — editable theme, CSS contract v1.
   Design thesis: An architect's drawing sheet: cyanotype blue, a measured grid, a ruled title block and numbered drawing notes. Technical order, not arbitrary boxes floating on graph paper.
   Typography: Space Mono. Technical drafting with eccentric geometric details.
   Complete theme layer, served after the small base stylesheet.
   Change selectors below; no hidden preset is appended after saving.
   Colours: --bg page, --surface cards, --ink text, --quiet secondary text,
   --line borders, --accent links, --code code backgrounds.
   --page-width sets reading width; --blog-font sets inherited typography.
   Keep default-only selectors to respect the Font/Colour/Width controls.
   .site-home, .site-post, .site-page and .site-tag scope different page types.
   Do not hide required attribution. No HTML or JS. External fonts must use Google Fonts.
*/

/* Theme colours only: explicit palette choices bypass these rules. Auto follows the device. */
html[data-palette="default"] {
  --bg:#eef6ff;
  --surface:#e5eef9;
  --ink:#153860;
  --quiet:#567190;
  --line:#cbd8e6;
  --accent:#16499c;
  --code:#dfe9f4;
}


/* Theme colours only: explicit palette choices bypass these rules. Auto follows the device. */
html[data-palette="default"][data-mode="dark"] {
  --bg:#08254a;
  --surface:#112d51;
  --ink:#e8f3ff;
  --quiet:#a5b5c9;
  --line:#2c4667;
  --accent:#87c7ff;
  --code:#183357;
}


/* Responsive adaptation: keep the same content readable on small screens. */
@media(prefers-color-scheme:dark) {

  /* Theme colours only: explicit palette choices bypass these rules. Auto follows the device. */
  html[data-palette="default"][data-mode="auto"] {
    --bg:#08254a;
    --surface:#112d51;
    --ink:#e8f3ff;
    --quiet:#a5b5c9;
    --line:#2c4667;
    --accent:#87c7ff;
    --code:#183357;
  }

}


/* Theme-default typography: explicit font selections bypass this rule. */
html[data-theme="minimal"] {
  --blog-font:ui-monospace,monospace;
}


/* Theme reading width: Narrow/Wide choices bypass this default. */
html[data-content-width="standard"] {
  --page-width:64rem;
}


/* Outer page composition: background decoration uses CSS only. */
body {
  padding:2rem 0;
  background-image:linear-gradient(var(--line) 1px,transparent 1px),linear-gradient(90deg,var(--line) 1px,transparent 1px);
  background-size:1.5rem 1.5rem;
}

.wrap {
  background:var(--bg);
  border-inline:1px solid var(--accent);
  padding-inline:1.5rem;
}


/* Masthead: blog name and navigation container. */
.site-head {
  border-block:1px solid var(--accent);
  padding-block:.75rem;
}


/* Blog name typography, separate from the article title. */
.site-title {
  font-size:.8125rem;
  letter-spacing:.08em;
  text-transform:uppercase;
}


/* Navigation links: wrapping, spacing and alignment. */
.site-nav {
  font-size:.6875rem;
}


/* Main reading container; header and footer remain outside it. */
.site-main {
  padding-top:0;
}


/* Homepage introduction and, where listed, article heading treatment. */
.intro {
  display:grid;
  grid-template-columns:2fr 1fr;
  gap:1.5rem;
  align-items:center;
  margin:0;
  padding:1.5rem 0;
  border-bottom:3px double var(--accent);
}


/* Homepage introduction and, where listed, article heading treatment. */
.intro h1,.entry-head h1 {
  font-size:clamp(1.7rem,4vw,2.75rem);
  line-height:1.3;
  font-weight:400;
  letter-spacing:-.045em;
}


/* Homepage introduction and, where listed, article heading treatment. */
.intro p {
  border-left:1px solid var(--accent);
  padding-left:1.5rem;
  font-size:.8125rem;
  line-height:1.7;
  margin:0;
}


/* Post listing grid: minmax prevents long titles overflowing columns. */
.entry-list {
  counter-reset:drawing;
}


/* Post summary: title, excerpt, date and tags. */
.entry-card,.entry-card:last-child {
  counter-increment:drawing;
  display:grid;
  grid-template-columns:3rem minmax(0,1fr);
  gap:.5rem 1.5rem;
  border-top:0;
  border-bottom:1px solid var(--line);
  padding:1.5rem 0;
}


/* Post summary: title, excerpt, date and tags. */
.entry-card::before {
  content:counter(drawing,decimal-leading-zero);
  grid-row:1/4;
  align-self:start;
  border:1px solid var(--accent);
  border-radius:50%;
  width:2.5rem;
  height:2.5rem;
  display:grid;
  place-items:center;
  font-size:.6875rem;
  color:var(--accent);
}


/* Post summary: title, excerpt, date and tags. */
.entry-card h2 {
  font-size:1.0625rem;
  line-height:1.5;
  font-weight:400;
}


/* Post summary: title, excerpt, date and tags. */
.entry-card p,.entry-card .meta {
  grid-column:2;
  margin:0;
}


/* Post summary: title, excerpt, date and tags. */
.entry-card p {
  font-size:.8125rem;
  line-height:1.75;
}


/* Small publication metadata: wrapping must remain enabled. */
.meta {
  font-size:.6875rem;
}


/* Article header: title, summary and publication metadata. */
.entry-head {
  padding:1.5rem 0;
  border-bottom:3px double var(--accent);
}

.entry-summary {
  font-size:.9375rem;
}


/* Article body and rich content: retain readable contrast and line-height. */
.prose {
  max-width:76ch;
  font-size:.9375rem;
  line-height:1.85;
}


/* Article body and rich content: retain readable contrast and line-height. */
.prose h2 {
  font-size:1.125rem;
  font-weight:400;
  border-bottom:1px solid var(--accent);
  padding-bottom:.5rem;
}


/* Article body and rich content: retain readable contrast and line-height. */
.prose pre,.table-scroll {
  border:1px solid var(--accent);
  border-radius:0;
}


/* Article body and rich content: retain readable contrast and line-height. */
.prose blockquote {
  border-left:2px dashed var(--accent);
  color:var(--ink);
}


/* Footer and attribution: keep visible, including on mobile. */
.site-foot {
  padding:1rem 1.5rem;
  border-block:1px solid var(--accent);
  font-size:.6875rem;
}

.site-branding {
  font-size:.8125rem;
}


/* Responsive adaptation: keep the same content readable on small screens. */
@media(max-width:40rem) {

  /* Outer page composition: background decoration uses CSS only. */
  body {
    padding-block:1rem;
  }

  .wrap {
    padding-inline:1rem;
  }


  /* Homepage introduction and, where listed, article heading treatment. */
  .intro {
    display:block;
  }


  /* Homepage introduction and, where listed, article heading treatment. */
  .intro p {
    margin-top:1rem;
    padding-left:0;
    border:0;
  }


  /* Post summary: title, excerpt, date and tags. */
  .entry-card,.entry-card:last-child {
    grid-template-columns:2rem minmax(0,1fr);
    gap:.4rem 1rem;
  }


  /* Post summary: title, excerpt, date and tags. */
  .entry-card::before {
    width:1.875rem;
    height:1.875rem;
  }

}


/* One typeface, loaded only when used, with immediate system fallback. Preserve its URL and attribution. Google-available faces use Google; the licensed IBM VGA reconstruction is local. */
@font-face {
  font-family:"OM Space Mono";
  font-style:normal;
  font-weight:400;
  font-display:swap;
  src:url("https://fonts.gstatic.com/s/spacemono/v17/i7dPIFZifjKcF5UAWdDRYEF8RQ.woff2") format("woff2");
}


/* Theme-default typography: explicit font selections bypass this rule. */
html[data-theme="minimal"] {
  --blog-font:"OM Space Mono",monospace;
}