.learning-guide{--guide-ink:#18272f;--guide-line:#ded6c8}.learn-start,.learn-example,.learn-steps,.learn-faq,.learn-next{border:1px solid var(--guide-line);border-radius:16px;padding:clamp(18px,3vw,28px);margin:26px 0;background:#fffefa}.learn-start{background:var(--guide-ink);color:#fffefa}.article-content .learn-start h2{color:#fffefa;margin-top:8px}.learn-start p{color:#e0e7e7}.learn-kicker{color:#fca572;text-transform:uppercase;letter-spacing:.1em;font-size:.75rem;font-weight:800}.learn-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:20px}.learn-actions a{min-height:44px;display:inline-flex;align-items:center;justify-content:center;padding:10px 16px;border-radius:8px;border:1px solid #c5c9c6;text-decoration:none;font-weight:700}.learn-start .learn-actions a{color:#fffefa;border-color:#708087}.learn-actions a:first-child{background:#ef632a;color:white;border-color:#ef632a}.learn-actions a:focus-visible,.learn-faq summary:focus-visible{outline:3px solid #ef632a;outline-offset:4px}.learn-sections{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin:28px 0}.learn-section{min-width:0;background:#fffefa;border:1px solid var(--guide-line);border-radius:14px;padding:22px}.learn-section:last-child:nth-child(odd){grid-column:1/-1}.article-content .learn-section h2{font-size:1.25rem;margin:12px 0}.learn-number{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;background:#f8e3d3;color:#873513;border-radius:9px;font-weight:800}.learn-example{border-left:5px solid #ef632a;background:#fbefdf}.article-content .learn-example h2,.article-content .learn-steps h2,.article-content .learn-faq h2,.article-content .learn-next h2{margin-top:0;font-size:1.4rem}.learn-steps ol{display:grid;grid-template-columns:1fr 1fr;gap:16px 32px;padding-left:24px}.learn-steps li{padding-left:6px}.learn-faq details{border-top:1px solid var(--guide-line);padding:12px 0}.learn-faq summary{cursor:pointer;min-height:44px;display:list-item;padding:10px 4px;font-weight:700}.learn-sources{font-size:.88rem;border-top:1px solid var(--guide-line);padding-top:18px}.learn-sources ul{padding-left:20px}.learn-static .obo-table-scroll{max-width:100%;overflow:auto}.learn-static table{min-width:520px}.learn-static summary{cursor:pointer;min-height:44px;font-weight:700;padding:12px}.learning-guide p{overflow-wrap:break-word}@media(max-width:720px){.learn-sections{grid-template-columns:1fr}.learn-section:last-child:nth-child(odd){grid-column:auto}.learn-steps ol{grid-template-columns:1fr}.learn-section{padding:18px}.learn-actions{flex-direction:column}.learn-actions a{width:100%;box-sizing:border-box}}
/* Variation-only comparisons; the existing learning layouts remain unchanged. */
.variant-guide .variant-scope{font-size:.92rem;color:#596368}.variant-guide .variant-compare{margin:26px 0;border:1px solid #ded6c8;border-radius:14px;background:#fffefa;overflow:hidden}.variant-guide table{width:100%;min-width:0;table-layout:fixed;border-collapse:collapse;margin:0}.variant-guide caption{text-align:left;font-weight:800;padding:20px;font-size:1.25rem}.variant-guide th,.variant-guide td{padding:17px;text-align:left;vertical-align:top;border-top:1px solid #ded6c8;overflow-wrap:anywhere}.variant-guide thead th{background:#18272f;color:#fffefa}.variant-guide th:first-child{width:23%}.variant-guide .variant-caution{padding:20px 24px;background:#f6e8d8;border-left:4px solid #ef632a;border-radius:10px}.variant-directory{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin:28px 0}.variant-directory article{background:#fffefa;border:1px solid #ded6c8;border-radius:14px;overflow:hidden}.variant-directory img{width:100%;height:auto;display:block}.variant-directory .variant-card-body{padding:22px}.variant-directory h2{font-size:1.35rem;margin:0 0 12px}.variant-directory a.variant-read{display:inline-flex;align-items:center;min-height:44px;margin-top:8px;font-weight:700}.variant-guide .learn-example{margin:28px 0}@media(max-width:720px){.variant-directory{grid-template-columns:1fr}.variant-guide table,.variant-guide tbody,.variant-guide tr,.variant-guide td,.variant-guide th{display:block;width:auto!important}.variant-guide thead{position:absolute;clip-path:inset(50%);height:1px;width:1px;overflow:hidden}.variant-guide tbody tr{border-top:1px solid #ded6c8;padding:10px 0}.variant-guide tbody th{border:0;padding:12px 18px 3px;font-size:1.1rem}.variant-guide td{border:0;padding:10px 18px}.variant-guide td::before{content:attr(data-label);display:block;font-size:.75rem;text-transform:uppercase;letter-spacing:.04em;font-weight:800;color:#6b5545;margin-bottom:5px}.variant-guide caption{display:block}}
