@font-face{font-family:Ouyang;src:url("../../assets/font/正欧阳询楷书+简繁.TTF") format("truetype");font-display:swap}
:root{--paper:#efeadd;--paper-deep:#ded5c2;--ink:#1d292a;--muted:#687474;--night:#111c1f;--night-soft:#1a2b2f;--cinnabar:#a13d31;--jade:#3f6f70;--jade-light:#82aaa5;--gold:#c39a54;--river:#4f8a91;--line:rgba(29,41,42,.16);--line-light:rgba(255,255,255,.16);--display:Ouyang,"STKaiti","KaiTi",serif;--body:"Songti SC","STSong","Noto Serif SC",serif;--sans:"PingFang SC","Hiragino Sans GB",sans-serif}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:var(--ink);background:var(--paper);font-family:var(--body)}body::selection{color:white;background:var(--cinnabar)}a{color:inherit}button,input{font:inherit}.paper-grain{position:fixed;inset:0;z-index:50;pointer-events:none;opacity:.13;background-image:repeating-linear-gradient(0deg,transparent 0 4px,rgba(29,41,42,.04) 4px 5px),radial-gradient(circle at 20% 30%,rgba(29,41,42,.11) 0 .6px,transparent .8px);background-size:auto,12px 13px;mix-blend-mode:multiply}.progress-bar{position:fixed;top:0;left:0;z-index:60;width:0;height:3px;background:linear-gradient(90deg,var(--cinnabar),var(--gold))}
.masthead{position:sticky;top:0;z-index:40;display:grid;grid-template-columns:1fr auto 1fr;min-height:4.7rem;padding:0 clamp(1.2rem,4vw,4.5rem);align-items:center;color:#eee8da;background:rgba(17,28,31,.91);border-bottom:1px solid rgba(255,255,255,.08);backdrop-filter:blur(14px)}.brand{display:flex;width:max-content;align-items:center;gap:.7rem;text-decoration:none}.brand span{display:grid;width:2.15rem;height:2.15rem;place-items:center;border:1px solid var(--gold);color:#efd49c;font:1.15rem var(--display);transform:rotate(-3deg)}.brand b{font-size:.74rem;font-weight:400;letter-spacing:.15em}.masthead nav{display:flex;gap:1.5rem}.masthead nav a,.home-link{color:#aebcba;text-decoration:none;font:.72rem var(--sans);letter-spacing:.15em}.masthead nav a:hover,.home-link:hover{color:#f1d59d}.home-link{justify-self:end}
main{overflow:hidden}.hero{position:relative;display:grid;min-height:calc(100vh - 4.7rem);padding:clamp(4rem,8vh,7rem) clamp(1.4rem,6vw,7rem);grid-template-columns:minmax(0,1.05fr) minmax(24rem,.95fr);gap:clamp(2rem,5vw,6rem);align-items:center;color:#eee9dc;background:radial-gradient(circle at 72% 38%,rgba(63,111,112,.42),transparent 31%),radial-gradient(circle at 15% 80%,rgba(161,61,49,.15),transparent 30%),linear-gradient(145deg,#10191c,#142528 58%,#0d1517)}.hero-copy{position:relative;z-index:2}.eyebrow,.chapter-no,.sources>div>p{margin:0 0 1.25rem;color:#bd7f67;font:600 .68rem var(--sans);letter-spacing:.24em;text-transform:uppercase}.hero h1{margin:0;font:clamp(4.5rem,9.4vw,9rem)/.9 var(--display);font-weight:400}.hero h1 em,.chapter-intro h2 em,.conclusion h2 em{color:#efc77c;font-style:normal}.lead{max-width:42rem;margin:1.7rem 0;color:#c0cdcb;font-size:clamp(1rem,1.35vw,1.2rem);line-height:1.95}.hero blockquote{max-width:40rem;margin:1.6rem 0 2rem;padding:1rem 0 1rem 1.25rem;border-left:2px solid var(--cinnabar);color:#e9dfca;font:clamp(1rem,1.45vw,1.24rem)/1.8 var(--display)}.hero blockquote cite{display:block;color:#859b99;font:.7rem var(--sans);font-style:normal}.start-link{display:inline-flex;gap:2rem;padding:.7rem 0;border-bottom:1px solid rgba(239,199,124,.5);color:#efc77c;text-decoration:none;font:.78rem var(--sans);letter-spacing:.14em}
.hero-city{position:relative;width:min(36rem,86vw);aspect-ratio:1;margin:auto;overflow:hidden;border:1px solid rgba(239,199,124,.27);background:repeating-linear-gradient(0deg,transparent 0 13%,rgba(239,199,124,.14) 13% 13.4%),repeating-linear-gradient(90deg,transparent 0 13%,rgba(239,199,124,.14) 13% 13.4%),rgba(255,255,255,.02);transform:rotateX(57deg) rotateZ(-42deg);box-shadow:0 2.5rem 4rem rgba(0,0,0,.25);transition:transform 1s ease}.hero-wall{position:absolute;inset:5%;border:3px double rgba(239,199,124,.55)}.hero-axis{position:absolute;top:5%;bottom:5%;left:49%;width:2.5%;background:rgba(161,61,49,.45);transition:width .5s}.hero-river{position:absolute;top:-10%;left:55%;width:13%;height:120%;border:2px solid transparent;background:var(--river);opacity:0;transform:rotate(16deg);transition:opacity .4s,transform .6s}.hero-river:after{content:"";position:absolute;left:-110%;top:48%;width:330%;height:20%;background:var(--river);transform:rotate(67deg)}.hero-palace,.hero-market{position:absolute;z-index:3;display:grid;place-items:center;border:1px solid rgba(255,255,255,.35);font:1.6rem var(--display)}.hero-palace{inset:39%;color:#f5db9f;background:var(--cinnabar)}.hero-market{top:17%;left:40%;width:20%;height:12%;color:#132024;background:var(--gold)}.hero-gates i{position:absolute;width:7%;height:2.5%;background:#efc77c}.hero-gates i:nth-child(1){top:3.5%;left:46.5%}.hero-gates i:nth-child(2){bottom:3.5%;left:46.5%}.hero-gates i:nth-child(3){top:48.5%;left:3.5%;transform:rotate(90deg)}.hero-gates i:nth-child(4){top:48.5%;right:3.5%;transform:rotate(90deg)}.hero-city>span{position:absolute;color:#efd49c;font:1rem var(--display)}.hero-city .north{top:7%;right:8%}.hero-city .south{bottom:7%;left:8%}.hero-crowd{position:absolute;inset:0;z-index:4;opacity:0;transition:opacity .5s}.hero-crowd i{position:absolute;width:5px;height:5px;border-radius:50%;background:#f0d394;box-shadow:0 0 8px rgba(240,211,148,.7);animation:crowd-drift 2.8s ease-in-out infinite alternate}.hero-city[data-life="high"]{transform:rotateX(50deg) rotateZ(-36deg)}.hero-city[data-life="high"] .hero-river{opacity:.72;transform:rotate(11deg)}.hero-city[data-life="high"] .hero-crowd{opacity:1}.hero-city[data-life="high"] .hero-axis{width:1.3%}.hero-control{position:absolute;right:clamp(1.4rem,6vw,7rem);bottom:3rem;width:min(32rem,42vw);padding:1rem 1.2rem;border:1px solid rgba(255,255,255,.11);background:rgba(6,14,16,.58);backdrop-filter:blur(9px)}.hero-control div{display:flex;justify-content:space-between;font:.7rem var(--sans);letter-spacing:.08em}.hero-control b{color:#efc77c}.hero-control input{width:100%;margin:.8rem 0;accent-color:var(--cinnabar)}.hero-control p{margin:0;color:#9cafad;font-size:.75rem;line-height:1.6}
.thesis-strip{display:flex;padding:1.45rem clamp(1.5rem,6vw,6rem);align-items:center;justify-content:space-between;gap:2rem;border-block:1px solid var(--line);color:var(--muted);font:.74rem var(--sans);letter-spacing:.08em}.thesis-strip strong{color:var(--ink);font:clamp(1.4rem,2.7vw,2.5rem) var(--display);font-weight:400}.chapter{display:grid;min-height:100vh;padding:clamp(6rem,10vw,10rem) clamp(1.4rem,6vw,6.5rem);grid-template-columns:minmax(16rem,.34fr) minmax(0,.66fr);gap:clamp(3rem,7vw,8rem);align-items:start}.chapter-intro{position:sticky;top:7.5rem}.chapter-intro h2{margin:.7rem 0 1.6rem;font:clamp(3.4rem,6.2vw,6.5rem)/1.08 var(--display);font-weight:400}.chapter-paper .chapter-intro h2 em,.chapter-river .chapter-intro h2 em,.chapter-water .chapter-intro h2 em{color:var(--cinnabar)}.chapter-intro>p:last-child{max-width:30rem;color:var(--muted);font-size:1rem;line-height:1.95}.stage{min-width:0;border:1px solid var(--line);background:rgba(255,255,255,.2)}.stage-head{display:flex;padding:1rem 1.2rem;align-items:center;gap:1.5rem;border-bottom:1px solid var(--line);font:.7rem var(--sans);letter-spacing:.08em}.stage-head span{color:var(--cinnabar)}.stage-head b{font-weight:500}.stage-head small{margin-left:auto;color:var(--muted)}
.build-workspace{display:grid;grid-template-columns:9rem minmax(18rem,1fr) minmax(13rem,.72fr);min-height:37rem}.piece-tray{display:flex;padding:.8rem;flex-direction:column;gap:.45rem;border-right:1px solid var(--line)}.city-piece{display:grid;padding:.65rem;grid-template-columns:2.4rem 1fr;align-items:center;gap:.5rem;border:1px solid transparent;color:var(--ink);background:transparent;text-align:left;cursor:pointer}.city-piece:hover,.city-piece:focus-visible,.city-piece.is-selected{border-color:var(--cinnabar);background:rgba(161,61,49,.07)}.city-piece span{display:grid;width:2.2rem;height:2.2rem;place-items:center;color:white;background:var(--cinnabar);font:1.2rem var(--display)}.city-piece b{font-size:.68rem;font-weight:400;line-height:1.35}.ideal-plan-wrap{display:grid;padding:2rem 1rem;place-items:center;align-content:center}.plan-north,.plan-south{color:var(--muted);font:.65rem var(--sans);letter-spacing:.15em}.ideal-plan{position:relative;display:grid;width:min(100%,30rem);aspect-ratio:1;margin:.65rem 0;grid-template-columns:repeat(5,1fr);border:3px double var(--ink);background:linear-gradient(90deg,transparent 48%,rgba(161,61,49,.2) 48% 52%,transparent 52%)}.plan-cell{position:relative;border:0;border-right:1px solid var(--line);border-bottom:1px solid var(--line);color:var(--ink);background:transparent;cursor:pointer}.plan-cell:nth-child(5n){border-right:0}.plan-cell:nth-last-child(-n+5){border-bottom:0}.plan-cell:hover,.plan-cell:focus-visible{background:rgba(63,111,112,.1)}.plan-cell span{display:grid;position:absolute;inset:17%;place-items:center;color:white;background:var(--cinnabar);font:clamp(1rem,2vw,1.7rem) var(--display);box-shadow:0 .4rem 1rem rgba(29,41,42,.16)}.plan-cell span[data-piece="market"]{color:var(--ink);background:var(--gold)}.plan-cell span[data-piece="ancestor"],.plan-cell span[data-piece="soil"]{background:var(--jade)}.plan-cell span[data-piece="court"]{color:var(--cinnabar);background:#e6d6bd;border:1px solid var(--cinnabar)}.build-reading{padding:2rem 1.4rem;border-left:1px solid var(--line);align-self:stretch}.build-reading>span,.terrain-reading>span{color:var(--cinnabar);font:.68rem var(--sans);letter-spacing:.14em}.build-reading h3,.terrain-reading h3{margin:1rem 0;font:2rem/1.25 var(--display);font-weight:400}.build-reading p,.terrain-reading p{color:var(--muted);line-height:1.85}.relation-meter{margin:2rem 0 1rem;padding-top:1rem;border-top:1px solid var(--line)}.relation-meter span{display:block;color:var(--muted);font:.68rem var(--sans)}.relation-meter b{display:block;margin-top:.4rem;color:var(--cinnabar);font:1.8rem var(--display);font-weight:400}.text-button{padding:.4rem 0;border:0;border-bottom:1px solid var(--line);color:var(--muted);background:none;cursor:pointer}.finding{display:flex;margin:0;padding:1.3rem 1.5rem;justify-content:space-between;gap:2rem;border-top:1px solid var(--line)}.finding b{font:1.2rem var(--display);font-weight:400}.finding span{color:var(--muted);font-size:.85rem}
.chapter-night{color:#eee7d8;background:var(--night)}.chapter-night .chapter-intro>p:last-child{color:#aebdba}.chapter-night .stage{border-color:var(--line-light);background:rgba(255,255,255,.025)}.chapter-night .chapter-no{color:#d09378}.chang-an-stage{padding:1.4rem}.time-head{display:flex;padding-bottom:1.2rem;align-items:center;gap:1rem}.time-head span{color:#8fa6a3;font:.68rem var(--sans);letter-spacing:.12em}.time-head strong{margin-left:auto;color:#f0cf91;font:1.3rem var(--display);font-weight:400}.time-head b{padding:.3rem .55rem;color:#142225;background:var(--gold);font:.65rem var(--sans);font-weight:500}.chang-an-shell{display:grid;grid-template-columns:minmax(20rem,1.2fr) minmax(15rem,.8fr);border:1px solid var(--line-light)}.chang-an-map{display:grid;min-height:34rem;padding:1.2rem;grid-template-columns:repeat(6,1fr);gap:.7rem;border-right:1px solid var(--line-light);background:linear-gradient(90deg,transparent 48.9%,rgba(161,61,49,.45) 49% 51%,transparent 51%)}.ward{position:relative;display:grid;min-height:4.1rem;place-items:center;border:1px solid rgba(239,199,124,.32);color:#8fa5a2;background:rgba(255,255,255,.025);font:.6rem var(--sans);transition:opacity .35s,background .35s}.ward:before,.ward:after{content:"";position:absolute;background:var(--gold);transition:opacity .3s}.ward:before{bottom:-2px;left:44%;width:12%;height:4px}.ward:after{top:44%;right:-2px;width:4px;height:12%}.chang-an-map.is-closed .ward{opacity:.62;background:rgba(0,0,0,.18)}.chang-an-map.is-closed .ward:before,.chang-an-map.is-closed .ward:after{opacity:.12}.ward.market{color:#162225;background:rgba(195,154,84,.85)}.ward.palace{color:#f2dcae;background:rgba(161,61,49,.72);grid-column:3/5}.ward.is-accessible{box-shadow:inset 0 0 0 2px #f0cf91}.role-panel{padding:2rem 1.4rem}.role-panel>span{color:#8fa6a3;font:.68rem var(--sans);letter-spacing:.12em}.role-tabs{display:flex;margin:1rem 0 2rem;flex-wrap:wrap;gap:.45rem}.role-tabs button{padding:.5rem .7rem;border:1px solid var(--line-light);color:#bdc7c4;background:transparent;cursor:pointer}.role-tabs button.is-active{color:#172225;background:var(--gold)}.role-panel h3{font:1.7rem/1.35 var(--display);font-weight:400}.role-panel p{color:#adbcba;line-height:1.8}.access-list{display:flex;margin-top:1.4rem;flex-wrap:wrap;gap:.4rem}.access-list span{padding:.35rem .55rem;border:1px solid var(--line-light);color:#9aaca9;font:.68rem var(--sans)}.access-list span.yes{color:#f0cf91;border-color:rgba(240,207,145,.55)}.range-label{display:flex;margin-top:1.5rem;justify-content:space-between;color:#8fa6a3;font:.68rem var(--sans)}.range-label b{color:#d8dfdc;font-weight:400}.stage>input[type=range],.terrain-reading>input[type=range]{width:100%;margin:.9rem 0;accent-color:var(--cinnabar)}.finding.inverse{margin:1rem -1.4rem -1.4rem;border-color:var(--line-light)}.finding.inverse span{color:#9fb0ad}
.chapter-river{background:#e3ddcf}.flow-stage{background:#d8d0be}.flow-layout{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(15rem,.5fr)}#kaifeng-canvas{display:block;width:100%;height:auto;min-height:35rem;background:#182b2f}.flow-controls{padding:1.5rem;border-left:1px solid var(--line)}.flow-controls>p{margin:0 0 2rem;padding-bottom:1.2rem;border-bottom:1px solid var(--line)}.flow-controls>p span{display:block;color:var(--muted);font:.65rem var(--sans);letter-spacing:.12em}.flow-controls>p strong{display:block;margin-top:.7rem;font:1.25rem/1.5 var(--display);font-weight:400}.flow-controls label{display:flex;margin-top:1.15rem;justify-content:space-between;color:var(--muted);font:.72rem var(--sans)}.flow-controls label b{color:var(--cinnabar)}.flow-controls input{width:100%;accent-color:var(--cinnabar)}.legend{display:grid;margin-top:1.8rem;gap:.7rem;color:var(--muted);font:.65rem var(--sans)}.legend i{display:inline-block;width:.5rem;height:.5rem;margin-right:.5rem;border-radius:50%}.dot-person{background:#efd49c}.dot-goods{background:#77b7b5}.dot-market{background:#c15845}
.chapter-water{background:var(--paper)}.terrain-stage{background:#e6dfd0}.terrain-layout{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(16rem,.75fr)}.terrain-visual{position:relative;min-width:0;background:#14282b}#suzhou-canvas{display:block;width:100%;height:auto;min-height:36rem}.terrain-caption{position:absolute;left:1rem;right:1rem;bottom:1rem;display:flex;padding:.8rem 1rem;justify-content:space-between;color:#e8e0ce;background:rgba(10,22,24,.78);font:.68rem var(--sans);backdrop-filter:blur(8px)}.terrain-caption b{color:#efd49c;font-weight:400}.terrain-reading{padding:2rem 1.5rem;border-left:1px solid var(--line)}.range-label.stacked{display:grid;gap:.45rem}.range-label.stacked b{color:var(--ink)}.constraint-list{display:grid;margin-top:1.5rem}.constraint-list div{display:grid;padding:.8rem 0;grid-template-columns:2.2rem 1fr;gap:.7rem;border-top:1px solid var(--line);opacity:.35;transition:opacity .3s}.constraint-list div.is-active{opacity:1}.constraint-list span{display:grid;width:1.9rem;height:1.9rem;place-items:center;color:white;background:var(--jade);font:1rem var(--display)}.constraint-list b{color:var(--muted);font-size:.72rem;font-weight:400;line-height:1.65}
.conclusion{padding:clamp(7rem,12vw,12rem) clamp(1.4rem,7vw,8rem);color:#eee8dc;background:linear-gradient(150deg,#111d20,#182c30)}.conclusion h2{max-width:70rem;margin:0 0 4rem;font:clamp(3.4rem,7vw,7rem)/1.08 var(--display);font-weight:400}.principles{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid var(--line-light)}.principles article{min-height:15rem;padding:1.5rem;border-right:1px solid var(--line-light)}.principles article:last-child{border-right:0}.principles span{display:grid;width:2.7rem;height:2.7rem;place-items:center;color:#172225;background:var(--gold);font:1.5rem var(--display)}.principles b{display:block;margin-top:2.4rem;font:1.45rem var(--display);font-weight:400}.principles p{color:#8fa6a3;font:.7rem/1.6 var(--sans)}.today-question{display:grid;margin-top:4rem;padding:2rem 0;grid-template-columns:.5fr 1fr 1fr;gap:3rem;border-block:1px solid var(--line-light);align-items:start}.today-question span{color:#d09378;font:.68rem var(--sans);letter-spacing:.14em}.today-question p{margin:0;color:#b8c5c2;line-height:1.9}.today-question strong{color:#efc77c;font:1.8rem/1.5 var(--display);font-weight:400}
.sources{display:grid;padding:clamp(5rem,8vw,8rem) clamp(1.4rem,7vw,8rem);grid-template-columns:.28fr .72fr;gap:4rem;background:var(--paper-deep)}.sources h2{font:3rem var(--display);font-weight:400}.source-grid{display:grid;grid-template-columns:1fr 1fr;border:1px solid var(--line)}.source-grid a{display:grid;min-height:10rem;padding:1.2rem;text-decoration:none;border-right:1px solid var(--line);border-bottom:1px solid var(--line)}.source-grid a:nth-child(2n){border-right:0}.source-grid a:nth-last-child(-n+2){border-bottom:0}.source-grid span{color:var(--cinnabar);font:.65rem var(--sans);letter-spacing:.1em}.source-grid b{margin-top:.7rem;font:1.1rem/1.5 var(--display);font-weight:400}.source-grid i{margin-top:auto;color:var(--muted);font:.65rem var(--sans);font-style:normal}.source-note{grid-column:2;max-width:55rem;margin:0;color:var(--muted);font-size:.78rem;line-height:1.8}footer{display:flex;min-height:9rem;padding:2rem clamp(1.4rem,6vw,6rem);align-items:center;gap:2rem;background:#d3c8b3}footer b{font:1.5rem var(--display);font-weight:400}footer span{color:var(--muted)}footer a{margin-left:auto;color:var(--cinnabar);text-decoration:none}
.hero-crowd i{width:7px;height:12px;border-radius:4px 4px 2px 2px;background:var(--person-color,#f0d394);box-shadow:0 0 8px color-mix(in srgb,var(--person-color,#f0d394),transparent 35%)}.hero-crowd i:before{content:"";position:absolute;left:1px;top:-6px;width:5px;height:5px;border-radius:50%;background:inherit}.hero-crowd i:after{content:"";position:absolute;left:1px;bottom:-5px;width:5px;height:6px;border-left:2px solid var(--person-color,#f0d394);border-right:2px solid var(--person-color,#f0d394)}
.ideal-plan-wrap{grid-template-columns:3.2rem minmax(0,1fr) 3.2rem;grid-template-rows:auto 1fr auto}.plan-north,.plan-south{grid-column:1/-1}.ideal-plan{grid-column:2}.plan-side{color:var(--muted);font:.65rem/1.45 var(--sans);text-align:center}.plan-side b{display:block;margin:.45rem 0;color:var(--ink);font-weight:500;writing-mode:vertical-rl}.plan-side em{display:block;color:var(--cinnabar);font:1rem var(--display);font-style:normal;writing-mode:vertical-rl}.plan-west{grid-column:1;grid-row:2}.plan-east{grid-column:3;grid-row:2}.plan-cell span{align-content:center;text-align:center}.plan-cell span b{font:clamp(1rem,2vw,1.7rem) var(--display);font-weight:400}.plan-cell span small{display:block;margin-top:.1rem;font:.44rem var(--sans);letter-spacing:.04em;white-space:nowrap}.plan-cell .placed-mark{z-index:3}.plan-cell .ideal-ghost{z-index:1;inset:8%;border:1px dashed rgba(161,61,49,.62);color:rgba(161,61,49,.62);background:repeating-linear-gradient(135deg,rgba(161,61,49,.08) 0 5px,transparent 5px 10px);box-shadow:none;pointer-events:none;animation:ghost-breathe 2.4s ease-in-out infinite}.plan-cell .ideal-ghost b{font-size:clamp(1rem,1.8vw,1.5rem)}.plan-cell .ideal-ghost small{font-size:.4rem;line-height:1.35}.plan-cell .ideal-ghost[data-ghost-piece="ancestor"],.plan-cell .ideal-ghost[data-ghost-piece="soil"]{border-color:rgba(63,111,112,.68);color:rgba(63,111,112,.72);background:repeating-linear-gradient(135deg,rgba(63,111,112,.1) 0 5px,transparent 5px 10px)}.plan-cell .ideal-ghost[data-ghost-piece="market"]{border-color:rgba(159,116,41,.72);color:rgba(126,88,25,.78);background:repeating-linear-gradient(135deg,rgba(195,154,84,.13) 0 5px,transparent 5px 10px)}.plan-cell.has-ideal-ghost{background:rgba(255,255,255,.18)}.ghost-key{display:flex!important;margin:0 0 1.25rem!important;align-items:center;gap:.55rem;color:var(--muted)!important;font:.64rem/1.45 var(--sans)!important}.ghost-key i{display:block;width:1.8rem;height:1.15rem;border:1px dashed rgba(161,61,49,.6);background:repeating-linear-gradient(135deg,rgba(161,61,49,.08) 0 4px,transparent 4px 8px)}.plan-people{position:absolute;inset:0;z-index:5;pointer-events:none;opacity:0;transition:opacity .35s}.ideal-plan.has-people .plan-people{opacity:1}.plan-people i{position:absolute;left:var(--px);top:var(--py);width:5px;height:10px;border-radius:3px 3px 1px 1px;background:var(--cinnabar);box-shadow:0 1px 4px rgba(29,41,42,.35);animation:plan-walk 2.2s ease-in-out infinite alternate}.plan-people i:before{content:"";position:absolute;left:.5px;top:-4px;width:4px;height:4px;border-radius:50%;background:inherit}.plan-people i:nth-child(3n){background:var(--jade)}.plan-people i:nth-child(4n){background:var(--gold)}.build-actions{display:flex;align-items:flex-start;flex-direction:column;gap:.55rem}.text-button.primary{padding:.55rem .7rem;border:1px solid var(--cinnabar);color:var(--cinnabar)}
.chang-an-map{position:relative}.chang-an-people{position:absolute;inset:0;z-index:7;overflow:hidden;pointer-events:none}.chang-an-people i{--person:#e8d3a3;position:absolute;left:var(--x);top:var(--y);width:7px;height:13px;border-radius:4px 4px 2px 2px;background:var(--person);filter:drop-shadow(0 0 4px rgba(0,0,0,.65));animation:chang-an-walk 3.6s ease-in-out infinite alternate}.chang-an-people i:before{content:"";position:absolute;left:1px;top:-6px;width:5px;height:5px;border-radius:50%;background:inherit}.chang-an-people i:after{content:"";position:absolute;left:1px;bottom:-5px;width:5px;height:6px;border-left:2px solid var(--person);border-right:2px solid var(--person)}.chang-an-people i[data-role="official"]{--person:#e2b45f}.chang-an-people i[data-role="merchant"]{--person:#74aaa5}.chang-an-people i[data-role="monk"]{--person:#c27b5f}.chang-an-people i[data-role="resident"]{--person:#ddd5c2}.chang-an-people i.is-focus{z-index:3;outline:2px solid #fff2c9;outline-offset:3px;filter:drop-shadow(0 0 8px rgba(240,207,145,.95))}.chang-an-map.is-closed .chang-an-people i{animation-duration:7s;opacity:.72}.role-portrait{position:relative;display:grid;width:6.2rem;height:7.2rem;margin:1.2rem 0 1.5rem;place-items:center;align-content:center;border:1px solid var(--line-light);background:rgba(255,255,255,.04)}.role-portrait i{position:relative;width:1.7rem;height:2.5rem;margin-top:.5rem;border-radius:.7rem .7rem .2rem .2rem;background:#d9ab59}.role-portrait i:before{content:"";position:absolute;left:.32rem;top:-1.1rem;width:1.05rem;height:1.05rem;border-radius:50%;background:#eddbb7}.role-portrait i:after{content:"";position:absolute;left:-.5rem;top:.55rem;width:2.7rem;height:.7rem;border-radius:1rem;background:#d9ab59}.role-portrait b{position:absolute;right:.5rem;top:.5rem;color:#f2d390;font:1.45rem var(--display);font-weight:400}.role-portrait small{margin-top:.7rem;color:#8fa6a3;font:.55rem var(--sans);letter-spacing:.1em}.role-portrait[data-role="merchant"] i,.role-portrait[data-role="merchant"] i:after{background:#5f9995}.role-portrait[data-role="monk"] i,.role-portrait[data-role="monk"] i:after{background:#a96650}.role-portrait[data-role="resident"] i,.role-portrait[data-role="resident"] i:after{background:#b9b4a9}.people-label{display:flex;margin-top:1.6rem;justify-content:space-between;color:#a9b7b4;font:.7rem var(--sans)}.people-label b{color:#f0cf91;font-weight:400}.role-panel>#crowd-slider{width:100%;accent-color:var(--gold)}.people-count{display:flex!important;margin-top:1rem!important;align-items:center;gap:.7rem}.people-count b{color:#f0cf91;font:2rem var(--display);font-weight:400}.people-count span{color:#8fa6a3;font:.65rem/1.5 var(--sans)}
@keyframes crowd-drift{to{transform:translate(22px,-18px)}}@keyframes plan-walk{to{transform:translate(9px,-7px)}}@keyframes chang-an-walk{to{transform:translate(var(--tx),var(--ty))}}@keyframes ghost-breathe{50%{opacity:.48;transform:scale(.94)}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.hero-crowd i,.plan-people i,.chang-an-people i,.ideal-ghost{animation:none}*{transition-duration:.01ms!important}}
@media(max-width:980px){.hero{grid-template-columns:1fr;padding-bottom:10rem}.hero-city{width:min(31rem,80vw)}.hero-control{left:1.4rem;right:1.4rem;width:auto}.chapter{grid-template-columns:1fr;min-height:auto}.chapter-intro{position:static}.build-workspace{grid-template-columns:7.5rem 1fr}.build-reading{grid-column:1/-1;border-left:0;border-top:1px solid var(--line)}.chang-an-shell,.flow-layout,.terrain-layout{grid-template-columns:1fr}.chang-an-map,.flow-controls,.terrain-reading{border-left:0;border-right:0;border-top:1px solid var(--line)}.chang-an-map{border-top:0}.principles{grid-template-columns:1fr 1fr}.principles article:nth-child(2){border-right:0}.principles article:nth-child(-n+2){border-bottom:1px solid var(--line-light)}.today-question{grid-template-columns:1fr 1fr}.today-question span{grid-column:1/-1}.sources{grid-template-columns:1fr}.source-note{grid-column:1}}
@media(max-width:650px){.masthead{grid-template-columns:1fr auto}.masthead nav{display:none}.brand b{display:none}.home-link{font-size:0}.home-link:before{content:"华夏";font-size:.72rem}.hero{padding-top:4rem}.hero h1{font-size:4.4rem}.hero-city{width:86vw}.hero-control{bottom:1.5rem}.thesis-strip{flex-direction:column;text-align:center}.stage-head{align-items:flex-start;flex-direction:column;gap:.35rem}.stage-head small{margin-left:0}.build-workspace{grid-template-columns:1fr}.piece-tray{display:grid;grid-template-columns:repeat(5,1fr);border-right:0;border-bottom:1px solid var(--line)}.city-piece{display:block;padding:.35rem;text-align:center}.city-piece span{margin:auto}.city-piece b{display:none}.ideal-plan-wrap{padding:1.3rem .7rem}.chang-an-map{min-height:27rem;gap:.35rem;padding:.7rem}.ward{min-height:3rem}.finding{align-items:flex-start;flex-direction:column}.principles{grid-template-columns:1fr}.principles article{min-height:11rem;border-right:0;border-bottom:1px solid var(--line-light)!important}.principles article:last-child{border-bottom:0!important}.today-question{grid-template-columns:1fr;gap:1.3rem}.today-question span{grid-column:auto}.source-grid{grid-template-columns:1fr}.source-grid a{border-right:0!important;border-bottom:1px solid var(--line)!important}.source-grid a:last-child{border-bottom:0!important}footer{align-items:flex-start;flex-direction:column}footer a{margin-left:0}}
