ux: redesign copy link as url field with copy button

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

Author: dotsystemsdevs

src/components/CertificateCard.tsx

@@ -569,20 +569,47 @@ export default function CertificateCard({ cert, onReset }: Props) {
         )}
 
         {!showInlineShare && (
-          <button
-            type="button"
-            onClick={handleCopyLink}
-            className="cert-btn-secondary"
+          <div
             style={{
-              fontFamily: UI, fontSize: '13px', fontWeight: 600,
-              width: '100%', height: '44px', background: '#FAF6EF', color: '#0a0a0a',
-              border: '2px solid #0a0a0a', cursor: 'pointer',
-              display: 'flex', alignItems: 'center', justifyContent: 'center',
-              gap: '6px', letterSpacing: '0.02em',
+              display: 'flex',
+              alignItems: 'center',
+              border: '2px solid #0a0a0a',
+              background: '#FAF6EF',
+              overflow: 'hidden',
             }}
           >
-            {copied ? 'Copied ✓' : 'Copy link'}
-          </button>
+            <span style={{
+              fontFamily: `var(--font-courier), 'Courier New', monospace`,
+              fontSize: '12px',
+              color: '#5f5f5f',
+              flex: 1,
+              padding: '0 12px',
+              overflow: 'hidden',
+              textOverflow: 'ellipsis',
+              whiteSpace: 'nowrap',
+            }}>
+              {shareUrl}
+            </span>
+            <button
+              type="button"
+              onClick={handleCopyLink}
+              style={{
+                fontFamily: UI, fontSize: '12px', fontWeight: 700,
+                flexShrink: 0,
+                height: '40px',
+                padding: '0 14px',
+                background: copied ? '#2a5a2a' : '#0a0a0a',
+                color: '#fff',
+                border: 'none',
+                borderLeft: '2px solid #0a0a0a',
+                cursor: 'pointer',
+                letterSpacing: '0.04em',
+                transition: 'background 0.15s',
+              }}
+            >
+              {copied ? '✓' : 'Copy'}
+            </button>
+          </div>
         )}
 
         {/* Export error */}