.project-architecture{container-type:inline-size;min-width:0;margin:0;color:var(--paper,#f6f5ef);background:var(--green-deep,#19372d);border-radius:4px;overflow:hidden}.architecture-system{padding:30px 30px 24px}.architecture-heading h3{margin:0;font-size:clamp(22px,4.7cqi,28px);line-height:1.25;font-weight:500;letter-spacing:-.025em;text-wrap:balance}.architecture-heading p{margin:8px 0 0;color:#c3d0c3;font-size:var(--type-support);line-height:1.5}.architecture-flow{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));list-style:none;margin:38px 0 0;padding:0}.architecture-stage{position:relative;min-width:0;padding-top:29px}.architecture-stage:not(:last-child):before{position:absolute;top:6px;right:6px;left:8px;height:1px;background:#8caa90;content:""}.architecture-stage:not(:last-child):after{position:absolute;top:3px;right:7px;width:6px;height:6px;border-top:1px solid #8caa90;border-right:1px solid #8caa90;transform:rotate(45deg);content:""}.architecture-stage-point{position:absolute;top:0;left:0;width:13px;height:13px;border:1px solid var(--lime,#d1e2b5);border-radius:50%;background:var(--green-deep,#19372d);z-index:1}.architecture-stage:last-child .architecture-stage-point{border-radius:2px}.architecture-stage strong{display:block;font-size:var(--type-control);font-weight:600;line-height:1.5}.architecture-stage>span:last-child{display:block;margin-top:3px;padding-right:8px;color:#c3d0c3;font-size:var(--type-meta);line-height:1.5}.architecture-coverage-line{position:relative;height:12px;margin:19px 6px 0;border:1px solid #68806b;border-top:0}.architecture-coverage-line:after{position:absolute;top:100%;left:50%;width:1px;height:16px;background:#68806b;content:""}.architecture-instruction{margin:26px 0 12px;color:#c3d0c3;font-size:var(--type-control);text-align:center}.architecture-controls{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:3px;max-width:296px;margin-inline:auto;padding:3px;border:1px solid #68806b;border-radius:5px}.architecture-controls button{min-height:42px;padding:7px 12px;color:var(--paper,#f6f5ef);background:transparent;border:0;border-radius:3px;font:inherit;font-size:var(--type-control);font-weight:600;line-height:1.5;cursor:pointer;transition:background-color .16s ease,color .16s ease}.architecture-controls button:hover{background:#395846}.architecture-controls button[aria-pressed=true]{color:var(--green-deep,#19372d);background:var(--lime,#d1e2b5);text-decoration:underline;text-underline-offset:4px}.architecture-controls button:focus-visible,.architecture-source:focus-visible{position:relative;outline:2px solid var(--lime,#d1e2b5);outline-offset:4px;z-index:2}.architecture-detail{padding:24px 30px;background:var(--paper,#f6f5ef);color:var(--ink,#203c32)}.architecture-explanation{min-height:144px}.architecture-detail-heading{display:flex;align-items:baseline;justify-content:space-between;gap:12px;flex-wrap:wrap}.architecture-detail-heading h4{margin:0;font-size:1.25rem;line-height:1.35;letter-spacing:-.02em;font-weight:500}.architecture-detail-heading>span{color:#506148;font-size:var(--type-meta);line-height:1.5}.architecture-explanation p{margin:10px 0 0;color:var(--text,#344b42);font-size:var(--type-support);line-height:1.7}.architecture-source{display:flex;align-items:center;justify-content:space-between;gap:15px;min-height:34px;margin-top:14px;padding-top:14px;border-top:1px solid var(--line,#d4d9ce);color:var(--ink,#203c32);text-decoration:none}.architecture-source code{overflow-wrap:anywhere;font-family:ui-monospace,monospace;font-size:var(--type-meta);line-height:1.65}.architecture-source svg{flex:0 0 auto}.architecture-source:hover code{text-decoration:underline;text-underline-offset:3px}.architecture-source:focus-visible{outline-color:var(--ink,#203c32)}.architecture-delivery{display:flex;align-items:center;justify-content:center;gap:13px;margin:0;padding:15px 20px;color:#c3d0c3;font-size:var(--type-meta);line-height:1.5}.architecture-delivery svg{flex-shrink:0}@container (max-width: 480px){.architecture-system{padding:24px 22px}.architecture-flow{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:32px;margin-top:30px}.architecture-stage:nth-child(3){grid-column:2;grid-row:2}.architecture-stage:nth-child(4){grid-column:1;grid-row:2}.architecture-stage:nth-child(2):before{top:calc(100% + 6px);left:6px;width:1px;height:24px}.architecture-stage:nth-child(2):after{top:calc(100% + 22px);right:auto;left:3px;transform:rotate(135deg)}.architecture-stage:nth-child(3):before{right:calc(100% - 6px);left:calc(-100% + 8px)}.architecture-stage:nth-child(3):after{right:auto;left:calc(-100% + 17px);transform:rotate(-135deg)}.architecture-detail{padding:22px}.architecture-detail-heading{display:block}.architecture-detail-heading>span{display:block;margin-top:6px}.architecture-explanation{min-height:190px}}@media (prefers-reduced-motion:reduce){.architecture-controls button{transition:none}}