
.depth-toc{display:flex;flex-wrap:wrap;gap:12px 24px;margin:24px 0 36px;font-size:14px}
.depth-toc a{min-height:44px;display:inline-flex;align-items:center;text-underline-offset:5px}
.depth-films{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:28px;margin:32px 0}
.depth-film{margin:0;min-width:0}.depth-film video{display:block;width:100%;max-height:580px;aspect-ratio:9/16;object-fit:contain;background:#182925}
.depth-film figcaption{font-size:13px;line-height:1.7;margin-top:14px}.depth-film figcaption a{display:inline-block;min-height:44px;padding-top:10px}
.depth-note{padding:24px;border:1px solid var(--line);margin:28px 0;font-size:15px;line-height:1.8}
.depth-steps{list-style:none;padding:0;counter-reset:step;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin:28px 0}
.depth-steps li{counter-increment:step;border:1px solid var(--line);padding:24px;min-width:0}.depth-steps li::before{content:'0' counter(step);display:block;color:var(--yellow);font-family:var(--mono,monospace);margin-bottom:16px}
.depth-steps strong{display:block;font-size:21px;line-height:1.3;margin-bottom:12px}.depth-steps p{margin:0;font-size:16px}
.depth-case{border-top:1px solid var(--line);padding:18px 0}.depth-case summary{cursor:pointer;font-weight:700;min-height:44px;line-height:1.6;padding:8px 0}.depth-case[open] summary{margin-bottom:12px}
.depth-toc a:focus-visible,.depth-case summary:focus-visible,.depth-film a:focus-visible{outline:3px solid currentColor;outline-offset:5px}
@media(max-width:620px){.depth-films,.depth-steps{grid-template-columns:1fr}.depth-film video{max-height:520px}.depth-note{padding:18px}.depth-steps li{padding:20px}}
