/* Section components: Paper water + animated beam (#check band), ring chart (#how), Paper waves (#why). */

/* Shared canvas box for the Paper mounts */
.idle-water canvas,.why-waterline canvas{position:absolute;inset:0;width:100%;height:100%;display:block;contain:strict}

/* "Who still has access?": approvals cross the water to the wallet */
.radial .scanner-idle{position:relative}
.idle-crossing{position:relative;width:min(520px,100%);height:156px;display:grid;grid-template-columns:1fr 70px 1fr;align-items:center;isolation:isolate}
.idle-crossing .radar{grid-column:2;grid-row:1;background-color:#0c1a28;z-index:2}
.idle-water{position:absolute;inset:-26px -18%;z-index:-1;pointer-events:none;
  -webkit-mask:radial-gradient(closest-side,#000 38%,transparent 100%);mask:radial-gradient(closest-side,#000 38%,transparent 100%);
  background:radial-gradient(closest-side,#6eeee30d,transparent)}
.idle-water.is-live{background:none}
.ic-col{grid-row:1;height:100%;position:relative}
.ic-col.l{grid-column:1}.ic-col.r{grid-column:3}
.ic-node{position:absolute;width:13px;height:13px;border-radius:50%;border:1px solid #6eeee37a;background:#0c1a28;transform:translate(-50%,-50%);z-index:2}
.ic-node:after{content:'';position:absolute;inset:3px;border-radius:50%;background:var(--aqua)}
.ic-node.is-red{border-color:#ff8b8b8c}.ic-node.is-red:after{background:var(--red)}
.ic-beams{position:absolute;inset:0;pointer-events:none;overflow:visible;z-index:1}
.ic-path{stroke:#9bb0bf;stroke-opacity:.16;stroke-width:1.2}
.ic-path.is-red{stroke:#ff8b8b;stroke-opacity:.18}

/* Ring chart meters on the three rings */
.r3-meter-track,.r3-meter{fill:none;stroke-linecap:round}
.r3-meter-track{stroke:#6eeee3;stroke-opacity:.06;stroke-width:7}
.r3-meter{stroke-width:3;stroke-dashoffset:var(--arc,2000);transition:stroke-dashoffset 1.4s cubic-bezier(.16,1,.3,1)}
.r3-meter.is-full{stroke-dashoffset:0}
.r3-meter.no-anim{transition:none}
.r3-meter-outer{stroke:#3f95ac}
.r3-meter-mid{stroke:#55c3cb;transition-delay:.12s}
.r3-meter-inner{stroke:var(--aqua);transition-delay:.24s}
@media (max-width:700px){.r3-meter{stroke-width:4.5}.r3-meter-track{stroke-width:10}}

/* #why waterline */
#why{position:relative;isolation:isolate}
.why-waterline{position:absolute;left:0;right:0;bottom:0;height:min(18%,150px);z-index:-1;pointer-events:none;
  -webkit-mask-image:linear-gradient(to bottom,transparent,#000 55%,#000 72%,transparent),linear-gradient(to right,transparent,#000 18%,#000 82%,transparent);
  -webkit-mask-composite:source-in;
  mask-image:linear-gradient(to bottom,transparent,#000 55%,#000 72%,transparent),linear-gradient(to right,transparent,#000 18%,#000 82%,transparent);
  mask-composite:intersect}

@media (max-width:768px){
  .idle-crossing{height:132px;grid-template-columns:1fr 50px 1fr}
  .idle-water{inset:-18px -8%}
  .why-waterline{height:min(12%,120px)}
}