
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);font:17px/1.65 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif}
h1,h2,h3,.serif,.quote,.name{font-family:var(--head)}
a{color:var(--accent)}
.layout{display:grid;grid-template-columns:19rem 1fr;min-height:100vh}
.layout>*{min-width:0}
aside{position:sticky;top:0;height:100vh;padding:2.5rem 2rem;background:var(--side);color:var(--side-ink);border-right:1px solid var(--line);display:flex;flex-direction:column;overflow:auto}
aside .who img{width:96px;height:96px;border-radius:50%;object-fit:cover;margin-bottom:1rem;border:3px solid var(--ring)}
aside .name{font-size:1.45rem;font-weight:700;line-height:1.2}
aside .title{color:var(--side-muted);font-size:.9rem}
aside ol{list-style:none;padding:0;margin:2rem 0;counter-reset:s}
aside li{counter-increment:s}
aside li a{display:flex;gap:.8rem;padding:.42rem 0;color:var(--side-ink);text-decoration:none;font-size:.95rem}
aside li a:before{content:counter(s,decimal-leading-zero);color:var(--gold);font-variant-numeric:tabular-nums;font-size:.8rem;padding-top:.15rem}
aside li a:hover{color:var(--gold)}
aside .foot{margin-top:auto;font-size:.82rem;color:var(--side-muted)}
aside .brand{display:flex;align-items:center;gap:.5rem;font-weight:600;color:var(--side-ink);margin-bottom:.2rem}
aside .brand img{width:22px;height:22px;border-radius:5px}
main{padding:4rem clamp(1.25rem,5vw,5rem) 5rem;max-width:64rem}
.intro{padding-bottom:3rem;border-bottom:1px solid var(--line)}
.kicker{font-size:.8rem;letter-spacing:.16em;text-transform:uppercase;color:var(--gold);font-weight:600}
h1{font-size:clamp(2rem,4.2vw,3.1rem);line-height:1.15;margin:.7rem 0 1.2rem;font-weight:600}
.intro p{font-size:1.15rem;color:var(--muted);max-width:44rem;margin:0}
section{padding:3.5rem 0;border-bottom:1px solid var(--line)}
section.last{border-bottom:0}
.sh{display:flex;gap:1rem;align-items:baseline;margin-bottom:1.6rem}
.sh .n{color:var(--gold);font-size:.9rem;font-variant-numeric:tabular-nums}
h2{font-size:1.9rem;margin:0;font-weight:600}
.sh p{margin:0 0 0 auto;color:var(--muted);font-size:.9rem}
h3{font-size:1.25rem;margin:0 0 .3rem;font-weight:600}
h4{font-size:.78rem;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin:2.2rem 0 1rem}
.muted{color:var(--muted)}
.small{font-size:.88rem;color:var(--muted);margin-top:1rem}
.entry{display:grid;grid-template-columns:15rem 1fr;gap:1.75rem;padding:1.5rem 0;border-top:1px solid var(--line)}
.entry:first-of-type{border-top:0;padding-top:0}
.thumb{width:100%;aspect-ratio:4/3;object-fit:cover;object-position:top;border:1px solid var(--line);border-radius:var(--r);background:var(--paper)}
.entry p{margin:.2rem 0 .8rem;color:var(--muted)}
.meta{font-size:.78rem;letter-spacing:.08em;text-transform:uppercase;color:var(--gold);font-weight:600}
.meta.soon{color:#a24d12}
.act{display:flex;gap:1.2rem;flex-wrap:wrap;font-weight:600;font-size:.95rem}
.act a{text-decoration:none;border-bottom:2px solid var(--accent-soft)}
.act.big{margin-top:2rem}
.act.big a{border:0;background:var(--accent);color:#fff;padding:.7rem 1.2rem;border-radius:var(--r)}
.act.big a+a{background:transparent;color:var(--accent);box-shadow:inset 0 0 0 2px var(--accent)}
.feature{background:var(--paper);border:1px solid var(--line);border-radius:var(--r2);padding:1.75rem;display:grid;grid-template-columns:1.1fr 1fr;gap:2rem;align-items:start}
.shot{width:100%;border-radius:var(--r);border:1px solid var(--line)}
.steps{margin:0 0 1.2rem;padding-left:1.2rem;color:var(--muted)}
.quote{font-size:1.35rem;line-height:1.45;border-left:3px solid var(--gold);padding-left:1.1rem;margin:0 0 1rem}
.icons{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem}
.icon{display:flex;gap:1rem}
.icon img{width:64px;height:64px;border-radius:14px;flex:none;border:1px solid var(--line)}
.icon p{margin:.1rem 0 .5rem;color:var(--muted);font-size:.95rem}
.books{display:grid;grid-template-columns:1fr 1fr;gap:1.25rem}
.bk{display:grid;grid-template-columns:80px 1fr 84px;gap:1rem;align-items:start;background:var(--paper);border:1px solid var(--line);border-radius:var(--r2);padding:1rem}
.bk .cover{width:80px;border-radius:3px;box-shadow:0 4px 12px rgba(0,0,0,.2)}
.bk h3{font-size:1.02rem;line-height:1.3}
.bk p{margin:.1rem 0 .5rem;color:var(--muted);font-size:.86rem;line-height:1.4}
.bk .url{font-size:.82rem;color:var(--muted);overflow-wrap:anywhere}
.bk .url a{font-weight:600}
.bk .qr{width:84px;height:84px;border:1px solid var(--line);background:#fff}
.bk .appicon{width:80px;height:80px;border-radius:18px;border:1px solid var(--line)}
table{width:100%;border-collapse:collapse;font-size:.95rem}
th,td{text-align:left;padding:.7rem .5rem;border-bottom:1px solid var(--line);vertical-align:top}
th{font-size:.75rem;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);font-weight:600}
td.y{color:var(--muted);white-space:nowrap}
.pl{columns:2;padding:0;list-style:none;margin:1rem 0 0}
.pl li{padding:.3rem 0;break-inside:avoid}
.lead{font-size:1.12rem;margin:0}
.numbers{display:grid;grid-template-columns:repeat(5,1fr);gap:1rem;margin:2rem 0 0}
.numbers div{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);padding:1rem}
.numbers b{display:block;font-family:var(--head);font-size:1.6rem;color:var(--accent);line-height:1.1}
.numbers span{font-size:.82rem;color:var(--muted)}
.timeline{border-left:2px solid var(--line);margin-left:.4rem}
.role{display:grid;grid-template-columns:8rem 1fr;gap:1rem;padding:0 0 1.5rem 1.5rem;position:relative}
.role:before{content:"";position:absolute;left:-7px;top:.45rem;width:12px;height:12px;border-radius:50%;background:var(--gold)}
.role .when{font-size:.88rem;color:var(--muted);font-variant-numeric:tabular-nums;padding-top:.15rem}
.role h3{font-size:1.1rem;margin:0}
.role .org{color:var(--accent);font-weight:600;font-size:.92rem}
.role p{margin:.3rem 0 0;color:var(--muted);font-size:.95rem}
.tf{display:grid;grid-template-columns:1fr 1.4fr;gap:2rem}
.fn,.tc{list-style:none;padding:0;margin:0}
.fn li{padding:.45rem 0;border-bottom:1px solid var(--line)}
.fn li:before{content:"▸ ";color:var(--gold)}
.tc li{padding:.45rem 0;border-bottom:1px solid var(--line);color:var(--muted);font-size:.93rem}
.tc b{display:block;color:var(--ink);font-size:.95rem}
footer{padding-top:2.5rem;color:var(--muted);font-size:.85rem}
.hero{display:none}
@media (max-width:60rem){
  .layout{grid-template-columns:1fr;min-height:0;align-content:start}
  aside{position:static;height:auto;border-right:0;border-bottom:1px solid var(--line);padding:1.5rem 1.25rem}
  aside .who{display:flex;align-items:center;gap:1rem}aside .who img{width:64px;height:64px;margin:0}
  aside ol{display:flex;gap:1rem;overflow:auto;margin:1rem 0 0;padding-bottom:.3rem}aside li a{white-space:nowrap}aside .foot{display:none}
  main{padding-top:2.5rem}
  .entry,.feature,.tf{grid-template-columns:1fr}.thumb{max-width:26rem}
  .books,.icons{grid-template-columns:1fr}.sh p{display:none}
  .numbers{grid-template-columns:1fr 1fr}.role{grid-template-columns:1fr;gap:.2rem}
}
@media (max-width:30rem){.bk{grid-template-columns:64px 1fr}.bk .cover,.bk .appicon{width:64px}.bk .appicon{height:64px;border-radius:14px}.bk .qr{grid-column:2;width:76px;height:76px}.pl{columns:1}}

body{--head:"Iowan Old Style","Palatino Linotype",Palatino,Georgia,serif}
body.navy{--bg:#ffffff;--paper:#f7f8fb;--ink:#151b2b;--muted:#5a6275;--line:#e3e6ee;--accent:#13294b;--accent-soft:#dfe5f0;--gold:#c08a1e;--side:#13294b;--side-ink:#f2f4f9;--side-muted:#aeb8cf;--ring:#c08a1e;--r:8px;--r2:12px}
body.navy aside{border-right:0}
body.teal{--bg:#f6f5f2;--paper:#fff;--ink:#1d2321;--muted:#5f6763;--line:#e2e0d9;--accent:#0f5e59;--accent-soft:#d8ebe8;--gold:#b5542d;--side:#f6f5f2;--side-ink:#1d2321;--side-muted:#5f6763;--ring:#d8ebe8;--r:10px;--r2:14px}
body.teal .hero{display:block;background:#0f2e2c;color:#eef5f3}
.hero .in{max-width:84rem;margin:0 auto;padding:3.5rem clamp(1.25rem,4vw,4rem);display:grid;grid-template-columns:auto 1fr;gap:3rem;align-items:center}
.hero img{width:220px;height:220px;border-radius:24px;object-fit:cover;border:4px solid rgba(255,255,255,.15)}
.hero .kicker{color:#f0a37f}.hero h1{color:#fff;margin:.5rem 0 .8rem}
.hero p{color:#c7d8d4;font-size:1.1rem;max-width:46rem;margin:0}
.hero .strip{display:flex;flex-wrap:wrap;gap:.6rem;margin-top:1.4rem}
.hero .strip span{font-size:.82rem;border:1px solid rgba(255,255,255,.22);border-radius:999px;padding:.25rem .75rem}
body.teal aside{padding-top:2rem}
body.teal aside .who,body.teal .intro{display:none}
.switch{position:fixed;top:.9rem;right:.9rem;z-index:20;display:flex;align-items:center;gap:.25rem;background:rgba(255,255,255,.95);border:1px solid #d6d9e0;border-radius:999px;padding:.25rem;box-shadow:0 4px 14px rgba(0,0,0,.12);font:600 .8rem system-ui,-apple-system,sans-serif}
.switch span{color:#5a6275;padding:0 .4rem 0 .6rem}
.switch button{font:inherit;border:0;border-radius:999px;padding:.35rem .8rem;cursor:pointer;background:transparent;color:#151b2b;display:flex;align-items:center;gap:.4rem}
.switch button:before{content:"";width:.7rem;height:.7rem;border-radius:50%;background:var(--dot)}
.switch button[data-style=teal]{--dot:#0f5e59}.switch button[data-style=navy]{--dot:#13294b}
.switch button[aria-pressed=true]{background:#151b2b;color:#fff}
.switch button:focus-visible{outline:2px solid #c08a1e;outline-offset:2px}
@media (max-width:60rem){.switch{top:auto;bottom:.9rem}.hero .in{grid-template-columns:1fr;gap:1.2rem;padding:2rem 1.25rem}.hero img{width:110px;height:110px;border-radius:18px}body.teal aside .who{display:none}}

.to-top,.chat-toggle{position:fixed;right:1.25rem;z-index:30;font:600 .9rem system-ui,-apple-system,sans-serif;border:0;cursor:pointer;box-shadow:0 6px 18px rgba(0,0,0,.18)}
.to-top{bottom:5.4rem;min-height:3rem;background:#fff;color:var(--accent);border:2px solid var(--accent);border-radius:999px;padding:.6rem 1.2rem;font-size:1rem;font-weight:700;display:flex;align-items:center;gap:.4rem}
.to-top span{font-size:1.2rem;line-height:1}
.to-top:hover{background:var(--accent);color:#fff}
.to-top[hidden]{display:none}
.chat-toggle{bottom:1.25rem;background:var(--accent);color:#fff;border-radius:999px;padding:.7rem 1.1rem;display:flex;align-items:center;gap:.5rem}
.chat-toggle .short{display:none}
.chat-toggle .q{display:inline-grid;place-items:center;width:1.4rem;height:1.4rem;border-radius:50%;background:rgba(255,255,255,.2);font-weight:700}
.to-top:focus-visible,.chat-toggle:focus-visible,.chat button:focus-visible,.chat input:focus-visible{outline:3px solid var(--gold);outline-offset:2px}
body.chat-open .chat-toggle,body.chat-open .to-top{display:none}
.chat{padding:0;position:fixed;right:1.25rem;bottom:1.25rem;z-index:40;width:23rem;max-width:calc(100vw - 2rem);height:min(36rem,calc(100vh - 6rem));background:var(--paper);color:var(--ink);border:1px solid var(--line);border-radius:var(--r2);box-shadow:0 18px 50px rgba(0,0,0,.25);display:flex;flex-direction:column;overflow:hidden;font-size:.95rem}
.chat[hidden]{display:none}
.chat header{display:flex;justify-content:space-between;align-items:center;padding:.8rem 1rem;background:var(--accent);color:#fff}
.chat header button{background:transparent;border:0;color:#fff;font-size:1.5rem;line-height:1;cursor:pointer}
.chat-messages{flex:1;overflow-y:auto;padding:1rem;display:flex;flex-direction:column;gap:.6rem;background:var(--bg)}
.msg{margin:0;padding:.6rem .8rem;border-radius:12px;max-width:88%;line-height:1.45}
.msg.bot{background:var(--paper);border:1px solid var(--line);align-self:flex-start}
.msg.you{background:var(--accent);color:#fff;align-self:flex-end}
.chips{display:flex;flex-wrap:wrap;gap:.4rem}
.chips button{font:inherit;font-size:.85rem;text-align:left;background:var(--paper);color:var(--accent);border:1px solid var(--accent-soft);border-radius:999px;padding:.35rem .7rem;cursor:pointer}
.chat-input{display:flex;gap:.4rem;padding:.6rem;border-top:1px solid var(--line);background:var(--paper)}
.chat-input input{flex:1;min-width:0;font:inherit;padding:.55rem .7rem;border:1px solid var(--line);border-radius:8px;background:#fff;color:#151b2b}
.chat-input button{font:inherit;font-weight:600;background:var(--accent);color:#fff;border:0;border-radius:8px;padding:.55rem .9rem;cursor:pointer}
.chat-note{margin:0;padding:0 .8rem .6rem;font-size:.75rem;color:var(--muted);background:var(--paper)}
@media (max-width:60rem){
  .switch{right:auto;left:.9rem}
  .chat-toggle{right:.9rem;bottom:.9rem}
  .to-top{right:.9rem;bottom:4.9rem}
  .chat{left:.5rem;right:.5rem;bottom:.5rem;width:auto;max-width:none;height:min(80vh,40rem)}
}
@media (max-width:30rem){.chat-toggle .long{display:none}.chat-toggle .short{display:inline}}
main{padding-bottom:9rem}  /* room so the floating Top and Ask buttons never cover the footer */
@media (prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}

.mbar,.mmenu{display:none}
@media (max-width:60rem){
  aside,.switch{display:none !important}
  .mbar{display:flex;position:sticky;top:0;z-index:36;align-items:center;justify-content:space-between;gap:.75rem;height:3.4rem;padding:0 .9rem;color:#fff;box-shadow:0 2px 10px rgba(0,0,0,.18)}
  body.teal .mbar{background:#0f2e2c}
  body.navy .mbar{background:#13294b}
  .mname{display:flex;align-items:center;gap:.6rem;color:#fff;text-decoration:none;font-family:var(--head);font-weight:700;font-size:1.05rem;min-width:0}
  .mname img{width:32px;height:32px;border-radius:50%;object-fit:cover;flex:none;border:2px solid rgba(255,255,255,.35)}
  .mname span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  #menu-btn{font:700 .95rem system-ui,-apple-system,sans-serif;color:#fff;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.4);border-radius:999px;padding:.5rem 1rem;min-height:2.6rem;cursor:pointer}
  .mmenu:not([hidden]){display:block;position:fixed;top:3.4rem;left:0;right:0;bottom:0;z-index:35;overflow-y:auto;background:var(--paper);border-top:1px solid var(--line)}
  .mmenu ol{list-style:none;margin:0;padding:.4rem 0}
  .mmenu a{display:flex;gap:1rem;align-items:baseline;padding:1rem 1.4rem;font-size:1.15rem;color:var(--ink);text-decoration:none;border-bottom:1px solid var(--line)}
  .mmenu a span{color:var(--gold);font-size:.85rem;font-variant-numeric:tabular-nums;min-width:1.4rem}
  .mstyle{display:flex;align-items:center;gap:.5rem;padding:1.2rem 1.4rem;font-weight:600;color:var(--muted)}
  .mstyle button{font:inherit;border:1px solid var(--line);background:#fff;color:#151b2b;border-radius:999px;padding:.55rem 1.1rem;cursor:pointer}
  .mstyle button[aria-pressed=true]{background:#151b2b;color:#fff;border-color:#151b2b}
  body.menu-open .to-top,body.menu-open .chat-toggle{display:none}
  section{scroll-margin-top:4rem}
  section{padding:2.25rem 0}
  h2{font-size:1.5rem}
  .sh{gap:.6rem;margin-bottom:1.1rem}
  .bk .qr{display:none}
  .bk{grid-template-columns:72px 1fr}
  main{padding-top:1.5rem}
}
