@import url('https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,400;9..144,600;9..144,700;9..144,900&family=Work+Sans:wght@400;500;600&family=Space+Mono:wght@400;700&display=swap');

  :root{
    --paper: #eee8dd;
    --paper-card: #faf7f1;
    --ink: #29231f;
    --ink-soft: #5c534a;
    --rule: #c7bba7;
    --teal: #3f6f6a;
    --ochre: #c17f22;
    --indigo: #3f4f74;
    --stamp: rgba(41,35,31,0.16);
    --radius: 2px;
  }

  *{ box-sizing: border-box; }

  html{ scroll-behavior: smooth; }

  body{
    margin:0;
    background:
      radial-gradient(ellipse 900px 500px at 15% -10%, rgba(63,111,106,0.06), transparent),
      radial-gradient(ellipse 900px 500px at 90% 10%, rgba(193,127,34,0.06), transparent),
      var(--paper);
    color: var(--ink);
    font-family: 'Work Sans', sans-serif;
    -webkit-font-smoothing: antialiased;
    line-height: 1.5;
  }

  a{ color: inherit; }

  :focus-visible{
    outline: 2px solid var(--teal);
    outline-offset: 3px;
  }

  .wrap{
    max-width: 780px;
    margin: 0 auto;
    padding: 5.5rem 1.5rem 4rem;
  }

  /* ---------- Header / ledger title block ---------- */

  header{
    margin-bottom: 3.5rem;
  }

  .eyebrow{
    font-family: 'Space Mono', monospace;
    font-size: 0.72rem;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--ink-soft);
    margin: 0 0 1rem;
  }

  h1{
    font-family: 'Fraunces', serif;
    font-optical-sizing: auto;
    font-weight: 700;
    font-size: clamp(2.4rem, 7vw, 3.6rem);
    line-height: 1.02;
    margin: 0 0 1rem;
    letter-spacing: -0.01em;
  }

  .lede{
    font-size: 1.05rem;
    color: var(--ink-soft);
    max-width: 46ch;
    margin: 0 0 1.75rem;
  }

  .ledger-rule{
    display:flex;
    align-items:center;
    gap: 0.85rem;
    font-family: 'Space Mono', monospace;
    font-size: 0.7rem;
    letter-spacing: 0.08em;
    color: var(--ink-soft);
  }

  .ledger-rule::after{
    content:"";
    flex:1;
    height:1px;
    background: repeating-linear-gradient(
      to right, var(--rule) 0, var(--rule) 4px, transparent 4px, transparent 9px
    );
  }

  /* ---------- Entries ---------- */

  .entries{
    display:flex;
    flex-direction: column;
    gap: 1.5rem;
  }

  .entry{
    position: relative;
    background: var(--paper-card);
    border: 1px solid var(--rule);
    border-radius: var(--radius);
    padding: 2rem 2rem 1.75rem;
    box-shadow: 0 1px 0 rgba(41,35,31,0.04);
    transition: transform 0.25s ease, box-shadow 0.25s ease;
  }

  .entry:hover{
    transform: translateY(-3px);
    box-shadow: 0 14px 28px -18px rgba(41,35,31,0.35);
  }

  @media (prefers-reduced-motion: reduce){
    .entry, .stamp, .entry-icon{ transition: none !important; }
  }

  /* accession stamp */
  .stamp{
    position:absolute;
    top: -14px;
    right: 22px;
    font-family: 'Space Mono', monospace;
    font-size: 0.68rem;
    letter-spacing: 0.06em;
    padding: 0.3rem 0.6rem;
    border: 1.5px solid currentColor;
    border-radius: 3px;
    background: var(--paper-card);
    transform: rotate(-4deg);
    transition: transform 0.25s ease;
  }
  .entry:hover .stamp{ transform: rotate(-1deg); }

  .entry-head{
    display:flex;
    align-items:flex-start;
    gap: 1.1rem;
    margin-bottom: 0.85rem;
  }

  .entry-icon{
    flex: none;
    width: 42px;
    height: 42px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius: 50%;
    border: 1.5px solid currentColor;
  }
  .entry-icon svg{ width: 22px; height: 22px; }

  .entry-tag{
    font-family: 'Space Mono', monospace;
    font-size: 0.68rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    margin: 0.2rem 0 0.3rem;
  }

  .entry h2{
    font-family: 'Fraunces', serif;
    font-weight: 600;
    font-size: 1.5rem;
    margin: 0;
    line-height: 1.15;
  }

  .entry p.desc{
    margin: 0 0 1.15rem;
    color: var(--ink-soft);
    font-size: 0.97rem;
    max-width: 52ch;
  }

  .entry-foot{
    display:flex;
    align-items:center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 0.75rem;
  }

  .status{
    font-family: 'Space Mono', monospace;
    font-size: 0.72rem;
    color: var(--ink-soft);
  }

  .status.live::before{
    content:"";
    display:inline-block;
    width:6px; height:6px;
    border-radius:50%;
    background: currentColor;
    margin-right: 0.45em;
    position: relative;
    top: -1px;
  }

  .btn{
    display:inline-flex;
    align-items:center;
    gap: 0.5rem;
    font-family: 'Work Sans', sans-serif;
    font-weight: 600;
    font-size: 0.88rem;
    padding: 0.55rem 1.05rem;
    border-radius: 999px;
    border: 1.5px solid currentColor;
    text-decoration: none;
    transition: background 0.2s ease, color 0.2s ease;
  }

  a.btn:hover{
    background: currentColor;
  }
  a.btn:hover span{
    color: var(--paper-card);
  }
  a.btn span{ transition: color 0.2s ease; }

  .btn.disabled{
    opacity: 0.55;
    cursor: default;
    border-style: dashed;
  }

  .btn svg{ width: 14px; height: 14px; }

  /* per-category colors */
  .cat-research{ color: var(--teal); }
  .cat-illustration{ color: var(--ochre); }
  .cat-photography{ color: var(--indigo); }

  /* ---------- Footer ---------- */

  footer{
    margin-top: 3.5rem;
    padding-top: 1.5rem;
    border-top: 1px solid var(--rule);
    display:flex;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 0.5rem;
    font-family: 'Space Mono', monospace;
    font-size: 0.68rem;
    color: var(--ink-soft);
    letter-spacing: 0.03em;
  }

  @media (max-width: 520px){
    .wrap{ padding: 3.5rem 1.25rem 3rem; }
    .entry{ padding: 1.6rem 1.4rem 1.5rem; }
    .stamp{ right: 14px; }
  }

