/* Approved product trip-notes composition. The native/enhanced form moves this
   whole server-rendered section intact; no layout script or commerce state. */
#tss-trip-notes {
  --tn-ink:#101010; --tn-paper:#fff9e8; --tn-yellow:#ffd633;
  --tn-muted:#505b49; --tn-line:#bfc7ae;
  display:block; position:relative; width:100%; max-width:1320px; min-width:0;
  grid-column:1/-1; clear:both; margin:36px auto 28px; padding:40px 0 32px;
  border:0; background:transparent; color:var(--tn-ink);
  font-family:'Instrument Sans',Arial,sans-serif; font-size:16px; line-height:1.45;
  text-align:left; isolation:isolate; box-sizing:border-box;
}
#tss-trip-notes *, #tss-trip-notes *::before, #tss-trip-notes *::after { box-sizing:border-box; }
#tss-trip-notes h2, #tss-trip-notes h3, #tss-trip-notes p { margin:0; color:inherit; font-family:inherit; text-transform:none; }
#tss-trip-notes a { color:inherit; text-decoration:none; -webkit-tap-highlight-color:transparent; }
#tss-trip-notes a:focus-visible { outline:3px solid #007c78; outline-offset:5px; }
#tss-trip-notes .tn-help { display:grid; grid-template-columns:1fr 1fr; gap:clamp(32px,6vw,90px); align-items:start; }
#tss-trip-notes .tn-intro h2 { font-size:clamp(40px,5.5vw,78px); font-weight:780; letter-spacing:-.065em; line-height:1.02; }
#tss-trip-notes .tn-intro p { font-size:clamp(18px,1.8vw,24px); line-height:1.4; margin-top:23px; letter-spacing:-.025em; color:var(--tn-muted); }
#tss-trip-notes .tn-help-links { display:block; margin:0; padding:0; }
#tss-trip-notes .tn-help-link { display:grid; grid-template-columns:minmax(0,1fr) 28px; gap:16px; padding:19px 0 21px; min-height:64px; border-bottom:1px solid var(--tn-line); background:none; }
#tss-trip-notes .tn-help-link:first-child { padding-top:0; }
#tss-trip-notes .tn-help-link:last-child { border-bottom:0; padding-bottom:0; }
#tss-trip-notes .tn-help-link strong { display:block; font-size:23px; letter-spacing:-.035em; font-weight:720; line-height:1.2; }
#tss-trip-notes .tn-help-copy { display:block; color:var(--tn-muted); font-size:17px; line-height:1.5; margin-top:6px; max-width:490px; }
#tss-trip-notes .tn-wifi-fallback { display:block; margin-top:5px; color:var(--tn-muted); font-size:14px; line-height:1.45; max-width:490px; }
#tss-trip-notes .tn-arrow { font-size:29px; line-height:1.2; align-self:center; justify-self:end; }
#tss-trip-notes .tn-help-link:hover strong { text-decoration:underline; text-decoration-thickness:1px; text-underline-offset:4px; }
#tss-trip-notes .tn-help-link:active { transform:translate(1px,1px); }
#tss-trip-notes .tn-thread { height:63px; position:relative; margin:10px 9px 8px 32px; pointer-events:none; }
#tss-trip-notes .tn-thread::before { content:''; position:absolute; left:0; right:0; top:30px; height:26px; border:1.5px solid var(--tn-ink); border-left:0; border-bottom:0; border-radius:0 26px 0 0; }
#tss-trip-notes .tn-thread::after { content:''; position:absolute; left:-17px; top:4px; width:19px; height:27px; border-bottom:1.5px solid var(--tn-ink); border-left:1.5px solid var(--tn-ink); border-bottom-left-radius:20px; }
#tss-trip-notes .tn-thread i { position:absolute; width:13px; height:13px; border:2px solid var(--tn-ink); border-radius:50%; background:var(--tn-yellow); z-index:1; }
#tss-trip-notes .tn-thread i:first-child { left:-23px; top:0; }
#tss-trip-notes .tn-thread i:last-child { right:-6px; top:50px; }
#tss-trip-notes .tn-reading h2 { font-size:clamp(28px,3vw,39px); line-height:1.1; letter-spacing:-.05em; font-weight:760; margin-bottom:26px; }
#tss-trip-notes .tn-reading-label { font-size:12px; line-height:1.3; letter-spacing:.035em; font-weight:700; color:var(--tn-muted); text-transform:uppercase; display:block; margin-bottom:8px; }
#tss-trip-notes .tn-shelf { position:relative; display:grid; grid-template-columns:1.5fr 1fr 1fr .83fr; gap:20px; align-items:end; padding:0 15px 22px; margin:0; border:0; }
#tss-trip-notes .tn-shelf::before { content:''; position:absolute; z-index:-1; left:-5px; right:0; bottom:24px; top:10px; background:#dce2c9; clip-path:polygon(0 9%,98.5% 0,100% 100%,0 100%); }
#tss-trip-notes .tn-shelf::after { content:''; position:absolute; z-index:-1; bottom:7px; left:-7px; right:-7px; height:21px; background:#f7edce; border:1px solid #e5d9b8; box-shadow:0 4px 5px #625d4320; }
#tss-trip-notes .tn-shelf[data-has-notes=false] { grid-template-columns:1.4fr 1fr 1fr; }
#tss-trip-notes .tn-shelf[data-guide-count='2'] { grid-template-columns:1.35fr 1fr; }
#tss-trip-notes .tn-shelf[data-guide-count='2'][data-has-notes=true] { grid-template-columns:1.4fr 1fr .85fr; }
#tss-trip-notes .tn-shelf[data-guide-count='1'] { grid-template-columns:minmax(0,1fr); max-width:650px; }
#tss-trip-notes .tn-shelf[data-guide-count='1'][data-has-notes=true] { grid-template-columns:1.4fr 1fr; max-width:900px; }
#tss-trip-notes .tn-shelf[data-guide-count='0'] { grid-template-columns:1fr; max-width:480px; }
#tss-trip-notes .tn-book { position:relative; z-index:0; display:flex; flex-direction:column; min-width:0; min-height:365px; padding:22px 20px 10px; background:var(--tn-paper); border:1px solid #e7dfc4; border-radius:0; box-shadow:3px 4px 0 #a0a2863d; transition:box-shadow 140ms ease,transform 140ms ease; }
#tss-trip-notes .tn-book h3 { display:block; font-size:clamp(21px,2.1vw,29px); font-weight:750; letter-spacing:-.045em; line-height:1.08; overflow-wrap:anywhere; }
#tss-trip-notes .tn-book--featured { min-height:382px; padding-left:32px; }
#tss-trip-notes .tn-book--featured::before { content:''; position:absolute; top:-1px; bottom:-1px; left:-1px; width:18px; background:var(--tn-yellow); border-left:1px solid #e6c22d; }
#tss-trip-notes .tn-book--featured h3 { font-size:clamp(25px,2.9vw,39px); max-width:310px; }
#tss-trip-notes .tn-book--data:not(.tn-book--featured) { background:#e8edd9; }
/* One lazy-loaded transparent asset, reused from cache. No inner paper tile,
   blend mode or background wash. Character bodies remain opaque cream. */
