/* Expansion (visual rebuild 01.10.2026), scoped .xp on l2.css. Device: one system across conditions, ending in the chain that carries the orders. */
.xp .l2-f{--hv:56;--bg:#fff}.xp .l2-b{--bg:#000}.xp .xp-hero{--hv:74}.xp .xp-s3{--hv:64}.xp .xp-ev{--hv:66}.xp .xp-br{--hv:56}
.xp .xp-cv{position:absolute;inset:0}.xp .xp-cv svg{width:100%;height:100%}
.xp .xp-fig{position:relative;margin:0}.xp .xp-fig .xp-cv{position:absolute;inset:0}
.xp .xp-lb{position:absolute;transform:translate(-50%,-50%);left:0;top:0;font:600 15px/1.25 var(--sans);letter-spacing:.14em;text-transform:uppercase;white-space:nowrap;paint-order:stroke;-webkit-text-stroke:7px var(--bg);z-index:2}
.xp .xp-word{grid-column:1/-1;grid-row:1;font-weight:850;font-stretch:108%;font-size:calc(15*var(--u));letter-spacing:-.045em;line-height:.9;margin-left:calc(-.4*var(--u))}
.xp .xp-hero .xp-k{grid-column:1/6;grid-row:2;align-self:center;font-size:calc(4.6*var(--u));font-weight:800;font-stretch:108%;letter-spacing:-.04em;line-height:1.04;margin-top:calc(2*var(--u))}
.xp .xp-steps{grid-column:1/6;grid-row:3;display:flex;flex-wrap:wrap;gap:calc(.8*var(--u)) calc(2.4*var(--u));margin-top:calc(1.4*var(--u))}.xp .xp-steps button{all:unset;cursor:pointer;font-size:clamp(15px,calc(1.7*var(--u)),24px);font-weight:600;letter-spacing:-.01em;border-bottom:1.5px solid #000;padding-bottom:3px}.xp .xp-steps .n{margin-right:.5em;font-weight:400}.xp .xp-steps button:focus-visible{outline:2px solid #000;outline-offset:4px}.xp .xp-hero .xp-fig{grid-column:6/-1;grid-row:2/4;height:calc(40*var(--u));margin-top:calc(1.5*var(--u))}
.xp .xp-tx{align-self:center}
.xp .xp-n{margin:0 0 calc(1.2*var(--u));font-size:calc(4.2*var(--u));line-height:1}
.xp .xp-h{margin:0;font-size:calc(5.6*var(--u));font-weight:850;font-stretch:108%;letter-spacing:-.045em;line-height:1}
.xp .xp-p{margin:calc(2.2*var(--u)) 0 0;font-size:clamp(17px,calc(2.3*var(--u)),34px);font-weight:300;letter-spacing:-.015em;line-height:1.25}
.xp .xp-s1 .xp-tx{grid-column:1/6;grid-row:1}.xp .xp-s1 .xp-fig{grid-column:6/-1;grid-row:1;height:calc(40*var(--u))}
.xp .xp-s2 .xp-fig{grid-column:1/7;grid-row:1;height:calc(42*var(--u))}.xp .xp-s2 .xp-tx{grid-column:8/-1;grid-row:1}.xp .xp-s2 .xp-h{font-size:calc(4.8*var(--u))}
.xp .xp-s3 .xp-tx{grid-column:1/6;grid-row:1}.xp .xp-s3 .xp-fig{grid-column:6/-1;grid-row:1;height:calc(44*var(--u))}
.xp .xp-key{margin:calc(2.6*var(--u)) 0 0}.xp .xp-key div{padding:calc(1*var(--u)) 0;border-top:1px solid #fff}.xp .xp-key dt{margin:0 0 calc(.4*var(--u))}.xp .xp-key dd{margin:0;font-size:clamp(16px,calc(2*var(--u)),30px);font-weight:500;letter-spacing:-.02em;line-height:1.2}
.xp .xp-ev .xp-evl{grid-column:1/6;grid-row:1;align-self:center}.xp .xp-evk{margin:calc(1.2*var(--u)) 0 0;font-size:calc(4.6*var(--u));font-weight:850;font-stretch:108%;letter-spacing:-.04em;line-height:1.04}
.xp .xp-more{list-style:none;padding:0;margin:calc(3*var(--u)) 0 0}.xp .xp-more li{padding:calc(1*var(--u)) 0;border-top:1px solid #000;font-size:clamp(16px,calc(2*var(--u)),30px);font-weight:500;letter-spacing:-.02em;line-height:1.2}
.xp .xp-loop{grid-column:6/-1;grid-row:1;position:relative;height:calc(46*var(--u));--R:calc(11.5*var(--u))}
.xp .xp-lc{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:calc(17*var(--u));margin:0;text-align:center;font-family:var(--serif);font-style:italic;font-size:clamp(16px,calc(2*var(--u)),30px);line-height:1.2}
.xp .xp-ring{list-style:none;margin:0;padding:0}.xp .xp-ring li{position:absolute;left:calc(50% + var(--R)*cos(var(--a)));top:calc(50% + var(--R)*sin(var(--a)));width:0;height:0}

.xp .xp-ring li span{position:absolute;width:calc(11*var(--u));font-size:clamp(15px,calc(1.9*var(--u)),28px);font-weight:700;letter-spacing:-.02em;line-height:1.1;top:0;transform:translateY(-50%)}

.xp .xp-ring li:nth-child(1) span{left:calc(-9*var(--u));bottom:calc(1.4*var(--u));top:auto;transform:none;text-align:center;width:calc(18*var(--u))}.xp .xp-ring li:nth-child(4) span{left:calc(-9*var(--u));top:calc(1.4*var(--u));transform:none;text-align:center;width:calc(18*var(--u))}
.xp .xp-ring li:nth-child(2) span,.xp .xp-ring li:nth-child(3) span{left:calc(1.6*var(--u))}.xp .xp-ring li:nth-child(5) span,.xp .xp-ring li:nth-child(6) span{right:calc(2*var(--u));text-align:right}
.xp .xp-br .xp-xh{grid-column:1/-1;grid-row:1}.xp .xp-brk{grid-column:1/8;grid-row:2;font-size:calc(5*var(--u));font-weight:850;font-stretch:108%;letter-spacing:-.04em;line-height:1.04;margin-top:calc(1.6*var(--u))}
.xp .xp-nx{grid-column:1/-1;grid-row:3;margin-top:calc(5*var(--u));display:grid;grid-template-columns:1fr auto;align-items:end;column-gap:calc(2*var(--u))}
.xp .xp-nx .n{grid-row:1;font-size:calc(10*var(--u));font-weight:900;font-stretch:108%;letter-spacing:-.05em;line-height:1}.xp .xp-nx .q{grid-row:2;font-family:var(--serif);font-style:italic;font-size:clamp(18px,calc(2.4*var(--u)),36px);line-height:1.15;margin-top:calc(1*var(--u))}.xp .xp-nx .l2-plus{grid-row:1/3;grid-column:2}
.xp .xp-open{z-index:0!important}
@media (max-width:760px){
  .xp .xp-word{font-size:clamp(44px,15.5vw,70px);margin-left:0}.xp .xp-hero .xp-k{font-size:clamp(26px,8vw,36px)}
  .xp .xp-hero .xp-fig,.xp .xp-s1 .xp-fig,.xp .xp-s2 .xp-fig,.xp .xp-s3 .xp-fig{height:92vw}.xp .xp-s2 .xp-fig{order:2}
  .xp .xp-h,.xp .xp-evk,.xp .xp-brk{font-size:clamp(28px,8.6vw,40px)}.xp .xp-n{font-size:30px}.xp .xp-p,.xp .xp-key dd{font-size:18px}
  .xp .xp-loop{height:auto}.xp .xp-loop .xp-cv{position:relative;height:84vw}.xp .xp-lc{position:static;transform:none;width:auto;margin:16px 0}
  .xp .xp-ring li{position:static;width:auto;height:auto;border-top:1px solid #000}.xp .xp-ring li span{position:static;transform:none!important;display:block;padding:10px 0;white-space:normal;text-align:left!important;font-size:20px}
  .xp .xp-nx .n{font-size:clamp(44px,15vw,70px)}.xp .xp-nx .q{font-size:20px}.xp .xp-open{opacity:.0}
}
/* v3 B-F06: the ring line stays behind the question */
.xp .xp-nx{position:relative;z-index:60}.xp .xp-nx .q{position:relative;z-index:61;background:#000;display:inline-block;padding:0 .35em;margin-left:-.35em}
/* v3 narrative: what Lena decides, stated under the three layers */
.xp .xp-lena{margin:calc(2.4*var(--u)) 0 0;font-family:var(--serif);font-style:italic;font-weight:400;font-size:clamp(17px,calc(2*var(--u)),28px);line-height:1.25;max-width:26em}

/* 08.10.2026: the three state switches use their own attribute (data-xgo). The global data-go belongs to the Layer 1 chapters and sent these buttons to Complexity, Connect and System. They keep the same touch target. */
@media (max-width:760px),(pointer:coarse){.ov .xp-steps [data-xgo]{min-height:44px!important}}
/* 08.10.2026 mobile: the stations of the chain use the full width of the list; the width meant for the ring drawing made each label wrap word by word */
@media (max-width:760px){.xp .xp-ring li span{width:auto!important}}
@media (max-width:380px){.xp .xp-lb[data-l="copy"]{white-space:normal;width:7.8em;text-align:center;line-height:1.2}}
