.path-context { width: min(1240px, calc(100% - 48px)); display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 24px; margin: 0 auto; padding: 15px 0; border-bottom: 1px solid var(--line); font-size: 11px; }
.path-context > a { color: var(--muted); text-decoration: none; }
.path-context > a:last-child { text-align: right; }
.path-context > a:hover { color: var(--accent); }
.path-context-center { text-align: center; }
.path-context-center a { color: var(--ink); font-weight: 600; text-decoration: none; }
.path-context-center span { display: block; margin-top: 4px; color: var(--muted); font: 400 8px/1 "DM Mono", monospace; letter-spacing: .08em; text-transform: uppercase; }
.path-context-done { padding: 6px 10px; border: 1px solid var(--line); border-radius: 20px; background: transparent; color: var(--ink); cursor: pointer; font: 500 8px/1 "DM Mono", monospace; text-transform: uppercase; }
.path-context-done.is-done { border-color: var(--green); background: var(--green); color: var(--paper); }
@media (max-width: 720px) { .path-context { width: min(100% - 32px, 1240px); grid-template-columns: 1fr 1fr; } .path-context-center { grid-column: 1 / -1; grid-row: 1; } .path-context > a:last-child { text-align: right; } }