@media (min-width:900px){
 html.screen-mode #preface{padding:12px 0;overflow:visible;box-sizing:border-box}
 html.screen-mode #preface .preface-layout{height:100%;min-height:0;grid-template-columns:minmax(180px,.65fr) minmax(0,1.65fr);gap:clamp(20px,3vw,64px);align-items:start}
 html.screen-mode #preface .preface-portrait{position:relative;top:auto;height:100%;max-height:100%;margin:0;min-height:0}
 html.screen-mode #preface .preface-portrait img{height:100%;width:100%;object-fit:contain;object-position:center top}
 html.screen-mode #preface .preface-copy{--preface-fit:1;min-height:0;max-height:none;display:block}
 html.screen-mode #preface .preface-copy>.eyebrow{font-size:calc(10px * var(--preface-fit));line-height:1.2}
 html.screen-mode #preface .preface-copy>h2{font-size:calc(clamp(26px,2.6vw,52px) * var(--preface-fit));line-height:1.1;margin:calc(7px * var(--preface-fit)) 0 calc(12px * var(--preface-fit));max-width:none}
 html.screen-mode #preface .preface-copy>p{font-size:calc(clamp(14px,1vw,22px) * var(--preface-fit));line-height:1.42;margin:0 0 calc(10px * var(--preface-fit));max-width:none}
 html.screen-mode #preface .preface-copy>.preface-lead{font-size:calc(clamp(15px,1.15vw,25px) * var(--preface-fit));line-height:1.4}
 html.screen-mode #preface .preface-copy>.preface-sharing{padding-inline-start:calc(12px * var(--preface-fit));margin-top:0}
 html.screen-mode #preface .preface-copy>.preface-feedback{padding:calc(9px * var(--preface-fit));overflow-wrap:anywhere}
 html.screen-mode #preface .preface-copy>.preface-signature{font-size:calc(clamp(15px,1.15vw,24px) * var(--preface-fit));line-height:1.25;margin:0}
 html.screen-mode #preface .preface-signature span{font-size:calc(clamp(12px,.85vw,18px) * var(--preface-fit));line-height:1.3;margin-top:calc(4px * var(--preface-fit))}
}
