

/* Start:/local/components/eleroz/pc.diagnostics/templates/.default/style.css?178680776442249*/
.epcd {
    --epcd-orange: var(--theme-base-color, #f36a21);
    --epcd-orange-bright: #ff7a2f;
    --epcd-ink: #111214;
    --epcd-panel: #191b1f;
    --epcd-panel-soft: #202329;
    --epcd-line: #343840;
    --epcd-text: #f5f5f2;
    --epcd-muted: #a6a9af;
    --epcd-good: #39b982;
    --epcd-bad: #ed5b5b;
    --epcd-warn: #e8a849;
    --epcd-radius: 18px;
    color: var(--epcd-text);
    font-family: var(--theme-font-family, inherit);
    font-size: 16px;
    line-height: 1.5;
    width: 100%;
}

.epcd,
.epcd *,
.epcd *::before,
.epcd *::after {
    box-sizing: border-box;
}

.epcd [hidden] {
    display: none !important;
}

.epcd button,
.epcd select {
    color: inherit;
    font: inherit;
}

.epcd button {
    cursor: pointer;
}

.epcd button:disabled {
    cursor: not-allowed;
    opacity: .46;
}

.epcd button:focus-visible,
.epcd select:focus-visible,
.epcd [tabindex]:focus-visible {
    outline: 3px solid color-mix(in srgb, var(--epcd-orange) 70%, white);
    outline-offset: 3px;
}

.epcd__shell {
    background:
        radial-gradient(circle at 83% 7%, rgba(243, 106, 33, .09), transparent 25%),
        linear-gradient(180deg, #17181b 0, #111214 100%);
    border: 1px solid #2b2e34;
    border-radius: 22px;
    box-shadow: 0 24px 70px rgba(0, 0, 0, .16);
    max-width: 1480px;
    overflow: hidden;
    position: relative;
}

.epcd__shell::before {
    background-image: linear-gradient(rgba(255,255,255,.018) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.018) 1px, transparent 1px);
    background-size: 42px 42px;
    content: "";
    inset: 0;
    pointer-events: none;
    position: absolute;
}

.epcd__hero,
.epcd__truth,
.epcd__limits,
.epcd__modebar,
.epcd__quicknav,
.epcd__tests,
.epcd__report,
.epcd__footer {
    position: relative;
    z-index: 1;
}

.epcd__hero {
    display: grid;
    gap: 58px;
    grid-template-columns: minmax(0, 1.05fr) minmax(420px, .95fr);
    min-height: 480px;
    padding: 68px 64px 54px;
}

.epcd__hero-copy {
    align-self: center;
    max-width: 760px;
}

.epcd__eyebrow {
    align-items: center;
    color: var(--epcd-orange-bright);
    display: inline-flex;
    font-size: 12px;
    font-weight: 800;
    gap: 9px;
    letter-spacing: .14em;
    text-transform: uppercase;
}

.epcd__eyebrow i {
    background: currentColor;
    border-radius: 50%;
    box-shadow: 0 0 0 5px rgba(243, 106, 33, .12);
    height: 7px;
    width: 7px;
}

.epcd__hero h1 {
    color: #fff;
    font-size: clamp(40px, 4.6vw, 72px);
    font-weight: 780;
    letter-spacing: -.052em;
    line-height: .99;
    margin: 22px 0 24px;
    max-width: 820px;
}

.epcd__hero-lead {
    color: #c2c4c9;
    font-size: clamp(17px, 1.45vw, 21px);
    line-height: 1.55;
    margin: 0;
    max-width: 700px;
}

.epcd__hero-actions,
.epcd__actions {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.epcd__hero-actions {
    margin-top: 32px;
}

.epcd__button {
    align-items: center;
    background: transparent;
    border: 1px solid transparent;
    border-radius: 9px;
    display: inline-flex;
    font-size: 14px;
    font-weight: 760;
    justify-content: center;
    min-height: 46px;
    padding: 10px 18px;
    transition: background-color .2s ease, border-color .2s ease, color .2s ease, transform .2s ease;
}

.epcd__button:hover:not(:disabled) {
    transform: translateY(-1px);
}

.epcd__button--primary {
    background: var(--epcd-orange);
    border-color: var(--epcd-orange);
    box-shadow: 0 8px 24px rgba(243, 106, 33, .2);
    color: #fff;
}

.epcd__button--primary:hover:not(:disabled) {
    background: var(--epcd-orange-bright);
    border-color: var(--epcd-orange-bright);
}

.epcd__button--secondary {
    background: #25282e;
    border-color: #3b3f47;
    color: #f7f7f5;
}

.epcd__button--secondary:hover:not(:disabled),
.epcd__button--quiet:hover:not(:disabled) {
    background: #30343b;
    border-color: #50545d;
}

.epcd__button--quiet {
    border-color: #353941;
    color: #b7bac0;
}

.epcd__trust-list {
    border-top: 1px solid #34373e;
    display: grid;
    gap: 0;
    grid-template-columns: repeat(3, 1fr);
    list-style: none;
    margin: 38px 0 0;
    padding: 18px 0 0;
}

.epcd__trust-list li {
    color: #aeb1b7;
    font-size: 12px;
    font-weight: 650;
    line-height: 1.35;
    padding-right: 14px;
}

.epcd__trust-list span {
    color: var(--epcd-orange-bright);
    display: block;
    font-family: ui-monospace, SFMono-Regular, Consolas, monospace;
    font-size: 10px;
    margin-bottom: 4px;
}

.epcd__machine {
    align-self: center;
    background: linear-gradient(145deg, rgba(35,38,44,.92), rgba(23,25,29,.94));
    border: 1px solid #393d45;
    border-radius: 16px;
    box-shadow: inset 0 1px rgba(255,255,255,.04), 0 25px 70px rgba(0,0,0,.26);
    min-height: 360px;
    overflow: hidden;
    padding: 18px;
    position: relative;
}

.epcd__machine::before,
.epcd__machine::after {
    border-color: rgba(255,255,255,.22);
    border-style: solid;
    content: "";
    height: 18px;
    pointer-events: none;
    position: absolute;
    width: 18px;
}

.epcd__machine::before {
    border-width: 1px 0 0 1px;
    left: 8px;
    top: 8px;
}

.epcd__machine::after {
    border-width: 0 1px 1px 0;
    bottom: 8px;
    right: 8px;
}

.epcd__machine-top {
    align-items: center;
    display: flex;
    justify-content: space-between;
}

.epcd__machine-top > span:first-child {
    align-items: center;
    display: flex;
    font-size: 12px;
    gap: 8px;
}

.epcd__machine-top i,
.epcd__live-dot {
    background: var(--epcd-warn);
    border-radius: 50%;
    box-shadow: 0 0 0 5px rgba(232,168,73,.1);
    height: 7px;
    width: 7px;
}

.epcd__machine-top i.is-ready,
.epcd__keyboard-toolbar.is-active .epcd__live-dot {
    background: var(--epcd-good);
    box-shadow: 0 0 0 5px rgba(57,185,130,.1);
}

.epcd__machine-code {
    color: #747982;
    font-family: ui-monospace, SFMono-Regular, Consolas, monospace;
    font-size: 10px;
    letter-spacing: .08em;
}

.epcd__laptop {
    margin: 35px auto 0;
    max-width: 360px;
    perspective: 800px;
    width: 80%;
}

.epcd__laptop-screen {
    background: #111317;
    border: 7px solid #444951;
    border-bottom-width: 11px;
    border-radius: 12px 12px 5px 5px;
    box-shadow: 0 0 0 1px #0e0f11, 0 16px 35px rgba(0,0,0,.34);
    height: 190px;
    overflow: hidden;
    position: relative;
}

.epcd__scan-grid {
    background-image: linear-gradient(rgba(243,106,33,.07) 1px, transparent 1px), linear-gradient(90deg, rgba(243,106,33,.07) 1px, transparent 1px);
    background-size: 25px 25px;
    inset: 0;
    position: absolute;
}

.epcd__scan-line {
    background: linear-gradient(90deg, transparent, var(--epcd-orange-bright), transparent);
    box-shadow: 0 0 16px rgba(243,106,33,.8);
    height: 1px;
    left: 0;
    position: absolute;
    right: 0;
    top: 20%;
    animation: epcd-scan 3.4s ease-in-out infinite;
}

.epcd__laptop-mark {
    align-items: center;
    display: flex;
    flex-direction: column;
    inset: 0;
    justify-content: center;
    position: absolute;
}

.epcd__laptop-mark span {
    color: #fff;
    font-size: 23px;
    font-weight: 850;
    letter-spacing: .04em;
}

.epcd__laptop-mark b {
    color: var(--epcd-orange-bright);
    font-family: ui-monospace, SFMono-Regular, Consolas, monospace;
    font-size: 8px;
    letter-spacing: .26em;
    margin-left: .26em;
}

.epcd__laptop-base {
    background: linear-gradient(#a7aab0, #62666d 45%, #34373c);
    border-radius: 2px 2px 10px 10px;
    height: 14px;
    margin: 0 -10%;
    position: relative;
    transform: rotateX(52deg);
    transform-origin: top;
}

.epcd__laptop-base i {
    background: #33363b;
    border-radius: 0 0 5px 5px;
    height: 5px;
    left: 42%;
    position: absolute;
    top: 0;
    width: 16%;
}

.epcd__machine-route {
    align-items: center;
    display: flex;
    gap: 0;
    justify-content: center;
    margin: 0 auto 20px;
    width: 72%;
}

.epcd__machine-route::before,
.epcd__machine-route::after {
    background: rgba(243,106,33,.45);
    content: "";
    height: 1px;
    width: 50%;
}

.epcd__machine-route i {
    background: #1c1e22;
    border: 1px solid var(--epcd-orange);
    border-radius: 50%;
    height: 7px;
    margin: 0 -1px;
    width: 7px;
}

.epcd__machine-stats {
    border-top: 1px solid #353941;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
}

.epcd__machine-stats span {
    display: flex;
    flex-direction: column;
    padding: 14px 9px 0;
    text-align: center;
}

.epcd__machine-stats span + span {
    border-left: 1px solid #353941;
}

.epcd__machine-stats b {
    font-family: ui-monospace, SFMono-Regular, Consolas, monospace;
    font-size: 16px;
}

.epcd__machine-stats small {
    color: #858991;
    font-size: 9px;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.epcd__truth {
    align-items: center;
    background: #f3f2ef;
    color: #222326;
    display: grid;
    gap: 18px;
    grid-template-columns: auto 1fr auto;
    margin: 0 34px;
    padding: 18px 24px;
}

.epcd__truth-icon {
    align-items: center;
    background: var(--epcd-orange);
    border-radius: 50%;
    color: #fff;
    display: inline-flex;
    font-family: ui-monospace, SFMono-Regular, Consolas, monospace;
    font-size: 13px;
    font-style: normal;
    font-weight: 800;
    height: 30px;
    justify-content: center;
    width: 30px;
}

.epcd__truth strong {
    display: block;
    font-size: 14px;
}

.epcd__truth p {
    color: #686a70;
    font-size: 12px;
    margin: 2px 0 0;
}

.epcd__truth button {
    background: transparent;
    border: 0;
    border-bottom: 1px solid #9b9da1;
    color: #333438;
    font-size: 12px;
    font-weight: 750;
    padding: 2px 0;
}

.epcd__limits {
    background: #22252a;
    border: 1px solid #393d44;
    display: grid;
    gap: 28px;
    grid-template-columns: .8fr 1.2fr;
    margin: 14px 34px 0;
    padding: 28px;
}

.epcd__limits h2 {
    font-size: 25px;
    letter-spacing: -.025em;
    margin: 7px 0 0;
}

.epcd__limits > p {
    color: #b0b3b9;
    font-size: 14px;
    margin: 0;
}

.epcd__limits ul {
    display: grid;
    gap: 8px 18px;
    grid-column: 1 / -1;
    grid-template-columns: repeat(3, 1fr);
    list-style: none;
    margin: 0;
    padding: 0;
}

.epcd__limits li {
    border-top: 1px solid #3a3e45;
    color: #c7c9cd;
    font-size: 12px;
    padding: 10px 0;
}

.epcd__limits li::before {
    color: var(--epcd-orange-bright);
    content: "×";
    margin-right: 8px;
}

.epcd__modebar {
    align-items: center;
    border-bottom: 1px solid #30333a;
    border-top: 1px solid #30333a;
    display: flex;
    justify-content: space-between;
    margin-top: 36px;
    padding: 15px 34px;
}

.epcd__mode-tabs {
    background: #0f1012;
    border: 1px solid #30343b;
    border-radius: 9px;
    display: flex;
    padding: 3px;
}

.epcd__mode-tabs button {
    background: transparent;
    border: 0;
    border-radius: 6px;
    color: #92969e;
    font-size: 12px;
    font-weight: 750;
    padding: 9px 14px;
}

.epcd__mode-tabs button.is-active {
    background: #292c32;
    box-shadow: inset 0 -2px var(--epcd-orange);
    color: #fff;
}

.epcd__progress {
    align-items: center;
    display: flex;
    gap: 12px;
}

.epcd__progress span {
    color: #858990;
    font-size: 11px;
}

.epcd__progress span b {
    color: #fff;
}

.epcd__progress > i {
    background: #2d3036;
    border-radius: 20px;
    display: block;
    height: 5px;
    overflow: hidden;
    width: 150px;
}

.epcd__progress > i > b {
    background: var(--epcd-orange);
    border-radius: inherit;
    display: block;
    height: 100%;
    transition: width .3s ease;
    width: 0;
}

.epcd__quicknav {
    display: grid;
    grid-template-columns: repeat(8, 1fr);
    padding: 18px 34px 8px;
}

.epcd__quicknav button {
    background: transparent;
    border: 0;
    border-right: 1px solid #31343a;
    color: #9da1a8;
    font-size: 11px;
    font-weight: 700;
    min-width: 0;
    padding: 8px 5px;
}

.epcd__quicknav button:last-child {
    border-right: 0;
}

.epcd__quicknav button:hover {
    color: #fff;
}

.epcd__quicknav span {
    color: var(--epcd-orange-bright);
    display: block;
    font-family: ui-monospace, SFMono-Regular, Consolas, monospace;
    font-size: 9px;
}

.epcd__tests {
    display: grid;
    gap: 16px;
    padding: 18px 34px 34px;
}

.epcd__module {
    background: rgba(28, 30, 34, .96);
    border: 1px solid #343840;
    border-radius: var(--epcd-radius);
    overflow: hidden;
    scroll-margin-top: 24px;
    transition: border-color .25s ease, box-shadow .25s ease;
}

.epcd__module.is-passed {
    border-color: rgba(57,185,130,.55);
}

.epcd__module.is-problem {
    border-color: rgba(237,91,91,.65);
}

.epcd__module.is-unsupported {
    border-color: rgba(166,169,175,.35);
}

.epcd__module-head {
    align-items: center;
    border-bottom: 1px solid #343840;
    display: grid;
    gap: 20px;
    grid-template-columns: 58px 1fr auto;
    padding: 24px 26px;
}

.epcd__module-number {
    color: var(--epcd-orange-bright);
    font-family: ui-monospace, SFMono-Regular, Consolas, monospace;
    font-size: 11px;
    font-weight: 750;
    position: relative;
}

.epcd__module-number i {
    background: #3b3f47;
    height: 1px;
    position: absolute;
    right: 0;
    top: 8px;
    width: 22px;
}

.epcd__module-title span {
    color: #777b83;
    font-size: 9px;
    font-weight: 800;
    letter-spacing: .12em;
    text-transform: uppercase;
}

.epcd__module-title h2 {
    color: #fff;
    font-size: 26px;
    letter-spacing: -.025em;
    line-height: 1.1;
    margin: 3px 0 4px;
}

.epcd__module-title p {
    color: #9fa2a9;
    font-size: 13px;
    margin: 0;
}

.epcd__status {
    align-items: center;
    background: #25282e;
    border: 1px solid #383c44;
    border-radius: 100px;
    color: #a5a8ae;
    display: inline-flex;
    font-size: 10px;
    gap: 7px;
    padding: 7px 11px;
    white-space: nowrap;
}

.epcd__status i {
    background: currentColor;
    border-radius: 50%;
    height: 6px;
    width: 6px;
}

.epcd__status.is-passed { color: var(--epcd-good); }
.epcd__status.is-problem { color: var(--epcd-bad); }
.epcd__status.is-unsupported { color: #90949b; }

.epcd__module-body,
.epcd__pointer-layout,
.epcd__media-layout,
.epcd__mic-layout,
.epcd__speaker-layout,
.epcd__graphics-layout {
    display: grid;
    gap: 24px;
    grid-template-columns: minmax(280px, .78fr) minmax(360px, 1.22fr);
    padding: 26px;
}

.epcd__screen-preview {
    background: linear-gradient(135deg, #fbfbf8, #bfc1c5 45%, #101115 46%, #20232a);
    border: 8px solid #353940;
    border-radius: 9px;
    box-shadow: 0 20px 35px rgba(0,0,0,.2);
    min-height: 210px;
    overflow: hidden;
    position: relative;
}

.epcd__screen-preview i {
    background: linear-gradient(90deg, transparent, rgba(243,106,33,.8), transparent);
    height: 1px;
    left: 0;
    position: absolute;
    right: 0;
    top: 40%;
}

.epcd__screen-preview span {
    background: var(--epcd-orange);
    border-radius: 50%;
    box-shadow: 0 0 0 4px rgba(243,106,33,.14);
    height: 5px;
    position: absolute;
    width: 5px;
}

.epcd__screen-preview span:nth-of-type(1) { left: 18%; top: 30%; }
.epcd__screen-preview span:nth-of-type(2) { left: 63%; top: 71%; }
.epcd__screen-preview span:nth-of-type(3) { left: 82%; top: 21%; }

.epcd__screen-preview b {
    bottom: 11px;
    color: rgba(255,255,255,.75);
    font-family: ui-monospace, SFMono-Regular, Consolas, monospace;
    font-size: 8px;
    left: 12px;
    letter-spacing: .08em;
    position: absolute;
}

.epcd__instruction ol {
    counter-reset: epcd-instructions;
    list-style: none;
    margin: 0 0 21px;
    padding: 0;
}

.epcd__instruction li {
    color: #b8bac0;
    counter-increment: epcd-instructions;
    font-size: 13px;
    margin-bottom: 11px;
    padding-left: 29px;
    position: relative;
}

.epcd__instruction li::before {
    align-items: center;
    border: 1px solid #4b4f57;
    border-radius: 50%;
    color: var(--epcd-orange-bright);
    content: counter(epcd-instructions);
    display: flex;
    font-family: ui-monospace, SFMono-Regular, Consolas, monospace;
    font-size: 9px;
    height: 19px;
    justify-content: center;
    left: 0;
    position: absolute;
    top: 1px;
    width: 19px;
}

.epcd__metric-row {
    display: grid;
    gap: 8px;
    grid-template-columns: repeat(3, 1fr);
    margin-top: 18px;
}

.epcd__metric-row > span {
    background: #15171a;
    border: 1px solid #30343b;
    border-radius: 8px;
    display: flex;
    flex-direction: column;
    min-width: 0;
    padding: 10px 11px;
}

.epcd__metric-row small {
    color: #7e828a;
    font-size: 9px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.epcd__metric-row b {
    color: #f3f3f1;
    font-family: ui-monospace, SFMono-Regular, Consolas, monospace;
    font-size: 15px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.epcd__motion-track {
    background: #131518;
    border-top: 1px solid #30343b;
    height: 78px;
    overflow: hidden;
    position: relative;
}

.epcd__motion-track::before {
    background-image: repeating-linear-gradient(90deg, transparent 0 48px, rgba(255,255,255,.055) 48px 49px);
    content: "";
    inset: 0;
    position: absolute;
}

.epcd__motion-track > i {
    background: var(--epcd-orange-bright);
    border-radius: 50%;
    box-shadow: 0 0 16px rgba(243,106,33,.8);
    height: 14px;
    left: 22px;
    position: absolute;
    top: 22px;
    transform: translateX(0);
    width: 14px;
}

.epcd__motion-track > span {
    bottom: 5px;
    color: #6f737b;
    font-size: 9px;
    left: 12px;
    position: absolute;
}

.epcd__verdict {
    align-items: center;
    background: #22252a;
    border-top: 1px solid #343840;
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
    padding: 16px 26px;
}

.epcd__verdict strong {
    color: #aeb1b6;
    font-size: 12px;
    margin-right: auto;
}

.epcd__verdict button {
    background: #191b1f;
    border: 1px solid #3c4048;
    border-radius: 7px;
    color: #c7c9ce;
    font-size: 11px;
    font-weight: 700;
    padding: 9px 12px;
}

.epcd__verdict button:hover,
.epcd__verdict button.is-selected {
    border-color: var(--epcd-orange);
    color: #fff;
}

.epcd__verdict button[data-result="passed"].is-selected { border-color: var(--epcd-good); color: var(--epcd-good); }
.epcd__verdict button[data-result="problem"].is-selected { border-color: var(--epcd-bad); color: var(--epcd-bad); }

.epcd__keyboard-toolbar {
    align-items: center;
    display: grid;
    gap: 10px;
    grid-template-columns: 1fr auto auto;
    padding: 20px 26px 12px;
}

.epcd__keyboard-toolbar > div {
    align-items: center;
    display: grid;
    grid-template-columns: auto 1fr;
    padding-left: 3px;
}

.epcd__keyboard-toolbar > div > span {
    grid-row: 1 / 3;
    margin-right: 12px;
}

.epcd__keyboard-toolbar b { font-size: 13px; }
.epcd__keyboard-toolbar small { color: #7d8189; font-size: 10px; }

.epcd__keyboard {
    display: grid;
    gap: 5px;
    grid-template-columns: repeat(30, minmax(8px, 1fr));
    overflow-x: auto;
    padding: 14px 26px 20px;
}

.epcd__key {
    align-items: flex-start;
    background: linear-gradient(#2a2d33, #202329);
    border: 1px solid #444851;
    border-bottom-width: 3px;
    border-radius: 6px;
    color: #c9cbd0;
    display: flex;
    font-family: ui-monospace, SFMono-Regular, Consolas, monospace;
    font-size: 9px;
    grid-column: span 2;
    justify-content: flex-start;
    min-height: 38px;
    min-width: 30px;
    padding: 6px;
    transition: background .08s ease, border-color .08s ease, transform .08s ease;
}

.epcd__key[data-wide="3"] { grid-column: span 3; }
.epcd__key[data-wide="4"] { grid-column: span 4; }
.epcd__key[data-wide="5"] { grid-column: span 5; }
.epcd__key[data-wide="6"] { grid-column: span 6; }
.epcd__key[data-wide="8"] { grid-column: span 8; }
.epcd__key[data-wide="10"] { grid-column: span 10; }
.epcd__key[data-gap="1"] { margin-left: 5px; }

.epcd__key-break {
    grid-column: 1 / -1;
    height: 0;
}

.epcd__key.is-tested {
    border-color: rgba(57,185,130,.65);
    color: var(--epcd-good);
}

.epcd__key.is-down {
    background: var(--epcd-orange);
    border-color: var(--epcd-orange-bright);
    color: #fff;
    transform: translateY(2px);
}

.epcd__key.is-suspect {
    border-color: var(--epcd-bad);
    color: var(--epcd-bad);
}

.epcd__keyboard-data {
    display: grid;
    gap: 14px;
    grid-template-columns: 1.15fr .85fr;
    padding: 0 26px 24px;
}

.epcd__metric-row--keyboard {
    grid-template-columns: repeat(2, 1fr);
    margin: 0;
}

.epcd__event-log {
    background: #131518;
    border: 1px solid #30343b;
    border-radius: 8px;
    min-height: 120px;
    padding: 11px;
}

.epcd__event-log > div {
    align-items: center;
    display: flex;
    gap: 8px;
    justify-content: space-between;
}

.epcd__event-log strong { font-size: 10px; }
.epcd__event-log span { color: var(--epcd-orange-bright); font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: 9px; }
.epcd__event-log ol { color: #858991; font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: 9px; list-style: none; margin: 8px 0 0; max-height: 94px; overflow: auto; padding: 0; }
.epcd__event-log li { border-top: 1px solid #292c31; padding: 4px 0; }

.epcd__notice {
    background: rgba(255,255,255,.025);
    border-left: 2px solid #5c6068;
    color: #93979e;
    font-size: 11px;
    margin: 0 26px 22px;
    padding: 10px 12px;
}

.epcd__notice--warning {
    border-left-color: var(--epcd-warn);
    color: #c9b183;
}

.epcd__pointer-pad {
    background: #111317;
    border: 1px solid #363a42;
    border-radius: 10px;
    min-height: 300px;
    overflow: hidden;
    position: relative;
    touch-action: none;
}

.epcd__pointer-pad canvas,
.epcd__gpu-stage canvas {
    height: 100%;
    inset: 0;
    position: absolute;
    width: 100%;
}

.epcd__pointer-target {
    align-items: center;
    border: 1px dashed #565b64;
    border-radius: 50%;
    display: flex;
    flex-direction: column;
    height: 110px;
    justify-content: center;
    left: calc(50% - 55px);
    pointer-events: none;
    position: absolute;
    top: calc(50% - 55px);
    width: 110px;
}

.epcd__pointer-target i {
    border: 1px solid var(--epcd-orange);
    border-radius: 50%;
    height: 13px;
    margin-bottom: 6px;
    width: 13px;
}

.epcd__pointer-target span,
.epcd__pointer-hint {
    color: #777b82;
    font-size: 9px;
    text-align: center;
}

.epcd__pointer-hint {
    bottom: 8px;
    left: 0;
    position: absolute;
    right: 0;
}

.epcd__pointer-panel {
    display: flex;
    flex-direction: column;
    gap: 18px;
    justify-content: center;
}

.epcd__mouse-buttons {
    display: grid;
    gap: 7px;
    grid-template-columns: repeat(5, 1fr);
}

.epcd__mouse-buttons span {
    align-items: center;
    background: #22252b;
    border: 1px solid #3a3e46;
    border-radius: 7px;
    color: #8e929a;
    display: flex;
    font-size: 9px;
    justify-content: center;
    min-height: 55px;
    text-align: center;
}

.epcd__mouse-buttons span.is-used {
    border-color: var(--epcd-good);
    color: var(--epcd-good);
}

.epcd__mouse-buttons span.is-down {
    background: var(--epcd-orange);
    border-color: var(--epcd-orange-bright);
    color: #fff;
}

.epcd__media-layout,
.epcd__mic-layout,
.epcd__graphics-layout {
    grid-template-columns: minmax(320px, 1fr) minmax(320px, 1fr);
}

.epcd__video-frame,
.epcd__gpu-stage {
    aspect-ratio: 16 / 9;
    background: #0d0f11;
    border: 1px solid #363a41;
    border-radius: 10px;
    overflow: hidden;
    position: relative;
}

.epcd__video-frame video,
.epcd__video-frame canvas {
    height: 100%;
    object-fit: cover;
    width: 100%;
}

.epcd__media-empty,
.epcd__gpu-stage > div {
    align-items: center;
    display: flex;
    flex-direction: column;
    inset: 0;
    justify-content: center;
    position: absolute;
}

.epcd__media-empty span,
.epcd__gpu-stage > div span {
    align-items: center;
    border: 1px solid #454a53;
    border-radius: 50%;
    color: var(--epcd-orange-bright);
    display: flex;
    font-family: ui-monospace, SFMono-Regular, Consolas, monospace;
    font-size: 10px;
    height: 58px;
    justify-content: center;
    margin-bottom: 12px;
    width: 58px;
}

.epcd__media-empty b,
.epcd__gpu-stage > div b { font-size: 12px; }
.epcd__media-empty small { color: #70747c; font-size: 9px; margin-top: 3px; }

.epcd__media-meta {
    background: rgba(13,15,17,.76);
    border-radius: 5px;
    bottom: 8px;
    color: #fff;
    font-family: ui-monospace, SFMono-Regular, Consolas, monospace;
    font-size: 9px;
    left: 8px;
    padding: 5px 7px;
    position: absolute;
}

.epcd__media-controls,
.epcd__gpu-panel {
    align-self: center;
}

.epcd__media-controls label {
    color: #878b93;
    display: block;
    font-size: 10px;
    font-weight: 750;
    letter-spacing: .06em;
    margin-bottom: 18px;
    text-transform: uppercase;
}

.epcd__media-controls select {
    background: #17191d;
    border: 1px solid #3c4048;
    border-radius: 8px;
    color: #e5e5e2;
    display: block;
    font-size: 12px;
    margin-top: 7px;
    min-height: 43px;
    padding: 8px 11px;
    width: 100%;
}

.epcd__inline-message {
    color: #858991;
    font-size: 11px;
    margin: 14px 0 0;
}

.epcd__media-controls audio {
    height: 38px;
    margin-top: 16px;
    width: 100%;
}

.epcd__level-meter {
    align-items: center;
    background: #111316;
    border: 1px solid #363a42;
    border-radius: 10px;
    display: grid;
    gap: 18px;
    grid-template-columns: 1fr auto;
    min-height: 225px;
    padding: 28px;
}

.epcd__level-meter > div {
    align-items: end;
    display: grid;
    gap: 4px;
    grid-template-columns: repeat(28, 1fr);
    height: 120px;
}

.epcd__level-meter i {
    background: #2b2f35;
    border-radius: 2px;
    display: block;
    min-height: 5px;
    transition: background .06s linear;
}

.epcd__level-meter i.is-active {
    background: var(--epcd-orange);
    box-shadow: 0 0 7px rgba(243,106,33,.24);
}

.epcd__level-meter > span {
    display: flex;
    flex-direction: column;
    text-align: right;
}

.epcd__level-meter > span b {
    font-family: ui-monospace, SFMono-Regular, Consolas, monospace;
    font-size: 34px;
}

.epcd__level-meter > span small {
    color: #7c8088;
    font-size: 9px;
    max-width: 130px;
}

.epcd__speaker-layout {
    grid-template-columns: minmax(320px, .9fr) minmax(340px, 1.1fr);
}

.epcd__speaker-stage {
    align-items: center;
    background: #111316;
    border: 1px solid #363a42;
    border-radius: 10px;
    display: grid;
    gap: 15px;
    grid-template-columns: 1fr 1.2fr 1fr;
    min-height: 230px;
    padding: 24px;
}

.epcd__speaker {
    align-items: center;
    display: flex;
    flex-direction: column;
}

.epcd__speaker > i {
    background: radial-gradient(circle, #17191c 0 23%, #3c4047 24% 27%, #1a1c20 28% 48%, #444850 49% 52%, #202329 53%);
    border: 1px solid #4a4f57;
    border-radius: 50%;
    height: 80px;
    margin-bottom: 8px;
    width: 80px;
}

.epcd__speaker.is-playing > i {
    border-color: var(--epcd-orange);
    box-shadow: 0 0 0 7px rgba(243,106,33,.08), 0 0 24px rgba(243,106,33,.16);
}

.epcd__speaker b { color: var(--epcd-orange-bright); font-family: ui-monospace, SFMono-Regular, Consolas, monospace; }
.epcd__speaker small { color: #70747b; font-size: 9px; }

.epcd__speaker-stage > div {
    display: flex;
    flex-direction: column;
    text-align: center;
}

.epcd__speaker-stage > div > i {
    background: repeating-radial-gradient(ellipse at center, transparent 0 7px, rgba(243,106,33,.45) 8px 9px, transparent 10px 15px);
    height: 50px;
    margin-bottom: 10px;
    opacity: .3;
}

.epcd__speaker-stage > div > i.is-playing { opacity: 1; }
.epcd__speaker-stage > div b { font-size: 11px; }
.epcd__speaker-stage > div small { color: #72767e; font-size: 9px; }

.epcd__speaker-controls > strong {
    color: #8d9199;
    display: block;
    font-size: 9px;
    letter-spacing: .1em;
    margin: 0 0 8px;
    text-transform: uppercase;
}

.epcd__speaker-controls > strong:nth-of-type(2) { margin-top: 23px; }

.epcd__frequency-row {
    display: grid;
    gap: 8px;
    grid-template-columns: repeat(3, 1fr);
}

.epcd__frequency-row button {
    background: #22252a;
    border: 1px solid #3b3f47;
    border-radius: 7px;
    color: #bbbfc5;
    font-family: ui-monospace, SFMono-Regular, Consolas, monospace;
    font-size: 11px;
    padding: 12px 8px;
}

.epcd__frequency-row button:hover { border-color: var(--epcd-orange); color: #fff; }

.epcd__network-grid {
    display: grid;
    gap: 8px;
    grid-template-columns: repeat(5, 1fr);
    padding: 26px;
}

.epcd__network-grid > div {
    background: #141619;
    border: 1px solid #30343b;
    border-radius: 9px;
    display: grid;
    grid-template-columns: auto 1fr auto;
    padding: 14px;
}

.epcd__network-grid span {
    color: var(--epcd-orange-bright);
    font-family: ui-monospace, SFMono-Regular, Consolas, monospace;
    grid-row: 1 / 3;
    margin-right: 9px;
}

.epcd__network-grid small { color: #797d85; font-size: 9px; }
.epcd__network-grid b { font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: 19px; }
.epcd__network-grid em { align-self: end; color: #696d75; font-size: 8px; font-style: normal; }

.epcd__network-action {
    align-items: center;
    background: #22252a;
    border-top: 1px solid #343840;
    display: flex;
    gap: 20px;
    justify-content: space-between;
    padding: 18px 26px;
}

.epcd__network-action strong { font-size: 13px; }
.epcd__network-action p { color: #858990; font-size: 11px; margin: 3px 0 0; }

.epcd__gpu-stage small {
    bottom: 8px;
    color: var(--epcd-orange-bright);
    font-family: ui-monospace, SFMono-Regular, Consolas, monospace;
    font-size: 9px;
    left: 10px;
    position: absolute;
}

.epcd__gpu-panel .epcd__metric-row {
    grid-template-columns: repeat(2, 1fr);
    margin: 0 0 18px;
}

.epcd__report {
    background: #f2f1ee;
    color: #232427;
    margin: 8px 34px 34px;
    padding: 34px;
}

.epcd__report > header {
    align-items: flex-start;
    display: flex;
    gap: 20px;
    justify-content: space-between;
}

.epcd__report h2 {
    font-size: 30px;
    letter-spacing: -.035em;
    margin: 6px 0 3px;
}

.epcd__report > header p { color: #74767b; font-size: 13px; margin: 0; }

.epcd__report-score {
    color: #2b2c30;
    font-family: ui-monospace, SFMono-Regular, Consolas, monospace;
    font-size: 27px;
    font-weight: 800;
}

.epcd__report-grid {
    display: grid;
    gap: 1px;
    grid-template-columns: repeat(4, 1fr);
    margin-top: 26px;
}

.epcd__report-item {
    background: #fff;
    border: 1px solid #deddda;
    min-height: 114px;
    padding: 15px;
}

.epcd__report-item span {
    align-items: center;
    color: #8b8d91;
    display: flex;
    font-size: 9px;
    font-weight: 800;
    gap: 6px;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.epcd__report-item span::before {
    background: currentColor;
    border-radius: 50%;
    content: "";
    height: 6px;
    width: 6px;
}

.epcd__report-item.is-passed span { color: #25855e; }
.epcd__report-item.is-problem span { color: #c43f3f; }
.epcd__report-item.is-unsupported span { color: #777a80; }
.epcd__report-item b { display: block; font-size: 14px; margin: 8px 0 3px; }
.epcd__report-item p { color: #77797e; font-size: 10px; line-height: 1.45; margin: 0; }

.epcd__report-summary {
    border-bottom: 1px solid #d6d5d2;
    border-top: 1px solid #d6d5d2;
    display: grid;
    gap: 28px;
    grid-template-columns: .9fr 1.1fr;
    margin-top: 24px;
    padding: 22px 0;
}

.epcd__report-summary strong { font-size: 17px; }
.epcd__report-summary p { color: #6e7075; font-size: 12px; margin: 4px 0 0; }
.epcd__report-summary ul { color: #52545a; font-size: 11px; margin: 0; padding-left: 18px; }
.epcd__report-summary li + li { margin-top: 5px; }

.epcd__report-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
    margin-top: 20px;
}

.epcd__report .epcd__button--secondary { background: #fff; border-color: #cac9c6; color: #2c2d31; }
.epcd__report .epcd__button--quiet { border-color: #d1d0cd; color: #6e7075; }

.epcd__consent {
    align-items: center;
    background: #e7e6e3;
    display: grid;
    gap: 14px;
    grid-template-columns: auto 1fr;
    margin-top: 24px;
    padding: 15px;
}

.epcd__consent strong { font-size: 12px; }
.epcd__consent p { color: #6b6d71; font-size: 10px; margin: 2px 0 0; }

.epcd__footer {
    align-items: center;
    border-top: 1px solid #31343b;
    display: flex;
    gap: 20px;
    justify-content: space-between;
    padding: 20px 34px;
}

.epcd__footer span { color: var(--epcd-orange-bright); font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: 9px; letter-spacing: .08em; text-transform: uppercase; }
.epcd__footer p { color: #72767e; font-size: 10px; margin: 0; text-align: right; }

.epcd__stepbar {
    align-items: center;
    background: rgba(17,18,20,.94);
    border: 1px solid #3c4048;
    border-radius: 12px;
    bottom: 16px;
    box-shadow: 0 15px 40px rgba(0,0,0,.32);
    display: flex;
    gap: 15px;
    justify-content: space-between;
    left: 50%;
    max-width: calc(100% - 32px);
    padding: 8px;
    position: sticky;
    transform: translateX(-50%);
    width: 520px;
    z-index: 20;
}

.epcd__stepbar button {
    background: #292c32;
    border: 1px solid #3f434b;
    border-radius: 7px;
    color: #fff;
    font-size: 11px;
    padding: 9px 13px;
}

.epcd__stepbar span { color: #8e9299; font-size: 10px; }
.epcd__stepbar span b { color: var(--epcd-orange-bright); }
.epcd__stepbar em { color: #fff; font-style: normal; }

.epcd__screen-overlay {
    background: #fff;
    inset: 0;
    position: fixed;
    z-index: 2147483000;
}

.epcd__screen-fill {
    inset: 0;
    position: absolute;
}

.epcd__screen-fill[data-mode="white"] { background: #fff; }
.epcd__screen-fill[data-mode="black"] { background: #000; }
.epcd__screen-fill[data-mode="red"] { background: #f00; }
.epcd__screen-fill[data-mode="green"] { background: #00e800; }
.epcd__screen-fill[data-mode="blue"] { background: #004cff; }
.epcd__screen-fill[data-mode="gray"] { background: #777; }
.epcd__screen-fill[data-mode="gradient"] { background: linear-gradient(90deg, #000, #fff); }
.epcd__screen-fill[data-mode="bands"] { background: repeating-linear-gradient(90deg, #111 0 12px, #eee 12px 24px); }
.epcd__screen-fill[data-mode="uniformity"] { background: radial-gradient(circle at center, #bcbcbc 0, #919191 80%, #777 100%); }

.epcd__screen-toolbar {
    align-items: center;
    background: rgba(16,17,19,.94);
    border: 1px solid #484c54;
    border-radius: 12px;
    bottom: 18px;
    box-shadow: 0 16px 50px rgba(0,0,0,.4);
    color: #fff;
    display: grid;
    gap: 10px;
    grid-template-columns: auto 1fr auto auto;
    left: 50%;
    max-width: calc(100% - 24px);
    padding: 8px;
    position: absolute;
    transform: translateX(-50%);
    width: 560px;
}

.epcd__screen-toolbar button {
    background: #292c32;
    border: 1px solid #454a52;
    border-radius: 7px;
    color: #fff;
    min-height: 40px;
    padding: 8px 14px;
}

.epcd__screen-toolbar > div { display: flex; flex-direction: column; min-width: 0; }
.epcd__screen-toolbar strong { font-size: 12px; }
.epcd__screen-toolbar span { color: #a6a9af; font-size: 9px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.epcd__screen-toolbar i { display: flex; gap: 4px; margin-top: 4px; }
.epcd__screen-toolbar i > b { background: #555a62; border-radius: 5px; height: 3px; width: 12px; }
.epcd__screen-toolbar i > b.is-active { background: var(--epcd-orange-bright); }

.epcd__toast {
    background: #fff;
    border-left: 4px solid var(--epcd-orange);
    bottom: 20px;
    box-shadow: 0 14px 45px rgba(0,0,0,.28);
    color: #242529;
    font-size: 12px;
    font-weight: 700;
    left: 50%;
    max-width: calc(100% - 32px);
    opacity: 0;
    padding: 12px 17px;
    pointer-events: none;
    position: fixed;
    transform: translate(-50%, 14px);
    transition: opacity .2s ease, transform .2s ease;
    z-index: 2147483001;
}

.epcd__toast.is-visible {
    opacity: 1;
    transform: translate(-50%, 0);
}

@keyframes epcd-scan {
    0%, 100% { top: 16%; opacity: .25; }
    50% { top: 84%; opacity: 1; }
}

@media (max-width: 1100px) {
    .epcd__hero { gap: 34px; grid-template-columns: minmax(0, 1fr) minmax(360px, .8fr); padding: 52px 40px 45px; }
    .epcd__hero h1 { font-size: clamp(38px, 5vw, 58px); }
    .epcd__quicknav { grid-template-columns: repeat(4, 1fr); }
    .epcd__quicknav button:nth-child(4) { border-right: 0; }
    .epcd__report-grid { grid-template-columns: repeat(2, 1fr); }
    .epcd__network-grid { grid-template-columns: repeat(3, 1fr); }
}

@media (max-width: 820px) {
    .epcd { font-size: 15px; }
    .epcd__shell { border-radius: 14px; }
    .epcd__hero { grid-template-columns: 1fr; padding: 42px 26px 36px; }
    .epcd__machine { min-height: 330px; }
    .epcd__truth { grid-template-columns: auto 1fr; margin: 0 18px; }
    .epcd__truth button { grid-column: 2; justify-self: start; }
    .epcd__limits { grid-template-columns: 1fr; margin-inline: 18px; }
    .epcd__limits ul { grid-template-columns: repeat(2, 1fr); }
    .epcd__modebar { padding-inline: 18px; }
    .epcd__quicknav { padding-inline: 18px; }
    .epcd__tests { padding: 16px 18px 26px; }
    .epcd__module-body,
    .epcd__pointer-layout,
    .epcd__media-layout,
    .epcd__mic-layout,
    .epcd__speaker-layout,
    .epcd__graphics-layout { grid-template-columns: 1fr; }
    .epcd__keyboard-data { grid-template-columns: 1fr; }
    .epcd__network-grid { grid-template-columns: repeat(2, 1fr); }
    .epcd__report { margin-inline: 18px; padding: 26px; }
    .epcd__report-summary { grid-template-columns: 1fr; }
}

@media (max-width: 560px) {
    .epcd__hero { padding: 34px 18px 28px; }
    .epcd__hero h1 { font-size: 37px; }
    .epcd__hero-lead { font-size: 15px; }
    .epcd__hero-actions { align-items: stretch; flex-direction: column; }
    .epcd__hero-actions .epcd__button { width: 100%; }
    .epcd__trust-list { grid-template-columns: 1fr; gap: 10px; }
    .epcd__trust-list li { align-items: center; display: grid; grid-template-columns: 28px 1fr; }
    .epcd__trust-list span { margin: 0; }
    .epcd__machine { min-height: 305px; padding: 14px; }
    .epcd__laptop { margin-top: 30px; width: 90%; }
    .epcd__laptop-screen { height: 155px; }
    .epcd__machine-stats b { font-size: 13px; }
    .epcd__truth { align-items: start; grid-template-columns: auto 1fr; padding: 15px; }
    .epcd__truth button { grid-column: 1 / -1; }
    .epcd__limits { padding: 20px; }
    .epcd__limits ul { grid-template-columns: 1fr; }
    .epcd__modebar { align-items: stretch; flex-direction: column; gap: 13px; }
    .epcd__mode-tabs button { flex: 1; }
    .epcd__progress { justify-content: space-between; }
    .epcd__progress > i { flex: 1; }
    .epcd__quicknav { grid-template-columns: repeat(2, 1fr); }
    .epcd__quicknav button:nth-child(even) { border-right: 0; }
    .epcd__module-head { align-items: start; gap: 10px; grid-template-columns: 34px 1fr; padding: 18px; }
    .epcd__module-number i { display: none; }
    .epcd__module-title h2 { font-size: 22px; }
    .epcd__status { grid-column: 2; justify-self: start; }
    .epcd__module-body,
    .epcd__pointer-layout,
    .epcd__media-layout,
    .epcd__mic-layout,
    .epcd__speaker-layout,
    .epcd__graphics-layout { padding: 18px; }
    .epcd__actions { align-items: stretch; flex-direction: column; }
    .epcd__actions .epcd__button { width: 100%; }
    .epcd__metric-row { grid-template-columns: repeat(2, 1fr); }
    .epcd__verdict { align-items: stretch; flex-direction: column; padding: 15px 18px; }
    .epcd__verdict strong { margin: 0 0 4px; }
    .epcd__keyboard-toolbar { grid-template-columns: 1fr; padding: 18px; }
    .epcd__keyboard-toolbar .epcd__button { width: 100%; }
    .epcd__keyboard { padding-inline: 18px; }
    .epcd__keyboard-data { padding-inline: 18px; }
    .epcd__notice { margin-inline: 18px; }
    .epcd__mouse-buttons { grid-template-columns: repeat(3, 1fr); }
    .epcd__pointer-pad { min-height: 260px; }
    .epcd__level-meter { grid-template-columns: 1fr; padding: 18px; }
    .epcd__level-meter > span { text-align: left; }
    .epcd__speaker-stage { gap: 8px; padding: 14px 8px; }
    .epcd__speaker > i { height: 62px; width: 62px; }
    .epcd__network-grid { padding: 18px; }
    .epcd__network-action { align-items: stretch; flex-direction: column; padding: 18px; }
    .epcd__report { margin-inline: 0; padding: 22px 18px; }
    .epcd__report-grid { grid-template-columns: 1fr; }
    .epcd__report > header { align-items: flex-start; flex-direction: column; }
    .epcd__report-actions { align-items: stretch; flex-direction: column; }
    .epcd__footer { align-items: flex-start; flex-direction: column; padding-inline: 18px; }
    .epcd__footer p { text-align: left; }
    .epcd__screen-toolbar { bottom: 10px; grid-template-columns: auto 1fr auto; }
    .epcd__screen-toolbar button:last-child { grid-column: 1 / -1; }
}

@media (prefers-reduced-motion: reduce) {
    .epcd *,
    .epcd *::before,
    .epcd *::after {
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        scroll-behavior: auto !important;
        transition-duration: .01ms !important;
    }
}

@media (forced-colors: active) {
    .epcd__button,
    .epcd__status,
    .epcd__module,
    .epcd__key {
        forced-color-adjust: auto;
    }
}

.eleroz-diagnostics-page .iachat_panel_call_to_action { display: none !important; }

@media (max-width: 767px) {
    html.eleroz-diagnostics-page .iachat_panel,
    html.eleroz-diagnostics-page .iachat_panel_all_soc_blocks {
        display: none !important;
    }
}

/* End */
/* /local/components/eleroz/pc.diagnostics/templates/.default/style.css?178680776442249 */
