:root{--color-primary:#4a6fa5;--color-primary-dark:#3d5a85;--color-primary-light:#5d87c6;--color-background:#ffffff;--color-background-alt:#f8f9fb;--color-surface:#f0f2f5;--color-border:#e0e3e8;--color-text:#1a1d23;--color-text-secondary:#6b7280;--color-text-tertiary:#9ca3af;--color-success:#10b981;--color-error:#ef4444;--color-warning:#f59e0b;--color-gradient-1:#f5f7fa;--color-gradient-2:#e8edf5;--spacing-xs:0.25rem;--spacing-sm:0.5rem;--spacing-md:0.75rem;--spacing-lg:1rem;--spacing-xl:1.5rem;--spacing-2xl:2rem;--spacing-3xl:2.5rem;--font-family-sans:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Oxygen,Ubuntu,Cantarell,sans-serif;--font-family-mono:'Menlo','Monaco','Courier New','JetBrains Mono',monospace;--font-size-sm:0.875rem;--font-size-base:1rem;--font-size-lg:1.125rem;--font-size-xl:1.25rem;--font-size-2xl:1.5rem;--font-weight-medium:500;--font-weight-semibold:600;--radius-md:0.5rem;--radius-lg:0.75rem;--radius-full:9999px;--shadow-sm:0 1px 2px 0 rgba(0, 0, 0, 0.05);--shadow-md:0 4px 6px -1px rgba(0, 0, 0, 0.1);--shadow-lg:0 10px 15px -3px rgba(0, 0, 0, 0.1);--transition-fast:150ms ease-in-out;--transition-base:250ms ease-in-out;--z-notification:1000;--z-buttons:10}@media (prefers-color-scheme:dark){:root{--color-background:#0d1117;--color-background-alt:#161b22;--color-surface:#1c2128;--color-border:#30363d;--color-text:#e6edf3;--color-text-secondary:#8b949e;--color-text-tertiary:#6e7681;--color-gradient-1:#1a1f26;--color-gradient-2:#18212b}}*,::after,::before{margin:0;padding:0;box-sizing:border-box}html{scroll-behavior:smooth}body{font-family:var(--font-family-sans);background-color:var(--color-background);color:var(--color-text);line-height:1.6;font-size:var(--font-size-base);transition:background-color var(--transition-base),color var(--transition-base)}code,pre{font-family:var(--font-family-mono)}a{color:var(--color-primary);text-decoration:none;transition:color var(--transition-fast)}a:hover{color:var(--color-primary-dark)}button{font-family:inherit;cursor:pointer;border:none;background:0 0}.container{display:flex;flex-direction:column;min-height:100vh;max-width:1600px;margin:0 auto;padding:0 var(--spacing-md)}.header{padding:var(--spacing-lg) var(--spacing-md);text-align:center;border-bottom:1px solid var(--color-border)}.header-content h1{font-size:var(--font-size-xl);font-weight:var(--font-weight-semibold);margin:0}.main-content{flex:1;padding:var(--spacing-2xl) var(--spacing-md)}.footer{padding:var(--spacing-xl) var(--spacing-md);border-top:1px solid var(--color-border);text-align:center;color:var(--color-text-secondary);font-size:var(--font-size-sm)}.footer p{margin:var(--spacing-xs) 0}.key-section{display:flex;gap:var(--spacing-xl);margin:var(--spacing-xl) auto;align-items:flex-start;flex:1;min-height:0;width:fit-content;max-width:100%}.metadata-panel{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--spacing-lg);flex-shrink:0;min-width:280px;max-width:600px;width:auto;position:sticky;top:var(--spacing-lg);display:flex;flex-direction:column}.metadata-panel h2{font-size:var(--font-size-lg);font-weight:var(--font-weight-semibold);margin-bottom:var(--spacing-md);padding-bottom:var(--spacing-sm);border-bottom:1px solid var(--color-border);white-space:nowrap}.metadata-item{margin-bottom:var(--spacing-md);display:flex;flex-direction:column}.metadata-item:last-child{margin-bottom:0}.metadata-item label{font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);color:var(--color-text-tertiary);margin-bottom:var(--spacing-sm);text-transform:uppercase;letter-spacing:.5px;white-space:nowrap}.metadata-value-wrapper{position:relative;display:flex;align-items:center;min-width:0;width:100%}.metadata-value-wrapper .metadata-value{flex:1;padding-right:2.5rem;min-width:0}.metadata-value,.uid-item{padding:var(--spacing-sm);background:linear-gradient(135deg,var(--color-gradient-1) 0,var(--color-gradient-2) 100%);background-size:400% 400%;border-radius:var(--radius-md);border:1px solid var(--color-border);font-size:.9375rem;animation:gradientShift 12s ease-in-out infinite}.metadata-value{display:block;word-break:break-word;overflow-wrap:break-word;white-space:pre-line;color:var(--color-text);width:100%;min-width:0}.mono-small{line-height:1.5;white-space:normal;overflow-wrap:anywhere;word-break:break-all;overflow-x:visible}#key-fingerprint{white-space:normal;word-break:keep-all;overflow-wrap:normal;display:flex;flex-wrap:wrap;gap:0;align-items:baseline}#key-fingerprint .fp-first-half,#key-fingerprint .fp-second-half{white-space:nowrap}#key-fingerprint .fp-spacer{white-space:pre;flex-shrink:0}@supports (text-wrap:balance){#key-fingerprint .fp-second-half{margin-left:0}}.copy-icon-btn{position:absolute;right:var(--spacing-sm);top:50%;transform:translateY(-50%);display:flex;align-items:center;justify-content:center;padding:.25rem;background:0 0;color:var(--color-text-secondary);border:none;cursor:pointer;opacity:.6;transition:all var(--transition-fast)}.copy-icon-btn:hover{opacity:1;color:var(--color-primary)}.copy-icon-btn svg{width:1rem;height:1rem}.uids-list{display:flex;flex-direction:column;gap:var(--spacing-sm);width:100%}.uid-item{position:relative;word-break:break-word;overflow-wrap:break-word;width:100%;padding-right:2.5rem;min-width:0}.uid-item .copy-icon-btn{position:absolute;right:var(--spacing-sm);top:50%;transform:translateY(-50%)}.uid-item .placeholder{color:var(--color-text-secondary)}.key-display-wrapper{display:flex;flex-direction:column;min-width:0;min-height:0}.key-display-container{position:relative;background:var(--color-background-alt);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--spacing-lg);overflow:hidden;box-shadow:var(--shadow-sm);display:flex;flex-direction:column;flex:1;min-height:0}.key-content{margin:0;overflow:auto;background:linear-gradient(135deg,var(--color-gradient-1) 0,var(--color-gradient-2) 100%);background-size:400% 400%;border:1px solid var(--color-border);border-radius:var(--radius-md);padding:var(--spacing-lg);font-size:.6875rem;line-height:1.5;white-space:pre;flex:1;height:100%;animation:gradientShift 12s ease-in-out infinite}.key-content code{color:var(--color-text);display:block}.action-buttons{position:absolute;top:var(--spacing-lg);right:var(--spacing-lg);display:flex;gap:var(--spacing-md);z-index:var(--z-buttons)}.action-btn{display:flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:var(--radius-md);background:var(--color-primary);color:#fff;opacity:.75;transition:all var(--transition-fast);box-shadow:var(--shadow-md)}.action-btn:hover{opacity:1;transform:translateY(-2px);box-shadow:var(--shadow-lg);background:var(--color-primary-light)}.action-btn:active{transform:translateY(0)}.action-btn svg{width:20px;height:20px}.hidden{display:none!important}.loading-container{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:var(--spacing-2xl);text-align:center}.spinner{width:40px;height:40px;border:4px solid var(--color-surface);border-top-color:var(--color-primary);border-radius:var(--radius-full);animation:spin .8s linear infinite;margin-bottom:var(--spacing-md)}.error-container{background:rgba(239,68,68,.1);border:1px solid var(--color-error);border-radius:var(--radius-lg);padding:var(--spacing-md);margin-bottom:var(--spacing-xl)}.error-message{display:flex;gap:var(--spacing-md)}.error-icon{font-size:1.25rem;flex-shrink:0}.error-message h3{font-size:var(--font-size-base);color:var(--color-error);margin-bottom:var(--spacing-xs)}.error-message p{color:var(--color-text);font-size:var(--font-size-sm)}#notification-container{position:fixed;bottom:var(--spacing-lg);right:var(--spacing-lg);z-index:var(--z-notification)}.notification{background:var(--color-surface);border:1px solid var(--color-border);border-left:4px solid var(--color-primary);border-radius:var(--radius-md);padding:var(--spacing-md) var(--spacing-lg);margin-top:var(--spacing-md);box-shadow:var(--shadow-lg);animation:slideIn var(--transition-base) ease-out;max-width:400px}.notification.success{border-left-color:var(--color-success)}.notification.error{border-left-color:var(--color-error)}.notification.hiding{animation:slideOut var(--transition-base) ease-out forwards}#key-expires-container{display:none}#key-expires-container:not(.hidden){display:flex}.metadata-value.multiline{white-space:pre-line}.notification-icon{font-weight:700;margin-right:.5rem}@keyframes gradientShift{0%,100%{background-position:0 50%}50%{background-position:100% 50%}}@keyframes spin{to{transform:rotate(360deg)}}@keyframes slideIn{from{transform:translateX(100%);opacity:0}to{transform:translateX(0);opacity:1}}@keyframes slideOut{to{transform:translateX(100%);opacity:0}}@keyframes pulse{0%,100%{transform:scale(1)}50%{transform:scale(1.1)}}.action-btn.copying{animation:pulse .5s ease-in-out}a:focus-visible,button:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}.copy-icon-btn:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px;opacity:1}.metadata-item.expired{border-left:3px solid var(--color-error);padding-left:var(--spacing-sm)}.metadata-item.expiring-soon{border-left:3px solid var(--color-warning);padding-left:var(--spacing-sm)}@media (max-width:768px){.key-section{flex-direction:column;width:100%;margin:var(--spacing-xl) 0}.metadata-panel{position:static;max-width:100%;width:100%;min-width:0;overflow:hidden}.key-content,.key-display-container,.key-display-wrapper{width:100%;max-width:100%}.key-content{padding:var(--spacing-md)}.header{padding:var(--spacing-2xl) var(--spacing-md)}.header-content h1{font-size:var(--font-size-2xl)}.main-content{padding:var(--spacing-2xl) var(--spacing-md)}.action-buttons{top:var(--spacing-md);right:var(--spacing-md);gap:var(--spacing-sm)}.action-btn{width:40px;height:40px}.action-btn svg{width:18px;height:18px}#notification-container{left:var(--spacing-lg);right:var(--spacing-lg)}.notification{max-width:100%}.mono-small{font-size:.75rem}}@media (max-width:480px){.container{padding:0 var(--spacing-sm)}.header-content h1{font-size:var(--font-size-xl)}.main-content{padding:var(--spacing-xl) var(--spacing-sm)}.metadata-panel{padding:var(--spacing-md);min-width:0}.metadata-panel h2{font-size:var(--font-size-base)}.key-display-container{padding:var(--spacing-md)}.key-content,.key-display-container,.key-display-wrapper{overflow:hidden;box-sizing:border-box}.action-buttons{flex-direction:column}.metadata-value-wrapper .metadata-value{padding-right:2rem}.copy-icon-btn{padding:.15rem;right:.25rem}.copy-icon-btn svg{width:.875rem;height:.875rem}}@media (min-width:481px) and (max-width:900px){.copy-icon-btn{position:absolute;right:.25rem;flex-shrink:0}}@media (prefers-color-scheme:dark){a:focus-visible,button:focus-visible{outline-color:var(--color-primary-light)}}@media (hover:none) and (pointer:coarse){.copy-icon-btn{opacity:1}.action-btn{min-width:48px;min-height:48px}}@media (prefers-reduced-motion:reduce){.action-btn.copying,.notification,.spinner{animation:none}*{transition:none!important}}