:root{--color-bg: #111827;--color-bg-secondary: #1f2937;--color-accent: #10b981;--color-accent-hover: #059669;--color-text: #ffffff;--color-text-secondary: #9ca3af;--color-border: #374151;--color-error-bg: #2c1619;--color-error-text: #ef4444;--color-error-border: #451e23}body{margin:0;font-family:system-ui,-apple-system,sans-serif;text-transform:lowercase}.container{min-height:100vh;background:linear-gradient(to bottom right,var(--color-bg),var(--color-bg-secondary));display:flex;align-items:center;justify-content:center;padding:0 1rem}.content{width:100%;max-width:28rem}.header{text-align:center;margin-bottom:2rem}.logo-container{display:flex;justify-content:center;margin-bottom:1rem}.logo{width:3rem;height:3rem;color:var(--color-accent)}.title{color:var(--color-text);font-size:2.5rem;font-weight:700;margin:0 0 .5rem}.subtitle{color:var(--color-text-secondary);margin:0}.form{background:var(--color-bg-secondary);border-radius:.5rem;padding:1rem;box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -1px #0000000f;box-sizing:border-box;width:100%}.form-group{margin-bottom:1rem;width:100%;box-sizing:border-box}.custom-url-group{margin-top:.75rem}.label{display:block;color:var(--color-text-secondary);font-size:.875rem;margin-bottom:.375rem}.input-group{display:flex;align-items:stretch;width:100%;box-sizing:border-box}.prefix{display:flex;align-items:center;background:var(--color-bg);color:var(--color-text-secondary);padding:.5rem .75rem;border:1px solid var(--color-border);border-right:none;border-radius:.375rem 0 0 .375rem;font-size:.875rem;white-space:nowrap;box-sizing:border-box}.input{display:block;width:100%;min-width:0;background:var(--color-bg);color:var(--color-text);padding:.5rem .75rem;border:1px solid var(--color-border);border-radius:.375rem;outline:none;font-size:.875rem;line-height:1.5;box-sizing:border-box}.input:focus{border-color:var(--color-accent);box-shadow:0 0 0 2px #10b98133}.input-with-prefix{border-radius:0 .375rem .375rem 0;flex:1;min-width:0}.toggle-button{width:100%;background:transparent;color:var(--color-text-secondary);border:none;padding:.5rem;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:.5rem;font-size:.875rem;transition:color .2s}.toggle-button:hover{color:var(--color-text)}.button{width:100%;background:var(--color-accent);color:var(--color-text);border:none;border-radius:.375rem;padding:.625rem 1rem;font-weight:500;cursor:pointer;transition:all .2s;font-size:.875rem;box-sizing:border-box}.button:hover:not(:disabled){background:var(--color-accent-hover)}.button-content{display:flex;align-items:center;justify-content:center;gap:.5rem}.spinner{animation:spin 1s linear infinite;width:1rem;height:1rem}.result{margin-top:1rem;padding-top:1rem;border-top:1px solid var(--color-border);text-align:center}.result-text{color:var(--color-text-secondary);margin:0 0 .5rem;font-size:.875rem}.result-link{color:var(--color-accent);text-decoration:none;font-size:1.125rem;font-weight:500;transition:color .2s}.result-link:hover{color:var(--color-accent-hover)}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.button-group{display:flex;gap:.75rem;margin-top:.75rem}.button{flex:1;background:var(--color-accent);color:var(--color-text);border:none;border-radius:.375rem;padding:.625rem 1rem;font-weight:500;cursor:pointer;transition:all .2s;font-size:.875rem;box-sizing:border-box}.button.secondary{background:var(--color-bg);color:var(--color-text);border:1px solid var(--color-border);flex:.3}.button:not(.secondary){flex:.7}.button.secondary:hover:not(:disabled){background:var(--color-bg-secondary);border-color:var(--color-accent)}.button:disabled{opacity:.6;cursor:not-allowed}.divider{width:100%;height:1px;background:var(--color-border);margin:1rem 0}.arrow-icon{transition:transform .2s}.button:hover .arrow-icon{transform:translate(2px)}.footer{position:fixed;bottom:0;left:0;width:100%;text-align:center;padding:.5rem 0;background:var(--color-bg-secondary);color:var(--color-text-secondary);font-size:.875rem;border-top:1px solid var(--color-border)}.footer a{color:var(--color-accent);text-decoration:none;transition:color .2s}.footer a:hover{color:var(--color-accent-hover)}.result-link-container{display:flex;align-items:center;justify-content:center;gap:.5rem}.copy-button{background:none;border:none;color:var(--color-accent);cursor:pointer;padding:.25rem;display:flex;align-items:center;justify-content:center;transition:color .2s}.copy-button:hover{color:var(--color-accent-hover)}.expiry-group{margin-top:.75rem}.expiry-input-group{display:flex;gap:.75rem;width:100%}.expiry-dropdown{flex:.3}.expiry-dropdown[data-value]:not([data-value=custom]){flex:1}.custom-expiry-input{flex:.7}.error-message{color:var(--color-error-text);background-color:var(--color-error-bg);font-size:.875rem;margin-top:.5rem;font-weight:500;padding:.5rem .75rem;border-radius:.375rem;border:1px solid var(--color-error-border)}