/* lab-nav.css - Explore menu (topbar), "Next and related" row and the Cite strip.
   Injected site-wide by render_html with lab-nav.js. House tokens: navy #000054, red #E60028, Inter. */
.labnav-btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;flex:none;min-height:34px;margin:0;padding:7px 14px;border:0;border-radius:999px;background:#fff;color:#000054;font:700 12px Inter,system-ui,sans-serif;cursor:pointer;white-space:nowrap;text-decoration:none}
.labnav-btn.labnav-end{margin-left:auto}
.labnav-btn:hover,.labnav-btn[aria-expanded="true"]{background:#E60028;color:#fff}
.labnav-btn:focus-visible{outline:3px solid rgba(255,255,255,.7);outline-offset:2px}
.labnav-btn svg{width:12px;height:12px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round}
.nav-links .labnav-btn,.lp-nav .labnav-btn,.support-nav .labnav-btn{border:1.5px solid #000054;background:#fff;color:#000054}
.nav-links .labnav-btn:hover,.lp-nav .labnav-btn:hover,.support-nav .labnav-btn:hover{background:#000054;color:#fff}
.nav-links .labnav-btn:focus-visible,.lp-nav .labnav-btn:focus-visible{outline-color:rgba(230,0,40,.45)}
@media(max-width:640px){.labnav-btn{min-height:44px;min-width:44px;padding:8px 12px}.labnav-btn span{display:none}.labnav-btn svg{width:17px;height:17px}}   /* phones: icon only, the label stays as aria-label */

.labnav-ov{position:fixed;inset:0;z-index:8990;background:rgba(10,10,35,.38);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}
.labnav-ov[hidden]{display:none}
.labnav-panel{position:fixed;top:70px;right:max(12px,calc(50% - 640px));width:min(780px,calc(100vw - 24px));max-height:calc(100vh - 86px);display:flex;flex-direction:column;box-sizing:border-box;border-radius:20px;background:#fff;color:#191933;font-family:Inter,system-ui,sans-serif;box-shadow:0 24px 60px rgba(0,0,84,.22);overflow:hidden}
.labnav-head{display:flex;align-items:center;gap:10px;padding:16px 18px 12px;border-bottom:1px solid #e7e9f5}
.labnav-head .labnav-ey{display:none}
.labnav-search{flex:1;min-width:0;height:42px;padding:0 14px;border:1.5px solid #e7e9f5;border-radius:12px;background:#f8f9ff;color:#191933;font:500 14px Inter,system-ui,sans-serif}
.labnav-search:focus{outline:3px solid rgba(230,0,40,.18);border-color:#E60028;background:#fff}
.labnav-x{flex:none;width:36px;height:36px;border:0;border-radius:50%;background:#f1f2fb;color:#000054;font:600 20px/1 Inter,system-ui,sans-serif;cursor:pointer}
.labnav-x:hover{background:#E60028;color:#fff}
.labnav-x:focus-visible{outline:3px solid rgba(230,0,40,.35)}
.labnav-body{overflow:auto;padding:8px 18px 18px;overscroll-behavior:contain}
.labnav-grp{break-inside:avoid;margin:12px 0 0}
.labnav-grp h3{margin:0 0 6px;color:#E60028;font-size:11px;font-weight:800;letter-spacing:.1em;text-transform:uppercase}
.labnav-grp ul{margin:0;padding:0;list-style:none;columns:2;column-gap:22px}
.labnav-grp li{break-inside:avoid;padding:0;margin:0}
.labnav-grp a{display:block;padding:5px 8px;margin:0 -8px;border-radius:8px;color:#000054;font-size:13.5px;font-weight:500;line-height:1.35;text-decoration:none}
.labnav-grp a:hover,.labnav-grp a:focus-visible{background:#f4f5ff;outline:none;color:#E60028}
.labnav-grp a[aria-current="page"]{font-weight:800}
.labnav-grp a[aria-current="page"]::after{content:"You are here";margin-left:8px;color:#6b6b88;font-size:11px;font-weight:600}
.labnav-grp[hidden]{display:none}
.labnav-empty{padding:24px 0;color:#6b6b88;font-size:13.5px;text-align:center}
.labnav-foot{padding:10px 18px 14px;border-top:1px solid #e7e9f5;color:#6b6b88;font-size:12px}
.labnav-foot a{color:#000054;font-weight:700}
.labnav-foot kbd{padding:1px 5px;border:1px solid #e7e9f5;border-radius:4px;background:#f8f9ff;font:600 11px Inter,system-ui,sans-serif}
@media(max-width:700px){
  .labnav-panel{top:68px;right:12px;left:12px;width:auto;max-height:calc(100vh - 80px);border-radius:16px}
  .labnav-grp ul{columns:1}
  .labnav-foot{display:none}
}
@media(prefers-reduced-motion:no-preference){.labnav-panel{animation:labnavIn .22s cubic-bezier(.16,1,.3,1)}@keyframes labnavIn{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}}

/* Next and related - sits inside the About band so it shares its column */
.labnav-related{margin:18px 0 0;font-family:Inter,system-ui,sans-serif}
.labnav-related h2{margin:0 0 10px;color:#000054;font-size:12px;font-weight:800;letter-spacing:.1em;text-transform:uppercase}
.labnav-rel-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.labnav-rel-grid a{display:block;min-width:0;padding:14px 16px;border:1px solid #e7e9f5;border-radius:14px;background:#fff;color:#191933;text-decoration:none;box-shadow:0 1px 2px rgba(10,10,40,.04);transition:border-color .2s,transform .2s}
.labnav-rel-grid a:hover{border-color:#000054;transform:translateY(-1px)}
.labnav-rel-grid a:focus-visible{outline:3px solid rgba(230,0,40,.35);outline-offset:2px}
.labnav-rel-grid small{display:block;margin-bottom:5px;color:#E60028;font-size:10.5px;font-weight:800;letter-spacing:.08em;text-transform:uppercase}
.labnav-rel-grid b{display:block;color:#000054;font-size:14px;font-weight:700;line-height:1.3}
.labnav-rel-grid p{margin:5px 0 0;color:#6b6b88;font-size:12.5px;line-height:1.45;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.labnav-story{margin:12px 0 0;color:#6b6b88;font-size:13px;line-height:1.5}
.labnav-story a{display:inline-block;margin:2px 6px 0 0;padding:4px 11px;border:1px solid #e7e9f5;border-radius:999px;background:#fff;color:#000054;font-size:12px;font-weight:700;text-decoration:none}
.labnav-story a:hover{border-color:#E60028;color:#E60028}
.labnav-band{width:min(1280px,calc(100% - 44px));margin:26px auto 40px;box-sizing:border-box}
@media(max-width:760px){.labnav-rel-grid{grid-template-columns:1fr}}

/* Cite this tool - plain, small, inside the About card */
.labcite{margin:18px 0 0;padding-top:14px;border-top:1px solid #e7e9f5;font-family:Inter,system-ui,sans-serif;color:#191933}
.labcite-head{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 14px;margin:0 0 8px}
.labcite-head b{color:#000054;font-size:12px;font-weight:800;letter-spacing:.1em;text-transform:uppercase}
.labcite-head span{color:#6b6b88;font-size:12px}
.labcite-row{display:grid;grid-template-columns:52px minmax(0,1fr) auto;align-items:start;gap:8px 10px;margin:6px 0}
.labcite-row span{padding-top:6px;color:#6b6b88;font-size:11px;font-weight:800;letter-spacing:.06em;text-transform:uppercase}
.labcite-row pre{margin:0;padding:8px 11px;border:1px solid #e7e9f5;border-radius:8px;background:#f8f9ff;color:#191933;font:12px/1.5 ui-monospace,SFMono-Regular,Menlo,monospace;white-space:pre-wrap;overflow-wrap:anywhere}
.labcite-row button{min-height:32px;padding:6px 12px;border:1.5px solid #000054;border-radius:999px;background:#fff;color:#000054;font:700 12px Inter,system-ui,sans-serif;cursor:pointer;white-space:nowrap}
.labcite-row button:hover{background:#000054;color:#fff}
.labcite-row button:focus-visible{outline:3px solid rgba(230,0,40,.35);outline-offset:2px}
.labcite-row button.done{border-color:#1f9d55;color:#1f9d55;background:#fff}
@media(max-width:640px){.labcite-row{grid-template-columns:1fr;gap:4px}.labcite-row span{padding-top:0}.labcite-row button{justify-self:start}}
@media print{.labnav-btn,.labnav-ov,.labnav-related{display:none!important}.labcite-row button{display:none}}
