
    :root {
      --vm-primary: #293040;
      --vm-accent: #6f8a3a;
      --vm-cream: #fefcf9;
      --vm-soft: #fffaf3;
      --vm-warm: #f4eadc;
      --vm-ink: #333;
      --vm-muted: #626b73;
      --vm-border: #eadfce;
    }

    body {
      margin: 0;
      background-color: var(--vm-cream);
      color: var(--vm-ink);
      font-family: "Segoe UI", system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
    }

    a {
      color: inherit;
      text-decoration-thickness: 1px;
      text-underline-offset: 4px;
    }

    a:focus-visible,
    .book-link:focus-visible,
    .site-link:focus-visible {
      outline: 3px solid rgba(111, 138, 58, 0.45);
      outline-offset: 4px;
    }

    header {
      background: linear-gradient(135deg, #faf6ef, #fdfaf4);
      border-bottom: 1px solid #e9ecef;
      padding: 1.4rem 1rem 1rem;
    }

    .site-masthead {
      align-items: center;
      display: flex;
      gap: 1rem;
      justify-content: space-between;
      margin: 0 auto;
      max-width: 1120px;
    }

    .vm-logo {
      height: auto;
      max-width: 210px;
    }

    .site-link {
      border: 1px solid var(--vm-border);
      border-radius: 999px;
      color: var(--vm-primary);
      font-size: 0.9rem;
      font-weight: 700;
      padding: 0.55rem 1rem;
      text-decoration: none;
    }

    .site-link:hover {
      background-color: #fff;
      color: var(--vm-primary);
    }

    main {
      padding-bottom: 3.5rem;
    }

    .author-hero {
      background:
        radial-gradient(circle at top left, rgba(244, 234, 220, 0.88), transparent 34rem),
        var(--vm-cream);
      padding: 3rem 1.25rem;
    }

    .author-grid {
      align-items: center;
      display: grid;
      gap: 2rem;
      margin: 0 auto;
      max-width: 1120px;
    }

    @media (min-width: 820px) {
      .author-grid {
        grid-template-columns: minmax(0, 1fr) minmax(260px, 340px);
      }
    }

    .vm-pill {
      background-color: #e8f0e1;
      border-radius: 999px;
      color: #3c5a1e;
      display: inline-block;
      font-size: 0.78rem;
      font-weight: 700;
      letter-spacing: 0.06em;
      margin-bottom: 0.8rem;
      padding: 0.28rem 0.78rem;
      text-transform: uppercase;
    }

    h1,
    h2,
    h3 {
      color: var(--vm-primary);
      line-height: 1.15;
    }

    h1 {
      font-size: clamp(2.25rem, 6vw, 4.4rem);
      font-weight: 750;
      margin-bottom: 1rem;
    }

    .intro-copy {
      color: #444;
      font-size: 1.12rem;
      line-height: 1.75;
      margin-bottom: 1.1rem;
      max-width: 720px;
    }

    .bio-copy {
      color: var(--vm-muted);
      font-size: 1rem;
      line-height: 1.7;
      max-width: 760px;
    }

    .portrait-wrap {
      justify-self: center;
      max-width: 340px;
      width: 100%;
    }

    .portrait-wrap img {
      aspect-ratio: 900 / 1321;
      border-radius: 0.45rem;
      box-shadow: 0 18px 44px rgba(41, 48, 64, 0.18);
      display: block;
      height: auto;
      object-fit: cover;
      width: 100%;
    }

    .section {
      padding: 3rem 1.25rem;
    }

    .section-soft {
      background-color: #f8f6f2;
      border-bottom: 1px solid #ece4d8;
      border-top: 1px solid #ece4d8;
    }

    .section-inner {
      margin: 0 auto;
      max-width: 1120px;
    }

    .section-heading {
      font-size: clamp(1.7rem, 4vw, 2.45rem);
      font-weight: 750;
      margin-bottom: 0.7rem;
    }

    .section-lead {
      color: #4f565c;
      font-size: 1.03rem;
      line-height: 1.7;
      margin-bottom: 1.8rem;
      max-width: 760px;
    }

    .books-grid {
      display: grid;
      gap: 1.4rem;
    }

    @media (min-width: 760px) {
      .books-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
      }
    }

    .book-card {
      background-color: var(--vm-soft);
      border: 1px solid var(--vm-border);
      border-radius: 0.5rem;
      box-shadow: 0 10px 30px rgba(41, 48, 64, 0.07);
      display: grid;
      gap: 1.25rem;
      padding: 1rem;
    }

    @media (min-width: 540px) {
      .book-card {
        grid-template-columns: minmax(132px, 180px) 1fr;
        padding: 1.1rem;
      }
    }

    .book-cover,
    .book-placeholder {
      align-self: start;
      border-radius: 0.35rem;
      box-shadow: 0 12px 28px rgba(41, 48, 64, 0.16);
      width: 100%;
    }

    .book-cover img {
      border-radius: 0.35rem;
      display: block;
      height: auto;
      width: 100%;
    }

    .book-placeholder {
      align-items: center;
      aspect-ratio: 2 / 3;
      background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.58), rgba(255, 255, 255, 0)),
        #d8c8b2;
      color: var(--vm-primary);
      display: flex;
      flex-direction: column;
      justify-content: center;
      min-height: 210px;
      padding: 1rem;
      text-align: center;
    }

    .book-placeholder strong {
      font-size: 1.06rem;
      line-height: 1.2;
    }

    .book-placeholder span {
      color: #59614b;
      display: block;
      font-size: 0.72rem;
      font-weight: 700;
      letter-spacing: 0.08em;
      margin-top: 0.8rem;
      text-transform: uppercase;
    }

    .book-body {
      display: flex;
      flex-direction: column;
      min-width: 0;
    }

    .book-title {
      font-size: 1.25rem;
      font-weight: 750;
      margin-bottom: 0.25rem;
    }

    .book-subtitle {
      color: var(--vm-muted);
      font-size: 0.95rem;
      font-style: italic;
      margin-bottom: 0.35rem;
    }

    .book-secondary {
      color: #815d2a;
      font-size: 0.88rem;
      font-weight: 700;
      margin-bottom: 0.5rem;
    }

    .book-description {
      color: #50565b;
      font-size: 0.94rem;
      line-height: 1.65;
      margin-bottom: 1rem;
    }

    .book-footer {
      align-items: center;
      display: flex;
      flex-wrap: wrap;
      gap: 0.7rem;
      margin-top: auto;
    }

    .status-label {
      background-color: #ece4d8;
      border-radius: 999px;
      color: #4d4437;
      display: inline-flex;
      font-size: 0.82rem;
      font-weight: 700;
      padding: 0.45rem 0.8rem;
    }

    .status-label.available {
      background-color: #e8f0e1;
      color: #3c5a1e;
    }

    .book-link {
      background-color: var(--vm-accent);
      border-radius: 999px;
      color: #fff;
      display: inline-flex;
      font-size: 0.9rem;
      font-weight: 700;
      padding: 0.55rem 1.05rem;
      text-decoration: none;
    }

    .book-link:hover {
      background-color: #607632;
      color: #fff;
    }

    .closing-invitation {
      margin: 0 auto;
      max-width: 760px;
      text-align: center;
    }

    .closing-invitation p {
      color: #444;
      font-size: 1.08rem;
      line-height: 1.75;
      margin-bottom: 0;
    }

    footer {
      background-color: #fafafa;
      border-top: 1px solid #e9ecef;
      color: var(--vm-muted);
      font-size: 0.85rem;
      padding: 1.2rem 1rem 1.5rem;
      text-align: center;
    }

    footer a {
      color: var(--vm-muted);
    }

    footer a:hover {
      color: var(--vm-primary);
    }

.site-masthead{flex-wrap:wrap}.site-masthead>a{max-width:100%}.vm-logo{max-width:min(210px,100%)}.site-masthead nav{display:flex;flex-wrap:wrap;gap:.5rem}.site-link,.book-link{min-height:44px;display:inline-flex;align-items:center;white-space:normal}.author-grid>*{min-width:0}h1,h2,h3{overflow-wrap:break-word}.portrait-wrap img{aspect-ratio:auto;object-fit:contain}.author-articles{display:grid;gap:1.5rem}.visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}.skip-link{position:absolute;top:-100px;left:1rem;padding:1rem;background:white;z-index:10}.skip-link:focus{top:1rem}.section-inner .bio-copy{max-width:760px}.author-return{display:inline-flex;min-height:44px;align-items:center}.book-cover{min-width:0}.book-cover img{max-width:100%}.author-articles article{padding:1rem;background:var(--vm-soft);border:1px solid var(--vm-border);border-radius:.5rem}@media(max-width:539px){.site-masthead{justify-content:center}.portrait-wrap{max-width:280px}.book-cover{max-width:240px;justify-self:center}}
@media(max-width:819px){.author-profile .portrait-wrap{order:-1}}
@media(max-width:539px){h1{font-size:2rem}}
