/* The guide reader (/read/<country>), 28 Sep 2026. Sits on top of styles.css for the tokens and the header. */
body.reader{background:var(--paper)}
.reader .site-header{max-width:1440px}
.reader .site-header nav a{display:inline}
.reader-back{display:inline-flex;align-items:center;gap:6px;font-size:14px;font-weight:600;color:var(--ink)}
.reader-back svg{width:13px;height:14px;color:var(--orange)}
.reader-main{max-width:760px;margin:0 auto;padding:0 18px 80px}
@media(min-width:721px){.reader-main{padding:0 24px 100px}}

/* states */
.reader-note{max-width:520px;margin:60px auto;text-align:center}
.reader-note h2{font-family:var(--display);font-size:30px;letter-spacing:-.6px;margin:12px 0 8px}
.reader-note p{color:var(--muted);font-size:15px;line-height:1.55;margin:0 0 18px}
.reader-note .primary-button{margin:8px auto 0;max-width:320px}
.reader-note form{display:grid;gap:10px;max-width:320px;margin:14px auto 0}
.reader-note input{font:inherit;font-size:16px;padding:12px 14px;border:1px solid var(--line);border-radius:8px;background:#fff}
.reader-note .form-note{font-size:13px;color:#8a5a1c;background:#fff3e6;border:1px solid #f5b784;border-radius:8px;padding:10px 12px}
.reader-note .text-button{font-size:13px;color:var(--muted);text-decoration:underline;margin-top:6px}
.reader-loading{display:flex;justify-content:center;padding:80px 0;color:var(--muted);font-size:15px}
.reader-loading::before{content:'';width:18px;height:18px;margin-right:10px;border:2px solid #d9ddd0;border-top-color:var(--orange);border-radius:50%;animation:reader-spin .8s linear infinite}
@keyframes reader-spin{to{transform:rotate(360deg)}}
.reader-preview{display:grid;grid-template-columns:1fr 1fr;gap:10px;max-width:420px;margin:18px auto 0}
.reader-preview img{width:100%;border-radius:8px;border:1px solid var(--line);box-shadow:0 6px 20px #0000000f}
.reader-preview figcaption{font-size:12px;color:var(--muted);margin-top:6px}

/* cover */
.guide-cover{position:relative;margin:18px 0 8px;border-radius:18px;overflow:hidden;background:#29362c;color:#fff;min-height:250px;display:flex;align-items:flex-end}
.guide-cover img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.guide-cover::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,#0000 30%,#000000b3 100%)}
.guide-cover .cover-text{position:relative;z-index:1;padding:24px 20px 20px}
.guide-cover .cover-kicker{display:block;font-size:11px;letter-spacing:1.8px;font-weight:700;color:#ffd9c7;margin-bottom:8px}
.guide-cover h1{font-family:var(--display);font-size:clamp(30px,6vw,46px);font-weight:700;letter-spacing:-1px;line-height:1.05;margin:0 0 8px}
.guide-cover .cover-by{font-size:14px;color:#f1f1e8;opacity:.92}
.guide-cover .cover-by b{font-weight:700}
.guide-cover .cover-credit{position:absolute;right:12px;top:10px;z-index:1;font-size:11px;color:#fff;opacity:.85;text-shadow:0 1px 3px #000c}
@media(min-width:721px){.guide-cover{min-height:340px;margin-top:26px}.guide-cover .cover-text{padding:32px 30px 26px}}
.guide-cover.plain{min-height:0;background:linear-gradient(135deg,#f9dcc9,#f7f7f2 70%);color:var(--ink)}
.guide-cover.plain::after{display:none}
.guide-cover.plain .cover-kicker{color:var(--orange-dark)}
.guide-cover.plain .cover-by{color:var(--muted)}
.guide-cover.plain .cover-flag{font-size:44px;line-height:1;display:block;margin-bottom:10px}

/* actions under the cover */
.guide-actions{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0 6px}
.guide-actions .plan-button{width:auto;margin:0;min-height:40px;padding:9px 13px;font-size:13px;gap:8px;white-space:nowrap}
.guide-actions .plan-button svg{width:13px;height:14px}
.guide-actions .plan-button.ghost{background:#fff;border:1px solid #dfe4d2;color:var(--ink)}
.guide-actions .plan-button.ghost:hover{border-color:var(--orange);color:var(--orange-dark)}
.guide-actions .busy{opacity:.6;pointer-events:none}
.guide-updated{font-size:13px;color:var(--muted);margin:2px 0 0}

/* chapter nav */
.chapter-nav{position:sticky;top:0;z-index:20;margin:14px -18px 10px;padding:8px 18px;background:#f7f7f2f0;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);border-bottom:1px solid var(--line);display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.chapter-nav::-webkit-scrollbar{display:none}
.chapter-nav a{flex:none;display:inline-flex;align-items:center;gap:6px;padding:7px 12px;border-radius:999px;border:1px solid var(--line);background:#fff;font-size:13px;font-weight:600;color:var(--ink);white-space:nowrap}
.chapter-nav a.active{background:var(--ink);color:#fff;border-color:var(--ink)}
@media(min-width:721px){.chapter-nav{margin:18px 0 14px;padding:10px 0;border-radius:0}}

/* the text */
.guide-body{font-size:16px;line-height:1.62;color:var(--ink)}
@media(min-width:721px){.guide-body{font-size:17px}}
.guide-body h1{font-family:var(--display);font-size:clamp(30px,5.5vw,40px);font-weight:700;letter-spacing:-.8px;line-height:1.08;margin:36px 0 12px;scroll-margin-top:70px}
.guide-body h1:first-child{display:none}   /* the title is on the cover */
.guide-body h2{font-size:22px;font-weight:750;letter-spacing:-.4px;line-height:1.2;margin:34px 0 10px;scroll-margin-top:70px}
.guide-body h3{font-size:18px;font-weight:700;margin:24px 0 8px;scroll-margin-top:70px}
.guide-body p{margin:0 0 12px}
.guide-body p.byline{display:none}
.guide-body ul,.guide-body ol{margin:0 0 14px;padding-left:22px}
.guide-body li{margin:0 0 8px}
.guide-body li::marker{color:var(--orange)}
.guide-body a{color:var(--orange-dark);font-weight:600;text-decoration:underline;text-decoration-color:#f0b8a0;text-underline-offset:3px}
.guide-body a:hover{text-decoration-color:var(--orange-dark)}
.guide-body a.pin{text-decoration:none;background:#fff3e6;border:1px solid #f5cdb5;border-radius:6px;padding:0 5px 1px;font-weight:650;-webkit-box-decoration-break:clone;box-decoration-break:clone}
.guide-body a.pin:hover{background:#ffe6d2}
.guide-body a.say{text-decoration:none;border-bottom:1px dashed #b7b5a6;font-weight:500;color:var(--ink)}
.guide-body a.say.speaking{background:#fff3e6;border-bottom-color:var(--orange)}
.guide-body a.jump{font-size:13px;font-weight:600;text-decoration:none;color:var(--muted)}
.guide-body hr{border:0;border-top:1px solid var(--line);margin:26px 0}
.guide-body .big{font-size:1.85em;line-height:1.3}
.guide-body mark,.guide-body .hl{background:#fff176;color:inherit;padding:0 3px;border-radius:3px}
.guide-body .callout{background:#fff3e6;border:1px solid #f5b784;border-radius:12px;padding:14px 16px;margin:14px 0 18px}
.guide-body .callout p{margin:0 0 6px}
.guide-body .callout p:last-child{margin-bottom:0}
.guide-body .contents{margin:0 0 14px}
.guide-body #contents{scroll-margin-top:70px}
.guide-body .contents a{display:block;padding:6px 0;border-bottom:1px solid #ecefe4;text-decoration:none;font-weight:600;color:var(--ink)}
.guide-body .contents a:hover{color:var(--orange-dark)}
.guide-body .city-line{display:flex;flex-wrap:wrap;gap:8px;margin:6px 0 10px}
.guide-body .city-line a{display:inline-flex;align-items:center;padding:6px 11px;border-radius:999px;border:1px solid var(--line);background:#fff;text-decoration:none;color:var(--ink);font-weight:600;font-size:14px}
.guide-body .city-line a:hover{border-color:var(--orange)}
.table-wrap{overflow-x:auto;margin:10px 0 18px;-webkit-overflow-scrolling:touch}
.guide-body table{border-collapse:collapse;width:100%;font-size:14px;line-height:1.45;min-width:420px}
.guide-body table.narrow{min-width:0}
.guide-body th,.guide-body td{border:1px solid #dcdfd3;padding:8px 9px;vertical-align:top;text-align:left}
.guide-body th{background:#fde6d2;font-weight:700}
.guide-body td p{margin:0 0 5px}
.guide-body td p:last-child{margin-bottom:0}
.guide-body td ul,.guide-body td ol{margin:0;padding-left:16px}
.guide-body .thanks{font-size:18px;font-weight:600;margin-top:30px}
.guide-body .section-end{height:1px}

@media(max-width:600px){
  .guide-body table.cards{min-width:0;border:0}
  .guide-body table.cards thead{display:none}
  .guide-body table.cards tr{display:block;border:1px solid #dcdfd3;border-radius:12px;background:#fff;margin:0 0 10px;padding:10px 12px}
  .guide-body table.cards td{display:block;border:0;padding:3px 0}
  .guide-body table.cards td:first-child{font-weight:750;font-size:15px;padding-bottom:6px;border-bottom:1px solid #eceee6;margin-bottom:4px}
  .guide-body table.cards td:not(:first-child)::before{content:attr(data-label);display:block;font-size:11px;letter-spacing:.6px;text-transform:uppercase;color:var(--muted);font-weight:700;margin:6px 0 1px}
  .guide-body table.cards td:first-child::before{display:none}
}
/* media */
.guide-media{margin:14px 0 22px}
.gallery{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}
@media(min-width:600px){.gallery{grid-template-columns:repeat(3,1fr)}}
@media(min-width:600px){.gallery.cols-4{grid-template-columns:repeat(4,1fr)}}
.gallery figure{margin:0;position:relative}
.gallery figure.wide{grid-column:span 2}
@media(max-width:599px){.gallery.row{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scrollbar-width:none;margin-right:-18px;padding-right:18px}.gallery.row::-webkit-scrollbar{display:none}.gallery.row figure{flex:0 0 43%;scroll-snap-align:start}}
.gallery img{width:100%;aspect-ratio:1/1;object-fit:cover;border-radius:12px;display:block;background:#e6e6de}
.gallery figure.wide img{aspect-ratio:16/10}
.gallery figcaption{font-size:12.5px;color:var(--muted);line-height:1.35;margin-top:6px}
.gallery figcaption b{color:var(--ink);font-weight:650}
.gallery .play{position:absolute;left:8px;top:8px;display:inline-flex;align-items:center;gap:5px;background:#000000a8;color:#fff;font-size:11px;font-weight:700;padding:5px 8px;border-radius:999px;border:0;cursor:pointer}
.gallery .play svg{width:9px;height:9px;fill:#fff}
.gallery .play:hover{background:var(--orange)}
.shorts-strip{display:flex;gap:10px;overflow-x:auto;padding:2px 0 8px;scrollbar-width:none}
.shorts-strip::-webkit-scrollbar{display:none}
.shorts-strip .short{flex:none;width:150px}
.shorts-strip button{display:block;width:100%;padding:0;border:0;background:none;text-align:left;cursor:pointer}
.shorts-strip .sp{display:block;font-size:12px;line-height:1.3;margin-top:2px;color:var(--muted)}
.shorts-strip .sp a{color:var(--orange-dark);font-weight:600;text-decoration:underline;text-underline-offset:2px}
.shorts-strip img{width:150px;height:267px;object-fit:cover;border-radius:12px;display:block;background:#e6e6de}
.shorts-strip .st{display:block;font-size:12.5px;font-weight:600;margin-top:6px;line-height:1.3;color:var(--ink)}
.shorts-strip .sv{display:block;font-size:11.5px;color:var(--muted)}
.media-head{display:flex;align-items:baseline;justify-content:space-between;gap:10px;margin:0 0 8px}
.media-head strong{font-size:14px}
.media-head span{font-size:12px;color:var(--muted)}
.single-photo{margin:0}
.single-photo img{width:100%;border-radius:12px;display:block;aspect-ratio:16/10;object-fit:cover}
.single-photo figcaption{font-size:12.5px;color:var(--muted);margin-top:6px}
.single-photo.tall{max-width:420px;margin:0 auto}
.single-photo.tall img{aspect-ratio:4/5}
.single-photo.square{max-width:420px;margin:0 auto}
.single-photo.square img{aspect-ratio:1/1}
.single-photo figcaption a,.photo-pair figcaption a,.gallery figcaption a{color:var(--orange-dark);font-weight:600;text-decoration:underline;text-underline-offset:2px}
.photo-pair{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.photo-pair figure{margin:0}
.photo-pair img{width:100%;aspect-ratio:4/5;object-fit:cover;border-radius:12px;display:block}
.photo-pair figcaption{font-size:12.5px;color:var(--muted);margin-top:6px}

/* China's layout (29 Sep 2026): a banner, the dish mosaic, a trio and bigger clip rows. Thailand does not use these. */
.guide-media .play{position:absolute;left:8px;top:8px;z-index:2;display:inline-flex;align-items:center;gap:5px;background:#000000a8;color:#fff;font-size:11px;font-weight:700;padding:5px 8px;border-radius:999px;border:0;cursor:pointer}
.guide-media .play svg{width:9px;height:9px;fill:#fff}
.guide-media .play:hover{background:var(--orange)}
.single-photo{position:relative}
.media-banner .banner{position:relative;margin:0;border-radius:16px;overflow:hidden;background:#29362c}
.media-banner .banner img{display:block;width:100%;aspect-ratio:2/1;object-fit:cover}
.media-banner .banner::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,#0000 42%,#000000b0 100%);pointer-events:none}
.media-banner .banner figcaption{position:absolute;left:0;right:0;bottom:0;z-index:1;padding:14px 18px 15px;color:#fff;font-size:15px;line-height:1.4;font-weight:600;text-shadow:0 1px 6px #0007}
.media-banner .banner figcaption a{color:#fff;font-weight:700;text-decoration:underline;text-decoration-color:#ffffffb0;text-underline-offset:3px}
@media(max-width:600px){.media-banner .banner img{aspect-ratio:4/3}.media-banner .banner figcaption{font-size:14px;padding:12px 14px}}
.mosaic{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;grid-auto-flow:dense}
.mosaic figure{margin:0;position:relative;display:flex;flex-direction:column;min-width:0}
.mosaic img{display:block;width:100%;aspect-ratio:1/1;object-fit:cover;border-radius:12px;background:#e6e6de}
.mosaic figure.big{grid-column:span 2;grid-row:span 2}
.mosaic figure.big img{flex:1 1 0;height:0;min-height:0;aspect-ratio:auto}
.mosaic figcaption{font-size:12.5px;color:var(--muted);line-height:1.35;margin-top:6px}
.mosaic figcaption b{color:var(--ink);font-weight:650}
@media(max-width:599px){.mosaic{grid-template-columns:repeat(2,1fr)}.mosaic figure.big{grid-row:span 1}.mosaic figure.big img{flex:none;height:auto;aspect-ratio:1/1}}
.trio{display:grid;grid-template-columns:1.15fr 1fr;grid-template-rows:auto auto;gap:10px}
.trio figure{margin:0;position:relative;display:flex;flex-direction:column;min-width:0}
.trio img{display:block;width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:12px;background:#e6e6de}
.trio figure.lead-pic{grid-row:span 2}
.trio figure.lead-pic img{flex:1 1 0;height:0;min-height:0;aspect-ratio:auto}
.trio figcaption{font-size:12.5px;color:var(--muted);line-height:1.35;margin-top:6px}
.mosaic figcaption a,.trio figcaption a{color:var(--orange-dark);font-weight:600;text-decoration:underline;text-underline-offset:2px}
.reels{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.reel{min-width:0}
.reel button{display:block;width:100%;padding:0;border:0;background:none;text-align:left;cursor:pointer;font:inherit}
.reel .reel-pic{position:relative;display:block;border-radius:14px;overflow:hidden;background:#e6e6de}
.reel img{display:block;width:100%;aspect-ratio:4/5;object-fit:cover}
.reel .reel-play{position:absolute;left:50%;top:50%;width:46px;height:46px;margin:-23px 0 0 -23px;border-radius:50%;background:#000000a0;display:grid;place-items:center;transition:background .15s}
.reel .reel-play svg{width:15px;height:15px;fill:#fff;margin-left:3px}
.reel button:hover .reel-play{background:var(--orange)}
.reel .st{display:block;font-size:13px;font-weight:650;margin-top:7px;line-height:1.3;color:var(--ink)}
.reel .sp{display:block;font-size:12px;line-height:1.3;margin-top:2px;color:var(--muted)}
.reel .sp a{color:var(--orange-dark);font-weight:600;text-decoration:underline;text-underline-offset:2px}
@media(max-width:600px){.reels{display:flex;overflow-x:auto;gap:10px;padding:2px 0 8px;scrollbar-width:none;-webkit-overflow-scrolling:touch}.reels::-webkit-scrollbar{display:none}.reel{flex:none;width:44%}}

/* the eat list, tick boxes and the Instagram picture (Helen, 29 Sep 2026) */
.guide-body ul.eat-list{list-style:none;padding:0;margin:4px 0 14px;display:grid;grid-template-columns:1fr;gap:6px}
@media(min-width:600px){.guide-body ul.eat-list{grid-template-columns:1fr 1fr;column-gap:10px}}
.guide-body ul.eat-list li{margin:0;display:flex;align-items:center;gap:8px;padding:0 10px 0 0;border:1px solid var(--line);border-radius:10px;background:#fff}
.guide-body ul.eat-list li:hover{border-color:#f0b8a0}
.guide-body ul.eat-list li.done{background:#fff3e6;border-color:#f5cdb5}
.eat-list label{flex:1;min-width:0;display:flex;align-items:flex-start;gap:11px;padding:9px 0 9px 12px;cursor:pointer;line-height:1.35;-webkit-tap-highlight-color:transparent}
.eat-list input{appearance:none;-webkit-appearance:none;flex:none;width:21px;height:21px;margin:0;border:2px solid #c9ccc0;border-radius:6px;background:#fff;display:grid;place-content:center;cursor:pointer}
.eat-list input::before{content:'';width:11px;height:11px;background:#fff;clip-path:polygon(14% 44%,0 65%,50% 100%,100% 16%,80% 0,43% 62%);transform:scale(0);transition:transform .12s ease-out}
.eat-list input:checked{background:var(--orange);border-color:var(--orange)}
.eat-list input:checked::before{transform:scale(1)}
.eat-list input:focus-visible{outline:3px solid #f5b784;outline-offset:2px}
/* a score out of 10 for a ticked dish, Hugh's way (Helen, 29 Sep 2026) */
.eat-list .eat-score{display:none;flex:none;appearance:none;-webkit-appearance:none;font:inherit;font-size:13px;font-weight:700;color:var(--orange-dark);background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' fill='none' stroke='%23c64218' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat right 9px center/9px 6px;border:1px solid #f0b8a0;border-radius:999px;padding:5px 24px 5px 11px;cursor:pointer;min-height:30px}
.eat-list li.done .eat-score{display:block}
.eat-list li.scored .eat-score{background-color:var(--orange);color:#fff;border-color:var(--orange);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' fill='none' stroke='%23ffffff' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")}
.eat-list .eat-score:focus-visible{outline:3px solid #f5b784;outline-offset:2px}
.eat-share{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin:4px 0 16px;padding:12px 14px;border:1px solid #f5cdb5;background:#fff3e6;border-radius:12px}
.eat-share .eat-count{font-size:15px;color:var(--ink)}
.eat-share .plan-button{width:auto;margin:0;min-height:42px;padding:10px 16px;font-size:14px}
#eat-dialog{border:0;border-radius:18px;padding:0;background:var(--paper);width:min(94vw,440px);max-height:94vh;overflow:auto}
#eat-dialog::backdrop{background:#000000a8}
#eat-dialog .eat-dlg{position:relative;padding:16px 16px 14px}
#eat-dialog .player-close{position:absolute;right:10px;top:10px;z-index:2;width:34px;height:34px;border-radius:50%;background:#00000014;color:var(--ink);font-size:20px;line-height:1;border:0;cursor:pointer}
.eat-formats{display:inline-flex;gap:4px;padding:3px;border:1px solid var(--line);border-radius:999px;background:#fff;margin:0 0 12px}
.eat-formats button{border:0;background:none;border-radius:999px;padding:6px 14px;font:inherit;font-size:13px;font-weight:650;color:var(--muted);cursor:pointer}
.eat-formats button.on{background:var(--ink);color:#fff}
.eat-preview{display:flex;align-items:center;justify-content:center;min-height:300px;background:#ecece4;border-radius:12px;overflow:hidden}
.eat-preview img{display:block;max-width:100%;max-height:62vh;height:auto;border-radius:10px;box-shadow:0 6px 24px #0000001f}
.eat-wait{font-size:14px;color:var(--muted);padding:40px 0}
.eat-actions{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0 6px}
.eat-actions .plan-button{width:auto;flex:1 1 150px;margin:0;justify-content:center;min-height:44px}
.eat-actions .plan-button.ghost{background:#fff;border:1px solid #dfe4d2;color:var(--ink)}

/* player */
#reader-player{border:0;border-radius:16px;padding:0;background:#000;max-width:min(92vw,420px,calc((100vh - 56px) * 9 / 16));max-width:min(92vw,420px,calc((100dvh - 56px) * 9 / 16));width:100%;overflow:hidden}
#reader-player::backdrop{background:#000000b8}
#reader-player .player-box{position:relative;aspect-ratio:9/16;background:#000}
#reader-player iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
#reader-player video{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;background:#000}
#reader-player .player-yt{position:absolute;inset:0}#reader-player.mp4 #player-yt{display:none}
#reader-player.wide{max-width:min(94vw,820px,calc((100vh - 56px) * 16 / 9));max-width:min(94vw,820px,calc((100dvh - 56px) * 16 / 9))}
.photo-pair figure{position:relative}
#reader-player .player-close{position:absolute;right:8px;top:8px;z-index:2;width:34px;height:34px;border-radius:50%;background:#000000a0;color:#fff;font-size:20px;line-height:1;border:0;cursor:pointer}
#reader-player .player-foot{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:10px 14px;background:#111;color:#fff;font-size:13px}
#reader-player .player-foot a{color:#ffb797;font-weight:600}
.reader-toast{position:fixed;bottom:25px;left:50%;transform:translateX(-50%);max-width:calc(100% - 30px);padding:13px 23px;border-radius:9px;background:var(--ink);color:white;z-index:1000;box-shadow:0 5px 25px #0003;font-size:14px}

/* print and the PDF */
@media print{
  .site-header,.chapter-nav,.guide-actions,.reader-toast,#reader-player,.gallery .play,.shorts-strip .sv{display:none!important}
  :root,html,body.reader{background:#fff}
  .reader-main{max-width:none;padding:0}
  .guide-cover{border-radius:10px;margin:0;min-height:0;break-after:page;page-break-after:always;height:255mm;align-items:flex-end}
  .guide-cover h1{font-size:34pt}
  .guide-cover .cover-by{font-size:12pt}
  .guide-cover.plain{height:auto;break-after:auto;page-break-after:auto}
  .guide-body{font-size:11.5pt;line-height:1.5}
  .guide-body h1{font-size:26pt;margin:0 0 10pt;break-before:page;page-break-before:always;break-after:avoid}
  .guide-body h1:first-child{display:none}
  .guide-body h1.no-break{break-before:auto;page-break-before:auto}
  .guide-body h2{font-size:16pt;margin:16pt 0 6pt;break-after:avoid;page-break-after:avoid}
  .guide-body h3,.guide-body p.lead{break-after:avoid;page-break-after:avoid}
  .guide-body p,.guide-body li{orphans:3;widows:3}
  .guide-body .callout,.gallery figure,.single-photo,.photo-pair,tr{break-inside:avoid;page-break-inside:avoid}
  .guide-body table tr:first-child{break-after:avoid;page-break-after:avoid}   /* a table's header row stays with its first row (29 Sep 2026) */
  .guide-body thead{display:table-header-group}   /* the headings repeat on every page a table runs onto (Helen, 29 Sep) */
  .guide-body .table-wrap.keep,.guide-body ul.eat-list{break-inside:avoid;page-break-inside:avoid}   /* short tables and the eat list stay whole */
  .guide-body tbody tr:nth-child(-n+3){break-after:avoid;page-break-after:avoid}   /* a long table starts with at least four rows under its headings */
  .guide-body tbody tr:nth-last-child(-n+2){break-before:avoid;page-break-before:avoid}   /* and never leaves one or two rows alone on the next page */
  .guide-body p.keep-next{break-after:avoid;page-break-after:avoid}
  /* a landscape cover prints 4 by 3 across the top of the cover page with the title under it, so the photo is barely
     cropped, where the old full page cover zoomed it 2.5 times (Helen, 29 Sep) */
  .guide-cover.wide{display:flex;flex-direction:column;align-items:stretch;height:255mm}
  .guide-cover.wide::after{display:none}
  .guide-cover.wide img{position:static;display:block;width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;flex:none}
  .guide-cover.wide .cover-text{flex:1;display:flex;flex-direction:column;justify-content:center;padding:0 12mm}
  /* a media block moves to the next page whole rather than leaving its heading behind (Helen, 28 Sep 2026) */
  .guide-media{break-inside:avoid;page-break-inside:avoid;margin:10pt 0 14pt}
  .guide-media.media-gallery{break-inside:auto;page-break-inside:auto}   /* the dish grid may break between rows, so it starts under its heading (Helen, 28 Sep) */
  .media-foot{font-size:9pt;color:#73766e;margin:4pt 0 0}
  .media-foot a{color:var(--orange-dark)}
  .media-head{break-after:avoid;page-break-after:avoid}
  .table-wrap{overflow:visible}
  .guide-body table{min-width:0;font-size:9.5pt}
  .guide-body a{color:var(--orange-dark)}
  .guide-body a.pin{background:#fff3e6}
  .gallery{grid-template-columns:repeat(4,1fr);gap:7px}
  .gallery.cols-3{grid-template-columns:repeat(3,1fr)}
  .gallery img{border-radius:6px}
  .gallery figcaption{font-size:8.5pt;line-height:1.3;margin-top:4px}
  .shorts-strip{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;overflow:visible}
  .shorts-strip .short{width:auto}
  .shorts-strip .sp{font-size:8.5pt}
  .shorts-strip img{width:100%;height:auto;aspect-ratio:9/16;border-radius:6px}
  .shorts-strip .st{font-size:9pt}
  .single-photo.tall{max-width:62%}
  .single-photo.square{max-width:58%}
  .print-only{display:block!important}
  /* China's blocks in the PDF */
  .guide-media .play,.reel .reel-play{display:none!important}
  .guide-media.media-mosaic{break-inside:auto;page-break-inside:auto}
  .mosaic{gap:7px}
  .mosaic figure,.trio figure,.reel{break-inside:avoid;page-break-inside:avoid}
  .mosaic img,.trio img,.reel .reel-pic{border-radius:6px}
  .mosaic figcaption,.trio figcaption{font-size:8.5pt;line-height:1.3;margin-top:4px}
  .media-banner .banner{border-radius:8px}
  .media-banner .banner figcaption{font-size:10pt;padding:9pt 12pt}
  .reels{display:grid!important;grid-template-columns:repeat(3,1fr);gap:9px;overflow:visible}
  .reel{width:auto!important}
  .reel .st{font-size:9pt}
  .reel .sp{font-size:8.5pt}
  /* the eat list prints as empty boxes to tick by hand */
  .eat-share,#eat-dialog{display:none!important}
  .guide-body ul.eat-list{grid-template-columns:1fr 1fr;gap:3pt 16pt;margin:4pt 0 8pt}
  .guide-body ul.eat-list li{border:0;background:none!important;padding:0;gap:6pt}
  .eat-list label{padding:2pt 0;gap:7pt;line-height:1.3}
  .eat-list .eat-score{display:none!important}
  .eat-list .eat-blank{display:block!important;flex:none;font-size:9pt;color:#8d9087;letter-spacing:.5pt}
  .eat-list input{width:11pt;height:11pt;border:1.2pt solid #8d9087;border-radius:2.5pt;background:#fff!important;margin-top:1pt}
  .eat-list input::before{display:none}
}
.print-only{display:none}
/* A tall banner, 4:3 on every screen, for a picture with something at the top and the bottom (Helen, 28 Sep 2026, the Shu Gong Yan performer's face and the beef) */
.media-banner .banner.tall img{aspect-ratio:4/3}

/* The free preview (3 Oct 2026) */
.preview-chip{margin:12px 0 0;font-size:13px;color:var(--muted)}.preview-chip b{color:var(--orange-dark);font-weight:700}
.preview-actions .primary-button,.preview-actions .plan-button{width:auto;margin:0;min-height:40px;padding:9px 13px;font-size:13px;gap:8px;white-space:nowrap}
.preview-wall{position:relative;margin:18px 0 40px}
.wall-fade{position:relative;max-height:150px;overflow:hidden;filter:blur(4px);user-select:none;pointer-events:none;color:#6d7067;font-size:15px;line-height:1.6}
.wall-fade:after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,#f7f7f200 0%,var(--paper) 85%)}
.wall-card{position:relative;margin-top:-40px;border:1px solid #e2e5d9;border-radius:16px;background:#fff;padding:26px 24px 20px;text-align:center;box-shadow:0 12px 40px #263d2412}
.wall-lock{font-size:34px;display:block}
.wall-card h2{font-family:var(--display);font-size:28px;letter-spacing:-.6px;margin:8px 0 8px}
.wall-card>p{color:var(--muted);font-size:15px;line-height:1.55;margin:0 auto 16px;max-width:520px}
.wall-list{list-style:none;padding:0;margin:0 auto 20px;max-width:560px;display:grid;grid-template-columns:1fr 1fr;gap:6px 18px;text-align:left;font-size:13.5px}
.wall-list li{display:flex;gap:8px;align-items:flex-start;line-height:1.35}
.wall-list li span{flex:none;width:18px;text-align:center;font-size:12px;line-height:1.5}
.wall-list li small{font-weight:500;color:#7b7f70;font-size:12px}.wall-list li.free{font-weight:650}.wall-list li.free span{color:var(--orange)}.wall-list li.locked{color:#7b7f70}
.wall-card .primary-button{margin:0 auto 10px;max-width:380px}
.wall-all{width:auto;margin:0 auto;display:inline-flex}
.wall-signin{font-size:13px;color:var(--muted);margin:14px 0 0}.wall-signin a{text-decoration:underline;text-underline-offset:3px}
body.embed .site-header{display:none}body.embed .reader-main{padding-top:6px}body.embed .chapter-nav{top:0}
@media(max-width:720px){.wall-list{grid-template-columns:1fr}.wall-card{padding:22px 16px 18px}.wall-card h2{font-size:24px}}

/* The preview's way back (4 Oct 2026) */
.preview-topbar{position:sticky;top:0;z-index:21;display:flex;align-items:center;gap:12px;margin:0 -18px;padding:8px 18px;background:#f7f7f2f0;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);border-bottom:1px solid var(--line)}
.preview-back{flex:none;display:inline-flex;align-items:center;gap:6px;padding:9px 14px;border-radius:999px;border:1px solid var(--orange);background:var(--orange);color:#fff;font-size:14px;font-weight:700;cursor:pointer}
.preview-back:hover{background:var(--orange-dark);border-color:var(--orange-dark)}
.preview-topbar-note{font-size:12.5px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
body.preview .chapter-nav{top:52px}
body.preview .reader-main{padding-top:0}
/* Inside the map the tabs stick to the top of the frame, solid, no blur to redraw on every scroll (4 Oct 2026) */
body.embed.preview .chapter-nav{top:0;background:var(--paper);backdrop-filter:none;-webkit-backdrop-filter:none}
body.embed.preview .reader-main{padding-top:6px}

/* The pay step on the preview (4 Oct 2026) */
#reader-buy{border:1px solid var(--line);border-radius:18px;padding:0;background:var(--paper);width:min(94vw,460px);max-height:94vh;overflow:auto;box-shadow:0 24px 90px #15281b40}
#reader-buy::backdrop{background:#17291c65;backdrop-filter:blur(5px)}
.buy-body{padding:34px 28px 24px;position:relative}
.buy-close{position:absolute;right:12px;top:8px;z-index:2;width:36px;height:36px;border-radius:50%;background:none;color:var(--muted);font-size:26px;line-height:1;border:0;cursor:pointer}
.buy-kicker{font-size:11px;letter-spacing:1.6px;font-weight:700;color:var(--orange-dark)}
.buy-body h2{font-family:var(--display);font-size:28px;letter-spacing:-.8px;line-height:1.2;margin:10px 0 12px}
.buy-price{font-family:var(--display);font-size:40px;letter-spacing:-1.6px;font-weight:700;margin:0 0 16px;display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
.buy-price span{font-family:'Plus Jakarta Sans',sans-serif;font-size:14px;letter-spacing:0;color:var(--muted);font-weight:400}
.buy-price s{font-family:'Plus Jakarta Sans',sans-serif;font-size:16px;letter-spacing:0;color:var(--muted);font-weight:500}
.buy-price em{font-style:normal;font-family:'Plus Jakarta Sans',sans-serif;font-size:10px;letter-spacing:1px;font-weight:700;color:var(--orange-dark);border:1px solid #f2bda7;background:#fff3ec;border-radius:20px;padding:5px 9px;text-transform:uppercase}
.buy-ticks{padding:0;margin:0 0 18px;list-style:none;display:grid;gap:10px;font-size:14px;line-height:1.45}
.buy-ticks li{display:flex;gap:10px}.buy-ticks li:before{content:'✓';color:var(--orange);flex:none}
.buy-as{font-size:13px;color:var(--muted);margin:0 0 10px}
#reader-buy .primary-button{margin:0;max-width:none;width:100%}
.buy-terms{font-size:12px;color:var(--muted);line-height:1.55;margin:12px 0 0}.buy-terms a{text-decoration:underline;text-underline-offset:3px}
@media(max-width:720px){.buy-body{padding:28px 20px 20px}.buy-body h2{font-size:25px}.buy-price{font-size:36px}}

/* The map add on on the preview's pay card (4 Oct 2026) */
.buy-addon{display:grid;grid-template-columns:auto 1fr auto;gap:10px;align-items:center;border:1px solid #e3e6da;background:#f7f8f2;border-radius:10px;padding:9px 12px;margin:0 0 10px;cursor:pointer;text-align:left}
.buy-addon input{width:19px;height:19px;accent-color:var(--orange);margin:0}
.buy-addon b{display:block;font-size:13px;line-height:1.3;color:var(--ink)}
.buy-addon small{display:block;font-size:11.5px;line-height:1.35;color:var(--muted);margin-top:2px}
.buy-addon-price{font-weight:700;font-size:14px;white-space:nowrap;text-align:right;color:var(--ink)}
.buy-addon-price s{display:block;font-weight:400;font-size:11px;color:var(--muted)}
.buy-addon.on{border-color:var(--orange);background:#fff5ef;box-shadow:0 0 0 1px var(--orange)}

/* 📍 pins open a card over the guide (7 Oct 2026) */
#pin-card{border:1px solid var(--line);border-radius:18px;padding:0;background:var(--paper);width:min(94vw,440px);max-height:88vh;overflow:auto;box-shadow:0 24px 90px #15281b40}
#pin-card::backdrop{background:#17291c65;backdrop-filter:blur(5px)}
.pin-body{padding:30px 26px 22px;position:relative}
.pin-chip{display:inline-block;border-radius:4px;background:#f1f2eb;padding:4px 7px;font-size:11px;color:#8b8d7b}
.pin-body h2{font-family:var(--display);font-size:25px;letter-spacing:-.6px;line-height:1.2;margin:10px 0 6px}
.pin-meta{font-size:13px;line-height:1.55;color:var(--muted);margin:0 0 14px}.pin-rating{margin-left:8px;color:#8b8d7b;white-space:nowrap}
.pin-aka{font-size:12px;color:var(--muted);margin:-8px 0 12px}
#pin-card .primary-button{margin:0;max-width:none;width:100%;text-decoration:none}
.pin-note{margin:16px 0 0;padding-left:13px;border-left:2px solid var(--orange);font-size:15px;line-height:1.6;color:#5d6156}
.pin-note footer{margin-top:8px;font-size:12px;color:var(--muted);display:flex;align-items:center;gap:7px}.pin-note footer img{border-radius:50%;object-fit:cover}
.pin-map-link{display:inline-flex;align-items:center;gap:6px;margin-top:18px;font-size:13px;font-weight:700;color:var(--orange-dark);text-decoration:underline;text-underline-offset:3px}
.pin-kicker{display:block;font-size:10px;letter-spacing:1.4px;font-weight:700;color:var(--orange-dark);padding-right:36px}
.pin-peek{display:flex;gap:11px;align-items:flex-start;background:#f4f4ed;border:1px solid #e6e2d6;border-radius:14px;padding:12px;margin:12px 0 14px}
.pin-peek-copy{flex:1;min-width:0}.pin-peek b,.pin-peek q{display:block;quotes:none}.pin-peek b{font-size:15px}.pin-peek q{font-size:13px;color:#5d6156}.pin-peek small{display:block;font-size:12px;color:var(--muted);margin:4px 0}.pin-peek-lock{font-size:20px;line-height:1}
.blur-line{filter:blur(3.5px);user-select:none}
.pin-unlock{margin-top:4px}
.pin-quiet{display:block;margin:12px auto 0;padding:0;background:none;border:0;font:inherit;font-size:13px;font-weight:600;color:var(--orange-dark);text-decoration:underline;text-underline-offset:3px;cursor:pointer}
#pin-card .buy-terms{margin-top:14px;text-align:center}
@media(max-width:720px){#pin-card{width:100vw;max-width:none;max-height:86vh;margin:0;border-radius:18px 18px 0 0;border-bottom:0;inset:auto 0 0 0}.pin-body{padding:24px 18px 26px}.pin-body h2{font-size:23px}}
