.id-hang{--mx:32%;--my:22%;--rx:0deg;--ry:0deg;--id-ink:#1c1f23;--id-chip:#e9edf1;--id-rule:#14191e3d;--id-emboss:#ffffffb3;--id-metal:linear-gradient(130deg, #9aa1a9 0%, #e9edf1 16%, #b3b9c0 30%, #f7f9fb 44%, #a2a9b1 58%, #e3e7eb 72%, #8f969e 86%, #d5dade 100%);width:30em;color:var(--id-ink);transform-origin:50% 0;justify-self:center;padding-top:12em;font-size:min(10px,3.33333vw - 1.33333px);animation:6s ease-in-out infinite id-sway;position:relative}@keyframes id-sway{0%,to{transform:rotate(-1.2deg)}50%{transform:rotate(1.2deg)}}.id-hang.live,.idle .id-hang,.still .id-hang{animation-play-state:paused}.id-strap{background:repeating-linear-gradient(0deg,#00000012 0 1px,#0000 1px 3px),repeating-linear-gradient(90deg,#ffffff0f 0 1px,#0000 1px 2px),linear-gradient(90deg,#1b1712,#2c261f 30%,#332c24 50%,#2a241d 70%,#17130f);border-radius:0 0 .4em .4em;width:3em;height:9em;position:absolute;top:0;left:50%;overflow:hidden;transform:translate(-50%);-webkit-mask-image:linear-gradient(#0000,#000 35%);mask-image:linear-gradient(#0000,#000 35%)}.id-strap span{writing-mode:vertical-rl;white-space:nowrap;font:600 1em/1 var(--mono);letter-spacing:.32em;color:var(--amber);position:absolute;top:1em;left:50%;transform:translate(-50%)}.id-clip{z-index:3;background:linear-gradient(90deg,#8c939b,#f4f6f8 28%,#b5bcc4 52%,#eef1f4 72%,#7d848c);border-radius:.8em .8em .6em .6em;width:4em;height:3.4em;position:absolute;top:8em;left:50%;transform:translate(-50%);box-shadow:inset 0 1px #ffffffe6,inset 0 -2px 3px #00000040,0 4px 6px #0000004d}.id-clip:before{content:"";background:linear-gradient(#2b2e33,#55595f);border-radius:.4em;height:1em;position:absolute;top:.5em;left:.7em;right:.7em;box-shadow:inset 0 1px 2px #0009}.id-clip i{background:radial-gradient(circle at 35% 35%,#fff,#a3a9b0 60%,#6b7178);border-radius:50%;width:.9em;height:.9em;position:absolute;bottom:.6em;left:50%;transform:translate(-50%);box-shadow:0 1px 1px #00000059}.id-tongue{z-index:3;background:linear-gradient(90deg,#7f868e,#e9ecef 35%,#aab1b9 60%,#dfe3e7 80%,#737a82);border-radius:0 0 .9em .9em;width:2.6em;height:3.2em;position:absolute;top:11em;left:50%;transform:translate(-50%);box-shadow:0 3px 4px #00000059}.id-lift{perspective:1100px;filter:drop-shadow(0 3.4em 2.6em #281e0f38)drop-shadow(0 .6em .6em #281e0f38)}.id-card{width:30em;height:48em;transform:rotateX(var(--rx)) rotateY(var(--ry));border-radius:1.8em;transition:transform .5s cubic-bezier(.2,.8,.2,1);position:relative;overflow:hidden;-webkit-mask:url(/id-card-mask.svg) 50%/100% 100% no-repeat;mask:url(/id-card-mask.svg) 50%/100% 100% no-repeat}.id-hang.live .id-card{transition:transform .12s ease-out}.still .id-card{transition:none;transform:none}@media (prefers-reduced-motion:reduce){.id-hang{animation:none}.id-card{transform:none}}.id-layer{pointer-events:none;position:absolute;inset:0}.id-metal{background:var(--id-metal);background-size:220% 220%;background-position:var(--mx) var(--my)}.id-brush{opacity:.55;mix-blend-mode:overlay;background-image:url(/id-card-brush.svg);background-size:100% 100%}.id-holo{opacity:.42;mix-blend-mode:color-dodge;background:linear-gradient(118deg,#0000 18%,#ff8ad8 32%,#8af6ff 42%,#fff38a 52%,#b79bff 62%,#ff8ad8 72%,#0000 86%) 0 0/300% 300%;background-position:calc(100% - var(--mx)) calc(100% - var(--my))}.id-hang.live .id-holo{opacity:.62}.id-sheen{opacity:.5;mix-blend-mode:overlay;background:linear-gradient(105deg,#0000 38%,#ffffffb3 46%,#0000 54%) 0 0/260% 100%;background-position:var(--mx) 0}.id-glare{mix-blend-mode:soft-light;background:radial-gradient(circle at var(--mx) var(--my), #fffffff2, #ffffff40 28%, transparent 60%)}.id-edge{border-radius:1.8em;box-shadow:inset 0 1.5px #ffffffd9,inset 0 -2px #0000002e,inset 1.5px 0 #ffffff80,inset -1.5px 0 #0000001f,inset 0 0 0 1px #00000014}.id-slot{border-radius:.7em;width:5.2em;height:1.3em;position:absolute;top:1.5em;left:12.4em;box-shadow:0 1px #fffc,0 -1px #00000040}.id-face{align-content:start;justify-items:center;padding:4.4em 2.4em 2.2em;display:grid;position:absolute;inset:0}.id-brand{justify-content:space-between;align-items:center;width:100%;display:flex}.id-brand img{width:15em;height:auto;image-rendering:pixelated;mix-blend-mode:multiply}.id-brand b{background:var(--id-ink);color:var(--id-chip);font:600 1em var(--mono);letter-spacing:.2em;border-radius:.4em;padding:.4em .7em .3em}.id-kicker{border-top:1px solid var(--id-rule);width:100%;font:.9em var(--mono);letter-spacing:.28em;margin-top:.7em;padding-top:.6em}.id-portrait{width:16.8em;height:19.6em;box-shadow:inset 0 0 0 1px var(--id-rule), 0 1px 0 #fff9;background:#ffffff8c;border-radius:.6em;margin-top:1.4em;padding:.5em;position:relative}.id-portrait>img{object-fit:cover;filter:saturate(.9)contrast(1.03);border-radius:.3em;width:100%;height:100%;display:block}.id-seal{background:conic-gradient(from calc(var(--ry) * 14), #ffc3ec, #b6fbff, #fff7b8, #d2c2ff, #ffc3ec);border-radius:50%;place-items:center;width:6.6em;height:6.6em;display:grid;position:absolute;bottom:-1.8em;right:-2.2em;box-shadow:inset 0 0 0 2px #ffffffb3,inset 0 0 12px #fff9,0 2px 5px #00000040}.id-seal:after{content:"";background:radial-gradient(circle at var(--mx) var(--my), #ffffffe6, transparent 55%);mix-blend-mode:soft-light;border-radius:50%;position:absolute;inset:0}.id-seal img{z-index:1;width:3.6em;height:auto;image-rendering:pixelated;filter:drop-shadow(0 1px #fff9);position:relative}.id-name{font:600 2.4em/1.05 var(--sans);letter-spacing:.03em;text-align:center;text-shadow:0 1px 0 var(--id-emboss);margin-top:.7em}.id-role{font:600 1.1em var(--mono);letter-spacing:.34em;margin-top:.6em}.id-fields{border-block:1px solid var(--id-rule);grid-template-columns:1fr 1fr 1fr;width:100%;margin-top:1.4em;display:grid}.id-fields div{font:600 1.2em/1.2 var(--mono);text-align:center;padding:.6em 0 .5em}.id-fields div+div{border-left:1px solid var(--id-rule)}.id-fields small{font:.67em var(--mono);letter-spacing:.22em;margin-bottom:.2em;display:block}.id-code{align-items:center;gap:1em;width:100%;margin-top:1.2em;display:flex}.id-bars{background:repeating-linear-gradient(90deg, var(--id-ink) 0 2px, transparent 2px 4px, var(--id-ink) 4px 5px, transparent 5px 8px, var(--id-ink) 8px 11px, transparent 11px 12px, var(--id-ink) 12px 13px, transparent 13px 16px);flex:1;height:2.6em}.id-code span{font:1em var(--mono);letter-spacing:.14em}