.comparison-list{display:grid;gap:22px}.comparison-panel{padding:20px;border:1px solid #2b4058;border-radius:16px;background:#0b1723}.comparison-panel i{color:#ffd47f;font-style:normal;font-size:20px;margin:0 9px}.comparison-panel small{display:block;color:#b5c4d4;font-size:14px;font-weight:400}.comparison-list .comparison-panel:nth-child(1)::after{content:'Core difference: these concepts have different roles. Why it matters: confusing them leads to the wrong mental model.';display:block;margin-top:14px;padding:10px 14px;border-left:3px solid #ffd47f;color:#b5c4d4;font-size:14px}.comparison-list .comparison-panel:nth-child(2)::after{content:'Core difference: one describes a process or capability, the other describes a different layer. Why it matters: the distinction helps you choose the right design decision.';display:block;margin-top:14px;padding:10px 14px;border-left:3px solid #ffd47f;color:#b5c4d4;font-size:14px}.comparison-list .comparison-panel:nth-child(3)::after{content:'Core difference: related concepts can work together without being interchangeable. Why it matters: naming the layer makes the relationship clear.';display:block;margin-top:14px;padding:10px 14px;border-left:3px solid #ffd47f;color:#b5c4d4;font-size:14px}.system-layer-map{display:grid;gap:8px;max-width:760px}.system-layer{padding:14px 18px;border-left:3px solid #78e5bd;background:#0b1723}.system-layer small{display:block;color:#b5c4d4}.layer-table{display:grid;grid-template-columns:repeat(5,1fr);gap:10px}.layer-table div{padding:14px;border:1px solid #38516d;border-radius:12px;background:#07111a}.layer-table small{display:block;color:#b5c4d4;margin-top:6px}@media(max-width:800px){.layer-table{grid-template-columns:repeat(2,1fr)}}@media(max-width:520px){.layer-table{grid-template-columns:1fr}}
