.layout { display: grid; grid-template-columns: 280px minmax(0, 1fr); gap: 1.5rem; max-width: 1200px; margin: 0 auto; padding: 1rem; }
#toc { position: sticky; top: 4.2rem; align-self: start; max-height: calc(100vh - 5rem); overflow: auto; font-size: .9rem; }
#toc h2 { font-size: .75rem; color: var(--muted); text-transform: uppercase; letter-spacing: .05em; margin: 1rem 0 .3rem; }
#toc a { display: flex; gap: .5rem; padding: .2rem .4rem; border-radius: 4px; text-decoration: none; color: inherit; }
#toc a:hover, #toc a.on { background: var(--info-bg); }
.method { font: 700 .72rem var(--mono); min-width: 3.2rem; text-align: center; border-radius: 4px; padding: .1rem .3rem; color: #fff; align-self: center; }
.method.get { background: #1a7f4b; } .method.post { background: #0b6bcb; } .method.put, .method.patch { background: #a86400; } .method.delete { background: #b3261e; }
h2.section { margin-top: 1.5rem; }
.op { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); padding: 1rem 1.25rem; margin: 0 0 1rem; scroll-margin-top: 4.5rem; }
.op h2 { display: flex; gap: .6rem; align-items: center; flex-wrap: wrap; }
.op .path { font-family: var(--mono); font-size: .95rem; word-break: break-all; }
.intro p, .op p { margin: .4rem 0; } .intro ul, .intro ol, .op ul { margin: .4rem 0 .4rem 1.2rem; padding: 0; }
.schema { font-size: .88rem; } .schema table { margin: .3rem 0; }
.req { color: var(--bad); font-weight: 600; }
details summary { cursor: pointer; margin: .4rem 0; }
.codes td:first-child { font-family: var(--mono); white-space: nowrap; }
@media (max-width: 820px) { .layout { grid-template-columns: 1fr; } #toc { position: static; max-height: none; } }