:root {
  --paper:#f4f0e7;
  --paper-light:#fbf8f1;
  --ink:#253b33;
  --muted:#59625b;
  --brick:#9e392d;
  --line:#c9c9bc;
  --forest:#253b33;
  --gold:#d7c496;
  --serif:Iowan Old Style, Palatino Linotype, Book Antiqua, Georgia, serif;
  --sans:Avenir Next, Avenir, Helvetica Neue, Helvetica, Arial, sans-serif;
}
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { min-height:100vh; display:flex; flex-direction:column; margin:0; background:var(--paper); color:var(--ink); font-family:var(--sans); line-height:1.6; }
a { color:inherit; }
.skip-link { position:fixed; z-index:5; top:-80px; left:16px; padding:14px 20px; background:var(--brick); color:var(--paper-light); font-weight:700; }
.skip-link:focus { top:16px; }
.tip-shell { width:min(1120px,calc(100% - 56px)); margin:0 auto; }
.tip-header { border-bottom:1px solid var(--line); }
.tip-header-inner { min-height:84px; display:flex; align-items:center; justify-content:space-between; gap:24px; }
.tip-brand img { display:block; width:auto; height:62px; }
.tip-home { color:var(--muted); font-size:11px; font-weight:700; letter-spacing:.06em; text-decoration:none; }
.tip-home:hover,.tip-home:focus-visible { color:var(--brick); }
main { flex:1; }
.tip-main { padding:clamp(62px,10vh,112px) 0 96px; }
.tip-kicker { margin:0 0 19px; color:var(--brick); font-size:10px; font-weight:700; letter-spacing:.12em; }
h1,h2 { margin:0; font-family:var(--serif); font-weight:400; letter-spacing:-.045em; line-height:1.08; }
h1 { max-width:18ch; font-size:clamp(46px,8vw,84px); }
.tip-summary { max-width:61ch; margin:23px 0 0; color:var(--muted); font:clamp(18px,2.2vw,23px)/1.65 var(--serif); }
.tip-meta { display:flex; flex-wrap:wrap; gap:10px; align-items:center; margin:19px 0 0; color:var(--muted); font-size:11px; }
.tip-date { font-variant-numeric:tabular-nums; }
.tip-rule { width:100%; height:1px; margin:34px 0 28px; background:var(--line); }
.tip-index { width:min(100%,790px); margin:0 0 42px; border-left:2px solid var(--gold); padding:0 0 0 20px; }
.tip-index[hidden] { display:none; }
.tip-index > p { margin:0 0 11px; color:var(--brick); font-size:10px; font-weight:700; letter-spacing:.1em; }
.tip-index ol { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px 24px; margin:0; padding:0; list-style:none; }
.tip-index li { min-width:0; }
.tip-index a { color:var(--ink); font-size:12px; text-decoration-thickness:1px; text-underline-offset:4px; }
.tip-index a:hover,.tip-index a:focus-visible { color:var(--brick); }
.tip-placeholder { width:min(100%,70ch); border-left:3px solid var(--gold); padding:5px 0 5px 20px; color:var(--muted); font-size:16px; }
.tip-placeholder p { margin:0; }
.tip-content[hidden],.tip-placeholder[hidden],.tip-error[hidden] { display:none; }
.tip-content { width:min(100%,760px); color:var(--ink); font:18px/1.85 var(--serif); }
.tip-section + .tip-section { margin-top:48px; border-top:1px solid var(--line); padding-top:34px; }
.tip-section h2,.tip-references h2 { max-width:24ch; margin:0 0 19px; font:400 clamp(27px,4vw,39px)/1.13 var(--serif); letter-spacing:-.035em; }
.tip-section-body > p { margin:0 0 1.2em; }
.tip-section-body > p:last-child { margin-bottom:0; }
.tip-section h3 { margin:28px 0 10px; font:700 13px/1.45 var(--sans); letter-spacing:.02em; }
.tip-list { margin:0 0 1.2em; padding-left:1.5em; }
.tip-list li { padding:0 0 9px 5px; }
.tip-list li::marker { color:var(--brick); }
.tip-callout { margin:27px 0; border-left:3px solid var(--gold); padding:9px 0 9px 22px; color:var(--forest); font:italic 20px/1.75 var(--serif); }
.tip-callout p { margin:0; }
.tip-example { margin:31px 0; border:1px solid var(--line); background:var(--paper-light); }
.tip-example-heading { padding:24px 27px 18px; background:#eeeadf; }
.tip-example-label { margin:0 0 8px; color:var(--brick); font:700 9px/1.4 var(--sans); letter-spacing:.11em; }
.tip-example-heading h3 { margin:0; font:400 clamp(24px,4vw,32px)/1.15 var(--serif); }
.tip-example-caption { margin:9px 0 0; color:var(--muted); font:11px/1.5 var(--sans); }
.tip-example-content { padding:21px 27px 25px; color:var(--ink); font:15px/1.75 var(--sans); }
.tip-example-content h3 { margin:20px 0 7px; font:700 12px/1.4 var(--sans); }
.tip-example-content h3:first-child { margin-top:0; }
.tip-example-content p { margin:0 0 12px; }
.tip-example-content .tip-list { margin-bottom:16px; }
.tip-related-links { display:flex; flex-wrap:wrap; gap:12px 25px; margin-top:20px; font:700 11px/1.5 var(--sans); }
.tip-related-link { color:var(--ink); text-underline-offset:4px; }
.tip-related-link:hover,.tip-related-link:focus-visible { color:var(--brick); }
.tip-references { margin-top:50px; border-top:1px solid var(--line); padding-top:30px; font:12px/1.7 var(--sans); }
.tip-references ol { padding-left:20px; }
.tip-references li + li { margin-top:12px; }
.tip-references a { text-underline-offset:3px; }
.tip-reference-note { margin:5px 0 0; color:var(--muted); }
.tip-error { width:min(100%,65ch); color:var(--muted); }
.tip-archive-invitation { margin-top:76px; border-top:1px solid var(--ink); padding-top:27px; }
.tip-archive-invitation .tip-kicker { margin-bottom:12px; }
.tip-archive-invitation h2 { max-width:18ch; font-size:clamp(33px,5vw,50px); }
.tip-archive-invitation > p:not(.tip-kicker) { max-width:55ch; margin:16px 0 0; color:var(--muted); font-size:14px; line-height:1.7; }
.tip-archive-link { display:inline-flex; gap:12px; margin-top:22px; border-bottom:1px solid var(--brick); padding-bottom:5px; font-size:11px; font-weight:700; letter-spacing:.04em; text-decoration:none; }
.tip-return { display:inline-flex; align-items:center; gap:12px; margin-top:40px; border:1px solid var(--forest); padding:13px 17px; background:var(--forest); color:var(--paper-light); font-size:10px; font-weight:700; letter-spacing:.05em; text-decoration:none; transition:background .18s ease,color .18s ease; }
.tip-return:hover,.tip-return:focus-visible { background:transparent; color:var(--forest); }
.tip-return span { color:var(--gold); font-size:17px; }
.tip-footer { padding:25px 0; background:var(--forest); color:#dce1d8; font-size:11px; }
.tip-footer-inner { display:flex; justify-content:space-between; gap:20px; }
.tip-footer a { color:var(--gold); font-weight:700; }
:focus-visible { outline:2px solid var(--brick); outline-offset:5px; }
@media (max-width:640px) {
  .tip-shell { width:calc(100% - 40px); }
  .tip-header-inner { min-height:72px; }
  .tip-brand img { height:51px; }
  .tip-home { font-size:10px; }
  .tip-main { padding:57px 0 75px; }
  h1 { font-size:clamp(43px,12vw,62px); }
  .tip-summary { font-size:18px; }
  .tip-index { margin-bottom:34px; }
  .tip-index ol { grid-template-columns:1fr; gap:9px; }
  .tip-content { font-size:16px; line-height:1.8; }
  .tip-section + .tip-section { margin-top:38px; padding-top:28px; }
  .tip-callout { font-size:18px; }
  .tip-example-heading { padding:20px 19px 15px; }
  .tip-example-content { padding:18px 19px 21px; }
  .tip-footer-inner { flex-direction:column; }
}
@media print {
  body { background:#fff; }
  .tip-header,.tip-index,.tip-archive-invitation,.tip-return,.tip-footer,.skip-link { display:none!important; }
  .tip-shell { width:100%; }
  .tip-main { padding:0; }
  .tip-section,.tip-example { break-inside:avoid; }
  a { text-decoration:none; }
}
