:root{
    --paper: #ece4d2;
    --paper-deep: #e2d8c1;
    --ink: #2a2318;
    --ink-soft: #4a4232;
    --gold: #a3822f;
    --rust: #8c3d28;
    --rule: rgba(42,35,24,0.22);
  }

  *{box-sizing:border-box;}

  html,body{
    margin:0;
    padding:0;
    background:var(--paper);
    color:var(--ink);
    font-family:'Spectral', serif;
  }

  body{
    background-image:
      radial-gradient(ellipse at top left, rgba(163,130,47,0.08), transparent 55%),
      radial-gradient(ellipse at bottom right, rgba(140,61,40,0.06), transparent 55%);
  }

  .page{
    max-width:720px;
    margin:0 auto;
    padding:5rem 2.2rem 6rem;
    position:relative;
  }

  /* ---------- header ---------- */

  .masthead{
    text-align:center;
    margin-bottom:4rem;
  }

  .pre-eyebrow{
    font-family:'IM Fell English', serif;
    font-style:italic;
    font-size:1rem;
    color:var(--ink-soft);
    margin:0 0 1.3rem;
  }

  .eyebrow{
    font-family:'IM Fell English SC', serif;
    letter-spacing:0.35em;
    font-size:0.72rem;
    color:var(--rust);
    text-transform:uppercase;
    margin:0 0 1.1rem;
  }

  .rule-flourish{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:0.8rem;
    margin:0 auto 1.3rem;
    width:220px;
  }
  .rule-flourish .line{ flex:1; height:1px; background:var(--gold); opacity:0.6; }
  .rule-flourish svg{ flex-shrink:0; }

  h1.title{
    font-family:'IM Fell English', serif;
    font-weight:400;
    font-style:normal;
    font-size:clamp(2.8rem, 8vw, 4.2rem);
    letter-spacing:0.01em;
    margin:0 0 0.6rem;
    color:var(--ink);
  }

  .subtitle{
    font-family:'IM Fell English', serif;
    font-style:italic;
    font-size:1.15rem;
    color:var(--ink-soft);
    max-width:34ch;
    margin:0 auto;
    line-height:1.5;
  }

  .drop-note{
    margin-top:1.6rem;
    font-family:'Cutive Mono', monospace;
    font-size:0.7rem;
    letter-spacing:0.08em;
    color:var(--ink-soft);
    opacity:0.75;
    text-transform:uppercase;
  }

  .nut-graf{
    max-width:52ch;
    margin:2.2rem auto 0;
    padding-top:1.8rem;
    border-top:1px solid var(--rule);
    font-size:1.05rem;
    line-height:1.75;
    color:var(--ink-soft);
    text-align:center;
  }

  /* ---------- section labels ---------- */

  .section-label{
    display:flex;
    align-items:center;
    gap:0.9rem;
    margin:3.4rem 0 1.6rem;
  }
  .section-label .glyph{ flex-shrink:0; opacity:0.85; }
  .section-label .line{ flex:1; height:1px; background:var(--rule); }
  .section-label h2{
    font-family:'IM Fell English SC', serif;
    font-size:1rem;
    letter-spacing:0.24em;
    text-transform:uppercase;
    color:var(--rust);
    margin:0;
    white-space:nowrap;
  }

  p{
    font-size:1.09rem;
    line-height:1.75;
    color:var(--ink);
    margin:0 0 1.15rem;
  }

  .lede::first-letter{
    font-family:'IM Fell English', serif;
    font-size:3.6rem;
    float:left;
    line-height:0.8;
    padding:0.1rem 0.35rem 0 0;
    color:var(--rust);
  }

  /* ---------- timeline (biography) ---------- */

  .timeline{
    position:relative;
    padding-left:2.1rem;
    margin-bottom:0.5rem;
  }
  .timeline::before{
    content:"";
    position:absolute;
    left:0.42rem;
    top:0.4rem;
    bottom:0.4rem;
    width:1px;
    background:linear-gradient(to bottom, var(--gold), var(--rule) 90%);
  }

  .tl-item{
    position:relative;
    margin-bottom:2rem;
  }
  .tl-item:last-child{ margin-bottom:0; }

  .tl-item::before{
    content:"";
    position:absolute;
    left:-2.1rem;
    top:0.35rem;
    width:9px;
    height:9px;
    border-radius:50%;
    background:var(--paper);
    border:1.5px solid var(--gold);
  }

  .tl-year{
    display:block;
    font-family:'Cutive Mono', monospace;
    font-size:0.78rem;
    letter-spacing:0.1em;
    color:var(--gold);
    margin-bottom:0.35rem;
  }

  .tl-item h3{
    font-family:'IM Fell English', serif;
    font-weight:400;
    font-style:italic;
    font-size:1.28rem;
    margin:0 0 0.5rem;
    color:var(--ink);
  }

  .tl-item p{ margin-bottom:0; }

  /* ---------- beliefs list ---------- */

  .belief-block{
    border-left:2px solid var(--rule);
    padding-left:1.3rem;
    margin-bottom:1.7rem;
  }
  .belief-block h4{
    font-family:'IM Fell English SC', serif;
    font-size:0.85rem;
    letter-spacing:0.12em;
    text-transform:uppercase;
    color:var(--ink-soft);
    margin:0 0 0.5rem;
  }
  .belief-block p{ margin-bottom:0; }

  .aside-quote{
    margin:2.2rem 0;
    padding:1.4rem 1.6rem;
    background:var(--paper-deep);
    border:1px solid var(--rule);
    border-radius:2px;
    font-family:'IM Fell English', serif;
    font-style:italic;
    font-size:1.05rem;
    color:var(--ink-soft);
    line-height:1.65;
  }
  .aside-quote span{
    display:block;
    margin-top:0.6rem;
    font-family:'Cutive Mono', monospace;
    font-style:normal;
    font-size:0.7rem;
    letter-spacing:0.06em;
    color:var(--rust);
    text-transform:uppercase;
  }

  /* ---------- tabs ---------- */

  .tab-nav{
    display:flex;
    justify-content:center;
    gap:0.6rem;
    margin:0 0 3.2rem;
    border-bottom:1px solid var(--rule);
    padding-bottom:0;
  }
  .tab-btn{
    font-family:'IM Fell English SC', serif;
    font-size:0.82rem;
    letter-spacing:0.14em;
    text-transform:uppercase;
    background:none;
    border:none;
    cursor:pointer;
    color:var(--ink-soft);
    padding:0.7rem 1.1rem 0.9rem;
    position:relative;
    transition:color 0.15s ease;
  }
  .tab-btn:hover{ color:var(--ink); }
  .tab-btn::after{
    content:"";
    position:absolute;
    left:0.4rem;
    right:0.4rem;
    bottom:-1px;
    height:2px;
    background:transparent;
    transition:background 0.15s ease;
  }
  .tab-btn[aria-selected="true"], .tab-btn[aria-current="true"]{ color:var(--rust); }
  .tab-btn[aria-selected="true"]::after, .tab-btn[aria-current="true"]::after{ background:var(--rust); }

  .tab-panel{ display:none; }
  .tab-panel.active{ display:block; }

  /* ---------- misconception grid ---------- */

  .misconception{
    display:flex;
    gap:1.4rem;
    margin-bottom:1.4rem;
    align-items:flex-start;
  }
  .misconception .label{
    flex-shrink:0;
    width:5.2rem;
    font-family:'Cutive Mono', monospace;
    font-size:0.68rem;
    letter-spacing:0.06em;
    text-transform:uppercase;
    padding:0.3rem 0;
    text-align:center;
    border-radius:2px;
  }
  .misconception .label.not{ background:rgba(140,61,40,0.14); color:var(--rust); }
  .misconception .label.is{ background:rgba(163,130,47,0.16); color:var(--gold); }
  .misconception p{ margin:0; }

  .motto{
    text-align:center;
    font-family:'IM Fell English', serif;
    font-style:italic;
    font-size:1.4rem;
    color:var(--rust);
    margin:2.2rem 0;
    padding:0.4rem 0;
    border-top:1px solid var(--rule);
    border-bottom:1px solid var(--rule);
  }

  .teacher-card{
    display:flex;
    gap:1.4rem;
    align-items:flex-start;
    background:var(--paper-deep);
    border:1px solid var(--rule);
    border-radius:2px;
    padding:1.5rem 1.6rem;
    margin:1.6rem 0 0.5rem;
  }
  .teacher-card .initial{
    flex-shrink:0;
    width:3.2rem;
    height:3.2rem;
    border-radius:50%;
    border:1.5px solid var(--gold);
    display:flex;
    align-items:center;
    justify-content:center;
    font-family:'IM Fell English', serif;
    font-size:1.4rem;
    color:var(--gold);
  }
  .teacher-card h4{
    font-family:'IM Fell English', serif;
    font-style:italic;
    font-weight:400;
    font-size:1.2rem;
    margin:0 0 0.5rem;
    color:var(--ink);
  }
  .teacher-card p{ margin-bottom:0.6rem; font-size:1rem; }
  .teacher-card p:last-child{ margin-bottom:0; }

  /* ---------- books tab ---------- */

  .book-grid{
    display:grid;
    grid-template-columns:repeat(auto-fit, minmax(120px, 1fr));
    gap:1.2rem;
    margin:1.8rem 0 2.2rem;
  }

  .book-cover{
    aspect-ratio:2/3;
    border:1px solid var(--rule);
    border-radius:2px;
    background:
      repeating-linear-gradient(135deg, rgba(42,35,24,0.03) 0px, rgba(42,35,24,0.03) 2px, transparent 2px, transparent 10px),
      var(--paper-deep);
    display:flex;
    align-items:center;
    justify-content:center;
    padding:0.6rem;
    overflow:hidden;
  }
  .book-cover img{
    width:100%;
    height:100%;
    object-fit:cover;
    border-radius:1px;
  }
  .book-cover .placeholder-text{
    font-family:'Cutive Mono', monospace;
    font-size:0.62rem;
    letter-spacing:0.05em;
    text-align:center;
    color:var(--ink-soft);
    opacity:0.6;
    text-transform:uppercase;
    line-height:1.5;
  }

  .cta-wrap{
    text-align:center;
    margin:1.6rem 0 1rem;
  }
  .cta-button{
    display:inline-block;
    font-family:'IM Fell English SC', serif;
    font-size:0.9rem;
    letter-spacing:0.1em;
    text-transform:uppercase;
    color:var(--paper);
    background:var(--rust);
    padding:0.9rem 1.8rem;
    border-radius:2px;
    text-decoration:none;
    transition:background 0.15s ease;
  }
  .cta-button:hover, .cta-button:focus-visible{
    background:var(--gold);
  }

  .disclosure-box{
    margin:1.6rem 0;
    padding:1rem 1.3rem;
    background:var(--paper-deep);
    border:1px solid var(--rule);
    border-radius:2px;
    font-size:1rem;
    color:var(--ink-soft);
    line-height:1.6;
  }

  /* ---------- shopify-style product grid ---------- */

  .product-grid{
    display:grid;
    grid-template-columns:repeat(auto-fill, minmax(200px, 1fr));
    gap:1.6rem;
    margin:1.8rem 0 2rem;
  }

  .product-card{
    background:#fff;
    border:1px solid var(--rule);
    border-radius:4px;
    overflow:hidden;
    display:flex;
    flex-direction:column;
    transition:box-shadow 0.15s ease, transform 0.15s ease;
  }
  .product-card:hover{
    box-shadow:0 6px 18px rgba(42,35,24,0.12);
    transform:translateY(-2px);
  }

  .product-img{
    background:#f2ede1;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:1.1rem;
    aspect-ratio:3/4;
  }
  .product-img img{
    max-width:100%;
    max-height:100%;
    object-fit:contain;
    box-shadow:0 3px 10px rgba(42,35,24,0.18);
  }

  .product-info{
    padding:1rem 1.1rem 1.3rem;
    display:flex;
    flex-direction:column;
    flex:1;
    font-family:'Spectral', serif;
  }

  .product-info h4{
    font-family:'IM Fell English', serif;
    font-style:italic;
    font-weight:400;
    font-size:1.05rem;
    line-height:1.35;
    margin:0 0 0.4rem;
    color:var(--ink);
  }

  .product-price{
    font-family:'Cutive Mono', monospace;
    font-size:0.85rem;
    color:var(--gold);
    margin:0 0 0.6rem;
    letter-spacing:0.02em;
  }

  .product-blurb{
    font-size:0.88rem;
    line-height:1.55;
    color:var(--ink-soft);
    margin:0 0 1rem;
    flex:1;
  }

  .product-cta{
    display:block;
    text-align:center;
    font-family:'IM Fell English SC', serif;
    font-size:0.78rem;
    letter-spacing:0.08em;
    text-transform:uppercase;
    color:#fff;
    background:var(--ink);
    padding:0.65rem 0.8rem;
    border-radius:3px;
    text-decoration:none;
    transition:background 0.15s ease;
  }
  .product-cta:hover, .product-cta:focus-visible{
    background:var(--rust);
  }

  .price-note{
    font-size:0.85rem;
    color:var(--ink-soft);
    opacity:0.85;
    margin:-0.6rem 0 1.6rem;
  }

  .ku-banner{
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    justify-content:space-between;
    gap:1rem;
    background:var(--ink);
    color:var(--paper);
    padding:1.1rem 1.4rem;
    border-radius:4px;
    margin:0 0 2rem;
  }
  .ku-banner .ku-text{
    font-family:'IM Fell English', serif;
    font-style:italic;
    font-size:1.05rem;
    line-height:1.5;
  }
  .ku-banner .ku-text strong{
    font-style:normal;
    color:#f0d99a;
  }
  .ku-banner .ku-logo{
    height:26px;
    width:auto;
    display:block;
    margin-bottom:0.5rem;
  }
  .ku-banner .cta-button{
    flex-shrink:0;
    background:var(--gold);
    color:var(--ink);
  }
  .ku-banner .cta-button:hover, .ku-banner .cta-button:focus-visible{
    background:#f0d99a;
  }

  /* ---------- portrait ---------- */

  .portrait-figure{
    float:right;
    width:180px;
    margin:0 0 1.2rem 1.8rem;
    text-align:center;
  }
  .portrait-figure img{
    width:100%;
    display:block;
    border:6px solid #fff;
    outline:1px solid var(--rule);
    box-shadow:0 4px 14px rgba(42,35,24,0.22);
    filter:sepia(18%) contrast(1.02);
  }
  .portrait-figure figcaption{
    margin-top:0.6rem;
    font-family:'Cutive Mono', monospace;
    font-size:0.68rem;
    letter-spacing:0.04em;
    color:var(--ink-soft);
    opacity:0.8;
    line-height:1.5;
  }
  @media (max-width:560px){
    .portrait-figure{ float:none; width:150px; margin:0 auto 1.4rem; }
  }

  /* ---------- homepage hero portrait ---------- */

  .hero-portrait{
    width:170px;
    margin:0 auto 1.6rem;
    text-align:center;
  }
  .hero-portrait img{
    width:100%;
    display:block;
    border:6px solid #fff;
    outline:1px solid var(--rule);
    box-shadow:0 4px 14px rgba(42,35,24,0.22);
    filter:sepia(18%) contrast(1.02);
  }

  /* ---------- archive corner (Plain Talk Series flavor pages) ---------- */

  .archive-crumb{
    font-family:'Cutive Mono', monospace;
    font-size:0.75rem;
    letter-spacing:0.04em;
    color:var(--ink-soft);
    opacity:0.85;
    margin:0 0 1.8rem;
  }
  .archive-crumb a{ color:var(--rust); text-decoration:none; }
  .archive-crumb a:hover{ text-decoration:underline; }

  .archive-layout{
    display:grid;
    grid-template-columns:1fr 260px;
    gap:2.4rem;
    align-items:start;
  }
  @media (max-width:720px){
    .archive-layout{ grid-template-columns:1fr; }
  }

  .archive-main h1{
    font-family:'IM Fell English', serif;
    font-weight:400;
    font-size:2rem;
    color:var(--ink);
    margin:0 0 1.4rem;
  }

  .archive-cover{
    width:180px;
    margin:0 0 1.6rem;
    border:1px solid var(--rule);
    background:var(--paper-deep);
    aspect-ratio:2/3;
    display:flex;
    align-items:center;
    justify-content:center;
    overflow:hidden;
  }
  .archive-cover img{ width:100%; height:100%; object-fit:cover; }

  .archive-player{
    background:var(--paper-deep);
    border:1px solid var(--rule);
    border-radius:3px;
    padding:1rem 1.2rem;
    margin-bottom:1.8rem;
    font-family:'Cutive Mono', monospace;
    font-size:0.8rem;
    color:var(--ink-soft);
  }
  .archive-player audio{ width:100%; margin-top:0.6rem; }

  .archive-placeholder-note{
    font-style:italic;
    color:var(--ink-soft);
    font-size:0.95rem;
    padding:1rem 0;
    border-top:1px dashed var(--rule);
    border-bottom:1px dashed var(--rule);
    margin:1.6rem 0;
  }

  .archive-tags{
    margin-top:2rem;
    font-family:'Cutive Mono', monospace;
    font-size:0.72rem;
    color:var(--ink-soft);
    opacity:0.85;
  }

  .archive-widget{
    background:var(--paper-deep);
    border:1px solid var(--rule);
    border-radius:3px;
    padding:1.2rem 1.3rem;
    margin-bottom:1.6rem;
  }
  .archive-widget h4{
    font-family:'IM Fell English SC', serif;
    font-size:0.82rem;
    letter-spacing:0.08em;
    text-transform:uppercase;
    color:var(--rust);
    margin:0 0 0.8rem;
  }
  .archive-widget ul{
    list-style:none;
    margin:0;
    padding:0;
  }
  .archive-widget li{
    font-size:0.86rem;
    padding:0.32rem 0;
    border-bottom:1px solid var(--rule);
  }
  .archive-widget li:last-child{ border-bottom:none; }
  .archive-widget a{
    color:var(--ink);
    text-decoration:none;
  }
  .archive-widget a:hover{ color:var(--rust); }
  .archive-widget .current{
    color:var(--rust);
    font-style:italic;
  }
  .archive-widget .missing{
    color:var(--ink-soft);
    opacity:0.55;
    font-style:italic;
  }

  .archive-searchterms{
    display:flex;
    flex-wrap:wrap;
    gap:0.4rem;
  }
  .archive-searchterms span{
    font-family:'Cutive Mono', monospace;
    font-size:0.7rem;
    color:var(--ink-soft);
    background:var(--paper);
    border:1px solid var(--rule);
    border-radius:2px;
    padding:0.25rem 0.5rem;
  }

  /* ---------- compact site header (sub-pages) ---------- */

  .site-header{
    max-width:720px;
    margin:0 auto;
    padding:2.4rem 2.2rem 0;
    text-align:center;
  }

  .site-brand{
    display:inline-flex;
    flex-direction:column;
    align-items:center;
    text-decoration:none;
    margin-bottom:2rem;
  }
  .site-brand .brand-eyebrow{
    font-family:'IM Fell English', serif;
    font-style:italic;
    font-size:0.85rem;
    color:var(--ink-soft);
    margin-bottom:0.3rem;
  }
  .site-brand .brand-title{
    font-family:'IM Fell English', serif;
    font-size:2.1rem;
    color:var(--ink);
    letter-spacing:0.01em;
  }
  .site-brand:hover .brand-title{ color:var(--rust); }

  .lang-switch{
    display:flex;
    justify-content:center;
    gap:0.4rem;
    margin:0.9rem 0 1.8rem;
  }
  .lang-btn{
    font-family:'Cutive Mono', monospace;
    font-size:0.68rem;
    letter-spacing:0.06em;
    text-decoration:none;
    color:var(--ink-soft);
    border:1px solid var(--rule);
    border-radius:2px;
    padding:0.25rem 0.55rem;
    transition:color 0.15s ease, border-color 0.15s ease;
  }
  .lang-btn:hover{ color:var(--rust); border-color:var(--rust); }
  .lang-btn.is-active{
    color:var(--paper);
    background:var(--rust);
    border-color:var(--rust);
  }

  /* ---------- homepage section cards ---------- */

  .home-grid{
    display:grid;
    grid-template-columns:repeat(auto-fit, minmax(260px, 1fr));
    gap:1.6rem;
    margin:2.5rem 0;
  }

  .home-card{
    display:block;
    text-decoration:none;
    background:var(--paper-deep);
    border:1px solid var(--rule);
    border-radius:3px;
    padding:1.6rem 1.7rem;
    transition:box-shadow 0.15s ease, transform 0.15s ease;
  }
  .home-card:hover{
    box-shadow:0 6px 18px rgba(42,35,24,0.14);
    transform:translateY(-2px);
  }
  .home-card h3{
    font-family:'IM Fell English', serif;
    font-style:italic;
    font-weight:400;
    font-size:1.35rem;
    color:var(--rust);
    margin:0 0 0.6rem;
  }
  .home-card p{
    font-size:0.98rem;
    color:var(--ink-soft);
    margin:0;
  }

  .succession{
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:0.4rem 0.7rem;
    margin:1.6rem 0 2rem;
    font-family:'Cutive Mono', monospace;
    font-size:0.85rem;
    color:var(--ink-soft);
  }
  .succession .who{
    padding:0.35rem 0.7rem;
    border:1px solid var(--rule);
    border-radius:2px;
    background:var(--paper-deep);
    color:var(--ink);
    white-space:nowrap;
  }
  .succession .arrow{ color:var(--gold); }

  /* ---------- footer ---------- */

  footer{
    margin-top:4.5rem;
    padding-top:1.8rem;
    border-top:1px solid var(--rule);
    text-align:center;
  }
  footer p{
    font-family:'Cutive Mono', monospace;
    font-size:0.72rem;
    letter-spacing:0.05em;
    color:var(--ink-soft);
    opacity:0.75;
    line-height:1.8;
    margin:0;
  }

  a.src-link{
    color:var(--rust);
    text-decoration:none;
    border-bottom:1px solid rgba(140,61,40,0.4);
    transition:border-color 0.15s ease, color 0.15s ease;
  }
  a.src-link:hover, a.src-link:focus-visible{
    color:var(--gold);
    border-bottom-color:var(--gold);
  }
  a.src-link:focus-visible{
    outline:2px solid var(--gold);
    outline-offset:2px;
    border-radius:1px;
  }
    .page{ padding:3.2rem 1.3rem 4rem; }
    .timeline{ padding-left:1.6rem; }
    .tl-item::before{ left:-1.6rem; }
  }