/* React Bits ReflectiveCard material adapted without webcam access. */
.reflective-card {
  position: absolute;
  top: 50%;
  left: 50%;
  overflow: hidden;
  isolation: isolate;
  background: radial-gradient(circle at 72% 15%, rgba(255,255,255,.5), transparent 30%), linear-gradient(145deg, #27353f 0%, #1b252d 48%, #10161d 100%);
  box-shadow: 0 28px 46px -18px rgba(23,31,38,.6), 0 0 0 1px rgba(255,255,255,.12) inset;
}
.reflective-noise { position:absolute; inset:0; z-index:1; pointer-events:none; opacity:.24; background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"); mix-blend-mode:screen; }
.reflective-sheen { position:absolute; inset:-25%; z-index:2; pointer-events:none; background:linear-gradient(125deg, rgba(255,255,255,.32), rgba(255,255,255,.04) 42%, transparent 53%, rgba(255,255,255,.18) 75%, rgba(255,255,255,.32)); transform:translateX(-12%) rotate(8deg); mix-blend-mode:screen; opacity:.72; }
.reflective-border { position:absolute; inset:0; z-index:4; pointer-events:none; border-radius:inherit; padding:1px; background:linear-gradient(135deg, rgba(255,255,255,.78), rgba(255,255,255,.08) 52%, rgba(255,255,255,.36)); -webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0); -webkit-mask-composite:xor; mask-composite:exclude; }
.reflective-content { position:relative; z-index:3; display:flex; flex-direction:column; justify-content:space-between; height:100%; padding:22px; color:#f5f8fb; }
.depth-card__top,.depth-card__bottom { display:flex; justify-content:space-between; align-items:center; color:rgba(240,247,250,.62); font:9px/1 var(--mono); letter-spacing:.14em; }
.depth-card__top b { color:#e9b36c; font-weight:500; }
.depth-card__center { display:flex; flex-direction:column; align-items:flex-start; gap:8px; }
.depth-card__center strong { font-size:29px; line-height:.95; letter-spacing:-.055em; }
.depth-card__center small { color:rgba(240,247,250,.7); font-size:11px; }
.depth-card__logo,.depth-card__symbol { display:grid; place-items:center; width:44px; height:44px; margin-bottom:8px; border:1px solid #b8c8c3; border-radius:14px; background:#fff; }
.depth-card__logo img { width:26px; height:26px; filter:none; }
.depth-card__logo--cc-switch img { width:30px; height:30px; filter:grayscale(1) contrast(1.12); }
.depth-card__symbol { color:var(--primary-deep); font-size:25px; }