.article-panel{border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);background:var(--soft);color:var(--text);overflow-wrap:anywhere;min-width:0;margin-block:1.5rem;padding:1rem 1.125rem}.callout.tip,.article-keypoints{background:var(--soft)}.callout.warning{background:#fff9ee}.article-icon{background-position:50%;background-repeat:no-repeat;background-size:contain;flex:none;width:3rem;height:3rem;display:inline-block}.article-part-heading{grid-template-columns:3rem minmax(0,1fr);align-items:center;gap:.75rem;display:grid}.article-part-heading>div{min-width:0}.article-part-label{border:1px solid var(--border);color:var(--ink);background:var(--page);border-radius:999px;margin-bottom:.35rem;padding:.15rem .6rem;font-size:.8125rem;font-weight:700;line-height:1.6;display:inline-block}.article-panel .callout-title,.article-panel .step-title{color:var(--ink);text-wrap:balance;margin:0;font-size:1.125rem;font-weight:700;line-height:1.6;display:block}.article-part-body{margin-top:1rem}.article-part-body:empty{display:none}.article-part-body>:first-child{margin-top:0}.article-part-body p{text-wrap:pretty}.article-part-body>:last-child{margin-bottom:0}.article-panel.article-keypoints ul.keypoints-list{grid-template-columns:minmax(0,1fr);gap:.85rem;margin:1rem 0 0;padding:0;list-style:none;display:grid}.article-keypoints .keypoints-list>li{grid-template-columns:1.75rem minmax(0,1fr);align-items:start;gap:.6rem;min-width:0;margin:0;display:grid}.keypoints-list .article-icon{width:1.75rem;height:1.75rem}.steps{counter-reset:article-step;margin-block:1.5rem;padding:0;list-style:none}.article-prose .steps>li{counter-increment:article-step;margin:0;padding:1rem 1.125rem}.article-prose .steps>li+li{margin-top:1rem}.steps>li:before,.steps>li:after{content:none}.step-number{margin-bottom:.75rem}.step-number:after{content:counter(article-step, decimal-leading-zero)}.copy-memo{background:var(--soft)}.copy-memo .copy-memo-rows{border:1px solid var(--border);background:var(--page);border-radius:12px;margin:1rem 0;padding:0}.copy-memo-row{grid-template-columns:minmax(0,1fr);gap:.3rem;min-width:0;padding:.75rem;display:grid}.copy-memo-row+.copy-memo-row{border-top:1px solid var(--border)}.copy-memo-row dt,.copy-memo-row dd{overflow-wrap:anywhere;min-width:0;margin:0}.copy-memo-row dt{color:var(--ink);font-weight:700}.copy-memo-tools:empty{display:none}.copy-memo .code-tools{border-bottom:0;border-top:1px solid var(--border);background:0 0;padding:.75rem 0 0}.article-icon-palette{flex-wrap:wrap;gap:1rem;margin-block:1rem;display:flex}.article-tool-card{margin-block:1.5rem}.link-card{border:1px solid var(--border);border-radius:var(--radius);min-height:44px;box-shadow:var(--shadow);background:var(--page);color:var(--ink);overflow-wrap:anywhere;grid-template-columns:2rem minmax(0,1fr);align-items:start;gap:.75rem;margin-block:1.5rem;padding:1rem 1.125rem;text-decoration:none;display:grid}.link-card>.article-icon{width:2rem;height:2rem}.link-card-copy{gap:.45rem;min-width:0;display:grid}.article-prose .link-card{text-decoration:none}.link-card:hover{border-color:var(--blue);background:var(--soft)}.link-card-label{color:var(--blue-dark);font-size:.85rem;font-weight:700}.link-card-description{color:var(--muted);font-size:.9rem}.link-card:focus-visible,.copy-code:focus-visible{outline:2px solid var(--blue);outline-offset:3px}.code-block{border:1px solid var(--border);border-radius:var(--radius);min-width:0;box-shadow:var(--shadow);margin-block:1.5rem;overflow:hidden}.prose .code-block pre{border:0;border-radius:0;margin:0}.code-tools{background:var(--soft);border-bottom:1px solid var(--border);flex-wrap:wrap;align-items:center;gap:.5rem;padding:.35rem .625rem;display:flex}.copy-code{min-height:44px;color:var(--blue-dark);background:var(--page);border:1px solid var(--border);cursor:pointer;border-radius:8px;padding:.5rem .8rem}.copy-status{color:var(--text);overflow-wrap:anywhere;font-size:.85rem}@media (width>=600px){.copy-memo-row{grid-template-columns:minmax(0,.8fr) minmax(0,1.4fr);gap:1rem}}@media (width>=768px){.article-panel.article-keypoints ul.keypoints-list{grid-template-columns:repeat(3,minmax(0,1fr))}.article-panel,.article-prose .steps>li{padding:1.25rem}}