.site-nav{display:flex;gap:.5rem;flex-wrap:wrap;margin-bottom:2.5rem;border-bottom:1px solid var(--rule);padding-bottom:.8rem}
.site-nav a{padding:.65rem 1rem;border:1px solid transparent;border-radius:999px;text-decoration:none;font-weight:600;font-size:.9rem}
.site-nav a[aria-current="page"]{background:var(--ink);color:var(--paper-card)}
.site-nav a:hover{border-color:var(--rule)}
.book{display:grid;grid-template-columns:180px minmax(0,1fr);gap:1.8rem;align-items:start;color:var(--ink)}
.book-cover{display:block;width:100%;height:auto;box-shadow:0 8px 20px rgba(41,35,31,.15)}
.book h2{margin:0 0 .8rem}.book .desc{margin:0 0 1rem}.book-meta{font-family:'Space Mono',monospace;font-size:.72rem;color:var(--ink-soft);margin:0 0 1rem}
.book .entry-foot{align-items:flex-start;flex-direction:column;gap:1rem}
.book .btn{color:var(--teal)}.book .btn:hover{background:var(--teal);color:var(--paper-card)}
.book .coming{display:inline-block;padding:.55rem 1.05rem;border:1px dashed var(--rule);border-radius:999px;color:var(--ink-soft);font-weight:600;font-size:.88rem}
@media(max-width:520px){.book{grid-template-columns:1fr;gap:1.5rem}.book-cover{max-width:220px;margin:0 auto}.site-nav a{padding:.65rem .85rem}}

.site-nav{gap:.25rem}.site-nav a{font-size:.85rem;padding:.7rem .9rem;white-space:nowrap}
.home-cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.6rem}
.home-cards .entry{display:flex;flex-direction:column;padding:1.75rem 1.5rem;min-width:0}
.home-cards .entry-foot{margin-top:auto;padding-top:.4rem}.home-cards h2{font-size:1.4rem}
.topic-list{display:flex;flex-wrap:wrap;gap:.55rem;list-style:none;padding:0;margin:1.5rem 0}
.topic-list li{padding:.4rem .7rem;border:1px solid var(--rule);border-radius:999px;font-size:.85rem;color:var(--ink-soft)}
.brand-link{text-decoration:none}.book-subtitle{font-family:'Fraunces',serif;font-size:1.1rem;color:var(--ink-soft);margin:0 0 1rem}
@media(max-width:620px){.home-cards{grid-template-columns:1fr}.site-nav a{padding:.6rem .7rem}.wrap{padding-top:2.5rem}}