:root {
  --red:#c12b2c; --red-dark:#9e2122; --ink:#2a2622; --muted:#6b6258; --cream:#fbf7f1;
  --sea:#2f6f77; --sea-deep:#1e4a50; --gold:#be9a4f; --line:#e5d9c7;
  --font-head:"Fraunces",Georgia,serif; --font-body:"Inter",system-ui,-apple-system,"Segoe UI",sans-serif;
}
*,*::before,*::after{box-sizing:border-box}
html{min-height:100%;-webkit-text-size-adjust:100%}
body{min-width:320px;min-height:100%;margin:0;color:var(--ink);background:radial-gradient(circle at 12% 8%,rgba(190,154,79,.18),transparent 31rem),radial-gradient(circle at 90% 92%,rgba(47,111,119,.18),transparent 32rem),var(--cream);font-family:var(--font-body);-webkit-font-smoothing:antialiased}
body::before{position:fixed;inset:0;z-index:-1;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='64' height='64' viewBox='0 0 64 64'%3E%3Cpath d='M0 63.5h64M63.5 0v64' fill='none' stroke='%232a2622' stroke-opacity='.025'/%3E%3C/svg%3E");content:""}
a{color:inherit}
.skip{position:absolute;left:-9999px;top:0}
.skip:focus{left:12px;top:12px;z-index:100;border-radius:8px;padding:10px 14px;color:#fff;background:var(--ink)}
.bio-page{min-height:100vh;min-height:100svh;padding:max(30px,env(safe-area-inset-top)) 18px max(24px,env(safe-area-inset-bottom))}
.bio-shell{width:min(100%,560px);margin:0 auto}
.bio-profile{text-align:center}
.portrait-wrap{position:relative;width:116px;height:116px;margin:0 auto 17px}
.portrait{width:116px;height:116px;border:5px solid #fff;border-radius:50%;object-fit:cover;object-position:50% 24%;box-shadow:0 12px 34px rgba(42,38,34,.18)}
.portrait-ring{position:absolute;inset:-5px;border:1px solid rgba(190,154,79,.7);border-radius:50%}
.handle{margin:0 0 5px;color:var(--sea-deep);font-size:.74rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase}
h1{margin:0;font-family:var(--font-head);font-size:clamp(2.05rem,10vw,3.15rem);font-weight:560;line-height:1.08;letter-spacing:-.035em}
.intro{max-width:470px;margin:12px auto 24px;color:var(--muted);font-size:.98rem;line-height:1.55}
.bio-links{display:grid;gap:12px}
.link-card{display:grid;grid-template-columns:5px minmax(0,1fr) 22px;gap:17px;align-items:center;min-height:80px;border:1px solid rgba(229,217,199,.92);border-radius:20px;padding:13px 15px;background:rgba(255,255,255,.9);box-shadow:0 7px 22px rgba(42,38,34,.07);text-decoration:none;transition:transform .16s ease,box-shadow .16s ease,border-color .16s ease}
.link-card:hover{transform:translateY(-2px);border-color:rgba(47,111,119,.45);box-shadow:0 13px 30px rgba(42,38,34,.12)}
.link-card:focus-visible{outline:3px solid var(--sea);outline-offset:3px}
.link-card--book{grid-template-columns:66px minmax(0,1fr) 22px;min-height:116px;border:0;padding:7px 15px 7px 8px;color:#fff;background:linear-gradient(135deg,var(--red),var(--red-dark));box-shadow:0 14px 30px rgba(193,43,44,.24)}
.link-card--book:hover{border-color:transparent;box-shadow:0 18px 36px rgba(193,43,44,.31)}
.link-card--book img{width:66px;height:102px;border-radius:8px;object-fit:cover;box-shadow:0 5px 14px rgba(0,0,0,.24)}
.link-copy{display:flex;min-width:0;flex-direction:column;gap:2px}
.link-copy strong{font-size:1rem;line-height:1.25}
.link-copy>span:last-child{color:var(--muted);font-size:.78rem;line-height:1.35}
.link-card--book .link-copy>span:last-child{color:rgba(255,255,255,.8)}
.link-kicker{margin-bottom:2px;color:rgba(255,255,255,.72)!important;font-size:.64rem!important;font-weight:700;letter-spacing:.08em;text-transform:uppercase}
.card-accent{display:block;width:5px;height:46px;border-radius:999px}
.card-accent--sea{background:linear-gradient(180deg,var(--sea),var(--sea-deep))}
.card-accent--gold{background:linear-gradient(180deg,#d7bb7d,var(--gold))}
.arrow{width:20px;height:20px;fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:2;opacity:.6}
.signature{margin:23px 0 17px;color:var(--sea-deep);font-family:var(--font-head);font-size:1.16rem;font-style:italic;text-align:center}
.bio-footer{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;color:var(--muted);font-size:.7rem}
.bio-footer a{text-underline-offset:3px}.bio-footer a:hover{color:var(--red)}
@media(max-width:370px){.bio-page{padding-inline:12px}.portrait-wrap,.portrait{width:102px;height:102px}.link-card{gap:10px;padding-right:11px}.intro{font-size:.91rem}}
@media(min-width:700px) and (min-height:760px){.bio-page{display:grid;place-items:center;padding-block:40px}}
@media(prefers-reduced-motion:reduce){.link-card{transition:none}}