/* File: wpmc-storypage-builder/objects/site-statistic/runtime.css */
.wpmc-ss-root{
  position:absolute;
  inset:0;
  box-sizing:border-box;
  overflow:visible;
  --ss-s: 1; /* scale factor, set from JS */
  font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
}

.wpmc-ss-shell{
  position: relative;
  box-sizing: border-box;
  width: 100%;
  height: 100%;
  padding: calc(12px * var(--ss-s));
  border-radius: calc(18px * var(--ss-s));
  background: linear-gradient(135deg, #ffb347, #ff4f72 45%, #ff61c4);
  box-shadow:
    0 calc(18px * var(--ss-s)) calc(40px * var(--ss-s)) rgba(15, 23, 42, 0.75),
    0 0 calc(30px * var(--ss-s)) rgba(255, 96, 144, 0.55),
    0 0 calc(16px * var(--ss-s)) rgba(255, 152, 64, 0.65);
  overflow: hidden;
}

.wpmc-ss-inner{
  display: flex;
  flex-direction: column;
  position: relative;
  box-sizing: border-box;
  width: 100%;
  height: 100%;
  padding: calc(16px * var(--ss-s));
  border-radius: calc(16px * var(--ss-s));
  background:
    radial-gradient(circle at 10% 0%, rgba(248, 113, 113, 0.12), transparent 55%),
    radial-gradient(circle at 90% 0%, rgba(244, 114, 182, 0.14), transparent 55%),
    radial-gradient(circle at 50% 110%, rgba(59, 130, 246, 0.10), transparent 60%),
    linear-gradient(145deg, #020617, #020617 45%, #0b1220 100%);
  border: calc(1px * var(--ss-s)) solid rgba(255, 255, 255, 0.06);
  overflow: hidden;
}

.wpmc-ss-inner::before{
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: linear-gradient(to bottom, rgba(255, 255, 255, 0.08), transparent 35%);
  mix-blend-mode: screen;
  pointer-events: none;
}

.wpmc-ss-inner::after{
  content: "";
  position: absolute;
  inset: -30%;
  border-radius: inherit;
  background:
    radial-gradient(circle at 0% 0%, rgba(255, 165, 90, 0.30), transparent 55%),
    radial-gradient(circle at 100% 0%, rgba(255, 90, 140, 0.30), transparent 55%);
  opacity: 0.30;
  filter: blur(calc(14px * var(--ss-s)));
  pointer-events: none;
  z-index: -1;
}

.wpmc-ss-title{
  font-weight:1000;
  letter-spacing:calc(0.2px * var(--ss-s));
  font-size:calc(18px * var(--ss-s));
  line-height:1.1;
  margin:0 0 calc(12px * var(--ss-s)) 0;
  color:#d94bff;
}

.wpmc-ss-grid{
  flex: 1 1 auto;
  min-height: 0;
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap:calc(12px * var(--ss-s));
  width:100%;
  grid-auto-rows: 1fr;
  align-items: stretch;
}

.wpmc-ss-card{
  position:relative;
  box-sizing:border-box;
  padding:calc(12px * var(--ss-s));
  border-radius:calc(10px * var(--ss-s));
  border:calc(1px * var(--ss-s)) solid rgba(255,255,255,0.65);
  background: rgba(10,10,12,0.72);
  overflow:hidden;
}

.wpmc-ss-card::before{
  content:"";
  position:absolute;
  inset:0;
  border-radius:inherit;
  background: linear-gradient(to bottom, rgba(255,255,255,0.05), transparent 40%);
  pointer-events:none;
}

.wpmc-ss-card-title{
  position:relative;
  font-weight:800;
  font-size:calc(24px * var(--ss-s));
  letter-spacing:calc(0.2px * var(--ss-s));
  color:#d94bff;
  margin-bottom:calc(8px * var(--ss-s));
}

.wpmc-ss-card-value{
  position:relative;
  font-weight:950;
  font-size:calc(22px * var(--ss-s));
  line-height:1.1;
  color:#ff4aa2;
}

.wpmc-ss-time{
  font-size:calc(18px * var(--ss-s));
}

.wpmc-ss-card-spark{
  position:absolute;
  left:calc(10px * var(--ss-s));
  right:calc(10px * var(--ss-s));
  bottom:calc(8px * var(--ss-s));
  height:calc(66px * var(--ss-s));
  opacity:0.95;
}

.wpmc-ss-spark{ width:100%; height:100%; }

.wpmc-ss-fill-pink{ fill: rgba(255, 74, 162, 0.18); }
.wpmc-ss-stroke-pink{ fill:none; stroke: rgba(255, 74, 162, 0.95); stroke-width: calc(1.6px * var(--ss-s)); }

.wpmc-ss-fill-blue{ fill: rgba(64, 163, 255, 0.18); }
.wpmc-ss-stroke-blue{ fill:none; stroke: rgba(64, 163, 255, 0.95); stroke-width: calc(1.6px * var(--ss-s)); }

.wpmc-ss-fill-yellow{ fill: rgba(255, 200, 64, 0.18); }
.wpmc-ss-stroke-yellow{ fill:none; stroke: rgba(255, 200, 64, 0.95); stroke-width: calc(1.6px * var(--ss-s)); }

.wpmc-ss-fill-teal{ fill: rgba(74, 220, 200, 0.18); }
.wpmc-ss-stroke-teal{ fill:none; stroke: rgba(74, 220, 200, 0.95); stroke-width: calc(1.6px * var(--ss-s)); }

.wpmc-ss-accent-pink .wpmc-ss-card-value{ color:#ff4aa2; text-shadow: 0 0 calc(16px * var(--ss-s)) rgba(255, 74, 162, 0.28); }
.wpmc-ss-accent-blue .wpmc-ss-card-value{ color:#40a3ff; text-shadow: 0 0 calc(16px * var(--ss-s)) rgba(64, 163, 255, 0.28); }
.wpmc-ss-accent-yellow .wpmc-ss-card-value{ color:#ffc840; text-shadow: 0 0 calc(16px * var(--ss-s)) rgba(255, 200, 64, 0.28); }
.wpmc-ss-accent-teal .wpmc-ss-card-value{ color:#4adcc8; text-shadow: 0 0 calc(16px * var(--ss-s)) rgba(74, 220, 200, 0.28); }

.wpmc-ss-card--table{
  grid-column: 2;
  grid-row: 1 / span 2;
  overflow: hidden;
}

.wpmc-ss-table-head,
.wpmc-ss-table-row{
  position:relative;
  display:grid;
  grid-template-columns: 1fr minmax(calc(90px * var(--ss-s)), calc(160px * var(--ss-s)));
  gap:calc(10px * var(--ss-s));
  align-items:center;
  padding:calc(7px * var(--ss-s)) 0;
  border-top:calc(1px * var(--ss-s)) solid rgba(255,255,255,0.55);
}

.wpmc-ss-table-head{
  border-top:none;
  padding-top:calc(6px * var(--ss-s));
  padding-bottom:calc(6px * var(--ss-s));
}

.wpmc-ss-th{
  font-weight:800;
  font-size:calc(22px * var(--ss-s));
  color: rgba(255,255,255,0.95);
}

.wpmc-ss-td{
  font-weight:700;
  font-size:calc(20px * var(--ss-s));
  color: rgba(255,255,255,0.92);
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.wpmc-ss-th--right,
.wpmc-ss-td--right{
  text-align:right;
  font-weight:950;
  color:#ff4aa2;
}

@media (max-width: 560px){
  .wpmc-ss-grid{ grid-template-columns: 1fr; }
  .wpmc-ss-card--table{ grid-column: 1; grid-row:auto; }
}


.wpmc-ss-card--nospark{ padding-bottom: calc((12px + 66px + 8px) * var(--ss-s)); }

.wpmc-ss-th--right{ justify-self: end; }
.wpmc-ss-td--right{ justify-self: end; white-space: nowrap; }