/* 夢 — Dongjing Meng Hua Lu, closing page.
   One scroll-driven stage: paper → night city → paper → ink. All colour is paper, ink, vermilion and lamp-light. */
@font-face{font-family:"Galok Song";src:url("/assets/fonts/source-han-serif-tc-reading-supplement.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap;unicode-range:U+382F,U+384C,U+3B0B,U+410D,U+4453,U+45EB,U+4A8C,U+4B45,U+4E14,U+4E19,U+4E1C,U+4E2B,U+4E49,U+4E4D,U+4E89,U+4EA1,U+4EAB,U+4EAE,U+4EB3,U+4EC6,U+4F0D,U+4F0F,U+4F69,U+4F73,U+4F7E,U+4F9D,U+4FC3,U+4FC5,U+4FCA,U+4FDA,U+5029,U+502C,U+503C,U+5043,U+5049,U+505A,U+5076,U+50D5,U+50F5,U+513A,U+5178,U+518A,U+518D,U+5191,U+51A5,U+51F3,U+51F9,U+5203,U+5212,U+5224,U+522E,U+5256-5257,U+5259,U+5269,U+52BE,U+52D2,U+52D4,U+533A,U+5340,U+5348,U+534E,U+535C,U+536F,U+537B,U+537F,U+53C5,U+53CB,U+53D1,U+53DA,U+53E5,U+53E9,U+542B,U+5447,U+544A,U+5475,U+54E8,U+555E,U+558A,U+558F,U+55A7,U+56CA,U+56EC,U+56FF,U+572D,U+5740,U+579B,U+57CB,U+581E,U+5851,U+5864,U+5875,U+58B3,U+58C7,U+58DD,U+58FA,U+5915,U+592E,U+5951,U+5967,U+596A,U+596E,U+5976,U+5996,U+59B9,U+59BE,U+59D0,U+59EC,U+59FF,U+5AC2,U+5AE9,U+5B58,U+5B63-5B64,U+5B83,U+5BA6,U+5BD0,U+5BDC,U+5BDF,U+5BEB,U+5BEE,U+5BF0,U+5BF3,U+5C65,U+5C6C,U+5CF0,U+5D14,U+5DF5,U+5E37,U+5E44,U+5E58,U+5E5F,U+5E70,U+5E72,U+5E7E,U+5ECC,U+5EF5,U+5F00,U+5F0B,U+5F26,U+5F65,U+5F91-5F92,U+5FA7,U+5FD7,U+5FFD,U+6050,U+6068,U+60B5,U+60F3,U+6101,U+611F,U+614B,U+6162,U+6191,U+61B6,U+6208,U+621F,U+622A,U+6238,U+623D,U+6273,U+62A5,U+62BA,U+62BC,U+62C2,U+62D2,U+6311,U+633A,U+633C,U+634F,U+6355,U+637A,U+6388,U+6398,U+63A1,U+63AA,U+63C0,U+6422,U+6436,U+6454,U+6469,U+647B,U+6490,U+649A,U+64AE,U+64C2,U+64CE,U+64D8,U+6500,U+651D,U+6522,U+6527,U+6554,U+6582,U+6591,U+65B7,U+65CC,U+65CF,U+65D2,U+660A,U+6661,U+66E9,U+66FF,U+670B,U+6742,U+6751,U+6753,U+6765,U+6775,U+67B7,U+67D0,U+67F7,U+6801,U+6821,U+6865,U+68C4,U+68E3,U+68F9,U+6963,U+6978,U+697B,U+6985,U+6996,U+699C,U+69AE,U+69BC,U+69EE,U+69F3,U+6A0A,U+6A19,U+6A80,U+6AFA,U+6B39,U+6B47,U+6B7F,U+6BC6,U+6C89,U+6CBC,U+6DAF,U+6E67,U+6EAA,U+6F38,U+6F3F,U+70DF,U+711A,U+71B3,U+71CE,U+721B,U+7235,U+7240,U+7248,U+72CE,U+72FC,U+7344,U+73EE,U+7435-7436,U+745E-745F,U+74CA,U+7525,U+754B,U+7568,U+758F,U+7620,U+7678,U+76CC,U+7740,U+775B,U+7779-777A,U+77DB,U+77DF,U+77EE,U+7802,U+7811,U+781F,U+7834,U+786C,U+788C,U+78EC,U+7940,U+795F-7960,U+796D,U+79AA,U+7A00,U+7A20,U+7A44,U+7A81,U+7AA9,U+7AC5,U+7AC8,U+7AFD,U+7B04,U+7B80,U+7B8E-7B8F,U+7B9C,U+7BC1,U+7BC4,U+7BCC,U+7BE5,U+7C3F,U+7C43,U+7C4C,U+7CB1,U+7CBD,U+7CDD,U+7D14,U+7D39-7D3A,U+7D43,U+7D73,U+7D8F,U+7DB3,U+7DBD,U+7DD2,U+7DF4,U+7E08,U+7E2B,U+7E6A,U+7E79,U+7E8C,U+7E9C,U+7F88,U+7FAF,U+7FC5,U+7FD4,U+8003,U+8017,U+806F,U+8090,U+80A5,U+80B2,U+80E5,U+80EF,U+812B,U+8154,U+8181,U+818A,U+81A8,U+8204-8205,U+8238,U+8264,U+8277,U+827E,U+828D,U+82D7,U+82DE,U+8309,U+8389,U+83C9,U+83D3,U+83D6,U+83F1,U+8461,U+846B,U+8475,U+854A,U+856D,U+85A6,U+85CD,U+8606,U+862D,U+8638,U+865E,U+86C7,U+8784,U+87AF,U+87BA,U+87C6,U+87EC,U+881F,U+886E,U+8896,U+889E,U+88B4,U+88C1,U+88FD,U+890A,U+8925,U+892A,U+8955,U+8972,U+8974,U+8994,U+89A9,U+89DC,U+89E5,U+89F1,U+8A95,U+8AA6,U+8AC7,U+8ACC,U+8B01,U+8B14,U+8B39,U+8B58,U+8B5A,U+8B80,U+8C48,U+8C79,U+8CBC,U+8CFD,U+8D0A,U+8D66,U+8D95,U+8DAF,U+8DE3,U+8E0A,U+8E22,U+8E48,U+8E4C,U+8EAC,U+8F2F,U+8F42,U+8F4E,U+8F5D,U+8FC5,U+8FE4,U+8FF0,U+901E,U+9057,U+9059,U+905E,U+9076,U+9087,U+908F-9090,U+90A3,U+90B1,U+90B5,U+9149,U+9167,U+9189,U+9192,U+91E3,U+920D,U+9295,U+92B3,U+935C,U+936A,U+9403,U+9418,U+947C,U+9481,U+9589,U+95A9,U+95AD,U+95DE,U+95F2,U+961C,U+9644,U+9650,U+965B,U+9685,U+968E,U+969B,U+96C9,U+96DB,U+96E2,U+96F7,U+9707,U+971E,U+9739,U+9742,U+9756,U+9785,U+97C1,U+97C9,U+97ED,U+97F6,U+97FF,U+9838,U+983B,U+9870,U+98C4,U+98E3,U+9915,U+9921,U+993B,U+9957,U+9997,U+99A8,U+99B4,U+9A19,U+9A44,U+9A5F,U+9A64,U+9ACF,U+9AD1,U+9AEB,U+9B03,U+9B23,U+9B2C,U+9B41-9B42,U+9C0D,U+9CE5,U+9D1B,U+9D26,U+9D92,U+9E02,U+9E0E,U+9E9D,U+9EFF,U+9F08,U+9F10,U+9F19,U+9F4E,U+9F61,U+9F95}
:root{
  --m-paper:#f2ede1; --m-ink:#1d1a16; --m-zhu:#9c2f1f; --m-zhu-mark:#b23a24; --m-night:#0f0d0a;
  --m-lamp:#f3c27d; --m-soft:#5b544a;
  --gutter:clamp(16px,4vw,56px);
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body.meng{margin:0;background:var(--m-paper);color:var(--m-ink);font:400 16px/1.6 var(--g-serif,Georgia,serif)}
.meng-bar{position:relative;z-index:60;display:flex;flex-wrap:wrap;gap:6px 18px;align-items:center;justify-content:space-between;padding:10px var(--gutter);background:#0e100f;color:#f5f5f1;font:500 13px/1.4 var(--g-sans,sans-serif)}
.meng-bar a{color:#f5f5f1;text-underline-offset:3px;min-height:24px;display:inline-flex;align-items:center}
.meng-bar span{color:#b9bcb6;letter-spacing:.08em;text-transform:uppercase;font:600 11px/1.4 var(--g-mono,monospace)}
.skip-link{position:absolute;left:12px;top:44px;z-index:70;padding:8px 12px;background:var(--m-ink);color:var(--m-paper);font:600 13px/1 var(--g-sans,sans-serif);transform:translateY(-400%);transition:transform .15s}
.skip-link:focus{transform:none}
:focus-visible{outline:2px solid var(--m-zhu);outline-offset:3px}

/* ---------- the stage ---------- */
#stage-wrap{position:relative;height:1050vh}
.stage{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden;background:var(--m-paper)}
#city{position:absolute;inset:0;width:100%;height:100%;display:block;touch-action:pan-y}
.stage-fade{position:absolute;inset:auto 0 0 0;height:22%;pointer-events:none;background:linear-gradient(to top,var(--m-fade,transparent),transparent)}

/* captions */
.caps{position:absolute;left:var(--gutter);bottom:clamp(18px,6vh,64px);width:min(34ch,calc(100% - 2*var(--gutter)));pointer-events:none;z-index:4}
.cap{position:absolute;left:0;bottom:0;width:100%;opacity:0;transition:none;color:var(--cap-ink,var(--m-ink))}
.cap .zh{margin:0 0 8px;font:400 clamp(20px,2.4vw,30px)/1.45 var(--g-song,serif);letter-spacing:.04em}
.cap .en{margin:0;font:400 clamp(14px,1.4vw,16px)/1.55 var(--g-serif,Georgia,serif);color:var(--cap-soft,var(--m-soft))}
.cap .src{display:block;margin-top:8px;font:600 11px/1.3 var(--g-mono,monospace);letter-spacing:.08em;text-transform:uppercase;color:var(--cap-zhu,var(--m-zhu))}
.cap.title .zh{font-size:clamp(88px,16vw,220px);line-height:.9;letter-spacing:0;margin:0 0 14px}
.stage[data-mode="night"]{--cap-ink:#efe6d4;--cap-soft:#b8ad98;--cap-zhu:#e38c78}
.stage[data-mode="night"] .stage-fade{--m-fade:rgba(15,13,10,.75)}

/* hours */
.hours{position:absolute;right:var(--gutter);top:clamp(14px,3vh,28px);z-index:6;display:flex;flex-wrap:wrap;gap:6px;max-width:calc(100% - 2*var(--gutter));justify-content:flex-end;opacity:0;pointer-events:none;transition:opacity .3s}
.hours.on{opacity:1;pointer-events:auto}
.hours button{min-height:40px;min-width:44px;padding:0 12px;border:1px solid rgba(239,230,212,.45);background:rgba(15,13,10,.55);color:#efe6d4;font:600 13px/1 var(--g-song,serif);letter-spacing:.06em;cursor:pointer;border-radius:0}
.hours button small{display:block;margin-top:3px;font:600 9px/1 var(--g-mono,monospace);letter-spacing:.08em;color:#b8ad98;text-transform:uppercase}
.hours button[aria-pressed="true"]{background:#efe6d4;color:#0f0d0a;border-color:#efe6d4}
.hours button[aria-pressed="true"] small{color:#4d463a}
.hours-label{flex-basis:100%;text-align:right;margin:0 0 2px;font:600 10px/1.2 var(--g-mono,monospace);letter-spacing:.1em;color:#b8ad98;text-transform:uppercase}

/* tooltip */
.tip{position:absolute;z-index:8;max-width:min(300px,calc(100% - 24px));padding:14px 16px 12px;background:#17130e;color:#efe6d4;border:1px solid rgba(243,194,125,.5);box-shadow:0 12px 40px rgba(0,0,0,.45);opacity:0;pointer-events:none;transform:translateY(6px);transition:opacity .18s,transform .18s}
.tip.on{opacity:1;pointer-events:auto;transform:none}
.tip .zh{margin:0;font:400 24px/1.2 var(--g-song,serif);letter-spacing:.06em}
.tip .en{margin:2px 0 10px;font:600 11px/1.3 var(--g-mono,monospace);letter-spacing:.08em;text-transform:uppercase;color:#d9a889}
.tip q{display:block;margin:0 0 10px;font:400 16px/1.55 var(--g-song,serif);quotes:none;color:#f3e9d6}
.tip a{display:inline-flex;align-items:center;min-height:36px;color:#f3c27d;font:600 12px/1 var(--g-mono,monospace);letter-spacing:.06em;text-decoration:underline;text-underline-offset:4px}

/* ink */
.ink-wrap{position:absolute;inset:0;display:grid;place-items:center;padding-bottom:clamp(90px,19vh,200px);pointer-events:none;z-index:3}
.ink{grid-area:1/1;margin:0;writing-mode:vertical-rl;text-orientation:upright;font:400 min(15vw,9.6vh)/1.04 var(--g-song,serif);letter-spacing:.12em;color:var(--m-ink);opacity:0;white-space:nowrap}
.ink.lost{color:#241d16}
.last{position:absolute;left:0;right:0;bottom:clamp(36px,10vh,96px);text-align:center;opacity:0;z-index:4;pointer-events:none;padding:0 var(--gutter)}
.last .zh{margin:0;font:400 clamp(20px,3vw,34px)/1.5 var(--g-song,serif);letter-spacing:.1em;color:var(--m-ink)}
.last .en{margin:6px 0 0;font:400 clamp(14px,1.4vw,17px)/1.5 var(--g-serif,Georgia,serif);font-style:italic;color:var(--m-soft)}
.last .sig{display:block;margin-top:10px;font:600 11px/1 var(--g-mono,monospace);letter-spacing:.1em;color:var(--m-zhu);text-transform:uppercase}

.map-note{position:absolute;right:var(--gutter);bottom:clamp(10px,2.4vh,24px);z-index:4;max-width:26ch;font:600 10px/1.45 var(--g-mono,monospace);letter-spacing:.08em;text-transform:uppercase;color:var(--cap-soft,var(--m-soft));text-align:right;pointer-events:none;opacity:0}
.skip-anim{position:absolute;left:var(--gutter);top:clamp(14px,3vh,28px);z-index:6;font:600 11px/1 var(--g-mono,monospace);letter-spacing:.08em;text-transform:uppercase;color:var(--cap-ink,var(--m-ink));text-underline-offset:4px;min-height:44px;display:inline-flex;align-items:center}
.progress{position:absolute;left:0;top:0;height:2px;width:100%;transform-origin:0 50%;background:var(--m-zhu);transform:scaleX(0);z-index:7}

/* ---------- the preface (read last) ---------- */
.after{background:var(--m-paper);color:var(--m-ink)}
.after .wrap{width:min(920px,calc(100% - 2*var(--gutter)));margin:0 auto;padding:clamp(56px,9vw,120px) 0}
.after .lab-label,.lab-label{font:600 12px/1.3 var(--g-mono,monospace);letter-spacing:.1em;text-transform:uppercase;color:var(--m-zhu)}
.after h2{margin:12px 0 18px;font:400 clamp(34px,5vw,64px)/1.05 var(--g-display-serif,var(--g-serif,Georgia,serif));letter-spacing:-.02em}
.after .lede{max-width:34em;margin:0 0 40px;color:var(--m-soft);font:400 19px/1.6 var(--g-serif,Georgia,serif)}
.preface{border-top:1px solid var(--m-ink);padding-top:16px}
.preface header{display:flex;justify-content:space-between;gap:20px;margin-bottom:20px}
.preface blockquote{margin:0;padding:0;font:400 clamp(19px,1.9vw,23px)/2 var(--g-song,serif);letter-spacing:.03em}
.preface blockquote p{margin:0 0 1.1em;text-indent:2em}
.layer{margin:30px 0 0;padding-left:20px;border-left:2px solid var(--m-zhu)}
.layer small{display:block;margin-bottom:8px;font:600 11px/1.3 var(--g-mono,monospace);letter-spacing:.1em;text-transform:uppercase;color:var(--m-zhu)}
.layer p{max-width:34em;margin:0 0 .8em;font:400 18px/1.65 var(--g-serif,Georgia,serif)}
.echo{margin:56px 0 0;padding:28px 0;border-top:1px solid var(--m-ink);border-bottom:1px solid var(--m-ink);text-align:center}
.echo b{display:block;font:400 clamp(24px,3.4vw,40px)/1.4 var(--g-song,serif);letter-spacing:.08em}
.echo span{display:block;margin-top:8px;font:600 11px/1.4 var(--g-mono,monospace);letter-spacing:.1em;text-transform:uppercase;color:var(--m-zhu)}
.places{margin-top:56px}
.places summary{cursor:pointer;min-height:44px;display:flex;align-items:center;font:600 12px/1.3 var(--g-mono,monospace);letter-spacing:.1em;text-transform:uppercase;color:var(--m-zhu)}
.places ul{margin:12px 0 0;padding:0;list-style:none;display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:2px 24px}
.places li a{display:flex;gap:10px;align-items:baseline;min-height:36px;padding:4px 0;color:inherit;text-decoration:none;border-bottom:1px solid #cbc0a8}
.places li a:hover{color:var(--m-zhu)}
.places li b{font:400 18px/1.3 var(--g-song,serif);font-weight:400}
.places li small{font:600 10px/1.2 var(--g-mono,monospace);letter-spacing:.06em;color:var(--m-soft);text-transform:uppercase}
.credits{margin-top:56px;color:var(--m-soft);font:400 14px/1.7 var(--g-serif,Georgia,serif)}
.credits h3{margin:0 0 8px;font:600 11px/1.3 var(--g-mono,monospace);letter-spacing:.1em;text-transform:uppercase;color:var(--m-zhu)}
.credits ul{margin:0 0 20px;padding-left:1.1em}
.back{display:inline-flex;align-items:center;min-height:44px;margin-top:24px;color:var(--m-ink);font:600 12px/1 var(--g-mono,monospace);letter-spacing:.08em;text-transform:uppercase;text-underline-offset:4px}

/* ---------- reduced motion: the stage becomes six still panels ---------- */
body.meng.static #stage-wrap{height:auto}
body.meng.static .stage{position:static;height:auto;overflow:visible;background:transparent}
.panels{display:none}
body.meng.static .panels{display:block}
body.meng.static #city,body.meng.static .caps,body.meng.static .hours,body.meng.static .ink-wrap,body.meng.static .last,body.meng.static .tip,body.meng.static .map-note,body.meng.static .progress,body.meng.static .stage-fade{display:none}
.panel{position:relative;margin:0;padding:0;border-bottom:1px solid #cbc0a8;background:var(--panel-bg,var(--m-paper));color:var(--panel-ink,var(--m-ink))}
.panel canvas{display:block;width:100%;height:min(70vh,520px)}
.panel figcaption{padding:16px var(--gutter) 28px;max-width:60ch;margin:0 auto}
.panel .zh{margin:0 0 6px;font:400 24px/1.4 var(--g-song,serif)}
.panel .en{margin:0;font:400 16px/1.55 var(--g-serif,Georgia,serif);opacity:.8}
.panel.dark{--panel-bg:#0f0d0a;--panel-ink:#efe6d4}
@media (max-width:900px){
  .hours{top:clamp(56px,8vh,70px)}
  .caps{width:calc(100% - 2*var(--gutter))}
  .cap.title .zh{font-size:clamp(72px,26vw,140px)}
  .map-note{display:none}
  .hours button{min-width:40px;padding:0 9px}
}

/* ---------- video mode (?video=1): the stage alone, nothing to click ---------- */
body.meng.video{overflow:hidden;background:#0f0d0a}
body.meng.video .meng-bar,body.meng.video .skip-link,body.meng.video .skip-anim,body.meng.video .progress,body.meng.video .hours,body.meng.video .after,body.meng.video .stage-fade{display:none!important}
body.meng.video #stage-wrap{height:100vh}
body.meng.video .stage{position:fixed;inset:0;height:100vh}
body.meng.video .tip{transition:none}
body.meng.video .tip a{display:none}

/* ---------- shield: the shared site shell (observability.js) injects its own type rules; keep this page's voices ---------- */
html body.meng:not(#m) :is(.cap .zh,.ink,.last .zh,.tip .zh,.tip q,.preface blockquote,.preface blockquote p,.hours button,.echo b,.places li b,.panel .zh){font-family:var(--g-song,"Songti TC",serif)!important;font-weight:400!important}
html body.meng:not(#m) :is(.cap .en,.last .en,.after .lede,.layer p,.credits,.credits li,.panel .en){font-family:var(--g-serif,Georgia,serif)!important}
html body.meng:not(#m) :is(.cap .src,.map-note,.lab-label,.layer small,.echo span,.places summary,.places li small,.credits h3,.hours small,.hours-label,.tip .en,.tip a,.last .sig,.skip-anim,.meng-bar span,.back){font-family:var(--g-mono,ui-monospace,monospace)!important}
html body.meng:not(#m) .after h2{font-family:var(--g-display-serif,var(--g-serif,Georgia,serif))!important;font-weight:400!important}
html body.meng:not(#m) .meng-bar{font-family:var(--g-sans,sans-serif)!important}
html body.meng:not(#m) .ink{font-size:min(15vw,9.6vh)!important;line-height:1.04!important;letter-spacing:.12em!important;color:var(--m-ink)!important}
html body.meng:not(#m) .ink.lost{color:#241d16!important}
html body.meng:not(#m) .cap .zh{letter-spacing:.04em!important}
html body.meng:not(#m) .cap.title .zh{letter-spacing:0!important}
html body.meng:not(#m) .preface blockquote{line-height:2!important}
@media (max-width:900px){
  /* clear the floating site capsule at the bottom of the viewport */
  .caps{bottom:clamp(84px,13vh,110px)}
  .last{bottom:clamp(96px,16vh,130px)}
}