/* machine-experience-analyzer: page styles from the prototype (rules already in base.css removed). */
@media (max-width:820px){.margin{flex-direction:row;flex-wrap:wrap}}
h1.hd{font-size:clamp(44px,8vw,140px);line-height:.84;letter-spacing:-.045em}
.crumbs a{text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px}
.crumbs a:hover{background:var(--blue);color:#FFFAFA;text-decoration:none}
h1.tl{font-size:clamp(44px,7.4vw,128px);line-height:.88;letter-spacing:-.045em;text-wrap:balance}
.lede{max-width:58ch;font-size:clamp(19px,1.7vw,24px);line-height:1.3}
.sec.tool-sec{padding-top:8px}
.h2{font-size:clamp(32px,4.4vw,72px);line-height:.92;letter-spacing:-.035em}
.steps{list-style:none;border-top:1px solid var(--ink);max-width:880px}
.steps li{padding:14px 0 15px;border-bottom:1px solid var(--ink);font-size:clamp(17px,1.4vw,20px);line-height:1.35}
.faq{border-top:1px solid var(--ink);max-width:880px}
.faq details{border-bottom:1px solid var(--ink)}
.faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:baseline;gap:16px;padding:16px 0;font-size:clamp(18px,1.6vw,24px);line-height:1.2}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";flex:none}
.faq details[open] summary::after{content:"\2212"}
.faq summary:hover{color:var(--blue)}
.faq details p{padding:0 0 18px;max-width:62ch}
.support p{max-width:62ch}
.support a{text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px}
.support a:hover{background:var(--blue);color:#FFFAFA;text-decoration:none}
.tk{--mono:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}
.tk input[type=text],.tk input[type=number],.tk input[type=url],.tk input[type=search],.tk select,.tk textarea{font:inherit;font-size:17px;color:inherit;background:transparent;border:0;border-bottom:1px solid var(--ink);border-radius:0;padding:8px 0 9px;width:100%;min-height:44px;outline:0;-webkit-appearance:none;appearance:none;box-shadow:none}
.tk select{padding-right:24px;cursor:pointer}
.tk option{background:var(--paper);color:var(--ink)}
.tk .selw{display:block}
.tk select{background:transparent url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M0 0h12L6 8z' fill='%23000'/%3E%3C/svg%3E") no-repeat right 2px center/10px 7px}
:root.inv .tk select{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M0 0h12L6 8z' fill='%23FFFAFA'/%3E%3C/svg%3E")}
.tk :is(input,select,textarea):focus-visible{outline:0;border-bottom-color:var(--blue);box-shadow:0 1px 0 var(--blue)}
.tk textarea{border:1px solid var(--ink);padding:12px;min-height:180px;resize:vertical;font-family:var(--mono);font-size:14px;line-height:1.55}
.tk textarea:focus-visible{border-color:var(--blue);box-shadow:inset 0 0 0 1px var(--blue)}
.tk input::placeholder,.tk textarea::placeholder{color:var(--ink);opacity:.45}
.tk input[type=range]{-webkit-appearance:none;appearance:none;width:100%;height:28px;background:transparent;cursor:pointer;margin:0}
.tk input[type=range]::-webkit-slider-runnable-track{height:2px;background:var(--ink)}
.tk input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:16px;height:16px;margin-top:-7px;background:var(--blue);border:0;border-radius:0}
.tk input[type=range]::-moz-range-track{height:2px;background:var(--ink)}
.tk input[type=range]::-moz-range-thumb{width:16px;height:16px;background:var(--blue);border:0;border-radius:0}
.tk input[type=range]:focus-visible{outline:3px solid var(--blue);outline-offset:2px}
.tk input[type=checkbox]{accent-color:var(--ink);width:18px;height:18px;margin:0;vertical-align:-3px}
.tk input[type=color]{-webkit-appearance:none;appearance:none;width:100%;height:44px;border:1px solid var(--ink);border-radius:0;padding:0;background:none;cursor:pointer}
.tk input[type=color]::-webkit-color-swatch-wrapper{padding:0}
.tk input[type=color]::-webkit-color-swatch{border:0;border-radius:0}
.tk input[type=color]::-moz-color-swatch{border:0;border-radius:0}
.tk .lab{display:block;font-size:12px;letter-spacing:.09em;text-transform:uppercase;margin-bottom:2px}
.tk .btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;font-size:17px;line-height:1;padding:11px 14px 10px;min-height:44px;background:var(--ink);color:var(--paper)}
.tk .btn:hover{background:var(--blue);color:#FFFAFA}
.tk .btn:disabled{opacity:.3;cursor:not-allowed;background:var(--ink);color:var(--paper)}
.tk .wbtn{font-size:17px;line-height:1;padding:7px 8px 6px;min-height:36px}
.tk .wbtn:hover{background:var(--blue);color:#FFFAFA}
.tk .wbtn.on,.tk .wbtn[aria-pressed="true"]{background:var(--ink);color:var(--paper)}
.tk .status{min-height:1.45em}
.tk .status:not(:empty){color:var(--blue)}
.mxp-root{--mxp-text-muted:color-mix(in srgb,var(--ink) 55%,transparent);--mono:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}
.mxp-root *,.mxp-root *::before,.mxp-root *::after{box-sizing:border-box}
.mxp-container{display:flex;flex-direction:column;gap:0}
.mxp-input-area{border-top:1px solid var(--ink);padding-top:14px;margin-bottom:36px;max-width:980px}
.mxp-input-tabs{display:flex;gap:4px;margin:0 0 14px -8px}
.mxp-tab-btn{font-size:17px;line-height:1;padding:7px 8px 6px;min-height:36px}
.mxp-tab-btn:hover{background:var(--blue);color:#FFFAFA}
.mxp-tab-btn.mxp-active{background:var(--ink);color:var(--paper)}
.mxp-tab-content{display:none}
.mxp-tab-content.mxp-active{display:block}
.mxp-url-row{display:flex;gap:16px;align-items:flex-end}
.mxp-url-row input{flex:1;font-size:clamp(20px,1.8vw,26px)!important}
.mxp-scan-btn{display:inline-flex;align-items:center;justify-content:center;font-size:17px;line-height:1;padding:12px 18px 11px;min-height:46px;background:var(--ink);color:var(--paper);white-space:nowrap}
.mxp-scan-btn:hover{background:var(--blue);color:#FFFAFA}
.mxp-html-input{min-height:220px!important}
.mxp-actions{margin-top:12px;display:flex;justify-content:flex-end}
.mxp-input-note{font-size:14px;margin-top:10px;max-width:62ch}
.mxp-notice{margin:-20px 0 20px}
.mxp-loading{display:none;padding:28px 0;border-top:1px solid var(--ink)}
.mxp-loading.mxp-visible{display:block}
.mxp-spinner{width:100%;height:2px;background:var(--blue);transform-origin:left;animation:mxpBar 1.2s ease-in-out infinite;margin-bottom:18px}
@keyframes mxpBar{0%{transform:scaleX(.05)}50%{transform:scaleX(1)}100%{transform:scaleX(.05);transform-origin:right}}
.mxp-loading-text{font-size:clamp(20px,1.8vw,26px)}
.mxp-loading-steps{margin-top:12px;display:flex;flex-direction:column;gap:4px}
.mxp-loading-step{font-size:15px;color:var(--mxp-text-muted)}
.mxp-loading-step.mxp-step-active{color:var(--blue)}
.mxp-loading-step.mxp-step-done{color:var(--ink);text-decoration:line-through;text-decoration-thickness:1px}
.mxp-results{display:none}
.mxp-results.mxp-visible{display:block}
.mxp-grade-display{margin-bottom:28px}
.mxp-grade-main{display:flex;align-items:center;gap:28px;border-top:1px solid var(--ink);border-bottom:1px solid var(--ink);padding:22px 0}
.mxp-grade-main[data-tier="agent-ready"],.mxp-grade-main[data-tier="readable"]{border-top:6px solid var(--blue)}
.mxp-grade-main[data-tier="fragile"],.mxp-grade-main[data-tier="legacy"]{border-top:6px solid var(--ink)}
.mxp-score-ring{position:relative;width:120px;height:120px;flex-shrink:0}
.mxp-score-ring svg{width:120px;height:120px;transform:rotate(-90deg)}
.mxp-score-ring-bg{fill:none;stroke:color-mix(in srgb,var(--ink) 15%,transparent);stroke-width:6}
.mxp-score-ring-fill{fill:none;stroke-width:6;stroke-linecap:butt;transition:stroke-dashoffset 1.2s ease-out}
.mxp-score-num{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-size:36px;letter-spacing:-.03em;font-variant-numeric:tabular-nums}
.mxp-score-max{font-size:14px;color:var(--mxp-text-muted)}
.mxp-grade-info h3{font-size:clamp(26px,2.6vw,40px);line-height:1;letter-spacing:-.03em;margin:6px 0 6px}
.mxp-grade-info p{max-width:60ch}
.mxp-grade-tier{display:inline-block;font-size:12px;letter-spacing:.09em;text-transform:uppercase;padding:3px 6px 2px}
.mxp-tier-agent-ready,.mxp-tier-readable{background:var(--blue);color:#FFFAFA}
.mxp-tier-fragile{border:1px solid var(--ink)}
.mxp-tier-legacy{background:var(--ink);color:var(--paper)}
.mxp-stats-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:1px;background:var(--ink);border:1px solid var(--ink);margin-bottom:28px}
.mxp-stat-card{background:var(--paper);padding:12px 14px}
.mxp-stat-val{font-size:28px;letter-spacing:-.03em;font-variant-numeric:tabular-nums}
.mxp-stat-label{font-size:12px;letter-spacing:.09em;text-transform:uppercase}
.mxp-pillars{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:0 24px;margin-bottom:28px}
.mxp-pillar-card{border-top:1px solid var(--ink);padding:12px 0 16px}
.mxp-pillar-icon{display:none}
.mxp-pillar-label{font-size:12px;letter-spacing:.09em;text-transform:uppercase}
.mxp-pillar-score{font-size:clamp(32px,3vw,48px);letter-spacing:-.04em;line-height:1;margin:6px 0 2px;color:var(--blue);font-variant-numeric:tabular-nums}
.mxp-pillar-name{font-size:15px}
.mxp-pillar-bar{height:2px;background:color-mix(in srgb,var(--ink) 15%,transparent);margin-top:10px;overflow:hidden}
.mxp-pillar-bar-fill{height:100%;background:var(--blue);transition:width 1s ease-out}
.mxp-section-nav{display:flex;gap:4px;flex-wrap:wrap;margin:0 0 18px -8px}
.mxp-nav-btn{font-size:17px;line-height:1;padding:7px 8px 6px;min-height:36px;white-space:nowrap}
.mxp-nav-btn:hover{background:var(--blue);color:#FFFAFA}
.mxp-nav-btn.mxp-active{background:var(--ink);color:var(--paper)}
.mxp-section-panel{display:none}
.mxp-section-panel.mxp-active{display:block}
.mxp-findings,.mxp-recs,.mxp-inspector,.mxp-ghost-section,.mxp-schema-section,.mxp-comparison{border-top:1px solid var(--ink);margin-bottom:28px}
.mxp-findings-header,.mxp-recs-header,.mxp-inspector-header,.mxp-schema-header,.mxp-comparison-header,.mxp-ghost-header{padding:14px 0;border-bottom:1px solid var(--ink);display:flex;align-items:baseline;justify-content:space-between;flex-wrap:wrap;gap:10px 16px}
.mxp-findings-title,.mxp-ghost-title,.mxp-recs-header h3,.mxp-inspector-header h3,.mxp-schema-header h3,.mxp-comparison-header h3{font-size:clamp(22px,2vw,30px);line-height:1;letter-spacing:-.02em}
.mxp-recs-header{display:block}
.mxp-recs-header p{margin-top:6px}
.mxp-findings-count{font-size:12px;letter-spacing:.09em;text-transform:uppercase}
.mxp-filter-row,.mxp-ghost-controls{display:flex;gap:4px;flex-wrap:wrap;margin-left:-8px}
.mxp-ghost-controls{padding:10px 0;border-bottom:1px solid var(--ink);margin-left:-8px}
.mxp-filter-btn,.mxp-ghost-ctrl-btn{font-size:15px;line-height:1;padding:6px 8px 5px;min-height:32px}
.mxp-filter-btn:hover,.mxp-ghost-ctrl-btn:hover{background:var(--blue);color:#FFFAFA}
.mxp-filter-btn.mxp-active,.mxp-ghost-ctrl-btn.mxp-active{background:var(--ink);color:var(--paper)}
.mxp-finding-item,.mxp-rec-item{padding:12px 0;border-bottom:1px solid var(--ink);display:flex;align-items:flex-start;gap:14px}
.mxp-finding-item.mxp-hidden{display:none}
.mxp-finding-icon,.mxp-rec-priority{width:26px;height:26px;display:flex;align-items:center;justify-content:center;font-size:14px;flex-shrink:0;margin-top:1px}
.mxp-finding-pass .mxp-finding-icon,.mxp-rec-low .mxp-rec-priority{background:var(--blue);color:#FFFAFA}
.mxp-finding-warn .mxp-finding-icon,.mxp-rec-high .mxp-rec-priority,.mxp-rec-medium .mxp-rec-priority{border:1px solid var(--ink)}
.mxp-finding-fail .mxp-finding-icon,.mxp-rec-critical .mxp-rec-priority{background:var(--ink);color:var(--paper)}
.mxp-finding-info .mxp-finding-icon{color:var(--blue);border:1px solid var(--blue)}
.mxp-finding-body,.mxp-rec-body{flex:1;min-width:0}
.mxp-finding-name,.mxp-rec-title{font-size:17px;margin-bottom:2px}
.mxp-finding-desc,.mxp-rec-desc{font-size:15px;line-height:1.5;max-width:72ch}
.mxp-finding-meta{display:flex;gap:6px;margin-top:6px;flex-wrap:wrap}
.mxp-finding-tag{font-size:11px;letter-spacing:.09em;text-transform:uppercase;padding:2px 5px 1px;border:1px solid var(--ink)}
.mxp-finding-pts{font-size:15px;white-space:nowrap;flex-shrink:0;font-variant-numeric:tabular-nums}
.mxp-pts-pos{color:var(--blue)}
.mxp-pts-neg{background:var(--ink);color:var(--paper);padding:0 4px}
.mxp-pts-zero{color:var(--mxp-text-muted)}
.mxp-rec-impact{font-size:12px;letter-spacing:.09em;text-transform:uppercase;margin-top:4px}
.mxp-rec-code{display:block;margin-top:8px;padding:10px 12px;background:var(--ink);color:var(--paper);font-family:var(--mono);font-size:13px;line-height:1.6;overflow-x:auto;white-space:pre-wrap;word-break:break-word}
.mxp-inspector-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:1px;background:var(--ink);border-bottom:1px solid var(--ink)}
.mxp-inspector-cell{background:var(--paper);padding:12px 14px}
.mxp-inspector-tag{font-family:var(--mono);font-size:13px;color:var(--blue)}
.mxp-inspector-count{font-size:24px;letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.mxp-inspector-type{font-size:11px;letter-spacing:.09em;text-transform:uppercase}
.mxp-inspector-type-semantic{color:var(--blue)}
.mxp-inspector-type-non{color:var(--mxp-text-muted)}
.mxp-inspector-type-interactive{background:var(--ink);color:var(--paper);padding:1px 4px}
.mxp-ghost-legend{display:flex;gap:14px;flex-wrap:wrap}
.mxp-legend-item{display:flex;align-items:center;gap:6px;font-size:13px}
.mxp-legend-swatch{width:12px;height:12px}
.mxp-legend-semantic{background:var(--blue)}
.mxp-legend-non-semantic{border:1px solid var(--ink)}
.mxp-legend-blindspot{background:var(--ink)}
.mxp-ghost-viewport{padding:16px 0;max-height:520px;overflow:auto;font-family:var(--mono);font-size:12px;line-height:1.8}
.mxp-ghost-node{padding:2px 6px;display:inline-flex;align-items:center;gap:4px;margin:2px 0;cursor:default}
.mxp-ghost-semantic{background:var(--blue);color:#FFFAFA}
.mxp-ghost-non-semantic{color:var(--mxp-text-muted);border:1px solid color-mix(in srgb,var(--ink) 25%,transparent)}
.mxp-ghost-blindspot{background:var(--ink);color:var(--paper)}
.mxp-ghost-interactive{border:1px solid var(--ink);text-decoration:underline;text-underline-offset:2px}
.mxp-ghost-media{border:1px dashed var(--ink)}
.mxp-ghost-indent{display:block;padding-left:18px;border-left:1px solid color-mix(in srgb,var(--ink) 25%,transparent);margin-left:8px}
.mxp-ghost-hidden{display:none!important}
.mxp-schema-empty,.mxp-comparison-empty{padding:28px 0;color:var(--mxp-text-muted)}
.mxp-schema-item{padding:12px 0;border-bottom:1px solid var(--ink);display:flex;align-items:baseline;gap:12px;flex-wrap:wrap}
.mxp-schema-type{font-family:var(--mono);font-size:14px;color:var(--blue)}
.mxp-schema-details{font-size:15px}
.mxp-comparison-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 32px}
.mxp-comparison-col{padding:12px 0}
.mxp-comparison-col-header{font-size:12px;letter-spacing:.09em;text-transform:uppercase;padding-bottom:8px;border-bottom:1px solid var(--ink)}
.mxp-comparison-row{display:flex;justify-content:space-between;padding:6px 0;font-size:15px;border-bottom:1px solid color-mix(in srgb,var(--ink) 20%,transparent)}
.mxp-comparison-val{font-variant-numeric:tabular-nums}
.mxp-comparison-better{color:var(--blue)}
.mxp-comparison-worse{background:var(--ink);color:var(--paper);padding:0 4px}
.mxp-comparison-same{color:var(--mxp-text-muted)}
.mxp-export-bar{display:flex;gap:4px;flex-wrap:wrap;margin:0 0 12px -8px}
.mxp-export-btn{font-size:17px;line-height:1;padding:7px 8px 6px;min-height:36px;text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px}
.mxp-export-btn:hover{background:var(--blue);color:#FFFAFA;text-decoration:none}
@media (max-width:700px){.mxp-grade-main{flex-direction:column;align-items:flex-start}
.mxp-url-row{flex-direction:column;align-items:stretch}
.mxp-pillars{grid-template-columns:1fr 1fr}
.mxp-stats-row{grid-template-columns:repeat(2,1fr)}
.mxp-comparison-grid{grid-template-columns:1fr}
.mxp-inspector-grid{grid-template-columns:repeat(2,1fr)}}
@media (prefers-reduced-motion:reduce){.mxp-spinner{animation:none}}
.mxp-rec-where{margin-top:12px;border-top:1px solid var(--ink);padding-top:10px}
.mxp-rec-where-h{font-size:12px;letter-spacing:.09em;text-transform:uppercase;margin-bottom:6px}
.mxp-rec-where ul{list-style:none;display:flex;flex-direction:column;gap:4px}
.mxp-rec-where code{font:inherit;font-size:13px;line-height:1.45;overflow-wrap:anywhere;background:transparent}