/* R111: premium above-the-fold compact layout (only reports inside service cards). */
.lp-browser-monitor,.lp-browser-monitor *{transition:none!important;animation:none!important}
.lp-browser-monitor{
 margin:11px 0 8px;padding:11px 13px;border-radius:15px;min-width:0;
 background:linear-gradient(115deg,#062c46,#0c3c57 75%,#103c57);
 border:1.5px solid #7cc9eb;box-shadow:0 6px 14px rgba(0,12,28,.15);
 color:#fff;direction:rtl;text-align:right;
}
.lp-browser-monitor-head{
 display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;
 column-gap:12px;row-gap:2px;
 margin:0;padding:0 0 6px;border-bottom:1px solid rgba(204,233,248,.40);
}
.lp-browser-monitor-title{
 color:#fff;font-weight:900;font-size:16px;letter-spacing:0;line-height:1.55;
}
.lp-browser-monitor-title::before{content:"✦";color:#ffe0a1;margin-left:7px}
.lp-browser-monitor-time{
 color:#ffe0a9;font-size:12.5px;font-weight:800;line-height:1.55;margin:0;
 display:inline-block;white-space:normal;
}
.lp-browser-monitor-metrics{
 display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:8px 0 0;
}
.lp-browser-monitor-metric{
 display:flex;align-items:center;justify-content:space-between;gap:6px;min-width:0;
 border:1px solid #507b92;border-radius:9px;padding:6px 8px;
 background:#19445b;line-height:1.5;font-size:13px;font-weight:800;
}
.lp-browser-monitor-metric span{color:#f4faff;min-width:0}
.lp-browser-monitor-metric b{
 font-size:16px;font-weight:900;line-height:1.4;text-align:center;
 border:1px solid transparent;border-radius:7px;padding:3px 7px;
 white-space:normal;overflow-wrap:break-word;
}
.lp-browser-monitor-metric b[data-tone="connected"],
.lp-browser-monitor-metric b[data-tone="normal"]{
 color:#9bffd0;background:#124a40;border-color:#52bb94;
}
.lp-browser-monitor-metric b[data-tone="slow"],
.lp-browser-monitor-metric b[data-tone="interrupted"],
.lp-browser-monitor-metric b[data-tone="disconnected"]{
 color:#ffe1e4;background:#7a2636;border-color:#e27887;
}
.lp-browser-monitor-metric b[data-tone="unknown"]{
 color:#ffdfaa;background:#5e472b;border-color:#b59b70;
}
.lp-browser-monitor-detail{
 color:#13394c;background:#eef7fc;border:1px solid #b5d9eb;
 border-radius:9px;margin:8px 0 0;padding:6px 9px;
 font-size:13px;font-weight:750;line-height:1.65;overflow-wrap:break-word;
}
.lp-browser-monitor-more{margin:4px 1px 0;color:#e4f2fa;font-size:12px;line-height:1.6}
.lp-browser-monitor-more summary{
 cursor:pointer;display:list-item;list-style:revert;color:#d7eaf5;
 font-size:12px;font-weight:750;outline-offset:3px;
}
.lp-browser-monitor-more summary:focus-visible{outline:2px solid #f6db9d;border-radius:3px}
.lp-browser-monitor-foot{
 display:block;color:#e5f3f9;font-size:12px;line-height:1.8;font-weight:650;
 margin:5px 0 0;overflow-wrap:break-word;
}
.lp-browser-monitor[data-state="connected"]{border-color:#67d0a5}
.lp-browser-monitor[data-state="interrupted"]{border-color:#ffa4af}
.lp-browser-monitor[data-state="disconnected"]{border-color:#ff8794}
.lp-browser-monitor[data-state="unknown"]{border-color:#8dd5f1}
@media(max-width:600px){
 .lp-browser-monitor{margin:10px 0 8px;padding:11px 10px;border-radius:13px}
 .lp-browser-monitor-title{font-size:15px}
 .lp-browser-monitor-time{font-size:12px}
 .lp-browser-monitor-metric{padding:6px;gap:4px;font-size:12.5px;flex-wrap:wrap}
 .lp-browser-monitor-metric b{font-size:15.5px;padding:2px 6px}
 .lp-browser-monitor-detail{font-size:13px;padding:7px 8px}
 .lp-browser-monitor-more,.lp-browser-monitor-more summary{font-size:12px}
}
/* Quick overview: make cards legible against the dark section while retaining navy identity. */
.status-matrix .matrix-item{
 background:linear-gradient(135deg,#173e56,#10334a)!important;
 border:1.5px solid #7199ae!important;
 box-shadow:inset 0 1px 0 rgba(222,246,255,.19),0 5px 18px rgba(0,12,29,.17)!important;
 color:#f6fcff;
}
.status-matrix .matrix-item:hover,
.status-matrix .matrix-item:focus-visible{
 border-color:#e9bd75!important;
 background:linear-gradient(135deg,#1c4b65,#133e57)!important;
}
.status-matrix .matrix-item .matrix-title,
.status-matrix .matrix-item .matrix-sub{color:#f2f8fc!important}
.status-matrix .matrix-item .matrix-state.tone-good{color:#61edb4!important}
.status-matrix .matrix-item[data-speed="slow"] .matrix-sub span,
.status-matrix .matrix-item[data-speed="critical"] .matrix-sub span{
 color:#ff8791!important;font-weight:900;
}
.status-matrix .matrix-item[data-speed="fast"] .matrix-sub span{
 color:#7df0b4!important;font-weight:800;
}
/* Slow has a red speed indicator, but green connection in every place. */
.service-card .metric-value.tone-bad{color:#e15362}

/* R112: true source badge for quick-path results. */
.status-matrix .matrix-item .matrix-sub{display:flex;align-items:center;flex-wrap:wrap;column-gap:6px;row-gap:2px}
.status-matrix .matrix-item .lp-quick-source{display:inline-block;flex:none;font-size:10.5px;font-weight:850;line-height:1.4;color:#e6f1fb;background:#2a475a;border:1px solid #658598;border-radius:7px;padding:2px 5px}
.status-matrix .matrix-item .lp-quick-source--legalplus{color:#fff1cc;background:#55452d;border-color:#ac8c53}
/* More room for LegalPlus while the duplicated public-server indicators are reduced. */
.lp-browser-monitor{padding:15px 15px;margin:12px 0 9px}
.lp-browser-monitor-head{padding-bottom:9px}
.lp-browser-monitor-title{font-size:18px}
.lp-browser-monitor-time{font-size:13px}
.lp-browser-monitor-metrics{gap:9px;margin-top:10px}
.lp-browser-monitor-metric{font-size:14px;padding:9px 10px;gap:6px}
.lp-browser-monitor-metric b{font-size:17px;padding:4px 8px}
.lp-browser-monitor-detail{font-size:14px;line-height:1.72;padding:9px 10px;margin-top:10px}
.lp-browser-monitor-more{margin-top:7px}
.lp-browser-monitor-more summary{font-size:12.5px}
@media(min-width:1000px){
 .service-card .status-headline{min-height:74px;padding:9px 13px;margin-bottom:9px;border-radius:16px}
 .service-card .status-headline strong{font-size:20px}
 .service-card .status-headline .status-subtitle{font-size:13px;line-height:1.55}
 .service-card .metric-duo{padding:7px;gap:7px;border-radius:16px}
 .service-card .metric-block{padding:8px 9px 9px}
 .service-card .metric-head{font-size:13px;margin-bottom:3px}
 .service-card .metric-value{font-size:17px;line-height:1.5}
 .service-card .post-login{margin-top:10px;margin-bottom:8px;padding:10px 12px}
}
@media(max-width:600px){
 .lp-browser-monitor{margin:11px 0 8px;padding:11px 10px}
 .lp-browser-monitor-title{font-size:15.5px}
 .lp-browser-monitor-time{font-size:12px}
 .lp-browser-monitor-metric{font-size:12.5px;padding:6px}
 .lp-browser-monitor-metric b{font-size:15.5px;padding:2px 6px}
 .lp-browser-monitor-detail{font-size:13px;padding:7px 8px;margin-top:8px}
}

/* R113: genuine, self-hosted Vazirmatn variable 100–900.
   Without this declaration the prior page silently fell back to substitute fonts.
   A local asset prevents network/CDN restrictions and avoids loading personal font data. */
@font-face {
 font-family:'Vazirmatn';
 src:url('./vazirmatn-variable-r113.woff2') format('woff2');
 font-weight:100 900;
 font-style:normal;
 font-display:swap;
}
html,body,button,input,select,textarea{
 font-family:'Vazirmatn',Tahoma,sans-serif;
 font-synthesis:none;
}
body{font-weight:400;letter-spacing:normal}
.service-card .card-title h4{font-weight:750;line-height:1.57}
.service-card .status-headline strong{font-weight:750;line-height:1.45}
.service-card .status-subtitle{font-weight:450;line-height:1.65}
.service-card .metric-head{font-weight:650;line-height:1.5}
.service-card .metric-value{font-weight:750;line-height:1.5}
.service-card .post-login{font-weight:500;line-height:1.65}
.lp-browser-monitor-title{font-weight:750;line-height:1.6}
.lp-browser-monitor-time{font-weight:650;line-height:1.6}
.lp-browser-monitor-metric{font-weight:600;line-height:1.65}
.lp-browser-monitor-metric b{font-weight:750;line-height:1.55}
.lp-browser-monitor-detail{font-weight:550;line-height:1.8}
.lp-browser-monitor-more summary{font-weight:600;line-height:1.7}
.status-matrix .matrix-item .matrix-state{font-weight:750;line-height:1.6}
.status-matrix .matrix-item .matrix-title{font-weight:650;line-height:1.65}
.status-matrix .matrix-item .matrix-sub{font-weight:500;line-height:1.65}
/* Common section headers remain clear without synthetic ultra-black strokes. */
.group-title h3,.summary-status-heading,.matrix-head strong{font-weight:750}

/* R117: server reachability is scoped to authentication, browser report to dashboard.
   High legibility, stable geometry, no animation, usable in light and navy themes. */
.service-card .lp-auth-status{
 display:flex;align-items:center;min-height:0!important;margin:8px 0 7px;
 padding:8px 11px!important;gap:9px!important;border-radius:12px;
}
.service-card .lp-auth-status .status-icon{flex:none}
.service-card .lp-auth-details{
 display:flex;flex:1 1 auto;min-width:0;align-items:center;gap:7px 11px;flex-wrap:wrap;
 line-height:1.55;
}
.service-card .lp-auth-label{font-size:15px;font-weight:750;white-space:normal}
.service-card .lp-auth-result{font-size:19px;font-weight:800;line-height:1.45;white-space:nowrap}
.service-card .lp-auth-result.tone-good{color:#62ebb0}
.service-card .lp-auth-result.tone-bad{color:#ff8e94}
.service-card .lp-auth-result.tone-unknown{color:#f6d28a}
.service-card .lp-auth-speed{font-size:12.5px;font-weight:650;line-height:1.65}
.service-card .lp-browser-monitor{
 margin:9px 0 9px;padding:16px 16px 17px;border-width:2px;
 min-height:145px;
}
.service-card .lp-browser-monitor-head{padding-bottom:9px}
.service-card .lp-browser-monitor-title{font-size:20px;line-height:1.55;font-weight:800}
.service-card .lp-browser-monitor-time{font-size:13.5px;line-height:1.65}
.service-card .lp-browser-monitor-metrics{margin-top:12px;gap:11px}
.service-card .lp-browser-monitor-metric{font-size:15px;padding:11px 10px;gap:8px}
.service-card .lp-browser-monitor-metric b{font-size:19px;line-height:1.5}
.status-matrix .matrix-item .matrix-state{line-height:1.65;white-space:normal;overflow-wrap:anywhere}
html[data-theme="ivory"] .service-card .lp-auth-result.tone-good{color:#176448}
html[data-theme="ivory"] .service-card .lp-auth-result.tone-bad{color:#96313d}
html[data-theme="ivory"] .service-card .lp-auth-result.tone-unknown{color:#866325}
@media(max-width:600px){
 .service-card .lp-auth-status{padding:8px 9px!important}
 .service-card .lp-auth-label{font-size:14px}
 .service-card .lp-auth-result{font-size:17px}
 .service-card .lp-auth-speed{font-size:12px}
 .service-card .lp-browser-monitor{padding:13px 11px;min-height:0}
 .service-card .lp-browser-monitor-title{font-size:18px}
 .service-card .lp-browser-monitor-time{font-size:12.5px}
 .service-card .lp-browser-monitor-metric{font-size:13.5px;padding:8px}
 .service-card .lp-browser-monitor-metric b{font-size:17px}
}

/* R119: dashboard has just two clear metrics; reporting source sits full-width
   BELOW the two metrics, inside the same navy card. No broken Latin brand. */
.service-card .lp-browser-monitor-metrics{
 grid-template-columns:repeat(2,minmax(0,1fr));
}
.service-card .lp-browser-monitor-metric{
 min-width:0;display:flex;align-items:center;justify-content:space-between;
 gap:8px;
}
.service-card .lp-browser-monitor-metric > span{
 min-width:0;flex:1 1 auto;overflow-wrap:normal;word-break:normal;
}
.service-card .lp-browser-monitor-metric > b{
 min-width:max-content;flex:0 0 auto;white-space:nowrap;
}
.service-card .lp-browser-monitor-source{
 display:flex;direction:rtl;align-items:center;justify-content:center;
 gap:9px;margin-top:12px;padding:11px 10px 1px;
 border-top:1px solid rgba(191,227,244,.39);
 color:#eff9ff;line-height:1.55;text-align:center;
 font-weight:750;min-width:0;
}
.service-card .lp-browser-monitor-source::before{
 content:"◆";color:#edc88c;font-size:12px;
}
.service-card .lp-browser-monitor-source-label{
 font-size:14px;white-space:nowrap;
}
.service-card .lp-browser-monitor-source-brand{
 display:inline-block;direction:ltr;unicode-bidi:isolate;
 color:#ffe2a8;font-weight:850;font-size:16px;
 white-space:nowrap;overflow-wrap:normal;word-break:keep-all;
 letter-spacing:.1px;
}
@media(max-width:600px){
 .service-card .lp-browser-monitor-metric{gap:5px}
 .service-card .lp-browser-monitor-metric > span{font-size:12.5px}
 .service-card .lp-browser-monitor-metric > b{font-size:15px}
 .service-card .lp-browser-monitor-source{
  gap:7px;margin-top:9px;padding:9px 5px 0;
 }
 .service-card .lp-browser-monitor-source-label{font-size:12.5px}
 .service-card .lp-browser-monitor-source-brand{font-size:14px}
}


/* R127: legible, vertical status/speed tiles on all six radar cards.
   Overrides R119 flex-row and max-content rules without touching evidence logic. */
.service-card .lp-browser-monitor-metrics{
 display:grid;
 grid-template-columns:repeat(2,minmax(0,1fr));
 align-items:stretch;
 gap:10px;
 margin-top:12px;
}
.service-card .lp-browser-monitor-metric{
 display:flex;
 flex-direction:column;
 align-items:center;
 justify-content:center;
 min-width:0;
 min-height:94px;
 padding:11px 9px;
 gap:8px;
 overflow:hidden;
 text-align:center;
}
.service-card .lp-browser-monitor-metric > span{
 display:block;
 width:100%;
 min-width:0;
 flex:0 0 auto;
 color:#f4faff;
 font-size:clamp(12px,0.84vw,14.5px);
 line-height:1.6;
 font-weight:750;
 white-space:nowrap;
 word-break:keep-all;
 overflow-wrap:normal;
 text-align:center;
}
.service-card .lp-browser-monitor-metric > b{
 display:inline-flex;
 flex:0 1 auto;
 align-items:center;
 justify-content:center;
 max-width:100%;
 min-width:0;
 box-sizing:border-box;
 padding:4px 9px;
 font-size:clamp(14px,1.02vw,18px);
 line-height:1.5;
 font-weight:800;
 white-space:nowrap;
 word-break:keep-all;
 overflow-wrap:normal;
 text-align:center;
}
.service-card .lp-browser-monitor-source{
 margin-top:12px;
 padding-top:11px;
 padding-bottom:0;
}
@media(min-width:940px) and (max-width:1300px){
 .service-card .lp-browser-monitor-metric{min-height:91px;padding:9px 5px;gap:6px}
 .service-card .lp-browser-monitor-metric > span{font-size:12.3px}
 .service-card .lp-browser-monitor-metric > b{font-size:15px;padding:3px 7px}
}
@media(max-width:679px){
 .service-card .lp-browser-monitor-metrics{gap:8px;margin-top:10px}
 .service-card .lp-browser-monitor-metric{min-height:83px;padding:9px 4px;gap:6px}
 .service-card .lp-browser-monitor-metric > span{font-size:clamp(11px,3.3vw,13px)}
 .service-card .lp-browser-monitor-metric > b{font-size:clamp(12px,3.8vw,16px);padding:3px 6px}
 .service-card .lp-browser-monitor-source{margin-top:10px;padding-top:9px}
}