@import url('/assets/card-reference.css');
#card-extra[hidden]{display:none!important}
.card-demo-note{color:#715d2b;background:#fff4d9;font-size:12px;line-height:1.4;padding:5px 9px;margin:0 0 12px;border-radius:3px}
.card-visual-column{min-width:0;padding:0 15px;align-self:start;pointer-events:none}
.card-visual-column .jp-card-container{width:350px;max-width:100%;height:200px}
.card-visual-column .jp-card{height:180px;min-width:0;border-radius:2px;box-shadow:none;transform-origin:center center;font-size:14px}
.card-visual-column .jp-card .jp-card-front .jp-card-lower .jp-card-number{font-size:16px}
.card-visual-column .jp-card .jp-card-front .jp-card-lower .jp-card-name{font-size:14px;width:66%}
.test-card-help{font-size:13px;color:#626778;margin:20px 0 16px;line-height:1.7}.test-card-help summary{cursor:pointer;color:#6f0050;text-decoration:underline}.test-card-help p{margin:10px 0}.test-card-help code{font-size:13px;white-space:nowrap}
.card-demo-page{max-width:1000px;margin:30px auto;padding:0 18px 40px}.card-demo-page>h1{font-size:24px;font-weight:400}
.card-fields-reveal{animation:card-fields-in .28s ease-out both}
@keyframes card-fields-in{from{opacity:0;transform:translateY(-5px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:991px){.card-visual-column{display:none}}
@media(prefers-reduced-motion:reduce){.card-fields-reveal{animation:none}.card-visual-column *,.card-visual-column *:before,.card-visual-column *:after{transition:none!important;animation:none!important}}