'use strict';const ELLIPSIS='\u2026';const NBSP='\xa0';const RATINGS={PASS:{label:'pass',minScore:75},AVERAGE:{label:'average',minScore:45},FAIL:{label:'fail'},};class Util{static calculateRating(score){let rating=RATINGS.FAIL.label;if(score>=RATINGS.PASS.minScore){rating=RATINGS.PASS.label;}else if(score>=RATINGS.AVERAGE.minScore){rating=RATINGS.AVERAGE.label;}
return rating;}
static formatNumber(number,decimalPlaces=1){return number.toLocaleString(undefined,{maximumFractionDigits:decimalPlaces});}
static formatBytesToKB(size,decimalPlaces=2){const kbs=(size/1024).toLocaleString(undefined,{maximumFractionDigits:decimalPlaces});return`${kbs}${NBSP}KB`;}
static formatMilliseconds(ms,granularity=10){const coarseTime=Math.round(ms/granularity)*granularity;return`${coarseTime.toLocaleString()}${NBSP}ms`;}
static formatDateTime(date){const options={month:'short',day:'numeric',year:'numeric',hour:'numeric',minute:'numeric',timeZoneName:'short',};let formatter=new Intl.DateTimeFormat('en-US',options);const tz=formatter.resolvedOptions().timeZone;if(!tz||tz.toLowerCase()==='etc/unknown'){options.timeZone='UTC';formatter=new Intl.DateTimeFormat('en-US',options);}
return formatter.format(new Date(date));}
static formatDuration(timeInSeconds,zeroLabel='None'){if(timeInSeconds===0){return zeroLabel;}
const parts=[];const unitLabels=({d:60*60*24,h:60*60,m:60,s:1,});Object.keys(unitLabels).forEach(label=>{const unit=unitLabels[label];const numberOfUnits=Math.floor(timeInSeconds/unit);if(numberOfUnits>0){timeInSeconds-=numberOfUnits*unit;parts.push(`${numberOfUnits}\xa0${label}`);}});return parts.join(' ');}
static getURLDisplayName(parsedUrl,options){options=options||{};const numPathParts=options.numPathParts!==undefined?options.numPathParts:2;const preserveQuery=options.preserveQuery!==undefined?options.preserveQuery:true;const preserveHost=options.preserveHost||false;let name;if(parsedUrl.protocol==='about:'||parsedUrl.protocol==='data:'){name=parsedUrl.href;}else{name=parsedUrl.pathname;const parts=name.split('/').filter(part=>part.length);if(numPathParts&&parts.length>numPathParts){name=ELLIPSIS+parts.slice(-1*numPathParts).join('/');}
if(preserveHost){name=`${parsedUrl.host}/${name.replace(/^\//, '')}`;}
if(preserveQuery){name=`${name}${parsedUrl.search}`;}}
const MAX_LENGTH=64;name=name.replace(/([a-f0-9]{7})[a-f0-9]{13}[a-f0-9]*/g,`$1${ELLIPSIS}`);name=name.replace(/([a-zA-Z0-9-_]{9})(?=.*[a-z])(?=.*[A-Z])(?=.*[0-9])[a-zA-Z0-9-_]{10,}/g,`$1${ELLIPSIS}`);name=name.replace(/(\d{3})\d{6,}/g,`$1${ELLIPSIS}`);name=name.replace(/\u2026+/g,ELLIPSIS);if(name.length>MAX_LENGTH&&name.includes('?')){name=name.replace(/\?([^=]*)(=)?.*/,`?$1$2${ELLIPSIS}`);if(name.length>MAX_LENGTH){name=name.replace(/\?.*/,`?${ELLIPSIS}`);}}
if(name.length>MAX_LENGTH){const dotIndex=name.lastIndexOf('.');if(dotIndex>=0){name=name.slice(0,MAX_LENGTH-1-(name.length-dotIndex))+`${ELLIPSIS}${name.slice(dotIndex)}`;}else{name=name.slice(0,MAX_LENGTH-1)+ELLIPSIS;}}
return name;}
static parseURL(url){const parsedUrl=new URL(url);return{file:Util.getURLDisplayName(parsedUrl),hostname:parsedUrl.hostname};}
static chainDuration(startTime,endTime){return Util.formatNumber((endTime-startTime)*1000);}}
if(typeof module!=='undefined'&&module.exports){module.exports=Util;}else{self.Util=Util;};'use strict';class DOM{constructor(document){this._document=document;}
createElement(name,className,attrs={}){const element=this._document.createElement(name);if(className){element.className=className;}
Object.keys(attrs).forEach(key=>{const value=attrs[key];if(typeof value!=='undefined'){element.setAttribute(key,value);}});return element;}
createChildOf(parentElem,elementName,className,attrs){const element=this.createElement(elementName,className,attrs);parentElem.appendChild(element);return element;}
cloneTemplate(selector,context){const template=(context.querySelector(selector));if(!template){throw new Error(`Template not found: template${selector}`);}
const clone=(this._document.importNode(template.content,true));if(template.hasAttribute('data-stamped')){this.findAll('style',clone).forEach(style=>style.remove());}
template.setAttribute('data-stamped',true);return clone;}
resetTemplates(){this.findAll('template[data-stamped]',this._document).forEach(t=>{t.removeAttribute('data-stamped');});}
convertMarkdownLinkSnippets(text){const element=this.createElement('span');const parts=text.split(/\[([^\]]*?)\]\((https?:\/\/.*?)\)/g);while(parts.length){const[preambleText,linkText,linkHref]=parts.splice(0,3);element.appendChild(this._document.createTextNode(preambleText));if(linkText&&linkHref){const a=(this.createElement('a'));a.rel='noopener';a.target='_blank';a.textContent=linkText;a.href=(new URL(linkHref)).href;element.appendChild(a);}}
return element;}
convertMarkdownCodeSnippets(text){const element=this.createElement('span');const parts=text.split(/`(.*?)`/g);while(parts.length){const[preambleText,codeText]=parts.splice(0,2);element.appendChild(this._document.createTextNode(preambleText));if(codeText){const pre=(this.createElement('code'));pre.textContent=codeText;element.appendChild(pre);}}
return element;}
document(){return this._document;}
find(query,context){const result=context.querySelector(query);if(result===null){throw new Error(`query ${query} not found`);}
return result;}
findAll(query,context){return Array.from(context.querySelectorAll(query));}}
if(typeof module!=='undefined'&&module.exports){module.exports=DOM;}else{self.DOM=DOM;};'use strict';class CategoryRenderer{constructor(dom,detailsRenderer){this._dom=dom;this._detailsRenderer=detailsRenderer;this._templateContext=this._dom.document();this._detailsRenderer.setTemplateContext(this._templateContext);}
_renderAuditScore(audit){const tmpl=this._dom.cloneTemplate('#tmpl-lh-audit-score',this._templateContext);const scoringMode=audit.result.scoringMode;const description=audit.result.helpText;let title=audit.result.description;if(audit.result.displayValue){title+=`:  ${audit.result.displayValue}`;}
if(audit.result.debugString){const debugStrEl=tmpl.appendChild(this._dom.createElement('div','lh-debug'));debugStrEl.textContent=audit.result.debugString;}
const header=(this._dom.find('.lh-score__header',tmpl));if(audit.result.details){header.appendChild(this._detailsRenderer.render(audit.result.details));}
const scoreEl=this._dom.find('.lh-score',tmpl);if(audit.result.informative){scoreEl.classList.add('lh-score--informative');}
if(audit.result.manual){scoreEl.classList.add('lh-score--manual');}
return this._populateScore(tmpl,audit.score,scoringMode,title,description);}
_populateScore(element,score,scoringMode,title,description){const valueEl=this._dom.find('.lh-score__value',element);valueEl.textContent=Util.formatNumber(score);valueEl.classList.add(`lh-score__value--${Util.calculateRating(score)}`,`lh-score__value--${scoringMode}`);this._dom.find('.lh-score__title',element).appendChild(this._dom.convertMarkdownCodeSnippets(title));this._dom.find('.lh-score__description',element).appendChild(this._dom.convertMarkdownLinkSnippets(description));return(element);}
_renderCategoryScore(category){const tmpl=this._dom.cloneTemplate('#tmpl-lh-category-score',this._templateContext);const score=Math.round(category.score);const gaugeContainerEl=this._dom.find('.lh-score__gauge',tmpl);const gaugeEl=this.renderScoreGauge(category);gaugeContainerEl.appendChild(gaugeEl);return this._populateScore(tmpl,score,'numeric',category.name,category.description);}
_renderAudit(audit){const element=this._dom.createElement('div','lh-audit');element.appendChild(this._renderAuditScore(audit));return element;}
_renderTimelineMetricAudit(audit,scale){const tmpl=this._dom.cloneTemplate('#tmpl-lh-timeline-metric',this._templateContext);const element=this._dom.find('.lh-timeline-metric',tmpl);element.classList.add(`lh-timeline-metric--${Util.calculateRating(audit.score)}`);const titleEl=this._dom.find('.lh-timeline-metric__title',tmpl);titleEl.textContent=audit.result.description;const valueEl=this._dom.find('.lh-timeline-metric__value',tmpl);valueEl.textContent=audit.result.displayValue;const descriptionEl=this._dom.find('.lh-timeline-metric__description',tmpl);descriptionEl.appendChild(this._dom.convertMarkdownLinkSnippets(audit.result.helpText));if(typeof audit.result.rawValue!=='number'){const debugStrEl=this._dom.createChildOf(element,'div','lh-debug');debugStrEl.textContent=audit.result.debugString||'Report error: no metric information';return element;}
const sparklineBarEl=this._dom.find('.lh-sparkline__bar',tmpl);sparklineBarEl.style.width=`${audit.result.rawValue / scale * 100}%`;return element;}
_renderPerfHintAudit(audit,scale){const extendedInfo=(audit.result.extendedInfo);const tooltipAttrs={title:audit.result.displayValue};const element=this._dom.createElement('details',['lh-perf-hint',`lh-perf-hint--${Util.calculateRating(audit.score)}`,'lh-expandable-details',].join(' '));const summary=this._dom.createChildOf(element,'summary','lh-perf-hint__summary '+'lh-expandable-details__summary');const titleEl=this._dom.createChildOf(summary,'div','lh-perf-hint__title');titleEl.textContent=audit.result.description;this._dom.createChildOf(summary,'div','lh-toggle-arrow',{title:'See resources'});if(!extendedInfo||typeof audit.result.rawValue!=='number'){const debugStrEl=this._dom.createChildOf(summary,'div','lh-debug');debugStrEl.textContent=audit.result.debugString||'Report error: no extended information';return element;}
const sparklineContainerEl=this._dom.createChildOf(summary,'div','lh-perf-hint__sparkline',tooltipAttrs);const sparklineEl=this._dom.createChildOf(sparklineContainerEl,'div','lh-sparkline');const sparklineBarEl=this._dom.createChildOf(sparklineEl,'div','lh-sparkline__bar');sparklineBarEl.style.width=audit.result.rawValue/scale*100+'%';const statsEl=this._dom.createChildOf(summary,'div','lh-perf-hint__stats',tooltipAttrs);const statsMsEl=this._dom.createChildOf(statsEl,'div','lh-perf-hint__primary-stat');statsMsEl.textContent=Util.formatMilliseconds(audit.result.rawValue);if(extendedInfo.value.wastedKb){const statsKbEl=this._dom.createChildOf(statsEl,'div','lh-perf-hint__secondary-stat');statsKbEl.textContent=Util.formatNumber(extendedInfo.value.wastedKb)+' KB';}
const descriptionEl=this._dom.createChildOf(element,'div','lh-perf-hint__description');descriptionEl.appendChild(this._dom.convertMarkdownLinkSnippets(audit.result.helpText));if(audit.result.debugString){const debugStrEl=this._dom.createChildOf(summary,'div','lh-debug');debugStrEl.textContent=audit.result.debugString;}
if(audit.result.details){element.appendChild(this._detailsRenderer.render(audit.result.details));}
return element;}
_renderAuditGroup(group,opts){const expandable=opts.expandable;const element=this._dom.createElement(expandable?'details':'div','lh-audit-group');const summmaryEl=this._dom.createChildOf(element,'summary','lh-audit-group__summary');const headerEl=this._dom.createChildOf(summmaryEl,'div','lh-audit-group__header');this._dom.createChildOf(summmaryEl,'div',`lh-toggle-arrow  ${expandable ? '' : ' lh-toggle-arrow-unexpandable'}`,{title:'See audits',});if(group.description){const auditGroupDescription=this._dom.createElement('div','lh-audit-group__description');auditGroupDescription.appendChild(this._dom.convertMarkdownLinkSnippets(group.description));element.appendChild(auditGroupDescription);}
headerEl.textContent=group.title;return element;}
_getTotalAuditsLength(elements){const scratch=this._dom.createElement('div');elements.forEach(function(element){scratch.appendChild(element);});const subAudits=scratch.querySelectorAll('.lh-audit');if(subAudits.length){return subAudits.length;}else{return elements.length;}}
_renderPassedAuditsSection(elements){const passedElem=this._renderAuditGroup({title:`${this._getTotalAuditsLength(elements)} Passed Audits`,},{expandable:true});passedElem.classList.add('lh-passed-audits');elements.forEach(elem=>passedElem.appendChild(elem));return passedElem;}
_renderNotApplicableAuditsSection(elements){const notApplicableElem=this._renderAuditGroup({title:`${this._getTotalAuditsLength(elements)} Not Applicable Audits`,},{expandable:true});notApplicableElem.classList.add('lh-audit-group--notapplicable');elements.forEach(elem=>notApplicableElem.appendChild(elem));return notApplicableElem;}
_renderManualAudits(manualAudits,groupDefinitions,element){const auditsGroupedByGroup=({});manualAudits.forEach(audit=>{const group=auditsGroupedByGroup[audit.group]||[];group.push(audit);auditsGroupedByGroup[audit.group]=group;});Object.keys(auditsGroupedByGroup).forEach(groupId=>{const group=groupDefinitions[groupId];const auditGroupElem=this._renderAuditGroup(group,{expandable:true});auditGroupElem.classList.add('lh-audit-group--manual');auditsGroupedByGroup[groupId].forEach(audit=>{auditGroupElem.appendChild(this._renderAudit(audit));});element.appendChild(auditGroupElem);});}
setTemplateContext(context){this._templateContext=context;this._detailsRenderer.setTemplateContext(context);}
renderScoreGauge(category){const tmpl=this._dom.cloneTemplate('#tmpl-lh-gauge',this._templateContext);this._dom.find('.lh-gauge__wrapper',tmpl).href=`#${category.id}`;this._dom.find('.lh-gauge__label',tmpl).textContent=category.name;const score=Math.round(category.score);const fillRotation=Math.floor((score/100)*180);const gauge=this._dom.find('.lh-gauge',tmpl);gauge.setAttribute('data-progress',score);gauge.classList.add(`lh-gauge--${Util.calculateRating(score)}`);this._dom.findAll('.lh-gauge__fill',gauge).forEach(el=>{el.style.transform=`rotate(${fillRotation}deg)`;});this._dom.find('.lh-gauge__mask--full',gauge).style.transform=`rotate(${fillRotation}deg)`;this._dom.find('.lh-gauge__fill--fix',gauge).style.transform=`rotate(${fillRotation * 2}deg)`;this._dom.find('.lh-gauge__percentage',gauge).textContent=score;return tmpl;}
render(category,groups){switch(category.id){case'performance':return this.renderPerformanceCategory(category,groups);case'accessibility':return this._renderAccessibilityCategory(category,groups);default:return this._renderDefaultCategory(category,groups);}}
_renderDefaultCategory(category,groupDefinitions){const element=this._dom.createElement('div','lh-category');this._createPermalinkSpan(element,category.id);element.appendChild(this._renderCategoryScore(category));const manualAudits=category.audits.filter(audit=>audit.result.manual);const nonManualAudits=category.audits.filter(audit=>!manualAudits.includes(audit));const passedAudits=nonManualAudits.filter(audit=>audit.score===100&&!audit.result.debugString);const nonPassedAudits=nonManualAudits.filter(audit=>!passedAudits.includes(audit));const nonPassedElem=this._renderAuditGroup({title:`${nonPassedAudits.length} Failed Audits`,},{expandable:false});nonPassedElem.classList.add('lh-failed-audits');nonPassedAudits.forEach(audit=>nonPassedElem.appendChild(this._renderAudit(audit)));element.appendChild(nonPassedElem);if(passedAudits.length){const passedElem=this._renderPassedAuditsSection(passedAudits.map(audit=>this._renderAudit(audit)));element.appendChild(passedElem);}
this._renderManualAudits(manualAudits,groupDefinitions,element);return element;}
renderPerformanceCategory(category,groups){const element=this._dom.createElement('div','lh-category');this._createPermalinkSpan(element,category.id);element.appendChild(this._renderCategoryScore(category));const metricAudits=category.audits.filter(audit=>audit.group==='perf-metric');const metricAuditsEl=this._renderAuditGroup(groups['perf-metric'],{expandable:false});const timelineContainerEl=this._dom.createChildOf(metricAuditsEl,'div','lh-timeline-container');const timelineEl=this._dom.createChildOf(timelineContainerEl,'div','lh-timeline');let perfTimelineScale=0;metricAudits.forEach(audit=>{if(typeof audit.result.rawValue==='number'&&audit.result.rawValue){perfTimelineScale=Math.max(perfTimelineScale,audit.result.rawValue);}});const thumbnailAudit=category.audits.find(audit=>audit.id==='screenshot-thumbnails');const thumbnailResult=thumbnailAudit&&thumbnailAudit.result;if(thumbnailResult&&thumbnailResult.details){const thumbnailDetails=(thumbnailResult.details);perfTimelineScale=Math.max(perfTimelineScale,thumbnailDetails.scale);const filmstripEl=this._detailsRenderer.render(thumbnailDetails);timelineEl.appendChild(filmstripEl);}
metricAudits.forEach(item=>{if(item.id==='speed-index-metric'||item.id==='estimated-input-latency'){return metricAuditsEl.appendChild(this._renderAudit(item));}
timelineEl.appendChild(this._renderTimelineMetricAudit(item,perfTimelineScale));});metricAuditsEl.open=true;element.appendChild(metricAuditsEl);const hintAudits=category.audits.filter(audit=>audit.group==='perf-hint'&&audit.score<100).sort((auditA,auditB)=>auditB.result.rawValue-auditA.result.rawValue);if(hintAudits.length){const maxWaste=Math.max(...hintAudits.map(audit=>audit.result.rawValue));const scale=Math.ceil(maxWaste/1000)*1000;const hintAuditsEl=this._renderAuditGroup(groups['perf-hint'],{expandable:false});hintAudits.forEach(item=>hintAuditsEl.appendChild(this._renderPerfHintAudit(item,scale)));hintAuditsEl.open=true;element.appendChild(hintAuditsEl);}
const infoAudits=category.audits.filter(audit=>audit.group==='perf-info'&&audit.score<100);if(infoAudits.length){const infoAuditsEl=this._renderAuditGroup(groups['perf-info'],{expandable:false});infoAudits.forEach(item=>infoAuditsEl.appendChild(this._renderAudit(item)));infoAuditsEl.open=true;element.appendChild(infoAuditsEl);}
const passedElements=category.audits.filter(audit=>(audit.group==='perf-hint'||audit.group==='perf-info')&&audit.score===100).map(audit=>this._renderAudit(audit));if(!passedElements.length)return element;const passedElem=this._renderPassedAuditsSection(passedElements);element.appendChild(passedElem);return element;}
_renderAccessibilityCategory(category,groupDefinitions){const element=this._dom.createElement('div','lh-category');this._createPermalinkSpan(element,category.id);element.appendChild(this._renderCategoryScore(category));const manualAudits=category.audits.filter(audit=>audit.result.manual);const nonManualAudits=category.audits.filter(audit=>!manualAudits.includes(audit));const auditsGroupedByGroup=({});nonManualAudits.forEach(audit=>{const groupId=audit.group;const groups=auditsGroupedByGroup[groupId]||{passed:[],failed:[],notApplicable:[]};if(audit.result.notApplicable){groups.notApplicable.push(audit);}else if(audit.score===100){groups.passed.push(audit);}else{groups.failed.push(audit);}
auditsGroupedByGroup[groupId]=groups;});const passedElements=([]);const notApplicableElements=([]);Object.keys(auditsGroupedByGroup).forEach(groupId=>{const group=groupDefinitions[groupId];const groups=auditsGroupedByGroup[groupId];if(groups.failed.length){const auditGroupElem=this._renderAuditGroup(group,{expandable:false});groups.failed.forEach(item=>auditGroupElem.appendChild(this._renderAudit(item)));auditGroupElem.open=true;element.appendChild(auditGroupElem);}
if(groups.passed.length){const auditGroupElem=this._renderAuditGroup(group,{expandable:true});groups.passed.forEach(item=>auditGroupElem.appendChild(this._renderAudit(item)));passedElements.push(auditGroupElem);}
if(groups.notApplicable.length){const auditGroupElem=this._renderAuditGroup(group,{expandable:true});groups.notApplicable.forEach(item=>auditGroupElem.appendChild(this._renderAudit(item)));notApplicableElements.push(auditGroupElem);}});if(passedElements.length){const passedElem=this._renderPassedAuditsSection(passedElements);element.appendChild(passedElem);}
if(notApplicableElements.length){const notApplicableElem=this._renderNotApplicableAuditsSection(notApplicableElements);element.appendChild(notApplicableElem);}
this._renderManualAudits(manualAudits,groupDefinitions,element);return element;}
_createPermalinkSpan(element,id){const permalinkEl=this._dom.createChildOf(element,'span','lh-permalink');permalinkEl.id=id;}}
if(typeof module!=='undefined'&&module.exports){module.exports=CategoryRenderer;}else{self.CategoryRenderer=CategoryRenderer;}
CategoryRenderer.PerfHintExtendedInfo;;'use strict';class DetailsRenderer{constructor(dom){this._dom=dom;this._templateContext;}
setTemplateContext(context){this._templateContext=context;}
render(details){switch(details.type){case'text':return this._renderText(details);case'url':return this._renderTextURL(details);case'link':return this._renderLink((details));case'thumbnail':return this._renderThumbnail((details));case'filmstrip':return this._renderFilmstrip((details));case'cards':return this._renderCards((details));case'table':return this._renderTable((details));case'code':return this._renderCode(details);case'node':return this.renderNode((details));case'criticalrequestchain':return CriticalRequestChainRenderer.render(this._dom,this._templateContext,(details));case'list':return this._renderList((details));default:throw new Error(`Unknown type: ${details.type}`);}}
_renderTextURL(text){const url=text.text||'';let displayedPath;let displayedHost;let title;try{const parsed=Util.parseURL(url);displayedPath=parsed.file;displayedHost=`(${parsed.hostname})`;title=url;}catch(e){if(!(e instanceof TypeError)){throw e;}
displayedPath=url;}
const element=this._dom.createElement('div','lh-text__url');element.appendChild(this._renderText({text:displayedPath,type:'text',}));if(displayedHost){const hostElem=this._renderText({text:displayedHost,type:'text',});hostElem.classList.add('lh-text__url-host');element.appendChild(hostElem);}
if(title)element.title=url;return element;}
_renderLink(details){const allowedProtocols=['https:','http:'];const url=new URL(details.url);if(!allowedProtocols.includes(url.protocol)){return this._renderText(details);}
const a=(this._dom.createElement('a'));a.rel='noopener';a.target='_blank';a.textContent=details.text;a.href=url.href;return a;}
_renderText(text){const element=this._dom.createElement('div','lh-text');element.textContent=text.text;return element;}
_renderThumbnail(value){if(/^image/.test(value.mimeType)===false){return this._dom.createElement('span');}
const element=this._dom.createElement('img','lh-thumbnail');element.src=value.url;element.alt='';element.title=value.url;return element;}
_renderList(list){if(!list.items.length)return this._dom.createElement('span');const element=this._dom.createElement('details','lh-details');element.open=true;if(list.header){const summary=this._dom.createElement('summary','lh-list__header');summary.textContent=list.header.text;element.appendChild(summary);}
const itemsElem=this._dom.createChildOf(element,'div','lh-list__items');for(const item of list.items){const itemElem=this._dom.createChildOf(itemsElem,'span','lh-list__item');itemElem.appendChild(this.render(item));}
return element;}
_renderTable(details){if(!details.items.length)return this._dom.createElement('span');const element=this._dom.createElement('details','lh-details');element.open=true;if(details.header){element.appendChild(this._dom.createElement('summary')).textContent=details.header;}
const tableElem=this._dom.createChildOf(element,'table','lh-table');const theadElem=this._dom.createChildOf(tableElem,'thead');const theadTrElem=this._dom.createChildOf(theadElem,'tr');for(const heading of details.itemHeaders){const itemType=heading.itemType||'text';const classes=`lh-table-column--${itemType}`;this._dom.createChildOf(theadTrElem,'th',classes).appendChild(this.render(heading));}
const tbodyElem=this._dom.createChildOf(tableElem,'tbody');for(const row of details.items){const rowElem=this._dom.createChildOf(tbodyElem,'tr');for(const columnItem of row){const classes=`lh-table-column--${columnItem.type}`;this._dom.createChildOf(rowElem,'td',classes).appendChild(this.render(columnItem));}}
return element;}
renderNode(item){const element=this._dom.createElement('span','lh-node');element.textContent=item.snippet;element.title=item.selector;if(item.text)element.setAttribute('data-text',item.text);if(item.path)element.setAttribute('data-path',item.path);if(item.selector)element.setAttribute('data-selector',item.selector);if(item.snippet)element.setAttribute('data-snippet',item.snippet);return element;}
_renderCards(details){const element=this._dom.createElement('details','lh-details');element.open=true;if(details.header){element.appendChild(this._dom.createElement('summary')).textContent=details.header.text;}
const cardsParent=this._dom.createElement('div','lh-scorecards');for(const item of details.items){const card=cardsParent.appendChild(this._dom.createElement('div','lh-scorecard',{title:item.snippet}));const titleEl=this._dom.createElement('div','lh-scorecard__title');const valueEl=this._dom.createElement('div','lh-scorecard__value');const targetEl=this._dom.createElement('div','lh-scorecard__target');card.appendChild(titleEl).textContent=item.title;card.appendChild(valueEl).textContent=item.value;if(item.target){card.appendChild(targetEl).textContent=`target: ${item.target}`;}}
element.appendChild(cardsParent);return element;}
_renderFilmstrip(details){const filmstripEl=this._dom.createElement('div','lh-filmstrip');for(const thumbnail of details.items){const frameEl=this._dom.createChildOf(filmstripEl,'div','lh-filmstrip__frame');let timing=Util.formatMilliseconds(thumbnail.timing,1);if(thumbnail.timing>1000){timing=Util.formatNumber(thumbnail.timing/1000)+' s';}
const timingEl=this._dom.createChildOf(frameEl,'div','lh-filmstrip__timestamp');timingEl.textContent=timing;const base64data=thumbnail.data;this._dom.createChildOf(frameEl,'img','lh-filmstrip__thumbnail',{src:`data:image/jpeg;base64,${base64data}`,alt:`Screenshot at ${timing}`,});}
return filmstripEl;}
_renderCode(details){const pre=this._dom.createElement('pre','lh-code');pre.textContent=details.text;return pre;}}
if(typeof module!=='undefined'&&module.exports){module.exports=DetailsRenderer;}else{self.DetailsRenderer=DetailsRenderer;}
DetailsRenderer.DetailsJSON;DetailsRenderer.ListDetailsJSON;DetailsRenderer.NodeDetailsJSON;DetailsRenderer.CardsDetailsJSON;DetailsRenderer.TableHeaderJSON;DetailsRenderer.NodeDetailsJSON;DetailsRenderer.TableDetailsJSON;DetailsRenderer.ThumbnailDetails;DetailsRenderer.LinkDetailsJSON;DetailsRenderer.FilmstripDetails;;'use strict';class CriticalRequestChainRenderer{static initTree(tree){let startTime=0;const rootNodes=Object.keys(tree);if(rootNodes.length>0){const node=tree[rootNodes[0]];startTime=node.request.startTime;}
return{tree,startTime,transferSize:0};}
static createSegment(parent,id,startTime,transferSize,treeMarkers,parentIsLastChild){const node=parent[id];const siblings=Object.keys(parent);const isLastChild=siblings.indexOf(id)===(siblings.length-1);const hasChildren=Object.keys(node.children).length>0;const newTreeMarkers=Array.isArray(treeMarkers)?treeMarkers.slice(0):[];if(typeof parentIsLastChild!=='undefined'){newTreeMarkers.push(!parentIsLastChild);}
return{node,isLastChild,hasChildren,startTime,transferSize:transferSize+node.request.transferSize,treeMarkers:newTreeMarkers,};}
static createChainNode(dom,tmpl,segment){const chainsEl=dom.cloneTemplate('#tmpl-lh-crc__chains',tmpl);dom.find('.crc-node',chainsEl).setAttribute('title',segment.node.request.url);const treeMarkeEl=dom.find('.crc-node__tree-marker',chainsEl);segment.treeMarkers.forEach(separator=>{if(separator){treeMarkeEl.appendChild(dom.createElement('span','tree-marker vert'));treeMarkeEl.appendChild(dom.createElement('span','tree-marker'));}else{treeMarkeEl.appendChild(dom.createElement('span','tree-marker'));treeMarkeEl.appendChild(dom.createElement('span','tree-marker'));}});if(segment.isLastChild){treeMarkeEl.appendChild(dom.createElement('span','tree-marker up-right'));treeMarkeEl.appendChild(dom.createElement('span','tree-marker right'));}else{treeMarkeEl.appendChild(dom.createElement('span','tree-marker vert-right'));treeMarkeEl.appendChild(dom.createElement('span','tree-marker right'));}
if(segment.hasChildren){treeMarkeEl.appendChild(dom.createElement('span','tree-marker horiz-down'));}else{treeMarkeEl.appendChild(dom.createElement('span','tree-marker right'));}
const{file,hostname}=Util.parseURL(segment.node.request.url);const treevalEl=dom.find('.crc-node__tree-value',chainsEl);dom.find('.crc-node__tree-file',treevalEl).textContent=`${file}`;dom.find('.crc-node__tree-hostname',treevalEl).textContent=`(${hostname})`;if(!segment.hasChildren){const span=dom.createElement('span','crc-node__chain-duration');span.textContent=' - '+Util.chainDuration(segment.node.request.startTime,segment.node.request.endTime)+'ms, ';const span2=dom.createElement('span','crc-node__chain-duration');span2.textContent=Util.formatBytesToKB(segment.node.request.transferSize);treevalEl.appendChild(span);treevalEl.appendChild(span2);}
return chainsEl;}
static buildTree(dom,tmpl,segment,detailsEl,details){detailsEl.appendChild(CriticalRequestChainRenderer.createChainNode(dom,tmpl,segment));for(const key of Object.keys(segment.node.children)){const childSegment=CriticalRequestChainRenderer.createSegment(segment.node.children,key,segment.startTime,segment.transferSize,segment.treeMarkers,segment.isLastChild);CriticalRequestChainRenderer.buildTree(dom,tmpl,childSegment,detailsEl,details);}}
static render(dom,templateContext,details){const tmpl=dom.cloneTemplate('#tmpl-lh-crc',templateContext);dom.find('.lh-crc__longest_duration',tmpl).textContent=Util.formatNumber(details.longestChain.duration)+'ms';dom.find('.lh-crc__longest_length',tmpl).textContent=details.longestChain.length;dom.find('.lh-crc__longest_transfersize',tmpl).textContent=Util.formatBytesToKB(details.longestChain.transferSize);const detailsEl=dom.find('.lh-details',tmpl);detailsEl.open=true;dom.find('.lh-details > summary',tmpl).textContent=details.header.text;const root=CriticalRequestChainRenderer.initTree(details.chains);for(const key of Object.keys(root.tree)){const segment=CriticalRequestChainRenderer.createSegment(root.tree,key,root.startTime,root.transferSize);CriticalRequestChainRenderer.buildTree(dom,tmpl,segment,detailsEl,details);}
return tmpl;}}
if(typeof module!=='undefined'&&module.exports){module.exports=CriticalRequestChainRenderer;}else{self.CriticalRequestChainRenderer=CriticalRequestChainRenderer;}
CriticalRequestChainRenderer.CRCDetailsJSON;CriticalRequestChainRenderer.CRCRequest;CriticalRequestChainRenderer.CRCNode=function(){};CriticalRequestChainRenderer.CRCNode.prototype.children;CriticalRequestChainRenderer.CRCNode.prototype.request;CriticalRequestChainRenderer.CRCSegment;;'use strict';class ReportRenderer{constructor(dom,categoryRenderer){this._dom=dom;this._categoryRenderer=categoryRenderer;this._templateContext=this._dom.document();}
renderReport(report,container){container.textContent='';const element=container.appendChild(this._renderReport(report));return(element);}
setTemplateContext(context){this._templateContext=context;this._categoryRenderer.setTemplateContext(context);}
_renderReportHeader(report){const header=this._dom.cloneTemplate('#tmpl-lh-heading',this._templateContext);this._dom.find('.lh-config__timestamp',header).textContent=Util.formatDateTime(report.generatedTime);const url=this._dom.find('.lh-metadata__url',header);url.href=report.url;url.textContent=report.url;this._dom.find('.lh-env__item__ua',header).textContent=report.userAgent;const env=this._dom.find('.lh-env__items',header);report.runtimeConfig.environment.forEach(runtime=>{const item=this._dom.cloneTemplate('#tmpl-lh-env__items',env);this._dom.find('.lh-env__name',item).textContent=runtime.name;this._dom.find('.lh-env__description',item).textContent=runtime.description;this._dom.find('.lh-env__enabled',item).textContent=runtime.enabled?'Enabled':'Disabled';env.appendChild(item);});return header;}
_renderReportFooter(report){const footer=this._dom.cloneTemplate('#tmpl-lh-footer',this._templateContext);this._dom.find('.lh-footer__version',footer).textContent=report.lighthouseVersion;this._dom.find('.lh-footer__timestamp',footer).textContent=Util.formatDateTime(report.generatedTime);return footer;}
_renderReportNav(report){const leftNav=this._dom.cloneTemplate('#tmpl-lh-leftnav',this._templateContext);this._dom.find('.leftnav__header__version',leftNav).textContent=`Version: ${report.lighthouseVersion}`;const nav=this._dom.find('.lh-leftnav',leftNav);for(const category of report.reportCategories){const itemsTmpl=this._dom.cloneTemplate('#tmpl-lh-leftnav__items',leftNav);const navItem=this._dom.find('.lh-leftnav__item',itemsTmpl);navItem.href=`#${category.id}`;this._dom.find('.leftnav-item__category',navItem).textContent=category.name;const score=this._dom.find('.leftnav-item__score',navItem);score.classList.add(`lh-score__value--${Util.calculateRating(category.score)}`);score.textContent=Math.round(category.score);nav.appendChild(navItem);}
return leftNav;}
_renderReportWarnings(report){if(!report.runWarnings||report.runWarnings.length===0){return this._dom.createElement('div');}
const container=this._dom.cloneTemplate('#tmpl-lh-run-warnings',this._templateContext);const warnings=this._dom.find('ul',container);for(const warningString of report.runWarnings){const warning=warnings.appendChild(this._dom.createElement('li'));warning.textContent=warningString;}
return container;}
_renderReport(report){const container=this._dom.createElement('div','lh-container');container.appendChild(this._renderReportHeader(report));container.appendChild(this._renderReportNav(report));const reportSection=container.appendChild(this._dom.createElement('div','lh-report'));reportSection.appendChild(this._renderReportWarnings(report));let scoreHeader;const isSoloCategory=report.reportCategories.length===1;if(!isSoloCategory){scoreHeader=reportSection.appendChild(this._dom.createElement('div','lh-scores-header'));}
const categories=reportSection.appendChild(this._dom.createElement('div','lh-categories'));for(const category of report.reportCategories){if(scoreHeader){scoreHeader.appendChild(this._categoryRenderer.renderScoreGauge(category));}
categories.appendChild(this._categoryRenderer.render(category,report.reportGroups));}
reportSection.appendChild(this._renderReportFooter(report));return container;}}
if(typeof module!=='undefined'&&module.exports){module.exports=ReportRenderer;}else{self.ReportRenderer=ReportRenderer;}
ReportRenderer.AuditJSON;ReportRenderer.CategoryJSON;ReportRenderer.GroupJSON;ReportRenderer.ReportJSON;;Audits2.Audits2Panel=class extends UI.Panel{constructor(){super('audits2');this.registerRequiredCSS('audits2/lighthouse/report-styles.css');this.registerRequiredCSS('audits2/audits2Panel.css');this._protocolService=new Audits2.ProtocolService();this._renderToolbar();this._auditResultsElement=this.contentElement.createChild('div','audits2-results-container');this._dropTarget=new UI.DropTarget(this.contentElement,[UI.DropTarget.Type.File],Common.UIString('Drop audit file here'),this._handleDrop.bind(this));for(const preset of Audits2.Audits2Panel.Presets)
preset.setting.addChangeListener(this._refreshDialogUI.bind(this));this._showLandingPage();SDK.targetManager.observeModels(SDK.ServiceWorkerManager,this);SDK.targetManager.addEventListener(SDK.TargetManager.Events.InspectedURLChanged,this._refreshDialogUI,this);}
modelAdded(serviceWorkerManager){if(this._manager)
return;this._manager=serviceWorkerManager;this._serviceWorkerListeners=[this._manager.addEventListener(SDK.ServiceWorkerManager.Events.RegistrationUpdated,this._refreshDialogUI,this),this._manager.addEventListener(SDK.ServiceWorkerManager.Events.RegistrationDeleted,this._refreshDialogUI,this),];this._refreshDialogUI();}
modelRemoved(serviceWorkerManager){if(!this._manager||this._manager!==serviceWorkerManager)
return;Common.EventTarget.removeEventListeners(this._serviceWorkerListeners);this._manager=null;this._serviceWorkerListeners=null;this._refreshDialogUI();}
_hasActiveServiceWorker(){if(!this._manager)
return false;const mainTarget=SDK.targetManager.mainTarget();if(!mainTarget)
return false;const inspectedURL=mainTarget.inspectedURL().asParsedURL();const inspectedOrigin=inspectedURL&&inspectedURL.securityOrigin();for(const registration of this._manager.registrations().values()){if(registration.securityOrigin!==inspectedOrigin)
continue;for(const version of registration.versions.values()){if(version.controlledClients.length>1)
return true;}}
return false;}
_hasAtLeastOneCategory(){return Audits2.Audits2Panel.Presets.some(preset=>preset.setting.get());}
_unauditablePageMessage(){if(!this._manager)
return null;const mainTarget=SDK.targetManager.mainTarget();const inspectedURL=mainTarget&&mainTarget.inspectedURL();if(inspectedURL&&!/^(http|chrome-extension)/.test(inspectedURL)){return Common.UIString('Can only audit HTTP/HTTPS pages and Chrome extensions. '+'Navigate to a different page to start an audit.');}
if(!Host.isUnderTest()&&!Runtime.queryParam('can_dock'))
return Common.UIString('Can only audit tabs. Navigate to this page in a separate tab to start an audit.');return null;}
_refreshDialogUI(){if(!this._dialog)
return;const hasActiveServiceWorker=this._hasActiveServiceWorker();const hasAtLeastOneCategory=this._hasAtLeastOneCategory();const unauditablePageMessage=this._unauditablePageMessage();const isDisabled=hasActiveServiceWorker||!hasAtLeastOneCategory||!!unauditablePageMessage;let helpText='';if(hasActiveServiceWorker){helpText=Common.UIString('Multiple tabs are being controlled by the same service worker. '+'Close your other tabs on the same origin to audit this page.');}else if(!hasAtLeastOneCategory){helpText=Common.UIString('At least one category must be selected.');}else if(unauditablePageMessage){helpText=unauditablePageMessage;}
this._dialog.setHelpText(helpText);this._dialog.setStartEnabled(!isDisabled);}
_refreshToolbarUI(){this._downloadButton.setEnabled(this._reportSelector.hasCurrentSelection());this._clearButton.setEnabled(this._reportSelector.hasItems());}
_clearAll(){this._reportSelector.clearAll();this._showLandingPage();this._refreshToolbarUI();}
_downloadSelected(){this._reportSelector.downloadSelected();}
_renderToolbar(){const toolbar=new UI.Toolbar('',this.element);this._newButton=new UI.ToolbarButton(Common.UIString('Perform an audit\u2026'),'largeicon-add');toolbar.appendToolbarItem(this._newButton);this._newButton.addEventListener(UI.ToolbarButton.Events.Click,this._showDialog.bind(this));this._downloadButton=new UI.ToolbarButton(Common.UIString('Download report'),'largeicon-download');toolbar.appendToolbarItem(this._downloadButton);this._downloadButton.addEventListener(UI.ToolbarButton.Events.Click,this._downloadSelected.bind(this));toolbar.appendSeparator();this._reportSelector=new Audits2.ReportSelector();toolbar.appendToolbarItem(this._reportSelector.comboBox());this._clearButton=new UI.ToolbarButton(Common.UIString('Clear all'),'largeicon-clear');toolbar.appendToolbarItem(this._clearButton);this._clearButton.addEventListener(UI.ToolbarButton.Events.Click,this._clearAll.bind(this));toolbar.appendSeparator();toolbar.appendText(ls`Emulation: `);for(const runtimeSetting of Audits2.Audits2Panel.RuntimeSettings){const control=new UI.ToolbarSettingComboBox(runtimeSetting.options,runtimeSetting.setting);control.element.title=runtimeSetting.description;toolbar.appendToolbarItem(control);}
this._refreshToolbarUI();}
_showLandingPage(){if(this._reportSelector.hasCurrentSelection())
return;this._auditResultsElement.removeChildren();const landingPage=this._auditResultsElement.createChild('div','vbox audits2-landing-page');const landingCenter=landingPage.createChild('div','vbox audits2-landing-center');landingCenter.createChild('div','audits2-logo');const text=landingCenter.createChild('div','audits2-landing-text');text.createChild('span','audits2-landing-bold-text').textContent=Common.UIString('Audits');text.createChild('span').textContent=Common.UIString(' help you identify and fix common problems that affect'+' your site\'s performance, accessibility, and user experience. ');const link=text.createChild('span','link');link.textContent=Common.UIString('Learn more');link.addEventListener('click',()=>InspectorFrontendHost.openInNewTab('https://developers.google.com/web/tools/lighthouse/'));const newButton=UI.createTextButton(Common.UIString('Perform an audit\u2026'),this._showDialog.bind(this),'',true);landingCenter.appendChild(newButton);this.setDefaultFocusedElement(newButton);this._refreshToolbarUI();}
_showDialog(){this._dialog=new Audits2.Audits2Dialog(result=>this._buildReportUI(result),this._protocolService);this._dialog.render(this._auditResultsElement);this._refreshDialogUI();}
_hideDialog(){if(!this._dialog)
return;this._dialog.hide();delete this._dialog;}
_buildReportUI(lighthouseResult){if(lighthouseResult===null)
return;const optionElement=new Audits2.ReportSelector.Item(lighthouseResult,this._auditResultsElement,this._showLandingPage.bind(this));this._reportSelector.prepend(optionElement);this._hideDialog();this._refreshToolbarUI();}
_handleDrop(dataTransfer){const items=dataTransfer.items;if(!items.length)
return;const item=items[0];if(item.kind==='file'){const entry=items[0].webkitGetAsEntry();if(!entry.isFile)
return;entry.file(file=>{const reader=new FileReader();reader.onload=()=>this._loadedFromFile((reader.result));reader.readAsText(file);});}}
_loadedFromFile(profile){const data=JSON.parse(profile);if(!data['lighthouseVersion'])
return;this._buildReportUI((data));}};Audits2.Audits2Panel.ReportRenderer=class extends ReportRenderer{_renderReportNav(){return createDocumentFragment();}
_renderReportHeader(report){return createDocumentFragment();}};class ReportUIFeatures{initFeatures(report){}}
Audits2.Audits2Panel.Preset;Audits2.Audits2Panel.Presets=[{setting:Common.settings.createSetting('audits2.cat_perf',true),configID:'performance',title:'Performance',description:'How long does this app take to show content and become usable'},{setting:Common.settings.createSetting('audits2.cat_pwa',true),configID:'pwa',title:'Progressive Web App',description:'Does this page meet the standard of a Progressive Web App'},{setting:Common.settings.createSetting('audits2.cat_best_practices',true),configID:'best-practices',title:'Best practices',description:'Does this page follow best practices for modern web development'},{setting:Common.settings.createSetting('audits2.cat_a11y',true),configID:'accessibility',title:'Accessibility',description:'Is this page usable by people with disabilities or impairments'},{setting:Common.settings.createSetting('audits2.cat_seo',true),configID:'seo',title:'SEO',description:'Is this page optimized for search engine results ranking'},];Audits2.Audits2Panel.RuntimeSetting;Audits2.Audits2Panel.RuntimeSettings=[{setting:Common.settings.createSetting('audits2.device_type','mobile'),description:Common.UIString('Apply mobile emulation during auditing'),setFlags:(flags,value)=>{flags.disableDeviceEmulation=value==='desktop';},options:[{label:Common.UIString('Mobile'),value:'mobile'},{label:Common.UIString('Desktop'),value:'desktop'},],},{setting:Common.settings.createSetting('audits2.throttling','default'),description:Common.UIString('Apply network and CPU throttling during performance auditing'),setFlags:(flags,value)=>{flags.disableNetworkThrottling=value==='off';flags.disableCpuThrottling=value==='off';},options:[{label:Common.UIString('3G w/ CPU slowdown'),value:'default'},{label:Common.UIString('No throttling'),value:'off'},],},{setting:Common.settings.createSetting('audits2.storage_reset','on'),description:Common.UIString('Reset storage (localStorage, IndexedDB, etc) to a clean baseline before auditing'),setFlags:(flags,value)=>{flags.disableStorageReset=value==='off';},options:[{label:Common.UIString('Clear storage'),value:'on'},{label:Common.UIString('Preserve storage'),value:'off'},],},];Audits2.ReportSelector=class{constructor(){this._emptyItem=null;this._comboBox=new UI.ToolbarComboBox(this._handleChange.bind(this),'audits2-report');this._comboBox.setMaxWidth(180);this._comboBox.setMinWidth(140);this._itemByOptionElement=new Map();this._setPlaceholderState();}
_setPlaceholderState(){this._comboBox.setEnabled(false);this._emptyItem=createElement('option');this._emptyItem.label=Common.UIString('(no reports)');this._comboBox.selectElement().appendChild(this._emptyItem);this._comboBox.select(this._emptyItem);}
_handleChange(event){const item=this._selectedItem();if(item)
item.select();}
_selectedItem(){const option=this._comboBox.selectedOption();return this._itemByOptionElement.get(option);}
hasCurrentSelection(){return!!this._selectedItem();}
hasItems(){return this._itemByOptionElement.size>0;}
comboBox(){return this._comboBox;}
prepend(item){if(this._emptyItem){this._emptyItem.remove();delete this._emptyItem;}
const optionEl=item.optionElement();const selectEl=this._comboBox.selectElement();this._itemByOptionElement.set(optionEl,item);selectEl.insertBefore(optionEl,selectEl.firstElementChild);this._comboBox.setEnabled(true);this._comboBox.select(optionEl);item.select();}
clearAll(){for(const elem of this._comboBox.options()){this._itemByOptionElement.get(elem).delete();this._itemByOptionElement.delete(elem);}
this._setPlaceholderState();}
downloadSelected(){const item=this._selectedItem();item.download();}};Audits2.ReportSelector.Item=class{constructor(lighthouseResult,resultsView,showLandingCallback){this._lighthouseResult=lighthouseResult;this._resultsView=resultsView;this._showLandingCallback=showLandingCallback;this._reportContainer=null;const url=new Common.ParsedURL(lighthouseResult.url);const timestamp=lighthouseResult.generatedTime;this._element=createElement('option');this._element.label=`${new Date(timestamp).toLocaleTimeString()} - ${url.domain()}`;}
select(){this._renderReport();}
optionElement(){return this._element;}
delete(){if(this._element)
this._element.remove();this._showLandingCallback();}
download(){const url=new Common.ParsedURL(this._lighthouseResult.url).domain();const timestamp=this._lighthouseResult.generatedTime;const fileName=`${url}-${new Date(timestamp).toISO8601Compact()}.json`;Workspace.fileManager.save(fileName,JSON.stringify(this._lighthouseResult),true);}
_renderReport(){this._resultsView.removeChildren();if(this._reportContainer){this._resultsView.appendChild(this._reportContainer);return;}
this._reportContainer=this._resultsView.createChild('div','lh-vars lh-root lh-devtools');const dom=new DOM((this._resultsView.ownerDocument));const detailsRenderer=new Audits2.DetailsRenderer(dom);const categoryRenderer=new Audits2.CategoryRenderer(dom,detailsRenderer);categoryRenderer.setTraceArtifact(this._lighthouseResult);const renderer=new Audits2.Audits2Panel.ReportRenderer(dom,categoryRenderer);const templatesHTML=Runtime.cachedResources['audits2/lighthouse/templates.html'];const templatesDOM=new DOMParser().parseFromString(templatesHTML,'text/html');if(!templatesDOM)
return;renderer.setTemplateContext(templatesDOM);renderer.renderReport(this._lighthouseResult,this._reportContainer);}};Audits2.CategoryRenderer=class extends CategoryRenderer{constructor(dom,detailsRenderer){super(dom,detailsRenderer);this._defaultPassTrace=null;}
setTraceArtifact(lhr){if(!lhr.artifacts||!lhr.artifacts.traces||!lhr.artifacts.traces.defaultPass)
return;this._defaultPassTrace=lhr.artifacts.traces.defaultPass;}
renderPerformanceCategory(category,groups){const defaultPassTrace=this._defaultPassTrace;const element=super.renderPerformanceCategory(category,groups);if(!defaultPassTrace)
return element;const timelineButton=UI.createTextButton(Common.UIString('View Trace'),onViewTraceClick,'view-trace');element.querySelector('.lh-audit-group').prepend(timelineButton);return element;async function onViewTraceClick(){await UI.inspectorView.showPanel('timeline');Timeline.TimelinePanel.instance().loadFromEvents(defaultPassTrace.traceEvents);}}};Audits2.DetailsRenderer=class extends DetailsRenderer{constructor(dom){super(dom);this._onMainFrameNavigatedPromise=null;}
renderNode(item){const element=super.renderNode(item);this._replaceWithDeferredNodeBlock(element,item);return element;}
async _replaceWithDeferredNodeBlock(origElement,detailsItem){const mainTarget=SDK.targetManager.mainTarget();if(!this._onMainFrameNavigatedPromise){const resourceTreeModel=mainTarget.model(SDK.ResourceTreeModel);this._onMainFrameNavigatedPromise=resourceTreeModel.once(SDK.ResourceTreeModel.Events.MainFrameNavigated);}
await this._onMainFrameNavigatedPromise;const domModel=mainTarget.model(SDK.DOMModel);if(!detailsItem.path)
return;const nodeId=await domModel.pushNodeByPathToFrontend(detailsItem.path);if(!nodeId)
return;const node=domModel.nodeForId(nodeId);if(!node)
return;const element=await Common.Linkifier.linkify(node,({title:detailsItem.snippet}));origElement.title='';origElement.textContent='';origElement.appendChild(element);}};;Audits2.Audits2Dialog=class{constructor(onAuditComplete,protocolService){this._onAuditComplete=onAuditComplete;this._protocolService=protocolService;this._protocolService.registerStatusCallback(msg=>this._updateStatus(Common.UIString(msg)));}
render(dialogRenderElement){this._dialog=new UI.Dialog();this._dialog.setOutsideClickCallback(event=>event.consume(true));const root=UI.createShadowRootWithCoreStyles(this._dialog.contentElement,'audits2/audits2Dialog.css');const auditsViewElement=root.createChild('div','audits2-view vbox');const closeButton=auditsViewElement.createChild('div','dialog-close-button','dt-close-button');closeButton.addEventListener('click',()=>this._cancelAndClose());const uiElement=auditsViewElement.createChild('div','vbox launcher-container');const headerElement=uiElement.createChild('header');this._headerTitleElement=headerElement.createChild('p');this._headerTitleElement.textContent=Common.UIString('Audits to perform');uiElement.appendChild(headerElement);this._auditSelectorForm=uiElement.createChild('form','audits2-form');for(const preset of Audits2.Audits2Panel.Presets){preset.setting.setTitle(preset.title);const checkbox=new UI.ToolbarSettingCheckbox(preset.setting);const row=this._auditSelectorForm.createChild('div','vbox audits2-launcher-row');row.appendChild(checkbox.element);row.createChild('span','audits2-launcher-description dimmed').textContent=preset.description;}
this._statusView=new Audits2.Audits2StatusView();this._statusView.render(uiElement);this._dialogHelpText=uiElement.createChild('div','audits2-dialog-help-text');const buttonsRow=uiElement.createChild('div','audits2-dialog-buttons hbox');this._startButton=UI.createTextButton(Common.UIString('Run audit'),this._start.bind(this),'',true);buttonsRow.appendChild(this._startButton);this._cancelButton=UI.createTextButton(Common.UIString('Cancel'),this._cancel.bind(this));buttonsRow.appendChild(this._cancelButton);auditsViewElement.tabIndex=0;this._dialog.setDefaultFocusedElement(this._startButton);this._dialog.setSizeBehavior(UI.GlassPane.SizeBehavior.SetExactWidthMaxHeight);this._dialog.setMaxContentSize(new UI.Size(500,400));this._dialog.show(dialogRenderElement);}
hide(){if(!this._dialog)
return;this._dialog.hide();delete this._dialog;delete this._statusView;delete this._startButton;delete this._cancelButton;delete this._auditSelectorForm;delete this._headerTitleElement;delete this._emulationEnabledBefore;delete this._emulationOutlineEnabledBefore;}
setStartEnabled(isEnabled){if(this._dialogHelpText)
this._dialogHelpText.classList.toggle('hidden',isEnabled);if(this._startButton)
this._startButton.disabled=!isEnabled;}
setHelpText(text){if(this._dialogHelpText)
this._dialogHelpText.textContent=text;}
_updateStatus(message){if(!this._statusView)
return;this._statusView.updateStatus(message);}
_cancelAndClose(){this._cancel();this.hide();}
async _cancel(){if(this._auditRunning){this._updateStatus(Common.UIString('Cancelling\u2026'));await this._stopAndReattach();if(this._statusView)
this._statusView.reset();}else{this.hide();}}
_getInspectedURL(){const mainTarget=SDK.targetManager.mainTarget();const runtimeModel=mainTarget.model(SDK.RuntimeModel);const executionContext=runtimeModel&&runtimeModel.defaultExecutionContext();let inspectedURL=mainTarget.inspectedURL();if(!executionContext)
return Promise.resolve(inspectedURL);return executionContext.evaluate({expression:'window.location.href',objectGroup:'audits',includeCommandLineAPI:false,silent:false,returnByValue:true,generatePreview:false},false,false).then(result=>{if(!result.exceptionDetails&&result.object){inspectedURL=result.object.value;result.object.release();}
return inspectedURL;});}
_getFlags(){const flags={};for(const runtimeSetting of Audits2.Audits2Panel.RuntimeSettings)
runtimeSetting.setFlags(flags,runtimeSetting.setting.get());return flags;}
async _start(){const flags=this._getFlags();const emulationModel=self.singleton(Emulation.DeviceModeModel);this._emulationEnabledBefore=emulationModel.enabledSetting().get();this._emulationOutlineEnabledBefore=emulationModel.deviceOutlineSetting().get();emulationModel.toolbarControlsEnabledSetting().set(false);if(flags.disableDeviceEmulation){emulationModel.enabledSetting().set(false);emulationModel.deviceOutlineSetting().set(false);emulationModel.emulate(Emulation.DeviceModeModel.Type.None,null,null);}else{emulationModel.enabledSetting().set(true);emulationModel.deviceOutlineSetting().set(true);for(const device of Emulation.EmulatedDevicesList.instance().standard()){if(device.title==='Nexus 5X')
emulationModel.emulate(Emulation.DeviceModeModel.Type.Device,device,device.modes[0],1);}}
this._dialog.setCloseOnEscape(false);const categoryIDs=[];for(const preset of Audits2.Audits2Panel.Presets){if(preset.setting.get())
categoryIDs.push(preset.configID);}
Host.userMetrics.actionTaken(Host.UserMetrics.Action.Audits2Started);try{this._auditURL=await this._getInspectedURL();await this._protocolService.attach();this._auditRunning=true;this._updateButton(this._auditURL);this._updateStatus(Common.UIString('Loading\u2026'));const lighthouseResult=await this._protocolService.startLighthouse(this._auditURL,categoryIDs,flags);if(lighthouseResult&&lighthouseResult.fatal){const error=new Error(lighthouseResult.message);error.stack=lighthouseResult.stack;throw error;}
if(!lighthouseResult)
throw new Error('Auditing failed to produce a result');await this._stopAndReattach();await this._onAuditComplete(lighthouseResult);}catch(err){if(err instanceof Error)
this._statusView.renderBugReport(err,this._auditURL);}}
async _stopAndReattach(){await this._protocolService.detach();const emulationModel=self.singleton(Emulation.DeviceModeModel);emulationModel.enabledSetting().set(this._emulationEnabledBefore);emulationModel.deviceOutlineSetting().set(this._emulationOutlineEnabledBefore);emulationModel.toolbarControlsEnabledSetting().set(true);Emulation.InspectedPagePlaceholder.instance().update(true);Host.userMetrics.actionTaken(Host.UserMetrics.Action.Audits2Finished);const resourceTreeModel=SDK.targetManager.mainTarget().model(SDK.ResourceTreeModel);await resourceTreeModel.navigate(this._auditURL);this._auditRunning=false;this._updateButton(this._auditURL);}
_updateButton(auditURL){if(!this._dialog)
return;this._startButton.classList.toggle('hidden',this._auditRunning);this._startButton.disabled=this._auditRunning;this._statusView.setVisible(this._auditRunning);this._auditSelectorForm.classList.toggle('hidden',this._auditRunning);if(this._auditRunning){const parsedURL=(auditURL||'').asParsedURL();const pageHost=parsedURL&&parsedURL.host;this._headerTitleElement.textContent=pageHost?ls`Auditing ${pageHost}\u2026`:ls`Auditing your web page\u2026`;}else{this._headerTitleElement.textContent=Common.UIString('Audits to perform');}}};;Audits2.Audits2StatusView=class{constructor(){this._statusView=null;this._progressWrapper=null;this._progressBar=null;this._statusText=null;this._textChangedAt=0;this._fastFactsQueued=Audits2.Audits2StatusView.FastFacts.slice();this._currentPhase=null;this._scheduledTextChangeTimeout=null;this._scheduledFastFactTimeout=null;}
render(parentElement){this.reset();this._statusView=parentElement.createChild('div','audits2-status vbox hidden');this._progressWrapper=this._statusView.createChild('div','audits2-progress-wrapper');this._progressBar=this._progressWrapper.createChild('div','audits2-progress-bar');this._statusText=this._statusView.createChild('div','audits2-status-text');this.updateStatus(Common.UIString('Loading...'));}
reset(){this._resetProgressBarClasses();clearTimeout(this._scheduledFastFactTimeout);this._textChangedAt=0;this._fastFactsQueued=Audits2.Audits2StatusView.FastFacts.slice();this._currentPhase=null;this._scheduledTextChangeTimeout=null;this._scheduledFastFactTimeout=null;}
setVisible(isVisible){this._statusView.classList.toggle('hidden',!isVisible);if(!isVisible)
clearTimeout(this._scheduledFastFactTimeout);}
updateStatus(message){if(!message||!this._statusText)
return;if(message.startsWith('Cancel')){this._commitTextChange(Common.UIString('Cancelling\u2026'));clearTimeout(this._scheduledFastFactTimeout);return;}
const nextPhase=this._getPhaseForMessage(message);if(!nextPhase&&!this._currentPhase){this._commitTextChange(Common.UIString('Lighthouse is warming up\u2026'));clearTimeout(this._scheduledFastFactTimeout);}else if(nextPhase&&(!this._currentPhase||this._currentPhase.order<nextPhase.order)){this._currentPhase=nextPhase;this._scheduleTextChange(this._getMessageForPhase(nextPhase));this._scheduleFastFactCheck();this._resetProgressBarClasses();this._progressBar.classList.add(nextPhase.progressBarClass);}}
_getMessageForPhase(phase){if(phase.message)
return Common.UIString(phase.message);const deviceType=Audits2.Audits2Panel.RuntimeSettings.find(item=>item.setting.name==='audits2.device_type').setting.get();const throttling=Audits2.Audits2Panel.RuntimeSettings.find(item=>item.setting.name==='audits2.throttling').setting.get();const match=Audits2.Audits2StatusView.LoadingMessages.find(item=>{return item.deviceType===deviceType&&item.throttling===throttling;});return match?ls`${match.message}`:ls`Lighthouse is loading your page`;}
_getPhaseForMessage(message){return Audits2.Audits2StatusView.StatusPhases.find(phase=>message.startsWith(phase.statusMessagePrefix));}
_resetProgressBarClasses(){if(!this._progressBar)
return;this._progressBar.className='audits2-progress-bar';}
_scheduleFastFactCheck(){if(!this._currentPhase||this._scheduledFastFactTimeout)
return;this._scheduledFastFactTimeout=setTimeout(()=>{this._updateFastFactIfNecessary();this._scheduledFastFactTimeout=null;this._scheduleFastFactCheck();},100);}
_updateFastFactIfNecessary(){const now=performance.now();if(now-this._textChangedAt<Audits2.Audits2StatusView.fastFactRotationInterval)
return;if(!this._fastFactsQueued.length)
return;const fastFactIndex=Math.floor(Math.random()*this._fastFactsQueued.length);this._scheduleTextChange(ls`\ud83d\udca1 ${this._fastFactsQueued[fastFactIndex]}`);this._fastFactsQueued.splice(fastFactIndex,1);}
_commitTextChange(text){if(!this._statusText)
return;this._textChangedAt=performance.now();this._statusText.textContent=text;}
_scheduleTextChange(text){if(this._scheduledTextChangeTimeout)
clearTimeout(this._scheduledTextChangeTimeout);const msSinceLastChange=performance.now()-this._textChangedAt;const msToTextChange=Audits2.Audits2StatusView.minimumTextVisibilityDuration-msSinceLastChange;this._scheduledTextChangeTimeout=setTimeout(()=>{this._commitTextChange(text);},Math.max(msToTextChange,0));}
renderBugReport(err,auditURL){console.error(err);clearTimeout(this._scheduledFastFactTimeout);clearTimeout(this._scheduledTextChangeTimeout);this._resetProgressBarClasses();this._progressBar.classList.add('errored');this._commitTextChange('');this._statusText.createTextChild(Common.UIString('Ah, sorry! We ran into an error: '));this._statusText.createChild('em').createTextChild(err.message);if(Audits2.Audits2StatusView.KnownBugPatterns.some(pattern=>pattern.test(err.message))){const message=Common.UIString('Try to navigate to the URL in a fresh Chrome profile without any other tabs or '+'extensions open and try again.');this._statusText.createChild('p').createTextChild(message);}else{this._renderBugReportLink(err,auditURL);}}
_renderBugReportLink(err,auditURL){const baseURI='https://github.com/GoogleChrome/lighthouse/issues/new?';const title=encodeURI('title=DevTools Error: '+err.message.substring(0,60));const issueBody=`
**Initial URL**: ${auditURL}
**Chrome Version**: ${navigator.userAgent.match(/Chrome\/(\S+)/)[1]}
**Error Message**: ${err.message}
**Stack Trace**:
\`\`\`
${err.stack}
\`\`\`
    `;const body='&body='+encodeURIComponent(issueBody.trim());const reportErrorEl=UI.XLink.create(baseURI+title+body,Common.UIString('Report this bug'),'audits2-link audits2-report-error');this._statusText.appendChild(reportErrorEl);}};Audits2.Audits2StatusView.KnownBugPatterns=[/PARSING_PROBLEM/,/DOCUMENT_REQUEST/,/READ_FAILED/,/TRACING_ALREADY_STARTED/,/^You must provide a url to the runner/,/^You probably have multiple tabs open/,];Audits2.Audits2StatusView.StatusPhases=[{id:'loading',progressBarClass:'loading',statusMessagePrefix:'Loading page',order:10,},{id:'gathering',progressBarClass:'gathering',message:'Lighthouse is gathering information about the page to compute your score.',statusMessagePrefix:'Retrieving',order:20,},{id:'auditing',progressBarClass:'auditing',message:'Almost there! Lighthouse is now generating your own special pretty report!',statusMessagePrefix:'Evaluating',order:30,}];Audits2.Audits2StatusView.LoadingMessages=[{deviceType:'mobile',throttling:'on',message:'Lighthouse is loading your page with throttling to measure performance on a mobile device on 3G.',},{deviceType:'desktop',throttling:'on',message:'Lighthouse is loading your page with throttling to measure performance on a slow desktop on 3G.',},{deviceType:'mobile',throttling:'off',message:'Lighthouse is loading your page with mobile emulation.',},{deviceType:'desktop',throttling:'off',message:'Lighthouse is loading your page.',},];Audits2.Audits2StatusView.FastFacts=['1MB takes a minimum of 5 seconds to download on a typical 3G connection [Source: WebPageTest and DevTools 3G definition].','Rebuilding Pinterest pages for performance increased conversion rates by 15% [Source: WPO Stats]','BBC has seen a loss of 10% of their users for every extra second of page load [Source: WPO Stats]','By reducing the response size of JSON needed for displaying comments, Instagram saw increased impressions [Source: WPO Stats]','Walmart saw a 1% increase in revenue for every 100ms improvement in page load [Source: WPO Stats]','If a site takes >1 second to become interactive, users lose attention, and their perception of completing the page task is broken [Source: Google Developers Blog]','75% of global mobile users in 2016 were on 2G or 3G [Source: GSMA Mobile]','The average user device costs less than 200 USD. [Source: International Data Corporation]','53% of all site visits are abandoned if page load takes more than 3 seconds [Source: Google DoubleClick blog]','19 seconds is the average time a mobile web page takes to load on a 3G connection [Source: Google DoubleClick blog]','14 seconds is the average time a mobile web page takes to load on a 4G connection [Source: Google DoubleClick blog]','70% of mobile pages take nearly 7 seconds for the visual content above the fold to display on the screen. [Source: Think with Google]','As page load time increases from one second to seven seconds, the probability of a mobile site visitor bouncing increases 113%. [Source: Think with Google]','As the number of elements on a page increases from 400 to 6,000, the probability of conversion drops 95%. [Source: Think with Google]','70% of mobile pages weigh over 1MB, 36% over 2MB, and 12% over 4MB. [Source: Think with Google]','Lighthouse only simulates mobile performance; to measure performance on a real device, try WebPageTest.org [Source: Lighthouse team]',];Audits2.Audits2StatusView.fastFactRotationInterval=6000;Audits2.Audits2StatusView.minimumTextVisibilityDuration=3000;;Audits2.ProtocolService=class extends Common.Object{constructor(){super();this._rawConnection=null;this._backend=null;this._backendPromise=null;this._status=null;}
attach(){return InspectorMain.interceptMainConnection(this._dispatchProtocolMessage.bind(this)).then(rawConnection=>{this._rawConnection=rawConnection;});}
startLighthouse(auditURL,categoryIDs,flags){return this._send('start',{url:auditURL,categoryIDs,flags});}
detach(){return Promise.resolve().then(()=>this._send('stop')).then(()=>this._backend.dispose()).then(()=>{delete this._backend;delete this._backendPromise;return this._rawConnection.disconnect();});}
registerStatusCallback(callback){this._status=callback;}
_dispatchProtocolMessage(message){this._send('dispatchProtocolMessage',{message:message});}
_initWorker(){this._backendPromise=Services.serviceManager.createAppService('audits2_worker','Audits2Service').then(backend=>{if(this._backend)
return;this._backend=backend;this._backend.on('statusUpdate',result=>this._status(result.message));this._backend.on('sendProtocolMessage',result=>this._sendProtocolMessage(result.message));});}
_sendProtocolMessage(message){this._rawConnection.sendMessage(message);}
_send(method,params){if(!this._backendPromise)
this._initWorker();return this._backendPromise.then(_=>this._backend.send(method,params));}};;Runtime.cachedResources["audits2/audits2Dialog.css"]="/*\n * Copyright 2017 The Chromium Authors. All rights reserved.\n * Use of this source code is governed by a BSD-style license that can be\n * found in the LICENSE file.\n */\n\n.audits2-view {\n    --view-horizontal-margin: 20px;\n    margin: 7px var(--view-horizontal-margin);\n    flex: auto;\n    align-items: center;\n    width: 100%;\n    max-width: 500px;\n}\n\n.launcher-container {\n  width: 100%;\n}\n\n.audits2-view .dialog-close-button {\n    position: absolute;\n    top: 0px;\n    right: -14px;\n}\n\nheader {\n    color: #666;\n    font-weight: bold;\n    font-size: 14px;\n    flex: none;\n}\n\n.audits2-form {\n  flex: auto;\n  overflow-y: auto;\n}\n\n.audits2-form label {\n    display: flex;\n}\n\n.audits2-form label div {\n    display: inline;\n}\n\n.audits2-status {\n    flex: auto;\n    align-items: center;\n    color: #666;\n}\n\n.audits2-status-text {\n    text-align: center;\n    height: 60px;\n    display: flex;\n    justify-content: center;\n    flex-direction: column;\n}\n\n.audits2-progress-wrapper {\n    width: calc(100% + 2 * var(--view-horizontal-margin));\n    height: 2px;\n    background-color: #E1F5FE;\n    position: relative;\n    margin: 10px;\n}\n\n.audits2-progress-bar {\n    width: 0%;\n    height: 100%;\n    background: #039BE5;\n    position: absolute;\n    transform-origin: left;\n    animation-fill-mode: forwards;\n    animation-timing-function: ease-out;\n    --progress-bar-loading-duration: 45s;\n    --progress-bar-gathering-duration: 12s;\n    --progress-bar-gathering-percent: 70%;\n    --progress-bar-auditing-duration: 5s;\n    --progress-bar-auditing-percent: 95%;\n}\n\n.audits2-progress-bar.errored {\n    width: 100%;\n    background: #E50303;\n}\n\n.audits2-progress-bar.loading {\n    animation-duration: var(--progress-bar-loading-duration);\n    animation-name: progressBarLoading;\n}\n\n@keyframes progressBarLoading {\n  0% { width: 0%; }\n  100% { width: var(--progress-bar-gathering-percent); }\n}\n\n.audits2-progress-bar.gathering {\n    animation-duration: var(--progress-bar-gathering-duration);\n    animation-name: progressBarGathering;\n}\n\n@keyframes progressBarGathering {\n  0% { width: var(--progress-bar-gathering-percent); }\n  100% { width: var(--progress-bar-auditing-percent); }\n}\n\n.audits2-progress-bar.auditing {\n    animation-duration: var(--progress-bar-auditing-duration);\n    animation-name: progressBarAuditing;\n}\n\n@keyframes progressBarAuditing {\n  0% { width: var(--progress-bar-auditing-percent); }\n  100% { width: 99%; }\n}\n\n.audits2-report-error {\n    display: block;\n    margin-top: 5px;\n}\n\nbutton {\n    margin: 15px 10px;\n}\n\n.audits2-launcher-row {\n    padding: 6px;\n}\n\n.audits2-launcher-description {\n    padding: 3px 0 0 22px;\n}\n\n.audits2-dialog-help-text {\n    color: red;\n    margin-top: 10px;\n}\n\n.audits2-dialog-buttons {\n    justify-content: center;\n    min-height: 40px;\n}\n\n/*# sourceURL=audits2/audits2Dialog.css */";Runtime.cachedResources["audits2/audits2Panel.css"]="/*\n * Copyright 2017 The Chromium Authors. All rights reserved.\n * Use of this source code is governed by a BSD-style license that can be\n * found in the LICENSE file.\n */\n\n.toolbar {\n    background-color: var(--toolbar-bg-color);\n    border-bottom: var(--divider-border);\n}\n\n.audits2-logo {\n    width: 210px;\n    height: 200px;\n    flex-shrink: 0;\n    background-repeat: no-repeat;\n    background-size: contain;\n    margin-top: 10px;\n    background-image: url(Images/audits_logo.svg);\n}\n\n.audits2-landing-page {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    overflow: auto;\n}\n\n\n.audits2-landing-center {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    max-width: 400px;\n    margin: 50px;\n}\n\n.audits2-landing-center > * {\n    flex-shrink: 0;\n}\n\n.audits2-landing-text {\n    color: #666;\n}\n\n.audits2-landing-bold-text {\n    font-weight: bold;\n}\n\n.lh-root {\n  --report-menu-width: 0;\n  user-select: initial;\n  --lh-bg-color: #fff;\n  background-color: var(--lh-bg-color);\n}\n\n.-theme-with-dark-background .lh-root {\n  --lh-bg-color: hsl(0, 0%, 14%);\n  --secondary-text-color: hsl(0, 0%, 66%);\n  --report-secondary-border-color: hsl(0, 0%, 8%);\n}\n\n.-theme-with-dark-background .lh-root .lh-gauge {\n  --circle-background: hsl(0, 0%, 27%);\n  --inset-color: var(--lh-bg-color);\n}\n\n.lh-root .lh-container {\n  word-wrap: normal;\n}\n\n.lh-root pre {\n  word-wrap: break-word;\n}\n\n/* for View Trace button */\n.lh-audit-group {\n  position: relative;\n}\nbutton.view-trace {\n  position: absolute;\n  right: 0;\n}\n\n.audits2-landing-center button {\n    margin-top: 20px;\n}\n\n.audits2-results-container {\n    overflow-y: scroll;\n    position: relative;\n}\n\n/*# sourceURL=audits2/audits2Panel.css */";Runtime.cachedResources["audits2/lighthouse/report-styles.css"]="/**\n * @license Copyright 2017 Google Inc. All Rights Reserved.\n * Licensed under the Apache License, Version 2.0 (the \"License\"); you may not use this file except in compliance with the License. You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0\n * Unless required by applicable law or agreed to in writing, software distributed under the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for the specific language governing permissions and limitations under the License.\n */\n\n.lh-vars {\n  --text-font-family: Roboto, Helvetica, Arial, sans-serif;\n  --monospace-font-family: 'Menlo', 'dejavu sans mono', 'Consolas', 'Lucida Console', monospace;\n  --body-font-size: 14px;\n  --body-line-height: 18px;\n  --subheader-font-size: 16px;\n  --subheader-line-height: 20px;\n  --header-font-size: 20px;\n  --header-line-height: 24px;\n  --title-font-size: 24px;\n  --title-line-height: 28px;\n  --caption-font-size: 12px;\n  --caption-line-height: 16px;\n  --default-padding: 12px;\n  --section-padding: 20px;\n  --section-indent: 16px;\n  --audit-group-indent: 16px;\n  --audit-indent: 16px;\n  --expandable-indent: 20px;\n  --secondary-text-color: #565656;\n  /*--accent-color: #3879d9;*/\n  --fail-color: #df332f;\n  --pass-color: #2b882f;\n  --informative-color: #0c50c7;\n  --manual-color: #757575;\n  --average-color: #ef6c00; /* md orange 800 */\n  --warning-color: #ffab00; /* md amber a700 */\n  --report-border-color: #ccc;\n  --report-secondary-border-color: #ebebeb;\n  --metric-timeline-rule-color: #b3b3b3;\n  --report-width: calc(60 * var(--body-font-size));\n  --report-menu-width: calc(20 * var(--body-font-size));\n  --report-content-width: calc(var(--report-width) + var(--report-menu-width));\n  --navitem-font-size: var(--body-font-size);\n  --navitem-line-height: var(--body-line-height);\n  --navitem-hpadding: var(--body-font-size);\n  --navitem-vpadding: calc(var(--navitem-line-height) / 2);\n  --lh-score-highlight-bg: hsla(0, 0%, 90%, 0.2);\n  --lh-score-icon-background-size: 24px;\n  --lh-score-margin: 12px;\n  --lh-table-header-bg: hsla(0, 0%, 50%, 0.4);\n  --lh-table-higlight-bg: hsla(0, 0%, 75%, 0.1);\n  --lh-sparkline-height: 5px;\n  --lh-sparkline-thin-height: 3px;\n  --lh-filmstrip-thumbnail-width: 60px;\n  --lh-audit-score-width: calc(5 * var(--body-font-size));\n  --lh-category-score-width: calc(5 * var(--body-font-size));\n  --lh-audit-vpadding: 8px;\n  --lh-audit-hgap: 12px;\n  --lh-audit-group-vpadding: 12px;\n  --lh-section-vpadding: 12px;\n  --pass-icon-url: url('data:image/svg+xml;utf8,<svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" xmlns=\"http://www.w3.org/2000/svg\"><path stroke=\"%23007F04\" stroke-width=\"1.5\" d=\"M1 5.75l3.5 3.5 6.5-6.5\" fill=\"none\" fill-rule=\"evenodd\"/></svg>');\n  --fail-icon-url: url('data:image/svg+xml;utf8,<svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" xmlns=\"http://www.w3.org/2000/svg\"><g stroke=\"%23EE1D0A\" stroke-width=\"1.5\" fill=\"none\" fill-rule=\"evenodd\"><path d=\"M2 10l8-8M10 10L2 2\"/></g></svg>');\n  --collapsed-icon-url: url('data:image/svg+xml;utf8,<svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" xmlns=\"http://www.w3.org/2000/svg\"><g fill=\"none\" fill-rule=\"evenodd\"><path fill=\"none\" d=\"M0 0h12v12H0z\"/><path fill=\"hsl(0, 0%, 60%)\" d=\"M3 2l6 4-6 4z\"/></g></svg>');\n  --expanded-icon-url: url('data:image/svg+xml;utf8,<svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" xmlns=\"http://www.w3.org/2000/svg\"><g fill=\"none\" fill-rule=\"evenodd\"><path fill=\"none\" d=\"M0 0h12v12H0z\"/><path fill=\"hsl(0, 0%, 60%)\" d=\"M10 3L6 9 2 3z\"/></g></svg>');\n}\n\n.lh-vars.lh-devtools {\n  --text-font-family: '.SFNSDisplay-Regular', 'Helvetica Neue', 'Lucida Grande', sans-serif;\n  --monospace-font-family: 'Menlo', 'dejavu sans mono', 'Consolas', 'Lucida Console', monospace;\n  --body-font-size: 12px;\n  --body-line-height: 16px;\n  --subheader-font-size: 14px;\n  --subheader-line-height: 18px;\n  --header-font-size: 16px;\n  --header-line-height: 20px;\n  --title-font-size: 20px;\n  --title-line-height: 24px;\n  --caption-font-size: 11px;\n  --caption-line-height: 14px;\n  --default-padding: 12px;\n  --section-padding: 16px;\n  --section-indent: 16px;\n  --audit-group-indent: 16px;\n  --audit-indent: 16px;\n  --expandable-indent: 16px;\n\n  --lh-audit-vpadding: 4px;\n  --lh-audit-hgap: 12px;\n  --lh-audit-group-vpadding: 8px;\n  --lh-section-vpadding: 8px;\n}\n\n@keyframes fadeIn {\n  0% { opacity: 0;}\n  100% { opacity: 0.6;}\n}\n\n.lh-root * {\n  box-sizing: border-box;\n}\n\n.lh-root {\n  font-family: var(--text-font-family);\n  font-size: var(--body-font-size);\n  margin: 0;\n  line-height: var(--body-line-height);\n  background: #f5f5f5;\n  scroll-behavior: smooth;\n}\n\n.lh-root :focus {\n    outline: -webkit-focus-ring-color auto 3px;\n}\n\n.lh-root [hidden] {\n  display: none !important;\n}\n\na {\n  color: #0c50c7;\n}\n\nsummary {\n  cursor: pointer;\n}\n\n.lh-details {\n  font-size: var(--body-font-size);\n  margin-top: var(--default-padding);\n}\n\n.lh-details[open] summary {\n  margin-bottom: var(--default-padding);\n}\n\n.lh-details summary::-webkit-details-marker {\n  color: #9e9e9e;\n}\n\n.lh-details.flex .lh-code {\n  max-width: 70%;\n}\n\n/* Report header */\n\n.report-icon {\n  opacity: 0.7;\n}\n.report-icon:hover {\n  opacity: 1;\n}\n.report-icon[disabled] {\n  opacity: 0.3;\n  pointer-events: none;\n}\n\n.report-icon--share {\n  background-image: url('data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\"><path fill=\"none\" d=\"M0 0h24v24H0z\"/><path d=\"M18 16.08c-.76 0-1.44.3-1.96.77L8.91 12.7c.05-.23.09-.46.09-.7s-.04-.47-.09-.7l7.05-4.11c.54.5 1.25.81 2.04.81 1.66 0 3-1.34 3-3s-1.34-3-3-3-3 1.34-3 3c0 .24.04.47.09.7L8.04 9.81C7.5 9.31 6.79 9 6 9c-1.66 0-3 1.34-3 3s1.34 3 3 3c.79 0 1.5-.31 2.04-.81l7.12 4.16c-.05.21-.08.43-.08.65 0 1.61 1.31 2.92 2.92 2.92 1.61 0 2.92-1.31 2.92-2.92s-1.31-2.92-2.92-2.92z\"/></svg>');\n}\n.report-icon--print {\n  background-image: url('data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\"><path d=\"M19 8H5c-1.66 0-3 1.34-3 3v6h4v4h12v-4h4v-6c0-1.66-1.34-3-3-3zm-3 11H8v-5h8v5zm3-7c-.55 0-1-.45-1-1s.45-1 1-1 1 .45 1 1-.45 1-1 1zm-1-9H6v4h12V3z\"/><path fill=\"none\" d=\"M0 0h24v24H0z\"/></svg>');\n}\n.report-icon--copy {\n  background-image: url('data:image/svg+xml;utf8,<svg height=\"24\" viewBox=\"0 0 24 24\" width=\"24\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M0 0h24v24H0z\" fill=\"none\"/><path d=\"M16 1H4c-1.1 0-2 .9-2 2v14h2V3h12V1zm3 4H8c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h11c1.1 0 2-.9 2-2V7c0-1.1-.9-2-2-2zm0 16H8V7h11v14z\"/></svg>');\n}\n.report-icon--open {\n  background-image: url('data:image/svg+xml;utf8,<svg height=\"24\" viewBox=\"0 0 24 24\" width=\"24\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M0 0h24v24H0z\" fill=\"none\"/><path d=\"M19 4H5c-1.11 0-2 .9-2 2v12c0 1.1.89 2 2 2h4v-2H5V8h14v10h-4v2h4c1.1 0 2-.9 2-2V6c0-1.1-.89-2-2-2zm-7 6l-4 4h3v6h2v-6h3l-4-4z\"/></svg>');\n}\n.report-icon--download {\n  background-image: url('data:image/svg+xml;utf8,<svg height=\"24\" viewBox=\"0 0 24 24\" width=\"24\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M19 9h-4V3H9v6H5l7 7 7-7zM5 18v2h14v-2H5z\"/><path d=\"M0 0h24v24H0z\" fill=\"none\"/></svg>');\n}\n\n/* List */\n.lh-list {\n  font-size: smaller;\n  margin-top: var(--default-padding);\n}\n\n.lh-list__items {\n  padding-left: var(--default-padding);\n}\n\n.lh-list__item {\n  margin-bottom: 2px;\n}\n\n/* Node */\n.lh-node {\n  display: block;\n  font-family: var(--monospace-font-family);\n  word-break: break-word;\n  color: hsl(174, 100%, 27%);\n}\nspan.lh-node:hover {\n    background: hsl(0, 0%, 98%);\n    border-radius: 2px;\n}\n\n/* Card */\n.lh-scorecards {\n  display: flex;\n  flex-wrap: wrap;\n}\n.lh-scorecard {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  flex: 0 0 calc(12 * var(--body-font-size));\n  flex-direction: column;\n  padding: var(--default-padding);\n  padding-top: calc(32px + var(--default-padding));\n  border-radius: 3px;\n  margin-right: var(--default-padding);\n  position: relative;\n  line-height: inherit;\n  border: 1px solid #ebebeb;\n}\n.lh-scorecard__title {\n  background-color: #eee;\n  position: absolute;\n  top: 0;\n  right: 0;\n  left: 0;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  padding: calc(var(--default-padding) / 2);\n}\n.lh-scorecard__value {\n  font-size: calc(1.6 * var(--body-font-size));\n}\n.lh-scorecard__target {\n  margin-top: calc(var(--default-padding) / 2);\n}\n\n/* Score */\n\n.lh-score {\n  display: flex;\n  align-items: flex-start;\n}\n\n.lh-score__value {\n  flex: none;\n  margin-left: var(--lh-score-margin);\n  width: calc(var(--lh-audit-score-width) - var(--lh-score-margin));\n  position: relative;\n  font-weight: bold;\n  top: 1px;\n  text-align: right;\n}\n\n.lh-score__value::after {\n  content: '';\n  position: absolute;\n  right: 0;\n  top: 0;\n  bottom: 0;\n  border-radius: inherit;\n  width: 16px;\n}\n\n.lh-score--informative .lh-score__value {\n  color: var(--informative-color);\n  border-radius: 50%;\n  top: 3px;\n}\n\n.lh-score--informative .lh-score__value::after {\n  display: none;\n  background: url('data:image/svg+xml;utf8,<svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\"><title>info</title><path d=\"M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm1 15h-2v-6h2v6zm0-8h-2V7h2v2z\" fill=\"hsl(218, 89%, 41%)\"/></svg>') no-repeat 50% 50%;\n  background-size: var(--lh-score-icon-background-size);\n}\n\n.lh-score--manual .lh-score__value::after {\n  background: url('data:image/svg+xml;utf8,<svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" xmlns=\"http://www.w3.org/2000/svg\"><title>manual</title><path d=\"M2 5h8v2H2z\" fill=\"hsl(0, 0%, 100%)\" fill-rule=\"evenodd\"/></svg>') no-repeat 50% 50%;\n  background-size: 18px;\n  background-color: var(--manual-color);\n  width: 20px;\n  height:  20px;\n  position: relative;\n}\n\n.lh-score__value--binary {\n  color: transparent !important;\n}\n\n/* No icon for audits with number scores. */\n.lh-score__value:not(.lh-score__value--binary)::after {\n  content: none;\n}\n\n.lh-score__value--pass {\n  color: var(--pass-color);\n}\n\n.lh-score__value--pass::after {\n  background: var(--pass-icon-url) no-repeat center center / 12px 12px;\n}\n\n.lh-score__value--average {\n  color: var(--average-color);\n}\n\n.lh-score__value--average::after {\n  background: none;\n  content: '!';\n  color: var(--average-color);\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  font-weight: 500;\n  font-size: 15px;\n}\n\n.lh-score__value--fail {\n  color: var(--fail-color);\n}\n\n.lh-score__value--fail::after {\n  background: var(--fail-icon-url) no-repeat center center / 12px 12px;\n}\n\n.lh-score__description {\n  font-size: var(--body-font-size);\n  color: var(--secondary-text-color);\n  line-height: var(--body-line-height);\n}\n\n.lh-score__snippet {\n  align-items: center;\n  justify-content: space-between;\n  /*outline: none;*/\n}\n\n.lh-score__snippet::-moz-list-bullet {\n  display: none;\n}\n\n.lh-score__title {\n  flex: 1;\n}\n\n.lh-toggle-arrow {\n  background: var(--collapsed-icon-url) no-repeat center center / 12px 12px;\n  background-color: transparent;\n  width: 12px;\n  height: 12px;\n  flex: none;\n  transition: transform 150ms ease-in-out;\n  cursor: pointer;\n  border: none;\n  order: -1;\n  margin-right: calc(var(--expandable-indent) - 12px);\n  align-self: flex-start;\n}\n\n.lh-toggle-arrow-unexpandable {\n  visibility: hidden;\n}\n\n/* Expandable Details (Audit Groups, Audits) */\n\n.lh-score__header {\n  order: -1;\n  flex: 1;\n}\n\n.lh-expandable-details {\n  padding-left: var(--expandable-indent);\n}\n\n.lh-expandable-details__summary {\n  display: flex;\n  align-items: center;\n  cursor: pointer;\n  margin-left: calc(0px - var(--expandable-indent));\n}\n\n.lh-audit-group[open] > .lh-audit-group__summary > .lh-toggle-arrow,\n.lh-expandable-details[open] > .lh-expandable-details__summary > .lh-toggle-arrow {\n  background-image: var(--expanded-icon-url);\n}\n\n.lh-audit-group__summary::-webkit-details-marker,\n.lh-expandable-details__summary::-webkit-details-marker {\n  display: none;\n}\n\n.lh-score__snippet .lh-toggle-arrow {\n  margin-top: calc((var(--body-line-height) - 12px) / 2);\n}\n\n/* Perf Timeline */\n\n.lh-timeline-container {\n  overflow: hidden;\n  border-top: 1px solid var(--metric-timeline-rule-color);\n}\n\n.lh-timeline {\n  padding: 0;\n  padding-bottom: 0;\n  width: calc(var(--lh-filmstrip-thumbnail-width) * 10 + var(--default-padding) * 2);\n}\n\n.lh-narrow .lh-timeline-container {\n  width: calc(100vw - var(--section-padding) * 2);\n  overflow-x: scroll;\n}\n\n.lh-devtools .lh-timeline-container {\n  width: 100%;\n  overflow-x: scroll;\n}\n\n/* Perf Timeline Metric */\n\n.lh-timeline-metric {\n  position: relative;\n  margin-bottom: calc(2 * var(--lh-audit-vpadding));\n  padding-top: var(--lh-audit-vpadding);\n  border-top: 1px solid var(--report-secondary-border-color);\n}\n\n.lh-timeline-metric__header {\n  display: flex;\n}\n\n.lh-timeline-metric__details {\n  order: -1;\n}\n\n.lh-timeline-metric__title {\n  font-size: var(--body-font-size);\n  line-height: var(--body-line-height);\n  display: flex;\n}\n\n.lh-timeline-metric__name {\n  flex: 1;\n}\n\n.lh-timeline-metric__description {\n  color: var(--secondary-text-color);\n}\n\n.lh-timeline-metric__value {\n  width: var(--lh-audit-score-width);\n  text-align: right;\n}\n\n.lh-timeline-metric--pass .lh-timeline-metric__value {\n  color: var(--pass-color);\n}\n\n.lh-timeline-metric--average .lh-timeline-metric__value {\n  color: var(--average-color);\n}\n\n.lh-timeline-metric--fail .lh-timeline-metric__value {\n  color: var(--fail-color);\n}\n\n.lh-timeline-metric__sparkline {\n  position: absolute;\n  left: 0;\n  right: 0;\n  top: -1px;\n  height: 3px;\n  width: 100%;\n}\n\n.lh-timeline-metric__sparkline .lh-sparkline__bar {\n  float: none;\n}\n\n.lh-timeline-metric--pass .lh-sparkline__bar {\n  background: var(--pass-color);\n}\n\n.lh-timeline-metric--average .lh-sparkline__bar {\n  background: var(--average-color);\n}\n\n.lh-timeline-metric--fail .lh-sparkline__bar {\n  background: var(--fail-color);\n}\n\n.lh-timeline-metric .lh-debug {\n  margin-left: var(--expandable-indent);\n}\n\n/* Perf Hint */\n\n.lh-perf-hint {\n  padding-top: var(--lh-audit-vpadding);\n  padding-bottom: var(--lh-audit-vpadding);\n  border-top: 1px solid var(--report-secondary-border-color);\n}\n\n.lh-perf-hint:last-of-type {\n  border-bottom: none;\n}\n\n.lh-perf-hint__summary {\n  display: flex;\n  align-items: flex-start;\n  flex-wrap: wrap;\n  min-height: calc(var(--body-line-height) + var(--caption-line-height));\n}\n\n.lh-perf-hint__summary .lh-toggle-arrow {\n  margin-top: calc((var(--subheader-line-height) - 12px) / 2);\n}\n\n.lh-perf-hint__summary .lh-debug {\n  width: calc(100% - var(--expandable-indent));\n  margin: 0 var(--expandable-indent);\n}\n\n.lh-perf-hint__title {\n  font-size: var(--body-font-size);\n  flex: 10;\n}\n\n.lh-perf-hint__sparkline {\n  flex: 0 0 50%;\n  margin-top: calc((var(--body-line-height) - var(--lh-sparkline-height)) / 2);\n}\n\n.lh-perf-hint__sparkline .lh-sparkline {\n  width: 100%;\n  float: right;\n  margin: 0;\n}\n\n.lh-perf-hint__stats {\n  text-align: right;\n  flex: 0 0 var(--lh-audit-score-width);\n}\n\n.lh-perf-hint__primary-stat {\n  font-size: var(--body-font-size);\n  line-height: var(--body-line-height);\n}\n\n.lh-perf-hint__secondary-stat {\n  font-size: var(--caption-font-size);\n  line-height: var(--caption-line-height);\n}\n\n.lh-perf-hint__description {\n  color: var(--secondary-text-color);\n  margin-top: calc(var(--default-padding) / 2);\n}\n\n.lh-perf-hint--pass .lh-perf-hint__stats {\n  color: var(--pass-color);\n}\n\n.lh-perf-hint--pass .lh-sparkline__bar {\n  background: var(--pass-color);\n}\n\n.lh-perf-hint--average .lh-sparkline__bar {\n  background: var(--average-color);\n}\n\n.lh-perf-hint--average .lh-perf-hint__stats {\n  color: var(--average-color);\n}\n\n.lh-perf-hint--fail .lh-sparkline__bar {\n  background: var(--fail-color);\n}\n\n.lh-perf-hint--fail .lh-perf-hint__stats {\n  color: var(--fail-color);\n}\n\n/* Filmstrip */\n\n.lh-filmstrip {\n  display: flex;\n  flex-direction: row;\n  justify-content: space-between;\n  padding-bottom: var(--default-padding);\n}\n\n.lh-filmstrip__frame {\n  text-align: right;\n  position: relative;\n}\n\n.lh-filmstrip__timestamp {\n  margin-bottom: calc(0.5 * var(--caption-line-height));\n  font-size: var(--caption-font-size);\n  line-height: var(--caption-line-height);\n  padding-top: 1px;\n  padding-right: 6px;\n}\n\n.lh-filmstrip__timestamp::before {\n  content: '';\n  height: 7px;\n  width: 2px;\n  background: var(--metric-timeline-rule-color);\n  position: absolute;\n  right: 0;\n  top: -2px;\n}\n\n.lh-filmstrip__thumbnail {\n  border: 1px solid var(--report-secondary-border-color);\n  max-height: 100px;\n  max-width: 60px;\n}\n\n/* Sparkline */\n\n.lh-sparkline {\n  margin: 5px;\n  height: var(--lh-sparkline-height);\n  width: 100%;\n}\n\n.lh-sparkline--thin {\n  height: calc(var(--lh-sparkline-height) / 2);\n}\n\n.lh-sparkline__bar {\n  background: var(--warning-color);\n  height: 100%;\n  float: right;\n  position: relative;\n}\n\n/* correlate metric end location with sparkline */\n.lh-timeline-metric:hover .lh-sparkline__bar::after {\n  content: '';\n  height: 100vh;\n  width: 2px;\n  background: inherit;\n  position: absolute;\n  right: 0;\n  bottom: 0;\n  opacity: 0;\n  animation: fadeIn 150ms;\n  animation-fill-mode: forwards;\n}\n\n/* Audit */\n\n.lh-audit {\n  margin-bottom: var(--lh-audit-vpadding);\n  padding-top: var(--lh-audit-vpadding);\n  border-top: 1px solid var(--report-secondary-border-color);\n}\n\n.lh-audit:last-of-type {\n  border-bottom: none;\n}\n\n.lh-audit > .lh-score {\n  font-size: var(--body-font-size);\n}\n\n.lh-audit .lh-debug {\n  margin-left: var(--expandable-indent);\n  margin-right: var(--lh-audit-score-width);\n}\n\n/* Audit Group */\n\n.lh-audit-group {\n  padding-top: var(--lh-audit-group-vpadding);\n  border-top: 1px solid var(--report-secondary-border-color);\n  padding-left: var(--expandable-indent);\n}\n\n.lh-audit-group__header {\n  font-size: var(--subheader-font-size);\n  line-height: var(--subheader-line-height);\n}\n\n.lh-audit-group__summary {\n  display: flex;\n  align-items: center;\n  margin-bottom: var(--lh-audit-group-vpadding);\n  margin-left: calc(0px - var(--expandable-indent));\n}\n\n.lh-audit-group__summary .lh-toggle-arrow {\n  margin-top: calc((var(--subheader-line-height) - 12px) / 2);\n}\n\n.lh-audit-group__description {\n  font-size: var(--body-font-size);\n  color: var(--secondary-text-color);\n  margin-top: calc(0px - var(--lh-audit-group-vpadding));\n  margin-bottom: var(--lh-audit-group-vpadding);\n  line-height: var(--body-line-height);\n}\n\n\n.lh-debug {\n  font-size: var(--caption-font-size);\n  line-height: var(--caption-line-height);\n  color: var(--fail-color);\n  margin-top: 3px;\n}\n\n.lh-debug::before {\n  display: none;\n  content: '';\n  background: url('data:image/svg+xml;utf8,<svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\"><title>warn</title><path d=\"M0 0h24v24H0z\" fill=\"none\"/><path d=\"M1 21h22L12 2 1 21zm12-3h-2v-2h2v2zm0-4h-2v-4h2v4z\" fill=\"hsl(40, 100%, 50%)\"/></svg>') no-repeat 50% 50%;\n  background-size: contain;\n  width: 20px;\n  height: 20px;\n  position: relative;\n  margin-right: calc(var(--default-padding) / 2);\n  top: 5px;\n}\n\n\n/* Report */\n\n.lh-container {\n  display: flex;\n  max-width: var(--report-content-width);\n  word-wrap: break-word;\n  margin: 0 auto;\n}\n\n.lh-report {\n  margin-left: var(--report-menu-width);\n  background-color: #fff;\n  padding-top: var(--report-header-height);\n}\n@media screen {\n  .lh-report {\n    width: var(--report-width);\n  }\n}\n\n.lh-exception {\n  font-size: large;\n}\n\n.lh-text {\n  white-space: nowrap;\n}\n\n.lh-code {\n  white-space: normal;\n  margin-top: 0;\n}\n\n.lh-run-warnings {\n  font-size: var(--body-font-size);\n  margin: var(--section-padding);\n  padding: var(--section-padding);\n  background-color: hsla(40, 100%, 91%, 1);\n  color: var(--secondary-text-color);\n}\n.lh-run-warnings li {\n  margin-bottom: calc(var(--header-line-height) / 2);\n}\n.lh-run-warnings::before {\n  display: inline-block;\n}\n\n.lh-scores-header {\n  display: flex;\n  justify-content: center;\n  overflow-x: hidden;\n  padding: var(--section-padding);\n  border-bottom: 1px solid var(--report-border-color);\n}\n.lh-scores-header__solo {\n  padding: 0;\n  border: 0;\n}\n\n.lh-categories {\n  width: 100%;\n  overflow: hidden;\n}\n\n.lh-category {\n  padding: var(--section-padding);\n  border-top: 1px solid var(--report-border-color);\n}\n\n/* section hash link jump should preserve fixed header\n   https://css-tricks.com/hash-tag-links-padding/\n*/\n.lh-category > .lh-permalink {\n  margin-top: calc((var(--report-header-height) + var(--default-padding)) * -1);\n  padding-bottom: calc(var(--report-header-height) + var(--default-padding));\n  display: block;\n  visibility: hidden;\n}\n\n.lh-category:first-of-type {\n  border: none;\n}\n\n.lh-category > .lh-score {\n  font-size: var(--header-font-size);\n  padding-bottom: var(--lh-section-vpadding);\n}\n\n.lh-category > .lh-score .lh-score__value,\n.lh-category > .lh-score .lh-score__gauge .lh-gauge__label {\n  display: none;\n}\n\n.lh-category .lh-score__gauge {\n  margin-left: var(--section-indent);\n  flex-basis: var(--circle-size);\n  flex-shrink: 0;\n}\n\n.lh-category .lh-score__gauge .lh-gauge {\n  --circle-size: calc(2.5 * var(--header-font-size));\n}\n\n/* Category snippet shouldnt have pointer cursor. */\n.lh-category > .lh-score .lh-score__snippet {\n  cursor: initial;\n}\n\n.lh-category > .lh-score .lh-score__title {\n  font-size: var(--header-font-size);\n  line-height: var(--header-line-height);\n}\n\n.lh-passed-audits[open] summary.lh-passed-audits-summary {\n  margin-bottom: calc(var(--default-padding) * 2);\n}\n\nsummary.lh-passed-audits-summary {\n  margin: calc(var(--default-padding) * 2) var(--default-padding);\n  margin-left: var(--default-padding);\n  margin-bottom: 0;\n  font-size: 15px;\n  display: flex;\n  align-items: center;\n}\n\n#lh-log {\n  position: fixed;\n  background-color: #323232;\n  color: #fff;\n  min-height: 48px;\n  min-width: 288px;\n  padding: 16px 24px;\n  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26);\n  border-radius: 2px;\n  margin: 12px;\n  font-size: 14px;\n  cursor: default;\n  transition: transform 0.3s, opacity 0.3s;\n  transform: translateY(100px);\n  opacity: 0;\n  -webkit-font-smoothing: antialiased;\n  bottom: 0;\n  left: 0;\n  z-index: 3;\n}\n\n#lh-log.show {\n  opacity: 1;\n  transform: translateY(0);\n}\n\n/* 964 fits the min-width of the filmstrip */\n@media screen and (max-width: 964px) {\n  .lh-report {\n    margin-left: 0;\n    width: 100%;\n    min-width: 400px;\n  }\n}\n\n@media print {\n  body {\n    -webkit-print-color-adjust: exact; /* print background colors */\n  }\n  .lh-container {\n    display: block;\n  }\n  .lh-report {\n    margin-left: 0;\n    padding-top: 0;\n  }\n  .lh-categories {\n    margin-top: 0;\n  }\n}\n\n.lh-table {\n  --image-preview-size: 24px;\n  border: 1px solid var(--report-secondary-border-color);\n  border-collapse: collapse;\n  width: 100%;\n\n  --url-col-max-width: 450px;\n}\n\n.lh-table thead {\n  background: var(--lh-table-header-bg);\n}\n\n.lh-table tbody tr:nth-child(even) {\n  background-color: var(--lh-table-higlight-bg);\n}\n\n.lh-table th,\n.lh-table td {\n  padding: 8px 6px;\n}\n\n.lh-table-column--text {\n  text-align: right;\n}\n\n.lh-table-column--thumbnail {\n  width: calc(var(--image-preview-size) * 2);\n}\n\n.lh-table-column--url {\n  text-align: left;\n  min-width: 250px;\n  white-space: nowrap;\n  max-width: var(--url-col-max-width);\n}\n\n.lh-table-column--code {\n  max-width: var(--url-col-max-width);\n}\n\n.lh-text__url {\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n\n.lh-text__url:hover {\n  text-decoration: underline dotted #999;\n  text-decoration-skip-ink: auto;\n}\n\n.lh-text__url > .lh-text, .lh-text__url-host {\n  display: inline;\n}\n\n.lh-text__url-host {\n  margin-left: calc(var(--body-font-size) / 2);\n  opacity: 0.6;\n  font-size: 90%\n}\n\n.lh-thumbnail {\n  height: var(--image-preview-size);\n  width: var(--image-preview-size);\n  object-fit: contain;\n}\n\n/*# sourceURL=report.styles.css */\n\n/*# sourceURL=audits2/lighthouse/report-styles.css */";Runtime.cachedResources["audits2/lighthouse/templates.html"]="<!-- Lighthouse run warnings -->\n<template id=\"tmpl-lh-run-warnings\">\n  <div class=\"lh-run-warnings lh-debug\">\n    <strong>There were issues affecting this run of Lighthouse:</strong>\n    <ul></ul>\n  </div>\n</template>\n\n<!-- Lighthouse category score -->\n<template id=\"tmpl-lh-category-score\">\n  <div class=\"lh-score\">\n    <div class=\"lh-score__value\"><!-- fill me --></div>\n    <div class=\"lh-score__gauge\"></div>\n    <div class=\"lh-score__header\">\n      <div class=\"lh-score__snippet\">\n        <span class=\"lh-score__title\"><!-- fill me --></span>\n      </div>\n      <div class=\"lh-score__description\"><!-- fill me --></div>\n    </div>\n  </div>\n</template>\n\n<!-- Lighthouse audit score -->\n<template id=\"tmpl-lh-audit-score\">\n  <div class=\"lh-score\">\n    <div class=\"lh-score__value\"><!-- fill me --></div>\n    <details class=\"lh-score__header lh-expandable-details\">\n      <summary class=\"lh-score__snippet lh-expandable-details__summary\">\n        <span class=\"lh-score__title\"><!-- fill me --></span>\n        <div class=\"lh-toggle-arrow\" title=\"See audits\"></div>\n      </summary>\n      <div class=\"lh-score__description\"><!-- fill me --></div>\n    </details>\n  </div>\n</template>\n\n<!-- Lighthouse timeline metric -->\n<template id=\"tmpl-lh-timeline-metric\">\n  <div class=\"lh-timeline-metric\">\n    <div class=\"lh-timeline-metric__sparkline\">\n      <div class=\"lh-sparkline__bar\"></div>\n    </div>\n    <div class=\"lh-timeline-metric__header\">\n      <div class=\"lh-timeline-metric__value\"><!-- fill me --></div>\n      <details class=\"lh-timeline-metric__details lh-expandable-details\">\n        <summary class=\"lh-timeline-metric__summary lh-expandable-details__summary\">\n          <span class=\"lh-timeline-metric__title\"><!-- fill me --></span>\n          <div class=\"lh-toggle-arrow\" title=\"See audits\"></div>\n        </summary>\n        <div class=\"lh-timeline-metric__description\"><!-- fill me --></div>\n      </details>\n    </div>\n  </div>\n</template>\n\n<!-- Lighthouse left nav -->\n<template id=\"tmpl-lh-leftnav\">\n  <style>\n    .lh-leftnav {\n      width: var(--report-menu-width);\n      border-right: 1px solid var(--report-border-color);\n      position: fixed;\n      height: 100%;\n      background: #fff;\n      will-change: transform; /* prevent excessive paints */\n      z-index: 2;\n    }\n    .lh-leftnav__item {\n      padding: var(--navitem-vpadding) var(--navitem-hpadding);\n      color: var(--secondary-text-color);\n      font-size: var(--navitem-font-size);\n      line-height: var(--navitem-line-height);\n      display: flex;\n      justify-content: space-between;\n      text-decoration: none;\n      color: inherit;\n    }\n    .leftnav-item__score {\n      background: transparent;\n    }\n    .leftnav-item__score::after {\n      content: '';\n    }\n    .leftnav-item__score.lh-score__value--pass {\n      color: var(--pass-color);\n    }\n    .leftnav-item__score.lh-score__value--average {\n      color: var(--average-color);\n    }\n    .leftnav-item__score.lh-score__value--fail {\n      color: var(--fail-color);\n    }\n    .leftnav__header {\n      padding: 0 20px;\n      margin-bottom: var(--navitem-vpadding);\n      height: 115px;\n      font-size: 18px;\n      display: flex;\n      flex-direction: column;\n      justify-content: center;\n      background: url(data:image/png;base64, ) no-repeat 150% 100%;\n      background-color: #2238b3;\n      background-size: 205px;\n      background-blend-mode: luminosity;\n    }\n    .leftnav__header__title {\n      font-family: var(--text-font-family);\n      font-size: var(--title-font-size);\n      line-height: var(--title-line-height);\n      font-weight: 300;\n      color: #fff;\n      margin: 0;\n      padding: 0;\n    }\n    .leftnav__header__version {\n      color: #aab3ed;\n      font-family: var(--text-font-family);\n      font-size: var(--body-font-size);\n      line-height: var(--body-line-height);\n    }\n    @media screen and (max-width: 964px) {\n      .lh-leftnav {\n        display: none;\n      }\n    }\n    @media print {\n      .lh-leftnav {\n        display: none;\n      }\n    }\n  </style>\n  <nav class=\"lh-leftnav\">\n    <div class=\"leftnav__header\">\n      <h1 class=\"leftnav__header__title\">Lighthouse</h1>\n      <div class=\"leftnav__header__version\"><!-- fill me --></div>\n    </div>\n    <template id=\"tmpl-lh-leftnav__items\">\n      <a href=\"#\" class=\"lh-leftnav__item\">\n        <span class=\"leftnav-item__category\"><!-- fill me --></span>\n        <span class=\"leftnav-item__score\"><!-- fill me --></span>\n      </a>\n    </template>\n  </nav>\n</template>\n\n<!-- Lighthouse header -->\n<template id=\"tmpl-lh-heading\">\n  <style>\n    :root {\n      --report-header-height: 58px;\n      --report-header-bg-color: #fafafa;\n    }\n    .lh-header {\n      display: flex;\n      height: var(--report-header-height);\n      left: 0;\n      right: 0;\n      max-width: 100%; /* support text-overflow on url */\n      border-bottom: 1px solid var(--report-secondary-border-color);\n      position: fixed;\n      z-index: 1;\n      will-change: transform;\n      background-color: var(--report-header-bg-color);\n      margin-left: var(--report-menu-width);\n      align-items: center;\n      padding: 0 calc(var(--default-padding) * 2);\n    }\n    .lh-metadata {\n      flex: 1 1 0;\n      padding-right: calc(var(--default-padding) / 2);\n      line-height: 20px;\n      color: var(--secondary-text-color);\n      overflow-x: hidden;\n    }\n    .lh-metadata__results {\n      overflow: hidden;\n      text-overflow: ellipsis;\n      white-space: nowrap;\n    }\n    .lh-metadata__url {\n      color: currentColor;\n    }\n    .lh-export {\n      position: relative;\n    }\n    .lh-export__button {\n      background-color: #fff;\n      border: 1px solid var(--report-border-color);\n      border-radius: 3px;\n      cursor: pointer;\n      outline: none;\n      height: 32px;\n      width: 48px;\n      background-repeat: no-repeat;\n      background-size: 20px;\n      background-position: 50% 50%;\n    }\n    .lh-export__button:focus,\n    .lh-export__button.active {\n      box-shadow: 1px 1px 3px #ccc;\n    }\n    .lh-export__button.active + .lh-export__dropdown {\n      opacity: 1;\n      clip: rect(0, 164px, 200px, 0);\n    }\n    .lh-export__dropdown {\n      position: absolute;\n      background-color: #fff;\n      border: 1px solid var(--report-border-color);\n      border-radius: 3px;\n      padding: calc(var(--default-padding) / 2) 0;\n      cursor: pointer;\n      top: 36px;\n      right: 0;\n      box-shadow: 1px 1px 3px #ccc;\n      min-width: 125px;\n      clip: rect(0, 164px, 0, 0);\n      opacity: 0;\n      transition: all 200ms cubic-bezier(0,0,0.2,1);\n    }\n    .lh-export__dropdown a {\n      display: block;\n      color: currentColor;\n      text-decoration: none;\n      white-space: nowrap;\n      padding: 0 12px;\n      line-height: 2;\n    }\n    .lh-export__dropdown a:hover,\n    .lh-export__dropdown a:focus {\n      background-color: #efefef;\n      outline: none;\n    }\n    .lh-export__dropdown .report-icon {\n      cursor: pointer;\n      background-repeat: no-repeat;\n      background-position: 8px 50%;\n      background-size: 18px;\n      background-color: transparent;\n      text-indent: 18px;\n    }\n    /* copy icon needs slight adjustments to look great */\n    .lh-export__dropdown .report-icon--copy {\n      background-size: 16px;\n      background-position: 9px 50%;\n    }\n    /* save-as-gist option hidden in report */\n    .lh-export__dropdown .lh-export--gist {\n      display: none;\n    }\n    .lh-config {\n      display: flex;\n    }\n    .lh-env {\n      padding: var(--default-padding) 0 var(--default-padding) calc(var(--default-padding) * 2);\n      left: 0;\n      top: 100%;\n      position: absolute;\n      width: 100%;\n      background-color: var(--report-header-bg-color);\n      border-top: 1px solid var(--report-secondary-border-color);\n      border-bottom: 1px solid var(--report-secondary-border-color);\n    }\n    .lh-env__title {\n      font-size: var(--header-font-size);\n    }\n    .lh-env__items {\n      margin: var(--default-padding) 0 0 0;\n    }\n    .lh-config__timestamp {\n      margin-right: 6px;\n    }\n    .lh-config__settings-toggle {\n      margin-left: 6px;\n    }\n    .lh-config__timestamp,\n    .lh-config__settings-toggle summary {\n      color: var(--secondary-text-color);\n    }\n    .lh-config__settings-toggle summary {\n      display: flex;\n      align-items: center;\n    }\n    .lh-config__settings-toggle .lh-toggle-arrow {\n      width: 16px;\n      height: 16px;\n      margin-left: 2px;\n    }\n    .lh-config__settings-toggle[open] .lh-toggle-arrow {\n      transform: rotateZ(90deg);\n    }\n    .lh-config__settings-toggle summary::-moz-list-bullet {\n      display: none;\n    }\n    .lh-config__settings-toggle summary::-webkit-details-marker {\n      display: none;\n    }\n    @media screen and (min-width: 965px) {\n      .lh-header {\n        width: var(--report-width);\n        right: initial;\n        left: initial;\n      }\n    }\n    @media screen and (max-width: 964px) {\n      .lh-export__dropdown {\n        right: 0;\n        left: initial;\n      }\n      .lh-header {\n        padding: 0 var(--default-padding);\n        margin-left: 0;\n      }\n    }\n    @media print {\n      .lh-header {\n        position: static;\n        margin-left: 0;\n      }\n    }\n  </style>\n  <div class=\"lh-header\">\n    <div class=\"lh-metadata\">\n      <div class=\"lh-metadata__results\">Results for: <a href=\"\" class=\"lh-metadata__url\" target=\"_blank\" rel=\"noopener\"><!-- fill me --></a></div>\n      <div class=\"lh-config\">\n        <span class=\"lh-config__timestamp\"><!-- fill me --></span> &bullet;\n        <details class=\"lh-config__settings-toggle\">\n          <summary>\n            <span>Runtime settings</span>\n            <span class=\"lh-toggle-arrow\" title=\"See report's runtime settings\"></span>\n          </summary>\n          <div class=\"lh-env\">\n            <div class=\"lh-env__title\">Runtime environment</div>\n            <ul class=\"lh-env__items\">\n              <li class=\"lh-env__item\">\n                <span class=\"lh-env__name\">User agent:</span>\n                <b class=\"lh-env__item__ua\"><!-- fill me --></b>\n              </li>\n              <template id=\"tmpl-lh-env__items\">\n                <li class=\"lh-env__item\">\n                  <span class=\"lh-env__name\"><!-- fill me --></span>\n                  <span class=\"lh-env__description\"><!-- fill me --></span>:\n                  <b class=\"lh-env__enabled\"><!-- fill me --></b>\n                </li>\n              </template>\n            </ul>\n          </div>\n        </details>\n      </div>\n    </div>\n    <div class=\"lh-export\">\n      <button class=\"report-icon report-icon--share lh-export__button\" title=\"Export report\"></button>\n      <div class=\"lh-export__dropdown\">\n        <a href=\"#\" class=\"report-icon report-icon--print\" data-action=\"print-summary\">Print Summary</a>\n        <a href=\"#\" class=\"report-icon report-icon--print\" data-action=\"print-expanded\">Print Expanded</a>\n        <a href=\"#\" class=\"report-icon report-icon--copy\" data-action=\"copy\">Copy JSON</a>\n        <a href=\"#\" class=\"report-icon report-icon--download\" data-action=\"save-html\">Save as HTML</a>\n        <a href=\"#\" class=\"report-icon report-icon--download\" data-action=\"save-json\">Save as JSON</a>\n        <a href=\"#\" class=\"report-icon report-icon--open lh-export--viewer\" data-action=\"open-viewer\">Open in Viewer</a>\n        <a href=\"#\" class=\"report-icon report-icon--open lh-export--gist\" data-action=\"save-gist\">Save as Gist</a>\n      </div>\n    </div>\n  </div>\n</template>\n\n<!-- Lighthouse footer -->\n<template id=\"tmpl-lh-footer\">\n  <style>\n    .lh-footer {\n      min-height: 90px;\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      background-color: var(--report-header-bg-color);\n      border-top: 1px solid var(--report-secondary-border-color);\n    }\n\n    .lh-footer span {\n      text-align: center;\n    }\n  </style>\n  <footer class=\"lh-footer\">\n    <span>\n      Generated by <b>Lighthouse</b> <span class=\"lh-footer__version\"><!-- fill me --></span> on\n      <span class=\"lh-footer__timestamp\"><!-- fill me --></span> |\n      <a href=\"https://github.com/GoogleChrome/Lighthouse/issues\" target=\"_blank\" rel=\"noopener\">File an issue</a>\n    </span>\n  </footer>\n</template>\n\n<!-- Lighthouse score gauge -->\n<template id=\"tmpl-lh-gauge\">\n  <style>\n    .lh-gauge {\n      --circle-size: calc(2.5 * var(--header-font-size));\n      --circle-size-half: calc(var(--circle-size) / 2);\n      --circle-background: #ccc;\n      --circle-border-width: 2px;\n      --inset-size: calc(var(--circle-size) - 2 * var(--circle-border-width));\n      --inset-color: #fff;\n      --transition-length: 1s;\n      width: var(--circle-size);\n      height: var(--circle-size);\n      background-color: var(--circle-background);\n      border-radius: 50%;\n    }\n    .lh-gauge--pass {\n      --circle-color: var(--pass-color);\n      color: var(--circle-color);\n    }\n    .lh-gauge--average {\n      --circle-color: var(--average-color);\n      color: var(--circle-color);\n    }\n    .lh-gauge--fail {\n      --circle-color: var(--fail-color);\n      color: var(--circle-color);\n    }\n    .lh-gauge__mask,\n    .lh-gauge__fill {\n      width: var(--circle-size);\n      height: var(--circle-size);\n      position: absolute;\n      transition: transform var(--transition-length);\n      border-radius: 50%;\n    }\n    .lh-gauge__mask {\n      clip: rect(0px, var(--circle-size), var(--circle-size), var(--circle-size-half));\n    }\n    .lh-gauge__mask .lh-gauge__fill {\n      clip: rect(0px, var(--circle-size-half), var(--circle-size), 0px);\n      background-color: var(--circle-color);\n      backface-visibility: hidden;\n    }\n    .lh-gauge__percentage {\n      --spacer: calc((var(--circle-size) - var(--inset-size)) / 2);\n      width: var(--inset-size);\n      height: var(--inset-size);\n      position: absolute;\n      margin-left: var(--spacer);\n      margin-top: var(--spacer);\n      background-color: var(--inset-color);\n      border-radius: inherit;\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      font-size: var(--header-font-size);\n    }\n    .lh-gauge__wrapper {\n      display: inline-flex;\n      align-items: center;\n      flex-direction: column;\n      text-decoration: none;\n      color: inherit;\n      flex: 1;\n      min-width: auto;\n      position: relative;\n    }\n    .lh-scores-header .lh-gauge__wrapper {\n      width: calc(10.5 * var(--body-font-size));\n    }\n    .lh-gauge__label {\n      font-size: var(--body-font-size);\n      line-height: var(--body-line-height);\n      margin-top: calc(0.5 * var(--body-line-height));\n      text-align: center;\n    }\n  </style>\n  <a href=\"#\" class=\"lh-gauge__wrapper\">\n    <div class=\"lh-gauge\" data-progress=\"0\">\n      <div class=\"lh-gauge__circle\">\n        <div class=\"lh-gauge__mask lh-gauge__mask--full\">\n          <div class=\"lh-gauge__fill\"></div>\n        </div>\n        <div class=\"lh-gauge__mask lh-gauge__mask--half\">\n          <div class=\"lh-gauge__fill\"></div>\n          <div class=\"lh-gauge__fill lh-gauge__fill--fix\"></div>\n        </div>\n      </div>\n      <div class=\"lh-gauge__percentage\"></div>\n    </div>\n    <div class=\"lh-gauge__label\"><!-- fill me --></div>\n  </a>\n</template>\n\n<!-- Lighthouse crtiical request chains component -->\n<template id=\"tmpl-lh-crc\">\n  <style>\n    .lh-crc .tree-marker {\n      width: 12px;\n      height: 26px;\n      display: block;\n      float: left;\n      background-position: top left;\n    }\n    .lh-crc .horiz-down {\n      background: url('data:image/svg+xml;utf8,<svg width=\"16\" height=\"26\" viewBox=\"0 0 16 26\" xmlns=\"http://www.w3.org/2000/svg\"><g fill=\"%23D8D8D8\" fill-rule=\"evenodd\"><path d=\"M16 12v2H-2v-2z\"/><path d=\"M9 12v14H7V12z\"/></g></svg>');\n    }\n    .lh-crc .right {\n      background: url('data:image/svg+xml;utf8,<svg width=\"16\" height=\"26\" viewBox=\"0 0 16 26\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M16 12v2H0v-2z\" fill=\"%23D8D8D8\" fill-rule=\"evenodd\"/></svg>');\n    }\n    .lh-crc .up-right {\n      background: url('data:image/svg+xml;utf8,<svg width=\"16\" height=\"26\" viewBox=\"0 0 16 26\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M7 0h2v14H7zm2 12h7v2H9z\" fill=\"%23D8D8D8\" fill-rule=\"evenodd\"/></svg>');\n    }\n    .lh-crc .vert-right {\n      background: url('data:image/svg+xml;utf8,<svg width=\"16\" height=\"26\" viewBox=\"0 0 16 26\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M7 0h2v27H7zm2 12h7v2H9z\" fill=\"%23D8D8D8\" fill-rule=\"evenodd\"/></svg>');\n    }\n    .lh-crc .vert {\n      background: url('data:image/svg+xml;utf8,<svg width=\"16\" height=\"26\" viewBox=\"0 0 16 26\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M7 0h2v26H7z\" fill=\"%23D8D8D8\" fill-rule=\"evenodd\"/></svg>');\n    }\n    .lh-crc .crc-tree {\n      font-size: 14px;\n      width: 100%;\n      overflow-x: auto;\n    }\n    .lh-crc .crc-node {\n      height: 26px;\n      line-height: 26px;\n      white-space: nowrap;\n    }\n    .lh-crc .crc-node__tree-value {\n      margin-left: 10px;\n    }\n    .lh-crc .crc-node__chain-duration {\n      font-weight: 700;\n    }\n    .lh-crc .crc-node__tree-hostname {\n      color: #595959;\n    }\n    .lh-crc .crc-initial-nav {\n      color: #595959;\n      font-style: italic;\n    }\n  </style>\n  <div class=\"lh-score__description\">\n    Longest chain: <b class=\"lh-crc__longest_duration\"><!-- fill me: longestChain.duration --></b>\n    over <b class=\"lh-crc__longest_length\"><!-- fill me: longestChain.length --></b> requests, totalling\n    <b class=\"lh-crc__longest_transfersize\"><!-- fill me: longestChain.length --></b>\n  </div>\n  <div class=\"lh-crc\">\n    <details class=\"lh-details\">\n      <summary><!-- fill me --></summary>\n      <div class=\"crc-initial-nav\">Initial Navigation</div>\n      <!-- stamp for each chain -->\n      <template id=\"tmpl-lh-crc__chains\">\n        <div class=\"crc-node\">\n          <span class=\"crc-node__tree-marker\">\n            <!-- fill me -->\n          </span>\n          <span class=\"crc-node__tree-value\">\n            <span class=\"crc-node__tree-file\"><!-- fill me: node.request.url.file --></span>\n            <span class=\"crc-node__tree-hostname\">(<!-- fill me: node.request.url.host -->)</span>\n            <!-- fill me -->\n          </span>\n        </div>\n      </template>\n    </details>\n  </div>\n</template>\n\n/*# sourceURL=audits2/lighthouse/templates.html */";