.page{color:#fff;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;min-height:100vh;margin:-32px -20px 0}.pageHeader{max-width:1600px;margin:0 auto;padding:64px 40px 16px}.pageHeader h1{letter-spacing:-.02em;color:#fff;font-family:Instrument Serif,serif;font-size:clamp(2rem,4vw,3.2rem);font-weight:400}.pageHeader p{color:#777;max-width:560px;margin-top:12px;font-family:Albert Sans,sans-serif;font-size:.95rem;font-weight:300;line-height:1.6}.hint{color:#555;letter-spacing:.02em;margin-top:8px;font-family:Albert Sans,sans-serif;font-size:.75rem;font-weight:400}.loadingScreen{justify-content:center;align-items:center;min-height:60vh;display:flex}.loadingText{letter-spacing:.04em;color:#555;font-family:system-ui,-apple-system,sans-serif;font-size:.85rem;font-weight:400}.grid{opacity:0;grid-template-columns:repeat(4,1fr);gap:20px;max-width:1600px;margin:0 auto;padding:40px 40px 120px;transition:opacity .4s;display:grid}.grid.ready{opacity:1}.cardWrapper{perspective:900px;cursor:pointer}.card{transform-style:preserve-3d;border-radius:14px;transition:transform .5s cubic-bezier(.4,0,.2,1);position:relative}.card.flipped{transform:rotateY(180deg)}.cardWrapper:hover .card:not(.flipped){transform:translateY(-3px)}.cardWrapper:hover .card.flipped{transform:rotateY(180deg)translateY(-3px)}.cardFront,.cardBack{backface-visibility:hidden;border-radius:14px;overflow:hidden}.cardFront{flex-direction:column;min-height:380px;padding:36px 32px;display:flex;position:relative}.cardBack{flex-direction:column;padding:36px 32px;display:flex;position:absolute;inset:0;transform:rotateY(180deg)}.backLabel{letter-spacing:.12em;text-transform:uppercase;opacity:.4;margin-bottom:16px;font-family:Albert Sans,sans-serif;font-size:.6rem;font-weight:500}.specBlock{opacity:.8;white-space:pre-wrap;word-break:break-word;flex:1;min-height:0;font-family:Albert Sans,monospace;font-size:.72rem;line-height:1.75;overflow-y:auto}.specBlock strong{opacity:1;font-weight:600}.copyIcon{width:30px;height:30px;color:inherit;cursor:pointer;opacity:.5;z-index:2;background:#ffffff0f;border:none;border-radius:7px;justify-content:center;align-items:center;transition:opacity .2s,background .2s;display:flex;position:absolute;top:16px;right:16px}.copyIcon:hover{background:#ffffff24;opacity:1!important}.copyIcon:active{transform:scale(.9)}.copyIcon svg{width:15px;height:15px}.cardNumber{letter-spacing:.14em;text-transform:uppercase;opacity:.4;margin-bottom:20px;font-family:Albert Sans,sans-serif;font-size:.65rem;font-weight:500}.pairingName{letter-spacing:.06em;text-transform:uppercase;opacity:.55;margin-bottom:16px;font-family:Albert Sans,sans-serif;font-size:.72rem;font-weight:500}.headingSample{letter-spacing:-.02em;margin-bottom:20px;font-size:clamp(1.5rem,2.2vw,2rem);line-height:1.08}.bodySample{opacity:.75;font-size:.88rem;line-height:1.68}.popupOverlay{z-index:100;background:#0009;justify-content:center;align-items:center;animation:.25s overlayIn;display:flex;position:fixed;inset:0}.popupContent{background:#1a1a1a;border:1px solid #ffffff1f;border-radius:12px;width:90%;max-width:400px;padding:20px 24px;animation:.3s cubic-bezier(.16,1,.3,1) popupIn;box-shadow:0 16px 48px #00000080}@keyframes overlayIn{0%{opacity:0}to{opacity:1}}@keyframes popupIn{0%{opacity:0;transform:scale(.95)translateY(8px)}to{opacity:1;transform:scale(1)translateY(0)}}.popupHeader{justify-content:space-between;align-items:center;margin-bottom:16px;display:flex}.popupTitle{color:#ffffff80;font-family:Albert Sans,sans-serif;font-size:.82rem;font-weight:500}.popupClose{color:#ffffff80;cursor:pointer;background:0 0;border:none;padding:0 4px;font-size:20px;line-height:1}.popupClose:hover{color:#fff}.popupSpec{color:#fffc;white-space:pre-wrap;margin:0;font-family:SF Mono,Menlo,monospace;font-size:12px;line-height:1.7}@media (max-width:1200px){.grid{grid-template-columns:repeat(3,1fr)}}@media (max-width:860px){.grid{grid-template-columns:repeat(2,1fr);gap:16px;padding:32px 20px 80px}.pageHeader{padding:48px 20px 12px}.cardFront,.cardBack{padding:28px 24px}.headingSample{font-size:1.35rem}}@media (max-width:520px){.grid{grid-template-columns:1fr}}