:root{--primary-color: #7b68ee;--primary-hover: #6250cd;--bg-color: #f6f7f9;--surface-color: #ffffff;--text-main: #292d34;--text-secondary: #7e828e;--border-color: #e6e9ee;--success-color: #2ec96c;--error-color: #e04f5e;--shadow-sm: 0 1px 3px rgba(0,0,0,.05);--shadow-md: 0 4px 12px rgba(0,0,0,.08);--radius: 12px}body{margin:0;font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;-webkit-font-smoothing:antialiased;background-color:var(--bg-color);color:var(--text-main);min-height:100vh}h1,h2,h3,h4,h5{margin:0;font-weight:600;color:var(--text-main)}*{box-sizing:border-box}.app-layout{display:flex;flex-direction:column;min-height:100vh}.main-content{max-width:900px;width:100%;margin:40px auto;padding:0 20px}.navbar{background:var(--surface-color);padding:16px 30px;border-bottom:1px solid var(--border-color);display:flex;align-items:center}.nav-brand{display:flex;align-items:center;font-weight:700;font-size:1.2rem;color:var(--text-main);gap:10px}.logo-icon{background:var(--primary-color);color:#fff;width:32px;height:32px;border-radius:8px;display:flex;align-items:center;justify-content:center;font-weight:800}.pro-badge{background:#f0ebff;color:var(--primary-color);font-size:.7rem;padding:2px 6px;border-radius:4px;margin-left:8px;text-transform:uppercase;letter-spacing:.5px}.card{background:var(--surface-color);border-radius:var(--radius);box-shadow:var(--shadow-sm);border:1px solid var(--border-color);padding:30px;transition:box-shadow .2s}.card:hover{box-shadow:var(--shadow-md)}.card-header{margin-bottom:20px}.subtitle{color:var(--text-secondary);font-size:.95rem;margin-top:5px}.input-area{width:100%;border:1px solid var(--border-color);border-radius:8px;padding:15px;font-size:.95rem;font-family:Inter,monospace;background:#fff;color:var(--text-main);resize:vertical;transition:border-color .2s,box-shadow .2s;outline:none}.input-area:focus{border-color:var(--primary-color);box-shadow:0 0 0 3px #7b68ee26}.action-bar{margin-top:20px;display:flex;justify-content:flex-end}.btn{padding:10px 24px;border-radius:8px;font-weight:600;cursor:pointer;transition:all .2s;font-size:.95rem;border:none}.btn-primary{background-color:var(--primary-color);color:#fff;box-shadow:0 2px 4px #7b68ee4d}.btn-primary:hover:not(:disabled){background-color:var(--primary-hover);transform:translateY(-1px)}.btn-primary:disabled{background-color:#bdc3c7;cursor:not-allowed;box-shadow:none}.btn-outline{background:transparent;border:1px solid var(--border-color);color:var(--text-secondary);margin-left:8px;padding:8px 16px;font-size:.85rem}.btn-outline:hover{border-color:var(--primary-color);color:var(--primary-color);background:#f8f6ff}.results-wrapper{margin-top:40px}.results-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.result-card{background:var(--surface-color);border:1px solid var(--border-color);border-radius:8px;padding:16px;margin-bottom:12px;display:flex;align-items:flex-start;gap:15px}.result-card.success{border-left:4px solid var(--success-color)}.result-card.error{border-left:4px solid var(--error-color)}.result-url{font-size:.85rem;color:var(--primary-color);font-weight:600;display:block;margin-bottom:4px}.result-text{font-size:.95rem;color:var(--text-main);line-height:1.5}.error-text{color:var(--error-color);font-size:.9rem}.error-banner{background:#fff5f5;color:var(--error-color);padding:12px;border-radius:8px;margin-top:15px;font-size:.9rem;font-weight:600;border:1px solid #fed7d7}.loading-spinner{width:40px;height:40px;border:3px solid #f3f3f3;border-top:3px solid var(--primary-color);border-radius:50%;animation:spin 1s linear infinite;margin:30px auto}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}