.skill-architecture{background:#f5f6f2;padding:38px 42px;border:1px solid #d1dad5}.skill-stack{display:grid;gap:20px}.skill-row{display:grid;grid-template-columns:1fr .43fr;gap:54px;align-items:center}.skill-layer{position:relative;text-align:left;padding:22px 28px;border:1px solid #a5b9ad;background:#e5eee7;min-width:0}.skill-layer h3{font-family:var(--sans);font-size:21px!important;line-height:1.45;margin:0 0 8px;font-weight:600;color:#244e42}.skill-layer p{font-size:14px;line-height:1.7;color:#41675a;margin:0}.skills .skill-layer{min-height:170px;display:flex;flex-direction:column;justify-content:center;background:#dbe9df;border-color:#719c84}.skill-depth{display:flex;gap:6px;margin-top:22px;max-width:300px}.skill-depth span{height:5px;flex:1;background:#96b7a2}.skill-depth span:nth-child(n+3){background:#bfd2c4}.replaceable .skill-layer{background:#eeede7;border-color:#c0c3bb}.replaceable h3{color:#4b5451}.replaceable .skill-layer p{color:#646e67}.runtime .skill-layer{padding:13px 28px}.runtime h3{font-size:17px!important;margin:0;font-weight:500}.skill-annotation{position:relative;font-size:14px;line-height:1.85;color:#54645f;margin:0}.skill-annotation:before{content:'';position:absolute;width:30px;border-top:1px dashed #a9b8b0;left:-42px;top:13px}.architecture-legend{display:flex;gap:30px;flex-wrap:wrap;margin-top:30px}.architecture-legend span{display:flex;align-items:center;gap:9px;font-size:13px;color:#52645c}.architecture-legend span:before{content:'';width:12px;height:12px;display:block;border:1px solid #8eac99;background:#dbe9df}.architecture-legend .legend-replaceable:before{background:#eeede7;border-color:#b1b7ad}.skill-architecture .illustration-note{margin-top:22px;font-size:12px}
@media(max-width:700px){.skill-architecture{padding:24px 18px}.skill-row{grid-template-columns:1fr;gap:10px}.skill-layer{padding:18px}.skills .skill-layer{min-height:150px}.skill-layer h3{font-size:18px!important}.runtime .skill-layer{padding:12px 18px}.runtime h3{font-size:16px!important}.skill-layer p{font-size:13px}.skill-annotation{padding-left:17px;font-size:12px}.skill-annotation:before{left:0;top:10px;width:9px}.skill-annotation br{display:none}.architecture-legend{gap:12px 22px}.architecture-legend span{font-size:12px}}
