*{box-sizing:border-box;margin:0;padding:0}body{color:#333;background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);min-height:100vh;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,sans-serif}.container{max-width:800px;margin:0 auto;padding:40px 20px}.card{background:#fff;border-radius:12px;padding:40px;box-shadow:0 20px 60px #0000004d}h1{text-align:center;color:#333;margin-bottom:10px;font-size:2.5rem}.subtitle{text-align:center;color:#666;margin-bottom:30px}.form-group{margin-bottom:20px}label{color:#555;margin-bottom:8px;font-weight:500;display:block}input[type=url]{border:2px solid #e0e0e0;border-radius:8px;width:100%;padding:12px 16px;font-size:16px;transition:border-color .2s}input[type=url]:focus{border-color:#667eea;outline:none}button{color:#fff;cursor:pointer;background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);border:none;border-radius:8px;width:100%;padding:14px;font-size:16px;font-weight:600;transition:transform .2s,box-shadow .2s}button:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 8px 20px #667eea66}button:disabled{opacity:.7;cursor:not-allowed}.loading{text-align:center;padding:40px}.spinner{border:4px solid #f3f3f3;border-top-color:#667eea;border-radius:50%;width:40px;height:40px;margin:0 auto 20px;animation:1s linear infinite spin}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.error{color:#c33;background:#fee;border:1px solid #fcc;border-radius:8px;margin-bottom:20px;padding:16px}.results{margin-top:30px}.results h2{color:#333;margin-bottom:20px}.metrics-grid{grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:20px;margin-bottom:30px;display:grid}.metric-card{text-align:center;background:#f8f9fa;border-radius:8px;padding:20px}.metric-value{color:#667eea;margin-bottom:5px;font-size:2rem;font-weight:700}.metric-label{color:#666;font-size:14px}.metadata{background:#f8f9fa;border-radius:8px;padding:20px}.metadata h3{color:#333;margin-bottom:15px}.metadata-item{margin-bottom:10px}.metadata-item strong{color:#555}.metadata-value{color:#333;margin-left:10px}.url-display{word-break:break-all;color:#667eea}.status-ok{color:#4caf50}.status-error{color:#f44336}footer{text-align:center;margin-top:40px;padding:20px}footer a{color:#fff;opacity:.9;font-weight:500;text-decoration:none;transition:opacity .2s}footer a:hover{opacity:1;text-decoration:underline}