:root{--bg-primary: #000000;--bg-secondary: #0a0a0a;--bg-card: #111111;--border: #1f1f1f;--border-hover: #333333;--text-primary: #ffffff;--text-secondary: #888888;--text-muted: #555555;--btn-bg: #ffffff;--btn-text: #000000;--btn-hover: #e5e5e5;--accent: #ffffff;--error: #ff4444;--success: #00cc88;--radius: 8px;--radius-lg: 12px}*{box-sizing:border-box;margin:0;padding:0}body{font-family:IBM Plex Sans,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;background:var(--bg-primary);color:var(--text-primary);font-size:.875rem;line-height:1.5;-webkit-font-smoothing:antialiased}.app{min-height:100vh;display:flex;flex-direction:column}.header{padding:1.5rem;border-bottom:1px solid var(--border)}.logo{display:flex;align-items:center;gap:.5rem;font-weight:600;font-size:1.125rem}.logo svg{color:var(--accent)}.main{flex:1;display:flex;align-items:center;justify-content:center;padding:2rem 1rem}.container{width:100%;max-width:560px}.hero{text-align:center;margin-bottom:2.5rem}.hero h1{font-size:2rem;font-weight:600;margin-bottom:.5rem}.hero p{color:var(--text-secondary);font-size:1rem}.form{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:1.5rem}.form-group{margin-bottom:1rem}.form-group:last-of-type{margin-bottom:1.5rem}label{display:block;font-weight:500;font-size:.875rem;margin-bottom:.5rem;color:var(--text-primary)}input,textarea{width:100%;padding:.625rem .75rem;background:var(--bg-secondary);border:1px solid var(--border);border-radius:var(--radius);color:var(--text-primary);font-family:inherit;font-size:.875rem;transition:border-color .2s}input:focus,textarea:focus{outline:none;border-color:var(--border-hover)}input:disabled,textarea:disabled{opacity:.5;cursor:not-allowed}textarea{resize:vertical;min-height:72px}.btn-primary{width:100%;height:44px;background:var(--btn-bg);color:var(--btn-text);border:none;border-radius:var(--radius);font-family:inherit;font-size:.875rem;font-weight:500;cursor:pointer;transition:background .2s;display:flex;align-items:center;justify-content:center;gap:.5rem}.btn-primary:hover:not(:disabled){background:var(--btn-hover)}.btn-primary:disabled{opacity:.7;cursor:not-allowed}.btn-secondary{width:100%;height:44px;background:transparent;color:var(--text-primary);border:1px solid var(--border);border-radius:var(--radius);font-family:inherit;font-size:.875rem;font-weight:500;cursor:pointer;transition:border-color .2s}.btn-secondary:hover{border-color:var(--border-hover)}.spinner{width:16px;height:16px;border:2px solid var(--btn-text);border-top-color:transparent;border-radius:50%;animation:spin .6s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.error-message{margin-top:1rem;padding:.75rem;background:#ff44441a;border:1px solid var(--error);border-radius:var(--radius);color:var(--error);font-size:.875rem}.result-card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:1.5rem;animation:fadeIn .3s ease-in}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.result-header{display:flex;align-items:center;gap:.5rem;margin-bottom:1.5rem;color:var(--success);font-weight:500}.result-content{margin-bottom:1.5rem}.short-url-container{display:flex;gap:.75rem;margin-bottom:1rem}.short-url{flex:1;padding:.75rem;background:var(--bg-secondary);border:1px solid var(--border);border-radius:var(--radius);font-family:IBM Plex Mono,monospace;font-size:.875rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.btn-copy{padding:0 1rem;background:transparent;color:var(--text-primary);border:1px solid var(--border);border-radius:var(--radius);font-family:inherit;font-size:.875rem;font-weight:500;cursor:pointer;transition:border-color .2s;display:flex;align-items:center;gap:.375rem;white-space:nowrap}.btn-copy:hover{border-color:var(--border-hover)}.destination-url{display:flex;align-items:center;gap:.5rem;color:var(--text-secondary);font-size:.875rem}.destination-url svg{flex-shrink:0}@media (max-width: 640px){.hero h1{font-size:1.5rem}.form{padding:1.25rem}.short-url-container{flex-direction:column}.btn-copy{width:100%;justify-content:center}}