/* GENERATED by scripts/generate-china-pages.mjs from scripts/china/kit.ts. Edit the source. */
.cn{--chili:#d8402b;--porcelain:#2f5fa8;--gold:#e3a72f;--cream:#fff7ea;--tint:var(--jade);
  --card:var(--paper);--disc:#fff4e2;--disc-ring:#f3dfbf}
@media (prefers-color-scheme:dark){.cn{--disc:#f6ead6;--disc-ring:#d9c3a0;--cream:#2a2520}}
.cn-main{max-width:1124px;padding:8px 18px 64px}
.jump{display:inline-flex;align-items:center;gap:8px;margin:14px 0 0;padding:8px 16px;border-radius:999px;background:var(--fill);color:var(--on-fill)!important;
  font-weight:700;text-decoration:none;min-height:44px;box-sizing:border-box;box-shadow:var(--shadow)}
.jump:hover{filter:brightness(1.08)}
.cn .site nav a{font-size:14px}
/* the hero */
.cn-hero{margin:4px 0 26px}
.cn-hero-in{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:18px;align-items:center}
.cn-hero .kicker{display:inline-block;margin:0 0 8px;padding:4px 12px;border-radius:999px;background:var(--paper);box-shadow:var(--shadow);
  color:var(--tint);font-weight:700;font-size:.82rem;letter-spacing:.02em}
.cn-hero h1{font-size:clamp(2rem,5.4vw,3.15rem);line-height:1.08;margin:0 0 12px;letter-spacing:-.01em;text-wrap:balance}
.cn-hero .lede{font-size:1.12rem;max-width:36em;margin:0}
/* a translated page breaks a word wider than its column the language's way: German "Hochgeschwindigkeitszüge" ran
   15 px past a 390 px screen (2026-11-14); the English pages keep their look */
html:not([lang="en"]) main{hyphens:auto;overflow-wrap:anywhere}
/* Korean breaks between words, as it is typeset, never inside one */
html[lang="ko"] main{word-break:keep-all}
.rack{position:relative;height:230px}
.rack .disc{position:absolute;width:150px;transition:transform .4s cubic-bezier(.3,1.6,.5,1)}
.rack .d0{left:4%;top:8px;transform:rotate(-7deg)}
.rack .d1{left:38%;top:62px;width:170px;transform:rotate(4deg);z-index:2}
.rack .d2{right:0;top:0;transform:rotate(9deg)}
.rack:hover .d0{transform:rotate(-12deg) translateY(-6px)}.rack:hover .d2{transform:rotate(14deg) translateY(-6px)}
@media (max-width:760px){.cn-hero-in{grid-template-columns:1fr}.rack{height:96px;max-width:300px}.rack .disc{width:76px}.rack .d1{width:86px;top:8px;left:34%}.rack .d0{top:2px}.rack .d2{right:4%}}
.disc{display:flex;align-items:center;justify-content:center;aspect-ratio:1;border-radius:50%;background:var(--disc);
  box-shadow:inset 0 0 0 5px var(--disc-ring),var(--shadow-lift);box-sizing:border-box}
.disc svg{flex:none;width:80%;height:auto;overflow:visible}
.steam{animation:steam 3.2s ease-in-out infinite}
@keyframes steam{0%,100%{transform:translateY(0);opacity:.45}50%{transform:translateY(-3px);opacity:.25}}
/* prose */
.cn-prose{max-width:46em}
.cn-prose h2,.cn-main>section>h2{font-size:clamp(1.3rem,3vw,1.6rem);margin:2.2rem 0 .7rem;text-wrap:balance}
.cn-main>section:is(.cn-block,.cn-words,.mystery)>h2:first-child{margin-top:0}
.cn-main p{max-width:46em}
.lead2{font-size:1.06rem}
.zh{font-weight:500;margin-left:.15em;color:var(--ink-soft)}
.zh .ruby,.wchip .ruby{font-family:var(--font-hanzi)}
ruby rt{font-family:var(--font-pinyin);font-size:.55em;color:var(--ink-soft)}
.cn-fact{background:var(--cream);border-radius:var(--r-lg);padding:14px 18px;margin:18px 0;border-left:6px solid var(--gold);max-width:44em}
.cn-fact b{display:block;margin-bottom:2px}.cn-fact p{margin:0}
/* dish cards */
.dish-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:16px;margin:12px 0 8px}
.dish-card{display:grid;grid-template-columns:140px minmax(0,1fr);gap:16px;align-items:start;background:var(--card);border-radius:20px;padding:16px 18px;box-shadow:var(--shadow)}
.dish-card .disc{width:140px}
@media (max-width:560px){.dish-card{grid-template-columns:104px minmax(0,1fr);gap:12px}.dish-card .disc{width:104px}}
.dish-card h2,.dish-card h3{margin:2px 0 4px;font-size:1.08rem;line-height:1.25}
.dish-card p{margin:0 0 .5rem;font-size:.96rem}
.meta{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px;font-size:.84rem!important;color:var(--ink-soft)}
.where{background:var(--sky);border-radius:999px;padding:2px 9px;font-weight:600}
.heat{display:inline-flex;gap:1px}.heat svg{width:17px;height:17px}.heat.none{font-weight:600}
/* cuisine and region blocks */
.cn-block{background:var(--card);border-radius:24px;box-shadow:var(--shadow);padding:20px 22px;margin:22px 0;border-top:8px solid var(--tint)}
.cn-block>h2{margin-top:0}
/* tea: the art beside the text, and the oxidation strip */
.tea-block{display:grid;grid-template-columns:minmax(0,1fr) 190px;gap:22px;align-items:start}
.tea-block h2{margin:0 0 6px}.tea-block>.disc{width:190px;margin-top:6px}
@media (max-width:640px){.tea-block{grid-template-columns:1fr}.tea-block>.disc{width:130px;grid-row:1}}
.ox{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px;list-style:none;margin:22px 0 4px;padding:0}
.ox a{display:grid;justify-items:center;gap:6px;text-decoration:none;color:var(--ink);font-weight:700;font-size:.92rem}
.ox .disc{width:100%;max-width:120px;box-shadow:inset 0 0 0 5px var(--tint),var(--shadow-lift)}
.ox a:hover .disc{transform:translateY(-3px)}.ox .disc{transition:transform .15s}
.ox-scale{display:flex;justify-content:space-between;margin:4px 0 18px!important;max-width:none!important;font-size:.82rem;color:var(--ink-soft);
  background:linear-gradient(90deg,#d6df86,#e2a645,#b8442a,#6a2f1c) bottom/100% 4px no-repeat;padding-bottom:8px}
@media (max-width:560px){.ox{grid-template-columns:repeat(3,minmax(0,1fr))}}
.chips{display:flex;flex-wrap:wrap;gap:6px;margin:6px 0 10px;padding:0;list-style:none}
.chips li{background:var(--sky);border-radius:999px;padding:3px 11px;font-size:.88rem}
.two{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:12px 22px}
/* words */
.cn-words{background:var(--card);border-radius:24px;padding:18px 20px;margin:30px 0;box-shadow:var(--shadow)}
.cn-words h2{margin:0 0 10px;font-size:1.15rem}
.wchips{display:flex;flex-wrap:wrap;gap:8px}
.wchip{display:inline-flex;align-items:baseline;gap:8px;padding:8px 12px;border-radius:14px;background:var(--sky);color:var(--ink);text-decoration:none;min-height:44px}
.wchip:hover{background:var(--sky-deep)}
.wchip .ruby{font-size:1.25rem}.wchip .en{color:var(--ink-soft);font-size:.9rem}
.wchip .lv{font-size:.7rem;background:var(--fill);color:var(--on-fill);border-radius:999px;padding:1px 7px;align-self:center}
.cn-app{margin:12px 0 0;font-size:.92rem;color:var(--ink-soft)}
/* conversations (scripts/china/pages-talks.ts) */
.tk{background:var(--card);border-radius:24px;box-shadow:var(--shadow);padding:20px 22px;margin:22px 0}
.tk>h2{margin-top:0}
.tk-cast{color:var(--ink-soft);font-size:.95rem;margin:0 0 6px}
.tk-lines{list-style:none;margin:0;padding:0}
.tk-line{display:grid;grid-template-columns:5.2em minmax(0,1fr) auto;gap:4px 14px;align-items:start;padding:12px 0;border-top:1px solid var(--line)}
.tk-line:first-child{border-top:0}
.tk-who{color:var(--tint);font-size:.9rem;padding-top:1.5em}
.tk-line.b .tk-who{color:var(--porcelain)}
.tk-say p{margin:0;max-width:none}
.tk-zh{font-size:1.4rem;line-height:2.15}
.tk-zh .ruby{font-family:var(--font-hanzi);font-size:inherit;line-height:inherit;display:inline}
.tk-zh ruby{margin:0 2px}
.tk-en{color:var(--ink-soft);font-size:.98rem}
.tk-pic{width:64px}
.tk-opts{margin:6px 0 4px;padding-left:1.6em}
.tk-opts .tk-zh{font-size:1.15rem}
.tk-say details{margin:4px 0 0}.tk-say summary{cursor:pointer;font-weight:600;min-height:32px}
.tk-facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:10px;margin:0 0 14px}
.tk-facts div{background:var(--card);border-radius:14px;padding:10px 14px;box-shadow:var(--shadow)}
.tk-facts dt{font-size:.8rem;color:var(--ink-soft);font-weight:600}.tk-facts dd{margin:0;font-weight:600}
.tk-notes h3{font-size:1.08rem;margin:1.3rem 0 .3rem}
.tk-list{padding-left:1.2em;max-width:46em}.tk-list li{margin:0 0 8px}
.tk-more{font-weight:600}
@media (max-width:560px){.tk{padding:16px 14px}.tk-line{grid-template-columns:minmax(0,1fr) auto}.tk-who{grid-column:1/-1;padding-top:0}.tk-zh{font-size:1.25rem}.tk-pic{width:48px}}
/* games */
.cn-game{background:var(--card);border-radius:26px;box-shadow:var(--shadow-lift);margin:30px 0;overflow:hidden;scroll-margin-top:12px}
.game-head{padding:16px 22px 14px;color:#fff;background:var(--tint)}
.game-head h2{margin:0;font-size:1.3rem;color:#fff;display:inline}
.game-head p{margin:2px 0 0;opacity:.95;font-size:.95rem}
.play-tag{display:inline-block;background:#fff;color:var(--tint);font-weight:700;border-radius:999px;padding:1px 10px;margin-right:8px;font-size:.78rem;vertical-align:3px}
.game-body{padding:18px 22px 22px}
.q-static{margin:0;padding-left:1.2em}.q-static li{margin:0 0 10px}.q-static p{margin:0}
.g-top{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:10px;color:var(--ink-soft);font-weight:600;font-size:.9rem}
.pips{display:flex;gap:5px}.pips i{width:10px;height:10px;border-radius:50%;background:var(--line)}.pips i.ok{background:var(--jade)}.pips i.no{background:var(--rose)}.pips i.now{outline:2px solid var(--ink);outline-offset:1px}
.g-q{display:grid;grid-template-columns:auto minmax(0,1fr);gap:16px;align-items:center}
.g-q .disc{width:130px}
.g-q p{font-size:1.15rem;font-weight:600;margin:0}
.g-word{display:block;font-size:2.6rem;line-height:1.5;margin:0 0 4px;font-family:var(--font-hanzi)}
.g-word rt{font-size:.36em}
.g-opts{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:10px;margin:16px 0 4px}
.g-opt{font:inherit;font-weight:600;font-size:1rem;text-align:left;min-height:52px;padding:10px 16px;border-radius:16px;border:2px solid var(--line);
  background:var(--paper-2);color:var(--ink);cursor:pointer;box-shadow:0 3px 0 var(--line);transition:transform .08s,box-shadow .08s,background .15s}
.g-opt:hover{border-color:var(--tint)}
.g-opt:active{transform:translateY(2px);box-shadow:0 1px 0 var(--line)}
.g-opt.right{background:#dff5e9;border-color:var(--jade);color:#14492f}.g-opt.wrong{background:#fde6e6;border-color:var(--rose);color:#6a1e22}
.g-opt[disabled]{cursor:default}
.g-opt:focus:not(:focus-visible),.g-go:focus:not(:focus-visible),.tile:focus:not(:focus-visible){outline:none}
.g-note{margin:12px 0 0;padding:12px 16px;border-radius:16px;background:var(--cream);font-size:.98rem;border-left:5px solid var(--jade)}
.g-note b{color:#1f7a4d}
.g-note.no{background:#fdeceb;border-left-color:#c8372d}.g-note.no b{color:#b3261e}
.g-go{font:inherit;font-weight:700;border:0;border-radius:999px;background:var(--fill);color:var(--on-fill);padding:12px 22px;min-height:48px;cursor:pointer;margin-top:12px}
.g-end{text-align:center;padding:10px 0}
.g-end .big{font-size:3rem;font-weight:700;line-height:1;margin:6px 0}
.g-end .seal{margin:8px auto}
@media (max-width:560px){.g-q{grid-template-columns:1fr}.g-q .disc{width:110px;margin:0 auto}}
/* seals: the passport stamps */
.seal{display:inline-grid;place-items:center;width:64px;height:64px;border-radius:14px;border:3px solid var(--chili);color:var(--chili);
  font-weight:700;font-size:.72rem;line-height:1.05;text-align:center;padding:4px;transform:rotate(-6deg);background:rgba(216,64,43,.06);
  overflow-wrap:normal;hyphens:manual;letter-spacing:-.01em;box-sizing:border-box}
.seal.big{width:96px;height:96px;font-size:1rem}
/* a postmark: a double inked ring round the province's dish, its name on the band */
.pm{display:grid;justify-items:center;align-content:center;width:92px;height:92px;border-radius:50%;border:3px solid var(--chili);
  box-shadow:inset 0 0 0 3px #fff8ef,inset 0 0 0 5px var(--chili);color:var(--chili);background:rgba(216,64,43,.05);padding:10px 8px 8px;
  box-sizing:border-box;font-weight:700;font-size:.66rem;line-height:1.05;text-align:center;transform:rotate(var(--r,-6deg));overflow-wrap:normal;hyphens:manual}
.pm svg{width:50px;height:auto;margin-bottom:2px}
.pm small{display:block;font-size:.58rem;font-weight:600;opacity:.85;margin-top:1px}
.seal.got{animation:stamp .45s cubic-bezier(.3,1.7,.5,1)}
@keyframes stamp{0%{transform:scale(2.2) rotate(-20deg);opacity:0}100%{transform:scale(1) rotate(-6deg);opacity:1}}
/* the map */
.cn-map{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(280px,1fr);gap:18px;align-items:start;margin:8px 0 24px}
@media (max-width:860px){.cn-map{grid-template-columns:1fr}}
.tiles{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:5px;background:var(--card);border-radius:24px;padding:14px;box-shadow:var(--shadow);container-type:inline-size}
.tile{font:inherit;aspect-ratio:1;border:0;border-radius:11px;cursor:pointer;padding:2px;color:#2a2a2a;font-weight:700;
  font-size:clamp(.56rem,2.3cqi,.86rem);line-height:1.05;display:grid;place-items:center;text-align:center;overflow-wrap:normal;hyphens:manual;letter-spacing:-.01em;
  background:var(--rt);box-shadow:inset 0 -4px 0 rgba(0,0,0,.16);transition:transform .12s,box-shadow .12s;position:relative}
.tile:hover,.tile:focus-visible{transform:translateY(-2px) scale(1.06);z-index:2;box-shadow:inset 0 -4px 0 rgba(0,0,0,.16),0 6px 14px rgba(0,0,0,.18)}
.tile[aria-pressed="true"]{outline:3px solid var(--ink);outline-offset:1px}
.tile.stamped{box-shadow:inset 0 -4px 0 rgba(0,0,0,.16),inset 0 0 0 2px rgba(216,64,43,.55)}
.tile.stamped::after{content:"";position:absolute;right:3px;top:3px;width:9px;height:9px;border-radius:50%;border:2px solid var(--chili);background:#fff8ef;box-sizing:border-box}
.tile.hint{animation:pulse 1s ease-in-out 3;box-shadow:0 0 0 4px #1f7a4d,0 0 0 8px rgba(31,122,77,.25);z-index:3}
.tile.ok{background:#36a26a;color:#fff}.tile.no{background:#c8372d;color:#fff}
.cn-long{font-size:.78em;overflow-wrap:anywhere}
@keyframes pulse{50%{transform:scale(1.12)}}
.gap{aspect-ratio:1}
.legend{display:flex;flex-wrap:wrap;gap:6px 12px;margin:10px 0 0;padding:0;list-style:none;font-size:.82rem;color:var(--ink-soft)}
.legend i{display:inline-block;width:12px;height:12px;border-radius:4px;margin-right:5px;vertical-align:-1px}
.panel-card{background:var(--card);border-radius:24px;box-shadow:var(--shadow);padding:18px 20px;min-height:200px}
.panel-card .disc{width:132px;float:right;margin:0 0 6px 10px}
@media (max-width:860px){.cn-map .panel-card{order:-1;min-height:0}.cn-map .panel-card .disc{width:96px}
  /* during a round the question stays in view above the map while you tap */
  .cn-map.playing .panel-card{position:sticky;top:0;z-index:5;max-height:42vh;overflow:auto;padding:12px 16px;border-radius:0 0 20px 20px}
  .cn-map.playing .modes{display:none}}
@media (max-width:560px){.tiles{padding:8px;gap:3px;border-radius:18px}.tile{border-radius:8px}}
@media (max-width:719px){.cn .site{flex-wrap:wrap}.cn .site nav{display:flex;order:3;width:100%;margin:6px 0 0;overflow-x:auto;scrollbar-width:none}}
.panel-card h2,.panel-card h3{margin:0 0 4px}
.panel-card ul{padding-left:1.1em;margin:8px 0}
.modes{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 12px}
.mode{font:inherit;font-weight:600;font-size:.88rem;border:2px solid var(--line);border-radius:999px;background:var(--paper);color:var(--ink);padding:6px 13px;min-height:40px;cursor:pointer}
.mode[aria-pressed="true"]{background:var(--fill);color:var(--on-fill);border-color:var(--fill)}
.ask{font-size:1.12rem;font-weight:700;margin:4px 0 8px}
.scoreline{color:var(--ink-soft);font-weight:600;font-size:.9rem}
/* region cards and the onward grid */
.next-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:12px}
.next-grid>.next{margin:0;font-size:inherit}
.next{display:grid;grid-template-columns:72px minmax(0,1fr);gap:12px;align-items:center;background:var(--card);border-radius:20px;padding:12px 14px;
  box-shadow:var(--shadow);text-decoration:none;color:var(--ink);transition:transform .15s,box-shadow .15s}
.next:hover{transform:translateY(-3px);box-shadow:var(--shadow-lift)}
.next .disc{width:72px;box-shadow:inset 0 0 0 4px var(--disc-ring)}
.next b{display:block;font-size:1.02rem}.next small{display:block;color:var(--ink-soft);font-size:.86rem;line-height:1.35}
/* tables */
.cn-table{overflow-x:auto;background:var(--card);border-radius:20px;box-shadow:var(--shadow);margin:14px 0}
.cn-table table{border-collapse:collapse;width:100%;min-width:620px;font-size:.92rem}
.cn-table th,.cn-table td{padding:9px 12px;text-align:left;border-bottom:1px solid var(--line);vertical-align:top}
.cn-table th{font-size:.78rem;text-transform:uppercase;letter-spacing:.04em;color:var(--ink-soft)}
.cn-table tr:last-child td{border-bottom:0}
.dot{display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:6px}
/* the countdown and the calendar */
.count{display:flex;gap:16px;align-items:center;background:var(--card);border-radius:24px;padding:16px 20px;box-shadow:var(--shadow);margin:6px 0 20px}
.count .disc{width:92px;flex:none}.count .n{font-size:2.4rem;font-weight:700;line-height:1;color:var(--chili)}
.fest{display:grid;grid-template-columns:120px minmax(0,1fr);gap:16px;background:var(--card);border-radius:24px;padding:18px 20px;box-shadow:var(--shadow);margin:16px 0}
.fest .disc{width:120px}.fest h2{margin:0 0 4px}
.dates{display:flex;flex-wrap:wrap;gap:6px;margin:6px 0 10px;padding:0;list-style:none}
.dates li{background:var(--sky);border-radius:10px;padding:3px 9px;font-size:.84rem;font-variant-numeric:tabular-nums}
.dates li.past{opacity:.45;text-decoration:line-through}.dates li.next{background:var(--chili);color:#fff;font-weight:700}
.fest.soon{box-shadow:0 0 0 3px var(--chili),var(--shadow-lift)}
@media (max-width:560px){.fest{grid-template-columns:1fr}.fest .disc{width:96px}}
/* the passport page */
.pass{display:grid;grid-template-columns:repeat(auto-fill,minmax(100px,1fr));gap:14px 10px;background:var(--cream);border-radius:6px 24px 24px 6px;padding:20px 18px;
  box-shadow:var(--shadow),inset 10px 0 0 -4px rgba(0,0,0,.05);margin:8px 0 18px;background-image:repeating-linear-gradient(0deg,transparent 0 27px,rgba(201,169,120,.18) 27px 28px)}
.pass h3{grid-column:1/-1;margin:4px 0 -4px;font-size:.92rem;color:var(--ink-soft)}
.pass .slot{display:grid;justify-items:center;gap:4px;font-size:.74rem;color:var(--ink-soft);text-align:center}
.pass .seal,.pass .pm{opacity:.3;filter:grayscale(1)}.pass .slot.on .seal,.pass .slot.on .pm{opacity:.92;filter:none}
.pass .slot:nth-child(3n) .pm{--r:5deg}.pass .slot:nth-child(4n+1) .pm{--r:-11deg}
.mystery{background:var(--card);border-radius:24px;box-shadow:var(--shadow-lift);padding:18px 20px;margin:20px 0;border:3px dashed var(--gold)}
.mystery h2{margin:0 0 6px}.clues{margin:8px 0;padding-left:1.2em}.clues li{margin:4px 0}
.cn-foot{margin:8px 0 0;font-size:.9rem}
/* the page in the other languages */
.cn-langs{max-width:1124px;margin:0 auto;padding:0 18px 18px;display:flex;flex-wrap:wrap;gap:4px 14px;font-size:.9rem}
.cn-langs a{display:inline-flex;align-items:center;min-height:32px}.cn-langs a[aria-current]{font-weight:700;color:var(--ink);text-decoration:none}
@media (prefers-reduced-motion:reduce){.steam,.tile.hint,.seal.got{animation:none}}