@font-face{font-family:D-DIN;src:url('/fonts/D-DIN.otf');font-weight:100 500;font-display:swap}
@font-face{font-family:D-DIN;src:url('/fonts/D-DIN-Bold.otf');font-weight:600 900;font-display:swap}
:root{color-scheme:light;--bg:#fff;--panel:#f7f7f7;--soft:#f2f2f2;--line:#dedede;--ink:#171717;--muted:#666;--faint:#8a8a8a;--acid:#171717;--sans:D-DIN,Arial,sans-serif;--mono:D-DIN,Arial,sans-serif}
html,body{background:#fff;color:#171717;font-family:D-DIN,Arial,sans-serif}.site-nav{display:none!important}
.hero{width:min(1055px,calc(100% - 64px));margin:28px auto 0}.hero-media{min-height:min(650px,calc(100svh - 130px));border:0;border-radius:12px;background:#171717}.hero-media video{filter:saturate(.78) brightness(.62)}.hero-copy{padding:64px 32px}.hero h1{max-width:100%;margin-inline:auto;color:#fff;font:600 clamp(40px,4.2vw,52px)/.98 D-DIN,Arial,sans-serif;letter-spacing:-.04em;text-transform:uppercase;white-space:normal;text-wrap:balance;overflow-wrap:anywhere}.hero p{font-size:17px;line-height:1.55;letter-spacing:0;color:#e4e4e4}.hero-tags{gap:10px;margin-top:30px}.hero-tags a{min-height:30px;padding:2px 14px 0;border:1px solid #ffffff70;border-radius:3px;background:#ffffff12;color:#fff;font:400 10px/1 D-DIN,Arial,sans-serif;display:inline-flex;align-items:center;justify-content:center;transition:background .18s,color .18s}.hero-tags a:first-child,.hero-tags a:hover{background:#fff;color:#171717}.hero-caption{padding:12px 0 0;color:#888;font:400 11px/16px D-DIN,Arial,sans-serif}
.statement{width:min(720px,calc(100% - 64px));padding:96px 0 82px}.statement span,.chapter-label,.loop-label{font:400 11px/16px D-DIN,Arial,sans-serif;color:#888}.statement h2{margin-top:16px;font:400 40px/43px D-DIN,Arial,sans-serif;letter-spacing:0;text-transform:uppercase}.statement p,.system-loop p{margin-top:20px;color:#666;font-size:16px;line-height:1.55;letter-spacing:0}.models{width:min(1055px,calc(100% - 64px));margin-bottom:88px;border-color:#dedede;border-radius:12px}.model-card{min-height:330px;padding:30px;background:#fafafa;color:#171717}.model-card+.model-card{border-color:#dedede}.model-card small{font:400 10px/1 D-DIN,Arial,sans-serif;color:#888}.model-card h3{margin-top:52px;font:600 clamp(46px,5vw,68px)/.9 D-DIN,Arial,sans-serif;letter-spacing:-.035em}.model-card p{color:#666;font-size:15px;line-height:1.5}.model-card b{color:#171717;font:400 10px/1 D-DIN,Arial,sans-serif}.system-loop{width:min(720px,calc(100% - 64px));margin-bottom:96px}
.chapter,.bridge{width:min(1055px,calc(100% - 64px))}.chapter{padding:74px 0 42px;border-color:#dedede}.chapter-head{grid-template-columns:.45fr 1.55fr;gap:40px}.chapter h2{font:600 clamp(54px,7vw,92px)/.9 D-DIN,Arial,sans-serif;letter-spacing:-.04em}.chapter-copy{padding-top:3px}.chapter-copy h3,#dao .chapter-copy h3{font:400 clamp(28px,3vw,38px)/1.1 D-DIN,Arial,sans-serif;letter-spacing:0;text-transform:uppercase}.chapter-copy p,#dao .chapter-copy p{color:#666;font-size:15px;line-height:1.6}.chapter-links{gap:10px}.chapter-links a{min-height:30px;padding:2px 14px 0;border:1px solid #00000020;border-radius:3px;background:#00000005;color:#555;font:400 10px/1 D-DIN,Arial,sans-serif;text-transform:uppercase;transition:background .18s,color .18s,transform .18s}.chapter-links a:hover{border-color:#171717;background:#171717;color:#fff}.chapter-link-icon,.chapter-link-icon svg{width:14px;height:14px;font-size:14px}.chapter-link-arrow{font-size:12px;color:inherit}.jing-intro-film{margin-top:36px;border-radius:12px;background:#111}.bridge{padding:86px 0 100px}.bridge:before{width:100%;background:#dedede}.bridge-lead{font:400 clamp(28px,3vw,40px)/1.2 D-DIN,Arial,sans-serif;letter-spacing:0;text-transform:uppercase}.bridge-body{margin-top:24px;color:#666;font-size:16px;line-height:1.55;letter-spacing:0}.exact-frame{background:#fff}
@media(max-width:900px){.hero,.models,.chapter,.bridge,.statement,.system-loop{width:calc(100% - 40px)}.hero{margin-top:16px}.hero-media{min-height:590px}.hero h1{white-space:normal}.chapter-head{grid-template-columns:1fr;gap:24px}.chapter h2{font-size:58px}.model-card{min-height:280px}.model-card+.model-card{border-left:0;border-top:1px solid #dedede}}
@media(max-width:560px){.hero,.models,.chapter,.bridge,.statement,.system-loop{width:calc(100% - 24px)}.hero-media{min-height:520px}.hero-copy{padding:52px 20px}.hero h1{font-size:38px}.hero p{font-size:15px}.statement{padding:70px 0 60px;text-align:left}.statement h2{font-size:30px;line-height:34px}.hero-tags{width:100%;align-items:stretch}.hero-tags a{width:100%}.chapter{padding-top:58px}.chapter h2{font-size:50px}.chapter-copy h3,#dao .chapter-copy h3{font-size:27px;white-space:normal}}
.exact-frame{height:1px;min-height:0;visibility:hidden}.exact-frame.is-ready{visibility:visible}
.dao-zone{background:#080a0b;color:#f2f3f5}
.dao-zone #dao{border-color:#2a2d31}
.dao-zone #dao h2,.dao-zone #dao h3{color:#f2f3f5}
.dao-zone #dao p{color:#a9adb5}
.dao-zone #dao-frame{background:#080a0b}
#dao.chapter{margin-inline:auto}
#dao .chapter-head{grid-template-columns:minmax(0,.45fr) minmax(0,1.55fr);gap:40px}
#dao .chapter-copy{min-width:0}
#dao .chapter-copy h3{max-width:100%;white-space:normal;overflow-wrap:anywhere}
#dao .chapter-copy p{max-width:100%}
/* Keep the desktop editorial titles within the same edges as their media. */
.hero-copy{width:100%;min-width:0}
.hero h1{max-width:100%;font-size:clamp(32px,4vw,52px);line-height:1.02;white-space:normal;overflow-wrap:normal;text-wrap:balance}
#jing .chapter-copy,#dao .chapter-copy{min-width:0}
#jing .jing-title,#dao .chapter-copy h3{max-width:100%!important;font-size:clamp(22px,2vw,30px)!important;line-height:1.15!important;white-space:normal!important;overflow-wrap:normal!important;text-wrap:balance}
#dao.chapter{width:min(1055px,calc(100% - 64px));margin-left:auto;margin-right:auto}
@media(min-width:901px){#dao.chapter{width:min(1180px,calc(100% - 40px))}}
@media(max-width:900px){#dao.chapter{width:calc(100% - 40px)}}
@media(max-width:560px){#dao.chapter{width:calc(100% - 24px)}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}

.frame-load-status{width:min(1055px,calc(100% - 40px));margin:16px auto;padding:16px;color:inherit;font:14px/1.5 D-DIN,Arial,sans-serif}.frame-load-status button{font:inherit;color:inherit;background:transparent;border:1px solid currentColor;border-radius:4px;padding:4px 10px;cursor:pointer}

/* Larger detail-page controls only for the compact Retina Mac profile. */
@media (min-width:1025px) and (pointer:fine){
  .macbook-pro-14 .hero-tags a,.macbook-pro-14 .chapter-links a{min-height:38px;padding:2px 18px 0;font-size:13px;line-height:1.2}
  .macbook-pro-14 .chapter-link-icon,.macbook-pro-14 .chapter-link-icon svg{width:18px;height:18px;font-size:18px}
  .macbook-pro-14 .chapter-link-arrow{font-size:16px}
}

/* Align JING and DAO sections; let the opening film span a wider canvas. */
.models,.chapter,.bridge,.statement,.system-loop,#dao.chapter{width:min(1180px,calc(100% - 80px));margin-inline:auto}
.hero{width:min(1360px,calc(100% - 64px))}
@media(max-width:760px){.models,.chapter,.bridge,.statement,.system-loop,#dao.chapter,.hero{width:calc(100% - 40px)}}

/* Any fractional iframe rounding below DAO must stay on its dark surface. */
html,body{background:#080a0b}main{display:flow-root;background:#fff}

/* Gallery shares the existing chapter action buttons. */
.gallery-entry .chapter-link-icon svg{fill:none;stroke:currentColor;stroke-width:1.3}
.chapter-links a:focus-visible{outline:1px solid currentColor;outline-offset:3px}

/* JING-DAO-19 editorial update, using the approved site typography. */
.models#system{margin-top:80px;scroll-margin-top:100px}
#conclusion{width:min(1180px,calc(100% - 80px));margin:0 auto;padding:64px 0 88px;text-align:left}
#conclusion h2{margin:0;color:#f2f3f5;font:400 clamp(28px,3vw,40px)/1.2 D-DIN,Arial,sans-serif;text-transform:uppercase}
#conclusion p{margin:24px 0 0;color:#a9adb5;font:400 18px/1.7 D-DIN,Arial,sans-serif}
@media(max-width:760px){.models#system{margin-top:56px}#conclusion{width:calc(100% - 40px);padding:48px 0 56px}#conclusion p{font-size:16px}}
