/* Screen Tester site look v2: ONE page background on every page, white cards, small brand accents. */
:root{--stx-bg:#f6f7fb;--stx-card:#ffffff;--stx-line:#e4e7ee;--stx-tx:#141a24;--stx-mu:#5d6676;--stx-b1:#4f46e5;--stx-b2:#f97316;--stx-fade:#eef0ff;--stx-r:20px;--stx-sh:0 1px 2px rgba(16,24,40,.04),0 8px 24px rgba(16,24,40,.06);--stx-gap:16px;--stx-hh:72px;
 --sl-bg:var(--stx-bg);--sl-card:#fff;--sl-line:var(--stx-line);--sl-txt:var(--stx-tx);--sl-mut:var(--stx-mu);--sl-acc:var(--stx-b1);--sl-acc2:var(--stx-b2)}
html body.stx-site,body.stx-site .site,body.stx-site #wrapper,body.stx-site #inner-wrap,body.stx-site .content-bg,body.stx-site .site-main,body.stx-site .entry,body.stx-site .entry-content-wrap,body.stx-site .content-area{background:var(--stx-bg)!important;box-shadow:none!important}
body.stx-site{color:var(--stx-tx)}
body.stx-site .content-area{margin-top:0!important;margin-bottom:0!important}
body.stx-site .entry-content-wrap{padding:0!important}
body.stx-site .entry-hero,body.stx-site .page-title,body.stx-site header.entry-header{display:none}
body.stx-site:not(.stx-tool-page) .entry-content-wrap{padding:24px 0!important}
body.stx-site:not(.stx-tool-page):not(.home) header.entry-header{display:block}
/* ---------- hero ---------- */
.stx-hero{max-width:1240px!important;margin:0 auto!important;padding:14px 16px 0!important;min-height:calc(100svh - var(--stx-hh));box-sizing:border-box}
.stx-hero>*{max-width:none!important}
.stx-hero h1.stx-h1{font-size:clamp(20px,2.1vw,28px);line-height:1.2;font-weight:800;letter-spacing:-.015em;margin:2px 4px 4px!important;color:var(--stx-tx);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.stx-hero .stx-sub{font-size:15px;color:var(--stx-mu);margin:0 4px 12px!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.stx-hero .stx-sub+*{margin-top:0!important}
.stx-hero .wp-block-shortcode,.stx-hero>p:empty{margin:0}
/* ---------- bento ---------- */
.stx-bento{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);gap:var(--stx-gap);height:clamp(440px,calc(100svh - var(--stx-hh) - var(--stx-th,78px) - 22px),720px);font-family:inherit;color:var(--stx-tx);text-align:left}
.stx-bento *{box-sizing:border-box}
.stx-card{background:#fff;border:1px solid var(--stx-line);border-radius:var(--stx-r);box-shadow:var(--stx-sh);padding:16px;min-width:0;min-height:0}
.stx-big{display:flex;flex-direction:column;overflow:hidden;padding:0}
.stx-side{display:grid;gap:var(--stx-gap);grid-auto-rows:minmax(0,auto);align-content:start;min-height:0;overflow:hidden}
.stx-cardhead{display:flex;align-items:center;gap:10px;margin-bottom:10px}
.stx-big>.stx-cardhead{padding:14px 16px 0;margin-bottom:4px}
.stx-cardhead p{margin:0!important;line-height:1.25}
.stx-ct{font-weight:750;font-size:15px}
.stx-cs{font-size:12.5px;color:var(--stx-mu)}
.stx-ico{width:34px;height:34px;border-radius:11px;display:inline-flex;align-items:center;justify-content:center;flex:none}
.stx-c1{background:#eef0ff;color:#4f46e5}.stx-c2{background:#e8f6fb;color:#0e86b8}.stx-c3{background:#fdf0e6;color:#ea580c}.stx-c4{background:#f3ecff;color:#7c3aed}.stx-c5{background:#e9f8ef;color:#059669}
.stx-kvs{display:grid;gap:6px}
.stx-kv2{grid-template-columns:1fr 1fr;column-gap:12px}
.stx-kv{display:flex;justify-content:space-between;gap:8px;font-size:13.5px;padding:5px 0;border-bottom:1px dashed var(--stx-line)}
.stx-kv span{color:var(--stx-mu)}.stx-kv b{font-variant-numeric:tabular-nums;font-weight:700;text-align:right}
.stx-dark{background:#151a24;border-color:#151a24;color:#fff}
.stx-dark .stx-cs{color:#a7b0c0}.stx-dark .stx-ico{background:rgba(249,115,22,.16);color:#fb923c}
.stx-sws{display:grid;grid-template-columns:repeat(5,1fr);gap:8px}
.stx-sw{aspect-ratio:1.5;border-radius:10px;border:1px solid rgba(255,255,255,.18);cursor:pointer;padding:0;transition:transform .12s}
.stx-sw:hover{transform:scale(1.06)}
.stx-sw:focus-visible,.stx-btn:focus-visible,.stx-chip:focus-visible,.stx-go:focus-visible{outline:3px solid var(--stx-b2);outline-offset:2px}
.stx-crow{display:grid;grid-template-columns:44px 1fr auto;gap:8px;align-items:center}
.stx-cpick{width:44px;height:40px;border:1px solid var(--stx-line);border-radius:10px;padding:2px;background:#fff;cursor:pointer}
.stx-chex{height:40px;border:1px solid var(--stx-line);border-radius:10px;padding:0 10px;font:600 14px ui-monospace,monospace;min-width:0;width:100%;background:#fff;color:var(--stx-tx)}
.stx-btn{min-height:40px;padding:0 14px;border-radius:11px;border:1px solid var(--stx-line);background:#fff;color:var(--stx-tx);font:650 14px/1 inherit;font-family:inherit;cursor:pointer;white-space:nowrap}
.stx-pri{background:var(--stx-tx);border-color:var(--stx-tx);color:#fff}
.stx-pri:hover{background:#2a3242}
.stx-ghost:hover{background:var(--stx-fade)}
.stx-kl{list-style:none;margin:0!important;padding:0!important;display:grid;grid-template-columns:1fr 1fr;gap:6px 12px;font-size:13.5px}
.stx-kl li{margin:0!important}
kbd{display:inline-block;min-width:24px;text-align:center;padding:2px 6px;border:1px solid var(--stx-line);border-bottom-width:2px;border-radius:6px;background:#f8f9fc;font:600 12px ui-monospace,monospace;color:var(--stx-tx);margin-right:4px}
.stx-tiny{font-size:12.5px;color:var(--stx-mu);margin:8px 0 0!important}
.stx-ul{margin:0!important;padding-left:18px!important;font-size:13.5px;display:grid;gap:5px}
.stx-ul li{margin:0!important}
.stx-chips{display:flex;flex-wrap:wrap;gap:7px}
.stx-chip{min-height:36px;padding:0 12px;border-radius:999px;border:1px solid var(--stx-line);background:#fff;font:600 13px inherit;font-family:inherit;color:var(--stx-tx);cursor:pointer}
.stx-chip:hover{border-color:var(--stx-b1)}
.stx-chip[aria-pressed="true"]{background:var(--stx-tx);border-color:var(--stx-tx);color:#fff}
/* colour preview big card */
.stx-prev{flex:1;display:flex;align-items:center;justify-content:center;margin:12px;border-radius:14px;border:1px solid var(--stx-line);min-height:0;transition:background .2s}
.stx-go{display:flex;flex-direction:column;align-items:center;gap:6px;background:rgba(255,255,255,.94);color:var(--stx-tx);border:1px solid var(--stx-line);border-radius:18px;padding:22px 30px;cursor:pointer;box-shadow:0 12px 30px rgba(0,0,0,.18);font-family:inherit;transition:transform .12s;max-width:90%}
.stx-go:hover{transform:translateY(-2px)}
.stx-go b{font-size:clamp(17px,1.8vw,22px);font-weight:800}
.stx-go small{font-size:13px;color:var(--stx-mu)}
.stx-goi{width:48px;height:48px;border-radius:14px;background:var(--stx-fade);color:var(--stx-b1);display:flex;align-items:center;justify-content:center}
.stx-goi svg{width:26px;height:26px}
.stx-bar{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:0 16px 12px;font-size:13px;color:var(--stx-mu)}
.stx-bar>span:first-child{display:flex;align-items:center;gap:8px;min-width:0}
.stx-dot{width:12px;height:12px;border-radius:50%;border:1px solid rgba(0,0,0,.2);display:inline-block;flex:none}
.stx-oledprev{background:linear-gradient(90deg,#000 0 25%,#2e2e2e 25% 50%,#808080 50% 75%,#bfbfbf 75%)}
/* resolution */
.stx-resbig{justify-content:center;padding:24px}
.stx-resmain{display:flex;flex-direction:column;align-items:center;text-align:center;gap:6px}
.stx-resmain p{margin:0!important}
.stx-lbl{font-size:13px;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--stx-b1)}
.stx-huge{font-size:clamp(40px,6vw,76px);font-weight:850;letter-spacing:-.03em;line-height:1.05;font-variant-numeric:tabular-nums}
.stx-mid{font-size:15px;color:var(--stx-mu);margin:0!important;text-align:center}
.stx-grid4{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;width:100%;max-width:620px;margin:14px 0 10px}
.stx-grid4>div{background:var(--stx-bg);border:1px solid var(--stx-line);border-radius:14px;padding:10px;display:flex;flex-direction:column;gap:2px}
.stx-grid4 span{font-size:12px;color:var(--stx-mu)}.stx-grid4 b{font-size:17px;font-variant-numeric:tabular-nums}
.stx-bars{display:grid;gap:9px}
.stx-barrow{display:grid;grid-template-columns:86px 1fr 84px;gap:8px;align-items:center;font-size:12.5px}
.stx-barrow i{height:10px;border-radius:99px;background:#e7e9f2;position:relative;overflow:hidden;display:block}
.stx-barrow i b{position:absolute;inset:0 auto 0 0;border-radius:99px;background:#a5b4fc}
.stx-barrow.is-you i b{background:var(--stx-b2)}
.stx-barrow.is-you{font-weight:750}
.stx-barrow em{font-style:normal;color:var(--stx-mu);text-align:right;font-variant-numeric:tabular-nums}
/* ghosting */
.stx-gcan{flex:1;width:100%;min-height:0;display:block;border-radius:14px 14px 0 0;background:#808080}
.stx-ghostbig .stx-bar{padding-top:10px}
/* refresh */
.stx-hzbig{align-items:center;justify-content:center;gap:12px;padding:20px}
.stx-ring{position:relative;width:min(300px,52%);aspect-ratio:1}
.stx-ring svg{width:100%;height:100%;transform:rotate(-90deg)}
.stx-rbg{fill:none;stroke:#eef0f6;stroke-width:12}
.stx-rfg{fill:none;stroke:url(#x);stroke:var(--stx-b1);stroke-width:12;stroke-linecap:round;stroke-dasharray:540;stroke-dashoffset:540;transition:stroke-dashoffset .4s}
.stx-rtx{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center}
.stx-rtx b{font-size:clamp(44px,6vw,72px);font-weight:850;line-height:1;font-variant-numeric:tabular-nums}
.stx-rtx span{font-size:15px;color:var(--stx-mu);font-weight:700}
.stx-row{display:flex;gap:10px;flex-wrap:wrap;justify-content:center}
.stx-graph,.stx-motion{width:100%;display:block;border-radius:10px;background:#f7f8fc}
/* home: existing full-check engine inside the big card */
.stx-homebig .screen_tester_tool-wrap{flex:1;min-height:0;overflow:auto;padding:4px 4px 6px}
.stx-homebig .scr{max-width:none!important;margin:0!important}
.stx-homebig .scr .scr-card{border:0!important;box-shadow:none!important;background:transparent!important;padding:8px 12px 12px!important}
.stx-homebig .scr .scr-main{gap:10px}
.stx-homebig .scr .scr-big{order:-1;min-height:64px;font-size:clamp(18px,1.8vw,22px)!important;border-radius:14px;background:var(--stx-tx)!important;border-color:var(--stx-tx)!important;color:#fff!important}
.stx-homebig .scr .scr-tile{background:#fff;border-color:var(--stx-line);min-height:58px}
.stx-homebig .scr .scr-tile:hover{border-color:var(--stx-b1);background:var(--stx-fade)}
.stx-homebig .scr .scr-info{display:none}
.stx-homebig .scr .scr-st{font-size:13px;color:var(--stx-mu)}
/* fullscreen runner */
.stx-run{position:fixed;inset:0;z-index:2147483000;background:#000;cursor:none}
.stx-run[hidden]{display:none}
.stx-run canvas{width:100%;height:100%;display:block}
.stx-run .stx-rh{position:absolute;left:50%;bottom:28px;transform:translateX(-50%);background:rgba(17,24,39,.82);color:#fff;font:600 14px/1.35 system-ui,sans-serif;padding:10px 16px;border-radius:12px;text-align:center;max-width:min(92vw,560px);transition:opacity .4s;pointer-events:none}
.stx-run .stx-rx{position:absolute;top:14px;right:14px;width:44px;height:44px;border-radius:50%;border:0;background:rgba(17,24,39,.6);color:#fff;font-size:26px;line-height:1;cursor:pointer;transition:opacity .4s}
.stx-run.is-idle .stx-rh,.stx-run.is-idle .stx-rx{opacity:0}
.stx-run:not(.is-idle){cursor:default}
/* ---------- content sections: same background, white cards ---------- */
body.stx-site .sl-hero{background:transparent!important}
body.stx-site .sl-section,body.stx-site .sl-alt,body.stx-site .sl-plain{background:transparent!important;padding:44px 20px!important}
body.stx-site .sl-section>*{max-width:1200px}
body.stx-site .sl-section h2.wp-block-heading{font-size:clamp(23px,2.6vw,32px);margin:0 auto 20px!important}
body.stx-site .sl-section p{margin-top:0;margin-bottom:14px}
body.stx-site .sl-cards{gap:var(--stx-gap)!important;margin-bottom:0!important}
body.stx-site .sl-cards>.wp-block-column.sl-card{background:#fff!important;border:1px solid var(--stx-line)!important;border-radius:var(--stx-r)!important;box-shadow:var(--stx-sh)!important;padding:20px!important;flex:1 1 calc(33.333% - 16px)!important}
body.stx-site .sl-card h3,body.stx-site .sl-card p{margin-top:0!important}
body.stx-site .sl-card p:last-child{margin-bottom:0!important}
body.stx-site .sl-step{background:var(--stx-fade)!important;color:var(--stx-b1)!important}
body.stx-site .sl-card[class*="ic-"]::before{content:"";display:block;width:40px;height:40px;border-radius:12px;margin-bottom:12px;background:var(--ib,#eef0ff) var(--iu) center/22px no-repeat}
.ic-pixel{--ib:#eef0ff;--iu:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%234f46e5' stroke-width='2'%3E%3Crect x='4' y='4' width='16' height='16' rx='2'/%3E%3Crect x='10' y='10' width='4' height='4' fill='%234f46e5'/%3E%3C/svg%3E")}
.ic-black{--ib:#eceef3;--iu:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect x='3' y='5' width='18' height='12' rx='2' fill='%23111827'/%3E%3Cpath d='M8 21h8' stroke='%23111827' stroke-width='2'/%3E%3C/svg%3E")}
.ic-white{--ib:#f3f4f6;--iu:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect x='3' y='5' width='18' height='12' rx='2' fill='%23fff' stroke='%2394a3b8' stroke-width='2'/%3E%3Cpath d='M8 21h8' stroke='%2394a3b8' stroke-width='2'/%3E%3C/svg%3E")}
.ic-red{--ib:#fdecec;--iu:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect x='3' y='5' width='18' height='12' rx='2' fill='%23ef4444'/%3E%3Cpath d='M8 21h8' stroke='%23ef4444' stroke-width='2'/%3E%3C/svg%3E")}
.ic-blue{--ib:#e9f1ff;--iu:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect x='3' y='5' width='18' height='12' rx='2' fill='%233b82f6'/%3E%3Cpath d='M8 21h8' stroke='%233b82f6' stroke-width='2'/%3E%3C/svg%3E")}
.ic-bleed{--ib:#fff3e8;--iu:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23f97316' stroke-width='2'%3E%3Crect x='3' y='5' width='18' height='12' rx='2'/%3E%3Cpath d='M3 9l4-4M17 5l4 4'/%3E%3C/svg%3E")}
.ic-oled{--ib:#f3ecff;--iu:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%237c3aed' stroke-width='2'%3E%3Cpath d='M12 3l9 5-9 5-9-5 9-5z'/%3E%3Cpath d='M3 13l9 5 9-5'/%3E%3C/svg%3E")}
.ic-res{--ib:#e8f6fb;--iu:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230e86b8' stroke-width='2'%3E%3Cpath d='M4 9V4h5M20 9V4h-5M4 15v5h5M20 15v5h-5'/%3E%3C/svg%3E")}
.ic-ghost{--ib:#e9f8ef;--iu:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23059669' stroke-width='2'%3E%3Crect x='12' y='8' width='8' height='8' rx='1'/%3E%3Cpath d='M3 10h6M5 14h4'/%3E%3C/svg%3E")}
.ic-hz{--ib:#fdecec;--iu:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23e11d48' stroke-width='2'%3E%3Cpath d='M4 15a8 8 0 1 1 16 0'/%3E%3Cpath d='M12 15l4-5'/%3E%3C/svg%3E")}
.ic-check{--ib:#e9f8ef;--iu:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23059669' stroke-width='2.4'%3E%3Cpath d='M5 12l5 5 9-10'/%3E%3C/svg%3E")}
.ic-tip{--ib:#fff7e0;--iu:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23d97706' stroke-width='2'%3E%3Cpath d='M9 18h6M10 21h4M12 3a6 6 0 0 0-3.5 10.9c.6.5 1 1.2 1 2.1h5c0-.9.4-1.6 1-2.1A6 6 0 0 0 12 3z'/%3E%3C/svg%3E")}
body.stx-site .sl-cards.stx-results>.sl-card{border-left:4px solid var(--bl,#4f46e5)!important}
body.stx-site .stx-results>.sl-card:nth-child(4n+2){--bl:#f97316}body.stx-site .stx-results>.sl-card:nth-child(4n+3){--bl:#10b981}body.stx-site .stx-results>.sl-card:nth-child(4n+4){--bl:#8b5cf6}
body.stx-site .sl-links h3 a{color:var(--stx-tx)!important}
body.stx-site .wp-block-details{background:#fff;border:1px solid var(--stx-line);border-radius:16px;padding:14px 18px;margin:0 auto 10px!important;box-shadow:var(--stx-sh)}
body.stx-site .wp-block-details summary{font-weight:700;cursor:pointer}
body.stx-site .wp-block-details p{margin:10px 0 0!important}
body.stx-site .sl-table table{background:#fff!important}
body.stx-site .site-footer,body.stx-site .site-footer .site-footer-row-container-inner{background:#fff!important;border-top:1px solid var(--stx-line)}
body.stx-site .site-footer a{color:var(--stx-mu)!important}
/* ---------- tablet / phone ---------- */
@media (max-width:1100px){.stx-bento{grid-template-columns:minmax(0,1.35fr) minmax(0,1fr)}.stx-sws{grid-template-columns:repeat(5,1fr)}}
@media (max-width:900px){
 .stx-bento{grid-template-columns:1fr;height:auto}
 .stx-big{height:calc(100svh - var(--stx-hh) - var(--stx-th,60px) - 16px);min-height:380px;max-height:820px}
 .stx-side{overflow:visible;grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}
 .stx-hero{min-height:0;padding-bottom:8px!important}
 .stx-hero .stx-sub{display:none}
}
@media (max-width:600px){
 body.stx-site #masthead{padding:8px 10px 0}
 .stx-hero{padding:10px 10px 0!important}
 .stx-hero h1.stx-h1{font-size:20px;margin:0 4px 8px!important}
 .stx-hero h1 .stx-hx{display:none}
 .stx-side{grid-template-columns:1fr}
 .stx-go{padding:18px 20px}
 .stx-hidem{display:none}
 .stx-grid4{grid-template-columns:1fr 1fr}
 .stx-huge{font-size:44px}
 .stx-crow{grid-template-columns:44px 1fr}
 .stx-crow .stx-cgo{grid-column:1/3}
 .stx-homebig .scr .scr-tiles{grid-template-columns:repeat(3,1fr);gap:6px}
 .stx-homebig .scr .scr-tile{grid-template-columns:1fr;justify-items:center;text-align:center;padding:8px 4px;min-height:74px}
 .stx-homebig .scr .scr-tile .scr-sw{grid-row:auto;width:26px;height:26px;margin-bottom:4px}
 .stx-homebig .scr .scr-tile b{grid-column:1;font-size:12.5px}
 .stx-homebig .scr .scr-tile span{display:none}
 .stx-homebig>.stx-cardhead{display:none}
 .stx-ring{width:min(240px,70%)}
 body.stx-site .sl-section,body.stx-site .sl-alt,body.stx-site .sl-plain{padding:32px 14px!important}
 body.stx-site .sl-cards>.wp-block-column.sl-card{flex-basis:100%!important}
}
@media (max-width:900px){.stx-hzbig .stx-ring{width:min(240px,60%)}}
@media (prefers-reduced-motion:reduce){.stx-sw,.stx-go{transition:none}}
/* v2.0.1 compact right column */
.stx-info .stx-kvs{grid-template-columns:1fr 1fr;column-gap:14px;gap:4px 14px}
.stx-kv{padding:4px 0;font-size:13px}
.stx-sw{aspect-ratio:2}
.stx-card.stx-sm{padding:14px 16px}
.stx-side .stx-cardhead{margin-bottom:8px}
.stx-side .stx-ico{width:30px;height:30px;border-radius:10px}
.stx-side .stx-ico svg{width:17px;height:17px}
@media (min-width:901px) and (max-height:760px){.stx-keys .stx-tiny{display:none}.stx-side .stx-cs{display:none}.stx-sw{aspect-ratio:2.4}}
@media (max-width:600px){.stx-homebig .screen_tester_tool-wrap{display:flex;flex-direction:column}.stx-homebig .scr{flex:1;display:flex}.stx-homebig .scr .scr-main{flex:1;justify-content:space-evenly}}
.stx-btn,.stx-chip{font:inherit;font-size:14px;font-weight:650;line-height:1}
.stx-chip{font-size:13px}
.stx-t-refresh .stx-side{display:flex;flex-direction:column}
.stx-t-refresh .stx-side>.stx-card:not(:first-child){flex:1 1 0;display:flex;flex-direction:column;min-height:120px}
.stx-t-refresh .stx-side canvas{flex:1 1 0;height:0;min-height:50px}
.stx-t-refresh .stx-side .stx-cs{display:none}
@media (max-width:900px){.stx-t-refresh .stx-side>.stx-card:not(:first-child){min-height:170px}}

/* ===== v2.1.0 ===== */
/* Header: own full-width bar (theme header hidden) */
body.stx-site #masthead{display:none!important}
.stx-hdr{position:sticky;top:0;z-index:1000;background:#fff;border-bottom:1px solid var(--stx-line);transition:box-shadow .2s}
body.admin-bar .stx-hdr{top:32px}
.stx-hdr.is-stuck{box-shadow:0 6px 20px rgba(16,24,40,.08)}
.stx-hin{max-width:1240px;margin:0 auto;padding:0 20px;height:60px;display:flex;align-items:center;gap:18px}
.stx-logo{display:flex;align-items:center;gap:10px;text-decoration:none!important;color:var(--stx-tx)!important;font:700 18px/1 var(--stx-hf);flex:none}
.stx-logo b{color:var(--stx-b1);font-weight:700}
.stx-mark{width:30px;height:30px;border-radius:8px;background:#141a24;position:relative;flex:none}
.stx-mark::before{content:"";position:absolute;inset:6px 6px 9px;border-radius:3px;background:linear-gradient(135deg,#6366f1,#f97316)}
.stx-mark::after{content:"";position:absolute;left:11px;right:11px;bottom:4px;height:2px;border-radius:2px;background:#fff}
.stx-nav{display:flex;align-items:center;gap:2px;margin-left:auto}
.stx-nl,.stx-ddb{position:relative;display:inline-flex;align-items:center;gap:8px;height:40px;padding:0 11px;border-radius:10px;font:600 14.5px/1 var(--stx-hf);color:#1f2633!important;text-decoration:none!important;background:transparent;border:0;cursor:pointer;white-space:nowrap}
.stx-nl::after{content:"";position:absolute;left:11px;right:11px;bottom:3px;height:2px;border-radius:2px;background:var(--stx-b1);transform:scaleX(0);transform-origin:left;transition:transform .2s}
.stx-nl:hover,.stx-nl:focus-visible,.stx-ddb:hover,.stx-ddb:focus-visible,.stx-hdr.d-open .stx-ddb{background:#eef0ff!important;color:#312e81!important}
.stx-nl:hover::after,.stx-nl.is-cur::after{transform:scaleX(1)}
.stx-nl.is-cur{color:#312e81!important}
.stx-ddb svg{transition:transform .2s}.stx-hdr.d-open .stx-ddb svg{transform:rotate(180deg)}
.stx-ni{width:24px;height:24px;border-radius:7px;flex:none;background:var(--ib,#eef0ff) var(--iu) center/15px no-repeat;display:inline-block}
.stx-dd{position:relative}
.stx-mega{position:absolute;right:0;top:calc(100% + 10px);width:min(760px,92vw);background:#fff;border:1px solid var(--stx-line);border-radius:16px;box-shadow:0 24px 50px rgba(16,24,40,.16);padding:16px;display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.stx-mega[hidden]{display:none}
.stx-mega::before{content:"";position:absolute;left:0;right:0;top:-12px;height:12px}
.stx-mgh{margin:2px 10px 6px!important;font:700 11.5px/1.2 var(--stx-hf);text-transform:uppercase;letter-spacing:.06em;color:#4b5563}
.stx-mi{display:flex;align-items:center;gap:10px;padding:9px 10px;border-radius:10px;text-decoration:none!important;color:#141a24!important}
.stx-mi .stx-ni{width:32px;height:32px;border-radius:9px;background-size:18px}
.stx-mi b{display:block;font:600 14px/1.25 var(--stx-hf);color:#141a24}
.stx-mi small{display:block;font-size:12.5px;line-height:1.3;color:#4b5563}
.stx-mi:hover,.stx-mi:focus-visible,.stx-mi.is-cur{background:#eef0ff}
.stx-mi:hover b,.stx-mi:focus-visible b,.stx-mi.is-cur b{color:#312e81}
.stx-mi:hover small{color:#374151}
.stx-cta{flex:none;display:inline-flex;align-items:center;height:40px;padding:0 16px;border-radius:10px;background:#4f46e5;color:#fff!important;font:600 14px/1 var(--stx-hf);text-decoration:none!important;transition:background .15s}
.stx-cta:hover,.stx-cta:focus-visible{background:#3730a3;color:#fff!important}
.stx-burger{display:none;margin-left:auto;width:42px;height:42px;border:1px solid var(--stx-line)!important;border-radius:10px;background:#fff!important;padding:0 10px;flex-direction:column;justify-content:center;gap:4px;cursor:pointer}
.stx-burger span{display:block;height:2px;border-radius:2px;background:#141a24;transition:transform .2s,opacity .2s}
.stx-hdr.m-open .stx-burger span:nth-child(1){transform:translateY(6px) rotate(45deg)}.stx-hdr.m-open .stx-burger span:nth-child(2){opacity:0}.stx-hdr.m-open .stx-burger span:nth-child(3){transform:translateY(-6px) rotate(-45deg)}
.stx-burger:hover{background:#eef0ff!important}
.stx-mnav{border-top:1px solid var(--stx-line);background:#fff;padding:10px 14px 16px;max-height:calc(100svh - 60px);overflow:auto}
.stx-mnav[hidden]{display:none}
.stx-mnav .stx-mg{margin-top:8px}
.stx-mhome{background:#f6f7fb}
.ic-touch{--ib:#e8f6fb;--iu:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230e86b8' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 11V5a1.5 1.5 0 0 1 3 0v5M12 10V4a1.5 1.5 0 0 1 3 0v6M15 10V6a1.5 1.5 0 0 1 3 0v8a6 6 0 0 1-6 6h-1a6 6 0 0 1-5-2.7L3.5 14a1.5 1.5 0 0 1 2.4-1.8L9 15'/%3E%3C/svg%3E")}
@media (max-width:1180px){.stx-nl .stx-ni{display:none}.stx-nl{padding:0 9px}}
@media (max-width:1023px){.stx-nav,.stx-cta{display:none}.stx-burger{display:flex}.stx-hin{height:56px;padding:0 14px}}
/* Headings: plain common sans-serif */
:root{--stx-hf:Inter,system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif}
body.stx-site h1,body.stx-site h2,body.stx-site h3,body.stx-site h4,body.stx-site .stx-ct,body.stx-site .wp-block-details summary{font-family:var(--stx-hf)!important;letter-spacing:normal!important;font-weight:700!important}
/* Strong contrast on every hover / focus / active */
.stx-btn{transition:background .15s,color .15s,border-color .15s}
.stx-pri,.stx-pri:visited{background:#141a24!important;color:#fff!important;border-color:#141a24!important}
.stx-pri:hover,.stx-pri:focus-visible,.stx-pri:active{background:#2f3a4f!important;color:#fff!important}
.stx-ghost,.stx-ghost:visited{background:#fff!important;color:#141a24!important;border:1px solid #c9cfda!important}
.stx-ghost:hover,.stx-ghost:focus-visible,.stx-ghost:active{background:#eef0ff!important;color:#312e81!important;border-color:#4f46e5!important}
.stx-btn:disabled,.stx-btn[aria-disabled=true]{background:#e5e7eb!important;color:#374151!important;border-color:#d1d5db!important;opacity:1!important;cursor:not-allowed}
.stx-chip,.stx-chip:visited{color:#141a24!important;background:#fff!important}
.stx-chip:hover,.stx-chip:focus-visible{background:#eef0ff!important;color:#312e81!important;border-color:#4f46e5!important}
.stx-chip[aria-pressed=true]{background:#141a24!important;color:#fff!important;border-color:#141a24!important}
.stx-go,.stx-go:hover,.stx-go:focus-visible,.stx-go:active{background:#fff!important;color:#141a24!important}
.stx-go:hover{box-shadow:0 0 0 3px #4f46e5,0 12px 30px rgba(0,0,0,.2)}
.stx-go b{color:#141a24!important}.stx-go small{color:#4b5563!important}
body.stx-site .stx-homebig .scr button:hover,body.stx-site .stx-homebig .scr .scr-tile:hover{color:#141a24!important}
body.stx-site .stx-homebig .scr .scr-tile:hover b{color:#312e81!important}
body.stx-site .sl-links h3 a:hover,body.stx-site .sl-links h3 a:focus-visible{color:#312e81!important;text-decoration:underline}
body.stx-site .sl-card:hover{border-color:#c7cbf5}
body.stx-site .site-footer a{color:#4b5563!important}
body.stx-site .site-footer a:hover,body.stx-site .site-footer a:focus-visible{color:#312e81!important;text-decoration:underline}
body.stx-site .entry-content a:not(.stx-btn):hover{color:#312e81}
body.stx-site .wp-block-details summary:hover{color:#312e81}
/* Black pilot: in-hero swatches */
.stx-hsw{display:flex;gap:8px;padding:0 12px 10px;flex-wrap:nowrap}
.stx-hs{flex:1;height:34px;min-width:0;border-radius:9px;border:1px solid #c9cfda;padding:0;cursor:pointer;transition:transform .12s}
.stx-hs:hover{transform:translateY(-2px);box-shadow:0 0 0 2px #4f46e5}
.stx-hs[aria-pressed=true]{box-shadow:0 0 0 2px #fff,0 0 0 4px #4f46e5}
.stx-hs:focus-visible{outline:3px solid #f97316;outline-offset:2px}
@media (max-width:600px){
 .stx-t-black .stx-big{height:auto!important;min-height:0!important;max-height:none!important}
 .stx-t-black .stx-prev{flex:none;height:clamp(200px,30svh,280px);margin:10px}
 .stx-t-black .stx-go{padding:12px 18px}
 .stx-t-black .stx-go small{display:none}
 .stx-hs{height:38px}
 .stx-hsw{gap:6px;padding:0 10px 8px}
 .stx-t-black .stx-bar{padding:0 12px 10px}
}
/* Touch test */
.stx-touchbig{padding:0}
.stx-tpad{position:relative;flex:1;margin:12px;border-radius:14px;border:1px dashed #b8bfcc;background:#fbfbfe;overflow:hidden;min-height:0}
.stx-tcan{position:absolute;inset:0;width:100%;height:100%;touch-action:none;cursor:crosshair;display:block}
.stx-thint{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;text-align:center;pointer-events:none;color:#141a24;padding:16px}
.stx-thint[hidden]{display:none}
.stx-thint small{color:#4b5563}
.stx-thint .stx-goi{width:46px;height:46px;border-radius:14px;background:#e8f6fb;color:#0e86b8;display:inline-flex;align-items:center;justify-content:center}
.stx-touchbig .stx-bar b{color:#141a24}
/* v2.1.1: black pilot colour row is mobile-only; desktop/iPad keep the 2.0.2 hero */
@media (min-width:601px){.stx-hsw{display:none}}
@media (min-width:901px){.stx-bento{height:clamp(440px,calc(100svh - var(--stx-hh) - var(--stx-th,78px) - 13px),720px)}}
/* v2.2.0 */
.stx-side{grid-auto-rows:auto!important}
.stx-side>.stx-card{overflow:visible}
.stx-ovf{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:var(--stx-gap);margin-top:var(--stx-gap);text-align:left;color:var(--stx-tx)}
.stx-ovf>.stx-card{flex:none!important}
.stx-ul{margin:0!important;padding-left:18px!important}.stx-ul li{margin:0 0 4px!important;font-size:13px;line-height:1.4}
/* brand + header hover contrast */
.stx-logo,.stx-logo:hover,.stx-logo:focus-visible,.stx-logo:active{color:#141a24!important;text-decoration:none!important}
.stx-logo span,.stx-logo:hover span{color:#141a24!important}
.stx-logo b,.stx-logo:hover b{color:#4f46e5!important}
.stx-logo:hover .stx-mark{box-shadow:0 0 0 3px #e0e3ff}
.stx-logo:focus-visible{outline:3px solid #4f46e5;outline-offset:3px;border-radius:8px}
.stx-burger span{background:#141a24!important}
/* home: start button keeps white text on hover */
body.stx-site .stx-homebig .scr .scr-big,body.stx-site .stx-homebig .scr .scr-big:hover,body.stx-site .stx-homebig .scr .scr-big:focus-visible{color:#141a24!important}
/* home desktop/iPad: same system as test pages (preview panel + start card) */
@media (min-width:601px){
 .stx-homebig .screen_tester_tool-wrap{display:flex;flex-direction:column;overflow:hidden;padding:0}
 .stx-homebig .scr{flex:1;display:flex;flex-direction:column;min-height:0}
 .stx-homebig .scr .scr-main{flex:1;display:flex;flex-direction:column;min-height:0;padding:0 12px 12px!important}
 body.stx-site .stx-homebig .scr .scr-big{flex:1 1 auto;min-height:120px;position:relative;isolation:isolate;border-radius:14px!important;border:1px solid var(--stx-line)!important;font-size:18px!important;font-weight:700;background:linear-gradient(90deg,#c0c0c0 0 14.28%,#c0c000 0 28.56%,#00c0c0 0 42.84%,#00c000 0 57.12%,#c000c0 0 71.4%,#c00000 0 85.68%,#0000c0 0)!important;box-shadow:none!important;transition:none}
 body.stx-site .stx-homebig .scr .scr-big::after{content:"";position:absolute;left:50%;top:50%;width:min(320px,80%);height:72px;transform:translate(-50%,-50%);background:#fff;border-radius:18px;box-shadow:0 12px 30px rgba(0,0,0,.22);z-index:-1;transition:box-shadow .12s}
 body.stx-site .stx-homebig .scr .scr-big:hover::after{box-shadow:0 0 0 3px #4f46e5,0 12px 30px rgba(0,0,0,.22)}
 .stx-homebig .scr .scr-tiles{gap:8px}
 .stx-homebig .scr .scr-tile{background:#f6f7fb!important;border:1px solid transparent!important;border-radius:12px!important;min-height:54px}
 .stx-homebig .scr .scr-tile:hover{background:#eef0ff!important;border-color:#4f46e5!important}
 .stx-homebig .scr .scr-st{margin:0!important;font-size:12.5px}
}
@media (min-width:901px){.stx-bento{height:clamp(340px,calc(100svh - var(--stx-hh) - var(--stx-th,78px) - 13px),720px)}}
@media (min-width:901px) and (max-height:640px){.stx-hero .stx-sub{display:none}.stx-hero h1.stx-h1{margin-bottom:10px!important}.stx-hero{padding-top:10px!important}}
@media (min-width:601px){.stx-homebig .screen_tester_tool-wrap{overflow:auto}}
@media (min-width:601px) and (max-height:700px){.stx-homebig .scr .scr-st{display:none}.stx-homebig .scr .scr-tile{min-height:46px}.stx-homebig .scr .scr-big{min-height:90px}}
/* v2.3.0 */
.stx-side>.stx-card{min-height:max-content!important}
.stx-side{grid-auto-rows:max-content!important}
@media (min-width:901px) and (max-height:640px){body.home .stx-hero .stx-sub{display:block}}
/* home phone: clear start panel, compact grid, Your screen visible */
@media (max-width:600px){
 .stx-homebig{height:auto!important;min-height:0!important;max-height:none!important}
 .stx-homebig .screen_tester_tool-wrap,.stx-homebig .scr{display:block!important;flex:none!important}
 .stx-homebig .scr .scr-main{display:flex!important;flex-direction:column;gap:8px!important;padding:10px!important}
 body.stx-site .stx-homebig .scr .scr-big{order:-1;position:relative;isolation:isolate;min-height:104px;border-radius:14px!important;border:1px solid var(--stx-line)!important;font-size:16px!important;font-weight:700;color:#141a24!important;background:linear-gradient(90deg,#c0c0c0 0 14.28%,#c0c000 0 28.56%,#00c0c0 0 42.84%,#00c000 0 57.12%,#c000c0 0 71.4%,#c00000 0 85.68%,#0000c0 0)!important;box-shadow:none!important}
 body.stx-site .stx-homebig .scr .scr-big::after{content:"";position:absolute;left:50%;top:50%;width:min(250px,82%);height:54px;transform:translate(-50%,-50%);background:#fff;border-radius:14px;box-shadow:0 8px 20px rgba(0,0,0,.22);z-index:-1}
 .stx-homebig .scr .scr-tile{min-height:58px!important;padding:6px 4px!important}
 .stx-homebig .scr .scr-advwrap{margin-top:0!important}
}
.stx-homebig .scr .scr-st.stx-hide{display:none!important}
@media (min-width:601px) and (max-height:640px){.stx-homebig .scr .scr-big{min-height:64px!important}.stx-homebig .scr .scr-tile{min-height:42px!important;padding-top:4px!important;padding-bottom:4px!important}.stx-homebig .scr .scr-tiles{gap:6px!important}.stx-homebig>.stx-cardhead{padding-top:10px}}
/* ===== v2.4.0 home: calm white tool card + Choose a test card + drawer ===== */
.stx-home2 .stx-hprev{background:#fff;border:1px solid #e4e7ee;box-shadow:inset 0 0 0 1px #f1f3f7}
.stx-home2 .stx-go{box-shadow:0 10px 28px rgba(16,24,40,.12)}
.stx-tests .screen_tester_tool-wrap{margin:0}
.stx-tests .scr{max-width:none!important;margin:0!important;color:var(--stx-tx)}
.stx-tests .scr .scr-card{border:0!important;box-shadow:none!important;background:transparent!important;padding:0!important;gap:8px!important}
.stx-tests .scr .scr-tiles{grid-template-columns:repeat(3,1fr)!important;gap:6px!important}
.stx-tests .scr .scr-tile{grid-template-columns:1fr!important;grid-template-rows:auto auto!important;justify-items:center;text-align:center;row-gap:4px;min-height:0!important;padding:8px 4px!important;background:#f6f7fb!important;border:1px solid transparent!important;border-radius:12px!important}
.stx-tests .scr .scr-tile:hover{background:#eef0ff!important;border-color:#4f46e5!important}
.stx-tests .scr .scr-tile b{grid-column:1!important;font-size:12.5px!important;color:#141a24!important}
.stx-tests .scr .scr-tile span{display:none!important}
.stx-tests .scr .scr-sw{grid-row:auto!important;width:26px!important;height:26px!important}
.stx-tests .scr #scr-go,.stx-tests .scr .scr-info{display:none!important}
.stx-tests .scr .scr-st{font-size:12.5px;color:var(--stx-mu);margin:0!important;text-align:left}
.stx-tests .scr .scr-st.stx-hide{display:none!important}
.stx-tests .scr .scr-advbtn{min-height:40px;padding:6px 12px;border-style:solid;border-color:#e4e7ee;background:#fff}
.stx-tests .scr .scr-advbtn small{display:none}
.stx-tests .scr .scr-advbtn b{font-size:13.5px}
.stx-tests .scr .scr-advbtn .scr-chev{transform:rotate(-45deg)!important;margin:0 6px 0 0!important}
.stx-tests .scr .scr-advbtn:hover{background:#eef0ff;border-color:#4f46e5}
.stx-tests .scr .scr-warn p{font-size:12.5px}
@media (min-width:901px) and (max-height:760px){.stx-tests .scr .scr-tile{padding:6px 4px!important}.stx-tests .scr .scr-sw{width:22px!important;height:22px!important}}
html.stx-drlock{overflow:hidden}
.stx-drw{position:fixed;inset:0;z-index:100000}
.stx-drw[hidden]{display:none}
.stx-drbg{position:absolute;inset:0;background:rgba(15,20,30,.38);opacity:0;transition:opacity .2s}
.stx-drp{position:absolute;top:0;right:0;bottom:0;width:min(420px,92vw);max-width:none!important;margin:0!important;background:#fff;box-shadow:-12px 0 40px rgba(16,24,40,.18);display:flex;flex-direction:column;transform:translateX(100%);transition:transform .24s ease;outline:0;text-align:left;color:#141a24}
.stx-drw.is-open .stx-drbg{opacity:1}.stx-drw.is-open .stx-drp{transform:none}
.stx-drh{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:16px 18px;border-bottom:1px solid #e4e7ee}
.stx-drh p{margin:0!important;font-weight:800;font-size:17px}
.stx-drx{width:44px;height:44px;border-radius:12px;border:1px solid #e4e7ee;background:#fff;color:#141a24;display:flex;align-items:center;justify-content:center;cursor:pointer;padding:0}
.stx-drx:hover{background:#eef0ff;border-color:#4f46e5;color:#141a24}
.stx-drb{flex:1;overflow:auto;padding:16px 18px calc(18px + env(safe-area-inset-bottom))}
.stx-drb .scr-ag{grid-template-columns:1fr!important}
.stx-drb .scr-chip{background:#f6f7fb;border-color:#e4e7ee;color:#141a24}
.stx-drb .scr-chip:hover{border-color:#4f46e5;color:#141a24}
.stx-drb .scr-chip[aria-checked="true"]{background:#4f46e5;border-color:#4f46e5;color:#fff}
.stx-drb .scr-lbl{display:block;margin:6px 0 4px;color:#5d6676}
@media (max-width:640px){
 .stx-drp{top:auto;left:0;width:auto;max-height:82vh;border-radius:20px 20px 0 0;transform:translateY(100%);box-shadow:0 -12px 40px rgba(16,24,40,.2)}
 .stx-drh::before{content:"";position:absolute;left:50%;top:6px;width:40px;height:4px;border-radius:4px;background:#d6dae3;transform:translateX(-50%)}
 .stx-drh{position:relative;padding-top:18px}
}
@media (prefers-reduced-motion:reduce){.stx-drp,.stx-drbg{transition:none}}
/* home phones: white start card, compact grid next, Your screen in first screen */
@media (max-width:900px){
 .stx-home2{height:auto!important;min-height:0!important;max-height:none!important}
 .stx-home2 .stx-hprev{flex:none;min-height:150px}
 .stx-t-home .stx-side>.stx-tests{order:-2}.stx-t-home .stx-side>.stx-info{order:-1}
}
@media (max-width:600px){
 .stx-home2>.stx-cardhead{display:none}
 .stx-home2 .stx-hprev{min-height:0;padding:14px 0;margin:10px}
 .stx-home2 .stx-go{padding:12px 18px;flex-direction:row;gap:12px}
 .stx-home2 .stx-go small{display:none}
 .stx-home2 .stx-goi{width:40px;height:40px}
 .stx-home2 .stx-bar{padding:0 12px 10px}
 .stx-t-home .stx-tests{padding:12px!important}
 .stx-t-home .stx-tests .stx-cardhead{margin-bottom:6px}
}
/* ===== v2.4.0 fullscreen colour bar ===== */
.stx-run .stx-rx,.scr-run .scr-rx{display:none!important}
.stx-fb{position:absolute;left:50%;bottom:calc(18px + env(safe-area-inset-bottom));transform:translateX(-50%);display:flex;align-items:center;gap:12px;max-width:calc(100vw - 24px);padding:8px 8px 8px 12px;border-radius:18px;background:rgba(17,20,28,.78);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);color:#fff;font:500 14px/1.2 Inter,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;box-shadow:0 10px 30px rgba(0,0,0,.35);border:1px solid rgba(255,255,255,.12);transition:opacity .35s,transform .35s;z-index:5;cursor:default;touch-action:manipulation;text-align:left}
.stx-fcnt{position:absolute;left:calc(14px + env(safe-area-inset-left));top:calc(14px + env(safe-area-inset-top));padding:6px 12px;border-radius:999px;background:rgba(17,20,28,.72);color:#fff;font:700 13px/1.2 Inter,system-ui,sans-serif;font-variant-numeric:tabular-nums;border:1px solid rgba(255,255,255,.12);transition:opacity .35s;z-index:5;pointer-events:none}
.stx-fb-off .stx-fb,.stx-fb-off .stx-fcnt{opacity:0;pointer-events:none}
.stx-fb-off .stx-fb{transform:translate(-50%,8px)}
.stx-fb-off{cursor:none}
.stx-fbc{display:flex;align-items:center;gap:10px;min-width:0;flex:0 1 auto}
.stx-fbsw{width:30px;height:30px;border-radius:9px;border:2px solid rgba(255,255,255,.85);flex:none;display:block}
.stx-fbt{display:flex;flex-direction:column;min-width:0;white-space:nowrap}
.stx-fbt b{font-weight:700;font-size:14px;overflow:hidden;text-overflow:ellipsis;max-width:180px}
.stx-fbt small{font-size:12px;opacity:.72;font-variant-numeric:tabular-nums}
.stx-fbn{display:flex;align-items:center;gap:6px;min-width:0}
.stx-fbb,.stx-fbx{height:40px;border-radius:12px;border:0;background:rgba(255,255,255,.12);color:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;padding:0;font:700 14px Inter,system-ui,sans-serif;flex:none}
.stx-fbb{width:40px}.stx-fbx{padding:0 16px;background:#fff;color:#111}
.stx-fbb:hover{background:rgba(255,255,255,.24)}.stx-fbx:hover{background:#e8eaf0}
.stx-fbb:disabled{opacity:.35;cursor:default}
.stx-fbb:focus-visible,.stx-fbx:focus-visible,.stx-fbdot:focus-visible{outline:2px solid #fff;outline-offset:2px}
.stx-fbd{display:flex;align-items:center;gap:6px;overflow-x:auto;scrollbar-width:none;padding:4px;max-width:min(520px,50vw)}
.stx-fbd::-webkit-scrollbar{display:none}
.stx-fbdot{width:20px;height:20px;border-radius:50%;border:1px solid rgba(255,255,255,.45);padding:0;cursor:pointer;flex:none;transition:transform .12s}
.stx-fbdot:hover{transform:scale(1.15)}
.stx-fbdot.is-cur{box-shadow:0 0 0 2px rgba(17,20,28,.9),0 0 0 4px #fff}
.stx-fb.is-one .stx-fbn{display:none}
.stx-run .stx-rh,.scr-run .scr-rh{bottom:calc(86px + env(safe-area-inset-bottom))!important}
@media (max-width:640px){
 .stx-fb{flex-wrap:wrap;width:calc(100vw - 20px);gap:8px 10px;padding:10px;bottom:calc(10px + env(safe-area-inset-bottom))}
 .stx-fbc{flex:1 1 auto}
 .stx-fbx{height:44px}
 .stx-fbn{order:3;flex:1 1 100%;gap:8px}
 .stx-fbb{width:44px;height:44px}
 .stx-fbd{flex:1;max-width:none;gap:10px;padding:6px 4px}
 .stx-fbdot{width:28px;height:28px}
 .stx-run .stx-rh,.scr-run .scr-rh{bottom:calc(140px + env(safe-area-inset-bottom))!important;font-size:13px}
}
@media (max-width:640px){.stx-fbdot:first-child{margin-left:auto}.stx-fbdot:last-child{margin-right:auto}}
/* v2.4.0: intro line lives inside the Start button now */
body.stx-site .stx-hero .stx-sub{display:none!important}
.stx-go small{max-width:300px;line-height:1.35;text-align:center;font-size:13px}
@media (max-width:600px){.stx-go small,.stx-t-black .stx-go small,.stx-home2 .stx-go small{display:block!important;font-size:12px}.stx-home2 .stx-go{flex-direction:column;gap:6px}.stx-home2 .stx-goi{display:none}}
body.stx-site .stx-drb .scr-chip[aria-checked="true"]{background:#4f46e5!important;border-color:#4f46e5!important;color:#fff!important}
body.stx-site .stx-drb .scr-tg input{accent-color:#4f46e5}
body.stx-site .stx-drx,body.stx-site .stx-drx:focus{background:#fff!important;color:#141a24!important;border:1px solid #e4e7ee!important}
body.stx-site .stx-drx:hover,body.stx-site .stx-drx:focus-visible{background:#eef0ff!important;border-color:#4f46e5!important}
body.stx-site .stx-fbb,body.stx-site .stx-fbb:focus{background:rgba(255,255,255,.12)!important;color:#fff!important}
body.stx-site .stx-fbb:hover{background:rgba(255,255,255,.24)!important}
body.stx-site .stx-fbx,body.stx-site .stx-fbx:focus{background:#fff!important;color:#111!important}
/* ===== v2.5.0 one phone layout on every page ===== */
.stx-hero h1 .stx-hm{display:none}
@media (min-width:601px){.stx-side>.stx-mo{display:none!important}}
@media (max-width:600px){
 .stx-hero{padding:6px 10px 0!important}
 .stx-hero h1.stx-h1{font-size:19px!important;line-height:1.25;margin:0 2px 8px!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
 .stx-hero h1 .stx-hm{display:inline}
 .stx-hero .stx-sub{display:none!important}
 .stx-bento{gap:10px}
 .stx-side{gap:10px}
 .stx-big.stx-colorbig:not(.stx-pilot),.stx-big.stx-oledbig,.stx-big.stx-home2,.stx-big.stx-ghostbig,.stx-big.stx-touchbig{height:clamp(300px,44svh,400px)!important;min-height:0!important;max-height:none!important}
 .stx-big.stx-colorbig:not(.stx-pilot) .stx-prev,.stx-big.stx-oledbig .stx-prev,.stx-home2 .stx-hprev{flex:1 1 auto!important;min-height:0!important;margin:10px!important;padding:0!important}
 .stx-big>.stx-cardhead{display:none}
 .stx-big.stx-resbig,.stx-big.stx-hzbig{height:auto!important;min-height:0!important;max-height:none!important}
 .stx-go small{display:block!important}
 .stx-side>.stx-dark{order:-3!important}
 .stx-side>.stx-info{order:-2!important}
 .stx-t-home .stx-side>.stx-tests{order:-1!important}
 .stx-dark .stx-cs{display:none}
 .stx-dark .stx-cardhead{margin-bottom:8px}
 .stx-dark .stx-sws{gap:6px}
 .stx-dark .stx-sw{aspect-ratio:1.8}
}
/* ===== v2.6.0 ===== */
.ic-fix{--ib:#fff1e6;--iu:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect x='4' y='4' width='7' height='7' fill='%23f97316'/%3E%3Crect x='13' y='13' width='7' height='7' fill='%234f46e5'/%3E%3Cpath d='M15 4h5v5M9 20H4v-5' stroke='%23f97316' stroke-width='2' fill='none'/%3E%3C/svg%3E")}
.ic-uni{--ib:#eef2f7;--iu:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect x='3' y='5' width='18' height='14' rx='2' fill='%2394a3b8'/%3E%3Crect x='6' y='8' width='12' height='8' rx='1' fill='%23cbd5e1'/%3E%3C/svg%3E")}
.ic-grad{--ib:#f3e8ff;--iu:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cdefs%3E%3ClinearGradient id='g'%3E%3Cstop offset='0' stop-color='%23111827'/%3E%3Cstop offset='1' stop-color='%23a855f7' stop-opacity='.15'/%3E%3C/linearGradient%3E%3C/defs%3E%3Crect x='3' y='6' width='18' height='12' rx='2' fill='url(%23g)'/%3E%3C/svg%3E")}
.ic-lv{--ib:#e7ecf3;--iu:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='12' r='8' fill='%23fff' stroke='%23111827' stroke-width='2'/%3E%3Cpath d='M12 4a8 8 0 0 1 0 16z' fill='%23111827'/%3E%3C/svg%3E")}
.ic-sharp{--ib:#e0f2fe;--iu:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4 4h4v4H4zM12 4h4v4h-4zM8 8h4v4H8zM16 8h4v4h-4zM4 12h4v4H4zM12 12h4v4h-4zM8 16h4v4H8zM16 16h4v4h-4z' fill='%230284c7'/%3E%3C/svg%3E")}
/* go button: desktop label / phone label */
.stx-go .stx-lm,.stx-go .stx-goim{display:none!important}
.stx-prev.stx-tap{cursor:pointer}
/* desktop home: right column = tool height, three compact cards */
@media (min-width:901px){
 .stx-t-home .stx-side{display:flex!important;flex-direction:column;gap:10px!important;grid-template-rows:none!important}
 .stx-t-home .stx-side>.stx-card{padding:10px 14px!important;flex:0 0 auto}
 .stx-t-home .stx-side .stx-cardhead{margin-bottom:6px!important}
 .stx-t-home .stx-side .stx-cs{display:none!important}
 .stx-t-home .stx-side>.stx-tests{flex:1 1 auto;display:flex;flex-direction:column;min-height:0}
 .stx-t-home .stx-tests .screen_tester_tool-wrap,.stx-t-home .stx-tests .scr,.stx-t-home .stx-tests .scr-card{flex:1 1 auto;display:flex!important;flex-direction:column;min-height:0}
 .stx-t-home .stx-tests .scr .scr-tiles{flex:1 1 auto;grid-auto-rows:1fr}
 .stx-t-home .stx-tests .scr .scr-tile{padding:5px 4px!important;row-gap:2px}
 .stx-t-home .stx-tests .scr .scr-sw{width:20px!important;height:20px!important}
 .stx-t-home .stx-tests .scr .scr-tile b{font-size:12px!important;line-height:1.2}
 .stx-t-home .stx-tests .scr .scr-advbtn{min-height:32px;padding:4px 10px}
 .stx-t-home .stx-dark .stx-sws{gap:5px!important}
 .stx-t-home .stx-dark .stx-sw{aspect-ratio:2.4!important}
 .stx-t-home .stx-info .stx-kv{row-gap:2px!important}
}
@media (max-width:600px){
 .stx-go .stx-ld,.stx-go .stx-goi:not(.stx-goim){display:none!important}
 .stx-go .stx-lm{display:inline!important}
 .stx-go .stx-goim{display:grid!important;place-items:center;width:44px;height:44px;border-radius:10px;background:rgba(255,255,255,.6);margin:0 auto 10px}
 .stx-big.stx-colorbig:not(.stx-pilot),.stx-big.stx-oledbig,.stx-big.stx-home2{height:clamp(340px,52svh,470px)!important}
 .stx-prev.stx-tap{display:flex!important;align-items:center;justify-content:center}
 .stx-prev.stx-tap .stx-go{display:flex!important;flex-direction:column;align-items:center;justify-content:center;text-align:center;width:calc(100% - 28px)!important;max-width:none!important;min-height:44%;background:rgba(229,231,235,.92)!important;border:0!important;box-shadow:none!important;border-radius:14px!important;padding:16px 12px!important}
 .stx-go b{font-size:15px!important}
 .stx-go small{font-size:12px!important;margin-top:4px}
 .stx-tests,.stx-tests .scr,.stx-tests .scr-card,.stx-tests .screen_tester_tool-wrap{width:100%!important;max-width:none!important;min-width:0!important;box-sizing:border-box}
 .stx-tests .scr .scr-tiles{width:100%!important;grid-template-columns:repeat(3,minmax(0,1fr))!important}
}
@media (min-width:901px){
 .stx-t-home .stx-side .stx-cardhead{gap:8px!important}
 .stx-t-home .stx-side .stx-cardhead .stx-ico{width:26px!important;height:26px!important;min-width:26px!important;border-radius:8px!important}
 .stx-t-home .stx-side .stx-cardhead svg{width:15px!important;height:15px!important}
 .stx-t-home .stx-side .stx-cardhead .stx-ct{font-size:14.5px!important}
 .stx-t-home .stx-info .stx-kv{padding:2px 0!important;font-size:12.5px}
}
@media (min-width:901px) and (max-height:820px){
 .stx-t-home .stx-dark .stx-sw{aspect-ratio:3.6!important}
 .stx-t-home .stx-side>.stx-card{padding:8px 12px!important}
 .stx-t-home .stx-side{gap:8px!important}
 .stx-t-home .stx-tests .scr .scr-tile{grid-template-columns:auto 1fr!important;grid-template-rows:1fr!important;justify-items:start;text-align:left;column-gap:6px;align-items:center;padding:3px 6px!important}
 .stx-t-home .stx-tests .scr .scr-tile b{grid-column:2!important;font-size:11.5px!important}
 .stx-t-home .stx-tests .scr .scr-sw{width:18px!important;height:18px!important}
 .stx-t-home .stx-tests .scr .scr-tiles{gap:4px!important}
 .stx-t-home .stx-tests .scr .scr-advbtn{min-height:28px;padding:2px 10px}
 .stx-t-home .stx-tests .scr .scr-advbtn b{font-size:12.5px}
}
/* ===== v2.7.0 ===== */
.stx-go b,.stx-go small,.stx-go .stx-ld,.stx-go .stx-lm{font-family:system-ui,-apple-system,"Segoe UI",Roboto,Inter,"Helvetica Neue",Arial,sans-serif!important;letter-spacing:normal!important}
.stx-go b{font-weight:600!important}.stx-go small{font-weight:400!important}
/* Choose a test: big rounded-square icons stacked above label */
.stx-tests .scr .scr-tile{grid-template-columns:1fr!important;grid-template-rows:auto auto!important;justify-items:center!important;text-align:center!important;row-gap:5px!important;align-content:center}
.stx-tests .scr .scr-tile b{grid-column:1!important}
.stx-tests .scr .scr-sw{width:40px!important;height:40px!important;border-radius:11px!important}
@media (min-width:901px){
 .stx-t-home .stx-tests .scr .scr-tile,.stx-t-home .stx-tests .scr .scr-tile{grid-template-columns:1fr!important;grid-template-rows:auto auto!important;justify-items:center!important;text-align:center!important;padding:6px 4px!important;row-gap:4px!important}
 .stx-t-home .stx-tests .scr .scr-tile b{grid-column:1!important;font-size:12.5px!important}
 .stx-t-home .stx-tests .scr .scr-sw{width:44px!important;height:44px!important;border-radius:12px!important}
 .stx-t-home .stx-info .stx-kvs{display:grid!important;grid-template-columns:repeat(4,auto)!important;column-gap:10px;row-gap:0}
 .stx-t-home .stx-info .stx-kv{display:flex!important;flex-direction:column!important;border:0!important;padding:0!important;gap:0}
 .stx-t-home .stx-info .stx-kv span{font-size:11px!important}.stx-t-home .stx-info .stx-kv b{font-size:12.5px!important}
 .stx-t-home .stx-dark .stx-sws{grid-template-columns:repeat(10,1fr)!important;gap:4px!important}
 .stx-t-home .stx-dark .stx-sw{aspect-ratio:1.5!important}
}
@media (min-width:901px) and (max-height:820px){
 .stx-t-home .stx-tests .scr .scr-sw{width:34px!important;height:34px!important;border-radius:10px!important}
 .stx-t-home .stx-tests .scr .scr-tile{padding:4px!important;row-gap:3px!important}
 .stx-t-home .stx-tests .scr .scr-tile b{font-size:12px!important}
}
@media (max-width:600px){
 .stx-hero h1.stx-h1{margin-bottom:18px!important}
 .stx-bento,.stx-side{gap:18px!important}
 .stx-side>.stx-info{order:5!important}
 .stx-t-home .stx-side>.stx-tests{order:-2!important}
 .stx-tests .scr .scr-sw{width:40px!important;height:40px!important}
 .stx-tests .scr .scr-tile{padding:10px 4px!important}
}
/* short desktop screens: keep every side card beside the tool */
@media (min-width:901px) and (max-height:640px){
 .stx-side>.stx-keys{display:none!important}
 .stx-side{gap:8px!important}
 .stx-side>.stx-card{padding:9px 12px!important}
 .stx-side .stx-cs{display:none!important}
 .stx-side .stx-cardhead{margin-bottom:6px!important}
 .stx-side .stx-cardhead .stx-ico{width:26px!important;height:26px!important;min-width:26px!important}
 .stx-side .stx-kv{padding:1px 0!important}
 .stx-side .stx-dark .stx-sw,.stx-side .stx-sw{aspect-ratio:2.6!important}
 .stx-hzbig{padding:12px!important;gap:6px!important}
 .stx-hzbig .stx-ring{width:min(180px,45%)!important}
 .stx-t-home .stx-tests .scr .scr-sw{width:30px!important;height:30px!important;border-radius:9px!important}
 .stx-t-home .stx-tests .scr .scr-tile{padding:3px!important;row-gap:2px!important}
 .stx-t-home .stx-tests .scr .scr-tile b{font-size:11.5px!important}
 .stx-t-home .stx-dark .stx-sw{aspect-ratio:1.9!important}
}
@media (min-width:901px){.stx-t-home .stx-dark .stx-sws{grid-template-columns:repeat(10,minmax(0,1fr))!important}.stx-t-home .stx-dark .stx-sw{min-width:0!important}}
/* ===== v2.8.0 new pages ===== */
.ic-band{--ib:#e0f2fe;--iu:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect x='3' y='6' width='4.5' height='12' fill='%230c4a6e'/%3E%3Crect x='7.5' y='6' width='4.5' height='12' fill='%230369a1'/%3E%3Crect x='12' y='6' width='4.5' height='12' fill='%230ea5e9'/%3E%3Crect x='16.5' y='6' width='4.5' height='12' fill='%237dd3fc'/%3E%3C/svg%3E")}
.ic-mon{--ib:#eef0ff;--iu:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%234f46e5' stroke-width='2'%3E%3Crect x='3' y='4' width='18' height='12' rx='2'/%3E%3Cpath d='M9 20h6M12 16v4'/%3E%3C/svg%3E")}
.ic-lap{--ib:#ecfdf5;--iu:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23059669' stroke-width='2'%3E%3Crect x='5' y='5' width='14' height='10' rx='1.5'/%3E%3Cpath d='M2 19h20'/%3E%3C/svg%3E")}
.ic-mob{--ib:#fff1e6;--iu:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ea580c' stroke-width='2'%3E%3Crect x='7' y='3' width='10' height='18' rx='2.5'/%3E%3Cpath d='M11 18h2'/%3E%3C/svg%3E")}
.ic-tv{--ib:#f3e8ff;--iu:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%239333ea' stroke-width='2'%3E%3Crect x='2' y='6' width='20' height='12' rx='2'/%3E%3Cpath d='M8 21h8M9 3l3 3 3-3'/%3E%3C/svg%3E")}
.ic-lcd{--ib:#fef9c3;--iu:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect x='3' y='5' width='18' height='13' rx='2' fill='%23111827'/%3E%3Cpath d='M3 5h18v3H3z' fill='%23fde047' opacity='.8'/%3E%3C/svg%3E")}
.stx-patbig .stx-prev{background-size:cover}
/* desktop: side column always matches the tool height (cards share the spare space) */
@media (min-width:901px){
 .stx-bento:not(.stx-t-home) .stx-side{display:flex!important;flex-direction:column!important;grid-template-rows:none!important}
 .stx-bento:not(.stx-t-home) .stx-side>.stx-card{flex:1 0 auto!important;margin:0!important}
}
/* ===== v2.9.0 Your Screen Info: 4 equal columns, label over value, both left-aligned ===== */
.stx-info .stx-kvs,.stx-t-home .stx-info .stx-kvs{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;column-gap:12px!important;row-gap:0!important}
.stx-info .stx-kv,.stx-t-home .stx-info .stx-kv{display:flex!important;flex-direction:column!important;align-items:flex-start!important;justify-content:flex-start!important;text-align:left!important;gap:2px!important;padding:2px 0!important;border:0!important;min-width:0}
.stx-info .stx-kv span,.stx-info .stx-kv b{text-align:left!important;margin:0!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.stx-info .stx-kv span{font-size:11.5px!important}
.stx-info .stx-kv b{font-size:13px!important}
/* colour swatches: equal columns filling the width */
.stx-dark .stx-sws{display:grid!important;grid-template-columns:repeat(5,minmax(0,1fr))!important;width:100%}
.stx-dark .stx-sw{width:100%!important;min-width:0!important;margin:0!important}
@media (min-width:901px){.stx-t-home .stx-dark .stx-sws{grid-template-columns:repeat(10,minmax(0,1fr))!important}}
@media (max-width:820px){.stx-info .stx-kvs,.stx-t-home .stx-info .stx-kvs{column-gap:6px!important}.stx-info .stx-kv span{font-size:10.5px!important}.stx-info .stx-kv b{font-size:12px!important;white-space:normal!important;overflow:visible!important;text-overflow:clip!important;overflow-wrap:anywhere}}
/* v2.11.0 custom colour swatch + popover */
.stx-sw.stx-swx{background:conic-gradient(from 0deg,#f00,#ff0,#0f0,#0ff,#00f,#f0f,#f00)!important;display:flex;align-items:center;justify-content:center;color:#fff;padding:0;cursor:pointer}
.stx-sw.stx-swx svg{background:rgba(0,0,0,.55);border-radius:50%;padding:2px;width:18px;height:18px;flex:none}
.stx-cpop{position:fixed;z-index:99990;background:#fff;color:var(--stx-tx,#111);border:1px solid var(--stx-line,#e5e7eb);border-radius:14px;box-shadow:0 12px 32px rgba(0,0,0,.18);padding:12px;box-sizing:border-box}
.stx-cpop[hidden]{display:none!important}
.stx-cpop p{margin:0 0 8px;font:600 14px/1.2 inherit}
.stx-cpop .stx-crow{grid-template-columns:44px 1fr auto!important}
.stx-cpop .stx-crow .stx-cgo{grid-column:auto!important;height:40px;padding:0 14px}