.examples-page{overflow-wrap:anywhere;font-size:18px;line-height:1.75}.examples-breadcrumb{color:var(--muted);padding-block:32px;font-size:14px}.examples-breadcrumb ol{flex-wrap:wrap;gap:12px;margin:0;padding:0;list-style:none;display:flex}.examples-breadcrumb li+li:before{content:"/";margin-right:12px}.examples-hero{max-width:980px;padding:32px 0 48px}.examples-hero h1{font-size:clamp(2.8rem,5vw,4.5rem);line-height:1.1}.examples-lead{max-width:780px;color:var(--muted);margin:28px 0}.fiction-note{border-left:3px solid var(--green);background:var(--soft);max-width:860px;padding:20px 24px}.fiction-note strong{color:var(--green);font-weight:600}.fiction-note p{margin:8px 0 0}.examples-meta{color:var(--muted);margin-top:24px;font-size:14px}.case-jumps{border-block:1px solid var(--line);flex-wrap:wrap;gap:12px 32px;padding:16px 0;font-size:16px;display:flex}.case-jumps a{align-items:center;gap:12px;min-height:44px;display:flex}.process-case,.case-artifacts{border-bottom:1px solid var(--line);padding:64px 0;scroll-margin-top:120px}.case-heading{grid-template-columns:1fr 1fr;align-items:end;gap:56px;margin-bottom:36px;display:grid}.case-heading h2,.case-artifacts h2{font-size:2.4rem;line-height:1.2}.case-heading>p{color:var(--muted)}.case-flow,.case-chart{background:var(--soft);border:1px solid var(--line);border-radius:20px;margin:0 0 40px;padding:32px}.case-flow figcaption,.case-chart figcaption{color:var(--green);margin-bottom:24px;font-weight:500}.case-flow ol{grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;margin:0;padding:0;list-style:none;display:grid}.case-flow li{border-top:2px solid var(--green);padding-top:12px}.case-flow strong{font-family:var(--display);font-size:3rem;font-weight:500;line-height:1.3;display:block}.case-flow span{display:block}.case-flow p,.case-chart>p{color:var(--muted);margin-top:24px;font-size:16px}.case-steps{grid-template-columns:repeat(2,minmax(0,1fr));gap:36px 56px;display:grid}.case-step{min-width:0}.case-step h3{gap:16px;margin:0 0 12px;font-size:1.2rem;line-height:1.5;display:flex}.case-step h3>span{font:500 14px/1.8 var(--font);color:var(--green);padding-top:3px}.case-step p{color:var(--muted)}.examples-page .case-step a,.examples-boundary a{color:var(--green);text-underline-offset:4px;text-decoration:underline}.examples-page code{overflow-wrap:anywhere;font-size:.9em}.case-table-wrap{border:1px solid var(--line);border-radius:12px;max-width:100%;margin-top:40px;overflow-x:auto}.case-table-wrap table{border-collapse:collapse;white-space:nowrap;width:100%;font-size:16px}.case-table-wrap caption{text-align:left;white-space:normal;color:var(--green);padding:16px 20px;font-weight:500}.case-table-wrap th,.case-table-wrap td{border-top:1px solid var(--line);text-align:left;padding:12px 20px}.case-table-wrap th{font-weight:500}.case-table-wrap tfoot{background:var(--soft)}.case-related{flex-wrap:wrap;align-items:center;gap:16px 28px;margin-top:32px;font-size:16px;display:flex}.case-related>span{width:100%;color:var(--muted);font-size:14px}.case-related a{align-items:center;gap:8px;min-height:44px;display:inline-flex}.case-related .text-link{margin:0;font-size:16px}.case-chart-scroll{max-width:100%;overflow-x:auto}.case-chart svg{width:100%;min-width:560px;max-width:780px;height:auto;margin:auto;display:block}.case-chart text{font-family:var(--font);fill:#435540;font-size:16px}.case-chart-key{flex-wrap:wrap;justify-content:center;gap:32px;margin-top:16px;font-size:16px;display:flex}.case-chart-key span{align-items:center;gap:10px;display:flex}.case-chart-key i{background:#2f634b;width:14px;height:14px;display:block}.case-chart-key span+span i{background:#96ad80}.case-artifacts>p{max-width:780px;color:var(--muted);margin-top:24px}.case-artifacts>ul{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin:32px 0;padding:0;list-style:none;display:grid}.case-artifacts>ul a{border:1px solid var(--line);border-radius:12px;align-items:center;gap:16px;min-height:80px;padding:20px;display:flex}.case-artifacts>ul small{color:var(--muted);font-size:14px;display:block}.case-artifacts svg,.examples-page .button svg{flex-shrink:0}.case-reproduce{background:var(--soft);border-radius:20px;padding:32px;scroll-margin-top:120px}.case-reproduce h3{margin-bottom:20px;font-size:1.4rem}.case-reproduce ol{gap:16px;padding-left:24px;display:grid}.case-reproduce p{color:var(--muted);margin-top:24px}.examples-page a:hover{text-underline-offset:5px;text-decoration:underline}.examples-page .button{text-align:left;min-height:48px;font-size:16px}@media (max-width:850px){.case-heading,.case-steps{gap:32px}.case-heading h2,.case-artifacts h2{font-size:2rem}}@media (max-width:650px){.examples-page{font-size:16px}.examples-breadcrumb{padding-top:24px}.examples-hero{padding-top:16px}.examples-hero h1{font-size:2.6rem}.fiction-note{padding:16px}.case-heading{grid-template-columns:1fr;gap:24px}.case-steps{grid-template-columns:1fr}.process-case,.case-artifacts{padding-block:44px}.case-flow,.case-chart{padding:20px 16px}.case-flow ol{gap:14px}.case-flow strong{font-size:2.5rem}.case-flow span{font-size:14px}.case-artifacts>ul{grid-template-columns:1fr}.case-reproduce{padding:24px 20px}.case-table-wrap th,.case-table-wrap td{padding:12px}.case-related{gap:12px}.case-chart-key{gap:24px}}