/* Navigation demos retain real link semantics. A shared quiet glass surface
 * supports the hierarchy; the current location is not another action button.
 */
.anchor-example {display:grid;grid-template-columns:106px minmax(0,1fr);gap:14px;width:100%;align-items:center;}
.ui-anchor {display:grid;gap:5px;padding:10px 6px;border:1px solid var(--button-edge);border-radius:var(--radius-sm);background:var(--material-fill);backdrop-filter:blur(16px);box-shadow:0 5px 18px #234b7410;}
.ui-anchor small {padding:3px 10px 9px;font-size:10px;letter-spacing:.06em;}
.ui-anchor a {position:relative;text-decoration:none;padding:10px 9px 10px 13px;border-radius:var(--radius-sm);color:var(--muted);font-size:12px;white-space:nowrap;transition:background .18s,color .18s;}

.ui-anchor a[aria-current] {background:linear-gradient(110deg,#79acf337,#acd9ff18);color:var(--brand);font-weight:600;}
.ui-anchor a[aria-current]::before {content:'';position:absolute;left:3px;top:11px;bottom:11px;width:3px;border-radius:4px;background:var(--brand);}
.anchor-document {height:200px;overflow:auto;overscroll-behavior:contain;border-radius:var(--radius-sm);background:var(--surface-clear);border:1px solid var(--button-edge);}
.anchor-document section {padding:18px 14px;min-height:200px;box-sizing:border-box;}
.anchor-document section+section {border-top:1px solid var(--button-edge);}
.anchor-document h3 {font-size:16px;line-height:1.5;}
.anchor-document p {font-size:12px;line-height:1.8;}
.anchor-document small {font-size:9px;letter-spacing:.04em;}
.breadcrumb-example {width:100%;display:grid;gap:12px;}
.breadcrumb-example>small {font-size:10px;letter-spacing:.08em;padding-left:3px;}
.ui-breadcrumb {display:flex;align-items:center;gap:4px;flex-wrap:wrap;width:fit-content;max-width:100%;padding:7px;border:1px solid var(--button-edge);border-radius:var(--radius-sm);background:var(--material-fill);backdrop-filter:blur(16px);box-shadow:0 5px 18px #234b7410;}
.ui-breadcrumb a,.ui-breadcrumb b {display:inline-flex;align-items:center;gap:5px;padding:7px 8px;border-radius:var(--radius-sm);font-size:12px;text-decoration:none;}
.ui-breadcrumb a {color:var(--muted);transition:background .18s,color .18s;}

.ui-breadcrumb>span {color:var(--muted);opacity:.5;font-size:16px;}
.ui-breadcrumb b {color:var(--ink);font-weight:600;background:var(--surface-clear);}
.ui-breadcrumb svg {width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;}
.breadcrumb-context {padding:13px 4px 0;border-top:1px solid var(--button-edge);}
.breadcrumb-context>span {font-size:10px;color:var(--brand);}
.breadcrumb-context h3 {font-size:17px;font-weight:600;}
.breadcrumb-context p {font-size:12px;color:var(--muted);}
@media(prefers-reduced-motion:reduce){.ui-anchor a,.ui-breadcrumb a {transition:none;}}