/* Long card guides: a quick reference followed by a readable teaching column. */
.card-depth { --depth-rule:rgba(183,205,182,.2); --depth-link:#b9dcb9; }
.card-depth-jumps { margin:1.5rem 0 2rem; padding:1.2rem 0; border-block:1px solid var(--depth-rule); }
.card-depth-jumps > span { font-size:.88rem; color:var(--color-text-muted); }
.card-depth-jumps ul { display:flex; flex-wrap:wrap; gap:.3rem 1.2rem; list-style:none; margin:.6rem 0 0; padding:0; }
.card-depth-jumps a { display:inline-block; padding:.45rem 0; font-size:.92rem; color:var(--depth-link); text-decoration:underline; text-underline-offset:.2em; }
.card-depth h2,.card-depth-context { scroll-margin-top:7rem; }
.card-depth h3 { margin:1.65rem 0 .8rem; font-family:var(--font-body); font-size:1.1rem; font-weight:600; line-height:1.5; text-transform:none; letter-spacing:0; }
.card-depth-section + .card-depth-section { border-top:1px solid var(--depth-rule); padding-top:1.8rem; }
.card-depth-context dl { display:grid; grid-template-columns:5.1rem minmax(0,1fr); gap:.6rem .8rem; margin:1.2rem 0 1.8rem; font-size:.95rem; line-height:1.75; }
.card-depth-context dt { font-weight:600; color:var(--depth-link); }
.card-depth-context dd { margin:0; color:var(--color-text-muted); }
.card-depth-prompt { padding-left:1rem; border-left:2px solid #729c79; }
.card-depth blockquote { margin:1.2rem 0; padding:.25rem 0 .25rem 1.2rem; border-left:2px solid #9ea770; color:#e3e9dc; line-height:1.8; font-size:1.08rem; }
.card-depth .card-depth-example-label { font-size:.86rem; color:#b6c2a8; }
.card-depth .card-depth-positions { margin:1.5rem 0; padding:0; list-style:none; }
.card-depth .card-depth-positions li { display:grid; grid-template-columns:76px minmax(0,1fr); gap:1.2rem; margin:0; padding:1.3rem 0; border-top:1px solid var(--depth-rule); }
.card-depth-art { display:block; align-self:start; }
.card-depth-art img { display:block; width:76px; height:auto; border-radius:4px; }
.card-depth-art-reversed { transform:rotate(180deg); }
.card-depth h4 { margin:0 0 .2rem; color:#e4eadd; font:600 1rem/1.5 var(--font-body); }
.card-depth .card-depth-drawn { margin:.25rem 0 .8rem; font-size:.9rem; }
.card-depth-faq { border-bottom:1px solid var(--depth-rule); }
.card-depth-faq summary { cursor:pointer; padding:1rem .2rem; color:#e3e9dc; line-height:1.65; font-weight:500; }
.card-depth-faq p { padding:.25rem .2rem .6rem; }
.card-depth-offer { margin:2rem 0 0; padding:1.4rem; background:#142b22; border-left:3px solid #9aa56f; }
.card-depth-offer h3 { margin-top:0; }
.card-depth-offer p:last-child { margin-bottom:0; }
.card-depth-tool { display:inline-block; padding:.75rem 0; }
.card-depth a:focus-visible,.card-depth summary:focus-visible { outline:2px solid #d1e7bf; outline-offset:4px; }
@media(max-width:480px) {
  .card-depth .card-depth-positions li { grid-template-columns:54px minmax(0,1fr); gap:.85rem; }
  .card-depth-art img { width:54px; }
  .card-depth-context dl { display:block; }
  .card-depth-context dt { margin-top:.7rem; }
  .card-depth-offer { padding:1rem; }
}
