@font-face{font-family:"JIYI Story Serif";src:url("/assets/fonts/jiyi-story-serif-20261003.woff") format("woff");font-weight:400;font-style:normal;font-display:swap}
/* The 101st Story: a readable website edition of the supplied project boards. */
@font-face{font-family:"JIYI Story";src:url("/assets/fonts/jiyi-story-medium-20261003.woff") format("woff");font-weight:500;font-style:normal;font-display:swap}
.stories-page--editorial{--story-sans:"JIYI Story",var(--sans);--story-serif:"JIYI Story Serif",var(--serif);padding:0;background:#faf8f4;font-family:var(--story-sans);font-weight:500;font-synthesis:none}
.stories-page--editorial .container{width:min(calc(100% - 112px),1180px)}
.stories-page--editorial p{font:500 1rem/2 var(--story-sans);letter-spacing:.025em}
.stories-page--editorial h2{font:400 clamp(1.75rem,2.5vw,2.375rem)/1.6 var(--story-serif);letter-spacing:.04em;margin:0}
.stories-page--editorial h3{font:500 1.25rem/1.8 var(--story-sans);letter-spacing:.025em}
.stories-page--editorial .stories-hero{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);align-items:center;gap:72px;padding-block:66px 72px}
.stories-hero-copy{min-width:0}
.stories-page--editorial .stories-kicker{font:400 .875rem/1.7 Arial,sans-serif;letter-spacing:.24em;color:var(--gold);margin:0 0 24px}
.stories-page--editorial h1{font:400 clamp(2.5rem,4.8vw,4.25rem)/1.5 var(--story-serif);letter-spacing:.025em;margin:0}
.stories-page--editorial .stories-english{font:400 1rem/1.8 Georgia,serif;letter-spacing:.24em;margin:6px 0 32px;color:var(--muted)}
.stories-page--editorial .stories-lead{font:400 clamp(1.375rem,2.1vw,1.875rem)/1.8 var(--story-serif);max-width:23rem;color:var(--ink);letter-spacing:.06em;margin:0 0 18px}
.stories-page--editorial .stories-hero-note{margin:0;color:var(--muted);font-size:1rem}
.stories-hero-actions{display:flex;align-items:center;flex-wrap:wrap;gap:28px;margin-top:32px}
.stories-button{display:inline-flex;align-items:center;justify-content:center;min-height:50px;padding:13px 26px;background:#34332d;color:#fff;text-decoration:none;font:500 .9375rem/1.6 var(--story-sans);letter-spacing:.06em;border:1px solid #34332d}
.stories-button:hover{background:#514c43;border-color:#514c43}
.stories-button:focus-visible{outline:2px solid var(--gold);outline-offset:4px}
.stories-hero-image{margin:0;width:100%;max-width:330px;justify-self:end}
.stories-hero-image .stories-reference-panel{box-shadow:10px 12px 0 #ebe6dc}
.stories-page--editorial figcaption{font:500 .875rem/1.8 var(--story-sans);color:var(--muted);margin-top:20px;letter-spacing:.025em}
.stories-section{padding-block:72px;scroll-margin-top:105px}
.stories-section-heading{display:flex;align-items:center;gap:22px;min-width:0}
.stories-section-number{flex:none;font:400 3.5rem/1 Georgia,serif;color:#a2947f;letter-spacing:-.03em;border-right:1px solid var(--line);padding-right:22px}
.stories-page--editorial .stories-section-heading p{font:400 .8125rem/1.8 Georgia,serif;letter-spacing:.2em;color:var(--muted);margin:4px 0 0}
.stories-about{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:72px;align-items:start;border-top:1px solid var(--line)}
.stories-about-copy>p:first-child{margin-top:0;color:var(--ink)}
.stories-about-copy p{margin:0 0 20px}
.stories-about blockquote{margin:32px 0 0;padding-left:22px;border-left:1px solid var(--gold);font:400 1.5rem/1.9 var(--story-serif);letter-spacing:.05em}
.stories-participate{background:#eeeae2}
.stories-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:36px;list-style:none;padding:0;margin:48px 0 0}
.stories-steps>li{min-width:0;display:flex;flex-direction:column}
.stories-step-number{font:400 .875rem/1.6 Georgia,serif;color:var(--gold);letter-spacing:.15em}
.stories-steps h3{margin:14px 0 8px}
.stories-steps p{margin:0 0 26px;flex:1}
.stories-steps figure{margin:0;display:flex;align-items:center;justify-content:center;min-height:340px;padding:12px;background:#f7f5f0}
.stories-steps .stories-reference-panel{width:100%;max-width:205px}
.stories-simple-note{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px 24px;padding-top:30px;margin-top:36px;border-top:1px solid #d8d1c4}
.stories-page--editorial .stories-simple-note p{margin:0;font-size:.9375rem}
.stories-simple-note>span{font:500 .875rem/1.8 var(--story-sans);color:var(--muted)}
.stories-page--editorial .stories-questions{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:72px;border-top:0;align-items:start}
.stories-page--editorial .stories-question-intro{margin:30px 0 0;max-width:22rem}
.stories-page--editorial .stories-questions ol{display:grid;gap:16px;list-style:none;padding:0;margin:0}
.stories-page--editorial .stories-questions li{display:grid;grid-template-columns:64px minmax(0,1fr);gap:24px;align-items:center;padding:26px;background:#efebe3;border:0;border-radius:3px}
.stories-page--editorial .story-question-number{font:400 2rem/1.3 Georgia,serif;color:#736754;letter-spacing:-.03em}
.stories-page--editorial .stories-questions h3{font:500 1.125rem/1.9 var(--story-sans);margin:0}
.stories-cooperate{background:#37382f;color:#fff}
.stories-cooperate-grid{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:72px;align-items:start}
.stories-cooperate .stories-section-number{color:#d5c1a0;border-color:#817c6e}
.stories-page--editorial .stories-cooperate .stories-section-heading p{color:#c4c2b6}
.stories-page--editorial .stories-cooperate-copy p{color:#e4e2d8;margin:0 0 20px}
.stories-cooperate .stories-button{background:#f8f5ed;color:#34332d;border-color:#f8f5ed;margin-top:8px}
.stories-cooperate .stories-button:hover{background:#e7ddcd;border-color:#e7ddcd}
.stories-contact-email{display:block;width:fit-content;color:#e4e2d8;margin-top:18px;font:400 .9375rem/1.8 Arial,sans-serif;text-decoration:none;border-bottom:1px solid #817c6e;padding-bottom:3px}
.stories-contact-email:focus-visible{outline:2px solid #d5c1a0;outline-offset:4px}
.stories-closing{padding-block:34px 42px;display:flex;align-items:baseline;justify-content:space-between;gap:18px;flex-wrap:wrap}
.stories-page--editorial .stories-closing>p{margin:0;font-size:1rem}
.stories-page--editorial .stories-closing .stories-status{margin:0;padding:0;border:0;font-size:.875rem;max-width:100%}
.stories-meaning{background:#eeeae2}
.stories-meaning-grid{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:80px;align-items:center}
.stories-meaning-copy{margin-top:32px;max-width:34rem}
.stories-meaning-copy p{margin:0 0 22px}
.stories-meaning blockquote{margin:30px 0 0;padding-left:22px;border-left:1px solid var(--gold);font:400 1.5rem/1.9 var(--story-serif);letter-spacing:.05em}
.stories-meaning-image{margin:0;max-width:280px;width:100%;justify-self:end}
.stories-values-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:36px;margin-top:44px}
.stories-values-grid article{min-width:0;padding-top:22px;border-top:1px solid var(--line)}
.stories-page--editorial .stories-value-label{font-size:.875rem;color:var(--gold);margin:0 0 16px}
.stories-values-grid h3{margin:0 0 16px}
.stories-values-grid article>p:last-child{margin:0;color:var(--muted)}
.stories-page--editorial .stories-questions{border-top:1px solid var(--line)}
.stories-cooperate--compact{padding-block:42px;background:#eeebe4;color:var(--ink)}
.stories-cooperate--compact .stories-cooperate-grid{grid-template-columns:minmax(0,1.3fr) minmax(0,.7fr);gap:60px;align-items:center}
.stories-page--editorial .stories-cooperate--compact h2{font-size:1.5rem;margin:0 0 16px}
.stories-page--editorial .stories-cooperate--compact .stories-cooperate-copy p{color:var(--muted);margin:0 0 16px;font-size:.9375rem}
.stories-download{border-left:1px solid #d4cec1;padding-left:34px}
.stories-page--editorial .stories-download p{font-size:1rem;margin:0 0 12px;color:var(--ink)}
.stories-cooperate--compact .stories-download .stories-button{margin:0;background:#34332d;color:#fff;border-color:#34332d}
.stories-download>span{display:block;margin-top:12px;font:500 .875rem/1.8 var(--story-sans);color:var(--muted)}
@media(max-width:1000px){
  .stories-page--editorial .stories-hero{gap:40px;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr)}
  .stories-hero-image{max-width:290px}
  .stories-about,.stories-page--editorial .stories-questions,.stories-cooperate-grid{gap:40px}
  .stories-steps{gap:22px}
  .stories-steps figure{min-height:290px}
  .stories-meaning-grid{gap:44px}
  .stories-values-grid{gap:24px}
}
@media(max-width:760px){
  .stories-page--editorial .container{width:calc(100% - 48px)}
  .stories-page--editorial .stories-hero{grid-template-columns:1fr;gap:36px;padding-block:40px 48px}
  .stories-page--editorial h1{font-size:clamp(2rem,8.7vw,3.5rem)}
  .stories-page--editorial .stories-english{font-size:.875rem;letter-spacing:.18em;margin-bottom:24px}
  .stories-hero-image{justify-self:center;max-width:280px}
  .stories-hero-actions{gap:22px;margin-top:24px}
  .stories-section{padding-block:48px;scroll-margin-top:88px}
  .stories-about,.stories-page--editorial .stories-questions,.stories-cooperate-grid{grid-template-columns:1fr;gap:30px}
  .stories-section-number{font-size:2.875rem;padding-right:18px}
  .stories-section-heading{gap:18px}
  .stories-steps{grid-template-columns:1fr;gap:38px;margin-top:32px}
  .stories-steps>li+li{padding-top:30px;border-top:1px solid #d8d1c4}
  .stories-steps p{margin-bottom:20px}
  .stories-steps figure{min-height:0;padding:20px}
  .stories-steps .stories-reference-panel{max-width:220px}
  .stories-simple-note{display:block;margin-top:28px;padding-top:22px}
  .stories-simple-note>span{display:block;margin-top:16px}
  .stories-page--editorial .stories-questions li{grid-template-columns:44px minmax(0,1fr);gap:16px;padding:22px 18px}
  .stories-page--editorial .story-question-number{font-size:1.625rem}
  .stories-page--editorial .stories-questions h3{font-size:1rem}
  .stories-page--editorial .stories-question-intro{max-width:100%;margin-top:24px}
  .stories-about blockquote{font-size:1.25rem}
  .stories-closing{display:block;padding-block:28px 36px}
  .stories-page--editorial .stories-closing .stories-status{margin-top:12px}
  .stories-meaning-grid,.stories-values-grid,.stories-cooperate--compact .stories-cooperate-grid{grid-template-columns:1fr;gap:30px}
  .stories-meaning-image{justify-self:center;max-width:270px}
  .stories-meaning-copy{margin-top:24px}
  .stories-meaning blockquote{font-size:1.25rem}
  .stories-values-grid{margin-top:28px}
  .stories-download{border-left:0;border-top:1px solid #d4cec1;padding:24px 0 0}
}