.id-card{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--ink:#eef0f4;--ink-strong:#fff;--soft:#cdd1d8;--muted:#9ba1ac;--dim:#6f7580;--faint:#4f545e;--line:#ffffff12;--line-strong:#ffffff1f;--hot:#ff2e63;--rose:#ff5a7e;--sky:#6b9bd1;--mint:#38d9a9;--amber:#f2b45c;--mx:50%;--my:30%;--px:0;--py:0;--rx:0deg;--ry:0deg;--angle:200deg;--spectrum:#ff2e63,#ff9a5c,#ffe08a,#38d9a9,#6b9bd1,#9d8bff,#ff2e63;aspect-ratio:85.6/54;color:var(--ink);text-align:left;transform:perspective(900px) rotateX(var(--rx)) rotateY(var(--ry));transition:transform .6s var(--ease),box-shadow .45s;animation:rise .6s var(--ease) .12s backwards;background:radial-gradient(70% 90% at 0 0,#c4064038,#0000 60%),radial-gradient(80% 90% at 100% 100%,#6b9bd133,#0000 60%),linear-gradient(135deg,#1b1e26,#0d0f14 55%,#141820);border-radius:18px;flex-direction:column;padding:14px 16px 12px;display:flex;position:relative;box-shadow:0 28px 50px -26px #000000f2,0 0 0 1px #ffffff1a,inset 0 1px #ffffff14;container-type:inline-size}.id-card:hover{transform:perspective(900px) rotateX(var(--rx)) rotateY(var(--ry)) scale(1.025);transition:transform .12s ease-out,box-shadow .45s;box-shadow:0 34px 60px -26px #000000f2,0 0 0 1px #ffffff24,0 26px 70px -24px #ff2e6399,0 -6px 60px -30px #6b9bd1b3,inset 0 1px #ffffff1f}.id-card:before{content:"";z-index:2;border-radius:inherit;background:conic-gradient(from var(--angle),var(--spectrum));-webkit-mask-composite:xor;opacity:.18;pointer-events:none;padding:1px;transition:opacity .35s;position:absolute;inset:0;-webkit-mask-image:linear-gradient(#000 0 0),linear-gradient(#000 0 0);-webkit-mask-position:0 0,0 0;-webkit-mask-size:auto,auto;-webkit-mask-repeat:repeat,repeat;-webkit-mask-clip:content-box,border-box;-webkit-mask-origin:content-box,border-box;-webkit-mask-composite:xor;mask-composite:exclude;-webkit-mask-source-type:auto,auto;mask-mode:match-source,match-source}.id-card:hover:before{opacity:1}.id-fx{border-radius:inherit;pointer-events:none;position:absolute;inset:0;overflow:hidden}.id-fx>span{position:absolute;inset:0}.id-guilloche{background:repeating-radial-gradient(circle at 112% 135%,#ffffff0d 0 1px,#0000 1px 6px),repeating-radial-gradient(circle at -12% -40%,#ffffff0a 0 1px,#0000 1px 8px);-webkit-mask-image:linear-gradient(100deg,#000 0%,#0000 45% 55%,#000 100%);mask-image:linear-gradient(100deg,#000 0%,#0000 45% 55%,#000 100%)}.id-foil{background:linear-gradient(115deg,transparent 15%,var(--spectrum),transparent 85%);background-size:250% 250%;background-position:var(--mx) var(--my);-webkit-mask-image:radial-gradient(circle at var(--mx) var(--my),#000,#00000059 38%,transparent 72%),repeating-linear-gradient(65deg,#000 0 1px,transparent 1px 4px);-webkit-mask-composite:source-in;-webkit-mask-image:radial-gradient(circle at var(--mx) var(--my),#000,#00000059 38%,transparent 72%),repeating-linear-gradient(65deg,#000 0 1px,transparent 1px 4px);mask-image:radial-gradient(circle at var(--mx) var(--my),#000,#00000059 38%,transparent 72%),repeating-linear-gradient(65deg,#000 0 1px,transparent 1px 4px);mix-blend-mode:screen;opacity:.16;transition:opacity .4s;-webkit-mask-composite:source-in;mask-composite:intersect}.id-card:hover .id-foil{opacity:.95}.id-glare{background:radial-gradient(circle at var(--mx) var(--my),#fff3,#ff2e6324 20%,#6b9bd114 40%,transparent 62%);mix-blend-mode:screen;opacity:0;transition:opacity .35s}.id-card:hover .id-glare{opacity:1}.id-card>:not(.id-fx){z-index:1;position:relative}.id-top{align-items:center;gap:9px;display:flex}.id-chip{width:36px;height:27px;translate:calc(var(--px) * -3px) calc(var(--py) * -3px);background:linear-gradient(135deg,#f3f4f7,#9aa0ab 45%,#e1e4ea 60%,#7d838e);border-radius:6px;display:block;position:relative;overflow:hidden;box-shadow:inset 0 0 0 1px #00000047,0 2px 6px #0006}.id-chip:before,.id-chip:after,.id-chip i{content:"";border:1px solid #00000052;position:absolute}.id-chip:before{border-radius:3px;inset:6px 11px}.id-chip:after{border-width:1px 0 0;top:50%;left:0;right:0}.id-chip i{border-width:0 0 0 1px;top:0;bottom:0;left:50%}.id-card:hover .id-chip{background:linear-gradient(135deg,#fff,#a6acb6 40%,#ffe9b0 55%,#8a909b)}.id-nfc{color:var(--dim);transition:color .3s;transform:rotate(90deg)}.id-card:hover .id-nfc{color:var(--ink);filter:drop-shadow(0 0 6px #6b9bd1cc)}.id-issuer{align-items:center;gap:8px;margin-left:auto;display:flex}.id-seal{background:conic-gradient(from var(--angle),var(--spectrum));opacity:.55;border-radius:50%;place-items:center;width:26px;height:26px;transition:opacity .3s,box-shadow .3s;display:grid;position:relative;box-shadow:0 0 0 1px #ffffff26}.id-seal:before{content:"";background:#11131a;border-radius:50%;position:absolute;inset:2px}.id-seal svg{position:relative}.id-card:hover .id-seal{opacity:1;box-shadow:0 0 14px #ff2e638c,0 0 0 1px #ffffff4d}.id-wordmark{font-family:var(--font-brand);letter-spacing:.01em;font-size:15px}.id-main{flex:1 0 auto;align-items:center;gap:14px;padding:8px 0;display:flex}.id-avatar{width:86px;height:86px;translate:calc(var(--px) * 10px) calc(var(--py) * 8px);flex-shrink:0;place-items:center;transition:translate .2s ease-out;display:grid;position:relative}.id-orbit{border:1px dashed #ffffff38;border-radius:50%;transition:border-color .3s;animation:18s linear infinite spin;position:absolute;inset:0}.id-orbit:before{content:"";background:var(--hot);width:6px;height:6px;box-shadow:0 0 10px var(--hot);border-radius:50%;position:absolute;top:-3px;left:calc(50% - 3px)}.id-card:hover .id-orbit{border-color:#ff5a7eb3;animation-duration:4s}.id-avatar .sigil{filter:drop-shadow(0 0 18px #6b9bd159);transition:filter .35s;position:relative}.id-card:hover .id-avatar .sigil{filter:drop-shadow(-3px 0 #6b9bd1b3)drop-shadow(3px 0 #ff2e63b3)drop-shadow(0 0 24px #ff2e6373)}.id-info{min-width:0;translate:calc(var(--px) * 5px) calc(var(--py) * 4px);flex-direction:column;flex:1;gap:4px;transition:translate .2s ease-out;display:flex}.id-label{color:var(--faint);letter-spacing:.28em;text-transform:uppercase;font-size:8px}.id-name{font-family:var(--font-display);letter-spacing:-.02em;overflow-wrap:anywhere;font-size:15px;font-weight:500;line-height:1.22}.id-card:hover .id-name{background:linear-gradient(100deg,#fff 30%,#ffc2d1,#bcd6f2,#fff 70%) var(--mx) 0/220% 100%;color:#0000;-webkit-background-clip:text;background-clip:text}.id-email{color:var(--muted);overflow-wrap:anywhere;font-size:10.5px;line-height:1.4}.id-meta{flex-wrap:wrap;align-items:center;gap:6px;margin-top:5px;display:flex}.id-meta>span{border:1px solid var(--line-strong);height:20px;color:var(--dim);letter-spacing:.16em;text-transform:uppercase;white-space:nowrap;background:#00000040;border-radius:999px;align-items:center;gap:6px;padding:0 8px;font-size:8.5px;display:inline-flex}.id-meta b{color:var(--ink);font-weight:500}.id-meta .id-session{color:var(--mint);border-color:#38d9a94d}.id-session i{background:var(--mint);width:5px;height:5px;box-shadow:0 0 8px var(--mint);border-radius:50%;animation:1.8s infinite pulse}.id-strip{border-top:1px dashed #ffffff1a;flex-direction:column;gap:6px;padding-top:8px;display:flex}.id-strip-head{justify-content:space-between;align-items:center;gap:10px;display:flex}.id-listen{color:var(--faint);letter-spacing:.26em;text-transform:uppercase;background:0 0;border:0;border-radius:6px;align-items:center;gap:6px;margin:-4px 0 -4px -4px;padding:4px;font-size:7.5px;transition:color .2s;display:inline-flex}.id-listen:hover:not(:disabled),.id-strip.is-playing .id-listen{color:var(--rose)}.id-listen:focus-visible{outline:1px solid var(--rose);outline-offset:1px}.id-listen:disabled{cursor:not-allowed}.id-number{color:var(--dim);letter-spacing:.2em;font-size:9px}.id-number b{color:var(--ink);letter-spacing:.24em;text-shadow:0 -1px #ffffff59,0 1px #000c;font-size:12px;font-weight:500}.id-wave{cursor:pointer;align-items:center;gap:2px;height:24px;display:flex;position:relative}.id-wave i{height:calc(var(--h) * 100%);background-color:#ffffff42;background-size:calc(var(--n) * 100%) 100%;background-position:calc(var(--i) / (var(--n) - 1) * 100%) 0;border-radius:2px;flex:1;min-height:2px;transition:background-color .3s}.id-wave:after{content:"";width:2px;box-shadow:0 0 8px #fff,0 0 16px var(--hot);opacity:0;pointer-events:none;background:#fff;border-radius:2px;position:absolute;top:-3px;bottom:-3px;left:0}.id-card:hover .id-wave i{background-color:#0000;background-image:linear-gradient(90deg,var(--spectrum));animation:.8s ease-in-out infinite alternate id-wave;animation-delay:calc(var(--i) * -47ms);box-shadow:0 0 6px -1px #ff2e6380}.id-strip.is-playing .id-wave:after{opacity:1;animation:id-playhead var(--d) linear forwards}.id-strip.is-playing .id-wave i{background-color:#0000;background-image:linear-gradient(90deg,var(--spectrum));animation:.6s cubic-bezier(.2,.7,.3,1) id-hit;animation-delay:calc(var(--i) / (var(--n) - 1) * var(--d))}@keyframes id-wave{to{transform:scaleY(.45)}}@keyframes id-hit{0%{filter:brightness(1.9)drop-shadow(0 0 4px #ffffffe6);transform:scaleY(1.6)}}@keyframes id-playhead{0%{left:0}to{left:calc(100% - 2px)}}.id-card:hover .id-info{text-shadow:0 1px 10px #000000d9}@container (max-width:300px){.id-main{gap:10px;padding:6px 0}.id-avatar{width:62px;height:62px}.id-avatar .sigil{width:50px;height:50px}.id-label{display:none}.id-name{font-size:13px}.id-email{font-size:9.5px}.id-meta>span{height:18px;padding:0 6px;font-size:7.5px}.id-wordmark{font-size:13px}}@media (prefers-reduced-motion:reduce){.id-card *,.id-card{translate:none!important}}