#tss-trip-notes .tn-art { display:block; position:relative; flex:none; width:185px; max-width:100%; aspect-ratio:1; overflow:hidden; margin:auto; }
#tss-trip-notes .tn-art img { display:block; position:absolute; width:200%; height:200%; max-width:none; max-height:none; left:0; top:0; margin:0; border:0; padding:0; background:none; border-radius:0; box-shadow:none; object-fit:fill; }
#tss-trip-notes .tn-art--data img { left:-100%; }
#tss-trip-notes .tn-art--photos img { top:-100%; }
#tss-trip-notes .tn-art--notes img { left:-100%; top:-100%; }
#tss-trip-notes .tn-book--featured .tn-art { width:215px; }
#tss-trip-notes .tn-book-action { display:flex; gap:10px; align-items:center; justify-content:space-between; min-height:44px; font-size:16px; font-weight:720; letter-spacing:-.02em; margin-top:6px; }
#tss-trip-notes .tn-book-action > span:first-child { text-decoration:underline; text-decoration-thickness:1px; text-underline-offset:5px; }
#tss-trip-notes .tn-book-action > span:last-child { font-size:22px; text-decoration:none; }
#tss-trip-notes .tn-book:hover .tn-book-action > span:first-child { text-decoration-thickness:2px; }
#tss-trip-notes .tn-book:active { transform:translate(1px,1px); box-shadow:1px 1px 0 #a0a2863d; }
#tss-trip-notes .tn-notes { min-height:375px; transform:rotate(-1.2deg); padding:28px 21px 10px; background:#fffbee; }
#tss-trip-notes .tn-notes::before { content:''; position:absolute; right:0; top:0; border-top:27px solid var(--tn-ink); border-left:27px solid transparent; }
#tss-trip-notes .tn-notes::after { content:''; position:absolute; right:-12px; top:58px; width:12px; height:90px; background:var(--tn-yellow); clip-path:polygon(0 0,100% 7%,100% 95%,0 100%); z-index:-1; }
#tss-trip-notes .tn-notes h3 { font-size:23px; max-width:180px; }
#tss-trip-notes .tn-notes p { font-size:15px; line-height:1.4; color:var(--tn-muted); margin-top:12px; border-top:1px solid #909b80; padding-top:12px; }
#tss-trip-notes .tn-notes .tn-art { width:140px; margin:6px auto 0; }
#tss-trip-notes .tn-notes .tn-book-action { margin-top:auto; font-size:14px; }
#tss-trip-notes .tn-notes:active { transform:rotate(-1.2deg) translate(1px,1px); }
#tss-trip-notes .tn-decision { margin:28px 0 10px; padding:20px 0; border-block:1px solid var(--tn-line); }
#tss-trip-notes .tn-decision h3 { font-size:21px; line-height:1.25; font-weight:700; margin-bottom:8px; }
#tss-trip-notes .tn-decision p { font-size:16px; color:var(--tn-muted); max-width:75ch; }
#tss-trip-notes .tn-decision ul { display:flex; flex-wrap:wrap; gap:4px 20px; list-style:none; margin:8px 0 0; padding:0; }
#tss-trip-notes .tn-decision li { margin:0; padding:0; }
#tss-trip-notes .tn-decision a { display:inline-flex; align-items:center; min-height:44px; text-decoration:underline; text-underline-offset:4px; }
@media (max-width:1100px) {
  #tss-trip-notes .tn-help { gap:36px; }
  #tss-trip-notes .tn-intro h2 { font-size:clamp(42px,6vw,64px); }
  #tss-trip-notes .tn-help-link strong { font-size:20px; }
  #tss-trip-notes .tn-help-copy { font-size:16px; }
  #tss-trip-notes .tn-help-link { padding-top:15px; padding-bottom:15px; }
  #tss-trip-notes .tn-shelf { grid-template-columns:1.4fr 1fr 1fr; gap:16px; padding-left:8px; padding-right:8px; }
  #tss-trip-notes .tn-book { min-height:335px; padding:20px 16px 8px; }
  #tss-trip-notes .tn-book--featured { min-height:350px; padding-left:29px; }
  #tss-trip-notes .tn-book h3 { font-size:25px; }
  #tss-trip-notes .tn-book--featured h3 { font-size:32px; }
  #tss-trip-notes .tn-art, #tss-trip-notes .tn-book--featured .tn-art { width:160px; }
  #tss-trip-notes .tn-shelf[data-has-notes=true] { grid-template-columns:1.4fr 1fr 1fr; }
  #tss-trip-notes .tn-shelf[data-guide-count='2'] { grid-template-columns:1.35fr 1fr; }
  #tss-trip-notes .tn-shelf[data-guide-count='1'] { grid-template-columns:1fr; }
  #tss-trip-notes .tn-notes { grid-column:1/-1; min-height:0; transform:none; display:grid; grid-template-columns:1fr 1.2fr 110px auto; align-items:center; gap:16px; margin:8px -8px -4px; padding:20px 24px; }
  #tss-trip-notes .tn-notes h3 { font-size:22px; max-width:200px; }
  #tss-trip-notes .tn-notes p { margin:0; padding:0; border:0; font-size:15px; }
  #tss-trip-notes .tn-notes .tn-art { width:100px; margin:0; }
  #tss-trip-notes .tn-notes .tn-book-action { margin:0; font-size:15px; white-space:nowrap; }
  #tss-trip-notes .tn-notes::after { top:20px; height:44px; right:-8px; width:8px; }
  #tss-trip-notes .tn-notes:active { transform:translate(1px,1px); }
  #tss-trip-notes .tn-notes::before { border-top-width:20px; border-left-width:20px; }
  #tss-trip-notes .tn-shelf::after { display:none; }
  #tss-trip-notes .tn-shelf[data-has-notes=true]::before { bottom:158px; }
  #tss-trip-notes .tn-thread { margin-top:17px; }
}
@media (max-width:700px) {
  #tss-trip-notes { margin:20px auto; padding:25px 0 24px; }
  #tss-trip-notes .tn-help { grid-template-columns:1fr; gap:25px; }
  #tss-trip-notes .tn-intro h2 { font-size:clamp(37px,10.5vw,60px); line-height:1.02; letter-spacing:-.06em; }
  #tss-trip-notes .tn-intro p { margin-top:13px; font-size:18px; max-width:320px; }
  #tss-trip-notes .tn-help-link { padding:16px 0 17px; gap:15px; grid-template-columns:minmax(0,1fr) 25px; }
  #tss-trip-notes .tn-help-link:first-child { padding-top:0; }
  #tss-trip-notes .tn-help-link:last-child { padding-bottom:8px; }
  #tss-trip-notes .tn-help-link strong { font-size:20px; }
  #tss-trip-notes .tn-help-copy { font-size:16px; line-height:1.42; margin-top:6px; }
  #tss-trip-notes .tn-wifi-fallback { font-size:14px; }
  #tss-trip-notes .tn-arrow { font-size:26px; }
  #tss-trip-notes .tn-thread { height:36px; margin:7px 7px 10px 21px; }
  #tss-trip-notes .tn-thread::before { top:15px; height:16px; border-top-right-radius:18px; }
  #tss-trip-notes .tn-thread::after { top:0; height:16px; width:14px; left:-12px; }
  #tss-trip-notes .tn-thread i { height:10px; width:10px; }
  #tss-trip-notes .tn-thread i:first-child { left:-16px; top:-3px; }
  #tss-trip-notes .tn-thread i:last-child { right:-4px; top:26px; }
  #tss-trip-notes .tn-reading h2 { font-size:29px; margin-bottom:21px; }
  #tss-trip-notes .tn-reading-label { font-size:11px; margin-bottom:7px; }
  #tss-trip-notes .tn-shelf,
  #tss-trip-notes .tn-shelf[data-has-notes=false],
  #tss-trip-notes .tn-shelf[data-has-notes=true],
  #tss-trip-notes .tn-shelf[data-guide-count='2'] { grid-template-columns:1fr 1fr; gap:15px 12px; padding:0 5px; }
  #tss-trip-notes .tn-shelf[data-guide-count='1'] { grid-template-columns:1fr; }
  #tss-trip-notes .tn-shelf::before { inset:12px -3px 15px; clip-path:polygon(0 2%,98% 0,100% 100%,0 100%); }
  #tss-trip-notes .tn-shelf[data-has-notes=true]::before { bottom:150px; }
  #tss-trip-notes .tn-book { min-height:255px; padding:18px 12px 7px; box-shadow:2px 3px 0 #a0a28640; }
  #tss-trip-notes .tn-book--featured { grid-column:1/-1; min-height:245px; padding:23px 20px 7px 31px; display:grid; grid-template-columns:1fr 1fr; grid-template-rows:auto 1fr; column-gap:10px; }
  #tss-trip-notes .tn-book--featured::before { width:14px; }
  #tss-trip-notes .tn-book--featured h3 { grid-column:1/-1; grid-row:1; font-size:31px; max-width:none; align-self:start; }
  #tss-trip-notes .tn-art { width:130px; margin:auto; }
  #tss-trip-notes .tn-book--featured .tn-art { grid-column:2; grid-row:2; width:130px; justify-self:end; align-self:end; margin:0 -5px 0 0; }
  #tss-trip-notes .tn-book--featured .tn-book-action { grid-column:1; grid-row:2; align-self:end; font-size:16px; white-space:nowrap; gap:9px; }
  #tss-trip-notes .tn-book:not(.tn-book--featured):not(.tn-notes) h3 { font-size:21px; line-height:1.08; min-height:66px; }
  #tss-trip-notes .tn-book-action { font-size:14px; gap:7px; }
  #tss-trip-notes .tn-book-action > span:last-child { font-size:20px; }
  #tss-trip-notes .tn-notes { grid-column:1/-1; grid-template-columns:minmax(0,1fr) 100px; gap:0 8px; min-height:176px; margin:6px -2px 0; padding:20px 14px 12px 18px; }
  #tss-trip-notes .tn-notes h3 { font-size:22px; grid-column:1; max-width:none; }
  #tss-trip-notes .tn-notes p { font-size:15px; grid-column:1; line-height:1.4; margin-top:6px; }
  #tss-trip-notes .tn-notes .tn-art { grid-column:2; grid-row:1/4; width:100px; align-self:center; }
  #tss-trip-notes .tn-notes .tn-book-action { font-size:14px; grid-column:1; grid-row:3; min-height:44px; justify-content:flex-start; gap:12px; margin-top:8px; }
  #tss-trip-notes .tn-notes::after { height:51px; top:27px; }
  #tss-trip-notes .tn-shelf[data-guide-count='2'] .tn-book:not(.tn-notes):not(.tn-book--featured) { grid-column:1/-1; display:grid; grid-template-columns:1fr 1fr; gap:8px 16px; min-height:190px; }
  #tss-trip-notes .tn-shelf[data-guide-count='2'] .tn-book:not(.tn-notes):not(.tn-book--featured) h3 { grid-column:1; min-height:0; }
  #tss-trip-notes .tn-shelf[data-guide-count='2'] .tn-book:not(.tn-notes):not(.tn-book--featured) .tn-art { grid-column:2; grid-row:1/3; align-self:center; }
  #tss-trip-notes .tn-shelf[data-guide-count='2'] .tn-book:not(.tn-notes):not(.tn-book--featured) .tn-book-action { grid-column:1; align-self:end; }
}
@media (max-width:360px) {
  #tss-trip-notes .tn-intro h2 { font-size:37px; }
  #tss-trip-notes .tn-intro p { font-size:17px; }
  #tss-trip-notes .tn-book--featured { padding-left:26px; min-height:228px; }
  #tss-trip-notes .tn-book--featured h3 { font-size:29px; }
  #tss-trip-notes .tn-book:not(.tn-book--featured):not(.tn-notes) h3 { font-size:19px; min-height:60px; }
  #tss-trip-notes .tn-art { width:110px; }
  #tss-trip-notes .tn-book--featured .tn-art { width:115px; }
  #tss-trip-notes .tn-book { padding-left:10px; padding-right:10px; }
  #tss-trip-notes .tn-book-action { font-size:13px; }
  #tss-trip-notes .tn-book--featured .tn-book-action { font-size:14px; }
  #tss-trip-notes .tn-notes { grid-template-columns:minmax(0,1fr) 80px; }
  #tss-trip-notes .tn-notes .tn-art { width:80px; }
  #tss-trip-notes .tn-notes h3 { font-size:20px; }
  #tss-trip-notes .tn-notes p { font-size:14px; }
  #tss-trip-notes .tn-help-link strong { font-size:19px; }
}
@media (prefers-reduced-motion:reduce) {
  #tss-trip-notes .tn-book { transition:none; }
}